@mhmo91/schmancy 0.10.42 → 0.10.44

package/dist/tree.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"tree.cjs","names":[],"sources":["../src/tree/tree.ts"],"sourcesContent":["import { SchmancyElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement, property, query } from 'lit/decorators.js'\nimport { fromEvent, merge, switchMap, takeUntil, tap, zip } from 'rxjs'\n\n/**\n * @element schmancy-tree\n * @slot root - The root element of the tree\n * @slot - The children of the tree\n */\n@customElement('schmancy-tree')\nexport class SchmancyTree extends SchmancyElement {\n\tstatic styles = [css`\n\t:host {\n\t\tdisplay: block;\n\t\tposition: relative;\n\t\tbackground-color: initial;\n\t}\n\t::slotted([slot='root']) {\n\t\twidth: 100%;\n\t\ttext-align: left;\n\t}\n\t::slotted([slot='root'] + *) {\n\t\tmargin-top: 0.5rem;\n\t}\n`];\n\t/**\n\t * Whether the tree’s children are visible\n\t */\n\t@property({ type: Boolean }) open = false\n\n\t@query('#toggler') toggler!: HTMLSlotElement\n\t@query('slot:not([name=\"root\"])') defaultSlot!: HTMLSlotElement\n\n\t// Since it's actually a <schmancy-button>, use HTMLElement or a custom type\n\t@query('#chevron') chevron!: HTMLElement\n\n\tprivate readonly a11yId = `schmancy-tree-${Math.random().toString(36).slice(2, 10)}`\n\tprivate get contentId() { return `${this.a11yId}-content` }\n\n\t/** ElementInternals — broadcasts `:state(open)` for consumer CSS. */\n\tprivate readonly internals: ElementInternals | undefined = (() => {\n\t\ttry { return this.attachInternals() } catch { return undefined }\n\t})()\n\n\tupdated(changed: Map<string, unknown>) {\n\t\tsuper.updated?.(changed)\n\t\tif (changed.has('open')) {\n\t\t\tif (this.open) this.internals?.states.add('open')\n\t\t\telse this.internals?.states.delete('open')\n\t\t}\n\t}\n\n\tfirstUpdated() {\n\t\t// Hide or show the slot initially based on `open`\n\t\tif (!this.open) {\n\t\t\tthis.defaultSlot.hidden = true\n\t\t}\n\n\t\t// Root toggler\n\t\tconst toggleClick$ = fromEvent<MouseEvent>(this.toggler, 'click').pipe(\n\t\t\ttakeUntil(this.disconnecting),\n\t\t\ttap(e => {\n\t\t\t\te.preventDefault()\n\t\t\t\te.stopPropagation()\n\t\t\t\tthis.dispatchEvent(new CustomEvent('toggle', { bubbles: false, composed: true }))\n\t\t\t}),\n\t\t)\n\n\t\t// Chevron (the schmancy-button) click\n\t\tconst chevronClick$ = fromEvent<MouseEvent>(this.chevron, 'click')\n\n\t\tmerge(toggleClick$, chevronClick$)\n\t\t\t.pipe(\n\t\t\t\tswitchMap(() => {\n\t\t\t\t\t// 1. Animate the chevron rotation\n\t\t\t\t\t//    If `open` is true, rotate from 180 -> 0; if false, from 0 -> 180\n\t\t\t\t\tconst fromDeg = this.open ? 180 : 0\n\t\t\t\t\tconst toDeg = this.open ? 0 : 180\n\t\t\t\t\tconst chevronAnimation = this.chevron.animate(\n\t\t\t\t\t\t[{ transform: `rotate(${fromDeg}deg)` }, { transform: `rotate(${toDeg}deg)` }],\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\tduration: 150,\n\t\t\t\t\t\t\teasing: 'ease-in',\n\t\t\t\t\t\t\tfill: 'forwards',\n\t\t\t\t\t\t},\n\t\t\t\t\t)\n\n\t\t\t\t\t// 2. Animate the slot’s height + opacity\n\t\t\t\t\tif (!this.open) {\n\t\t\t\t\t\t// We are about to open, so remove `hidden` to measure scrollHeight\n\t\t\t\t\t\tthis.defaultSlot.hidden = false\n\t\t\t\t\t}\n\n\t\t\t\t\tconst fromOpacity = this.open ? 1 : 0\n\t\t\t\t\tconst toOpacity = this.open ? 0 : 1\n\n\t\t\t\t\tconst slotAnimation = this.defaultSlot.animate([{ opacity: fromOpacity }, { opacity: toOpacity }], {\n\t\t\t\t\t\tduration: 150,\n\t\t\t\t\t\teasing: 'ease-out',\n\t\t\t\t\t\tfill: 'forwards',\n\t\t\t\t\t})\n\n\t\t\t\t\t// Hide the slot if we just closed it\n\t\t\t\t\tslotAnimation.onfinish = () => {\n\t\t\t\t\t\tif (this.open) {\n\t\t\t\t\t\t\tthis.defaultSlot.hidden = true\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tthis.defaultSlot.style.height = 'auto'\n\t\t\t\t\t\t\tthis.defaultSlot.style.opacity = '1'\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\t// Return an Observable that completes when both animations finish\n\t\t\t\t\treturn zip(fromEvent(chevronAnimation, 'finish'), fromEvent(slotAnimation, 'finish')).pipe(\n\t\t\t\t\t\ttakeUntil(this.disconnecting),\n\t\t\t\t\t)\n\t\t\t\t}),\n\t\t\t\ttap(() => {\n\t\t\t\t\t// Flip the open state\n\t\t\t\t\tthis.open = !this.open\n\t\t\t\t}),\n\t\t\t\ttakeUntil(this.disconnecting),\n\t\t\t)\n\t\t\t.subscribe()\n\t}\n\n\trender() {\n\t\treturn html`\n\t\t\t<div class=\"flex content-center items-center justify-between\">\n\t\t\t\t<!-- Root toggler content -->\n\t\t\t\t<slot id=\"toggler\" name=\"root\"></slot>\n\n\t\t\t\t<!-- The chevron or arrow symbol -->\n\t\t\t\t<!-- Stop propagation on the schmancy-button itself just to avoid double triggers -->\n\t\t\t\t<schmancy-button\n\t\t\t\t\tslot=\"trailing\"\n\t\t\t\t\tid=\"chevron\"\n\t\t\t\t\taria-expanded=${this.open ? 'true' : 'false'}\n\t\t\t\t\taria-controls=${this.contentId}\n\t\t\t\t\taria-label=${this.open ? 'Collapse' : 'Expand'}\n\t\t\t\t\t@click=${(e: Event) => e.stopPropagation()}\n\t\t\t\t>\n\t\t\t\t\t⌅\n\t\t\t\t</schmancy-button>\n\t\t\t</div>\n\n\t\t\t<!-- The default slot: tree children -->\n\t\t\t<slot id=${this.contentId}></slot>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-tree': SchmancyTree\n\t}\n}\n"],"mappings":"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"}
+{"version":3,"file":"tree.cjs","names":[],"sources":["../src/tree/tree.ts"],"sourcesContent":["import { SchmancyElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement, property, query } from 'lit/decorators.js'\nimport { fromEvent, merge, switchMap, takeUntil, tap, zip } from 'rxjs'\n\n/**\n * @element schmancy-tree\n * @slot root - The root element of the tree\n * @slot - The children of the tree\n */\n@customElement('schmancy-tree')\nexport class SchmancyTree extends SchmancyElement {\n\tstatic styles = [\n\t\tcss`\n\t\t\t:host {\n\t\t\t\tdisplay: block;\n\t\t\t\tposition: relative;\n\t\t\t\tbackground-color: initial;\n\t\t\t}\n\t\t\t::slotted([slot='root']) {\n\t\t\t\twidth: 100%;\n\t\t\t\ttext-align: left;\n\t\t\t}\n\t\t\t::slotted([slot='root'] + *) {\n\t\t\t\tmargin-top: 0.5rem;\n\t\t\t}\n\t\t`,\n\t]\n\t/**\n\t * Whether the tree’s children are visible\n\t */\n\t@property({ type: Boolean }) open = false\n\n\t@query('#toggler') toggler!: HTMLSlotElement\n\t@query('slot:not([name=\"root\"])') defaultSlot!: HTMLSlotElement\n\n\t// Since it's actually a <schmancy-button>, use HTMLElement or a custom type\n\t@query('#chevron') chevron!: HTMLElement\n\n\tprivate readonly a11yId = `schmancy-tree-${Math.random().toString(36).slice(2, 10)}`\n\tprivate get contentId() {\n\t\treturn `${this.a11yId}-content`\n\t}\n\n\t/** ElementInternals — broadcasts `:state(open)` for consumer CSS. */\n\tprivate readonly internals: ElementInternals | undefined = (() => {\n\t\ttry {\n\t\t\treturn this.attachInternals()\n\t\t} catch {\n\t\t\treturn undefined\n\t\t}\n\t})()\n\n\tupdated(changed: Map<string, unknown>) {\n\t\tsuper.updated?.(changed)\n\t\tif (changed.has('open')) {\n\t\t\tif (this.open) this.internals?.states.add('open')\n\t\t\telse this.internals?.states.delete('open')\n\t\t}\n\t}\n\n\tfirstUpdated() {\n\t\t// Hide or show the slot initially based on `open`\n\t\tif (!this.open) {\n\t\t\tthis.defaultSlot.hidden = true\n\t\t}\n\n\t\t// Root toggler\n\t\tconst toggleClick$ = fromEvent<MouseEvent>(this.toggler, 'click').pipe(\n\t\t\ttakeUntil(this.disconnecting),\n\t\t\ttap(e => {\n\t\t\t\te.preventDefault()\n\t\t\t\te.stopPropagation()\n\t\t\t\tthis.dispatchEvent(new CustomEvent('toggle', { bubbles: false, composed: true }))\n\t\t\t}),\n\t\t)\n\n\t\t// Chevron (the schmancy-button) click\n\t\tconst chevronClick$ = fromEvent<MouseEvent>(this.chevron, 'click')\n\n\t\tmerge(toggleClick$, chevronClick$)\n\t\t\t.pipe(\n\t\t\t\tswitchMap(() => {\n\t\t\t\t\t// 1. Animate the chevron rotation\n\t\t\t\t\t//    If `open` is true, rotate from 180 -> 0; if false, from 0 -> 180\n\t\t\t\t\tconst fromDeg = this.open ? 180 : 0\n\t\t\t\t\tconst toDeg = this.open ? 0 : 180\n\t\t\t\t\tconst chevronAnimation = this.chevron.animate(\n\t\t\t\t\t\t[{ transform: `rotate(${fromDeg}deg)` }, { transform: `rotate(${toDeg}deg)` }],\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\tduration: 150,\n\t\t\t\t\t\t\teasing: 'ease-in',\n\t\t\t\t\t\t\tfill: 'forwards',\n\t\t\t\t\t\t},\n\t\t\t\t\t)\n\n\t\t\t\t\t// 2. Animate the slot’s height + opacity\n\t\t\t\t\tif (!this.open) {\n\t\t\t\t\t\t// We are about to open, so remove `hidden` to measure scrollHeight\n\t\t\t\t\t\tthis.defaultSlot.hidden = false\n\t\t\t\t\t}\n\n\t\t\t\t\tconst fromOpacity = this.open ? 1 : 0\n\t\t\t\t\tconst toOpacity = this.open ? 0 : 1\n\n\t\t\t\t\tconst slotAnimation = this.defaultSlot.animate([{ opacity: fromOpacity }, { opacity: toOpacity }], {\n\t\t\t\t\t\tduration: 150,\n\t\t\t\t\t\teasing: 'ease-out',\n\t\t\t\t\t\tfill: 'forwards',\n\t\t\t\t\t})\n\n\t\t\t\t\t// Hide the slot if we just closed it\n\t\t\t\t\tslotAnimation.onfinish = () => {\n\t\t\t\t\t\tif (this.open) {\n\t\t\t\t\t\t\tthis.defaultSlot.hidden = true\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tthis.defaultSlot.style.height = 'auto'\n\t\t\t\t\t\t\tthis.defaultSlot.style.opacity = '1'\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\t// Return an Observable that completes when both animations finish\n\t\t\t\t\treturn zip(fromEvent(chevronAnimation, 'finish'), fromEvent(slotAnimation, 'finish')).pipe(\n\t\t\t\t\t\ttakeUntil(this.disconnecting),\n\t\t\t\t\t)\n\t\t\t\t}),\n\t\t\t\ttap(() => {\n\t\t\t\t\t// Flip the open state\n\t\t\t\t\tthis.open = !this.open\n\t\t\t\t}),\n\t\t\t\ttakeUntil(this.disconnecting),\n\t\t\t)\n\t\t\t.subscribe()\n\t}\n\n\trender() {\n\t\treturn html`\n\t\t\t<div class=\"flex content-center items-center justify-between\">\n\t\t\t\t<!-- Root toggler content -->\n\t\t\t\t<slot id=\"toggler\" name=\"root\"></slot>\n\n\t\t\t\t<!-- The chevron or arrow symbol -->\n\t\t\t\t<!-- Stop propagation on the schmancy-button itself just to avoid double triggers -->\n\t\t\t\t<schmancy-button\n\t\t\t\t\tslot=\"trailing\"\n\t\t\t\t\tid=\"chevron\"\n\t\t\t\t\taria-expanded=${this.open ? 'true' : 'false'}\n\t\t\t\t\taria-controls=${this.contentId}\n\t\t\t\t\taria-label=${this.open ? 'Collapse' : 'Expand'}\n\t\t\t\t\t@click=${(e: Event) => e.stopPropagation()}\n\t\t\t\t>\n\t\t\t\t\t⌅\n\t\t\t\t</schmancy-button>\n\t\t\t</div>\n\n\t\t\t<!-- The default slot: tree children -->\n\t\t\t<slot id=${this.contentId}></slot>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-tree': SchmancyTree\n\t}\n}\n"],"mappings":"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"}

package/dist/tree.js

