@oliasoft-open-source/react-ui-library 4.0.0-beta-20 → 4.0.0-beta-22

package/dist/index.js

@@ -11278,34 +11278,34 @@ var lodash = { exports: {} };
   }).call(commonjsGlobal);
 })(lodash, lodash.exports);
 const _$1 = lodash.exports;
-const wrapper$4 = "_wrapper_5n8qf_1";
-const layer$1 = "_layer_5n8qf_5";
-const layerContainer$1 = "_layerContainer_5n8qf_8";
-const nested = "_nested_5n8qf_23";
-const fileInput$1 = "_fileInput_5n8qf_35";
-const trigger$2 = "_trigger_5n8qf_41";
-const middleAlignedInline = "_middleAlignedInline_5n8qf_50";
-const heading$5 = "_heading_5n8qf_56";
-const headingIcon = "_headingIcon_5n8qf_62";
-const option$1 = "_option_5n8qf_74";
-const active$8 = "_active_5n8qf_92";
-const selected$1 = "_selected_5n8qf_97";
-const optionContent$1 = "_optionContent_5n8qf_104";
-const inline$4 = "_inline_5n8qf_109";
-const icon$5 = "_icon_5n8qf_114";
-const check$1 = "_check_5n8qf_115";
-const text$3 = "_text_5n8qf_136";
-const label$a = "_label_5n8qf_141";
-const description = "_description_5n8qf_152";
-const arrow$1 = "_arrow_5n8qf_156";
-const divider$1 = "_divider_5n8qf_160";
-const deprecatedSemanticIcon = "_deprecatedSemanticIcon_5n8qf_164";
-const disabled$8 = "_disabled_5n8qf_168";
-const buttonLabel = "_buttonLabel_5n8qf_173";
-const buttonCaret = "_buttonCaret_5n8qf_179";
-const component = "_component_5n8qf_183";
-const right$7 = "_right_5n8qf_189";
-const actions$2 = "_actions_5n8qf_194";
+const wrapper$4 = "_wrapper_2zria_1";
+const layer$1 = "_layer_2zria_5";
+const layerContainer$1 = "_layerContainer_2zria_8";
+const nested = "_nested_2zria_23";
+const fileInput$1 = "_fileInput_2zria_35";
+const trigger$2 = "_trigger_2zria_41";
+const middleAlignedInline = "_middleAlignedInline_2zria_50";
+const heading$5 = "_heading_2zria_56";
+const headingIcon = "_headingIcon_2zria_62";
+const option$1 = "_option_2zria_74";
+const active$8 = "_active_2zria_92";
+const selected$1 = "_selected_2zria_97";
+const optionContent$1 = "_optionContent_2zria_103";
+const inline$4 = "_inline_2zria_108";
+const icon$5 = "_icon_2zria_113";
+const check$1 = "_check_2zria_114";
+const text$3 = "_text_2zria_136";
+const label$a = "_label_2zria_141";
+const description = "_description_2zria_152";
+const arrow$1 = "_arrow_2zria_156";
+const divider$1 = "_divider_2zria_160";
+const deprecatedSemanticIcon = "_deprecatedSemanticIcon_2zria_164";
+const disabled$8 = "_disabled_2zria_168";
+const buttonLabel = "_buttonLabel_2zria_173";
+const buttonCaret = "_buttonCaret_2zria_179";
+const component = "_component_2zria_183";
+const right$7 = "_right_2zria_189";
+const actions$2 = "_actions_2zria_194";
 const styles$M = {
   wrapper: wrapper$4,
   layer: layer$1,
@@ -12550,8 +12550,8 @@ Breadcrumb.propTypes = {
   ).isRequired,
   small: propTypes$1.exports.bool
 };
