@redocly/theme 0.1.20 → 0.1.23

package/src/Markdown/CodeSample/styled.ts

@@ -1,209 +0,0 @@
-import styled, { css } from 'styled-components';
-
-export const CodeSampleButtonContainer = styled.div`
-  position: absolute;
-  top: 12px;
-  right: 5px;
-`;
-
-export const CopyCodeButton = styled.div`
-  padding: 0 5px;
-  border-radius: 4px;
-  display: none;
-  &:hover {
-    cursor: pointer;
-  }
-`;
-
-export const DoneIndicator = styled.div`
-  padding: 0 5px;
-  border-radius: 4px;
-  cursor: default;
-`;
-
-// const lightStyleTokens = css`
-//   .token.comment,
-//   .token.prolog,
-//   .token.doctype,
-//   .token.cdata {
-//     color: #999988;
-//     font-style: italic;
-//   }
-//   .token.namespace {
-//     opacity: 0.7;
-//   }
-//   .token.string,
-//   .token.attr-value {
-//     color: #e3116c;
-//   }
-//   .token.punctuation,
-//   .token.operator {
-//     color: #393a34; /* no highlight */
-//   }
-//   .token.entity,
-//   .token.url,
-//   .token.symbol,
-//   .token.number,
-//   .token.boolean,
-//   .token.variable,
-//   .token.constant,
-//   .token.property,
-//   .token.regex,
-//   .token.inserted {
-//     color: #36acaa;
-//   }
-//   .token.atrule,
-//   .token.keyword,
-//   .token.attr-name,
-//   .language-autohotkey .token.selector {
-//     color: #00a4db;
-//   }
-//   .token.function,
-//   .token.deleted,
-//   .language-autohotkey .token.tag {
-//     color: #9a050f;
-//   }
-//   .token.tag,
-//   .token.selector,
-//   .language-autohotkey .token.keyword {
-//     color: #00009f;
-//   }
-// `;
-
-const darkStyleTokens = css`
-  .token.comment,
-  .token.prolog,
-  .token.doctype,
-  .token.cdata {
-    color: hsl(30, 20%, 50%);
-  }
-  .token.property,
-  .token.tag,
-  .token.number,
-  .token.constant,
-  .token.symbol {
-    color: #62bff9;
-  }
-  .token.boolean {
-    color: firebrick;
-  }
-  .token.selector,
-  .token.attr-name,
-  .token.string,
-  .token.char,
-  .token.builtin,
-  .token.inserted {
-    color: #a0fbaa;
-    & + a,
-    & + a:visited {
-      color: #4ed2ba;
-      text-decoration: underline;
-    }
-  }
-  .token.operator,
-  .token.entity,
-  .token.url,
-  .token.variable {
-    color: hsl(40, 90%, 60%);
-  }
-  .token.atrule,
-  .token.attr-value,
-  .token.keyword {
-    color: hsl(350, 40%, 70%);
-  }
-  .token.regex,
-  .token.important {
-    color: #e90;
-  }
-  .token.deleted {
-    color: red;
-  }
-`;
-
-export const Wrapper = styled.div`
-  overflow: auto;
-  border-radius: 4px;
-  position: relative;
-
-  ${CopyCodeButton},
-  ${DoneIndicator} {
-    color: rgba(255, 255, 255, 0.15);
-  }
-  ${CopyCodeButton}:hover {
-    color: #fff;
-    background-color: rgba(255, 255, 255, 0.15);
-  }
-
-  &:hover {
-    ${CodeSampleButtonContainer} ${CopyCodeButton} {
-      display: block;
-    }
-  }
-  pre {
-    white-space: var(--code-wrap);
-    color: white;
-    padding: 12px 14px 15px 14px;
-    overflow-x: auto;
-    line-height: normal;
-    border-radius: 4px;
-    font-family: var(--code-font-family);
-    background-color: var(--code-block-preformatted-background-color);
-    code {
-      background-color: transparent;
-      border: 0;
-      padding: 0;
-      color: white;
-      &:before,
-      &:after {
-        content: none;
-      }
-    }
-  }
-  pre[class*='language-'] {
-    padding: 1em;
-    margin: 0.5em 0;
-    overflow: auto;
-    border: 0;
-    border-radius: var(--global-border-radius);
-  }
-  code[class='language-text'] {
-    line-height: 1.2em;
-    display: inline-flex;
-    white-space: pre-wrap;
-    overflow-wrap: anywhere;
-  }
-  code[class*='language-'],
-  pre[class*='language-'] {
-    text-align: left;
-    white-space: pre;
-    word-spacing: normal;
-    word-break: normal;
-    word-wrap: normal;
-    line-height: 1.5;
-    -moz-tab-size: 4;
-    -o-tab-size: 4;
-    tab-size: 4;
-    -webkit-hyphens: none;
-    -moz-hyphens: none;
-    -ms-hyphens: none;
-    hyphens: none;
-    .token.important,
-    .token.bold {
-      font-weight: bold;
-    }
-    .token.italic {
-      font-style: italic;
-    }
-    .token.entity {
-      cursor: help;
-    }
-    .token.punctuation {
-      opacity: 0.7;
-    }
-    .namespace {
-      opacity: 0.7;
-    }
-
-    ${darkStyleTokens};
-  }
-`;

