@crispy-seed/data-table 0.1.1 → 0.1.3

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.
Files changed (49) hide show
  1. package/dist/index.cjs +4570 -2
  2. package/dist/index.js +4554 -1
  3. package/package.json +1 -1
  4. package/dist/DataTable-12s-D02v6Qj5.js +0 -1523
  5. package/dist/DataTable-12s-Gpv6I4J8.cjs +0 -1574
  6. package/dist/DataTable-12s-Zml1x9Kr-12s-B-mwMBhn.cjs +0 -161
  7. package/dist/DataTable-12s-Zml1x9Kr-12s-BR-yHfob.js +0 -153
  8. package/dist/Menu-12s-A4lEc__n.cjs +0 -103
  9. package/dist/Menu-12s-v9vnaq8F.js +0 -77
  10. package/dist/Select-12s-CE3SMzFp.js +0 -218
  11. package/dist/Select-12s-CNQC9z8t.cjs +0 -249
  12. package/dist/body-cells-12s-2sTwdliH.cjs +0 -461
  13. package/dist/body-cells-12s-Ba2uF4T-.js +0 -452
  14. package/dist/column-calc-12s-C1-I2KdV.js +0 -129
  15. package/dist/column-calc-12s-CJ26VuDJ.cjs +0 -149
  16. package/dist/column-layout-12s-BhQmNTJG.js +0 -99
  17. package/dist/column-layout-12s-k2fZYeKl.cjs +0 -120
  18. package/dist/column-menu-12s-6Yvu4SZ0.js +0 -406
  19. package/dist/column-menu-12s-BnknuXGh.cjs +0 -426
  20. package/dist/editors-12s-C0RxmTcI.cjs +0 -554
  21. package/dist/editors-12s-COixUnI2.js +0 -524
  22. package/dist/resize-12s-CajyNXFB.js +0 -58
  23. package/dist/resize-12s-ChLpxb4i.cjs +0 -58
  24. package/dist/states-12s-BB0PT_bq.cjs +0 -125
  25. package/dist/states-12s-m5mBR90e.js +0 -122
  26. package/dist/toolbar-12s-B1xiS-Zu.js +0 -68
  27. package/dist/toolbar-12s-DzLbghpK.cjs +0 -70
  28. package/dist/useDataTable-12s-BHiDUubw-12s-CBeCwTe7.js +0 -61
  29. package/dist/useDataTable-12s-BHiDUubw-12s-Dgvt7XDk.cjs +0 -61
  30. package/dist/useDataTableColumnCalc-12s-DTQQTtEJ-12s-CvD14JYo.cjs +0 -207
  31. package/dist/useDataTableColumnCalc-12s-DTQQTtEJ-12s-DsEse3uq.js +0 -183
  32. package/dist/useDataTableColumns-12s-Cn2ZAzFL-12s-CD6goR59.js +0 -289
  33. package/dist/useDataTableColumns-12s-Cn2ZAzFL-12s-CUk_CpYT.cjs +0 -292
  34. package/dist/useDataTableEdit-12s-9Wb_UCrN-12s-BoOHq3GB.js +0 -98
  35. package/dist/useDataTableEdit-12s-9Wb_UCrN-12s-De6YHBba.cjs +0 -98
  36. package/dist/useDataTableFilter-12s-ZzbmWMin-12s-CWyBeFna.js +0 -74
  37. package/dist/useDataTableFilter-12s-ZzbmWMin-12s-lpjzZY3_.cjs +0 -74
  38. package/dist/useDataTableInfiniteScroll-12s-8ZG31URd-12s-BexjP6iO.js +0 -104
  39. package/dist/useDataTableInfiniteScroll-12s-8ZG31URd-12s-Bt8gojr9.cjs +0 -104
  40. package/dist/useDataTableRow-12s-CPYaDa1p-12s-4qkGoz-j.js +0 -30
  41. package/dist/useDataTableRow-12s-CPYaDa1p-12s-DG64uYjn.cjs +0 -30
  42. package/dist/useDataTableScroll-12s-BKDCr0en-12s-C7f2vHeG.js +0 -61
  43. package/dist/useDataTableScroll-12s-BKDCr0en-12s-CUvUYMtt.cjs +0 -61
  44. package/dist/useDataTableSearch-12s-Ck3iWcpX-12s-B-65V6gH.js +0 -37
  45. package/dist/useDataTableSearch-12s-Ck3iWcpX-12s-DhVfN2Hq.cjs +0 -37
  46. package/dist/useDataTableSelection-12s-BIDtiRQq-12s-IS__VAnU.cjs +0 -71
  47. package/dist/useDataTableSelection-12s-BIDtiRQq-12s-O6M_BhrH.js +0 -71
  48. package/dist/useDataTableSort-12s-DvJYtmeS-12s-C5VGnsq4.cjs +0 -78
  49. package/dist/useDataTableSort-12s-DvJYtmeS-12s-DABSNt6U.js +0 -78
