{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "button",
  "title": "Button",
  "description": "A glass capsule. Blue is for the one primary action; red text marks refusal.",
  "registryDependencies": [
    "https://creance.pages.dev/r/creance-base.json"
  ],
  "files": [
    {
      "path": "button/Button.css",
      "content": "/* A glass capsule. Blue is reserved for the one primary action; red text marks refusal. */\n.cr-button {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  gap: var(--cr-space-2);\n  min-height: var(--cr-control-height-md);\n  padding: 0 var(--cr-space-5);\n  border: 1px solid var(--cr-color-glass-edge);\n  border-radius: var(--cr-radius-full);\n  background: var(--cr-color-glass-control);\n  box-shadow: var(--cr-shadow-sm);\n  color: var(--cr-color-text-default);\n  font: inherit;\n  font-family: var(--cr-font-family-sans);\n  font-size: var(--cr-font-size-md);\n  font-weight: var(--cr-font-weight-semibold);\n  line-height: var(--cr-font-line-height-tight);\n  white-space: nowrap;\n  cursor: pointer;\n  transition:\n    background-color var(--cr-motion-duration-fast) var(--cr-motion-easing-standard),\n    color var(--cr-motion-duration-fast) var(--cr-motion-easing-standard),\n    transform var(--cr-motion-duration-base) var(--cr-motion-easing-spring);\n}\n\n.cr-button[data-size='sm'] {\n  min-height: var(--cr-control-height-sm);\n  padding: 0 var(--cr-space-3);\n  font-size: var(--cr-font-size-sm);\n}\n\n.cr-button:hover:not(:disabled) {\n  background: var(--cr-color-glass-popover);\n}\n\n.cr-button:active:not(:disabled) {\n  transform: scale(0.97);\n}\n\n.cr-button:focus-visible {\n  outline: var(--cr-focus-width) solid var(--cr-color-focus);\n  outline-offset: var(--cr-focus-offset);\n}\n\n.cr-button:disabled {\n  cursor: not-allowed;\n  opacity: 0.5;\n}\n\n.cr-button[data-variant='primary'] {\n  border-color: transparent;\n  background: var(--cr-color-accent-bg);\n  box-shadow: var(--cr-shadow-accent);\n  color: var(--cr-color-accent-fg);\n}\n\n.cr-button[data-variant='primary']:hover:not(:disabled) {\n  background: var(--cr-color-accent-bg-hover);\n}\n\n.cr-button[data-variant='primary']:active:not(:disabled) {\n  background: var(--cr-color-accent-bg-active);\n}\n\n.cr-button[data-variant='danger'] {\n  color: var(--cr-color-danger-text);\n}\n\n.cr-button[data-variant='danger']:hover:not(:disabled) {\n  border-color: transparent;\n  background: var(--cr-color-danger-bg);\n  color: var(--cr-color-danger-fg);\n}\n\n.cr-button[data-variant='ghost'] {\n  border-color: transparent;\n  background: transparent;\n  box-shadow: none;\n}\n\n.cr-button[data-variant='ghost']:hover:not(:disabled) {\n  background: var(--cr-color-bg-subtle);\n}\n",
      "type": "registry:file",
      "target": "@components/creance/button/Button.css"
    },
    {
      "path": "button/Button.tsx",
      "content": "import { forwardRef, type ButtonHTMLAttributes } from 'react';\nimport { cx } from '@/lib/creance/cx';\nimport './Button.css';\n\nexport interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {\n  /** Visual weight. Use one `primary` per group of actions. */\n  variant?: 'primary' | 'secondary' | 'danger' | 'ghost';\n  size?: 'sm' | 'md';\n}\n\nexport const Button = forwardRef<HTMLButtonElement, ButtonProps>(function Button(\n  { variant = 'secondary', size = 'md', type = 'button', className, ...props },\n  ref,\n) {\n  return (\n    <button\n      ref={ref}\n      type={type}\n      className={cx('cr-button', className)}\n      data-variant={variant}\n      data-size={size}\n      {...props}\n    />\n  );\n});\n",
      "type": "registry:ui",
      "target": "@components/creance/button/Button.tsx"
    }
  ],
  "categories": [
    "atom",
    "actions"
  ],
  "type": "registry:ui"
}