@pingux/astro 1.0.0-alpha.9 → 1.1.0-alpha.10

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 (142) hide show
  1. package/CHANGELOG.md +257 -0
  2. package/README.md +5 -0
  3. package/lib/cjs/components/AccordionGridGroup/AccordionGridGroup.stories.js +4 -11
  4. package/lib/cjs/components/AccordionGridGroup/AccordionGridGroup.test.js +24 -0
  5. package/lib/cjs/components/AccordionGridItem/AccordionGridItemBody.js +1 -1
  6. package/lib/cjs/components/AccordionGridItem/AccordionGridItemHeader.js +1 -1
  7. package/lib/cjs/components/AccordionGroup/AccordionGroup.test.js +33 -1
  8. package/lib/cjs/components/AccordionItem/AccordionItem.js +5 -4
  9. package/lib/cjs/components/Button/Button.js +6 -26
  10. package/lib/cjs/components/Button/Button.stories.js +7 -12
  11. package/lib/cjs/components/Button/Button.test.js +2 -25
  12. package/lib/cjs/components/Chip/Chip.js +26 -10
  13. package/lib/cjs/components/Chip/Chip.stories.js +44 -5
  14. package/lib/cjs/components/Chip/Chip.test.js +9 -0
  15. package/lib/cjs/components/{DropdownField/index.js → Chip/ChipContext.js} +8 -7
  16. package/lib/cjs/components/ColorField/ColorField.js +1 -0
  17. package/lib/cjs/components/ComboBoxField/ComboBoxField.js +7 -0
  18. package/lib/cjs/components/ComboBoxField/ComboBoxField.stories.js +25 -1
  19. package/lib/cjs/components/ComboBoxField/ComboBoxField.test.js +44 -0
  20. package/lib/cjs/components/FileInputField/FileItem.js +2 -1
  21. package/lib/cjs/components/IconButton/IconButton.js +17 -7
  22. package/lib/cjs/components/IconButton/IconButton.stories.js +8 -17
  23. package/lib/cjs/components/IconButton/IconButton.test.js +4 -6
  24. package/lib/cjs/components/ImageUploadField/ImagePreviewButton.js +2 -1
  25. package/lib/cjs/components/List/List.js +3 -0
  26. package/lib/cjs/components/List/List.stories.js +7 -2
  27. package/lib/cjs/components/ListBox/ListBox.js +3 -6
  28. package/lib/cjs/components/ListBox/ListBox.test.js +2 -0
  29. package/lib/cjs/components/ListBox/Option.js +6 -0
  30. package/lib/cjs/components/ListItem/ListItem.stories.js +0 -2
  31. package/lib/cjs/components/ListView/ListView.js +4 -3
  32. package/lib/cjs/components/ListView/ListView.stories.js +580 -39
  33. package/lib/cjs/components/ListViewItem/ListViewItem.js +3 -6
  34. package/lib/cjs/components/Messages/Message.js +2 -2
  35. package/lib/cjs/components/MultivaluesField/MultivaluesField.js +3 -2
  36. package/lib/cjs/components/OverlayPanel/OverlayPanel.stories.js +15 -14
  37. package/lib/cjs/components/PopoverContainer/PopoverContainer.test.js +15 -0
  38. package/lib/cjs/components/Stepper/Stepper.js +1 -0
  39. package/lib/cjs/components/Tab/Tab.js +5 -3
  40. package/lib/cjs/components/Tabs/Tabs.js +3 -0
  41. package/lib/cjs/components/Tabs/Tabs.stories.js +3 -4
  42. package/lib/cjs/components/Tabs/Tabs.test.js +44 -15
  43. package/lib/cjs/components/TextArea/TextArea.js +5 -1
  44. package/lib/cjs/components/TextAreaField/TextAreaField.test.js +10 -0
  45. package/lib/cjs/components/TooltipTrigger/TooltipTrigger.stories.js +45 -2
  46. package/lib/cjs/index.js +48 -136
  47. package/lib/cjs/layouts/ListLayout.stories.js +2 -1
  48. package/lib/cjs/layouts/SchemaFormLayout.stories.js +2 -21
  49. package/lib/cjs/recipes/ArrayField.stories.js +3 -3
  50. package/lib/cjs/styles/forms/input.js +4 -0
  51. package/lib/cjs/styles/theme.js +0 -3
  52. package/lib/cjs/styles/variants/accordion.js +7 -9
  53. package/lib/cjs/styles/variants/boxes.js +22 -19
  54. package/lib/cjs/styles/variants/buttons.js +48 -29
  55. package/lib/cjs/styles/variants/variants.js +0 -3
  56. package/lib/components/AccordionGridGroup/AccordionGridGroup.stories.js +4 -11
  57. package/lib/components/AccordionGridGroup/AccordionGridGroup.test.js +23 -1
  58. package/lib/components/AccordionGridItem/AccordionGridItemBody.js +1 -1
  59. package/lib/components/AccordionGridItem/AccordionGridItemHeader.js +1 -1
  60. package/lib/components/AccordionGroup/AccordionGroup.test.js +30 -1
  61. package/lib/components/AccordionItem/AccordionItem.js +6 -5
  62. package/lib/components/Button/Button.js +8 -26
  63. package/lib/components/Button/Button.stories.js +7 -11
  64. package/lib/components/Button/Button.test.js +2 -21
  65. package/lib/components/Chip/Chip.js +25 -10
  66. package/lib/components/Chip/Chip.stories.js +41 -5
  67. package/lib/components/Chip/Chip.test.js +9 -0
  68. package/lib/components/Chip/ChipContext.js +3 -0
  69. package/lib/components/ColorField/ColorField.js +1 -0
  70. package/lib/components/ComboBoxField/ComboBoxField.js +7 -0
  71. package/lib/components/ComboBoxField/ComboBoxField.stories.js +21 -0
  72. package/lib/components/ComboBoxField/ComboBoxField.test.js +35 -0
  73. package/lib/components/FileInputField/FileItem.js +2 -1
  74. package/lib/components/IconButton/IconButton.js +17 -9
  75. package/lib/components/IconButton/IconButton.stories.js +7 -13
  76. package/lib/components/IconButton/IconButton.test.js +4 -6
  77. package/lib/components/ImageUploadField/ImagePreviewButton.js +2 -1
  78. package/lib/components/List/List.js +2 -0
  79. package/lib/components/List/List.stories.js +6 -2
  80. package/lib/components/ListBox/ListBox.js +3 -5
  81. package/lib/components/ListBox/ListBox.test.js +2 -0
  82. package/lib/components/ListBox/Option.js +6 -0
  83. package/lib/components/ListItem/ListItem.stories.js +0 -2
  84. package/lib/components/ListView/ListView.js +4 -3
  85. package/lib/components/ListView/ListView.stories.js +577 -39
  86. package/lib/components/ListViewItem/ListViewItem.js +3 -5
  87. package/lib/components/Messages/Message.js +2 -2
  88. package/lib/components/MultivaluesField/MultivaluesField.js +3 -2
  89. package/lib/components/OverlayPanel/OverlayPanel.stories.js +7 -5
  90. package/lib/components/PopoverContainer/PopoverContainer.test.js +16 -1
  91. package/lib/components/Stepper/Stepper.js +1 -0
  92. package/lib/components/Tab/Tab.js +5 -3
  93. package/lib/components/Tabs/Tabs.js +3 -0
  94. package/lib/components/Tabs/Tabs.stories.js +3 -4
  95. package/lib/components/Tabs/Tabs.test.js +40 -15
  96. package/lib/components/TextArea/TextArea.js +5 -1
  97. package/lib/components/TextAreaField/TextAreaField.test.js +8 -0
  98. package/lib/components/TooltipTrigger/TooltipTrigger.stories.js +33 -1
  99. package/lib/index.js +0 -8
  100. package/lib/layouts/ListLayout.stories.js +2 -1
  101. package/lib/layouts/SchemaFormLayout.stories.js +2 -19
  102. package/lib/recipes/ArrayField.stories.js +3 -3
  103. package/lib/styles/forms/input.js +4 -0
  104. package/lib/styles/theme.js +0 -3
  105. package/lib/styles/variants/accordion.js +7 -9
  106. package/lib/styles/variants/boxes.js +21 -19
  107. package/lib/styles/variants/buttons.js +47 -29
  108. package/lib/styles/variants/variants.js +0 -2
  109. package/package.json +1 -1
  110. package/lib/cjs/components/Dropdown/Dropdown.js +0 -112
  111. package/lib/cjs/components/Dropdown/Dropdown.test.js +0 -80
  112. package/lib/cjs/components/Dropdown/index.js +0 -18
  113. package/lib/cjs/components/DropdownField/DropdownField.js +0 -187
  114. package/lib/cjs/components/DropdownField/DropdownField.stories.js +0 -278
  115. package/lib/cjs/components/DropdownField/DropdownField.test.js +0 -80
  116. package/lib/cjs/components/Panel/Panel.js +0 -101
  117. package/lib/cjs/components/Panel/Panel.stories.js +0 -57
  118. package/lib/cjs/components/Panel/Panel.test.js +0 -72
  119. package/lib/cjs/components/Panel/index.js +0 -18
  120. package/lib/cjs/components/Popover/Popover.js +0 -87
  121. package/lib/cjs/components/Popover/Popover.stories.js +0 -80
  122. package/lib/cjs/components/Popover/Popover.test.js +0 -91
  123. package/lib/cjs/components/Popover/index.js +0 -18
  124. package/lib/cjs/recipes/InputBoxWithLinkedChip.stories.js +0 -67
  125. package/lib/cjs/styles/variants/popover.js +0 -86
  126. package/lib/components/Dropdown/Dropdown.js +0 -90
  127. package/lib/components/Dropdown/Dropdown.test.js +0 -62
  128. package/lib/components/Dropdown/index.js +0 -1
  129. package/lib/components/DropdownField/DropdownField.js +0 -155
  130. package/lib/components/DropdownField/DropdownField.stories.js +0 -222
  131. package/lib/components/DropdownField/DropdownField.test.js +0 -60
  132. package/lib/components/DropdownField/index.js +0 -1
  133. package/lib/components/Panel/Panel.js +0 -71
  134. package/lib/components/Panel/Panel.stories.js +0 -35
  135. package/lib/components/Panel/Panel.test.js +0 -52
  136. package/lib/components/Panel/index.js +0 -1
  137. package/lib/components/Popover/Popover.js +0 -65
  138. package/lib/components/Popover/Popover.stories.js +0 -52
  139. package/lib/components/Popover/Popover.test.js +0 -75
  140. package/lib/components/Popover/index.js +0 -2
  141. package/lib/recipes/InputBoxWithLinkedChip.stories.js +0 -43
  142. package/lib/styles/variants/popover.js +0 -76
