@redocly/theme 0.44.2 → 0.44.4

package/lib/icons/Spinner/Spinner.d.ts

@@ -1,11 +1,10 @@
-/// <reference types="react" />
 import type { IconProps } from '../../icons/types';
 export declare const Spinner: import("styled-components").StyledComponent<(props: IconProps) => import("react").JSX.Element, any, {
     'data-component-name': string;
 } & {
-    color?: string | undefined;
-    size?: string | undefined;
-    className?: string | undefined;
+    color?: string;
+    size?: string;
+    className?: string;
 } & import("react").SVGProps<SVGSVGElement> & {
     'data-component-name': string;
 }, "data-component-name">;

package/lib/icons/StarFilledIcon/StarFilledIcon.d.ts

@@ -3,7 +3,7 @@ import type { IconProps } from '../../icons/types';
 export declare const StarFilledIcon: import("styled-components").StyledComponent<(props: IconProps) => React.JSX.Element, any, {
     'data-component-name': string;
 } & {
-    color?: string | undefined;
-    size?: string | undefined;
-    className?: string | undefined;
+    color?: string;
+    size?: string;
+    className?: string;
 } & React.SVGProps<SVGSVGElement>, "data-component-name">;

package/lib/icons/StarIcon/StarIcon.d.ts

@@ -3,7 +3,7 @@ import type { IconProps } from '../../icons/types';
 export declare const StarIcon: import("styled-components").StyledComponent<(props: IconProps) => React.JSX.Element, any, {
     'data-component-name': string;
 } & {
-    color?: string | undefined;
-    size?: string | undefined;
-    className?: string | undefined;
+    color?: string;
+    size?: string;
+    className?: string;
 } & React.SVGProps<SVGSVGElement>, "data-component-name">;

package/lib/icons/SubtractIcon/SubtractIcon.d.ts

@@ -3,7 +3,7 @@ import type { IconProps } from '../../icons/types';
 export declare const SubtractIcon: import("styled-components").StyledComponent<(props: IconProps) => React.JSX.Element, any, {
     'data-component-name': string;
 } & {
-    color?: string | undefined;
-    size?: string | undefined;
-    className?: string | undefined;
+    color?: string;
+    size?: string;
+    className?: string;
 } & React.SVGProps<SVGSVGElement>, "data-component-name">;

package/lib/icons/SunIcon/SunIcon.d.ts

@@ -3,7 +3,7 @@ import type { IconProps } from '../../icons/types';
 export declare const SunIcon: import("styled-components").StyledComponent<(props: IconProps) => React.JSX.Element, any, {
     'data-component-name': string;
 } & {
-    color?: string | undefined;
-    size?: string | undefined;
-    className?: string | undefined;
+    color?: string;
+    size?: string;
+    className?: string;
 } & React.SVGProps<SVGSVGElement>, "data-component-name">;

package/lib/icons/TableBuiltIcon/TableBuiltIcon.d.ts

@@ -3,7 +3,7 @@ import type { IconProps } from '../../icons/types';
 export declare const TableBuiltIcon: import("styled-components").StyledComponent<(props: IconProps) => React.JSX.Element, any, {
     'data-component-name': string;
 } & {
-    color?: string | undefined;
-    size?: string | undefined;
-    className?: string | undefined;
+    color?: string;
+    size?: string;
+    className?: string;
 } & React.SVGProps<SVGSVGElement>, "data-component-name">;

package/lib/icons/TimeIcon/TimeIcon.d.ts

@@ -3,7 +3,7 @@ import type { IconProps } from '../../icons/types';
 export declare const TimeIcon: import("styled-components").StyledComponent<(props: IconProps) => React.JSX.Element, any, {
     'data-component-name': string;
 } & {
-    color?: string | undefined;
-    size?: string | undefined;
-    className?: string | undefined;
+    color?: string;
+    size?: string;
+    className?: string;
 } & React.SVGProps<SVGSVGElement>, "data-component-name">;

