Files
openwork/packages/ui
Source Open ec33bae663 feat(den): add teams and skill hub management (#1289)
* feat(den): add teams and skill hub management

* feat(den-web): add UnderlineTabs component and apply to members + skill hubs screens

* feat(den-web): add DashboardPageTemplate and apply to all 6 dashboard pages

* feat(den-web): add DenButton component and apply across all dashboard pages

* feat(den-web): add DenInput component and apply across all dashboard inputs

* feat(den-web): UI polish pass — shared component system and skill hub redesign

- Add UnderlineTabs, DashboardPageTemplate, DenButton, DenInput, DenTextarea shared components
- Apply DashboardPageTemplate with PaperMeshGradient headers to all 6 dashboard pages
- Apply DenButton (primary/secondary/destructive + loading/disabled) across all dashboard pages
- Apply DenInput and DenTextarea replacing all raw inputs and textareas
- Redesign skill hub list cards: PaperMeshGradient seeded by hub ID, clean layout
- Redesign skill list cards: PaperMeshGradient seeded by skill ID, matching hub card design
- Rewrite skill hub detail page: lighter type scale, moved last-updated inline, clean sidebar
- Rewrite skill detail page: gradient header, visibility pill inline with title, removed sidebar
- Rewrite skill editor: remove category field (not persisted), clean form layout
- Clean up all 4 member tables: tighter rows, items-center alignment, lighter type
- Fix ActionButton icon stacking bug (Tailwind Preflight svg display:block via icon prop)
- Move member tab toolbar buttons inline with description text per tab
- Add destructive button variant; fix button disabled/loading states
- Clean up manage-members, billing, templates, background-agents screen designs

---------

Co-authored-by: src-opn <src-opn@users.noreply.github.com>
Co-authored-by: OmarMcAdam <gh@mcadam.io>
2026-04-02 10:28:47 -07:00
..

@openwork/ui

Shared UI primitives for OpenWork apps.

This package intentionally ships two framework-specific entrypoints:

  • @openwork/ui/react for React apps like ee/apps/den-web
  • @openwork/ui/solid for Solid apps like apps/app

The public API should stay aligned across both entrypoints. If you add a new component, add both implementations in the same task unless there is a documented blocker.

Paper components

The first shared components live under the paper namespace and wrap Paper Design shaders with OpenWork-specific defaults and deterministic seed support.

Current components:

  • PaperMeshGradient
  • PaperGrainGradient

Both accept a seed prop. Pass a TypeID-like string such as om_01kmhbscaze02vp04ykqa4tcsb and the component will deterministically derive colors and shader params from it. The same seed always produces the same result.

Explicit props still work and override the seeded values, so the merge order is:

  1. OpenWork defaults
  2. Seed-derived values from seed
  3. Explicit props passed by the caller

Layout convention

These components default to fill={true}, which means they render at width: 100% and height: 100%. Put them inside a sized container and they will fill it without needing manual width or height props.

Agent notes

  • Shared seed logic lives in src/common/paper.ts
  • React wrappers live in src/react/paper/*
  • Solid wrappers live in src/solid/paper/*
  • Keep the framework prop names aligned unless there is a hard runtime mismatch
  • Prefer extending the existing seed helpers instead of inventing per-app one-off shader configs