main
Last change
on this file since d565449 was d565449, checked in by stefan toskovski <stefantoska84@…>, 4 weeks ago |
Update repo after prototype presentation
|
-
Property mode
set to
100644
|
File size:
867 bytes
|
Rev | Line | |
---|
[d565449] | 1 | import { create } from 'nano-css';
|
---|
| 2 | import { addon as addonCSSOM } from 'nano-css/addon/cssom';
|
---|
| 3 | import { addon as addonVCSSOM } from 'nano-css/addon/vcssom';
|
---|
| 4 | import { cssToTree } from 'nano-css/addon/vcssom/cssToTree';
|
---|
| 5 | import { useMemo } from 'react';
|
---|
| 6 | import useIsomorphicLayoutEffect from './useIsomorphicLayoutEffect';
|
---|
| 7 | var nano = create();
|
---|
| 8 | addonCSSOM(nano);
|
---|
| 9 | addonVCSSOM(nano);
|
---|
| 10 | var counter = 0;
|
---|
| 11 | var useCss = function (css) {
|
---|
| 12 | var className = useMemo(function () { return 'react-use-css-' + (counter++).toString(36); }, []);
|
---|
| 13 | var sheet = useMemo(function () { return new nano.VSheet(); }, []);
|
---|
| 14 | useIsomorphicLayoutEffect(function () {
|
---|
| 15 | var tree = {};
|
---|
| 16 | cssToTree(tree, css, '.' + className, '');
|
---|
| 17 | sheet.diff(tree);
|
---|
| 18 | return function () {
|
---|
| 19 | sheet.diff({});
|
---|
| 20 | };
|
---|
| 21 | });
|
---|
| 22 | return className;
|
---|
| 23 | };
|
---|
| 24 | export default useCss;
|
---|
Note:
See
TracBrowser
for help on using the repository browser.