Skip to contentSkip to navigationSkip to topbar
Paste DSys

Side Modal

Version 5.0.1GithubDesign assets pendingPeer review pending

A modal that stays on the side of the screen.

@twilio-paste/side-modal

5.0.1

Patch Changes

  • 262c1b715 #4281 Thanks @PixeledCode! - [all packages]: add use client directive to the components and icons. This will make paste library compatible with server components

5.0.0

Major Changes

  • f48211e56 #4258 Thanks @PixeledCode! - [all packages]: Upgrade to React 19 and drop support for React 16. Paste only supports the three latest versions of React. If you're using Paste in a React 17, 18, or 19 app, you should be able to upgrade with full backwards compatibility. If you experience any issues, please let us know on Github.

Patch Changes

4.2.1

Patch Changes

  • 0ed9f3482 #4226 Thanks @PixeledCode! - [Callout, ChatComposer, ChatLog, Combobox, Input, InputBox, Menu, MinimizableDialog, Modal, Popover, SideModal, SidePanel, Sidebar, Toast, Tooltip, Topbar, UserDialog]: Update styles to implement new elevation tokens

4.2.0

Minor Changes

  • 7c93dafd5 #4140 Thanks @PixeledCode! - [Side Modal]: Align SideModalFooterActions to left. This change is to make Side Modal more aligned with Side Panel component. If you want to keep the actions on the right, you can use the justifyContent prop to align them to the right. If you are keeping them on the left, it's recommended to move the primary action to the left and the secondary action to the right.

4.1.3

Patch Changes

4.1.2

Patch Changes

4.1.1

Patch Changes

4.1.0

Minor Changes

  • b8d79200b #3442 Thanks @TheSisb! - Removed all run-time prop-type checkingfrom Paste components. Paste now ships with only TypeScript types.

    ACTION NEEDED: None. This should be 100% backwards compatible.

4.0.0

Major Changes

  • 733709127 #3395 Thanks @SiTaggart! - Modified the compile target of our JavaScript bundles from node to browser to minimize the risk of clashing with RequireJS. This is marked as a major out of an abundance of caution. You shouldn't need to do anything but we wanted you to be aware of the change on the off chance it has unintended consequences

Patch Changes

3.1.1

Patch Changes

  • 4d1f7c65e #3360 Thanks @SiTaggart! - Improved types where Paste extends the base HTML element that a component is based on, so that the existing blocked styling properties are not exposed as valid properties for the component via Typescript. This leads to less confusion around what is supported by a Paste component.

    Existing blocked component properties include:

    • className
    • style
    • color

3.1.0

Minor Changes

  • 771da3b74 #3296 Thanks @TheSisb! - [SideModal] Add new prop hideOnEsc which enables closing the SideModal when the "Escape" keyboard key is pressed

Patch Changes

  • 771da3b74 #3296 Thanks @TheSisb! - [SideModal] Fix to correctly focus the close button when the SideModal first opens

3.0.1

Patch Changes

3.0.0

Major Changes

  • 3ab2bb6f4 #3114 Thanks @SiTaggart! - ### Breaking change

    We have moved @types/react and @types/react-dom to peer dependencies of the library. This should allow for greater control and backwards compatibility with older versions of React as Paste is no longer bundling the type libraries.

    Your application likely has both of these as dependencies anyway, but it is now up to you to manage that version number.

    Action needed

    Ensure @types/react and @types/react-dom are installed as dependencies of your application.

Patch Changes

  • dc07ca41b #3106 Thanks @SiTaggart! - [Side Modal] set screen position to fixed to ensure the dialog is always full height in long scrolling screens'

2.0.0

Major Changes

  • d97098846 #3020 Thanks @SiTaggart! - This major version included listing all the missing peer dependencies for each Paste package.

    If you are using a package from Paste in isolation from Core, when upgrading to this latest version, be sure to correctly install all the missing peer dependencies.

Patch Changes

1.0.4

Patch Changes

1.0.3

Patch Changes

1.0.2

Patch Changes

  • 0865d51a7 #2807 Thanks @SiTaggart! - [side-modal] set an element name on the root dialog node, to allow full control of custom styling including widths

1.0.1

Patch Changes

1.0.0

Major Changes

  • fcd2de38a #2676 Thanks @shleewhite! - [Side Modal] create a new Side Modal component! This modal sits on top of the page on the right side. It should be used when you want a full height modal where you can interact with the rest of the page while it is open.