@enact/limestone 1.9.3 → 1.10.0

package/Chips/tests/Chip-specs.js

@@ -9,7 +9,9 @@ describe('Chip', function () {
     var icon = 'star';
     (0, _react.render)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_Chip.ChipBase, {
       "data-testid": "chip",
-      icon: icon
+      icon: icon,
+      id: "minimal-chip",
+      children: "Chip"
     }));
     var expected = 983080; // decimal converted charCode of Unicode 'star' character
     var actual = _react.screen.getByTestId('chip').textContent.codePointAt();
@@ -19,8 +21,10 @@ describe('Chip', function () {
     var svg = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI3MDAiIGhlaWdodD0iNzAwIiB2aWV3Qm94PSIwIDAgNzAwIDcwMCI+PGRlZnM+PHN0eWxlPi5hLC5ie2ZpbGw6I2ZmZjt9LmJ7b3BhY2l0eTowLjg7fTwvc3R5bGU+PC9kZWZzPjxwb2x5Z29uIGNsYXNzPSJhIiBwb2ludHM9IjM0OS45IDUyNy44IDE5OS45IDQyOS44IDE5OS45IDM3NC40IDM1MC4xIDQ3Mi43IDM0OS45IDM0OC41IDE5OS45IDI2MS4xIDE5OS45IDIwOS4zIDM1MCAyOTMuNiAzNTAgMjkzLjYgMzUwLjIgMjkzLjcgMzQ5LjkgMTY5LjMgMTAyLjcgNDguNSAxMDIuNyA0NzIuNiAzNTAuMSA2NTEuNiAzNDkuOSA1MjcuOCIvPjxwb2x5Z29uIGNsYXNzPSJiIiBwb2ludHM9IjM1MC4xIDY1MS42IDU5Ny4zIDQ3Mi44IDU5Ny4zIDM2Ni4zIDM0OS45IDUyNy44IDM1MC4xIDY1MS42Ii8+PHBvbHlnb24gY2xhc3M9ImIiIHBvaW50cz0iMzUwLjEgNDcyLjcgNTIzLjUgMzU5LjMgNTIzLjUgMjQ3LjQgMzQ5LjkgMzQ4LjUgMzUwLjEgNDcyLjciLz48cG9seWdvbiBjbGFzcz0iYiIgcG9pbnRzPSIzNTAgMjkzLjYgMzUwIDI5My42IDM1MC4yIDI5My43IDU5Ny4zIDE1NC44IDU5Ny4zIDQ4LjQgMzQ5LjkgMTY5LjMgMzUwIDI5My42Ii8+PC9zdmc+';
     (0, _react.render)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_Chip.ChipBase, {
       "data-testid": "chip",
+      id: "chip",
       icon: svg,
-      isImage: true
+      isImage: true,
+      children: "Chip"
     }));
     var actual = _react.screen.queryAllByRole('img')[0].firstChild;
     expect(actual).toHaveAttribute('src', svg);
@@ -28,6 +32,7 @@ describe('Chip', function () {
   test('should support `children` prop', function () {
     var children = 'label';
     (0, _react.render)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_Chip.ChipBase, {
+      id: "chip",
       children: children
     }));
     var expected = children;
@@ -38,9 +43,11 @@ describe('Chip', function () {
     var position = 'top';
     (0, _react.render)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_Chip.ChipBase, {
       "data-testid": "chip",
+      id: "chip",
       deleteButton: {
         position: position
-      }
+      },
+      children: "Chip"
     }));
     var chip = _react.screen.getByTestId('chip');
     var deleteButton = chip.querySelector('.deleteButtonContainer');
@@ -51,9 +58,11 @@ describe('Chip', function () {
     var position = 'bottom';
     (0, _react.render)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_Chip.ChipBase, {
       "data-testid": "chip",
+      id: "chip",
       deleteButton: {
         position: position
-      }
+      },
+      children: "Chip"
     }));
     var chip = _react.screen.getByTestId('chip');
     var deleteButton = chip.querySelector('.deleteButtonContainer');
@@ -64,9 +73,11 @@ describe('Chip', function () {
     var position = 'right';
     (0, _react.render)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_Chip.ChipBase, {
       "data-testid": "chip",
+      id: "chip",
       deleteButton: {
         position: position
-      }
+      },
+      children: "Chip"
     }));
     var chip = _react.screen.getByTestId('chip');
     var deleteButton = chip.querySelector('.deleteButtonContainer');
