Skip to content

v16.0.0

Choose a tag to compare

View all tags
@github-actions github-actions released this 31 Jul 20:02
· 90 commits to master since this release
v16.0.0
3f3f7e9

BREAKING CHANGES

  • #4001 A new KBD component has been added to the Canvas Labs (@workday/canvas-kit-labs-react) package for rendering keyboard shortcuts.
  • #4000 Visual Changes
  • #4088 - Card variant="borderless" has been removed, use alt instead
  • #4107 Side Panel (main) alternate variant has been renamed to overlay to match Figma library. New variant alternative has been added to Side Panel (main).
  • #4060 Legacy themes that only set canvas.palette.<color>.main now default to themeScope: 'brand' (PrimaryButton + selected states) instead of the previous implicit full ramp / broad system.color.brand.* forwarding. To restore v15 behavior, pass themeScope: 'full': 
    <CanvasProvider
  theme={{canvas: {palette: {primary: {main: '#FF00FF'}}}, themeScope: 'full'}}
>
  <App />
</CanvasProvider>

Components

  • feat: Add Sana Sans as default typeface (#3960) (@sheelah)

  • feat: Update Sana Canvas Card component (#4014) (@sheelah)

  • test: Set sana-canvas theme on Card visual tests (@sheelah)

  • feat: Add KBD component to labs (#4001) (@RayRedGoose)
    A new KBD component has been added to the Canvas Labs (@workday/canvas-kit-labs-react) package for rendering keyboard shortcuts.

  • chore: Remove Sana Canvas-specific Card story (@sheelah)

  • chore: Remove unnneeded data-theme (@sheelah)

  • feat: Implement Sana Canvas Text Input, Text Area, Form Field, and Color Picker (#3992) (@jamesfan)

  • feat: Add Sana Canvas Avatar (#4023) (@sheelah)

  • feat: Update Sana Canvas Buttons (#4000) (@josh-bagwell)
    This updates our Button styling to introduce Sana Canvas.

  • chore: Updated colorSpace util (#4051) (@josh-bagwell)

  • feat: Add Sana styles to Canvas Switch, Radio & Checkbox (#4017) (@RayRedGoose)

  • feat: Add Sana Canvas Menu Updates (#4052) (@sheelah)

  • fix: Remove duplicate opacity setting for disabled checkboxes (#4067) (@sheelah)

  • feat: Update Segmented Control and Action per Sana Canvas updates (#4048) (@mannycarrera4, manuel.carrera)

  • feat: Update Toast and Tooltip styles to match Sana (#4053) (@RayRedGoose, manuel.carrera)

  • feat: Update Sana Canvas Popup, Modal and Dialog (#4018) (@josh-bagwell, manuel.carrera, @mannycarrera4)
    Updates Popup, Modal and Dialog to new Sana Canvas styling.

  • chore: Update components per new depth spec (#4075) (@mannycarrera4, manuel.carrera)
    Updates Canvas Kit components to use the revised system.depth token scale from the Sana Canvas depth spec. Several overlay and surface components were using depth values that no longer match the intended elevation hierarchy.

    Banner — adds boxShadow: system.depth[5] (previously had no box-shadow)
    Modal.Card — system.depth[5] → system.depth[6]
    Popup.Card — system.depth[3] → system.depth[4]
    Toast — system.depth[3] → system.depth[5]
    Tooltip — system.depth[2] → system.depth[3]

  • feat: Add new Tabs component (#4062) (@RayRedGoose, Sheelah Brennan)

  • fix: Update icon size in menu (#4086) (@mannycarrera4, manuel.carrera)
    Update Menu Icon size to 20x20

  • chore: Update Select and MultiSelect per Sana Canvas Visual updates (#4085) (@mannycarrera4, manuel.carrera)
    Updates Select and MultiSelect to match Sana Canvas visuals: chevron open/closed indicators, MultiSelect shape.lg (12px) via cornerShapeStencil
    Increases Menu.Popper offset from 4px to 8px (affects Select, MultiSelect, Combobox, and other menu-based dropdowns)

  • fix: Pass initial values to useRef for React 19 types (#4091) (@jamesfan, @cursoragent)

  • feat: Add Sana Canvas indicator component updates (#4087) (@sheelah)

  • feat: Add Sana Canvas Expandable and Table updates (#4097) (@sheelah, Manuel Carrera)

  • chore: Set IBM Plex Mono as monospace font in Storybook (#4103) (@sheelah)

  • feat: Add alt variant to containers (#4088) (@mannycarrera4, manuel.carrera, @Copilot)
    A new alt variant has been added to our container components to be used when rendering on alt backgrounds.

  • feat: Add Sana styles to Side Panel (#4107) (@RayRedGoose)
    Side Panel (main) alternate variant has been renamed to overlay to match Figma library. New variant alternative has been added to Side Panel (main).

  • feat: Add icons migration (#4108) (@RayRedGoose, @alanbsmith)

  • fix: Fix examples for Side Panel (#4111) (@RayRedGoose)

  • chore: Updates to colorSpace and Pill (#4106) (@josh-bagwell, manuel.carrera, @sheelah)

  • fix: Fix canary (#4112) (@RayRedGoose)

  • fix: Update Canvas Provider theming (#4060) (@mannycarrera4, manuel.carrera, @claude)
    CanvasProvider now prefers a numerical brand theme shape (e.g. {brand: {primary: {'600': '...'}}}) for scoped theming. Use sanaCanvasProviderTheme at the root provider when global Sana CSS is loaded so menus, selects, modals, and other popups get the same brand variables. Popup forwarding no longer relies on Emotion’s legacy theme context, so numerical themes no longer incorrectly force classic Canvas defaults onto popup containers.

Dependencies

  • chore: Update tokens to latest beta (#4065) (@mannycarrera4, manuel.carrera)
  • feat: Add Sana Canvas Navigation component updates (#4068) (@sheelah, manuel.carrera, Manuel Carrera, manuel.carrera)
  • chore: Update to latest icons package (#4094) (@mannycarrera4, manuel.carrera)

Documentation

Infrastructure

Assets 2
Loading