tntd 2.8.0-beta.3 → 3.0.0-beta.1

package/es/tntd-layout/HeaderTabs.js

@@ -1,17 +1,20 @@
-import _get from "lodash/get";
-var __rest = this && this.__rest || function (s, e) {
-  var t = {};
-  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
-  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
-  }
-  return t;
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
 };
 import React, { useState, useEffect, useRef } from 'react';
 import styled, { withTheme } from 'styled-components';
 import cn from 'classnames';
+import { get } from 'lodash';
 import Icon from '../tntd-icon';
-const TabsContainer = styled.div`
+const TabsContainer = styled.div `
   display: flex;
   flex: 1;
   overflow: hidden;
@@ -54,7 +57,7 @@ const TabsContainer = styled.div`
     // }
     // 多签页的箭头样式
     // .tnt-themeS3 & {
-    //     background: ${props => `${props.theme.blueBgColor}`}; //#1D4295;
+    //     background: ${(props) => `${props.theme.blueBgColor}`}; //#1D4295;
     //     .tnt-icon {
     //         color: rgba(255, 255, 255, .5);
     //         &[disabled] {
@@ -66,7 +69,7 @@ const TabsContainer = styled.div`
     // }
   }
 `;
-const Tabs = styled.ul`
+const Tabs = styled.ul `
   margin: 14px 0 0;
   padding: 0;
   list-style: none;
@@ -79,13 +82,13 @@ const Tabs = styled.ul`
   transition: transform 0.25s linear;
   position: absolute;
 `;
-const TabItem = styled.li`
+const TabItem = styled.li `
   position: relative;
   margin: 0;
   padding: 0 20px 0 10px;
   cursor: pointer;
   display: inline-block;
-  line-height: ${props => props.theme.size === 'large' ? '46px' : '36px'};
+  line-height: ${(props) => (props.theme.size === 'large' ? '46px' : '36px')};
   /* transition: background-color .5; */
   width: 130px;
   color: rgba(255, 255, 255, 0.6);
@@ -127,7 +130,7 @@ const TabItem = styled.li`
 
   a {
     font-size: 14px;
-    color: ${props => props.theme.headerActionsColor}; //rgba(255,255,255,.6);
+    color: ${(props) => props.theme.headerActionsColor}; //rgba(255,255,255,.6);
     text-rendering: optimizeLegibility;
     -webkit-font-smoothing: antialiased;
     -moz-osx-font-smoothing: grayscale;
@@ -142,7 +145,7 @@ const TabItem = styled.li`
     //     color: rgba(255,255,255,.8);
     // }
     // .tnt-themeS1 & {
-    //     color: ${props => props.theme.headerActionsColor};
+    //     color: ${(props) => props.theme.headerActionsColor};
     // }
   }
 
@@ -160,172 +163,133 @@ const TabItem = styled.li`
   &.active {
     background: #f1f2f5;
     border-radius: 2px 2px 0 0;
-    color: ${props => props.theme.primaryTextColor};
+    color: ${(props) => props.theme.primaryTextColor};
     font-weight: 600;
 
     a {
-      color: ${props => props.theme.primaryTextColor};
+      color: ${(props) => props.theme.primaryTextColor};
     }
   }
 `;
-export const HeaderTabs = withTheme(_a => {
-  var {
-      theme,
-      className,
-      tabs = [],
-      onTabChange,
-      onTabSelect,
-      onTabClose,
-      appListVisible,
-      orgListVisible,
-      orgAppListVisible,
-      language
-    } = _a,
-    props = __rest(_a, ["theme", "className", "tabs", "onTabChange", "onTabSelect", "onTabClose", "appListVisible", "orgListVisible", "orgAppListVisible", "language"]);
-  const [selectedKey, setSelectedKey] = useState(props.selectedKey || _get(tabs, '0.key'));
-  const [tabItems, setTabItems] = useState(tabs || []);
-  const [arrowVisible, setArrowVisible] = useState(false);
-  const [tabsPositionFlags, setTabsPositionFlags] = useState({
-    start: true,
-    end: true
-  });
-  const tabsRef = useRef();
-  const getTabsDom = () => tabsRef.current;
-  const onTabClick = (tab, index) => {
-    setSelectedKey(tab.key);
-    onTabSelect === null || onTabSelect === void 0 ? void 0 : onTabSelect(tab);
-    if (selectedKey !== tab.key) {
-      onTabChange === null || onTabChange === void 0 ? void 0 : onTabChange(tab);
-    }
-  };
-  const closeTabHandle = (tab, index, evt) => {
-    var _a, _b;
-    evt.stopPropagation();
-    const newTabItems = tabItems.filter(({
-      key
-    }) => key !== tab.key);
-    let newSelectedKey = selectedKey;
-    setTabItems(newTabItems);
-    if (tab.key === selectedKey) {
-      newSelectedKey = index === 0 ? (_a = newTabItems[0]) === null || _a === void 0 ? void 0 : _a.key : (_b = newTabItems[index - 1]) === null || _b === void 0 ? void 0 : _b.key;
-      setSelectedKey(newSelectedKey);
-    }
-    onTabClose === null || onTabClose === void 0 ? void 0 : onTabClose(tab, newTabItems, newTabItems.find(({
-      key
-    }) => key === newSelectedKey));
-  };
-  const onMoveToLeft = () => {
-    const tabsDom = getTabsDom();
-    const parentBBox = tabsDom.parentNode.getBoundingClientRect();
-    const parentWidth = parentBBox.width - 32;
-    let x = Math.abs(+tabsDom.style.transform.replace(/[^\d.-]/g, ''));
-    const index = Math.ceil(x / 130);
-    const trueX = index * 130;
-    let newX = Math.min(0, -(trueX - parentWidth));
-    tabsDom.style.transform = `translateX(${newX}px)`;
-    const width = tabItems.length * 130;
-    setTabsPositionFlags({
-      start: newX < 0,
-      end: Math.abs(newX) < width - parentWidth
-    });
-  };
-  const onMoveToRight = () => {
-    const tabsDom = getTabsDom();
-    const parentBBox = tabsDom.parentNode.getBoundingClientRect();
-    const parentWidth = parentBBox.width - 32;
-    const width = tabItems.length * 130;
-    let x = Math.abs(+tabsDom.style.transform.replace(/[^\d.-]/g, ''));
-    const index = Math.floor(x / 130);
-    const trueX = index * 130;
-    let newX = Math.max(-(width - parentWidth), -(trueX + parentWidth));
-    tabsDom.style.transform = `translateX(${newX}px)`;
-    setTabsPositionFlags({
-      start: newX < 0,
-      end: Math.abs(newX) < width - parentWidth
-    });
-  };
-  const translateTabsDom = (tabs, selectedKey) => {
-    if (!selectedKey) return;
-    const index = tabs.indexOf(tabs.find(({
-      key
-    }) => key === selectedKey));
-    if (index === -1) return;
-    const tabsDom = getTabsDom();
-    let x = -+tabsDom.style.transform.replace(/[^\d.-]/g, '');
-    const bbox = {
-      left: index * 130,
-      right: (index + 1) * 130
+export const HeaderTabs = withTheme((_a) => {
+    var { theme, className, tabs = [], onTabChange, onTabSelect, onTabClose, appListVisible, orgListVisible, orgAppListVisible, language } = _a, props = __rest(_a, ["theme", "className", "tabs", "onTabChange", "onTabSelect", "onTabClose", "appListVisible", "orgListVisible", "orgAppListVisible", "language"]);
+    const [selectedKey, setSelectedKey] = useState(props.selectedKey || get(tabs, '0.key'));
+    const [tabItems, setTabItems] = useState(tabs || []);
+    const [arrowVisible, setArrowVisible] = useState(false);
+    const [tabsPositionFlags, setTabsPositionFlags] = useState({ start: true, end: true });
+    const tabsRef = useRef();
+    const getTabsDom = () => tabsRef.current;
+    const onTabClick = (tab, index) => {
+        setSelectedKey(tab.key);
+        onTabSelect === null || onTabSelect === void 0 ? void 0 : onTabSelect(tab);
+        if (selectedKey !== tab.key) {
+            onTabChange === null || onTabChange === void 0 ? void 0 : onTabChange(tab);
+        }
     };
-    const parentBBox = tabsDom.parentNode.getBoundingClientRect();
-    const parentWidth = parentBBox.width - 36;
-    const width = tabItems.length * 130;
-    let tailX = x + parentWidth; //当前滑动窗口尾部坐标
-    let newX = -x;
-    if (bbox.left < x) {
-      newX = -bbox.left;
-    } else if (bbox.right >= tailX) {
-      newX = parentWidth - bbox.right;
-    }
-    if (newX + width < parentWidth) {
-      newX = -(width - parentWidth);
-    }
-    newX = Math.min(0, newX);
-    tabsDom.style.transform = `translateX(${newX}px)`;
-    setTabsPositionFlags({
-      start: newX < 0,
-      end: Math.abs(newX) < width - parentWidth
-    });
-  };
-  useEffect(() => {
-    setSelectedKey(props.selectedKey || _get(tabs, '0.key'));
-    // const t = [{'code':'tagdata','enName':'tagdata','icon':'layer-color','menuName':'打标数据管理打标数据管理打标数据管理','path':'/orion/tag/datalist','key':'tagdata','name':'打标数据管理打标数据管理打标数据管理'},{'code':'taglist','enName':'taglist','icon':'home','menuName':'标签管理','path':'http://baidu.com/orion/tag/list','key':'taglist','name':'标签管理'},{'code':'relation1','enName':'dadicasesearch1','icon':'home','menuName':'案件检索1','path':'/orion/case/relation1','key':'relation1','name':'案件检索1'},{'code':'dadicasesearch-0','enName':'dadicasesearch','icon':'home','menuName':'案件检索-0','path':'/orion/case/relation0','key':'dadicasesearch-0','name':'案件检索-0'},{'code':'dadicasesearch-1','enName':'dadicasesearch','icon':'home','menuName':'案件检索-1','path':'/orion/case/relation1','key':'dadicasesearch-1','name':'案件检索-1'},{'code':'dadicasesearch-2','enName':'dadicasesearch','icon':'home','menuName':'案件检索-2','path':'/orion/case/relation2','key':'dadicasesearch-2','name':'案件检索-2'},{'code':'dadicasesearch-3','enName':'dadicasesearch','icon':'home','menuName':'案件检索-3','path':'/orion/case/relation3','key':'dadicasesearch-3','name':'案件检索-3'},{'code':'dadicasesearch-4','enName':'dadicasesearch','icon':'home','menuName':'案件检索-4','path':'/orion/case/relation4','key':'dadicasesearch-4','name':'案件检索-4'},{'code':'dadicasesearch-5','enName':'dadicasesearch','icon':'home','menuName':'案件检索-5','path':'/orion/case/relation5','key':'dadicasesearch-5','name':'案件检索-5'},{'code':'dadicasesearch-6','enName':'dadicasesearch','icon':'home','menuName':'案件检索-6','path':'/orion/case/relation6','key':'dadicasesearch-6','name':'案件检索-6'},{'code':'dadicasesearch-7','enName':'dadicasesearch','icon':'home','menuName':'案件检索-7','path':'/orion/case/relation7','key':'dadicasesearch-7','name':'案件检索-7'},{'code':'dadicasesearch-8','enName':'dadicasesearch','icon':'home','menuName':'案件检索-8','path':'/orion/case/relation8','key':'dadicasesearch-8','name':'案件检索-8'}] ;
-    setTabItems(tabs);
-  }, [tabs, props.selectedKey]);
-  useEffect(() => {}, [props.orgAppListVisible]);
-  useEffect(() => {
-    const tabsDom = getTabsDom();
-    setArrowVisible(tabsDom.offsetWidth - tabsDom.parentNode.offsetWidth > 0);
-  }, [tabItems]);
-  useEffect(() => {
-    translateTabsDom(tabItems, selectedKey);
-  }, [tabItems, selectedKey, appListVisible, orgListVisible, orgAppListVisible]);
-  return React.createElement(TabsContainer, Object.assign({}, props, {
-    className: cn('tnt-layout-header-tabs', {
-      [className]: className
-    })
-  }), React.createElement(Tabs, {
-    className: "tnt-layout-header-tabs-content",
-    ref: tabsRef
-  }, tabItems.map((tab, index) => {
-    var _a;
-    return React.createElement(TabItem, {
-      key: tab.key,
-      theme: theme,
-      className: cn({
-        active: selectedKey === tab.key,
-        activeTabPreSibling: ((_a = tabItems[index + 1]) === null || _a === void 0 ? void 0 : _a.key) === selectedKey
-      }),
-      onClick: () => onTabClick(tab, index)
-    }, React.createElement("a", {
-      href: tab.key,
-      onClick: evt => evt.preventDefault()
-    }, {
-      cn: tab.name,
-      en: tab.enName || tab.name
-    }[language || 'cn']), tab.closable !== false && tabItems.length > 1 && React.createElement(Icon, {
-      type: "close",
-      onClick: closeTabHandle.bind(null, tab, index)
-    }));
-  })), arrowVisible && React.createElement("div", {
-    className: "tnt-layout-header-tabs-arrows"
-  }, React.createElement(Icon, {
-    type: "left",
-    onClick: onMoveToLeft,
-    disabled: !tabsPositionFlags.start
-  }), React.createElement(Icon, {
-    type: "right",
-    onClick: onMoveToRight,
-    disabled: !tabsPositionFlags.end
-  })));
+    const closeTabHandle = (tab, index, evt) => {
+        var _a, _b;
+        evt.stopPropagation();
+        const newTabItems = tabItems.filter(({ key }) => key !== tab.key);
+        let newSelectedKey = selectedKey;
+        setTabItems(newTabItems);
+        if (tab.key === selectedKey) {
+            newSelectedKey = index === 0 ? (_a = newTabItems[0]) === null || _a === void 0 ? void 0 : _a.key : (_b = newTabItems[index - 1]) === null || _b === void 0 ? void 0 : _b.key;
+            setSelectedKey(newSelectedKey);
+        }
+        onTabClose === null || onTabClose === void 0 ? void 0 : onTabClose(tab, newTabItems, newTabItems.find(({ key }) => key === newSelectedKey));
+    };
+    const onMoveToLeft = () => {
+        const tabsDom = getTabsDom();
+        const parentBBox = tabsDom.parentNode.getBoundingClientRect();
+        const parentWidth = parentBBox.width - 32;
+        let x = Math.abs(+tabsDom.style.transform.replace(/[^\d.-]/g, ''));
+        const index = Math.ceil(x / 130);
+        const trueX = index * 130;
+        let newX = Math.min(0, -(trueX - parentWidth));
+        tabsDom.style.transform = `translateX(${newX}px)`;
+        const width = tabItems.length * 130;
+        setTabsPositionFlags({
+            start: newX < 0,
+            end: Math.abs(newX) < width - parentWidth,
+        });
+    };
+    const onMoveToRight = () => {
+        const tabsDom = getTabsDom();
+        const parentBBox = tabsDom.parentNode.getBoundingClientRect();
+        const parentWidth = parentBBox.width - 32;
+        const width = tabItems.length * 130;
+        let x = Math.abs(+tabsDom.style.transform.replace(/[^\d.-]/g, ''));
+        const index = Math.floor(x / 130);
+        const trueX = index * 130;
+        let newX = Math.max(-(width - parentWidth), -(trueX + parentWidth));
+        tabsDom.style.transform = `translateX(${newX}px)`;
+        setTabsPositionFlags({
+            start: newX < 0,
+            end: Math.abs(newX) < width - parentWidth,
+        });
+    };
+    const translateTabsDom = (tabs, selectedKey) => {
+        if (!selectedKey)
+            return;
+        const index = tabs.indexOf(tabs.find(({ key }) => key === selectedKey));
+        if (index === -1)
+            return;
+        const tabsDom = getTabsDom();
+        let x = -+tabsDom.style.transform.replace(/[^\d.-]/g, '');
+        const bbox = {
+            left: index * 130,
+            right: (index + 1) * 130,
+        };
+        const parentBBox = tabsDom.parentNode.getBoundingClientRect();
+        const parentWidth = parentBBox.width - 36;
+        const width = tabItems.length * 130;
+        let tailX = x + parentWidth; //当前滑动窗口尾部坐标
+        let newX = -x;
+        if (bbox.left < x) {
+            newX = -bbox.left;
+        }
+        else if (bbox.right >= tailX) {
+            newX = parentWidth - bbox.right;
+        }
+        if (newX + width < parentWidth) {
+            newX = -(width - parentWidth);
+        }
+        newX = Math.min(0, newX);
+        tabsDom.style.transform = `translateX(${newX}px)`;
+        setTabsPositionFlags({
+            start: newX < 0,
+            end: Math.abs(newX) < width - parentWidth,
+        });
+    };
+    useEffect(() => {
+        setSelectedKey(props.selectedKey || get(tabs, '0.key'));
+        // const t = [{'code':'tagdata','enName':'tagdata','icon':'layer-color','menuName':'打标数据管理打标数据管理打标数据管理','path':'/orion/tag/datalist','key':'tagdata','name':'打标数据管理打标数据管理打标数据管理'},{'code':'taglist','enName':'taglist','icon':'home','menuName':'标签管理','path':'http://baidu.com/orion/tag/list','key':'taglist','name':'标签管理'},{'code':'relation1','enName':'dadicasesearch1','icon':'home','menuName':'案件检索1','path':'/orion/case/relation1','key':'relation1','name':'案件检索1'},{'code':'dadicasesearch-0','enName':'dadicasesearch','icon':'home','menuName':'案件检索-0','path':'/orion/case/relation0','key':'dadicasesearch-0','name':'案件检索-0'},{'code':'dadicasesearch-1','enName':'dadicasesearch','icon':'home','menuName':'案件检索-1','path':'/orion/case/relation1','key':'dadicasesearch-1','name':'案件检索-1'},{'code':'dadicasesearch-2','enName':'dadicasesearch','icon':'home','menuName':'案件检索-2','path':'/orion/case/relation2','key':'dadicasesearch-2','name':'案件检索-2'},{'code':'dadicasesearch-3','enName':'dadicasesearch','icon':'home','menuName':'案件检索-3','path':'/orion/case/relation3','key':'dadicasesearch-3','name':'案件检索-3'},{'code':'dadicasesearch-4','enName':'dadicasesearch','icon':'home','menuName':'案件检索-4','path':'/orion/case/relation4','key':'dadicasesearch-4','name':'案件检索-4'},{'code':'dadicasesearch-5','enName':'dadicasesearch','icon':'home','menuName':'案件检索-5','path':'/orion/case/relation5','key':'dadicasesearch-5','name':'案件检索-5'},{'code':'dadicasesearch-6','enName':'dadicasesearch','icon':'home','menuName':'案件检索-6','path':'/orion/case/relation6','key':'dadicasesearch-6','name':'案件检索-6'},{'code':'dadicasesearch-7','enName':'dadicasesearch','icon':'home','menuName':'案件检索-7','path':'/orion/case/relation7','key':'dadicasesearch-7','name':'案件检索-7'},{'code':'dadicasesearch-8','enName':'dadicasesearch','icon':'home','menuName':'案件检索-8','path':'/orion/case/relation8','key':'dadicasesearch-8','name':'案件检索-8'}] ;
+        setTabItems(tabs);
+    }, [tabs, props.selectedKey]);
+    useEffect(() => { }, [props.orgAppListVisible]);
+    useEffect(() => {
+        const tabsDom = getTabsDom();
+        setArrowVisible(tabsDom.offsetWidth - tabsDom.parentNode.offsetWidth > 0);
+    }, [tabItems]);
+    useEffect(() => {
+        translateTabsDom(tabItems, selectedKey);
+    }, [tabItems, selectedKey, appListVisible, orgListVisible, orgAppListVisible]);
+    return (React.createElement(TabsContainer, Object.assign({}, props, { className: cn('tnt-layout-header-tabs', { [className]: className }) }),
+        React.createElement(Tabs, { className: "tnt-layout-header-tabs-content", ref: tabsRef }, tabItems.map((tab, index) => {
+            var _a;
+            return (React.createElement(TabItem, { key: tab.key, theme: theme, className: cn({
+                    active: selectedKey === tab.key,
+                    activeTabPreSibling: ((_a = tabItems[index + 1]) === null || _a === void 0 ? void 0 : _a.key) === selectedKey,
+                }), onClick: () => onTabClick(tab, index) },
+                React.createElement("a", { href: tab.key, onClick: (evt) => evt.preventDefault() }, {
+                    cn: tab.name,
+                    en: tab.enName || tab.name,
+                }[language || 'cn']),
+                tab.closable !== false && tabItems.length > 1 && (React.createElement(Icon, { type: "close", onClick: closeTabHandle.bind(null, tab, index) }))));
+        })),
+        arrowVisible && (React.createElement("div", { className: "tnt-layout-header-tabs-arrows" },
+            React.createElement(Icon, { type: "left", onClick: onMoveToLeft, disabled: !tabsPositionFlags.start }),
+            React.createElement(Icon, { type: "right", onClick: onMoveToRight, disabled: !tabsPositionFlags.end })))));
 });
-export default HeaderTabs;
+export default HeaderTabs;
+//# sourceMappingURL=HeaderTabs.js.map

package/es/tntd-layout/Iconfont.js

@@ -1,3 +1,4 @@
 import React from 'react';
 import Icon from '../tntd-icon';
-export default (props => React.createElement(Icon, Object.assign({}, props)));
+export default (props) => React.createElement(Icon, Object.assign({}, props));
+//# sourceMappingURL=Iconfont.js.map

package/es/tntd-layout/Language.js

@@ -1,45 +1,26 @@
-import _get from "lodash/get";
 import React, { useState } from 'react';
 import styled, { withTheme } from 'styled-components';
+import { get } from 'lodash';
 import Iconfont from './Iconfont';
 import { setLanguageStore, getLanguageStore } from './storage';
-const languages = [{
-  value: 'cn',
-  name: '中文'
-}, {
-  value: 'en',
-  name: ' EN '
-}];
+const languages = [
+    { value: 'cn', name: '中文' },
+    { value: 'en', name: ' EN ' },
+];
 const languagesMap = languages.reduce((acc, cur) => {
-  acc[cur.value] = cur;
-  return acc;
+    acc[cur.value] = cur;
+    return acc;
 }, {});
-const Language = styled.li`
-  font-size: ${({
-  theme: {
-    size
-  }
-}) => size === 'large' ? '14px' : '12px'};
+const Language = styled.li `
+  font-size: ${({ theme: { size } }) => (size === 'large' ? '14px' : '12px')};
   .tnt-icon {
-    font-size: ${({
-  theme: {
-    size
-  }
-}) => size === 'large' ? '24px' : '20px'};
+    font-size: ${({ theme: { size } }) => (size === 'large' ? '24px' : '20px')};
     margin-right: 4px;
   }
   span {
     position: relative;
-    font-size: ${({
-  theme: {
-    size
-  }
-}) => size === 'large' ? '14px' : '12px'};
-    top: ${({
-  theme: {
-    size
-  }
-}) => size === 'large' ? '-3px' : '-2px'};
+    font-size: ${({ theme: { size } }) => (size === 'large' ? '14px' : '12px')};
+    top: ${({ theme: { size } }) => (size === 'large' ? '-3px' : '-2px')};
     font-family: auto;
     .tnt-themeS1 & {
       /* color: rgba(255,255,255,.85); */
@@ -49,27 +30,24 @@ const Language = styled.li`
     display: none;
   }
 `;
-export default withTheme(props => {
-  const {
-    onChange
-  } = props;
-  const getLanguage = () => {
-    let lang = getLanguageStore() || props.language;
-    if (!languagesMap[lang]) {
-      lang = _get(languages, '0.value');
-    }
-    return lang;
-  };
-  const [language = 'cn', setLanguage] = useState(getLanguage());
-  const switchLanguage = () => {
-    const lang = language === 'cn' ? 'en' : 'cn';
-    setLanguage(lang);
-    setLanguageStore(lang);
-    onChange && onChange(lang);
-  };
-  return React.createElement(Language, {
-    onClick: switchLanguage
-  }, React.createElement(Iconfont, {
-    type: `flag-${language}`
-  }), React.createElement("span", null, _get(languagesMap[language], 'name')));
-});
+export default withTheme((props) => {
+    const { onChange } = props;
+    const getLanguage = () => {
+        let lang = getLanguageStore() || props.language;
+        if (!languagesMap[lang]) {
+            lang = get(languages, '0.value');
+        }
+        return lang;
+    };
+    const [language = 'cn', setLanguage] = useState(getLanguage());
+    const switchLanguage = () => {
+        const lang = language === 'cn' ? 'en' : 'cn';
+        setLanguage(lang);
+        setLanguageStore(lang);
+        onChange && onChange(lang);
+    };
+    return (React.createElement(Language, { onClick: switchLanguage },
+        React.createElement(Iconfont, { type: `flag-${language}` }),
+        React.createElement("span", null, get(languagesMap[language], 'name'))));
+});
+//# sourceMappingURL=Language.js.map