@algolia/satellite 1.10.1 → 1.11.0

package/dist/cjs/Navigation/Stepper/Step.js

@@ -17,7 +17,7 @@ var _uniqueId = require("../../utils/uniqueId");
 var _StepperContext = require("./StepperContext");
 var _jsxRuntime = require("react/jsx-runtime");
 var _excluded = ["className", "index", "icon", "label", "name", "completed", "disabled"];
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22, _templateObject23, _templateObject24, _templateObject25, _templateObject26, _templateObject27, _templateObject28, _templateObject29, _templateObject30, _templateObject31;
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22, _templateObject23, _templateObject24, _templateObject25, _templateObject26, _templateObject27, _templateObject28, _templateObject29, _templateObject30, _templateObject31, _templateObject32, _templateObject33, _templateObject34, _templateObject35, _templateObject36, _templateObject37, _templateObject38;
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var BUTTON_SIZE_CLASSNAMES = {
@@ -25,15 +25,20 @@ var BUTTON_SIZE_CLASSNAMES = {
   "default": (0, _satellitePrefixer["default"])(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["px-3 py-2.5"]))),
   large: (0, _satellitePrefixer["default"])(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["p-4"])))
 };
-var CONNECTOR_SIZE_CLASSNAMES = {
-  small: (0, _satellitePrefixer["default"])(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["left-5 top-7"]))),
-  "default": (0, _satellitePrefixer["default"])(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2["default"])(["left-6 top-7"]))),
-  large: (0, _satellitePrefixer["default"])(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2["default"])(["left-8 top-8"])))
+var CONNECTOR_VERTICAL_SIZE_CLASSNAMES = {
+  small: (0, _satellitePrefixer["default"])(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["h-[34px]"]))),
+  "default": (0, _satellitePrefixer["default"])(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2["default"])(["h-[37px]"]))),
+  large: (0, _satellitePrefixer["default"])(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2["default"])(["h-[41px]"])))
+};
+var CONNECTOR_HORIZONTAL_SIZE_CLASSNAMES = {
+  small: (0, _satellitePrefixer["default"])(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2["default"])(["w-[124px]"]))),
+  "default": (0, _satellitePrefixer["default"])(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2["default"])(["w-[120px]"]))),
+  large: (0, _satellitePrefixer["default"])(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2["default"])(["w-[112px]"])))
 };
 var ICON_SIZE_CLASSNAMES = {
-  small: (0, _satellitePrefixer["default"])(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2["default"])(["w-5 h-5"]))),
-  "default": (0, _satellitePrefixer["default"])(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2["default"])(["w-6 h-6"]))),
-  large: (0, _satellitePrefixer["default"])(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2["default"])(["w-8 h-8"])))
+  small: (0, _satellitePrefixer["default"])(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2["default"])(["w-5 h-5"]))),
+  "default": (0, _satellitePrefixer["default"])(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2["default"])(["w-6 h-6"]))),
+  large: (0, _satellitePrefixer["default"])(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteral2["default"])(["w-8 h-8"])))
 };
 var ICON_SIZE = {
   small: 12,
@@ -64,18 +69,16 @@ var Step = exports.Step = function Step(_ref) {
   var completedLocale = typeof locale.completedStep === "function" ? locale.completedStep(stepName) : locale.completedStep;
   var incompletedLocale = typeof locale.incompletedStep === "function" ? locale.incompletedStep(stepName) : locale.incompletedStep;
   var isVertical = context.orientation === "vertical";
-  var Icon = CustomIcon;
-  if (completed) {
-    Icon = CheckIconInternal;
-  }
+  var isHorizontal = context.orientation === "horizontal";
+  var Icon = completed && !active ? CheckIconInternal : CustomIcon;
   return /*#__PURE__*/(0, _jsxRuntime.jsx)("li", _objectSpread(_objectSpread({}, props), {}, {
-    className: (0, _clsx["default"])(className, (0, _satellitePrefixer["default"])(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2["default"])(["text-grey-600 group/step"])))),
+    className: (0, _clsx["default"])(className, (0, _satellitePrefixer["default"])(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteral2["default"])(["text-grey-600 group/step"])))),
     children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("button", {
       type: "button",
       id: buttonId,
-      className: (0, _clsx["default"])((0, _satellitePrefixer["default"])(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2["default"])(["relative w-full flex items-center text-left gap-2 rounded border group/button"]))), (0, _satellitePrefixer["default"])(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteral2["default"])(["focusable-visible !-outline-offset-2"]))),
-      // Avoid hover overlap
-      disabled ? (0, _satellitePrefixer["default"])(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteral2["default"])(["cursor-not-allowed"]))) : (0, _satellitePrefixer["default"])(_templateObject14 || (_templateObject14 = (0, _taggedTemplateLiteral2["default"])(["hover:bg-grey-100"]))), active ? (0, _satellitePrefixer["default"])(_templateObject15 || (_templateObject15 = (0, _taggedTemplateLiteral2["default"])(["border-grey-200 bg-white"]))) : (0, _satellitePrefixer["default"])(_templateObject16 || (_templateObject16 = (0, _taggedTemplateLiteral2["default"])(["border-transparent"]))), BUTTON_SIZE_CLASSNAMES[context.size]),
+      className: (0, _clsx["default"])((0, _satellitePrefixer["default"])(_templateObject14 || (_templateObject14 = (0, _taggedTemplateLiteral2["default"])(["relative w-full flex items-center text-left gap-2 rounded group/button"]))), (0, _satellitePrefixer["default"])(_templateObject15 || (_templateObject15 = (0, _taggedTemplateLiteral2["default"])(["focus-visible:outline-none"]))), (0, _satellitePrefixer["default"])(_templateObject16 || (_templateObject16 = (0, _taggedTemplateLiteral2["default"])(["before:absolute before:inset-0 before:z-20 before:rounded before:outline before:outline-2 before:-outline-offset-2 before:outline-transparent focus-visible:before:outline-accent-600"]))),
+      // Ensure focus outline is above the connector lines
+      isHorizontal && (0, _satellitePrefixer["default"])(_templateObject17 || (_templateObject17 = (0, _taggedTemplateLiteral2["default"])(["flex-col min-w-36"]))), disabled ? (0, _satellitePrefixer["default"])(_templateObject18 || (_templateObject18 = (0, _taggedTemplateLiteral2["default"])(["cursor-not-allowed"]))) : (0, _satellitePrefixer["default"])(_templateObject19 || (_templateObject19 = (0, _taggedTemplateLiteral2["default"])(["hover:bg-grey-100"]))), BUTTON_SIZE_CLASSNAMES[context.size]),
       "aria-label": disabled ? disabledLocale : active ? activeLocale : completed ? completedLocale : incompletedLocale,
       "aria-current": active ? "step" : undefined,
       disabled: disabled,
