Socket
Socket
Sign inDemoInstall

fela-dom

Package Overview
Dependencies
Maintainers
1
Versions
104
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

fela-dom - npm Package Compare versions

Comparing version 6.0.2 to 6.0.3

es/dom/rehydration/rehydrate.js
es/server/createStyleTagMarkup.js
es/server/getRehydrationIndex.js
lib/dom/rehydration/rehydrate.js
lib/server/createStyleTagMarkup.js
lib/server/getRehydrationIndex.js

47

es/dom/rehydration/rehydrateCache.js

@@ -1,27 +0,7 @@

var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _slicedToArray = function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"]) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } }; }();
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
import camelCaseProperty from 'css-in-js-utils/lib/camelCaseProperty';
import { arrayEach, generateCSSSelector, RULE_TYPE } from 'fela-utils';
import rehydrateSupportRules from './rehydrateSupportRules';
import rehydrateRules from './rehydrateRules';
var rehydrationHandlers = _defineProperty({}, RULE_TYPE, function (renderer, css, media) {
// try to read the uniqueRuleIdentifier
if (media.length === 0 && css.indexOf('#*/') !== -1) {
var _css$split = css.split('#*/'),
_css$split2 = _slicedToArray(_css$split, 2),
left = _css$split2[0],
right = _css$split2[1];
export default function rehydrateCache(css) {
var media = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
renderer.uniqueRuleIdentifier = parseInt(left.split('::')[1]);
// it's ok to mutate
css = right;
}
var _rehydrateSupportRule = rehydrateSupportRules(css, media),

@@ -31,23 +11,4 @@ ruleCss = _rehydrateSupportRule.ruleCss,

rehydrateRules(renderer.cache, ruleCss, media);
renderer.cache = _extends({}, renderer.cache, supportCache);
});
// rehydration (WIP)
// TODO: static, keyframe, font
export default function rehydrateCache(renderer) {
if (renderer.enableRehydration) {
arrayEach(document.querySelectorAll('[data-fela-type]'), function (node) {
var type = node.getAttribute('data-fela-type') || '';
var media = node.getAttribute('media') || '';
var css = node.textContent;
var handler = rehydrationHandlers[type];
if (handler) {
handler(renderer, css, media);
}
});
}
rehydrateRules(supportCache, ruleCss, media);
return supportCache;
}

16

es/dom/rehydration/rehydrateRules.js

@@ -6,4 +6,3 @@ var _slicedToArray = function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"]) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } }; }();

var DECL_REGEX = /.([^:{]+)(:[^{]+)?{([^}]+)}/g;
var PROPERTY_VALUE_REGEX = /:(.+)/;
var DECL_REGEX = /[.]([0-9a-z_-]+)([^{]+)?{([^:]+):([^}]+)}/gi;

@@ -22,3 +21,3 @@ export default function rehydrateRules(cache, css) {

var _decl = decl,
_decl2 = _slicedToArray(_decl, 4),
_decl2 = _slicedToArray(_decl, 5),
ruleSet = _decl2[0],

@@ -28,11 +27,6 @@ className = _decl2[1],

pseudo = _decl2$ === undefined ? '' : _decl2$,
declaration = _decl2[3];
property = _decl2[3],
value = _decl2[4];
/* eslint-enable */
var _declaration$split = declaration.split(PROPERTY_VALUE_REGEX),
_declaration$split2 = _slicedToArray(_declaration$split, 2),
property = _declaration$split2[0],
value = _declaration$split2[1];
var declarationReference = support + media + pseudo + camelCaseProperty(property) + value;

@@ -43,3 +37,3 @@ cache[declarationReference] = {

selector: generateCSSSelector(className, pseudo),
declaration: declaration,
declaration: property + ':' + value,
media: media,

@@ -46,0 +40,0 @@ support: support

9

es/dom/render.js

@@ -5,9 +5,8 @@ import createDOMSubscription from './createDOMSubscription';

export default function render(renderer) {
if (!renderer.isConnectedToDOM) {
renderer.isConnectedToDOM = true;
if (!renderer.updateSubscription) {
connectDOMNodes(renderer);
renderer.updateSubscription = createDOMSubscription(renderer.nodes);
renderer.subscribe(renderer.updateSubscription);
}
var updateSubscription = createDOMSubscription(renderer.nodes);
renderer.subscribe(updateSubscription);
}

17

es/index.js
import render from './dom/render';
import rehydrateCache from './dom/rehydration/rehydrateCache';
import rehydrate from './dom/rehydration/rehydrate';
import renderToMarkup from './server/renderToMarkup';
import renderToSheetList from './server/renderToSheetList';
export { render, rehydrateCache, renderToMarkup, renderToSheetList };
var didWarn = false;
function rehydrateCache() {
if (!didWarn) {
didWarn = true;
console.warn('[fela-dom] `rehydrateCache` has been renamed to simply `rehydrate`.\n' + 'Import `rehydrate` directly as it will be removed in version 7.0.0.');
}
return rehydrate.apply(undefined, arguments);
}
export { render, rehydrateCache, rehydrate, renderToMarkup, renderToSheetList };

13

es/server/renderToMarkup.js

@@ -1,3 +0,6 @@

import { createStyleTagMarkup, objectReduce, clusterCache, RULE_TYPE, KEYFRAME_TYPE, FONT_TYPE, STATIC_TYPE } from 'fela-utils';
import { objectReduce, clusterCache, RULE_TYPE, KEYFRAME_TYPE, FONT_TYPE, STATIC_TYPE } from 'fela-utils';
import createStyleTagMarkup from './createStyleTagMarkup';
import getRehydrationIndex from './getRehydrationIndex';
var sheetMap = {

@@ -11,7 +14,9 @@ fontFaces: FONT_TYPE,

export default function renderToMarkup(renderer) {
var cacheCluster = clusterCache(renderer.cache, renderer.mediaQueryOrder, renderer.uniqueRuleIdentifier);
var cacheCluster = clusterCache(renderer.cache, renderer.mediaQueryOrder);
var rehydrationIndex = getRehydrationIndex(renderer);
var basicMarkup = objectReduce(sheetMap, function (markup, type, key) {
if (cacheCluster[key].length > 0) {
markup += createStyleTagMarkup(cacheCluster[key], type);
markup += createStyleTagMarkup(cacheCluster[key], type, '', rehydrationIndex);
}

@@ -24,3 +29,3 @@

if (css.length > 0) {
markup += createStyleTagMarkup(css, RULE_TYPE, media);
markup += createStyleTagMarkup(css, RULE_TYPE, media, rehydrationIndex);
}

@@ -27,0 +32,0 @@

8

es/server/renderToSheetList.js
import { clusterCache, objectReduce, RULE_TYPE, KEYFRAME_TYPE, FONT_TYPE, STATIC_TYPE } from 'fela-utils';
import getRehydrationIndex from './getRehydrationIndex';
var sheetMap = {

@@ -11,4 +13,6 @@ fontFaces: FONT_TYPE,

export default function renderToSheetList(renderer) {
var cacheCluster = clusterCache(renderer.cache, renderer.mediaQueryOrder, renderer.uniqueRuleIdentifier);
var cacheCluster = clusterCache(renderer.cache, renderer.mediaQueryOrder);
var rehydrationIndex = getRehydrationIndex(renderer);
var sheetList = objectReduce(sheetMap, function (list, type, key) {

@@ -18,2 +22,3 @@ if (cacheCluster[key].length > 0) {

css: cacheCluster[key],
rehydration: rehydrationIndex,
type: type

@@ -31,2 +36,3 @@ });

type: RULE_TYPE,
rehydration: rehydrationIndex,
media: media

@@ -33,0 +39,0 @@ });

51

lib/dom/rehydration/rehydrateCache.js

@@ -6,15 +6,4 @@ 'use strict';

});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _slicedToArray = function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"]) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } }; }();
exports.default = rehydrateCache;
var _camelCaseProperty = require('css-in-js-utils/lib/camelCaseProperty');
var _camelCaseProperty2 = _interopRequireDefault(_camelCaseProperty);
var _felaUtils = require('fela-utils');
var _rehydrateSupportRules = require('./rehydrateSupportRules');

@@ -30,18 +19,5 @@

function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function rehydrateCache(css) {
var media = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
var rehydrationHandlers = _defineProperty({}, _felaUtils.RULE_TYPE, function (renderer, css, media) {
// try to read the uniqueRuleIdentifier
if (media.length === 0 && css.indexOf('#*/') !== -1) {
var _css$split = css.split('#*/'),
_css$split2 = _slicedToArray(_css$split, 2),
left = _css$split2[0],
right = _css$split2[1];
renderer.uniqueRuleIdentifier = parseInt(left.split('::')[1]);
// it's ok to mutate
css = right;
}
var _rehydrateSupportRule = (0, _rehydrateSupportRules2.default)(css, media),

@@ -51,23 +27,4 @@ ruleCss = _rehydrateSupportRule.ruleCss,

(0, _rehydrateRules2.default)(renderer.cache, ruleCss, media);
renderer.cache = _extends({}, renderer.cache, supportCache);
});
// rehydration (WIP)
// TODO: static, keyframe, font
function rehydrateCache(renderer) {
if (renderer.enableRehydration) {
(0, _felaUtils.arrayEach)(document.querySelectorAll('[data-fela-type]'), function (node) {
var type = node.getAttribute('data-fela-type') || '';
var media = node.getAttribute('media') || '';
var css = node.textContent;
var handler = rehydrationHandlers[type];
if (handler) {
handler(renderer, css, media);
}
});
}
(0, _rehydrateRules2.default)(supportCache, ruleCss, media);
return supportCache;
}

16

lib/dom/rehydration/rehydrateRules.js

@@ -19,4 +19,3 @@ 'use strict';

var DECL_REGEX = /.([^:{]+)(:[^{]+)?{([^}]+)}/g;
var PROPERTY_VALUE_REGEX = /:(.+)/;
var DECL_REGEX = /[.]([0-9a-z_-]+)([^{]+)?{([^:]+):([^}]+)}/gi;

@@ -35,3 +34,3 @@ function rehydrateRules(cache, css) {

var _decl = decl,
_decl2 = _slicedToArray(_decl, 4),
_decl2 = _slicedToArray(_decl, 5),
ruleSet = _decl2[0],

@@ -41,11 +40,6 @@ className = _decl2[1],

pseudo = _decl2$ === undefined ? '' : _decl2$,
declaration = _decl2[3];
property = _decl2[3],
value = _decl2[4];
/* eslint-enable */
var _declaration$split = declaration.split(PROPERTY_VALUE_REGEX),
_declaration$split2 = _slicedToArray(_declaration$split, 2),
property = _declaration$split2[0],
value = _declaration$split2[1];
var declarationReference = support + media + pseudo + (0, _camelCaseProperty2.default)(property) + value;

@@ -56,3 +50,3 @@ cache[declarationReference] = {

selector: (0, _felaUtils.generateCSSSelector)(className, pseudo),
declaration: declaration,
declaration: property + ':' + value,
media: media,

@@ -59,0 +53,0 @@ support: support

9

lib/dom/render.js

@@ -19,9 +19,8 @@ 'use strict';

function render(renderer) {
if (!renderer.isConnectedToDOM) {
renderer.isConnectedToDOM = true;
if (!renderer.updateSubscription) {
(0, _connectDOMNodes2.default)(renderer);
renderer.updateSubscription = (0, _createDOMSubscription2.default)(renderer.nodes);
renderer.subscribe(renderer.updateSubscription);
}
var updateSubscription = (0, _createDOMSubscription2.default)(renderer.nodes);
renderer.subscribe(updateSubscription);
}

21

lib/index.js

@@ -6,3 +6,3 @@ 'use strict';

});
exports.renderToSheetList = exports.renderToMarkup = exports.rehydrateCache = exports.render = undefined;
exports.renderToSheetList = exports.renderToMarkup = exports.rehydrate = exports.rehydrateCache = exports.render = undefined;

@@ -13,5 +13,5 @@ var _render = require('./dom/render');

var _rehydrateCache = require('./dom/rehydration/rehydrateCache');
var _rehydrate = require('./dom/rehydration/rehydrate');
var _rehydrateCache2 = _interopRequireDefault(_rehydrateCache);
var _rehydrate2 = _interopRequireDefault(_rehydrate);

@@ -28,5 +28,18 @@ var _renderToMarkup = require('./server/renderToMarkup');

var didWarn = false;
function rehydrateCache() {
if (!didWarn) {
didWarn = true;
console.warn('[fela-dom] `rehydrateCache` has been renamed to simply `rehydrate`.\n' + 'Import `rehydrate` directly as it will be removed in version 7.0.0.');
}
return _rehydrate2.default.apply(undefined, arguments);
}
exports.render = _render2.default;
exports.rehydrateCache = _rehydrateCache2.default;
exports.rehydrateCache = rehydrateCache;
exports.rehydrate = _rehydrate2.default;
exports.renderToMarkup = _renderToMarkup2.default;
exports.renderToSheetList = _renderToSheetList2.default;

18

lib/server/renderToMarkup.js

@@ -10,2 +10,12 @@ 'use strict';

var _createStyleTagMarkup = require('./createStyleTagMarkup');
var _createStyleTagMarkup2 = _interopRequireDefault(_createStyleTagMarkup);
var _getRehydrationIndex = require('./getRehydrationIndex');
var _getRehydrationIndex2 = _interopRequireDefault(_getRehydrationIndex);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var sheetMap = {

@@ -18,7 +28,9 @@ fontFaces: _felaUtils.FONT_TYPE,

function renderToMarkup(renderer) {
var cacheCluster = (0, _felaUtils.clusterCache)(renderer.cache, renderer.mediaQueryOrder, renderer.uniqueRuleIdentifier);
var cacheCluster = (0, _felaUtils.clusterCache)(renderer.cache, renderer.mediaQueryOrder);
var rehydrationIndex = (0, _getRehydrationIndex2.default)(renderer);
var basicMarkup = (0, _felaUtils.objectReduce)(sheetMap, function (markup, type, key) {
if (cacheCluster[key].length > 0) {
markup += (0, _felaUtils.createStyleTagMarkup)(cacheCluster[key], type);
markup += (0, _createStyleTagMarkup2.default)(cacheCluster[key], type, '', rehydrationIndex);
}

@@ -31,3 +43,3 @@

if (css.length > 0) {
markup += (0, _felaUtils.createStyleTagMarkup)(css, _felaUtils.RULE_TYPE, media);
markup += (0, _createStyleTagMarkup2.default)(css, _felaUtils.RULE_TYPE, media, rehydrationIndex);
}

@@ -34,0 +46,0 @@

13

lib/server/renderToSheetList.js

@@ -10,2 +10,8 @@ 'use strict';

var _getRehydrationIndex = require('./getRehydrationIndex');
var _getRehydrationIndex2 = _interopRequireDefault(_getRehydrationIndex);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var sheetMap = {

@@ -17,5 +23,8 @@ fontFaces: _felaUtils.FONT_TYPE,

};
function renderToSheetList(renderer) {
var cacheCluster = (0, _felaUtils.clusterCache)(renderer.cache, renderer.mediaQueryOrder, renderer.uniqueRuleIdentifier);
var cacheCluster = (0, _felaUtils.clusterCache)(renderer.cache, renderer.mediaQueryOrder);
var rehydrationIndex = (0, _getRehydrationIndex2.default)(renderer);
var sheetList = (0, _felaUtils.objectReduce)(sheetMap, function (list, type, key) {

@@ -25,2 +34,3 @@ if (cacheCluster[key].length > 0) {

css: cacheCluster[key],
rehydration: rehydrationIndex,
type: type

@@ -38,2 +48,3 @@ });

type: _felaUtils.RULE_TYPE,
rehydration: rehydrationIndex,
media: media

@@ -40,0 +51,0 @@ });

9

package.json
{
"name": "fela-dom",
"version": "6.0.2",
"version": "6.0.3",
"description": "Fela package for working with the DOM",

@@ -27,8 +27,9 @@ "main": "lib/index.js",

"dependencies": {
"fela-tools": "^5.0.10",
"fela-utils": "^7.0.2"
"fela-preset-web": "^6.0.0",
"fela-tools": "^5.0.11",
"fela-utils": "^7.0.3"
},
"devDependencies": {
"fela": "^6.0.2"
"fela": "^6.0.3"
}
}
SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc