Merge pull request #87 from AElf-devops/feat/icons-nav

add direction Category icons

packages/component/src/icon/index.md → docs/icon.md

@@ -1,5 +1,5 @@
 ---
-nav: Components
+nav: icons
 group:
   title: Display
   order: 3

packages/internal-icons/src/components/direction/BacktopOutlined.tsx

@@ -0,0 +1,13 @@
+import * as React from 'react';
+
+import { AelfIcon } from '../../icon/AelfIcon';
+import AelfSVGComponent from '../../svgs/direction/backtop.svg';
+import { IconProps } from '../../type';
+
+const componentName = 'BacktopOutlined';
+export const BacktopOutlined = React.forwardRef<HTMLSpanElement, IconProps>((props, ref) => {
+  return (
+    <AelfIcon component={AelfSVGComponent} componentName={componentName} ref={ref} {...props} />
+  );
+});
+BacktopOutlined.displayName = componentName;

packages/internal-icons/src/components/direction/DownArrowOutlined.tsx

@@ -0,0 +1,13 @@
+import * as React from 'react';
+
+import { AelfIcon } from '../../icon/AelfIcon';
+import AelfSVGComponent from '../../svgs/direction/down-arrow.svg';
+import { IconProps } from '../../type';
+
+const componentName = 'DownArrowOutlined';
+export const DownArrowOutlined = React.forwardRef<HTMLSpanElement, IconProps>((props, ref) => {
+  return (
+    <AelfIcon component={AelfSVGComponent} componentName={componentName} ref={ref} {...props} />
+  );
+});
+DownArrowOutlined.displayName = componentName;

packages/internal-icons/src/components/direction/DownDoubleOutlined.tsx

@@ -0,0 +1,13 @@
+import * as React from 'react';
+
+import { AelfIcon } from '../../icon/AelfIcon';
+import AelfSVGComponent from '../../svgs/direction/down-double.svg';
+import { IconProps } from '../../type';
+
+const componentName = 'DownDoubleOutlined';
+export const DownDoubleOutlined = React.forwardRef<HTMLSpanElement, IconProps>((props, ref) => {
+  return (
+    <AelfIcon component={AelfSVGComponent} componentName={componentName} ref={ref} {...props} />
+  );
+});
+DownDoubleOutlined.displayName = componentName;

packages/internal-icons/src/components/direction/DownOutlined.tsx

@@ -0,0 +1,13 @@
+import * as React from 'react';
+
+import { AelfIcon } from '../../icon/AelfIcon';
+import AelfSVGComponent from '../../svgs/direction/down.svg';
+import { IconProps } from '../../type';
+
+const componentName = 'DownOutlined';
+export const DownOutlined = React.forwardRef<HTMLSpanElement, IconProps>((props, ref) => {
+  return (
+    <AelfIcon component={AelfSVGComponent} componentName={componentName} ref={ref} {...props} />
+  );
+});
+DownOutlined.displayName = componentName;

packages/internal-icons/src/components/direction/FullscreenOutlined.tsx

@@ -0,0 +1,13 @@
+import * as React from 'react';
+
+import { AelfIcon } from '../../icon/AelfIcon';
+import AelfSVGComponent from '../../svgs/direction/fullscreen.svg';
+import { IconProps } from '../../type';
+
+const componentName = 'FullscreenOutlined';
+export const FullscreenOutlined = React.forwardRef<HTMLSpanElement, IconProps>((props, ref) => {
+  return (
+    <AelfIcon component={AelfSVGComponent} componentName={componentName} ref={ref} {...props} />
+  );
+});
+FullscreenOutlined.displayName = componentName;

packages/internal-icons/src/components/direction/FullsreenExitOutlined.tsx

@@ -0,0 +1,13 @@
+import * as React from 'react';
+
+import { AelfIcon } from '../../icon/AelfIcon';
+import AelfSVGComponent from '../../svgs/direction/fullsreen-exit.svg';
+import { IconProps } from '../../type';
+
+const componentName = 'FullsreenExitOutlined';
+export const FullsreenExitOutlined = React.forwardRef<HTMLSpanElement, IconProps>((props, ref) => {
+  return (
+    <AelfIcon component={AelfSVGComponent} componentName={componentName} ref={ref} {...props} />
+  );
+});
+FullsreenExitOutlined.displayName = componentName;

packages/internal-icons/src/components/direction/LeftArrowOutlined.tsx

@@ -0,0 +1,13 @@
+import * as React from 'react';
+
+import { AelfIcon } from '../../icon/AelfIcon';
+import AelfSVGComponent from '../../svgs/direction/left-arrow.svg';
+import { IconProps } from '../../type';
+
+const componentName = 'LeftArrowOutlined';
+export const LeftArrowOutlined = React.forwardRef<HTMLSpanElement, IconProps>((props, ref) => {
+  return (
+    <AelfIcon component={AelfSVGComponent} componentName={componentName} ref={ref} {...props} />
+  );
+});
+LeftArrowOutlined.displayName = componentName;

packages/internal-icons/src/components/direction/LeftOutlined.tsx

@@ -1,6 +1,13 @@
-<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <path
-    d="M10.5462 16.0006L20.5966 26.051C20.7528 26.2072 20.7528 26.4604 20.5966 26.6166L19.1823 28.0309C19.0261 28.1871 18.7729 28.1871 18.6167 28.0309L7.29289 16.7071C6.90237 16.3166 6.90237 15.6834 7.29289 15.2929L18.618 3.96896C18.7742 3.81275 19.0275 3.81275 19.1837 3.96896L20.5979 5.38318C20.7541 5.53939 20.7541 5.79265 20.5979 5.94886L10.5462 16.0006Z"
-    fill="#101114"
-  />
-</svg>;
+import * as React from 'react';
+
+import { AelfIcon } from '../../icon/AelfIcon';
+import AelfSVGComponent from '../../svgs/direction/left.svg';
+import { IconProps } from '../../type';
+
+const componentName = 'LeftOutlined';
+export const LeftOutlined = React.forwardRef<HTMLSpanElement, IconProps>((props, ref) => {
+  return (
+    <AelfIcon component={AelfSVGComponent} componentName={componentName} ref={ref} {...props} />
+  );
+});
+LeftOutlined.displayName = componentName;

packages/internal-icons/src/components/direction/MenuFoldOutlined.tsx

@@ -0,0 +1,13 @@
+import * as React from 'react';
+
+import { AelfIcon } from '../../icon/AelfIcon';
+import AelfSVGComponent from '../../svgs/direction/menu-fold.svg';
+import { IconProps } from '../../type';
+
+const componentName = 'MenuFoldOutlined';
+export const MenuFoldOutlined = React.forwardRef<HTMLSpanElement, IconProps>((props, ref) => {
+  return (
+    <AelfIcon component={AelfSVGComponent} componentName={componentName} ref={ref} {...props} />
+  );
+});
+MenuFoldOutlined.displayName = componentName;

packages/internal-icons/src/components/direction/MenuUnfoldOutlined.tsx

@@ -0,0 +1,13 @@
+import * as React from 'react';
+
+import { AelfIcon } from '../../icon/AelfIcon';
+import AelfSVGComponent from '../../svgs/direction/menu-unfold.svg';
+import { IconProps } from '../../type';
+
+const componentName = 'MenuUnfoldOutlined';
+export const MenuUnfoldOutlined = React.forwardRef<HTMLSpanElement, IconProps>((props, ref) => {
+  return (
+    <AelfIcon component={AelfSVGComponent} componentName={componentName} ref={ref} {...props} />
+  );
+});
+MenuUnfoldOutlined.displayName = componentName;

packages/internal-icons/src/components/direction/RightArrowOutlined.tsx

@@ -0,0 +1,13 @@
+import * as React from 'react';
+
+import { AelfIcon } from '../../icon/AelfIcon';
+import AelfSVGComponent from '../../svgs/direction/right-arrow.svg';
+import { IconProps } from '../../type';
+
+const componentName = 'RightArrowOutlined';
+export const RightArrowOutlined = React.forwardRef<HTMLSpanElement, IconProps>((props, ref) => {
+  return (
+    <AelfIcon component={AelfSVGComponent} componentName={componentName} ref={ref} {...props} />
+  );
+});
+RightArrowOutlined.displayName = componentName;

packages/internal-icons/src/components/direction/RollBackOutlined.tsx

@@ -0,0 +1,13 @@
+import * as React from 'react';
+
+import { AelfIcon } from '../../icon/AelfIcon';
+import AelfSVGComponent from '../../svgs/direction/roll-back.svg';
+import { IconProps } from '../../type';
+
+const componentName = 'RollBackOutlined';
+export const RollBackOutlined = React.forwardRef<HTMLSpanElement, IconProps>((props, ref) => {
+  return (
+    <AelfIcon component={AelfSVGComponent} componentName={componentName} ref={ref} {...props} />
+  );
+});
+RollBackOutlined.displayName = componentName;

packages/internal-icons/src/components/direction/RotateLeftOutlined.tsx

@@ -0,0 +1,13 @@
+import * as React from 'react';
+
+import { AelfIcon } from '../../icon/AelfIcon';
+import AelfSVGComponent from '../../svgs/direction/rotate-left.svg';
+import { IconProps } from '../../type';
+
+const componentName = 'RotateLeftOutlined';
+export const RotateLeftOutlined = React.forwardRef<HTMLSpanElement, IconProps>((props, ref) => {
+  return (
+    <AelfIcon component={AelfSVGComponent} componentName={componentName} ref={ref} {...props} />
+  );
+});
+RotateLeftOutlined.displayName = componentName;

packages/internal-icons/src/components/direction/SwapLeftOutlined.tsx

