@algolia/satellite 1.0.0-v3.99 → 1.0.0

package/dist/cjs/Tabs/components/LinkTab.d.ts

@@ -0,0 +1,8 @@
+import type { MouseEventHandler, VFC } from "react";
+import type { LinkTab as LinkTabType } from "../types";
+export interface LinkTabProps {
+    tab: LinkTabType;
+    onClick?: MouseEventHandler<HTMLAnchorElement>;
+    selected: boolean;
+}
+export declare const LinkTab: VFC<LinkTabProps>;

package/dist/cjs/Tabs/components/LinkTab.js

@@ -0,0 +1,83 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.LinkTab = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+var _clsx = _interopRequireDefault(require("clsx"));
+var _Badge = require("../../Badge");
+var _satellitePrefixer = _interopRequireDefault(require("../../styles/helpers/satellitePrefixer"));
+var _useLinkProps = require("../../utils/useLinkProps");
+var _utils = require("../utils");
+var _jsxRuntime = require("react/jsx-runtime");
+var _templateObject, _templateObject2;
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var getNextNonDisabledSibling = function getNextNonDisabledSibling(el) {
+  var _ref;
+  if (!el) return null;
+  var next = el;
+  do {
+    var _next, _next$nextElementSibl, _next2, _next3;
+    next = (_next$nextElementSibl = (_next2 = next) === null || _next2 === void 0 ? void 0 : _next2.nextElementSibling) !== null && _next$nextElementSibl !== void 0 ? _next$nextElementSibl : (_next3 = next) === null || _next3 === void 0 || (_next3 = _next3.parentElement) === null || _next3 === void 0 ? void 0 : _next3.firstElementChild;
+  } while ((_next = next) !== null && _next !== void 0 && _next.getAttribute("aria-disabled"));
+  return (_ref = next) !== null && _ref !== void 0 ? _ref : null;
+};
+var getPreviousNonDisabledSibling = function getPreviousNonDisabledSibling(el) {
+  var _ref2;
+  if (!el) return null;
+  var next = el;
+  do {
+    var _next4, _next$previousElement, _next5, _next6;
+    next = (_next$previousElement = (_next5 = next) === null || _next5 === void 0 ? void 0 : _next5.previousElementSibling) !== null && _next$previousElement !== void 0 ? _next$previousElement : (_next6 = next) === null || _next6 === void 0 || (_next6 = _next6.parentElement) === null || _next6 === void 0 ? void 0 : _next6.lastElementChild;
+  } while ((_next4 = next) !== null && _next4 !== void 0 && _next4.getAttribute("aria-disabled"));
+  return (_ref2 = next) !== null && _ref2 !== void 0 ? _ref2 : null;
+};
+var LinkTab = exports.LinkTab = function LinkTab(_ref3) {
+  var tab = _ref3.tab,
+    _onClick = _ref3.onClick,
+    selected = _ref3.selected;
+  var variant = tab.variant || "accent";
+  var selectionProps = selected ? {
+    "aria-selected": true,
+    tabIndex: 0
+  } : {
+    "aria-selected": false,
+    tabIndex: -1
+  };
+  var linkProps = (0, _useLinkProps.useLinkProps)({
+    href: tab.to,
+    disabled: tab.disabled,
+    onClick: function onClick(evt) {
+      if (_onClick) {
+        _onClick(evt);
+      }
+    }
+  });
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("a", _objectSpread(_objectSpread(_objectSpread({}, linkProps), selectionProps), {}, {
+    id: tab.id,
+    role: "tab",
+    className: (0, _clsx["default"])(_utils.ACTIVE_UNDERLINE_VARIANT_CLASSNAMES[variant], (0, _satellitePrefixer["default"])(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["tab pb-3 text-base leading-sm hover:no-underline"]))), tab.className),
+    onKeyDown: function onKeyDown(evt) {
+      if (tab.disabled) return;
+      if (evt.key === "ArrowRight") {
+        var nextElement = getNextNonDisabledSibling(evt.currentTarget);
+        nextElement === null || nextElement === void 0 || nextElement.click();
+        nextElement === null || nextElement === void 0 || nextElement.focus();
+      } else if (evt.key === "ArrowLeft") {
+        var previousElement = getPreviousNonDisabledSibling(evt.currentTarget);
+        previousElement === null || previousElement === void 0 || previousElement.click();
+        previousElement === null || previousElement === void 0 || previousElement.focus();
+      }
+    },
+    children: [tab.label, !!tab.value && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Badge.Badge, {
+      size: "small",
+      variant: variant,
+      className: (0, _satellitePrefixer["default"])(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["ml-2 text-grey-600"]))),
+      children: tab.value
+    })]
+  }));
+};

