Files
gsc-web-kit/README.md
Claude d430680df5 feat: v0.3.0 — Phase 3/4 façades + AppLayout on AppShell
- Curated re-exports from @limitless/ui through /forms, /data,
  /feedback, /navigation, /utils sub-paths so apps stop importing
  from the lower layer.
- /forms also re-exports the full @limitless/ui validation surface
  (hooks, format/security/address validators, types).
- AppLayout is now a thin wrapper over @limitless/ui's <AppShell> —
  same ShellConfig DTO, no duplicated chrome code.
- shell/types + shell/index re-export from @limitless/ui to keep one
  canonical type and one shared context.
- auth middleware: loose NextRequestLike typing to avoid two-copies-
  of-next conflict with the consumer's next.
- postbuild: rewrite ../images/ to ./images/ in copied CSS so refs
  resolve in dist/styles/.

Widget family in /data is the intersection of limitless's two
Widget files (Widget.d.ts vs Widget/index.d.ts collision in dist);
upstream fix needed before exposing IconWidget/UserWidget/etc.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-11 08:26:30 +02:00

3.4 KiB

@gsc/web-kit

App skeleton for GSC Next.js frontends. Curates @limitless/ui primitives behind a pre-configured layout + auth + data/forms/feedback/navigation stack so apps just write their domain pages.

See the implementation plan in the parent repo for the full module map. This is a file: dep consumed by every GSC frontend.

Install (in a consumer app)

// package.json
{
  "dependencies": {
    "@gsc/web-kit": "file:../../../templates/gsc-web-kit"
  }
}

Layered architecture

your app
  └── @gsc/web-kit         ← this package (layout, auth, data, forms…)
        └── @limitless/ui   ← Bootstrap-flavoured primitives
              └── bootstrap

Sub-exports

import "@gsc/web-kit/css";              // CSS bundle (layout-3 + JetBrains Mono)

// Chrome
import { AppLayout } from "@gsc/web-kit/layout";
import { useShell } from "@gsc/web-kit/shell";
import { fetchShellConfig } from "@gsc/web-kit/shell/server";

// Auth (NextAuth v5 + Keycloak)
import { createAuth } from "@gsc/web-kit/auth/server";
import { createAuthMiddleware } from "@gsc/web-kit/auth/middleware";
import { signInRedirect } from "@gsc/web-kit/auth";

// Building blocks — curated re-exports from @limitless/ui
import {
  Table, DataTable, Pagination, TreeView, Timeline,
  Calendar, Gallery, Sortable, ListGroup,
  StatWidget, ProgressWidget, ChartWidget, ContentWidget,
} from "@gsc/web-kit/data";

import {
  FormGroup, FormControl, FormCheck, Select, InputGroup,
  SelectSingle, MultiSelect, TagsSelect, AsyncSelect,
  DatePicker, ColorPicker, TagInput, FileUpload,
  Slider, Rating, DualListBox, ImageCropper, Wizard, Stepper,
  // validation
  useValidation, useFieldValidation, required, email, password,
  noInjection, europeanAddress, /* …etc */
} from "@gsc/web-kit/forms";

import {
  Alert, Toast, Notification, Modal, Offcanvas,
  Popover, Tooltip, SweetAlert, Spinner,
  Progress, ProgressStacked, IdleTimeout, FAB,
} from "@gsc/web-kit/feedback";

import {
  Breadcrumbs, Nav, Tabs, Pills, Dropdown, ContextMenu,
  Scrollspy, PageHeader, Accordion, Collapse, Carousel,
  Embed, SyntaxHighlighter, Card, Badge, Button, Media,
} from "@gsc/web-kit/navigation";

import { useDisclosure } from "@gsc/web-kit/utils";

The /api sub-export is reserved for a future HTTP client helper; it currently re-exports nothing.

Phases

Phase Scope Status
1 Package scaffold + CSS bundle + sub-export stubs done
2 layout · auth · shell — usable end-to-end with shell-api done
3 data · forms — curated re-exports from limitless + validation done (v0.3.0)
4 feedback · navigation · utils — curated re-exports from limitless done (v0.3.0)
4a api · HTTP client helper (Bearer injection, 401 → signInRedirect) planned
5 Roll out to gscCRM / gscChronos / gscAdmin / gscPortal planned

Notes

  • AppLayout is a thin wrapper around <AppShell> from @limitless/ui — they share the ShellConfig DTO, so the kit owns the consumer-facing surface without duplicating chrome code.
  • All form, data, feedback, and navigation modules are curated re-exports: apps should never need to reach into @limitless/ui directly.
  • The Widget family in /data is intentionally narrow (StatWidget, ProgressWidget, ChartWidget, ContentWidget) — the installed limitless dist has a duplicate Widget file/folder collision, so only names exported by both are passed through.