@algolia/satellite 1.0.0-beta.162 → 1.0.0-beta.164

package/cjs/RangeSlider/RangeSlider.js

@@ -10,6 +10,7 @@ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/h
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 var _reactSlider = require("@radix-ui/react-slider");
 var _clsx = _interopRequireDefault(require("clsx"));
+var _react = require("react");
 var _colors = _interopRequireDefault(require("../styles/colors"));
 var _satellitePrefixer = _interopRequireDefault(require("../styles/helpers/satellitePrefixer"));
 var _jsxRuntime = require("react/jsx-runtime");
@@ -30,15 +31,7 @@ var ThumbGroove = function ThumbGroove(_ref) {
     className: (0, _clsx["default"])((0, _satellitePrefixer["default"])(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["h-3 w-px bg-grey-500 group-hover:bg-grey-600"]))), className)
   });
 };
-
-/**
- * A range slider is an input field where users select one or two numeric values within a given range (minimum and maximum values).
- *
- * - Range sliders should always be used with a label
- * - Provide min and max value whenever possible
- * - Provide text input for better accessibility
- */
-var RangeSlider = function RangeSlider(_ref2) {
+var RangeSliderInternal = function RangeSliderInternal(_ref2, ref) {
   var className = _ref2.className,
     value = _ref2.value,
     defaultValue = _ref2.defaultValue,
@@ -57,7 +50,9 @@ var RangeSlider = function RangeSlider(_ref2) {
     track1: disabled ? _colors["default"].grey[200] : track1Color,
     track2: disabled ? _colors["default"].grey[100] : track2Color
   };
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactSlider.Root, _objectSpread(_objectSpread({}, otherProps), {}, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactSlider.Root, _objectSpread(_objectSpread({
+    ref: ref
+  }, otherProps), {}, {
     className: (0, _clsx["default"])((0, _satellitePrefixer["default"])(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["relative h-6 min-w-[200px] flex items-center select-none touch-none aria-disabled:opacity-70 cursor-pointer aria-disabled:cursor-not-allowed"]))), className),
     value: coerceToRadixValue(value),
     defaultValue: coerceToRadixValue(defaultValue),
@@ -97,6 +92,15 @@ var RangeSlider = function RangeSlider(_ref2) {
     })]
   }));
 };
+
+/**
+ * A range slider is an input field where users select one or two numeric values within a given range (minimum and maximum values).
+ *
+ * - Range sliders should always be used with a label
+ * - Provide min and max value whenever possible
+ * - Provide text input for better accessibility
+ */
+var RangeSlider = /*#__PURE__*/(0, _react.forwardRef)(RangeSliderInternal);
 exports.RangeSlider = RangeSlider;
 RangeSlider.displayName = "RangeSlider";
 var _default = RangeSlider;

package/cjs/Satellite/SatelliteContext.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import type { ComponentsLocales } from "./locale";
-import { SatelliteRouter } from "./SatelliteRouter";
+import type { SatelliteRouter } from "./SatelliteRouter";
 export interface SatelliteContextType {
     router: SatelliteRouter;
     portalTarget: HTMLElement | null;

package/cjs/Satellite/useCreatePortal.d.ts

@@ -1,4 +1,4 @@
-import { ReactElement, ReactNode } from "react";
+import type { ReactElement, ReactNode } from "react";
 declare type CreatePortal = (children: ReactNode) => ReactElement;
 export declare const useCreatePortal: () => CreatePortal;
 export {};

package/cjs/Sidebar/SidebarButtonLink.js

@@ -69,11 +69,11 @@ var SidebarButtonLink = function SidebarButtonLink(props) {
       className: (0, _satellitePrefixer["default"])(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n          h-8 min-w-8 w-full rounded\n          flex items-center space-x-3\n          border border-transparent\n          display-body\n          hover:no-underline focus:no-underline\n          ", "\n          ", "\n          ", "\n          ", "\n        "])), disabled ? "cursor-not-allowed opacity-70" : "focus:border-grey-500", isActive ? "shadow-z100" : !disabled && "hover:border-grey-200", isActive && "bg-gradient-to-b from-white to-grey-50", collapsed ? "pl-2" : "px-2"),
       "aria-current": isActive,
       children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(Icon, {
-        className: (0, _satellitePrefixer["default"])(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["", " ml-[-3px]"])), showColors ? "text-accent-600" : "text-grey-400"),
+        className: (0, _satellitePrefixer["default"])(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["", " ml-[-3px] shrink-0"])), showColors ? "text-accent-600" : "text-grey-400"),
         height: 20,
         width: 20
       }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-        className: (0, _satellitePrefixer["default"])(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["\n            ", "\n            ", "\n            ", "\n          "])), collapsed && "sr-only", showColors ? "text-accent-600" : "typo-subdued", isActive && "font-bold"),
