@workday/canvas-kit-react 16.0.0-alpha.0463-next.0 → 16.0.0-alpha.0465-next.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/checkbox/lib/CheckboxContainer.tsx +0 -1
- package/combobox/lib/ComboboxCard.tsx +2 -11
- package/dialog/lib/Dialog.tsx +6 -0
- package/dist/commonjs/checkbox/lib/CheckboxContainer.d.ts.map +1 -1
- package/dist/commonjs/checkbox/lib/CheckboxContainer.js +1 -1
- package/dist/commonjs/combobox/lib/ComboboxCard.d.ts +0 -1
- package/dist/commonjs/combobox/lib/ComboboxCard.d.ts.map +1 -1
- package/dist/commonjs/combobox/lib/ComboboxCard.js +2 -6
- package/dist/commonjs/dialog/lib/Dialog.d.ts +23 -0
- package/dist/commonjs/dialog/lib/Dialog.d.ts.map +1 -1
- package/dist/commonjs/dialog/lib/Dialog.js +6 -0
- package/dist/commonjs/modal/lib/Modal.d.ts +23 -0
- package/dist/commonjs/modal/lib/Modal.d.ts.map +1 -1
- package/dist/commonjs/modal/lib/Modal.js +6 -0
- package/dist/commonjs/popup/lib/Popup.d.ts +23 -0
- package/dist/commonjs/popup/lib/Popup.d.ts.map +1 -1
- package/dist/commonjs/popup/lib/Popup.js +7 -0
- package/dist/commonjs/popup/lib/PopupButtonGroup.d.ts +53 -0
- package/dist/commonjs/popup/lib/PopupButtonGroup.d.ts.map +1 -0
- package/dist/commonjs/popup/lib/PopupButtonGroup.js +27 -0
- package/dist/commonjs/popup/lib/PopupCard.d.ts.map +1 -1
- package/dist/commonjs/popup/lib/PopupCard.js +1 -1
- package/dist/commonjs/toast/lib/Toast.d.ts.map +1 -1
- package/dist/commonjs/toast/lib/Toast.js +2 -2
- package/dist/commonjs/toast/lib/ToastBody.d.ts.map +1 -1
- package/dist/commonjs/toast/lib/ToastBody.js +2 -3
- package/dist/commonjs/toast/lib/ToastCloseIcon.d.ts.map +1 -1
- package/dist/commonjs/toast/lib/ToastCloseIcon.js +4 -3
- package/dist/commonjs/toast/lib/ToastIcon.d.ts.map +1 -1
- package/dist/commonjs/toast/lib/ToastIcon.js +3 -3
- package/dist/commonjs/tooltip/lib/TooltipContainer.d.ts +1 -4
- package/dist/commonjs/tooltip/lib/TooltipContainer.d.ts.map +1 -1
- package/dist/commonjs/tooltip/lib/TooltipContainer.js +2 -2
- package/dist/es6/checkbox/lib/CheckboxContainer.d.ts.map +1 -1
- package/dist/es6/checkbox/lib/CheckboxContainer.js +1 -1
- package/dist/es6/combobox/lib/ComboboxCard.d.ts +0 -1
- package/dist/es6/combobox/lib/ComboboxCard.d.ts.map +1 -1
- package/dist/es6/combobox/lib/ComboboxCard.js +2 -6
- package/dist/es6/dialog/lib/Dialog.d.ts +23 -0
- package/dist/es6/dialog/lib/Dialog.d.ts.map +1 -1
- package/dist/es6/dialog/lib/Dialog.js +6 -0
- package/dist/es6/modal/lib/Modal.d.ts +23 -0
- package/dist/es6/modal/lib/Modal.d.ts.map +1 -1
- package/dist/es6/modal/lib/Modal.js +6 -0
- package/dist/es6/popup/lib/Popup.d.ts +23 -0
- package/dist/es6/popup/lib/Popup.d.ts.map +1 -1
- package/dist/es6/popup/lib/Popup.js +7 -0
- package/dist/es6/popup/lib/PopupButtonGroup.d.ts +53 -0
- package/dist/es6/popup/lib/PopupButtonGroup.d.ts.map +1 -0
- package/dist/es6/popup/lib/PopupButtonGroup.js +24 -0
- package/dist/es6/popup/lib/PopupCard.d.ts.map +1 -1
- package/dist/es6/popup/lib/PopupCard.js +1 -1
- package/dist/es6/toast/lib/Toast.d.ts.map +1 -1
- package/dist/es6/toast/lib/Toast.js +3 -3
- package/dist/es6/toast/lib/ToastBody.d.ts.map +1 -1
- package/dist/es6/toast/lib/ToastBody.js +2 -3
- package/dist/es6/toast/lib/ToastCloseIcon.d.ts.map +1 -1
- package/dist/es6/toast/lib/ToastCloseIcon.js +4 -3
- package/dist/es6/toast/lib/ToastIcon.d.ts.map +1 -1
- package/dist/es6/toast/lib/ToastIcon.js +4 -4
- package/dist/es6/tooltip/lib/TooltipContainer.d.ts +1 -4
- package/dist/es6/tooltip/lib/TooltipContainer.d.ts.map +1 -1
- package/dist/es6/tooltip/lib/TooltipContainer.js +2 -2
- package/modal/lib/Modal.tsx +6 -0
- package/package.json +4 -4
- package/popup/lib/Popup.tsx +7 -0
- package/popup/lib/PopupButtonGroup.tsx +60 -0
- package/popup/lib/PopupCard.tsx +1 -0
- package/toast/lib/Toast.tsx +11 -3
- package/toast/lib/ToastBody.tsx +1 -3
- package/toast/lib/ToastCloseIcon.tsx +5 -2
- package/toast/lib/ToastIcon.tsx +9 -3
- package/tooltip/lib/TooltipContainer.tsx +14 -19
|
@@ -4,8 +4,7 @@ import {
|
|
|
4
4
|
createSubcomponent,
|
|
5
5
|
} from '@workday/canvas-kit-react/common';
|
|
6
6
|
import {Menu} from '@workday/canvas-kit-react/menu';
|
|
7
|
-
import {
|
|
8
|
-
import {system} from '@workday/canvas-tokens-web';
|
|
7
|
+
import {handleCsProp} from '@workday/canvas-kit-styling';
|
|
9
8
|
|
|
10
9
|
import {useComboboxModel} from './hooks/useComboboxModel';
|
|
11
10
|
|
|
@@ -21,20 +20,12 @@ export const useComboboxCard = createElemPropsHook(useComboboxModel)(model => {
|
|
|
21
20
|
} as const;
|
|
22
21
|
});
|
|
23
22
|
|
|
24
|
-
export const comboboxCardStencil = createStencil({
|
|
25
|
-
base: {
|
|
26
|
-
'& :where([data-part="list-box-container"])': {
|
|
27
|
-
borderRadius: system.legacy.shape.xxl,
|
|
28
|
-
},
|
|
29
|
-
},
|
|
30
|
-
});
|
|
31
|
-
|
|
32
23
|
export const ComboboxCard = createSubcomponent('div')({
|
|
33
24
|
modelHook: useComboboxModel,
|
|
34
25
|
elemPropsHook: useComboboxCard,
|
|
35
26
|
})<ComboboxCardProps>(({children, ...elemProps}, Element) => {
|
|
36
27
|
return (
|
|
37
|
-
<Menu.Card as={Element} {...handleCsProp(elemProps
|
|
28
|
+
<Menu.Card as={Element} {...handleCsProp(elemProps)}>
|
|
38
29
|
{children}
|
|
39
30
|
</Menu.Card>
|
|
40
31
|
);
|
package/dialog/lib/Dialog.tsx
CHANGED
|
@@ -91,6 +91,12 @@ export const Dialog = createContainer()({
|
|
|
91
91
|
* {@link usePopupCloseButton}.
|
|
92
92
|
*/
|
|
93
93
|
CloseButton: Popup.CloseButton,
|
|
94
|
+
/**
|
|
95
|
+
* A `Dialog.ButtonGroup` component styled with {@link popupButtonGroupStencil}. It is used to
|
|
96
|
+
* group buttons within a dialog and can place buttons at the start, center, or end of the
|
|
97
|
+
* container.
|
|
98
|
+
*/
|
|
99
|
+
ButtonGroup: Popup.ButtonGroup,
|
|
94
100
|
},
|
|
95
101
|
})(({children}: DialogProps) => {
|
|
96
102
|
return <>{children}</>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CheckboxContainer.d.ts","sourceRoot":"","sources":["../../../../checkbox/lib/CheckboxContainer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAC,OAAO,EAA8B,MAAM,6BAA6B,CAAC;AAGjF,UAAU,sBAAuB,SAAQ,OAAO;IAC9C,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,SAAS,CAAC;CACrB;
|
|
1
|
+
{"version":3,"file":"CheckboxContainer.d.ts","sourceRoot":"","sources":["../../../../checkbox/lib/CheckboxContainer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAC,OAAO,EAA8B,MAAM,6BAA6B,CAAC;AAGjF,UAAU,sBAAuB,SAAQ,OAAO;IAC9C,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,SAAS,CAAC;CACrB;AAwCD,eAAO,MAAM,iBAAiB,4FAoB5B,CAAC"}
|
|
@@ -13,7 +13,7 @@ const checkboxContainerStencil = (0, canvas_kit_styling_1.createStencil)({
|
|
|
13
13
|
base: { name: "klclr", styles: "box-sizing:border-box;display:flex;align-items:center;min-height:var(--cnvs-sys-size-xxxs, var(--cnvs-sys-space-x4, 1rem));position:relative;&>div{display:flex;height:var(--cnvs-sys-size-xxxs, var(--cnvs-sys-space-x4, 1rem));min-width:var(--cnvs-sys-size-xxxs, var(--cnvs-sys-space-x4, 1rem));align-self:flex-start;position:relative;}[data-part=\"checkbox-container-label\"]{padding-inline-start:var(--cnvs-sys-padding-xs, var(--cnvs-sys-space-x2, 0.5rem));cursor:pointer;margin-block-start:calc(0.125rem * -1);}" },
|
|
14
14
|
modifiers: {
|
|
15
15
|
disabled: {
|
|
16
|
-
true: { name: "
|
|
16
|
+
true: { name: "bcjzk", styles: "[data-part=\"checkbox-container-label\"]{cursor:default;}" }
|
|
17
17
|
}
|
|
18
18
|
}
|
|
19
19
|
}, "checkbox-container-bafc3c");
|
|
@@ -209,7 +209,6 @@ export declare const useComboboxCard: import("@workday/canvas-kit-react/common")
|
|
|
209
209
|
}, {
|
|
210
210
|
readonly minWidth: number;
|
|
211
211
|
}>;
|
|
212
|
-
export declare const comboboxCardStencil: import("@workday/canvas-kit-styling").Stencil<import("@workday/canvas-kit-styling").StencilModifierConfig<{}, {}, never>, {}, {}, never, never>;
|
|
213
212
|
export declare const ComboboxCard: import("@workday/canvas-kit-react/common").ElementComponentM<"div", ComboboxCardProps, {
|
|
214
213
|
state: {
|
|
215
214
|
stackRef: import("react").RefObject<HTMLDivElement>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ComboboxCard.d.ts","sourceRoot":"","sources":["../../../../combobox/lib/ComboboxCard.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,YAAY,EAGb,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAC,IAAI,EAAC,MAAM,gCAAgC,CAAC;
|
|
1
|
+
{"version":3,"file":"ComboboxCard.d.ts","sourceRoot":"","sources":["../../../../combobox/lib/ComboboxCard.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,YAAY,EAGb,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAC,IAAI,EAAC,MAAM,gCAAgC,CAAC;AAKpD,MAAM,WAAW,iBAAkB,SAAQ,YAAY,CAAC,OAAO,IAAI,CAAC,IAAI,CAAC;CAAG;AAE5E;;;GAGG;AACH,eAAO,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAI1B,CAAC;AAEH,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EASvB,CAAC"}
|
|
@@ -1,11 +1,10 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.ComboboxCard = exports.
|
|
3
|
+
exports.ComboboxCard = exports.useComboboxCard = void 0;
|
|
4
4
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
5
5
|
const common_1 = require("@workday/canvas-kit-react/common");
|
|
6
6
|
const menu_1 = require("@workday/canvas-kit-react/menu");
|
|
7
7
|
const canvas_kit_styling_1 = require("@workday/canvas-kit-styling");
|
|
8
|
-
const canvas_tokens_web_1 = require("@workday/canvas-tokens-web");
|
|
9
8
|
const useComboboxModel_1 = require("./hooks/useComboboxModel");
|
|
10
9
|
/**
|
|
11
10
|
* This hook sets the `minWidth` style attribute to match the width of the
|
|
@@ -16,12 +15,9 @@ exports.useComboboxCard = (0, common_1.createElemPropsHook)(useComboboxModel_1.u
|
|
|
16
15
|
minWidth: model.state.width,
|
|
17
16
|
};
|
|
18
17
|
});
|
|
19
|
-
exports.comboboxCardStencil = (0, canvas_kit_styling_1.createStencil)({
|
|
20
|
-
base: { name: "3gllpz", styles: "box-sizing:border-box;& :where([data-part=\"list-box-container\"]){border-radius:var(--cnvs-sys-shape-xxl, var(--cnvs-sys-shape-x6, 1.5rem));}" }
|
|
21
|
-
}, "combobox-card-97127b");
|
|
22
18
|
exports.ComboboxCard = (0, common_1.createSubcomponent)('div')({
|
|
23
19
|
modelHook: useComboboxModel_1.useComboboxModel,
|
|
24
20
|
elemPropsHook: exports.useComboboxCard,
|
|
25
21
|
})(({ children, ...elemProps }, Element) => {
|
|
26
|
-
return ((0, jsx_runtime_1.jsx)(menu_1.Menu.Card, { as: Element, ...(0, canvas_kit_styling_1.handleCsProp)(elemProps
|
|
22
|
+
return ((0, jsx_runtime_1.jsx)(menu_1.Menu.Card, { as: Element, ...(0, canvas_kit_styling_1.handleCsProp)(elemProps), children: children }));
|
|
27
23
|
});
|
|
@@ -313,5 +313,28 @@ export declare const Dialog: import("@workday/canvas-kit-react/common").Componen
|
|
|
313
313
|
hide(event?: Event | React.SyntheticEvent<Element, Event> | undefined): void;
|
|
314
314
|
};
|
|
315
315
|
}>;
|
|
316
|
+
/**
|
|
317
|
+
* A `Dialog.ButtonGroup` component styled with {@link popupButtonGroupStencil}. It is used to
|
|
318
|
+
* group buttons within a dialog and can place buttons at the start, center, or end of the
|
|
319
|
+
* container.
|
|
320
|
+
*/
|
|
321
|
+
ButtonGroup: import("@workday/canvas-kit-react/common").ElementComponentM<"div", import("../../popup/lib/PopupButtonGroup").PopupButtonGroupProps, {
|
|
322
|
+
state: {
|
|
323
|
+
stackRef: React.RefObject<HTMLDivElement>;
|
|
324
|
+
targetRef: React.RefObject<HTMLButtonElement>;
|
|
325
|
+
initialFocusRef: React.RefObject<any> | undefined;
|
|
326
|
+
returnFocusRef: React.RefObject<any> | undefined;
|
|
327
|
+
placement: import("@popperjs/core").Placement;
|
|
328
|
+
id: string;
|
|
329
|
+
visibility: "hidden" | "visible";
|
|
330
|
+
};
|
|
331
|
+
events: {
|
|
332
|
+
updatePlacement(data: {
|
|
333
|
+
placement: import("@popperjs/core").Placement;
|
|
334
|
+
}): void;
|
|
335
|
+
show(event?: Event | React.SyntheticEvent<Element, Event> | undefined): void;
|
|
336
|
+
hide(event?: Event | React.SyntheticEvent<Element, Event> | undefined): void;
|
|
337
|
+
};
|
|
338
|
+
}>;
|
|
316
339
|
};
|
|
317
340
|
//# sourceMappingURL=Dialog.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Dialog.d.ts","sourceRoot":"","sources":["../../../../dialog/lib/Dialog.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAS1B,MAAM,WAAW,WAAW;IAC1B;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED;;;;;;GAMG;AACH,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAIf;;;OAGG;;;;;;;;;;;;;;;;;;;IAEH;;;;OAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAEH;;;OAGG;;;;;;;;;;;;;;;;;;;IAEH;;;;;;;;;;;;;;;;;;;;;;;;;;;;OA4BG;;;;;;;;;;;;;;;;;;;IAEH;;;;;OAKG;;;;;;;;;;;;;;;;;;;IAEH;;;OAGG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAGH;;;;;OAKG;;;;;;;;;;;;;;;;;;;CAKL,CAAC"}
|
|
1
|
+
{"version":3,"file":"Dialog.d.ts","sourceRoot":"","sources":["../../../../dialog/lib/Dialog.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAS1B,MAAM,WAAW,WAAW;IAC1B;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED;;;;;;GAMG;AACH,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAIf;;;OAGG;;;;;;;;;;;;;;;;;;;IAEH;;;;OAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAEH;;;OAGG;;;;;;;;;;;;;;;;;;;IAEH;;;;;;;;;;;;;;;;;;;;;;;;;;;;OA4BG;;;;;;;;;;;;;;;;;;;IAEH;;;;;OAKG;;;;;;;;;;;;;;;;;;;IAEH;;;OAGG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAGH;;;;;OAKG;;;;;;;;;;;;;;;;;;;IAEH;;;;OAIG;;;;;;;;;;;;;;;;;;;CAKL,CAAC"}
|
|
@@ -83,6 +83,12 @@ exports.Dialog = (0, common_1.createContainer)()({
|
|
|
83
83
|
* {@link usePopupCloseButton}.
|
|
84
84
|
*/
|
|
85
85
|
CloseButton: popup_1.Popup.CloseButton,
|
|
86
|
+
/**
|
|
87
|
+
* A `Dialog.ButtonGroup` component styled with {@link popupButtonGroupStencil}. It is used to
|
|
88
|
+
* group buttons within a dialog and can place buttons at the start, center, or end of the
|
|
89
|
+
* container.
|
|
90
|
+
*/
|
|
91
|
+
ButtonGroup: popup_1.Popup.ButtonGroup,
|
|
86
92
|
},
|
|
87
93
|
})(({ children }) => {
|
|
88
94
|
return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: children });
|
|
@@ -330,5 +330,28 @@ export declare const Modal: import("@workday/canvas-kit-react/common").Component
|
|
|
330
330
|
hide(event?: Event | import("react").SyntheticEvent<Element, Event> | undefined): void;
|
|
331
331
|
};
|
|
332
332
|
}>;
|
|
333
|
+
/**
|
|
334
|
+
* A `Modal.ButtonGroup` component styled with {@link popupButtonGroupStencil}. It is used to
|
|
335
|
+
* group buttons within a modal and can place buttons at the start, center, or end of the
|
|
336
|
+
* container.
|
|
337
|
+
*/
|
|
338
|
+
ButtonGroup: import("@workday/canvas-kit-react/common").ElementComponentM<"div", import("../../popup/lib/PopupButtonGroup").PopupButtonGroupProps, {
|
|
339
|
+
state: {
|
|
340
|
+
stackRef: import("react").RefObject<HTMLDivElement>;
|
|
341
|
+
targetRef: import("react").RefObject<HTMLButtonElement>;
|
|
342
|
+
initialFocusRef: import("react").RefObject<any> | undefined;
|
|
343
|
+
returnFocusRef: import("react").RefObject<any> | undefined;
|
|
344
|
+
placement: import("@popperjs/core").Placement;
|
|
345
|
+
id: string;
|
|
346
|
+
visibility: "hidden" | "visible";
|
|
347
|
+
};
|
|
348
|
+
events: {
|
|
349
|
+
updatePlacement(data: {
|
|
350
|
+
placement: import("@popperjs/core").Placement;
|
|
351
|
+
}): void;
|
|
352
|
+
show(event?: Event | import("react").SyntheticEvent<Element, Event> | undefined): void;
|
|
353
|
+
hide(event?: Event | import("react").SyntheticEvent<Element, Event> | undefined): void;
|
|
354
|
+
};
|
|
355
|
+
}>;
|
|
333
356
|
};
|
|
334
357
|
//# sourceMappingURL=Modal.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../../../modal/lib/Modal.tsx"],"names":[],"mappings":"AAWA;;;;;;GAMG;AACH,eAAO,MAAM,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAId;;;;;;;;;;OAUG;;;;;;;;;;;;;;;;;;;IAEH;;;;;OAKG;;;;;;;;;;;;;;;;;;;IAEH;;;;;;OAMG;;;;;;;;;;;;;;;;;;;IAEH;;;;;;;;;;OAUG;;;;;;;;;;;;;;;;;;;IAEH;;;;;;OAMG;;;;;;;;;;;;;;;;;;;IAEH;;;;;;;;;;;;OAYG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAGH;;;;;;;;OAQG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAKL,CAAC"}
|
|
1
|
+
{"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../../../modal/lib/Modal.tsx"],"names":[],"mappings":"AAWA;;;;;;GAMG;AACH,eAAO,MAAM,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAId;;;;;;;;;;OAUG;;;;;;;;;;;;;;;;;;;IAEH;;;;;OAKG;;;;;;;;;;;;;;;;;;;IAEH;;;;;;OAMG;;;;;;;;;;;;;;;;;;;IAEH;;;;;;;;;;OAUG;;;;;;;;;;;;;;;;;;;IAEH;;;;;;OAMG;;;;;;;;;;;;;;;;;;;IAEH;;;;;;;;;;;;OAYG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAGH;;;;;;;;OAQG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAEH;;;;OAIG;;;;;;;;;;;;;;;;;;;CAKL,CAAC"}
|
|
@@ -93,6 +93,12 @@ exports.Modal = (0, common_1.createContainer)()({
|
|
|
93
93
|
* full body overflow is desired.
|
|
94
94
|
*/
|
|
95
95
|
OverflowOverlay: ModalOverflowOverlay_1.ModalOverflowOverlay,
|
|
96
|
+
/**
|
|
97
|
+
* A `Modal.ButtonGroup` component styled with {@link popupButtonGroupStencil}. It is used to
|
|
98
|
+
* group buttons within a modal and can place buttons at the start, center, or end of the
|
|
99
|
+
* container.
|
|
100
|
+
*/
|
|
101
|
+
ButtonGroup: popup_1.Popup.ButtonGroup,
|
|
96
102
|
},
|
|
97
103
|
})(elemProps => {
|
|
98
104
|
return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: elemProps.children });
|
|
@@ -296,5 +296,28 @@ export declare const Popup: import("@workday/canvas-kit-react/common").Component
|
|
|
296
296
|
hide(event?: Event | React.SyntheticEvent<Element, Event> | undefined): void;
|
|
297
297
|
};
|
|
298
298
|
}>;
|
|
299
|
+
/**
|
|
300
|
+
* A `Popup.ButtonGroup` component styled with {@link popupButtonGroupStencil}. It is used to
|
|
301
|
+
* visually group buttons within a popup and can place buttons at the start, center, or end of the
|
|
302
|
+
* container.
|
|
303
|
+
*/
|
|
304
|
+
ButtonGroup: import("@workday/canvas-kit-react/common").ElementComponentM<"div", import("./PopupButtonGroup").PopupButtonGroupProps, {
|
|
305
|
+
state: {
|
|
306
|
+
stackRef: React.RefObject<HTMLDivElement>;
|
|
307
|
+
targetRef: React.RefObject<HTMLButtonElement>;
|
|
308
|
+
initialFocusRef: React.RefObject<any> | undefined;
|
|
309
|
+
returnFocusRef: React.RefObject<any> | undefined;
|
|
310
|
+
placement: import("@popperjs/core").Placement;
|
|
311
|
+
id: string;
|
|
312
|
+
visibility: "hidden" | "visible";
|
|
313
|
+
};
|
|
314
|
+
events: {
|
|
315
|
+
updatePlacement(data: {
|
|
316
|
+
placement: import("@popperjs/core").Placement;
|
|
317
|
+
}): void;
|
|
318
|
+
show(event?: Event | React.SyntheticEvent<Element, Event> | undefined): void;
|
|
319
|
+
hide(event?: Event | React.SyntheticEvent<Element, Event> | undefined): void;
|
|
320
|
+
};
|
|
321
|
+
}>;
|
|
299
322
|
};
|
|
300
323
|
//# sourceMappingURL=Popup.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Popup.d.ts","sourceRoot":"","sources":["../../../../popup/lib/Popup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"Popup.d.ts","sourceRoot":"","sources":["../../../../popup/lib/Popup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAc/B,MAAM,WAAW,UAAU;IACzB;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED;;;;;;;;;;;;;;;;GAgBG;AACH,eAAO,MAAM,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAId;;;;;;;;;;;;;;;;;;;;;;;;;;;;OA4BG;;;;;;;;;;;;;;;;;;;IAEH;;;;;;;;;OASG;;;;;;;;;;;;;;;;;;;IAEH;;;;OAIG;;;;;;;;;;;;;;;;;;;IAEH;;;OAGG;;;;;;;;;;;;;;;;;;;IAEH;;;;;;OAMG;;;;;;;;;;;;;;;;;;;IAEH;;;OAGG;;;;;;;;;;;;;;;;;;;IAEH;;;;;OAKG;;;;;;;;;;;;;;;;;;;IAEH;;;;OAIG;;;;;;;;;;;;;;;;;;;CAKL,CAAC"}
|
|
@@ -4,6 +4,7 @@ exports.Popup = void 0;
|
|
|
4
4
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
5
5
|
const common_1 = require("@workday/canvas-kit-react/common");
|
|
6
6
|
const PopupBody_1 = require("./PopupBody");
|
|
7
|
+
const PopupButtonGroup_1 = require("./PopupButtonGroup");
|
|
7
8
|
const PopupCard_1 = require("./PopupCard");
|
|
8
9
|
const PopupCloseButton_1 = require("./PopupCloseButton");
|
|
9
10
|
const PopupCloseIcon_1 = require("./PopupCloseIcon");
|
|
@@ -104,6 +105,12 @@ exports.Popup = (0, common_1.createContainer)()({
|
|
|
104
105
|
* {@link usePopupCloseButton}.
|
|
105
106
|
*/
|
|
106
107
|
CloseButton: PopupCloseButton_1.PopupCloseButton,
|
|
108
|
+
/**
|
|
109
|
+
* A `Popup.ButtonGroup` component styled with {@link popupButtonGroupStencil}. It is used to
|
|
110
|
+
* visually group buttons within a popup and can place buttons at the start, center, or end of the
|
|
111
|
+
* container.
|
|
112
|
+
*/
|
|
113
|
+
ButtonGroup: PopupButtonGroup_1.PopupButtonGroup,
|
|
107
114
|
},
|
|
108
115
|
})(({ children }) => {
|
|
109
116
|
return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: children });
|
|
@@ -0,0 +1,53 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { GrowthBehavior } from '@workday/canvas-kit-react/common';
|
|
3
|
+
import { CSProps } from '@workday/canvas-kit-styling';
|
|
4
|
+
export interface PopupButtonGroupProps extends GrowthBehavior, CSProps {
|
|
5
|
+
/**
|
|
6
|
+
* The contents of the PopupButtonGroup. Can be `Button` children or any valid elements.
|
|
7
|
+
*/
|
|
8
|
+
children?: React.ReactNode;
|
|
9
|
+
/**
|
|
10
|
+
* The position of elements within the PopupButtonGroup. Can be `start`, `center`, or `end`.
|
|
11
|
+
* @default 'end'
|
|
12
|
+
*/
|
|
13
|
+
position?: 'start' | 'center' | 'end';
|
|
14
|
+
}
|
|
15
|
+
export declare const popupButtonGroupStencil: import("@workday/canvas-kit-styling").Stencil<{
|
|
16
|
+
position: {
|
|
17
|
+
start: {
|
|
18
|
+
justifyContent: string;
|
|
19
|
+
};
|
|
20
|
+
center: {
|
|
21
|
+
justifyContent: string;
|
|
22
|
+
};
|
|
23
|
+
end: {
|
|
24
|
+
justifyContent: string;
|
|
25
|
+
};
|
|
26
|
+
};
|
|
27
|
+
grow: {
|
|
28
|
+
true: {
|
|
29
|
+
'& button': {
|
|
30
|
+
width: string;
|
|
31
|
+
};
|
|
32
|
+
};
|
|
33
|
+
};
|
|
34
|
+
}, {}, {}, never, never>;
|
|
35
|
+
export declare const PopupButtonGroup: import("@workday/canvas-kit-react/common").ElementComponentM<"div", PopupButtonGroupProps, {
|
|
36
|
+
state: {
|
|
37
|
+
stackRef: React.RefObject<HTMLDivElement>;
|
|
38
|
+
targetRef: React.RefObject<HTMLButtonElement>;
|
|
39
|
+
initialFocusRef: React.RefObject<any> | undefined;
|
|
40
|
+
returnFocusRef: React.RefObject<any> | undefined;
|
|
41
|
+
placement: import("@popperjs/core").Placement;
|
|
42
|
+
id: string;
|
|
43
|
+
visibility: "hidden" | "visible";
|
|
44
|
+
};
|
|
45
|
+
events: {
|
|
46
|
+
updatePlacement(data: {
|
|
47
|
+
placement: import("@popperjs/core").Placement;
|
|
48
|
+
}): void;
|
|
49
|
+
show(event?: Event | React.SyntheticEvent<Element, Event> | undefined): void;
|
|
50
|
+
hide(event?: Event | React.SyntheticEvent<Element, Event> | undefined): void;
|
|
51
|
+
};
|
|
52
|
+
}>;
|
|
53
|
+
//# sourceMappingURL=PopupButtonGroup.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"PopupButtonGroup.d.ts","sourceRoot":"","sources":["../../../../popup/lib/PopupButtonGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAC,cAAc,EAAqB,MAAM,kCAAkC,CAAC;AACpF,OAAO,EAAC,OAAO,EAA8B,MAAM,6BAA6B,CAAC;AAKjF,MAAM,WAAW,qBAAsB,SAAQ,cAAc,EAAE,OAAO;IACpE;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAC;CACvC;AAED,eAAO,MAAM,uBAAuB;;;;;;;;;;;;;;;;;;;wBA4BlC,CAAC;AAEH,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;EAS3B,CAAC"}
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.PopupButtonGroup = exports.popupButtonGroupStencil = void 0;
|
|
4
|
+
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
5
|
+
const common_1 = require("@workday/canvas-kit-react/common");
|
|
6
|
+
const canvas_kit_styling_1 = require("@workday/canvas-kit-styling");
|
|
7
|
+
const canvas_tokens_web_1 = require("@workday/canvas-tokens-web");
|
|
8
|
+
const hooks_1 = require("./hooks");
|
|
9
|
+
exports.popupButtonGroupStencil = (0, canvas_kit_styling_1.createStencil)({
|
|
10
|
+
base: { name: "u628z", styles: "box-sizing:border-box;display:flex;gap:var(--cnvs-sys-gap-sm, var(--cnvs-sys-space-x2, 0.5rem));@media screen and (max-width: 768px){flex-direction:column;}" },
|
|
11
|
+
modifiers: {
|
|
12
|
+
position: {
|
|
13
|
+
start: { name: "461870", styles: "justify-content:flex-start;" },
|
|
14
|
+
center: { name: "3xs59f", styles: "justify-content:center;" },
|
|
15
|
+
end: { name: "r67bx", styles: "justify-content:flex-end;" }
|
|
16
|
+
},
|
|
17
|
+
grow: {
|
|
18
|
+
true: { name: "1p9ysq", styles: "& button{width:100%;}" }
|
|
19
|
+
}
|
|
20
|
+
}
|
|
21
|
+
}, "popup-button-group-1d7c77");
|
|
22
|
+
exports.PopupButtonGroup = (0, common_1.createSubcomponent)('div')({
|
|
23
|
+
displayName: 'Popup.ButtonGroup',
|
|
24
|
+
modelHook: hooks_1.usePopupModel,
|
|
25
|
+
})(({ children, position = 'end', grow, ...elemProps }, Element) => {
|
|
26
|
+
return ((0, jsx_runtime_1.jsx)(Element, { ...(0, canvas_kit_styling_1.handleCsProp)(elemProps, (0, exports.popupButtonGroupStencil)({ position, grow })), children: children }));
|
|
27
|
+
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PopupCard.d.ts","sourceRoot":"","sources":["../../../../popup/lib/PopupCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAC,IAAI,EAAC,MAAM,gCAAgC,CAAC;AACpD,OAAO,EACL,YAAY,EAGb,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAC,cAAc,EAAc,MAAM,kCAAkC,CAAC;AAc7E,MAAM,MAAM,eAAe,GAAG,YAAY,CAAC,OAAO,IAAI,EAAE,KAAK,CAAC,GAAG,cAAc,CAAC;AAChF,MAAM,WAAW,cAAe,SAAQ,eAAe;IACrD,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AA6DD,eAAO,MAAM,gBAAgB;;;;;;;;
|
|
1
|
+
{"version":3,"file":"PopupCard.d.ts","sourceRoot":"","sources":["../../../../popup/lib/PopupCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAC,IAAI,EAAC,MAAM,gCAAgC,CAAC;AACpD,OAAO,EACL,YAAY,EAGb,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAC,cAAc,EAAc,MAAM,kCAAkC,CAAC;AAc7E,MAAM,MAAM,eAAe,GAAG,YAAY,CAAC,OAAO,IAAI,EAAE,KAAK,CAAC,GAAG,cAAc,CAAC;AAChF,MAAM,WAAW,cAAe,SAAQ,eAAe;IACrD,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AA6DD,eAAO,MAAM,gBAAgB;;;;;;;;gBAkC3B,CAAC;AAEH,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;EA2BpB,CAAC"}
|
|
@@ -84,7 +84,7 @@ exports.popupCardStencil = (0, canvas_kit_styling_1.createStencil)({
|
|
|
84
84
|
transformOriginHorizontal: '',
|
|
85
85
|
transformOriginVertical: '',
|
|
86
86
|
},
|
|
87
|
-
base: { name: "
|
|
87
|
+
base: { name: "1t20fc", styles: "box-sizing:border-box;font-family:var(--cnvs-sys-font-family-default);font-weight:var(--cnvs-sys-font-weight-normal);font-size:var(--cnvs-sys-font-size-subtext-lg, var(--cnvs-sys-font-size-subtext-large, 0.875rem));line-height:var(--cnvs-sys-line-height-subtext-lg, var(--cnvs-sys-line-height-subtext-large, 1.25rem));color:var(--cnvs-sys-color-fg-default);position:relative;max-width:calc(100vw - var(--cnvs-sys-size-sm, var(--cnvs-sys-space-x8, 2rem)));gap:var(--cnvs-sys-gap-lg, var(--cnvs-sys-space-x6, 1.5rem));box-shadow:var(--cnvs-sys-depth-3);min-height:0;padding:var(--cnvs-sys-padding-xl, var(--cnvs-sys-space-x6, 1.5rem));border-radius:var(--cnvs-sys-shape-xxxl, 2rem);max-height:var(--maxHeight-popup-card-b9f0ce);overflow-y:auto;animation-name:animation-29kkhp;animation-duration:150ms;animation-timing-function:ease-out;transform-origin:var(--transformOriginVertical-popup-card-b9f0ce) var(--transformOriginHorizontal-popup-card-b9f0ce);.wd-no-animation &{animation:none;}@media screen and (max-width: 768px){transform-origin:bottom center;padding:var(--cnvs-sys-padding-lg, var(--cnvs-sys-space-x5, 1.25rem));}" }
|
|
88
88
|
}, "popup-card-b9f0ce");
|
|
89
89
|
exports.PopupCard = (0, common_1.createSubcomponent)('div')({
|
|
90
90
|
displayName: 'Popup.Card',
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Toast.d.ts","sourceRoot":"","sources":["../../../../toast/lib/Toast.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAC,YAAY,EAAkB,MAAM,kCAAkC,CAAC;AAE/E,OAAO,EAAC,KAAK,EAAC,MAAM,iCAAiC,CAAC;AAWtD,MAAM,WAAW,UAAW,SAAQ,IAAI,CAAC,YAAY,CAAC,OAAO,KAAK,CAAC,IAAI,EAAE,KAAK,CAAC,EAAE,OAAO,CAAC;CAAG;
|
|
1
|
+
{"version":3,"file":"Toast.d.ts","sourceRoot":"","sources":["../../../../toast/lib/Toast.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAC,YAAY,EAAkB,MAAM,kCAAkC,CAAC;AAE/E,OAAO,EAAC,KAAK,EAAC,MAAM,iCAAiC,CAAC;AAWtD,MAAM,WAAW,UAAW,SAAQ,IAAI,CAAC,YAAY,CAAC,OAAO,KAAK,CAAC,IAAI,EAAE,KAAK,CAAC,EAAE,OAAO,CAAC;CAAG;AAqD5F;;;;;;;;;;;;;;;;;GAiBG;AACH,eAAO,MAAM,KAAK;;;;;;;;;;IAId;;;;;;;;;OASG;;IAEH;;OAEG;;IAEH;;OAEG;;IAEH;;;OAGG;;;;;;;;IAEH;;OAEG;;CAYL,CAAC"}
|
|
@@ -45,8 +45,8 @@ const getAriaAttributes = (mode, id) => {
|
|
|
45
45
|
}
|
|
46
46
|
};
|
|
47
47
|
const toastStencil = (0, canvas_kit_styling_1.createStencil)({
|
|
48
|
-
base: { name: "
|
|
49
|
-
}, "toast-
|
|
48
|
+
base: { name: "3qkpd3", styles: "box-sizing:border-box;display:flex;flex-direction:row;width:22.5rem;padding-block:var(--cnvs-sys-padding-sm, var(--cnvs-sys-space-x3, 0.75rem));padding-inline:var(--cnvs-sys-padding-md, var(--cnvs-sys-space-x4, 1rem)) var(--cnvs-sys-padding-xl, var(--cnvs-sys-space-x6, 1.5rem));gap:var(--cnvs-base-size-150, 0.75rem);border-radius:var(--cnvs-sys-shape-xl, var(--cnvs-sys-shape-x4, 1rem));border:0.0625rem solid var(--cnvs-sys-color-border-default);background-color:var(--cnvs-sys-color-surface-default, var(--cnvs-sys-color-bg-default, oklch(1 0 0 / 1)));box-shadow:var(--cnvs-sys-depth-3);@media (forced-colors: active){outline:0.0625rem solid CanvasText;}" }
|
|
49
|
+
}, "toast-4e8aec");
|
|
50
50
|
/**
|
|
51
51
|
* Toast is a compound component that has different modes based on its contents. The modes add the proper aria attributes for accessibility
|
|
52
52
|
*
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ToastBody.d.ts","sourceRoot":"","sources":["../../../../toast/lib/ToastBody.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,YAAY,EAAkB,MAAM,kCAAkC,CAAC;AAE/E,OAAO,EAAC,KAAK,EAAC,MAAM,iCAAiC,CAAC;
|
|
1
|
+
{"version":3,"file":"ToastBody.d.ts","sourceRoot":"","sources":["../../../../toast/lib/ToastBody.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,YAAY,EAAkB,MAAM,kCAAkC,CAAC;AAE/E,OAAO,EAAC,KAAK,EAAC,MAAM,iCAAiC,CAAC;AAGtD,MAAM,WAAW,cAAe,SAAQ,YAAY,CAAC,OAAO,KAAK,CAAC,IAAI,CAAC;CAAG;AAE1E,eAAO,MAAM,gBAAgB,iJAQ3B,CAAC;AAEH,eAAO,MAAM,SAAS,oFASpB,CAAC"}
|
|
@@ -5,10 +5,9 @@ const jsx_runtime_1 = require("react/jsx-runtime");
|
|
|
5
5
|
const common_1 = require("@workday/canvas-kit-react/common");
|
|
6
6
|
const layout_1 = require("@workday/canvas-kit-react/layout");
|
|
7
7
|
const canvas_kit_styling_1 = require("@workday/canvas-kit-styling");
|
|
8
|
-
const canvas_tokens_web_1 = require("@workday/canvas-tokens-web");
|
|
9
8
|
exports.toastBodyStencil = (0, canvas_kit_styling_1.createStencil)({
|
|
10
|
-
base: { name: "
|
|
11
|
-
}, "toast-body-
|
|
9
|
+
base: { name: "3nmn23", styles: "box-sizing:border-box;align-items:flex-start;flex-direction:column;justify-content:center;flex-grow:1;gap:0;" }
|
|
10
|
+
}, "toast-body-36e90e");
|
|
12
11
|
exports.ToastBody = (0, common_1.createComponent)('div')({
|
|
13
12
|
displayName: 'Toast.Body',
|
|
14
13
|
Component: ({ children, ...elemProps }, ref, Element) => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ToastCloseIcon.d.ts","sourceRoot":"","sources":["../../../../toast/lib/ToastCloseIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,YAAY,EAAkB,MAAM,kCAAkC,CAAC;AAE/E,OAAO,EAAC,KAAK,EAAC,MAAM,iCAAiC,CAAC;
|
|
1
|
+
{"version":3,"file":"ToastCloseIcon.d.ts","sourceRoot":"","sources":["../../../../toast/lib/ToastCloseIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,YAAY,EAAkB,MAAM,kCAAkC,CAAC;AAE/E,OAAO,EAAC,KAAK,EAAC,MAAM,iCAAiC,CAAC;AAItD,MAAM,WAAW,mBAAoB,SAAQ,YAAY,CAAC,OAAO,KAAK,CAAC,SAAS,EAAE,KAAK,CAAC;CAAG;AAE3F,eAAO,MAAM,qBAAqB,iJAMhC,CAAC;AAEH,eAAO,MAAM,cAAc,4FAYzB,CAAC"}
|
|
@@ -6,12 +6,13 @@ const common_1 = require("@workday/canvas-kit-react/common");
|
|
|
6
6
|
const layout_1 = require("@workday/canvas-kit-react/layout");
|
|
7
7
|
const popup_1 = require("@workday/canvas-kit-react/popup");
|
|
8
8
|
const canvas_kit_styling_1 = require("@workday/canvas-kit-styling");
|
|
9
|
+
const canvas_tokens_web_1 = require("@workday/canvas-tokens-web");
|
|
9
10
|
exports.toastCloseIconStencil = (0, canvas_kit_styling_1.createStencil)({
|
|
10
|
-
base: { name: "
|
|
11
|
-
}, "toast-close-icon-
|
|
11
|
+
base: { name: "2ifk0o", styles: "box-sizing:border-box;position:absolute;inset-block-start:var(--cnvs-base-size-50, 0.25rem);inset-inline-end:var(--cnvs-base-size-50, 0.25rem);" }
|
|
12
|
+
}, "toast-close-icon-05fbc5");
|
|
12
13
|
exports.ToastCloseIcon = (0, common_1.createComponent)('button')({
|
|
13
14
|
displayName: 'Toast.CloseIcon',
|
|
14
15
|
Component: (elemProps, ref, Element) => {
|
|
15
|
-
return ((0, jsx_runtime_1.jsx)(popup_1.Popup.CloseIcon, { as: Element, ref: ref, size: "
|
|
16
|
+
return ((0, jsx_runtime_1.jsx)(popup_1.Popup.CloseIcon, { as: Element, ref: ref, size: "extraSmall", ...(0, layout_1.mergeStyles)(elemProps, (0, exports.toastCloseIconStencil)()) }));
|
|
16
17
|
},
|
|
17
18
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ToastIcon.d.ts","sourceRoot":"","sources":["../../../../toast/lib/ToastIcon.tsx"],"names":[],"mappings":"AACA,OAAO,EAAa,eAAe,EAAC,MAAM,gCAAgC,CAAC;AAI3E,MAAM,WAAW,cAAe,SAAQ,IAAI,CAAC,eAAe,EAAE,YAAY,CAAC;CAAG;AAE9E,eAAO,MAAM,gBAAgB,
|
|
1
|
+
{"version":3,"file":"ToastIcon.d.ts","sourceRoot":"","sources":["../../../../toast/lib/ToastIcon.tsx"],"names":[],"mappings":"AACA,OAAO,EAAa,eAAe,EAAC,MAAM,gCAAgC,CAAC;AAI3E,MAAM,WAAW,cAAe,SAAQ,IAAI,CAAC,eAAe,EAAE,YAAY,CAAC;CAAG;AAE9E,eAAO,MAAM,gBAAgB,iJAI3B,CAAC;AAEH,eAAO,MAAM,SAAS,oFAYpB,CAAC"}
|
|
@@ -7,11 +7,11 @@ const icon_1 = require("@workday/canvas-kit-react/icon");
|
|
|
7
7
|
const canvas_kit_styling_1 = require("@workday/canvas-kit-styling");
|
|
8
8
|
const canvas_tokens_web_1 = require("@workday/canvas-tokens-web");
|
|
9
9
|
exports.toastIconStencil = (0, canvas_kit_styling_1.createStencil)({
|
|
10
|
-
base: { name: "
|
|
11
|
-
}, "toast-icon-
|
|
10
|
+
base: { name: "19wdy9", styles: "box-sizing:border-box;align-self:start;" }
|
|
11
|
+
}, "toast-icon-7830d1");
|
|
12
12
|
exports.ToastIcon = (0, common_1.createComponent)('div')({
|
|
13
13
|
displayName: 'Toast.Icon',
|
|
14
14
|
Component: (elemProps, ref, Element) => {
|
|
15
|
-
return (0, jsx_runtime_1.jsx)(icon_1.SystemIcon, { ref: ref, as: Element, ...(0, canvas_kit_styling_1.handleCsProp)(elemProps, (0, exports.toastIconStencil)()) });
|
|
15
|
+
return ((0, jsx_runtime_1.jsx)(icon_1.SystemIcon, { ref: ref, as: Element, size: canvas_tokens_web_1.component.legacy.systemIcon.size.md, ...(0, canvas_kit_styling_1.handleCsProp)(elemProps, (0, exports.toastIconStencil)()) }));
|
|
16
16
|
},
|
|
17
17
|
});
|
|
@@ -20,10 +20,7 @@ export interface TooltipContainerProps extends React.HTMLAttributes<HTMLDivEleme
|
|
|
20
20
|
export declare const tooltipContainerStencil: import("@workday/canvas-kit-styling").Stencil<{
|
|
21
21
|
elementHasFocus: {
|
|
22
22
|
true: {
|
|
23
|
-
|
|
24
|
-
'&:before': {
|
|
25
|
-
margin: "var(--cnvs-base-size-75, 0.375rem)";
|
|
26
|
-
};
|
|
23
|
+
margin: string;
|
|
27
24
|
};
|
|
28
25
|
};
|
|
29
26
|
}, {}, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TooltipContainer.d.ts","sourceRoot":"","sources":["../../../../tooltip/lib/TooltipContainer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EACL,eAAe,EAGhB,MAAM,kCAAkC,CAAC;AAK1C,MAAM,WAAW,qBAAsB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IACjF;;;OAGG;IACH,eAAe,CAAC,EAAE,eAAe,GAAG,IAAI,CAAC;IACzC;;;OAGG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ;;;OAGG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B;AAuBD,eAAO,MAAM,uBAAuB
|
|
1
|
+
{"version":3,"file":"TooltipContainer.d.ts","sourceRoot":"","sources":["../../../../tooltip/lib/TooltipContainer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EACL,eAAe,EAGhB,MAAM,kCAAkC,CAAC;AAK1C,MAAM,WAAW,qBAAsB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IACjF;;;OAGG;IACH,eAAe,CAAC,EAAE,eAAe,GAAG,IAAI,CAAC;IACzC;;;OAGG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ;;;OAGG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B;AAuBD,eAAO,MAAM,uBAAuB;;;;;;;;;gBAkElC,CAAC;AAEH,eAAO,MAAM,gBAAgB,2FA4B3B,CAAC"}
|
|
@@ -20,10 +20,10 @@ exports.tooltipContainerStencil = (0, canvas_kit_styling_1.createStencil)({
|
|
|
20
20
|
tooltipTransformOriginHorizontal: '',
|
|
21
21
|
tooltipTransformOriginVertical: '',
|
|
22
22
|
},
|
|
23
|
-
base: { name: "
|
|
23
|
+
base: { name: "259blp", styles: "box-sizing:border-box;font-family:var(--cnvs-sys-font-family-default, \"Roboto\");font-weight:var(--cnvs-sys-font-weight-normal, 400);line-height:var(--cnvs-sys-line-height-subtext-lg, 1.25rem);font-size:var(--cnvs-sys-font-size-subtext-lg, 0.875rem);letter-spacing:var(--cnvs-sys-letter-spacing-subtext-lg, 0.015rem);display:inline-flex;position:relative;padding:0.375rem var(--cnvs-sys-padding-sm, var(--cnvs-sys-space-x3, 0.75rem));color:var(--cnvs-sys-color-fg-default);animation-name:animation-3s4los;animation-duration:150ms;animation-timing-function:ease-out;transform-origin:var(--tooltipTransformOriginVertical-tooltip-container-0d74d6) var(--tooltipTransformOriginHorizontal-tooltip-container-0d74d6);margin:var(--cnvs-sys-gap-xs, var(--cnvs-sys-space-x1, 0.25rem));a{color:var(--cnvs-sys-color-fg-default);text-decoration:underline;}&:before{content:\"\";border-radius:var(--cnvs-sys-shape-full, var(--cnvs-sys-shape-round, 65rem));border:0.0625rem solid var(--cnvs-sys-color-border-default);z-index:-1;margin:0;background-color:var(--cnvs-sys-color-surface-default, var(--cnvs-sys-color-bg-default, oklch(1 0 0 / 1)));position:absolute;top:0;left:0;right:0;bottom:0;box-shadow:var(--cnvs-sys-depth-2);}[data-popper-reference-hidden] &{visibility:hidden;pointer-events:none;}[data-popper-placement=\"top-start\"] &, [data-popper-placement=\"bottom-start\"] &{left:calc(var(--cnvs-base-size-50, 0.25rem) * -1);}[data-popper-placement=\"top-end\"] &, [data-popper-placement=\"bottom-end\"] &{right:calc(var(--cnvs-base-size-50, 0.25rem) * -1);}[data-popper-placement=\"left-start\"] &, [data-popper-placement=\"right-start\"] &{top:calc(var(--cnvs-base-size-50, 0.25rem) * -1);}[data-popper-placement=\"left-end\"] &, [data-popper-placement=\"right-end\"] &{bottom:calc(var(--cnvs-base-size-50, 0.25rem) * -1);}@media (forced-colors: active){outline:0.0625rem solid CanvasText;}" },
|
|
24
24
|
modifiers: {
|
|
25
25
|
elementHasFocus: {
|
|
26
|
-
true: { name: "
|
|
26
|
+
true: { name: "ak2vn", styles: "margin:0.375rem;" }
|
|
27
27
|
}
|
|
28
28
|
}
|
|
29
29
|
}, "tooltip-container-0d74d6");
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CheckboxContainer.d.ts","sourceRoot":"","sources":["../../../../checkbox/lib/CheckboxContainer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAC,OAAO,EAA8B,MAAM,6BAA6B,CAAC;AAGjF,UAAU,sBAAuB,SAAQ,OAAO;IAC9C,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,SAAS,CAAC;CACrB;
|
|
1
|
+
{"version":3,"file":"CheckboxContainer.d.ts","sourceRoot":"","sources":["../../../../checkbox/lib/CheckboxContainer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAC,OAAO,EAA8B,MAAM,6BAA6B,CAAC;AAGjF,UAAU,sBAAuB,SAAQ,OAAO;IAC9C,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,SAAS,CAAC;CACrB;AAwCD,eAAO,MAAM,iBAAiB,4FAoB5B,CAAC"}
|
|
@@ -10,7 +10,7 @@ const checkboxContainerStencil = createStencil({
|
|
|
10
10
|
base: { name: "klclr", styles: "box-sizing:border-box;display:flex;align-items:center;min-height:var(--cnvs-sys-size-xxxs, var(--cnvs-sys-space-x4, 1rem));position:relative;&>div{display:flex;height:var(--cnvs-sys-size-xxxs, var(--cnvs-sys-space-x4, 1rem));min-width:var(--cnvs-sys-size-xxxs, var(--cnvs-sys-space-x4, 1rem));align-self:flex-start;position:relative;}[data-part=\"checkbox-container-label\"]{padding-inline-start:var(--cnvs-sys-padding-xs, var(--cnvs-sys-space-x2, 0.5rem));cursor:pointer;margin-block-start:calc(0.125rem * -1);}" },
|
|
11
11
|
modifiers: {
|
|
12
12
|
disabled: {
|
|
13
|
-
true: { name: "
|
|
13
|
+
true: { name: "bcjzk", styles: "[data-part=\"checkbox-container-label\"]{cursor:default;}" }
|
|
14
14
|
}
|
|
15
15
|
}
|
|
16
16
|
}, "checkbox-container-bafc3c");
|
|
@@ -209,7 +209,6 @@ export declare const useComboboxCard: import("@workday/canvas-kit-react/common")
|
|
|
209
209
|
}, {
|
|
210
210
|
readonly minWidth: number;
|
|
211
211
|
}>;
|
|
212
|
-
export declare const comboboxCardStencil: import("@workday/canvas-kit-styling").Stencil<import("@workday/canvas-kit-styling").StencilModifierConfig<{}, {}, never>, {}, {}, never, never>;
|
|
213
212
|
export declare const ComboboxCard: import("@workday/canvas-kit-react/common").ElementComponentM<"div", ComboboxCardProps, {
|
|
214
213
|
state: {
|
|
215
214
|
stackRef: import("react").RefObject<HTMLDivElement>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ComboboxCard.d.ts","sourceRoot":"","sources":["../../../../combobox/lib/ComboboxCard.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,YAAY,EAGb,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAC,IAAI,EAAC,MAAM,gCAAgC,CAAC;
|
|
1
|
+
{"version":3,"file":"ComboboxCard.d.ts","sourceRoot":"","sources":["../../../../combobox/lib/ComboboxCard.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,YAAY,EAGb,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAC,IAAI,EAAC,MAAM,gCAAgC,CAAC;AAKpD,MAAM,WAAW,iBAAkB,SAAQ,YAAY,CAAC,OAAO,IAAI,CAAC,IAAI,CAAC;CAAG;AAE5E;;;GAGG;AACH,eAAO,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAI1B,CAAC;AAEH,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EASvB,CAAC"}
|
|
@@ -1,8 +1,7 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
2
|
import { createElemPropsHook, createSubcomponent, } from '@workday/canvas-kit-react/common';
|
|
3
3
|
import { Menu } from '@workday/canvas-kit-react/menu';
|
|
4
|
-
import {
|
|
5
|
-
import { system } from '@workday/canvas-tokens-web';
|
|
4
|
+
import { handleCsProp } from '@workday/canvas-kit-styling';
|
|
6
5
|
import { useComboboxModel } from './hooks/useComboboxModel';
|
|
7
6
|
/**
|
|
8
7
|
* This hook sets the `minWidth` style attribute to match the width of the
|
|
@@ -13,12 +12,9 @@ export const useComboboxCard = createElemPropsHook(useComboboxModel)(model => {
|
|
|
13
12
|
minWidth: model.state.width,
|
|
14
13
|
};
|
|
15
14
|
});
|
|
16
|
-
export const comboboxCardStencil = createStencil({
|
|
17
|
-
base: { name: "3gllpz", styles: "box-sizing:border-box;& :where([data-part=\"list-box-container\"]){border-radius:var(--cnvs-sys-shape-xxl, var(--cnvs-sys-shape-x6, 1.5rem));}" }
|
|
18
|
-
}, "combobox-card-97127b");
|
|
19
15
|
export const ComboboxCard = createSubcomponent('div')({
|
|
20
16
|
modelHook: useComboboxModel,
|
|
21
17
|
elemPropsHook: useComboboxCard,
|
|
22
18
|
})(({ children, ...elemProps }, Element) => {
|
|
23
|
-
return (_jsx(Menu.Card, { as: Element, ...handleCsProp(elemProps
|
|
19
|
+
return (_jsx(Menu.Card, { as: Element, ...handleCsProp(elemProps), children: children }));
|
|
24
20
|
});
|
|
@@ -313,5 +313,28 @@ export declare const Dialog: import("@workday/canvas-kit-react/common").Componen
|
|
|
313
313
|
hide(event?: Event | React.SyntheticEvent<Element, Event> | undefined): void;
|
|
314
314
|
};
|
|
315
315
|
}>;
|
|
316
|
+
/**
|
|
317
|
+
* A `Dialog.ButtonGroup` component styled with {@link popupButtonGroupStencil}. It is used to
|
|
318
|
+
* group buttons within a dialog and can place buttons at the start, center, or end of the
|
|
319
|
+
* container.
|
|
320
|
+
*/
|
|
321
|
+
ButtonGroup: import("@workday/canvas-kit-react/common").ElementComponentM<"div", import("../../popup/lib/PopupButtonGroup").PopupButtonGroupProps, {
|
|
322
|
+
state: {
|
|
323
|
+
stackRef: React.RefObject<HTMLDivElement>;
|
|
324
|
+
targetRef: React.RefObject<HTMLButtonElement>;
|
|
325
|
+
initialFocusRef: React.RefObject<any> | undefined;
|
|
326
|
+
returnFocusRef: React.RefObject<any> | undefined;
|
|
327
|
+
placement: import("@popperjs/core").Placement;
|
|
328
|
+
id: string;
|
|
329
|
+
visibility: "hidden" | "visible";
|
|
330
|
+
};
|
|
331
|
+
events: {
|
|
332
|
+
updatePlacement(data: {
|
|
333
|
+
placement: import("@popperjs/core").Placement;
|
|
334
|
+
}): void;
|
|
335
|
+
show(event?: Event | React.SyntheticEvent<Element, Event> | undefined): void;
|
|
336
|
+
hide(event?: Event | React.SyntheticEvent<Element, Event> | undefined): void;
|
|
337
|
+
};
|
|
338
|
+
}>;
|
|
316
339
|
};
|
|
317
340
|
//# sourceMappingURL=Dialog.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Dialog.d.ts","sourceRoot":"","sources":["../../../../dialog/lib/Dialog.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAS1B,MAAM,WAAW,WAAW;IAC1B;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED;;;;;;GAMG;AACH,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAIf;;;OAGG;;;;;;;;;;;;;;;;;;;IAEH;;;;OAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAEH;;;OAGG;;;;;;;;;;;;;;;;;;;IAEH;;;;;;;;;;;;;;;;;;;;;;;;;;;;OA4BG;;;;;;;;;;;;;;;;;;;IAEH;;;;;OAKG;;;;;;;;;;;;;;;;;;;IAEH;;;OAGG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAGH;;;;;OAKG;;;;;;;;;;;;;;;;;;;CAKL,CAAC"}
|
|
1
|
+
{"version":3,"file":"Dialog.d.ts","sourceRoot":"","sources":["../../../../dialog/lib/Dialog.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAS1B,MAAM,WAAW,WAAW;IAC1B;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED;;;;;;GAMG;AACH,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAIf;;;OAGG;;;;;;;;;;;;;;;;;;;IAEH;;;;OAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAEH;;;OAGG;;;;;;;;;;;;;;;;;;;IAEH;;;;;;;;;;;;;;;;;;;;;;;;;;;;OA4BG;;;;;;;;;;;;;;;;;;;IAEH;;;;;OAKG;;;;;;;;;;;;;;;;;;;IAEH;;;OAGG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAGH;;;;;OAKG;;;;;;;;;;;;;;;;;;;IAEH;;;;OAIG;;;;;;;;;;;;;;;;;;;CAKL,CAAC"}
|