@pingux/astro 1.0.1 → 1.1.0-alpha.11
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/CHANGELOG.md +137 -0
- package/lib/cjs/components/AccordionGridGroup/AccordionGridGroup.test.js +24 -0
- package/lib/cjs/components/AccordionGridItem/AccordionGridItemBody.js +1 -1
- package/lib/cjs/components/AccordionGridItem/AccordionGridItemHeader.js +1 -1
- package/lib/cjs/components/AccordionGroup/AccordionGroup.test.js +33 -1
- package/lib/cjs/components/AccordionItem/AccordionItem.js +5 -4
- package/lib/cjs/components/Button/Button.js +1 -2
- package/lib/cjs/components/Button/Button.stories.js +2 -1
- package/lib/cjs/components/Button/Button.test.js +2 -1
- package/lib/cjs/components/ColorField/ColorField.js +1 -0
- package/lib/cjs/components/ComboBoxField/ComboBoxField.js +7 -0
- package/lib/cjs/components/ComboBoxField/ComboBoxField.stories.js +25 -1
- package/lib/cjs/components/ComboBoxField/ComboBoxField.test.js +44 -0
- package/lib/cjs/components/FileInputField/FileItem.js +2 -1
- package/lib/cjs/components/IconButton/IconButton.js +1 -1
- package/lib/cjs/components/IconButton/IconButton.stories.js +8 -17
- package/lib/cjs/components/IconButton/IconButton.test.js +4 -5
- package/lib/cjs/components/ImageUploadField/ImagePreviewButton.js +2 -1
- package/lib/cjs/components/List/List.js +3 -0
- package/lib/cjs/components/List/List.stories.js +7 -2
- package/lib/cjs/components/ListBox/ListBox.js +3 -6
- package/lib/cjs/components/ListBox/ListBox.test.js +2 -0
- package/lib/cjs/components/ListBox/Option.js +6 -0
- package/lib/cjs/components/ListView/ListView.stories.js +580 -39
- package/lib/cjs/components/Messages/Message.js +2 -2
- package/lib/cjs/components/MultivaluesField/MultivaluesField.js +3 -2
- package/lib/cjs/components/OverlayPanel/OverlayPanel.stories.js +15 -14
- package/lib/cjs/components/PopoverContainer/PopoverContainer.test.js +15 -0
- package/lib/cjs/components/TextArea/TextArea.js +5 -1
- package/lib/cjs/components/TooltipTrigger/TooltipTrigger.stories.js +45 -2
- package/lib/cjs/styles/variants/accordion.js +2 -2
- package/lib/cjs/styles/variants/boxes.js +2 -1
- package/lib/cjs/styles/variants/buttons.js +47 -2
- package/lib/components/AccordionGridGroup/AccordionGridGroup.test.js +23 -1
- package/lib/components/AccordionGridItem/AccordionGridItemBody.js +1 -1
- package/lib/components/AccordionGridItem/AccordionGridItemHeader.js +1 -1
- package/lib/components/AccordionGroup/AccordionGroup.test.js +30 -1
- package/lib/components/AccordionItem/AccordionItem.js +6 -5
- package/lib/components/Button/Button.js +2 -3
- package/lib/components/Button/Button.stories.js +2 -1
- package/lib/components/Button/Button.test.js +2 -1
- package/lib/components/ColorField/ColorField.js +1 -0
- package/lib/components/ComboBoxField/ComboBoxField.js +7 -0
- package/lib/components/ComboBoxField/ComboBoxField.stories.js +21 -0
- package/lib/components/ComboBoxField/ComboBoxField.test.js +35 -0
- package/lib/components/FileInputField/FileItem.js +2 -1
- package/lib/components/IconButton/IconButton.js +1 -1
- package/lib/components/IconButton/IconButton.stories.js +7 -13
- package/lib/components/IconButton/IconButton.test.js +4 -5
- package/lib/components/ImageUploadField/ImagePreviewButton.js +2 -1
- package/lib/components/List/List.js +2 -0
- package/lib/components/List/List.stories.js +6 -2
- package/lib/components/ListBox/ListBox.js +3 -5
- package/lib/components/ListBox/ListBox.test.js +2 -0
- package/lib/components/ListBox/Option.js +6 -0
- package/lib/components/ListView/ListView.stories.js +577 -39
- package/lib/components/Messages/Message.js +2 -2
- package/lib/components/MultivaluesField/MultivaluesField.js +3 -2
- package/lib/components/OverlayPanel/OverlayPanel.stories.js +7 -5
- package/lib/components/PopoverContainer/PopoverContainer.test.js +16 -1
- package/lib/components/TextArea/TextArea.js +5 -1
- package/lib/components/TooltipTrigger/TooltipTrigger.stories.js +33 -1
- package/lib/styles/variants/accordion.js +2 -2
- package/lib/styles/variants/boxes.js +1 -1
- package/lib/styles/variants/buttons.js +46 -2
- package/package.json +1 -1
@@ -35,29 +35,23 @@ export default {
|
|
35
35
|
isDisabled: {},
|
36
36
|
variant: {
|
37
37
|
control: {
|
38
|
-
type: '
|
39
|
-
|
38
|
+
type: 'select',
|
39
|
+
options: ['iconButton', 'inverted', 'square', 'invertedSquare']
|
40
|
+
},
|
41
|
+
defaultValue: 'iconButton'
|
40
42
|
}
|
41
43
|
}
|
42
44
|
};
|
43
45
|
export var Default = function Default(args) {
|
44
46
|
return ___EmotionJSX(IconButton, _extends({
|
45
|
-
"aria-label": "
|
47
|
+
"aria-label": "default icon button"
|
46
48
|
}, args), ___EmotionJSX(Icon, {
|
47
49
|
icon: CreateIcon
|
48
50
|
}));
|
49
51
|
};
|
50
|
-
export var Inverted = function Inverted() {
|
51
|
-
return ___EmotionJSX(IconButton, {
|
52
|
-
"aria-label": "my-label",
|
53
|
-
variant: "inverted"
|
54
|
-
}, ___EmotionJSX(Icon, {
|
55
|
-
icon: CreateIcon
|
56
|
-
}));
|
57
|
-
};
|
58
52
|
export var WithTooltip = function WithTooltip() {
|
59
53
|
return ___EmotionJSX(IconButton, {
|
60
|
-
"aria-label": "
|
54
|
+
"aria-label": "icon button with tooltip",
|
61
55
|
title: "Edit"
|
62
56
|
}, ___EmotionJSX(Icon, {
|
63
57
|
icon: CreateIcon
|
@@ -65,7 +59,7 @@ export var WithTooltip = function WithTooltip() {
|
|
65
59
|
};
|
66
60
|
export var Disabled = function Disabled() {
|
67
61
|
return ___EmotionJSX(IconButton, {
|
68
|
-
"aria-label": "
|
62
|
+
"aria-label": "disabled icon button",
|
69
63
|
isDisabled: true
|
70
64
|
}, ___EmotionJSX(Icon, {
|
71
65
|
icon: CreateIcon
|
@@ -17,7 +17,8 @@ var Icon = function Icon(props) {
|
|
17
17
|
var testId = 'test-button';
|
18
18
|
var defaultProps = {
|
19
19
|
'data-testid': testId,
|
20
|
-
icon: Icon
|
20
|
+
icon: Icon,
|
21
|
+
'aria-label': 'Create'
|
21
22
|
};
|
22
23
|
|
23
24
|
var getComponent = function getComponent() {
|
@@ -115,10 +116,8 @@ test('tooltip is not shown on hover or focus when prop is not passed', function
|
|
115
116
|
expect(screen.queryByRole('tooltip')).not.toBeInTheDocument();
|
116
117
|
});
|
117
118
|
test('the button should be getting aria label attribute', function () {
|
118
|
-
var testLabel = '
|
119
|
-
getComponent(
|
120
|
-
'aria-label': testLabel
|
121
|
-
});
|
119
|
+
var testLabel = defaultProps['aria-label'];
|
120
|
+
getComponent();
|
122
121
|
expect(screen.getByLabelText(testLabel)).toBeInTheDocument();
|
123
122
|
});
|
124
123
|
test('show button isDisabled status', function () {
|
@@ -92,7 +92,8 @@ var ImagePreviewButton = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
92
92
|
ref: buttonRef,
|
93
93
|
variant: "imageUpload",
|
94
94
|
sx: widthHeightSx,
|
95
|
-
"data-testid": "image-preview-button"
|
95
|
+
"data-testid": "image-preview-button",
|
96
|
+
"aria-label": "Image preview"
|
96
97
|
}, mergeProps(focusProps, others)), previewImage && isImageType ? imagePreview : noImagePreview, isLoading && loadingPreview, (isHovered || isFocusVisible) && !isLoading && hoveredPreview));
|
97
98
|
});
|
98
99
|
ImagePreviewButton.propTypes = {
|
@@ -2,6 +2,7 @@ import _extends from "@babel/runtime-corejs3/helpers/esm/extends";
|
|
2
2
|
import _objectWithoutProperties from "@babel/runtime-corejs3/helpers/esm/objectWithoutProperties";
|
3
3
|
import React, { forwardRef } from 'react';
|
4
4
|
import Box from '../Box/Box';
|
5
|
+
import { useDeprecationWarning } from '../../hooks';
|
5
6
|
/**
|
6
7
|
* The intended use of List is to hold a collection of <ListItem/> components.
|
7
8
|
* Accepts most of the styling props from [styled-system](https://styled-system.com/table).
|
@@ -12,6 +13,7 @@ var List = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
12
13
|
var children = props.children,
|
13
14
|
others = _objectWithoutProperties(props, ["children"]);
|
14
15
|
|
16
|
+
useDeprecationWarning('The List component will be deprecated in Astro-UI 2.0.0, use ListView instead.');
|
15
17
|
return ___EmotionJSX(Box, _extends({
|
16
18
|
ref: ref,
|
17
19
|
role: "list",
|
@@ -3,10 +3,14 @@ import List from '.';
|
|
3
3
|
import ListItem from '../ListItem';
|
4
4
|
import Text from '../Text';
|
5
5
|
import Separator from '../Separator';
|
6
|
+
import withDeprecationWarning from '../../utils/devUtils/decorators/withDeprecationWarning';
|
6
7
|
import { jsx as ___EmotionJSX } from "@emotion/react";
|
7
8
|
export default {
|
8
|
-
title: 'List',
|
9
|
-
component: [List, ListItem]
|
9
|
+
title: 'Deprecated/List',
|
10
|
+
component: [List, ListItem],
|
11
|
+
decorators: [function (Story, context) {
|
12
|
+
return withDeprecationWarning(Story, context, 'The `List` component will be deprecated in Astro-UI 2.0.0, use `ListView` instead.');
|
13
|
+
}]
|
10
14
|
};
|
11
15
|
export var Default = function Default() {
|
12
16
|
return ___EmotionJSX(React.Fragment, null, ___EmotionJSX(Text, {
|
@@ -24,7 +24,6 @@ import { useCollator } from '@react-aria/i18n';
|
|
24
24
|
import { ListLayout } from '@react-stately/layout';
|
25
25
|
import { ListBoxContext } from './ListBoxContext';
|
26
26
|
import { Option } from './index.js';
|
27
|
-
import { useAriaLabelWarning } from '../../hooks';
|
28
27
|
import { isIterableProp } from '../../utils/devUtils/props/isIterable';
|
29
28
|
import Loader from '../Loader';
|
30
29
|
import ListBoxSection from './ListBoxSection';
|
@@ -77,13 +76,12 @@ var ListBox = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
77
76
|
selectedKeys = props.selectedKeys,
|
78
77
|
selectionMode = props.selectionMode,
|
79
78
|
state = props.state,
|
79
|
+
ariaLabel = props['aria-label'],
|
80
80
|
ariaLabelledby = props['aria-labelledby'],
|
81
81
|
ariaDescribedby = props['aria-describedby'],
|
82
82
|
ariaDetails = props['aria-details'],
|
83
|
-
others = _objectWithoutProperties(props, ["defaultSelectedKeys", "disabledKeys", "hasAutoFocus", "hasFocusWrap", "hasNoEmptySelection", "hasVirtualFocus", "id", "isLoading", "isFocusedOnHover", "isSelectedOnPressUp", "isVirtualized", "items", "keyboardDelegate", "label", "onLoadMore", "onScroll", "onSelectionChange", "renderEmptyState", "selectedKeys", "selectionMode", "state", "aria-labelledby", "aria-describedby", "aria-details"]);
|
83
|
+
others = _objectWithoutProperties(props, ["defaultSelectedKeys", "disabledKeys", "hasAutoFocus", "hasFocusWrap", "hasNoEmptySelection", "hasVirtualFocus", "id", "isLoading", "isFocusedOnHover", "isSelectedOnPressUp", "isVirtualized", "items", "keyboardDelegate", "label", "onLoadMore", "onScroll", "onSelectionChange", "renderEmptyState", "selectedKeys", "selectionMode", "state", "aria-label", "aria-labelledby", "aria-describedby", "aria-details"]);
|
84
84
|
|
85
|
-
var ariaLabel = props['aria-label'];
|
86
|
-
useAriaLabelWarning('ListBox', ariaLabel);
|
87
85
|
var focusStrategy = state.focusStrategy; // Object matching React Aria API with all options
|
88
86
|
|
89
87
|
var listBoxOptions = {
|
@@ -107,7 +105,7 @@ var ListBox = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
107
105
|
shouldFocusWrap: hasFocusWrap,
|
108
106
|
shouldSelectOnPressUp: isSelectedOnPressUp,
|
109
107
|
shouldUseVirtualFocus: hasVirtualFocus,
|
110
|
-
'aria-label': ariaLabel
|
108
|
+
'aria-label': ariaLabel,
|
111
109
|
'aria-labelledby': ariaLabelledby,
|
112
110
|
'aria-describedby': ariaDescribedby,
|
113
111
|
'aria-details': ariaDetails
|
@@ -29,11 +29,13 @@ var itemsWithSections = [{
|
|
29
29
|
}];
|
30
30
|
var defaultProps = {
|
31
31
|
'data-testid': testId,
|
32
|
+
'aria-label': 'listbox',
|
32
33
|
'aria-labelledby': 'label',
|
33
34
|
items: items
|
34
35
|
};
|
35
36
|
var defaultWithSectionsProps = {
|
36
37
|
'data-testid': testId,
|
38
|
+
'aria-label': 'listbox',
|
37
39
|
'aria-labelledby': 'label',
|
38
40
|
items: itemsWithSections
|
39
41
|
};
|
@@ -63,7 +63,13 @@ var Option = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
63
63
|
isSelected: isSelected
|
64
64
|
}),
|
65
65
|
classNames = _useStatusClasses.classNames;
|
66
|
+
/* Related to UIP-4992
|
67
|
+
* Need to remove these properties to avoid errors in the console on the external app.
|
68
|
+
* By the way, these properties return "undefined", so it shouldn't create issues */
|
66
69
|
|
70
|
+
|
71
|
+
delete optionProps.onPressStart;
|
72
|
+
delete optionProps.onPressUp;
|
67
73
|
return ___EmotionJSX(Box, _extends({
|
68
74
|
as: "li",
|
69
75
|
isRow: true,
|