@@ -96,21 +99,21 @@ var Step = exports.Step = function Step(_ref) {
             }
         }
       },
-      children: [context.connectors && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-        className: (0, _clsx["default"])((0, _satellitePrefixer["default"])(_templateObject17 || (_templateObject17 = (0, _taggedTemplateLiteral2["default"])(["absolute -z-10 group-last/step:hidden"]))), isVertical ? (0, _satellitePrefixer["default"])(_templateObject18 || (_templateObject18 = (0, _taggedTemplateLiteral2["default"])(["border-l h-full"]))) : (0, _satellitePrefixer["default"])(_templateObject19 || (_templateObject19 = (0, _taggedTemplateLiteral2["default"])(["border-t w-4 -right-px translate-x-full"]))), completed ? (0, _satellitePrefixer["default"])(_templateObject20 || (_templateObject20 = (0, _taggedTemplateLiteral2["default"])(["border-green-600"]))) : (0, _satellitePrefixer["default"])(_templateObject21 || (_templateObject21 = (0, _taggedTemplateLiteral2["default"])(["border-grey-200"]))), isVertical && CONNECTOR_SIZE_CLASSNAMES[context.size])
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-        className: (0, _clsx["default"])((0, _satellitePrefixer["default"])(_templateObject22 || (_templateObject22 = (0, _taggedTemplateLiteral2["default"])(["rounded-full flex items-center justify-center shrink-0 text-sm"]))), !active && !completed && (0, _satellitePrefixer["default"])(_templateObject23 || (_templateObject23 = (0, _taggedTemplateLiteral2["default"])(["bg-grey-100"]))), !active && !completed && !disabled && (0, _satellitePrefixer["default"])(_templateObject24 || (_templateObject24 = (0, _taggedTemplateLiteral2["default"])(["group-hover/button:bg-white"]))), active && !completed && (0, _satellitePrefixer["default"])(_templateObject25 || (_templateObject25 = (0, _taggedTemplateLiteral2["default"])(["bg-grey-800 text-white"]))), completed && (0, _satellitePrefixer["default"])(_templateObject26 || (_templateObject26 = (0, _taggedTemplateLiteral2["default"])(["bg-green-600 text-white"]))), ICON_SIZE_CLASSNAMES[context.size]),
-        children: Icon ? /*#__PURE__*/(0, _jsxRuntime.jsx)(Icon, {
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
+        className: (0, _clsx["default"])((0, _satellitePrefixer["default"])(_templateObject20 || (_templateObject20 = (0, _taggedTemplateLiteral2["default"])(["rounded-full flex items-center justify-center shrink-0 text-sm relative z-10"]))), !active && !completed && (0, _satellitePrefixer["default"])(_templateObject21 || (_templateObject21 = (0, _taggedTemplateLiteral2["default"])(["bg-grey-100"]))), !active && !completed && !disabled && (0, _satellitePrefixer["default"])(_templateObject22 || (_templateObject22 = (0, _taggedTemplateLiteral2["default"])(["group-hover/button:bg-white"]))), active && (0, _satellitePrefixer["default"])(_templateObject23 || (_templateObject23 = (0, _taggedTemplateLiteral2["default"])(["bg-grey-800 text-white"]))), completed && (0, _satellitePrefixer["default"])(_templateObject24 || (_templateObject24 = (0, _taggedTemplateLiteral2["default"])(["bg-green-600 text-white"]))), ICON_SIZE_CLASSNAMES[context.size]),
+        children: [context.connectors && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+          className: (0, _clsx["default"])((0, _satellitePrefixer["default"])(_templateObject25 || (_templateObject25 = (0, _taggedTemplateLiteral2["default"])(["group-last/step:hidden absolute"]))), isVertical && (0, _satellitePrefixer["default"])(_templateObject26 || (_templateObject26 = (0, _taggedTemplateLiteral2["default"])(["w-px bottom-0 translate-y-full"]))), isHorizontal && (0, _satellitePrefixer["default"])(_templateObject27 || (_templateObject27 = (0, _taggedTemplateLiteral2["default"])(["h-px right-0 translate-x-full"]))), isVertical && CONNECTOR_VERTICAL_SIZE_CLASSNAMES[context.size], isHorizontal && CONNECTOR_HORIZONTAL_SIZE_CLASSNAMES[context.size], completed ? (0, _satellitePrefixer["default"])(_templateObject28 || (_templateObject28 = (0, _taggedTemplateLiteral2["default"])(["bg-green-600"]))) : (0, _satellitePrefixer["default"])(_templateObject29 || (_templateObject29 = (0, _taggedTemplateLiteral2["default"])(["bg-grey-200"]))))
+        }), Icon ? /*#__PURE__*/(0, _jsxRuntime.jsx)(Icon, {
           width: ICON_SIZE[context.size],
           height: ICON_SIZE[context.size]
-        }) : index + 1
+        }) : index + 1]
       }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-        className: (0, _clsx["default"])(disabled && (0, _satellitePrefixer["default"])(_templateObject27 || (_templateObject27 = (0, _taggedTemplateLiteral2["default"])(["text-grey-300"])))),
