UNPKG

@wix/design-system

Version:

@wix/design-system

129 lines (128 loc) 3.76 kB
"use strict"; var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault"); exports.__esModule = true; exports.default = exports.badgeSelectItemBuilder = void 0; var _react = _interopRequireDefault(require("react")); var _BadgeSelectItemSt = require("./BadgeSelectItem.st.css.js"); var _propTypes = _interopRequireDefault(require("prop-types")); var _ListItemSelect = _interopRequireDefault(require("../ListItemSelect")); var _jsxFileName = "/home/builduser/work/57e038ea7326c1ec/packages/wix-design-system/dist/cjs/BadgeSelectItem/BadgeSelectItem.js"; var BadgeSelectItem = props => { var { dataHook, skin, text, subtitle, ellipsis, selected, highlighted, disabled, className, size, suffix } = props; var prefix = /*#__PURE__*/_react.default.createElement("div", { className: (0, _BadgeSelectItemSt.st)(_BadgeSelectItemSt.classes.marker, { skin }), __self: void 0, __source: { fileName: _jsxFileName, lineNumber: 21, columnNumber: 18 } }); return /*#__PURE__*/_react.default.createElement(_ListItemSelect.default, { className: (0, _BadgeSelectItemSt.st)(_BadgeSelectItemSt.classes.root, className), title: text, ellipsis: ellipsis, dataHook: dataHook, prefix: prefix, selected: selected, highlighted: highlighted, disabled: disabled, subtitle: subtitle, size: size, suffix: suffix, __self: void 0, __source: { fileName: _jsxFileName, lineNumber: 24, columnNumber: 5 } }); }; BadgeSelectItem.propTypes = { /** Applied as data-hook HTML attribute that can be used in the tests */ dataHook: _propTypes.default.string, /** Specifies a CSS class name to be appended to the component’s root element. * @internal */ className: _propTypes.default.string, /** The text to be rendered within the badge. */ text: _propTypes.default.node.isRequired, /** The secondary text to be rendered within the badge. */ subtitle: _propTypes.default.string, /** The badge's skin. See the <Badge/> story for the full list of available skins. */ skin: _propTypes.default.string.isRequired, /** Should the text and subtitle get ellipsis with tooltip, or should it get broken into lines when it reaches the end of its container */ ellipsis: _propTypes.default.bool, /** If true, the item is selected */ selected: _propTypes.default.bool, /** If true, the item is highlighted */ highlighted: _propTypes.default.bool, /** If true, the item is disabled */ disabled: _propTypes.default.bool, /** Any suffix */ suffix: _propTypes.default.node, /** Changing text size */ size: _propTypes.default.oneOf(['small', 'medium']) }; var _default = exports.default = BadgeSelectItem; var badgeSelectItemBuilder = _ref => { var { id, className, text, skin, subtitle, ellipsis, disabled, dataHook, size, suffix } = _ref; return { id, disabled, overrideOptionStyle: true, value: _ref2 => { var { selected, hovered, disabled } = _ref2; return /*#__PURE__*/_react.default.createElement(BadgeSelectItem, { dataHook: dataHook, className: className, skin: skin, text: text, subtitle: subtitle, ellipsis: ellipsis, selected: selected, highlighted: hovered, disabled: disabled, size: size, suffix: suffix, __self: void 0, __source: { fileName: _jsxFileName, lineNumber: 85, columnNumber: 5 } }); } }; }; exports.badgeSelectItemBuilder = badgeSelectItemBuilder; //# sourceMappingURL=BadgeSelectItem.js.map