@@ -0,0 +1,13 @@
+import * as React from 'react';
+
+import { AelfIcon } from '../../icon/AelfIcon';
+import AelfSVGComponent from '../../svgs/direction/swap-left.svg';
+import { IconProps } from '../../type';
+
+const componentName = 'SwapLeftOutlined';
+export const SwapLeftOutlined = React.forwardRef<HTMLSpanElement, IconProps>((props, ref) => {
+  return (
+    <AelfIcon component={AelfSVGComponent} componentName={componentName} ref={ref} {...props} />
+  );
+});
+SwapLeftOutlined.displayName = componentName;

packages/internal-icons/src/components/direction/SwapOutlined.tsx

@@ -0,0 +1,13 @@
+import * as React from 'react';
+
+import { AelfIcon } from '../../icon/AelfIcon';
+import AelfSVGComponent from '../../svgs/direction/swap.svg';
+import { IconProps } from '../../type';
+
+const componentName = 'SwapOutlined';
+export const SwapOutlined = React.forwardRef<HTMLSpanElement, IconProps>((props, ref) => {
+  return (
+    <AelfIcon component={AelfSVGComponent} componentName={componentName} ref={ref} {...props} />
+  );
+});
+SwapOutlined.displayName = componentName;

packages/internal-icons/src/components/direction/SwapRightOutlined.tsx

@@ -0,0 +1,13 @@
+import * as React from 'react';
+
+import { AelfIcon } from '../../icon/AelfIcon';
+import AelfSVGComponent from '../../svgs/direction/swap-right.svg';
+import { IconProps } from '../../type';
+
+const componentName = 'SwapRightOutlined';
+export const SwapRightOutlined = React.forwardRef<HTMLSpanElement, IconProps>((props, ref) => {
+  return (
+    <AelfIcon component={AelfSVGComponent} componentName={componentName} ref={ref} {...props} />
+  );
+});
+SwapRightOutlined.displayName = componentName;

packages/internal-icons/src/components/direction/UpArrowOutlined.tsx

@@ -0,0 +1,13 @@
+import * as React from 'react';
+
+import { AelfIcon } from '../../icon/AelfIcon';
+import AelfSVGComponent from '../../svgs/direction/up-arrow.svg';
+import { IconProps } from '../../type';
+
+const componentName = 'UpArrowOutlined';
+export const UpArrowOutlined = React.forwardRef<HTMLSpanElement, IconProps>((props, ref) => {
+  return (
+    <AelfIcon component={AelfSVGComponent} componentName={componentName} ref={ref} {...props} />
+  );
+});
+UpArrowOutlined.displayName = componentName;

packages/internal-icons/src/components/direction/UpOutlined.tsx

@@ -0,0 +1,13 @@
+import * as React from 'react';
+
+import { AelfIcon } from '../../icon/AelfIcon';
+import AelfSVGComponent from '../../svgs/direction/up.svg';
+import { IconProps } from '../../type';
+
+const componentName = 'UpOutlined';
+export const UpOutlined = React.forwardRef<HTMLSpanElement, IconProps>((props, ref) => {
+  return (
+    <AelfIcon component={AelfSVGComponent} componentName={componentName} ref={ref} {...props} />
+  );
+});
+UpOutlined.displayName = componentName;

packages/internal-icons/src/components/direction/index.tsx

@@ -0,0 +1,19 @@
+export * from './BacktopOutlined';
+export * from './DownArrowOutlined';
+export * from './DownDoubleOutlined';
+export * from './DownOutlined';
+export * from './FullscreenOutlined';
+export * from './FullsreenExitOutlined';
+export * from './LeftArrowOutlined';
+export * from './LeftOutlined';
+export * from './MenuFoldOutlined';
+export * from './MenuUnfoldOutlined';
+export * from './RightArrowOutlined';
+export * from './RightOutlined';
+export * from './RollBackOutlined';
+export * from './RotateLeftOutlined';
+export * from './SwapLeftOutlined';
+export * from './SwapOutlined';
+export * from './SwapRightOutlined';
+export * from './UpArrowOutlined';
+export * from './UpOutlined';

packages/internal-icons/src/components/direction/rightOutlined.tsx

@@ -0,0 +1,13 @@
+import * as React from 'react';
+
+import { AelfIcon } from '../../icon/AelfIcon';
+import AelfSVGComponent from '../../svgs/direction/right.svg';
+import { IconProps } from '../../type';
+
+const componentName = 'RightOutlined';
+export const RightOutlined = React.forwardRef<HTMLSpanElement, IconProps>((props, ref) => {
+  return (
+    <AelfIcon component={AelfSVGComponent} componentName={componentName} ref={ref} {...props} />
+  );
+});
+RightOutlined.displayName = componentName;

packages/internal-icons/src/index.ts

@@ -16,6 +16,7 @@ export * from './components/QueryIcon';
 export * from './components/RightArrowIcon';
 export * from './components/UploadIcon';
 
+export * from './components/direction/index';
 export * from './icon/AelfIcon';
 export * from './hooks';