@dxc-technology/halstack-react 0.0.0-e78f5f5 → 0.0.0-e7da1f7
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.
- package/README.md +46 -0
- package/dist/index.d.mts +6536 -0
- package/dist/index.d.ts +6536 -0
- package/dist/index.js +13461 -0
- package/dist/index.mjs +13404 -0
- package/package.json +69 -70
- package/BackgroundColorContext.d.ts +0 -10
- package/BackgroundColorContext.js +0 -47
- package/ThemeContext.d.ts +0 -10
- package/ThemeContext.js +0 -243
- package/accordion/Accordion.d.ts +0 -4
- package/accordion/Accordion.js +0 -247
- package/accordion/Accordion.stories.tsx +0 -307
- package/accordion/Accordion.test.js +0 -57
- package/accordion/types.d.ts +0 -64
- package/accordion/types.js +0 -5
- package/accordion-group/AccordionGroup.d.ts +0 -7
- package/accordion-group/AccordionGroup.js +0 -170
- package/accordion-group/AccordionGroup.stories.tsx +0 -225
- package/accordion-group/AccordionGroup.test.js +0 -133
- package/accordion-group/types.d.ts +0 -68
- package/accordion-group/types.js +0 -5
- package/alert/Alert.d.ts +0 -4
- package/alert/Alert.js +0 -290
- package/alert/Alert.stories.tsx +0 -170
- package/alert/Alert.test.js +0 -92
- package/alert/types.d.ts +0 -49
- package/alert/types.js +0 -5
- package/badge/Badge.d.ts +0 -4
- package/badge/Badge.js +0 -59
- package/badge/types.d.ts +0 -4
- package/badge/types.js +0 -5
- package/bleed/Bleed.d.ts +0 -3
- package/bleed/Bleed.js +0 -84
- package/bleed/Bleed.stories.tsx +0 -342
- package/bleed/types.d.ts +0 -37
- package/bleed/types.js +0 -5
- package/box/Box.d.ts +0 -4
- package/box/Box.js +0 -126
- package/box/Box.stories.tsx +0 -132
- package/box/Box.test.js +0 -18
- package/box/types.d.ts +0 -43
- package/box/types.js +0 -5
- package/button/Button.d.ts +0 -4
- package/button/Button.js +0 -171
- package/button/Button.stories.tsx +0 -274
- package/button/Button.test.js +0 -35
- package/button/types.d.ts +0 -53
- package/button/types.js +0 -5
- package/card/Card.d.ts +0 -4
- package/card/Card.js +0 -164
- package/card/Card.stories.tsx +0 -201
- package/card/Card.test.js +0 -50
- package/card/ice-cream.jpg +0 -0
- package/card/types.d.ts +0 -67
- package/card/types.js +0 -5
- package/checkbox/Checkbox.d.ts +0 -4
- package/checkbox/Checkbox.js +0 -253
- package/checkbox/Checkbox.stories.tsx +0 -192
- package/checkbox/Checkbox.test.js +0 -65
- package/checkbox/types.d.ts +0 -60
- package/checkbox/types.js +0 -5
- package/chip/Chip.d.ts +0 -4
- package/chip/Chip.js +0 -161
- package/chip/Chip.stories.tsx +0 -119
- package/chip/Chip.test.js +0 -56
- package/chip/types.d.ts +0 -45
- package/chip/types.js +0 -5
- package/common/OpenSans.css +0 -81
- package/common/RequiredComponent.js +0 -32
- package/common/fonts/OpenSans-Bold.ttf +0 -0
- package/common/fonts/OpenSans-BoldItalic.ttf +0 -0
- package/common/fonts/OpenSans-ExtraBold.ttf +0 -0
- package/common/fonts/OpenSans-ExtraBoldItalic.ttf +0 -0
- package/common/fonts/OpenSans-Italic.ttf +0 -0
- package/common/fonts/OpenSans-Light.ttf +0 -0
- package/common/fonts/OpenSans-LightItalic.ttf +0 -0
- package/common/fonts/OpenSans-Regular.ttf +0 -0
- package/common/fonts/OpenSans-SemiBold.ttf +0 -0
- package/common/fonts/OpenSans-SemiBoldItalic.ttf +0 -0
- package/common/utils.js +0 -22
- package/common/variables.js +0 -1373
- package/date-input/DateInput.d.ts +0 -4
- package/date-input/DateInput.js +0 -354
- package/date-input/DateInput.stories.tsx +0 -138
- package/date-input/DateInput.test.js +0 -492
- package/date-input/types.d.ts +0 -104
- package/date-input/types.js +0 -5
- package/dialog/Dialog.d.ts +0 -4
- package/dialog/Dialog.js +0 -166
- package/dialog/Dialog.stories.tsx +0 -212
- package/dialog/Dialog.test.js +0 -40
- package/dialog/types.d.ts +0 -43
- package/dialog/types.js +0 -5
- package/dropdown/Dropdown.d.ts +0 -4
- package/dropdown/Dropdown.js +0 -395
- package/dropdown/Dropdown.stories.tsx +0 -249
- package/dropdown/Dropdown.test.js +0 -189
- package/dropdown/types.d.ts +0 -80
- package/dropdown/types.js +0 -5
- package/file-input/FileInput.d.ts +0 -4
- package/file-input/FileInput.js +0 -590
- package/file-input/FileInput.stories.tsx +0 -507
- package/file-input/FileInput.test.js +0 -457
- package/file-input/FileItem.d.ts +0 -14
- package/file-input/FileItem.js +0 -184
- package/file-input/types.d.ts +0 -112
- package/file-input/types.js +0 -5
- package/footer/Footer.d.ts +0 -4
- package/footer/Footer.js +0 -258
- package/footer/Footer.stories.tsx +0 -130
- package/footer/Footer.test.js +0 -109
- package/footer/Icons.d.ts +0 -2
- package/footer/Icons.js +0 -77
- package/footer/types.d.ts +0 -65
- package/footer/types.js +0 -5
- package/header/Header.d.ts +0 -7
- package/header/Header.js +0 -324
- package/header/Header.stories.tsx +0 -162
- package/header/Header.test.js +0 -63
- package/header/Icons.d.ts +0 -2
- package/header/Icons.js +0 -34
- package/header/types.d.ts +0 -47
- package/header/types.js +0 -5
- package/heading/Heading.d.ts +0 -4
- package/heading/Heading.js +0 -159
- package/heading/Heading.stories.tsx +0 -54
- package/heading/Heading.test.js +0 -186
- package/heading/types.d.ts +0 -33
- package/heading/types.js +0 -5
- package/inset/Inset.d.ts +0 -3
- package/inset/Inset.js +0 -84
- package/inset/Inset.stories.tsx +0 -229
- package/inset/types.d.ts +0 -13
- package/inset/types.js +0 -5
- package/layout/ApplicationLayout.d.ts +0 -10
- package/layout/ApplicationLayout.js +0 -231
- package/layout/ApplicationLayout.stories.tsx +0 -171
- package/layout/Icons.js +0 -55
- package/layout/types.d.ts +0 -57
- package/layout/types.js +0 -5
- package/link/Link.d.ts +0 -3
- package/link/Link.js +0 -153
- package/link/Link.stories.tsx +0 -151
- package/link/Link.test.js +0 -91
- package/link/types.d.ts +0 -70
- package/link/types.js +0 -5
- package/list/List.d.ts +0 -4
- package/list/List.js +0 -47
- package/list/List.stories.tsx +0 -95
- package/list/types.d.ts +0 -7
- package/list/types.js +0 -5
- package/main.d.ts +0 -46
- package/main.js +0 -379
- package/number-input/NumberInput.d.ts +0 -4
- package/number-input/NumberInput.js +0 -83
- package/number-input/NumberInput.stories.tsx +0 -115
- package/number-input/NumberInput.test.js +0 -508
- package/number-input/NumberInputContext.d.ts +0 -4
- package/number-input/NumberInputContext.js +0 -19
- package/number-input/numberInputContextTypes.d.ts +0 -19
- package/number-input/numberInputContextTypes.js +0 -5
- package/number-input/types.d.ts +0 -117
- package/number-input/types.js +0 -5
- package/paginator/Icons.js +0 -66
- package/paginator/Paginator.d.ts +0 -4
- package/paginator/Paginator.js +0 -192
- package/paginator/Paginator.stories.tsx +0 -63
- package/paginator/Paginator.test.js +0 -266
- package/paginator/types.d.ts +0 -38
- package/paginator/types.js +0 -5
- package/password-input/PasswordInput.d.ts +0 -4
- package/password-input/PasswordInput.js +0 -163
- package/password-input/PasswordInput.stories.tsx +0 -131
- package/password-input/PasswordInput.test.js +0 -183
- package/password-input/types.d.ts +0 -107
- package/password-input/types.js +0 -5
- package/progress-bar/ProgressBar.d.ts +0 -4
- package/progress-bar/ProgressBar.js +0 -170
- package/progress-bar/ProgressBar.stories.jsx +0 -58
- package/progress-bar/ProgressBar.test.js +0 -65
- package/progress-bar/types.d.ts +0 -37
- package/progress-bar/types.js +0 -5
- package/radio/Radio.d.ts +0 -4
- package/radio/Radio.js +0 -174
- package/radio/Radio.stories.tsx +0 -192
- package/radio/Radio.test.js +0 -71
- package/radio/types.d.ts +0 -54
- package/radio/types.js +0 -5
- package/radio-group/Radio.d.ts +0 -4
- package/radio-group/Radio.js +0 -141
- package/radio-group/RadioGroup.d.ts +0 -4
- package/radio-group/RadioGroup.js +0 -280
- package/radio-group/RadioGroup.stories.tsx +0 -100
- package/radio-group/RadioGroup.test.js +0 -695
- package/radio-group/types.d.ts +0 -114
- package/radio-group/types.js +0 -5
- package/resultsetTable/ResultsetTable.d.ts +0 -4
- package/resultsetTable/ResultsetTable.js +0 -254
- package/resultsetTable/ResultsetTable.stories.tsx +0 -275
- package/resultsetTable/ResultsetTable.test.js +0 -306
- package/resultsetTable/types.d.ts +0 -67
- package/resultsetTable/types.js +0 -5
- package/row/Row.d.ts +0 -3
- package/row/Row.js +0 -127
- package/row/Row.stories.tsx +0 -237
- package/row/types.d.ts +0 -10
- package/row/types.js +0 -5
- package/select/Icons.d.ts +0 -10
- package/select/Icons.js +0 -93
- package/select/Option.d.ts +0 -4
- package/select/Option.js +0 -110
- package/select/Select.d.ts +0 -4
- package/select/Select.js +0 -740
- package/select/Select.stories.tsx +0 -582
- package/select/Select.test.js +0 -2016
- package/select/types.d.ts +0 -191
- package/select/types.js +0 -5
- package/sidenav/Sidenav.d.ts +0 -9
- package/sidenav/Sidenav.js +0 -136
- package/sidenav/Sidenav.stories.tsx +0 -182
- package/sidenav/Sidenav.test.js +0 -56
- package/sidenav/types.d.ts +0 -50
- package/sidenav/types.js +0 -5
- package/slider/Slider.d.ts +0 -4
- package/slider/Slider.js +0 -317
- package/slider/Slider.stories.tsx +0 -177
- package/slider/Slider.test.js +0 -129
- package/slider/types.d.ts +0 -78
- package/slider/types.js +0 -5
- package/spinner/Spinner.d.ts +0 -4
- package/spinner/Spinner.js +0 -250
- package/spinner/Spinner.stories.jsx +0 -103
- package/spinner/Spinner.test.js +0 -64
- package/spinner/types.d.ts +0 -32
- package/spinner/types.js +0 -5
- package/stack/Stack.d.ts +0 -3
- package/stack/Stack.js +0 -97
- package/stack/Stack.stories.tsx +0 -164
- package/stack/types.d.ts +0 -24
- package/stack/types.js +0 -5
- package/switch/Switch.d.ts +0 -4
- package/switch/Switch.js +0 -179
- package/switch/Switch.stories.tsx +0 -160
- package/switch/Switch.test.js +0 -73
- package/switch/types.d.ts +0 -58
- package/switch/types.js +0 -5
- package/table/Table.d.ts +0 -4
- package/table/Table.js +0 -118
- package/table/Table.stories.jsx +0 -277
- package/table/Table.test.js +0 -26
- package/table/types.d.ts +0 -21
- package/table/types.js +0 -5
- package/tabs/Tabs.d.ts +0 -4
- package/tabs/Tabs.js +0 -213
- package/tabs/Tabs.stories.tsx +0 -120
- package/tabs/Tabs.test.js +0 -123
- package/tabs/types.d.ts +0 -78
- package/tabs/types.js +0 -5
- package/tag/Tag.d.ts +0 -4
- package/tag/Tag.js +0 -186
- package/tag/Tag.stories.tsx +0 -142
- package/tag/Tag.test.js +0 -60
- package/tag/types.d.ts +0 -69
- package/tag/types.js +0 -5
- package/text/Text.d.ts +0 -7
- package/text/Text.js +0 -30
- package/text/Text.stories.tsx +0 -19
- package/text-input/TextInput.d.ts +0 -4
- package/text-input/TextInput.js +0 -798
- package/text-input/TextInput.stories.tsx +0 -474
- package/text-input/TextInput.test.js +0 -1725
- package/text-input/types.d.ts +0 -163
- package/text-input/types.js +0 -5
- package/textarea/Textarea.d.ts +0 -4
- package/textarea/Textarea.js +0 -288
- package/textarea/Textarea.stories.jsx +0 -157
- package/textarea/Textarea.test.js +0 -447
- package/textarea/types.d.ts +0 -134
- package/textarea/types.js +0 -5
- package/toggle-group/ToggleGroup.d.ts +0 -4
- package/toggle-group/ToggleGroup.js +0 -214
- package/toggle-group/ToggleGroup.stories.tsx +0 -173
- package/toggle-group/ToggleGroup.test.js +0 -125
- package/toggle-group/types.d.ts +0 -97
- package/toggle-group/types.js +0 -5
- package/useTheme.d.ts +0 -2
- package/useTheme.js +0 -22
- package/wizard/Wizard.d.ts +0 -4
- package/wizard/Wizard.js +0 -281
- package/wizard/Wizard.stories.tsx +0 -224
- package/wizard/Wizard.test.js +0 -128
- package/wizard/types.d.ts +0 -60
- package/wizard/types.js +0 -5
package/link/Link.test.js
DELETED
|
@@ -1,91 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
|
|
5
|
-
var _react = _interopRequireDefault(require("react"));
|
|
6
|
-
|
|
7
|
-
var _react2 = require("@testing-library/react");
|
|
8
|
-
|
|
9
|
-
var _Link = _interopRequireDefault(require("./Link"));
|
|
10
|
-
|
|
11
|
-
describe("Link component tests", function () {
|
|
12
|
-
test("Link renders with correct text", function () {
|
|
13
|
-
var _render = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Link["default"], {
|
|
14
|
-
text: "Link"
|
|
15
|
-
})),
|
|
16
|
-
getByText = _render.getByText;
|
|
17
|
-
|
|
18
|
-
expect(getByText("Link")).toBeTruthy();
|
|
19
|
-
});
|
|
20
|
-
test("Link renders with correct href", function () {
|
|
21
|
-
var _render2 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Link["default"], {
|
|
22
|
-
text: "Link",
|
|
23
|
-
href: "/testPage"
|
|
24
|
-
})),
|
|
25
|
-
getByRole = _render2.getByRole;
|
|
26
|
-
|
|
27
|
-
expect(getByRole("link").getAttribute("href")).toEqual("/testPage");
|
|
28
|
-
});
|
|
29
|
-
test("Link renders with correct disabled state", function () {
|
|
30
|
-
var _render3 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Link["default"], {
|
|
31
|
-
text: "Link",
|
|
32
|
-
href: "/testPage",
|
|
33
|
-
disabled: true
|
|
34
|
-
})),
|
|
35
|
-
getByText = _render3.getByText;
|
|
36
|
-
|
|
37
|
-
expect(getByText("Link").hasAttribute("href")).toBeFalsy();
|
|
38
|
-
|
|
39
|
-
var _render4 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Link["default"], {
|
|
40
|
-
text: "LinkButton",
|
|
41
|
-
onClick: function onClick() {
|
|
42
|
-
return console.log("Andorra");
|
|
43
|
-
},
|
|
44
|
-
disabled: true
|
|
45
|
-
})),
|
|
46
|
-
getByTextLinkButton = _render4.getByText;
|
|
47
|
-
|
|
48
|
-
expect(getByTextLinkButton("LinkButton").hasAttribute("onclick")).toBeFalsy();
|
|
49
|
-
});
|
|
50
|
-
test("Link open new tab", function () {
|
|
51
|
-
var _render5 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Link["default"], {
|
|
52
|
-
text: "Link",
|
|
53
|
-
href: "/testPage",
|
|
54
|
-
newWindow: true
|
|
55
|
-
})),
|
|
56
|
-
getByRole = _render5.getByRole;
|
|
57
|
-
|
|
58
|
-
expect(getByRole("link").getAttribute("target")).toEqual("_blank");
|
|
59
|
-
});
|
|
60
|
-
test("Link onClick called", function () {
|
|
61
|
-
var onClick = jest.fn();
|
|
62
|
-
|
|
63
|
-
var _render6 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Link["default"], {
|
|
64
|
-
text: "Link",
|
|
65
|
-
onClick: onClick
|
|
66
|
-
})),
|
|
67
|
-
getByText = _render6.getByText;
|
|
68
|
-
|
|
69
|
-
var link = getByText("Link");
|
|
70
|
-
|
|
71
|
-
_react2.fireEvent.click(link);
|
|
72
|
-
|
|
73
|
-
expect(onClick).toHaveBeenCalled();
|
|
74
|
-
});
|
|
75
|
-
test("Disabled link onClick not called", function () {
|
|
76
|
-
var onClick = jest.fn();
|
|
77
|
-
|
|
78
|
-
var _render7 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Link["default"], {
|
|
79
|
-
text: "Link",
|
|
80
|
-
onClick: onClick,
|
|
81
|
-
disabled: true
|
|
82
|
-
})),
|
|
83
|
-
getByText = _render7.getByText;
|
|
84
|
-
|
|
85
|
-
var link = getByText("Link");
|
|
86
|
-
|
|
87
|
-
_react2.fireEvent.click(link);
|
|
88
|
-
|
|
89
|
-
expect(onClick).toHaveBeenCalledTimes(0);
|
|
90
|
-
});
|
|
91
|
-
});
|
package/link/types.d.ts
DELETED
|
@@ -1,70 +0,0 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
declare type Space = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
|
|
3
|
-
declare type Margin = {
|
|
4
|
-
top?: Space;
|
|
5
|
-
bottom?: Space;
|
|
6
|
-
left?: Space;
|
|
7
|
-
right?: Space;
|
|
8
|
-
};
|
|
9
|
-
declare type LinkCommonProps = {
|
|
10
|
-
/**
|
|
11
|
-
* If true, the color is inherited from parent.
|
|
12
|
-
*/
|
|
13
|
-
inheritColor?: boolean;
|
|
14
|
-
/**
|
|
15
|
-
* If true, the link is disabled.
|
|
16
|
-
*/
|
|
17
|
-
disabled?: boolean;
|
|
18
|
-
/**
|
|
19
|
-
* Indicates the position of the icon in the component.
|
|
20
|
-
*/
|
|
21
|
-
iconPosition?: "before" | "after";
|
|
22
|
-
/**
|
|
23
|
-
* Page to be opened when the user clicks on the link.
|
|
24
|
-
*/
|
|
25
|
-
href?: string;
|
|
26
|
-
/**
|
|
27
|
-
* If true, the page is opened in a new browser tab.
|
|
28
|
-
*/
|
|
29
|
-
newWindow?: boolean;
|
|
30
|
-
/**
|
|
31
|
-
* If defined, the link will be displayed as a button. This
|
|
32
|
-
* function will be called when the user clicks the link.
|
|
33
|
-
*/
|
|
34
|
-
onClick?: () => void;
|
|
35
|
-
/**
|
|
36
|
-
* Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
|
|
37
|
-
* You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
|
|
38
|
-
*/
|
|
39
|
-
margin?: Space | Margin;
|
|
40
|
-
/**
|
|
41
|
-
* Value of the tabindex.
|
|
42
|
-
*/
|
|
43
|
-
tabIndex?: number;
|
|
44
|
-
};
|
|
45
|
-
export declare type LinkTextProps = LinkCommonProps & {
|
|
46
|
-
/**
|
|
47
|
-
* Link text.
|
|
48
|
-
*/
|
|
49
|
-
text: string;
|
|
50
|
-
/**
|
|
51
|
-
* Element or path used as the icon that will be placed next to the link text.
|
|
52
|
-
*/
|
|
53
|
-
icon?: string | SVG;
|
|
54
|
-
};
|
|
55
|
-
export declare type LinkIconProps = LinkCommonProps & {
|
|
56
|
-
/**
|
|
57
|
-
* Link text.
|
|
58
|
-
*/
|
|
59
|
-
text?: string;
|
|
60
|
-
/**
|
|
61
|
-
* Element or path used as the icon that will be placed next to the link text.
|
|
62
|
-
*/
|
|
63
|
-
icon: string | SVG;
|
|
64
|
-
};
|
|
65
|
-
declare type Overload = {
|
|
66
|
-
(props: LinkTextProps): JSX.Element;
|
|
67
|
-
(props: LinkIconProps): JSX.Element;
|
|
68
|
-
};
|
|
69
|
-
declare type SVG = React.SVGProps<SVGSVGElement>;
|
|
70
|
-
export default Overload;
|
package/link/types.js
DELETED
package/list/List.d.ts
DELETED
package/list/List.js
DELETED
|
@@ -1,47 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
|
|
5
|
-
Object.defineProperty(exports, "__esModule", {
|
|
6
|
-
value: true
|
|
7
|
-
});
|
|
8
|
-
exports["default"] = void 0;
|
|
9
|
-
|
|
10
|
-
var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
|
|
11
|
-
|
|
12
|
-
var _react = _interopRequireDefault(require("react"));
|
|
13
|
-
|
|
14
|
-
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
15
|
-
|
|
16
|
-
var _Stack = _interopRequireDefault(require("../stack/Stack"));
|
|
17
|
-
|
|
18
|
-
var _Text = _interopRequireDefault(require("../text/Text"));
|
|
19
|
-
|
|
20
|
-
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
|
|
21
|
-
|
|
22
|
-
function List(_ref) {
|
|
23
|
-
var children = _ref.children,
|
|
24
|
-
_ref$type = _ref.type,
|
|
25
|
-
type = _ref$type === void 0 ? "disc" : _ref$type,
|
|
26
|
-
_ref$gutter = _ref.gutter,
|
|
27
|
-
gutter = _ref$gutter === void 0 ? "xxsmall" : _ref$gutter;
|
|
28
|
-
return /*#__PURE__*/_react["default"].createElement(_Stack["default"], {
|
|
29
|
-
as: type === "number" ? "ol" : "ul",
|
|
30
|
-
gutter: gutter
|
|
31
|
-
}, _react["default"].Children.map(children, function (child, index) {
|
|
32
|
-
return /*#__PURE__*/_react["default"].createElement(ListItem, null, type === "number" ? /*#__PURE__*/_react["default"].createElement(Number, null, /*#__PURE__*/_react["default"].createElement(_Text["default"], null, index + 1, ".")) : type === "square" ? /*#__PURE__*/_react["default"].createElement(Square, null) : type === "circle" ? /*#__PURE__*/_react["default"].createElement(Circle, null) : /*#__PURE__*/_react["default"].createElement(Disc, null), child);
|
|
33
|
-
}));
|
|
34
|
-
}
|
|
35
|
-
|
|
36
|
-
var Number = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n user-select: none;\n margin-right: 10px;\n flex-shrink: 0;\n"])));
|
|
37
|
-
|
|
38
|
-
var Square = _styledComponents["default"].div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n background-color: black;\n width: 5px;\n height: 5px;\n flex-shrink: 0;\n margin-top: 10px;\n margin-right: 10px;\n"])));
|
|
39
|
-
|
|
40
|
-
var Circle = _styledComponents["default"].div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["\n width: 5px;\n height: 5px;\n border-radius: 50%;\n border: 1px solid black;\n flex-shrink: 0;\n margin-top: 10px;\n margin-right: 10px;\n box-sizing: border-box;\n"])));
|
|
41
|
-
|
|
42
|
-
var Disc = _styledComponents["default"].div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["\n background-color: black;\n width: 5px;\n height: 5px;\n border-radius: 50%;\n flex-shrink: 0;\n margin-top: 10px;\n margin-right: 10px;\n"])));
|
|
43
|
-
|
|
44
|
-
var ListItem = _styledComponents["default"].li(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2["default"])(["\n margin: 0px;\n padding: 0px;\n list-style: none;\n display: flex;\n"])));
|
|
45
|
-
|
|
46
|
-
var _default = List;
|
|
47
|
-
exports["default"] = _default;
|
package/list/List.stories.tsx
DELETED
|
@@ -1,95 +0,0 @@
|
|
|
1
|
-
import React from "react";
|
|
2
|
-
import styled from "styled-components";
|
|
3
|
-
import Title from "../../.storybook/components/Title";
|
|
4
|
-
import DxcList from "./List";
|
|
5
|
-
import DxcText from "../text/Text";
|
|
6
|
-
|
|
7
|
-
export default {
|
|
8
|
-
title: "List",
|
|
9
|
-
component: DxcList,
|
|
10
|
-
};
|
|
11
|
-
|
|
12
|
-
export const Chromatic = () => (
|
|
13
|
-
<>
|
|
14
|
-
<Title title="Default list" theme="light" level={4} />
|
|
15
|
-
<DxcList>
|
|
16
|
-
<DxcText>Text 1.</DxcText>
|
|
17
|
-
<DxcText>Text 2.</DxcText>
|
|
18
|
-
</DxcList>
|
|
19
|
-
<Title title="Number" theme="light" level={4} />
|
|
20
|
-
<DxcList type="number">
|
|
21
|
-
<DxcText>Text 1.</DxcText>
|
|
22
|
-
<DxcText>Text 2.</DxcText>
|
|
23
|
-
</DxcList>
|
|
24
|
-
<Title title="Square" theme="light" level={4} />
|
|
25
|
-
<DxcList type="square">
|
|
26
|
-
<DxcText>Text 1.</DxcText>
|
|
27
|
-
<DxcText>Text 2.</DxcText>
|
|
28
|
-
</DxcList>
|
|
29
|
-
<Title title="Circle" theme="light" level={4} />
|
|
30
|
-
<DxcList type="circle">
|
|
31
|
-
<DxcText>Text 1.</DxcText>
|
|
32
|
-
<DxcText>Text 2.</DxcText>
|
|
33
|
-
</DxcList>
|
|
34
|
-
<Title title="Multiple lines" theme="light" level={4} />
|
|
35
|
-
<Container>
|
|
36
|
-
<DxcList>
|
|
37
|
-
<DxcText>
|
|
38
|
-
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore
|
|
39
|
-
magna aliqua.
|
|
40
|
-
</DxcText>
|
|
41
|
-
<DxcText>Text 2.</DxcText>
|
|
42
|
-
</DxcList>
|
|
43
|
-
</Container>
|
|
44
|
-
<Title title="gutter = xxxsmall" theme="light" level={4} />
|
|
45
|
-
<DxcList gutter="xxsmall">
|
|
46
|
-
<DxcText>Text 1.</DxcText>
|
|
47
|
-
<DxcText>Text 2.</DxcText>
|
|
48
|
-
</DxcList>
|
|
49
|
-
<Title title="gutter = xxsmall" theme="light" level={4} />
|
|
50
|
-
<DxcList gutter="xxsmall">
|
|
51
|
-
<DxcText>Text 1.</DxcText>
|
|
52
|
-
<DxcText>Text 2.</DxcText>
|
|
53
|
-
</DxcList>
|
|
54
|
-
<Title title="gutter = xsmall" theme="light" level={4} />
|
|
55
|
-
<DxcList gutter="xsmall">
|
|
56
|
-
<DxcText>Text 1.</DxcText>
|
|
57
|
-
<DxcText>Text 2.</DxcText>
|
|
58
|
-
</DxcList>
|
|
59
|
-
<Title title="gutter = small" theme="light" level={4} />
|
|
60
|
-
<DxcList gutter="small">
|
|
61
|
-
<DxcText>Text 1.</DxcText>
|
|
62
|
-
<DxcText>Text 2.</DxcText>
|
|
63
|
-
</DxcList>
|
|
64
|
-
<Title title="gutter = medium" theme="light" level={4} />
|
|
65
|
-
<DxcList gutter="medium">
|
|
66
|
-
<DxcText>Text 1.</DxcText>
|
|
67
|
-
<DxcText>Text 2.</DxcText>
|
|
68
|
-
</DxcList>
|
|
69
|
-
<Title title="gutter = large" theme="light" level={4} />
|
|
70
|
-
<DxcList gutter="large">
|
|
71
|
-
<DxcText>Text 1.</DxcText>
|
|
72
|
-
<DxcText>Text 2.</DxcText>
|
|
73
|
-
</DxcList>
|
|
74
|
-
<Title title="gutter = xlarge" theme="light" level={4} />
|
|
75
|
-
<DxcList gutter="xlarge">
|
|
76
|
-
<DxcText>Text 1.</DxcText>
|
|
77
|
-
<DxcText>Text 2.</DxcText>
|
|
78
|
-
</DxcList>
|
|
79
|
-
<Title title="gutter = xxlarge" theme="light" level={4} />
|
|
80
|
-
<DxcList gutter="xxlarge">
|
|
81
|
-
<DxcText>Text 1.</DxcText>
|
|
82
|
-
<DxcText>Text 2.</DxcText>
|
|
83
|
-
</DxcList>
|
|
84
|
-
<Title title="gutter = xxxlarge" theme="light" level={4} />
|
|
85
|
-
<DxcList gutter="xxxlarge">
|
|
86
|
-
<DxcText>Text 1.</DxcText>
|
|
87
|
-
<DxcText>Text 2.</DxcText>
|
|
88
|
-
</DxcList>
|
|
89
|
-
|
|
90
|
-
</>
|
|
91
|
-
);
|
|
92
|
-
|
|
93
|
-
const Container = styled.div`
|
|
94
|
-
width: 400px;
|
|
95
|
-
`;
|
package/list/types.d.ts
DELETED
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
declare type Props = {
|
|
3
|
-
children: React.ReactNode;
|
|
4
|
-
gutter?: "none" | "xxxsmall" | "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge" | "xxxlarge";
|
|
5
|
-
type?: "disc" | "circle" | "square" | "number";
|
|
6
|
-
};
|
|
7
|
-
export default Props;
|
package/list/types.js
DELETED
package/main.d.ts
DELETED
|
@@ -1,46 +0,0 @@
|
|
|
1
|
-
import DxcAlert from "./alert/Alert";
|
|
2
|
-
import DxcAccordion from "./accordion/Accordion";
|
|
3
|
-
import DxcButton from "./button/Button";
|
|
4
|
-
import DxcCard from "./card/Card";
|
|
5
|
-
import DxcCheckbox from "./checkbox/Checkbox";
|
|
6
|
-
import DxcDialog from "./dialog/Dialog";
|
|
7
|
-
import DxcDropdown from "./dropdown/Dropdown";
|
|
8
|
-
import DxcFooter from "./footer/Footer";
|
|
9
|
-
import DxcHeader from "./header/Header";
|
|
10
|
-
import DxcRadio from "./radio/Radio";
|
|
11
|
-
import DxcSlider from "./slider/Slider";
|
|
12
|
-
import DxcSwitch from "./switch/Switch";
|
|
13
|
-
import DxcTabs from "./tabs/Tabs";
|
|
14
|
-
import DxcProgressBar from "./progress-bar/ProgressBar";
|
|
15
|
-
import DxcSpinner from "./spinner/Spinner";
|
|
16
|
-
import DxcTable from "./table/Table";
|
|
17
|
-
import DxcBox from "./box/Box";
|
|
18
|
-
import DxcTag from "./tag/Tag";
|
|
19
|
-
import DxcPaginator from "./paginator/Paginator";
|
|
20
|
-
import DxcSidenav from "./sidenav/Sidenav";
|
|
21
|
-
import DxcWizard from "./wizard/Wizard";
|
|
22
|
-
import DxcLink from "./link/Link";
|
|
23
|
-
import DxcHeading from "./heading/Heading";
|
|
24
|
-
import DxcResultsetTable from "./resultsetTable/ResultsetTable";
|
|
25
|
-
import DxcChip from "./chip/Chip";
|
|
26
|
-
import DxcApplicationLayout from "./layout/ApplicationLayout";
|
|
27
|
-
import DxcToggleGroup from "./toggle-group/ToggleGroup";
|
|
28
|
-
import DxcAccordionGroup from "./accordion-group/AccordionGroup";
|
|
29
|
-
import DxcBadge from "./badge/Badge";
|
|
30
|
-
import DxcTextInput from "./text-input/TextInput";
|
|
31
|
-
import DxcPasswordInput from "./password-input/PasswordInput";
|
|
32
|
-
import DxcDateInput from "./date-input/DateInput";
|
|
33
|
-
import DxcNumberInput from "./number-input/NumberInput";
|
|
34
|
-
import DxcTextarea from "./textarea/Textarea";
|
|
35
|
-
import DxcSelect from "./select/Select";
|
|
36
|
-
import DxcFileInput from "./file-input/FileInput";
|
|
37
|
-
import DxcStack from "./stack/Stack";
|
|
38
|
-
import DxcRow from "./row/Row";
|
|
39
|
-
import DxcText from "./text/Text";
|
|
40
|
-
import DxcList from "./list/List";
|
|
41
|
-
import DxcRadioGroup from "./radio-group/RadioGroup";
|
|
42
|
-
import DxcBleed from "./bleed/Bleed";
|
|
43
|
-
import DxcInset from "./inset/Inset";
|
|
44
|
-
import ThemeContext, { ThemeProvider } from "./ThemeContext";
|
|
45
|
-
import { BackgroundColorProvider } from "./BackgroundColorContext";
|
|
46
|
-
export { DxcAlert, DxcButton, DxcFooter, DxcCheckbox, DxcTextInput, DxcDropdown, DxcSwitch, DxcSlider, DxcRadio, DxcHeader, DxcTable, DxcTabs, DxcToggleGroup, DxcDialog, DxcCard, DxcProgressBar, DxcAccordion, DxcSpinner, DxcBox, DxcTag, DxcPaginator, DxcSidenav, DxcWizard, DxcLink, DxcHeading, DxcResultsetTable, DxcChip, DxcApplicationLayout, ThemeContext, ThemeProvider, BackgroundColorProvider, DxcAccordionGroup, DxcBadge, DxcPasswordInput, DxcDateInput, DxcNumberInput, DxcTextarea, DxcSelect, DxcFileInput, DxcStack, DxcRow, DxcText, DxcList, DxcRadioGroup, DxcBleed, DxcInset };
|