@hexure/ui 1.14.6 → 1.14.8

package/dist/cjs/index.js

@@ -3463,7 +3463,7 @@ const MoreMenu = (_a) => {
     const baseId = dataItemid || 'more-menu';
     return (React.createElement(Wrapper$d, Object.assign({ "$maxHeight": maxHeight }, accessibleProps, { "data-itemid": `${baseId}-wrapper` }), menuItems.map((item, i) => {
         var _a;
-        const itemId = `${baseId}`;
+        const itemId = item.dataItemid || baseId;
         return (React.createElement(MenuItem, { className: item === null || item === void 0 ? void 0 : item.className, "data-itemid": `${itemId}-menu-item`, key: i, onClick: item.onClick },
             item.icon ? (React.createElement(Icon, { color: item.disabled ? Colors.LIGHT_GRAY.Hex : Colors.MEDIUM_GRAY.Hex, "data-itemid": `${itemId}-icon`, path: item.icon, size: '20px' })) : null,
             React.createElement(Title$1, { "data-itemid": `${itemId}-title`, disabled: (_a = item.disabled) !== null && _a !== void 0 ? _a : false }, item.label)));
@@ -3833,6 +3833,7 @@ const DropdownContainer = styled.div `
   box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
   max-height: 300px;
   overflow-y: auto;
+  overflow-x: hidden;
   z-index: 1000;
   display: ${props => (props.$isOpen ? 'block' : 'none')};
 `;
@@ -3855,6 +3856,8 @@ const OptionItem = styled.span `
   background-color: ${props => (props.$isSelected ? '#e8f4fd' : 'transparent')};
   user-select: none;
   line-height: 1.3em;
+  overflow-x: hidden;
+  margin-right: 5px;
 
   &:hover {
     background-color: ${props => (props.$disabled ? 'transparent' : '#f5f5f5')};
@@ -4225,6 +4228,9 @@ const ButtonBarNote = styled.div `
   display: flex;
   gap: 10px;
 `;
+const HeaderWrapper = styled.div `
+  word-break: break-all;
+`;
 const Drawer = (_a) => {
     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(() => {
@@ -4241,7 +4247,7 @@ const Drawer = (_a) => {
     return (React.createElement(React.Fragment, null,
         React.createElement(Container$3, Object.assign({}, accessibleProps, { "$position": position, "$width": width, "data-itemid": `${baseId}-container` }),
             React.createElement(Header$2, { "data-itemid": `${baseId}-header` },
-                React.createElement("div", { "data-itemid": `${baseId}-header-content` },
+                React.createElement(HeaderWrapper, { "data-itemid": `${baseId}-header-content` },
                     title ? (React.createElement(Heading, { dataItemid: `${baseId}-title`, type: 'secondary' }, title)) : null,
                     description ? (React.createElement(Copy, { color: 'GRAY', "data-itemid": `${baseId}-description` }, description)) : null),
                 React.createElement(Close$1, { "data-itemid": `${baseId}-close`, onClick: onClose },