@trainline/react-skeletor - npm Package Compare versions

Comparing version 0.1.5 to 0.1.6

lib/createSkeletonElement.d.ts

 import * as React from 'react';
-export declare const createSkeletonElement: <P, T extends React.Component<P, React.ComponentState>, C extends React.ComponentClass<P>>(type: string | React.ClassType<P, T, C>, pendingStyle?: string | React.CSSProperties | undefined) => React.StatelessComponent<any>;
+export declare const createSkeletonElement: <P, T extends React.Component<P, React.ComponentState>, C extends React.ComponentClass<P>>(type: string | React.ClassType<P, T, C>, pendingStyle?: string | React.CSSProperties | (() => React.CSSProperties) | undefined) => React.StatelessComponent<any>;

lib/createSkeletonElement.js

@@ -19,2 +19,11 @@ "use strict";
 var createClassName = function (classnames) { return (classnames.filter(Boolean).join(' ')); };
+var unwrapStyle = function (style) {
+    if (!style) {
+        return undefined;
+    }
+    if (typeof style === 'function') {
+        return style();
+    }
+    return style;
+};
 exports.createSkeletonElement = function (type, pendingStyle) {
@@ -33,7 +42,8 @@ var ExportedComponent = function (// tslint:disable-line
         if (isPending) {
-            var contextStyle = typeof styling === 'function' ? styling() : undefined;
+            var contextStyle = unwrapStyle(styling);
+            var propStyle = unwrapStyle(pendingStyle);
             newProps.style = createStyle([
                 props.style,
                 typeof contextStyle !== 'string' && contextStyle,
-                typeof pendingStyle !== 'string' && pendingStyle
+                typeof propStyle !== 'string' && propStyle
             ]);
@@ -43,3 +53,3 @@ newProps.className = createClassName([
                 typeof contextStyle === 'string' && contextStyle,
-                typeof pendingStyle === 'string' && pendingStyle
+                typeof propStyle === 'string' && propStyle
             ]);
@@ -46,0 +56,0 @@ }

lib/createSkeletonProvider.d.ts

@@ -1,4 +0,4 @@
-import * as React from 'react';
+import { Styling } from './utils';
 export declare type DummyFn<TProps> = (props: TProps) => TProps;
 export declare type DummyData<TProps> = TProps | DummyFn<TProps>;
-export declare function createSkeletonProvider<TPendingProps, TProps extends TPendingProps = TPendingProps>(dummyData: DummyData<TPendingProps>, predicate: (props: TPendingProps) => boolean, styling?: React.CSSProperties | string): (WrappedComponent: any) => any;
+export declare function createSkeletonProvider<TPendingProps, TProps extends TPendingProps = TPendingProps>(dummyData: DummyData<TPendingProps>, predicate: (props: TPendingProps) => boolean, styling?: Styling): (WrappedComponent: any) => any;

lib/utils.d.ts

 import * as React from 'react';
 import * as PropTypes from 'prop-types';
+export declare type Styling = (() => React.CSSProperties) | React.CSSProperties | string;
 export interface Pendable {
@@ -4,0 +5,0 @@ isPending: boolean;

lib/utils.js

@@ -11,5 +11,9 @@ "use strict";
         isPending: PropTypes.bool,
-        styling: PropTypes.func
+        styling: PropTypes.oneOfType([
+            PropTypes.func,
+            PropTypes.string,
+            PropTypes.object
+        ])
     })
 };
 //# sourceMappingURL=utils.js.map

package.json

 {
   "name": "@trainline/react-skeletor",
-  "version": "0.1.5",
+  "version": "0.1.6",
   "description": "Make your application look nice when its loading!",
@@ -5,0 +5,0 @@ "main": "lib/index.js",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

17231

increased by4.5%

Lines of code

190

increased by9.2%

No dependency changes