@algolia/satellite 1.0.0-v3.99 → 1.0.0

package/dist/cjs/AutoComplete/components/DefaultOptionItem.js

@@ -0,0 +1,41 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.DefaultOptionItem = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+var _satellitePrefixer = _interopRequireDefault(require("../../styles/helpers/satellitePrefixer"));
+var _AutoCompleteContext = require("./AutoCompleteContext");
+var _jsxRuntime = require("react/jsx-runtime");
+var _templateObject, _templateObject2, _templateObject3, _templateObject4;
+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 metadataSpacer = /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+  className: (0, _satellitePrefixer["default"])(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["px-1"]))),
+  children: "\xB7"
+});
+var DefaultOptionItem = exports.DefaultOptionItem = function DefaultOptionItem(_ref) {
+  var _locale$optionItemPre;
+  var option = _ref.option,
+    multiple = _ref.multiple,
+    localeProp = _ref.locale;
+  var contextLocale = (0, _AutoCompleteContext.useAutoCompleteLocale)();
+  var locale = _objectSpread(_objectSpread({}, contextLocale), localeProp);
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    className: (0, _satellitePrefixer["default"])(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["truncate py-2"]))),
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+      className: (0, _satellitePrefixer["default"])(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["font-semibold text-md text-grey-900"]))),
+      children: option["new"] ? "".concat((_locale$optionItemPre = locale.optionItemPrefix) === null || _locale$optionItemPre === void 0 ? void 0 : _locale$optionItemPre.call(locale, multiple), " ").concat(option.label) : option.label
+    }), option.metadata && option.metadata.length > 0 && /*#__PURE__*/(0, _jsxRuntime.jsx)("ul", {
+      className: (0, _satellitePrefixer["default"])(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["flex text-grey-600"]))),
+      children: option.metadata.map(function (metadata, idx) {
+        return /*#__PURE__*/(0, _jsxRuntime.jsxs)("li", {
+          children: [metadata, idx !== option.metadata.length - 1 && metadataSpacer]
+        }, metadata);
+      })
+    })]
+  });
+};

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

@@ -0,0 +1,5 @@
+export * from "./AutoComplete";
+export * from "./components/DefaultOptionItem";
+export * from "./components/AutoCompleteEmptyState";
+export * from "./types";
+export { defaultCreateFromInputValue } from "./utils";

package/dist/cjs/AutoComplete/index.js

@@ -0,0 +1,63 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _exportNames = {
+  defaultCreateFromInputValue: true
+};
+Object.defineProperty(exports, "defaultCreateFromInputValue", {
+  enumerable: true,
+  get: function get() {
+    return _utils.defaultCreateFromInputValue;
+  }
+});
+var _AutoComplete = require("./AutoComplete");
+Object.keys(_AutoComplete).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _AutoComplete[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _AutoComplete[key];
+    }
+  });
+});
+var _DefaultOptionItem = require("./components/DefaultOptionItem");
+Object.keys(_DefaultOptionItem).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _DefaultOptionItem[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _DefaultOptionItem[key];
+    }
+  });
+});
+var _AutoCompleteEmptyState = require("./components/AutoCompleteEmptyState");
+Object.keys(_AutoCompleteEmptyState).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _AutoCompleteEmptyState[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _AutoCompleteEmptyState[key];
+    }
+  });
+});
+var _types = require("./types");
+Object.keys(_types).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _types[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _types[key];
+    }
+  });
+});
+var _utils = require("./utils");

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

