rsuite 5.64.1 → 5.65.0

package/Table/styles/index.less

@@ -34,7 +34,7 @@
     bottom: 0;
     width: 100%;
     z-index: 4;
-    border-top: 1px solid var(--rs-border-secondary);
+    border-top: 1px solid var(--rs-table-border-color);
     padding: 10px;
     background-color: var(--rs-bg-card);
   }
@@ -160,7 +160,7 @@
     position: absolute;
     white-space: normal;
     background-color: var(--rs-bg-card);
-    border-bottom: 1px solid var(--rs-border-secondary);
+    border-bottom: 1px solid var(--rs-table-border-color);
 
     &.first {
       border-left-width: 0;
@@ -204,7 +204,7 @@
     }
 
     &-rowspan {
-      border-bottom: 1px solid var(--rs-border-secondary) !important;
+      border-bottom: 1px solid var(--rs-table-border-color) !important;
     }
   }
 
@@ -308,11 +308,11 @@
   }
 
   &-bordered {
-    border: 1px solid var(--rs-border-secondary);
+    border: 1px solid var(--rs-table-border-color);
   }
 
   &-cell-bordered &-cell {
-    border-right: 1px solid var(--rs-border-secondary);
+    border-right: 1px solid var(--rs-table-border-color);
   }
 
   &-column-group {
@@ -323,7 +323,7 @@
     width: 100%;
 
     &-header {
-      border-bottom: 1px solid var(--rs-border-secondary);
+      border-bottom: 1px solid var(--rs-table-border-color);
       position: absolute;
       width: 100%;
 
@@ -335,11 +335,15 @@
 
     &-cell {
       position: absolute;
-      border-right: 1px solid var(--rs-border-secondary);
+      border-right: 1px solid var(--rs-table-border-color);
     }
   }
 }
 