package/dist/cjs/Tabs/index.d.ts

@@ -0,0 +1,3 @@
+export * from "./LinkTabs";
+export * from "./ContentTabs";
+export * from "./types";

package/dist/cjs/Tabs/index.js

@@ -0,0 +1,38 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _LinkTabs = require("./LinkTabs");
+Object.keys(_LinkTabs).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _LinkTabs[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _LinkTabs[key];
+    }
+  });
+});
+var _ContentTabs = require("./ContentTabs");
+Object.keys(_ContentTabs).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _ContentTabs[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _ContentTabs[key];
+    }
+  });
+});
+var _types = require("./types");
+Object.keys(_types).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _types[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _types[key];
+    }
+  });
+});

package/dist/cjs/Tabs/types.d.ts

@@ -0,0 +1,34 @@
+import type { MouseEvent, ReactNode } from "react";
+import type { LocationSensorState } from "react-use/lib/useLocation";
+import type { ColorVariant } from "../types";
+export interface BaseTab {
+    id?: string;
+    label: ReactNode;
+    variant?: ColorVariant;
+    disabled?: boolean;
+    value?: string;
+    /** @ignore */
+    className?: string;
+}
+export declare type UrlMatcher = (tab: LinkTab, location: LocationSensorState) => boolean;
+export interface LinkTab extends BaseTab {
+    to: string;
+}
+export interface LinkTabsProps {
+    /** @ignore */
+    className?: string;
+    tabs: LinkTab[];
+    onTabClick?(event: MouseEvent<HTMLAnchorElement>, tab: LinkTab): void;
+    urlMatcher?: UrlMatcher;
+}
+export interface ContentTab extends BaseTab {
+    content: ReactNode;
+}
+export interface ContentTabsProps {
+    /** @ignore */
+    className?: string;
+    tabs: ContentTab[];
+    tabIndex?: number;
+    defaultIndex?: number;
+    onChange?: (tabIndex: number) => void;
+}

package/dist/cjs/Tabs/types.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/dist/cjs/Tabs/utils.d.ts

@@ -0,0 +1,2 @@
+import type { ColorVariant } from "../types";
+export declare const ACTIVE_UNDERLINE_VARIANT_CLASSNAMES: Record<ColorVariant, string>;

package/dist/cjs/Tabs/utils.js

@@ -0,0 +1,18 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ACTIVE_UNDERLINE_VARIANT_CLASSNAMES = void 0;
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+var _satellitePrefixer = _interopRequireDefault(require("../styles/helpers/satellitePrefixer"));
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
+var ACTIVE_UNDERLINE_VARIANT_CLASSNAMES = exports.ACTIVE_UNDERLINE_VARIANT_CLASSNAMES = {
+  grey: (0, _satellitePrefixer["default"])(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["tab-grey"]))),
+  accent: (0, _satellitePrefixer["default"])(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["tab-accent"]))),
+  green: (0, _satellitePrefixer["default"])(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["tab-green"]))),
+  blue: (0, _satellitePrefixer["default"])(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["tab-blue"]))),
+  orange: (0, _satellitePrefixer["default"])(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2["default"])(["tab-orange"]))),
+  red: (0, _satellitePrefixer["default"])(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2["default"])(["tab-red"])))
+};

package/dist/cjs/Tag/Tag.d.ts