@@ -0,0 +1,95 @@
+import type { ComponentType, FocusEventHandler, ForwardedRef, ReactNode, RefObject } from "react";
+import type { IconComponentType } from "../Icons";
+export declare type AutoCompleteVariant = "medium" | "large";
+export declare type AutoCompleteLocale = {
+    emptyStateTitle?: string;
+    clearInputButton?: string;
+    selectionMessage?: (optionName: string, option: Option | null) => string;
+    itemsAvailable?: (resultCount: number) => string;
+    showMoreButton?: (extraResults: number) => string;
+    optionItemPrefix?: (multiple: boolean) => string;
+};
+export interface AutoCompleteBaseProps<T extends Option = Option> {
+    id?: string;
+    "aria-label"?: string;
+    labelId?: string;
+    icon?: IconComponentType;
+    name?: string;
+    className?: string;
+    valuesClassName?: string;
+    menuClassName?: string;
+    variant?: AutoCompleteVariant;
+    placeholder?: string;
+    disabled?: boolean;
+    autoFocus?: boolean;
+    options?: T[];
+    inputValue?: string;
+    onTextChange?: (text: string) => any;
+    onFocus?: FocusEventHandler<HTMLInputElement>;
+    onBlur?: FocusEventHandler<HTMLInputElement>;
+    creatable?: boolean;
+    clearable?: boolean;
+    selectOnBlur?: boolean;
+    maxResults?: number;
+    createFromInputValue?: CreateFromInputValue<T>;
+    separatorKeys?: string[];
+    renderValueTemplate?: (args: RenderValueTemplateArgs<T>) => JSX.Element;
+    emptyState?: ReactNode;
+    menuFooter?: ReactNode;
+    optionItemComponent?: OptionItemComponentType<T>;
+    /** Keep the input on a single line */
+    noWrap?: boolean;
+    endItem?: ReactNode;
+    /**
+     * `medium` will display about 5 results in the dropdown; use `large` variant to display more
+     * @default "medium"
+     */
+    menuSize?: "medium" | "large";
+    locale?: AutoCompleteLocale;
+    /** @deprecated Use of this props is discouraged and is only there for backwards compatibility */
+    internalsRef?: ForwardedRef<AutoCompleteInternals>;
+}
+export interface AutoCompleteInternals {
+    /** Current internal inputValue */
+    inputValue: string;
+    /** RefObject containing the underlying combobox input element */
+    inputRef: RefObject<HTMLInputElement>;
+}
+export interface AutoCompleteSingleProps<T extends Option = Option> extends AutoCompleteBaseProps<T> {
+    multiple?: false;
+    value?: T;
+    onChange: (option: T | null) => void;
+}
+export interface AutoCompleteMultiProps<T extends Option = Option> extends AutoCompleteBaseProps<T> {
+    multiple: true;
+    value?: T[];
+    onChange: (option: T[] | null) => void;
+}
+export declare type AutoCompleteProps<T extends Option = Option> = AutoCompleteMultiProps<T> | AutoCompleteSingleProps<T>;
+declare type OptionsValue = string | number | boolean;
+export interface Option {
+    value: OptionsValue;
+    label: string;
+    metadata?: string[];
+    new?: boolean;
+    disabled?: boolean;
+    bypassNeedleMatch?: boolean;
+}
+export interface OptionItemProps<T extends Option = Option> {
+    option: T;
+    multiple: boolean;
+    inputValue: string;
+    highlighted: boolean;
+}
+export declare type OptionItemComponentType<T extends Option = Option> = ComponentType<OptionItemProps<T>>;
+export interface OptionRendererParams {
+    multiple: boolean;
+    inputValue: string;
+    highlighted: boolean;
+}
+export interface RenderValueTemplateArgs<T extends Option = Option> {
+    option: T;
+    editable: boolean;
+}
+export declare type CreateFromInputValue<T extends Option = Option> = (options: T[] | undefined, inputValue: string) => Option[];
+export {};

package/dist/cjs/AutoComplete/types.js

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

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

@@ -0,0 +1,8 @@
+import type { AutoCompleteLocale, AutoCompleteMultiProps, AutoCompleteProps, Option } from "./types";
+export declare function isAutoCompleteMultiProps<T extends Option = Option>(props: AutoCompleteProps<T>): props is AutoCompleteMultiProps<T>;
+export declare const defaultCreateFromInputValue: <T extends Option = Option>(options: T[] | undefined, inputValue: string) => Option[];
+export declare const caseInsensitiveCreateFromInputValue: <T extends Option = Option>(options: T[] | undefined, inputValue: string) => Option[];
+export declare const DEFAULT_AUTOCOMPLETE_LOCALE: Required<AutoCompleteLocale>;
+export declare const optionToString: (option: Option | null | undefined) => string;
+export declare function filter<T extends Option = Option>(options: T[], selectedItems: T[], itemValue: string): T[];
+export declare function inputValueFromProps<T extends Option = Option>(props: AutoCompleteProps<T>): string;

