@kaizen/components 1.73.2 → 1.73.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.
Files changed (17) hide show
  1. package/dist/cjs/Modal/ConfirmationModal/ConfirmationModal.cjs +4 -2
  2. package/dist/cjs/Modal/ContextModal/ContextModal.cjs +4 -2
  3. package/dist/cjs/Modal/GenericModal/GenericModal.cjs +4 -2
  4. package/dist/cjs/Modal/InputEditModal/InputEditModal.cjs +4 -2
  5. package/dist/esm/Modal/ConfirmationModal/ConfirmationModal.mjs +4 -2
  6. package/dist/esm/Modal/ContextModal/ContextModal.mjs +4 -2
  7. package/dist/esm/Modal/GenericModal/GenericModal.mjs +4 -2
  8. package/dist/esm/Modal/InputEditModal/InputEditModal.mjs +4 -2
  9. package/dist/types/Modal/ConfirmationModal/ConfirmationModal.d.ts +1 -1
  10. package/dist/types/Modal/ContextModal/ContextModal.d.ts +1 -1
  11. package/dist/types/Modal/GenericModal/GenericModal.d.ts +2 -1
  12. package/dist/types/Modal/InputEditModal/InputEditModal.d.ts +1 -1
  13. package/package.json +3 -3
  14. package/src/Modal/ConfirmationModal/ConfirmationModal.tsx +2 -0
  15. package/src/Modal/ContextModal/ContextModal.tsx +2 -0
  16. package/src/Modal/GenericModal/GenericModal.tsx +3 -0
  17. package/src/Modal/InputEditModal/InputEditModal.tsx +2 -0
