{
  "$schema": "https://ui.shadcn.com/schema/registry.json",
  "name": "flootlets",
  "homepage": "https://dyeoh.github.io/flootlets/",
  "items": [
    {
      "name": "theme",
      "type": "registry:theme",
      "title": "flootlets theme",
      "description": "shadcn/ui's neutral theme with success and warning, adjusted to meet WCAG AA, plus the base rules and animations the components use.",
      "cssVars": {
        "theme": {
          "animate-fade-in": "fade-in 200ms cubic-bezier(0.2, 0, 0, 1)",
          "animate-fade-out": "fade-out 120ms ease-in forwards",
          "animate-pop-in": "pop-in 200ms cubic-bezier(0.2, 0, 0, 1)",
          "animate-slide-out-right": "slide-out-right 120ms ease-out forwards"
        },
        "light": {
          "radius": "0.625rem",
          "background": "oklch(1 0 0)",
          "foreground": "oklch(0.145 0 0)",
          "card": "oklch(1 0 0)",
          "card-foreground": "oklch(0.145 0 0)",
          "popover": "oklch(1 0 0)",
          "popover-foreground": "oklch(0.145 0 0)",
          "primary": "oklch(0.205 0 0)",
          "primary-foreground": "oklch(0.985 0 0)",
          "secondary": "oklch(0.97 0 0)",
          "secondary-foreground": "oklch(0.205 0 0)",
          "muted": "oklch(0.97 0 0)",
          "muted-foreground": "oklch(0.54 0 0)",
          "accent": "oklch(0.97 0 0)",
          "accent-foreground": "oklch(0.205 0 0)",
          "destructive": "oklch(0.56 0.245 27.325)",
          "destructive-foreground": "oklch(0.985 0 0)",
          "success": "oklch(0.527 0.154 150.069)",
          "success-foreground": "oklch(0.985 0 0)",
          "warning": "oklch(0.555 0.163 48.998)",
          "warning-foreground": "oklch(0.985 0 0)",
          "border": "oklch(0.922 0 0)",
          "input": "oklch(0.64 0 0)",
          "ring": "oklch(0.64 0 0)"
        },
        "dark": {
          "background": "oklch(0.145 0 0)",
          "foreground": "oklch(0.985 0 0)",
          "card": "oklch(0.205 0 0)",
          "card-foreground": "oklch(0.985 0 0)",
          "popover": "oklch(0.205 0 0)",
          "popover-foreground": "oklch(0.985 0 0)",
          "primary": "oklch(0.922 0 0)",
          "primary-foreground": "oklch(0.205 0 0)",
          "secondary": "oklch(0.269 0 0)",
          "secondary-foreground": "oklch(0.985 0 0)",
          "muted": "oklch(0.269 0 0)",
          "muted-foreground": "oklch(0.708 0 0)",
          "accent": "oklch(0.269 0 0)",
          "accent-foreground": "oklch(0.985 0 0)",
          "destructive": "oklch(0.704 0.191 22.216)",
          "destructive-foreground": "oklch(0.145 0 0)",
          "success": "oklch(0.792 0.209 151.711)",
          "success-foreground": "oklch(0.145 0 0)",
          "warning": "oklch(0.828 0.189 84.429)",
          "warning-foreground": "oklch(0.145 0 0)",
          "border": "oklch(1 0 0 / 10%)",
          "input": "oklch(0.55 0 0)",
          "ring": "oklch(0.556 0 0)"
        }
      },
      "css": {
        "@keyframes fade-in": {
          "from": {
            "opacity": "0"
          }
        },
        "@keyframes fade-out": {
          "to": {
            "opacity": "0"
          }
        },
        "@keyframes pop-in": {
          "from": {
            "opacity": "0",
            "transform": "translateY(0.5rem) scale(0.98)"
          }
        },
        "@keyframes slide-out-right": {
          "to": {
            "transform": "translateX(100%)"
          }
        },
        "@layer base": {
          "*, ::before, ::after, ::backdrop": {
            "border-color": "var(--border)"
          },
          "body": {
            "background-color": "var(--background)",
            "color": "var(--foreground)"
          },
          ":where(button, summary, label[for], select, [role='button'], [role='option'], [role='menuitem'], [role='menuitemcheckbox'], [role='menuitemradio'], [role='tab'], [role='radio'], [role='checkbox'], [role='switch'], [data-highlighted])": {
            "cursor": "pointer"
          },
          ":where(:disabled, [aria-disabled='true'], [data-disabled])": {
            "cursor": "not-allowed"
          },
          ":where(:focus-visible)": {
            "outline": "2px solid var(--ring)",
            "outline-offset": "2px"
          }
        }
      },
      "meta": {
        "version": "0.2.3",
        "docs": "https://dyeoh.github.io/flootlets/theming/"
      }
    },
    {
      "name": "utils",
      "type": "registry:lib",
      "title": "cn()",
      "description": "Joins classes and resolves Tailwind conflicts (clsx + tailwind-merge), as in shadcn/ui.",
      "dependencies": [
        "clsx",
        "tailwind-merge"
      ],
      "meta": {
        "version": "0.2.3"
      },
      "files": [
        {
          "path": "registry/flootlets/lib/utils.ts",
          "type": "registry:lib"
        }
      ]
    },
    {
      "name": "icons",
      "type": "registry:lib",
      "title": "Icons",
      "description": "The few lucide-style icons the components use.",
      "meta": {
        "version": "0.2.3"
      },
      "files": [
        {
          "path": "registry/flootlets/lib/icons.tsx",
          "type": "registry:lib"
        }
      ]
    },
    {
      "name": "classes",
      "type": "registry:lib",
      "title": "Shared classes",
      "description": "Class strings shared between components, like the close button.",
      "meta": {
        "version": "0.2.3"
      },
      "files": [
        {
          "path": "registry/flootlets/lib/classes.ts",
          "type": "registry:lib"
        }
      ]
    },
    {
      "name": "money",
      "type": "registry:lib",
      "title": "Money",
      "description": "formatMoney() for { amount, currency } money in minor units.",
      "meta": {
        "version": "0.2.3"
      },
      "files": [
        {
          "path": "registry/flootlets/lib/money.ts",
          "type": "registry:lib"
        }
      ]
    },
    {
      "name": "space",
      "type": "registry:lib",
      "title": "Spacing",
      "description": "Steps on Tailwind's spacing scale, for layout gaps.",
      "meta": {
        "version": "0.2.3"
      },
      "files": [
        {
          "path": "registry/flootlets/lib/space.ts",
          "type": "registry:lib"
        }
      ]
    },
    {
      "name": "alert",
      "type": "registry:ui",
      "title": "Alert",
      "description": "An inline message about the page or a form; errors are announced at once.",
      "dependencies": [
        "class-variance-authority"
      ],
      "registryDependencies": [
        "https://dyeoh.github.io/flootlets/r/classes.json",
        "https://dyeoh.github.io/flootlets/r/icons.json",
        "https://dyeoh.github.io/flootlets/r/theme.json",
        "https://dyeoh.github.io/flootlets/r/utils.json"
      ],
      "meta": {
        "version": "0.2.3",
        "docs": "https://dyeoh.github.io/flootlets/components/alert/"
      },
      "files": [
        {
          "path": "registry/flootlets/ui/alert.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "badge",
      "type": "registry:ui",
      "title": "Badge",
      "description": "A short label such as New, Sale or Sold out.",
      "dependencies": [
        "class-variance-authority"
      ],
      "registryDependencies": [
        "https://dyeoh.github.io/flootlets/r/theme.json",
        "https://dyeoh.github.io/flootlets/r/utils.json"
      ],
      "meta": {
        "version": "0.2.3",
        "docs": "https://dyeoh.github.io/flootlets/components/badge/"
      },
      "files": [
        {
          "path": "registry/flootlets/ui/badge.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "button",
      "type": "registry:ui",
      "title": "Button",
      "description": "Actions, and links that look like buttons, with a loading state.",
      "dependencies": [
        "class-variance-authority"
      ],
      "registryDependencies": [
        "https://dyeoh.github.io/flootlets/r/spinner.json",
        "https://dyeoh.github.io/flootlets/r/theme.json",
        "https://dyeoh.github.io/flootlets/r/utils.json"
      ],
      "meta": {
        "version": "0.2.3",
        "docs": "https://dyeoh.github.io/flootlets/components/button/"
      },
      "files": [
        {
          "path": "registry/flootlets/ui/button.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "carousel",
      "type": "registry:ui",
      "title": "Carousel",
      "description": "A scroll-snap row of items that pages left and right, with arrows and dots.",
      "registryDependencies": [
        "https://dyeoh.github.io/flootlets/r/button.json",
        "https://dyeoh.github.io/flootlets/r/icons.json",
        "https://dyeoh.github.io/flootlets/r/theme.json",
        "https://dyeoh.github.io/flootlets/r/utils.json"
      ],
      "meta": {
        "version": "0.2.3",
        "docs": "https://dyeoh.github.io/flootlets/components/carousel/"
      },
      "files": [
        {
          "path": "registry/flootlets/ui/carousel.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "checkbox",
      "type": "registry:ui",
      "title": "Checkbox",
      "description": "A labelled yes/no choice, built on Kobalte.",
      "dependencies": [
        "@kobalte/core"
      ],
      "registryDependencies": [
        "https://dyeoh.github.io/flootlets/r/field.json",
        "https://dyeoh.github.io/flootlets/r/icons.json",
        "https://dyeoh.github.io/flootlets/r/theme.json",
        "https://dyeoh.github.io/flootlets/r/utils.json"
      ],
      "meta": {
        "version": "0.2.3",
        "docs": "https://dyeoh.github.io/flootlets/components/choices/"
      },
      "files": [
        {
          "path": "registry/flootlets/ui/checkbox.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "dialog",
      "type": "registry:ui",
      "title": "Dialog",
      "description": "A modal window for confirmations and focused tasks, built on Kobalte.",
      "dependencies": [
        "@kobalte/core",
        "class-variance-authority"
      ],
      "registryDependencies": [
        "https://dyeoh.github.io/flootlets/r/button.json",
        "https://dyeoh.github.io/flootlets/r/classes.json",
        "https://dyeoh.github.io/flootlets/r/icons.json",
        "https://dyeoh.github.io/flootlets/r/theme.json",
        "https://dyeoh.github.io/flootlets/r/utils.json"
      ],
      "meta": {
        "version": "0.2.3",
        "docs": "https://dyeoh.github.io/flootlets/components/dialog/"
      },
      "files": [
        {
          "path": "registry/flootlets/ui/dialog.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "empty-state",
      "type": "registry:ui",
      "title": "EmptyState",
      "description": "What to show when there is nothing to show yet, with a way forward.",
      "registryDependencies": [
        "https://dyeoh.github.io/flootlets/r/theme.json",
        "https://dyeoh.github.io/flootlets/r/utils.json"
      ],
      "meta": {
        "version": "0.2.3",
        "docs": "https://dyeoh.github.io/flootlets/components/empty-state/"
      },
      "files": [
        {
          "path": "registry/flootlets/ui/empty-state.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "field",
      "type": "registry:ui",
      "title": "Field",
      "description": "Props and classes shared by the form components.",
      "registryDependencies": [
        "https://dyeoh.github.io/flootlets/r/theme.json",
        "https://dyeoh.github.io/flootlets/r/utils.json"
      ],
      "meta": {
        "version": "0.2.3",
        "docs": "https://dyeoh.github.io/flootlets/components/text-field/"
      },
      "files": [
        {
          "path": "registry/flootlets/ui/field.ts",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "layout",
      "type": "registry:ui",
      "title": "Stack, Cluster & Grid",
      "description": "Layout helpers with gaps on the spacing scale.",
      "dependencies": [
        "class-variance-authority"
      ],
      "registryDependencies": [
        "https://dyeoh.github.io/flootlets/r/space.json",
        "https://dyeoh.github.io/flootlets/r/theme.json",
        "https://dyeoh.github.io/flootlets/r/utils.json"
      ],
      "meta": {
        "version": "0.2.3",
        "docs": "https://dyeoh.github.io/flootlets/components/layout/"
      },
      "files": [
        {
          "path": "registry/flootlets/ui/layout.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "link",
      "type": "registry:ui",
      "title": "Link",
      "description": "An inline text link; external links open safely in a new tab.",
      "registryDependencies": [
        "https://dyeoh.github.io/flootlets/r/theme.json",
        "https://dyeoh.github.io/flootlets/r/utils.json"
      ],
      "meta": {
        "version": "0.2.3",
        "docs": "https://dyeoh.github.io/flootlets/components/link/"
      },
      "files": [
        {
          "path": "registry/flootlets/ui/link.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "pagination",
      "type": "registry:ui",
      "title": "Pagination",
      "description": "Page links or buttons, numbered or previous/next.",
      "registryDependencies": [
        "https://dyeoh.github.io/flootlets/r/button.json",
        "https://dyeoh.github.io/flootlets/r/icons.json",
        "https://dyeoh.github.io/flootlets/r/theme.json",
        "https://dyeoh.github.io/flootlets/r/utils.json"
      ],
      "meta": {
        "version": "0.2.3",
        "docs": "https://dyeoh.github.io/flootlets/components/pagination/"
      },
      "files": [
        {
          "path": "registry/flootlets/ui/pagination.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "price",
      "type": "registry:ui",
      "title": "Price",
      "description": "Money in minor units, formatted per currency, with sale prices.",
      "dependencies": [
        "class-variance-authority"
      ],
      "registryDependencies": [
        "https://dyeoh.github.io/flootlets/r/money.json",
        "https://dyeoh.github.io/flootlets/r/theme.json",
        "https://dyeoh.github.io/flootlets/r/utils.json"
      ],
      "meta": {
        "version": "0.2.3",
        "docs": "https://dyeoh.github.io/flootlets/components/price/"
      },
      "files": [
        {
          "path": "registry/flootlets/ui/price.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "product-card",
      "type": "registry:ui",
      "title": "ProductCard",
      "description": "A product in a grid or carousel, clickable as a whole.",
      "registryDependencies": [
        "https://dyeoh.github.io/flootlets/r/price.json",
        "https://dyeoh.github.io/flootlets/r/product-image.json",
        "https://dyeoh.github.io/flootlets/r/theme.json",
        "https://dyeoh.github.io/flootlets/r/utils.json"
      ],
      "meta": {
        "version": "0.2.3",
        "docs": "https://dyeoh.github.io/flootlets/components/product-card/"
      },
      "files": [
        {
          "path": "registry/flootlets/ui/product-card.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "product-image",
      "type": "registry:ui",
      "title": "ProductImage",
      "description": "A responsive product photo with a placeholder if it fails.",
      "registryDependencies": [
        "https://dyeoh.github.io/flootlets/r/theme.json",
        "https://dyeoh.github.io/flootlets/r/utils.json"
      ],
      "meta": {
        "version": "0.2.3",
        "docs": "https://dyeoh.github.io/flootlets/components/product-card/"
      },
      "files": [
        {
          "path": "registry/flootlets/ui/product-image.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "quantity-stepper",
      "type": "registry:ui",
      "title": "QuantityStepper",
      "description": "Choose how many, within the stock available, built on Kobalte.",
      "dependencies": [
        "@kobalte/core"
      ],
      "registryDependencies": [
        "https://dyeoh.github.io/flootlets/r/field.json",
        "https://dyeoh.github.io/flootlets/r/icons.json",
        "https://dyeoh.github.io/flootlets/r/theme.json",
        "https://dyeoh.github.io/flootlets/r/utils.json"
      ],
      "meta": {
        "version": "0.2.3",
        "docs": "https://dyeoh.github.io/flootlets/components/quantity-stepper/"
      },
      "files": [
        {
          "path": "registry/flootlets/ui/quantity-stepper.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "radio-group",
      "type": "registry:ui",
      "title": "RadioGroup",
      "description": "Pick one of a few visible options, built on Kobalte.",
      "dependencies": [
        "@kobalte/core"
      ],
      "registryDependencies": [
        "https://dyeoh.github.io/flootlets/r/field.json",
        "https://dyeoh.github.io/flootlets/r/theme.json",
        "https://dyeoh.github.io/flootlets/r/utils.json"
      ],
      "meta": {
        "version": "0.2.3",
        "docs": "https://dyeoh.github.io/flootlets/components/choices/"
      },
      "files": [
        {
          "path": "registry/flootlets/ui/radio-group.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "select",
      "type": "registry:ui",
      "title": "Select",
      "description": "Pick one option from a list, built on Kobalte.",
      "dependencies": [
        "@kobalte/core"
      ],
      "registryDependencies": [
        "https://dyeoh.github.io/flootlets/r/field.json",
        "https://dyeoh.github.io/flootlets/r/icons.json",
        "https://dyeoh.github.io/flootlets/r/theme.json",
        "https://dyeoh.github.io/flootlets/r/utils.json"
      ],
      "meta": {
        "version": "0.2.3",
        "docs": "https://dyeoh.github.io/flootlets/components/select/"
      },
      "files": [
        {
          "path": "registry/flootlets/ui/select.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "skeleton",
      "type": "registry:ui",
      "title": "Skeleton",
      "description": "A placeholder shape while content loads.",
      "dependencies": [
        "class-variance-authority"
      ],
      "registryDependencies": [
        "https://dyeoh.github.io/flootlets/r/theme.json",
        "https://dyeoh.github.io/flootlets/r/utils.json"
      ],
      "meta": {
        "version": "0.2.3",
        "docs": "https://dyeoh.github.io/flootlets/components/loading/"
      },
      "files": [
        {
          "path": "registry/flootlets/ui/skeleton.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "spinner",
      "type": "registry:ui",
      "title": "Spinner",
      "description": "Shows that something is loading, announced as a status.",
      "dependencies": [
        "class-variance-authority"
      ],
      "registryDependencies": [
        "https://dyeoh.github.io/flootlets/r/theme.json",
        "https://dyeoh.github.io/flootlets/r/utils.json"
      ],
      "meta": {
        "version": "0.2.3",
        "docs": "https://dyeoh.github.io/flootlets/components/loading/"
      },
      "files": [
        {
          "path": "registry/flootlets/ui/spinner.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "stock-badge",
      "type": "registry:ui",
      "title": "StockBadge",
      "description": "In stock or Sold out, from the API's in_stock field.",
      "registryDependencies": [
        "https://dyeoh.github.io/flootlets/r/badge.json",
        "https://dyeoh.github.io/flootlets/r/theme.json"
      ],
      "meta": {
        "version": "0.2.3",
        "docs": "https://dyeoh.github.io/flootlets/components/product-card/"
      },
      "files": [
        {
          "path": "registry/flootlets/ui/stock-badge.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "text-field",
      "type": "registry:ui",
      "title": "TextField & TextArea",
      "description": "Labelled text inputs with help text and errors, built on Kobalte.",
      "dependencies": [
        "@kobalte/core"
      ],
      "registryDependencies": [
        "https://dyeoh.github.io/flootlets/r/field.json",
        "https://dyeoh.github.io/flootlets/r/theme.json",
        "https://dyeoh.github.io/flootlets/r/utils.json"
      ],
      "meta": {
        "version": "0.2.3",
        "docs": "https://dyeoh.github.io/flootlets/components/text-field/"
      },
      "files": [
        {
          "path": "registry/flootlets/ui/text-field.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "toast",
      "type": "registry:ui",
      "title": "Toast",
      "description": "Short, temporary messages like Added to cart, built on Kobalte.",
      "dependencies": [
        "@kobalte/core",
        "class-variance-authority"
      ],
      "registryDependencies": [
        "https://dyeoh.github.io/flootlets/r/classes.json",
        "https://dyeoh.github.io/flootlets/r/icons.json",
        "https://dyeoh.github.io/flootlets/r/theme.json"
      ],
      "meta": {
        "version": "0.2.3",
        "docs": "https://dyeoh.github.io/flootlets/components/toast/"
      },
      "files": [
        {
          "path": "registry/flootlets/ui/toast.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "visually-hidden",
      "type": "registry:ui",
      "title": "VisuallyHidden",
      "description": "Text for screen readers only.",
      "registryDependencies": [
        "https://dyeoh.github.io/flootlets/r/theme.json",
        "https://dyeoh.github.io/flootlets/r/utils.json"
      ],
      "meta": {
        "version": "0.2.3",
        "docs": "https://dyeoh.github.io/flootlets/components/visually-hidden/"
      },
      "files": [
        {
          "path": "registry/flootlets/ui/visually-hidden.tsx",
          "type": "registry:ui"
        }
      ]
    }
  ]
}