UNPKG

@razorpay/blade-mcp

Version:

Model Context Protocol server for Blade

github.com/razorpay/blade

razorpay/blade

33 lines (17 loc) • 2.39 kB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
# When to Use Patterns ## Confirmation A pattern for seeking user confirmation before proceeding with important or irreversible actions. Use this pattern when you need to get explicit user acknowledgment for critical actions like deletions, platform switches, or important changes, with support for different emotional states (neutral, negative, positive) to match the action's impact. ## CreationView CreationView is a pattern used in creation flows to guide users through the process of creating new entities like QR codes, GRNs, or other business objects. Use this pattern when you need structured form flows with validation, preview capabilities, and step-by-step guidance that adapts to different screen sizes. ## DetailedView A DetailedView is a pattern that is used to show details of a transaction, user, or entity in a drawer in a defined format. It can open on click of table row or any button and link on page. ## FormGroup FormGroup is a pattern that provides a consistent way to build forms using Blade components. Use this pattern when you need to create forms with multiple input fields, validation states, different layouts, and consistent spacing between form elements. ## ListView ListView is a pattern that has tables with filters, search, pagination, etc. It uses table component to show the list of items and uses QuickFilter and other ListView components for filtering over the table. ## Settings Settings is a pattern that provides a structured way to organize application configuration options and user preferences. Use this pattern when you need to create a settings interface with navigation, categorized settings cards, and detailed settings pages. The pattern includes both overview and detail views with responsive layouts and accessibility features. ## Dashboard Template Dashboard Template is a full dashboard template with SideNav, TopNav and main workspace area. It also includes a navigation structure with sections and items implemented via react-router-dom. ## Spark Animation Spark Animation combines RazorSense (WebGL glass refraction background) and RazorSenseGradient (animated gradient icon mask) to create rich visual treatments for success states, loading screens, and branded moments. Use this pattern when you need animated WebGL backgrounds with coordinated icon overlays, asset preloading, and framer-motion entrance animations.