@intility/bifrost-react/dist/components/Accordion/Accordion.js

React library for Intility's design system, Bifrost.

"use client";

import { forwardRef, useCallback, useRef } from "react";
import classNames from "classnames";
import { AccordionContext } from "./hooks/useAccordionContext.js";
import { jsx as _jsx } from "react/jsx-runtime";
const accordionRadii = {
  none: `0px`,
  xs: `4px`,
  s: `8px`,
  m: `12px`,
  l: `16px`,
  xl: `24px`
};
const Accordion = /*#__PURE__*/forwardRef(({
  children,
  className,
  style,
  noBorder = false,
  variant = "default",
  mode = "default",
  multiple = false,
  radius,
  ...props
}, ref) => {
  const subscribers = useRef(new Set());
  const subscribe = useCallback(callback => {
    subscribers.current.add(callback);
    return () => subscribers.current.delete(callback);
  }, []);
  return /*#__PURE__*/_jsx(AccordionContext.Provider, {
    value: {
      subscribe,
      // When an item opens, it calls this function
      announceOpening: () => {
        // No need to announce if multiple is allowed open
        if (!multiple) {
          // Calling the registered item callback function closes the item
          subscribers.current.forEach(subscriber => subscriber());
        }
      }
    },
    children: /*#__PURE__*/_jsx("div", {
      ref: ref,
      className: classNames(className, "bf-accordion", {
        "bf-accordion-noborder": noBorder,
        "bf-accordion-styled": variant === "styled",
        "bf-accordion-compact": mode === "compact",
        "bf-accordion-responsive": mode === "responsive"
      }),
      style: {
        ["--bf-accordion-radius"]: radius && accordionRadii[radius],
        ...style
      },
      ...props,
      children: children
    })
  });
});
Accordion.displayName = "Accordion";
export default Accordion;