@limetech/kompendium 1.1.1

package/dist/cjs/kompendium-playground.cjs.entry.js

@@ -0,0 +1,89 @@
+'use strict';
+
+var index = require('./index-DYiJ6dQL.js');
+var types = require('./types-SjA7Kcy_.js');
+
+const playgroundCss = ":root{--width-nav-panel:16rem}:host{display:block}.tab-panel{height:100%;display:flex;flex-direction:column}.tab-bar{display:flex;padding:0.1875rem 1rem 0 1rem;overflow-y:auto}.tab-bar .tab span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display:inline-block;width:100%;padding:0.125rem 0}.tab-bar .tab{transition:background-color 0.2s ease;cursor:pointer;position:relative;display:inline-block;padding:0.5rem 1rem;text-align:center;line-height:0.9375rem;color:rgb(var(--kompendium-contrast-1000));font-size:1rem;border-radius:0.5rem 0.5rem 0 0;margin:0 0.125rem;min-width:3.75rem}.tab-bar .tab:before,.tab-bar .tab:after{transition:background-color 0.2s ease;content:\"\";display:block;width:0.625rem;height:0.625rem;position:absolute;bottom:0;-webkit-mask-image:url(\"data:image/svg+xml; utf8, <svg xmlns='http://www.w3.org/2000/svg' fill-rule='evenodd' stroke-linejoin='round' stroke-miterlimit='2' clip-rule='evenodd' viewBox='0 0 50 50'><defs/><path d='M0 0c0 27.594 22.406 50 50 50H0V0z'/></svg>\");mask-image:url(\"data:image/svg+xml; utf8, <svg xmlns='http://www.w3.org/2000/svg' fill-rule='evenodd' stroke-linejoin='round' stroke-miterlimit='2' clip-rule='evenodd' viewBox='0 0 50 50'><defs/><path d='M0 0c0 27.594 22.406 50 50 50H0V0z'/></svg>\");background:transparent}.tab-bar .tab:before{left:-0.625rem;transform:rotateY(180deg)}.tab-bar .tab:after{right:-0.625rem}.tab-bar .tab:hover{background-color:rgb(var(--kompendium-contrast-100))}.tab-bar .tab:hover:before,.tab-bar .tab:hover:after{background-color:rgb(var(--kompendium-contrast-100))}.tab-bar .tab.active{z-index:1;color:rgb(var(--kompendium-contrast-1100));background:rgb(var(--kompendium-color-code-background))}.tab-bar .tab.active:before,.tab-bar .tab.active:after{background:rgb(var(--kompendium-color-code-background))}.tab-items{display:flex;max-height:31.25rem}.tab-items .tab-item{width:100%;display:none}.tab-items .tab-item.active{display:flex}kompendium-code{display:block}kompendium-code:before,kompendium-code:after{content:\"\";z-index:1;display:block;position:absolute;left:0;right:0;border-radius:0.5625rem;pointer-events:none}kompendium-code:before{top:2.4375rem;height:1.5rem;background-image:linear-gradient(rgb(var(--kompendium-color-code-background)), rgba(var(--kompendium-color-code-background), 0))}kompendium-code:after{bottom:0;height:2rem;background-image:linear-gradient(rgba(var(--kompendium-color-code-background), 0), rgb(var(--kompendium-color-code-background)))}section.example{transition:border-color 0.3s ease 0.05s;padding-bottom:2.5rem;margin-bottom:2.5rem;border-bottom:1px solid rgb(var(--kompendium-contrast-500))}section.example .result,section.example .code{box-sizing:border-box;display:inline-block;vertical-align:top;width:50%}section.example .result{padding-right:2.5rem}section.example .result kompendium-markdown{margin-bottom:2rem}section.example .code{position:sticky;top:0}@media (max-width: 1000px){section.example .result,section.example .code{width:100%;padding-right:0;margin-bottom:5rem}section.example .code{position:relative;margin-bottom:2.5rem}}.show-case_description{padding:0.75rem}.show-case_component{font-family:var(--kompendium-example-font-family, inherit);font-size:var(--kompendium-example-font-size, inherit);line-height:var(--kompendium-example-line-height, inherit);color:var(--kompendium-example-color, inherit);padding:1.25rem;border-radius:0.875rem;background-color:rgb(var(--kompendium-contrast-100));border:1px solid rgb(var(--kompendium-contrast-300));box-shadow:var(--shadow-showcase)}.debug{display:flex;justify-content:flex-end}.debug a.debug-link{transition:background-color 0.2s ease, box-shadow 0.2s ease, transform 0.1s ease-out}.debug a.debug-link:hover{box-shadow:var(--kompendium-button-shadow-hovered)}.debug a.debug-link:active{box-shadow:var(--kompendium-button-shadow-pressed);transform:translate3d(0, 0.08rem, 0)}.debug a.debug-link:focus{outline:none}.debug a.debug-link:focus-visible{outline:none;box-shadow:var(--kompendium-shadow-depth-8-focused)}.debug a.debug-link{transition:background-color 0.2s ease, box-shadow 0.2s ease, transform 0.1s ease-out, opacity 0.2s ease;width:1.75rem;height:1.75rem;font-size:0;margin:-3.25rem -1rem 0 0;border-radius:50%;color:rgb(var(--kompendium-contrast-1200));opacity:0.6}.debug a.debug-link:hover{opacity:1;background-color:rgb(var(--kompendium-contrast-100))}";
+
+const Playground = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        /**
+         * Factory for creating props for example components
+         * @returns {Record<string, unknown>} props
+         */
+        this.propsFactory = () => ({});
+        this.activateTab = (id) => () => {
+            this.activeTab = id;
+        };
+        this.themeListener = (event) => {
+            this.theme = event.detail;
+        };
+        this.renderTab = this.renderTab.bind(this);
+        this.renderItem = this.renderItem.bind(this);
+    }
+    connectedCallback() {
+        this.theme = document.querySelector('html').dataset.theme;
+        document.addEventListener(types.THEME_EVENT_NAME, this.themeListener);
+    }
+    disconnectedCallback() {
+        document.removeEventListener(types.THEME_EVENT_NAME, this.themeListener);
+    }
+    render() {
+        if (!this.component) {
+            return;
+        }
+        const sources = this.component.sources || [];
+        return (index.h(index.Host, { "data-theme": this.theme }, index.h("section", { class: "example" }, index.h("div", { class: "result" }, this.renderResult()), index.h("aside", { class: "code" }, index.h("nav", { class: "tab-bar" }, this.renderTabs(sources)), index.h("div", { class: "tab-items" }, this.renderItems(sources))))));
+    }
+    renderTabs(sources) {
+        return sources.map(this.renderTab);
+    }
+    renderTab(source, index$1) {
+        const classList = {
+            tab: true,
+            active: this.isTabActive(source, index$1),
+        };
+        return (index.h("a", { class: classList, onClick: this.activateTab(source.filename) }, index.h("span", null, source.filename)));
+    }
+    renderItems(sources) {
+        return sources.map(this.renderItem);
+    }
+    renderResult() {
+        const ExampleComponent = this.component.tag;
+        const text = '##### ' + this.component.docs;
+        const factory = this.propsFactory;
+        const props = {
+            schema: this.schema,
+            ...factory(ExampleComponent),
+        };
+        return (index.h("div", { class: "show-case" }, index.h("div", { class: "show-case_description" }, index.h("kompendium-markdown", { text: text })), index.h("div", { class: "show-case_component" }, this.renderDebugButton(this.component.tag), index.h(ExampleComponent, { ...props }))));
+    }
+    renderItem(source, index$1) {
+        const classList = {
+            'tab-item': true,
+            active: this.isTabActive(source, index$1),
+        };
+        const code = source.source.replace(/\/\*\*.+?\*\//gms, '');
+        const key = [this.component.tag, source.filename].join('/');
+        return (index.h("kompendium-code", { class: classList, language: source.type, key: key }, code));
+    }
+    renderDebugButton(tag) {
+        if (!['localhost', '127.0.0.1'].includes(location.hostname)) {
+            return;
+        }
+        const href = `#/debug/${tag}`;
+        return (index.h("div", { class: "debug" }, index.h("a", { class: "debug-link", href: href, title: "Debug" }, index.h("svg", { viewBox: "0 0 400 400", xmlns: "http://www.w3.org/2000/svg", "fill-rule": "evenodd", "clip-rule": "evenodd", "stroke-linecap": "round", "stroke-linejoin": "round", "stroke-miterlimit": "1.5" }, index.h("path", { fill: "none", d: "M0 0h400v400H0z" }), index.h("path", { d: "M194.97 254.84h77.555", fill: "none", stroke: "currentColor", "stroke-opacity": ".6", "stroke-width": "20" }), index.h("path", { d: "M127.474 145.16l54.84 54.84M182.315 200l-54.84 54.84", fill: "none", stroke: "currentColor", "stroke-width": "20" })))));
+    }
+    isTabActive(source, index) {
+        let isActive = this.activeTab === source.filename;
+        if (!isActive) {
+            isActive = index === 0 && !this.activeTab;
+        }
+        return isActive;
+    }
+};
+Playground.style = playgroundCss;
+
+exports.kompendium_playground = Playground;
+//# sourceMappingURL=kompendium-playground.entry.cjs.js.map

