UNPKG

@wix/design-system

Version:

@wix/design-system

150 lines (149 loc) 5.74 kB
"use strict"; var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault"); exports.__esModule = true; exports.listItemSelectIconBuilder = exports.default = void 0; var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties")); var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")); var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty")); var _react = _interopRequireWildcard(require("react")); var _propTypes = _interopRequireDefault(require("prop-types")); var _Tooltip = _interopRequireDefault(require("../Tooltip")); var _ListItemSelectIconSt = require("./ListItemSelectIcon.st.css.js"); var _excluded = ["hovered"]; var _jsxFileName = "/home/builduser/work/57e038ea7326c1ec/packages/wix-design-system/dist/cjs/ListItemSelectIcon/ListItemSelectIcon.tsx"; function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); } function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; } function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; } var defaultTooltipProps = { placement: 'right', flip: true }; var ListItemSelectIcon = _ref => { var { highlighted = false, selected = false, disabled = false, dataHook = 'list-item-select-icon', icon, label, className, showTooltip, tooltipProps, onClick } = _ref; var tooltipRef = (0, _react.useRef)(null); (0, _react.useEffect)(() => { var tooltipActions = tooltipRef.current; if (!tooltipActions || !showTooltip) { return; } if (highlighted) { tooltipActions.open(); } else { tooltipActions.close(); } return () => { tooltipActions.close(); }; }, [highlighted, showTooltip]); var content = /*#__PURE__*/_react.default.createElement("div", { className: _ListItemSelectIconSt.classes.content, __self: void 0, __source: { fileName: _jsxFileName, lineNumber: 48, columnNumber: 17 } }, icon); if (showTooltip) { var mergedTooltipProps = _objectSpread(_objectSpread(_objectSpread({}, defaultTooltipProps), tooltipProps), {}, { disabled, content: label, className: _ListItemSelectIconSt.classes.contentWrapper }); content = /*#__PURE__*/_react.default.createElement(_Tooltip.default, (0, _extends2.default)({ ref: tooltipRef }, mergedTooltipProps, { __self: void 0, __source: { fileName: _jsxFileName, lineNumber: 60, columnNumber: 7 } }), content); } return /*#__PURE__*/_react.default.createElement("div", { className: (0, _ListItemSelectIconSt.st)(_ListItemSelectIconSt.classes.root, { highlighted, selected, disabled }, className), "aria-label": label, "data-hook": dataHook, "data-selected": selected, onClick: disabled ? undefined : onClick, __self: void 0, __source: { fileName: _jsxFileName, lineNumber: 67, columnNumber: 5 } }, content); }; ListItemSelectIcon.displayName = 'ListItemSelectIcon'; ListItemSelectIcon.propTypes = { icon: _propTypes.default.any, label: _propTypes.default.string.isRequired, dataHook: _propTypes.default.string, className: _propTypes.default.string, selected: _propTypes.default.bool, highlighted: _propTypes.default.bool, disabled: _propTypes.default.bool, showTooltip: _propTypes.default.bool, tooltipProps: _propTypes.default.any, onClick: _propTypes.default.func }; var _default = exports.default = ListItemSelectIcon; var listItemSelectIconBuilder = _ref2 => { var { id, className, icon, label, disabled, dataHook, showTooltip, tooltipProps } = _ref2; return { id, icon, disabled, overrideOptionStyle: true, label, value: _ref3 => { var { hovered } = _ref3, rest = (0, _objectWithoutProperties2.default)(_ref3, _excluded); return /*#__PURE__*/_react.default.createElement(ListItemSelectIcon, (0, _extends2.default)({ icon: icon, label: label, highlighted: hovered, dataHook: dataHook, className: className, showTooltip: showTooltip, tooltipProps: tooltipProps }, rest, { __self: void 0, __source: { fileName: _jsxFileName, lineNumber: 122, columnNumber: 5 } })); } }; }; exports.listItemSelectIconBuilder = listItemSelectIconBuilder; //# sourceMappingURL=ListItemSelectIcon.js.map