@benev/web 0.1.0-2

package/x/css/parts/common.csstext.js

@@ -0,0 +1,172 @@
+import { templateString as css } from "@e280/stz";
+export default css `
+
+button, [benev-button] {
+	font: inherit;
+	text-decoration: none;
+
+	display: inline-flex;
+	align-items: center;
+	flex-wrap: wrap;
+	padding: var(--benev-pad) var(--benev-space);
+
+	font-weight: bold;
+	text-transform: uppercase;
+	color: var(--benev-prime);
+	background: oklch(from var(--benev-bg) l c h / 50%);
+	backdrop-filter: var(--benev-blur);
+	box-shadow: var(--benev-box-shadow);
+	border: var(--benev-thick) solid currentColor;
+	border-radius: var(--benev-round);
+
+	&[disabled] {
+		opacity: 0.3;
+	}
+
+	&:not([disabled]) {
+		cursor: pointer;
+		transform: scale(100%);
+		transition: all var(--benev-anim) ease;
+		&:hover, &:focus-visible { transform: scale(105%); filter: brightness(120%); }
+		&:active { transform: scale(100%); filter: brightness(100%); }
+	}
+
+	&[benev-button="naked"] {
+		color: inherit;
+		background: transparent;
+		backdrop-filter: none;
+		box-shadow: none;
+		padding: 0;
+		border-radius: 0;
+		border: none;
+		text-transform: unset;
+		font-weight: inherit;
+		text-transform: inherit;
+	}
+
+	&[benev-button="juicy"] {
+		opacity: 1;
+		color: black;
+		border: var(--benev-thick) solid var(--benev-prime);
+		background: linear-gradient(
+			to bottom,
+			oklch(from var(--benev-prime) calc(l * 1.5) c h),
+			oklch(from var(--benev-prime) l calc(c * 1.5) h)
+		);
+		&:is(:hover, :focus-visible) {
+			box-shadow: 0 0 2em color-mix(in oklch, transparent, var(--benev-prime));
+		}
+	}
+}
+
+[benev-slice] {
+	width: 100%;
+	max-width: var(--benev-site-width);
+	margin-left: auto;
+	margin-right: auto;
+}
+
+benev-menu:not(:defined) {
+	display: none;
+}
+
+benev-header {
+	display: flex;
+	justify-content: end;
+	align-items: center;
+	width: 100%;
+	max-width: var(--benev-site-width);
+	margin: 0 auto;
+
+	&:not(:defined) {
+		padding: var(--benev-pad);
+		gap: var(--benev-space);
+
+		&::before {
+			content: "";
+			display: inline-block;
+			margin-right: auto;
+			width: var(--benev-b-size);
+			height: var(--benev-b-size);
+		}
+	}
+}
+
+[benev-prose] {
+	display: flex;
+	flex-direction: column;
+	gap: var(--benev-pad);
+
+	h1 {
+		font-size: 2.5em;
+		color: var(--benev-intense);
+		a { color: inherit; }
+	}
+
+	h2 {
+		font-size: 1.5em;
+		color: var(--benev-prime);
+	}
+
+	h3, h4, h5, h6 {
+		color: var(--benev-prime);
+	}
+
+	h1, h2, h3, h4, h5, h6 {
+		margin-top: var(--benev-space);
+	}
+
+	p {
+		max-width: var(--benev-copy-width);
+	}
+
+	p:has(> img) {
+		max-width: 100%;
+	}
+
+	ul, ol {
+		padding-left: 1.5em;
+	}
+
+	img {
+		max-width: 100%;
+		background: #0004;
+		border-radius: var(--benev-round);
+		box-shadow: var(--benev-box-shadow);
+	}
+
+	blockquote {
+		color: oklch(from currentColor l 0 h / 50%);
+		padding-left: var(--benev-pad);
+		margin-left: var(--benev-pad);
+		font-style: italic;
+		border-left: var(--benev-thick) solid currentColor;
+	}
+
+	hr {
+		border: none;
+		display: block;
+		height: var(--benev-thick);
+		background: oklch(from var(--benev-text) l c h / 25%);
+		margin: var(--benev-space) 0;
+	}
+
+	code {
+		font-size: 0.8em;
+
+		display: block;
+		width: 100%;
+		overflow: auto;
+
+		padding: var(--benev-space);
+		color: var(--benev-code);
+		background: var(--benev-backdrop);
+		border-radius: var(--benev-round);
+		border: var(--benev-border);
+		border-color: oklch(from var(--benev-code) l c h / 33%);
+		box-shadow: var(--benev-box-shadow);
+	}
+}
+
+`;
+//# sourceMappingURL=common.csstext.js.map

