@liveblocks/react-ui/dist/components/internal/List.cjs

A set of React pre-built components for the Liveblocks products. Liveblocks is the all-in-one toolkit to build collaborative products like Figma, Notion, and more.

'use strict';

var jsxRuntime = require('react/jsx-runtime');
var reactSlot = require('@radix-ui/react-slot');
var react = require('react');
var overrides = require('../../overrides.cjs');
var classNames = require('../../utils/class-names.cjs');
var intl = require('../../utils/intl.cjs');

const List = react.forwardRef(
  ({ values, formatRemaining, truncate, locale, className, asChild, ...props }, forwardedRef) => {
    const Component = asChild ? reactSlot.Slot : "span";
    const $ = overrides.useOverrides();
    const formatRemainingWithDefault = formatRemaining ?? $.LIST_REMAINING;
    const formattedList = react.useMemo(() => {
      const elements = truncate && truncate < values.length - 1 ? [
        ...values.slice(0, truncate),
        formatRemainingWithDefault(values.length - truncate)
      ] : [...values];
      const placeholders = Array(elements.length).fill(".");
      const parts = intl.listFormat(locale).formatToParts(placeholders);
      return parts.map(
        (part) => part.type === "element" ? elements.shift() : part.value
      );
    }, [formatRemainingWithDefault, locale, truncate, values]);
    return /* @__PURE__ */ jsxRuntime.jsx(Component, {
      className: classNames.classNames("lb-list", className),
      ...props,
      ref: forwardedRef,
      children: formattedList
    });
  }
);

exports.List = List;
//# sourceMappingURL=List.cjs.map