[frontend] chore: bump dreamland

Author: velzie

dreamlandjs

@@ -11,16 +11,16 @@ export const App: Component = function (cx) {
 		<div id="app">
 			<ThemeVars colors={use(config.theme)} />
 			<Tabs
-				tabs={use(browser.tabs).bind()}
-				activetab={use(browser.activetab).bind()}
+				tabs={use(browser.tabs)}
+				activetab={use(browser.activetab)}
 				addTab={() => {
 					browser.newTab(new URL("puter://newtab"), true);
 				}}
 				destroyTab={(tab: Tab) => {
 					browser.destroyTab(tab);
 				}}
 			/>
-			<Omnibox tab={use(browser.activetab).bind()} />
+			<Omnibox tab={use(browser.activetab)} />
 			{cx.children}
 		</div>
 	);

frontend/src/App.tsx

@@ -190,7 +190,23 @@ export const UrlInput: Component<
 							src={item.favicon || "/vite.svg"}
 							alt="favicon"
 						/>
-						{(item.title && <span class="description">{item.title} - </span>) ||
+						{(item.title && (
+							<span class="description">
+								{item.title.startsWith(this.input.value) ? (
+									<>
+										<span>
+											{item.title.substring(0, this.input.value.length)}
+										</span>
+										<span style="font-weight: normal; opacity: 0.7;">
+											{item.title.substring(this.input.value.length)}
+										</span>
+									</>
+								) : (
+									<span>item.title</span>
+								)}
+								<span>{" - "}</span>
+							</span>
+						)) ||
 							""}
 						<span class="url">{trimUrl(item.url)}</span>
 					</div>
@@ -200,8 +216,8 @@ export const UrlInput: Component<
 				<IconButton icon={iconShield}></IconButton>
 				{use(this.active).andThen(
 					<input
-						this={use(this.input).bind()}
-						value={use(this.value).bind()}
+						this={use(this.input)}
+						value={use(this.value)}
 						on:keydown={(e: KeyboardEvent) => {
 							if (e.key === "ArrowDown") {
 								e.preventDefault();

frontend/src/components/Omnibox.tsx

@@ -451,8 +451,8 @@ export const Tabs: Component<
 	let tabcache = {};
 
 	return (
-		<div this={use(this.container).bind()}>
-			<div class="extra left" this={use(this.leftEl).bind()}></div>
+		<div this={use(this.container)}>
+			<div class="extra left" this={use(this.leftEl)}></div>
 			{use(this.tabs).mapEach((tab) =>
 				memoize(
 					() => (
@@ -471,10 +471,10 @@ export const Tabs: Component<
 					tabcache
 				)
 			)}
-			<div class="extra after" this={use(this.afterEl).bind()}>
+			<div class="extra after" this={use(this.afterEl)}>
 				<IconButton icon={iconAdd} click={this.addTab}></IconButton>
 			</div>
-			<div class="extra right" this={use(this.rightEl).bind()}></div>
+			<div class="extra right" this={use(this.rightEl)}></div>
 		</div>
 	);
 };