@algolia/satellite 1.0.0-beta.133 → 1.0.0-beta.136

package/esm/DatePicker/DatePicker.tailwind.js

@@ -1,17 +1,22 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-
-/**
- * @type {import('../tailwind-types').TailwindPlugin}
- */
-var datePickerPlugin = function datePickerPlugin(_ref) {
+import _plugin from "tailwindcss/plugin";
+// @ts-check
+var plugin = _plugin;
+var datePickerPlugin = plugin(function (_ref) {
   var _DayPickerDay, _DayPickerDay3, _addComponents;
 
   var addComponents = _ref.addComponents,
       theme = _ref.theme,
       prefix = _ref.prefix;
+
+  /** @type {string} */
   var defaultRadius = theme("borderRadius.DEFAULT");
-  var nebula600 = theme("colors.nebula.600");
-  var nebula200 = theme("colors.nebula.200");
+  /** @type {string} */
+
+  var accent600 = theme("colors.accent.600");
+  /** @type {string} */
+
+  var accent200 = theme("colors.accent.200");
 
   var not = function not() {
     for (var _len = arguments.length, modifiers = new Array(_len), _key = 0; _key < _len; _key++) {
@@ -51,13 +56,13 @@ var datePickerPlugin = function datePickerPlugin(_ref) {
         position: "absolute",
         backgroundColor: theme("colors.blue.200"),
         border: "1px solid ".concat(theme("colors.blue.300")),
-        borderRadius: 9999,
-        width: 32,
-        height: 32,
+        borderRadius: "9999px",
+        width: "32px",
+        height: "32px",
         left: "50%",
         top: "50%",
         transform: "translate(-50%, -50%)",
-        zIndex: -1
+        zIndex: "-1"
       }
     }), _defineProperty(_DayPickerDay, "&--selected".concat(not("outside")), {
       color: theme("colors.white")
@@ -66,22 +71,22 @@ var datePickerPlugin = function datePickerPlugin(_ref) {
     ".DayPicker-Day": _defineProperty({
       borderRadius: defaultRadius,
       "&--today": {
-        color: nebula600
+        color: accent600
       }
     }, "&--selected".concat(not("outside")), {
-      backgroundColor: nebula600,
+      backgroundColor: accent600,
       "&:hover": {
-        backgroundColor: nebula600
+        backgroundColor: accent600
       }
     })
   }, "&--selected".concat(not("outside")), {
-    backgroundColor: nebula600,
+    backgroundColor: accent600,
     "&:hover": {
-      backgroundColor: nebula600
+      backgroundColor: accent600
     }
   })), _defineProperty(_addComponents, prefix(".date-range-picker"), {
     "& .DayPicker-Day": (_DayPickerDay3 = {}, _defineProperty(_DayPickerDay3, "&--displayedRanges".concat(not("outside")), {
-      borderRadius: 0,
+      borderRadius: "0px",
       backgroundColor: theme("colors.grey.200")
     }), _defineProperty(_DayPickerDay3, "&--displayedRangesStart".concat(not("outside")), {
       color: theme("colors.white"),
@@ -95,33 +100,32 @@ var datePickerPlugin = function datePickerPlugin(_ref) {
       borderBottomRightRadius: defaultRadius
     }), _defineProperty(_DayPickerDay3, "&--selected".concat(not("outside")), {
       color: theme("colors.black"),
-      borderRadius: 0,
-      backgroundColor: nebula200,
+      borderRadius: "0px",
+      backgroundColor: accent200,
       "&:hover": {
-        backgroundColor: nebula200
+        backgroundColor: accent200
       }
     }), _defineProperty(_DayPickerDay3, "&--start".concat(not("outside")), {
       color: theme("colors.white"),
-      borderRadius: 0,
+      borderRadius: "0px",
       borderTopLeftRadius: defaultRadius,
       borderBottomLeftRadius: defaultRadius,
-      backgroundColor: nebula600,
+      backgroundColor: accent600,
       "&:hover": {
-        backgroundColor: nebula600
+        backgroundColor: accent600
       }
     }), _defineProperty(_DayPickerDay3, "&--end".concat(not("outside")), {
       color: theme("colors.white"),
-      borderRadius: 0,
+      borderRadius: "0px",
       borderTopRightRadius: defaultRadius,
       borderBottomRightRadius: defaultRadius,
-      backgroundColor: nebula600,
+      backgroundColor: accent600,
       "&:hover": {
-        backgroundColor: nebula600
+        backgroundColor: accent600
       }
     }), _DayPickerDay3)
   }), _addComponents), {
     respectPrefix: false
   });
-};
-
+});
 export default datePickerPlugin;