@@ -1,5 +1,5 @@
-import { t as e, u as t } from "./SchmancyElement-OG71FtNv.js";
-import "./mixins-bCEXbwJV.js";
+import { t as e, u as t } from "./SchmancyElement-Ob9yGkiG.js";
+import "./mixins-q4KAL8Xr.js";
 import { fromEvent as n, merge as r, switchMap as i, takeUntil as a, tap as o, zip as s } from "rxjs";
 import { customElement as c, property as l, query as u } from "lit/decorators.js";
 import { css as d, html as f } from "lit";
@@ -15,19 +15,19 @@ var p = class extends e {
 	}
 	static {
 		this.styles = [d`
-	:host {
-		display: block;
-		position: relative;
-		background-color: initial;
-	}
-	::slotted([slot='root']) {
-		width: 100%;
-		text-align: left;
-	}
-	::slotted([slot='root'] + *) {
-		margin-top: 0.5rem;
-	}
-`];
+			:host {
+				display: block;
+				position: relative;
+				background-color: initial;
+			}
+			::slotted([slot='root']) {
+				width: 100%;
+				text-align: left;
+			}
+			::slotted([slot='root'] + *) {
+				margin-top: 0.5rem;
+			}
+		`];
 	}
 	get contentId() {
 		return `${this.a11yId}-content`;

package/dist/tree.js.map

@@ -1 +1 @@
-{"version":3,"file":"tree.js","names":[],"sources":["../src/tree/tree.ts"],"sourcesContent":["import { SchmancyElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement, property, query } from 'lit/decorators.js'\nimport { fromEvent, merge, switchMap, takeUntil, tap, zip } from 'rxjs'\n\n/**\n * @element schmancy-tree\n * @slot root - The root element of the tree\n * @slot - The children of the tree\n */\n@customElement('schmancy-tree')\nexport class SchmancyTree extends SchmancyElement {\n\tstatic styles = [css`\n\t:host {\n\t\tdisplay: block;\n\t\tposition: relative;\n\t\tbackground-color: initial;\n\t}\n\t::slotted([slot='root']) {\n\t\twidth: 100%;\n\t\ttext-align: left;\n\t}\n\t::slotted([slot='root'] + *) {\n\t\tmargin-top: 0.5rem;\n\t}\n`];\n\t/**\n\t * Whether the tree’s children are visible\n\t */\n\t@property({ type: Boolean }) open = false\n\n\t@query('#toggler') toggler!: HTMLSlotElement\n\t@query('slot:not([name=\"root\"])') defaultSlot!: HTMLSlotElement\n\n\t// Since it's actually a <schmancy-button>, use HTMLElement or a custom type\n\t@query('#chevron') chevron!: HTMLElement\n\n\tprivate readonly a11yId = `schmancy-tree-${Math.random().toString(36).slice(2, 10)}`\n\tprivate get contentId() { return `${this.a11yId}-content` }\n\n\t/** ElementInternals — broadcasts `:state(open)` for consumer CSS. */\n\tprivate readonly internals: ElementInternals | undefined = (() => {\n\t\ttry { return this.attachInternals() } catch { return undefined }\n\t})()\n\n\tupdated(changed: Map<string, unknown>) {\n\t\tsuper.updated?.(changed)\n\t\tif (changed.has('open')) {\n\t\t\tif (this.open) this.internals?.states.add('open')\n\t\t\telse this.internals?.states.delete('open')\n\t\t}\n\t}\n\n\tfirstUpdated() {\n\t\t// Hide or show the slot initially based on `open`\n\t\tif (!this.open) {\n\t\t\tthis.defaultSlot.hidden = true\n\t\t}\n\n\t\t// Root toggler\n\t\tconst toggleClick$ = fromEvent<MouseEvent>(this.toggler, 'click').pipe(\n\t\t\ttakeUntil(this.disconnecting),\n\t\t\ttap(e => {\n\t\t\t\te.preventDefault()\n\t\t\t\te.stopPropagation()\n\t\t\t\tthis.dispatchEvent(new CustomEvent('toggle', { bubbles: false, composed: true }))\n\t\t\t}),\n\t\t)\n\n\t\t// Chevron (the schmancy-button) click\n\t\tconst chevronClick$ = fromEvent<MouseEvent>(this.chevron, 'click')\n\n\t\tmerge(toggleClick$, chevronClick$)\n\t\t\t.pipe(\n\t\t\t\tswitchMap(() => {\n\t\t\t\t\t// 1. Animate the chevron rotation\n\t\t\t\t\t//    If `open` is true, rotate from 180 -> 0; if false, from 0 -> 180\n\t\t\t\t\tconst fromDeg = this.open ? 180 : 0\n\t\t\t\t\tconst toDeg = this.open ? 0 : 180\n\t\t\t\t\tconst chevronAnimation = this.chevron.animate(\n\t\t\t\t\t\t[{ transform: `rotate(${fromDeg}deg)` }, { transform: `rotate(${toDeg}deg)` }],\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\tduration: 150,\n\t\t\t\t\t\t\teasing: 'ease-in',\n\t\t\t\t\t\t\tfill: 'forwards',\n\t\t\t\t\t\t},\n\t\t\t\t\t)\n\n\t\t\t\t\t// 2. Animate the slot’s height + opacity\n\t\t\t\t\tif (!this.open) {\n\t\t\t\t\t\t// We are about to open, so remove `hidden` to measure scrollHeight\n\t\t\t\t\t\tthis.defaultSlot.hidden = false\n\t\t\t\t\t}\n\n\t\t\t\t\tconst fromOpacity = this.open ? 1 : 0\n\t\t\t\t\tconst toOpacity = this.open ? 0 : 1\n\n\t\t\t\t\tconst slotAnimation = this.defaultSlot.animate([{ opacity: fromOpacity }, { opacity: toOpacity }], {\n\t\t\t\t\t\tduration: 150,\n\t\t\t\t\t\teasing: 'ease-out',\n\t\t\t\t\t\tfill: 'forwards',\n\t\t\t\t\t})\n\n\t\t\t\t\t// Hide the slot if we just closed it\n\t\t\t\t\tslotAnimation.onfinish = () => {\n\t\t\t\t\t\tif (this.open) {\n\t\t\t\t\t\t\tthis.defaultSlot.hidden = true\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tthis.defaultSlot.style.height = 'auto'\n\t\t\t\t\t\t\tthis.defaultSlot.style.opacity = '1'\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\t// Return an Observable that completes when both animations finish\n\t\t\t\t\treturn zip(fromEvent(chevronAnimation, 'finish'), fromEvent(slotAnimation, 'finish')).pipe(\n\t\t\t\t\t\ttakeUntil(this.disconnecting),\n\t\t\t\t\t)\n\t\t\t\t}),\n\t\t\t\ttap(() => {\n\t\t\t\t\t// Flip the open state\n\t\t\t\t\tthis.open = !this.open\n\t\t\t\t}),\n\t\t\t\ttakeUntil(this.disconnecting),\n\t\t\t)\n\t\t\t.subscribe()\n\t}\n\n\trender() {\n\t\treturn html`\n\t\t\t<div class=\"flex content-center items-center justify-between\">\n\t\t\t\t<!-- Root toggler content -->\n\t\t\t\t<slot id=\"toggler\" name=\"root\"></slot>\n\n\t\t\t\t<!-- The chevron or arrow symbol -->\n\t\t\t\t<!-- Stop propagation on the schmancy-button itself just to avoid double triggers -->\n\t\t\t\t<schmancy-button\n\t\t\t\t\tslot=\"trailing\"\n\t\t\t\t\tid=\"chevron\"\n\t\t\t\t\taria-expanded=${this.open ? 'true' : 'false'}\n\t\t\t\t\taria-controls=${this.contentId}\n\t\t\t\t\taria-label=${this.open ? 'Collapse' : 'Expand'}\n\t\t\t\t\t@click=${(e: Event) => e.stopPropagation()}\n\t\t\t\t>\n\t\t\t\t\t⌅\n\t\t\t\t</schmancy-button>\n\t\t\t</div>\n\n\t\t\t<!-- The default slot: tree children -->\n\t\t\t<slot id=${this.contentId}></slot>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-tree': SchmancyTree\n\t}\n}\n"],"mappings":";;;;;AAWO,IAAA,IAAA,cAA2B,EAAA;CAAA,YAAA,GAAA,GAAA;EAAA,MAAA,GAAA,CAAA,GAAA,KAAA,OAAA,CAkBG,GAAA,KAAA,SAQV,iBAAiB,KAAK,OAAA,EAAS,SAAS,EAAA,EAAI,MAAM,GAAG,EAAA,KAAA,KAAA,mBAAA;GAK9E,IAAA;IAAM,OAAO,KAAK,gBAAA;GAAkB,QAAA;IAAU;GAAiB;EAChE,GAAA;CAAA;CAAA;EAAA,KAAA,SA/BgB,CAAC,CAAG;;;;;;;;;;;;;;;CA0BpB,IAAA,YAAY;EAAc,OAAO,GAAG,KAAK,OAAA;CAAiB;CAO1D,QAAQ,GAAA;EACP,MAAM,UAAU,CAAA,GACZ,EAAQ,IAAI,MAAA,MACX,KAAK,OAAM,KAAK,WAAW,OAAO,IAAI,MAAA,IACrC,KAAK,WAAW,OAAO,OAAO,MAAA;CAErC;CAEA,eAAA;EAEM,KAAK,SACT,KAAK,YAAY,SAAA,CAAS,IAgB3B,EAZqB,EAAsB,KAAK,SAAS,OAAA,EAAS,KACjE,EAAU,KAAK,aAAA,GACf,GAAI,MAAA;GACH,EAAE,eAAA,GACF,EAAE,gBAAA,GACF,KAAK,cAAc,IAAI,YAAY,UAAU;IAAE,SAAA,CAAS;IAAO,UAAA,CAAU;GAAA,CAAA,CAAA;EAAA,CAAA,CAAA,GAKrD,EAAsB,KAAK,SAAS,OAAA,CAAA,EAGxD,KACA,QAAA;GAGC,IAAM,IAAU,KAAK,OAAO,MAAM,GAC5B,IAAQ,KAAK,OAAO,IAAI,KACxB,IAAmB,KAAK,QAAQ,QACrC,CAAC,EAAE,WAAW,UAAU,EAAA,MAAA,GAAiB,EAAE,WAAW,UAAU,EAAA,MAAA,CAAA,GAChE;IACC,UAAU;IACV,QAAQ;IACR,MAAM;GAAA,CAAA;GAKH,KAAK,SAET,KAAK,YAAY,SAAA,CAAS;GAG3B,IAAM,IAAc,QAAK,MACnB,IAAY,OAAK,MAEjB,IAAgB,KAAK,YAAY,QAAQ,CAAC,EAAE,SAAS,EAAA,GAAe,EAAE,SAAS,EAAA,CAAA,GAAc;IAClG,UAAU;IACV,QAAQ;IACR,MAAM;GAAA,CAAA;GAcP,OAVA,EAAc,iBAAA;IACT,KAAK,OACR,KAAK,YAAY,SAAA,CAAS,KAE1B,KAAK,YAAY,MAAM,SAAS,QAChC,KAAK,YAAY,MAAM,UAAU;GAAA,GAK5B,EAAI,EAAU,GAAkB,QAAA,GAAW,EAAU,GAAe,QAAA,CAAA,EAAW,KACrF,EAAU,KAAK,aAAA,CAAA;EAAA,CAAA,GAGjB,QAAA;GAEC,KAAK,OAAA,CAAQ,KAAK;EAAA,CAAA,GAEnB,EAAU,KAAK,aAAA,CAAA,EAEf,UAAA;CACH;CAEA,SAAA;EACC,OAAO,CAAI;;;;;;;;;;qBAUQ,KAAK,OAAO,SAAS,QAAA;qBACrB,KAAK,UAAA;kBACR,KAAK,OAAO,aAAa,SAAA;eAC5B,MAAa,EAAE,gBAAA,EAAA;;;;;;;cAOhB,KAAK,UAAA;;CAElB;AAAA;AAAA,EAAA,CAzHC,EAAS,EAAE,MAAM,QAAA,CAAA,CAAA,GAAS,EAAA,WAAA,QAAA,KAAA,CAAA,GAAA,EAAA,CAE1B,EAAM,UAAA,CAAA,GAAU,EAAA,WAAA,WAAA,KAAA,CAAA,GAAA,EAAA,CAChB,EAAM,2BAAA,CAAA,GAAyB,EAAA,WAAA,eAAA,KAAA,CAAA,GAAA,EAAA,CAG/B,EAAM,UAAA,CAAA,GAAU,EAAA,WAAA,WAAA,KAAA,CAAA,GAAA,IAAA,EAAA,CAzBjB,EAAc,eAAA,CAAA,GAAe,CAAA;AAAA,SAAA,KAAA"}
+{"version":3,"file":"tree.js","names":[],"sources":["../src/tree/tree.ts"],"sourcesContent":["import { SchmancyElement } from '@mixins/index'\nimport { css, html } from 'lit'\nimport { customElement, property, query } from 'lit/decorators.js'\nimport { fromEvent, merge, switchMap, takeUntil, tap, zip } from 'rxjs'\n\n/**\n * @element schmancy-tree\n * @slot root - The root element of the tree\n * @slot - The children of the tree\n */\n@customElement('schmancy-tree')\nexport class SchmancyTree extends SchmancyElement {\n\tstatic styles = [\n\t\tcss`\n\t\t\t:host {\n\t\t\t\tdisplay: block;\n\t\t\t\tposition: relative;\n\t\t\t\tbackground-color: initial;\n\t\t\t}\n\t\t\t::slotted([slot='root']) {\n\t\t\t\twidth: 100%;\n\t\t\t\ttext-align: left;\n\t\t\t}\n\t\t\t::slotted([slot='root'] + *) {\n\t\t\t\tmargin-top: 0.5rem;\n\t\t\t}\n\t\t`,\n\t]\n\t/**\n\t * Whether the tree’s children are visible\n\t */\n\t@property({ type: Boolean }) open = false\n\n\t@query('#toggler') toggler!: HTMLSlotElement\n\t@query('slot:not([name=\"root\"])') defaultSlot!: HTMLSlotElement\n\n\t// Since it's actually a <schmancy-button>, use HTMLElement or a custom type\n\t@query('#chevron') chevron!: HTMLElement\n\n\tprivate readonly a11yId = `schmancy-tree-${Math.random().toString(36).slice(2, 10)}`\n\tprivate get contentId() {\n\t\treturn `${this.a11yId}-content`\n\t}\n\n\t/** ElementInternals — broadcasts `:state(open)` for consumer CSS. */\n\tprivate readonly internals: ElementInternals | undefined = (() => {\n\t\ttry {\n\t\t\treturn this.attachInternals()\n\t\t} catch {\n\t\t\treturn undefined\n\t\t}\n\t})()\n\n\tupdated(changed: Map<string, unknown>) {\n\t\tsuper.updated?.(changed)\n\t\tif (changed.has('open')) {\n\t\t\tif (this.open) this.internals?.states.add('open')\n\t\t\telse this.internals?.states.delete('open')\n\t\t}\n\t}\n\n\tfirstUpdated() {\n\t\t// Hide or show the slot initially based on `open`\n\t\tif (!this.open) {\n\t\t\tthis.defaultSlot.hidden = true\n\t\t}\n\n\t\t// Root toggler\n\t\tconst toggleClick$ = fromEvent<MouseEvent>(this.toggler, 'click').pipe(\n\t\t\ttakeUntil(this.disconnecting),\n\t\t\ttap(e => {\n\t\t\t\te.preventDefault()\n\t\t\t\te.stopPropagation()\n\t\t\t\tthis.dispatchEvent(new CustomEvent('toggle', { bubbles: false, composed: true }))\n\t\t\t}),\n\t\t)\n\n\t\t// Chevron (the schmancy-button) click\n\t\tconst chevronClick$ = fromEvent<MouseEvent>(this.chevron, 'click')\n\n\t\tmerge(toggleClick$, chevronClick$)\n\t\t\t.pipe(\n\t\t\t\tswitchMap(() => {\n\t\t\t\t\t// 1. Animate the chevron rotation\n\t\t\t\t\t//    If `open` is true, rotate from 180 -> 0; if false, from 0 -> 180\n\t\t\t\t\tconst fromDeg = this.open ? 180 : 0\n\t\t\t\t\tconst toDeg = this.open ? 0 : 180\n\t\t\t\t\tconst chevronAnimation = this.chevron.animate(\n\t\t\t\t\t\t[{ transform: `rotate(${fromDeg}deg)` }, { transform: `rotate(${toDeg}deg)` }],\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\tduration: 150,\n\t\t\t\t\t\t\teasing: 'ease-in',\n\t\t\t\t\t\t\tfill: 'forwards',\n\t\t\t\t\t\t},\n\t\t\t\t\t)\n\n\t\t\t\t\t// 2. Animate the slot’s height + opacity\n\t\t\t\t\tif (!this.open) {\n\t\t\t\t\t\t// We are about to open, so remove `hidden` to measure scrollHeight\n\t\t\t\t\t\tthis.defaultSlot.hidden = false\n\t\t\t\t\t}\n\n\t\t\t\t\tconst fromOpacity = this.open ? 1 : 0\n\t\t\t\t\tconst toOpacity = this.open ? 0 : 1\n\n\t\t\t\t\tconst slotAnimation = this.defaultSlot.animate([{ opacity: fromOpacity }, { opacity: toOpacity }], {\n\t\t\t\t\t\tduration: 150,\n\t\t\t\t\t\teasing: 'ease-out',\n\t\t\t\t\t\tfill: 'forwards',\n\t\t\t\t\t})\n\n\t\t\t\t\t// Hide the slot if we just closed it\n\t\t\t\t\tslotAnimation.onfinish = () => {\n\t\t\t\t\t\tif (this.open) {\n\t\t\t\t\t\t\tthis.defaultSlot.hidden = true\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tthis.defaultSlot.style.height = 'auto'\n\t\t\t\t\t\t\tthis.defaultSlot.style.opacity = '1'\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\t// Return an Observable that completes when both animations finish\n\t\t\t\t\treturn zip(fromEvent(chevronAnimation, 'finish'), fromEvent(slotAnimation, 'finish')).pipe(\n\t\t\t\t\t\ttakeUntil(this.disconnecting),\n\t\t\t\t\t)\n\t\t\t\t}),\n\t\t\t\ttap(() => {\n\t\t\t\t\t// Flip the open state\n\t\t\t\t\tthis.open = !this.open\n\t\t\t\t}),\n\t\t\t\ttakeUntil(this.disconnecting),\n\t\t\t)\n\t\t\t.subscribe()\n\t}\n\n\trender() {\n\t\treturn html`\n\t\t\t<div class=\"flex content-center items-center justify-between\">\n\t\t\t\t<!-- Root toggler content -->\n\t\t\t\t<slot id=\"toggler\" name=\"root\"></slot>\n\n\t\t\t\t<!-- The chevron or arrow symbol -->\n\t\t\t\t<!-- Stop propagation on the schmancy-button itself just to avoid double triggers -->\n\t\t\t\t<schmancy-button\n\t\t\t\t\tslot=\"trailing\"\n\t\t\t\t\tid=\"chevron\"\n\t\t\t\t\taria-expanded=${this.open ? 'true' : 'false'}\n\t\t\t\t\taria-controls=${this.contentId}\n\t\t\t\t\taria-label=${this.open ? 'Collapse' : 'Expand'}\n\t\t\t\t\t@click=${(e: Event) => e.stopPropagation()}\n\t\t\t\t>\n\t\t\t\t\t⌅\n\t\t\t\t</schmancy-button>\n\t\t\t</div>\n\n\t\t\t<!-- The default slot: tree children -->\n\t\t\t<slot id=${this.contentId}></slot>\n\t\t`\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-tree': SchmancyTree\n\t}\n}\n"],"mappings":";;;;;AAWO,IAAA,IAAA,cAA2B,EAAA;CAAA,YAAA,GAAA,GAAA;EAAA,MAAA,GAAA,CAAA,GAAA,KAAA,OAAA,CAoBG,GAAA,KAAA,SAQV,iBAAiB,KAAK,OAAA,EAAS,SAAS,EAAA,EAAI,MAAM,GAAG,EAAA,KAAA,KAAA,mBAAA;GAO9E,IAAA;IACC,OAAO,KAAK,gBAAA;GACb,QAAA;IACC;GACD;EACD,GAAA;CAAA;CAAA;EAAA,KAAA,SAvCgB,CACf,CAAG;;;;;;;;;;;;;;;CA2BJ,IAAA,YAAY;EACX,OAAO,GAAG,KAAK,OAAA;CAChB;CAWA,QAAQ,GAAA;EACP,MAAM,UAAU,CAAA,GACZ,EAAQ,IAAI,MAAA,MACX,KAAK,OAAM,KAAK,WAAW,OAAO,IAAI,MAAA,IACrC,KAAK,WAAW,OAAO,OAAO,MAAA;CAErC;CAEA,eAAA;EAEM,KAAK,SACT,KAAK,YAAY,SAAA,CAAS,IAgB3B,EAZqB,EAAsB,KAAK,SAAS,OAAA,EAAS,KACjE,EAAU,KAAK,aAAA,GACf,GAAI,MAAA;GACH,EAAE,eAAA,GACF,EAAE,gBAAA,GACF,KAAK,cAAc,IAAI,YAAY,UAAU;IAAE,SAAA,CAAS;IAAO,UAAA,CAAU;GAAA,CAAA,CAAA;EAAA,CAAA,CAAA,GAKrD,EAAsB,KAAK,SAAS,OAAA,CAAA,EAGxD,KACA,QAAA;GAGC,IAAM,IAAU,KAAK,OAAO,MAAM,GAC5B,IAAQ,KAAK,OAAO,IAAI,KACxB,IAAmB,KAAK,QAAQ,QACrC,CAAC,EAAE,WAAW,UAAU,EAAA,MAAA,GAAiB,EAAE,WAAW,UAAU,EAAA,MAAA,CAAA,GAChE;IACC,UAAU;IACV,QAAQ;IACR,MAAM;GAAA,CAAA;GAKH,KAAK,SAET,KAAK,YAAY,SAAA,CAAS;GAG3B,IAAM,IAAc,QAAK,MACnB,IAAY,OAAK,MAEjB,IAAgB,KAAK,YAAY,QAAQ,CAAC,EAAE,SAAS,EAAA,GAAe,EAAE,SAAS,EAAA,CAAA,GAAc;IAClG,UAAU;IACV,QAAQ;IACR,MAAM;GAAA,CAAA;GAcP,OAVA,EAAc,iBAAA;IACT,KAAK,OACR,KAAK,YAAY,SAAA,CAAS,KAE1B,KAAK,YAAY,MAAM,SAAS,QAChC,KAAK,YAAY,MAAM,UAAU;GAAA,GAK5B,EAAI,EAAU,GAAkB,QAAA,GAAW,EAAU,GAAe,QAAA,CAAA,EAAW,KACrF,EAAU,KAAK,aAAA,CAAA;EAAA,CAAA,GAGjB,QAAA;GAEC,KAAK,OAAA,CAAQ,KAAK;EAAA,CAAA,GAEnB,EAAU,KAAK,aAAA,CAAA,EAEf,UAAA;CACH;CAEA,SAAA;EACC,OAAO,CAAI;;;;;;;;;;qBAUQ,KAAK,OAAO,SAAS,QAAA;qBACrB,KAAK,UAAA;kBACR,KAAK,OAAO,aAAa,SAAA;eAC5B,MAAa,EAAE,gBAAA,EAAA;;;;;;;cAOhB,KAAK,UAAA;;CAElB;AAAA;AAAA,EAAA,CA/HC,EAAS,EAAE,MAAM,QAAA,CAAA,CAAA,GAAS,EAAA,WAAA,QAAA,KAAA,CAAA,GAAA,EAAA,CAE1B,EAAM,UAAA,CAAA,GAAU,EAAA,WAAA,WAAA,KAAA,CAAA,GAAA,EAAA,CAChB,EAAM,2BAAA,CAAA,GAAyB,EAAA,WAAA,eAAA,KAAA,CAAA,GAAA,EAAA,CAG/B,EAAM,UAAA,CAAA,GAAU,EAAA,WAAA,WAAA,KAAA,CAAA,GAAA,IAAA,EAAA,CA3BjB,EAAc,eAAA,CAAA,GAAe,CAAA;AAAA,SAAA,KAAA"}

