@workday/canvas-kit-labs-react 7.0.0-alpha.129-next.3 → 7.0.0-alpha.256-next.2
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/combobox/README.md +4 -4
- package/combobox/lib/AutocompleteList.tsx +4 -5
- package/combobox/lib/Combobox.tsx +10 -14
- package/common/index.ts +0 -2
- package/common/lib/theming/useThemeRTL.ts +11 -13
- package/dist/commonjs/combobox/lib/AutocompleteList.d.ts +2 -3
- package/dist/commonjs/combobox/lib/AutocompleteList.d.ts.map +1 -1
- package/dist/commonjs/combobox/lib/Combobox.d.ts +3 -4
- package/dist/commonjs/combobox/lib/Combobox.d.ts.map +1 -1
- package/dist/commonjs/combobox/lib/Combobox.js +1 -5
- package/dist/commonjs/common/index.d.ts +0 -2
- package/dist/commonjs/common/index.d.ts.map +1 -1
- package/dist/commonjs/common/index.js +0 -5
- package/dist/commonjs/common/lib/theming/useThemeRTL.d.ts.map +1 -1
- package/dist/commonjs/common/lib/theming/useThemeRTL.js +6 -8
- package/dist/commonjs/drawer/index.d.ts +1 -1
- package/dist/commonjs/drawer/index.d.ts.map +1 -1
- package/dist/commonjs/drawer/index.js +2 -2
- package/dist/commonjs/drawer/lib/Drawer.d.ts +39 -14
- package/dist/commonjs/drawer/lib/Drawer.d.ts.map +1 -1
- package/dist/commonjs/drawer/lib/Drawer.js +39 -21
- package/dist/commonjs/drawer/lib/DrawerHeader.d.ts +24 -7
- package/dist/commonjs/drawer/lib/DrawerHeader.d.ts.map +1 -1
- package/dist/commonjs/drawer/lib/DrawerHeader.js +22 -15
- package/dist/commonjs/expandable/index.d.ts +3 -0
- package/dist/commonjs/expandable/index.d.ts.map +1 -0
- package/dist/commonjs/expandable/index.js +14 -0
- package/dist/commonjs/expandable/lib/Expandable.d.ts +75 -0
- package/dist/commonjs/expandable/lib/Expandable.d.ts.map +1 -0
- package/dist/commonjs/expandable/lib/Expandable.js +50 -0
- package/dist/commonjs/expandable/lib/ExpandableAvatar.d.ts +7 -0
- package/dist/commonjs/expandable/lib/ExpandableAvatar.d.ts.map +1 -0
- package/dist/commonjs/expandable/lib/ExpandableAvatar.js +46 -0
- package/dist/commonjs/expandable/lib/ExpandableContent.d.ts +19 -0
- package/dist/commonjs/expandable/lib/ExpandableContent.d.ts.map +1 -0
- package/dist/commonjs/expandable/lib/ExpandableContent.js +41 -0
- package/dist/commonjs/expandable/lib/ExpandableIcon.d.ts +29 -0
- package/dist/commonjs/expandable/lib/ExpandableIcon.d.ts.map +1 -0
- package/dist/commonjs/expandable/lib/ExpandableIcon.js +62 -0
- package/dist/commonjs/expandable/lib/ExpandableTarget.d.ts +28 -0
- package/dist/commonjs/expandable/lib/ExpandableTarget.d.ts.map +1 -0
- package/dist/commonjs/expandable/lib/ExpandableTarget.js +48 -0
- package/dist/commonjs/expandable/lib/ExpandableTitle.d.ts +9 -0
- package/dist/commonjs/expandable/lib/ExpandableTitle.d.ts.map +1 -0
- package/dist/commonjs/expandable/lib/ExpandableTitle.js +39 -0
- package/dist/commonjs/expandable/lib/hooks/index.d.ts +4 -0
- package/dist/commonjs/expandable/lib/hooks/index.d.ts.map +1 -0
- package/dist/commonjs/expandable/lib/hooks/index.js +15 -0
- package/dist/commonjs/expandable/lib/hooks/useExpandableContent.d.ts +20 -0
- package/dist/commonjs/expandable/lib/hooks/useExpandableContent.d.ts.map +1 -0
- package/dist/commonjs/expandable/lib/hooks/useExpandableContent.js +12 -0
- package/dist/commonjs/expandable/lib/hooks/useExpandableIcon.d.ts +15 -0
- package/dist/commonjs/expandable/lib/hooks/useExpandableIcon.d.ts.map +1 -0
- package/dist/commonjs/expandable/lib/hooks/useExpandableIcon.js +11 -0
- package/dist/commonjs/expandable/lib/hooks/useExpandableTarget.d.ts +17 -0
- package/dist/commonjs/expandable/lib/hooks/useExpandableTarget.d.ts.map +1 -0
- package/dist/commonjs/expandable/lib/hooks/useExpandableTarget.js +20 -0
- package/dist/commonjs/expandable/lib/useExpandableModel.d.ts +50 -0
- package/dist/commonjs/expandable/lib/useExpandableModel.d.ts.map +1 -0
- package/dist/commonjs/expandable/lib/useExpandableModel.js +24 -0
- package/dist/commonjs/index.d.ts +2 -0
- package/dist/commonjs/index.d.ts.map +1 -1
- package/dist/commonjs/index.js +2 -0
- package/dist/commonjs/search-form/lib/SearchForm.d.ts +1 -2
- package/dist/commonjs/search-form/lib/SearchForm.d.ts.map +1 -1
- package/dist/commonjs/search-form/lib/SearchForm.js +2 -4
- package/dist/commonjs/toast/index.d.ts +3 -0
- package/dist/commonjs/toast/index.d.ts.map +1 -0
- package/dist/commonjs/toast/index.js +14 -0
- package/dist/commonjs/toast/lib/Toast.d.ts +27 -0
- package/dist/commonjs/toast/lib/Toast.d.ts.map +1 -0
- package/dist/commonjs/toast/lib/Toast.js +78 -0
- package/dist/commonjs/toast/lib/ToastBody.d.ts +6 -0
- package/dist/commonjs/toast/lib/ToastBody.d.ts.map +1 -0
- package/dist/commonjs/toast/lib/ToastBody.js +40 -0
- package/dist/commonjs/toast/lib/ToastCloseIcon.d.ts +6 -0
- package/dist/commonjs/toast/lib/ToastCloseIcon.d.ts.map +1 -0
- package/dist/commonjs/toast/lib/ToastCloseIcon.js +43 -0
- package/dist/commonjs/toast/lib/ToastIcon.d.ts +5 -0
- package/dist/commonjs/toast/lib/ToastIcon.d.ts.map +1 -0
- package/dist/commonjs/toast/lib/ToastIcon.js +26 -0
- package/dist/commonjs/toast/lib/ToastLink.d.ts +9 -0
- package/dist/commonjs/toast/lib/ToastLink.d.ts.map +1 -0
- package/dist/commonjs/toast/lib/ToastLink.js +42 -0
- package/dist/commonjs/toast/lib/ToastMessage.d.ts +11 -0
- package/dist/commonjs/toast/lib/ToastMessage.d.ts.map +1 -0
- package/dist/commonjs/toast/lib/ToastMessage.js +41 -0
- package/dist/commonjs/toast/lib/hooks/useToastModel.d.ts +65 -0
- package/dist/commonjs/toast/lib/hooks/useToastModel.d.ts.map +1 -0
- package/dist/commonjs/toast/lib/hooks/useToastModel.js +35 -0
- package/dist/es6/combobox/lib/AutocompleteList.d.ts +2 -3
- package/dist/es6/combobox/lib/AutocompleteList.d.ts.map +1 -1
- package/dist/es6/combobox/lib/Combobox.d.ts +3 -4
- package/dist/es6/combobox/lib/Combobox.d.ts.map +1 -1
- package/dist/es6/combobox/lib/Combobox.js +1 -5
- package/dist/es6/common/index.d.ts +0 -2
- package/dist/es6/common/index.d.ts.map +1 -1
- package/dist/es6/common/index.js +0 -2
- package/dist/es6/common/lib/theming/useThemeRTL.d.ts.map +1 -1
- package/dist/es6/common/lib/theming/useThemeRTL.js +7 -9
- package/dist/es6/drawer/index.d.ts +1 -1
- package/dist/es6/drawer/index.d.ts.map +1 -1
- package/dist/es6/drawer/index.js +1 -1
- package/dist/es6/drawer/lib/Drawer.d.ts +39 -14
- package/dist/es6/drawer/lib/Drawer.d.ts.map +1 -1
- package/dist/es6/drawer/lib/Drawer.js +38 -20
- package/dist/es6/drawer/lib/DrawerHeader.d.ts +24 -7
- package/dist/es6/drawer/lib/DrawerHeader.d.ts.map +1 -1
- package/dist/es6/drawer/lib/DrawerHeader.js +22 -15
- package/dist/es6/expandable/index.d.ts +3 -0
- package/dist/es6/expandable/index.d.ts.map +1 -0
- package/dist/es6/expandable/index.js +2 -0
- package/dist/es6/expandable/lib/Expandable.d.ts +75 -0
- package/dist/es6/expandable/lib/Expandable.d.ts.map +1 -0
- package/dist/es6/expandable/lib/Expandable.js +44 -0
- package/dist/es6/expandable/lib/ExpandableAvatar.d.ts +7 -0
- package/dist/es6/expandable/lib/ExpandableAvatar.d.ts.map +1 -0
- package/dist/es6/expandable/lib/ExpandableAvatar.js +40 -0
- package/dist/es6/expandable/lib/ExpandableContent.d.ts +19 -0
- package/dist/es6/expandable/lib/ExpandableContent.d.ts.map +1 -0
- package/dist/es6/expandable/lib/ExpandableContent.js +35 -0
- package/dist/es6/expandable/lib/ExpandableIcon.d.ts +29 -0
- package/dist/es6/expandable/lib/ExpandableIcon.d.ts.map +1 -0
- package/dist/es6/expandable/lib/ExpandableIcon.js +56 -0
- package/dist/es6/expandable/lib/ExpandableTarget.d.ts +28 -0
- package/dist/es6/expandable/lib/ExpandableTarget.d.ts.map +1 -0
- package/dist/es6/expandable/lib/ExpandableTarget.js +42 -0
- package/dist/es6/expandable/lib/ExpandableTitle.d.ts +9 -0
- package/dist/es6/expandable/lib/ExpandableTitle.d.ts.map +1 -0
- package/dist/es6/expandable/lib/ExpandableTitle.js +33 -0
- package/dist/es6/expandable/lib/hooks/index.d.ts +4 -0
- package/dist/es6/expandable/lib/hooks/index.d.ts.map +1 -0
- package/dist/es6/expandable/lib/hooks/index.js +3 -0
- package/dist/es6/expandable/lib/hooks/useExpandableContent.d.ts +20 -0
- package/dist/es6/expandable/lib/hooks/useExpandableContent.d.ts.map +1 -0
- package/dist/es6/expandable/lib/hooks/useExpandableContent.js +9 -0
- package/dist/es6/expandable/lib/hooks/useExpandableIcon.d.ts +15 -0
- package/dist/es6/expandable/lib/hooks/useExpandableIcon.d.ts.map +1 -0
- package/dist/es6/expandable/lib/hooks/useExpandableIcon.js +8 -0
- package/dist/es6/expandable/lib/hooks/useExpandableTarget.d.ts +17 -0
- package/dist/es6/expandable/lib/hooks/useExpandableTarget.d.ts.map +1 -0
- package/dist/es6/expandable/lib/hooks/useExpandableTarget.js +17 -0
- package/dist/es6/expandable/lib/useExpandableModel.d.ts +50 -0
- package/dist/es6/expandable/lib/useExpandableModel.d.ts.map +1 -0
- package/dist/es6/expandable/lib/useExpandableModel.js +21 -0
- package/dist/es6/index.d.ts +2 -0
- package/dist/es6/index.d.ts.map +1 -1
- package/dist/es6/index.js +2 -0
- package/dist/es6/search-form/lib/SearchForm.d.ts +1 -2
- package/dist/es6/search-form/lib/SearchForm.d.ts.map +1 -1
- package/dist/es6/search-form/lib/SearchForm.js +2 -4
- package/dist/es6/toast/index.d.ts +3 -0
- package/dist/es6/toast/index.d.ts.map +1 -0
- package/dist/es6/toast/index.js +2 -0
- package/dist/es6/toast/lib/Toast.d.ts +27 -0
- package/dist/es6/toast/lib/Toast.d.ts.map +1 -0
- package/dist/es6/toast/lib/Toast.js +72 -0
- package/dist/es6/toast/lib/ToastBody.d.ts +6 -0
- package/dist/es6/toast/lib/ToastBody.d.ts.map +1 -0
- package/dist/es6/toast/lib/ToastBody.js +34 -0
- package/dist/es6/toast/lib/ToastCloseIcon.d.ts +6 -0
- package/dist/es6/toast/lib/ToastCloseIcon.d.ts.map +1 -0
- package/dist/es6/toast/lib/ToastCloseIcon.js +37 -0
- package/dist/es6/toast/lib/ToastIcon.d.ts +5 -0
- package/dist/es6/toast/lib/ToastIcon.d.ts.map +1 -0
- package/dist/es6/toast/lib/ToastIcon.js +20 -0
- package/dist/es6/toast/lib/ToastLink.d.ts +9 -0
- package/dist/es6/toast/lib/ToastLink.d.ts.map +1 -0
- package/dist/es6/toast/lib/ToastLink.js +36 -0
- package/dist/es6/toast/lib/ToastMessage.d.ts +11 -0
- package/dist/es6/toast/lib/ToastMessage.d.ts.map +1 -0
- package/dist/es6/toast/lib/ToastMessage.js +35 -0
- package/dist/es6/toast/lib/hooks/useToastModel.d.ts +65 -0
- package/dist/es6/toast/lib/hooks/useToastModel.d.ts.map +1 -0
- package/dist/es6/toast/lib/hooks/useToastModel.js +32 -0
- package/drawer/index.ts +1 -1
- package/drawer/lib/Drawer.tsx +61 -24
- package/drawer/lib/DrawerHeader.tsx +54 -26
- package/expandable/LICENSE +52 -0
- package/expandable/README.md +11 -0
- package/expandable/index.ts +2 -0
- package/expandable/lib/Expandable.tsx +34 -0
- package/expandable/lib/ExpandableAvatar.tsx +26 -0
- package/expandable/lib/ExpandableContent.tsx +32 -0
- package/expandable/lib/ExpandableIcon.tsx +74 -0
- package/expandable/lib/ExpandableTarget.tsx +67 -0
- package/expandable/lib/ExpandableTitle.tsx +34 -0
- package/expandable/lib/hooks/index.ts +3 -0
- package/expandable/lib/hooks/useExpandableContent.ts +9 -0
- package/expandable/lib/hooks/useExpandableIcon.ts +8 -0
- package/expandable/lib/hooks/useExpandableTarget.ts +16 -0
- package/expandable/lib/useExpandableModel.tsx +17 -0
- package/expandable/package.json +6 -0
- package/index.ts +2 -0
- package/package.json +4 -4
- package/search-form/lib/SearchForm.tsx +2 -6
- package/toast/LICENSE +52 -0
- package/toast/README.md +5 -0
- package/toast/index.ts +2 -0
- package/toast/lib/Toast.tsx +63 -0
- package/toast/lib/ToastBody.tsx +34 -0
- package/toast/lib/ToastCloseIcon.tsx +18 -0
- package/toast/lib/ToastIcon.tsx +24 -0
- package/toast/lib/ToastLink.tsx +27 -0
- package/toast/lib/ToastMessage.tsx +21 -0
- package/toast/lib/hooks/useToastModel.tsx +27 -0
- package/toast/package.json +6 -0
- package/common/lib/storybook-utils/ComponentStatesTable.tsx +0 -80
- package/common/lib/storybook-utils/permutateProps.ts +0 -47
- package/common/lib/storybook-utils/propTypes.ts +0 -15
- package/dist/commonjs/common/lib/storybook-utils/ComponentStatesTable.d.ts +0 -26
- package/dist/commonjs/common/lib/storybook-utils/ComponentStatesTable.d.ts.map +0 -1
- package/dist/commonjs/common/lib/storybook-utils/ComponentStatesTable.js +0 -48
- package/dist/commonjs/common/lib/storybook-utils/permutateProps.d.ts +0 -5
- package/dist/commonjs/common/lib/storybook-utils/permutateProps.d.ts.map +0 -1
- package/dist/commonjs/common/lib/storybook-utils/permutateProps.js +0 -47
- package/dist/commonjs/common/lib/storybook-utils/propTypes.d.ts +0 -15
- package/dist/commonjs/common/lib/storybook-utils/propTypes.d.ts.map +0 -1
- package/dist/commonjs/common/lib/storybook-utils/propTypes.js +0 -2
- package/dist/es6/common/lib/storybook-utils/ComponentStatesTable.d.ts +0 -26
- package/dist/es6/common/lib/storybook-utils/ComponentStatesTable.d.ts.map +0 -1
- package/dist/es6/common/lib/storybook-utils/ComponentStatesTable.js +0 -41
- package/dist/es6/common/lib/storybook-utils/permutateProps.d.ts +0 -5
- package/dist/es6/common/lib/storybook-utils/permutateProps.d.ts.map +0 -1
- package/dist/es6/common/lib/storybook-utils/permutateProps.js +0 -43
- package/dist/es6/common/lib/storybook-utils/propTypes.d.ts +0 -15
- package/dist/es6/common/lib/storybook-utils/propTypes.d.ts.map +0 -1
- package/dist/es6/common/lib/storybook-utils/propTypes.js +0 -1
|
@@ -1,12 +1,20 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { CanvasColor } from '@workday/canvas-kit-react/tokens';
|
|
3
|
-
|
|
3
|
+
/**
|
|
4
|
+
* ### Deprecated Drawer Header Props
|
|
5
|
+
*
|
|
6
|
+
* As of Canvas Kit v8, this component is being soft-deprecated.
|
|
7
|
+
* It will be hard-deprecated (completely removed) in v9. Please see the
|
|
8
|
+
* [upgrade guide](https://workday.github.io/canvas-kit/?path=/story/welcome-upgrade-guides-v8-0--page)
|
|
9
|
+
* for more information.
|
|
10
|
+
*/
|
|
11
|
+
export interface DeprecatedDrawerHeaderProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
4
12
|
/**
|
|
5
|
-
* The text of the
|
|
13
|
+
* The text of the DeprecatedDrawerHeader. This text will also be applied as the `title` attribute of the header element.
|
|
6
14
|
*/
|
|
7
15
|
title?: string;
|
|
8
16
|
/**
|
|
9
|
-
* The function called when the
|
|
17
|
+
* The function called when the DeprecatedDrawerHeader close button is clicked.
|
|
10
18
|
*/
|
|
11
19
|
onClose?: React.MouseEventHandler<HTMLButtonElement>;
|
|
12
20
|
/**
|
|
@@ -15,11 +23,11 @@ export interface DrawerHeaderProps extends React.HTMLAttributes<HTMLDivElement>
|
|
|
15
23
|
*/
|
|
16
24
|
closeIconAriaLabel?: string;
|
|
17
25
|
/**
|
|
18
|
-
* The background color of the
|
|
26
|
+
* The background color of the DeprecatedDrawerHeader.
|
|
19
27
|
*/
|
|
20
28
|
headerColor?: CanvasColor | string;
|
|
21
29
|
/**
|
|
22
|
-
* The border color of the
|
|
30
|
+
* The border color of the DeprecatedDrawerHeader. This should match something close to `headerColor`.
|
|
23
31
|
*/
|
|
24
32
|
borderColor?: CanvasColor | string;
|
|
25
33
|
/**
|
|
@@ -28,11 +36,20 @@ export interface DrawerHeaderProps extends React.HTMLAttributes<HTMLDivElement>
|
|
|
28
36
|
*/
|
|
29
37
|
inverse?: boolean;
|
|
30
38
|
/**
|
|
31
|
-
* The unique id of the
|
|
39
|
+
* The unique id of the DeprecatedDrawerHeader for accessibility.
|
|
32
40
|
*/
|
|
33
41
|
id?: string;
|
|
34
42
|
}
|
|
35
|
-
|
|
43
|
+
/**
|
|
44
|
+
* ### Deprecated Drawer Header
|
|
45
|
+
*
|
|
46
|
+
* As of Canvas Kit v8, this component is being soft-deprecated.
|
|
47
|
+
* It will be hard-deprecated (completely removed) in v9. Please see the
|
|
48
|
+
* [upgrade guide](https://workday.github.io/canvas-kit/?path=/story/welcome-upgrade-guides-v8-0--page)
|
|
49
|
+
* for more information.
|
|
50
|
+
*/
|
|
51
|
+
export declare class DeprecatedDrawerHeader extends React.Component<DeprecatedDrawerHeaderProps, {}> {
|
|
52
|
+
componentDidMount(): void;
|
|
36
53
|
render(): JSX.Element;
|
|
37
54
|
}
|
|
38
55
|
//# sourceMappingURL=DrawerHeader.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DrawerHeader.d.ts","sourceRoot":"","sources":["../../../../drawer/lib/DrawerHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,
|
|
1
|
+
{"version":3,"file":"DrawerHeader.d.ts","sourceRoot":"","sources":["../../../../drawer/lib/DrawerHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAgB,WAAW,EAAa,MAAM,kCAAkC,CAAC;AAKxF;;;;;;;GAOG;AAEH,MAAM,WAAW,2BAA4B,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IACvF;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,OAAO,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IACrD;;;OAGG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B;;OAEG;IACH,WAAW,CAAC,EAAE,WAAW,GAAG,MAAM,CAAC;IACnC;;OAEG;IACH,WAAW,CAAC,EAAE,WAAW,GAAG,MAAM,CAAC;IACnC;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;CACb;AA0BD;;;;;;;GAOG;AAEH,qBAAa,sBAAuB,SAAQ,KAAK,CAAC,SAAS,CAAC,2BAA2B,EAAE,EAAE,CAAC;IAC1F,iBAAiB;IASV,MAAM;CAwCd"}
|
|
@@ -57,11 +57,12 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
57
57
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
58
58
|
};
|
|
59
59
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
60
|
-
exports.
|
|
60
|
+
exports.DeprecatedDrawerHeader = void 0;
|
|
61
61
|
var React = __importStar(require("react"));
|
|
62
62
|
var styled_1 = __importDefault(require("@emotion/styled"));
|
|
63
63
|
var tokens_1 = require("@workday/canvas-kit-react/tokens");
|
|
64
64
|
var button_1 = require("@workday/canvas-kit-react/button");
|
|
65
|
+
var text_1 = require("@workday/canvas-kit-react/text");
|
|
65
66
|
var canvas_system_icons_web_1 = require("@workday/canvas-system-icons-web");
|
|
66
67
|
var headerHeight = 56;
|
|
67
68
|
var HeaderContainer = styled_1.default('div')({
|
|
@@ -81,26 +82,32 @@ var HeaderContainer = styled_1.default('div')({
|
|
|
81
82
|
backgroundColor: headerColor,
|
|
82
83
|
});
|
|
83
84
|
});
|
|
84
|
-
var HeaderTitle = styled_1.default('h4')(__assign(__assign({}, tokens_1.type.levels.body.small), { fontWeight: tokens_1.type.properties.fontWeights.bold, whiteSpace: 'nowrap', textOverflow: 'ellipsis', overflow: 'hidden', paddingRight: tokens_1.space.xxxs }), function (_a) {
|
|
85
|
-
var inverse = _a.inverse;
|
|
86
|
-
return ({
|
|
87
|
-
color: inverse ? tokens_1.colors.frenchVanilla100 : tokens_1.typeColors.heading,
|
|
88
|
-
});
|
|
89
|
-
});
|
|
90
85
|
var CloseButton = styled_1.default(button_1.TertiaryButton)({
|
|
91
86
|
margin: '-8px',
|
|
92
87
|
});
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
88
|
+
/**
|
|
89
|
+
* ### Deprecated Drawer Header
|
|
90
|
+
*
|
|
91
|
+
* As of Canvas Kit v8, this component is being soft-deprecated.
|
|
92
|
+
* It will be hard-deprecated (completely removed) in v9. Please see the
|
|
93
|
+
* [upgrade guide](https://workday.github.io/canvas-kit/?path=/story/welcome-upgrade-guides-v8-0--page)
|
|
94
|
+
* for more information.
|
|
95
|
+
*/
|
|
96
|
+
var DeprecatedDrawerHeader = /** @class */ (function (_super) {
|
|
97
|
+
__extends(DeprecatedDrawerHeader, _super);
|
|
98
|
+
function DeprecatedDrawerHeader() {
|
|
96
99
|
return _super !== null && _super.apply(this, arguments) || this;
|
|
97
100
|
}
|
|
98
|
-
|
|
101
|
+
DeprecatedDrawerHeader.prototype.componentDidMount = function () {
|
|
102
|
+
console.warn("This component is being deprecated and will be removed in Canvas Kit V9.\n\n For more information, please see the V8 upgrade guide:\n\n https://workday.github.io/canvas-kit/?path=/story/welcome-upgrade-guides-v8-0--page\n ");
|
|
103
|
+
};
|
|
104
|
+
DeprecatedDrawerHeader.prototype.render = function () {
|
|
99
105
|
var _a = this.props, _b = _a.closeIconAriaLabel, closeIconAriaLabel = _b === void 0 ? 'Close' : _b, _c = _a.headerColor, headerColor = _c === void 0 ? tokens_1.colors.soap100 : _c, _d = _a.borderColor, borderColor = _d === void 0 ? tokens_1.colors.soap500 : _d, _e = _a.inverse, inverse = _e === void 0 ? false : _e, onClose = _a.onClose, title = _a.title, id = _a.id, elemProps = __rest(_a, ["closeIconAriaLabel", "headerColor", "borderColor", "inverse", "onClose", "title", "id"]);
|
|
106
|
+
var variant = inverse ? 'inverse' : undefined;
|
|
100
107
|
return (React.createElement(HeaderContainer, __assign({ borderColor: borderColor }, elemProps, { headerColor: headerColor }),
|
|
101
|
-
React.createElement(
|
|
102
|
-
onClose && closeIconAriaLabel && (React.createElement(CloseButton, { variant:
|
|
108
|
+
React.createElement(text_1.Text, { as: "h4", typeLevel: "body.small", title: title, fontWeight: "bold", color: tokens_1.typeColors.heading, variant: variant, paddingInlineEnd: "xxxs", whiteSpace: "nowrap", textOverflow: "ellipsis", overflow: "hidden" }, title),
|
|
109
|
+
onClose && closeIconAriaLabel && (React.createElement(CloseButton, { variant: variant, onClick: onClose, "aria-label": closeIconAriaLabel, icon: canvas_system_icons_web_1.xIcon }))));
|
|
103
110
|
};
|
|
104
|
-
return
|
|
111
|
+
return DeprecatedDrawerHeader;
|
|
105
112
|
}(React.Component));
|
|
106
|
-
exports.
|
|
113
|
+
exports.DeprecatedDrawerHeader = DeprecatedDrawerHeader;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../expandable/index.ts"],"names":[],"mappings":"AAAA,cAAc,kBAAkB,CAAC;AACjC,cAAc,aAAa,CAAC"}
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
+
if (k2 === undefined) k2 = k;
|
|
4
|
+
Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
|
|
5
|
+
}) : (function(o, m, k, k2) {
|
|
6
|
+
if (k2 === undefined) k2 = k;
|
|
7
|
+
o[k2] = m[k];
|
|
8
|
+
}));
|
|
9
|
+
var __exportStar = (this && this.__exportStar) || function(m, exports) {
|
|
10
|
+
for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
|
|
11
|
+
};
|
|
12
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
13
|
+
__exportStar(require("./lib/Expandable"), exports);
|
|
14
|
+
__exportStar(require("./lib/hooks"), exports);
|
|
@@ -0,0 +1,75 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { ExtractProps } from '@workday/canvas-kit-react/common';
|
|
3
|
+
import { Flex } from '@workday/canvas-kit-react/layout';
|
|
4
|
+
export interface ExpandableProps extends ExtractProps<typeof Flex, never> {
|
|
5
|
+
/**
|
|
6
|
+
* The children of the `Expandable` container. This should contain `Expandable.Target` and
|
|
7
|
+
* `Expandable.Container`
|
|
8
|
+
*/
|
|
9
|
+
children?: React.ReactNode;
|
|
10
|
+
}
|
|
11
|
+
export declare const Expandable: import("@workday/canvas-kit-react/common").ElementComponentM<"div", ExpandableProps & Partial<{
|
|
12
|
+
id: string;
|
|
13
|
+
initialVisibility: import("@workday/canvas-kit-react/disclosure").Visibility;
|
|
14
|
+
}> & {
|
|
15
|
+
onShow?: ((data: Event | React.SyntheticEvent<Element, Event> | undefined, prevState: {
|
|
16
|
+
id: string;
|
|
17
|
+
visibility: import("@workday/canvas-kit-react/disclosure").Visibility;
|
|
18
|
+
}) => void) | undefined;
|
|
19
|
+
onHide?: ((data: Event | React.SyntheticEvent<Element, Event> | undefined, prevState: {
|
|
20
|
+
id: string;
|
|
21
|
+
visibility: import("@workday/canvas-kit-react/disclosure").Visibility;
|
|
22
|
+
}) => void) | undefined;
|
|
23
|
+
} & {
|
|
24
|
+
shouldShow?: ((data: Event | React.SyntheticEvent<Element, Event> | undefined, state: {
|
|
25
|
+
id: string;
|
|
26
|
+
visibility: import("@workday/canvas-kit-react/disclosure").Visibility;
|
|
27
|
+
}) => boolean) | undefined;
|
|
28
|
+
shouldHide?: ((data: Event | React.SyntheticEvent<Element, Event> | undefined, state: {
|
|
29
|
+
id: string;
|
|
30
|
+
visibility: import("@workday/canvas-kit-react/disclosure").Visibility;
|
|
31
|
+
}) => boolean) | undefined;
|
|
32
|
+
}, {
|
|
33
|
+
state: {
|
|
34
|
+
id: string;
|
|
35
|
+
visibility: import("@workday/canvas-kit-react/disclosure").Visibility;
|
|
36
|
+
};
|
|
37
|
+
events: {
|
|
38
|
+
show(event?: Event | React.SyntheticEvent<Element, Event> | undefined): void;
|
|
39
|
+
hide(event?: Event | React.SyntheticEvent<Element, Event> | undefined): void;
|
|
40
|
+
};
|
|
41
|
+
}> & {
|
|
42
|
+
Target: import("@workday/canvas-kit-react/common").ElementComponentM<"button", import("./ExpandableTarget").ExpandableTargetProps, {
|
|
43
|
+
state: {
|
|
44
|
+
id: string;
|
|
45
|
+
visibility: import("@workday/canvas-kit-react/disclosure").Visibility;
|
|
46
|
+
};
|
|
47
|
+
events: {
|
|
48
|
+
show(event?: Event | React.SyntheticEvent<Element, Event> | undefined): void;
|
|
49
|
+
hide(event?: Event | React.SyntheticEvent<Element, Event> | undefined): void;
|
|
50
|
+
};
|
|
51
|
+
}>;
|
|
52
|
+
Content: import("@workday/canvas-kit-react/common").ElementComponentM<"div", import("./ExpandableContent").ExpandableContentProps, {
|
|
53
|
+
state: {
|
|
54
|
+
id: string;
|
|
55
|
+
visibility: import("@workday/canvas-kit-react/disclosure").Visibility;
|
|
56
|
+
};
|
|
57
|
+
events: {
|
|
58
|
+
show(event?: Event | React.SyntheticEvent<Element, Event> | undefined): void;
|
|
59
|
+
hide(event?: Event | React.SyntheticEvent<Element, Event> | undefined): void;
|
|
60
|
+
};
|
|
61
|
+
}>;
|
|
62
|
+
Icon: import("@workday/canvas-kit-react/common").ElementComponentM<"span", import("./ExpandableIcon").ExpandableIconProps, {
|
|
63
|
+
state: {
|
|
64
|
+
id: string;
|
|
65
|
+
visibility: import("@workday/canvas-kit-react/disclosure").Visibility;
|
|
66
|
+
};
|
|
67
|
+
events: {
|
|
68
|
+
show(event?: Event | React.SyntheticEvent<Element, Event> | undefined): void;
|
|
69
|
+
hide(event?: Event | React.SyntheticEvent<Element, Event> | undefined): void;
|
|
70
|
+
};
|
|
71
|
+
}>;
|
|
72
|
+
Avatar: import("@workday/canvas-kit-react/common").ElementComponent<"button", import("./ExpandableAvatar").ExpandableAvatarProps>;
|
|
73
|
+
Title: import("@workday/canvas-kit-react/common").ElementComponent<"div", import("./ExpandableTitle").ExpandableTitleProps>;
|
|
74
|
+
};
|
|
75
|
+
//# sourceMappingURL=Expandable.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Expandable.d.ts","sourceRoot":"","sources":["../../../../expandable/lib/Expandable.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAkB,YAAY,EAAC,MAAM,kCAAkC,CAAC;AAO/E,OAAO,EAAC,IAAI,EAAC,MAAM,kCAAkC,CAAC;AAGtD,MAAM,WAAW,eAAgB,SAAQ,YAAY,CAAC,OAAO,IAAI,EAAE,KAAK,CAAC;IACvE;;;OAGG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAarB,CAAC"}
|
|
@@ -0,0 +1,50 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __assign = (this && this.__assign) || function () {
|
|
3
|
+
__assign = Object.assign || function(t) {
|
|
4
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
+
s = arguments[i];
|
|
6
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
+
t[p] = s[p];
|
|
8
|
+
}
|
|
9
|
+
return t;
|
|
10
|
+
};
|
|
11
|
+
return __assign.apply(this, arguments);
|
|
12
|
+
};
|
|
13
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
14
|
+
var t = {};
|
|
15
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
16
|
+
t[p] = s[p];
|
|
17
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
18
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
19
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
20
|
+
t[p[i]] = s[p[i]];
|
|
21
|
+
}
|
|
22
|
+
return t;
|
|
23
|
+
};
|
|
24
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
25
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
26
|
+
};
|
|
27
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
28
|
+
exports.Expandable = void 0;
|
|
29
|
+
var react_1 = __importDefault(require("react"));
|
|
30
|
+
var common_1 = require("@workday/canvas-kit-react/common");
|
|
31
|
+
var ExpandableContent_1 = require("./ExpandableContent");
|
|
32
|
+
var ExpandableTarget_1 = require("./ExpandableTarget");
|
|
33
|
+
var ExpandableIcon_1 = require("./ExpandableIcon");
|
|
34
|
+
var ExpandableTitle_1 = require("./ExpandableTitle");
|
|
35
|
+
var ExpandableAvatar_1 = require("./ExpandableAvatar");
|
|
36
|
+
var layout_1 = require("@workday/canvas-kit-react/layout");
|
|
37
|
+
var useExpandableModel_1 = require("./useExpandableModel");
|
|
38
|
+
exports.Expandable = common_1.createContainer('div')({
|
|
39
|
+
modelHook: useExpandableModel_1.useExpandableModel,
|
|
40
|
+
subComponents: {
|
|
41
|
+
Target: ExpandableTarget_1.ExpandableTarget,
|
|
42
|
+
Content: ExpandableContent_1.ExpandableContent,
|
|
43
|
+
Icon: ExpandableIcon_1.ExpandableIcon,
|
|
44
|
+
Avatar: ExpandableAvatar_1.ExpandableAvatar,
|
|
45
|
+
Title: ExpandableTitle_1.ExpandableTitle,
|
|
46
|
+
},
|
|
47
|
+
})(function (_a, Element) {
|
|
48
|
+
var children = _a.children, elementProps = __rest(_a, ["children"]);
|
|
49
|
+
return (react_1.default.createElement(layout_1.Flex, __assign({ as: Element, flexDirection: 'column', padding: 'xxs' }, elementProps), children));
|
|
50
|
+
});
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { ExtractProps } from '@workday/canvas-kit-react/common';
|
|
3
|
+
import { Avatar } from '@workday/canvas-kit-react/avatar';
|
|
4
|
+
export interface ExpandableAvatarProps extends Omit<ExtractProps<typeof Avatar, never>, keyof React.ButtonHTMLAttributes<HTMLButtonElement>> {
|
|
5
|
+
}
|
|
6
|
+
export declare const ExpandableAvatar: import("@workday/canvas-kit-react/common").ElementComponent<"button", ExpandableAvatarProps>;
|
|
7
|
+
//# sourceMappingURL=ExpandableAvatar.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ExpandableAvatar.d.ts","sourceRoot":"","sources":["../../../../expandable/lib/ExpandableAvatar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAkB,YAAY,EAAqB,MAAM,kCAAkC,CAAC;AACnG,OAAO,EAAC,MAAM,EAAC,MAAM,kCAAkC,CAAC;AAGxD,MAAM,WAAW,qBACf,SAAQ,IAAI,CACV,YAAY,CAAC,OAAO,MAAM,EAAE,KAAK,CAAC,EAClC,MAAM,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,CACpD;CAAG;AAUN,eAAO,MAAM,gBAAgB,8FAK3B,CAAC"}
|
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __assign = (this && this.__assign) || function () {
|
|
3
|
+
__assign = Object.assign || function(t) {
|
|
4
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
+
s = arguments[i];
|
|
6
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
+
t[p] = s[p];
|
|
8
|
+
}
|
|
9
|
+
return t;
|
|
10
|
+
};
|
|
11
|
+
return __assign.apply(this, arguments);
|
|
12
|
+
};
|
|
13
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
14
|
+
var t = {};
|
|
15
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
16
|
+
t[p] = s[p];
|
|
17
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
18
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
19
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
20
|
+
t[p[i]] = s[p[i]];
|
|
21
|
+
}
|
|
22
|
+
return t;
|
|
23
|
+
};
|
|
24
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
25
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
26
|
+
};
|
|
27
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
28
|
+
exports.ExpandableAvatar = void 0;
|
|
29
|
+
var react_1 = __importDefault(require("react"));
|
|
30
|
+
var common_1 = require("@workday/canvas-kit-react/common");
|
|
31
|
+
var avatar_1 = require("@workday/canvas-kit-react/avatar");
|
|
32
|
+
var tokens_1 = require("@workday/canvas-kit-react/tokens");
|
|
33
|
+
var StyledAvatar = common_1.styled(avatar_1.Avatar)({
|
|
34
|
+
marginRight: tokens_1.space.xxs,
|
|
35
|
+
flexShrink: 0,
|
|
36
|
+
});
|
|
37
|
+
// When the component is created, it needs to be a button element to match AvatarProps.
|
|
38
|
+
// Once Avatar becomes a `createComponent` we can default the element type to a `div`
|
|
39
|
+
// and the types should be properly extracted
|
|
40
|
+
exports.ExpandableAvatar = common_1.createComponent('button')({
|
|
41
|
+
displayName: 'Expandable.Avatar',
|
|
42
|
+
Component: function (_a, ref) {
|
|
43
|
+
var altText = _a.altText, elemProps = __rest(_a, ["altText"]);
|
|
44
|
+
return react_1.default.createElement(StyledAvatar, __assign({ altText: undefined, as: "div", ref: ref, size: 32 }, elemProps));
|
|
45
|
+
},
|
|
46
|
+
});
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
export interface ExpandableContentProps {
|
|
3
|
+
/**
|
|
4
|
+
* The children of the `Expandable.Content` whose visibility is controlled by the associated
|
|
5
|
+
* `Expandable.Target`
|
|
6
|
+
*/
|
|
7
|
+
children?: React.ReactNode;
|
|
8
|
+
}
|
|
9
|
+
export declare const ExpandableContent: import("@workday/canvas-kit-react/common").ElementComponentM<"div", ExpandableContentProps, {
|
|
10
|
+
state: {
|
|
11
|
+
id: string;
|
|
12
|
+
visibility: import("@workday/canvas-kit-react/disclosure").Visibility;
|
|
13
|
+
};
|
|
14
|
+
events: {
|
|
15
|
+
show(event?: Event | React.SyntheticEvent<Element, Event> | undefined): void;
|
|
16
|
+
hide(event?: Event | React.SyntheticEvent<Element, Event> | undefined): void;
|
|
17
|
+
};
|
|
18
|
+
}>;
|
|
19
|
+
//# sourceMappingURL=ExpandableContent.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ExpandableContent.d.ts","sourceRoot":"","sources":["../../../../expandable/lib/ExpandableContent.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAS1B,MAAM,WAAW,sBAAsB;IACrC;;;OAGG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,eAAO,MAAM,iBAAiB;;;;;;;;;EAc5B,CAAC"}
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __assign = (this && this.__assign) || function () {
|
|
3
|
+
__assign = Object.assign || function(t) {
|
|
4
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
+
s = arguments[i];
|
|
6
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
+
t[p] = s[p];
|
|
8
|
+
}
|
|
9
|
+
return t;
|
|
10
|
+
};
|
|
11
|
+
return __assign.apply(this, arguments);
|
|
12
|
+
};
|
|
13
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
14
|
+
var t = {};
|
|
15
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
16
|
+
t[p] = s[p];
|
|
17
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
18
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
19
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
20
|
+
t[p[i]] = s[p[i]];
|
|
21
|
+
}
|
|
22
|
+
return t;
|
|
23
|
+
};
|
|
24
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
25
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
26
|
+
};
|
|
27
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
28
|
+
exports.ExpandableContent = void 0;
|
|
29
|
+
var react_1 = __importDefault(require("react"));
|
|
30
|
+
var tokens_1 = require("@workday/canvas-kit-react/tokens");
|
|
31
|
+
var common_1 = require("@workday/canvas-kit-react/common");
|
|
32
|
+
var useExpandableContent_1 = require("./hooks/useExpandableContent");
|
|
33
|
+
var layout_1 = require("@workday/canvas-kit-react/layout");
|
|
34
|
+
var useExpandableModel_1 = require("./useExpandableModel");
|
|
35
|
+
exports.ExpandableContent = common_1.createSubcomponent('div')({
|
|
36
|
+
modelHook: useExpandableModel_1.useExpandableModel,
|
|
37
|
+
elemPropsHook: useExpandableContent_1.useExpandableContent,
|
|
38
|
+
})(function (_a, Element) {
|
|
39
|
+
var children = _a.children, elementProps = __rest(_a, ["children"]);
|
|
40
|
+
return (react_1.default.createElement(layout_1.Box, __assign({ as: Element, background: "none", padding: tokens_1.space.s + " " + tokens_1.space.xxs + " " + tokens_1.space.xxs }, elementProps), children));
|
|
41
|
+
});
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { ExtractProps } from '@workday/canvas-kit-react/common';
|
|
3
|
+
import { CanvasSystemIcon } from '@workday/design-assets-types';
|
|
4
|
+
import { SystemIcon } from '@workday/canvas-kit-react/icon';
|
|
5
|
+
import { IconPositions } from '@workday/canvas-kit-react/button';
|
|
6
|
+
export interface ExpandableIconProps extends Omit<ExtractProps<typeof SystemIcon, never>, 'icon'> {
|
|
7
|
+
/**
|
|
8
|
+
* Icon to display from `@workday/canvas-accent-icons-web`
|
|
9
|
+
* @default chevronUpIcon
|
|
10
|
+
*/
|
|
11
|
+
icon?: CanvasSystemIcon;
|
|
12
|
+
/**
|
|
13
|
+
* Button icon positions can either be `start` or `end`.
|
|
14
|
+
* If no value is provided, it defaults to `start`.
|
|
15
|
+
* @default 'start'
|
|
16
|
+
*/
|
|
17
|
+
iconPosition?: IconPositions;
|
|
18
|
+
}
|
|
19
|
+
export declare const ExpandableIcon: import("@workday/canvas-kit-react/common").ElementComponentM<"span", ExpandableIconProps, {
|
|
20
|
+
state: {
|
|
21
|
+
id: string;
|
|
22
|
+
visibility: import("@workday/canvas-kit-react/disclosure").Visibility;
|
|
23
|
+
};
|
|
24
|
+
events: {
|
|
25
|
+
show(event?: Event | React.SyntheticEvent<Element, Event> | undefined): void;
|
|
26
|
+
hide(event?: Event | React.SyntheticEvent<Element, Event> | undefined): void;
|
|
27
|
+
};
|
|
28
|
+
}>;
|
|
29
|
+
//# sourceMappingURL=ExpandableIcon.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ExpandableIcon.d.ts","sourceRoot":"","sources":["../../../../expandable/lib/ExpandableIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAEL,YAAY,EAGb,MAAM,kCAAkC,CAAC;AAE1C,OAAO,EAAC,gBAAgB,EAAC,MAAM,8BAA8B,CAAC;AAE9D,OAAO,EAAC,UAAU,EAAC,MAAM,gCAAgC,CAAC;AAC1D,OAAO,EAAC,aAAa,EAAC,MAAM,kCAAkC,CAAC;AAI/D,MAAM,WAAW,mBAAoB,SAAQ,IAAI,CAAC,YAAY,CAAC,OAAO,UAAU,EAAE,KAAK,CAAC,EAAE,MAAM,CAAC;IAC/F;;;OAGG;IACH,IAAI,CAAC,EAAE,gBAAgB,CAAC;IACxB;;;;OAIG;IACH,YAAY,CAAC,EAAE,aAAa,CAAC;CAC9B;AAwBD,eAAO,MAAM,cAAc;;;;;;;;;EAqB1B,CAAC"}
|
|
@@ -0,0 +1,62 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __assign = (this && this.__assign) || function () {
|
|
3
|
+
__assign = Object.assign || function(t) {
|
|
4
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
+
s = arguments[i];
|
|
6
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
+
t[p] = s[p];
|
|
8
|
+
}
|
|
9
|
+
return t;
|
|
10
|
+
};
|
|
11
|
+
return __assign.apply(this, arguments);
|
|
12
|
+
};
|
|
13
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
14
|
+
var t = {};
|
|
15
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
16
|
+
t[p] = s[p];
|
|
17
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
18
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
19
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
20
|
+
t[p[i]] = s[p[i]];
|
|
21
|
+
}
|
|
22
|
+
return t;
|
|
23
|
+
};
|
|
24
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
25
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
26
|
+
};
|
|
27
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
28
|
+
exports.ExpandableIcon = void 0;
|
|
29
|
+
var react_1 = __importDefault(require("react"));
|
|
30
|
+
var common_1 = require("@workday/canvas-kit-react/common");
|
|
31
|
+
var canvas_system_icons_web_1 = require("@workday/canvas-system-icons-web");
|
|
32
|
+
var useExpandableIcon_1 = require("./hooks/useExpandableIcon");
|
|
33
|
+
var icon_1 = require("@workday/canvas-kit-react/icon");
|
|
34
|
+
var tokens_1 = require("@workday/canvas-kit-react/tokens");
|
|
35
|
+
var useExpandableModel_1 = require("./useExpandableModel");
|
|
36
|
+
var StyledEndIcon = common_1.styled(icon_1.SystemIcon)({
|
|
37
|
+
marginLeft: 'auto',
|
|
38
|
+
}, function (_a) {
|
|
39
|
+
var visible = _a.visible;
|
|
40
|
+
return ({
|
|
41
|
+
transform: !visible ? 'rotate(-180deg)' : undefined,
|
|
42
|
+
padding: !visible
|
|
43
|
+
? tokens_1.space.xxxs + " " + tokens_1.space.xs + " " + tokens_1.space.xxxs + " " + tokens_1.space.xxxs
|
|
44
|
+
: tokens_1.space.xxxs + " " + tokens_1.space.xxxs + " " + tokens_1.space.xxxs + " " + tokens_1.space.xs,
|
|
45
|
+
});
|
|
46
|
+
});
|
|
47
|
+
var StyledStartIcon = common_1.styled(icon_1.SystemIcon)({
|
|
48
|
+
margin: "0 " + tokens_1.space.xxs + " 0 0",
|
|
49
|
+
padding: tokens_1.space.xxxs,
|
|
50
|
+
}, function (_a) {
|
|
51
|
+
var visible = _a.visible;
|
|
52
|
+
return ({
|
|
53
|
+
transform: !visible ? 'rotate(-90deg)' : undefined,
|
|
54
|
+
});
|
|
55
|
+
});
|
|
56
|
+
exports.ExpandableIcon = common_1.createSubcomponent('span')({
|
|
57
|
+
modelHook: useExpandableModel_1.useExpandableModel,
|
|
58
|
+
elemPropsHook: useExpandableIcon_1.useExpandableIcon,
|
|
59
|
+
})(function (_a, Element) {
|
|
60
|
+
var icon = _a.icon, visible = _a.visible, _b = _a.iconPosition, iconPosition = _b === void 0 ? 'start' : _b, elementProps = __rest(_a, ["icon", "visible", "iconPosition"]);
|
|
61
|
+
return iconPosition === 'end' ? (react_1.default.createElement(StyledEndIcon, __assign({ as: Element, fill: tokens_1.colors.licorice200, icon: icon || canvas_system_icons_web_1.chevronUpIcon, visible: visible }, elementProps))) : (react_1.default.createElement(StyledStartIcon, __assign({ as: Element, fill: tokens_1.colors.licorice200, icon: icon || canvas_system_icons_web_1.chevronDownIcon, visible: visible }, elementProps)));
|
|
62
|
+
});
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { ExtractProps } from '@workday/canvas-kit-react/common';
|
|
3
|
+
import { Flex } from '@workday/canvas-kit-react/layout';
|
|
4
|
+
export interface ExpandableTargetProps extends ExtractProps<typeof Flex, never> {
|
|
5
|
+
/**
|
|
6
|
+
* Children of the `Expandable.Target`. Should contain `Target.Title`, an optional `Target.Avatar`
|
|
7
|
+
* and `Target.Icon` with an `iconPosition` prop that takes a value of either `start` or `end`.
|
|
8
|
+
* `Target.Icon` with `start` is meant to be placed before the `Target.Title` and `Target.Icon`
|
|
9
|
+
* `end` should be placed after.
|
|
10
|
+
*/
|
|
11
|
+
children: React.ReactNode;
|
|
12
|
+
/**
|
|
13
|
+
* This specifies the semantic heading level that will wrap the `Expandable.Target`'s button. If not
|
|
14
|
+
* defined, then nothing will wrap the button.
|
|
15
|
+
*/
|
|
16
|
+
headingLevel?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
|
|
17
|
+
}
|
|
18
|
+
export declare const ExpandableTarget: import("@workday/canvas-kit-react/common").ElementComponentM<"button", ExpandableTargetProps, {
|
|
19
|
+
state: {
|
|
20
|
+
id: string;
|
|
21
|
+
visibility: import("@workday/canvas-kit-react/disclosure").Visibility;
|
|
22
|
+
};
|
|
23
|
+
events: {
|
|
24
|
+
show(event?: Event | React.SyntheticEvent<Element, Event> | undefined): void;
|
|
25
|
+
hide(event?: Event | React.SyntheticEvent<Element, Event> | undefined): void;
|
|
26
|
+
};
|
|
27
|
+
}>;
|
|
28
|
+
//# sourceMappingURL=ExpandableTarget.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ExpandableTarget.d.ts","sourceRoot":"","sources":["../../../../expandable/lib/ExpandableTarget.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAEL,YAAY,EAKb,MAAM,kCAAkC,CAAC;AAG1C,OAAO,EAAC,IAAI,EAAC,MAAM,kCAAkC,CAAC;AAItD,MAAM,WAAW,qBAAsB,SAAQ,YAAY,CAAC,OAAO,IAAI,EAAE,KAAK,CAAC;IAC7E;;;;;OAKG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;;OAGG;IACH,YAAY,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;CACxD;AAiBD,eAAO,MAAM,gBAAgB;;;;;;;;;EAoB3B,CAAC"}
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __assign = (this && this.__assign) || function () {
|
|
3
|
+
__assign = Object.assign || function(t) {
|
|
4
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
+
s = arguments[i];
|
|
6
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
+
t[p] = s[p];
|
|
8
|
+
}
|
|
9
|
+
return t;
|
|
10
|
+
};
|
|
11
|
+
return __assign.apply(this, arguments);
|
|
12
|
+
};
|
|
13
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
14
|
+
var t = {};
|
|
15
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
16
|
+
t[p] = s[p];
|
|
17
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
18
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
19
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
20
|
+
t[p[i]] = s[p[i]];
|
|
21
|
+
}
|
|
22
|
+
return t;
|
|
23
|
+
};
|
|
24
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
25
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
26
|
+
};
|
|
27
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
28
|
+
exports.ExpandableTarget = void 0;
|
|
29
|
+
var react_1 = __importDefault(require("react"));
|
|
30
|
+
var common_1 = require("@workday/canvas-kit-react/common");
|
|
31
|
+
var useExpandableTarget_1 = require("./hooks/useExpandableTarget");
|
|
32
|
+
var layout_1 = require("@workday/canvas-kit-react/layout");
|
|
33
|
+
var tokens_1 = require("@workday/canvas-kit-react/tokens");
|
|
34
|
+
var useExpandableModel_1 = require("./useExpandableModel");
|
|
35
|
+
var StyledButton = common_1.styled(layout_1.Flex.as('button'))(__assign({ cursor: 'pointer', '&:focus': __assign({}, common_1.focusRing()), '&:hover': {
|
|
36
|
+
background: tokens_1.colors.soap300,
|
|
37
|
+
} }, common_1.hideMouseFocus));
|
|
38
|
+
var Heading = common_1.styled('h1')({
|
|
39
|
+
margin: 0,
|
|
40
|
+
});
|
|
41
|
+
exports.ExpandableTarget = common_1.createSubcomponent('button')({
|
|
42
|
+
modelHook: useExpandableModel_1.useExpandableModel,
|
|
43
|
+
elemPropsHook: useExpandableTarget_1.useExpandableTarget,
|
|
44
|
+
})(function (_a, Element) {
|
|
45
|
+
var children = _a.children, headingLevel = _a.headingLevel, elementProps = __rest(_a, ["children", "headingLevel"]);
|
|
46
|
+
var button = (react_1.default.createElement(StyledButton, __assign({ as: Element, background: "none", border: "none", borderRadius: "m", flexDirection: "row", padding: "xxs", width: "100%" }, elementProps), children));
|
|
47
|
+
return !!headingLevel ? react_1.default.createElement(Heading, { as: headingLevel }, button) : button;
|
|
48
|
+
});
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
export interface ExpandableTitleProps {
|
|
3
|
+
/**
|
|
4
|
+
* Children of the `Expandable.Title`. This should contain a string for the title
|
|
5
|
+
*/
|
|
6
|
+
children: React.ReactNode;
|
|
7
|
+
}
|
|
8
|
+
export declare const ExpandableTitle: import("@workday/canvas-kit-react/common").ElementComponent<"div", ExpandableTitleProps>;
|
|
9
|
+
//# sourceMappingURL=ExpandableTitle.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ExpandableTitle.d.ts","sourceRoot":"","sources":["../../../../expandable/lib/ExpandableTitle.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,MAAM,WAAW,oBAAoB;IACnC;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,eAAO,MAAM,eAAe,0FAoB1B,CAAC"}
|