Fix z-index not being applied correctly in Toast (#2438)

<!--
  How to write a good PR title:
- Follow [the Conventional Commits
specification](https://www.conventionalcommits.org/en/v1.0.0/).
  - Give as much context as necessary and as little as possible
  - Prefix it with [WIP] while it’s a work in progress
-->

## Self Checklist

- [x] I wrote a PR title in **English** and added an appropriate
**label** to the PR.
- [x] I wrote the commit message in **English** and to follow [**the
Conventional Commits
specification**](https://www.conventionalcommits.org/en/v1.0.0/).
- [x] I [added the
**changeset**](https://github.com/changesets/changesets/blob/main/docs/adding-a-changeset.md)
about the changes that needed to be released. (or didn't have to)
- [x] I wrote or updated **documentation** related to the changes. (or
didn't have to)
- [x] I wrote or updated **tests** related to the changes. (or didn't
have to)
- [x] I tested the changes in various browsers. (or didn't have to)
  - Windows: Chrome, Edge, (Optional) Firefox
  - macOS: Chrome, Edge, Safari, (Optional) Firefox

## Summary

<!-- Please brief explanation of the changes made -->

Toast에 z-index가 제대로 적용되지 않아 Floating component간 위계가 맞지 않았던 부분을 수정합니다.

## Details

Toast의 conatiner가 `position: fixed` 스타일을 가지기에 stacking context를 만들어냅니다.
따라서 자식 요소인 Toast가 z-index를 가지더라도 container 외부에 영향을 미치지 못하기 때문에 의도한대로
올바르게 z-index가 적용되지 않았습니다. container에 z-index 스타일을 추가하여 해결합니다.

<!-- Please elaborate description of the changes -->

### Breaking change? (Yes/No)

<!-- If Yes, please describe the impact and migration path for users -->

No, Toast의 `zIndex` prop을 deprecate 처리했습니다. 

## References

<!-- Please list any other resources or points the reviewer should be
aware of -->

-
https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_positioned_layout/Understanding_z-index/Stacking_context

.changeset/rare-chefs-remember.md

@@ -0,0 +1,5 @@
+---
+'@channel.io/bezier-react': minor
+---
+
+Fix z-index not being applied correctly in `Toast`. Add `zIndex` prop to `ToastProvider`.

packages/bezier-react/src/components/Toast/Toast.tsx

@@ -82,7 +82,7 @@ export function Toast({
 
   const className = classNames(
     styles.ToastElement,
-    zIndex && getZIndexClassName(zIndex),
+    getZIndexClassName(zIndex),
     placement && styles[`placement-${placement}`],
     isSlidingOut && styles['slide-out']
   )
@@ -193,6 +193,7 @@ const DEFAULT_OFFSET = {
 export function ToastProvider({
   autoDismissTimeout = 3000,
   container: givenContainer,
+  zIndex = 'toast',
   offset = DEFAULT_OFFSET,
   children = [],
 }: ToastProviderProps) {
@@ -213,7 +214,10 @@ export function ToastProvider({
               ? { right: px(offset?.right ?? DEFAULT_OFFSET.right) }
               : { left: px(offset?.left ?? DEFAULT_OFFSET.left) }),
           }}
-          className={styles.ToastContainer}
+          className={classNames(
+            styles.ToastContainer,
+            getZIndexClassName(zIndex)
+          )}
         >
           {toasts.map(({ id, onDismiss, ...rest }) => (
             <Toast
@@ -227,7 +231,7 @@ export function ToastProvider({
         </div>
       </InvertedThemeProvider>
     ),
-    [autoDismissTimeout, dismiss, offset]
+    [autoDismissTimeout, dismiss, offset, zIndex]
   )
 
   return (

packages/bezier-react/src/components/Toast/Toast.types.ts

@@ -16,6 +16,9 @@ interface ToastOwnProps {
   appearance?: ToastAppearance
   preset?: ToastPreset
   icon?: BezierIcon
+  /**
+   * @deprecated Use `zIndex` of `ToastProvider` instead
+   */
   zIndex?: ZIndex
   autoDismiss?: boolean
   autoDismissTimeout?: number
@@ -40,6 +43,11 @@ type Offset = {
 interface ToastProviderOwnProps {
   offset?: Offset
   container?: HTMLElement | null
+  /**
+   * z-index level of the Toast container
+   * @default 'toast'
+   */
+  zIndex?: ZIndex
 }
 
 export interface ToastProviderProps