package/src/ui/Button.tsx

@@ -1,19 +0,0 @@
-import React from 'react';
-import { LinkProps } from 'react-router-dom';
-
-import { Button as RefDocsButton, ButtonProps } from '@theme/Button';
-import { Link } from '@portal/Link';
-
-const StyledButtonAsLink = RefDocsButton.withComponent(Link);
-
-export function Button(
-  props: ButtonProps & Partial<LinkProps<never>> & { ref?: any; external?: boolean },
-): JSX.Element {
-  if (props.to) {
-    return <StyledButtonAsLink {...props} role="button" data-component-name="ui/Button" />;
-  } else {
-    return (
-      <RefDocsButton {...(props as ButtonProps)} role="button" data-component-name="ui/Button" />
-    );
-  }
-}

package/src/ui/Typography.tsx

@@ -1,90 +0,0 @@
-import styled from 'styled-components';
-import { color, typography as typographySystem, ColorProps, TypographyProps } from 'styled-system';
-
-import { typography } from '@theme/utils';
-
-type HeadingProps = TypographyProps &
-  ColorProps & {
-    mt?: string;
-    mb?: string;
-  };
-
-export const Emphasis = styled.strong.attrs(() => ({
-  'data-component-name': 'ui/Typography/Emphasis',
-}))`
-  font-weight: var(--font-weight-bold);
-`;
-
-export const H1 = styled.h1.attrs(() => ({
-  'data-component-name': 'ui/Typography/H1',
-}))<HeadingProps>`
-  ${typography('h1', 'h')};
-  margin: 1.35em 0 0.9em;
-  && {
-    ${({ mt }) => mt && `margin-top: ${mt};`}
-    ${({ mb }) => mb && `margin-bottom: ${mb};`}
-    ${color}
-    ${typographySystem}
-  }
-`;
-
-export const H2 = styled.h2.attrs(() => ({
-  'data-component-name': 'ui/Typography/H2',
-}))<HeadingProps>`
-  ${typography('h2', 'h')};
-  margin: 1.25em 0 0.8em;
-  && {
-    ${({ mt }) => mt && `margin-top: ${mt};`}
-    ${({ mb }) => mb && `margin-bottom: ${mb};`}
-    ${color}
-    ${typographySystem}
-  }
-`;
-
-export const H3 = styled.h3.attrs(() => ({
-  'data-component-name': 'ui/Typography/H3',
-}))<HeadingProps>`
-  ${typography('h3', 'h')};
-  margin: 1.25em 0 0.8em;
-  && {
-    ${({ mt }) => mt && `margin-top: ${mt};`}
-    ${({ mb }) => mb && `margin-bottom: ${mb};`}
-    ${color}
-    ${typographySystem}
-  }
-`;
-
-export const SectionHeader = styled.h2`
-  color: var(--h-color);
-  font-size: 1.75em;
-  font-weight: var(--font-weight-regular);
-  text-align: center;
-  margin: 2.65em 0;
-  padding: 0 20px;
-  font-family: var(--h-font-family);
-`;
-
-export const Typography = styled.p.attrs(() => ({
-  'data-component-name': 'ui/Typography/Typography',
-}))<
-  TypographyProps & {
-    color?: string;
-    mt?: string;
-    mb?: string;
-  }
->`
-  font-size: var(--font-size-base);
-  font-family: var(--font-family-base);
-  line-height: var(--line-height-base);
-  color: var(--color-content);
-  ${color};
-  margin-top: ${({ mt }) => mt || '1em'};
-  margin-bottom: ${({ mb }) => mb || '1em'};
-  ${typographySystem}
-`;
-
-export const CompactTypography = styled(Typography).attrs(() => ({
-  mt: '0em',
-  mb: '0em',
-  'data-component-name': 'ui/Typography/CompactTypography',
-}))``;

