@razorpay/blade 9.0.0 → 9.0.2

package/build/components/index.web.js

@@ -553,6 +553,11 @@ var getDropdownOverlayPosition = function getDropdownOverlayPosition(_ref) {
   var HEIGHT_THRESHOLD = (Number(actionListItemEl === null || actionListItemEl === void 0 ? void 0 : actionListItemEl.clientHeight) + Number(size[16])) * -1;
 
   if (!isMenu) {
+    // In SelectInput, we set position wrt to right so that leftLabel position can be accomodated
+    // without additional offset calculation from left
+    newPosition.left = undefined;
+    newPosition.right = zeroSpacing;
+
     if (bottom > HEIGHT_THRESHOLD) {
       newPosition.bottom = "".concat(Number(triggererEl === null || triggererEl === void 0 ? void 0 : triggererEl.clientHeight) + Number(size[32]), "px");
       newPosition.top = undefined;
@@ -1394,15 +1399,19 @@ var componentIds = {
   ActionListSection: 'ActionListSection'
 };
 
-/* eslint-disable @typescript-eslint/no-explicit-any */
+/* eslint-disable no-restricted-properties */
 /**
  * Gets the `componentId` prop of React component if it exists.
  */
 
 var getComponentId = function getComponentId(component) {
-  var _component$type;
+  var _component$props, _component$props2, _component$props2$ori, _component$type;
 
-  if (! /*#__PURE__*/React__default.isValidElement(component)) return null; // eslint-disable-next-line no-restricted-properties
+  if (! /*#__PURE__*/React__default.isValidElement(component)) return null; // Storybook wraps MDX components in a wrapper component, so we need to get componentId from originalType
+
+  if (component !== null && component !== void 0 && (_component$props = component.props) !== null && _component$props !== void 0 && _component$props.mdxType && component !== null && component !== void 0 && (_component$props2 = component.props) !== null && _component$props2 !== void 0 && (_component$props2$ori = _component$props2.originalType) !== null && _component$props2$ori !== void 0 && _component$props2$ori.componentId) {
+    return component.props.originalType.componentId;
+  }
 
   return (_component$type = component.type) === null || _component$type === void 0 ? void 0 : _component$type.componentId;
 };
@@ -28848,25 +28857,10 @@ var getTransitionEasing = function getTransitionEasing(theme) {
   return theme.motion.easing.standard.effective;
 };
 
-/**
- * The orientation of chevron icon inverts based on the direction collapsible expands in.
- * `transformExpanded` and `transformCollapsed` therefore need to swap their corresponding expanded and collapsed values.
- */
-var getCollapsibleChevronIconTransforms = function getCollapsibleChevronIconTransforms(_ref3) {
-  var direction = _ref3.direction;
-  var transformExpanded, transformCollapsed;
-
-  if (direction === 'bottom') {
-    transformExpanded = -180;
-    transformCollapsed = 0;
-  } else {
-    transformExpanded = 0;
-    transformCollapsed = -180;
-  }
-
+var getCollapsibleChevronIconTransforms = function getCollapsibleChevronIconTransforms() {
   return {
-    transformExpanded: transformExpanded,
-    transformCollapsed: transformCollapsed
+    transformExpanded: -180,
+    transformCollapsed: 0
   };
 };
 
@@ -28878,12 +28872,9 @@ var StyledCollapsibleChevronIcon = /*#__PURE__*/styled(BaseBox).withConfig({
   componentId: "sc-1kwlg5h-0"
 })(function (props) {
   var isExpanded = props.isExpanded,
-      direction = props.direction,
       theme = props.theme;
 
-  var _getCollapsibleChevro = getCollapsibleChevronIconTransforms({
-    direction: direction
-  }),
+  var _getCollapsibleChevro = getCollapsibleChevronIconTransforms(),
       transformExpanded = _getCollapsibleChevro.transformExpanded,
       transformCollapsed = _getCollapsibleChevro.transformCollapsed;