@@ -0,0 +1,30 @@
+import type { DetailedHTMLProps, HTMLAttributes, MouseEventHandler } from "react";
+import type { ColorVariant } from "../types";
+export declare type TagVariants = ColorVariant | "pink";
+export declare type TagLocale = {
+    addButton?: string | ((title: string) => string);
+    removeButton?: string | ((title: string) => string);
+};
+export interface TagProps extends DetailedHTMLProps<HTMLAttributes<HTMLSpanElement>, HTMLSpanElement> {
+    /** The "pink" variant should only be used for **Algolia admin** related things. */
+    variant?: TagVariants;
+    /** Handler function called when the "add" button is clicked. */
+    onAdd?: MouseEventHandler<HTMLElement>;
+    /** The tooltip text to display when hovering over the "add" button. */
+    addTooltip?: string;
+    /** Handler function called when the "remove" button is clicked. */
+    onRemove?: MouseEventHandler<HTMLElement>;
+    /** The tooltip text to display when hovering over the "remove" button. */
+    removeTooltip?: string;
+    /**
+     * Customize the text describing the "add" and "remove" buttons.
+     * If not provided, default values will be used.
+     */
+    locale?: TagLocale;
+}
+/**
+ * The `Tag` component is an interactive and customizable text label with varied color options.
+ *
+ * See the [Tag documentation page](https://satellite.algolia.com/components/forms/tag) for more information.
+ */
+export declare const Tag: import("react").ForwardRefExoticComponent<Pick<TagProps, "dir" | "slot" | "style" | "title" | "children" | "id" | "variant" | "locale" | "className" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "draggable" | "hidden" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "key" | "onAdd" | "addTooltip" | "onRemove" | "removeTooltip"> & import("react").RefAttributes<HTMLSpanElement>>;

package/dist/cjs/Tag/Tag.js

