import { r as registerInstance, h } from './index-D0dWnGvB.js';

const DgaCollapseUsage = class {
    constructor(hostRef) {
        registerInstance(this, hostRef);
        this.variant = 'neutral';
        this.open = false;
    }
    render() {
        return (h("div", { key: 'ad1f3f0e1cf28490ef2970a85ad18f42dbf66a8d' }, h("h1", { key: 'f3b60791364960473706e66a166ccd8cebfb1508' }, "Collapse Example"), h("div", { key: '18a70722655f05c530fa263b71a5786ff2a19294', style: { padding: '50px', display: 'flex', gap: '20px' } }, h("div", { key: '27285803d2aa02483a2b6fc4654d9ab67a30f400', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }, h("div", { key: 'db1b4e4bb8a7b3352df5641ca70f47e7f0df94d2', style: { display: "flex", justifyContent: "center" } }, h("button", { key: '3ca2c084ffa9261b6e15d45c8b785408f3e66f0a', onClick: () => this.open = true }, "open"), h("button", { key: '28475f08968c02f0ecd69286e21e0e16124074a9', onClick: () => this.open = false }, "close"))), h("dga-collapse", { key: '4e0f3aa013b7fbd463809026f6a4a6149673ed8e', open: this.open, "transition-duration": "0.1s" }, h("div", { key: '6f13006476b26fa028887be309160128253be56c' }, "Your content here")), h("div", { key: '4eaaed68a082c160be1338d058bfe4b861b6c86f', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }))));
    }
};

export { DgaCollapseUsage as dga_collapse_usage };
