@exponential-at/ui-solid 0.0.0-stage → 0.1.0

package/LICENSE

@@ -0,0 +1,201 @@
+                                 Apache License
+                           Version 2.0, January 2004
+                        http://www.apache.org/licenses/
+
+   TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
+
+   1. Definitions.
+
+      "License" shall mean the terms and conditions for use, reproduction,
+      and distribution as defined by Sections 1 through 9 of this document.
+
+      "Licensor" shall mean the copyright owner or entity authorized by
+      the copyright owner that is granting the License.
+
+      "Legal Entity" shall mean the union of the acting entity and all
+      other entities that control, are controlled by, or are under common
+      control with that entity. For the purposes of this definition,
+      "control" means (i) the power, direct or indirect, to cause the
+      direction or management of such entity, whether by contract or
+      otherwise, or (ii) ownership of fifty percent (50%) or more of the
+      outstanding shares, or (iii) beneficial ownership of such entity.
+
+      "You" (or "Your") shall mean an individual or Legal Entity
+      exercising permissions granted by this License.
+
+      "Source" form shall mean the preferred form for making modifications,
+      including but not limited to software source code, documentation
+      source, and configuration files.
+
+      "Object" form shall mean any form resulting from mechanical
+      transformation or translation of a Source form, including but
+      not limited to compiled object code, generated documentation,
+      and conversions to other media types.
+
+      "Work" shall mean the work of authorship, whether in Source or
+      Object form, made available under the License, as indicated by a
+      copyright notice that is included in or attached to the work
+      (an example is provided in the Appendix below).
+
+      "Derivative Works" shall mean any work, whether in Source or Object
+      form, that is based on (or derived from) the Work and for which the
+      editorial revisions, annotations, elaborations, or other modifications
+      represent, as a whole, an original work of authorship. For the purposes
+      of this License, Derivative Works shall not include works that remain
+      separable from, or merely link (or bind by name) to the interfaces of,
+      the Work and Derivative Works thereof.
+
+      "Contribution" shall mean any work of authorship, including
+      the original version of the Work and any modifications or additions
+      to that Work or Derivative Works thereof, that is intentionally
+      submitted to Licensor for inclusion in the Work by the copyright owner
+      or by an individual or Legal Entity authorized to submit on behalf of
+      the copyright owner. For the purposes of this definition, "submitted"
+      means any form of electronic, verbal, or written communication sent
+      to the Licensor or its representatives, including but not limited to
+      communication on electronic mailing lists, source code control systems,
+      and issue tracking systems that are managed by, or on behalf of, the
+      Licensor for the purpose of discussing and improving the Work, but
+      excluding communication that is conspicuously marked or otherwise
+      designated in writing by the copyright owner as "Not a Contribution."
+
+      "Contributor" shall mean Licensor and any individual or Legal Entity
+      on behalf of whom a Contribution has been received by Licensor and
+      subsequently incorporated within the Work.
+
+   2. Grant of Copyright License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      copyright license to reproduce, prepare Derivative Works of,
+      publicly display, publicly perform, sublicense, and distribute the
+      Work and such Derivative Works in Source or Object form.
+
+   3. Grant of Patent License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      (except as stated in this section) patent license to make, have made,
+      use, offer to sell, sell, import, and otherwise transfer the Work,
+      where such license applies only to those patent claims licensable
+      by such Contributor that are necessarily infringed by their
+      Contribution(s) alone or by combination of their Contribution(s)
+      with the Work to which such Contribution(s) was submitted. If You
+      institute patent litigation against any entity (including a
+      cross-claim or counterclaim in a lawsuit) alleging that the Work
+      or a Contribution incorporated within the Work constitutes direct
+      or contributory patent infringement, then any patent licenses
+      granted to You under this License for that Work shall terminate
+      as of the date such litigation is filed.
+
+   4. Redistribution. You may reproduce and distribute copies of the
+      Work or Derivative Works thereof in any medium, with or without
+      modifications, and in Source or Object form, provided that You
+      meet the following conditions:
+
+      (a) You must give any other recipients of the Work or
+          Derivative Works a copy of this License; and
+
+      (b) You must cause any modified files to carry prominent notices
+          stating that You changed the files; and
+
+      (c) You must retain, in the Source form of any Derivative Works
+          that You distribute, all copyright, patent, trademark, and
+          attribution notices from the Source form of the Work,
+          excluding those notices that do not pertain to any part of
+          the Derivative Works; and
+
+      (d) If the Work includes a "NOTICE" text file as part of its
+          distribution, then any Derivative Works that You distribute must
+          include a readable copy of the attribution notices contained
+          within such NOTICE file, excluding those notices that do not
+          pertain to any part of the Derivative Works, in at least one
+          of the following places: within a NOTICE text file distributed
+          as part of the Derivative Works; within the Source form or
+          documentation, if provided along with the Derivative Works; or,
+          within a display generated by the Derivative Works, if and
+          wherever such third-party notices normally appear. The contents
+          of the NOTICE file are for informational purposes only and
+          do not modify the License. You may add Your own attribution
+          notices within Derivative Works that You distribute, alongside
+          or as an addendum to the NOTICE text from the Work, provided
+          that such additional attribution notices cannot be construed
+          as modifying the License.
+
+      You may add Your own copyright statement to Your modifications and
+      may provide additional or different license terms and conditions
+      for use, reproduction, or distribution of Your modifications, or
+      for any such Derivative Works as a whole, provided Your use,
+      reproduction, and distribution of the Work otherwise complies with
+      the conditions stated in this License.
+
+   5. Submission of Contributions. Unless You explicitly state otherwise,
+      any Contribution intentionally submitted for inclusion in the Work
+      by You to the Licensor shall be under the terms and conditions of
+      this License, without any additional terms or conditions.
+      Notwithstanding the above, nothing herein shall supersede or modify
+      the terms of any separate license agreement you may have executed
+      with Licensor regarding such Contributions.
+
+   6. Trademarks. This License does not grant permission to use the trade
+      names, trademarks, service marks, or product names of the Licensor,
+      except as required for reasonable and customary use in describing the
+      origin of the Work and reproducing the content of the NOTICE file.
+
+   7. Disclaimer of Warranty. Unless required by applicable law or
+      agreed to in writing, Licensor provides the Work (and each
+      Contributor provides its Contributions) on an "AS IS" BASIS,
+      WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
+      implied, including, without limitation, any warranties or conditions
+      of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
+      PARTICULAR PURPOSE. You are solely responsible for determining the
+      appropriateness of using or redistributing the Work and assume any
+      risks associated with Your exercise of permissions under this License.
+
+   8. Limitation of Liability. In no event and under no legal theory,
+      whether in tort (including negligence), contract, or otherwise,
+      unless required by applicable law (such as deliberate and grossly
+      negligent acts) or agreed to in writing, shall any Contributor be
+      liable to You for damages, including any direct, indirect, special,
+      incidental, or consequential damages of any character arising as a
+      result of this License or out of the use or inability to use the
+      Work (including but not limited to damages for loss of goodwill,
+      work stoppage, computer failure or malfunction, or any and all
+      other commercial damages or losses), even if such Contributor
+      has been advised of the possibility of such damages.
+
+   9. Accepting Warranty or Additional Liability. While redistributing
+      the Work or Derivative Works thereof, You may choose to offer,
+      and charge a fee for, acceptance of support, warranty, indemnity,
+      or other liability obligations and/or rights consistent with this
+      License. However, in accepting such obligations, You may act only
+      on Your own behalf and on Your sole responsibility, not on behalf
+      of any other Contributor, and only if You agree to indemnify,
+      defend, and hold each Contributor harmless for any liability
+      incurred by, or claims asserted against, such Contributor by reason
+      of your accepting any such warranty or additional liability.
+
+   END OF TERMS AND CONDITIONS
+
+   APPENDIX: How to apply the Apache License to your work.
+
+      To apply the Apache License to your work, attach the following
+      boilerplate notice, with the fields enclosed by brackets "[]"
+      replaced with your own identifying information. (Don't include
+      the brackets!)  The text should be enclosed in the appropriate
+      comment syntax for the file format. We also recommend that a
+      file or class name and description of purpose be included on the
+      same "printed page" as the copyright notice for easier
+      identification within third-party archives.
+
+   Copyright 2026 Dennis Strähhuber
+
+   Licensed under the Apache License, Version 2.0 (the "License");
+   you may not use this file except in compliance with the License.
+   You may obtain a copy of the License at
+
+       http://www.apache.org/licenses/LICENSE-2.0
+
+   Unless required by applicable law or agreed to in writing, software
+   distributed under the License is distributed on an "AS IS" BASIS,
+   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+   See the License for the specific language governing permissions and
+   limitations under the License.

