You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

79 lines
1.8 KiB

4 years ago
  1. [![Build Status](https://travis-ci.org/css-modules/icss-utils.svg)](https://travis-ci.org/css-modules/icss-utils)
  2. # ICSS Utils
  3. ## replaceSymbols
  4. Governs the way tokens are searched & replaced during the linking stage of ICSS loading.
  5. This is broken into its own module in case the behaviour needs to be replicated in other PostCSS plugins
  6. (i.e. [CSS Modules Values](https://github.com/css-modules/postcss-modules-values))
  7. ```js
  8. import { replaceSymbols, replaceValueSymbols } from "icss-utils"
  9. replaceSymbols(css, replacements)
  10. replaceValueSymbols(string, replacements)
  11. ```
  12. Where:
  13. - `css` is the PostCSS tree you're working with
  14. - `replacements` is an JS object of `symbol: "replacement"` pairs, where all occurrences of `symbol` are replaced with `replacement`.
  15. A symbol is a string of alphanumeric, `-` or `_` characters. A replacement can be any string. They are replaced in the following places:
  16. - In the value of a declaration, i.e. `color: my_symbol;` or `box-shadow: 0 0 blur spread shadow-color`
  17. - In a media expression i.e. `@media small {}` or `@media screen and not-large {}`
  18. ## extractICSS(css, removeRules = true)
  19. Extracts and remove (if removeRules is equal true) from PostCSS tree `:import` and `:export` statements.
  20. ```js
  21. import postcss from 'postcss';
  22. import { extractICSS } from 'icss-utils'
  23. const css = postcss.parse(`
  24. :import(colors) {
  25. a: b;
  26. }
  27. :export {
  28. c: d;
  29. }
  30. `)
  31. extractICSS(css)
  32. /*
  33. {
  34. icssImports: {
  35. colors: {
  36. a: 'b'
  37. }
  38. },
  39. icssExports: {
  40. c: 'd'
  41. }
  42. }
  43. */
  44. ```
  45. ## createICSSRules(icssImports, icssExports)
  46. Converts icss imports and exports definitions to postcss ast
  47. ```js
  48. createICSSRules({
  49. colors: {
  50. a: 'b'
  51. }
  52. }, {
  53. c: 'd'
  54. })
  55. ```
  56. ## License
  57. ISC
  58. ---
  59. Glen Maddern and Bogdan Chadkin, 2015.