@dnb/eufemia/components/filter/FilterPanelButton.js

DNB Eufemia Design System UI Library

"use client";

import { useCallback, useContext, useEffect, useRef } from 'react';
import Button from "../button/Button.js";
import { FilterContext } from "./FilterContext.js";
import { filter as filterIcon, close } from "../../icons/index.js";
import Icon from "../icon/Icon.js";
import SharedContext from "../../shared/Context.js";
import { jsx as _jsx } from "react/jsx-runtime";
const panelToggleIcon = Icon.transition({
  closed: filterIcon,
  open: close
});
function FilterPanelButton({
  children,
  onClick,
  ...rest
}) {
  const context = useContext(FilterContext);
  const sharedContext = useContext(SharedContext);
  const {
    panelButtonLabel
  } = sharedContext.getTranslation({}).Filter;
  if (!context) {
    throw new Error('Filter.PanelButton must be used inside a Filter.Root.');
  }
  const {
    panelOpen,
    setPanelOpen,
    panelButtonRef
  } = context;
  const localRef = useRef(null);
  useEffect(() => {
    panelButtonRef.current = localRef.current;
  }, [panelButtonRef]);
  const handleClick = useCallback(event => {
    setPanelOpen(!panelOpen);
    onClick?.(event);
  }, [panelOpen, setPanelOpen, onClick]);
  return _jsx(Button, {
    variant: "tertiary",
    icon: panelToggleIcon,
    iconPosition: "left",
    transitionState: panelOpen ? 'open' : 'closed',
    "aria-expanded": panelOpen,
    ref: localRef,
    onClick: handleClick,
    ...rest,
    children: children !== null && children !== void 0 ? children : panelButtonLabel
  });
}
export default FilterPanelButton;
//# sourceMappingURL=FilterPanelButton.js.map