@linzjs/lui 23.3.0 → 23.5.0

package/CHANGELOG.md

@@ -1,3 +1,17 @@
+# [23.5.0](https://github.com/linz/lui/compare/v23.4.0...v23.5.0) (2025-07-02)
+
+
+### Features
+
+* SRVTRI-4048 add ref to toolbar button ([#1234](https://github.com/linz/lui/issues/1234)) ([f477328](https://github.com/linz/lui/commit/f4773281b9c5477c8a3fa6058b0368badb33ef00))
+
+# [23.4.0](https://github.com/linz/lui/compare/v23.3.0...v23.4.0) (2025-06-30)
+
+
+### Features
+
+* move_down icon ([#1233](https://github.com/linz/lui/issues/1233)) ([6073fcc](https://github.com/linz/lui/commit/6073fcc2fbb74f35dbb20377900027a00ab301cf))
+
 # [23.3.0](https://github.com/linz/lui/compare/v23.2.0...v23.3.0) (2025-06-26)
 
 

package/dist/assets/icons/move_down.svg

@@ -0,0 +1 @@
+<svg viewBox="0 0 24 24"><path fill="#000" d="M3 11q0 1.8 1.15 3.175A4.95 4.95 0 0 0 7.075 15.9l-.775-.775a.93.93 0 0 1-.275-.687q0-.414.275-.713.3-.3.713-.3.412 0 .712.3L10.3 16.3q.3.3.3.7t-.3.7l-2.6 2.6a.95.95 0 0 1-.7.275.99.99 0 0 1-.725-.3A.92.92 0 0 1 6 19.6q0-.4.275-.7l.9-.95q-2.65-.3-4.412-2.287Q1 13.675 1 11q0-2.925 2.038-4.962T8 4h2q.424 0 .713.287Q11 4.576 11 5q0 .424-.287.713A.97.97 0 0 1 10 6H8Q5.925 6 4.463 7.463 3 8.925 3 11m11 9a.97.97 0 0 1-.713-.288A.97.97 0 0 1 13 19v-5q0-.424.287-.713A.97.97 0 0 1 14 13h7q.424 0 .712.287.288.288.288.713v5q0 .424-.288.712A.97.97 0 0 1 21 20zm0-9a.97.97 0 0 1-.713-.287A.97.97 0 0 1 13 10V5q0-.424.287-.713A.97.97 0 0 1 14 4h7q.424 0 .712.287Q22 4.576 22 5v5q0 .424-.288.713A.97.97 0 0 1 21 11zm1-2h5V6h-5z"/></svg>

package/dist/assets/svg-content.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-export type LuiIconName = string | 'ic_account_circle' | 'ic_add' | 'ic_add_adopt' | 'ic_add_area_interest' | 'ic_add_circle' | 'ic_add_circle_outline' | 'ic_add_irregular_image' | 'ic_add_label' | 'ic_add_line' | 'ic_add_multiple' | 'ic_add_page' | 'ic_add_rectangle' | 'ic_add_rt_lines' | 'ic_add_to_csv' | 'ic_add_to_list' | 'ic_add_to_xml' | 'ic_added_to_list' | 'ic_adjustment' | 'ic_admin' | 'ic_advanced_user_search' | 'ic_alias' | 'ic_alias_unselected' | 'ic_annotations' | 'ic_apps' | 'ic_arrow_back' | 'ic_arrow_back_ios' | 'ic_arrow_back_left' | 'ic_arrow_drop_down' | 'ic_arrow_drop_right' | 'ic_arrow_drop_up' | 'ic_arrow_forward_ios' | 'ic_arrow_forward_right' | 'ic_attach_file' | 'ic_attachment' | 'ic_auth_and_instruct' | 'ic_auto_preval' | 'ic_auto_regenerate' | 'ic_balance_parcel' | 'ic_basemap_off' | 'ic_blackwhite_greyscale' | 'ic_blocked' | 'ic_border_color' | 'ic_bug' | 'ic_c_report' | 'ic_cancel_clear' | 'ic_cancel_outline' | 'ic_capture_area' | 'ic_cart_view' | 'ic_certify_and_sign' | 'ic_change_password' | 'ic_check' | 'ic_check_circle' | 'ic_check_circle_outline' | 'ic_checklist' | 'ic_clear' | 'ic_close_list' | 'ic_closest_match' | 'ic_columns' | 'ic_control_point' | 'ic_copy' | 'ic_copy_titles_to_here' | 'ic_corporate_fare' | 'ic_create' | 'ic_create_new_list' | 'ic_csv_file' | 'ic_data_display_threshold' | 'ic_data_display_threshold_high_urban' | 'ic_data_display_threshold_low_large_rural' | 'ic_data_display_threshold_medium_rural' | 'ic_dealings' | 'ic_deceased' | 'ic_deceased_fill' | 'ic_define_diagrams' | 'ic_define_nonprimary_diagram_circle' | 'ic_define_nonprimary_diagram_polygon' | 'ic_define_nonprimary_diagram_rectangle' | 'ic_define_primary_diagram_circle' | 'ic_define_primary_diagram_polygon' | 'ic_define_primary_diagram_rectangle' | 'ic_define_survey_diagram_circle' | 'ic_define_survey_diagram_polygon' | 'ic_define_survey_diagram_rectangle' | 'ic_delete_forever' | 'ic_delete_outline' | 'ic_delete_page' | 'ic_delete_solid' | 'ic_description' | 'ic_dollar_round' | 'ic_double_arrow_left' | 'ic_double_arrow_right' | 'ic_double_tick' | 'ic_drag_handle' | 'ic_drag_indicator' | 'ic_draw_abuttal' | 'ic_draw_irregular_line' | 'ic_draw_rt_bdry' | 'ic_email' | 'ic_empty_circle' | 'ic_enabled_users' | 'ic_error' | 'ic_error_outline' | 'ic_expand_less' | 'ic_expand_more' | 'ic_fast_forward' | 'ic_fast_forward_outline' | 'ic_feature_id' | 'ic_feedback_lightbulb' | 'ic_feedback_lightbulb_alt' | 'ic_file_attached' | 'ic_file_attached_outline' | 'ic_filter_list' | 'ic_flag' | 'ic_fold_in' | 'ic_fold_out' | 'ic_format_colour' | 'ic_format_lines_text' | 'ic_forward' | 'ic_fullscreen_frame' | 'ic_generate_title' | 'ic_grid_view' | 'ic_help_outline' | 'ic_history' | 'ic_hourglass' | 'ic_info' | 'ic_info_outline' | 'ic_insert_into_sheet' | 'ic_insert_invitation' | 'ic_insert_photo' | 'ic_instruments_roles' | 'ic_keyboard_arrow_down' | 'ic_keyboard_arrow_left' | 'ic_keyboard_arrow_right' | 'ic_keyboard_arrow_up' | 'ic_label_diagrams' | 'ic_label_settings' | 'ic_labels_off' | 'ic_labels_on' | 'ic_land_record_search' | 'ic_launch_modal' | 'ic_launch_new window_open' | 'ic_layers' | 'ic_layers_user_defined' | 'ic_layout_plan_sheets' | 'ic_left' | 'ic_left_col' | 'ic_line_arc' | 'ic_line_arc_reverse' | 'ic_line_irregular' | 'ic_line_vector' | 'ic_link' | 'ic_list_add' | 'ic_list_clear' | 'ic_list_notepad' | 'ic_list_view' | 'ic_lists_folder' | 'ic_locate' | 'ic_located_in_spatial' | 'ic_lock' | 'ic_lock_alt' | 'ic_log_out' | 'ic_manage_adjust' | 'ic_manage_labels' | 'ic_maori_land' | 'ic_mark_linking' | 'ic_marks' | 'ic_memorials' | 'ic_menu' | 'ic_merge' | 'ic_message_received' | 'ic_minimise' | 'ic_misclose_error' | 'ic_more_vert' | 'ic_multi_factor_authentication_mfa' | 'ic_navigate_before' | 'ic_navigate_next' | 'ic_new_work_item' | 'ic_note_add' | 'ic_notice_of_change' | 'ic_notifications' | 'ic_numbered_list' | 'ic_office_building_corporate' | 'ic_opacity' | 'ic_open_diagrams' | 'ic_order_history' | 'ic_package' | 'ic_pan_map' | 'ic_pan_map_alt' | 'ic_parcels_existing' | 'ic_parcels_new' | 'ic_pdf' | 'ic_pdf_doc' | 'ic_pen_and_paper_sign' | 'ic_people_outline' | 'ic_perform_next_step_right' | 'ic_person' | 'ic_person_add' | 'ic_picker' | 'ic_placeholder' | 'ic_plan_generation' | 'ic_plus_one' | 'ic_pointer_outlined' | 'ic_polygon_selection' | 'ic_pop_back' | 'ic_pre_validation' | 'ic_print' | 'ic_product_list' | 'ic_publish' | 'ic_push_pin' | 'ic_push_pin_remove' | 'ic_read_only' | 'ic_redo' | 'ic_refresh' | 'ic_regenerate' | 'ic_regenerate_off' | 'ic_release' | 'ic_remove_circle' | 'ic_remove_circle_outline' | 'ic_remove_from_sheet' | 'ic_renumber_page' | 'ic_request' | 'ic_requisitions' | 'ic_restart' | 'ic_restore' | 'ic_rotate_sheet' | 'ic_round_selection' | 'ic_save' | 'ic_save_as' | 'ic_save_download' | 'ic_saved_area_interest' | 'ic_search' | 'ic_select_coordinates' | 'ic_select_diagram' | 'ic_select_label' | 'ic_select_line' | 'ic_select_rt_lines' | 'ic_selection_focus' | 'ic_send' | 'ic_send_email_dart' | 'ic_separator' | 'ic_settings' | 'ic_sorting_down_arrow_up' | 'ic_sorting_up_arrow_up' | 'ic_split' | 'ic_square_selection' | 'ic_subdirectory_arrow_right' | 'ic_submit' | 'ic_summary_open' | 'ic_survey' | 'ic_survey_checked' | 'ic_survey_data_extraction' | 'ic_survey_report' | 'ic_survey_sheet' | 'ic_ta_request_sent' | 'ic_table_columns' | 'ic_tax_statement' | 'ic_text_match' | 'ic_tick' | 'ic_tick_and_cross' | 'ic_timeline' | 'ic_title_allocation_swap' | 'ic_title_sheet' | 'ic_toggle_off' | 'ic_toggle_on' | 'ic_tune_setting_configure' | 'ic_undo' | 'ic_unlink' | 'ic_unlock' | 'ic_upload' | 'ic_vector' | 'ic_vector_sequence' | 'ic_verified_complete_approve_check_tick' | 'ic_view' | 'ic_view_in_viewer' | 'ic_view_list' | 'ic_view_quilt' | 'ic_view_sidebar' | 'ic_view_week' | 'ic_visiblity_off' | 'ic_warning' | 'ic_warning_outline' | 'ic_waves' | 'ic_whats_new_updates' | 'ic_xml_file' | 'ic_zoom_centre' | 'ic_zoom_out' | 'ic_zoom_previous' | 'ic_zoomin_snippet_circle' | 'ic_zoomin_snippet_polygon' | 'ic_zoomin_snippet_rectangle' | 'ic_zoomout_snippet_circle' | 'ic_zoomout_snippet_polygon' | 'ic_zoomout_snippet_rectangle';
+export type LuiIconName = string | 'ic_account_circle' | 'ic_add' | 'ic_add_adopt' | 'ic_add_area_interest' | 'ic_add_circle' | 'ic_add_circle_outline' | 'ic_add_irregular_image' | 'ic_add_label' | 'ic_add_line' | 'ic_add_multiple' | 'ic_add_page' | 'ic_add_rectangle' | 'ic_add_rt_lines' | 'ic_add_to_csv' | 'ic_add_to_list' | 'ic_add_to_xml' | 'ic_added_to_list' | 'ic_adjustment' | 'ic_admin' | 'ic_advanced_user_search' | 'ic_alias' | 'ic_alias_unselected' | 'ic_annotations' | 'ic_apps' | 'ic_arrow_back' | 'ic_arrow_back_ios' | 'ic_arrow_back_left' | 'ic_arrow_drop_down' | 'ic_arrow_drop_right' | 'ic_arrow_drop_up' | 'ic_arrow_forward_ios' | 'ic_arrow_forward_right' | 'ic_attach_file' | 'ic_attachment' | 'ic_auth_and_instruct' | 'ic_auto_preval' | 'ic_auto_regenerate' | 'ic_balance_parcel' | 'ic_basemap_off' | 'ic_blackwhite_greyscale' | 'ic_blocked' | 'ic_border_color' | 'ic_bug' | 'ic_c_report' | 'ic_cancel_clear' | 'ic_cancel_outline' | 'ic_capture_area' | 'ic_cart_view' | 'ic_certify_and_sign' | 'ic_change_password' | 'ic_check' | 'ic_check_circle' | 'ic_check_circle_outline' | 'ic_checklist' | 'ic_clear' | 'ic_close_list' | 'ic_closest_match' | 'ic_columns' | 'ic_control_point' | 'ic_copy' | 'ic_copy_titles_to_here' | 'ic_corporate_fare' | 'ic_create' | 'ic_create_new_list' | 'ic_csv_file' | 'ic_data_display_threshold' | 'ic_data_display_threshold_high_urban' | 'ic_data_display_threshold_low_large_rural' | 'ic_data_display_threshold_medium_rural' | 'ic_dealings' | 'ic_deceased' | 'ic_deceased_fill' | 'ic_define_diagrams' | 'ic_define_nonprimary_diagram_circle' | 'ic_define_nonprimary_diagram_polygon' | 'ic_define_nonprimary_diagram_rectangle' | 'ic_define_primary_diagram_circle' | 'ic_define_primary_diagram_polygon' | 'ic_define_primary_diagram_rectangle' | 'ic_define_survey_diagram_circle' | 'ic_define_survey_diagram_polygon' | 'ic_define_survey_diagram_rectangle' | 'ic_delete_forever' | 'ic_delete_outline' | 'ic_delete_page' | 'ic_delete_solid' | 'ic_description' | 'ic_dollar_round' | 'ic_double_arrow_left' | 'ic_double_arrow_right' | 'ic_double_tick' | 'ic_drag_handle' | 'ic_drag_indicator' | 'ic_draw_abuttal' | 'ic_draw_irregular_line' | 'ic_draw_rt_bdry' | 'ic_email' | 'ic_empty_circle' | 'ic_enabled_users' | 'ic_error' | 'ic_error_outline' | 'ic_expand_less' | 'ic_expand_more' | 'ic_fast_forward' | 'ic_fast_forward_outline' | 'ic_feature_id' | 'ic_feedback_lightbulb' | 'ic_feedback_lightbulb_alt' | 'ic_file_attached' | 'ic_file_attached_outline' | 'ic_filter_list' | 'ic_flag' | 'ic_fold_in' | 'ic_fold_out' | 'ic_format_colour' | 'ic_format_lines_text' | 'ic_forward' | 'ic_fullscreen_frame' | 'ic_generate_title' | 'ic_grid_view' | 'ic_help_outline' | 'ic_history' | 'ic_hourglass' | 'ic_info' | 'ic_info_outline' | 'ic_insert_into_sheet' | 'ic_insert_invitation' | 'ic_insert_photo' | 'ic_instruments_roles' | 'ic_keyboard_arrow_down' | 'ic_keyboard_arrow_left' | 'ic_keyboard_arrow_right' | 'ic_keyboard_arrow_up' | 'ic_label_diagrams' | 'ic_label_settings' | 'ic_labels_off' | 'ic_labels_on' | 'ic_land_record_search' | 'ic_launch_modal' | 'ic_launch_new window_open' | 'ic_layers' | 'ic_layers_user_defined' | 'ic_layout_plan_sheets' | 'ic_left' | 'ic_left_col' | 'ic_line_arc' | 'ic_line_arc_reverse' | 'ic_line_irregular' | 'ic_line_vector' | 'ic_link' | 'ic_list_add' | 'ic_list_clear' | 'ic_list_notepad' | 'ic_list_view' | 'ic_lists_folder' | 'ic_locate' | 'ic_located_in_spatial' | 'ic_lock' | 'ic_lock_alt' | 'ic_log_out' | 'ic_manage_adjust' | 'ic_manage_labels' | 'ic_maori_land' | 'ic_mark_linking' | 'ic_marks' | 'ic_memorials' | 'ic_menu' | 'ic_merge' | 'ic_message_received' | 'ic_minimise' | 'ic_misclose_error' | 'ic_more_vert' | 'ic_move_down' | 'ic_multi_factor_authentication_mfa' | 'ic_navigate_before' | 'ic_navigate_next' | 'ic_new_work_item' | 'ic_note_add' | 'ic_notice_of_change' | 'ic_notifications' | 'ic_numbered_list' | 'ic_office_building_corporate' | 'ic_opacity' | 'ic_open_diagrams' | 'ic_order_history' | 'ic_package' | 'ic_pan_map' | 'ic_pan_map_alt' | 'ic_parcels_existing' | 'ic_parcels_new' | 'ic_pdf' | 'ic_pdf_doc' | 'ic_pen_and_paper_sign' | 'ic_people_outline' | 'ic_perform_next_step_right' | 'ic_person' | 'ic_person_add' | 'ic_picker' | 'ic_placeholder' | 'ic_plan_generation' | 'ic_plus_one' | 'ic_pointer_outlined' | 'ic_polygon_selection' | 'ic_pop_back' | 'ic_pre_validation' | 'ic_print' | 'ic_product_list' | 'ic_publish' | 'ic_push_pin' | 'ic_push_pin_remove' | 'ic_read_only' | 'ic_redo' | 'ic_refresh' | 'ic_regenerate' | 'ic_regenerate_off' | 'ic_release' | 'ic_remove_circle' | 'ic_remove_circle_outline' | 'ic_remove_from_sheet' | 'ic_renumber_page' | 'ic_request' | 'ic_requisitions' | 'ic_restart' | 'ic_restore' | 'ic_rotate_sheet' | 'ic_round_selection' | 'ic_save' | 'ic_save_as' | 'ic_save_download' | 'ic_saved_area_interest' | 'ic_search' | 'ic_select_coordinates' | 'ic_select_diagram' | 'ic_select_label' | 'ic_select_line' | 'ic_select_rt_lines' | 'ic_selection_focus' | 'ic_send' | 'ic_send_email_dart' | 'ic_separator' | 'ic_settings' | 'ic_sorting_down_arrow_up' | 'ic_sorting_up_arrow_up' | 'ic_split' | 'ic_square_selection' | 'ic_subdirectory_arrow_right' | 'ic_submit' | 'ic_summary_open' | 'ic_survey' | 'ic_survey_checked' | 'ic_survey_data_extraction' | 'ic_survey_report' | 'ic_survey_sheet' | 'ic_ta_request_sent' | 'ic_table_columns' | 'ic_tax_statement' | 'ic_text_match' | 'ic_tick' | 'ic_tick_and_cross' | 'ic_timeline' | 'ic_title_allocation_swap' | 'ic_title_sheet' | 'ic_toggle_off' | 'ic_toggle_on' | 'ic_tune_setting_configure' | 'ic_undo' | 'ic_unlink' | 'ic_unlock' | 'ic_upload' | 'ic_vector' | 'ic_vector_sequence' | 'ic_verified_complete_approve_check_tick' | 'ic_view' | 'ic_view_in_viewer' | 'ic_view_list' | 'ic_view_quilt' | 'ic_view_sidebar' | 'ic_view_week' | 'ic_visiblity_off' | 'ic_warning' | 'ic_warning_outline' | 'ic_waves' | 'ic_whats_new_updates' | 'ic_xml_file' | 'ic_zoom_centre' | 'ic_zoom_out' | 'ic_zoom_previous' | 'ic_zoomin_snippet_circle' | 'ic_zoomin_snippet_polygon' | 'ic_zoomin_snippet_rectangle' | 'ic_zoomout_snippet_circle' | 'ic_zoomout_snippet_polygon' | 'ic_zoomout_snippet_rectangle';
 type IconNameElementMap = {
     [key in LuiIconName]?: React.ReactElement;
 };

package/dist/assets/svg-content.tsx

@@ -182,6 +182,7 @@ export type LuiIconName =
   | 'ic_minimise'
   | 'ic_misclose_error'
   | 'ic_more_vert'
+  | 'ic_move_down'
   | 'ic_multi_factor_authentication_mfa'
   | 'ic_navigate_before'
   | 'ic_navigate_next'
@@ -1426,6 +1427,12 @@ iconMap['ic_more_vert'] = (
   </svg>
 );
 
+iconMap['ic_move_down'] = (
+  <svg viewBox="0 0 24 24">
+    <path d="M3 11q0 1.8 1.15 3.175A4.95 4.95 0 0 0 7.075 15.9l-.775-.775a.93.93 0 0 1-.275-.687q0-.414.275-.713.3-.3.713-.3.412 0 .712.3L10.3 16.3q.3.3.3.7t-.3.7l-2.6 2.6a.95.95 0 0 1-.7.275.99.99 0 0 1-.725-.3A.92.92 0 0 1 6 19.6q0-.4.275-.7l.9-.95q-2.65-.3-4.412-2.287Q1 13.675 1 11q0-2.925 2.038-4.962T8 4h2q.424 0 .713.287Q11 4.576 11 5q0 .424-.287.713A.97.97 0 0 1 10 6H8Q5.925 6 4.463 7.463 3 8.925 3 11m11 9a.97.97 0 0 1-.713-.288A.97.97 0 0 1 13 19v-5q0-.424.287-.713A.97.97 0 0 1 14 13h7q.424 0 .712.287.288.288.288.713v5q0 .424-.288.712A.97.97 0 0 1 21 20zm0-9a.97.97 0 0 1-.713-.287A.97.97 0 0 1 13 10V5q0-.424.287-.713A.97.97 0 0 1 14 4h7q.424 0 .712.287Q22 4.576 22 5v5q0 .424-.288.713A.97.97 0 0 1 21 11zm1-2h5V6h-5z" />
+  </svg>
+);
+
 iconMap['ic_multi_factor_authentication_mfa'] = (
   <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
     <path d="M17 21a.968.968 0 0 1-.712-.288A.968.968 0 0 1 16 20v-7.95a.97.97 0 0 1 .288-.713.968.968 0 0 1 .712-.287h4a.97.97 0 0 1 .712.287c.192.192.288.43.288.713V20c0 .283-.096.52-.288.712A.968.968 0 0 1 21 21h-4Zm0-2h4v-5.95h-4V19Zm-8 2a.967.967 0 0 1-.713-.288A.968.968 0 0 1 8 20a.97.97 0 0 1 .287-.712A.967.967 0 0 1 9 19h1v-2H4c-.55 0-1.02-.196-1.413-.587A1.926 1.926 0 0 1 2 15V5c0-.55.196-1.02.587-1.413A1.926 1.926 0 0 1 4 3h14c.55 0 1.02.196 1.413.587.39.393.587.863.587 1.413v3.05c0 .283-.096.52-.288.712A.968.968 0 0 1 19 9.05a.968.968 0 0 1-.712-.288A.967.967 0 0 1 18 8.05V5H4v10h9c.283 0 .52.096.713.287.191.192.287.43.287.713s-.096.52-.287.712A.968.968 0 0 1 13 17h-1v2h1a.97.97 0 0 1 .713.288c.191.191.287.429.287.712s-.096.52-.287.712A.968.968 0 0 1 13 21H9Z" />

package/dist/components/LuiSideToolbar/ToolbarButton.d.ts

@@ -1,6 +1,6 @@
-/// <reference types="react" />
-import 'react-loading-skeleton/dist/skeleton.css';
 import './ToolbarButton.scss';
+import 'react-loading-skeleton/dist/skeleton.css';
+import React from 'react';
 export interface ToolbarButtonProps {
     disabled?: boolean;
     highlighted?: boolean;
@@ -18,4 +18,4 @@ export interface ToolbarButtonProps {
  * @param props
  * @returns
  */
-export declare const ToolbarButton: ({ disabled, highlighted, iconImage, iconName, loading, onClick, panelTitle, panelKey, tooltip, }: ToolbarButtonProps) => JSX.Element;
+export declare const ToolbarButton: React.ForwardRefExoticComponent<ToolbarButtonProps & React.RefAttributes<HTMLButtonElement>>;

package/dist/index.js

@@ -565,6 +565,8 @@ iconMap['ic_misclose_error'] = (React__default["default"].createElement("svg", {
     React__default["default"].createElement("path", { d: "M21 18c.5 0 1-.5 1-1v-6c0-.6-.5-1-1-1s-1 .4-1 1v6c0 .5.5 1 1 1Zm0 4c.5 0 1-.5 1-1s-.5-1-1-1-1 .5-1 1 .5 1 1 1Zm-3-2v2H2L22 2v6h-2V6.8L6.8 20H18Z" })));
 iconMap['ic_more_vert'] = (React__default["default"].createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24" },
     React__default["default"].createElement("path", { d: "M12 8c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z" })));
+iconMap['ic_move_down'] = (React__default["default"].createElement("svg", { viewBox: "0 0 24 24" },
+    React__default["default"].createElement("path", { d: "M3 11q0 1.8 1.15 3.175A4.95 4.95 0 0 0 7.075 15.9l-.775-.775a.93.93 0 0 1-.275-.687q0-.414.275-.713.3-.3.713-.3.412 0 .712.3L10.3 16.3q.3.3.3.7t-.3.7l-2.6 2.6a.95.95 0 0 1-.7.275.99.99 0 0 1-.725-.3A.92.92 0 0 1 6 19.6q0-.4.275-.7l.9-.95q-2.65-.3-4.412-2.287Q1 13.675 1 11q0-2.925 2.038-4.962T8 4h2q.424 0 .713.287Q11 4.576 11 5q0 .424-.287.713A.97.97 0 0 1 10 6H8Q5.925 6 4.463 7.463 3 8.925 3 11m11 9a.97.97 0 0 1-.713-.288A.97.97 0 0 1 13 19v-5q0-.424.287-.713A.97.97 0 0 1 14 13h7q.424 0 .712.287.288.288.288.713v5q0 .424-.288.712A.97.97 0 0 1 21 20zm0-9a.97.97 0 0 1-.713-.287A.97.97 0 0 1 13 10V5q0-.424.287-.713A.97.97 0 0 1 14 4h7q.424 0 .712.287Q22 4.576 22 5v5q0 .424-.288.713A.97.97 0 0 1 21 11zm1-2h5V6h-5z" })));
 iconMap['ic_multi_factor_authentication_mfa'] = (React__default["default"].createElement("svg", { viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" },
     React__default["default"].createElement("path", { d: "M17 21a.968.968 0 0 1-.712-.288A.968.968 0 0 1 16 20v-7.95a.97.97 0 0 1 .288-.713.968.968 0 0 1 .712-.287h4a.97.97 0 0 1 .712.287c.192.192.288.43.288.713V20c0 .283-.096.52-.288.712A.968.968 0 0 1 21 21h-4Zm0-2h4v-5.95h-4V19Zm-8 2a.967.967 0 0 1-.713-.288A.968.968 0 0 1 8 20a.97.97 0 0 1 .287-.712A.967.967 0 0 1 9 19h1v-2H4c-.55 0-1.02-.196-1.413-.587A1.926 1.926 0 0 1 2 15V5c0-.55.196-1.02.587-1.413A1.926 1.926 0 0 1 4 3h14c.55 0 1.02.196 1.413.587.39.393.587.863.587 1.413v3.05c0 .283-.096.52-.288.712A.968.968 0 0 1 19 9.05a.968.968 0 0 1-.712-.288A.967.967 0 0 1 18 8.05V5H4v10h9c.283 0 .52.096.713.287.191.192.287.43.287.713s-.096.52-.287.712A.968.968 0 0 1 13 17h-1v2h1a.97.97 0 0 1 .713.288c.191.191.287.429.287.712s-.096.52-.287.712A.968.968 0 0 1 13 21H9Z" }),
     React__default["default"].createElement("path", { d: "M9 14a.967.967 0 0 1-.713-.287A.968.968 0 0 1 8 13v-3c0-.283.096-.52.287-.713A.968.968 0 0 1 9 9V8c0-.55.196-1.02.588-1.412A1.926 1.926 0 0 1 11 6c.55 0 1.02.196 1.412.588.392.391.588.862.588 1.412v1c.283 0 .52.096.713.287.191.192.287.43.287.713v3c0 .283-.096.52-.287.713A.968.968 0 0 1 13 14H9Zm1-6v1h2V8a.967.967 0 0 0-.287-.713A.968.968 0 0 0 11 7a.968.968 0 0 0-.713.287A.967.967 0 0 0 10 8Z" })));
@@ -33714,6 +33716,9 @@ function LuiSideToolbar(props) {
     return (React__default["default"].createElement("div", { className: clsx(['Toolbar', 'app--shadow-sm', props.direction]), "data-testid": "toolbar" }, props.children));
 }
 
+var css_248z$c = "/**\n  @deprecated\n */\n/**\n  @deprecated\n */\n/**\n  @deprecated\n */\n.ToolbarButton {\n  height: 40px;\n  width: 40px;\n  line-height: 12px;\n  margin: 2px;\n  padding: 0.25rem;\n}\n\n.ToolbarButton-placement {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.ToolbarButton img {\n  border-radius: 3px;\n  margin: -0.25rem;\n}\n\n.ToolbarButton,\n.ToolbarButton:hover,\n.ToolbarButton:disabled,\n.ToolbarButton:active:enabled {\n  border-radius: 5px;\n  border: 2px #ffffff solid !important;\n}\n\n.ToolbarItem-separator {\n  height: 2px;\n  background-color: #eaeaea;\n  width: 100%;\n}";
+styleInject(css_248z$c);
+
 /**
  * Show LuiIcon or Image.
  *
@@ -33725,24 +33730,21 @@ var ToolbarIcon = function (_a) {
     return iconImage ? (React__default["default"].createElement("img", { className: "LuiIcon--lg", alt: iconName, src: iconImage })) : (React__default["default"].createElement(LuiIcon, { name: iconName, alt: iconName, size: 'md' }));
 };
 
-var css_248z$c = "/**\n  @deprecated\n */\n/**\n  @deprecated\n */\n/**\n  @deprecated\n */\n.ToolbarButton {\n  height: 40px;\n  width: 40px;\n  line-height: 12px;\n  margin: 2px;\n  padding: 0.25rem;\n}\n\n.ToolbarButton-placement {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.ToolbarButton img {\n  border-radius: 3px;\n  margin: -0.25rem;\n}\n\n.ToolbarButton,\n.ToolbarButton:hover,\n.ToolbarButton:disabled,\n.ToolbarButton:active:enabled {\n  border-radius: 5px;\n  border: 2px #ffffff solid !important;\n}\n\n.ToolbarItem-separator {\n  height: 2px;\n  background-color: #eaeaea;\n  width: 100%;\n}";
-styleInject(css_248z$c);
-
 /**
  * Create button for using either LuiIcon or Image.
  *
  * @param props
  * @returns
  */
-var ToolbarButton = function (_a) {
+var ToolbarButton = React.forwardRef(function ToolbarButton(_a, ref) {
     var disabled = _a.disabled, highlighted = _a.highlighted, iconImage = _a.iconImage, iconName = _a.iconName, loading = _a.loading, onClick = _a.onClick, panelTitle = _a.panelTitle, panelKey = _a.panelKey, tooltip = _a.tooltip;
     if (loading) {
         return React__default["default"].createElement(Skeleton, { className: "ToolbarButton", height: 40, width: 40 });
     }
-    var button = (React__default["default"].createElement("button", { className: "".concat(highlighted ? 'lui-button-primary' : 'lui-button-secondary', " ToolbarButton ToolbarButton-placement"), "data-testid": "ToolbarButton-".concat(panelKey), disabled: disabled, onClick: onClick, title: panelTitle, type: "button" },
+    var button = (React__default["default"].createElement("button", { ref: ref, className: "".concat(highlighted ? 'lui-button-primary' : 'lui-button-secondary', " ToolbarButton ToolbarButton-placement"), "data-testid": "ToolbarButton-".concat(panelKey), disabled: disabled, onClick: onClick, title: panelTitle, type: "button" },
         React__default["default"].createElement(ToolbarIcon, { iconImage: iconImage, iconName: iconName })));
-    return tooltip ? (React__default["default"].createElement(LuiTooltip, { placement: "auto", message: tooltip }, button)) : (React__default["default"].createElement(React__default["default"].Fragment, null, button));
-};
+    return tooltip ? (React__default["default"].createElement(LuiTooltip, { placement: "auto", content: tooltip }, button)) : (React__default["default"].createElement(React__default["default"].Fragment, null, button));
+});
 
 /**
  * Allows any item to be added into the toolbar (with appropriate styles and size)