refactor(components): extract field rendering into _fields.liquid partial and fix select enum mapping - #398
Draft
peintnermax wants to merge 10 commits into
Draft
refactor(components): extract field rendering into _fields.liquid partial and fix select enum mapping#398peintnermax wants to merge 10 commits into
peintnermax wants to merge 10 commits into
Conversation
Add form-associated <zl-checkbox>/<Checkbox> and <zl-select>/<Select> atoms in both renderers, render the select/checkbox field types in the orchestrator, and replace the Lit/console dev playgrounds with a single Storybook workbench that hosts both renderers and gates render, a11y, and cross-renderer parity in CI. Co-authored-by: Cursor <cursoragent@cursor.com>
The `@zitadel/source` export condition on @zitadel/components flipped every TS consumer (sdk-vue/react/angular, login-ui) to compile the package from source via the repo-wide `customConditions`, which broke `full-pr`: unresolved `*.css?inline` / `*.liquid` modules (TS2307) and composite dist project-reference conflicts (TS6305). Revert the condition on the component exports so all consumers resolve `dist` as before, and give Storybook source resolution (for Lit shadow-CSS and atom HMR) through a bundler-only Vite alias instead. Co-authored-by: Cursor <cursoragent@cursor.com>
- Drop the `@zitadel/components/vite-liquid-plugin` package export: it pointed `default`/`types` at an unpublished `.ts` source file (the package ships only `dist/`), so an external import would 404. It is dev-only build tooling, so Storybook now imports it by source path like the package's own vitest config already does. - React `<Select>`: omit the hidden input's form entry when nothing is selected so `FormData.get(name)` is `null`, matching `<zl-select>`'s `setFormValue(value || null)` (was submitting an empty string). - Add the required `Parity` story to checkbox.stories.tsx. It caught two real cross-renderer drifts in the `.zr-checkbox` surface — missing `box-sizing: border-box` subtree and inherited `line-height` — now mirrored from the Lit atom's `baseHostStyles` in checkbox.css. Co-authored-by: Cursor <cursoragent@cursor.com>
`optimizeDeps.include` lists the heavy third-party deps of the excluded
workspace packages (dompurify, liquidjs, lucide, lucide-react, xstate,
@faker-js/faker) so the addon-vitest browser run pre-bundles them up
front. But Storybook never declared them, so under pnpm's strict
node_modules they were unresolvable from the app on a clean install:
Vite could not pre-bundle them, discovered them mid-test, and reloaded —
losing the suite ("Vitest failed to find the current suite") on every
cold CI run while a warm local cache masked it.
Declare them as devDependencies so every include entry resolves.
Co-authored-by: Cursor <cursoragent@cursor.com>
`storybook:typecheck` references `api`/`api-mock` as composite projects but imports them in type-checked files (main.ts, orchestrator.stories.ts). Their `dist/*.d.ts` are never produced (api-mock's build is a no-op, api builds via tsdown to `.d.mts`), so on a clean CI checkout `tsc --noEmit -p` failed with TS6305. Locally it only passed against stale `dist` outputs. Switch storybook:typecheck to `tsc --build` so it compiles the referenced composite projects first. That surfaced two latent errors in api-mock's lib config, which had never been compiled (its `tsconfig.json` is solution-style with empty files/include, so `tsc -p` checked nothing): - missing `tslib` (importHelpers) -> add as a dependency - a real TS2322 in `flowListItemResponse` -> cast the mock record status to the generated literal union, matching the sibling `flowDetailResponse` Add an `api-mock:build` dep edge so Moon re-runs the typecheck when api-mock source changes. Co-authored-by: Cursor <cursoragent@cursor.com>
|
The latest updates on your projects. Learn more about Vercel for GitHub.
1 Skipped Deployment
|
Contributor
🦋 Changeset detectedLatest commit: 6804274 The changes in this PR will be included in the next version bump. This PR includes changesets to release 21 packages
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Refactors the Liquid field rendering system into a dedicated partial and module, renames
mandatory-gates→field-patcher, fixesselectenum values being dropped by the Go API, and documents the real-server demo workflow.Changes
Field rendering refactor (
packages/components/src/orchestrator/)_fields.liquidpartial — field rendering logic moved fromdefault.liquidinto a reusable partial with{% case f.type %}dispatch forcheckbox,select, and default input typesliquid-fields.ts— all field-related filters (fieldPlaceholder,fieldHelp,fieldError,selectOptions,formLevelError) and the{% fields %}tag extracted fromliquid.tsliquid.tssimplified to a thin wrapper that delegates field concerns toliquid-fields.tsmandatory-gates→field-patcher— renamed tag, file, and spec for clarityBug fix:
selectenum values dropped by Go API (internal/api/flow.go)toFlowFieldValidationmappedFormat,MinLength,MaxLengthbut silently droppedEnum. The OpenAPI spec already declaredvalidation.enum— the mapper just never populated it.Default schema/flow (temporary, for testing)
genderproperty withenumtodefault-human-user-schema.json"gender"to register step fields indefault-login-flow-definition.jsonregister.field.gendertranslations (en, de, it)Docs
.env.example: AddedZITADEL_PROJECT_SECRETplaceholderValidation
moon run components:test)<zl-select>with enum optionsRelease notes / changeset
Internal refactor + bug fix. Touches
@zitadel/components— theEnumfix and field-patcher rename are patch-level.