package/ui/Arrow.d.ts

@@ -1,7 +0,0 @@
-/// <reference types="react" />
-export interface ArrowProps {
-    direction?: string;
-}
-export declare const Arrow: import("styled-components").StyledComponent<({ className }: {
-    className?: string | undefined;
-}) => JSX.Element, any, ArrowProps, never>;

package/ui/Button.d.ts

@@ -1,7 +0,0 @@
-/// <reference types="react" />
-import { LinkProps } from 'react-router-dom';
-import { ButtonProps } from '../Button';
-export declare function Button(props: ButtonProps & Partial<LinkProps<never>> & {
-    ref?: any;
-    external?: boolean;
-}): JSX.Element;

package/ui/Button.js

@@ -1,30 +0,0 @@
-"use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Button = void 0;
-var react_1 = __importDefault(require("react"));
-var Button_1 = require("../Button");
-var Link_1 = require("../mocks/Link");
-var StyledButtonAsLink = Button_1.Button.withComponent(Link_1.Link);
-function Button(props) {
-    if (props.to) {
-        return react_1.default.createElement(StyledButtonAsLink, __assign({}, props, { role: "button", "data-component-name": "ui/Button" }));
-    }
-    else {
-        return (react_1.default.createElement(Button_1.Button, __assign({}, props, { role: "button", "data-component-name": "ui/Button" })));
-    }
-}
-exports.Button = Button;

package/ui/Typography.d.ts

@@ -1,41 +0,0 @@
-import { ColorProps, TypographyProps } from 'styled-system';
-export declare const Emphasis: import("styled-components").StyledComponent<"strong", any, {
-    'data-component-name': string;
-}, "data-component-name">;
-export declare const H1: import("styled-components").StyledComponent<"h1", any, {
-    'data-component-name': string;
-} & TypographyProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> & ColorProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>, string | number | symbol> & {
-    mt?: string | undefined;
-    mb?: string | undefined;
-}, "data-component-name">;
-export declare const H2: import("styled-components").StyledComponent<"h2", any, {
-    'data-component-name': string;
-} & TypographyProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> & ColorProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>, string | number | symbol> & {
-    mt?: string | undefined;
-    mb?: string | undefined;
-}, "data-component-name">;
-export declare const H3: import("styled-components").StyledComponent<"h3", any, {
-    'data-component-name': string;
-} & TypographyProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> & ColorProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>, string | number | symbol> & {
-    mt?: string | undefined;
-    mb?: string | undefined;
-}, "data-component-name">;
-export declare const SectionHeader: import("styled-components").StyledComponent<"h2", any, {}, never>;
-export declare const Typography: import("styled-components").StyledComponent<"p", any, {
-    'data-component-name': string;
-} & TypographyProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> & {
-    color?: string | undefined;
-    mt?: string | undefined;
-    mb?: string | undefined;
-}, "data-component-name">;
-export declare const CompactTypography: import("styled-components").StyledComponent<"p", any, {
-    'data-component-name': string;
-} & TypographyProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> & {
-    color?: string | undefined;
-    mt?: string | undefined;
-    mb?: string | undefined;
-} & {
-    mt: string;
-    mb: string;
-    'data-component-name': string;
-}, "data-component-name" | "mt" | "mb">;

package/ui/Typography.js

