@dxc-technology/halstack-react 0.0.0-ebf4fe2 → 0.0.0-ec06b53

package/accordion-group/AccordionGroup.test.js

@@ -9,37 +9,10 @@ var _react2 = require("@testing-library/react");
 var _AccordionGroup = _interopRequireDefault(require("./AccordionGroup"));
 
 describe("Accordion component tests", function () {
-  test("Uncontrolled accordion group renders with children", function () {
-    var _render = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_AccordionGroup["default"], null, /*#__PURE__*/_react["default"].createElement(_AccordionGroup["default"].Accordion, {
-      label: "Accordion1",
-      padding: "medium"
-    }, /*#__PURE__*/_react["default"].createElement("div", null, "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse malesuada lacus ex, sit amet blandit leo lobortis eget.")), /*#__PURE__*/_react["default"].createElement(_AccordionGroup["default"].Accordion, {
-      label: "Accordion2",
-      padding: "medium"
-    }, /*#__PURE__*/_react["default"].createElement("div", null, "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse malesuada lacus ex, sit amet blandit leo lobortis eget.")))),
-        getByText = _render.getByText,
-        getAllByRole = _render.getAllByRole;
-
-    expect(getByText("Accordion1")).toBeTruthy();
-    expect(getByText("Accordion2")).toBeTruthy();
-    expect(getAllByRole("button")[0].getAttribute("aria-expanded")).toBe("false");
-    expect(getAllByRole("button")[1].getAttribute("aria-expanded")).toBe("false");
-  });
-  test("Uncontrolled accordion group renders with only one children", function () {
-    var _render2 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_AccordionGroup["default"], null, /*#__PURE__*/_react["default"].createElement(_AccordionGroup["default"].Accordion, {
-      label: "Accordion1",
-      padding: "medium"
-    }, /*#__PURE__*/_react["default"].createElement("div", null, "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse malesuada lacus ex, sit amet blandit leo lobortis eget.")))),
-        getByText = _render2.getByText,
-        getAllByRole = _render2.getAllByRole;
-
-    expect(getByText("Accordion1")).toBeTruthy();
-    expect(getAllByRole("button")[0].getAttribute("aria-expanded")).toBe("false");
-  });
   test("Uncontrolled accordion group calls correct function on click", function () {
     var onActiveChange = jest.fn();
 
-    var _render3 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_AccordionGroup["default"], {
+    var _render = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_AccordionGroup["default"], {
       margin: "large",
       onActiveChange: onActiveChange
     }, /*#__PURE__*/_react["default"].createElement(_AccordionGroup["default"].Accordion, {
@@ -50,8 +23,8 @@ describe("Accordion component tests", function () {
       label: "Accordion2",
       padding: "medium"
     }, /*#__PURE__*/_react["default"].createElement("div", null, "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse malesuada lacus ex, sit amet blandit leo lobortis eget.")))),
-        getByText = _render3.getByText,
-        getAllByRole = _render3.getAllByRole;
+        getByText = _render.getByText,
+        getAllByRole = _render.getAllByRole;
 
     expect(getAllByRole("button")[0].getAttribute("aria-expanded")).toBe("false");
     expect(getAllByRole("button")[1].getAttribute("aria-expanded")).toBe("false");
@@ -62,28 +35,29 @@ describe("Accordion component tests", function () {
     expect(getAllByRole("button")[0].getAttribute("aria-expanded")).toBe("true");
     expect(getAllByRole("button")[1].getAttribute("aria-expanded")).toBe("false");
   });
-  test("Uncontrolled accordion group renders initially with an accordion expanded", function () {
-    var _render4 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_AccordionGroup["default"], {
+  test("Uncontrolled accordion group renders initially with an accordion expanded using defaultIndexActive", function () {
+    var _render2 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_AccordionGroup["default"], {
       defaultIndexActive: 1
     }, /*#__PURE__*/_react["default"].createElement(_AccordionGroup["default"].Accordion, {
       label: "Accordion1",
       padding: "medium"
-    }, /*#__PURE__*/_react["default"].createElement("div", null, "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse malesuada lacus ex, sit amet blandit leo lobortis eget.")), /*#__PURE__*/_react["default"].createElement(_AccordionGroup["default"].Accordion, {
+    }, /*#__PURE__*/_react["default"].createElement("div", null, "First accordion")), /*#__PURE__*/_react["default"].createElement(_AccordionGroup["default"].Accordion, {
       label: "Accordion2",
       padding: "medium"
-    }, /*#__PURE__*/_react["default"].createElement("div", null, "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse malesuada lacus ex, sit amet blandit leo lobortis eget.")))),
-        getByText = _render4.getByText,
-        getAllByRole = _render4.getAllByRole;
+    }, /*#__PURE__*/_react["default"].createElement("div", null, "Second accordion")))),
+        queryByText = _render2.queryByText,
+        getByText = _render2.getByText,
+        getAllByRole = _render2.getAllByRole;
 
-    expect(getByText("Accordion1")).toBeTruthy();
-    expect(getByText("Accordion2")).toBeTruthy();
     expect(getAllByRole("button")[0].getAttribute("aria-expanded")).toBe("false");
     expect(getAllByRole("button")[1].getAttribute("aria-expanded")).toBe("true");
+    expect(getByText("Second accordion")).toBeTruthy();
+    expect(queryByText("First accordion")).toBeFalsy();
   });
   test("Controlled accordion with indexActive change", function () {
     var onActiveChange = jest.fn();
 
-    var _render5 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_AccordionGroup["default"], {
+    var _render3 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_AccordionGroup["default"], {
       margin: "large",
       indexActive: 1,
       onActiveChange: onActiveChange
@@ -95,11 +69,12 @@ describe("Accordion component tests", function () {
       label: "Accordion2",
       padding: "medium"
     }, /*#__PURE__*/_react["default"].createElement("div", null, "Text2")))),
-        getByText = _render5.getByText,
-        getAllByRole = _render5.getAllByRole,
-        rerender = _render5.rerender;
+        queryByText = _render3.queryByText,
+        getByText = _render3.getByText,
+        getAllByRole = _render3.getAllByRole,
+        rerender = _render3.rerender;
 
-    expect(getByText("Text1")).toBeTruthy();
+    expect(queryByText("Text1")).toBeFalsy();
     expect(getByText("Text2")).toBeTruthy();
 
     _react2.fireEvent.click(getByText("Accordion1"));
@@ -128,7 +103,7 @@ describe("Accordion component tests", function () {
   test("Disabled uncontrolled accordion group", function () {
     var onActiveChange = jest.fn();
 
-    var _render6 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_AccordionGroup["default"], {
+    var _render4 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_AccordionGroup["default"], {
       margin: "large",
       onActiveChange: onActiveChange,
       disabled: true
@@ -140,7 +115,7 @@ describe("Accordion component tests", function () {
       label: "Accordion2",
       padding: "medium"
     }, /*#__PURE__*/_react["default"].createElement("div", null, "Text2")))),
-        getByText = _render6.getByText;
+        getByText = _render4.getByText;
 
     _react2.fireEvent.click(getByText("Accordion1"));
 

package/accordion-group/types.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
-declare type Space = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
-declare type Margin = {
+export declare type Space = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
+export declare type Margin = {
     top?: Space;
     bottom?: Space;
     left?: Space;
@@ -12,7 +12,7 @@ declare type Padding = {
     left?: Space;
     right?: Space;
 };
-declare type SVG = React.SVGProps<SVGSVGElement>;
+declare type SVG = React.ReactNode & React.SVGProps<SVGSVGElement>;
 export declare type AccordionPropsType = {
     /**
      * The panel label.
@@ -31,6 +31,7 @@ export declare type AccordionPropsType = {
      */
     disabled?: boolean;
     /**
+     * @deprecated This prop will be removed shortly, consider using the Inset component for this purpose.
      * Size of the padding to be applied to the custom area ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
      * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different padding sizes.
      */
@@ -69,4 +70,10 @@ declare type Props = {
      */
     children: React.ReactElement<AccordionPropsType>[] | React.ReactElement<AccordionPropsType>;
 };
+export declare type AccordionGroupAccordionContextProps = {
+    activeIndex: number;
+    handlerActiveChange: (index: number) => void;
+    disabled: boolean;
+    index: number;
+};
 export default Props;

package/alert/Alert.js

@@ -146,7 +146,7 @@ var sizes = {
   medium: "480px",
   large: "820px",
   fillParent: "100%",
-  fitContent: "auto"
+  fitContent: "fit-content"
 };
 
 var calculateWidth = function calculateWidth(margin, size) {

package/bleed/Bleed.stories.tsx

@@ -2,7 +2,7 @@ import React from "react";
 import styled from "styled-components";
 import Title from "../../.storybook/components/Title";
 import DxcBleed from "./Bleed";
-import DxcStack from "../stack/Stack";
+import DxcFlex from "../flex/Flex";
 
 export default {
   title: "Bleed",
@@ -13,316 +13,316 @@ export const Chromatic = () => (
   <>
     <Title title="Space = none" theme="light" level={4} />
     <Container>
-      <DxcStack gutter="1.5rem">
+      <DxcFlex direction="column" gap="1.5rem">
         <Placeholder></Placeholder>
         <DxcBleed space="0rem">
           <Placeholder></Placeholder>
         </DxcBleed>
         <Placeholder></Placeholder>
-      </DxcStack>
+      </DxcFlex>
     </Container>
     <Title title="Space = xxxsmall" theme="light" level={4} />
     <Container>
-      <DxcStack gutter="1.5rem">
+      <DxcFlex direction="column" gap="1.5rem">
         <Placeholder></Placeholder>
         <DxcBleed space="0.125rem">
           <Placeholder></Placeholder>
         </DxcBleed>
         <Placeholder></Placeholder>
-      </DxcStack>
+      </DxcFlex>
     </Container>
     <Title title="Space = xxsmall" theme="light" level={4} />
     <Container>
-      <DxcStack gutter="1.5rem">
+      <DxcFlex direction="column" gap="1.5rem">
         <Placeholder></Placeholder>
         <DxcBleed space="0.25rem">
           <Placeholder></Placeholder>
         </DxcBleed>
         <Placeholder></Placeholder>
-      </DxcStack>
+      </DxcFlex>
     </Container>
     <Title title="Space = xsmall" theme="light" level={4} />
     <Container>
-      <DxcStack gutter="1.5rem">
+      <DxcFlex direction="column" gap="1.5rem">
         <Placeholder></Placeholder>
         <DxcBleed space="0.5rem">
           <Placeholder></Placeholder>
         </DxcBleed>
         <Placeholder></Placeholder>
-      </DxcStack>
+      </DxcFlex>
     </Container>
     <Title title="Space = small" theme="light" level={4} />
     <Container>
-      <DxcStack gutter="1.5rem">
+      <DxcFlex direction="column" gap="1.5rem">
         <Placeholder></Placeholder>
         <DxcBleed space="1rem">
           <Placeholder></Placeholder>
         </DxcBleed>
         <Placeholder></Placeholder>
-      </DxcStack>
+      </DxcFlex>
     </Container>
     <Title title="Space = medium" theme="light" level={4} />
     <Container>
-      <DxcStack gutter="1.5rem">
+      <DxcFlex direction="column" gap="1.5rem">
         <Placeholder></Placeholder>
         <DxcBleed space="1.5rem">
           <Placeholder></Placeholder>
         </DxcBleed>
         <Placeholder></Placeholder>
-      </DxcStack>
+      </DxcFlex>
     </Container>
     <Title title="Space = large" theme="light" level={4} />
     <Container>
-      <DxcStack gutter="1.5rem">
+      <DxcFlex direction="column" gap="1.5rem">
         <Placeholder></Placeholder>
         <DxcBleed space="2rem">
           <Placeholder></Placeholder>
         </DxcBleed>
         <Placeholder></Placeholder>
-      </DxcStack>
+      </DxcFlex>
     </Container>
     <Title title="Space = xlarge" theme="light" level={4} />
     <Container>
-      <DxcStack gutter="1.5rem">
+      <DxcFlex direction="column" gap="1.5rem">
         <Placeholder></Placeholder>
         <DxcBleed space="3rem">
           <Placeholder></Placeholder>
         </DxcBleed>
         <Placeholder></Placeholder>
-      </DxcStack>
+      </DxcFlex>
     </Container>
     <Title title="Space = xxlarge" theme="light" level={4} />
     <Container>
-      <DxcStack gutter="1.5rem">
+      <DxcFlex direction="column" gap="1.5rem">
         <Placeholder></Placeholder>
         <DxcBleed space="4rem">
           <Placeholder></Placeholder>
         </DxcBleed>
         <Placeholder></Placeholder>
-      </DxcStack>
+      </DxcFlex>
     </Container>
     <Title title="Space = xxxlarge" theme="light" level={4} />
     <Container>
-      <DxcStack gutter="1.5rem">
+      <DxcFlex direction="column" gap="1.5rem">
         <Placeholder></Placeholder>
         <DxcBleed space="5rem">
           <Placeholder></Placeholder>
         </DxcBleed>
         <Placeholder></Placeholder>
-      </DxcStack>
+      </DxcFlex>
     </Container>
 
     <Title title="Horizontal = none" theme="light" level={4} />
     <Container>
-      <DxcStack gutter="1.5rem">
+      <DxcFlex direction="column" gap="1.5rem">
         <Placeholder></Placeholder>
         <DxcBleed horizontal="0rem">
           <Placeholder></Placeholder>
         </DxcBleed>
         <Placeholder></Placeholder>
-      </DxcStack>
+      </DxcFlex>
     </Container>
     <Title title="Horizontal = xxxsmall" theme="light" level={4} />
     <Container>
-      <DxcStack gutter="1.5rem">
+      <DxcFlex direction="column" gap="1.5rem">
         <Placeholder></Placeholder>
         <DxcBleed horizontal="0.125rem">
           <Placeholder></Placeholder>
         </DxcBleed>
         <Placeholder></Placeholder>
-      </DxcStack>
+      </DxcFlex>
     </Container>
     <Title title="Horizontal = xxsmall" theme="light" level={4} />
     <Container>
-      <DxcStack gutter="1.5rem">
+      <DxcFlex direction="column" gap="1.5rem">
         <Placeholder></Placeholder>
         <DxcBleed horizontal="0.25rem">
           <Placeholder></Placeholder>
         </DxcBleed>
         <Placeholder></Placeholder>
-      </DxcStack>
+      </DxcFlex>
     </Container>
     <Title title="Horizontal = xsmall" theme="light" level={4} />
     <Container>
-      <DxcStack gutter="1.5rem">
+      <DxcFlex direction="column" gap="1.5rem">
         <Placeholder></Placeholder>
         <DxcBleed horizontal="0.5rem">
           <Placeholder></Placeholder>
         </DxcBleed>
         <Placeholder></Placeholder>
-      </DxcStack>
+      </DxcFlex>
     </Container>
     <Title title="Horizontal = small" theme="light" level={4} />
     <Container>
-      <DxcStack gutter="1.5rem">
+      <DxcFlex direction="column" gap="1.5rem">
         <Placeholder></Placeholder>
         <DxcBleed horizontal="1rem">
           <Placeholder></Placeholder>
         </DxcBleed>
         <Placeholder></Placeholder>
-      </DxcStack>
+      </DxcFlex>
     </Container>
     <Title title="Horizontal = medium" theme="light" level={4} />
     <Container>
-      <DxcStack gutter="1.5rem">
+      <DxcFlex direction="column" gap="1.5rem">
         <Placeholder></Placeholder>
         <DxcBleed horizontal="1.5rem">
           <Placeholder></Placeholder>
         </DxcBleed>
         <Placeholder></Placeholder>
-      </DxcStack>
+      </DxcFlex>
     </Container>
     <Title title="Horizontal = large" theme="light" level={4} />
     <Container>
-      <DxcStack gutter="1.5rem">
+      <DxcFlex direction="column" gap="1.5rem">
         <Placeholder></Placeholder>
         <DxcBleed horizontal="2rem">
           <Placeholder></Placeholder>
         </DxcBleed>
         <Placeholder></Placeholder>
-      </DxcStack>
+      </DxcFlex>
     </Container>
     <Title title="Horizontal = xlarge" theme="light" level={4} />
     <Container>
-      <DxcStack gutter="1.5rem">
+      <DxcFlex direction="column" gap="1.5rem">
         <Placeholder></Placeholder>
         <DxcBleed horizontal="3rem">
           <Placeholder></Placeholder>
         </DxcBleed>
         <Placeholder></Placeholder>
-      </DxcStack>
+      </DxcFlex>
     </Container>
     <Title title="Horizontal = xxlarge" theme="light" level={4} />
     <Container>
-      <DxcStack gutter="1.5rem">
+      <DxcFlex direction="column" gap="1.5rem">
         <Placeholder></Placeholder>
         <DxcBleed horizontal="4rem">
           <Placeholder></Placeholder>
         </DxcBleed>
         <Placeholder></Placeholder>
-      </DxcStack>
+      </DxcFlex>
     </Container>
     <Title title="Horizontal = xxxlarge" theme="light" level={4} />
     <Container>
-      <DxcStack gutter="1.5rem">
+      <DxcFlex direction="column" gap="1.5rem">
         <Placeholder></Placeholder>
         <DxcBleed horizontal="5rem">
           <Placeholder></Placeholder>
         </DxcBleed>
         <Placeholder></Placeholder>
-      </DxcStack>
+      </DxcFlex>
     </Container>
 
     <Title title="Vertical = none" theme="light" level={4} />
     <Container>
-      <DxcStack gutter="1.5rem">
+      <DxcFlex direction="column" gap="1.5rem">
         <Placeholder></Placeholder>
         <DxcBleed vertical="0rem">
           <Placeholder></Placeholder>
         </DxcBleed>
         <Placeholder></Placeholder>
-      </DxcStack>
+      </DxcFlex>
     </Container>
     <Title title="Vertical = xxxsmall" theme="light" level={4} />
     <Container>
-      <DxcStack gutter="1.5rem">
+      <DxcFlex direction="column" gap="1.5rem">
         <Placeholder></Placeholder>
         <DxcBleed vertical="0.125rem">
           <Placeholder></Placeholder>
         </DxcBleed>
         <Placeholder></Placeholder>
-      </DxcStack>
+      </DxcFlex>
     </Container>
     <Title title="Vertical = xxsmall" theme="light" level={4} />
     <Container>
-      <DxcStack gutter="1.5rem">
+      <DxcFlex direction="column" gap="1.5rem">
         <Placeholder></Placeholder>
         <DxcBleed vertical="0.25rem">
           <Placeholder></Placeholder>
         </DxcBleed>
         <Placeholder></Placeholder>
-      </DxcStack>
+      </DxcFlex>
     </Container>
     <Title title="Vertical = xsmall" theme="light" level={4} />
     <Container>
-      <DxcStack gutter="1.5rem">
+      <DxcFlex direction="column" gap="1.5rem">
         <Placeholder></Placeholder>
         <DxcBleed vertical="0.5rem">
           <Placeholder></Placeholder>
         </DxcBleed>
         <Placeholder></Placeholder>
-      </DxcStack>
+      </DxcFlex>
     </Container>
     <Title title="Vertical = small" theme="light" level={4} />
     <Container>
-      <DxcStack gutter="1.5rem">
+      <DxcFlex direction="column" gap="1.5rem">
         <Placeholder></Placeholder>
         <DxcBleed vertical="1rem">
           <Placeholder></Placeholder>
         </DxcBleed>
         <Placeholder></Placeholder>
-      </DxcStack>
+      </DxcFlex>
     </Container>
     <Title title="Vertical = medium" theme="light" level={4} />
     <Container>
-      <DxcStack gutter="1.5rem">
+      <DxcFlex direction="column" gap="1.5rem">
         <Placeholder></Placeholder>
         <DxcBleed vertical="1.5rem">
           <Placeholder></Placeholder>
         </DxcBleed>
         <Placeholder></Placeholder>
-      </DxcStack>
+      </DxcFlex>
     </Container>
     <Title title="Vertical = large" theme="light" level={4} />
     <Container>
-      <DxcStack gutter="1.5rem">
+      <DxcFlex direction="column" gap="1.5rem">
         <Placeholder></Placeholder>
         <DxcBleed vertical="2rem">
           <Placeholder></Placeholder>
         </DxcBleed>
         <Placeholder></Placeholder>
-      </DxcStack>
+      </DxcFlex>
     </Container>
     <Title title="Vertical = xlarge" theme="light" level={4} />
     <Container>
-      <DxcStack gutter="1.5rem">
+      <DxcFlex direction="column" gap="1.5rem">
         <Placeholder></Placeholder>
         <DxcBleed vertical="3rem">
           <Placeholder></Placeholder>
         </DxcBleed>
         <Placeholder></Placeholder>
-      </DxcStack>
+      </DxcFlex>
     </Container>
     <Title title="Vertical = xxlarge" theme="light" level={4} />
     <Container>
-      <DxcStack gutter="1.5rem">
+      <DxcFlex direction="column" gap="1.5rem">
         <Placeholder></Placeholder>
         <DxcBleed vertical="4rem">
           <Placeholder></Placeholder>
         </DxcBleed>
         <Placeholder></Placeholder>
-      </DxcStack>
+      </DxcFlex>
     </Container>
     <Title title="Vertical = xxxlarge" theme="light" level={4} />
     <Container>
-      <DxcStack gutter="1.5rem">
+      <DxcFlex direction="column" gap="1.5rem">
         <Placeholder></Placeholder>
         <DxcBleed vertical="5rem">
           <Placeholder></Placeholder>
         </DxcBleed>
         <Placeholder></Placeholder>
-      </DxcStack>
+      </DxcFlex>
     </Container>
 
     <Title title="Top = xsmall, right = small, bottom = medium and left = large" theme="light" level={4} />
     <Container>
-      <DxcStack gutter="1.5rem">
+      <DxcFlex direction="column" gap="1.5rem">
         <Placeholder></Placeholder>
         <DxcBleed top="0.5rem" right="1rem" bottom="1.5rem" left="2rem">
           <Placeholder></Placeholder>
         </DxcBleed>
         <Placeholder></Placeholder>
-      </DxcStack>
+      </DxcFlex>
     </Container>
   </>
 );

package/box/Box.js

@@ -60,7 +60,7 @@ var sizes = {
   medium: "240px",
   large: "480px",
   fillParent: "100%",
-  fitContent: "unset"
+  fitContent: "fit-content"
 };
 
 var calculateWidth = function calculateWidth(margin, size, padding) {

package/box/types.d.ts

@@ -31,6 +31,7 @@ declare type Props = {
      */
     margin?: Space | Margin;
     /**
+     * @deprecated This prop will be removed shortly, consider using the Inset component for this purpose.
      * Size of the padding to be applied to the custom area ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
      * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different padding sizes.
      */

package/bulleted-list/BulletedList.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+import BulletedListPropsType, { BulletedListItemPropsType } from "./types";
+declare const DxcBulletedList: {
+    ({ children, type, icon }: BulletedListPropsType): JSX.Element;
+    Item: ({ children }: BulletedListItemPropsType) => JSX.Element;
+};
+export default DxcBulletedList;