blocks
blocks copied to clipboard
WIP
Description
Checklist
- [ ] Tests (if applicable)
- [ ] Documentation (if applicable)
- [ ] Changelog stub (or use conventional commit messages)
[!NOTE]
Other AI code review bot(s) detected
CodeRabbit has detected other AI code review bot(s) in this pull request and will avoid duplicating their findings in the review comments. This may lead to a less comprehensive review.
Walkthrough
Migrates the codebase from a Symbiote/BaseComponent architecture to a Lit-based architecture, replacing Block/Activity/Uploader/Solution classes with Lit equivalents, moving state to a PubSub/nanostores model, refactoring many components to Lit render() lifecycle, reorganizing demos, and updating build/test/tooling and types.
Changes
| Cohort / File(s) | Summary |
|---|---|
Lit core & base types src/lit/*.ts, src/lit/LitBlock.ts, src/lit/LitActivityBlock.ts, src/lit/LitUploaderBlock.ts, src/lit/LitSolutionBlock.ts, src/lit/BaseComponent.ts, src/lit/Uid.ts, src/lit/PubSubCompat.ts, src/lit/Constructor.ts, src/lit/RegisterableElementMixin.ts, src/lit/CssDataMixin.ts, src/lit/LightDomMixin.ts, src/lit/SymbioteCompatMixin.ts, src/lit/TestModeController.ts |
Add Lit-based core (LitBlock family), PubSub compatibility layer, mixins and controllers; introduce Uid type and constructor utils; provide registration, CSS-data, light-dom and Symbiote compatibility for Lit components. |
Abstract โ Lit migration src/abstract/*.ts (many), src/abstract/Block.ts (deleted), src/abstract/SolutionBlock.ts (deleted), src/abstract/l10nProcessor.ts (deleted), src/abstract/testModeProcessor.ts (deleted) |
Remove legacy Block implementations and processors; update abstract helpers/managers to the LitBlock/LitUploaderBlock model and adjust signatures/types accordingly. |
State/data types and collections src/abstract/TypedCollection.ts, src/abstract/TypedData.ts, src/abstract/uploadEntrySchema.ts, src/blocks/Img/utils/parseObjectToString.ts, src/utils/UID.ts |
Replace Data/schema model with PubSub + Uid; rewrite TypedCollection/TypedData to use PubSub and Uid; introduce UploadEntryData and initialUploadEntryData; add UID generator utility. |
Managers (locale, modal, telemetry, validation, secure uploads, a11y) src/abstract/managers/*.ts |
Migrate managers to accept LitBlock types, change visibility and APIs (many methods public), add ITelemetryManager, update lifecycle and subscription patterns to Lit-based contexts. |
Uploader public API & CTX src/abstract/UploaderPublicApi.ts, src/abstract/CTX.ts, src/abstract/buildOutputCollectionState.ts |
Change UploaderPublicApi and context helpers to use LitUploaderBlock/LitBlock types, make API methods explicit/public, extend uploader state (uploadQueue, collectionErrors, etc.). |
CloudImageEditor & editor controls src/blocks/CloudImageEditor/src/* (Block, template, CropFrame, controls, slider, toolbar, elements, utils) |
Reimplement editor and subcomponents as LitBlock components with @state/@property, render() methods, ref-based refs, and new lifecycle/event flows; remove old TEMPLATE and some polyfills. |
Major component migrations src/blocks/** (CameraSource, ExternalSource, DropArea, FileItem, FileItemConfig, FormInput, Icon, Img, Modal, ProgressBar, ProgressBarCommon, Select, SourceBtn, SourceList, Spinner, Thumb, UrlSource, StartFrom, ActivityHeader, etc.) |
Convert many UI blocks from Block/UploaderBlock to Lit equivalents; replace static templates with render(), adopt reactive state, update lifecycle hooks and typings. |
CloudImageEditor state & utils src/blocks/CloudImageEditor/src/state.ts, src/blocks/CloudImageEditor/src/utils/*.ts |
Add '*loadingOperations' state, remove obsolete presence flags, strengthen parseFilterValue to accept null/empty. |
Img subsystem rework src/blocks/Img/ImgConfig.ts, src/blocks/Img/ImgBase.ts (new), removed ImgConfig.js/ImgBase.js |
Replace legacy ImgConfig/ImgBase JS with Lit/TS implementations, add CssData-backed ImgConfig, advanced ImgBase for CDN/srcset/proxy/preview handling. |
Upload context, event emitter, upload list src/blocks/UploadCtxProvider/*, src/blocks/UploadList/*, src/blocks/UploadCtxProvider/EventEmitter.ts |
Update UploadCtxProvider to LitUploaderBlock; EventEmitter returns cleanup and accepts LitBlock; UploadList reworked to Lit state and render. |
Solutions (file uploader pages) src/solutions/**, demo/solutions/*, demo/bundles/*, demo/features/*, demo/external-sources/*, demo/index.html, demo/* |
Reorganize and add many demo pages (bundles, solutions, features); new Lit-based demo navigator; removal of some legacy demo files. |
Build, tooling and config package.json, biome.json, scripts/*.ts, scripts/build.ts, vite.config.ts (new), tsconfig*.json, tests/*, specs/npm/npm.test.ts |
Bump dependencies (lit, nanostores, vitest tooling), update biome schema and linter rules, rewrite build/minify/banner logic, move Vite config to TypeScript, adjust test imports and timeouts. |
Index & public exports, types src/index.ts, types/jsx.d.ts, src/types/exported.ts, types/test/* |
Rework public exports to new Lit aliases (export LitBlock as Block, LitUploaderBlock etc.), add utilities (UID, toKebabCase), update JSX types for LitElement components and re-export types. |
| Removed/Deleted many legacy files removed: demo raw pages, src/blocks/Range/*, src/blocks/Img/*.js, src/utils/waitForAttribute.ts, focus-visible polyfill, and others |
Delete obsolete legacy modules and demos as part of migration. |
CSS updates src/blocks/**/*.css and demo CSS |
Replace grid-gap with gap, adjust oklch syntax, introduce --visible-opacity, minor z-index/margin changes. |
Estimated code review effort
๐ฏ 5 (Critical) | โฑ๏ธ ~120+ minutes
- Focus review on:
- Lit migration correctness across lifecycle hooks and render outputs (many components moved from template strings to render()).
- PubSub context registration/cleanup and TypedCollection/TypedData semantics (Uid handling, context deletion).
- CloudImageEditor and its many subcomponents (render, refs, events, state coordination).
- Manager lifecycle changes (LocaleManager, ModalManager, ValidationManager, TelemetryManager) and their integration with LitBlock shared contexts.
- Public API changes: UploaderPublicApi, index exports, and JSX type updates that affect downstream consumers.
- Build/tooling changes (build scripts, vite.config.ts, package.json) to ensure CI/production builds remain correct.
Possibly related PRs
- uploadcare/file-uploader#867 โ Overlapping large-scale Lit migration of core blocks and managers.
- uploadcare/file-uploader#854 โ Related ValidationManager/TypedCollection changes and validation flow updates.
- uploadcare/file-uploader#845 โ CloudImageEditor feature-area changes (crop presets, aspect-ratio controls, toolbar).
Suggested reviewers
- egordidenko
Pre-merge checks and finishing touches
โ Failed checks (2 warnings, 1 inconclusive)
| Check name | Status | Explanation | Resolution |
|---|---|---|---|
| Description check | โ ๏ธ Warning | The PR description is severely incomplete and only contains an unchecked checklist item 'Test form-input' with no context, motivation, summary of changes, or any other required information from the template. | Complete the description following the provided template: add a clear description of changes, link to related issues, include code snippets/GIFs if applicable, and update the checklist status. Explain why this migration was undertaken and what the key architectural changes are. |
| Docstring Coverage | โ ๏ธ Warning | Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. | You can run @coderabbitai generate docstrings to improve docstring coverage. |
| Title check | โ Inconclusive | The title 'Migration to Lit Element' is vague and uses a generic technology term without specifying what components or systems are being migrated or what the main scope of changes is. | Improve the title to be more specific about the scope of migration, such as 'Migrate block components to Lit Element' or 'Replace Symbiote blocks with Lit-based components' to clarify the primary change. |
โจ Finishing touches
- [ ] ๐ Generate docstrings
๐งช Generate unit tests (beta)
- [ ] Create PR with unit tests
- [ ] Post copyable unit tests in a comment
- [ ] Commit unit tests in branch
feat/lit-element
Comment @coderabbitai help to get the list of available commands and usage tips.