package/dist/cjs/Modal/ConfirmationModal/ConfirmationModal.cjs CHANGED
@@ -86,7 +86,8 @@ var ConfirmationModal = function (_a) {
86
86
  confirmWorking = _a.confirmWorking,
87
87
  propsOnDismiss = _a.onDismiss,
88
88
  children = _a.children,
89
- props = tslib.__rest(_a, ["isOpen", "isProminent", "unpadded", "mood", "variant", "title", "onConfirm", "onAfterLeave", "onAfterEnter", "confirmLabel", "dismissLabel", "confirmWorking", "onDismiss", "children"]);
89
+ className = _a.className,
90
+ props = tslib.__rest(_a, ["isOpen", "isProminent", "unpadded", "mood", "variant", "title", "onConfirm", "onAfterLeave", "onAfterEnter", "confirmLabel", "dismissLabel", "confirmWorking", "onDismiss", "children", "className"]);
90
91
  var variantName = variant !== null && variant !== undefined ? variant : mood;
91
92
  var onDismiss = confirmWorking ? undefined : propsOnDismiss;
92
93
  var footerActions = [];
@@ -112,7 +113,8 @@ var ConfirmationModal = function (_a) {
112
113
  onEscapeKeyup: onDismiss,
113
114
  onOutsideModalClick: onDismiss,
114
115
  onAfterLeave: onAfterLeave,
115
- onAfterEnter: onAfterEnter
116
+ onAfterEnter: onAfterEnter,
117
+ className: className
116
118
  }, React__default.default.createElement("div", tslib.__assign({
117
119
  className: ConfirmationModal_module.modal,
118
120
  "data-modal": true
package/dist/cjs/Modal/ContextModal/ContextModal.cjs CHANGED
@@ -44,7 +44,8 @@ var ContextModal = function (_a) {
44
44
  image = _a.image,
45
45
  secondaryLabel = _a.secondaryLabel,
46
46
  onSecondaryAction = _a.onSecondaryAction,
47
- props = tslib.__rest(_a, ["isOpen", "unpadded", "layout", "title", "onConfirm", "onDismiss", "onAfterLeave", "onAfterEnter", "confirmLabel", "confirmWorking", "renderBackground", "children", "contentHeader", "image", "secondaryLabel", "onSecondaryAction"]);
47
+ className = _a.className,
48
+ props = tslib.__rest(_a, ["isOpen", "unpadded", "layout", "title", "onConfirm", "onDismiss", "onAfterLeave", "onAfterEnter", "confirmLabel", "confirmWorking", "renderBackground", "children", "contentHeader", "image", "secondaryLabel", "onSecondaryAction", "className"]);
48
49
  var onDismiss = confirmWorking ? undefined : propsOnDismiss;
49
50
  var footerActions = [];
50
51
  var workingProps = confirmWorking ? {
@@ -71,7 +72,8 @@ var ContextModal = function (_a) {
71
72
  onEscapeKeyup: onDismiss,
72
73
  onOutsideModalClick: onDismiss,
73
74
  onAfterLeave: onAfterLeave,
74
- onAfterEnter: onAfterEnter
75
+ onAfterEnter: onAfterEnter,
76
+ className: className
75
77
  }, React__default.default.createElement("div", tslib.__assign({
76
78
  className: ContextModal_module.modal,
77
79
  "data-modal": true
package/dist/cjs/Modal/GenericModal/GenericModal.cjs CHANGED
@@ -23,7 +23,8 @@ var GenericModal = function (_a) {
23
23
  onEscapeKeyup = _a.onEscapeKeyup,
24
24
  onOutsideModalClick = _a.onOutsideModalClick,
25
25
  onAfterEnter = _a.onAfterEnter,
26
- propsOnAfterLeave = _a.onAfterLeave;
26
+ propsOnAfterLeave = _a.onAfterLeave,
27
+ className = _a.className;
27
28
  var reactId = React.useId();
28
29
  var id = propsId !== null && propsId !== undefined ? propsId : reactId;
29
30
  var labelledByID = React.useId();
@@ -119,7 +120,8 @@ var GenericModal = function (_a) {
119
120
  "data-generic-modal-transition-wrapper": true,
120
121
  onClick: function (e) {
121
122
  return e.stopPropagation();
122
- }
123
+ },
124
+ className: className
123
125
  }, React__default.default.createElement(FocusLock__default.default, {
124
126
  disabled: focusLockDisabled,
125
127
  returnFocus: true,
package/dist/cjs/Modal/InputEditModal/InputEditModal.cjs CHANGED
@@ -44,7 +44,8 @@ var InputEditModal = function (_a) {
44
44
  unpadded = _e === undefined ? false : _e,
45
45
  propsOnDismiss = _a.onDismiss,
46
46
  onAfterEnter = _a.onAfterEnter,
47
- props = tslib.__rest(_a, ["isOpen", "mood", "title", "onSubmit", "onSecondaryAction", "onAfterLeave", "localeDirection", "submitLabel", "dismissLabel", "secondaryLabel", "submitWorking", "children", "unpadded", "onDismiss", "onAfterEnter"]);
47
+ className = _a.className,
48
+ props = tslib.__rest(_a, ["isOpen", "mood", "title", "onSubmit", "onSecondaryAction", "onAfterLeave", "localeDirection", "submitLabel", "dismissLabel", "secondaryLabel", "submitWorking", "children", "unpadded", "onDismiss", "onAfterEnter", "className"]);
48
49
  var onDismiss = submitWorking ? undefined : propsOnDismiss;
49
50
  var submitAction = {
50
51
  label: submitLabel,
@@ -65,7 +66,8 @@ var InputEditModal = function (_a) {
65
66
  isOpen: isOpen,
66
67
  onEscapeKeyup: onDismiss,
67
68
  onAfterLeave: onAfterLeave,
68
- onAfterEnter: onAfterEnter
69
+ onAfterEnter: onAfterEnter,
70
+ className: className
69
71
  }, React__default.default.createElement("div", tslib.__assign({
70
72
  className: InputEditModal_module.modal,
71
73
  dir: localeDirection,
package/dist/esm/Modal/ConfirmationModal/ConfirmationModal.mjs CHANGED
@@ -78,7 +78,8 @@ const ConfirmationModal = /*#__PURE__*/function () {
78
78
  confirmWorking = _a.confirmWorking,
79
79
  propsOnDismiss = _a.onDismiss,
80
80
  children = _a.children,
81
- props = __rest(_a, ["isOpen", "isProminent", "unpadded", "mood", "variant", "title", "onConfirm", "onAfterLeave", "onAfterEnter", "confirmLabel", "dismissLabel", "confirmWorking", "onDismiss", "children"]);
81
+ className = _a.className,
82
+ props = __rest(_a, ["isOpen", "isProminent", "unpadded", "mood", "variant", "title", "onConfirm", "onAfterLeave", "onAfterEnter", "confirmLabel", "dismissLabel", "confirmWorking", "onDismiss", "children", "className"]);
82
83
  var variantName = variant !== null && variant !== undefined ? variant : mood;
83
84
  var onDismiss = confirmWorking ? undefined : propsOnDismiss;
84
85
  var footerActions = [];
@@ -104,7 +105,8 @@ const ConfirmationModal = /*#__PURE__*/function () {
104
105
  onEscapeKeyup: onDismiss,
105
106
  onOutsideModalClick: onDismiss,
106
107
  onAfterLeave: onAfterLeave,
107
- onAfterEnter: onAfterEnter
108
+ onAfterEnter: onAfterEnter,
109
+ className: className
108
110
  }, /*#__PURE__*/React.createElement("div", __assign({
109
111
  className: styles.modal,
110
112
  "data-modal": true
package/dist/esm/Modal/ContextModal/ContextModal.mjs CHANGED
@@ -36,7 +36,8 @@ const ContextModal = /*#__PURE__*/function () {
36
36
  image = _a.image,
37
37
  secondaryLabel = _a.secondaryLabel,
38
38
  onSecondaryAction = _a.onSecondaryAction,
39
- props = __rest(_a, ["isOpen", "unpadded", "layout", "title", "onConfirm", "onDismiss", "onAfterLeave", "onAfterEnter", "confirmLabel", "confirmWorking", "renderBackground", "children", "contentHeader", "image", "secondaryLabel", "onSecondaryAction"]);
39
+ className = _a.className,
40
+ props = __rest(_a, ["isOpen", "unpadded", "layout", "title", "onConfirm", "onDismiss", "onAfterLeave", "onAfterEnter", "confirmLabel", "confirmWorking", "renderBackground", "children", "contentHeader", "image", "secondaryLabel", "onSecondaryAction", "className"]);
40
41
  var onDismiss = confirmWorking ? undefined : propsOnDismiss;
41
42
  var footerActions = [];
42
43
  var workingProps = confirmWorking ? {
@@ -63,7 +64,8 @@ const ContextModal = /*#__PURE__*/function () {
63
64
  onEscapeKeyup: onDismiss,
64
65
  onOutsideModalClick: onDismiss,
65
66
  onAfterLeave: onAfterLeave,
66
- onAfterEnter: onAfterEnter
67
+ onAfterEnter: onAfterEnter,
68
+ className: className
67
69
  }, /*#__PURE__*/React.createElement("div", __assign({
68
70
  className: styles.modal,
69
71
  "data-modal": true
package/dist/esm/Modal/GenericModal/GenericModal.mjs CHANGED
@@ -15,7 +15,8 @@ const GenericModal = /*#__PURE__*/function () {
15
15
  onEscapeKeyup = _a.onEscapeKeyup,
16
16
  onOutsideModalClick = _a.onOutsideModalClick,
17
17
  onAfterEnter = _a.onAfterEnter,
18
- propsOnAfterLeave = _a.onAfterLeave;
18
+ propsOnAfterLeave = _a.onAfterLeave,
19
+ className = _a.className;
19
20
  var reactId = useId();
20
21
  var id = propsId !== null && propsId !== undefined ? propsId : reactId;
21
22
  var labelledByID = useId();
@@ -111,7 +112,8 @@ const GenericModal = /*#__PURE__*/function () {
111
112
  "data-generic-modal-transition-wrapper": true,
112
113
  onClick: function (e) {
113
114
  return e.stopPropagation();
114
- }
115
+ },
116
+ className: className
115
117
  }, /*#__PURE__*/React.createElement(FocusLock, {
116
118
  disabled: focusLockDisabled,
117
119
  returnFocus: true,
package/dist/esm/Modal/InputEditModal/InputEditModal.mjs CHANGED
@@ -36,7 +36,8 @@ const InputEditModal = /*#__PURE__*/function () {
36
36
  unpadded = _e === undefined ? false : _e,
37
37
  propsOnDismiss = _a.onDismiss,
38
38
  onAfterEnter = _a.onAfterEnter,
39
- props = __rest(_a, ["isOpen", "mood", "title", "onSubmit", "onSecondaryAction", "onAfterLeave", "localeDirection", "submitLabel", "dismissLabel", "secondaryLabel", "submitWorking", "children", "unpadded", "onDismiss", "onAfterEnter"]);
39
+ className = _a.className,
40
+ props = __rest(_a, ["isOpen", "mood", "title", "onSubmit", "onSecondaryAction", "onAfterLeave", "localeDirection", "submitLabel", "dismissLabel", "secondaryLabel", "submitWorking", "children", "unpadded", "onDismiss", "onAfterEnter", "className"]);
40
41
  var onDismiss = submitWorking ? undefined : propsOnDismiss;
41
42
  var submitAction = {
42
43
  label: submitLabel,
@@ -57,7 +58,8 @@ const InputEditModal = /*#__PURE__*/function () {
57
58
  isOpen: isOpen,
58
59
  onEscapeKeyup: onDismiss,
59
60
  onAfterLeave: onAfterLeave,
60
- onAfterEnter: onAfterEnter
61
+ onAfterEnter: onAfterEnter,
62
+ className: className
61
63
  }, /*#__PURE__*/React.createElement("div", __assign({
62
64
  className: styles.modal,
63
65
  dir: localeDirection,
package/dist/types/Modal/ConfirmationModal/ConfirmationModal.d.ts CHANGED
@@ -53,7 +53,7 @@ export type ConfirmationModalProps = BaseConfirmationModalProps & (ConfirmationM
53
53
  * {@link https://cultureamp.design/?path=/docs/components-modals-confirmationmodal--docs Storybook}
54
54
  */
55
55
  export declare const ConfirmationModal: {
56
- ({ isOpen, isProminent, unpadded, mood, variant, title, onConfirm, onAfterLeave, onAfterEnter, confirmLabel, dismissLabel, confirmWorking, onDismiss: propsOnDismiss, children, ...props }: ConfirmationModalProps): JSX.Element;
56
+ ({ isOpen, isProminent, unpadded, mood, variant, title, onConfirm, onAfterLeave, onAfterEnter, confirmLabel, dismissLabel, confirmWorking, onDismiss: propsOnDismiss, children, className, ...props }: ConfirmationModalProps): JSX.Element;
57
57
  displayName: string;
58
58
  };
59
59
  export {};
package/dist/types/Modal/ContextModal/ContextModal.d.ts CHANGED
@@ -39,6 +39,6 @@ export type ContextModalProps = Readonly<{
39
39
  * {@link https://cultureamp.design/?path=/docs/components-modals--contextmodal--docs Storybook}
40
40
  */
41
41
  export declare const ContextModal: {
42
- ({ isOpen, unpadded, layout, title, onConfirm, onDismiss: propsOnDismiss, onAfterLeave, onAfterEnter, confirmLabel, confirmWorking, renderBackground, children, contentHeader, image, secondaryLabel, onSecondaryAction, ...props }: ContextModalProps): JSX.Element;
42
+ ({ isOpen, unpadded, layout, title, onConfirm, onDismiss: propsOnDismiss, onAfterLeave, onAfterEnter, confirmLabel, confirmWorking, renderBackground, children, contentHeader, image, secondaryLabel, onSecondaryAction, className, ...props }: ContextModalProps): JSX.Element;
43
43
  displayName: string;
44
44
  };
package/dist/types/Modal/GenericModal/GenericModal.d.ts CHANGED
@@ -10,8 +10,9 @@ export type GenericModalProps = {
10
10
  onAfterEnter?: () => void;
11
11
  /** A callback that is triggered after the modal is closed. */
12
12
  onAfterLeave?: () => void;
13
+ className?: string;
13
14
  };
14
15
  export declare const GenericModal: {
15
- ({ id: propsId, children, isOpen, focusLockDisabled, onEscapeKeyup, onOutsideModalClick, onAfterEnter, onAfterLeave: propsOnAfterLeave, }: GenericModalProps): JSX.Element;
16
+ ({ id: propsId, children, isOpen, focusLockDisabled, onEscapeKeyup, onOutsideModalClick, onAfterEnter, onAfterLeave: propsOnAfterLeave, className, }: GenericModalProps): JSX.Element;
16
17
  displayName: string;
17
18
  };
package/dist/types/Modal/InputEditModal/InputEditModal.d.ts CHANGED
@@ -33,6 +33,6 @@ export type InputEditModalProps = {
33
33
  * {@link https://cultureamp.design/?path=/docs/components-modals-inputeditmodal--docs Storybook}
34
34
  */
35
35
  export declare const InputEditModal: {
36
- ({ isOpen, mood, title, onSubmit, onSecondaryAction, onAfterLeave, localeDirection, submitLabel, dismissLabel, secondaryLabel, submitWorking, children, unpadded, onDismiss: propsOnDismiss, onAfterEnter, ...props }: InputEditModalProps): JSX.Element;
36
+ ({ isOpen, mood, title, onSubmit, onSecondaryAction, onAfterLeave, localeDirection, submitLabel, dismissLabel, secondaryLabel, submitWorking, children, unpadded, onDismiss: propsOnDismiss, onAfterEnter, className, ...props }: InputEditModalProps): JSX.Element;
37
37
  displayName: string;
38
38
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kaizen/components",
3
- "version": "1.73.2",
3
+ "version": "1.73.3",
4
4
  "description": "Kaizen component library",
5
5
  "author": "Geoffrey Chong <geoff.chong@cultureamp.com>",
6
6
  "homepage": "https://cultureamp.design",
@@ -185,8 +185,8 @@
185
185
  "svgo": "^3.3.2",
186
186
  "tslib": "^2.8.1",
187
187
  "tsx": "^4.19.2",
188
- "@kaizen/package-bundler": "2.0.4",
189
- "@kaizen/design-tokens": "10.8.7"
188
+ "@kaizen/design-tokens": "10.8.7",
189
+ "@kaizen/package-bundler": "2.0.4"
190
190
  },
191
191
  "devDependenciesComments": {
192
192
  "sass": "Prevent deprecation warnings introduced in 1.80 as we plan to move away from sass",
package/src/Modal/ConfirmationModal/ConfirmationModal.tsx CHANGED
@@ -124,6 +124,7 @@ export const ConfirmationModal = ({
124
124
  confirmWorking,
125
125
  onDismiss: propsOnDismiss,
126
126
  children,
127
+ className,
127
128
  ...props
128
129
  }: ConfirmationModalProps): JSX.Element => {
129
130
  const variantName = variant ?? mood
@@ -158,6 +159,7 @@ export const ConfirmationModal = ({
158
159
  onOutsideModalClick={onDismiss}
159
160
  onAfterLeave={onAfterLeave}
160
161
  onAfterEnter={onAfterEnter}
162
+ className={className}
161
163
  >
162
164
  <div className={styles.modal} data-modal {...props}>
163
165
  <ModalHeader onDismiss={onDismiss}>
package/src/Modal/ContextModal/ContextModal.tsx CHANGED
@@ -71,6 +71,7 @@ export const ContextModal = ({
71
71
  image,
72
72
  secondaryLabel,
73
73
  onSecondaryAction,
74
+ className,
74
75
  ...props
75
76
  }: ContextModalProps): JSX.Element => {
76
77
  const onDismiss = confirmWorking ? undefined : propsOnDismiss
@@ -105,6 +106,7 @@ export const ContextModal = ({
105
106
  onOutsideModalClick={onDismiss}
106
107
  onAfterLeave={onAfterLeave}
107
108
  onAfterEnter={onAfterEnter}
109
+ className={className}
108
110
  >
109
111
  <div className={styles.modal} data-modal {...props}>
110
112
  {renderBackground?.()}
package/src/Modal/GenericModal/GenericModal.tsx CHANGED
@@ -17,6 +17,7 @@ export type GenericModalProps = {
17
17
  onAfterEnter?: () => void
18
18
  /** A callback that is triggered after the modal is closed. */
19
19
  onAfterLeave?: () => void
20
+ className?: string
20
21
  }
21
22
 
22
23
  export const GenericModal = ({
@@ -28,6 +29,7 @@ export const GenericModal = ({
28
29
  onOutsideModalClick,
29
30
  onAfterEnter,
30
31
  onAfterLeave: propsOnAfterLeave,
32
+ className,
31
33
  }: GenericModalProps): JSX.Element => {
32
34
  const reactId = useId()
33
35
  const id = propsId ?? reactId
@@ -137,6 +139,7 @@ export const GenericModal = ({
137
139
  afterLeave={onAfterLeaveHandler}
138
140
  data-generic-modal-transition-wrapper
139
141
  onClick={(e: React.MouseEvent): void => e.stopPropagation()}
142
+ className={className}
140
143
  >
141
144
  <FocusLock
142
145
  disabled={focusLockDisabled}
package/src/Modal/InputEditModal/InputEditModal.tsx CHANGED
@@ -58,6 +58,7 @@ export const InputEditModal = ({
58
58
  unpadded = false,
59
59
  onDismiss: propsOnDismiss,
60
60
  onAfterEnter,
61
+ className,
61
62
  ...props
62
63
  }: InputEditModalProps): JSX.Element => {
63
64
  const onDismiss = submitWorking ? undefined : propsOnDismiss
@@ -87,6 +88,7 @@ export const InputEditModal = ({
87
88
  onEscapeKeyup={onDismiss}
88
89
  onAfterLeave={onAfterLeave}
89
90
  onAfterEnter={onAfterEnter}
91
+ className={className}
90
92
  >
91
93
  <div className={styles.modal} dir={localeDirection} data-modal {...props}>
92
94
  <ModalHeader onDismiss={onDismiss}>