package/lib/icons/TrashCanIcon/TrashCanIcon.d.ts

@@ -3,7 +3,7 @@ import type { IconProps } from '../../icons/types';
 export declare const TrashCanIcon: import("styled-components").StyledComponent<(props: IconProps) => React.JSX.Element, any, {
     'data-component-name': string;
 } & {
-    color?: string | undefined;
-    size?: string | undefined;
-    className?: string | undefined;
+    color?: string;
+    size?: string;
+    className?: string;
 } & React.SVGProps<SVGSVGElement>, "data-component-name">;

package/lib/icons/UserIcon/UserIcon.d.ts

@@ -3,7 +3,7 @@ import type { IconProps } from '../../icons/types';
 export declare const UserIcon: import("styled-components").StyledComponent<(props: IconProps) => React.JSX.Element, any, {
     'data-component-name': string;
 } & {
-    color?: string | undefined;
-    size?: string | undefined;
-    className?: string | undefined;
+    color?: string;
+    size?: string;
+    className?: string;
 } & React.SVGProps<SVGSVGElement>, "data-component-name">;

package/lib/icons/ValueVariableIcon/ValueVariableIcon.d.ts

@@ -3,7 +3,7 @@ import type { IconProps } from '../../icons/types';
 export declare const ValueVariableIcon: import("styled-components").StyledComponent<(props: IconProps) => React.JSX.Element, any, {
     'data-component-name': string;
 } & {
-    color?: string | undefined;
-    size?: string | undefined;
-    className?: string | undefined;
+    color?: string;
+    size?: string;
+    className?: string;
 } & React.SVGProps<SVGSVGElement>, "data-component-name">;

package/lib/icons/VerticalViewIcon/VerticalViewIcon.d.ts

@@ -3,7 +3,7 @@ import type { IconProps } from '../../icons/types';
 export declare const VerticalViewIcon: import("styled-components").StyledComponent<(props: IconProps) => React.JSX.Element, any, {
     'data-component-name': string;
 } & {
-    color?: string | undefined;
-    size?: string | undefined;
-    className?: string | undefined;
+    color?: string;
+    size?: string;
+    className?: string;
 } & React.SVGProps<SVGSVGElement>, "data-component-name">;

package/lib/icons/ViewIcon/ViewIcon.d.ts

@@ -3,7 +3,7 @@ import type { IconProps } from '../../icons/types';
 export declare const ViewIcon: import("styled-components").StyledComponent<(props: IconProps) => React.JSX.Element, any, {
     'data-component-name': string;
 } & {
-    color?: string | undefined;
-    size?: string | undefined;
-    className?: string | undefined;
+    color?: string;
+    size?: string;
+    className?: string;
 } & React.SVGProps<SVGSVGElement>, "data-component-name">;

package/lib/icons/ViewOffIcon/ViewOffIcon.d.ts

@@ -3,7 +3,7 @@ import type { IconProps } from '../../icons/types';
 export declare const ViewOffIcon: import("styled-components").StyledComponent<(props: IconProps) => React.JSX.Element, any, {
     'data-component-name': string;
 } & {
-    color?: string | undefined;
-    size?: string | undefined;
-    className?: string | undefined;
+    color?: string;
+    size?: string;
+    className?: string;
 } & React.SVGProps<SVGSVGElement>, "data-component-name">;

package/lib/icons/WarningAltIcon/WarningAltIcon.d.ts

@@ -3,7 +3,7 @@ import type { IconProps } from '../../icons/types';
 export declare const WarningAltIcon: import("styled-components").StyledComponent<(props: IconProps) => React.JSX.Element, any, {
     'data-component-name': string;
 } & {
-    color?: string | undefined;
-    size?: string | undefined;
-    className?: string | undefined;
+    color?: string;
+    size?: string;
+    className?: string;
 } & React.SVGProps<SVGSVGElement>, "data-component-name">;

package/lib/icons/WarningFilledIcon/WarningFilledIcon.d.ts

