@stack-spot/citric-react 0.20.1 → 0.20.2
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/utils/checkbox.d.ts +3 -2
- package/dist/utils/checkbox.d.ts.map +1 -1
- package/dist/utils/checkbox.js +4 -2
- package/dist/utils/checkbox.js.map +1 -1
- package/dist/utils/radio.d.ts +3 -2
- package/dist/utils/radio.d.ts.map +1 -1
- package/dist/utils/radio.js +4 -2
- package/dist/utils/radio.js.map +1 -1
- package/package.json +1 -1
- package/src/utils/checkbox.ts +7 -4
- package/src/utils/radio.ts +7 -4
package/dist/utils/checkbox.d.ts
CHANGED
|
@@ -24,9 +24,10 @@ export interface CheckboxGroupHookParams<T, F = string> {
|
|
|
24
24
|
renderKey: (option: T) => string | number | undefined;
|
|
25
25
|
/**
|
|
26
26
|
* A function to call whenever the value changes.
|
|
27
|
-
* @param
|
|
27
|
+
* @param newValue the new value.
|
|
28
|
+
* @param previousValue the previous value.
|
|
28
29
|
*/
|
|
29
|
-
onChange?: (
|
|
30
|
+
onChange?: (newValue: T[], previousValue: T[]) => void;
|
|
30
31
|
}
|
|
31
32
|
/**
|
|
32
33
|
* Use this hook to easily implement filtering and selection controls for a checkbox group.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"checkbox.d.ts","sourceRoot":"","sources":["../../src/utils/checkbox.ts"],"names":[],"mappings":"AAGA,MAAM,WAAW,uBAAuB,CAAC,CAAC,EAAE,CAAC,GAAG,MAAM;IACpD;;;;OAIG;IACH,YAAY,CAAC,EAAE,CAAC,EAAE,CAAC;IACnB;;;;;OAKG;IACH,WAAW,CAAC,EAAE,CAAC,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,KAAK,OAAO,CAAC;IAChD;;OAEG;IACH,OAAO,EAAE,CAAC,EAAE,CAAC;IACb;;;;OAIG;IACH,SAAS,EAAE,CAAC,MAAM,EAAE,CAAC,KAAK,MAAM,GAAG,MAAM,GAAG,SAAS,CAAC;IACtD
|
|
1
|
+
{"version":3,"file":"checkbox.d.ts","sourceRoot":"","sources":["../../src/utils/checkbox.ts"],"names":[],"mappings":"AAGA,MAAM,WAAW,uBAAuB,CAAC,CAAC,EAAE,CAAC,GAAG,MAAM;IACpD;;;;OAIG;IACH,YAAY,CAAC,EAAE,CAAC,EAAE,CAAC;IACnB;;;;;OAKG;IACH,WAAW,CAAC,EAAE,CAAC,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,KAAK,OAAO,CAAC;IAChD;;OAEG;IACH,OAAO,EAAE,CAAC,EAAE,CAAC;IACb;;;;OAIG;IACH,SAAS,EAAE,CAAC,MAAM,EAAE,CAAC,KAAK,MAAM,GAAG,MAAM,GAAG,SAAS,CAAC;IACtD;;;;OAIG;IACH,QAAQ,CAAC,EAAE,CAAC,QAAQ,EAAE,CAAC,EAAE,EAAE,aAAa,EAAE,CAAC,EAAE,KAAK,IAAI,CAAC;CACxD;AAED;;;;GAIG;AACH,wBAAgB,wBAAwB,CAAC,CAAC,EAAE,CAAC,GAAG,MAAM,EAAE,MAAM,EAAE,uBAAuB,CAAC,CAAC,EAAE,CAAC,CAAC;IAqCzF;;OAEG;;IAEH;;OAEG;;IAEH;;OAEG;;IAEH;;OAEG;;IAEH;;OAEG;;IAEH;;OAEG;;IAEH;;OAEG;;IAEH;;OAEG;8BAjFqB,MAAM,GAAG,MAAM,GAAG,SAAS;IAmFnD;;;;OAIG;gCAhDmF,CAAC;IAkDvF;;OAEG;;EAGN"}
|
package/dist/utils/checkbox.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { useCallback, useEffect, useMemo, useState } from 'react';
|
|
1
|
+
import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
|
|
2
2
|
import { defaultRenderKey } from './options.js';
|
|
3
3
|
/**
|
|
4
4
|
* Use this hook to easily implement filtering and selection controls for a checkbox group.
|
|
@@ -8,9 +8,11 @@ import { defaultRenderKey } from './options.js';
|
|
|
8
8
|
export function useCheckboxGroupControls(params) {
|
|
9
9
|
const [value, setValue] = useState(params.initialValue ?? []);
|
|
10
10
|
const [filter, setFilter] = useState();
|
|
11
|
+
const previousValue = useRef(value);
|
|
11
12
|
const renderKey = params.renderKey ?? defaultRenderKey;
|
|
12
13
|
useEffect(() => {
|
|
13
|
-
params.onChange?.(value);
|
|
14
|
+
params.onChange?.(value, previousValue.current);
|
|
15
|
+
previousValue.current = value;
|
|
14
16
|
}, [value]);
|
|
15
17
|
const { options, isUnfilteredButChecked } = useMemo(() => {
|
|
16
18
|
if (!params.applyFilter || !filter)
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"checkbox.js","sourceRoot":"","sources":["../../src/utils/checkbox.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"checkbox.js","sourceRoot":"","sources":["../../src/utils/checkbox.ts"],"names":[],"mappings":"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"}
|
package/dist/utils/radio.d.ts
CHANGED
|
@@ -22,9 +22,10 @@ export interface RadioGroupHookParams<T, F = string> {
|
|
|
22
22
|
renderKey: (option: T) => string | number | undefined;
|
|
23
23
|
/**
|
|
24
24
|
* A function to call whenever the value changes.
|
|
25
|
-
* @param
|
|
25
|
+
* @param newValue the new value.
|
|
26
|
+
* @param previousValue the previous value.
|
|
26
27
|
*/
|
|
27
|
-
onChange?: (
|
|
28
|
+
onChange?: (newValue: T | undefined, previousValue: T | undefined) => void;
|
|
28
29
|
}
|
|
29
30
|
/**
|
|
30
31
|
* Use this hook to easily implement filtering for a radio group.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"radio.d.ts","sourceRoot":"","sources":["../../src/utils/radio.ts"],"names":[],"mappings":"AAGA,MAAM,WAAW,oBAAoB,CAAC,CAAC,EAAE,CAAC,GAAG,MAAM;IACjD;;OAEG;IACH,YAAY,CAAC,EAAE,CAAC,CAAC;IACjB;;;;;OAKG;IACH,WAAW,CAAC,EAAE,CAAC,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,KAAK,OAAO,CAAC;IAChD;;OAEG;IACH,OAAO,EAAE,CAAC,EAAE,CAAC;IACb;;;;OAIG;IACH,SAAS,EAAE,CAAC,MAAM,EAAE,CAAC,KAAK,MAAM,GAAG,MAAM,GAAG,SAAS,CAAC;IACtD
|
|
1
|
+
{"version":3,"file":"radio.d.ts","sourceRoot":"","sources":["../../src/utils/radio.ts"],"names":[],"mappings":"AAGA,MAAM,WAAW,oBAAoB,CAAC,CAAC,EAAE,CAAC,GAAG,MAAM;IACjD;;OAEG;IACH,YAAY,CAAC,EAAE,CAAC,CAAC;IACjB;;;;;OAKG;IACH,WAAW,CAAC,EAAE,CAAC,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,KAAK,OAAO,CAAC;IAChD;;OAEG;IACH,OAAO,EAAE,CAAC,EAAE,CAAC;IACb;;;;OAIG;IACH,SAAS,EAAE,CAAC,MAAM,EAAE,CAAC,KAAK,MAAM,GAAG,MAAM,GAAG,SAAS,CAAC;IACtD;;;;OAIG;IACH,QAAQ,CAAC,EAAE,CAAC,QAAQ,EAAE,CAAC,GAAG,SAAS,EAAE,aAAa,EAAE,CAAC,GAAG,SAAS,KAAK,IAAI,CAAC;CAC5E;AAED;;;;GAIG;AACH,wBAAgB,qBAAqB,CAAC,CAAC,EAAE,CAAC,GAAG,MAAM,EAAE,MAAM,EAAE,oBAAoB,CAAC,CAAC,EAAE,CAAC,CAAC;IAuBnF;;OAEG;;IAEH;;OAEG;;IAEH;;OAEG;;IAEH;;OAEG;;IAEH;;OAEG;;IAEH;;OAEG;8BA3DqB,MAAM,GAAG,MAAM,GAAG,SAAS;IA6DnD;;;;OAIG;gCAjC2B,CAAC;EAoClC"}
|
package/dist/utils/radio.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { useEffect, useMemo, useState } from 'react';
|
|
1
|
+
import { useEffect, useMemo, useRef, useState } from 'react';
|
|
2
2
|
import { defaultRenderKey } from './options.js';
|
|
3
3
|
/**
|
|
4
4
|
* Use this hook to easily implement filtering for a radio group.
|
|
@@ -8,9 +8,11 @@ import { defaultRenderKey } from './options.js';
|
|
|
8
8
|
export function useRadioGroupControls(params) {
|
|
9
9
|
const [value, setValue] = useState(params.initialValue);
|
|
10
10
|
const [filter, setFilter] = useState();
|
|
11
|
+
const previousValue = useRef(value);
|
|
11
12
|
const renderKey = params.renderKey ?? defaultRenderKey;
|
|
12
13
|
useEffect(() => {
|
|
13
|
-
params.onChange?.(value);
|
|
14
|
+
params.onChange?.(value, previousValue.current);
|
|
15
|
+
previousValue.current = value;
|
|
14
16
|
}, [value]);
|
|
15
17
|
const { options, isUnfilteredButChecked } = useMemo(() => {
|
|
16
18
|
if (!params.applyFilter || !filter)
|
package/dist/utils/radio.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"radio.js","sourceRoot":"","sources":["../../src/utils/radio.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"radio.js","sourceRoot":"","sources":["../../src/utils/radio.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAC5D,OAAO,EAAE,gBAAgB,EAAE,MAAM,WAAW,CAAA;AAgC5C;;;;GAIG;AACH,MAAM,UAAU,qBAAqB,CAAgB,MAAkC;IACrF,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAC,MAAM,CAAC,YAAY,CAAC,CAAA;IACvD,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,EAAiB,CAAA;IACrD,MAAM,aAAa,GAAG,MAAM,CAAC,KAAK,CAAC,CAAA;IACnC,MAAM,SAAS,GAAG,MAAM,CAAC,SAAS,IAAI,gBAAgB,CAAA;IAEtD,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,CAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,aAAa,CAAC,OAAO,CAAC,CAAA;QAC/C,aAAa,CAAC,OAAO,GAAG,KAAK,CAAA;IAC/B,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAA;IAEX,MAAM,EAAE,OAAO,EAAE,sBAAsB,EAAE,GAAG,OAAO,CAAC,GAAG,EAAE;QACvD,IAAI,CAAC,MAAM,CAAC,WAAW,IAAI,CAAC,MAAM;YAAE,OAAO,EAAE,OAAO,EAAE,MAAM,CAAC,OAAO,EAAE,sBAAsB,EAAE,GAAG,EAAE,CAAC,KAAK,EAAE,CAAA;QAC3G,MAAM,QAAQ,GAAG,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,SAAS,CAAA;QACrD,MAAM,kBAAkB,GAAG,KAAK,IAAI,CAAC,MAAM,CAAC,WAAW,EAAE,CAAC,MAAM,EAAE,KAAK,CAAC,CAAA;QACxE,MAAM,QAAQ,GAAG,MAAM,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,MAAM,CAAC,WAAW,EAAE,CAAC,MAAM,EAAE,CAAC,CAAC,CAAC,CAAA;QAC5E,OAAO;YACL,OAAO,EAAE,kBAAkB,CAAC,CAAC,CAAC,CAAC,KAAK,EAAE,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC,QAAQ;YAC7D,sBAAsB,EAAE,CAAC,CAAI,EAAE,EAAE,CAAC,kBAAkB,IAAI,SAAS,CAAC,CAAC,CAAC,KAAK,QAAQ;SAClF,CAAA;IACH,CAAC,EAAE,CAAC,MAAM,CAAC,OAAO,EAAE,MAAM,CAAC,CAAC,CAAA;IAE5B,OAAO;QACL;;WAEG;QACH,MAAM;QACN;;WAEG;QACH,SAAS,EAAE,SAAS;QACpB;;WAEG;QACH,OAAO;QACP;;WAEG;QACH,KAAK;QACL;;WAEG;QACH,QAAQ;QACR;;WAEG;QACH,SAAS;QACT;;;;WAIG;QACH,sBAAsB;KACvB,CAAA;AACH,CAAC"}
|
package/package.json
CHANGED
package/src/utils/checkbox.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { useCallback, useEffect, useMemo, useState } from 'react'
|
|
1
|
+
import { useCallback, useEffect, useMemo, useRef, useState } from 'react'
|
|
2
2
|
import { defaultRenderKey } from './options'
|
|
3
3
|
|
|
4
4
|
export interface CheckboxGroupHookParams<T, F = string> {
|
|
@@ -27,9 +27,10 @@ export interface CheckboxGroupHookParams<T, F = string> {
|
|
|
27
27
|
renderKey: (option: T) => string | number | undefined,
|
|
28
28
|
/**
|
|
29
29
|
* A function to call whenever the value changes.
|
|
30
|
-
* @param
|
|
30
|
+
* @param newValue the new value.
|
|
31
|
+
* @param previousValue the previous value.
|
|
31
32
|
*/
|
|
32
|
-
onChange?: (
|
|
33
|
+
onChange?: (newValue: T[], previousValue: T[]) => void,
|
|
33
34
|
}
|
|
34
35
|
|
|
35
36
|
/**
|
|
@@ -40,10 +41,12 @@ export interface CheckboxGroupHookParams<T, F = string> {
|
|
|
40
41
|
export function useCheckboxGroupControls<T, F = string>(params: CheckboxGroupHookParams<T, F>) {
|
|
41
42
|
const [value, setValue] = useState(params.initialValue ?? [])
|
|
42
43
|
const [filter, setFilter] = useState<F | undefined>()
|
|
44
|
+
const previousValue = useRef(value)
|
|
43
45
|
const renderKey = params.renderKey ?? defaultRenderKey
|
|
44
46
|
|
|
45
47
|
useEffect(() => {
|
|
46
|
-
params.onChange?.(value)
|
|
48
|
+
params.onChange?.(value, previousValue.current)
|
|
49
|
+
previousValue.current = value
|
|
47
50
|
}, [value])
|
|
48
51
|
|
|
49
52
|
const { options, isUnfilteredButChecked } = useMemo(() => {
|
package/src/utils/radio.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { useEffect, useMemo, useState } from 'react'
|
|
1
|
+
import { useEffect, useMemo, useRef, useState } from 'react'
|
|
2
2
|
import { defaultRenderKey } from './options'
|
|
3
3
|
|
|
4
4
|
export interface RadioGroupHookParams<T, F = string> {
|
|
@@ -25,9 +25,10 @@ export interface RadioGroupHookParams<T, F = string> {
|
|
|
25
25
|
renderKey: (option: T) => string | number | undefined,
|
|
26
26
|
/**
|
|
27
27
|
* A function to call whenever the value changes.
|
|
28
|
-
* @param
|
|
28
|
+
* @param newValue the new value.
|
|
29
|
+
* @param previousValue the previous value.
|
|
29
30
|
*/
|
|
30
|
-
onChange?: (
|
|
31
|
+
onChange?: (newValue: T | undefined, previousValue: T | undefined) => void,
|
|
31
32
|
}
|
|
32
33
|
|
|
33
34
|
/**
|
|
@@ -38,10 +39,12 @@ export interface RadioGroupHookParams<T, F = string> {
|
|
|
38
39
|
export function useRadioGroupControls<T, F = string>(params: RadioGroupHookParams<T, F>) {
|
|
39
40
|
const [value, setValue] = useState(params.initialValue)
|
|
40
41
|
const [filter, setFilter] = useState<F | undefined>()
|
|
42
|
+
const previousValue = useRef(value)
|
|
41
43
|
const renderKey = params.renderKey ?? defaultRenderKey
|
|
42
44
|
|
|
43
45
|
useEffect(() => {
|
|
44
|
-
params.onChange?.(value)
|
|
46
|
+
params.onChange?.(value, previousValue.current)
|
|
47
|
+
previousValue.current = value
|
|
45
48
|
}, [value])
|
|
46
49
|
|
|
47
50
|
const { options, isUnfilteredButChecked } = useMemo(() => {
|