+        className: (0, _clsx["default"])(disabled && (0, _satellitePrefixer["default"])(_templateObject30 || (_templateObject30 = (0, _taggedTemplateLiteral2["default"])(["text-grey-300"]))), isHorizontal && (0, _satellitePrefixer["default"])(_templateObject31 || (_templateObject31 = (0, _taggedTemplateLiteral2["default"])(["text-center"])))),
         children: [!!label && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-          className: (0, _satellitePrefixer["default"])(_templateObject28 || (_templateObject28 = (0, _taggedTemplateLiteral2["default"])(["text-sm line-clamp-1"]))),
+          className: (0, _clsx["default"])((0, _satellitePrefixer["default"])(_templateObject32 || (_templateObject32 = (0, _taggedTemplateLiteral2["default"])(["text-sm line-clamp-1"]))), isHorizontal && !disabled && (0, _satellitePrefixer["default"])(_templateObject33 || (_templateObject33 = (0, _taggedTemplateLiteral2["default"])(["group-hover/button:text-grey-900"]))), disabled && (0, _satellitePrefixer["default"])(_templateObject34 || (_templateObject34 = (0, _taggedTemplateLiteral2["default"])(["text-grey-300"])))),
           children: label
         }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-          className: (0, _clsx["default"])((0, _satellitePrefixer["default"])(_templateObject29 || (_templateObject29 = (0, _taggedTemplateLiteral2["default"])(["text-base line-clamp-2"]))), (completed || active) && (0, _satellitePrefixer["default"])(_templateObject30 || (_templateObject30 = (0, _taggedTemplateLiteral2["default"])(["text-grey-900"]))), context.size === "small" && (0, _satellitePrefixer["default"])(_templateObject31 || (_templateObject31 = (0, _taggedTemplateLiteral2["default"])(["text-sm"])))),
