portal_labs 0.34.0

A curated collection of premium, zero-dependency Flutter UI components and experimental interactions. Built with 100% vanilla Flutter/Dart.

Portal Labs

A specialized collection of 40+ premium, high-performance, and dependency-free Flutter UI components and advanced interactions. Built exclusively with vanilla Flutter and Dart to ensure maximum portability and long-term stability.

🌐 Live Demo

Design Philosophy

The Portal Labs architecture is centered around three core pillars: performance, portability, and visual excellence. By adhering to a strict "zero-dependency" technical policy, we ensure that every component remains lightweight and compatible across all Flutter-supported platforms.

Technical Constraints

To maintain a clean architecture and eliminate overhead, this repository follows these engineering standards:

• SDK-Only Foundation: Components are developed using only core Flutter and Dart libraries.
• Internal Utilites: Formatting, text measurement, and specialized date logic are centralized in PortalUtils to avoid external packages like intl.
• Custom Design System: Icons and typography leverage system defaults and Material Design standards, removing the need for google_fonts or third-party icon sets.
• Native Animation Engine: Complex physics and mechanical transitions (e.g., 3D flips, magnetic snapping) are implemented using standard AnimationController and Tween sequences.

This strategy makes every component instantly portable—allowing developers to integrate the full library or copy individual source files without managing external versioning conflicts.

Component Library