@@ -3,7 +3,7 @@ import type { IconProps } from '../../icons/types';
 export declare const WarningFilledIcon: import("styled-components").StyledComponent<(props: IconProps) => React.JSX.Element, any, {
     'data-component-name': string;
 } & {
-    color?: string | undefined;
-    size?: string | undefined;
-    className?: string | undefined;
+    color?: string;
+    size?: string;
+    className?: string;
 } & React.SVGProps<SVGSVGElement>, "data-component-name">;

package/lib/icons/WarningSquareIcon/WarningSquareIcon.d.ts

@@ -3,7 +3,7 @@ import type { IconProps } from '../../icons/types';
 export declare const WarningSquareIcon: import("styled-components").StyledComponent<(props: IconProps) => React.JSX.Element, any, {
     'data-component-name': string;
 } & {
-    color?: string | undefined;
-    size?: string | undefined;
-    className?: string | undefined;
+    color?: string;
+    size?: string;
+    className?: string;
 } & React.SVGProps<SVGSVGElement>, "data-component-name">;

package/lib/index.d.ts

@@ -209,6 +209,7 @@ export * from './icons/PlusCustomIcon/PlusCustomIcon';
 export * from './icons/CharacterIcon/CharacterIcon';
 export * from './icons/FileIcon/FileIcon';
 export * from './icons/ExportIcon/ExportIcon';
+export * from './icons/CertificateIcon/CertificateIcon';
 export * from './layouts/RootLayout';
 export * from './layouts/PageLayout';
 export * from './layouts/NotFound';

package/lib/index.js

@@ -261,6 +261,7 @@ __exportStar(require("./icons/PlusCustomIcon/PlusCustomIcon"), exports);
 __exportStar(require("./icons/CharacterIcon/CharacterIcon"), exports);
 __exportStar(require("./icons/FileIcon/FileIcon"), exports);
 __exportStar(require("./icons/ExportIcon/ExportIcon"), exports);
+__exportStar(require("./icons/CertificateIcon/CertificateIcon"), exports);
 /* Layouts */
 __exportStar(require("./layouts/RootLayout"), exports);
 __exportStar(require("./layouts/PageLayout"), exports);

package/lib/layouts/DocumentationLayout.js

@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.DocumentationLayout = void 0;
+exports.DocumentationLayout = DocumentationLayout;
 const react_1 = __importDefault(require("react"));
 const styled_components_1 = __importDefault(require("styled-components"));
 const EditPageButton_1 = require("../components/Buttons/EditPageButton");
@@ -26,7 +26,6 @@ function DocumentationLayout({ tableOfContent, feedback, config, editPage, lastM
             react_1.default.createElement(PageNavigation_1.PageNavigation, { nextPage: nextPage, prevPage: prevPage })),
         tableOfContent));
 }
-exports.DocumentationLayout = DocumentationLayout;
 const LayoutWrapper = styled_components_1.default.div.attrs(({ className }) => ({
     className,
 })) `

package/lib/layouts/Forbidden.js

@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Forbidden = void 0;
+exports.Forbidden = Forbidden;
 const react_1 = __importDefault(require("react"));
 const styled_components_1 = __importDefault(require("styled-components"));
 const hooks_1 = require("../core/hooks");
@@ -16,7 +16,6 @@ function Forbidden() {
         react_1.default.createElement(Description, { "data-translation-key": "page.forbidden.title" }, translate('page.forbidden.title', 'Access forbidden')),
         react_1.default.createElement(HomeButton, { variant: "primary", size: "large", to: "/", "data-translation-key": "page.homeButton" }, translate('page.homeButton', 'Go home'))));
 }
-exports.Forbidden = Forbidden;
 const Wrapper = styled_components_1.default.div `
   display: flex;
   flex-direction: column;

package/lib/layouts/NotFound.js

@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.NotFound = void 0;
+exports.NotFound = NotFound;
 const react_1 = __importDefault(require("react"));
 const styled_components_1 = __importDefault(require("styled-components"));
 const hooks_1 = require("../core/hooks");