package/dist/cjs/kompendium-playground.entry.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"kompendium-playground.entry.cjs.js","sources":["src/components/playground/playground.scss?tag=kompendium-playground&encapsulation=shadow","src/components/playground/playground.tsx"],"sourcesContent":["@use '../../style/functions.scss';\n@use '../../style/variables.scss';\n@use '../../style/mixins.scss';\n\n$tab-active-outer-edge-curve-size: functions.pxToRem(10);\n\n:host {\n    display: block;\n}\n\n.tab-panel {\n    height: 100%;\n    display: flex;\n    flex-direction: column;\n}\n\n.tab-bar {\n    display: flex;\n    padding: functions.pxToRem(3) functions.pxToRem(16) 0 functions.pxToRem(16);\n    overflow-y: auto;\n\n    .tab {\n        span {\n            @include mixins.truncate-text;\n            display: inline-block;\n            width: 100%;\n            padding: functions.pxToRem(2) 0;\n        }\n        transition: background-color 0.2s ease;\n        cursor: pointer;\n\n        position: relative;\n        display: inline-block;\n        padding: functions.pxToRem(8) functions.pxToRem(16);\n        text-align: center;\n        line-height: functions.pxToRem(15);\n        color: rgb(var(--kompendium-contrast-1000));\n        font-size: functions.pxToRem(16);\n        border-radius: functions.pxToRem(8) functions.pxToRem(8) 0 0;\n        margin: 0 functions.pxToRem(2);\n        min-width: functions.pxToRem(\n            60\n        ); // needs to be here for titles to truncate\n\n        &:before,\n        &:after {\n            transition: background-color 0.2s ease;\n\n            content: '';\n            display: block;\n            width: $tab-active-outer-edge-curve-size;\n            height: $tab-active-outer-edge-curve-size;\n            position: absolute;\n            bottom: 0;\n            -webkit-mask-image: url(\"data:image/svg+xml; utf8, <svg xmlns='http://www.w3.org/2000/svg' fill-rule='evenodd' stroke-linejoin='round' stroke-miterlimit='2' clip-rule='evenodd' viewBox='0 0 50 50'><defs/><path d='M0 0c0 27.594 22.406 50 50 50H0V0z'/></svg>\"); //For chrome and Safari the browser prefix is needed. (last checked Apr 2020)\n            mask-image: url(\"data:image/svg+xml; utf8, <svg xmlns='http://www.w3.org/2000/svg' fill-rule='evenodd' stroke-linejoin='round' stroke-miterlimit='2' clip-rule='evenodd' viewBox='0 0 50 50'><defs/><path d='M0 0c0 27.594 22.406 50 50 50H0V0z'/></svg>\");\n\n            background: transparent;\n        }\n\n        &:before {\n            left: -$tab-active-outer-edge-curve-size;\n            transform: rotateY(180deg);\n        }\n        &:after {\n            right: -$tab-active-outer-edge-curve-size;\n        }\n\n        &:hover {\n            background-color: rgb(var(--kompendium-contrast-100));\n\n            &:before,\n            &:after {\n                background-color: rgb(var(--kompendium-contrast-100));\n            }\n        }\n\n        &.active {\n            z-index: 1;\n            color: rgb(var(--kompendium-contrast-1100));\n            background: rgb(var(--kompendium-color-code-background));\n\n            &:before,\n            &:after {\n                background: rgb(var(--kompendium-color-code-background));\n            }\n        }\n    }\n}\n\n.tab-items {\n    display: flex;\n    max-height: functions.pxToRem(500);\n\n    .tab-item {\n        width: 100%;\n        display: none;\n\n        &.active {\n            display: flex;\n        }\n\n        // &:nth-child(1) {\n        //   flex-direction: column;\n        // }\n    }\n}\n\nkompendium-code {\n    display: block;\n\n    &:before,\n    &:after {\n        content: '';\n        z-index: 1;\n        display: block;\n        position: absolute;\n        left: 0;\n        right: 0;\n        border-radius: functions.pxToRem(9);\n        pointer-events: none;\n    }\n\n    &:before {\n        top: functions.pxToRem(39);\n        height: functions.pxToRem(24);\n        background-image: linear-gradient(\n            rgb(var(--kompendium-color-code-background)),\n            rgba(var(--kompendium-color-code-background), 0)\n        );\n    }\n    &:after {\n        bottom: 0;\n        height: functions.pxToRem(32);\n        background-image: linear-gradient(\n            rgba(var(--kompendium-color-code-background), 0),\n            rgb(var(--kompendium-color-code-background))\n        );\n    }\n}\n\nsection.example {\n    transition: border-color 0.3s ease 0.05s;\n    padding-bottom: functions.pxToRem(40);\n    margin-bottom: functions.pxToRem(40);\n    border-bottom: 1px solid rgb(var(--kompendium-contrast-500));\n\n    .result,\n    .code {\n        box-sizing: border-box;\n        display: inline-block;\n        vertical-align: top;\n        width: 50%;\n    }\n\n    .result {\n        padding-right: functions.pxToRem(40);\n\n        kompendium-markdown {\n            margin-bottom: functions.pxToRem(32);\n        }\n    }\n\n    .code {\n        position: sticky;\n        top: 0;\n    }\n}\n\n@media (max-width: variables.$break-point-small) {\n    section.example {\n        .result,\n        .code {\n            width: 100%;\n            padding-right: 0;\n            margin-bottom: functions.pxToRem(80);\n        }\n\n        .code {\n            position: relative;\n            margin-bottom: functions.pxToRem(40);\n        }\n    }\n}\n\n.show-case_description {\n    padding: functions.pxToRem(12);\n}\n\n.show-case_component {\n    font-family: var(--kompendium-example-font-family, inherit);\n    font-size: var(--kompendium-example-font-size, inherit);\n    line-height: var(--kompendium-example-line-height, inherit);\n    color: var(--kompendium-example-color, inherit);\n\n    padding: functions.pxToRem(20);\n    border-radius: functions.pxToRem(14);\n    background-color: rgb(var(--kompendium-contrast-100));\n    border: 1px solid rgb(var(--kompendium-contrast-300));\n    box-shadow: var(--shadow-showcase);\n}\n\n.debug {\n    display: flex;\n    justify-content: flex-end;\n\n    a.debug-link {\n        @include mixins.is-flat-clickable();\n        transition:\n            background-color 0.2s ease,\n            box-shadow 0.2s ease,\n            transform 0.1s ease-out,\n            opacity 0.2s ease;\n\n        width: functions.pxToRem(28);\n        height: functions.pxToRem(28);\n        font-size: 0;\n        margin: functions.pxToRem(-52) functions.pxToRem(-16) 0 0;\n        border-radius: 50%;\n\n        color: rgb(var(--kompendium-contrast-1200));\n\n        opacity: 0.6;\n\n        &:hover {\n            opacity: 1;\n            background-color: rgb(var(--kompendium-contrast-100));\n        }\n    }\n}\n","import { Component, h, Host, Prop, State } from '@stencil/core';\nimport { JsonDocsComponent } from '@stencil/core/internal';\nimport { JsonDocsSource } from '../../kompendium/source';\nimport { Theme, THEME_EVENT_NAME } from '../darkmode-switch/types';\nimport { PropsFactory } from './playground.types';\n\n@Component({\n    tag: 'kompendium-playground',\n    styleUrl: 'playground.scss',\n    shadow: true,\n})\nexport class Playground {\n    /**\n     * The component to display\n     */\n    @Prop()\n    public component: JsonDocsComponent;\n\n    /**\n     * Schema for the component\n     */\n    @Prop()\n    public schema: Record<string, any>;\n\n    /**\n     * Factory for creating props for example components\n     * @returns {Record<string, unknown>} props\n     */\n    @Prop()\n    public propsFactory?: PropsFactory = () => ({});\n\n    @State()\n    private activeTab: string;\n\n    @State()\n    private theme: Theme;\n\n    constructor() {\n        this.renderTab = this.renderTab.bind(this);\n        this.renderItem = this.renderItem.bind(this);\n    }\n\n    public connectedCallback() {\n        this.theme = document.querySelector('html').dataset.theme as Theme;\n        document.addEventListener(THEME_EVENT_NAME, this.themeListener);\n    }\n\n    public disconnectedCallback() {\n        document.removeEventListener(THEME_EVENT_NAME, this.themeListener);\n    }\n\n    public render(): HTMLElement {\n        if (!this.component) {\n            return;\n        }\n\n        const sources: JsonDocsSource[] = (this.component as any).sources || [];\n\n        return (\n            <Host data-theme={this.theme}>\n                <section class=\"example\">\n                    <div class=\"result\">{this.renderResult()}</div>\n\n                    <aside class=\"code\">\n                        <nav class=\"tab-bar\">{this.renderTabs(sources)}</nav>\n                        <div class=\"tab-items\">{this.renderItems(sources)}</div>\n                    </aside>\n                </section>\n            </Host>\n        );\n    }\n\n    private renderTabs(sources: JsonDocsSource[]) {\n        return sources.map(this.renderTab);\n    }\n\n    private renderTab(source: JsonDocsSource, index: number) {\n        const classList = {\n            tab: true,\n            active: this.isTabActive(source, index),\n        };\n\n        return (\n            <a class={classList} onClick={this.activateTab(source.filename)}>\n                <span>{source.filename}</span>\n            </a>\n        );\n    }\n\n    private renderItems(sources: JsonDocsSource[]) {\n        return sources.map(this.renderItem);\n    }\n\n    private renderResult() {\n        const ExampleComponent = this.component.tag;\n        const text = '##### ' + this.component.docs;\n        const factory = this.propsFactory;\n        const props = {\n            schema: this.schema,\n            ...factory(ExampleComponent),\n        };\n\n        return (\n            <div class=\"show-case\">\n                <div class=\"show-case_description\">\n                    <kompendium-markdown text={text} />\n                </div>\n                <div class=\"show-case_component\">\n                    {this.renderDebugButton(this.component.tag)}\n                    <ExampleComponent {...props} />\n                </div>\n            </div>\n        );\n    }\n\n    private renderItem(source: JsonDocsSource, index: number) {\n        const classList = {\n            'tab-item': true,\n            active: this.isTabActive(source, index),\n        };\n        const code = source.source.replace(/\\/\\*\\*.+?\\*\\//gms, '');\n        const key = [this.component.tag, source.filename].join('/');\n\n        return (\n            <kompendium-code class={classList} language={source.type} key={key}>\n                {code}\n            </kompendium-code>\n        );\n    }\n\n    private renderDebugButton(tag: string) {\n        if (!['localhost', '127.0.0.1'].includes(location.hostname)) {\n            return;\n        }\n\n        const href = `#/debug/${tag}`;\n\n        return (\n            <div class=\"debug\">\n                <a class=\"debug-link\" href={href} title=\"Debug\">\n                    <svg\n                        viewBox=\"0 0 400 400\"\n                        xmlns=\"http://www.w3.org/2000/svg\"\n                        fill-rule=\"evenodd\"\n                        clip-rule=\"evenodd\"\n                        stroke-linecap=\"round\"\n                        stroke-linejoin=\"round\"\n                        stroke-miterlimit=\"1.5\"\n                    >\n                        <path fill=\"none\" d=\"M0 0h400v400H0z\" />\n                        <path\n                            d=\"M194.97 254.84h77.555\"\n                            fill=\"none\"\n                            stroke=\"currentColor\"\n                            stroke-opacity=\".6\"\n                            stroke-width=\"20\"\n                        />\n                        <path\n                            d=\"M127.474 145.16l54.84 54.84M182.315 200l-54.84 54.84\"\n                            fill=\"none\"\n                            stroke=\"currentColor\"\n                            stroke-width=\"20\"\n                        />\n                    </svg>\n                </a>\n            </div>\n        );\n    }\n\n    private activateTab = (id: string) => () => {\n        this.activeTab = id;\n    };\n\n    private isTabActive(source: JsonDocsSource, index: number): boolean {\n        let isActive = this.activeTab === source.filename;\n        if (!isActive) {\n            isActive = index === 0 && !this.activeTab;\n        }\n\n        return isActive;\n    }\n\n    private themeListener = (event: CustomEvent<Theme>) => {\n        this.theme = event.detail;\n    };\n}\n"],"names":["THEME_EVENT_NAME","h","Host","index"],"mappings":"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"}

