@algolia/satellite 1.0.0-beta.18 → 1.0.0-beta.180

package/cjs/TextWrap/index.d.ts

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

package/cjs/TextWrap/index.js

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

package/cjs/Toast/Toast.d.ts

@@ -0,0 +1,5 @@
+import type { FC, HTMLAttributes } from "react";
+import type { Notification } from "./types";
+export declare type ToastLocale = Notification["locale"];
+export declare type ToastProps = Omit<Notification, "id" | "content" | "autoDismissAfter"> & Omit<HTMLAttributes<HTMLElement>, "title">;
+export declare const Toast: FC<ToastProps>;

package/cjs/Toast/Toast.js

@@ -0,0 +1,110 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Toast = 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 ToastPrimitive = _interopRequireWildcard(require("@radix-ui/react-toast"));
+var _clsx = _interopRequireDefault(require("clsx"));
+var _Button = require("../Button");
+var _Card = require("../Card");
+var _Icons = require("../Icons");
+var _ProgressSpinner = require("../ProgressSpinner");
+var _Satellite = require("../Satellite");
+var _satellitePrefixer = _interopRequireDefault(require("../styles/helpers/satellitePrefixer"));
+var _isRenderedChild = require("../utils/isRenderedChild");
+var _jsxRuntime = require("react/jsx-runtime");
+var _excluded = ["onDismiss", "title", "icon", "loading", "variant", "locale", "children"];
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19;
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var DEFAULT_TOAST_LOCALE = {
+  dismissText: "Dismiss"
+};
+var VARIANT_CLASSNAMES = {
+  grey: (0, _satellitePrefixer["default"])(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["bg-grey-500"]))),
+  accent: (0, _satellitePrefixer["default"])(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["bg-accent-500"]))),
+  blue: (0, _satellitePrefixer["default"])(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["bg-blue-600"]))),
+  green: (0, _satellitePrefixer["default"])(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["bg-green-600"]))),
+  orange: (0, _satellitePrefixer["default"])(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2["default"])(["bg-orange-500"]))),
+  red: (0, _satellitePrefixer["default"])(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2["default"])(["bg-red-500"])))
+};
+var VARIANT_SPINNER_CLASSNAMES = {
+  grey: (0, _satellitePrefixer["default"])(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2["default"])(["border-grey-500"]))),
+  accent: (0, _satellitePrefixer["default"])(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2["default"])(["border-accent-500"]))),
+  blue: (0, _satellitePrefixer["default"])(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2["default"])(["border-blue-600"]))),
+  green: (0, _satellitePrefixer["default"])(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2["default"])(["border-green-600"]))),
+  orange: (0, _satellitePrefixer["default"])(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2["default"])(["border-orange-500"]))),
+  red: (0, _satellitePrefixer["default"])(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteral2["default"])(["border-red-500"])))
+};
+var Toast = exports.Toast = function Toast(_ref) {
+  var onDismiss = _ref.onDismiss,
+    title = _ref.title,
+    _ref$icon = _ref.icon,
+    Icon = _ref$icon === void 0 ? _Icons.CheckIcon : _ref$icon,
+    _ref$loading = _ref.loading,
+    loading = _ref$loading === void 0 ? false : _ref$loading,
+    _ref$variant = _ref.variant,
+    variant = _ref$variant === void 0 ? "accent" : _ref$variant,
+    propsLocale = _ref.locale,
+    children = _ref.children,
+    rest = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
+  var contextLocale = (0, _Satellite.useLocale)("toast");
+  var locale = _objectSpread(_objectSpread(_objectSpread({}, DEFAULT_TOAST_LOCALE), contextLocale), propsLocale);
+  if (process.env.NODE_ENV !== "production") {
+    if (typeof onDismiss === "undefined") {
+      console.warn("Toast: You should always include an `onDismiss` callback, this is crucial for users with limited abilities.");
+    }
+  }
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Card.Card, _objectSpread(_objectSpread({}, rest), {}, {
+    fullBleed: true,
+    className: (0, _satellitePrefixer["default"])(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteral2["default"])(["toast shadow-z500"]))),
+    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      className: (0, _satellitePrefixer["default"])(_templateObject14 || (_templateObject14 = (0, _taggedTemplateLiteral2["default"])(["p-4 flex"]))),
+      children: [loading ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_ProgressSpinner.ProgressSpinner, {
+        "aria-hidden": true,
+        size: 24,
+        className: VARIANT_SPINNER_CLASSNAMES[variant]
+      }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(Icon, {
+        "aria-hidden": true,
+        className: (0, _clsx["default"])((0, _satellitePrefixer["default"])(_templateObject15 || (_templateObject15 = (0, _taggedTemplateLiteral2["default"])(["shrink-0 text-white rounded-full p-1"]))), VARIANT_CLASSNAMES[variant]),
+        size: 24
+      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+        className: (0, _satellitePrefixer["default"])(_templateObject16 || (_templateObject16 = (0, _taggedTemplateLiteral2["default"])(["flex-1 ml-4 min-w-0 break-words"]))),
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+          className: (0, _satellitePrefixer["default"])(_templateObject17 || (_templateObject17 = (0, _taggedTemplateLiteral2["default"])(["flex justify-between"]))),
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(ToastPrimitive.Title, {
+            asChild: true,
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)("h3", {
+              className: (0, _satellitePrefixer["default"])(_templateObject18 || (_templateObject18 = (0, _taggedTemplateLiteral2["default"])(["overflow-hidden mt-0.5"]))),
+              children: title
+            })
+          }), onDismiss && /*#__PURE__*/(0, _jsxRuntime.jsx)(ToastPrimitive.Close, {
+            asChild: true,
+            onClick: function onClick(e) {
+              // Prevent the default Radix handler so that `onDismiss` is not called twice in the `Toasts` component.
+              e.preventDefault();
+              onDismiss === null || onDismiss === void 0 || onDismiss();
+            },
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.IconButton, {
+              icon: _Icons.XIcon,
+              title: locale.dismissText,
+              variant: "subtle",
+              size: "small"
+            })
+          })]
+        }), (0, _isRenderedChild.isRenderedChild)(children) && /*#__PURE__*/(0, _jsxRuntime.jsx)(ToastPrimitive.Description, {
+          className: (0, _satellitePrefixer["default"])(_templateObject19 || (_templateObject19 = (0, _taggedTemplateLiteral2["default"])(["text-grey-600 mt-2"]))),
+          children: children
+        })]
+      })]
+    })
+  }));
+};