package/dist/types.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e=function(e){return e.NavDrawer_toggle=`SchmancytoggleSidebar`,e.ContentDrawerToggle=`ContentDrawerToggle`,e.ContentDrawerResize=`ContentDrawerResize`,e}({});exports.SchmancyEvents=e;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e=function(e){return e.NavDrawer_toggle=`SchmancytoggleSidebar`,e.ContentDrawerToggle=`ContentDrawerToggle`,e.ContentDrawerResize=`ContentDrawerResize`,e}({});exports.SURFACE_SEMANTIC=[`primary`,`secondary`,`tertiary`,`error`,`success`,`warning`,`info`],exports.SURFACE_TONAL=[`surface`,`surfaceDim`,`surfaceBright`,`containerLowest`,`containerLow`,`container`,`containerHigh`,`containerHighest`],exports.SURFACE_UTILITY=[`transparent`,`outlined`],exports.SchmancyEvents=e;

package/dist/types.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"types.cjs","names":[],"sources":["../src/types/events.ts"],"sourcesContent":["export enum SchmancyEvents {\n\tNavDrawer_toggle = 'SchmancytoggleSidebar',\n\tContentDrawerToggle = 'ContentDrawerToggle',\n\tContentDrawerResize = 'ContentDrawerResize',\n}\n"],"mappings":"mEAAA,IAAY,EAAL,SAAA,EAAA,CAAA,MACN,GAAA,iBAAA,wBACA,EAAA,oBAAA,sBACA,EAAA,oBAAA,sBAAA,CACD,EAAA,CAAA,CAAA,EAAA,QAAA,eAAA"}
+{"version":3,"file":"types.cjs","names":[],"sources":["../src/types/events.ts","../src/types/surface.ts"],"sourcesContent":["export enum SchmancyEvents {\n\tNavDrawer_toggle = 'SchmancytoggleSidebar',\n\tContentDrawerToggle = 'ContentDrawerToggle',\n\tContentDrawerResize = 'ContentDrawerResize',\n}\n","/**\n * Surface vocabulary — three closed sets covering every `type` value\n * `<schmancy-surface>` accepts.\n *\n * Tonal names express depth: each renders one constant glass material\n * (`backdrop-filter: var(--glass-material)`) whose base tint is the\n * matching M3 tonal token (`--glass-base`). Depth is tone, not blur.\n *\n * Semantic names apply a translucent role tint (`primary`…`info`).\n * Utility names cover the no-paint and border-only cases.\n *\n * The exact `--glass-material` and `--glass-opacity` values are the\n * single source of truth in `surface.styles.ts` and documented in\n * `skills/schmancy/surface.md`.\n */\n\n/** M3 tonal depth names — eight levels, lightest to highest */\nexport const SURFACE_TONAL = [\n\t'surface',\n\t'surfaceDim',\n\t'surfaceBright',\n\t'containerLowest',\n\t'containerLow',\n\t'container',\n\t'containerHigh',\n\t'containerHighest',\n] as const\n\n/** Role-tinted glass names */\nexport const SURFACE_SEMANTIC = [\n\t'primary',\n\t'secondary',\n\t'tertiary',\n\t'error',\n\t'success',\n\t'warning',\n\t'info',\n] as const\n\n/** No-paint and border-only utility names */\nexport const SURFACE_UTILITY = ['transparent', 'outlined'] as const\n\nexport type TSurfaceColor =\n\t| (typeof SURFACE_TONAL)[number]\n\t| (typeof SURFACE_SEMANTIC)[number]\n\t| (typeof SURFACE_UTILITY)[number]\n"],"mappings":"mEAAA,IAAY,EAAL,SAAA,EAAA,CAAA,MACN,GAAA,iBAAA,wBACA,EAAA,oBAAA,sBACA,EAAA,oBAAA,sBAAA,CACD,EAAA,CAAA,CAAA,EAAA,QAAA,iBCyBgC,CAC/B,UACA,YACA,WACA,QACA,UACA,UACA,MAAA,EAAA,QAAA,cAnB4B,CAC5B,UACA,aACA,gBACA,kBACA,eACA,YACA,gBACA,kBAAA,EAAA,QAAA,gBAe8B,CAAC,cAAe,UAAA,EAAA,QAAA,eAAA"}