package/dist/cjs/kompendium-proplist.kompendium-taglist.entry.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"kompendium-proplist.kompendium-taglist.entry.cjs.js","sources":["src/components/proplist/proplist.scss?tag=kompendium-proplist&encapsulation=shadow","src/components/proplist/proplist.tsx","src/components/taglist/taglist.scss?tag=kompendium-taglist&encapsulation=shadow","src/components/taglist/taglist.tsx"],"sourcesContent":["@use '../../style/reset.scss';\n@use '../../style/functions.scss';\n@use '../../style/typography.scss';\n\n:host {\n    display: block;\n}\n\npre,\ncode {\n    font-family: var(--kompendium-font-code);\n    border-radius: functions.pxToRem(4);\n    font-size: functions.pxToRem(11);\n\n    a {\n        font-size: functions.pxToRem(11);\n    }\n}\n\ncode {\n    background: rgba(var(--kompendium-contrast-1100), 0.05);\n    border: 1px solid rgba(var(--kompendium-contrast-1100), 0.1);\n    padding: 0.125rem 0.3125rem;\n    margin: 0 0.125rem;\n    white-space: pre-wrap;\n    color: rgb(var(--kompendium-contrast-1100));\n}\n\npre {\n    > code {\n        display: block;\n        padding: 0.625rem 0.6375rem;\n        white-space: pre-wrap;\n    }\n}\n\n.value--false {\n    code {\n        color: rgb(var(--kompendium-color-code-magenta));\n        border-color: rgba(var(--kompendium-color-code-magenta), 0.2);\n        background-color: rgba(var(--kompendium-color-code-magenta), 0.1);\n    }\n}\n\n.value--true {\n    code {\n        color: rgb(var(--kompendium-color-code-green-dark));\n        border-color: rgba(var(--kompendium-color-code-green-dark), 0.2);\n        background-color: rgba(var(--kompendium-color-code-green-dark), 0.1);\n    }\n}\n\ndl {\n    display: grid;\n    grid-template-columns: 1fr 2fr;\n    grid-template-rows: 1fr;\n    margin-bottom: 2rem;\n    border: 1px solid rgb(var(--kompendium-contrast-500));\n    border-radius: functions.pxToRem(6);\n    background-color: rgb(var(--kompendium-contrast-300));\n\n    dt,\n    dd {\n        padding: functions.pxToRem(6) functions.pxToRem(8);\n        font-size: functions.pxToRem(14);\n\n        &:nth-of-type(even) {\n            background-color: rgb(var(--kompendium-contrast-400));\n        }\n    }\n    dt {\n        &:first-child {\n            border-top-left-radius: functions.pxToRem(6);\n        }\n        &:last-child {\n            border-bottom-left-radius: functions.pxToRem(6);\n        }\n    }\n    dd {\n        &:first-child {\n            border-top-right-radius: functions.pxToRem(6);\n        }\n        &:last-child {\n            border-bottom-right-radius: functions.pxToRem(6);\n        }\n    }\n}\n\ndl,\ndt,\ndd {\n    transition:\n        background-color 0.3s ease 0.05s,\n        border-color 0.3s ease 0.05s;\n}\n","import { Component, h, Prop } from '@stencil/core';\n\nexport interface ProplistItem {\n    key: string;\n    value: string;\n}\n\n@Component({\n    tag: 'kompendium-proplist',\n    shadow: true,\n    styleUrl: 'proplist.scss',\n})\nexport class Proplist {\n    /**\n     * List of properties\n     */\n    @Prop()\n    public items: ProplistItem[];\n\n    render(): HTMLElement {\n        return <dl>{this.items.map(this.renderProperty)}</dl>;\n    }\n\n    private renderProperty(property: ProplistItem) {\n        const { key, value } = property;\n\n        return [\n            <dt>{key}</dt>,\n            <dd class={`value--${value}`}>\n                <kompendium-markdown text={`\\`${value}\\``} />\n            </dd>,\n        ];\n    }\n}\n","@use '../../style/functions.scss';\n\n:host {\n    isolation: isolate;\n    display: flex;\n    flex-direction: column;\n    align-items: flex-start;\n    gap: 0.5rem;\n    padding: 0.5rem 0 0 0;\n}\n\n.tag-list {\n    position: relative;\n    display: flex;\n    gap: 0.25rem;\n    align-items: center;\n    justify-content: center;\n    padding: 0.125rem 0.25rem 0.125rem 0.25rem;\n    border-radius: 0.25rem;\n\n    &:before,\n    &:after {\n        content: '';\n        position: absolute;\n        inset: 0;\n        border-radius: inherit;\n        pointer-events: none;\n    }\n\n    &:before {\n        border: 1px dotted;\n        opacity: 0.4;\n    }\n\n    &:after {\n        background-color: currentColor;\n        opacity: 0.04;\n    }\n\n    color: rgb(var(--kompendium-contrast-1100));\n}\n\n.tag--private {\n    color: rgb(var(--kompendium-color-orange-default));\n}\n\n.tag--beta {\n    color: rgb(var(--kompendium-color-blue-default));\n}\n\n.tag--deprecated {\n    color: rgb(var(--kompendium-color-red-default));\n}\n\ncode {\n    font-family: var(--kompendium-font-code);\n    font-size: 0.75rem;\n}\n\nsvg {\n    width: 0.75rem;\n    opacity: 0.7;\n}\n","import { Component, h, Prop } from '@stencil/core';\nimport { JsonDocsTag } from '@stencil/core/internal';\n\n/**\n * asd\n */\n@Component({\n    tag: 'kompendium-taglist',\n    shadow: true,\n    styleUrl: 'taglist.scss',\n})\nexport class Taglist {\n    /**\n     * List of tags to render\n     */\n    @Prop()\n    public tags: JsonDocsTag[];\n\n    /**\n     * Set to `true` if the list should be rendered in compact mode\n     */\n    @Prop()\n    public compact = false;\n\n    render(): HTMLElement[] {\n        return this.tags.map(this.renderTag);\n    }\n\n    private renderTag(tag: JsonDocsTag) {\n        const classList = {\n            'tag-list': true,\n        };\n\n        classList[`tag--${tag.name}`] = true;\n\n        return (\n            <div class={classList}>\n                <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\">\n                    <path\n                        d=\"M5 2h14a1 1 0 0 1 1 1v19.143a.5.5 0 0 1-.766.424L12 18.03l-7.234 4.536A.5.5 0 0 1 4 22.143V3a1 1 0 0 1 1-1z\"\n                        fill=\"currentColor\"\n                    ></path>\n                </svg>\n                <code>@{tag.name}</code>\n                <kompendium-markdown text={tag.text} />\n            </div>\n        );\n    }\n}\n"],"names":["h"],"mappings":";;;;AAAA,MAAM,WAAW,GAAG,22JAA22J;;MCYl3J,QAAQ,GAAA,MAAA;;;;IAOjB,MAAM,GAAA;QACF,OAAOA,OAAK,CAAA,IAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EAAA,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,cAAc,CAAC,CAAM;;AAGjD,IAAA,cAAc,CAAC,QAAsB,EAAA;AACzC,QAAA,MAAM,EAAE,GAAG,EAAE,KAAK,EAAE,GAAG,QAAQ;QAE/B,OAAO;AACH,YAAAA,OAAA,CAAA,IAAA,EAAA,IAAA,EAAK,GAAG,CAAM;YACdA,OAAA,CAAA,IAAA,EAAA,EAAI,KAAK,EAAE,CAAA,OAAA,EAAU,KAAK,CAAA,CAAE,EAAA,EACxBA,OAAA,CAAA,qBAAA,EAAA,EAAqB,IAAI,EAAE,KAAK,KAAK,CAAA,EAAA,CAAI,GAAI,CAC5C;SACR;;;;;AC/BT,MAAM,UAAU,GAAG,4zBAA4zB;;MCWl0B,OAAO,GAAA,MAAA;AALpB,IAAA,WAAA,CAAA,OAAA,EAAA;;AAYI;;AAEG;AAEI,QAAA,IAAO,CAAA,OAAA,GAAG,KAAK;AA0BzB;IAxBG,MAAM,GAAA;QACF,OAAO,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,SAAS,CAAC;;AAGhC,IAAA,SAAS,CAAC,GAAgB,EAAA;AAC9B,QAAA,MAAM,SAAS,GAAG;AACd,YAAA,UAAU,EAAE,IAAI;SACnB;QAED,SAAS,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAE,CAAA,CAAC,GAAG,IAAI;AAEpC,QAAA,QACIA,OAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAE,SAAS,EAAA,EACjBA,OAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAC,4BAA4B,EAAC,OAAO,EAAC,WAAW,EAAA,EACvDA,OACI,CAAA,MAAA,EAAA,EAAA,CAAC,EAAC,6GAA6G,EAC/G,IAAI,EAAC,cAAc,GACf,CACN,EACNA,OAAA,CAAA,MAAA,EAAA,IAAA,OAAQ,GAAG,CAAC,IAAI,CAAQ,EACxBA,OAAqB,CAAA,qBAAA,EAAA,EAAA,IAAI,EAAE,GAAG,CAAC,IAAI,EAAI,CAAA,CACrC;;;;;;;;"}

package/dist/cjs/kompendium-proplist_2.cjs.entry.js