package/cjs/Toast/Toast.tailwind.d.ts

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

package/cjs/Toast/Toast.tailwind.js

@@ -0,0 +1,34 @@
+"use strict";
+
+// @ts-check
+var plugin = require("tailwindcss/plugin");
+var toastPlugin = plugin(function (_ref) {
+  var addComponents = _ref.addComponents;
+  var TRANSITION_TIMEOUT = 500;
+  addComponents({
+    ".toast": {
+      width: "320px"
+    }
+  });
+  addComponents({
+    ".toasts_item-enter": {
+      opacity: "0.01",
+      transform: "translate(0, 80px)"
+    },
+    ".toasts_item-enter-active": {
+      opacity: "1",
+      transform: "translate(0, 0)",
+      transition: "all ".concat(TRANSITION_TIMEOUT, "ms ease-in")
+    },
+    ".toasts_item-exit": {
+      opacity: "1",
+      transform: "translate(0, 0)"
+    },
+    ".toasts_item-exit-active": {
+      opacity: "0.01",
+      transform: "translate(0, 80px)",
+      transition: "all ".concat(TRANSITION_TIMEOUT, "ms ease-in")
+    }
+  });
+});
+module.exports = toastPlugin;

package/cjs/Toast/Toasts.d.ts

@@ -0,0 +1,20 @@
+import type { VFC } from "react";
+import type { Notification } from "./types";
+export declare type ToastsLocale = {
+    hotkeyLabel?: string;
+};
+export interface ToastsProps {
+    /**
+     * Define the array of notifications.
+     * @example [{ id: "test", title: "Test", content: "Example" }]
+     */
+    notifications: Notification[];
+    /** Define the `Toasts` locale. */
+    locale?: ToastsLocale;
+}
+/**
+ * Toasts are brief notifications that providing timely feedback to users before vanishing after a short duration.
+ *
+ * See the [Toast documentation page](https://satellite.algolia.com/components/feedback/toast) for more information.
+ */
+export declare const Toasts: VFC<ToastsProps>;

package/cjs/Toast/Toasts.js

