trousers

hooks-first CSS-in-JS library, focused on semantics and runtime performance

MIT License

Downloads
558
Stars
302
Committers
4
View Code on GitHub Visit Website View on X
Ecosystems: React, CSS

Bot releases are visible (Hide)

trousers - https://github.com/danieldelcore/trousers/releases/tag/[email protected] Latest Release

Published by github-actions[bot] over 4 years ago

Patch Changes

trousers - https://github.com/danieldelcore/trousers/releases/tag/@trousers/[email protected]

Published by github-actions[bot] over 4 years ago

Patch Changes

trousers - https://github.com/danieldelcore/trousers/releases/tag/@trousers/[email protected]

Published by github-actions[bot] over 4 years ago

Patch Changes

trousers - https://github.com/danieldelcore/trousers/releases/tag/@trousers/[email protected]

Published by github-actions[bot] over 4 years ago

Patch Changes

  • 16fd640: Style collector instances with differing expressions will now be mounted separately
trousers - https://github.com/danieldelcore/trousers/releases/tag/@trousers/[email protected]

Published by github-actions[bot] over 4 years ago

Patch Changes

  • 16fd640: Style collector instances with differing expressions will now be mounted separately
  • Updated dependencies [16fd640]
trousers - https://github.com/danieldelcore/trousers/releases/tag/@trousers/[email protected]

Published by github-actions[bot] over 4 years ago

Patch Changes

  • 635f6fc: Registry no longer remounts style tags on every register. Fixes an issue with prod-mode where styles registered from the same component are overridden
trousers - https://github.com/danieldelcore/trousers/releases/tag/[email protected]

Published by github-actions[bot] over 4 years ago

Patch Changes

trousers - https://github.com/danieldelcore/trousers/releases/tag/@trousers/[email protected]

Published by github-actions[bot] over 4 years ago

Patch Changes

trousers - https://github.com/danieldelcore/trousers/releases/tag/@trousers/[email protected]

Published by github-actions[bot] over 4 years ago

Patch Changes

trousers - https://github.com/danieldelcore/trousers/releases/tag/@trousers/[email protected]

Published by github-actions[bot] over 4 years ago

Patch Changes

trousers - https://github.com/danieldelcore/trousers/releases/tag/@trousers/[email protected]

Published by github-actions[bot] over 4 years ago

Patch Changes

  • c2853fb: Object styles containing mixed value types (string/number) will now be parsed correectly
trousers - https://github.com/danieldelcore/trousers/releases/tag/@trousers/[email protected]

Published by github-actions[bot] over 4 years ago

Major Changes

  • e6a3323: # Version 3 🎉

    This is Trousers' biggest update yet!

    Including:

    • Support for the CSS prop 👩‍🎤
    • Mono-repo setup and decomposition 📦
    • Object notation CSS 🍞
    • Theme CSS var package 🎨
    • insertRule 🏹
    • Smaller bundles 🐭
    • Custom style collectors 🕺
    • Trousers package with all exports for backwards compatibility

    Removed

    • withStyles HOC (please use css prop for class components)

    Developer experience

  • c9c8187: Trousers v3!

    • CSS prop 👩‍🎤
    • Mono-repo setup and decomposition 📦
    • Object notation CSS 🍞
    • Theme CSS var package 🎨
    • prod mode support for insertRule 🏹
    • Smaller bundles 🐭
    • Support for custom style collectors 🕺
    • Trousers package with all exports for backwards compatibility

    Dev

trousers - https://github.com/danieldelcore/trousers/releases/tag/@trousers/[email protected]

Published by github-actions[bot] over 4 years ago

Major Changes

  • e6a3323: # Version 3 🎉

    This is Trousers' biggest update yet!

    Including:

    • Support for the CSS prop 👩‍🎤
    • Mono-repo setup and decomposition 📦
    • Object notation CSS 🍞
    • Theme CSS var package 🎨
    • insertRule 🏹
    • Smaller bundles 🐭
    • Custom style collectors 🕺
    • Trousers package with all exports for backwards compatibility

    Removed

    • withStyles HOC (please use css prop for class components)

    Developer experience

  • c9c8187: Trousers v3!

    • CSS prop 👩‍🎤
    • Mono-repo setup and decomposition 📦
    • Object notation CSS 🍞
    • Theme CSS var package 🎨
    • prod mode support for insertRule 🏹
    • Smaller bundles 🐭
    • Support for custom style collectors 🕺
    • Trousers package with all exports for backwards compatibility

    Dev

Patch Changes