package/dist/types.js

@@ -1,4 +1,21 @@
 var e = function(e) {
 	return e.NavDrawer_toggle = "SchmancytoggleSidebar", e.ContentDrawerToggle = "ContentDrawerToggle", e.ContentDrawerResize = "ContentDrawerResize", e;
-}({});
-export { e as SchmancyEvents };
+}({}), t = [
+	"surface",
+	"surfaceDim",
+	"surfaceBright",
+	"containerLowest",
+	"containerLow",
+	"container",
+	"containerHigh",
+	"containerHighest"
+], n = [
+	"primary",
+	"secondary",
+	"tertiary",
+	"error",
+	"success",
+	"warning",
+	"info"
+], r = ["transparent", "outlined"];
+export { n as SURFACE_SEMANTIC, t as SURFACE_TONAL, r as SURFACE_UTILITY, e as SchmancyEvents };

package/dist/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","names":[],"sources":["../src/types/events.ts"],"sourcesContent":["export enum SchmancyEvents {\n\tNavDrawer_toggle = 'SchmancytoggleSidebar',\n\tContentDrawerToggle = 'ContentDrawerToggle',\n\tContentDrawerResize = 'ContentDrawerResize',\n}\n"],"mappings":"AAAA,IAAY,IAAL,SAAA,GAAA;CAAA,OACN,EAAA,mBAAA,yBACA,EAAA,sBAAA,uBACA,EAAA,sBAAA,uBAAA;AACD,EAAA,CAAA,CAAA;AAAA,SAAA,KAAA"}
+{"version":3,"file":"types.js","names":[],"sources":["../src/types/events.ts","../src/types/surface.ts"],"sourcesContent":["export enum SchmancyEvents {\n\tNavDrawer_toggle = 'SchmancytoggleSidebar',\n\tContentDrawerToggle = 'ContentDrawerToggle',\n\tContentDrawerResize = 'ContentDrawerResize',\n}\n","/**\n * Surface vocabulary — three closed sets covering every `type` value\n * `<schmancy-surface>` accepts.\n *\n * Tonal names express depth: each renders one constant glass material\n * (`backdrop-filter: var(--glass-material)`) whose base tint is the\n * matching M3 tonal token (`--glass-base`). Depth is tone, not blur.\n *\n * Semantic names apply a translucent role tint (`primary`…`info`).\n * Utility names cover the no-paint and border-only cases.\n *\n * The exact `--glass-material` and `--glass-opacity` values are the\n * single source of truth in `surface.styles.ts` and documented in\n * `skills/schmancy/surface.md`.\n */\n\n/** M3 tonal depth names — eight levels, lightest to highest */\nexport const SURFACE_TONAL = [\n\t'surface',\n\t'surfaceDim',\n\t'surfaceBright',\n\t'containerLowest',\n\t'containerLow',\n\t'container',\n\t'containerHigh',\n\t'containerHighest',\n] as const\n\n/** Role-tinted glass names */\nexport const SURFACE_SEMANTIC = [\n\t'primary',\n\t'secondary',\n\t'tertiary',\n\t'error',\n\t'success',\n\t'warning',\n\t'info',\n] as const\n\n/** No-paint and border-only utility names */\nexport const SURFACE_UTILITY = ['transparent', 'outlined'] as const\n\nexport type TSurfaceColor =\n\t| (typeof SURFACE_TONAL)[number]\n\t| (typeof SURFACE_SEMANTIC)[number]\n\t| (typeof SURFACE_UTILITY)[number]\n"],"mappings":"AAAA,IAAY,IAAL,SAAA,GAAA;CAAA,OACN,EAAA,mBAAA,yBACA,EAAA,sBAAA,uBACA,EAAA,sBAAA,uBAAA;AACD,EAAA,CAAA,CAAA,GCaa,IAAgB;CAC5B;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AAAA,GAIY,IAAmB;CAC/B;CACA;CACA;CACA;CACA;CACA;CACA;AAAA,GAIY,IAAkB,CAAC,eAAe,UAAA;AAAA,SAAA,KAAA,kBAAA,KAAA,eAAA,KAAA,iBAAA,KAAA"}