package/esm/DatePicker/DateRangePicker/DateRangePicker.js

@@ -1,7 +1,7 @@
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
 
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
 
@@ -12,12 +12,14 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
 import { useMemo, useReducer, useState } from "react";
+import { useLocale } from "../../Satellite";
 import stl from "../../styles/helpers/satellitePrefixer";
 import Calendar from "../components/Calendar";
 import Footer from "../components/Footer";
 import FooterActions from "../components/FooterActions";
 import Modal from "../components/Modal";
 import SidePanel from "../components/SidePanel";
+import { DEFAULT_DATE_PICKER_LOCALE } from "../utils";
 import DateRangePickerDisplay from "./DateRangePickerDisplay";
 import { DateRangePickerActionTypes, dateRangePickerReducer, initDateRangePickerReducer } from "./dateRangePickerReducer";
 import { isCompleteTimeRange, isEmptyTimeRange } from "./dateRangePickerTimeRange";
@@ -30,6 +32,10 @@ var defaultValidator = function defaultValidator(_ref) {
   return isCompleteTimeRange(candidateRange) ? null : [new Error("Invalid time range")];
 };
 
+var DEFAULT_DATE_RANGE_PICKER_LOCALE = _objectSpread(_objectSpread({}, DEFAULT_DATE_PICKER_LOCALE), {}, {
+  openButton: "Enter a date period..."
+});
+
 var DateRangePicker = function DateRangePicker(_ref2) {
   var _validate, _displayedRange$start, _displayedRange$start2, _displayedRange$end, _displayOnlyRanges$ma, _state$hovered;
 
@@ -50,9 +56,13 @@ var DateRangePicker = function DateRangePicker(_ref2) {
       renderRightPanel = _ref2.renderRightPanel,
       buttonSize = _ref2.buttonSize,
       modalPlacement = _ref2.modalPlacement,
-      locale = _ref2.locale,
+      propsLocale = _ref2.locale,
       props = _objectWithoutProperties(_ref2, _excluded);
 
+  var contextLocale = useLocale("datePicker");
+
+  var locale = _objectSpread(_objectSpread(_objectSpread({}, DEFAULT_DATE_RANGE_PICKER_LOCALE), contextLocale), propsLocale);
+
   var _useState = useState(null),
       _useState2 = _slicedToArray(_useState, 2),
       targetElement = _useState2[0],

package/esm/DatePicker/DateRangePicker/DateRangePickerDisplay.d.ts

@@ -1,4 +1,5 @@
 import type { FunctionComponent } from "react";
+import type { WithRequiredProperty } from "../../types";
 import { DisplayProps } from "../components/Display";
 import type { DatePickerLocale } from "../types";
 import { DateRangePickerTimeRange } from "./dateRangePickerTimeRange";
@@ -7,7 +8,7 @@ export interface DateRangePickerDisplayProps {
     onClick: DisplayProps["onClick"];
     range: DateRangePickerTimeRange;
     buttonSize?: DisplayProps["size"];
-    locale?: DatePickerLocale;
+    locale: WithRequiredProperty<DatePickerLocale, "openButton">;
 }
 declare const DateRangePickerDisplay: FunctionComponent<DateRangePickerDisplayProps>;
 export default DateRangePickerDisplay;

package/esm/DatePicker/DateRangePicker/DateRangePickerDisplay.js

@@ -30,7 +30,7 @@ var DateRangePickerDisplay = function DateRangePickerDisplay(_ref) {
         dateTime: range.end.toISOString(),
         children: formatDate(range.end)
       })]