@@ -1,278 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireWildcard = require("@babel/runtime-corejs3/helpers/interopRequireWildcard");
4
-
5
- var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
6
-
7
- var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
8
-
9
- _Object$defineProperty(exports, "__esModule", {
10
- value: true
11
- });
12
-
13
- exports.WithoutStatusIndicator = exports.Transparent = exports.HelperText = exports.IsDisabled = exports.CustomNoneOption = exports.NoneOption = exports.WithOptionGroups = exports.Controlled = exports.DefaultValue = exports.DisabledFirstOption = exports.Default = exports["default"] = void 0;
14
-
15
- var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/slicedToArray"));
16
-
17
- var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
18
-
19
- var _react = _interopRequireWildcard(require("react"));
20
-
21
- var _ = _interopRequireDefault(require("."));
22
-
23
- var _Box = _interopRequireDefault(require("../Box/Box"));
24
-
25
- var _statuses = _interopRequireDefault(require("../../utils/devUtils/constants/statuses"));
26
-
27
- var _withDeprecationWarning = _interopRequireDefault(require("../../utils/devUtils/decorators/withDeprecationWarning"));
28
-
29
- var _react2 = require("@emotion/react");
30
-
31
- var _default = {
32
- title: 'Deprecated/DropdownField',
33
- component: _["default"],
34
- argTypes: {
35
- defaultValue: {},
36
- helperText: {
37
- control: {
38
- type: 'text'
39
- }
40
- },
41
- hintText: {
42
- control: {
43
- type: 'text'
44
- }
45
- },
46
- firstLabel: {},
47
- noneLabel: {},
48
- status: {
49
- control: {
50
- type: 'select',
51
- options: _statuses["default"]
52
- },
53
- defaultValue: _statuses["default"].DEFAULT
54
- },
55
- hasNoneOption: {},
56
- hasDisabledFirstOption: {},
57
- isRequired: {},
58
- hasAutoFocus: {},
59
- controlProps: {},
60
- id: {},
61
- 'aria-label': {
62
- control: {
63
- type: 'text'
64
- }
65
- },
66
- 'aria-labelledby': {
67
- control: {
68
- type: 'text'
69
- }
70
- },
71
- 'aria-describedby': {
72
- control: {
73
- type: 'text'
74
- }
75
- },
76
- 'aria-details': {
77
- control: {
78
- type: 'text'
79
- }
80
- },
81
- value: {
82
- control: {
83
- type: 'none'
84
- }
85
- }
86
- },
87
- decorators: [function (Story, context) {
88
- return (0, _withDeprecationWarning["default"])(Story, context, '`DropdownField` will be deprecated in Astro-UI 1.0.0, use `SelectField` instead.');
89
- }]
90
- };
91
- exports["default"] = _default;
92
-
93
- var Default = function Default(args) {
94
- return (0, _react2.jsx)(_["default"], (0, _extends2["default"])({}, args, {
95
- label: "Select one"
96
- }), (0, _react2.jsx)("option", {
97
- value: "1"
98
- }, "Option 1"), (0, _react2.jsx)("option", {
99
- value: "2"
100
- }, "Option 2"), (0, _react2.jsx)("option", {
101
- value: "3"
102
- }, "Option 3"));
103
- };
104
-
105
- exports.Default = Default;
106
-
107
- var DisabledFirstOption = function DisabledFirstOption(args) {
108
- return (0, _react2.jsx)(_["default"], (0, _extends2["default"])({}, args, {
109
- label: "Select one",
110
- hasDisabledFirstOption: true
111
- }), (0, _react2.jsx)("option", {
112
- value: "1"
113
- }, "Option 1"), (0, _react2.jsx)("option", {
114
- value: "2"
115
- }, "Option 2"), (0, _react2.jsx)("option", {
116
- value: "3"
117
- }, "Option 3"));
118
- };
119
-
120
- exports.DisabledFirstOption = DisabledFirstOption;
121
-
122
- var DefaultValue = function DefaultValue(args) {
123
- return (0, _react2.jsx)(_["default"], (0, _extends2["default"])({}, args, {
124
- label: "Select one",
125
- defaultValue: "2"
126
- }), (0, _react2.jsx)("option", {
127
- value: "1"
128
- }, "Option 1"), (0, _react2.jsx)("option", {
129
- value: "2"
130
- }, "Option 2"), (0, _react2.jsx)("option", {
131
- value: "3"
132
- }, "Option 3"));
133
- };
134
-
135
- exports.DefaultValue = DefaultValue;
136
-
137
- var Controlled = function Controlled(args) {
138
- var _useState = (0, _react.useState)('3'),
139
- _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
140
- selected = _useState2[0],
141
- setSelected = _useState2[1];
142
-
143
- return (0, _react2.jsx)(_["default"], (0, _extends2["default"])({}, args, {
144
- label: "Select one",
145
- value: selected,
146
- onChange: function onChange(e) {
147
- return setSelected(e.target.value);
148
- }
149
- }), (0, _react2.jsx)("option", {
150
- value: "1"
151
- }, "Option 1"), (0, _react2.jsx)("option", {
152
- value: "2"
153
- }, "Option 2"), (0, _react2.jsx)("option", {
154
- value: "3"
155
- }, "Option 3"));
156
- };
157
-
158
- exports.Controlled = Controlled;
159
-
160
- var WithOptionGroups = function WithOptionGroups(args) {
161
- return (0, _react2.jsx)(_["default"], (0, _extends2["default"])({}, args, {
162
- label: "Select one"
163
- }), (0, _react2.jsx)("optgroup", {
164
- label: "Cheeses"
165
- }, (0, _react2.jsx)("option", {
166
- value: "brie"
167
- }, "Brie"), (0, _react2.jsx)("option", {
168
- value: "gouda"
169
- }, "Gouda"), (0, _react2.jsx)("option", {
170
- value: "swiss"
171
- }, "Swiss")), (0, _react2.jsx)("optgroup", {
172
- label: "Breads"
173
- }, (0, _react2.jsx)("option", {
174
- value: "sourdough"
175
- }, "Sourdough"), (0, _react2.jsx)("option", {
176
- value: "rye"
177
- }, "Rye"), (0, _react2.jsx)("option", {
178
- value: "focaccia"
179
- }, "Focaccia")));
180
- };
181
-
182
- exports.WithOptionGroups = WithOptionGroups;
183
-
184
- var NoneOption = function NoneOption(args) {
185
- return (0, _react2.jsx)(_["default"], (0, _extends2["default"])({}, args, {
186
- label: "Select one",
187
- hasNoneOption: true
188
- }), (0, _react2.jsx)("option", {
189
- value: "1"
190
- }, "Option 1"), (0, _react2.jsx)("option", {
191
- value: "2"
192
- }, "Option 2"), (0, _react2.jsx)("option", {
193
- value: "3"
194
- }, "Option 3"));
195
- };
196
-
197
- exports.NoneOption = NoneOption;
198
-
199
- var CustomNoneOption = function CustomNoneOption(args) {
200
- return (0, _react2.jsx)(_["default"], (0, _extends2["default"])({}, args, {
201
- label: "Select one",
202
- hasNoneOption: true,
203
- hasDisabledFirstOption: true,
204
- noneLabel: "None"
205
- }), (0, _react2.jsx)("option", {
206
- value: "1"
207
- }, "Option 1"), (0, _react2.jsx)("option", {
208
- value: "2"
209
- }, "Option 2"), (0, _react2.jsx)("option", {
210
- value: "3"
211
- }, "Option 3"));
212
- };
213
-
214
- exports.CustomNoneOption = CustomNoneOption;
215
-
216
- var IsDisabled = function IsDisabled(args) {
217
- return (0, _react2.jsx)(_["default"], (0, _extends2["default"])({}, args, {
218
- label: "Select one",
219
- isDisabled: true
220
- }), (0, _react2.jsx)("option", {
221
- value: "1"
222
- }, "Option 1"), (0, _react2.jsx)("option", {
223
- value: "2"
224
- }, "Option 2"), (0, _react2.jsx)("option", {
225
- value: "3"
226
- }, "Option 3"));
227
- };
228
-
229
- exports.IsDisabled = IsDisabled;
230
-
231
- var HelperText = function HelperText(args) {
232
- return (0, _react2.jsx)(_["default"], (0, _extends2["default"])({
233
- label: "Select one",
234
- helperText: "Here is some helpful text...",
235
- status: "error"
236
- }, args), (0, _react2.jsx)("option", {
237
- value: "1"
238
- }, "Option 1"), (0, _react2.jsx)("option", {
239
- value: "2"
240
- }, "Option 2"), (0, _react2.jsx)("option", {
241
- value: "3"
242
- }, "Option 3"));
243
- };
244
-
245
- exports.HelperText = HelperText;
246
-
247
- var Transparent = function Transparent(args) {
248
- return (0, _react2.jsx)(_Box["default"], {
249
- bg: "neutral.90",
250
- p: 20
251
- }, (0, _react2.jsx)(_["default"], (0, _extends2["default"])({}, args, {
252
- label: "Select one",
253
- variant: "forms.select.transparent"
254
- }), (0, _react2.jsx)("option", {
255
- value: "1"
256
- }, "Option 1"), (0, _react2.jsx)("option", {
257
- value: "2"
258
- }, "Option 2"), (0, _react2.jsx)("option", {
259
- value: "3"
260
- }, "Option 3")));
261
- };
262
-
263
- exports.Transparent = Transparent;
264
-
265
- var WithoutStatusIndicator = function WithoutStatusIndicator(args) {
266
- return (0, _react2.jsx)(_["default"], (0, _extends2["default"])({}, args, {
267
- label: "Select one",
268
- hasNoStatusIndicator: true
269
- }), (0, _react2.jsx)("option", {
270
- value: "1"
271
- }, "Option 1"), (0, _react2.jsx)("option", {
272
- value: "2"
273
- }, "Option 2"), (0, _react2.jsx)("option", {
274
- value: "3"
275
- }, "Option 3"));
276
- };
277
-
278
- exports.WithoutStatusIndicator = WithoutStatusIndicator;
@@ -1,80 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
4
-
5
- var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
6
-
7
- var _react = _interopRequireDefault(require("react"));
8
-
9
- var _react2 = require("@testing-library/react");
10
-
11
- var _DropdownField = _interopRequireDefault(require("./DropdownField"));
12
-
13
- var _testAxe = _interopRequireDefault(require("../../utils/testUtils/testAxe"));
14
-
15
- var _react3 = require("@emotion/react");
16
-
17
- var testId = 'test-dropdown';
18
- var defaultProps = {
19
- 'data-testid': testId,
20
- controlProps: {
21
- 'data-testid': "".concat(testId, "-input")
22
- },
23
- label: 'testLabel'
24
- };
25
-
26
- var getComponent = function getComponent() {
27
- var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
28
- return (0, _react2.render)((0, _react3.jsx)(_DropdownField["default"], (0, _extends2["default"])({}, defaultProps, props), (0, _react3.jsx)("option", {
29
- value: "a"
30
- }, "A"), (0, _react3.jsx)("option", {
31
- value: "b"
32
- }, "B")));
33
- };
34
-
35
- afterEach(function () {
36
- jest.restoreAllMocks();
37
- }); // Need to be added to each test file to test accessibility using axe.
38
-
39
- (0, _testAxe["default"])(getComponent);
40
- test('default dropdownfield', function () {
41
- getComponent();
42
-
43
- var container = _react2.screen.getByTestId(testId);
44
-
45
- var input = _react2.screen.getByLabelText('testLabel');
46
-
47
- var label = _react2.screen.getByText('testLabel');
48
-
49
- expect(container).toBeInstanceOf(HTMLDivElement);
50
- expect(input).toBeInstanceOf(HTMLSelectElement);
51
- expect(label).toBeInstanceOf(HTMLLabelElement);
52
- expect(container).toBeInTheDocument();
53
- expect(input).toBeInTheDocument();
54
- expect(label).toBeInTheDocument();
55
- });
56
- test('disabled prop disables dropdown input', function () {
57
- getComponent({
58
- isDisabled: true
59
- });
60
-
61
- var dropdown = _react2.screen.getByRole('combobox');
62
-
63
- expect(dropdown).toBeDisabled();
64
- });
65
- test('input is not disabled without disabled prop', function () {
66
- getComponent();
67
-
68
- var dropdown = _react2.screen.getByRole('combobox');
69
-
70
- expect(dropdown).toBeEnabled();
71
- });
72
- test('displays helper text when helperText prop is passed', function () {
73
- getComponent({
74
- helperText: 'helper text!'
75
- });
76
-
77
- var label = _react2.screen.getByText('helper text!');
78
-
79
- expect(label).toBeInTheDocument();
80
- });
@@ -1,101 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireWildcard = require("@babel/runtime-corejs3/helpers/interopRequireWildcard");
4
-
5
- var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
6
-
7
- var _Object$defineProperty2 = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
8
-
9
- _Object$defineProperty2(exports, "__esModule", {
10
- value: true
11
- });
12
-
13
- exports["default"] = void 0;
14
-
15
- var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/define-property"));
16
-
17
- var _defineProperties = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/define-properties"));
18
-
19
- var _getOwnPropertyDescriptors = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors"));
20
-
21
- var _forEach = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/for-each"));
22
-
23
- var _getOwnPropertyDescriptor = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor"));
24
-
25
- var _filter = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/filter"));
26
-
27
- var _getOwnPropertySymbols = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols"));
28
-
29
- var _keys = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/keys"));
30
-
31
- var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
32
-
33
- var _defineProperty3 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
34
-
35
- var _react = _interopRequireWildcard(require("react"));
36
-
37
- var _propTypes = _interopRequireDefault(require("prop-types"));
38
-
39
- var _focus = require("@react-aria/focus");
40
-
41
- var _hooks = require("../../hooks");
42
-
43
- var _Box = _interopRequireDefault(require("../Box"));
44
-
45
- var _ScrollBox = _interopRequireDefault(require("../ScrollBox"));
46
-
47
- var _react2 = require("@emotion/react");
48
-
49
- function ownKeys(object, enumerableOnly) { var keys = (0, _keys["default"])(object); if (_getOwnPropertySymbols["default"]) { var symbols = (0, _getOwnPropertySymbols["default"])(object); if (enumerableOnly) symbols = (0, _filter["default"])(symbols).call(symbols, function (sym) { return (0, _getOwnPropertyDescriptor["default"])(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
50
-
51
- function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { var _context; (0, _forEach["default"])(_context = ownKeys(Object(source), true)).call(_context, function (key) { (0, _defineProperty3["default"])(target, key, source[key]); }); } else if (_getOwnPropertyDescriptors["default"]) { (0, _defineProperties["default"])(target, (0, _getOwnPropertyDescriptors["default"])(source)); } else { var _context2; (0, _forEach["default"])(_context2 = ownKeys(Object(source))).call(_context2, function (key) { (0, _defineProperty2["default"])(target, key, (0, _getOwnPropertyDescriptor["default"])(source, key)); }); } } return target; }
52
-
53
- /**
54
- * **WARNING: Panel will be deprecated in Astro 1.0.0, use `OverlayPanel` instead.**
55
- *
56
- */
57
- var Panel = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
58
- var className = props.className,
59
- children = props.children,
60
- isVisible = props.isVisible,
61
- sx = props.sx,
62
- width = props.width,
63
- scrollBoxProps = props.scrollBoxProps;
64
-
65
- var _useFocusRing = (0, _focus.useFocusRing)(),
66
- isFocusVisible = _useFocusRing.isFocusVisible,
67
- focusProps = _useFocusRing.focusProps;
68
-
69
- var _useStatusClasses = (0, _hooks.useStatusClasses)(className, {
70
- isFocused: isFocusVisible,
71
- isVisible: isVisible
72
- }),
73
- classNames = _useStatusClasses.classNames;
74
-
75
- var dynamicStyles = {
76
- marginRight: isVisible ? 0 : "-".concat(width)
77
- };
78
- (0, _hooks.useDeprecationWarning)('`Panel` will be deprecated in Astro-UI 1.0.0, use `OverflowPanel` instead.');
79
- return (0, _react2.jsx)(_Box["default"], (0, _extends2["default"])({
80
- className: classNames,
81
- ref: ref,
82
- tabIndex: isVisible ? 0 : -1,
83
- variant: "boxes.panel"
84
- }, props, focusProps, {
85
- sx: _objectSpread(_objectSpread({}, dynamicStyles), sx)
86
- }), isVisible && (0, _react2.jsx)(_ScrollBox["default"], scrollBoxProps, children));
87
- });
88
- Panel.propTypes = {
89
- isVisible: _propTypes["default"].bool,
90
- width: _propTypes["default"].oneOfType([_propTypes["default"].number, _propTypes["default"].string]),
91
-
92
- /** Props object that is spread directly into the ScrollBox element. */
93
- scrollBoxProps: _propTypes["default"].shape({})
94
- };
95
- Panel.defaultProps = {
96
- width: '100%',
97
- isVisible: false
98
- };
99
- Panel.displayName = 'Panel';
100
- var _default = Panel;
101
- exports["default"] = _default;
@@ -1,57 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
4
-
5
- var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
6
-
7
- _Object$defineProperty(exports, "__esModule", {
8
- value: true
9
- });
10
-
11
- exports.Default = exports["default"] = void 0;
12
-
13
- var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
14
-
15
- var _react = _interopRequireDefault(require("react"));
16
-
17
- var _Box = _interopRequireDefault(require("../Box"));
18
-
19
- var _Text = _interopRequireDefault(require("../Text"));
20
-
21
- var _ = _interopRequireDefault(require("."));
22
-
23
- var _withDeprecationWarning = _interopRequireDefault(require("../../utils/devUtils/decorators/withDeprecationWarning"));
24
-
25
- var _react2 = require("@emotion/react");
26
-
27
- var _default = {
28
- title: 'Deprecated/Panel',
29
- component: _["default"],
30
- argTypes: {
31
- isVisible: {
32
- defaultValue: false,
33
- description: 'Toggle panel.'
34
- },
35
- width: {
36
- control: {
37
- type: 'text'
38
- },
39
- description: 'Width of panel.'
40
- }
41
- },
42
- decorators: [function (Story, context) {
43
- return (0, _withDeprecationWarning["default"])(Story, context, '`Panel` will be deprecated in Astro-UI 1.0.0, use `OverlayPanel` instead.');
44
- }]
45
- };
46
- exports["default"] = _default;
47
-
48
- var Default = function Default(_ref) {
49
- var args = (0, _extends2["default"])({}, _ref);
50
- return (0, _react2.jsx)(_Box["default"], null, (0, _react2.jsx)(_Box["default"], {
51
- isRow: true
52
- }, (0, _react2.jsx)(_Box["default"], {
53
- flexGrow: 1
54
- }, (0, _react2.jsx)(_Text["default"], null, "Reveal panel with toggle below.")), (0, _react2.jsx)(_["default"], args, "Panel content goes here.")));
55
- };
56
-
57
- exports.Default = Default;
@@ -1,72 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
4
-
5
- var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
6
-
7
- var _react = _interopRequireDefault(require("react"));
8
-
9
- var _userEvent = _interopRequireDefault(require("@testing-library/user-event"));
10
-
11
- var _testAxe = _interopRequireDefault(require("../../utils/testUtils/testAxe"));
12
-
13
- var _testWrapper = require("../../utils/testUtils/testWrapper");
14
-
15
- var _ = _interopRequireDefault(require("."));
16
-
17
- var _react2 = require("@emotion/react");
18
-
19
- var testId = 'test-panel';
20
- var defaultProps = {
21
- 'data-testid': testId
22
- };
23
-
24
- var getComponent = function getComponent() {
25
- var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
26
- return (0, _testWrapper.render)((0, _react2.jsx)(_["default"], (0, _extends2["default"])({}, defaultProps, props)));
27
- };
28
-
29
- afterEach(function () {
30
- jest.restoreAllMocks();
31
- }); // Need to be added to each test file to test accessibility using axe.
32
-
33
- (0, _testAxe["default"])(getComponent);
34
- test('default panel', function () {
35
- getComponent({
36
- children: (0, _react2.jsx)("div", null, "Test")
37
- });
38
-
39
- var panel = _testWrapper.screen.getByTestId(testId);
40
-
41
- var child = _testWrapper.screen.queryByText('Test');
42
-
43
- expect(panel).toBeInTheDocument();
44
- expect(child).not.toBeInTheDocument();
45
- expect(panel).toHaveAttribute('tabIndex', '-1');
46
- });
47
- test('panel when visible', function () {
48
- getComponent({
49
- isVisible: true,
50
- children: (0, _react2.jsx)("div", null, "Test")
51
- });
52
-
53
- var panel = _testWrapper.screen.getByTestId(testId);
54
-
55
- var child = _testWrapper.screen.queryByText('Test');
56
-
57
- expect(panel).toBeInTheDocument();
58
- expect(child).toBeInTheDocument();
59
- expect(panel).toHaveAttribute('tabIndex', '0');
60
- });
61
- test('panel with focus', function () {
62
- getComponent({
63
- isVisible: true,
64
- children: (0, _react2.jsx)("div", null, "Test")
65
- });
66
-
67
- var panel = _testWrapper.screen.getByTestId(testId);
68
-
69
- _userEvent["default"].tab();
70
-
71
- expect(panel).toHaveFocus();
72
- });
@@ -1,18 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
4
-
5
- var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
6
-
7
- _Object$defineProperty(exports, "__esModule", {
8
- value: true
9
- });
10
-
11
- _Object$defineProperty(exports, "default", {
12
- enumerable: true,
13
- get: function get() {
14
- return _Panel["default"];
15
- }
16
- });
17
-
18
- var _Panel = _interopRequireDefault(require("./Panel"));