package/dist/cjs/AutoComplete/utils.js

@@ -0,0 +1,81 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.defaultCreateFromInputValue = exports.caseInsensitiveCreateFromInputValue = exports.DEFAULT_AUTOCOMPLETE_LOCALE = void 0;
+exports.filter = filter;
+exports.inputValueFromProps = inputValueFromProps;
+exports.isAutoCompleteMultiProps = isAutoCompleteMultiProps;
+exports.optionToString = void 0;
+var _pluralize = require("../utils/pluralize");
+function isAutoCompleteMultiProps(props) {
+  return Boolean(props.multiple);
+}
+function createFromInputValue() {
+  var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
+  var inputValue = arguments.length > 1 ? arguments[1] : undefined;
+  var matchingPredicate = arguments.length > 2 ? arguments[2] : undefined;
+  return options.some(function (option) {
+    return matchingPredicate(option, inputValue);
+  }) ? [] : [{
+    value: inputValue,
+    label: inputValue,
+    "new": true
+  }];
+}
+var defaultCreateFromInputValue = exports.defaultCreateFromInputValue = function defaultCreateFromInputValue(options, inputValue) {
+  return createFromInputValue(options, inputValue, function (option) {
+    return option.value === inputValue;
+  });
+};
+var caseInsensitiveCreateFromInputValue = exports.caseInsensitiveCreateFromInputValue = function caseInsensitiveCreateFromInputValue(options, inputValue) {
+  return createFromInputValue(options, inputValue, function (option) {
+    return option.value.toString().toLowerCase() === inputValue.toLowerCase();
+  });
+};
+var DEFAULT_AUTOCOMPLETE_LOCALE = exports.DEFAULT_AUTOCOMPLETE_LOCALE = {
+  clearInputButton: "Clear input value",
+  emptyStateTitle: "No matches found",
+  selectionMessage: function selectionMessage(optionName, option) {
+    return option ? "".concat(optionName, " has been selected.") : "";
+  },
+  itemsAvailable: function itemsAvailable(count) {
+    return "".concat((0, _pluralize.pluralize)(count, "item is", {
+      plural: "items are"
+    }), " available");
+  },
+  optionItemPrefix: function optionItemPrefix(multiple) {
+    return multiple ? "Add" : "Use";
+  },
+  showMoreButton: function showMoreButton(extraResults) {
+    return "Show ".concat((0, _pluralize.pluralize)(extraResults, "result"), " more");
+  }
+};
+var optionToString = exports.optionToString = function optionToString(option) {
+  var _option$label;
+  return (_option$label = option === null || option === void 0 ? void 0 : option.label) !== null && _option$label !== void 0 ? _option$label : "";
+};
+function needlesMatch(needles, option) {
+  var labels = (option.metadata || []).concat(option.label);
+  return needles.every(function (needle) {
+    return labels.some(function (label) {
+      return String(label || "").trim().toLowerCase().includes(needle);
+    });
+  });
+}
+function filter(options, selectedItems, itemValue) {
+  var needles = itemValue.toLowerCase().trim().split(/\s+/);
+  return options.filter(function (option) {
+    return !selectedItems.some(function (_ref) {
+      var value = _ref.value;
+      return value === option.value;
+    }) && (option.bypassNeedleMatch || needlesMatch(needles, option));
+  });
+}
+function inputValueFromProps(props) {
+  if (props.inputValue !== undefined) {
+    return props.inputValue;
+  }
+  return !isAutoCompleteMultiProps(props) && props.value ? optionToString(props.value) : "";
+}