-    }) : (locale === null || locale === void 0 ? void 0 : locale.openButton) || "Enter a date period..."
+    }) : locale.openButton
   });
 };
 

package/esm/DatePicker/components/Calendar.d.ts

@@ -1,5 +1,6 @@
 import type { FunctionComponent } from "react";
 import { DayPickerProps } from "react-day-picker";
+import type { WithRequiredProperty } from "../../types";
 import type { DatePickerLocale } from "../types";
 declare type ExcludedDayPickerProps = "captionElement" | "showOutsideDays" | "enableOutsideDaysClick" | "fixedWeeks" | "labels" | "navbarElement" | "onTodayButtonClick" | "pagedNavigation" | "renderDay" | "renderWeek" | "reverseMonths" | "showWeekNumbers" | "showWeekDays" | "todayButton" | "weekdayElement" | "weekdaysLong" | "weekdaysShort";
 export declare type EditableYearProps = {
@@ -10,7 +11,7 @@ export declare type EditableYearProps = {
     initialDate?: Date;
 };
 export declare type CalendarProps = Omit<Omit<DayPickerProps, "locale">, ExcludedDayPickerProps> & EditableYearProps & {
-    locale?: DatePickerLocale;
+    locale: WithRequiredProperty<DatePickerLocale, "nextMonth" | "previousMonth">;
 };
 declare const Calendar: FunctionComponent<CalendarProps>;
 export default Calendar;

package/esm/DatePicker/components/FooterActions.d.ts

@@ -1,11 +1,12 @@
 import type { FunctionComponent } from "react";
 import { ButtonProps } from "../../Button";
+import type { WithRequiredProperty } from "../../types";
 import type { DatePickerLocale } from "../types";
 export interface FooterActionsProps {
     onCancel: ButtonProps["onClick"];
     onApply: ButtonProps["onClick"];
     disableApply: boolean;
-    locale?: DatePickerLocale;
+    locale: WithRequiredProperty<DatePickerLocale, "cancel" | "apply">;
 }
 declare const FooterActions: FunctionComponent<FooterActionsProps>;
 export default FooterActions;

package/esm/DatePicker/components/FooterActions.js

@@ -17,12 +17,12 @@ var FooterActions = function FooterActions(_ref) {
     children: [/*#__PURE__*/_jsx(Button, {
       onClick: onCancel,
       className: stl(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["mr-2"]))),
-      children: (locale === null || locale === void 0 ? void 0 : locale.cancel) || "Cancel"
+      children: locale.cancel
     }), /*#__PURE__*/_jsx(Button, {
       disabled: disableApply,
       onClick: onApply,
       variant: "primary",
-      children: (locale === null || locale === void 0 ? void 0 : locale.apply) || "Apply"
+      children: locale.apply
     })]
   });
 };

package/esm/DatePicker/components/Modal.js

@@ -9,11 +9,11 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
 
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
-import cx from "classnames";
+import cx from "clsx";
 import { useState } from "react";
-import { createPortal } from "react-dom";
 import { usePopper } from "react-popper";
 import { ClickAwayContainer } from "../../ClickAwayContainer";
