@algolia/satellite 2.3.0 → 2.4.0

package/dist/cjs/Actions/Accordion/Accordion.d.ts

@@ -1,6 +1,9 @@
 import * as RadixAccordion from "@radix-ui/react-accordion";
 import type { FC, ReactNode } from "react";
+import type { VariantProps } from "tailwind-variants";
+import { accordionStyles } from "./Accordion.styles";
 import type { IconComponentType } from "../../Icons";
+declare type AccordionVariants = VariantProps<typeof accordionStyles>;
 declare type AccordionSharedProps = {
     /**
      * The content of the `Accordion`.
@@ -14,6 +17,11 @@ declare type AccordionSharedProps = {
      * Whether the `Accordion` is disabled, preventing the user from interacting with the accordion and all its items.
      */
     disabled?: boolean;
+    /**
+     * Display the Accordion in normal or a more compact style (no meta or description, smaller paddings).
+     * @default normal
+     */
+    variant?: AccordionVariants["variant"];
 };
 declare type AccordionSingleProps = {
     /**

package/dist/cjs/Actions/Accordion/Accordion.js

@@ -7,25 +7,27 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.Accordion = 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 RadixAccordion = _interopRequireWildcard(require("@radix-ui/react-accordion"));
 var _clsx = _interopRequireDefault(require("clsx"));
 var _react = require("react");
+var _Accordion = require("./Accordion.styles");
 var _Icons = require("./../../Icons");
-var _satellitePrefixer = _interopRequireDefault(require("./../../styles/helpers/satellitePrefixer"));
 var _jsxRuntime = require("react/jsx-runtime");
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17;
-var _excluded = ["children", "className"],
-  _excluded2 = ["onChange", "multiple"],
-  _excluded3 = ["onChange", "multiple", "collapsible"];
+var _excluded = ["children", "variant"],
+  _excluded2 = ["children", "className"],
+  _excluded3 = ["onChange", "multiple"],
+  _excluded4 = ["onChange", "multiple", "collapsible"];
 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 && {}.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 ICON_SIZE = 16;
-var TRIGGER_ICON_SIZE = 20;
-
+var AccordionVariantContext = /*#__PURE__*/(0, _react.createContext)({
+  variant: "normal"
+});
+var useAccordionVariant = function useAccordionVariant() {
+  return (0, _react.useContext)(AccordionVariantContext);
+};
 /**
  * The `Accordion` component is a compact section for revealing and hiding content, ideal for keeping interfaces clean.
  *
@@ -33,15 +35,36 @@ var TRIGGER_ICON_SIZE = 20;
  */
 var Accordion = exports.Accordion = function Accordion(_ref) {
   var children = _ref.children,
-    className = _ref.className,
+    _ref$variant = _ref.variant,
+    variant = _ref$variant === void 0 ? "normal" : _ref$variant,
     props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(AccordionVariantContext.Provider, {
+    value: {
+      variant: variant
+    },
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(AccordionRootInternal, _objectSpread(_objectSpread({}, props), {}, {
+      children: children
+    }))
+  });
+};
+var AccordionRootInternal = function AccordionRootInternal(_ref2) {
+  var children = _ref2.children,
+    className = _ref2.className,
+    props = (0, _objectWithoutProperties2["default"])(_ref2, _excluded2);
+  var _useAccordionVariant = useAccordionVariant(),
+    variant = _useAccordionVariant.variant;
+  var styles = (0, _Accordion.accordionStyles)({
+    variant: variant
+  });
   var sharedProps = {
-    className: (0, _clsx["default"])((0, _satellitePrefixer["default"])(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["flex flex-col"]))), className)
+    className: styles.base({
+      className: className
+    })
   };
   if (props.multiple) {
     var _onChange = props.onChange,
       _multiple = props.multiple,
-      _rest = (0, _objectWithoutProperties2["default"])(props, _excluded2);
+      _rest = (0, _objectWithoutProperties2["default"])(props, _excluded3);
     return /*#__PURE__*/(0, _jsxRuntime.jsx)(RadixAccordion.Root, _objectSpread(_objectSpread(_objectSpread({}, _rest), sharedProps), {}, {
       type: "multiple",
       onValueChange: _onChange,
@@ -52,7 +75,7 @@ var Accordion = exports.Accordion = function Accordion(_ref) {
     multiple = props.multiple,
     _props$collapsible = props.collapsible,
     collapsible = _props$collapsible === void 0 ? true : _props$collapsible,
-    rest = (0, _objectWithoutProperties2["default"])(props, _excluded3);
+    rest = (0, _objectWithoutProperties2["default"])(props, _excluded4);
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(RadixAccordion.Root, _objectSpread(_objectSpread(_objectSpread({}, rest), sharedProps), {}, {
     type: "single",
     onValueChange: onChange,
@@ -61,71 +84,88 @@ var Accordion = exports.Accordion = function Accordion(_ref) {
   }));
 };
 Accordion.displayName = "Accordion";
-var AccordionItem = /*#__PURE__*/(0, _react.forwardRef)(function (_ref2, ref) {
-  var value = _ref2.value,
-    disabled = _ref2.disabled,
-    children = _ref2.children,
-    className = _ref2.className;
+var AccordionItem = /*#__PURE__*/(0, _react.forwardRef)(function (_ref3, ref) {
+  var value = _ref3.value,
+    disabled = _ref3.disabled,
+    children = _ref3.children,
+    className = _ref3.className;
+  var _useAccordionVariant2 = useAccordionVariant(),
+    variant = _useAccordionVariant2.variant;
+  var styles = (0, _Accordion.accordionStyles)({
+    variant: variant
+  });
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(RadixAccordion.Item, {
     value: value,
     disabled: disabled,
     ref: ref,
-    className: (0, _clsx["default"])((0, _satellitePrefixer["default"])(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["group/accordion-item flex flex-col"]))), className),
+    className: styles.item({
+      className: className
+    }),
     children: children
   });
 });
 AccordionItem.displayName = "AccordionItem";
-var AccordionHeader = /*#__PURE__*/(0, _react.forwardRef)(function (_ref3, ref) {
-  var children = _ref3.children,
-    description = _ref3.description,
-    Icon = _ref3.icon,
-    _ref3$iconClassName = _ref3.iconClassName,
-    iconClassName = _ref3$iconClassName === void 0 ? (0, _satellitePrefixer["default"])(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["typo-subdued"]))) : _ref3$iconClassName,
-    _ref3$iconBgClassName = _ref3.iconBgClassName,
-    iconBgClassName = _ref3$iconBgClassName === void 0 ? (0, _satellitePrefixer["default"])(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["bg-grey-100"]))) : _ref3$iconBgClassName,
-    meta = _ref3.meta,
-    triggerIcon = _ref3.triggerIcon,
-    triggerClassName = _ref3.triggerClassName,
-    className = _ref3.className,
-    titleWrapperClassName = _ref3.titleWrapperClassName,
-    titleClassName = _ref3.titleClassName;
+var AccordionHeader = /*#__PURE__*/(0, _react.forwardRef)(function (_ref4, ref) {
+  var children = _ref4.children,
+    description = _ref4.description,
+    Icon = _ref4.icon,
+    iconClassName = _ref4.iconClassName,
+    iconBgClassName = _ref4.iconBgClassName,
+    meta = _ref4.meta,
+    triggerIcon = _ref4.triggerIcon,
+    triggerClassName = _ref4.triggerClassName,
+    className = _ref4.className,
+    titleWrapperClassName = _ref4.titleWrapperClassName,
+    titleClassName = _ref4.titleClassName;
+  var _useAccordionVariant3 = useAccordionVariant(),
+    variant = _useAccordionVariant3.variant;
+  var styles = (0, _Accordion.accordionStyles)({
+    variant: variant
+  });
+  var isCompact = variant === "compact";
   var TriggerIcon = triggerIcon || _Icons.ChevronDownIcon;
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(RadixAccordion.Header, {
-    className: className,
+    className: styles.header({
+      className: className
+    }),
     children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(RadixAccordion.Trigger, {
       ref: ref,
-      className: (0, _clsx["default"])((0, _satellitePrefixer["default"])(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2["default"])(["group/accordion-trigger flex gap-x-3 items-center w-full justify-between px-3.5 py-2.5 group-first/accordion-item:rounded-t group-last/accordion-item:rounded-b bg-white border-2 border-transparent focus-visible:outline-none focus-visible:border-accent-600 enabled:hover:bg-grey-50 motion-safe:transition-colors"]))), triggerClassName),
+      className: styles.trigger({
+        className: triggerClassName
+      }),
       children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-        className: (0, _clsx["default"])((0, _satellitePrefixer["default"])(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2["default"])(["flex items-center gap-x-3 grow"]))), titleWrapperClassName),
+        className: styles.titleWrapper({
+          className: titleWrapperClassName
+        }),
         children: [Icon && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-          className: (0, _clsx["default"])((0, _satellitePrefixer["default"])(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2["default"])(["rounded-full w-8 h-8 flex items-center justify-center shrink-0"]))), iconBgClassName),
+          className: styles.iconBg({
+            className: iconBgClassName
+          }),
           "aria-hidden": true,
           children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Icon, {
-            className: (0, _clsx["default"])(iconClassName, (0, _satellitePrefixer["default"])(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2["default"])(["group-disabled/accordion-trigger:text-grey-300"])))),
-            width: ICON_SIZE,
-            height: ICON_SIZE
+            className: styles.icon({
+              className: iconClassName
+            })
           })
         }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-          className: (0, _satellitePrefixer["default"])(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2["default"])(["flex flex-col gap-y-1 text-left grow"]))),
