@pingux/astro 1.0.0-alpha.6 → 1.1.0-alpha.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 (113) hide show
  1. package/CHANGELOG.md +186 -0
  2. package/README.md +5 -0
  3. package/lib/cjs/components/AccordionGridGroup/AccordionGridGroup.stories.js +4 -11
  4. package/lib/cjs/components/AccordionItem/AccordionItem.js +3 -1
  5. package/lib/cjs/components/Button/Button.js +5 -24
  6. package/lib/cjs/components/Button/Button.stories.js +5 -11
  7. package/lib/cjs/components/Button/Button.test.js +0 -24
  8. package/lib/cjs/components/Chip/Chip.js +26 -10
  9. package/lib/cjs/components/Chip/Chip.stories.js +44 -5
  10. package/lib/cjs/components/Chip/Chip.test.js +9 -0
  11. package/lib/cjs/components/{Panel/index.js → Chip/ChipContext.js} +8 -7
  12. package/lib/cjs/components/CopyText/CopyText.js +3 -73
  13. package/lib/cjs/components/IconButton/IconButton.js +17 -7
  14. package/lib/cjs/components/IconButton/IconButton.test.js +0 -1
  15. package/lib/cjs/components/ListItem/ListItem.stories.js +0 -2
  16. package/lib/cjs/components/ListView/ListView.js +4 -3
  17. package/lib/cjs/components/ListViewItem/ListViewItem.js +3 -6
  18. package/lib/cjs/components/MultivaluesField/MultivaluesField.js +1 -1
  19. package/lib/cjs/components/Stepper/Stepper.js +1 -0
  20. package/lib/cjs/components/Tab/Tab.js +15 -6
  21. package/lib/cjs/components/Tabs/Tabs.js +7 -1
  22. package/lib/cjs/components/Tabs/Tabs.stories.js +60 -6
  23. package/lib/cjs/components/Tabs/Tabs.test.js +78 -15
  24. package/lib/cjs/components/TextAreaField/TextAreaField.test.js +10 -0
  25. package/lib/cjs/components/TooltipTrigger/TooltipTrigger.stories.js +45 -2
  26. package/lib/cjs/{components/DropdownField → hooks/useCopyToClipboard}/index.js +2 -2
  27. package/lib/cjs/hooks/useCopyToClipboard/useCopyToClipboard.js +83 -0
  28. package/lib/cjs/hooks/useCopyToClipboard/useCopyToClipboard.test.js +79 -0
  29. package/lib/cjs/index.js +48 -136
  30. package/lib/cjs/layouts/ListLayout.stories.js +2 -1
  31. package/lib/cjs/layouts/SchemaFormLayout.stories.js +2 -21
  32. package/lib/cjs/recipes/ArrayField.stories.js +3 -3
  33. package/lib/cjs/recipes/CopyToClipboard.stories.js +45 -0
  34. package/lib/cjs/recipes/RadioButtonsWithLinks.stories.js +146 -0
  35. package/lib/cjs/styles/forms/input.js +4 -0
  36. package/lib/cjs/styles/theme.js +0 -3
  37. package/lib/cjs/styles/variants/accordion.js +7 -9
  38. package/lib/cjs/styles/variants/boxes.js +22 -19
  39. package/lib/cjs/styles/variants/buttons.js +38 -29
  40. package/lib/cjs/styles/variants/tabs.js +1 -0
  41. package/lib/cjs/styles/variants/variants.js +0 -3
  42. package/lib/components/AccordionGridGroup/AccordionGridGroup.stories.js +4 -11
  43. package/lib/components/AccordionItem/AccordionItem.js +3 -1
  44. package/lib/components/Button/Button.js +7 -24
  45. package/lib/components/Button/Button.stories.js +5 -10
  46. package/lib/components/Button/Button.test.js +0 -20
  47. package/lib/components/Chip/Chip.js +25 -10
  48. package/lib/components/Chip/Chip.stories.js +41 -5
  49. package/lib/components/Chip/Chip.test.js +9 -0
  50. package/lib/components/Chip/ChipContext.js +3 -0
  51. package/lib/components/CopyText/CopyText.js +2 -71
  52. package/lib/components/IconButton/IconButton.js +17 -9
  53. package/lib/components/IconButton/IconButton.test.js +0 -1
  54. package/lib/components/ListItem/ListItem.stories.js +0 -2
  55. package/lib/components/ListView/ListView.js +4 -3
  56. package/lib/components/ListViewItem/ListViewItem.js +3 -5
  57. package/lib/components/MultivaluesField/MultivaluesField.js +1 -1
  58. package/lib/components/Stepper/Stepper.js +1 -0
  59. package/lib/components/Tab/Tab.js +15 -6
  60. package/lib/components/Tabs/Tabs.js +7 -1
  61. package/lib/components/Tabs/Tabs.stories.js +56 -4
  62. package/lib/components/Tabs/Tabs.test.js +78 -15
  63. package/lib/components/TextAreaField/TextAreaField.test.js +8 -0
  64. package/lib/components/TooltipTrigger/TooltipTrigger.stories.js +33 -1
  65. package/lib/hooks/useCopyToClipboard/index.js +1 -0
  66. package/lib/hooks/useCopyToClipboard/useCopyToClipboard.js +69 -0
  67. package/lib/hooks/useCopyToClipboard/useCopyToClipboard.test.js +64 -0
  68. package/lib/index.js +0 -8
  69. package/lib/layouts/ListLayout.stories.js +2 -1
  70. package/lib/layouts/SchemaFormLayout.stories.js +2 -19
  71. package/lib/recipes/ArrayField.stories.js +3 -3
  72. package/lib/recipes/CopyToClipboard.stories.js +25 -0
  73. package/lib/recipes/RadioButtonsWithLinks.stories.js +120 -0
  74. package/lib/styles/forms/input.js +4 -0
  75. package/lib/styles/theme.js +0 -3
  76. package/lib/styles/variants/accordion.js +7 -9
  77. package/lib/styles/variants/boxes.js +21 -19
  78. package/lib/styles/variants/buttons.js +37 -29
  79. package/lib/styles/variants/tabs.js +1 -0
  80. package/lib/styles/variants/variants.js +0 -2
  81. package/package.json +2 -2
  82. package/lib/cjs/components/Dropdown/Dropdown.js +0 -112
  83. package/lib/cjs/components/Dropdown/Dropdown.test.js +0 -80
  84. package/lib/cjs/components/Dropdown/index.js +0 -18
  85. package/lib/cjs/components/DropdownField/DropdownField.js +0 -187
  86. package/lib/cjs/components/DropdownField/DropdownField.stories.js +0 -278
  87. package/lib/cjs/components/DropdownField/DropdownField.test.js +0 -80
  88. package/lib/cjs/components/Panel/Panel.js +0 -101
  89. package/lib/cjs/components/Panel/Panel.stories.js +0 -57
  90. package/lib/cjs/components/Panel/Panel.test.js +0 -72
  91. package/lib/cjs/components/Popover/Popover.js +0 -87
  92. package/lib/cjs/components/Popover/Popover.stories.js +0 -80
  93. package/lib/cjs/components/Popover/Popover.test.js +0 -91
  94. package/lib/cjs/components/Popover/index.js +0 -18
  95. package/lib/cjs/recipes/InputBoxWithLinkedChip.stories.js +0 -67
  96. package/lib/cjs/styles/variants/popover.js +0 -86
  97. package/lib/components/Dropdown/Dropdown.js +0 -90
  98. package/lib/components/Dropdown/Dropdown.test.js +0 -62
  99. package/lib/components/Dropdown/index.js +0 -1
  100. package/lib/components/DropdownField/DropdownField.js +0 -155
  101. package/lib/components/DropdownField/DropdownField.stories.js +0 -222
  102. package/lib/components/DropdownField/DropdownField.test.js +0 -60
  103. package/lib/components/DropdownField/index.js +0 -1
  104. package/lib/components/Panel/Panel.js +0 -71
  105. package/lib/components/Panel/Panel.stories.js +0 -35
  106. package/lib/components/Panel/Panel.test.js +0 -52
  107. package/lib/components/Panel/index.js +0 -1
  108. package/lib/components/Popover/Popover.js +0 -65
  109. package/lib/components/Popover/Popover.stories.js +0 -52
  110. package/lib/components/Popover/Popover.test.js +0 -75
  111. package/lib/components/Popover/index.js +0 -2
  112. package/lib/recipes/InputBoxWithLinkedChip.stories.js +0 -43
  113. 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,87 +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["default"] = void 0;