package/dist/typewriter.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"typewriter.cjs","names":[],"sources":["../src/typewriter/typewriter.directive.ts"],"sourcesContent":["/**\n * Typewriter Directive - RxJS-based typing animation\n *\n * Creates a smooth typewriter effect with automatic cycling through phrases.\n * Uses RxJS for precise timing and clean reactive patterns.\n *\n * @example\n * ```ts\n * // Simple cycling through words\n * html`<div ${typewriter(['Trustless', 'Permissionless', 'Transparent'])}>\n *   <span class=\"typed\"></span>\n * </div>`\n *\n * // Custom speeds and pauses\n * html`<div ${typewriter(['Fast', 'Typing'], { typeSpeed: 50, pauseDuration: 1000 })}>\n *   <span class=\"typed\"></span>\n * </div>`\n *\n * // One-time typing (no loop)\n * html`<div ${typewriter(['Hello World'], { loop: false })}>\n *   <span class=\"typed\"></span>\n * </div>`\n * ```\n */\n\nimport type { ElementPart } from 'lit'\nimport { noChange } from 'lit'\nimport { AsyncDirective, directive } from 'lit/async-directive.js'\nimport { concat, defer, EMPTY, interval, of, Subscription } from 'rxjs'\nimport { delay, repeat, take, tap } from 'rxjs/operators'\n\nexport interface TypewriterOptions {\n\ttypeSpeed?: number // Speed of typing (ms per character)\n\tdeleteSpeed?: number // Speed of deleting (ms per character)\n\tpauseDuration?: number // Pause after typing before deleting (ms)\n\tloop?: boolean // Whether to loop through phrases\n\tselector?: string // CSS selector for target element (default: '.typed')\n\tcursor?: boolean // Show cursor\n\tfinalMessage?: string // Message to display after cycling completes\n\tsound?: boolean // Play typewriter sounds (default: true)\n\tvolume?: number // Sound volume (0-1, default: 0.3)\n}\n\ninterface TypewriterState {\n\tphrases: string[]\n\toptions: Required<TypewriterOptions>\n\telement?: HTMLElement\n\ttargetElement?: HTMLElement\n\tsubscription?: Subscription\n\taudioContext?: AudioContext\n}\n\n// Typewriter sound generator using Web Audio API\nclass TypewriterSound {\n\tprivate audioContext: AudioContext\n\tprivate volume: number\n\n\tconstructor(volume: number = 0.3) {\n\t\tthis.audioContext = new AudioContext()\n\t\tthis.volume = Math.max(0, Math.min(1, volume))\n\t}\n\n\t// Generate cute, soft typing sound - like a gentle \"pop\"\n\tplayKeyPress() {\n\t\tconst now = this.audioContext.currentTime\n\n\t\t// Higher, softer main tone - more \"pop\" than \"clack\"\n\t\tconst osc = this.audioContext.createOscillator()\n\t\tconst gainNode = this.audioContext.createGain()\n\n\t\t// Higher base frequency for cute sound + randomness\n\t\tconst baseFreq = 800 + Math.random() * 200\n\t\tosc.frequency.setValueAtTime(baseFreq, now)\n\t\tosc.type = 'sine' // Smoother, rounder sound\n\n\t\t// Gentler attack, quick but soft\n\t\tgainNode.gain.setValueAtTime(0, now)\n\t\tgainNode.gain.linearRampToValueAtTime(this.volume * 0.2, now + 0.005)\n\t\tgainNode.gain.exponentialRampToValueAtTime(0.001, now + 0.03)\n\n\t\tosc.connect(gainNode)\n\t\tgainNode.connect(this.audioContext.destination)\n\n\t\tosc.start(now)\n\t\tosc.stop(now + 0.03)\n\n\t\t// Add a cute high \"bleep\" for character\n\t\tconst bleepOsc = this.audioContext.createOscillator()\n\t\tconst bleepGain = this.audioContext.createGain()\n\n\t\tbleepOsc.frequency.setValueAtTime(1800 + Math.random() * 400, now)\n\t\tbleepOsc.type = 'sine'\n\n\t\tbleepGain.gain.setValueAtTime(0, now)\n\t\tbleepGain.gain.linearRampToValueAtTime(this.volume * 0.08, now + 0.003)\n\t\tbleepGain.gain.exponentialRampToValueAtTime(0.001, now + 0.015)\n\n\t\tbleepOsc.connect(bleepGain)\n\t\tbleepGain.connect(this.audioContext.destination)\n\n\t\tbleepOsc.start(now)\n\t\tbleepOsc.stop(now + 0.015)\n\t}\n\n\t// Softer \"whoosh\" sound for deletion - like erasing\n\tplayDelete() {\n\t\tconst now = this.audioContext.currentTime\n\n\t\tconst osc = this.audioContext.createOscillator()\n\t\tconst gainNode = this.audioContext.createGain()\n\n\t\t// Descending pitch for \"erasing\" feel\n\t\tosc.frequency.setValueAtTime(600, now)\n\t\tosc.frequency.exponentialRampToValueAtTime(200, now + 0.04)\n\t\tosc.type = 'sine'\n\n\t\tgainNode.gain.setValueAtTime(0, now)\n\t\tgainNode.gain.linearRampToValueAtTime(this.volume * 0.12, now + 0.005)\n\t\tgainNode.gain.exponentialRampToValueAtTime(0.001, now + 0.04)\n\n\t\tosc.connect(gainNode)\n\t\tgainNode.connect(this.audioContext.destination)\n\n\t\tosc.start(now)\n\t\tosc.stop(now + 0.04)\n\t}\n\n\tcleanup() {\n\t\tthis.audioContext.close()\n\t}\n}\n\nclass TypewriterDirective extends AsyncDirective {\n\tprivate state: TypewriterState | null = null\n\tprivate soundEngine: TypewriterSound | null = null\n\n\trender(_phrases: string[], _options: TypewriterOptions = {}) {\n\t\treturn noChange\n\t}\n\n\toverride update(\n\t\tpart: ElementPart,\n\t\t[phrases, options = {}]: [string[], TypewriterOptions]\n\t) {\n\t\tconst element = part.element as HTMLElement\n\n\t\t// Clean up if params changed\n\t\tif (\n\t\t\tthis.state &&\n\t\t\t(JSON.stringify(this.state.phrases) !== JSON.stringify(phrases) ||\n\t\t\t\tJSON.stringify(this.state.options) !== JSON.stringify(options))\n\t\t) {\n\t\t\tthis.cleanup()\n\t\t}\n\n\t\t// Initialize state\n\t\tif (!this.state) {\n\t\t\tconst defaultOptions: Required<TypewriterOptions> = {\n\t\t\t\ttypeSpeed: 50,\n\t\t\t\tdeleteSpeed: 30,\n\t\t\t\tpauseDuration: 1500,\n\t\t\t\tloop: true,\n\t\t\t\tselector: '.typed',\n\t\t\t\tcursor: false,\n\t\t\t\tfinalMessage: '',\n\t\t\t\tsound: true,\n\t\t\t\tvolume: 0.08,\n\t\t\t}\n\n\t\t\tthis.state = {\n\t\t\t\tphrases,\n\t\t\t\toptions: { ...defaultOptions, ...options },\n\t\t\t\telement,\n\t\t\t}\n\n\t\t\t// Initialize sound engine if enabled\n\t\t\tif (this.state.options.sound) {\n\t\t\t\tthis.soundEngine = new TypewriterSound(this.state.options.volume)\n\t\t\t}\n\n\t\t\t// Find target element\n\t\t\tthis.state.targetElement = element.querySelector<HTMLElement>(\n\t\t\t\tthis.state.options.selector\n\t\t\t) ?? undefined\n\n\t\t\tif (!this.state.targetElement) {\n\t\t\t\tconsole.warn(\n\t\t\t\t\t`Typewriter: Target element \"${this.state.options.selector}\" not found`\n\t\t\t\t)\n\t\t\t\treturn noChange\n\t\t\t}\n\n\t\t\t// Add cursor if enabled\n\t\t\tif (this.state.options.cursor) {\n\t\t\t\tthis.state.targetElement.style.position = 'relative'\n\t\t\t\tthis.state.targetElement.style.display = 'inline-block'\n\t\t\t\tconst cursor = document.createElement('span')\n\t\t\t\tcursor.className = 'typewriter-cursor'\n\t\t\t\tcursor.textContent = '|'\n\t\t\t\tcursor.style.cssText = `\n\t\t\t\t\tdisplay: inline-block;\n\t\t\t\t\tmargin-left: 2px;\n\t\t\t\t\tanimation: typewriter-blink 1s step-end infinite;\n\t\t\t\t`\n\t\t\t\tthis.state.targetElement.appendChild(cursor)\n\n\t\t\t\t// Add blink animation if not already present\n\t\t\t\tif (!document.getElementById('typewriter-styles')) {\n\t\t\t\t\tconst style = document.createElement('style')\n\t\t\t\t\tstyle.id = 'typewriter-styles'\n\t\t\t\t\tstyle.textContent = `\n\t\t\t\t\t\t@keyframes typewriter-blink {\n\t\t\t\t\t\t\t0%, 50% { opacity: 1; }\n\t\t\t\t\t\t\t51%, 100% { opacity: 0; }\n\t\t\t\t\t\t}\n\t\t\t\t\t`\n\t\t\t\t\tdocument.head.appendChild(style)\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tthis.startTyping()\n\t\t}\n\n\t\treturn noChange\n\t}\n\n\tprivate startTyping() {\n\t\tif (!this.state || !this.state.targetElement) return\n\n\t\tconst { phrases, options, targetElement } = this.state\n\n\t\t// Create typing observable for a single phrase\n\t\tconst typePhrase = (phrase: string, shouldDelete: boolean = true) => {\n\t\t\treturn concat(\n\t\t\t\t// Type each character\n\t\t\t\tdefer(() => {\n\t\t\t\t\tconst chars = phrase.split('')\n\t\t\t\t\treturn concat(\n\t\t\t\t\t\t...chars.map((char) =>\n\t\t\t\t\t\t\tof(char).pipe(\n\t\t\t\t\t\t\t\tdelay(options.typeSpeed),\n\t\t\t\t\t\t\t\ttap((c) => {\n\t\t\t\t\t\t\t\t\tconst textNode = this.getTextNode(targetElement)\n\t\t\t\t\t\t\t\t\tif (textNode) {\n\t\t\t\t\t\t\t\t\t\ttextNode.textContent += c\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t// Play key press sound\n\t\t\t\t\t\t\t\t\tif (this.soundEngine) {\n\t\t\t\t\t\t\t\t\t\tthis.soundEngine.playKeyPress()\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t})\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t)\n\t\t\t\t\t)\n\t\t\t\t}),\n\t\t\t\t// Pause after typing\n\t\t\t\tof(null).pipe(delay(options.pauseDuration)),\n\t\t\t\t// Delete each character (only if shouldDelete is true)\n\t\t\t\tshouldDelete ? defer(() => {\n\t\t\t\t\tconst deleteCount = phrase.length\n\t\t\t\t\treturn interval(options.deleteSpeed).pipe(\n\t\t\t\t\t\ttake(deleteCount),\n\t\t\t\t\t\ttap(() => {\n\t\t\t\t\t\t\tconst textNode = this.getTextNode(targetElement)\n\t\t\t\t\t\t\tif (textNode && textNode.textContent) {\n\t\t\t\t\t\t\t\ttextNode.textContent = textNode.textContent.slice(0, -1)\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t// Play delete sound\n\t\t\t\t\t\t\tif (this.soundEngine) {\n\t\t\t\t\t\t\t\tthis.soundEngine.playDelete()\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t})\n\t\t\t\t\t)\n\t\t\t\t}) : EMPTY,\n\t\t\t\t// Small pause before next phrase\n\t\t\t\tshouldDelete ? of(null).pipe(delay(200)) : EMPTY\n\t\t\t)\n\t\t}\n\n\t\t// Create observable that cycles through all phrases\n\t\tconst phrasesSequence = concat(\n\t\t\t...phrases.map((phrase) => typePhrase(phrase))\n\t\t)\n\n\t\t// Add final message if provided\n\t\tconst typingSequence = options.finalMessage\n\t\t\t? concat(\n\t\t\t\t\tphrasesSequence,\n\t\t\t\t\ttypePhrase(options.finalMessage, false) // Don't delete final message\n\t\t\t\t)\n\t\t\t: phrasesSequence\n\n\t\t// Subscribe and optionally loop\n\t\tthis.state.subscription = (\n\t\t\toptions.loop ? phrasesSequence.pipe(repeat()) : typingSequence\n\t\t).subscribe({\n\t\t\terror: (err) => console.error('Typewriter error:', err),\n\t\t})\n\t}\n\n\tprivate getTextNode(targetElement: HTMLElement): Text | null {\n\t\t// Get or create text node (ignoring cursor element)\n\t\tfor (const child of Array.from(targetElement.childNodes)) {\n\t\t\tif (child.nodeType === Node.TEXT_NODE) {\n\t\t\t\treturn child as Text\n\t\t\t}\n\t\t}\n\t\t// Create text node if it doesn't exist\n\t\tconst textNode = document.createTextNode('')\n\t\ttargetElement.insertBefore(textNode, targetElement.firstChild)\n\t\treturn textNode\n\t}\n\n\tprivate cleanup() {\n\t\tif (!this.state) return\n\n\t\t// Unsubscribe from typing observable\n\t\tif (this.state.subscription) {\n\t\t\tthis.state.subscription.unsubscribe()\n\t\t}\n\n\t\t// Remove cursor if present\n\t\tif (this.state.targetElement) {\n\t\t\tconst cursor = this.state.targetElement.querySelector('.typewriter-cursor')\n\t\t\tcursor?.remove()\n\t\t}\n\n\t\t// Cleanup sound engine\n\t\tif (this.soundEngine) {\n\t\t\tthis.soundEngine.cleanup()\n\t\t\tthis.soundEngine = null\n\t\t}\n\n\t\tthis.state = null\n\t}\n\n\toverride disconnected() {\n\t\tthis.cleanup()\n\t}\n\n\toverride reconnected(): void {\n\t\t// Re-start typing if state exists\n\t\tif (this.state && !this.state.subscription) {\n\t\t\tthis.startTyping()\n\t\t}\n\t}\n}\n\nexport const typewriter = directive(TypewriterDirective)\n"],"mappings":"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"}
+{"version":3,"file":"typewriter.cjs","names":[],"sources":["../src/typewriter/typewriter.directive.ts"],"sourcesContent":["/**\n * Typewriter Directive - RxJS-based typing animation\n *\n * Creates a smooth typewriter effect with automatic cycling through phrases.\n * Uses RxJS for precise timing and clean reactive patterns.\n *\n * @example\n * ```ts\n * // Simple cycling through words\n * html`<div ${typewriter(['Trustless', 'Permissionless', 'Transparent'])}>\n *   <span class=\"typed\"></span>\n * </div>`\n *\n * // Custom speeds and pauses\n * html`<div ${typewriter(['Fast', 'Typing'], { typeSpeed: 50, pauseDuration: 1000 })}>\n *   <span class=\"typed\"></span>\n * </div>`\n *\n * // One-time typing (no loop)\n * html`<div ${typewriter(['Hello World'], { loop: false })}>\n *   <span class=\"typed\"></span>\n * </div>`\n * ```\n */\n\nimport type { ElementPart } from 'lit'\nimport { noChange } from 'lit'\nimport { AsyncDirective, directive } from 'lit/async-directive.js'\nimport { concat, defer, EMPTY, interval, of, Subscription } from 'rxjs'\nimport { delay, repeat, take, tap } from 'rxjs/operators'\n\nexport interface TypewriterOptions {\n\ttypeSpeed?: number // Speed of typing (ms per character)\n\tdeleteSpeed?: number // Speed of deleting (ms per character)\n\tpauseDuration?: number // Pause after typing before deleting (ms)\n\tloop?: boolean // Whether to loop through phrases\n\tselector?: string // CSS selector for target element (default: '.typed')\n\tcursor?: boolean // Show cursor\n\tfinalMessage?: string // Message to display after cycling completes\n\tsound?: boolean // Play typewriter sounds (default: true)\n\tvolume?: number // Sound volume (0-1, default: 0.3)\n}\n\ninterface TypewriterState {\n\tphrases: string[]\n\toptions: Required<TypewriterOptions>\n\telement?: HTMLElement\n\ttargetElement?: HTMLElement\n\tsubscription?: Subscription\n\taudioContext?: AudioContext\n}\n\n// Typewriter sound generator using Web Audio API\nclass TypewriterSound {\n\tprivate audioContext: AudioContext\n\tprivate volume: number\n\n\tconstructor(volume: number = 0.3) {\n\t\tthis.audioContext = new AudioContext()\n\t\tthis.volume = Math.max(0, Math.min(1, volume))\n\t}\n\n\t// Generate cute, soft typing sound - like a gentle \"pop\"\n\tplayKeyPress() {\n\t\tconst now = this.audioContext.currentTime\n\n\t\t// Higher, softer main tone - more \"pop\" than \"clack\"\n\t\tconst osc = this.audioContext.createOscillator()\n\t\tconst gainNode = this.audioContext.createGain()\n\n\t\t// Higher base frequency for cute sound + randomness\n\t\tconst baseFreq = 800 + Math.random() * 200\n\t\tosc.frequency.setValueAtTime(baseFreq, now)\n\t\tosc.type = 'sine' // Smoother, rounder sound\n\n\t\t// Gentler attack, quick but soft\n\t\tgainNode.gain.setValueAtTime(0, now)\n\t\tgainNode.gain.linearRampToValueAtTime(this.volume * 0.2, now + 0.005)\n\t\tgainNode.gain.exponentialRampToValueAtTime(0.001, now + 0.03)\n\n\t\tosc.connect(gainNode)\n\t\tgainNode.connect(this.audioContext.destination)\n\n\t\tosc.start(now)\n\t\tosc.stop(now + 0.03)\n\n\t\t// Add a cute high \"bleep\" for character\n\t\tconst bleepOsc = this.audioContext.createOscillator()\n\t\tconst bleepGain = this.audioContext.createGain()\n\n\t\tbleepOsc.frequency.setValueAtTime(1800 + Math.random() * 400, now)\n\t\tbleepOsc.type = 'sine'\n\n\t\tbleepGain.gain.setValueAtTime(0, now)\n\t\tbleepGain.gain.linearRampToValueAtTime(this.volume * 0.08, now + 0.003)\n\t\tbleepGain.gain.exponentialRampToValueAtTime(0.001, now + 0.015)\n\n\t\tbleepOsc.connect(bleepGain)\n\t\tbleepGain.connect(this.audioContext.destination)\n\n\t\tbleepOsc.start(now)\n\t\tbleepOsc.stop(now + 0.015)\n\t}\n\n\t// Softer \"whoosh\" sound for deletion - like erasing\n\tplayDelete() {\n\t\tconst now = this.audioContext.currentTime\n\n\t\tconst osc = this.audioContext.createOscillator()\n\t\tconst gainNode = this.audioContext.createGain()\n\n\t\t// Descending pitch for \"erasing\" feel\n\t\tosc.frequency.setValueAtTime(600, now)\n\t\tosc.frequency.exponentialRampToValueAtTime(200, now + 0.04)\n\t\tosc.type = 'sine'\n\n\t\tgainNode.gain.setValueAtTime(0, now)\n\t\tgainNode.gain.linearRampToValueAtTime(this.volume * 0.12, now + 0.005)\n\t\tgainNode.gain.exponentialRampToValueAtTime(0.001, now + 0.04)\n\n\t\tosc.connect(gainNode)\n\t\tgainNode.connect(this.audioContext.destination)\n\n\t\tosc.start(now)\n\t\tosc.stop(now + 0.04)\n\t}\n\n\tcleanup() {\n\t\tthis.audioContext.close()\n\t}\n}\n\nclass TypewriterDirective extends AsyncDirective {\n\tprivate state: TypewriterState | null = null\n\tprivate soundEngine: TypewriterSound | null = null\n\n\trender(_phrases: string[], _options: TypewriterOptions = {}) {\n\t\treturn noChange\n\t}\n\n\toverride update(part: ElementPart, [phrases, options = {}]: [string[], TypewriterOptions]) {\n\t\tconst element = part.element as HTMLElement\n\n\t\t// Clean up if params changed\n\t\tif (\n\t\t\tthis.state &&\n\t\t\t(JSON.stringify(this.state.phrases) !== JSON.stringify(phrases) ||\n\t\t\t\tJSON.stringify(this.state.options) !== JSON.stringify(options))\n\t\t) {\n\t\t\tthis.cleanup()\n\t\t}\n\n\t\t// Initialize state\n\t\tif (!this.state) {\n\t\t\tconst defaultOptions: Required<TypewriterOptions> = {\n\t\t\t\ttypeSpeed: 50,\n\t\t\t\tdeleteSpeed: 30,\n\t\t\t\tpauseDuration: 1500,\n\t\t\t\tloop: true,\n\t\t\t\tselector: '.typed',\n\t\t\t\tcursor: false,\n\t\t\t\tfinalMessage: '',\n\t\t\t\tsound: true,\n\t\t\t\tvolume: 0.08,\n\t\t\t}\n\n\t\t\tthis.state = {\n\t\t\t\tphrases,\n\t\t\t\toptions: { ...defaultOptions, ...options },\n\t\t\t\telement,\n\t\t\t}\n\n\t\t\t// Initialize sound engine if enabled\n\t\t\tif (this.state.options.sound) {\n\t\t\t\tthis.soundEngine = new TypewriterSound(this.state.options.volume)\n\t\t\t}\n\n\t\t\t// Find target element\n\t\t\tthis.state.targetElement = element.querySelector<HTMLElement>(this.state.options.selector) ?? undefined\n\n\t\t\tif (!this.state.targetElement) {\n\t\t\t\tconsole.warn(`Typewriter: Target element \"${this.state.options.selector}\" not found`)\n\t\t\t\treturn noChange\n\t\t\t}\n\n\t\t\t// Add cursor if enabled\n\t\t\tif (this.state.options.cursor) {\n\t\t\t\tthis.state.targetElement.style.position = 'relative'\n\t\t\t\tthis.state.targetElement.style.display = 'inline-block'\n\t\t\t\tconst cursor = document.createElement('span')\n\t\t\t\tcursor.className = 'typewriter-cursor'\n\t\t\t\tcursor.textContent = '|'\n\t\t\t\tcursor.style.cssText = `\n\t\t\t\t\tdisplay: inline-block;\n\t\t\t\t\tmargin-left: 2px;\n\t\t\t\t\tanimation: typewriter-blink 1s step-end infinite;\n\t\t\t\t`\n\t\t\t\tthis.state.targetElement.appendChild(cursor)\n\n\t\t\t\t// Add blink animation if not already present\n\t\t\t\tif (!document.getElementById('typewriter-styles')) {\n\t\t\t\t\tconst style = document.createElement('style')\n\t\t\t\t\tstyle.id = 'typewriter-styles'\n\t\t\t\t\tstyle.textContent = `\n\t\t\t\t\t\t@keyframes typewriter-blink {\n\t\t\t\t\t\t\t0%, 50% { opacity: 1; }\n\t\t\t\t\t\t\t51%, 100% { opacity: 0; }\n\t\t\t\t\t\t}\n\t\t\t\t\t`\n\t\t\t\t\tdocument.head.appendChild(style)\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tthis.startTyping()\n\t\t}\n\n\t\treturn noChange\n\t}\n\n\tprivate startTyping() {\n\t\tif (!this.state || !this.state.targetElement) return\n\n\t\tconst { phrases, options, targetElement } = this.state\n\n\t\t// Create typing observable for a single phrase\n\t\tconst typePhrase = (phrase: string, shouldDelete: boolean = true) => {\n\t\t\treturn concat(\n\t\t\t\t// Type each character\n\t\t\t\tdefer(() => {\n\t\t\t\t\tconst chars = phrase.split('')\n\t\t\t\t\treturn concat(\n\t\t\t\t\t\t...chars.map(char =>\n\t\t\t\t\t\t\tof(char).pipe(\n\t\t\t\t\t\t\t\tdelay(options.typeSpeed),\n\t\t\t\t\t\t\t\ttap(c => {\n\t\t\t\t\t\t\t\t\tconst textNode = this.getTextNode(targetElement)\n\t\t\t\t\t\t\t\t\tif (textNode) {\n\t\t\t\t\t\t\t\t\t\ttextNode.textContent += c\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t// Play key press sound\n\t\t\t\t\t\t\t\t\tif (this.soundEngine) {\n\t\t\t\t\t\t\t\t\t\tthis.soundEngine.playKeyPress()\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t}),\n\t\t\t\t\t\t\t),\n\t\t\t\t\t\t),\n\t\t\t\t\t)\n\t\t\t\t}),\n\t\t\t\t// Pause after typing\n\t\t\t\tof(null).pipe(delay(options.pauseDuration)),\n\t\t\t\t// Delete each character (only if shouldDelete is true)\n\t\t\t\tshouldDelete\n\t\t\t\t\t? defer(() => {\n\t\t\t\t\t\t\tconst deleteCount = phrase.length\n\t\t\t\t\t\t\treturn interval(options.deleteSpeed).pipe(\n\t\t\t\t\t\t\t\ttake(deleteCount),\n\t\t\t\t\t\t\t\ttap(() => {\n\t\t\t\t\t\t\t\t\tconst textNode = this.getTextNode(targetElement)\n\t\t\t\t\t\t\t\t\tif (textNode && textNode.textContent) {\n\t\t\t\t\t\t\t\t\t\ttextNode.textContent = textNode.textContent.slice(0, -1)\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t// Play delete sound\n\t\t\t\t\t\t\t\t\tif (this.soundEngine) {\n\t\t\t\t\t\t\t\t\t\tthis.soundEngine.playDelete()\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t}),\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t})\n\t\t\t\t\t: EMPTY,\n\t\t\t\t// Small pause before next phrase\n\t\t\t\tshouldDelete ? of(null).pipe(delay(200)) : EMPTY,\n\t\t\t)\n\t\t}\n\n\t\t// Create observable that cycles through all phrases\n\t\tconst phrasesSequence = concat(...phrases.map(phrase => typePhrase(phrase)))\n\n\t\t// Add final message if provided\n\t\tconst typingSequence = options.finalMessage\n\t\t\t? concat(\n\t\t\t\t\tphrasesSequence,\n\t\t\t\t\ttypePhrase(options.finalMessage, false), // Don't delete final message\n\t\t\t\t)\n\t\t\t: phrasesSequence\n\n\t\t// Subscribe and optionally loop\n\t\tthis.state.subscription = (options.loop ? phrasesSequence.pipe(repeat()) : typingSequence).subscribe({\n\t\t\terror: err => console.error('Typewriter error:', err),\n\t\t})\n\t}\n\n\tprivate getTextNode(targetElement: HTMLElement): Text | null {\n\t\t// Get or create text node (ignoring cursor element)\n\t\tfor (const child of Array.from(targetElement.childNodes)) {\n\t\t\tif (child.nodeType === Node.TEXT_NODE) {\n\t\t\t\treturn child as Text\n\t\t\t}\n\t\t}\n\t\t// Create text node if it doesn't exist\n\t\tconst textNode = document.createTextNode('')\n\t\ttargetElement.insertBefore(textNode, targetElement.firstChild)\n\t\treturn textNode\n\t}\n\n\tprivate cleanup() {\n\t\tif (!this.state) return\n\n\t\t// Unsubscribe from typing observable\n\t\tif (this.state.subscription) {\n\t\t\tthis.state.subscription.unsubscribe()\n\t\t}\n\n\t\t// Remove cursor if present\n\t\tif (this.state.targetElement) {\n\t\t\tconst cursor = this.state.targetElement.querySelector('.typewriter-cursor')\n\t\t\tcursor?.remove()\n\t\t}\n\n\t\t// Cleanup sound engine\n\t\tif (this.soundEngine) {\n\t\t\tthis.soundEngine.cleanup()\n\t\t\tthis.soundEngine = null\n\t\t}\n\n\t\tthis.state = null\n\t}\n\n\toverride disconnected() {\n\t\tthis.cleanup()\n\t}\n\n\toverride reconnected(): void {\n\t\t// Re-start typing if state exists\n\t\tif (this.state && !this.state.subscription) {\n\t\t\tthis.startTyping()\n\t\t}\n\t}\n}\n\nexport const typewriter = directive(TypewriterDirective)\n"],"mappings":"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"}