+          className: styles.titleCol(),
           children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-            className: (0, _clsx["default"])((0, _satellitePrefixer["default"])(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2["default"])(["typo-display-heading line-clamp-2 group-disabled/accordion-trigger:text-grey-300"]))), titleClassName),
+            className: styles.title({
+              className: titleClassName
+            }),
             children: children
-          }), typeof description !== "undefined" && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-            className: (0, _satellitePrefixer["default"])(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2["default"])(["typo-display-body typo-subdued line-clamp-3 group-disabled/accordion-trigger:text-grey-300"]))),
+          }), !isCompact && typeof description !== "undefined" && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+            className: styles.description(),
             children: description
           })]
         })]
       }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-        className: (0, _satellitePrefixer["default"])(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteral2["default"])(["flex items-center gap-x-2"]))),
-        children: [typeof meta !== "undefined" && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-          className: (0, _satellitePrefixer["default"])(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteral2["default"])(["typo-display-caption group-disabled/accordion-trigger:text-grey-300"]))),
+        className: styles.metaWrapper(),
+        children: [typeof meta !== "undefined" && !isCompact && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+          className: styles.meta(),
           children: meta
         }), /*#__PURE__*/(0, _jsxRuntime.jsx)(TriggerIcon, {
-          className: (0, _clsx["default"])((0, _satellitePrefixer["default"])(_templateObject14 || (_templateObject14 = (0, _taggedTemplateLiteral2["default"])(["shrink-0 typo-subdued group-disabled/accordion-trigger:text-grey-300"]))),
-          // Don't rotate the trigger icon if it's a custom one.
-          !triggerIcon && (0, _satellitePrefixer["default"])(_templateObject15 || (_templateObject15 = (0, _taggedTemplateLiteral2["default"])([" group-data-[state=open]/accordion-trigger:rotate-180 motion-safe:transition-transform motion-safe:duration-300 motion-safe:ease-out"])))),
-          width: TRIGGER_ICON_SIZE,
-          height: TRIGGER_ICON_SIZE,
+          className: (0, _clsx["default"])(styles.triggerIcon(), !triggerIcon && styles.triggerIconChevron()),
           "aria-hidden": true
         })]
       })]
