export declare const buttonTemplate = "\"use client\";\nimport Link from \"next/link\";\nimport styled from \"styled-components\";\nimport {\n  theme as localTheme,\n  ButtonProps,\n  buttonStyles,\n} from \"cherry-styled-components\";\nimport { Icon } from \"@/components/layout/Icon\";\n\ninterface LinkButtonProps extends ButtonProps {\n  href?: string;\n  target?: \"_blank\" | \"_self\" | \"_parent\" | \"_top\";\n  rel?: string;\n  variant?: \"primary\" | \"secondary\" | \"tertiary\";\n  size?: \"default\" | \"big\";\n  outline?: boolean;\n  fullWidth?: boolean;\n  icon?: string;\n  iconPosition?: \"left\" | \"right\";\n  theme?: typeof localTheme;\n}\n\n// Cherry's buttonStyles picks filled-button text from the theme object, which\n// this app keeps on the light mode for static rendering, so pin it to\n// `surface` instead: that token resolves through a CSS variable and is the\n// readable-on-brand color in both modes. Filled, non-disabled case only.\n// The \"button-link\" class opts this anchor out of the global a:focus-visible\n// ring (see GlobalStyles) so Cherry's buttonStyles owns the button's focus look.\nconst StyledLinkButton = styled(Link).attrs({\n  className: \"button-link\",\n})<LinkButtonProps>`\n  ${({ theme, $variant, $size, $outline, $fullWidth, $error, disabled }) =>\n    buttonStyles(\n      theme,\n      $variant,\n      $size,\n      $outline,\n      $fullWidth,\n      $error,\n      disabled,\n    )}\n\n  ${({ theme, $outline, disabled }) =>\n    !disabled && !$outline && `color: ${theme.colors.surface};`}\n\n  & p {\n    color: inherit !important;\n  }\n\n  & svg.lucide {\n    margin: auto 0;\n    min-width: min-content;\n    color: inherit;\n  }\n`;\n\nconst ButtonBase = styled.button<ButtonProps>`\n  ${({ theme, $variant, $size, $outline, $fullWidth, $error, disabled }) =>\n    buttonStyles(\n      theme,\n      $variant,\n      $size,\n      $outline,\n      $fullWidth,\n      $error,\n      disabled,\n    )}\n\n  ${({ theme, $outline, disabled }) =>\n    !disabled && !$outline && `color: ${theme.colors.surface};`}\n\n  & p {\n    color: inherit !important;\n  }\n\n  & svg.lucide {\n    margin: auto 0;\n    min-width: min-content;\n    color: inherit;\n  }\n`;\n\nfunction Button({\n  variant = \"primary\",\n  size,\n  outline,\n  fullWidth,\n  icon,\n  iconPosition = \"left\",\n  theme: _theme = localTheme,\n  href,\n  target,\n  rel,\n  ...props\n}: LinkButtonProps) {\n  const isExternal = typeof href === \"string\" && /^(https?:)?\\/\\//i.test(href);\n  const resolvedTarget = target ?? (isExternal ? \"_blank\" : undefined);\n  const resolvedRel =\n    rel ?? (resolvedTarget === \"_blank\" ? \"noopener noreferrer\" : undefined);\n  return href ? (\n    <div>\n      <StyledLinkButton\n        {...props}\n        href={href}\n        target={resolvedTarget}\n        rel={resolvedRel}\n        $variant={variant}\n        $size={size}\n        $outline={outline}\n        $fullWidth={fullWidth}\n      >\n        {iconPosition === \"left\" && icon && <Icon name={icon} size={16} />}\n        {props.children}\n        {iconPosition === \"right\" && icon && <Icon name={icon} size={16} />}\n      </StyledLinkButton>\n    </div>\n  ) : (\n    <div>\n      <ButtonBase\n        {...props}\n        $variant={variant}\n        $size={size}\n        $outline={outline}\n        $fullWidth={fullWidth}\n      >\n        {iconPosition === \"left\" && icon && <Icon name={icon} size={16} />}\n        {props.children}\n        {iconPosition === \"right\" && icon && <Icon name={icon} size={16} />}\n      </ButtonBase>\n    </div>\n  );\n}\n\nexport { Button };\n";