@linzjs/lui 23.3.0 → 23.5.0

package/dist/lui.esm.js

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