@@ -133,14 +173,21 @@ var AccordionHeader = /*#__PURE__*/(0, _react.forwardRef)(function (_ref3, ref)
   });
 });
 AccordionHeader.displayName = "AccordionHeader";
-var AccordionContent = /*#__PURE__*/(0, _react.forwardRef)(function (_ref4, ref) {
-  var children = _ref4.children,
-    className = _ref4.className;
+var AccordionContent = /*#__PURE__*/(0, _react.forwardRef)(function (_ref5, ref) {
+  var children = _ref5.children,
+    className = _ref5.className;
+  var _useAccordionVariant4 = useAccordionVariant(),
+    variant = _useAccordionVariant4.variant;
+  var styles = (0, _Accordion.accordionStyles)({
+    variant: variant
+  });
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(RadixAccordion.Content, {
     ref: ref,
-    className: (0, _clsx["default"])((0, _satellitePrefixer["default"])(_templateObject16 || (_templateObject16 = (0, _taggedTemplateLiteral2["default"])(["typo-display-body typo-subdued overflow-hidden accordion-content"]))), className),
+    className: styles.content({
+      className: className
+    }),
     children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-      className: (0, _satellitePrefixer["default"])(_templateObject17 || (_templateObject17 = (0, _taggedTemplateLiteral2["default"])(["px-4 pt-2 pb-4"]))),
+      className: styles.contentInner(),
       children: children
     })
   });

package/dist/cjs/Actions/Accordion/Accordion.styles.d.ts

@@ -0,0 +1,170 @@
+export declare const accordionStyles: import("tailwind-variants").TVReturnType<{
+    variant: {
+        normal: {
+            trigger: string;
+            titleWrapper: string;
+            iconBg: string;
+            triggerIcon: string;
+            contentInner: string;
+        };
+        compact: {
+            trigger: string;
+            titleWrapper: string;
+            iconBg: string;
+            title: string;
+            description: string;
+            metaWrapper: string;
+            meta: string;
+            triggerIcon: string;
+            content: string;
+            contentInner: string;
+        };
+    };
+}, {
+    base: string;
+    item: string;
+    header: string;
+    trigger: string;
+    titleWrapper: string;
+    iconBg: string;
+    icon: string;
+    titleCol: string;
+    title: string;
+    description: string;
+    metaWrapper: string;
+    meta: string;
+    triggerIcon: string;
+    triggerIconChevron: string;
+    content: string;
+    contentInner: string;
+}, undefined, {
+    responsiveVariants?: boolean | ("sm" | "md" | "lg" | "xl" | "2xl")[] | {
+        variant?: boolean | ("sm" | "md" | "lg" | "xl" | "2xl")[] | undefined;
+    } | undefined;
+} & import("tailwind-variants/dist/config").TWMConfig & {
+    twMergeConfig: {
+        prefix: string;
+    };
+}, {
+    variant: {
+        normal: {
+            trigger: string;
+            titleWrapper: string;
+            iconBg: string;
+            triggerIcon: string;
+            contentInner: string;
+        };
+        compact: {
+            trigger: string;
+            titleWrapper: string;
+            iconBg: string;
+            title: string;
+            description: string;
+            metaWrapper: string;
+            meta: string;
+            triggerIcon: string;
+            content: string;
+            contentInner: string;
+        };
+    };
+}, {
+    base: string;
+    item: string;
+    header: string;
+    trigger: string;
+    titleWrapper: string;
+    iconBg: string;
+    icon: string;
+    titleCol: string;
+    title: string;
+    description: string;
+    metaWrapper: string;
+    meta: string;
+    triggerIcon: string;
+    triggerIconChevron: string;
+    content: string;
+    contentInner: string;
+}, import("tailwind-variants").TVReturnType<{
+    variant: {
+        normal: {
+            trigger: string;
+            titleWrapper: string;
+            iconBg: string;
+            triggerIcon: string;
+            contentInner: string;
+        };
+        compact: {
+            trigger: string;
+            titleWrapper: string;
+            iconBg: string;
+            title: string;
+            description: string;
+            metaWrapper: string;
+            meta: string;
+            triggerIcon: string;
+            content: string;
+            contentInner: string;
+        };
+    };
+}, {
+    base: string;
+    item: string;
+    header: string;
+    trigger: string;
+    titleWrapper: string;
+    iconBg: string;
+    icon: string;
+    titleCol: string;
+    title: string;
+    description: string;
+    metaWrapper: string;
+    meta: string;
+    triggerIcon: string;
+    triggerIconChevron: string;
+    content: string;
+    contentInner: string;
+}, undefined, import("tailwind-variants/dist/config").TVConfig<{
+    variant: {
+        normal: {
+            trigger: string;
+            titleWrapper: string;
+            iconBg: string;
+            triggerIcon: string;
+            contentInner: string;
+        };
+        compact: {
+            trigger: string;
+            titleWrapper: string;
+            iconBg: string;
+            title: string;
+            description: string;
+            metaWrapper: string;
+            meta: string;
+            triggerIcon: string;
+            content: string;
+            contentInner: string;
+        };
+    };
+}, {
+    variant: {
+        normal: {
+            trigger: string;
+            titleWrapper: string;
+            iconBg: string;
+            triggerIcon: string;
+            contentInner: string;
+        };
+        compact: {
+            trigger: string;
+            titleWrapper: string;
+            iconBg: string;
+            title: string;
+            description: string;
+            metaWrapper: string;
+            meta: string;
+            triggerIcon: string;
+            content: string;
+            contentInner: string;
+        };
+    };
+}>, unknown, unknown, undefined>>;

package/dist/cjs/Actions/Accordion/Accordion.styles.js

@@ -0,0 +1,57 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.accordionStyles = void 0;
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+var _satellitePrefixer = _interopRequireDefault(require("./../../styles/helpers/satellitePrefixer"));
+var _tv = require("./../../styles/helpers/tv");
+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, _templateObject29, _templateObject30, _templateObject31;
+var accordionStyles = exports.accordionStyles = (0, _tv.tv)({
+  slots: {
+    base: (0, _satellitePrefixer["default"])(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["flex flex-col"]))),
+    item: (0, _satellitePrefixer["default"])(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["group/accordion-item flex flex-col"]))),
+    header: (0, _satellitePrefixer["default"])(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])([""]))),
+    trigger: (0, _satellitePrefixer["default"])(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["group/accordion-trigger flex items-center justify-between"]))),
+    titleWrapper: (0, _satellitePrefixer["default"])(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2["default"])(["flex items-center grow"]))),
+    iconBg: (0, _satellitePrefixer["default"])(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2["default"])(["flex items-center justify-center shrink-0"]))),
+    icon: (0, _satellitePrefixer["default"])(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2["default"])(["size-4 text-grey-600 group-disabled/accordion-trigger:text-grey-300"]))),
+    titleCol: (0, _satellitePrefixer["default"])(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2["default"])(["flex flex-col gap-y-1 text-left grow"]))),
+    title: (0, _satellitePrefixer["default"])(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2["default"])(["typo-display-heading line-clamp-2 group-disabled/accordion-trigger:text-grey-300"]))),
+    description: (0, _satellitePrefixer["default"])(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2["default"])(["typo-display-body text-grey-600 line-clamp-3 group-disabled/accordion-trigger:text-grey-300"]))),
+    metaWrapper: (0, _satellitePrefixer["default"])(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2["default"])(["flex items-center gap-x-2"]))),
+    meta: (0, _satellitePrefixer["default"])(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteral2["default"])(["typo-display-caption group-disabled/accordion-trigger:text-grey-300"]))),
+    triggerIcon: (0, _satellitePrefixer["default"])(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteral2["default"])(["shrink-0 text-grey-600 group-disabled/accordion-trigger:text-grey-300"]))),
+    triggerIconChevron: (0, _satellitePrefixer["default"])(_templateObject14 || (_templateObject14 = (0, _taggedTemplateLiteral2["default"])(["group-data-[state=open]/accordion-trigger:rotate-180 motion-safe:transition-transform motion-safe:duration-300 motion-safe:ease-out"]))),
+    content: (0, _satellitePrefixer["default"])(_templateObject15 || (_templateObject15 = (0, _taggedTemplateLiteral2["default"])(["typo-display-body text-grey-600 overflow-hidden accordion-content"]))),
+    contentInner: (0, _satellitePrefixer["default"])(_templateObject16 || (_templateObject16 = (0, _taggedTemplateLiteral2["default"])([""])))
+  },
+  variants: {
+    variant: {
+      normal: {
+        trigger: (0, _satellitePrefixer["default"])(_templateObject17 || (_templateObject17 = (0, _taggedTemplateLiteral2["default"])(["w-full gap-x-3 px-3.5 py-2.5 group-first/accordion-item:rounded-t group-last/accordion-item:rounded-b bg-white border-2 border-transparent focus-visible:outline-none focus-visible:border-accent-600 enabled:hover:bg-grey-50 motion-safe:transition-colors"]))),
+        titleWrapper: (0, _satellitePrefixer["default"])(_templateObject18 || (_templateObject18 = (0, _taggedTemplateLiteral2["default"])(["gap-x-3"]))),
+        iconBg: (0, _satellitePrefixer["default"])(_templateObject19 || (_templateObject19 = (0, _taggedTemplateLiteral2["default"])(["rounded-full w-8 h-8 bg-grey-100"]))),
+        triggerIcon: (0, _satellitePrefixer["default"])(_templateObject20 || (_templateObject20 = (0, _taggedTemplateLiteral2["default"])(["size-5"]))),
+        contentInner: (0, _satellitePrefixer["default"])(_templateObject21 || (_templateObject21 = (0, _taggedTemplateLiteral2["default"])(["px-4 pt-2 pb-4"])))
+      },
+      compact: {
+        trigger: (0, _satellitePrefixer["default"])(_templateObject22 || (_templateObject22 = (0, _taggedTemplateLiteral2["default"])(["min-h-0 gap-x-2 bg-transparent border-0 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-accent-600"]))),
+        titleWrapper: (0, _satellitePrefixer["default"])(_templateObject23 || (_templateObject23 = (0, _taggedTemplateLiteral2["default"])(["gap-x-1"]))),
+        iconBg: (0, _satellitePrefixer["default"])(_templateObject24 || (_templateObject24 = (0, _taggedTemplateLiteral2["default"])(["h-6 bg-transparent"]))),
+        title: (0, _satellitePrefixer["default"])(_templateObject25 || (_templateObject25 = (0, _taggedTemplateLiteral2["default"])(["typo-display-body"]))),
+        description: (0, _satellitePrefixer["default"])(_templateObject26 || (_templateObject26 = (0, _taggedTemplateLiteral2["default"])(["hidden"]))),
+        metaWrapper: (0, _satellitePrefixer["default"])(_templateObject27 || (_templateObject27 = (0, _taggedTemplateLiteral2["default"])([""]))),
+        meta: (0, _satellitePrefixer["default"])(_templateObject28 || (_templateObject28 = (0, _taggedTemplateLiteral2["default"])(["hidden"]))),
+        triggerIcon: (0, _satellitePrefixer["default"])(_templateObject29 || (_templateObject29 = (0, _taggedTemplateLiteral2["default"])(["size-4"]))),
+        content: (0, _satellitePrefixer["default"])(_templateObject30 || (_templateObject30 = (0, _taggedTemplateLiteral2["default"])(["py-0"]))),
+        contentInner: (0, _satellitePrefixer["default"])(_templateObject31 || (_templateObject31 = (0, _taggedTemplateLiteral2["default"])(["py-1"])))
+      }
+    }
+  },
+  defaultVariants: {
+    variant: "normal"
+  }
+});

