@aloudata/aloudata-design 0.3.0-beta.1 → 0.3.0

package/lib/Icon/icons/IconBase.withSpan.tpl

@@ -0,0 +1,58 @@
+import React, { useEffect, useRef } from 'react';
+interface IconProps extends React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement> {
+    size?: string | number;
+    width?: string | number;
+    height?: string | number;
+    spin?: boolean;
+    rtl?: boolean;
+    color?: string;
+    fill?: string;
+    stroke?: string;
+}
+
+export default function <%-PascalIconName%>(props: IconProps) {
+    const root = useRef<SVGSVGElement>(null)
+    const { size = '1em', width, height, spin, rtl, color, fill, stroke, className, ...rest } = props;
+    const _width = width || size;
+    const _height = height || size;
+    const _stroke = stroke || color;
+    const _fill = fill || color;
+    useEffect(() => {
+      if (!_fill) {
+        (root.current as SVGSVGElement)?.querySelectorAll('[data-follow-fill]').forEach(item => {
+          item.setAttribute('fill', item.getAttribute('data-follow-fill') || '')
+        })
+      }
+      if (!_stroke) {
+        (root.current as SVGSVGElement)?.querySelectorAll('[data-follow-stroke]').forEach(item => {
+          item.setAttribute('stroke', item.getAttribute('data-follow-stroke') || '')
+        })
+      }
+    }, [stroke, color, fill])
+    const cls = [
+      'i-icon',
+      'i-icon-<%-iconCompKebabName%>',
+      spin ? 'i-icon-spin' : '',
+      rtl ? 'i-icon-rtl' : '',
+      className,
+    ].filter(Boolean)
+    return (
+      <span
+        {...rest}
+        className={cls.join(' ')}
+      >
+        <svg
+          ref={root}
+          width={_width} 
+          height={_height}
+          viewBox="<%-iconViewBox%>"
+          preserveAspectRatio="xMidYMid meet"
+          fill="<%-iconFill%>"
+          role="presentation"
+          xmlns="http://www.w3.org/2000/svg"
+        >
+          <%-iconSourceTpl%>
+        </svg>
+      </span>
+    )
+}

package/lib/Icon/icons/LightningLine.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+interface IconProps extends React.SVGProps<SVGSVGElement> {
+    size?: string | number;
+    width?: string | number;
+    height?: string | number;
+    spin?: boolean;
+    rtl?: boolean;
+    color?: string;
+    fill?: string;
+    stroke?: string;
+}
+export default function LightningLine(props: IconProps): JSX.Element;
+export {};

package/lib/Icon/icons/LightningLine.js

@@ -0,0 +1,83 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = LightningLine;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _style = _interopRequireDefault(require("./style.css"));
+
+var _excluded = ["size", "width", "height", "spin", "rtl", "color", "fill", "stroke", "className"];
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
+function LightningLine(props) {
+  var root = (0, _react.useRef)(null);
+
+  var _props$size = props.size,
+      size = _props$size === void 0 ? '1em' : _props$size,
+      width = props.width,
+      height = props.height,
+      spin = props.spin,
+      rtl = props.rtl,
+      color = props.color,
+      fill = props.fill,
+      stroke = props.stroke,
+      className = props.className,
+      rest = _objectWithoutProperties(props, _excluded);
+
+  var _width = width || size;
+
+  var _height = height || size;
+
+  var _stroke = stroke || color;
+
+  var _fill = fill || color;
+
+  (0, _react.useEffect)(function () {
+    if (!_fill) {
+      var _root$current;
+
+      (_root$current = root.current) === null || _root$current === void 0 ? void 0 : _root$current.querySelectorAll('[data-follow-fill]').forEach(function (item) {
+        item.setAttribute('fill', item.getAttribute('data-follow-fill') || '');
+      });
+    }
+
+    if (!_stroke) {
+      var _root$current2;
+
+      (_root$current2 = root.current) === null || _root$current2 === void 0 ? void 0 : _root$current2.querySelectorAll('[data-follow-stroke]').forEach(function (item) {
+        item.setAttribute('stroke', item.getAttribute('data-follow-stroke') || '');
+      });
+    }
+  }, [stroke, color, fill]);
+  return /*#__PURE__*/_react.default.createElement("svg", Object.assign({
+    ref: root,
+    width: _width,
+    height: _height,
+    viewBox: "0 0 24 24",
+    preserveAspectRatio: "xMidYMid meet",
+    fill: "none",
+    role: "presentation",
+    xmlns: "http://www.w3.org/2000/svg",
+    className: "".concat(className || '', " ").concat(spin ? _style.default.spin : '', " ").concat(rtl ? _style.default.rtl : '').trim()
+  }, rest), /*#__PURE__*/_react.default.createElement("g", null, /*#__PURE__*/_react.default.createElement("path", {
+    "data-follow-fill": "#001A33",
+    d: "M8.614 1.536A1 1 0 0 1 9.5 1h9a1 1 0 0 1 .786 1.618L15.057 8H20.5a1 1 0 0 1 .735 1.678l-12 13a1 1 0 0 1-1.702-.933l2.17-8.245H4a1 1 0 0 1-.886-1.464l5.5-10.5ZM10.105 3l-4.452 8.5H11a1 1 0 0 1 .967 1.255L10.49 18.37 18.216 10H13a1 1 0 0 1-.786-1.618L16.442 3h-6.337Z",
+    clipRule: "evenodd",
+    fillRule: "evenodd",
+    fill: _fill
+  })));
+}

