@spear-ai/spectral 1.4.16 → 1.4.17
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.
|
@@ -24,7 +24,17 @@ export type ItemRenderProps = {
|
|
|
24
24
|
value: string;
|
|
25
25
|
};
|
|
26
26
|
export declare const ToggleGroupBase: (props: ToggleGroupProps & Record<`data-${string}`, any>) => import("react/jsx-runtime").JSX.Element;
|
|
27
|
-
export type ToggleGroupItemProps = Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'onChange' | 'onPressedChange' | 'pressed' | 'defaultPressed'> & ItemRenderProps
|
|
28
|
-
|
|
27
|
+
export type ToggleGroupItemProps = Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'onChange' | 'onPressedChange' | 'pressed' | 'defaultPressed'> & ItemRenderProps & {
|
|
28
|
+
/** @deprecated This prop is ignored - pressed state is managed by ToggleGroup */
|
|
29
|
+
pressed?: boolean;
|
|
30
|
+
/** @deprecated This prop is ignored - pressed state is managed by ToggleGroup */
|
|
31
|
+
defaultPressed?: boolean;
|
|
32
|
+
};
|
|
33
|
+
export declare const ToggleGroupItemBase: import('react').ForwardRefExoticComponent<Omit<ButtonHTMLAttributes<HTMLButtonElement>, "onChange" | "pressed" | "defaultPressed" | "onPressedChange"> & ItemRenderProps & {
|
|
34
|
+
/** @deprecated This prop is ignored - pressed state is managed by ToggleGroup */
|
|
35
|
+
pressed?: boolean;
|
|
36
|
+
/** @deprecated This prop is ignored - pressed state is managed by ToggleGroup */
|
|
37
|
+
defaultPressed?: boolean;
|
|
38
|
+
} & import('react').RefAttributes<HTMLButtonElement>>;
|
|
29
39
|
export {};
|
|
30
40
|
//# sourceMappingURL=ToggleGroupBase.d.ts.map
|
|
@@ -1,98 +1,98 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import "../styles/main.css";
|
|
3
|
-
import { jsx as
|
|
3
|
+
import { jsx as k, jsxs as E } from "react/jsx-runtime";
|
|
4
4
|
import { useControllableState as R } from "../hooks/useControllableState.js";
|
|
5
5
|
import { clamp as M } from "../utils/sharedUtils.js";
|
|
6
|
-
import { createContext as j, forwardRef as H, useContext as K, useRef as S, useImperativeHandle as L, useEffect as N, useCallback as
|
|
7
|
-
const T = j(null),
|
|
6
|
+
import { createContext as j, forwardRef as H, useContext as K, useRef as S, useImperativeHandle as L, useEffect as N, useCallback as u, useMemo as _ } from "react";
|
|
7
|
+
const T = j(null), Q = (B) => {
|
|
8
8
|
const {
|
|
9
|
-
className:
|
|
10
|
-
defaultValue:
|
|
11
|
-
disabled:
|
|
12
|
-
loop:
|
|
13
|
-
name:
|
|
14
|
-
onValueChange:
|
|
15
|
-
orientation:
|
|
16
|
-
type:
|
|
17
|
-
value:
|
|
18
|
-
"data-variant":
|
|
19
|
-
"data-size":
|
|
20
|
-
"data-slot":
|
|
21
|
-
"data-layout":
|
|
22
|
-
...
|
|
23
|
-
} =
|
|
24
|
-
defaultValue: typeof
|
|
25
|
-
onChange:
|
|
26
|
-
value:
|
|
27
|
-
}),
|
|
28
|
-
const
|
|
29
|
-
return
|
|
30
|
-
|
|
9
|
+
className: r,
|
|
10
|
+
defaultValue: d,
|
|
11
|
+
disabled: I = !1,
|
|
12
|
+
loop: g = !0,
|
|
13
|
+
name: c,
|
|
14
|
+
onValueChange: x,
|
|
15
|
+
orientation: D = "horizontal",
|
|
16
|
+
type: y = "single",
|
|
17
|
+
value: C,
|
|
18
|
+
"data-variant": z,
|
|
19
|
+
"data-size": o,
|
|
20
|
+
"data-slot": P,
|
|
21
|
+
"data-layout": v,
|
|
22
|
+
...h
|
|
23
|
+
} = B, f = y === "multiple", [n, b] = R({
|
|
24
|
+
defaultValue: typeof d < "u" ? d : f ? [] : "",
|
|
25
|
+
onChange: x,
|
|
26
|
+
value: C
|
|
27
|
+
}), a = S([]), w = u((t, s) => {
|
|
28
|
+
const A = { val: t, el: s, disabled: !!s?.disabled };
|
|
29
|
+
return a.current = [...a.current.filter((m) => m.val !== t), A], () => {
|
|
30
|
+
a.current = a.current.filter((m) => m.val !== t);
|
|
31
31
|
};
|
|
32
|
-
}, []),
|
|
33
|
-
(t) =>
|
|
34
|
-
[
|
|
35
|
-
),
|
|
32
|
+
}, []), i = u(() => a.current.slice(), []), p = u(
|
|
33
|
+
(t) => f ? Array.isArray(n) && n.includes(t) : n === t,
|
|
34
|
+
[f, n]
|
|
35
|
+
), V = u((t) => b(t), [b]), G = u(
|
|
36
36
|
(t) => {
|
|
37
|
-
const s =
|
|
37
|
+
const s = a.current;
|
|
38
38
|
if (s.length === 0) return;
|
|
39
|
-
const
|
|
40
|
-
s[
|
|
39
|
+
const A = s.length - 1, m = g ? (t % s.length + s.length) % s.length : M(t, 0, A);
|
|
40
|
+
s[m]?.el?.focus();
|
|
41
41
|
},
|
|
42
|
-
[
|
|
43
|
-
),
|
|
42
|
+
[g]
|
|
43
|
+
), e = _(
|
|
44
44
|
() => ({
|
|
45
|
-
focusItemByIndex:
|
|
46
|
-
groupDisabled:
|
|
47
|
-
isItemPressed:
|
|
48
|
-
itemsSnapshot:
|
|
49
|
-
loop:
|
|
50
|
-
name:
|
|
51
|
-
orientation:
|
|
52
|
-
register:
|
|
53
|
-
setValue:
|
|
54
|
-
type:
|
|
45
|
+
focusItemByIndex: G,
|
|
46
|
+
groupDisabled: I,
|
|
47
|
+
isItemPressed: p,
|
|
48
|
+
itemsSnapshot: i,
|
|
49
|
+
loop: g,
|
|
50
|
+
name: c,
|
|
51
|
+
orientation: D,
|
|
52
|
+
register: w,
|
|
53
|
+
setValue: V,
|
|
54
|
+
type: y,
|
|
55
55
|
value: n
|
|
56
56
|
}),
|
|
57
|
-
[
|
|
58
|
-
),
|
|
59
|
-
return /* @__PURE__ */ E("div", { className:
|
|
60
|
-
/* @__PURE__ */
|
|
61
|
-
|
|
62
|
-
|
|
57
|
+
[I, p, i, g, c, D, V, y, n]
|
|
58
|
+
), l = c;
|
|
59
|
+
return /* @__PURE__ */ E("div", { className: r, "data-disabled": I ? "" : void 0, "data-layout": v, "data-orientation": D, "data-size": o, "data-slot": P, "data-variant": z, role: "group", ...h, children: [
|
|
60
|
+
/* @__PURE__ */ k(T.Provider, { value: e, children: B.children }),
|
|
61
|
+
l && y === "single" && typeof n == "string" ? /* @__PURE__ */ k("input", { type: "hidden", name: l, value: n }) : null,
|
|
62
|
+
l && y === "multiple" && Array.isArray(n) ? n.map((t) => /* @__PURE__ */ k("input", { type: "hidden", name: l + "[]", value: t }, t)) : null
|
|
63
63
|
] });
|
|
64
|
-
},
|
|
65
|
-
const
|
|
66
|
-
if (!
|
|
67
|
-
const { type:
|
|
68
|
-
L(
|
|
69
|
-
const
|
|
70
|
-
if (!(
|
|
71
|
-
if (
|
|
64
|
+
}, W = H(function({ value: r, disabled: d, className: I, children: g, onKeyDown: c, onClick: x, pressed: D, defaultPressed: y, ...C }, z) {
|
|
65
|
+
const o = K(T);
|
|
66
|
+
if (!o) throw new Error("ToggleGroupItem must be used within ToggleGroup");
|
|
67
|
+
const { type: P, orientation: v, groupDisabled: h, setValue: f, isItemPressed: n, itemsSnapshot: b, register: a } = o, w = S(null);
|
|
68
|
+
L(z, () => w.current), N(() => a(r, w.current), [a, r]);
|
|
69
|
+
const i = n(r), p = u(() => {
|
|
70
|
+
if (!(h || d))
|
|
71
|
+
if (P === "single") f(i ? "" : r);
|
|
72
72
|
else {
|
|
73
|
-
const e =
|
|
74
|
-
|
|
73
|
+
const e = o.value, l = i ? e.filter((t) => t !== r) : [...e, r];
|
|
74
|
+
f(l);
|
|
75
75
|
}
|
|
76
|
-
}, [
|
|
76
|
+
}, [o.value, d, h, i, f, P, r]), V = u(
|
|
77
77
|
(e) => {
|
|
78
|
-
if (
|
|
78
|
+
if (c && c(e), e.defaultPrevented) return;
|
|
79
79
|
if (e.key === " " || e.key === "Enter") {
|
|
80
|
-
e.preventDefault(),
|
|
80
|
+
e.preventDefault(), p();
|
|
81
81
|
return;
|
|
82
82
|
}
|
|
83
|
-
const
|
|
84
|
-
e.key ===
|
|
83
|
+
const l = b(), t = l.findIndex((m) => m.val === r), s = v === "horizontal" ? "ArrowLeft" : "ArrowUp", A = v === "horizontal" ? "ArrowRight" : "ArrowDown";
|
|
84
|
+
e.key === s ? (e.preventDefault(), o.focusItemByIndex(t - 1)) : e.key === A ? (e.preventDefault(), o.focusItemByIndex(t + 1)) : e.key === "Home" ? (e.preventDefault(), o.focusItemByIndex(0)) : e.key === "End" && (e.preventDefault(), o.focusItemByIndex(l.length - 1));
|
|
85
85
|
},
|
|
86
|
-
[
|
|
87
|
-
),
|
|
86
|
+
[o, b, c, v, p, r]
|
|
87
|
+
), G = u(
|
|
88
88
|
(e) => {
|
|
89
|
-
|
|
89
|
+
x && x(e), !e.defaultPrevented && p();
|
|
90
90
|
},
|
|
91
|
-
[
|
|
91
|
+
[x, p]
|
|
92
92
|
);
|
|
93
|
-
return /* @__PURE__ */
|
|
93
|
+
return /* @__PURE__ */ k("button", { "aria-pressed": i, className: I, "data-disabled": h || d ? "" : void 0, "data-state": i ? "on" : "off", disabled: h || d, onClick: G, onKeyDown: V, ref: w, type: "button", ...C, children: g });
|
|
94
94
|
});
|
|
95
95
|
export {
|
|
96
|
-
|
|
97
|
-
|
|
96
|
+
Q as ToggleGroupBase,
|
|
97
|
+
W as ToggleGroupItemBase
|
|
98
98
|
};
|
package/dist/ToggleGroup.d.ts
CHANGED
|
@@ -4,7 +4,10 @@ import { VariantProps } from 'class-variance-authority';
|
|
|
4
4
|
import { ComponentProps } from 'react';
|
|
5
5
|
export type ToggleGroupProps = ComponentProps<typeof ToggleGroupBase> & VariantProps<typeof toggleVariants>;
|
|
6
6
|
export declare const ToggleGroup: ({ className, variant, size, layout, children, ...props }: ToggleGroupProps) => import("react/jsx-runtime").JSX.Element;
|
|
7
|
-
export declare const ToggleGroupItem: import('react').ForwardRefExoticComponent<Omit<Omit<import('react').ButtonHTMLAttributes<HTMLButtonElement>, "onChange" | "pressed" | "defaultPressed" | "onPressedChange"> & import('./ToggleGroupBase').ItemRenderProps &
|
|
7
|
+
export declare const ToggleGroupItem: import('react').ForwardRefExoticComponent<Omit<Omit<import('react').ButtonHTMLAttributes<HTMLButtonElement>, "onChange" | "pressed" | "defaultPressed" | "onPressedChange"> & import('./ToggleGroupBase').ItemRenderProps & {
|
|
8
|
+
pressed?: boolean;
|
|
9
|
+
defaultPressed?: boolean;
|
|
10
|
+
} & import('react').RefAttributes<HTMLButtonElement> & VariantProps<(props?: ({
|
|
8
11
|
variant?: "default" | "outline" | null | undefined;
|
|
9
12
|
size?: "default" | "sm" | "lg" | null | undefined;
|
|
10
13
|
layout?: "default" | "expanded" | null | undefined;
|