PkgFoundry
Catalog npm
Back to packageRELEASE DETAILS

1.0.32

npm

@-ui/styles

Yet another CSS-in-JS library based on Facebook's internal styling library as seen at React Conf 2019

csscss-in-jsreactssrstylesstylesheetstylesheetssveltethemesthemingvue
Published14 Nov 2019
Direct dependencies24
Transitive dependenciesNot calculated

README

Current package documentation

@-ui/styles

Bundlephobia Types Code coverage Build status NPM Version MIT License 

npm i @-ui/styles

Quick Start

// React example
import React from 'react'
import styles from '@-ui/styles'

styles.variables({
  colors: {
    red: '#c12',
    blue: '#09a',
    purple: '#800080',
  },
})

const style = styles({
  red: `
    color: var(--colors-red);
  `,
  blue: ({colors}) => `
    color: ${colors.blue};

    .${style('red')} {
      color: ${colors.purple};
    }
  `,
})

const Component = (props) => (
  <div className={style({blue: props.blue, red: props.red})}>
    Hello world
    <span className={style(props.blue && 'blue', props.red && 'red')}>
      Hello world
    </span>
    <span className={style('blue')}>I'm always blue</span>
    <span className={style('red')}>I'm purple when my parent is blue</span>
  </div>
)

API

Coming soon. Until then play with this React example on CodeSandbox

LICENSE

MIT

Downloads & popularity

Awaiting observations

No metric observations yet

Download counts and popularity will appear here as the collector receives them.

Declared dependencies 24

Native requirements
24 direct targetsNot calculated transitive count
Package / targetRequirementRelationship
@emotion/stylis
Environment
{
  "local_name": "@emotion/stylis",
  "alias": false,
  "peer_metadata": null
}
^0.8.4runtime
@emotion/unitless
Environment
{
  "local_name": "@emotion/unitless",
  "alias": false,
  "peer_metadata": null
}
^0.7.4runtime
trie-memoize
Environment
{
  "local_name": "trie-memoize",
  "alias": false,
  "peer_metadata": null
}
^1.0.15runtime
@-ui/styles
Environment
{
  "local_name": "@-ui/styles",
  "alias": false,
  "peer_metadata": null
}
^1.0.14development
@babel/node
Environment
{
  "local_name": "@babel/node",
  "alias": false,
  "peer_metadata": null
}
^7.7.0development
@essentials/benchmark
Environment
{
  "local_name": "@essentials/benchmark",
  "alias": false,
  "peer_metadata": null
}
^1.0.5development
@lunde/babel-preset-es
Environment
{
  "local_name": "@lunde/babel-preset-es",
  "alias": false,
  "peer_metadata": null
}
latestdevelopment
babel-eslint
Environment
{
  "local_name": "babel-eslint",
  "alias": false,
  "peer_metadata": null
}
latestdevelopment
crc
Environment
{
  "local_name": "crc",
  "alias": false,
  "peer_metadata": null
}
^3.8.0development
cross-env
Environment
{
  "local_name": "cross-env",
  "alias": false,
  "peer_metadata": null
}
latestdevelopment
eslint
Environment
{
  "local_name": "eslint",
  "alias": false,
  "peer_metadata": null
}
latestdevelopment
eslint-import-resolver-jest
Environment
{
  "local_name": "eslint-import-resolver-jest",
  "alias": false,
  "peer_metadata": null
}
latestdevelopment
eslint-plugin-jest
Environment
{
  "local_name": "eslint-plugin-jest",
  "alias": false,
  "peer_metadata": null
}
latestdevelopment
husky
Environment
{
  "local_name": "husky",
  "alias": false,
  "peer_metadata": null
}
latestdevelopment
jest
Environment
{
  "local_name": "jest",
  "alias": false,
  "peer_metadata": null
}
latestdevelopment
lint-staged
Environment
{
  "local_name": "lint-staged",
  "alias": false,
  "peer_metadata": null
}
latestdevelopment
prettier
Environment
{
  "local_name": "prettier",
  "alias": false,
  "peer_metadata": null
}
latestdevelopment
rimraf
Environment
{
  "local_name": "rimraf",
  "alias": false,
  "peer_metadata": null
}
^2.6.3development
rollup
Environment
{
  "local_name": "rollup",
  "alias": false,
  "peer_metadata": null
}
^1.26.3development
rollup-plugin-babel
Environment
{
  "local_name": "rollup-plugin-babel",
  "alias": false,
  "peer_metadata": null
}
^4.3.3development
rollup-plugin-commonjs
Environment
{
  "local_name": "rollup-plugin-commonjs",
  "alias": false,
  "peer_metadata": null
}
^10.1.0development
rollup-plugin-node-resolve
Environment
{
  "local_name": "rollup-plugin-node-resolve",
  "alias": false,
  "peer_metadata": null
}
^5.2.0development
rollup-plugin-replace
Environment
{
  "local_name": "rollup-plugin-replace",
  "alias": false,
  "peer_metadata": null
}
^2.2.0development
rollup-plugin-terser
Environment
{
  "local_name": "rollup-plugin-terser",
  "alias": false,
  "peer_metadata": null
}
^5.1.2development

