@kaizen/components 2.5.0 → 3.0.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/dist/cjs/src/Button/Button.cjs +2 -4
- package/dist/cjs/src/GuidanceBlock/GuidanceBlock.cjs +16 -82
- package/dist/cjs/src/GuidanceBlock/GuidanceBlock.module.css.cjs +0 -1
- package/dist/cjs/src/LinkButton/LinkButton.cjs +2 -4
- package/dist/cjs/src/Modal/ConfirmationModal/ConfirmationModal.cjs +3 -2
- package/dist/cjs/src/Modal/ContextModal/ContextModal.cjs +0 -1
- package/dist/cjs/src/Modal/GenericModal/GenericModal.cjs +2 -2
- package/dist/cjs/src/Modal/GenericModal/subcomponents/ModalFooter/ModalFooter.cjs +3 -6
- package/dist/cjs/src/Select/Select.cjs +14 -15
- package/dist/cjs/src/Select/Select.module.scss.cjs +0 -1
- package/dist/cjs/src/SingleSelect/SingleSelect.cjs +12 -19
- package/dist/cjs/src/SingleSelect/subcomponents/SelectToggle/SelectToggle.cjs +3 -5
- package/dist/cjs/src/SingleSelect/subcomponents/SelectToggle/SelectToggle.module.scss.cjs +0 -1
- package/dist/cjs/src/TimeField/TimeField.cjs +2 -3
- package/dist/esm/src/Button/Button.mjs +2 -4
- package/dist/esm/src/GuidanceBlock/GuidanceBlock.mjs +18 -84
- package/dist/esm/src/GuidanceBlock/GuidanceBlock.module.css.mjs +0 -1
- package/dist/esm/src/LinkButton/LinkButton.mjs +2 -4
- package/dist/esm/src/Modal/ConfirmationModal/ConfirmationModal.mjs +3 -2
- package/dist/esm/src/Modal/ContextModal/ContextModal.mjs +0 -1
- package/dist/esm/src/Modal/GenericModal/GenericModal.mjs +2 -2
- package/dist/esm/src/Modal/GenericModal/subcomponents/ModalFooter/ModalFooter.mjs +3 -6
- package/dist/esm/src/Select/Select.mjs +14 -15
- package/dist/esm/src/Select/Select.module.scss.mjs +0 -1
- package/dist/esm/src/SingleSelect/SingleSelect.mjs +12 -19
- package/dist/esm/src/SingleSelect/subcomponents/SelectToggle/SelectToggle.mjs +3 -5
- package/dist/esm/src/SingleSelect/subcomponents/SelectToggle/SelectToggle.module.scss.mjs +0 -1
- package/dist/esm/src/TimeField/TimeField.mjs +2 -3
- package/dist/styles.css +0 -94
- package/dist/types/Button/Button.d.ts +0 -5
- package/dist/types/Calendar/CalendarRange/CalendarRange.d.ts +2 -1
- package/dist/types/Calendar/CalendarSingle/CalendarSingle.d.ts +2 -1
- package/dist/types/Calendar/types.d.ts +1 -0
- package/dist/types/GuidanceBlock/GuidanceBlock.d.ts +1 -26
- package/dist/types/Input/Input/Input.d.ts +1 -6
- package/dist/types/Modal/GenericModal/subcomponents/ModalFooter/ModalFooter.d.ts +1 -5
- package/dist/types/Select/Select.d.ts +3 -13
- package/dist/types/SingleSelect/SingleSelect.d.ts +2 -24
- package/dist/types/SingleSelect/subcomponents/SelectToggle/SelectToggle.d.ts +2 -12
- package/dist/types/TextArea/TextArea.d.ts +1 -6
- package/dist/types/TimeField/TimeField.d.ts +1 -1
- package/package.json +1 -2
- package/src/Button/Button.tsx +1 -8
- package/src/Button/_docs/Button--api-specification.mdx +0 -1
- package/src/Calendar/CalendarRange/CalendarRange.tsx +4 -1
- package/src/Calendar/CalendarSingle/CalendarSingle.tsx +4 -1
- package/src/Calendar/types.ts +18 -0
- package/src/GuidanceBlock/GuidanceBlock.module.css +0 -8
- package/src/GuidanceBlock/GuidanceBlock.spec.tsx +1 -26
- package/src/GuidanceBlock/GuidanceBlock.tsx +2 -112
- package/src/GuidanceBlock/_docs/GuidanceBlock.stories.tsx +0 -90
- package/src/Input/Input/Input.module.scss +0 -31
- package/src/Input/Input/Input.tsx +1 -6
- package/src/LinkButton/LinkButton.tsx +1 -3
- package/src/LinkButton/_docs/LinkButton--api-specification.mdx +0 -1
- package/src/Modal/ConfirmationModal/ConfirmationModal.tsx +7 -6
- package/src/Modal/ContextModal/ContextModal.tsx +0 -1
- package/src/Modal/GenericModal/GenericModal.tsx +3 -4
- package/src/Modal/GenericModal/subcomponents/ModalFooter/ModalFooter.tsx +2 -8
- package/src/Select/Select.module.scss +0 -16
- package/src/Select/Select.tsx +16 -19
- package/src/SingleSelect/SingleSelect.tsx +1 -14
- package/src/SingleSelect/_docs/SingleSelect.stories.tsx +5 -2
- package/src/SingleSelect/subcomponents/SelectToggle/SelectToggle.module.scss +0 -8
- package/src/SingleSelect/subcomponents/SelectToggle/SelectToggle.tsx +2 -9
- package/src/TextArea/TextArea.tsx +1 -6
- package/src/TimeField/TimeField.tsx +2 -9
- package/dist/cjs/src/Modal/util/console.cjs +0 -16
- package/dist/esm/src/Modal/util/console.mjs +0 -13
- package/dist/types/Modal/util/console.d.ts +0 -5
- package/dist/types/utils/useResizeObserver.d.ts +0 -22
- package/src/Modal/util/console.ts +0 -13
- package/src/utils/useResizeObserver.ts +0 -73
|
@@ -1,73 +0,0 @@
|
|
|
1
|
-
import type React from 'react'
|
|
2
|
-
import { type Ref } from 'react'
|
|
3
|
-
import { useCallback, useEffect, useRef, useState } from 'react'
|
|
4
|
-
import ResizeObserver from 'resize-observer-polyfill'
|
|
5
|
-
|
|
6
|
-
const defaultCallback = (entry: ResizeObserverEntry): ResizeObserverEntry => entry
|
|
7
|
-
|
|
8
|
-
export interface DOMRectReadOnly {
|
|
9
|
-
readonly x: number
|
|
10
|
-
readonly y: number
|
|
11
|
-
readonly width: number
|
|
12
|
-
readonly height: number
|
|
13
|
-
readonly top: number
|
|
14
|
-
readonly right: number
|
|
15
|
-
readonly bottom: number
|
|
16
|
-
readonly left: number
|
|
17
|
-
}
|
|
18
|
-
|
|
19
|
-
/**
|
|
20
|
-
* Hook for observing changes to a DOM element via ResizeObserver.
|
|
21
|
-
*
|
|
22
|
-
* @param {resolveEntryCallback} resolveEntry - Callback for resolving the
|
|
23
|
-
* desired value from each ResizeObserverEntry emitted by ResizeObserver
|
|
24
|
-
* @return {Array} An array containing a ref for binding to the observed DOM
|
|
25
|
-
* element, and the current value of the callback-resolved ResizeObserverEntry
|
|
26
|
-
* @callback resolveEntryCallback
|
|
27
|
-
* @deprecated use native `ResizeObserver` DOM API instead
|
|
28
|
-
*/
|
|
29
|
-
export const useResizeObserver = <T, E extends Element = HTMLElement>(
|
|
30
|
-
resolveEntry: (entry: ResizeObserverEntry) => any = defaultCallback,
|
|
31
|
-
): [Ref<E>, T | undefined] => {
|
|
32
|
-
const destroyResizeObserverRef: React.MutableRefObject<undefined | (() => void)> =
|
|
33
|
-
useRef(undefined)
|
|
34
|
-
const [dimensions, setDimensions] = useState<T | undefined>(undefined)
|
|
35
|
-
const resolveEntryRef: React.MutableRefObject<(entry: ResizeObserverEntry) => any> =
|
|
36
|
-
useRef(resolveEntry)
|
|
37
|
-
|
|
38
|
-
const ref: Ref<E> = useCallback(
|
|
39
|
-
(node: E) => {
|
|
40
|
-
if (node) {
|
|
41
|
-
const resizeObserver = new ResizeObserver((entries: ResizeObserverEntry[]) => {
|
|
42
|
-
for (const entry of entries) {
|
|
43
|
-
const value = resolveEntryRef.current(entry)
|
|
44
|
-
if (value) {
|
|
45
|
-
setDimensions(value)
|
|
46
|
-
}
|
|
47
|
-
}
|
|
48
|
-
})
|
|
49
|
-
resizeObserver.observe(node)
|
|
50
|
-
destroyResizeObserverRef.current = (): void => {
|
|
51
|
-
resizeObserver.disconnect()
|
|
52
|
-
}
|
|
53
|
-
}
|
|
54
|
-
},
|
|
55
|
-
[destroyResizeObserverRef, setDimensions, resolveEntryRef],
|
|
56
|
-
)
|
|
57
|
-
|
|
58
|
-
// Ensure the resolveEntryRef has the latest value
|
|
59
|
-
useEffect(() => {
|
|
60
|
-
resolveEntryRef.current = resolveEntry
|
|
61
|
-
}, [resolveEntry])
|
|
62
|
-
|
|
63
|
-
// Destroy the observer on unmount
|
|
64
|
-
useEffect(
|
|
65
|
-
() => () => {
|
|
66
|
-
if (destroyResizeObserverRef.current) {
|
|
67
|
-
destroyResizeObserverRef.current()
|
|
68
|
-
}
|
|
69
|
-
},
|
|
70
|
-
[],
|
|
71
|
-
)
|
|
72
|
-
return [ref, dimensions]
|
|
73
|
-
}
|