@@ -0,0 +1,121 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Tag = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+var _clsx = _interopRequireDefault(require("clsx"));
+var _react = require("react");
+var _AutoCompleteContext = require("../AutoComplete/components/AutoCompleteContext");
+var _Icons = require("../Icons");
+var _Satellite = require("../Satellite");
+var _satellitePrefixer = _interopRequireDefault(require("../styles/helpers/satellitePrefixer"));
+var _Tooltip = require("../Tooltip");
+var _jsxRuntime = require("react/jsx-runtime");
+var _excluded = ["children", "variant", "className", "onAdd", "addTooltip", "onRemove", "removeTooltip", "locale"];
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20;
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var DEFAULT_TAG_LOCALE = {
+  addButton: function addButton(title) {
+    return "Add \"".concat(title, "\"");
+  },
+  removeButton: function removeButton(title) {
+    return "Remove \"".concat(title, "\"");
+  }
+};
+var VARIANT_CLASSNAMES = {
+  accent: (0, _satellitePrefixer["default"])(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["bg-accent-100 border-accent-200 text-accent-700"]))),
+  grey: (0, _satellitePrefixer["default"])(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["bg-grey-100 border-grey-200 text-grey-700"]))),
+  blue: (0, _satellitePrefixer["default"])(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["bg-blue-100 border-blue-200 text-blue-800"]))),
+  green: (0, _satellitePrefixer["default"])(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["bg-green-100 border-green-300 text-green-900"]))),
+  orange: (0, _satellitePrefixer["default"])(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2["default"])(["bg-orange-100 border-orange-300 text-orange-800"]))),
+  red: (0, _satellitePrefixer["default"])(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2["default"])(["bg-red-100 border-red-200 text-red-700"]))),
+  pink: (0, _satellitePrefixer["default"])(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2["default"])(["bg-pink-100 border-pink-200 text-pink-700"])))
+};
+var BUTTON_VARIANT_CLASSNAMES = {
+  accent: (0, _satellitePrefixer["default"])(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2["default"])(["border-accent-200 hover:bg-accent-200 focus:bg-accent-200"]))),
+  grey: (0, _satellitePrefixer["default"])(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2["default"])(["border-grey-200 hover:bg-grey-200 focus:bg-grey-200"]))),
+  blue: (0, _satellitePrefixer["default"])(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2["default"])(["border-blue-200 hover:bg-blue-200 focus:bg-blue-200"]))),
+  green: (0, _satellitePrefixer["default"])(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2["default"])(["border-green-300 hover:bg-green-300 focus:bg-green-300"]))),
+  orange: (0, _satellitePrefixer["default"])(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteral2["default"])(["border-orange-300 hover:bg-orange-300 focus:bg-orange-300"]))),
+  red: (0, _satellitePrefixer["default"])(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteral2["default"])(["border-red-200 hover:bg-red-200 focus:bg-red-200"]))),
+  pink: (0, _satellitePrefixer["default"])(_templateObject14 || (_templateObject14 = (0, _taggedTemplateLiteral2["default"])(["border-pink-200 hover:bg-pink-200 focus:bg-pink-200"])))
+};
+
+/**
+ * The `Tag` component is an interactive and customizable text label with varied color options.
+ *
+ * See the [Tag documentation page](https://satellite.algolia.com/components/forms/tag) for more information.
+ */
+var Tag = exports.Tag = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
+  var children = _ref.children,
+    _ref$variant = _ref.variant,
+    variant = _ref$variant === void 0 ? "grey" : _ref$variant,
+    className = _ref.className,
+    onAdd = _ref.onAdd,
+    addTooltip = _ref.addTooltip,
+    onRemove = _ref.onRemove,
+    removeTooltip = _ref.removeTooltip,
+    propsLocale = _ref.locale,
+    props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
+  var title = typeof children === "string" ? children : "tag";
+  var contextLocale = (0, _Satellite.useLocale)("tag");
+  var locale = _objectSpread(_objectSpread(_objectSpread({}, DEFAULT_TAG_LOCALE), contextLocale), propsLocale);
+  var tagClassName = (0, _clsx["default"])((0, _satellitePrefixer["default"])(_templateObject15 || (_templateObject15 = (0, _taggedTemplateLiteral2["default"])(["tag"]))), VARIANT_CLASSNAMES[variant], className);
+  var isInsideAutoComplete = (0, _AutoCompleteContext.useIsInsideAutoComplete)();
+  var tabIndexProps = isInsideAutoComplete ? {
+    tabIndex: -1
+  } : {};
+  var addable = Boolean(onAdd);
+  var removable = Boolean(onRemove);
+  var handleAdd = function handleAdd(evt) {
+    evt.stopPropagation();
+    onAdd === null || onAdd === void 0 || onAdd(evt);
+  };
+  var handleRemove = function handleRemove(evt) {
+    evt.stopPropagation();
+    onRemove === null || onRemove === void 0 || onRemove(evt);
+  };
+  var content = /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+    className: (0, _satellitePrefixer["default"])(_templateObject16 || (_templateObject16 = (0, _taggedTemplateLiteral2["default"])(["truncate flex-1"]))),
+    children: children
+  });
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", _objectSpread(_objectSpread({}, props), {}, {
+    className: tagClassName,
+    ref: ref,
+    children: [addable ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Tooltip.TooltipWrapper, {
+      content: addTooltip,
+      hideDelay: 0,
+      side: "bottom",
+      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("button", _objectSpread(_objectSpread({}, tabIndexProps), {}, {
+        className: (0, _clsx["default"])((0, _satellitePrefixer["default"])(_templateObject17 || (_templateObject17 = (0, _taggedTemplateLiteral2["default"])(["tag-add-button"]))), !removable && (0, _satellitePrefixer["default"])(_templateObject18 || (_templateObject18 = (0, _taggedTemplateLiteral2["default"])(["-mr-2"]))), BUTTON_VARIANT_CLASSNAMES[variant]),
+        type: "button",
+        onClick: handleAdd,
+        "aria-label": typeof locale.addButton === "function" ? locale.addButton(title) : locale.addButton,
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Icons.PlusIcon, {
+          size: "1em"
+        }), content]
+      }))
+    }) : content, removable && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Tooltip.TooltipWrapper, {
+      content: removeTooltip,
+      hideDelay: 0,
+      side: "bottom",
+      align: "start",
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)("button", _objectSpread(_objectSpread({}, tabIndexProps), {}, {
+        className: (0, _clsx["default"])((0, _satellitePrefixer["default"])(_templateObject19 || (_templateObject19 = (0, _taggedTemplateLiteral2["default"])(["tag-close-button p-1"]))), !addable && (0, _satellitePrefixer["default"])(_templateObject20 || (_templateObject20 = (0, _taggedTemplateLiteral2["default"])(["ml-2"]))), BUTTON_VARIANT_CLASSNAMES[variant]),
+        type: "button",
+        onClick: handleRemove,
+        "aria-label": typeof locale.removeButton === "function" ? locale.removeButton(title) : locale.removeButton,
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icons.XIcon, {
+          size: "1em"
+        })
+      }))
+    })]
+  }));
+});
+Tag.displayName = "Tag";

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

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

