@teambit/changelog/dist/ui/change-log-page.js

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.ChangeLogPage = ChangeLogPage;
function _component() {
  const data = require("@teambit/component");
  _component = function () {
    return data;
  };
  return data;
}
function _documenterUi() {
  const data = require("@teambit/documenter.ui.heading");
  _documenterUi = function () {
    return data;
  };
  return data;
}
function _designUi() {
  const data = require("@teambit/design.ui.separator");
  _designUi = function () {
    return data;
  };
  return data;
}
function _componentUi() {
  const data = require("@teambit/component.ui.version-block");
  _componentUi = function () {
    return data;
  };
  return data;
}
function _classnames() {
  const data = _interopRequireDefault(require("classnames"));
  _classnames = function () {
    return data;
  };
  return data;
}
function _mdxUi() {
  const data = require("@teambit/mdx.ui.mdx-layout");
  _mdxUi = function () {
    return data;
  };
  return data;
}
function _componentInstructions() {
  const data = require("@teambit/component.instructions.exporting-components");
  _componentInstructions = function () {
    return data;
  };
  return data;
}
function _designUi2() {
  const data = require("@teambit/design.ui.alert-card");
  _designUi2 = function () {
    return data;
  };
  return data;
}
function _react() {
  const data = _interopRequireWildcard(require("react"));
  _react = function () {
    return data;
  };
  return data;
}
function _changeLogPageModule() {
  const data = _interopRequireDefault(require("./change-log-page.module.scss"));
  _changeLogPageModule = function () {
    return data;
  };
  return data;
}
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (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 (const 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 _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
function ChangeLogPage({
  className,
  useComponentLogs = _component().useComponentLogs,
  host = ''
}) {
  const component = (0, _react().useContext)(_component().ComponentContext);
  const {
    loading,
    componentLogs,
    latest,
    id
  } = useComponentLogs?.(component?.id.toString(), host, undefined, !component) || {};
  const [showAllSnaps, setShowAllSnaps] = (0, _react().useState)(false);
  const [snapOverrides, setSnapOverrides] = (0, _react().useState)(new Set());
  const toggleSnap = (0, _react().useCallback)(hash => {
    setSnapOverrides(prev => {
      const next = new Set(prev);
      if (next.has(hash)) {
        next.delete(hash);
      } else {
        next.add(hash);
      }
      return next;
    });
  }, []);
  if (loading || !componentLogs) return null;
  const {
    logs = []
  } = componentLogs;
  if (logs?.length === 0) {
    return /*#__PURE__*/_react().default.createElement("div", {
      className: (0, _classnames().default)(_changeLogPageModule().default.changeLogPage, className)
    }, /*#__PURE__*/_react().default.createElement(_documenterUi().H1, {
      className: _changeLogPageModule().default.title
    }, "History"), /*#__PURE__*/_react().default.createElement(_designUi().Separator, {
      isPresentational: true,
      className: _changeLogPageModule().default.separatorNoChangeLog
    }), /*#__PURE__*/_react().default.createElement(_designUi2().AlertCard, {
      level: "info",
      title: "There is no change log as this component has not been exported yet. Learn how to export components:",
      className: _changeLogPageModule().default.changeLogCard
    }, /*#__PURE__*/_react().default.createElement(_mdxUi().MDXLayout, null, /*#__PURE__*/_react().default.createElement(_componentInstructions().ExportingComponents, null))));
  }
  const hasSnaps = logs.some(l => !l.tag);
  return /*#__PURE__*/_react().default.createElement("div", {
    className: (0, _classnames().default)(_changeLogPageModule().default.changeLogPage, className)
  }, /*#__PURE__*/_react().default.createElement("div", {
    className: _changeLogPageModule().default.header
  }, /*#__PURE__*/_react().default.createElement(_documenterUi().H1, {
    className: _changeLogPageModule().default.title
  }, "History"), hasSnaps && /*#__PURE__*/_react().default.createElement("button", {
    className: _changeLogPageModule().default.showAllToggle,
    onClick: () => {
      setSnapOverrides(new Set());
      setShowAllSnaps(!showAllSnaps);
    },
    type: "button"
  }, /*#__PURE__*/_react().default.createElement("img", {
    className: _changeLogPageModule().default.toggleIcon,
    src: showAllSnaps ? 'https://static.bit.dev/bit-icons/collapse.svg' : 'https://static.bit.dev/bit-icons/expand.svg',
    alt: ""
  }), showAllSnaps ? 'Collapse snaps' : 'Show all snaps')), /*#__PURE__*/_react().default.createElement("div", {
    className: _changeLogPageModule().default.timeline
  }, logs.map(snap => {
    const isLatest = latest === snap.tag || latest === snap.hash;
    const isCurrent = id?.version === snap.tag || id?.version === snap.hash;
    const isTag = Boolean(snap.tag);
    const hasOverride = snapOverrides.has(snap.hash);
    const isSnapCollapsed = !isTag && (showAllSnaps ? hasOverride : !hasOverride);
    return /*#__PURE__*/_react().default.createElement(_componentUi().VersionBlock, {
      key: snap.hash,
      componentId: id?.fullName ?? '',
      isLatest: isLatest,
      snap: snap,
      isCurrent: isCurrent,
      collapsed: isSnapCollapsed,
      onToggleCollapse: !isTag ? () => toggleSnap(snap.hash) : undefined,
      allExpanded: showAllSnaps
    });
  })));
}

//# sourceMappingURL=change-log-page.js.map