@hexure/ui 1.13.58 → 1.13.59

package/dist/cjs/index.js

@@ -139,11 +139,11 @@ Copy.defaultProps = {
     type: 'default',
 };
 
-const Wrapper$h = styled.div `
-  display: inline-block;
-  position: relative;
-  height: 16px;
-`;
+const Wrapper$h = styled.div(props => ({
+    display: 'inline-block',
+    position: 'relative',
+    height: props.$height || '16px',
+}));
 const StyledIcon$6 = styled(Icon) `
   width: 16px;
   height: 16px;
@@ -182,10 +182,10 @@ const positions = {
 };
 const Content$3 = styled.div(props => (Object.assign({ position: 'absolute', borderRadius: '4px', borderWidth: '1px', borderStyle: 'solid', borderColor: props.theme.PRIMARY_COLOR.Hex, background: '#ffffff', boxShadow: '0px 5px 30px -10px rgba(0, 0, 0, 0.5)', width: props.$width || '240px', padding: '10px 12px', zIndex: 9999 }, positions[props.$position])));
 Content$3.defaultProps = { theme: EditableTheme };
-const Tooltip = ({ children, position = 'right-top', width = '240px', trigger, dataItemid, }) => {
+const Tooltip = ({ children, position = 'right-top', width = '240px', trigger, dataItemid, height, }) => {
     const [show_content, toggleContent] = React.useState(false);
     const baseId = dataItemid || 'tooltip';
-    return (React.createElement(Wrapper$h, { "data-itemid": `${baseId}-wrapper`, onMouseEnter: toggleContent.bind(null, true), onMouseLeave: toggleContent.bind(null, false) },
+    return (React.createElement(Wrapper$h, { "$height": height, "data-itemid": `${baseId}-wrapper`, onMouseEnter: toggleContent.bind(null, true), onMouseLeave: toggleContent.bind(null, false) },
         trigger || React.createElement(StyledIcon$6, { "data-itemid": `${baseId}-icon`, path: js.mdiInformationOutline }),
         show_content ? (React.createElement(Content$3, { "$position": position, "$width": width, "data-itemid": `${baseId}-content` }, children && (React.createElement(Copy, { "data-itemid": `${baseId}-copy`, type: 'small' }, children)))) : null));
 };
@@ -1049,7 +1049,7 @@ const Wrapper$a = styled.div `
   border-width: 1px;
   border-style: solid;
   border-color: ${props => (props.$invalid ? Colors.RED.Hex : '#cccccc')};
-  background-color: ${props => (props.$invalid && props.$isInvalidRedBackground ? '#ffe5e5' : '#ffffff')};
+  background-color: ${props => props.$invalid && props.$isInvalidRedBackground ? '#ffe5e5' : '#ffffff'};
   border-radius: ${({ $style }) => ($style === null || $style === void 0 ? void 0 : $style.borderRadius) || '4px'};
   flex-grow: ${({ $style }) => ($style === null || $style === void 0 ? void 0 : $style.flexGrow) || 0};
   box-sizing: border-box;
@@ -1293,9 +1293,14 @@ const ButtonBar$1 = styled.div `
   gap: 10px;
   flex-shrink: 0;
   background: #fff;
+  flex-direction: column;
+`;
+const ButtonBarNote = styled.div `
+  display: flex;
+  gap: 10px;
 `;
 const Drawer = (_a) => {
-    var { children, description, title, onClose, primaryButton, position = 'fixed', secondaryButton, tertiaryButton, scrim = 'dark', width, dataItemid } = _a, accessibleProps = __rest(_a, ["children", "description", "title", "onClose", "primaryButton", "position", "secondaryButton", "tertiaryButton", "scrim", "width", "dataItemid"]);
+    var { children, description, title, onClose, primaryButton, position = 'fixed', secondaryButton, tertiaryButton, scrim = 'dark', width, dataItemid, bottomNotes } = _a, accessibleProps = __rest(_a, ["children", "description", "title", "onClose", "primaryButton", "position", "secondaryButton", "tertiaryButton", "scrim", "width", "dataItemid", "bottomNotes"]);
     React.useEffect(() => {
         document.onkeydown = e => {
             if (e.key === 'Escape') {
@@ -1317,9 +1322,11 @@ const Drawer = (_a) => {
                     React.createElement(Button, { dataItemid: `${baseId}-close-button`, format: 'secondary', icon: js.mdiClose, small: true }))),
             React.createElement(ContentWrapper$1, { "data-itemid": `${baseId}-content-wrapper` }, children),
             primaryButton || secondaryButton || tertiaryButton ? (React.createElement(ButtonBar$1, { "data-itemid": `${baseId}-button-bar` },
-                tertiaryButton ? (React.createElement(Button, Object.assign({}, tertiaryButton, { "data-itemid": `${baseId}-tertiary-button`, format: tertiaryButton.format || 'secondary' }))) : null,
-                secondaryButton ? (React.createElement(Button, Object.assign({}, secondaryButton, { "data-itemid": `${baseId}-secondary-button`, format: secondaryButton.format || 'secondary' }))) : null,
-                primaryButton ? (React.createElement(Button, Object.assign({}, primaryButton, { "data-itemid": `${baseId}-primary-button`, format: primaryButton.format || 'primary' }))) : null)) : null),
+                React.createElement(Copy, { "data-itemid": `${baseId}-button-bar-notes`, type: 'small' }, bottomNotes),
+                React.createElement(ButtonBarNote, null,
+                    tertiaryButton ? (React.createElement(Button, Object.assign({}, tertiaryButton, { "data-itemid": `${baseId}-tertiary-button`, format: tertiaryButton.format || 'secondary' }))) : null,
+                    secondaryButton ? (React.createElement(Button, Object.assign({}, secondaryButton, { "data-itemid": `${baseId}-secondary-button`, format: secondaryButton.format || 'secondary' }))) : null,
+                    primaryButton ? (React.createElement(Button, Object.assign({}, primaryButton, { "data-itemid": `${baseId}-primary-button`, format: primaryButton.format || 'primary' }))) : null))) : null),
         scrim ? (React.createElement(Scrim$1, { "$position": position, "$scrim": scrim, "data-itemid": `${baseId}-scrim`, onClick: onClose })) : null));
 };