@@ -0,0 +1,49 @@
+'use strict';
+
+var index = require('./index-DYiJ6dQL.js');
+
+const proplistCss = "*,*::before,*::after{box-sizing:border-box}ul[class],ol[class]{padding:0}body,h1,h2,h3,h4,p,ul[class],ol[class],li,figure,figcaption,blockquote,dl,dd{margin:0}ul[class],ol[class]{list-style:none}a:not([class]){text-decoration-skip-ink:auto}img{max-width:100%}input,button,textarea,select{font:inherit}@media (prefers-reduced-motion: reduce){*{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}p,a,li{font-size:0.9375rem}h1,h2,h3,h4,h5,h6{margin-bottom:0.5rem;font-weight:normal;font-weight:500}h1{font-size:2rem;line-height:2.25rem;margin-top:1.5rem;letter-spacing:-0.0625rem;font-weight:400}h2{font-size:1.625rem;line-height:1.25rem;margin-top:1.25rem;margin-bottom:1rem}h3{font-size:1.375rem;line-height:1.5rem;margin-top:1rem}h4{font-size:1.25rem;line-height:1.25rem;margin-top:1rem}h5{font-size:1.125rem;line-height:1.125rem;margin-top:0.75rem}h6{font-size:1rem;font-variant:all-small-caps;letter-spacing:0.0625rem}p,blockquote{margin-top:0;margin-bottom:0.5rem}p:only-child,blockquote:only-child{margin-bottom:0}a{transition:color 0.2s ease;color:rgb(var(--kompendium-color-blue-default));text-decoration:none;border-radius:0.125rem}a:hover{color:rgb(var(--kompendium-color-blue-light))}a:focus{outline:none}a:focus-visible{outline:none;box-shadow:var(--kompendium-shadow-depth-8-focused)}ul{list-style:none}ul li{position:relative;margin-left:0.75rem}ul li:before{content:\"\";position:absolute;left:-0.5rem;top:0.625rem;width:0.25rem;height:0.25rem;border-radius:50%;background-color:rgb(var(--kompendium-contrast-700));display:block}ol{list-style:decimal inside}ol,ul{padding-left:0;margin-top:0}ul ul,ul ol,ol ol,ol ul{margin:0.9375rem 0 0.9375rem 1.875rem;font-size:90%}li{margin-bottom:0.625rem}th,td{padding:0.75rem 1rem;text-align:left;border-bottom:1px solid rgb(var(--kompendium-contrast-600))}th:first-child,td:first-child{padding-left:0}th:last-child,td:last-child{padding-right:0}hr{margin:1.75rem 0 2rem 0;border-width:0;border-top:1px solid rgb(var(--kompendium-contrast-600))}kbd{font-family:var(--kompendium-font-code);font-size:0.875rem;font-weight:600;color:rgb(var(--kompendium-contrast-1000));background-color:rgb(var(--kompendium-contrast-200));white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:normal;padding:0.125rem 0.5rem;margin:0 0.25rem;box-shadow:var(--kompendium-button-shadow-normal), 0 0.03125rem 0.21875rem 0 rgba(var(--kompendium-contrast-100), 0.5) inset;border-radius:0.25rem;border-style:solid;border-color:rgba(var(--kompendium-contrast-600), 0.8);border-width:0 1px 0.125rem 1px}@media (prefers-color-scheme: dark){kbd:not([data-theme=force-light]){background-color:rgb(var(--kompendium-contrast-200));color:rgb(var(--kompendium-contrast-1100));border-color:rgba(var(--kompendium-contrast-500), 0.8)}}kbd[data-theme=force-dark]{background-color:rgb(var(--kompendium-contrast-200));color:rgb(var(--kompendium-contrast-1100));border-color:rgba(var(--kompendium-contrast-500), 0.8)}@media (prefers-color-scheme: dark){:host(:not([data-theme=force-light])) kbd{background-color:rgb(var(--kompendium-contrast-200));color:rgb(var(--kompendium-contrast-1100));border-color:rgba(var(--kompendium-contrast-500), 0.8)}}:host([data-theme=force-dark]) kbd{background-color:rgb(var(--kompendium-contrast-200));color:rgb(var(--kompendium-contrast-1100));border-color:rgba(var(--kompendium-contrast-500), 0.8)}:host{display:block}pre,code{font-family:var(--kompendium-font-code);border-radius:0.25rem;font-size:0.6875rem}pre a,code a{font-size:0.6875rem}code{background:rgba(var(--kompendium-contrast-1100), 0.05);border:1px solid rgba(var(--kompendium-contrast-1100), 0.1);padding:0.125rem 0.3125rem;margin:0 0.125rem;white-space:pre-wrap;color:rgb(var(--kompendium-contrast-1100))}pre>code{display:block;padding:0.625rem 0.6375rem;white-space:pre-wrap}.value--false code{color:rgb(var(--kompendium-color-code-magenta));border-color:rgba(var(--kompendium-color-code-magenta), 0.2);background-color:rgba(var(--kompendium-color-code-magenta), 0.1)}.value--true code{color:rgb(var(--kompendium-color-code-green-dark));border-color:rgba(var(--kompendium-color-code-green-dark), 0.2);background-color:rgba(var(--kompendium-color-code-green-dark), 0.1)}dl{display:grid;grid-template-columns:1fr 2fr;grid-template-rows:1fr;margin-bottom:2rem;border:1px solid rgb(var(--kompendium-contrast-500));border-radius:0.375rem;background-color:rgb(var(--kompendium-contrast-300))}dl dt,dl dd{padding:0.375rem 0.5rem;font-size:0.875rem}dl dt:nth-of-type(even),dl dd:nth-of-type(even){background-color:rgb(var(--kompendium-contrast-400))}dl dt:first-child{border-top-left-radius:0.375rem}dl dt:last-child{border-bottom-left-radius:0.375rem}dl dd:first-child{border-top-right-radius:0.375rem}dl dd:last-child{border-bottom-right-radius:0.375rem}dl,dt,dd{transition:background-color 0.3s ease 0.05s, border-color 0.3s ease 0.05s}";
+
+const Proplist = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+    }
+    render() {
+        return index.h("dl", { key: 'e0d431f2ef5b105af7436d0a9b46a3ad2886a96b' }, this.items.map(this.renderProperty));
+    }
+    renderProperty(property) {
+        const { key, value } = property;
+        return [
+            index.h("dt", null, key),
+            index.h("dd", { class: `value--${value}` }, index.h("kompendium-markdown", { text: `\`${value}\`` })),
+        ];
+    }
+};
+Proplist.style = proplistCss;
+
+const taglistCss = ":host{isolation:isolate;display:flex;flex-direction:column;align-items:flex-start;gap:0.5rem;padding:0.5rem 0 0 0}.tag-list{position:relative;display:flex;gap:0.25rem;align-items:center;justify-content:center;padding:0.125rem 0.25rem 0.125rem 0.25rem;border-radius:0.25rem}.tag-list:before,.tag-list:after{content:\"\";position:absolute;inset:0;border-radius:inherit;pointer-events:none}.tag-list:before{border:1px dotted;opacity:0.4}.tag-list:after{background-color:currentColor;opacity:0.04}.tag-list{color:rgb(var(--kompendium-contrast-1100))}.tag--private{color:rgb(var(--kompendium-color-orange-default))}.tag--beta{color:rgb(var(--kompendium-color-blue-default))}.tag--deprecated{color:rgb(var(--kompendium-color-red-default))}code{font-family:var(--kompendium-font-code);font-size:0.75rem}svg{width:0.75rem;opacity:0.7}";
+
+const Taglist = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        /**
+         * Set to `true` if the list should be rendered in compact mode
+         */
+        this.compact = false;
+    }
+    render() {
+        return this.tags.map(this.renderTag);
+    }
+    renderTag(tag) {
+        const classList = {
+            'tag-list': true,
+        };
+        classList[`tag--${tag.name}`] = true;
+        return (index.h("div", { class: classList }, index.h("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24" }, index.h("path", { d: "M5 2h14a1 1 0 0 1 1 1v19.143a.5.5 0 0 1-.766.424L12 18.03l-7.234 4.536A.5.5 0 0 1 4 22.143V3a1 1 0 0 1 1-1z", fill: "currentColor" })), index.h("code", null, "@", tag.name), index.h("kompendium-markdown", { text: tag.text })));
+    }
+};
+Taglist.style = taglistCss;
+
+exports.kompendium_proplist = Proplist;
+exports.kompendium_taglist = Taglist;
+//# sourceMappingURL=kompendium-proplist.kompendium-taglist.entry.cjs.js.map

package/dist/cjs/kompendium-type.cjs.entry.js

