@linzjs/lui 21.33.0 → 21.34.1-0

package/CHANGELOG.md

@@ -1,3 +1,10 @@
+# [21.34.0](https://github.com/linz/lui/compare/v21.33.0...v21.34.0) (2024-06-05)
+
+
+### Features
+
+* Luiicon 050624 ([#1123](https://github.com/linz/lui/issues/1123)) ([b06e4e3](https://github.com/linz/lui/commit/b06e4e395c66e4ae806d65a2c0707dd34cf09e0f))
+
 # [21.33.0](https://github.com/linz/lui/compare/v21.32.0...v21.33.0) (2024-05-29)
 
 

package/dist/assets/icons/copy_titles_to_here.svg

@@ -0,0 +1 @@
+<svg viewBox="0 0 24 24"><path fill="#000" d="M7.6 18.6 9 20l4-4-4-4-1.4 1.4L9.2 15H3v2h6.2zM15 7c-.6 0-1-.4-1-1s.4-1 1-1h5c.6 0 1 .4 1 1s-.1.6-.3.7c-.2.2-.4.3-.7.3zm0 4c-.6 0-1-.4-1-1s.4-1 1-1h5c.6 0 1 .4 1 1s-.1.6-.3.7c-.2.2-.4.3-.7.3zm0 4c-.6 0-1-.4-1-1s.4-1 1-1h5c.6 0 1 .4 1 1s-.1.6-.3.7c-.2.2-.4.3-.7.3zm0 4c-.6 0-1-.4-1-1s.4-1 1-1h5c.6 0 1 .4 1 1s-.1.6-.3.7c-.2.2-.4.3-.7.3zM6 7c-.6 0-1-.4-1-1s.4-1 1-1h5c.6 0 1 .4 1 1s-.1.6-.3.7c-.2.2-.4.3-.7.3zm0 4c-.6 0-1-.4-1-1s.4-1 1-1h5c.6 0 1 .4 1 1s-.1.6-.3.7c-.2.2-.4.3-.7.3z"/></svg>

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

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-export declare 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_list' | 'ic_add_to_xml' | 'ic_added_to_list' | 'ic_admin' | '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_balance_parcel' | 'ic_basemap_off' | 'ic_blackwhite_greyscale' | 'ic_blocked' | 'ic_border_color' | '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_columns' | 'ic_control_point' | 'ic_copy' | '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_enabled_users' | 'ic_error' | 'ic_error_outline' | 'ic_expand_less' | 'ic_expand_more' | 'ic_fast_forward' | 'ic_feedback_lightbulb' | 'ic_feedback_lightbulb_alt' | 'ic_file_attached' | 'ic_file_attached_outline' | 'ic_filter_list' | 'ic_flag' | '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_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_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_person' | 'ic_person_add' | 'ic_picker' | 'ic_placeholder' | 'ic_plan_generation' | 'ic_plus_one' | '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_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_send' | 'ic_send_email_dart' | 'ic_separator' | 'ic_settings' | 'ic_sorting_down_arrow_up' | 'ic_sorting_up_arrow_up' | 'ic_square_selection' | 'ic_subdirectory_arrow_right' | 'ic_submit' | 'ic_summary_open' | 'ic_survey' | 'ic_survey_report' | 'ic_survey_sheet' | 'ic_ta_request_sent' | 'ic_table_columns' | 'ic_tax_statement' | '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_view' | '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 declare 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_list' | 'ic_add_to_xml' | 'ic_added_to_list' | 'ic_admin' | '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_balance_parcel' | 'ic_basemap_off' | 'ic_blackwhite_greyscale' | 'ic_blocked' | 'ic_border_color' | '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_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_enabled_users' | 'ic_error' | 'ic_error_outline' | 'ic_expand_less' | 'ic_expand_more' | 'ic_fast_forward' | 'ic_feedback_lightbulb' | 'ic_feedback_lightbulb_alt' | 'ic_file_attached' | 'ic_file_attached_outline' | 'ic_filter_list' | 'ic_flag' | '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_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_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_person' | 'ic_person_add' | 'ic_picker' | 'ic_placeholder' | 'ic_plan_generation' | 'ic_plus_one' | '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_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_send' | 'ic_send_email_dart' | 'ic_separator' | 'ic_settings' | 'ic_sorting_down_arrow_up' | 'ic_sorting_up_arrow_up' | 'ic_square_selection' | 'ic_subdirectory_arrow_right' | 'ic_submit' | 'ic_summary_open' | 'ic_survey' | 'ic_survey_report' | 'ic_survey_sheet' | 'ic_ta_request_sent' | 'ic_table_columns' | 'ic_tax_statement' | '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_view' | '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';
 declare type IconNameElementMap = {
     [key in LuiIconName]?: JSX.Element;
 };

package/dist/assets/svg-content.tsx

@@ -62,6 +62,7 @@ export type LuiIconName =
   | 'ic_columns'
   | 'ic_control_point'
   | 'ic_copy'
+  | 'ic_copy_titles_to_here'
   | 'ic_corporate_fare'
   | 'ic_create'
   | 'ic_create_new_list'
@@ -617,6 +618,12 @@ iconMap['ic_copy'] = (
   </svg>
 );
 
+iconMap['ic_copy_titles_to_here'] = (
+  <svg viewBox="0 0 24 24">
+    <path d="M7.6 18.6 9 20l4-4-4-4-1.4 1.4L9.2 15H3v2h6.2zM15 7c-.6 0-1-.4-1-1s.4-1 1-1h5c.6 0 1 .4 1 1s-.1.6-.3.7c-.2.2-.4.3-.7.3zm0 4c-.6 0-1-.4-1-1s.4-1 1-1h5c.6 0 1 .4 1 1s-.1.6-.3.7c-.2.2-.4.3-.7.3zm0 4c-.6 0-1-.4-1-1s.4-1 1-1h5c.6 0 1 .4 1 1s-.1.6-.3.7c-.2.2-.4.3-.7.3zm0 4c-.6 0-1-.4-1-1s.4-1 1-1h5c.6 0 1 .4 1 1s-.1.6-.3.7c-.2.2-.4.3-.7.3zM6 7c-.6 0-1-.4-1-1s.4-1 1-1h5c.6 0 1 .4 1 1s-.1.6-.3.7c-.2.2-.4.3-.7.3zm0 4c-.6 0-1-.4-1-1s.4-1 1-1h5c.6 0 1 .4 1 1s-.1.6-.3.7c-.2.2-.4.3-.7.3z" />
+  </svg>
+);
+
 iconMap['ic_corporate_fare'] = (
   <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
     <path d="M12 6.984V3H2.016v18h19.969V6.984h-9.984zm-2.016 12h-6v-1.969h6v1.969zm0-3.984h-6v-2.016h6V15zm0-3.984h-6V9h6v2.016zm0-4.032h-6V5.015h6v1.969zm10.032 12H12V9h8.016v9.984zM18 11.016h-3.984v1.969H18v-1.969zM18 15h-3.984v2.016H18V15z" />

package/dist/components/LuiModal/LuiAlertModalV2.d.ts

@@ -0,0 +1,7 @@
+import { FC, PropsWithChildren } from 'react';
+import { LuiModalV2Props } from './LuiModalV2';
+export declare type LuiAlertModalLevel = 'success' | 'info' | 'warning' | 'error';
+export declare type LuiAlertModalV2Props = Omit<LuiModalV2Props, 'headingIcon'> & {
+    level: LuiAlertModalLevel;
+};
+export declare const LuiAlertModalV2: FC<PropsWithChildren<LuiAlertModalV2Props>>;

package/dist/components/LuiModal/LuiModalV2.d.ts

@@ -0,0 +1,26 @@
+import { FC, PropsWithChildren } from 'react';
+import { LuiIconProps } from '../LuiIcon/LuiIcon';
+export declare type LuiModalV2Props = {
+    key?: string;
+    /** Default `true` */
+    shouldCloseOnOverlayClick?: boolean;
+    /** Default `true` */
+    shouldCloseOnEsc?: boolean | 'use-keyup';
+    onClose?: () => void | Promise<void>;
+    showCloseButton?: boolean;
+    className?: string;
+    /** If set to true, the modal will take the full screen width. Default `false` */
+    maxWidth?: boolean;
+    headingText?: string;
+    headingIcon?: LuiIconProps;
+    helpLink?: string | (() => void | Promise<void>);
+    isLoading?: boolean;
+    /** Sets the overlay to white. This is only to be used for situations when the user is working in a component and there is benefit to hiding the surrounding page. An example is editing types of instruments in the Dealings flow in LOL. */
+    lowContrast?: boolean;
+    /** By default, the modal autofocuses the first `input` or `button` inside it. Set this prop to `true` to disable that behaviour. Default `false`. */
+    preventAutoFocus?: boolean;
+    /** By default, the modal portal will be appended to the document's body, but we might need to append it to another element. This is passed the React Modal `parentSelector` prop. */
+    appendToElement?: () => HTMLElement;
+};
+export declare const LuiModalV2: FC<PropsWithChildren<LuiModalV2Props>>;
+export declare const LuiModalV2Buttons: FC<PropsWithChildren<unknown>>;

package/dist/components/common/Hooks.d.ts

@@ -5,6 +5,7 @@
  * @param onEscape the handler function
  */
 export declare const useEscapeFunction: (onEscape: () => void) => void;
+export declare const useEscapeFunction2: (onEscape: (e: KeyboardEvent) => void | Promise<void>, trigger?: 'keyup' | 'keydown') => void;
 /**
  * A hook which allows handling of click event anywhere on the page.
  * Provides a way of handling clicks done inside or outside the element bound to the returned react ref.

package/dist/hooks/useClickedOutsideElement.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import { MutableRefObject, RefObject } from 'react';
 /**
  * This hook will callback with handleClickOutside() when "mousedown" dom event occurs off the refElement
  * usage:
@@ -11,4 +11,4 @@ import React from 'react';
   return <button ref={refElement}>Click Me!</button>;
  ```
  */
-export declare function useClickedOutsideElement(refElement: React.RefObject<HTMLElement>, handleClickOutside: CallableFunction): void;
+export declare function useClickedOutsideElement(refElement: RefObject<HTMLElement> | MutableRefObject<HTMLElement>, handleClickOutside: CallableFunction): void;

package/dist/index.d.ts

@@ -37,6 +37,8 @@ export * from './components/LuiHeaderMenu/LuiHeaderMenus';
 export * from './components/LuiHeaderMenuV2/LuiHeaderMenusV2';
 export { LuiUpdatesSplashModal } from './components/LuiUpdateSplashModal/LuiUpdatesSplashModal';
 export { LuiModal, LuiAlertModal, LuiAlertModalButtons, } from './components/LuiModal/LuiModal';
+export { LuiModalV2, LuiModalV2Buttons, type LuiModalV2Props, } from './components/LuiModal/LuiModalV2';
+export { LuiAlertModalV2, type LuiAlertModalLevel, type LuiAlertModalV2Props, } from './components/LuiModal/LuiAlertModalV2';
 export { type ISearchInputProps, LuiSearchInput, } from './components/LuiSearchInput/LuiSearchInput';
 export { type ISearchGroupedResult, type ISearchResult, } from './components/LuiSearchInput/ResultsDisplay';
 export { type ISearchMenuOption, type ILuiSearchBoxProps, LuiSearchBox, } from './components/LuiSearchBox/LuiSearchBox';

package/dist/index.js

@@ -278,6 +278,8 @@ iconMap['ic_control_point'] = (React__default["default"].createElement("svg", {
     React__default["default"].createElement("path", { d: "M21.146 1.1h-5.7c-.9 0-1.7.8-1.7 1.7v5.7c0 .9.8 1.7 1.7 1.7h5.7c.9 0 1.7-.8 1.7-1.7V2.9c.1-1-.7-1.8-1.7-1.8z" })));
 iconMap['ic_copy'] = (React__default["default"].createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24" },
     React__default["default"].createElement("path", { d: "M8.5 20h10V7c0-.55.45-1 1-1s1 .45 1 1v13c0 1.1-.9 2-2 2h-10c-.55 0-1-.45-1-1s.45-1 1-1zm-5-4V4c0-1.1.9-2 2-2h9c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2h-9c-1.1 0-2-.9-2-2zm2 0h9V4h-9v12z" })));
+iconMap['ic_copy_titles_to_here'] = (React__default["default"].createElement("svg", { viewBox: "0 0 24 24" },
+    React__default["default"].createElement("path", { d: "M7.6 18.6 9 20l4-4-4-4-1.4 1.4L9.2 15H3v2h6.2zM15 7c-.6 0-1-.4-1-1s.4-1 1-1h5c.6 0 1 .4 1 1s-.1.6-.3.7c-.2.2-.4.3-.7.3zm0 4c-.6 0-1-.4-1-1s.4-1 1-1h5c.6 0 1 .4 1 1s-.1.6-.3.7c-.2.2-.4.3-.7.3zm0 4c-.6 0-1-.4-1-1s.4-1 1-1h5c.6 0 1 .4 1 1s-.1.6-.3.7c-.2.2-.4.3-.7.3zm0 4c-.6 0-1-.4-1-1s.4-1 1-1h5c.6 0 1 .4 1 1s-.1.6-.3.7c-.2.2-.4.3-.7.3zM6 7c-.6 0-1-.4-1-1s.4-1 1-1h5c.6 0 1 .4 1 1s-.1.6-.3.7c-.2.2-.4.3-.7.3zm0 4c-.6 0-1-.4-1-1s.4-1 1-1h5c.6 0 1 .4 1 1s-.1.6-.3.7c-.2.2-.4.3-.7.3z" })));
 iconMap['ic_corporate_fare'] = (React__default["default"].createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24" },
     React__default["default"].createElement("path", { d: "M12 6.984V3H2.016v18h19.969V6.984h-9.984zm-2.016 12h-6v-1.969h6v1.969zm0-3.984h-6v-2.016h6V15zm0-3.984h-6V9h6v2.016zm0-4.032h-6V5.015h6v1.969zm10.032 12H12V9h8.016v9.984zM18 11.016h-3.984v1.969H18v-1.969zM18 15h-3.984v2.016H18V15z" })));
 iconMap['ic_create'] = (React__default["default"].createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24" },
@@ -39922,6 +39924,17 @@ var useEscapeFunction = function (onEscape) {
         };
     }, [escFunction]);
 };