@@ -0,0 +1,101 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Toasts = void 0;
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var ToastPrimitive = _interopRequireWildcard(require("@radix-ui/react-toast"));
+var _reactTransitionGroup = require("react-transition-group");
+var _Satellite = require("../Satellite");
+var _satellitePrefixer = _interopRequireDefault(require("../styles/helpers/satellitePrefixer"));
+var _prefersReducedMotion = require("../utils/prefersReducedMotion");
+var _Toast = require("./Toast");
+var _jsxRuntime = require("react/jsx-runtime");
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
+var _excluded = ["content", "id", "autoDismissAfter"];
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var DEFAULT_TOASTS_LOCALE = {
+  hotkeyLabel: "Notifications"
+};
+var TRANSITION_TIMEOUT = 500;
+
+/**
+ * Toasts are brief notifications that providing timely feedback to users before vanishing after a short duration.
+ *
+ * See the [Toast documentation page](https://satellite.algolia.com/components/feedback/toast) for more information.
+ */
+var Toasts = exports.Toasts = function Toasts(_ref) {
+  var _ref$notifications = _ref.notifications,
+    notifications = _ref$notifications === void 0 ? [] : _ref$notifications,
+    propsLocale = _ref.locale;
+  var contextLocale = (0, _Satellite.useLocale)("toasts");
+  var locale = _objectSpread(_objectSpread(_objectSpread({}, DEFAULT_TOASTS_LOCALE), contextLocale), propsLocale);
+  var createPortal = (0, _Satellite.useCreatePortal)();
+  if (process.env.NODE_ENV !== "production") {
+    if (notifications.length > 3) {
+      console.warn("Toasts: You should not display more than 3 toasts simultaneously.");
+    }
+    if (notifications.find(function (n) {
+      return n.autoDismissAfter && n.autoDismissAfter < 2000;
+    })) {
+      console.warn("Toasts: You should not set `autoDismissAfter` to less than 2000 ms, even for brief messages.");
+    }
+  }
+  return createPortal( /*#__PURE__*/(0, _jsxRuntime.jsxs)(ToastPrimitive.Provider, {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactTransitionGroup.TransitionGroup, {
+      component: null,
+      children: notifications.map(function (_ref2) {
+        var content = _ref2.content,
+          id = _ref2.id,
+          autoDismissAfter = _ref2.autoDismissAfter,
+          rest = (0, _objectWithoutProperties2["default"])(_ref2, _excluded);
+        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactTransitionGroup.CSSTransition, {
+          classNames: !_prefersReducedMotion.prefersReducedMotion ? {
+            enter: (0, _satellitePrefixer["default"])(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["toasts_item-enter"]))),
+            enterActive: (0, _satellitePrefixer["default"])(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["toasts_item-enter-active"]))),
+            exit: (0, _satellitePrefixer["default"])(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["toasts_item-exit"]))),
+            exitActive: (0, _satellitePrefixer["default"])(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["toasts_item-exit-active"])))
+          } : {},
+          timeout: !_prefersReducedMotion.prefersReducedMotion ? TRANSITION_TIMEOUT : 0,
+          appear: true,
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(ToastPrimitive.Root, {
+            open: true,
+            onOpenChange: function onOpenChange(open) {
+              var _rest$onDismiss;
+              if (!open) (_rest$onDismiss = rest.onDismiss) === null || _rest$onDismiss === void 0 || _rest$onDismiss.call(rest);
+            },
+            onSwipeEnd: function onSwipeEnd(e) {
+              return e.preventDefault();
+            } // Prevent swipe gesture
+            ,
+            duration: autoDismissAfter || Infinity,
+            // Accessibility issue from Radix: `role="status"` is not allowed on a `li` element, as a workaround,
+            // we use it on the child.
+            // See https://github.com/radix-ui/primitives/issues/1750
+            role: "listitem",
+            "aria-live": undefined,
+            "aria-atomic": undefined,
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Toast.Toast, _objectSpread(_objectSpread({}, rest), {}, {
+              role: "status",
+              "aria-live": "polite",
+              "aria-atomic": "true",
+              children: content
+            }))
+          })
+        }, id);
+      })
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(ToastPrimitive.Viewport, {
+      hotkey: ["metaKey", "F8"],
+      label: "".concat(locale.hotkeyLabel, " (CmdKey+F8/WinKey+F8)}"),
+      className: (0, _satellitePrefixer["default"])(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2["default"])(["z-notification bottom-0 right-0 fixed flex flex-col items-end p-4 gap-4"])))
+    })]
+  }));
+};

package/cjs/Toast/index.d.ts

@@ -0,0 +1,3 @@
+export * from "./Toast";
+export * from "./Toasts";
+export * from "./types";

package/cjs/Toast/index.js