-const label$8 = "_label_1m8h2_1";
-const buttonGroup = "_buttonGroup_1m8h2_11";
+const label$8 = "_label_iu2wi_1";
+const buttonGroup = "_buttonGroup_iu2wi_11";
 const styles$H = {
   label: label$8,
   buttonGroup
@@ -14190,13 +14190,13 @@ Heading$2.propTypes = {
   top: propTypes$1.exports.bool,
   testId: propTypes$1.exports.string
 };
-const dialog = "_dialog_122co_1";
-const inline$3 = "_inline_122co_18";
-const scroll$3 = "_scroll_122co_21";
-const header$2 = "_header_122co_24";
-const dismiss$2 = "_dismiss_122co_33";
-const content$3 = "_content_122co_38";
-const footer$2 = "_footer_122co_47";
+const dialog = "_dialog_gpudp_1";
+const inline$3 = "_inline_gpudp_18";
+const scroll$3 = "_scroll_gpudp_21";
+const header$2 = "_header_gpudp_24";
+const dismiss$2 = "_dismiss_gpudp_33";
+const content$3 = "_content_gpudp_38";
+const footer$2 = "_footer_gpudp_47";
 const styles$C = {
   dialog,
   inline: inline$3,
@@ -16797,7 +16797,7 @@ const styles$y = {
   groupOrderLast: groupOrderLast$3
 };
 const widthOfCharacters = (characterCount) => {
-  const padding2 = "15px";
+  const padding2 = "var(--padding-input-x)";
   const multiplier = "0.675em";
   return `calc((${characterCount} * ${multiplier}) + (2 * ${padding2}))`;
 };
@@ -17037,9 +17037,9 @@ FileInput.propTypes = {
   onChange: propTypes$1.exports.func,
   testId: propTypes$1.exports.string
 };
-const label$7 = "_label_r02ug_1";
-const labelLeft$1 = "_labelLeft_r02ug_5";
-const icons$1 = "_icons_r02ug_13";
+const label$7 = "_label_1dz6f_1";
+const labelLeft$1 = "_labelLeft_1dz6f_5";
+const icons$1 = "_icons_1dz6f_13";
 const styles$w = {
   label: label$7,
   labelLeft: labelLeft$1,
@@ -26298,42 +26298,42 @@ var InfiniteScroll = function(_super) {
   };
   return InfiniteScroll2;
 }(Component$1);
-const inputInTable$8 = "_inputInTable_1ygse_1";
-const inputHover$8 = "_inputHover_1ygse_13";
-const inputFocus$8 = "_inputFocus_1ygse_18";
-const inputError$8 = "_inputError_1ygse_25";
-const inputWarning$8 = "_inputWarning_1ygse_26";
-const inputDisabled$8 = "_inputDisabled_1ygse_61";
-const hideScrollbars$8 = "_hideScrollbars_1ygse_67";
-const header$1 = "_header_1ygse_77";
-const headerTitle = "_headerTitle_1ygse_77";
-const heading$3 = "_heading_1ygse_78";
-const itemHeader = "_itemHeader_1ygse_78";
-const narrow = "_narrow_1ygse_81";
-const stickyHeader = "_stickyHeader_1ygse_85";
-const title$3 = "_title_1ygse_96";
-const name = "_name_1ygse_102";
-const iconTooltipMargin = "_iconTooltipMargin_1ygse_105";
-const bold = "_bold_1ygse_108";
-const toggleNarrow = "_toggleNarrow_1ygse_117";
-const drag$1 = "_drag_1ygse_135";
-const list$1 = "_list_1ygse_152";
-const bordered$1 = "_bordered_1ygse_156";
-const item$4 = "_item_1ygse_78";
-const action = "_action_1ygse_189";
-const active$3 = "_active_1ygse_192";
-const disabled$5 = "_disabled_1ygse_207";
-const label$6 = "_label_1ygse_218";
-const details$2 = "_details_1ygse_225";
-const metadata = "_metadata_1ygse_226";
-const itemContent = "_itemContent_1ygse_234";
-const indentIcon = "_indentIcon_1ygse_241";
-const expandIcon = "_expandIcon_1ygse_246";
-const expanded = "_expanded_1ygse_252";
-const right$4 = "_right_1ygse_255";
-const actions = "_actions_1ygse_263";
-const scrollableList = "_scrollableList_1ygse_268";
-const hideScrollbar = "_hideScrollbar_1ygse_67";
+const inputInTable$8 = "_inputInTable_3ijn4_1";
+const inputHover$8 = "_inputHover_3ijn4_13";
+const inputFocus$8 = "_inputFocus_3ijn4_18";
+const inputError$8 = "_inputError_3ijn4_25";
+const inputWarning$8 = "_inputWarning_3ijn4_26";
+const inputDisabled$8 = "_inputDisabled_3ijn4_61";
+const hideScrollbars$8 = "_hideScrollbars_3ijn4_67";
+const header$1 = "_header_3ijn4_77";
+const headerTitle = "_headerTitle_3ijn4_77";
+const heading$3 = "_heading_3ijn4_78";
+const itemHeader = "_itemHeader_3ijn4_78";
+const narrow = "_narrow_3ijn4_81";
+const stickyHeader = "_stickyHeader_3ijn4_85";
+const title$3 = "_title_3ijn4_96";
+const name = "_name_3ijn4_102";
+const iconTooltipMargin = "_iconTooltipMargin_3ijn4_105";
+const bold = "_bold_3ijn4_108";
+const toggleNarrow = "_toggleNarrow_3ijn4_117";
+const drag$1 = "_drag_3ijn4_135";
+const list$1 = "_list_3ijn4_152";
+const bordered$1 = "_bordered_3ijn4_156";
+const item$4 = "_item_3ijn4_78";
+const action = "_action_3ijn4_189";
+const active$3 = "_active_3ijn4_192";
+const disabled$5 = "_disabled_3ijn4_207";
+const label$6 = "_label_3ijn4_218";
+const details$2 = "_details_3ijn4_224";
+const metadata = "_metadata_3ijn4_225";
+const itemContent = "_itemContent_3ijn4_233";
+const indentIcon = "_indentIcon_3ijn4_240";
+const expandIcon = "_expandIcon_3ijn4_245";
+const expanded = "_expanded_3ijn4_252";
+const right$4 = "_right_3ijn4_255";
+const actions = "_actions_3ijn4_264";
+const scrollableList = "_scrollableList_3ijn4_269";
+const hideScrollbar = "_hideScrollbar_3ijn4_67";
 const listStyles = {
   inputInTable: inputInTable$8,
   inputHover: inputHover$8,
@@ -27019,27 +27019,27 @@ Loader.propTypes = {
   testId: propTypes$1.exports.string,
   theme: propTypes$1.exports.string
 };
-const inputInTable$7 = "_inputInTable_145az_1";
-const inputHover$7 = "_inputHover_145az_13";
-const inputFocus$7 = "_inputFocus_145az_18";
-const inputError$7 = "_inputError_145az_25";
-const inputWarning$7 = "_inputWarning_145az_26";
-const inputDisabled$7 = "_inputDisabled_145az_61";
-const hideScrollbars$7 = "_hideScrollbars_145az_67";
-const container$1 = "_container_145az_83";
-const block$1 = "_block_145az_101";
-const info = "_info_145az_104";
-const success = "_success_145az_108";
-const warning$6 = "_warning_145az_112";
-const error$4 = "_error_145az_116";
-const content$1 = "_content_145az_120";
-const heading$2 = "_heading_145az_124";
-const icon$3 = "_icon_145az_131";
-const dismiss$1 = "_dismiss_145az_139";
-const absolute = "_absolute_145az_143";
-const legendToggle = "_legendToggle_145az_154";
-const detailsText = "_detailsText_145az_164";
-const footer$1 = "_footer_145az_168";
+const inputInTable$7 = "_inputInTable_ks2y1_1";
+const inputHover$7 = "_inputHover_ks2y1_13";
+const inputFocus$7 = "_inputFocus_ks2y1_18";
+const inputError$7 = "_inputError_ks2y1_25";
+const inputWarning$7 = "_inputWarning_ks2y1_26";
+const inputDisabled$7 = "_inputDisabled_ks2y1_61";
+const hideScrollbars$7 = "_hideScrollbars_ks2y1_67";
+const container$1 = "_container_ks2y1_83";
+const block$1 = "_block_ks2y1_101";
+const info = "_info_ks2y1_104";
+const success = "_success_ks2y1_108";
+const warning$6 = "_warning_ks2y1_112";
+const error$4 = "_error_ks2y1_116";
+const content$1 = "_content_ks2y1_120";
+const heading$2 = "_heading_ks2y1_124";
+const icon$3 = "_icon_ks2y1_131";
+const dismiss$1 = "_dismiss_ks2y1_139";
+const absolute = "_absolute_ks2y1_143";
+const legendToggle = "_legendToggle_ks2y1_154";
+const detailsText = "_detailsText_ks2y1_164";
+const footer$1 = "_footer_ks2y1_168";
 const styles$r = {
   inputInTable: inputInTable$7,
   inputHover: inputHover$7,
@@ -27436,9 +27436,9 @@ const Page = ({ children, left: left2, padding: paddingProp, scroll: scroll3, to
 Page.defaultProps = {
   children: null,
   padding: true,
-  left: "48px",
+  left: "var(--size-sidebar)",
   scroll: true,
-  top: "48px"
+  top: "var(--size-topbar)"
 };
 Page.propTypes = {
   children: propTypes$1.exports.node,
@@ -28651,37 +28651,37 @@ const Layer = ({
     })
   });
 };
-const inputInTable$5 = "_inputInTable_xuwli_1";
-const inputHover$5 = "_inputHover_xuwli_13";
-const inputFocus$5 = "_inputFocus_xuwli_18";
-const inputError$5 = "_inputError_xuwli_25";
-const inputWarning$5 = "_inputWarning_xuwli_26";
-const inputDisabled$5 = "_inputDisabled_xuwli_61";
-const hideScrollbars$5 = "_hideScrollbars_xuwli_67";
-const trigger$1 = "_trigger_xuwli_77";
-const isInTable$1 = "_isInTable_xuwli_93";
-const input = "_input_xuwli_1";
-const isOpen = "_isOpen_xuwli_114";
-const error$2 = "_error_xuwli_122";
-const warning$4 = "_warning_xuwli_139";
-const disabled$3 = "_disabled_xuwli_156";
-const icons = "_icons_xuwli_162";
-const clearAll = "_clearAll_xuwli_169";
-const iconOpen = "_iconOpen_xuwli_170";
-const small$4 = "_small_xuwli_181";
-const triggerInputContainer = "_triggerInputContainer_xuwli_189";
-const right$2 = "_right_xuwli_198";
-const multiOptions = "_multiOptions_xuwli_211";
-const multiOption = "_multiOption_xuwli_211";
-const label$4 = "_label_xuwli_239";
-const closeMultiOption = "_closeMultiOption_xuwli_242";
-const focus = "_focus_xuwli_253";
-const selectedSingleValue = "_selectedSingleValue_xuwli_257";
-const placeHolder = "_placeHolder_xuwli_258";
-const groupOrderFirst = "_groupOrderFirst_xuwli_297";
-const groupOrderMiddle = "_groupOrderMiddle_xuwli_298";
-const groupOrderLast = "_groupOrderLast_xuwli_302";
-const detailedLabel = "_detailedLabel_xuwli_307";
+const inputInTable$5 = "_inputInTable_1st63_1";
+const inputHover$5 = "_inputHover_1st63_13";
+const inputFocus$5 = "_inputFocus_1st63_18";
+const inputError$5 = "_inputError_1st63_25";
+const inputWarning$5 = "_inputWarning_1st63_26";
+const inputDisabled$5 = "_inputDisabled_1st63_61";
+const hideScrollbars$5 = "_hideScrollbars_1st63_67";
+const trigger$1 = "_trigger_1st63_77";
+const isInTable$1 = "_isInTable_1st63_93";
+const input = "_input_1st63_1";
+const isOpen = "_isOpen_1st63_114";
+const error$2 = "_error_1st63_122";
+const warning$4 = "_warning_1st63_139";
+const disabled$3 = "_disabled_1st63_156";
+const icons = "_icons_1st63_162";
+const clearAll = "_clearAll_1st63_169";
+const iconOpen = "_iconOpen_1st63_170";
+const small$4 = "_small_1st63_181";
+const triggerInputContainer = "_triggerInputContainer_1st63_189";
+const right$2 = "_right_1st63_198";
+const multiOptions = "_multiOptions_1st63_211";
+const multiOption = "_multiOption_1st63_211";
+const label$4 = "_label_1st63_239";
+const closeMultiOption = "_closeMultiOption_1st63_242";
+const focus = "_focus_1st63_253";
+const selectedSingleValue = "_selectedSingleValue_1st63_257";
+const placeHolder = "_placeHolder_1st63_258";
+const groupOrderFirst = "_groupOrderFirst_1st63_297";
+const groupOrderMiddle = "_groupOrderMiddle_1st63_298";
+const groupOrderLast = "_groupOrderLast_1st63_302";
+const detailedLabel = "_detailedLabel_1st63_307";
 const styles$l = {
   inputInTable: inputInTable$5,
   inputHover: inputHover$5,
@@ -30087,14 +30087,14 @@ ProgressBar$1.propTypes = {
   showProgressColors: propTypes$1.exports.bool,
   noLabel: propTypes$1.exports.bool
 };
-const wrapper$1 = "_wrapper_p8i3d_1";
-const inline$1 = "_inline_p8i3d_1";
-const radio = "_radio_p8i3d_5";
-const labelMargin = "_labelMargin_p8i3d_8";
-const small$3 = "_small_p8i3d_27";
-const noMargin$1 = "_noMargin_p8i3d_32";
-const disabled$2 = "_disabled_p8i3d_90";
-const isInTable = "_isInTable_p8i3d_106";
+const wrapper$1 = "_wrapper_1huel_1";
+const inline$1 = "_inline_1huel_1";
+const radio = "_radio_1huel_5";
+const labelMargin = "_labelMargin_1huel_8";
+const small$3 = "_small_1huel_27";
+const noMargin$1 = "_noMargin_1huel_32";
+const disabled$2 = "_disabled_1huel_90";
+const isInTable = "_isInTable_1huel_106";
 const styles$g = {
   wrapper: wrapper$1,
   inline: inline$1,
@@ -57019,24 +57019,24 @@ var reactFastCompare = function isEqual3(a2, b2) {
     throw error2;
   }
 };
-const inputInTable$3 = "_inputInTable_m7vt5_1";
-const inputHover$3 = "_inputHover_m7vt5_13";
-const inputFocus$3 = "_inputFocus_m7vt5_18";
-const inputError$3 = "_inputError_m7vt5_25";
-const inputWarning$3 = "_inputWarning_m7vt5_26";
-const inputDisabled$3 = "_inputDisabled_m7vt5_61";
-const hideScrollbars$3 = "_hideScrollbars_m7vt5_67";
-const sidebar = "_sidebar_m7vt5_80";
-const inner = "_inner_m7vt5_91";
-const title$2 = "_title_m7vt5_101";
-const subtitle = "_subtitle_m7vt5_102";
-const label$2 = "_label_m7vt5_103";
-const collapsed = "_collapsed_m7vt5_107";
-const list = "_list_m7vt5_132";
-const item$2 = "_item_m7vt5_136";
-const active$2 = "_active_m7vt5_162";
-const experimental = "_experimental_m7vt5_166";
-const icon$1 = "_icon_m7vt5_169";
+const inputInTable$3 = "_inputInTable_kett7_1";
+const inputHover$3 = "_inputHover_kett7_13";
+const inputFocus$3 = "_inputFocus_kett7_18";
+const inputError$3 = "_inputError_kett7_25";
+const inputWarning$3 = "_inputWarning_kett7_26";
+const inputDisabled$3 = "_inputDisabled_kett7_61";
+const hideScrollbars$3 = "_hideScrollbars_kett7_67";
+const sidebar = "_sidebar_kett7_80";
+const inner = "_inner_kett7_91";
+const title$2 = "_title_kett7_101";
+const subtitle = "_subtitle_kett7_102";
+const label$2 = "_label_kett7_103";
+const collapsed = "_collapsed_kett7_107";
+const list = "_list_kett7_132";
+const item$2 = "_item_kett7_136";
+const active$2 = "_active_kett7_162";
+const experimental = "_experimental_kett7_166";
+const icon$1 = "_icon_kett7_169";
 const styles$c = {
   inputInTable: inputInTable$3,
   inputHover: inputHover$3,
@@ -57156,7 +57156,7 @@ const SideBar = memo(
       open: isOpen2,
       top: top2,
       background: "var(--color-background-sidebar)",
-      closedWidth: "48px",
+      closedWidth: "var(--size-xl)",
       enableButton: visible,
       buttonPosition: "bottom",
       buttonAnimate: true,
@@ -59257,13 +59257,13 @@ const SliderTooltip = ({ text: text2 }) => {
   });
 };
 const rcSlider = "";
-const container = "_container_zvsy3_1";
-const small$2 = "_small_zvsy3_7";
-const hasMarks = "_hasMarks_zvsy3_10";
-const vertical = "_vertical_zvsy3_13";
-const hasArrows = "_hasArrows_zvsy3_17";
-const button$1 = "_button_zvsy3_21";
-const label$1 = "_label_zvsy3_24";
+const container = "_container_k6ypd_1";
+const small$2 = "_small_k6ypd_7";
+const hasMarks = "_hasMarks_k6ypd_10";
+const vertical = "_vertical_k6ypd_13";
+const hasArrows = "_hasArrows_k6ypd_17";
+const button$1 = "_button_k6ypd_21";
+const label$1 = "_label_k6ypd_24";
 const styles$b = {
   container,
   small: small$2,
@@ -59475,18 +59475,18 @@ Spacer.propTypes = {
   width: propTypes$1.exports.oneOfType([propTypes$1.exports.string, propTypes$1.exports.number]),
   flex: propTypes$1.exports.bool
 };
-const inputInTable$2 = "_inputInTable_28mh5_1";
-const inputHover$2 = "_inputHover_28mh5_13";
-const inputFocus$2 = "_inputFocus_28mh5_18";
-const inputError$2 = "_inputError_28mh5_25";
-const inputWarning$2 = "_inputWarning_28mh5_26";
-const inputDisabled$2 = "_inputDisabled_28mh5_61";
-const hideScrollbars$2 = "_hideScrollbars_28mh5_67";
-const wrapper = "_wrapper_28mh5_87";
-const bordered = "_bordered_28mh5_95";
-const scroll2 = "_scroll_28mh5_99";
-const table = "_table_28mh5_109";
-const striped = "_striped_28mh5_188";
+const inputInTable$2 = "_inputInTable_1ssxi_1";
+const inputHover$2 = "_inputHover_1ssxi_13";
+const inputFocus$2 = "_inputFocus_1ssxi_18";
+const inputError$2 = "_inputError_1ssxi_25";
+const inputWarning$2 = "_inputWarning_1ssxi_26";
+const inputDisabled$2 = "_inputDisabled_1ssxi_61";
+const hideScrollbars$2 = "_hideScrollbars_1ssxi_67";
+const wrapper = "_wrapper_1ssxi_87";
+const bordered = "_bordered_1ssxi_95";
+const scroll2 = "_scroll_1ssxi_99";
+const table = "_table_1ssxi_109";
+const striped = "_striped_1ssxi_188";
 const styles$a = {
   inputInTable: inputInTable$2,
   inputHover: inputHover$2,
@@ -59610,36 +59610,36 @@ Footer.propTypes = {
   pagination: paginationShape,
   content: propTypes$1.exports.object
 };
-const inputInTable$1 = "_inputInTable_1qou3_1";
-const inputHover$1 = "_inputHover_1qou3_13";
-const inputFocus$1 = "_inputFocus_1qou3_18";
-const inputError$1 = "_inputError_1qou3_25";
-const inputWarning$1 = "_inputWarning_1qou3_26";
-const inputDisabled$1 = "_inputDisabled_1qou3_61";
-const hideScrollbars$1 = "_hideScrollbars_1qou3_67";
-const cell = "_cell_1qou3_77";
-const disabledLink = "_disabledLink_1qou3_87";
-const inputWrapper = "_inputWrapper_1qou3_91";
-const breakWord = "_breakWord_1qou3_106";
-const inputCell = "_inputCell_1qou3_109";
-const sliderCell = "_sliderCell_1qou3_112";
-const staticCell = "_staticCell_1qou3_116";
-const staticCellContent = "_staticCellContent_1qou3_119";
-const error$1 = "_error_1qou3_132";
-const warning$2 = "_warning_1qou3_133";
-const unit = "_unit_1qou3_142";
-const sortingCell = "_sortingCell_1qou3_145";
-const sortingCellIcon = "_sortingCellIcon_1qou3_153";
-const icon = "_icon_1qou3_160";
-const checkBoxCell = "_checkBoxCell_1qou3_164";
-const iconCell = "_iconCell_1qou3_168";
-const iconWrapper = "_iconWrapper_1qou3_173";
-const actionsCell = "_actionsCell_1qou3_177";
-const rightAligned = "_rightAligned_1qou3_185";
-const centerAligned = "_centerAligned_1qou3_191";
-const leftAligned = "_leftAligned_1qou3_197";
-const popover = "_popover_1qou3_200";
-const disabledPointerEvents = "_disabledPointerEvents_1qou3_203";
+const inputInTable$1 = "_inputInTable_hyzeo_1";
+const inputHover$1 = "_inputHover_hyzeo_13";
+const inputFocus$1 = "_inputFocus_hyzeo_18";
+const inputError$1 = "_inputError_hyzeo_25";
+const inputWarning$1 = "_inputWarning_hyzeo_26";
+const inputDisabled$1 = "_inputDisabled_hyzeo_61";
+const hideScrollbars$1 = "_hideScrollbars_hyzeo_67";
+const cell = "_cell_hyzeo_77";
+const disabledLink = "_disabledLink_hyzeo_87";
+const inputWrapper = "_inputWrapper_hyzeo_91";
+const breakWord = "_breakWord_hyzeo_106";
+const inputCell = "_inputCell_hyzeo_109";
+const sliderCell = "_sliderCell_hyzeo_112";
+const staticCell = "_staticCell_hyzeo_116";
+const staticCellContent = "_staticCellContent_hyzeo_119";
+const error$1 = "_error_hyzeo_132";
+const warning$2 = "_warning_hyzeo_133";
+const unit = "_unit_hyzeo_142";
+const sortingCell = "_sortingCell_hyzeo_145";
+const sortingCellIcon = "_sortingCellIcon_hyzeo_156";
+const icon = "_icon_hyzeo_167";
+const checkBoxCell = "_checkBoxCell_hyzeo_171";
+const iconCell = "_iconCell_hyzeo_175";
+const iconWrapper = "_iconWrapper_hyzeo_180";
+const actionsCell = "_actionsCell_hyzeo_184";
+const rightAligned = "_rightAligned_hyzeo_192";
+const centerAligned = "_centerAligned_hyzeo_198";
+const leftAligned = "_leftAligned_hyzeo_204";
+const popover = "_popover_hyzeo_207";
+const disabledPointerEvents = "_disabledPointerEvents_hyzeo_210";
 const styles$7 = {
   inputInTable: inputInTable$1,
   inputHover: inputHover$1,
@@ -60925,16 +60925,16 @@ Table.propTypes = {
   }).isRequired,
   onListReorder: propTypes$1.exports.func
 };
-const tabs = "_tabs_n706w_1";
-const padding = "_padding_n706w_7";
-const margin = "_margin_n706w_11";
-const contentPadding = "_contentPadding_n706w_14";
-const item$1 = "_item_n706w_17";
-const active$1 = "_active_n706w_38";
-const hidden = "_hidden_n706w_57";
-const disabled$1 = "_disabled_n706w_60";
-const left$1 = "_left_n706w_64";
-const right$1 = "_right_n706w_64";
+const tabs = "_tabs_bpi2q_1";
+const padding = "_padding_bpi2q_7";
+const margin = "_margin_bpi2q_11";
+const contentPadding = "_contentPadding_bpi2q_14";
+const item$1 = "_item_bpi2q_17";
+const active$1 = "_active_bpi2q_38";
+const hidden = "_hidden_bpi2q_57";
+const disabled$1 = "_disabled_bpi2q_60";
+const left$1 = "_left_bpi2q_64";
+const right$1 = "_right_bpi2q_64";
 const styles$5 = {
   tabs,
   padding,
@@ -62448,22 +62448,22 @@ Toggle.propTypes = {
   helpText: propTypes$1.exports.string,
   onClickHelp: propTypes$1.exports.func
 };
-const topbar = "_topbar_jyzzy_7";
-const fixed = "_fixed_jyzzy_16";
-const appSwitcher = "_appSwitcher_jyzzy_24";
-const title = "_title_jyzzy_48";
-const logo = "_logo_jyzzy_64";
-const label = "_label_jyzzy_67";
-const brand = "_brand_jyzzy_72";
-const version = "_version_jyzzy_77";
-const left = "_left_jyzzy_84";
-const right = "_right_jyzzy_85";
-const item = "_item_jyzzy_99";
-const link = "_link_jyzzy_100";
-const button = "_button_jyzzy_112";
-const menu = "_menu_jyzzy_113";
-const active = "_active_jyzzy_141";
-const alert = "_alert_jyzzy_166";
+const topbar = "_topbar_hthqn_7";
+const fixed = "_fixed_hthqn_16";
+const appSwitcher = "_appSwitcher_hthqn_24";
+const title = "_title_hthqn_48";
+const logo = "_logo_hthqn_64";
+const label = "_label_hthqn_67";
+const brand = "_brand_hthqn_72";
+const version = "_version_hthqn_77";
+const left = "_left_hthqn_84";
+const right = "_right_hthqn_85";
+const item = "_item_hthqn_99";
+const link = "_link_hthqn_100";
+const button = "_button_hthqn_112";
+const menu = "_menu_hthqn_113";
+const active = "_active_hthqn_141";
+const alert = "_alert_hthqn_166";
 const styles$2 = {
   topbar,
   fixed,
@@ -62685,7 +62685,7 @@ TopBar.defaultProps = {
   content: [],
   contentRight: [],
   warning: "",
-  height: "48px",
+  height: "var(--size-topbar)",
   fixedPosition: true
 };
 TopBar.propTypes = {
@@ -62707,9 +62707,9 @@ TopBar.propTypes = {
   height: propTypes$1.exports.oneOfType([propTypes$1.exports.string, propTypes$1.exports.number]),
   fixedPosition: propTypes$1.exports.bool
 };
-const popConfirm = "_popConfirm_qq07h_1";
-const content = "_content_qq07h_7";
-const buttons = "_buttons_qq07h_12";
+const popConfirm = "_popConfirm_1l7dy_1";
+const content = "_content_1l7dy_7";
+const buttons = "_buttons_1l7dy_12";
 const styles$1 = {
   popConfirm,
   content,