import { j as attributes, g as clsx, d as bind_props } from './index2-BuOY2QE4.js';

function Button($$renderer, $$props) {
  $$renderer.component(($$renderer2) => {
    let {
      variant = "primary",
      size = "medium",
      type = "button",
      disabled = false,
      class: className = "",
      children,
      el = void 0,
      $$slots,
      $$events,
      ...rest
    } = $$props;
    const variantClasses = {
      primary: "border border-thin border-rc-green-450 shadow-inner-white-soft backdrop-blur-xl rounded-lg text-rc-gray-100 font-bold bg-rc-green-350 hover:bg-rc-green-250 focus:bg-rc-green-200 focus:outline-none active:bg-rc-green-250",
      secondary: "border border-thin border-rc-gray-050 shadow-inner-white-soft backdrop-blur-2xl rounded-lg text-rc-gray-100 font-bold bg-rc-gray-930 hover:bg-double-gradient focus:bg-double-gradient focus:outline-none active:bg-double-gradient",
      outlined: "border border-rc-gray-500 bg-rc-gray-900 font-semibold hover:bg-rc-gray-700 hover:border-rc-gray-400 focus:outline-none focus:ring-0 focus:border-rc-gray-400 active:border-rc-gray-400",
      ghost: "bg-transparent rounded-lg hover:text-gray-100 focus:text-gray-100 active:text-gray-100"
    };
    const sizeClasses = {
      big: "px-4 py-2 text-base",
      medium: "px-4 py-2 text-base",
      small: "px-4 py-2 text-base"
    };
    let buttonClasses = `text-gray-200
    rounded
    transition-colors
    ${variantClasses[variant]}
    ${sizeClasses[size]}
    ${disabled ? "opacity-50 cursor-not-allowed" : "cursor-pointer"}
    ${className}
  `.trim();
    $$renderer2.push(`<button${attributes({ type, class: clsx(buttonClasses), disabled, ...rest })}>`);
    children($$renderer2);
    $$renderer2.push(`<!----></button>`);
    bind_props($$props, { el });
  });
}

export { Button as B };
//# sourceMappingURL=Button-Cd4Yzpdy.js.map