package/dist/cjs/Avatars/ApplicationAvatar.d.ts

@@ -0,0 +1,16 @@
+import type { VFC } from "react";
+import type { ApplicationAvatarSize, MinimalApplication } from "./types";
+export interface ApplicationAvatarProps {
+    /** A minimal application object containing `applicationID` and `name`. */
+    application: MinimalApplication;
+    /** @default "medium" */
+    size?: ApplicationAvatarSize;
+    /** @ignore */
+    className?: string;
+}
+/**
+ * The `ApplicationAvatar` component is used as a visual representation of an application.
+ *
+ * See the [Application Avatar documentation page](https://satellite.algolia.com/components/images/application-avatar) for more information.
+ */
+export declare const ApplicationAvatar: VFC<ApplicationAvatarProps>;

package/dist/cjs/Avatars/ApplicationAvatar.js

@@ -0,0 +1,37 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ApplicationAvatar = void 0;
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+var _clsx = _interopRequireDefault(require("clsx"));
+var _satellitePrefixer = _interopRequireDefault(require("../styles/helpers/satellitePrefixer"));
+var _utils = require("./utils");
+var _jsxRuntime = require("react/jsx-runtime");
+var _templateObject, _templateObject2, _templateObject3;
+var SIZE_CLASSNAMES = {
+  small: (0, _satellitePrefixer["default"])(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["w-4 h-4"]))),
+  medium: (0, _satellitePrefixer["default"])(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["w-8 h-8"])))
+};
+/**
+ * The `ApplicationAvatar` component is used as a visual representation of an application.
+ *
+ * See the [Application Avatar documentation page](https://satellite.algolia.com/components/images/application-avatar) for more information.
+ */
+var ApplicationAvatar = exports.ApplicationAvatar = function ApplicationAvatar(_ref) {
+  var className = _ref.className,
+    application = _ref.application,
+    _ref$size = _ref.size,
+    size = _ref$size === void 0 ? "medium" : _ref$size;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    role: "img",
+    "aria-label": application.name || "Application's avatar",
+    className: (0, _clsx["default"])((0, _satellitePrefixer["default"])(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["rounded inline-flex shrink-0 items-center justify-center uppercase"]))), (0, _utils.pickApplicationColors)(application.applicationId), SIZE_CLASSNAMES[size], className),
+    style: size === "small" ? {
+      fontSize: "8px"
+    } : {},
+    children: (0, _utils.getApplicationInitials)(application)
+  });
+};

package/dist/cjs/Avatars/UserAvatar.d.ts

@@ -0,0 +1,23 @@
+import type { VFC } from "react";
+import type { MinimalUser } from "./types";
+export declare type UserAvatarLocale = {
+    fallbackText?: string;
+};
+export interface UserAvatarProps {
+    /** A minimal user object containing `name`, `email` and `avatar`. */
+    user: MinimalUser;
+    /**
+     * in px
+     * @default 32
+     * */
+    size?: number;
+    /** @ignore */
+    className?: string;
+    locale?: UserAvatarLocale;
+}
+/**
+ * The `UserAvatar` component is used as a visual representation of a user.
+ *
+ * See the [User Avatar documentation page](https://satellite.algolia.com/components/images/user-avatar) for more information.
+ */
+export declare const UserAvatar: VFC<UserAvatarProps>;

package/dist/cjs/Avatars/UserAvatar.js