@@ -18,7 +18,6 @@ function NotFound() {
         react_1.default.createElement(Description, { "data-translation-key": "page.notFound.description" }, translate('page.notFound.description', "The page you were trying to reach doesn't exist or may have been moved. You can go back to the previous page, return to the homepage, or use the search bar to find what you're looking for.")),
         react_1.default.createElement(Button_1.Button, { variant: "primary", size: "large", to: "/", "data-translation-key": "page.homeButton", icon: react_1.default.createElement(ArrowLeftIcon_1.ArrowLeftIcon, null) }, translate('page.homeButton', 'Go home'))));
 }
-exports.NotFound = NotFound;
 const NotFoundWrapper = styled_components_1.default.div `
   height: 100%;
   max-width: var(--page-404-max-width);

package/lib/layouts/OIDCForbidden.js

@@ -26,7 +26,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.OIDCForbidden = void 0;
+exports.OIDCForbidden = OIDCForbidden;
 const react_1 = __importStar(require("react"));
 const styled_components_1 = __importDefault(require("styled-components"));
 const react_router_dom_1 = require("react-router-dom");
@@ -52,7 +52,6 @@ function OIDCForbidden() {
         react_1.default.createElement(Description, { "data-translation-key": "page.forbidden.title" }, translate('page.forbidden.title', 'Access forbidden')),
         errorDescription && react_1.default.createElement(ErrorDescription, null, renderText(errorDescription))));
 }
-exports.OIDCForbidden = OIDCForbidden;
 const Wrapper = styled_components_1.default.div `
   display: flex;
   flex-direction: column;

package/lib/layouts/PageLayout.js

@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.PageLayout = void 0;
+exports.PageLayout = PageLayout;
 const react_1 = __importDefault(require("react"));
 const styled_components_1 = __importDefault(require("styled-components"));
 const utils_1 = require("../core/utils");
@@ -12,7 +12,6 @@ function PageLayout({ sidebar, children, }) {
         sidebar,
         react_1.default.createElement(ContentContainer, null, children)));
 }
-exports.PageLayout = PageLayout;
 const Container = styled_components_1.default.div `
   display: flex;
   flex-direction: row;

package/lib/layouts/RootLayout.js

@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.RootLayout = void 0;
+exports.RootLayout = RootLayout;
 const react_1 = __importDefault(require("react"));
 const Navbar_1 = require("../components/Navbar/Navbar");
 const Footer_1 = require("../components/Footer/Footer");
@@ -13,5 +13,4 @@ function RootLayout({ children }) {
         children,
         react_1.default.createElement(Footer_1.Footer, null)));
 }
-exports.RootLayout = RootLayout;
 //# sourceMappingURL=RootLayout.js.map

package/lib/layouts/ThreePanelLayout.js

@@ -37,7 +37,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.ThreePanelLayout = void 0;
+exports.ThreePanelLayout = ThreePanelLayout;
 const react_1 = __importDefault(require("react"));
 const styled_components_1 = __importStar(require("styled-components"));
 const config_1 = require("@redocly/config");
@@ -46,7 +46,6 @@ function ThreePanelLayout(_a) {
     var { children } = _a, props = __rest(_a, ["children"]);
     return (react_1.default.createElement(Wrapper, Object.assign({ "data-component-name": "Layout/ThreePanelLayout" }, props), children));
 }
-exports.ThreePanelLayout = ThreePanelLayout;
 const Wrapper = styled_components_1.default.div `
   position: relative;
   display: flex;

package/lib/markdoc/components/Admonition/Admonition.js

@@ -3,11 +3,10 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Admonition = void 0;
+exports.Admonition = Admonition;
 const react_1 = __importDefault(require("react"));
 const Admonition_1 = require("../../../components/Admonition/Admonition");
 function Admonition(props) {
     return react_1.default.createElement(Admonition_1.Admonition, Object.assign({}, props));
 }
-exports.Admonition = Admonition;
 //# sourceMappingURL=Admonition.js.map