package/x/css/parts/common.csstext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"common.csstext.js","sourceRoot":"","sources":["../../../s/css/parts/common.csstext.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,cAAc,IAAI,GAAG,EAAC,MAAM,WAAW,CAAA;AAC/C,eAAe,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAyKjB,CAAA"}

package/x/css/parts/core.csstext.d.ts

@@ -0,0 +1,2 @@
+declare const _default: string;
+export default _default;

package/x/css/parts/core.csstext.js

@@ -0,0 +1,55 @@
+import { templateString as css } from "@e280/stz";
+export default css `
+
+&, *, ::before, ::after {
+	margin: 0;
+	padding: 0;
+	box-sizing: border-box;
+	scrollbar-width: thin;
+}
+
+:focus-visible {
+	outline: var(--benev-focus);
+	outline-offset: 0.2em;
+}
+
+::selection {
+	color: var(--benev-select-color);
+	background: var(--benev-select-bg);
+}
+
+a {
+	color: var(--benev-link);
+	text-decoration: none;
+
+	&:visited {
+		color: var(--benev-link);
+	}
+
+	&:hover, &:focus-visible {
+		color: color-mix(in srgb, var(--benev-link), white 15%);
+		text-decoration: underline;
+	}
+
+	&:active {
+		color: color-mix(in srgb, var(--benev-link), white 50%);
+	}
+
+	&[benev-cardlink] {
+		color: inherit;
+
+		&:hover, &:focus-visible {
+			color: inherit;
+			text-decoration: none;
+			filter: brightness(105%);
+		}
+
+		&:active {
+			color: inherit;
+			filter: brightness(95%);
+		}
+	}
+}
+
+`;
+//# sourceMappingURL=core.csstext.js.map

package/x/css/parts/core.csstext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"core.csstext.js","sourceRoot":"","sources":["../../../s/css/parts/core.csstext.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,cAAc,IAAI,GAAG,EAAC,MAAM,WAAW,CAAA;AAC/C,eAAe,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoDjB,CAAA"}

package/x/css/parts/page.csstext.d.ts

@@ -0,0 +1,2 @@
+declare const _default: string;
+export default _default;

package/x/css/parts/page.csstext.js

@@ -0,0 +1,23 @@
+import { templateString as css } from "@e280/stz";
+export default css `
+
+color-scheme: dark;
+
+&:is(html) {
+	font-family: sans-serif;
+	font-size: var(--benev-font-size);
+
+	scrollbar-gutter: stable;
+	scrollbar-width: thin;
+
+	color: var(--benev-text);
+	background: var(--benev-bg);
+	text-shadow: var(--benev-text-shadow);
+}
+
+body {
+	min-height: 100dvh;
+}
+
+`;
+//# sourceMappingURL=page.csstext.js.map

package/x/css/parts/page.csstext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"page.csstext.js","sourceRoot":"","sources":["../../../s/css/parts/page.csstext.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,cAAc,IAAI,GAAG,EAAC,MAAM,WAAW,CAAA;AAC/C,eAAe,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;CAoBjB,CAAA"}

package/x/css/parts/vars.csstext.d.ts

@@ -0,0 +1,2 @@
+declare const _default: string;
+export default _default;

package/x/css/parts/vars.csstext.js