@@ -0,0 +1,83 @@
+'use strict';
+
+var index = require('./index-DYiJ6dQL.js');
+var methods = require('./methods-DoA78dOH.js');
+
+function Interface({ type, }) {
+    return [
+        index.h("h1", { id: type.name }, type.name),
+        index.h("kompendium-markdown", { text: type.docs }),
+        index.h("kompendium-taglist", { tags: type.docsTags }),
+        index.h(methods.PropertyList, { props: type.props }),
+        index.h(methods.MethodList, { methods: type.methods }),
+    ];
+}
+
+function Alias({ type }) {
+    const alias = '`' + type.alias + '`';
+    return [
+        index.h("h1", { id: type.name }, type.name),
+        index.h("kompendium-markdown", { text: type.docs }),
+        index.h("kompendium-taglist", { tags: type.docsTags }),
+        index.h("kompendium-markdown", { text: alias }),
+    ];
+}
+
+function Enum({ type }) {
+    return [
+        index.h("h1", { id: type.name }, type.name),
+        index.h("kompendium-markdown", { text: type.docs }),
+        index.h("kompendium-taglist", { tags: type.docsTags }),
+        index.h(MemberList, { members: type.members }),
+    ];
+}
+function MemberList({ members }) {
+    if (!members.length) {
+        return;
+    }
+    return [index.h("h3", null, "Members"), ...members.map(renderMember)];
+}
+function renderMember(member) {
+    const items = [
+        {
+            key: 'Value',
+            value: member.value,
+        },
+    ];
+    return (index.h("div", null, index.h("h4", null, member.name), index.h("kompendium-markdown", { text: member.docs }), index.h("kompendium-taglist", { tags: member.docsTags }), index.h("kompendium-proplist", { items: items })));
+}
+
+const componentCss = "*,*::before,*::after{box-sizing:border-box}ul[class],ol[class]{padding:0}body,h1,h2,h3,h4,p,ul[class],ol[class],li,figure,figcaption,blockquote,dl,dd{margin:0}ul[class],ol[class]{list-style:none}a:not([class]){text-decoration-skip-ink:auto}img{max-width:100%}input,button,textarea,select{font:inherit}@media (prefers-reduced-motion: reduce){*{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;scroll-behavior:auto !important}}:root{--width-nav-panel:16rem}p,a,li{font-size:0.9375rem}h1,h2,h3,h4,h5,h6{margin-bottom:0.5rem;font-weight:normal;font-weight:500}h1{font-size:2rem;line-height:2.25rem;margin-top:1.5rem;letter-spacing:-0.0625rem;font-weight:400}h2{font-size:1.625rem;line-height:1.25rem;margin-top:1.25rem;margin-bottom:1rem}h3{font-size:1.375rem;line-height:1.5rem;margin-top:1rem}h4{font-size:1.25rem;line-height:1.25rem;margin-top:1rem}h5{font-size:1.125rem;line-height:1.125rem;margin-top:0.75rem}h6{font-size:1rem;font-variant:all-small-caps;letter-spacing:0.0625rem}p,blockquote{margin-top:0;margin-bottom:0.5rem}p:only-child,blockquote:only-child{margin-bottom:0}a{transition:color 0.2s ease;color:rgb(var(--kompendium-color-blue-default));text-decoration:none;border-radius:0.125rem}a:hover{color:rgb(var(--kompendium-color-blue-light))}a:focus{outline:none}a:focus-visible{outline:none;box-shadow:var(--kompendium-shadow-depth-8-focused)}ul{list-style:none}ul li{position:relative;margin-left:0.75rem}ul li:before{content:\"\";position:absolute;left:-0.5rem;top:0.625rem;width:0.25rem;height:0.25rem;border-radius:50%;background-color:rgb(var(--kompendium-contrast-700));display:block}ol{list-style:decimal inside}ol,ul{padding-left:0;margin-top:0}ul ul,ul ol,ol ol,ol ul{margin:0.9375rem 0 0.9375rem 1.875rem;font-size:90%}li{margin-bottom:0.625rem}th,td{padding:0.75rem 1rem;text-align:left;border-bottom:1px solid rgb(var(--kompendium-contrast-600))}th:first-child,td:first-child{padding-left:0}th:last-child,td:last-child{padding-right:0}hr{margin:1.75rem 0 2rem 0;border-width:0;border-top:1px solid rgb(var(--kompendium-contrast-600))}kbd{font-family:var(--kompendium-font-code);font-size:0.875rem;font-weight:600;color:rgb(var(--kompendium-contrast-1000));background-color:rgb(var(--kompendium-contrast-200));white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:normal;padding:0.125rem 0.5rem;margin:0 0.25rem;box-shadow:var(--kompendium-button-shadow-normal), 0 0.03125rem 0.21875rem 0 rgba(var(--kompendium-contrast-100), 0.5) inset;border-radius:0.25rem;border-style:solid;border-color:rgba(var(--kompendium-contrast-600), 0.8);border-width:0 1px 0.125rem 1px}@media (prefers-color-scheme: dark){kbd:not([data-theme=force-light]){background-color:rgb(var(--kompendium-contrast-200));color:rgb(var(--kompendium-contrast-1100));border-color:rgba(var(--kompendium-contrast-500), 0.8)}}kbd[data-theme=force-dark]{background-color:rgb(var(--kompendium-contrast-200));color:rgb(var(--kompendium-contrast-1100));border-color:rgba(var(--kompendium-contrast-500), 0.8)}@media (prefers-color-scheme: dark){:host(:not([data-theme=force-light])) kbd{background-color:rgb(var(--kompendium-contrast-200));color:rgb(var(--kompendium-contrast-1100));border-color:rgba(var(--kompendium-contrast-500), 0.8)}}:host([data-theme=force-dark]) kbd{background-color:rgb(var(--kompendium-contrast-200));color:rgb(var(--kompendium-contrast-1100));border-color:rgba(var(--kompendium-contrast-500), 0.8)}kompendium-playground{width:100%}.docs-layout-section-heading{transition:border-color 0.3s ease 0.05s;padding-top:2.5rem;margin:2.5rem 0 1.25rem 0;border-top:1px solid rgb(var(--kompendium-contrast-500))}.docs-layout-section-heading:before{content:\"\";width:0.125rem;height:0.75rem;display:inline-block;background-color:rgba(var(--kompendium-color-code-blue), 0.4);border-radius:0.0625rem;transform:translateX(-0.5rem)}.props-events-layout .markdown-props{display:grid;grid-gap:1.25rem;grid-auto-flow:column;grid-template-columns:1fr 1fr}@media (max-width: 800px){.props-events-layout .markdown-props{grid-gap:0.75rem;grid-auto-flow:row;grid-template-columns:unset}}.methods-layout{border-radius:0.375rem;margin-bottom:2.5rem;background-color:rgb(var(--kompendium-contrast-400))}.methods-title{margin:0;border-radius:0.375rem 0.375rem 0 0;padding:0.75rem 1rem;background-color:rgb(var(--kompendium-contrast-500));font-size:1.0625rem}.methods-content{display:grid;grid-gap:1.25rem;grid-auto-flow:column;grid-template-columns:1fr 1fr;padding:1rem 1.25rem 1.5rem 1.25rem}.methods-returns{padding:1rem 1.25rem 1.5rem 1.25rem;border-radius:0 0 0.375rem 0.375rem;border-top:1px solid rgb(var(--kompendium-contrast-600))}.methods-returns h5{margin-top:0}@media (max-width: 800px){.methods-content{grid-gap:0.75rem;grid-auto-flow:row;grid-template-columns:unset}}.styles-layout{display:grid;grid-auto-flow:column;grid-template-columns:1fr 1fr;grid-gap:0 0.75rem;border:solid rgb(var(--kompendium-contrast-500));border-width:1px 1px 0 1px;padding:0.5rem;background-color:rgb(var(--kompendium-contrast-300))}.styles-layout:first-of-type{border-top-right-radius:0.375rem;border-top-left-radius:0.375rem}.styles-layout:last-of-type{border-bottom-right-radius:0.375rem;border-bottom-left-radius:0.375rem;border-bottom-width:1px}.styles-layout:nth-of-type(odd){background-color:rgb(var(--kompendium-contrast-400))}.styles-title code{font-family:var(--kompendium-font-code);border-radius:0.25rem;border:1px solid rgba(var(--kompendium-contrast-1100), 0.1);font-size:0.6875rem;white-space:pre-wrap;color:rgb(var(--kompendium-contrast-1100));padding:0.125rem 0.3125rem;margin:0 0.125rem;background:rgba(var(--kompendium-contrast-1100), 0.05)}@media (max-width: 800px){.styles-layout{grid-auto-flow:row;grid-template-columns:unset;grid-gap:0.75rem 0}}:host{display:block}.docs kompendium-markdown{display:block;width:100%;max-width:60rem}";
+
+const Type = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+    }
+    componentWillRender() {
+        this.findType();
+    }
+    render() {
+        if (!this.type) {
+            return;
+        }
+        const type = this.type;
+        const componentMap = {
+            interface: Interface,
+            alias: Alias,
+            enum: Enum,
+            class: Interface,
+        };
+        const TypeComponent = componentMap[this.type.type];
+        return (index.h("article", { class: "type" }, index.h("section", { class: "docs" }, index.h(TypeComponent, { type: type }))));
+    }
+    findType() {
+        const type = this.types.find((type) => type.name === this.match.params.name);
+        if (type) {
+            this.type = type;
+        }
+    }
+};
+Type.style = componentCss;
+
+exports.kompendium_type = Type;
+//# sourceMappingURL=kompendium-type.entry.cjs.js.map