+.rs-table-row:not(.rs-table-row-rowspan) {
+  border-bottom: 1px solid var(--rs-table-border-color);
+}
+
 // Tree Table
 
 .rs-table-cell-expand-wrapper {

package/TagInput/styles/index.css

@@ -132,6 +132,8 @@
   --rs-picker-value: var(--rs-primary-700);
   --rs-picker-count-bg: var(--rs-primary-500);
   --rs-picker-count-text: #fff;
+  --rs-picker-state-error: var(--rs-state-error);
+  --rs-picker-state-error-outline: var(--rs-state-error-outline);
 }
 @supports not (color: rgb(from white r g b)) {
   :root,
@@ -2792,13 +2794,19 @@ textarea.rs-input-group-inside.rs-input-group-xs > .rs-input-group-btn {
       -ms-flex-align: center;
           align-items: center;
 }
-.rs-picker-error > .rs-input-group {
-  border-color: #f44336 !important;
-  border-color: var(--rs-state-error) !important;
+.rs-picker-error > .rs-picker-input-group {
+  border-color: #f44336;
+  border-color: var(--rs-picker-state-error);
+}
+.rs-picker-error > .rs-picker-input-group:hover {
+  border-color: #f44336;
+  border-color: var(--rs-picker-state-error);
 }
-.rs-picker-error > .rs-input-group:focus-within {
-  outline: 3px solid rgb(from #f44336 r g b / 25%) !important;
-  outline: var(--rs-state-error-outline) !important;
+.rs-picker-error > .rs-picker-input-group:focus-within {
+  border-color: #f44336;
+  border-color: var(--rs-picker-state-error);
+  outline: 3px solid rgb(from #f44336 r g b / 25%);
+  outline: var(--rs-picker-state-error-outline);
 }
 .rs-picker-toggle {
   display: -webkit-inline-box;

package/TagPicker/styles/index.css

@@ -132,6 +132,8 @@
   --rs-picker-value: var(--rs-primary-700);
   --rs-picker-count-bg: var(--rs-primary-500);
   --rs-picker-count-text: #fff;
+  --rs-picker-state-error: var(--rs-state-error);
+  --rs-picker-state-error-outline: var(--rs-state-error-outline);
 }
 @supports not (color: rgb(from white r g b)) {
   :root,
@@ -2792,13 +2794,19 @@ textarea.rs-input-group-inside.rs-input-group-xs > .rs-input-group-btn {
       -ms-flex-align: center;
           align-items: center;
 }
-.rs-picker-error > .rs-input-group {
-  border-color: #f44336 !important;
-  border-color: var(--rs-state-error) !important;
+.rs-picker-error > .rs-picker-input-group {
+  border-color: #f44336;
+  border-color: var(--rs-picker-state-error);
+}
+.rs-picker-error > .rs-picker-input-group:hover {
+  border-color: #f44336;
+  border-color: var(--rs-picker-state-error);
 }
-.rs-picker-error > .rs-input-group:focus-within {
-  outline: 3px solid rgb(from #f44336 r g b / 25%) !important;
-  outline: var(--rs-state-error-outline) !important;
+.rs-picker-error > .rs-picker-input-group:focus-within {
+  border-color: #f44336;
+  border-color: var(--rs-picker-state-error);
+  outline: 3px solid rgb(from #f44336 r g b / 25%);
+  outline: var(--rs-picker-state-error-outline);
 }
 .rs-picker-toggle {
   display: -webkit-inline-box;

package/Uploader/styles/index.css

@@ -1248,6 +1248,9 @@
   opacity: 0.3;
   cursor: not-allowed;
 }
+.rs-uploader-file-item-disabled:hover {
+  background-color: transparent !important;
+}
 .rs-uploader-picture .rs-uploader-file-item-disabled .rs-uploader-file-item-status {
   cursor: not-allowed;
 }

package/Uploader/styles/index.less

@@ -18,6 +18,10 @@
     opacity: 0.3;
     cursor: not-allowed;
 
+    &:hover {
+      background-color: transparent !important;
+    }
+
     .rs-uploader-picture & .rs-uploader-file-item-status {
       cursor: not-allowed;
     }

package/VStack/package.json

@@ -0,0 +1,7 @@
+{
+  "name": "rsuite/VStack",
+  "private": true,
+  "main": "../cjs/Stack/VStack.js",
+  "module": "../esm/Stack/VStack.js",
+  "types": "../esm/Stack/VStack.d.ts"
+}

package/cjs/DatePicker/DatePicker.js

@@ -30,7 +30,7 @@ var _utils2 = require("./utils");
 var _useMonthView2 = _interopRequireDefault(require("./hooks/useMonthView"));
 var _useFocus2 = _interopRequireDefault(require("./hooks/useFocus"));
 var _useCustomizedInput2 = _interopRequireDefault(require("./hooks/useCustomizedInput"));
-var _templateObject;
+var _templateObject, _templateObject2;
 var _excluded = ["as", "className", "classPrefix", "calendarDefaultDate", "cleanable", "editable", "defaultValue", "disabled", "readOnly", "plaintext", "format", "id", "isoWeek", "weekStart", "limitEndYear", "limitStartYear", "locale", "loading", "label", "menuClassName", "menuStyle", "appearance", "placement", "oneTap", "placeholder", "ranges", "value", "showMeridian", "showWeekNumbers", "style", "size", "caretAs", "shouldDisableDate", "shouldDisableHour", "shouldDisableMinute", "shouldDisableSecond", "onChange", "onChangeCalendarDate", "onClean", "onEnter", "onExit", "onNextMonth", "onOk", "onPrevMonth", "onSelect", "onToggleMonthDropdown", "onToggleTimeDropdown", "onShortcutClick", "renderCell", "renderValue", "disabledDate", "disabledHours", "disabledMinutes", "disabledSeconds"];
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
@@ -508,9 +508,10 @@ var DatePicker = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     inside: true,
     size: size,
     disabled: disabled,
+    className: prefix(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["input-group"]))),
     onClick: handleClick
   }), /*#__PURE__*/_react.default.createElement(_Picker.PickerLabel, {
-    className: prefix(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["label"]))),
+    className: prefix(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2.default)(["label"]))),
     id: id + "-label"
   }, label), /*#__PURE__*/_react.default.createElement(Input, (0, _extends2.default)({
     "aria-haspopup": "dialog",

package/cjs/DateRangePicker/DateRangePicker.js

@@ -31,7 +31,7 @@ var _InputGroup = _interopRequireDefault(require("../InputGroup"));
 var _Header = _interopRequireDefault(require("./Header"));
 var _useDateDisabled = _interopRequireDefault(require("./hooks/useDateDisabled"));
 var _useCustomizedInput2 = _interopRequireDefault(require("../DatePicker/hooks/useCustomizedInput"));
-var _templateObject;
+var _templateObject, _templateObject2;
 var _excluded = ["as", "classPrefix", "className", "appearance", "editable", "cleanable", "character", "defaultCalendarValue", "defaultValue", "plaintext", "disabled", "disabledDate", "shouldDisableDate", "format", "hoverRange", "id", "isoWeek", "weekStart", "limitEndYear", "limitStartYear", "locale", "loading", "label", "menuClassName", "menuStyle", "oneTap", "placeholder", "placement", "ranges", "readOnly", "showOneCalendar", "showWeekNumbers", "showMeridian", "showHeader", "style", "size", "caretAs", "value", "onChange", "onClean", "onEnter", "onExit", "onOk", "onSelect", "onShortcutClick", "renderTitle", "renderValue"];
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
@@ -783,10 +783,11 @@ var DateRangePicker = /*#__PURE__*/_react.default.forwardRef(function (props, re
     plaintext: plaintext
   }) : /*#__PURE__*/_react.default.createElement(_InputGroup.default, (0, _extends2.default)({}, (0, _omit.default)(rest, [].concat(_Picker.omitTriggerPropKeys, usedClassNamePropKeys, _date.calendarOnlyProps)), {
     inside: true,
+    className: prefix(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["input-group"]))),
     disabled: disabled,
     size: size
   }), /*#__PURE__*/_react.default.createElement(_Picker.PickerLabel, {
-    className: prefix(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["label"]))),
+    className: prefix(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2.default)(["label"]))),
     id: id + "-label"
   }, label), /*#__PURE__*/_react.default.createElement(Input, (0, _extends2.default)({
     "aria-haspopup": "dialog",

package/cjs/Message/Message.js

@@ -12,9 +12,10 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 var _constants = require("../internals/constants");
 var _statusIcons = require("../internals/constants/statusIcons");
 var _hooks = require("../internals/hooks");
+var _utils = require("../internals/utils");
 var _propTypes2 = require("../internals/propTypes");
 var _CloseButton = _interopRequireDefault(require("../internals/CloseButton"));
-var _ToastContext = _interopRequireDefault(require("../toaster/ToastContext"));
+var _useDelayedClosure2 = _interopRequireDefault(require("../toaster/hooks/useDelayedClosure"));
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
 var _excluded = ["as", "bordered", "centered", "className", "classPrefix", "children", "closable", "duration", "full", "header", "type", "showIcon", "onClose"];
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
@@ -51,12 +52,15 @@ var Message = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     merge = _useClassNames.merge,
     prefix = _useClassNames.prefix;
   var isMounted = (0, _hooks.useIsMounted)();
-  var _useContext = (0, _react.useContext)(_ToastContext.default),
-    usedToaster = _useContext.usedToaster;
+  var targetRef = _react.default.useRef(null);
 
   // Timed close message
-  var _useTimeout = (0, _hooks.useTimeout)(onClose, duration, usedToaster && duration > 0),
-    clear = _useTimeout.clear;
+  var _useDelayedClosure = (0, _useDelayedClosure2.default)({
+      targetRef: targetRef,
+      onClose: onClose,
+      duration: duration
+    }),
+    clear = _useDelayedClosure.clear;
   var handleClose = (0, _hooks.useEventCallback)(function (event) {
     setDisplay('hiding');
     onClose === null || onClose === void 0 ? void 0 : onClose(event);
@@ -78,7 +82,7 @@ var Message = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   return /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({
     role: "alert"
   }, rest, {
-    ref: ref,
+    ref: (0, _utils.mergeRefs)(targetRef, ref),
     className: classes
   }), /*#__PURE__*/_react.default.createElement("div", {
     className: prefix(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["container"])))

package/cjs/Notification/Notification.d.ts

@@ -1,6 +1,5 @@
 import React from 'react';
-import { WithAsProps, RsRefForwardingComponent } from '../internals/types';
-export type MessageType = 'info' | 'success' | 'warning' | 'error';
+import { WithAsProps, TypeAttributes, RsRefForwardingComponent } from '../internals/types';
 export interface NotificationProps extends WithAsProps {
     /** Title of the message */
     header?: React.ReactNode;
@@ -11,15 +10,20 @@ export interface NotificationProps extends WithAsProps {
      *
      * @default 4500
      * @deprecated Use `toaster.push(<Notification />, { duration: 4500 })` instead.
+     * @internal
      */
     duration?: number;
     /**
      * The remove button is displayed.
      */
     closable?: boolean;
-    /** Type of message */
-    type?: MessageType;
-    /** Callback after the message is removed */
+    /**
+     * Type of message
+     */
+    type?: TypeAttributes.Status;
+    /**
+     * Callback after the message is removed
+     */
     onClose?: (event?: React.MouseEvent<HTMLButtonElement>) => void;
 }
 /**

package/cjs/Notification/Notification.js

@@ -13,7 +13,8 @@ var _statusIcons = require("../internals/constants/statusIcons");
 var _hooks = require("../internals/hooks");
 var _propTypes2 = require("../internals/propTypes");
 var _CloseButton = _interopRequireDefault(require("../internals/CloseButton"));
-var _ToastContext = _interopRequireDefault(require("../toaster/ToastContext"));
+var _utils = require("../internals/utils");
+var _useDelayedClosure2 = _interopRequireDefault(require("../toaster/hooks/useDelayedClosure"));
 var _templateObject, _templateObject2;
 var _excluded = ["as", "classPrefix", "closable", "duration", "className", "type", "header", "children", "onClose"];
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
@@ -45,12 +46,15 @@ var Notification = /*#__PURE__*/_react.default.forwardRef(function (props, ref)
     merge = _useClassNames.merge,
     prefix = _useClassNames.prefix;
   var isMounted = (0, _hooks.useIsMounted)();
-  var _useContext = (0, _react.useContext)(_ToastContext.default),
-    usedToaster = _useContext.usedToaster;
+  var targetRef = _react.default.useRef(null);
 
   // Timed close message
-  var _useTimeout = (0, _hooks.useTimeout)(onClose, duration, usedToaster && duration > 0),
-    clear = _useTimeout.clear;
+  var _useDelayedClosure = (0, _useDelayedClosure2.default)({
+      targetRef: targetRef,
+      onClose: onClose,
+      duration: duration
+    }),
+    clear = _useDelayedClosure.clear;
 
   // Click to trigger to close the message
   var handleClose = (0, _hooks.useEventCallback)(function (event) {
@@ -84,7 +88,7 @@ var Notification = /*#__PURE__*/_react.default.forwardRef(function (props, ref)
   return /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({
     role: "alert"
   }, rest, {
-    ref: ref,
+    ref: (0, _utils.mergeRefs)(targetRef, ref),
     className: classes
   }), /*#__PURE__*/_react.default.createElement("div", {
     className: prefix(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2.default)(["content"])))

package/cjs/Panel/PanelBody.js

@@ -10,7 +10,7 @@ var _react = _interopRequireDefault(require("react"));
 var _Collapse = _interopRequireDefault(require("../Animation/Collapse"));
 var _hooks = require("../internals/hooks");
 var _ScrollView = _interopRequireDefault(require("../internals/ScrollView"));
-var _excluded = ["classPrefix", "children", "collapsible", "expanded", "bodyFill", "role", "id", "labelId", "scrollShadow", "onEnter", "onEntering", "onEntered", "onExit", "onExiting", "onExited", "onScroll"],
+var _excluded = ["classPrefix", "children", "collapsible", "expanded", "bodyFill", "role", "id", "labelId", "scrollShadow", "className", "onEnter", "onEntering", "onEntered", "onExit", "onExiting", "onExited", "onScroll"],
   _excluded2 = ["className"];
 var PanelBody = function PanelBody(props) {
   var _props$classPrefix = props.classPrefix,
@@ -23,6 +23,7 @@ var PanelBody = function PanelBody(props) {
     id = props.id,
     labelId = props.labelId,
     scrollShadow = props.scrollShadow,
+    className = props.className,
     onEnter = props.onEnter,
     onEntering = props.onEntering,
     onEntered = props.onEntered,
@@ -35,9 +36,9 @@ var PanelBody = function PanelBody(props) {
     merge = _useClassNames.merge,
     prefix = _useClassNames.prefix,
     withClassPrefix = _useClassNames.withClassPrefix;
-  var bodyClasses = withClassPrefix({
+  var bodyClasses = merge(className, withClassPrefix({
     fill: bodyFill
-  });
+  }));
   var renderBody = function renderBody(bodyProps) {
     return /*#__PURE__*/_react.default.createElement(_ScrollView.default, (0, _extends2.default)({}, rest, bodyProps, {
       customScrollbar: true,

package/cjs/Stack/HStack.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import { StackProps } from './Stack';
+export interface HStackProps extends Omit<StackProps, 'direction'> {
+    /**
+     * Reverse the order of the children in the stack
+     */
+    reverse?: boolean;
+}
+declare const HStack: React.ForwardRefExoticComponent<HStackProps & React.RefAttributes<unknown>>;
+export default HStack;

package/cjs/Stack/HStack.js

@@ -0,0 +1,29 @@
+'use client';
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.default = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
+var _react = _interopRequireDefault(require("react"));
+var _Stack = _interopRequireDefault(require("./Stack"));
+var _excluded = ["reverse", "spacing", "childrenRenderMode"];
+var HStack = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
+  var reverse = props.reverse,
+    _props$spacing = props.spacing,
+    spacing = _props$spacing === void 0 ? 6 : _props$spacing,
+    _props$childrenRender = props.childrenRenderMode,
+    childrenRenderMode = _props$childrenRender === void 0 ? 'clone' : _props$childrenRender,
+    rest = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
+  var direction = reverse ? 'row-reverse' : 'row';
+  return /*#__PURE__*/_react.default.createElement(_Stack.default, (0, _extends2.default)({
+    spacing: spacing,
+    childrenRenderMode: childrenRenderMode
+  }, rest, {
+    direction: direction,
+    ref: ref
+  }));
+});
+HStack.displayName = 'HStack';
+var _default = exports.default = HStack;

package/cjs/Stack/VStack.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { StackProps } from './Stack';
+export interface VStackProps extends Omit<StackProps, 'direction'> {
+    reverse?: boolean;
+}
+declare const VStack: React.ForwardRefExoticComponent<VStackProps & React.RefAttributes<unknown>>;
+export default VStack;

package/cjs/Stack/VStack.js

@@ -0,0 +1,32 @@
+'use client';
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+exports.__esModule = true;
+exports.default = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
+var _react = _interopRequireDefault(require("react"));
+var _Stack = _interopRequireDefault(require("./Stack"));
+var _excluded = ["reverse", "spacing", "alignItems", "childrenRenderMode"];
+var VStack = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
+  var reverse = props.reverse,
+    _props$spacing = props.spacing,
+    spacing = _props$spacing === void 0 ? 6 : _props$spacing,
+    _props$alignItems = props.alignItems,
+    alignItems = _props$alignItems === void 0 ? 'flex-start' : _props$alignItems,
+    _props$childrenRender = props.childrenRenderMode,
+    childrenRenderMode = _props$childrenRender === void 0 ? 'clone' : _props$childrenRender,
+    rest = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
+  var direction = reverse ? 'column-reverse' : 'column';
+  return /*#__PURE__*/_react.default.createElement(_Stack.default, (0, _extends2.default)({
+    spacing: spacing,
+    childrenRenderMode: childrenRenderMode,
+    alignItems: alignItems
+  }, rest, {
+    direction: direction,
+    ref: ref
+  }));
+});
+VStack.displayName = 'VStack';
+var _default = exports.default = VStack;

package/cjs/Stack/index.d.ts

@@ -1,3 +1,7 @@
 import Stack from './Stack';
 export type { StackProps } from './Stack';
+export type { HStackProps } from './HStack';
+export type { VStackProps } from './VStack';
+export { default as HStack } from './HStack';
+export { default as VStack } from './VStack';
 export default Stack;

package/cjs/Stack/index.js

@@ -3,6 +3,10 @@
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 exports.__esModule = true;
-exports.default = void 0;
+exports.default = exports.VStack = exports.HStack = void 0;
 var _Stack = _interopRequireDefault(require("./Stack"));
+var _HStack = _interopRequireDefault(require("./HStack"));
+exports.HStack = _HStack.default;
+var _VStack = _interopRequireDefault(require("./VStack"));
+exports.VStack = _VStack.default;
 var _default = exports.default = _Stack.default;

package/cjs/index.d.ts

@@ -167,8 +167,8 @@ export { default as Footer } from './Footer';
 export type { FooterProps } from './Footer';
 export { default as Divider } from './Divider';
 export type { DividerProps } from './Divider';
-export { default as Stack } from './Stack';
-export type { StackProps } from './Stack';
+export { default as Stack, HStack, VStack } from './Stack';
+export type { StackProps, HStackProps, VStackProps } from './Stack';
 export { default as Schema } from './Schema';
 export { default as Animation } from './Animation';
 export type { TransitionProps, SlideProps, CollapseProps, FadeProps, BounceProps } from './Animation';

package/cjs/index.js

@@ -3,7 +3,7 @@
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 exports.__esModule = true;
-exports.useToaster = exports.useMediaQuery = exports.useFormClassNames = exports.useBreakpointValue = exports.toaster = exports.Whisper = exports.VisuallyHidden = exports.Uploader = exports.TreePicker = exports.Tree = exports.Tooltip = exports.Toggle = exports.Timeline = exports.Text = exports.TagPicker = exports.TagInput = exports.TagGroup = exports.Tag = exports.Tabs = exports.Table = exports.Steps = exports.Stack = exports.Slider = exports.Sidenav = exports.Sidebar = exports.SelectPicker = exports.Schema = exports.SafeAnchor = exports.Row = exports.Rate = exports.RangeSlider = exports.RadioTileGroup = exports.RadioTile = exports.RadioGroup = exports.Radio = exports.Progress = exports.Popover = exports.Placeholder = exports.PanelGroup = exports.Panel = exports.Pagination = exports.Notification = exports.Navbar = exports.Nav = exports.MultiCascader = exports.MultiCascadeTree = exports.Modal = exports.Message = exports.MaskedInput = exports.Loader = exports.List = exports.InputPicker = exports.InputNumber = exports.InputGroup = exports.Input = exports.InlineEdit = exports.IconButton = exports.Highlight = exports.HeadingGroup = exports.Heading = exports.Header = exports.Grid = exports.Form = exports.Footer = exports.FlexboxGrid = exports.Dropdown = exports.Drawer = exports.Divider = exports.DateRangePicker = exports.DateRangeInput = exports.DatePicker = exports.DateInput = exports.DOMHelper = exports.CustomProvider = exports.Content = exports.Container = exports.Col = exports.CheckboxGroup = exports.Checkbox = exports.CheckTreePicker = exports.CheckTree = exports.CheckPicker = exports.Cascader = exports.CascadeTree = exports.Carousel = exports.Calendar = exports.ButtonToolbar = exports.ButtonGroup = exports.Button = exports.Breadcrumb = exports.Badge = exports.AvatarGroup = exports.Avatar = exports.AutoComplete = exports.Animation = exports.Affix = exports.Accordion = void 0;
+exports.useToaster = exports.useMediaQuery = exports.useFormClassNames = exports.useBreakpointValue = exports.toaster = exports.Whisper = exports.VisuallyHidden = exports.VStack = exports.Uploader = exports.TreePicker = exports.Tree = exports.Tooltip = exports.Toggle = exports.Timeline = exports.Text = exports.TagPicker = exports.TagInput = exports.TagGroup = exports.Tag = exports.Tabs = exports.Table = exports.Steps = exports.Stack = exports.Slider = exports.Sidenav = exports.Sidebar = exports.SelectPicker = exports.Schema = exports.SafeAnchor = exports.Row = exports.Rate = exports.RangeSlider = exports.RadioTileGroup = exports.RadioTile = exports.RadioGroup = exports.Radio = exports.Progress = exports.Popover = exports.Placeholder = exports.PanelGroup = exports.Panel = exports.Pagination = exports.Notification = exports.Navbar = exports.Nav = exports.MultiCascader = exports.MultiCascadeTree = exports.Modal = exports.Message = exports.MaskedInput = exports.Loader = exports.List = exports.InputPicker = exports.InputNumber = exports.InputGroup = exports.Input = exports.InlineEdit = exports.IconButton = exports.Highlight = exports.HeadingGroup = exports.Heading = exports.Header = exports.HStack = exports.Grid = exports.Form = exports.Footer = exports.FlexboxGrid = exports.Dropdown = exports.Drawer = exports.Divider = exports.DateRangePicker = exports.DateRangeInput = exports.DatePicker = exports.DateInput = exports.DOMHelper = exports.CustomProvider = exports.Content = exports.Container = exports.Col = exports.CheckboxGroup = exports.Checkbox = exports.CheckTreePicker = exports.CheckTree = exports.CheckPicker = exports.Cascader = exports.CascadeTree = exports.Carousel = exports.Calendar = exports.ButtonToolbar = exports.ButtonGroup = exports.Button = exports.Breadcrumb = exports.Badge = exports.AvatarGroup = exports.Avatar = exports.AutoComplete = exports.Animation = exports.Affix = exports.Accordion = void 0;
 var _Text = _interopRequireDefault(require("./Text"));
 exports.Text = _Text.default;
 var _Heading = _interopRequireDefault(require("./Heading"));
@@ -175,8 +175,10 @@ var _Footer = _interopRequireDefault(require("./Footer"));
 exports.Footer = _Footer.default;
 var _Divider = _interopRequireDefault(require("./Divider"));
 exports.Divider = _Divider.default;
-var _Stack = _interopRequireDefault(require("./Stack"));
+var _Stack = _interopRequireWildcard(require("./Stack"));
 exports.Stack = _Stack.default;
+exports.HStack = _Stack.HStack;
+exports.VStack = _Stack.VStack;
 var _Schema = _interopRequireDefault(require("./Schema"));
 exports.Schema = _Schema.default;
 var _Animation = _interopRequireDefault(require("./Animation"));

package/cjs/internals/types/index.d.ts

@@ -172,6 +172,7 @@ export declare namespace TypeAttributes {
     type PlacementAuto = 'auto' | 'autoVertical' | 'autoVerticalStart' | 'autoVerticalEnd' | 'autoHorizontal' | 'autoHorizontalStart' | 'autoHorizontalEnd';
     type Placement = Placement4 | Placement8 | PlacementAuto;
     type CheckTrigger = 'change' | 'blur' | 'none' | null;
+    type DisplayState = 'show' | 'hide' | 'hiding';
 }
 export interface SVGIcon {
     viewBox: string;

package/cjs/toaster/ToastContainer.d.ts

@@ -11,15 +11,24 @@ export interface ToastContainerProps extends WithAsProps {
     placement?: PlacementType;
     /**
      * Set the message to appear in the specified container
-     *
      */
     container?: HTMLElement | (() => HTMLElement);
-    /** The number of milliseconds to wait before automatically closing a message. */
+    /**
+     * The number of milliseconds to wait before automatically closing a message.
+     */
     duration?: number;
+    /**
+     * Reset the hide timer if the mouse moves over the message.
+     */
+    mouseReset?: boolean;
+    /**
+     * Callback fired when the component mounts
+     */
     callback?: (ref: React.RefObject<ToastContainerInstance>) => void;
 }
 interface PushOptions {
     duration?: number;
+    mouseReset?: boolean;
 }
 export interface ToastContainerInstance {
     root: HTMLElement;

package/cjs/toaster/ToastContainer.js

@@ -30,13 +30,19 @@ var useMessages = function useMessages() {
     return key;
   }, [messages]);
   var push = (0, _react.useCallback)(function (message, options) {
+    var _ref = options || {},
+      duration = _ref.duration,
+      _ref$mouseReset = _ref.mouseReset,
+      mouseReset = _ref$mouseReset === void 0 ? true : _ref$mouseReset;
     var key = (0, _utils.guid)();
     setMessages(function (prevMessages) {
-      return [].concat(prevMessages, [(0, _extends2.default)({
+      return [].concat(prevMessages, [{
         key: key,
         visible: true,
-        node: message
-      }, options)]);
+        node: message,
+        duration: duration,
+        mouseReset: mouseReset
+      }]);
     });
     return key;
   }, []);
@@ -107,8 +113,17 @@ var ToastContainer = /*#__PURE__*/_react.default.forwardRef(function (props, ref
     };
   });
   var elements = messages.map(function (item) {
-    return /*#__PURE__*/_react.default.createElement(_Transition.default, {
-      key: item.key,
+    var mouseReset = item.mouseReset,
+      duration = item.duration,
+      node = item.node;
+    return /*#__PURE__*/_react.default.createElement(_ToastContext.default.Provider, {
+      value: {
+        usedToaster: true,
+        mouseReset: mouseReset,
+        duration: duration
+      },
+      key: item.key
+    }, /*#__PURE__*/_react.default.createElement(_Transition.default, {
       in: item.visible,
       exitedClassName: rootPrefix('toast-fade-exited'),
       exitingClassName: rootPrefix('toast-fade-exiting'),
@@ -116,31 +131,26 @@ var ToastContainer = /*#__PURE__*/_react.default.forwardRef(function (props, ref
       enteredClassName: rootPrefix('toast-fade-entered'),
       timeout: 300
     }, function (transitionProps, ref) {
-      var _item$node, _item$node$props, _item$node2, _item$node2$props;
+      var _node$props, _node$props2;
       var transitionClassName = transitionProps.className,
         rest = (0, _objectWithoutPropertiesLoose2.default)(transitionProps, _excluded2);
-      return /*#__PURE__*/_react.default.cloneElement(item.node, (0, _extends2.default)({}, rest, {
+      return /*#__PURE__*/_react.default.cloneElement(node, (0, _extends2.default)({}, rest, {
         ref: ref,
-        duration: item.duration,
-        // Remove the message after the specified time.
-        onClose: (0, _utils.createChainedFunction)((_item$node = item.node) === null || _item$node === void 0 ? void 0 : (_item$node$props = _item$node.props) === null || _item$node$props === void 0 ? void 0 : _item$node$props.onClose, function () {
+        duration: duration,
+        onClose: (0, _utils.createChainedFunction)((_node$props = node.props) === null || _node$props === void 0 ? void 0 : _node$props.onClose, function () {
           return remove(item.key);
         }),
-        className: merge(rootPrefix('toast'), (_item$node2 = item.node) === null || _item$node2 === void 0 ? void 0 : (_item$node2$props = _item$node2.props) === null || _item$node2$props === void 0 ? void 0 : _item$node2$props.className, transitionClassName)
+        className: merge(rootPrefix('toast'), (_node$props2 = node.props) === null || _node$props2 === void 0 ? void 0 : _node$props2.className, transitionClassName)
       }));
-    });
+    }));
   });
-  return /*#__PURE__*/_react.default.createElement(_ToastContext.default.Provider, {
-    value: {
-      usedToaster: true
-    }
-  }, /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({}, rest, {
+  return /*#__PURE__*/_react.default.createElement(Component, (0, _extends2.default)({}, rest, {
     ref: function ref(selfRef) {
       rootRef.current = selfRef;
       callback === null || callback === void 0 ? void 0 : callback(selfRef);
     },
     className: classes
-  }), elements));
+  }), elements);
 });
 ToastContainer.getInstance = function (props) {
   var container = props.container,

package/cjs/toaster/ToastContext.d.ts

@@ -1,6 +1,8 @@
 import React from 'react';
 export interface ToastContextProps {
     usedToaster?: boolean;
+    duration?: number;
+    mouseReset?: boolean;
 }
 declare const ToastContext: React.Context<ToastContextProps>;
 export default ToastContext;