@algolia/satellite 1.0.0-beta.145 → 1.0.0-beta.147

package/cjs/Tabs/ContentTabs.js

@@ -9,14 +9,10 @@ exports["default"] = exports.ContentTabs = void 0;
 
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
-var _tabs = require("@reach/tabs");
+var _reactTabs = require("@radix-ui/react-tabs");
 
 var _clsx = _interopRequireDefault(require("clsx"));
 
-var _react = require("react");
-
 var _Badge = _interopRequireDefault(require("../Badge"));
 
 var _satellitePrefixer = _interopRequireDefault(require("../styles/helpers/satellitePrefixer"));
@@ -34,31 +30,13 @@ var ContentTabs = function ContentTabs(_ref) {
       _ref$defaultIndex = _ref.defaultIndex,
       defaultIndex = _ref$defaultIndex === void 0 ? 0 : _ref$defaultIndex,
       onChange = _ref.onChange;
-
-  var _useState = (0, _react.useState)(tabIndex !== null && tabIndex !== void 0 ? tabIndex : defaultIndex),
-      _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
-      internalTabIndex = _useState2[0],
-      setInternalTabIndex = _useState2[1];
-
-  (0, _react.useEffect)(function () {
-    if (tabIndex !== undefined && internalTabIndex !== tabIndex) {
-      setInternalTabIndex(tabIndex);
-    }
-  }, [internalTabIndex, tabIndex]);
-
-  var handleTabsChange = function handleTabsChange(index) {
-    onChange === null || onChange === void 0 ? void 0 : onChange(index);
-
-    if (tabIndex === undefined) {
-      setInternalTabIndex(index);
-    }
-  };
-
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_tabs.Tabs, {
-    index: internalTabIndex,
-    onChange: handleTabsChange,
-    defaultIndex: internalTabIndex,
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_tabs.TabList, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactTabs.Tabs, {
+    value: typeof tabIndex !== "undefined" ? String(tabIndex) : undefined,
+    defaultValue: typeof defaultIndex !== "undefined" ? String(defaultIndex) : undefined,
+    onValueChange: function onValueChange(value) {
+      return onChange === null || onChange === void 0 ? void 0 : onChange(Number(value));
+    },
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactTabs.TabsList, {
       className: (0, _clsx["default"])((0, _satellitePrefixer["default"])(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["tabs-tabbar border-b border-grey-200 flex overflow-x-auto whitespace-nowrap space-x-6"]))), className),
       children: tabs.map(function (_ref2, index) {
         var _ref2$variant = _ref2.variant,
@@ -67,9 +45,10 @@ var ContentTabs = function ContentTabs(_ref) {
             disabled = _ref2.disabled,
             label = _ref2.label,
             value = _ref2.value;
-        return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_tabs.Tab, {
-          className: (0, _clsx["default"])(_utils.ACTIVE_UNDERLINE_VARIANT_CLASSNAMES[variant], (0, _satellitePrefixer["default"])(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["tab pb-3 text-base leading-sm"]))), className),
+        return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactTabs.TabsTrigger, {
+          value: String(index),
           disabled: disabled,
+          className: (0, _clsx["default"])(_utils.ACTIVE_UNDERLINE_VARIANT_CLASSNAMES[variant], (0, _satellitePrefixer["default"])(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["tab pb-3 text-base leading-sm"]))), className),
           children: [label, value && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Badge["default"], {
             size: "small",
             variant: variant,
@@ -78,15 +57,13 @@ var ContentTabs = function ContentTabs(_ref) {
           })]
         }, index);
       })
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_tabs.TabPanels, {
-      children: tabs.map(function (_ref3, index) {
-        var content = _ref3.content;
-        var isActive = internalTabIndex === index;
-        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_tabs.TabPanel, {
-          className: (0, _satellitePrefixer["default"])(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["focus:outline-none"]))),
-          children: isActive ? content : null
-        }, index);
-      })
+    }), tabs.map(function (_ref3, index) {
+      var content = _ref3.content;
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactTabs.TabsContent, {
+        value: String(index),
+        className: (0, _satellitePrefixer["default"])(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["focus:outline-none"]))),
+        children: content
+      }, index);
     })]
   });
 };