@@ -0,0 +1,39 @@
+import { templateString as css } from "@e280/stz";
+import { consts } from "../../consts.js";
+export default css `
+
+--benev-font-size: 18px;
+--benev-site-width: 62em;
+--benev-copy-width: 70ch;
+--benev-headroom: 2.5em;
+
+--benev-bg: #111;
+--benev-prime: #ebb935;
+--benev-tray: #453e2ca8;
+--benev-text: color-mix(in oklch, var(--benev-prime), #fffc 90%);
+--benev-intense: white;
+--benev-focus: 2px solid cyan;
+--benev-link: aqua;
+--benev-b-size: 1.5em;
+--benev-code: #0f0;
+
+--benev-select-bg: #f60;
+--benev-select-color: #ff8;
+
+--benev-line: #ebb93588;
+--benev-thin: 1px;
+--benev-thick: 3px;
+--benev-border: var(--benev-thin) solid color-mix(in oklch, transparent, var(--benev-line) 50%);
+
+--benev-pad: 0.5em;
+--benev-space: 1em;
+--benev-anim: ${consts.anim}ms;
+--benev-round: 0.5em;
+--benev-blur: blur(1em);
+--benev-backdrop: #0008;
+
+--benev-box-shadow: 0 0.5em 2em #0008;
+--benev-text-shadow: 0.04em 0.08em 0.1em #0008;
+
+`;
+//# sourceMappingURL=vars.csstext.js.map

package/x/css/parts/vars.csstext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"vars.csstext.js","sourceRoot":"","sources":["../../../s/css/parts/vars.csstext.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,cAAc,IAAI,GAAG,EAAC,MAAM,WAAW,CAAA;AAC/C,OAAO,EAAC,MAAM,EAAC,MAAM,iBAAiB,CAAA;AACtC,eAAe,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;gBA2BF,MAAM,CAAC,IAAI;;;;;;;;CAQ1B,CAAA"}

package/x/css/theme.css.d.ts

@@ -0,0 +1 @@
+export declare const themeCss: CSSStyleSheet[];

package/x/css/theme.css.js

@@ -0,0 +1,7 @@
+import { benevCssText } from "./benev.csstext.js";
+export const themeCss = [benevCssText].map(text => {
+    const sheet = new CSSStyleSheet();
+    sheet.replaceSync(text);
+    return sheet;
+});
+//# sourceMappingURL=theme.css.js.map

package/x/css/theme.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme.css.js","sourceRoot":"","sources":["../../s/css/theme.css.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,YAAY,EAAC,MAAM,oBAAoB,CAAA;AAE/C,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,YAAY,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;IACjD,MAAM,KAAK,GAAG,IAAI,aAAa,EAAE,CAAA;IACjC,KAAK,CAAC,WAAW,CAAC,IAAI,CAAC,CAAA;IACvB,OAAO,KAAK,CAAA;AACb,CAAC,CAAC,CAAA"}

package/x/dom/header/style.css.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("lit").CSSResult;
+export default _default;

package/x/dom/header/style.css.js

@@ -0,0 +1,39 @@
+import { css } from "lit";
+export default css `@layer benev.view {
+
+:host {
+	width: 100%;
+	pointer-events: none;
+}
+
+nav > *, ::slotted(*) {
+	pointer-events: all;
+}
+
+nav {
+	width: 100%;
+	display: flex;
+	flex-wrap: wrap;
+	justify-content: end;
+	align-items: center;
+	gap: var(--benev-space);
+	padding: var(--benev-pad);
+}
+
+button {
+	display: block;
+	margin-right: auto;
+
+	img {
+		display: block;
+		width: var(--benev-b-size);
+		height: var(--benev-b-size);
+	}
+}
+
+slot {
+	display: contents;
+}
+
+}`;
+//# sourceMappingURL=style.css.js.map

package/x/dom/header/style.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"style.css.js","sourceRoot":"","sources":["../../../s/dom/header/style.css.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAA;AACvB,eAAe,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAoChB,CAAA"}

package/x/dom/header/view.d.ts

@@ -0,0 +1,3 @@
+import { Shell } from "../../vitals/shell.js";
+export declare const HeaderView: import("@e280/sly").ShadowView<[shell: Shell]>;
+export declare const headerElement: (shell: Shell) => new () => HTMLElement;

