UNPKG

suomifi-ui-components

Version:
103 lines (97 loc) 5.06 kB
'use strict'; var tslib = require('tslib'); var React = require('react'); var classnames = require('classnames'); require('../../../../reset/HtmlA/HtmlA.js'); require('../../../../reset/HtmlButton/HtmlButton.js'); require('../../../../reset/HtmlDiv/HtmlDiv.js'); require('../../../../reset/HtmlFieldSet/HtmlFieldSet.js'); require('../../../../reset/HtmlH/HtmlH.js'); require('../../../../reset/HtmlInput/HtmlInput.js'); require('../../../../reset/HtmlLabel/HtmlLabel.js'); require('../../../../reset/HtmlLegend/HtmlLegend.js'); var HtmlLi = require('../../../../reset/HtmlLi/HtmlLi.js'); require('../../../../reset/HtmlNav/HtmlNav.js'); require('../../../../reset/HtmlOl/HtmlOl.js'); var HtmlSpan = require('../../../../reset/HtmlSpan/HtmlSpan.js'); require('../../../../reset/HtmlTextarea/HtmlTextarea.js'); var HtmlUl = require('../../../../reset/HtmlUl/HtmlUl.js'); require('../../../../reset/HtmlTable/HtmlTable.js'); require('../../../../reset/HtmlTable/HtmlTableCaption.js'); require('../../../../reset/HtmlTable/HtmlTableHeader.js'); require('../../../../reset/HtmlTable/HtmlTableRow.js'); require('../../../../reset/HtmlTable/HtmlTableBody.js'); require('../../../../reset/HtmlTable/HtmlTableHeaderCell.js'); require('../../../../reset/HtmlTable/HtmlTableCell.js'); var SuomifiThemeProvider = require('../../../theme/SuomifiThemeProvider/SuomifiThemeProvider.js'); require('../../../theme/SuomifiTheme/SuomifiTheme.js'); require('../../../theme/SpacingProvider/SpacingProvider.js'); var SideNavigationItem_baseStyles = require('./SideNavigationItem.baseStyles.js'); var styled = require('styled-components'); var suomifiIcons = require('suomifi-icons'); function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; } var React__default = /*#__PURE__*/_interopDefault(React); var classnames__default = /*#__PURE__*/_interopDefault(classnames); var baseClassName = 'fi-side-navigation-item'; var selectedClassName = "".concat(baseClassName, "--selected"); var childSelectedClassName = "".concat(baseClassName, "--child-selected"); var disabledClassName = "".concat(baseClassName, "--disabled"); var subListClassName = "".concat(baseClassName, "_sub-list"); var contentWrapperClassName = "".concat(baseClassName, "_content-wrapper"); var BaseSideNavigationItem = function BaseSideNavigationItem(_a) { var _b; var subLevel = _a.subLevel, selected = _a.selected, className = _a.className, children = _a.children, content = _a.content, disabled = _a.disabled, expanded = _a.expanded, passProps = tslib.__rest(_a, ["subLevel", "selected", "className", "children", "content", "disabled", "expanded"]); var childIsSelected = false; React__default.default.Children.forEach(children, function (element) { if (! /*#__PURE__*/React__default.default.isValidElement(element) || !element.props) return; if (element.props.selected) { childIsSelected = true; return; } if (!element.props.children) return; element.props.children.forEach(function (child) { var _a; if ((_a = child.props) === null || _a === void 0 ? void 0 : _a.selected) { childIsSelected = true; return; } }); }); return /*#__PURE__*/React__default.default.createElement(HtmlLi.HtmlLi, tslib.__assign({ className: classnames__default.default(className, baseClassName, "".concat(baseClassName, "--level-").concat(subLevel), (_b = {}, _b[selectedClassName] = selected, _b[childSelectedClassName] = childIsSelected, _b[disabledClassName] = disabled, _b)), "aria-disabled": disabled }, passProps), /*#__PURE__*/React__default.default.createElement(HtmlSpan.HtmlSpan, { className: contentWrapperClassName }, subLevel === 2 && /*#__PURE__*/React__default.default.createElement(suomifiIcons.IconSubDirectory, null), content), !!children && (selected || childIsSelected || expanded) && ( /*#__PURE__*/React__default.default.createElement(HtmlUl.HtmlUl, { className: subListClassName }, children))); }; var StyledSideNavigationItem = styled.styled(function (props) { props.theme; var passProps = tslib.__rest(props, ["theme"]); return /*#__PURE__*/React__default.default.createElement(BaseSideNavigationItem, tslib.__assign({}, passProps)); }).withConfig({ componentId: "sc-yam1y6-0" })(templateObject_1 || (templateObject_1 = tslib.__makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (_a) { var theme = _a.theme; return SideNavigationItem_baseStyles.baseStyles(theme); }); var SideNavigationItem = function SideNavigationItem(props) { return /*#__PURE__*/React__default.default.createElement(SuomifiThemeProvider.SuomifiThemeConsumer, null, function (_a) { var suomifiTheme = _a.suomifiTheme; return /*#__PURE__*/React__default.default.createElement(StyledSideNavigationItem, tslib.__assign({ theme: suomifiTheme }, props)); }); }; SideNavigationItem.displayName = 'SideNavigationItem'; var templateObject_1; exports.SideNavigationItem = SideNavigationItem; //# sourceMappingURL=SideNavigationItem.js.map