UNPKG

@hhgtech/hhg-components

Version:
53 lines (45 loc) 3.1 kB
'use strict'; var React = require('react'); var index = require('./index-25f2e7a5.js'); require('./translationsContext-d63b6d32.js'); var togetherComponentGlobalContext = require('./utils-aea77f4a.js'); var treePopoverMenu = require('./treePopoverMenu-087273ff.js'); function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; } var React__default = /*#__PURE__*/_interopDefault(React); var img$1 = "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3e%3cpath stroke='%233E3F58' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m8 14 4 4 4-4M16 10l-4-4-4 4'/%3e%3c/svg%3e"; var MBSortBy = img$1; var img = "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3e%3cpath fill='%238C8C8C' d='M4.5 7h7a.46.46 0 0 0 .351-.165.56.56 0 0 0 .149-.39q0-.226-.149-.391l-3.5-3.89a.458.458 0 0 0-.703 0l-3.5 3.89a.56.56 0 0 0-.148.39q0 .226.148.391Q4.298 7 4.5 7M11.5 9h-7a.46.46 0 0 0-.352.165.56.56 0 0 0-.148.39q0 .226.148.391l3.5 3.889a.46.46 0 0 0 .703 0l3.5-3.889a.56.56 0 0 0 .149-.39q0-.226-.149-.391A.46.46 0 0 0 11.5 9'/%3e%3c/svg%3e"; var IconSortArrow = img; var LabelSortingValue; (function (LabelSortingValue) { LabelSortingValue["latest"] = "latest"; LabelSortingValue["oldest"] = "oldest"; LabelSortingValue["popular"] = "popular"; })(LabelSortingValue || (LabelSortingValue = {})); const LabelSorting = ({ onChange, className, style, leftLabel, rightLabel, color, value, choices, }) => { const { data: { env: { isMarryBaby }, }, } = React.useContext(togetherComponentGlobalContext.TogetherComponentGlobalContext); return (React__default["default"].createElement(treePopoverMenu.LabelSortPin, { label: leftLabel, rightLabel: React__default["default"].createElement(treePopoverMenu.TreePopoverMenu, { position: "bottom", align: "end", data: { isShowheader: false, type: 'list', list: choices.map((c) => ({ label: c.label, onClick: () => onChange && onChange(String(c.value)), selected: c.value === value, className: 'bold-item', })), }, toggleButtonContent: React__default["default"].createElement("div", { style: { display: 'flex', } }, React__default["default"].createElement(index.Text, { style: { display: 'flex', alignItems: 'center', fontWeight: 'normal', marginRight: 12, }, size: "p4" }, rightLabel), React__default["default"].createElement("img", { src: isMarryBaby ? MBSortBy : IconSortArrow, style: { width: 16, height: 16, alignSelf: 'center', }, loading: "lazy" })) }), color: 'gray' , className: className, style: style })); }; exports.LabelSorting = LabelSorting;