+import { useCreatePortal } from "../../Satellite";
 import stl from "../../styles/helpers/satellitePrefixer";
 import { jsx as _jsx } from "react/jsx-runtime";
 export var DEFAULT_DATE_PICKER_MODAL_POPPER_MODIFIERS = [{
@@ -33,6 +33,7 @@ var Modal = function Modal(_ref) {
       _ref$modifiers = _ref.modifiers,
       modifiers = _ref$modifiers === void 0 ? [] : _ref$modifiers,
       className = _ref.className;
+  var createPortal = useCreatePortal();
 
   var _useState = useState(null),
       _useState2 = _slicedToArray(_useState, 2),
@@ -51,7 +52,7 @@ var Modal = function Modal(_ref) {
     return null;
   }
 
-  return /*#__PURE__*/createPortal( /*#__PURE__*/_jsx(ClickAwayContainer, {
+  return createPortal( /*#__PURE__*/_jsx(ClickAwayContainer, {
     element: datePickerElement,
     onClickAway: function onClickAway(evt) {
       return _onClickAway === null || _onClickAway === void 0 ? void 0 : _onClickAway(evt);
@@ -63,7 +64,7 @@ var Modal = function Modal(_ref) {
       style: styles.popper,
       children: children
     }))
-  }), document.body);
+  }));
 };
 
 export default Modal;

package/esm/DatePicker/components/NavBar.d.ts

@@ -1,5 +1,6 @@
 import type { FunctionComponent } from "react";
 import type { NavbarElementProps } from "react-day-picker";
+import type { WithRequiredProperty } from "../../types";
 import type { DatePickerLocale } from "../types";
 export declare type NavBarYearProps = {
     editableYear?: false;
@@ -9,7 +10,7 @@ export declare type NavBarYearProps = {
     onYearChange: (year: number) => void;
 };
 export declare type NavBarProps = Omit<NavbarElementProps, "locale"> & NavBarYearProps & {
-    locale?: DatePickerLocale;
+    locale: WithRequiredProperty<DatePickerLocale, "nextMonth" | "previousMonth">;
 };
 declare const NavBar: FunctionComponent<NavBarProps>;
 export default NavBar;

package/esm/DatePicker/components/NavBar.js

@@ -5,7 +5,7 @@ import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProper
 var _templateObject, _templateObject2, _templateObject3, _templateObject4;
 
 var _excluded = ["onPreviousClick", "onNextClick", "showPreviousButton", "showNextButton", "month", "locale", "localeUtils"];
-import cx from "classnames";
+import cx from "clsx";
 import { useMemo } from "react";
 import { ChevronLeft, ChevronRight } from "react-feather";
 import { IconButton } from "../../Button";
@@ -40,7 +40,7 @@ var NavBar = function NavBar(_ref) {
     className: stl(_templateObject || (_templateObject = _taggedTemplateLiteral(["w-full top-3 left-0 pt-5 px-5 pb-2 flex justify-between"]))),
     children: [/*#__PURE__*/_jsx(IconButton, {
       icon: ChevronLeft,
-      title: (locale === null || locale === void 0 ? void 0 : locale.previousMonth) || "Previous month",
+      title: locale.previousMonth,
       onClick: function onClick() {
         return onPreviousClick();
       },
@@ -50,7 +50,7 @@ var NavBar = function NavBar(_ref) {
       children: /*#__PURE__*/_jsxs("div", {
         className: stl(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["font-medium text-md"]))),
         children: [localeUtils.getMonths()[month.getMonth()], " ", props.editableYear ? /*#__PURE__*/_jsx("select", {
-          className: cx("DayPicker-Year", stl(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["pl-0.5 font-medium outline-none border-transparent border-2 rounded focus:border-nebula-600 focus:shadow-z100 appearance-none"])))),
+          className: cx("DayPicker-Year", stl(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["pl-0.5 font-medium outline-none border-transparent border-2 rounded focus:border-accent-600 focus:shadow-z100 appearance-none"])))),
           value: month.getFullYear(),
           onChange: function onChange(e) {
             return props.onYearChange(parseInt(e.currentTarget.value));
@@ -65,7 +65,7 @@ var NavBar = function NavBar(_ref) {
       })
     }), /*#__PURE__*/_jsx(IconButton, {
       icon: ChevronRight,
-      title: (locale === null || locale === void 0 ? void 0 : locale.nextMonth) || "Next month",
+      title: locale.nextMonth,
       onClick: function onClick() {
         return onNextClick();
       },

package/esm/DatePicker/utils.d.ts

@@ -1 +1,3 @@
+import type { DatePickerLocale } from "./types";
 export declare const formatDate: (date: Date | number) => string;
+export declare const DEFAULT_DATE_PICKER_LOCALE: Required<DatePickerLocale>;

package/esm/DatePicker/utils.js

@@ -1,4 +1,11 @@
 import format from "date-fns/format";
 export var formatDate = function formatDate(date) {
   return format(date, "MMM do, yyyy");
+};
+export var DEFAULT_DATE_PICKER_LOCALE = {
+  apply: "Apply",
+  cancel: "Cancel",
+  openButton: "Enter a date...",
+  previousMonth: "Previous month",
+  nextMonth: "Next month"
 };

package/esm/Dropdown/Dropdown.d.ts

@@ -59,6 +59,6 @@ export declare const Dropdown: {
         children: ReactNode;
     }) => JSX.Element | null;
     Divider: () => JSX.Element;
-    Title: import("react").FunctionComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>>;
+    Title: import("react").FunctionComponent<import("./components/DropdownTitle").DropdownTitleProps>;
 };
 export default Dropdown;

package/esm/Dropdown/Dropdown.js

@@ -9,12 +9,12 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
 
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
-import cx from "classnames";
+import cx from "clsx";
 import { useState } from "react";
-import { createPortal } from "react-dom";
 import { usePopper } from "react-popper";
 import Card from "../Card";
 import { ClickAwayContainer } from "../ClickAwayContainer";
+import { useCreatePortal } from "../Satellite";
 import stl from "../styles/helpers/satellitePrefixer";
 import DropdownButtonItem from "./components/DropdownButtonItem";
 import { DropdownCollapsibleItem, DropdownCollapsibleItemsSingleGroup } from "./components/DropdownCollapsibleItem";
@@ -55,6 +55,7 @@ export var Dropdown = function Dropdown(_ref) {
       renderTarget = _ref.renderTarget,
       renderFooter = _ref.renderFooter,
       children = _ref.children;
+  var createPortal = useCreatePortal();
 
   var _useState = useState(false),
       _useState2 = _slicedToArray(_useState, 2),
@@ -100,7 +101,7 @@ export var Dropdown = function Dropdown(_ref) {
         className: stl(_templateObject || (_templateObject = _taggedTemplateLiteral(["inline-block leading-none"]))),
         ref: setTargetEl,
         children: target
-      }), showMenu && targetEl && /*#__PURE__*/createPortal( /*#__PURE__*/_jsx(ClickAwayContainer, {
+      }), showMenu && targetEl && createPortal( /*#__PURE__*/_jsx(ClickAwayContainer, {
         element: menuContainerEl,
         onClickAway: function onClickAway(evt) {
           var isContainedInTarget = targetEl === null || targetEl === void 0 ? void 0 : targetEl.contains(evt.target);
@@ -122,7 +123,7 @@ export var Dropdown = function Dropdown(_ref) {
             }) : null]
           })
         }))
-      }), document.body)]
+      }))]
     })
   });
 };

