New Block

Copyimport { NewBlock } from "@/components/ui/new-block";
 
<NewBlock>Content</NewBlock>

Copy# b-new-block — Block Specs
 
## Component
- name: new-block
- file: registry/mint/new-block.tsx
- installs to: components/ui/new-block.tsx
- dependencies: (none — add if needed, e.g. recharts, @tanstack/react-table)
- registryDependencies: (none — add if needed)
 
## What is it
Replace this with a description of what the block does, when to use it,
and what problem it solves. Blocks are full-page sections or major layout
compositions — distinct from elements (mid-level) and components (atomic).
 
## Visual identity
Describe the visual character of this block in this theme.
- Layout: (e.g. flex flex-col gap-6 p-6, grid, full-width)
- Surface: (e.g. transparent, --card, --background)
- Weight: (e.g. dominant, full-bleed, contained)
- Key trait: (the one thing that makes it recognisable)
 
## Design tokens
--background: oklch(1 0 0)
--foreground: oklch(0.145 0 0)
--card: oklch(1 0 0)
--card-foreground: oklch(0.145 0 0)
--primary: oklch(0.5 0.14 155)
--primary-foreground: oklch(1 0 0)
--secondary: oklch(0.95 0.04 155)
--secondary-foreground: oklch(0.32 0.1 155)
--muted: oklch(0.96 0.02 155)
--muted-foreground: oklch(0.52 0.06 155)
--accent: oklch(0.92 0.05 155)
--accent-foreground: oklch(0.32 0.1 155)
--destructive: oklch(0.55 0.25 15)
--border: oklch(0.88 0.04 155 / 60%)
--input: oklch(0.88 0.04 155 / 60%)
--ring: oklch(0.5 0.14 155)
--radius: 1.25rem
 
## shadcn config (components.json)
- style: new-york
- rsc: false  (blocks use "use client" by default)
- tsx: true
- baseColor: neutral
- cssVariables: true
- iconLibrary: lucide
- aliases:
  - components → @/components
  - ui → @/components/ui
  - utils → @/lib/utils
  - lib → @/lib
  - hooks → @/hooks
 
## Sub-components
- NewBlock → root layout wrapper; data-slot="new-block"
- (add sub-components as the block grows)
 
## States
- default:  (describe the resting appearance)
- loading:  (if applicable — skeleton or spinner pattern)
- empty:    (if the block has an empty/zero-data state)
- error:    (if the block handles fetch or validation errors)
 
## Conventions
- Use cn() from @/lib/utils for all conditional classNames
- Blocks use the b- prefix to distinguish from elements (e-) and base components
- "use client" directive required for any interactive state
- Tailwind CSS 4 utility classes only — no inline styles
- No external dependencies unless declared in registry.json
- Compose from elements (e-) and base components (shadcn/ui) — don't duplicate primitives
- data-slot attribute on the root for targeted CSS overrides