@@ -76,6 +87,7 @@ describe('Chip', function () {
   test('should render without delete button when deleteButton is false', function () {
     (0, _react.render)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_Chip.ChipBase, {
       "data-testid": "chip",
+      id: "chip",
       deleteButton: false,
       children: "Test Chip"
     }));
@@ -86,6 +98,7 @@ describe('Chip', function () {
   test('should render without delete button when deleteButton is undefined', function () {
     (0, _react.render)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_Chip.ChipBase, {
       "data-testid": "chip",
+      id: "chip",
       children: "Test Chip"
     }));
     var chip = _react.screen.getByTestId('chip');
@@ -95,6 +108,7 @@ describe('Chip', function () {
   test('should handle disabled state', function () {
     (0, _react.render)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_Chip.ChipBase, {
       "data-testid": "chip",
+      id: "chip",
       disabled: true,
       children: "Disabled Chip"
     }));
@@ -104,6 +118,7 @@ describe('Chip', function () {
   test('should handle disabled state with delete button', function () {
     (0, _react.render)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_Chip.ChipBase, {
       "data-testid": "chip",
+      id: "chip",
       disabled: true,
       deleteButton: {
         position: 'right'
@@ -118,6 +133,7 @@ describe('Chip', function () {
   test('should use default delete button icon when not specified', function () {
     (0, _react.render)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_Chip.ChipBase, {
       "data-testid": "chip",
+      id: "chip",
       deleteButton: {
         position: 'right'
       },
@@ -130,6 +146,7 @@ describe('Chip', function () {
   test('should use custom delete button icon when specified', function () {
     (0, _react.render)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_Chip.ChipBase, {
       "data-testid": "chip",
+      id: "chip",
       deleteButton: {
         position: 'right',
         icon: 'trash'
@@ -152,6 +169,7 @@ describe('Chip', function () {
   test('should handle onClick events', function () {
     var mockOnClick = jest.fn();
     (0, _react.render)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_Chip.ChipBase, {
+      id: "chip",
       onClick: mockOnClick,
       children: "Clickable Chip"
     }));
@@ -164,6 +182,7 @@ describe('Chip', function () {
     var children = 'Star Chip';
     (0, _react.render)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_Chip.ChipBase, {
       "data-testid": "chip",
+      id: "chip",
       icon: icon,
       children: children
     }));
@@ -178,6 +197,7 @@ describe('Chip', function () {
     (0, _react.render)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_Chip.ChipBase, {
       className: customClass,
       "data-testid": "chip",
+      id: "chip",
       children: "Test Chip"
     }));
     var chipButton = _react.screen.getByRole('checkbox');

package/Chips/tests/Chips-specs.js

@@ -15,6 +15,7 @@ describe('Chips', function () {
   var defaultProps = {
     orientation: 'vertical',
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Chip.ChipBase, {
+      id: "chip1",
       deleteButton: {
         icon: 'closex',
         position: 'right',
@@ -22,6 +23,7 @@ describe('Chips', function () {
       },
       children: "Chip 1"
     }, "chip1"), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Chip.ChipBase, {
+      id: "chip2",
       deleteButton: {
         icon: 'closex',
         position: 'right',
@@ -296,8 +298,16 @@ describe('Chips', function () {
           position: 'right',
           onDelete: mockDeleteWithParams
         },
-        children: "Test Chip"
-      }, "chip1")]
+        children: "Chip 1"
+      }, "chip1"), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Chip.ChipBase, {
+        id: "chip2",
+        deleteButton: {
+          icon: 'closex',
+          position: 'right',
+          onDelete: mockDeleteWithParams
+        },
+        children: "Chip 2"
+      }, "chip2")]
     };
     (0, _react.render)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_Chips.ChipsBase, _objectSpread({}, propsWithParams)));
     var deleteButtons = getAllDeleteButtons();

package/ColorPicker/ColorPicker.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports["default"] = exports.ColorPickerDecorator = exports.ColorPickerBase = exports.ColorPicker = void 0;
 var _kind = _interopRequireDefault(require("@enact/core/kind"));
+var _util = require("@enact/core/util");
 var _Spottable = _interopRequireDefault(require("@enact/spotlight/Spottable"));
 var _Layout = require("@enact/ui/Layout");
 var _Toggleable = _interopRequireDefault(require("@enact/ui/Toggleable"));
@@ -63,11 +64,12 @@ var SpottableButton = (0, _Spottable["default"])(_Button.ButtonBase);
  * @ui
  * @private
  */
-var PopupContent = function PopupContent(_ref) {
-  var color = _ref.color,
-    colorHandler = _ref.colorHandler,
-    css = _ref.css,
-    presetColors = _ref.presetColors;
+var _PopupContent = function PopupContent(props) {
+  (0, _util.checkPropTypes)(_PopupContent, props);
+  var color = props.color,
+    colorHandler = props.colorHandler,
+    css = props.css,
+    presetColors = props.presetColors;
   var _useState = (0, _react.useState)(0),
     _useState2 = _slicedToArray(_useState, 2),
     hue = _useState2[0],
@@ -173,7 +175,7 @@ var PopupContent = function PopupContent(_ref) {
     })]
   });
 };
-PopupContent.propTypes = {
+_PopupContent.propTypes = {
   /**
    * Indicates the color.
    *
@@ -295,13 +297,13 @@ var ColorPickerBase = exports.ColorPickerBase = (0, _kind["default"])({
     text: _propTypes["default"].string
   },
   handlers: {
-    handleClosePopup: function handleClosePopup(ev, _ref2) {
-      var onTogglePopup = _ref2.onTogglePopup;
+    handleClosePopup: function handleClosePopup(ev, _ref) {
+      var onTogglePopup = _ref.onTogglePopup;
       onTogglePopup();
     },
-    handleOpenPopup: function handleOpenPopup(ev, _ref3) {
-      var disabled = _ref3.disabled,
-        onTogglePopup = _ref3.onTogglePopup;
+    handleOpenPopup: function handleOpenPopup(ev, _ref2) {
+      var disabled = _ref2.disabled,
+        onTogglePopup = _ref2.onTogglePopup;
       if (!disabled) {
         onTogglePopup();
       }
@@ -311,19 +313,19 @@ var ColorPickerBase = exports.ColorPickerBase = (0, _kind["default"])({
     css: _ColorPickerModule["default"],
     publicClassNames: true
   },
-  render: function render(_ref4) {
-    var color = _ref4.color,
-      colorHandler = _ref4.colorHandler,
-      css = _ref4.css,
-      _ref4$disabled = _ref4.disabled,
-      disabled = _ref4$disabled === void 0 ? false : _ref4$disabled,
-      handleClosePopup = _ref4.handleClosePopup,
-      handleOpenPopup = _ref4.handleOpenPopup,
-      _ref4$popupOpen = _ref4.popupOpen,
-      popupOpen = _ref4$popupOpen === void 0 ? false : _ref4$popupOpen,
-      presetColors = _ref4.presetColors,
-      text = _ref4.text,
-      rest = _objectWithoutProperties(_ref4, _excluded);
+  render: function render(_ref3) {
+    var color = _ref3.color,
+      colorHandler = _ref3.colorHandler,
+      css = _ref3.css,
+      _ref3$disabled = _ref3.disabled,
+      disabled = _ref3$disabled === void 0 ? false : _ref3$disabled,
+      handleClosePopup = _ref3.handleClosePopup,
+      handleOpenPopup = _ref3.handleOpenPopup,
+      _ref3$popupOpen = _ref3.popupOpen,
+      popupOpen = _ref3$popupOpen === void 0 ? false : _ref3$popupOpen,
+      presetColors = _ref3.presetColors,
+      text = _ref3.text,
+      rest = _objectWithoutProperties(_ref3, _excluded);
     delete rest.onTogglePopup;
     var CloseIcon = (0, _react.useCallback)(function (props) {
       return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon["default"], _objectSpread(_objectSpread({}, props), {}, {
@@ -377,7 +379,7 @@ var ColorPickerBase = exports.ColorPickerBase = (0, _kind["default"])({
               size: "small"
             })
           })]
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(PopupContent, {
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_PopupContent, {
           color: color,
           colorHandler: colorHandler,
           css: css,

package/ContextualPopupDecorator/ContextualPopupDecorator.js

@@ -116,7 +116,8 @@ var Decorator = (0, _hoc["default"])(defaultConfig, function (config, Wrapped) {
   var WrappedWithRef = (0, _WithRef.WithRef)(Wrapped);
 
   // eslint-disable-next-line no-shadow
-  var ContextualPopupDecorator = function ContextualPopupDecorator(props) {
+  var _ContextualPopupDecorator = function ContextualPopupDecorator(props) {
+    (0, _util.checkPropTypes)(_ContextualPopupDecorator, props);
     var componentProps = (0, _util.setDefaultProps)(props, contextualPopupDecoratorDefaultProps);
     var _useState = (0, _react.useState)(null),
       _useState2 = _slicedToArray(_useState, 2),
@@ -137,12 +138,15 @@ var Decorator = (0, _hoc["default"])(defaultConfig, function (config, Wrapped) {
       _useState6 = _slicedToArray(_useState5, 2),
       containerPosition = _useState6[0],
       setContainerPosition = _useState6[1];
-    var _useState7 = (0, _react.useState)(''),
+    var _useState7 = (0, _react.useState)(componentProps.direction),
       _useState8 = _slicedToArray(_useState7, 2),
       direction = _useState8[0],
       setDirection = _useState8[1];
+    var _useState9 = (0, _react.useState)(null),
+      _useState0 = _slicedToArray(_useState9, 2),
+      holeBounds = _useState0[0],
+      setHoleBounds = _useState0[1];
     var adjustedDirection = (0, _react.useRef)(componentProps.direction);
-    var containerId = (0, _react.useRef)(_spotlight["default"].add(componentProps.popupSpotlightId));
     var containerNode = (0, _react.useRef)(null);
     var clientSiblingRef = (0, _react.useRef)(null);
     var overflow = (0, _react.useRef)({});
@@ -153,6 +157,9 @@ var Decorator = (0, _hoc["default"])(defaultConfig, function (config, Wrapped) {
     var findClientSiblingRef = (0, _react.useRef)(null);
     var keyDownRef = (0, _react.useRef)(null);
     var keyUpRef = (0, _react.useRef)(null);
+    var containerId = (0, _react.useMemo)(function () {
+      return _spotlight["default"].add(componentProps.popupSpotlightId);
+    }, [componentProps.popupSpotlightId]);
     if (componentProps.setApiProvider) {
       componentProps.setApiProvider();
     }
@@ -172,7 +179,9 @@ var Decorator = (0, _hoc["default"])(defaultConfig, function (config, Wrapped) {
     var generateId = (0, _react.useCallback)(function () {
       return Math.random().toString(36).substring(2, 10);
     }, []);
-    var id = (0, _react.useRef)(generateId());
+    var id = (0, _react.useMemo)(function () {
+      return generateId();
+    }, [generateId]);
     var adjustRTL = (0, _react.useCallback)(function (position) {
       var pos = position;
       if (componentProps.rtl) {
@@ -253,7 +262,7 @@ var Decorator = (0, _hoc["default"])(defaultConfig, function (config, Wrapped) {
       return containerNode.current && containerNode.current.getBoundingClientRect().width || 0;
     }, []);
     var updateLeaveFor = (0, _react.useCallback)(function (localActivator) {
-      _spotlight["default"].set(containerId.current, {
+      _spotlight["default"].set(containerId, {
         leaveFor: {
           up: localActivator,
           down: localActivator,
@@ -261,7 +270,7 @@ var Decorator = (0, _hoc["default"])(defaultConfig, function (config, Wrapped) {
           right: localActivator
         }
       });
-    }, []);
+    }, [containerId]);
     var getContainerPosition = (0, _react.useCallback)(function (localContainerNode, clientNode) {
       var _distances2 = distances(),
         ARROW_OFFSET = _distances2.ARROW_OFFSET,
@@ -451,14 +460,14 @@ var Decorator = (0, _hoc["default"])(defaultConfig, function (config, Wrapped) {
     }, []);
     var spotPopupContent = (0, _react.useCallback)(function () {
       var localSpotlightRestrict = componentProps.spotlightRestrict;
-      var spottableDescendants = _spotlight["default"].getSpottableDescendants(containerId.current);
+      var spottableDescendants = _spotlight["default"].getSpottableDescendants(containerId);
       if (localSpotlightRestrict === 'self-only' && spottableDescendants.length && _spotlight["default"].getCurrent()) {
         _spotlight["default"].getCurrent().blur();
       }
-      if (!_spotlight["default"].focus(containerId.current)) {
-        _spotlight["default"].setActiveContainer(containerId.current);
+      if (!_spotlight["default"].focus(containerId)) {
+        _spotlight["default"].setActiveContainer(containerId);
       }
-    }, [componentProps]);
+    }, [componentProps, containerId]);
     var handleKeyUp = (0, _react.useCallback)(function () {
       return (0, _handle.handle)((0, _handle.forProp)('open', true), (0, _handle.forKey)('enter'), function () {
         return _spotlight["default"].getCurrent() === activator;
@@ -495,7 +504,7 @@ var Decorator = (0, _hoc["default"])(defaultConfig, function (config, Wrapped) {
       var current = _spotlight["default"].getCurrent();
       var localDirection = (0, _spotlight.getDirection)(ev.keyCode);
       if (!localDirection) return;
-      var hasSpottables = _spotlight["default"].getSpottableDescendants(containerId.current).length > 0;
+      var hasSpottables = _spotlight["default"].getSpottableDescendants(containerId).length > 0;
       var spotlessSpotlightModal = componentProps.spotlightRestrict === 'self-only' && !hasSpottables;
       var shouldSpotPopup = current === activator && localDirection === PositionToDirection[adjustedDirection.current.split(' ')[0]] && hasSpottables;
       if (shouldSpotPopup || spotlessSpotlightModal) {
@@ -507,7 +516,7 @@ var Decorator = (0, _hoc["default"])(defaultConfig, function (config, Wrapped) {
           spotPopupContent();
         }
       }
-    }, [activator, componentProps, handleDirectionalKey, spotPopupContent]);
+    }, [activator, componentProps, containerId, handleDirectionalKey, spotPopupContent]);
 
     // handle key event from contextual popup and closes the popup
     var handleContainerKeyDown = (0, _react.useCallback)(function (ev) {
@@ -562,7 +571,7 @@ var Decorator = (0, _hoc["default"])(defaultConfig, function (config, Wrapped) {
       }
     }, [componentProps, handleKeyDown, handleKeyUp]);
     (0, _react.useEffect)(function () {
-      var localId = containerId.current;
+      var localId = containerId;
       if (componentProps.open) {
         (0, _dispatcher.on)('keydown', keyDownRef.current);
         (0, _dispatcher.on)('keyup', keyUpRef.current);
@@ -626,7 +635,7 @@ var Decorator = (0, _hoc["default"])(defaultConfig, function (config, Wrapped) {
       skin = componentProps.skin,
       spotlightRestrict = componentProps.spotlightRestrict,
       rest = _objectWithoutProperties(componentProps, _excluded);
-    var idFloatLayer = "".concat(id.current, "_floatLayer");
+    var idFloatLayer = "".concat(id, "_floatLayer");
     var scrimType = rest.scrimType;
     delete rest.scrimType;
 
@@ -641,10 +650,11 @@ var Decorator = (0, _hoc["default"])(defaultConfig, function (config, Wrapped) {
     if (!noSkin) {
       rest.skin = skin;
     }
-    var holeBounds;
-    if (clientSiblingRef !== null && clientSiblingRef !== void 0 && clientSiblingRef.current && holepunchScrim) {
-      holeBounds = clientSiblingRef.current.getBoundingClientRect();
-    }
+    (0, _react.useEffect)(function () {
+      if (clientSiblingRef !== null && clientSiblingRef !== void 0 && clientSiblingRef.current && holepunchScrim) {
+        setHoleBounds(clientSiblingRef.current.getBoundingClientRect());
+      }
+    }, [holepunchScrim]);
     delete rest.direction;
     delete rest.onClose;
     delete rest.onOpen;
@@ -677,7 +687,7 @@ var Decorator = (0, _hoc["default"])(defaultConfig, function (config, Wrapped) {
             offset: noArrow ? offset : 'none',
             showArrow: !noArrow,
             skin: skin,
-            spotlightId: containerId.current,
+            spotlightId: containerId,
             spotlightRestrict: spotlightRestrict,
             children: /*#__PURE__*/(0, _jsxRuntime.jsx)(PopupComponent, _objectSpread({}, popupPropsRef))
           }))]
@@ -689,8 +699,8 @@ var Decorator = (0, _hoc["default"])(defaultConfig, function (config, Wrapped) {
       }))]
     });
   };
-  ContextualPopupDecorator.displayName = 'ContextualPopupDecorator';
-  ContextualPopupDecorator.propTypes = /** @lends limestone/ContextualPopupDecorator.ContextualPopupDecorator.prototype */{
+  _ContextualPopupDecorator.displayName = 'ContextualPopupDecorator';
+  _ContextualPopupDecorator.propTypes = /** @lends limestone/ContextualPopupDecorator.ContextualPopupDecorator.prototype */{
     /**
      * The component rendered within the
      * {@link limestone/ContextualPopupDecorator.ContextualPopup|ContextualPopup}.
@@ -840,7 +850,7 @@ var Decorator = (0, _hoc["default"])(defaultConfig, function (config, Wrapped) {
      */
     spotlightRestrict: _propTypes2["default"].oneOf(['none', 'self-first', 'self-only'])
   };
-  return ContextualPopupDecorator;
+  return _ContextualPopupDecorator;
 });
 
 /**

package/DayPicker/DaySelectorDecorator.js

@@ -207,13 +207,18 @@ var daySelectorDecoratorDefaultProps = {
  * @private
  */
 var DaySelectorDecorator = exports.DaySelectorDecorator = (0, _hoc["default"])(function (config, Wrapped) {
-  var DaySelector = function DaySelector(props) {
-    var daySelectorDecoratorProps = (0, _util.setDefaultProps)(props, daySelectorDecoratorDefaultProps);
+  var _DaySelector = function DaySelector(props) {
+    var daySelectorDecoratorProps = (0, _react.useMemo)(function () {
+      return (0, _util.setDefaultProps)(props, daySelectorDecoratorDefaultProps);
+    }, [props]);
+    (0, _util.checkPropTypes)(_DaySelector, daySelectorDecoratorProps);
     var dayNameLength = daySelectorDecoratorProps.dayNameLength,
       locale = daySelectorDecoratorProps.locale,
       selected = daySelectorDecoratorProps.selected,
       rest = _objectWithoutProperties(daySelectorDecoratorProps, _excluded);
-    var state = getLocaleState(dayNameLength, locale);
+    var state = (0, _react.useMemo)(function () {
+      return getLocaleState(dayNameLength, locale);
+    }, [dayNameLength, locale]);
     var localSelected = localizeSelected(selected, state);
     var abbreviatedDayNames = orderDays(state.abbreviatedDayNames, state);
     var fullDayNames = orderDays(state.fullDayNames, state);
@@ -243,8 +248,8 @@ var DaySelectorDecorator = exports.DaySelectorDecorator = (0, _hoc["default"])(f
       })
     }));
   };
-  DaySelector.displayName = 'DaySelectorDecorator';
-  DaySelector.propTypes = /** @lends limestone/DayPicker.DaySelectorDecorator.prototype */{
+  _DaySelector.displayName = 'DaySelectorDecorator';
+  _DaySelector.propTypes = /** @lends limestone/DayPicker.DaySelectorDecorator.prototype */{
     /**
      * The "aria-label" for the selector.
      *
@@ -295,7 +300,7 @@ var DaySelectorDecorator = exports.DaySelectorDecorator = (0, _hoc["default"])(f
      */
     selected: _propTypes["default"].oneOfType([_propTypes["default"].number, _propTypes["default"].arrayOf(_propTypes["default"].number)])
   };
-  DaySelector.defaultPropValues = daySelectorDecoratorDefaultProps;
-  return DaySelector;
+  _DaySelector.defaultPropValues = daySelectorDecoratorDefaultProps;
+  return _DaySelector;
 });
 var _default = exports["default"] = DaySelectorDecorator;

package/Dropdown/Dropdown.module.css

@@ -50,6 +50,10 @@
   padding: 0 var(--primitive-spacing-48);
   margin: 0;
 }
+.dropdown .button.small {
+  min-width: unset;
+  max-width: unset;
+}
 :global(.spotlight-input-key) .dropdown .button:not([disabled]):global(.spottable):focus.pressed .bg,
 :global(.spotlight-input-mouse) .dropdown .button:not([disabled]):global(.spottable):focus.pressed .bg,
 :global(.spotlight-input-key) .dropdown .button:not([disabled]):global(.spottable):focus:active .bg,