-
Notifications
You must be signed in to change notification settings - Fork 0
/
Snippet.tsx
34 lines (27 loc) · 1.05 KB
/
Snippet.tsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
import React, { FunctionComponent, useEffect } from "react";
import { create, Plugin } from "jss";
import { StylesProvider, jssPreset } from "@material-ui/core/styles";
import { ISnippetStateProps, ISnippetDispatchProps } from "./SnippetConnector";
import ISnippetProps from "./ISnippetProps";
type SnippetType = FunctionComponent<ISnippetProps & ISnippetStateProps & ISnippetDispatchProps>;
const Snippet: SnippetType = ({ repeat, selector, children, featureState, sendSnippetLoaded }) => {
useEffect(() => {
sendSnippetLoaded(featureState);
}, []);
const prefix = Array(repeat + 1).join(selector);
const increaseRuleSpecificity: Plugin = {
onProcessRule: (rule: any): any => {
const parent = rule.options.parent;
if (rule.type !== "style" || (parent && parent.type === "keyframes")) {
return;
}
rule.selectorText = prefix + rule.selectorText;
},
};
return (
<StylesProvider jss={create(jssPreset()).use(increaseRuleSpecificity)}>
{children}
</StylesProvider>
);
};
export default Snippet;