@elliemae/ds-form 2.3.2 → 2.4.0-rc.1

package/cjs/Input/DSInput.js

@@ -59,7 +59,7 @@ const DSInput = _ref => {
     "aria-label": otherProps['aria-label'],
     "aria-describedby": otherProps['aria-describedby'],
     autoFocus: autoFocus,
-    className: "".concat(className, " ").concat(disabled ? 'input-disabled' : ''),
+    className: "".concat(className, " ").concat(disabled ? 'input-disabled' : '').concat(readOnly ? 'read-only' : ''),
     clearable: clearable,
     containerProps: containerProps,
     customInputType: customInputType,

package/cjs/Input/InputImpl.js

@@ -275,7 +275,7 @@ class InputImpl extends React.Component {
       },
       className,
       autoFocus,
-      disabled: disabled || readOnly,
+      disabled,
       maxLength,
       minLength,
       name,
@@ -296,7 +296,8 @@ class InputImpl extends React.Component {
       min,
       max,
       style,
-      tabIndex
+      tabIndex,
+      readOnly
     }, containerProps);
 
     let InputComponent = /*#__PURE__*/jsxRuntime.jsx(WrapperForTooltipInput, {

package/cjs/InputProtected/DSInputProtected.js

@@ -64,22 +64,21 @@ const DSInputProtected = _ref => {
   }, [leftAddon, rightAddon]);
   const handleLeft = React.useCallback(() => {
     setLocked(!inputLocked);
-  }, [leftAddon, inputLocked]);
+  }, [inputLocked]);
   const handleRight = React.useCallback(() => {
     setHidden(!inputHidden);
-  }, [rightAddon, inputHidden]);
+  }, [inputHidden]);
   return /*#__PURE__*/_jsx__default["default"]("div", {}, void 0, /*#__PURE__*/_jsx__default["default"](DSInputGroup["default"], {
     leftAddon: left ? /*#__PURE__*/_jsx__default["default"](DSButton__default["default"], {
       "aria-label": "".concat(inputLocked ? 'Allow' : 'Disallow', " Edition"),
       buttonType: "secondary",
-      icon: ADDON_ICON_OPTIONS[inputLocked ? options.LEFT_ADDON_OPTIONS.LockUnlocked : options.LEFT_ADDON_OPTIONS.LockLocked],
+      icon: ADDON_ICON_OPTIONS[inputLocked ? options.LEFT_ADDON_OPTIONS.LockLocked : options.LEFT_ADDON_OPTIONS.LockUnlocked],
       onClick: handleLeft
     }) : undefined,
-    readOnly: left ? inputLocked : readOnly,
     rightAddon: right ? /*#__PURE__*/_jsx__default["default"](DSButton__default["default"], {
       "aria-label": "".concat(inputHidden ? 'Show' : 'Hide', " Characters"),
       buttonType: "secondary",
-      icon: ADDON_ICON_OPTIONS[inputHidden ? options.RIGHT_ADDON_OPTIONS.VisibleView : options.RIGHT_ADDON_OPTIONS.InvisibleHide],
+      icon: ADDON_ICON_OPTIONS[inputHidden ? options.RIGHT_ADDON_OPTIONS.InvisibleHide : options.RIGHT_ADDON_OPTIONS.VisibleView],
       onClick: handleRight,
       containerProps: {
         'data-testid': 'inputprotected-show-hide-button'
@@ -89,7 +88,7 @@ const DSInputProtected = _ref => {
     mask: mask,
     placeholderChar: placeholderChar,
     onChange: onChange,
-    readOnly: left ? inputLocked : readOnly,
+    disabled: left ? inputLocked : readOnly,
     type: right && inputHidden ? 'password' : type,
     value: value
   }))));

package/cjs/MenuItem/components/MultiMenuItem/MultiMenuItem.js

@@ -5,16 +5,19 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var _jsx = require('@babel/runtime/helpers/jsx');
 require('react');
 var reactDesc = require('react-desc');
+var Grid = require('@elliemae/ds-grid');
 var dsControlledForm = require('@elliemae/ds-controlled-form');
 var props = require('../../props.js');
-var styled$1 = require('./styled.js');
 var styled = require('../styled.js');
+var styled$1 = require('./styled.js');
 var jsxRuntime = require('react/jsx-runtime');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
 
+function noop() {}
+
 const MultiMenuItem = props => {
   const {
     dsId,
@@ -39,7 +42,6 @@ const MultiMenuItem = props => {
     isActive: isActive,
     isSelected: isSelected,
     isFocus: isFocus,
-    onClick: onClick,
     ref: innerRef,
     onMouseDown: onMouseDown,
     onMouseEnter: onMouseEnter,
@@ -49,17 +51,26 @@ const MultiMenuItem = props => {
     "aria-selected": isSelected,
     style: wrapperStyles,
     pr: render ? 0 : 40,
+    onClick: onClick,
+    onKeyDown: onClick,
     "data-testid": "combobox-option",
-    children: /*#__PURE__*/_jsx__default["default"](styled$1.StyledItemContent, {}, void 0, render ? render(props) : /*#__PURE__*/_jsx__default["default"](dsControlledForm.DSControlledCheckbox, {
-      disabled: disabled,
-      checked: isSelected,
-      onMouseDown: onMouseDown,
-      name: value,
-      ariaLabel: label,
-      label: label,
-      id: value,
-      onChange: onClick
-    }))
+    children: /*#__PURE__*/jsxRuntime.jsx(jsxRuntime.Fragment, {
+      children: render ? render(props) : /*#__PURE__*/_jsx__default["default"](Grid.Grid, {
+        cols: ['16px', 'auto'],
+        minHeight: "16px",
+        gutter: "xxs",
+        alignItems: "center"
+      }, void 0, /*#__PURE__*/_jsx__default["default"](dsControlledForm.DSControlledCheckbox, {
+        disabled: disabled,
+        checked: isSelected,
+        onMouseDown: onMouseDown,
+        name: value,
+        "aria-label": label,
+        id: value,
+        onChange: noop,
+        tabIndex: tabIndex
+      }), /*#__PURE__*/_jsx__default["default"](styled$1.StyledMultiMenuItemLabel, {}, void 0, /*#__PURE__*/_jsx__default["default"](styled.StyleMenuItemLabel, {}, void 0, label)))
+    })
   });
 };
 
@@ -69,3 +80,4 @@ MultiMenuItemWithSchema.propTypes = props.itemProps;
 
 exports.MultiMenuItem = MultiMenuItem;
 exports.MultiMenuItemWithSchema = MultiMenuItemWithSchema;
+exports.noop = noop;

package/cjs/MenuItem/components/MultiMenuItem/styled.js

@@ -8,8 +8,8 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 
 var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
 
-const StyledItemContent = /*#__PURE__*/styled__default["default"].div.withConfig({
+const StyledMultiMenuItemLabel = /*#__PURE__*/styled__default["default"].label.withConfig({
   componentId: "sc-1stlix4-0"
-})(["display:flex;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;width:100%;"]);
+})(["padding-left:8px;color:rgb(37,41,47);font-size:13px;line-height:13px;display:inherit;"]);
 
-exports.StyledItemContent = StyledItemContent;
+exports.StyledMultiMenuItemLabel = StyledMultiMenuItemLabel;

package/cjs/MenuItem/components/SingleMenuItem/SingleMenuItem.js

@@ -5,7 +5,6 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var _jsx = require('@babel/runtime/helpers/jsx');
 require('react');
 var reactDesc = require('react-desc');
-var DSTruncatedTooltipText = require('@elliemae/ds-truncated-tooltip-text');
 var dsIcons = require('@elliemae/ds-icons');
 var Grid = require('@elliemae/ds-grid');
 var props = require('../../props.js');
@@ -53,15 +52,13 @@ const SingleMenuItem = props => {
     disabled: disabled,
     children: render ? render(props) : /*#__PURE__*/_jsx__default["default"](Grid__default["default"], {
       cols: ['16px', 'auto'],
-      height: "16px",
+      minHeight: "16px",
       gutter: "xxs",
       alignItems: "center"
     }, void 0, /*#__PURE__*/_jsx__default["default"]("div", {}, void 0, isSelected && /*#__PURE__*/_jsx__default["default"](dsIcons.Checkmark, {
       size: "s",
       color: ['brand-primary', '600']
-    })), /*#__PURE__*/_jsx__default["default"](DSTruncatedTooltipText.SimpleTruncatedTooltipText, {
-      value: label
-    }))
+    })), /*#__PURE__*/_jsx__default["default"](styled.StyleMenuItemLabel, {}, void 0, label))
   });
 };
 

