Must Know

A handful of things every consumer should know before reaching for a primitive.

Subpath imports for tree-shaking

// ✅ tree-shakes
import { Button } from '@yashiel/mihcm-ui/Button';
 
// ❌ pulls the whole package
import { Button } from '@yashiel/mihcm-ui';

Same prop API on web AND native

// Same import. Bundlers pick the right variant via the `react-native` export.
import { Button } from '@yashiel/mihcm-ui/Button';

The web variant uses Radix primitives + Tailwind 4. The native variant uses @rn-primitives/* + NativeWind v4. The Button component looks and behaves the same way in both.

Theming

Wrap your app in <ThemeProvider scheme="light" | "dark">. CSS variables flip via the .dark class on <html> (web) or the JS theme object (native).

AI-UI

@yashiel/mihcm-ai-ui ships Zod-typed component descriptors and a safe renderer. AI chat can return JSON describing a UI; the renderer validates the schema, checks the component name against an allowlist, caps recursion depth, and renders via the primitives. See AI-UI for the full security model.

Accessibility is a release blocker

Every primitive must satisfy WCAG 2.1 AA. Not aspirationally — by policy. Color-only signaling is forbidden. 4.5:1 contrast minimum on text. Touch targets 44px+ on the lg size.

Versioning

Changesets drives semver per-package. Breaking changes require a major + a deprecation in the prior minor. See the Changelog.