package/cjs/Tabs/Tabs.tailwind.d.ts

@@ -1,5 +1,5 @@
 export = tabsPlugin;
 declare const tabsPlugin: {
     handler: import("tailwindcss/types/config").PluginCreator;
-    config?: import("tailwindcss").Config | undefined;
+    config?: Partial<import("tailwindcss").Config> | undefined;
 };

package/cjs/Tag/Tag.tailwind.d.ts

@@ -1,5 +1,5 @@
 export = tagPlugin;
 declare const tagPlugin: {
     handler: import("tailwindcss/types/config").PluginCreator;
-    config?: import("tailwindcss").Config | undefined;
+    config?: Partial<import("tailwindcss").Config> | undefined;
 };

package/cjs/TextArea/TextArea.tailwind.d.ts

@@ -1,5 +1,5 @@
 export = textAreaPlugin;
 declare const textAreaPlugin: {
     handler: import("tailwindcss/types/config").PluginCreator;
-    config?: import("tailwindcss").Config | undefined;
+    config?: Partial<import("tailwindcss").Config> | undefined;
 };

package/cjs/TextWrap/TextWrap.d.ts

@@ -1,5 +1,6 @@
 /// <reference types="react" />
 export interface TextWrapProps extends Omit<JSX.IntrinsicElements["span"], "children"> {
+    /** The max number of lines before the text is cut with an ellipsis */
     maxLines?: number;
     children: string;
 }

package/cjs/Toggle/Toggle.tailwind.d.ts

@@ -1,5 +1,5 @@
 export = togglePlugin;
 declare const togglePlugin: {
     handler: import("tailwindcss/types/config").PluginCreator;
-    config?: import("tailwindcss").Config | undefined;
+    config?: Partial<import("tailwindcss").Config> | undefined;
 };

package/cjs/Tooltip/Tooltip.tailwind.d.ts

@@ -1,5 +1,5 @@
 export = tooltipPlugin;
 declare const tooltipPlugin: {
     handler: import("tailwindcss/types/config").PluginCreator;
-    config?: import("tailwindcss").Config | undefined;
+    config?: Partial<import("tailwindcss").Config> | undefined;
 };

package/cjs/Typography/Typography.tailwind.d.ts

@@ -1,5 +1,5 @@
 export = typographyPlugin;
 declare const typographyPlugin: {
     handler: import("tailwindcss/types/config").PluginCreator;
-    config?: import("tailwindcss").Config | undefined;
+    config?: Partial<import("tailwindcss").Config> | undefined;
 };

package/cjs/Typography/Typography.tailwind.js