package/dist/cjs/Tag/Tag.tailwind.js

@@ -0,0 +1,54 @@
+"use strict";
+
+// @ts-check
+var plugin = require("tailwindcss/plugin");
+var tagPlugin = plugin(function (_ref) {
+  var addComponents = _ref.addComponents,
+    theme = _ref.theme;
+  addComponents({
+    ".tag": {
+      display: "inline-flex",
+      alignItems: "center",
+      borderRadius: theme("borderRadius.DEFAULT"),
+      border: "1px solid transparent",
+      overflow: "hidden",
+      height: theme("spacing.6"),
+      padding: "0 ".concat(theme("spacing.2")),
+      fontSize: theme("fontSize.base"),
+      lineHeight: theme("lineHeight.sm")
+    },
+    ".tag-add-button": {
+      display: "inline-flex",
+      alignItems: "center",
+      height: "100%",
+      paddingLeft: theme("spacing.2"),
+      paddingRight: theme("spacing.2"),
+      marginLeft: "-".concat(theme("spacing.2")),
+      columnGap: theme("spacing.2"),
+      "&, &:focus": {
+        outlineWidth: "0px"
+      },
+      "&:focus-visible": {
+        outlineOffset: "-2px",
+        outlineWidth: "3px",
+        outlineColor: theme("colors.accent.600")
+      }
+    },
+    ".tag-close-button": {
+      height: "100%",
+      paddingLeft: theme("spacing.1"),
+      paddingRight: theme("spacing.1"),
+      marginRight: "-".concat(theme("spacing.2")),
+      borderLeft: "1px solid transparent",
+      "&, &:focus": {
+        outlineWidth: "0px"
+      },
+      "&:focus-visible": {
+        outlineOffset: "-2px",
+        outlineWidth: "3px",
+        outlineColor: theme("colors.accent.600")
+      }
+    }
+  });
+});
+module.exports = tagPlugin;

package/dist/cjs/Tag/index.d.ts

@@ -0,0 +1 @@
+export * from "./Tag";

package/dist/cjs/Tag/index.js

@@ -0,0 +1,16 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _Tag = require("./Tag");
+Object.keys(_Tag).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _Tag[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _Tag[key];
+    }
+  });
+});

package/dist/cjs/TextArea/TextArea.d.ts

@@ -0,0 +1,9 @@
+import type { TextareaHTMLAttributes } from "react";
+export interface TextAreaProps extends TextareaHTMLAttributes<HTMLTextAreaElement> {
+}
+/**
+ * The `TextArea` component is a multiline input field for extensive text, ideal for detailed feedback, descriptions, or comments.
+ *
+ * See the [Text Area documentation page](https://satellite.algolia.com/components/forms/text-area) for more information.
+ */
+export declare const TextArea: import("react").ForwardRefExoticComponent<TextAreaProps & import("react").RefAttributes<HTMLTextAreaElement>>;

package/dist/cjs/TextArea/TextArea.js

@@ -0,0 +1,32 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.TextArea = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _clsx = _interopRequireDefault(require("clsx"));
+var _react = require("react");
+var _satellitePrefixer = _interopRequireDefault(require("../styles/helpers/satellitePrefixer"));
+var _jsxRuntime = require("react/jsx-runtime");
+var _templateObject;
+var _excluded = ["className"];
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+/**
+ * The `TextArea` component is a multiline input field for extensive text, ideal for detailed feedback, descriptions, or comments.
+ *
+ * See the [Text Area documentation page](https://satellite.algolia.com/components/forms/text-area) for more information.
+ */
+var TextArea = exports.TextArea = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
+  var className = _ref.className,
+    otherProps = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("textarea", _objectSpread(_objectSpread({}, otherProps), {}, {
+    className: (0, _clsx["default"])((0, _satellitePrefixer["default"])(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["text-area"]))), className),
+    ref: ref
+  }));
+});
+TextArea.displayName = "TextArea";

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

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

