JSPM

@theme-ui/core

0.13.1-develop.8
  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 92348
  • Score
    100M100P100Q191727F
  • License MIT

Package Exports

  • @theme-ui/core
  • @theme-ui/core/dist/theme-ui-core.cjs.js
  • @theme-ui/core/dist/theme-ui-core.esm.js
  • @theme-ui/core/jsx-dev-runtime
  • @theme-ui/core/jsx-dev-runtime/dist/theme-ui-core-jsx-dev-runtime.cjs.js
  • @theme-ui/core/jsx-dev-runtime/dist/theme-ui-core-jsx-dev-runtime.esm.js
  • @theme-ui/core/jsx-runtime
  • @theme-ui/core/jsx-runtime/dist/theme-ui-core-jsx-runtime.cjs.js
  • @theme-ui/core/jsx-runtime/dist/theme-ui-core-jsx-runtime.esm.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@theme-ui/core) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

@theme-ui/core

Minified Size on Bundlephobia

@theme-ui/core provides minimal React support for lightweight usage.

npm i @theme-ui/core @emotion/react

Usage

/** @jsxImportSource @theme-ui/core */

import { ThemeProvider } from '@theme-ui/core'

export function App() {
  return (
    <ThemeProvider theme={{ colors: { primary: '#33e' } }}>
      <h1 sx={{ color: 'primary' }}>Hello</h1>
    </ThemeProvider>
  )
}

If you already use theme-ui package, the batteries-included version of Theme UI, you don't need to install @theme-ui/core separately — it's already in your node_modules, and theme-ui reexports everything from it.

API

  • jsx — JSX function to create React elements supporting sx prop
  • ThemeProvider — a context provider
  • useThemeUI — a hook to access your theme
  • merge — an utility function to deeply merge themes together

JSX Runtime

As @theme-ui/core defines jsx function and types for it, you can use it to configure JSX runtime without installing theme-ui package.

Entry point /jsx-runtime

  • jsx
  • jsxs

Entry point /jsx-dev-runtime

  • jsxDEV