Distribution files

1 collected
Distribution 1

Source distribution

Source file
Checksums from source
{
  "shasum": "19e345b2605d7b98621ad3edd6c2f5252e6ec33d",
  "integrity": "sha512-G2v7E0mySFDfn6DPz5zPCnLl2bLV+Pq0y0wazar/jOERvZbs084GGTYpDU54WOlMC+gAyeaQhJQU/aKgfnanLw==",
  "tarball": "https://registry.npmjs.org/@-ui/styles/-/styles-1.0.32.tgz",
  "fileCount": 14,
  "unpackedSize": 107142,
  "npm-signature": "-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdzOpFCRA9TVsSAnZWagAAUVgP/1G/7NKrP7EB6mQaTzVI\nJVh1kByXKEVxnoDTRzuS9cBMmLckOPxQxiRRHFDaNF/Te1icd7oschZP5h0B\nMUMOjbHpX1zwLafeugVDgS/ZBVghaEkupfDba6b52TpD6wO5f2jNJ8DTg/vv\nbVJb2++uD+TB0o7GYCz8tR57ElB/HlG+wu1wSrtWDKHdVGCy2wykHcLQGKgB\nFTagDlsi18zNMaxwFLOaQubjgHRbhvla3yVuLwobXsfzY5UY5zSo7Ty/VA/u\nDV4d+FpjJ71TTyaRFZtSSUCNx+zSFhZ+u1w6j2eFfHt4OhYutW2RpVCDoaJb\n8rY2SAoRXXnXL22HvE8vyG4JSgJhTs1Ew1rmytnx6SktKWNqCpGWy44nxqEV\nWG5fUzGfeP1hqOorxtGvz5n5SwFxJmFiq5weYDJgMjSdkgnIvi9JWwiE/16R\nKsS7Jj6zS9abDD7N8miH8Ls9g5cdVTbQvN7scCLXGh+qEVj8j0kdEOifMvA3\negfKASre9jpkE9CGFU+EZMaZDFn09oa5vHsagz6+FbfOnxkJy9rBnWBq2yrz\n7kuTcQLjb99LSicLKXrnu1jHrCrRpeMfoSgNKdoWOjh8WBPl/GFQYGkE3fvj\nFvv+fCbSutQpaPV6yoL7NtON4ow4ZNhBPzUkXFJFK4WSE0jAEUFDzxza6Gv2\nmIAH\r\n=0OgW\r\n-----END PGP SIGNATURE-----\r\n",
  "signatures": [
    {
      "keyid": "SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA",
      "sig": "MEUCICK3SxhD8yS7TiT/nHvn0VD+2hs2cRHcTXuaYlQkigAsAiEAxqb7peHYUPvWCIv1vdFrwmX37UsRSZxKGnUJKgS0aXA="
    }
  ]
}

Repository

PENDING
dash-ui/styles

Shared repository data · GitHub

License detected in repository
Not collected

Metadata history

Meaningful changes
Current collected state Current

Observed since 20 Oct, 21:49 UTC

No superseded metadata states collected. Unchanged observations do not create new revisions.

Record identity

package_version:e1859f2ee5bef52b6e392ff2ecb804d08e887cca4e0a9898f55b189b2f9e2eba

Other collected versions

1.2.42 May1.2.321 Apr1.2.221 Apr1.2.121 Apr1.2.021 Apr1.1.621 AprView all collected versions →