Changelog

🔴 Loom Link

Today’s topics

• Enhancement: Calendar and Date Picker simplified in Figma
• New Components:
  • Time Picker: Live inside of Date Picker in Figma
  • Carousel: A carousel with motion and swipe built using Embla.
  • Skeleton: Use to show a placeholder while content is loading.
• Updated tokens:
  • control-border-default aligned with action-outline-border for consistency with their paired usage
• New Tokens:
  • space-90 for 6px spacing
• Enhancement: Focus states on Accordion, Breadcrumb, Hover Card, Navigation Menu, Radio Group, Checkbox, Input, and Toast
• Enhancement:
  • Radio Group now has clearer active states
  • Accordion now has extended items listed in Figma
• Next:
  • 7 new React components, and 4 new Blazor components
  • Enhancements to Checkbox and Radio
  • Documentation!

✨ STUDS Blazor Components Update ✨

• @studs/react v3.0.0 has been released and is now available for use.
• @studs/styles v3.0.0 has been released and is now available for use.
• Studs.Blazor v3.0.0 has been released and is now available for use.

🔴 Loom Link

Today’s topics

• Update: Badge
• New: Badge Notification
• New: Context Menu
• New: Hover Card
• New: Menubar
• New: Navigation Menu

Up next

• Calendar
• Date Picker

🔴 Loom Link

Today’s topics

• New Toast component
• Updated Typography components
• New Figma Text Styles for Body, Header, and Link
• Renamed “Tone” to “Feedback” for our purpose tokens

Please give me feedback here, on Loom, in Confluence, or via owl post! 🦉📬

✨ STUDS Blazor Components Update ✨

• The following components have been added to the Blazor library: StudsTabs, StudsTabNav, and StudsTree
• The following components have been added to the React library: StudsTabs, StudsDropdownMenu

🔴 Loom Link

Today’s topics

• Semantic tokens documentation updated
• New: Toggle - A two-state button that can be either on or off.
• New: Toggle Group - A set of two-state buttons that can be toggled on or off.
• New: Sheet - Extends the Dialog component to display content that complements the main content of the screen.
• New Navbar (Experimental) - Top-level navigation bars for site-wide menu links and actions.
• Exploring App Shells with the product design team on design review - The main wrapper for your entire application layouts

✨ STUDS Blazor Components Update ✨

• The following components have been added to the Blazor library: StudsAvatar, StudsCard, StudsDropdownMenu, StudsLabel, StudsPopup, StudsSelect (originally Dropdown), StudsSwitch, StudsTooltip.
• StudsDropdown has been renamed to StudsSelect to be more consistent with the React library.
• StudsTextBox has been renamed to StudsInput to be more consistent with the React library.

🔴 Loom Link

Today’s topics

• Material Design Icons (SST) Figma library published
• Updated 13 components in Figma to use Material Design Icons (SST) library
• Partnering with product teams
• Next: Continuing to partner with product teams, new components, migration guides, and documentation.

Links from video

• Material Design Icons (SST) Figma library
• BlazingStory
• Storybook
• Anatomy of the STUDS

Please give me feedback here, on Loom, in Confluence, or via owl post! 🦉📬

✨ STUDS Blazor Components Update ✨

• The following components have been added to the Blazor library: StudsProgressBar, StudsComboBox, StudsSlider

🔴 Loom Link

Today’s topics

• 3 new stable components in Figma
• 16 Blazor and React stable components in total
• Next up exploring our how tokens and components can create unique Sidebars for our Product Designers, our developers will be creating 5 new components and migration guides

Links from video

• Dropdown Menu
• Tabs
• Tooltip
• React Storybook
• Blazing Story
• Anatomy of the STUDS

✨ STUDS Styles Components Update ✨

• Styles updated to include utility based css vars, eg. --space-100, --borderWidth-100, etc.
• Updated Color Token names to reflect more descriptive namings. eg. surface-fg has been changed to --surface-primary-foreground

🔴 📹 Loom Link

Today’s topics

• New components

• Opacity tokens

• Bugfixes in Figma and code will be on our documentation site’s changelog

• Next up this sprint we’re working on Table, Data Table and our stretch goal is a Popover, Command, and Combobox component

  Links from Video

  Bugfixes and enhancements

  • Button has updated Loading and Disabled backgrounds for better readability
  • Button hover background more apparent
  • Input updated with new Link colors for Forgot Password Link (example text)
  • New tokens for focus width and color
  • Develoment only tokens for hover, active states on Buttons
  • Fixed Card Figma component content slot component
  • Updated Helvetica Now zip on Assets section of Getting Started to offer OTF not the varaible fonts
  • Space 250 (14px) token added
  • surface-modal-background-color and surface-primary-muted-background-color tokens created

✨ Components Updated ✨

• We’ve updated the components to include properties and API documentation for each component and moved them to their own section of the site.

✨ STUDS Blazor Components Update ✨

• Changed Property ButtonStyle and BadgeStyle value Outlined to Outline to be cohesive with our other component libraries and Styles
• Updated the components StudsAccordion, StudsBadge, StudsButton, StudsCheckBox, StudsDialog, and StudsTextBox to use @studs/styles
• Removed a variety of unused properties from released components to streamline usage and design.

✨ Studs Homepage Changed to Quick Start ✨

• Refined Guide Usage with Telerik to be Blazor exclusive
• Added Usage with Blazor Guide
• Added Usage with React Guide
• Added Usage with Styles Guide

✨ STUDS Structural Inspection Episode 04 is live! ✨

🔴 📹 Loom Link

Today’s topics

• Approach alignment

• Components, components, components!

  Links from Video

✨ Color Palette Updated ✨

• Updated the color page to include a interactive color palette with shades and click to copy functionality.

✨ STUDS Structural Inspection Episode 03 is live! ✨

🔴 📹 Loom Link

Today’s topics

• Variable scopes and Figma component designs

• Process of pressure testing

• Stretch goals for the rest of the sprint

  Links from Video

  Please give me feedback here, on Loom, in Confluence, or via owl post! 🦉📬

✨ STUDS Structural Inspection Episode 02 is live! ✨

🔴 📹 Loom Link

Today’s topics

• Typography foundations and components

• Tokens, and lot of them!

  Links from Video

  Funny aside, I lost my sign off so the video ends abruptly! 😅🤣

Please give me feedback here, on Loom, in Confluence, or via owl post! 🦉📬

✨ STUDS Structural Inspection ✨

— a mid-week report on where we are, and what’s next!

🔴 📹 Loom Link

Today’s topics

• Documentation: Spec sheets

• Process: Density

  Links from Video

  I’m looking forward doing this bi-weekly to keep everyone up to date on the latest from STUDS, and please give me feedback here, on Loom, in Confluence, or via owl post! 🦉