@transferwise/components 0.0.0-experimental-38195a1 → 0.0.0-experimental-4f26f19

package/build/Snackbar/Snackbar.mjs

@@ -1,123 +1,147 @@
-import { useRef, useState, useEffect, useLayoutEffect } from 'react';
+import { Tags } from '@transferwise/icons';
 import { CSSTransition } from 'react-transition-group';
 import Button from '../Button/Button.resolver.mjs';
 import Body from '../Body/Body.mjs';
-import withNextPortalWrapper from '../WithNextPortal/WithNextPortal.mjs';
+import '../common/theme.mjs';
+import '../common/direction.mjs';
+import '@transferwise/neptune-tokens';
+import '../common/PropsValues/control.mjs';
+import '../common/PropsValues/size.mjs';
+import '../common/PropsValues/typography.mjs';
+import '../common/PropsValues/width.mjs';
+import '../common/PropsValues/type.mjs';
+import '../common/PropsValues/dateMode.mjs';
+import '../common/PropsValues/monthFormat.mjs';
+import '../common/PropsValues/position.mjs';
+import '../common/PropsValues/layouts.mjs';
+import '../common/PropsValues/status.mjs';
+import '../common/PropsValues/sentiment.mjs';
+import '../common/PropsValues/profileType.mjs';
+import '../common/PropsValues/variant.mjs';
+import '../common/PropsValues/scroll.mjs';
+import '../common/PropsValues/markdownNodeType.mjs';
+import '../common/fileType.mjs';
+import '@transferwise/formatting';
+import 'clsx';
+import 'react';
+import 'react-intl';
+import '../common/CloseButton/CloseButton.messages.mjs';
 import { jsx, jsxs } from 'react/jsx-runtime';
+import { LiveRegion } from '../common/LiveRegion/LiveRegion.mjs';
+import { PrimitivePrompt } from '../Prompt/PrimitivePrompt/PrimitivePrompt.mjs';
+import StatusIcon from '../StatusIcon/StatusIcon.mjs';
+import { SNACKBAR_EXIT_DURATION, SNACKBAR_ENTER_DURATION } from './constants.mjs';
+import useSnackbarAutoDismiss from './useSnackbarAutoDismiss.mjs';
 
