npm - @razorpay/blade - Versions diffs - 11.20.0 → 11.21.0 - Mend

@razorpay/blade 11.20.0 → 11.21.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (151) hide show

package/build/lib/web/production/components/Collapsible/CollapsibleLink.js CHANGED Viewed

@@ -1,20 +1,30 @@
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
 import { useCallback } from 'react';
 import { useCollapsible } from './CollapsibleContext.js';
 import { CollapsibleChevronIcon } from './CollapsibleChevronIcon.web.js';
 import '../../utils/metaAttribute/index.js';
 import '../Link/BaseLink/index.js';
 import '../../utils/assignWithoutSideEffects/index.js';
+import '../Box/styledProps/index.js';
 import { jsx } from 'react/jsx-runtime';
 import BaseLink from '../Link/BaseLink/BaseLink.js';
+import { getStyledProps } from '../Box/styledProps/getStyledProps.js';
 import { assignWithoutSideEffects } from '../../utils/assignWithoutSideEffects/assignWithoutSideEffects.js';
 import { MetaConstants } from '../../utils/metaAttribute/metaConstants.js';
+var _excluded = ["children", "size", "color", "isDisabled", "testID", "accessibilityLabel"];
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var _CollapsibleLink = function _CollapsibleLink(_ref) {
   var children = _ref.children,
     size = _ref.size,
+    _ref$color = _ref.color,
+    color = _ref$color === void 0 ? 'primary' : _ref$color,
     isDisabled = _ref.isDisabled,
     testID = _ref.testID,
-    accessibilityLabel = _ref.accessibilityLabel;
+    accessibilityLabel = _ref.accessibilityLabel,
+    styledProps = _objectWithoutProperties(_ref, _excluded);
   var _useCollapsible = useCollapsible(),
     onExpandChange = _useCollapsible.onExpandChange,
     isExpanded = _useCollapsible.isExpanded,
@@ -22,9 +32,10 @@ var _CollapsibleLink = function _CollapsibleLink(_ref) {
   var toggleIsExpanded = useCallback(function () {
     return onExpandChange(!isExpanded);
   }, [onExpandChange, isExpanded]);
-  return /*#__PURE__*/jsx(BaseLink, {
+  return /*#__PURE__*/jsx(BaseLink, _objectSpread(_objectSpread({
     variant: "button",
     size: size,
+    color: color,
     icon: CollapsibleChevronIcon,
     iconPosition: "right",
     isDisabled: isDisabled,
@@ -34,9 +45,10 @@ var _CollapsibleLink = function _CollapsibleLink(_ref) {
       label: accessibilityLabel,
       controls: collapsibleBodyId,
       expanded: isExpanded
-    },
+    }
+  }, getStyledProps(styledProps)), {}, {
     children: children
-  });
+  }));
 };
 var CollapsibleLink = /*#__PURE__*/assignWithoutSideEffects(_CollapsibleLink, {
   componentId: MetaConstants.CollapsibleLink

package/build/lib/web/production/components/Collapsible/CollapsibleLink.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CollapsibleLink.js","sources":["../../../../../../src/components/Collapsible/CollapsibleLink.tsx"],"sourcesContent":["import type { ReactElement } from 'react';\nimport { useCallback } from 'react';\nimport { useCollapsible } from './CollapsibleContext';\nimport { CollapsibleChevronIcon } from './CollapsibleChevronIcon';\nimport type { LinkProps } from '~components/Link';\nimport { MetaConstants } from '~utils/metaAttribute';\nimport { BaseLink } from '~components/Link/BaseLink';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\n\ntype CollapsibleLinkProps = Pick<\n LinkProps,\n 'size' \| 'isDisabled' \| 'testID' \| 'accessibilityLabel' \| 'children'\n~~>;\~~n\nconst _CollapsibleLink = ({\n children,\n size,\n isDisabled,\n testID,\n accessibilityLabel,\n}: CollapsibleLinkProps): ReactElement => {\n const { onExpandChange, isExpanded, collapsibleBodyId } = useCollapsible();\n\n const toggleIsExpanded = useCallback(() => onExpandChange(!isExpanded), [\n onExpandChange,\n isExpanded,\n ]);\n\n return (\n <BaseLink\n variant=\"button\"\n size={size}\n icon={CollapsibleChevronIcon}\n iconPosition=\"right\"\n isDisabled={isDisabled}\n testID={testID}\n onClick={toggleIsExpanded}\n accessibilityProps={{\n label: accessibilityLabel,\n controls: collapsibleBodyId,\n expanded: isExpanded,\n }}\n >\n {children}\n </BaseLink>\n );\n};\n\nconst CollapsibleLink = assignWithoutSideEffects(_CollapsibleLink, {\n componentId: MetaConstants.CollapsibleLink,\n});\n\nexport type { CollapsibleLinkProps };\nexport { CollapsibleLink };\n"],"names":["_CollapsibleLink","_ref","children","size","isDisabled","testID","accessibilityLabel","_useCollapsible","useCollapsible","onExpandChange","isExpanded","collapsibleBodyId","toggleIsExpanded","useCallback","_jsx","BaseLink","variant","icon","CollapsibleChevronIcon","iconPosition","onClick","accessibilityProps","label","controls","expanded","CollapsibleLink","assignWithoutSideEffects","componentId","MetaConstants"],"mappings":"~~;;;;;;;;;;;AAcA~~,IAAMA,gBAAgB,GAAG,SAAnBA,gBAAgBA,CAAAC,IAAA,~~EAMoB~~;AAAA,EAAA,~~IALxCC~~,QAAQ,GAAAD,IAAA,CAARC,QAAQ;IACRC,IAAI,GAAAF,IAAA,CAAJE,IAAI;~~IACJC~~,~~UAAU~~,GAAAH,IAAA,~~CAAVG~~,UAAU;IACVC,MAAM,~~GAAAJ~~,IAAA,~~CAANI~~,MAAM;IACNC,kBAAkB,~~GAAAL~~,IAAA,~~CAAlBK~~,kBAAkB,CAAA;~~AAElB~~,EAAA,IAAAC,eAAA,GAA0DC,cAAc,EAAE;IAAlEC,cAAc,GAAAF,eAAA,CAAdE,cAAc;IAAEC,UAAU,GAAAH,eAAA,CAAVG,UAAU;IAAEC,iBAAiB,GAAAJ,eAAA,CAAjBI,iBAAiB,CAAA;EAErD,IAAMC,gBAAgB,GAAGC,WAAW,CAAC,YAAA;AAAA,IAAA,OAAMJ,cAAc,CAAC,CAACC,UAAU,CAAC,CAAA;AAAA,GAAA,EAAE,CACtED,cAAc,EACdC,UAAU,CACX,CAAC,CAAA;~~EAEF~~,oBACEI,GAAA,CAACC,QAAQ,~~EAAA~~;AACPC,IAAAA,OAAO,EAAC,QAAQ;~~AAChBb~~,IAAAA,IAAI,EAAEA,IAAK;~~AACXc~~,IAAAA,IAAI,EAAEC,sBAAuB;AAC7BC,IAAAA,YAAY,EAAC,OAAO;~~AACpBf~~,IAAAA,UAAU,EAAEA,UAAW;AACvBC,IAAAA,MAAM,EAAEA,MAAO;~~AACfe~~,IAAAA,OAAO,~~EAAER~~,gBAAiB;~~AAC1BS~~,IAAAA,kBAAkB,EAAE;AAClBC,MAAAA,KAAK,~~EAAEhB~~,kBAAkB;~~AACzBiB~~,MAAAA,QAAQ,~~EAAEZ~~,iBAAiB;~~AAC3Ba~~,MAAAA,QAAQ,~~EAAEd~~,UAAAA;~~KACV~~;~~AAAAR~~,IAAAA,QAAA,~~EAEDA~~,QAAAA;AAAQ,~~GACD~~,CAAC,CAAA;AAEf,CAAC,CAAA;AAED,~~IAAMuB~~,eAAe,gBAAGC,wBAAwB,~~CAAC1B~~,gBAAgB,EAAE;~~EACjE2B~~,WAAW,EAAEC,aAAa,CAACH,eAAAA;AAC7B,CAAC;;;;"}
1	+ {"version":3,"file":"CollapsibleLink.js","sources":["../../../../../../src/components/Collapsible/CollapsibleLink.tsx"],"sourcesContent":["import type { ReactElement } from 'react';\nimport { useCallback } from 'react';\nimport { useCollapsible } from './CollapsibleContext';\nimport { CollapsibleChevronIcon } from './CollapsibleChevronIcon';\nimport type { LinkProps } from '~components/Link';\nimport { MetaConstants } from '~utils/metaAttribute';\nimport { BaseLink } from '~components/Link/BaseLink';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport { getStyledProps } from '~components/Box/styledProps';\n\ntype CollapsibleLinkProps = Pick<\n LinkProps,\n 'color' \| 'size' \| 'isDisabled' \| 'testID' \| 'accessibilityLabel' \| 'children'\n> &\n StyledPropsBlade;\n\nconst _CollapsibleLink = ({\n children,\n size,\n color = 'primary',\n isDisabled,\n testID,\n accessibilityLabel,\n ...styledProps\n}: CollapsibleLinkProps): ReactElement => {\n const { onExpandChange, isExpanded, collapsibleBodyId } = useCollapsible();\n\n const toggleIsExpanded = useCallback(() => onExpandChange(!isExpanded), [\n onExpandChange,\n isExpanded,\n ]);\n\n return (\n <BaseLink\n variant=\"button\"\n size={size}\n color={color}\n icon={CollapsibleChevronIcon}\n iconPosition=\"right\"\n isDisabled={isDisabled}\n testID={testID}\n onClick={toggleIsExpanded}\n accessibilityProps={{\n label: accessibilityLabel,\n controls: collapsibleBodyId,\n expanded: isExpanded,\n }}\n {...getStyledProps(styledProps)}\n >\n {children}\n </BaseLink>\n );\n};\n\nconst CollapsibleLink = assignWithoutSideEffects(_CollapsibleLink, {\n componentId: MetaConstants.CollapsibleLink,\n});\n\nexport type { CollapsibleLinkProps };\nexport { CollapsibleLink };\n"],"names":["_CollapsibleLink","_ref","children","size","_ref$color","color","isDisabled","testID","accessibilityLabel","styledProps","_objectWithoutProperties","_excluded","_useCollapsible","useCollapsible","onExpandChange","isExpanded","collapsibleBodyId","toggleIsExpanded","useCallback","_jsx","BaseLink","_objectSpread","variant","icon","CollapsibleChevronIcon","iconPosition","onClick","accessibilityProps","label","controls","expanded","getStyledProps","CollapsibleLink","assignWithoutSideEffects","componentId","MetaConstants"],"mappings":";;;;;;;;;;;;;;;;;;AAiBA,IAAMA,gBAAgB,GAAG,SAAnBA,gBAAgBA,CAAAC,IAAA,EAQoB;AAAA,EAAA,IAPxCC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;IACRC,IAAI,GAAAF,IAAA,CAAJE,IAAI;IAAAC,UAAA,GAAAH,IAAA,CACJI,KAAK;AAALA,IAAAA,KAAK,GAAAD,UAAA,KAAG,KAAA,CAAA,GAAA,SAAS,GAAAA,UAAA;IACjBE,UAAU,GAAAL,IAAA,CAAVK,UAAU;IACVC,MAAM,GAAAN,IAAA,CAANM,MAAM;IACNC,kBAAkB,GAAAP,IAAA,CAAlBO,kBAAkB;AACfC,IAAAA,WAAW,GAAAC,wBAAA,CAAAT,IAAA,EAAAU,SAAA,CAAA,CAAA;AAEd,EAAA,IAAAC,eAAA,GAA0DC,cAAc,EAAE;IAAlEC,cAAc,GAAAF,eAAA,CAAdE,cAAc;IAAEC,UAAU,GAAAH,eAAA,CAAVG,UAAU;IAAEC,iBAAiB,GAAAJ,eAAA,CAAjBI,iBAAiB,CAAA;EAErD,IAAMC,gBAAgB,GAAGC,WAAW,CAAC,YAAA;AAAA,IAAA,OAAMJ,cAAc,CAAC,CAACC,UAAU,CAAC,CAAA;AAAA,GAAA,EAAE,CACtED,cAAc,EACdC,UAAU,CACX,CAAC,CAAA;AAEF,EAAA,oBACEI,GAAA,CAACC,QAAQ,EAAAC,aAAA,CAAAA,aAAA,CAAA;AACPC,IAAAA,OAAO,EAAC,QAAQ;AAChBnB,IAAAA,IAAI,EAAEA,IAAK;AACXE,IAAAA,KAAK,EAAEA,KAAM;AACbkB,IAAAA,IAAI,EAAEC,sBAAuB;AAC7BC,IAAAA,YAAY,EAAC,OAAO;AACpBnB,IAAAA,UAAU,EAAEA,UAAW;AACvBC,IAAAA,MAAM,EAAEA,MAAO;AACfmB,IAAAA,OAAO,EAAET,gBAAiB;AAC1BU,IAAAA,kBAAkB,EAAE;AAClBC,MAAAA,KAAK,EAAEpB,kBAAkB;AACzBqB,MAAAA,QAAQ,EAAEb,iBAAiB;AAC3Bc,MAAAA,QAAQ,EAAEf,UAAAA;AACZ,KAAA;GACIgB,EAAAA,cAAc,CAACtB,WAAW,CAAC,CAAA,EAAA,EAAA,EAAA;AAAAP,IAAAA,QAAA,EAE9BA,QAAAA;AAAQ,GAAA,CACD,CAAC,CAAA;AAEf,CAAC,CAAA;AAED,IAAM8B,eAAe,gBAAGC,wBAAwB,CAACjC,gBAAgB,EAAE;EACjEkC,WAAW,EAAEC,aAAa,CAACH,eAAAA;AAC7B,CAAC;;;;"}

package/build/lib/web/production/components/Collapsible/commonStyles.js CHANGED Viewed

@@ -2,7 +2,11 @@ import '../../utils/index.js';
 import { makeMotionTime } from '../../utils/makeMotionTime/makeMotionTime.web.js';
 var getCollapsibleBodyContentBoxProps = function getCollapsibleBodyContentBoxProps(_ref) {
-  var direction = _ref.direction;
+  var direction = _ref.direction,
+    _hasMargin = _ref._hasMargin;
+  if (!_hasMargin) {
+    return {};
+  }
   return {
     /**
      * Need a margin inside the outside wrapper so this is

package/build/lib/web/production/components/Collapsible/commonStyles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"commonStyles.js","sources":["../../../../../../src/components/Collapsible/commonStyles.ts"],"sourcesContent":["import type { CollapsibleProps } from './Collapsible';\nimport type { Theme } from '~components/BladeProvider';\nimport type { BoxProps } from '~components/Box';\nimport { makeMotionTime } from '~utils';\n\nconst getCollapsibleBodyContentBoxProps = ({\n direction,\n}: {\n direction: CollapsibleProps['direction'];\n}): BoxProps => ({\n /*\n Need a margin inside the outside wrapper so this is\n * included in height calculations and prevents jank\n */\n marginTop: direction === 'bottom' ? 'spacing.5' : 'spacing.0',\n marginBottom: direction === 'top' ? 'spacing.5' : 'spacing.0',\n});\n\nconst getOpacity = ({ isExpanded }: { isExpanded: boolean }): number => (isExpanded ? 1 : 0.8);\n\n// eslint-disable-next-line @typescript-eslint/explicit-function-return-type\nconst getTransitionDuration = (theme: Theme) => makeMotionTime(theme.motion.duration.xmoderate);\n\n// eslint-disable-next-line @typescript-eslint/explicit-function-return-type\nconst getTransitionEasing = (theme: Theme) => theme.motion.easing.standard.effective;\n\nconst getCollapsibleChevronIconTransforms = (): {\n transformExpanded: number;\n transformCollapsed: number;\n} => ({ transformExpanded: -180, transformCollapsed: 0 });\n\nexport {\n getCollapsibleBodyContentBoxProps,\n getOpacity,\n getTransitionDuration,\n getTransitionEasing,\n getCollapsibleChevronIconTransforms,\n};\n"],"names":["getCollapsibleBodyContentBoxProps","_ref","direction","marginTop","marginBottom","getOpacity","_ref2","isExpanded","getTransitionDuration","theme","makeMotionTime","motion","duration","xmoderate","getTransitionEasing","easing","standard","effective","getCollapsibleChevronIconTransforms","transformExpanded","transformCollapsed"],"mappings":";;;~~AAKA~~,IAAMA,iCAAiC,GAAG,SAApCA,iCAAiCA,CAAAC,IAAA,~~EAAA~~;AAAA,EAAA,~~IACrCC~~,SAAS,GAAAD,IAAA,CAATC,SAAS,CAAA;~~EAAA~~,~~OAGM~~;AACf;~~AACF~~;AACA;AACA;~~AACEC~~,IAAAA,SAAS,~~EAAED~~,SAAS,KAAK,QAAQ,GAAG,WAAW,GAAG,WAAW;~~AAC7DE~~,IAAAA,YAAY,~~EAAEF~~,SAAS,KAAK,KAAK,GAAG,WAAW,GAAG,WAAA;GACnD,CAAA;~~AAAA~~,EAAC;~~AAEF~~,~~IAAMG~~,UAAU,GAAG,SAAbA,UAAUA,CAAAC,KAAA,EAAA;AAAA,EAAA,IAAMC,UAAU,GAAAD,KAAA,CAAVC,UAAU,CAAA;AAAA,EAAA,OAAyCA,UAAU,GAAG,CAAC,GAAG,GAAG,CAAA;AAAA,EAAC;;AAE9F;AACA,IAAMC,qBAAqB,GAAG,SAAxBA,qBAAqBA,CAAIC,KAAY,EAAA;EAAA,OAAKC,cAAc,CAACD,KAAK,CAACE,MAAM,CAACC,QAAQ,CAACC,SAAS,CAAC,CAAA;AAAA,EAAA;;AAE/F;AACA,IAAMC,mBAAmB,GAAG,SAAtBA,mBAAmBA,CAAIL,KAAY,EAAA;EAAA,OAAKA,KAAK,CAACE,MAAM,CAACI,MAAM,CAACC,QAAQ,CAACC,SAAS,CAAA;AAAA,EAAA;AAEpF,IAAMC,mCAAmC,GAAG,SAAtCA,mCAAmCA,GAAA;EAAA,OAGnC;IAAEC,iBAAiB,EAAE,CAAC,GAAG;AAAEC,IAAAA,kBAAkB,EAAE,CAAA;GAAG,CAAA;AAAA;;;;"}
1	+ {"version":3,"file":"commonStyles.js","sources":["../../../../../../src/components/Collapsible/commonStyles.ts"],"sourcesContent":["import type { CollapsibleProps } from './Collapsible';\nimport type { CollapsibleBodyProps } from './types';\nimport type { Theme } from '~components/BladeProvider';\nimport type { BoxProps } from '~components/Box';\nimport { makeMotionTime } from '~utils';\n\nconst getCollapsibleBodyContentBoxProps = ({\n direction,\n _hasMargin,\n}: {\n direction: CollapsibleProps['direction'];\n _hasMargin: CollapsibleBodyProps['_hasMargin'];\n}): BoxProps => {\n if (!_hasMargin) {\n return {};\n }\n\n return {\n /*\n Need a margin inside the outside wrapper so this is\n * included in height calculations and prevents jank\n */\n marginTop: direction === 'bottom' ? 'spacing.5' : 'spacing.0',\n marginBottom: direction === 'top' ? 'spacing.5' : 'spacing.0',\n };\n};\n\nconst getOpacity = ({ isExpanded }: { isExpanded: boolean }): number => (isExpanded ? 1 : 0.8);\n\n// eslint-disable-next-line @typescript-eslint/explicit-function-return-type\nconst getTransitionDuration = (theme: Theme) => makeMotionTime(theme.motion.duration.xmoderate);\n\n// eslint-disable-next-line @typescript-eslint/explicit-function-return-type\nconst getTransitionEasing = (theme: Theme) => theme.motion.easing.standard.effective;\n\nconst getCollapsibleChevronIconTransforms = (): {\n transformExpanded: number;\n transformCollapsed: number;\n} => ({ transformExpanded: -180, transformCollapsed: 0 });\n\nexport {\n getCollapsibleBodyContentBoxProps,\n getOpacity,\n getTransitionDuration,\n getTransitionEasing,\n getCollapsibleChevronIconTransforms,\n};\n"],"names":["getCollapsibleBodyContentBoxProps","_ref","direction","_hasMargin","marginTop","marginBottom","getOpacity","_ref2","isExpanded","getTransitionDuration","theme","makeMotionTime","motion","duration","xmoderate","getTransitionEasing","easing","standard","effective","getCollapsibleChevronIconTransforms","transformExpanded","transformCollapsed"],"mappings":";;;AAMA,IAAMA,iCAAiC,GAAG,SAApCA,iCAAiCA,CAAAC,IAAA,EAMvB;AAAA,EAAA,IALdC,SAAS,GAAAD,IAAA,CAATC,SAAS;IACTC,UAAU,GAAAF,IAAA,CAAVE,UAAU,CAAA;EAKV,IAAI,CAACA,UAAU,EAAE;AACf,IAAA,OAAO,EAAE,CAAA;AACX,GAAA;EAEA,OAAO;AACL;AACJ;AACA;AACA;AACIC,IAAAA,SAAS,EAAEF,SAAS,KAAK,QAAQ,GAAG,WAAW,GAAG,WAAW;AAC7DG,IAAAA,YAAY,EAAEH,SAAS,KAAK,KAAK,GAAG,WAAW,GAAG,WAAA;GACnD,CAAA;AACH,EAAC;AAED,IAAMI,UAAU,GAAG,SAAbA,UAAUA,CAAAC,KAAA,EAAA;AAAA,EAAA,IAAMC,UAAU,GAAAD,KAAA,CAAVC,UAAU,CAAA;AAAA,EAAA,OAAyCA,UAAU,GAAG,CAAC,GAAG,GAAG,CAAA;AAAA,EAAC;;AAE9F;AACA,IAAMC,qBAAqB,GAAG,SAAxBA,qBAAqBA,CAAIC,KAAY,EAAA;EAAA,OAAKC,cAAc,CAACD,KAAK,CAACE,MAAM,CAACC,QAAQ,CAACC,SAAS,CAAC,CAAA;AAAA,EAAA;;AAE/F;AACA,IAAMC,mBAAmB,GAAG,SAAtBA,mBAAmBA,CAAIL,KAAY,EAAA;EAAA,OAAKA,KAAK,CAACE,MAAM,CAACI,MAAM,CAACC,QAAQ,CAACC,SAAS,CAAA;AAAA,EAAA;AAEpF,IAAMC,mCAAmC,GAAG,SAAtCA,mCAAmCA,GAAA;EAAA,OAGnC;IAAEC,iBAAiB,EAAE,CAAC,GAAG;AAAEC,IAAAA,kBAAkB,EAAE,CAAA;GAAG,CAAA;AAAA;;;;"}

package/build/lib/web/production/components/Drawer/Drawer.web.js CHANGED Viewed

@@ -69,6 +69,8 @@ var _Drawer = function _Drawer(_ref4) {
     _ref4$showOverlay = _ref4.showOverlay,
     showOverlay = _ref4$showOverlay === void 0 ? true : _ref4$showOverlay,
     initialFocusRef = _ref4.initialFocusRef,
+    _ref4$isLazy = _ref4.isLazy,
+    isLazy = _ref4$isLazy === void 0 ? true : _ref4$isLazy,
     testID = _ref4.testID;
   var closeButtonRef = React__default.useRef(null);
   var _React$useState = React__default.useState(zIndex),
@@ -93,13 +95,14 @@ var _Drawer = function _Drawer(_ref4) {
       initialEnter: true
     }),
     isMounted = _usePresence.isMounted,
-    isVisible = _usePresence.isVisible;
+    isVisible = _usePresence.isVisible,
+    isExiting = _usePresence.isExiting;
   var _React$useMemo = React__default.useMemo(function () {
       // eslint-disable-next-line @typescript-eslint/restrict-plus-operands
-      var level = drawerStack.indexOf(drawerId) + 1;
+      var level = Object.keys(drawerStack).indexOf(drawerId) + 1;
       return {
         stackingLevel: level,
-        isFirstDrawerInStack: level === 1 && drawerStack.length > 1
+        isFirstDrawerInStack: level === 1 && Object.keys(drawerStack).length > 1
       };
     }, [drawerId, drawerStack]),
     stackingLevel = _React$useMemo.stackingLevel,
@@ -111,9 +114,14 @@ var _Drawer = function _Drawer(_ref4) {
     context = _useFloating.context;
   React__default.useEffect(function () {
     if (isOpen) {
-      addToDrawerStack(drawerId);
+      addToDrawerStack({
+        elementId: drawerId,
+        onDismiss: onDismiss
+      });
     } else {
-      removeFromDrawerStack(drawerId);
+      removeFromDrawerStack({
+        elementId: drawerId
+      });
     }
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [isOpen]);
@@ -125,16 +133,23 @@ var _Drawer = function _Drawer(_ref4) {
     setZIndexState(zIndex + stackingLevel);
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [isMounted]);
-  return /*#__PURE__*/jsx(DrawerContext.Provider, {
-    value: {
+  var contextValue = React__default.useMemo(function () {
+    return {
       close: onDismiss,
-      closeButtonRef: closeButtonRef
-    },
+      closeButtonRef: closeButtonRef,
+      stackingLevel: stackingLevel,
+      isExiting: isExiting
+    };
+  }, [isExiting, onDismiss, stackingLevel]);
+  return /*#__PURE__*/jsx(DrawerContext.Provider, {
+    value: contextValue,
     children: /*#__PURE__*/jsx(FloatingPortal, {
-      children: isMounted ? /*#__PURE__*/jsx(FloatingFocusManager, {
+      children: isMounted || !isLazy ? /*#__PURE__*/jsx(FloatingFocusManager, {
         context: context,
         initialFocus: initialFocusRef !== null && initialFocusRef !== void 0 ? initialFocusRef : closeButtonRef,
+        returnFocus: true,
         children: /*#__PURE__*/jsxs(BaseBox, _objectSpread(_objectSpread({
+          display: isLazy ? undefined : isMounted ? 'block' : 'none',
           position: "fixed"
         }, metaAttribute({
           name: MetaConstants.Drawer,

package/build/lib/web/production/components/Drawer/Drawer.web.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Drawer.web.js","sources":["../../../../../../src/components/Drawer/Drawer.web.tsx"],"sourcesContent":["import {\n FloatingFocusManager,\n FloatingOverlay,\n FloatingPortal,\n useFloating,\n} from '@floating-ui/react';\nimport type { CSSProperties } from 'react';\nimport React from 'react';\nimport styled from 'styled-components';\nimport usePresence from 'use-presence';\nimport { drawerComponentIds } from './drawerComponentIds';\nimport { DrawerContext } from './DrawerContext';\nimport type { DrawerProps } from './types';\nimport BaseBox from '~components/Box/BaseBox';\nimport { castWebType, makeMotionTime, useTheme } from '~utils';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport { componentZIndices } from '~utils/componentZIndices';\nimport { useDrawerStack } from '~components/Drawer/StackProvider';\nimport { makeAccessible } from '~utils/makeAccessible';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport { useId } from '~utils/useId';\nimport { useVerifyAllowedChildren } from '~utils/useVerifyAllowedChildren';\n\nconst SHOW_DRAWER = 'show-drawer';\n\nconst AnimatedDrawerContainer = styled(BaseBox)<{\n isFirstDrawerInStack: boolean;\n isVisible: boolean;\n}>(({ theme, isFirstDrawerInStack, isVisible }) => {\n const entranceTransition: CSSProperties['transition'] = `all ${castWebType(\n castWebType(makeMotionTime(theme.motion.duration.gentle)),\n )} ${castWebType(theme.motion.easing.entrance.revealing)}`;\n\n const exitTransition: CSSProperties['transition'] = `all\n ${castWebType(makeMotionTime(theme.motion.duration.xmoderate))}\n ${castWebType(theme.motion.easing.exit.revealing)}`;\n\n return {\n opacity: isVisible ? 1 : 0,\n transform: isVisible\n ? isFirstDrawerInStack\n ? 'translateX(calc(-100% - 16px))'\n : 'translateX(-100%)'\n : 'translateX(0%)',\n transition: isVisible ? entranceTransition : exitTransition,\n animationFillMode: 'initial',\n };\n});\n\nconst DrawerOverlay = styled(FloatingOverlay)(({ theme }) => {\n return {\n opacity: 0,\n transition: `opacity\n ${makeMotionTime(theme.motion.duration.xmoderate)}\n ${castWebType(theme.motion.easing.exit.revealing)}`,\n backgroundColor: theme.colors.overlay.background.subtle,\n\n [`&.${SHOW_DRAWER}`]: {\n opacity: 1,\n transition: `opacity ${makeMotionTime(theme.motion.duration.gentle)} ${castWebType(\n theme.motion.easing.entrance.revealing,\n )}`,\n },\n };\n});\n\nconst _Drawer = ({\n isOpen,\n onDismiss,\n zIndex = componentZIndices.drawer,\n children,\n accessibilityLabel,\n showOverlay = true,\n initialFocusRef,\n testID,\n}: DrawerProps): React.ReactElement => {\n const closeButtonRef = React.useRef<HTMLDivElement>(null);\n const [zIndexState, setZIndexState] = React.useState<number>(zIndex);\n\n useVerifyAllowedChildren({\n children,\n componentName: 'Drawer',\n allowedComponents: [drawerComponentIds.DrawerHeader, drawerComponentIds.DrawerBody],\n });\n\n const { theme } = useTheme();\n const drawerId = useId('drawer');\n const { drawerStack, addToDrawerStack, removeFromDrawerStack } = useDrawerStack();\n\n const { isMounted, isVisible } = usePresence(isOpen, {\n enterTransitionDuration: theme.motion.duration.gentle,\n exitTransitionDuration: theme.motion.duration.xmoderate,\n initialEnter: true,\n });\n\n const { stackingLevel, isFirstDrawerInStack } = React.useMemo(() => {\n // eslint-disable-next-line @typescript-eslint/restrict-plus-operands\n const level = drawerStack.indexOf(drawerId) + 1;\n return {\n stackingLevel: level,\n isFirstDrawerInStack: level === 1 && drawerStack.length > 1,\n };\n }, [drawerId, drawerStack]);\n\n const { refs, context } = useFloating({\n open: isMounted,\n });\n\n React.useEffect(() => {\n if (isOpen) {\n addToDrawerStack(drawerId);\n } else {\n removeFromDrawerStack(drawerId);\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [isOpen]);\n\n // When z-index is not defined by user, we use default drawer z index and add stackingLevel to ensure\n // new drawer that opens, always opens on top of previous one.\n React.useEffect(() => {\n // eslint-disable-next-line @typescript-eslint/restrict-plus-operands\n setZIndexState(zIndex + stackingLevel);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [isMounted]);\n\n return (\n <DrawerContext.Provider value={{ close: onDismiss, closeButtonRef }}>\n <FloatingPortal>\n {isMounted ? (\n <FloatingFocusManager context={context} initialFocus={initialFocusRef ?? closeButtonRef}>\n <BaseBox\n position=\"fixed\"\n {...metaAttribute({\n name: MetaConstants.Drawer,\n testID,\n })}\n zIndex={zIndexState}\n >\n {showOverlay \|\| stackingLevel === 2 ? (\n <DrawerOverlay\n onClick={() => {\n onDismiss();\n }}\n className={isVisible ? SHOW_DRAWER : ''}\n lockScroll={true}\n {...metaAttribute({\n testID: 'drawer-overlay',\n })}\n />\n ) : null}\n <AnimatedDrawerContainer\n isVisible={isVisible}\n isFirstDrawerInStack={isFirstDrawerInStack}\n width={{ base: '90%', s: '375px', m: '420px' }}\n {...makeAccessible({\n role: 'dialog',\n modal: true,\n label: accessibilityLabel,\n })}\n position=\"fixed\"\n top=\"spacing.0\"\n left=\"100%\"\n backgroundColor=\"popup.background.subtle\"\n elevation=\"highRaised\"\n height=\"100%\"\n display=\"flex\"\n flexDirection=\"column\"\n ref={refs.setFloating}\n onKeyDown={(event) => {\n if (event?.key === 'Escape' \|\| event?.code === 'Escape') {\n onDismiss();\n }\n }}\n >\n {children}\n </AnimatedDrawerContainer>\n </BaseBox>\n </FloatingFocusManager>\n ) : null}\n </FloatingPortal>\n </DrawerContext.Provider>\n );\n};\n\n/*\n ### Drawer Component\n * \n * A drawer is a panel that slides in mostly from right side of the screen over the existing content in the viewport. \n * It helps in providing additional details or context and can also be used to promote product features or new products.\n * \n * ---\n * \n * #### Usage\n * \n * ```jsx\n const MyDrawer = () => {\n const [showDrawer, setShowDrawer] = React.useState(false);\n return (\n <Box>\n <Button onClick={() => setShowDrawer(true)}>Open Drawer</Button>\n <Drawer\n isOpen={showDrawer}\n onDismiss={() => setShowDrawer(false)}\n >\n <DrawerHeader title=\"Announcements\" />\n <DrawerBody>\n <FTXAnnouncement />\n <CatPictures />\n </DrawerBody>\n <Drawer>\n </Box>\n )\n }\n * ```\n \n ---\n \n Checkout {@link https://blade.razorpay.com/?path=/docs/components-drawer Drawer Documentation}\n * \n * \n */\nconst Drawer = assignWithoutSideEffects(_Drawer, {\n componentId: drawerComponentIds.Drawer,\n});\n\nexport { Drawer };\n"],"names":["SHOW_DRAWER","AnimatedDrawerContainer","styled","BaseBox","withConfig","displayName","componentId","_ref","theme","isFirstDrawerInStack","isVisible","entranceTransition","concat","castWebType","makeMotionTime","motion","duration","gentle","easing","entrance","revealing","exitTransition","xmoderate","exit","opacity","transform","transition","animationFillMode","DrawerOverlay","FloatingOverlay","_ref2","_defineProperty","backgroundColor","colors","overlay","background","subtle","_Drawer","_ref4","isOpen","onDismiss","_ref4$zIndex","zIndex","componentZIndices","drawer","children","accessibilityLabel","_ref4$showOverlay","showOverlay","initialFocusRef","testID","closeButtonRef","React","useRef","_React$useState","useState","_React$useState2","_slicedToArray","zIndexState","setZIndexState","useVerifyAllowedChildren","componentName","allowedComponents","drawerComponentIds","DrawerHeader","DrawerBody","_useTheme","useTheme","drawerId","useId","_useDrawerStack","useDrawerStack","drawerStack","addToDrawerStack","removeFromDrawerStack","_usePresence","usePresence","enterTransitionDuration","exitTransitionDuration","initialEnter","isMounted","_React$useMemo","useMemo","level","indexOf","stackingLevel","length","_useFloating","useFloating","open","refs","context","useEffect","_jsx","DrawerContext","Provider","value","close","FloatingPortal","FloatingFocusManager","initialFocus","_jsxs","_objectSpread","position","metaAttribute","name","MetaConstants","Drawer","onClick","className","lockScroll","width","base","s","m","makeAccessible","role","modal","label","top","left","elevation","height","display","flexDirection","ref","setFloating","onKeyDown","event","key","code","assignWithoutSideEffects"],"mappings":"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"}
1	+ {"version":3,"file":"Drawer.web.js","sources":["../../../../../../src/components/Drawer/Drawer.web.tsx"],"sourcesContent":["import {\n FloatingFocusManager,\n FloatingOverlay,\n FloatingPortal,\n useFloating,\n} from '@floating-ui/react';\nimport type { CSSProperties } from 'react';\nimport React from 'react';\nimport styled from 'styled-components';\nimport usePresence from 'use-presence';\nimport { drawerComponentIds } from './drawerComponentIds';\nimport { DrawerContext } from './DrawerContext';\nimport type { DrawerProps } from './types';\nimport BaseBox from '~components/Box/BaseBox';\nimport { castWebType, makeMotionTime, useTheme } from '~utils';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport { componentZIndices } from '~utils/componentZIndices';\nimport { useDrawerStack } from '~components/Drawer/StackProvider';\nimport { makeAccessible } from '~utils/makeAccessible';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport { useId } from '~utils/useId';\nimport { useVerifyAllowedChildren } from '~utils/useVerifyAllowedChildren';\n\nconst SHOW_DRAWER = 'show-drawer';\n\nconst AnimatedDrawerContainer = styled(BaseBox)<{\n isFirstDrawerInStack: boolean;\n isVisible: boolean;\n}>(({ theme, isFirstDrawerInStack, isVisible }) => {\n const entranceTransition: CSSProperties['transition'] = `all ${castWebType(\n castWebType(makeMotionTime(theme.motion.duration.gentle)),\n )} ${castWebType(theme.motion.easing.entrance.revealing)}`;\n\n const exitTransition: CSSProperties['transition'] = `all\n ${castWebType(makeMotionTime(theme.motion.duration.xmoderate))}\n ${castWebType(theme.motion.easing.exit.revealing)}`;\n\n return {\n opacity: isVisible ? 1 : 0,\n transform: isVisible\n ? isFirstDrawerInStack\n ? 'translateX(calc(-100% - 16px))'\n : 'translateX(-100%)'\n : 'translateX(0%)',\n transition: isVisible ? entranceTransition : exitTransition,\n animationFillMode: 'initial',\n };\n});\n\nconst DrawerOverlay = styled(FloatingOverlay)(({ theme }) => {\n return {\n opacity: 0,\n transition: `opacity\n ${makeMotionTime(theme.motion.duration.xmoderate)}\n ${castWebType(theme.motion.easing.exit.revealing)}`,\n backgroundColor: theme.colors.overlay.background.subtle,\n\n [`&.${SHOW_DRAWER}`]: {\n opacity: 1,\n transition: `opacity ${makeMotionTime(theme.motion.duration.gentle)} ${castWebType(\n theme.motion.easing.entrance.revealing,\n )}`,\n },\n };\n});\n\nconst _Drawer = ({\n isOpen,\n onDismiss,\n zIndex = componentZIndices.drawer,\n children,\n accessibilityLabel,\n showOverlay = true,\n initialFocusRef,\n isLazy = true,\n testID,\n}: DrawerProps): React.ReactElement => {\n const closeButtonRef = React.useRef<HTMLDivElement>(null);\n const [zIndexState, setZIndexState] = React.useState<number>(zIndex);\n\n useVerifyAllowedChildren({\n children,\n componentName: 'Drawer',\n allowedComponents: [drawerComponentIds.DrawerHeader, drawerComponentIds.DrawerBody],\n });\n\n const { theme } = useTheme();\n const drawerId = useId('drawer');\n const { drawerStack, addToDrawerStack, removeFromDrawerStack } = useDrawerStack();\n\n const { isMounted, isVisible, isExiting } = usePresence(isOpen, {\n enterTransitionDuration: theme.motion.duration.gentle,\n exitTransitionDuration: theme.motion.duration.xmoderate,\n initialEnter: true,\n });\n\n const { stackingLevel, isFirstDrawerInStack } = React.useMemo(() => {\n // eslint-disable-next-line @typescript-eslint/restrict-plus-operands\n const level = Object.keys(drawerStack).indexOf(drawerId) + 1;\n return {\n stackingLevel: level,\n isFirstDrawerInStack: level === 1 && Object.keys(drawerStack).length > 1,\n };\n }, [drawerId, drawerStack]);\n\n const { refs, context } = useFloating({\n open: isMounted,\n });\n\n React.useEffect(() => {\n if (isOpen) {\n addToDrawerStack({ elementId: drawerId, onDismiss });\n } else {\n removeFromDrawerStack({ elementId: drawerId });\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [isOpen]);\n\n // When z-index is not defined by user, we use default drawer z index and add stackingLevel to ensure\n // new drawer that opens, always opens on top of previous one.\n React.useEffect(() => {\n // eslint-disable-next-line @typescript-eslint/restrict-plus-operands\n setZIndexState(zIndex + stackingLevel);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [isMounted]);\n\n const contextValue = React.useMemo(\n () => ({\n close: onDismiss,\n closeButtonRef,\n stackingLevel,\n isExiting,\n }),\n [isExiting, onDismiss, stackingLevel],\n );\n\n return (\n <DrawerContext.Provider value={contextValue}>\n <FloatingPortal>\n {isMounted \|\| !isLazy ? (\n <FloatingFocusManager\n context={context}\n initialFocus={initialFocusRef ?? closeButtonRef}\n returnFocus={true}\n >\n <BaseBox\n display={isLazy ? undefined : isMounted ? 'block' : 'none'}\n position=\"fixed\"\n {...metaAttribute({\n name: MetaConstants.Drawer,\n testID,\n })}\n zIndex={zIndexState}\n >\n {showOverlay \|\| stackingLevel === 2 ? (\n <DrawerOverlay\n onClick={() => {\n onDismiss();\n }}\n className={isVisible ? SHOW_DRAWER : ''}\n lockScroll={true}\n {...metaAttribute({\n testID: 'drawer-overlay',\n })}\n />\n ) : null}\n <AnimatedDrawerContainer\n isVisible={isVisible}\n isFirstDrawerInStack={isFirstDrawerInStack}\n width={{ base: '90%', s: '375px', m: '420px' }}\n {...makeAccessible({\n role: 'dialog',\n modal: true,\n label: accessibilityLabel,\n })}\n position=\"fixed\"\n top=\"spacing.0\"\n left=\"100%\"\n backgroundColor=\"popup.background.subtle\"\n elevation=\"highRaised\"\n height=\"100%\"\n display=\"flex\"\n flexDirection=\"column\"\n ref={refs.setFloating}\n onKeyDown={(event) => {\n if (event?.key === 'Escape' \|\| event?.code === 'Escape') {\n onDismiss();\n }\n }}\n >\n {children}\n </AnimatedDrawerContainer>\n </BaseBox>\n </FloatingFocusManager>\n ) : null}\n </FloatingPortal>\n </DrawerContext.Provider>\n );\n};\n\n/*\n ### Drawer Component\n * \n * A drawer is a panel that slides in mostly from right side of the screen over the existing content in the viewport. \n * It helps in providing additional details or context and can also be used to promote product features or new products.\n * \n * ---\n * \n * #### Usage\n * \n * ```jsx\n const MyDrawer = () => {\n const [showDrawer, setShowDrawer] = React.useState(false);\n return (\n <Box>\n <Button onClick={() => setShowDrawer(true)}>Open Drawer</Button>\n <Drawer\n isOpen={showDrawer}\n onDismiss={() => setShowDrawer(false)}\n >\n <DrawerHeader title=\"Announcements\" />\n <DrawerBody>\n <FTXAnnouncement />\n <CatPictures />\n </DrawerBody>\n <Drawer>\n </Box>\n )\n }\n * ```\n \n ---\n \n Checkout {@link https://blade.razorpay.com/?path=/docs/components-drawer Drawer Documentation}\n * \n * \n */\nconst Drawer = assignWithoutSideEffects(_Drawer, {\n componentId: drawerComponentIds.Drawer,\n});\n\nexport { Drawer };\n"],"names":["SHOW_DRAWER","AnimatedDrawerContainer","styled","BaseBox","withConfig","displayName","componentId","_ref","theme","isFirstDrawerInStack","isVisible","entranceTransition","concat","castWebType","makeMotionTime","motion","duration","gentle","easing","entrance","revealing","exitTransition","xmoderate","exit","opacity","transform","transition","animationFillMode","DrawerOverlay","FloatingOverlay","_ref2","_defineProperty","backgroundColor","colors","overlay","background","subtle","_Drawer","_ref4","isOpen","onDismiss","_ref4$zIndex","zIndex","componentZIndices","drawer","children","accessibilityLabel","_ref4$showOverlay","showOverlay","initialFocusRef","_ref4$isLazy","isLazy","testID","closeButtonRef","React","useRef","_React$useState","useState","_React$useState2","_slicedToArray","zIndexState","setZIndexState","useVerifyAllowedChildren","componentName","allowedComponents","drawerComponentIds","DrawerHeader","DrawerBody","_useTheme","useTheme","drawerId","useId","_useDrawerStack","useDrawerStack","drawerStack","addToDrawerStack","removeFromDrawerStack","_usePresence","usePresence","enterTransitionDuration","exitTransitionDuration","initialEnter","isMounted","isExiting","_React$useMemo","useMemo","level","Object","keys","indexOf","stackingLevel","length","_useFloating","useFloating","open","refs","context","useEffect","elementId","contextValue","close","_jsx","DrawerContext","Provider","value","FloatingPortal","FloatingFocusManager","initialFocus","returnFocus","_jsxs","_objectSpread","display","undefined","position","metaAttribute","name","MetaConstants","Drawer","onClick","className","lockScroll","width","base","s","m","makeAccessible","role","modal","label","top","left","elevation","height","flexDirection","ref","setFloating","onKeyDown","event","key","code","assignWithoutSideEffects"],"mappings":"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"}

package/build/lib/web/production/components/Drawer/DrawerContext.js CHANGED Viewed

@@ -2,7 +2,9 @@ import React__default from 'react';
 /* eslint-disable @typescript-eslint/no-explicit-any */
 var DrawerContext = /*#__PURE__*/React__default.createContext({
-  close: function close() {}
+  // eslint-disable-next-line @typescript-eslint/no-empty-function
+  close: function close() {},
+  isExiting: false
 });
 export { DrawerContext };

package/build/lib/web/production/components/Drawer/DrawerContext.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DrawerContext.js","sources":["../../../../../../src/components/Drawer/DrawerContext.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport React from 'react';\n\~~nconst~~ ~~DrawerContext~~ = ~~React.createContext<~~{\n close: () => void;\n closeButtonRef?: React.MutableRefObject<any>;\n // eslint-disable-next-line @typescript-eslint/no-empty-function\n~~}>({~~ close: () => {} });\n\nexport { DrawerContext };\n"],"names":["DrawerContext","React","createContext","close"],"mappings":";;AAAA;~~AAGA~~,IAAMA,aAAa,gBAAGC,cAAK,CAACC,aAAa,~~CAItC~~;~~AAAEC~~,EAAAA,KAAK,EAAE,SAAAA,KAAA,GAAM,~~EAAC~~;~~AAAE~~,CAAC;;;;"}
1	+ {"version":3,"file":"DrawerContext.js","sources":["../../../../../../src/components/Drawer/DrawerContext.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport React from 'react';\n\ntype DrawerContextType = {\n close: () => void;\n closeButtonRef?: React.MutableRefObject<any>;\n stackingLevel?: number;\n isExiting: boolean;\n};\n\nconst DrawerContext = React.createContext<DrawerContextType>({\n // eslint-disable-next-line @typescript-eslint/no-empty-function\n close: () => {},\n isExiting: false,\n});\n\nexport { DrawerContext };\n"],"names":["DrawerContext","React","createContext","close","isExiting"],"mappings":";;AAAA;AAUA,IAAMA,aAAa,gBAAGC,cAAK,CAACC,aAAa,CAAoB;AAC3D;AACAC,EAAAA,KAAK,EAAE,SAAAA,KAAA,GAAM,EAAE;AACfC,EAAAA,SAAS,EAAE,KAAA;AACb,CAAC;;;;"}

package/build/lib/web/production/components/Drawer/DrawerSubcomponents.web.js CHANGED Viewed

@@ -1,6 +1,7 @@
 import React__default from 'react';
 import { drawerComponentIds } from './drawerComponentIds.js';
 import { DrawerContext } from './DrawerContext.js';
+import { useDrawerStack } from './StackProvider.js';
 import { BaseHeader } from '../BaseHeaderFooter/BaseHeader.js';
 import '../Box/index.js';
 import '../../utils/assignWithoutSideEffects/index.js';
@@ -16,11 +17,31 @@ var _DrawerHeader = function _DrawerHeader(_ref) {
     titleSuffix = _ref.titleSuffix;
   var _React$useContext = React__default.useContext(DrawerContext),
     close = _React$useContext.close,
-    closeButtonRef = _React$useContext.closeButtonRef;
-  return /*#__PURE__*/jsx(BaseHeader, {
+    closeButtonRef = _React$useContext.closeButtonRef,
+    stackingLevel = _React$useContext.stackingLevel,
+    isExiting = _React$useContext.isExiting;
+  var _useDrawerStack = useDrawerStack(),
+    drawerStack = _useDrawerStack.drawerStack;
+  var closeAllDrawers = function closeAllDrawers() {
+    for (var _i = 0, _Object$values = Object.values(drawerStack); _i < _Object$values.length; _i++) {
+      var onDismiss = _Object$values[_i];
+      onDismiss();
+    }
+  };
+  var isStackedDrawer = stackingLevel && stackingLevel > 1;
+  var isAtleastOneDrawerOpen = Object.keys(drawerStack).length > 0;
+  // This condition is to avoid back button disappear while stacked drawer is in the exiting transition
+  var isDrawerExiting = isAtleastOneDrawerOpen && isExiting && stackingLevel !== 1;
+  return /*#__PURE__*/jsx(BaseHeader
+  // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
+  , {
+    showBackButton: isStackedDrawer || isDrawerExiting,
     showCloseButton: true,
     closeButtonRef: closeButtonRef,
     onCloseButtonClick: function onCloseButtonClick() {
+      return closeAllDrawers();
+    },
+    onBackButtonClick: function onBackButtonClick() {
       return close();
     },
     title: title,
@@ -48,10 +69,11 @@ var _DrawerHeader = function _DrawerHeader(_ref) {
 var DrawerHeader = /*#__PURE__*/assignWithoutSideEffects(_DrawerHeader, {
   componentId: drawerComponentIds.DrawerHeader
 });
+var drawerPadding = 'spacing.6';
 var _DrawerBody = function _DrawerBody(_ref2) {
   var children = _ref2.children;
   return /*#__PURE__*/jsx(Box, {
-    padding: "spacing.6",
+    padding: drawerPadding,
     overflow: "auto",
     flex: "1",
     children: children
@@ -61,5 +83,5 @@ var DrawerBody = /*#__PURE__*/assignWithoutSideEffects(_DrawerBody, {
   componentId: drawerComponentIds.DrawerBody
 });
-export { DrawerBody, DrawerHeader };
+export { DrawerBody, DrawerHeader, drawerPadding };
 //# sourceMappingURL=DrawerSubcomponents.web.js.map

package/build/lib/web/production/components/Drawer/DrawerSubcomponents.web.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DrawerSubcomponents.web.js","sources":["../../../../../../src/components/Drawer/DrawerSubcomponents.web.tsx"],"sourcesContent":["import React from 'react';\nimport { drawerComponentIds } from './drawerComponentIds';\nimport { DrawerContext } from './DrawerContext';\nimport type { DrawerHeaderProps } from './types';\nimport { BaseHeader } from '~components/BaseHeaderFooter/BaseHeader';\nimport { Box } from '~components/Box';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\n\nconst _DrawerHeader = ({\n title,\n subtitle,\n leading,\n trailing,\n titleSuffix,\n}: DrawerHeaderProps): React.ReactElement => {\n const { close, closeButtonRef } = React.useContext(DrawerContext);\n\n return (\n <BaseHeader\n showCloseButton={true}\n closeButtonRef={closeButtonRef}\n onCloseButtonClick={() => close()}\n title={title}\n titleSuffix={titleSuffix}\n subtitle={subtitle}\n leading={leading}\n trailing={trailing}\n />\n );\n};\n\n/*\n #### Usage\n \n ```jsx\n * <DrawerHeader\n * title=\"Announcements\"\n * subtitle=\"Checkout what's new in Razorpay\"\n * titleSuffix={<DrawerHeaderBadge>New</DrawerHeaderBadge>}\n * leading={<DrawerHeaderIcon icon={AnnouncementIcon} />}\n * trailing={<Button icon={DownloadIcon} />}\n * />\n * ```\n \n /\nconst DrawerHeader = assignWithoutSideEffects(_DrawerHeader, {\n componentId: drawerComponentIds.DrawerHeader,\n});\n\nconst _DrawerBody = ({ children }: { children: React.ReactNode }): React.ReactElement => {\n return (\n <Box padding~~=\"spacing.6\"~~ overflow=\"auto\" flex=\"1\">\n {children}\n </Box>\n );\n};\nconst DrawerBody = assignWithoutSideEffects(_DrawerBody, {\n componentId: drawerComponentIds.DrawerBody,\n});\n\nexport { DrawerHeader, DrawerBody };\n"],"names":["_DrawerHeader","_ref","title","subtitle","leading","trailing","titleSuffix","_React$useContext","React","useContext","DrawerContext","close","closeButtonRef","_jsx","BaseHeader","showCloseButton","onCloseButtonClick","DrawerHeader","assignWithoutSideEffects","componentId","drawerComponentIds","_DrawerBody","_ref2","children","Box","padding","overflow","flex","DrawerBody"],"mappings":"~~;;;;;;;;;;AAQA~~,IAAMA,aAAa,GAAG,SAAhBA,aAAaA,CAAAC,IAAA,EAM0B;AAAA,EAAA,IAL3CC,KAAK,GAAAD,IAAA,CAALC,KAAK;IACLC,QAAQ,GAAAF,IAAA,CAARE,QAAQ;IACRC,OAAO,GAAAH,IAAA,CAAPG,OAAO;IACPC,QAAQ,GAAAJ,IAAA,CAARI,QAAQ;IACRC,WAAW,GAAAL,IAAA,CAAXK,WAAW,CAAA;AAEX,EAAA,IAAAC,iBAAA,~~GAAkCC~~,cAAK,CAACC,UAAU,CAACC,aAAa,CAAC;~~IAAzDC~~,KAAK,GAAAJ,iBAAA,CAALI,KAAK;IAAEC,cAAc,GAAAL,iBAAA,CAAdK,cAAc,CAAA;~~EAE7B~~,~~oBACEC~~,~~GAAA~~,CAACC,~~UAAU~~,EAAA;~~AACTC~~,IAAAA,eAAe,EAAE,IAAK;~~AACtBH~~,IAAAA,cAAc,EAAEA,cAAe;IAC/BI,kBAAkB,EAAE,SAAAA,kBAAA,GAAA;MAAA,~~OAAML~~,KAAK,EAAE,CAAA;KAAC;~~AAClCT~~,IAAAA,KAAK,EAAEA,KAAM;AACbI,IAAAA,WAAW,EAAEA,WAAY;AACzBH,IAAAA,QAAQ,EAAEA,QAAS;AACnBC,IAAAA,OAAO,EAAEA,OAAQ;AACjBC,IAAAA,QAAQ,EAAEA,QAAAA;AAAS,GACpB,CAAC,CAAA;AAEN,CAAC,CAAA;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,~~IAAMY~~,YAAY,gBAAGC,wBAAwB,~~CAAClB~~,aAAa,EAAE;~~EAC3DmB~~,WAAW,EAAEC,kBAAkB,CAACH,YAAAA;AAClC,CAAC,EAAC;~~AAEF~~,~~IAAMI~~,WAAW,GAAG,SAAdA,WAAWA,CAAAC,KAAA,EAAwE;AAAA,EAAA,IAAlEC,QAAQ,GAAAD,KAAA,CAARC,QAAQ,CAAA;EAC7B,~~oBACEV~~,GAAA,~~CAACW~~,GAAG,EAAA;AAACC,IAAAA,OAAO,~~EAAC~~,~~WAAW~~;~~AAACC~~,IAAAA,QAAQ,EAAC,MAAM;AAACC,IAAAA,IAAI,EAAC,GAAG;AAAAJ,IAAAA,QAAA,~~EAC9CA~~,QAAAA;AAAQ,GACN,CAAC,CAAA;AAEV,CAAC,CAAA;AACD,IAAMK,UAAU,~~gBAAGV~~,wBAAwB,~~CAACG~~,WAAW,EAAE;~~EACvDF~~,WAAW,EAAEC,kBAAkB,~~CAACQ~~,UAAAA;AAClC,CAAC;;;;"}
1	+ {"version":3,"file":"DrawerSubcomponents.web.js","sources":["../../../../../../src/components/Drawer/DrawerSubcomponents.web.tsx"],"sourcesContent":["import React from 'react';\nimport { drawerComponentIds } from './drawerComponentIds';\nimport { DrawerContext } from './DrawerContext';\nimport type { DrawerHeaderProps } from './types';\nimport { useDrawerStack } from './StackProvider';\nimport { BaseHeader } from '~components/BaseHeaderFooter/BaseHeader';\nimport { Box } from '~components/Box';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\n\nconst _DrawerHeader = ({\n title,\n subtitle,\n leading,\n trailing,\n titleSuffix,\n}: DrawerHeaderProps): React.ReactElement => {\n const { close, closeButtonRef, stackingLevel, isExiting } = React.useContext(DrawerContext);\n const { drawerStack } = useDrawerStack();\n const closeAllDrawers = (): void => {\n for (const onDismiss of Object.values(drawerStack)) {\n onDismiss();\n }\n };\n\n const isStackedDrawer = stackingLevel && stackingLevel > 1;\n\n const isAtleastOneDrawerOpen = Object.keys(drawerStack).length > 0;\n // This condition is to avoid back button disappear while stacked drawer is in the exiting transition\n const isDrawerExiting = isAtleastOneDrawerOpen && isExiting && stackingLevel !== 1;\n\n return (\n <BaseHeader\n // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing\n showBackButton={isStackedDrawer \|\| isDrawerExiting}\n showCloseButton={true}\n closeButtonRef={closeButtonRef}\n onCloseButtonClick={() => closeAllDrawers()}\n onBackButtonClick={() => close()}\n title={title}\n titleSuffix={titleSuffix}\n subtitle={subtitle}\n leading={leading}\n trailing={trailing}\n />\n );\n};\n\n/*\n #### Usage\n \n ```jsx\n * <DrawerHeader\n * title=\"Announcements\"\n * subtitle=\"Checkout what's new in Razorpay\"\n * titleSuffix={<DrawerHeaderBadge>New</DrawerHeaderBadge>}\n * leading={<DrawerHeaderIcon icon={AnnouncementIcon} />}\n * trailing={<Button icon={DownloadIcon} />}\n * />\n * ```\n \n /\nconst DrawerHeader = assignWithoutSideEffects(_DrawerHeader, {\n componentId: drawerComponentIds.DrawerHeader,\n});\n\nconst drawerPadding = 'spacing.6';\n\nconst _DrawerBody = ({ children }: { children: React.ReactNode }): React.ReactElement => {\n return (\n <Box padding={drawerPadding} overflow=\"auto\" flex=\"1\">\n {children}\n </Box>\n );\n};\nconst DrawerBody = assignWithoutSideEffects(_DrawerBody, {\n componentId: drawerComponentIds.DrawerBody,\n});\n\nexport { DrawerHeader, DrawerBody, drawerPadding };\n"],"names":["_DrawerHeader","_ref","title","subtitle","leading","trailing","titleSuffix","_React$useContext","React","useContext","DrawerContext","close","closeButtonRef","stackingLevel","isExiting","_useDrawerStack","useDrawerStack","drawerStack","closeAllDrawers","_i","_Object$values","Object","values","length","onDismiss","isStackedDrawer","isAtleastOneDrawerOpen","keys","isDrawerExiting","_jsx","BaseHeader","showBackButton","showCloseButton","onCloseButtonClick","onBackButtonClick","DrawerHeader","assignWithoutSideEffects","componentId","drawerComponentIds","drawerPadding","_DrawerBody","_ref2","children","Box","padding","overflow","flex","DrawerBody"],"mappings":"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"}

package/build/lib/web/production/components/Drawer/StackProvider.js CHANGED Viewed

@@ -1,35 +1,44 @@
-import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
+import _typeof from '@babel/runtime/helpers/typeof';
+import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
 import React__default from 'react';
 import { jsx } from 'react/jsx-runtime';
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var StackingContext = /*#__PURE__*/React__default.createContext({
-  drawerStack: [],
+  drawerStack: {},
   // eslint-disable-next-line @typescript-eslint/no-empty-function
   addToDrawerStack: function addToDrawerStack() {},
   // eslint-disable-next-line @typescript-eslint/no-empty-function
   removeFromDrawerStack: function removeFromDrawerStack() {}
 });
 var useStacking = function useStacking() {
-  var _React$useState = React__default.useState([]),
+  var _React$useState = React__default.useState({}),
     _React$useState2 = _slicedToArray(_React$useState, 2),
     stack = _React$useState2[0],
     setStack = _React$useState2[1];
-  var addToStack = function addToStack(elementId) {
-    if (stack.includes(elementId)) {
+  var addToStack = function addToStack(_ref) {
+    var elementId = _ref.elementId,
+      onDismiss = _ref.onDismiss;
+    if (stack[elementId]) {
       return;
     }
-    setStack([].concat(_toConsumableArray(stack), [elementId]));
+    setStack(_objectSpread(_objectSpread({}, stack), {}, _defineProperty({}, elementId, onDismiss)));
   };
-  var removeFromStack = function removeFromStack(elementId) {
-    setStack(stack.filter(function (stackElementId) {
-      return stackElementId !== elementId;
-    }));
+  var removeFromStack = function removeFromStack(_ref2) {
+    var elementId = _ref2.elementId;
+    var _ = stack[elementId],
+      newStack = _objectWithoutProperties(stack, [elementId].map(_toPropertyKey));
+    setStack(newStack);
   };
   return [stack, addToStack, removeFromStack];
 };
-var DrawerStackProvider = function DrawerStackProvider(_ref) {
-  var children = _ref.children;
+var DrawerStackProvider = function DrawerStackProvider(_ref3) {
+  var children = _ref3.children;
   var _useStacking = useStacking(),
     _useStacking2 = _slicedToArray(_useStacking, 3),
     drawerStack = _useStacking2[0],

package/build/lib/web/production/components/Drawer/StackProvider.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"StackProvider.js","sources":["../../../../../../src/components/Drawer/StackProvider.tsx"],"sourcesContent":["import React from 'react';\n\ntype ~~StackActionType~~ = (elementId: string) => void;\n\ntype GlobalStackStateType = {\n drawerStack: string~~[];\~~n addToDrawerStack: ~~StackActionType~~;\n removeFromDrawerStack: ~~StackActionType~~;\n};\n\nconst StackingContext = React.createContext<GlobalStackStateType>({\n drawerStack: [],\n // eslint-disable-next-line @typescript-eslint/no-empty-function\n addToDrawerStack: () => {},\n // eslint-disable-next-line @typescript-eslint/no-empty-function\n removeFromDrawerStack: () => {},\n});\n\nconst useStacking = (): [~~string~~[]~~, StackActionType, StackActionType~~] => {\n const [stack, setStack] = React.useState<~~string~~[]>([]);\n\n const addToStack = (elementId: ~~string~~): ~~void~~ => {\n if (stack~~.includes(~~elementId)) {\n return;\n }\n\n setStack([...stack, elementId]);\n };\n\n const removeFromStack = (elementId: ~~string~~): ~~void~~ => {\n ~~setStack(stack.filter((stackElementId)~~ => ~~stackElementId~~ ~~!==~~ ~~elementId~~));\n };\n\n return [stack, addToStack, removeFromStack];\n};\n\nconst DrawerStackProvider = ({ children }: { children: React.ReactNode }): React.ReactElement => {\n const [drawerStack, addToDrawerStack, removeFromDrawerStack] = useStacking();\n\n const contextValue = React.useMemo<GlobalStackStateType>(\n () => ({\n drawerStack,\n addToDrawerStack,\n removeFromDrawerStack,\n }),\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [drawerStack],\n );\n\n return <StackingContext.Provider value={contextValue}>{children}</StackingContext.Provider>;\n};\n\nconst useDrawerStack = (): GlobalStackStateType => {\n return React.useContext(StackingContext);\n};\n\nexport { DrawerStackProvider, useDrawerStack };\n"],"names":["StackingContext","React","createContext","drawerStack","addToDrawerStack","removeFromDrawerStack","useStacking","_React$useState","useState","_React$useState2","_slicedToArray","stack","setStack","addToStack","elementId","~~includes~~","~~concat~~","~~_toConsumableArray~~","removeFromStack","~~filter~~","~~stackElementId~~","DrawerStackProvider","~~_ref~~","children","_useStacking","_useStacking2","contextValue","useMemo","_jsx","Provider","value","useDrawerStack","useContext"],"mappings":"~~;;;;;AAUA~~,IAAMA,eAAe,gBAAGC,cAAK,CAACC,aAAa,CAAuB;~~AAChEC~~,~~EAAAA,~~WAAW,EAAE,EAAE;AACf;AACAC,EAAAA,gBAAgB,EAAE,SAAAA,gBAAA,GAAM,EAAE;AAC1B;AACAC,EAAAA,qBAAqB,EAAE,SAAAA,qBAAA,GAAM,EAAC;AAChC,CAAC,CAAC,CAAA;AAEF,IAAMC,WAAW,GAAG,SAAdA,WAAWA,~~GAAuD~~;~~AACtE~~,~~EAAA,~~IAAAC,eAAA,GAA0BN,cAAK,CAACO,QAAQ,~~CAAW~~,EAAE,CAAC;IAAAC,gBAAA,GAAAC,cAAA,CAAAH,eAAA,EAAA,CAAA,CAAA;~~AAA/CI~~,IAAAA,KAAK,GAAAF,gBAAA,CAAA,CAAA,CAAA;AAAEG,IAAAA,QAAQ,GAAAH,gBAAA,CAAA,CAAA,CAAA,CAAA;AAEtB,EAAA,IAAMI,~~UAAU~~,GAAG,~~SAAbA~~,~~UAAUA~~,~~CAAIC~~,~~SAAiB~~,~~EAAW~~;~~AAC9C~~,IAAA,~~IAAIH~~,~~KAAK~~,~~CAACI~~,~~QAAQ~~,~~CAACD~~,SAAS,CAAC,EAAE;~~AAC7B~~,MAAA,OAAA;AACF,KAAA;~~IAEAF~~,QAAQ,~~CAAA~~,~~EAAA~~,~~CAAAI~~,~~MAAA~~,~~CAAAC~~,~~kBAAA~~,~~CAAKN~~,KAAK,~~CAAA~~,~~EAAA~~,~~CAAEG~~,SAAS,~~CAAA~~,~~CAAC~~,CAAC,CAAA;~~GAChC~~,CAAA;AAED,EAAA,~~IAAMI~~,~~eAAe~~,GAAG,~~SAAlBA~~,~~eAAeA~~,~~CAAIJ~~,~~SAAiB~~,~~EAAW~~;~~AACnDF~~,~~IAAAA~~,~~QAAQ~~,~~CAACD~~,~~KAAK~~,~~CAACQ~~,~~MAAM~~,CAAC,~~UAACC~~,~~cAAc~~,~~EAAA~~;~~MAAA~~,~~OAAKA~~,~~cAAc~~,~~KAAKN~~,SAAS,CAAA;~~AAAA~~,~~KAAA~~,~~CAAC~~,CAAC,CAAA;~~GACzE~~,CAAA;AAED,EAAA,OAAO,~~CAACH~~,KAAK,EAAEE,UAAU,~~EAAEK~~,eAAe,CAAC,CAAA;AAC7C,CAAC,CAAA;AAED,~~IAAMG~~,mBAAmB,GAAG,SAAtBA,mBAAmBA,CAAAC,~~IAAA~~,EAAwE;AAAA,EAAA,IAAlEC,QAAQ,GAAAD,~~IAAA~~,CAARC,QAAQ,CAAA;AACrC,EAAA,IAAAC,YAAA,GAA+~~DlB~~,WAAW,EAAE;~~IAAAmB~~,aAAA,~~GAAAf~~,cAAA,~~CAAAc~~,YAAA,EAAA,CAAA,CAAA;~~AAArErB~~,IAAAA,WAAW,~~GAAAsB~~,aAAA,CAAA,CAAA,CAAA;~~AAAErB~~,IAAAA,gBAAgB,~~GAAAqB~~,aAAA,CAAA,CAAA,CAAA;~~AAAEpB~~,IAAAA,qBAAqB,~~GAAAoB~~,aAAA,CAAA,CAAA,CAAA,CAAA;AAE3D,EAAA,IAAMC,YAAY,~~GAAGzB~~,cAAK,~~CAAC0B~~,OAAO,CAChC,YAAA;IAAA,OAAO;~~AACLxB~~,MAAAA,WAAW,EAAXA,WAAW;AACXC,MAAAA,gBAAgB,EAAhBA,gBAAgB;AAChBC,MAAAA,qBAAqB,EAArBA,qBAAAA;KACD,CAAA;GAAC;AACF;EACA,CAACF,WAAW,CACd,CAAC,CAAA;AAED,EAAA,~~oBAAOyB~~,GAAA,~~CAAC5B~~,eAAe,~~CAAC6B~~,QAAQ,EAAA;AAACC,IAAAA,KAAK,EAAEJ,YAAa;AAAAH,IAAAA,QAAA,EAAEA,QAAAA;AAAQ,GAA2B,CAAC,CAAA;AAC7F,EAAC;AAED,IAAMQ,cAAc,GAAG,SAAjBA,cAAcA,GAA+B;AACjD,EAAA,~~OAAO9B~~,cAAK,~~CAAC+B~~,UAAU,~~CAAChC~~,eAAe,CAAC,CAAA;AAC1C;;;;"}
1	+ {"version":3,"file":"StackProvider.js","sources":["../../../../../../src/components/Drawer/StackProvider.tsx"],"sourcesContent":["import React from 'react';\n\ntype AddToStackType = ({\n elementId,\n onDismiss,\n}: {\n elementId: string;\n onDismiss: () => void;\n}) => void;\n\ntype RemoveFromStackType = ({ elementId }: { elementId: string }) => void;\n\ntype GlobalStackStateType = {\n drawerStack: Record<string, () => void>;\n addToDrawerStack: AddToStackType;\n removeFromDrawerStack: RemoveFromStackType;\n};\n\nconst StackingContext = React.createContext<GlobalStackStateType>({\n drawerStack: {},\n // eslint-disable-next-line @typescript-eslint/no-empty-function\n addToDrawerStack: () => {},\n // eslint-disable-next-line @typescript-eslint/no-empty-function\n removeFromDrawerStack: () => {},\n});\n\nconst useStacking = (): [\n GlobalStackStateType['drawerStack'],\n AddToStackType,\n RemoveFromStackType,\n] => {\n const [stack, setStack] = React.useState<GlobalStackStateType['drawerStack']>({});\n\n const addToStack: AddToStackType = ({ elementId, onDismiss }) => {\n if (stack[elementId]) {\n return;\n }\n\n setStack({ ...stack, [elementId]: onDismiss });\n };\n\n const removeFromStack: RemoveFromStackType = ({ elementId }) => {\n const { [elementId]: _, ...newStack } = stack;\n setStack(newStack);\n };\n\n return [stack, addToStack, removeFromStack];\n};\n\nconst DrawerStackProvider = ({ children }: { children: React.ReactNode }): React.ReactElement => {\n const [drawerStack, addToDrawerStack, removeFromDrawerStack] = useStacking();\n\n const contextValue = React.useMemo<GlobalStackStateType>(\n () => ({\n drawerStack,\n addToDrawerStack,\n removeFromDrawerStack,\n }),\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [drawerStack],\n );\n\n return <StackingContext.Provider value={contextValue}>{children}</StackingContext.Provider>;\n};\n\nconst useDrawerStack = (): GlobalStackStateType => {\n return React.useContext(StackingContext);\n};\n\nexport { DrawerStackProvider, useDrawerStack };\n"],"names":["StackingContext","React","createContext","drawerStack","addToDrawerStack","removeFromDrawerStack","useStacking","_React$useState","useState","_React$useState2","_slicedToArray","stack","setStack","addToStack","_ref","elementId","onDismiss","_objectSpread","_defineProperty","removeFromStack","_ref2","_","newStack","_objectWithoutProperties","map","_toPropertyKey","DrawerStackProvider","_ref3","children","_useStacking","_useStacking2","contextValue","useMemo","_jsx","Provider","value","useDrawerStack","useContext"],"mappings":";;;;;;;;;;;AAkBA,IAAMA,eAAe,gBAAGC,cAAK,CAACC,aAAa,CAAuB;EAChEC,WAAW,EAAE,EAAE;AACf;AACAC,EAAAA,gBAAgB,EAAE,SAAAA,gBAAA,GAAM,EAAE;AAC1B;AACAC,EAAAA,qBAAqB,EAAE,SAAAA,qBAAA,GAAM,EAAC;AAChC,CAAC,CAAC,CAAA;AAEF,IAAMC,WAAW,GAAG,SAAdA,WAAWA,GAIZ;EACH,IAAAC,eAAA,GAA0BN,cAAK,CAACO,QAAQ,CAAsC,EAAE,CAAC;IAAAC,gBAAA,GAAAC,cAAA,CAAAH,eAAA,EAAA,CAAA,CAAA;AAA1EI,IAAAA,KAAK,GAAAF,gBAAA,CAAA,CAAA,CAAA;AAAEG,IAAAA,QAAQ,GAAAH,gBAAA,CAAA,CAAA,CAAA,CAAA;AAEtB,EAAA,IAAMI,UAA0B,GAAG,SAA7BA,UAA0BA,CAAAC,IAAA,EAAiC;AAAA,IAAA,IAA3BC,SAAS,GAAAD,IAAA,CAATC,SAAS;MAAEC,SAAS,GAAAF,IAAA,CAATE,SAAS,CAAA;AACxD,IAAA,IAAIL,KAAK,CAACI,SAAS,CAAC,EAAE;AACpB,MAAA,OAAA;AACF,KAAA;AAEAH,IAAAA,QAAQ,CAAAK,aAAA,CAAAA,aAAA,CAAMN,EAAAA,EAAAA,KAAK,CAAAO,EAAAA,EAAAA,EAAAA,eAAA,CAAGH,EAAAA,EAAAA,SAAS,EAAGC,SAAS,EAAE,CAAC,CAAA;GAC/C,CAAA;AAED,EAAA,IAAMG,eAAoC,GAAG,SAAvCA,eAAoCA,CAAAC,KAAA,EAAsB;AAAA,IAAA,IAAhBL,SAAS,GAAAK,KAAA,CAATL,SAAS,CAAA;AACvD,IAAA,IAAqBM,CAAC,GAAkBV,KAAK,CAApCI,SAAS,CAAA;MAASO,QAAQ,GAAAC,wBAAA,CAAKZ,KAAK,GAApCI,SAAS,CAAA,CAAAS,GAAA,CAAAC,cAAA,CAAA,CAAA,CAAA;IAClBb,QAAQ,CAACU,QAAQ,CAAC,CAAA;GACnB,CAAA;AAED,EAAA,OAAO,CAACX,KAAK,EAAEE,UAAU,EAAEM,eAAe,CAAC,CAAA;AAC7C,CAAC,CAAA;AAED,IAAMO,mBAAmB,GAAG,SAAtBA,mBAAmBA,CAAAC,KAAA,EAAwE;AAAA,EAAA,IAAlEC,QAAQ,GAAAD,KAAA,CAARC,QAAQ,CAAA;AACrC,EAAA,IAAAC,YAAA,GAA+DvB,WAAW,EAAE;IAAAwB,aAAA,GAAApB,cAAA,CAAAmB,YAAA,EAAA,CAAA,CAAA;AAArE1B,IAAAA,WAAW,GAAA2B,aAAA,CAAA,CAAA,CAAA;AAAE1B,IAAAA,gBAAgB,GAAA0B,aAAA,CAAA,CAAA,CAAA;AAAEzB,IAAAA,qBAAqB,GAAAyB,aAAA,CAAA,CAAA,CAAA,CAAA;AAE3D,EAAA,IAAMC,YAAY,GAAG9B,cAAK,CAAC+B,OAAO,CAChC,YAAA;IAAA,OAAO;AACL7B,MAAAA,WAAW,EAAXA,WAAW;AACXC,MAAAA,gBAAgB,EAAhBA,gBAAgB;AAChBC,MAAAA,qBAAqB,EAArBA,qBAAAA;KACD,CAAA;GAAC;AACF;EACA,CAACF,WAAW,CACd,CAAC,CAAA;AAED,EAAA,oBAAO8B,GAAA,CAACjC,eAAe,CAACkC,QAAQ,EAAA;AAACC,IAAAA,KAAK,EAAEJ,YAAa;AAAAH,IAAAA,QAAA,EAAEA,QAAAA;AAAQ,GAA2B,CAAC,CAAA;AAC7F,EAAC;AAED,IAAMQ,cAAc,GAAG,SAAjBA,cAAcA,GAA+B;AACjD,EAAA,OAAOnC,cAAK,CAACoC,UAAU,CAACrC,eAAe,CAAC,CAAA;AAC1C;;;;"}

package/build/lib/web/production/components/Drawer/index.js CHANGED Viewed

@@ -1,4 +1,4 @@
 export { Drawer } from './Drawer.web.js';
-export { DrawerBody, DrawerHeader } from './DrawerSubcomponents.web.js';
+export { DrawerBody, DrawerHeader, drawerPadding } from './DrawerSubcomponents.web.js';
 import './types.js';
 //# sourceMappingURL=index.js.map

package/build/lib/web/production/components/FileUpload/FileUpload.web.js CHANGED Viewed

@@ -197,6 +197,9 @@ var _FileUpload = function _FileUpload(_ref, ref) {
         fileList: allFiles
       });
     }
+    // Reset the input value to allow re-selecting the same file
+    event.target.value = '';
   };
   return /*#__PURE__*/jsxs(BaseBox, _objectSpread(_objectSpread(_objectSpread({
     display: "flex",