package/dist/cjs/TextArea/TextArea.tailwind.js

@@ -0,0 +1,42 @@
+"use strict";
+
+// @ts-check
+var plugin = require("tailwindcss/plugin");
+var disabledColor = require("../styles/disabledColor");
+var rgba = require("../styles/rgba");
+var textAreaPlugin = plugin(function (_ref) {
+  var addComponents = _ref.addComponents,
+    theme = _ref.theme;
+  addComponents({
+    ".text-area": {
+      width: "100%",
+      padding: theme("spacing.4"),
+      backgroundColor: theme("colors.white"),
+      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",
+      fontSize: theme("fontSize.base"),
+      lineHeight: theme("lineHeight.base"),
+      "&::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")),
+        outline: "none"
+      },
+      "&:disabled": {
+        cursor: "not-allowed",
+        color: theme("colors.grey.300"),
+        background: "linear-gradient(-180deg, ".concat(theme("colors.white"), " 0%, ").concat(theme("colors.grey.100"), " 100%)"),
+        borderColor: disabledColor(theme("colors.grey.200")),
+        boxShadow: "none"
+      }
+    }
+  });
+});
+module.exports = textAreaPlugin;

package/dist/cjs/TextArea/index.d.ts

@@ -0,0 +1 @@
+export * from "./TextArea";

package/dist/cjs/TextArea/index.js

@@ -0,0 +1,16 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _TextArea = require("./TextArea");
+Object.keys(_TextArea).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _TextArea[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _TextArea[key];
+    }
+  });
+});

package/dist/cjs/TextWrap/TextWrap.d.ts

@@ -0,0 +1,12 @@
+import type { VFC } from "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;
+}
+/**
+ * The `TextWrap` component is used to wrap text and truncate it with an ellipsis if it overflows.
+ *
+ * See the [Text Wrap documentation page](https://satellite.algolia.com/components/misc/text-wrap) for more information.
+ */
+export declare const TextWrap: VFC<TextWrapProps>;

package/dist/cjs/TextWrap/TextWrap.js

@@ -0,0 +1,58 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.TextWrap = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+var _satellitePrefixer = _interopRequireDefault(require("../styles/helpers/satellitePrefixer"));
+var _isCssPropertySupported = require("../utils/isCssPropertySupported");
+var _jsxRuntime = require("react/jsx-runtime");
+var _excluded = ["children", "maxLines", "style"];
+var _templateObject;
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var BASE_STYLES = (0, _isCssPropertySupported.isCssPropertySupported)("overflowWrap", "anywhere") ? {
+  whiteSpace: "normal",
+  overflowWrap: "anywhere"
+} : {
+  wordBreak: "break-all"
+};
+var SEPARATOR_ELEMENT = /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+  className: (0, _satellitePrefixer["default"])(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["invisible"]))),
+  "aria-hidden": "true",
+  children: "\u200B"
+});
+
+/**
+ * The `TextWrap` component is used to wrap text and truncate it with an ellipsis if it overflows.
+ *
+ * See the [Text Wrap documentation page](https://satellite.algolia.com/components/misc/text-wrap) for more information.
+ */
+var TextWrap = exports.TextWrap = function TextWrap(_ref) {
+  var text = _ref.children,
+    maxLines = _ref.maxLines,
+    style = _ref.style,
+    spanProps = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
+  var clampStyle = typeof maxLines !== "undefined" && maxLines >= 1 ? _objectSpread(_objectSpread({}, BASE_STYLES), {}, {
+    display: "-webkit-box",
+    WebkitBoxOrient: "vertical",
+    WebkitLineClamp: maxLines,
+    overflow: "hidden"
+  }) : BASE_STYLES;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("span", _objectSpread(_objectSpread({
+    style: _objectSpread(_objectSpread({}, clampStyle), style)
+  }, spanProps), {}, {
+    children: text.split(/([\W_]+)/).flatMap(function (part, idx) {
+      if (!part) {
+        return null;
+      }
+      return idx % 2 === 0 ? part : /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
+        children: [part, SEPARATOR_ELEMENT]
+      }, "".concat(idx, "-").concat(part));
+    }).filter(Boolean)
+  }));
+};