How to use the @paprika/stylers/lib/helpers.zValue function in @paprika/stylers

/** Render the sidepanel inline */
  isInline: PropTypes.bool,
};

const defaultProps = {
  groupOffsetY: 0,
  isCompact: false,
  isInline: false,
  kind: "default",
  offsetY: 0,
  onAfterClose: () => {},
  onClose: null,
  onAfterOpen: () => {},
  width: "33%",
  zIndex: zValue(7),
};

function SidePanel(props) {
  // Props
  const {
    onAfterClose,
    onAfterOpen,
    onClose,
    groupOffsetY,
    width,
    isCompact,
    isInline,
    kind,
    offsetY,
    isOpen,
    ...moreProps

/**
   * Will accept the click event on outside of the sidepanel when losing focus
   * @boolean
   */
  background: PropTypes.string,
  hasOutsideClick: PropTypes.bool,
  onClose: PropTypes.func,
  /** Control the z position of the sidepanel overlay */
  zIndex: PropTypes.number,
};

const defaultProps = {
  background: "#000",
  hasOutsideClick: true,
  onClose: null,
  zIndex: zValue(6),
};

export default function Overlay(props) {
  const I18n = useI18n();

  const { onClose, hasOutsideClick, ...moreProps } = props;
  const handleClick = () => {
    if (hasOutsideClick) {
      onClose();
    }
  };

  const vh = visuallyHidden;

  return (

import ReactDOM from "react-dom";
import { zValue } from "@paprika/stylers/lib/helpers";
import { extractChildren } from "../../helpers";
import Overlay from "../Overlay";
import { groupCSS } from "./Group.styles";
import useOffsetScroll from "../../hooks/useOffsetScroll";

const propTypes = {
  children: PropTypes.node.isRequired,
  offsetY: PropTypes.number,
  zIndex: PropTypes.number,
};

const defaultProps = {
  offsetY: 0,
  zIndex: zValue(6),
};

export default function Group(props) {
  const { children, offsetY, ...moreProps } = props;
  const { SidePanel: sidePanels, "SidePanel.Overlay": OverlayExtracted } = extractChildren(children, [
    "SidePanel",
    "SidePanel.Overlay",
  ]);
  if (!Array.isArray(sidePanels)) {
    throw new Error(" is intented to be use with two or more SidePanels");
  }

  const offsetScroll = useOffsetScroll(offsetY);

  if (sidePanels.filter(sidePanel => !sidePanel.props.isOpen).length === sidePanels.length) {
    return null;