npm - @razorpay/blade - Versions diffs - 11.6.3 → 11.8.0 - Mend

@razorpay/blade 11.6.3 → 11.8.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 (118) hide show

package/build/lib/native/components/index.js CHANGED Viewed

@@ -1,4 +1,6 @@
 export { Accordion } from './Accordion/Accordion.js';
+export { AccordionItemHeader } from './Accordion/AccordionItemHeader.js';
+export { AccordionItemBody } from './Accordion/AccordionItemBody.js';
 export { AccordionItem } from './Accordion/AccordionItem.js';
 export { ActionList } from './ActionList/ActionList.js';
 export { ActionListItem, ActionListItemBadge, ActionListItemBadgeGroup, ActionListItemIcon, ActionListItemText, ActionListSection } from './ActionList/ActionListItem.js';
@@ -14,6 +16,7 @@ export { BreadcrumbItem } from './Breadcrumb/BreadcrumbItem.native.js';
 export { Box } from './Box/Box.js';
 export { default as Button } from './Button/Button/Button.js';
 export { IconButton } from './Button/IconButton/IconButton.js';
+export { ButtonGroup } from './ButtonGroup/ButtonGroup.native.js';
 export { Card, CardBody, ComponentIds } from './Card/Card.js';
 export { CardHeader, CardHeaderAmount, CardHeaderBadge, CardHeaderCounter, CardHeaderIcon, CardHeaderIconButton, CardHeaderLeading, CardHeaderLink, CardHeaderText, CardHeaderTrailing } from './Card/CardHeader.js';
 export { CardFooter, CardFooterLeading, CardFooterTrailing } from './Card/CardFooter.js';