+          className: (0, _clsx["default"])((0, _satellitePrefixer["default"])(_templateObject35 || (_templateObject35 = (0, _taggedTemplateLiteral2["default"])(["text-base line-clamp-2"]))), (completed || active) && (0, _satellitePrefixer["default"])(_templateObject36 || (_templateObject36 = (0, _taggedTemplateLiteral2["default"])(["text-grey-900"]))), isHorizontal && !disabled && (0, _satellitePrefixer["default"])(_templateObject37 || (_templateObject37 = (0, _taggedTemplateLiteral2["default"])(["group-hover/button:text-grey-900"]))), context.size === "small" && (0, _satellitePrefixer["default"])(_templateObject38 || (_templateObject38 = (0, _taggedTemplateLiteral2["default"])(["text-sm"])))),
           children: name
         })]
       })]

package/dist/cjs/Overlay/MenuButton/components/CustomTrigger.d.ts

@@ -1,4 +1,4 @@
 import type { DropdownMenuTriggerProps } from "@radix-ui/react-dropdown-menu";
-import type { FC } from "react";
+import { type FC } from "react";
 export declare type CustomTriggerProps = Omit<DropdownMenuTriggerProps, "asChild">;
 export declare const CustomTrigger: FC<CustomTriggerProps>;

package/dist/cjs/Overlay/MenuButton/components/CustomTrigger.js

@@ -7,17 +7,25 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.CustomTrigger = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _objectDestructuringEmpty2 = _interopRequireDefault(require("@babel/runtime/helpers/objectDestructuringEmpty"));
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var DropdownMenu = _interopRequireWildcard(require("@radix-ui/react-dropdown-menu"));
+var _react = require("react");
 var _jsxRuntime = require("react/jsx-runtime");
+var _excluded = ["children"];
 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; }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var CustomTrigger = exports.CustomTrigger = function CustomTrigger(_ref) {
-  var props = (0, _extends2["default"])({}, ((0, _objectDestructuringEmpty2["default"])(_ref), _ref));
+  var children = _ref.children,
+    props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
+  var childElement = _react.Children.only(children);
+  if (process.env.NODE_ENV !== "production" && typeof props.disabled !== "undefined" && typeof childElement.props.disabled !== "undefined" && props.disabled !== childElement.props.disabled) {
+    console.warn("'disabled' prop is defined for both MenuButton.CustomTrigger and its child with different values. The disabled prop value from child element will take precedence.");
+  }
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(DropdownMenu.Trigger, _objectSpread(_objectSpread({}, props), {}, {
-    asChild: true
+    disabled: childElement.props.disabled,
+    asChild: true,
+    children: children
   }));
 };

package/dist/cjs/Overlay/Popover/types.d.ts

@@ -73,6 +73,10 @@ interface PopoverPropsBase extends Omit<HTMLAttributes<HTMLDivElement>, "title"
      * Defines the locale of the `Popover`.
      */
     locale?: PopoverLocale;
+    /**
+     * Used to force mounting when more control is needed.
+     */
+    forceMount?: true | undefined;
 }
 declare type PopoverPropsWithTitle = {
     /**

package/dist/cjs/Overlay/Tooltip/types.d.ts

@@ -61,5 +61,8 @@ export interface TooltipWrapperBaseProps {
      * @default true
      */
     avoidCollisions?: boolean;
+    /**
+     * The content of the `Tooltip`.
+     */
     children: ReactElement | ReactText;
 }

package/dist/cjs/Satellite/locale.d.ts

@@ -1,5 +1,5 @@
 import type { UserAvatarLocale } from "../Avatars";
-import type { AutoCompleteLocale, DatePickerLocale, DropzoneLocale, ExperimentalFormLocale, InputPropsLocale } from "../Fields";
+import type { AutoCompleteLocale, DateInputLocale, DatePickerLocale, DropzoneLocale, ExperimentalFormLocale, InputPropsLocale } from "../Fields";
 import type { AnnouncementBadgeLocale, TagLocale, ToastLocale, ToastsLocale } from "../Indicators";
 import type { DataTableLocale, SidebarLocale } from "../Layout";
 import type { CompactPaginationLocale, DotPaginationLocale, PaginationLocale, StepperLocale } from "../Navigation";