package/lib/markdoc/components/Cards/Card.js

@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Card = void 0;
+exports.Card = Card;
 const react_1 = __importDefault(require("react"));
 const styled_components_1 = __importDefault(require("styled-components"));
 const ChevronRightIcon_1 = require("../../../icons/ChevronRightIcon/ChevronRightIcon");
@@ -28,7 +28,6 @@ function Card({ title, image, icon, iconRawContent, imagePosition = 'start', lay
                         !!to && react_1.default.createElement(CardLinkIcon, null)),
                     react_1.default.createElement(Body, { "$lineClamp": lineClamp }, children))))));
 }
-exports.Card = Card;
 const CardContentWrapper = styled_components_1.default.div `
   display: flex;
   flex-direction: ${({ $layout }) => ($layout === 'horizontal' ? 'row' : 'column')};

package/lib/markdoc/components/Cards/CardIcon.js

@@ -3,14 +3,13 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.CardIcon = void 0;
+exports.CardIcon = CardIcon;
 const react_1 = __importDefault(require("react"));
 const styled_components_1 = __importDefault(require("styled-components"));
 const InlineSvg_1 = require("../../../markdoc/components/InlineSvg/InlineSvg");
 function CardIcon({ variant, src, rawContent }) {
     return (react_1.default.createElement(CardIconWrapper, { "$variant": variant }, rawContent ? react_1.default.createElement(CardSvg, { fileRawContent: rawContent }) : react_1.default.createElement(CardImg, { src: src })));
 }
-exports.CardIcon = CardIcon;
 const CardImg = styled_components_1.default.img `
   width: var(--card-icon-width);
   height: var(--card-icon-height);

package/lib/markdoc/components/Cards/CardImage.js

@@ -3,13 +3,12 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.CardImage = void 0;
+exports.CardImage = CardImage;
 const react_1 = __importDefault(require("react"));
 const styled_components_1 = __importDefault(require("styled-components"));
 function CardImage({ src, alt, position }) {
     return react_1.default.createElement(Image, { src: src, alt: alt, "$position": position });
 }
-exports.CardImage = CardImage;
 const Image = styled_components_1.default.img `
   width: 100%;
   height: 100px;

package/lib/markdoc/components/Cards/Cards.js

@@ -26,13 +26,12 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Cards = void 0;
+exports.Cards = Cards;
 const React = __importStar(require("react"));
 const styled_components_1 = __importDefault(require("styled-components"));
 function Cards({ cardMinWidth = 240, columns, className, children, ariaLabel }) {
     return (React.createElement(GridLayout, { "$cardMinWidth": cardMinWidth, "$columns": columns, className: className, "aria-label": ariaLabel }, children));
 }
-exports.Cards = Cards;
 const GridLayout = styled_components_1.default.div `
   display: grid;
   grid-template-columns: ${({ $cardMinWidth, $columns }) => `repeat(auto-fit, minmax(${getCardMinWidth($cardMinWidth, $columns)}, 1fr))`};

package/lib/markdoc/components/CodeBlock/CodeBlock.js

@@ -3,11 +3,10 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.CodeBlock = void 0;
+exports.CodeBlock = CodeBlock;
 const react_1 = __importDefault(require("react"));
 const CodeBlock_1 = require("../../../components/CodeBlock/CodeBlock");
 function CodeBlock(props) {
     return react_1.default.createElement(CodeBlock_1.CodeBlock, Object.assign({}, props));
 }
-exports.CodeBlock = CodeBlock;
 //# sourceMappingURL=CodeBlock.js.map

package/lib/markdoc/components/Heading/Heading.js

@@ -23,7 +23,7 @@ var __importStar = (this && this.__importStar) || function (mod) {
     return result;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Heading = void 0;
+exports.Heading = Heading;
 const react_1 = __importStar(require("react"));
 const utils_1 = require("../../../core/utils");
 const LinkIcon_1 = require("../../../icons/LinkIcon/LinkIcon");
@@ -44,5 +44,4 @@ function Heading({ level, id, children, 'data-source': dataSource, 'data-hash':
         linkEl,
         children));
 }