package/dist/cjs/kompendium-type.entry.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"kompendium-type.entry.cjs.js","sources":["src/components/type/templates/interface.tsx","src/components/type/templates/alias.tsx","src/components/type/templates/enum.tsx","src/components/component/component.scss?tag=kompendium-type&encapsulation=shadow","src/components/type/type.tsx"],"sourcesContent":["import { h } from '@stencil/core';\nimport { InterfaceDescription } from '../../../types';\nimport { PropertyList } from '../../component/templates/props';\nimport { MethodList } from '../../component/templates/methods';\n\nexport function Interface({\n    type,\n}: {\n    type: InterfaceDescription;\n}): HTMLElement[] {\n    return [\n        <h1 id={type.name}>{type.name}</h1>,\n        <kompendium-markdown text={type.docs} />,\n        <kompendium-taglist tags={type.docsTags} />,\n        <PropertyList props={type.props} />,\n        <MethodList methods={type.methods} />,\n    ];\n}\n","import { h } from '@stencil/core';\nimport { AliasDescription } from '../../../types';\n\nexport function Alias({ type }: { type: AliasDescription }): HTMLElement[] {\n    const alias = '`' + type.alias + '`';\n\n    return [\n        <h1 id={type.name}>{type.name}</h1>,\n        <kompendium-markdown text={type.docs} />,\n        <kompendium-taglist tags={type.docsTags} />,\n        <kompendium-markdown text={alias} />,\n    ];\n}\n","import { h } from '@stencil/core';\nimport { EnumDescription, EnumMember } from '../../../types';\nimport { ProplistItem } from '../../proplist/proplist';\n\nexport function Enum({ type }: { type: EnumDescription }): HTMLElement[] {\n    return [\n        <h1 id={type.name}>{type.name}</h1>,\n        <kompendium-markdown text={type.docs} />,\n        <kompendium-taglist tags={type.docsTags} />,\n        <MemberList members={type.members} />,\n    ];\n}\n\nfunction MemberList({ members }: { members: EnumMember[] }): HTMLElement[] {\n    if (!members.length) {\n        return;\n    }\n\n    return [<h3>Members</h3>, ...members.map(renderMember)];\n}\n\nfunction renderMember(member: EnumMember) {\n    const items: ProplistItem[] = [\n        {\n            key: 'Value',\n            value: member.value,\n        },\n    ];\n\n    return (\n        <div>\n            <h4>{member.name}</h4>\n            <kompendium-markdown text={member.docs} />\n            <kompendium-taglist tags={member.docsTags} />\n            <kompendium-proplist items={items} />\n        </div>\n    );\n}\n","@use '../../style/reset.scss';\n@use '../../style/variables.scss';\n@use '../../style/mixins.scss';\n@use '../../style/functions.scss';\n@use '../../style/typography.scss';\n@use '../../style/global-layout-rules.scss';\n\n:host {\n    display: block;\n}\n\n.docs {\n    kompendium-markdown {\n        display: block;\n        width: 100%;\n        max-width: functions.pxToRem(960);\n    }\n}\n","import { Component, h, Prop, State } from '@stencil/core';\nimport { TypeDescription, TypeDescriptionType } from '../../types';\nimport { MatchResults } from '@limetech/stencil-router';\nimport { Interface } from './templates/interface';\nimport { Alias } from './templates/alias';\nimport { Enum } from './templates/enum';\n\n@Component({\n    tag: 'kompendium-type',\n    shadow: true,\n    styleUrl: '../component/component.scss',\n})\nexport class Type {\n    /**\n     */\n    @Prop()\n    public types: TypeDescription[];\n\n    /**\n     * Matched route parameters\n     */\n    @Prop()\n    public match: MatchResults;\n\n    @State()\n    private type: TypeDescription;\n\n    public componentWillRender(): void {\n        this.findType();\n    }\n\n    render(): HTMLElement {\n        if (!this.type) {\n            return;\n        }\n\n        const type: any = this.type;\n        const componentMap: Record<TypeDescriptionType, any> = {\n            interface: Interface,\n            alias: Alias,\n            enum: Enum,\n            class: Interface,\n        };\n        const TypeComponent = componentMap[this.type.type];\n\n        return (\n            <article class=\"type\">\n                <section class=\"docs\">\n                    <TypeComponent type={type} />\n                </section>\n            </article>\n        );\n    }\n\n    private findType() {\n        const type = this.types.find(\n            (type) => type.name === this.match.params.name,\n        );\n\n        if (type) {\n            this.type = type;\n        }\n    }\n}\n"],"names":["h","PropertyList","MethodList"],"mappings":";;;;;AAKgB,SAAA,SAAS,CAAC,EACtB,IAAI,GAGP,EAAA;IACG,OAAO;AACH,QAAAA,OAAI,CAAA,IAAA,EAAA,EAAA,EAAE,EAAE,IAAI,CAAC,IAAI,EAAG,EAAA,IAAI,CAAC,IAAI,CAAM;QACnCA,OAAA,CAAA,qBAAA,EAAA,EAAqB,IAAI,EAAE,IAAI,CAAC,IAAI,EAAI,CAAA;QACxCA,OAAA,CAAA,oBAAA,EAAA,EAAoB,IAAI,EAAE,IAAI,CAAC,QAAQ,EAAI,CAAA;QAC3CA,OAAA,CAACC,oBAAY,EAAC,EAAA,KAAK,EAAE,IAAI,CAAC,KAAK,EAAI,CAAA;QACnCD,OAAA,CAACE,kBAAU,EAAC,EAAA,OAAO,EAAE,IAAI,CAAC,OAAO,EAAI,CAAA;KACxC;AACL;;ACdgB,SAAA,KAAK,CAAC,EAAE,IAAI,EAA8B,EAAA;IACtD,MAAM,KAAK,GAAG,GAAG,GAAG,IAAI,CAAC,KAAK,GAAG,GAAG;IAEpC,OAAO;AACH,QAAAF,OAAI,CAAA,IAAA,EAAA,EAAA,EAAE,EAAE,IAAI,CAAC,IAAI,EAAG,EAAA,IAAI,CAAC,IAAI,CAAM;QACnCA,OAAA,CAAA,qBAAA,EAAA,EAAqB,IAAI,EAAE,IAAI,CAAC,IAAI,EAAI,CAAA;QACxCA,OAAA,CAAA,oBAAA,EAAA,EAAoB,IAAI,EAAE,IAAI,CAAC,QAAQ,EAAI,CAAA;QAC3CA,OAAqB,CAAA,qBAAA,EAAA,EAAA,IAAI,EAAE,KAAK,EAAI,CAAA;KACvC;AACL;;ACRgB,SAAA,IAAI,CAAC,EAAE,IAAI,EAA6B,EAAA;IACpD,OAAO;AACH,QAAAA,OAAI,CAAA,IAAA,EAAA,EAAA,EAAE,EAAE,IAAI,CAAC,IAAI,EAAG,EAAA,IAAI,CAAC,IAAI,CAAM;QACnCA,OAAA,CAAA,qBAAA,EAAA,EAAqB,IAAI,EAAE,IAAI,CAAC,IAAI,EAAI,CAAA;QACxCA,OAAA,CAAA,oBAAA,EAAA,EAAoB,IAAI,EAAE,IAAI,CAAC,QAAQ,EAAI,CAAA;QAC3CA,OAAA,CAAC,UAAU,EAAC,EAAA,OAAO,EAAE,IAAI,CAAC,OAAO,EAAI,CAAA;KACxC;AACL;AAEA,SAAS,UAAU,CAAC,EAAE,OAAO,EAA6B,EAAA;AACtD,IAAA,IAAI,CAAC,OAAO,CAAC,MAAM,EAAE;QACjB;;AAGJ,IAAA,OAAO,CAACA,OAAgB,CAAA,IAAA,EAAA,IAAA,EAAA,SAAA,CAAA,EAAE,GAAG,OAAO,CAAC,GAAG,CAAC,YAAY,CAAC,CAAC;AAC3D;AAEA,SAAS,YAAY,CAAC,MAAkB,EAAA;AACpC,IAAA,MAAM,KAAK,GAAmB;AAC1B,QAAA;AACI,YAAA,GAAG,EAAE,OAAO;YACZ,KAAK,EAAE,MAAM,CAAC,KAAK;AACtB,SAAA;KACJ;IAED,QACIA,OAAA,CAAA,KAAA,EAAA,IAAA,EACIA,OAAK,CAAA,IAAA,EAAA,IAAA,EAAA,MAAM,CAAC,IAAI,CAAM,EACtBA,OAAA,CAAA,qBAAA,EAAA,EAAqB,IAAI,EAAE,MAAM,CAAC,IAAI,EAAI,CAAA,EAC1CA,OAAA,CAAA,oBAAA,EAAA,EAAoB,IAAI,EAAE,MAAM,CAAC,QAAQ,EAAI,CAAA,EAC7CA,OAAA,CAAA,qBAAA,EAAA,EAAqB,KAAK,EAAE,KAAK,EAAI,CAAA,CACnC;AAEd;;ACrCA,MAAM,YAAY,GAAG,kyLAAkyL;;MCY1yL,IAAI,GAAA,MAAA;;;;IAeN,mBAAmB,GAAA;QACtB,IAAI,CAAC,QAAQ,EAAE;;IAGnB,MAAM,GAAA;AACF,QAAA,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE;YACZ;;AAGJ,QAAA,MAAM,IAAI,GAAQ,IAAI,CAAC,IAAI;AAC3B,QAAA,MAAM,YAAY,GAAqC;AACnD,YAAA,SAAS,EAAE,SAAS;AACpB,YAAA,KAAK,EAAE,KAAK;AACZ,YAAA,IAAI,EAAE,IAAI;AACV,YAAA,KAAK,EAAE,SAAS;SACnB;QACD,MAAM,aAAa,GAAG,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC;AAElD,QAAA,QACIA,OAAA,CAAA,SAAA,EAAA,EAAS,KAAK,EAAC,MAAM,EAAA,EACjBA,OAAS,CAAA,SAAA,EAAA,EAAA,KAAK,EAAC,MAAM,EAAA,EACjBA,OAAC,CAAA,aAAa,IAAC,IAAI,EAAE,IAAI,EAAI,CAAA,CACvB,CACJ;;IAIV,QAAQ,GAAA;QACZ,MAAM,IAAI,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CACxB,CAAC,IAAI,KAAK,IAAI,CAAC,IAAI,KAAK,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,IAAI,CACjD;QAED,IAAI,IAAI,EAAE;AACN,YAAA,IAAI,CAAC,IAAI,GAAG,IAAI;;;;;;;;"}

package/dist/cjs/kompendium.cjs.js

@@ -0,0 +1,25 @@
+'use strict';
+
+var index = require('./index-DYiJ6dQL.js');
+
+var _documentCurrentScript = typeof document !== 'undefined' ? document.currentScript : null;
+/*
+ Stencil Client Patch Browser v4.38.0 | MIT Licensed | https://stenciljs.com
+ */
+
+var patchBrowser = () => {
+  const importMeta = (typeof document === 'undefined' ? require('u' + 'rl').pathToFileURL(__filename).href : (_documentCurrentScript && _documentCurrentScript.tagName.toUpperCase() === 'SCRIPT' && _documentCurrentScript.src || new URL('kompendium.cjs.js', document.baseURI).href));
+  const opts = {};
+  if (importMeta !== "") {
+    opts.resourcesUrl = new URL(".", importMeta).href;
+  }
+  return index.promiseResolve(opts);
+};
+
+patchBrowser().then(async (options) => {
+  await index.globalScripts();
+  return index.bootstrapLazy([["kompendium-component.cjs",[[257,"kompendium-component",{"docs":[16],"schemas":[16],"match":[16],"examplePropsFactory":[16]}]]],["kompendium-type.cjs",[[257,"kompendium-type",{"types":[16],"match":[16],"type":[32]}]]],["kompendium-example-code.cjs",[[257,"kompendium-example-code"]]],["kompendium-example-markdown.cjs",[[257,"kompendium-example-markdown"]]],["kompendium-guide.cjs",[[257,"kompendium-guide",{"data":[16],"route":[32]}]]],["kompendium-debug.cjs",[[257,"kompendium-debug",{"docs":[16],"schemas":[16],"match":[16],"examplePropsFactory":[16]}]]],["kompendium-code.cjs",[[257,"kompendium-code",{"language":[1],"code":[32]}]]],["kompendium-markdown.cjs",[[257,"kompendium-markdown",{"text":[1]}]]],["kompendium-playground.cjs",[[257,"kompendium-playground",{"component":[16],"schema":[16],"propsFactory":[16],"activeTab":[32],"theme":[32]}]]],["kompendium-proplist_2.cjs",[[257,"kompendium-proplist",{"items":[16]}],[257,"kompendium-taglist",{"tags":[16],"compact":[4]}]]],["kompendium-app_7.cjs",[[257,"kompendium-app",{"path":[1],"examplePropsFactory":[16],"data":[32],"index":[32]},null,{"data":["watchData"]}],[257,"kompendium-navigation",{"menu":[16],"header":[1],"logo":[1],"index":[8],"route":[32],"displayNavPanel":[32]}],[260,"stencil-route",{"url":[1],"component":[1],"componentProps":[16],"routeRender":[16],"currentPath":[32]}],[260,"stencil-route-switch",{"scrollTopOffset":[2,"scroll-top-offset"],"currentPath":[32]}],[260,"stencil-router"],[257,"kompendium-darkmode-switch",{"theme":[32],"systemSettingIsDark":[32]}],[257,"kompendium-search",{"index":[8],"documents":[32]}]]]], options);
+});
+
+exports.setNonce = index.setNonce;
+//# sourceMappingURL=kompendium.cjs.js.map

