@alifd/adaptor-render - npm Package Compare versions

Comparing version 0.4.3 to 0.5.0

es/react/index.js

@@ -1,33 +0,12 @@
-import { findEditor, findAdaptor } from '../utils';
+import { findEditor, findShapes, initAdaptors } from '../utils';
 import render from './render';
-import init from './init';
+import snapshot from './snapshot';
 export default {
-  init: init,
+  init: function init(ExpandedComponents) {
+    return initAdaptors(ExpandedComponents);
+  },
   findEditor: findEditor,
+  findShapes: findShapes,
   render: render,
-  scrollTo: function scrollTo(name) {
-    var _findAdaptor = findAdaptor(name),
-        type = _findAdaptor.type;
-
-    this.show(type);
-    var node = document.getElementById("component-".concat(name));
-
-    if (!node) {
-      return;
-    }
-
-    document.getElementById(type).scrollTo(0, node.offsetTop);
-  },
-  show: function show(type) {
-    var basic = document.getElementById('basic');
-    var expanded = document.getElementById('expanded');
-
-    if (type === 'basic') {
-      basic.style.visibility = '';
-      expanded.style.visibility = 'hidden';
-    } else {
-      expanded.style.visibility = '';
-      basic.style.visibility = 'hidden';
-    }
-  }
+  snapshot: snapshot
 };

es/react/init.js

@@ -77,2 +77,3 @@ import _regeneratorRuntime from "@babel/runtime/regenerator";
     var Adaptor = findAdaptor(name);
+    if (name === 'layout-shell') console.log(name, Adaptor);
     if (!Adaptor || !Adaptor.name) return null;
@@ -79,0 +80,0 @@ var demos = getDemos(Adaptor) || [];

es/react/render.js

@@ -25,3 +25,5 @@ import React from 'react';
 