trousers - https://github.com/danieldelcore/trousers/releases/tag/@trousers/[email protected]

Published by github-actions[bot] over 4 years ago

Major Changes

  • e6a3323: # Version 3 🎉

    This is Trousers' biggest update yet!

    Including:

    • Support for the CSS prop 👩‍🎤
    • Mono-repo setup and decomposition 📦
    • Object notation CSS 🍞
    • Theme CSS var package 🎨
    • insertRule 🏹
    • Smaller bundles 🐭
    • Custom style collectors 🕺
    • Trousers package with all exports for backwards compatibility

    Removed

    • withStyles HOC (please use css prop for class components)

    Developer experience

  • c9c8187: Trousers v3!

    • CSS prop 👩‍🎤
    • Mono-repo setup and decomposition 📦
    • Object notation CSS 🍞
    • Theme CSS var package 🎨
    • prod mode support for insertRule 🏹
    • Smaller bundles 🐭
    • Support for custom style collectors 🕺
    • Trousers package with all exports for backwards compatibility

    Dev

Patch Changes

trousers - https://github.com/danieldelcore/trousers/releases/tag/@trousers/[email protected]

Published by github-actions[bot] over 4 years ago

Major Changes

  • e6a3323: # Version 3 🎉

    This is Trousers' biggest update yet!

    Including:

    • Support for the CSS prop 👩‍🎤
    • Mono-repo setup and decomposition 📦
    • Object notation CSS 🍞
    • Theme CSS var package 🎨
    • insertRule 🏹
    • Smaller bundles 🐭
    • Custom style collectors 🕺
    • Trousers package with all exports for backwards compatibility

    Removed

    • withStyles HOC (please use css prop for class components)

    Developer experience

  • c9c8187: Trousers v3!

    • CSS prop 👩‍🎤
    • Mono-repo setup and decomposition 📦
    • Object notation CSS 🍞
    • Theme CSS var package 🎨
    • prod mode support for insertRule 🏹
    • Smaller bundles 🐭
    • Support for custom style collectors 🕺
    • Trousers package with all exports for backwards compatibility

    Dev

Patch Changes

  • Updated dependencies [e6a3323]
  • Updated dependencies [c9c8187]
trousers - https://github.com/danieldelcore/trousers/releases/tag/@trousers/[email protected]

Published by github-actions[bot] over 4 years ago

Major Changes

  • e6a3323: # Version 3 🎉

    This is Trousers' biggest update yet!

    Including:

    • Support for the CSS prop 👩‍🎤
    • Mono-repo setup and decomposition 📦
    • Object notation CSS 🍞
    • Theme CSS var package 🎨
    • insertRule 🏹
    • Smaller bundles 🐭
    • Custom style collectors 🕺
    • Trousers package with all exports for backwards compatibility

    Removed

    • withStyles HOC (please use css prop for class components)

    Developer experience

  • c9c8187: Trousers v3!

    • CSS prop 👩‍🎤
    • Mono-repo setup and decomposition 📦
    • Object notation CSS 🍞
    • Theme CSS var package 🎨
    • prod mode support for insertRule 🏹
    • Smaller bundles 🐭
    • Support for custom style collectors 🕺
    • Trousers package with all exports for backwards compatibility

    Dev

Patch Changes

trousers - https://github.com/danieldelcore/trousers/releases/tag/@trousers/[email protected]

Published by github-actions[bot] over 4 years ago

Major Changes

  • e6a3323: # Version 3 🎉

    This is Trousers' biggest update yet!

    Including:

    • Support for the CSS prop 👩‍🎤
    • Mono-repo setup and decomposition 📦
    • Object notation CSS 🍞
    • Theme CSS var package 🎨
    • insertRule 🏹
    • Smaller bundles 🐭
    • Custom style collectors 🕺
    • Trousers package with all exports for backwards compatibility

    Removed

    • withStyles HOC (please use css prop for class components)

    Developer experience

  • c9c8187: Trousers v3!

    • CSS prop 👩‍🎤
    • Mono-repo setup and decomposition 📦
    • Object notation CSS 🍞
    • Theme CSS var package 🎨
    • prod mode support for insertRule 🏹
    • Smaller bundles 🐭
    • Support for custom style collectors 🕺
    • Trousers package with all exports for backwards compatibility

    Dev

trousers - https://github.com/danieldelcore/trousers/releases/tag/@trousers/[email protected]

Published by github-actions[bot] over 4 years ago

