@storybook/design-system/dist/components/table-of-contents/BulletLink.js

Storybook design system

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.BulletLink = BulletLink;

var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));

var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));

var _react = _interopRequireDefault(require("react"));

var _theming = require("@storybook/theming");

var _styles = require("../shared/styles");

var _Link = require("../Link");

var _excluded = ["isActive"],
    _excluded2 = ["currentPath", "item"];
var StyledBulletLink = ( /*#__PURE__*/0, _theming.styled)(function (_ref) {
  var isActive = _ref.isActive,
      rest = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
  return /*#__PURE__*/_react["default"].createElement(_Link.Link, rest);
}, process.env.NODE_ENV === "production" ? {
  target: "e7ao0vl2"
} : {
  target: "e7ao0vl2",
  label: "StyledBulletLink"
})("outline:none;display:inline-block;padding:6px 0;line-height:1.5;position:relative;z-index:1;", function (props) {
  return props.isActive ? "font-weight: ".concat(_styles.typography.weight.bold, ";") : "color: ".concat(_styles.color.darker, ";");
}, " &::after{position:absolute;top:0px;right:auto;bottom:0px;left:3px;width:auto;height:auto;border-left:1px solid ", _styles.color.mediumlight, ";content:'';z-index:-1;}");
var BulletLinkWrapper = (0, _theming.styled)("li", process.env.NODE_ENV === "production" ? {
  target: "e7ao0vl1"
} : {
  target: "e7ao0vl1",
  label: "BulletLinkWrapper"
})("&&{padding-top:0;list-style-type:none;}&:first-of-type ", StyledBulletLink, "{margin-top:-6px;&::after{height:50%;top:50%;}}&:last-of-type ", StyledBulletLink, "{margin-bottom:-6px;&::after{height:50%;bottom:50%;}}");
var Bullet = (0, _theming.styled)("span", process.env.NODE_ENV === "production" ? {
  target: "e7ao0vl0"
} : {
  target: "e7ao0vl0",
  label: "Bullet"
})("display:inline-block;margin-bottom:1px;margin-right:16px;background:", _styles.color.medium, ";box-shadow:white 0 0 0 4px;height:8px;width:8px;border-radius:1em;text-decoration:none!important;content:'';", function (props) {
  return props.isActive && "background: ".concat(_styles.color.secondary, ";");
}, ";");

function BulletLink(_ref2) {
  var currentPath = _ref2.currentPath,
      item = _ref2.item,
      rest = (0, _objectWithoutProperties2["default"])(_ref2, _excluded2);
  var isActive = currentPath === item.path;
  return /*#__PURE__*/_react["default"].createElement(BulletLinkWrapper, null, /*#__PURE__*/_react["default"].createElement(StyledBulletLink, (0, _extends2["default"])({
    isActive: isActive,
    href: item.path,
    LinkWrapper: item.LinkWrapper,
    tertiary: !isActive
  }, rest), /*#__PURE__*/_react["default"].createElement(Bullet, {
    isActive: isActive
  }), item.title));
}