-exports.Heading = Heading;
 //# sourceMappingURL=Heading.js.map

package/lib/markdoc/components/HtmlBlock/HtmlBlock.js

@@ -23,10 +23,9 @@ var __importStar = (this && this.__importStar) || function (mod) {
     return result;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.HtmlBlock = void 0;
+exports.HtmlBlock = HtmlBlock;
 const React = __importStar(require("react"));
 function HtmlBlock({ rawHtml }) {
     return React.createElement("div", { dangerouslySetInnerHTML: { __html: rawHtml } });
 }
-exports.HtmlBlock = HtmlBlock;
 //# sourceMappingURL=HtmlBlock.js.map

package/lib/markdoc/components/InlineSvg/InlineSvg.js

@@ -23,10 +23,9 @@ var __importStar = (this && this.__importStar) || function (mod) {
     return result;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.InlineSvg = void 0;
+exports.InlineSvg = InlineSvg;
 const React = __importStar(require("react"));
 function InlineSvg({ fileRawContent, className, }) {
     return (React.createElement("span", { className: className, "data-component-name": "Markdoc/InlineSvg/InlineSvg", dangerouslySetInnerHTML: { __html: fileRawContent } }));
 }
-exports.InlineSvg = InlineSvg;
 //# sourceMappingURL=InlineSvg.js.map

package/lib/markdoc/components/MarkdocExample/MarkdocExample.d.ts

@@ -7,5 +7,6 @@ export interface MarkdocExampleProps {
     withLabels?: boolean;
     codeLabel?: string;
     resultLabel?: string;
+    title?: string;
 }
 export declare function MarkdocExample(props: MarkdocExampleProps): React.JSX.Element;

package/lib/markdoc/components/MarkdocExample/MarkdocExample.js

@@ -26,21 +26,20 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.MarkdocExample = void 0;
+exports.MarkdocExample = MarkdocExample;
 const React = __importStar(require("react"));
 const styled_components_1 = __importDefault(require("styled-components"));
 const CodeBlock_1 = require("../../../components/CodeBlock/CodeBlock");
 function MarkdocExample(props) {
-    const { language, rawContent, renderDemo, demoContent, withLabels, codeLabel, resultLabel } = props;
+    const { language, rawContent, renderDemo, demoContent, withLabels, codeLabel, resultLabel, title, } = props;
     const renderLabels = renderDemo ? (withLabels === undefined ? true : withLabels) : false;
     return (React.createElement("div", { "data-component-name": "Markdoc/MarkdocExample/MarkdocExample" },
         renderLabels ? React.createElement(Label, null, codeLabel ? codeLabel : 'Code:') : null,
-        React.createElement(CodeBlock_1.CodeBlock, { lang: language, source: rawContent, header: { controls: { copy: {} } } }),
+        React.createElement(CodeBlock_1.CodeBlock, { lang: language, source: rawContent, header: { title, controls: { copy: {} } } }),
         renderDemo ? (React.createElement(React.Fragment, null,
             renderLabels ? React.createElement(Label, null, resultLabel ? resultLabel : 'Result:') : null,
             demoContent)) : null));
 }
-exports.MarkdocExample = MarkdocExample;
 const Label = styled_components_1.default.div `
   margin: 10px 0;
 `;

package/lib/markdoc/components/Mermaid/Mermaid.js

@@ -3,14 +3,13 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Mermaid = void 0;
+exports.Mermaid = Mermaid;
 const react_1 = __importDefault(require("react"));
 const styled_components_1 = __importDefault(require("styled-components"));
 const utils_1 = require("../../../core/utils");
 function Mermaid({ diagramHtml, 'data-source': dataSource, 'data-hash': dataHash, className, }) {
     return (react_1.default.createElement(Wrapper, { className: (0, utils_1.concatClassNames)('mermaid-wrapper', className), dangerouslySetInnerHTML: { __html: diagramHtml }, "data-component-name": "Markdoc/Mermaid/Mermaid", "data-source": dataSource, "data-hash": dataHash }));
 }
-exports.Mermaid = Mermaid;
 const Wrapper = styled_components_1.default.div `
   background-color: var(--mermaid-bg-color);
   border-radius: var(--mermaid-border-radius);

package/lib/markdoc/components/Tabs/Tab.js

@@ -26,7 +26,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Tab = exports.TabComponent = void 0;
+exports.Tab = void 0;
+exports.TabComponent = TabComponent;
 const react_1 = __importDefault(require("react"));
 const styled_components_1 = __importStar(require("styled-components"));
 function TabComponent(props) {
@@ -34,7 +35,6 @@ function TabComponent(props) {
     return (react_1.default.createElement(TabItem, { "data-component-name": "Markdoc/Tabs/Tab" },
         react_1.default.createElement(TabButtonLink, { "$active": isActive, id: `tab-${tabId}`, role: "tab", "aria-controls": `panel-${tabId}`, "aria-selected": isActive ? 'true' : 'false', tabIndex: isActive ? 0 : -1, "data-label": label, ref: setRef, onKeyDown: onKeyDown, onClick: onClick }, label)));
 }
-exports.TabComponent = TabComponent;
 exports.Tab = (0, styled_components_1.default)(TabComponent) ``;
 const TabItem = styled_components_1.default.li `
   display: inline-flex;

package/lib/markdoc/components/Tabs/Tabs.js

@@ -3,7 +3,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.TabContent = exports.TabList = exports.Tabs = void 0;
+exports.TabContent = exports.TabList = void 0;
+exports.Tabs = Tabs;
 const react_1 = __importDefault(require("react"));
 const styled_components_1 = __importDefault(require("styled-components"));
 const Tab_1 = require("../../../markdoc/components/Tabs/Tab");
@@ -31,7 +32,6 @@ function Tabs({ children, className }) {
             return label === activeTab ? (react_1.default.createElement(exports.TabContent, { key: `content-${tabId}`, id: `panel-${tabId}`, "aria-labelledby": `tab-${tabId}`, tabIndex: 0, role: "tabpanel" }, child.props.children)) : null;
         })));
 }