14
-
15
- var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
16
-
17
- var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/objectWithoutProperties"));
18
-
19
- var _react = _interopRequireWildcard(require("react"));
20
-
21
- var _headless = _interopRequireDefault(require("@tippyjs/react/headless"));
22
-
23
- var _propTypes = _interopRequireDefault(require("prop-types"));
24
-
25
- var _Box = _interopRequireDefault(require("../Box"));
26
-
27
- var _hooks = require("../../hooks");
28
-
29
- var _react2 = require("@emotion/react");
30
-
31
- // TODO: popover-deprecate Remove when popover is deprecated in 1.0.0.
32
- // Replace with PopoverContainer
33
-
34
- /**
35
- * **WARNING: Will be deprecated in Astro 1.0.0, use `PopoverMenu` instead.**
36
- *
37
- * Popover component used for popover button menus and help hints.
38
- * Built using Tippy.js [Tippy.js](https://atomiks.github.io/tippyjs/) and uses the
39
- * available [props from Tippy.js](https://atomiks.github.io/tippyjs/v6/all-props/).
40
- */
41
- var Popover = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
42
- var content = props.content,
43
- trigger = props.trigger,
44
- others = (0, _objectWithoutProperties2["default"])(props, ["content", "trigger"]);
45
- (0, _hooks.useDeprecationWarning)('`Popover` will be deprecated in Astro-UI 1.0.0, use `PopoverMenu` for menus instead. Or `Tooltip` when it is available.');
46
- return (0, _react2.jsx)(_headless["default"], (0, _extends2["default"])({
47
- ref: ref,
48
- interactive: true,
49
- render: function render(attrs) {
50
- return (0, _react2.jsx)(_Box["default"], (0, _extends2["default"])({}, attrs, {
51
- variant: "popover.container"
52
- }), (0, _react2.jsx)(_Box["default"], {
53
- role: "tooltip",
54
- variant: "popover.content"
55
- }, content), (0, _react2.jsx)(_Box["default"], {
56
- className: "tippy-arrow",
57
- "data-popper-arrow": "",
58
- variant: "popover.arrow"
59
- }));
60
- }
61
- }, trigger && {
62
- trigger: trigger
63
- }, others));
64
- });
65
- Popover.propTypes = {
66
- /** The content of the popover. */
67
- content: _propTypes["default"].node,
68
-
69
- /** Placement of the popover. Note that TippyJs's flip modifier can change this
70
- * to the opposite placement if it has more space. [More information on placement](https://atomiks.github.io/tippyjs/v6/all-props/#placement) */
71
- placement: _propTypes["default"].string,
72
-
73
- /** Determines the events that cause the tooltip to show.
74
- * Multiple event names are separated by spaces.
75
- * [More information on trigger](https://atomiks.github.io/tippyjs/v6/all-props/#trigger) */
76
- trigger: _propTypes["default"].string,
77
-
78
- /** Delay in ms once a trigger event is fired before a popover shows or hides.
79
- * [More information on delay](https://atomiks.github.io/tippyjs/v6/all-props/#delay) */
80
- delay: _propTypes["default"].oneOfType([_propTypes["default"].number, _propTypes["default"].arrayOf([_propTypes["default"].number])])
81
- };
82
- Popover.defaultProps = {
83
- placement: 'top',
84
- trigger: 'mouseenter focus'
85
- };
86
- var _default = Popover;
87
- exports["default"] = _default;