@@ -1,59 +0,0 @@
-"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.CompactTypography = exports.Typography = exports.SectionHeader = exports.H3 = exports.H2 = exports.H1 = exports.Emphasis = void 0;
-var styled_components_1 = __importDefault(require("styled-components"));
-var styled_system_1 = require("styled-system");
-var utils_1 = require("../utils");
-exports.Emphasis = styled_components_1.default.strong.attrs(function () { return ({
-    'data-component-name': 'ui/Typography/Emphasis',
-}); })(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  font-weight: var(--font-weight-bold);\n"], ["\n  font-weight: var(--font-weight-bold);\n"])));
-exports.H1 = styled_components_1.default.h1.attrs(function () { return ({
-    'data-component-name': 'ui/Typography/H1',
-}); })(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  ", ";\n  margin: 1.35em 0 0.9em;\n  && {\n    ", "\n    ", "\n    ", "\n    ", "\n  }\n"], ["\n  ", ";\n  margin: 1.35em 0 0.9em;\n  && {\n    ", "\n    ", "\n    ", "\n    ", "\n  }\n"])), (0, utils_1.typography)('h1', 'h'), function (_a) {
-    var mt = _a.mt;
-    return mt && "margin-top: ".concat(mt, ";");
-}, function (_a) {
-    var mb = _a.mb;
-    return mb && "margin-bottom: ".concat(mb, ";");
-}, styled_system_1.color, styled_system_1.typography);
-exports.H2 = styled_components_1.default.h2.attrs(function () { return ({
-    'data-component-name': 'ui/Typography/H2',
-}); })(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  ", ";\n  margin: 1.25em 0 0.8em;\n  && {\n    ", "\n    ", "\n    ", "\n    ", "\n  }\n"], ["\n  ", ";\n  margin: 1.25em 0 0.8em;\n  && {\n    ", "\n    ", "\n    ", "\n    ", "\n  }\n"])), (0, utils_1.typography)('h2', 'h'), function (_a) {
-    var mt = _a.mt;
-    return mt && "margin-top: ".concat(mt, ";");
-}, function (_a) {
-    var mb = _a.mb;
-    return mb && "margin-bottom: ".concat(mb, ";");
-}, styled_system_1.color, styled_system_1.typography);
-exports.H3 = styled_components_1.default.h3.attrs(function () { return ({
-    'data-component-name': 'ui/Typography/H3',
-}); })(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  ", ";\n  margin: 1.25em 0 0.8em;\n  && {\n    ", "\n    ", "\n    ", "\n    ", "\n  }\n"], ["\n  ", ";\n  margin: 1.25em 0 0.8em;\n  && {\n    ", "\n    ", "\n    ", "\n    ", "\n  }\n"])), (0, utils_1.typography)('h3', 'h'), function (_a) {
-    var mt = _a.mt;
-    return mt && "margin-top: ".concat(mt, ";");
-}, function (_a) {
-    var mb = _a.mb;
-    return mb && "margin-bottom: ".concat(mb, ";");
-}, styled_system_1.color, styled_system_1.typography);
-exports.SectionHeader = styled_components_1.default.h2(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  color: var(--h-color);\n  font-size: 1.75em;\n  font-weight: var(--font-weight-regular);\n  text-align: center;\n  margin: 2.65em 0;\n  padding: 0 20px;\n  font-family: var(--h-font-family);\n"], ["\n  color: var(--h-color);\n  font-size: 1.75em;\n  font-weight: var(--font-weight-regular);\n  text-align: center;\n  margin: 2.65em 0;\n  padding: 0 20px;\n  font-family: var(--h-font-family);\n"])));
-exports.Typography = styled_components_1.default.p.attrs(function () { return ({
-    'data-component-name': 'ui/Typography/Typography',
-}); })(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  font-size: var(--font-size-base);\n  font-family: var(--font-family-base);\n  line-height: var(--line-height-base);\n  color: var(--color-content);\n  ", ";\n  margin-top: ", ";\n  margin-bottom: ", ";\n  ", "\n"], ["\n  font-size: var(--font-size-base);\n  font-family: var(--font-family-base);\n  line-height: var(--line-height-base);\n  color: var(--color-content);\n  ", ";\n  margin-top: ", ";\n  margin-bottom: ", ";\n  ", "\n"])), styled_system_1.color, function (_a) {
-    var mt = _a.mt;
-    return mt || '1em';
-}, function (_a) {
-    var mb = _a.mb;
-    return mb || '1em';
-}, styled_system_1.typography);
-exports.CompactTypography = (0, styled_components_1.default)(exports.Typography).attrs(function () { return ({
-    mt: '0em',
-    mb: '0em',
-    'data-component-name': 'ui/Typography/CompactTypography',
-}); })(templateObject_7 || (templateObject_7 = __makeTemplateObject([""], [""])));
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7;