Major Changes

  • e6a3323: # Version 3 🎉

    This is Trousers' biggest update yet!

    Including:

    • Support for the CSS prop 👩‍🎤
    • Mono-repo setup and decomposition 📦
    • Object notation CSS 🍞
    • Theme CSS var package 🎨
    • insertRule 🏹
    • Smaller bundles 🐭
    • Custom style collectors 🕺
    • Trousers package with all exports for backwards compatibility

    Removed

    • withStyles HOC (please use css prop for class components)

    Developer experience

  • c9c8187: Trousers v3!

    • CSS prop 👩‍🎤
    • Mono-repo setup and decomposition 📦
    • Object notation CSS 🍞
    • Theme CSS var package 🎨
    • prod mode support for insertRule 🏹
    • Smaller bundles 🐭
    • Support for custom style collectors 🕺
    • Trousers package with all exports for backwards compatibility

    Dev

Patch Changes

  • Updated dependencies [e6a3323]
  • Updated dependencies [c9c8187]
trousers - https://github.com/danieldelcore/trousers/releases/tag/@trousers/[email protected]

Published by github-actions[bot] over 4 years ago

Major Changes

  • e6a3323: # Version 3 🎉

    This is Trousers' biggest update yet!

    Including:

    • Support for the CSS prop 👩‍🎤
    • Mono-repo setup and decomposition 📦
    • Object notation CSS 🍞
    • Theme CSS var package 🎨
    • insertRule 🏹
    • Smaller bundles 🐭
    • Custom style collectors 🕺
    • Trousers package with all exports for backwards compatibility

    Removed

    • withStyles HOC (please use css prop for class components)

    Developer experience

  • c9c8187: Trousers v3!

    • CSS prop 👩‍🎤
    • Mono-repo setup and decomposition 📦
    • Object notation CSS 🍞
    • Theme CSS var package 🎨
    • prod mode support for insertRule 🏹
    • Smaller bundles 🐭
    • Support for custom style collectors 🕺
    • Trousers package with all exports for backwards compatibility

    Dev

trousers -

Published by github-actions[bot] over 4 years ago

Version 3 🎉 [e6a3323]:

79283770-2cff2b00-7efc-11ea-96af-216d246052df

Our biggest update yet!

Including:

  • Support for the CSS prop 👩‍🎤
  • Mono-repo setup and decomposition 📦
  • Object notation CSS 🍞
  • Theme CSS var package 🎨
  • insertRule 🏹
  • Smaller bundles 🐭
  • Custom style collectors 🕺
  • Trousers package with all exports for backwards compatibility

Breaking

  • withStyles HOC (please use css prop for class components)
  • styleCollector no longer accepts props and state.

You must now wrap it in a function and pass the props manually like so:

const buttonStyles = (props: ButtonProps) => 
  styleCollector('button')
    .element`
        background-color: #b3cde8;
    `.modifier(!!props.primary)`
        background-color: #f95b5b;
    `.modifier(!!props.disabled)`
        background-color: #efefef;
    `;

Developer experience

Package Rankings
Top 7.91% on Npmjs.org
Badges
Extracted from project README
min npm Downloads per month
Related Projects
goober

🥜 goober, a less than 1KB 🎉 css-in-js alternative with a familiar API

31 Jan 2019 3,030
css-modules-theme

🚀 Theme composition for CSS Modules done simple/fast/complete

21 Aug 2018 45
stylefy

Clojure(Script) library for styling user interface components with ease.

17 May 2017 317
yoshiki

Universal react (native) CSS-in-JS library

03 Nov 2022 3
react-with-styles

Use CSS-in-JavaScript with themes for React without being tightly coupled to one implementation

23 Aug 2016 1,697
aphrodite

Framework-agnostic CSS-in-JS with support for server-side rendering, browser prefixing, and minim...

07 Oct 2015 5,341
styled

Create reusable and extensible styled elements in one line

12 Jul 2022 36
use-theme-editor

A React theme editor

04 May 2021 4
free-style

Make CSS easier and more maintainable by using JavaScript

29 Dec 2014 706
jsxstyle

Inline style system for JSX

22 Apr 2015 2,107
axs

Stupid simple style components for React

10 Nov 2016 209
ember-modern-css

Forget everything you know about CSS + Ember. If you use any of the following ember-postcss, embe...

13 Jul 2022 32
flair

a lean, component-centric style system for React components

19 Feb 2020 19
solid-styled

Reactive stylesheets for SolidJS

17 Jan 2022 177
styled-jsx

Full CSS support for JSX without compromises

05 Dec 2016 7,607