0.10.4 • Published 3 years ago

@kaze-style/build-man v0.10.4

Weekly downloads
-
License
MIT
Repository
github
Last release
3 years ago

Features

  • Build - can choose when to extract css (build time & run time)
  • TypeScript - Type-safe styles via csstype
  • Minimal - 0.3kb runtime by build time extract
  • Merge - Style merging ignoring css specificity
  • Theme - Consistent styling using "@kaze-style/themes"

Example

import { createStyle, createGlobalStyle, mergeStyle } from '@kaze-style/react';

createGlobalStyle({
  html: {
    lineHeight: '1.5',
  },
});

const classes = createStyle({
  container: {
    margin: '20px',
  },
  base: {
    color: 'red',
    background: 'black',
  },
  action: {
    color: 'blue',
  },
});

export const App = ({ action }) => {
  return (
    <div className={classes.container}>
      <p className={mergeStyle(classes.base, action && classes.action)}></p>
    </div>
  );
};

Setup Next.js(build time extract)

//next.config.mjs
import { withKazeStyle } from '@kaze-style/next-plugin';

/** @type {import('next').NextConfig} */
const nextConfig = {};

export default withKazeStyle(nextConfig);

Inspiration

KazeStyle was designed with reference to several CSS in JS libraries.

microsoft/griffel

seek-oss/vanilla-extract

argyleink/open-props

callstack/linaria

Author

Taishi Naritomi

License

MIT

0.10.2-canary.0

3 years ago

0.10.1

3 years ago

0.10.2

3 years ago

0.10.3

3 years ago

0.10.4

3 years ago

0.10.0

3 years ago

0.9.0-4

3 years ago

0.9.0-3

3 years ago

0.9.0-2

3 years ago

0.9.0-1

3 years ago

0.9.0-0

3 years ago

0.9.0

3 years ago

0.8.0

3 years ago

0.7.7

3 years ago

0.7.6

3 years ago

0.7.5

3 years ago

0.7.4

3 years ago

0.7.3

3 years ago

0.7.2

3 years ago

0.7.1

3 years ago

0.7.0

3 years ago

0.6.3

3 years ago

0.6.2

3 years ago

0.6.1

3 years ago

0.6.0

3 years ago

0.5.3

3 years ago

0.5.0

3 years ago