package/NOTICE

@@ -0,0 +1,54 @@
+Exponential
+Copyright 2026 Dennis Strähhuber
+
+This product includes software developed as part of the Exponential project,
+licensed under the Apache License, Version 2.0 (see LICENSE at the repo root).
+
+Third-party code vendored into this repository keeps its own NOTICE, next to
+the vendored source:
+
+  apps/desktop/crates/ui/NOTICE
+  apps/desktop/crates/gpui-markdown-editor/NOTICE
+
+This file records the attributions that travel with a distributed artifact.
+It is not the per-client dependency inventory; that is generated separately.
+
+
+================================================================================
+Feedback widget
+================================================================================
+
+The feedback widget (packages/widget, emitted to
+apps/web/public/widget/v1/loader.js and widget.js) is served cross-origin to
+third-party websites, so its bundle redistributes the software below. Both
+emitted files carry a short banner naming these packages and pointing here.
+
+  preact
+  Copyright (c) 2015-present Jason Miller
+  https://github.com/preactjs/preact
+  MIT License
+
+  @zumer/snapdom
+  Copyright (c) 2025 ZumerLab
+  https://github.com/zumerlab/snapdom
+  MIT License
+
+Both are made available under the following terms:
+
+    Permission is hereby granted, free of charge, to any person obtaining a
+    copy of this software and associated documentation files (the "Software"),
+    to deal in the Software without restriction, including without limitation
+    the rights to use, copy, modify, merge, publish, distribute, sublicense,
+    and/or sell copies of the Software, and to permit persons to whom the
+    Software is furnished to do so, subject to the following conditions:
+
+    The above copyright notice and this permission notice shall be included in
+    all copies or substantial portions of the Software.
+
+    THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+    IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+    FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL
+    THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+    LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+    FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER
+    DEALINGS IN THE SOFTWARE.

