@instructure/ui-drilldown 10.26.1 → 11.0.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.
- package/CHANGELOG.md +24 -1
- package/es/Drilldown/DrilldownGroup/index.js +2 -2
- package/es/Drilldown/DrilldownGroup/props.js +1 -18
- package/es/Drilldown/DrilldownOption/index.js +2 -2
- package/es/Drilldown/DrilldownOption/props.js +1 -24
- package/es/Drilldown/DrilldownPage/index.js +1 -2
- package/es/Drilldown/DrilldownPage/props.js +1 -17
- package/es/Drilldown/DrilldownSeparator/index.js +2 -2
- package/es/Drilldown/DrilldownSeparator/props.js +1 -6
- package/es/Drilldown/index.js +30 -18
- package/es/Drilldown/props.js +1 -46
- package/lib/Drilldown/DrilldownGroup/index.js +1 -1
- package/lib/Drilldown/DrilldownGroup/props.js +1 -19
- package/lib/Drilldown/DrilldownOption/index.js +1 -1
- package/lib/Drilldown/DrilldownOption/props.js +1 -25
- package/lib/Drilldown/DrilldownPage/index.js +0 -1
- package/lib/Drilldown/DrilldownPage/props.js +1 -18
- package/lib/Drilldown/DrilldownSeparator/index.js +1 -1
- package/lib/Drilldown/DrilldownSeparator/props.js +1 -7
- package/lib/Drilldown/index.js +29 -17
- package/lib/Drilldown/props.js +1 -48
- package/package.json +20 -23
- package/src/Drilldown/DrilldownGroup/index.tsx +1 -2
- package/src/Drilldown/DrilldownGroup/props.ts +1 -23
- package/src/Drilldown/DrilldownOption/index.tsx +1 -2
- package/src/Drilldown/DrilldownOption/props.ts +1 -28
- package/src/Drilldown/DrilldownPage/index.tsx +1 -2
- package/src/Drilldown/DrilldownPage/props.ts +2 -30
- package/src/Drilldown/DrilldownSeparator/index.tsx +1 -2
- package/src/Drilldown/DrilldownSeparator/props.ts +1 -10
- package/src/Drilldown/index.tsx +26 -18
- package/src/Drilldown/props.ts +1 -52
- package/tsconfig.build.json +0 -2
- package/tsconfig.build.tsbuildinfo +1 -1
- package/types/Drilldown/DrilldownGroup/index.d.ts +0 -18
- package/types/Drilldown/DrilldownGroup/index.d.ts.map +1 -1
- package/types/Drilldown/DrilldownGroup/props.d.ts +2 -3
- package/types/Drilldown/DrilldownGroup/props.d.ts.map +1 -1
- package/types/Drilldown/DrilldownOption/index.d.ts +0 -44
- package/types/Drilldown/DrilldownOption/index.d.ts.map +1 -1
- package/types/Drilldown/DrilldownOption/props.d.ts +2 -3
- package/types/Drilldown/DrilldownOption/props.d.ts.map +1 -1
- package/types/Drilldown/DrilldownPage/index.d.ts +0 -11
- package/types/Drilldown/DrilldownPage/index.d.ts.map +1 -1
- package/types/Drilldown/DrilldownPage/props.d.ts +2 -3
- package/types/Drilldown/DrilldownPage/props.d.ts.map +1 -1
- package/types/Drilldown/DrilldownSeparator/index.d.ts +0 -4
- package/types/Drilldown/DrilldownSeparator/index.d.ts.map +1 -1
- package/types/Drilldown/DrilldownSeparator/props.d.ts +2 -3
- package/types/Drilldown/DrilldownSeparator/props.d.ts.map +1 -1
- package/types/Drilldown/index.d.ts +0 -58
- package/types/Drilldown/index.d.ts.map +1 -1
- package/types/Drilldown/props.d.ts +2 -3
- package/types/Drilldown/props.d.ts.map +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
-
|
|
6
|
+
# [11.0.0](https://github.com/instructure/instructure-ui/compare/v10.26.0...v11.0.0) (2025-10-06)
|
|
7
7
|
|
|
8
8
|
|
|
9
9
|
### Bug Fixes
|
|
@@ -11,6 +11,29 @@ See [Conventional Commits](https://conventionalcommits.org) for commit guideline
|
|
|
11
11
|
* **ui-drilldown:** fix for prevent option selection when Drilldown or its sub-components get disabled prop ([5fc37f6](https://github.com/instructure/instructure-ui/commit/5fc37f6b7c7622ab248a4d1bd575b2bbac97e0a0))
|
|
12
12
|
|
|
13
13
|
|
|
14
|
+
### Features
|
|
15
|
+
|
|
16
|
+
* **many:** instUI v11 release ([36f5438](https://github.com/instructure/instructure-ui/commit/36f54382669186227ba24798bbf7201ef2f5cd4c))
|
|
17
|
+
|
|
18
|
+
|
|
19
|
+
### BREAKING CHANGES
|
|
20
|
+
|
|
21
|
+
* **many:** InstUI v11 contains the following breaking changes:
|
|
22
|
+
- React 16 and 17 are no longer supported
|
|
23
|
+
- remove `PropTypes` from all packages
|
|
24
|
+
- remove `CodeEditor` component
|
|
25
|
+
- remove `@instui/theme-registry` package
|
|
26
|
+
- remove `@testable`, `@experimental`, `@hack` decorators
|
|
27
|
+
- InstUISettingsProvider's `as` prop is removed
|
|
28
|
+
- `canvas.use()`, `canvasHighContrast.use()` functions are removed
|
|
29
|
+
- `canvasThemeLocal`, `canvasHighContrastThemeLocal` are removed
|
|
30
|
+
- `variables` field on theme objects are removed
|
|
31
|
+
- remove deprecated props from Table: Row's `isStacked`, Body's
|
|
32
|
+
`isStacked`, `hover`, and `headers`
|
|
33
|
+
- `Table`'s `caption` prop is now required
|
|
34
|
+
- `ui-dom-utils`'s `getComputedStyle` can now return `undefined`
|
|
35
|
+
|
|
36
|
+
|
|
14
37
|
|
|
15
38
|
|
|
16
39
|
|
|
@@ -26,7 +26,7 @@ var _dec, _class, _DrilldownGroup;
|
|
|
26
26
|
import { Component } from 'react';
|
|
27
27
|
import { withStyle } from '@instructure/emotion';
|
|
28
28
|
import { optionsThemeGenerator } from '@instructure/ui-options';
|
|
29
|
-
import {
|
|
29
|
+
import { allowedProps } from './props';
|
|
30
30
|
import { isMac, isFirefox } from '@instructure/ui-utils';
|
|
31
31
|
|
|
32
32
|
/**
|
|
@@ -44,7 +44,7 @@ let DrilldownGroup = (_dec = withStyle(null, optionsThemeGenerator), _dec(_class
|
|
|
44
44
|
// Drilldown.Group is parsed in Drilldown as an Options component.
|
|
45
45
|
return null;
|
|
46
46
|
}
|
|
47
|
-
}, _DrilldownGroup.displayName = "DrilldownGroup", _DrilldownGroup.componentId = 'Drilldown.Group', _DrilldownGroup.
|
|
47
|
+
}, _DrilldownGroup.displayName = "DrilldownGroup", _DrilldownGroup.componentId = 'Drilldown.Group', _DrilldownGroup.allowedProps = allowedProps, _DrilldownGroup.defaultProps = {
|
|
48
48
|
disabled: false,
|
|
49
49
|
withoutSeparators: false,
|
|
50
50
|
// Firefox with NVDA does not read Drilldown.Group with role="group" correctly
|
|
@@ -22,22 +22,5 @@
|
|
|
22
22
|
* SOFTWARE.
|
|
23
23
|
*/
|
|
24
24
|
|
|
25
|
-
import PropTypes from 'prop-types';
|
|
26
|
-
import { Children } from '@instructure/ui-prop-types';
|
|
27
|
-
import DrilldownOption from '../DrilldownOption';
|
|
28
|
-
import DrilldownSeparator from '../DrilldownSeparator';
|
|
29
|
-
const propTypes = {
|
|
30
|
-
id: PropTypes.string.isRequired,
|
|
31
|
-
children: Children.oneOf([DrilldownOption, DrilldownSeparator]),
|
|
32
|
-
renderGroupTitle: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),
|
|
33
|
-
withoutSeparators: PropTypes.bool,
|
|
34
|
-
disabled: PropTypes.bool,
|
|
35
|
-
role: PropTypes.string,
|
|
36
|
-
as: PropTypes.elementType,
|
|
37
|
-
elementRef: PropTypes.func,
|
|
38
|
-
selectableType: PropTypes.oneOf(['single', 'multiple']),
|
|
39
|
-
defaultSelected: PropTypes.array,
|
|
40
|
-
onSelect: PropTypes.func
|
|
41
|
-
};
|
|
42
25
|
const allowedProps = ['id', 'children', 'renderGroupTitle', 'withoutSeparators', 'disabled', 'role', 'as', 'elementRef', 'selectableType', 'defaultSelected', 'onSelect'];
|
|
43
|
-
export {
|
|
26
|
+
export { allowedProps };
|
|
@@ -26,7 +26,7 @@ var _dec, _class, _DrilldownOption;
|
|
|
26
26
|
import { Component } from 'react';
|
|
27
27
|
import { withStyle } from '@instructure/emotion';
|
|
28
28
|
import { optionsItemThemeGenerator } from '@instructure/ui-options';
|
|
29
|
-
import {
|
|
29
|
+
import { allowedProps } from './props';
|
|
30
30
|
/**
|
|
31
31
|
---
|
|
32
32
|
parent: Drilldown
|
|
@@ -42,7 +42,7 @@ let DrilldownOption = (_dec = withStyle(null, optionsItemThemeGenerator), _dec(_
|
|
|
42
42
|
// are parsed in Drilldown and rendered as Options.Item components
|
|
43
43
|
return null;
|
|
44
44
|
}
|
|
45
|
-
}, _DrilldownOption.displayName = "DrilldownOption", _DrilldownOption.componentId = 'Drilldown.Option', _DrilldownOption.
|
|
45
|
+
}, _DrilldownOption.displayName = "DrilldownOption", _DrilldownOption.componentId = 'Drilldown.Option', _DrilldownOption.allowedProps = allowedProps, _DrilldownOption.defaultProps = {
|
|
46
46
|
disabled: false,
|
|
47
47
|
beforeLabelContentVAlign: 'start',
|
|
48
48
|
afterLabelContentVAlign: 'start',
|
|
@@ -22,28 +22,5 @@
|
|
|
22
22
|
* SOFTWARE.
|
|
23
23
|
*/
|
|
24
24
|
|
|
25
|
-
import PropTypes from 'prop-types';
|
|
26
|
-
const propTypes = {
|
|
27
|
-
id: PropTypes.string.isRequired,
|
|
28
|
-
children: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),
|
|
29
|
-
subPageId: PropTypes.string,
|
|
30
|
-
disabled: PropTypes.bool,
|
|
31
|
-
selected: PropTypes.bool,
|
|
32
|
-
value: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
|
|
33
|
-
href: PropTypes.string,
|
|
34
|
-
as: PropTypes.elementType,
|
|
35
|
-
role: PropTypes.string,
|
|
36
|
-
renderLabelInfo: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),
|
|
37
|
-
renderBeforeLabel: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),
|
|
38
|
-
renderAfterLabel: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),
|
|
39
|
-
beforeLabelContentVAlign: PropTypes.oneOf(['start', 'center', 'end']),
|
|
40
|
-
afterLabelContentVAlign: PropTypes.oneOf(['start', 'center', 'end']),
|
|
41
|
-
description: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),
|
|
42
|
-
descriptionRole: PropTypes.string,
|
|
43
|
-
onOptionClick: PropTypes.func,
|
|
44
|
-
defaultSelected: PropTypes.bool,
|
|
45
|
-
elementRef: PropTypes.func,
|
|
46
|
-
shouldCloseOnClick: PropTypes.oneOf(['auto', 'always', 'never'])
|
|
47
|
-
};
|
|
48
25
|
const allowedProps = ['id', 'children', 'subPageId', 'disabled', 'selected', 'value', 'href', 'as', 'role', 'renderLabelInfo', 'renderBeforeLabel', 'renderAfterLabel', 'beforeLabelContentVAlign', 'afterLabelContentVAlign', 'description', 'descriptionRole', 'onOptionClick', 'defaultSelected', 'elementRef', 'shouldCloseOnClick'];
|
|
49
|
-
export {
|
|
26
|
+
export { allowedProps };
|
|
@@ -23,7 +23,7 @@
|
|
|
23
23
|
*/
|
|
24
24
|
|
|
25
25
|
import { Component } from 'react';
|
|
26
|
-
import {
|
|
26
|
+
import { allowedProps } from './props';
|
|
27
27
|
/**
|
|
28
28
|
---
|
|
29
29
|
parent: Drilldown
|
|
@@ -40,7 +40,6 @@ class DrilldownPage extends Component {
|
|
|
40
40
|
}
|
|
41
41
|
DrilldownPage.displayName = "DrilldownPage";
|
|
42
42
|
DrilldownPage.componentId = 'Drilldown.Page';
|
|
43
|
-
DrilldownPage.propTypes = propTypes;
|
|
44
43
|
DrilldownPage.allowedProps = allowedProps;
|
|
45
44
|
DrilldownPage.defaultProps = {
|
|
46
45
|
renderBackButtonLabel: 'Back',
|
|
@@ -22,21 +22,5 @@
|
|
|
22
22
|
* SOFTWARE.
|
|
23
23
|
*/
|
|
24
24
|
|
|
25
|
-
import PropTypes from 'prop-types';
|
|
26
|
-
import { Children } from '@instructure/ui-prop-types';
|
|
27
|
-
import DrilldownGroup from '../DrilldownGroup';
|
|
28
|
-
import DrilldownOption from '../DrilldownOption';
|
|
29
|
-
import DrilldownSeparator from '../DrilldownSeparator';
|
|
30
|
-
const propTypes = {
|
|
31
|
-
id: PropTypes.string.isRequired,
|
|
32
|
-
children: Children.oneOf([DrilldownOption, DrilldownSeparator, DrilldownGroup]),
|
|
33
|
-
renderTitle: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),
|
|
34
|
-
renderActionLabel: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),
|
|
35
|
-
renderBackButtonLabel: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),
|
|
36
|
-
onHeaderActionClicked: PropTypes.func,
|
|
37
|
-
onBackButtonClicked: PropTypes.func,
|
|
38
|
-
withoutHeaderSeparator: PropTypes.bool,
|
|
39
|
-
disabled: PropTypes.bool
|
|
40
|
-
};
|
|
41
25
|
const allowedProps = ['id', 'children', 'renderTitle', 'renderActionLabel', 'renderBackButtonLabel', 'onHeaderActionClicked', 'onBackButtonClicked', 'withoutHeaderSeparator', 'disabled'];
|
|
42
|
-
export {
|
|
26
|
+
export { allowedProps };
|
|
@@ -26,7 +26,7 @@ var _dec, _class, _DrilldownSeparator;
|
|
|
26
26
|
import { Component } from 'react';
|
|
27
27
|
import { withStyle } from '@instructure/emotion';
|
|
28
28
|
import { optionsSeparatorThemeGenerator } from '@instructure/ui-options';
|
|
29
|
-
import {
|
|
29
|
+
import { allowedProps } from './props';
|
|
30
30
|
/**
|
|
31
31
|
---
|
|
32
32
|
parent: Drilldown
|
|
@@ -42,6 +42,6 @@ let DrilldownSeparator = (_dec = withStyle(null, optionsSeparatorThemeGenerator)
|
|
|
42
42
|
// are parsed in Drilldown and rendered as Options.Separator components
|
|
43
43
|
return null;
|
|
44
44
|
}
|
|
45
|
-
}, _DrilldownSeparator.displayName = "DrilldownSeparator", _DrilldownSeparator.componentId = 'Drilldown.Separator', _DrilldownSeparator.
|
|
45
|
+
}, _DrilldownSeparator.displayName = "DrilldownSeparator", _DrilldownSeparator.componentId = 'Drilldown.Separator', _DrilldownSeparator.allowedProps = allowedProps, _DrilldownSeparator.defaultProps = {}, _DrilldownSeparator)) || _class);
|
|
46
46
|
export default DrilldownSeparator;
|
|
47
47
|
export { DrilldownSeparator };
|
|
@@ -22,10 +22,5 @@
|
|
|
22
22
|
* SOFTWARE.
|
|
23
23
|
*/
|
|
24
24
|
|
|
25
|
-
import PropTypes from 'prop-types';
|
|
26
|
-
const propTypes = {
|
|
27
|
-
id: PropTypes.string.isRequired,
|
|
28
|
-
as: PropTypes.elementType
|
|
29
|
-
};
|
|
30
25
|
const allowedProps = ['id', 'as'];
|
|
31
|
-
export {
|
|
26
|
+
export { allowedProps };
|
package/es/Drilldown/index.js
CHANGED
|
@@ -2,7 +2,7 @@ import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutPr
|
|
|
2
2
|
const _excluded = ["groupProps"],
|
|
3
3
|
_excluded2 = ["groupProps"],
|
|
4
4
|
_excluded3 = ["id", "themeOverride"];
|
|
5
|
-
var _dec, _dec2,
|
|
5
|
+
var _dec, _dec2, _class, _Drilldown, _IconArrowOpenEndSoli, _IconArrowOpenStartSo, _Options$Separator, _Options$Separator2;
|
|
6
6
|
/*
|
|
7
7
|
* The MIT License (MIT)
|
|
8
8
|
*
|
|
@@ -29,7 +29,6 @@ var _dec, _dec2, _dec3, _class, _Drilldown, _IconArrowOpenEndSoli, _IconArrowOpe
|
|
|
29
29
|
|
|
30
30
|
import { Children, Component } from 'react';
|
|
31
31
|
import { warn, error } from '@instructure/console';
|
|
32
|
-
import { testable } from '@instructure/ui-testable';
|
|
33
32
|
import { contains, containsActiveElement } from '@instructure/ui-dom-utils';
|
|
34
33
|
import { callRenderProp, matchComponentTypes, omitProps, safeCloneElement, withDeterministicId } from '@instructure/ui-react-utils';
|
|
35
34
|
import { View } from '@instructure/ui-view';
|
|
@@ -44,7 +43,7 @@ import { DrilldownGroup } from './DrilldownGroup';
|
|
|
44
43
|
import { DrilldownPage } from './DrilldownPage';
|
|
45
44
|
import generateStyle from './styles';
|
|
46
45
|
import generateComponentTheme from './theme';
|
|
47
|
-
import {
|
|
46
|
+
import { allowedProps } from './props';
|
|
48
47
|
|
|
49
48
|
// Additional data we need to track on the Options,
|
|
50
49
|
// but shouldn't be settable via props
|
|
@@ -63,7 +62,7 @@ import { createElement as _createElement } from "@emotion/react";
|
|
|
63
62
|
category: components
|
|
64
63
|
---
|
|
65
64
|
**/
|
|
66
|
-
let Drilldown = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle, generateComponentTheme),
|
|
65
|
+
let Drilldown = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle, generateComponentTheme), _dec(_class = _dec2(_class = (_Drilldown = class Drilldown extends Component {
|
|
67
66
|
constructor(props) {
|
|
68
67
|
super(props);
|
|
69
68
|
this._drilldownRef = null;
|
|
@@ -230,9 +229,6 @@ let Drilldown = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle,
|
|
|
230
229
|
}) => {
|
|
231
230
|
var _this$currentPage, _selectedOption$group;
|
|
232
231
|
const selectedOption = this.getPageChildById(id);
|
|
233
|
-
|
|
234
|
-
// TODO: this line can be removed when React 16 is no longer supported
|
|
235
|
-
event.persist();
|
|
236
232
|
if (!id || !selectedOption) {
|
|
237
233
|
event.preventDefault();
|
|
238
234
|
event.stopPropagation();
|
|
@@ -278,11 +274,19 @@ let Drilldown = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle,
|
|
|
278
274
|
if (groupProps !== null && groupProps !== void 0 && groupProps.selectableType) {
|
|
279
275
|
this.handleGroupOptionSelected(event, selectedOption);
|
|
280
276
|
} else {
|
|
277
|
+
// TODO workaround for react 19 default props
|
|
278
|
+
const optionWithDefaultProps = {
|
|
279
|
+
...selectedOptionChild,
|
|
280
|
+
props: {
|
|
281
|
+
...selectedOptionChild.props,
|
|
282
|
+
role: 'menuitem'
|
|
283
|
+
}
|
|
284
|
+
};
|
|
281
285
|
if (typeof onSelect === 'function') {
|
|
282
286
|
onSelect(event, {
|
|
283
287
|
value,
|
|
284
288
|
isSelected: true,
|
|
285
|
-
selectedOption:
|
|
289
|
+
selectedOption: optionWithDefaultProps,
|
|
286
290
|
drilldown: this
|
|
287
291
|
});
|
|
288
292
|
}
|
|
@@ -816,15 +820,20 @@ let Drilldown = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle,
|
|
|
816
820
|
id = _option$props.id,
|
|
817
821
|
children = _option$props.children,
|
|
818
822
|
href = _option$props.href,
|
|
819
|
-
as = _option$props.as,
|
|
820
|
-
|
|
823
|
+
_option$props$as = _option$props.as,
|
|
824
|
+
as = _option$props$as === void 0 ? 'li' : _option$props$as,
|
|
825
|
+
_option$props$role = _option$props.role,
|
|
826
|
+
role = _option$props$role === void 0 ? 'menuitem' : _option$props$role,
|
|
821
827
|
subPageId = _option$props.subPageId,
|
|
822
|
-
|
|
828
|
+
_option$props$disable = _option$props.disabled,
|
|
829
|
+
disabled = _option$props$disable === void 0 ? false : _option$props$disable,
|
|
823
830
|
renderLabelInfo = _option$props.renderLabelInfo,
|
|
824
831
|
renderBeforeLabel = _option$props.renderBeforeLabel,
|
|
825
832
|
renderAfterLabel = _option$props.renderAfterLabel,
|
|
826
|
-
|
|
827
|
-
|
|
833
|
+
_option$props$beforeL = _option$props.beforeLabelContentVAlign,
|
|
834
|
+
beforeLabelContentVAlign = _option$props$beforeL === void 0 ? 'start' : _option$props$beforeL,
|
|
835
|
+
_option$props$afterLa = _option$props.afterLabelContentVAlign,
|
|
836
|
+
afterLabelContentVAlign = _option$props$afterLa === void 0 ? 'start' : _option$props$afterLa,
|
|
828
837
|
description = _option$props.description,
|
|
829
838
|
descriptionRole = _option$props.descriptionRole,
|
|
830
839
|
elementRef = _option$props.elementRef,
|
|
@@ -1009,7 +1018,8 @@ let Drilldown = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle,
|
|
|
1009
1018
|
children = _group$props.children,
|
|
1010
1019
|
renderGroupTitle = _group$props.renderGroupTitle,
|
|
1011
1020
|
themeOverride = _group$props.themeOverride,
|
|
1012
|
-
role = _group$props.role,
|
|
1021
|
+
_group$props$role = _group$props.role,
|
|
1022
|
+
role = _group$props$role === void 0 ? 'group' : _group$props$role,
|
|
1013
1023
|
as = _group$props.as,
|
|
1014
1024
|
elementRef = _group$props.elementRef;
|
|
1015
1025
|
if (!children) {
|
|
@@ -1019,7 +1029,7 @@ let Drilldown = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle,
|
|
|
1019
1029
|
|
|
1020
1030
|
// add a separator above
|
|
1021
1031
|
if (needsFirstSeparator) {
|
|
1022
|
-
groupChildren.push(_Options$Separator || (_Options$Separator = _jsx(Options.Separator, {})));
|
|
1032
|
+
groupChildren.push(_Options$Separator || (_Options$Separator = _jsx(Options.Separator, {}, "drilldown-options-separator")));
|
|
1023
1033
|
}
|
|
1024
1034
|
|
|
1025
1035
|
// create a sublist as a group
|
|
@@ -1046,7 +1056,7 @@ let Drilldown = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle,
|
|
|
1046
1056
|
|
|
1047
1057
|
// add a separator below
|
|
1048
1058
|
if (needsLastSeparator) {
|
|
1049
|
-
groupChildren.push(_Options$Separator2 || (_Options$Separator2 = _jsx(Options.Separator, {})));
|
|
1059
|
+
groupChildren.push(_Options$Separator2 || (_Options$Separator2 = _jsx(Options.Separator, {}, "drilldown-options-separator-2")));
|
|
1050
1060
|
}
|
|
1051
1061
|
return groupChildren;
|
|
1052
1062
|
}
|
|
@@ -1106,6 +1116,7 @@ let Drilldown = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle,
|
|
|
1106
1116
|
borderWidth: 'small'
|
|
1107
1117
|
}),
|
|
1108
1118
|
as: "div",
|
|
1119
|
+
"data-cid": "Drilldown",
|
|
1109
1120
|
elementRef: this.handleDrilldownRef,
|
|
1110
1121
|
tabIndex: 0,
|
|
1111
1122
|
css: styles === null || styles === void 0 ? void 0 : styles.drilldown,
|
|
@@ -1193,6 +1204,7 @@ let Drilldown = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle,
|
|
|
1193
1204
|
styles = _this$props7.styles;
|
|
1194
1205
|
const borderColor = styles === null || styles === void 0 ? void 0 : (_styles$drilldown = styles.drilldown) === null || _styles$drilldown === void 0 ? void 0 : _styles$drilldown.borderColor;
|
|
1195
1206
|
return trigger ? _jsx(Popover, {
|
|
1207
|
+
"data-cid": "Drilldown",
|
|
1196
1208
|
themeOverride: {
|
|
1197
1209
|
// use here own theme's color
|
|
1198
1210
|
borderColor: borderColor
|
|
@@ -1257,7 +1269,7 @@ let Drilldown = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle,
|
|
|
1257
1269
|
children: this.renderPage()
|
|
1258
1270
|
}) : this.renderPage();
|
|
1259
1271
|
}
|
|
1260
|
-
}, _Drilldown.displayName = "Drilldown", _Drilldown.componentId = 'Drilldown', _Drilldown.
|
|
1272
|
+
}, _Drilldown.displayName = "Drilldown", _Drilldown.componentId = 'Drilldown', _Drilldown.allowedProps = allowedProps, _Drilldown.defaultProps = {
|
|
1261
1273
|
disabled: false,
|
|
1262
1274
|
rotateFocus: true,
|
|
1263
1275
|
as: 'ul',
|
|
@@ -1273,6 +1285,6 @@ let Drilldown = (_dec = withDeterministicId(), _dec2 = withStyle(generateStyle,
|
|
|
1273
1285
|
offsetX: 0,
|
|
1274
1286
|
offsetY: 0,
|
|
1275
1287
|
shouldSetAriaExpanded: true
|
|
1276
|
-
}, _Drilldown.Group = DrilldownGroup, _Drilldown.Option = DrilldownOption, _Drilldown.Page = DrilldownPage, _Drilldown.Separator = DrilldownSeparator, _Drilldown)) || _class) || _class)
|
|
1288
|
+
}, _Drilldown.Group = DrilldownGroup, _Drilldown.Option = DrilldownOption, _Drilldown.Page = DrilldownPage, _Drilldown.Separator = DrilldownSeparator, _Drilldown)) || _class) || _class);
|
|
1277
1289
|
export default Drilldown;
|
|
1278
1290
|
export { Drilldown };
|
package/es/Drilldown/props.js
CHANGED
|
@@ -22,52 +22,7 @@
|
|
|
22
22
|
* SOFTWARE.
|
|
23
23
|
*/
|
|
24
24
|
|
|
25
|
-
import PropTypes from 'prop-types';
|
|
26
|
-
import { Children, controllable } from '@instructure/ui-prop-types';
|
|
27
|
-
import { PositionPropTypes } from '@instructure/ui-position';
|
|
28
|
-
import { DrilldownPage } from './DrilldownPage';
|
|
29
|
-
const propTypes = {
|
|
30
|
-
rootPageId: PropTypes.string.isRequired,
|
|
31
|
-
children: Children.oneOf([DrilldownPage]),
|
|
32
|
-
id: PropTypes.string,
|
|
33
|
-
label: PropTypes.string,
|
|
34
|
-
disabled: PropTypes.bool,
|
|
35
|
-
rotateFocus: PropTypes.bool,
|
|
36
|
-
as: PropTypes.elementType,
|
|
37
|
-
role: PropTypes.string,
|
|
38
|
-
elementRef: PropTypes.func,
|
|
39
|
-
drilldownRef: PropTypes.func,
|
|
40
|
-
overflowX: PropTypes.oneOf(['auto', 'hidden', 'visible']),
|
|
41
|
-
overflowY: PropTypes.oneOf(['auto', 'hidden', 'visible']),
|
|
42
|
-
height: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
|
|
43
|
-
width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
|
|
44
|
-
minHeight: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
|
|
45
|
-
minWidth: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
|
|
46
|
-
maxHeight: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
|
|
47
|
-
maxWidth: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
|
|
48
|
-
trigger: PropTypes.node,
|
|
49
|
-
placement: PositionPropTypes.placement,
|
|
50
|
-
defaultShow: PropTypes.bool,
|
|
51
|
-
show: controllable(PropTypes.bool, 'onToggle', 'defaultShow'),
|
|
52
|
-
onToggle: PropTypes.func,
|
|
53
|
-
onSelect: PropTypes.func,
|
|
54
|
-
onDismiss: PropTypes.func,
|
|
55
|
-
onFocus: PropTypes.func,
|
|
56
|
-
onMouseOver: PropTypes.func,
|
|
57
|
-
popoverRef: PropTypes.func,
|
|
58
|
-
mountNode: PositionPropTypes.mountNode,
|
|
59
|
-
positionTarget: PositionPropTypes.mountNode,
|
|
60
|
-
positionContainerDisplay: PropTypes.oneOf(['inline-block', 'block']),
|
|
61
|
-
constrain: PositionPropTypes.constrain,
|
|
62
|
-
shouldHideOnSelect: PropTypes.bool,
|
|
63
|
-
shouldContainFocus: PropTypes.bool,
|
|
64
|
-
shouldReturnFocus: PropTypes.bool,
|
|
65
|
-
withArrow: PropTypes.bool,
|
|
66
|
-
offsetX: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
|
|
67
|
-
offsetY: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
|
|
68
|
-
shouldSetAriaExpanded: PropTypes.bool
|
|
69
|
-
};
|
|
70
25
|
const allowedProps = ['rootPageId', 'children', 'id', 'label', 'disabled', 'rotateFocus', 'as', 'role', 'overflowX', 'overflowY', 'height', 'width', 'minHeight', 'minWidth', 'maxHeight', 'maxWidth',
|
|
71
26
|
// Popover version props
|
|
72
27
|
'trigger', 'placement', 'defaultShow', 'show', 'onToggle', 'onSelect', 'onDismiss', 'onFocus', 'onMouseOver', 'elementRef', 'drilldownRef', 'popoverRef', 'mountNode', 'positionTarget', 'positionContainerDisplay', 'constrain', 'shouldHideOnSelect', 'shouldContainFocus', 'shouldReturnFocus', 'withArrow', 'offsetX', 'offsetY'];
|
|
73
|
-
export {
|
|
28
|
+
export { allowedProps };
|
|
@@ -48,7 +48,7 @@ let DrilldownGroup = exports.DrilldownGroup = (_dec = (0, _emotion.withStyle)(nu
|
|
|
48
48
|
// Drilldown.Group is parsed in Drilldown as an Options component.
|
|
49
49
|
return null;
|
|
50
50
|
}
|
|
51
|
-
}, _DrilldownGroup.displayName = "DrilldownGroup", _DrilldownGroup.componentId = 'Drilldown.Group', _DrilldownGroup.
|
|
51
|
+
}, _DrilldownGroup.displayName = "DrilldownGroup", _DrilldownGroup.componentId = 'Drilldown.Group', _DrilldownGroup.allowedProps = _props.allowedProps, _DrilldownGroup.defaultProps = {
|
|
52
52
|
disabled: false,
|
|
53
53
|
withoutSeparators: false,
|
|
54
54
|
// Firefox with NVDA does not read Drilldown.Group with role="group" correctly
|
|
@@ -1,14 +1,9 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
3
|
Object.defineProperty(exports, "__esModule", {
|
|
5
4
|
value: true
|
|
6
5
|
});
|
|
7
|
-
exports.
|
|
8
|
-
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
9
|
-
var _Children = require("@instructure/ui-prop-types/lib/Children.js");
|
|
10
|
-
var _DrilldownOption = _interopRequireDefault(require("../DrilldownOption"));
|
|
11
|
-
var _DrilldownSeparator = _interopRequireDefault(require("../DrilldownSeparator"));
|
|
6
|
+
exports.allowedProps = void 0;
|
|
12
7
|
/*
|
|
13
8
|
* The MIT License (MIT)
|
|
14
9
|
*
|
|
@@ -33,17 +28,4 @@ var _DrilldownSeparator = _interopRequireDefault(require("../DrilldownSeparator"
|
|
|
33
28
|
* SOFTWARE.
|
|
34
29
|
*/
|
|
35
30
|
|
|
36
|
-
const propTypes = exports.propTypes = {
|
|
37
|
-
id: _propTypes.default.string.isRequired,
|
|
38
|
-
children: _Children.Children.oneOf([_DrilldownOption.default, _DrilldownSeparator.default]),
|
|
39
|
-
renderGroupTitle: _propTypes.default.oneOfType([_propTypes.default.node, _propTypes.default.func]),
|
|
40
|
-
withoutSeparators: _propTypes.default.bool,
|
|
41
|
-
disabled: _propTypes.default.bool,
|
|
42
|
-
role: _propTypes.default.string,
|
|
43
|
-
as: _propTypes.default.elementType,
|
|
44
|
-
elementRef: _propTypes.default.func,
|
|
45
|
-
selectableType: _propTypes.default.oneOf(['single', 'multiple']),
|
|
46
|
-
defaultSelected: _propTypes.default.array,
|
|
47
|
-
onSelect: _propTypes.default.func
|
|
48
|
-
};
|
|
49
31
|
const allowedProps = exports.allowedProps = ['id', 'children', 'renderGroupTitle', 'withoutSeparators', 'disabled', 'role', 'as', 'elementRef', 'selectableType', 'defaultSelected', 'onSelect'];
|
|
@@ -47,7 +47,7 @@ let DrilldownOption = exports.DrilldownOption = (_dec = (0, _emotion.withStyle)(
|
|
|
47
47
|
// are parsed in Drilldown and rendered as Options.Item components
|
|
48
48
|
return null;
|
|
49
49
|
}
|
|
50
|
-
}, _DrilldownOption.displayName = "DrilldownOption", _DrilldownOption.componentId = 'Drilldown.Option', _DrilldownOption.
|
|
50
|
+
}, _DrilldownOption.displayName = "DrilldownOption", _DrilldownOption.componentId = 'Drilldown.Option', _DrilldownOption.allowedProps = _props.allowedProps, _DrilldownOption.defaultProps = {
|
|
51
51
|
disabled: false,
|
|
52
52
|
beforeLabelContentVAlign: 'start',
|
|
53
53
|
afterLabelContentVAlign: 'start',
|
|
@@ -1,11 +1,9 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
3
|
Object.defineProperty(exports, "__esModule", {
|
|
5
4
|
value: true
|
|
6
5
|
});
|
|
7
|
-
exports.
|
|
8
|
-
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
6
|
+
exports.allowedProps = void 0;
|
|
9
7
|
/*
|
|
10
8
|
* The MIT License (MIT)
|
|
11
9
|
*
|
|
@@ -30,26 +28,4 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
|
30
28
|
* SOFTWARE.
|
|
31
29
|
*/
|
|
32
30
|
|
|
33
|
-
const propTypes = exports.propTypes = {
|
|
34
|
-
id: _propTypes.default.string.isRequired,
|
|
35
|
-
children: _propTypes.default.oneOfType([_propTypes.default.node, _propTypes.default.func]),
|
|
36
|
-
subPageId: _propTypes.default.string,
|
|
37
|
-
disabled: _propTypes.default.bool,
|
|
38
|
-
selected: _propTypes.default.bool,
|
|
39
|
-
value: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
|
|
40
|
-
href: _propTypes.default.string,
|
|
41
|
-
as: _propTypes.default.elementType,
|
|
42
|
-
role: _propTypes.default.string,
|
|
43
|
-
renderLabelInfo: _propTypes.default.oneOfType([_propTypes.default.node, _propTypes.default.func]),
|
|
44
|
-
renderBeforeLabel: _propTypes.default.oneOfType([_propTypes.default.node, _propTypes.default.func]),
|
|
45
|
-
renderAfterLabel: _propTypes.default.oneOfType([_propTypes.default.node, _propTypes.default.func]),
|
|
46
|
-
beforeLabelContentVAlign: _propTypes.default.oneOf(['start', 'center', 'end']),
|
|
47
|
-
afterLabelContentVAlign: _propTypes.default.oneOf(['start', 'center', 'end']),
|
|
48
|
-
description: _propTypes.default.oneOfType([_propTypes.default.node, _propTypes.default.func]),
|
|
49
|
-
descriptionRole: _propTypes.default.string,
|
|
50
|
-
onOptionClick: _propTypes.default.func,
|
|
51
|
-
defaultSelected: _propTypes.default.bool,
|
|
52
|
-
elementRef: _propTypes.default.func,
|
|
53
|
-
shouldCloseOnClick: _propTypes.default.oneOf(['auto', 'always', 'never'])
|
|
54
|
-
};
|
|
55
31
|
const allowedProps = exports.allowedProps = ['id', 'children', 'subPageId', 'disabled', 'selected', 'value', 'href', 'as', 'role', 'renderLabelInfo', 'renderBeforeLabel', 'renderAfterLabel', 'beforeLabelContentVAlign', 'afterLabelContentVAlign', 'description', 'descriptionRole', 'onOptionClick', 'defaultSelected', 'elementRef', 'shouldCloseOnClick'];
|
|
@@ -47,7 +47,6 @@ class DrilldownPage extends _react.Component {
|
|
|
47
47
|
exports.DrilldownPage = DrilldownPage;
|
|
48
48
|
DrilldownPage.displayName = "DrilldownPage";
|
|
49
49
|
DrilldownPage.componentId = 'Drilldown.Page';
|
|
50
|
-
DrilldownPage.propTypes = _props.propTypes;
|
|
51
50
|
DrilldownPage.allowedProps = _props.allowedProps;
|
|
52
51
|
DrilldownPage.defaultProps = {
|
|
53
52
|
renderBackButtonLabel: 'Back',
|
|
@@ -1,15 +1,9 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
3
|
Object.defineProperty(exports, "__esModule", {
|
|
5
4
|
value: true
|
|
6
5
|
});
|
|
7
|
-
exports.
|
|
8
|
-
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
9
|
-
var _Children = require("@instructure/ui-prop-types/lib/Children.js");
|
|
10
|
-
var _DrilldownGroup = _interopRequireDefault(require("../DrilldownGroup"));
|
|
11
|
-
var _DrilldownOption = _interopRequireDefault(require("../DrilldownOption"));
|
|
12
|
-
var _DrilldownSeparator = _interopRequireDefault(require("../DrilldownSeparator"));
|
|
6
|
+
exports.allowedProps = void 0;
|
|
13
7
|
/*
|
|
14
8
|
* The MIT License (MIT)
|
|
15
9
|
*
|
|
@@ -34,15 +28,4 @@ var _DrilldownSeparator = _interopRequireDefault(require("../DrilldownSeparator"
|
|
|
34
28
|
* SOFTWARE.
|
|
35
29
|
*/
|
|
36
30
|
|
|
37
|
-
const propTypes = exports.propTypes = {
|
|
38
|
-
id: _propTypes.default.string.isRequired,
|
|
39
|
-
children: _Children.Children.oneOf([_DrilldownOption.default, _DrilldownSeparator.default, _DrilldownGroup.default]),
|
|
40
|
-
renderTitle: _propTypes.default.oneOfType([_propTypes.default.node, _propTypes.default.func]),
|
|
41
|
-
renderActionLabel: _propTypes.default.oneOfType([_propTypes.default.node, _propTypes.default.func]),
|
|
42
|
-
renderBackButtonLabel: _propTypes.default.oneOfType([_propTypes.default.node, _propTypes.default.func]),
|
|
43
|
-
onHeaderActionClicked: _propTypes.default.func,
|
|
44
|
-
onBackButtonClicked: _propTypes.default.func,
|
|
45
|
-
withoutHeaderSeparator: _propTypes.default.bool,
|
|
46
|
-
disabled: _propTypes.default.bool
|
|
47
|
-
};
|
|
48
31
|
const allowedProps = exports.allowedProps = ['id', 'children', 'renderTitle', 'renderActionLabel', 'renderBackButtonLabel', 'onHeaderActionClicked', 'onBackButtonClicked', 'withoutHeaderSeparator', 'disabled'];
|
|
@@ -47,5 +47,5 @@ let DrilldownSeparator = exports.DrilldownSeparator = (_dec = (0, _emotion.withS
|
|
|
47
47
|
// are parsed in Drilldown and rendered as Options.Separator components
|
|
48
48
|
return null;
|
|
49
49
|
}
|
|
50
|
-
}, _DrilldownSeparator.displayName = "DrilldownSeparator", _DrilldownSeparator.componentId = 'Drilldown.Separator', _DrilldownSeparator.
|
|
50
|
+
}, _DrilldownSeparator.displayName = "DrilldownSeparator", _DrilldownSeparator.componentId = 'Drilldown.Separator', _DrilldownSeparator.allowedProps = _props.allowedProps, _DrilldownSeparator.defaultProps = {}, _DrilldownSeparator)) || _class);
|
|
51
51
|
var _default = exports.default = DrilldownSeparator;
|
|
@@ -1,11 +1,9 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
3
|
Object.defineProperty(exports, "__esModule", {
|
|
5
4
|
value: true
|
|
6
5
|
});
|
|
7
|
-
exports.
|
|
8
|
-
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
6
|
+
exports.allowedProps = void 0;
|
|
9
7
|
/*
|
|
10
8
|
* The MIT License (MIT)
|
|
11
9
|
*
|
|
@@ -30,8 +28,4 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
|
30
28
|
* SOFTWARE.
|
|
31
29
|
*/
|
|
32
30
|
|
|
33
|
-
const propTypes = exports.propTypes = {
|
|
34
|
-
id: _propTypes.default.string.isRequired,
|
|
35
|
-
as: _propTypes.default.elementType
|
|
36
|
-
};
|
|
37
31
|
const allowedProps = exports.allowedProps = ['id', 'as'];
|