@e280/sly 0.2.0-16 → 0.2.0-18

package/s/{ops/loaders → loaders}/parts/ascii-anim.ts

@@ -2,9 +2,9 @@
 import {css} from "lit"
 import {nap, repeat} from "@e280/stz"
 
-import {view} from "../../../ui/view.js"
-import {Content} from "../../../ui/types.js"
-import {cssReset} from "../../../ui/base/css-reset.js"
+import {view} from "../../view/view.js"
+import {Content} from "../../view/types.js"
+import {cssReset} from "../../base/css-reset.js"
 
 export function makeAsciiAnim(hz: number, frames: string[]): () => Content {
 	return () => AsciiAnim({hz, frames})
@@ -17,6 +17,7 @@ export const AsciiAnim = view(use => ({hz, frames}: {
 
 	use.name("loading")
 	use.styles(cssReset, style)
+
 	const frame = use.signal(0)
 
 	use.mount(() => repeat(async() => {

package/s/{ops/loaders → loaders}/parts/error-display.ts

@@ -1,7 +1,7 @@
 
 import {css, html} from "lit"
-import {view} from "../../../ui/view.js"
-import {cssReset} from "../../../ui/base/css-reset.js"
+import {view} from "../../view/view.js"
+import {cssReset} from "../../base/css-reset.js"
 
 export const ErrorDisplay = view(use => (error: any) => {
 	use.name("error")

package/s/loaders/types.ts

@@ -0,0 +1,6 @@
+
+import type {Op} from "../ops/op.js"
+import type {Content} from "../view/types.js"
+
+export type Loader = <V>(op: Op<V>, ready: (value: V) => Content) => Content
+

package/s/loot/index.barrel.ts

@@ -0,0 +1,5 @@
+
+export * from "./drag-and-drops.js"
+export * from "./drops.js"
+export * from "./helpers.js"
+

package/s/loot/index.ts

@@ -1,5 +1,3 @@
 
-export * from "./drag-and-drops.js"
-export * from "./drops.js"
-export * from "./helpers.js"
+export * as loot from "./index.barrel.js"
 

package/s/ops/index.ts

@@ -0,0 +1,5 @@
+
+export * from "./op.js"
+export * from "./podium.js"
+export * from "./types.js"
+

package/s/spa/index.barrel.ts

@@ -0,0 +1,6 @@
+
+export {route} from "./plumbing/braces.js"
+export type {Navigable} from "./plumbing/primitives.js"
+export {RouterOptions, Hasher, Route, Routes, Navigables} from "./plumbing/types.js"
+export {Router} from "./router.js"
+

package/s/spa/index.ts

@@ -0,0 +1,3 @@
+
+export * as spa from "./index.barrel.js"
+

package/s/spa/plumbing/braces.ts

@@ -0,0 +1,76 @@
+
+import {Hasher, Route} from "./types.js"
+import type {Content} from "../../view/types.js"
+
+type ParamKeys<S extends string> =
+	S extends `${string}{${infer P}}${infer R}` ? (string & P) | ParamKeys<R> : never
+
+type ParamsOf<S extends string> =
+	[ParamKeys<S>] extends [never] ? {} : { [K in ParamKeys<S>]: string }
+
+type ParamsTuple<S extends string> =
+	keyof ParamsOf<S> extends never ? [] : [ParamsOf<S>]
+
+export function hasher<S extends string>(spec: S): Hasher<ParamsTuple<S>> {
+	if (!spec.startsWith("#/"))
+		throw new Error(`hash route spec must start with "#/"`)
+
+	const specparts = spec.split("/")
+	const braceregex = /\{([^\}\/]+)\}/
+
+	function parse(hash: string): ParamsTuple<S> | null {
+		if (!hash.startsWith("#/"))
+			throw new Error(`hash must start with "#/"`)
+
+		const hashparts = hash.split("/")
+		const params: Record<string, string> = {}
+
+		if (hashparts.length !== specparts.length)
+			return null
+
+		for (const [index, specpart] of specparts.entries()) {
+			const hashpart = hashparts.at(index)
+			if (hashpart === undefined) return null
+			const bracematch = specpart.match(braceregex)
+			try {
+				if (bracematch) params[bracematch[1]] = decodeURIComponent(hashpart)
+				else if (hashpart !== specpart) return null
+			}
+			catch {
+				return null
+			}
+		}
+
+		return (Object.keys(params).length === 0)
+			? ([] as ParamsTuple<S>)
+			: ([params as ParamsOf<S>] as ParamsTuple<S>)
+	}
+
+	function make(...[braces]: any[]): string {
+		const get = (param: string) => {
+			const p = param as any
+			if (p in braces) return braces[p]
+			else throw new Error(`missing param "${p}"`)
+		}
+		return specparts.map(specpart => {
+			const bracematch = specpart.match(braceregex)
+			return bracematch
+				? encodeURIComponent(get(bracematch[1]))
+				: specpart
+		}).join("/")
+	}
+
+	return {parse, make}
+}
+
+export function route<S extends string>(
+		spec: S,
+		fn: (...params: ParamsTuple<S>) => Promise<Content>,
+	): Route<ParamsTuple<S>> {
+
+	return {
+		hasher: hasher(spec),
+		fn,
+	}
+}
+

package/s/spa/plumbing/primitives.ts

@@ -0,0 +1,85 @@
+
+import {ev, ob} from "@e280/stz"
+import {Op} from "../../ops/op.js"
+import {ResolvedRoute, Route, Routes} from "./types.js"
+
+export function eraseWindowHash() {
+	const {pathname, search} = window.location
+	history.replaceState(null, "", pathname + search)
+}
+
+export function normalizeHash(hash: string) {
+	const homeEquivalents = [/^$/, /^#$/, /^#\/$/]
+	return (homeEquivalents.some(regex => regex.test(hash)))
+		? "#/"
+		: hash
+}
+
+export class HashNormalizer {
+	constructor(public location: Location) {}
+
+	get hash() {
+		const hash = normalizeHash(this.location.hash)
+		if (hash === "#/") eraseWindowHash()
+		return hash
+	}
+
+	set hash(hash: string) {
+		this.location.hash = hash
+	}
+}
+
+export class Navigable<R extends Routes = any, K extends keyof R = any> {
+	static all<R extends Routes>(
+			routes: R,
+			getRoute: () => Route<any> | null,
+			navigate: (hash: string) => Promise<ResolvedRoute<R>>,
+		): {[K in keyof R]: Navigable<R, K>} {
+
+		return ob(routes).map(route => new this(
+			route,
+			() => (getRoute() === route),
+			async(...params: any[]) => navigate(route.hasher.make(...params)),
+		))
+	}
+
+	constructor(
+		public route: Route<Parameters<R[K]["hasher"]["make"]>>,
+		private isActive: () => boolean,
+		public go: (...params: Parameters<R[K]["hasher"]["make"]>) => Promise<ResolvedRoute<R>>,
+	) {}
+
+	get active() {
+		return this.isActive()
+	}
+
+	hash(...params: Parameters<R[K]["hasher"]["make"]>) {
+		return this.route.hasher.make(...params)
+	}
+}
+
+export function resolveRoute<R extends Routes>(
+		hash: string,
+		routes: R,
+	): ResolvedRoute<R> | null {
+
+	for (const key in routes) {
+		const route = routes[key]
+		const params = route.hasher.parse(hash)
+		if (params) {
+			return {
+				key,
+				route,
+				params,
+				op: Op.promise(route.fn(...params))
+			}
+		}
+	}
+
+	return null
+}
+
+export function onHashChange(fn: (event: HashChangeEvent) => void) {
+	return ev(window, {hashchange: fn})
+}
+

package/s/spa/plumbing/router-core.ts

@@ -0,0 +1,49 @@
+
+import {signal} from "@e280/strata"
+import type {Content} from "../../view/types.js"
+import {Navigable, normalizeHash, resolveRoute} from "./primitives.js"
+import {Hashbearer, Navigables, ResolvedRoute, Routes} from "./types.js"
+
+export class RouterCore<R extends Routes> {
+	readonly nav: Navigables<R>
+	readonly $resolved = signal<ResolvedRoute<R> | null>(null)
+
+	constructor(
+			public readonly routes: R,
+			public readonly location: Hashbearer,
+		) {
+
+		this.nav = Navigable.all(
+			routes,
+			() => this.route,
+			async hash => {
+				this.location.hash = hash
+				const resolved = await this.refresh()
+				if (!resolved) throw new Error(`route failed "${hash}"`)
+				return resolved
+			},
+		)
+	}
+
+	get hash() {
+		return normalizeHash(this.location.hash)
+	}
+
+	get content(): Content | null {
+		return this.$resolved.get()?.op.value ?? null
+	}
+
+	get route() {
+		return this.$resolved.get()?.route ?? null
+	}
+
+	async refresh(hash?: string) {
+		if (hash !== undefined) this.location.hash = hash
+		hash = this.hash
+		const resolved = resolveRoute(hash, this.routes)
+		await this.$resolved.set(resolved)
+		await resolved?.op
+		return resolved
+	}
+}
+

package/s/spa/plumbing/types.ts

@@ -0,0 +1,39 @@
+
+import type {Op} from "../../ops/op.js"
+import type {Navigable} from "./primitives.js"
+import type {Content} from "../../view/types.js"
+import type {Loader} from "../../loaders/types.js"
+
+export type RouterOptions<R extends Routes> = {
+	routes: R
+	auto?: boolean
+	location?: Hashbearer
+	loader?: Loader
+	notFound?: () => Content
+}
+
+export type Hashbearer = {hash: string}
+
+export type Hasher<Params extends any[]> = {
+	parse: (hash: string) => (Params | null)
+	make: (...params: Params) => string
+}
+
+export type Route<Params extends any[]> = {
+	hasher: Hasher<Params>
+	fn: (...params: Params) => Promise<Content>
+}
+
+export type Routes = {[key: string]: Route<any>}
+
+export type ResolvedRoute<R extends Routes, K extends keyof R = keyof R> = {
+	key: K
+	route: R[K]
+	params: Parameters<R[K]["hasher"]["make"]>
+	op: Op<Content>
+}
+
+export type Navigables<R extends Routes> = {
+	[K in keyof R]: Navigable<R, K>
+}
+

package/s/spa/router.ts

@@ -0,0 +1,49 @@
+
+import {disposer} from "@e280/stz"
+import {Content} from "../view/types.js"
+import {Loader} from "../loaders/types.js"
+import {loaders} from "../loaders/index.js"
+import {RouterCore} from "./plumbing/router-core.js"
+import {RouterOptions, Routes} from "./plumbing/types.js"
+import {HashNormalizer, onHashChange} from "./plumbing/primitives.js"
+
+export class Router<R extends Routes> extends RouterCore<R> {
+	loader: Loader
+	notFound: () => Content
+	readonly dispose = disposer()
+	#lastHash: string
+
+	constructor(options: RouterOptions<R>) {
+		super(
+			options.routes,
+			options.location ?? new HashNormalizer(window.location),
+		)
+		const {auto = true} = options
+		this.loader = options.loader ?? loaders.make()
+		this.notFound = options.notFound ?? (() => null)
+		this.#lastHash = this.hash
+		if (auto) {
+			this.listen()
+			this.refresh()
+		}
+	}
+
+	render() {
+		const resolved = this.$resolved.get()
+		return resolved === null
+			? this.notFound()
+			: this.loader(resolved.op, content => content)
+	}
+
+	listen() {
+		const dispose = onHashChange(() => {
+			const hash = this.hash
+			const isChanged = hash !== this.#lastHash
+			this.#lastHash = hash
+			if (isChanged) this.refresh()
+		})
+		this.dispose.schedule(dispose)
+		return dispose
+	}
+}
+

package/s/spa/spa.test.ts

@@ -0,0 +1,91 @@
+
+import {Science, test, expect} from "@e280/science"
+import {route} from "./plumbing/braces.js"
+import {Routes} from "./plumbing/types.js"
+import {RouterCore} from "./plumbing/router-core.js"
+
+async function setup<R extends Routes>(routes: R) {
+	const location = {hash: ""}
+	const router = new RouterCore(routes, location)
+	return {location, router}
+}
+
+export default Science.suite({
+	inits: Science.suite({
+		"#/": test(async() => {
+			const {location, router} = await setup({
+				home: route("#/", async() => "123"),
+			})
+			expect(router.content).is(null)
+			location.hash = "#/"
+			await router.refresh()
+			expect(router.content).is("123")
+		}),
+
+		"#/hello/world": test(async() => {
+			const {location, router} = await setup({
+				helloWorld: route("#/hello/world", async() => "123"),
+			})
+			expect(router.content).is(null)
+			location.hash = "#/hello/world"
+			await router.refresh()
+			expect(router.content).is("123")
+		}),
+
+		"#/item/a123": test(async() => {
+			const {location, router} = await setup({
+				item: route("#/item/{id}", async({id}) => `content ${id}`),
+			})
+			location.hash = "#/item/a123"
+			await router.refresh()
+			expect(router.content).is("content a123")
+		}),
+
+		"#/item/a123/lol should miss": test(async() => {
+			const {location, router} = await setup({
+				item: route("#/item/{id}", async({id}) => `content ${id}`),
+			})
+			location.hash = "#/item/a123/lol"
+			await router.refresh()
+			expect(router.content).is(null)
+		}),
+
+		"#/left/{mid}/right extraction": test(async() => {
+			const {location, router} = await setup({
+				item: route("#/left/{mid}/right", async({mid}) => `content ${mid}`),
+			})
+			location.hash = "#/left/middle/right"
+			await router.refresh()
+			expect(router.content).is("content middle")
+		}),
+
+		"#/not-found-lol": test(async() => {
+			const {location, router} = await setup({
+				helloWorld: route("#/hello/world", async() => "123"),
+			})
+			location.hash = "#/not-found-lol"
+			await router.refresh()
+			expect(router.content).is(null)
+		}),
+	}),
+
+	nav: Science.suite({
+		"home to item and back": test(async() => {
+			const {location, router} = await setup({
+				home: route("#/", async() => `home`),
+				item: route("#/item/{id}", async({id}) => `item ${id}`),
+			})
+			location.hash = "#/"
+
+			await router.refresh()
+			expect(router.content).is("home")
+
+			await router.nav.item.go({id: "x234"})
+			expect(router.content).is("item x234")
+
+			await router.nav.home.go()
+			expect(router.content).is("home")
+		}),
+	}),
+})
+

package/s/tests.test.ts

@@ -1,5 +1,8 @@
 
 import {Science} from "@e280/science"
+import spa from "./spa/spa.test.js"
 
-await Science.run({})
+await Science.run({
+	spa,
+})
 

package/s/view/index.ts

@@ -0,0 +1,6 @@
+
+export * from "./utils/parts/chain.js"
+export * from "./utils/parts/sly-view.js"
+export * from "./types.js"
+export * from "./view.js"
+

package/s/{ui → view}/types.ts

@@ -3,9 +3,9 @@ import {TemplateResult} from "lit"
 import {Constructor} from "@e280/stz"
 import {DirectiveResult} from "lit/directive.js"
 
-import {Use} from "./base/use.js"
-import {ViewChain} from "./view/parts/chain.js"
-import {BaseElement} from "./base-element.js"
+import {Use} from "../base/use.js"
+import {ViewChain} from "./utils/parts/chain.js"
+import {BaseElement} from "../base/element.js"
 
 export type Content = TemplateResult | DirectiveResult | HTMLElement | string | null | undefined | void | Content[]
 export type AttrValue = string | boolean | number | undefined | null | void

package/s/{ui/view → view/utils}/make-component.ts

@@ -1,9 +1,9 @@
 
 import {Constructor} from "@e280/stz"
-import {Use} from "../base/use.js"
+import {Use} from "../../base/use.js"
 import {makeView} from "./make-view.js"
-import {BaseElement} from "../base-element.js"
-import {Reactor} from "../base/utils/reactor.js"
+import {BaseElement} from "../../base/element.js"
+import {Reactor} from "../../base/utils/reactor.js"
 import {ComponentClass, ViewFn} from "../types.js"
 
 /** make a component from a BaseElement and a view. */

package/s/{ui/view → view/utils}/make-view.ts

@@ -3,7 +3,7 @@ import {Constructor} from "@e280/stz"
 import {DirectiveResult} from "lit/async-directive.js"
 import {View, ViewFn} from "../types.js"
 import {ViewChain} from "./parts/chain.js"
-import {BaseElement} from "../base-element.js"
+import {BaseElement} from "../../base/element.js"
 import {ViewContext} from "./parts/context.js"
 import {makeComponent} from "./make-component.js"
 import {makeViewDirective} from "./parts/directive.js"

package/s/{ui/view → view/utils}/parts/capsule.ts

@@ -5,9 +5,9 @@ import {SlyView} from "./sly-view.js"
 import {dom} from "../../../dom/dom.js"
 import {setAttrs} from "./set-attrs.js"
 import {ViewContext} from "./context.js"
-import {Reactor} from "../../base/utils/reactor.js"
-import {AttrWatcher} from "../../base/utils/attr-watcher.js"
-import {_disconnect, _reconnect, _wrap, Use} from "../../base/use.js"
+import {Reactor} from "../../../base/utils/reactor.js"
+import {AttrWatcher} from "../../../base/utils/attr-watcher.js"
+import {_disconnect, _reconnect, _wrap, Use} from "../../../base/use.js"
 
 /** controls the rendering of view context into an element. */
 export class ViewCapsule<Props extends any[]> {

package/s/{ui → view}/view.ts

@@ -1,8 +1,8 @@
 
 import {Content, ViewFn} from "./types.js"
-import {makeView} from "./view/make-view.js"
-import {BaseElement} from "./base-element.js"
-import {_disconnect, _reconnect, Use} from "./base/use.js"
+import {makeView} from "./utils/make-view.js"
+import {BaseElement} from "../base/element.js"
+import {_disconnect, _reconnect, Use} from "../base/use.js"
 
 export function view<Props extends any[]>(fn: ViewFn<Props>) {
 	return makeView(fn, {mode: "open"})

package/x/base/css-reset.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"css-reset.js","sourceRoot":"","sources":["../../s/base/css-reset.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,GAAG,EAAiB,MAAM,KAAK,CAAA;AAEvC,MAAM,CAAC,MAAM,QAAQ,GAAmB,GAAG,CAAA;;;;;;;;;;;;;;;;CAgB1C,CAAA"}

package/x/{ui/base-element.d.ts → base/element.d.ts}

@@ -1,6 +1,6 @@
 import { CSSResultGroup } from "lit";
-import { Content } from "./types.js";
-import { Use } from "./base/use.js";
+import { Content } from "../view/types.js";
+import { Use } from "./use.js";
 export declare class BaseElement extends HTMLElement {
     #private;
     static styles: CSSResultGroup | undefined;

package/x/{ui/base-element.js → base/element.js}

@@ -1,9 +1,9 @@
 import { debounce } from "@e280/stz";
 import { dom } from "../dom/dom.js";
-import { Reactor } from "./base/utils/reactor.js";
-import { AttrWatcher } from "./base/utils/attr-watcher.js";
-import { applyStyles } from "./base/utils/apply-styles.js";
-import { Use, _disconnect, _reconnect, _wrap } from "./base/use.js";
+import { Reactor } from "./utils/reactor.js";
+import { AttrWatcher } from "./utils/attr-watcher.js";
+import { applyStyles } from "./utils/apply-styles.js";
+import { Use, _disconnect, _reconnect, _wrap } from "./use.js";
 export class BaseElement extends HTMLElement {
     static styles;
     shadow;
@@ -49,4 +49,4 @@ export class BaseElement extends HTMLElement {
         this.#attrWatcher.stop();
     }
 }
-//# sourceMappingURL=base-element.js.map
+//# sourceMappingURL=element.js.map

package/x/base/element.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"element.js","sourceRoot":"","sources":["../../s/base/element.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,QAAQ,EAAC,MAAM,WAAW,CAAA;AAGlC,OAAO,EAAC,GAAG,EAAC,MAAM,eAAe,CAAA;AAEjC,OAAO,EAAC,OAAO,EAAC,MAAM,oBAAoB,CAAA;AAC1C,OAAO,EAAC,WAAW,EAAC,MAAM,yBAAyB,CAAA;AACnD,OAAO,EAAC,WAAW,EAAC,MAAM,yBAAyB,CAAA;AACnD,OAAO,EAAC,GAAG,EAAE,WAAW,EAAE,UAAU,EAAE,KAAK,EAAC,MAAM,UAAU,CAAA;AAE5D,MAAM,OAAO,WAAY,SAAQ,WAAW;IAC3C,MAAM,CAAC,MAAM,CAA4B;IAEhC,MAAM,CAAY;IAE3B,IAAI,CAAK;IACT,WAAW,GAAG,CAAC,CAAA;IACf,QAAQ,GAAG,IAAI,OAAO,EAAE,CAAA;IACxB,YAAY,GAAG,IAAI,WAAW,CAAC,IAAI,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,MAAM,EAAE,CAAC,CAAA;IAEzD,4FAA4F;IAC5F,YAAY;QACX,OAAO,IAAI,CAAC,YAAY,CAAC,EAAC,IAAI,EAAE,MAAM,EAAC,CAAC,CAAA;IACzC,CAAC;IAED;QACC,KAAK,EAAE,CAAA;QACP,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,YAAY,EAAE,CAAA;QACjC,IAAI,CAAC,IAAI,GAAG,IAAI,GAAG,CAClB,IAAI,EACJ,IAAI,CAAC,MAAM,EACX,IAAI,CAAC,SAAS,EACd,IAAI,CAAC,MAAM,CACX,CAAA;IACF,CAAC;IAED,qCAAqC;IACrC,MAAM,CAAC,IAAS,IAAY,CAAC;IAE7B,+DAA+D;IAC/D,SAAS,GAAG,GAAG,EAAE;QAChB,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,GAAG,EAAE;YACrB,GAAG,CAAC,MAAM,CACT,IAAI,CAAC,MAAM,EACX,IAAI,CAAC,QAAQ,CAAC,MAAM,CACnB,GAAG,EAAE,CAAC,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,EAC5B,IAAI,CAAC,MAAM,CACX,CACD,CAAA;QACF,CAAC,CAAC,CAAA;IACH,CAAC,CAAA;IAED,6DAA6D;IAC7D,MAAM,GAAG,QAAQ,CAAC,CAAC,EAAE,IAAI,CAAC,SAAS,CAAC,CAAA;IAEpC,iBAAiB;QAChB,IAAI,IAAI,CAAC,WAAW,KAAK,CAAC,EAAE,CAAC;YAC5B,MAAM,MAAM,GAAI,IAAI,CAAC,WAAmB,CAAC,MAAM,CAAA;YAC/C,IAAI,MAAM;gBAAE,WAAW,CAAC,IAAI,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;YAC5C,IAAI,CAAC,SAAS,EAAE,CAAA;QACjB,CAAC;aACI,CAAC;YACL,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,EAAE,CAAA;QACxB,CAAC;QACD,IAAI,CAAC,YAAY,CAAC,KAAK,EAAE,CAAA;QACzB,IAAI,CAAC,WAAW,EAAE,CAAA;IACnB,CAAC;IAED,oBAAoB;QACnB,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,EAAE,CAAA;QACxB,IAAI,CAAC,QAAQ,CAAC,KAAK,EAAE,CAAA;QACrB,IAAI,CAAC,YAAY,CAAC,IAAI,EAAE,CAAA;IACzB,CAAC;CACD"}

package/x/base/index.d.ts

@@ -0,0 +1,3 @@
+export * from "../base/css-reset.js";
+export * from "../base/element.js";
+export * from "../base/use.js";

package/x/base/index.js

@@ -0,0 +1,4 @@
+export * from "../base/css-reset.js";
+export * from "../base/element.js";
+export * from "../base/use.js";
+//# sourceMappingURL=index.js.map

package/x/base/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../s/base/index.ts"],"names":[],"mappings":"AACA,cAAc,sBAAsB,CAAA;AACpC,cAAc,oBAAoB,CAAA;AAClC,cAAc,gBAAgB,CAAA"}

package/x/{ui/base → base}/use.d.ts

@@ -1,7 +1,7 @@
 import { CSSResultGroup } from "lit";
 import { SignalOptions } from "@e280/strata/signals";
-import { Op } from "../../ops/op.js";
-import { Attrs } from "../../dom/types.js";
+import { Op } from "../ops/op.js";
+import { UseAttrs } from "./utils/use-attrs.js";
 export declare const _wrap: unique symbol;
 export declare const _disconnect: unique symbol;
 export declare const _reconnect: unique symbol;
@@ -11,7 +11,7 @@ export declare class Use {
     shadow: ShadowRoot;
     renderNow: () => void;
     render: () => Promise<void>;
-    attrs: Attrs;
+    readonly attrs: UseAttrs;
     [_wrap]<R>(fn: () => R): R;
     [_disconnect](): void;
     [_reconnect](): void;

package/x/{ui/base → base}/use.js

@@ -1,8 +1,8 @@
 import { defer, MapG } from "@e280/stz";
 import { signal } from "@e280/strata/signals";
-import { Op } from "../../ops/op.js";
-import { dom } from "../../dom/dom.js";
+import { Op } from "../ops/op.js";
 import { Mounts } from "./utils/mounts.js";
+import { UseAttrs } from "./utils/use-attrs.js";
 import { applyStyles } from "./utils/apply-styles.js";
 export const _wrap = Symbol();
 export const _disconnect = Symbol();
@@ -39,7 +39,7 @@ export class Use {
         this.shadow = shadow;
         this.renderNow = renderNow;
         this.render = render;
-        this.attrs = dom.attrs(this.element);
+        this.attrs = new UseAttrs(this);
     }
     get renderCount() {
         return this.#runs;

package/x/base/use.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use.js","sourceRoot":"","sources":["../../s/base/use.ts"],"names":[],"mappings":"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"}

package/x/base/utils/apply-styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"apply-styles.js","sourceRoot":"","sources":["../../../s/base/utils/apply-styles.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,WAAW,EAAqC,kBAAkB,EAAC,MAAM,KAAK,CAAA;AAEtF,MAAM,UAAU,WAAW,CAAC,MAAkB,EAAE,MAAuB;IACtE,WAAW,CAAC,MAAM,EAAE,aAAa,CAAC,MAAM,CAAC,CAAC,CAAA;AAC3C,CAAC;AAED,SAAS,aAAa,CAAC,MAAuB;IAC7C,MAAM,aAAa,GAAG,EAAE,CAAA;IAExB,IAAI,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE,CAAC;QAC3B,MAAM,GAAG,GAAG,IAAI,GAAG,CAAE,MAAyB,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,OAAO,EAAE,CAAC,CAAA;QACxE,KAAK,MAAM,CAAC,IAAI,GAAG;YAClB,aAAa,CAAC,OAAO,CAAC,kBAAkB,CAAC,CAAsB,CAAC,CAAC,CAAA;IACnE,CAAC;SACI,IAAI,MAAM,KAAK,SAAS;QAC5B,aAAa,CAAC,IAAI,CAAC,kBAAkB,CAAC,MAAM,CAAC,CAAC,CAAA;IAE/C,OAAO,aAAa,CAAA;AACrB,CAAC"}