package/x/dom/header/view.js

@@ -0,0 +1,26 @@
+import { html } from "lit";
+import { shadow, shadowElement, useCss, useName } from "@e280/sly";
+import { bDataPng } from "../../assets/b.png.js";
+import { themeCss } from "../../css/theme.css.js";
+import styleCss from "./style.css.js";
+const Header = (shell) => {
+    const click = () => shell.toggle();
+    return html `
+		<nav part=nav ?data-opened=${shell.open} ?data-closed=${!shell.open}>
+			<button benev-button=naked title="b menu" @click=${click}>
+				<img part=img src="${bDataPng}" alt=""/>
+			</button>
+			<slot></slot>
+		</nav>
+	`;
+};
+export const HeaderView = shadow((shell) => {
+    useName("header");
+    useCss(themeCss, styleCss);
+    return Header(shell);
+});
+export const headerElement = (shell) => shadowElement(() => {
+    useCss(themeCss, styleCss);
+    return Header(shell);
+});
+//# sourceMappingURL=view.js.map

package/x/dom/header/view.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"view.js","sourceRoot":"","sources":["../../../s/dom/header/view.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,IAAI,EAAC,MAAM,KAAK,CAAA;AACxB,OAAO,EAAC,MAAM,EAAE,aAAa,EAAE,MAAM,EAAE,OAAO,EAAC,MAAM,WAAW,CAAA;AAEhE,OAAO,EAAC,QAAQ,EAAC,MAAM,uBAAuB,CAAA;AAC9C,OAAO,EAAC,QAAQ,EAAC,MAAM,wBAAwB,CAAA;AAC/C,OAAO,QAAQ,MAAM,gBAAgB,CAAA;AAErC,MAAM,MAAM,GAAG,CAAC,KAAY,EAAE,EAAE;IAC/B,MAAM,KAAK,GAAG,GAAG,EAAE,CAAC,KAAK,CAAC,MAAM,EAAE,CAAA;IAClC,OAAO,IAAI,CAAA;+BACmB,KAAK,CAAC,IAAI,iBAAiB,CAAC,KAAK,CAAC,IAAI;sDACf,KAAK;yBAClC,QAAQ;;;;EAI/B,CAAA;AACF,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,UAAU,GAAG,MAAM,CAAC,CAAC,KAAY,EAAE,EAAE;IACjD,OAAO,CAAC,QAAQ,CAAC,CAAA;IACjB,MAAM,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAA;IAC1B,OAAO,MAAM,CAAC,KAAK,CAAC,CAAA;AACrB,CAAC,CAAC,CAAA;AAEF,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,KAAY,EAAE,EAAE,CAAC,aAAa,CAAC,GAAG,EAAE;IACjE,MAAM,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAA;IAC1B,OAAO,MAAM,CAAC,KAAK,CAAC,CAAA;AACrB,CAAC,CAAC,CAAA"}

package/x/dom/loader/loader.d.ts

@@ -0,0 +1,9 @@
+import { Content } from "@e280/sly";
+export declare class Loader {
+    #private;
+    element: HTMLElement;
+    anim: number;
+    original: HTMLTemplateElement;
+    constructor(element: HTMLElement, anim?: number);
+    load(getLoading: () => Content, getContent: () => Promise<Content>): Promise<void>;
+}

package/x/dom/loader/loader.js