package/dist/cjs/Chat/ChatContextAccordion/ChatContextAccordion.styles.d.ts

@@ -7,8 +7,8 @@ export declare const chatContextAccordionStyles: import("tailwind-variants").TVR
             content?: import("tailwind-merge").ClassNameValue;
             item?: import("tailwind-merge").ClassNameValue;
             trigger?: import("tailwind-merge").ClassNameValue;
-            iconBg?: import("tailwind-merge").ClassNameValue;
             titleWrapper?: import("tailwind-merge").ClassNameValue;
+            iconBg?: import("tailwind-merge").ClassNameValue;
         };
     };
 } | {
@@ -20,8 +20,8 @@ export declare const chatContextAccordionStyles: import("tailwind-variants").TVR
             content?: import("tailwind-merge").ClassNameValue;
             item?: import("tailwind-merge").ClassNameValue;
             trigger?: import("tailwind-merge").ClassNameValue;
-            iconBg?: import("tailwind-merge").ClassNameValue;
             titleWrapper?: import("tailwind-merge").ClassNameValue;
+            iconBg?: import("tailwind-merge").ClassNameValue;
         };
     };
 } | {}, {
@@ -48,8 +48,8 @@ export declare const chatContextAccordionStyles: import("tailwind-variants").TVR
             content?: import("tailwind-merge").ClassNameValue;
             item?: import("tailwind-merge").ClassNameValue;
             trigger?: import("tailwind-merge").ClassNameValue;
-            iconBg?: import("tailwind-merge").ClassNameValue;
             titleWrapper?: import("tailwind-merge").ClassNameValue;
+            iconBg?: import("tailwind-merge").ClassNameValue;
         };
     };
 } | {}, {
@@ -79,8 +79,8 @@ export declare const chatContextAccordionStyles: import("tailwind-variants").TVR
             content?: import("tailwind-merge").ClassNameValue;
             item?: import("tailwind-merge").ClassNameValue;
             trigger?: import("tailwind-merge").ClassNameValue;
-            iconBg?: import("tailwind-merge").ClassNameValue;
             titleWrapper?: import("tailwind-merge").ClassNameValue;
+            iconBg?: import("tailwind-merge").ClassNameValue;
         };
     };
 } | {}>, unknown, unknown, undefined>>;