-const CSS_TRANSITION_DURATION = 400;
-const Snackbar = props => {
-  const bodyRef = useRef(null);
-  const leaveTimeout = useRef(0);
-  const transitionTimeout = useRef(0);
-  /** The props of the last committed render, as `this.props` was in the class component. */
-  const committedProps = useRef(props);
-  const [state, setState] = useState({
-    visible: false,
-    text: ''
+const Snackbar = ({
+  action,
+  announcementKey,
+  duration,
+  media,
+  onDismissRequest,
+  onExited,
+  sentiment = 'neutral',
+  text,
+  timeout,
+  visible
+}) => {
+  const {
+    handleBlur,
+    handleEntered,
+    handleFocus,
+    handleMouseEnter,
+    handleMouseLeave,
+    surfaceRef
+  } = useSnackbarAutoDismiss({
+    duration,
+    onDismissRequest,
+    timeout,
+    visible
   });
-  useEffect(() => () => {
-    window.clearTimeout(leaveTimeout.current);
-    window.clearTimeout(transitionTimeout.current);
-  }, []);
-  // Runs after every render to mirror the componentDidUpdate lifecycle this component previously
-  // relied on, including the shouldComponentUpdate guard that ignored every update without text.
-  // Layout, not passive, so a notification is shown or replaced before the browser paints, as
-  // componentDidUpdate did. Both rules below are disabled on purpose: the dependency-less effect
-  // and its synchronous state updates are what keep this conversion behaviour-identical.
-  /* eslint-disable react-hooks/exhaustive-deps, react-hooks/set-state-in-effect */
-  useLayoutEffect(() => {
-    const previousProps = committedProps.current;
-    committedProps.current = props;
-    const {
-      action,
-      text,
-      timestamp
-    } = props;
-    // shouldComponentUpdate bailed out whenever the incoming text was empty. That also blocked the
-    // updates scheduled below, so a Snackbar whose text is cleared stays on screen until it is
-    // given text again. Preserved here deliberately to keep this refactor behaviour-identical.
-    const updateWhileTextIsPresent = update => {
-      if (committedProps.current.text) {
-        update();
-      }
-    };
-    const setLeaveTimeout = () => {
-      leaveTimeout.current = window.setTimeout(() => {
-        updateWhileTextIsPresent(() => setState(current => ({
-          ...current,
-          visible: false
-        })));
-      }, committedProps.current.timeout);
-    };
-    const show = () => {
-      setState(current => ({
-        ...current,
-        visible: true,
-        action,
-        text
-      }));
-      setLeaveTimeout();
-    };
-    if (!text) {
-      return;
+  const handleActionClick = event => {
+    try {
+      action?.onClick?.(event);
+    } finally {
+      onDismissRequest('action');
     }
-    if (!previousProps.text) {
-      show();
-    } else if (previousProps.timestamp !== timestamp) {
-      window.clearTimeout(leaveTimeout.current);
-      if (state.visible) {
-        setState(current => ({
-          ...current,
-          visible: false
-        }));
-        transitionTimeout.current = window.setTimeout(() => {
-          updateWhileTextIsPresent(show);
-        }, CSS_TRANSITION_DURATION);
-      } else {
-        show();
-      }
+  };
+  const renderMedia = () => {
+    if (media) {
+      return /*#__PURE__*/jsx("span", {
+        className: "wds-Snackbar__media-asset",
+        children: media
+      });
     }
-  });
-  /* eslint-enable react-hooks/exhaustive-deps, react-hooks/set-state-in-effect */
-  const {
-    action,
-    text,
-    visible
-  } = state;
-  const {
-    timeout
-  } = props;
+    if (sentiment === 'proposition') {
+      return /*#__PURE__*/jsx("span", {
+        className: "wds-Snackbar__media-asset",
+        children: /*#__PURE__*/jsx(Tags, {
+          "aria-hidden": true,
+          size: 24
+        })
+      });
+    }
+    return /*#__PURE__*/jsx(StatusIcon, {
+      sentiment: sentiment,
+      size: 24
+    });
+  };
   return /*#__PURE__*/jsx("div", {
-    className: "snackbar",
-    "aria-live": "assertive",
-    role: "alert",
+    className: "wds-Snackbar",
+    style: {
+      '--Snackbar-enter-duration': `${SNACKBAR_ENTER_DURATION}ms`,
+      '--Snackbar-exit-duration': `${SNACKBAR_EXIT_DURATION}ms`
+    },
     children: /*#__PURE__*/jsx(CSSTransition, {
-      nodeRef: bodyRef,
+      appear: true,
+      nodeRef: surfaceRef,
       in: visible,
-      classNames: "snackbar__text-container",
+      classNames: "wds-Snackbar-container",
       timeout: {
-        appear: 0,
-        enter: timeout,
-        exit: CSS_TRANSITION_DURATION
+        appear: SNACKBAR_ENTER_DURATION,
+        enter: SNACKBAR_ENTER_DURATION,
+        exit: SNACKBAR_EXIT_DURATION
       },
       unmountOnExit: true,
-      children: /*#__PURE__*/jsxs(Body, {
-        ref: bodyRef,
-        as: "span",
-        className: "snackbar__text",
-        children: [text, action ? /*#__PURE__*/jsx(Button, {
-          className: "snackbar__text__action",
-          v2: true,
-          size: "sm",
-          onClick: action.onClick,
-          children: action.label
-        }) : null]
+      onEntered: handleEntered,
+      onExited: onExited,
+      children: /*#__PURE__*/jsx(PrimitivePrompt, {
+        ref: surfaceRef,
+        className: "wds-Snackbar-container",
+        sentiment: sentiment,
+        emphasis: "elevated",
+        media: renderMedia(),
+        onDismiss: onDismissRequest,
+        onMouseEnter: handleMouseEnter,
+        onMouseLeave: handleMouseLeave,
+        onFocus: handleFocus,
+        onBlur: handleBlur,
+        children: /*#__PURE__*/jsxs("div", {
+          className: "wds-Snackbar__content",
+          children: [/*#__PURE__*/jsx(LiveRegion, {
+            "aria-live": "polite",
+            announceOnChange: announcementKey,
+            className: "wds-Snackbar__message",
+            children: /*#__PURE__*/jsx(Body, {
+              as: "span",
+              className: "wds-Snackbar__body",
+              children: text
+            })
+          }), action ? /*#__PURE__*/jsx(Button, {
+            className: "wds-Snackbar__action",
+            v2: true,
+            size: "sm",
+            priority: "secondary",
+            href: action.href,
+            target: action.target,
+            onClick: handleActionClick,
+            children: action.label
+          }) : null]
+        })
       })
     })
   });
 };
-var SnackbarPortal = withNextPortalWrapper(Snackbar);
 
-export { Snackbar, SnackbarPortal as default };
+export { Snackbar };
 //# sourceMappingURL=Snackbar.mjs.map

package/build/Snackbar/Snackbar.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Snackbar.mjs","sources":["../../src/Snackbar/Snackbar.tsx"],"sourcesContent":["import { useEffect, useLayoutEffect, useRef, useState } from 'react';\nimport { CSSTransition } from 'react-transition-group';\n\nimport Button from '../Button';\nimport Body from '../Body';\nimport type { ThemeDark, ThemeLight } from '../common';\nimport withNextPortal from '../WithNextPortal/WithNextPortal';\n\nconst CSS_TRANSITION_DURATION = 400;\n\nexport interface SnackbarProps {\n  action?: {\n    label: string;\n    onClick?: React.MouseEventHandler<HTMLButtonElement>;\n  };\n  text: React.ReactNode;\n  /** @deprecated Has no effect. Snackbar theming is based on ThemeProvider. */\n  theme?: ThemeLight | ThemeDark;\n  timeout: number;\n  timestamp: number;\n}\n\ninterface SnackbarState extends Pick<SnackbarProps, 'action' | 'text'> {\n  visible: boolean;\n}\n\nexport const Snackbar = (props: SnackbarProps) => {\n  const bodyRef = useRef<HTMLSpanElement>(null);\n  const leaveTimeout = useRef(0);\n  const transitionTimeout = useRef(0);\n  /** The props of the last committed render, as `this.props` was in the class component. */\n  const committedProps = useRef(props);\n\n  const [state, setState] = useState<SnackbarState>({\n    visible: false,\n    text: '',\n  });\n\n  useEffect(\n    () => () => {\n      window.clearTimeout(leaveTimeout.current);\n      window.clearTimeout(transitionTimeout.current);\n    },\n    [],\n  );\n\n  // Runs after every render to mirror the componentDidUpdate lifecycle this component previously\n  // relied on, including the shouldComponentUpdate guard that ignored every update without text.\n  // Layout, not passive, so a notification is shown or replaced before the browser paints, as\n  // componentDidUpdate did. Both rules below are disabled on purpose: the dependency-less effect\n  // and its synchronous state updates are what keep this conversion behaviour-identical.\n  /* eslint-disable react-hooks/exhaustive-deps, react-hooks/set-state-in-effect */\n  useLayoutEffect(() => {\n    const previousProps = committedProps.current;\n    committedProps.current = props;\n\n    const { action, text, timestamp } = props;\n\n    // shouldComponentUpdate bailed out whenever the incoming text was empty. That also blocked the\n    // updates scheduled below, so a Snackbar whose text is cleared stays on screen until it is\n    // given text again. Preserved here deliberately to keep this refactor behaviour-identical.\n    const updateWhileTextIsPresent = (update: () => void) => {\n      if (committedProps.current.text) {\n        update();\n      }\n    };\n\n    const setLeaveTimeout = () => {\n      leaveTimeout.current = window.setTimeout(() => {\n        updateWhileTextIsPresent(() => setState((current) => ({ ...current, visible: false })));\n      }, committedProps.current.timeout);\n    };\n\n    const show = () => {\n      setState((current) => ({ ...current, visible: true, action, text }));\n      setLeaveTimeout();\n    };\n\n    if (!text) {\n      return;\n    }\n\n    if (!previousProps.text) {\n      show();\n    } else if (previousProps.timestamp !== timestamp) {\n      window.clearTimeout(leaveTimeout.current);\n\n      if (state.visible) {\n        setState((current) => ({ ...current, visible: false }));\n        transitionTimeout.current = window.setTimeout(() => {\n          updateWhileTextIsPresent(show);\n        }, CSS_TRANSITION_DURATION);\n      } else {\n        show();\n      }\n    }\n  });\n  /* eslint-enable react-hooks/exhaustive-deps, react-hooks/set-state-in-effect */\n\n  const { action, text, visible } = state;\n  const { timeout } = props;\n\n  return (\n    <div className=\"snackbar\" aria-live=\"assertive\" role=\"alert\">\n      <CSSTransition\n        nodeRef={bodyRef}\n        in={visible}\n        classNames=\"snackbar__text-container\"\n        timeout={{\n          appear: 0,\n          enter: timeout,\n          exit: CSS_TRANSITION_DURATION,\n        }}\n        unmountOnExit\n      >\n        <Body ref={bodyRef} as=\"span\" className=\"snackbar__text\">\n          {text}\n          {action ? (\n            <Button className=\"snackbar__text__action\" v2 size=\"sm\" onClick={action.onClick}>\n              {action.label}\n            </Button>\n          ) : null}\n        </Body>\n      </CSSTransition>\n    </div>\n  );\n};\n\nexport default withNextPortal(Snackbar);\n"],"names":["CSS_TRANSITION_DURATION","Snackbar","props","bodyRef","useRef","leaveTimeout","transitionTimeout","committedProps","state","setState","useState","visible","text","useEffect","window","clearTimeout","current","useLayoutEffect","previousProps","action","timestamp","updateWhileTextIsPresent","update","setLeaveTimeout","setTimeout","timeout","show","_jsx","className","role","children","CSSTransition","nodeRef","in","classNames","appear","enter","exit","unmountOnExit","_jsxs","Body","ref","as","Button","v2","size","onClick","label","withNextPortal"],"mappings":"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"}
+{"version":3,"file":"Snackbar.mjs","sources":["../../src/Snackbar/Snackbar.tsx"],"sourcesContent":["import { Tags } from '@transferwise/icons';\nimport { CSSTransition } from 'react-transition-group';\n\nimport Button, { type ButtonReferenceType } from '../Button';\nimport Body from '../Body';\nimport { LiveRegion } from '../common';\nimport type { ThemeDark, ThemeLight } from '../common';\nimport { PrimitivePrompt } from '../Prompt/PrimitivePrompt';\nimport type { Sentiment } from '../SentimentSurface';\nimport StatusIcon from '../StatusIcon';\n\nimport { SNACKBAR_ENTER_DURATION, SNACKBAR_EXIT_DURATION } from './constants';\nimport type { SnackbarAction, SnackbarDuration } from './Snackbar.types';\nimport useSnackbarAutoDismiss from './useSnackbarAutoDismiss';\n\n/**\n * Props for the controlled Snackbar surface, including provider-managed lifecycle controls.\n * Use SnackbarCreationProps when creating notifications through SnackbarProvider/useSnackbar.\n */\nexport interface SnackbarProps {\n  /** One optional callback or navigation action. Activating it dismisses after its callback runs. */\n  action?: SnackbarAction;\n  /** Changes for each new Snackbar so LiveRegion re-announces it. */\n  announcementKey: number;\n  /**\n   * Controls auto-dismiss with a four-second, six-second or indefinite duration after entry finishes.\n   * Takes precedence over the deprecated `timeout`.\n   * When neither option is supplied, the default is 4000ms (previously 4500ms).\n   * @default 'default'\n   */\n  duration?: SnackbarDuration;\n  /** Overrides sentiment-derived media with content for the 24×24px media slot. */\n  media?: React.ReactNode;\n  /**\n   * Requests an exit; the provider retains the surface until onExited confirms it has finished.\n   * An action preserves any follow-up notification created by its callback.\n   */\n  onDismissRequest: (reason?: 'action') => void;\n  /** Called after the exit animation so the provider can unmount active or show its replacement. */\n  onExited: () => void;\n  /**\n   * Controls the sentiment surface and default media.\n   * @default 'neutral'\n   */\n  sentiment?: Sentiment;\n  /** Message content. Empty strings or absent text dismiss without creating a blank replacement. */\n  text: React.ReactNode;\n  /** @deprecated Has no effect. Snackbar theming is based on ThemeProvider. */\n  theme?: ThemeLight | ThemeDark;\n  /**\n   * @deprecated Use `duration` instead. Explicit millisecond values remain supported and are not\n   * automatically remapped when no `duration` is supplied.\n   * To migrate, use `default` for 0–5000ms, `extended` for values above 5000ms, and `indefinite`\n   * for intentionally persistent notifications.\n   */\n  timeout?: number;\n  /** @deprecated Has no effect when using SnackbarProvider, which manages Snackbar identity. */\n  timestamp?: number;\n  /** Controls entry/exit; the surface does not manage visibility itself. */\n  visible: boolean;\n}\n\nexport const Snackbar = ({\n  action,\n  announcementKey,\n  duration,\n  media,\n  onDismissRequest,\n  onExited,\n  sentiment = 'neutral',\n  text,\n  timeout,\n  visible,\n}: SnackbarProps) => {\n  const { handleBlur, handleEntered, handleFocus, handleMouseEnter, handleMouseLeave, surfaceRef } =\n    useSnackbarAutoDismiss({\n      duration,\n      onDismissRequest,\n      timeout,\n      visible,\n    });\n\n  const handleActionClick: React.MouseEventHandler<ButtonReferenceType> = (event) => {\n    try {\n      action?.onClick?.(event);\n    } finally {\n      onDismissRequest('action');\n    }\n  };\n\n  const renderMedia = () => {\n    if (media) {\n      return <span className=\"wds-Snackbar__media-asset\">{media}</span>;\n    }\n\n    if (sentiment === 'proposition') {\n      return (\n        <span className=\"wds-Snackbar__media-asset\">\n          <Tags aria-hidden size={24} />\n        </span>\n      );\n    }\n\n    return <StatusIcon sentiment={sentiment} size={24} />;\n  };\n\n  return (\n    <div\n      className=\"wds-Snackbar\"\n      style={\n        {\n          '--Snackbar-enter-duration': `${SNACKBAR_ENTER_DURATION}ms`,\n          '--Snackbar-exit-duration': `${SNACKBAR_EXIT_DURATION}ms`,\n        } as React.CSSProperties\n      }\n    >\n      <CSSTransition\n        appear\n        nodeRef={surfaceRef}\n        in={visible}\n        classNames=\"wds-Snackbar-container\"\n        timeout={{\n          appear: SNACKBAR_ENTER_DURATION,\n          enter: SNACKBAR_ENTER_DURATION,\n          exit: SNACKBAR_EXIT_DURATION,\n        }}\n        unmountOnExit\n        onEntered={handleEntered}\n        onExited={onExited}\n      >\n        <PrimitivePrompt\n          ref={surfaceRef}\n          className=\"wds-Snackbar-container\"\n          sentiment={sentiment}\n          emphasis=\"elevated\"\n          media={renderMedia()}\n          onDismiss={onDismissRequest}\n          onMouseEnter={handleMouseEnter}\n          onMouseLeave={handleMouseLeave}\n          onFocus={handleFocus}\n          onBlur={handleBlur}\n        >\n          <div className=\"wds-Snackbar__content\">\n            <LiveRegion\n              aria-live=\"polite\"\n              announceOnChange={announcementKey}\n              className=\"wds-Snackbar__message\"\n            >\n              <Body as=\"span\" className=\"wds-Snackbar__body\">\n                {text}\n              </Body>\n            </LiveRegion>\n            {action ? (\n              <Button\n                className=\"wds-Snackbar__action\"\n                v2\n                size=\"sm\"\n                priority=\"secondary\"\n                href={action.href}\n                target={action.target}\n                onClick={handleActionClick}\n              >\n                {action.label}\n              </Button>\n            ) : null}\n          </div>\n        </PrimitivePrompt>\n      </CSSTransition>\n    </div>\n  );\n};\n\nexport default Snackbar;\n"],"names":["Snackbar","action","announcementKey","duration","media","onDismissRequest","onExited","sentiment","text","timeout","visible","handleBlur","handleEntered","handleFocus","handleMouseEnter","handleMouseLeave","surfaceRef","useSnackbarAutoDismiss","handleActionClick","event","onClick","renderMedia","_jsx","className","children","Tags","size","StatusIcon","style","SNACKBAR_ENTER_DURATION","SNACKBAR_EXIT_DURATION","CSSTransition","appear","nodeRef","in","classNames","enter","exit","unmountOnExit","onEntered","PrimitivePrompt","ref","emphasis","onDismiss","onMouseEnter","onMouseLeave","onFocus","onBlur","_jsxs","LiveRegion","announceOnChange","Body","as","Button","v2","priority","href","target","label"],"mappings":"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"}

package/build/Snackbar/SnackbarContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"SnackbarContext.js","sources":["../../src/Snackbar/SnackbarContext.ts"],"sourcesContent":["import { createContext } from 'react';\n\nimport { SnackbarProps } from './Snackbar';\n\nexport type SnackbarContextType = {\n  createSnackbar: (props: Omit<SnackbarProps, 'timeout' | 'timestamp'>) => void;\n};\n\nexport const SnackbarContext = createContext<SnackbarContextType>({ createSnackbar: () => {} });\n\nexport const SnackbarConsumer = SnackbarContext.Consumer;\n"],"names":["SnackbarContext","createContext","createSnackbar","SnackbarConsumer","Consumer"],"mappings":";;;;AAQO,MAAMA,eAAe,gBAAGC,mBAAa,CAAsB;EAAEC,cAAc,EAAEA,MAAK,CAAE;AAAC,CAAE;AAEvF,MAAMC,gBAAgB,GAAGH,eAAe,CAACI;;;"}
+{"version":3,"file":"SnackbarContext.js","sources":["../../src/Snackbar/SnackbarContext.ts"],"sourcesContent":["import { createContext } from 'react';\n\nimport type { SnackbarCreationProps } from './Snackbar.types';\n\nexport type SnackbarContextType = {\n  createSnackbar: (props: SnackbarCreationProps) => void;\n};\n\nexport const SnackbarContext = createContext<SnackbarContextType>({ createSnackbar: () => {} });\n\nexport const SnackbarConsumer = SnackbarContext.Consumer;\n"],"names":["SnackbarContext","createContext","createSnackbar","SnackbarConsumer","Consumer"],"mappings":";;;;AAQO,MAAMA,eAAe,gBAAGC,mBAAa,CAAsB;EAAEC,cAAc,EAAEA,MAAK,CAAE;AAAC,CAAE;AAEvF,MAAMC,gBAAgB,GAAGH,eAAe,CAACI;;;"}

package/build/Snackbar/SnackbarContext.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"SnackbarContext.mjs","sources":["../../src/Snackbar/SnackbarContext.ts"],"sourcesContent":["import { createContext } from 'react';\n\nimport { SnackbarProps } from './Snackbar';\n\nexport type SnackbarContextType = {\n  createSnackbar: (props: Omit<SnackbarProps, 'timeout' | 'timestamp'>) => void;\n};\n\nexport const SnackbarContext = createContext<SnackbarContextType>({ createSnackbar: () => {} });\n\nexport const SnackbarConsumer = SnackbarContext.Consumer;\n"],"names":["SnackbarContext","createContext","createSnackbar","SnackbarConsumer","Consumer"],"mappings":";;AAQO,MAAMA,eAAe,gBAAGC,aAAa,CAAsB;EAAEC,cAAc,EAAEA,MAAK,CAAE;AAAC,CAAE;AAEvF,MAAMC,gBAAgB,GAAGH,eAAe,CAACI;;"}
+{"version":3,"file":"SnackbarContext.mjs","sources":["../../src/Snackbar/SnackbarContext.ts"],"sourcesContent":["import { createContext } from 'react';\n\nimport type { SnackbarCreationProps } from './Snackbar.types';\n\nexport type SnackbarContextType = {\n  createSnackbar: (props: SnackbarCreationProps) => void;\n};\n\nexport const SnackbarContext = createContext<SnackbarContextType>({ createSnackbar: () => {} });\n\nexport const SnackbarConsumer = SnackbarContext.Consumer;\n"],"names":["SnackbarContext","createContext","createSnackbar","SnackbarConsumer","Consumer"],"mappings":";;AAQO,MAAMA,eAAe,gBAAGC,aAAa,CAAsB;EAAEC,cAAc,EAAEA,MAAK,CAAE;AAAC,CAAE;AAEvF,MAAMC,gBAAgB,GAAGH,eAAe,CAACI;;"}

package/build/Snackbar/SnackbarPortal.js

@@ -0,0 +1,12 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var WithNextPortal = require('../WithNextPortal/WithNextPortal.js');
+var Snackbar = require('./Snackbar.js');
+
+/** Renders the Snackbar into `document.body` after mount, so it's safe for SSR. */
+const SnackbarPortal = WithNextPortal.default(Snackbar.Snackbar);
+
+exports.default = SnackbarPortal;
+//# sourceMappingURL=SnackbarPortal.js.map

package/build/Snackbar/SnackbarPortal.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SnackbarPortal.js","sources":["../../src/Snackbar/SnackbarPortal.tsx"],"sourcesContent":["import withNextPortal from '../WithNextPortal/WithNextPortal';\n\nimport { Snackbar } from './Snackbar';\n\n/** Renders the Snackbar into `document.body` after mount, so it's safe for SSR. */\nconst SnackbarPortal = withNextPortal(Snackbar);\n\nexport default SnackbarPortal;\n"],"names":["SnackbarPortal","withNextPortal","Snackbar"],"mappings":";;;;;;;AAIA;AACA,MAAMA,cAAc,GAAGC,sBAAc,CAACC,iBAAQ;;"}

package/build/Snackbar/SnackbarPortal.mjs

@@ -0,0 +1,8 @@
+import withNextPortalWrapper from '../WithNextPortal/WithNextPortal.mjs';
+import { Snackbar } from './Snackbar.mjs';
+
+/** Renders the Snackbar into `document.body` after mount, so it's safe for SSR. */
+const SnackbarPortal = withNextPortalWrapper(Snackbar);
+
+export { SnackbarPortal as default };
+//# sourceMappingURL=SnackbarPortal.mjs.map

package/build/Snackbar/SnackbarPortal.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"SnackbarPortal.mjs","sources":["../../src/Snackbar/SnackbarPortal.tsx"],"sourcesContent":["import withNextPortal from '../WithNextPortal/WithNextPortal';\n\nimport { Snackbar } from './Snackbar';\n\n/** Renders the Snackbar into `document.body` after mount, so it's safe for SSR. */\nconst SnackbarPortal = withNextPortal(Snackbar);\n\nexport default SnackbarPortal;\n"],"names":["SnackbarPortal","withNextPortal","Snackbar"],"mappings":";;;AAIA;AACA,MAAMA,cAAc,GAAGC,qBAAc,CAACC,QAAQ;;"}

package/build/Snackbar/SnackbarProvider.js

@@ -3,42 +3,38 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
-var Snackbar = require('./Snackbar.js');
+var SnackbarPortal = require('./SnackbarPortal.js');
 var SnackbarContext = require('./SnackbarContext.js');
+var useSnackbarManager = require('./useSnackbarManager.js');
 var jsxRuntime = require('react/jsx-runtime');
 
 function SnackbarProvider({
-  timeout = 4500,
+  timeout,
   children
 }) {
-  const [state, setState] = React.useState({
-    text: '',
-    timestamp: 0
-  });
   const {
-    action,
-    text,
-    timestamp
-  } = state;
+    active,
+    announcementKey,
+    createSnackbar,
+    dismissSnackbar,
+    handleExited,
+    visible
+  } = useSnackbarManager.default();
+  const contextValue = React.useMemo(() => ({
+    createSnackbar
+  }), [createSnackbar]);
   return /*#__PURE__*/jsxRuntime.jsxs(SnackbarContext.SnackbarContext.Provider, {
-    value: React.useMemo(() => ({
-      createSnackbar: ({
-        action,
-        text
-      }) => {
-        setState({
-          action,
-          text,
-          timestamp: Date.now()
-        });
-      }
-    }), []),
-    children: [/*#__PURE__*/jsxRuntime.jsx(Snackbar.default, {
-      action: action,
-      text: text,
-      timestamp: timestamp,
-      timeout: timeout
-    }), children]
+    value: contextValue,
+    children: [active ? /*#__PURE__*/jsxRuntime.jsx(SnackbarPortal.default
+    // Each instance gets a fresh appear transition and live-region announcement.
+    , {
+      ...active.props,
+      announcementKey: announcementKey,
+      timeout: timeout,
+      visible: visible,
+      onDismissRequest: dismissSnackbar,
+      onExited: handleExited
+    }, active.id) : null, children]
   });
 }
 

package/build/Snackbar/SnackbarProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"SnackbarProvider.js","sources":["../../src/Snackbar/SnackbarProvider.tsx"],"sourcesContent":["import { useMemo, useState } from 'react';\n\nimport SnackbarPortal, { SnackbarProps } from './Snackbar';\nimport { SnackbarContext } from './SnackbarContext';\n\nexport interface SnackbarProviderProps {\n  timeout?: number;\n  children?: React.ReactNode;\n}\n\nexport default function SnackbarProvider({ timeout = 4500, children }: SnackbarProviderProps) {\n  const [state, setState] = useState<Omit<SnackbarProps, 'timeout'>>({\n    text: '',\n    timestamp: 0,\n  });\n  const { action, text, timestamp } = state;\n\n  return (\n    <SnackbarContext.Provider\n      value={useMemo(\n        () => ({\n          createSnackbar: ({ action, text }) => {\n            setState({ action, text, timestamp: Date.now() });\n          },\n        }),\n        [],\n      )}\n    >\n      <SnackbarPortal action={action} text={text} timestamp={timestamp} timeout={timeout} />\n      {children}\n    </SnackbarContext.Provider>\n  );\n}\n"],"names":["SnackbarProvider","timeout","children","state","setState","useState","text","timestamp","action","_jsxs","SnackbarContext","Provider","value","useMemo","createSnackbar","Date","now","_jsx","SnackbarPortal"],"mappings":";;;;;;;;;AAUc,SAAUA,gBAAgBA,CAAC;AAAEC,EAAAA,OAAO,GAAG,IAAI;AAAEC,EAAAA;AAAQ,CAAyB,EAAA;AAC1F,EAAA,MAAM,CAACC,KAAK,EAAEC,QAAQ,CAAC,GAAGC,cAAQ,CAAiC;AACjEC,IAAAA,IAAI,EAAE,EAAE;AACRC,IAAAA,SAAS,EAAE;AACZ,GAAA,CAAC;EACF,MAAM;IAAEC,MAAM;IAAEF,IAAI;AAAEC,IAAAA;AAAS,GAAE,GAAGJ,KAAK;AAEzC,EAAA,oBACEM,eAAA,CAACC,+BAAe,CAACC,QAAQ,EAAA;IACvBC,KAAK,EAAEC,aAAO,CACZ,OAAO;AACLC,MAAAA,cAAc,EAAEA,CAAC;QAAEN,MAAM;AAAEF,QAAAA;AAAI,OAAE,KAAI;AACnCF,QAAAA,QAAQ,CAAC;UAAEI,MAAM;UAAEF,IAAI;AAAEC,UAAAA,SAAS,EAAEQ,IAAI,CAACC,GAAG;AAAE,SAAE,CAAC;AACnD,MAAA;KACD,CAAC,EACF,EAAE,CACF;IAAAd,QAAA,EAAA,cAEFe,cAAA,CAACC,gBAAc,EAAA;AAACV,MAAAA,MAAM,EAAEA,MAAO;AAACF,MAAAA,IAAI,EAAEA,IAAK;AAACC,MAAAA,SAAS,EAAEA,SAAU;AAACN,MAAAA,OAAO,EAAEA;KAAQ,CACnF,EAACC,QAAQ;AAAA,GACe,CAAC;AAE/B;;"}
+{"version":3,"file":"SnackbarProvider.js","sources":["../../src/Snackbar/SnackbarProvider.tsx"],"sourcesContent":["import { useMemo } from 'react';\n\nimport SnackbarPortal from './SnackbarPortal';\nimport { SnackbarContext } from './SnackbarContext';\nimport useSnackbarManager from './useSnackbarManager';\n\nexport interface SnackbarProviderProps {\n  /**\n   * @deprecated Use per-Snackbar `duration` instead. Explicit millisecond values remain supported\n   * and are not automatically remapped when no `duration` is supplied.\n   * When neither option is supplied, the default is 4000ms (previously 4500ms), after entry finishes.\n   * To migrate, use `default` for 0–5000ms, `extended` for values above 5000ms, and `indefinite`\n   * for intentionally persistent notifications.\n   */\n  timeout?: number;\n  children?: React.ReactNode;\n}\n\nexport default function SnackbarProvider({ timeout, children }: SnackbarProviderProps) {\n  const { active, announcementKey, createSnackbar, dismissSnackbar, handleExited, visible } =\n    useSnackbarManager();\n  const contextValue = useMemo(() => ({ createSnackbar }), [createSnackbar]);\n\n  return (\n    <SnackbarContext.Provider value={contextValue}>\n      {active ? (\n        <SnackbarPortal\n          // Each instance gets a fresh appear transition and live-region announcement.\n          key={active.id}\n          {...active.props}\n          announcementKey={announcementKey}\n          timeout={timeout}\n          visible={visible}\n          onDismissRequest={dismissSnackbar}\n          onExited={handleExited}\n        />\n      ) : null}\n      {children}\n    </SnackbarContext.Provider>\n  );\n}\n"],"names":["SnackbarProvider","timeout","children","active","announcementKey","createSnackbar","dismissSnackbar","handleExited","visible","useSnackbarManager","contextValue","useMemo","_jsxs","SnackbarContext","Provider","value","_jsx","SnackbarPortal","props","onDismissRequest","onExited","id"],"mappings":";;;;;;;;;;AAkBc,SAAUA,gBAAgBA,CAAC;EAAEC,OAAO;AAAEC,EAAAA;AAAQ,CAAyB,EAAA;EACnF,MAAM;IAAEC,MAAM;IAAEC,eAAe;IAAEC,cAAc;IAAEC,eAAe;IAAEC,YAAY;AAAEC,IAAAA;GAAS,GACvFC,0BAAkB,EAAE;AACtB,EAAA,MAAMC,YAAY,GAAGC,aAAO,CAAC,OAAO;AAAEN,IAAAA;GAAgB,CAAC,EAAE,CAACA,cAAc,CAAC,CAAC;AAE1E,EAAA,oBACEO,eAAA,CAACC,+BAAe,CAACC,QAAQ,EAAA;AAACC,IAAAA,KAAK,EAAEL,YAAa;AAAAR,IAAAA,QAAA,EAAA,CAC3CC,MAAM,gBACLa,cAAA,CAACC;AACC;AAAA,MAAA;MAAA,GAEId,MAAM,CAACe,KAAK;AAChBd,MAAAA,eAAe,EAAEA,eAAgB;AACjCH,MAAAA,OAAO,EAAEA,OAAQ;AACjBO,MAAAA,OAAO,EAAEA,OAAQ;AACjBW,MAAAA,gBAAgB,EAAEb,eAAgB;AAClCc,MAAAA,QAAQ,EAAEb;AAAa,KAAA,EANlBJ,MAAM,CAACkB,EAMW,CACvB,GACA,IAAI,EACPnB,QAAQ;AAAA,GACe,CAAC;AAE/B;;"}

package/build/Snackbar/SnackbarProvider.mjs

@@ -1,40 +1,36 @@
-import { useState, useMemo } from 'react';
-import SnackbarPortal from './Snackbar.mjs';
+import { useMemo } from 'react';
+import SnackbarPortal from './SnackbarPortal.mjs';
 import { SnackbarContext } from './SnackbarContext.mjs';
+import useSnackbarManager from './useSnackbarManager.mjs';
 import { jsxs, jsx } from 'react/jsx-runtime';
 
 function SnackbarProvider({
-  timeout = 4500,
+  timeout,
   children
 }) {
-  const [state, setState] = useState({
-    text: '',
-    timestamp: 0
-  });
   const {
-    action,
-    text,
-    timestamp
-  } = state;
+    active,
+    announcementKey,
+    createSnackbar,
+    dismissSnackbar,
+    handleExited,
+    visible
+  } = useSnackbarManager();
+  const contextValue = useMemo(() => ({
+    createSnackbar
+  }), [createSnackbar]);
   return /*#__PURE__*/jsxs(SnackbarContext.Provider, {
-    value: useMemo(() => ({
-      createSnackbar: ({
-        action,
-        text
-      }) => {
-        setState({
-          action,
-          text,
-          timestamp: Date.now()
-        });
-      }
-    }), []),
-    children: [/*#__PURE__*/jsx(SnackbarPortal, {
-      action: action,
-      text: text,
-      timestamp: timestamp,
-      timeout: timeout
-    }), children]
+    value: contextValue,
+    children: [active ? /*#__PURE__*/jsx(SnackbarPortal
+    // Each instance gets a fresh appear transition and live-region announcement.
+    , {
+      ...active.props,
+      announcementKey: announcementKey,
+      timeout: timeout,
+      visible: visible,
+      onDismissRequest: dismissSnackbar,
+      onExited: handleExited
+    }, active.id) : null, children]
   });
 }
 

package/build/Snackbar/SnackbarProvider.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"SnackbarProvider.mjs","sources":["../../src/Snackbar/SnackbarProvider.tsx"],"sourcesContent":["import { useMemo, useState } from 'react';\n\nimport SnackbarPortal, { SnackbarProps } from './Snackbar';\nimport { SnackbarContext } from './SnackbarContext';\n\nexport interface SnackbarProviderProps {\n  timeout?: number;\n  children?: React.ReactNode;\n}\n\nexport default function SnackbarProvider({ timeout = 4500, children }: SnackbarProviderProps) {\n  const [state, setState] = useState<Omit<SnackbarProps, 'timeout'>>({\n    text: '',\n    timestamp: 0,\n  });\n  const { action, text, timestamp } = state;\n\n  return (\n    <SnackbarContext.Provider\n      value={useMemo(\n        () => ({\n          createSnackbar: ({ action, text }) => {\n            setState({ action, text, timestamp: Date.now() });\n          },\n        }),\n        [],\n      )}\n    >\n      <SnackbarPortal action={action} text={text} timestamp={timestamp} timeout={timeout} />\n      {children}\n    </SnackbarContext.Provider>\n  );\n}\n"],"names":["SnackbarProvider","timeout","children","state","setState","useState","text","timestamp","action","_jsxs","SnackbarContext","Provider","value","useMemo","createSnackbar","Date","now","_jsx","SnackbarPortal"],"mappings":";;;;;AAUc,SAAUA,gBAAgBA,CAAC;AAAEC,EAAAA,OAAO,GAAG,IAAI;AAAEC,EAAAA;AAAQ,CAAyB,EAAA;AAC1F,EAAA,MAAM,CAACC,KAAK,EAAEC,QAAQ,CAAC,GAAGC,QAAQ,CAAiC;AACjEC,IAAAA,IAAI,EAAE,EAAE;AACRC,IAAAA,SAAS,EAAE;AACZ,GAAA,CAAC;EACF,MAAM;IAAEC,MAAM;IAAEF,IAAI;AAAEC,IAAAA;AAAS,GAAE,GAAGJ,KAAK;AAEzC,EAAA,oBACEM,IAAA,CAACC,eAAe,CAACC,QAAQ,EAAA;IACvBC,KAAK,EAAEC,OAAO,CACZ,OAAO;AACLC,MAAAA,cAAc,EAAEA,CAAC;QAAEN,MAAM;AAAEF,QAAAA;AAAI,OAAE,KAAI;AACnCF,QAAAA,QAAQ,CAAC;UAAEI,MAAM;UAAEF,IAAI;AAAEC,UAAAA,SAAS,EAAEQ,IAAI,CAACC,GAAG;AAAE,SAAE,CAAC;AACnD,MAAA;KACD,CAAC,EACF,EAAE,CACF;IAAAd,QAAA,EAAA,cAEFe,GAAA,CAACC,cAAc,EAAA;AAACV,MAAAA,MAAM,EAAEA,MAAO;AAACF,MAAAA,IAAI,EAAEA,IAAK;AAACC,MAAAA,SAAS,EAAEA,SAAU;AAACN,MAAAA,OAAO,EAAEA;KAAQ,CACnF,EAACC,QAAQ;AAAA,GACe,CAAC;AAE/B;;"}
+{"version":3,"file":"SnackbarProvider.mjs","sources":["../../src/Snackbar/SnackbarProvider.tsx"],"sourcesContent":["import { useMemo } from 'react';\n\nimport SnackbarPortal from './SnackbarPortal';\nimport { SnackbarContext } from './SnackbarContext';\nimport useSnackbarManager from './useSnackbarManager';\n\nexport interface SnackbarProviderProps {\n  /**\n   * @deprecated Use per-Snackbar `duration` instead. Explicit millisecond values remain supported\n   * and are not automatically remapped when no `duration` is supplied.\n   * When neither option is supplied, the default is 4000ms (previously 4500ms), after entry finishes.\n   * To migrate, use `default` for 0–5000ms, `extended` for values above 5000ms, and `indefinite`\n   * for intentionally persistent notifications.\n   */\n  timeout?: number;\n  children?: React.ReactNode;\n}\n\nexport default function SnackbarProvider({ timeout, children }: SnackbarProviderProps) {\n  const { active, announcementKey, createSnackbar, dismissSnackbar, handleExited, visible } =\n    useSnackbarManager();\n  const contextValue = useMemo(() => ({ createSnackbar }), [createSnackbar]);\n\n  return (\n    <SnackbarContext.Provider value={contextValue}>\n      {active ? (\n        <SnackbarPortal\n          // Each instance gets a fresh appear transition and live-region announcement.\n          key={active.id}\n          {...active.props}\n          announcementKey={announcementKey}\n          timeout={timeout}\n          visible={visible}\n          onDismissRequest={dismissSnackbar}\n          onExited={handleExited}\n        />\n      ) : null}\n      {children}\n    </SnackbarContext.Provider>\n  );\n}\n"],"names":["SnackbarProvider","timeout","children","active","announcementKey","createSnackbar","dismissSnackbar","handleExited","visible","useSnackbarManager","contextValue","useMemo","_jsxs","SnackbarContext","Provider","value","_jsx","SnackbarPortal","props","onDismissRequest","onExited","id"],"mappings":";;;;;;AAkBc,SAAUA,gBAAgBA,CAAC;EAAEC,OAAO;AAAEC,EAAAA;AAAQ,CAAyB,EAAA;EACnF,MAAM;IAAEC,MAAM;IAAEC,eAAe;IAAEC,cAAc;IAAEC,eAAe;IAAEC,YAAY;AAAEC,IAAAA;GAAS,GACvFC,kBAAkB,EAAE;AACtB,EAAA,MAAMC,YAAY,GAAGC,OAAO,CAAC,OAAO;AAAEN,IAAAA;GAAgB,CAAC,EAAE,CAACA,cAAc,CAAC,CAAC;AAE1E,EAAA,oBACEO,IAAA,CAACC,eAAe,CAACC,QAAQ,EAAA;AAACC,IAAAA,KAAK,EAAEL,YAAa;AAAAR,IAAAA,QAAA,EAAA,CAC3CC,MAAM,gBACLa,GAAA,CAACC;AACC;AAAA,MAAA;MAAA,GAEId,MAAM,CAACe,KAAK;AAChBd,MAAAA,eAAe,EAAEA,eAAgB;AACjCH,MAAAA,OAAO,EAAEA,OAAQ;AACjBO,MAAAA,OAAO,EAAEA,OAAQ;AACjBW,MAAAA,gBAAgB,EAAEb,eAAgB;AAClCc,MAAAA,QAAQ,EAAEb;AAAa,KAAA,EANlBJ,MAAM,CAACkB,EAMW,CACvB,GACA,IAAI,EACPnB,QAAQ;AAAA,GACe,CAAC;AAE/B;;"}

package/build/Snackbar/constants.js

@@ -0,0 +1,14 @@
+'use strict';
+
+const SNACKBAR_ENTER_DURATION = 300;
+const SNACKBAR_EXIT_DURATION = 150;
+/** Default auto-dismiss duration for short feedback, in milliseconds. */
+const SNACKBAR_DEFAULT_DURATION = 4000;
+/** Extended auto-dismiss duration for messages needing more reading time, in milliseconds. */
+const SNACKBAR_EXTENDED_DURATION = 6000;
+
+exports.SNACKBAR_DEFAULT_DURATION = SNACKBAR_DEFAULT_DURATION;
+exports.SNACKBAR_ENTER_DURATION = SNACKBAR_ENTER_DURATION;
+exports.SNACKBAR_EXIT_DURATION = SNACKBAR_EXIT_DURATION;
+exports.SNACKBAR_EXTENDED_DURATION = SNACKBAR_EXTENDED_DURATION;
+//# sourceMappingURL=constants.js.map

package/build/Snackbar/constants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.js","sources":["../../src/Snackbar/constants.ts"],"sourcesContent":["export const SNACKBAR_ENTER_DURATION = 300;\nexport const SNACKBAR_EXIT_DURATION = 150;\n\n/** Default auto-dismiss duration for short feedback, in milliseconds. */\nexport const SNACKBAR_DEFAULT_DURATION = 4000;\n/** Extended auto-dismiss duration for messages needing more reading time, in milliseconds. */\nexport const SNACKBAR_EXTENDED_DURATION = 6000;\n"],"names":["SNACKBAR_ENTER_DURATION","SNACKBAR_EXIT_DURATION","SNACKBAR_DEFAULT_DURATION","SNACKBAR_EXTENDED_DURATION"],"mappings":";;AAAO,MAAMA,uBAAuB,GAAG;AAChC,MAAMC,sBAAsB,GAAG;AAEtC;AACO,MAAMC,yBAAyB,GAAG;AACzC;AACO,MAAMC,0BAA0B,GAAG;;;;;"}

package/build/Snackbar/constants.mjs

@@ -0,0 +1,9 @@
+const SNACKBAR_ENTER_DURATION = 300;
+const SNACKBAR_EXIT_DURATION = 150;
+/** Default auto-dismiss duration for short feedback, in milliseconds. */
+const SNACKBAR_DEFAULT_DURATION = 4000;
+/** Extended auto-dismiss duration for messages needing more reading time, in milliseconds. */
+const SNACKBAR_EXTENDED_DURATION = 6000;
+
+export { SNACKBAR_DEFAULT_DURATION, SNACKBAR_ENTER_DURATION, SNACKBAR_EXIT_DURATION, SNACKBAR_EXTENDED_DURATION };
+//# sourceMappingURL=constants.mjs.map

package/build/Snackbar/constants.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.mjs","sources":["../../src/Snackbar/constants.ts"],"sourcesContent":["export const SNACKBAR_ENTER_DURATION = 300;\nexport const SNACKBAR_EXIT_DURATION = 150;\n\n/** Default auto-dismiss duration for short feedback, in milliseconds. */\nexport const SNACKBAR_DEFAULT_DURATION = 4000;\n/** Extended auto-dismiss duration for messages needing more reading time, in milliseconds. */\nexport const SNACKBAR_EXTENDED_DURATION = 6000;\n"],"names":["SNACKBAR_ENTER_DURATION","SNACKBAR_EXIT_DURATION","SNACKBAR_DEFAULT_DURATION","SNACKBAR_EXTENDED_DURATION"],"mappings":"AAAO,MAAMA,uBAAuB,GAAG;AAChC,MAAMC,sBAAsB,GAAG;AAEtC;AACO,MAAMC,yBAAyB,GAAG;AACzC;AACO,MAAMC,0BAA0B,GAAG;;"}