@droplinked_inc/ui-kit

Droplinked UI component kit. Built on Chakra UI v3 + Emotion.

This is a clean-room rebuild of the previous [email protected] written against the recovered substrate. See MIGRATION.md for the upgrade path from the old package.

Install

pnpm add @droplinked_inc/ui-kit @chakra-ui/react @emotion/react react react-dom

Use

import { UIKitProvider, defaultSystem, Button } from '@droplinked_inc/ui-kit';

export function App() {
  return (
    <UIKitProvider system={defaultSystem}>
      <Button variant="primary">Pay now</Button>
    </UIKitProvider>
  );
}

What's in v0.1

23 components covering the full surface used by droplinked-checkout:

• Primitives — Button, Input, TextArea, Checkbox, Divider
• Layout — RuledGrid, SectionTitle, CheckoutHeader
• Overlays — Modal, Toast, SuccessBar
• Data display — Chips, IconContainer, ProductCard, DetailsItem, DetailsData, ListItem
• Selection — SelectionCard, SelectionTab, Dropdown, SearchBar
• Theme — UIKitProvider, defaultSystem, createThemeSystem, defaultLightTheme, defaultRadii, defaultTypography, cornerRadiusOptions

Hardening

• URL props (href, src) pass through a strict allow-list (http, https, mailto, relative paths). javascript: / data: URLs are dropped.
• No dangerouslySetInnerHTML anywhere in the package.
• All string props render through React text nodes (no HTML interpretation).
• Form callbacks are strictly typed — no any.
• Components forward refs where appropriate and accept data-testid.

Test & lint

pnpm test            # 67 tests, jsdom
pnpm test:coverage   # ≥92% statements / ≥93% lines
pnpm typecheck
pnpm lint