@e280/shiny 0.1.0-12 → 0.1.0-14

package/x/shiny.d.ts

@@ -19,7 +19,7 @@ export declare function shiny(context: ShinyContext): {
         } & typeof import("./index.js").ShinyDrawer;
         ShinyExample: {
             new (): import("./index.js").ShinyExample;
-            view: import("@e280/sly").View<[start: number]>;
+            view: import("@e280/sly").View<[start?: any]>;
         } & typeof import("./index.js").ShinyExample;
         ShinyTabs: {
             new (): import("./index.js").ShinyTabs;
@@ -38,7 +38,7 @@ export declare function shiny(context: ShinyContext): {
             side?: "left" | "right";
             control?: import("./index.js").DrawerControl;
         }]>;
-        ShinyExample: import("@e280/sly").View<[start: number]> & import("@e280/sly").View<[context: ShinyContext, start: number]>;
+        ShinyExample: import("@e280/sly").View<[start?: any]> & import("@e280/sly").View<[context: ShinyContext, start?: any]>;
         ShinyTabs: import("@e280/sly").View<[controlOption?: import("./index.js").TabControl | undefined]> & import("@e280/sly").View<[context: ShinyContext, controlOption?: import("./index.js").TabControl | undefined]>;
     };
 };

package/x/themes/aura.css.js

