"use strict";
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
const jsxRuntime = require("react/jsx-runtime");
require("react");
const getSize = require("../../core/utils/get-size/get-size.cjs");
const createVarsResolver = require("../../core/styles-api/create-vars-resolver/create-vars-resolver.cjs");
require("clsx");
const useProps = require("../../core/MantineProvider/use-props/use-props.cjs");
const useStyles = require("../../core/styles-api/use-styles/use-styles.cjs");
const Box = require("../../core/Box/Box.cjs");
const polymorphicFactory = require("../../core/factory/polymorphic-factory.cjs");
const AccordionChevron = require("../Accordion/AccordionChevron.cjs");
const Collapse = require("../Collapse/Collapse.cjs");
const UnstyledButton = require("../UnstyledButton/UnstyledButton.cjs");
const NavLink_module_css = require("./NavLink.module.css.cjs");
const useUncontrolled = require("../../../../../../../@mantine_hooks@7.15.2_react@18.3.1/node_modules/@mantine/hooks/esm/use-uncontrolled/use-uncontrolled.cjs");
const defaultProps = {};
const varsResolver = createVarsResolver.createVarsResolver(
  (theme, { variant, color, childrenOffset, autoContrast }) => {
    const colors = theme.variantColorResolver({
      color: color || theme.primaryColor,
      theme,
      variant: variant || "light",
      autoContrast
    });
    return {
      root: {
        "--nl-bg": color || variant ? colors.background : void 0,
        "--nl-hover": color || variant ? colors.hover : void 0,
        "--nl-color": color || variant ? colors.color : void 0
      },
      children: {
        "--nl-offset": getSize.getSpacing(childrenOffset)
      }
    };
  }
);
const NavLink = polymorphicFactory.polymorphicFactory((_props, ref) => {
  const props = useProps.useProps("NavLink", defaultProps, _props);
  const {
    classNames,
    className,
    style,
    styles,
    unstyled,
    vars,
    opened,
    defaultOpened,
    onChange,
    children,
    onClick,
    active,
    disabled,
    leftSection,
    rightSection,
    label,
    description,
    disableRightSectionRotation,
    noWrap,
    childrenOffset,
    onKeyDown,
    autoContrast,
    mod,
    ...others
  } = props;
  const getStyles = useStyles.useStyles({
    name: "NavLink",
    props,
    classes: NavLink_module_css.default,
    className,
    style,
    classNames,
    styles,
    unstyled,
    vars,
    varsResolver
  });
  const [_opened, setOpened] = useUncontrolled.useUncontrolled({
    value: opened,
    defaultValue: defaultOpened,
    finalValue: false,
    onChange
  });
  const withChildren = !!children;
  const handleClick = (event) => {
    onClick == null ? void 0 : onClick(event);
    if (withChildren) {
      event.preventDefault();
      setOpened(!_opened);
    }
  };
  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
    /* @__PURE__ */ jsxRuntime.jsxs(
      UnstyledButton.UnstyledButton,
      {
        ...getStyles("root"),
        component: "a",
        ref,
        onClick: handleClick,
        onKeyDown: (event) => {
          onKeyDown == null ? void 0 : onKeyDown(event);
          if (event.nativeEvent.code === "Space" && withChildren) {
            event.preventDefault();
            setOpened(!_opened);
          }
        },
        unstyled,
        mod: [{ disabled, active, expanded: _opened }, mod],
        ...others,
        children: [
          leftSection && /* @__PURE__ */ jsxRuntime.jsx(Box.Box, { component: "span", ...getStyles("section"), mod: { position: "left" }, children: leftSection }),
          /* @__PURE__ */ jsxRuntime.jsxs(Box.Box, { ...getStyles("body"), mod: { "no-wrap": noWrap }, children: [
            /* @__PURE__ */ jsxRuntime.jsx(Box.Box, { component: "span", ...getStyles("label"), children: label }),
            /* @__PURE__ */ jsxRuntime.jsx(Box.Box, { component: "span", mod: { active }, ...getStyles("description"), children: description })
          ] }),
          (withChildren || rightSection) && /* @__PURE__ */ jsxRuntime.jsx(
            Box.Box,
            {
              ...getStyles("section"),
              component: "span",
              mod: { rotate: _opened && !disableRightSectionRotation, position: "right" },
              children: withChildren ? rightSection || /* @__PURE__ */ jsxRuntime.jsx(AccordionChevron.AccordionChevron, { ...getStyles("chevron") }) : rightSection
            }
          )
        ]
      }
    ),
    withChildren && /* @__PURE__ */ jsxRuntime.jsx(Collapse.Collapse, { in: _opened, ...getStyles("collapse"), children: /* @__PURE__ */ jsxRuntime.jsx("div", { ...getStyles("children"), children }) })
  ] });
});
NavLink.classes = NavLink_module_css.default;
NavLink.displayName = "@mantine/core/NavLink";
exports.NavLink = NavLink;
