@oliasoft-open-source/react-ui-library 3.1.17 → 3.1.19

package/dist/index.js

@@ -1243,8 +1243,8 @@ function FaRegCircle(props) {
 function FaRegCopy(props) {
   return GenIcon({ "tag": "svg", "attr": { "viewBox": "0 0 448 512" }, "child": [{ "tag": "path", "attr": { "d": "M433.941 65.941l-51.882-51.882A48 48 0 0 0 348.118 0H176c-26.51 0-48 21.49-48 48v48H48c-26.51 0-48 21.49-48 48v320c0 26.51 21.49 48 48 48h224c26.51 0 48-21.49 48-48v-48h80c26.51 0 48-21.49 48-48V99.882a48 48 0 0 0-14.059-33.941zM266 464H54a6 6 0 0 1-6-6V150a6 6 0 0 1 6-6h74v224c0 26.51 21.49 48 48 48h96v42a6 6 0 0 1-6 6zm128-96H182a6 6 0 0 1-6-6V54a6 6 0 0 1 6-6h106v88c0 13.255 10.745 24 24 24h88v202a6 6 0 0 1-6 6zm6-256h-64V48h9.632c1.591 0 3.117.632 4.243 1.757l48.368 48.368a6 6 0 0 1 1.757 4.243V112z" } }] })(props);
 }
-const chevron = "_chevron_25xgl_329";
-const expanded$2 = "_expanded_25xgl_335";
+const chevron = "_chevron_ns2nu_329";
+const expanded$2 = "_expanded_ns2nu_335";
 const styles$Q = {
   chevron,
   expanded: expanded$2
@@ -1258,15 +1258,15 @@ const Chevron = ({
     className: cx(styles$Q.chevron)
   });
 };
-const accordion = "_accordion_1abkf_329";
-const accordionHeader = "_accordionHeader_1abkf_333";
-const heading$6 = "_heading_1abkf_337";
-const clickable$2 = "_clickable_1abkf_340";
-const bordered$4 = "_bordered_1abkf_346";
-const accordionContent = "_accordionContent_1abkf_350";
-const expanded$1 = "_expanded_1abkf_359";
-const padding$3 = "_padding_1abkf_368";
-const squareBottom = "_squareBottom_1abkf_371";
+const accordion = "_accordion_1hpxh_329";
+const accordionHeader = "_accordionHeader_1hpxh_333";
+const heading$6 = "_heading_1hpxh_337";
+const clickable$2 = "_clickable_1hpxh_340";
+const bordered$4 = "_bordered_1hpxh_346";
+const accordionContent = "_accordionContent_1hpxh_350";
+const expanded$1 = "_expanded_1hpxh_359";
+const padding$3 = "_padding_1hpxh_368";
+const squareBottom = "_squareBottom_1hpxh_371";
 const styles$P = {
   accordion,
   accordionHeader,
@@ -1377,17 +1377,17 @@ Accordion.propTypes = {
   squareBottom: propTypes$1.exports.bool,
   testId: propTypes$1.exports.string
 };
-const checkbox = "_checkbox_jh50z_329";
-const noLabel = "_noLabel_jh50z_342";
-const small$d = "_small_jh50z_345";
-const checkmark = "_checkmark_jh50z_371";
-const disabled$9 = "_disabled_jh50z_392";
-const noMargin$2 = "_noMargin_jh50z_406";
-const isInTable$4 = "_isInTable_jh50z_409";
+const checkbox = "_checkbox_di89x_329";
+const noLabel = "_noLabel_di89x_342";
+const small$e = "_small_di89x_345";
+const checkmark = "_checkmark_di89x_371";
+const disabled$9 = "_disabled_di89x_392";
+const noMargin$2 = "_noMargin_di89x_406";
+const isInTable$4 = "_isInTable_di89x_409";
 const styles$O = {
   checkbox,
   noLabel,
-  small: small$d,
+  small: small$e,
   checkmark,
   disabled: disabled$9,
   noMargin: noMargin$2,
@@ -1471,10 +1471,10 @@ CheckBox.propTypes = {
   dataix: propTypes$1.exports.number,
   value: propTypes$1.exports.string
 };
-const bordered$3 = "_bordered_19uvj_329";
-const checkboxWrapper = "_checkboxWrapper_19uvj_335";
-const padding$2 = "_padding_19uvj_341";
-const contentWrapper = "_contentWrapper_19uvj_344";
+const bordered$3 = "_bordered_1mb61_329";
+const checkboxWrapper = "_checkboxWrapper_1mb61_335";
+const padding$2 = "_padding_1mb61_341";
+const contentWrapper = "_contentWrapper_1mb61_344";
 const styles$N = {
   bordered: bordered$3,
   checkboxWrapper,
@@ -7647,10 +7647,10 @@ const DeprecatedIcon = ({
       return /* @__PURE__ */ jsx(FaRegCircle, {});
   }
 };
-const wrapper$4 = "_wrapper_1bcqv_329";
-const customSvg = "_customSvg_1bcqv_336";
-const customPng = "_customPng_1bcqv_339";
-const clickable$1 = "_clickable_1bcqv_344";
+const wrapper$4 = "_wrapper_6gikz_329";
+const customSvg = "_customSvg_6gikz_336";
+const customPng = "_customPng_6gikz_339";
+const clickable$1 = "_clickable_6gikz_344";
 const styles$M = {
   wrapper: wrapper$4,
   customSvg,
@@ -9683,34 +9683,34 @@ function useHover(_temp) {
     return onMouseLeave(null, true);
   }];
 }
-const wrapper$3 = "_wrapper_ddkhz_329";
-const layer$1 = "_layer_ddkhz_333";
-const layerContainer$1 = "_layerContainer_ddkhz_336";
-const nested = "_nested_ddkhz_350";
-const fileInput$1 = "_fileInput_ddkhz_362";
-const trigger$1 = "_trigger_ddkhz_368";
-const middleAlignedInline = "_middleAlignedInline_ddkhz_378";
-const heading$5 = "_heading_ddkhz_384";
-const headingIcon = "_headingIcon_ddkhz_390";
-const option$1 = "_option_ddkhz_402";
-const active$9 = "_active_ddkhz_419";
-const selected$1 = "_selected_ddkhz_424";
-const optionContent$1 = "_optionContent_ddkhz_431";
-const inline$3 = "_inline_ddkhz_436";
-const icon$7 = "_icon_ddkhz_441";
-const check$1 = "_check_ddkhz_442";
-const text$2 = "_text_ddkhz_468";
-const label$a = "_label_ddkhz_473";
-const description = "_description_ddkhz_484";
-const arrow = "_arrow_ddkhz_488";
-const divider$1 = "_divider_ddkhz_492";
-const deprecatedSemanticIcon = "_deprecatedSemanticIcon_ddkhz_496";
-const disabled$8 = "_disabled_ddkhz_500";
-const buttonLabel = "_buttonLabel_ddkhz_505";
-const buttonCaret = "_buttonCaret_ddkhz_512";
-const component = "_component_ddkhz_515";
-const right$7 = "_right_ddkhz_521";
-const actions$3 = "_actions_ddkhz_526";
+const wrapper$3 = "_wrapper_4p39y_329";
+const layer$1 = "_layer_4p39y_333";
+const layerContainer$1 = "_layerContainer_4p39y_336";
+const nested = "_nested_4p39y_350";
+const fileInput$1 = "_fileInput_4p39y_362";
+const trigger$1 = "_trigger_4p39y_368";
+const middleAlignedInline = "_middleAlignedInline_4p39y_378";
+const heading$5 = "_heading_4p39y_384";
+const headingIcon = "_headingIcon_4p39y_390";
+const option$1 = "_option_4p39y_402";
+const active$9 = "_active_4p39y_419";
+const selected$1 = "_selected_4p39y_424";
+const optionContent$1 = "_optionContent_4p39y_431";
+const inline$3 = "_inline_4p39y_436";
+const icon$7 = "_icon_4p39y_441";
+const check$1 = "_check_4p39y_442";
+const text$2 = "_text_4p39y_468";
+const label$a = "_label_4p39y_473";
+const description = "_description_4p39y_484";
+const arrow = "_arrow_4p39y_488";
+const divider$1 = "_divider_4p39y_492";
+const deprecatedSemanticIcon = "_deprecatedSemanticIcon_4p39y_496";
+const disabled$8 = "_disabled_4p39y_500";
+const buttonLabel = "_buttonLabel_4p39y_505";
+const buttonCaret = "_buttonCaret_4p39y_512";
+const component = "_component_4p39y_515";
+const right$7 = "_right_4p39y_521";
+const actions$2 = "_actions_4p39y_526";
 const styles$L = {
   wrapper: wrapper$3,
   layer: layer$1,
@@ -9739,7 +9739,7 @@ const styles$L = {
   buttonCaret,
   component,
   right: right$7,
-  actions: actions$3
+  actions: actions$2
 };
 const Heading$3 = ({
   label: label2,
@@ -9954,21 +9954,21 @@ const placementOptions$1 = (placement, isNested = false) => ({
   preferY: "bottom",
   placement: placement || (isNested ? "right-start" : "bottom-start")
 });
-const wrapper$2 = "_wrapper_1xc80_329";
-const badge = "_badge_1xc80_333";
-const label$9 = "_label_1xc80_338";
-const dark$1 = "_dark_1xc80_350";
-const light = "_light_1xc80_353";
-const small$c = "_small_1xc80_356";
-const dot = "_dot_1xc80_362";
-const hasChildren = "_hasChildren_1xc80_367";
+const wrapper$2 = "_wrapper_1520w_329";
+const badge = "_badge_1520w_333";
+const label$9 = "_label_1520w_338";
+const dark$1 = "_dark_1520w_350";
+const light = "_light_1520w_353";
+const small$d = "_small_1520w_356";
+const dot = "_dot_1520w_362";
+const hasChildren = "_hasChildren_1520w_367";
 const styles$K = {
   wrapper: wrapper$2,
   badge,
   label: label$9,
   dark: dark$1,
   light,
-  small: small$c,
+  small: small$d,
   dot,
   hasChildren
 };
@@ -10018,23 +10018,23 @@ Badge.propTypes = {
   margin: propTypes$1.exports.string,
   small: propTypes$1.exports.bool
 };
-const button$3 = "_button_hu9gg_363";
-const active$8 = "_active_hu9gg_397";
-const icon$6 = "_icon_hu9gg_409";
-const iconOnly = "_iconOnly_hu9gg_416";
-const basic = "_basic_hu9gg_426";
-const muted$1 = "_muted_hu9gg_432";
-const disabled$7 = "_disabled_hu9gg_445";
-const small$b = "_small_hu9gg_455";
-const pill = "_pill_hu9gg_460";
-const round = "_round_hu9gg_461";
-const orange$1 = "_orange_hu9gg_478";
-const red$1 = "_red_hu9gg_488";
-const green$1 = "_green_hu9gg_498";
-const inverted$1 = "_inverted_hu9gg_526";
-const groupOrderFirst$4 = "_groupOrderFirst_hu9gg_560";
-const groupOrderMiddle$4 = "_groupOrderMiddle_hu9gg_561";
-const groupOrderLast$4 = "_groupOrderLast_hu9gg_562";
+const button$3 = "_button_czseq_363";
+const active$8 = "_active_czseq_397";
+const icon$6 = "_icon_czseq_409";
+const iconOnly = "_iconOnly_czseq_416";
+const basic = "_basic_czseq_426";
+const muted$1 = "_muted_czseq_432";
+const disabled$7 = "_disabled_czseq_445";
+const small$c = "_small_czseq_455";
+const pill = "_pill_czseq_460";
+const round = "_round_czseq_461";
+const orange$1 = "_orange_czseq_478";
+const red$1 = "_red_czseq_488";
+const green$1 = "_green_czseq_498";
+const inverted$1 = "_inverted_czseq_526";
+const groupOrderFirst$4 = "_groupOrderFirst_czseq_560";
+const groupOrderMiddle$4 = "_groupOrderMiddle_czseq_561";
+const groupOrderLast$4 = "_groupOrderLast_czseq_562";
 const buttonStyles = {
   button: button$3,
   active: active$8,
@@ -10043,7 +10043,7 @@ const buttonStyles = {
   basic,
   muted: muted$1,
   disabled: disabled$7,
-  small: small$b,
+  small: small$c,
   pill,
   round,
   orange: orange$1,
@@ -10054,14 +10054,14 @@ const buttonStyles = {
   groupOrderMiddle: groupOrderMiddle$4,
   groupOrderLast: groupOrderLast$4
 };
-const spinner = "_spinner_16f46_329";
-const small$a = "_small_16f46_335";
-const tiny = "_tiny_16f46_339";
-const colored$1 = "_colored_16f46_366";
-const dark = "_dark_16f46_378";
+const spinner = "_spinner_21f2c_329";
+const small$b = "_small_21f2c_335";
+const tiny = "_tiny_21f2c_339";
+const colored$1 = "_colored_21f2c_366";
+const dark = "_dark_21f2c_378";
 const styles$J = {
   spinner,
-  small: small$a,
+  small: small$b,
   tiny,
   colored: colored$1,
   dark
@@ -10653,11 +10653,11 @@ Menu.propTypes = {
   open: propTypes$1.exports.bool,
   setOpen: propTypes$1.exports.func
 };
-const actions$2 = "_actions_a7fhh_329";
-const actionComponentContainer = "_actionComponentContainer_a7fhh_339";
-const active$7 = "_active_a7fhh_361";
+const actions$1 = "_actions_gc0pi_329";
+const actionComponentContainer = "_actionComponentContainer_gc0pi_339";
+const active$7 = "_active_gc0pi_361";
 const styles$I = {
-  actions: actions$2,
+  actions: actions$1,
   actionComponentContainer,
   active: active$7
 };
@@ -10771,15 +10771,15 @@ Actions.propTypes = {
   actions: actionsShape,
   right: propTypes$1.exports.bool
 };
-const breadcrumb = "_breadcrumb_1nzq0_329";
-const small$9 = "_small_1nzq0_332";
-const labelContainer = "_labelContainer_1nzq0_335";
-const active$6 = "_active_1nzq0_345";
-const disabled$6 = "_disabled_1nzq0_350";
-const separator = "_separator_1nzq0_355";
+const breadcrumb = "_breadcrumb_1ewgq_329";
+const small$a = "_small_1ewgq_332";
+const labelContainer = "_labelContainer_1ewgq_335";
+const active$6 = "_active_1ewgq_345";
+const disabled$6 = "_disabled_1ewgq_350";
+const separator = "_separator_1ewgq_355";
 const styles$H = {
   breadcrumb,
-  small: small$9,
+  small: small$a,
   labelContainer,
   active: active$6,
   disabled: disabled$6,
@@ -10854,9 +10854,9 @@ Breadcrumb.propTypes = {
   })).isRequired,
   small: propTypes$1.exports.bool
 };
-const tooltip = "_tooltip_80b7x_329";
-const error$8 = "_error_80b7x_343";
-const warning$b = "_warning_80b7x_347";
+const tooltip = "_tooltip_g3i5e_329";
+const error$8 = "_error_g3i5e_343";
+const warning$b = "_warning_g3i5e_347";
 const styles$G = {
   tooltip,
   error: error$8,
@@ -11010,8 +11010,8 @@ Tooltip$2.propTypes = {
   flex: propTypes$1.exports.string,
   forceOpen: propTypes$1.exports.bool
 };
-const label$8 = "_label_1nb62_329";
-const buttonGroup = "_buttonGroup_1nb62_339";
+const label$8 = "_label_t6aab_329";
+const buttonGroup = "_buttonGroup_t6aab_339";
 const styles$F = {
   label: label$8,
   buttonGroup
@@ -11121,13 +11121,13 @@ ButtonGroup.propTypes = {
   value: propTypes$1.exports.oneOfType([propTypes$1.exports.string, propTypes$1.exports.number]),
   testId: propTypes$1.exports.string
 };
-const card = "_card_1hame_329";
-const bordered$2 = "_bordered_1hame_332";
-const raised = "_raised_1hame_338";
-const cardHeader = "_cardHeader_1hame_341";
-const cardContentBorderTop = "_cardContentBorderTop_1hame_347";
-const padding$1 = "_padding_1hame_350";
-const cardContent = "_cardContent_1hame_347";
+const card = "_card_62ou5_329";
+const bordered$2 = "_bordered_62ou5_332";
+const raised = "_raised_62ou5_338";
+const cardHeader = "_cardHeader_62ou5_341";
+const cardContentBorderTop = "_cardContentBorderTop_62ou5_347";
+const padding$1 = "_padding_62ou5_350";
+const cardContent = "_cardContent_62ou5_347";
 const styles$E = {
   card,
   bordered: bordered$2,
@@ -12447,23 +12447,23 @@ Column.propTypes = {
   widthTablet: propTypes$1.exports.oneOfType([propTypes$1.exports.string, propTypes$1.exports.number]),
   testId: propTypes$1.exports.string
 };
-const divider = "_divider_t8bj0_329";
-const alignLeft = "_alignLeft_t8bj0_340";
-const alignRight = "_alignRight_t8bj0_343";
+const divider = "_divider_ifk4j_329";
+const alignLeft = "_alignLeft_ifk4j_340";
+const alignRight = "_alignRight_ifk4j_343";
 const styles$D = {
   divider,
   alignLeft,
   alignRight
 };
-const bold$1 = "_bold_1j5st_329";
-const center = "_center_1j5st_332";
-const muted = "_muted_1j5st_335";
-const faint$1 = "_faint_1j5st_338";
-const success$1 = "_success_1j5st_341";
-const warning$a = "_warning_1j5st_344";
-const error$7 = "_error_1j5st_347";
-const small$8 = "_small_1j5st_350";
-const link$1 = "_link_1j5st_353";
+const bold$1 = "_bold_cntjp_329";
+const center = "_center_cntjp_332";
+const muted = "_muted_cntjp_335";
+const faint$1 = "_faint_cntjp_338";
+const success$1 = "_success_cntjp_341";
+const warning$a = "_warning_cntjp_344";
+const error$7 = "_error_cntjp_347";
+const small$9 = "_small_cntjp_350";
+const link$1 = "_link_cntjp_353";
 const styles$C = {
   bold: bold$1,
   center,
@@ -12472,7 +12472,7 @@ const styles$C = {
   success: success$1,
   warning: warning$a,
   error: error$7,
-  small: small$8,
+  small: small$9,
   link: link$1
 };
 const Text = ({
@@ -12555,13 +12555,13 @@ Divider.propTypes = {
   color: propTypes$1.exports.string,
   align: propTypes$1.exports.string
 };
-const heading$4 = "_heading_1rsob_329";
-const top$1 = "_top_1rsob_337";
-const icons$2 = "_icons_1rsob_349";
-const icon$5 = "_icon_1rsob_349";
-const lock = "_lock_1rsob_363";
-const faint = "_faint_1rsob_366";
-const active$5 = "_active_1rsob_374";
+const heading$4 = "_heading_zih6k_329";
+const top$1 = "_top_zih6k_337";
+const icons$2 = "_icons_zih6k_349";
+const icon$5 = "_icon_zih6k_349";
+const lock = "_lock_zih6k_363";
+const faint = "_faint_zih6k_366";
+const active$5 = "_active_zih6k_374";
 const styles$B = {
   heading: heading$4,
   top: top$1,
@@ -12745,29 +12745,29 @@ const dialogShape = propTypes$1.exports.shape({
 Dialog.propTypes = {
   dialog: dialogShape.isRequired
 };
-const inputInTable$9 = "_inputInTable_z4c4u_329";
-const inputFocus$9 = "_inputFocus_z4c4u_345";
-const inputError$9 = "_inputError_z4c4u_350";
-const inputWarning$9 = "_inputWarning_z4c4u_351";
-const inputDisabled$9 = "_inputDisabled_z4c4u_382";
-const hideScrollbars$9 = "_hideScrollbars_z4c4u_387";
-const inline$1 = "_inline_z4c4u_409";
-const left$2 = "_left_z4c4u_412";
-const right$6 = "_right_z4c4u_415";
-const fixed$1 = "_fixed_z4c4u_418";
-const border = "_border_z4c4u_430";
-const shadow = "_shadow_z4c4u_436";
-const drawerContent = "_drawerContent_z4c4u_439";
-const isResizing = "_isResizing_z4c4u_451";
-const toggleButton = "_toggleButton_z4c4u_462";
-const top = "_top_z4c4u_475";
-const bottom = "_bottom_z4c4u_478";
-const toggleButtonOpen = "_toggleButtonOpen_z4c4u_481";
-const tabs$1 = "_tabs_z4c4u_484";
-const tab$1 = "_tab_z4c4u_484";
-const active$4 = "_active_z4c4u_515";
-const tabsContent = "_tabsContent_z4c4u_537";
-const resizeHandle = "_resizeHandle_z4c4u_543";
+const inputInTable$9 = "_inputInTable_4gx6k_329";
+const inputFocus$9 = "_inputFocus_4gx6k_345";
+const inputError$9 = "_inputError_4gx6k_350";
+const inputWarning$9 = "_inputWarning_4gx6k_351";
+const inputDisabled$9 = "_inputDisabled_4gx6k_382";
+const hideScrollbars$9 = "_hideScrollbars_4gx6k_387";
+const inline$1 = "_inline_4gx6k_409";
+const left$2 = "_left_4gx6k_412";
+const right$6 = "_right_4gx6k_415";
+const fixed$1 = "_fixed_4gx6k_418";
+const border = "_border_4gx6k_430";
+const shadow = "_shadow_4gx6k_436";
+const drawerContent = "_drawerContent_4gx6k_439";
+const isResizing = "_isResizing_4gx6k_451";
+const toggleButton = "_toggleButton_4gx6k_462";
+const top = "_top_4gx6k_475";
+const bottom = "_bottom_4gx6k_478";
+const toggleButtonOpen = "_toggleButtonOpen_4gx6k_481";
+const tabs$1 = "_tabs_4gx6k_484";
+const tab$1 = "_tab_4gx6k_484";
+const active$4 = "_active_4gx6k_515";
+const tabsContent = "_tabsContent_4gx6k_537";
+const resizeHandle = "_resizeHandle_4gx6k_543";
 const styles$z = {
   inputInTable: inputInTable$9,
   inputFocus: inputFocus$9,
@@ -15053,8 +15053,8 @@ Drawer.propTypes = {
   onResize: propTypes$1.exports.func,
   getActiveTab: propTypes$1.exports.func
 };
-const empty$1 = "_empty_1nr44_329";
-const text$1 = "_text_1nr44_339";
+const empty$1 = "_empty_1g72m_329";
+const text$1 = "_text_1g72m_339";
 const styles$y = {
   empty: empty$1,
   text: text$1
@@ -15119,7 +15119,7 @@ Empty.propTypes = {
   text: propTypes$1.exports.oneOfType([propTypes$1.exports.string, propTypes$1.exports.node]),
   children: propTypes$1.exports.node
 };
-const inputGroup = "_inputGroup_32yrz_329";
+const inputGroup = "_inputGroup_fj9a2_329";
 const styles$x = {
   inputGroup
 };
@@ -15168,21 +15168,21 @@ InputGroup.propTypes = {
   small: propTypes$1.exports.bool,
   width: propTypes$1.exports.oneOfType([propTypes$1.exports.string, propTypes$1.exports.number])
 };
-const inputInTable$8 = "_inputInTable_12o4t_329";
-const inputFocus$8 = "_inputFocus_12o4t_345";
-const inputError$8 = "_inputError_12o4t_350";
-const inputWarning$8 = "_inputWarning_12o4t_351";
-const inputDisabled$8 = "_inputDisabled_12o4t_382";
-const hideScrollbars$8 = "_hideScrollbars_12o4t_387";
-const input$2 = "_input_12o4t_329";
-const isInTable$3 = "_isInTable_12o4t_418";
-const small$7 = "_small_12o4t_446";
-const error$6 = "_error_12o4t_452";
-const warning$9 = "_warning_12o4t_467";
-const right$5 = "_right_12o4t_487";
-const groupOrderFirst$3 = "_groupOrderFirst_12o4t_490";
-const groupOrderMiddle$3 = "_groupOrderMiddle_12o4t_491";
-const groupOrderLast$3 = "_groupOrderLast_12o4t_492";
+const inputInTable$8 = "_inputInTable_tf34v_329";
+const inputFocus$8 = "_inputFocus_tf34v_345";
+const inputError$8 = "_inputError_tf34v_350";
+const inputWarning$8 = "_inputWarning_tf34v_351";
+const inputDisabled$8 = "_inputDisabled_tf34v_382";
+const hideScrollbars$8 = "_hideScrollbars_tf34v_387";
+const input$2 = "_input_tf34v_329";
+const isInTable$3 = "_isInTable_tf34v_418";
+const small$8 = "_small_tf34v_446";
+const error$6 = "_error_tf34v_452";
+const warning$9 = "_warning_tf34v_467";
+const right$5 = "_right_tf34v_487";
+const groupOrderFirst$3 = "_groupOrderFirst_tf34v_490";
+const groupOrderMiddle$3 = "_groupOrderMiddle_tf34v_491";
+const groupOrderLast$3 = "_groupOrderLast_tf34v_492";
 const styles$w = {
   inputInTable: inputInTable$8,
   inputFocus: inputFocus$8,
@@ -15192,7 +15192,7 @@ const styles$w = {
   hideScrollbars: hideScrollbars$8,
   input: input$2,
   isInTable: isInTable$3,
-  small: small$7,
+  small: small$8,
   error: error$6,
   warning: warning$9,
   right: right$5,
@@ -15427,10 +15427,10 @@ function HiLockClosed(props) {
 function HiLockOpen(props) {
   return GenIcon({ "tag": "svg", "attr": { "viewBox": "0 0 20 20", "fill": "currentColor" }, "child": [{ "tag": "path", "attr": { "d": "M10 2a5 5 0 00-5 5v2a2 2 0 00-2 2v5a2 2 0 002 2h10a2 2 0 002-2v-5a2 2 0 00-2-2H7V7a3 3 0 015.905-.75 1 1 0 001.937-.5A5.002 5.002 0 0010 2z" } }] })(props);
 }
-const label$7 = "_label_hnh5m_329";
-const labelLeft$1 = "_labelLeft_hnh5m_333";
-const icons$1 = "_icons_hnh5m_341";
-const icon$4 = "_icon_hnh5m_341";
+const label$7 = "_label_1pbb7_329";
+const labelLeft$1 = "_labelLeft_1pbb7_333";
+const icons$1 = "_icons_1pbb7_341";
+const icon$4 = "_icon_1pbb7_341";
 const styles$u = {
   label: label$7,
   labelLeft: labelLeft$1,
@@ -15530,17 +15530,17 @@ Label$2.propTypes = {
   }),
   labelLeft: propTypes$1.exports.bool
 };
-const field = "_field_1yec0_329";
-const labelLeft = "_labelLeft_1yec0_333";
-const fieldInput = "_fieldInput_1yec0_337";
-const formRow$1 = "_formRow_1yec0_340";
-const button$2 = "_button_1yec0_350";
+const field = "_field_9ng6g_329";
+const labelLeft = "_labelLeft_9ng6g_333";
+const fieldInput = "_fieldInput_9ng6g_337";
+const formRow$1 = "_formRow_9ng6g_340";
+const button$2 = "_button_9ng6g_350";
 const styles$t = {
   field,
   labelLeft,
   fieldInput,
   formRow: formRow$1,
-  "form-row": "_form-row_1yec0_341",
+  "form-row": "_form-row_9ng6g_341",
   button: button$2
 };
 const Field = ({
@@ -15656,7 +15656,7 @@ Flex.propTypes = {
   wrap: propTypes$1.exports.bool,
   gap: propTypes$1.exports.oneOfType([propTypes$1.exports.bool, propTypes$1.exports.string])
 };
-const formRow = "_formRow_1e395_329";
+const formRow = "_formRow_16j7m_329";
 const styles$s = {
   formRow
 };
@@ -15726,14 +15726,14 @@ Grid.propTypes = {
   height: propTypes$1.exports.string,
   children: propTypes$1.exports.node
 };
-const addon = "_addon_1trlr_329";
-const small$6 = "_small_1trlr_340";
-const groupOrderFirst$2 = "_groupOrderFirst_1trlr_344";
-const groupOrderMiddle$2 = "_groupOrderMiddle_1trlr_345";
-const groupOrderLast$2 = "_groupOrderLast_1trlr_350";
+const addon = "_addon_1php6_329";
+const small$7 = "_small_1php6_340";
+const groupOrderFirst$2 = "_groupOrderFirst_1php6_344";
+const groupOrderMiddle$2 = "_groupOrderMiddle_1php6_345";
+const groupOrderLast$2 = "_groupOrderLast_1php6_350";
 const styles$r = {
   addon,
-  small: small$6,
+  small: small$7,
   groupOrderFirst: groupOrderFirst$2,
   groupOrderMiddle: groupOrderMiddle$2,
   groupOrderLast: groupOrderLast$2
@@ -24638,41 +24638,41 @@ var InfiniteScroll = function(_super) {
   };
   return InfiniteScroll2;
 }(Component$1);
-const inputInTable$7 = "_inputInTable_11wqb_329";
-const inputFocus$7 = "_inputFocus_11wqb_345";
-const inputError$7 = "_inputError_11wqb_350";
-const inputWarning$7 = "_inputWarning_11wqb_351";
-const inputDisabled$7 = "_inputDisabled_11wqb_382";
-const hideScrollbars$7 = "_hideScrollbars_11wqb_387";
-const header$1 = "_header_11wqb_397";
-const headerTitle = "_headerTitle_11wqb_397";
-const heading$3 = "_heading_11wqb_398";
-const itemHeader = "_itemHeader_11wqb_398";
-const narrow = "_narrow_11wqb_401";
-const stickyHeader = "_stickyHeader_11wqb_405";
-const title$4 = "_title_11wqb_416";
-const name = "_name_11wqb_422";
-const iconTooltipMargin = "_iconTooltipMargin_11wqb_425";
-const bold = "_bold_11wqb_428";
-const toggleNarrow = "_toggleNarrow_11wqb_437";
-const drag = "_drag_11wqb_455";
-const list$1 = "_list_11wqb_475";
-const bordered$1 = "_bordered_11wqb_479";
-const item$4 = "_item_11wqb_398";
-const action = "_action_11wqb_512";
-const active$3 = "_active_11wqb_515";
-const disabled$5 = "_disabled_11wqb_530";
-const label$6 = "_label_11wqb_541";
-const details$2 = "_details_11wqb_548";
-const metadata = "_metadata_11wqb_549";
-const itemContent = "_itemContent_11wqb_558";
-const indentIcon = "_indentIcon_11wqb_562";
-const expandIcon = "_expandIcon_11wqb_566";
-const expanded = "_expanded_11wqb_572";
-const right$4 = "_right_11wqb_575";
-const actions$1 = "_actions_11wqb_582";
-const scrollableList = "_scrollableList_11wqb_587";
-const hideScrollbar = "_hideScrollbar_11wqb_387";
+const inputInTable$7 = "_inputInTable_b1zhu_329";
+const inputFocus$7 = "_inputFocus_b1zhu_345";
+const inputError$7 = "_inputError_b1zhu_350";
+const inputWarning$7 = "_inputWarning_b1zhu_351";
+const inputDisabled$7 = "_inputDisabled_b1zhu_382";
+const hideScrollbars$7 = "_hideScrollbars_b1zhu_387";
+const header$1 = "_header_b1zhu_397";
+const headerTitle = "_headerTitle_b1zhu_397";
+const heading$3 = "_heading_b1zhu_398";
+const itemHeader = "_itemHeader_b1zhu_398";
+const narrow = "_narrow_b1zhu_401";
+const stickyHeader = "_stickyHeader_b1zhu_405";
+const title$4 = "_title_b1zhu_416";
+const name = "_name_b1zhu_422";
+const iconTooltipMargin = "_iconTooltipMargin_b1zhu_425";
+const bold = "_bold_b1zhu_428";
+const toggleNarrow = "_toggleNarrow_b1zhu_437";
+const drag = "_drag_b1zhu_455";
+const list$1 = "_list_b1zhu_475";
+const bordered$1 = "_bordered_b1zhu_479";
+const item$4 = "_item_b1zhu_398";
+const action = "_action_b1zhu_512";
+const active$3 = "_active_b1zhu_515";
+const disabled$5 = "_disabled_b1zhu_530";
+const label$6 = "_label_b1zhu_541";
+const details$2 = "_details_b1zhu_548";
+const metadata = "_metadata_b1zhu_549";
+const itemContent = "_itemContent_b1zhu_558";
+const indentIcon = "_indentIcon_b1zhu_562";
+const expandIcon = "_expandIcon_b1zhu_566";
+const expanded = "_expanded_b1zhu_572";
+const right$4 = "_right_b1zhu_575";
+const actions = "_actions_b1zhu_582";
+const scrollableList = "_scrollableList_b1zhu_587";
+const hideScrollbar = "_hideScrollbar_b1zhu_387";
 const listStyles = {
   inputInTable: inputInTable$7,
   inputFocus: inputFocus$7,
@@ -24706,7 +24706,7 @@ const listStyles = {
   expandIcon,
   expanded,
   right: right$4,
-  actions: actions$1,
+  actions,
   scrollableList,
   hideScrollbar
 };
@@ -25268,13 +25268,13 @@ List.propTypes = {
   }),
   testId: propTypes$1.exports.string
 };
-const loader = "_loader_dtenj_329";
-const fullViewPortSize = "_fullViewPortSize_dtenj_335";
-const cover = "_cover_dtenj_342";
-const dimmer = "_dimmer_dtenj_349";
-const content$2 = "_content_dtenj_372";
-const text = "_text_dtenj_377";
-const details$1 = "_details_dtenj_381";
+const loader = "_loader_1i73r_329";
+const fullViewPortSize = "_fullViewPortSize_1i73r_335";
+const cover = "_cover_1i73r_342";
+const dimmer = "_dimmer_1i73r_349";
+const content$2 = "_content_1i73r_372";
+const text = "_text_1i73r_377";
+const details$1 = "_details_1i73r_381";
 const styles$q = {
   loader,
   fullViewPortSize,
@@ -25350,25 +25350,25 @@ Loader.propTypes = {
   testId: propTypes$1.exports.string,
   theme: propTypes$1.exports.string
 };
-const inputInTable$6 = "_inputInTable_3znmn_329";
-const inputFocus$6 = "_inputFocus_3znmn_345";
-const inputError$6 = "_inputError_3znmn_350";
-const inputWarning$6 = "_inputWarning_3znmn_351";
-const inputDisabled$6 = "_inputDisabled_3znmn_382";
-const hideScrollbars$6 = "_hideScrollbars_3znmn_387";
-const container$1 = "_container_3znmn_403";
-const block = "_block_3znmn_421";
-const info = "_info_3znmn_424";
-const success = "_success_3znmn_428";
-const warning$5 = "_warning_3znmn_432";
-const error$4 = "_error_3znmn_436";
-const content$1 = "_content_3znmn_440";
-const heading$2 = "_heading_3znmn_444";
-const icon$3 = "_icon_3znmn_452";
-const dismiss$1 = "_dismiss_3znmn_453";
-const absolute = "_absolute_3znmn_466";
-const legendToggle = "_legendToggle_3znmn_471";
-const detailsText = "_detailsText_3znmn_487";
+const inputInTable$6 = "_inputInTable_d8pbh_329";
+const inputFocus$6 = "_inputFocus_d8pbh_345";
+const inputError$6 = "_inputError_d8pbh_350";
+const inputWarning$6 = "_inputWarning_d8pbh_351";
+const inputDisabled$6 = "_inputDisabled_d8pbh_382";
+const hideScrollbars$6 = "_hideScrollbars_d8pbh_387";
+const container$1 = "_container_d8pbh_403";
+const block = "_block_d8pbh_421";
+const info = "_info_d8pbh_424";
+const success = "_success_d8pbh_428";
+const warning$5 = "_warning_d8pbh_432";
+const error$4 = "_error_d8pbh_436";
+const content$1 = "_content_d8pbh_440";
+const heading$2 = "_heading_d8pbh_444";
+const icon$3 = "_icon_d8pbh_452";
+const dismiss$1 = "_dismiss_d8pbh_453";
+const absolute = "_absolute_d8pbh_466";
+const legendToggle = "_legendToggle_d8pbh_471";
+const detailsText = "_detailsText_d8pbh_487";
 const styles$p = {
   inputInTable: inputInTable$6,
   inputFocus: inputFocus$6,
@@ -25539,10 +25539,10 @@ const Portal$1 = ({
 Portal$1.propTypes = {
   id: propTypes$1.exports.string.isRequired
 };
-const wrapper$1 = "_wrapper_1bkwq_329";
-const contentContainer = "_contentContainer_1bkwq_343";
-const centered = "_centered_1bkwq_355";
-const newLine = "_newLine_1bkwq_359";
+const wrapper$1 = "_wrapper_1nvir_329";
+const contentContainer = "_contentContainer_1nvir_343";
+const centered = "_centered_1nvir_355";
+const newLine = "_newLine_1nvir_359";
 const styles$o = {
   wrapper: wrapper$1,
   contentContainer,
@@ -25600,10 +25600,10 @@ Modal.propTypes = {
   centered: propTypes$1.exports.bool,
   width: propTypes$1.exports.string
 };
-const menu$1 = "_menu_vgf7r_329";
-const header = "_header_vgf7r_338";
-const item$3 = "_item_vgf7r_354";
-const heading$1 = "_heading_vgf7r_359";
+const menu$1 = "_menu_10aw9_329";
+const header = "_header_10aw9_338";
+const item$3 = "_item_10aw9_354";
+const heading$1 = "_heading_10aw9_359";
 const styles$n = {
   menu: menu$1,
   header,
@@ -25744,8 +25744,8 @@ OptionDropdown.propTypes = {
   onChange: propTypes$1.exports.func.isRequired,
   showHeader: propTypes$1.exports.bool
 };
-const page = "_page_1srmo_329";
-const scroll2 = "_scroll_1srmo_351";
+const page = "_page_1tpk9_329";
+const scroll2 = "_scroll_1tpk9_351";
 const styles$m = {
   page,
   scroll: scroll2
@@ -25782,23 +25782,23 @@ Page.propTypes = {
   scroll: propTypes$1.exports.bool,
   top: propTypes$1.exports.oneOfType([propTypes$1.exports.number, propTypes$1.exports.string])
 };
-const inputInTable$5 = "_inputInTable_197p7_329";
-const inputFocus$5 = "_inputFocus_197p7_345";
-const inputError$5 = "_inputError_197p7_350";
-const inputWarning$5 = "_inputWarning_197p7_351";
-const inputDisabled$5 = "_inputDisabled_197p7_382";
-const hideScrollbars$5 = "_hideScrollbars_197p7_387";
-const select = "_select_197p7_397";
-const isInTable$2 = "_isInTable_197p7_434";
-const unSelected = "_unSelected_197p7_450";
-const error$3 = "_error_197p7_457";
-const warning$4 = "_warning_197p7_472";
-const small$5 = "_small_197p7_487";
-const right$3 = "_right_197p7_494";
-const groupOrderFirst$1 = "_groupOrderFirst_197p7_504";
-const input$1 = "_input_197p7_329";
-const groupOrderMiddle$1 = "_groupOrderMiddle_197p7_505";
-const groupOrderLast$1 = "_groupOrderLast_197p7_506";
+const inputInTable$5 = "_inputInTable_1sg2p_329";
+const inputFocus$5 = "_inputFocus_1sg2p_345";
+const inputError$5 = "_inputError_1sg2p_350";
+const inputWarning$5 = "_inputWarning_1sg2p_351";
+const inputDisabled$5 = "_inputDisabled_1sg2p_382";
+const hideScrollbars$5 = "_hideScrollbars_1sg2p_387";
+const select = "_select_1sg2p_397";
+const isInTable$2 = "_isInTable_1sg2p_433";
+const unSelected = "_unSelected_1sg2p_449";
+const error$3 = "_error_1sg2p_456";
+const warning$4 = "_warning_1sg2p_471";
+const small$6 = "_small_1sg2p_486";
+const right$3 = "_right_1sg2p_493";
+const groupOrderFirst$1 = "_groupOrderFirst_1sg2p_503";
+const input$1 = "_input_1sg2p_329";
+const groupOrderMiddle$1 = "_groupOrderMiddle_1sg2p_504";
+const groupOrderLast$1 = "_groupOrderLast_1sg2p_505";
 const styles$l = {
   inputInTable: inputInTable$5,
   inputFocus: inputFocus$5,
@@ -25811,7 +25811,7 @@ const styles$l = {
   unSelected,
   error: error$3,
   warning: warning$4,
-  small: small$5,
+  small: small$6,
   right: right$3,
   groupOrderFirst: groupOrderFirst$1,
   input: input$1,
@@ -26163,6 +26163,18 @@ const useFocus = () => {
   };
   return [ref2, setFocus];
 };
+const useFontsReady = () => {
+  const [isFontLoaded, setFontLoaded] = useState(false);
+  useEffect(() => {
+    const fontIsReady = async () => {
+      if (!document.fonts)
+        return;
+      await document.fonts.ready.then(() => setFontLoaded(true));
+    };
+    fontIsReady();
+  }, []);
+  return isFontLoaded;
+};
 const getWidth = () => window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
 const useWindowWidth = () => {
   let [width, setWidth] = useState(getWidth());
@@ -26685,26 +26697,27 @@ var FixedSizeList = /* @__PURE__ */ createListComponent({
     }
   }
 });
-const layerContainer = "_layerContainer_7wl8p_329";
-const layer = "_layer_7wl8p_329";
-const heading = "_heading_7wl8p_351";
-const message = "_message_7wl8p_363";
-const option = "_option_7wl8p_367";
-const focused = "_focused_7wl8p_376";
-const disabled$4 = "_disabled_7wl8p_381";
-const selected = "_selected_7wl8p_385";
-const check = "_check_7wl8p_392";
-const optionContent = "_optionContent_7wl8p_400";
-const label$5 = "_label_7wl8p_405";
-const icon$2 = "_icon_7wl8p_412";
-const details = "_details_7wl8p_416";
-const actions = "_actions_7wl8p_424";
+const layerContainer = "_layerContainer_uzpyq_329";
+const layer = "_layer_uzpyq_329";
+const small$5 = "_small_uzpyq_351";
+const heading = "_heading_uzpyq_354";
+const option = "_option_uzpyq_355";
+const message = "_message_uzpyq_356";
+const focused = "_focused_uzpyq_389";
+const disabled$4 = "_disabled_uzpyq_394";
+const selected = "_selected_uzpyq_398";
+const check = "_check_uzpyq_404";
+const optionContent = "_optionContent_uzpyq_418";
+const label$5 = "_label_uzpyq_423";
+const icon$2 = "_icon_uzpyq_430";
+const details = "_details_uzpyq_434";
 const styles$k = {
   layerContainer,
   layer,
+  small: small$5,
   heading,
-  message,
   option,
+  message,
   focused,
   disabled: disabled$4,
   selected,
@@ -26712,8 +26725,7 @@ const styles$k = {
   optionContent,
   label: label$5,
   icon: icon$2,
-  details,
-  actions
+  details
 };
 const Heading = ({
   label: label2
@@ -26764,10 +26776,10 @@ const Option = ({
         closeLayer,
         right: true
       })
-    }), selected2 ? /* @__PURE__ */ jsx("span", {
+    }), /* @__PURE__ */ jsx("span", {
       className: styles$k.check,
-      children: /* @__PURE__ */ jsx(FaCheck, {})
-    }) : null]
+      children: selected2 ? /* @__PURE__ */ jsx(FaCheck, {}) : null
+    })]
   });
 };
 const Section = ({
@@ -26807,6 +26819,7 @@ const Layer = ({
   onSelectOption,
   focusedOptionIndex,
   width,
+  small: small2,
   firstSelectedOptionIndex,
   closeLayer,
   testId
@@ -26816,10 +26829,10 @@ const Layer = ({
       listRef.current.scrollToItem(firstSelectedOptionIndex, "start");
     }
   }, []);
-  const optionHeight = 38;
+  const optionHeight = small2 ? 24 : 38;
   return /* @__PURE__ */ jsx("div", {
     "data-testid": testId,
-    className: cx(styles$k.layer),
+    className: cx(styles$k.layer, small2 && styles$k.small),
     children: !sections.length ? /* @__PURE__ */ jsx("ul", {
       children: /* @__PURE__ */ jsx("li", {
         children: /* @__PURE__ */ jsx("div", {
@@ -26854,38 +26867,38 @@ const Layer = ({
     })
   });
 };
-const inputInTable$4 = "_inputInTable_1va0y_329";
-const inputFocus$4 = "_inputFocus_1va0y_345";
-const inputError$4 = "_inputError_1va0y_350";
-const inputWarning$4 = "_inputWarning_1va0y_351";
-const inputDisabled$4 = "_inputDisabled_1va0y_382";
-const hideScrollbars$4 = "_hideScrollbars_1va0y_387";
-const trigger = "_trigger_1va0y_397";
-const isInTable$1 = "_isInTable_1va0y_414";
-const input = "_input_1va0y_329";
-const isOpen = "_isOpen_1va0y_433";
-const error$2 = "_error_1va0y_449";
-const warning$3 = "_warning_1va0y_464";
-const disabled$3 = "_disabled_1va0y_479";
-const iconOpen = "_iconOpen_1va0y_484";
-const icons = "_icons_1va0y_487";
-const clearAll = "_clearAll_1va0y_496";
-const focus = "_focus_1va0y_502";
-const triggerInputContainer = "_triggerInputContainer_1va0y_518";
-const right$2 = "_right_1va0y_527";
-const multiOptions = "_multiOptions_1va0y_541";
-const multiOptionWrapper = "_multiOptionWrapper_1va0y_550";
-const small$4 = "_small_1va0y_554";
-const multiOption = "_multiOption_1va0y_541";
-const label$4 = "_label_1va0y_571";
-const closeMultiOption = "_closeMultiOption_1va0y_577";
-const selectedSingleValue = "_selectedSingleValue_1va0y_591";
-const placeHolder = "_placeHolder_1va0y_592";
-const searchable = "_searchable_1va0y_602";
-const groupOrderFirst = "_groupOrderFirst_1va0y_646";
-const groupOrderMiddle = "_groupOrderMiddle_1va0y_647";
-const groupOrderLast = "_groupOrderLast_1va0y_648";
-const detailedLabel = "_detailedLabel_1va0y_665";
+const inputInTable$4 = "_inputInTable_jptum_329";
+const inputFocus$4 = "_inputFocus_jptum_345";
+const inputError$4 = "_inputError_jptum_350";
+const inputWarning$4 = "_inputWarning_jptum_351";
+const inputDisabled$4 = "_inputDisabled_jptum_382";
+const hideScrollbars$4 = "_hideScrollbars_jptum_387";
+const trigger = "_trigger_jptum_397";
+const isInTable$1 = "_isInTable_jptum_412";
+const input = "_input_jptum_329";
+const isOpen = "_isOpen_jptum_431";
+const error$2 = "_error_jptum_447";
+const warning$3 = "_warning_jptum_462";
+const disabled$3 = "_disabled_jptum_477";
+const iconOpen = "_iconOpen_jptum_482";
+const icons = "_icons_jptum_485";
+const clearAll = "_clearAll_jptum_494";
+const small$4 = "_small_jptum_503";
+const focus = "_focus_jptum_512";
+const triggerInputContainer = "_triggerInputContainer_jptum_526";
+const right$2 = "_right_jptum_535";
+const multiOptions = "_multiOptions_jptum_548";
+const multiOptionWrapper = "_multiOptionWrapper_jptum_557";
+const multiOption = "_multiOption_jptum_548";
+const label$4 = "_label_jptum_584";
+const closeMultiOption = "_closeMultiOption_jptum_590";
+const selectedSingleValue = "_selectedSingleValue_jptum_605";
+const placeHolder = "_placeHolder_jptum_606";
+const searchable = "_searchable_jptum_615";
+const groupOrderFirst = "_groupOrderFirst_jptum_657";
+const groupOrderMiddle = "_groupOrderMiddle_jptum_658";
+const groupOrderLast = "_groupOrderLast_jptum_659";
+const detailedLabel = "_detailedLabel_jptum_676";
 const styles$j = {
   inputInTable: inputInTable$4,
   inputFocus: inputFocus$4,
@@ -26903,12 +26916,12 @@ const styles$j = {
   iconOpen,
   icons,
   clearAll,
+  small: small$4,
   focus,
   triggerInputContainer,
   right: right$2,
   multiOptions,
   multiOptionWrapper,
-  small: small$4,
   multiOption,
   label: label$4,
   closeMultiOption,
@@ -27274,6 +27287,7 @@ const CustomSelect = ({
   const createAble = onCreate !== null;
   const listRef = useRef(null);
   const [triggerRef, setTriggerFocus] = useFocus();
+  const isFontLoaded = useFontsReady();
   const [state, dispatch] = useReducer(reducer, {
     options,
     firstSelectedOptionIndex
@@ -27330,20 +27344,33 @@ const CustomSelect = ({
       setTriggerFocus();
     }
   };
-  const isAutoWidth = width === "auto";
-  const calcAutoWidth = isAutoWidth || autoLayerWidth;
-  const font = "bold 14px sans-serif";
-  const autoWidth = calcAutoWidth ? Math.ceil(options.reduce((acc, option2) => {
-    var _a, _b;
-    const optionActionsWidth = ((_b = (_a = option2 == null ? void 0 : option2.actions) == null ? void 0 : _a.length) != null ? _b : 0) * 24;
-    const optionWidth = getTextWidth(option2.label, font) + optionActionsWidth;
-    acc = optionWidth > acc ? optionWidth : acc;
-    return acc;
-  }, 0)) : null;
-  const extraTriggerWidth = calcAutoWidth ? 14 * 2 + 24 + (isMulti2 ? 11 : 0) + (clearable ? 28 : 0) + 12 : 0;
-  const triggerWidth = isAutoWidth ? `calc(${autoWidth}px + ${extraTriggerWidth}px)` : width;
-  const extraLayerWidth = autoLayerWidth ? 14 * 2 + 24 + 12 : 0;
-  const layerWidth = autoLayerWidth ? `calc(${autoWidth}px + ${extraLayerWidth}px)` : "0px";
+  const getWidestOptionWidth = useCallback$1(() => {
+    const fontSize = small2 ? "12px" : "14px";
+    const fontFamily = isFontLoaded ? "Lato" : "sans-serif";
+    const font = `${fontSize} ${fontFamily}`;
+    const widestTextWidth = Math.ceil(options.reduce((acc, option2) => {
+      var _a, _b;
+      const optionActionsWidth = ((_b = (_a = option2 == null ? void 0 : option2.actions) == null ? void 0 : _a.length) != null ? _b : 0) * 24;
+      const optionIconWidth = option2.icon ? (small2 ? 12 : 14) + 7 : 0;
+      const optionsText = `${option2.label} ${option2.details || ""}`;
+      const optionWidth = getTextWidth(optionsText, font) + optionActionsWidth + optionIconWidth;
+      acc = optionWidth > acc ? optionWidth : acc;
+      return acc;
+    }, getTextWidth(placeholder3, font)));
+    const extraWidth = (small2 ? 7 : 14) + (small2 ? 24 : 38) + 17 + (isMulti2 ? 16 : 0);
+    return widestTextWidth + extraWidth;
+  }, [options, isFontLoaded]);
+  const getTriggerWidth = () => {
+    if (width !== "auto")
+      return width;
+    return getWidestOptionWidth();
+  };
+  const getLayerWidth = (triggerBounds2) => {
+    if (!autoLayerWidth)
+      return triggerBounds2.width;
+    const layerWidth = Math.max(getWidestOptionWidth(), triggerBounds2.width);
+    return layerWidth;
+  };
   const {
     renderLayer,
     layerProps,
@@ -27480,7 +27507,7 @@ const CustomSelect = ({
       isOpen: state.isLayerOpen,
       focusedSelectedOptionIndex: state.triggerFocus.currentOption,
       clearAllIsFocused,
-      width: triggerWidth,
+      width: getTriggerWidth(),
       searchable: searchable2,
       triggerRef: mergeRefs(triggerRef, triggerProps.ref),
       error: error2,
@@ -27515,7 +27542,8 @@ const CustomSelect = ({
         },
         closeLayer: closeOnOptionActionClick ? closeLayer : null,
         triggerRect: triggerBounds,
-        width: `max(${layerWidth}, ${triggerBounds.width}px)`,
+        width: getLayerWidth(triggerBounds),
+        small: small2,
         focusedOptionIndex: state.layerFocus.current,
         firstSelectedOptionIndex,
         testId: testId && `${testId}-layer`
@@ -27968,9 +27996,9 @@ const paginationShape = propTypes$1.exports.shape({
 Pagination.propTypes = {
   pagination: paginationShape.isRequired
 };
-const toggleBox = "_toggleBox_l6e0m_329";
-const fullWidthStyleFix = "_fullWidthStyleFix_l6e0m_336";
-const dismiss = "_dismiss_l6e0m_341";
+const toggleBox = "_toggleBox_skr2d_329";
+const fullWidthStyleFix = "_fullWidthStyleFix_skr2d_336";
+const dismiss = "_dismiss_skr2d_341";
 const styles$h = {
   toggleBox,
   fullWidthStyleFix,
@@ -28172,14 +28200,14 @@ ProgressBar$1.propTypes = {
   showProgressColors: propTypes$1.exports.bool,
   noLabel: propTypes$1.exports.bool
 };
-const wrapper = "_wrapper_ddwqu_329";
-const inline = "_inline_ddwqu_329";
-const radio = "_radio_ddwqu_333";
-const labelMargin = "_labelMargin_ddwqu_336";
-const small$3 = "_small_ddwqu_352";
-const noMargin$1 = "_noMargin_ddwqu_356";
-const disabled$2 = "_disabled_ddwqu_415";
-const isInTable = "_isInTable_ddwqu_431";
+const wrapper = "_wrapper_9405w_329";
+const inline = "_inline_9405w_329";
+const radio = "_radio_9405w_333";
+const labelMargin = "_labelMargin_9405w_336";
+const small$3 = "_small_9405w_352";
+const noMargin$1 = "_noMargin_9405w_356";
+const disabled$2 = "_disabled_9405w_415";
+const isInTable = "_isInTable_9405w_431";
 const styles$e = {
   wrapper,
   inline,
@@ -28323,7 +28351,7 @@ RadioButton.propTypes = propTypes$1.exports.oneOfType([
   propTypes$1.exports.shape(RadioButtonShape),
   propTypes$1.exports.shape(RadioButtonShapeDeprecated)
 ]).isRequired;
-const row = "_row_1nd3x_329";
+const row = "_row_1vsni_329";
 const styles$d = {
   row
 };
@@ -28476,23 +28504,23 @@ var reactFastCompare = function isEqual3(a, b2) {
     throw error2;
   }
 };
-const inputInTable$3 = "_inputInTable_1in50_329";
-const inputFocus$3 = "_inputFocus_1in50_345";
-const inputError$3 = "_inputError_1in50_350";
-const inputWarning$3 = "_inputWarning_1in50_351";
-const inputDisabled$3 = "_inputDisabled_1in50_382";
-const hideScrollbars$3 = "_hideScrollbars_1in50_387";
-const sidebar = "_sidebar_1in50_400";
-const inner = "_inner_1in50_410";
-const title$3 = "_title_1in50_421";
-const subtitle = "_subtitle_1in50_422";
-const label$2 = "_label_1in50_423";
-const collapsed = "_collapsed_1in50_427";
-const list = "_list_1in50_450";
-const item$2 = "_item_1in50_456";
-const active$2 = "_active_1in50_477";
-const experimental = "_experimental_1in50_481";
-const icon$1 = "_icon_1in50_484";
+const inputInTable$3 = "_inputInTable_1mx1k_329";
+const inputFocus$3 = "_inputFocus_1mx1k_345";
+const inputError$3 = "_inputError_1mx1k_350";
+const inputWarning$3 = "_inputWarning_1mx1k_351";
+const inputDisabled$3 = "_inputDisabled_1mx1k_382";
+const hideScrollbars$3 = "_hideScrollbars_1mx1k_387";
+const sidebar = "_sidebar_1mx1k_400";
+const inner = "_inner_1mx1k_410";
+const title$3 = "_title_1mx1k_421";
+const subtitle = "_subtitle_1mx1k_422";
+const label$2 = "_label_1mx1k_423";
+const collapsed = "_collapsed_1mx1k_427";
+const list = "_list_1mx1k_450";
+const item$2 = "_item_1mx1k_456";
+const active$2 = "_active_1mx1k_477";
+const experimental = "_experimental_1mx1k_481";
+const icon$1 = "_icon_1mx1k_484";
 const styles$c = {
   inputInTable: inputInTable$3,
   inputFocus: inputFocus$3,
@@ -34572,13 +34600,13 @@ const SliderTooltip = ({
   });
 };
 const rcSlider = "";
-const container = "_container_1wkvy_329";
-const small$2 = "_small_1wkvy_335";
-const hasMarks = "_hasMarks_1wkvy_338";
-const vertical = "_vertical_1wkvy_341";
-const hasArrows = "_hasArrows_1wkvy_345";
-const button$1 = "_button_1wkvy_349";
-const label$1 = "_label_1wkvy_352";
+const container = "_container_qrqjq_329";
+const small$2 = "_small_qrqjq_335";
+const hasMarks = "_hasMarks_qrqjq_338";
+const vertical = "_vertical_qrqjq_341";
+const hasArrows = "_hasArrows_qrqjq_345";
+const button$1 = "_button_qrqjq_349";
+const label$1 = "_label_qrqjq_352";
 const styles$b = {
   container,
   small: small$2,
@@ -34784,22 +34812,22 @@ Spacer.propTypes = {
   width: propTypes$1.exports.oneOfType([propTypes$1.exports.string, propTypes$1.exports.number]),
   flex: propTypes$1.exports.bool
 };
-const inputInTable$2 = "_inputInTable_77ia1_329";
-const inputFocus$2 = "_inputFocus_77ia1_345";
-const inputError$2 = "_inputError_77ia1_350";
-const inputWarning$2 = "_inputWarning_77ia1_351";
-const inputDisabled$2 = "_inputDisabled_77ia1_382";
-const hideScrollbars$2 = "_hideScrollbars_77ia1_387";
-const cellWrapperPadding$3 = "_cellWrapperPadding_77ia1_397";
-const flexBlock$3 = "_flexBlock_77ia1_400";
-const scrollWrapper = "_scrollWrapper_77ia1_413";
-const bordered = "_bordered_77ia1_413";
-const maxHeight = "_maxHeight_77ia1_417";
-const table = "_table_77ia1_426";
-const cellWrapper$3 = "_cellWrapper_77ia1_397";
-const title$2 = "_title_77ia1_508";
-const footer$1 = "_footer_77ia1_509";
-const striped = "_striped_77ia1_514";
+const inputInTable$2 = "_inputInTable_x12kw_329";
+const inputFocus$2 = "_inputFocus_x12kw_345";
+const inputError$2 = "_inputError_x12kw_350";
+const inputWarning$2 = "_inputWarning_x12kw_351";
+const inputDisabled$2 = "_inputDisabled_x12kw_382";
+const hideScrollbars$2 = "_hideScrollbars_x12kw_387";
+const cellWrapperPadding$3 = "_cellWrapperPadding_x12kw_397";
+const flexBlock$3 = "_flexBlock_x12kw_400";
+const scrollWrapper = "_scrollWrapper_x12kw_413";
+const bordered = "_bordered_x12kw_413";
+const maxHeight = "_maxHeight_x12kw_417";
+const table = "_table_x12kw_426";
+const cellWrapper$3 = "_cellWrapper_x12kw_397";
+const title$2 = "_title_x12kw_508";
+const footer$1 = "_footer_x12kw_509";
+const striped = "_striped_x12kw_514";
 const styles$a = {
   inputInTable: inputInTable$2,
   inputFocus: inputFocus$2,
@@ -34818,10 +34846,10 @@ const styles$a = {
   footer: footer$1,
   striped
 };
-const cellWrapperPadding$2 = "_cellWrapperPadding_2vvab_329";
-const flexBlock$2 = "_flexBlock_2vvab_332";
-const cellWrapper$2 = "_cellWrapper_2vvab_329";
-const title$1 = "_title_2vvab_340";
+const cellWrapperPadding$2 = "_cellWrapperPadding_c4wz5_329";
+const flexBlock$2 = "_flexBlock_c4wz5_332";
+const cellWrapper$2 = "_cellWrapper_c4wz5_329";
+const title$1 = "_title_c4wz5_340";
 const styles$9 = {
   cellWrapperPadding: cellWrapperPadding$2,
   flexBlock: flexBlock$2,
@@ -34882,10 +34910,10 @@ Title$1.propTypes = {
   name: propTypes$1.exports.oneOfType([propTypes$1.exports.string, propTypes$1.exports.number]),
   testId: propTypes$1.exports.string
 };
-const cellWrapperPadding$1 = "_cellWrapperPadding_v0jy0_329";
-const flexBlock$1 = "_flexBlock_v0jy0_332";
-const cellWrapper$1 = "_cellWrapper_v0jy0_329";
-const footer = "_footer_v0jy0_340";
+const cellWrapperPadding$1 = "_cellWrapperPadding_zagix_329";
+const flexBlock$1 = "_flexBlock_zagix_332";
+const cellWrapper$1 = "_cellWrapper_zagix_329";
+const footer = "_footer_zagix_340";
 const styles$8 = {
   cellWrapperPadding: cellWrapperPadding$1,
   flexBlock: flexBlock$1,
@@ -34958,38 +34986,38 @@ function CgSortAz(props) {
 function CgSortZa(props) {
   return GenIcon({ "tag": "svg", "attr": { "viewBox": "0 0 24 24", "fill": "none" }, "child": [{ "tag": "path", "attr": { "d": "M6 16C6 16.5523 6.44772 17 7 17H17C17.5523 17 18 16.5523 18 16C18 15.4477 17.5523 15 17 15H7C6.44772 15 6 15.4477 6 16Z", "fill": "currentColor" } }, { "tag": "path", "attr": { "d": "M8 12C8 12.5523 8.44772 13 9 13H15C15.5523 13 16 12.5523 16 12C16 11.4477 15.5523 11 15 11H9C8.44772 11 8 11.4477 8 12Z", "fill": "currentColor" } }, { "tag": "path", "attr": { "d": "M11 9C10.4477 9 10 8.55229 10 8C10 7.44771 10.4477 7 11 7H13C13.5523 7 14 7.44771 14 8C14 8.55229 13.5523 9 13 9H11Z", "fill": "currentColor" } }] })(props);
 }
-const inputInTable$1 = "_inputInTable_1qid8_329";
-const inputFocus$1 = "_inputFocus_1qid8_345";
-const inputError$1 = "_inputError_1qid8_350";
-const inputWarning$1 = "_inputWarning_1qid8_351";
-const inputDisabled$1 = "_inputDisabled_1qid8_382";
-const hideScrollbars$1 = "_hideScrollbars_1qid8_387";
-const cellWrapperPadding = "_cellWrapperPadding_1qid8_397";
-const flexBlock = "_flexBlock_1qid8_400";
-const cellWrapper = "_cellWrapper_1qid8_397";
-const disabledLink = "_disabledLink_1qid8_418";
-const inputWrapper = "_inputWrapper_1qid8_422";
-const breakWord = "_breakWord_1qid8_438";
-const inputCell = "_inputCell_1qid8_441";
-const sliderCell = "_sliderCell_1qid8_444";
-const staticCell = "_staticCell_1qid8_448";
-const staticCellContent = "_staticCellContent_1qid8_451";
-const error$1 = "_error_1qid8_458";
-const warning$1 = "_warning_1qid8_459";
-const unit = "_unit_1qid8_492";
-const sortingCell = "_sortingCell_1qid8_495";
-const sortingCellIcon = "_sortingCellIcon_1qid8_503";
-const icon = "_icon_1qid8_510";
-const clickable = "_clickable_1qid8_521";
-const checkBoxCell = "_checkBoxCell_1qid8_525";
-const iconCell = "_iconCell_1qid8_529";
-const iconWrapper = "_iconWrapper_1qid8_534";
-const actionsCell = "_actionsCell_1qid8_538";
-const rightAligned = "_rightAligned_1qid8_542";
-const centerAligned = "_centerAligned_1qid8_545";
-const leftAligned = "_leftAligned_1qid8_548";
-const popover = "_popover_1qid8_551";
-const disabledPointerEvents = "_disabledPointerEvents_1qid8_554";
+const inputInTable$1 = "_inputInTable_1us9t_329";
+const inputFocus$1 = "_inputFocus_1us9t_345";
+const inputError$1 = "_inputError_1us9t_350";
+const inputWarning$1 = "_inputWarning_1us9t_351";
+const inputDisabled$1 = "_inputDisabled_1us9t_382";
+const hideScrollbars$1 = "_hideScrollbars_1us9t_387";
+const cellWrapperPadding = "_cellWrapperPadding_1us9t_397";
+const flexBlock = "_flexBlock_1us9t_400";
+const cellWrapper = "_cellWrapper_1us9t_397";
+const disabledLink = "_disabledLink_1us9t_418";
+const inputWrapper = "_inputWrapper_1us9t_422";
+const breakWord = "_breakWord_1us9t_438";
+const inputCell = "_inputCell_1us9t_441";
+const sliderCell = "_sliderCell_1us9t_444";
+const staticCell = "_staticCell_1us9t_448";
+const staticCellContent = "_staticCellContent_1us9t_451";
+const error$1 = "_error_1us9t_458";
+const warning$1 = "_warning_1us9t_459";
+const unit = "_unit_1us9t_492";
+const sortingCell = "_sortingCell_1us9t_495";
+const sortingCellIcon = "_sortingCellIcon_1us9t_503";
+const icon = "_icon_1us9t_510";
+const clickable = "_clickable_1us9t_521";
+const checkBoxCell = "_checkBoxCell_1us9t_525";
+const iconCell = "_iconCell_1us9t_529";
+const iconWrapper = "_iconWrapper_1us9t_534";
+const actionsCell = "_actionsCell_1us9t_538";
+const rightAligned = "_rightAligned_1us9t_542";
+const centerAligned = "_centerAligned_1us9t_545";
+const leftAligned = "_leftAligned_1us9t_548";
+const popover = "_popover_1us9t_551";
+const disabledPointerEvents = "_disabledPointerEvents_1us9t_554";
 const styles$7 = {
   inputInTable: inputInTable$1,
   inputFocus: inputFocus$1,
@@ -35582,13 +35610,13 @@ Cell.propTypes = {
   cell: cellShape,
   testId: propTypes$1.exports.string
 };
-const clickableRow = "_clickableRow_t6irm_329";
-const hoverableRow = "_hoverableRow_t6irm_332";
-const expandableRow = "_expandableRow_t6irm_336";
-const flush2 = "_flush_t6irm_336";
-const rowActive = "_rowActive_t6irm_340";
-const dragIconCell = "_dragIconCell_t6irm_356";
-const dragIcon = "_dragIcon_t6irm_356";
+const clickableRow = "_clickableRow_15h4s_329";
+const hoverableRow = "_hoverableRow_15h4s_332";
+const expandableRow = "_expandableRow_15h4s_336";
+const flush2 = "_flush_15h4s_336";
+const rowActive = "_rowActive_15h4s_340";
+const dragIconCell = "_dragIconCell_15h4s_356";
+const dragIcon = "_dragIcon_15h4s_356";
 const styles$6 = {
   clickableRow,
   hoverableRow,
@@ -36045,16 +36073,16 @@ Table.propTypes = {
   }).isRequired,
   onListReorder: propTypes$1.exports.func
 };
-const tabs = "_tabs_16czx_329";
-const padding = "_padding_16czx_335";
-const margin = "_margin_16czx_339";
-const contentPadding = "_contentPadding_16czx_342";
-const item$1 = "_item_16czx_345";
-const active$1 = "_active_16czx_374";
-const hidden = "_hidden_16czx_379";
-const disabled$1 = "_disabled_16czx_382";
-const left$1 = "_left_16czx_386";
-const right$1 = "_right_16czx_386";
+const tabs = "_tabs_10e36_329";
+const padding = "_padding_10e36_335";
+const margin = "_margin_10e36_339";
+const contentPadding = "_contentPadding_10e36_342";
+const item$1 = "_item_10e36_345";
+const active$1 = "_active_10e36_374";
+const hidden = "_hidden_10e36_379";
+const disabled$1 = "_disabled_10e36_382";
+const left$1 = "_left_10e36_386";
+const right$1 = "_right_10e36_386";
 const styles$5 = {
   tabs,
   padding,
@@ -36276,17 +36304,17 @@ TextLink.propTypes = {
   target: propTypes$1.exports.string,
   testId: propTypes$1.exports.string
 };
-const inputInTable = "_inputInTable_165qc_329";
-const inputFocus = "_inputFocus_165qc_345";
-const inputError = "_inputError_165qc_350";
-const inputWarning = "_inputWarning_165qc_351";
-const inputDisabled = "_inputDisabled_165qc_382";
-const hideScrollbars = "_hideScrollbars_165qc_387";
-const textarea = "_textarea_165qc_397";
-const small$1 = "_small_165qc_430";
-const error = "_error_165qc_436";
-const warning = "_warning_165qc_451";
-const monospace = "_monospace_165qc_466";
+const inputInTable = "_inputInTable_1xj0c_329";
+const inputFocus = "_inputFocus_1xj0c_345";
+const inputError = "_inputError_1xj0c_350";
+const inputWarning = "_inputWarning_1xj0c_351";
+const inputDisabled = "_inputDisabled_1xj0c_382";
+const hideScrollbars = "_hideScrollbars_1xj0c_387";
+const textarea = "_textarea_1xj0c_397";
+const small$1 = "_small_1xj0c_430";
+const error = "_error_1xj0c_436";
+const warning = "_warning_1xj0c_451";
+const monospace = "_monospace_1xj0c_466";
 const styles$4 = {
   inputInTable,
   inputFocus,
@@ -37452,10 +37480,10 @@ const toast = ({
     transition: Slide
   });
 };
-const toggle$1 = "_toggle_1qdm7_337";
-const small = "_small_1qdm7_350";
-const disabled = "_disabled_1qdm7_423";
-const noMargin = "_noMargin_1qdm7_434";
+const toggle$1 = "_toggle_1k90z_337";
+const small = "_small_1k90z_350";
+const disabled = "_disabled_1k90z_423";
+const noMargin = "_noMargin_1k90z_434";
 const styles$3 = {
   toggle: toggle$1,
   small,
@@ -37512,20 +37540,20 @@ Toggle.propTypes = {
   noMargin: propTypes$1.exports.bool,
   testId: propTypes$1.exports.string
 };
-const topbar = "_topbar_c0x79_335";
-const fixed = "_fixed_c0x79_346";
-const title = "_title_c0x79_354";
-const label = "_label_c0x79_370";
-const brand = "_brand_c0x79_375";
-const version = "_version_c0x79_381";
-const link = "_link_c0x79_382";
-const left = "_left_c0x79_393";
-const right = "_right_c0x79_394";
-const item = "_item_c0x79_405";
-const button = "_button_c0x79_423";
-const menu = "_menu_c0x79_424";
-const active = "_active_c0x79_451";
-const alert = "_alert_c0x79_478";
+const topbar = "_topbar_1hu2l_335";
+const fixed = "_fixed_1hu2l_346";
+const title = "_title_1hu2l_354";
+const label = "_label_1hu2l_370";
+const brand = "_brand_1hu2l_375";
+const version = "_version_1hu2l_381";
+const link = "_link_1hu2l_382";
+const left = "_left_1hu2l_393";
+const right = "_right_1hu2l_394";
+const item = "_item_1hu2l_405";
+const button = "_button_1hu2l_423";
+const menu = "_menu_1hu2l_424";
+const active = "_active_1hu2l_451";
+const alert = "_alert_1hu2l_478";
 const styles$2 = {
   topbar,
   fixed,
@@ -43429,12 +43457,12 @@ function AiOutlineMinusSquare(props) {
 function AiOutlinePlusSquare(props) {
   return GenIcon({ "tag": "svg", "attr": { "viewBox": "0 0 1024 1024" }, "child": [{ "tag": "path", "attr": { "d": "M328 544h152v152c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8V544h152c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8H544V328c0-4.4-3.6-8-8-8h-48c-4.4 0-8 3.6-8 8v152H328c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8z" } }, { "tag": "path", "attr": { "d": "M880 112H144c-17.7 0-32 14.3-32 32v736c0 17.7 14.3 32 32 32h736c17.7 0 32-14.3 32-32V144c0-17.7-14.3-32-32-32zm-40 728H184V184h656v656z" } }] })(props);
 }
-const tree = "_tree_of4m6_329";
-const toggle = "_toggle_of4m6_332";
-const dropTarget = "_dropTarget_of4m6_336";
-const draggingSource = "_draggingSource_of4m6_339";
-const placeholderContainer = "_placeholderContainer_of4m6_342";
-const placeholder2 = "_placeholder_of4m6_342";
+const tree = "_tree_1hzfx_329";
+const toggle = "_toggle_1hzfx_332";
+const dropTarget = "_dropTarget_1hzfx_336";
+const draggingSource = "_draggingSource_1hzfx_339";
+const placeholderContainer = "_placeholderContainer_1hzfx_342";
+const placeholder2 = "_placeholder_1hzfx_342";
 const styles = {
   tree,
   toggle,