+        className: (0, _satellitePrefixer["default"])(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["\n            truncate\n            ", "\n            ", "\n            ", "\n          "])), collapsed && "sr-only", showColors ? "text-accent-600" : "typo-subdued", isActive && "font-bold"),
         children: children
       }), isExternalLink && !collapsed && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactFeather.ExternalLink, {
         className: (0, _satellitePrefixer["default"])(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["", " !ml-1 shrink-0"])), showColors ? "text-accent-600" : "typo-subdued"),

package/cjs/Sidebar/SidebarHeading.js

@@ -19,7 +19,7 @@ var SidebarHeading = function SidebarHeading(_ref) {
     collapsed = _useSidebarContext.collapsed;
   return /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
     id: id,
-    className: (0, _clsx["default"])((0, _satellitePrefixer["default"])(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n          h-8 block leading-[2rem]\n          display-subheading typo-subdued uppercase select-none\n          ", "\n        "])), collapsed && "opacity-0"), className),
+    className: (0, _clsx["default"])((0, _satellitePrefixer["default"])(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n          h-8 block leading-[2rem]\n          display-subheading typo-subdued uppercase select-none truncate\n          ", "\n        "])), collapsed && "opacity-0"), className),
     children: children
   });
 };

package/cjs/Switch/SwitchOption.js

@@ -36,7 +36,9 @@ var SwitchOption = function SwitchOption(_ref) {
         return context.onChange(evt.currentTarget.value);
       }
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_OverflowTooltipWrapper.OverflowTooltipWrapper, {
-      children: children
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+        children: children
+      })
     })]
   }));
 };

package/cjs/Tables/DataTable/components/Loader.d.ts