package/dist/cjs/Chat/ChatMessage/ChatMessage.d.ts

@@ -62,7 +62,7 @@ export declare type ChatMessageProps<ActionsExtraData extends Record<string, any
  *
  * See the [ChatMessage documentation page](https://satellite.algolia.com/8261d6576/p/06f740-chat-message) for more information.
  */
-export declare const ChatMessage: <ActionsExtraData extends Record<string, any> = Record<string, any>>(props: Omit<HTMLAttributes<HTMLElement>, "children" | "content"> & {
+export declare const ChatMessage: <ActionsExtraData extends Record<string, any> = Record<string, any>>(props: Omit<HTMLAttributes<HTMLElement>, "content" | "children"> & {
     /**
      * The content of the message.
      */

package/dist/cjs/Chat/ChatMessage/ChatMessage.styles.d.ts

@@ -34,8 +34,8 @@ export declare const chatMessageStyles: import("tailwind-variants").TVReturnType
     footer: string;
 }, undefined, {
     responsiveVariants?: boolean | ("sm" | "md" | "lg" | "xl" | "2xl")[] | {
-        variant?: boolean | ("sm" | "md" | "lg" | "xl" | "2xl")[] | undefined;
         leading?: boolean | ("sm" | "md" | "lg" | "xl" | "2xl")[] | undefined;
+        variant?: boolean | ("sm" | "md" | "lg" | "xl" | "2xl")[] | undefined;
         side?: boolean | ("sm" | "md" | "lg" | "xl" | "2xl")[] | undefined;
         actions?: boolean | ("sm" | "md" | "lg" | "xl" | "2xl")[] | undefined;
         autoHideActions?: boolean | ("sm" | "md" | "lg" | "xl" | "2xl")[] | undefined;

package/dist/cjs/Chat/ChatMessageError/ChatMessageError.styles.d.ts

@@ -40,8 +40,8 @@ export declare const chatMessageErrorStyles: import("tailwind-variants").TVRetur
     content: string;
 }, undefined, {
     responsiveVariants?: boolean | ("sm" | "md" | "lg" | "xl" | "2xl")[] | {
-        variant?: boolean | ("sm" | "md" | "lg" | "xl" | "2xl")[] | undefined;
         leading?: boolean | ("sm" | "md" | "lg" | "xl" | "2xl")[] | undefined;
+        variant?: boolean | ("sm" | "md" | "lg" | "xl" | "2xl")[] | undefined;
         side?: boolean | ("sm" | "md" | "lg" | "xl" | "2xl")[] | undefined;
         actions?: boolean | ("sm" | "md" | "lg" | "xl" | "2xl")[] | undefined;
         autoHideActions?: boolean | ("sm" | "md" | "lg" | "xl" | "2xl")[] | undefined;
@@ -120,8 +120,8 @@ export declare const chatMessageErrorStyles: import("tailwind-variants").TVRetur
     footer: string;
 }, undefined, {
     responsiveVariants?: boolean | ("sm" | "md" | "lg" | "xl" | "2xl")[] | {
-        variant?: boolean | ("sm" | "md" | "lg" | "xl" | "2xl")[] | undefined;
         leading?: boolean | ("sm" | "md" | "lg" | "xl" | "2xl")[] | undefined;
+        variant?: boolean | ("sm" | "md" | "lg" | "xl" | "2xl")[] | undefined;
         side?: boolean | ("sm" | "md" | "lg" | "xl" | "2xl")[] | undefined;
         actions?: boolean | ("sm" | "md" | "lg" | "xl" | "2xl")[] | undefined;
         autoHideActions?: boolean | ("sm" | "md" | "lg" | "xl" | "2xl")[] | undefined;

package/dist/cjs/Chat/ChatMessageLoader/ChatMessageLoader.styles.d.ts

@@ -67,8 +67,8 @@ export declare const chatMessageLoaderStyles: import("tailwind-variants").TVRetu
     skeleton: string;
 }, undefined, {
     responsiveVariants?: boolean | ("sm" | "md" | "lg" | "xl" | "2xl")[] | {
-        variant?: boolean | ("sm" | "md" | "lg" | "xl" | "2xl")[] | undefined;
         leading?: boolean | ("sm" | "md" | "lg" | "xl" | "2xl")[] | undefined;
+        variant?: boolean | ("sm" | "md" | "lg" | "xl" | "2xl")[] | undefined;
         side?: boolean | ("sm" | "md" | "lg" | "xl" | "2xl")[] | undefined;
         actions?: boolean | ("sm" | "md" | "lg" | "xl" | "2xl")[] | undefined;
         autoHideActions?: boolean | ("sm" | "md" | "lg" | "xl" | "2xl")[] | undefined;
@@ -147,8 +147,8 @@ export declare const chatMessageLoaderStyles: import("tailwind-variants").TVRetu
     footer: string;
 }, undefined, {
     responsiveVariants?: boolean | ("sm" | "md" | "lg" | "xl" | "2xl")[] | {
-        variant?: boolean | ("sm" | "md" | "lg" | "xl" | "2xl")[] | undefined;
         leading?: boolean | ("sm" | "md" | "lg" | "xl" | "2xl")[] | undefined;
+        variant?: boolean | ("sm" | "md" | "lg" | "xl" | "2xl")[] | undefined;
         side?: boolean | ("sm" | "md" | "lg" | "xl" | "2xl")[] | undefined;
         actions?: boolean | ("sm" | "md" | "lg" | "xl" | "2xl")[] | undefined;
         autoHideActions?: boolean | ("sm" | "md" | "lg" | "xl" | "2xl")[] | undefined;

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

@@ -16,9 +16,6 @@ var textAreaPlugin = plugin(function (_ref) {
       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")
       },
@@ -50,6 +47,9 @@ var textAreaPlugin = plugin(function (_ref) {
       color: theme("colors.grey.900"),
       background: "transparent",
       padding: theme("spacing.4"),
+      "&::placeholder": {
+        color: theme("colors.grey.600")
+      },
       "&:focus": {
         outline: "none"
       },

package/dist/cjs/Helpers/MarkdownContent/MarkdownContent.d.ts

@@ -1,4 +1,5 @@
 import type { FC } from "react";
+import type { Components } from "react-markdown";
 export interface MarkdownContentProps {
     /**
      * Additional classes to apply to the `MarkdownContent`.
@@ -8,8 +9,14 @@ export interface MarkdownContentProps {
      * The content of the `MarkdownContent`.
      */
     content?: string;
+    /**
+     * Custom components to override the default rendering of markdown elements.
+     */
+    components?: Partial<Components>;
 }
 /**
  * The `MarkdownContent` component is used to style user generated content that comes as Markdown.
+ *
+ * See the [Markdown Content documentation page](https://satellite.algolia.com/8261d6576/p/784293-markdown-content) for more information.
  */
 export declare const MarkdownContent: FC<MarkdownContentProps>;