package/esm/Dropdown/DropdownButton.d.ts

@@ -5,6 +5,7 @@ export interface DropdownButtonProps extends Omit<ButtonProps<"button">, "title"
     /** Descriptive title for `Dropdown` */
     title: ReactNode;
     renderFooter?: (args: RenderTargetParams) => ReactNode;
+    children: ReactNode;
 }
 export declare const DropdownButton: FunctionComponent<DropdownButtonProps>;
 export default DropdownButton;

package/esm/Dropdown/components/DropdownButtonItem.js

@@ -4,13 +4,13 @@ import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProper
 
 var _templateObject, _templateObject2, _templateObject3;
 
-var _excluded = ["children", "variant", "toggle", "startIcon"];
+var _excluded = ["toggle", "children", "variant", "startIcon"];
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
-import cx from "classnames";
+import cx from "clsx";
 import stl from "../../styles/helpers/satellitePrefixer";
 import useDropdownItemProps from "../useDropdownItemProps";
 import { jsx as _jsx } from "react/jsx-runtime";
@@ -19,9 +19,9 @@ export var DropdownButtonItem = function DropdownButtonItem(props) {
   var dropdownItemProps = useDropdownItemProps(props);
 
   var _props$dropdownItemPr = _objectSpread(_objectSpread({}, props), dropdownItemProps),
+      toggle = _props$dropdownItemPr.toggle,
       children = _props$dropdownItemPr.children,
       variant = _props$dropdownItemPr.variant,
-      toggle = _props$dropdownItemPr.toggle,
       StartIcon = _props$dropdownItemPr.startIcon,
       mergedProps = _objectWithoutProperties(_props$dropdownItemPr, _excluded);
 

package/esm/Dropdown/components/DropdownFooterItem.js

@@ -10,7 +10,7 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
 
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
-import cx from "classnames";
+import cx from "clsx";
 import stl from "../../styles/helpers/satellitePrefixer";
 import { jsx as _jsx } from "react/jsx-runtime";
 export var DropdownFooterItem = function DropdownFooterItem(_ref) {

package/esm/Dropdown/components/DropdownLinkItem.js

@@ -10,7 +10,7 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
 
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
-import cx from "classnames";
+import cx from "clsx";
 import stl from "../../styles/helpers/satellitePrefixer";
 import useLinkProps from "../../utils/useLinkProps";
 import useDropdownItemProps from "../useDropdownItemProps";
@@ -29,11 +29,10 @@ export var DropdownLinkItem = function DropdownLinkItem(props) {
       mergedProps = _objectWithoutProperties(_props$dropdownItemPr, _excluded);
 
   return /*#__PURE__*/_jsxs("a", _objectSpread(_objectSpread({
-    tabIndex: disabled ? -1 : undefined,
     className: cx(stl(_templateObject || (_templateObject = _taggedTemplateLiteral(["flex items-center"]))), className)
   }, mergedProps), {}, {
     children: [StartIcon && /*#__PURE__*/_jsx(StartIcon, {
-      className: stl(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["mr-2 flex-shrink-0 text-grey-500"]))),
+      className: stl(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["mr-2 shrink-0 text-grey-500"]))),
       size: "1rem"
     }), /*#__PURE__*/_jsx("span", {
       className: stl(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["w-full truncate"]))),

package/esm/Dropdown/components/DropdownTitle.d.ts

@@ -1,4 +1,6 @@
-import type { FunctionComponent } from "react";
-export declare type DropdownTitleProps = JSX.IntrinsicElements["h4"];
+import type { FunctionComponent, ReactNode } from "react";
+export declare type DropdownTitleProps = JSX.IntrinsicElements["h4"] & {
+    children: ReactNode;
+};
 export declare const DropdownTitle: FunctionComponent<DropdownTitleProps>;
 export default DropdownTitle;

package/esm/Dropdown/components/DropdownTitle.js

@@ -10,7 +10,7 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
 
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
-import cx from "classnames";
+import cx from "clsx";
 import stl from "../../styles/helpers/satellitePrefixer";
 import { jsx as _jsx } from "react/jsx-runtime";
 export var DropdownTitle = function DropdownTitle(_ref) {

package/esm/Dropdown/components/DropdownToggleItem.js

@@ -10,7 +10,7 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
 
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
-import cx from "classnames";
+import cx from "clsx";
 import stl from "../../styles/helpers/satellitePrefixer";
 import { Toggle } from "../../Toggle";
 import useDropdownItemProps from "../useDropdownItemProps";
@@ -29,13 +29,13 @@ export var DropdownToggleItem = function DropdownToggleItem(props) {
   return /*#__PURE__*/_jsxs("label", {
     className: cx(stl(_templateObject || (_templateObject = _taggedTemplateLiteral(["flex items-center"]))), className),
     children: [StartIcon && /*#__PURE__*/_jsx(StartIcon, {
-      className: stl(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["mr-2 flex-shrink-0 text-grey-500"]))),
+      className: stl(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["mr-2 shrink-0 text-grey-500"]))),
       size: "1rem"
     }), /*#__PURE__*/_jsx("span", {
       className: stl(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["flex-1 truncate mr-4"]))),
       children: children
     }), /*#__PURE__*/_jsx(Toggle, _objectSpread({
-      className: stl(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["flex-shrink-0"])))
+      className: stl(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["shrink-0"])))
     }, toggleProps))]
   });
 };

