@workday/canvas-kit-preview-react 7.0.0-alpha.106-next.2 → 7.0.0-alpha.129-next.3
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/breadcrumbs/index.ts +0 -4
- package/breadcrumbs/lib/Breadcrumbs/List/index.tsx +3 -5
- package/breadcrumbs/package.json +2 -1
- package/color-picker/README.md +1 -1
- package/color-picker/index.ts +1 -1
- package/color-picker/lib/ColorPicker.tsx +2 -3
- package/color-picker/package.json +2 -1
- package/dist/commonjs/breadcrumbs/index.d.ts +0 -3
- package/dist/commonjs/breadcrumbs/index.d.ts.map +1 -1
- package/dist/commonjs/breadcrumbs/index.js +0 -4
- package/dist/commonjs/breadcrumbs/lib/Breadcrumbs/List/index.d.ts.map +1 -1
- package/dist/commonjs/breadcrumbs/lib/Breadcrumbs/List/index.js +2 -14
- package/dist/commonjs/color-picker/index.d.ts +1 -1
- package/dist/commonjs/color-picker/index.d.ts.map +1 -1
- package/dist/commonjs/color-picker/index.js +2 -6
- package/dist/commonjs/color-picker/lib/ColorPicker.d.ts +1 -2
- package/dist/commonjs/color-picker/lib/ColorPicker.d.ts.map +1 -1
- package/dist/commonjs/color-picker/lib/ColorPicker.js +5 -4
- package/dist/commonjs/menu/index.d.ts +1 -4
- package/dist/commonjs/menu/index.d.ts.map +1 -1
- package/dist/commonjs/menu/index.js +1 -9
- package/dist/commonjs/menu/lib/Menu.d.ts +1 -1
- package/dist/commonjs/menu/lib/Menu.d.ts.map +1 -1
- package/dist/commonjs/menu/lib/Menu.js +3 -2
- package/dist/commonjs/menu/lib/MenuItem.d.ts +1 -2
- package/dist/commonjs/menu/lib/MenuItem.d.ts.map +1 -1
- package/dist/commonjs/menu/lib/MenuItem.js +2 -1
- package/dist/commonjs/pill/lib/Pill.d.ts +7 -0
- package/dist/commonjs/pill/lib/Pill.d.ts.map +1 -1
- package/dist/commonjs/pill/lib/Pill.js +11 -4
- package/dist/commonjs/pill/lib/PillAvatar.d.ts +1 -0
- package/dist/commonjs/pill/lib/PillAvatar.d.ts.map +1 -1
- package/dist/commonjs/pill/lib/PillAvatar.js +1 -1
- package/dist/commonjs/pill/lib/PillIcon.d.ts +1 -0
- package/dist/commonjs/pill/lib/PillIcon.d.ts.map +1 -1
- package/dist/commonjs/pill/lib/PillIcon.js +1 -1
- package/dist/commonjs/pill/lib/PillIconButton.d.ts +6 -0
- package/dist/commonjs/pill/lib/PillIconButton.d.ts.map +1 -1
- package/dist/commonjs/pill/lib/PillIconButton.js +17 -24
- package/dist/commonjs/pill/lib/PillLabel.d.ts +1 -0
- package/dist/commonjs/pill/lib/PillLabel.d.ts.map +1 -1
- package/dist/commonjs/pill/lib/PillLabel.js +1 -1
- package/dist/commonjs/pill/lib/usePillModel.d.ts +13 -0
- package/dist/commonjs/pill/lib/usePillModel.d.ts.map +1 -1
- package/dist/commonjs/pill/lib/usePillModel.js +7 -1
- package/dist/commonjs/select/index.d.ts +0 -3
- package/dist/commonjs/select/index.d.ts.map +1 -1
- package/dist/commonjs/select/index.js +0 -7
- package/dist/commonjs/select/lib/Select.d.ts +0 -1
- package/dist/commonjs/select/lib/Select.d.ts.map +1 -1
- package/dist/commonjs/select/lib/Select.js +2 -6
- package/dist/commonjs/select/lib/SelectBase.d.ts +2 -2
- package/dist/commonjs/select/lib/SelectBase.d.ts.map +1 -1
- package/dist/commonjs/select/lib/SelectBase.js +6 -9
- package/dist/commonjs/select/lib/SelectMenu.d.ts +2 -2
- package/dist/commonjs/select/lib/SelectMenu.d.ts.map +1 -1
- package/dist/commonjs/select/lib/SelectMenu.js +2 -2
- package/dist/commonjs/select/lib/SelectOption.d.ts +1 -2
- package/dist/commonjs/select/lib/SelectOption.d.ts.map +1 -1
- package/dist/commonjs/select/lib/SelectOption.js +2 -1
- package/dist/commonjs/side-panel/index.d.ts +0 -3
- package/dist/commonjs/side-panel/index.d.ts.map +1 -1
- package/dist/commonjs/side-panel/index.js +0 -7
- package/dist/commonjs/side-panel/lib/SidePanel.d.ts +1 -2
- package/dist/commonjs/side-panel/lib/SidePanel.d.ts.map +1 -1
- package/dist/commonjs/side-panel/lib/SidePanel.js +3 -3
- package/dist/es6/breadcrumbs/index.d.ts +0 -3
- package/dist/es6/breadcrumbs/index.d.ts.map +1 -1
- package/dist/es6/breadcrumbs/index.js +0 -3
- package/dist/es6/breadcrumbs/lib/Breadcrumbs/List/index.d.ts.map +1 -1
- package/dist/es6/breadcrumbs/lib/Breadcrumbs/List/index.js +2 -14
- package/dist/es6/color-picker/index.d.ts +1 -1
- package/dist/es6/color-picker/index.d.ts.map +1 -1
- package/dist/es6/color-picker/index.js +1 -1
- package/dist/es6/color-picker/lib/ColorPicker.d.ts +1 -2
- package/dist/es6/color-picker/lib/ColorPicker.d.ts.map +1 -1
- package/dist/es6/color-picker/lib/ColorPicker.js +2 -3
- package/dist/es6/menu/index.d.ts +1 -4
- package/dist/es6/menu/index.d.ts.map +1 -1
- package/dist/es6/menu/index.js +1 -4
- package/dist/es6/menu/lib/Menu.d.ts +1 -1
- package/dist/es6/menu/lib/Menu.d.ts.map +1 -1
- package/dist/es6/menu/lib/Menu.js +2 -2
- package/dist/es6/menu/lib/MenuItem.d.ts +1 -2
- package/dist/es6/menu/lib/MenuItem.d.ts.map +1 -1
- package/dist/es6/menu/lib/MenuItem.js +1 -1
- package/dist/es6/pill/lib/Pill.d.ts +14 -7
- package/dist/es6/pill/lib/Pill.d.ts.map +1 -1
- package/dist/es6/pill/lib/Pill.js +11 -4
- package/dist/es6/pill/lib/PillAvatar.d.ts +2 -2
- package/dist/es6/pill/lib/PillAvatar.d.ts.map +1 -1
- package/dist/es6/pill/lib/PillAvatar.js +1 -1
- package/dist/es6/pill/lib/PillIcon.d.ts +2 -2
- package/dist/es6/pill/lib/PillIcon.d.ts.map +1 -1
- package/dist/es6/pill/lib/PillIcon.js +1 -1
- package/dist/es6/pill/lib/PillIconButton.d.ts +7 -2
- package/dist/es6/pill/lib/PillIconButton.d.ts.map +1 -1
- package/dist/es6/pill/lib/PillIconButton.js +18 -25
- package/dist/es6/pill/lib/PillLabel.d.ts +2 -2
- package/dist/es6/pill/lib/PillLabel.d.ts.map +1 -1
- package/dist/es6/pill/lib/PillLabel.js +1 -1
- package/dist/es6/pill/lib/usePillModel.d.ts +18 -5
- package/dist/es6/pill/lib/usePillModel.d.ts.map +1 -1
- package/dist/es6/pill/lib/usePillModel.js +8 -2
- package/dist/es6/select/index.d.ts +0 -3
- package/dist/es6/select/index.d.ts.map +1 -1
- package/dist/es6/select/index.js +0 -3
- package/dist/es6/select/lib/Select.d.ts +0 -1
- package/dist/es6/select/lib/Select.d.ts.map +1 -1
- package/dist/es6/select/lib/Select.js +1 -2
- package/dist/es6/select/lib/SelectBase.d.ts +2 -2
- package/dist/es6/select/lib/SelectBase.d.ts.map +1 -1
- package/dist/es6/select/lib/SelectBase.js +3 -4
- package/dist/es6/select/lib/SelectMenu.d.ts +2 -2
- package/dist/es6/select/lib/SelectMenu.d.ts.map +1 -1
- package/dist/es6/select/lib/SelectMenu.js +1 -2
- package/dist/es6/select/lib/SelectOption.d.ts +1 -2
- package/dist/es6/select/lib/SelectOption.d.ts.map +1 -1
- package/dist/es6/select/lib/SelectOption.js +1 -2
- package/dist/es6/side-panel/index.d.ts +0 -3
- package/dist/es6/side-panel/index.d.ts.map +1 -1
- package/dist/es6/side-panel/index.js +0 -3
- package/dist/es6/side-panel/lib/SidePanel.d.ts +1 -2
- package/dist/es6/side-panel/lib/SidePanel.d.ts.map +1 -1
- package/dist/es6/side-panel/lib/SidePanel.js +1 -2
- package/form-field/package.json +2 -1
- package/menu/index.ts +1 -6
- package/menu/lib/Menu.tsx +2 -2
- package/menu/lib/MenuItem.tsx +1 -3
- package/menu/package.json +2 -1
- package/package.json +8 -7
- package/pill/lib/Pill.tsx +10 -2
- package/pill/lib/PillAvatar.tsx +1 -0
- package/pill/lib/PillIcon.tsx +2 -0
- package/pill/lib/PillIconButton.tsx +36 -32
- package/pill/lib/PillLabel.tsx +1 -0
- package/pill/lib/usePillModel.tsx +8 -1
- package/pill/package.json +2 -1
- package/select/README.md +7 -7
- package/select/index.ts +0 -3
- package/select/lib/Select.tsx +1 -3
- package/select/lib/SelectBase.tsx +3 -5
- package/select/lib/SelectMenu.tsx +1 -3
- package/select/lib/SelectOption.tsx +1 -3
- package/select/package.json +2 -1
- package/side-panel/index.ts +0 -4
- package/side-panel/lib/SidePanel.tsx +1 -2
- package/side-panel/package.json +2 -1
- package/text-area/package.json +2 -1
- package/text-input/package.json +2 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Pill.d.ts","sourceRoot":"","sources":["../../../../pill/lib/Pill.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAW1B,OAAO,EAAC,QAAQ,EAA4B,MAAM,kCAAkC,CAAC;AAWrF,MAAM,WAAW,SAAU,SAAQ,QAAQ;IACzC;;;OAGG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,UAAU,GAAG,WAAW,CAAC;CAChD;
|
|
1
|
+
{"version":3,"file":"Pill.d.ts","sourceRoot":"","sources":["../../../../pill/lib/Pill.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAW1B,OAAO,EAAC,QAAQ,EAA4B,MAAM,kCAAkC,CAAC;AAWrF,MAAM,WAAW,SAAU,SAAQ,QAAQ;IACzC;;;OAGG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,UAAU,GAAG,WAAW,CAAC;CAChD;AAsID,eAAO,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA+Df,CAAC"}
|
|
@@ -105,7 +105,6 @@ var getRemovablePillColors = function (disabled) {
|
|
|
105
105
|
};
|
|
106
106
|
var pillBaseStyles = __assign(__assign({ display: 'inline-flex', alignItems: 'center', borderRadius: borderRadius.m, flexShrink: 0 }, type.levels.subtext.large), { color: colors.blackPepper400, boxShadow: 'none', outline: 'none', fontWeight: type.properties.fontWeights.medium, WebkitFontSmoothing: 'antialiased', MozOsxFontSmoothing: 'grayscale', width: 'fit-content', padding: "2px " + space.xxs, height: space.m, position: 'relative' });
|
|
107
107
|
var StyledBasePill = styled(BaseButton.as('button'))(__assign(__assign(__assign({}, pillBaseStyles), { '&:focus': {
|
|
108
|
-
borderColor: colors.blueberry400,
|
|
109
108
|
'span[data-count="ck-pill-count"]': {
|
|
110
109
|
borderTop: "1px solid " + colors.blueberry400,
|
|
111
110
|
borderBottom: "1px solid " + colors.blueberry400,
|
|
@@ -122,10 +121,18 @@ var StyledBasePill = styled(BaseButton.as('button'))(__assign(__assign(__assign(
|
|
|
122
121
|
border: 'none',
|
|
123
122
|
},
|
|
124
123
|
},
|
|
125
|
-
})),
|
|
124
|
+
})), function (_a) {
|
|
125
|
+
var variant = _a.variant;
|
|
126
|
+
return ({
|
|
127
|
+
'&:focus': {
|
|
128
|
+
borderColor: variant === 'removable' ? undefined : colors.blueberry400,
|
|
129
|
+
},
|
|
130
|
+
});
|
|
131
|
+
}, boxStyleFn);
|
|
126
132
|
var StyledNonInteractivePill = styled(StyledBasePill)({
|
|
127
133
|
cursor: 'default',
|
|
128
134
|
overflow: 'revert',
|
|
135
|
+
position: 'relative',
|
|
129
136
|
});
|
|
130
137
|
export var Pill = createContainer('button')({
|
|
131
138
|
modelHook: usePillModel,
|
|
@@ -139,7 +146,7 @@ export var Pill = createContainer('button')({
|
|
|
139
146
|
})(function (_a, Element, model) {
|
|
140
147
|
var _b = _a.variant, variant = _b === void 0 ? 'default' : _b, maxWidth = _a.maxWidth, elemProps = __rest(_a, ["variant", "maxWidth"]);
|
|
141
148
|
return (React.createElement(React.Fragment, null,
|
|
142
|
-
variant === 'readOnly' && (React.createElement(StyledNonInteractivePill, __assign({ maxWidth: model.state.maxWidth, as: Element !== 'button' ? Element : 'span', border: "1px solid " + colors.licorice200 }, elemProps),
|
|
149
|
+
variant === 'readOnly' && (React.createElement(StyledNonInteractivePill, __assign({ maxWidth: model.state.maxWidth, as: Element !== 'button' ? Element : 'span', border: "1px solid " + colors.licorice200, id: model.state.id }, elemProps),
|
|
143
150
|
React.createElement(PillLabel, null, elemProps.children))),
|
|
144
151
|
variant === 'default' && (React.createElement(StyledBasePill, __assign({ colors: getButtonPillColors(), as: Element }, elemProps, { disabled: model.state.disabled }),
|
|
145
152
|
React.createElement(HStack, { spacing: "xxxs", display: "inline-flex", alignItems: "center" }, React.Children.map(elemProps.children, function (child, index) {
|
|
@@ -148,7 +155,7 @@ export var Pill = createContainer('button')({
|
|
|
148
155
|
}
|
|
149
156
|
return (React.createElement(Stack.Item, { key: index, display: "inline-flex" }, child));
|
|
150
157
|
})))),
|
|
151
|
-
variant === 'removable' && (React.createElement(StyledNonInteractivePill, __assign({ colors: getRemovablePillColors(model.state.disabled), as: Element !== 'button' ? Element : 'span' }, elemProps),
|
|
158
|
+
variant === 'removable' && (React.createElement(StyledNonInteractivePill, __assign({ colors: getRemovablePillColors(model.state.disabled), as: Element !== 'button' ? Element : 'span', variant: variant }, elemProps),
|
|
152
159
|
React.createElement(HStack, { spacing: "xxxs", display: "inline-flex", alignItems: "center", justifyContent: "center" }, React.Children.map(elemProps.children, function (child, index) {
|
|
153
160
|
if (typeof child === 'string') {
|
|
154
161
|
return React.createElement(PillLabel, { key: index }, child);
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
1
|
import { AvatarProps } from '@workday/canvas-kit-react/avatar';
|
|
3
2
|
export interface PillAvatarProps extends AvatarProps {
|
|
4
3
|
}
|
|
5
4
|
export declare const PillAvatar: import("@workday/canvas-kit-react/common").ElementComponentM<"button", PillAvatarProps, {
|
|
6
5
|
state: {
|
|
7
|
-
|
|
6
|
+
id: string;
|
|
7
|
+
maxWidth: string | number;
|
|
8
8
|
disabled: boolean;
|
|
9
9
|
};
|
|
10
10
|
events: {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PillAvatar.d.ts","sourceRoot":"","sources":["../../../../pill/lib/PillAvatar.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"PillAvatar.d.ts","sourceRoot":"","sources":["../../../../pill/lib/PillAvatar.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAS,WAAW,EAAC,MAAM,kCAAkC,CAAC;AAGrE,MAAM,WAAW,eAAgB,SAAQ,WAAW;CAAG;AAKvD,eAAO,MAAM,UAAU;;;;;;;EAerB,CAAC"}
|
|
@@ -19,5 +19,5 @@ import { usePillModel } from './usePillModel';
|
|
|
19
19
|
export var PillAvatar = createSubcomponent('button')({
|
|
20
20
|
modelHook: usePillModel,
|
|
21
21
|
})(function (elemProps, Element, model) {
|
|
22
|
-
return (React.createElement(Avatar, __assign({ style: { opacity: model.state.disabled ? '.7' : '1' }, as: "div", size: 18 }, elemProps, { disabled: model.state.disabled }), elemProps.children));
|
|
22
|
+
return (React.createElement(Avatar, __assign({ style: { opacity: model.state.disabled ? '.7' : '1' }, as: "div", size: 18, altText: undefined }, elemProps, { disabled: model.state.disabled }), elemProps.children));
|
|
23
23
|
});
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
1
|
import { SystemIconProps } from '@workday/canvas-kit-react/icon';
|
|
3
2
|
import { CanvasSystemIcon } from '@workday/design-assets-types';
|
|
4
3
|
export interface PillIconProps extends Omit<SystemIconProps, 'icon'> {
|
|
@@ -10,7 +9,8 @@ export interface PillIconProps extends Omit<SystemIconProps, 'icon'> {
|
|
|
10
9
|
}
|
|
11
10
|
export declare const PillIcon: import("@workday/canvas-kit-react/common").ElementComponentM<"span", PillIconProps, {
|
|
12
11
|
state: {
|
|
13
|
-
|
|
12
|
+
id: string;
|
|
13
|
+
maxWidth: string | number;
|
|
14
14
|
disabled: boolean;
|
|
15
15
|
};
|
|
16
16
|
events: {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PillIcon.d.ts","sourceRoot":"","sources":["../../../../pill/lib/PillIcon.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"PillIcon.d.ts","sourceRoot":"","sources":["../../../../pill/lib/PillIcon.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAa,eAAe,EAAC,MAAM,gCAAgC,CAAC;AAG3E,OAAO,EAAC,gBAAgB,EAAC,MAAM,8BAA8B,CAAC;AAG9D,MAAM,WAAW,aAAc,SAAQ,IAAI,CAAC,eAAe,EAAE,MAAM,CAAC;IAClE;;;OAGG;IACH,IAAI,CAAC,EAAE,gBAAgB,CAAC;CACzB;AAED,eAAO,MAAM,QAAQ;;;;;;;EAenB,CAAC"}
|
|
@@ -30,5 +30,5 @@ export var PillIcon = createSubcomponent('span')({
|
|
|
30
30
|
modelHook: usePillModel,
|
|
31
31
|
})(function (_a, Element) {
|
|
32
32
|
var size = _a.size, icon = _a.icon, elemProps = __rest(_a, ["size", "icon"]);
|
|
33
|
-
return (React.createElement(SystemIcon, __assign({ marginInlineStart: "-" + space.xxxs, display: "flex", as: Element, size: 20, icon: icon || plusIcon }, elemProps)));
|
|
33
|
+
return (React.createElement(SystemIcon, __assign({ marginInlineStart: "-" + space.xxxs, display: "flex", as: Element, size: 20, role: "img", "aria-label": "add", icon: icon || plusIcon }, elemProps)));
|
|
34
34
|
});
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
1
|
import { SystemIconProps } from '@workday/canvas-kit-react/icon';
|
|
3
2
|
import { CanvasSystemIcon } from '@workday/design-assets-types';
|
|
4
3
|
export interface PillIconButtonProps extends Omit<SystemIconProps, 'icon'> {
|
|
@@ -7,10 +6,16 @@ export interface PillIconButtonProps extends Omit<SystemIconProps, 'icon'> {
|
|
|
7
6
|
* @default `xSmallIcon`
|
|
8
7
|
*/
|
|
9
8
|
icon?: CanvasSystemIcon;
|
|
9
|
+
/**
|
|
10
|
+
* The aria label for the removable icon
|
|
11
|
+
* @default 'remove'
|
|
12
|
+
*/
|
|
13
|
+
'aria-label'?: string;
|
|
10
14
|
}
|
|
11
15
|
export declare const PillIconButton: import("@workday/canvas-kit-react/common").ElementComponentM<"button", PillIconButtonProps, {
|
|
12
16
|
state: {
|
|
13
|
-
|
|
17
|
+
id: string;
|
|
18
|
+
maxWidth: string | number;
|
|
14
19
|
disabled: boolean;
|
|
15
20
|
};
|
|
16
21
|
events: {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PillIconButton.d.ts","sourceRoot":"","sources":["../../../../pill/lib/PillIconButton.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"PillIconButton.d.ts","sourceRoot":"","sources":["../../../../pill/lib/PillIconButton.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAa,eAAe,EAAC,MAAM,gCAAgC,CAAC;AAG3E,OAAO,EAAC,gBAAgB,EAAC,MAAM,8BAA8B,CAAC;AAI9D,MAAM,WAAW,mBAAoB,SAAQ,IAAI,CAAC,eAAe,EAAE,MAAM,CAAC;IACxE;;;OAGG;IACH,IAAI,CAAC,EAAE,gBAAgB,CAAC;IACxB;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AA6CD,eAAO,MAAM,cAAc;;;;;;;EAgC1B,CAAC"}
|
|
@@ -25,7 +25,7 @@ import { focusRing, styled, createSubcomponent } from '@workday/canvas-kit-react
|
|
|
25
25
|
import { SystemIcon } from '@workday/canvas-kit-react/icon';
|
|
26
26
|
import { usePillModel } from './usePillModel';
|
|
27
27
|
import { xSmallIcon } from '@workday/canvas-system-icons-web';
|
|
28
|
-
import {
|
|
28
|
+
import { colors, space } from '@workday/canvas-kit-react/tokens';
|
|
29
29
|
import { BaseButton } from '@workday/canvas-kit-react/button';
|
|
30
30
|
var getIconColors = function () {
|
|
31
31
|
return {
|
|
@@ -41,9 +41,7 @@ var getIconColors = function () {
|
|
|
41
41
|
focus: {
|
|
42
42
|
icon: colors.licorice500,
|
|
43
43
|
focusRing: focusRing({
|
|
44
|
-
width: 0,
|
|
45
44
|
innerColor: 'transparent',
|
|
46
|
-
outerColor: 'transparent',
|
|
47
45
|
}),
|
|
48
46
|
},
|
|
49
47
|
disabled: {
|
|
@@ -52,31 +50,26 @@ var getIconColors = function () {
|
|
|
52
50
|
},
|
|
53
51
|
};
|
|
54
52
|
};
|
|
55
|
-
var StyledFocusTarget = styled('span')({
|
|
56
|
-
height: 20,
|
|
57
|
-
position: 'absolute',
|
|
58
|
-
right: '5px',
|
|
59
|
-
left: space.xxxs,
|
|
60
|
-
margin: 0,
|
|
61
|
-
borderRadius: borderRadius.m,
|
|
62
|
-
'&:focus': __assign({ outline: 'none' }, focusRing({
|
|
63
|
-
outerColor: colors.blueberry400,
|
|
64
|
-
innerColor: 'transparent',
|
|
65
|
-
separation: 0,
|
|
66
|
-
width: 2,
|
|
67
|
-
inset: 'inner',
|
|
68
|
-
})),
|
|
69
|
-
});
|
|
70
53
|
var StyledIconButton = styled(BaseButton)({
|
|
71
|
-
marginInlineEnd: '-
|
|
72
|
-
|
|
73
|
-
|
|
54
|
+
marginInlineEnd: '-7px',
|
|
55
|
+
marginInlineStart: "-2px",
|
|
56
|
+
overflow: 'visible',
|
|
57
|
+
'::after': {
|
|
58
|
+
content: '""',
|
|
59
|
+
height: space.l,
|
|
60
|
+
width: space.l,
|
|
61
|
+
position: 'absolute',
|
|
62
|
+
left: '-7px',
|
|
63
|
+
bottom: '-7px',
|
|
64
|
+
margin: 0,
|
|
65
|
+
pointerEvents: 'all',
|
|
66
|
+
cursor: 'pointer',
|
|
67
|
+
},
|
|
74
68
|
});
|
|
75
69
|
export var PillIconButton = createSubcomponent('button')({
|
|
76
70
|
modelHook: usePillModel,
|
|
77
71
|
})(function (_a, Element, model) {
|
|
78
|
-
var size = _a.size, _b = _a.icon, icon = _b === void 0 ? xSmallIcon : _b, maxWidth = _a.maxWidth, children = _a.children, elemProps = __rest(_a, ["size", "icon", "maxWidth", "children"]);
|
|
79
|
-
return (React.createElement(StyledIconButton, __assign({ borderRadius: "s", height:
|
|
80
|
-
React.createElement(
|
|
81
|
-
React.createElement(SystemIcon, { icon: icon, size: 24 })));
|
|
72
|
+
var size = _a.size, _b = _a.icon, icon = _b === void 0 ? xSmallIcon : _b, maxWidth = _a.maxWidth, children = _a.children, _c = _a["aria-label"], ariaLabel = _c === void 0 ? 'remove' : _c, elemProps = __rest(_a, ["size", "icon", "maxWidth", "children", 'aria-label']);
|
|
73
|
+
return (React.createElement(StyledIconButton, __assign({ borderRadius: "s", height: 20, width: 20, padding: "zero", disabled: model.state.disabled, colors: getIconColors(), "aria-labelledby": "removable-" + model.state.id + " label-" + model.state.id, as: Element, position: "relative" }, elemProps),
|
|
74
|
+
React.createElement(SystemIcon, { "aria-label": ariaLabel, id: "removable-" + model.state.id, icon: icon, size: space.m, "aria-hidden": true, role: "img" })));
|
|
82
75
|
});
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
1
|
import { BoxProps } from '@workday/canvas-kit-react/layout';
|
|
3
2
|
import { OverflowTooltipProps } from '@workday/canvas-kit-react/tooltip';
|
|
4
3
|
export interface PillLabelProps extends BoxProps {
|
|
@@ -6,7 +5,8 @@ export interface PillLabelProps extends BoxProps {
|
|
|
6
5
|
}
|
|
7
6
|
export declare const PillLabel: import("@workday/canvas-kit-react/common").ElementComponentM<"span", PillLabelProps, {
|
|
8
7
|
state: {
|
|
9
|
-
|
|
8
|
+
id: string;
|
|
9
|
+
maxWidth: string | number;
|
|
10
10
|
disabled: boolean;
|
|
11
11
|
};
|
|
12
12
|
events: {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PillLabel.d.ts","sourceRoot":"","sources":["../../../../pill/lib/PillLabel.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"PillLabel.d.ts","sourceRoot":"","sources":["../../../../pill/lib/PillLabel.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAM,QAAQ,EAAC,MAAM,kCAAkC,CAAC;AAC/D,OAAO,EAAkB,oBAAoB,EAAC,MAAM,mCAAmC,CAAC;AAKxF,MAAM,WAAW,cAAe,SAAQ,QAAQ;IAC9C,YAAY,CAAC,EAAE,IAAI,CAAC,oBAAoB,EAAE,UAAU,CAAC,CAAC;CACvD;AAQD,eAAO,MAAM,SAAS;;;;;;;EAgBpB,CAAC"}
|
|
@@ -37,5 +37,5 @@ export var PillLabel = createSubcomponent('span')({
|
|
|
37
37
|
})(function (_a, Element, model) {
|
|
38
38
|
var tooltipProps = _a.tooltipProps, elemProps = __rest(_a, ["tooltipProps"]);
|
|
39
39
|
return (React.createElement(OverflowTooltip, __assign({}, tooltipProps),
|
|
40
|
-
React.createElement(StyledLabelContainer, __assign({ color: model.state.disabled ? colors.licorice100 : 'inherit', maxWidth: model.state.maxWidth, as: Element }, elemProps), elemProps.children)));
|
|
40
|
+
React.createElement(StyledLabelContainer, __assign({ color: model.state.disabled ? colors.licorice100 : 'inherit', maxWidth: model.state.maxWidth, as: Element, id: "label-" + model.state.id }, elemProps), elemProps.children)));
|
|
41
41
|
});
|
|
@@ -3,18 +3,24 @@ export declare const usePillModel: (<TT_Special_Generic>(config?: (Partial<{
|
|
|
3
3
|
* Determines the max width of the pill. If the pill text is longer than the max width,
|
|
4
4
|
* text will be truncated and a tooltip will show the rest of the content when hovered over
|
|
5
5
|
*/
|
|
6
|
-
maxWidth:
|
|
6
|
+
maxWidth: string | number;
|
|
7
7
|
/**
|
|
8
8
|
* Use to disable a pill.
|
|
9
9
|
*/
|
|
10
10
|
disabled: boolean;
|
|
11
|
+
/**
|
|
12
|
+
* ID used to add accessibility labels to pill elements.
|
|
13
|
+
* @default `useUniqueId()`
|
|
14
|
+
*/
|
|
15
|
+
id: string;
|
|
11
16
|
}> & {} & {}) | undefined) => {
|
|
12
17
|
state: {
|
|
18
|
+
id: string;
|
|
13
19
|
/**
|
|
14
20
|
* Determines the max width of the pill. If the pill text is longer than the max width,
|
|
15
21
|
* text will be truncated and a tooltip will show the rest of the content when hovered over
|
|
16
22
|
*/
|
|
17
|
-
maxWidth:
|
|
23
|
+
maxWidth: string | number;
|
|
18
24
|
/**
|
|
19
25
|
* Use to disable a pill.
|
|
20
26
|
*/
|
|
@@ -26,28 +32,35 @@ export declare const usePillModel: (<TT_Special_Generic>(config?: (Partial<{
|
|
|
26
32
|
* Determines the max width of the pill. If the pill text is longer than the max width,
|
|
27
33
|
* text will be truncated and a tooltip will show the rest of the content when hovered over
|
|
28
34
|
*/
|
|
29
|
-
maxWidth:
|
|
35
|
+
maxWidth: string | number;
|
|
30
36
|
/**
|
|
31
37
|
* Use to disable a pill.
|
|
32
38
|
*/
|
|
33
39
|
disabled: boolean;
|
|
40
|
+
/**
|
|
41
|
+
* ID used to add accessibility labels to pill elements.
|
|
42
|
+
* @default `useUniqueId()`
|
|
43
|
+
*/
|
|
44
|
+
id: string;
|
|
34
45
|
}, {}, {
|
|
46
|
+
id: string;
|
|
35
47
|
/**
|
|
36
48
|
* Determines the max width of the pill. If the pill text is longer than the max width,
|
|
37
49
|
* text will be truncated and a tooltip will show the rest of the content when hovered over
|
|
38
50
|
*/
|
|
39
|
-
maxWidth:
|
|
51
|
+
maxWidth: string | number;
|
|
40
52
|
/**
|
|
41
53
|
* Use to disable a pill.
|
|
42
54
|
*/
|
|
43
55
|
disabled: boolean;
|
|
44
56
|
}, {}, {
|
|
45
57
|
state: {
|
|
58
|
+
id: string;
|
|
46
59
|
/**
|
|
47
60
|
* Determines the max width of the pill. If the pill text is longer than the max width,
|
|
48
61
|
* text will be truncated and a tooltip will show the rest of the content when hovered over
|
|
49
62
|
*/
|
|
50
|
-
maxWidth:
|
|
63
|
+
maxWidth: string | number;
|
|
51
64
|
/**
|
|
52
65
|
* Use to disable a pill.
|
|
53
66
|
*/
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"usePillModel.d.ts","sourceRoot":"","sources":["../../../../pill/lib/usePillModel.tsx"],"names":[],"mappings":"AAEA,eAAO,MAAM,YAAY;IAErB;;;OAGG;;IAEH;;OAEG
|
|
1
|
+
{"version":3,"file":"usePillModel.d.ts","sourceRoot":"","sources":["../../../../pill/lib/usePillModel.tsx"],"names":[],"mappings":"AAEA,eAAO,MAAM,YAAY;IAErB;;;OAGG;;IAEH;;OAEG;;IAEH;;;OAGG;;;;;QAZH;;;WAGG;;QAEH;;WAEG;;;;;IAPH;;;OAGG;;IAEH;;OAEG;;IAEH;;;OAGG;;;;IAZH;;;OAGG;;IAEH;;OAEG;;;;;QAPH;;;WAGG;;QAEH;;WAEG;;;;EAgBL,CAAC"}
|
|
@@ -9,7 +9,7 @@ var __assign = (this && this.__assign) || function () {
|
|
|
9
9
|
};
|
|
10
10
|
return __assign.apply(this, arguments);
|
|
11
11
|
};
|
|
12
|
-
import { createModelHook } from '@workday/canvas-kit-react/common';
|
|
12
|
+
import { createModelHook, useUniqueId } from '@workday/canvas-kit-react/common';
|
|
13
13
|
export var usePillModel = createModelHook({
|
|
14
14
|
defaultConfig: {
|
|
15
15
|
/**
|
|
@@ -21,8 +21,14 @@ export var usePillModel = createModelHook({
|
|
|
21
21
|
* Use to disable a pill.
|
|
22
22
|
*/
|
|
23
23
|
disabled: false,
|
|
24
|
+
/**
|
|
25
|
+
* ID used to add accessibility labels to pill elements.
|
|
26
|
+
* @default `useUniqueId()`
|
|
27
|
+
*/
|
|
28
|
+
id: '',
|
|
24
29
|
},
|
|
25
30
|
})(function (config) {
|
|
26
|
-
var
|
|
31
|
+
var id = useUniqueId(config.id);
|
|
32
|
+
var state = __assign(__assign({}, config), { id: id });
|
|
27
33
|
return { state: state, events: {} };
|
|
28
34
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../select/index.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../select/index.ts"],"names":[],"mappings":"AACA,cAAc,cAAc,CAAC;AAE7B,OAAO,EACL,MAAM,EACN,gBAAgB,EAChB,oBAAoB,EACpB,sBAAsB,GACvB,MAAM,kBAAkB,CAAC"}
|
package/dist/es6/select/index.js
CHANGED
|
@@ -21,5 +21,4 @@ export interface SelectProps extends CoreSelectBaseProps {
|
|
|
21
21
|
export declare const Select: import("@workday/canvas-kit-react/common").ElementComponent<"button", SelectProps> & {
|
|
22
22
|
ErrorType: typeof ErrorType;
|
|
23
23
|
};
|
|
24
|
-
export default Select;
|
|
25
24
|
//# sourceMappingURL=Select.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../../select/lib/Select.tsx"],"names":[],"mappings":"AACA,OAAO,EACL,SAAS,EAKV,MAAM,kCAAkC,CAAC;AAE1C,
|
|
1
|
+
{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../../select/lib/Select.tsx"],"names":[],"mappings":"AACA,OAAO,EACL,SAAS,EAKV,MAAM,kCAAkC,CAAC;AAE1C,OAAO,EAAa,mBAAmB,EAAE,MAAM,EAAmB,MAAM,cAAc,CAAC;AAIvF,MAAM,WAAW,WAAY,SAAQ,mBAAmB;IACtD;;;;;;;;;;;;;;OAcG;IACH,OAAO,EAAE,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,CAAC;CAC9B;AAoiBD,eAAO,MAAM,MAAM;;CAUjB,CAAC"}
|
|
@@ -36,7 +36,7 @@ var __rest = (this && this.__rest) || function (s, e) {
|
|
|
36
36
|
import * as React from 'react';
|
|
37
37
|
import { ErrorType, createComponent, useForkRef, generateUniqueId, } from '@workday/canvas-kit-react/common';
|
|
38
38
|
import { menuAnimationDuration } from './SelectMenu';
|
|
39
|
-
import SelectBase from './SelectBase';
|
|
39
|
+
import { SelectBase } from './SelectBase';
|
|
40
40
|
import { getCorrectedIndexByValue } from './utils';
|
|
41
41
|
var SelectContainer = /** @class */ (function (_super) {
|
|
42
42
|
__extends(SelectContainer, _super);
|
|
@@ -494,4 +494,3 @@ export var Select = createComponent('button')({
|
|
|
494
494
|
ErrorType: ErrorType,
|
|
495
495
|
},
|
|
496
496
|
});
|
|
497
|
-
export default Select;
|
|
@@ -137,6 +137,6 @@ export interface SelectBaseProps extends CoreSelectBaseProps, StyledType {
|
|
|
137
137
|
}
|
|
138
138
|
export declare const buttonBorderWidth = 1;
|
|
139
139
|
export declare const buttonDefaultWidth = 280;
|
|
140
|
-
declare const SelectBase: ({ "aria-labelledby": ariaLabelledBy, "aria-required": ariaRequired, as, forwardedButtonRef, localButtonRef, disabled, error, focusedOptionIndex, grow, inputRef, menuPlacement, menuRef, menuVisibility, onChange, onKeyDown, onClose, onOptionSelection, options, renderOption, renderSelected, required, shouldMenuAutoFlip, shouldMenuAutoFocus, value, ...elemProps }: SelectBaseProps) => JSX.Element;
|
|
141
|
-
export
|
|
140
|
+
export declare const SelectBase: ({ "aria-labelledby": ariaLabelledBy, "aria-required": ariaRequired, as, forwardedButtonRef, localButtonRef, disabled, error, focusedOptionIndex, grow, inputRef, menuPlacement, menuRef, menuVisibility, onChange, onKeyDown, onClose, onOptionSelection, options, renderOption, renderSelected, required, shouldMenuAutoFlip, shouldMenuAutoFocus, value, ...elemProps }: SelectBaseProps) => JSX.Element;
|
|
141
|
+
export {};
|
|
142
142
|
//# sourceMappingURL=SelectBase.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SelectBase.d.ts","sourceRoot":"","sources":["../../../../select/lib/SelectBase.tsx"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"SelectBase.d.ts","sourceRoot":"","sources":["../../../../select/lib/SelectBase.tsx"],"names":[],"mappings":"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"}
|
|
@@ -25,8 +25,8 @@ import { errorRing, styled, useUniqueId, } from '@workday/canvas-kit-react/commo
|
|
|
25
25
|
import { colors, borderRadius, inputColors, spaceNumbers, type, space, } from '@workday/canvas-kit-react/tokens';
|
|
26
26
|
import { caretDownSmallIcon } from '@workday/canvas-system-icons-web';
|
|
27
27
|
import { SystemIcon } from '@workday/canvas-kit-react/icon';
|
|
28
|
-
import SelectMenu from './SelectMenu';
|
|
29
|
-
import SelectOption from './SelectOption';
|
|
28
|
+
import { SelectMenu } from './SelectMenu';
|
|
29
|
+
import { SelectOption } from './SelectOption';
|
|
30
30
|
import { scrollIntoViewIfNeeded } from './scrolling';
|
|
31
31
|
import { getCorrectedIndexByValue } from './utils';
|
|
32
32
|
export var buttonBorderWidth = 1;
|
|
@@ -106,7 +106,7 @@ var defaultRenderOption = function (option) {
|
|
|
106
106
|
var defaultRenderSelected = function (option) {
|
|
107
107
|
return option.label;
|
|
108
108
|
};
|
|
109
|
-
var SelectBase = function (_a) {
|
|
109
|
+
export var SelectBase = function (_a) {
|
|
110
110
|
var ariaLabelledBy = _a["aria-labelledby"], ariaRequired = _a["aria-required"], as = _a.as, forwardedButtonRef = _a.forwardedButtonRef, localButtonRef = _a.localButtonRef, disabled = _a.disabled, error = _a.error, _b = _a.focusedOptionIndex, focusedOptionIndex = _b === void 0 ? 0 : _b, grow = _a.grow, inputRef = _a.inputRef, _c = _a.menuPlacement, menuPlacement = _c === void 0 ? 'bottom' : _c, menuRef = _a.menuRef, _d = _a.menuVisibility, menuVisibility = _d === void 0 ? 'closed' : _d, onChange = _a.onChange, onKeyDown = _a.onKeyDown, onClose = _a.onClose, onOptionSelection = _a.onOptionSelection, options = _a.options, _e = _a.renderOption, renderOption = _e === void 0 ? defaultRenderOption : _e, _f = _a.renderSelected, renderSelected = _f === void 0 ? defaultRenderSelected : _f, required = _a.required, _g = _a.shouldMenuAutoFlip, shouldMenuAutoFlip = _g === void 0 ? true : _g, _h = _a.shouldMenuAutoFocus, shouldMenuAutoFocus = _h === void 0 ? true : _h, value = _a.value, elemProps = __rest(_a, ['aria-labelledby', 'aria-required', "as", "forwardedButtonRef", "localButtonRef", "disabled", "error", "focusedOptionIndex", "grow", "inputRef", "menuPlacement", "menuRef", "menuVisibility", "onChange", "onKeyDown", "onClose", "onOptionSelection", "options", "renderOption", "renderSelected", "required", "shouldMenuAutoFlip", "shouldMenuAutoFocus", "value"]);
|
|
111
111
|
var focusedOptionRef = React.useRef(null);
|
|
112
112
|
var menuId = useUniqueId();
|
|
@@ -195,4 +195,3 @@ var SelectBase = function (_a) {
|
|
|
195
195
|
hasOptions && menuVisibility !== 'closed' && (React.createElement(SelectMenu, { "aria-activedescendant": options[focusedOptionIndex].id, "aria-labelledby": ariaLabelledBy, "aria-required": ariaRequired || required ? true : undefined, buttonRef: localButtonRef, id: menuId, error: error, menuRef: menuRef, onKeyDown: onKeyDown, onClose: onClose, placement: menuPlacement, shouldAutoFlip: shouldMenuAutoFlip, shouldAutoFocus: shouldMenuAutoFocus, visibility: menuVisibility }, renderOptions(renderOption))),
|
|
196
196
|
React.createElement(SelectMenuIcon, { className: "menu-icon", icon: caretDownSmallIcon, color: disabled ? colors.licorice100 : colors.licorice200, colorHover: disabled ? colors.licorice100 : colors.licorice500, size: menuIconSize })));
|
|
197
197
|
};
|
|
198
|
-
export default SelectBase;
|
|
@@ -37,6 +37,6 @@ interface SelectMenuProps extends Themeable, React.HTMLAttributes<HTMLUListEleme
|
|
|
37
37
|
visibility?: MenuVisibility;
|
|
38
38
|
}
|
|
39
39
|
export declare const menuAnimationDuration = 200;
|
|
40
|
-
declare const SelectMenu: ({ buttonRef, children, error, menuRef, onClose, placement, shouldAutoFlip, shouldAutoFocus, visibility, ...elemProps }: SelectMenuProps) => JSX.Element;
|
|
41
|
-
export
|
|
40
|
+
export declare const SelectMenu: ({ buttonRef, children, error, menuRef, onClose, placement, shouldAutoFlip, shouldAutoFocus, visibility, ...elemProps }: SelectMenuProps) => JSX.Element;
|
|
41
|
+
export {};
|
|
42
42
|
//# sourceMappingURL=SelectMenu.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SelectMenu.d.ts","sourceRoot":"","sources":["../../../../select/lib/SelectMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA0D,MAAM,OAAO,CAAC;AAG/E,OAAO,EAAgC,SAAS,EAAS,MAAM,kCAAkC,CAAC;AAYlG,OAAO,EAAC,WAAW,EAAC,MAAM,UAAU,CAAC;AAErC,OAAO,EAAC,aAAa,EAAE,cAAc,EAAC,MAAM,SAAS,CAAC;AAEtD,UAAU,eACR,SAAQ,SAAS,EACf,KAAK,CAAC,cAAc,CAAC,gBAAgB,CAAC,EACtC,IAAI,CAAC,WAAW,EAAE,OAAO,CAAC;IAC5B;;OAEG;IACH,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,iBAAiB,CAAC,CAAC;IAC/C;;OAEG;IACH,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,gBAAgB,CAAC,CAAC;IAC5C;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB;;;OAGG;IACH,SAAS,CAAC,EAAE,aAAa,CAAC;IAC1B;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;;OAGG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;;OAGG;IACH,UAAU,CAAC,EAAE,cAAc,CAAC;CAC7B;AAED,eAAO,MAAM,qBAAqB,MAAM,CAAC;AAwKzC,
|
|
1
|
+
{"version":3,"file":"SelectMenu.d.ts","sourceRoot":"","sources":["../../../../select/lib/SelectMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA0D,MAAM,OAAO,CAAC;AAG/E,OAAO,EAAgC,SAAS,EAAS,MAAM,kCAAkC,CAAC;AAYlG,OAAO,EAAC,WAAW,EAAC,MAAM,UAAU,CAAC;AAErC,OAAO,EAAC,aAAa,EAAE,cAAc,EAAC,MAAM,SAAS,CAAC;AAEtD,UAAU,eACR,SAAQ,SAAS,EACf,KAAK,CAAC,cAAc,CAAC,gBAAgB,CAAC,EACtC,IAAI,CAAC,WAAW,EAAE,OAAO,CAAC;IAC5B;;OAEG;IACH,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,iBAAiB,CAAC,CAAC;IAC/C;;OAEG;IACH,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,gBAAgB,CAAC,CAAC;IAC5C;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB;;;OAGG;IACH,SAAS,CAAC,EAAE,aAAa,CAAC;IAC1B;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;;OAGG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;;OAGG;IACH,UAAU,CAAC,EAAE,cAAc,CAAC;CAC7B;AAED,eAAO,MAAM,qBAAqB,MAAM,CAAC;AAwKzC,eAAO,MAAM,UAAU,2HAWpB,eAAe,gBA2DjB,CAAC"}
|
|
@@ -170,7 +170,7 @@ var generatePopperOptions = function (props) {
|
|
|
170
170
|
},
|
|
171
171
|
};
|
|
172
172
|
};
|
|
173
|
-
var SelectMenu = function (_a) {
|
|
173
|
+
export var SelectMenu = function (_a) {
|
|
174
174
|
var buttonRef = _a.buttonRef, children = _a.children, error = _a.error, menuRef = _a.menuRef, onClose = _a.onClose, _b = _a.placement, placement = _b === void 0 ? 'bottom' : _b, _c = _a.shouldAutoFlip, shouldAutoFlip = _c === void 0 ? true : _c, _d = _a.shouldAutoFocus, shouldAutoFocus = _d === void 0 ? true : _d, _e = _a.visibility, visibility = _e === void 0 ? 'closed' : _e, elemProps = __rest(_a, ["buttonRef", "children", "error", "menuRef", "onClose", "placement", "shouldAutoFlip", "shouldAutoFocus", "visibility"]);
|
|
175
175
|
var model = usePopupModel({
|
|
176
176
|
initialVisibility: 'visible',
|
|
@@ -213,4 +213,3 @@ var SelectMenu = function (_a) {
|
|
|
213
213
|
React.createElement(Menu, { error: error, visibility: visibility, width: width },
|
|
214
214
|
React.createElement(MenuList, __assign({ error: error, ref: menuRef, role: "listbox", tabIndex: -1 }, elemProps), children))));
|
|
215
215
|
};
|
|
216
|
-
export default SelectMenu;
|
|
@@ -28,6 +28,5 @@ export interface SelectOptionProps extends Themeable, React.LiHTMLAttributes<HTM
|
|
|
28
28
|
*/
|
|
29
29
|
value?: string;
|
|
30
30
|
}
|
|
31
|
-
declare const SelectOption: ({ children, focused, interactive, optionRef, value, ...elemProps }: SelectOptionProps) => JSX.Element;
|
|
32
|
-
export default SelectOption;
|
|
31
|
+
export declare const SelectOption: ({ children, focused, interactive, optionRef, value, ...elemProps }: SelectOptionProps) => JSX.Element;
|
|
33
32
|
//# sourceMappingURL=SelectOption.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SelectOption.d.ts","sourceRoot":"","sources":["../../../../select/lib/SelectOption.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAEL,SAAS,EACT,SAAS,EAGV,MAAM,kCAAkC,CAAC;AAG1C,MAAM,WAAW,iBAAkB,SAAQ,SAAS,EAAE,KAAK,CAAC,gBAAgB,CAAC,aAAa,CAAC;IACzF;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;OAEG;IACH,SAAS,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,aAAa,CAAC,CAAC;IACrC;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAqED,
|
|
1
|
+
{"version":3,"file":"SelectOption.d.ts","sourceRoot":"","sources":["../../../../select/lib/SelectOption.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAEL,SAAS,EACT,SAAS,EAGV,MAAM,kCAAkC,CAAC;AAG1C,MAAM,WAAW,iBAAkB,SAAQ,SAAS,EAAE,KAAK,CAAC,gBAAgB,CAAC,aAAa,CAAC;IACzF;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;OAEG;IACH,SAAS,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,aAAa,CAAC,CAAC;IACrC;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAqED,eAAO,MAAM,YAAY,uEAOtB,iBAAiB,gBAanB,CAAC"}
|
|
@@ -74,8 +74,7 @@ var Option = styled('li')(__assign(__assign({}, type.levels.subtext.large), { cu
|
|
|
74
74
|
padding: optionPadding + "px " + (error === ErrorType.Alert ? optionPadding - 1 : optionPadding) + "px",
|
|
75
75
|
});
|
|
76
76
|
});
|
|
77
|
-
var SelectOption = function (_a) {
|
|
77
|
+
export var SelectOption = function (_a) {
|
|
78
78
|
var children = _a.children, _b = _a.focused, focused = _b === void 0 ? false : _b, _c = _a.interactive, interactive = _c === void 0 ? true : _c, optionRef = _a.optionRef, value = _a.value, elemProps = __rest(_a, ["children", "focused", "interactive", "optionRef", "value"]);
|
|
79
79
|
return (React.createElement(Option, __assign({ "data-value": value, focused: focused, interactive: interactive, ref: optionRef, role: "option" }, elemProps), children));
|
|
80
80
|
};
|
|
81
|
-
export default SelectOption;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../side-panel/index.ts"],"names":[],"mappings":"AAAA,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../side-panel/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC;AAC5B,cAAc,iBAAiB,CAAC"}
|
|
@@ -66,7 +66,7 @@ export declare const SidePanelContext: React.Context<{
|
|
|
66
66
|
state: string;
|
|
67
67
|
origin: string;
|
|
68
68
|
}>;
|
|
69
|
-
declare const SidePanel: {
|
|
69
|
+
export declare const SidePanel: {
|
|
70
70
|
({ as, children, collapsedWidth, expanded, expandedWidth, onAnimationEnd, onAnimationStart, onExpandedChange, onStateTransition, origin, variant, touched, ...elemProps }: SidePanelProps): jsx.JSX.Element;
|
|
71
71
|
ToggleButton: ({ variant, icon, tooltipTextExpand: expandLabel, tooltipTextCollapse: collapseLabel, ...rest }: ToggleButtonProps & React.ButtonHTMLAttributes<HTMLButtonElement>) => jsx.JSX.Element;
|
|
72
72
|
};
|
|
@@ -82,5 +82,4 @@ export declare type ToggleButtonProps = TertiaryButtonProps & {
|
|
|
82
82
|
*/
|
|
83
83
|
tooltipTextCollapse?: string;
|
|
84
84
|
};
|
|
85
|
-
export default SidePanel;
|
|
86
85
|
//# sourceMappingURL=SidePanel.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SidePanel.d.ts","sourceRoot":"","sources":["../../../../side-panel/lib/SidePanel.tsx"],"names":[],"mappings":"AAAA,0BAA0B;AAC1B,eAAe;AACf,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAM,GAAG,EAAuB,MAAM,gBAAgB,CAAC;AAC9D,OAAO,EAAiB,mBAAmB,EAAC,MAAM,kCAAkC,CAAC;AAKrF,oBAAY,gBAAgB,GAAG,UAAU,GAAG,WAAW,CAAC;AACxD,oBAAY,yBAAyB,GAAG,WAAW,GAAG,YAAY,GAAG,UAAU,GAAG,WAAW,CAAC;AAE9F,MAAM,WAAW,cAAe,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IAC1E;;;;OAIG;IACH,EAAE,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC;IACvB;;;;OAIG;IACH,cAAc,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACjC;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;OAIG;IACH,aAAa,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAChC;;;;OAIG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAC1B;;;;OAIG;IACH,gBAAgB,CAAC,EAAE,CAAC,QAAQ,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IAChD;;;;;;OAMG;IACH,iBAAiB,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,yBAAyB,KAAK,IAAI,CAAC;IAChE;;;;OAIG;IACH,OAAO,CAAC,EAAE,gBAAgB,CAAC;IAC3B;;;;OAIG;IACH,OAAO,EAAE,OAAO,CAAC;CAClB;AAsCD,eAAO,MAAM,gBAAgB;;;EAG3B,CAAC;AAEH,
|
|
1
|
+
{"version":3,"file":"SidePanel.d.ts","sourceRoot":"","sources":["../../../../side-panel/lib/SidePanel.tsx"],"names":[],"mappings":"AAAA,0BAA0B;AAC1B,eAAe;AACf,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAM,GAAG,EAAuB,MAAM,gBAAgB,CAAC;AAC9D,OAAO,EAAiB,mBAAmB,EAAC,MAAM,kCAAkC,CAAC;AAKrF,oBAAY,gBAAgB,GAAG,UAAU,GAAG,WAAW,CAAC;AACxD,oBAAY,yBAAyB,GAAG,WAAW,GAAG,YAAY,GAAG,UAAU,GAAG,WAAW,CAAC;AAE9F,MAAM,WAAW,cAAe,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IAC1E;;;;OAIG;IACH,EAAE,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC;IACvB;;;;OAIG;IACH,cAAc,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACjC;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;OAIG;IACH,aAAa,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAChC;;;;OAIG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAC1B;;;;OAIG;IACH,gBAAgB,CAAC,EAAE,CAAC,QAAQ,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IAChD;;;;;;OAMG;IACH,iBAAiB,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,yBAAyB,KAAK,IAAI,CAAC;IAChE;;;;OAIG;IACH,OAAO,CAAC,EAAE,gBAAgB,CAAC;IAC3B;;;;OAIG;IACH,OAAO,EAAE,OAAO,CAAC;CAClB;AAsCD,eAAO,MAAM,gBAAgB;;;EAG3B,CAAC;AAEH,eAAO,MAAM,SAAS;+KAcnB,cAAc;mHA0Gd,iBAAiB,GAAG,MAAM,oBAAoB,CAAC,iBAAiB,CAAC;CAxBnE,CAAC;AAEF,oBAAY,iBAAiB,GAAG,mBAAmB,GAAG;IACpD;;;OAGG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B;;;OAGG;IACH,mBAAmB,CAAC,EAAE,MAAM,CAAC;CAC9B,CAAC"}
|
|
@@ -56,7 +56,7 @@ export var SidePanelContext = React.createContext({
|
|
|
56
56
|
state: 'expanded',
|
|
57
57
|
origin: 'left',
|
|
58
58
|
});
|
|
59
|
-
var SidePanel = function (_a) {
|
|
59
|
+
export var SidePanel = function (_a) {
|
|
60
60
|
var _b = _a.as, as = _b === void 0 ? 'section' : _b, children = _a.children, _c = _a.collapsedWidth, collapsedWidth = _c === void 0 ? 64 : _c, _d = _a.expanded, expanded = _d === void 0 ? true : _d, _e = _a.expandedWidth, expandedWidth = _e === void 0 ? 320 : _e, onAnimationEnd = _a.onAnimationEnd, onAnimationStart = _a.onAnimationStart, onExpandedChange = _a.onExpandedChange, onStateTransition = _a.onStateTransition, _f = _a.origin, origin = _f === void 0 ? 'left' : _f, _g = _a.variant, variant = _g === void 0 ? 'standard' : _g, touched = _a.touched, elemProps = __rest(_a, ["as", "children", "collapsedWidth", "expanded", "expandedWidth", "onAnimationEnd", "onAnimationStart", "onExpandedChange", "onStateTransition", "origin", "variant", "touched"]);
|
|
61
61
|
var _h = React.useState(expanded ? 'expanded' : 'collapsed'), state = _h[0], setState = _h[1];
|
|
62
62
|
React.useEffect(function () {
|
|
@@ -146,5 +146,4 @@ var ToggleButton = function (_a) {
|
|
|
146
146
|
jsx(TertiaryButton, __assign({ type: "button", css: buttonStyle, icon: icon, variant: variant }, rest))));
|
|
147
147
|
};
|
|
148
148
|
SidePanel.ToggleButton = ToggleButton;
|
|
149
|
-
export default SidePanel;
|
|
150
149
|
var templateObject_1;
|
package/form-field/package.json
CHANGED
package/menu/index.ts
CHANGED
package/menu/lib/Menu.tsx
CHANGED
|
@@ -57,7 +57,7 @@ const List = styled('ul')({
|
|
|
57
57
|
...hideMouseFocus,
|
|
58
58
|
});
|
|
59
59
|
|
|
60
|
-
export
|
|
60
|
+
export class Menu extends React.Component<MenuProps, MenuState> {
|
|
61
61
|
private id = generateUniqueId();
|
|
62
62
|
private animateId!: number;
|
|
63
63
|
|
|
@@ -284,7 +284,7 @@ export default class Menu extends React.Component<MenuProps, MenuState> {
|
|
|
284
284
|
private setFirstCharacters = (): void => {
|
|
285
285
|
const getFirstCharacter = (child: React.ReactNode): string => {
|
|
286
286
|
let character = '';
|
|
287
|
-
if (!child || typeof child === 'boolean'
|
|
287
|
+
if (!child || typeof child === 'boolean') {
|
|
288
288
|
character = '';
|
|
289
289
|
} else if (typeof child === 'string' || typeof child === 'number') {
|
|
290
290
|
character = child
|
package/menu/lib/MenuItem.tsx
CHANGED
|
@@ -237,7 +237,7 @@ const scrollIntoViewIfNeeded = (elem: HTMLElement, centerIfNeeded = true): void
|
|
|
237
237
|
}
|
|
238
238
|
};
|
|
239
239
|
|
|
240
|
-
class MenuItem extends React.Component<MenuItemProps> {
|
|
240
|
+
export class MenuItem extends React.Component<MenuItemProps> {
|
|
241
241
|
ref = React.createRef<HTMLLIElement>();
|
|
242
242
|
|
|
243
243
|
componentDidUpdate = (prevProps: MenuItemProps) => {
|
|
@@ -310,5 +310,3 @@ MenuItem.defaultProps = {
|
|
|
310
310
|
shouldClose: true,
|
|
311
311
|
role: 'menuitem',
|
|
312
312
|
};
|
|
313
|
-
|
|
314
|
-
export default MenuItem;
|