+var useEscapeFunction2 = function (onEscape, trigger) {
+    if (trigger === void 0) { trigger = 'keydown'; }
+    var escFunction = React.useCallback(function (event) {
+        console.log(event.key, event, onEscape);
+        event.key === 'Escape' && onEscape(event);
+    }, [onEscape]);
+    React.useEffect(function () {
+        document.addEventListener(trigger, escFunction, false);
+        return function () { return document.removeEventListener(trigger, escFunction, false); };
+    }, [escFunction]);
+};
 /**
  * A hook which allows handling of click event anywhere on the page.
  * Provides a way of handling clicks done inside or outside the element bound to the returned react ref.
@@ -42281,6 +42294,106 @@ var LuiModalHeader = function (props) {
                 React__default["default"].createElement(LuiIcon, { name: "ic_clear", alt: "Help", size: "lg" }))))))));
 };
 
+/**
+ * This hook will callback with handleClickOutside() when "mousedown" dom event occurs off the refElement
+ * usage:
+ ```typescript
+  const refElement = React.useRef<HTMLButtonElement>(null);
+  const handleClickOutside = () => {
+      console.log("hello world");
+  };
+  useClickedOutsideElement(refElement, handleClickOutside);
+  return <button ref={refElement}>Click Me!</button>;
+ ```
+ */
+function useClickedOutsideElement(refElement, handleClickOutside) {
+    React__default["default"].useEffect(function () {
+        function onOutsideClicked(event) {
+            var element = refElement.current;
+            if (!(element === null || element === void 0 ? void 0 : element.contains(event.target))) {
+                handleClickOutside();
+            }
+        }
+        document.addEventListener('mousedown', onOutsideClicked);
+        return function () {
+            document.removeEventListener('mousedown', onOutsideClicked);
+        };
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, []);
+}
+
+var _a;
+// this is here for the tests
+var isTest = typeof process !== 'undefined' && ((_a = process === null || process === void 0 ? void 0 : process.env) === null || _a === void 0 ? void 0 : _a.NODE_ENV) === 'test';
+if (!isTest)
+    Modal.setAppElement('#root');
+var LuiModalV2 = function (props) {
+    var _a;
+    var modalRef = React.useRef(null);
+    var handleClickOutside = React.useCallback(function () { var _a; return props.shouldCloseOnOverlayClick && ((_a = props.onClose) === null || _a === void 0 ? void 0 : _a.call(props)); }, [props.shouldCloseOnEsc, props.onClose]);
+    useClickedOutsideElement(modalRef, handleClickOutside);
+    var handleEsc = React.useCallback(function (e) {
+        var _a;
+        if (props.shouldCloseOnEsc !== false) {
+            e.stopPropagation();
+            (_a = props.onClose) === null || _a === void 0 ? void 0 : _a.call(props);
+        }
+    }, [props.shouldCloseOnEsc, props.onClose]);
+    useEscapeFunction2(handleEsc, props.shouldCloseOnEsc === 'use-keyup' ? 'keyup' : 'keydown');
+    var handleAutoFocus = function (el) {
+        if (props.preventAutoFocus)
+            return;
+        if (el && !el.contains(el.ownerDocument.activeElement)) {
+            var firstFocusableElement = el.querySelector('input,button');
+            firstFocusableElement === null || firstFocusableElement === void 0 ? void 0 : firstFocusableElement.focus();
+        }
+    };
+    console.log({ props: props }, props.shouldCloseOnEsc && props.shouldCloseOnEsc !== 'use-keyup');
+    var showCloseButton = Boolean(props.showCloseButton && props.onClose);
+    var showHelpButton = Boolean(props.helpLink);
+    var showButtons = showCloseButton || showHelpButton;
+    var showHeadingIcon = props.headingIcon && !props.isLoading;
+    return (React__default["default"].createElement(Modal, { key: props.key, isOpen: true, 
+        // disble the `shouldClose` props as we handle them ourselves
+        shouldCloseOnOverlayClick: false, shouldCloseOnEsc: false, overlayClassName: "modal", className: props.lowContrast ? 'lui-scrim-low-contrast' : 'lui-scrim', 
+        // required to prevent warnings that are not applicable in real usage
+        ariaHideApp: !isTest, parentSelector: props.appendToElement },
+        React__default["default"].createElement("div", { ref: function (el) {
+                modalRef.current = el;
+                handleAutoFocus(el);
+            }, className: clsx('lui-modal-v2 lui-box-shadow', props.maxWidth && 'lui-max-width', props.className) },
+            React__default["default"].createElement("div", { className: "lui-modal-v2-header" },
+                props.isLoading && (React__default["default"].createElement(LuiMiniSpinner, { size: 20, divProps: { className: 'lui-modal-v2-header-spinner' } })),
+                showHeadingIcon && (React__default["default"].createElement("div", { className: "lui-modal-v2-header-icon" },
+                    React__default["default"].createElement(LuiIcon, __assign({ size: "md", name: "", alt: "Help" }, props.headingIcon, { className: clsx('', (_a = props.headingIcon) === null || _a === void 0 ? void 0 : _a.className) })))),
+                props.headingText && (React__default["default"].createElement("h2", { className: "lui-modal-v2-header-title" }, props.headingText)),
+                showButtons && (React__default["default"].createElement("div", { className: "lui-modal-v2-header-buttons" },
+                    showHelpButton && React__default["default"].createElement(HelpButton, { helpLink: props.helpLink }),
+                    showCloseButton && React__default["default"].createElement(CloseButton, { onClose: props.onClose })))),
+            React__default["default"].createElement("div", { className: "lui-modal-v2-contents" }, props.children))));
+};
+var LuiModalV2Buttons = function (props) { return (React__default["default"].createElement("div", { className: "lui-modal-v2-btn-row" }, props.children)); };
+var HelpButton = function (props) { return (React__default["default"].createElement("button", { "aria-label": "Modal Help", title: "Help", className: "lui-modal-v2-header-help-btn", onClick: typeof props.helpLink === 'string'
+        ? function () { return window.open(props.helpLink, '_blank'); }
+        : props.helpLink },
+    React__default["default"].createElement(LuiIcon, { name: "ic_help_outline", alt: "Help", size: "md" }))); };
+var CloseButton = function (props) { return (React__default["default"].createElement("button", { "aria-label": "Modal Close", title: "Close", className: "lui-modal-v2-header-close-btn", onClick: props.onClose },
+    React__default["default"].createElement(LuiIcon, { name: "ic_clear", alt: "Help", size: "md" }))); };
+
+var LuiAlertModalV2 = function (props) {
+    var level = props.level, className = props.className, children = props.children, rest = __rest(props, ["level", "className", "children"]);
+    var materialIcon = getMaterialIconForLevel(level);
+    var status = Object.keys(ICON_STATUS).includes(level)
+        ? level
+        : 'interactive';
+    return (React__default["default"].createElement(LuiModalV2, __assign({}, rest, { className: clsx("lui-modal-v2-".concat(level), className), headingIcon: {
+            name: "ic_".concat(materialIcon),
+            alt: level,
+            size: 'md',
+            status: status
+        } }), children));
+};
+
 var css_248z$e = "@keyframes react-loading-skeleton {\n  100% {\n    transform: translateX(100%);\n  }\n}\n\n.react-loading-skeleton {\n  --base-color: #ebebeb;\n  --highlight-color: #f5f5f5;\n  --animation-duration: 1.5s;\n  --animation-direction: normal;\n  --pseudo-element-display: block; /* Enable animation */\n\n  background-color: var(--base-color);\n\n  width: 100%;\n  border-radius: 0.25rem;\n  display: inline-flex;\n  line-height: 1;\n\n  position: relative;\n  user-select: none;\n  overflow: hidden;\n  z-index: 1; /* Necessary for overflow: hidden to work correctly in Safari */\n}\n\n.react-loading-skeleton::after {\n  content: ' ';\n  display: var(--pseudo-element-display);\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  height: 100%;\n  background-repeat: no-repeat;\n  background-image: linear-gradient(\n    90deg,\n    var(--base-color),\n    var(--highlight-color),\n    var(--base-color)\n  );\n  transform: translateX(-100%);\n\n  animation-name: react-loading-skeleton;\n  animation-direction: var(--animation-direction);\n  animation-duration: var(--animation-duration);\n  animation-timing-function: ease-in-out;\n  animation-iteration-count: infinite;\n}\n\n@media (prefers-reduced-motion) {\n  .react-loading-skeleton {\n    --pseudo-element-display: none; /* Disable animation */\n  }\n}\n";
 styleInject(css_248z$e);
 
@@ -46879,34 +46992,6 @@ var LuiTooltip = function (props) {
     return React__default["default"].createElement(Tippy, __assign({}, tippyProps), children);
 };
 
-/**
- * This hook will callback with handleClickOutside() when "mousedown" dom event occurs off the refElement
- * usage:
- ```typescript
-  const refElement = React.useRef<HTMLButtonElement>(null);
-  const handleClickOutside = () => {
-      console.log("hello world");
-  };
-  useClickedOutsideElement(refElement, handleClickOutside);
-  return <button ref={refElement}>Click Me!</button>;
- ```
- */
-function useClickedOutsideElement(refElement, handleClickOutside) {
-    React__default["default"].useEffect(function () {
-        function onOutsideClicked(event) {
-            var element = refElement.current;
-            if (!(element === null || element === void 0 ? void 0 : element.contains(event.target))) {
-                handleClickOutside();
-            }
-        }
-        document.addEventListener('mousedown', onOutsideClicked);
-        return function () {
-            document.removeEventListener('mousedown', onOutsideClicked);
-        };
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, []);
-}
-
 var getFillClassName = function (fillVariation, backgroundFill) {
     if (backgroundFill) {
         return 'LuiBadge--fill';
@@ -59319,6 +59404,7 @@ exports.LuiAccordicardStatic = LuiAccordicardStatic;
 exports.LuiAccordion = LuiAccordion;
 exports.LuiAlertModal = LuiAlertModal;
 exports.LuiAlertModalButtons = LuiAlertModalButtons;
+exports.LuiAlertModalV2 = LuiAlertModalV2;
 exports.LuiAppFooterSml = LuiAppFooterSml;
 exports.LuiBadge = LuiBadge;
 exports.LuiBanner = LuiBanner;
@@ -59372,6 +59458,8 @@ exports.LuiMenuCloseButtonV2 = LuiMenuCloseButtonV2;
 exports.LuiMessagingContextProvider = LuiMessagingContextProvider;
 exports.LuiMiniSpinner = LuiMiniSpinner;
 exports.LuiModal = LuiModal;
+exports.LuiModalV2 = LuiModalV2;
+exports.LuiModalV2Buttons = LuiModalV2Buttons;
 exports.LuiMoneyInput = LuiMoneyInput;
 exports.LuiMultiSwitch = LuiMultiSwitch;
 exports.LuiMultiSwitchYesNo = LuiMultiSwitchYesNo;