@@ -0,0 +1,58 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.UserAvatar = void 0;
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _reactAvatar = require("@radix-ui/react-avatar");
+var _clsx = _interopRequireDefault(require("clsx"));
+var _Satellite = require("../Satellite");
+var _satellitePrefixer = _interopRequireDefault(require("../styles/helpers/satellitePrefixer"));
+var _utils = require("./utils");
+var _jsxRuntime = require("react/jsx-runtime");
+var _templateObject, _templateObject2, _templateObject3, _templateObject4;
+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_LOCALE = {
+  fallbackText: "User's avatar"
+};
+/**
+ * The `UserAvatar` component is used as a visual representation of a user.
+ *
+ * See the [User Avatar documentation page](https://satellite.algolia.com/components/images/user-avatar) for more information.
+ */
+var UserAvatar = exports.UserAvatar = function UserAvatar(_ref) {
+  var _user$email;
+  var className = _ref.className,
+    user = _ref.user,
+    _ref$size = _ref.size,
+    size = _ref$size === void 0 ? 32 : _ref$size,
+    propsLocale = _ref.locale;
+  var contextLocale = (0, _Satellite.useLocale)("userAvatar");
+  var locale = _objectSpread(_objectSpread(_objectSpread({}, DEFAULT_LOCALE), contextLocale), propsLocale);
+  var fallbackName = user.name || user.email || locale.fallbackText;
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactAvatar.Root, {
+    className: (0, _clsx["default"])((0, _satellitePrefixer["default"])(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["overflow-hidden flex justify-center items-center rounded-full"]))), (0, _utils.getUserBackgroundClassName)((_user$email = user.email) !== null && _user$email !== void 0 ? _user$email : "no-email"), className),
+    style: {
+      width: size,
+      height: size
+    },
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactAvatar.Image, {
+      className: (0, _satellitePrefixer["default"])(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["h-full w-full object-cover"]))),
+      src: user.avatar,
+      alt: fallbackName
+    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactAvatar.AvatarFallback, {
+      className: (0, _satellitePrefixer["default"])(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["flex h-full w-full items-center justify-center uppercase"]))),
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+        "aria-hidden": true,
+        children: (0, _utils.getUserInitials)(user)
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+        className: (0, _satellitePrefixer["default"])(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["sr-only"]))),
+        children: fallbackName
+      })]
+    })]
+  });
+};

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

@@ -0,0 +1,2 @@
+export * from "./ApplicationAvatar";
+export * from "./UserAvatar";

package/dist/cjs/Avatars/index.js

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

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

@@ -0,0 +1,17 @@
+export declare type ApplicationAvatarSize = "small" | "medium";
+export declare type MinimalApplication = {
+    applicationId: string;
+    name?: string;
+};
+declare type UserAvatarWithName = {
+    name: string;
+    email?: string;
+};
+declare type UserAvatarWithEmail = {
+    email: string;
+    name?: string;
+};
+export declare type MinimalUser = (UserAvatarWithName | UserAvatarWithEmail) & {
+    avatar?: string;
+};
+export {};

package/dist/cjs/Avatars/types.js

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

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

@@ -0,0 +1,6 @@
+import type { MinimalApplication, MinimalUser } from "./types";
+export declare const pickApplicationColors: (applicationId: string) => string;
+export declare const getApplicationIdInitial: (applicationId: string) => string;
+export declare const getApplicationInitials: ({ name, applicationId }: MinimalApplication) => string;
+export declare const getUserBackgroundClassName: (email: string) => string;
+export declare const getUserInitials: (user: MinimalUser) => string;

package/dist/cjs/Avatars/utils.js