package/README.md

@@ -1,3 +1,136 @@
-# Temporary Holding Version
+# `@exponential-at/ui-solid`: the Exponential UI SolidJS renderer
 
-This version is a temporary placeholder for this package. An operational version to replace this has been submitted for review and is awaiting a staged release.
+The SolidJS renderer of Exponential UI (FEED-128): an A2UI surface in the
+core catalog (`@exponential-at/ui`) painted with the **identical DOM** of the
+React renderer (`@exponential-at/ui-react`), with the same compiled stylesheet
+and runtime themes. Overlays, menus, selects, tabs, accordions and the form
+controls paint Radix's DOM on plain elements, on a headless layer
+(`src/behaviors/`) that reproduces Radix's machinery: positioning on
+`@floating-ui/dom`, modality on `aria-hidden`. It depends on
+`@exponential-at/ui` (the shared web layer `@exponential-at/ui/web`),
+`solid-js`, `@floating-ui/dom`, `aria-hidden` and `lucide-solid`. It imports
+nothing from the React renderer and nothing from the Exponential app.
+
+## The invariant
+
+For every surface the Solid painter produces exactly what React paints:
+
+- the same elements and attribute set, with the same values: the `class`
+  strings in the same order, `data-xui-id`, `data-xui-part`, `data-xui-c`,
+  `data-r-*`/`data-m-*`, `data-xs`, aria-*;
+- the same `<style data-xui-style="theme">` (`BASE_CSS` + the compiled
+  theme) and `<style data-xui-style="nodes">`;
+- the same root (`.xui-surface <scope> xui-s-<id>`, `data-xui-mode`, `dir`,
+  `data-xq`) and the same overlay, toast and live-region layers.
+
+`src/test/parity.ts` (`expectDomParity`) renders one tree in both renderers
+in jsdom and compares the serialised DOM (attributes sorted, generated ids
+renamed). Every native port adds its cases to `src/parity.test.ts`. A
+browser-level web-parity suite also compares computed styles, frames and
+pixels at zero tolerance.
+
+```tsx
+import { ExponentialSurface, createSurface } from "@exponential-at/ui-solid"
+
+function Chat(props: { messages: A2uiMessage[] }) {
+  const surface = createSurface({ surfaceId: "main" })
+  createEffect(() => props.messages.forEach(surface.apply))   // A2UI v0.9 server messages
+  return (
+    <ExponentialSurface
+      surface={surface}
+      theme="exponential"                     // or "neutral" | "playful" | "orange" | a theme JSON | a ResolvedTheme
+      mode="system"                           // light | dark | system
+      locale="de-AT" timeZone="Europe/Vienna"
+      host={{ icons, onAction, onInput }}     // the host plugin (lucide-solid icons)
+      handleRef={(h) => (handle = h)}         // handle.run({ focus: { id } } | { announce } | { scrollIntoView } | { scrollToIndex })
+    />
+  )
+}
+```
+
+The props are the same as React's `ExponentialSurfaceProps`, with these
+differences:
+
+- `class`/`style` take Solid's form (kebab-case style keys).
+- `handleRef` is a callback that receives the `SurfaceHandle`.
+- The React hooks have Solid names: `useSurface` is `createSurface`,
+  `useHostOwnedValue` is `createHostOwnedValue`, `useParts` is `parts`,
+  `useField` is `createField`, `useMediaSource` is `createMediaSource`,
+  `useHostSurface` is `createHostSurface`, and `defineReactExtension` is
+  `defineSolidExtension`.
+
+## Layout
+
+| path | what |
+|---|---|
+| `src/surface.tsx` | `<ExponentialSurface>`: theme resolution, density/contrast, the measured box + breakpoints, the two `<style>`s, the container, layers, live regions, the handle |
+| `src/create-surface.ts` | `createSurface`: the reducer as a Solid store (tree and data in two signals) |
+| `src/node-view.tsx` | the bind pass as per-node memos, painter lookup through `<Dynamic>`, `NodeList` (children keyed by id) and `TemplateItems` (keyed by `template.key`), `runNodeAction`, the paint boundary |
+| `src/context.ts` | the surface context (an object of getters; `deriveContext` re-points fields), scope + instance accessors |
+| `src/natives/` | `shared.tsx` (`parts()`, the porting rules), `bound.ts`, the painters (`overlays.tsx`, `select.tsx`, `dates.tsx`, `nav.tsx`, `inputs.tsx`…), `index.ts` (the 48 keys) |
+| `src/behaviors/` | the headless Radix machinery the natives and `src/primitives/` share, one concern per module: `portal`, `presence`, `dismissable-layer`, `focus-scope`, `focus-guards`, `scroll-lock`, `modal`, `popper`, `menu`, `roving-focus`, `listbox`, `typeahead`, `collapsible`, `picker-popover`, `bubble-input`, `slider`, `grace-area`, `visually-hidden`, `drag-to-dismiss`, `style-writer`, `element-size`, `image-loading-status`, `search-match` (`index.ts` names the Radix primitive each reproduces). Nothing in it reads the surface context; package-internal |
+| `src/primitives/` | the React primitive set on Solid (FEED-131), one module per React module but the six app-specific ones, on the shared recipes of `@exponential-at/ui/web/primitives` and on `src/behaviors/`; `index.ts` = `./primitives`; `bun run build:css` → `dist/exponential-ui-solid.css` |
+| `src/style.ts` | `css()`: React's inline-style semantics (camelCase, px for numbers, unitless list) |
+| `src/icons.tsx` | the fallback glyphs on lucide-solid, painted with lucide-react's exact `<svg>` attributes |
+| `src/form.tsx`, `list.tsx`, `markdown.tsx`, `media.ts`, `inputs.ts`, `platform.ts`, `extensions.ts`, `host*.ts*` | the React files' Solid twins |
+| `harness/` | the same page protocol as React's harness (`dev:harness` serves on :4182, built with Vite + `vite-plugin-solid`) |
+
+## Primitives
+
+`@exponential-at/ui-solid/primitives` is the Solid twin of
+`@exponential-at/ui-react/primitives` (FEED-131): button, dialog, select,
+tabs, table, command, toast, calendar and the rest, with the same DOM and
+classes. The class strings come from ONE source, the recipes of
+`@exponential-at/ui/web/primitives`; neither set holds a class literal.
+
+```tsx
+import "@exponential-at/ui-solid/styles.css"          // the compiled primitives sheet
+import { globalsCss } from "@exponential-at/ui/web"
+import { Button, Dialog, DialogContent, DialogTitle, DialogTrigger } from "@exponential-at/ui-solid/primitives"
+```
+
+- `styles.css` is `dist/exponential-ui-solid.css`, compiled by
+  `bun run build:css` from the React package's `tailwind.css`: byte-identical
+  to `@exponential-at/ui-react/styles.css` (`src/primitives/styles.test.ts`).
+- Inside a surface the primitives wear its theme. Outside one,
+  `globalsCss(theme)` writes the theme as shadcn variables (`:root` + `.dark`).
+- The names follow Solid: `class` for `className`, `as` for `asChild` (the
+  element or component the part paints as), `create*` for the `use*` hooks.
+- Six React modules are the Exponential app's own and stay React-only:
+  `glass-rows`, `typeahead`, `composer`, `trace`, `pill`, `segmented-bar`.
+- The web-parity gate compares every specimen of
+  `@exponential-at/ui/fixtures/primitive-specimens.json` with React's over the
+  whole page body: `bun run --filter @exponential-at/ui-solid test:parity:primitives`.
+
+## State attributes: the porting rule
+
+The theme CSS (`STATE_SELECTORS`) targets Radix's attribute names, so the
+Solid painters write the Radix-named attributes on the parts themselves. The
+package was first painted on Kobalte, which names the same states
+differently; the dependency is gone, and the Kobalte column stays as the map
+for porting code written against Kobalte (or any non-Radix library). The full
+rules are in `src/natives/shared.tsx`.
+
+| state | Radix (React, the theme CSS) | Kobalte (history) | the Solid painter writes |
+|---|---|---|---|
+| checked / unchecked | `data-state="checked\|unchecked"` | `data-checked` | `data-state` |
+| open / closed | `data-state="open\|closed"` | `data-expanded`, `data-closed` | `data-state` |
+| selected tab | `data-state="active\|inactive"` | `data-selected` | `data-state` |
+| pressed toggle | `data-state="on\|off"` | `data-pressed` | `data-state` |
+| placement | `data-side`, `data-align` | (none, style only) | `data-side`, `data-align` |
+| highlighted item | `data-highlighted=""` | `data-highlighted` | `data-highlighted=""` |
+| disabled | `data-disabled=""` | `data-disabled` | `data-disabled=""` |
+
+## Commands
+
+```bash
+bun run --filter @exponential-at/ui-solid typecheck
+bun run --filter @exponential-at/ui-solid test          # jsdom: surface, natives × catalog, DOM parity with React
+bun run --filter @exponential-at/ui-solid dev:harness   # http://localhost:4182/?view=kitchen-sink&theme=orange
+bun run --filter @exponential-at/ui-solid test:conformance  # the shared web runner → .conformance/exponential-ui-solid.json
+bun run --filter @exponential-at/ui-solid test:parity       # web parity vs React → .conformance/exponential-ui-parity-react-solid.json
+bun run --filter @exponential-at/ui-solid test:parity:primitives  # the primitive specimens only (seconds)
+bun run --filter @exponential-at/ui-solid test:browser      # every headless-Chromium suite (overlays, inputs, tables…)
+bun run --filter @exponential-at/ui-solid build:css         # dist/exponential-ui-solid.css (after ui-react's build:css)
+bun run --filter @exponential-at/ui-solid shots             # the kitchen sink → /tmp/feed128/solid-shots/ (--theme, --mode, --out)
+```