package/cjs/MenuItem/components/index.js

@@ -14,6 +14,7 @@ var index$3 = require('./Separator/index.js');
 exports.SingleMenuItem = SingleMenuItem.SingleMenuItem;
 exports.MultiMenuItem = MultiMenuItem.MultiMenuItem;
 exports.MultiMenuItemWithSchema = MultiMenuItem.MultiMenuItemWithSchema;
+exports.noop = MultiMenuItem.noop;
 exports.MenuItem = index.MenuItem;
 exports.MenuItemWithSchema = index.MenuItemWithSchema;
 exports.SubmenuItem = index$1.SubmenuItem;

package/cjs/MenuItem/components/styled.js

@@ -37,7 +37,7 @@ const focusBorderCss = _ref3 => {
 
 const StyledGlobalMenuItemWrapper = /*#__PURE__*/styled__default["default"].li.withConfig({
   componentId: "sc-jyoobd-0"
-})(["cursor:pointer;height:32px;padding-left:16px;padding-right:16px;display:grid;align-items:center;list-style:none;position:relative;", " ", " ", " ", " ", ";background-color:", ";&:hover{background-color:", ";}"], styledComponents.position, styledComponents.layout, styledComponents.sizing, styledComponents.space, props => {
+})(["cursor:pointer;min-height:32px;padding-left:16px;padding-right:16px;display:grid;align-items:center;list-style:none;position:relative;", " ", " ", " ", " ", ";background-color:", ";&:hover{background-color:", ";}"], styledComponents.position, styledComponents.layout, styledComponents.sizing, styledComponents.space, props => {
   if (props.disabled) return disabledOption();
   if (props.isFocus) return focusBorderCss(props);
   if (props.isActive) return activeBorderCss(props);
@@ -49,7 +49,11 @@ const StyledMenuItemWrapper = /*#__PURE__*/styled__default["default"](StyledGlob
 const StyledSubmenuItemWrapper = /*#__PURE__*/styled__default["default"](StyledGlobalMenuItemWrapper).withConfig({
   componentId: "sc-jyoobd-2"
 })(["", ";padding-right:0;"], props => props.isSelected || props.isActive ? activeBorderCss(props) : '');
+const StyleMenuItemLabel = /*#__PURE__*/styled__default["default"].span.withConfig({
+  componentId: "sc-jyoobd-3"
+})(["padding:8px 0;"]);
 
+exports.StyleMenuItemLabel = StyleMenuItemLabel;
 exports.StyledGlobalMenuItemWrapper = StyledGlobalMenuItemWrapper;
 exports.StyledMenuItemWrapper = StyledMenuItemWrapper;
 exports.StyledSubmenuItemWrapper = StyledSubmenuItemWrapper;

package/cjs/MenuItem/index.js

@@ -14,6 +14,7 @@ var index$3 = require('./components/Separator/index.js');
 exports.SingleMenuItem = SingleMenuItem.SingleMenuItem;
 exports.MultiMenuItem = MultiMenuItem.MultiMenuItem;
 exports.MultiMenuItemWithSchema = MultiMenuItem.MultiMenuItemWithSchema;
+exports.noop = MultiMenuItem.noop;
 exports.MenuItem = index.MenuItem;
 exports.MenuItemWithSchema = index.MenuItemWithSchema;
 exports.SubmenuItem = index$1.SubmenuItem;

package/cjs/index.js

@@ -79,6 +79,7 @@ exports.DSLargeInputTextWithSchema = DSLargeInputText.DSLargeInputTextWithSchema
 exports.SingleMenuItem = SingleMenuItem.SingleMenuItem;
 exports.MultiMenuItem = MultiMenuItem.MultiMenuItem;
 exports.MultiMenuItemWithSchema = MultiMenuItem.MultiMenuItemWithSchema;
+exports.noop = MultiMenuItem.noop;
 exports.MenuItem = index.MenuItem;
 exports.MenuItemWithSchema = index.MenuItemWithSchema;
 exports.SubmenuItem = index$1.SubmenuItem;

package/esm/Input/DSInput.js

@@ -50,7 +50,7 @@ const DSInput = _ref => {
     "aria-label": otherProps['aria-label'],
     "aria-describedby": otherProps['aria-describedby'],
     autoFocus: autoFocus,
-    className: "".concat(className, " ").concat(disabled ? 'input-disabled' : ''),
+    className: "".concat(className, " ").concat(disabled ? 'input-disabled' : '').concat(readOnly ? 'read-only' : ''),
     clearable: clearable,
     containerProps: containerProps,
     customInputType: customInputType,

package/esm/Input/InputImpl.js

@@ -263,7 +263,7 @@ class InputImpl extends Component {
       },
       className,
       autoFocus,
-      disabled: disabled || readOnly,
+      disabled,
       maxLength,
       minLength,
       name,
@@ -284,7 +284,8 @@ class InputImpl extends Component {
       min,
       max,
       style,
-      tabIndex
+      tabIndex,
+      readOnly
     }, containerProps);
 
     let InputComponent = /*#__PURE__*/jsx(WrapperForTooltipInput, {

package/esm/InputProtected/DSInputProtected.js

@@ -53,22 +53,21 @@ const DSInputProtected = _ref => {
   }, [leftAddon, rightAddon]);
   const handleLeft = useCallback(() => {
     setLocked(!inputLocked);
-  }, [leftAddon, inputLocked]);
+  }, [inputLocked]);
   const handleRight = useCallback(() => {
     setHidden(!inputHidden);
-  }, [rightAddon, inputHidden]);
+  }, [inputHidden]);
   return /*#__PURE__*/_jsx("div", {}, void 0, /*#__PURE__*/_jsx(DSInputGroup, {
     leftAddon: left ? /*#__PURE__*/_jsx(DSButton, {
       "aria-label": "".concat(inputLocked ? 'Allow' : 'Disallow', " Edition"),
       buttonType: "secondary",
-      icon: ADDON_ICON_OPTIONS[inputLocked ? LEFT_ADDON_OPTIONS.LockUnlocked : LEFT_ADDON_OPTIONS.LockLocked],
+      icon: ADDON_ICON_OPTIONS[inputLocked ? LEFT_ADDON_OPTIONS.LockLocked : LEFT_ADDON_OPTIONS.LockUnlocked],
       onClick: handleLeft
     }) : undefined,
-    readOnly: left ? inputLocked : readOnly,
     rightAddon: right ? /*#__PURE__*/_jsx(DSButton, {
       "aria-label": "".concat(inputHidden ? 'Show' : 'Hide', " Characters"),
       buttonType: "secondary",
-      icon: ADDON_ICON_OPTIONS[inputHidden ? RIGHT_ADDON_OPTIONS.VisibleView : RIGHT_ADDON_OPTIONS.InvisibleHide],
+      icon: ADDON_ICON_OPTIONS[inputHidden ? RIGHT_ADDON_OPTIONS.InvisibleHide : RIGHT_ADDON_OPTIONS.VisibleView],
       onClick: handleRight,
       containerProps: {
         'data-testid': 'inputprotected-show-hide-button'
@@ -78,7 +77,7 @@ const DSInputProtected = _ref => {
     mask: mask,
     placeholderChar: placeholderChar,
     onChange: onChange,
-    readOnly: left ? inputLocked : readOnly,
+    disabled: left ? inputLocked : readOnly,
     type: right && inputHidden ? 'password' : type,
     value: value
   }))));

package/esm/MenuItem/components/MultiMenuItem/MultiMenuItem.js

@@ -1,11 +1,14 @@
 import _jsx from '@babel/runtime/helpers/esm/jsx';
 import 'react';
 import { describe } from 'react-desc';
+import { Grid } from '@elliemae/ds-grid';
 import { DSControlledCheckbox } from '@elliemae/ds-controlled-form';
 import { itemProps, defaultProps } from '../../props.js';
-import { StyledItemContent } from './styled.js';
-import { StyledGlobalMenuItemWrapper } from '../styled.js';
-import { jsx } from 'react/jsx-runtime';
+import { StyledGlobalMenuItemWrapper, StyleMenuItemLabel } from '../styled.js';
+import { StyledMultiMenuItemLabel } from './styled.js';
+import { jsx, Fragment } from 'react/jsx-runtime';
+
+function noop() {}
 
 const MultiMenuItem = props => {
   const {
@@ -31,7 +34,6 @@ const MultiMenuItem = props => {
     isActive: isActive,
     isSelected: isSelected,
     isFocus: isFocus,
-    onClick: onClick,
     ref: innerRef,
     onMouseDown: onMouseDown,
     onMouseEnter: onMouseEnter,
@@ -41,17 +43,26 @@ const MultiMenuItem = props => {
     "aria-selected": isSelected,
     style: wrapperStyles,
     pr: render ? 0 : 40,
+    onClick: onClick,
+    onKeyDown: onClick,
     "data-testid": "combobox-option",
-    children: /*#__PURE__*/_jsx(StyledItemContent, {}, void 0, render ? render(props) : /*#__PURE__*/_jsx(DSControlledCheckbox, {
-      disabled: disabled,
-      checked: isSelected,
-      onMouseDown: onMouseDown,
-      name: value,
-      ariaLabel: label,
-      label: label,
-      id: value,
-      onChange: onClick
-    }))
+    children: /*#__PURE__*/jsx(Fragment, {
+      children: render ? render(props) : /*#__PURE__*/_jsx(Grid, {
+        cols: ['16px', 'auto'],
+        minHeight: "16px",
+        gutter: "xxs",
+        alignItems: "center"
+      }, void 0, /*#__PURE__*/_jsx(DSControlledCheckbox, {
+        disabled: disabled,
+        checked: isSelected,
+        onMouseDown: onMouseDown,
+        name: value,
+        "aria-label": label,
+        id: value,
+        onChange: noop,
+        tabIndex: tabIndex
+      }), /*#__PURE__*/_jsx(StyledMultiMenuItemLabel, {}, void 0, /*#__PURE__*/_jsx(StyleMenuItemLabel, {}, void 0, label)))
+    })
   });
 };
 
@@ -59,4 +70,4 @@ MultiMenuItem.defaultProps = defaultProps;
 const MultiMenuItemWithSchema = describe(MultiMenuItem);
 MultiMenuItemWithSchema.propTypes = itemProps;
 
-export { MultiMenuItem, MultiMenuItemWithSchema };
+export { MultiMenuItem, MultiMenuItemWithSchema, noop };

package/esm/MenuItem/components/MultiMenuItem/styled.js

@@ -1,7 +1,7 @@
 import styled from 'styled-components';
 
-const StyledItemContent = /*#__PURE__*/styled.div.withConfig({
+const StyledMultiMenuItemLabel = /*#__PURE__*/styled.label.withConfig({
   componentId: "sc-1stlix4-0"
-})(["display:flex;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;width:100%;"]);
+})(["padding-left:8px;color:rgb(37,41,47);font-size:13px;line-height:13px;display:inherit;"]);
 
-export { StyledItemContent };
+export { StyledMultiMenuItemLabel };

package/esm/MenuItem/components/SingleMenuItem/SingleMenuItem.js

@@ -1,11 +1,10 @@
 import _jsx from '@babel/runtime/helpers/esm/jsx';
 import 'react';
 import { describe } from 'react-desc';
-import { SimpleTruncatedTooltipText } from '@elliemae/ds-truncated-tooltip-text';
 import { Checkmark } from '@elliemae/ds-icons';
 import Grid from '@elliemae/ds-grid';
 import { itemProps, defaultProps } from '../../props.js';
-import { StyledGlobalMenuItemWrapper } from '../styled.js';
+import { StyledGlobalMenuItemWrapper, StyleMenuItemLabel } from '../styled.js';
 import { jsx } from 'react/jsx-runtime';
 
 const SingleMenuItem = props => {
@@ -44,15 +43,13 @@ const SingleMenuItem = props => {
     disabled: disabled,
     children: render ? render(props) : /*#__PURE__*/_jsx(Grid, {
       cols: ['16px', 'auto'],
-      height: "16px",
+      minHeight: "16px",
       gutter: "xxs",
       alignItems: "center"
     }, void 0, /*#__PURE__*/_jsx("div", {}, void 0, isSelected && /*#__PURE__*/_jsx(Checkmark, {
       size: "s",
       color: ['brand-primary', '600']
-    })), /*#__PURE__*/_jsx(SimpleTruncatedTooltipText, {
-      value: label
-    }))
+    })), /*#__PURE__*/_jsx(StyleMenuItemLabel, {}, void 0, label))
   });
 };
 

