@redocly/theme 0.4.2 → 0.4.3

package/EditPageButton/EditPageButton.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+export interface EditPageButtonProps {
+    text: string;
+    to: string;
+    icon: string;
+}
+export declare const EditPageButton: ({ text, to, icon }: EditPageButtonProps) => JSX.Element;

package/EditPageButton/EditPageButton.js

@@ -0,0 +1,24 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.EditPageButton = void 0;
+var react_1 = __importDefault(require("react"));
+var styled_components_1 = __importDefault(require("styled-components"));
+var Link_1 = require("../mocks/Link");
+var EditPageButton = function (_a) {
+    var text = _a.text, to = _a.to, icon = _a.icon;
+    return (react_1.default.createElement(EditButton, { to: to },
+        react_1.default.createElement(ButtonIcon, { src: icon }),
+        react_1.default.createElement(ButtonText, null, text)));
+};
+exports.EditPageButton = EditPageButton;
+var EditButton = (0, styled_components_1.default)(Link_1.Link)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  margin-left: auto;\n  display: inline-flex;\n  color: var(--color-content);\n  font-weight: var(--font-weight-bold);\n  font-size: var(--font-size-base);\n  font-family: var(--font-family-base);\n  text-decoration: none;\n"], ["\n  margin-left: auto;\n  display: inline-flex;\n  color: var(--color-content);\n  font-weight: var(--font-weight-bold);\n  font-size: var(--font-size-base);\n  font-family: var(--font-family-base);\n  text-decoration: none;\n"])));
+var ButtonIcon = styled_components_1.default.img(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  height: 14px;\n  padding-right: 3px;\n"], ["\n  height: 14px;\n  padding-right: 3px;\n"])));
+var ButtonText = styled_components_1.default.span(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  line-height: 14px;\n"], ["\n  line-height: 14px;\n"])));
+var templateObject_1, templateObject_2, templateObject_3;

package/EditPageButton/index.d.ts

@@ -0,0 +1 @@
+export * from '../EditPageButton/EditPageButton';

package/EditPageButton/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("../EditPageButton/EditPageButton"), exports);

package/LastUpdated/LastUpdated.js

@@ -10,9 +10,16 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.LastUpdated = void 0;
 var react_1 = __importDefault(require("react"));
 var styled_components_1 = __importDefault(require("styled-components"));
-var timeago_js_1 = require("timeago.js");
 var hooks_1 = require("../mocks/hooks");
 var constants_1 = require("../mocks/constants");
+// import { timeAgo } from '../mocks/utils';
+// TODO: use timeago.js instead
+// import { format } from 'timeago.js';
+// Last updated ${format(lastModified)}
+function timeAgo(date) {
+    var d = new Date(date);
+    return "".concat(d.getDate(), "-").concat(d.getMonth() + 1, "-").concat(d.getFullYear());
+}
 function LastUpdated(_a) {
     var lastModified = _a.lastModified;
     var lastUpdatedBlock = (0, hooks_1.useThemeSettings)(constants_1.DEFAULT_THEME_NAME).lastUpdatedBlock;
@@ -21,8 +28,8 @@ function LastUpdated(_a) {
     }
     return (react_1.default.createElement(Wrapper, { "data-component-name": "LastUpdated/LastUpdated" },
         "Last updated ",
-        (0, timeago_js_1.format)(lastModified)));
+        timeAgo(lastModified)));
 }
 exports.LastUpdated = LastUpdated;
-var Wrapper = styled_components_1.default.time(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  color: var(--last-updated-text-color);\n  font-size: var(--last-updated-font-size);\n  font-family: var(--last-updated-font-family);\n  line-height: var(--last-updated-line-height);\n  padding-bottom: 20px;\n"], ["\n  color: var(--last-updated-text-color);\n  font-size: var(--last-updated-font-size);\n  font-family: var(--last-updated-font-family);\n  line-height: var(--last-updated-line-height);\n  padding-bottom: 20px;\n"])));
+var Wrapper = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  color: var(--last-updated-text-color);\n  font-size: var(--last-updated-font-size);\n  font-family: var(--last-updated-font-family);\n  line-height: var(--last-updated-line-height);\n  padding-bottom: 30px;\n"], ["\n  color: var(--last-updated-text-color);\n  font-size: var(--last-updated-font-size);\n  font-family: var(--last-updated-font-family);\n  line-height: var(--last-updated-line-height);\n  padding-bottom: 30px;\n"])));
 var templateObject_1;

package/Markdown/MarkdownLayout.d.ts

@@ -4,6 +4,12 @@ declare type MarkdownLayoutProps = {
     markdownWrapper: React.ReactNode;
     showPrevButton?: boolean;
     showNextButton?: boolean;
+    editPage?: {
+        to: string;
+        text: string;
+        icon: string;
+    };
+    lastModified?: string | Date;
 };
-export declare function MarkdownLayout({ tableOfContent, markdownWrapper, showPrevButton, showNextButton, }: MarkdownLayoutProps): JSX.Element;
+export declare function MarkdownLayout({ tableOfContent, markdownWrapper, showPrevButton, showNextButton, editPage, lastModified, }: MarkdownLayoutProps): JSX.Element;
 export {};

package/Markdown/MarkdownLayout.js

@@ -1,19 +1,31 @@
 "use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.MarkdownLayout = void 0;
 var react_1 = __importDefault(require("react"));
+var styled_components_1 = __importDefault(require("styled-components"));
 var PageWrapper_1 = require("../Markdown/PageWrapper");
 var ContainerWrapper_1 = require("../Markdown/ContainerWrapper");
 var PageNavigation_1 = require("../PageNavigation/PageNavigation");
+var EditPageButton_1 = require("../EditPageButton");
+var LastUpdated_1 = require("../LastUpdated/LastUpdated");
 function MarkdownLayout(_a) {
-    var tableOfContent = _a.tableOfContent, markdownWrapper = _a.markdownWrapper, showPrevButton = _a.showPrevButton, showNextButton = _a.showNextButton;
+    var tableOfContent = _a.tableOfContent, markdownWrapper = _a.markdownWrapper, showPrevButton = _a.showPrevButton, showNextButton = _a.showNextButton, editPage = _a.editPage, lastModified = _a.lastModified;
     return (react_1.default.createElement(PageWrapper_1.PageWrapper, { "data-component-name": "Markdown/MarkdownLayout" },
         react_1.default.createElement(ContainerWrapper_1.ContainerWrapper, { withToc: true },
+            react_1.default.createElement(LayoutTop, null,
+                lastModified && react_1.default.createElement(LastUpdated_1.LastUpdated, { lastModified: lastModified }),
+                editPage && (react_1.default.createElement(EditPageButton_1.EditPageButton, { text: editPage.text, to: editPage.to, icon: editPage.icon }))),
             markdownWrapper,
             react_1.default.createElement(PageNavigation_1.PageNavigation, { showPrevButton: showPrevButton, showNextButton: showNextButton })),
         tableOfContent));
 }
 exports.MarkdownLayout = MarkdownLayout;
+var LayoutTop = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n  justify-content: space-between;\n  flex-flow: row nowrap;\n"], ["\n  display: flex;\n  justify-content: space-between;\n  flex-flow: row nowrap;\n"])));
+var templateObject_1;

package/globalStyle.d.ts

@@ -1,3 +1,2 @@
-export declare const darkMode: import("styled-components").FlattenSimpleInterpolation;
 export declare const styles: import("styled-components").FlattenSimpleInterpolation;
 export declare const GlobalStyle: import("styled-components").GlobalStyleComponent<{}, import("styled-components").DefaultTheme>;