package/dist/cjs/kompendium.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"kompendium.cjs.js","sources":["node_modules/@stencil/core/internal/client/patch-browser.js","@lazy-browser-entrypoint?app-data=conditional"],"sourcesContent":["/*\n Stencil Client Patch Browser v4.38.0 | MIT Licensed | https://stenciljs.com\n */\n\n// src/client/client-patch-browser.ts\nimport { BUILD, NAMESPACE } from \"@stencil/core/internal/app-data\";\nimport { consoleDevInfo, H, promiseResolve, win } from \"@stencil/core\";\nvar patchBrowser = () => {\n  if (BUILD.isDev && !BUILD.isTesting) {\n    consoleDevInfo(\"Running in development mode.\");\n  }\n  if (BUILD.cloneNodeFix) {\n    patchCloneNodeFix(H.prototype);\n  }\n  const scriptElm = BUILD.scriptDataOpts ? win.document && Array.from(win.document.querySelectorAll(\"script\")).find(\n    (s) => new RegExp(`/${NAMESPACE}(\\\\.esm)?\\\\.js($|\\\\?|#)`).test(s.src) || s.getAttribute(\"data-stencil-namespace\") === NAMESPACE\n  ) : null;\n  const importMeta = import.meta.url;\n  const opts = BUILD.scriptDataOpts ? (scriptElm || {})[\"data-opts\"] || {} : {};\n  if (importMeta !== \"\") {\n    opts.resourcesUrl = new URL(\".\", importMeta).href;\n  }\n  return promiseResolve(opts);\n};\nvar patchCloneNodeFix = (HTMLElementPrototype) => {\n  const nativeCloneNodeFn = HTMLElementPrototype.cloneNode;\n  HTMLElementPrototype.cloneNode = function(deep) {\n    if (this.nodeName === \"TEMPLATE\") {\n      return nativeCloneNodeFn.call(this, deep);\n    }\n    const clonedNode = nativeCloneNodeFn.call(this, false);\n    const srcChildNodes = this.childNodes;\n    if (deep) {\n      for (let i = 0; i < srcChildNodes.length; i++) {\n        if (srcChildNodes[i].nodeType !== 2) {\n          clonedNode.appendChild(srcChildNodes[i].cloneNode(true));\n        }\n      }\n    }\n    return clonedNode;\n  };\n};\nexport {\n  patchBrowser\n};\n","export { setNonce } from '@stencil/core';\nimport { bootstrapLazy } from '@stencil/core';\nimport { patchBrowser } from '@stencil/core/internal/client/patch-browser';\nimport { globalScripts } from '@stencil/core/internal/app-globals';\npatchBrowser().then(async (options) => {\n  await globalScripts();\n  return bootstrapLazy([/*!__STENCIL_LAZY_DATA__*/], options);\n});\n"],"names":["promiseResolve","globalScripts","bootstrapLazy"],"mappings":";;;;;AAAA;AACA;AACA;;AAKA,IAAI,YAAY,GAAG,MAAM;AAUzB,EAAE,MAAM,UAAU,GAAG,mQAAe;AACpC,EAAE,MAAM,IAAI,GAAiE,EAAE;AAC/E,EAAE,IAAI,UAAU,KAAK,EAAE,EAAE;AACzB,IAAI,IAAI,CAAC,YAAY,GAAG,IAAI,GAAG,CAAC,GAAG,EAAE,UAAU,CAAC,CAAC,IAAI;AACrD;AACA,EAAE,OAAOA,oBAAc,CAAC,IAAI,CAAC;AAC7B,CAAC;;ACnBD,YAAY,EAAE,CAAC,IAAI,CAAC,OAAO,OAAO,KAAK;AACvC,EAAE,MAAMC,mBAAa,EAAE;AACvB,EAAE,OAAOC,mBAAa,CAAC,4BAA4B,EAAE,OAAO,CAAC;AAC7D,CAAC,CAAC;;;;","x_google_ignoreList":[0]}

package/dist/cjs/loader.cjs.js

@@ -0,0 +1,13 @@
+'use strict';
+
+var index = require('./index-DYiJ6dQL.js');
+
+const defineCustomElements = async (win, options) => {
+  if (typeof window === 'undefined') return undefined;
+  await index.globalScripts();
+  return index.bootstrapLazy([["kompendium-component.cjs",[[257,"kompendium-component",{"docs":[16],"schemas":[16],"match":[16],"examplePropsFactory":[16]}]]],["kompendium-type.cjs",[[257,"kompendium-type",{"types":[16],"match":[16],"type":[32]}]]],["kompendium-example-code.cjs",[[257,"kompendium-example-code"]]],["kompendium-example-markdown.cjs",[[257,"kompendium-example-markdown"]]],["kompendium-guide.cjs",[[257,"kompendium-guide",{"data":[16],"route":[32]}]]],["kompendium-debug.cjs",[[257,"kompendium-debug",{"docs":[16],"schemas":[16],"match":[16],"examplePropsFactory":[16]}]]],["kompendium-code.cjs",[[257,"kompendium-code",{"language":[1],"code":[32]}]]],["kompendium-markdown.cjs",[[257,"kompendium-markdown",{"text":[1]}]]],["kompendium-playground.cjs",[[257,"kompendium-playground",{"component":[16],"schema":[16],"propsFactory":[16],"activeTab":[32],"theme":[32]}]]],["kompendium-proplist_2.cjs",[[257,"kompendium-proplist",{"items":[16]}],[257,"kompendium-taglist",{"tags":[16],"compact":[4]}]]],["kompendium-app_7.cjs",[[257,"kompendium-app",{"path":[1],"examplePropsFactory":[16],"data":[32],"index":[32]},null,{"data":["watchData"]}],[257,"kompendium-navigation",{"menu":[16],"header":[1],"logo":[1],"index":[8],"route":[32],"displayNavPanel":[32]}],[260,"stencil-route",{"url":[1],"component":[1],"componentProps":[16],"routeRender":[16],"currentPath":[32]}],[260,"stencil-route-switch",{"scrollTopOffset":[2,"scroll-top-offset"],"currentPath":[32]}],[260,"stencil-router"],[257,"kompendium-darkmode-switch",{"theme":[32],"systemSettingIsDark":[32]}],[257,"kompendium-search",{"index":[8],"documents":[32]}]]]], options);
+};
+
+exports.setNonce = index.setNonce;
+exports.defineCustomElements = defineCustomElements;
+//# sourceMappingURL=loader.cjs.js.map

package/dist/cjs/loader.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"loader.cjs.js","sources":["@lazy-external-entrypoint?app-data=conditional"],"sourcesContent":["export { setNonce } from '@stencil/core';\nimport { bootstrapLazy } from '@stencil/core';\nimport { globalScripts } from '@stencil/core/internal/app-globals';\nexport const defineCustomElements = async (win, options) => {\n  if (typeof window === 'undefined') return undefined;\n  await globalScripts();\n  return bootstrapLazy([/*!__STENCIL_LAZY_DATA__*/], options);\n};\n"],"names":["globalScripts","bootstrapLazy"],"mappings":";;;;AAGY,MAAC,oBAAoB,GAAG,OAAO,GAAG,EAAE,OAAO,KAAK;AAC5D,EAAE,IAAI,OAAO,MAAM,KAAK,WAAW,EAAE,OAAO,SAAS;AACrD,EAAE,MAAMA,mBAAa,EAAE;AACvB,EAAE,OAAOC,mBAAa,CAAC,4BAA4B,EAAE,OAAO,CAAC;AAC7D;;;;;"}

package/dist/cjs/markdown-types-B884tLd-.js

@@ -0,0 +1,15 @@
+'use strict';
+
+let types = [];
+function getTypes() {
+    return types;
+}
+function setTypes(newTypes) {
+    types = newTypes;
+}
+
+exports.getTypes = getTypes;
+exports.setTypes = setTypes;
+//# sourceMappingURL=markdown-types-B884tLd-.js.map
+
+//# sourceMappingURL=markdown-types-B884tLd-.js.map

package/dist/cjs/markdown-types-B884tLd-.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"markdown-types-B884tLd-.js","sources":["src/components/markdown/markdown-types.ts"],"sourcesContent":["let types: string[] = [];\n\nexport function getTypes(): string[] {\n    return types;\n}\n\nexport function setTypes(newTypes: string[]): void {\n    types = newTypes;\n}\n"],"names":[],"mappings":";;AAAA,IAAI,KAAK,GAAa,EAAE;SAER,QAAQ,GAAA;AACpB,IAAA,OAAO,KAAK;AAChB;AAEM,SAAU,QAAQ,CAAC,QAAkB,EAAA;IACvC,KAAK,GAAG,QAAQ;AACpB;;;;;"}

package/dist/cjs/methods-DoA78dOH.js

@@ -0,0 +1,97 @@
+'use strict';
+
+var index = require('./index-DYiJ6dQL.js');
+
+function PropertyList({ props, id, }) {
+    if (!props.length) {
+        return;
+    }
+    return [
+        index.h("h3", { class: "docs-layout-section-heading", id: id }, "Properties"),
+        ...props.map(renderProperty),
+    ];
+}
+function renderProperty(property) {
+    const items = [
+        {
+            key: 'Type',
+            value: property.type,
+        },
+        {
+            key: 'Attribute name',
+            value: property.attr,
+        },
+        {
+            key: 'Default value',
+            value: property.default,
+        },
+        {
+            key: 'Optional',
+            value: String(property.optional),
+        },
+        {
+            key: 'Required',
+            value: String(property.required),
+        },
+    ].filter((item) => item.value !== undefined && item.value !== 'undefined');
+    return (index.h("div", { class: "props-events-layout" }, index.h("h4", null, property.name), index.h("kompendium-taglist", { tags: property.docsTags }), index.h("div", { class: "markdown-props" }, index.h("kompendium-markdown", { text: property.docs }), index.h("kompendium-proplist", { items: items }))));
+}
+
+function MethodList({ methods, id, }) {
+    if (!methods.length) {
+        return;
+    }
+    return [
+        index.h("h3", { class: "docs-layout-section-heading", id: id }, "Methods"),
+        ...methods.map(renderMethod),
+    ];
+}
+function renderMethod(method) {
+    const items = [
+        {
+            key: 'Signature',
+            value: method.signature,
+        },
+    ].filter((item) => item.value !== undefined);
+    return (index.h("div", { class: "methods-layout" }, index.h("h4", { class: "methods-title" }, method.name), index.h("div", { class: "methods-content" }, index.h("div", null, index.h("kompendium-markdown", { text: method.docs })), index.h("div", null, index.h("kompendium-taglist", { tags: method.docsTags }), index.h("kompendium-proplist", { items: items }), index.h(ParamList, { params: method.parameters }))), index.h("div", { class: "methods-returns" }, index.h(Returns, { value: method.returns }))));
+}
+function ParamList({ params }) {
+    if (!params.length) {
+        return;
+    }
+    return [index.h("h5", null, "Parameters"), ...params.map(renderParam)];
+}
+function renderParam(param) {
+    const items = [
+        {
+            key: 'Type',
+            value: param.type,
+        },
+        {
+            key: 'Optional',
+            value: String(param.optional),
+        },
+        {
+            key: 'Default',
+            value: param.default,
+        },
+    ].filter((item) => item.value !== undefined);
+    return (index.h("div", null, index.h("h6", null, param.name), index.h("kompendium-markdown", { text: param.docs }), index.h("kompendium-proplist", { items: items })));
+}
+function Returns({ value }) {
+    if (!value) {
+        return;
+    }
+    const type = '`' + value.type + '`';
+    return [
+        index.h("h5", null, "Returns"),
+        index.h("kompendium-markdown", { text: value.docs }),
+        index.h("kompendium-markdown", { text: type }),
+    ];
+}
+
+exports.MethodList = MethodList;
+exports.PropertyList = PropertyList;
+//# sourceMappingURL=methods-DoA78dOH.js.map
+
+//# sourceMappingURL=methods-DoA78dOH.js.map