@@ -0,0 +1,38 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _Toast = require("./Toast");
+Object.keys(_Toast).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _Toast[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _Toast[key];
+    }
+  });
+});
+var _Toasts = require("./Toasts");
+Object.keys(_Toasts).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _Toasts[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _Toasts[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/cjs/Toast/types.d.ts

@@ -0,0 +1,34 @@
+import type { ReactNode, ReactPortal } from "react";
+import type { IconComponentType } from "../Icons";
+import type { ColorVariant } from "../types";
+export declare type Notification = {
+    /** Defines an unique ID for the `Toast`. */
+    id: string;
+    /** Defines the title for the `Toast`. Will be rendered in a heading element. */
+    title: Exclude<ReactNode, ReactPortal>;
+    /** Defines the content for the `Toast`. */
+    content?: Exclude<ReactNode, ReactPortal>;
+    /** Defines the icon for the `Toast`. */
+    icon?: IconComponentType;
+    /**
+     * Defines the color variant of the `Toast`.
+     * @default false
+     */
+    loading?: boolean;
+    /**
+     * Defines the color variant of the `Toast`.
+     * @default "blue"
+     */
+    variant?: ColorVariant;
+    /** Defines if and how long before the `Toast` should be dismissed (in ms). */
+    autoDismissAfter?: number;
+    /**
+     * Defines a function called when the `Toast` dismiss button is clicked or the `autoDismissAfter` time has elapsed.
+     * Dismiss button won't be rendered if absent.
+     */
+    onDismiss?: () => void;
+    /** Define locale for the `Toast`. */
+    locale?: {
+        dismissText?: string;
+    };
+};

package/cjs/Toast/types.js

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

package/cjs/Toggle/Toggle.d.ts

@@ -0,0 +1,12 @@
+import type { HTMLAttributes, InputHTMLAttributes } from "react";
+export declare type ToggleProps = Omit<HTMLAttributes<HTMLInputElement>, "children" | "onChange"> & Pick<InputHTMLAttributes<HTMLInputElement>, "onChange" | "required" | "autoFocus" | "disabled" | "checked" | "defaultChecked"> & {
+    decorative?: boolean;
+};
+/**
+ * The `Toggle` component is used to view or switch between enabled or disabled states.
+ *
+ * See the [Toggle documentation page](https://satellite.algolia.com/components/controls/toggle) for more information.
+ */
+export declare const Toggle: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<HTMLInputElement>, "children" | "onChange"> & Pick<InputHTMLAttributes<HTMLInputElement>, "defaultChecked" | "onChange" | "autoFocus" | "disabled" | "checked" | "required"> & {
+    decorative?: boolean | undefined;
+} & import("react").RefAttributes<HTMLInputElement>>;

package/cjs/Toggle/Toggle.js

@@ -0,0 +1,73 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Toggle = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+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 _clsx = _interopRequireDefault(require("clsx"));
+var _react = require("react");
+var _satellitePrefixer = _interopRequireDefault(require("../styles/helpers/satellitePrefixer"));
+var _jsxRuntime = require("react/jsx-runtime");
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
+var _excluded = ["className", "checked", "decorative", "defaultChecked"];
+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 `Toggle` component is used to view or switch between enabled or disabled states.
+ *
+ * See the [Toggle documentation page](https://satellite.algolia.com/components/controls/toggle) for more information.
+ */
+var Toggle = exports.Toggle = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
+  var className = _ref.className,
+    checked = _ref.checked,
+    decorative = _ref.decorative,
+    defaultChecked = _ref.defaultChecked,
+    inputProps = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
+  var isControlled = typeof checked === "boolean";
+  var _useState = (0, _react.useState)(Boolean(isControlled ? checked : defaultChecked)),
+    _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
+    internalChecked = _useState2[0],
+    setInternalChecked = _useState2[1];
+  var isChecked = Boolean(isControlled ? checked : internalChecked);
+  var isDisabled = inputProps.disabled,
+    onChange = inputProps.onChange;
+  var handleChange = function handleChange(evt) {
+    onChange === null || onChange === void 0 || onChange(evt);
+    if (!isControlled && !evt.isDefaultPrevented()) {
+      setInternalChecked(evt.currentTarget.checked);
+    }
+  };
+  var handleClassName = (0, _clsx["default"])((0, _satellitePrefixer["default"])(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["toggle-handle"]))), isChecked && (0, _satellitePrefixer["default"])(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["toggle-checked"]))), isDisabled && (0, _satellitePrefixer["default"])(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["toggle-disabled"]))));
+  var onClick = function onClick(event) {
+    if (isDisabled) {
+      return;
+    }
+    onChange === null || onChange === void 0 || onChange(event);
+    !isControlled && setInternalChecked(!isChecked);
+  };
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    translate: "yes",
+    className: (0, _clsx["default"])((0, _satellitePrefixer["default"])(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["toggle-container"]))), className),
+    children: [decorative ? /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+      className: handleClassName,
+      onClick: onClick
+    }) : /*#__PURE__*/(0, _jsxRuntime.jsx)("input", _objectSpread(_objectSpread({}, inputProps), {}, {
+      className: handleClassName,
+      disabled: isDisabled,
+      onChange: handleChange,
+      checked: isChecked,
+      "aria-checked": isChecked,
+      type: "checkbox",
+      role: "switch",
+      ref: ref
+    })), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: (0, _satellitePrefixer["default"])(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2["default"])(["toggle"])))
+    })]
+  });
+});
+Toggle.displayName = "Toggle";

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

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