-exports.Tabs = Tabs;
 const TabsContainer = styled_components_1.default.div `
   color: var(--md-tabs-container-text-color);
   font-size: var(--md-tabs-container-font-size);

package/lib/markdoc/default.d.ts

@@ -7,7 +7,7 @@ export * as components from '../markdoc/components/default';
 export declare const tags: {
     [x: string]: import("@markdoc/markdoc").Schema & {
         attributes?: Record<string, import("@markdoc/markdoc").SchemaAttribute & {
-            resolver?: string | undefined;
-        }> | undefined;
+            resolver?: string;
+        }>;
     };
 };

package/lib/markdoc/tags/markdoc-example.js

@@ -24,7 +24,14 @@ exports.markdocExample = {
             if (!content)
                 return null;
             const language = 'markdoc';
-            return new markdoc_1.default.Tag('MarkdocExample', Object.assign(Object.assign({}, attributes), { language, demoContent: node.children[0].transformChildren(config), rawContent: content }), []);
+            const annotations = node.children[0].annotations;
+            let title = null;
+            if (annotations.length > 0) {
+                const fenceWithTitle = annotations.find((annotation) => annotation.name === 'title');
+                title = fenceWithTitle === null || fenceWithTitle === void 0 ? void 0 : fenceWithTitle.value;
+            }
+            return new markdoc_1.default.Tag('MarkdocExample', Object.assign(Object.assign({}, attributes), { title,
+                language, demoContent: node.children[0].transformChildren(config), rawContent: content }), []);
         },
     },
     tagName: 'markdoc-example',

package/lib/plugin.js

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = plugin;
 function plugin() {
     return { id: 'default-theme' };
 }
-exports.default = plugin;
 //# sourceMappingURL=plugin.js.map