"use strict";
var __create = Object.create;
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __getProtoOf = Object.getPrototypeOf;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __export = (target, all) => {
  for (var name in all)
    __defProp(target, name, { get: all[name], enumerable: true });
};
var __copyProps = (to, from, except, desc) => {
  if (from && typeof from === "object" || typeof from === "function") {
    for (let key of __getOwnPropNames(from))
      if (!__hasOwnProp.call(to, key) && key !== except)
        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
  }
  return to;
};
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
  // If the importer is in node compatibility mode or this is not an ESM
  // file that has been converted to a CommonJS file using a Babel-
  // compatible transform (i.e. "__esModule" has not been set), then set
  // "default" to the CommonJS "module.exports" for node compatibility.
  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
  mod
));
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);

// packages/components/src/button/index.tsx
var button_exports = {};
__export(button_exports, {
  Button: () => Button,
  UnforwardedButton: () => UnforwardedButton,
  default: () => button_default
});
module.exports = __toCommonJS(button_exports);
var import_clsx = __toESM(require("clsx"), 1);
var import_deprecated = __toESM(require("@wordpress/deprecated"), 1);
var import_element = require("@wordpress/element");
var import_compose = require("@wordpress/compose");
var import_tooltip = __toESM(require("../tooltip/index.cjs"), 1);
var import_icon = __toESM(require("../icon/index.cjs"), 1);
var import_visually_hidden = require("../visually-hidden/index.cjs");
var import_utils = require("../popover/utils.cjs");
var import_jsx_runtime = require("react/jsx-runtime");
var disabledEventsOnDisabledButton = ["onMouseDown", "onClick"];
function useDeprecatedProps({
  __experimentalIsFocusable,
  isDefault,
  isPrimary,
  isSecondary,
  isTertiary,
  isLink,
  isPressed,
  isSmall,
  size,
  variant,
  describedBy,
  ...otherProps
}) {
  let computedSize = size;
  let computedVariant = variant;
  const newProps = {
    accessibleWhenDisabled: __experimentalIsFocusable,
    // @todo Mark `isPressed` as deprecated
    "aria-pressed": isPressed,
    description: describedBy
  };
  if (isSmall) {
    var _computedSize;
    (_computedSize = computedSize) !== null && _computedSize !== void 0 ? _computedSize : computedSize = "small";
  }
  if (isPrimary) {
    var _computedVariant;
    (_computedVariant = computedVariant) !== null && _computedVariant !== void 0 ? _computedVariant : computedVariant = "primary";
  }
  if (isTertiary) {
    var _computedVariant2;
    (_computedVariant2 = computedVariant) !== null && _computedVariant2 !== void 0 ? _computedVariant2 : computedVariant = "tertiary";
  }
  if (isSecondary) {
    var _computedVariant3;
    (_computedVariant3 = computedVariant) !== null && _computedVariant3 !== void 0 ? _computedVariant3 : computedVariant = "secondary";
  }
  if (isDefault) {
    var _computedVariant4;
    (0, import_deprecated.default)("wp.components.Button `isDefault` prop", {
      since: "5.4",
      alternative: 'variant="secondary"'
    });
    (_computedVariant4 = computedVariant) !== null && _computedVariant4 !== void 0 ? _computedVariant4 : computedVariant = "secondary";
  }
  if (isLink) {
    var _computedVariant5;
    (_computedVariant5 = computedVariant) !== null && _computedVariant5 !== void 0 ? _computedVariant5 : computedVariant = "link";
  }
  return {
    ...newProps,
    ...otherProps,
    size: computedSize,
    variant: computedVariant
  };
}
function UnforwardedButton(props, ref) {
  const {
    __next40pxDefaultSize,
    accessibleWhenDisabled,
    isBusy,
    isDestructive,
    className,
    disabled,
    icon,
    iconPosition = "left",
    iconSize,
    showTooltip,
    tooltipPosition,
    shortcut,
    label,
    children,
    size = "default",
    text,
    variant,
    description,
    ...buttonOrAnchorProps
  } = useDeprecatedProps(props);
  const {
    href,
    target,
    "aria-checked": ariaChecked,
    "aria-pressed": ariaPressed,
    "aria-selected": ariaSelected,
    ...additionalProps
  } = "href" in buttonOrAnchorProps ? buttonOrAnchorProps : {
    href: void 0,
    target: void 0,
    ...buttonOrAnchorProps
  };
  const instanceId = (0, import_compose.useInstanceId)(Button, "components-button__description");
  const hasChildren = "string" === typeof children && !!children || Array.isArray(children) && children?.[0] && children[0] !== null && // Tooltip should not considered as a child
  children?.[0]?.props?.className !== "components-tooltip";
  const truthyAriaPressedValues = [true, "true", "mixed"];
  const classes = (0, import_clsx.default)("components-button", className, {
    "is-next-40px-default-size": __next40pxDefaultSize,
    "is-secondary": variant === "secondary",
    "is-primary": variant === "primary",
    "is-small": size === "small",
    "is-compact": size === "compact",
    "is-tertiary": variant === "tertiary",
    "is-pressed": truthyAriaPressedValues.includes(ariaPressed),
    "is-pressed-mixed": ariaPressed === "mixed",
    "is-busy": isBusy,
    "is-link": variant === "link",
    "is-destructive": isDestructive,
    "has-text": !!icon && (hasChildren || text),
    "has-icon": !!icon,
    "has-icon-right": iconPosition === "right"
  });
  const trulyDisabled = disabled && !accessibleWhenDisabled;
  const Tag = href !== void 0 && !disabled ? "a" : "button";
  const buttonProps = Tag === "button" ? {
    type: "button",
    disabled: trulyDisabled,
    "aria-checked": ariaChecked,
    "aria-pressed": ariaPressed,
    "aria-selected": ariaSelected
  } : {};
  const anchorProps = Tag === "a" ? {
    href,
    target
  } : {};
  const disableEventProps = {};
  if (disabled && accessibleWhenDisabled) {
    buttonProps["aria-disabled"] = true;
    anchorProps["aria-disabled"] = true;
    for (const disabledEvent of disabledEventsOnDisabledButton) {
      disableEventProps[disabledEvent] = (event) => {
        if (event) {
          event.stopPropagation();
          event.preventDefault();
        }
      };
    }
  }
  const shouldShowTooltip = !trulyDisabled && // An explicit tooltip is passed or...
  (showTooltip && !!label || // There's a shortcut or...
  !!shortcut || // There's a label and...
  !!label && // The children are empty and...
  !children?.length && // The tooltip is not explicitly disabled.
  false !== showTooltip);
  const descriptionId = description ? instanceId : void 0;
  const describedById = additionalProps["aria-describedby"] || descriptionId;
  const commonProps = {
    className: classes,
    "aria-label": additionalProps["aria-label"] || label,
    "aria-describedby": describedById,
    ref
  };
  const elementChildren = /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, {
    children: [icon && iconPosition === "left" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icon.default, {
      icon,
      size: iconSize
    }), text && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, {
      children: text
    }), children, icon && iconPosition === "right" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icon.default, {
      icon,
      size: iconSize
    })]
  });
  const element = Tag === "a" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("a", {
    ...anchorProps,
    ...additionalProps,
    ...disableEventProps,
    ...commonProps,
    children: elementChildren
  }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", {
    ...buttonProps,
    ...additionalProps,
    ...disableEventProps,
    ...commonProps,
    children: elementChildren
  });
  const tooltipProps = shouldShowTooltip ? {
    text: children?.length && description ? description : label,
    shortcut,
    placement: tooltipPosition && // Convert legacy `position` values to be used with the new `placement` prop
    (0, import_utils.positionToPlacement)(tooltipPosition)
  } : {};
  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, {
    children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tooltip.default, {
      ...tooltipProps,
      children: element
    }), description && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_visually_hidden.VisuallyHidden, {
      children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
        id: descriptionId,
        children: description
      })
    })]
  });
}
var Button = (0, import_element.forwardRef)(UnforwardedButton);
var button_default = Button;
// Annotate the CommonJS export names for ESM import in node:
0 && (module.exports = {
  Button,
  UnforwardedButton
});
//# sourceMappingURL=index.cjs.map