@@ -19,8 +19,8 @@ var typographyPlugin = plugin(function (_ref) {
       addUtilities = _ref.addUtilities,
       addComponents = _ref.addComponents,
       e = _ref.e;
-  var desktop = theme("typography.desktop", {});
-  var mobile = theme("typography.mobile", {});
+  var desktop = theme("stlTypography.desktop", {});
+  var mobile = theme("stlTypography.mobile", {});
   var common = {
     reversed: {
       color: theme("colors.white")
@@ -65,7 +65,7 @@ var typographyPlugin = plugin(function (_ref) {
   content: [],
   theme: {
     // @ts-ignore
-    typography: function typography(_ref2) {
+    stlTypography: function stlTypography(_ref2) {
       var theme = _ref2.theme;
       // Need to transform it to a string because in this context, Tailwind doesn't automagically turn it into a string value
       // Asked here https://github.com/tailwindlabs/tailwindcss/discussions/8755

package/cjs/UserContent/UserContent.js

@@ -7,8 +7,6 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports["default"] = exports.UserContent = void 0;
 
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 
 var _clsx = _interopRequireDefault(require("clsx"));
@@ -24,12 +22,13 @@ var UserContent = function UserContent(_ref) {
       content = _ref.content,
       _ref$styled = _ref.styled,
       styled = _ref$styled === void 0 ? true : _ref$styled;
-  return content ? /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-    className: (0, _clsx["default"])((0, _defineProperty2["default"])({}, (0, _satellitePrefixer["default"])(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["usercontent"]))), styled), className),
+  if (!content) return null;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    className: (0, _clsx["default"])((0, _satellitePrefixer["default"])(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["", ""])), styled && "usercontent"), className),
     dangerouslySetInnerHTML: {
       __html: content
     }
-  }) : null;
+  });
 };
 
 exports.UserContent = UserContent;

package/cjs/UserContent/UserContent.tailwind.d.ts

@@ -1,5 +1,5 @@
 declare const _exports: {
     handler: import("tailwindcss/types/config").PluginCreator;
-    config?: import("tailwindcss").Config | undefined;
+    config?: Partial<import("tailwindcss").Config> | undefined;
 };
 export = _exports;

package/cjs/UserContent/UserContent.tailwind.js

@@ -21,10 +21,10 @@ module.exports = plugin(function (_ref) {
       theme = _ref.theme;
 
   /** @type {any} */
-  var desktop = theme("typography.desktop", {});
+  var desktop = theme("stlTypography.desktop", {});
   /** @type {any} */
 
-  var mobile = theme("typography.mobile", {});
+  var mobile = theme("stlTypography.mobile", {});
   addComponents({
     ".usercontent": (0, _defineProperty2["default"])({
       "h1, h2, h3, h4, h5, h6, p, ul, ol, blockquote, table": {

package/cjs/styles/base.tailwind.d.ts

@@ -1,5 +1,5 @@
 export = basePlugin;
 declare const basePlugin: {
     handler: import("tailwindcss/types/config").PluginCreator;
-    config?: import("tailwindcss").Config | undefined;
+    config?: Partial<import("tailwindcss").Config> | undefined;
 };

package/cjs/styles/helpers/prefixTailwindClassName.js

@@ -8,21 +8,21 @@
  * @param {string} classname
  */
 function prefixTailwindClassName(tailwindPrefix, classname) {
-  var modifiers = "";
-  var arbitraryValueIndex = classname.indexOf("-[");
-  var classNameSafeZone = arbitraryValueIndex === -1 ? classname : classname.slice(0, arbitraryValueIndex);
-  var prefixInsertIndex = classNameSafeZone.lastIndexOf("!");
+  var searchZone = classname.replace(/-\[[^\]]+\]$/, ""); // important marker
+
+  var prefixInsertIndex = searchZone.lastIndexOf("!"); // modifier separator
 
   if (prefixInsertIndex === -1) {
-    prefixInsertIndex = classNameSafeZone.lastIndexOf(":");
-  }
+    prefixInsertIndex = searchZone.lastIndexOf(":");
+  } // container marker
 
-  if (prefixInsertIndex !== -1) {
-    modifiers = classname.slice(0, prefixInsertIndex + 1);
-    classname = classname.slice(prefixInsertIndex + 1);
+
+  if (prefixInsertIndex === -1) {
+    prefixInsertIndex = searchZone.lastIndexOf("@");
   }
 
-  return "".concat(modifiers).concat(tailwindPrefix).concat(classname);
+  prefixInsertIndex += 1;
+  return classname.slice(0, prefixInsertIndex) + tailwindPrefix + classname.slice(prefixInsertIndex);
 }
 
 module.exports = prefixTailwindClassName;

package/cjs/utilities/utilities.tailwind.d.ts

@@ -1,5 +1,5 @@
 declare const _exports: {
     handler: import("tailwindcss/types/config").PluginCreator;
-    config?: import("tailwindcss").Config | undefined;
+    config?: Partial<import("tailwindcss").Config> | undefined;
 };
 export = _exports;

package/esm/AutoComplete/AutoComplete.js

@@ -10,7 +10,7 @@ import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16;
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17;
 
 var _excluded = ["optionItemPrefix"],
     _excluded2 = ["ref"];
@@ -379,7 +379,7 @@ export var AutoComplete = /*#__PURE__*/function (_Component) {
       var shouldRenderCustomTemplate = Boolean(!multiple && !inputFocused && value && renderValueTemplate);
       var status = fieldState.status;
       var inputContainerClassName = stl(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n      autocomplete-container\n      ", "\n      ", "\n      ", "\n      ", "\n      ", "\n      "])), variant === "large" && "autocomplete-large py-1", inputFocused && "autocomplete-focused", disabled && "autocomplete-disabled", status === "invalid" && "autocomplete-invalid", noWrap && "autocomplete-nowrap");
-      var inputClassName = stl(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n      autocomplete-input\n      ", "\n      ", "\n    "])), multiple && "ml-1", shouldRenderCustomTemplate && hasValue && "h-0 w-0 opacity-0");
+      var inputClassName = stl(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n      autocomplete-input py-1.5\n      ", "\n      ", "\n    "])), multiple && "ml-1", shouldRenderCustomTemplate && hasValue && "h-0 w-0 opacity-0");
       var inputProps = getInputProps({
         id: id,
         name: name,
@@ -422,7 +422,7 @@ export var AutoComplete = /*#__PURE__*/function (_Component) {
           className: stl(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["mr-4 shrink-0 ", ""])), disabled ? "text-grey-200" : inputFocused ? "text-accent-600" : "text-grey-500"),
           size: "1rem"
         }), /*#__PURE__*/_jsxs("div", {
-          className: cx(stl(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["flex items-center flex-1 ", " ", ""])), !noWrap && "flex-wrap", multiple && "-ml-1"), valuesClassName),
+          className: cx(stl(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["flex items-center flex-1 max-h-full ", " ", ""])), !noWrap && "flex-wrap overflow-y-scroll no-scrollbar", multiple && "-ml-1"), valuesClassName),
           children: [multiple && Array.isArray(value) && value.map(function (option) {
             return renderValueTemplate ? renderValueTemplate({
               option: option,
@@ -598,7 +598,7 @@ export var AutoComplete = /*#__PURE__*/function (_Component) {
       }
 
       return /*#__PURE__*/_jsxs("div", {
-        className: className,
+        className: cx(stl(_templateObject17 || (_templateObject17 = _taggedTemplateLiteral(["flex"]))), className),
         children: [_this.renderInput(autocompleteHelpers, fieldState), _this.inputContainerRef && /*#__PURE__*/createPortal(_this.renderMenu(results, autocompleteHelpers), (_this$context$portalT = _this.context["portalTarget"]) !== null && _this$context$portalT !== void 0 ? _this$context$portalT : document.body)]
       });
     });

package/esm/AutoComplete/AutoComplete.tailwind.d.ts

@@ -1,5 +1,5 @@
 export = autoCompletePlugin;
 declare const autoCompletePlugin: {
     handler: import("tailwindcss/types/config").PluginCreator;
-    config?: import("tailwindcss").Config | undefined;
+    config?: Partial<import("tailwindcss").Config> | undefined;
 };

package/esm/Button/Button.tailwind.d.ts

@@ -1,5 +1,5 @@
 export = buttonPlugin;
 declare const buttonPlugin: {
     handler: import("tailwindcss/types/config").PluginCreator;
-    config?: import("tailwindcss").Config | undefined;
+    config?: Partial<import("tailwindcss").Config> | undefined;
 };

package/esm/Button/ButtonGroup.d.ts

@@ -1,11 +1,12 @@
 import type { FunctionComponent, ReactNode } from "react";
 export interface ButtonGroupProps {
-    className?: string;
     /**
      * Specify HTML element `ButtonGroup` should be presented as.
      * @default "div"
      */
     as?: keyof JSX.IntrinsicElements;
+    /** @ignore */
+    className?: string;
     children: ReactNode;
 }
 /**

package/esm/Card/Card.tailwind.d.ts

@@ -1,5 +1,5 @@
 export = cardPlugin;
 declare const cardPlugin: {
     handler: import("tailwindcss/types/config").PluginCreator;
-    config?: import("tailwindcss").Config | undefined;
+    config?: Partial<import("tailwindcss").Config> | undefined;
 };

package/esm/Checkbox/Checkbox.tailwind.d.ts

@@ -1,5 +1,5 @@
 export = checkboxPlugin;
 declare const checkboxPlugin: {
     handler: import("tailwindcss/types/config").PluginCreator;
-    config?: import("tailwindcss").Config | undefined;
+    config?: Partial<import("tailwindcss").Config> | undefined;
 };

package/esm/DatePicker/DatePicker.tailwind.d.ts

@@ -1,5 +1,5 @@
 export = datePickerPlugin;
 declare const datePickerPlugin: {
-    handler: import("tailwindcss/types/config").PluginCreator; /** @type {string} */
-    config?: import("tailwindcss").Config | undefined;
+    handler: import("tailwindcss/types/config").PluginCreator;
+    config?: Partial<import("tailwindcss").Config> | undefined;
 };

package/esm/DatePicker/DatePicker.tailwind.js

@@ -95,7 +95,7 @@ var datePickerPlugin = plugin(function (_ref) {
       textTransform: "capitalize",
       fontWeight: "normal",
       fontSize: "0.95em",
-      color: theme("colors.grey.500")
+      color: theme("colors.grey.600")
     },
     "& .rdp-day": (_rdpDay2 = {
       borderRadius: defaultRadius

package/esm/DatePicker/components/Calendar.js

@@ -6,7 +6,6 @@ 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 { DayPicker } from "react-day-picker";
-import { getDateFnsLocale } from "../utils";
 import NavBar from "./NavBar";
 import { jsx as _jsx } from "react/jsx-runtime";
 var excludedDayPickerPropsList = ["captionElement", "showOutsideDays", "enableOutsideDaysClick", "fixedWeeks", "labels", "navbarElement", "onTodayButtonClick", "pagedNavigation", "renderDay", "renderWeek", "reverseMonths", "showWeekNumber", "showWeekDays", "weekdayElement", "weekdaysLong", "weekdaysShort"];
@@ -34,14 +33,11 @@ var Calendar = function Calendar(props) {
     //stl`bg-grey-600 text-white rounded-l border-0`,
     displayedRangesEnd: "rdp-day_displayedRangesEnd" //stl`bg-grey-600 text-white rounded-r border-0`,
 
-  }; // This could be expanded further to incorporate expanding the number system as well as the text:
-  // https://react-day-picker.js.org/basics/localization#adopting-other-numbering-systems
-
-  var dateFnsLocale = getDateFnsLocale(props.locale.code);
+  };
   return /*#__PURE__*/_jsx(DayPicker, _objectSpread(_objectSpread({
     mode: props.mode
   }, curatedProps), {}, {
-    locale: dateFnsLocale,
+    locale: props.locale.formatter,
     dir: props.locale.rtl ? "rtl" : "ltr",
     modifiersClassNames: modifierClassNames,
     showOutsideDays: false,

package/esm/DatePicker/components/NavBar.js

@@ -1,7 +1,7 @@
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
 import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
 
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7;
 
 import cx from "clsx";
 import { add, eachYearOfInterval, getYear, setYear } from "date-fns";
@@ -11,6 +11,7 @@ import { useDayPicker, useNavigation } from "react-day-picker";
 import { ChevronLeft, ChevronRight } from "react-feather";
 import { IconButton } from "../../Button";
 import stl from "../../styles/helpers/satellitePrefixer";
+import { uniqueId } from "../../utils";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 
@@ -75,6 +76,9 @@ var NavBar = function NavBar(props) {
       return i + minYear;
     });
   }, [props, initialDate]);
+  var yearSelectId = useMemo(function () {
+    return uniqueId("year-select");
+  }, []);
   return /*#__PURE__*/_jsxs("div", {
     className: stl(_templateObject || (_templateObject = _taggedTemplateLiteral(["w-full top-3 left-0 pt-1 px-2 pb-2 flex justify-between"]))),
     children: [showPrevious ? /*#__PURE__*/_jsx(IconButton, {
@@ -89,18 +93,25 @@ var NavBar = function NavBar(props) {
         className: stl(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["font-medium text-md"]))),
         children: [formatMonthCaption(props.displayMonth, {
           locale: locale
-        }), " ", props.editableYear ? /*#__PURE__*/_jsx("select", {
-          className: cx("rdp-year", stl(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["pl-0.5 font-medium outline-none border-transparent border-2 rounded focus:border-accent-600 focus:shadow-z100 appearance-none"])))),
-          value: props.displayMonth.getFullYear(),
-          onChange: function onChange(e) {
-            return goToDate(setYear(props.displayMonth, parseInt(e.currentTarget.value)));
-          },
-          children: years.map(function (year) {
-            return /*#__PURE__*/_jsx("option", {
-              value: year,
-              children: year
-            }, year);
-          })
+        }), " ", props.editableYear ? /*#__PURE__*/_jsxs("label", {
+          htmlFor: yearSelectId,
+          children: [/*#__PURE__*/_jsx("span", {
+            className: stl(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["sr-only"]))),
+            children: "Select a year"
+          }), /*#__PURE__*/_jsx("select", {
+            id: yearSelectId,
+            className: cx("rdp-year", stl(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["pl-0.5 font-medium outline-none border-transparent border-2 rounded focus:border-accent-600 focus:shadow-z100 appearance-none"])))),
+            value: props.displayMonth.getFullYear(),
+            onChange: function onChange(e) {
+              return goToDate(setYear(props.displayMonth, parseInt(e.currentTarget.value)));
+            },
+            children: years.map(function (year) {
+              return /*#__PURE__*/_jsx("option", {
+                value: year,
+                children: year
+              }, year);
+            })
+          })]
         }) : props.displayMonth.getFullYear()]
       })
     }), showNext ? /*#__PURE__*/_jsx(IconButton, {
@@ -108,7 +119,7 @@ var NavBar = function NavBar(props) {
       title: nextMonthLabel,
       onClick: handleNextClick
     }) : /*#__PURE__*/_jsx("span", {
-      className: stl(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["w-8"])))
+      className: stl(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["w-8"])))
     })]
   });
 };

