reflex-reactbits 0.1.1__tar.gz → 0.2.1__tar.gz
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- {reflex_reactbits-0.1.1 → reflex_reactbits-0.2.1}/PKG-INFO +50 -14
- {reflex_reactbits-0.1.1 → reflex_reactbits-0.2.1}/README.md +49 -13
- reflex_reactbits-0.2.1/custom_components/reflex_reactbits/__init__.py +12 -0
- reflex_reactbits-0.2.1/custom_components/reflex_reactbits/animations.py +2846 -0
- {reflex_reactbits-0.1.1 → reflex_reactbits-0.2.1}/custom_components/reflex_reactbits/animations.pyi +702 -355
- reflex_reactbits-0.2.1/custom_components/reflex_reactbits/backgrounds.py +5622 -0
- {reflex_reactbits-0.1.1 → reflex_reactbits-0.2.1}/custom_components/reflex_reactbits/backgrounds.pyi +1402 -374
- {reflex_reactbits-0.1.1 → reflex_reactbits-0.2.1}/custom_components/reflex_reactbits/base.pyi +1 -1
- reflex_reactbits-0.2.1/custom_components/reflex_reactbits/catalog.json +39989 -0
- {reflex_reactbits-0.1.1 → reflex_reactbits-0.2.1}/custom_components/reflex_reactbits/cli.py +12 -2
- reflex_reactbits-0.2.1/custom_components/reflex_reactbits/components.py +3853 -0
- {reflex_reactbits-0.1.1 → reflex_reactbits-0.2.1}/custom_components/reflex_reactbits/components.pyi +873 -141
- {reflex_reactbits-0.1.1 → reflex_reactbits-0.2.1}/custom_components/reflex_reactbits/micro.py +554 -54
- {reflex_reactbits-0.1.1 → reflex_reactbits-0.2.1}/custom_components/reflex_reactbits/micro.pyi +341 -1
- {reflex_reactbits-0.1.1 → reflex_reactbits-0.2.1}/custom_components/reflex_reactbits/source.py +86 -75
- reflex_reactbits-0.2.1/custom_components/reflex_reactbits/text_animations.py +2483 -0
- {reflex_reactbits-0.1.1 → reflex_reactbits-0.2.1}/custom_components/reflex_reactbits/text_animations.pyi +441 -31
- {reflex_reactbits-0.1.1 → reflex_reactbits-0.2.1}/custom_components/reflex_reactbits.egg-info/PKG-INFO +50 -14
- {reflex_reactbits-0.1.1 → reflex_reactbits-0.2.1}/pyproject.toml +1 -1
- reflex_reactbits-0.2.1/tests/test_wrappers.py +308 -0
- reflex_reactbits-0.1.1/custom_components/reflex_reactbits/__init__.py +0 -12
- reflex_reactbits-0.1.1/custom_components/reflex_reactbits/animations.py +0 -2128
- reflex_reactbits-0.1.1/custom_components/reflex_reactbits/backgrounds.py +0 -3503
- reflex_reactbits-0.1.1/custom_components/reflex_reactbits/catalog.json +0 -26580
- reflex_reactbits-0.1.1/custom_components/reflex_reactbits/components.py +0 -2383
- reflex_reactbits-0.1.1/custom_components/reflex_reactbits/text_animations.py +0 -1629
- reflex_reactbits-0.1.1/tests/test_wrappers.py +0 -214
- {reflex_reactbits-0.1.1 → reflex_reactbits-0.2.1}/LICENSE +0 -0
- {reflex_reactbits-0.1.1 → reflex_reactbits-0.2.1}/custom_components/reflex_reactbits/base.py +0 -0
- {reflex_reactbits-0.1.1 → reflex_reactbits-0.2.1}/custom_components/reflex_reactbits/catalog.py +0 -0
- {reflex_reactbits-0.1.1 → reflex_reactbits-0.2.1}/custom_components/reflex_reactbits/py.typed +0 -0
- {reflex_reactbits-0.1.1 → reflex_reactbits-0.2.1}/custom_components/reflex_reactbits.egg-info/SOURCES.txt +0 -0
- {reflex_reactbits-0.1.1 → reflex_reactbits-0.2.1}/custom_components/reflex_reactbits.egg-info/dependency_links.txt +0 -0
- {reflex_reactbits-0.1.1 → reflex_reactbits-0.2.1}/custom_components/reflex_reactbits.egg-info/entry_points.txt +0 -0
- {reflex_reactbits-0.1.1 → reflex_reactbits-0.2.1}/custom_components/reflex_reactbits.egg-info/requires.txt +0 -0
- {reflex_reactbits-0.1.1 → reflex_reactbits-0.2.1}/custom_components/reflex_reactbits.egg-info/top_level.txt +0 -0
- {reflex_reactbits-0.1.1 → reflex_reactbits-0.2.1}/setup.cfg +0 -0
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
Metadata-Version: 2.4
|
|
2
2
|
Name: reflex-reactbits
|
|
3
|
-
Version: 0.
|
|
3
|
+
Version: 0.2.1
|
|
4
4
|
Summary: Reflex wrappers for React Bits: 200+ animated text effects, backgrounds, UI components and micro interactions.
|
|
5
5
|
Author-email: Ernesto Crespo <ecrespo@gmail.com>
|
|
6
6
|
License: MIT
|
|
@@ -35,7 +35,7 @@ Dynamic: license-file
|
|
|
35
35
|
|
|
36
36
|
[Reflex](https://reflex.dev) wrappers for **[React Bits](https://reactbits.dev)** — the
|
|
37
37
|
open-source collection of animated, interactive and customizable React components by
|
|
38
|
-
David Haz. Every one of the **
|
|
38
|
+
David Haz. Every one of the **218 React Bits 2.0 components** (plus 5 sub-components) is
|
|
39
39
|
available as a typed Python component: text animations, animations, UI components,
|
|
40
40
|
animated WebGL backgrounds and the new *Micro* interactions.
|
|
41
41
|
|
|
@@ -92,9 +92,16 @@ Sources are resolved from `REACTBITS_SOURCE_DIR` (a local clone of
|
|
|
92
92
|
[DavidHDev/react-bits](https://github.com/DavidHDev/react-bits)) when set, otherwise from
|
|
93
93
|
GitHub raw files at `REACTBITS_REF` (defaults to the pinned commit).
|
|
94
94
|
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
95
|
+
React Bits 2.0 no longer needs React Router, Chakra UI or Tailwind, so the sources are
|
|
96
|
+
copied as-is with one exception: components that render their own `<canvas>` keep their
|
|
97
|
+
WebGL context on unmount instead of calling `loseContext()`. React StrictMode (on in Reflex
|
|
98
|
+
dev mode) re-runs effects on the same canvas, and a lost context would leave the component
|
|
99
|
+
frozen or blank.
|
|
100
|
+
|
|
101
|
+
Each copy records the React Bits commit it came from in `.reactbits-ref`. When a newer
|
|
102
|
+
version of this package is generated from another commit, existing copies are **not**
|
|
103
|
+
replaced (they may hold your edits), but a warning names them and `reactbits add` lists
|
|
104
|
+
them as `stale`.
|
|
98
105
|
|
|
99
106
|
## The `reactbits` CLI
|
|
100
107
|
|
|
@@ -106,6 +113,28 @@ reactbits add --all # vendor all components (offline / CI
|
|
|
106
113
|
reactbits remove Aurora
|
|
107
114
|
```
|
|
108
115
|
|
|
116
|
+
## Upgrading from 0.1.x (React Bits 1.x → 2.0)
|
|
117
|
+
|
|
118
|
+
0.2.0 wraps React Bits 2.0, which reworked most components. In short:
|
|
119
|
+
|
|
120
|
+
* **Props changed** on most components (renamed, removed or added). React ignores unknown
|
|
121
|
+
props, so check each component's props (`reactbits info <name>`) when upgrading.
|
|
122
|
+
* **Replace the copied sources**: `reactbits add --all --force` in your app (this discards
|
|
123
|
+
local edits to them), or delete `assets/reactbits/` and let it be re-created.
|
|
124
|
+
* **New components (15):** `circular_carousel`, `crystalized_ball`, `dither_veil`,
|
|
125
|
+
`electric_logo`, `flex_carousel`, `flip_card`, `flux_lines`, `gradient_ascii`,
|
|
126
|
+
`holo_card`, `micro_slats`, `paper_crumple`, `pattern_waves`, `shredder`, `tear_ticket`,
|
|
127
|
+
`tech_text`; and the `tilted_card_layer` sub-component.
|
|
128
|
+
* **Moved to Backgrounds:** `antigravity`, `magic_rings`, `magnet_lines` (same factory names).
|
|
129
|
+
* **Removed APIs:** `rb.hyperspeed(preset=...)` (use `curve`, `boosting`, colour props),
|
|
130
|
+
`splash_cursor`'s `SIM_RESOLUTION`-style props, Lanyard/FluidGlass `.glb` assets (the 3D
|
|
131
|
+
geometry is now procedural).
|
|
132
|
+
* **Fewer npm dependencies:** lucide-react, react-icons, Chakra UI, react-router,
|
|
133
|
+
postprocessing, lenis, maath, meshline, face-api.js and @react-three/rapier are gone;
|
|
134
|
+
icons come from Hugeicons.
|
|
135
|
+
* A prop named like a Python builtin gets a trailing underscore, like `from_`:
|
|
136
|
+
`float` → `float_` (`depth_text`, `model_viewer`).
|
|
137
|
+
|
|
109
138
|
## Props, events and children
|
|
110
139
|
|
|
111
140
|
* Props use snake_case and are converted to the React prop names (`animate_by` → `animateBy`,
|
|
@@ -123,7 +152,10 @@ reactbits remove Aurora
|
|
|
123
152
|
* Wrapper components take Reflex children: `rb.fade_content(rx.text("Hi"), blur=True)`.
|
|
124
153
|
* Sub-components: `rb.stepper(rb.step(...), ...)`, `rb.card_swap(rb.card_swap_card(...))`,
|
|
125
154
|
`rb.scroll_stack(rb.scroll_stack_item(...))`, `rb.warm_tooltip_group(...)`.
|
|
126
|
-
* `rb.
|
|
155
|
+
* `rb.tilted_card(rb.tilted_card_layer(..., depth=30), ...)` floats content above the card;
|
|
156
|
+
`rb.step(..., title="Plan")` labels a stepper step.
|
|
157
|
+
* `rb.hyperspeed(curve="racing", boosting=State.loading)` - 2.0 replaced the presets with
|
|
158
|
+
props.
|
|
127
159
|
* Backgrounds and canvas effects fill their parent: give the parent a size and
|
|
128
160
|
`position="relative"`.
|
|
129
161
|
|
|
@@ -132,15 +164,15 @@ docs URL, npm deps) at runtime.
|
|
|
132
164
|
|
|
133
165
|
## Components
|
|
134
166
|
|
|
135
|
-
**Text animations (
|
|
167
|
+
**Text animations (33):** `ascii_text`, `blur_text`, `circular_text`, `count_up`, `curved_loop`, `decrypted_text`, `depth_text`, `echo_text`, `falling_text`, `fold_text`, `fuzzy_text`, `glitch_text`, `gradient_text`, `masked_heading`, `particle_text`, `rotating_text`, `scrambled_text`, `scroll_float`, `scroll_reveal`, `scroll_velocity`, `shiny_text`, `shuffle`, `split_flap_text`, `split_text`, `stroke_text`, `tech_text`, `text_cursor`, `text_loop`, `text_pressure`, `text_type`, `true_focus`, `variable_proximity`, `warp_text`
|
|
136
168
|
|
|
137
|
-
**Animations (38):** `animated_content`, `
|
|
169
|
+
**Animations (38):** `animated_content`, `blob_cursor`, `click_spark`, `crosshair`, `crystalized_ball`, `cubes`, `cursor_grid`, `dither_veil`, `elastic_mesh`, `electric_border`, `electric_logo`, `fade_content`, `ghost_cursor`, `glare_hover`, `glow_cursor`, `gradual_blur`, `halftone_reveal`, `image_trail`, `laser_flow`, `logo_loop`, `magnet`, `meta_balls`, `metallic_paint`, `noise`, `orbit_images`, `pixel_swap`, `pixel_trail`, `pixel_transition`, `ribbons`, `ripple_distortion`, `scroll_expand`, `shape_blur`, `splash_cursor`, `star_border`, `sticker_peel`, `strands`, `swarm_cursor`, `target_cursor`
|
|
138
170
|
|
|
139
|
-
**Components (
|
|
171
|
+
**Components (48 + 4 sub-components):** `accordion_gallery`, `animated_list`, `border_glow`, `bounce_cards`, `bubble_menu`, `card_nav`, `card_swap`, `card_swap_card`, `carousel`, `chroma_grid`, `circular_carousel`, `circular_gallery`, `counter`, `curved_input`, `decay_card`, `depth_carousel`, `dock`, `dome_gallery`, `drift_wall`, `elastic_slider`, `flex_carousel`, `flowing_menu`, `fluid_glass`, `flying_posters`, `folder`, `glass_icons`, `glass_surface`, `gooey_nav`, `holo_card`, `infinite_menu`, `infinite_spiral`, `lanyard`, `line_sidebar`, `magic_bento`, `masonry`, `model_viewer`, `morph_slider`, `option_wheel`, `pill_nav`, `pixel_card`, `profile_card`, `reflective_card`, `scroll_stack`, `scroll_stack_item`, `specular_button`, `spotlight_card`, `stack`, `staggered_menu`, `step`, `stepper`, `tilted_card`, `tilted_card_layer`
|
|
140
172
|
|
|
141
|
-
**Backgrounds (
|
|
173
|
+
**Backgrounds (64):** `acid_squares`, `aero_shards`, `antigravity`, `aurora`, `balatro`, `ballpit`, `beams`, `color_bends`, `crt_warp`, `dark_veil`, `dither`, `dot_field`, `dot_grid`, `evil_eye`, `faulty_terminal`, `ferrofluid`, `floating_lines`, `flux_lines`, `galaxy`, `ghost_fibers`, `gradient_ascii`, `gradient_blinds`, `gradient_waves`, `grainient`, `grid_distortion`, `grid_motion`, `grid_scan`, `hyperspeed`, `iridescence`, `letter_glitch`, `light_pillar`, `light_rays`, `light_tunnel`, `lightfall`, `lightning`, `line_waves`, `liquid_chrome`, `liquid_ether`, `magic_rings`, `magnet_lines`, `micro_slats`, `molten_metal`, `orb`, `particles`, `pattern_waves`, `pixel_blast`, `pixel_snow`, `plasma`, `plasma_wave`, `prism`, `prismatic_burst`, `radar`, `ripple_grid`, `scanner`, `shape_grid`, `shape_waves`, `side_rays`, `silk`, `sliced_waves`, `soft_aurora`, `threads`, `topography`, `waves`, `web_threads`
|
|
142
174
|
|
|
143
|
-
**Micro interactions (
|
|
175
|
+
**Micro interactions (35 + 1 sub-component):** `bell_toggle`, `branched_menu`, `call_chip`, `code_slots`, `comet_dial`, `dodge_field`, `flip_card`, `flying_button`, `folder_float`, `fuse_button`, `glide_select`, `hold_button`, `jelly_radio`, `lattice_loader`, `paper_crumple`, `peek_rating`, `prompt_bar`, `pulse_heart`, `refine_frame`, `rubber_segment`, `scrub_field`, `shredder`, `slide_commit`, `sling_button`, `slosh_gauge`, `spring_check`, `squish_switch`, `status_mark`, `swipe_row`, `swipe_toast`, `tear_ticket`, `thought_line`, `voice_pill`, `wake_slider`, `warm_tooltip`, `warm_tooltip_group`
|
|
144
176
|
|
|
145
177
|
Full docs, previews and prop descriptions for each component live at
|
|
146
178
|
[reactbits.dev](https://reactbits.dev).
|
|
@@ -149,7 +181,8 @@ Full docs, previews and prop descriptions for each component live at
|
|
|
149
181
|
|
|
150
182
|
`reactbits_demo/` is a gallery with a page per component (live preview, replay, event
|
|
151
183
|
log wired to Reflex state, generated Python usage and the props table), a playground
|
|
152
|
-
where props are bound to state vars,
|
|
184
|
+
where props are bound to state vars, a *What's new in 2.0* page with live previews of
|
|
185
|
+
every new component, and a landing page built only with React Bits.
|
|
153
186
|
|
|
154
187
|
```bash
|
|
155
188
|
uv sync --extra dev
|
|
@@ -170,6 +203,9 @@ python scripts/generate_wrappers.py scripts/components.json /tmp/react-bits
|
|
|
170
203
|
```
|
|
171
204
|
|
|
172
205
|
Update `PINNED_REF` in `custom_components/reflex_reactbits/source.py` to the new commit.
|
|
206
|
+
If `git diff --stat <old> <new> -- src/content` only adds files (new components), add the
|
|
207
|
+
old commit to `COMPATIBLE_REFS` next to it, so copies apps already vendored from it are not
|
|
208
|
+
reported as stale; if any existing component changed, empty that set instead.
|
|
173
209
|
|
|
174
210
|
## Development
|
|
175
211
|
|
|
@@ -202,10 +238,10 @@ given pull request introduces.
|
|
|
202
238
|
|
|
203
239
|
```bash
|
|
204
240
|
# 1. bump the version
|
|
205
|
-
$EDITOR pyproject.toml # [project] version = "0.2.
|
|
241
|
+
$EDITOR pyproject.toml # [project] version = "0.2.1"
|
|
206
242
|
|
|
207
243
|
# 2. tag it; the tag must match that version or release.yml stops
|
|
208
|
-
git tag v0.2.
|
|
244
|
+
git tag v0.2.1 && git push origin v0.2.1
|
|
209
245
|
```
|
|
210
246
|
|
|
211
247
|
The tag triggers `release.yml`, which builds, creates the GitHub release with the
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
[Reflex](https://reflex.dev) wrappers for **[React Bits](https://reactbits.dev)** — the
|
|
4
4
|
open-source collection of animated, interactive and customizable React components by
|
|
5
|
-
David Haz. Every one of the **
|
|
5
|
+
David Haz. Every one of the **218 React Bits 2.0 components** (plus 5 sub-components) is
|
|
6
6
|
available as a typed Python component: text animations, animations, UI components,
|
|
7
7
|
animated WebGL backgrounds and the new *Micro* interactions.
|
|
8
8
|
|
|
@@ -59,9 +59,16 @@ Sources are resolved from `REACTBITS_SOURCE_DIR` (a local clone of
|
|
|
59
59
|
[DavidHDev/react-bits](https://github.com/DavidHDev/react-bits)) when set, otherwise from
|
|
60
60
|
GitHub raw files at `REACTBITS_REF` (defaults to the pinned commit).
|
|
61
61
|
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
62
|
+
React Bits 2.0 no longer needs React Router, Chakra UI or Tailwind, so the sources are
|
|
63
|
+
copied as-is with one exception: components that render their own `<canvas>` keep their
|
|
64
|
+
WebGL context on unmount instead of calling `loseContext()`. React StrictMode (on in Reflex
|
|
65
|
+
dev mode) re-runs effects on the same canvas, and a lost context would leave the component
|
|
66
|
+
frozen or blank.
|
|
67
|
+
|
|
68
|
+
Each copy records the React Bits commit it came from in `.reactbits-ref`. When a newer
|
|
69
|
+
version of this package is generated from another commit, existing copies are **not**
|
|
70
|
+
replaced (they may hold your edits), but a warning names them and `reactbits add` lists
|
|
71
|
+
them as `stale`.
|
|
65
72
|
|
|
66
73
|
## The `reactbits` CLI
|
|
67
74
|
|
|
@@ -73,6 +80,28 @@ reactbits add --all # vendor all components (offline / CI
|
|
|
73
80
|
reactbits remove Aurora
|
|
74
81
|
```
|
|
75
82
|
|
|
83
|
+
## Upgrading from 0.1.x (React Bits 1.x → 2.0)
|
|
84
|
+
|
|
85
|
+
0.2.0 wraps React Bits 2.0, which reworked most components. In short:
|
|
86
|
+
|
|
87
|
+
* **Props changed** on most components (renamed, removed or added). React ignores unknown
|
|
88
|
+
props, so check each component's props (`reactbits info <name>`) when upgrading.
|
|
89
|
+
* **Replace the copied sources**: `reactbits add --all --force` in your app (this discards
|
|
90
|
+
local edits to them), or delete `assets/reactbits/` and let it be re-created.
|
|
91
|
+
* **New components (15):** `circular_carousel`, `crystalized_ball`, `dither_veil`,
|
|
92
|
+
`electric_logo`, `flex_carousel`, `flip_card`, `flux_lines`, `gradient_ascii`,
|
|
93
|
+
`holo_card`, `micro_slats`, `paper_crumple`, `pattern_waves`, `shredder`, `tear_ticket`,
|
|
94
|
+
`tech_text`; and the `tilted_card_layer` sub-component.
|
|
95
|
+
* **Moved to Backgrounds:** `antigravity`, `magic_rings`, `magnet_lines` (same factory names).
|
|
96
|
+
* **Removed APIs:** `rb.hyperspeed(preset=...)` (use `curve`, `boosting`, colour props),
|
|
97
|
+
`splash_cursor`'s `SIM_RESOLUTION`-style props, Lanyard/FluidGlass `.glb` assets (the 3D
|
|
98
|
+
geometry is now procedural).
|
|
99
|
+
* **Fewer npm dependencies:** lucide-react, react-icons, Chakra UI, react-router,
|
|
100
|
+
postprocessing, lenis, maath, meshline, face-api.js and @react-three/rapier are gone;
|
|
101
|
+
icons come from Hugeicons.
|
|
102
|
+
* A prop named like a Python builtin gets a trailing underscore, like `from_`:
|
|
103
|
+
`float` → `float_` (`depth_text`, `model_viewer`).
|
|
104
|
+
|
|
76
105
|
## Props, events and children
|
|
77
106
|
|
|
78
107
|
* Props use snake_case and are converted to the React prop names (`animate_by` → `animateBy`,
|
|
@@ -90,7 +119,10 @@ reactbits remove Aurora
|
|
|
90
119
|
* Wrapper components take Reflex children: `rb.fade_content(rx.text("Hi"), blur=True)`.
|
|
91
120
|
* Sub-components: `rb.stepper(rb.step(...), ...)`, `rb.card_swap(rb.card_swap_card(...))`,
|
|
92
121
|
`rb.scroll_stack(rb.scroll_stack_item(...))`, `rb.warm_tooltip_group(...)`.
|
|
93
|
-
* `rb.
|
|
122
|
+
* `rb.tilted_card(rb.tilted_card_layer(..., depth=30), ...)` floats content above the card;
|
|
123
|
+
`rb.step(..., title="Plan")` labels a stepper step.
|
|
124
|
+
* `rb.hyperspeed(curve="racing", boosting=State.loading)` - 2.0 replaced the presets with
|
|
125
|
+
props.
|
|
94
126
|
* Backgrounds and canvas effects fill their parent: give the parent a size and
|
|
95
127
|
`position="relative"`.
|
|
96
128
|
|
|
@@ -99,15 +131,15 @@ docs URL, npm deps) at runtime.
|
|
|
99
131
|
|
|
100
132
|
## Components
|
|
101
133
|
|
|
102
|
-
**Text animations (
|
|
134
|
+
**Text animations (33):** `ascii_text`, `blur_text`, `circular_text`, `count_up`, `curved_loop`, `decrypted_text`, `depth_text`, `echo_text`, `falling_text`, `fold_text`, `fuzzy_text`, `glitch_text`, `gradient_text`, `masked_heading`, `particle_text`, `rotating_text`, `scrambled_text`, `scroll_float`, `scroll_reveal`, `scroll_velocity`, `shiny_text`, `shuffle`, `split_flap_text`, `split_text`, `stroke_text`, `tech_text`, `text_cursor`, `text_loop`, `text_pressure`, `text_type`, `true_focus`, `variable_proximity`, `warp_text`
|
|
103
135
|
|
|
104
|
-
**Animations (38):** `animated_content`, `
|
|
136
|
+
**Animations (38):** `animated_content`, `blob_cursor`, `click_spark`, `crosshair`, `crystalized_ball`, `cubes`, `cursor_grid`, `dither_veil`, `elastic_mesh`, `electric_border`, `electric_logo`, `fade_content`, `ghost_cursor`, `glare_hover`, `glow_cursor`, `gradual_blur`, `halftone_reveal`, `image_trail`, `laser_flow`, `logo_loop`, `magnet`, `meta_balls`, `metallic_paint`, `noise`, `orbit_images`, `pixel_swap`, `pixel_trail`, `pixel_transition`, `ribbons`, `ripple_distortion`, `scroll_expand`, `shape_blur`, `splash_cursor`, `star_border`, `sticker_peel`, `strands`, `swarm_cursor`, `target_cursor`
|
|
105
137
|
|
|
106
|
-
**Components (
|
|
138
|
+
**Components (48 + 4 sub-components):** `accordion_gallery`, `animated_list`, `border_glow`, `bounce_cards`, `bubble_menu`, `card_nav`, `card_swap`, `card_swap_card`, `carousel`, `chroma_grid`, `circular_carousel`, `circular_gallery`, `counter`, `curved_input`, `decay_card`, `depth_carousel`, `dock`, `dome_gallery`, `drift_wall`, `elastic_slider`, `flex_carousel`, `flowing_menu`, `fluid_glass`, `flying_posters`, `folder`, `glass_icons`, `glass_surface`, `gooey_nav`, `holo_card`, `infinite_menu`, `infinite_spiral`, `lanyard`, `line_sidebar`, `magic_bento`, `masonry`, `model_viewer`, `morph_slider`, `option_wheel`, `pill_nav`, `pixel_card`, `profile_card`, `reflective_card`, `scroll_stack`, `scroll_stack_item`, `specular_button`, `spotlight_card`, `stack`, `staggered_menu`, `step`, `stepper`, `tilted_card`, `tilted_card_layer`
|
|
107
139
|
|
|
108
|
-
**Backgrounds (
|
|
140
|
+
**Backgrounds (64):** `acid_squares`, `aero_shards`, `antigravity`, `aurora`, `balatro`, `ballpit`, `beams`, `color_bends`, `crt_warp`, `dark_veil`, `dither`, `dot_field`, `dot_grid`, `evil_eye`, `faulty_terminal`, `ferrofluid`, `floating_lines`, `flux_lines`, `galaxy`, `ghost_fibers`, `gradient_ascii`, `gradient_blinds`, `gradient_waves`, `grainient`, `grid_distortion`, `grid_motion`, `grid_scan`, `hyperspeed`, `iridescence`, `letter_glitch`, `light_pillar`, `light_rays`, `light_tunnel`, `lightfall`, `lightning`, `line_waves`, `liquid_chrome`, `liquid_ether`, `magic_rings`, `magnet_lines`, `micro_slats`, `molten_metal`, `orb`, `particles`, `pattern_waves`, `pixel_blast`, `pixel_snow`, `plasma`, `plasma_wave`, `prism`, `prismatic_burst`, `radar`, `ripple_grid`, `scanner`, `shape_grid`, `shape_waves`, `side_rays`, `silk`, `sliced_waves`, `soft_aurora`, `threads`, `topography`, `waves`, `web_threads`
|
|
109
141
|
|
|
110
|
-
**Micro interactions (
|
|
142
|
+
**Micro interactions (35 + 1 sub-component):** `bell_toggle`, `branched_menu`, `call_chip`, `code_slots`, `comet_dial`, `dodge_field`, `flip_card`, `flying_button`, `folder_float`, `fuse_button`, `glide_select`, `hold_button`, `jelly_radio`, `lattice_loader`, `paper_crumple`, `peek_rating`, `prompt_bar`, `pulse_heart`, `refine_frame`, `rubber_segment`, `scrub_field`, `shredder`, `slide_commit`, `sling_button`, `slosh_gauge`, `spring_check`, `squish_switch`, `status_mark`, `swipe_row`, `swipe_toast`, `tear_ticket`, `thought_line`, `voice_pill`, `wake_slider`, `warm_tooltip`, `warm_tooltip_group`
|
|
111
143
|
|
|
112
144
|
Full docs, previews and prop descriptions for each component live at
|
|
113
145
|
[reactbits.dev](https://reactbits.dev).
|
|
@@ -116,7 +148,8 @@ Full docs, previews and prop descriptions for each component live at
|
|
|
116
148
|
|
|
117
149
|
`reactbits_demo/` is a gallery with a page per component (live preview, replay, event
|
|
118
150
|
log wired to Reflex state, generated Python usage and the props table), a playground
|
|
119
|
-
where props are bound to state vars,
|
|
151
|
+
where props are bound to state vars, a *What's new in 2.0* page with live previews of
|
|
152
|
+
every new component, and a landing page built only with React Bits.
|
|
120
153
|
|
|
121
154
|
```bash
|
|
122
155
|
uv sync --extra dev
|
|
@@ -137,6 +170,9 @@ python scripts/generate_wrappers.py scripts/components.json /tmp/react-bits
|
|
|
137
170
|
```
|
|
138
171
|
|
|
139
172
|
Update `PINNED_REF` in `custom_components/reflex_reactbits/source.py` to the new commit.
|
|
173
|
+
If `git diff --stat <old> <new> -- src/content` only adds files (new components), add the
|
|
174
|
+
old commit to `COMPATIBLE_REFS` next to it, so copies apps already vendored from it are not
|
|
175
|
+
reported as stale; if any existing component changed, empty that set instead.
|
|
140
176
|
|
|
141
177
|
## Development
|
|
142
178
|
|
|
@@ -169,10 +205,10 @@ given pull request introduces.
|
|
|
169
205
|
|
|
170
206
|
```bash
|
|
171
207
|
# 1. bump the version
|
|
172
|
-
$EDITOR pyproject.toml # [project] version = "0.2.
|
|
208
|
+
$EDITOR pyproject.toml # [project] version = "0.2.1"
|
|
173
209
|
|
|
174
210
|
# 2. tag it; the tag must match that version or release.yml stops
|
|
175
|
-
git tag v0.2.
|
|
211
|
+
git tag v0.2.1 && git push origin v0.2.1
|
|
176
212
|
```
|
|
177
213
|
|
|
178
214
|
The tag triggers `release.yml`, which builds, creates the GitHub release with the
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
"""Reflex wrappers for React Bits (https://reactbits.dev)."""
|
|
2
|
+
|
|
3
|
+
from .animations import *
|
|
4
|
+
from .backgrounds import *
|
|
5
|
+
from .base import ReactBitsComponent
|
|
6
|
+
from .catalog import CATALOG, find_component
|
|
7
|
+
from .components import *
|
|
8
|
+
from .micro import *
|
|
9
|
+
from .source import ensure_component_source
|
|
10
|
+
from .text_animations import *
|
|
11
|
+
|
|
12
|
+
__all__ = ['CATALOG', 'ASCIIText', 'AccordionGallery', 'AcidSquares', 'AeroShards', 'AnimatedContent', 'AnimatedList', 'Antigravity', 'Aurora', 'Balatro', 'Ballpit', 'Beams', 'BellToggle', 'BlobCursor', 'BlurText', 'BorderGlow', 'BounceCards', 'BranchedMenu', 'BubbleMenu', 'CRTWarp', 'CallChip', 'CardNav', 'CardSwap', 'CardSwapCard', 'Carousel', 'ChromaGrid', 'CircularCarousel', 'CircularGallery', 'CircularText', 'ClickSpark', 'CodeSlots', 'ColorBends', 'CometDial', 'CountUp', 'Counter', 'Crosshair', 'CrystalizedBall', 'Cubes', 'CursorGrid', 'CurvedInput', 'CurvedLoop', 'DarkVeil', 'DecayCard', 'DecryptedText', 'DepthCarousel', 'DepthText', 'Dither', 'DitherVeil', 'Dock', 'DodgeField', 'DomeGallery', 'DotField', 'DotGrid', 'DriftWall', 'EchoText', 'ElasticMesh', 'ElasticSlider', 'ElectricBorder', 'ElectricLogo', 'EvilEye', 'FadeContent', 'FallingText', 'FaultyTerminal', 'Ferrofluid', 'FlexCarousel', 'FlipCard', 'FloatingLines', 'FlowingMenu', 'FluidGlass', 'FluxLines', 'FlyingButton', 'FlyingPosters', 'FoldText', 'Folder', 'FolderFloat', 'FuseButton', 'FuzzyText', 'Galaxy', 'GhostCursor', 'GhostFibers', 'GlareHover', 'GlassIcons', 'GlassSurface', 'GlideSelect', 'GlitchText', 'GlowCursor', 'GooeyNav', 'GradientASCII', 'GradientBlinds', 'GradientText', 'GradientWaves', 'GradualBlur', 'Grainient', 'GridDistortion', 'GridMotion', 'GridScan', 'HalftoneReveal', 'HoldButton', 'HoloCard', 'Hyperspeed', 'ImageTrail', 'InfiniteMenu', 'InfiniteSpiral', 'Iridescence', 'JellyRadio', 'Lanyard', 'LaserFlow', 'LatticeLoader', 'LetterGlitch', 'LightPillar', 'LightRays', 'LightTunnel', 'Lightfall', 'Lightning', 'LineSidebar', 'LineWaves', 'LiquidChrome', 'LiquidEther', 'LogoLoop', 'MagicBento', 'MagicRings', 'Magnet', 'MagnetLines', 'MaskedHeading', 'Masonry', 'MetaBalls', 'MetallicPaint', 'MicroSlats', 'ModelViewer', 'MoltenMetal', 'MorphSlider', 'Noise', 'OptionWheel', 'Orb', 'OrbitImages', 'PaperCrumple', 'ParticleText', 'Particles', 'PatternWaves', 'PeekRating', 'PillNav', 'PixelBlast', 'PixelCard', 'PixelSnow', 'PixelSwap', 'PixelTrail', 'PixelTransition', 'Plasma', 'PlasmaWave', 'Prism', 'PrismaticBurst', 'ProfileCard', 'PromptBar', 'PulseHeart', 'Radar', 'ReactBitsComponent', 'RefineFrame', 'ReflectiveCard', 'Ribbons', 'RippleDistortion', 'RippleGrid', 'RotatingText', 'RubberSegment', 'Scanner', 'ScrambledText', 'ScrollExpand', 'ScrollFloat', 'ScrollReveal', 'ScrollStack', 'ScrollStackItem', 'ScrollVelocity', 'ScrubField', 'ShapeBlur', 'ShapeGrid', 'ShapeWaves', 'ShinyText', 'Shredder', 'Shuffle', 'SideRays', 'Silk', 'SlicedWaves', 'SlideCommit', 'SlingButton', 'SloshGauge', 'SoftAurora', 'SpecularButton', 'SplashCursor', 'SplitFlapText', 'SplitText', 'SpotlightCard', 'SpringCheck', 'SquishSwitch', 'Stack', 'StaggeredMenu', 'StarBorder', 'StatusMark', 'Step', 'Stepper', 'StickerPeel', 'Strands', 'StrokeText', 'SwarmCursor', 'SwipeRow', 'SwipeToast', 'TargetCursor', 'TearTicket', 'TechText', 'TextCursor', 'TextLoop', 'TextPressure', 'TextType', 'ThoughtLine', 'Threads', 'TiltedCard', 'TiltedCardLayer', 'Topography', 'TrueFocus', 'VariableProximity', 'VoicePill', 'WakeSlider', 'WarmTooltip', 'WarmTooltipGroup', 'WarpText', 'Waves', 'WebThreads', 'accordion_gallery', 'acid_squares', 'aero_shards', 'animated_content', 'animated_list', 'antigravity', 'ascii_text', 'aurora', 'balatro', 'ballpit', 'beams', 'bell_toggle', 'blob_cursor', 'blur_text', 'border_glow', 'bounce_cards', 'branched_menu', 'bubble_menu', 'call_chip', 'card_nav', 'card_swap', 'card_swap_card', 'carousel', 'chroma_grid', 'circular_carousel', 'circular_gallery', 'circular_text', 'click_spark', 'code_slots', 'color_bends', 'comet_dial', 'count_up', 'counter', 'crosshair', 'crt_warp', 'crystalized_ball', 'cubes', 'cursor_grid', 'curved_input', 'curved_loop', 'dark_veil', 'decay_card', 'decrypted_text', 'depth_carousel', 'depth_text', 'dither', 'dither_veil', 'dock', 'dodge_field', 'dome_gallery', 'dot_field', 'dot_grid', 'drift_wall', 'echo_text', 'elastic_mesh', 'elastic_slider', 'electric_border', 'electric_logo', 'ensure_component_source', 'evil_eye', 'fade_content', 'falling_text', 'faulty_terminal', 'ferrofluid', 'find_component', 'flex_carousel', 'flip_card', 'floating_lines', 'flowing_menu', 'fluid_glass', 'flux_lines', 'flying_button', 'flying_posters', 'fold_text', 'folder', 'folder_float', 'fuse_button', 'fuzzy_text', 'galaxy', 'ghost_cursor', 'ghost_fibers', 'glare_hover', 'glass_icons', 'glass_surface', 'glide_select', 'glitch_text', 'glow_cursor', 'gooey_nav', 'gradient_ascii', 'gradient_blinds', 'gradient_text', 'gradient_waves', 'gradual_blur', 'grainient', 'grid_distortion', 'grid_motion', 'grid_scan', 'halftone_reveal', 'hold_button', 'holo_card', 'hyperspeed', 'image_trail', 'infinite_menu', 'infinite_spiral', 'iridescence', 'jelly_radio', 'lanyard', 'laser_flow', 'lattice_loader', 'letter_glitch', 'light_pillar', 'light_rays', 'light_tunnel', 'lightfall', 'lightning', 'line_sidebar', 'line_waves', 'liquid_chrome', 'liquid_ether', 'logo_loop', 'magic_bento', 'magic_rings', 'magnet', 'magnet_lines', 'masked_heading', 'masonry', 'meta_balls', 'metallic_paint', 'micro_slats', 'model_viewer', 'molten_metal', 'morph_slider', 'noise', 'option_wheel', 'orb', 'orbit_images', 'paper_crumple', 'particle_text', 'particles', 'pattern_waves', 'peek_rating', 'pill_nav', 'pixel_blast', 'pixel_card', 'pixel_snow', 'pixel_swap', 'pixel_trail', 'pixel_transition', 'plasma', 'plasma_wave', 'prism', 'prismatic_burst', 'profile_card', 'prompt_bar', 'pulse_heart', 'radar', 'refine_frame', 'reflective_card', 'ribbons', 'ripple_distortion', 'ripple_grid', 'rotating_text', 'rubber_segment', 'scanner', 'scrambled_text', 'scroll_expand', 'scroll_float', 'scroll_reveal', 'scroll_stack', 'scroll_stack_item', 'scroll_velocity', 'scrub_field', 'shape_blur', 'shape_grid', 'shape_waves', 'shiny_text', 'shredder', 'shuffle', 'side_rays', 'silk', 'sliced_waves', 'slide_commit', 'sling_button', 'slosh_gauge', 'soft_aurora', 'specular_button', 'splash_cursor', 'split_flap_text', 'split_text', 'spotlight_card', 'spring_check', 'squish_switch', 'stack', 'staggered_menu', 'star_border', 'status_mark', 'step', 'stepper', 'sticker_peel', 'strands', 'stroke_text', 'swarm_cursor', 'swipe_row', 'swipe_toast', 'target_cursor', 'tear_ticket', 'tech_text', 'text_cursor', 'text_loop', 'text_pressure', 'text_type', 'thought_line', 'threads', 'tilted_card', 'tilted_card_layer', 'topography', 'true_focus', 'variable_proximity', 'voice_pill', 'wake_slider', 'warm_tooltip', 'warm_tooltip_group', 'warp_text', 'waves', 'web_threads']
|