package/lib/Icon/icons/Loading.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+interface IconProps extends React.SVGProps<SVGSVGElement> {
+    size?: string | number;
+    width?: string | number;
+    height?: string | number;
+    spin?: boolean;
+    rtl?: boolean;
+    color?: string;
+    fill?: string;
+    stroke?: string;
+}
+export default function Loading(props: IconProps): JSX.Element;
+export {};

package/lib/Icon/icons/Loading.js

@@ -0,0 +1,83 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = Loading;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _style = _interopRequireDefault(require("./style.css"));
+
+var _excluded = ["size", "width", "height", "spin", "rtl", "color", "fill", "stroke", "className"];
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
+function Loading(props) {
+  var root = (0, _react.useRef)(null);
+
+  var _props$size = props.size,
+      size = _props$size === void 0 ? '1em' : _props$size,
+      width = props.width,
+      height = props.height,
+      spin = props.spin,
+      rtl = props.rtl,
+      color = props.color,
+      fill = props.fill,
+      stroke = props.stroke,
+      className = props.className,
+      rest = _objectWithoutProperties(props, _excluded);
+
+  var _width = width || size;
+
+  var _height = height || size;
+
+  var _stroke = stroke || color;
+
+  var _fill = fill || color;
+
+  (0, _react.useEffect)(function () {
+    if (!_fill) {
+      var _root$current;
+
+      (_root$current = root.current) === null || _root$current === void 0 ? void 0 : _root$current.querySelectorAll('[data-follow-fill]').forEach(function (item) {
+        item.setAttribute('fill', item.getAttribute('data-follow-fill') || '');
+      });
+    }
+
+    if (!_stroke) {
+      var _root$current2;
+
+      (_root$current2 = root.current) === null || _root$current2 === void 0 ? void 0 : _root$current2.querySelectorAll('[data-follow-stroke]').forEach(function (item) {
+        item.setAttribute('stroke', item.getAttribute('data-follow-stroke') || '');
+      });
+    }
+  }, [stroke, color, fill]);
+  return /*#__PURE__*/_react.default.createElement("svg", Object.assign({
+    ref: root,
+    width: _width,
+    height: _height,
+    viewBox: "0 0 24 24",
+    preserveAspectRatio: "xMidYMid meet",
+    fill: "none",
+    role: "presentation",
+    xmlns: "http://www.w3.org/2000/svg",
+    className: "".concat(className || '', " ").concat(spin ? _style.default.spin : '', " ").concat(rtl ? _style.default.rtl : '').trim()
+  }, rest), /*#__PURE__*/_react.default.createElement("g", null, /*#__PURE__*/_react.default.createElement("path", {
+    "data-follow-fill": "#001A33",
+    d: "M12 .509a1 1 0 0 1 1 1v4.285a1 1 0 1 1-2 0V1.51a1 1 0 0 1 1-1ZM2.692 5.118a1 1 0 0 1 1.413-.06l3.154 2.897a1 1 0 0 1-1.353 1.473L2.752 6.53a1 1 0 0 1-.06-1.413Zm3.52 9.5a1 1 0 0 0-.698-1.875l-4.148 1.543a1 1 0 1 0 .697 1.874l4.148-1.543Zm3.66 3.137a1 1 0 0 1 .453 1.34l-1.903 3.84a1 1 0 1 1-1.792-.888l1.903-3.84a1 1 0 0 1 1.34-.452ZM21.249 6.531a1 1 0 0 0-1.353-1.473l-3.154 2.897a1 1 0 1 0 1.353 1.473l3.154-2.897Zm-4.048 6.8a1 1 0 0 1 1.286-.588l4.148 1.543a1 1 0 1 1-.697 1.874l-4.149-1.543a1 1 0 0 1-.588-1.286Zm-1.733 4.876a1 1 0 0 0-1.792.888l1.903 3.84a1 1 0 1 0 1.792-.888l-1.903-3.84Z",
+    clipRule: "evenodd",
+    fillRule: "evenodd",
+    fill: _fill
+  })));
+}