@@ -1,4 +1,4 @@
-import { VFC } from "react";
+import type { VFC } from "react";
 import type { DataTableLocale } from "../DataTable";
 export interface LoaderProps {
     className?: string;

package/cjs/TextArea/TextArea.tailwind.js

@@ -12,7 +12,7 @@ var textAreaPlugin = plugin(function (_ref) {
       width: "100%",
       padding: theme("spacing.4"),
       backgroundColor: theme("colors.white"),
-      border: "1px solid ".concat(theme("colors.grey.200")),
+      border: "1px solid ".concat(theme("colors.grey.500")),
       borderRadius: theme("borderRadius.DEFAULT"),
       boxShadow: "inset 0px 1px 4px 0px ".concat(rgba(theme("colors.grey.500"), 0.3)),
       transition: "all 100ms ease-in-out",
@@ -21,6 +21,9 @@ var textAreaPlugin = plugin(function (_ref) {
       "&::placeholder": {
         color: theme("colors.grey.600")
       },
+      "&:hover": {
+        borderColor: theme("colors.grey.600")
+      },
       "&:focus": {
         borderColor: theme("colors.accent.600"),
         boxShadow: "0px 1px 0px 0px ".concat(theme("colors.shadow.5")),

package/cjs/Tooltip/OverflowTooltipWrapper.d.ts

@@ -1,3 +1,5 @@
-import { VFC } from "react";
+import type { VFC } from "react";
 import type { TooltipWrapperBaseProps } from "./types";
-export declare const OverflowTooltipWrapper: VFC<TooltipWrapperBaseProps>;
+export interface OverflowTooltipWrapperProps extends TooltipWrapperBaseProps {
+}
+export declare const OverflowTooltipWrapper: VFC<OverflowTooltipWrapperProps>;

package/cjs/Tooltip/OverflowTooltipWrapper.js

@@ -9,9 +9,11 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _reactSlot = require("@radix-ui/react-slot");
 var _react = require("react");
 var _satellitePrefixer = _interopRequireDefault(require("../styles/helpers/satellitePrefixer"));
 var _TextWrap = _interopRequireDefault(require("../TextWrap"));
+var _isReactText = require("../utils/isReactText");
 var _TooltipWrapper = require("./TooltipWrapper");
 var _utils = require("./utils");
 var _jsxRuntime = require("react/jsx-runtime");
@@ -29,12 +31,13 @@ var OverflowTooltipWrapper = function OverflowTooltipWrapper(_ref) {
   var onMouseEnter = function onMouseEnter(evt) {
     setContent((0, _utils.isOverflowing)(evt.currentTarget) ? evt.currentTarget.textContent : null);
   };
+  var Wrapper = (0, _isReactText.isReactText)(children) ? "div" : _reactSlot.Slot;
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_TooltipWrapper.TooltipWrapper, _objectSpread(_objectSpread({
     content: content && /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextWrap["default"], {
       children: content
     })
   }, props), {}, {
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Wrapper, {
       className: (0, _satellitePrefixer["default"])(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["truncate"]))),
       onMouseEnter: onMouseEnter,
       children: children

package/cjs/Tooltip/TooltipWrapper.d.ts

@@ -1,4 +1,4 @@
-import { ReactElement, ReactNode, ReactText, VFC } from "react";
+import type { ReactNode, VFC } from "react";
 import type { TooltipWrapperBaseProps } from "./types";
 export interface TooltipWrapperProps extends TooltipWrapperBaseProps {
     /**
@@ -10,6 +10,5 @@ export interface TooltipWrapperProps extends TooltipWrapperBaseProps {
      * Defines the content of the tooltip.
      */
     content: ReactNode;
-    children: ReactElement | ReactText;
 }
 export declare const TooltipWrapper: VFC<TooltipWrapperProps>;

package/cjs/Tooltip/TooltipWrapper.js

@@ -12,6 +12,7 @@ var _clsx = _interopRequireDefault(require("clsx"));
 var _react = require("react");
 var _Satellite = require("../Satellite");
 var _satellitePrefixer = _interopRequireDefault(require("../styles/helpers/satellitePrefixer"));
+var _isReactText = require("../utils/isReactText");
 var _Tooltip = _interopRequireDefault(require("./Tooltip"));
 var _jsxRuntime = require("react/jsx-runtime");
 var _templateObject, _templateObject2, _templateObject3;
@@ -46,8 +47,8 @@ var TooltipWrapper = function TooltipWrapper(_ref) {
   if (!tooltipContent) return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
     children: children
   });
-  var isReactText = typeof children === "string" || typeof children === "number";
-  if (!isReactText && children.type === _react.Fragment) throw new Error("TooltipWrapper component doesn't accept a Fragment as a child.");
+  var hasTextChildren = (0, _isReactText.isReactText)(children);
+  if (!hasTextChildren && children.type === _react.Fragment) throw new Error("TooltipWrapper component doesn't accept a Fragment as a child.");
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(Tooltip.Provider, {
     delayDuration: delay,
     skipDelayDuration: 300,
@@ -55,7 +56,7 @@ var TooltipWrapper = function TooltipWrapper(_ref) {
     children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(Tooltip.Root, {
       open: show,
       children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(Tooltip.Trigger, {
-        asChild: !isReactText,
+        asChild: !hasTextChildren,
         children: children
       }), createPortal( /*#__PURE__*/(0, _jsxRuntime.jsxs)(Tooltip.Content, {
         className: (0, _clsx["default"])((0, _satellitePrefixer["default"])(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["tooltip-content"]))), tooltipClassName),

package/cjs/Tooltip/types.d.ts

@@ -1,5 +1,5 @@
 import type { TooltipContentProps } from "@radix-ui/react-tooltip";
-import type { ReactNode } from "react";
+import type { ReactElement, ReactText } from "react";
 import type { TooltipVariant } from "./Tooltip";
 export interface TooltipWrapperBaseProps {
     /**
@@ -61,5 +61,5 @@ export interface TooltipWrapperBaseProps {
      * @default true
      */
     avoidCollisions?: boolean;
-    children: ReactNode;
+    children: ReactElement | ReactText;
 }

package/cjs/styles/tailwind.config.js

@@ -80,7 +80,9 @@ module.exports = {
         z200: "0px 0px 0px 1px ".concat(theme("colors.shadow.5"), ", 0px 4px 8px -2px ").concat(theme("colors.shadow.25")),
         z300: "0px 0px 0px 1px ".concat(theme("colors.shadow.5"), ", 0px 8px 16px -4px ").concat(theme("colors.shadow.25")),
         z400: "0px 0px 0px 1px ".concat(theme("colors.shadow.5"), ", 0px 12px 24px -6px ").concat(theme("colors.shadow.25")),
-        z500: "0px 0px 0px 1px ".concat(theme("colors.shadow.5"), ", 0px 20px 32px -8px ").concat(theme("colors.shadow.25"))
+        z500: "0px 0px 0px 1px ".concat(theme("colors.shadow.5"), ", 0px 20px 32px -8px ").concat(theme("colors.shadow.25")),
+        field: "inset 0px 1px 4px 0px ".concat(rgba(colors.grey[500], 0.3)),
+        "field-focused": "0px 1px 0px 0px ".concat(theme("colors.shadow.5"))
       };
     },
     opacity: {

package/cjs/utils/isReactText.d.ts

@@ -0,0 +1,2 @@
+import type { ReactNode } from "react";
+export declare const isReactText: (children: ReactNode) => children is string | number;

package/cjs/utils/isReactText.js

@@ -0,0 +1,10 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.isReactText = void 0;
+var isReactText = function isReactText(children) {
+  return typeof children === "string" || typeof children === "number";
+};
+exports.isReactText = isReactText;

package/esm/AnnouncementBadge/AnnouncementBadge.d.ts

@@ -1,4 +1,4 @@
-import type { HTMLAttributes, VFC } from "react";
+import type { HTMLAttributes } from "react";
 export declare type AnnouncementBadgeSizes = "default" | "small";
 export declare type AnnouncementBadgeTexts = "new" | "beta" | "internal" | "pilot";
 export declare type AnnouncementBadgeLocale = {
@@ -17,5 +17,5 @@ export interface AnnouncementBadgeProps extends HTMLAttributes<HTMLSpanElement>
     locale?: AnnouncementBadgeLocale;
     children?: never;
 }
-export declare const AnnouncementBadge: VFC<AnnouncementBadgeProps>;
+export declare const AnnouncementBadge: import("react").ForwardRefExoticComponent<AnnouncementBadgeProps & import("react").RefAttributes<HTMLSpanElement>>;
 export default AnnouncementBadge;

package/esm/AnnouncementBadge/AnnouncementBadge.js

@@ -6,6 +6,7 @@ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _temp
 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 { forwardRef } from "react";
 import { useLocale } from "../Satellite";
 import stl from "../styles/helpers/satellitePrefixer";
 import { jsx as _jsx } from "react/jsx-runtime";
@@ -20,7 +21,7 @@ var SIZE_CLASSNAMES = {
   "default": stl(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["display-body h-6 leading-md px-2"]))),
   small: stl(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["display-caption px-1"])))
 };
-export var AnnouncementBadge = function AnnouncementBadge(_ref) {
+export var AnnouncementBadge = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var _ref$size = _ref.size,
     size = _ref$size === void 0 ? "default" : _ref$size,
     _ref$text = _ref.text,
@@ -32,9 +33,12 @@ export var AnnouncementBadge = function AnnouncementBadge(_ref) {
   var contextLocale = useLocale("announcementBadge");
   var locale = _objectSpread(_objectSpread(_objectSpread({}, DEFAULT_LOCALE), contextLocale), propsLocale);
   var variant = typeof variantProp === "string" ? variantProp : text === "internal" ? "red" : "accent";
-  return /*#__PURE__*/_jsx("span", _objectSpread(_objectSpread({}, props), {}, {
+  return /*#__PURE__*/_jsx("span", _objectSpread(_objectSpread({
+    ref: ref
+  }, props), {}, {
     className: cx(DEFAULT_CLASSNAME, variant === "red" ? stl(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["bg-red-600"]))) : stl(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["bg-accent-600"]))), SIZE_CLASSNAMES[size], className),
     children: locale[text]
   }));
-};
+});
+AnnouncementBadge.displayName = "AnnouncementBadge";
 export default AnnouncementBadge;

package/esm/AutoComplete/AutoComplete.d.ts

@@ -1,7 +1,7 @@
 import type { A11yStatusMessageOptions, ControllerStateAndHelpers } from "downshift";
 import { Component } from "react";
 import type { ChangeEvent, FocusEvent, KeyboardEvent, MouseEvent } from "react";
-import { FieldState } from "../Field/FieldStateContext";
+import type { FieldState } from "../Field/FieldStateContext";
 import type { AutoCompleteLocale, AutoCompleteProps, Option, OptionItemProps } from "./types";
 interface State {
     inputFocused: boolean;

package/esm/AutoComplete/AutoComplete.tailwind.js

@@ -24,7 +24,7 @@ var autoCompletePlugin = plugin(function (_ref) {
       border: "1px solid ".concat(theme("colors.grey.500")),
       boxShadow: "inset 0px 1px 4px 0px ".concat(rgba(theme("colors.grey.500"), 0.3)),
       transition: "all 100ms ease-in-out",
-      "&:not(.autocomplete-disabled):hover": {
+      "&:not(.autocomplete-disabled, .autocomplete-focused):hover": {
         borderColor: theme("colors.grey.600")
       },
       // Workaround for ie

package/esm/AutoComplete/components/AutoCompleteEmptyState.d.ts

@@ -1,5 +1,5 @@
 import type { ReactNode, VFC } from "react";
-import { MedallionVariant } from "../../Medallion";
+import type { MedallionVariant } from "../../Medallion";
 import type { IconComponentType } from "../../types";
 export interface AutoCompleteEmptyStateProps {
     icon?: IconComponentType;

package/esm/Button/PolymorphicButton.d.ts

@@ -1,11 +1,12 @@
 import React from "react";
-import { ButtonBaseProps, PolymorphicComponentPropWithRef } from "./types";
+import type { ButtonBaseProps, PolymorphicComponentPropWithRef } from "./types";
 export declare type PolymorphicButtonProps<C extends React.ElementType> = PolymorphicComponentPropWithRef<C, ButtonBaseProps>;
 declare type PolymorphicButtonComponent = (<C extends React.ElementType = "button">(props: PolymorphicButtonProps<C>) => React.ReactElement | null) & {
     displayName?: string;
 };
 /**
  * `PolymorphicButton` is intended for internal use
+ * @ignore
  */
 export declare const PolymorphicButton: PolymorphicButtonComponent;
 export {};

package/esm/Button/PolymorphicButton.js

@@ -17,6 +17,7 @@ var BASE_CLASSNAMES = stl(_templateObject || (_templateObject = _taggedTemplateL
 var ICON_SIZE = 16;
 /**
  * `PolymorphicButton` is intended for internal use
+ * @ignore
  */
 export var PolymorphicButton = /*#__PURE__*/forwardRef(function (props, ref) {
   var _props$as = props.as,

package/esm/Button/PolymorphicIconButton.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 import type { TooltipWrapperBaseProps } from "../Tooltip/types";
 import type { IconComponentType } from "../types";
-import { ButtonSize, ButtonVariant, PolymorphicComponentPropWithRef } from "./types";
+import type { ButtonSize, ButtonVariant, PolymorphicComponentPropWithRef } from "./types";
 export interface IconButtonBaseProps {
     variant?: ButtonVariant;
     size?: ButtonSize;
@@ -19,6 +19,7 @@ declare type PolymorphicIconButtonComponent = (<C extends React.ElementType = "b
 };
 /**
  * `PolymorphicIconButton` is intended for internal use
+ * @ignore
  */
 export declare const PolymorphicIconButton: PolymorphicIconButtonComponent;
 export {};

package/esm/Button/PolymorphicIconButton.js

@@ -26,6 +26,7 @@ var VARIANT_CLASSNAMES = _objectSpread(_objectSpread({}, BUTTON_VARIANT_CLASSNAM
 });
 /**
  * `PolymorphicIconButton` is intended for internal use
+ * @ignore
  */
 export var PolymorphicIconButton = /*#__PURE__*/forwardRef(function (props, ref) {
   var _props$as = props.as,

package/esm/Button/index.d.ts

@@ -1,5 +1,5 @@
 export * from "./Button";
 export * from "./IconButton";
 export * from "./ButtonGroup";
-export { ButtonSize, ButtonVariant } from "./types";
+export type { ButtonSize, ButtonVariant } from "./types";
 export { default } from "./Button";

package/esm/Button/index.js

@@ -1,5 +1,4 @@
 export * from "./Button";
 export * from "./IconButton";
 export * from "./ButtonGroup";
-export { ButtonSize, ButtonVariant } from "./types";
 export { default } from "./Button";

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

@@ -3,7 +3,7 @@ import type { CalendarProps } from "../components/Calendar";
 import type { DisplayProps } from "../components/Display";
 import type { FooterActionsProps } from "../components/FooterActions";
 import type { SharedDatePickerProps } from "../types";
-import { DatePickerReducerAction, DatePickerReducerState } from "./datePickerReducer";
+import type { DatePickerReducerAction, DatePickerReducerState } from "./datePickerReducer";
 interface LeftFooterComponentArgs {
     state: DatePickerReducerState;
     dispatch: Dispatch<DatePickerReducerAction>;

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

@@ -2,7 +2,8 @@ import type { Dispatch, ReactNode, VFC } from "react";
 import type { CalendarProps } from "../components/Calendar";
 import type { SharedDatePickerProps } from "../types";
 import type { DateRangePickerDisplayProps } from "./DateRangePickerDisplay";
-import { dateRangePickerReducer, DateRangePickerReducerAction, DateRangePickerReducerState } from "./dateRangePickerReducer";
+import type { DateRangePickerReducerAction, DateRangePickerReducerState } from "./dateRangePickerReducer";
+import { dateRangePickerReducer } from "./dateRangePickerReducer";
 import type { DateRangePickerTimeRange } from "./dateRangePickerTimeRange";
 interface LeftFooterComponentArgs {
     state: DateRangePickerReducerState;

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

@@ -1,8 +1,8 @@
 import type { VFC } from "react";
 import type { WithRequiredProperty } from "../../types";
-import { DisplayProps } from "../components/Display";
+import type { DisplayProps } from "../components/Display";
 import type { DatePickerLocale } from "../types";
-import { DateRangePickerTimeRange } from "./dateRangePickerTimeRange";
+import type { DateRangePickerTimeRange } from "./dateRangePickerTimeRange";
 export interface DateRangePickerDisplayProps {
     id?: string;
     onClick: DisplayProps["onClick"];

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

@@ -1,5 +1,5 @@
 import type { MouseEvent, Reducer } from "react";
-import { DateRangePickerCompleteTimeRange, DateRangePickerTimeRange } from "./dateRangePickerTimeRange";
+import type { DateRangePickerCompleteTimeRange, DateRangePickerTimeRange } from "./dateRangePickerTimeRange";
 export declare enum DateRangePickerActionTypes {
     show = "show",
     dateSelect = "date select",

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

@@ -1,5 +1,5 @@
 import type { VFC } from "react";
-import { DayPickerDefaultProps, DayPickerRangeProps, DayPickerSingleProps } from "react-day-picker";
+import type { DayPickerDefaultProps, DayPickerRangeProps, DayPickerSingleProps } 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" | "showWeekNumber" | "showWeekDays" | "weekdayElement" | "weekdaysLong" | "weekdaysShort";

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

@@ -1,5 +1,5 @@
 import type { VFC } from "react";
-import { ButtonProps } from "../../Button";
+import type { ButtonProps } from "../../Button";
 import type { WithRequiredProperty } from "../../types";
 import type { DatePickerLocale } from "../types";
 export interface FooterActionsProps {

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

@@ -1,5 +1,5 @@
 import type { VFC } from "react";
-import { CaptionProps } from "react-day-picker";
+import type { CaptionProps } from "react-day-picker";
 import type { WithRequiredProperty } from "../../types";
 import type { DatePickerLocale } from "../types";
 import type { EditableYearProps } from "./Calendar";

package/esm/Dropdown/Dropdown.d.ts

@@ -1,7 +1,6 @@
 import type { StrictModifiers } from "@popperjs/core";
-import { VFC } from "react";
-import type { ReactNode } from "react";
-import { StrictModifier } from "react-popper";
+import type { ReactNode, VFC } from "react";
+import type { StrictModifier } from "react-popper";
 import DropdownButtonItem from "./components/DropdownButtonItem";
 import { DropdownCollapsibleItem } from "./components/DropdownCollapsibleItem";
 import DropdownDivider from "./components/DropdownDivider";

package/esm/Dropdown/DropdownButton.d.ts

@@ -1,6 +1,6 @@
-import { ReactNode } from "react";
-import { ButtonProps } from "../Button";
-import { RenderTargetParams } from "./Dropdown";
+import type { ReactNode } from "react";
+import type { ButtonProps } from "../Button";
+import type { RenderTargetParams } from "./Dropdown";
 export interface DropdownButtonProps extends Omit<ButtonProps, "title" | "endIcon"> {
     /** Descriptive title for `Dropdown` */
     title: ReactNode;

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

@@ -1,6 +1,6 @@
 import type { VFC } from "react";
 import type { IconComponentType } from "../../types";
-import { DropdownBaseItemProps } from "../useDropdownItemProps";
+import type { DropdownBaseItemProps } from "../useDropdownItemProps";
 export declare type DropdownButtonItemProps = DropdownBaseItemProps<HTMLButtonElement> & JSX.IntrinsicElements["button"] & {
     /** Left aligned icon */
     startIcon?: IconComponentType;

package/esm/Dropdown/components/DropdownCollapsibleItem/DropdownCollapsibleItemsMultiGroup.d.ts

@@ -1,5 +1,4 @@
-import { VFC } from "react";
-import type { ReactNode } from "react";
+import type { ReactNode, VFC } from "react";
 export declare type DropdownCollapsibleItemsMultiGroupProps = {
     initialExpandedItems?: string[];
     children: ReactNode;

package/esm/Dropdown/components/DropdownCollapsibleItem/DropdownCollapsibleItemsSingleGroup.d.ts

@@ -1,5 +1,4 @@
-import { VFC } from "react";
-import type { ReactNode } from "react";
+import type { ReactNode, VFC } from "react";
 export declare type DropdownCollapsibleItemsExclusiveGroupProps = {
     initialExpandedItem?: string;
     children: ReactNode;

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

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

package/esm/Dropdown/components/DropdownLinkItem.js

@@ -1,11 +1,12 @@
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-var _templateObject, _templateObject2, _templateObject3;
+var _templateObject, _templateObject2, _templateObject3, _templateObject4;
 var _excluded = ["toggle", "disabled", "startIcon", "className", "children"];
 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 { ExternalLink } from "react-feather";
 import stl from "../../styles/helpers/satellitePrefixer";
 import useLinkProps from "../../utils/useLinkProps";
 import useDropdownItemProps from "../useDropdownItemProps";
@@ -14,6 +15,7 @@ import { jsxs as _jsxs } from "react/jsx-runtime";
 export var DropdownLinkItem = function DropdownLinkItem(props) {
   var dropdownItemProps = useDropdownItemProps(props);
   var linkProps = useLinkProps(_objectSpread(_objectSpread({}, props), dropdownItemProps));
+  var isExternalLink = linkProps.target === "_blank";
   // `toggle` and `disabled` is destructured here because we don't want them passed to the `a`
   var _props$dropdownItemPr = _objectSpread(_objectSpread(_objectSpread({}, props), dropdownItemProps), linkProps),
     toggle = _props$dropdownItemPr.toggle,
@@ -31,6 +33,9 @@ export var DropdownLinkItem = function DropdownLinkItem(props) {
     }), /*#__PURE__*/_jsx("span", {
       className: stl(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["w-full truncate"]))),
       children: children
+    }), isExternalLink && /*#__PURE__*/_jsx(ExternalLink, {
+      className: stl(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["ml-1 shrink-0"]))),
+      size: "1em"
     })]
   }));
 };

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

@@ -1,6 +1,6 @@
 import type { ReactNode, VFC } from "react";
-import { RadioButtonProps } from "../../RadioGroup";
-import { DropdownBaseItemProps } from "../useDropdownItemProps";
+import type { RadioButtonProps } from "../../RadioGroup";
+import type { DropdownBaseItemProps } from "../useDropdownItemProps";
 export interface DropdownRadioItemProps extends RadioButtonProps, DropdownBaseItemProps<HTMLInputElement> {
     children?: ReactNode;
 }

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

@@ -1,7 +1,7 @@
 import type { ReactNode, VFC } from "react";
-import { ToggleProps } from "../../Toggle";
+import type { ToggleProps } from "../../Toggle";
 import type { IconComponentType } from "../../types";
-import { DropdownBaseItemProps } from "../useDropdownItemProps";
+import type { DropdownBaseItemProps } from "../useDropdownItemProps";
 export interface DropdownToggleItemProps extends ToggleProps, DropdownBaseItemProps<HTMLInputElement> {
     /** Left aligned icon */
     startIcon?: IconComponentType;

package/esm/Dropzone/Dropzone.d.ts

@@ -1,7 +1,8 @@
 import type { VFC } from "react";
-import { FileRejection, DropzoneProps as ReactDropZoneProps } from "react-dropzone";
+import type { FileRejection, DropzoneProps as ReactDropZoneProps } from "react-dropzone";
 export declare type DropzoneLocale = {
     clearInput?: string;
+    placeholder?: (multiple: boolean) => string;
 };
 export interface DropzoneBaseProps {
     id?: string;