Skip to content

Releases: lucidui-dev/lucidui

Lucid UI 0.3.11

Choose a tag to compare

@thisisezra thisisezra released this 16 Oct 00:51

A Lucid component for React, so v0, Lovable, Bolt and any Next.js or React app can run a Lucid UI app inside their own page.

  • New: import { Lucid } from "@lucidui-dev/core/react" and render <Lucid app={App} />. It renders a div with the lucid-app class, mounts the Lucid UI app inside it once the page loads, and stops it when React removes it. Works with React 18 and 19, server rendering and Strict Mode. React stays optional: the core and the bundle never load it.
  • Docs: the agent guide and recipes show the Lucid component for Next.js and v0.

Lucid UI 0.3.10

Choose a tag to compare

@thisisezra thisisezra released this 14 Oct 03:17

Colours that survive Vite.

npm i @lucidui-dev/core@0.3.10
  • Fixed: when Vite 8 minified lucid.css, it rewrote light-dark() into a fallback that only resolves where color-scheme is set, so bundled apps could show black charts and wrong colours. The design tokens now also live on .lucid-app, where color-scheme is set, so every colour resolves in light, dark and per-app themes. Builds that don't rewrite light-dark(), including the CDN files, were never affected.
  • Site: the Charts section on lucidui.dev weighs a bar chart with a tooltip against TanStack Charts 1.1, both built with Vite 8. The benchmark is in bench/charts.

Lucid UI 0.3.9

Choose a tag to compare

@thisisezra thisisezra released this 14 Oct 01:43

Lists that update in place.

npm i @lucidui-dev/core@0.3.9
ul(For({ each: todos, key: todo => todo.id }, (todo, index, live) =>
  li(() => live.value.title)
));
  • Improved: give For's row function a third argument, a signal holding the row's latest item, and read from it. When an item is replaced under the same key, the row stays and only what changed updates. Updating every row of a 1,000-row list is about twice as fast. Two-argument rows behave exactly as before.
  • Changed: the core is 6.2 KB gzipped, up from 6.1 KB.
  • Site: the weigh-in builds the same app with React, Tailwind and shadcn/ui and with Lucid UI, and measures both. The benchmark is in bench/compare.

Lucid UI 0.3.8

Choose a tag to compare

@thisisezra thisisezra released this 13 Oct 08:16

Every SVG tag draws, and every component has an example.

npm i @lucidui-dev/core@0.3.8
h("svg", { viewBox: "0 0 40 40" },
  h("defs", h("filter", { id: "soft" }, h("feGaussianBlur", { stdDeviation: 2 }))),
  h("svg:title", "A soft square"),
  h("rect", { width: 30, height: 30, filter: "url(#soft)" }));
  • Fixed: h() makes any tag the browser doesn't know as HTML into an SVG element, so filters (feGaussianBlur, feDropShadow…), marker, image, desc and animations all draw. Before, anything outside a short list silently showed nothing.
  • New: an html-in-svg diagnostic. a, title, style and script exist in both HTML and SVG; inside an SVG, write h("svg:title") or h("svg:a").
  • New: Examples, every component as a working snippet with its imports. It's generated from the catalog behind lucidui.dev/components, ships as docs/EXAMPLES.md, and is part of llms-full.txt. Tests fail if it falls behind, or if a component ships without an example.
  • New: examples for Spacer and Dot.

Lucid UI 0.3.7

Choose a tag to compare

@thisisezra thisisezra released this 13 Oct 07:50

Style functions that read the way they look, and a finer 1-bit Lisa.

npm i @lucidui-dev/core@0.3.7
h("div", { style: () => ({ left: x.value, top: 4, "--tone": tone.value }) });
  • Fixed: a style function can return an object as well as a CSS string. Numbers get px where CSS needs a unit, and properties it stops returning are cleared. Before, an object was silently dropped.
  • Improved: 1-bit Lisa is fully black and white, including chart series, deltas and shadows, with light grey grids and tracks.
  • Improved: 1-bit Lisa avatars are crisp white with an ink outline, and long lists sit on paper.
  • New in Editions: Lisa Office, a working 1-bit desktop built only with Lucid UI and 1-bit Lisa.
  • Builder: shows which UI kit you're building with, Flagship or 1-bit Lisa, and switches a project either way.

