Started adding frontend notifications, fixing firefox file upload bug

This commit is contained in:
2018-01-22 19:03:06 -05:00
parent f14e96c490
commit 5856052f82
1536 changed files with 109746 additions and 2658 deletions

View File

@@ -0,0 +1,16 @@
# Changelog
### 2.0.0
* improve `assignStyle` to replace arrays
### 1.0.3
* performance improvements
### 1.0.2
* added `resolveArrayValue` and `assignStyle`
### 1.0.1
* added `cssifyDeclaration` and `cssifyObject`
### 1.0.0
Initial version

View File

@@ -0,0 +1,21 @@
MIT License
Copyright (c) 2017 Robin Frischmann
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.

View File

@@ -0,0 +1,241 @@
# CSS-in-JS Utilities
A library that provides useful utilities functions for CSS-in-JS solutions.<br>
They are intended to be used by CSS-in-JS library authors rather used directly.
<br>
<img alt="TravisCI" src="https://travis-ci.org/rofrischmann/css-in-js-utils.svg?branch=master"> <a href="https://codeclimate.com/github/rofrischmann/css-in-js-utils/coverage"><img alt="Test Coverage" src="https://codeclimate.com/github/rofrischmann/css-in-js-utils/badges/coverage.svg"></a> <img alt="npm downloads" src="https://img.shields.io/npm/dm/css-in-js-utils.svg"> <img alt="npm version" src="https://badge.fury.io/js/css-in-js-utils.svg">
## Installation
```sh
yarn add css-in-js-utils
```
## Why?
By now I have authored and collaborated on many different libraries and found I would rewrite the very same utility functions every time. That's why this repository is hosting small utilities especially built for CSS-in-JS solutions and tools. Even if there are tons of different libraries already, they all basically use the same mechanisms and utilities.
## Utilities
* [`assignStyle(base, ...extend)`](#assignstylebase-extend)
* [`camelCaseProperty(property)`](#camelcasepropertyproperty)
* [`cssifyDeclaration(property, value)`](#cssifydeclarationproperty-value)
* [`cssifyObject(object)`](#cssifyobjectobject)
* [`hyphenateProperty(property)`](#hyphenatepropertyproperty)
* [`isPrefixedProperty(property)`](#isprefixedpropertyproperty)
* [`isPrefixedValue(value)`](#isprefixedvaluevalue)
* [`isUnitlessProperty(property)`](#isunitlesspropertyproperty)
* [`normalizeProperty(property)`](#normalizepropertyproperty)
* [`resolveArrayValue(property, value)`](#resolvearrayvalueproperty-value)
* [`unprefixProperty(property)`](#unprefixpropertyproperty)
* [`unprefixValue(value)`](#unprefixvaluevalue)
*
------
### `assignStyle(base, ...extend)`
Merges deep style objects similar to `Object.assign`.
```javascript
import { assignStyle } from 'css-in-js-utils'
assignStyle(
{ color: 'red', backgroundColor: 'black' },
{ color: 'blue' }
)
// => { color: 'blue', backgroundColor: 'black' }
assignStyle(
{
color: 'red',
':hover': {
backgroundColor: 'black'
}
},
{ 
':hover': {
backgroundColor: 'blue'
}
}
)
// => { color: 'red', ':hover': { backgroundColor: 'blue' }}
```
------
### `camelCaseProperty(property)`
Converts the `property` to camelCase.
```javascript
import { camelCaseProperty } from 'css-in-js-utils'
camelCaseProperty('padding-top')
// => 'paddingTop'
camelCaseProperty('-webkit-transition')
// => 'WebkitTransition'
```
------
### `cssifyDeclaration(property, value)`
Generates a CSS declaration (`property`:`value`) string.
```javascript
import { cssifyDeclaration } from 'css-in-js-utils'
cssifyDeclaration('paddingTop', '400px')
// => 'padding-top:400px'
cssifyDeclaration('WebkitFlex', 3)
// => '-webkit-flex:3'
```
------
### `cssifyObject(object)`
Generates a CSS string using all key-property pairs in `object`.
It automatically removes declarations with value types other than `number` and `string`.
```javascript
import { cssifyObject } from 'css-in-js-utils'
cssifyObject({
paddingTop: '400px',
paddingBottom: undefined,
WebkitFlex: 3,
_anyKey: [1, 2, 4]
})
// => 'padding-top:400px;-webkit-flex:3'
```
------
### `hyphenateProperty(property)`
Converts the `property` to hyphen-case.
> Directly mirrors [hyphenate-style-name](https://github.com/rexxars/hyphenate-style-name).
```javascript
import { hyphenateProperty } from 'css-in-js-utils'
hyphenateProperty('paddingTop')
// => 'padding-top'
hyphenateProperty('WebkitTransition')
// => '-webkit-transition'
```
------
### `isPrefixedProperty(property)`
Checks if a `property` includes a vendor prefix.
```javascript
import { isPrefixedProperty } from 'css-in-js-utils'
isPrefixedProperty('paddingTop')
// => false
isPrefixedProperty('WebkitTransition')
// => true
```
------
### `isPrefixedValue(value)`
Checks if a `value` includes vendor prefixes.
```javascript
import { isPrefixedValue } from 'css-in-js-utils'
isPrefixedValue('200px')
isPrefixedValue(200)
// => false
isPrefixedValue('-webkit-calc(100% - 50px)')
// => true
```
------
### `isUnitlessProperty(property)`
Checks if a `property` accepts unitless values.
```javascript
import { isUnitlessProperty } from 'css-in-js-utils'
isUnitlessProperty('width')
// => false
isUnitlessProperty('flexGrow')
isUnitlessProperty('lineHeight')
isUnitlessProperty('line-height')
// => true
```
------
### `normalizeProperty(property)`
Normalizes the `property` by unprefixing **and** camelCasing it.
> Uses the [`camelCaseProperty`](#camelcasepropertyproperty) and [`unprefixProperty`](#unprefixpropertyproperty)-methods.
```javascript
import { normalizeProperty } from 'css-in-js-utils'
normalizeProperty('-webkit-transition-delay')
// => 'transitionDelay'
```
------
### `resolveArrayValue(property, value)`
Concatenates array values to single CSS value.
> Uses the [`hyphenateProperty`](#hyphenatepropertyproperty)-method.
```javascript
import { resolveArrayValue } from 'css-in-js-utils'
resolveArrayValue('display', [ '-webkit-flex', 'flex' ])
// => '-webkit-flex;display:flex'
resolveArrayValue('paddingTop', [ 'calc(100% - 50px)', '100px' ])
// => 'calc(100% - 50px);padding-top:100px'
```
------
### `unprefixProperty(property)`
Removes the vendor prefix (if set) from the `property`.
```javascript
import { unprefixProperty } from 'css-in-js-utils'
unprefixProperty('WebkitTransition')
// => 'transition'
unprefixProperty('transitionDelay')
// => 'transitionDelay'
```
------
### `unprefixValue(value)`
Removes all vendor prefixes (if any) from the `value`.
```javascript
import { unprefixValue } from 'css-in-js-utils'
unprefixValue('-webkit-calc(-moz-calc(100% - 50px)/2)')
// => 'calc(calc(100% - 50px)/2)'
unprefixValue('100px')
// => '100px'
```
## Direct Import
Every utility function may be imported directly to save bundle size.
```javascript
import camelCaseProperty from 'css-in-js-utils/lib/camelCaseProperty'
```
## License
css-in-js-utils is licensed under the [MIT License](http://opensource.org/licenses/MIT).<br>
Documentation is licensed under [Creative Common License](http://creativecommons.org/licenses/by/4.0/).<br>
Created with ♥ by [@rofrischmann](http://rofrischmann.de).

View File

@@ -0,0 +1,105 @@
'use strict';
var _assignStyle = require('../assignStyle');
var _assignStyle2 = _interopRequireDefault(_assignStyle);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
describe('Assinging styles', function () {
it('should merge properties', function () {
expect((0, _assignStyle2.default)({ color: 'red' }, { fontSize: 12 }, { lineHeight: 1 })).toEqual({
color: 'red',
fontSize: 12,
lineHeight: 1
});
});
it('should overwrite properties from right to left', function () {
expect((0, _assignStyle2.default)({ fontSize: 12 }, { fontSize: 16 }, { fontSize: 11 })).toEqual({ fontSize: 11 });
});
it('should merge nested objects', function () {
expect((0, _assignStyle2.default)({
fontSize: 12,
ob2: { color: 'red' },
ob3: { color: 'red' }
}, {
fontSize: 16,
ob2: { fontSize: 12 }
}, {
fontSize: 11,
ob3: { color: 'blue' }
})).toEqual({
fontSize: 11,
ob2: {
color: 'red',
fontSize: 12
},
ob3: { color: 'blue' }
});
});
it('should not overwrite objects other than the first one', function () {
var ob1 = { color: 'red' };
var ob2 = { fontSize: 12 };
var newOb = (0, _assignStyle2.default)({}, ob1, ob2);
expect(newOb).toEqual({
color: 'red',
fontSize: 12
});
newOb.foo = 'bar';
expect(ob1).toEqual({ color: 'red' });
expect(ob2).toEqual({ fontSize: 12 });
});
it('should use the first object as base', function () {
var ob1 = { color: 'red' };
var ob2 = { fontSize: 12 };
var newOb = (0, _assignStyle2.default)(ob1, ob2);
expect(newOb).toEqual({
color: 'red',
fontSize: 12
});
expect(ob1).toEqual(newOb);
newOb.foo = 'bar';
expect(ob1).toEqual({
color: 'red',
fontSize: 12,
foo: 'bar'
});
});
it('should overwrite previous values when both values are array', function () {
var ob1 = { fontSize: ['10px', '10rem'] };
var ob2 = { fontSize: ['10px', '20vw'] };
var newOb = (0, _assignStyle2.default)({}, ob1, ob2);
expect(newOb).toEqual({ fontSize: ['10px', '20vw'] });
});
it('should overwrite previous values when only the last value is an array', function () {
var ob1 = { fontSize: 10 };
var ob2 = { fontSize: ['10px', '20vw'] };
var newOb = (0, _assignStyle2.default)({}, ob1, ob2);
expect(newOb).toEqual({ fontSize: ['10px', '20vw'] });
});
it('should overwrite previous values when only the first value is an array', function () {
var ob1 = { fontSize: ['10px', '10rem'] };
var ob2 = { fontSize: 20 };
var newOb = (0, _assignStyle2.default)({}, ob1, ob2);
expect(newOb).toEqual({ fontSize: 20 });
});
});

View File

@@ -0,0 +1,15 @@
'use strict';
var _camelCaseProperty = require('../camelCaseProperty');
var _camelCaseProperty2 = _interopRequireDefault(_camelCaseProperty);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
describe('Camel casing properties', function () {
it('should camel case properties', function () {
expect((0, _camelCaseProperty2.default)('transition-delay')).toEqual('transitionDelay');
expect((0, _camelCaseProperty2.default)('-webkit-transition-delay')).toEqual('WebkitTransitionDelay');
expect((0, _camelCaseProperty2.default)('-ms-transition')).toEqual('msTransition');
});
});

View File

@@ -0,0 +1,15 @@
'use strict';
var _cssifyDeclaration = require('../cssifyDeclaration');
var _cssifyDeclaration2 = _interopRequireDefault(_cssifyDeclaration);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
describe('Cssifying declarations', function () {
it('should return a valid css declaration', function () {
expect((0, _cssifyDeclaration2.default)('width', '300px')).toEqual('width:300px');
expect((0, _cssifyDeclaration2.default)('WebkitFlex', '1')).toEqual('-webkit-flex:1');
expect((0, _cssifyDeclaration2.default)('msTransitionDuration', '3s')).toEqual('-ms-transition-duration:3s');
});
});

View File

@@ -0,0 +1,31 @@
'use strict';
var _cssifyObject = require('../cssifyObject');
var _cssifyObject2 = _interopRequireDefault(_cssifyObject);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
describe('Cssifying objects', function () {
it('should generate a valid CSS string', function () {
expect((0, _cssifyObject2.default)({ color: 'red' })).toEqual('color:red');
});
it('should convert properties to dash case', function () {
expect((0, _cssifyObject2.default)({ fontSize: '12px' })).toEqual('font-size:12px');
});
it('should separate declarations with semicolons', function () {
expect((0, _cssifyObject2.default)({
fontSize: '12px',
color: 'red'
})).toEqual('font-size:12px;color:red');
});
it('should convert vendor prefixes', function () {
expect((0, _cssifyObject2.default)({
WebkitJustifyContent: 'center',
msFlexAlign: 'center'
})).toEqual('-webkit-justify-content:center;-ms-flex-align:center');
});
});

View File

@@ -0,0 +1,19 @@
'use strict';
var _isPrefixedProperty = require('../isPrefixedProperty');
var _isPrefixedProperty2 = _interopRequireDefault(_isPrefixedProperty);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
describe('Checking for prefixed properties', function () {
it('should return true', function () {
expect((0, _isPrefixedProperty2.default)('WebkitTransition')).toEqual(true);
expect((0, _isPrefixedProperty2.default)('msTransitionDelay')).toEqual(true);
});
it('should return false', function () {
expect((0, _isPrefixedProperty2.default)('transition')).toEqual(false);
expect((0, _isPrefixedProperty2.default)('transitionDelay')).toEqual(false);
});
});

View File

@@ -0,0 +1,19 @@
'use strict';
var _isPrefixedValue = require('../isPrefixedValue');
var _isPrefixedValue2 = _interopRequireDefault(_isPrefixedValue);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
describe('Checking for prefixed values', function () {
it('should return true', function () {
expect((0, _isPrefixedValue2.default)('-webkit-calc(100% - 20px)')).toEqual(true);
expect((0, _isPrefixedValue2.default)('-ms-transition')).toEqual(true);
});
it('should return false', function () {
expect((0, _isPrefixedValue2.default)('200px')).toEqual(false);
expect((0, _isPrefixedValue2.default)('calc(100% - 20px)')).toEqual(false);
});
});

View File

@@ -0,0 +1,43 @@
'use strict';
var _isUnitlessProperty = require('../isUnitlessProperty');
var _isUnitlessProperty2 = _interopRequireDefault(_isUnitlessProperty);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
describe('Checking for unitless CSS properties', function () {
it('should return true for unitless properties', function () {
expect((0, _isUnitlessProperty2.default)('fontWeight')).toEqual(true);
expect((0, _isUnitlessProperty2.default)('flex')).toEqual(true);
expect((0, _isUnitlessProperty2.default)('gridColumn')).toEqual(true);
});
it('should return true for hypenated unitless properties', function () {
expect((0, _isUnitlessProperty2.default)('font-weight')).toEqual(true);
expect((0, _isUnitlessProperty2.default)('grid-column')).toEqual(true);
});
it('should return true for prefixed unitless properties', function () {
expect((0, _isUnitlessProperty2.default)('WebkitFlex')).toEqual(true);
expect((0, _isUnitlessProperty2.default)('msFlex')).toEqual(true);
expect((0, _isUnitlessProperty2.default)('WebkitColumnCount')).toEqual(true);
expect((0, _isUnitlessProperty2.default)('msColumnCount')).toEqual(true);
});
it('should return true for hypenated prefixed unitless properties', function () {
expect((0, _isUnitlessProperty2.default)('-webkit-flex')).toEqual(true);
expect((0, _isUnitlessProperty2.default)('-ms-flex')).toEqual(true);
expect((0, _isUnitlessProperty2.default)('-webkit-column-count')).toEqual(true);
expect((0, _isUnitlessProperty2.default)('-ms-column-count')).toEqual(true);
});
it('should equal false for other properties', function () {
expect((0, _isUnitlessProperty2.default)('fontSize')).toEqual(false);
expect((0, _isUnitlessProperty2.default)('font-size')).toEqual(false);
expect((0, _isUnitlessProperty2.default)('-webkit-border-radius')).toEqual(false);
expect((0, _isUnitlessProperty2.default)('-ms-border-radius')).toEqual(false);
expect((0, _isUnitlessProperty2.default)('WebkitBorderRadius')).toEqual(false);
expect((0, _isUnitlessProperty2.default)('msBorderRadius')).toEqual(false);
});
});

View File

@@ -0,0 +1,21 @@
'use strict';
var _normalizeProperty = require('../normalizeProperty');
var _normalizeProperty2 = _interopRequireDefault(_normalizeProperty);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
describe('Normalizing properties', function () {
it('should camel case hypenated properties', function () {
expect((0, _normalizeProperty2.default)('transition-delay')).toEqual('transitionDelay');
});
it('should unprefix properties', function () {
expect((0, _normalizeProperty2.default)('WebkitTransitionDelay')).toEqual('transitionDelay');
});
it('should unprefix and camel case properties', function () {
expect((0, _normalizeProperty2.default)('-webkit-transition-delay')).toEqual('transitionDelay');
});
});

View File

@@ -0,0 +1,17 @@
'use strict';
var _resolveArrayValue = require('../resolveArrayValue');
var _resolveArrayValue2 = _interopRequireDefault(_resolveArrayValue);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
describe('Resolving array values', function () {
it('should return a concatenated css value', function () {
expect((0, _resolveArrayValue2.default)('width', ['300px', '100px'])).toEqual('300px;width:100px');
});
it('should hyphenate property names', function () {
expect((0, _resolveArrayValue2.default)('WebkitFlex', [1, 2, 3])).toEqual('1;-webkit-flex:2;-webkit-flex:3');
});
});

View File

@@ -0,0 +1,19 @@
'use strict';
var _unprefixProperty = require('../unprefixProperty');
var _unprefixProperty2 = _interopRequireDefault(_unprefixProperty);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
describe('Unprefixing properties', function () {
it('should unprefix the property', function () {
expect((0, _unprefixProperty2.default)('msFlex')).toEqual('flex');
expect((0, _unprefixProperty2.default)('WebkitFlex')).toEqual('flex');
});
it('should keep an unprefixed property', function () {
expect((0, _unprefixProperty2.default)('flex')).toEqual('flex');
expect((0, _unprefixProperty2.default)('padding')).toEqual('padding');
});
});

View File

@@ -0,0 +1,20 @@
'use strict';
var _unprefixValue = require('../unprefixValue');
var _unprefixValue2 = _interopRequireDefault(_unprefixValue);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
describe('Unprefixing values', function () {
it('should unprefix the value', function () {
expect((0, _unprefixValue2.default)('-webkit-calc(100% - 20px)')).toEqual('calc(100% - 20px)');
expect((0, _unprefixValue2.default)('-ms-transition')).toEqual('transition');
});
it('should keep an unprefixed value', function () {
expect((0, _unprefixValue2.default)('300px')).toEqual('300px');
expect((0, _unprefixValue2.default)(300)).toEqual(300);
expect((0, _unprefixValue2.default)('calc(100% - 20px)')).toEqual('calc(100% - 20px)');
});
});

View File

@@ -0,0 +1,33 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
exports.default = assignStyle;
function assignStyle(base) {
for (var _len = arguments.length, extendingStyles = Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
extendingStyles[_key - 1] = arguments[_key];
}
for (var i = 0, len = extendingStyles.length; i < len; ++i) {
var style = extendingStyles[i];
for (var property in style) {
var value = style[property];
var baseValue = base[property];
if ((typeof value === 'undefined' ? 'undefined' : _typeof(value)) === 'object' && !Array.isArray(value)) {
base[property] = assignStyle({}, baseValue, value);
continue;
}
base[property] = value;
}
}
return base;
}
module.exports = exports['default'];

View File

@@ -0,0 +1,15 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = camelCaseProperty;
var dashRegex = /-([a-z])/g;
var msRegex = /^Ms/g;
function camelCaseProperty(property) {
return property.replace(dashRegex, function (match) {
return match[1].toUpperCase();
}).replace(msRegex, 'ms');
}
module.exports = exports['default'];

View File

@@ -0,0 +1,17 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = cssifyDeclaration;
var _hyphenateProperty = require('./hyphenateProperty');
var _hyphenateProperty2 = _interopRequireDefault(_hyphenateProperty);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function cssifyDeclaration(property, value) {
return (0, _hyphenateProperty2.default)(property) + ':' + value;
}
module.exports = exports['default'];

View File

@@ -0,0 +1,34 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = cssifyObject;
var _cssifyDeclaration = require('./cssifyDeclaration');
var _cssifyDeclaration2 = _interopRequireDefault(_cssifyDeclaration);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function cssifyObject(style) {
var css = '';
for (var property in style) {
var value = style[property];
if (typeof value !== 'string' && typeof value !== 'number') {
continue;
}
// prevents the semicolon after
// the last rule declaration
if (css) {
css += ';';
}
css += (0, _cssifyDeclaration2.default)(property, value);
}
return css;
}
module.exports = exports['default'];

View File

@@ -0,0 +1,17 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = hyphenateProperty;
var _hyphenateStyleName = require('hyphenate-style-name');
var _hyphenateStyleName2 = _interopRequireDefault(_hyphenateStyleName);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function hyphenateProperty(property) {
return (0, _hyphenateStyleName2.default)(property);
}
module.exports = exports['default'];

View File

@@ -0,0 +1,71 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _assignStyle = require('./assignStyle');
var _assignStyle2 = _interopRequireDefault(_assignStyle);
var _camelCaseProperty = require('./camelCaseProperty');
var _camelCaseProperty2 = _interopRequireDefault(_camelCaseProperty);
var _cssifyDeclaration = require('./cssifyDeclaration');
var _cssifyDeclaration2 = _interopRequireDefault(_cssifyDeclaration);
var _cssifyObject = require('./cssifyObject');
var _cssifyObject2 = _interopRequireDefault(_cssifyObject);
var _hyphenateProperty = require('./hyphenateProperty');
var _hyphenateProperty2 = _interopRequireDefault(_hyphenateProperty);
var _isPrefixedProperty = require('./isPrefixedProperty');
var _isPrefixedProperty2 = _interopRequireDefault(_isPrefixedProperty);
var _isPrefixedValue = require('./isPrefixedValue');
var _isPrefixedValue2 = _interopRequireDefault(_isPrefixedValue);
var _isUnitlessProperty = require('./isUnitlessProperty');
var _isUnitlessProperty2 = _interopRequireDefault(_isUnitlessProperty);
var _normalizeProperty = require('./normalizeProperty');
var _normalizeProperty2 = _interopRequireDefault(_normalizeProperty);
var _resolveArrayValue = require('./resolveArrayValue');
var _resolveArrayValue2 = _interopRequireDefault(_resolveArrayValue);
var _unprefixProperty = require('./unprefixProperty');
var _unprefixProperty2 = _interopRequireDefault(_unprefixProperty);
var _unprefixValue = require('./unprefixValue');
var _unprefixValue2 = _interopRequireDefault(_unprefixValue);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
exports.default = {
assignStyle: _assignStyle2.default,
camelCaseProperty: _camelCaseProperty2.default,
cssifyDeclaration: _cssifyDeclaration2.default,
cssifyObject: _cssifyObject2.default,
hyphenateProperty: _hyphenateProperty2.default,
isPrefixedProperty: _isPrefixedProperty2.default,
isPrefixedValue: _isPrefixedValue2.default,
isUnitlessProperty: _isUnitlessProperty2.default,
normalizeProperty: _normalizeProperty2.default,
resolveArrayValue: _resolveArrayValue2.default,
unprefixProperty: _unprefixProperty2.default,
unprefixValue: _unprefixValue2.default
};
module.exports = exports['default'];

View File

@@ -0,0 +1,12 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = isPrefixedProperty;
var regex = /^(Webkit|Moz|O|ms)/;
function isPrefixedProperty(property) {
return regex.test(property);
}
module.exports = exports["default"];

View File

@@ -0,0 +1,12 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = isPrefixedValue;
var regex = /-webkit-|-moz-|-ms-/;
function isPrefixedValue(value) {
return typeof value === 'string' && regex.test(value);
}
module.exports = exports['default'];

View File

@@ -0,0 +1,64 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = isUnitlessProperty;
var _hyphenateProperty = require('./hyphenateProperty');
var _hyphenateProperty2 = _interopRequireDefault(_hyphenateProperty);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var unitlessProperties = {
borderImageOutset: true,
borderImageSlice: true,
borderImageWidth: true,
fontWeight: true,
lineHeight: true,
opacity: true,
orphans: true,
tabSize: true,
widows: true,
zIndex: true,
zoom: true,
// SVG-related properties
fillOpacity: true,
floodOpacity: true,
stopOpacity: true,
strokeDasharray: true,
strokeDashoffset: true,
strokeMiterlimit: true,
strokeOpacity: true,
strokeWidth: true
};
var prefixedUnitlessProperties = ['animationIterationCount', 'boxFlex', 'boxFlexGroup', 'boxOrdinalGroup', 'columnCount', 'flex', 'flexGrow', 'flexPositive', 'flexShrink', 'flexNegative', 'flexOrder', 'gridRow', 'gridColumn', 'order', 'lineClamp'];
var prefixes = ['Webkit', 'ms', 'Moz', 'O'];
function getPrefixedProperty(prefix, property) {
return prefix + property.charAt(0).toUpperCase() + property.slice(1);
}
// add all prefixed properties to the unitless properties
for (var i = 0, len = prefixedUnitlessProperties.length; i < len; ++i) {
var property = prefixedUnitlessProperties[i];
unitlessProperties[property] = true;
for (var j = 0, jLen = prefixes.length; j < jLen; ++j) {
unitlessProperties[getPrefixedProperty(prefixes[j], property)] = true;
}
}
// add all hypenated properties as well
for (var _property in unitlessProperties) {
unitlessProperties[(0, _hyphenateProperty2.default)(_property)] = true;
}
function isUnitlessProperty(property) {
return unitlessProperties.hasOwnProperty(property);
}
module.exports = exports['default'];

View File

@@ -0,0 +1,21 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = normalizeProperty;
var _camelCaseProperty = require('./camelCaseProperty');
var _camelCaseProperty2 = _interopRequireDefault(_camelCaseProperty);
var _unprefixProperty = require('./unprefixProperty');
var _unprefixProperty2 = _interopRequireDefault(_unprefixProperty);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function normalizeProperty(property) {
return (0, _unprefixProperty2.default)((0, _camelCaseProperty2.default)(property));
}
module.exports = exports['default'];

View File

@@ -0,0 +1,19 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = resolveArrayValue;
var _hyphenateProperty = require('./hyphenateProperty');
var _hyphenateProperty2 = _interopRequireDefault(_hyphenateProperty);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function resolveArrayValue(property, value) {
var hyphenatedProperty = (0, _hyphenateProperty2.default)(property);
return value.join(';' + hyphenatedProperty + ':');
}
module.exports = exports['default'];

View File

@@ -0,0 +1 @@
"use strict";

View File

@@ -0,0 +1,13 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = unprefixProperty;
var prefixRegex = /^(ms|Webkit|Moz|O)/;
function unprefixProperty(property) {
var propertyWithoutPrefix = property.replace(prefixRegex, '');
return propertyWithoutPrefix.charAt(0).toLowerCase() + propertyWithoutPrefix.slice(1);
}
module.exports = exports['default'];

View File

@@ -0,0 +1,16 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = unprefixValue;
var prefixRegex = /(-ms-|-webkit-|-moz-|-o-)/g;
function unprefixValue(value) {
if (typeof value === 'string') {
return value.replace(prefixRegex, '');
}
return value;
}
module.exports = exports['default'];

View File

@@ -0,0 +1,90 @@
{
"_from": "css-in-js-utils@^2.0.0",
"_id": "css-in-js-utils@2.0.0",
"_inBundle": false,
"_integrity": "sha512-yuWmPMD9FLi50Xf3k8W8oO3WM1eVnxEGCldCLyfusQ+CgivFk0s23yst4ooW6tfxMuSa03S6uUEga9UhX6GRrA==",
"_location": "/react-toastify/css-in-js-utils",
"_phantomChildren": {},
"_requested": {
"type": "range",
"registry": true,
"raw": "css-in-js-utils@^2.0.0",
"name": "css-in-js-utils",
"escapedName": "css-in-js-utils",
"rawSpec": "^2.0.0",
"saveSpec": null,
"fetchSpec": "^2.0.0"
},
"_requiredBy": [
"/react-toastify/inline-style-prefixer"
],
"_resolved": "https://registry.npmjs.org/css-in-js-utils/-/css-in-js-utils-2.0.0.tgz",
"_shasum": "5af1dd70f4b06b331f48d22a3d86e0786c0b9435",
"_spec": "css-in-js-utils@^2.0.0",
"_where": "C:\\Users\\deranjer\\go\\src\\github.com\\deranjer\\goTorrent\\goTorrentWebUI\\node_modules\\react-toastify\\node_modules\\inline-style-prefixer",
"author": {
"name": "Robin Frischmann",
"email": "robin@rofrischmann.de"
},
"bugs": {
"url": "https://github.com/rofrischmann/css-in-js-utils/issues"
},
"bundleDependencies": false,
"dependencies": {
"hyphenate-style-name": "^1.0.2"
},
"deprecated": false,
"description": "Useful utility functions for CSS in JS solutions",
"devDependencies": {
"babel-cli": "^6.22.1",
"babel-core": "^6.22.1",
"babel-eslint": "^7.1.1",
"babel-jest": "^18.0.0",
"babel-plugin-add-module-exports": "^0.2.1",
"babel-preset-es2015": "^6.22.0",
"babel-preset-react": "^6.22.0",
"babel-preset-stage-0": "^6.22.0",
"codeclimate-test-reporter": "^0.4.0",
"eslint": "^3.14.1",
"eslint-config-airbnb": "^14.0.0",
"eslint-plugin-flowtype": "^2.30.0",
"eslint-plugin-import": "^2.2.0",
"eslint-plugin-jsx-a11y": "^3.0.2",
"eslint-plugin-react": "^6.9.0",
"flow-bin": "^0.38.0",
"jest": "^18.1.0",
"prettier-eslint-cli": "^1.1.0"
},
"files": [
"LICENSE",
"README.md",
"lib/"
],
"homepage": "https://github.com/rofrischmann/css-in-js-utils#readme",
"jest": {
"rootDir": "modules"
},
"keywords": [
"css",
"cssinjs",
"utils"
],
"license": "MIT",
"main": "lib/index.js",
"name": "css-in-js-utils",
"repository": {
"type": "git",
"url": "git+https://github.com/rofrischmann/css-in-js-utils.git"
},
"scripts": {
"babel": "babel -d lib modules",
"check": "npm run format && npm run lint && npm run test:coverage && npm run flow",
"flow": "flow",
"format": "prettier-eslint modules",
"lint": "eslint modules",
"release": "npm run check && npm run babel && npm publish",
"test": "jest",
"test:coverage": "jest --coverage"
},
"version": "2.0.0"
}