package/build/lib/native/components/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1	+ {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/build/lib/native/utils/metaAttribute/metaConstants.js CHANGED Viewed

@@ -1,4 +1,4 @@
-var MetaConstants={Accordion:'accordion',AccordionButton:'accordion-button',AccordionItem:'accordion-item',ActionList:'action-list',ActionListItem:'action-list-item',ActionListSection:'action-list-section',Alert:'alert',Amount:'amount',AutoComplete:'autocomplete',Badge:'badge',Box:'box',BaseBox:'base-box',BaseText:'base-text',Button:'button',Breadcrumb:'breadcrumb',BreadcrumbItem:'breadcrumb-item',Carousel:'carousel',Checkbox:'checkbox',CheckboxGroup:'checkbox-group',CheckboxLabel:'checkbox-label',Chip:'chip',ChipGroup:'chip-group',ChipLabel:'chip-label',Code:'code',Component:'blade-component',Counter:'counter',Display:'display',Divider:'divider',Drawer:'drawer',Dropdown:'dropdown',DropdownOverlay:'dropdown-overlay',DropdownFooter:'dropdown-footer',DropdownHeader:'dropdown-header',FileUpload:'file-upload',FileUploadItem:'file-upload-item',FileUploadLabel:'file-upload-label',Icon:'icon',IconButton:'icon-button',Indicator:'indicator',Link:'link',List:'list',ListItem:'list-item',ListItemCode:'list-item-code',ListItemLink:'list-item-link',ListItemText:'list-item-text',OTPInput:'otp-input',PasswordInput:'password-input',TextArea:'textarea',TextInput:'textinput',Toast:'toast',ToastContainer:'toast-container',ProgressBar:'progress-bar',Radio:'radio',RadioGroup:'radio-group',RadioLabel:'radio-label',SkipNav:'skipnav',Spinner:'spinner',SelectInput:'select-input',Tag:'tag',Tooltip:'tooltip',TooltipInteractiveWrapper:'tooltip-interactive-wrapper',Tabs:'tabs',TabList:'tab-list',TabItem:'tab-item',TabPanel:'tab-panel',TabIndicator:'tab-indicator',Table:'table',TableBody:'table-body',TableRow:'table-row',TableCell:'table-cell',TableHeader:'table-header',TableHeaderRow:'table-header-row',TableHeaderCell:'table-header-cell',TableFooter:'table-footer',TableFooterRow:'table-footer-row',TableFooterCell:'table-footer-cell',TableElement:'table-element',TourPopover:'tour-popover',TourMask:'tour-mask',Popover:'popover',PopoverInteractiveWrapper:'popover-interactive-wrapper',BottomSheet:'bottom-sheet',BottomSheetBody:'bottom-sheet-body',BottomSheetHeader:'bottom-sheet-header',BottomSheetFooter:'bottom-sheet-footer',BottomSheetGrabHandle:'bottomsheet-grab-handle',Card:'card',CardBody:'card-body',CardHeader:'card-header',CardFooter:'card-footer',Collapsible:'collapsible',CollapsibleBody:'collapsible-body',CollapsibleButton:'collapsible-button',CollapsibleLink:'collapsible-link',Modal:'modal',ModalBody:'modal-body',ModalHeader:'modal-header',ModalFooter:'modal-footer',ModalBackdrop:'modal-backdrop',ModalScrollOverlay:'modal-scroll-overlay',VisuallyHidden:'visually-hidden',FormLabel:'form-label',Switch:'switch',SwitchLabel:'switch-label',StyledBaseInput:'styled-base-input',Skeleton:'skeleton'};
+var MetaConstants={Accordion:'accordion',AccordionButton:'accordion-button',AccordionItem:'accordion-item',AccordionItemHeader:'accordion-item-header',AccordionItemBody:'accordion-item-body',ActionList:'action-list',ActionListItem:'action-list-item',ActionListSection:'action-list-section',Alert:'alert',Amount:'amount',AutoComplete:'autocomplete',Badge:'badge',Box:'box',BaseBox:'base-box',BaseText:'base-text',Button:'button',ButtonGroup:'button-group',Breadcrumb:'breadcrumb',BreadcrumbItem:'breadcrumb-item',Carousel:'carousel',Checkbox:'checkbox',CheckboxGroup:'checkbox-group',CheckboxLabel:'checkbox-label',Chip:'chip',ChipGroup:'chip-group',ChipLabel:'chip-label',Code:'code',Component:'blade-component',Counter:'counter',Display:'display',Divider:'divider',Drawer:'drawer',Dropdown:'dropdown',DropdownOverlay:'dropdown-overlay',DropdownFooter:'dropdown-footer',DropdownHeader:'dropdown-header',FileUpload:'file-upload',FileUploadItem:'file-upload-item',FileUploadLabel:'file-upload-label',Icon:'icon',IconButton:'icon-button',Indicator:'indicator',Link:'link',List:'list',ListItem:'list-item',ListItemCode:'list-item-code',ListItemLink:'list-item-link',ListItemText:'list-item-text',OTPInput:'otp-input',PasswordInput:'password-input',TextArea:'textarea',TextInput:'textinput',Toast:'toast',ToastContainer:'toast-container',ProgressBar:'progress-bar',Radio:'radio',RadioGroup:'radio-group',RadioLabel:'radio-label',SkipNav:'skipnav',Spinner:'spinner',SelectInput:'select-input',Tag:'tag',Tooltip:'tooltip',TooltipInteractiveWrapper:'tooltip-interactive-wrapper',Tabs:'tabs',TabList:'tab-list',TabItem:'tab-item',TabPanel:'tab-panel',TabIndicator:'tab-indicator',Table:'table',TableBody:'table-body',TableRow:'table-row',TableCell:'table-cell',TableHeader:'table-header',TableHeaderRow:'table-header-row',TableHeaderCell:'table-header-cell',TableFooter:'table-footer',TableFooterRow:'table-footer-row',TableFooterCell:'table-footer-cell',TableElement:'table-element',TourPopover:'tour-popover',TourMask:'tour-mask',Popover:'popover',PopoverInteractiveWrapper:'popover-interactive-wrapper',BottomSheet:'bottom-sheet',BottomSheetBody:'bottom-sheet-body',BottomSheetHeader:'bottom-sheet-header',BottomSheetFooter:'bottom-sheet-footer',BottomSheetGrabHandle:'bottomsheet-grab-handle',Card:'card',CardBody:'card-body',CardHeader:'card-header',CardFooter:'card-footer',Collapsible:'collapsible',CollapsibleBody:'collapsible-body',CollapsibleButton:'collapsible-button',CollapsibleLink:'collapsible-link',Modal:'modal',ModalBody:'modal-body',ModalHeader:'modal-header',ModalFooter:'modal-footer',ModalBackdrop:'modal-backdrop',ModalScrollOverlay:'modal-scroll-overlay',VisuallyHidden:'visually-hidden',FormLabel:'form-label',Switch:'switch',SwitchLabel:'switch-label',StyledBaseInput:'styled-base-input',Skeleton:'skeleton'};
 export { MetaConstants };
 //# sourceMappingURL=metaConstants.js.map

package/build/lib/native/utils/metaAttribute/metaConstants.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"metaConstants.js","sources":["../../../../../src/utils/metaAttribute/metaConstants.ts"],"sourcesContent":["export const MetaConstants = {\n Accordion: 'accordion',\n AccordionButton: 'accordion-button',\n AccordionItem: 'accordion-item',\n ActionList: 'action-list',\n ActionListItem: 'action-list-item',\n ActionListSection: 'action-list-section',\n Alert: 'alert',\n Amount: 'amount',\n AutoComplete: 'autocomplete',\n Badge: 'badge',\n Box: 'box',\n BaseBox: 'base-box',\n BaseText: 'base-text',\n Button: 'button',\n Breadcrumb: 'breadcrumb',\n BreadcrumbItem: 'breadcrumb-item',\n Carousel: 'carousel',\n Checkbox: 'checkbox',\n CheckboxGroup: 'checkbox-group',\n CheckboxLabel: 'checkbox-label',\n Chip: 'chip',\n ChipGroup: 'chip-group',\n ChipLabel: 'chip-label',\n Code: 'code',\n Component: 'blade-component',\n Counter: 'counter',\n Display: 'display',\n Divider: 'divider',\n Drawer: 'drawer',\n Dropdown: 'dropdown',\n DropdownOverlay: 'dropdown-overlay',\n DropdownFooter: 'dropdown-footer',\n DropdownHeader: 'dropdown-header',\n FileUpload: 'file-upload',\n FileUploadItem: 'file-upload-item',\n FileUploadLabel: 'file-upload-label',\n Icon: 'icon',\n IconButton: 'icon-button',\n Indicator: 'indicator',\n Link: 'link',\n List: 'list',\n ListItem: 'list-item',\n ListItemCode: 'list-item-code',\n ListItemLink: 'list-item-link',\n ListItemText: 'list-item-text',\n OTPInput: 'otp-input',\n PasswordInput: 'password-input',\n TextArea: 'textarea',\n TextInput: 'textinput',\n Toast: 'toast',\n ToastContainer: 'toast-container',\n ProgressBar: 'progress-bar',\n Radio: 'radio',\n RadioGroup: 'radio-group',\n RadioLabel: 'radio-label',\n SkipNav: 'skipnav',\n Spinner: 'spinner',\n SelectInput: 'select-input',\n Tag: 'tag',\n Tooltip: 'tooltip',\n TooltipInteractiveWrapper: 'tooltip-interactive-wrapper',\n Tabs: 'tabs',\n TabList: 'tab-list',\n TabItem: 'tab-item',\n TabPanel: 'tab-panel',\n TabIndicator: 'tab-indicator',\n Table: 'table',\n TableBody: 'table-body',\n TableRow: 'table-row',\n TableCell: 'table-cell',\n TableHeader: 'table-header',\n TableHeaderRow: 'table-header-row',\n TableHeaderCell: 'table-header-cell',\n TableFooter: 'table-footer',\n TableFooterRow: 'table-footer-row',\n TableFooterCell: 'table-footer-cell',\n TableElement: 'table-element',\n TourPopover: 'tour-popover',\n TourMask: 'tour-mask',\n Popover: 'popover',\n PopoverInteractiveWrapper: 'popover-interactive-wrapper',\n BottomSheet: 'bottom-sheet',\n BottomSheetBody: 'bottom-sheet-body',\n BottomSheetHeader: 'bottom-sheet-header',\n BottomSheetFooter: 'bottom-sheet-footer',\n BottomSheetGrabHandle: 'bottomsheet-grab-handle',\n Card: 'card',\n CardBody: 'card-body',\n CardHeader: 'card-header',\n CardFooter: 'card-footer',\n Collapsible: 'collapsible',\n CollapsibleBody: 'collapsible-body',\n CollapsibleButton: 'collapsible-button',\n CollapsibleLink: 'collapsible-link',\n Modal: 'modal',\n ModalBody: 'modal-body',\n ModalHeader: 'modal-header',\n ModalFooter: 'modal-footer',\n ModalBackdrop: 'modal-backdrop',\n ModalScrollOverlay: 'modal-scroll-overlay',\n VisuallyHidden: 'visually-hidden',\n FormLabel: 'form-label',\n Switch: 'switch',\n SwitchLabel: 'switch-label',\n StyledBaseInput: 'styled-base-input',\n Skeleton: 'skeleton',\n} as const;\n"],"names":["MetaConstants","Accordion","AccordionButton","AccordionItem","ActionList","ActionListItem","ActionListSection","Alert","Amount","AutoComplete","Badge","Box","BaseBox","BaseText","Button","Breadcrumb","BreadcrumbItem","Carousel","Checkbox","CheckboxGroup","CheckboxLabel","Chip","ChipGroup","ChipLabel","Code","Component","Counter","Display","Divider","Drawer","Dropdown","DropdownOverlay","DropdownFooter","DropdownHeader","FileUpload","FileUploadItem","FileUploadLabel","Icon","IconButton","Indicator","Link","List","ListItem","ListItemCode","ListItemLink","ListItemText","OTPInput","PasswordInput","TextArea","TextInput","Toast","ToastContainer","ProgressBar","Radio","RadioGroup","RadioLabel","SkipNav","Spinner","SelectInput","Tag","Tooltip","TooltipInteractiveWrapper","Tabs","TabList","TabItem","TabPanel","TabIndicator","Table","TableBody","TableRow","TableCell","TableHeader","TableHeaderRow","TableHeaderCell","TableFooter","TableFooterRow","TableFooterCell","TableElement","TourPopover","TourMask","Popover","PopoverInteractiveWrapper","BottomSheet","BottomSheetBody","BottomSheetHeader","BottomSheetFooter","BottomSheetGrabHandle","Card","CardBody","CardHeader","CardFooter","Collapsible","CollapsibleBody","CollapsibleButton","CollapsibleLink","Modal","ModalBody","ModalHeader","ModalFooter","ModalBackdrop","ModalScrollOverlay","VisuallyHidden","FormLabel","Switch","SwitchLabel","StyledBaseInput","Skeleton"],"mappings":"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"}
1	+ {"version":3,"file":"metaConstants.js","sources":["../../../../../src/utils/metaAttribute/metaConstants.ts"],"sourcesContent":["export const MetaConstants = {\n Accordion: 'accordion',\n AccordionButton: 'accordion-button',\n AccordionItem: 'accordion-item',\n AccordionItemHeader: 'accordion-item-header',\n AccordionItemBody: 'accordion-item-body',\n ActionList: 'action-list',\n ActionListItem: 'action-list-item',\n ActionListSection: 'action-list-section',\n Alert: 'alert',\n Amount: 'amount',\n AutoComplete: 'autocomplete',\n Badge: 'badge',\n Box: 'box',\n BaseBox: 'base-box',\n BaseText: 'base-text',\n Button: 'button',\n ButtonGroup: 'button-group',\n Breadcrumb: 'breadcrumb',\n BreadcrumbItem: 'breadcrumb-item',\n Carousel: 'carousel',\n Checkbox: 'checkbox',\n CheckboxGroup: 'checkbox-group',\n CheckboxLabel: 'checkbox-label',\n Chip: 'chip',\n ChipGroup: 'chip-group',\n ChipLabel: 'chip-label',\n Code: 'code',\n Component: 'blade-component',\n Counter: 'counter',\n Display: 'display',\n Divider: 'divider',\n Drawer: 'drawer',\n Dropdown: 'dropdown',\n DropdownOverlay: 'dropdown-overlay',\n DropdownFooter: 'dropdown-footer',\n DropdownHeader: 'dropdown-header',\n FileUpload: 'file-upload',\n FileUploadItem: 'file-upload-item',\n FileUploadLabel: 'file-upload-label',\n Icon: 'icon',\n IconButton: 'icon-button',\n Indicator: 'indicator',\n Link: 'link',\n List: 'list',\n ListItem: 'list-item',\n ListItemCode: 'list-item-code',\n ListItemLink: 'list-item-link',\n ListItemText: 'list-item-text',\n OTPInput: 'otp-input',\n PasswordInput: 'password-input',\n TextArea: 'textarea',\n TextInput: 'textinput',\n Toast: 'toast',\n ToastContainer: 'toast-container',\n ProgressBar: 'progress-bar',\n Radio: 'radio',\n RadioGroup: 'radio-group',\n RadioLabel: 'radio-label',\n SkipNav: 'skipnav',\n Spinner: 'spinner',\n SelectInput: 'select-input',\n Tag: 'tag',\n Tooltip: 'tooltip',\n TooltipInteractiveWrapper: 'tooltip-interactive-wrapper',\n Tabs: 'tabs',\n TabList: 'tab-list',\n TabItem: 'tab-item',\n TabPanel: 'tab-panel',\n TabIndicator: 'tab-indicator',\n Table: 'table',\n TableBody: 'table-body',\n TableRow: 'table-row',\n TableCell: 'table-cell',\n TableHeader: 'table-header',\n TableHeaderRow: 'table-header-row',\n TableHeaderCell: 'table-header-cell',\n TableFooter: 'table-footer',\n TableFooterRow: 'table-footer-row',\n TableFooterCell: 'table-footer-cell',\n TableElement: 'table-element',\n TourPopover: 'tour-popover',\n TourMask: 'tour-mask',\n Popover: 'popover',\n PopoverInteractiveWrapper: 'popover-interactive-wrapper',\n BottomSheet: 'bottom-sheet',\n BottomSheetBody: 'bottom-sheet-body',\n BottomSheetHeader: 'bottom-sheet-header',\n BottomSheetFooter: 'bottom-sheet-footer',\n BottomSheetGrabHandle: 'bottomsheet-grab-handle',\n Card: 'card',\n CardBody: 'card-body',\n CardHeader: 'card-header',\n CardFooter: 'card-footer',\n Collapsible: 'collapsible',\n CollapsibleBody: 'collapsible-body',\n CollapsibleButton: 'collapsible-button',\n CollapsibleLink: 'collapsible-link',\n Modal: 'modal',\n ModalBody: 'modal-body',\n ModalHeader: 'modal-header',\n ModalFooter: 'modal-footer',\n ModalBackdrop: 'modal-backdrop',\n ModalScrollOverlay: 'modal-scroll-overlay',\n VisuallyHidden: 'visually-hidden',\n FormLabel: 'form-label',\n Switch: 'switch',\n SwitchLabel: 'switch-label',\n StyledBaseInput: 'styled-base-input',\n Skeleton: 'skeleton',\n} as const;\n"],"names":["MetaConstants","Accordion","AccordionButton","AccordionItem","AccordionItemHeader","AccordionItemBody","ActionList","ActionListItem","ActionListSection","Alert","Amount","AutoComplete","Badge","Box","BaseBox","BaseText","Button","ButtonGroup","Breadcrumb","BreadcrumbItem","Carousel","Checkbox","CheckboxGroup","CheckboxLabel","Chip","ChipGroup","ChipLabel","Code","Component","Counter","Display","Divider","Drawer","Dropdown","DropdownOverlay","DropdownFooter","DropdownHeader","FileUpload","FileUploadItem","FileUploadLabel","Icon","IconButton","Indicator","Link","List","ListItem","ListItemCode","ListItemLink","ListItemText","OTPInput","PasswordInput","TextArea","TextInput","Toast","ToastContainer","ProgressBar","Radio","RadioGroup","RadioLabel","SkipNav","Spinner","SelectInput","Tag","Tooltip","TooltipInteractiveWrapper","Tabs","TabList","TabItem","TabPanel","TabIndicator","Table","TableBody","TableRow","TableCell","TableHeader","TableHeaderRow","TableHeaderCell","TableFooter","TableFooterRow","TableFooterCell","TableElement","TourPopover","TourMask","Popover","PopoverInteractiveWrapper","BottomSheet","BottomSheetBody","BottomSheetHeader","BottomSheetFooter","BottomSheetGrabHandle","Card","CardBody","CardHeader","CardFooter","Collapsible","CollapsibleBody","CollapsibleButton","CollapsibleLink","Modal","ModalBody","ModalHeader","ModalFooter","ModalBackdrop","ModalScrollOverlay","VisuallyHidden","FormLabel","Switch","SwitchLabel","StyledBaseInput","Skeleton"],"mappings":"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"}

