@charcoal-ui/react 6.1.0-beta.3 → 6.1.0-beta.4

package/src/components/Notification/useNotificationQueue.ts

@@ -18,11 +18,13 @@ export function useNotificationQueue<
   {
     duration: durationOption,
     order = 'queue',
+    animateReplace = false,
     timeoutReason,
     unmountedReason,
   }: {
     duration?: number
     order?: NotificationOrder
+    animateReplace?: boolean
     timeoutReason?: TCloseReason
     unmountedReason?: TCloseReason
   } = {},
@@ -57,24 +59,20 @@ export function useNotificationQueue<
         return
       }
 
-      function notifyActive() {
-        const active = activeRef.current
-        if (active === undefined || active.notified) return
-        active.notified = true
-        const reason = active.reason ?? timeoutReason
-        if (reason !== undefined) {
-          active.onClose?.(reason)
-        }
-      }
-
       function finish() {
+        const active = activeRef.current
         activeRef.current = undefined
         update()
+        if (active !== undefined && !active.notified) {
+          active.notified = true
+          const reason = active.reason ?? timeoutReason
+          if (reason !== undefined) {
+            active.onClose?.(reason)
+          }
+        }
         playNextRef.current?.()
       }
 
-      notifyActive()
-
       if (hoverRef.current.active) {
         hoverRef.current.pending = () => wrapUpdate(update, 'remove')
         return
@@ -90,6 +88,7 @@ export function useNotificationQueue<
         finish()
         return
       }
+
       const item: HTMLDivElement = itemRef.current
 
       // allow-discreteが Newly Available で使えないので、要素の削除をアニメーション完了まで待つ
@@ -129,8 +128,10 @@ export function useNotificationQueue<
     return () => {
       const active = activeRef.current
       if (active !== undefined && !active.notified) {
-        if (unmountedReason !== undefined) {
-          active.onClose?.(unmountedReason)
+        active.notified = true
+        const reason = active.reason ?? unmountedReason
+        if (reason !== undefined) {
+          active.onClose?.(reason)
         }
       }
       activeRef.current = undefined
@@ -181,7 +182,7 @@ export function useNotificationQueue<
       if (active === undefined) return
 
       active.reason = 'replaced' as TCloseReason
-      replaceRef.current = true
+      replaceRef.current = !animateReplace
       hoverRef.current.active = false
       const pending = hoverRef.current.pending
       hoverRef.current.pending = undefined

package/src/components/Pagination/__snapshots__/index.css.snap

@@ -39,7 +39,6 @@
    * Safari doesn't correctly repaint the elements when they're reordered in response to interaction.
    * This forces it to repaint them. This doesn't work if put on the parents either, has to be here.
    */
-  /* stylelint-disable-next-line property-no-vendor-prefix */
   -webkit-transform: translateZ(0);
   color: var(--charcoal-color-text-tertiary-default);
   background-color: transparent;

package/src/components/Pagination/index.css

@@ -39,7 +39,6 @@
    * Safari doesn't correctly repaint the elements when they're reordered in response to interaction.
    * This forces it to repaint them. This doesn't work if put on the parents either, has to be here.
    */
-  /* stylelint-disable-next-line property-no-vendor-prefix */
   -webkit-transform: translateZ(0);
 
   color: var(--charcoal-color-text-tertiary-default);

package/src/index.ts

@@ -112,6 +112,7 @@ export {
   type SnackbarProps as UnstableSnackbarProps,
   type UseSnackbarProps as unstable_UseSnackbarProps,
   type SnackbarCloseReason as unstable_SnackbarCloseReason,
+  type SnackbarRootAttributes as unstable_SnackbarRootAttributes,
   type ShowSnackbarOptions as unstable_ShowSnackbarOptions,
 } from './components/Notification/Snackbar'
 export {