@tipp/ui 1.0.26 → 1.0.28
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/atoms/field-error-wrapper.js +2 -2
- package/dist/atoms/index.js +52 -52
- package/dist/atoms/pagination.js +3 -3
- package/dist/charts/index.js +1 -0
- package/dist/chunk-OL2I33HW.js +119 -0
- package/dist/chunk-OL2I33HW.js.map +1 -0
- package/dist/chunk-PSINRHYW.js +1 -0
- package/dist/chunk-PSINRHYW.js.map +1 -0
- package/dist/chunk-XG4N7OQF.js +104 -0
- package/dist/chunk-XG4N7OQF.js.map +1 -0
- package/dist/index.cjs +200 -0
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +1 -5
- package/dist/index.d.ts +1 -5
- package/dist/index.js +70 -59
- package/dist/molecules/date-picker/index.js +2 -2
- package/dist/molecules/expand-table/index.cjs +46 -397
- package/dist/molecules/expand-table/index.cjs.map +1 -1
- package/dist/molecules/expand-table/index.js +23 -23
- package/dist/molecules/expand-table/row.cjs +15 -433
- package/dist/molecules/expand-table/row.cjs.map +1 -1
- package/dist/molecules/expand-table/row.js +21 -21
- package/dist/molecules/index.cjs +80 -395
- package/dist/molecules/index.cjs.map +1 -1
- package/dist/molecules/index.js +25 -25
- package/dist/molecules/navigation.cjs +18 -359
- package/dist/molecules/navigation.cjs.map +1 -1
- package/dist/molecules/navigation.js +22 -22
- package/package.json +2 -31
- package/src/index.ts +1 -0
|
@@ -1,39 +1,8 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __create = Object.create;
|
|
3
2
|
var __defProp = Object.defineProperty;
|
|
4
|
-
var __defProps = Object.defineProperties;
|
|
5
3
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
6
|
-
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
7
4
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
8
|
-
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
9
|
-
var __getProtoOf = Object.getPrototypeOf;
|
|
10
5
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
11
|
-
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
12
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
13
|
-
var __spreadValues = (a, b) => {
|
|
14
|
-
for (var prop in b || (b = {}))
|
|
15
|
-
if (__hasOwnProp.call(b, prop))
|
|
16
|
-
__defNormalProp(a, prop, b[prop]);
|
|
17
|
-
if (__getOwnPropSymbols)
|
|
18
|
-
for (var prop of __getOwnPropSymbols(b)) {
|
|
19
|
-
if (__propIsEnum.call(b, prop))
|
|
20
|
-
__defNormalProp(a, prop, b[prop]);
|
|
21
|
-
}
|
|
22
|
-
return a;
|
|
23
|
-
};
|
|
24
|
-
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
25
|
-
var __objRest = (source, exclude) => {
|
|
26
|
-
var target = {};
|
|
27
|
-
for (var prop in source)
|
|
28
|
-
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
29
|
-
target[prop] = source[prop];
|
|
30
|
-
if (source != null && __getOwnPropSymbols)
|
|
31
|
-
for (var prop of __getOwnPropSymbols(source)) {
|
|
32
|
-
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
|
33
|
-
target[prop] = source[prop];
|
|
34
|
-
}
|
|
35
|
-
return target;
|
|
36
|
-
};
|
|
37
6
|
var __export = (target, all) => {
|
|
38
7
|
for (var name in all)
|
|
39
8
|
__defProp(target, name, { get: all[name], enumerable: true });
|
|
@@ -46,14 +15,6 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
46
15
|
}
|
|
47
16
|
return to;
|
|
48
17
|
};
|
|
49
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
50
|
-
// If the importer is in node compatibility mode or this is not an ESM
|
|
51
|
-
// file that has been converted to a CommonJS file using a Babel-
|
|
52
|
-
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
53
|
-
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
54
|
-
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
55
|
-
mod
|
|
56
|
-
));
|
|
57
18
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
58
19
|
|
|
59
20
|
// src/molecules/expand-table/row.tsx
|
|
@@ -63,425 +24,46 @@ __export(row_exports, {
|
|
|
63
24
|
});
|
|
64
25
|
module.exports = __toCommonJS(row_exports);
|
|
65
26
|
var import_react_table = require("@tanstack/react-table");
|
|
66
|
-
var import_react13 = require("react");
|
|
67
|
-
|
|
68
|
-
// src/atoms/alert-dialog.tsx
|
|
69
|
-
var import_themes = require("@radix-ui/themes");
|
|
70
|
-
|
|
71
|
-
// src/atoms/aspect-ratio.tsx
|
|
72
|
-
var import_themes2 = require("@radix-ui/themes");
|
|
73
|
-
|
|
74
|
-
// src/atoms/avatar.tsx
|
|
75
|
-
var import_themes3 = require("@radix-ui/themes");
|
|
76
|
-
var import_react = require("react");
|
|
77
|
-
var import_jsx_runtime = require("react/jsx-runtime");
|
|
78
|
-
var Avatar = (0, import_react.forwardRef)(
|
|
79
|
-
(props, ref) => {
|
|
80
|
-
const _a = props, { children, size, variant = "soft" } = _a, rest = __objRest(_a, ["children", "size", "variant"]);
|
|
81
|
-
const radixSize = (0, import_react.useMemo)(() => {
|
|
82
|
-
switch (size) {
|
|
83
|
-
case "small":
|
|
84
|
-
return "1";
|
|
85
|
-
case "medium":
|
|
86
|
-
return "2";
|
|
87
|
-
case "large":
|
|
88
|
-
return "3";
|
|
89
|
-
case "full":
|
|
90
|
-
return "4";
|
|
91
|
-
default:
|
|
92
|
-
return size;
|
|
93
|
-
}
|
|
94
|
-
}, [size]);
|
|
95
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_themes3.Avatar, __spreadProps(__spreadValues({}, rest), { ref, size: radixSize, variant, children }));
|
|
96
|
-
}
|
|
97
|
-
);
|
|
98
|
-
Avatar.displayName = "Avatar";
|
|
99
|
-
|
|
100
|
-
// src/atoms/badge.tsx
|
|
101
|
-
var import_themes4 = require("@radix-ui/themes");
|
|
102
27
|
var import_react2 = require("react");
|
|
103
|
-
var import_jsx_runtime2 = require("react/jsx-runtime");
|
|
104
|
-
var Badge = (0, import_react2.forwardRef)(
|
|
105
|
-
(props, ref) => {
|
|
106
|
-
const _a = props, { size, color } = _a, rest = __objRest(_a, ["size", "color"]);
|
|
107
|
-
const radixSize = (0, import_react2.useMemo)(() => {
|
|
108
|
-
switch (size) {
|
|
109
|
-
case "small":
|
|
110
|
-
return "1";
|
|
111
|
-
case "large":
|
|
112
|
-
return "3";
|
|
113
|
-
default:
|
|
114
|
-
return "1";
|
|
115
|
-
}
|
|
116
|
-
}, [size]);
|
|
117
|
-
const radixColor = (0, import_react2.useMemo)(() => {
|
|
118
|
-
switch (color) {
|
|
119
|
-
case "error":
|
|
120
|
-
return "red";
|
|
121
|
-
case "neutral":
|
|
122
|
-
return "gray";
|
|
123
|
-
case "success":
|
|
124
|
-
return "green";
|
|
125
|
-
case "accent":
|
|
126
|
-
default:
|
|
127
|
-
return void 0;
|
|
128
|
-
}
|
|
129
|
-
}, [color]);
|
|
130
|
-
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_themes4.Badge, __spreadProps(__spreadValues({}, rest), { color: radixColor, ref, size: radixSize }));
|
|
131
|
-
}
|
|
132
|
-
);
|
|
133
|
-
Badge.displayName = "Badge";
|
|
134
|
-
|
|
135
|
-
// src/atoms/blockquote.tsx
|
|
136
|
-
var import_themes5 = require("@radix-ui/themes");
|
|
137
|
-
|
|
138
|
-
// src/atoms/box.tsx
|
|
139
|
-
var import_themes6 = require("@radix-ui/themes");
|
|
140
|
-
|
|
141
|
-
// src/atoms/button.tsx
|
|
142
|
-
var import_themes7 = require("@radix-ui/themes");
|
|
143
|
-
var import_react3 = require("react");
|
|
144
|
-
var import_jsx_runtime3 = require("react/jsx-runtime");
|
|
145
|
-
var Button = (0, import_react3.forwardRef)(
|
|
146
|
-
(props, ref) => {
|
|
147
|
-
const _a = props, { size } = _a, restProps = __objRest(_a, ["size"]);
|
|
148
|
-
const radixSize = (0, import_react3.useMemo)(() => {
|
|
149
|
-
switch (size) {
|
|
150
|
-
case "small":
|
|
151
|
-
return "1";
|
|
152
|
-
case "medium":
|
|
153
|
-
return "2";
|
|
154
|
-
case "large":
|
|
155
|
-
return "3";
|
|
156
|
-
default:
|
|
157
|
-
return "2";
|
|
158
|
-
}
|
|
159
|
-
}, [size]);
|
|
160
|
-
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_themes7.Button, __spreadProps(__spreadValues({}, restProps), { ref, size: radixSize }));
|
|
161
|
-
}
|
|
162
|
-
);
|
|
163
|
-
Button.displayName = "Button";
|
|
164
|
-
|
|
165
|
-
// src/atoms/call-out.tsx
|
|
166
|
-
var import_themes8 = require("@radix-ui/themes");
|
|
167
|
-
|
|
168
|
-
// src/atoms/card.tsx
|
|
169
|
-
var import_themes9 = require("@radix-ui/themes");
|
|
170
|
-
|
|
171
|
-
// src/atoms/check-box.tsx
|
|
172
|
-
var import_themes10 = require("@radix-ui/themes");
|
|
173
|
-
var import_react4 = require("react");
|
|
174
|
-
var import_jsx_runtime4 = require("react/jsx-runtime");
|
|
175
|
-
var Checkbox = (0, import_react4.forwardRef)(
|
|
176
|
-
(props, ref) => {
|
|
177
|
-
const _a = props, { size = "medium" } = _a, rest = __objRest(_a, ["size"]);
|
|
178
|
-
const radixSize = (0, import_react4.useMemo)(() => {
|
|
179
|
-
switch (size) {
|
|
180
|
-
case "small":
|
|
181
|
-
return "1";
|
|
182
|
-
case "medium":
|
|
183
|
-
return "2";
|
|
184
|
-
case "large":
|
|
185
|
-
return "3";
|
|
186
|
-
}
|
|
187
|
-
}, [size]);
|
|
188
|
-
return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_themes10.Checkbox, __spreadProps(__spreadValues({}, rest), { ref, size: radixSize }));
|
|
189
|
-
}
|
|
190
|
-
);
|
|
191
|
-
Checkbox.displayName = "Checkbox";
|
|
192
|
-
|
|
193
|
-
// src/atoms/check-box-card.tsx
|
|
194
|
-
var import_themes11 = require("@radix-ui/themes");
|
|
195
|
-
|
|
196
|
-
// src/atoms/check-box-group.tsx
|
|
197
|
-
var import_themes12 = require("@radix-ui/themes");
|
|
198
|
-
var import_react5 = require("react");
|
|
199
|
-
var import_jsx_runtime5 = require("react/jsx-runtime");
|
|
200
|
-
var Root = (0, import_react5.forwardRef)((props, ref) => {
|
|
201
|
-
const _a = props, { children, size } = _a, rest = __objRest(_a, ["children", "size"]);
|
|
202
|
-
const groupSize = (0, import_react5.useMemo)(() => {
|
|
203
|
-
switch (size) {
|
|
204
|
-
case "small":
|
|
205
|
-
return "1";
|
|
206
|
-
case "large":
|
|
207
|
-
return "3";
|
|
208
|
-
case "medium":
|
|
209
|
-
default:
|
|
210
|
-
return "2";
|
|
211
|
-
}
|
|
212
|
-
}, [size]);
|
|
213
|
-
return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_themes12.CheckboxGroup.Root, __spreadProps(__spreadValues({}, rest), { ref, size: groupSize, children }));
|
|
214
|
-
});
|
|
215
|
-
Root.displayName = "CheckboxGroup.Root";
|
|
216
|
-
var CheckboxGroup = {
|
|
217
|
-
Root,
|
|
218
|
-
Item: import_themes12.CheckboxGroup.Item
|
|
219
|
-
};
|
|
220
|
-
|
|
221
|
-
// src/atoms/code.tsx
|
|
222
|
-
var import_themes13 = require("@radix-ui/themes");
|
|
223
|
-
|
|
224
|
-
// src/atoms/container.tsx
|
|
225
|
-
var import_themes14 = require("@radix-ui/themes");
|
|
226
|
-
|
|
227
|
-
// src/atoms/data-list.tsx
|
|
228
|
-
var import_themes15 = require("@radix-ui/themes");
|
|
229
|
-
|
|
230
|
-
// src/atoms/dialog.tsx
|
|
231
|
-
var import_themes16 = require("@radix-ui/themes");
|
|
232
|
-
|
|
233
|
-
// src/atoms/dropdown-menu.tsx
|
|
234
|
-
var import_themes17 = require("@radix-ui/themes");
|
|
235
|
-
|
|
236
|
-
// src/atoms/em.tsx
|
|
237
|
-
var import_themes18 = require("@radix-ui/themes");
|
|
238
|
-
|
|
239
|
-
// src/atoms/flex.tsx
|
|
240
|
-
var import_themes19 = require("@radix-ui/themes");
|
|
241
|
-
|
|
242
|
-
// src/atoms/grid.tsx
|
|
243
|
-
var import_themes20 = require("@radix-ui/themes");
|
|
244
|
-
|
|
245
|
-
// src/atoms/heading.tsx
|
|
246
|
-
var import_themes21 = require("@radix-ui/themes");
|
|
247
|
-
var import_react6 = require("react");
|
|
248
|
-
var import_themes22 = require("@radix-ui/themes");
|
|
249
|
-
var import_jsx_runtime6 = require("react/jsx-runtime");
|
|
250
|
-
|
|
251
|
-
// src/atoms/hover-card.tsx
|
|
252
|
-
var import_themes23 = require("@radix-ui/themes");
|
|
253
|
-
|
|
254
|
-
// src/atoms/icon-button.tsx
|
|
255
|
-
var import_themes24 = require("@radix-ui/themes");
|
|
256
|
-
|
|
257
|
-
// src/atoms/inset.tsx
|
|
258
|
-
var import_themes25 = require("@radix-ui/themes");
|
|
259
|
-
|
|
260
|
-
// src/atoms/kbd.tsx
|
|
261
|
-
var import_themes26 = require("@radix-ui/themes");
|
|
262
|
-
|
|
263
|
-
// src/atoms/link.tsx
|
|
264
|
-
var import_themes27 = require("@radix-ui/themes");
|
|
265
|
-
var import_react7 = require("react");
|
|
266
|
-
var import_themes28 = require("@radix-ui/themes");
|
|
267
|
-
var import_jsx_runtime7 = require("react/jsx-runtime");
|
|
268
|
-
|
|
269
|
-
// src/atoms/popover.tsx
|
|
270
|
-
var import_themes29 = require("@radix-ui/themes");
|
|
271
|
-
|
|
272
|
-
// src/atoms/progress.tsx
|
|
273
|
-
var import_themes30 = require("@radix-ui/themes");
|
|
274
|
-
|
|
275
|
-
// src/atoms/quote.tsx
|
|
276
|
-
var import_themes31 = require("@radix-ui/themes");
|
|
277
|
-
|
|
278
|
-
// src/atoms/radio.tsx
|
|
279
|
-
var import_themes32 = require("@radix-ui/themes");
|
|
280
|
-
|
|
281
|
-
// src/atoms/radio-cards.tsx
|
|
282
|
-
var import_themes33 = require("@radix-ui/themes");
|
|
283
|
-
|
|
284
|
-
// src/atoms/radio-group.tsx
|
|
285
|
-
var import_themes34 = require("@radix-ui/themes");
|
|
286
|
-
|
|
287
|
-
// src/atoms/scroll-area.tsx
|
|
288
|
-
var import_themes35 = require("@radix-ui/themes");
|
|
289
|
-
|
|
290
|
-
// src/atoms/section.tsx
|
|
291
|
-
var import_themes36 = require("@radix-ui/themes");
|
|
292
|
-
|
|
293
|
-
// src/atoms/segmented-control.tsx
|
|
294
|
-
var import_themes37 = require("@radix-ui/themes");
|
|
295
|
-
|
|
296
|
-
// src/atoms/select.tsx
|
|
297
|
-
var import_themes38 = require("@radix-ui/themes");
|
|
298
|
-
|
|
299
|
-
// src/atoms/separator.tsx
|
|
300
|
-
var import_themes39 = require("@radix-ui/themes");
|
|
301
|
-
|
|
302
|
-
// src/atoms/skeleton.tsx
|
|
303
|
-
var import_themes40 = require("@radix-ui/themes");
|
|
304
|
-
|
|
305
|
-
// src/atoms/strong.tsx
|
|
306
|
-
var import_themes41 = require("@radix-ui/themes");
|
|
307
|
-
|
|
308
|
-
// src/atoms/switch.tsx
|
|
309
|
-
var import_themes42 = require("@radix-ui/themes");
|
|
310
|
-
|
|
311
|
-
// src/atoms/tab-nav.tsx
|
|
312
|
-
var import_themes43 = require("@radix-ui/themes");
|
|
313
|
-
|
|
314
|
-
// src/atoms/tabs.tsx
|
|
315
|
-
var import_themes44 = require("@radix-ui/themes");
|
|
316
|
-
|
|
317
|
-
// src/atoms/text-area.tsx
|
|
318
|
-
var import_themes45 = require("@radix-ui/themes");
|
|
319
|
-
|
|
320
|
-
// src/atoms/typo.tsx
|
|
321
|
-
var import_themes46 = require("@radix-ui/themes");
|
|
322
|
-
var import_react8 = require("react");
|
|
323
|
-
var import_jsx_runtime8 = require("react/jsx-runtime");
|
|
324
|
-
var Typo = (0, import_react8.forwardRef)(
|
|
325
|
-
(props, ref) => {
|
|
326
|
-
const _a = props, { size, variant, children } = _a, rest = __objRest(_a, ["size", "variant", "children"]);
|
|
327
|
-
const radixSize = (0, import_react8.useMemo)(() => {
|
|
328
|
-
if (size !== void 0)
|
|
329
|
-
return size;
|
|
330
|
-
switch (variant) {
|
|
331
|
-
case "caption":
|
|
332
|
-
return "1";
|
|
333
|
-
case "subtitle":
|
|
334
|
-
return "3";
|
|
335
|
-
case "body":
|
|
336
|
-
default:
|
|
337
|
-
return "2";
|
|
338
|
-
}
|
|
339
|
-
}, [size, variant]);
|
|
340
|
-
return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_themes46.Text, __spreadProps(__spreadValues({}, rest), { ref, size: radixSize, children }));
|
|
341
|
-
}
|
|
342
|
-
);
|
|
343
|
-
Typo.displayName = "Typo";
|
|
344
|
-
|
|
345
|
-
// src/atoms/text-field.tsx
|
|
346
|
-
var import_themes47 = require("@radix-ui/themes");
|
|
347
|
-
|
|
348
|
-
// src/atoms/tooltip.tsx
|
|
349
|
-
var import_themes48 = require("@radix-ui/themes");
|
|
350
28
|
|
|
351
29
|
// src/atoms/collapse.tsx
|
|
352
|
-
var
|
|
353
|
-
var
|
|
30
|
+
var import_react = require("react");
|
|
31
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
354
32
|
function Collapse(props) {
|
|
355
33
|
const { children, closedHeight = "0" } = props;
|
|
356
|
-
const [open, setOpen] = (0,
|
|
34
|
+
const [open, setOpen] = (0, import_react.useState)(() => {
|
|
357
35
|
return props.open || props.defaultOpen || false;
|
|
358
36
|
});
|
|
359
|
-
(0,
|
|
37
|
+
(0, import_react.useEffect)(() => {
|
|
360
38
|
if (props.open === void 0)
|
|
361
39
|
return;
|
|
362
40
|
setOpen(props.open);
|
|
363
41
|
}, [props.open]);
|
|
364
|
-
const ref = (0,
|
|
365
|
-
(0,
|
|
42
|
+
const ref = (0, import_react.useRef)(null);
|
|
43
|
+
(0, import_react.useEffect)(() => {
|
|
366
44
|
if (!ref.current)
|
|
367
45
|
return;
|
|
368
46
|
ref.current.style.maxHeight = open ? `${ref.current.scrollHeight}px` : closedHeight;
|
|
369
47
|
}, [closedHeight, open]);
|
|
370
|
-
return /* @__PURE__ */ (0,
|
|
48
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "collapse", ref, children });
|
|
371
49
|
}
|
|
372
50
|
|
|
373
|
-
// src/atoms/spinner.tsx
|
|
374
|
-
var import_themes49 = require("@radix-ui/themes");
|
|
375
|
-
|
|
376
|
-
// src/atoms/pagination.tsx
|
|
377
|
-
var import_react10 = require("react");
|
|
378
|
-
|
|
379
|
-
// src/icon.ts
|
|
380
|
-
var import_react_icons = require("@radix-ui/react-icons");
|
|
381
|
-
|
|
382
|
-
// src/atoms/pagination.tsx
|
|
383
|
-
var import_jsx_runtime10 = require("react/jsx-runtime");
|
|
384
|
-
|
|
385
|
-
// src/atoms/field-error-wrapper.tsx
|
|
386
|
-
var import_jsx_runtime11 = require("react/jsx-runtime");
|
|
387
|
-
|
|
388
|
-
// src/atoms/ellipsis-tooltip.tsx
|
|
389
|
-
var import_react11 = require("react");
|
|
390
|
-
var import_jsx_runtime12 = require("react/jsx-runtime");
|
|
391
|
-
|
|
392
|
-
// src/atoms/drawer.tsx
|
|
393
|
-
var Dialog2 = __toESM(require("@radix-ui/react-dialog"), 1);
|
|
394
|
-
|
|
395
|
-
// src/theme/theme-provider.tsx
|
|
396
|
-
var import_themes50 = require("@radix-ui/themes");
|
|
397
|
-
var import_jsx_runtime13 = require("react/jsx-runtime");
|
|
398
|
-
|
|
399
|
-
// src/atoms/toast.tsx
|
|
400
|
-
var import_react_icons2 = require("@radix-ui/react-icons");
|
|
401
|
-
var import_react_toastify = require("react-toastify");
|
|
402
|
-
var import_react_toastify2 = require("react-toastify");
|
|
403
|
-
var import_jsx_runtime14 = require("react/jsx-runtime");
|
|
404
|
-
|
|
405
|
-
// src/atoms/drawer.tsx
|
|
406
|
-
var import_jsx_runtime15 = require("react/jsx-runtime");
|
|
407
|
-
|
|
408
|
-
// src/atoms/form.tsx
|
|
409
|
-
var RadixForm = __toESM(require("@radix-ui/react-form"), 1);
|
|
410
|
-
var import_react12 = require("react");
|
|
411
|
-
var import_jsx_runtime16 = require("react/jsx-runtime");
|
|
412
|
-
var Root4 = (0, import_react12.forwardRef)(
|
|
413
|
-
(_a, ref) => {
|
|
414
|
-
var _b = _a, { children, className } = _b, rest = __objRest(_b, ["children", "className"]);
|
|
415
|
-
return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
416
|
-
RadixForm.Root,
|
|
417
|
-
__spreadProps(__spreadValues({}, rest), {
|
|
418
|
-
className: `FormRoot ${className || ""}`,
|
|
419
|
-
ref,
|
|
420
|
-
children
|
|
421
|
-
})
|
|
422
|
-
);
|
|
423
|
-
}
|
|
424
|
-
);
|
|
425
|
-
Root4.displayName = "FORM_ROOT";
|
|
426
|
-
var Field2 = (0, import_react12.forwardRef)(
|
|
427
|
-
(_a, ref) => {
|
|
428
|
-
var _b = _a, { children, className } = _b, rest = __objRest(_b, ["children", "className"]);
|
|
429
|
-
return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
430
|
-
RadixForm.Field,
|
|
431
|
-
__spreadProps(__spreadValues({}, rest), {
|
|
432
|
-
className: `FormField ${className || ""}`,
|
|
433
|
-
ref,
|
|
434
|
-
children
|
|
435
|
-
})
|
|
436
|
-
);
|
|
437
|
-
}
|
|
438
|
-
);
|
|
439
|
-
Field2.displayName = "FORM_FIELD";
|
|
440
|
-
var Label2 = (0, import_react12.forwardRef)(
|
|
441
|
-
(_a, ref) => {
|
|
442
|
-
var _b = _a, { children, className } = _b, rest = __objRest(_b, ["children", "className"]);
|
|
443
|
-
return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
444
|
-
RadixForm.Label,
|
|
445
|
-
__spreadProps(__spreadValues({}, rest), {
|
|
446
|
-
className: `FormLabel ${className || ""}`,
|
|
447
|
-
ref,
|
|
448
|
-
children
|
|
449
|
-
})
|
|
450
|
-
);
|
|
451
|
-
}
|
|
452
|
-
);
|
|
453
|
-
Label2.displayName = "FORM_Label";
|
|
454
|
-
var Message2 = (0, import_react12.forwardRef)(
|
|
455
|
-
(_a, ref) => {
|
|
456
|
-
var _b = _a, { children, className } = _b, rest = __objRest(_b, ["children", "className"]);
|
|
457
|
-
return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
|
458
|
-
RadixForm.Message,
|
|
459
|
-
__spreadProps(__spreadValues({}, rest), {
|
|
460
|
-
className: `FormMessage ${className || ""}`,
|
|
461
|
-
ref,
|
|
462
|
-
children
|
|
463
|
-
})
|
|
464
|
-
);
|
|
465
|
-
}
|
|
466
|
-
);
|
|
467
|
-
Message2.displayName = "FORM_Message";
|
|
468
|
-
|
|
469
51
|
// src/molecules/expand-table/row.tsx
|
|
470
|
-
var
|
|
52
|
+
var import_jsx_runtime2 = require("react/jsx-runtime");
|
|
471
53
|
function Row(props) {
|
|
472
54
|
const { row, ExpandComp, gridColTemp } = props;
|
|
473
|
-
const [open, setOpen] = (0,
|
|
474
|
-
const onClickRow = (0,
|
|
55
|
+
const [open, setOpen] = (0, import_react2.useState)(false);
|
|
56
|
+
const onClickRow = (0, import_react2.useCallback)(() => {
|
|
475
57
|
var _a;
|
|
476
58
|
(_a = props.onRowClick) == null ? void 0 : _a.call(props, row.original);
|
|
477
59
|
setOpen((prev) => !prev);
|
|
478
60
|
}, [props, row.original]);
|
|
479
|
-
return /* @__PURE__ */ (0,
|
|
61
|
+
return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
|
|
480
62
|
"div",
|
|
481
63
|
{
|
|
482
64
|
className: `tr-wrapper ${ExpandComp ? "expandable" : ""}`,
|
|
483
65
|
children: [
|
|
484
|
-
/* @__PURE__ */ (0,
|
|
66
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
485
67
|
"button",
|
|
486
68
|
{
|
|
487
69
|
className: "tr",
|
|
@@ -491,7 +73,7 @@ function Row(props) {
|
|
|
491
73
|
children: row.getVisibleCells().map((cell) => {
|
|
492
74
|
var _a, _b;
|
|
493
75
|
const autoSize = (_a = cell.column.columnDef.meta) == null ? void 0 : _a.autoSize;
|
|
494
|
-
return /* @__PURE__ */ (0,
|
|
76
|
+
return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
|
|
495
77
|
"div",
|
|
496
78
|
{
|
|
497
79
|
className: "td",
|
|
@@ -501,7 +83,7 @@ function Row(props) {
|
|
|
501
83
|
},
|
|
502
84
|
children: [
|
|
503
85
|
(0, import_react_table.flexRender)(cell.column.columnDef.cell, cell.getContext()),
|
|
504
|
-
((_b = cell.column.columnDef.meta) == null ? void 0 : _b.OpenBtn) ? /* @__PURE__ */ (0,
|
|
86
|
+
((_b = cell.column.columnDef.meta) == null ? void 0 : _b.OpenBtn) ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
505
87
|
cell.column.columnDef.meta.OpenBtn,
|
|
506
88
|
{
|
|
507
89
|
data: row.original,
|
|
@@ -517,7 +99,7 @@ function Row(props) {
|
|
|
517
99
|
},
|
|
518
100
|
`tr_${row.id}`
|
|
519
101
|
),
|
|
520
|
-
ExpandComp ? /* @__PURE__ */ (0,
|
|
102
|
+
ExpandComp ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Collapse, { open, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "expand-comp-wrapper", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(ExpandComp, { row }) }) }) : null
|
|
521
103
|
]
|
|
522
104
|
},
|
|
523
105
|
`tr-wrapper_${row.id}`
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/molecules/expand-table/row.tsx","../../../src/atoms/alert-dialog.tsx","../../../src/atoms/aspect-ratio.tsx","../../../src/atoms/avatar.tsx","../../../src/atoms/badge.tsx","../../../src/atoms/blockquote.tsx","../../../src/atoms/box.tsx","../../../src/atoms/button.tsx","../../../src/atoms/call-out.tsx","../../../src/atoms/card.tsx","../../../src/atoms/check-box.tsx","../../../src/atoms/check-box-card.tsx","../../../src/atoms/check-box-group.tsx","../../../src/atoms/code.tsx","../../../src/atoms/container.tsx","../../../src/atoms/data-list.tsx","../../../src/atoms/dialog.tsx","../../../src/atoms/dropdown-menu.tsx","../../../src/atoms/em.tsx","../../../src/atoms/flex.tsx","../../../src/atoms/grid.tsx","../../../src/atoms/heading.tsx","../../../src/atoms/hover-card.tsx","../../../src/atoms/icon-button.tsx","../../../src/atoms/inset.tsx","../../../src/atoms/kbd.tsx","../../../src/atoms/link.tsx","../../../src/atoms/popover.tsx","../../../src/atoms/progress.tsx","../../../src/atoms/quote.tsx","../../../src/atoms/radio.tsx","../../../src/atoms/radio-cards.tsx","../../../src/atoms/radio-group.tsx","../../../src/atoms/scroll-area.tsx","../../../src/atoms/section.tsx","../../../src/atoms/segmented-control.tsx","../../../src/atoms/select.tsx","../../../src/atoms/separator.tsx","../../../src/atoms/skeleton.tsx","../../../src/atoms/strong.tsx","../../../src/atoms/switch.tsx","../../../src/atoms/tab-nav.tsx","../../../src/atoms/tabs.tsx","../../../src/atoms/text-area.tsx","../../../src/atoms/typo.tsx","../../../src/atoms/text-field.tsx","../../../src/atoms/tooltip.tsx","../../../src/atoms/collapse.tsx","../../../src/atoms/spinner.tsx","../../../src/atoms/pagination.tsx","../../../src/icon.ts","../../../src/atoms/field-error-wrapper.tsx","../../../src/atoms/ellipsis-tooltip.tsx","../../../src/atoms/drawer.tsx","../../../src/theme/theme-provider.tsx","../../../src/atoms/toast.tsx","../../../src/atoms/form.tsx"],"sourcesContent":["import {\n type Row as TanstackRow,\n type RowData,\n flexRender,\n} from '@tanstack/react-table';\nimport React, { useCallback, useState } from 'react';\nimport { Collapse } from '../../atoms';\n\nexport type ExpandComp<Datum> = React.FC<{ row: TanstackRow<Datum> }>;\nexport type OnRowClick<Datum> = (data: Datum) => void;\n\ninterface RowProps<Datum extends RowData> {\n row: TanstackRow<Datum>;\n ExpandComp?: ExpandComp<Datum>;\n onRowClick?: OnRowClick<Datum>;\n gridColTemp: string;\n}\n\nexport function Row<Datum extends RowData>(\n props: RowProps<Datum>\n): React.ReactNode {\n const { row, ExpandComp, gridColTemp } = props;\n const [open, setOpen] = useState(false);\n\n const onClickRow = useCallback(() => {\n props.onRowClick?.(row.original);\n setOpen((prev) => !prev);\n }, [props, row.original]);\n\n return (\n <div\n className={`tr-wrapper ${ExpandComp ? 'expandable' : ''}`}\n key={`tr-wrapper_${row.id}`}\n >\n <button\n className=\"tr\"\n key={`tr_${row.id}`}\n onClick={onClickRow}\n style={{ gridTemplateColumns: gridColTemp }}\n type=\"button\"\n >\n {row.getVisibleCells().map((cell) => {\n const autoSize = cell.column.columnDef.meta?.autoSize;\n\n return (\n <div\n className=\"td\"\n key={cell.id}\n style={{\n minWidth: autoSize ? undefined : cell.column.getSize(),\n flexGrow: autoSize ? 1 : undefined,\n }}\n >\n {flexRender(cell.column.columnDef.cell, cell.getContext())}\n {cell.column.columnDef.meta?.OpenBtn ? (\n <cell.column.columnDef.meta.OpenBtn\n data={row.original}\n open={open}\n setIsOpen={setOpen}\n />\n ) : null}\n </div>\n );\n })}\n </button>\n {ExpandComp ? (\n <Collapse open={open} >\n <div className=\"expand-comp-wrapper\">\n <ExpandComp row={row} />\n </div>\n </Collapse>\n ) : null}\n </div>\n );\n}\n","export { AlertDialog } from '@radix-ui/themes';\n","export { AspectRatio } from '@radix-ui/themes';\n","import {\n Avatar as RadixAvatar,\n type AvatarProps as RadixAvatarProps,\n} from '@radix-ui/themes';\nimport { useMemo, forwardRef } from 'react';\n\nexport type AvatarProps = Omit<RadixAvatarProps, 'size'> & {\n size?: 'small' | 'medium' | 'large' | 'full';\n};\n\nexport const Avatar = forwardRef<HTMLImageElement, AvatarProps>(\n (props: AvatarProps, ref): React.ReactNode => {\n const { children, size, variant = 'soft', ...rest } = props;\n const radixSize = useMemo<RadixAvatarProps['size']>(() => {\n switch (size) {\n case 'small':\n return '1';\n case 'medium':\n return '2';\n case 'large':\n return '3';\n case 'full':\n return '4';\n default:\n return size;\n }\n }, [size]);\n\n return (\n <RadixAvatar {...rest} ref={ref} size={radixSize} variant={variant}>\n {children}\n </RadixAvatar>\n );\n }\n);\n\nAvatar.displayName = 'Avatar';\n","import {\n Badge as RadixBadge,\n type BadgeProps as RadixBadgeProps,\n} from '@radix-ui/themes';\nimport { useMemo, forwardRef } from 'react';\n\nexport type BadgeProps = Omit<RadixBadgeProps, 'color'> & {\n size: 'small' | 'large';\n color: 'error' | 'accent' | 'neutral' | 'success';\n};\n\nexport const Badge = forwardRef<HTMLSpanElement, BadgeProps>(\n (props: BadgeProps, ref): React.ReactNode => {\n const { size, color, ...rest } = props;\n\n const radixSize = useMemo(() => {\n switch (size) {\n case 'small':\n return '1';\n case 'large':\n return '3';\n default:\n return '1';\n }\n }, [size]);\n\n const radixColor = useMemo(() => {\n switch (color) {\n case 'error':\n return 'red';\n case 'neutral':\n return 'gray';\n case 'success':\n return 'green';\n case 'accent':\n default:\n return undefined;\n }\n }, [color]);\n\n return (\n <RadixBadge {...rest} color={radixColor} ref={ref} size={radixSize} />\n );\n }\n);\n\nBadge.displayName = 'Badge';\n","export { Blockquote, type BlockquoteProps } from '@radix-ui/themes';\n","export { Box, type BoxProps } from '@radix-ui/themes';\n","import {\n Button as RadixButton,\n type ButtonProps as RadixButtonProps,\n} from '@radix-ui/themes';\nimport React, { forwardRef, useMemo } from 'react';\n\nexport type ButtonProps = Omit<RadixButtonProps, 'size'> & {\n size?: 'small' | 'medium' | 'large';\n};\n\nexport const Button = forwardRef<HTMLButtonElement, ButtonProps>(\n (props, ref): React.ReactNode => {\n const { size, ...restProps } = props;\n\n const radixSize = useMemo(() => {\n switch (size) {\n case 'small':\n return '1';\n case 'medium':\n return '2';\n case 'large':\n return '3';\n default:\n return '2';\n }\n }, [size]);\n\n return <RadixButton {...restProps} ref={ref} size={radixSize} />;\n }\n);\n\nButton.displayName = 'Button';\n","export { Callout } from '@radix-ui/themes';\n","export { Card, type CardProps } from '@radix-ui/themes';\n","import {\n Checkbox as RadixCheckbox,\n type CheckboxProps as RadixCheckboxProps,\n} from '@radix-ui/themes';\nimport { useMemo, forwardRef } from 'react';\n\nexport type CheckboxProps = Omit<RadixCheckboxProps, 'size'> & {\n size?: 'small' | 'medium' | 'large';\n};\n\nexport const Checkbox = forwardRef<HTMLButtonElement, CheckboxProps>(\n (props, ref): React.ReactNode => {\n const { size = 'medium', ...rest } = props;\n\n const radixSize = useMemo<RadixCheckboxProps['size']>(() => {\n switch (size) {\n case 'small':\n return '1';\n case 'medium':\n return '2';\n case 'large':\n return '3';\n }\n }, [size]);\n\n return <RadixCheckbox {...rest} ref={ref} size={radixSize} />;\n }\n);\n\nCheckbox.displayName = 'Checkbox';\n","export { CheckboxCards } from '@radix-ui/themes';\n","import { CheckboxGroup as RadixCheckboxGroup } from '@radix-ui/themes';\nimport React, { forwardRef, useMemo } from 'react';\n\ntype RadixCheckboxGroupProps = React.ComponentPropsWithoutRef<\n typeof RadixCheckboxGroup.Root\n>;\ntype CheckboxGroupProps = Omit<RadixCheckboxGroupProps, 'size'> & {\n size: 'small' | 'medium' | 'large';\n};\n\nconst Root = forwardRef<HTMLDivElement, CheckboxGroupProps>((props, ref) => {\n const { children, size, ...rest } = props;\n\n const groupSize = useMemo<RadixCheckboxGroupProps['size']>(() => {\n switch (size) {\n case 'small':\n return '1';\n case 'large':\n return '3';\n case 'medium':\n default:\n return '2';\n }\n }, [size]);\n\n return (\n <RadixCheckboxGroup.Root {...rest} ref={ref} size={groupSize}>\n {children}\n </RadixCheckboxGroup.Root>\n );\n});\n\nRoot.displayName = 'CheckboxGroup.Root';\n\nexport const CheckboxGroup = {\n Root,\n Item: RadixCheckboxGroup.Item,\n};\n","export { Code, type CodeProps } from '@radix-ui/themes';\n","export { Container, type ContainerProps } from '@radix-ui/themes';\n","export { DataList } from '@radix-ui/themes';\n","export { Dialog } from '@radix-ui/themes';\n","export { DropdownMenu } from '@radix-ui/themes';\n","export { Em, type EmProps } from '@radix-ui/themes';\n","export { Flex, type FlexProps } from '@radix-ui/themes';\n","export { Grid, type GridProps } from '@radix-ui/themes';\n","import {\n Heading as RadixHeading,\n type HeadingProps as RadixHeadingProps,\n} from '@radix-ui/themes';\nimport { useMemo } from 'react';\n\nexport { Heading as RadixHeading } from '@radix-ui/themes';\n\nexport type HeadingProps = RadixHeadingProps & {\n variant?: 'subtitle1' | 'heading1' | 'heading2' | 'heading3';\n};\n\nexport function Heading(props: HeadingProps): React.ReactNode {\n const { size, children, variant, ...rest } = props;\n const radixSize = useMemo<RadixHeadingProps['size']>(() => {\n switch (variant) {\n case 'subtitle1':\n return '4';\n case 'heading1':\n return '7';\n case 'heading2':\n return '6';\n case 'heading3':\n return '5';\n default:\n return size;\n }\n }, [size, variant]);\n\n return (\n <RadixHeading {...rest} size={radixSize}>\n {children}\n </RadixHeading>\n );\n}\n","export { HoverCard } from '@radix-ui/themes';\n","export { IconButton, type IconButtonProps } from '@radix-ui/themes';\n","export { Inset, type InsetProps } from '@radix-ui/themes';\n","export { Kbd, type KbdProps } from '@radix-ui/themes';\n","import {\n Link as RadixLink,\n type LinkProps as RadixLinkProps,\n} from '@radix-ui/themes';\nimport { useMemo } from 'react';\n\nexport { Heading as RadixHeading } from '@radix-ui/themes';\n\nexport type LinkProps = RadixLinkProps & {\n variant?: 'caption' | 'body' | 'subtitle';\n};\n\nexport function Link(props: LinkProps): React.ReactNode {\n const { size, children, variant, ...rest } = props;\n const radixSize = useMemo<RadixLinkProps['size']>(() => {\n switch (variant) {\n case 'caption':\n return '1';\n case 'body':\n return '2';\n case 'subtitle':\n return '3';\n default:\n return size;\n }\n }, [size, variant]);\n\n return (\n <RadixLink {...rest} size={radixSize}>\n {children}\n </RadixLink>\n );\n}\n","export { Popover } from '@radix-ui/themes';\n","export { Progress, type ProgressProps } from '@radix-ui/themes';\n","export { Quote, type QuoteProps } from '@radix-ui/themes';\n","export { Radio, type RadioProps } from '@radix-ui/themes';\n","export { RadioCards } from '@radix-ui/themes';\n","export { RadioGroup } from '@radix-ui/themes';\n","export { ScrollArea, type ScrollAreaProps } from '@radix-ui/themes';\n","export { Section, type SectionProps } from '@radix-ui/themes';\n","export { SegmentedControl } from '@radix-ui/themes';\n","export { Select } from '@radix-ui/themes';\n","export { Separator, type SeparatorProps } from '@radix-ui/themes';\n","export { Skeleton, type SkeletonProps } from '@radix-ui/themes';\n","export { Strong, type StrongProps } from '@radix-ui/themes';\n","export { Switch, type SwitchProps } from '@radix-ui/themes';\n","export { TabNav } from '@radix-ui/themes';\n","export { Tabs } from '@radix-ui/themes';\n","export { TextArea, type TextAreaProps } from '@radix-ui/themes';\n","import type { TextProps as RadixTextProps } from '@radix-ui/themes';\nimport { Text as RadixText } from '@radix-ui/themes';\nimport React, { useMemo, forwardRef } from 'react';\n\nexport type TypoProps = RadixTextProps & {\n variant?: 'body' | 'caption' | 'subtitle';\n};\n\nexport const Typo = forwardRef<HTMLSpanElement, TypoProps>(\n (props: TypoProps, ref): React.ReactNode => {\n const { size, variant, children, ...rest } = props;\n\n const radixSize = useMemo<RadixTextProps['size']>(() => {\n if (size !== undefined) return size;\n switch (variant) {\n case 'caption':\n return '1';\n case 'subtitle':\n return '3';\n case 'body':\n default:\n return '2';\n }\n }, [size, variant]);\n\n return (\n <RadixText {...rest} ref={ref} size={radixSize}>\n {children}\n </RadixText>\n );\n }\n);\n\nTypo.displayName = 'Typo';\n","export { TextField } from '@radix-ui/themes';\n","export { Tooltip, type TooltipProps } from '@radix-ui/themes';\n","import React, { useEffect, useRef, useState } from 'react';\n\nexport interface CollapseProps {\n children: React.ReactNode;\n open?: boolean;\n defaultOpen?: boolean;\n /** 닫힘 상태일 때 높이 값이 필요할 시 사용 */\n closedHeight?: string;\n}\n\nexport function Collapse(props: CollapseProps): React.ReactNode {\n const { children, closedHeight = '0' } = props;\n const [open, setOpen] = useState(() => {\n return props.open || props.defaultOpen || false;\n });\n\n useEffect(() => {\n if (props.open === undefined) return;\n setOpen(props.open);\n }, [props.open]);\n\n const ref = useRef<HTMLDivElement>(null);\n\n useEffect(() => {\n if (!ref.current) return;\n ref.current.style.maxHeight = open\n ? `${ref.current.scrollHeight}px`\n : closedHeight;\n }, [closedHeight, open]);\n\n return (\n <div className=\"collapse\" ref={ref}>\n {children}\n </div>\n );\n}\n","export { Spinner, type SpinnerProps } from '@radix-ui/themes';\n","import React, { useCallback, useEffect, useMemo, useState } from 'react';\nimport { ChevronLeftIcon, ChevronRightIcon } from '../icon';\nimport type { IconButtonProps } from './icon-button';\nimport { IconButton } from './icon-button';\nimport { Flex } from './flex';\nimport { Typo } from './typo';\n\nexport interface PaginationProps {\n /** 현재 선택된 페이지 */\n page?: number;\n /** 기본 선택 페이지, page보다 낮은 우선 순위를 갖는다 */\n defaultPage?: number;\n /** 선택한 페이지 변경 이벤트 cb */\n onChange?: (page: number) => void;\n /** 전체 페이지의 수 */\n count?: number;\n}\n\nexport function Pagination(props: PaginationProps): React.ReactNode {\n const { onChange, count = 0 } = props;\n const siblingCount = 2;\n\n const [page, setPage] = useState(() => props.page || props.defaultPage || 1);\n\n const visibleItems = useMemo(() => {\n let start = Math.max(1, page - siblingCount);\n let end = Math.min(count, page + siblingCount);\n if (page - siblingCount <= 0 && end < count) {\n end = Math.min(count, end + Math.abs(page - siblingCount) + 1);\n } else if (page + siblingCount > count && start > 1) {\n start = Math.max(1, start - (page + siblingCount - count));\n }\n\n return Array.from({ length: end - start + 1 }, (_, i) => i + start);\n }, [count, page]);\n\n useEffect(() => {\n onChange?.(page);\n }, [onChange, page]);\n\n useEffect(() => {\n if (props.page) {\n setPage(props.page);\n }\n }, [props.page]);\n\n const onClickPrev = useCallback(() => {\n setPage((prev) => Math.max(1, prev - 1));\n }, []);\n\n const onClickNext = useCallback(() => {\n setPage((prev) => Math.min(count, prev + 1));\n }, [count]);\n\n const moveButtonProps: IconButtonProps = {\n variant: 'ghost',\n size: '3',\n style: { borderRadius: '50%' },\n };\n\n const iconSize = {\n height: 24,\n width: 24,\n };\n\n const prevDisabled = useMemo(() => {\n return page - siblingCount <= 1;\n }, [page]);\n\n const nextDisabled = useMemo(() => {\n return page + siblingCount >= count;\n }, [count, page]);\n\n return (\n <Flex align=\"center\" className=\"tipp-pagination\" gap=\"4\">\n <IconButton\n disabled={prevDisabled}\n onClick={onClickPrev}\n {...moveButtonProps}\n >\n <ChevronLeftIcon {...iconSize} />\n </IconButton>\n <Flex gap=\"1\">\n {visibleItems.map((item) => {\n return (\n <button\n className={`page-button ${item === page ? 'active' : ''}`}\n key={item}\n onClick={() => {\n setPage(item);\n }}\n type=\"button\"\n >\n <Typo variant=\"body\">{item}</Typo>\n </button>\n );\n })}\n </Flex>\n <IconButton\n disabled={nextDisabled}\n onClick={onClickNext}\n {...moveButtonProps}\n >\n <ChevronRightIcon {...iconSize} />\n </IconButton>\n </Flex>\n );\n}\n","export {\n BookmarkIcon,\n ExitIcon,\n InfoCircledIcon,\n ExclamationTriangleIcon,\n MagnifyingGlassIcon,\n DotsHorizontalIcon,\n ChatBubbleIcon,\n PlusIcon,\n BookmarkFilledIcon,\n MixerHorizontalIcon,\n ChevronLeftIcon,\n ChevronRightIcon,\n ClipboardIcon,\n BarChartIcon,\n PersonIcon,\n GearIcon,\n DotsVerticalIcon,\n Pencil1Icon,\n Cross1Icon,\n Link2Icon,\n ChevronUpIcon,\n ChevronDownIcon,\n FileIcon,\n TrashIcon,\n} from '@radix-ui/react-icons';\n","import React from 'react';\nimport { Flex } from './flex';\nimport { Typo } from './typo';\n\nexport interface FieldErrorWrapperProps {\n children?: React.ReactNode;\n error?: React.ReactNode;\n}\n\nexport function FieldErrorWrapper({\n children,\n error,\n}: FieldErrorWrapperProps): JSX.Element {\n return (\n <Flex direction=\"column\" gap=\"1\">\n {children}\n {error ? (\n <Typo color=\"red\" variant=\"caption\">\n {error}\n </Typo>\n ) : null}\n </Flex>\n );\n}\n","import React, { useEffect, useRef, useState } from 'react';\nimport { Tooltip } from './tooltip';\nimport { Typo, type TypoProps } from './typo';\n\nexport type EllipsisTooltipProps = TypoProps & {\n lineClamp?: number;\n children?: string;\n};\n\nexport function EllipsisTooltip(props: EllipsisTooltipProps): React.ReactNode {\n const { children, style, lineClamp = 2, ...rest } = props;\n const ref = useRef<HTMLSpanElement>(null);\n\n const [tooltipDisplay, setTooltipDisplay] = useState<'none' | 'block'>(\n 'none'\n );\n\n useEffect(() => {\n if (ref.current) {\n const typo = ref.current;\n const mouseOver = (): void => {\n if (typo.clientHeight < typo.scrollHeight) {\n setTooltipDisplay('block');\n }\n };\n\n const mouseOut = (): void => {\n setTooltipDisplay('none');\n };\n\n ref.current.addEventListener('mouseenter', mouseOver);\n ref.current.addEventListener('mouseleave', mouseOut);\n }\n }, [children]);\n\n return (\n <Tooltip content={children} style={{ display: tooltipDisplay }}>\n <Typo\n {...rest}\n ref={ref}\n style={{\n width: '100%',\n textOverflow: 'ellipsis',\n overflow: 'hidden',\n WebkitLineClamp: lineClamp,\n\n display: '-webkit-box',\n WebkitBoxOrient: 'vertical',\n wordBreak: 'break-word',\n ...style,\n }}\n >\n {children}\n </Typo>\n </Tooltip>\n );\n}\n","import React from 'react';\nimport * as Dialog from '@radix-ui/react-dialog';\nimport { ThemeProvider } from '../theme/theme-provider';\nimport { ToastContainer } from './toast';\n\nexport function Root(props: Dialog.DialogProps): React.ReactNode {\n return <Dialog.Root {...props} />;\n}\n\ntype ContentProps = Dialog.DialogContentProps & {\n /** Drawer가 붙는 위치, 기본값 right */\n position?: 'left' | 'right' | 'bottom' | 'top';\n};\n\nexport function Content(props: ContentProps): React.ReactNode {\n const { position = 'right', className, ...rest } = props;\n return (\n <Dialog.Portal>\n <ThemeProvider>\n <Dialog.Overlay className=\"DrawerOverlay\" />\n <Dialog.Content\n className={`DrawerContent ${position} ${className || ''}`}\n {...rest}\n />\n <ToastContainer />\n </ThemeProvider>\n </Dialog.Portal>\n );\n}\n\nexport function Trigger(props: Dialog.DialogTriggerProps): React.ReactNode {\n return <Dialog.Trigger asChild {...props} />;\n}\n\nexport const Drawer = {\n Root: Dialog.Root,\n Trigger,\n Content,\n Close: Dialog.Close,\n Title: Dialog.Title,\n Description: Dialog.Description,\n};\n","import React from 'react';\nimport { Theme } from '@radix-ui/themes';\n\ntype ThemeProps = React.ComponentProps<typeof Theme>;\n\ninterface ThemeProviderProps extends ThemeProps {\n children: React.ReactNode;\n}\n\nexport function ThemeProvider(props: ThemeProviderProps): React.ReactNode {\n return <Theme accentColor=\"iris\" radius=\"large\" {...props} />;\n}\n","import { Cross1Icon } from '@radix-ui/react-icons';\nimport type { Theme, ToastContainerProps, TypeOptions } from 'react-toastify';\nimport { ToastContainer as ToastifyToastContainer } from 'react-toastify';\nimport { IconButton } from './icon-button';\n\nexport { toast } from 'react-toastify';\n\ninterface CloseButtonProps {\n closeToast: (e: React.MouseEvent<HTMLElement>) => void;\n type: TypeOptions;\n ariaLabel?: string;\n theme: Theme;\n}\nfunction CloseButton({ closeToast }: CloseButtonProps): React.ReactNode {\n return (\n <IconButton color=\"gray\" onClick={closeToast} variant=\"ghost\">\n <Cross1Icon />\n </IconButton>\n );\n}\n\nexport function ToastContainer(props: ToastContainerProps): React.ReactNode {\n return (\n <ToastifyToastContainer\n autoClose={5000}\n closeButton={CloseButton}\n closeOnClick\n draggable\n hideProgressBar\n newestOnTop\n pauseOnFocusLoss\n pauseOnHover\n position=\"bottom-right\"\n rtl={false}\n {...props}\n />\n );\n}\n","import * as RadixForm from '@radix-ui/react-form';\nimport { forwardRef } from 'react';\n\nconst Root = forwardRef<HTMLFormElement, RadixForm.FormProps>(\n ({ children, className, ...rest }, ref) => {\n return (\n <RadixForm.Root\n {...rest}\n className={`FormRoot ${className || ''}`}\n ref={ref}\n >\n {children}\n </RadixForm.Root>\n );\n }\n);\n\nRoot.displayName = 'FORM_ROOT';\n\nconst Field = forwardRef<HTMLDivElement, RadixForm.FormFieldProps>(\n ({ children, className, ...rest }, ref) => {\n return (\n <RadixForm.Field\n {...rest}\n className={`FormField ${className || ''}`}\n ref={ref}\n >\n {children}\n </RadixForm.Field>\n );\n }\n);\nField.displayName = 'FORM_FIELD';\n\nconst Label = forwardRef<HTMLLabelElement, RadixForm.FormLabelProps>(\n ({ children, className, ...rest }, ref) => {\n return (\n <RadixForm.Label\n {...rest}\n className={`FormLabel ${className || ''}`}\n ref={ref}\n >\n {children}\n </RadixForm.Label>\n );\n }\n);\nLabel.displayName = 'FORM_Label';\n\nconst Message = forwardRef<HTMLSpanElement, RadixForm.FormMessageProps>(\n ({ children, className, ...rest }, ref) => {\n return (\n <RadixForm.Message\n {...rest}\n className={`FormMessage ${className || ''}`}\n ref={ref}\n >\n {children}\n </RadixForm.Message>\n );\n }\n);\nMessage.displayName = 'FORM_Message';\n\nexport const Form = {\n Root,\n Field,\n Label,\n Message,\n Control: RadixForm.Control,\n Submit: RadixForm.Submit,\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,yBAIO;AACP,IAAAA,iBAA6C;;;ACL7C,oBAA4B;;;ACA5B,IAAAC,iBAA4B;;;ACA5B,IAAAC,iBAGO;AACP,mBAAoC;AAyB9B;AAnBC,IAAM,aAAS;AAAA,EACpB,CAAC,OAAoB,QAAyB;AAC5C,UAAsD,YAA9C,YAAU,MAAM,UAAU,OAZtC,IAY0D,IAAT,iBAAS,IAAT,CAArC,YAAU,QAAM;AACxB,UAAM,gBAAY,sBAAkC,MAAM;AACxD,cAAQ,MAAM;AAAA,QACZ,KAAK;AACH,iBAAO;AAAA,QACT,KAAK;AACH,iBAAO;AAAA,QACT,KAAK;AACH,iBAAO;AAAA,QACT,KAAK;AACH,iBAAO;AAAA,QACT;AACE,iBAAO;AAAA,MACX;AAAA,IACF,GAAG,CAAC,IAAI,CAAC;AAET,WACE,4CAAC,eAAAC,QAAA,iCAAgB,OAAhB,EAAsB,KAAU,MAAM,WAAW,SAC/C,WACH;AAAA,EAEJ;AACF;AAEA,OAAO,cAAc;;;ACpCrB,IAAAC,iBAGO;AACP,IAAAC,gBAAoC;AAqC9B,IAAAC,sBAAA;AA9BC,IAAM,YAAQ;AAAA,EACnB,CAAC,OAAmB,QAAyB;AAC3C,UAAiC,YAAzB,QAAM,MAblB,IAaqC,IAAT,iBAAS,IAAT,CAAhB,QAAM;AAEd,UAAM,gBAAY,uBAAQ,MAAM;AAC9B,cAAQ,MAAM;AAAA,QACZ,KAAK;AACH,iBAAO;AAAA,QACT,KAAK;AACH,iBAAO;AAAA,QACT;AACE,iBAAO;AAAA,MACX;AAAA,IACF,GAAG,CAAC,IAAI,CAAC;AAET,UAAM,iBAAa,uBAAQ,MAAM;AAC/B,cAAQ,OAAO;AAAA,QACb,KAAK;AACH,iBAAO;AAAA,QACT,KAAK;AACH,iBAAO;AAAA,QACT,KAAK;AACH,iBAAO;AAAA,QACT,KAAK;AAAA,QACL;AACE,iBAAO;AAAA,MACX;AAAA,IACF,GAAG,CAAC,KAAK,CAAC;AAEV,WACE,6CAAC,eAAAC,OAAA,iCAAe,OAAf,EAAqB,OAAO,YAAY,KAAU,MAAM,YAAW;AAAA,EAExE;AACF;AAEA,MAAM,cAAc;;;AC9CpB,IAAAC,iBAAiD;;;ACAjD,IAAAC,iBAAmC;;;ACAnC,IAAAC,iBAGO;AACP,IAAAC,gBAA2C;AAuBhC,IAAAC,sBAAA;AAjBJ,IAAM,aAAS;AAAA,EACpB,CAAC,OAAO,QAAyB;AAC/B,UAA+B,YAAvB,OAZZ,IAYmC,IAAd,sBAAc,IAAd,CAAT;AAER,UAAM,gBAAY,uBAAQ,MAAM;AAC9B,cAAQ,MAAM;AAAA,QACZ,KAAK;AACH,iBAAO;AAAA,QACT,KAAK;AACH,iBAAO;AAAA,QACT,KAAK;AACH,iBAAO;AAAA,QACT;AACE,iBAAO;AAAA,MACX;AAAA,IACF,GAAG,CAAC,IAAI,CAAC;AAET,WAAO,6CAAC,eAAAC,QAAA,iCAAgB,YAAhB,EAA2B,KAAU,MAAM,YAAW;AAAA,EAChE;AACF;AAEA,OAAO,cAAc;;;AC/BrB,IAAAC,iBAAwB;;;ACAxB,IAAAC,iBAAqC;;;ACArC,IAAAC,kBAGO;AACP,IAAAC,gBAAoC;AAqBzB,IAAAC,sBAAA;AAfJ,IAAM,eAAW;AAAA,EACtB,CAAC,OAAO,QAAyB;AAC/B,UAAqC,YAA7B,SAAO,SAZnB,IAYyC,IAAT,iBAAS,IAAT,CAApB;AAER,UAAM,gBAAY,uBAAoC,MAAM;AAC1D,cAAQ,MAAM;AAAA,QACZ,KAAK;AACH,iBAAO;AAAA,QACT,KAAK;AACH,iBAAO;AAAA,QACT,KAAK;AACH,iBAAO;AAAA,MACX;AAAA,IACF,GAAG,CAAC,IAAI,CAAC;AAET,WAAO,6CAAC,gBAAAC,UAAA,iCAAkB,OAAlB,EAAwB,KAAU,MAAM,YAAW;AAAA,EAC7D;AACF;AAEA,SAAS,cAAc;;;AC7BvB,IAAAC,kBAA8B;;;ACA9B,IAAAC,kBAAoD;AACpD,IAAAC,gBAA2C;AAyBvC,IAAAC,sBAAA;AAhBJ,IAAM,WAAO,0BAA+C,CAAC,OAAO,QAAQ;AAC1E,QAAoC,YAA5B,YAAU,KAXpB,IAWsC,IAAT,iBAAS,IAAT,CAAnB,YAAU;AAElB,QAAM,gBAAY,uBAAyC,MAAM;AAC/D,YAAQ,MAAM;AAAA,MACZ,KAAK;AACH,eAAO;AAAA,MACT,KAAK;AACH,eAAO;AAAA,MACT,KAAK;AAAA,MACL;AACE,eAAO;AAAA,IACX;AAAA,EACF,GAAG,CAAC,IAAI,CAAC;AAET,SACE,6CAAC,gBAAAC,cAAmB,MAAnB,iCAA4B,OAA5B,EAAkC,KAAU,MAAM,WAChD,WACH;AAEJ,CAAC;AAED,KAAK,cAAc;AAEZ,IAAM,gBAAgB;AAAA,EAC3B;AAAA,EACA,MAAM,gBAAAA,cAAmB;AAC3B;;;ACrCA,IAAAC,kBAAqC;;;ACArC,IAAAC,kBAA+C;;;ACA/C,IAAAC,kBAAyB;;;ACAzB,IAAAC,kBAAuB;;;ACAvB,IAAAC,kBAA6B;;;ACA7B,IAAAC,kBAAiC;;;ACAjC,IAAAC,kBAAqC;;;ACArC,IAAAC,kBAAqC;;;ACArC,IAAAC,kBAGO;AACP,IAAAC,gBAAwB;AAExB,IAAAD,kBAAwC;AAwBpC,IAAAE,sBAAA;;;AC9BJ,IAAAC,kBAA0B;;;ACA1B,IAAAC,kBAAiD;;;ACAjD,IAAAC,kBAAuC;;;ACAvC,IAAAC,kBAAmC;;;ACAnC,IAAAC,kBAGO;AACP,IAAAC,gBAAwB;AAExB,IAAAD,kBAAwC;AAsBpC,IAAAE,sBAAA;;;AC5BJ,IAAAC,kBAAwB;;;ACAxB,IAAAC,kBAA6C;;;ACA7C,IAAAC,kBAAuC;;;ACAvC,IAAAC,kBAAuC;;;ACAvC,IAAAC,kBAA2B;;;ACA3B,IAAAC,kBAA2B;;;ACA3B,IAAAC,kBAAiD;;;ACAjD,IAAAC,kBAA2C;;;ACA3C,IAAAC,kBAAiC;;;ACAjC,IAAAC,kBAAuB;;;ACAvB,IAAAC,kBAA+C;;;ACA/C,IAAAC,kBAA6C;;;ACA7C,IAAAC,kBAAyC;;;ACAzC,IAAAC,kBAAyC;;;ACAzC,IAAAC,kBAAuB;;;ACAvB,IAAAC,kBAAqB;;;ACArB,IAAAC,kBAA6C;;;ACC7C,IAAAC,kBAAkC;AAClC,IAAAC,gBAA2C;AAwBrC,IAAAC,sBAAA;AAlBC,IAAM,WAAO;AAAA,EAClB,CAAC,OAAkB,QAAyB;AAC1C,UAA6C,YAArC,QAAM,SAAS,SAV3B,IAUiD,IAAT,iBAAS,IAAT,CAA5B,QAAM,WAAS;AAEvB,UAAM,gBAAY,uBAAgC,MAAM;AACtD,UAAI,SAAS;AAAW,eAAO;AAC/B,cAAQ,SAAS;AAAA,QACf,KAAK;AACH,iBAAO;AAAA,QACT,KAAK;AACH,iBAAO;AAAA,QACT,KAAK;AAAA,QACL;AACE,iBAAO;AAAA,MACX;AAAA,IACF,GAAG,CAAC,MAAM,OAAO,CAAC;AAElB,WACE,6CAAC,gBAAAC,MAAA,iCAAc,OAAd,EAAoB,KAAU,MAAM,WAClC,WACH;AAAA,EAEJ;AACF;AAEA,KAAK,cAAc;;;ACjCnB,IAAAC,kBAA0B;;;ACA1B,IAAAC,kBAA2C;;;ACA3C,IAAAC,gBAAmD;AA+B/C,IAAAC,sBAAA;AArBG,SAAS,SAAS,OAAuC;AAC9D,QAAM,EAAE,UAAU,eAAe,IAAI,IAAI;AACzC,QAAM,CAAC,MAAM,OAAO,QAAI,wBAAS,MAAM;AACrC,WAAO,MAAM,QAAQ,MAAM,eAAe;AAAA,EAC5C,CAAC;AAED,+BAAU,MAAM;AACd,QAAI,MAAM,SAAS;AAAW;AAC9B,YAAQ,MAAM,IAAI;AAAA,EACpB,GAAG,CAAC,MAAM,IAAI,CAAC;AAEf,QAAM,UAAM,sBAAuB,IAAI;AAEvC,+BAAU,MAAM;AACd,QAAI,CAAC,IAAI;AAAS;AAClB,QAAI,QAAQ,MAAM,YAAY,OAC1B,GAAG,IAAI,QAAQ,YAAY,OAC3B;AAAA,EACN,GAAG,CAAC,cAAc,IAAI,CAAC;AAEvB,SACE,6CAAC,SAAI,WAAU,YAAW,KACvB,UACH;AAEJ;;;ACnCA,IAAAC,kBAA2C;;;ACA3C,IAAAC,iBAAiE;;;ACAjE,yBAyBO;;;ADiDH,IAAAC,uBAAA;;;AE5DA,IAAAC,uBAAA;;;ACdJ,IAAAC,iBAAmD;AAqC7C,IAAAC,uBAAA;;;ACpCN,IAAAC,UAAwB;;;ACAxB,IAAAC,kBAAsB;AASb,IAAAC,uBAAA;;;ACVT,IAAAC,sBAA2B;AAE3B,4BAAyD;AAGzD,IAAAC,yBAAsB;AAWhB,IAAAC,uBAAA;;;AFVG,IAAAC,uBAAA;;;AGNT,gBAA2B;AAC3B,IAAAC,iBAA2B;AAKrB,IAAAC,uBAAA;AAHN,IAAMC,YAAO;AAAA,EACX,CAAC,IAAkC,QAAQ;AAA1C,iBAAE,YAAU,UAJf,IAIG,IAA0B,iBAA1B,IAA0B,CAAxB,YAAU;AACX,WACE;AAAA,MAAW;AAAA,MAAV,iCACK,OADL;AAAA,QAEC,WAAW,YAAY,aAAa,EAAE;AAAA,QACtC;AAAA,QAEC;AAAA;AAAA,IACH;AAAA,EAEJ;AACF;AAEAA,MAAK,cAAc;AAEnB,IAAMC,aAAQ;AAAA,EACZ,CAAC,IAAkC,QAAQ;AAA1C,iBAAE,YAAU,UApBf,IAoBG,IAA0B,iBAA1B,IAA0B,CAAxB,YAAU;AACX,WACE;AAAA,MAAW;AAAA,MAAV,iCACK,OADL;AAAA,QAEC,WAAW,aAAa,aAAa,EAAE;AAAA,QACvC;AAAA,QAEC;AAAA;AAAA,IACH;AAAA,EAEJ;AACF;AACAA,OAAM,cAAc;AAEpB,IAAMC,aAAQ;AAAA,EACZ,CAAC,IAAkC,QAAQ;AAA1C,iBAAE,YAAU,UAnCf,IAmCG,IAA0B,iBAA1B,IAA0B,CAAxB,YAAU;AACX,WACE;AAAA,MAAW;AAAA,MAAV,iCACK,OADL;AAAA,QAEC,WAAW,aAAa,aAAa,EAAE;AAAA,QACvC;AAAA,QAEC;AAAA;AAAA,IACH;AAAA,EAEJ;AACF;AACAA,OAAM,cAAc;AAEpB,IAAMC,eAAU;AAAA,EACd,CAAC,IAAkC,QAAQ;AAA1C,iBAAE,YAAU,UAlDf,IAkDG,IAA0B,iBAA1B,IAA0B,CAAxB,YAAU;AACX,WACE;AAAA,MAAW;AAAA,MAAV,iCACK,OADL;AAAA,QAEC,WAAW,eAAe,aAAa,EAAE;AAAA,QACzC;AAAA,QAEC;AAAA;AAAA,IACH;AAAA,EAEJ;AACF;AACAA,SAAQ,cAAc;;;AxDjBV,IAAAC,uBAAA;AA3BL,SAAS,IACd,OACiB;AACjB,QAAM,EAAE,KAAK,YAAY,YAAY,IAAI;AACzC,QAAM,CAAC,MAAM,OAAO,QAAI,yBAAS,KAAK;AAEtC,QAAM,iBAAa,4BAAY,MAAM;AAxBvC;AAyBI,gBAAM,eAAN,+BAAmB,IAAI;AACvB,YAAQ,CAAC,SAAS,CAAC,IAAI;AAAA,EACzB,GAAG,CAAC,OAAO,IAAI,QAAQ,CAAC;AAExB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,cAAc,aAAa,eAAe,EAAE;AAAA,MAGvD;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,WAAU;AAAA,YAEV,SAAS;AAAA,YACT,OAAO,EAAE,qBAAqB,YAAY;AAAA,YAC1C,MAAK;AAAA,YAEJ,cAAI,gBAAgB,EAAE,IAAI,CAAC,SAAS;AAzC7C;AA0CU,oBAAM,YAAW,UAAK,OAAO,UAAU,SAAtB,mBAA4B;AAE7C,qBACE;AAAA,gBAAC;AAAA;AAAA,kBACC,WAAU;AAAA,kBAEV,OAAO;AAAA,oBACL,UAAU,WAAW,SAAY,KAAK,OAAO,QAAQ;AAAA,oBACrD,UAAU,WAAW,IAAI;AAAA,kBAC3B;AAAA,kBAEC;AAAA,uDAAW,KAAK,OAAO,UAAU,MAAM,KAAK,WAAW,CAAC;AAAA,sBACxD,UAAK,OAAO,UAAU,SAAtB,mBAA4B,WAC3B;AAAA,sBAAC,KAAK,OAAO,UAAU,KAAK;AAAA,sBAA3B;AAAA,wBACC,MAAM,IAAI;AAAA,wBACV;AAAA,wBACA,WAAW;AAAA;AAAA,oBACb,IACE;AAAA;AAAA;AAAA,gBAbC,KAAK;AAAA,cAcZ;AAAA,YAEJ,CAAC;AAAA;AAAA,UA3BI,MAAM,IAAI,EAAE;AAAA,QA4BnB;AAAA,QACC,aACC,8CAAC,YAAS,MACR,wDAAC,SAAI,WAAU,uBACb,wDAAC,cAAW,KAAU,GACxB,GACF,IACE;AAAA;AAAA;AAAA,IAvCC,cAAc,IAAI,EAAE;AAAA,EAwC3B;AAEJ;","names":["import_react","import_themes","import_themes","RadixAvatar","import_themes","import_react","import_jsx_runtime","RadixBadge","import_themes","import_themes","import_themes","import_react","import_jsx_runtime","RadixButton","import_themes","import_themes","import_themes","import_react","import_jsx_runtime","RadixCheckbox","import_themes","import_themes","import_react","import_jsx_runtime","RadixCheckboxGroup","import_themes","import_themes","import_themes","import_themes","import_themes","import_themes","import_themes","import_themes","import_themes","import_react","import_jsx_runtime","import_themes","import_themes","import_themes","import_themes","import_themes","import_react","import_jsx_runtime","import_themes","import_themes","import_themes","import_themes","import_themes","import_themes","import_themes","import_themes","import_themes","import_themes","import_themes","import_themes","import_themes","import_themes","import_themes","import_themes","import_themes","import_themes","import_react","import_jsx_runtime","RadixText","import_themes","import_themes","import_react","import_jsx_runtime","import_themes","import_react","import_jsx_runtime","import_jsx_runtime","import_react","import_jsx_runtime","Dialog","import_themes","import_jsx_runtime","import_react_icons","import_react_toastify","import_jsx_runtime","import_jsx_runtime","import_react","import_jsx_runtime","Root","Field","Label","Message","import_jsx_runtime"]}
|
|
1
|
+
{"version":3,"sources":["../../../src/molecules/expand-table/row.tsx","../../../src/atoms/collapse.tsx"],"sourcesContent":["import {\n type Row as TanstackRow,\n type RowData,\n flexRender,\n} from '@tanstack/react-table';\nimport React, { useCallback, useState } from 'react';\nimport { Collapse } from '../../atoms';\n\nexport type ExpandComp<Datum> = React.FC<{ row: TanstackRow<Datum> }>;\nexport type OnRowClick<Datum> = (data: Datum) => void;\n\ninterface RowProps<Datum extends RowData> {\n row: TanstackRow<Datum>;\n ExpandComp?: ExpandComp<Datum>;\n onRowClick?: OnRowClick<Datum>;\n gridColTemp: string;\n}\n\nexport function Row<Datum extends RowData>(\n props: RowProps<Datum>\n): React.ReactNode {\n const { row, ExpandComp, gridColTemp } = props;\n const [open, setOpen] = useState(false);\n\n const onClickRow = useCallback(() => {\n props.onRowClick?.(row.original);\n setOpen((prev) => !prev);\n }, [props, row.original]);\n\n return (\n <div\n className={`tr-wrapper ${ExpandComp ? 'expandable' : ''}`}\n key={`tr-wrapper_${row.id}`}\n >\n <button\n className=\"tr\"\n key={`tr_${row.id}`}\n onClick={onClickRow}\n style={{ gridTemplateColumns: gridColTemp }}\n type=\"button\"\n >\n {row.getVisibleCells().map((cell) => {\n const autoSize = cell.column.columnDef.meta?.autoSize;\n\n return (\n <div\n className=\"td\"\n key={cell.id}\n style={{\n minWidth: autoSize ? undefined : cell.column.getSize(),\n flexGrow: autoSize ? 1 : undefined,\n }}\n >\n {flexRender(cell.column.columnDef.cell, cell.getContext())}\n {cell.column.columnDef.meta?.OpenBtn ? (\n <cell.column.columnDef.meta.OpenBtn\n data={row.original}\n open={open}\n setIsOpen={setOpen}\n />\n ) : null}\n </div>\n );\n })}\n </button>\n {ExpandComp ? (\n <Collapse open={open} >\n <div className=\"expand-comp-wrapper\">\n <ExpandComp row={row} />\n </div>\n </Collapse>\n ) : null}\n </div>\n );\n}\n","import React, { useEffect, useRef, useState } from 'react';\n\nexport interface CollapseProps {\n children: React.ReactNode;\n open?: boolean;\n defaultOpen?: boolean;\n /** 닫힘 상태일 때 높이 값이 필요할 시 사용 */\n closedHeight?: string;\n}\n\nexport function Collapse(props: CollapseProps): React.ReactNode {\n const { children, closedHeight = '0' } = props;\n const [open, setOpen] = useState(() => {\n return props.open || props.defaultOpen || false;\n });\n\n useEffect(() => {\n if (props.open === undefined) return;\n setOpen(props.open);\n }, [props.open]);\n\n const ref = useRef<HTMLDivElement>(null);\n\n useEffect(() => {\n if (!ref.current) return;\n ref.current.style.maxHeight = open\n ? `${ref.current.scrollHeight}px`\n : closedHeight;\n }, [closedHeight, open]);\n\n return (\n <div className=\"collapse\" ref={ref}>\n {children}\n </div>\n );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,yBAIO;AACP,IAAAA,gBAA6C;;;ACL7C,mBAAmD;AA+B/C;AArBG,SAAS,SAAS,OAAuC;AAC9D,QAAM,EAAE,UAAU,eAAe,IAAI,IAAI;AACzC,QAAM,CAAC,MAAM,OAAO,QAAI,uBAAS,MAAM;AACrC,WAAO,MAAM,QAAQ,MAAM,eAAe;AAAA,EAC5C,CAAC;AAED,8BAAU,MAAM;AACd,QAAI,MAAM,SAAS;AAAW;AAC9B,YAAQ,MAAM,IAAI;AAAA,EACpB,GAAG,CAAC,MAAM,IAAI,CAAC;AAEf,QAAM,UAAM,qBAAuB,IAAI;AAEvC,8BAAU,MAAM;AACd,QAAI,CAAC,IAAI;AAAS;AAClB,QAAI,QAAQ,MAAM,YAAY,OAC1B,GAAG,IAAI,QAAQ,YAAY,OAC3B;AAAA,EACN,GAAG,CAAC,cAAc,IAAI,CAAC;AAEvB,SACE,4CAAC,SAAI,WAAU,YAAW,KACvB,UACH;AAEJ;;;ADUY,IAAAC,sBAAA;AA3BL,SAAS,IACd,OACiB;AACjB,QAAM,EAAE,KAAK,YAAY,YAAY,IAAI;AACzC,QAAM,CAAC,MAAM,OAAO,QAAI,wBAAS,KAAK;AAEtC,QAAM,iBAAa,2BAAY,MAAM;AAxBvC;AAyBI,gBAAM,eAAN,+BAAmB,IAAI;AACvB,YAAQ,CAAC,SAAS,CAAC,IAAI;AAAA,EACzB,GAAG,CAAC,OAAO,IAAI,QAAQ,CAAC;AAExB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,cAAc,aAAa,eAAe,EAAE;AAAA,MAGvD;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,WAAU;AAAA,YAEV,SAAS;AAAA,YACT,OAAO,EAAE,qBAAqB,YAAY;AAAA,YAC1C,MAAK;AAAA,YAEJ,cAAI,gBAAgB,EAAE,IAAI,CAAC,SAAS;AAzC7C;AA0CU,oBAAM,YAAW,UAAK,OAAO,UAAU,SAAtB,mBAA4B;AAE7C,qBACE;AAAA,gBAAC;AAAA;AAAA,kBACC,WAAU;AAAA,kBAEV,OAAO;AAAA,oBACL,UAAU,WAAW,SAAY,KAAK,OAAO,QAAQ;AAAA,oBACrD,UAAU,WAAW,IAAI;AAAA,kBAC3B;AAAA,kBAEC;AAAA,uDAAW,KAAK,OAAO,UAAU,MAAM,KAAK,WAAW,CAAC;AAAA,sBACxD,UAAK,OAAO,UAAU,SAAtB,mBAA4B,WAC3B;AAAA,sBAAC,KAAK,OAAO,UAAU,KAAK;AAAA,sBAA3B;AAAA,wBACC,MAAM,IAAI;AAAA,wBACV;AAAA,wBACA,WAAW;AAAA;AAAA,oBACb,IACE;AAAA;AAAA;AAAA,gBAbC,KAAK;AAAA,cAcZ;AAAA,YAEJ,CAAC;AAAA;AAAA,UA3BI,MAAM,IAAI,EAAE;AAAA,QA4BnB;AAAA,QACC,aACC,6CAAC,YAAS,MACR,uDAAC,SAAI,WAAU,uBACb,uDAAC,cAAW,KAAU,GACxB,GACF,IACE;AAAA;AAAA;AAAA,IAvCC,cAAc,IAAI,EAAE;AAAA,EAwC3B;AAEJ;","names":["import_react","import_jsx_runtime"]}
|