package/lib/Icon/icons/More.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+interface IconProps extends React.SVGProps<SVGSVGElement> {
+    size?: string | number;
+    width?: string | number;
+    height?: string | number;
+    spin?: boolean;
+    rtl?: boolean;
+    color?: string;
+    fill?: string;
+    stroke?: string;
+}
+export default function More(props: IconProps): JSX.Element;
+export {};

package/lib/Icon/icons/More.js

@@ -0,0 +1,83 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = More;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _style = _interopRequireDefault(require("./style.css"));
+
+var _excluded = ["size", "width", "height", "spin", "rtl", "color", "fill", "stroke", "className"];
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
+function More(props) {
+  var root = (0, _react.useRef)(null);
+
+  var _props$size = props.size,
+      size = _props$size === void 0 ? '1em' : _props$size,
+      width = props.width,
+      height = props.height,
+      spin = props.spin,
+      rtl = props.rtl,
+      color = props.color,
+      fill = props.fill,
+      stroke = props.stroke,
+      className = props.className,
+      rest = _objectWithoutProperties(props, _excluded);
+
+  var _width = width || size;
+
+  var _height = height || size;
+
+  var _stroke = stroke || color;
+
+  var _fill = fill || color;
+
+  (0, _react.useEffect)(function () {
+    if (!_fill) {
+      var _root$current;
+
+      (_root$current = root.current) === null || _root$current === void 0 ? void 0 : _root$current.querySelectorAll('[data-follow-fill]').forEach(function (item) {
+        item.setAttribute('fill', item.getAttribute('data-follow-fill') || '');
+      });
+    }
+
+    if (!_stroke) {
+      var _root$current2;
+
+      (_root$current2 = root.current) === null || _root$current2 === void 0 ? void 0 : _root$current2.querySelectorAll('[data-follow-stroke]').forEach(function (item) {
+        item.setAttribute('stroke', item.getAttribute('data-follow-stroke') || '');
+      });
+    }
+  }, [stroke, color, fill]);
+  return /*#__PURE__*/_react.default.createElement("svg", Object.assign({
+    ref: root,
+    width: _width,
+    height: _height,
+    viewBox: "0 0 24 24",
+    preserveAspectRatio: "xMidYMid meet",
+    fill: "none",
+    role: "presentation",
+    xmlns: "http://www.w3.org/2000/svg",
+    className: "".concat(className || '', " ").concat(spin ? _style.default.spin : '', " ").concat(rtl ? _style.default.rtl : '').trim()
+  }, rest), /*#__PURE__*/_react.default.createElement("g", null, /*#__PURE__*/_react.default.createElement("path", {
+    "data-follow-fill": "#001A33",
+    d: "M14 3a2 2 0 1 1-4 0 2 2 0 0 1 4 0Zm0 9a2 2 0 1 1-4 0 2 2 0 0 1 4 0Zm-2 11a2 2 0 1 0 0-4 2 2 0 0 0 0 4Z",
+    clipRule: "evenodd",
+    fillRule: "evenodd",
+    fill: _fill
+  })));
+}