Lucid UI 0.3.6

Choose a tag to compare

@thisisezra thisisezra released this 12 Oct 10:05

1-bit Lisa. A second look for every component: pure black and white, a nod to Apple's Lisa and the first Macintosh. Plus fixes for dialogs on iPhone and charts on small screens.

npm i @lucidui-dev/core@0.3.6
import { lisa } from "@lucidui-dev/core/lisa";   // and @lucidui-dev/core/lisa.css
lisa();
  • New: 1-bit Lisa. Dithered greys, pinstriped windows, outlines that thicken on hover, presses that invert, dialogs that assemble, and the Chicago typeface (ChicagoFLF, public domain). Same components, same API. Try it at lucidui.dev/components and lucidui.dev/lisa.
  • New: maximize and minimize icons, with fullscreen and shrink as aliases.
  • Fixed: dialogs no longer collapse in Safari, and inputs no longer zoom the page on iPhone.
  • Fixed: chart card titles move above their controls when space is tight, and DotCalendar fits a year on a phone.
  • Docs: a guide to putting an app online, and the agent guide now covers claude.ai and ChatGPT through the hosted bridge, and links that open any chatbot's code in Builder.

Lucid UI 0.3.5

Choose a tag to compare

@thisisezra thisisezra released this 07 Oct 08:21

Icons agents can guess. Watching an agent build in Builder showed it reaching for icons that didn't exist. Now the common ones do, and the rest explain themselves.

npm i @lucidui-dev/core@0.3.5
  • New: six icons agents reach for: home, settings, mail, star, heart and eye.
  • New: common words map to the right icon: close, add, edit, delete, gear, email and more.
  • New: an unknown icon name reports unknown-icon with the fix, instead of quietly drawing a placeholder.
  • Docs: every icon name is listed, and there's a new guide to building with an agent, including connecting Claude Code or Cursor to Builder with @lucidui-dev/bridge.

Lucid UI 0.3.4

Choose a tag to compare

@thisisezra thisisezra released this 07 Oct 03:45

Agents always find the right Lucid. Another, unrelated project is also called Lucid UI, and agents that searched the web could land on it. Now every path leads here.

npm i @lucidui-dev/core@0.3.4
  • Improved: the agent brief names the exact package, gives a mirror link, tells the agent not to search the web, and to ask rather than guess.
  • Improved: llms.txt, the API reference and the README say plainly which project this is and how to tell the other one apart.
  • New: llms-full.txt ships in the npm package and this repository, readable from jsDelivr or GitHub when lucidui.dev can't be reached.

Lucid UI 0.3.3

Choose a tag to compare

@thisisezra thisisezra released this 07 Oct 02:36

Whole pages, crafted by default. Ask an agent for a settings page and get a finished one.

npm i @lucidui-dev/core@0.3.3
  • New: AppShell, NavList, Page, Section and SettingRow: sidebars, page headers, grouped cards and label-and-control rows, in light and dark, collapsing for phones.
  • New: Recipes: complete settings, dashboard and list pages built only from Lucid components, also included in llms-full.txt.
  • Improved: the rules agents read now say to build from components, write no CSS for colours or type, and mount once.

Lucid UI 0.3.2

Choose a tag to compare

@thisisezra thisisezra released this 07 Oct 02:32

No browser dialogs, ever. Every menu and dialog in a Lucid UI app is styled, even when an AI agent reaches for the browser's own.

npm i @lucidui-dev/core@0.3.2
  • New: ask() opens a styled confirmation and resolves true or false: if (await ask({ title, confirm, tone: "danger" })) { ... }
  • New: alert() shows a styled toast instead of a browser dialog, and alert, confirm and prompt are reported with the fix.
  • New: diagnostics for native selects and date, time and colour pickers, each pointing to the Lucid component to use.
  • Improved: a plain select inside a Lucid UI app gets a styled menu in browsers that support it.
  • Fixed: dialogs with no body content no longer leave a gap above the buttons.