package/build/lib/web/development/components/Accordion/Accordion.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
 import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
-import { useState, useCallback, useMemo, Children, cloneElement } from 'react';
+import { useState, Children, useCallback, useMemo, cloneElement } from 'react';
 import { AccordionContext } from './AccordionContext.js';
 import { MAX_WIDTH } from './styles.web.js';
 import '../Box/BaseBox/index.js';
@@ -17,7 +17,7 @@ import { metaAttribute } from '../../utils/metaAttribute/metaAttribute.web.js';
 import { MetaConstants } from '../../utils/metaAttribute/metaConstants.js';
 import { getStyledProps } from '../Box/styledProps/getStyledProps.js';
-var _excluded = ["defaultExpandedIndex", "expandedIndex", "onExpandChange", "showNumberPrefix", "children", "testID"];
+var _excluded = ["defaultExpandedIndex", "expandedIndex", "onExpandChange", "showNumberPrefix", "children", "variant", "size", "testID"];
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var MIN_WIDTH = {
@@ -25,6 +25,49 @@ var MIN_WIDTH = {
   m: makeSize(size[360]),
   l: makeSize(size[360])
 };
+var getVariantStyles = function getVariantStyles(variant) {
+  if (variant === 'transparent') {
+    return {};
+  }
+  return {
+    backgroundColor: 'surface.background.gray.intense',
+    borderRadius: 'medium',
+    borderWidth: 'thinner',
+    borderColor: 'surface.border.gray.subtle'
+  };
+};
+/**
+ * # Accordion
+ *
+ * An accordion is used to allow users to toggle between different content sections in a compact vertical stack.
+ *
+ * ## Usage
+ *
+ * ```jsx
+ * <Accordion>
+ *  <AccordionItem>
+ *    <AccordionItemHeader title="Title" />
+ *    <AccordionItemBody>
+ *      <Text color="surface.text.gray.subtle">
+ *        Hello this is accordion body content
+ *        </Text>
+ *     </AccordionItemBody>
+ *  </AccordionItem>
+ *  <AccordionItem>
+ *    <AccordionItemHeader title="Title" />
+ *    <AccordionItemBody>
+ *      <Text color="surface.text.gray.subtle">
+ *         Hello this is accordion body content
+ *      </Text>
+ *    </AccordionItemBody>
+ *  </AccordionItem>
+ * </Accordion>
+ * ```
+ *
+ * Checkout https://blade.razorpay.com/?path=/docs/components-accordion--docs
+ *
+ */
 var Accordion = function Accordion(_ref) {
   var defaultExpandedIndex = _ref.defaultExpandedIndex,
     expandedIndex = _ref.expandedIndex,
@@ -32,12 +75,17 @@ var Accordion = function Accordion(_ref) {
     _ref$showNumberPrefix = _ref.showNumberPrefix,
     showNumberPrefix = _ref$showNumberPrefix === void 0 ? false : _ref$showNumberPrefix,
     children = _ref.children,
+    _ref$variant = _ref.variant,
+    variant = _ref$variant === void 0 ? 'transparent' : _ref$variant,
+    _ref$size = _ref.size,
+    size = _ref$size === void 0 ? 'large' : _ref$size,
     testID = _ref.testID,
     styledProps = _objectWithoutProperties(_ref, _excluded);
   var _useState = useState(defaultExpandedIndex),
     _useState2 = _slicedToArray(_useState, 2),
     expandedAccordionItemIndex = _useState2[0],
     setExpandedAccordionItemIndex = _useState2[1];
+  var numberOfItems = Children.count(children);
   var handleExpandChange = useCallback(function (nextExpandedIndex) {
     if (typeof expandedIndex !== 'undefined') {
       // controlled
@@ -57,16 +105,19 @@ var Accordion = function Accordion(_ref) {
       expandedIndex: expandedIndex !== null && expandedIndex !== void 0 ? expandedIndex : expandedAccordionItemIndex,
       defaultExpandedIndex: defaultExpandedIndex,
       onExpandChange: handleExpandChange,
-      showNumberPrefix: showNumberPrefix
+      showNumberPrefix: showNumberPrefix,
+      variant: variant,
+      numberOfItems: numberOfItems,
+      size: size
     };
-  }, [expandedAccordionItemIndex, handleExpandChange, expandedIndex, showNumberPrefix, defaultExpandedIndex]);
+  }, [expandedAccordionItemIndex, handleExpandChange, expandedIndex, showNumberPrefix, defaultExpandedIndex, variant, numberOfItems, size]);
   return /*#__PURE__*/jsx(AccordionContext.Provider, {
     value: accordionContext,
     children: /*#__PURE__*/jsx(BaseBox, _objectSpread(_objectSpread(_objectSpread({}, metaAttribute({
       name: MetaConstants.Accordion,
       testID: testID
     })), getStyledProps(styledProps)), {}, {
-      children: /*#__PURE__*/jsx(BaseBox, {
+      children: /*#__PURE__*/jsx(BaseBox, _objectSpread(_objectSpread({}, getVariantStyles(variant)), {}, {
         minWidth: MIN_WIDTH,
         maxWidth: MAX_WIDTH,
         width: "100%",
@@ -76,7 +127,7 @@ var Accordion = function Accordion(_ref) {
             key: index
           });
         })
-      })
+      }))
     }))
   });
 };

