@kaizen/components 0.0.0-canary-package-bundler-v2-20241113055116 → 0.0.0-canary-link-button-wip-canary-20241121010628
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/codemods/README.md +16 -1
- package/codemods/upgradeIconV1/getNewIconPropsFromOldIconName.ts +9 -9
- package/dist/cjs/EmptyState/EmptyState.cjs +15 -17
- package/dist/cjs/EmptyState/EmptyState.module.css.cjs +20 -0
- package/dist/cjs/Filter/FilterBar/FilterBar.cjs +1 -3
- package/dist/cjs/Filter/FilterBar/FilterBar.module.css.cjs +0 -1
- package/dist/cjs/GuidanceBlock/GuidanceBlock.cjs +1 -1
- package/dist/cjs/GuidanceBlock/GuidanceBlock.module.css.cjs +28 -0
- package/dist/cjs/__actions__/Button/v3/Button.cjs +43 -8
- package/dist/cjs/__actions__/Button/v3/Button.module.css.cjs +21 -0
- package/dist/cjs/__actions__/Button/v3/subcomponents/ButtonContent/ButtonContent.cjs +37 -0
- package/dist/cjs/__actions__/Button/v3/subcomponents/ButtonContent/ButtonContent.module.css.cjs +9 -0
- package/dist/cjs/__actions__/Button/v3/subcomponents/PendingContent/PendingContent.cjs +35 -0
- package/dist/cjs/__actions__/Button/v3/subcomponents/PendingContent/PendingContent.module.css.cjs +8 -0
- package/dist/cjs/__overlays__/Tooltip/v3/Tooltip.cjs +2 -2
- package/dist/esm/Calendar/CalendarPopover/CalendarPopover.mjs +1 -1
- package/dist/esm/EmptyState/EmptyState.mjs +16 -18
- package/dist/esm/EmptyState/EmptyState.module.css.mjs +18 -0
- package/dist/esm/Filter/FilterBar/FilterBar.mjs +1 -3
- package/dist/esm/Filter/FilterBar/FilterBar.module.css.mjs +0 -1
- package/dist/esm/Filter/FilterMultiSelect/subcomponents/ListBox/ListBox.mjs +1 -1
- package/dist/esm/GuidanceBlock/GuidanceBlock.mjs +1 -1
- package/dist/esm/GuidanceBlock/GuidanceBlock.module.css.mjs +26 -0
- package/dist/esm/MultiSelect/subcomponents/Popover/Popover.mjs +1 -1
- package/dist/esm/RichTextEditor/RichTextEditor/RichTextEditor.mjs +1 -1
- package/dist/esm/RichTextEditor/RichTextEditor/schema.mjs +1 -1
- package/dist/esm/RichTextEditor/utils/schema/nodes.mjs +1 -1
- package/dist/esm/TimeField/TimeField.mjs +1 -1
- package/dist/esm/__actions__/Button/v3/Button.mjs +44 -9
- package/dist/esm/__actions__/Button/v3/Button.module.css.mjs +19 -0
- package/dist/esm/__actions__/Button/v3/subcomponents/ButtonContent/ButtonContent.mjs +28 -0
- package/dist/esm/__actions__/Button/v3/subcomponents/ButtonContent/ButtonContent.module.css.mjs +7 -0
- package/dist/esm/__actions__/Button/v3/subcomponents/PendingContent/PendingContent.mjs +26 -0
- package/dist/esm/__actions__/Button/v3/subcomponents/PendingContent/PendingContent.module.css.mjs +6 -0
- package/dist/esm/__overlays__/Tooltip/v1/Tooltip.mjs +1 -1
- package/dist/esm/__overlays__/Tooltip/v3/Tooltip.mjs +1 -1
- package/dist/styles.css +568 -488
- package/dist/types/EmptyState/EmptyState.d.ts +2 -1
- package/dist/types/__actions__/Button/v3/Button.d.ts +17 -4
- package/dist/types/__actions__/Button/v3/index.d.ts +1 -0
- package/dist/types/__actions__/Button/v3/subcomponents/ButtonContent/ButtonContent.d.ts +11 -0
- package/dist/types/__actions__/Button/v3/subcomponents/ButtonContent/index.d.ts +1 -0
- package/dist/types/__actions__/Button/v3/subcomponents/PendingContent/PendingContent.d.ts +5 -0
- package/dist/types/__actions__/Button/v3/subcomponents/PendingContent/index.d.ts +1 -0
- package/dist/types/__actions__/Button/v3/subcomponents/index.d.ts +2 -0
- package/dist/types/__actions__/Button/v3/types.d.ts +21 -0
- package/dist/types/__actions__/LinkButton/index.d.ts +1 -0
- package/dist/types/__actions__/LinkButton/v3/LinkButton.d.ts +11 -0
- package/dist/types/__actions__/LinkButton/v3/index.d.ts +1 -0
- package/package.json +8 -8
- package/src/EmptyState/EmptyState.module.css +114 -0
- package/src/EmptyState/EmptyState.tsx +18 -20
- package/src/EmptyState/_docs/EmptyState.stickersheet.stories.tsx +55 -39
- package/src/Filter/FilterBar/FilterBar.module.css +0 -4
- package/src/Filter/FilterBar/FilterBar.tsx +12 -14
- package/src/GuidanceBlock/{GuidanceBlock.module.scss → GuidanceBlock.module.css} +60 -114
- package/src/GuidanceBlock/GuidanceBlock.tsx +1 -1
- package/src/__actions__/Button/v3/Button.module.css +235 -0
- package/src/__actions__/Button/v3/Button.tsx +95 -29
- package/src/__actions__/Button/v3/_docs/Button--api-specification.mdx +151 -0
- package/src/__actions__/Button/v3/_docs/Button--usage-guidelines.mdx +30 -0
- package/src/__actions__/Button/v3/_docs/Button.docs.stories.tsx +112 -50
- package/src/__actions__/Button/v3/_docs/Button.spec.stories.tsx +80 -120
- package/src/__actions__/Button/v3/_docs/Button.stickersheet.stories.tsx +183 -81
- package/src/__actions__/Button/v3/index.ts +1 -0
- package/src/__actions__/Button/v3/subcomponents/ButtonContent/ButtonContent.module.css +19 -0
- package/src/__actions__/Button/v3/subcomponents/ButtonContent/ButtonContent.tsx +40 -0
- package/src/__actions__/Button/v3/subcomponents/ButtonContent/index.ts +1 -0
- package/src/__actions__/Button/v3/subcomponents/PendingContent/PendingContent.module.css +16 -0
- package/src/__actions__/Button/v3/subcomponents/PendingContent/PendingContent.tsx +28 -0
- package/src/__actions__/Button/v3/subcomponents/PendingContent/index.ts +1 -0
- package/src/__actions__/Button/v3/subcomponents/index.ts +2 -0
- package/src/__actions__/Button/v3/types.ts +25 -0
- package/src/__actions__/LinkButton/index.ts +1 -0
- package/src/__actions__/LinkButton/v3/LinkButton.module.css +4 -0
- package/src/__actions__/LinkButton/v3/LinkButton.tsx +71 -0
- package/src/__actions__/LinkButton/v3/_docs/LinkButton--api-specification.mdx +200 -0
- package/src/__actions__/LinkButton/v3/_docs/LinkButton.doc.stories.tsx +131 -0
- package/src/__actions__/LinkButton/v3/_docs/LinkButton.spec.stories.tsx +100 -0
- package/src/__actions__/LinkButton/v3/index.ts +1 -0
- package/src/__actions__/Menu/v3/_docs/Menu.docs.stories.tsx +54 -18
- package/src/__actions__/Menu/v3/_docs/Menu.spec.stories.tsx +30 -10
- package/src/__actions__/Menu/v3/_docs/Menu.stories.tsx +12 -4
- package/src/__future__/Icon/_docs/Icon.docs.stories.tsx +7 -7
- package/src/__overlays__/Tooltip/v3/Tooltip.tsx +1 -1
- package/src/__overlays__/Tooltip/v3/_docs/Tooltip.spec.stories.tsx +2 -0
- package/dist/cjs/EmptyState/EmptyState.module.scss.cjs +0 -23
- package/dist/cjs/GuidanceBlock/GuidanceBlock.module.scss.cjs +0 -33
- package/dist/cjs/__actions__/Button/v3/Button.module.scss.cjs +0 -9
- package/dist/esm/EmptyState/EmptyState.module.scss.mjs +0 -21
- package/dist/esm/GuidanceBlock/GuidanceBlock.module.scss.mjs +0 -31
- package/dist/esm/__actions__/Button/v3/Button.module.scss.mjs +0 -7
- package/src/EmptyState/EmptyState.module.scss +0 -177
- package/src/EmptyState/EmptyState.spec.tsx +0 -48
- package/src/EmptyState/_mixins.scss +0 -44
- package/src/__actions__/Button/v3/Button.module.scss +0 -104
- package/src/__actions__/Button/v3/_docs/ApiSpecification.mdx +0 -173
- package/src/__actions__/Button/v3/_docs/Button.mdx +0 -41
- package/src/__actions__/Button/v3/_docs/Button.stories.tsx +0 -98
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { __rest, __assign } from 'tslib';
|
|
2
2
|
import { nodes } from 'prosemirror-schema-basic';
|
|
3
|
-
import {
|
|
3
|
+
import { listItem, bulletList, orderedList } from 'prosemirror-schema-list';
|
|
4
4
|
var getNodes = function () {
|
|
5
5
|
// We use camel case names instead of ProseMirror's snake case, so we remove any snake case properties here before spreading
|
|
6
6
|
var hardBreak = nodes.hard_break,
|
|
@@ -1,20 +1,55 @@
|
|
|
1
1
|
import { __rest, __assign } from 'tslib';
|
|
2
|
-
import React from 'react';
|
|
2
|
+
import React, { forwardRef } from 'react';
|
|
3
3
|
import { Button as Button$1 } from 'react-aria-components';
|
|
4
4
|
import { mergeClassNames } from '../../../utils/mergeClassNames.mjs';
|
|
5
|
-
import
|
|
5
|
+
import { PendingContent } from './subcomponents/PendingContent/PendingContent.mjs';
|
|
6
|
+
import { ButtonContent } from './subcomponents/ButtonContent/ButtonContent.mjs';
|
|
7
|
+
import styles from './Button.module.css.mjs';
|
|
6
8
|
import { useReversedColors } from '../../../__utilities__/ReversedColors/v3/ReversedColors.mjs';
|
|
7
|
-
var Button = function (_a) {
|
|
9
|
+
var Button = /*#__PURE__*/forwardRef(function (_a, ref) {
|
|
8
10
|
var _b = _a.variant,
|
|
9
|
-
variant = _b === void 0 ? "
|
|
10
|
-
className = _a.className,
|
|
11
|
+
variant = _b === void 0 ? "primary" : _b,
|
|
11
12
|
_c = _a.size,
|
|
12
13
|
size = _c === void 0 ? "medium" : _c,
|
|
14
|
+
className = _a.className,
|
|
13
15
|
children = _a.children,
|
|
14
|
-
|
|
16
|
+
isDisabled = _a.isDisabled,
|
|
17
|
+
_d = _a.isFullWidth,
|
|
18
|
+
isFullWidth = _d === void 0 ? false : _d,
|
|
19
|
+
icon = _a.icon,
|
|
20
|
+
iconPosition = _a.iconPosition,
|
|
21
|
+
_e = _a.hasHiddenLabel,
|
|
22
|
+
hasHiddenLabel = _e === void 0 ? false : _e,
|
|
23
|
+
isPending = _a.isPending,
|
|
24
|
+
_f = _a.hasHiddenPendingLabel,
|
|
25
|
+
propsHasHiddenPendingLabel = _f === void 0 ? false : _f,
|
|
26
|
+
pendingLabel = _a.pendingLabel,
|
|
27
|
+
restProps = __rest(_a, ["variant", "size", "className", "children", "isDisabled", "isFullWidth", "icon", "iconPosition", "hasHiddenLabel", "isPending", "hasHiddenPendingLabel", "pendingLabel"]);
|
|
15
28
|
var isReversed = useReversedColors();
|
|
29
|
+
var pendingProps = isPending ? {
|
|
30
|
+
isPending: isPending,
|
|
31
|
+
hasHiddenPendingLabel: hasHiddenLabel || propsHasHiddenPendingLabel,
|
|
32
|
+
pendingLabel: pendingLabel
|
|
33
|
+
} : {};
|
|
34
|
+
var buttonContentClass = isPending ? !hasHiddenLabel && propsHasHiddenPendingLabel ? styles.retainContentWidth : styles.hideContentWidth : undefined;
|
|
16
35
|
return /*#__PURE__*/React.createElement(Button$1, __assign({
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
36
|
+
ref: ref,
|
|
37
|
+
className: mergeClassNames(styles.button, styles[size], hasHiddenLabel && styles["".concat(size, "IconButton")], isDisabled && styles.isDisabled, isReversed ? styles["".concat(variant, "Reversed")] : styles[variant], isFullWidth && styles.fullWidth, className),
|
|
38
|
+
isDisabled: isDisabled,
|
|
39
|
+
isPending: isPending
|
|
40
|
+
}, restProps), function (racStateProps) {
|
|
41
|
+
var childIsFunction = typeof children === "function";
|
|
42
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ButtonContent, {
|
|
43
|
+
size: size,
|
|
44
|
+
icon: icon,
|
|
45
|
+
iconPosition: iconPosition,
|
|
46
|
+
hasHiddenLabel: hasHiddenLabel,
|
|
47
|
+
className: buttonContentClass
|
|
48
|
+
}, childIsFunction ? children(racStateProps) : children), /*#__PURE__*/React.createElement("span", {
|
|
49
|
+
"aria-live": "polite"
|
|
50
|
+
}, pendingProps.isPending && ( /*#__PURE__*/React.createElement(PendingContent, __assign({}, pendingProps, {
|
|
51
|
+
size: size
|
|
52
|
+
})))));
|
|
53
|
+
});
|
|
54
|
+
});
|
|
20
55
|
export { Button };
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
var styles = {
|
|
2
|
+
"button": "Button-module_button__vlUCI",
|
|
3
|
+
"fullWidth": "Button-module_fullWidth__qIkG6",
|
|
4
|
+
"small": "Button-module_small__FYPwk",
|
|
5
|
+
"medium": "Button-module_medium__4LOhQ",
|
|
6
|
+
"large": "Button-module_large__MjtVH",
|
|
7
|
+
"smallIconButton": "Button-module_smallIconButton__4gN-i",
|
|
8
|
+
"mediumIconButton": "Button-module_mediumIconButton__CEXv-",
|
|
9
|
+
"largeIconButton": "Button-module_largeIconButton__Apt33",
|
|
10
|
+
"secondary": "Button-module_secondary__Mmev0",
|
|
11
|
+
"tertiary": "Button-module_tertiary__MJjKC",
|
|
12
|
+
"primaryReversed": "Button-module_primaryReversed__m4kze",
|
|
13
|
+
"secondaryReversed": "Button-module_secondaryReversed__Q435c",
|
|
14
|
+
"tertiaryReversed": "Button-module_tertiaryReversed__Q-UqR",
|
|
15
|
+
"isDisabled": "Button-module_isDisabled__m1eE-",
|
|
16
|
+
"hideContentWidth": "Button-module_hideContentWidth__-E94d",
|
|
17
|
+
"retainContentWidth": "Button-module_retainContentWidth__b4IEC"
|
|
18
|
+
};
|
|
19
|
+
export { styles as default };
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import { __rest, __assign } from 'tslib';
|
|
2
|
+
import React from 'react';
|
|
3
|
+
import classnames from 'classnames';
|
|
4
|
+
import { VisuallyHidden } from '../../../../../VisuallyHidden/VisuallyHidden.mjs';
|
|
5
|
+
import styles from './ButtonContent.module.css.mjs';
|
|
6
|
+
|
|
7
|
+
/** Renders the inner content of the button, handling icon and label visibility */
|
|
8
|
+
var ButtonContent = function (_a) {
|
|
9
|
+
var children = _a.children,
|
|
10
|
+
hasHiddenLabel = _a.hasHiddenLabel,
|
|
11
|
+
_b = _a.size,
|
|
12
|
+
size = _b === void 0 ? "medium" : _b,
|
|
13
|
+
icon = _a.icon,
|
|
14
|
+
_c = _a.iconPosition,
|
|
15
|
+
iconPosition = _c === void 0 ? "start" : _c,
|
|
16
|
+
className = _a.className,
|
|
17
|
+
restProps = __rest(_a, ["children", "hasHiddenLabel", "size", "icon", "iconPosition", "className"]);
|
|
18
|
+
return /*#__PURE__*/React.createElement("span", __assign({
|
|
19
|
+
className: classnames(className, styles.buttonContent, styles[size])
|
|
20
|
+
}, restProps), icon && iconPosition === "start" && ( /*#__PURE__*/React.createElement("span", {
|
|
21
|
+
className: styles.buttonIcon
|
|
22
|
+
}, icon)), hasHiddenLabel ? ( /*#__PURE__*/React.createElement(VisuallyHidden, null, children)) : ( /*#__PURE__*/React.createElement("span", {
|
|
23
|
+
className: styles.buttonLabel
|
|
24
|
+
}, children)), icon && iconPosition === "end" && ( /*#__PURE__*/React.createElement("span", {
|
|
25
|
+
className: styles.buttonIcon
|
|
26
|
+
}, icon)));
|
|
27
|
+
};
|
|
28
|
+
export { ButtonContent };
|
package/dist/esm/__actions__/Button/v3/subcomponents/ButtonContent/ButtonContent.module.css.mjs
ADDED
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
var styles = {
|
|
2
|
+
"buttonContent": "ButtonContent-module_buttonContent__v5mHZ",
|
|
3
|
+
"large": "ButtonContent-module_large__mLOdb",
|
|
4
|
+
"buttonLabel": "ButtonContent-module_buttonLabel__T5XAq",
|
|
5
|
+
"buttonIcon": "ButtonContent-module_buttonIcon__qkAX-"
|
|
6
|
+
};
|
|
7
|
+
export { styles as default };
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import classnames from 'classnames';
|
|
3
|
+
import '../../../../../Loading/LoadingGraphic/LoadingGraphic.mjs';
|
|
4
|
+
import '../../../../../Loading/LoadingHeading/LoadingHeading.mjs';
|
|
5
|
+
import '../../../../../Loading/LoadingInput/LoadingInput.mjs';
|
|
6
|
+
import '../../../../../Loading/LoadingParagraph/LoadingParagraph.mjs';
|
|
7
|
+
import { LoadingSpinner } from '../../../../../Loading/LoadingSpinner/LoadingSpinner.mjs';
|
|
8
|
+
import { VisuallyHidden } from '../../../../../VisuallyHidden/VisuallyHidden.mjs';
|
|
9
|
+
import styles from './PendingContent.module.css.mjs';
|
|
10
|
+
|
|
11
|
+
/** Renders the pending content of the button, handling pending label visibility and spinner positioning */
|
|
12
|
+
var PendingContent = function (_a) {
|
|
13
|
+
var pendingLabel = _a.pendingLabel,
|
|
14
|
+
_b = _a.hasHiddenPendingLabel,
|
|
15
|
+
hasHiddenPendingLabel = _b === void 0 ? false : _b,
|
|
16
|
+
_c = _a.size,
|
|
17
|
+
size = _c === void 0 ? "medium" : _c;
|
|
18
|
+
return /*#__PURE__*/React.createElement("span", {
|
|
19
|
+
className: classnames(styles.pendingContent, styles[size])
|
|
20
|
+
}, hasHiddenPendingLabel ? ( /*#__PURE__*/React.createElement(VisuallyHidden, null, pendingLabel)) : ( /*#__PURE__*/React.createElement("span", null, pendingLabel)), /*#__PURE__*/React.createElement(LoadingSpinner, {
|
|
21
|
+
size: size === "small" ? "xs" : "sm",
|
|
22
|
+
accessibilityLabel: "",
|
|
23
|
+
classNameOverride: hasHiddenPendingLabel ? styles.centerSpinner : undefined
|
|
24
|
+
}));
|
|
25
|
+
};
|
|
26
|
+
export { PendingContent };
|
|
@@ -3,7 +3,7 @@ import React, { useState, useId, useRef, useEffect, cloneElement } from 'react';
|
|
|
3
3
|
import ReactDOM from 'react-dom';
|
|
4
4
|
import classnames from 'classnames';
|
|
5
5
|
import { usePopper } from 'react-popper';
|
|
6
|
-
import {
|
|
6
|
+
import { useAnimation, AnimationProvider } from './subcomponents/AppearanceAnim.mjs';
|
|
7
7
|
import { isSemanticElement } from './utils/isSemanticElement.mjs';
|
|
8
8
|
import styles from './Tooltip.module.scss.mjs';
|
|
9
9
|
var positionToPlacement = new Map([["above", "top"], ["below", "bottom"], ["left", "left"], ["right", "right"]]);
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { __rest, __assign } from 'tslib';
|
|
2
2
|
import React, { forwardRef, useContext, useState, useLayoutEffect } from 'react';
|
|
3
|
-
import { VisuallyHidden } from 'react-aria';
|
|
4
3
|
import { useContextProps, TooltipContext, TooltipTriggerStateContext, Tooltip as Tooltip$1 } from 'react-aria-components';
|
|
5
4
|
export { TooltipContext } from 'react-aria-components';
|
|
5
|
+
import { VisuallyHidden } from '../../../VisuallyHidden/VisuallyHidden.mjs';
|
|
6
6
|
import { mergeClassNames } from '../../../utils/mergeClassNames.mjs';
|
|
7
7
|
import { OverlayArrow } from './OverlayArrow.mjs';
|
|
8
8
|
import styles from './Tooltip.module.scss.mjs';
|