@gfazioli/mantine-flip/dist/esm/FlipTarget/FlipTarget.mjs

Flip component is a wrapper for any component that can be flipped. It is used to create cards, flip boxes and more.

'use client';
import React, { cloneElement } from 'react';
import { useProps, isElement, createEventHandler } from '@mantine/core';
import { useFlipContext } from '../Flip.context.mjs';

const defaultProps = {
  refProp: "ref"
};
function FlipTarget(props) {
  const { children, refProp: _refProp, ...others } = useProps("FlipTarget", defaultProps, props);
  if (!isElement(children)) {
    throw new Error(
      "Flip.Target component children should be an element or a component that accepts ref. Fragments, strings, numbers and other primitive values are not supported"
    );
  }
  const ctx = useFlipContext();
  const onClick = createEventHandler(
    children.props.onClick,
    () => ctx.toggleFlip()
  );
  return /* @__PURE__ */ React.createElement("div", { ...others }, cloneElement(children, {
    onClick,
    "data-flipped": ctx.flipped ? true : void 0,
    "data-disabled": ctx.disabled ? true : void 0,
    "aria-disabled": ctx.disabled || void 0
  }));
}
FlipTarget.displayName = "FlipTarget";

export { FlipTarget };
//# sourceMappingURL=FlipTarget.mjs.map