package/build/lib/web/development/components/Accordion/Accordion.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Accordion.js","sources":["../../../../../../src/components/Accordion/Accordion.tsx"],"sourcesContent":["import type { ReactElement } from 'react';\nimport { useCallback, useMemo, useState, cloneElement, Children } from 'react';\nimport type { AccordionContextState } from './AccordionContext';\nimport { AccordionContext } from './AccordionContext';\nimport { MAX_WIDTH } from './styles';\nimport { ~~BaseBox~~ } from '~~~components/Box/BaseBox~~';\nimport ~~type~~ { ~~StyledPropsBlade~~ } from '~components/Box/~~styledProps~~';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport type { BoxProps } from '~components/Box';\nimport { size } from '~tokens/global';\nimport ~~type~~ { ~~TestID } from '~utils/types';\nimport {~~ makeSize } from '~utils';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\n\~~ntype~~ ~~AccordionProps~~ = {\n ~~/*\~~n ~~Makes~~ ~~the~~ ~~passed~~ ~~item~~ ~~index~~ ~~expanded~~ by ~~default~~ (~~uncontrolled~~)\n /\n defaultExpandedIndex?: ~~number~~;\n\n ~~/\~~n ~~Expands~~ ~~the~~ ~~passed~~ ~~index (controlled), `-1` implies no expanded items\~~n /\n ~~expandedIndex?: number~~;\n\n /\n ~~Callback~~ ~~for~~ ~~change~~ in ~~any~~ ~~item's~~ ~~expanded~~ state,\n * ~~`-1`~~ ~~implies~~ no ~~expanded~~ ~~items\n /\n onExpandChange?:~~ ({ ~~expandedIndex~~ }: { ~~expandedIndex:~~ ~~number~~ }) => ~~void;\~~n\n ~~/\~~n ~~Adds~~ ~~numeric~~ ~~index~~ at ~~the~~ ~~beginning~~ of ~~items~~\n \n ~~@default~~ ~~false~~\n /\n ~~showNumberPrefix?:~~ ~~boolean;\~~n\n ~~/\~~n ~~Accepts~~ ~~`AccordionItem`~~ ~~child~~ ~~nodes~~\n */\n children: ~~ReactElement~~ \| ~~ReactElement[];\~~n} & ~~TestID~~ ~~&\n~~ ~~StyledPropsBlade;\~~n~~\nconst~~ ~~MIN_WIDTH:~~ ~~BoxProps['minWidth']~~ = {\n s: ~~makeSize(size[200]),\~~n m: ~~makeSize(size[360]),\~~n l: ~~makeSize(size[360]),\~~n~~};\n\~~nconst Accordion = ({\n defaultExpandedIndex,\n expandedIndex,\n onExpandChange,\n showNumberPrefix = false,\n children,\n testID,\n ...styledProps\n}: AccordionProps): ReactElement => {\n const [expandedAccordionItemIndex, setExpandedAccordionItemIndex] = useState<number \| undefined>(\n defaultExpandedIndex,\n );\n\n const handleExpandChange = useCallback(\n (nextExpandedIndex: number) => {\n if (typeof expandedIndex !== 'undefined') {\n // controlled\n onExpandChange?.({ expandedIndex: nextExpandedIndex });\n } else {\n // uncontrolled\n setExpandedAccordionItemIndex(nextExpandedIndex);\n onExpandChange?.({ expandedIndex: nextExpandedIndex });\n }\n },\n [onExpandChange, expandedIndex],\n );\n\n const accordionContext = useMemo<AccordionContextState>(\n () => ({\n expandedIndex: expandedIndex ?? expandedAccordionItemIndex,\n defaultExpandedIndex,\n onExpandChange: handleExpandChange,\n showNumberPrefix,\n }),\n [\n expandedAccordionItemIndex,\n handleExpandChange,\n expandedIndex,\n showNumberPrefix,\n defaultExpandedIndex,\n ],\n );\n\n return (\n <AccordionContext.Provider value={accordionContext}>\n <BaseBox\n {...metaAttribute({ name: MetaConstants.Accordion, testID })}\n {...getStyledProps(styledProps)}\n >\n <BaseBox minWidth={MIN_WIDTH} maxWidth={MAX_WIDTH} width=\"100%\">\n {Children.map(children, (child, index) =>\n cloneElement(child, { _index: index, key: index }),\n )}\n </BaseBox>\n </BaseBox>\n </AccordionContext.Provider>\n );\n};\n\nexport ~~type~~ { ~~AccordionProps };\nexport {~~ Accordion };\n"],"names":["MIN_WIDTH","s","makeSize","~~size~~","m","l","Accordion","_ref","defaultExpandedIndex","expandedIndex","onExpandChange","_ref$showNumberPrefix","showNumberPrefix","children","testID","styledProps","_objectWithoutProperties","_excluded","_useState","useState","_useState2","_slicedToArray","expandedAccordionItemIndex","setExpandedAccordionItemIndex","handleExpandChange","useCallback","nextExpandedIndex","accordionContext","useMemo","_jsx","AccordionContext","Provider","value","BaseBox","_objectSpread","metaAttribute","name","MetaConstants","getStyledProps","minWidth","maxWidth","MAX_WIDTH","width","~~Children","~~map","child","index","cloneElement","_index","key"],"mappings":";;;;;;;;;;;;;;;;;;;;;;~~AA6CA~~,IAAMA,SAA+B,GAAG;AACtCC,EAAAA,CAAC,EAAEC,QAAQ,CAACC,~~IAAI~~,CAAC,GAAG,CAAC,CAAC;~~AACtBC~~,EAAAA,CAAC,EAAEF,QAAQ,CAACC,~~IAAI~~,CAAC,GAAG,CAAC,CAAC;~~AACtBE~~,EAAAA,CAAC,EAAEH,QAAQ,CAACC,~~IAAI~~,CAAC,GAAG,CAAC,CAAA;~~AACvB~~,CAAC,CAAA;AAED,IAAMG,SAAS,GAAG,SAAZA,SAASA,CAAAC,IAAA,~~EAQqB~~;AAAA,EAAA,~~IAPlCC~~,oBAAoB,GAAAD,IAAA,CAApBC,oBAAoB;IACpBC,aAAa,GAAAF,IAAA,CAAbE,aAAa;IACbC,cAAc,GAAAH,IAAA,CAAdG,cAAc;IAAAC,qBAAA,GAAAJ,IAAA,CACdK,gBAAgB;AAAhBA,IAAAA,gBAAgB,GAAAD,qBAAA,KAAG,KAAA,CAAA,GAAA,KAAK,GAAAA,qBAAA;IACxBE,QAAQ,GAAAN,IAAA,CAARM,QAAQ;~~IACRC~~,~~MAAM~~,GAAAP,IAAA,~~CAANO~~,MAAM;AACHC,IAAAA,WAAW,GAAAC,wBAAA,~~CAAAT~~,IAAA,~~EAAAU~~,SAAA,CAAA,CAAA;AAEd,EAAA,IAAAC,SAAA,GAAoEC,QAAQ,~~CAC1EX~~,oBACF,CAAC;~~IAAAY~~,UAAA,GAAAC,cAAA,CAAAH,SAAA,EAAA,CAAA,CAAA;AAFMI,IAAAA,0BAA0B,GAAAF,UAAA,CAAA,CAAA,CAAA;AAAEG,IAAAA,6BAA6B,GAAAH,UAAA,CAAA,CAAA,CAAA,CAAA;AAIhE,EAAA,IAAMI,kBAAkB,GAAGC,WAAW,CACpC,UAACC,iBAAyB,EAAK;AAC7B,IAAA,IAAI,~~OAAOjB~~,aAAa,KAAK,WAAW,EAAE;AACxC;AACAC,MAAAA,cAAc,KAAdA,IAAAA,IAAAA,cAAc,KAAdA,KAAAA,CAAAA,GAAAA,KAAAA,CAAAA,GAAAA,cAAc,CAAG;AAAED,QAAAA,aAAa,~~EAAEiB~~,iBAAAA;AAAkB,OAAC,CAAC,CAAA;AACxD,KAAC,MAAM;AACL;~~MACAH~~,6BAA6B,~~CAACG~~,iBAAiB,CAAC,CAAA;~~AAChDhB~~,MAAAA,cAAc,KAAdA,IAAAA,IAAAA,cAAc,KAAdA,KAAAA,CAAAA,GAAAA,KAAAA,CAAAA,GAAAA,cAAc,CAAG;AAAED,QAAAA,aAAa,~~EAAEiB~~,iBAAAA;AAAkB,OAAC,CAAC,CAAA;AACxD,KAAA;AACF,GAAC,EACD,~~CAAChB~~,cAAc,EAAED,aAAa,CAChC,CAAC,CAAA;EAED,~~IAAMkB~~,gBAAgB,GAAGC,OAAO,CAC9B,YAAA;IAAA,OAAO;~~AACLnB~~,MAAAA,aAAa,EAAEA,aAAa,KAAA,IAAA,IAAbA,aAAa,KAAbA,KAAAA,CAAAA,GAAAA,aAAa,~~GAAIa~~,0BAA0B;~~AAC1Dd~~,MAAAA,oBAAoB,EAApBA,oBAAoB;AACpBE,MAAAA,cAAc,~~EAAEc~~,kBAAkB;~~AAClCZ~~,MAAAA,gBAAgB,EAAhBA,~~gBAAAA~~;KACD,CAAA;AAAA,GAAC,EACF,~~CACEU~~,0BAA0B,~~EAC1BE~~,kBAAkB,~~EAClBf~~,aAAa,EACbG,gBAAgB,EAChBJ,oBAAoB,~~CAExB~~,CAAC,CAAA;AAED,EAAA,~~oBACEqB~~,GAAA,CAACC,gBAAgB,CAACC,QAAQ,EAAA;AAACC,IAAAA,KAAK,EAAEL,gBAAiB;~~AAAAd~~,IAAAA,QAAA,~~eACjDgB~~,GAAA,CAACI,OAAO,EAAAC,aAAA,CAAAA,aAAA,CAAAA,aAAA,CACFC,EAAAA,EAAAA,aAAa,CAAC;MAAEC,IAAI,EAAEC,aAAa,~~CAAC/B~~,SAAS;~~AAAEQ~~,MAAAA,MAAM,EAANA,MAAAA;AAAO,KAAC,CAAC,CAAA,~~EACxDwB~~,cAAc,~~CAACvB~~,WAAW,CAAC,CAAA,EAAA,EAAA,EAAA;~~MAAAF~~,QAAA,eAE/~~BgB~~,GAAA,CAACI,OAAO,EAAA;~~AAACM~~,QAAAA,QAAQ,~~EAAEvC~~,SAAU;~~AAACwC~~,QAAAA,QAAQ,EAAEC,SAAU;~~AAACC~~,QAAAA,KAAK,EAAC,MAAM;~~QAAA7B~~,QAAA,~~EAC5D8B~~,QAAQ,~~CAACC~~,GAAG,~~CAAC/B~~,QAAQ,EAAE,~~UAACgC~~,KAAK,EAAEC,KAAK,EAAA;UAAA,oBACnCC,YAAY,CAACF,KAAK,EAAE;AAAEG,YAAAA,MAAM,EAAEF,KAAK;AAAEG,YAAAA,GAAG,EAAEH,KAAAA;AAAM,WAAC,CAAC,CAAA;SACpD,CAAA;OACO,CAAA;KACF,CAAA,CAAA;AAAC,GACe,CAAC,CAAA;AAEhC;;;;"}
1	+ {"version":3,"file":"Accordion.js","sources":["../../../../../../src/components/Accordion/Accordion.tsx"],"sourcesContent":["import type { ReactElement } from 'react';\nimport { useCallback, useMemo, useState, cloneElement, Children } from 'react';\nimport type { AccordionContextState } from './AccordionContext';\nimport { AccordionContext } from './AccordionContext';\nimport { MAX_WIDTH } from './styles';\nimport type { AccordionProps } from './types';\nimport { BaseBox } from '~components/Box/BaseBox';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport type { BoxProps } from '~components/Box';\nimport { size as sizeTokens } from '~tokens/global';\nimport { makeSize } from '~utils';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\n\nconst MIN_WIDTH: BoxProps['minWidth'] = {\n s: makeSize(sizeTokens[200]),\n m: makeSize(sizeTokens[360]),\n l: makeSize(sizeTokens[360]),\n};\n\nconst getVariantStyles = (variant: AccordionProps['variant']): BoxProps => {\n if (variant === 'transparent') {\n return {};\n }\n\n return {\n backgroundColor: 'surface.background.gray.intense',\n borderRadius: 'medium',\n borderWidth: 'thinner',\n borderColor: 'surface.border.gray.subtle',\n };\n};\n\n/*\n # Accordion\n \n An accordion is used to allow users to toggle between different content sections in a compact vertical stack.\n \n ## Usage\n \n ```jsx\n * <Accordion>\n * <AccordionItem>\n * <AccordionItemHeader title=\"Title\" />\n * <AccordionItemBody>\n * <Text color=\"surface.text.gray.subtle\">\n * Hello this is accordion body content\n * </Text>\n * </AccordionItemBody>\n * </AccordionItem>\n * <AccordionItem>\n * <AccordionItemHeader title=\"Title\" />\n * <AccordionItemBody>\n * <Text color=\"surface.text.gray.subtle\">\n * Hello this is accordion body content\n * </Text>\n * </AccordionItemBody>\n * </AccordionItem>\n * </Accordion>\n * ```\n \n Checkout https://blade.razorpay.com/?path=/docs/components-accordion--docs\n \n /\nconst Accordion = ({\n defaultExpandedIndex,\n expandedIndex,\n onExpandChange,\n showNumberPrefix = false,\n children,\n variant = 'transparent',\n size = 'large',\n testID,\n ...styledProps\n}: AccordionProps): ReactElement => {\n const [expandedAccordionItemIndex, setExpandedAccordionItemIndex] = useState<number \| undefined>(\n defaultExpandedIndex,\n );\n\n const numberOfItems = Children.count(children);\n\n const handleExpandChange = useCallback(\n (nextExpandedIndex: number) => {\n if (typeof expandedIndex !== 'undefined') {\n // controlled\n onExpandChange?.({ expandedIndex: nextExpandedIndex });\n } else {\n // uncontrolled\n setExpandedAccordionItemIndex(nextExpandedIndex);\n onExpandChange?.({ expandedIndex: nextExpandedIndex });\n }\n },\n [onExpandChange, expandedIndex],\n );\n\n const accordionContext = useMemo<AccordionContextState>(\n () => ({\n expandedIndex: expandedIndex ?? expandedAccordionItemIndex,\n defaultExpandedIndex,\n onExpandChange: handleExpandChange,\n showNumberPrefix,\n variant,\n numberOfItems,\n size,\n }),\n [\n expandedAccordionItemIndex,\n handleExpandChange,\n expandedIndex,\n showNumberPrefix,\n defaultExpandedIndex,\n variant,\n numberOfItems,\n size,\n ],\n );\n\n return (\n <AccordionContext.Provider value={accordionContext}>\n <BaseBox\n {...metaAttribute({ name: MetaConstants.Accordion, testID })}\n {...getStyledProps(styledProps)}\n >\n <BaseBox\n {...getVariantStyles(variant)}\n minWidth={MIN_WIDTH}\n maxWidth={MAX_WIDTH}\n width=\"100%\"\n >\n {Children.map(children, (child, index) =>\n cloneElement(child, { _index: index, key: index }),\n )}\n </BaseBox>\n </BaseBox>\n </AccordionContext.Provider>\n );\n};\n\nexport { Accordion };\n"],"names":["MIN_WIDTH","s","makeSize","sizeTokens","m","l","getVariantStyles","variant","backgroundColor","borderRadius","borderWidth","borderColor","Accordion","_ref","defaultExpandedIndex","expandedIndex","onExpandChange","_ref$showNumberPrefix","showNumberPrefix","children","_ref$variant","_ref$size","size","testID","styledProps","_objectWithoutProperties","_excluded","_useState","useState","_useState2","_slicedToArray","expandedAccordionItemIndex","setExpandedAccordionItemIndex","numberOfItems","Children","count","handleExpandChange","useCallback","nextExpandedIndex","accordionContext","useMemo","_jsx","AccordionContext","Provider","value","BaseBox","_objectSpread","metaAttribute","name","MetaConstants","getStyledProps","minWidth","maxWidth","MAX_WIDTH","width","map","child","index","cloneElement","_index","key"],"mappings":"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"}

package/build/lib/web/development/components/Accordion/AccordionButton.web.js CHANGED Viewed

@@ -1,11 +1,11 @@
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import { StyledAccordionButton } from './StyledAccordionButton.web.js';
 import { useAccordion } from './AccordionContext.js';
+import { AccordionItemHeader } from './AccordionItemHeader.js';
 import '../Box/BaseBox/index.js';
 import '../../utils/metaAttribute/index.js';
 import '../Typography/index.js';
 import { useCollapsible } from '../Collapsible/CollapsibleContext.js';
-import { CollapsibleChevronIcon } from '../Collapsible/CollapsibleChevronIcon.web.js';
 import '../../utils/makeAccessible/index.js';
 import '../../utils/assignWithoutSideEffects/index.js';
 import '../../utils/logger/index.js';
@@ -23,31 +23,37 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 var _AccordionButton = function _AccordionButton(_ref) {
   var index = _ref.index,
     Icon = _ref.icon,
-    children = _ref.children;
+    title = _ref.title,
+    isDeprecatedAPI = _ref.isDeprecatedAPI,
+    header = _ref.header,
+    isDisabled = _ref.isDisabled;
   var _useCollapsible = useCollapsible(),
     onExpandChange = _useCollapsible.onExpandChange,
     isExpanded = _useCollapsible.isExpanded,
     collapsibleBodyId = _useCollapsible.collapsibleBodyId;
   var _useAccordion = useAccordion(),
     showNumberPrefix = _useAccordion.showNumberPrefix,
-    expandedIndex = _useAccordion.expandedIndex;
+    expandedIndex = _useAccordion.expandedIndex,
+    size = _useAccordion.size;
   var toggleCollapse = function toggleCollapse() {
     return onExpandChange(!isExpanded);
   };
   var onClick = function onClick() {
     return toggleCollapse();
   };
-  var _index = typeof index === 'number' && showNumberPrefix ? /*#__PURE__*/jsxs(Text, {
-    size: "large",
+  var _index = typeof index === 'number' && showNumberPrefix ?
+  /*#__PURE__*/
+  // we have to add -2px margin to align the number with title of BaseHeader
+  jsxs(Text, {
+    size: size,
     weight: "semibold",
-    marginRight: "spacing.2",
+    marginTop: "-2px",
     as: "span",
     children: [index + 1, "."]
   }) : null;
   var _icon = Icon && /*#__PURE__*/jsx(Icon, {
-    size: "medium",
-    color: "surface.icon.gray.muted",
-    marginRight: "spacing.3",
+    size: size,
+    color: "surface.icon.gray.normal",
     marginY: "spacing.2"
   });
   if (true) {
@@ -66,8 +72,9 @@ var _AccordionButton = function _AccordionButton(_ref) {
     level: 3
   })), {}, {
     width: "100%",
-    children: /*#__PURE__*/jsxs(StyledAccordionButton, _objectSpread(_objectSpread(_objectSpread({
+    children: /*#__PURE__*/jsx(StyledAccordionButton, _objectSpread(_objectSpread(_objectSpread({
       isExpanded: isItemExpanded,
+      disabled: isDisabled,
       onClick: onClick
     }, makeAccessible({
       expanded: isItemExpanded,
@@ -75,21 +82,10 @@ var _AccordionButton = function _AccordionButton(_ref) {
     })), metaAttribute({
       name: MetaConstants.AccordionButton
     })), {}, {
-      children: [/*#__PURE__*/jsxs(BaseBox, {
-        display: "flex",
-        flexDirection: "row",
-        alignItems: "flex-start",
-        marginRight: "spacing.4",
-        children: [_index, _icon, /*#__PURE__*/jsx(Text, {
-          size: "large",
-          weight: "semibold",
-          as: "span",
-          children: children
-        })]
-      }), /*#__PURE__*/jsx(CollapsibleChevronIcon, {
-        color: "currentColor",
-        size: "large"
-      })]
+      children: isDeprecatedAPI ? /*#__PURE__*/jsx(AccordionItemHeader, {
+        title: title,
+        leading: _icon !== null && _icon !== void 0 ? _icon : _index
+      }) : header
     }))
   }));
 };

package/build/lib/web/development/components/Accordion/AccordionButton.web.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AccordionButton.web.js","sources":["../../../../../../src/components/Accordion/AccordionButton.web.tsx"],"sourcesContent":["import type { ReactElement } from 'react';\nimport { StyledAccordionButton } from './StyledAccordionButton';\nimport type { AccordionButtonProps } from './types';\nimport { useAccordion } from './AccordionContext';\nimport { BaseBox } from '~components/Box/BaseBox';\nimport { MetaConstants, metaAttribute } from '~utils/metaAttribute';\nimport { Text } from '~components/Typography';\nimport { useCollapsible } from '~components/Collapsible/CollapsibleContext';\nimport { ~~CollapsibleChevronIcon } from '~components/Collapsible/CollapsibleChevronIcon';\nimport {~~ makeAccessible } from '~utils/makeAccessible';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport { throwBladeError } from '~utils/logger';\n\nconst _AccordionButton = ({ index, icon: Icon~~, children~~ }: AccordionButtonProps): ReactElement => {\n const { onExpandChange, isExpanded, collapsibleBodyId } = useCollapsible();\n const { showNumberPrefix, expandedIndex } = useAccordion();\n\n const toggleCollapse = (): void => onExpandChange(!isExpanded);\n const onClick = (): void => toggleCollapse();\n\n const _index =\n typeof index === 'number' && showNumberPrefix ? (\n <Text size~~=\"large\"~~ weight=\"semibold\" ~~marginRight~~=\"~~spacing.2~~\" as=\"span\">\n {index + 1}.\n </Text>\n ) : null;\n\n const _icon = Icon && ~~(\n~~ <Icon\n size~~=\"medium\"\n~~ color=\"surface.icon.gray.~~muted~~\"~~\n marginRight=\"spacing.3\"\n~~ marginY=\"spacing.2\"\n ~~/>\n );\n~~\n if (__DEV__) {\n if (_index && _icon) {\n throwBladeError({\n message: \"showNumberPrefix and icon shouldn't be used together\",\n moduleName: 'Accordion',\n });\n }\n }\n\n const isItemExpanded = expandedIndex === index;\n\n return (\n <BaseBox\n // a11y guidelines suggest having an apt heading surround a button but heading level is hardcoded here\n {...makeAccessible({ role: 'heading', level: 3 })}\n width=\"100%\"\n >\n <StyledAccordionButton\n isExpanded={isItemExpanded}\n onClick={onClick}\n {...makeAccessible({ expanded: isItemExpanded, controls: collapsibleBodyId })}\n {...metaAttribute({ name: MetaConstants.AccordionButton })}\n >\n ~~<BaseBox~~ ~~display=\"flex\"~~ ~~flexDirection=\"row\"~~ ~~alignItems=\"flex-start\" marginRight=\"spacing.4\">\n~~ {~~_index~~}\n {_icon}~~\n <Text~~ ~~size=\"large\"~~ ~~weight=\"semibold\"~~ ~~as=\"span\">\n {children~~}\n ~~</Text>\n </BaseBox>\n <CollapsibleChevronIcon color=\"currentColor\" size=\"large\" />\n~~ </StyledAccordionButton>\n </BaseBox>\n );\n};\n\nconst AccordionButton = assignWithoutSideEffects(_AccordionButton, {\n componentId: MetaConstants.AccordionButton,\n});\n\nexport type { AccordionButtonProps };\nexport { AccordionButton };\n"],"names":["_AccordionButton","_ref","index","Icon","icon","~~children~~","_useCollapsible","useCollapsible","onExpandChange","isExpanded","collapsibleBodyId","_useAccordion","useAccordion","showNumberPrefix","expandedIndex","toggleCollapse","onClick","_index","_jsxs","Text","~~size~~","~~weight~~","~~marginRight~~","as","_icon","_jsx","color","marginY","throwBladeError","message","moduleName","isItemExpanded","BaseBox","_objectSpread","makeAccessible","role","level","width","StyledAccordionButton","expanded","controls","metaAttribute","name","MetaConstants","AccordionButton","~~display~~","~~flexDirection~~","~~alignItems","CollapsibleChevronIcon","~~assignWithoutSideEffects","componentId"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAaA,IAAMA,gBAAgB,GAAG,SAAnBA,gBAAgBA,CAAAC,IAAA,~~EAA4E~~;AAAA,EAAA,~~IAAtEC~~,KAAK,GAAAD,IAAA,CAALC,KAAK;~~IAAQC~~,IAAI,GAAAF,IAAA,CAAVG,IAAI;~~IAAQC~~,~~QAAQ~~,GAAAJ,IAAA,~~CAARI~~,~~QAAQ~~,CAAA;~~AACrD~~,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;AACrD,EAAA,IAAAC,aAAA,~~GAA4CC~~,YAAY,EAAE;~~IAAlDC~~,gBAAgB,GAAAF,aAAA,CAAhBE,gBAAgB;IAAEC,aAAa,GAAAH,aAAA,CAAbG,aAAa,CAAA;~~AAEvC~~,EAAA,IAAMC,cAAc,GAAG,SAAjBA,cAAcA,GAAA;AAAA,IAAA,~~OAAeP~~,cAAc,CAAC,CAACC,UAAU,CAAC,CAAA;AAAA,GAAA,CAAA;AAC9D,EAAA,~~IAAMO~~,OAAO,GAAG,SAAVA,OAAOA,GAAA;IAAA,OAAeD,cAAc,EAAE,CAAA;AAAA,GAAA,CAAA;~~EAE5C~~,IAAME,MAAM,GACV,~~OAAOf~~,KAAK,KAAK,QAAQ,~~IAAIW~~,gBAAgB,~~gBAC3CK~~,IAAA,CAACC,IAAI,EAAA;~~AAACC~~,IAAAA,IAAI,~~EAAC~~,~~OAAO~~;~~AAACC~~,IAAAA,MAAM,EAAC,UAAU;AAACC,IAAAA,~~WAAW~~,EAAC,~~WAAW~~;AAACC,IAAAA,EAAE,EAAC,MAAM;~~AAAAlB~~,IAAAA,QAAA,~~EACnEH~~,CAAAA,KAAK,GAAG,CAAC,EAAC,GACb,CAAA;GAAM,CAAC,GACL,IAAI,CAAA;AAEV,EAAA,~~IAAMsB~~,KAAK,~~GAAGrB~~,IAAI,~~iBAChBsB~~,GAAA,~~CAACtB~~,IAAI,EAAA;~~AACHiB~~,IAAAA,IAAI,~~EAAC~~,~~QAAQ~~;~~AACbM~~,IAAAA,KAAK,EAAC,~~yBAAyB~~;~~AAC/BJ~~,IAAAA,~~WAAW,EAAC,WAAW;AACvBK,IAAAA,~~OAAO,EAAC,WAAA;AAAW,~~GACpB~~,~~CACF~~,CAAA;~~AAED~~,EAAA,IAAI,IAAO,EAAE;IACX,IAAIV,MAAM,IAAIO,KAAK,EAAE;AACnBI,MAAAA,eAAe,CAAC;AACdC,QAAAA,OAAO,EAAE,sDAAsD;AAC/DC,QAAAA,UAAU,EAAE,WAAA;AACd,OAAC,CAAC,CAAA;AACJ,KAAA;AACF,GAAA;AAEA,EAAA,IAAMC,cAAc,~~GAAGjB~~,aAAa,~~KAAKZ~~,KAAK,CAAA;AAE9C,EAAA,~~oBACEuB~~,GAAA,CAACO,OAAAA;AACC;AAAA,IAAAC,aAAA,CAAAA,aAAA,CAAA,EAAA,EACIC,cAAc,CAAC;AAAEC,IAAAA,IAAI,EAAE,SAAS;AAAEC,IAAAA,KAAK,EAAE,CAAA;AAAE,GAAC,CAAC,CAAA,EAAA,EAAA,EAAA;AACjDC,IAAAA,KAAK,EAAC,MAAM;~~IAAAhC~~,QAAA,~~eAEZa~~,~~IAAA~~,~~CAACoB~~,qBAAqB,EAAAL,aAAA,CAAAA,aAAA,CAAAA,aAAA,CAAA;~~AACpBxB~~,MAAAA,UAAU,~~EAAEsB~~,cAAe;~~AAC3Bf~~,MAAAA,OAAO,EAAEA,OAAAA;AAAQ,KAAA,EACbkB,cAAc,CAAC;~~AAAEK~~,MAAAA,QAAQ,~~EAAER~~,cAAc;~~AAAES~~,MAAAA,QAAQ,~~EAAE9B~~,iBAAAA;KAAmB,CAAC,~~CACzE+B~~,EAAAA,aAAa,CAAC;MAAEC,IAAI,EAAEC,aAAa,CAACC,eAAAA;AAAgB,KAAC,CAAC,CAAA,EAAA,EAAA,EAAA;~~MAAAvC~~,QAAA,~~EAAA~~,~~cAE1Da~~,~~IAAA~~,~~CAACc~~,~~OAAO~~,EAAA;~~AAACa~~,QAAAA,~~OAAO~~,~~EAAC~~,~~MAAM~~;~~AAACC~~,QAAAA,~~aAAa~~,~~EAAC~~,KAAK~~;AAACC~~,~~QAAAA~~,~~UAAU~~,~~EAAC~~,~~YAAY;AAACzB,QAAAA,WAAW,EAAC,WAAW;AAAAjB,QAAAA,QAAA,GACxFY,MAAM,EACNO,~~KAAK,~~eACNC~~,~~GAAA~~,~~CAACN,IAAI,EAAA;AAACC,UAAAA,IAAI,EAAC,OAAO;AAACC,UAAAA,MAAM,EAAC,UAAU;AAACE,UAAAA,EAAE,EAAC,MAAM;AAAAlB,UAAAA,QAAA,EAC3CA,QAAAA;AAAQ,SACL,CAAC,~~CAAA~~;AAAA~~,~~OACA~~,~~CAAC,eACVoB,GAAA,CAACuB,sBAAsB,EAAA;AAACtB,QAAAA,~~KAAK,~~EAAC~~,~~cAAc~~;~~AAACN,QAAAA,IAAI,EAAC,OAAA;~~AAAO,OAAE,CAAC,~~CAAA~~;~~KACvC~~,CAAA,CAAA;AAAC,GAAA,CACjB,CAAC,CAAA;AAEd,CAAC,CAAA;AAED,~~IAAMwB~~,eAAe,~~gBAAGK~~,wBAAwB,~~CAACjD~~,gBAAgB,EAAE;~~EACjEkD~~,WAAW,~~EAAEP~~,aAAa,CAACC,eAAAA;AAC7B,CAAC;;;;"}
1	+ {"version":3,"file":"AccordionButton.web.js","sources":["../../../../../../src/components/Accordion/AccordionButton.web.tsx"],"sourcesContent":["import type { ReactElement } from 'react';\nimport { StyledAccordionButton } from './StyledAccordionButton';\nimport type { AccordionButtonProps } from './types';\nimport { useAccordion } from './AccordionContext';\nimport { AccordionItemHeader } from './AccordionItemHeader';\nimport { BaseBox } from '~components/Box/BaseBox';\nimport { MetaConstants, metaAttribute } from '~utils/metaAttribute';\nimport { Text } from '~components/Typography';\nimport { useCollapsible } from '~components/Collapsible/CollapsibleContext';\nimport { makeAccessible } from '~utils/makeAccessible';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport { throwBladeError } from '~utils/logger';\n\nconst _AccordionButton = ({\n index,\n icon: Icon,\n title,\n isDeprecatedAPI,\n header,\n isDisabled,\n}: AccordionButtonProps): ReactElement => {\n const { onExpandChange, isExpanded, collapsibleBodyId } = useCollapsible();\n const { showNumberPrefix, expandedIndex, size } = useAccordion();\n\n const toggleCollapse = (): void => onExpandChange(!isExpanded);\n const onClick = (): void => toggleCollapse();\n\n const _index =\n typeof index === 'number' && showNumberPrefix ? (\n // we have to add -2px margin to align the number with title of BaseHeader\n <Text size={size} weight=\"semibold\" marginTop=\"-2px\" as=\"span\">\n {index + 1}.\n </Text>\n ) : null;\n\n const _icon = Icon && <Icon size={size} color=\"surface.icon.gray.normal\" marginY=\"spacing.2\" />;\n\n if (__DEV__) {\n if (_index && _icon) {\n throwBladeError({\n message: \"showNumberPrefix and icon shouldn't be used together\",\n moduleName: 'Accordion',\n });\n }\n }\n\n const isItemExpanded = expandedIndex === index;\n\n return (\n <BaseBox\n // a11y guidelines suggest having an apt heading surround a button but heading level is hardcoded here\n {...makeAccessible({ role: 'heading', level: 3 })}\n width=\"100%\"\n >\n <StyledAccordionButton\n isExpanded={isItemExpanded}\n disabled={isDisabled}\n onClick={onClick}\n {...makeAccessible({ expanded: isItemExpanded, controls: collapsibleBodyId })}\n {...metaAttribute({ name: MetaConstants.AccordionButton })}\n >\n {isDeprecatedAPI ? <AccordionItemHeader title={title} leading={_icon ?? _index} /> : header}\n </StyledAccordionButton>\n </BaseBox>\n );\n};\n\nconst AccordionButton = assignWithoutSideEffects(_AccordionButton, {\n componentId: MetaConstants.AccordionButton,\n});\n\nexport type { AccordionButtonProps };\nexport { AccordionButton };\n"],"names":["_AccordionButton","_ref","index","Icon","icon","title","isDeprecatedAPI","header","isDisabled","_useCollapsible","useCollapsible","onExpandChange","isExpanded","collapsibleBodyId","_useAccordion","useAccordion","showNumberPrefix","expandedIndex","size","toggleCollapse","onClick","_index","_jsxs","Text","weight","marginTop","as","children","_icon","_jsx","color","marginY","throwBladeError","message","moduleName","isItemExpanded","BaseBox","_objectSpread","makeAccessible","role","level","width","StyledAccordionButton","disabled","expanded","controls","metaAttribute","name","MetaConstants","AccordionButton","AccordionItemHeader","leading","assignWithoutSideEffects","componentId"],"mappings":"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"}

package/build/lib/web/development/components/Accordion/AccordionContext.js CHANGED Viewed

@@ -3,6 +3,9 @@ import '../../utils/logger/index.js';
 import { throwBladeError } from '../../utils/logger/logger.js';
 var AccordionContext = /*#__PURE__*/createContext(null);
+var AccordionItemContext = /*#__PURE__*/createContext({
+  index: undefined
+});
 var useAccordion = function useAccordion() {
   var accordionContext = useContext(AccordionContext);
   if (true) {
@@ -15,6 +18,18 @@ var useAccordion = function useAccordion() {
   }
   return accordionContext;
 };
+var useAccordionItemIndex = function useAccordionItemIndex() {
+  var accordionItemContext = useContext(AccordionItemContext);
+  if (true) {
+    if (!accordionItemContext) {
+      throwBladeError({
+        message: 'AccordionItem* components should be only used within AccordionItem',
+        moduleName: 'AccordionContext'
+      });
+    }
+  }
+  return accordionItemContext;
+};
-export { AccordionContext, useAccordion };
+export { AccordionContext, AccordionItemContext, useAccordion, useAccordionItemIndex };
 //# sourceMappingURL=AccordionContext.js.map

package/build/lib/web/development/components/Accordion/AccordionContext.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AccordionContext.js","sources":["../../../../../../src/components/Accordion/AccordionContext.tsx"],"sourcesContent":["import { createContext, useContext } from 'react';\nimport { throwBladeError } from '~utils/logger';\n\ntype AccordionContextState = {\n expandedIndex?: number;\n defaultExpandedIndex?: number;\n onExpandChange: (expandedIndex: number) => void;\n showNumberPrefix: boolean;\n};\n\nconst AccordionContext = createContext<AccordionContextState \| null>(null);\n\nconst useAccordion = (): AccordionContextState => {\n const accordionContext = useContext(AccordionContext);\n if (__DEV__) {\n if (!accordionContext) {\n throwBladeError({\n message: 'useAccordion should be only used within AccordionContext',\n moduleName: 'AccordionContext',\n });\n }\n }\n return accordionContext!;\n};\n\nexport type { AccordionContextState };\nexport { AccordionContext, useAccordion };\n"],"names":["AccordionContext","createContext","useAccordion","accordionContext","useContext","throwBladeError","message","moduleName"],"mappings":";;;;~~AAUA~~,IAAMA,gBAAgB,gBAAGC,aAAa,CAA+B,IAAI,EAAC;~~AAE1E~~,IAAMC,YAAY,GAAG,SAAfA,YAAYA,GAAgC;AAChD,EAAA,IAAMC,gBAAgB,GAAGC,UAAU,~~CAACJ~~,gBAAgB,CAAC,CAAA;AACrD,EAAA,IAAI,IAAO,EAAE;IACX,IAAI,~~CAACG~~,gBAAgB,EAAE;AACrBE,MAAAA,eAAe,CAAC;AACdC,QAAAA,OAAO,EAAE,0DAA0D;AACnEC,QAAAA,UAAU,EAAE,kBAAA;AACd,OAAC,CAAC,CAAA;AACJ,KAAA;AACF,GAAA;AACA,EAAA,OAAOJ,gBAAgB,CAAA;AACzB;;;;"}
1	+ {"version":3,"file":"AccordionContext.js","sources":["../../../../../../src/components/Accordion/AccordionContext.tsx"],"sourcesContent":["import { createContext, useContext } from 'react';\nimport type { AccordionProps } from './types';\nimport { throwBladeError } from '~utils/logger';\n\ntype AccordionContextState = {\n expandedIndex?: number;\n defaultExpandedIndex?: number;\n onExpandChange: (expandedIndex: number) => void;\n showNumberPrefix: boolean;\n variant: AccordionProps['variant'];\n numberOfItems: number;\n size: NonNullable<AccordionProps['size']>;\n};\n\ntype AccordionItemContextState = {\n index?: number;\n isDisabled?: boolean;\n};\n\nconst AccordionContext = createContext<AccordionContextState \| null>(null);\nconst AccordionItemContext = createContext<AccordionItemContextState>({\n index: undefined,\n});\n\nconst useAccordion = (): AccordionContextState => {\n const accordionContext = useContext(AccordionContext);\n if (__DEV__) {\n if (!accordionContext) {\n throwBladeError({\n message: 'useAccordion should be only used within AccordionContext',\n moduleName: 'AccordionContext',\n });\n }\n }\n return accordionContext!;\n};\n\nconst useAccordionItemIndex = (): AccordionItemContextState => {\n const accordionItemContext = useContext(AccordionItemContext);\n if (__DEV__) {\n if (!accordionItemContext) {\n throwBladeError({\n message: 'AccordionItem* components should be only used within AccordionItem',\n moduleName: 'AccordionContext',\n });\n }\n }\n return accordionItemContext;\n};\n\nexport type { AccordionContextState };\nexport { AccordionContext, useAccordion, AccordionItemContext, useAccordionItemIndex };\n"],"names":["AccordionContext","createContext","AccordionItemContext","index","undefined","useAccordion","accordionContext","useContext","throwBladeError","message","moduleName","useAccordionItemIndex","accordionItemContext"],"mappings":";;;;AAmBA,IAAMA,gBAAgB,gBAAGC,aAAa,CAA+B,IAAI,EAAC;AACpEC,IAAAA,oBAAoB,gBAAGD,aAAa,CAA4B;AACpEE,EAAAA,KAAK,EAAEC,SAAAA;AACT,CAAC,EAAC;AAEF,IAAMC,YAAY,GAAG,SAAfA,YAAYA,GAAgC;AAChD,EAAA,IAAMC,gBAAgB,GAAGC,UAAU,CAACP,gBAAgB,CAAC,CAAA;AACrD,EAAA,IAAI,IAAO,EAAE;IACX,IAAI,CAACM,gBAAgB,EAAE;AACrBE,MAAAA,eAAe,CAAC;AACdC,QAAAA,OAAO,EAAE,0DAA0D;AACnEC,QAAAA,UAAU,EAAE,kBAAA;AACd,OAAC,CAAC,CAAA;AACJ,KAAA;AACF,GAAA;AACA,EAAA,OAAOJ,gBAAgB,CAAA;AACzB,EAAC;AAED,IAAMK,qBAAqB,GAAG,SAAxBA,qBAAqBA,GAAoC;AAC7D,EAAA,IAAMC,oBAAoB,GAAGL,UAAU,CAACL,oBAAoB,CAAC,CAAA;AAC7D,EAAA,IAAI,IAAO,EAAE;IACX,IAAI,CAACU,oBAAoB,EAAE;AACzBJ,MAAAA,eAAe,CAAC;AACdC,QAAAA,OAAO,EAAE,oEAAoE;AAC7EC,QAAAA,UAAU,EAAE,kBAAA;AACd,OAAC,CAAC,CAAA;AACJ,KAAA;AACF,GAAA;AACA,EAAA,OAAOE,oBAAoB,CAAA;AAC7B;;;;"}

package/build/lib/web/development/components/Accordion/AccordionItem.js CHANGED Viewed

@@ -1,62 +1,63 @@
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import React__default from 'react';
 import { AccordionButton } from './AccordionButton.web.js';
-import { useAccordion } from './AccordionContext.js';
+import { useAccordion, AccordionItemContext } from './AccordionContext.js';
+import { AccordionItemBody } from './AccordionItemBody.js';
+import { componentIds } from './componentIds.js';
 import '../Divider/index.js';
 import '../Box/BaseBox/index.js';
-import '../Typography/index.js';
 import '../../utils/metaAttribute/index.js';
 import '../../utils/index.js';
 import { Collapsible } from '../Collapsible/Collapsible.js';
 import '../Collapsible/index.js';
-import '../../utils/makeAccessible/index.js';
+import '../../utils/isValidAllowedChildren/index.js';
+import '../../utils/logger/index.js';
 import { jsx, jsxs } from 'react/jsx-runtime';
+import { getComponentId } from '../../utils/isValidAllowedChildren/isValidAllowedChildren.js';
+import { throwBladeError } from '../../utils/logger/logger.js';
 import { BaseBox } from '../Box/BaseBox/BaseBox.web.js';
-import { makeAccessible } from '../../utils/makeAccessible/makeAccessible.web.js';
-import { Text } from '../Typography/Text/Text.js';
-import { isReactNative } from '../../utils/platform/isReactNative.js';
 import { metaAttribute } from '../../utils/metaAttribute/metaAttribute.web.js';
 import { MetaConstants } from '../../utils/metaAttribute/metaConstants.js';
 import { CollapsibleBody } from '../Collapsible/CollapsibleBody.js';
+import { isReactNative } from '../../utils/platform/isReactNative.js';
 import { Divider } from '../Divider/Divider.js';
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-var BLANK_SPACE = ' ';
-/**
- * On React Native if the `AccordionItem` has a lengthy description which renders a `Text` spanning multiple lines,
- * it sometimes messes up the layout calculation (it thinks of multiline as a single line before flowing in the UI).
- * And during the expanding / collapsing animation, text reflows causing words to jump around across lines.
- *
- * Rendering a blank `Text` at the end seems to fix all this 🤯
- */
-var reactNativeMultilineTextOverflowFix =
-/*#__PURE__*/
-// make this hidden from screen readers
-jsx(BaseBox, _objectSpread(_objectSpread({}, makeAccessible({
-  hidden: true
-})), {}, {
-  children: /*#__PURE__*/jsx(Text, {
-    children: BLANK_SPACE
-  })
-}));
 var AccordionItem = function AccordionItem(_ref) {
   var title = _ref.title,
     description = _ref.description,
     icon = _ref.icon,
     children = _ref.children,
+    isDisabled = _ref.isDisabled,
     _index = _ref._index,
     testID = _ref.testID;
   var _useAccordion = useAccordion(),
     expandedIndex = _useAccordion.expandedIndex,
     onExpandChange = _useAccordion.onExpandChange,
-    defaultExpandedIndex = _useAccordion.defaultExpandedIndex;
+    defaultExpandedIndex = _useAccordion.defaultExpandedIndex,
+    variant = _useAccordion.variant,
+    numberOfItems = _useAccordion.numberOfItems;
   var isExpanded = expandedIndex === _index;
   var isDefaultExpanded = defaultExpandedIndex === _index;
-  var _description = description && /*#__PURE__*/jsx(Text, {
-    color: "interactive.text.gray.subtle",
-    children: description
-  });
+  var isDeprecatedAPI = Boolean(title) || Boolean(description) || Boolean(icon);
+  var _React$Children$toArr = React__default.Children.toArray(children),
+    _React$Children$toArr2 = _slicedToArray(_React$Children$toArr, 2),
+    header = _React$Children$toArr2[0],
+    body = _React$Children$toArr2[1];
+  if (!isDeprecatedAPI) {
+    // Only doing validation in new API. Deprecated API allows everything as AccordionItem children
+    var headerComponentId = getComponentId(header);
+    var bodyComponentId = getComponentId(body);
+    if (headerComponentId !== componentIds.AccordionItemHeader && bodyComponentId !== componentIds.AccordionItemBody) {
+      throwBladeError({
+        message: 'AccordionItem only allows AccordionItemHeader as first component and AccordionItemBody as second. Check Accordion documentation',
+        moduleName: 'AccordionItem'
+      });
+    }
+  }
+  var isLastItem = _index !== undefined && _index < numberOfItems - 1;
   var handleExpandChange = function handleExpandChange(_ref2) {
     var isExpanded = _ref2.isExpanded;
     if (isExpanded && typeof _index !== 'undefined') {
@@ -65,43 +66,42 @@ var AccordionItem = function AccordionItem(_ref) {
       onExpandChange(-1);
     }
   };
-  var collapsibleBodyContent = isReactNative() ? /*#__PURE__*/jsxs(BaseBox, {
-    marginX: "spacing.5",
-    children: [_description, /*#__PURE__*/jsx(BaseBox, {
-      marginTop: description && children ? 'spacing.5' : 'spacing.0',
-      children: children
-    }), reactNativeMultilineTextOverflowFix]
-  }) : /*#__PURE__*/jsxs(BaseBox, {
-    display: "flex",
-    flexDirection: "column",
-    gap: "spacing.5",
-    marginBottom: "spacing.5",
-    marginX: "spacing.5",
-    children: [_description, children]
+  return /*#__PURE__*/jsx(AccordionItemContext.Provider, {
+    value: {
+      index: _index,
+      isDisabled: isDisabled
+    },
+    children: /*#__PURE__*/jsxs(BaseBox, _objectSpread(_objectSpread({}, metaAttribute({
+      name: MetaConstants.AccordionItem,
+      testID: testID
+    })), {}, {
+      children: [/*#__PURE__*/jsxs(Collapsible, {
+        isExpanded: isExpanded,
+        defaultIsExpanded: isDefaultExpanded,
+        onExpandChange: handleExpandChange
+        // Accordion has its own width restrictions
+        ,
+        _shouldApplyWidthRestrictions: false,
+        children: [/*#__PURE__*/jsx(AccordionButton, {
+          index: _index,
+          icon: icon,
+          title: title,
+          header: header,
+          isDisabled: isDisabled,
+          isDeprecatedAPI: isDeprecatedAPI
+        }), /*#__PURE__*/jsx(CollapsibleBody
+        // Just React Native things, need this 100% so collapsed content flows correctly inside Accordion
+        // In new API, AccordionItemBody takes 100% width to avoid issues like this - https://github.com/razorpay/blade/pull/1814
+        , {
+          width: isReactNative() || !isDeprecatedAPI ? '100%' : undefined,
+          children: isDeprecatedAPI ? /*#__PURE__*/jsx(AccordionItemBody, {
+            _description: description,
+            children: children
+          }) : body
+        })]
+      }), isLastItem || variant === 'transparent' ? /*#__PURE__*/jsx(Divider, {}) : null]
+    }))
   });
-  return /*#__PURE__*/jsxs(BaseBox, _objectSpread(_objectSpread({}, metaAttribute({
-    name: MetaConstants.AccordionItem,
-    testID: testID
-  })), {}, {
-    children: [/*#__PURE__*/jsxs(Collapsible, {
-      isExpanded: isExpanded,
-      defaultIsExpanded: isDefaultExpanded,
-      onExpandChange: handleExpandChange
-      // Accordion has its own width restrictions
-      ,
-      _shouldApplyWidthRestrictions: false,
-      children: [/*#__PURE__*/jsx(AccordionButton, {
-        index: _index,
-        icon: icon,
-        children: title
-      }), /*#__PURE__*/jsx(CollapsibleBody
-      // Just React Native things, need this 100% so collapsed content flows correctly inside Accordion
-      , {
-        width: isReactNative() ? '100%' : undefined,
-        children: collapsibleBodyContent
-      })]
-    }), /*#__PURE__*/jsx(Divider, {})]
-  }));
 };
 export { AccordionItem };