@salesforce-ux/design-system

## Release 2.24.3 - Jun 6, 2024 ## Updated - bump icon version ## Release 2.24.2 - May 2, 2024 ## Components ### [Accordion](https://www.lightningdesignsystem.com/components/accordion) ## Removed - Remove max-width prop from accordion on focus/hover ### [Popovers](https://www.lightningdesignsystem.com/components/popovers) ## Updated - Update Menu Overflow variant margin-left ## Release 2.24.1 - April 25, 2024 ## Updated - Updated focus styles for buttons and input elements - Updated account icon bg to blue-30 ## Release 2.24.0 - April 18, 2024 ## Added - New focus styles incorporated to all components. - Updated icons to `v10.8.3` - Standard Set: - Added account_score - Added aggregate - Added app_form_participant - Added app_form_product_participant - Added cost_model - Added labels - Added list_fee - Added list_rate - Added party_profile - Added path_experiment - Added people_score - Added price_adjustment_schedule - Added price_adjustment_tier - Added program_cohort - Added program_cohort_member - Added rate_adjustment - Added record_consent - Added whatsapp - Utility Set: - Added aggregate - Added array - Added bottom_group_alignment - Added cant_sync - Added center_group_alignment - Added columns - Added fully_synced - Added inner_join - Added join - Added left_join - Added not_in_sync - Added not_saved - Added outer_join - Added path_experiment - Added program_cohort - Added program_cohort_member - Added record_consent - Added right_join - Added skill - Added sync_in_progress - Added top_group_alignment ## Components ### [Combobox](https://www.lightningdesignsystem.com/components/combobox) #### Changed - Updated Combobox blueprint to use `role="option"` on div wrapping loading spinner ### [Progress Indicator](https://www.lightningdesignsystem.com/components/progress-indicator) #### Changed - Updated Progress Step `button` to `div`. - Added tabindex="0" to above `div` to make it focusable. - Removed `aria-describedby` and `title` attributes. - Updated focus style for Web and Mobile. ### [Tooltips](https://www.lightningdesignsystem.com/components/tooltips) #### Changed - Updated Tooltip component description. ## Release 2.23.2 - February 1, 2024 - Moved global styling hooks from slds-wcag class selector to root selector scope. ## Components ### [Modals](https://www.lightningdesignsystem.com/components/modals) #### Changed - Fixed token notation in header padding-right property ## Release 2.23.1 - January 16, 2024 ## Components ### [Pills](https://www.lightningdesignsystem.com/components/pills) ## Changed - Added Button element for `Pill` remove feature. Now remove button is focusable and can be clickable. - Removed non applicable ARIA attributes after markup updates. ## Release 2.23.0 - December 14, 2023 - Inbuilt Header introduced for tabs. The header scales as per the size modifiers. - Updated icons to `v10.8.2` - Standard Set: - Added custody_chain_entry - Added custody_entry_verification - Added custody_override - Updated data_cloud - Added digital_verification_config_group - Added digital_verification_config - Added linked - Added prompt_builder - Added real_time - Added scheduling_workspace_territory - Updated story - Added title_party - Added work_summary - Utility Set: - Added add_above - Added add_below - Updated apex_alt - Added asset_repossessed - Updated data_cloud - Updated einstein_alt - Added locked_with_additions - Added payment_deferred - Added plane - Added prompt_builder - Added real_time - Added record_collection - Added sparkle - Updated `disabled` state colors for all components. - Added `aria-label="disabled"` to `RichTextEditor` component which is similar to `RteToolbar`. - Added Button element for `Pill` remove feature. Now remove button is focusable and can be clickable. - Updated RTL stylings for `setup-assistant` component - Added new shadow styling hook to implement new focus style. ## Components ### [Checkbox Toggle](https://www.lightningdesignsystem.com/components/checkbox-toggle) #### Changed - Updated Checkbox Toggle Focus Style. ### [Color Picker](https://www.lightningdesignsystem.com/components/color-picker) #### Changed - Updated assistive text content. ### [Combobox](https://www.lightningdesignsystem.com/components/combobox) #### Changed - Updated Combobox disabled color ### [Input](https://www.lightningdesignsystem.com/components/input) #### Fixed - Removed wrapping for date input type, which was causing some dates to be cut off. ### [Menus](https://www.lightningdesignsystem.com/components/menus) #### Changed - Updated Dropdown Inverse item disabled color ### [Tabs](https://www.lightningdesignsystem.com/components/tabs) ## Added - Inbuilt Header introduced for tabs. The header scales as per the size modifiers. ## Release 2.22.2 - November 9, 2023 ## Components ### [Setup Assistant](https://www.lightningdesignsystem.com/components/setup-assistant) #### Changed - Moved unscoped .slds-media__figure to setup-assistant rtl styles ## Release 2.22.1 - November 2, 2023 ## Components ### [App Launcher](https://www.lightningdesignsystem.com/components/app-launcher) ### Fixed - App Launcher button is visibility when Windows high-contrast mode is enabled. ### [Checkbox](https://www.lightningdesignsystem.com/components/checkbox) #### Fixed - High contrast when the focus is placed on it. ### [Dynamic Icons](https://www.lightningdesignsystem.com/components/dynamic-icons) #### Fixed - Fixed the app launcher button is invisible When windows high contrast is enabled. ### [Progress Indicator](https://www.lightningdesignsystem.com/components/progress-indicator) #### Fixed - Matching styles for [dir=rtl] added. ### [Setup Assistant](https://www.lightningdesignsystem.com/components/setup-assistant) #### Added - Matching styles for [dir=rtl] added. ### [Summary Detail](https://www.lightningdesignsystem.com/components/summary-detail) #### Fixed - Matching styles for [dir=rtl] added. ## Release 2.22.0 - August 16, 2023 - Updated icons to `v10.7.0` - Standard Set: - Added `attribute_based_pricing` - Added `bundles_pricing` - Added `data_cloud` - Added `data_graph` - Added `dynamic_highlights_panel` - Added `header_discounts` - Added `impact_outcome` - Added `impact_strategy_assignment` - Added `impact_strategy` - Added `indicator_assignment` - Added `indicator_definition` - Added `indicator_performance_period` - Added `indicator_result` - Added `manual_discounts` - Added `no_code_model` - Added `outcome_activity` - Added `panel_detail` - Added `price_adjustment_matrix` - Added `registered_model` - Added `repeaters` - Added `scheduling_workspace` - Updated `story` - Added `time_period` - Added `uploaded_model` - Added `volume_discounts` - Added `walkthroughs` - Utility Set: - Added `apex_alt` - Added `data_cloud` - Added `data_graph` - Added `data_transforms` - Added `guidance` - Added `indicator_performance_period` - Added `mixed_sources_mapping` - Added `page_structure` - Added `visibility_rule_assigned` - Added `walkthroughs` ## Fixed - Updated background colors for Standard and Actions icons - Standard Icons Set - Updated `event` - Updated `dashboard` - Updated `case` - Updated `note` - Updated `contact` - Updated `lead` - Updated `campaign` - Updated `products` - Updated `user` - Updated `contract` - Updated `category` - Updated `catalog` - Updated `store` - Updated `buyer_account` - Updated `buyer_group` - Updated `delegated_account` - Updated `entitlement_policy` ## Components ### [Activity Timeline](https://www.lightningdesignsystem.com/components/activity-timeline) #### Changed - Replaced aria-hidden with hidden attribute for components that show/hide content  ### [Carousel](https://www.lightningdesignsystem.com/components/carousel) #### Changed - Replaced aria-hidden with hidden attribute for components that show/hide content ### [Checkbox Toggle](https://www.lightningdesignsystem.com/components/checkbox-toggle) #### Fixed - Fixed `NVDA` checkbox toggle is announced twice removed aria-live="assertive" ### [Combobox](https://www.lightningdesignsystem.com/components/combobox) #### Added - Tooltip option provided for Date/DateTime pickers. - Updated from tabindex to tabIndex. ### [Data Tables](https://www.lightningdesignsystem.com/components/data-tables) #### Added - Added `font-weight` property in `.slds-is-edited` & `.slds-has-error` to provide secondary indicator for the text - Updated `Accessibility` section in `docs.mdx` documentation file for bold text ### [Data Tables](https://www.lightningdesignsystem.com/components/data-tables) #### Changed - Removed `aria-label` from table header to prevent from reading twice headers. ### [Datepickers](https://www.lightningdesignsystem.com/components/datepickers) #### Added - Added datepicker example with field level tooltip ### [Datetime Picker](https://www.lightningdesignsystem.com/components/datetime-picker) #### Added - Tooltip option provided for Date/DateTime pickers. - Added `slds-datetimepicker_has-tooltip` class to fix the icon misalignment issue. ### [Expandable Section](https://www.lightningdesignsystem.com/components/expandable-section) #### Changed - Replaced aria-hidden with hidden attribute for components that show/hide content ### [Form Element](https://www.lightningdesignsystem.com/components/form-element) #### Changed - Added field level custom message option for tooltip ### [Modals](https://www.lightningdesignsystem.com/components/modals) #### Changed - Optimized full size option and refactored to use CSS grid. - Updated full size variant to trigger at the `$mq-small` breakpoint to prevent larger devices from receiving the variant. ### [Panels](https://www.lightningdesignsystem.com/components/panels) #### Changed - Replaced aria-hidden with hidden attribute for components that show/hide content ### [Progress Ring](https://www.lightningdesignsystem.com/components/progress-ring) #### Fixed - Fixed duplicate IDs by adding helper method ### [Split View](https://www.lightningdesignsystem.com/components/split-view) #### Changed - Replaced aria-hidden with hidden attribute for components that show/hide content ### [Summary Detail](https://www.lightningdesignsystem.com/components/summary-detail) #### Changed - Replaced aria-hidden with hidden attribute for components that show/hide content  ## Release 2.21.5 - July 19, 2023 ## Components ### [Checkbox Toggle](https://www.lightningdesignsystem.com/components/checkbox-toggle) #### Changed - Updated disabled checkbox toggle button color. ## Release 2.21.4 - July 17, 2023 - Updated icons to `v10.6.1` - Utility Set: - Added `edit_gpt` - Updated `einstein` - Added `sparkles` ## Release 2.21.3 - June 29, 2023 ## Fixed - Correction in icons package version. - Updated placeholder text color for Rich Text Editor - Updated docked utility component's unread notification state icon color - Updated border colors for Feeds component ## Release 2.21.2 - June 15, 2023 ## Fixed - Fixed text-selection color issues which was introduced by WCAG 2.1 updates. - Fixed border colors for components. ## Release 2.21.1 - May 18, 2023 ## Fixed - Fixed grid column size classes where the `slds-col-` class now applies 'flex: 1 1 auto,' which breaks grid layouts when combined with `slds-small|medium|large-size_*` classes. This results in incomplete rows and layout issues. ## Release 2.21.0 - April 20, 2023 ## Fixed - Update transparency values (rgba and design tokens) with transparent SLDS global styling hooks - Changed anchor link ouline border black color to blue-50 - Updated background colors for Standard and Actions icons - Updated icons to `v10.6.0` - Standard Set: - Added `bill_of_materials` - Added `buyer_group_qualifier` - Added `datashare_target` - Added `datashares` - Added `disclosure_and_compliance` - Added `document_preview` - Added `facility_bed` - Added `market` - Added `price_sheet` - Added `mulesoft` - Utility Set: - Added `add_source` - Added `app_web_messaging` - Added `bookmark_stroke` - Added `buyer_group_qualifier` - Added `document_preview` - Added `expired` - Added `favorite_alt` - Added `heart` - Added `hourglass` - Added `integration` - Added `market` - Added `more` - Added `notification_off` - Added `notification_snoozed` - Added `profile_alt` - Added `promotion_tiers` - Added `sender_email` - Added `service_appointment` - Added `service_report` - Added `toggle_off` - Added `toggle_on` - Added `mulesoft` ## Components ### [Buttons](https://www.lightningdesignsystem.com/components/buttons) #### Added - Configured `--slds-c-button-text-color-hover` Styling hook in Button with dual-stateful to accurately apply the text color on-hover ### [Combobox](https://www.lightningdesignsystem.com/components/combobox) #### Fixed - Fixed by adding tabindex for `scrollable region must have keyboard access` wcag issue - Fixed by adding dynamic Ids for duplicate-id-aria issue - Fixed by adding unique Ids,aria-label for `aria-allowed-attr` wcag issue ### [Combobox](https://www.lightningdesignsystem.com/components/combobox) ## Added Added `aria-label` to meet accessibility requirements specifically for screen readers. ### [Global Navigation](https://www.lightningdesignsystem.com/components/global-navigation) #### Added - Added `role="presentation"` for globlal navigation's overflow tab item ### [Menus](https://www.lightningdesignsystem.com/components/menus) ## Fixed - Fixed invalid aria roles issue in subheadings with `role=presentation`  ### [Modals](https://www.lightningdesignsystem.com/components/modals) #### Fixed - Fixed `aria-labelledby` to meet accessibility requirements specifically for screen readers. ### [Modals](https://www.lightningdesignsystem.com/components/modals) #### Changed - Added full size option for modal. This will allow the modal to reach full screen for mobile screen size and devices. When screen is bigger than mobile screen width (from 768px), full size modal will take on large size modal behaviour. - Changed close button to meet accessibility requirement when in full size and in mobile width. ### [Path](https://www.lightningdesignsystem.com/components/path) #### Added - Added `aria-labelledby` to meet accessibility requirements specifically for screen readers. ### [Picklist](https://www.lightningdesignsystem.com/components/picklist) #### Added - Added aria-label and tabindex to fix aria-allowed-attr and aria-label sa11y issue.  ### [Picklist](https://www.lightningdesignsystem.com/components/picklist) #### Added - Added `aria-label` for picklist examples to meet accessibility requirements. ### [Popovers](https://www.lightningdesignsystem.com/components/popovers) #### Added - Added button to the story `body-max-height-small` to fix scrollable-region-focusable wcag issue. - Added `title` attribute to meet accessibility requirements. ## 2.19 #### Fixed - Fixed hardcoded walk through header and alt image paths  ### [Progress Bar](https://www.lightningdesignsystem.com/components/progress-bar) #### Added - Added id to aria-labelledby to meet accessibility requirements.  ### [Progress Indicator](https://www.lightningdesignsystem.com/components/progress-indicator) #### Added - Added id to aria-labelledby to meet accessibility requirements. ### [Progress Ring](https://www.lightningdesignsystem.com/components/progress-ring) #### Added - Added aria-label attribute to the progress ring to meet accessibility requirements. ### [Slider](https://www.lightningdesignsystem.com/components/slider) #### Added - Added unique id to fix duplicate-id-aria wcag issue  ### [Tabs](https://www.lightningdesignsystem.com/components/tabs) #### Added - Added `role="presentation"` for overflow tab item. ### [Vertical Navigation](https://www.lightningdesignsystem.com/components/vertical-navigation) #### Added - Configured `slds-nav-vertical__item` to add keyboard visual focus cue indicator ### [Welcome Mat](https://www.lightningdesignsystem.com/components/welcome-mat) #### Fixed - Fixed by adding tabindex="0" and role="region" for Scrollable region must have keyboard access wcag issue ## 2.19 #### Fixed - Fixed hardcoded base info background image path  ## Utilities ### [Scrollable Utility](https://www.lightningdesignsystem.com/utilities/scrollable) #### Added - Added tabindex to fix Scrollable region must have keyboard access wcag issue ## Release 2.20.1 - December 16, 2022 - Updated colors for various components: - Button Icons - Carousel - Checkbox Button - Checkbox Toggle - Checkbox - Combobox - Data Tables - Dynamic Icons - File Selector - Pills - Popovers - Progress Indicator - Radio Group - Select - Spinners - Split View - Tabs - Visual Picker ## Release 2.20.0 - December 15, 2022 - Updated constant colors codes with global slds hooks - Added two new dependencies for SLDS global styling hooks generation, - `@salesforce-ux/sds-styling-aliases` with version `0.2.4` - `@salesforce-ux/sds-styling-hooks` with version `1.1.0-alpha.2` - Updated `gulp` file to include SLDS global hooks generation as part of build and dist jobs - Updated design tokens in every component and utility with SLDS global styling hooks (except Brand-related tokens) - Updated CI workflows migrating from CircleCI to GitHub Actions - Updated icons to `v10.5.5` - Standard Set: - Added `asset_hierarchy` - Added `budget_category_value` - Added `budget_period` - Updated `crypto_category_wallet_group` - Added `crypto_transaction_envelope_change_snapshot` - Added `data_transforms` - Added `funding_award_adjustment` - Added `funding_requirement` - Added `promotion_tiers` - Added `slack_conversations` - Added `your_account` - Utility Set: - Added `asset_object` - Added `budget_category_value` - Added `budget_period` - Added `contact` - Added `funding_award_adjustment` - Added `funding_requirement` - Added `http` - Added `knowledge_smart_link` - Added `lead` - Added `maintenance_plan` - Added `no_return` - Added `opportunity` - Added `orders` - Added `product` - Added `proposition` - Added `queue` - Added `send_log` - Added `service_contract` - Added `slack_conversations` - Added `your_account` - DocType Set: - Updated `rtf` - Updated `folder` - Updated `library_folder` - Updated BG color to below Standard Icons - `connect_wallet` - `crypto_product_category_wallet_role` - `crypto_product` - `crypto_transaction_envelope_change_log` - `crypto_transaction_envelope` - `crypto_transaction` - `crypto_wallet_group_item` - `crypto_wallet_group` - `crypto_wallet` - `nft_settings` - `nft_studio` ## Release 2.19.0 - August 11, 2022 - Updated icons to `v10.4.0` - Standard Set: - Added `ai_accelerator_card` - Added `connect_wallet` - Added `contract_line_outcome` - Added `contract_line_outcome_data` - Added `crypto_category_wallet_group` - Added `crypto_product` - Added `crypto_product_category_wallet_role` - Added `crypto_transaction` - Added `crypto_transaction_envelope` - Added `crypto_transaction_envelope_item` - Added `crypto_wallet` - Added `crypto_wallet_group` - Added `crypto_wallet_group_item` - Added `customer` - Added `customer_workspace` - Added `learner_program` - Added `nft_settings` - Added `nft_studio` - Added `prompt` - Added `setup_modal` - Added `snippet_alt` - Added `tax_policy` - Added `tax_rate` - Added `tax_treatment` - Added `water` - Action Set: - Added `action_scan_enabled` - Added `action_scan_disabled` - Utility Set: - Added `captions` - Added `contract_line_outcome` - Added `contract_line_outcome_data` - Added `customer` - Added `customer_workspace` - Added `detach` - Added `hazmat_equipment` - Added `label` - Added `labels` - Added `record_alt` - Added `segments` - Added `tax_policy` - Added `tax_rate` - Added `tax_treatment` - Added `tollways` - Added `transport_bicycle` - Added `transport_heavy_truck` - Added `transport_light_truck` - Added `transport_walking` - Added `utility` - Added `water` - BRAND updates to below colors of the palette - `PALETTE_GREEN_20`: `#1C3326` - `PALETTE_GREEN_40`: `#396547` - `PALETTE_HOT_ORANGE_20`: `#4A2413` - `PALETTE_INDIGO_20`: `#321D71` - `PALETTE_PURPLE_80`: `#D7BFF2` - `PALETTE_VIOLET_20`: `#481A54` ## Components ### [Dynamic Icons](https://www.lightningdesignsystem.com/components/dynamic-icons) #### Changed - Updated Global Action Help icon's `role` attribute from `presentation` to `img` for better accessibility compliance ### [Global Navigation](https://www.lightningdesignsystem.com/components/global-navigation) #### Added - Added `role="img"` to unread indicator dot to comply with accessibility usage rules for `aria-label` ### [Modals](https://www.lightningdesignsystem.com/components/modals) #### Changed - Added tabindex to Footless example for programmatic focus use case. ### [Progress Bar](https://www.lightningdesignsystem.com/components/progress-bar) #### Added - Added example for Success under States ### [Tabs](https://www.lightningdesignsystem.com/components/tabs) #### Added - Added `role="img"` to unread indicator dot to comply with accessibility usage rules for `aria-label` ## Release 2.18.1 - June 22, 2022 - Corrected typos in blueprints: - components/checkbox - components/vertical-navigation ## Release 2.18.0 - May 6, 2022 - Removed `&_` shorthand from numerous selectors in SCSS files - Updated icons to v10.3.0 - Standard Set: - Added `slack` - Added `tableau` - Added `dashboard_component` - Utility Set: - Updated `serialized_product_transaction` - Updated `serialized_product` - Added `data_model` - Added `slack` - Added `tableau` - Added `video_off` ## Components ### [Accordion](https://www.lightningdesignsystem.com/components/accordion) #### Fixed - Fix for sass undefined operation compile error. - Fix wrong computed css margin rules. ### [Button Icons](https://www.lightningdesignsystem.com/components/button-icons) #### Added - Added `slds-button_icon-large` to support a Large variant for contained button icons ### [Buttons](https://www.lightningdesignsystem.com/components/buttons) #### Changed - Removed `vertical-align` from button non-base variants to create vertical alignment consistency among all the buttons. ### [Checkbox](https://www.lightningdesignsystem.com/components/checkbox) #### Fixed - Right to left legend to be right aligned and match the alignment of content. - Checkbox margin to properly support RTL. ### [Form Element](https://www.lightningdesignsystem.com/components/form-element) #### Fixed - Fixed form element label to support RTL layout by removing left aligned spacing and placing it back on the opposite side. ### [Modals](https://www.lightningdesignsystem.com/components/modals) #### Changed - Added `slds-modal__content_footless` class to example for clarity. - Added clarifying notes around modal focus and header for accessibility, and modified Footless example to show tabindex. ### [Popovers](https://www.lightningdesignsystem.com/components/popovers) #### Changed - Removed `@noflip` annotation from nubbins to make RTL behavior consistent ### [Radio Group](https://www.lightningdesignsystem.com/components/radio-group) #### Added - Added styling changes to support radio group with help text icon. - Added examples: Required with help text icon and Right to left required with help text icon to documentation - Added required with help text icon and tooltip example #### Fixed - Right to left legend to be right aligned and match the alignment of content. ### [Tiles](https://www.lightningdesignsystem.com/components/tiles) #### Added - Added annotations for tile board CSS classes. ## Release 2.17.5 - February 10, 2022 - Updated design token `COLOR_BACKGROUND_DESTRUCTIVE_HOVER` so that it is a different color from `COLOR_BACKGROUND_DESTRUCTIVE` ## Components ### [Checkbox](https://www.lightningdesignsystem.com/components/checkbox) #### Fixed - Reverted layout changes originally introduced in 2.17.0 ### [Radio Group](https://www.lightningdesignsystem.com/components/radio-group) #### Fixed - Reverted label layout changes introduced in 2.17.0 ### [Welcome Mat](https://www.lightningdesignsystem.com/components/welcome-mat) #### Fixed - Reverted changes to checkbox layout introduced in 2.17.4 ## Release 2.17.4 - February 3, 2022 ## Components ### [Checkbox](https://www.lightningdesignsystem.com/components/checkbox) #### Fixed - Checkbox inputs will no longer collapse horizontally when a label with a large amount of text is used. - All elements of an individual required checkbox (asterisk, input, and label) are now properly horizontally aligned. ### [Welcome Mat](https://www.lightningdesignsystem.com/components/welcome-mat) #### Fixed - Centered checkboxes using the new Flexbox layout. ## Release 2.17.3 - January 27, 2022 ## Components ### [Combobox](https://www.lightningdesignsystem.com/components/combobox) ## Fixed - Fixed spacing/alignment issue in `.slds-input_faux > span` for select-only combobox without a placeholder. ## Release 2.17.2 - January 20, 2022 ## Components ### [Buttons](https://www.lightningdesignsystem.com/components/buttons) #### Added - Added `--slds-c-icon-color-foreground` Styling Hook to Button with Icon variant to accurately apply icon color updates - Due to how the Lightning Base Component is configured, this is required to allow CSS Custom Property reassignment to function within Button Icons ## Release 2.17.1 - January 6, 2022 ## Components ### [Cards](https://www.lightningdesignsystem.com/components/cards) #### Changed - Fixed annotation for Einstein themed cards (`.slds-einstein-header__figure`) ## Release 2.17.0 - December 16, 2021 - Removed `&_` shorthand from numerous selectors in SCSS files - Added new standard color palette for neutral colors (black/white/grays) - Updated Styling Hooks table on component pages to display `slds`-namespaced Hooks - Updated icons to v10.2.2 ## Components ### [Accordion](https://www.lightningdesignsystem.com/components/accordion) #### Added - Added `slds` as the default namespace with `sds` fallbacks for Styling Hooks ### [Alert](https://www.lightningdesignsystem.com/components/alert) #### Added - Added `slds` as the default namespace with `sds` fallbacks for Styling Hooks. - Added reassignment of Styling Hooks for component states. ### [Avatar](https://www.lightningdesignsystem.com/components/avatar) #### Added - Added `slds` as the default namespace with `sds` fallbacks for Styling Hooks - Added CSS Custom Property reassignments for variants  ### [Badges](https://www.lightningdesignsystem.com/components/badges) #### Added - Added `slds` as the default namespace with `sds` fallbacks for Styling Hooks. - Added CSS Custom Property reassignments for variants and states (e.g., focus, active, hover). ### [Breadcrumbs](https://www.lightningdesignsystem.com/components/breadcrumbs) #### Added - Added `slds` as the default namespace with `sds` fallbacks for Styling Hooks. ### [Buttons](https://www.lightningdesignsystem.com/components/buttons) #### Added - Added Styling Hooks for Stateful Button and Dual Stateful Button. - Added missing `slds`-namespaced Styling Hooks (originally added in 2.16.0) ### [Cards](https://www.lightningdesignsystem.com/components/cards) #### Added - Added `slds` as the default namespace with `sds` fallbacks for Styling Hooks. - Added reassignment of Styling Hooks for component states. - Added clarification about card header icon assistive text. - Added clarification about card heading levels for accessibility. ### [Checkbox](https://www.lightningdesignsystem.com/components/checkbox) #### Added - Added `slds` as the default namespace with `sds` fallbacks for Styling Hooks. - Added CSS Custom Property reassignments for variants and states #### Changed - Labels will no longer wrap below the checkbox. When the label text wraps, it will now go directly under the previous line. ### [Checkbox Toggle](https://www.lightningdesignsystem.com/components/checkbox-toggle) #### Added - Added `slds` as the default namespace with `sds` fallbacks for Styling Hooks. - Added reassignment of Styling Hooks for component states. #### Fixed - Fixed spacing between checkbox toggle label and input on mobile. ### [Color Picker](https://www.lightningdesignsystem.com/components/color-picker) #### Changed - Added `aria-label` attribute to listbox ### [Data Tables](https://www.lightningdesignsystem.com/components/data-tables) #### Added - Added `slds-cell_action-mode` to blueprints of actionable data tables ### [Datepickers](https://www.lightningdesignsystem.com/components/datepickers) #### Fixed - Fixed missing attribute `required` on date input ### [Datetime Picker](https://www.lightningdesignsystem.com/components/datetime-picker) #### Fixed - Fixed missing attribute `required` on date input ### [Dynamic Icons](https://www.lightningdesignsystem.com/components/dynamic-icons) #### Changed - Updated dynamic icon colors to match new Salesforce color palettes. ### [Icons](https://www.lightningdesignsystem.com/components/icons) #### Removed - Removed outdated documentation about changing background color, as this contradicts current Design System guidelines. #### Added - Added `slds` as the default namespace with `sds` fallbacks for Styling Hooks. - Added CSS Custom Property reassignments for variants and states ### [Input](https://www.lightningdesignsystem.com/components/input) #### Added - Added `slds` as the default namespace with `sds` fallbacks for Styling Hooks. - Added reassignment of Styling Hooks for component states. #### Changed - `.slds-input_borders` now follows the prescribed usage guidelines and is only allowed on `readonly` Inputs. ### [Modals](https://www.lightningdesignsystem.com/components/modals) #### Added - Added `slds` as the default namespace with `sds` fallbacks for Styling Hooks. - Added CSS Custom Property reassignments for variants and states. - Added clarifying notes around modal focus for accessibility. - Added `.slds-modal__content_headless` and `slds-modal__content_footless` classes for styling modal content. #### Changed - Changed `header` and `footer` to generic `div` tags for better accessibility semantics. - Changed assistive text for close buttons in modals, and added notes to accessibility documentation. - Changed default header level from `h2` to `h1` for semantics and added more description around using headers in the Accessibility section. - Removed redundant `title` attribute from modal close button. - Updated use of `aria-describedby` attribute for modal content, and clarified in accessibility documentation section. - Added the `role="presentation"` attribute to the modal backdrop. - Moved `slds-modal__close` out of the modal header container and adjusted styles and annotations accordingly. - Headless modal variant no longer requires `slds-modal__header` in the markup. #### Deprecated - Deprecated older styles for previous markup of the `slds-modal__close` button. ### [Pills](https://www.lightningdesignsystem.com/components/pills) #### Added - Added `slds` as the default namespace with `sds` fallbacks for Styling Hooks. - Added reassignment of Styling Hooks for component states. ### [Progress Ring](https://www.lightningdesignsystem.com/components/progress-ring) #### Added - Added a shape to the progress ring to better visually indicate value by more than color alone. ### [Radio Group](https://www.lightningdesignsystem.com/components/radio-group) #### Added - Added `slds` as the default namespace with `sds` fallbacks for Styling Hooks. - Added CSS Custom Property reassignments for variants and states #### Changed - Labels will no longer wrap below the radio button. When the label text wraps, it will now go directly under the previous line. ### [Rich Text Editor](https://www.lightningdesignsystem.com/components/rich-text-editor) #### Added - Added `slds` as the default namespace with `sds` fallbacks for Styling Hooks. ### [Select](https://www.lightningdesignsystem.com/components/select) #### Added - Added `slds` as the default namespace with `sds` fallbacks for Styling Hooks. ### [Slider](https://www.lightningdesignsystem.com/components/slider) #### Added - Added `slds` as the default namespace with `sds` fallbacks for Styling Hooks. - Added CSS Custom Property reassignments for variants and states (e.g., focus, active, hover). ### [Tabs](https://www.lightningdesignsystem.com/components/tabs) #### Added - Added `slds` as the default namespace with `sds` fallbacks for Styling Hooks. - Added reassignment of Styling Hooks for component states. ### [Textarea](https://www.lightningdesignsystem.com/components/textarea) #### Added - Added `slds` as the default namespace with `sds` fallbacks for Styling Hooks. - Added CSS Custom Property reassignments for variants and states ### [Toast](https://www.lightningdesignsystem.com/components/toast) #### Added - Added `slds` as the default namespace with `sds` fallbacks for Styling Hooks. ### [Tooltips](https://www.lightningdesignsystem.com/components/tooltips) #### Added - Added `slds` as the default namespace with `sds` fallbacks for Styling Hooks. ### [Trees](https://www.lightningdesignsystem.com/components/trees) #### Added - Added `slds` as the default namespace with `sds` fallbacks for Styling Hooks. ## Release 2.16.2 - September 22, 2021 ## Components ### [Combobox](https://www.lightningdesignsystem.com/components/combobox) ## Removed - Removed `display: flex` property from `.slds-combobox__form-element` which was added recently for ARIA 1.2 guidance. ### [Input](https://www.lightningdesignsystem.com/components/input) #### Removed - Removed `width` property from `.slds-input_faux` which was added recently for ARIA 1.2 guidance. ## Release 2.16.1 - August 25, 2021 ## Release 2.16.0 - August 12, 2021 - In accordance with ARIA 1.2 guidance, the `input` was replaced with `button` within these components that contain select-only comboboxes: - Datetime Picker - Docked Composer - Dynamic Menu - Expression - Global Header - List builder - Lookups - Picklist - Rich Text Editor - Timepicker - Added SLDS scope customizer tool: `npm run slds:customizer` - Added new standard color palette for neutral colors (black/white/grays) - Updated @salesforce-ux/icons to 10.1.1 ## Components ### [Accordion](https://www.lightningdesignsystem.com/components/accordion) #### Added - Added link to accessibility keyboard interaction guidelines. ### [Buttons](https://www.lightningdesignsystem.com/components/buttons) #### Added - Added `slds` as the default namespace with `sds` fallbacks for Styling Hooks - Added CSS Custom Property reassignments for variants and states (e.g., focus, active, hover) ### [Combobox](https://www.lightningdesignsystem.com/components/combobox) #### Changed - Changed `slds-combobox__input` element from `input` to `button` per ARIA 1.2 guidance for select-only comboboxes. - Updated to ARIA 1.2 compliance where these attributes are moved to the input, or button in the case of select-only: `role="combobox"`, `aria-expanded`, `aria-haspopup="listbox"`. - Changed `@restrict` annotation of `.slds-combobox__input` from `.slds-combobox input` to `.slds-combobox__form-element input, .slds-combobox__form-element button` - Changed `@restrict` annotation of `.slds-combobox__input-value` from `.slds-combobox input` to `.slds-combobox__input` ### [Datepickers](https://www.lightningdesignsystem.com/components/datepickers) #### Added - Added examples for Required, Required with Error states - Added hover style for dates - Added `aria-label` to provide the full `DD MM YYYY` text of the date #### Fixed - Fixed missing attribute `aria-current="date"` when today's date falls inside of a selected range ### [Datetime Picker](https://www.lightningdesignsystem.com/components/datetime-picker) #### Added - Added `aria-label` to provide the full `DD MM YYYY` text of the date #### Added - Added hover style for dates #### Changed - Removed the usage of the deprecated combobox. The Datetime Picker now uses the current combobox. ### [Dynamic Menu](https://www.lightningdesignsystem.com/components/dynamic-menu) #### Changed - Removed the usage of the deprecated combobox. The Dynamic Menu now uses the current combobox. ### [Form Element](https://www.lightningdesignsystem.com/components/form-element) #### Fixed - Correctly position help text under the corresponding input when in horizontal layout. ### [Input](https://www.lightningdesignsystem.com/components/input) #### Added - Created new class `slds-input_faux` to style read-only "inputs" where necessary for accessibility best practices, like combobox. ### [List Builder](https://www.lightningdesignsystem.com/components/list-builder) #### Changed - Removed the usage of the deprecated combobox. The List Builder now uses the current combobox. - Updated [combobox](/components/combobox) to ARIA 1.2 compliance. ### [Lookups](https://www.lightningdesignsystem.com/components/lookups) #### Changed - Updated [combobox](/components/combobox) to ARIA 1.2 compliance. ### [Picklist](https://www.lightningdesignsystem.com/components/picklist) #### Changed - Removed the usage of the deprecated combobox. The Picklist now uses the current combobox. ### [Progress Bar](https://www.lightningdesignsystem.com/components/progress-bar) #### Added - Added `aria-label` attribute to the div with role of `progressbar` to meet accessibility requirements. ### [Progress Indicator](https://www.lightningdesignsystem.com/components/progress-indicator) #### Added - Added `aria-label` attribute to the div with role of `progressbar` to meet accessibility requirements. ### [Rich Text Editor](https://www.lightningdesignsystem.com/components/rich-text-editor) #### Changed - Removed the usage of the deprecated combobox. The Rich Text Editor now uses the current combobox. - Updated [combobox](/components/combobox) to ARIA 1.2 compliance. ### [Setup Assistant](https://www.lightningdesignsystem.com/components/setup-assistant) #### Changed - Updated checkbox toggle examples to "Off/On" and updated header text in alignment with text standards - Switched the variant of the progress bar used in setup assistant from success to base. ### [Timepicker](https://www.lightningdesignsystem.com/components/timepicker) #### Changed - Removed the usage of the deprecated combobox. The Timepicker now uses the current combobox.  ### [Welcome Mat](https://www.lightningdesignsystem.com/components/welcome-mat) #### Added - Added `aria-label` attribute to the div with role of `progressbar` to meet accessibility requirements. ## Release 2.15.8 - May 27, 2021 - Updated selected text highlight color token `COLOR_BACKGROUND_SELECTION` for better color contrast ## Components ### [Vertical Navigation](https://www.lightningdesignsystem.com/components/vertical-navigation) #### Changed - Replaced checked radio group navigation item background token with `BRAND_BACKGROUND_PRIMARY` branding token. ## Release 2.15.7 - May 14, 2021 ## Components ### [Panels](https://www.lightningdesignsystem.com/components/panels) #### Added - Added `aria-pressed` attribute to Panel toggle button ## Release 2.15.6 - May 7, 2021 ## Components ### [Toast](https://www.lightningdesignsystem.com/components/toast) #### Fixed - Corrected accessibility information regarding the usage of the `role` attribute. ## Release 2.15.5 - April 29, 2021 ## Components ### [Buttons](https://www.lightningdesignsystem.com/components/buttons) #### Added - Added `aria-pressed` attribute to stateful Button variants ## Release 2.15.4 - April 27, 2021 ## Release 2.15.3 - April 15, 2021 ## Release 2.15.2 - April 13, 2021 ## Components ### [Data Tables](https://www.lightningdesignsystem.com/components/data-tables) #### Added - Added `aria-label`, and alternatively, `aria-labelledby` to allow adding additional table context for screen readers ## Release 2.15.1 - April 12, 2021 ## Components ### [Cards](https://www.lightningdesignsystem.com/components/cards) #### Added - Added annotations for Einstein themed cards ### [Data Tables](https://www.lightningdesignsystem.com/components/data-tables) #### Changed - Changed the `aria-live` value from `assertive` to `polite` ### [Menus](https://www.lightningdesignsystem.com/components/menus) #### Added - Added `aria-expanded` attribute to menu triggers with value dependent on menu's open state ### [Progress Ring](https://www.lightningdesignsystem.com/components/progress-ring) #### Changed - Completed progress rings now use `color-background-success-dark` design token. ## Release 2.15.0 - March 25, 2021 - Removed Salesforce Sans as the default typeface and replaced it with OS-specific defaults. - Updated many of our design tokens and other colors to utilize the new Salesforce Color System. For more information, [read our article on Medium about this system](https://medium.com/salesforce-ux/the-salesforce-color-system-c7c6b5b9c577). ## Components ### [Breadcrumbs](https://www.lightningdesignsystem.com/components/breadcrumbs) - Added Kinetic styles and demo functionality for Breadcrumbs ### [Builder Header](https://www.lightningdesignsystem.com/components/builder-header) #### Changed - Updates to top bar: - Changed the color of the border separators to `$color-background-inverse`. - On `:hover` and `:focus` for `.slds-builder-header__item-action`: - Changed `background-color` to `$color-background-inverse` - Changed `color` to `$color-gray-1` - "Back" action moved to the left-hand side and visible text was removed - "Link" renamed to "Settings" and moved to the right-hand side next to "Help" #### Added - Additions to toolbar: - Icons for canvas settings and toggling a panel - Status text and alerts that convey status, warnings, and errors - Popovers for alerts - Tooltip for the "Back" action - New examples for "Back" action tooltip, status text, and alerts. - Added `aria-expanded` to dropdown item ### [Button Icons](https://www.lightningdesignsystem.com/components/button-icons) #### Added - Added `slds-button_icon-warning` class to properly style Warning state icons ### [Buttons](https://www.lightningdesignsystem.com/components/buttons) #### Added - Added Kinetic styles and demo functionality for Button Base, Brand, Neutral, Inverse, Outline Brand, Destructive and Success #### Changed - Changed `line-height` assignment in touch styles to use Styling Hook assignment of `--sds-c-button-line-height`. ### [Drop Zone](https://www.lightningdesignsystem.com/components/drop-zone) #### Changed - Changed `flex-basis` to `auto` for the drop zone label to fix a layout issue in IE11 ### [Dueling Picklist](https://www.lightningdesignsystem.com/components/dueling-picklist) #### Added - Responsive variant now grows to use up the available horizontal space. ### [Expandable Section](https://www.lightningdesignsystem.com/components/expandable-section) #### Fixed - Added missing annotation for `.slds-section__title-action-icon` ### [Icons](https://www.lightningdesignsystem.com/components/icons) #### Changed - Changed `product_quantity_rules` icon's color from light blue to salem green (#04844B) ### [Page Headers](https://www.lightningdesignsystem.com/components/page-headers) #### Fixed - Fixed incorrect annotations for `.slds-page-header__col-title`, `.slds-page-header__col-actions`, `.slds-page-header__col-meta`, `.slds-page-header__col-controls`, and `.slds-page-header__col-details`. ### [Panels](https://www.lightningdesignsystem.com/components/panels) #### Added - Added a new element, `.slds-panel__header-actions`, within the panel header to hold secondary actions that affect the entire panel. You can find the close button within the new element. - Added an example of the new secondary actions element that contains an overflow menu with actions. - Added additional demo elements to the [panels for filtering](/components/panels/#Panels-for-Filtering) example: top bar with accompanying button icon (`filterList`) that toggles the panel with filtering content, two-column content layout, and panel toggling behavior. - Added `aria-expanded` and `aria-controls` to the button that toggles the panel. #### Changed - Updated the icon in the [open as a drawer](/components/panels/#Open-as-a-drawer) example from `filterList` to `toggle_panel_left`. The new icon better represents the action evoked by the button icon. - Updated the icon in [drilled-in state](/components/panels/#Drilled-In-State) example that takes you back to the previous panel from `back` to `chevronleft`. This update makes the icon consistent between drilled-in states. ### [Popovers](https://www.lightningdesignsystem.com/components/popovers) #### Changed - Base popovers - Footer background is now explicitly set to `$color-background` design token - Moved `slds-popover__header` into `slds-popover__body` and added a [Media Object](/utilities/media-objects/) wrapper to match prompt popover variant - Added variant with icon - Removed `slds-popover__header` bottom border - Added variant with badge above header - Warning feedback state - Footer background color is now explicitly set to transparent - Body is now indented to align with header - Error feedback state - Footer background color is now explicitly set to transparent - Body is now indented to align with header - Prompt variant - Footer top border changed to match default popover border color and width - Walkthrough variant - Removed header background image - Footer background color is now explicitly set to transparent #### Added - Added light and dark Brand variants, including new selectors `.slds-popover_brand, .slds-popover_brand-dark, .slds-popover_brand-top, .slds-popover_brand-left, .slds-popover_brand-bottom, .slds-popover_brand-right` - Added new Prompt branded variants - Enabled styling hooks for popovers. See popovers' styling hooks overview table for a full listing of the currently available hooks. ### [Rich Text Editor](https://www.lightningdesignsystem.com/components/rich-text-editor) #### Added - Enabled styling hooks for Rich Text Editor. See Rich Text Editor's styling hooks overview table for a full listing of the currently available hooks. ### [Split View](https://www.lightningdesignsystem.com/components/split-view) #### Changed - For indicating the selected item in the list, `aria-selected` has been replaced with `aria-current="page"`. ### [Tabs](https://www.lightningdesignsystem.com/components/tabs) #### Added - Added additional styling hooks. See tab's styling hooks overview table for a full listing of the currently available hooks. #### Changed - Adjusted color of unsaved tab indicator asterisk to comply with accessibility color contrast rules for active tabs and tabs with notification. - Removed white `background-color` from `.slds-tabs_default` to expose surface color of the tabs parent container. - The `back` icon present in tabs on mobile has been replaced by `chevronleft`. This is an inherited change from panels and it makes the icon consistent between the drilled-in states. ## Release 2.14.3 - March 18, 2021 ## Release 2.14.2 - February 5, 2021 ## Release 2.14.1 - January 8, 2021 ## Components ### [Datepickers](https://www.lightningdesignsystem.com/components/datepickers) #### Fixed - Fixed typo in CSS Class Overview table for .slds-datepicker__filter_month ## Release 2.14.0 - December 16, 2020 - Corrected the syntax for various stylesheet annotations so that they will properly appear in the Overview of CSS Classes section for their respective blueprint. - Updated to Icons v9.39.0 and added new icon design token colors ## Components ### [Accordion](https://www.lightningdesignsystem.com/components/accordion) #### Added - Added Styling Hook for the background color of Accordion headings. - Added Styling Hooks for default text color, as well as hover/focus states, of Accordion headings. #### Changed - The Accordion heading button will now take up all available space, allowing for a larger hit target to toggle the Accordion functionality. ### [Alert](https://www.lightningdesignsystem.com/components/alert) #### Fixed - Fix incorrect Styling Hook name for `--sds-c-alert-text-color-warning`. #### Removed - Removed component level styling hooks for status states. ### [Alert](https://www.lightningdesignsystem.com/components/alert) #### Changed Refactored the component markup to function with or without theme utility classes. ### [Builder Header](https://www.lightningdesignsystem.com/components/builder-header) #### Fixed - Fixed issue with non-link text color in Builder Header menu dropdowns by adding default text color