@redocly/theme 0.9.12 → 0.9.14

package/lib/config.js

@@ -1,216 +1,274 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.ThemeConfig = void 0;
-const zod_1 = require("zod");
-const LogoConfig = zod_1.z
-    .object({
-    image: zod_1.z.string().optional(),
-    altText: zod_1.z.string().optional(),
-    link: zod_1.z.string().optional(),
-    favicon: zod_1.z.string().optional(),
-})
-    .strict();
-const HideConfig = zod_1.z.object({
-    hide: zod_1.z.boolean().optional(),
-});
-const ScriptConfig = zod_1.z
-    .object({
-    src: zod_1.z.string(),
-    async: zod_1.z.boolean().optional(),
-    crossorigin: zod_1.z.string().optional(),
-    defer: zod_1.z.boolean().optional(),
-    fetchpriority: zod_1.z.string().optional(),
-    integrity: zod_1.z.string().optional(),
-    module: zod_1.z.boolean().optional(),
-    nomodule: zod_1.z.boolean().optional(),
-    nonce: zod_1.z.string().optional(),
-    referrerpolicy: zod_1.z.string().optional(),
-    type: zod_1.z.string().optional(),
-})
-    .passthrough();
-const LinksConfig = zod_1.z
-    .object({
-    href: zod_1.z.string(),
-    as: zod_1.z.string().optional(),
-    crossorigin: zod_1.z.string().optional(),
-    fetchpriority: zod_1.z.string().optional(),
-    hreflang: zod_1.z.string().optional(),
-    imagesizes: zod_1.z.string().optional(),
-    imagesrcset: zod_1.z.string().optional(),
-    integrity: zod_1.z.string().optional(),
-    media: zod_1.z.string().optional(),
-    prefetch: zod_1.z.string().optional(),
-    referrerpolicy: zod_1.z.string().optional(),
-    rel: zod_1.z.string().optional(),
-    sizes: zod_1.z.string().optional(),
-    title: zod_1.z.string().optional(),
-    type: zod_1.z.string().optional(),
-})
-    .passthrough();
-const MarkdownConfig = zod_1.z
-    .object({
-    frontMatterKeysToResolve: zod_1.z.array(zod_1.z.string()).default(['image', 'links']).optional(),
-    lastUpdatedBlock: zod_1.z
-        .object({
-        format: zod_1.z.enum(['timeago', 'iso', 'long', 'short']).default('timeago').optional(),
-        locale: zod_1.z.string().default('en-US').optional(),
-    })
-        .extend(HideConfig.shape)
-        .default({})
-        .optional(),
-    toc: zod_1.z
-        .object({
-        header: zod_1.z.string().default('On this page').optional(),
-        depth: zod_1.z.number().default(3).optional(),
-    })
-        .extend(HideConfig.shape)
-        .optional()
-        .default({}),
-    editPage: zod_1.z
-        .object({
-        baseUrl: zod_1.z.string().optional(),
-        icon: zod_1.z.string().optional(),
-        text: zod_1.z.string().optional().default('Edit this page'),
-    })
-        .extend(HideConfig.shape)
-        .default({})
-        .optional(),
-})
-    .strict()
-    .default({});
-exports.ThemeConfig = zod_1.z
-    .object({
-    imports: zod_1.z.array(zod_1.z.string()).default([]).optional(),
-    logo: LogoConfig.optional(),
-    navbar: zod_1.z
-        .object({
-        items: zod_1.z.array(zod_1.z.any()).optional(), // todo: think about validation here
-    })
-        .extend(HideConfig.shape)
-        .strict()
-        .optional(),
-    footer: zod_1.z
-        .object({
-        items: zod_1.z.array(zod_1.z.any()).optional(),
-        copyrightText: zod_1.z.string().optional(),
-    })
-        .extend(HideConfig.shape)
-        .strict()
-        .optional(),
-    sidebar: HideConfig.strict().optional(),
-    scripts: zod_1.z
-        .object({
-        head: zod_1.z.array(ScriptConfig).optional(),
-        body: zod_1.z.array(ScriptConfig).optional(),
-    })
-        .optional(),
-    links: zod_1.z.array(LinksConfig).optional(),
-    feedback: zod_1.z
-        .object({
-        type: zod_1.z.enum(['rating', 'sentiment', 'comment', 'reasons']).default('sentiment'),
-        settings: zod_1.z
-            .object({
-            label: zod_1.z.string().optional(),
-            submitText: zod_1.z.string().optional(),
-            max: zod_1.z.number().optional(),
-            buttonText: zod_1.z.string().optional(),
-            multi: zod_1.z.boolean().optional(),
-            items: zod_1.z.array(zod_1.z.string()).min(1).optional(),
-            reasons: zod_1.z
-                .object({
-                enable: zod_1.z.boolean().default(true),
-                multi: zod_1.z.boolean().optional(),
-                label: zod_1.z.string().optional(),
-                items: zod_1.z.array(zod_1.z.string()),
-            })
-                .optional(),
-            comment: zod_1.z
-                .object({
-                enable: zod_1.z.boolean().default(true),
-                label: zod_1.z.string().optional(),
-                likeLabel: zod_1.z.string().optional(),
-                dislikeLabel: zod_1.z.string().optional(),
-            })
-                .optional(),
-        })
-            .optional(),
-    })
-        .extend(HideConfig.shape)
-        .strict()
-        .default({})
-        .optional(),
-    search: zod_1.z
-        .object({
-        placement: zod_1.z.string().default('navbar').optional(),
-        shortcuts: zod_1.z.array(zod_1.z.string()).default(['/']).optional(),
-    })
-        .extend(HideConfig.shape)
-        .strict()
-        .default({})
-        .optional(),
-    colorMode: zod_1.z
-        .object({
-        ignoreDetection: zod_1.z.boolean().optional(),
-        modes: zod_1.z.array(zod_1.z.string()).default(['light', 'dark']).optional(),
-    })
-        .extend(HideConfig.shape)
-        .strict()
-        .optional()
-        .default({}),
-    navigation: zod_1.z
-        .object({
-        nextButton: zod_1.z
-            .object({ text: zod_1.z.string().default('Next to {label}') })
-            .extend(HideConfig.shape)
-            .optional()
-            .default({}),
-        previousButton: zod_1.z
-            .object({ text: zod_1.z.string().default('Back to {label}') })
-            .extend(HideConfig.shape)
-            .optional()
-            .default({}),
-    })
-        .strict()
-        .optional()
-        .default({}),
-    codeSnippet: zod_1.z
-        .object({
-        copy: zod_1.z
-            .object({
-            buttonText: zod_1.z.string().default('Copy').optional(),
-            tooltipText: zod_1.z.string().default('Copy to clipboard').optional(),
-            toasterText: zod_1.z.string().default('Copied!').optional(),
-            toasterDuration: zod_1.z.number().default(1500).optional(),
-        })
-            .extend(HideConfig.shape)
-            .optional()
-            .default({}),
-        report: zod_1.z
-            .object({
-            tooltipText: zod_1.z.string().default('Report a problem').optional(),
-            label: zod_1.z.string().optional(),
-        })
-            .extend(HideConfig.shape)
-            .optional()
-            .default({ hide: true }),
-    })
-        .strict()
-        .default({})
-        .optional(),
-    markdown: MarkdownConfig.optional(),
-    openapi: zod_1.z.object({}).passthrough().optional(),
-    graphql: zod_1.z.object({}).passthrough().optional(),
-    analytics: zod_1.z.any().optional(),
-    userProfile: zod_1.z
-        .object({
-        loginLabel: zod_1.z.string().default('Login').optional(),
-        logoutLabel: zod_1.z.string().default('Logout').optional(),
-        menu: zod_1.z.array(zod_1.z.any()).optional(), // should be same as navbar items type
-    })
-        .extend(HideConfig.shape)
-        .optional()
-        .default({}),
-})
-    .passthrough()
-    .default({});
+exports.themeConfigSchema = void 0;
+const logoConfigSchema = {
+    type: 'object',
+    properties: {
+        image: { type: 'string' },
+        altText: { type: 'string' },
+        link: { type: 'string' },
+        favicon: { type: 'string' },
+    },
+    additionalProperties: false,
+};
+const hideConfigSchema = {
+    type: 'object',
+    properties: {
+        hide: { type: 'boolean' },
+    },
+    additionalProperties: false,
+};
+const scriptConfigSchema = {
+    type: 'object',
+    properties: {
+        src: { type: 'string' },
+        async: { type: 'boolean' },
+        crossorigin: { type: 'string' },
+        defer: { type: 'boolean' },
+        fetchpriority: { type: 'string' },
+        integrity: { type: 'string' },
+        module: { type: 'boolean' },
+        nomodule: { type: 'boolean' },
+        nonce: { type: 'string' },
+        referrerpolicy: { type: 'string' },
+        type: { type: 'string' },
+    },
+    required: ['src'],
+    additionalProperties: true,
+};
+const linksConfigSchema = {
+    type: 'object',
+    properties: {
+        href: { type: 'string' },
+        as: { type: 'string' },
+        crossorigin: { type: 'string' },
+        fetchpriority: { type: 'string' },
+        hreflang: { type: 'string' },
+        imagesizes: { type: 'string' },
+        imagesrcset: { type: 'string' },
+        integrity: { type: 'string' },
+        media: { type: 'string' },
+        prefetch: { type: 'string' },
+        referrerpolicy: { type: 'string' },
+        rel: { type: 'string' },
+        sizes: { type: 'string' },
+        title: { type: 'string' },
+        type: { type: 'string' },
+    },
+    required: ['href'],
+    additionalProperties: true,
+};
+const markdownConfigSchema = {
+    type: 'object',
+    properties: {
+        frontMatterKeysToResolve: {
+            type: 'array',
+            items: { type: 'string' },
+            default: ['image', 'links'],
+        },
+        lastUpdatedBlock: {
+            type: 'object',
+            properties: Object.assign({ format: {
+                    type: 'string',
+                    enum: ['timeago', 'iso', 'long', 'short'],
+                    default: 'timeago',
+                }, locale: { type: 'string', default: 'en-US' } }, hideConfigSchema.properties),
+            additionalProperties: false,
+            default: {},
+        },
+        toc: {
+            type: 'object',
+            properties: Object.assign({ header: { type: 'string', default: 'On this page' }, depth: { type: 'number', default: 3 } }, hideConfigSchema.properties),
+            additionalProperties: false,
+            default: {},
+        },
+        editPage: {
+            type: 'object',
+            properties: Object.assign({ baseUrl: { type: 'string' }, icon: { type: 'string' }, text: { type: 'string', default: 'Edit this page' } }, hideConfigSchema.properties),
+            additionalProperties: false,
+            default: {},
+        },
+    },
+    additionalProperties: false,
+    default: {},
+};
+const navItemSchema = {
+    type: 'object',
+    properties: {
+        page: { type: 'string' },
+        directory: { type: 'string' },
+        group: { type: 'string' },
+        label: { type: 'string' },
+        separator: { type: 'string' },
+        separatorLine: { type: 'boolean' },
+        version: { type: 'string' },
+        menuStyle: { type: 'string', enum: ['drilldown'] },
+        expanded: { type: 'string', const: 'always' },
+        selectFirstItemOnExpand: { type: 'boolean' },
+        flatten: { type: 'boolean' },
+    },
+};
+const navItemsSchema = {
+    type: 'array',
+    items: Object.assign(Object.assign({}, navItemSchema), { properties: Object.assign(Object.assign({}, navItemSchema.properties), { items: { type: 'array', items: navItemSchema } }) }),
+};
+exports.themeConfigSchema = {
+    type: 'object',
+    properties: {
+        imports: {
+            type: 'array',
+            items: { type: 'string' },
+            default: [],
+        },
+        logo: logoConfigSchema,
+        navbar: {
+            type: 'object',
+            properties: Object.assign({ items: navItemsSchema }, hideConfigSchema.properties),
+            additionalProperties: false,
+        },
+        footer: {
+            type: 'object',
+            properties: Object.assign({ items: navItemsSchema, copyrightText: { type: 'string' } }, hideConfigSchema.properties),
+            additionalProperties: false,
+        },
+        sidebar: hideConfigSchema,
+        scripts: {
+            type: 'object',
+            properties: {
+                head: { type: 'array', items: scriptConfigSchema },
+                body: { type: 'array', items: scriptConfigSchema },
+            },
+            additionalProperties: false,
+        },
+        links: { type: 'array', items: linksConfigSchema },
+        feedback: {
+            type: 'object',
+            properties: {
+                type: {
+                    type: 'string',
+                    enum: ['rating', 'sentiment', 'comment', 'reasons'],
+                    default: 'sentiment',
+                },
+                settings: Object.assign({ type: 'object', properties: {
+                        label: { type: 'string' },
+                        submitText: { type: 'string' },
+                        max: { type: 'number' },
+                        buttonText: { type: 'string' },
+                        multi: { type: 'boolean' },
+                        items: { type: 'array', items: { type: 'string' }, minItems: 1 },
+                        reasons: {
+                            type: 'object',
+                            properties: {
+                                enable: { type: 'boolean', default: true },
+                                multi: { type: 'boolean' },
+                                label: { type: 'string' },
+                                items: { type: 'array', items: { type: 'string' } },
+                            },
+                            additionalProperties: false,
+                        },
+                        comment: {
+                            type: 'object',
+                            properties: {
+                                enable: { type: 'boolean', default: true },
+                                label: { type: 'string' },
+                                likeLabel: { type: 'string' },
+                                dislikeLabel: { type: 'string' },
+                            },
+                            additionalProperties: false,
+                        },
+                    }, additionalProperties: false }, hideConfigSchema.properties),
+            },
+            additionalProperties: false,
+            default: {},
+        },
+        search: {
+            type: 'object',
+            properties: Object.assign({ placement: {
+                    type: 'string',
+                    default: 'navbar',
+                }, shortcuts: {
+                    type: 'array',
+                    items: { type: 'string' },
+                    default: ['/'],
+                } }, hideConfigSchema.properties),
+            additionalProperties: false,
+            default: {},
+        },
+        colorMode: {
+            type: 'object',
+            properties: Object.assign({ ignoreDetection: { type: 'boolean' }, modes: {
+                    type: 'array',
+                    items: { type: 'string' },
+                    default: ['light', 'dark'],
+                } }, hideConfigSchema.properties),
+            additionalProperties: false,
+            default: {},
+        },
+        navigation: {
+            type: 'object',
+            properties: {
+                nextButton: {
+                    type: 'object',
+                    properties: Object.assign({ text: { type: 'string', default: 'Next to {label}' } }, hideConfigSchema.properties),
+                    additionalProperties: false,
+                    default: {},
+                },
+                previousButton: {
+                    type: 'object',
+                    properties: Object.assign({ text: { type: 'string', default: 'Back to {label}' } }, hideConfigSchema.properties),
+                    additionalProperties: false,
+                    default: {},
+                },
+            },
+            additionalProperties: false,
+            default: {},
+        },
+        codeSnippet: {
+            type: 'object',
+            properties: {
+                copy: {
+                    type: 'object',
+                    properties: Object.assign({ buttonText: { type: 'string', default: 'Copy' }, tooltipText: { type: 'string', default: 'Copy to clipboard' }, toasterText: { type: 'string', default: 'Copied!' }, toasterDuration: { type: 'number', default: 1500 } }, hideConfigSchema.properties),
+                    additionalProperties: false,
+                    default: {},
+                },
+                report: {
+                    type: 'object',
+                    properties: Object.assign({ tooltipText: { type: 'string', default: 'Report a problem' }, label: { type: 'string' } }, hideConfigSchema.properties),
+                    additionalProperties: false,
+                    default: { hide: true },
+                },
+            },
+            additionalProperties: false,
+            default: {},
+        },
+        markdown: markdownConfigSchema,
+        openapi: { type: 'object', additionalProperties: true },
+        graphql: { type: 'object', additionalProperties: true },
+        analytics: {
+            type: ['array', 'boolean', 'number', 'object', 'string'],
+        },
+        userProfile: {
+            type: 'object',
+            properties: Object.assign({ loginLabel: { type: 'string', default: 'Login' }, logoutLabel: { type: 'string', default: 'Logout' }, menu: {
+                    type: 'array',
+                    items: {
+                        type: 'object',
+                        properties: {
+                            label: { type: 'string' },
+                            external: { type: 'boolean' },
+                            link: { type: 'string' },
+                            separatorLine: { type: 'boolean' },
+                        },
+                        additionalProperties: true,
+                    },
+                    default: [],
+                } }, hideConfigSchema.properties),
+            additionalProperties: false,
+            default: {},
+        },
+    },
+    additionalProperties: true,
+    default: {},
+};
 //# sourceMappingURL=config.js.map