package/esm/Dropdown/useDropdownItemProps.d.ts

@@ -6,8 +6,16 @@ export interface DropdownBaseItemProps<T extends HTMLElement = HTMLElement> {
     onClick?: EventHandler<MouseEvent<T>>;
 }
 export declare const useDropdownItemProps: <T extends HTMLElement = HTMLElement>(props: DropdownBaseItemProps<T>) => {
+    disabled: boolean;
+    "aria-disabled": boolean;
+    tabIndex: number;
+    onClick: undefined;
     className: string;
+} | {
+    disabled?: undefined;
+    "aria-disabled"?: undefined;
+    tabIndex?: undefined;
     onClick: (evt: MouseEvent<T, globalThis.MouseEvent>) => void;
-    disabled: boolean | undefined;
+    className: string;
 };
 export default useDropdownItemProps;

package/esm/Dropdown/useDropdownItemProps.js

@@ -1,8 +1,13 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
 
 var _templateObject;
 
-import cx from "classnames";
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+import cx from "clsx";
 import stl from "../styles/helpers/satellitePrefixer";
 import { useDropdownContext } from "./DropdownContext";
 export var useDropdownItemProps = function useDropdownItemProps(props) {
@@ -10,11 +15,15 @@ export var useDropdownItemProps = function useDropdownItemProps(props) {
       showMenu = _useDropdownContext.showMenu;
 
   var className = cx(stl(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n      flex items-center\n      min-h-10 px-4 text-left\n      focus:no-underline hover:no-underline\n      ", "\n    "])), props.disabled ? "text-grey-300 cursor-not-allowed" : "text-inherit hover:bg-grey-100 focus:bg-grey-100 focus:outline-none cursor-pointer"), props.className);
-  return {
+  var disabledProps = props.disabled ? {
+    disabled: true,
+    "aria-disabled": true,
+    tabIndex: -1,
+    onClick: undefined
+  } : {};
+  return _objectSpread({
     className: className,
-    onClick: props.disabled ? function (evt) {
-      return evt.preventDefault();
-    } : function (evt) {
+    onClick: function onClick(evt) {
       if (props.onClick) {
         props.onClick(evt);
       }
@@ -22,8 +31,7 @@ export var useDropdownItemProps = function useDropdownItemProps(props) {
       if (!evt.defaultPrevented && props.toggle) {
         showMenu(false);
       }
-    },
-    disabled: props.disabled
-  };
+    }
+  }, disabledProps);
 };
 export default useDropdownItemProps;

package/esm/Dropzone/Dropzone.d.ts

@@ -1,6 +1,9 @@
 import type { FC } from "react";
 import { FileRejection, DropzoneProps as ReactDropZoneProps } from "react-dropzone";
-interface DropzoneBaseProps {
+export declare type DropzoneLocale = {
+    clearInput?: string;
+};
+export interface DropzoneBaseProps {
     id?: string;
     onChange?(acceptedFiles: File[], fileRejections: FileRejection[]): void;
     placeholder?: string;
@@ -10,6 +13,7 @@ interface DropzoneBaseProps {
     className?: string;
     /** @default false */
     multiple?: boolean;
+    locale?: DropzoneLocale;
 }
 export declare type DropzoneProps = DropzoneBaseProps & Omit<ReactDropZoneProps, "onDrop" | "onDropAccepted" | "onDropRejected" | "multiple">;
 export declare const Dropzone: FC<DropzoneProps>;