@@ -0,0 +1,53 @@
+import { nap } from "@e280/stz";
+import { dom } from "@e280/sly";
+import { consts } from "../../consts.js";
+export class Loader {
+    element;
+    anim;
+    original;
+    #loading;
+    #content;
+    #operation = 0;
+    constructor(element, anim = consts.anim) {
+        this.element = element;
+        this.anim = anim;
+        this.original = document.createElement("template");
+        this.original.innerHTML = element.innerHTML;
+        this.#loading = document.createElement("div");
+        this.#loading.style.display = "contents";
+        this.#loading.slot = "loading";
+        this.#content = document.createElement("div");
+        this.#content.style.display = "contents";
+        dom.render(this.#content, Array.from(element.childNodes));
+        this.element.replaceChildren();
+        this.element.append(this.#loading, this.#content);
+    }
+    async load(getLoading, getContent) {
+        this.#operation += 1;
+        const operation = this.#operation;
+        const isLatest = () => (this.#operation === operation);
+        this.element.inert = true;
+        this.element.toggleAttribute("loading", true);
+        dom.render(this.#loading, getLoading());
+        try {
+            const [content] = await Promise.all([
+                getContent(),
+                nap(this.anim * 2),
+            ]);
+            if (isLatest()) {
+                this.element.toggleAttribute("loading", false);
+                this.element.inert = false;
+                dom.render(this.#content, content);
+                await nap(this.anim);
+            }
+        }
+        finally {
+            if (isLatest()) {
+                this.element.toggleAttribute("loading", false);
+                this.element.inert = false;
+                dom.render(this.#loading, null);
+            }
+        }
+    }
+}
+//# sourceMappingURL=loader.js.map

package/x/dom/loader/loader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"loader.js","sourceRoot":"","sources":["../../../s/dom/loader/loader.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,GAAG,EAAC,MAAM,WAAW,CAAA;AAC7B,OAAO,EAAU,GAAG,EAAC,MAAM,WAAW,CAAA;AACtC,OAAO,EAAC,MAAM,EAAC,MAAM,iBAAiB,CAAA;AAEtC,MAAM,OAAO,MAAM;IAQT,OAAO;IACP,IAAI;IARb,QAAQ,CAAA;IAER,QAAQ,CAAA;IACR,QAAQ,CAAA;IACR,UAAU,GAAG,CAAC,CAAA;IAEd,YACS,OAAoB,EACpB,IAAI,GAAG,MAAM,CAAC,IAAI;uBADlB,OAAO;oBACP,IAAI;QAGZ,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC,aAAa,CAAC,UAAU,CAAC,CAAA;QAClD,IAAI,CAAC,QAAQ,CAAC,SAAS,GAAG,OAAO,CAAC,SAAS,CAAA;QAE3C,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAA;QAC7C,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,OAAO,GAAG,UAAU,CAAA;QACxC,IAAI,CAAC,QAAQ,CAAC,IAAI,GAAG,SAAS,CAAA;QAE9B,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAA;QAC7C,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,OAAO,GAAG,UAAU,CAAA;QACxC,GAAG,CAAC,MAAM,CAAC,IAAI,CAAC,QAAQ,EAAE,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,CAAC,CAAA;QAEzD,IAAI,CAAC,OAAO,CAAC,eAAe,EAAE,CAAA;QAC9B,IAAI,CAAC,OAAO,CAAC,MAAM,CAClB,IAAI,CAAC,QAAQ,EACb,IAAI,CAAC,QAAQ,CACb,CAAA;IACF,CAAC;IAED,KAAK,CAAC,IAAI,CACR,UAAyB,EACzB,UAAkC;QAGnC,IAAI,CAAC,UAAU,IAAI,CAAC,CAAA;QACpB,MAAM,SAAS,GAAG,IAAI,CAAC,UAAU,CAAA;QACjC,MAAM,QAAQ,GAAG,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,UAAU,KAAK,SAAS,CAAC,CAAA;QACtD,IAAI,CAAC,OAAO,CAAC,KAAK,GAAG,IAAI,CAAA;QACzB,IAAI,CAAC,OAAO,CAAC,eAAe,CAAC,SAAS,EAAE,IAAI,CAAC,CAAA;QAC7C,GAAG,CAAC,MAAM,CAAC,IAAI,CAAC,QAAQ,EAAE,UAAU,EAAE,CAAC,CAAA;QAEvC,IAAI,CAAC;YACJ,MAAM,CAAC,OAAO,CAAC,GAAG,MAAM,OAAO,CAAC,GAAG,CAAC;gBACnC,UAAU,EAAE;gBACZ,GAAG,CAAC,IAAI,CAAC,IAAI,GAAG,CAAC,CAAC;aAClB,CAAC,CAAA;YAEF,IAAI,QAAQ,EAAE,EAAE,CAAC;gBAChB,IAAI,CAAC,OAAO,CAAC,eAAe,CAAC,SAAS,EAAE,KAAK,CAAC,CAAA;gBAC9C,IAAI,CAAC,OAAO,CAAC,KAAK,GAAG,KAAK,CAAA;gBAC1B,GAAG,CAAC,MAAM,CAAC,IAAI,CAAC,QAAQ,EAAE,OAAO,CAAC,CAAA;gBAClC,MAAM,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;YACrB,CAAC;QACF,CAAC;gBACO,CAAC;YACR,IAAI,QAAQ,EAAE,EAAE,CAAC;gBAChB,IAAI,CAAC,OAAO,CAAC,eAAe,CAAC,SAAS,EAAE,KAAK,CAAC,CAAA;gBAC9C,IAAI,CAAC,OAAO,CAAC,KAAK,GAAG,KAAK,CAAA;gBAC1B,GAAG,CAAC,MAAM,CAAC,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC,CAAA;YAChC,CAAC;QACF,CAAC;IACF,CAAC;CACD"}

package/x/dom/loader/style.css.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("lit").CSSResult;
+export default _default;

package/x/dom/loader/style.css.js

@@ -0,0 +1,43 @@
+import { css } from "lit";
+export default css `@layer benev.view {
+
+:host {
+	display: block;
+	position: relative;
+}
+
+.veil {
+	position: absolute;
+	inset: 0;
+	background: var(--benev-bg);
+	pointer-events: none;
+
+	opacity: 1;
+	visibility: visible;
+
+	transition:
+		opacity var(--benev-anim) linear,
+		visiblity 0ms linear allow-discrete;
+}
+
+:host(:not([loading])) .veil {
+	opacity: 0;
+	visiblity: hidden;
+}
+
+.veil {
+	display: flex;
+	flex-direction: column;
+	justify-content: center;
+	align-items: center;
+	gap: var(--benev-space);
+
+	> img {
+		width: 100%;
+		max-width: 10em;
+		aspect-ratio: 1 / 1;
+	}
+}
+
+}`;
+//# sourceMappingURL=style.css.js.map

package/x/dom/loader/style.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"style.css.js","sourceRoot":"","sources":["../../../s/dom/loader/style.css.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAA;AACvB,eAAe,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAwChB,CAAA"}

package/x/dom/loader/view.d.ts

@@ -0,0 +1 @@
+export declare const BenevLoader: new () => HTMLElement;

package/x/dom/loader/view.js

@@ -0,0 +1,17 @@
+import { html } from "lit";
+import { shadowElement, useCss } from "@e280/sly";
+import { themeCss } from "../../css/theme.css.js";
+import { bDataPng } from "../../assets/b.png.js";
+import styleCss from "./style.css.js";
+export const BenevLoader = shadowElement(() => {
+    useCss(themeCss, styleCss);
+    return html `
+		<slot></slot>
+
+		<div class=veil>
+			<img src="${bDataPng}" alt="" draggable="false"/>
+			<slot name=loading></slot>
+		</div>
+	`;
+});
+//# sourceMappingURL=view.js.map

package/x/dom/loader/view.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"view.js","sourceRoot":"","sources":["../../../s/dom/loader/view.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,IAAI,EAAC,MAAM,KAAK,CAAA;AACxB,OAAO,EAAC,aAAa,EAAE,MAAM,EAAC,MAAM,WAAW,CAAA;AAC/C,OAAO,EAAC,QAAQ,EAAC,MAAM,wBAAwB,CAAA;AAC/C,OAAO,EAAC,QAAQ,EAAC,MAAM,uBAAuB,CAAA;AAC9C,OAAO,QAAQ,MAAM,gBAAgB,CAAA;AAErC,MAAM,CAAC,MAAM,WAAW,GAAG,aAAa,CAAC,GAAG,EAAE;IAC7C,MAAM,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAA;IAE1B,OAAO,IAAI,CAAA;;;;eAIG,QAAQ;;;EAGrB,CAAA;AACF,CAAC,CAAC,CAAA"}

package/x/dom/menu/style.css.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("lit").CSSResult;
+export default _default;

package/x/dom/menu/style.css.js

@@ -0,0 +1,89 @@
+import { css } from "lit";
+export default css `@layer benev.view {
+
+dialog {
+	border: 0;
+	padding: 0;
+	background: transparent;
+	overflow: visible;
+	max-height: unset;
+	font: inherit;
+	color: inherit;
+
+	position: fixed;
+	inset: 0 0 auto 0;
+	width: 100%;
+	max-width: var(--benev-site-width);
+	margin: auto;
+
+	transition: all var(--benev-anim) ease allow-discrete;
+	opacity: 0;
+	transform: translateY(-100%);
+}
+
+dialog > section:focus {
+	outline: none;
+}
+
+dialog > section {
+	--theight: min(20em, calc(100dvh - var(--benev-headroom)));
+	width: 100%;
+	height: var(--theight);
+
+	display: flex;
+	flex-direction: column;
+	justify-content: center;
+	align-items: center;
+
+	background: linear-gradient(
+		to bottom right,
+		var(--benev-tray),
+		oklch(from var(--benev-tray) calc(l * 0.6) calc(c * 1.2) h / alpha)
+	);
+	box-shadow: var(--benev-box-shadow);
+	box-shadow: 0 0 4em oklch(from var(--benev-tray) l c h / 60%);
+	border-radius: 0 0 var(--benev-round) var(--benev-round);
+	border: var(--benev-thick) solid oklch(from var(--benev-tray) calc(l * 1.2) calc(c * 1.2) h / alpha);
+	border-top: 0;
+}
+
+dialog[open] {
+	opacity: 1;
+	transform: translateY(0);
+}
+
+dialog[open][data-closing] {
+	opacity: 0;
+	transform: translateY(-100%);
+}
+
+dialog::backdrop {
+	background: rgb(0 0 0 / 0%);
+	backdrop-filter: blur(0);
+	transition: all var(--benev-anim) ease allow-discrete;
+}
+
+dialog[open]::backdrop {
+	background: var(--benev-backdrop);
+	backdrop-filter: var(--benev-blur);
+}
+
+dialog[open][data-closing]::backdrop {
+	background: rgb(0 0 0 / 0%);
+	backdrop-filter: blur(0);
+}
+
+@starting-style {
+	dialog[open] {
+		opacity: 0;
+		transform: translateY(-100%);
+	}
+
+	dialog[open]::backdrop {
+		background: rgb(0 0 0 / 0%);
+		backdrop-filter: blur(0);
+	}
+}
+
+}`;
+//# sourceMappingURL=style.css.js.map

package/x/dom/menu/style.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"style.css.js","sourceRoot":"","sources":["../../../s/dom/menu/style.css.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAA;AACvB,eAAe,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAsFhB,CAAA"}

package/x/dom/menu/utils/click-backdrop.d.ts

@@ -0,0 +1 @@
+export declare function clickBackdrop(fn: (event: Event) => void): (event: Event) => void;

package/x/dom/menu/utils/click-backdrop.js

@@ -0,0 +1,7 @@
+export function clickBackdrop(fn) {
+    return (event) => {
+        if (event.target === event.currentTarget)
+            fn(event);
+    };
+}
+//# sourceMappingURL=click-backdrop.js.map

package/x/dom/menu/utils/click-backdrop.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"click-backdrop.js","sourceRoot":"","sources":["../../../../s/dom/menu/utils/click-backdrop.ts"],"names":[],"mappings":"AACA,MAAM,UAAU,aAAa,CAAC,EAA0B;IACvD,OAAO,CAAC,KAAY,EAAE,EAAE;QACvB,IAAI,KAAK,CAAC,MAAM,KAAK,KAAK,CAAC,aAAa;YACvC,EAAE,CAAC,KAAK,CAAC,CAAA;IACX,CAAC,CAAA;AACF,CAAC"}