@@ -1,524 +0,0 @@
1
- 'use client';
2
- function __insertCSS(code) {
3
- if (!code || typeof document == 'undefined') return
4
- let head = document.head || document.getElementsByTagName('head')[0]
5
- let style = document.createElement('style')
6
- style.type = 'text/css'
7
- head.appendChild(style)
8
- ;style.styleSheet ? (style.styleSheet.cssText = code) : style.appendChild(document.createTextNode(code))
9
- }
10
-
11
- import { S as SelectRoot, a as SelectTrigger, b as SelectValue, c as SelectPlaceholder, d as SelectSuffixIcon, e as SelectPositioner, f as SelectContent, g as SelectScrollArea, h as SelectItem, i as SelectItemBody, j as SelectItemLabel, k as SelectItemIndicator } from './Select-12s-CE3SMzFp.js';
12
- import * as React from 'react';
13
- import React__default, { forwardRef, useRef, useCallback } from 'react';
14
- import { jsx, jsxs } from 'react/jsx-runtime';
15
- import { w as withScaleFeedback, c as createSlotRecipeContext, a as createWithStateProps, P as Primitive, s as splitMultipleVariantsProps, b as clsx, I as InternalIcon, t as composeRefs, C as CheckboxRoot, e as CheckboxControl, f as CheckboxIndicator, g as CheckboxHiddenInput, u as IconChevronDownSmallLine_default, v as IconCheckmarkFatFill_default, x as IconPersonCircleLine_default } from './DataTable-12s-D02v6Qj5.js';
16
- import { R as RATING_FILLED, a as RATING_EMPTY, b as RATING_STAR_D, c as CHECKBOX_CELL_CHECKED_ICON, A as AvatarRoot, d as AvatarImage, e as AvatarFallback, t as toDateTimeInputValue, f as toDateInputValue } from './body-cells-12s-Ba2uF4T-.js';
17
- import { Switch, useSwitchContext } from '@seed-design/react-switch';
18
- import { switchStyle } from '@seed-design/css/recipes/switch';
19
- import { switchmark } from '@seed-design/css/recipes/switchmark';
20
- import { TextField, useTextFieldContext } from '@seed-design/react-text-field';
21
- import { useFieldContext } from '@seed-design/react-field';
22
- import { textInput } from '@seed-design/css/recipes/text-input';
23
- import { mergeProps } from '@seed-design/dom-utils';
24
-
25
- const { withContext: withContext$1, ClassNamesProvider } = createSlotRecipeContext(switchStyle);
26
- const { withContext: withControlContext, PropsProvider: ControlPropsProvider, withProvider: withControlProvider } = createSlotRecipeContext(switchmark);
27
- const withStateProps$1 = createWithStateProps([
28
- useSwitchContext
29
- ]);
30
- const SwitchRoot = /*#__PURE__*/ React__default.forwardRef(({ className, ...props }, ref)=>{
31
- const [{ switch: switchVariantProps, switchmark: switchmarkVariantProps }, otherProps] = splitMultipleVariantsProps(props, {
32
- switchmark,
33
- switch: switchStyle
34
- });
35
- const classNames = switchStyle(switchVariantProps);
36
- return /*#__PURE__*/ jsx(ControlPropsProvider, {
37
- value: switchmarkVariantProps,
38
- children: /*#__PURE__*/ jsx(ClassNamesProvider, {
39
- value: classNames,
40
- children: /*#__PURE__*/ jsx(Switch.Root, {
41
- ref: ref,
42
- className: clsx(classNames.root, className),
43
- ...otherProps
44
- })
45
- })
46
- });
47
- });
48
- SwitchRoot.displayName = "SwitchRoot";
49
- const SwitchControl = withScaleFeedback(withControlProvider(Switch.Control, "root"));
50
- const SwitchThumb = withControlContext(Switch.Thumb, "thumb");
51
- withContext$1(withStateProps$1(Primitive.span), "label");
52
- const SwitchHiddenInput = Switch.HiddenInput;
53
-
54
- // src/use-layout-effect.tsx
55
- var useLayoutEffect2 = globalThis?.document ? React.useLayoutEffect : ()=>{};
56
-
57
- const { withProvider, withContext, useClassNames } = createSlotRecipeContext(textInput);
58
- const withFieldStateProps = createWithStateProps([
59
- {
60
- useContext: useFieldContext,
61
- strict: false
62
- }
63
- ]);
64
- const withStateProps = createWithStateProps([
65
- useTextFieldContext,
66
- {
67
- useContext: useFieldContext,
68
- strict: false
69
- }
70
- ]);
71
- const TextFieldRoot = withProvider(withFieldStateProps(TextField.Root), "root");
72
- const TextFieldPrefixIcon = withContext(withStateProps(InternalIcon), "prefixIcon");
73
- withContext(withStateProps(Primitive.span), "prefixText");
74
- withContext(withStateProps(InternalIcon), "suffixIcon");
75
- withContext(withStateProps(Primitive.span), "suffixText");
76
- const TextFieldInput = /*#__PURE__*/ forwardRef(({ className, ...otherProps }, ref)=>{
77
- const classNames = useClassNames();
78
- const textFieldContext = useTextFieldContext();
79
- const fieldContext = useFieldContext({
80
- strict: false
81
- });
82
- const mergedProps = mergeProps(fieldContext ? fieldContext.stateProps : {}, fieldContext ? fieldContext.inputAriaAttributes : {}, textFieldContext.inputProps, fieldContext ? fieldContext.inputProps : {}, otherProps);
83
- if (// if not in field, then must have aria-label or aria-labelledby
84
- !fieldContext && !otherProps["aria-label"] && !otherProps["aria-labelledby"]) {
85
- console.warn("TextFieldInput: Please provide `aria-label` or `aria-labelledby` for accessibility, or put `TextFieldInput` inside a `Field` where a `FieldLabel` is provided.");
86
- }
87
- return /*#__PURE__*/ jsx(TextField.Input, {
88
- ref: ref,
89
- ...mergedProps,
90
- className: clsx(classNames.value, className)
91
- });
92
- });
93
- TextFieldInput.displayName = "TextFieldInput";
94
- const TextFieldTextarea = /*#__PURE__*/ forwardRef(({ className, autoresize = true, ...otherProps }, ref)=>{
95
- const classNames = useClassNames();
96
- const textFieldContext = useTextFieldContext();
97
- const fieldContext = useFieldContext({
98
- strict: false
99
- });
100
- const mergedProps = mergeProps(fieldContext ? fieldContext.stateProps : {}, fieldContext ? fieldContext.inputAriaAttributes : {}, textFieldContext.inputProps, fieldContext ? fieldContext.inputProps : {}, otherProps);
101
- if (// if not in field, then must have aria-label or aria-labelledby
102
- !fieldContext && !otherProps["aria-label"] && !otherProps["aria-labelledby"]) {
103
- console.warn("TextFieldTextarea: Please provide `aria-label` or `aria-labelledby` for accessibility, or put `TextFieldTextarea` inside a `Field` where a `FieldLabel` is provided.");
104
- }
105
- // referenced from React Spectrum
106
- const inputRef = useRef(null);
107
- // biome-ignore lint/correctness/useExhaustiveDependencies: intended
108
- const onHeightChange = useCallback(()=>{
109
- if (!inputRef.current) return;
110
- if (otherProps.style?.height) return;
111
- if (!autoresize) return;
112
- // Quiet textareas always grow based on their text content.
113
- // Standard textareas also grow by default, unless an explicit height is set.
114
- const input = inputRef.current;
115
- const prevAlignment = input.style.alignSelf;
116
- const prevOverflow = input.style.overflow;
117
- // Firefox scroll position is lost when overflow: 'hidden' is applied so we skip applying it.
118
- // The measure/applied height is also incorrect/reset if we turn on and off
119
- // overflow: hidden in Firefox https://bugzilla.mozilla.org/show_bug.cgi?id=1787062
120
- const isFirefox = "MozAppearance" in input.style;
121
- if (!isFirefox) {
122
- input.style.overflow = "hidden";
123
- }
124
- input.style.alignSelf = "start";
125
- input.style.height = "auto";
126
- // offsetHeight - clientHeight accounts for the border/padding.
127
- input.style.height = `${input.scrollHeight + (input.offsetHeight - input.clientHeight)}px`;
128
- input.style.overflow = prevOverflow;
129
- input.style.alignSelf = prevAlignment;
130
- }, [
131
- inputRef,
132
- otherProps.style?.height,
133
- autoresize
134
- ]);
135
- useLayoutEffect2(()=>{
136
- if (inputRef.current) {
137
- onHeightChange();
138
- }
139
- }, [
140
- onHeightChange,
141
- textFieldContext.value,
142
- inputRef
143
- ]);
144
- return /*#__PURE__*/ jsx(TextField.Textarea, {
145
- ref: composeRefs(inputRef, ref),
146
- ...mergedProps,
147
- className: clsx(classNames.value, className)
148
- });
149
- });
150
- TextFieldTextarea.displayName = "TextFieldTextarea";
151
-
152
- /** The raw value a live editor reads, distinct from `DataTableColumn.value` (the
153
- * accessor sort/search/filter/export share): `editValue` returns whatever TYPE the
154
- * editor itself expects -- a real `boolean` for `editor: "switch"`/`type:
155
- * "checkbox"`, a `number` for `type: "rating"`, the option's own string for `select`/
156
- * `reference`/`actor` -- where `value`/`render` may format that same field for
157
- * display. Falls back to the table's own accessor when the column supplies none. */ function resolveEditValue(column, row, fallback) {
158
- return column.editValue ? column.editValue(row) : fallback;
159
- }
160
- function EditPendingIndicator() {
161
- return /*#__PURE__*/ jsxs("svg", {
162
- className: "seed-data-table-edit-pending",
163
- width: 14,
164
- height: 14,
165
- viewBox: "0 0 16 16",
166
- fill: "none",
167
- role: "presentation",
168
- "aria-hidden": "true",
169
- children: [
170
- /*#__PURE__*/ jsx("circle", {
171
- cx: 8,
172
- cy: 8,
173
- r: 6.5,
174
- stroke: "currentColor",
175
- strokeOpacity: 0.25,
176
- strokeWidth: 2
177
- }),
178
- /*#__PURE__*/ jsx("path", {
179
- d: "M14.5 8a6.5 6.5 0 0 0-6.5-6.5",
180
- stroke: "currentColor",
181
- strokeWidth: 2,
182
- strokeLinecap: "round"
183
- })
184
- ]
185
- });
186
- }
187
- function EditError({ message }) {
188
- return /*#__PURE__*/ jsx("span", {
189
- className: "seed-data-table-edit-error",
190
- children: message
191
- });
192
- }
193
- ////////////////////////////////////////////////////////////////////////////////////
194
- // -- plain editable: text/number (seed TextField) and date/datetime (a native input,
195
- // styled the same way, per `cellType`) -- both double-click gated, Enter/blur
196
- // commits, Escape cancels. -------------------------------------------------------
197
- function TextEditor({ column, value, pending, onCommit, onCancel }) {
198
- const [draft, setDraft] = React.useState(()=>value == null ? "" : String(value));
199
- return(// `size="medium"` (seed's smallest fixed `TextField` size, 40px min-height,
200
- // `text-input.ts`'s own token) -- the default `size="large"` overflowed a 36px
201
- // table row (same class of fix as `toolbar.tsx`'s `SearchBox`, which made the
202
- // same call for its own 32px-ish search box).
203
- /*#__PURE__*/ jsx(TextFieldRoot, {
204
- size: "medium",
205
- style: {
206
- width: "100%"
207
- },
208
- onClick: (event)=>event.stopPropagation(),
209
- onKeyDown: (event)=>event.stopPropagation(),
210
- children: /*#__PURE__*/ jsx(TextFieldInput, {
211
- autoFocus: true,
212
- type: column.cellType === "number" ? "number" : "text",
213
- "aria-label": `Edit ${column.key}`,
214
- value: draft,
215
- disabled: pending,
216
- onChange: (event)=>setDraft(event.target.value),
217
- onBlur: ()=>onCommit(draft),
218
- onKeyDown: (event)=>{
219
- if (event.key === "Enter") onCommit(draft);
220
- else if (event.key === "Escape") onCancel();
221
- }
222
- })
223
- }));
224
- }
225
- function DateEditor({ column, value, pending, onCommit, onCancel }) {
226
- const isDateTime = column.cellType === "datetime";
227
- const [draft, setDraft] = React.useState(()=>isDateTime ? toDateTimeInputValue(value) : toDateInputValue(value));
228
- return(// See `TextEditor`'s own comment above -- same `size="medium"` fix.
229
- /*#__PURE__*/ jsx(TextFieldRoot, {
230
- size: "medium",
231
- style: {
232
- width: "100%"
233
- },
234
- onClick: (event)=>event.stopPropagation(),
235
- onKeyDown: (event)=>event.stopPropagation(),
236
- children: /*#__PURE__*/ jsx(TextFieldInput, {
237
- autoFocus: true,
238
- type: isDateTime ? "datetime-local" : "date",
239
- "aria-label": `Edit ${column.key}`,
240
- value: draft,
241
- disabled: pending,
242
- onChange: (event)=>setDraft(event.target.value),
243
- onBlur: ()=>onCommit(draft),
244
- onKeyDown: (event)=>{
245
- if (event.key === "Enter") onCommit(draft);
246
- else if (event.key === "Escape") onCancel();
247
- }
248
- })
249
- }));
250
- }
251
- ////////////////////////////////////////////////////////////////////////////////////
252
- // -- editor: "select" -- double-click opens seed's own Select, auto-opened (seed's
253
- // `SelectRoot` takes `defaultOpen` directly -- unlike crisp's closed-API `Select`,
254
- // which needs a synthetic click on its own trigger to start open). -------------
255
- function SelectEditor({ column, value, pending, onCommit, onCancel }) {
256
- const options = column.options ?? [];
257
- const current = value == null ? "" : String(value);
258
- return /*#__PURE__*/ jsxs(SelectRoot, {
259
- // Controlled open, per docs/examples/react/select/controlled-open.tsx --
260
- // this editor is only ever mounted while the cell IS editing, so it always
261
- // wants to start (and stay) open; `onOpenChange(false)` is what tells us
262
- // the popover wants to close for ANY reason (Escape, an outside click, OR
263
- // the internal auto-close a single-select commit already triggers), so
264
- // `onCancel` alone now covers the Escape gap the old raw `document`
265
- // listener existed for, without a second, independent listener.
266
- open: true,
267
- onOpenChange: (next)=>{
268
- if (!next) onCancel();
269
- },
270
- disabled: pending,
271
- value: current ? [
272
- current
273
- ] : [],
274
- onValueChange: (next)=>onCommit(next[0] ?? ""),
275
- children: [
276
- /*#__PURE__*/ jsxs(SelectTrigger, {
277
- "aria-label": `Edit ${column.key}`,
278
- children: [
279
- /*#__PURE__*/ jsx(SelectValue, {}),
280
- /*#__PURE__*/ jsx(SelectPlaceholder, {
281
- children: "Select…"
282
- }),
283
- /*#__PURE__*/ jsx(SelectSuffixIcon, {
284
- svg: /*#__PURE__*/ jsx(IconChevronDownSmallLine_default, {})
285
- })
286
- ]
287
- }),
288
- /*#__PURE__*/ jsx(SelectPositioner, {
289
- children: /*#__PURE__*/ jsx(SelectContent, {
290
- children: /*#__PURE__*/ jsx(SelectScrollArea, {
291
- children: options.map((option)=>/*#__PURE__*/ jsxs(SelectItem, {
292
- value: option.value,
293
- label: option.label,
294
- children: [
295
- /*#__PURE__*/ jsx(SelectItemBody, {
296
- children: /*#__PURE__*/ jsx(SelectItemLabel, {})
297
- }),
298
- /*#__PURE__*/ jsx(SelectItemIndicator, {
299
- selected: /*#__PURE__*/ jsx(IconCheckmarkFatFill_default, {})
300
- })
301
- ]
302
- }, option.value))
303
- })
304
- })
305
- })
306
- ]
307
- });
308
- }
309
- ////////////////////////////////////////////////////////////////////////////////////
310
- // -- editor: "reference" / "actor" -- same picker, search-enabled, each option
311
- // carrying a small avatar (a photo for a real one, a generic person glyph for
312
- // none) -- `actor` is `reference` over people specifically (crisp's own #449/
313
- // #432 `ReferenceCell` shape), so the two share one component; only the search
314
- // placeholder differs. Seed's `Select` has no built-in search combobox (unlike
315
- // crisp's own `Select`), so this filters `refOptions` itself against a small
316
- // `TextField` rendered as the content's own first row. --------------------------
317
- function ReferenceEditor({ column, value, pending, onCommit, onCancel }) {
318
- const [query, setQuery] = React.useState("");
319
- const options = column.refOptions ?? [];
320
- const filtered = query.trim() ? options.filter((option)=>option.label.toLowerCase().includes(query.trim().toLowerCase())) : options;
321
- const current = value == null ? "" : String(value);
322
- const isActor = column.editor === "actor";
323
- return /*#__PURE__*/ jsxs(SelectRoot, {
324
- // See `SelectEditor`'s own comment above -- same controlled-open wiring.
325
- open: true,
326
- onOpenChange: (next)=>{
327
- if (!next) onCancel();
328
- },
329
- disabled: pending,
330
- value: current ? [
331
- current
332
- ] : [],
333
- onValueChange: (next)=>onCommit(next[0] ?? ""),
334
- children: [
335
- /*#__PURE__*/ jsxs(SelectTrigger, {
336
- "aria-label": `Edit ${column.key}`,
337
- children: [
338
- /*#__PURE__*/ jsx(SelectValue, {}),
339
- /*#__PURE__*/ jsx(SelectPlaceholder, {
340
- children: isActor ? "Assign…" : "Select…"
341
- }),
342
- /*#__PURE__*/ jsx(SelectSuffixIcon, {
343
- svg: /*#__PURE__*/ jsx(IconChevronDownSmallLine_default, {})
344
- })
345
- ]
346
- }),
347
- /*#__PURE__*/ jsx(SelectPositioner, {
348
- children: /*#__PURE__*/ jsxs(SelectContent, {
349
- children: [
350
- /*#__PURE__*/ jsx(TextFieldRoot, {
351
- size: "medium",
352
- style: {
353
- margin: 4
354
- },
355
- onKeyDown: (event)=>{
356
- // The listbox's own typeahead/arrow handling lives on THIS field's
357
- // sibling items, not on the field itself -- stop everything except
358
- // Escape from also driving the listbox's own keyboard nav. Escape
359
- // itself needs no special-casing to "reach" anything any more: it's
360
- // SelectContent's own `DismissibleLayer` (Select.tsx) that closes the
361
- // listbox, and that dismissal is a document-level listener outside
362
- // this React subtree entirely -- a synthetic `stopPropagation` here
363
- // was never able to block it either way, so the controlled `open`
364
- // above (via `onOpenChange`) is what actually ends this cell's edit.
365
- if (event.key !== "Escape") event.stopPropagation();
366
- },
367
- children: /*#__PURE__*/ jsx(TextFieldInput, {
368
- autoFocus: true,
369
- "aria-label": isActor ? "Search people" : `Search ${column.key}`,
370
- placeholder: isActor ? "Search people…" : "Search…",
371
- value: query,
372
- onChange: (event)=>setQuery(event.target.value)
373
- })
374
- }),
375
- /*#__PURE__*/ jsxs(SelectScrollArea, {
376
- children: [
377
- filtered.length === 0 && /*#__PURE__*/ jsx("div", {
378
- style: {
379
- padding: "6px 12px",
380
- opacity: 0.63,
381
- fontSize: 13
382
- },
383
- children: isActor ? "No users" : "No results"
384
- }),
385
- filtered.map((option)=>/*#__PURE__*/ jsxs(SelectItem, {
386
- value: option.value,
387
- label: option.label,
388
- children: [
389
- /*#__PURE__*/ jsxs(SelectItemBody, {
390
- children: [
391
- /*#__PURE__*/ jsx(ReferenceAvatar, {
392
- avatar: option.avatar
393
- }),
394
- /*#__PURE__*/ jsx(SelectItemLabel, {})
395
- ]
396
- }),
397
- /*#__PURE__*/ jsx(SelectItemIndicator, {
398
- selected: /*#__PURE__*/ jsx(IconCheckmarkFatFill_default, {})
399
- })
400
- ]
401
- }, option.value))
402
- ]
403
- })
404
- ]
405
- })
406
- })
407
- ]
408
- });
409
- }
410
- function ReferenceAvatar({ avatar }) {
411
- return /*#__PURE__*/ jsxs(AvatarRoot, {
412
- size: "20",
413
- children: [
414
- avatar && /*#__PURE__*/ jsx(AvatarImage, {
415
- src: avatar,
416
- alt: ""
417
- }),
418
- /*#__PURE__*/ jsx(AvatarFallback, {
419
- children: /*#__PURE__*/ jsx(IconPersonCircleLine_default, {})
420
- })
421
- ]
422
- });
423
- }
424
- ////////////////////////////////////////////////////////////////////////////////////
425
- // -- always-live editors: no double-click gate, no separate rest/edit state --
426
- // interacting with the widget IS the commit gesture (crisp's own #453/#760/#761).
427
- function SwitchEditor({ column, value, pending, onCommit }) {
428
- const checked = value === true || value === "true";
429
- return /*#__PURE__*/ jsxs("span", {
430
- className: "seed-data-table-edit-picker",
431
- children: [
432
- /*#__PURE__*/ jsxs(SwitchRoot, {
433
- size: "16",
434
- checked: checked,
435
- disabled: pending,
436
- onCheckedChange: (next)=>onCommit(String(next)),
437
- children: [
438
- /*#__PURE__*/ jsx(SwitchControl, {
439
- children: /*#__PURE__*/ jsx(SwitchThumb, {})
440
- }),
441
- /*#__PURE__*/ jsx(SwitchHiddenInput, {
442
- "aria-label": `Edit ${column.key}`
443
- })
444
- ]
445
- }),
446
- pending && /*#__PURE__*/ jsx(EditPendingIndicator, {})
447
- ]
448
- });
449
- }
450
- function CheckboxEditor({ column, value, pending, onCommit }) {
451
- const checked = value === true || value === "true";
452
- return /*#__PURE__*/ jsxs("span", {
453
- className: "seed-data-table-edit-picker",
454
- children: [
455
- /*#__PURE__*/ jsxs(CheckboxRoot, {
456
- checked: checked,
457
- disabled: pending,
458
- onCheckedChange: (next)=>onCommit(String(next)),
459
- children: [
460
- /*#__PURE__*/ jsx(CheckboxControl, {
461
- children: /*#__PURE__*/ jsx(CheckboxIndicator, {
462
- checked: CHECKBOX_CELL_CHECKED_ICON
463
- })
464
- }),
465
- /*#__PURE__*/ jsx(CheckboxHiddenInput, {
466
- "aria-label": `Edit ${column.key}`
467
- })
468
- ]
469
- }),
470
- pending && /*#__PURE__*/ jsx(EditPendingIndicator, {})
471
- ]
472
- });
473
- }
474
- function RatingEditor({ column, value, pending, onCommit }) {
475
- const maxRating = column.maxRating ?? 5;
476
- const rating = typeof value === "number" ? value : Number(value) || 0;
477
- return /*#__PURE__*/ jsxs("span", {
478
- className: "seed-data-table-edit-picker",
479
- children: [
480
- /*#__PURE__*/ jsx("span", {
481
- role: "group",
482
- "aria-label": `Edit ${column.key}`,
483
- style: {
484
- display: "inline-flex",
485
- alignItems: "center",
486
- gap: 2
487
- },
488
- children: Array.from({
489
- length: maxRating
490
- }, (_, index)=>{
491
- const starValue = index + 1;
492
- return /*#__PURE__*/ jsx("button", {
493
- type: "button",
494
- disabled: pending,
495
- "aria-label": `Set ${starValue} out of ${maxRating}`,
496
- "aria-pressed": starValue <= rating,
497
- onClick: ()=>onCommit(String(starValue)),
498
- style: {
499
- border: "none",
500
- background: "none",
501
- padding: 0,
502
- cursor: "pointer",
503
- lineHeight: 0
504
- },
505
- children: /*#__PURE__*/ jsx("svg", {
506
- width: 16,
507
- height: 16,
508
- viewBox: "0 0 16 16",
509
- fill: "none",
510
- "aria-hidden": "true",
511
- children: /*#__PURE__*/ jsx("path", {
512
- d: RATING_STAR_D,
513
- fill: starValue <= rating ? RATING_FILLED : RATING_EMPTY
514
- })
515
- })
516
- }, index);
517
- })
518
- }),
519
- pending && /*#__PURE__*/ jsx(EditPendingIndicator, {})
520
- ]
521
- });
522
- }
523
-
524
- export { CheckboxEditor as C, DateEditor as D, EditError as E, RatingEditor as R, SwitchEditor as S, TextEditor as T, SelectEditor as a, ReferenceEditor as b, TextFieldRoot as c, TextFieldPrefixIcon as d, TextFieldInput as e, resolveEditValue as r };
@@ -1,58 +0,0 @@
1
- 'use client';
2
- function __insertCSS(code) {
3
- if (!code || typeof document == 'undefined') return
4
- let head = document.head || document.getElementsByTagName('head')[0]
5
- let style = document.createElement('style')
6
- style.type = 'text/css'
7
- head.appendChild(style)
8
- ;style.styleSheet ? (style.styleSheet.cssText = code) : style.appendChild(document.createTextNode(code))
9
- }
10
-
11
- import { jsx } from 'react/jsx-runtime';
12
- import { u as useDataTableContext } from './DataTable-12s-Zml1x9Kr-12s-BR-yHfob.js';
13
-
14
- /**
15
- * The column-edge resize grip -- geometry ported from crisp's `resizablepanel`
16
- * recipe's "column" variant (`resizablepanel.recipe.ts`): a 7px hit target straddling
17
- * the 1px grid line (not a 1px target of its own -- far too thin to reliably grab),
18
- * its 3px inner bar invisible at rest and brand-solid on hover/drag. Uses native
19
- * Pointer Capture (`setPointerCapture`) rather than a `window`-level listener pair:
20
- * once captured, this SAME element keeps receiving `pointermove`/`pointerup` even
21
- * after the cursor leaves it, so the drag math can live entirely in this one
22
- * handler set with no effect/cleanup to get wrong.
23
- */ function ColumnResizeHandle({ columnKey, width }) {
24
- const { beginColumnResize, updateColumnResize, endColumnResize, isColumnResizing } = useDataTableContext();
25
- return /*#__PURE__*/ jsx("span", {
26
- // Mouse/pointer-drag only for now (no keyboard equivalent yet) -- `aria-hidden`
27
- // rather than `role="separator"` + `aria-label`, which would otherwise fold
28
- // "Resize column" into the OWNING header cell's own accessible name (a
29
- // columnheader's name is the concatenation of its own text plus every
30
- // descendant's), turning "Name" into "Name Resize column" for anyone using an
31
- // accessible-name query -- including this file's own tests.
32
- "aria-hidden": "true",
33
- className: "seed-data-table-resize-handle",
34
- "data-resizing": isColumnResizing(columnKey),
35
- draggable: false,
36
- onPointerDown: (event)=>{
37
- event.stopPropagation();
38
- event.preventDefault();
39
- event.currentTarget.setPointerCapture(event.pointerId);
40
- const startWidth = width ?? event.currentTarget.closest('[role="columnheader"]')?.getBoundingClientRect().width ?? 150;
41
- beginColumnResize(columnKey, event.clientX, startWidth);
42
- },
43
- onPointerMove: (event)=>{
44
- if (event.currentTarget.hasPointerCapture(event.pointerId)) {
45
- updateColumnResize(event.clientX);
46
- }
47
- },
48
- onPointerUp: (event)=>{
49
- event.currentTarget.releasePointerCapture(event.pointerId);
50
- endColumnResize();
51
- },
52
- children: /*#__PURE__*/ jsx("span", {
53
- className: "seed-data-table-resize-handle-inner"
54
- })
55
- });
56
- }
57
-
58
- export { ColumnResizeHandle as C };
@@ -1,58 +0,0 @@
1
- 'use client';
2
- function __insertCSS(code) {
3
- if (!code || typeof document == 'undefined') return
4
- let head = document.head || document.getElementsByTagName('head')[0]
5
- let style = document.createElement('style')
6
- style.type = 'text/css'
7
- head.appendChild(style)
8
- ;style.styleSheet ? (style.styleSheet.cssText = code) : style.appendChild(document.createTextNode(code))
9
- }
10
-
11
- var jsxRuntime = require('react/jsx-runtime');
12
- var DataTable12sZml1x9Kr12s = require('./DataTable-12s-Zml1x9Kr-12s-B-mwMBhn.cjs');
13
-
14
- /**
15
- * The column-edge resize grip -- geometry ported from crisp's `resizablepanel`
16
- * recipe's "column" variant (`resizablepanel.recipe.ts`): a 7px hit target straddling
17
- * the 1px grid line (not a 1px target of its own -- far too thin to reliably grab),
18
- * its 3px inner bar invisible at rest and brand-solid on hover/drag. Uses native
19
- * Pointer Capture (`setPointerCapture`) rather than a `window`-level listener pair:
20
- * once captured, this SAME element keeps receiving `pointermove`/`pointerup` even
21
- * after the cursor leaves it, so the drag math can live entirely in this one
22
- * handler set with no effect/cleanup to get wrong.
23
- */ function ColumnResizeHandle({ columnKey, width }) {
24
- const { beginColumnResize, updateColumnResize, endColumnResize, isColumnResizing } = DataTable12sZml1x9Kr12s.useDataTableContext();
25
- return /*#__PURE__*/ jsxRuntime.jsx("span", {
26
- // Mouse/pointer-drag only for now (no keyboard equivalent yet) -- `aria-hidden`
27
- // rather than `role="separator"` + `aria-label`, which would otherwise fold
28
- // "Resize column" into the OWNING header cell's own accessible name (a
29
- // columnheader's name is the concatenation of its own text plus every
30
- // descendant's), turning "Name" into "Name Resize column" for anyone using an
31
- // accessible-name query -- including this file's own tests.
32
- "aria-hidden": "true",
33
- className: "seed-data-table-resize-handle",
34
- "data-resizing": isColumnResizing(columnKey),
35
- draggable: false,
36
- onPointerDown: (event)=>{
37
- event.stopPropagation();
38
- event.preventDefault();
39
- event.currentTarget.setPointerCapture(event.pointerId);
40
- const startWidth = width ?? event.currentTarget.closest('[role="columnheader"]')?.getBoundingClientRect().width ?? 150;
41
- beginColumnResize(columnKey, event.clientX, startWidth);
42
- },
43
- onPointerMove: (event)=>{
44
- if (event.currentTarget.hasPointerCapture(event.pointerId)) {
45
- updateColumnResize(event.clientX);
46
- }
47
- },
48
- onPointerUp: (event)=>{
49
- event.currentTarget.releasePointerCapture(event.pointerId);
50
- endColumnResize();
51
- },
52
- children: /*#__PURE__*/ jsxRuntime.jsx("span", {
53
- className: "seed-data-table-resize-handle-inner"
54
- })
55
- });
56
- }
57
-
58
- exports.ColumnResizeHandle = ColumnResizeHandle;