@kiwicom/orbit-components
Version:
Orbit-components is a React component library which provides developers with the easiest possible way of building Kiwi.com’s products.
102 lines (79 loc) • 3.52 kB
JavaScript
;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
var React = _interopRequireWildcard(require("react"));
var _styledComponents = _interopRequireWildcard(require("styled-components"));
var _rtl = require("../utils/rtl");
var _mediaQuery = _interopRequireDefault(require("../utils/mediaQuery"));
var _TextLink = require("../TextLink");
var _defaultTheme = _interopRequireDefault(require("../defaultTheme"));
var _consts = require("../utils/layout/consts");
var _getSpacing = _interopRequireDefault(require("../Stack/helpers/getSpacing"));
var _getDirectionSpacingTemplate = _interopRequireDefault(require("../Stack/helpers/getDirectionSpacingTemplate"));
const _excluded = ["spacing", "direction"],
_excluded2 = ["theme", "direction"];
const StyledLinkList = _styledComponents.default.ul.withConfig({
displayName: "LinkList__StyledLinkList",
componentId: "sc-18aq27r-0"
})(["display:flex;flex-direction:", ";width:100%;margin:0;padding:0;padding-", ":", ";list-style:none;font-size:", ";"], ({
direction
}) => direction, _rtl.left, ({
indent,
theme
}) => indent && theme.orbit.spaceXXSmall, ({
theme
}) => theme.orbit.fontSizeTextNormal); // $FlowFixMe: https://github.com/flow-typed/flow-typed/issues/3653#issuecomment-568539198
StyledLinkList.defaultProps = {
theme: _defaultTheme.default
};
const resolveSpacings = (_ref) => {
let {
spacing,
direction
} = _ref,
props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
const margin = spacing && direction && String((0, _getDirectionSpacingTemplate.default)(direction)).replace("__spacing__", (0, _getSpacing.default)(props)[spacing]);
return (0, _styledComponents.css)(["margin:", ";&:last-child{margin:0;}"], margin && (0, _rtl.rtlSpacing)(margin));
};
const StyledNavigationLinkListChild = (0, _styledComponents.default)((_ref2) => {
let {
theme,
direction
} = _ref2,
props = (0, _objectWithoutProperties2.default)(_ref2, _excluded2);
return /*#__PURE__*/React.createElement("li", props);
}).withConfig({
displayName: "LinkList__StyledNavigationLinkListChild",
componentId: "sc-18aq27r-1"
})(["", "{text-decoration:none;}", ";", ";"], _TextLink.StyledTextLink, resolveSpacings, ({
direction
}) => direction === "column" && (0, _styledComponents.css)(["width:100%;", "{width:100%;", ";}"], _TextLink.StyledTextLink, _mediaQuery.default.tablet((0, _styledComponents.css)(["width:auto;"])))); // $FlowFixMe: https://github.com/flow-typed/flow-typed/issues/3653#issuecomment-568539198
StyledNavigationLinkListChild.defaultProps = {
theme: _defaultTheme.default
};
const LinkList = ({
direction = "column",
indent,
spacing = _consts.SPACINGS.MEDIUM,
children,
dataTest
}) => /*#__PURE__*/React.createElement(StyledLinkList, {
indent: indent,
direction: direction,
"data-test": dataTest
}, React.Children.map(children, item => {
if ( /*#__PURE__*/React.isValidElement(item)) {
return /*#__PURE__*/React.createElement(StyledNavigationLinkListChild, {
direction: direction,
spacing: spacing
}, item);
}
return null;
}));
var _default = LinkList;
exports.default = _default;