@@ -8,6 +8,7 @@ export declare type ComponentsLocales = {
     announcementBadge?: AnnouncementBadgeLocale;
     autoComplete?: AutoCompleteLocale;
     compactPagination?: CompactPaginationLocale;
+    dateInput?: DateInputLocale;
     dataTable?: DataTableLocale;
     datePicker?: DatePickerLocale;
     dotPagination?: DotPaginationLocale;

package/dist/esm/Actions/Accordion/Accordion.d.ts

@@ -2,34 +2,37 @@ import * as RadixAccordion from "@radix-ui/react-accordion";
 import type { ReactNode, VFC } from "react";
 import type { IconComponentType } from "../../Icons";
 declare type AccordionSharedProps = {
+    /**
+     * The content of the `Accordion`.
+     */
     children: ReactNode;
     /**
-     * Defines a class name for the `Accordion`.
+     * The class name of the `Accordion`.
      */
     className?: string;
     /**
-     * Defines whether the `Accordion` is disabled, preventing the user from interacting with the accordion and all its items.
+     * Whether the `Accordion` is disabled, preventing the user from interacting with the accordion and all its items.
      */
     disabled?: boolean;
 };
 declare type AccordionSingleProps = {
     /**
-     * Defines whether a single or multiple items can be expanded at a time.
+     * Whether a single or multiple items can be expanded at a time.
      * @default false
      */
     multiple?: false;
     /**
-     * Defines the controlled value of the item to expand when `multiple` is `false`.
+     * The controlled value of the item to expand when `multiple` is `false`.
      * Must be used in conjunction with `onValueChange`.
      */
     value?: RadixAccordion.AccordionSingleProps["value"];
     /**
-     * Defines the value of the item to expand when initially rendered and `multiple` is `false`.
+     * The value of the item to expand when initially rendered and `multiple` is `false`.
      * Use when you do not need to control the state of the items.
      */
     defaultValue?: RadixAccordion.AccordionSingleProps["defaultValue"];
     /**
-     * Defines the event handler called when the expanded state of an item changes and `multiple` is `false`.
+     * The event handler called when the expanded state of an item changes and `multiple` is `false`.
      */
     onChange?: RadixAccordion.AccordionSingleProps["onValueChange"];
     /**
@@ -40,22 +43,22 @@ declare type AccordionSingleProps = {
 };
 declare type AccordionMultipleProps = {
     /**
-     * Defines whether a single or multiple items can be expanded at a time.
+     * Whether a single or multiple items can be expanded at a time.
      * @default false
      */
     multiple: true;
     /**
-     * Defines the controlled value of the item to expand when `multiple` is `true`.
+     * The controlled value of the item to expand when `multiple` is `true`.
      * Must be used in conjunction with `onValueChange`.
      */
     value?: RadixAccordion.AccordionMultipleProps["value"];
     /**
-     * Defines the value of the item to expand when initially rendered when `multiple` is `true`.
+     * The value of the item to expand when initially rendered when `multiple` is `true`.
      * Use when you do not need to control the state of the items.
      */
     defaultValue?: RadixAccordion.AccordionMultipleProps["defaultValue"];
     /**
-     * Defines the event handler called when the expanded state of an item changes and `multiple` is `true`.
+     * The event handler called when the expanded state of an item changes and `multiple` is `true`.
      */
     onChange?: RadixAccordion.AccordionMultipleProps["onValueChange"];
     /**
@@ -65,27 +68,30 @@ declare type AccordionMultipleProps = {
 };
 export declare type AccordionProps = AccordionSharedProps & (AccordionSingleProps | AccordionMultipleProps);
 export declare type AccordionItemProps = {
+    /**
+     * Defines the content of the `AccordionItem`.
+     */
     children: ReactNode;
     /**
-     * Defines a class name for the item.
+     * Defines a class name for the `AccordionItem`.
      */
     className?: string;
     /**
-     * Defines a unique value for the item.
+     * Defines a unique value for the `AccordionItem`.
      */
     value: string;
     /**
-     * Defines whether the item is disabled, preventing the user from interacting with the item.
+     * Defines whether the `AccordionItem` is disabled, preventing the user from interacting with it.
      */
     disabled?: boolean;
 };
 export declare type AccordionHeaderProps = {
     /**
-     * Defines the title of the header.
+     * Defines the title of the `AccordionHeader`.
      */
     children: ReactNode;
     /**
-     * Defines a class name for the header.
+     * Defines a class name for the `AccordionHeader`.
      */
     className?: string;
     /**
@@ -101,11 +107,11 @@ export declare type AccordionHeaderProps = {
      */
     iconBgClassName?: string;
     /**
-     * Defines a description for the header.
+     * Defines a description for the `AccordionHeader`.
      */
     description?: ReactNode;
     /**
-     * Defines a meta value for the header.
+     * Defines a meta value for the `AccordionHeader`.
      */
     meta?: ReactNode;
     /**
@@ -119,9 +125,12 @@ export declare type AccordionHeaderProps = {
     triggerClassName?: string;
 };
 export declare type AccordionContentProps = {
+    /**
+     * Defines the content of the `AccordionContent`.
+     */
     children: ReactNode;
     /**
-     * Defines a class name for the content.
+     * Defines a class name for the `AccordionContent`.
      */
     className?: string;
 };

package/dist/esm/Actions/Button/Button.tailwind.js

@@ -1,10 +1,6 @@
-import _rgba from "../../styles/rgba";
-import _disabledColor from "../../styles/disabledColor";
 import _plugin from "tailwindcss/plugin";
 // @ts-check
 var plugin = _plugin;
-var disabledColor = _disabledColor;
-var rgba = _rgba;
 var buttonPlugin = plugin(function (_ref) {
   var addComponents = _ref.addComponents,
     theme = _ref.theme;
@@ -25,83 +21,58 @@ var buttonPlugin = plugin(function (_ref) {
     ".btn-subtle": {
       color: theme("colors.accent.600"),
       "&:hover": {
-        backgroundColor: rgba(theme("colors.grey.300"), 0.15)
+        backgroundColor: theme("colors.grey.100")
       },
       "&:active, &.btn-active": {
-        color: theme("colors.accent.600"),
-        backgroundColor: theme("colors.accent.100"),
-        boxShadow: "none"
+        backgroundColor: theme("colors.grey.200")
       },
       "&:disabled, &.btn-disabled": {
         background: "none",
-        boxShadow: "none",
         color: theme("colors.grey.300")
       }
     },
     ".btn-neutral": {
       color: theme("colors.grey.900"),
       backgroundColor: theme("colors.white"),
-      backgroundImage: "linear-gradient(-180deg, ".concat(theme("colors.white"), " 0%, ").concat(theme("colors.grey.50"), " 100%)"),
       border: "1px solid ".concat(theme("colors.grey.200")),
-      boxShadow: "0 1px 0 0 ".concat(theme("colors.shadow.5")),
       "&:hover": {
-        backgroundImage: "linear-gradient(-180deg, ".concat(theme("colors.white"), " 0%, ").concat(theme("colors.grey.100"), " 100%)"),
-        borderColor: theme("colors.grey.200")
+        backgroundColor: theme("colors.grey.100")
+      },
+      "&:focus-visible": {
+        borderColor: "transparent"
       },
       "&:active, &.btn-active": {
-        borderColor: theme("colors.grey.200"),
-        boxShadow: "\n          inset 0 1px 4px 0 ".concat(rgba(theme("colors.grey.500"), 0.4), ",\n          inset 0 1px 1px 0 ").concat(rgba(theme("colors.grey.500"), 0.4), ",\n          0 1px 0 0 ").concat(theme("colors.shadow.5"), "\n        ")
+        backgroundColor: theme("colors.grey.200")
       },
       "&:disabled, &.btn-disabled": {
-        backgroundImage: "linear-gradient(-180deg, ".concat(theme("colors.white"), " 0%, ").concat(theme("colors.grey.100"), " 100%)"),
-        borderColor: disabledColor(theme("colors.grey.200")),
-        color: theme("colors.grey.300"),
-        boxShadow: "none"
+        backgroundColor: theme("colors.grey.50"),
+        color: theme("colors.grey.300")
       }
     },
     ".btn-primary": {
       color: theme("colors.white"),
       backgroundColor: theme("colors.accent.600"),
-      backgroundImage: "linear-gradient(-180deg, ".concat(theme("colors.accent.600"), " 0%, ").concat(theme("colors.accent.700"), " 100%)"),
-      border: "1px solid ".concat(theme("colors.accent.700")),
-      boxShadow: "\n        inset 0 1px 0 0 ".concat(rgba(theme("colors.white"), 0.06), ",\n        0 1px 0 0 ").concat(theme("colors.shadow.10"), "\n      "),
       "&:hover": {
-        borderColor: theme("colors.accent.800"),
-        backgroundImage: "linear-gradient(0deg, ".concat(theme("colors.accent.800"), " 0%, ").concat(theme("colors.accent.700"), " 100%)"),
-        boxShadow: "\n          inset 0 1px 0 0 ".concat(rgba(theme("colors.white"), 0.06), ",\n          0 1px 0 0 ").concat(theme("colors.shadow.10"), "\n        ")
+        backgroundColor: theme("colors.accent.700")
       },
       "&:active, &.btn-active": {
-        backgroundColor: theme("colors.accent.700"),
-        borderColor: theme("colors.accent.800"),
-        boxShadow: "\n          inset 0 1px 4px 0 ".concat(rgba(theme("colors.accent.900"), 0.4), ",\n          inset 0 1px 1px 0 ").concat(rgba(theme("colors.accent.900"), 0.6), ",\n          0 1px 0 0 ").concat(theme("colors.shadow.5"), "\n        ")
+        backgroundColor: theme("colors.accent.800")
       },
       "&:disabled, &.btn-disabled": {
-        backgroundColor: disabledColor(theme("colors.accent.600")),
-        backgroundImage: "\n          linear-gradient(0deg, ".concat(disabledColor(theme("colors.accent.600")), " 0%,\n          ").concat(disabledColor(theme("colors.accent.700")), " 100%)\n        "),
-        borderColor: disabledColor(theme("colors.accent.700")),
-        boxShadow: "none"
+        backgroundColor: theme("colors.accent.200")
       }
     },
     ".btn-destructive": {
       color: theme("colors.white"),
       backgroundColor: theme("colors.red.600"),
-      backgroundImage: "linear-gradient(-180deg, ".concat(theme("colors.red.600"), " 0%, ").concat(theme("colors.red.700"), " 100%)"),
-      border: "1px solid ".concat(theme("colors.red.700")),
-      boxShadow: "\n        inset 0 1px 0 0 ".concat(rgba(theme("colors.white"), 0.06), ",\n        0 1px 0 0 ").concat(theme("colors.shadow.10"), "\n      "),
       "&:hover": {
-        backgroundImage: "linear-gradient(0deg, ".concat(theme("colors.red.700"), " 0%, ").concat(theme("colors.red.800"), " 100%)"),
-        borderColor: theme("colors.red.800"),
-        boxShadow: "\n          inset 0 1px 0 0 ".concat(rgba(theme("colors.white"), 0.06), ",\n          0 1px 0 0 ").concat(theme("colors.shadow.10"), "\n        ")
+        backgroundColor: theme("colors.red.700")
       },
       "&:active, &.btn-active": {
-        borderColor: theme("colors.red.800"),
-        boxShadow: "\n          inset 0 1px 4px 0 ".concat(rgba(theme("colors.red.900"), 0.4), ",\n          inset 0 1px 1px 0 ").concat(rgba(theme("colors.red.900"), 0.6), ",\n          0 1px 0 0 ").concat(theme("colors.shadow.5"), "\n        ")
+        backgroundColor: theme("colors.red.800")
       },
       "&:disabled, &.btn-disabled": {
-        backgroundColor: disabledColor(theme("colors.red.600")),
-        backgroundImage: "\n          linear-gradient(0deg, ".concat(disabledColor(theme("colors.red.600")), " 0%,\n          ").concat(disabledColor(theme("colors.red.700")), " 100%)\n        "),
-        borderColor: disabledColor(theme("colors.red.700")),
-        boxShadow: "none"
+        backgroundColor: theme("colors.red.300")
       }
     }
   });
@@ -114,6 +85,18 @@ var buttonPlugin = plugin(function (_ref) {
       "& > .btn:not(:first-child):not(:last-child), & > :not(:first-child):not(:last-child) .btn": {
         borderRadius: "0px"
       },
+      "& > .btn-destructive:not(:first-child), & > :not(:first-child) .btn-destructive": {
+        borderLeft: "1px solid ".concat(theme("colors.red.700"))
+      },
+      "& > .btn-destructive:not(:last-child), & > :not(:last-child) .btn-destructive": {
+        borderRight: "1px solid ".concat(theme("colors.red.700"))
+      },
+      "& > .btn-primary:not(:first-child), & > :not(:first-child) .btn-primary": {
+        borderLeft: "1px solid ".concat(theme("colors.accent.700"))
+      },
+      "& > .btn-primary:not(:last-child), & > :not(:last-child) .btn-primary": {
+        borderRight: "1px solid ".concat(theme("colors.accent.700"))
+      },
       "& > .btn:first-child, & > :first-child .btn": {
         borderTopRightRadius: "0px",
         borderBottomRightRadius: "0px"

package/dist/esm/Actions/Button/PolymorphicIconButton.d.ts

@@ -3,19 +3,48 @@ import type { IconComponentType } from "../../Icons";
 import type { TooltipWrapperBaseProps } from "../../Overlay/Tooltip/types";
 import type { ButtonSize, ButtonVariant, PolymorphicComponentPropWithRef } from "./types";
 export interface IconButtonBaseProps {
-    /** @default neutral */
+    /**
+     * The variant of the `IconButton`.
+     * @default neutral
+     */
     variant?: ButtonVariant;
-    /** @default medium */
+    /**
+     * The size of the `IconButton`.
+     * @default medium
+     */
     size?: ButtonSize;
-    /** @default false */
+    /**
+     * Whether the `IconButton` is disabled.
+     * @default false
+     */
     disabled?: boolean;
+    /**
+     * The icon to display.
+     */
     icon: IconComponentType;
+    /**
+     * The title used for the tooltip.
+     */
     title: string;
+    /**
+     * Whether to show the tooltip.
+     * @default false
+     */
     showTooltip?: boolean;
-    /** @default top */
+    /**
+     * The side of the tooltip.
+     * @default top
+     */
     tooltipSide?: TooltipWrapperBaseProps["side"];
-    /** @default false */
+    /**
+     * Whether the `IconButton` is loading.
+     * @default false
+     */
     loading?: boolean;
+    /**
+     * The class name of the `IconButton`.
+     */
+    className?: string;
 }
 export declare type PolymorphicIconButtonProps<C extends React.ElementType> = PolymorphicComponentPropWithRef<C, IconButtonBaseProps>;
 declare type PolymorphicIconButtonComponent = (<C extends React.ElementType = "button">(props: PolymorphicIconButtonProps<C>) => React.ReactElement | null) & {

package/dist/esm/Actions/Button/types.d.ts

@@ -1,23 +1,44 @@
 import type { ReactNode } from "react";
 import type { IconComponentType } from "../../Icons";
 export declare type ButtonVariant = "subtle" | "neutral" | "primary" | "destructive";
-export declare type ButtonSize = "small" | "medium" | "large";
+export declare const buttonSizes: readonly ["small", "medium", "large"];
+export declare type ButtonSize = (typeof buttonSizes)[number];
 export interface ButtonBaseProps {
-    /** @default neutral */
+    /**
+     * The variant of the `Button`.
+     * @default neutral
+     */
     variant?: ButtonVariant;
-    /** @default medium */
+    /**
+     * The size of the `Button`.
+     * @default medium
+     */
     size?: ButtonSize;
-    /** Left aligned icon */
+    /**
+     * The left aligned icon of the `Button`.
+     */
     startIcon?: IconComponentType;
-    /** Right aligned icon */
+    /**
+     * The right aligned icon of the `Button`.
+     */
     endIcon?: IconComponentType;
-    /** @ignore */
+    /**
+     * The content of the `Button`.
+     */
     children: ReactNode;
-    /** @default false */
+    /**
+     * Whether the `Button` is loading.
+     * @default false
+     */
     loading?: boolean;
-    /** @ignore */
+    /**
+     * Whether the `Button` is disabled.
+     * @default false
+     */
     disabled?: boolean;
-    /** @ignore */
+    /**
+     * The class name of the `Button`.
+     */
     className?: string;
 }
 export declare function isButtonType(props: any): props is JSX.IntrinsicElements["button"];

package/dist/esm/Actions/Button/types.js

@@ -1,3 +1,4 @@
+export var buttonSizes = ["small", "medium", "large"];
 export function isButtonType(props) {
   return props && (!props.as || props.as === "button");
 }

package/dist/esm/Actions/ButtonGroup/ButtonGroup.d.ts

@@ -5,8 +5,13 @@ export interface ButtonGroupProps {
      * @default div
      */
     as?: keyof JSX.IntrinsicElements;
-    /** @ignore */
+    /**
+     * The class name of the `ButtonGroup`.
+     */
     className?: string;
+    /**
+     * The content of the `ButtonGroup`.
+     */
     children: ReactNode;
 }
 /**

package/dist/esm/Actions/Switch/Switch.d.ts

@@ -1,13 +1,33 @@
 import type { ReactNode, VFC } from "react";
 import type { SwitchSize } from "./types";
 export interface SwitchProps {
-    /** @ignore */
+    /**
+     * The class name of the `Switch`.
+     */
     className?: string;
+    /**
+     * The currently selected value.
+     */
     value: string;
+    /**
+     * Whether the `Switch` is disabled.
+     */
     disabled?: boolean;
+    /**
+     * Callback function called when the selected value changes.
+     */
     onChange: (value: string) => void;
+    /**
+     * The content of the `Switch`.
+     */
     children: ReactNode;
+    /**
+     * The size of the `Switch`.
+     */
     size?: SwitchSize;
+    /**
+     * Optional name attribute for the radio inputs.
+     */
     name?: string;
 }
 /**