package/esm/DatePicker/types.d.ts

@@ -1,12 +1,8 @@
-import type * as Locales from "date-fns/locale";
+import type { Locale as DateFnsLocale } from "date-fns";
 import type { ModalProps } from "./components/Modal";
 export declare type DatePickerLocale = {
-    /**
-     * code is the date-fns ISO 639-1 language code to look up @link https://en.wikipedia.org/wiki/List_of_ISO_639-1_codes
-     * for rendering the actual calendar component in the correct language. This has no effect on the custom translations
-     * listed below. (i.e. `openButton`, `apply`, etc.)
-     */
-    code?: keyof typeof Locales;
+    /** The date-fns locale object used to localize dates. Defaults to* `en-US`. */
+    formatter?: DateFnsLocale;
     /** rtl should be used optionally in conjunction with supported language codes, such as `rtl: true` when code is `arSA` */
     rtl?: boolean;
     /**

package/esm/DatePicker/utils.d.ts

@@ -1,10 +1,3 @@
-import type { Locale } from "date-fns";
 import type { DatePickerLocale } from "./types";
 export declare const formatDate: (date: Date | number) => string;
-export declare const DEFAULT_DATE_PICKER_LOCALE: Required<DatePickerLocale>;
-/**
- * Looks up a date-fns locale. This falls back to `en`
- * @param locale the ISO 639-1 language code to look up @link https://en.wikipedia.org/wiki/List_of_ISO_639-1_codes
- * @returns date-fns locale.
- */
-export declare function getDateFnsLocale(locale?: string): Locale;
+export declare const DEFAULT_DATE_PICKER_LOCALE: Required<Omit<DatePickerLocale, "formatter">>;

package/esm/DatePicker/utils.js

@@ -1,30 +1,12 @@
 import format from "date-fns/format";
-import * as Locales from "date-fns/locale";
 export var formatDate = function formatDate(date) {
   return format(date, "MMM do, yyyy");
 };
 export var DEFAULT_DATE_PICKER_LOCALE = {
-  code: "enUS",
   rtl: false,
   apply: "Apply",
   cancel: "Cancel",
   openButton: "Enter a date...",
   previousMonth: "Previous month",
   nextMonth: "Next month"
-};
-/**
- * Looks up a date-fns locale. This falls back to `en`
- * @param locale the ISO 639-1 language code to look up @link https://en.wikipedia.org/wiki/List_of_ISO_639-1_codes
- * @returns date-fns locale.
- */
-
-export function getDateFnsLocale(locale) {
-  var _allLocales$locale;
-
-  if (!locale) {
-    return Locales.enUS;
-  }
-
-  var allLocales = Locales;
-  return (_allLocales$locale = allLocales[locale]) !== null && _allLocales$locale !== void 0 ? _allLocales$locale : Locales.enUS;
-}
+};

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

