Skip to content
Change the site theme
Figma
(information)
  • 2022.09.06
  • 2022.10.18 Candidate
  • 2022.11.29 Candidate
  • 2023.01.10 Candidate
  • 2023.02.21 Candidate
  • 2023.04.04 Candidate
  • 2023.05.16 Candidate
  • 2023.06.27 Candidate
  • Backlog

Roadmap

Here's a glimpse of what is coming up in future releases of Paste. Unless explicitly mentioned, all release candidates are tentative and subject to change.

2022.09.06

2022.09.06 page anchor
FeatureDescriptionStatus
Circle variant of the Button componentA Button component variant primarily used in call or dialling user interfaces
CompleteComplete
Publish rounded small variant of the Button component in Figma
CompleteComplete
Toggle Button componentA Button that supports two states, pressed and unpressed similar to a like button
CompleteComplete
Code Block componentNon-editable block of text, formatted in the code text style and with syntax highlighting.
In progressIn progress
Combobox component, refinedA combobox is a UI control used while presenting a styled, templated options list. It can allow for additional functionality like typeahead.
In progressIn progress
Contact Center icon setA collection of icons are added for use in contact center environments.
In progressIn progress
Multiselect Combobox componentA combobox that can be used to select multiple items.
In progressIn progress
Run customer research for design language conceptsFinalize two directions and apply to necessary screens for research. Run research for our two design language concepts.
In progressIn progress
Toggle Switch componentUsed to toggle a feature on or off
In progressIn progress
Callout componentA component that can be used to highlight important, inline information in long page content
To doTo do
Conversations API Figma UI KitFigma UI library containing components that can be used to design conversational UIs using Paste
To doTo do
Inline Code componentA component used to display important inline code snippets, such as SIDs, IDs and API keys
To doTo do
Non-Modal Dialog componentA small, minimizable non-modal dialog that is fixed or anchored to the bottom of the screen
To doTo do
Status variants of the Help Text componentVariants that enable the display of warning, success or informational Help Text
To doTo do
FeatureDescriptionStatus
Button Group componentA group of connected Buttons
To doTo do
Chat Composer componentA Rich Text Editor used to compose chat messages in conversational UI
To doTo do
Conversations API UI KitOfficial launch of the Paste Conversations API UI kit
To doTo do
Design the Conversations API UI Kit landing pageLanding page for Conversation UI kit that lives on the Paste website
To doTo do
File Input componentInput component used to upload or attach files
To doTo do
Modal component, side variantModal Dialog that covers one side of screen
To doTo do
Publish circle variant of Button in FigmaMake circle buttons available in the Paste Figma library
To doTo do
Radio Button Group componentA group of radio buttons that look like a Button Group
To doTo do
FeatureDescriptionStatus
Avatar component, Square variantA new variant for the Avatar Component that creates a square shape
To doTo do
Description List componentThe classic Description List component. The pairing of a Term and a Description, often in a key, value pair
To doTo do
Display Text ComponentTypographic guidelines for large text meant to be used for marketing, storytelling, or attention-grabbing contexts, like displaying numbers on a dashboard layout. These typically fall outside of the normal use cases for the standard Heading component.
To doTo do
Dropzone componentA component used as the visual target for a drag and drop interaction
To doTo do
Form page templatesA group of components with sensible defaults used to quickly layout forms in a consistent manor
To doTo do
Publish Spinner in FigmaMake the Spinner component available in the Paste Figma library
To doTo do
Send out H2 2022 CSAT surveyCheck in with our internal customers to gauge our customer satisfaction
To doTo do
Tokens for React NativeProvide React Native developers a way to use Paste Design Tokens
To doTo do
FeatureDescriptionStatus
Copy to Clipboard patternHow to enable a user to copy a snippet of text, such as an API key or code block.
To doTo do
Design typography components for small, detail, and caption text stylesComponent for creating supplementary UI text
To doTo do
One Twilio: Design Language updateLaunch of the new One Twilio Design Language update that will be available via Paste. A cohesive design language to unify Twilio, Segment and SendGrid products
To doTo do
One Twilio: Design language guidelinesDesign Guidelines to accompany the new One Twilio Design Language
To doTo do
Tabs component, refinedTabs are used to separate content into different logical sections.
To doTo do
Typography components for small, detail, and caption textComponent for creating supplementary UI text
To doTo do
FeatureDescriptionStatus
Drag and Drop PatternPatterns for creating Drag and Drop user interface experiences
To doTo do
Menu component, refinedA menu presents a list of menu items that a user can choose to perform an action with.
To doTo do
One Twilio: Design global navigation compositionsA collection of components that can be used to build shared, global navigation patterns for Twilio, Segment and SendGrid applications.
To doTo do
Popover component, refinedA Popover is used to display some content on top of another. It is typically invoked by a click action.
To doTo do
FeatureDescriptionStatus
Data Grid component, refinedInteractive data tables, that include selection, sorting, editing
To doTo do
Navigation UI KitUI Kit to create cohesive and consistent application navigation
To doTo do
Navigation UI Kit for Figma
To doTo do
One Twilio: Global Navigation Design Composition
To doTo do
Tooltip component, refinedA Tooltip is a small contextual overlay that allows you to give further clarification to text or UI controls.
To doTo do
FeatureDescriptionStatus
Alert Dialog component, refinedUsed to confirm an action made by the user. Used to prevent exiting a form in a modal without saving changes
To doTo do
Avatar component, refinedAvatar is a pictorial representation of a user or object 👩‍🎤. It can accept an image or initials.
To doTo do
Breadcrumb component, refined
To doTo do
Checkbox Button componentA group of checkboxes that look like a Button Group
To doTo do
Date Picker component, refined
To doTo do
Time Picker component, refined
To doTo do
FeatureDescriptionStatus
Callout component, refined
To doTo do
Code Block component, refined
To doTo do
Disclosure component, refined
To doTo do
Inline Code component, refined
To doTo do
Skeleton Loader component, refined
To doTo do
Toggle Button component, refined
To doTo do
Toggle Switch component, refined
To doTo do
FeatureDescriptionStatus
Accordion componentUsed to expand and collapse a collection of grouped sections of content
To doTo do
Accordion primitiveAn unstyled functional primitive that is used for the Accordion component, or to roll your own implementation.
To doTo do
Add interactivity to 10 Figma componentsStart making our Figma component library interactive, now that Interactive Components are out of beta.
To doTo do
Add interactivity to 10 more Figma componentsContinue making our Figma component library interactive, now that Interactive Components are out of beta.
To doTo do
Alert / Status primitiveA primitive component used to create Alerts or Status components
To doTo do
Avatar component with presence indicator
To doTo do
Blockquote componentA component used to display quotes
To doTo do
Build Design Foundations - Layout/Spacing
To doTo do
Build Design Foundations - Typography
To doTo do
Build new design Getting Started pagesRebuild the Design Getting Started pages with new content
To doTo do
Build new overview page template
To doTo do
Build new pattern page template
To doTo do
Card Layout patternA collection of patterns related to creating Card based user interfaces and layouts
To doTo do
Card actions group Patterns to use when displaying actions that be placed upon a single or group of Cards
To doTo do
Carousel componentA component used to display a collection of images or graphics
To doTo do
Code Editor / Code Editor themeA component used to create editable, syntax highlighted blocks of code
To doTo do
Color Picker componentA component used to pick and select a color
To doTo do
Configure dev container for GH codespacesSeemlessly enable Developers to work on Paste using Github codespaces and developer containers, with no local set up
To doTo do
Customization research plan / UX platform
To doTo do
Data Grid sort
To doTo do
Data Grid table actionsA composition of components to use when wanting to perform an action on a single row
To doTo do
Data Grid with fixed/locked column
To doTo do
Data Visualization patternPatterns and guidelines around the types of charts, colors, and treatments that can be used when creating Data Visualizations
To doTo do
Data Visualization, Maps patternA pattern surrounding the data visualization of geographic data
To doTo do
Data upload patternHow to move a file or dataset out of Twilio
To doTo do
Date Range Picker componentAllows users to pick a date range from a calendar
To doTo do
Date and Time Picker componentA component that allows users to pick a single date and time from a calendar
To doTo do
Date and Time Range Picker component
To doTo do
Design Foundations - Layout/SpacingCreate guidelines for using spacing and creating layouts within Twilio products.
To doTo do
Design Foundations - TypographyCreate guidelines for using typography and creating hierarchy within Twilio products.
To doTo do
Design Toolbar ComponentA component used to group related actions
To doTo do
Directional Modal component
To doTo do
Edit pattern
To doTo do
Emoji component
To doTo do
Errors, error states and warning states patternCan be used in situations where data is empty error states
To doTo do
Feed primitive
To doTo do
Form fields, small
To doTo do
Hyphenate component
To doTo do
Icons, country flags
To doTo do
Illustration component
To doTo do
Image component
To doTo do
Improve SVG to React Documentation
To doTo do
Inline Edit pattern
To doTo do
Keyboard Shortcut componentA component use to represent a keyboard key
To doTo do
Kickoff Prototyping Kit refinement
To doTo do
Listbox primitive
To doTo do
Live Region primitive
To doTo do
Loading patternDefine Spinner vs. Skeleton Loader
To doTo do
Meter componentA component used a to show a unit of measure between two defined values
To doTo do
Modal component, full screen variantModal Dialog that covers then entire screen
To doTo do
Motion systemAdds standardized visual effects to a component
To doTo do
Number Input component with stylized buttonsInput that limits data to number entry and has styled +/- buttons
To doTo do
Onboarding pattern
To doTo do
Ordered List component, stylized variant
To doTo do
Overview page redesign
To doTo do
Page Header patternCompositional examples of headings, breadcrumbs, and page level actions
To doTo do
Permissions pattern
To doTo do
Portal componentA primitive component used to render transitory elements outside the main DOM hierarchy
To doTo do
Positioner libraryA utility library used to position floating elements on the screen in relation to the window and other elements that may have triggered its appearance
To doTo do
Progress Bar componentCommunicates task or loading completion
To doTo do
Progress Stepper componentLabels and communicates steps and progression through a linear workflow
To doTo do
Publish Tooling section to docs site
To doTo do
Publish contribution guide for Ideas and FeedbackExplore all the different ways folks can contribute to Paste. It's not just a full component or design pattern, end-to-end
To doTo do
RTL language support for i18n
To doTo do
Rebuild overview pages
To doTo do
Rewrite and redesign design Getting Started pagesReimagine our Design Getting Started pages to better support new and onboarding designers to Twilio and Paste
To doTo do
Search PatternPatterns that can used to create a variety of common search UIs
To doTo do
Slider componentDraggable input over a range of numbers
To doTo do
Summary Detail component
To doTo do
Timeline componentA component used to display a list of events that occurred in chronological order
To doTo do
Toolbar ComponentA component used to group related actions
To doTo do
Toolbar Primitive
To doTo do
Tree Grid componentA component used to display, interact with and navigate hierarchical tabular data
To doTo do
Tree Grid primitiveA primitive to create a table with rows that can expand and show more rows
To doTo do
Tree componentA component to display, interact with and navigate hierarchical data
To doTo do
Treeview primitivePrimitive for creating expandable sections that show hierarchical data
To doTo do
Visual Picker component
To doTo do
Wizard patternHow to take a user through a multi-step flow.
To doTo do

Black lives matter.