@cloudscape-design/components 3.0.1344 → 3.0.1346

package/internal/components/transition/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/transition/index.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useState } from 'react';\nimport { MutableRefObject, useCallback, useRef } from 'react';\nimport {\n  Transition as ReactTransitionGroupTransition,\n  TransitionStatus as ReactTransitionGroupTransitionStatus,\n} from 'react-transition-group';\n\nimport { useReducedMotion } from '@cloudscape-design/component-toolkit/internal';\n\nexport type TransitionStatus = ReactTransitionGroupTransitionStatus | 'enter' | 'exit';\n\ninterface TransitionProps {\n  in: boolean;\n  exit?: boolean;\n\n  disabled?: boolean;\n\n  children: (state: TransitionStatus, transitioningElementRef: MutableRefObject<any>) => React.ReactNode;\n  onStatusChange?: (status: TransitionStatus) => void;\n  transitionChangeDelay?: { entering?: number };\n  exitTimeout?: number;\n}\n\n/**\n * This component is a wrapper around the CSSTransition component.\n *\n * It provides a second parameter in its rendering function that must be\n * attached to the node that is transitioning.\n */\nexport function Transition({\n  in: isIn,\n  children,\n  exit = true,\n  onStatusChange = () => void 0,\n  disabled = false,\n  transitionChangeDelay,\n  exitTimeout,\n  ...rest\n}: TransitionProps) {\n  const transitionRootElement = useRef<HTMLElement>(null);\n  // the initial state of the transition should be either 'exited' or 'entered' depending\n  // on the `in` property, this mimicks how internally the Transition component works here:\n  // https://github.com/reactjs/react-transition-group/blob/6cbd6aaedaf8e9472007640b429ddb48c6c24158/src/Transition.js#L121\n  const [transitionState, setTransitionState] = useState<TransitionStatus>(isIn ? 'entered' : 'exited');\n  const motionDisabled = useReducedMotion(transitionRootElement) || disabled;\n\n  const addTransitionEndListener = useCallback((done: () => void) => {\n    const node = transitionRootElement.current;\n\n    if (node === null) {\n      return;\n    }\n    const controller = new AbortController();\n    const listener = (e: TransitionEvent | AnimationEvent) => {\n      if (e.target === node) {\n        controller.abort();\n        done();\n      }\n    };\n    node.addEventListener('transitionend', listener, { signal: controller.signal });\n    node.addEventListener('animationend', listener, { signal: controller.signal });\n  }, []);\n\n  return (\n    <ReactTransitionGroupTransition\n      addEndListener={addTransitionEndListener}\n      timeout={motionDisabled ? 0 : exitTimeout}\n      in={isIn}\n      nodeRef={transitionRootElement}\n      exit={exit}\n      onEnter={isAppearing => {\n        if (!isAppearing) {\n          setTransitionState('enter');\n          onStatusChange('enter');\n        }\n      }}\n      onEntering={isAppearing => {\n        if (!isAppearing) {\n          // This line forces the browser to recalculate the layout because we want the starting state in the 'enter' style\n          // to be applied before the animation starts.\n          void transitionRootElement.current?.offsetHeight;\n\n          if (transitionChangeDelay?.entering) {\n            setTimeout(() => {\n              setTransitionState('entering');\n              onStatusChange('entering');\n            }, transitionChangeDelay?.entering);\n          } else {\n            setTransitionState('entering');\n            onStatusChange('entering');\n          }\n        }\n      }}\n      onEntered={isAppearing => {\n        if (!isAppearing) {\n          setTransitionState('entered');\n          onStatusChange('entered');\n        }\n      }}\n      onExit={() => {\n        setTransitionState('exit');\n        onStatusChange('exit');\n      }}\n      onExiting={() => {\n        setTransitionState('exiting');\n        onStatusChange('exiting');\n      }}\n      onExited={() => {\n        setTransitionState('exited');\n        onStatusChange('exited');\n      }}\n      {...rest}\n    >\n      {() => children(transitionState, transitionRootElement)}\n    </ReactTransitionGroupTransition>\n  );\n}\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/transition/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACxC,OAAO,EAAoB,WAAW,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAC9D,OAAO,EACL,UAAU,IAAI,8BAA8B,GAE7C,MAAM,wBAAwB,CAAC;AAEhC,OAAO,EAAE,gBAAgB,EAAE,MAAM,+CAA+C,CAAC;AAoBjF;;;;;GAKG;AACH,MAAM,UAAU,UAAU,CAA8B,EACtD,EAAE,EAAE,IAAI,EACR,QAAQ,EACR,IAAI,GAAG,IAAI,EACX,cAAc,GAAG,GAAG,EAAE,CAAC,KAAK,CAAC,EAC7B,QAAQ,GAAG,KAAK,EAChB,qBAAqB,EACrB,WAAW,EACX,GAAG,IAAI,EACY;IACnB,MAAM,qBAAqB,GAAG,MAAM,CAAI,IAAI,CAAC,CAAC;IAC9C,uFAAuF;IACvF,yFAAyF;IACzF,yHAAyH;IACzH,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,QAAQ,CAAmB,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC;IACtG,MAAM,cAAc,GAAG,gBAAgB,CAAC,qBAAqB,CAAC,IAAI,QAAQ,CAAC;IAE3E,MAAM,wBAAwB,GAAG,WAAW,CAAC,CAAC,IAAgB,EAAE,EAAE;QAChE,MAAM,IAAI,GAAG,qBAAqB,CAAC,OAAO,CAAC;QAE3C,IAAI,IAAI,KAAK,IAAI,EAAE,CAAC;YAClB,OAAO;QACT,CAAC;QACD,MAAM,UAAU,GAAG,IAAI,eAAe,EAAE,CAAC;QACzC,MAAM,QAAQ,GAAG,CAAC,CAAmC,EAAE,EAAE;YACvD,IAAI,CAAC,CAAC,MAAM,KAAK,IAAI,EAAE,CAAC;gBACtB,UAAU,CAAC,KAAK,EAAE,CAAC;gBACnB,IAAI,EAAE,CAAC;YACT,CAAC;QACH,CAAC,CAAC;QACF,IAAI,CAAC,gBAAgB,CAAC,eAAe,EAAE,QAAQ,EAAE,EAAE,MAAM,EAAE,UAAU,CAAC,MAAM,EAAE,CAAC,CAAC;QAChF,IAAI,CAAC,gBAAgB,CAAC,cAAc,EAAE,QAAQ,EAAE,EAAE,MAAM,EAAE,UAAU,CAAC,MAAM,EAAE,CAAC,CAAC;IACjF,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,CACL,oBAAC,8BAA8B,IAC7B,cAAc,EAAE,wBAAwB,EACxC,OAAO,EAAE,cAAc,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,WAAW,EACzC,EAAE,EAAE,IAAI,EACR,OAAO,EAAE,qBAAqB,EAC9B,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,WAAW,CAAC,EAAE;YACrB,IAAI,CAAC,WAAW,EAAE,CAAC;gBACjB,kBAAkB,CAAC,OAAO,CAAC,CAAC;gBAC5B,cAAc,CAAC,OAAO,CAAC,CAAC;YAC1B,CAAC;QACH,CAAC,EACD,UAAU,EAAE,WAAW,CAAC,EAAE;;YACxB,IAAI,CAAC,WAAW,EAAE,CAAC;gBACjB,iHAAiH;gBACjH,6CAA6C;gBAC7C,KAAK,CAAA,MAAA,qBAAqB,CAAC,OAAO,0CAAE,YAAY,CAAA,CAAC;gBAEjD,IAAI,qBAAqB,aAArB,qBAAqB,uBAArB,qBAAqB,CAAE,QAAQ,EAAE,CAAC;oBACpC,UAAU,CAAC,GAAG,EAAE;wBACd,kBAAkB,CAAC,UAAU,CAAC,CAAC;wBAC/B,cAAc,CAAC,UAAU,CAAC,CAAC;oBAC7B,CAAC,EAAE,qBAAqB,aAArB,qBAAqB,uBAArB,qBAAqB,CAAE,QAAQ,CAAC,CAAC;gBACtC,CAAC;qBAAM,CAAC;oBACN,kBAAkB,CAAC,UAAU,CAAC,CAAC;oBAC/B,cAAc,CAAC,UAAU,CAAC,CAAC;gBAC7B,CAAC;YACH,CAAC;QACH,CAAC,EACD,SAAS,EAAE,WAAW,CAAC,EAAE;YACvB,IAAI,CAAC,WAAW,EAAE,CAAC;gBACjB,kBAAkB,CAAC,SAAS,CAAC,CAAC;gBAC9B,cAAc,CAAC,SAAS,CAAC,CAAC;YAC5B,CAAC;QACH,CAAC,EACD,MAAM,EAAE,GAAG,EAAE;YACX,kBAAkB,CAAC,MAAM,CAAC,CAAC;YAC3B,cAAc,CAAC,MAAM,CAAC,CAAC;QACzB,CAAC,EACD,SAAS,EAAE,GAAG,EAAE;YACd,kBAAkB,CAAC,SAAS,CAAC,CAAC;YAC9B,cAAc,CAAC,SAAS,CAAC,CAAC;QAC5B,CAAC,EACD,QAAQ,EAAE,GAAG,EAAE;YACb,kBAAkB,CAAC,QAAQ,CAAC,CAAC;YAC7B,cAAc,CAAC,QAAQ,CAAC,CAAC;QAC3B,CAAC,KACG,IAAI,IAEP,GAAG,EAAE,CAAC,QAAQ,CAAC,eAAe,EAAE,qBAAqB,EAAE,cAAc,CAAC,CACxC,CAClC,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useState } from 'react';\nimport { MutableRefObject, useCallback, useRef } from 'react';\nimport {\n  Transition as ReactTransitionGroupTransition,\n  TransitionStatus as ReactTransitionGroupTransitionStatus,\n} from 'react-transition-group';\n\nimport { useReducedMotion } from '@cloudscape-design/component-toolkit/internal';\n\nexport type TransitionStatus = ReactTransitionGroupTransitionStatus | 'enter' | 'exit';\n\ninterface TransitionProps<T extends HTMLElement> {\n  in: boolean;\n  exit?: boolean;\n\n  disabled?: boolean;\n\n  children: (\n    state: TransitionStatus,\n    transitioningElementRef: MutableRefObject<T | null>,\n    motionDisabled: boolean\n  ) => React.ReactNode;\n  onStatusChange?: (status: TransitionStatus) => void;\n  transitionChangeDelay?: { entering?: number };\n  exitTimeout?: number;\n}\n\n/**\n * This component wraps react-transition-group's Transition component.\n *\n * Its rendering function receives the transition state, a ref that must be attached to the transitioning node,\n * and whether motion is disabled by either user preference or the disabled prop.\n */\nexport function Transition<T extends HTMLElement = any>({\n  in: isIn,\n  children,\n  exit = true,\n  onStatusChange = () => void 0,\n  disabled = false,\n  transitionChangeDelay,\n  exitTimeout,\n  ...rest\n}: TransitionProps<T>) {\n  const transitionRootElement = useRef<T>(null);\n  // the initial state of the transition should be either 'exited' or 'entered' depending\n  // on the `in` property, this mimicks how internally the Transition component works here:\n  // https://github.com/reactjs/react-transition-group/blob/6cbd6aaedaf8e9472007640b429ddb48c6c24158/src/Transition.js#L121\n  const [transitionState, setTransitionState] = useState<TransitionStatus>(isIn ? 'entered' : 'exited');\n  const motionDisabled = useReducedMotion(transitionRootElement) || disabled;\n\n  const addTransitionEndListener = useCallback((done: () => void) => {\n    const node = transitionRootElement.current;\n\n    if (node === null) {\n      return;\n    }\n    const controller = new AbortController();\n    const listener = (e: TransitionEvent | AnimationEvent) => {\n      if (e.target === node) {\n        controller.abort();\n        done();\n      }\n    };\n    node.addEventListener('transitionend', listener, { signal: controller.signal });\n    node.addEventListener('animationend', listener, { signal: controller.signal });\n  }, []);\n\n  return (\n    <ReactTransitionGroupTransition\n      addEndListener={addTransitionEndListener}\n      timeout={motionDisabled ? 0 : exitTimeout}\n      in={isIn}\n      nodeRef={transitionRootElement}\n      exit={exit}\n      onEnter={isAppearing => {\n        if (!isAppearing) {\n          setTransitionState('enter');\n          onStatusChange('enter');\n        }\n      }}\n      onEntering={isAppearing => {\n        if (!isAppearing) {\n          // This line forces the browser to recalculate the layout because we want the starting state in the 'enter' style\n          // to be applied before the animation starts.\n          void transitionRootElement.current?.offsetHeight;\n\n          if (transitionChangeDelay?.entering) {\n            setTimeout(() => {\n              setTransitionState('entering');\n              onStatusChange('entering');\n            }, transitionChangeDelay?.entering);\n          } else {\n            setTransitionState('entering');\n            onStatusChange('entering');\n          }\n        }\n      }}\n      onEntered={isAppearing => {\n        if (!isAppearing) {\n          setTransitionState('entered');\n          onStatusChange('entered');\n        }\n      }}\n      onExit={() => {\n        setTransitionState('exit');\n        onStatusChange('exit');\n      }}\n      onExiting={() => {\n        setTransitionState('exiting');\n        onStatusChange('exiting');\n      }}\n      onExited={() => {\n        setTransitionState('exited');\n        onStatusChange('exited');\n      }}\n      {...rest}\n    >\n      {() => children(transitionState, transitionRootElement, motionDisabled)}\n    </ReactTransitionGroupTransition>\n  );\n}\n"]}

package/internal/environment.js

@@ -1,6 +1,6 @@
 export var PACKAGE_SOURCE = "components";
-export var PACKAGE_VERSION = "3.0.0 (21c5e82c)";
-export var GIT_SHA = "21c5e82c";
+export var PACKAGE_VERSION = "3.0.0 (7f29935f)";
+export var GIT_SHA = "7f29935f";
 export var THEME = "open-source-visual-refresh";
 export var SYSTEM = "core";
 export var ALWAYS_VISUAL_REFRESH = true;

package/internal/environment.json

@@ -1,7 +1,7 @@
 {
   "PACKAGE_SOURCE": "components",
-  "PACKAGE_VERSION": "3.0.0 (21c5e82c)",
-  "GIT_SHA": "21c5e82c",
+  "PACKAGE_VERSION": "3.0.0 (7f29935f)",
+  "GIT_SHA": "7f29935f",
   "THEME": "open-source-visual-refresh",
   "SYSTEM": "core",
   "ALWAYS_VISUAL_REFRESH": true,

package/internal/generated/styles/tokens.d.ts

@@ -469,6 +469,8 @@ export const colorBackgroundNotificationStackBarActive: string;
 export const colorBackgroundNotificationStackBarHover: string;
 export const colorBackgroundPopover: string;
 export const colorBackgroundProgressBarValueDefault: string;
+export const colorBackgroundProgressBarValueFlash: string;
+export const colorBackgroundProgressBarFlash: string;
 export const colorBackgroundProgressBarDefault: string;
 export const colorBackgroundSegmentActive: string;
 export const colorBackgroundSegmentDefault: string;
@@ -491,6 +493,10 @@ export const colorBackgroundSliderRangeWarningDefault: string;
 export const colorBackgroundSliderRangeWarningActive: string;
 export const colorBackgroundStatusError: string;
 export const colorBackgroundStatusInfo: string;
+export const colorBackgroundAlertError: string;
+export const colorBackgroundAlertInfo: string;
+export const colorBackgroundAlertSuccess: string;
+export const colorBackgroundAlertWarning: string;
 export const colorBackgroundDialog: string;
 export const colorBackgroundStatusSuccess: string;
 export const colorBackgroundStatusWarning: string;
@@ -548,6 +554,7 @@ export const colorBorderControlDefault: string;
 export const colorBorderControlDisabled: string;
 export const colorBorderDividerActive: string;
 export const colorBorderDividerDefault: string;
+export const colorBorderDividerNotification: string;
 export const colorBorderDividerPanelBottom: string;
 export const colorBorderDividerPanelSide: string;
 export const colorBorderDividerSecondary: string;
@@ -570,6 +577,7 @@ export const colorBorderItemSelected: string;
 export const colorBorderLayout: string;
 export const colorBorderLayoutSideNavigation: string;
 export const colorBorderNotificationStackBar: string;
+export const colorBorderNotificationStackBarFocused: string;
 export const colorBorderPanelHeader: string;
 export const colorBorderPopover: string;
 export const colorBorderSegmentActive: string;
@@ -685,10 +693,14 @@ export const colorTextLinkSecondaryDefault: string;
 export const colorTextLinkSecondaryHover: string;
 export const colorTextLinkInfoDefault: string;
 export const colorTextLinkInfoHover: string;
+export const colorTextLinkInvertedDefault: string;
 export const colorTextLinkInvertedHover: string;
 export const colorTextLinkButtonUnderline: string;
 export const colorTextLinkButtonUnderlineHover: string;
 export const colorTextNotificationDefault: string;
+export const colorTextAlertDefault: string;
+export const colorTextNotificationLinkDefault: string;
+export const colorTextNotificationLinkHover: string;
 export const colorTextNotificationStackBar: string;
 export const colorTextNotificationYellow: string;
 export const colorTextPaginationPageNumberActiveDisabled: string;
@@ -697,6 +709,14 @@ export const colorTextSegmentActive: string;
 export const colorTextSegmentDefault: string;
 export const colorTextSegmentHover: string;
 export const colorTextSmall: string;
+export const colorTextFlashbarIconError: string;
+export const colorTextFlashbarIconInfo: string;
+export const colorTextFlashbarIconSuccess: string;
+export const colorTextFlashbarIconWarning: string;
+export const colorTextAlertIconError: string;
+export const colorTextAlertIconInfo: string;
+export const colorTextAlertIconSuccess: string;
+export const colorTextAlertIconWarning: string;
 export const colorTextStatusError: string;
 export const colorTextStatusInactive: string;
 export const colorTextStatusInfo: string;
@@ -966,6 +986,12 @@ export const motionDurationExpressive: string;
 export const motionDurationComplex: string;
 export const motionDurationTooltipEnter: string;
 export const motionEasingTooltipEnter: string;
+export const motionDurationExpandableContentEnter: string;
+export const motionEasingExpandableContentEnter: string;
+export const motionDurationSideNavigationContentEnterFade: string;
+export const motionDurationSideNavigationContentExit: string;
+export const motionDurationSideNavigationContentExitFade: string;
+export const motionEasingSideNavigationContentExit: string;
 export const motionKeyframesFadeIn: string;
 export const motionKeyframesFadeOut: string;
 export const motionKeyframesStatusIconError: string;
@@ -980,6 +1006,8 @@ export const sizeTableSelectionHorizontal: string;
 export const sizeVerticalInput: string;
 export const sizeVerticalPanelIconOffset: string;
 export const sizeSideNavigationItemHeight: string;
+export const sizeSideNavigationItemCollapsed: string;
+export const sizeSideNavigationCollapsedWidth: string;
 export const spaceAlertActionLeft: string;
 export const spaceAlertHorizontal: string;
 export const spaceAlertMessageRight: string;