@@ -2,6 +2,7 @@
 import type { IconComponentType } from "../../types";
 import { DropdownBaseItemProps } from "../useDropdownItemProps";
 export declare type DropdownLinkItemProps = DropdownBaseItemProps<HTMLAnchorElement> & JSX.IntrinsicElements["a"] & {
+    href: string;
     /** Left aligned icon */
     startIcon?: IconComponentType;
 };

package/esm/EmptyState/EmptyState.tailwind.d.ts

@@ -1,5 +1,5 @@
 export = emptyStatePlugin;
 declare const emptyStatePlugin: {
     handler: import("tailwindcss/types/config").PluginCreator;
-    config?: import("tailwindcss").Config | undefined;
+    config?: Partial<import("tailwindcss").Config> | undefined;
 };

package/esm/Flag/Flag.tailwind.d.ts

@@ -1,5 +1,5 @@
 export = flagPlugin;
 declare const flagPlugin: {
     handler: import("tailwindcss/types/config").PluginCreator;
-    config?: import("tailwindcss").Config | undefined;
+    config?: Partial<import("tailwindcss").Config> | undefined;
 };

package/esm/FlexGrid/FlexGrid.tailwind.d.ts

@@ -4,5 +4,5 @@ export = flexGridPlugin;
  **/
 declare const flexGridPlugin: {
     handler: import("tailwindcss/types/config").PluginCreator;
-    config?: import("tailwindcss").Config | undefined;
+    config?: Partial<import("tailwindcss").Config> | undefined;
 };