package/esm/MenuItem/components/index.js

@@ -1,5 +1,5 @@
 export { SingleMenuItem } from './SingleMenuItem/SingleMenuItem.js';
-export { MultiMenuItem, MultiMenuItemWithSchema } from './MultiMenuItem/MultiMenuItem.js';
+export { MultiMenuItem, MultiMenuItemWithSchema, noop } from './MultiMenuItem/MultiMenuItem.js';
 export { MenuItem, MenuItemWithSchema } from './MenuItem/index.js';
 export { SubmenuItem, SubmenuItemWithSchema } from './SubmenuItem/index.js';
 export { Section } from './Section/index.js';

package/esm/MenuItem/components/styled.js

@@ -29,7 +29,7 @@ const focusBorderCss = _ref3 => {
 
 const StyledGlobalMenuItemWrapper = /*#__PURE__*/styled.li.withConfig({
   componentId: "sc-jyoobd-0"
-})(["cursor:pointer;height:32px;padding-left:16px;padding-right:16px;display:grid;align-items:center;list-style:none;position:relative;", " ", " ", " ", " ", ";background-color:", ";&:hover{background-color:", ";}"], position, layout, sizing, space, props => {
+})(["cursor:pointer;min-height:32px;padding-left:16px;padding-right:16px;display:grid;align-items:center;list-style:none;position:relative;", " ", " ", " ", " ", ";background-color:", ";&:hover{background-color:", ";}"], position, layout, sizing, space, props => {
   if (props.disabled) return disabledOption();
   if (props.isFocus) return focusBorderCss(props);
   if (props.isActive) return activeBorderCss(props);
@@ -41,5 +41,8 @@ const StyledMenuItemWrapper = /*#__PURE__*/styled(StyledGlobalMenuItemWrapper).w
 const StyledSubmenuItemWrapper = /*#__PURE__*/styled(StyledGlobalMenuItemWrapper).withConfig({
   componentId: "sc-jyoobd-2"
 })(["", ";padding-right:0;"], props => props.isSelected || props.isActive ? activeBorderCss(props) : '');
+const StyleMenuItemLabel = /*#__PURE__*/styled.span.withConfig({
+  componentId: "sc-jyoobd-3"
+})(["padding:8px 0;"]);
 
-export { StyledGlobalMenuItemWrapper, StyledMenuItemWrapper, StyledSubmenuItemWrapper };
+export { StyleMenuItemLabel, StyledGlobalMenuItemWrapper, StyledMenuItemWrapper, StyledSubmenuItemWrapper };

package/esm/MenuItem/index.js

@@ -1,5 +1,5 @@
 export { SingleMenuItem } from './components/SingleMenuItem/SingleMenuItem.js';
-export { MultiMenuItem, MultiMenuItemWithSchema } from './components/MultiMenuItem/MultiMenuItem.js';
+export { MultiMenuItem, MultiMenuItemWithSchema, noop } from './components/MultiMenuItem/MultiMenuItem.js';
 export { MenuItem, MenuItemWithSchema } from './components/MenuItem/index.js';
 export { SubmenuItem, SubmenuItemWithSchema } from './components/SubmenuItem/index.js';
 export { Section } from './components/Section/index.js';

package/esm/index.js

@@ -17,7 +17,7 @@ export { DSInputProtected, DSInputProtectedWithSchema } from './InputProtected/D
 export { LEFT_ADDON_OPTIONS, RIGHT_ADDON_OPTIONS } from './InputProtected/options.js';
 export { default as DSLargeInputText, DSLargeInputTextWithSchema } from './LargeInputText/DSLargeInputText.js';
 export { SingleMenuItem } from './MenuItem/components/SingleMenuItem/SingleMenuItem.js';
-export { MultiMenuItem, MultiMenuItemWithSchema } from './MenuItem/components/MultiMenuItem/MultiMenuItem.js';
+export { MultiMenuItem, MultiMenuItemWithSchema, noop } from './MenuItem/components/MultiMenuItem/MultiMenuItem.js';
 export { MenuItem, MenuItemWithSchema } from './MenuItem/components/MenuItem/index.js';
 export { SubmenuItem, SubmenuItemWithSchema } from './MenuItem/components/SubmenuItem/index.js';
 export { Section } from './MenuItem/components/Section/index.js';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elliemae/ds-form",
-  "version": "2.3.2",
+  "version": "2.4.0-rc.1",
   "license": "MIT",
   "description": "ICE MT - Dimsum - Form",
   "module": "./esm/index.js",
@@ -748,25 +748,25 @@
     "build": "node ../../scripts/build/build.js"
   },
   "dependencies": {
-    "@elliemae/ds-button": "2.3.2",
-    "@elliemae/ds-circular-progress-indicator": "2.3.2",
-    "@elliemae/ds-classnames": "2.3.2",
-    "@elliemae/ds-controlled-form": "2.3.2",
-    "@elliemae/ds-dropdownmenu": "2.3.2",
-    "@elliemae/ds-grid": "2.3.2",
-    "@elliemae/ds-icon": "2.3.2",
-    "@elliemae/ds-icons": "2.3.2",
-    "@elliemae/ds-menu": "2.3.2",
-    "@elliemae/ds-overlay": "2.3.2",
-    "@elliemae/ds-popper": "2.3.2",
-    "@elliemae/ds-props-helpers": "2.3.2",
-    "@elliemae/ds-separator": "2.3.2",
-    "@elliemae/ds-shared": "2.3.2",
-    "@elliemae/ds-system": "2.3.2",
-    "@elliemae/ds-text-wrapper": "2.3.2",
-    "@elliemae/ds-tooltip": "2.3.2",
-    "@elliemae/ds-truncated-tooltip-text": "2.3.2",
-    "@elliemae/ds-utilities": "2.3.2",
+    "@elliemae/ds-button": "2.4.0-rc.1",
+    "@elliemae/ds-circular-progress-indicator": "2.4.0-rc.1",
+    "@elliemae/ds-classnames": "2.4.0-rc.1",
+    "@elliemae/ds-controlled-form": "2.4.0-rc.1",
+    "@elliemae/ds-dropdownmenu": "2.4.0-rc.1",
+    "@elliemae/ds-grid": "2.4.0-rc.1",
+    "@elliemae/ds-icon": "2.4.0-rc.1",
+    "@elliemae/ds-icons": "2.4.0-rc.1",
+    "@elliemae/ds-menu": "2.4.0-rc.1",
+    "@elliemae/ds-overlay": "2.4.0-rc.1",
+    "@elliemae/ds-popper": "2.4.0-rc.1",
+    "@elliemae/ds-props-helpers": "2.4.0-rc.1",
+    "@elliemae/ds-separator": "2.4.0-rc.1",
+    "@elliemae/ds-shared": "2.4.0-rc.1",
+    "@elliemae/ds-system": "2.4.0-rc.1",
+    "@elliemae/ds-text-wrapper": "2.4.0-rc.1",
+    "@elliemae/ds-tooltip": "2.4.0-rc.1",
+    "@elliemae/ds-truncated-tooltip-text": "2.4.0-rc.1",
+    "@elliemae/ds-utilities": "2.4.0-rc.1",
     "@elliemae/react-popper": "1.0.2",
     "@xstyled/styled-components": "~3.1.1",
     "csstype": "~3.0.9",

package/types/DateInputV2/components/styled.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-export declare const DateInputFluidContainer: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid/types/types").GridPropsT & import("react").RefAttributes<HTMLDivElement>>, import("styled-components").DefaultTheme, {}, never>;
-export declare const DateInputWrapper: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid/types/types").GridPropsT & import("react").RefAttributes<HTMLDivElement>>, import("styled-components").DefaultTheme, {}, never>;
+export declare const DateInputFluidContainer: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid/types/react-desc-prop-types").DSGridT.Props & import("react").RefAttributes<HTMLDivElement>>, import("styled-components").DefaultTheme, {}, never>;
+export declare const DateInputWrapper: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid/types/react-desc-prop-types").DSGridT.Props & import("react").RefAttributes<HTMLDivElement>>, import("styled-components").DefaultTheme, {}, never>;
 export declare const DateInputInput: import("styled-components").StyledComponent<"input", import("styled-components").DefaultTheme, {}, never>;
 export declare const DateInputDivider: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;

package/types/MenuItem/components/MultiMenuItem/MultiMenuItem.d.ts

@@ -1,6 +1,7 @@
 /// <reference path="../../../../../../../shared/typings/react-desc.d.ts" />
 /// <reference types="react" />
 import { MenuItemT } from '../../props';
+export declare function noop<T extends unknown[]>(..._args: T): void;
 declare const MultiMenuItem: {
     (props: MenuItemT): JSX.Element;
     propTypes: {

package/types/MenuItem/components/MultiMenuItem/styled.d.ts

@@ -1 +1 @@
-export declare const StyledItemContent: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
+export declare const StyledMultiMenuItemLabel: import("styled-components").StyledComponent<"label", import("styled-components").DefaultTheme, {}, never>;

package/types/MenuItem/components/styled.d.ts

@@ -5,3 +5,4 @@ export declare const StyledMenuItemWrapper: import("styled-components").StyledCo
     disabled: boolean;
 }, never>;
 export declare const StyledSubmenuItemWrapper: import("styled-components").StyledComponent<"li", import("styled-components").DefaultTheme, Pick<MenuItemT, "isActive" | "isSelected" | "isFocus"> & LayoutProps<import("@xstyled/system").Theme> & SizingProps<import("@xstyled/system").Theme> & PositionProps<import("@xstyled/system").Theme> & SpaceProps<import("@xstyled/system").Theme>, never>;
+export declare const StyleMenuItemLabel: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {}, never>;