#	Component	Description	Technical Scope	Location
1	Reveal & Copy	Secure data masking with scramble reveal and clipboard animation.	Interaction	lib/src/reveal_and_copy
2	Modern Weight Picker	Precision scrollable ruler with magnetic snapping and haptic feedback.	Numeric Input	lib/src/weight_picker
3	Premium Choice Chips	Animated multi-selection system with flying media transitions.	Selection	lib/src/premium_choice_chips
4	Journal Navigation	Vertical date-based navigation with 3D flip counters and snapping transitions.	Navigation	lib/src/journal_navigation
5	Card Splitting Accordion	Dynamic grouping interaction with physical splitting and variable corner radii.	Layout	lib/src/card_splitting_accordion
6	Adaptive Slider	Value-aware gradient slider with real-time color morphing.	Interaction	lib/src/adaptive_slider_interaction
7	Range Selection Slider	Premium bi-directional range selector with mechanical Odometer-style counters and manual input support.	Selection	lib/src/range_selection_slider
8	Subscription Picker	High-fidelity pricing selector with minimalist monthly/yearly toggle logic.	Selection	lib/src/subscription_pricing_picker
9	Media Collapsible View	Reels-inspired video background with dynamic collapsible interactive sheet.	Interaction	lib/src/media_collapsible_view
10	High-Fidelity Knob Slider	Premium tactile knob with mathematical delta tracking and mechanical reel digits.	Interaction	lib/src/knob_slider
11	Card Stack Interaction	Premium chronological card stack with symmetric expansion and high-fidelity transitions.	Interaction	lib/src/card_stack_interaction
12	Discrete Tabs	Minimalist pill expanding tabs with aesthetic bounce, shimmer text, and managed state.	Interaction	lib/src/discrete_tabs
13	Split Button Interaction	Premium morphing action menu with synchronized action slide, elastic pop bounce, and motion blur emergence.	Navigation	lib/src/split_button_interaction
14	Morphing Input Button	Premium button that morphs into a text input with a soft-focus reveal effect.	Interaction	lib/src/morphing_input_button
15	Scratch to Reveal	High-fidelity physical scratching simulation to disclose hidden rewards.	Interaction	lib/src/scratch_to_reveal
16	Split to Edit	Premium duration picker that splits into editable segments with a bounce transition.	Interaction	lib/src/split_to_edit
17	Modern Fractional Picker	Precision horizontal ruler for numeric input with support for integer/decimal steps and magnetic snapping.	Numeric Input	lib/src/fractional_picker
18	Discovery Bar	Premium morphing search and discovery component with elastic containers and micro-scale interactions.	Interaction	lib/src/discovery_bar
19	Labeled Progress Indicator	Premium labeled progress indicator with tranquil transitions and customizable stages.	Interaction	lib/src/labeled_progress_indicator
20	Quick Switcher	Premium togglable search bar with pulse animations and aesthetic input transitions.	Interaction	lib/src/quick_switcher
21	Stacked Toast Interaction	Premium chronological toast stack that appears from the top with high-fidelity transitions and symmetric stacking.	Interaction	lib/src/stacked_toast_interaction
22	Disclosure Switch	Premium switch that reveals additional nested content with a gradient track and smooth size animations.	Interaction	lib/src/disclosure_switch
23	Pinnable List	Premium dual-section list with Apple-style "flight" physics and dynamic self-measuring displacement animations.	Interaction	lib/src/pinnable_list
24	Todo List Interaction	High-fidelity task management with concentric "Island" design and choreographed diagonal flight physics.	Interaction	lib/src/todo_list_interaction
25	Slot Picker Interaction	Premium availability picker with spring physics, real-time collision detection, and smart validation.	Interaction	lib/src/slot_picker_interaction
26	Tag Selection Interaction	Premium "Magic Move" tag selection with zero-dependency Apple-inspired spring physics and fluid wrapping.	Interaction	lib/src/tag_selection_interaction
27	Collapsible Notify Panel	Premium spring-based notification panel with staggered entry and header summaries.	Layout	lib/src/collapsible_notification_panel
28	Premium Stepper	Minimalist tactile stepper with mechanical flip animations and full layout customization.	Numeric Input	lib/src/premium_stepper
29	Premium Pagination	Tactile navigation with mechanical flip animations and automatic layout stability.	Navigation	lib/src/premium_pagination
30	Currency Swap	Premium currency conversion interface with custom dropdowns and real-time flip counters.	Interaction	lib/src/currency_swap_interaction
31	Premium Progress Stepper	High-fidelity multi-step indicator with physics-based spring animations and tactile button feedback.	Interaction	lib/src/premium_progress_stepper
32	Inline Delete Interaction	Premium interaction with inline destructive confirmation, glassmorphism, and staggered entrance.	Interaction	lib/src/inline_delete_interaction
33	Feedback Interaction	Premium physics-based feedback system with asymmetric spring morphing and liquid transitions.	Interaction	lib/src/feedback_interaction
34	Loading Shapes	Premium physics-based loading indicator that morphs between organic and geometric shapes with subtle rotation.	Layout	lib/src/loading_shapes
35	Signature Draw Pad	Premium high-fidelity signature pad with playback animations, "Blur-Fade" transitions, and PNG export.	Interaction	lib/src/signature_draw_pad
36	Sortable Grid	Physics-based reorderable grid with smooth layout transitions and haptic feedback.	Layout	lib/src/premium_sortable_grid
37	Cinematic Text Transition	Sophisticated text transition with sequential character physics for premium headers.	Interaction	lib/src/cinematic_text_transition
38	Archive Folder	Premium glassmorphic folder interaction with staggered item reveal and physics-based motion.	Interaction	lib/src/archive_folder
39	Folder Tabs	Physics-driven Manila file folder tab container with organic S-curves and dynamic proximity-based tab dissolving.	Layout	lib/src/folder_tabs
40	Physics Collision Card	Interactive 2D physics simulation container. Drag and toss elements to collide elastically with boundaries.	Interaction	lib/src/physics_collision_card
41	Coverflow Carousel	Premium 3D Coverflow carousel with Y/X axis rotation, programmatic controllers, gestural controls, and dual-orientation support.	Interaction	lib/src/coverflow_carousel
42	Stacked Cards	Premium gesture-driven stacked card carousel with horizontal swiping, spring snapping, and rotation.	Interaction	lib/src/stacked_cards
43	Quick Picker Interaction	Premium option selector dropdown with sliding segmented capsule, cinematic text sweep, and icon blur transitions.	Interaction	lib/src/quick_picker_interaction
44	Circular Color Picker	Premium circular color selector with spring-based center-bound sliding and smooth slide-back animations.	Interaction	lib/src/circular_color_picker
45	Slider Control	Premium vertical pill-shaped slider with a gradient fill, floating value badge, and snap mechanics.	Numeric Input	lib/src/slider_control
46	Score Gauge	Animated semicircular gauge for credit/security scores with a sliding pointer and segmented strength indicator.	Status Display	lib/src/score_gauge
47	Bloom Color Picker	Premium color picker with a "Bloom" concentric peeling expansion, radial dual-ring swatches, and arc lightness slider.	Selection	lib/src/bloom_color_picker
48	Scrollable Subgroups	Premium scrollable list widget that groups items under sticky section headers, built entirely on Slivers.	Layout	lib/src/scrollable_subgroups

💡 Tip: Click on any component's name in the table above to view its live demonstration GIF, key features, and integration code snippet.

Getting Started

Add portal_labs as a dependency in your pubspec.yaml:

dependencies:
  portal_labs:
    path: ./ # Or your package location

Or run the following command:

flutter pub add portal_labs

---

Contributing

Contributions focusing on performance optimization, new interaction patterns, or accessibility improvements are welcome. Please ensure all submissions adhere to the SDK-only dependency policy.