package/dist/cjs/methods-DoA78dOH.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"methods-DoA78dOH.js","sources":["src/components/component/templates/props.tsx","src/components/component/templates/methods.tsx"],"sourcesContent":["import { JsonDocsProp } from '@stencil/core/internal';\nimport { h } from '@stencil/core';\nimport { ProplistItem } from '../../proplist/proplist';\n\nexport function PropertyList({\n    props,\n    id,\n}: {\n    id?: string;\n    props: Array<Partial<JsonDocsProp>>;\n}): HTMLElement[] {\n    if (!props.length) {\n        return;\n    }\n\n    return [\n        <h3 class=\"docs-layout-section-heading\" id={id}>\n            Properties\n        </h3>,\n        ...props.map(renderProperty),\n    ];\n}\n\nfunction renderProperty(property: JsonDocsProp) {\n    const items: ProplistItem[] = [\n        {\n            key: 'Type',\n            value: property.type,\n        },\n        {\n            key: 'Attribute name',\n            value: property.attr,\n        },\n        {\n            key: 'Default value',\n            value: property.default,\n        },\n        {\n            key: 'Optional',\n            value: String(property.optional),\n        },\n        {\n            key: 'Required',\n            value: String(property.required),\n        },\n    ].filter((item) => item.value !== undefined && item.value !== 'undefined');\n\n    return (\n        <div class=\"props-events-layout\">\n            <h4>{property.name}</h4>\n            <kompendium-taglist tags={property.docsTags} />\n            <div class=\"markdown-props\">\n                <kompendium-markdown text={property.docs} />\n                <kompendium-proplist items={items} />\n            </div>\n        </div>\n    );\n}\n","import {\n    JsonDocsMethod,\n    JsonDocMethodParameter,\n    JsonDocsMethodReturn,\n} from '@stencil/core/internal';\nimport { h } from '@stencil/core';\nimport { ProplistItem } from '../../proplist/proplist';\nimport { ParameterDescription } from '../../../types';\n\nexport function MethodList({\n    methods,\n    id,\n}: {\n    id?: string;\n    methods: Array<Partial<JsonDocsMethod>>;\n}): HTMLElement[] {\n    if (!methods.length) {\n        return;\n    }\n\n    return [\n        <h3 class=\"docs-layout-section-heading\" id={id}>\n            Methods\n        </h3>,\n        ...methods.map(renderMethod),\n    ];\n}\n\nfunction renderMethod(method: JsonDocsMethod) {\n    const items: ProplistItem[] = [\n        {\n            key: 'Signature',\n            value: method.signature,\n        },\n    ].filter((item) => item.value !== undefined);\n\n    return (\n        <div class=\"methods-layout\">\n            <h4 class=\"methods-title\">{method.name}</h4>\n            <div class=\"methods-content\">\n                <div>\n                    <kompendium-markdown text={method.docs} />\n                </div>\n                <div>\n                    <kompendium-taglist tags={method.docsTags} />\n                    <kompendium-proplist items={items} />\n                    <ParamList params={method.parameters} />\n                </div>\n            </div>\n            <div class=\"methods-returns\">\n                <Returns value={method.returns} />\n            </div>\n        </div>\n    );\n}\n\nfunction ParamList({ params }: { params: JsonDocMethodParameter[] }) {\n    if (!params.length) {\n        return;\n    }\n\n    return [<h5>Parameters</h5>, ...params.map(renderParam)];\n}\n\nfunction renderParam(param: ParameterDescription) {\n    const items: ProplistItem[] = [\n        {\n            key: 'Type',\n            value: param.type,\n        },\n        {\n            key: 'Optional',\n            value: String(param.optional),\n        },\n        {\n            key: 'Default',\n            value: param.default,\n        },\n    ].filter((item) => item.value !== undefined);\n\n    return (\n        <div>\n            <h6>{param.name}</h6>\n            <kompendium-markdown text={param.docs} />\n            <kompendium-proplist items={items} />\n        </div>\n    );\n}\n\nfunction Returns({ value }: { value: JsonDocsMethodReturn }) {\n    if (!value) {\n        return;\n    }\n\n    const type = '`' + value.type + '`';\n\n    return [\n        <h5>Returns</h5>,\n        <kompendium-markdown text={value.docs} />,\n        <kompendium-markdown text={type} />,\n    ];\n}\n"],"names":["h"],"mappings":"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"}

package/dist/cjs/types-SjA7Kcy_.js

@@ -0,0 +1,8 @@
+'use strict';
+
+const THEME_EVENT_NAME = 'kompendiumTheme';
+
+exports.THEME_EVENT_NAME = THEME_EVENT_NAME;
+//# sourceMappingURL=types-SjA7Kcy_.js.map
+
+//# sourceMappingURL=types-SjA7Kcy_.js.map

package/dist/cjs/types-SjA7Kcy_.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types-SjA7Kcy_.js","sources":["src/components/darkmode-switch/types.ts"],"sourcesContent":["export type Theme = 'system-default' | 'force-light' | 'force-dark';\nexport const THEME_EVENT_NAME = 'kompendiumTheme';\n"],"names":[],"mappings":";;AACO,MAAM,gBAAgB,GAAG;;;;"}

package/dist/collection/assets/favicon.svg

@@ -0,0 +1,65 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg width="100%" height="100%" viewBox="0 0 148 80" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
+  <style>
+    @keyframes blink {
+      0%, 10%, 90%, 100% {
+        opacity: 1;
+      }
+      50%, 60% {
+        opacity: 0;
+      }
+    }
+    #backplate {
+      fill:#254758;
+      fill-rule:nonzero;
+    }
+    #blinker {
+      fill:#ffa000;
+      fill-rule:nonzero;
+      animation: blink 1s ease;
+      animation-iteration-count: 4;
+    }
+    #logotype {
+      fill:#00c853;
+      fill-rule:nonzero;
+    }
+
+    @media (prefers-color-scheme:dark){
+      #backplate {
+        fill:#224150
+      }
+      #blinker {
+        fill:#ff8f00
+      }
+      #logotype {
+        fill:#00B94A
+      }
+    }
+  </style>
+    <g transform="matrix(1,0,0,1,-5264.22,0)">
+        <g id="favicon" transform="matrix(0.0927545,0,0,0.0807867,4835.74,0)">
+            <rect x="4619.47" y="0" width="1595.61" height="990.262" style="fill:none;"/>
+            <clipPath id="_clip1">
+                <rect x="4619.47" y="0" width="1595.61" height="990.262"/>
+            </clipPath>
+            <g clip-path="url(#_clip1)">
+                <g transform="matrix(2.01166,0,0,8.47173,4136.87,-2041.77)">
+                    <path 
+                      id="backplate"
+                      d="M1033.16,270.232C1033.16,254.104 985.135,241.01 925.977,241.01L347.001,241.01C287.844,241.01 239.815,254.104 239.815,270.232L239.815,328.677C239.815,344.806 287.844,357.9 347.001,357.9L925.977,357.9C985.135,357.9 1033.16,344.806 1033.16,328.677L1033.16,270.232Z"/>
+                </g>
+                <g transform="matrix(12.0222,0,0,13.8032,-37803.4,-3487.35)">
+                    <path
+                      id="blinker"
+                      d="M3552.55,291.794L3552.55,304.89L3546,304.89L3546,291.794L3552.55,291.794ZM3552.55,285.245L3546,285.245L3546,272.149L3552.55,272.149L3552.55,285.245Z"/>
+                </g>
+                <g transform="matrix(12.0222,0,0,13.8032,-79804.4,-6339.25)">
+                    <path
+                      id="logotype"
+                      d="M7118.15,511.502L7118.15,504.953L7124.7,504.953L7124.7,498.405L7131.25,498.405L7131.25,491.857L7124.7,491.857L7124.7,485.308L7118.15,485.308L7118.15,478.76L7124.7,478.76L7124.7,485.308L7131.25,485.308L7131.25,491.857L7137.79,491.857L7137.79,498.405L7131.25,498.405L7131.25,504.953L7124.7,504.953L7124.7,511.502L7118.15,511.502ZM7078.86,511.502L7078.86,504.953L7085.41,504.953L7085.41,498.405L7091.96,498.405L7091.96,491.857L7098.51,491.857L7098.51,485.308L7105.05,485.308L7105.05,478.76L7111.6,478.76L7111.6,485.308L7105.05,485.308L7105.05,491.857L7098.51,491.857L7098.51,498.405L7091.96,498.405L7091.96,504.953L7085.41,504.953L7085.41,511.502L7078.86,511.502ZM7065.77,511.502L7065.77,504.953L7059.22,504.953L7059.22,498.405L7052.67,498.405L7052.67,491.857L7059.22,491.857L7059.22,485.308L7065.77,485.308L7065.77,478.76L7072.31,478.76L7072.31,485.308L7065.77,485.308L7065.77,491.857L7059.22,491.857L7059.22,498.405L7065.77,498.405L7065.77,504.953L7072.31,504.953L7072.31,511.502L7065.77,511.502Z"/>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>

package/dist/collection/assets/icons/bookmark-fill.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M5 2h14a1 1 0 0 1 1 1v19.143a.5.5 0 0 1-.766.424L12 18.03l-7.234 4.536A.5.5 0 0 1 4 22.143V3a1 1 0 0 1 1-1z" fill="#000"/></svg>

package/dist/collection/assets/icons/danger.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="2" clip-rule="evenodd" viewBox="0 0 400 400"><defs/><path fill="none" d="M0 0h400v400H0z"/><path fill="#446c80" d="M100.7 233.141c-5.6-12.935-8.7-27.173-8.7-42.122C92 131.954 140.393 84 200 84s108 47.954 108 107.019c0 14.949-3.1 29.187-8.7 42.122-4.582 26.722-21.33 48.534-43.425 57.687v12.728c0 10.357-8.485 18.764-18.935 18.764-9.066 0-16.653-6.327-18.504-14.765-1.962 8.291-9.477 14.47-18.436 14.47-9.012 0-16.562-6.251-18.47-14.615-1.909 8.364-9.459 14.615-18.47 14.615-10.45 0-18.935-8.407-18.935-18.764v-12.433c-22.096-9.154-38.844-30.967-43.425-57.687z"/><path fill="#fff" fill-opacity=".2" d="M213.322 264.164c-3.328 3.135-23.317 3.135-26.644 0-3.332-3.136-3.332-4.928 0-11.199 2.328-4.703 9.832-17.022 13.322-17.022 3.489 0 10.993 12.319 13.322 17.022 3.331 6.271 3.331 8.063 0 11.199z"/><path fill="#fff" d="M150.179 213.14c12.03 0 21.797 9.678 21.797 21.599s-9.767 21.599-21.797 21.599c-12.03 0-21.797-9.678-21.797-21.599s9.767-21.599 21.797-21.599zm100.844 12.114l8.678-8.598c2.635-2.612 6.896-2.624 9.557.014 2.644 2.619 2.618 6.891.015 9.47l-8.678 8.599 8.678 8.599a6.637 6.637 0 01-.015 9.47c-2.643 2.619-6.954 2.594-9.557.014l-8.678-8.598-8.677 8.598c-2.635 2.612-6.896 2.624-9.558-.014-2.643-2.619-2.617-6.89-.014-9.47l8.678-8.599-8.678-8.599a6.638 6.638 0 01.014-9.47c2.644-2.619 6.954-2.594 9.558-.014l8.677 8.598z"/></svg>