Skip to content

README.md

Latest commit

 

History

History
85 lines (59 loc) · 3.05 KB

README.md

File metadata and controls

85 lines (59 loc) · 3.05 KB

Valdi Widgets

UI widgets, styles, and patterns for apps built with Valdi. This repo depends on Valdi via Bazel and provides reusable components (buttons, cells, navigation, sheets, inputs, etc.) and a playground app.

Repo structure

Path Description
valdi_modules/widgets/ Widget components (buttons, cells, inputs, pickers, scroll, tabs, etc.)
valdi_modules/navigation/ Navigation APIs and page components
valdi_modules/navigation_internal/ Internal navigation support
valdi_modules/valdi_standalone_ui/ Standalone UI (modals, split view, etc.)
valdi_modules/playground/ Example app (playground)
scripts/ Helper scripts to build and run the playground
.cursor/rules/ Cursor/IDE rules for Valdi (TypeScript, Bazel, testing)
docs/ Additional documentation

The Valdi framework (compiler, runtimes) is pulled in as an external dependency in WORKSPACE (e.g. beta-0.0.2).

Using Valdi Widgets in your Valdi app

Add to your project’s WORKSPACE:

http_archive(
    name = "valdi_widgets",
    strip_prefix = "Valdi_Widgets-<TAG>",  # e.g. Valdi_Widgets-beta-0.0.1
    url = "https://github.com/Snapchat/Valdi_Widgets/archive/refs/tags/<TAG>.tar.gz",
)

In your module’s BUILD.bazel, add to valdi_module deps:

"@valdi_widgets//valdi_modules/widgets",
# and optionally:
# "@valdi_widgets//valdi_modules/navigation",
# "@valdi_widgets//valdi_modules/valdi_standalone_ui",

Import in TypeScript:

import { CoreButton } from 'widgets/src/components/button/CoreButton';

Development

Requirements

  • Bazel (or Bazelisk); see .bazelversion
  • Valdi is fetched automatically via WORKSPACE (http_archive)

Run tests

All tests (Bazel):

bazel test //valdi_modules/widgets:test //valdi_modules/navigation:test //valdi_modules/valdi_standalone_ui:test //valdi_modules/navigation_internal:test //valdi_modules/playground:test

Run the playground

  • macOS: ./scripts/bazel_macos_run.sh — builds and runs the macOS app
  • iOS Simulator: ./scripts/bazel_ios_install.sh — builds and installs the iOS app on the booted simulator
  • Android: ./scripts/bazel_android_install.sh — builds the APK and installs via adb
  • Hot reload: ./scripts/bazel_hotreload.sh — builds and runs the hot-reload runner

CI

Tests run on GitHub Actions (.github/workflows/test.yml) on:

  • Pull requests and pushes to main
  • Publishing a release or pre-release

Documentation

License

See LICENSE.md. Code of conduct: CODE_OF_CONDUCT.md.