@workday/canvas-kit-labs-react 7.0.0-alpha.0-next.1 → 7.0.0-alpha.0-next.6
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/lib/Combobox.tsx +5 -3
- package/common/README.md +10 -4
- package/common/lib/Box.tsx +26 -4
- package/common/lib/theming/useThemedRing.ts +9 -5
- package/common/lib/utils/other.ts +20 -0
- package/dist/commonjs/combobox/index.js +12 -4
- package/dist/commonjs/combobox/lib/AutocompleteList.d.ts.map +1 -1
- package/dist/commonjs/combobox/lib/AutocompleteList.js +19 -7
- package/dist/commonjs/combobox/lib/Combobox.d.ts.map +1 -1
- package/dist/commonjs/combobox/lib/Combobox.js +27 -12
- package/dist/commonjs/combobox/lib/Status.d.ts.map +1 -1
- package/dist/commonjs/combobox/lib/Status.js +14 -2
- package/dist/commonjs/common/index.js +15 -7
- package/dist/commonjs/common/lib/Box.d.ts +3 -2
- package/dist/commonjs/common/lib/Box.d.ts.map +1 -1
- package/dist/commonjs/common/lib/Box.js +31 -9
- package/dist/commonjs/common/lib/storybook-utils/ComponentStatesTable.d.ts.map +1 -1
- package/dist/commonjs/common/lib/storybook-utils/ComponentStatesTable.js +3 -1
- package/dist/commonjs/common/lib/storybook-utils/permutateProps.d.ts.map +1 -1
- package/dist/commonjs/common/lib/storybook-utils/permutateProps.js +3 -1
- package/dist/commonjs/common/lib/theming/index.js +12 -5
- package/dist/commonjs/common/lib/theming/useThemeRTL.d.ts.map +1 -1
- package/dist/commonjs/common/lib/theming/useThemeRTL.js +1 -0
- package/dist/commonjs/common/lib/theming/useThemedRing.d.ts +1 -1
- package/dist/commonjs/common/lib/theming/useThemedRing.d.ts.map +1 -1
- package/dist/commonjs/common/lib/theming/useThemedRing.js +8 -2
- package/dist/commonjs/common/lib/utils/border.js +1 -0
- package/dist/commonjs/common/lib/utils/color.js +1 -0
- package/dist/commonjs/common/lib/utils/depth.js +1 -0
- package/dist/commonjs/common/lib/utils/flexItem.js +1 -0
- package/dist/commonjs/common/lib/utils/layout.js +1 -0
- package/dist/commonjs/common/lib/utils/other.d.ts +5 -0
- package/dist/commonjs/common/lib/utils/other.d.ts.map +1 -0
- package/dist/commonjs/common/lib/utils/other.js +19 -0
- package/dist/commonjs/common/lib/utils/position.js +1 -0
- package/dist/commonjs/common/lib/utils/space.js +1 -0
- package/dist/commonjs/drawer/index.js +12 -4
- package/dist/commonjs/drawer/lib/Drawer.js +21 -8
- package/dist/commonjs/drawer/lib/DrawerHeader.js +20 -8
- package/dist/commonjs/index.d.ts +0 -1
- package/dist/commonjs/index.d.ts.map +1 -1
- package/dist/commonjs/index.js +15 -9
- package/dist/commonjs/layout/index.js +12 -5
- package/dist/commonjs/layout/lib/Flex.d.ts +1 -1
- package/dist/commonjs/layout/lib/Flex.d.ts.map +1 -1
- package/dist/commonjs/layout/lib/Flex.js +20 -7
- package/dist/commonjs/layout/lib/Stack.d.ts +8 -8
- package/dist/commonjs/layout/lib/Stack.d.ts.map +1 -1
- package/dist/commonjs/layout/lib/Stack.js +26 -13
- package/dist/commonjs/layout/lib/utils/flex.js +1 -0
- package/dist/commonjs/layout/lib/utils/getValidChildren.js +15 -2
- package/dist/commonjs/layout/lib/utils/stack.js +1 -0
- package/dist/commonjs/search-form/index.js +12 -5
- package/dist/commonjs/search-form/lib/SearchForm.d.ts +3 -2
- package/dist/commonjs/search-form/lib/SearchForm.d.ts.map +1 -1
- package/dist/commonjs/search-form/lib/SearchForm.js +21 -8
- package/dist/commonjs/search-form/lib/themes.d.ts.map +1 -1
- package/dist/commonjs/search-form/lib/themes.js +1 -0
- package/dist/es6/combobox/lib/AutocompleteList.d.ts.map +1 -1
- package/dist/es6/combobox/lib/Combobox.d.ts.map +1 -1
- package/dist/es6/combobox/lib/Combobox.js +1 -1
- package/dist/es6/combobox/lib/Status.d.ts.map +1 -1
- package/dist/es6/common/lib/Box.d.ts +3 -2
- package/dist/es6/common/lib/Box.d.ts.map +1 -1
- package/dist/es6/common/lib/Box.js +12 -3
- package/dist/es6/common/lib/storybook-utils/ComponentStatesTable.d.ts.map +1 -1
- package/dist/es6/common/lib/storybook-utils/permutateProps.d.ts.map +1 -1
- package/dist/es6/common/lib/storybook-utils/propTypes.js +1 -0
- package/dist/es6/common/lib/theming/useThemeRTL.d.ts.map +1 -1
- package/dist/es6/common/lib/theming/useThemedRing.d.ts +1 -1
- package/dist/es6/common/lib/theming/useThemedRing.d.ts.map +1 -1
- package/dist/es6/common/lib/theming/useThemedRing.js +5 -1
- package/dist/es6/common/lib/utils/other.d.ts +5 -0
- package/dist/es6/common/lib/utils/other.d.ts.map +1 -0
- package/dist/es6/common/lib/utils/other.js +15 -0
- package/dist/es6/common/lib/utils/types.js +1 -0
- package/dist/es6/drawer/lib/Drawer.js +1 -1
- package/dist/es6/drawer/lib/DrawerHeader.js +1 -1
- package/dist/es6/index.d.ts +0 -1
- package/dist/es6/index.d.ts.map +1 -1
- package/dist/es6/index.js +0 -1
- package/dist/es6/layout/lib/Flex.d.ts +1 -1
- package/dist/es6/layout/lib/Flex.d.ts.map +1 -1
- package/dist/es6/layout/lib/Stack.d.ts +8 -8
- package/dist/es6/layout/lib/Stack.d.ts.map +1 -1
- package/dist/es6/layout/lib/Stack.js +6 -6
- package/dist/es6/layout/lib/utils/types.js +1 -0
- package/dist/es6/search-form/lib/SearchForm.d.ts +3 -2
- package/dist/es6/search-form/lib/SearchForm.d.ts.map +1 -1
- package/dist/es6/search-form/lib/SearchForm.js +1 -1
- package/dist/es6/search-form/lib/themes.d.ts.map +1 -1
- package/index.ts +0 -1
- package/layout/lib/Stack.tsx +10 -26
- package/package.json +7 -7
- package/search-form/lib/SearchForm.tsx +3 -3
- package/search-form/lib/themes.ts +2 -1
- package/ts3.5/dist/commonjs/common/lib/Box.d.ts +3 -2
- package/ts3.5/dist/commonjs/common/lib/theming/useThemedRing.d.ts +1 -1
- package/ts3.5/dist/commonjs/common/lib/utils/other.d.ts +5 -0
- package/ts3.5/dist/commonjs/index.d.ts +0 -1
- package/ts3.5/dist/commonjs/layout/lib/Flex.d.ts +1 -1
- package/ts3.5/dist/commonjs/layout/lib/Stack.d.ts +8 -8
- package/ts3.5/dist/commonjs/search-form/lib/SearchForm.d.ts +3 -2
- package/ts3.5/dist/es6/common/lib/Box.d.ts +3 -2
- package/ts3.5/dist/es6/common/lib/theming/useThemedRing.d.ts +1 -1
- package/ts3.5/dist/es6/common/lib/utils/other.d.ts +5 -0
- package/ts3.5/dist/es6/index.d.ts +0 -1
- package/ts3.5/dist/es6/layout/lib/Flex.d.ts +1 -1
- package/ts3.5/dist/es6/layout/lib/Stack.d.ts +8 -8
- package/ts3.5/dist/es6/search-form/lib/SearchForm.d.ts +3 -2
- package/dist/commonjs/header/index.d.ts +0 -9
- package/dist/commonjs/header/index.d.ts.map +0 -1
- package/dist/commonjs/header/index.js +0 -16
- package/dist/commonjs/header/lib/GlobalHeader.d.ts +0 -38
- package/dist/commonjs/header/lib/GlobalHeader.d.ts.map +0 -1
- package/dist/commonjs/header/lib/GlobalHeader.js +0 -74
- package/dist/commonjs/header/lib/Header.d.ts +0 -76
- package/dist/commonjs/header/lib/Header.d.ts.map +0 -1
- package/dist/commonjs/header/lib/Header.js +0 -321
- package/dist/commonjs/header/lib/parts/DubLogoTitle.d.ts +0 -30
- package/dist/commonjs/header/lib/parts/DubLogoTitle.d.ts.map +0 -1
- package/dist/commonjs/header/lib/parts/DubLogoTitle.js +0 -105
- package/dist/commonjs/header/lib/parts/WorkdayLogoTitle.d.ts +0 -31
- package/dist/commonjs/header/lib/parts/WorkdayLogoTitle.d.ts.map +0 -1
- package/dist/commonjs/header/lib/parts/WorkdayLogoTitle.js +0 -124
- package/dist/commonjs/header/lib/parts/index.d.ts +0 -3
- package/dist/commonjs/header/lib/parts/index.d.ts.map +0 -1
- package/dist/commonjs/header/lib/parts/index.js +0 -6
- package/dist/commonjs/header/lib/shared/themes.d.ts +0 -43
- package/dist/commonjs/header/lib/shared/themes.d.ts.map +0 -1
- package/dist/commonjs/header/lib/shared/themes.js +0 -62
- package/dist/commonjs/header/lib/shared/types.d.ts +0 -15
- package/dist/commonjs/header/lib/shared/types.d.ts.map +0 -1
- package/dist/commonjs/header/lib/shared/types.js +0 -19
- package/dist/es6/header/index.d.ts +0 -9
- package/dist/es6/header/index.d.ts.map +0 -1
- package/dist/es6/header/index.js +0 -8
- package/dist/es6/header/lib/GlobalHeader.d.ts +0 -38
- package/dist/es6/header/lib/GlobalHeader.d.ts.map +0 -1
- package/dist/es6/header/lib/GlobalHeader.js +0 -62
- package/dist/es6/header/lib/Header.d.ts +0 -76
- package/dist/es6/header/lib/Header.d.ts.map +0 -1
- package/dist/es6/header/lib/Header.js +0 -309
- package/dist/es6/header/lib/parts/DubLogoTitle.d.ts +0 -30
- package/dist/es6/header/lib/parts/DubLogoTitle.d.ts.map +0 -1
- package/dist/es6/header/lib/parts/DubLogoTitle.js +0 -93
- package/dist/es6/header/lib/parts/WorkdayLogoTitle.d.ts +0 -31
- package/dist/es6/header/lib/parts/WorkdayLogoTitle.d.ts.map +0 -1
- package/dist/es6/header/lib/parts/WorkdayLogoTitle.js +0 -112
- package/dist/es6/header/lib/parts/index.d.ts +0 -3
- package/dist/es6/header/lib/parts/index.d.ts.map +0 -1
- package/dist/es6/header/lib/parts/index.js +0 -2
- package/dist/es6/header/lib/shared/themes.d.ts +0 -43
- package/dist/es6/header/lib/shared/themes.d.ts.map +0 -1
- package/dist/es6/header/lib/shared/themes.js +0 -57
- package/dist/es6/header/lib/shared/types.d.ts +0 -15
- package/dist/es6/header/lib/shared/types.d.ts.map +0 -1
- package/dist/es6/header/lib/shared/types.js +0 -17
- package/header/LICENSE +0 -51
- package/header/README.md +0 -359
- package/header/index.ts +0 -9
- package/header/lib/GlobalHeader.tsx +0 -73
- package/header/lib/Header.tsx +0 -429
- package/header/lib/parts/DubLogoTitle.tsx +0 -99
- package/header/lib/parts/WorkdayLogoTitle.tsx +0 -120
- package/header/lib/parts/index.ts +0 -2
- package/header/lib/shared/themes.tsx +0 -97
- package/header/lib/shared/types.tsx +0 -16
- package/header/package.json +0 -5
- package/ts3.5/dist/commonjs/header/index.d.ts +0 -9
- package/ts3.5/dist/commonjs/header/lib/GlobalHeader.d.ts +0 -38
- package/ts3.5/dist/commonjs/header/lib/Header.d.ts +0 -76
- package/ts3.5/dist/commonjs/header/lib/parts/DubLogoTitle.d.ts +0 -30
- package/ts3.5/dist/commonjs/header/lib/parts/WorkdayLogoTitle.d.ts +0 -31
- package/ts3.5/dist/commonjs/header/lib/parts/index.d.ts +0 -3
- package/ts3.5/dist/commonjs/header/lib/shared/themes.d.ts +0 -43
- package/ts3.5/dist/commonjs/header/lib/shared/types.d.ts +0 -15
- package/ts3.5/dist/es6/header/index.d.ts +0 -9
- package/ts3.5/dist/es6/header/lib/GlobalHeader.d.ts +0 -38
- package/ts3.5/dist/es6/header/lib/Header.d.ts +0 -76
- package/ts3.5/dist/es6/header/lib/parts/DubLogoTitle.d.ts +0 -30
- package/ts3.5/dist/es6/header/lib/parts/WorkdayLogoTitle.d.ts +0 -31
- package/ts3.5/dist/es6/header/lib/parts/index.d.ts +0 -3
- package/ts3.5/dist/es6/header/lib/shared/themes.d.ts +0 -43
- package/ts3.5/dist/es6/header/lib/shared/types.d.ts +0 -15
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React, {useEffect, useLayoutEffect, useRef, useState, useCallback} from 'react';
|
|
2
|
-
import {
|
|
2
|
+
import {jsx, keyframes, CSSObject} from '@emotion/react';
|
|
3
3
|
import {
|
|
4
4
|
GrowthBehavior,
|
|
5
5
|
useForkRef,
|
|
@@ -426,8 +426,10 @@ const Combobox = ({
|
|
|
426
426
|
[paddingDirection]: space.xl,
|
|
427
427
|
};
|
|
428
428
|
}
|
|
429
|
-
const newTextInputProps: Partial<
|
|
430
|
-
|
|
429
|
+
const newTextInputProps: Partial<
|
|
430
|
+
TextInputProps &
|
|
431
|
+
React.InputHTMLAttributes<HTMLInputElement> & {ref: React.Ref<HTMLInputElement>}
|
|
432
|
+
> & {css: CSSObject} = {
|
|
431
433
|
type: 'text',
|
|
432
434
|
id: componentId,
|
|
433
435
|
grow: grow,
|
package/common/README.md
CHANGED
|
@@ -31,6 +31,7 @@ together.
|
|
|
31
31
|
### Usage
|
|
32
32
|
|
|
33
33
|
```tsx
|
|
34
|
+
/** @jsxRuntime classic */
|
|
34
35
|
/** @jsx jsx */
|
|
35
36
|
import {jsx} from '@emotion/core';
|
|
36
37
|
import {ComponentStyles, useThemeRTL} from '@workday/canvas-kit-labs-react/common';
|
|
@@ -67,19 +68,23 @@ export const HelloWorld = ({backgroundImagePath}) => {
|
|
|
67
68
|
|
|
68
69
|
## useThemedRing
|
|
69
70
|
|
|
70
|
-
This is a way to automatically add themed colors to your inputs. This is helpful when showing alerts
|
|
71
|
-
|
|
71
|
+
This is a way to automatically add themed colors to your inputs. This is helpful when showing alerts
|
|
72
|
+
to users. It supports `error`, `alert`, and `success` states. It will try and use the corresponding
|
|
73
|
+
`main` colors from your `CanvasThemePalette` unless they do not meet accessibility contrast, in
|
|
74
|
+
which case the outer ring will use the `darkest` color. This hook will also show a `focusOutline`
|
|
75
|
+
ring when the input is focused. Note: You should not rely on these colors alone to differentiate
|
|
76
|
+
alerts, but use them in combination with icons or hint text.
|
|
72
77
|
|
|
73
78
|
### Usage
|
|
74
79
|
|
|
75
80
|
```tsx
|
|
81
|
+
/** @jsxRuntime classic */
|
|
76
82
|
/** @jsx jsx */
|
|
77
83
|
import {jsx} from '@emotion/core';
|
|
78
84
|
import React from 'react';
|
|
79
85
|
import {TextInput} from '@workday/canvas-kit-preview-react/text-input';
|
|
80
86
|
import {useThemedRing} from '@workday/canvas-kit-labs-react/common';
|
|
81
87
|
|
|
82
|
-
|
|
83
88
|
export const MyInput = ({handleChange}) => {
|
|
84
89
|
const [value, setValue] = React.useState('invalid@email');
|
|
85
90
|
const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {
|
|
@@ -95,4 +100,5 @@ export const MyInput = ({handleChange}) => {
|
|
|
95
100
|
<TextInput.Hint>Please enter a valid email.</TextInput.Hint>
|
|
96
101
|
</TextInput>
|
|
97
102
|
);
|
|
98
|
-
}
|
|
103
|
+
};
|
|
104
|
+
```
|
package/common/lib/Box.tsx
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import styled from '@emotion/styled';
|
|
3
3
|
import isPropValid from '@emotion/is-prop-valid';
|
|
4
|
-
import {createComponent, StyledType} from '@workday/canvas-kit-react/common';
|
|
4
|
+
import {createComponent, StyledType, useConstant} from '@workday/canvas-kit-react/common';
|
|
5
5
|
|
|
6
6
|
// style props
|
|
7
7
|
import {border, BorderStyleProps} from './utils/border';
|
|
@@ -9,6 +9,7 @@ import {color, ColorStyleProps} from './utils/color';
|
|
|
9
9
|
import {depth, DepthStyleProps} from './utils/depth';
|
|
10
10
|
import {flexItem, FlexItemStyleProps} from './utils/flexItem';
|
|
11
11
|
import {layout, LayoutStyleProps} from './utils/layout';
|
|
12
|
+
import {other, OtherStyleProps} from './utils/other';
|
|
12
13
|
import {position, PositionStyleProps} from './utils/position';
|
|
13
14
|
import {space, SpaceStyleProps} from './utils/space';
|
|
14
15
|
|
|
@@ -17,6 +18,7 @@ export type BoxProps = BorderStyleProps &
|
|
|
17
18
|
DepthStyleProps &
|
|
18
19
|
FlexItemStyleProps &
|
|
19
20
|
LayoutStyleProps &
|
|
21
|
+
OtherStyleProps &
|
|
20
22
|
PositionStyleProps &
|
|
21
23
|
SpaceStyleProps & {
|
|
22
24
|
children?: React.ReactNode;
|
|
@@ -28,7 +30,8 @@ const shouldForwardProp = (prop: string) => {
|
|
|
28
30
|
return isPropValid(prop) && !omittedProps.includes(prop);
|
|
29
31
|
};
|
|
30
32
|
|
|
31
|
-
|
|
33
|
+
// Meant to be used with elements. The `shouldForwardProps` will remove all style props
|
|
34
|
+
const StyledBoxElement = styled('div', {shouldForwardProp})<StyledType & BoxProps>(
|
|
32
35
|
{
|
|
33
36
|
boxSizing: 'border-box',
|
|
34
37
|
},
|
|
@@ -41,6 +44,21 @@ const StyledBox = styled('div', {shouldForwardProp})<StyledType & BoxProps>(
|
|
|
41
44
|
space
|
|
42
45
|
);
|
|
43
46
|
|
|
47
|
+
// Meant to be used with components. There is no `shouldForwardProps` - all props will be forwarded to the component
|
|
48
|
+
const StyledBoxComponent = styled('div')<StyledType & BoxProps>(
|
|
49
|
+
{
|
|
50
|
+
boxSizing: 'border-box',
|
|
51
|
+
},
|
|
52
|
+
border,
|
|
53
|
+
color,
|
|
54
|
+
depth,
|
|
55
|
+
flexItem,
|
|
56
|
+
layout,
|
|
57
|
+
other,
|
|
58
|
+
position,
|
|
59
|
+
space
|
|
60
|
+
);
|
|
61
|
+
|
|
44
62
|
/**
|
|
45
63
|
* `Box` is a primitive component that provides a common, ergonomic API around Canvas design tokens.
|
|
46
64
|
* It is highly flexible, and its primary purpose is to build other components.
|
|
@@ -61,10 +79,14 @@ const StyledBox = styled('div', {shouldForwardProp})<StyledType & BoxProps>(
|
|
|
61
79
|
export const Box = createComponent('div')({
|
|
62
80
|
displayName: 'Box',
|
|
63
81
|
Component: ({children, ...elemProps}: BoxProps, ref, Element) => {
|
|
82
|
+
const BoxComponent = useConstant(() =>
|
|
83
|
+
typeof Element === 'string' ? StyledBoxElement : StyledBoxComponent
|
|
84
|
+
);
|
|
85
|
+
|
|
64
86
|
return (
|
|
65
|
-
<
|
|
87
|
+
<BoxComponent as={Element} ref={ref} {...elemProps}>
|
|
66
88
|
{children}
|
|
67
|
-
</
|
|
89
|
+
</BoxComponent>
|
|
68
90
|
);
|
|
69
91
|
},
|
|
70
92
|
});
|
|
@@ -15,12 +15,16 @@ const isAccessible = (foreground: string, background: string = colors.frenchVani
|
|
|
15
15
|
|
|
16
16
|
const getPaletteColorsFromTheme = (
|
|
17
17
|
palette: CanvasThemePalette,
|
|
18
|
-
fallbackColors?: ContrastColors
|
|
18
|
+
fallbackColors?: ContrastColors
|
|
19
19
|
): ContrastColors => {
|
|
20
20
|
return {
|
|
21
|
-
outer: isAccessible(palette.main)
|
|
21
|
+
outer: isAccessible(palette.main)
|
|
22
|
+
? palette.main
|
|
23
|
+
: isAccessible(palette.darkest)
|
|
24
|
+
? palette.darkest
|
|
25
|
+
: fallbackColors?.outer,
|
|
22
26
|
inner: fallbackColors?.inner ? fallbackColors.inner : palette.main,
|
|
23
|
-
}
|
|
27
|
+
};
|
|
24
28
|
};
|
|
25
29
|
|
|
26
30
|
export function getPaletteColors(
|
|
@@ -31,10 +35,10 @@ export function getPaletteColors(
|
|
|
31
35
|
|
|
32
36
|
switch (type) {
|
|
33
37
|
case 'error': {
|
|
34
|
-
return getPaletteColorsFromTheme(palette, {
|
|
38
|
+
return getPaletteColorsFromTheme(palette, {outer: inputColors.error.border});
|
|
35
39
|
}
|
|
36
40
|
case 'alert': {
|
|
37
|
-
return getPaletteColorsFromTheme(palette, {
|
|
41
|
+
return getPaletteColorsFromTheme(palette, {outer: colors.cantaloupe600});
|
|
38
42
|
}
|
|
39
43
|
case 'success': {
|
|
40
44
|
return getPaletteColorsFromTheme(palette, {
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
export type OtherStyleProps = {
|
|
2
|
+
animation?: string;
|
|
3
|
+
};
|
|
4
|
+
|
|
5
|
+
const otherProps = {
|
|
6
|
+
animation: (value: string) => {
|
|
7
|
+
return {animation: value};
|
|
8
|
+
},
|
|
9
|
+
};
|
|
10
|
+
|
|
11
|
+
export function other<P extends OtherStyleProps>(props: P) {
|
|
12
|
+
for (const key in props) {
|
|
13
|
+
if (key in otherProps) {
|
|
14
|
+
const value = props[key as keyof OtherStyleProps] as keyof OtherStyleProps;
|
|
15
|
+
const styleFn = otherProps[key as keyof OtherStyleProps];
|
|
16
|
+
return styleFn(value);
|
|
17
|
+
}
|
|
18
|
+
}
|
|
19
|
+
return {};
|
|
20
|
+
}
|
|
@@ -1,12 +1,20 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
function
|
|
3
|
-
|
|
4
|
-
}
|
|
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
|
+
};
|
|
5
12
|
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
6
13
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
7
14
|
};
|
|
8
15
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
16
|
+
exports.Combobox = void 0;
|
|
9
17
|
var Combobox_1 = __importDefault(require("./lib/Combobox"));
|
|
10
18
|
exports.Combobox = Combobox_1.default;
|
|
11
19
|
exports.default = Combobox_1.default;
|
|
12
|
-
|
|
20
|
+
__exportStar(require("./lib/Combobox"), exports);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AutocompleteList.d.ts","sourceRoot":"","sources":["../../../../combobox/lib/AutocompleteList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAIhD,OAAO,EAAC,aAAa,EAAC,MAAM,wCAAwC,CAAC;AACrE,OAAO,EAAC,qBAAqB,EAAiD,MAAM,YAAY,CAAC;AAYjG,UAAU,qBAAqB;IAC7B;;OAEG;IACH,iBAAiB,EAAE,KAAK,CAAC,YAAY,CAAC,aAAa,CAAC,EAAE,GAAG,qBAAqB,EAAE,CAAC;IACjF;;OAEG;IACH,aAAa,EAAE,MAAM,GAAG,IAAI,CAAC;IAC7B;;OAEG;IACH,uBAAuB,EAAE,CACvB,KAAK,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,EAAE,KAAK,CAAC,EAC3C,aAAa,EAAE,aAAa,KACzB,IAAI,CAAC;IACV;;OAEG;IACH,OAAO,EAAE,MAAM,CAAC;IAChB;;OAEG;IACH,UAAU,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,aAAa,EAAE,OAAO,CAAC;CACxB;AAED,QAAA,MAAM,gBAAgB,
|
|
1
|
+
{"version":3,"file":"AutocompleteList.d.ts","sourceRoot":"","sources":["../../../../combobox/lib/AutocompleteList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAIhD,OAAO,EAAC,aAAa,EAAC,MAAM,wCAAwC,CAAC;AACrE,OAAO,EAAC,qBAAqB,EAAiD,MAAM,YAAY,CAAC;AAYjG,UAAU,qBAAqB;IAC7B;;OAEG;IACH,iBAAiB,EAAE,KAAK,CAAC,YAAY,CAAC,aAAa,CAAC,EAAE,GAAG,qBAAqB,EAAE,CAAC;IACjF;;OAEG;IACH,aAAa,EAAE,MAAM,GAAG,IAAI,CAAC;IAC7B;;OAEG;IACH,uBAAuB,EAAE,CACvB,KAAK,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,EAAE,KAAK,CAAC,EAC3C,aAAa,EAAE,aAAa,KACzB,IAAI,CAAC;IACV;;OAEG;IACH,OAAO,EAAE,MAAM,CAAC;IAChB;;OAEG;IACH,UAAU,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,aAAa,EAAE,OAAO,CAAC;CACxB;AAED,QAAA,MAAM,gBAAgB,uGAOnB,qBAAqB,uBAiFvB,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
|
|
@@ -10,6 +10,25 @@ var __assign = (this && this.__assign) || function () {
|
|
|
10
10
|
};
|
|
11
11
|
return __assign.apply(this, arguments);
|
|
12
12
|
};
|
|
13
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
14
|
+
if (k2 === undefined) k2 = k;
|
|
15
|
+
Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
|
|
16
|
+
}) : (function(o, m, k, k2) {
|
|
17
|
+
if (k2 === undefined) k2 = k;
|
|
18
|
+
o[k2] = m[k];
|
|
19
|
+
}));
|
|
20
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
21
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
22
|
+
}) : function(o, v) {
|
|
23
|
+
o["default"] = v;
|
|
24
|
+
});
|
|
25
|
+
var __importStar = (this && this.__importStar) || function (mod) {
|
|
26
|
+
if (mod && mod.__esModule) return mod;
|
|
27
|
+
var result = {};
|
|
28
|
+
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
29
|
+
__setModuleDefault(result, mod);
|
|
30
|
+
return result;
|
|
31
|
+
};
|
|
13
32
|
var __spreadArrays = (this && this.__spreadArrays) || function () {
|
|
14
33
|
for (var s = 0, i = 0, il = arguments.length; i < il; i++) s += arguments[i].length;
|
|
15
34
|
for (var r = Array(s), k = 0, i = 0; i < il; i++)
|
|
@@ -17,13 +36,6 @@ var __spreadArrays = (this && this.__spreadArrays) || function () {
|
|
|
17
36
|
r[k] = a[j];
|
|
18
37
|
return r;
|
|
19
38
|
};
|
|
20
|
-
var __importStar = (this && this.__importStar) || function (mod) {
|
|
21
|
-
if (mod && mod.__esModule) return mod;
|
|
22
|
-
var result = {};
|
|
23
|
-
if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k];
|
|
24
|
-
result["default"] = mod;
|
|
25
|
-
return result;
|
|
26
|
-
};
|
|
27
39
|
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
28
40
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
29
41
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Combobox.d.ts","sourceRoot":"","sources":["../../../../combobox/lib/Combobox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkE,MAAM,OAAO,CAAC;AAEvF,OAAO,EACL,cAAc,EAKf,MAAM,kCAAkC,CAAC;AAE1C,OAAO,EAAC,aAAa,EAAC,MAAM,wCAAwC,CAAC;AAErE,OAAO,EAAa,eAAe,EAAC,MAAM,kCAAkC,CAAC;AAE7E,OAAO,EAAC,cAAc,EAAC,MAAM,sCAAsC,CAAC;AAKpE,MAAM,WAAW,qBAAqB;IAEpC,MAAM,EAAE,KAAK,CAAC,YAAY,CAAC,aAAa,CAAC,CAAC;IAE1C,KAAK,EAAE,KAAK,CAAC,YAAY,CAAC,aAAa,CAAC,EAAE,CAAC;CAC5C;AAED,MAAM,WAAW,aAAc,SAAQ,cAAc,EAAE,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC;IACtF;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,YAAY,CAAC,cAAc,CAAC,CAAC;IAC7C;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;OAGG;IACH,kBAAkB,CAAC,EAAE,eAAe,CAAC,SAAS,CAAC,CAAC;IAChD;;;OAGG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;;OAGG;IACH,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B;;OAEG;IACH,iBAAiB,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,aAAa,CAAC,EAAE,GAAG,qBAAqB,EAAE,CAAC;IAClF;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IAC5D;;OAEG;IACH,OAAO,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC;IAClC;;OAEG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC;IACjC;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;OAEG;IACH,aAAa,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,MAAM,CAAC;CAC/C;AA6DD,eAAO,MAAM,aAAa,YAAY,CAAC;AAEvC,eAAO,MAAM,WAAW,qEACc,CAAC;AAEvC,eAAO,MAAM,kBAAkB,
|
|
1
|
+
{"version":3,"file":"Combobox.d.ts","sourceRoot":"","sources":["../../../../combobox/lib/Combobox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkE,MAAM,OAAO,CAAC;AAEvF,OAAO,EACL,cAAc,EAKf,MAAM,kCAAkC,CAAC;AAE1C,OAAO,EAAC,aAAa,EAAC,MAAM,wCAAwC,CAAC;AAErE,OAAO,EAAa,eAAe,EAAC,MAAM,kCAAkC,CAAC;AAE7E,OAAO,EAAC,cAAc,EAAC,MAAM,sCAAsC,CAAC;AAKpE,MAAM,WAAW,qBAAqB;IAEpC,MAAM,EAAE,KAAK,CAAC,YAAY,CAAC,aAAa,CAAC,CAAC;IAE1C,KAAK,EAAE,KAAK,CAAC,YAAY,CAAC,aAAa,CAAC,EAAE,CAAC;CAC5C;AAED,MAAM,WAAW,aAAc,SAAQ,cAAc,EAAE,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC;IACtF;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,YAAY,CAAC,cAAc,CAAC,CAAC;IAC7C;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;OAGG;IACH,kBAAkB,CAAC,EAAE,eAAe,CAAC,SAAS,CAAC,CAAC;IAChD;;;OAGG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;;OAGG;IACH,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B;;OAEG;IACH,iBAAiB,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,aAAa,CAAC,EAAE,GAAG,qBAAqB,EAAE,CAAC;IAClF;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IAC5D;;OAEG;IACH,OAAO,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC;IAClC;;OAEG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC;IACjC;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;OAEG;IACH,aAAa,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,MAAM,CAAC;CAC/C;AA6DD,eAAO,MAAM,aAAa,YAAY,CAAC;AAEvC,eAAO,MAAM,WAAW,qEACc,CAAC;AAEvC,eAAO,MAAM,kBAAkB,cAAe,MAAM,SAAS,WAc5D,CAAC;AAYF,QAAA,MAAM,QAAQ,wLAeX,aAAa,gBA0Tf,CAAC;AAEF,eAAe,QAAQ,CAAC"}
|
|
@@ -10,6 +10,25 @@ var __assign = (this && this.__assign) || function () {
|
|
|
10
10
|
};
|
|
11
11
|
return __assign.apply(this, arguments);
|
|
12
12
|
};
|
|
13
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
14
|
+
if (k2 === undefined) k2 = k;
|
|
15
|
+
Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
|
|
16
|
+
}) : (function(o, m, k, k2) {
|
|
17
|
+
if (k2 === undefined) k2 = k;
|
|
18
|
+
o[k2] = m[k];
|
|
19
|
+
}));
|
|
20
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
21
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
22
|
+
}) : function(o, v) {
|
|
23
|
+
o["default"] = v;
|
|
24
|
+
});
|
|
25
|
+
var __importStar = (this && this.__importStar) || function (mod) {
|
|
26
|
+
if (mod && mod.__esModule) return mod;
|
|
27
|
+
var result = {};
|
|
28
|
+
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
29
|
+
__setModuleDefault(result, mod);
|
|
30
|
+
return result;
|
|
31
|
+
};
|
|
13
32
|
var __rest = (this && this.__rest) || function (s, e) {
|
|
14
33
|
var t = {};
|
|
15
34
|
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
@@ -21,19 +40,13 @@ var __rest = (this && this.__rest) || function (s, e) {
|
|
|
21
40
|
}
|
|
22
41
|
return t;
|
|
23
42
|
};
|
|
24
|
-
var __importStar = (this && this.__importStar) || function (mod) {
|
|
25
|
-
if (mod && mod.__esModule) return mod;
|
|
26
|
-
var result = {};
|
|
27
|
-
if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k];
|
|
28
|
-
result["default"] = mod;
|
|
29
|
-
return result;
|
|
30
|
-
};
|
|
31
43
|
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
32
44
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
33
45
|
};
|
|
34
46
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
47
|
+
exports.getTextFromElement = exports.getOptionId = exports.listBoxIdPart = void 0;
|
|
35
48
|
var react_1 = __importStar(require("react"));
|
|
36
|
-
var
|
|
49
|
+
var react_2 = require("@emotion/react");
|
|
37
50
|
var common_1 = require("@workday/canvas-kit-react/common");
|
|
38
51
|
var tokens_1 = require("@workday/canvas-kit-react/tokens");
|
|
39
52
|
var card_1 = require("@workday/canvas-kit-react/card");
|
|
@@ -55,7 +68,7 @@ var InputContainer = common_1.styled('div')({
|
|
|
55
68
|
alignItems: "center",
|
|
56
69
|
position: 'relative',
|
|
57
70
|
});
|
|
58
|
-
var fadeInKeyframes =
|
|
71
|
+
var fadeInKeyframes = react_2.keyframes({
|
|
59
72
|
'0%': {
|
|
60
73
|
opacity: 0,
|
|
61
74
|
},
|
|
@@ -98,10 +111,11 @@ var ResetButton = common_1.styled(button_1.IconButton)({
|
|
|
98
111
|
});
|
|
99
112
|
exports.listBoxIdPart = "listbox";
|
|
100
113
|
var optionIdPart = "option";
|
|
101
|
-
|
|
114
|
+
var getOptionId = function (baseId, index) {
|
|
102
115
|
return baseId + "-" + optionIdPart + "-" + index;
|
|
103
116
|
};
|
|
104
|
-
exports.
|
|
117
|
+
exports.getOptionId = getOptionId;
|
|
118
|
+
var getTextFromElement = function (children) {
|
|
105
119
|
var text = '';
|
|
106
120
|
react_1.default.Children.map(children, function (child) {
|
|
107
121
|
if (child == null || typeof child === 'boolean' || child === {}) {
|
|
@@ -119,6 +133,7 @@ exports.getTextFromElement = function (children) {
|
|
|
119
133
|
});
|
|
120
134
|
return text;
|
|
121
135
|
};
|
|
136
|
+
exports.getTextFromElement = getTextFromElement;
|
|
122
137
|
var buildStatusString = function (listCount) {
|
|
123
138
|
return "There " + (listCount === 1 ? 'is' : 'are') + " " + listCount + " suggestion" + (listCount === 1 ? '' : 's') + ".";
|
|
124
139
|
};
|
|
@@ -344,7 +359,7 @@ var Combobox = function (_a) {
|
|
|
344
359
|
'aria-expanded': showingAutocomplete,
|
|
345
360
|
};
|
|
346
361
|
var cloneElement = function (element, props) {
|
|
347
|
-
return
|
|
362
|
+
return react_2.jsx(element.type, __assign(__assign({}, element.props), props));
|
|
348
363
|
};
|
|
349
364
|
return cloneElement(inputElement, __assign(__assign({}, inputElement.props), newTextInputProps));
|
|
350
365
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Status.d.ts","sourceRoot":"","sources":["../../../../combobox/lib/Status.tsx"],"names":[],"mappings":"AAIA,MAAM,WAAW,WAAW;IAC1B,QAAQ,CAAC,EAAE,QAAQ,GAAG,WAAW,GAAG,KAAK,CAAC;IAC1C,IAAI,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,OAAO,GAAG,aAAa,GAAG,SAAS,GAAG,OAAO,CAAC;IACxE,YAAY,CAAC,EAAE,WAAW,GAAG,gBAAgB,GAAG,KAAK,GAAG,UAAU,GAAG,MAAM,CAAC;IAC5E,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B;AAID,QAAA,MAAM,MAAM,
|
|
1
|
+
{"version":3,"file":"Status.d.ts","sourceRoot":"","sources":["../../../../combobox/lib/Status.tsx"],"names":[],"mappings":"AAIA,MAAM,WAAW,WAAW;IAC1B,QAAQ,CAAC,EAAE,QAAQ,GAAG,WAAW,GAAG,KAAK,CAAC;IAC1C,IAAI,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,OAAO,GAAG,aAAa,GAAG,SAAS,GAAG,OAAO,CAAC;IACxE,YAAY,CAAC,EAAE,WAAW,GAAG,gBAAgB,GAAG,KAAK,GAAG,UAAU,GAAG,MAAM,CAAC;IAC5E,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B;AAID,QAAA,MAAM,MAAM,wFAOT,WAAW,gBAuBb,CAAC;AAEF,eAAe,MAAM,CAAC"}
|
|
@@ -1,9 +1,21 @@
|
|
|
1
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 __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
10
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
11
|
+
}) : function(o, v) {
|
|
12
|
+
o["default"] = v;
|
|
13
|
+
});
|
|
2
14
|
var __importStar = (this && this.__importStar) || function (mod) {
|
|
3
15
|
if (mod && mod.__esModule) return mod;
|
|
4
16
|
var result = {};
|
|
5
|
-
if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result
|
|
6
|
-
result
|
|
17
|
+
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
18
|
+
__setModuleDefault(result, mod);
|
|
7
19
|
return result;
|
|
8
20
|
};
|
|
9
21
|
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
@@ -1,11 +1,19 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
function
|
|
3
|
-
|
|
4
|
-
}
|
|
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
|
+
};
|
|
5
12
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
|
|
7
|
-
|
|
13
|
+
exports.permutateProps = exports.ComponentStatesTable = void 0;
|
|
14
|
+
__exportStar(require("./lib/Box"), exports);
|
|
15
|
+
__exportStar(require("./lib/theming"), exports);
|
|
8
16
|
var ComponentStatesTable_1 = require("./lib/storybook-utils/ComponentStatesTable");
|
|
9
|
-
exports
|
|
17
|
+
Object.defineProperty(exports, "ComponentStatesTable", { enumerable: true, get: function () { return ComponentStatesTable_1.ComponentStatesTable; } });
|
|
10
18
|
var permutateProps_1 = require("./lib/storybook-utils/permutateProps");
|
|
11
|
-
exports
|
|
19
|
+
Object.defineProperty(exports, "permutateProps", { enumerable: true, get: function () { return permutateProps_1.permutateProps; } });
|
|
@@ -4,9 +4,10 @@ import { ColorStyleProps } from './utils/color';
|
|
|
4
4
|
import { DepthStyleProps } from './utils/depth';
|
|
5
5
|
import { FlexItemStyleProps } from './utils/flexItem';
|
|
6
6
|
import { LayoutStyleProps } from './utils/layout';
|
|
7
|
+
import { OtherStyleProps } from './utils/other';
|
|
7
8
|
import { PositionStyleProps } from './utils/position';
|
|
8
9
|
import { SpaceStyleProps } from './utils/space';
|
|
9
|
-
export declare type BoxProps = BorderStyleProps & ColorStyleProps & DepthStyleProps & FlexItemStyleProps & LayoutStyleProps & PositionStyleProps & SpaceStyleProps & {
|
|
10
|
+
export declare type BoxProps = BorderStyleProps & ColorStyleProps & DepthStyleProps & FlexItemStyleProps & LayoutStyleProps & OtherStyleProps & PositionStyleProps & SpaceStyleProps & {
|
|
10
11
|
children?: React.ReactNode;
|
|
11
12
|
};
|
|
12
13
|
/**
|
|
@@ -26,5 +27,5 @@ export declare type BoxProps = BorderStyleProps & ColorStyleProps & DepthStylePr
|
|
|
26
27
|
* );
|
|
27
28
|
*
|
|
28
29
|
*/
|
|
29
|
-
export declare const Box: import("@workday/canvas-kit-react/common").ElementComponent<"div", import("./utils/border").BorderShorthandStyleProps & import("./utils/border").BorderColorStyleProps & import("./utils/border").BorderRadiusStyleProps & import("./utils/border").BorderLineStyleProps & import("./utils/border").BorderWidthStyleProps & import("./utils/border").BorderLogicalStyleProps & ColorStyleProps & DepthStyleProps & FlexItemStyleProps & LayoutStyleProps & import("./utils/position").PositionStandardProps & import("./utils/position").PositionLogicalProps & import("./utils/space").SpaceStandardProps & import("./utils/space").SpaceLogicalProps>;
|
|
30
|
+
export declare const Box: import("@workday/canvas-kit-react/common").ElementComponent<"div", import("./utils/border").BorderShorthandStyleProps & import("./utils/border").BorderColorStyleProps & import("./utils/border").BorderRadiusStyleProps & import("./utils/border").BorderLineStyleProps & import("./utils/border").BorderWidthStyleProps & import("./utils/border").BorderLogicalStyleProps & ColorStyleProps & DepthStyleProps & FlexItemStyleProps & LayoutStyleProps & OtherStyleProps & import("./utils/position").PositionStandardProps & import("./utils/position").PositionLogicalProps & import("./utils/space").SpaceStandardProps & import("./utils/space").SpaceLogicalProps>;
|
|
30
31
|
//# sourceMappingURL=Box.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Box.d.ts","sourceRoot":"","sources":["../../../../common/lib/Box.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,OAAO,EAAS,gBAAgB,EAAC,MAAM,gBAAgB,CAAC;AACxD,OAAO,EAAQ,eAAe,EAAC,MAAM,eAAe,CAAC;AACrD,OAAO,EAAQ,eAAe,EAAC,MAAM,eAAe,CAAC;AACrD,OAAO,EAAW,kBAAkB,EAAC,MAAM,kBAAkB,CAAC;AAC9D,OAAO,EAAS,gBAAgB,EAAC,MAAM,gBAAgB,CAAC;AACxD,OAAO,EAAW,kBAAkB,EAAC,MAAM,kBAAkB,CAAC;AAC9D,OAAO,EAAQ,eAAe,EAAC,MAAM,eAAe,CAAC;AAErD,oBAAY,QAAQ,GAAG,gBAAgB,GACrC,eAAe,GACf,eAAe,GACf,kBAAkB,GAClB,gBAAgB,GAChB,kBAAkB,GAClB,eAAe,GAAG;IAChB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B,CAAC;
|
|
1
|
+
{"version":3,"file":"Box.d.ts","sourceRoot":"","sources":["../../../../common/lib/Box.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,OAAO,EAAS,gBAAgB,EAAC,MAAM,gBAAgB,CAAC;AACxD,OAAO,EAAQ,eAAe,EAAC,MAAM,eAAe,CAAC;AACrD,OAAO,EAAQ,eAAe,EAAC,MAAM,eAAe,CAAC;AACrD,OAAO,EAAW,kBAAkB,EAAC,MAAM,kBAAkB,CAAC;AAC9D,OAAO,EAAS,gBAAgB,EAAC,MAAM,gBAAgB,CAAC;AACxD,OAAO,EAAQ,eAAe,EAAC,MAAM,eAAe,CAAC;AACrD,OAAO,EAAW,kBAAkB,EAAC,MAAM,kBAAkB,CAAC;AAC9D,OAAO,EAAQ,eAAe,EAAC,MAAM,eAAe,CAAC;AAErD,oBAAY,QAAQ,GAAG,gBAAgB,GACrC,eAAe,GACf,eAAe,GACf,kBAAkB,GAClB,gBAAgB,GAChB,eAAe,GACf,kBAAkB,GAClB,eAAe,GAAG;IAChB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B,CAAC;AAqCJ;;;;;;;;;;;;;;;;GAgBG;AACH,eAAO,MAAM,GAAG,2oBAad,CAAC"}
|
|
@@ -10,6 +10,25 @@ var __assign = (this && this.__assign) || function () {
|
|
|
10
10
|
};
|
|
11
11
|
return __assign.apply(this, arguments);
|
|
12
12
|
};
|
|
13
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
14
|
+
if (k2 === undefined) k2 = k;
|
|
15
|
+
Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
|
|
16
|
+
}) : (function(o, m, k, k2) {
|
|
17
|
+
if (k2 === undefined) k2 = k;
|
|
18
|
+
o[k2] = m[k];
|
|
19
|
+
}));
|
|
20
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
21
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
22
|
+
}) : function(o, v) {
|
|
23
|
+
o["default"] = v;
|
|
24
|
+
});
|
|
25
|
+
var __importStar = (this && this.__importStar) || function (mod) {
|
|
26
|
+
if (mod && mod.__esModule) return mod;
|
|
27
|
+
var result = {};
|
|
28
|
+
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
29
|
+
__setModuleDefault(result, mod);
|
|
30
|
+
return result;
|
|
31
|
+
};
|
|
13
32
|
var __rest = (this && this.__rest) || function (s, e) {
|
|
14
33
|
var t = {};
|
|
15
34
|
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
@@ -21,17 +40,11 @@ var __rest = (this && this.__rest) || function (s, e) {
|
|
|
21
40
|
}
|
|
22
41
|
return t;
|
|
23
42
|
};
|
|
24
|
-
var __importStar = (this && this.__importStar) || function (mod) {
|
|
25
|
-
if (mod && mod.__esModule) return mod;
|
|
26
|
-
var result = {};
|
|
27
|
-
if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k];
|
|
28
|
-
result["default"] = mod;
|
|
29
|
-
return result;
|
|
30
|
-
};
|
|
31
43
|
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
32
44
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
33
45
|
};
|
|
34
46
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
47
|
+
exports.Box = void 0;
|
|
35
48
|
var React = __importStar(require("react"));
|
|
36
49
|
var styled_1 = __importDefault(require("@emotion/styled"));
|
|
37
50
|
var is_prop_valid_1 = __importDefault(require("@emotion/is-prop-valid"));
|
|
@@ -42,15 +55,21 @@ var color_1 = require("./utils/color");
|
|
|
42
55
|
var depth_1 = require("./utils/depth");
|
|
43
56
|
var flexItem_1 = require("./utils/flexItem");
|
|
44
57
|
var layout_1 = require("./utils/layout");
|
|
58
|
+
var other_1 = require("./utils/other");
|
|
45
59
|
var position_1 = require("./utils/position");
|
|
46
60
|
var space_1 = require("./utils/space");
|
|
47
61
|
var omittedProps = ['display', 'color', 'height', 'overflow', 'width', 'border', 'background'];
|
|
48
62
|
var shouldForwardProp = function (prop) {
|
|
49
63
|
return is_prop_valid_1.default(prop) && !omittedProps.includes(prop);
|
|
50
64
|
};
|
|
51
|
-
|
|
65
|
+
// Meant to be used with elements. The `shouldForwardProps` will remove all style props
|
|
66
|
+
var StyledBoxElement = styled_1.default('div', { shouldForwardProp: shouldForwardProp })({
|
|
52
67
|
boxSizing: 'border-box',
|
|
53
68
|
}, border_1.border, color_1.color, depth_1.depth, flexItem_1.flexItem, layout_1.layout, position_1.position, space_1.space);
|
|
69
|
+
// Meant to be used with components. There is no `shouldForwardProps` - all props will be forwarded to the component
|
|
70
|
+
var StyledBoxComponent = styled_1.default('div')({
|
|
71
|
+
boxSizing: 'border-box',
|
|
72
|
+
}, border_1.border, color_1.color, depth_1.depth, flexItem_1.flexItem, layout_1.layout, other_1.other, position_1.position, space_1.space);
|
|
54
73
|
/**
|
|
55
74
|
* `Box` is a primitive component that provides a common, ergonomic API around Canvas design tokens.
|
|
56
75
|
* It is highly flexible, and its primary purpose is to build other components.
|
|
@@ -72,6 +91,9 @@ exports.Box = common_1.createComponent('div')({
|
|
|
72
91
|
displayName: 'Box',
|
|
73
92
|
Component: function (_a, ref, Element) {
|
|
74
93
|
var children = _a.children, elemProps = __rest(_a, ["children"]);
|
|
75
|
-
|
|
94
|
+
var BoxComponent = common_1.useConstant(function () {
|
|
95
|
+
return typeof Element === 'string' ? StyledBoxElement : StyledBoxComponent;
|
|
96
|
+
});
|
|
97
|
+
return (React.createElement(BoxComponent, __assign({ as: Element, ref: ref }, elemProps), children));
|
|
76
98
|
},
|
|
77
99
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ComponentStatesTable.d.ts","sourceRoot":"","sources":["../../../../../common/lib/storybook-utils/ComponentStatesTable.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAC,eAAe,EAAE,KAAK,EAAC,MAAM,aAAa,CAAC;AAEnD;;GAEG;AACH,MAAM,WAAW,yBAAyB;IACxC;;;;OAIG;IACH,QAAQ,EAAE,eAAe,EAAE,CAAC;IAC5B;;;;OAIG;IACH,WAAW,EAAE,eAAe,EAAE,CAAC;IAC/B;;;OAGG;IACH,QAAQ,CAAC,KAAK,EAAE,KAAK,GAAG,KAAK,CAAC,SAAS,CAAC;CACzC;AAgBD,eAAO,MAAM,oBAAoB,
|
|
1
|
+
{"version":3,"file":"ComponentStatesTable.d.ts","sourceRoot":"","sources":["../../../../../common/lib/storybook-utils/ComponentStatesTable.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAC,eAAe,EAAE,KAAK,EAAC,MAAM,aAAa,CAAC;AAEnD;;GAEG;AACH,MAAM,WAAW,yBAAyB;IACxC;;;;OAIG;IACH,QAAQ,EAAE,eAAe,EAAE,CAAC;IAC5B;;;;OAIG;IACH,WAAW,EAAE,eAAe,EAAE,CAAC;IAC/B;;;OAGG;IACH,QAAQ,CAAC,KAAK,EAAE,KAAK,GAAG,KAAK,CAAC,SAAS,CAAC;CACzC;AAgBD,eAAO,MAAM,oBAAoB,yCAI9B,yBAAyB,gBAkC3B,CAAC"}
|
|
@@ -14,6 +14,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
14
14
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
15
15
|
};
|
|
16
16
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
17
|
+
exports.ComponentStatesTable = void 0;
|
|
17
18
|
var react_1 = __importDefault(require("react"));
|
|
18
19
|
var common_1 = require("@workday/canvas-kit-react/common");
|
|
19
20
|
var Table = common_1.styled('table')({
|
|
@@ -29,7 +30,7 @@ var Table = common_1.styled('table')({
|
|
|
29
30
|
textAlign: 'left',
|
|
30
31
|
},
|
|
31
32
|
});
|
|
32
|
-
|
|
33
|
+
var ComponentStatesTable = function (_a) {
|
|
33
34
|
var rowProps = _a.rowProps, columnProps = _a.columnProps, children = _a.children;
|
|
34
35
|
return (react_1.default.createElement(Table, null,
|
|
35
36
|
react_1.default.createElement("thead", null,
|
|
@@ -44,3 +45,4 @@ exports.ComponentStatesTable = function (_a) {
|
|
|
44
45
|
})));
|
|
45
46
|
}))));
|
|
46
47
|
};
|
|
48
|
+
exports.ComponentStatesTable = ComponentStatesTable;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"permutateProps.d.ts","sourceRoot":"","sources":["../../../../../common/lib/storybook-utils/permutateProps.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,eAAe,EAAE,eAAe,EAAE,KAAK,EAAE,gBAAgB,EAAC,MAAM,aAAa,CAAC;AAEtF,eAAO,MAAM,cAAc;;
|
|
1
|
+
{"version":3,"file":"permutateProps.d.ts","sourceRoot":"","sources":["../../../../../common/lib/storybook-utils/permutateProps.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,eAAe,EAAE,eAAe,EAAE,KAAK,EAAE,gBAAgB,EAAC,MAAM,aAAa,CAAC;AAEtF,eAAO,MAAM,cAAc,aACf,gBAAgB,oBACT,KAAK,KAAK,OAAO,gCAClB,MAAM,EAAE;;MAEvB,eAAe,EAuCjB,CAAC"}
|
|
@@ -11,7 +11,8 @@ var __assign = (this && this.__assign) || function () {
|
|
|
11
11
|
return __assign.apply(this, arguments);
|
|
12
12
|
};
|
|
13
13
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
14
|
-
exports.permutateProps =
|
|
14
|
+
exports.permutateProps = void 0;
|
|
15
|
+
var permutateProps = function (allProps, filter, remainingProps, values) {
|
|
15
16
|
if (remainingProps === void 0) { remainingProps = Object.keys(allProps); }
|
|
16
17
|
if (values === void 0) { values = {}; }
|
|
17
18
|
// When there are no more props to combine with, return result
|
|
@@ -43,3 +44,4 @@ exports.permutateProps = function (allProps, filter, remainingProps, values) {
|
|
|
43
44
|
});
|
|
44
45
|
return permutations.flat();
|
|
45
46
|
};
|
|
47
|
+
exports.permutateProps = permutateProps;
|
|
@@ -1,7 +1,14 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
function
|
|
3
|
-
|
|
4
|
-
}
|
|
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
|
+
};
|
|
5
12
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
|
|
7
|
-
|
|
13
|
+
__exportStar(require("./useThemeRTL"), exports);
|
|
14
|
+
__exportStar(require("./useThemedRing"), exports);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useThemeRTL.d.ts","sourceRoot":"","sources":["../../../../../common/lib/theming/useThemeRTL.ts"],"names":[],"mappings":"AAMA,OAAO,EAAC,aAAa,EAAC,MAAM,kCAAkC,CAAC;AAI/D,oBAAY,eAAe,GAAG,MAAM,CAAC,MAAM,EAAE,aAAa,CAAC,CAAC;AAW5D;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,wBAAgB,WAAW
|
|
1
|
+
{"version":3,"file":"useThemeRTL.d.ts","sourceRoot":"","sources":["../../../../../common/lib/theming/useThemeRTL.ts"],"names":[],"mappings":"AAMA,OAAO,EAAC,aAAa,EAAC,MAAM,kCAAkC,CAAC;AAI/D,oBAAY,eAAe,GAAG,MAAM,CAAC,MAAM,EAAE,aAAa,CAAC,CAAC;AAW5D;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,wBAAgB,WAAW;6BAMD,aAAa,EAAE;;EAYxC"}
|
|
@@ -21,6 +21,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
21
21
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
22
22
|
};
|
|
23
23
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
24
|
+
exports.useThemeRTL = void 0;
|
|
24
25
|
var common_1 = require("@workday/canvas-kit-react/common");
|
|
25
26
|
var react_1 = require("react");
|
|
26
27
|
var rtl_css_js_1 = __importDefault(require("rtl-css-js"));
|
|
@@ -6,6 +6,6 @@ interface ContrastColors {
|
|
|
6
6
|
inner?: string;
|
|
7
7
|
}
|
|
8
8
|
export declare function getPaletteColors(type: paletteSelection, theme: EmotionCanvasTheme): ContrastColors;
|
|
9
|
-
export declare const useThemedRing: (type:
|
|
9
|
+
export declare const useThemedRing: (type: paletteSelection) => CSSProperties;
|
|
10
10
|
export {};
|
|
11
11
|
//# sourceMappingURL=useThemedRing.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useThemedRing.d.ts","sourceRoot":"","sources":["../../../../../common/lib/theming/useThemedRing.ts"],"names":[],"mappings":"AACA,OAAO,EAAqB,kBAAkB,EAAC,MAAM,kCAAkC,CAAC;AACxF,OAAO,EAAS,aAAa,EAA4B,MAAM,kCAAkC,CAAC;AAGlG,aAAK,gBAAgB,GAAG,OAAO,CAAC,MAAM,kBAAkB,CAAC,QAAQ,CAAC,CAAC,SAAS,CAAC,EAAE,QAAQ,CAAC,CAAC;AACzF,UAAU,cAAc;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;
|
|
1
|
+
{"version":3,"file":"useThemedRing.d.ts","sourceRoot":"","sources":["../../../../../common/lib/theming/useThemedRing.ts"],"names":[],"mappings":"AACA,OAAO,EAAqB,kBAAkB,EAAC,MAAM,kCAAkC,CAAC;AACxF,OAAO,EAAS,aAAa,EAA4B,MAAM,kCAAkC,CAAC;AAGlG,aAAK,gBAAgB,GAAG,OAAO,CAAC,MAAM,kBAAkB,CAAC,QAAQ,CAAC,CAAC,SAAS,CAAC,EAAE,QAAQ,CAAC,CAAC;AACzF,UAAU,cAAc;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAoBD,wBAAgB,gBAAgB,CAC9B,IAAI,EAAE,gBAAgB,EACtB,KAAK,EAAE,kBAAkB,GACxB,cAAc,CAsBhB;AAED,eAAO,MAAM,aAAa,SAAU,gBAAgB,KAAG,aAyBtD,CAAC"}
|