package/esm/HelpUnderline/HelpUnderline.tailwind.d.ts

@@ -1,5 +1,5 @@
 export = helpUnderlinePlugin;
 declare const helpUnderlinePlugin: {
     handler: import("tailwindcss/types/config").PluginCreator;
-    config?: import("tailwindcss").Config | undefined;
+    config?: Partial<import("tailwindcss").Config> | undefined;
 };

package/esm/Input/Input.tailwind.d.ts

@@ -1,5 +1,5 @@
 export = inputPlugin;
 declare const inputPlugin: {
     handler: import("tailwindcss/types/config").PluginCreator;
-    config?: import("tailwindcss").Config | undefined;
+    config?: Partial<import("tailwindcss").Config> | undefined;
 };

package/esm/InstantSearch/InstantSearch.tailwind.d.ts

@@ -1,5 +1,5 @@
 declare const _exports: {
     handler: import("tailwindcss/types/config").PluginCreator;
-    config?: import("tailwindcss").Config | undefined;
+    config?: Partial<import("tailwindcss").Config> | undefined;
 };
 export = _exports;

package/esm/KeyboardKey/KeyboardKey.tailwind.d.ts

@@ -1,5 +1,5 @@
 export = keyboardKeyPlugin;
 declare const keyboardKeyPlugin: {
     handler: import("tailwindcss/types/config").PluginCreator;
-    config?: import("tailwindcss").Config | undefined;
+    config?: Partial<import("tailwindcss").Config> | undefined;
 };