package/cjs/Toggle/Toggle.tailwind.js

@@ -0,0 +1,84 @@
+"use strict";
+
+// @ts-check
+var plugin = require("tailwindcss/plugin");
+var rgba = require("../styles/rgba");
+var togglePlugin = plugin(function (_ref) {
+  var addComponents = _ref.addComponents,
+    theme = _ref.theme;
+  var transition = "all 72ms ease-in-out";
+  addComponents({
+    ".toggle-container": {
+      position: "relative",
+      display: "block",
+      height: "18px",
+      width: "32px",
+      ".toggle-handle": {
+        position: "absolute",
+        top: "0px",
+        left: "0px",
+        width: "100%",
+        height: "100%",
+        opacity: "0",
+        cursor: "pointer",
+        "&.toggle-disabled": {
+          cursor: "not-allowed"
+        }
+      },
+      "&:hover .toggle:after": {
+        transform: "translateX(2px)"
+      },
+      "&:hover .toggle-handle.toggle-checked ~ .toggle:after": {
+        transform: "translateX(12px)"
+      },
+      "&:hover .toggle-handle.toggle-disabled ~ .toggle:after": {
+        transform: "translateX(0px)"
+      },
+      "&:hover .toggle-handle.toggle-checked.toggle-disabled ~ .toggle:after": {
+        transform: "translateX(14px)"
+      }
+    },
+    ".toggle": {
+      position: "absolute",
+      top: "0px",
+      left: "0px",
+      width: "100%",
+      height: "100%",
+      pointerEvents: "none",
+      borderRadius: "9999px",
+      background: theme("colors.grey.500"),
+      boxShadow: "inset 0px 1px 4px 0px ".concat(rgba(theme("colors.grey.500"), 0.2)),
+      transition: transition,
+      "&::after": {
+        position: "absolute",
+        top: "1px",
+        left: "1px",
+        width: "16px",
+        height: "16px",
+        content: '" "',
+        borderRadius: "9999px",
+        background: "linear-gradient(-180deg, ".concat(theme("colors.white"), " 0%, ").concat(theme("colors.grey.50"), " 100%)"),
+        boxShadow: "0px 1px 1px 0px ".concat(theme("colors.shadow.10")),
+        transition: transition
+      },
+      ".toggle-handle.toggle-checked ~ &": {
+        background: theme("colors.accent.600"),
+        boxShadow: "inset 0px 1px 4px 0px ".concat(rgba(theme("colors.grey.900"), 0.1)),
+        "&:after": {
+          transform: "translateX(14px)"
+        }
+      },
+      ".toggle-handle.toggle-disabled ~ &": {
+        background: theme("colors.grey.200")
+      },
+      ".toggle-checked.toggle-handle.toggle-disabled ~ &": {
+        background: theme("colors.xenon.200")
+      }
+    },
+    "input:focus ~ .toggle": {
+      outline: "2px solid ".concat(theme("colors.accent.600")),
+      outlineOffset: "1px"
+    }
+  });
+});
+module.exports = togglePlugin;

package/cjs/Toggle/index.d.ts

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

package/cjs/Toggle/index.js

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

package/cjs/Tooltip/OverflowTooltipWrapper.d.ts

@@ -0,0 +1,10 @@
+import type { VFC } from "react";
+import type { TooltipWrapperBaseProps } from "./types";
+export interface OverflowTooltipWrapperProps extends TooltipWrapperBaseProps {
+}
+/**
+ * The `OverflowTooltipWrapper` component is used to wrap text that may overflow its container and display a tooltip with the full text on hover.
+ *
+ * See the [Tooltip documentation page](https://satellite.algolia.com/components/overlay/tooltip) for more information.
+ */
+export declare const OverflowTooltipWrapper: VFC<OverflowTooltipWrapperProps>;