@@ -0,0 +1,55 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.pickApplicationColors = exports.getUserInitials = exports.getUserBackgroundClassName = exports.getApplicationInitials = exports.getApplicationIdInitial = void 0;
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+var _diacritics = require("diacritics");
+var _satellitePrefixer = _interopRequireDefault(require("../styles/helpers/satellitePrefixer"));
+var _hashCode = require("../utils/hashCode");
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22, _templateObject23, _templateObject24, _templateObject25, _templateObject26, _templateObject27, _templateObject28;
+/** APPLICATION */
+
+var APPLICATION_COLORS_CLASSNAMES = [/* eslint-disable @algolia/stl/prefer-accent */(0, _satellitePrefixer["default"])(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["bg-grey-200 text-grey-800"]))), (0, _satellitePrefixer["default"])(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["bg-nebula-200 text-nebula-800"]))), (0, _satellitePrefixer["default"])(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["bg-blue-200 text-blue-900"]))), (0, _satellitePrefixer["default"])(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["bg-green-200 text-green-900"]))), (0, _satellitePrefixer["default"])(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2["default"])(["bg-pink-200 text-pink-800"]))), (0, _satellitePrefixer["default"])(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2["default"])(["bg-red-200 text-red-800"]))), (0, _satellitePrefixer["default"])(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2["default"])(["bg-orange-200 text-orange-900"]))), // Darker variants
+(0, _satellitePrefixer["default"])(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2["default"])(["bg-grey-300 text-grey-900"]))), (0, _satellitePrefixer["default"])(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2["default"])(["bg-nebula-300 text-nebula-900"]))), (0, _satellitePrefixer["default"])(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2["default"])(["bg-blue-300 text-blue-900"]))), (0, _satellitePrefixer["default"])(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2["default"])(["bg-green-300 text-green-900"]))), (0, _satellitePrefixer["default"])(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteral2["default"])(["bg-pink-300 text-pink-900"]))), (0, _satellitePrefixer["default"])(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteral2["default"])(["bg-red-300 text-red-900"]))), (0, _satellitePrefixer["default"])(_templateObject14 || (_templateObject14 = (0, _taggedTemplateLiteral2["default"])(["bg-orange-300 text-orange-900"]))) /* eslint-enable @algolia/stl/prefer-accent */];
+var pickApplicationColors = exports.pickApplicationColors = function pickApplicationColors(applicationId) {
+  var _APPLICATION_COLORS_C;
+  return (_APPLICATION_COLORS_C = APPLICATION_COLORS_CLASSNAMES[Math.abs((0, _hashCode.hashCode)(applicationId)) % APPLICATION_COLORS_CLASSNAMES.length]) !== null && _APPLICATION_COLORS_C !== void 0 ? _APPLICATION_COLORS_C : APPLICATION_COLORS_CLASSNAMES[0];
+};
+var getApplicationIdInitial = exports.getApplicationIdInitial = function getApplicationIdInitial(applicationId) {
+  return applicationId.startsWith("beta") ? applicationId.slice(4, 6) : applicationId.slice(0, 2);
+};
+var getApplicationInitials = exports.getApplicationInitials = function getApplicationInitials(_ref) {
+  var name = _ref.name,
+    applicationId = _ref.applicationId;
+  if (!name) {
+    return getApplicationIdInitial(applicationId);
+  }
+  var words = (0, _diacritics.remove)(name.trim()).toLocaleUpperCase().split(/\W+/).filter(function (word) {
+    return word.length >= 1;
+  });
+  if (words.length === 0 || words.length === 1 && words[0].length < 2) {
+    return getApplicationIdInitial(applicationId);
+  } else if (words.length === 1) {
+    return words[0].slice(0, 2);
+  }
+  return "".concat(words[0][0]).concat(words[1][0]);
+};
+
+/** USER */
+
+var USER_COLORS_CLASSNAMES = [/* eslint-disable @algolia/stl/prefer-accent */(0, _satellitePrefixer["default"])(_templateObject15 || (_templateObject15 = (0, _taggedTemplateLiteral2["default"])(["bg-grey-400 text-grey-900"]))), (0, _satellitePrefixer["default"])(_templateObject16 || (_templateObject16 = (0, _taggedTemplateLiteral2["default"])(["bg-nebula-400 text-grey-900"]))), (0, _satellitePrefixer["default"])(_templateObject17 || (_templateObject17 = (0, _taggedTemplateLiteral2["default"])(["bg-blue-400 text-grey-900"]))), (0, _satellitePrefixer["default"])(_templateObject18 || (_templateObject18 = (0, _taggedTemplateLiteral2["default"])(["bg-green-400 text-grey-900"]))), (0, _satellitePrefixer["default"])(_templateObject19 || (_templateObject19 = (0, _taggedTemplateLiteral2["default"])(["bg-pink-400 text-grey-900"]))), (0, _satellitePrefixer["default"])(_templateObject20 || (_templateObject20 = (0, _taggedTemplateLiteral2["default"])(["bg-red-400 text-grey-900"]))), (0, _satellitePrefixer["default"])(_templateObject21 || (_templateObject21 = (0, _taggedTemplateLiteral2["default"])(["bg-orange-400 text-grey-900"]))), // Darker variants
+(0, _satellitePrefixer["default"])(_templateObject22 || (_templateObject22 = (0, _taggedTemplateLiteral2["default"])(["bg-grey-700 text-white"]))), (0, _satellitePrefixer["default"])(_templateObject23 || (_templateObject23 = (0, _taggedTemplateLiteral2["default"])(["bg-nebula-700 text-white"]))), (0, _satellitePrefixer["default"])(_templateObject24 || (_templateObject24 = (0, _taggedTemplateLiteral2["default"])(["bg-blue-700 text-grey-900"]))), (0, _satellitePrefixer["default"])(_templateObject25 || (_templateObject25 = (0, _taggedTemplateLiteral2["default"])(["bg-green-700 text-grey-900"]))), (0, _satellitePrefixer["default"])(_templateObject26 || (_templateObject26 = (0, _taggedTemplateLiteral2["default"])(["bg-pink-700 text-white"]))), (0, _satellitePrefixer["default"])(_templateObject27 || (_templateObject27 = (0, _taggedTemplateLiteral2["default"])(["bg-red-700 text-white"]))), (0, _satellitePrefixer["default"])(_templateObject28 || (_templateObject28 = (0, _taggedTemplateLiteral2["default"])(["bg-orange-600 text-grey-900"]))) /* eslint-enable @algolia/stl/prefer-accent */];
+var getUserBackgroundClassName = exports.getUserBackgroundClassName = function getUserBackgroundClassName(email) {
+  var _USER_COLORS_CLASSNAM;
+  return (_USER_COLORS_CLASSNAM = USER_COLORS_CLASSNAMES[Math.abs((0, _hashCode.hashCode)(email)) % USER_COLORS_CLASSNAMES.length]) !== null && _USER_COLORS_CLASSNAM !== void 0 ? _USER_COLORS_CLASSNAM : USER_COLORS_CLASSNAMES[0];
+};
+var getUserInitials = exports.getUserInitials = function getUserInitials(user) {
+  var _user$email;
+  var words = user.name ? user.name.trim().split(/\s+/) : (_user$email = user.email) === null || _user$email === void 0 || (_user$email = _user$email.match(/^(.+)(?:\+.+?)?@.+$/)) === null || _user$email === void 0 ? void 0 : _user$email[1].split(".");
+  return words ? words.slice(0, 2).map(function (w) {
+    return w.toLocaleLowerCase()[0];
+  }).join("") : "??";
+};

package/dist/cjs/Badge/Badge.d.ts

@@ -0,0 +1,24 @@
+import { type HTMLAttributes, type ReactNode } from "react";
+import type { IconComponentType } from "../Icons";
+import type { AtLeastOne, ColorVariant } from "../types";
+export declare type BadgeSizes = "small" | "medium" | "large";
+export declare type BadgeVariants = ColorVariant | "pink";
+interface BaseBadgeProps extends HTMLAttributes<HTMLSpanElement> {
+    variant?: BadgeVariants;
+    size?: BadgeSizes;
+}
+declare type BadgeContentProps = {
+    children: ReactNode;
+    /** An additional value to accompany the `Badge` */
+    value: ReactNode;
+    /** Left aligned icon */
+    icon: IconComponentType;
+};
+export declare type BadgeProps = BaseBadgeProps & AtLeastOne<BadgeContentProps>;
+/**
+ * The `Badge` component is a visual marker highlighting information or status. It enhances UI, indicates progress, and classifies data.
+ *
+ * See the [Badge documentation page](https://satellite.algolia.com/components/feedback/badge) for more information.
+ */
+export declare const Badge: import("react").ForwardRefExoticComponent<BadgeProps & import("react").RefAttributes<HTMLSpanElement>>;
+export {};