package/dist/typewriter.js.map

@@ -1 +1 @@
-{"version":3,"file":"typewriter.js","names":[],"sources":["../src/typewriter/typewriter.directive.ts"],"sourcesContent":["/**\n * Typewriter Directive - RxJS-based typing animation\n *\n * Creates a smooth typewriter effect with automatic cycling through phrases.\n * Uses RxJS for precise timing and clean reactive patterns.\n *\n * @example\n * ```ts\n * // Simple cycling through words\n * html`<div ${typewriter(['Trustless', 'Permissionless', 'Transparent'])}>\n *   <span class=\"typed\"></span>\n * </div>`\n *\n * // Custom speeds and pauses\n * html`<div ${typewriter(['Fast', 'Typing'], { typeSpeed: 50, pauseDuration: 1000 })}>\n *   <span class=\"typed\"></span>\n * </div>`\n *\n * // One-time typing (no loop)\n * html`<div ${typewriter(['Hello World'], { loop: false })}>\n *   <span class=\"typed\"></span>\n * </div>`\n * ```\n */\n\nimport type { ElementPart } from 'lit'\nimport { noChange } from 'lit'\nimport { AsyncDirective, directive } from 'lit/async-directive.js'\nimport { concat, defer, EMPTY, interval, of, Subscription } from 'rxjs'\nimport { delay, repeat, take, tap } from 'rxjs/operators'\n\nexport interface TypewriterOptions {\n\ttypeSpeed?: number // Speed of typing (ms per character)\n\tdeleteSpeed?: number // Speed of deleting (ms per character)\n\tpauseDuration?: number // Pause after typing before deleting (ms)\n\tloop?: boolean // Whether to loop through phrases\n\tselector?: string // CSS selector for target element (default: '.typed')\n\tcursor?: boolean // Show cursor\n\tfinalMessage?: string // Message to display after cycling completes\n\tsound?: boolean // Play typewriter sounds (default: true)\n\tvolume?: number // Sound volume (0-1, default: 0.3)\n}\n\ninterface TypewriterState {\n\tphrases: string[]\n\toptions: Required<TypewriterOptions>\n\telement?: HTMLElement\n\ttargetElement?: HTMLElement\n\tsubscription?: Subscription\n\taudioContext?: AudioContext\n}\n\n// Typewriter sound generator using Web Audio API\nclass TypewriterSound {\n\tprivate audioContext: AudioContext\n\tprivate volume: number\n\n\tconstructor(volume: number = 0.3) {\n\t\tthis.audioContext = new AudioContext()\n\t\tthis.volume = Math.max(0, Math.min(1, volume))\n\t}\n\n\t// Generate cute, soft typing sound - like a gentle \"pop\"\n\tplayKeyPress() {\n\t\tconst now = this.audioContext.currentTime\n\n\t\t// Higher, softer main tone - more \"pop\" than \"clack\"\n\t\tconst osc = this.audioContext.createOscillator()\n\t\tconst gainNode = this.audioContext.createGain()\n\n\t\t// Higher base frequency for cute sound + randomness\n\t\tconst baseFreq = 800 + Math.random() * 200\n\t\tosc.frequency.setValueAtTime(baseFreq, now)\n\t\tosc.type = 'sine' // Smoother, rounder sound\n\n\t\t// Gentler attack, quick but soft\n\t\tgainNode.gain.setValueAtTime(0, now)\n\t\tgainNode.gain.linearRampToValueAtTime(this.volume * 0.2, now + 0.005)\n\t\tgainNode.gain.exponentialRampToValueAtTime(0.001, now + 0.03)\n\n\t\tosc.connect(gainNode)\n\t\tgainNode.connect(this.audioContext.destination)\n\n\t\tosc.start(now)\n\t\tosc.stop(now + 0.03)\n\n\t\t// Add a cute high \"bleep\" for character\n\t\tconst bleepOsc = this.audioContext.createOscillator()\n\t\tconst bleepGain = this.audioContext.createGain()\n\n\t\tbleepOsc.frequency.setValueAtTime(1800 + Math.random() * 400, now)\n\t\tbleepOsc.type = 'sine'\n\n\t\tbleepGain.gain.setValueAtTime(0, now)\n\t\tbleepGain.gain.linearRampToValueAtTime(this.volume * 0.08, now + 0.003)\n\t\tbleepGain.gain.exponentialRampToValueAtTime(0.001, now + 0.015)\n\n\t\tbleepOsc.connect(bleepGain)\n\t\tbleepGain.connect(this.audioContext.destination)\n\n\t\tbleepOsc.start(now)\n\t\tbleepOsc.stop(now + 0.015)\n\t}\n\n\t// Softer \"whoosh\" sound for deletion - like erasing\n\tplayDelete() {\n\t\tconst now = this.audioContext.currentTime\n\n\t\tconst osc = this.audioContext.createOscillator()\n\t\tconst gainNode = this.audioContext.createGain()\n\n\t\t// Descending pitch for \"erasing\" feel\n\t\tosc.frequency.setValueAtTime(600, now)\n\t\tosc.frequency.exponentialRampToValueAtTime(200, now + 0.04)\n\t\tosc.type = 'sine'\n\n\t\tgainNode.gain.setValueAtTime(0, now)\n\t\tgainNode.gain.linearRampToValueAtTime(this.volume * 0.12, now + 0.005)\n\t\tgainNode.gain.exponentialRampToValueAtTime(0.001, now + 0.04)\n\n\t\tosc.connect(gainNode)\n\t\tgainNode.connect(this.audioContext.destination)\n\n\t\tosc.start(now)\n\t\tosc.stop(now + 0.04)\n\t}\n\n\tcleanup() {\n\t\tthis.audioContext.close()\n\t}\n}\n\nclass TypewriterDirective extends AsyncDirective {\n\tprivate state: TypewriterState | null = null\n\tprivate soundEngine: TypewriterSound | null = null\n\n\trender(_phrases: string[], _options: TypewriterOptions = {}) {\n\t\treturn noChange\n\t}\n\n\toverride update(\n\t\tpart: ElementPart,\n\t\t[phrases, options = {}]: [string[], TypewriterOptions]\n\t) {\n\t\tconst element = part.element as HTMLElement\n\n\t\t// Clean up if params changed\n\t\tif (\n\t\t\tthis.state &&\n\t\t\t(JSON.stringify(this.state.phrases) !== JSON.stringify(phrases) ||\n\t\t\t\tJSON.stringify(this.state.options) !== JSON.stringify(options))\n\t\t) {\n\t\t\tthis.cleanup()\n\t\t}\n\n\t\t// Initialize state\n\t\tif (!this.state) {\n\t\t\tconst defaultOptions: Required<TypewriterOptions> = {\n\t\t\t\ttypeSpeed: 50,\n\t\t\t\tdeleteSpeed: 30,\n\t\t\t\tpauseDuration: 1500,\n\t\t\t\tloop: true,\n\t\t\t\tselector: '.typed',\n\t\t\t\tcursor: false,\n\t\t\t\tfinalMessage: '',\n\t\t\t\tsound: true,\n\t\t\t\tvolume: 0.08,\n\t\t\t}\n\n\t\t\tthis.state = {\n\t\t\t\tphrases,\n\t\t\t\toptions: { ...defaultOptions, ...options },\n\t\t\t\telement,\n\t\t\t}\n\n\t\t\t// Initialize sound engine if enabled\n\t\t\tif (this.state.options.sound) {\n\t\t\t\tthis.soundEngine = new TypewriterSound(this.state.options.volume)\n\t\t\t}\n\n\t\t\t// Find target element\n\t\t\tthis.state.targetElement = element.querySelector<HTMLElement>(\n\t\t\t\tthis.state.options.selector\n\t\t\t) ?? undefined\n\n\t\t\tif (!this.state.targetElement) {\n\t\t\t\tconsole.warn(\n\t\t\t\t\t`Typewriter: Target element \"${this.state.options.selector}\" not found`\n\t\t\t\t)\n\t\t\t\treturn noChange\n\t\t\t}\n\n\t\t\t// Add cursor if enabled\n\t\t\tif (this.state.options.cursor) {\n\t\t\t\tthis.state.targetElement.style.position = 'relative'\n\t\t\t\tthis.state.targetElement.style.display = 'inline-block'\n\t\t\t\tconst cursor = document.createElement('span')\n\t\t\t\tcursor.className = 'typewriter-cursor'\n\t\t\t\tcursor.textContent = '|'\n\t\t\t\tcursor.style.cssText = `\n\t\t\t\t\tdisplay: inline-block;\n\t\t\t\t\tmargin-left: 2px;\n\t\t\t\t\tanimation: typewriter-blink 1s step-end infinite;\n\t\t\t\t`\n\t\t\t\tthis.state.targetElement.appendChild(cursor)\n\n\t\t\t\t// Add blink animation if not already present\n\t\t\t\tif (!document.getElementById('typewriter-styles')) {\n\t\t\t\t\tconst style = document.createElement('style')\n\t\t\t\t\tstyle.id = 'typewriter-styles'\n\t\t\t\t\tstyle.textContent = `\n\t\t\t\t\t\t@keyframes typewriter-blink {\n\t\t\t\t\t\t\t0%, 50% { opacity: 1; }\n\t\t\t\t\t\t\t51%, 100% { opacity: 0; }\n\t\t\t\t\t\t}\n\t\t\t\t\t`\n\t\t\t\t\tdocument.head.appendChild(style)\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tthis.startTyping()\n\t\t}\n\n\t\treturn noChange\n\t}\n\n\tprivate startTyping() {\n\t\tif (!this.state || !this.state.targetElement) return\n\n\t\tconst { phrases, options, targetElement } = this.state\n\n\t\t// Create typing observable for a single phrase\n\t\tconst typePhrase = (phrase: string, shouldDelete: boolean = true) => {\n\t\t\treturn concat(\n\t\t\t\t// Type each character\n\t\t\t\tdefer(() => {\n\t\t\t\t\tconst chars = phrase.split('')\n\t\t\t\t\treturn concat(\n\t\t\t\t\t\t...chars.map((char) =>\n\t\t\t\t\t\t\tof(char).pipe(\n\t\t\t\t\t\t\t\tdelay(options.typeSpeed),\n\t\t\t\t\t\t\t\ttap((c) => {\n\t\t\t\t\t\t\t\t\tconst textNode = this.getTextNode(targetElement)\n\t\t\t\t\t\t\t\t\tif (textNode) {\n\t\t\t\t\t\t\t\t\t\ttextNode.textContent += c\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t// Play key press sound\n\t\t\t\t\t\t\t\t\tif (this.soundEngine) {\n\t\t\t\t\t\t\t\t\t\tthis.soundEngine.playKeyPress()\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t})\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t)\n\t\t\t\t\t)\n\t\t\t\t}),\n\t\t\t\t// Pause after typing\n\t\t\t\tof(null).pipe(delay(options.pauseDuration)),\n\t\t\t\t// Delete each character (only if shouldDelete is true)\n\t\t\t\tshouldDelete ? defer(() => {\n\t\t\t\t\tconst deleteCount = phrase.length\n\t\t\t\t\treturn interval(options.deleteSpeed).pipe(\n\t\t\t\t\t\ttake(deleteCount),\n\t\t\t\t\t\ttap(() => {\n\t\t\t\t\t\t\tconst textNode = this.getTextNode(targetElement)\n\t\t\t\t\t\t\tif (textNode && textNode.textContent) {\n\t\t\t\t\t\t\t\ttextNode.textContent = textNode.textContent.slice(0, -1)\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t// Play delete sound\n\t\t\t\t\t\t\tif (this.soundEngine) {\n\t\t\t\t\t\t\t\tthis.soundEngine.playDelete()\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t})\n\t\t\t\t\t)\n\t\t\t\t}) : EMPTY,\n\t\t\t\t// Small pause before next phrase\n\t\t\t\tshouldDelete ? of(null).pipe(delay(200)) : EMPTY\n\t\t\t)\n\t\t}\n\n\t\t// Create observable that cycles through all phrases\n\t\tconst phrasesSequence = concat(\n\t\t\t...phrases.map((phrase) => typePhrase(phrase))\n\t\t)\n\n\t\t// Add final message if provided\n\t\tconst typingSequence = options.finalMessage\n\t\t\t? concat(\n\t\t\t\t\tphrasesSequence,\n\t\t\t\t\ttypePhrase(options.finalMessage, false) // Don't delete final message\n\t\t\t\t)\n\t\t\t: phrasesSequence\n\n\t\t// Subscribe and optionally loop\n\t\tthis.state.subscription = (\n\t\t\toptions.loop ? phrasesSequence.pipe(repeat()) : typingSequence\n\t\t).subscribe({\n\t\t\terror: (err) => console.error('Typewriter error:', err),\n\t\t})\n\t}\n\n\tprivate getTextNode(targetElement: HTMLElement): Text | null {\n\t\t// Get or create text node (ignoring cursor element)\n\t\tfor (const child of Array.from(targetElement.childNodes)) {\n\t\t\tif (child.nodeType === Node.TEXT_NODE) {\n\t\t\t\treturn child as Text\n\t\t\t}\n\t\t}\n\t\t// Create text node if it doesn't exist\n\t\tconst textNode = document.createTextNode('')\n\t\ttargetElement.insertBefore(textNode, targetElement.firstChild)\n\t\treturn textNode\n\t}\n\n\tprivate cleanup() {\n\t\tif (!this.state) return\n\n\t\t// Unsubscribe from typing observable\n\t\tif (this.state.subscription) {\n\t\t\tthis.state.subscription.unsubscribe()\n\t\t}\n\n\t\t// Remove cursor if present\n\t\tif (this.state.targetElement) {\n\t\t\tconst cursor = this.state.targetElement.querySelector('.typewriter-cursor')\n\t\t\tcursor?.remove()\n\t\t}\n\n\t\t// Cleanup sound engine\n\t\tif (this.soundEngine) {\n\t\t\tthis.soundEngine.cleanup()\n\t\t\tthis.soundEngine = null\n\t\t}\n\n\t\tthis.state = null\n\t}\n\n\toverride disconnected() {\n\t\tthis.cleanup()\n\t}\n\n\toverride reconnected(): void {\n\t\t// Re-start typing if state exists\n\t\tif (this.state && !this.state.subscription) {\n\t\t\tthis.startTyping()\n\t\t}\n\t}\n}\n\nexport const typewriter = directive(TypewriterDirective)\n"],"mappings":";;;;AAqDA,IAAM,IAAN,MAAA;CAIC,YAAY,IAAiB,IAAA;EAC5B,KAAK,eAAe,IAAI,aAAA,GACxB,KAAK,SAAS,KAAK,IAAI,GAAG,KAAK,IAAI,GAAG,CAAA,CAAA;CACvC;CAGA,eAAA;EACC,IAAM,IAAM,KAAK,aAAa,aAGxB,IAAM,KAAK,aAAa,iBAAA,GACxB,IAAW,KAAK,aAAa,WAAA,GAG7B,IAAW,MAAsB,MAAhB,KAAK,OAAA;EAC5B,EAAI,UAAU,eAAe,GAAU,CAAA,GACvC,EAAI,OAAO,QAGX,EAAS,KAAK,eAAe,GAAG,CAAA,GAChC,EAAS,KAAK,wBAAsC,KAAd,KAAK,QAAc,IAAM,IAAA,GAC/D,EAAS,KAAK,6BAA6B,MAAO,IAAM,GAAA,GAExD,EAAI,QAAQ,CAAA,GACZ,EAAS,QAAQ,KAAK,aAAa,WAAA,GAEnC,EAAI,MAAM,CAAA,GACV,EAAI,KAAK,IAAM,GAAA;EAGf,IAAM,IAAW,KAAK,aAAa,iBAAA,GAC7B,IAAY,KAAK,aAAa,WAAA;EAEpC,EAAS,UAAU,eAAe,OAAuB,MAAhB,KAAK,OAAA,GAAgB,CAAA,GAC9D,EAAS,OAAO,QAEhB,EAAU,KAAK,eAAe,GAAG,CAAA,GACjC,EAAU,KAAK,wBAAsC,MAAd,KAAK,QAAe,IAAM,IAAA,GACjE,EAAU,KAAK,6BAA6B,MAAO,IAAM,IAAA,GAEzD,EAAS,QAAQ,CAAA,GACjB,EAAU,QAAQ,KAAK,aAAa,WAAA,GAEpC,EAAS,MAAM,CAAA,GACf,EAAS,KAAK,IAAM,IAAA;CACrB;CAGA,aAAA;EACC,IAAM,IAAM,KAAK,aAAa,aAExB,IAAM,KAAK,aAAa,iBAAA,GACxB,IAAW,KAAK,aAAa,WAAA;EAGnC,EAAI,UAAU,eAAe,KAAK,CAAA,GAClC,EAAI,UAAU,6BAA6B,KAAK,IAAM,GAAA,GACtD,EAAI,OAAO,QAEX,EAAS,KAAK,eAAe,GAAG,CAAA,GAChC,EAAS,KAAK,wBAAsC,MAAd,KAAK,QAAe,IAAM,IAAA,GAChE,EAAS,KAAK,6BAA6B,MAAO,IAAM,GAAA,GAExD,EAAI,QAAQ,CAAA,GACZ,EAAS,QAAQ,KAAK,aAAa,WAAA,GAEnC,EAAI,MAAM,CAAA,GACV,EAAI,KAAK,IAAM,GAAA;CAChB;CAEA,UAAA;EACC,KAAK,aAAa,MAAA;CACnB;AAAA,GA2NY,IAAa,EAxN1B,cAAkC,EAAA;CAAA,YAAA,GAAA,GAAA;EAAA,MAAA,GAAA,CAAA,GAAA,KAAA,QACO,MAAA,KAAA,cACM;CAAA;CAE9C,OAAO,GAAoB,IAA8B,CAAC,GAAA;EACzD,OAAO;CACR;CAEA,OACC,GAAA,CACC,GAAS,IAAU,CAAC,IAAA;EAErB,IAAM,IAAU,EAAK;EAYrB,IAAA,CARC,KAAK,SACJ,KAAK,UAAU,KAAK,MAAM,OAAA,MAAa,KAAK,UAAU,CAAA,KACtD,KAAK,UAAU,KAAK,MAAM,OAAA,MAAa,KAAK,UAAU,CAAA,KAEvD,KAAK,QAAA,GAAA,CAID,KAAK,OAAO;GAChB,IAAM,IAA8C;IACnD,WAAW;IACX,aAAa;IACb,eAAe;IACf,MAAA,CAAM;IACN,UAAU;IACV,QAAA,CAAQ;IACR,cAAc;IACd,OAAA,CAAO;IACP,QAAQ;GAAA;GAmBT,IAhBA,KAAK,QAAQ;IACZ,SAAA;IACA,SAAS;KAAA,GAAK;KAAA,GAAmB;IAAA;IACjC,SAAA;GAAA,GAIG,KAAK,MAAM,QAAQ,UACtB,KAAK,cAAc,IAAI,EAAgB,KAAK,MAAM,QAAQ,MAAA,IAI3D,KAAK,MAAM,gBAAgB,EAAQ,cAClC,KAAK,MAAM,QAAQ,QAAA,KAAA,KACf,GAAA,CAEA,KAAK,MAAM,eAIf,OAAO;GAIR,IAAI,KAAK,MAAM,QAAQ,QAAQ;IAC9B,KAAK,MAAM,cAAc,MAAM,WAAW,YAC1C,KAAK,MAAM,cAAc,MAAM,UAAU;IACzC,IAAM,IAAS,SAAS,cAAc,MAAA;IAWtC,IAVA,EAAO,YAAY,qBACnB,EAAO,cAAc,KACrB,EAAO,MAAM,UAAU,uHAKvB,KAAK,MAAM,cAAc,YAAY,CAAA,GAAA,CAGhC,SAAS,eAAe,mBAAA,GAAsB;KAClD,IAAM,IAAQ,SAAS,cAAc,OAAA;KACrC,EAAM,KAAK,qBACX,EAAM,cAAc,2HAMpB,SAAS,KAAK,YAAY,CAAA;IAC3B;GACD;GAEA,KAAK,YAAA;EACN;EAEA,OAAO;CACR;CAEA,cAAA;EACC,IAAA,CAAK,KAAK,SAAA,CAAU,KAAK,MAAM,eAAe;EAE9C,IAAA,EAAM,SAAE,GAAA,SAAS,GAAA,eAAS,MAAkB,KAAK,OAG3C,KAAc,GAAgB,IAAA,CAAwB,MACpD,EAEN,QAEQ,EAAA,GADO,EAAO,MAAM,EAAA,EAEjB,KAAK,MACb,EAAG,CAAA,EAAM,KACR,EAAM,EAAQ,SAAA,GACd,GAAK,MAAA;GACJ,IAAM,IAAW,KAAK,YAAY,CAAA;GAC9B,MACH,EAAS,eAAe,IAGrB,KAAK,eACR,KAAK,YAAY,aAAA;EAAA,CAAA,CAAA,CAAA,CAAA,CAAA,GAQvB,EAAG,IAAA,EAAM,KAAK,EAAM,EAAQ,aAAA,CAAA,GAE5B,IAAe,QAAA;GACd,IAAM,IAAc,EAAO;GAC3B,OAAO,EAAS,EAAQ,WAAA,EAAa,KACpC,EAAK,CAAA,GACL,QAAA;IACC,IAAM,IAAW,KAAK,YAAY,CAAA;IAC9B,KAAY,EAAS,gBACxB,EAAS,cAAc,EAAS,YAAY,MAAM,GAAA,EAAG,IAGlD,KAAK,eACR,KAAK,YAAY,WAAA;GAAA,CAAA,CAAA;EAAA,CAAA,IAIhB,GAEL,IAAe,EAAG,IAAA,EAAM,KAAK,EAAM,GAAA,CAAA,IAAQ,CAAA,GAKvC,IAAkB,EAAA,GACpB,EAAQ,KAAK,MAAW,EAAW,CAAA,CAAA,CAAA,GAIjC,IAAiB,EAAQ,eAC5B,EACA,GACA,EAAW,EAAQ,cAAA,CAAc,CAAA,CAAA,IAEjC;EAGH,KAAK,MAAM,gBACV,EAAQ,OAAO,EAAgB,KAAK,EAAA,CAAA,IAAY,GAC/C,UAAU,EACX,QAAQ,MAAA,CAAA,EAAA,CAAA;CAEV;CAEA,YAAoB,GAAA;EAEnB,KAAK,IAAM,KAAS,MAAM,KAAK,EAAc,UAAA,GAC5C,IAAI,EAAM,aAAa,KAAK,WAC3B,OAAO;EAIT,IAAM,IAAW,SAAS,eAAe,EAAA;EAEzC,OADA,EAAc,aAAa,GAAU,EAAc,UAAA,GAC5C;CACR;CAEA,UAAA;EACM,AAmBL,KAAK,WAhBD,KAAK,MAAM,gBACd,KAAK,MAAM,aAAa,YAAA,GAIrB,KAAK,MAAM,iBAEd,KADoB,MAAM,cAAc,cAAc,oBAAA,GAC9C,OAAA,GAIL,AAEH,KAAK,iBADL,KAAK,YAAY,QAAA,GACE,OAGP;CACd;CAEA,eAAA;EACC,KAAK,QAAA;CACN;CAEA,cAAA;EAEK,KAAK,SAAA,CAAU,KAAK,MAAM,gBAC7B,KAAK,YAAA;CAEP;AAAA,CAAA;AAAA,SAAA,KAAA"}
+{"version":3,"file":"typewriter.js","names":[],"sources":["../src/typewriter/typewriter.directive.ts"],"sourcesContent":["/**\n * Typewriter Directive - RxJS-based typing animation\n *\n * Creates a smooth typewriter effect with automatic cycling through phrases.\n * Uses RxJS for precise timing and clean reactive patterns.\n *\n * @example\n * ```ts\n * // Simple cycling through words\n * html`<div ${typewriter(['Trustless', 'Permissionless', 'Transparent'])}>\n *   <span class=\"typed\"></span>\n * </div>`\n *\n * // Custom speeds and pauses\n * html`<div ${typewriter(['Fast', 'Typing'], { typeSpeed: 50, pauseDuration: 1000 })}>\n *   <span class=\"typed\"></span>\n * </div>`\n *\n * // One-time typing (no loop)\n * html`<div ${typewriter(['Hello World'], { loop: false })}>\n *   <span class=\"typed\"></span>\n * </div>`\n * ```\n */\n\nimport type { ElementPart } from 'lit'\nimport { noChange } from 'lit'\nimport { AsyncDirective, directive } from 'lit/async-directive.js'\nimport { concat, defer, EMPTY, interval, of, Subscription } from 'rxjs'\nimport { delay, repeat, take, tap } from 'rxjs/operators'\n\nexport interface TypewriterOptions {\n\ttypeSpeed?: number // Speed of typing (ms per character)\n\tdeleteSpeed?: number // Speed of deleting (ms per character)\n\tpauseDuration?: number // Pause after typing before deleting (ms)\n\tloop?: boolean // Whether to loop through phrases\n\tselector?: string // CSS selector for target element (default: '.typed')\n\tcursor?: boolean // Show cursor\n\tfinalMessage?: string // Message to display after cycling completes\n\tsound?: boolean // Play typewriter sounds (default: true)\n\tvolume?: number // Sound volume (0-1, default: 0.3)\n}\n\ninterface TypewriterState {\n\tphrases: string[]\n\toptions: Required<TypewriterOptions>\n\telement?: HTMLElement\n\ttargetElement?: HTMLElement\n\tsubscription?: Subscription\n\taudioContext?: AudioContext\n}\n\n// Typewriter sound generator using Web Audio API\nclass TypewriterSound {\n\tprivate audioContext: AudioContext\n\tprivate volume: number\n\n\tconstructor(volume: number = 0.3) {\n\t\tthis.audioContext = new AudioContext()\n\t\tthis.volume = Math.max(0, Math.min(1, volume))\n\t}\n\n\t// Generate cute, soft typing sound - like a gentle \"pop\"\n\tplayKeyPress() {\n\t\tconst now = this.audioContext.currentTime\n\n\t\t// Higher, softer main tone - more \"pop\" than \"clack\"\n\t\tconst osc = this.audioContext.createOscillator()\n\t\tconst gainNode = this.audioContext.createGain()\n\n\t\t// Higher base frequency for cute sound + randomness\n\t\tconst baseFreq = 800 + Math.random() * 200\n\t\tosc.frequency.setValueAtTime(baseFreq, now)\n\t\tosc.type = 'sine' // Smoother, rounder sound\n\n\t\t// Gentler attack, quick but soft\n\t\tgainNode.gain.setValueAtTime(0, now)\n\t\tgainNode.gain.linearRampToValueAtTime(this.volume * 0.2, now + 0.005)\n\t\tgainNode.gain.exponentialRampToValueAtTime(0.001, now + 0.03)\n\n\t\tosc.connect(gainNode)\n\t\tgainNode.connect(this.audioContext.destination)\n\n\t\tosc.start(now)\n\t\tosc.stop(now + 0.03)\n\n\t\t// Add a cute high \"bleep\" for character\n\t\tconst bleepOsc = this.audioContext.createOscillator()\n\t\tconst bleepGain = this.audioContext.createGain()\n\n\t\tbleepOsc.frequency.setValueAtTime(1800 + Math.random() * 400, now)\n\t\tbleepOsc.type = 'sine'\n\n\t\tbleepGain.gain.setValueAtTime(0, now)\n\t\tbleepGain.gain.linearRampToValueAtTime(this.volume * 0.08, now + 0.003)\n\t\tbleepGain.gain.exponentialRampToValueAtTime(0.001, now + 0.015)\n\n\t\tbleepOsc.connect(bleepGain)\n\t\tbleepGain.connect(this.audioContext.destination)\n\n\t\tbleepOsc.start(now)\n\t\tbleepOsc.stop(now + 0.015)\n\t}\n\n\t// Softer \"whoosh\" sound for deletion - like erasing\n\tplayDelete() {\n\t\tconst now = this.audioContext.currentTime\n\n\t\tconst osc = this.audioContext.createOscillator()\n\t\tconst gainNode = this.audioContext.createGain()\n\n\t\t// Descending pitch for \"erasing\" feel\n\t\tosc.frequency.setValueAtTime(600, now)\n\t\tosc.frequency.exponentialRampToValueAtTime(200, now + 0.04)\n\t\tosc.type = 'sine'\n\n\t\tgainNode.gain.setValueAtTime(0, now)\n\t\tgainNode.gain.linearRampToValueAtTime(this.volume * 0.12, now + 0.005)\n\t\tgainNode.gain.exponentialRampToValueAtTime(0.001, now + 0.04)\n\n\t\tosc.connect(gainNode)\n\t\tgainNode.connect(this.audioContext.destination)\n\n\t\tosc.start(now)\n\t\tosc.stop(now + 0.04)\n\t}\n\n\tcleanup() {\n\t\tthis.audioContext.close()\n\t}\n}\n\nclass TypewriterDirective extends AsyncDirective {\n\tprivate state: TypewriterState | null = null\n\tprivate soundEngine: TypewriterSound | null = null\n\n\trender(_phrases: string[], _options: TypewriterOptions = {}) {\n\t\treturn noChange\n\t}\n\n\toverride update(part: ElementPart, [phrases, options = {}]: [string[], TypewriterOptions]) {\n\t\tconst element = part.element as HTMLElement\n\n\t\t// Clean up if params changed\n\t\tif (\n\t\t\tthis.state &&\n\t\t\t(JSON.stringify(this.state.phrases) !== JSON.stringify(phrases) ||\n\t\t\t\tJSON.stringify(this.state.options) !== JSON.stringify(options))\n\t\t) {\n\t\t\tthis.cleanup()\n\t\t}\n\n\t\t// Initialize state\n\t\tif (!this.state) {\n\t\t\tconst defaultOptions: Required<TypewriterOptions> = {\n\t\t\t\ttypeSpeed: 50,\n\t\t\t\tdeleteSpeed: 30,\n\t\t\t\tpauseDuration: 1500,\n\t\t\t\tloop: true,\n\t\t\t\tselector: '.typed',\n\t\t\t\tcursor: false,\n\t\t\t\tfinalMessage: '',\n\t\t\t\tsound: true,\n\t\t\t\tvolume: 0.08,\n\t\t\t}\n\n\t\t\tthis.state = {\n\t\t\t\tphrases,\n\t\t\t\toptions: { ...defaultOptions, ...options },\n\t\t\t\telement,\n\t\t\t}\n\n\t\t\t// Initialize sound engine if enabled\n\t\t\tif (this.state.options.sound) {\n\t\t\t\tthis.soundEngine = new TypewriterSound(this.state.options.volume)\n\t\t\t}\n\n\t\t\t// Find target element\n\t\t\tthis.state.targetElement = element.querySelector<HTMLElement>(this.state.options.selector) ?? undefined\n\n\t\t\tif (!this.state.targetElement) {\n\t\t\t\tconsole.warn(`Typewriter: Target element \"${this.state.options.selector}\" not found`)\n\t\t\t\treturn noChange\n\t\t\t}\n\n\t\t\t// Add cursor if enabled\n\t\t\tif (this.state.options.cursor) {\n\t\t\t\tthis.state.targetElement.style.position = 'relative'\n\t\t\t\tthis.state.targetElement.style.display = 'inline-block'\n\t\t\t\tconst cursor = document.createElement('span')\n\t\t\t\tcursor.className = 'typewriter-cursor'\n\t\t\t\tcursor.textContent = '|'\n\t\t\t\tcursor.style.cssText = `\n\t\t\t\t\tdisplay: inline-block;\n\t\t\t\t\tmargin-left: 2px;\n\t\t\t\t\tanimation: typewriter-blink 1s step-end infinite;\n\t\t\t\t`\n\t\t\t\tthis.state.targetElement.appendChild(cursor)\n\n\t\t\t\t// Add blink animation if not already present\n\t\t\t\tif (!document.getElementById('typewriter-styles')) {\n\t\t\t\t\tconst style = document.createElement('style')\n\t\t\t\t\tstyle.id = 'typewriter-styles'\n\t\t\t\t\tstyle.textContent = `\n\t\t\t\t\t\t@keyframes typewriter-blink {\n\t\t\t\t\t\t\t0%, 50% { opacity: 1; }\n\t\t\t\t\t\t\t51%, 100% { opacity: 0; }\n\t\t\t\t\t\t}\n\t\t\t\t\t`\n\t\t\t\t\tdocument.head.appendChild(style)\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tthis.startTyping()\n\t\t}\n\n\t\treturn noChange\n\t}\n\n\tprivate startTyping() {\n\t\tif (!this.state || !this.state.targetElement) return\n\n\t\tconst { phrases, options, targetElement } = this.state\n\n\t\t// Create typing observable for a single phrase\n\t\tconst typePhrase = (phrase: string, shouldDelete: boolean = true) => {\n\t\t\treturn concat(\n\t\t\t\t// Type each character\n\t\t\t\tdefer(() => {\n\t\t\t\t\tconst chars = phrase.split('')\n\t\t\t\t\treturn concat(\n\t\t\t\t\t\t...chars.map(char =>\n\t\t\t\t\t\t\tof(char).pipe(\n\t\t\t\t\t\t\t\tdelay(options.typeSpeed),\n\t\t\t\t\t\t\t\ttap(c => {\n\t\t\t\t\t\t\t\t\tconst textNode = this.getTextNode(targetElement)\n\t\t\t\t\t\t\t\t\tif (textNode) {\n\t\t\t\t\t\t\t\t\t\ttextNode.textContent += c\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t// Play key press sound\n\t\t\t\t\t\t\t\t\tif (this.soundEngine) {\n\t\t\t\t\t\t\t\t\t\tthis.soundEngine.playKeyPress()\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t}),\n\t\t\t\t\t\t\t),\n\t\t\t\t\t\t),\n\t\t\t\t\t)\n\t\t\t\t}),\n\t\t\t\t// Pause after typing\n\t\t\t\tof(null).pipe(delay(options.pauseDuration)),\n\t\t\t\t// Delete each character (only if shouldDelete is true)\n\t\t\t\tshouldDelete\n\t\t\t\t\t? defer(() => {\n\t\t\t\t\t\t\tconst deleteCount = phrase.length\n\t\t\t\t\t\t\treturn interval(options.deleteSpeed).pipe(\n\t\t\t\t\t\t\t\ttake(deleteCount),\n\t\t\t\t\t\t\t\ttap(() => {\n\t\t\t\t\t\t\t\t\tconst textNode = this.getTextNode(targetElement)\n\t\t\t\t\t\t\t\t\tif (textNode && textNode.textContent) {\n\t\t\t\t\t\t\t\t\t\ttextNode.textContent = textNode.textContent.slice(0, -1)\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t// Play delete sound\n\t\t\t\t\t\t\t\t\tif (this.soundEngine) {\n\t\t\t\t\t\t\t\t\t\tthis.soundEngine.playDelete()\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t}),\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t})\n\t\t\t\t\t: EMPTY,\n\t\t\t\t// Small pause before next phrase\n\t\t\t\tshouldDelete ? of(null).pipe(delay(200)) : EMPTY,\n\t\t\t)\n\t\t}\n\n\t\t// Create observable that cycles through all phrases\n\t\tconst phrasesSequence = concat(...phrases.map(phrase => typePhrase(phrase)))\n\n\t\t// Add final message if provided\n\t\tconst typingSequence = options.finalMessage\n\t\t\t? concat(\n\t\t\t\t\tphrasesSequence,\n\t\t\t\t\ttypePhrase(options.finalMessage, false), // Don't delete final message\n\t\t\t\t)\n\t\t\t: phrasesSequence\n\n\t\t// Subscribe and optionally loop\n\t\tthis.state.subscription = (options.loop ? phrasesSequence.pipe(repeat()) : typingSequence).subscribe({\n\t\t\terror: err => console.error('Typewriter error:', err),\n\t\t})\n\t}\n\n\tprivate getTextNode(targetElement: HTMLElement): Text | null {\n\t\t// Get or create text node (ignoring cursor element)\n\t\tfor (const child of Array.from(targetElement.childNodes)) {\n\t\t\tif (child.nodeType === Node.TEXT_NODE) {\n\t\t\t\treturn child as Text\n\t\t\t}\n\t\t}\n\t\t// Create text node if it doesn't exist\n\t\tconst textNode = document.createTextNode('')\n\t\ttargetElement.insertBefore(textNode, targetElement.firstChild)\n\t\treturn textNode\n\t}\n\n\tprivate cleanup() {\n\t\tif (!this.state) return\n\n\t\t// Unsubscribe from typing observable\n\t\tif (this.state.subscription) {\n\t\t\tthis.state.subscription.unsubscribe()\n\t\t}\n\n\t\t// Remove cursor if present\n\t\tif (this.state.targetElement) {\n\t\t\tconst cursor = this.state.targetElement.querySelector('.typewriter-cursor')\n\t\t\tcursor?.remove()\n\t\t}\n\n\t\t// Cleanup sound engine\n\t\tif (this.soundEngine) {\n\t\t\tthis.soundEngine.cleanup()\n\t\t\tthis.soundEngine = null\n\t\t}\n\n\t\tthis.state = null\n\t}\n\n\toverride disconnected() {\n\t\tthis.cleanup()\n\t}\n\n\toverride reconnected(): void {\n\t\t// Re-start typing if state exists\n\t\tif (this.state && !this.state.subscription) {\n\t\t\tthis.startTyping()\n\t\t}\n\t}\n}\n\nexport const typewriter = directive(TypewriterDirective)\n"],"mappings":"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"}