@algolia/satellite 1.0.0-beta.174 → 1.0.0-beta.175

package/cjs/AutoComplete/AutoComplete.js

@@ -24,7 +24,7 @@ var _ScrollIndicator = _interopRequireDefault(require("../ScrollIndicator"));
 var _satellitePrefixer = _interopRequireDefault(require("../styles/helpers/satellitePrefixer"));
 var _Tag = _interopRequireDefault(require("../Tag"));
 var _uniqBy = _interopRequireDefault(require("../utils/uniqBy"));
-var _AutocompleteContext = require("./components/AutocompleteContext");
+var _AutoCompleteContext = require("./components/AutoCompleteContext");
 var _AutoCompleteEmptyState = _interopRequireDefault(require("./components/AutoCompleteEmptyState"));
 var _DefaultOptionItem = require("./components/DefaultOptionItem");
 var _utils = require("./utils");
@@ -299,20 +299,15 @@ var AutoComplete = exports.AutoComplete = function AutoComplete(_ref) {
   var shouldShowDefaultEmptyState = emptyState === undefined && !!inputValue.length;
   var shouldShowEmptyState = !!emptyState;
   var hideMenu = !combobox.isOpen || items.length === 0 && !shouldShowEmptyState && !shouldShowDefaultEmptyState;
-  var OptionItem = (0, _react.useMemo)(function () {
-    return optionItemComponent !== null && optionItemComponent !== void 0 ? optionItemComponent : function (props) {
-      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_DefaultOptionItem.DefaultOptionItem, _objectSpread(_objectSpread({}, props), {}, {
-        locale: locale
-      }));
-    };
-  }, [optionItemComponent, locale]);
+  var OptionItem = optionItemComponent !== null && optionItemComponent !== void 0 ? optionItemComponent : _DefaultOptionItem.DefaultOptionItem;
   (0, _react.useEffect)(function () {
     updateRef(internalsRef, {
       inputRef: inputRef,
       inputValue: inputValue
     });
   }, [inputRef, internalsRef, inputValue]);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_AutocompleteContext.AutocompleteProvider, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_AutoCompleteContext.AutoCompleteProvider, {
+    locale: locale,
     children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
       className: (0, _clsx["default"])((0, _satellitePrefixer["default"])(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["flex"]))), className),
       ref: function ref(el) {

package/cjs/AutoComplete/components/AutoCompleteContext.d.ts

@@ -0,0 +1,10 @@
+import type { PropsWithChildren, VFC } from "react";
+import type { AutoCompleteLocale } from "../types";
+declare type AutoCompleteContextType = {
+    locale: Required<AutoCompleteLocale>;
+};
+declare type AutoCompleteProviderProps = PropsWithChildren<AutoCompleteContextType>;
+export declare const AutoCompleteProvider: VFC<AutoCompleteProviderProps>;
+export declare const useIsInsideAutoComplete: () => boolean;
+export declare const useAutoCompleteLocale: () => Required<AutoCompleteLocale>;
+export {};

package/cjs/AutoComplete/components/AutoCompleteContext.js

@@ -0,0 +1,29 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useIsInsideAutoComplete = exports.useAutoCompleteLocale = exports.AutoCompleteProvider = void 0;
+var _react = require("react");
+var _jsxRuntime = require("react/jsx-runtime");
+var AutoCompleteContext = /*#__PURE__*/(0, _react.createContext)(null);
+var AutoCompleteProvider = exports.AutoCompleteProvider = function AutoCompleteProvider(_ref) {
+  var locale = _ref.locale,
+    children = _ref.children;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(AutoCompleteContext.Provider, {
+    value: {
+      locale: locale
+    },
+    children: children
+  });
+};
+var useIsInsideAutoComplete = exports.useIsInsideAutoComplete = function useIsInsideAutoComplete() {
+  return !!(0, _react.useContext)(AutoCompleteContext);
+};
+var useAutoCompleteLocale = exports.useAutoCompleteLocale = function useAutoCompleteLocale() {
+  var context = (0, _react.useContext)(AutoCompleteContext);
+  if (!context) {
+    throw new Error("useAutoCompleteLocale must be used inside AutoCompleteProvider");
+  }
+  return context.locale;
+};

package/cjs/AutoComplete/components/DefaultOptionItem.js

@@ -5,10 +5,14 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = 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"
@@ -17,12 +21,14 @@ var DefaultOptionItem = exports.DefaultOptionItem = function DefaultOptionItem(_
   var _locale$optionItemPre;
   var option = _ref.option,
     multiple = _ref.multiple,
-    locale = _ref.locale;
+    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 === null || locale === void 0 || (_locale$optionItemPre = locale.optionItemPrefix) === null || _locale$optionItemPre === void 0 ? void 0 : _locale$optionItemPre.call(locale, multiple), " ").concat(option.label) : option.label
+      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) {

package/cjs/AutoComplete/index.d.ts

@@ -1,7 +1,7 @@
 export * from "./AutoComplete";
 export * from "./components/DefaultOptionItem";
 export * from "./components/AutoCompleteEmptyState";
-export * from "./components/AutocompleteContext";
+export * from "./components/AutoCompleteContext";
 export * from "./types";
 export { defaultCreateFromInputValue } from "./utils";
 export { default } from "./AutoComplete";

package/cjs/AutoComplete/index.js

@@ -55,15 +55,15 @@ Object.keys(_AutoCompleteEmptyState).forEach(function (key) {
     }
   });
 });