@@ -58,14 +58,14 @@ export const aura = css `@layer overlay {
 
 :host([view="shiny-drawer"]:not([plain])) {
 	display: block;
+	--slate-bg: linear-gradient(
+		to top right,
+		color-mix(in oklab, var(--calm), #222 50%),
+		color-mix(in oklab, var(--calm), #888 50%)
+	);
 
 	&::part(slate) {
 		padding: 1em;
-		background: linear-gradient(
-			to top right,
-			#00a9dd69,
-			#70ffd77a
-		);
 	}
 }
 

package/s/demo/views/demonstration/style.css.ts

@@ -1,124 +0,0 @@
-
-import {css} from "lit"
-export default css`@layer view {
-
-:host {
-	position: relative;
-
-	display: flex;
-	flex-wrap: wrap;
-
-	padding: 1em;
-	border-radius: 0.5em;
-	gap: 1em;
-
-	background: linear-gradient(to right top, #252dd985, #aa6affbd);
-	backdrop-filter: blur(0.5em);
-
-	box-shadow: 0 0 5em #5d1fadaa;
-	border-top: 2px solid #fff4;
-
-	&::before {
-		content: "";
-		display: block;
-		position: absolute;
-		inset: 0;
-		border-radius: 0.5em;
-		background: #0007;
-		width: calc(100% - 0.3em);
-		height: calc(100% - 0.3em);
-		margin: auto;
-		z-index: 0;
-	}
-
-	> * {
-		position: relative;
-		z-index: 1;
-	}
-}
-
-p.lipsum {
-	opacity: 0.7;
-	font-family: serif;
-	font-style: italic;
-}
-
-.meta {
-	flex: 1 1 10em;
-	display: flex;
-	flex-direction: column;
-	gap: 0.5em;
-
-	h2 {
-		color: var(--prime);
-	}
-
-	[view="shiny-tabs"] {
-		gap: 0.5em;
-		&::part(tabs) {
-			font-size: 0.8em;
-			opacity: 0.8;
-		}
-	}
-
-	.codes {
-		display: flex;
-		flex-direction: column;
-		gap: 0.2em;
-	}
-
-	.codeblock {
-		display: flex;
-		background: #0002;
-		border-radius: 0.3em;
-		border-bottom: 1px solid #fff2;
-		box-shadow: inset 0.2em 0.3em 2em #0004;
-
-		.zone {
-			flex: 1 1 auto;
-			display: flex;
-			flex-direction: column;
-			padding: 0.5em;
-
-			h3 {
-				opacity: 0.4;
-				font-size: 0.7em;
-				font-weight: normal;
-				font-style: italic;
-			}
-
-			code {
-				display: block;
-				white-space: pre;
-				text-wrap: wrap;
-				tab-size: 2;
-				word-break: break-word;
-
-				font-size: 0.8em;
-				font-family: monospace;
-				color: #8f8;
-			}
-		}
-
-		[view="shiny-copy"] {
-			flex: 0 0 0;
-			font-size: 1.5em;
-			padding: 0.2em;
-		}
-	}
-}
-
-.content {
-	flex: 1 1 10rem;
-	display: flex;
-	flex-direction: column;
-	justify-content: center;
-	align-items: center;
-
-	padding: 1rem;
-	border-radius: 0.5rem;
-	border: 1px dashed #fff4;
-}
-
-}`
-

package/s/demo/views/demonstration/view.ts

@@ -1,57 +0,0 @@
-
-import {untab} from "@e280/stz"
-import {Content, view} from "@e280/sly"
-import {CSSResultGroup, html} from "lit"
-import styleCss from "./style.css.js"
-import {auraViews} from "../../viewsets.js"
-import {foundationCss} from "../../../components/foundation.css.js"
-
-export const Demonstration = view(use => (options: {
-		name: string
-		explain: Content
-		snippets: [label: {button: string, text: string}, code: string][]
-		content: Content
-		style: CSSResultGroup
-	}) => {
-
-	use.name(`demo-${options.name}`)
-	use.styles(foundationCss, styleCss, options.style)
-
-	function codeblock(heading: string, code: string) {
-		const cleanCode = untab(code).trim()
-		return html`
-			<div class=codeblock slot=panel>
-				<div class=zone>
-					<h3>${heading}</h3>
-					<code>${cleanCode}</code>
-				</div>
-				${auraViews.ShinyCopy(cleanCode)}
-			</div>
-		`
-	}
-
-	return html`
-		<div class=meta>
-			<h2>✨ shiny-${options.name}</h2>
-			<div class=explain>${options.explain}</div>
-			${auraViews.ShinyTabs
-				.props()
-				.children(html`
-					${options.snippets.map(([label]) => (
-						auraViews.ShinyButton
-							.props()
-							.attr("plain")
-							.children(label.button)
-							.render()
-					))}
-					${options.snippets.map(([label, code]) => codeblock(label.text, code))}
-				`)
-				.render()}
-		</div>
-
-		<div class=content part=content>
-			${options.content}
-		</div>
-	`
-})
-

package/x/demo/views/demonstration/style.css.d.ts

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

package/x/demo/views/demonstration/style.css.js

@@ -1,123 +0,0 @@
-import { css } from "lit";
-export default css `@layer view {
-
-:host {
-	position: relative;
-
-	display: flex;
-	flex-wrap: wrap;
-
-	padding: 1em;
-	border-radius: 0.5em;
-	gap: 1em;
-
-	background: linear-gradient(to right top, #252dd985, #aa6affbd);
-	backdrop-filter: blur(0.5em);
-
-	box-shadow: 0 0 5em #5d1fadaa;
-	border-top: 2px solid #fff4;
-
-	&::before {
-		content: "";
-		display: block;
-		position: absolute;
-		inset: 0;
-		border-radius: 0.5em;
-		background: #0007;
-		width: calc(100% - 0.3em);
-		height: calc(100% - 0.3em);
-		margin: auto;
-		z-index: 0;
-	}
-
-	> * {
-		position: relative;
-		z-index: 1;
-	}
-}
-
-p.lipsum {
-	opacity: 0.7;
-	font-family: serif;
-	font-style: italic;
-}
-
-.meta {
-	flex: 1 1 10em;
-	display: flex;
-	flex-direction: column;
-	gap: 0.5em;
-
-	h2 {
-		color: var(--prime);
-	}
-
-	[view="shiny-tabs"] {
-		gap: 0.5em;
-		&::part(tabs) {
-			font-size: 0.8em;
-			opacity: 0.8;
-		}
-	}
-
-	.codes {
-		display: flex;
-		flex-direction: column;
-		gap: 0.2em;
-	}
-
-	.codeblock {
-		display: flex;
-		background: #0002;
-		border-radius: 0.3em;
-		border-bottom: 1px solid #fff2;
-		box-shadow: inset 0.2em 0.3em 2em #0004;
-
-		.zone {
-			flex: 1 1 auto;
-			display: flex;
-			flex-direction: column;
-			padding: 0.5em;
-
-			h3 {
-				opacity: 0.4;
-				font-size: 0.7em;
-				font-weight: normal;
-				font-style: italic;
-			}
-
-			code {
-				display: block;
-				white-space: pre;
-				text-wrap: wrap;
-				tab-size: 2;
-				word-break: break-word;
-
-				font-size: 0.8em;
-				font-family: monospace;
-				color: #8f8;
-			}
-		}
-
-		[view="shiny-copy"] {
-			flex: 0 0 0;
-			font-size: 1.5em;
-			padding: 0.2em;
-		}
-	}
-}
-
-.content {
-	flex: 1 1 10rem;
-	display: flex;
-	flex-direction: column;
-	justify-content: center;
-	align-items: center;
-
-	padding: 1rem;
-	border-radius: 0.5rem;
-	border: 1px dashed #fff4;
-}
-
-}`;
-//# sourceMappingURL=style.css.js.map

package/x/demo/views/demonstration/style.css.js.map

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

package/x/demo/views/demonstration/view.d.ts

@@ -1,12 +0,0 @@
-import { Content } from "@e280/sly";
-import { CSSResultGroup } from "lit";
-export declare const Demonstration: import("@e280/sly").View<[options: {
-    name: string;
-    explain: Content;
-    snippets: [label: {
-        button: string;
-        text: string;
-    }, code: string][];
-    content: Content;
-    style: CSSResultGroup;
-}]>;

package/x/demo/views/demonstration/view.js

@@ -1,44 +0,0 @@
-import { untab } from "@e280/stz";
-import { view } from "@e280/sly";
-import { html } from "lit";
-import styleCss from "./style.css.js";
-import { auraViews } from "../../viewsets.js";
-import { foundationCss } from "../../../components/foundation.css.js";
-export const Demonstration = view(use => (options) => {
-    use.name(`demo-${options.name}`);
-    use.styles(foundationCss, styleCss, options.style);
-    function codeblock(heading, code) {
-        const cleanCode = untab(code).trim();
-        return html `
-			<div class=codeblock slot=panel>
-				<div class=zone>
-					<h3>${heading}</h3>
-					<code>${cleanCode}</code>
-				</div>
-				${auraViews.ShinyCopy(cleanCode)}
-			</div>
-		`;
-    }
-    return html `
-		<div class=meta>
-			<h2>✨ shiny-${options.name}</h2>
-			<div class=explain>${options.explain}</div>
-			${auraViews.ShinyTabs
-        .props()
-        .children(html `
-					${options.snippets.map(([label]) => (auraViews.ShinyButton
-        .props()
-        .attr("plain")
-        .children(label.button)
-        .render()))}
-					${options.snippets.map(([label, code]) => codeblock(label.text, code))}
-				`)
-        .render()}
-		</div>
-
-		<div class=content part=content>
-			${options.content}
-		</div>
-	`;
-});
-//# sourceMappingURL=view.js.map

package/x/demo/views/demonstration/view.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"view.js","sourceRoot":"","sources":["../../../../s/demo/views/demonstration/view.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,KAAK,EAAC,MAAM,WAAW,CAAA;AAC/B,OAAO,EAAU,IAAI,EAAC,MAAM,WAAW,CAAA;AACvC,OAAO,EAAiB,IAAI,EAAC,MAAM,KAAK,CAAA;AACxC,OAAO,QAAQ,MAAM,gBAAgB,CAAA;AACrC,OAAO,EAAC,SAAS,EAAC,MAAM,mBAAmB,CAAA;AAC3C,OAAO,EAAC,aAAa,EAAC,MAAM,uCAAuC,CAAA;AAEnE,MAAM,CAAC,MAAM,aAAa,GAAG,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,OAMxC,EAAE,EAAE;IAEL,GAAG,CAAC,IAAI,CAAC,QAAQ,OAAO,CAAC,IAAI,EAAE,CAAC,CAAA;IAChC,GAAG,CAAC,MAAM,CAAC,aAAa,EAAE,QAAQ,EAAE,OAAO,CAAC,KAAK,CAAC,CAAA;IAElD,SAAS,SAAS,CAAC,OAAe,EAAE,IAAY;QAC/C,MAAM,SAAS,GAAG,KAAK,CAAC,IAAI,CAAC,CAAC,IAAI,EAAE,CAAA;QACpC,OAAO,IAAI,CAAA;;;WAGF,OAAO;aACL,SAAS;;MAEhB,SAAS,CAAC,SAAS,CAAC,SAAS,CAAC;;GAEjC,CAAA;IACF,CAAC;IAED,OAAO,IAAI,CAAA;;iBAEK,OAAO,CAAC,IAAI;wBACL,OAAO,CAAC,OAAO;KAClC,SAAS,CAAC,SAAS;SACnB,KAAK,EAAE;SACP,QAAQ,CAAC,IAAI,CAAA;OACX,OAAO,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,CAAC,KAAK,CAAC,EAAE,EAAE,CAAC,CACnC,SAAS,CAAC,WAAW;SACnB,KAAK,EAAE;SACP,IAAI,CAAC,OAAO,CAAC;SACb,QAAQ,CAAC,KAAK,CAAC,MAAM,CAAC;SACtB,MAAM,EAAE,CACV,CAAC;OACA,OAAO,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,CAAC,KAAK,EAAE,IAAI,CAAC,EAAE,EAAE,CAAC,SAAS,CAAC,KAAK,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC;KACtE,CAAC;SACD,MAAM,EAAE;;;;KAIR,OAAO,CAAC,OAAO;;EAElB,CAAA;AACF,CAAC,CAAC,CAAA"}