PkgFoundry
Catalog npm
Back to packageRELEASE DETAILS

1.0.49

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
Published23 Nov 2019
Direct dependencies28
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 28

Native requirements
28 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
@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
@rollup/plugin-replace
Environment
{
  "local_name": "@rollup/plugin-replace",
  "alias": false,
  "peer_metadata": null
}
^2.2.1development
@types/crc
Environment
{
  "local_name": "@types/crc",
  "alias": false,
  "peer_metadata": null
}
^3.4.0development
@types/jest
Environment
{
  "local_name": "@types/jest",
  "alias": false,
  "peer_metadata": null
}
^24.0.23development
@typescript-eslint/eslint-plugin
Environment
{
  "local_name": "@typescript-eslint/eslint-plugin",
  "alias": false,
  "peer_metadata": null
}
latestdevelopment
@typescript-eslint/parser
Environment
{
  "local_name": "@typescript-eslint/parser",
  "alias": false,
  "peer_metadata": null
}
latestdevelopment
babel-plugin-search-and-replace
Environment
{
  "local_name": "babel-plugin-search-and-replace",
  "alias": false,
  "peer_metadata": null
}
^1.0.1development
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.27.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-terser
Environment
{
  "local_name": "rollup-plugin-terser",
  "alias": false,
  "peer_metadata": null
}
^5.1.2development
typescript
Environment
{
  "local_name": "typescript",
  "alias": false,
  "peer_metadata": null
}
latestdevelopment

Distribution files

1 collected
Distribution 1

Source distribution

Source file
Checksums from source
{
  "shasum": "e45872a8965bfba13491e0cf70eaecaa2383979d",
  "integrity": "sha512-ZY5fFAd/PLimgBajkoUiJh8OHi2tfLg4QIk/uZcN+jCTK3Y0+wMNCCC42CcKcEtAvOsOnOEqHUqkvUUgv5arLw==",
  "tarball": "https://registry.npmjs.org/@-ui/styles/-/styles-1.0.49.tgz",
  "fileCount": 17,
  "unpackedSize": 118479,
  "npm-signature": "-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd2JEVCRA9TVsSAnZWagAA8MsP/0OtLxdefLILphUTbo8L\n8c96wLPRAxOOuNrpQfC4l6dPkzVSozgDmvzdVBShDOzrYMgr7f2+jdgE9rmT\npzlvmEysMEQJFlT/MH5s/c1ZbFJAdaeelIFhAnjSJ4c+eP+sx5haAGLMBc9x\n0D8KCCSmu/1dDu3e+iSejlO/O5qKSGnT65BbcYVWd6sarz7/QH8vv+bSVVM7\n5ouIVBeK+vlozihY1x3reQ4Lln8tlriIZRDFYLIPDm9wkDDDlZHZPnvPq6qQ\ndAQ0pe8xnSe+muWBv6VBV22PGUjh8qfGk7vHIl7ZVcdZFkavGRYHTqtemxby\nB3JWM7BueDlxykCrU8V4uRkJmrF+psiyOuZsCCzWEsb3dHj+8R3jA+EcBG58\n8oguCSajbcr4R9RjO68HPFHvhp7gaIVVYyRAluSbD+ckVlE2XW6TVhLrIEmo\nMHFPLM4Gx2pBhy7Gy0peurZOQMq1qk4WkCA+Ccj/sdwpQEkR4vQoeOqbDefW\nBoXnxdm2yeIKWQ92hMevmYzvpUExzUt8m3RXps6GRFuj1MHEaVQHCfypzKYF\n2fux4BRyOJ1n0EH/btdlNGdIjIxes5hhzmNTaR71AI809wbjiXzTy07OoTAe\nSgf/Ss0+71ucDy0TON6uOY5z2vS5an2zfe5dRYxzuvRI9rPY0J0yDkyqQJUN\nCAoJ\r\n=SKlX\r\n-----END PGP SIGNATURE-----\r\n",
  "signatures": [
    {
      "keyid": "SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA",
      "sig": "MEUCIGIPa8Ncs1N6/l+msJ+yE0z0AzwCvvxMJxvdC42UMWWpAiEAoXGcrxgWSP/yS34h/cynkji/azcpEXGRxWhcOmSrm/0="
    }
  ]
}

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:b95dd0f941418e54430430e6fd293f52612cb73cca912e6cf6b7bef10fb2f2d8

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 →