rodydavis
b9e42c3ef4
Build and Deploy / build-and-deploy (push) Has been cancelled
- lit-force-graph: Refactored for instance reuse, better lifecycle management, and added dynamic imports for AR/VR modes. - lit-html-table: Improved visual design, readability of headers, and fixed reactivity in editable mode. - lit-draggable-dom: Fixed clipping issues by switching to relative/absolute positioning and resolved a panning speed bug caused by CSS variable inheritance.
29 lines
852 B
TypeScript
29 lines
852 B
TypeScript
import { html, TemplateResult } from "lit";
|
|
|
|
import "@material/mwc-drawer";
|
|
import { Drawer } from "@material/mwc-drawer";
|
|
|
|
export const appDrawer = (props: {
|
|
title?: string;
|
|
subtitle?: string;
|
|
drawerContent?: TemplateResult;
|
|
appContent?: TemplateResult;
|
|
open?: boolean;
|
|
}) => {
|
|
return html`
|
|
<mwc-drawer hasHeader type="modal" ?open=${props?.open ?? false}>
|
|
${props?.title ? html` <span slot="title">${props.title}e</span>` : ""}
|
|
${props?.subtitle
|
|
? html` <span slot="subtitle">${props.subtitle}e</span>`
|
|
: ""}
|
|
<div>${props?.drawerContent ?? ""}</div>
|
|
<div slot="appContent">${props?.appContent ?? ""}</div>
|
|
</mwc-drawer>
|
|
`;
|
|
};
|
|
|
|
export const toggleDrawer = (root: HTMLElement | ShadowRoot) => {
|
|
const drawer = root.querySelector("mwc-drawer")! as Drawer;
|
|
drawer.open = !drawer.open;
|
|
};
|