Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
function createGlobal () {
// Skip DOM lookup.
if (!canUseDOM) return FreeStyle.create()
let element = document.getElementById(STYLE_ID) as HTMLStyleElement
let styleSheet: CSSStyleSheet
if (!element) {
element = document.createElement('style')
element.setAttribute('id', STYLE_ID)
element.setAttribute('type', 'text/css')
document.head.appendChild(element)
}
for (let i = 0; i < document.styleSheets.length; i++) {
const item = document.styleSheets.item(i)!
if (item.ownerNode === element) {
styleSheet = item as CSSStyleSheet
const createFreeStyle = () => FreeStyle.create(
/** Use the default hash function */
undefined,
/** Preserve $debugName values */
true,
);
export function css(cssValue: CssValue): CachedCss {
const Style = create();
const className = cssValueToString(Style, cssValue);
return new CachedCss(className, Style);
}
element = document.createElement('style')
element.setAttribute('id', STYLE_ID)
element.setAttribute('type', 'text/css')
document.head.appendChild(element)
}
for (let i = 0; i < document.styleSheets.length; i++) {
const item = document.styleSheets.item(i)!
if (item.ownerNode === element) {
styleSheet = item as CSSStyleSheet
break
}
}
return FreeStyle.create(undefined, undefined, {
add (style, index) {
styleSheet.insertRule(style.getStyles(), index)
},
remove (style, index) {
styleSheet.deleteRule(index)
},
change (style, oldIndex, newIndex) {
styleSheet.deleteRule(oldIndex)
styleSheet.insertRule(style.getStyles(), newIndex)
}
})
}
return <p> (
Component: React.ComponentType</p><p>>,
withFreeStyle?: boolean
) => {
const Style = FreeStyle.create(hash, debug)
const componentName = Component.displayName || Component.name || 'anonymous'
const styles = helpers.registerStyleSheet(Style, sheet, options, componentName)
const displayName = `Styled(${componentName})`
return Object.assign(
((props: P & StyledProps) => {
const componentProps = Object.assign({}, props, {
styles: props.styles ? Object.assign({}, styles, props.styles) : styles
})
return React.createElement(
StyleComponent,
{ Style, Component, componentName, componentProps, withFreeStyle }
)
}) as React.StatelessComponent</p><p>,
{ displayName, styles, Style }</p>
import freestyle from 'free-style';
import autoprefixer from 'autoprefixer';
import postcss from 'postcss-js';
const context = freestyle.create();
const prefixer = postcss.sync([ autoprefixer({ browsers: ['last 2 versions'] }) ]);
export function configureStyles(styles) {
return styles
? context.registerStyle(prefixer(styles))
: context.getStyles();
};
element.setAttribute("id", STYLE_ID);
element.setAttribute("type", "text/css");
document.head.appendChild(element);
}
for (let i = 0; i < document.styleSheets.length; i++) {
const item = document.styleSheets.item(i)!;
if (item.ownerNode === element) {
styleSheet = item as CSSStyleSheet;
break;
}
}
if (debug) {
this.freeStyle = create({
add: () => (element.innerHTML = this.toCss()),
remove: () => (element.innerHTML = this.toCss()),
change: () => (element.innerHTML = this.toCss())
});
} else {
this.freeStyle = create({
add: (style, index) => {
styleSheet.insertRule(style.getStyles(), index);
},
remove: (_, index) => {
styleSheet.deleteRule(index);
},
change: (style, oldIndex, newIndex) => {
styleSheet.deleteRule(oldIndex);
styleSheet.insertRule(style.getStyles(), newIndex);
}
return function styleFn () {
var args = Array.prototype.slice.call(arguments)
var opts = args.length > arity ? args.pop() : null
var styleId = opts && opts.styleId ? opts.styleId : DEFAULT_STYLE_ID
var byId = styleInstancesById[styleId] = styleInstancesById[styleId] || {
Style: FreeStyle.create(),
changeId: null
}
var Style = byId.Style
var changeId = byId.changeId
var result = Style[methodName].apply(Style, args)
if (Style.changeId !== changeId) {
insertStyles(Style.getStyles(), {id: styleId})
byId.changeId = Style.changeId
}
return result
}
}