@expcat/tigercat-react 0.2.27 → 0.3.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/chunk-4IO2M3ZJ.js +110 -0
- package/dist/{chunk-2UVQIL26.mjs → chunk-6DYS4PJT.mjs} +1 -1
- package/dist/chunk-6YKZAWNX.js +258 -0
- package/dist/chunk-73DMQ2SR.mjs +206 -0
- package/dist/chunk-FAZQT7YP.mjs +255 -0
- package/dist/{chunk-HRYBEBZC.js → chunk-GJKT2B56.js} +5 -1
- package/dist/{chunk-5XKYWZZZ.mjs → chunk-HGTF6A46.mjs} +5 -1
- package/dist/chunk-HT2BXCEM.js +264 -0
- package/dist/{chunk-6ZC7H22S.mjs → chunk-IAF24RKI.mjs} +1 -1
- package/dist/chunk-IYFSM2GA.mjs +141 -0
- package/dist/chunk-JAVDNFJD.js +144 -0
- package/dist/{chunk-P273E6XE.js → chunk-MQTHGPHF.js} +37 -21
- package/dist/chunk-OVWCTDAL.js +209 -0
- package/dist/{chunk-GIYBVWR4.mjs → chunk-OZLAGTZW.mjs} +38 -22
- package/dist/{chunk-OD2NNQD2.js → chunk-PBJ2J2B3.js} +2 -2
- package/dist/chunk-PVOQUXIB.mjs +189 -0
- package/dist/chunk-R67R3TVA.mjs +261 -0
- package/dist/{chunk-VR5OP4MO.js → chunk-UG3I4PCY.js} +2 -2
- package/dist/chunk-WKGCUR7O.mjs +107 -0
- package/dist/chunk-ZN2BZCTI.js +192 -0
- package/dist/components/ActivityFeed.d.mts +10 -0
- package/dist/components/ActivityFeed.d.ts +10 -0
- package/dist/components/ActivityFeed.js +23 -0
- package/dist/components/ActivityFeed.mjs +8 -0
- package/dist/components/AreaChart.js +4 -4
- package/dist/components/AreaChart.mjs +2 -2
- package/dist/components/BarChart.js +4 -4
- package/dist/components/BarChart.mjs +2 -2
- package/dist/components/ChatWindow.d.mts +12 -0
- package/dist/components/ChatWindow.d.ts +12 -0
- package/dist/components/ChatWindow.js +20 -0
- package/dist/components/ChatWindow.mjs +5 -0
- package/dist/components/CommentThread.d.mts +8 -0
- package/dist/components/CommentThread.d.ts +8 -0
- package/dist/components/CommentThread.js +21 -0
- package/dist/components/CommentThread.mjs +6 -0
- package/dist/components/DataTableWithToolbar.d.mts +51 -0
- package/dist/components/DataTableWithToolbar.d.ts +51 -0
- package/dist/components/DataTableWithToolbar.js +24 -0
- package/dist/components/DataTableWithToolbar.mjs +9 -0
- package/dist/components/DonutChart.js +5 -5
- package/dist/components/DonutChart.mjs +3 -3
- package/dist/components/Dropdown.js +4 -4
- package/dist/components/Dropdown.mjs +2 -2
- package/dist/components/DropdownItem.js +4 -4
- package/dist/components/DropdownItem.mjs +3 -3
- package/dist/components/FormItem.js +2 -2
- package/dist/components/FormItem.mjs +1 -1
- package/dist/components/FormWizard.d.mts +10 -0
- package/dist/components/FormWizard.d.ts +10 -0
- package/dist/components/FormWizard.js +19 -0
- package/dist/components/FormWizard.mjs +4 -0
- package/dist/components/LineChart.js +4 -4
- package/dist/components/LineChart.mjs +2 -2
- package/dist/components/NotificationCenter.d.mts +8 -0
- package/dist/components/NotificationCenter.d.ts +8 -0
- package/dist/components/NotificationCenter.js +23 -0
- package/dist/components/NotificationCenter.mjs +8 -0
- package/dist/components/PieChart.js +4 -4
- package/dist/components/PieChart.mjs +2 -2
- package/dist/components/RadarChart.js +4 -4
- package/dist/components/RadarChart.mjs +2 -2
- package/dist/components/ScatterChart.js +4 -4
- package/dist/components/ScatterChart.mjs +2 -2
- package/dist/components/Table.d.mts +1 -1
- package/dist/components/Table.d.ts +1 -1
- package/dist/components/Table.js +2 -2
- package/dist/components/Table.mjs +1 -1
- package/dist/index.d.mts +6 -0
- package/dist/index.d.ts +6 -0
- package/dist/index.js +197 -167
- package/dist/index.mjs +49 -43
- package/package.json +2 -2
- package/dist/{chunk-ZYF5GI2Q.js → chunk-4PTI6ZUK.js} +1 -1
- package/dist/{chunk-LIJLFLYE.js → chunk-4TWHENPT.js} +1 -1
- package/dist/{chunk-67WZRMD6.js → chunk-6E5UKM6O.js} +1 -1
- package/dist/{chunk-AFFSBNYB.mjs → chunk-AITVDDCE.mjs} +1 -1
- package/dist/{chunk-324UKFG2.mjs → chunk-IL2Y5RCX.mjs} +1 -1
- package/dist/{chunk-7SOL3UJ2.js → chunk-L63N3LCG.js} +1 -1
- package/dist/{chunk-E6GLWHRL.mjs → chunk-LZNG2HGC.mjs} +1 -1
- package/dist/{chunk-2VXA4YOP.js → chunk-N32MAX4A.js} +1 -1
- package/dist/{chunk-RKBNIEGF.mjs → chunk-PT4WLSTJ.mjs} +1 -1
- package/dist/{chunk-LWW2LXCP.js → chunk-SIB4EHB6.js} +1 -1
- package/dist/{chunk-2WLSB7K2.mjs → chunk-WYTHTJN3.mjs} +1 -1
- package/dist/{chunk-5QKBBGIA.mjs → chunk-YER7IQF4.mjs} +1 -1
- package/dist/{chunk-7IKJBQQV.mjs → chunk-YGOTPK2W.mjs} +1 -1
- package/dist/{chunk-KKHKQP6Z.js → chunk-ZUUG3WOL.js} +1 -1
|
@@ -0,0 +1,141 @@
|
|
|
1
|
+
import { StepsItem, Steps } from './chunk-P4EFJIXU.mjs';
|
|
2
|
+
import { Button } from './chunk-STEIWBMF.mjs';
|
|
3
|
+
import { Alert } from './chunk-CR4QK2AB.mjs';
|
|
4
|
+
import { useState, useEffect, useCallback, useMemo } from 'react';
|
|
5
|
+
import { classNames } from '@expcat/tigercat-core';
|
|
6
|
+
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
7
|
+
|
|
8
|
+
var FormWizard = ({
|
|
9
|
+
steps = [],
|
|
10
|
+
current,
|
|
11
|
+
defaultCurrent = 0,
|
|
12
|
+
clickable = false,
|
|
13
|
+
direction = "horizontal",
|
|
14
|
+
size = "default",
|
|
15
|
+
simple = false,
|
|
16
|
+
showSteps = true,
|
|
17
|
+
showActions = true,
|
|
18
|
+
prevText = "Previous",
|
|
19
|
+
nextText = "Next",
|
|
20
|
+
finishText = "Finish",
|
|
21
|
+
beforeNext,
|
|
22
|
+
onChange,
|
|
23
|
+
onFinish,
|
|
24
|
+
renderStep,
|
|
25
|
+
className,
|
|
26
|
+
style,
|
|
27
|
+
...props
|
|
28
|
+
}) => {
|
|
29
|
+
const [innerCurrent, setInnerCurrent] = useState(defaultCurrent);
|
|
30
|
+
const [errorMessage, setErrorMessage] = useState(null);
|
|
31
|
+
useEffect(() => {
|
|
32
|
+
if (current !== void 0) setInnerCurrent(current);
|
|
33
|
+
}, [current]);
|
|
34
|
+
const totalCount = steps.length;
|
|
35
|
+
const currentIndex = current ?? innerCurrent;
|
|
36
|
+
const currentStep = steps[currentIndex];
|
|
37
|
+
const isFirst = currentIndex <= 0;
|
|
38
|
+
const isLast = currentIndex >= totalCount - 1;
|
|
39
|
+
const wrapperClasses = classNames("tiger-form-wizard flex flex-col gap-6 w-full", className);
|
|
40
|
+
const setCurrent = useCallback(
|
|
41
|
+
(next) => {
|
|
42
|
+
const max = Math.max(totalCount - 1, 0);
|
|
43
|
+
const clamped = Math.min(Math.max(next, 0), max);
|
|
44
|
+
if (current === void 0) {
|
|
45
|
+
setInnerCurrent(clamped);
|
|
46
|
+
}
|
|
47
|
+
onChange?.(clamped, currentIndex);
|
|
48
|
+
},
|
|
49
|
+
[current, currentIndex, onChange, totalCount]
|
|
50
|
+
);
|
|
51
|
+
const runBeforeNext = useCallback(async () => {
|
|
52
|
+
if (!beforeNext || !currentStep) {
|
|
53
|
+
setErrorMessage(null);
|
|
54
|
+
return true;
|
|
55
|
+
}
|
|
56
|
+
const result = await beforeNext(currentIndex, currentStep, steps);
|
|
57
|
+
if (result === true) {
|
|
58
|
+
setErrorMessage(null);
|
|
59
|
+
return true;
|
|
60
|
+
}
|
|
61
|
+
if (typeof result === "string") {
|
|
62
|
+
setErrorMessage(result);
|
|
63
|
+
} else {
|
|
64
|
+
setErrorMessage(null);
|
|
65
|
+
}
|
|
66
|
+
return false;
|
|
67
|
+
}, [beforeNext, currentIndex, currentStep, steps]);
|
|
68
|
+
const handlePrev = useCallback(() => {
|
|
69
|
+
if (currentIndex <= 0 || steps[currentIndex - 1]?.disabled) return;
|
|
70
|
+
setErrorMessage(null);
|
|
71
|
+
setCurrent(currentIndex - 1);
|
|
72
|
+
}, [currentIndex, setCurrent, steps]);
|
|
73
|
+
const handleNext = useCallback(async () => {
|
|
74
|
+
if (totalCount === 0) return;
|
|
75
|
+
const ok = await runBeforeNext();
|
|
76
|
+
if (!ok) return;
|
|
77
|
+
if (isLast) {
|
|
78
|
+
onFinish?.(currentIndex, steps);
|
|
79
|
+
return;
|
|
80
|
+
}
|
|
81
|
+
if (steps[currentIndex + 1]?.disabled) return;
|
|
82
|
+
setErrorMessage(null);
|
|
83
|
+
setCurrent(currentIndex + 1);
|
|
84
|
+
}, [currentIndex, totalCount, isLast, onFinish, runBeforeNext, setCurrent, steps]);
|
|
85
|
+
const handleStepChange = useCallback(
|
|
86
|
+
async (nextIndex) => {
|
|
87
|
+
if (nextIndex === currentIndex || steps[nextIndex]?.disabled) return;
|
|
88
|
+
if (nextIndex > currentIndex) {
|
|
89
|
+
const ok = await runBeforeNext();
|
|
90
|
+
if (!ok) return;
|
|
91
|
+
}
|
|
92
|
+
setErrorMessage(null);
|
|
93
|
+
setCurrent(nextIndex);
|
|
94
|
+
},
|
|
95
|
+
[currentIndex, runBeforeNext, setCurrent, steps]
|
|
96
|
+
);
|
|
97
|
+
const contentNode = useMemo(() => {
|
|
98
|
+
if (!currentStep) return null;
|
|
99
|
+
if (renderStep) return renderStep(currentStep, currentIndex);
|
|
100
|
+
return currentStep.content ?? null;
|
|
101
|
+
}, [currentIndex, currentStep, renderStep]);
|
|
102
|
+
const stepsNodes = useMemo(
|
|
103
|
+
() => steps.map((step, index) => /* @__PURE__ */ jsx(
|
|
104
|
+
StepsItem,
|
|
105
|
+
{
|
|
106
|
+
title: step.title,
|
|
107
|
+
description: step.description,
|
|
108
|
+
status: step.status,
|
|
109
|
+
icon: step.icon,
|
|
110
|
+
disabled: step.disabled
|
|
111
|
+
},
|
|
112
|
+
step.key ?? index
|
|
113
|
+
)),
|
|
114
|
+
[steps]
|
|
115
|
+
);
|
|
116
|
+
return /* @__PURE__ */ jsxs("div", { className: wrapperClasses, style, "data-tiger-form-wizard": true, ...props, children: [
|
|
117
|
+
showSteps && steps.length > 0 && /* @__PURE__ */ jsx(
|
|
118
|
+
Steps,
|
|
119
|
+
{
|
|
120
|
+
current: currentIndex,
|
|
121
|
+
direction,
|
|
122
|
+
size,
|
|
123
|
+
simple,
|
|
124
|
+
clickable,
|
|
125
|
+
onChange: handleStepChange,
|
|
126
|
+
children: stepsNodes
|
|
127
|
+
}
|
|
128
|
+
),
|
|
129
|
+
errorMessage && /* @__PURE__ */ jsx(Alert, { type: "error", description: errorMessage, className: "tiger-form-wizard-alert" }),
|
|
130
|
+
/* @__PURE__ */ jsxs("div", { className: "tiger-form-wizard-body rounded-lg border border-[var(--tiger-border,#e5e7eb)] bg-[var(--tiger-surface,#ffffff)] p-6", children: [
|
|
131
|
+
contentNode,
|
|
132
|
+
showActions && /* @__PURE__ */ jsxs("div", { className: "tiger-form-wizard-actions flex items-center justify-between border-t border-[var(--tiger-border,#e5e7eb)] pt-4 mt-6", children: [
|
|
133
|
+
/* @__PURE__ */ jsx(Button, { type: "button", variant: "secondary", disabled: isFirst, onClick: handlePrev, children: prevText }),
|
|
134
|
+
/* @__PURE__ */ jsx(Button, { type: "button", variant: "primary", onClick: handleNext, children: isLast ? finishText : nextText })
|
|
135
|
+
] })
|
|
136
|
+
] })
|
|
137
|
+
] });
|
|
138
|
+
};
|
|
139
|
+
var FormWizard_default = FormWizard;
|
|
140
|
+
|
|
141
|
+
export { FormWizard, FormWizard_default };
|
|
@@ -0,0 +1,144 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var chunkGXTBCX3M_js = require('./chunk-GXTBCX3M.js');
|
|
4
|
+
var chunkA3DJSVTE_js = require('./chunk-A3DJSVTE.js');
|
|
5
|
+
var chunk3OF7XPIQ_js = require('./chunk-3OF7XPIQ.js');
|
|
6
|
+
var react = require('react');
|
|
7
|
+
var tigercatCore = require('@expcat/tigercat-core');
|
|
8
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
9
|
+
|
|
10
|
+
var FormWizard = ({
|
|
11
|
+
steps = [],
|
|
12
|
+
current,
|
|
13
|
+
defaultCurrent = 0,
|
|
14
|
+
clickable = false,
|
|
15
|
+
direction = "horizontal",
|
|
16
|
+
size = "default",
|
|
17
|
+
simple = false,
|
|
18
|
+
showSteps = true,
|
|
19
|
+
showActions = true,
|
|
20
|
+
prevText = "Previous",
|
|
21
|
+
nextText = "Next",
|
|
22
|
+
finishText = "Finish",
|
|
23
|
+
beforeNext,
|
|
24
|
+
onChange,
|
|
25
|
+
onFinish,
|
|
26
|
+
renderStep,
|
|
27
|
+
className,
|
|
28
|
+
style,
|
|
29
|
+
...props
|
|
30
|
+
}) => {
|
|
31
|
+
const [innerCurrent, setInnerCurrent] = react.useState(defaultCurrent);
|
|
32
|
+
const [errorMessage, setErrorMessage] = react.useState(null);
|
|
33
|
+
react.useEffect(() => {
|
|
34
|
+
if (current !== void 0) setInnerCurrent(current);
|
|
35
|
+
}, [current]);
|
|
36
|
+
const totalCount = steps.length;
|
|
37
|
+
const currentIndex = current ?? innerCurrent;
|
|
38
|
+
const currentStep = steps[currentIndex];
|
|
39
|
+
const isFirst = currentIndex <= 0;
|
|
40
|
+
const isLast = currentIndex >= totalCount - 1;
|
|
41
|
+
const wrapperClasses = tigercatCore.classNames("tiger-form-wizard flex flex-col gap-6 w-full", className);
|
|
42
|
+
const setCurrent = react.useCallback(
|
|
43
|
+
(next) => {
|
|
44
|
+
const max = Math.max(totalCount - 1, 0);
|
|
45
|
+
const clamped = Math.min(Math.max(next, 0), max);
|
|
46
|
+
if (current === void 0) {
|
|
47
|
+
setInnerCurrent(clamped);
|
|
48
|
+
}
|
|
49
|
+
onChange?.(clamped, currentIndex);
|
|
50
|
+
},
|
|
51
|
+
[current, currentIndex, onChange, totalCount]
|
|
52
|
+
);
|
|
53
|
+
const runBeforeNext = react.useCallback(async () => {
|
|
54
|
+
if (!beforeNext || !currentStep) {
|
|
55
|
+
setErrorMessage(null);
|
|
56
|
+
return true;
|
|
57
|
+
}
|
|
58
|
+
const result = await beforeNext(currentIndex, currentStep, steps);
|
|
59
|
+
if (result === true) {
|
|
60
|
+
setErrorMessage(null);
|
|
61
|
+
return true;
|
|
62
|
+
}
|
|
63
|
+
if (typeof result === "string") {
|
|
64
|
+
setErrorMessage(result);
|
|
65
|
+
} else {
|
|
66
|
+
setErrorMessage(null);
|
|
67
|
+
}
|
|
68
|
+
return false;
|
|
69
|
+
}, [beforeNext, currentIndex, currentStep, steps]);
|
|
70
|
+
const handlePrev = react.useCallback(() => {
|
|
71
|
+
if (currentIndex <= 0 || steps[currentIndex - 1]?.disabled) return;
|
|
72
|
+
setErrorMessage(null);
|
|
73
|
+
setCurrent(currentIndex - 1);
|
|
74
|
+
}, [currentIndex, setCurrent, steps]);
|
|
75
|
+
const handleNext = react.useCallback(async () => {
|
|
76
|
+
if (totalCount === 0) return;
|
|
77
|
+
const ok = await runBeforeNext();
|
|
78
|
+
if (!ok) return;
|
|
79
|
+
if (isLast) {
|
|
80
|
+
onFinish?.(currentIndex, steps);
|
|
81
|
+
return;
|
|
82
|
+
}
|
|
83
|
+
if (steps[currentIndex + 1]?.disabled) return;
|
|
84
|
+
setErrorMessage(null);
|
|
85
|
+
setCurrent(currentIndex + 1);
|
|
86
|
+
}, [currentIndex, totalCount, isLast, onFinish, runBeforeNext, setCurrent, steps]);
|
|
87
|
+
const handleStepChange = react.useCallback(
|
|
88
|
+
async (nextIndex) => {
|
|
89
|
+
if (nextIndex === currentIndex || steps[nextIndex]?.disabled) return;
|
|
90
|
+
if (nextIndex > currentIndex) {
|
|
91
|
+
const ok = await runBeforeNext();
|
|
92
|
+
if (!ok) return;
|
|
93
|
+
}
|
|
94
|
+
setErrorMessage(null);
|
|
95
|
+
setCurrent(nextIndex);
|
|
96
|
+
},
|
|
97
|
+
[currentIndex, runBeforeNext, setCurrent, steps]
|
|
98
|
+
);
|
|
99
|
+
const contentNode = react.useMemo(() => {
|
|
100
|
+
if (!currentStep) return null;
|
|
101
|
+
if (renderStep) return renderStep(currentStep, currentIndex);
|
|
102
|
+
return currentStep.content ?? null;
|
|
103
|
+
}, [currentIndex, currentStep, renderStep]);
|
|
104
|
+
const stepsNodes = react.useMemo(
|
|
105
|
+
() => steps.map((step, index) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
106
|
+
chunkGXTBCX3M_js.StepsItem,
|
|
107
|
+
{
|
|
108
|
+
title: step.title,
|
|
109
|
+
description: step.description,
|
|
110
|
+
status: step.status,
|
|
111
|
+
icon: step.icon,
|
|
112
|
+
disabled: step.disabled
|
|
113
|
+
},
|
|
114
|
+
step.key ?? index
|
|
115
|
+
)),
|
|
116
|
+
[steps]
|
|
117
|
+
);
|
|
118
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: wrapperClasses, style, "data-tiger-form-wizard": true, ...props, children: [
|
|
119
|
+
showSteps && steps.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(
|
|
120
|
+
chunkGXTBCX3M_js.Steps,
|
|
121
|
+
{
|
|
122
|
+
current: currentIndex,
|
|
123
|
+
direction,
|
|
124
|
+
size,
|
|
125
|
+
simple,
|
|
126
|
+
clickable,
|
|
127
|
+
onChange: handleStepChange,
|
|
128
|
+
children: stepsNodes
|
|
129
|
+
}
|
|
130
|
+
),
|
|
131
|
+
errorMessage && /* @__PURE__ */ jsxRuntime.jsx(chunk3OF7XPIQ_js.Alert, { type: "error", description: errorMessage, className: "tiger-form-wizard-alert" }),
|
|
132
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "tiger-form-wizard-body rounded-lg border border-[var(--tiger-border,#e5e7eb)] bg-[var(--tiger-surface,#ffffff)] p-6", children: [
|
|
133
|
+
contentNode,
|
|
134
|
+
showActions && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "tiger-form-wizard-actions flex items-center justify-between border-t border-[var(--tiger-border,#e5e7eb)] pt-4 mt-6", children: [
|
|
135
|
+
/* @__PURE__ */ jsxRuntime.jsx(chunkA3DJSVTE_js.Button, { type: "button", variant: "secondary", disabled: isFirst, onClick: handlePrev, children: prevText }),
|
|
136
|
+
/* @__PURE__ */ jsxRuntime.jsx(chunkA3DJSVTE_js.Button, { type: "button", variant: "primary", onClick: handleNext, children: isLast ? finishText : nextText })
|
|
137
|
+
] })
|
|
138
|
+
] })
|
|
139
|
+
] });
|
|
140
|
+
};
|
|
141
|
+
var FormWizard_default = FormWizard;
|
|
142
|
+
|
|
143
|
+
exports.FormWizard = FormWizard;
|
|
144
|
+
exports.FormWizard_default = FormWizard_default;
|
|
@@ -53,23 +53,33 @@ var FormItem = ({
|
|
|
53
53
|
}
|
|
54
54
|
return width;
|
|
55
55
|
}, [labelWidth, formContext?.labelWidth]);
|
|
56
|
+
const hasRequiredRule = React.useCallback((maybeRules) => {
|
|
57
|
+
if (!maybeRules) {
|
|
58
|
+
return false;
|
|
59
|
+
}
|
|
60
|
+
const rules2 = Array.isArray(maybeRules) ? maybeRules : [maybeRules];
|
|
61
|
+
return rules2.some((rule) => {
|
|
62
|
+
if (!rule || typeof rule !== "object") {
|
|
63
|
+
return false;
|
|
64
|
+
}
|
|
65
|
+
return !!rule.required;
|
|
66
|
+
});
|
|
67
|
+
}, []);
|
|
56
68
|
const showRequiredAsterisk = React.useMemo(() => {
|
|
57
69
|
if (required !== void 0) {
|
|
58
70
|
return required;
|
|
59
71
|
}
|
|
60
72
|
if (rules) {
|
|
61
|
-
|
|
62
|
-
return ruleArray.some((rule) => rule.required);
|
|
73
|
+
return hasRequiredRule(rules);
|
|
63
74
|
}
|
|
64
75
|
if (name && formContext?.rules) {
|
|
65
76
|
const fieldRules = formContext.rules[name];
|
|
66
77
|
if (fieldRules) {
|
|
67
|
-
|
|
68
|
-
return ruleArray.some((rule) => rule.required);
|
|
78
|
+
return hasRequiredRule(fieldRules);
|
|
69
79
|
}
|
|
70
80
|
}
|
|
71
81
|
return false;
|
|
72
|
-
}, [required, rules, name, formContext?.rules]);
|
|
82
|
+
}, [required, rules, name, formContext?.rules, hasRequiredRule]);
|
|
73
83
|
const isRequired = React.useMemo(
|
|
74
84
|
() => showRequiredAsterisk && (formContext?.showRequiredAsterisk ?? true),
|
|
75
85
|
[showRequiredAsterisk, formContext?.showRequiredAsterisk]
|
|
@@ -154,22 +164,24 @@ var FormItem = ({
|
|
|
154
164
|
]);
|
|
155
165
|
const formItemClasses = React.useMemo(
|
|
156
166
|
() => tigercatCore.classNames(
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
167
|
+
tigercatCore.getFormItemClasses({
|
|
168
|
+
size: actualSize,
|
|
169
|
+
labelPosition,
|
|
170
|
+
hasError,
|
|
171
|
+
disabled: formContext?.disabled
|
|
172
|
+
}),
|
|
162
173
|
className
|
|
163
174
|
),
|
|
164
175
|
[actualSize, labelPosition, hasError, formContext?.disabled, className]
|
|
165
176
|
);
|
|
166
177
|
const labelClasses = React.useMemo(
|
|
167
|
-
() => tigercatCore.
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
178
|
+
() => tigercatCore.getFormItemLabelClasses({
|
|
179
|
+
size: actualSize,
|
|
180
|
+
labelAlign,
|
|
181
|
+
labelPosition,
|
|
182
|
+
isRequired
|
|
183
|
+
}),
|
|
184
|
+
[actualSize, labelAlign, labelPosition, isRequired]
|
|
173
185
|
);
|
|
174
186
|
const labelStyles = React.useMemo(() => {
|
|
175
187
|
if (labelPosition === "top") {
|
|
@@ -178,9 +190,13 @@ var FormItem = ({
|
|
|
178
190
|
return actualLabelWidth ? { width: actualLabelWidth } : {};
|
|
179
191
|
}, [labelPosition, actualLabelWidth]);
|
|
180
192
|
const errorClasses = React.useMemo(
|
|
181
|
-
() => tigercatCore.classNames(
|
|
182
|
-
[hasError]
|
|
193
|
+
() => tigercatCore.classNames(tigercatCore.getFormItemErrorClasses(actualSize), hasError && "tiger-form-item__error--show"),
|
|
194
|
+
[actualSize, hasError]
|
|
183
195
|
);
|
|
196
|
+
const contentClasses = React.useMemo(() => tigercatCore.getFormItemContentClasses(labelPosition), [labelPosition]);
|
|
197
|
+
const fieldClasses = React.useMemo(() => tigercatCore.getFormItemFieldClasses(), []);
|
|
198
|
+
const asteriskClasses = React.useMemo(() => tigercatCore.getFormItemAsteriskClasses(), []);
|
|
199
|
+
const asteriskStyle = React.useMemo(() => tigercatCore.getFormItemAsteriskStyle(), []);
|
|
184
200
|
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: formItemClasses, children: [
|
|
185
201
|
label && /* @__PURE__ */ jsxRuntime.jsxs(
|
|
186
202
|
"label",
|
|
@@ -190,16 +206,16 @@ var FormItem = ({
|
|
|
190
206
|
style: labelStyles,
|
|
191
207
|
htmlFor: isClonableChild ? effectiveFieldId : void 0,
|
|
192
208
|
children: [
|
|
193
|
-
isRequired && /* @__PURE__ */ jsxRuntime.jsx("span", { className:
|
|
209
|
+
isRequired && /* @__PURE__ */ jsxRuntime.jsx("span", { className: asteriskClasses, style: asteriskStyle, children: "*" }),
|
|
194
210
|
label
|
|
195
211
|
]
|
|
196
212
|
}
|
|
197
213
|
),
|
|
198
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className:
|
|
214
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: contentClasses, children: [
|
|
199
215
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
200
216
|
"div",
|
|
201
217
|
{
|
|
202
|
-
className:
|
|
218
|
+
className: fieldClasses,
|
|
203
219
|
role: "group",
|
|
204
220
|
"aria-labelledby": label ? labelId : void 0,
|
|
205
221
|
"aria-describedby": describedById,
|
|
@@ -0,0 +1,209 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var chunkGJKT2B56_js = require('./chunk-GJKT2B56.js');
|
|
4
|
+
var chunkGY6D4XS3_js = require('./chunk-GY6D4XS3.js');
|
|
5
|
+
var chunkPBJ2J2B3_js = require('./chunk-PBJ2J2B3.js');
|
|
6
|
+
var chunk4TWHENPT_js = require('./chunk-4TWHENPT.js');
|
|
7
|
+
var chunkEQWQXURG_js = require('./chunk-EQWQXURG.js');
|
|
8
|
+
var chunkCIL2AC3F_js = require('./chunk-CIL2AC3F.js');
|
|
9
|
+
var chunkA3DJSVTE_js = require('./chunk-A3DJSVTE.js');
|
|
10
|
+
var react = require('react');
|
|
11
|
+
var tigercatCore = require('@expcat/tigercat-core');
|
|
12
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
13
|
+
|
|
14
|
+
var resolveFilterLabel = (filter, value) => {
|
|
15
|
+
const option = filter.options.find((item) => item.value === value);
|
|
16
|
+
if (option) return `${filter.label}: ${option.label}`;
|
|
17
|
+
if (value !== null && value !== void 0 && value !== "") {
|
|
18
|
+
return `${filter.label}: ${String(value)}`;
|
|
19
|
+
}
|
|
20
|
+
return filter.placeholder ?? filter.label;
|
|
21
|
+
};
|
|
22
|
+
var DataTableWithToolbar = ({
|
|
23
|
+
toolbar,
|
|
24
|
+
onSearchChange,
|
|
25
|
+
onSearch,
|
|
26
|
+
onFiltersChange,
|
|
27
|
+
onBulkAction,
|
|
28
|
+
pagination = false,
|
|
29
|
+
onPageChange,
|
|
30
|
+
onPageSizeChange,
|
|
31
|
+
className,
|
|
32
|
+
tableClassName,
|
|
33
|
+
...tableProps
|
|
34
|
+
}) => {
|
|
35
|
+
const [internalSearch, setInternalSearch] = react.useState(toolbar?.defaultSearchValue ?? "");
|
|
36
|
+
const [internalFilters, setInternalFilters] = react.useState(
|
|
37
|
+
() => {
|
|
38
|
+
const initial = {};
|
|
39
|
+
toolbar?.filters?.forEach((filter) => {
|
|
40
|
+
if (filter.value === void 0) {
|
|
41
|
+
initial[filter.key] = filter.defaultValue ?? null;
|
|
42
|
+
}
|
|
43
|
+
});
|
|
44
|
+
return initial;
|
|
45
|
+
}
|
|
46
|
+
);
|
|
47
|
+
react.useEffect(() => {
|
|
48
|
+
if (toolbar?.searchValue !== void 0) {
|
|
49
|
+
setInternalSearch(toolbar.searchValue ?? "");
|
|
50
|
+
}
|
|
51
|
+
}, [toolbar?.searchValue]);
|
|
52
|
+
react.useEffect(() => {
|
|
53
|
+
const filters = toolbar?.filters;
|
|
54
|
+
if (!filters) return;
|
|
55
|
+
setInternalFilters((prev) => {
|
|
56
|
+
const next = { ...prev };
|
|
57
|
+
filters.forEach((filter) => {
|
|
58
|
+
if (filter.value === void 0 && !(filter.key in next)) {
|
|
59
|
+
next[filter.key] = filter.defaultValue ?? null;
|
|
60
|
+
}
|
|
61
|
+
});
|
|
62
|
+
return next;
|
|
63
|
+
});
|
|
64
|
+
}, [toolbar?.filters]);
|
|
65
|
+
const searchValue = toolbar?.searchValue !== void 0 ? toolbar.searchValue : internalSearch;
|
|
66
|
+
const resolvedFilters = react.useMemo(() => {
|
|
67
|
+
const next = {};
|
|
68
|
+
toolbar?.filters?.forEach((filter) => {
|
|
69
|
+
next[filter.key] = filter.value !== void 0 ? filter.value : internalFilters[filter.key] ?? filter.defaultValue ?? null;
|
|
70
|
+
});
|
|
71
|
+
return next;
|
|
72
|
+
}, [toolbar?.filters, internalFilters]);
|
|
73
|
+
const hasSearch = Boolean(
|
|
74
|
+
toolbar && (toolbar.searchPlaceholder || toolbar.searchValue !== void 0 || toolbar.defaultSearchValue !== void 0 || toolbar.showSearchButton || toolbar.onSearchChange || toolbar.onSearch || onSearchChange || onSearch)
|
|
75
|
+
);
|
|
76
|
+
const hasFilters = Boolean(toolbar?.filters && toolbar.filters.length > 0);
|
|
77
|
+
const hasBulkActions = Boolean(toolbar?.bulkActions && toolbar.bulkActions.length > 0);
|
|
78
|
+
const selectedKeys = toolbar?.selectedKeys ?? tableProps.rowSelection?.selectedRowKeys ?? [];
|
|
79
|
+
const selectedCount = toolbar?.selectedCount ?? selectedKeys.length;
|
|
80
|
+
const bulkLabel = toolbar?.bulkActionsLabel ?? "\u5DF2\u9009\u62E9";
|
|
81
|
+
const wrapperClasses = react.useMemo(
|
|
82
|
+
() => tigercatCore.classNames("tiger-data-table-with-toolbar flex flex-col gap-3", className),
|
|
83
|
+
[className]
|
|
84
|
+
);
|
|
85
|
+
const handleSearchChange = (value) => {
|
|
86
|
+
if (toolbar?.searchValue === void 0) {
|
|
87
|
+
setInternalSearch(value);
|
|
88
|
+
}
|
|
89
|
+
onSearchChange?.(value);
|
|
90
|
+
toolbar?.onSearchChange?.(value);
|
|
91
|
+
};
|
|
92
|
+
const handleSearchSubmit = () => {
|
|
93
|
+
onSearch?.(searchValue ?? "");
|
|
94
|
+
toolbar?.onSearch?.(searchValue ?? "");
|
|
95
|
+
};
|
|
96
|
+
const handleFilterSelect = (filter, value) => {
|
|
97
|
+
const nextFilters = {
|
|
98
|
+
...resolvedFilters,
|
|
99
|
+
[filter.key]: value
|
|
100
|
+
};
|
|
101
|
+
if (filter.value === void 0) {
|
|
102
|
+
setInternalFilters((prev) => ({
|
|
103
|
+
...prev,
|
|
104
|
+
[filter.key]: value
|
|
105
|
+
}));
|
|
106
|
+
}
|
|
107
|
+
onFiltersChange?.(nextFilters);
|
|
108
|
+
toolbar?.onFiltersChange?.(nextFilters);
|
|
109
|
+
};
|
|
110
|
+
const handleBulkAction = (action) => {
|
|
111
|
+
const keys = selectedKeys ?? [];
|
|
112
|
+
action.onClick?.(keys);
|
|
113
|
+
onBulkAction?.(action, keys);
|
|
114
|
+
toolbar?.onBulkAction?.(action, keys);
|
|
115
|
+
};
|
|
116
|
+
const renderToolbar = () => {
|
|
117
|
+
if (!hasSearch && !hasFilters && !hasBulkActions) return null;
|
|
118
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "tiger-data-table-toolbar flex flex-wrap items-center gap-2", children: [
|
|
119
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 flex-wrap", children: [
|
|
120
|
+
hasSearch ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
|
|
121
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
122
|
+
chunkCIL2AC3F_js.Input,
|
|
123
|
+
{
|
|
124
|
+
type: "search",
|
|
125
|
+
size: "sm",
|
|
126
|
+
value: searchValue,
|
|
127
|
+
placeholder: toolbar?.searchPlaceholder ?? "\u641C\u7D22",
|
|
128
|
+
onChange: (event) => handleSearchChange(String(event.currentTarget.value)),
|
|
129
|
+
onKeyDown: (event) => {
|
|
130
|
+
if (event.key === "Enter") {
|
|
131
|
+
handleSearchSubmit();
|
|
132
|
+
}
|
|
133
|
+
}
|
|
134
|
+
}
|
|
135
|
+
),
|
|
136
|
+
toolbar?.showSearchButton ?? true ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
137
|
+
chunkA3DJSVTE_js.Button,
|
|
138
|
+
{
|
|
139
|
+
size: "sm",
|
|
140
|
+
variant: "primary",
|
|
141
|
+
className: "whitespace-nowrap",
|
|
142
|
+
onClick: handleSearchSubmit,
|
|
143
|
+
disabled: !onSearch && !toolbar?.onSearch,
|
|
144
|
+
children: toolbar?.searchButtonText ?? "\u641C\u7D22"
|
|
145
|
+
}
|
|
146
|
+
) : null
|
|
147
|
+
] }) : null,
|
|
148
|
+
hasFilters ? toolbar?.filters?.map((filter) => {
|
|
149
|
+
const currentValue = resolvedFilters[filter.key];
|
|
150
|
+
const triggerLabel = resolveFilterLabel(filter, currentValue);
|
|
151
|
+
const clearable = filter.clearable !== false;
|
|
152
|
+
const clearLabel = filter.clearLabel ?? "\u5168\u90E8";
|
|
153
|
+
const isActive = currentValue !== null && currentValue !== void 0 && currentValue !== "";
|
|
154
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(chunk4TWHENPT_js.Dropdown, { trigger: "click", children: [
|
|
155
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
156
|
+
chunkA3DJSVTE_js.Button,
|
|
157
|
+
{
|
|
158
|
+
size: "sm",
|
|
159
|
+
variant: isActive ? "secondary" : "outline",
|
|
160
|
+
className: "whitespace-nowrap",
|
|
161
|
+
children: triggerLabel
|
|
162
|
+
}
|
|
163
|
+
),
|
|
164
|
+
/* @__PURE__ */ jsxRuntime.jsxs(chunkEQWQXURG_js.DropdownMenu, { children: [
|
|
165
|
+
clearable ? /* @__PURE__ */ jsxRuntime.jsx(chunkPBJ2J2B3_js.DropdownItem, { onClick: () => handleFilterSelect(filter, null), children: clearLabel }) : null,
|
|
166
|
+
filter.options.map((option) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
167
|
+
chunkPBJ2J2B3_js.DropdownItem,
|
|
168
|
+
{
|
|
169
|
+
onClick: () => handleFilterSelect(filter, option.value),
|
|
170
|
+
children: option.label
|
|
171
|
+
},
|
|
172
|
+
String(option.value)
|
|
173
|
+
))
|
|
174
|
+
] })
|
|
175
|
+
] }, filter.key);
|
|
176
|
+
}) : null
|
|
177
|
+
] }),
|
|
178
|
+
hasBulkActions ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "ml-auto flex items-center gap-2 flex-wrap", children: [
|
|
179
|
+
selectedCount > 0 ? /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-sm text-[var(--tiger-text-muted,#6b7280)]", children: [
|
|
180
|
+
bulkLabel,
|
|
181
|
+
" ",
|
|
182
|
+
selectedCount,
|
|
183
|
+
" \u9879"
|
|
184
|
+
] }) : null,
|
|
185
|
+
toolbar?.bulkActions?.map((action) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
186
|
+
chunkA3DJSVTE_js.Button,
|
|
187
|
+
{
|
|
188
|
+
size: "sm",
|
|
189
|
+
variant: action.variant ?? "outline",
|
|
190
|
+
disabled: action.disabled || selectedCount === 0,
|
|
191
|
+
onClick: () => handleBulkAction(action),
|
|
192
|
+
children: action.label
|
|
193
|
+
},
|
|
194
|
+
action.key
|
|
195
|
+
))
|
|
196
|
+
] }) : null
|
|
197
|
+
] });
|
|
198
|
+
};
|
|
199
|
+
const showPagination = pagination && typeof pagination === "object";
|
|
200
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: wrapperClasses, "data-tiger-data-table-with-toolbar": true, children: [
|
|
201
|
+
renderToolbar(),
|
|
202
|
+
/* @__PURE__ */ jsxRuntime.jsx(chunkGJKT2B56_js.Table, { ...tableProps, pagination: false, className: tableClassName }),
|
|
203
|
+
showPagination ? /* @__PURE__ */ jsxRuntime.jsx(chunkGY6D4XS3_js.Pagination, { ...pagination, onChange: onPageChange, onPageSizeChange }) : null
|
|
204
|
+
] });
|
|
205
|
+
};
|
|
206
|
+
var DataTableWithToolbar_default = DataTableWithToolbar;
|
|
207
|
+
|
|
208
|
+
exports.DataTableWithToolbar = DataTableWithToolbar;
|
|
209
|
+
exports.DataTableWithToolbar_default = DataTableWithToolbar_default;
|