@sensoro-design/icons 0.1.2 → 0.1.5

package/es/index.js

@@ -1,7 +1,63 @@
-import Context from './components/Context';
-export * from './icons';
-export * from './components/twoTonePrimaryColor';
-export { default as createFromIconfontCN } from './components/IconFont';
-export { default } from './components/Icon';
-var IconProvider = Context.Provider;
-export { IconProvider };
+"use strict";
+
+var __createBinding = this && this.__createBinding || (Object.create ? function (o, m, k, k2) {
+  if (k2 === undefined) k2 = k;
+  var desc = Object.getOwnPropertyDescriptor(m, k);
+
+  if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+    desc = {
+      enumerable: true,
+      get: function get() {
+        return m[k];
+      }
+    };
+  }
+
+  Object.defineProperty(o, k2, desc);
+} : function (o, m, k, k2) {
+  if (k2 === undefined) k2 = k;
+  o[k2] = m[k];
+});
+
+var __exportStar = this && this.__exportStar || function (m, exports) {
+  for (var p in m) {
+    if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+  }
+};
+
+var __importDefault = this && this.__importDefault || function (mod) {
+  return mod && mod.__esModule ? mod : {
+    "default": mod
+  };
+};
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.IconProvider = exports.default = exports.createFromIconfontCN = void 0;
+
+var Context_1 = __importDefault(require("./components/Context"));
+
+__exportStar(require("./icons"), exports);
+
+__exportStar(require("./components/twoTonePrimaryColor"), exports);
+
+var IconFont_1 = require("./components/IconFont");
+
+Object.defineProperty(exports, "createFromIconfontCN", {
+  enumerable: true,
+  get: function get() {
+    return __importDefault(IconFont_1).default;
+  }
+});
+
+var Icon_1 = require("./components/Icon");
+
+Object.defineProperty(exports, "default", {
+  enumerable: true,
+  get: function get() {
+    return __importDefault(Icon_1).default;
+  }
+});
+var IconProvider = Context_1.default.Provider;
+exports.IconProvider = IconProvider;

package/es/utils.js

@@ -1,57 +1,88 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
+"use strict";
+
+import _typeof from "@babel/runtime/helpers/esm/typeof";
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+
+var __importDefault = this && this.__importDefault || function (mod) {
+  return mod && mod.__esModule ? mod : {
+    "default": mod
+  };
 };