package/lib/Icon/icons/NewWindowsLine.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+interface IconProps extends React.SVGProps<SVGSVGElement> {
+    size?: string | number;
+    width?: string | number;
+    height?: string | number;
+    spin?: boolean;
+    rtl?: boolean;
+    color?: string;
+    fill?: string;
+    stroke?: string;
+}
+export default function NewWindowsLine(props: IconProps): JSX.Element;
+export {};

package/lib/Icon/icons/NewWindowsLine.js

@@ -0,0 +1,91 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = NewWindowsLine;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _style = _interopRequireDefault(require("./style.css"));
+
+var _excluded = ["size", "width", "height", "spin", "rtl", "color", "fill", "stroke", "className"];
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
+function NewWindowsLine(props) {
+  var root = (0, _react.useRef)(null);
+
+  var _props$size = props.size,
+      size = _props$size === void 0 ? '1em' : _props$size,
+      width = props.width,
+      height = props.height,
+      spin = props.spin,
+      rtl = props.rtl,
+      color = props.color,
+      fill = props.fill,
+      stroke = props.stroke,
+      className = props.className,
+      rest = _objectWithoutProperties(props, _excluded);
+
+  var _width = width || size;
+
+  var _height = height || size;
+
+  var _stroke = stroke || color;
+
+  var _fill = fill || color;
+
+  (0, _react.useEffect)(function () {
+    if (!_fill) {
+      var _root$current;
+
+      (_root$current = root.current) === null || _root$current === void 0 ? void 0 : _root$current.querySelectorAll('[data-follow-fill]').forEach(function (item) {
+        item.setAttribute('fill', item.getAttribute('data-follow-fill') || '');
+      });
+    }
+
+    if (!_stroke) {
+      var _root$current2;
+
+      (_root$current2 = root.current) === null || _root$current2 === void 0 ? void 0 : _root$current2.querySelectorAll('[data-follow-stroke]').forEach(function (item) {
+        item.setAttribute('stroke', item.getAttribute('data-follow-stroke') || '');
+      });
+    }
+  }, [stroke, color, fill]);
+  return /*#__PURE__*/_react.default.createElement("svg", Object.assign({
+    ref: root,
+    width: _width,
+    height: _height,
+    viewBox: "0 0 24 24",
+    preserveAspectRatio: "xMidYMid meet",
+    fill: "none",
+    role: "presentation",
+    xmlns: "http://www.w3.org/2000/svg",
+    className: "".concat(className || '', " ").concat(spin ? _style.default.spin : '', " ").concat(rtl ? _style.default.rtl : '').trim()
+  }, rest), /*#__PURE__*/_react.default.createElement("g", null, /*#__PURE__*/_react.default.createElement("path", {
+    "data-follow-fill": "#001A33",
+    d: "M18.71 5.295a.995.995 0 0 1 .29.702V11a1 1 0 1 1-2 0V8.414l-5.293 5.293a1 1 0 0 1-1.414-1.414L15.586 7H13a1 1 0 1 1 0-2h5a1 1 0 0 1 .705.29l.004.005Z",
+    fill: _fill
+  }), /*#__PURE__*/_react.default.createElement("path", {
+    "data-follow-fill": "#001A33",
+    d: "M24 16.3a2.7 2.7 0 0 1-2.7 2.7H7.7A2.7 2.7 0 0 1 5 16.3V2.7A2.7 2.7 0 0 1 7.7 0h13.6A2.7 2.7 0 0 1 24 2.7v13.6Zm-2.7.7a.7.7 0 0 0 .7-.7V2.7a.7.7 0 0 0-.7-.7H7.7a.7.7 0 0 0-.7.7v13.6a.7.7 0 0 0 .7.7h13.6Z",
+    clipRule: "evenodd",
+    fillRule: "evenodd",
+    fill: _fill
+  }), /*#__PURE__*/_react.default.createElement("path", {
+    "data-follow-fill": "#001A33",
+    d: "M1 5a1 1 0 0 1 1 1v15.3a.7.7 0 0 0 .7.7H18a1 1 0 1 1 0 2H2.7A2.7 2.7 0 0 1 0 21.3V6a1 1 0 0 1 1-1Z",
+    fill: _fill
+  })));
+}