-var _AutocompleteContext = require("./components/AutocompleteContext");
-Object.keys(_AutocompleteContext).forEach(function (key) {
+var _AutoCompleteContext = require("./components/AutoCompleteContext");
+Object.keys(_AutoCompleteContext).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
   if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
-  if (key in exports && exports[key] === _AutocompleteContext[key]) return;
+  if (key in exports && exports[key] === _AutoCompleteContext[key]) return;
   Object.defineProperty(exports, key, {
     enumerable: true,
     get: function get() {
-      return _AutocompleteContext[key];
+      return _AutoCompleteContext[key];
     }
   });
 });

package/cjs/Tag/Tag.js

@@ -67,8 +67,8 @@ var Tag = exports.Tag = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref)
   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, _AutoComplete.useIsInsideAutocomplete)();
-  var tabIndexProps = isInsideAutocomplete ? {
+  var isInsideAutoComplete = (0, _AutoComplete.useIsInsideAutoComplete)();
+  var tabIndexProps = isInsideAutoComplete ? {
     tabIndex: -1
   } : {};
   var addable = Boolean(onAdd);

package/esm/AutoComplete/AutoComplete.js

@@ -20,7 +20,7 @@ import ScrollIndicator from "../ScrollIndicator";
 import stl from "../styles/helpers/satellitePrefixer";
 import Tag from "../Tag";
 import uniqBy from "../utils/uniqBy";
-import { AutocompleteProvider } from "./components/AutocompleteContext";
+import { AutoCompleteProvider } from "./components/AutoCompleteContext";
 import AutoCompleteEmptyState from "./components/AutoCompleteEmptyState";
 import { DefaultOptionItem } from "./components/DefaultOptionItem";
 import { DEFAULT_AUTOCOMPLETE_LOCALE, defaultCreateFromInputValue, filter, optionToString } from "./utils";
@@ -293,20 +293,15 @@ export var AutoComplete = function AutoComplete(_ref) {
   var shouldShowDefaultEmptyState = emptyState === undefined && !!inputValue.length;
   var shouldShowEmptyState = !!emptyState;
   var hideMenu = !combobox.isOpen || items.length === 0 && !shouldShowEmptyState && !shouldShowDefaultEmptyState;
-  var OptionItem = useMemo(function () {
-    return optionItemComponent !== null && optionItemComponent !== void 0 ? optionItemComponent : function (props) {
-      return /*#__PURE__*/_jsx(DefaultOptionItem, _objectSpread(_objectSpread({}, props), {}, {
-        locale: locale
-      }));
-    };
-  }, [optionItemComponent, locale]);
+  var OptionItem = optionItemComponent !== null && optionItemComponent !== void 0 ? optionItemComponent : DefaultOptionItem;
   useEffect(function () {
     updateRef(internalsRef, {
       inputRef: inputRef,
       inputValue: inputValue
     });
   }, [inputRef, internalsRef, inputValue]);
-  return /*#__PURE__*/_jsx(AutocompleteProvider, {
+  return /*#__PURE__*/_jsx(AutoCompleteProvider, {
+    locale: locale,
     children: /*#__PURE__*/_jsxs("div", {
       className: cx(stl(_templateObject || (_templateObject = _taggedTemplateLiteral(["flex"]))), className),
       ref: function ref(el) {

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

@@ -0,0 +1,10 @@
+import type { PropsWithChildren, VFC } from "react";
+import type { AutoCompleteLocale } from "../types";
+declare type AutoCompleteContextType = {
+    locale: Required<AutoCompleteLocale>;
+};
+declare type AutoCompleteProviderProps = PropsWithChildren<AutoCompleteContextType>;
+export declare const AutoCompleteProvider: VFC<AutoCompleteProviderProps>;
+export declare const useIsInsideAutoComplete: () => boolean;
+export declare const useAutoCompleteLocale: () => Required<AutoCompleteLocale>;
+export {};

package/esm/AutoComplete/components/AutoCompleteContext.js

@@ -0,0 +1,23 @@
+import { createContext, useContext } from "react";
+import { jsx as _jsx } from "react/jsx-runtime";
+var AutoCompleteContext = /*#__PURE__*/createContext(null);
+export var AutoCompleteProvider = function AutoCompleteProvider(_ref) {
+  var locale = _ref.locale,
+    children = _ref.children;
+  return /*#__PURE__*/_jsx(AutoCompleteContext.Provider, {
+    value: {
+      locale: locale
+    },
+    children: children
+  });
+};
+export var useIsInsideAutoComplete = function useIsInsideAutoComplete() {
+  return !!useContext(AutoCompleteContext);
+};
+export var useAutoCompleteLocale = function useAutoCompleteLocale() {
+  var context = useContext(AutoCompleteContext);
+  if (!context) {
+    throw new Error("useAutoCompleteLocale must be used inside AutoCompleteProvider");
+  }
+  return context.locale;
+};

package/esm/AutoComplete/components/DefaultOptionItem.js

@@ -1,6 +1,10 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
 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) { _defineProperty(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; }
 import stl from "../../styles/helpers/satellitePrefixer";
+import { useAutoCompleteLocale } from "./AutoCompleteContext";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 var metadataSpacer = /*#__PURE__*/_jsx("span", {
@@ -11,12 +15,14 @@ export var DefaultOptionItem = function DefaultOptionItem(_ref) {
   var _locale$optionItemPre;
   var option = _ref.option,
     multiple = _ref.multiple,
-    locale = _ref.locale;
+    localeProp = _ref.locale;
+  var contextLocale = useAutoCompleteLocale();
+  var locale = _objectSpread(_objectSpread({}, contextLocale), localeProp);
   return /*#__PURE__*/_jsxs("div", {
     className: stl(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["truncate py-2"]))),
     children: [/*#__PURE__*/_jsx("span", {
       className: stl(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["font-semibold text-md text-grey-900"]))),
-      children: option["new"] ? "".concat(locale === null || locale === void 0 || (_locale$optionItemPre = locale.optionItemPrefix) === null || _locale$optionItemPre === void 0 ? void 0 : _locale$optionItemPre.call(locale, multiple), " ").concat(option.label) : option.label
+      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__*/_jsx("ul", {
       className: stl(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["flex text-grey-600"]))),
       children: option.metadata.map(function (metadata, idx) {

package/esm/AutoComplete/index.d.ts

@@ -1,7 +1,7 @@
 export * from "./AutoComplete";
 export * from "./components/DefaultOptionItem";
 export * from "./components/AutoCompleteEmptyState";
-export * from "./components/AutocompleteContext";
+export * from "./components/AutoCompleteContext";
 export * from "./types";
 export { defaultCreateFromInputValue } from "./utils";
 export { default } from "./AutoComplete";

package/esm/AutoComplete/index.js

@@ -1,7 +1,7 @@
 export * from "./AutoComplete";
 export * from "./components/DefaultOptionItem";
 export * from "./components/AutoCompleteEmptyState";
-export * from "./components/AutocompleteContext";
+export * from "./components/AutoCompleteContext";
 export * from "./types";
 export { defaultCreateFromInputValue } from "./utils";
 export { default } from "./AutoComplete";

package/esm/Tag/Tag.js

@@ -8,7 +8,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 import cx from "clsx";
 import { forwardRef } from "react";
 import { Plus, X } from "react-feather";
-import { useIsInsideAutocomplete } from "../AutoComplete";
+import { useIsInsideAutoComplete } from "../AutoComplete";
 import { useLocale } from "../Satellite";
 import stl from "../styles/helpers/satellitePrefixer";
 import { TooltipWrapper } from "../Tooltip";
@@ -61,8 +61,8 @@ export var Tag = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var contextLocale = useLocale("tag");
   var locale = _objectSpread(_objectSpread(_objectSpread({}, DEFAULT_TAG_LOCALE), contextLocale), propsLocale);
   var tagClassName = cx(stl(_templateObject15 || (_templateObject15 = _taggedTemplateLiteral(["tag"]))), VARIANT_CLASSNAMES[variant], className);
-  var isInsideAutocomplete = useIsInsideAutocomplete();
-  var tabIndexProps = isInsideAutocomplete ? {
+  var isInsideAutoComplete = useIsInsideAutoComplete();
+  var tabIndexProps = isInsideAutoComplete ? {
     tabIndex: -1
   } : {};
   var addable = Boolean(onAdd);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@algolia/satellite",
-  "version": "1.0.0-beta.174",
+  "version": "1.0.0-beta.175",
   "description": "Algolia design system React components",
   "sideEffects": false,
   "scripts": {

package/cjs/AutoComplete/components/AutocompleteContext.d.ts

@@ -1,5 +0,0 @@
-import type { ReactNode, VFC } from "react";
-export declare const AutocompleteProvider: VFC<{
-    children: ReactNode;
-}>;
-export declare const useIsInsideAutocomplete: () => boolean;

package/cjs/AutoComplete/components/AutocompleteContext.js

@@ -1,19 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.useIsInsideAutocomplete = exports.AutocompleteProvider = void 0;
-var _react = require("react");
-var _jsxRuntime = require("react/jsx-runtime");
-var AutocompleteContext = /*#__PURE__*/(0, _react.createContext)(false);
-var AutocompleteProvider = exports.AutocompleteProvider = function AutocompleteProvider(_ref) {
-  var children = _ref.children;
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(AutocompleteContext.Provider, {
-    value: true,
-    children: children
-  });
-};
-var useIsInsideAutocomplete = exports.useIsInsideAutocomplete = function useIsInsideAutocomplete() {
-  return (0, _react.useContext)(AutocompleteContext);
-};

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

@@ -1,5 +0,0 @@
-import type { ReactNode, VFC } from "react";
-export declare const AutocompleteProvider: VFC<{
-    children: ReactNode;
-}>;
-export declare const useIsInsideAutocomplete: () => boolean;

package/esm/AutoComplete/components/AutocompleteContext.js

@@ -1,13 +0,0 @@
-import { createContext, useContext } from "react";
-import { jsx as _jsx } from "react/jsx-runtime";
-var AutocompleteContext = /*#__PURE__*/createContext(false);
-export var AutocompleteProvider = function AutocompleteProvider(_ref) {
-  var children = _ref.children;
-  return /*#__PURE__*/_jsx(AutocompleteContext.Provider, {
-    value: true,
-    children: children
-  });
-};
-export var useIsInsideAutocomplete = function useIsInsideAutocomplete() {
-  return useContext(AutocompleteContext);
-};