@antv/dumi-theme-antv
Version:
AntV website theme based on dumi2.
62 lines • 2.3 kB
JavaScript
import React from 'react';
import { Dropdown } from "antd";
import { useAntVConfig, useProducts } from "../../../../../hooks/useProducts";
import { useLocale, FormattedMessage } from "dumi";
import styles from "./index.module.less";
export function ChooseLib(props) {
var _data$find;
var value = props.value,
onChange = props.onChange,
_props$size = props.size,
size = _props$size === void 0 ? "default" : _props$size;
var isCompact = size === 'compact';
var locale = useLocale();
var lang = locale.id === 'zh' ? 'zh' : 'en';
var _useProducts = useProducts(),
_useProducts$data = _useProducts.data,
data = _useProducts$data === void 0 ? [] : _useProducts$data;
var _useAntVConfig = useAntVConfig(),
_useAntVConfig$data = _useAntVConfig.data,
_useAntVConfig$data2 = _useAntVConfig$data === void 0 ? {
library: []
} : _useAntVConfig$data,
_useAntVConfig$data2$ = _useAntVConfig$data2.library,
library = _useAntVConfig$data2$ === void 0 ? [] : _useAntVConfig$data2$;
var onSelect = function onSelect(key) {
onChange === null || onChange === void 0 || onChange(key);
};
var items = data.filter(function (item) {
return item.lang === lang && library.map(function (l) {
return l.toUpperCase();
}).includes(item.title);
}).map(function (item) {
return {
key: item.title,
label: item.title,
icon: /*#__PURE__*/React.createElement("img", {
src: item.icon,
alt: item.title,
className: styles.icon
}),
extra: !isCompact && item.slogan,
onClick: function onClick() {
return onSelect(item.title);
}
};
});
return /*#__PURE__*/React.createElement(Dropdown, {
menu: {
items: items
}
}, /*#__PURE__*/React.createElement("button", {
type: "button"
}, /*#__PURE__*/React.createElement("img", {
className: styles.icon,
src: ((_data$find = data.find(function (item) {
return item.title === value;
})) === null || _data$find === void 0 ? void 0 : _data$find.icon) || "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*7svFR6wkPMoAAAAAAAAAAAAADmJ7AQ/original",
alt: "AntV"
}), value || !isCompact && /*#__PURE__*/React.createElement(FormattedMessage, {
id: "ai.chooseLib.placeholder"
})));
}