package/lib/globalStyle.js

@@ -1273,8 +1273,7 @@ const apiReferenceDocs = (0, styled_components_1.css) `
   /**
   * @tokens API Reference Schemas Layout
   */
-
-  --layout-controls-top-offset: 20px; // @presenter Spacing
+  --layout-controls-margin: 20px; // @presenter Spacing
   --layout-controls-height: 36px; // @presenter Spacing
   --layout-controls-width: 36px; // @presenter Spacing
 

package/lib/index.d.ts

@@ -24,3 +24,4 @@ export * from './config';
 export * from './Pages';
 export * from './Markdown';
 export * from './ReferenceDocs';
+export * from './SidebarActions';

package/lib/index.js

@@ -40,4 +40,5 @@ __exportStar(require("./config"), exports);
 __exportStar(require("./Pages"), exports);
 __exportStar(require("./Markdown"), exports);
 __exportStar(require("./ReferenceDocs"), exports);
+__exportStar(require("./SidebarActions"), exports);
 //# sourceMappingURL=index.js.map

package/package.json

@@ -1,7 +1,8 @@
 {
   "name": "@redocly/theme",
-  "version": "0.9.12",
+  "version": "0.9.14",
   "description": "Shared UI components lib",
+  "keywords": [],
   "author": "team@redocly.com",
   "license": "SEE LICENSE IN LICENSE",
   "main": "lib/index.js",
@@ -12,7 +13,6 @@
     "./config": "./lib/config.js",
     ".": "./lib/index.js",
     "./Sidebar/*": "./lib/Sidebar/*.js",
-    "./*": "./lib/index.js",
     "./src/": "./src/"
   },
   "peerDependencies": {
@@ -22,8 +22,7 @@
     "react-dom": "^17.0.2",
     "react-router-dom": "^6.4.4",
     "styled-components": "^5.3.6",
-    "styled-system": "^5.1.5",
-    "zod": ">=3.19.1"
+    "styled-system": "^5.1.5"
   },
   "devDependencies": {
     "@storybook/addon-actions": "^6.5.9",
@@ -58,11 +57,11 @@
     "@typescript-eslint/parser": "^5.23.0",
     "chromatic": "^6.10.2",
     "concurrently": "^7.4.0",
-    "esbuild": "^0.15.11",
     "jest": "^29.2.2",
     "jest-environment-jsdom": "^29.2.2",
     "jest-styled-components": "^7.1.1",
     "jest-when": "^3.5.1",
+    "json-schema-to-ts": "^2.7.2",
     "lodash.throttle": "^4.1.1",
     "npm-run-all": "^4.1.5",
     "react-refresh": "^0.14.0",
@@ -77,10 +76,10 @@
     "tsc-alias": "^1.8.2",
     "tsconfig-paths-webpack-plugin": "^3.5.2",
     "typescript": "^4.8.4",
-    "webpack": "^5.72.0",
-    "zod": ">=3.19.1"
+    "webpack": "^5.72.0"
   },
   "dependencies": {
+    "@redocly/ajv": "^8.11.0",
     "copy-to-clipboard": "^3.3.3",
     "highlight-words-core": "^1.2.2",
     "hotkeys-js": "^3.10.1",

package/src/Markdown/MarkdownWrapper.tsx

@@ -2,7 +2,7 @@ import styled, { css } from 'styled-components';
 
 import type { FlattenSimpleInterpolation } from 'styled-components';
 
-import { typography } from '@theme/utils';
+import { typography } from '@theme/utils/theme-helpers';
 
 export const baseTable = css`
   table.md {

package/src/Sidebar/FooterWrapper.tsx

@@ -1,8 +1,11 @@
 import styled from 'styled-components';
-
-export const FooterWrapper = styled.div.attrs(() => ({
-  'data-component-name': 'Sidebar/FooterWrapper',
-}))`
+export const FooterWrapper = styled.div<{ collapsed?: boolean }>`
+  ${({ collapsed }) =>
+    collapsed &&
+    `
+        position: sticky;
+        bottom: 0;
+    `}
   margin: var(--sidebar-offset-top) 0 var(--sidebar-spacing-unit) var(--sidebar-offset-left);
   padding-top: var(--sidebar-spacing-unit);
   padding-right: var(--sidebar-spacing-unit);