-import React from 'react';
-import { generate as generateColor } from '@ant-design/colors';
-export function normalizeAttrs(attrs) {
-    if (attrs === void 0) { attrs = {}; }
-    return Object.keys(attrs).reduce(function (acc, key) {
-        var val = attrs[key];
-        switch (key) {
-            case 'class':
-                acc.className = val;
-                delete acc.class;
-                break;
-            default:
-                acc[key] = val;
-        }
-        return acc;
-    }, {});
-}
-export function generate(node, key, rootProps) {
-    if (!rootProps) {
-        return React.createElement(node.tag, __assign({ key: key }, normalizeAttrs(node.attrs)), (node.children || []).map(function (child, index) { return generate(child, "".concat(key, "-").concat(node.tag, "-").concat(index)); }));
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.normalizeTwoToneColors = exports.svgBaseProps = exports.isIconDefinition = exports.getSecondaryColor = exports.generate = exports.normalizeAttrs = void 0;
+
+var react_1 = __importDefault(require("react"));
+
+var colors_1 = require("@ant-design/colors");
+
+function normalizeAttrs() {
+  var attrs = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  return Object.keys(attrs).reduce(function (acc, key) {
+    var val = attrs[key];
+
+    switch (key) {
+      case 'class':
+        acc.className = val;
+        delete acc.class;
+        break;
+
+      default:
+        acc[key] = val;
     }
-    return React.createElement(node.tag, __assign(__assign({ key: key }, normalizeAttrs(node.attrs)), rootProps), (node.children || []).map(function (child, index) { return generate(child, "".concat(key, "-").concat(node.tag, "-").concat(index)); }));
+
+    return acc;
+  }, {});
+}
+
+exports.normalizeAttrs = normalizeAttrs;
+
+function generate(node, key, rootProps) {
+  if (!rootProps) {
+    return react_1.default.createElement(node.tag, _objectSpread({
+      key: key
+    }, normalizeAttrs(node.attrs)), (node.children || []).map(function (child, index) {
+      return generate(child, "".concat(key, "-").concat(node.tag, "-").concat(index));
+    }));
+  }
+
+  return react_1.default.createElement(node.tag, _objectSpread(_objectSpread({
+    key: key
+  }, normalizeAttrs(node.attrs)), rootProps), (node.children || []).map(function (child, index) {
+    return generate(child, "".concat(key, "-").concat(node.tag, "-").concat(index));
+  }));
 }
-export function getSecondaryColor(primaryColor) {
-    // choose the second color
-    return generateColor(primaryColor)[0];
+
+exports.generate = generate;
+
+function getSecondaryColor(primaryColor) {
+  // choose the second color
+  return (0, colors_1.generate)(primaryColor)[0];
 }
-export function isIconDefinition(target) {
-    return (typeof target === 'object' &&
-        typeof target.name === 'string' &&
-        typeof target.theme === 'string' &&
-        (typeof target.icon === 'object' || typeof target.icon === 'function'));
+
+exports.getSecondaryColor = getSecondaryColor;
+
+function isIconDefinition(target) {
+  return _typeof(target) === 'object' && typeof target.name === 'string' && typeof target.theme === 'string' && (_typeof(target.icon) === 'object' || typeof target.icon === 'function');
 }
-export var svgBaseProps = {
-    width: '1em',
-    height: '1em',
-    fill: 'currentColor',
-    'aria-hidden': 'true',
-    focusable: 'false',
+
+exports.isIconDefinition = isIconDefinition;
+exports.svgBaseProps = {
+  width: '1em',
+  height: '1em',
+  fill: 'currentColor',
+  'aria-hidden': 'true',
+  focusable: 'false'
 };
-export function normalizeTwoToneColors(twoToneColor) {
-    if (!twoToneColor) {
-        return [];
-    }
-    return Array.isArray(twoToneColor) ? twoToneColor : [twoToneColor];
+
+function normalizeTwoToneColors(twoToneColor) {
+  if (!twoToneColor) {
+    return [];
+  }
+
+  return Array.isArray(twoToneColor) ? twoToneColor : [twoToneColor];
 }
+
+exports.normalizeTwoToneColors = normalizeTwoToneColors;

package/index.d.ts

@@ -0,0 +1,2 @@
+// This index.ts file is generated automatically.
+export { default } from './lib/icons/index';

package/index.js

@@ -0,0 +1,15 @@
+// This index.ts file is generated automatically.
+'use strict';
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _index = _interopRequireDefault(require('./lib/icons/index'));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
+
+var _default = _index;
+exports.default = _default;
+module.exports = _default;

package/lib/components/Context.js

@@ -0,0 +1,10 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
+var react_1 = require("react");
+
+var IconContext = (0, react_1.createContext)({});
+exports.default = IconContext;

package/lib/components/Icon.js

@@ -0,0 +1,100 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _excluded = ["className", "component", "viewBox", "spin", "rotate", "tabIndex", "onClick", "children"];
+
+var __importDefault = void 0 && (void 0).__importDefault || function (mod) {
+  return mod && mod.__esModule ? mod : {
+    "default": mod
+  };
+};
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
+var react_1 = __importDefault(require("react"));
+
+var classnames_1 = __importDefault(require("@pansy/classnames"));
+
+var Context_1 = __importDefault(require("./Context"));
+
+var utils_1 = require("../utils");
+
+var useInsertStyles_1 = require("../hooks/useInsertStyles");
+
+var Icon = react_1.default.forwardRef(function (_ref, ref) {
+  var className = _ref.className,
+      Component = _ref.component,
+      viewBox = _ref.viewBox,
+      spin = _ref.spin,
+      rotate = _ref.rotate,
+      tabIndex = _ref.tabIndex,
+      onClick = _ref.onClick,
+      children = _ref.children,
+      restProps = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+  (0, useInsertStyles_1.useInsertStyles)();
+
+  var _react_1$default$useC = react_1.default.useContext(Context_1.default),
+      _react_1$default$useC2 = _react_1$default$useC.prefixCls,
+      prefixCls = _react_1$default$useC2 === void 0 ? 'sen-icon' : _react_1$default$useC2;
+
+  var classString = (0, classnames_1.default)(prefixCls, className);
+  var svgClassString = (0, classnames_1.default)((0, _defineProperty2.default)({}, "".concat(prefixCls, "-spin"), !!spin));
+  var svgStyle = rotate ? {
+    msTransform: "rotate(".concat(rotate, "deg)"),
+    transform: "rotate(".concat(rotate, "deg)")
+  } : undefined;
+  var innerSvgProps = (0, _objectSpread2.default)((0, _objectSpread2.default)({}, utils_1.svgBaseProps), {}, {
+    className: svgClassString,
+    style: svgStyle,
+    viewBox: viewBox
+  });
+
+  if (!viewBox) {
+    delete innerSvgProps.viewBox;
+  } // component > children
+
+
+  var renderInnerNode = function renderInnerNode() {
+    if (Component) {
+      return /*#__PURE__*/_react.default.createElement(Component, innerSvgProps, children);
+    }
+
+    if (children) {
+      return /*#__PURE__*/_react.default.createElement("svg", (0, _extends2.default)({}, innerSvgProps, {
+        viewBox: viewBox
+      }), children);
+    }
+
+    return null;
+  };
+
+  var iconTabIndex = tabIndex;
+
+  if (iconTabIndex === undefined && onClick) {
+    iconTabIndex = -1;
+  }
+
+  return /*#__PURE__*/_react.default.createElement("span", (0, _extends2.default)({
+    role: "img"
+  }, restProps, {
+    ref: ref,
+    tabIndex: iconTabIndex,
+    onClick: onClick,
+    className: classString
+  }), renderInnerNode());
+});
+Icon.displayName = 'SenIcon';
+exports.default = Icon;

package/lib/components/IconBase.js

@@ -0,0 +1,81 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+
+var _excluded = ["icon", "className", "onClick", "style", "primaryColor", "secondaryColor"];
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
+var useInsertStyles_1 = require("../hooks/useInsertStyles");
+
+var utils_1 = require("../utils");
+
+var twoToneColorPalette = {
+  primaryColor: '#333',
+  secondaryColor: '#E6E6E6',
+  calculated: false
+};
+
+function setTwoToneColors(_ref) {
+  var primaryColor = _ref.primaryColor,
+      secondaryColor = _ref.secondaryColor;
+  twoToneColorPalette.primaryColor = primaryColor;
+  twoToneColorPalette.secondaryColor = secondaryColor || (0, utils_1.getSecondaryColor)(primaryColor);
+  twoToneColorPalette.calculated = !!secondaryColor;
+}
+
+function getTwoToneColors() {
+  return (0, _objectSpread2.default)({}, twoToneColorPalette);
+}
+
+var IconBase = function IconBase(_ref2) {
+  var icon = _ref2.icon,
+      className = _ref2.className,
+      onClick = _ref2.onClick,
+      style = _ref2.style,
+      primaryColor = _ref2.primaryColor,
+      secondaryColor = _ref2.secondaryColor,
+      restProps = (0, _objectWithoutProperties2.default)(_ref2, _excluded);
+  (0, useInsertStyles_1.useInsertStyles)();
+  var colors = twoToneColorPalette;
+
+  if (primaryColor) {
+    colors = {
+      primaryColor: primaryColor,
+      secondaryColor: secondaryColor || (0, utils_1.getSecondaryColor)(primaryColor)
+    };
+  }
+
+  if (!(0, utils_1.isIconDefinition)(icon)) {
+    return null;
+  }
+
+  var target = icon;
+
+  if (target && typeof target.icon === 'function') {
+    target = (0, _objectSpread2.default)((0, _objectSpread2.default)({}, target), {}, {
+      icon: target.icon(colors.primaryColor, colors.secondaryColor)
+    });
+  }
+
+  return (0, utils_1.generate)(target.icon, "svg-".concat(target.name), (0, _objectSpread2.default)({
+    className: className,
+    onClick: onClick,
+    style: style,
+    'data-icon': target.name,
+    width: '1em',
+    height: '1em',
+    fill: 'currentColor',
+    'aria-hidden': 'true'
+  }, restProps));
+};
+
+IconBase.displayName = 'IconReact';
+IconBase.getTwoToneColors = getTwoToneColors;
+IconBase.setTwoToneColors = setTwoToneColors;
+exports.default = IconBase;

package/lib/components/IconFont.js

@@ -0,0 +1,103 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _excluded = ["type", "children"];
+
+var __importDefault = void 0 && (void 0).__importDefault || function (mod) {
+  return mod && mod.__esModule ? mod : {
+    "default": mod
+  };
+};
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
+var react_1 = __importDefault(require("react"));
+
+var Icon_1 = __importDefault(require("./Icon"));
+
+var customCache = new Set();
+
+function isValidCustomScriptUrl(scriptUrl) {
+  return Boolean(typeof scriptUrl === 'string' && scriptUrl.length && !customCache.has(scriptUrl));
+}
+
+function createScriptUrlElements(scriptUrls) {
+  var index = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
+  var currentScriptUrl = scriptUrls[index];
+
+  if (isValidCustomScriptUrl(currentScriptUrl)) {
+    var script = document.createElement('script');
+    script.setAttribute('src', currentScriptUrl);
+    script.setAttribute('data-namespace', currentScriptUrl);
+
+    if (scriptUrls.length > index + 1) {
+      script.onload = function () {
+        createScriptUrlElements(scriptUrls, index + 1);
+      };
+
+      script.onerror = function () {
+        createScriptUrlElements(scriptUrls, index + 1);
+      };
+    }
+
+    customCache.add(currentScriptUrl);
+    document.body.appendChild(script);
+  }
+}
+
+function create() {
+  var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  var scriptUrl = options.scriptUrl,
+      _options$extraCommonP = options.extraCommonProps,
+      extraCommonProps = _options$extraCommonP === void 0 ? {} : _options$extraCommonP;
+  /**
+   * DOM API required.
+   * Make sure in browser environment.
+   * The Custom Icon will create a <script/>
+   * that loads SVG symbols and insert the SVG Element into the document body.
+   */
+
+  if (scriptUrl && typeof document !== 'undefined' && typeof window !== 'undefined' && typeof document.createElement === 'function') {
+    if (Array.isArray(scriptUrl)) {
+      // 因为iconfont资源会把svg插入before，所以前加载相同type会覆盖后加载，为了数组覆盖顺序，倒叙插入
+      createScriptUrlElements(scriptUrl.reverse());
+    } else {
+      createScriptUrlElements([scriptUrl]);
+    }
+  }
+
+  var Iconfont = react_1.default.forwardRef(function (props, ref) {
+    var type = props.type,
+        children = props.children,
+        restProps = (0, _objectWithoutProperties2.default)(props, _excluded); // children > type
+
+    var content = null;
+
+    if (props.type) {
+      content = /*#__PURE__*/_react.default.createElement("use", {
+        xlinkHref: "#".concat(type)
+      });
+    }
+
+    if (children) {
+      content = children;
+    }
+
+    return /*#__PURE__*/_react.default.createElement(Icon_1.default, (0, _extends2.default)({}, extraCommonProps, restProps, {
+      ref: ref
+    }), content);
+  });
+  Iconfont.displayName = 'Iconfont';
+  return Iconfont;
+}
+
+exports.default = create;

package/lib/components/SensoroIcon.js

@@ -0,0 +1,93 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _excluded = ["className", "icon", "spin", "rotate", "tabIndex", "onClick", "twoToneColor"];
+
+var __importDefault = void 0 && (void 0).__importDefault || function (mod) {
+  return mod && mod.__esModule ? mod : {
+    "default": mod
+  };
+};
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
+var react_1 = __importDefault(require("react"));
+
+var classnames_1 = __importDefault(require("@pansy/classnames"));
+
+var IconBase_1 = __importDefault(require("./IconBase"));
+
+var twoTonePrimaryColor_1 = require("./twoTonePrimaryColor");
+
+var utils_1 = require("../utils");
+
+var Context_1 = __importDefault(require("./Context")); // Initial setting
+// should move it to antd main repo?
+
+
+(0, twoTonePrimaryColor_1.setTwoToneColor)('#1890ff');
+var Icon = react_1.default.forwardRef(function (props, ref) {
+  var _ref;
+
+  var className = props.className,
+      icon = props.icon,
+      spin = props.spin,
+      rotate = props.rotate,
+      tabIndex = props.tabIndex,
+      onClick = props.onClick,
+      twoToneColor = props.twoToneColor,
+      restProps = (0, _objectWithoutProperties2.default)(props, _excluded);
+
+  var _react_1$default$useC = react_1.default.useContext(Context_1.default),
+      _react_1$default$useC2 = _react_1$default$useC.prefixCls,
+      prefixCls = _react_1$default$useC2 === void 0 ? 'sen-icon' : _react_1$default$useC2;
+
+  var classString = (0, classnames_1.default)(prefixCls, (_ref = {}, (0, _defineProperty2.default)(_ref, "".concat(prefixCls, "-").concat(icon.name), !!icon.name), (0, _defineProperty2.default)(_ref, "".concat(prefixCls, "-spin"), !!spin || icon.name === 'loading'), _ref), className);
+  var iconTabIndex = tabIndex;
+
+  if (iconTabIndex === undefined && onClick) {
+    iconTabIndex = -1;
+  }
+
+  var svgStyle = rotate ? {
+    msTransform: "rotate(".concat(rotate, "deg)"),
+    transform: "rotate(".concat(rotate, "deg)")
+  } : undefined;
+
+  var _ref2 = (0, utils_1.normalizeTwoToneColors)(twoToneColor),
+      _ref3 = (0, _slicedToArray2.default)(_ref2, 2),
+      primaryColor = _ref3[0],
+      secondaryColor = _ref3[1];
+
+  return /*#__PURE__*/_react.default.createElement("span", (0, _extends2.default)({
+    role: "img",
+    "aria-label": icon.name
+  }, restProps, {
+    ref: ref,
+    tabIndex: iconTabIndex,
+    onClick: onClick,
+    className: classString
+  }), /*#__PURE__*/_react.default.createElement(IconBase_1.default, {
+    icon: icon,
+    primaryColor: primaryColor,
+    secondaryColor: secondaryColor,
+    style: svgStyle
+  }));
+});
+Icon.displayName = 'AntdIcon';
+Icon.getTwoToneColor = twoTonePrimaryColor_1.getTwoToneColor;
+Icon.setTwoToneColor = twoTonePrimaryColor_1.setTwoToneColor;
+exports.default = Icon;

package/lib/components/twoTonePrimaryColor.js

@@ -1,24 +1,46 @@
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
+var __importDefault = void 0 && (void 0).__importDefault || function (mod) {
+  return mod && mod.__esModule ? mod : {
+    "default": mod
+  };
 };
-Object.defineProperty(exports, "__esModule", { value: true });
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
 exports.getTwoToneColor = exports.setTwoToneColor = void 0;
+
 var IconBase_1 = __importDefault(require("./IconBase"));
+
 var utils_1 = require("../utils");
+
 function setTwoToneColor(twoToneColor) {
-    var _a = (0, utils_1.normalizeTwoToneColors)(twoToneColor), primaryColor = _a[0], secondaryColor = _a[1];
-    return IconBase_1.default.setTwoToneColors({
-        primaryColor: primaryColor,
-        secondaryColor: secondaryColor,
-    });
+  var _ref = (0, utils_1.normalizeTwoToneColors)(twoToneColor),
+      _ref2 = (0, _slicedToArray2.default)(_ref, 2),
+      primaryColor = _ref2[0],
+      secondaryColor = _ref2[1];
+
+  return IconBase_1.default.setTwoToneColors({
+    primaryColor: primaryColor,
+    secondaryColor: secondaryColor
+  });
 }
+
 exports.setTwoToneColor = setTwoToneColor;
+
 function getTwoToneColor() {
-    var colors = IconBase_1.default.getTwoToneColors();
-    if (!colors.calculated) {
-        return colors.primaryColor;
-    }
-    return [colors.primaryColor, colors.secondaryColor];
+  var colors = IconBase_1.default.getTwoToneColors();
+
+  if (!colors.calculated) {
+    return colors.primaryColor;
+  }
+
+  return [colors.primaryColor, colors.secondaryColor];
 }
-exports.getTwoToneColor = getTwoToneColor;
+
+exports.getTwoToneColor = getTwoToneColor;