-export default (function (name, props, themeId) {
+export default (function (name) {
+  var props = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+  var themeId = arguments.length > 2 ? arguments[2] : undefined;
   var mountNode = createMountedNode();
@@ -28,0 +30,0 @@

es/utils/index.js

@@ -120,2 +120,34 @@ import _regeneratorRuntime from "@babel/runtime/regenerator";
 };
+export var findShapes = function findShapes(name) {
+  var Adaptor = findAdaptor(name);
+  if (!Adaptor) return [];
+  return Adaptor.shape;
+};
+export var getSnapshotDemos = function getSnapshotDemos(name) {
+  var Adaptor = findAdaptor(name);
+  if (!Adaptor) return [];
+  return Adaptor.shape.map(function (_ref3) {
+    var value = _ref3.value;
+    var defaultProps = getDefaultProps(Adaptor, value);
+
+    var _Adaptor$editor = Adaptor.editor(value),
+        props = _Adaptor$editor.props;
+
+    var levelProp = findProp('level', props);
+
+    if (levelProp.options && levelProp.options.find(function (_ref4) {
+      var v = _ref4.value;
+      return v === 'primary';
+    })) {
+      defaultProps.level = 'primary';
+    }
+
+    return Adaptor.demoOptions({
+      node: {
+        adaptor: name,
+        props: defaultProps
+      }
+    });
+  });
+};
 export var renderAdaptor = function renderAdaptor(name) {
@@ -130,5 +162,8 @@ var props = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
   if (!Adaptor) return null;
-  var _props$shape = props.shape,
+  var _props = props,
+      _props$shape = _props.shape,
       shape = _props$shape === void 0 ? 'normal' : _props$shape;
   var editor = Adaptor.editor(shape);
+  var defaultProps = getDefaultProps(Adaptor, shape);
+  props = _objectSpread({}, defaultProps, props);
   var config = {};
@@ -139,5 +174,5 @@ var newProps = {};
 
-    var _ref3 = findProp(key, editor.props) || {},
-        _ref3$type = _ref3.type,
-        type = _ref3$type === void 0 ? 'any' : _ref3$type;
+    var _ref5 = findProp(key, editor.props) || {},
+        _ref5$type = _ref5.type,
+        type = _ref5$type === void 0 ? 'any' : _ref5$type;
 
@@ -255,4 +290,4 @@ switch (type) {
 
-  var demos = generateDemos(Adaptor).filter(function (_ref4) {
-    var node = _ref4.node;
+  var demos = generateDemos(Adaptor).filter(function (_ref6) {
+    var node = _ref6.node;
     var _node$props = node.props,
@@ -266,4 +301,4 @@ size = _node$props.size,
   if (demos.length > 10) {
-    demos = demos.filter(function (_ref5) {
-      var node = _ref5.node;
+    demos = demos.filter(function (_ref7) {
+      var node = _ref7.node;
       var _node$props2 = node.props,
@@ -270,0 +305,0 @@ state = _node$props2.state,

package.json

 {
   "name": "@alifd/adaptor-render",
-  "version": "0.4.3",
+  "version": "0.5.0",
   "main": "umd/react/adaptor-render.development.js",
@@ -36,2 +36,3 @@ "unpkg": "umd/react/adaptor-render.production.min.js",
     "@babel/plugin-transform-runtime": "^7.4.4",
+    "html2canvas": "^1.0.0-rc.4",
     "prop-types": "^15.7.2"
@@ -38,0 +39,0 @@ },

src/index.js

@@ -42,74 +42,4 @@ import React from 'react';
 AdaptorRender.init([
-  {
-      "name": "WhaleCheckedAll",
-      "script": "https://unpkg.alibaba-inc.com/@alife/test-whale-checked-all@1.0.6/build/adaptor/adaptor.js",
-      "stylesheet": "https://pre-theme-fusion.alibaba-inc.com/themes/10/biz-components/compile?name=@alife/test-whale-checked-all&version=1.0.6&scssUrl=https://unpkg.alibaba-inc.com/@alife/test-whale-checked-all@1.0.6/build/index.scss"
-  },
-  {
-      "name": "WhaleEmptyData",
-      "script": "https://unpkg.alibaba-inc.com/@alife/test-whale-empty-data@0.1.7/build/adaptor/adaptor.js",
-      "stylesheet": "https://pre-theme-fusion.alibaba-inc.com/themes/10/biz-components/compile?name=@alife/test-whale-empty-data&version=0.1.7&scssUrl=https://unpkg.alibaba-inc.com/@alife/test-whale-empty-data@0.1.7/build/index.scss"
-  },
-  {
-      "name": "WhaleCard",
-      "script": "https://unpkg.alibaba-inc.com/@alife/test-whale-card@0.2.7/build/adaptor/adaptor.js",
-      "stylesheet": "https://pre-theme-fusion.alibaba-inc.com/themes/10/biz-components/compile?name=@alife/test-whale-card&version=0.2.7&scssUrl=https://unpkg.alibaba-inc.com/@alife/test-whale-card@0.2.7/build/index.scss"
-  },
-  {
-      "name": "WhaleCurrencySelect",
-      "script": "https://unpkg.alibaba-inc.com/@alife/test-whale-currency-select@0.0.6/build/adaptor/adaptor.js",
-      "stylesheet": "https://pre-theme-fusion.alibaba-inc.com/themes/10/biz-components/compile?name=@alife/test-whale-currency-select&version=0.0.6&scssUrl=https://unpkg.alibaba-inc.com/@alife/test-whale-currency-select@0.0.6/build/index.scss"
-  },
-  {
-      "name": "WhaleAmountSelect",
-      "script": "https://unpkg.alibaba-inc.com/@alife/test-whale-amount-select@0.1.5/build/adaptor/adaptor.js",
-      "stylesheet": "https://pre-theme-fusion.alibaba-inc.com/themes/10/biz-components/compile?name=@alife/test-whale-amount-select&version=0.1.5&scssUrl=https://unpkg.alibaba-inc.com/@alife/test-whale-amount-select@0.1.5/build/index.scss"
-  }
-], (node) => {
-  console.log(node, node.getBoundingClientRect());
-}, 123, [
-  'Badge',
-  'Balloon',
-  'Breadcrumb',
-  'Button',
-  'Calendar',
-  'Card',
-  'Cascader',
-  'CascaderSelect',
-  'Checkbox',
-  'Collapse',
-  'DatePicker',
-  'Dialog',
-  'Input',
-  'Loading',
-  'Menu',
-  'MenuButton',
-  'Message',
-  'Nav',
-  'NumberPicker',
-  'Pagination',
-  'Paragraph',
-  'Progress',
-  'Radio',
-  'Range',
-  'Rating',
-  'Search',
-  'Select',
-  'Slider',
-  'SplitButton',
-  'Step',
-  'Switch',
-  'Tab',
-  'Table',
-  'Tag',
-  'TimePicker',
-  'Timeline',
-  'Transfer',
-  'Tree',
-  'TreeSelect',
-  'Upload',
-], 'basic', { onVisibleComponentChange: (name) => {console.log(name)}}).then(() => {
+]);
 
-});
-
 window.AdaptorRender = AdaptorRender;

src/react/index.js

@@ -1,30 +0,13 @@
-import { findEditor, findAdaptor } from '../utils';
+import { findEditor, findShapes, initAdaptors } from '../utils';
 import render from './render';
-import init from './init';
+import snapshot from './snapshot';
 
 export default {
-  init,
+  init: (ExpandedComponents) => {
+    return initAdaptors(ExpandedComponents);
+  },
   findEditor,
+  findShapes,
   render,
-  scrollTo(name) {
-    const { type } = findAdaptor(name);
-    this.show(type);
-    const node = document.getElementById(`component-${name}`);
-    if (!node) {
-      return;
-    }
-
-    document.getElementById(type).scrollTo(0, node.offsetTop);
-  },
-  show(type) {
-    const basic = document.getElementById('basic');
-    const expanded = document.getElementById('expanded');
-    if (type === 'basic') {
-      basic.style.visibility = '';
-      expanded.style.visibility = 'hidden';
-    } else {
-      expanded.style.visibility = '';
-      basic.style.visibility = 'hidden';
-    }
-  }
+  snapshot,
 };

src/react/init.js

@@ -38,4 +38,6 @@ import React, { useState } from 'react';
     components.map(({ name }, index) => {
+
       const Adaptor = findAdaptor(name);
     
+      if (name === 'layout-shell') console.log(name, Adaptor)
       if (!Adaptor || !Adaptor.name) return null;
@@ -42,0 +44,0 @@

src/react/render.js

@@ -24,3 +24,3 @@ import React from 'react';
 
-export default (name, props, themeId) => {
+export default (name, props = {}, themeId) => {
   const mountNode = createMountedNode();
@@ -27,0 +27,0 @@ const RenderComponent = ({ onError }) => {

src/utils/index.js

@@ -111,2 +111,31 @@ import { normalizeAdaptor, generateDemos, getDefaultProps, STATE_MARK, Types, findProp } from '@alifd/adaptor-helper';
 
+export const findShapes = (name) => {
+  const Adaptor = findAdaptor(name);
+
+  if (!Adaptor) return[];
+  return Adaptor.shape;
+}
+
+export const getSnapshotDemos = (name) => {
+  const Adaptor = findAdaptor(name);
+
+  if (!Adaptor) return[];
+
+  return Adaptor.shape.map(({ value }) => {
+    const defaultProps  = getDefaultProps(Adaptor, value);
+    const { props } = Adaptor.editor(value);
+    const levelProp = findProp('level', props);
+    if (levelProp.options && levelProp.options.find(({ value: v }) => v === 'primary')) {
+      defaultProps.level = 'primary';
+    }
+
+    return Adaptor.demoOptions({
+      node: {
+        adaptor: name,
+        props: defaultProps,
+      }
+    });
+  });
+}
+
 export const renderAdaptor = (name, props = {}, themeId, id, path = '', propName, rootProps = {}) => {
@@ -119,2 +148,9 @@ const Adaptor = findAdaptor(name);
 
+  const defaultProps = getDefaultProps(Adaptor, shape);
+
+  props = {
+    ...defaultProps,
+    ...props,
+  };
+
   const config = {};
@@ -121,0 +157,0 @@ const newProps = {};

New alerts

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Fixed alerts

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

817678

increased by147.04%

Number of package files

22

increased by10%

Lines of code

15920

increased by84.47%

Worsened metrics

Dependency count

4

increased by33.33%

Dependency changes

• + Addedhtml2canvas@^1.0.0-rc.4

• + Addedbase64-arraybuffer@1.0.2(transitive)

• + Addedcss-line-break@2.1.0(transitive)

• + Addedhtml2canvas@1.4.1(transitive)

• + Addedtext-segmentation@1.0.3(transitive)

• + Addedutrie@1.0.2(transitive)