package/lib/Icon/icons/SearchLine.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+interface IconProps extends React.SVGProps<SVGSVGElement> {
+    size?: string | number;
+    width?: string | number;
+    height?: string | number;
+    spin?: boolean;
+    rtl?: boolean;
+    color?: string;
+    fill?: string;
+    stroke?: string;
+}
+export default function SearchLine(props: IconProps): JSX.Element;
+export {};

package/lib/Icon/icons/SearchLine.js

@@ -0,0 +1,90 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = SearchLine;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _style = _interopRequireDefault(require("./style.css"));
+
+var _excluded = ["size", "width", "height", "spin", "rtl", "color", "fill", "stroke", "className"];
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
+function SearchLine(props) {
+  var root = (0, _react.useRef)(null);
+
+  var _props$size = props.size,
+      size = _props$size === void 0 ? '1em' : _props$size,
+      width = props.width,
+      height = props.height,
+      spin = props.spin,
+      rtl = props.rtl,
+      color = props.color,
+      fill = props.fill,
+      stroke = props.stroke,
+      className = props.className,
+      rest = _objectWithoutProperties(props, _excluded);
+
+  var _width = width || size;
+
+  var _height = height || size;
+
+  var _stroke = stroke || color;
+
+  var _fill = fill || color;
+
+  (0, _react.useEffect)(function () {
+    if (!_fill) {
+      var _root$current;
+
+      (_root$current = root.current) === null || _root$current === void 0 ? void 0 : _root$current.querySelectorAll('[data-follow-fill]').forEach(function (item) {
+        item.setAttribute('fill', item.getAttribute('data-follow-fill') || '');
+      });
+    }
+
+    if (!_stroke) {
+      var _root$current2;
+
+      (_root$current2 = root.current) === null || _root$current2 === void 0 ? void 0 : _root$current2.querySelectorAll('[data-follow-stroke]').forEach(function (item) {
+        item.setAttribute('stroke', item.getAttribute('data-follow-stroke') || '');
+      });
+    }
+  }, [stroke, color, fill]);
+  return /*#__PURE__*/_react.default.createElement("svg", Object.assign({
+    ref: root,
+    width: _width,
+    height: _height,
+    viewBox: "0 0 24 24",
+    preserveAspectRatio: "xMidYMid meet",
+    fill: "none",
+    role: "presentation",
+    xmlns: "http://www.w3.org/2000/svg",
+    className: "".concat(className || '', " ").concat(spin ? _style.default.spin : '', " ").concat(rtl ? _style.default.rtl : '').trim()
+  }, rest), /*#__PURE__*/_react.default.createElement("g", null, /*#__PURE__*/_react.default.createElement("g", {
+    clipPath: "url(#56044__a)"
+  }, /*#__PURE__*/_react.default.createElement("path", {
+    "data-follow-fill": "#001A33",
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M2 10a8 8 0 1 1 16 0 8 8 0 0 1-16 0Zm8-10C4.477 0 0 4.477 0 10s4.477 10 10 10a9.959 9.959 0 0 0 6.329-2.257l5.964 5.964a1 1 0 1 0 1.414-1.414l-5.964-5.964A9.959 9.959 0 0 0 20 10c0-5.523-4.477-10-10-10Z",
+    fill: _fill
+  })), /*#__PURE__*/_react.default.createElement("defs", null, /*#__PURE__*/_react.default.createElement("clipPath", {
+    id: "56044__a"
+  }, /*#__PURE__*/_react.default.createElement("path", {
+    d: "M0 0h24v24H0z",
+    fill: "#fff"
+  })))));
+}

package/lib/Icon/icons/SortAscendingLine.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+interface IconProps extends React.SVGProps<SVGSVGElement> {
+    size?: string | number;
+    width?: string | number;
+    height?: string | number;
+    spin?: boolean;
+    rtl?: boolean;
+    color?: string;
+    fill?: string;
+    stroke?: string;
+}
+export default function SortAscendingLine(props: IconProps): JSX.Element;
+export {};