@inf-monkeys-tech/monkeys-design 1.0.97 → 1.0.99
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/components/data-explorer/index.d.mts +3 -3
- package/dist/components/data-explorer/index.d.ts +3 -3
- package/dist/components/data-explorer/index.js +183 -0
- package/dist/components/data-explorer/index.js.map +1 -1
- package/dist/components/data-explorer/index.mjs +182 -1
- package/dist/components/data-explorer/index.mjs.map +1 -1
- package/dist/components/navigation-sidebar/index.d.mts +1 -1
- package/dist/components/navigation-sidebar/index.d.ts +1 -1
- package/dist/index.d.mts +2 -2
- package/dist/index.d.ts +2 -2
- package/dist/index.js +180 -0
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +181 -2
- package/dist/index.mjs.map +1 -1
- package/dist/provider/index.d.mts +1 -1
- package/dist/provider/index.d.ts +1 -1
- package/dist/styles.css +1 -1
- package/dist/{theme-cfefa48a0db1.d.ts → theme-0fef4f282e64.d.mts} +3 -2
- package/dist/{theme-21107546ded5.d.mts → theme-169054c0dfb4.d.ts} +3 -2
- package/dist/{types-871f198ea40b.d.mts → types-e36d6f4b3ca8.d.mts} +65 -2
- package/dist/{types-871f198ea40b.d.ts → types-e36d6f4b3ca8.d.ts} +65 -2
- package/package.json +1 -1
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
export { D as DataExplorerActionBar, a as DataExplorerButton, b as DataExplorerCheckbox, c as DataExplorerCollectionFooter, d as DataExplorerDetailField, e as DataExplorerDetailSection, f as DataExplorerDetailShell, g as DataExplorerDisplayActionMenu, h as DataExplorerDisplayCard, i as DataExplorerDisplayCollectionView, j as DataExplorerDisplayListItem, k as DataExplorerDisplayMedia, l as DataExplorerFilterBar, m as DataExplorerImagePreview, n as DataExplorerPage, o as DataExplorerRecordCard, p as
|
|
1
|
+
export { D as DataExplorerActionBar, a as DataExplorerButton, b as DataExplorerCheckbox, c as DataExplorerCollectionFooter, d as DataExplorerDetailField, e as DataExplorerDetailSection, f as DataExplorerDetailShell, g as DataExplorerDisplayActionMenu, h as DataExplorerDisplayCard, i as DataExplorerDisplayCollectionView, j as DataExplorerDisplayListItem, k as DataExplorerDisplayMedia, l as DataExplorerFilterBar, m as DataExplorerImagePreview, n as DataExplorerPage, o as DataExplorerRecordCard, p as DataExplorerRecordPicker, q as DataExplorerSelect, r as DataExplorerToolbarActions, s as DataExplorerToolbarShell, t as DataExplorerTree, u as DataExplorerTreeShell, v as DataExplorerView, w as DataExplorerViewCollection, x as DataExplorerViewItem, y as DataExplorerViewItemShell, z as DataExplorerViewShell, A as DataExplorerViewTree, B as getDataExplorerActionToneClassName, C as getDataExplorerMenuItemToneClassName, E as resolveDataExplorerAppearance } from '../../theme-0fef4f282e64.mjs';
|
|
2
2
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
3
|
-
import {
|
|
4
|
-
export { D as DataExplorerAction, a as DataExplorerActionBarClassNames, b as DataExplorerActionBarProps, c as DataExplorerAppearance, d as DataExplorerBackground, e as DataExplorerBorder, f as DataExplorerButtonClassNames, g as DataExplorerButtonProps, h as DataExplorerCapabilities, i as DataExplorerCheckboxClassNames, j as DataExplorerCheckboxProps, k as DataExplorerCollectionFooterClassNames, l as DataExplorerCollectionFooterProps, m as DataExplorerControlOption, n as DataExplorerControlTone, o as DataExplorerDensity, p as DataExplorerDetailFieldClassNames, q as DataExplorerDetailFieldDefinition, r as DataExplorerDetailFieldProps, s as DataExplorerDetailNavigation, t as DataExplorerDetailSectionClassNames, u as DataExplorerDetailSectionDefinition, v as DataExplorerDetailSectionProps, w as DataExplorerDetailShellClassNames, x as DataExplorerDetailShellProps, y as DataExplorerDisplayAction, z as DataExplorerDisplayActionContext, A as DataExplorerDisplayActionMenuClassNames, B as DataExplorerDisplayActionMenuProps, C as DataExplorerDisplayBadge, E as DataExplorerDisplayCardClassNames, F as DataExplorerDisplayCardProps, G as DataExplorerDisplayCollectionItemContext, H as DataExplorerDisplayCollectionItemPropsResolver, I as DataExplorerDisplayCollectionViewProps, J as DataExplorerDisplayItem, K as DataExplorerDisplayListItemClassNames, L as DataExplorerDisplayListItemProps, M as DataExplorerDisplayMediaClassNames, N as DataExplorerDisplayMediaItem, O as DataExplorerDisplayMediaKind, P as DataExplorerDisplayMediaProps, Q as DataExplorerDisplayMetadata,
|
|
3
|
+
import { aO as DataExplorerSplitButtonProps, aP as DataExplorerDraggableTreeProps } from '../../types-e36d6f4b3ca8.mjs';
|
|
4
|
+
export { D as DataExplorerAction, a as DataExplorerActionBarClassNames, b as DataExplorerActionBarProps, c as DataExplorerAppearance, d as DataExplorerBackground, e as DataExplorerBorder, f as DataExplorerButtonClassNames, g as DataExplorerButtonProps, h as DataExplorerCapabilities, i as DataExplorerCheckboxClassNames, j as DataExplorerCheckboxProps, k as DataExplorerCollectionFooterClassNames, l as DataExplorerCollectionFooterProps, m as DataExplorerControlOption, n as DataExplorerControlTone, o as DataExplorerDensity, p as DataExplorerDetailFieldClassNames, q as DataExplorerDetailFieldDefinition, r as DataExplorerDetailFieldProps, s as DataExplorerDetailNavigation, t as DataExplorerDetailSectionClassNames, u as DataExplorerDetailSectionDefinition, v as DataExplorerDetailSectionProps, w as DataExplorerDetailShellClassNames, x as DataExplorerDetailShellProps, y as DataExplorerDisplayAction, z as DataExplorerDisplayActionContext, A as DataExplorerDisplayActionMenuClassNames, B as DataExplorerDisplayActionMenuProps, C as DataExplorerDisplayBadge, E as DataExplorerDisplayCardClassNames, F as DataExplorerDisplayCardProps, G as DataExplorerDisplayCollectionItemContext, H as DataExplorerDisplayCollectionItemPropsResolver, I as DataExplorerDisplayCollectionViewProps, J as DataExplorerDisplayItem, K as DataExplorerDisplayListItemClassNames, L as DataExplorerDisplayListItemProps, M as DataExplorerDisplayMediaClassNames, N as DataExplorerDisplayMediaItem, O as DataExplorerDisplayMediaKind, P as DataExplorerDisplayMediaProps, Q as DataExplorerDisplayMetadata, aQ as DataExplorerDraggableTreeClassNames, aR as DataExplorerDraggableTreeDragPayload, aS as DataExplorerDraggableTreeFlattenedNode, aT as DataExplorerDraggableTreeLabels, aU as DataExplorerDraggableTreeNode, aV as DataExplorerDraggableTreeRenderContext, R as DataExplorerFilterBarClassNames, S as DataExplorerFilterBarProps, T as DataExplorerImagePreviewClassNames, U as DataExplorerImagePreviewNaturalSize, V as DataExplorerImagePreviewProps, W as DataExplorerMeasuredGridOptions, X as DataExplorerPageClassNames, Y as DataExplorerPageProps, Z as DataExplorerRadius, _ as DataExplorerRecordCardClassNames, $ as DataExplorerRecordCardProps, a0 as DataExplorerRecordPickerClassNames, a1 as DataExplorerRecordPickerOption, a2 as DataExplorerRecordPickerProps, a3 as DataExplorerResolvedTheme, a4 as DataExplorerResolver, a5 as DataExplorerSelectClassNames, a6 as DataExplorerSelectProps, aW as DataExplorerSplitButtonClassNames, aX as DataExplorerSplitButtonItem, a7 as DataExplorerThemePresetId, a8 as DataExplorerThemeSlots, a9 as DataExplorerThemeStyles, aa as DataExplorerToolbarAction, ab as DataExplorerToolbarActionItem, ac as DataExplorerToolbarActionKind, ad as DataExplorerToolbarActionOption, ae as DataExplorerToolbarActionsClassNames, af as DataExplorerToolbarActionsLayout, ag as DataExplorerToolbarActionsProps, ah as DataExplorerToolbarShellClassNames, ai as DataExplorerToolbarShellProps, aj as DataExplorerToolbarViewOption, ak as DataExplorerTreeClassNames, al as DataExplorerTreeProps, am as DataExplorerTreeRenderProps, an as DataExplorerTreeShellClassNames, ao as DataExplorerTreeShellProps, ap as DataExplorerViewClassNames, aq as DataExplorerViewCollectionClassNames, ar as DataExplorerViewCollectionLayout, as as DataExplorerViewCollectionOptions, at as DataExplorerViewCollectionProps, au as DataExplorerViewDefinition, av as DataExplorerViewId, aw as DataExplorerViewItemDefinition, ax as DataExplorerViewItemProps, ay as DataExplorerViewItemShellClassNames, az as DataExplorerViewItemShellProps, aA as DataExplorerViewOption, aB as DataExplorerViewProps, aC as DataExplorerViewRenderProps, aD as DataExplorerViewShellClassNames, aE as DataExplorerViewShellProps, aF as DataExplorerViewTreeAction, aG as DataExplorerViewTreeActionContext, aH as DataExplorerViewTreeClassNames, aI as DataExplorerViewTreeEntryType, aJ as DataExplorerViewTreeGroup, aK as DataExplorerViewTreeLabels, aL as DataExplorerViewTreeNode, aM as DataExplorerViewTreeProps, aN as DataExplorerViewTreeReorderPayload } from '../../types-e36d6f4b3ca8.mjs';
|
|
5
5
|
import 'react';
|
|
6
6
|
declare function DataExplorerSplitButton({ label, icon, items, onPrimaryAction, onAction, menuLabel, triggerLabel, title, tone, active, disabled, appearance, className, classNames, }: DataExplorerSplitButtonProps): react_jsx_runtime.JSX.Element;
|
|
7
7
|
declare function DataExplorerDraggableTree<TSource = unknown, TContext = unknown>({ nodes, context, selectedNodeId, expandedNodeIds, defaultExpandedNodeIds, resetExpansionKey, indentSize, activationMode, loading, empty, labels, appearance, itemRadius, className, classNames, renderNodeActions, renderNodeChildren, onSelectNode, onExpandedNodeIdsChange, onDragEnd, }: DataExplorerDraggableTreeProps<TSource, TContext>): react_jsx_runtime.JSX.Element;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
export { D as DataExplorerActionBar, a as DataExplorerButton, b as DataExplorerCheckbox, c as DataExplorerCollectionFooter, d as DataExplorerDetailField, e as DataExplorerDetailSection, f as DataExplorerDetailShell, g as DataExplorerDisplayActionMenu, h as DataExplorerDisplayCard, i as DataExplorerDisplayCollectionView, j as DataExplorerDisplayListItem, k as DataExplorerDisplayMedia, l as DataExplorerFilterBar, m as DataExplorerImagePreview, n as DataExplorerPage, o as DataExplorerRecordCard, p as
|
|
1
|
+
export { D as DataExplorerActionBar, a as DataExplorerButton, b as DataExplorerCheckbox, c as DataExplorerCollectionFooter, d as DataExplorerDetailField, e as DataExplorerDetailSection, f as DataExplorerDetailShell, g as DataExplorerDisplayActionMenu, h as DataExplorerDisplayCard, i as DataExplorerDisplayCollectionView, j as DataExplorerDisplayListItem, k as DataExplorerDisplayMedia, l as DataExplorerFilterBar, m as DataExplorerImagePreview, n as DataExplorerPage, o as DataExplorerRecordCard, p as DataExplorerRecordPicker, q as DataExplorerSelect, r as DataExplorerToolbarActions, s as DataExplorerToolbarShell, t as DataExplorerTree, u as DataExplorerTreeShell, v as DataExplorerView, w as DataExplorerViewCollection, x as DataExplorerViewItem, y as DataExplorerViewItemShell, z as DataExplorerViewShell, A as DataExplorerViewTree, B as getDataExplorerActionToneClassName, C as getDataExplorerMenuItemToneClassName, E as resolveDataExplorerAppearance } from '../../theme-169054c0dfb4.js';
|
|
2
2
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
3
|
-
import {
|
|
4
|
-
export { D as DataExplorerAction, a as DataExplorerActionBarClassNames, b as DataExplorerActionBarProps, c as DataExplorerAppearance, d as DataExplorerBackground, e as DataExplorerBorder, f as DataExplorerButtonClassNames, g as DataExplorerButtonProps, h as DataExplorerCapabilities, i as DataExplorerCheckboxClassNames, j as DataExplorerCheckboxProps, k as DataExplorerCollectionFooterClassNames, l as DataExplorerCollectionFooterProps, m as DataExplorerControlOption, n as DataExplorerControlTone, o as DataExplorerDensity, p as DataExplorerDetailFieldClassNames, q as DataExplorerDetailFieldDefinition, r as DataExplorerDetailFieldProps, s as DataExplorerDetailNavigation, t as DataExplorerDetailSectionClassNames, u as DataExplorerDetailSectionDefinition, v as DataExplorerDetailSectionProps, w as DataExplorerDetailShellClassNames, x as DataExplorerDetailShellProps, y as DataExplorerDisplayAction, z as DataExplorerDisplayActionContext, A as DataExplorerDisplayActionMenuClassNames, B as DataExplorerDisplayActionMenuProps, C as DataExplorerDisplayBadge, E as DataExplorerDisplayCardClassNames, F as DataExplorerDisplayCardProps, G as DataExplorerDisplayCollectionItemContext, H as DataExplorerDisplayCollectionItemPropsResolver, I as DataExplorerDisplayCollectionViewProps, J as DataExplorerDisplayItem, K as DataExplorerDisplayListItemClassNames, L as DataExplorerDisplayListItemProps, M as DataExplorerDisplayMediaClassNames, N as DataExplorerDisplayMediaItem, O as DataExplorerDisplayMediaKind, P as DataExplorerDisplayMediaProps, Q as DataExplorerDisplayMetadata,
|
|
3
|
+
import { aO as DataExplorerSplitButtonProps, aP as DataExplorerDraggableTreeProps } from '../../types-e36d6f4b3ca8.js';
|
|
4
|
+
export { D as DataExplorerAction, a as DataExplorerActionBarClassNames, b as DataExplorerActionBarProps, c as DataExplorerAppearance, d as DataExplorerBackground, e as DataExplorerBorder, f as DataExplorerButtonClassNames, g as DataExplorerButtonProps, h as DataExplorerCapabilities, i as DataExplorerCheckboxClassNames, j as DataExplorerCheckboxProps, k as DataExplorerCollectionFooterClassNames, l as DataExplorerCollectionFooterProps, m as DataExplorerControlOption, n as DataExplorerControlTone, o as DataExplorerDensity, p as DataExplorerDetailFieldClassNames, q as DataExplorerDetailFieldDefinition, r as DataExplorerDetailFieldProps, s as DataExplorerDetailNavigation, t as DataExplorerDetailSectionClassNames, u as DataExplorerDetailSectionDefinition, v as DataExplorerDetailSectionProps, w as DataExplorerDetailShellClassNames, x as DataExplorerDetailShellProps, y as DataExplorerDisplayAction, z as DataExplorerDisplayActionContext, A as DataExplorerDisplayActionMenuClassNames, B as DataExplorerDisplayActionMenuProps, C as DataExplorerDisplayBadge, E as DataExplorerDisplayCardClassNames, F as DataExplorerDisplayCardProps, G as DataExplorerDisplayCollectionItemContext, H as DataExplorerDisplayCollectionItemPropsResolver, I as DataExplorerDisplayCollectionViewProps, J as DataExplorerDisplayItem, K as DataExplorerDisplayListItemClassNames, L as DataExplorerDisplayListItemProps, M as DataExplorerDisplayMediaClassNames, N as DataExplorerDisplayMediaItem, O as DataExplorerDisplayMediaKind, P as DataExplorerDisplayMediaProps, Q as DataExplorerDisplayMetadata, aQ as DataExplorerDraggableTreeClassNames, aR as DataExplorerDraggableTreeDragPayload, aS as DataExplorerDraggableTreeFlattenedNode, aT as DataExplorerDraggableTreeLabels, aU as DataExplorerDraggableTreeNode, aV as DataExplorerDraggableTreeRenderContext, R as DataExplorerFilterBarClassNames, S as DataExplorerFilterBarProps, T as DataExplorerImagePreviewClassNames, U as DataExplorerImagePreviewNaturalSize, V as DataExplorerImagePreviewProps, W as DataExplorerMeasuredGridOptions, X as DataExplorerPageClassNames, Y as DataExplorerPageProps, Z as DataExplorerRadius, _ as DataExplorerRecordCardClassNames, $ as DataExplorerRecordCardProps, a0 as DataExplorerRecordPickerClassNames, a1 as DataExplorerRecordPickerOption, a2 as DataExplorerRecordPickerProps, a3 as DataExplorerResolvedTheme, a4 as DataExplorerResolver, a5 as DataExplorerSelectClassNames, a6 as DataExplorerSelectProps, aW as DataExplorerSplitButtonClassNames, aX as DataExplorerSplitButtonItem, a7 as DataExplorerThemePresetId, a8 as DataExplorerThemeSlots, a9 as DataExplorerThemeStyles, aa as DataExplorerToolbarAction, ab as DataExplorerToolbarActionItem, ac as DataExplorerToolbarActionKind, ad as DataExplorerToolbarActionOption, ae as DataExplorerToolbarActionsClassNames, af as DataExplorerToolbarActionsLayout, ag as DataExplorerToolbarActionsProps, ah as DataExplorerToolbarShellClassNames, ai as DataExplorerToolbarShellProps, aj as DataExplorerToolbarViewOption, ak as DataExplorerTreeClassNames, al as DataExplorerTreeProps, am as DataExplorerTreeRenderProps, an as DataExplorerTreeShellClassNames, ao as DataExplorerTreeShellProps, ap as DataExplorerViewClassNames, aq as DataExplorerViewCollectionClassNames, ar as DataExplorerViewCollectionLayout, as as DataExplorerViewCollectionOptions, at as DataExplorerViewCollectionProps, au as DataExplorerViewDefinition, av as DataExplorerViewId, aw as DataExplorerViewItemDefinition, ax as DataExplorerViewItemProps, ay as DataExplorerViewItemShellClassNames, az as DataExplorerViewItemShellProps, aA as DataExplorerViewOption, aB as DataExplorerViewProps, aC as DataExplorerViewRenderProps, aD as DataExplorerViewShellClassNames, aE as DataExplorerViewShellProps, aF as DataExplorerViewTreeAction, aG as DataExplorerViewTreeActionContext, aH as DataExplorerViewTreeClassNames, aI as DataExplorerViewTreeEntryType, aJ as DataExplorerViewTreeGroup, aK as DataExplorerViewTreeLabels, aL as DataExplorerViewTreeNode, aM as DataExplorerViewTreeProps, aN as DataExplorerViewTreeReorderPayload } from '../../types-e36d6f4b3ca8.js';
|
|
5
5
|
import 'react';
|
|
6
6
|
declare function DataExplorerSplitButton({ label, icon, items, onPrimaryAction, onAction, menuLabel, triggerLabel, title, tone, active, disabled, appearance, className, classNames, }: DataExplorerSplitButtonProps): react_jsx_runtime.JSX.Element;
|
|
7
7
|
declare function DataExplorerDraggableTree<TSource = unknown, TContext = unknown>({ nodes, context, selectedNodeId, expandedNodeIds, defaultExpandedNodeIds, resetExpansionKey, indentSize, activationMode, loading, empty, labels, appearance, itemRadius, className, classNames, renderNodeActions, renderNodeChildren, onSelectNode, onExpandedNodeIdsChange, onDragEnd, }: DataExplorerDraggableTreeProps<TSource, TContext>): react_jsx_runtime.JSX.Element;
|
|
@@ -8,6 +8,8 @@ var core = require('@dnd-kit/core');
|
|
|
8
8
|
var sortable = require('@dnd-kit/sortable');
|
|
9
9
|
var utilities = require('@dnd-kit/utilities');
|
|
10
10
|
var reactDom = require('react-dom');
|
|
11
|
+
var Popover = require('@radix-ui/react-popover');
|
|
12
|
+
var lucideReact = require('lucide-react');
|
|
11
13
|
|
|
12
14
|
function _interopNamespace(e) {
|
|
13
15
|
if (e && e.__esModule) return e;
|
|
@@ -28,6 +30,7 @@ function _interopNamespace(e) {
|
|
|
28
30
|
}
|
|
29
31
|
|
|
30
32
|
var DropdownMenu4__namespace = /*#__PURE__*/_interopNamespace(DropdownMenu4);
|
|
33
|
+
var Popover__namespace = /*#__PURE__*/_interopNamespace(Popover);
|
|
31
34
|
|
|
32
35
|
// src/components/data-explorer/DataExplorerToolbarActions.tsx
|
|
33
36
|
|
|
@@ -6443,6 +6446,185 @@ function DataExplorerRecordCard({
|
|
|
6443
6446
|
}
|
|
6444
6447
|
);
|
|
6445
6448
|
}
|
|
6449
|
+
var normalizeValues = (value, multiple) => {
|
|
6450
|
+
const values = multiple ? Array.isArray(value) ? value : value ? [value] : [] : typeof value === "string" ? [value] : [];
|
|
6451
|
+
return Array.from(new Set(values.filter((item) => typeof item === "string" && item.length > 0)));
|
|
6452
|
+
};
|
|
6453
|
+
var getOptionText = (option) => option.textValue ?? (typeof option.label === "string" ? option.label : option.value);
|
|
6454
|
+
function DataExplorerRecordPicker({
|
|
6455
|
+
value,
|
|
6456
|
+
activeValue,
|
|
6457
|
+
options = [],
|
|
6458
|
+
createOption,
|
|
6459
|
+
multiple = false,
|
|
6460
|
+
placeholder = "Select a record",
|
|
6461
|
+
triggerLabel,
|
|
6462
|
+
triggerIcon,
|
|
6463
|
+
searchPlaceholder = "Search records",
|
|
6464
|
+
emptyState = "No records found",
|
|
6465
|
+
loadingState,
|
|
6466
|
+
errorState,
|
|
6467
|
+
loading = false,
|
|
6468
|
+
disabled = false,
|
|
6469
|
+
open,
|
|
6470
|
+
defaultOpen = false,
|
|
6471
|
+
searchValue,
|
|
6472
|
+
defaultSearchValue = "",
|
|
6473
|
+
appearance,
|
|
6474
|
+
className,
|
|
6475
|
+
classNames,
|
|
6476
|
+
triggerProps,
|
|
6477
|
+
dataAttributes,
|
|
6478
|
+
onOpenChange,
|
|
6479
|
+
onListScroll,
|
|
6480
|
+
onSearchValueChange,
|
|
6481
|
+
onValueChange
|
|
6482
|
+
}) {
|
|
6483
|
+
const theme = resolveDataExplorerAppearance(appearance);
|
|
6484
|
+
const [uncontrolledOpen, setUncontrolledOpen] = react.useState(defaultOpen);
|
|
6485
|
+
const [uncontrolledSearch, setUncontrolledSearch] = react.useState(defaultSearchValue);
|
|
6486
|
+
const isControlledOpen = open !== void 0;
|
|
6487
|
+
const isOpen = isControlledOpen ? open : uncontrolledOpen;
|
|
6488
|
+
const isControlledSearch = searchValue !== void 0;
|
|
6489
|
+
const query = isControlledSearch ? searchValue : uncontrolledSearch;
|
|
6490
|
+
const selectedValues = react.useMemo(() => normalizeValues(value, multiple), [multiple, value]);
|
|
6491
|
+
const selectedSet = react.useMemo(() => new Set(selectedValues), [selectedValues]);
|
|
6492
|
+
const selectedOptions = selectedValues.map((selectedValue) => options.find((option) => option.value === selectedValue)).filter((option) => Boolean(option));
|
|
6493
|
+
const visibleOptions = createOption ? [createOption, ...options] : options;
|
|
6494
|
+
const triggerValue = selectedOptions.length ? multiple && selectedOptions.length > 1 ? `${selectedOptions.slice(0, 2).map((option) => getOptionText(option)).join(", ")} +${selectedOptions.length - 2}` : getOptionText(selectedOptions[0]) : placeholder;
|
|
6495
|
+
react.useEffect(() => {
|
|
6496
|
+
if (!isOpen) return;
|
|
6497
|
+
const handleKeyDown = (event) => {
|
|
6498
|
+
if (event.key === "Escape") onOpenChange?.(false);
|
|
6499
|
+
};
|
|
6500
|
+
window.addEventListener("keydown", handleKeyDown);
|
|
6501
|
+
return () => window.removeEventListener("keydown", handleKeyDown);
|
|
6502
|
+
}, [isOpen, onOpenChange]);
|
|
6503
|
+
const setOpen = (nextOpen) => {
|
|
6504
|
+
if (disabled) return;
|
|
6505
|
+
if (!isControlledOpen) setUncontrolledOpen(nextOpen);
|
|
6506
|
+
onOpenChange?.(nextOpen);
|
|
6507
|
+
};
|
|
6508
|
+
const setQuery = (nextQuery) => {
|
|
6509
|
+
if (!isControlledSearch) setUncontrolledSearch(nextQuery);
|
|
6510
|
+
onSearchValueChange?.(nextQuery);
|
|
6511
|
+
};
|
|
6512
|
+
const handleOptionClick = (option) => {
|
|
6513
|
+
if (disabled || option.disabled) return;
|
|
6514
|
+
if (multiple) {
|
|
6515
|
+
const nextValues = selectedSet.has(option.value) ? selectedValues.filter((selectedValue) => selectedValue !== option.value) : [...selectedValues, option.value];
|
|
6516
|
+
onValueChange?.(nextValues);
|
|
6517
|
+
return;
|
|
6518
|
+
}
|
|
6519
|
+
onValueChange?.(option.value);
|
|
6520
|
+
setOpen(false);
|
|
6521
|
+
};
|
|
6522
|
+
const removeValue = (selectedValue) => {
|
|
6523
|
+
if (disabled) return;
|
|
6524
|
+
onValueChange?.(selectedValues.filter((valueItem) => valueItem !== selectedValue));
|
|
6525
|
+
};
|
|
6526
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { ...dataAttributes?.root, className: cn("relative min-w-0 w-full", classNames?.root, className), children: [
|
|
6527
|
+
/* @__PURE__ */ jsxRuntime.jsxs(Popover__namespace.Root, { open: isOpen, onOpenChange: setOpen, children: [
|
|
6528
|
+
/* @__PURE__ */ jsxRuntime.jsx(Popover__namespace.Trigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
6529
|
+
"button",
|
|
6530
|
+
{
|
|
6531
|
+
...triggerProps,
|
|
6532
|
+
...dataAttributes?.trigger,
|
|
6533
|
+
type: "button",
|
|
6534
|
+
disabled,
|
|
6535
|
+
"aria-label": triggerLabel,
|
|
6536
|
+
"aria-expanded": isOpen,
|
|
6537
|
+
className: cn(theme.slots.controlSelectTrigger, classNames?.trigger),
|
|
6538
|
+
children: [
|
|
6539
|
+
triggerIcon,
|
|
6540
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { ...dataAttributes?.triggerValue, className: cn(theme.slots.controlSelectValue, !selectedOptions.length && "text-muted-foreground", classNames?.triggerValue), children: triggerValue }),
|
|
6541
|
+
/* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { className: "h-4 w-4 shrink-0", "aria-hidden": "true" })
|
|
6542
|
+
]
|
|
6543
|
+
}
|
|
6544
|
+
) }),
|
|
6545
|
+
/* @__PURE__ */ jsxRuntime.jsx(Popover__namespace.Portal, { children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
6546
|
+
Popover__namespace.Content,
|
|
6547
|
+
{
|
|
6548
|
+
...dataAttributes?.content,
|
|
6549
|
+
align: "start",
|
|
6550
|
+
sideOffset: 6,
|
|
6551
|
+
className: cn("z-50 w-[min(30rem,calc(100vw-2rem))] rounded-md border border-border bg-popover p-2 text-popover-foreground shadow-md", classNames?.content),
|
|
6552
|
+
onOpenAutoFocus: (event) => event.preventDefault(),
|
|
6553
|
+
children: [
|
|
6554
|
+
/* @__PURE__ */ jsxRuntime.jsxs("label", { className: cn("flex h-9 items-center gap-2 rounded-md border border-border bg-background px-2 text-sm", classNames?.search), children: [
|
|
6555
|
+
/* @__PURE__ */ jsxRuntime.jsx(lucideReact.Search, { className: "h-4 w-4 shrink-0 text-muted-foreground", "aria-hidden": "true" }),
|
|
6556
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
6557
|
+
"input",
|
|
6558
|
+
{
|
|
6559
|
+
autoFocus: true,
|
|
6560
|
+
value: query,
|
|
6561
|
+
onChange: (event) => setQuery(event.target.value),
|
|
6562
|
+
placeholder: searchPlaceholder,
|
|
6563
|
+
"aria-label": searchPlaceholder,
|
|
6564
|
+
className: "min-w-0 flex-1 bg-transparent outline-none placeholder:text-muted-foreground"
|
|
6565
|
+
}
|
|
6566
|
+
)
|
|
6567
|
+
] }),
|
|
6568
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
6569
|
+
"div",
|
|
6570
|
+
{
|
|
6571
|
+
className: cn("mt-2 max-h-72 overflow-y-auto", classNames?.list),
|
|
6572
|
+
...dataAttributes?.list,
|
|
6573
|
+
role: "listbox",
|
|
6574
|
+
"aria-multiselectable": multiple || void 0,
|
|
6575
|
+
onScroll: onListScroll,
|
|
6576
|
+
children: loading ? /* @__PURE__ */ jsxRuntime.jsxs("div", { ...dataAttributes?.loading, className: cn("flex min-h-16 items-center justify-center gap-2 px-3 py-4 text-sm text-muted-foreground", classNames?.status), children: [
|
|
6577
|
+
/* @__PURE__ */ jsxRuntime.jsx(lucideReact.Loader2, { className: "h-4 w-4 animate-spin", "aria-hidden": "true" }),
|
|
6578
|
+
loadingState ?? "Loading records..."
|
|
6579
|
+
] }) : errorState ? /* @__PURE__ */ jsxRuntime.jsx("div", { ...dataAttributes?.error, className: cn("px-3 py-4 text-sm text-destructive-text", classNames?.status), children: errorState }) : visibleOptions.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", { ...dataAttributes?.empty, className: cn("px-3 py-4 text-sm text-muted-foreground", classNames?.status), children: emptyState }) : visibleOptions.map((option) => {
|
|
6580
|
+
const selected = selectedSet.has(option.value);
|
|
6581
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
6582
|
+
"button",
|
|
6583
|
+
{
|
|
6584
|
+
...dataAttributes?.option,
|
|
6585
|
+
type: "button",
|
|
6586
|
+
role: "option",
|
|
6587
|
+
"aria-selected": selected,
|
|
6588
|
+
"aria-current": activeValue !== void 0 && option.value === activeValue ? "true" : void 0,
|
|
6589
|
+
disabled: option.disabled,
|
|
6590
|
+
onClick: () => handleOptionClick(option),
|
|
6591
|
+
className: cn(
|
|
6592
|
+
"flex w-full items-start gap-2 rounded-sm px-2.5 py-2 text-left text-sm transition-colors hover:bg-accent hover:text-accent-foreground disabled:pointer-events-none disabled:opacity-50",
|
|
6593
|
+
selected && "bg-accent/60",
|
|
6594
|
+
classNames?.option
|
|
6595
|
+
),
|
|
6596
|
+
children: [
|
|
6597
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: cn("mt-0.5 flex h-4 w-4 shrink-0 items-center justify-center", classNames?.optionIndicator), children: selected ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Check, { className: "h-4 w-4", "aria-hidden": "true" }) : null }),
|
|
6598
|
+
/* @__PURE__ */ jsxRuntime.jsxs("span", { className: "min-w-0 flex-1", children: [
|
|
6599
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: cn("block truncate", classNames?.optionLabel), children: option.label }),
|
|
6600
|
+
option.description ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: cn("mt-0.5 block truncate text-xs text-muted-foreground", classNames?.optionDescription), children: option.description }) : null
|
|
6601
|
+
] })
|
|
6602
|
+
]
|
|
6603
|
+
},
|
|
6604
|
+
option.value
|
|
6605
|
+
);
|
|
6606
|
+
})
|
|
6607
|
+
}
|
|
6608
|
+
)
|
|
6609
|
+
]
|
|
6610
|
+
}
|
|
6611
|
+
) })
|
|
6612
|
+
] }),
|
|
6613
|
+
multiple && selectedOptions.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mt-2 flex flex-wrap gap-1.5", classNames?.selectedList), children: selectedOptions.map((option) => /* @__PURE__ */ jsxRuntime.jsxs("span", { className: cn("inline-flex max-w-full items-center gap-1 rounded-full border border-border bg-muted px-2 py-1 text-xs", classNames?.selectedItem), children: [
|
|
6614
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: cn("min-w-0 truncate", classNames?.selectedItemLabel), children: option.label }),
|
|
6615
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
6616
|
+
"button",
|
|
6617
|
+
{
|
|
6618
|
+
type: "button",
|
|
6619
|
+
"aria-label": `Remove ${getOptionText(option)}`,
|
|
6620
|
+
onClick: () => removeValue(option.value),
|
|
6621
|
+
className: cn("inline-flex h-4 w-4 shrink-0 items-center justify-center rounded-full text-muted-foreground hover:bg-accent hover:text-foreground", classNames?.selectedItemRemove),
|
|
6622
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "h-3 w-3", "aria-hidden": "true" })
|
|
6623
|
+
}
|
|
6624
|
+
)
|
|
6625
|
+
] }, option.value)) }) : null
|
|
6626
|
+
] });
|
|
6627
|
+
}
|
|
6446
6628
|
function DefaultSearchIcon() {
|
|
6447
6629
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
6448
6630
|
"svg",
|
|
@@ -7542,6 +7724,7 @@ exports.DataExplorerFilterBar = DataExplorerFilterBar;
|
|
|
7542
7724
|
exports.DataExplorerImagePreview = DataExplorerImagePreview;
|
|
7543
7725
|
exports.DataExplorerPage = DataExplorerPage;
|
|
7544
7726
|
exports.DataExplorerRecordCard = DataExplorerRecordCard;
|
|
7727
|
+
exports.DataExplorerRecordPicker = DataExplorerRecordPicker;
|
|
7545
7728
|
exports.DataExplorerSelect = DataExplorerSelect;
|
|
7546
7729
|
exports.DataExplorerSplitButton = DataExplorerSplitButton;
|
|
7547
7730
|
exports.DataExplorerToolbarActions = DataExplorerToolbarActions;
|