package/esm/Link/BaseLink.d.ts

@@ -1,4 +1,8 @@
 import type { AnchorHTMLAttributes } from "react";
-export declare type BaseLinkProps = AnchorHTMLAttributes<HTMLAnchorElement>;
-export declare const BaseLink: import("react").ForwardRefExoticComponent<BaseLinkProps & import("react").RefAttributes<HTMLAnchorElement>>;
+export declare type BaseLinkProps = {
+    href: string;
+} & AnchorHTMLAttributes<HTMLAnchorElement>;
+export declare const BaseLink: import("react").ForwardRefExoticComponent<{
+    href: string;
+} & AnchorHTMLAttributes<HTMLAnchorElement> & import("react").RefAttributes<HTMLAnchorElement>>;
 export default BaseLink;

package/esm/Link/ButtonLink.d.ts

@@ -1,5 +1,7 @@
 /// <reference types="react" />
 import type { ButtonBaseProps, ExtractProps } from "../Button/types";
-export declare type ButtonLinkProps = ButtonBaseProps & ExtractProps<"a">;
+export declare type ButtonLinkProps = ButtonBaseProps & ExtractProps<"a"> & {
+    href: string;
+};
 export declare const ButtonLink: ({ endIcon: EndIcon, href, onClick, ...props }: ButtonLinkProps) => JSX.Element;
 export default ButtonLink;