@helpwave/hightide 0.12.5 → 0.12.6
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/index.d.mts +31 -14
- package/dist/index.d.ts +31 -14
- package/dist/index.js +154 -95
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +232 -174
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.mjs
CHANGED
|
@@ -14113,11 +14113,11 @@ var VerticalDivider = ({
|
|
|
14113
14113
|
|
|
14114
14114
|
// src/components/layout/app/AppPage.tsx
|
|
14115
14115
|
import clsx15 from "clsx";
|
|
14116
|
-
import { useCallback as useCallback28, useMemo as useMemo22, useRef as useRef25, useState as
|
|
14116
|
+
import { useCallback as useCallback28, useMemo as useMemo22, useRef as useRef25, useState as useState23 } from "react";
|
|
14117
14117
|
import { MenuIcon, X } from "lucide-react";
|
|
14118
14118
|
|
|
14119
14119
|
// src/components/layout/navigation/navigation-menus/NavigationContext.tsx
|
|
14120
|
-
import { createContext as createContext11, useCallback as useCallback26, useContext as useContext12, useEffect as useEffect28, useMemo as useMemo21, useRef as useRef23 } from "react";
|
|
14120
|
+
import { createContext as createContext11, useCallback as useCallback26, useContext as useContext12, useEffect as useEffect28, useMemo as useMemo21, useRef as useRef23, useState as useState22 } from "react";
|
|
14121
14121
|
|
|
14122
14122
|
// src/hooks/useTreeNavigation.ts
|
|
14123
14123
|
import { useCallback as useCallback25, useEffect as useEffect27, useMemo as useMemo20, useState as useState21 } from "react";
|
|
@@ -14139,6 +14139,22 @@ function buildTreeIndex(nodes) {
|
|
|
14139
14139
|
roots: [...nodes]
|
|
14140
14140
|
};
|
|
14141
14141
|
}
|
|
14142
|
+
function resolveTreeNodePath(nodes, id) {
|
|
14143
|
+
if (id == null) return null;
|
|
14144
|
+
const entry = buildTreeIndex(nodes).byId.get(id);
|
|
14145
|
+
return entry?.path ?? null;
|
|
14146
|
+
}
|
|
14147
|
+
function flattenAllItems(nodes, expandedIds, path = []) {
|
|
14148
|
+
const result = [];
|
|
14149
|
+
for (const node of nodes) {
|
|
14150
|
+
const currentPath = [...path, node.id];
|
|
14151
|
+
const hasChildren = node.items.length > 0;
|
|
14152
|
+
const expanded = hasChildren && expandedIds.has(node.id);
|
|
14153
|
+
result.push({ id: node.id, path: currentPath, expanded });
|
|
14154
|
+
result.push(...flattenAllItems(node.items, expandedIds, currentPath));
|
|
14155
|
+
}
|
|
14156
|
+
return result;
|
|
14157
|
+
}
|
|
14142
14158
|
function flattenVisibleItems(nodes, expandedIds, path = []) {
|
|
14143
14159
|
const result = [];
|
|
14144
14160
|
for (const node of nodes) {
|
|
@@ -14175,11 +14191,11 @@ function isAncestorOf(ancestorId, descendantPath) {
|
|
|
14175
14191
|
const index = descendantPath.indexOf(ancestorId);
|
|
14176
14192
|
return index >= 0 && index < descendantPath.length - 1;
|
|
14177
14193
|
}
|
|
14178
|
-
function pruneExpandedIds(expandedIds,
|
|
14179
|
-
if (!onlyOneExpandedTree ||
|
|
14194
|
+
function pruneExpandedIds(expandedIds, focusedPath, onlyOneExpandedTree, index) {
|
|
14195
|
+
if (!onlyOneExpandedTree || focusedPath == null) {
|
|
14180
14196
|
return new Set(expandedIds);
|
|
14181
14197
|
}
|
|
14182
|
-
const pathSet = new Set(
|
|
14198
|
+
const pathSet = new Set(focusedPath);
|
|
14183
14199
|
const pruned = /* @__PURE__ */ new Set();
|
|
14184
14200
|
for (const id of expandedIds) {
|
|
14185
14201
|
if (!pathSet.has(id)) continue;
|
|
@@ -14190,77 +14206,80 @@ function pruneExpandedIds(expandedIds, activePath, onlyOneExpandedTree, index) {
|
|
|
14190
14206
|
}
|
|
14191
14207
|
return pruned;
|
|
14192
14208
|
}
|
|
14193
|
-
function
|
|
14209
|
+
function syncExpansionForFocused(expandedIds, focusedPath, onlyOneExpandedTree, index) {
|
|
14194
14210
|
const next = new Set(expandedIds);
|
|
14195
|
-
for (const id of getExpandableAncestorIds(
|
|
14211
|
+
for (const id of getExpandableAncestorIds(focusedPath, index)) {
|
|
14196
14212
|
next.add(id);
|
|
14197
14213
|
}
|
|
14198
|
-
return pruneExpandedIds(next,
|
|
14214
|
+
return pruneExpandedIds(next, focusedPath, onlyOneExpandedTree, index);
|
|
14199
14215
|
}
|
|
14200
14216
|
function useTreeNavigation({
|
|
14201
14217
|
nodes,
|
|
14202
|
-
|
|
14203
|
-
|
|
14204
|
-
|
|
14218
|
+
focusedId: controlledFocusedId,
|
|
14219
|
+
onFocusedIdChange,
|
|
14220
|
+
initialFocusedId,
|
|
14205
14221
|
onlyOneExpandedTree = false
|
|
14206
14222
|
}) {
|
|
14207
14223
|
const index = useMemo20(() => buildTreeIndex(nodes), [nodes]);
|
|
14208
|
-
const [
|
|
14209
|
-
value:
|
|
14210
|
-
onValueChange:
|
|
14211
|
-
defaultValue:
|
|
14224
|
+
const [focusedId, setFocusedId] = useControlledState({
|
|
14225
|
+
value: controlledFocusedId,
|
|
14226
|
+
onValueChange: onFocusedIdChange,
|
|
14227
|
+
defaultValue: initialFocusedId ?? null
|
|
14212
14228
|
});
|
|
14213
|
-
const
|
|
14214
|
-
if (
|
|
14215
|
-
if (index.byId.has(
|
|
14229
|
+
const resolvedFocusedId = useMemo20(() => {
|
|
14230
|
+
if (focusedId == null) return null;
|
|
14231
|
+
if (index.byId.has(focusedId)) return focusedId;
|
|
14216
14232
|
return null;
|
|
14217
|
-
}, [
|
|
14233
|
+
}, [focusedId, index]);
|
|
14218
14234
|
const [expandedIds, setExpandedIds] = useState21(() => /* @__PURE__ */ new Set());
|
|
14219
14235
|
useEffect27(() => {
|
|
14220
|
-
if (
|
|
14221
|
-
const entry = index.byId.get(
|
|
14236
|
+
if (resolvedFocusedId == null) return;
|
|
14237
|
+
const entry = index.byId.get(resolvedFocusedId);
|
|
14222
14238
|
if (entry == null) return;
|
|
14223
|
-
setExpandedIds((prev) =>
|
|
14224
|
-
}, [
|
|
14225
|
-
const
|
|
14239
|
+
setExpandedIds((prev) => syncExpansionForFocused(prev, entry.path, onlyOneExpandedTree, index));
|
|
14240
|
+
}, [resolvedFocusedId, onlyOneExpandedTree, index]);
|
|
14241
|
+
const visibleItems = useMemo20(() => {
|
|
14226
14242
|
return flattenVisibleItems(nodes, expandedIds);
|
|
14227
14243
|
}, [nodes, expandedIds]);
|
|
14228
|
-
const
|
|
14229
|
-
|
|
14230
|
-
|
|
14231
|
-
|
|
14244
|
+
const allItems = useMemo20(() => {
|
|
14245
|
+
return flattenAllItems(nodes, expandedIds);
|
|
14246
|
+
}, [nodes, expandedIds]);
|
|
14247
|
+
const focusedItem = useMemo20(() => {
|
|
14248
|
+
if (resolvedFocusedId == null) return null;
|
|
14249
|
+
return allItems.find((item) => item.id === resolvedFocusedId) ?? null;
|
|
14250
|
+
}, [allItems, resolvedFocusedId]);
|
|
14232
14251
|
const navigateTo = useCallback25((id) => {
|
|
14233
14252
|
const entry = index.byId.get(id);
|
|
14234
14253
|
if (entry == null) {
|
|
14235
14254
|
console.warn(`Attempted to navigate to node ${id} that does not exist`);
|
|
14236
14255
|
return;
|
|
14237
14256
|
}
|
|
14238
|
-
|
|
14257
|
+
setFocusedId(id);
|
|
14239
14258
|
setExpandedIds((prev) => {
|
|
14240
|
-
const next2 =
|
|
14259
|
+
const next2 = syncExpansionForFocused(prev, entry.path, onlyOneExpandedTree, index);
|
|
14241
14260
|
return next2;
|
|
14242
14261
|
});
|
|
14243
|
-
}, [index, onlyOneExpandedTree,
|
|
14262
|
+
}, [index, onlyOneExpandedTree, setFocusedId]);
|
|
14244
14263
|
const expand = useCallback25((id, options) => {
|
|
14245
14264
|
const entry = index.byId.get(id);
|
|
14246
14265
|
if (entry == null || entry.node.items.length === 0) return;
|
|
14247
14266
|
if (options?.isFocusing) {
|
|
14248
|
-
|
|
14267
|
+
setFocusedId(id);
|
|
14249
14268
|
}
|
|
14250
14269
|
setExpandedIds((prev) => {
|
|
14251
14270
|
const next2 = new Set(prev);
|
|
14252
14271
|
next2.add(id);
|
|
14253
|
-
const
|
|
14254
|
-
return pruneExpandedIds(next2,
|
|
14272
|
+
const focusedPath = options?.isFocusing ? entry.path : resolvedFocusedId != null ? index.byId.get(resolvedFocusedId)?.path ?? null : null;
|
|
14273
|
+
return pruneExpandedIds(next2, focusedPath, onlyOneExpandedTree, index);
|
|
14255
14274
|
});
|
|
14256
|
-
}, [index, onlyOneExpandedTree,
|
|
14275
|
+
}, [index, onlyOneExpandedTree, resolvedFocusedId, setFocusedId]);
|
|
14257
14276
|
const collapse = useCallback25((id, options) => {
|
|
14258
|
-
if (!options?.isFocusing &&
|
|
14259
|
-
const
|
|
14260
|
-
if (
|
|
14277
|
+
if (!options?.isFocusing && resolvedFocusedId != null) {
|
|
14278
|
+
const focusedEntry = index.byId.get(resolvedFocusedId);
|
|
14279
|
+
if (focusedEntry != null && isAncestorOf(id, focusedEntry.path)) return;
|
|
14261
14280
|
}
|
|
14262
14281
|
if (options?.isFocusing) {
|
|
14263
|
-
|
|
14282
|
+
setFocusedId(id);
|
|
14264
14283
|
}
|
|
14265
14284
|
const descendantIds = getDescendantIds(index, id);
|
|
14266
14285
|
setExpandedIds((prev) => {
|
|
@@ -14271,12 +14290,12 @@ function useTreeNavigation({
|
|
|
14271
14290
|
}
|
|
14272
14291
|
return next2;
|
|
14273
14292
|
});
|
|
14274
|
-
}, [index,
|
|
14293
|
+
}, [index, resolvedFocusedId, setFocusedId]);
|
|
14275
14294
|
const toggleExpansion = useCallback25((id, options) => {
|
|
14276
14295
|
const entry = index.byId.get(id);
|
|
14277
14296
|
if (entry == null || entry.node.items.length === 0) return;
|
|
14278
14297
|
if (options?.isFocusing) {
|
|
14279
|
-
|
|
14298
|
+
setFocusedId(id);
|
|
14280
14299
|
setExpandedIds((prev) => {
|
|
14281
14300
|
if (prev.has(id)) {
|
|
14282
14301
|
const next3 = new Set(prev);
|
|
@@ -14301,44 +14320,45 @@ function useTreeNavigation({
|
|
|
14301
14320
|
} else {
|
|
14302
14321
|
expand(id);
|
|
14303
14322
|
}
|
|
14304
|
-
}, [index, expandedIds, expand, collapse, onlyOneExpandedTree,
|
|
14323
|
+
}, [index, expandedIds, expand, collapse, onlyOneExpandedTree, setFocusedId]);
|
|
14305
14324
|
const next = useCallback25(() => {
|
|
14306
|
-
if (
|
|
14307
|
-
if (
|
|
14308
|
-
navigateTo(
|
|
14325
|
+
if (visibleItems.length === 0) return;
|
|
14326
|
+
if (resolvedFocusedId == null) {
|
|
14327
|
+
navigateTo(visibleItems[0].id);
|
|
14309
14328
|
return;
|
|
14310
14329
|
}
|
|
14311
|
-
const currentIndex =
|
|
14330
|
+
const currentIndex = visibleItems.findIndex((item) => item.id === resolvedFocusedId);
|
|
14312
14331
|
const startIndex = currentIndex < 0 ? 0 : currentIndex;
|
|
14313
|
-
if (startIndex <
|
|
14314
|
-
navigateTo(
|
|
14332
|
+
if (startIndex < visibleItems.length - 1) {
|
|
14333
|
+
navigateTo(visibleItems[startIndex + 1].id);
|
|
14315
14334
|
return;
|
|
14316
14335
|
}
|
|
14317
|
-
}, [
|
|
14336
|
+
}, [visibleItems, resolvedFocusedId, navigateTo]);
|
|
14318
14337
|
const previous = useCallback25(() => {
|
|
14319
|
-
if (
|
|
14320
|
-
if (
|
|
14321
|
-
navigateTo(
|
|
14338
|
+
if (visibleItems.length === 0) return;
|
|
14339
|
+
if (resolvedFocusedId == null) {
|
|
14340
|
+
navigateTo(visibleItems[visibleItems.length - 1].id);
|
|
14322
14341
|
return;
|
|
14323
14342
|
}
|
|
14324
|
-
const currentIndex =
|
|
14325
|
-
const startIndex = currentIndex < 0 ?
|
|
14343
|
+
const currentIndex = visibleItems.findIndex((item) => item.id === resolvedFocusedId);
|
|
14344
|
+
const startIndex = currentIndex < 0 ? visibleItems.length - 1 : currentIndex;
|
|
14326
14345
|
if (startIndex > 0) {
|
|
14327
|
-
navigateTo(
|
|
14346
|
+
navigateTo(visibleItems[startIndex - 1].id);
|
|
14328
14347
|
return;
|
|
14329
14348
|
}
|
|
14330
|
-
}, [
|
|
14349
|
+
}, [visibleItems, resolvedFocusedId, navigateTo]);
|
|
14331
14350
|
const first = useCallback25(() => {
|
|
14332
|
-
if (
|
|
14333
|
-
navigateTo(
|
|
14334
|
-
}, [
|
|
14351
|
+
if (visibleItems.length === 0) return;
|
|
14352
|
+
navigateTo(visibleItems[0].id);
|
|
14353
|
+
}, [visibleItems, navigateTo]);
|
|
14335
14354
|
const last = useCallback25(() => {
|
|
14336
|
-
if (
|
|
14337
|
-
navigateTo(
|
|
14338
|
-
}, [
|
|
14355
|
+
if (visibleItems.length === 0) return;
|
|
14356
|
+
navigateTo(visibleItems[visibleItems.length - 1].id);
|
|
14357
|
+
}, [visibleItems, navigateTo]);
|
|
14339
14358
|
return useMemo20(() => ({
|
|
14340
|
-
|
|
14341
|
-
|
|
14359
|
+
visibleItems,
|
|
14360
|
+
allItems,
|
|
14361
|
+
focusedItem,
|
|
14342
14362
|
navigateTo,
|
|
14343
14363
|
expand,
|
|
14344
14364
|
collapse,
|
|
@@ -14347,7 +14367,7 @@ function useTreeNavigation({
|
|
|
14347
14367
|
previous,
|
|
14348
14368
|
first,
|
|
14349
14369
|
last
|
|
14350
|
-
}), [
|
|
14370
|
+
}), [visibleItems, allItems, focusedItem, navigateTo, expand, collapse, toggleExpansion, next, previous, first, last]);
|
|
14351
14371
|
}
|
|
14352
14372
|
|
|
14353
14373
|
// src/components/layout/navigation/navigation-menus/NavigationContext.tsx
|
|
@@ -14355,22 +14375,41 @@ import { jsx as jsx40 } from "react/jsx-runtime";
|
|
|
14355
14375
|
var NavigationContext = createContext11(null);
|
|
14356
14376
|
function NavigationProvider({
|
|
14357
14377
|
children,
|
|
14358
|
-
|
|
14378
|
+
activeId = null,
|
|
14379
|
+
...treeOptions
|
|
14359
14380
|
}) {
|
|
14360
|
-
const navigation = useTreeNavigation(
|
|
14381
|
+
const navigation = useTreeNavigation({
|
|
14382
|
+
...treeOptions,
|
|
14383
|
+
initialFocusedId: treeOptions.initialFocusedId ?? activeId ?? treeOptions.nodes[0]?.id ?? null
|
|
14384
|
+
});
|
|
14361
14385
|
const itemRefs = useRef23(/* @__PURE__ */ new Map());
|
|
14362
|
-
const
|
|
14386
|
+
const [hasNavigatedToActiveId, setHasNavigatedToActiveId] = useState22(false);
|
|
14387
|
+
useEffect28(() => {
|
|
14388
|
+
if (activeId == null || hasNavigatedToActiveId) return;
|
|
14389
|
+
const navigationItem = navigation.allItems.find((item) => item.id === activeId);
|
|
14390
|
+
if (navigationItem == null) return;
|
|
14391
|
+
navigation.navigateTo(activeId);
|
|
14392
|
+
setHasNavigatedToActiveId(true);
|
|
14393
|
+
}, [activeId, navigation, navigation.navigateTo, navigation.allItems, hasNavigatedToActiveId]);
|
|
14394
|
+
const focusedId = useMemo21(() => {
|
|
14395
|
+
return navigation.focusedItem?.id ?? navigation.visibleItems[0]?.id ?? null;
|
|
14396
|
+
}, [navigation.focusedItem, navigation.visibleItems]);
|
|
14397
|
+
const activePath = useMemo21(() => {
|
|
14398
|
+
return resolveTreeNodePath(treeOptions.nodes, activeId);
|
|
14399
|
+
}, [treeOptions.nodes, activeId]);
|
|
14363
14400
|
const itemStateById = useMemo21(() => {
|
|
14364
14401
|
const map = /* @__PURE__ */ new Map();
|
|
14365
|
-
for (const item of navigation.
|
|
14402
|
+
for (const item of navigation.allItems) {
|
|
14366
14403
|
map.set(item.id, {
|
|
14367
14404
|
expanded: item.expanded,
|
|
14368
14405
|
isFocused: focusedId === item.id,
|
|
14406
|
+
isActive: activeId === item.id,
|
|
14407
|
+
isOnActivePath: activePath?.includes(item.id) ?? false,
|
|
14369
14408
|
path: item.path
|
|
14370
14409
|
});
|
|
14371
14410
|
}
|
|
14372
14411
|
return map;
|
|
14373
|
-
}, [navigation.
|
|
14412
|
+
}, [navigation.allItems, focusedId, activeId, activePath]);
|
|
14374
14413
|
const getItemState = useCallback26((id) => {
|
|
14375
14414
|
return itemStateById.get(id) ?? null;
|
|
14376
14415
|
}, [itemStateById]);
|
|
@@ -14386,9 +14425,12 @@ function NavigationProvider({
|
|
|
14386
14425
|
itemRefs.current.get(focusedId)?.focus();
|
|
14387
14426
|
}, [focusedId]);
|
|
14388
14427
|
const value = useMemo21(() => ({
|
|
14389
|
-
|
|
14428
|
+
focusedItem: navigation.focusedItem,
|
|
14390
14429
|
focusedId,
|
|
14391
|
-
|
|
14430
|
+
activeId,
|
|
14431
|
+
activePath,
|
|
14432
|
+
visibleItems: navigation.visibleItems,
|
|
14433
|
+
allItems: navigation.allItems,
|
|
14392
14434
|
getItemState,
|
|
14393
14435
|
navigateTo: navigation.navigateTo,
|
|
14394
14436
|
expand: navigation.expand,
|
|
@@ -14400,8 +14442,9 @@ function NavigationProvider({
|
|
|
14400
14442
|
toggleExpansion: navigation.toggleExpansion,
|
|
14401
14443
|
registerItemRef
|
|
14402
14444
|
}), [
|
|
14403
|
-
navigation.
|
|
14404
|
-
navigation.
|
|
14445
|
+
navigation.focusedItem,
|
|
14446
|
+
navigation.visibleItems,
|
|
14447
|
+
navigation.allItems,
|
|
14405
14448
|
navigation.navigateTo,
|
|
14406
14449
|
navigation.expand,
|
|
14407
14450
|
navigation.collapse,
|
|
@@ -14411,6 +14454,8 @@ function NavigationProvider({
|
|
|
14411
14454
|
navigation.last,
|
|
14412
14455
|
navigation.toggleExpansion,
|
|
14413
14456
|
focusedId,
|
|
14457
|
+
activeId,
|
|
14458
|
+
activePath,
|
|
14414
14459
|
getItemState,
|
|
14415
14460
|
registerItemRef
|
|
14416
14461
|
]);
|
|
@@ -14706,22 +14751,49 @@ var AppPageSidebarWithNavigation = ({
|
|
|
14706
14751
|
footer,
|
|
14707
14752
|
navigationItems,
|
|
14708
14753
|
contentOverwrite,
|
|
14709
|
-
|
|
14754
|
+
initialFocusedId,
|
|
14755
|
+
focusedId,
|
|
14756
|
+
onFocusedIdChange,
|
|
14757
|
+
activeId,
|
|
14710
14758
|
...props
|
|
14711
14759
|
}) => {
|
|
14712
14760
|
return /* @__PURE__ */ jsx43(AppSidebar, { ...props, children: /* @__PURE__ */ jsxs24("div", { className: "app-page-sidebar-with-navigation", children: [
|
|
14713
14761
|
header && /* @__PURE__ */ jsx43("div", { className: "app-page-sidebar-with-navigation-header", children: header }),
|
|
14714
|
-
navigationItems && !contentOverwrite && /* @__PURE__ */ jsx43("div", { className: "app-page-sidebar-with-navigation-scroll", children: /* @__PURE__ */ jsx43(
|
|
14762
|
+
navigationItems && !contentOverwrite && /* @__PURE__ */ jsx43("div", { className: "app-page-sidebar-with-navigation-scroll", children: /* @__PURE__ */ jsx43(
|
|
14763
|
+
VerticalNavigationTree,
|
|
14764
|
+
{
|
|
14765
|
+
items: navigationItems,
|
|
14766
|
+
initialFocusedId,
|
|
14767
|
+
focusedId,
|
|
14768
|
+
onFocusedIdChange,
|
|
14769
|
+
activeId
|
|
14770
|
+
}
|
|
14771
|
+
) }),
|
|
14715
14772
|
contentOverwrite && /* @__PURE__ */ jsx43("div", { className: "app-page-sidebar-with-navigation-scroll", children: contentOverwrite }),
|
|
14716
14773
|
footer && /* @__PURE__ */ jsx43("div", { className: "app-page-sidebar-with-navigation-footer", children: footer })
|
|
14717
14774
|
] }) });
|
|
14718
14775
|
};
|
|
14776
|
+
function findActiveIdByUrl(items, activeUrl) {
|
|
14777
|
+
for (const item of items) {
|
|
14778
|
+
if (item.url === activeUrl) return item.id;
|
|
14779
|
+
if (item.items != null) {
|
|
14780
|
+
const found = findActiveIdByUrl(item.items, activeUrl);
|
|
14781
|
+
if (found != null) return found;
|
|
14782
|
+
}
|
|
14783
|
+
}
|
|
14784
|
+
return null;
|
|
14785
|
+
}
|
|
14719
14786
|
var AppPage = ({ children, headerActions, sidebarProps, ...props }) => {
|
|
14720
14787
|
const translation = useHightideTranslation();
|
|
14721
|
-
const [isSidebarOpen, setIsSidebarOpen] =
|
|
14788
|
+
const [isSidebarOpen, setIsSidebarOpen] = useState23(false);
|
|
14789
|
+
const resolvedActiveId = useMemo22(() => {
|
|
14790
|
+
if (sidebarProps.activeId !== void 0) return sidebarProps.activeId;
|
|
14791
|
+
if (sidebarProps.activeUrl == null || sidebarProps.items == null) return null;
|
|
14792
|
+
return findActiveIdByUrl(sidebarProps.items, sidebarProps.activeUrl);
|
|
14793
|
+
}, [sidebarProps.activeId, sidebarProps.activeUrl, sidebarProps.items]);
|
|
14722
14794
|
const toNavigationItems = useCallback28((items) => {
|
|
14723
14795
|
return items?.map((item) => {
|
|
14724
|
-
const isActive =
|
|
14796
|
+
const isActive = item.id === resolvedActiveId;
|
|
14725
14797
|
return {
|
|
14726
14798
|
id: item.id,
|
|
14727
14799
|
label: /* @__PURE__ */ jsxs24("span", { className: "app-page-navigation-item-label", "data-active-page": isActive ? "" : void 0, children: [
|
|
@@ -14733,25 +14805,10 @@ var AppPage = ({ children, headerActions, sidebarProps, ...props }) => {
|
|
|
14733
14805
|
items: toNavigationItems(item.items)
|
|
14734
14806
|
};
|
|
14735
14807
|
}) ?? void 0;
|
|
14736
|
-
}, [
|
|
14808
|
+
}, [resolvedActiveId]);
|
|
14737
14809
|
const navigationItems = useMemo22(() => toNavigationItems(
|
|
14738
14810
|
sidebarProps.items
|
|
14739
14811
|
), [sidebarProps.items, toNavigationItems]);
|
|
14740
|
-
const initialActiveId = useMemo22(() => {
|
|
14741
|
-
if (sidebarProps.initialActiveId) return sidebarProps.initialActiveId;
|
|
14742
|
-
if (!navigationItems) return void 0;
|
|
14743
|
-
const findActiveId = (items) => {
|
|
14744
|
-
for (const item of items) {
|
|
14745
|
-
if (item.url === sidebarProps.activeUrl) return item.id;
|
|
14746
|
-
if (item.items) {
|
|
14747
|
-
const found = findActiveId(item.items);
|
|
14748
|
-
if (found) return found;
|
|
14749
|
-
}
|
|
14750
|
-
}
|
|
14751
|
-
return void 0;
|
|
14752
|
-
};
|
|
14753
|
-
return findActiveId(navigationItems);
|
|
14754
|
-
}, [navigationItems, sidebarProps.activeUrl, sidebarProps.initialActiveId]);
|
|
14755
14812
|
return /* @__PURE__ */ jsxs24(
|
|
14756
14813
|
"div",
|
|
14757
14814
|
{
|
|
@@ -14768,7 +14825,10 @@ var AppPage = ({ children, headerActions, sidebarProps, ...props }) => {
|
|
|
14768
14825
|
footer: sidebarProps.footer,
|
|
14769
14826
|
navigationItems,
|
|
14770
14827
|
contentOverwrite: sidebarProps.contentOverwrite,
|
|
14771
|
-
|
|
14828
|
+
initialFocusedId: sidebarProps.initialFocusedId,
|
|
14829
|
+
focusedId: sidebarProps.focusedId,
|
|
14830
|
+
onFocusedIdChange: sidebarProps.onFocusedIdChange,
|
|
14831
|
+
activeId: resolvedActiveId
|
|
14772
14832
|
}
|
|
14773
14833
|
),
|
|
14774
14834
|
/* @__PURE__ */ jsxs24("div", { "data-name": "app-page-content", children: [
|
|
@@ -15107,7 +15167,7 @@ import { MonitorCog, MoonIcon, SunIcon } from "lucide-react";
|
|
|
15107
15167
|
import clsx18 from "clsx";
|
|
15108
15168
|
|
|
15109
15169
|
// src/global-contexts/ThemeContext.tsx
|
|
15110
|
-
import { createContext as createContext13, useCallback as useCallback30, useContext as useContext15, useEffect as useEffect29, useMemo as useMemo25, useState as
|
|
15170
|
+
import { createContext as createContext13, useCallback as useCallback30, useContext as useContext15, useEffect as useEffect29, useMemo as useMemo25, useState as useState24 } from "react";
|
|
15111
15171
|
import { jsx as jsx50 } from "react/jsx-runtime";
|
|
15112
15172
|
var themes = ["light", "dark", "system"];
|
|
15113
15173
|
var ThemeUtil = {
|
|
@@ -15121,7 +15181,7 @@ var ThemeProvider = ({ children, theme, initialTheme }) => {
|
|
|
15121
15181
|
deleteValue: deleteStoredTheme
|
|
15122
15182
|
} = useStorage({ key: "theme", defaultValue: "system" });
|
|
15123
15183
|
const { config } = useHightideConfig();
|
|
15124
|
-
const [themePreference, setThemePreference] =
|
|
15184
|
+
const [themePreference, setThemePreference] = useState24("system");
|
|
15125
15185
|
const resolvedTheme = useMemo25(() => {
|
|
15126
15186
|
if (theme && theme !== "system") {
|
|
15127
15187
|
return theme;
|
|
@@ -15213,7 +15273,6 @@ var ThemeSelect = ({ ...props }) => {
|
|
|
15213
15273
|
{
|
|
15214
15274
|
value: theme,
|
|
15215
15275
|
onEditComplete: (value) => {
|
|
15216
|
-
console.log("onEditComplete", value);
|
|
15217
15276
|
props.onEditComplete?.(value);
|
|
15218
15277
|
setTheme(value);
|
|
15219
15278
|
},
|
|
@@ -15459,7 +15518,7 @@ var ErrorComponent = ({
|
|
|
15459
15518
|
};
|
|
15460
15519
|
|
|
15461
15520
|
// src/components/layout/loading/LoadingAndErrorComponent.tsx
|
|
15462
|
-
import { useState as
|
|
15521
|
+
import { useState as useState25 } from "react";
|
|
15463
15522
|
|
|
15464
15523
|
// src/components/layout/loading/LoadingContainer.tsx
|
|
15465
15524
|
import { clsx as clsx20 } from "clsx";
|
|
@@ -15480,8 +15539,8 @@ var LoadingAndErrorComponent = ({
|
|
|
15480
15539
|
minimumLoadingDuration = 200,
|
|
15481
15540
|
className
|
|
15482
15541
|
}) => {
|
|
15483
|
-
const [isInMinimumLoading, setIsInMinimumLoading] =
|
|
15484
|
-
const [hasUsedMinimumLoading, setHasUsedMinimumLoading] =
|
|
15542
|
+
const [isInMinimumLoading, setIsInMinimumLoading] = useState25(false);
|
|
15543
|
+
const [hasUsedMinimumLoading, setHasUsedMinimumLoading] = useState25(false);
|
|
15485
15544
|
if (minimumLoadingDuration && !isInMinimumLoading && !hasUsedMinimumLoading) {
|
|
15486
15545
|
setIsInMinimumLoading(true);
|
|
15487
15546
|
setTimeout(() => {
|
|
@@ -15546,7 +15605,7 @@ var BreadCrumbs = ({ crumbs }) => {
|
|
|
15546
15605
|
var import_link2 = __toESM(require_link2());
|
|
15547
15606
|
import { Menu as MenuIcon2, XIcon } from "lucide-react";
|
|
15548
15607
|
import { useEffect as useEffect30 } from "react";
|
|
15549
|
-
import { useCallback as useCallback31, useId as useId14, useRef as useRef28, useState as
|
|
15608
|
+
import { useCallback as useCallback31, useId as useId14, useRef as useRef28, useState as useState26 } from "react";
|
|
15550
15609
|
import clsx23 from "clsx";
|
|
15551
15610
|
import { Fragment as Fragment7, jsx as jsx61, jsxs as jsxs34 } from "react/jsx-runtime";
|
|
15552
15611
|
function isSubItem(item) {
|
|
@@ -15558,7 +15617,7 @@ var NavigationItemWithSubItem = ({
|
|
|
15558
15617
|
horizontalAlignment = "center",
|
|
15559
15618
|
...options
|
|
15560
15619
|
}) => {
|
|
15561
|
-
const [isOpen, setOpen] =
|
|
15620
|
+
const [isOpen, setOpen] = useState26(false);
|
|
15562
15621
|
const containerRef = useRef28(null);
|
|
15563
15622
|
const triggerRef = useRef28(null);
|
|
15564
15623
|
const id = useId14();
|
|
@@ -15635,7 +15694,7 @@ var NavigationItemList = ({ items, ...restProps }) => {
|
|
|
15635
15694
|
};
|
|
15636
15695
|
var Navigation = ({ ...props }) => {
|
|
15637
15696
|
const translation = useHightideTranslation();
|
|
15638
|
-
const [isMobileOpen, setIsMobileOpen] =
|
|
15697
|
+
const [isMobileOpen, setIsMobileOpen] = useState26(false);
|
|
15639
15698
|
const id = useId14();
|
|
15640
15699
|
const menuRef = useRef28(null);
|
|
15641
15700
|
useEffect30(() => {
|
|
@@ -15706,7 +15765,7 @@ var Navigation = ({ ...props }) => {
|
|
|
15706
15765
|
// src/components/layout/navigation/Pagination.tsx
|
|
15707
15766
|
import { ChevronFirst, ChevronLast, ChevronLeft as ChevronLeft2, ChevronRight as ChevronRight3 } from "lucide-react";
|
|
15708
15767
|
import clsx24 from "clsx";
|
|
15709
|
-
import { useEffect as useEffect31, useState as
|
|
15768
|
+
import { useEffect as useEffect31, useState as useState27 } from "react";
|
|
15710
15769
|
import { jsx as jsx62, jsxs as jsxs35 } from "react/jsx-runtime";
|
|
15711
15770
|
var Pagination = ({
|
|
15712
15771
|
pageIndex,
|
|
@@ -15715,7 +15774,7 @@ var Pagination = ({
|
|
|
15715
15774
|
...props
|
|
15716
15775
|
}) => {
|
|
15717
15776
|
const translation = useHightideTranslation();
|
|
15718
|
-
const [value, setValue] =
|
|
15777
|
+
const [value, setValue] = useState27((pageIndex + 1).toString());
|
|
15719
15778
|
const noPages = pageCount === 0;
|
|
15720
15779
|
const onFirstPage = pageIndex === 0 && !noPages;
|
|
15721
15780
|
const onLastPage = pageIndex === pageCount - 1;
|
|
@@ -15942,7 +16001,7 @@ function PopUpOpener({ children }) {
|
|
|
15942
16001
|
}
|
|
15943
16002
|
|
|
15944
16003
|
// src/components/layout/popup/PopUpRoot.tsx
|
|
15945
|
-
import { useId as useId15, useMemo as useMemo28, useState as
|
|
16004
|
+
import { useId as useId15, useMemo as useMemo28, useState as useState28 } from "react";
|
|
15946
16005
|
import { jsx as jsx64 } from "react/jsx-runtime";
|
|
15947
16006
|
function PopUpRoot({
|
|
15948
16007
|
children,
|
|
@@ -15959,7 +16018,7 @@ function PopUpRoot({
|
|
|
15959
16018
|
onValueChange: onIsOpenChange,
|
|
15960
16019
|
defaultValue: initialIsOpen
|
|
15961
16020
|
});
|
|
15962
|
-
const [triggerRef, setTriggerRef] =
|
|
16021
|
+
const [triggerRef, setTriggerRef] = useState28(null);
|
|
15963
16022
|
const popUpId = useMemo28(() => popUpIdOverwrite ?? `pop-up-${generatedPopUpId}`, [popUpIdOverwrite, generatedPopUpId]);
|
|
15964
16023
|
const triggerId = useMemo28(() => triggerIdOverwrite ?? `pop-up-trigger-${generatedTriggerId}`, [triggerIdOverwrite, generatedTriggerId]);
|
|
15965
16024
|
const contextValue = useMemo28(() => ({
|
|
@@ -16149,7 +16208,7 @@ var FillerCell = ({ ...props }) => {
|
|
|
16149
16208
|
};
|
|
16150
16209
|
|
|
16151
16210
|
// src/components/layout/table/TableProvider.tsx
|
|
16152
|
-
import { useCallback as useCallback33, useEffect as useEffect33, useLayoutEffect as useLayoutEffect6, useMemo as useMemo29, useRef as useRef30, useState as
|
|
16211
|
+
import { useCallback as useCallback33, useEffect as useEffect33, useLayoutEffect as useLayoutEffect6, useMemo as useMemo29, useRef as useRef30, useState as useState29 } from "react";
|
|
16153
16212
|
|
|
16154
16213
|
// src/components/layout/table/TableContext.tsx
|
|
16155
16214
|
import { createContext as createContext15, useContext as useContext17 } from "react";
|
|
@@ -17236,9 +17295,9 @@ var TableProvider = ({
|
|
|
17236
17295
|
}) => {
|
|
17237
17296
|
const onRowClickStable = useEventCallbackStabilizer(onRowClick);
|
|
17238
17297
|
const onFillerRowClickStable = useEventCallbackStabilizer(onFillerRowClick);
|
|
17239
|
-
const [registeredColumns, setRegisteredColumns] =
|
|
17298
|
+
const [registeredColumns, setRegisteredColumns] = useState29([]);
|
|
17240
17299
|
const containerRef = useRef30(null);
|
|
17241
|
-
const [, setTableState] =
|
|
17300
|
+
const [, setTableState] = useState29({
|
|
17242
17301
|
columnSizing: {},
|
|
17243
17302
|
columnOrder: [],
|
|
17244
17303
|
columnFilters: [],
|
|
@@ -17263,7 +17322,7 @@ var TableProvider = ({
|
|
|
17263
17322
|
pageSize: 10
|
|
17264
17323
|
}
|
|
17265
17324
|
});
|
|
17266
|
-
const [targetWidth, setTargetWidth] =
|
|
17325
|
+
const [targetWidth, setTargetWidth] = useState29(void 0);
|
|
17267
17326
|
useLayoutEffect6(() => {
|
|
17268
17327
|
const width = containerRef.current?.getBoundingClientRect().width;
|
|
17269
17328
|
setTargetWidth(width !== void 0 ? Math.floor(width) : void 0);
|
|
@@ -17525,15 +17584,15 @@ var TableSortButton = ({
|
|
|
17525
17584
|
|
|
17526
17585
|
// src/components/layout/table/TableFilterButton.tsx
|
|
17527
17586
|
import { FilterIcon } from "lucide-react";
|
|
17528
|
-
import { useEffect as useEffect46, useId as useId20, useMemo as useMemo39, useRef as useRef39, useState as
|
|
17587
|
+
import { useEffect as useEffect46, useId as useId20, useMemo as useMemo39, useRef as useRef39, useState as useState38 } from "react";
|
|
17529
17588
|
import { flexRender as flexRender2 } from "@tanstack/react-table";
|
|
17530
17589
|
|
|
17531
17590
|
// src/components/user-interaction/data/FilterPopUp.tsx
|
|
17532
17591
|
import { Check as Check3, TrashIcon } from "lucide-react";
|
|
17533
|
-
import { forwardRef as forwardRef25, useEffect as useEffect45, useId as useId19, useMemo as useMemo38, useState as
|
|
17592
|
+
import { forwardRef as forwardRef25, useEffect as useEffect45, useId as useId19, useMemo as useMemo38, useState as useState37 } from "react";
|
|
17534
17593
|
|
|
17535
17594
|
// src/components/user-interaction/input/DateTimeInput.tsx
|
|
17536
|
-
import { forwardRef as forwardRef20, useCallback as useCallback36, useEffect as useEffect39, useId as useId16, useImperativeHandle as useImperativeHandle11, useMemo as useMemo34, useRef as useRef35, useState as
|
|
17595
|
+
import { forwardRef as forwardRef20, useCallback as useCallback36, useEffect as useEffect39, useId as useId16, useImperativeHandle as useImperativeHandle11, useMemo as useMemo34, useRef as useRef35, useState as useState34 } from "react";
|
|
17537
17596
|
import { CalendarIcon, X as X4 } from "lucide-react";
|
|
17538
17597
|
import clsx31 from "clsx";
|
|
17539
17598
|
|
|
@@ -17721,7 +17780,7 @@ var TimePicker = ({
|
|
|
17721
17780
|
};
|
|
17722
17781
|
|
|
17723
17782
|
// src/components/user-interaction/date/DatePicker.tsx
|
|
17724
|
-
import { useState as
|
|
17783
|
+
import { useState as useState31 } from "react";
|
|
17725
17784
|
import { ArrowDown, ArrowUp, Calendar, ChevronDown as ChevronDown4 } from "lucide-react";
|
|
17726
17785
|
import clsx29 from "clsx";
|
|
17727
17786
|
|
|
@@ -17847,7 +17906,7 @@ var DayPicker = ({
|
|
|
17847
17906
|
};
|
|
17848
17907
|
|
|
17849
17908
|
// src/components/user-interaction/date/YearMonthPicker.tsx
|
|
17850
|
-
import { memo, useCallback as useCallback35, useEffect as useEffect36, useMemo as useMemo32, useRef as useRef33, useState as
|
|
17909
|
+
import { memo, useCallback as useCallback35, useEffect as useEffect36, useMemo as useMemo32, useRef as useRef33, useState as useState30 } from "react";
|
|
17851
17910
|
import clsx28 from "clsx";
|
|
17852
17911
|
import { jsx as jsx73, jsxs as jsxs42 } from "react/jsx-runtime";
|
|
17853
17912
|
var YearRow = memo(function YearRow2({
|
|
@@ -17860,7 +17919,7 @@ var YearRow = memo(function YearRow2({
|
|
|
17860
17919
|
}) {
|
|
17861
17920
|
const ref = useRef33(null);
|
|
17862
17921
|
const isSelectedYear = selectedMonthIndex !== void 0;
|
|
17863
|
-
const [isExpanded, setIsExpanded] =
|
|
17922
|
+
const [isExpanded, setIsExpanded] = useState30(false);
|
|
17864
17923
|
useEffect36(() => {
|
|
17865
17924
|
if (isSelectedYear) {
|
|
17866
17925
|
ref.current?.scrollIntoView({ behavior: "smooth", block: "nearest" });
|
|
@@ -17990,8 +18049,8 @@ var DatePicker = ({
|
|
|
17990
18049
|
onValueChange,
|
|
17991
18050
|
defaultValue: initialValue
|
|
17992
18051
|
});
|
|
17993
|
-
const [displayedMonth, setDisplayedMonth] =
|
|
17994
|
-
const [displayMode, setDisplayMode] =
|
|
18052
|
+
const [displayedMonth, setDisplayedMonth] = useState31(new Date(value.getFullYear(), value.getMonth(), 1));
|
|
18053
|
+
const [displayMode, setDisplayMode] = useState31(initialDisplay);
|
|
17995
18054
|
return /* @__PURE__ */ jsxs43("div", { className: clsx29("flex-col-3", className), children: [
|
|
17996
18055
|
/* @__PURE__ */ jsxs43("div", { className: "flex-row-2 items-center justify-between", children: [
|
|
17997
18056
|
/* @__PURE__ */ jsxs43(
|
|
@@ -18153,7 +18212,7 @@ var DateTimePicker = ({
|
|
|
18153
18212
|
};
|
|
18154
18213
|
|
|
18155
18214
|
// src/components/user-interaction/date/DateTimePickerDialog.tsx
|
|
18156
|
-
import { useEffect as useEffect37, useState as
|
|
18215
|
+
import { useEffect as useEffect37, useState as useState32 } from "react";
|
|
18157
18216
|
import { Fragment as Fragment8, jsx as jsx76, jsxs as jsxs45 } from "react/jsx-runtime";
|
|
18158
18217
|
var DateTimePickerDialog = ({
|
|
18159
18218
|
initialValue = null,
|
|
@@ -18181,7 +18240,7 @@ var DateTimePickerDialog = ({
|
|
|
18181
18240
|
onValueChange,
|
|
18182
18241
|
defaultValue: initialValue
|
|
18183
18242
|
});
|
|
18184
|
-
const [pickerState, setPickerState] =
|
|
18243
|
+
const [pickerState, setPickerState] = useState32(state ?? /* @__PURE__ */ new Date());
|
|
18185
18244
|
useEffect37(() => {
|
|
18186
18245
|
setPickerState(state ?? /* @__PURE__ */ new Date());
|
|
18187
18246
|
}, [state]);
|
|
@@ -18256,7 +18315,7 @@ var DateTimePickerDialog = ({
|
|
|
18256
18315
|
};
|
|
18257
18316
|
|
|
18258
18317
|
// src/components/user-interaction/input/DateTimeField.tsx
|
|
18259
|
-
import { forwardRef as forwardRef19, useEffect as useEffect38, useLayoutEffect as useLayoutEffect7, useMemo as useMemo33, useRef as useRef34, useState as
|
|
18318
|
+
import { forwardRef as forwardRef19, useEffect as useEffect38, useLayoutEffect as useLayoutEffect7, useMemo as useMemo33, useRef as useRef34, useState as useState33 } from "react";
|
|
18260
18319
|
import clsx30 from "clsx";
|
|
18261
18320
|
|
|
18262
18321
|
// src/components/user-interaction/input/dateTimeSegments.ts
|
|
@@ -18563,11 +18622,11 @@ var DateTimeField = forwardRef19(function DateTimeField2({
|
|
|
18563
18622
|
[locale, mode, precision, is24Hour]
|
|
18564
18623
|
);
|
|
18565
18624
|
const editableTypes = useMemo33(() => editableTypesOf(layout), [layout]);
|
|
18566
|
-
const [editState, setEditState] =
|
|
18625
|
+
const [editState, setEditState] = useState33(() => ({
|
|
18567
18626
|
values: value ? decomposeDate(value, layout, is24Hour) : {},
|
|
18568
18627
|
buffer: null
|
|
18569
18628
|
}));
|
|
18570
|
-
const [focusedType, setFocusedType] =
|
|
18629
|
+
const [focusedType, setFocusedType] = useState33(null);
|
|
18571
18630
|
const editStateRef = useRef34(editState);
|
|
18572
18631
|
editStateRef.current = editState;
|
|
18573
18632
|
const segmentRefs = useRef34(/* @__PURE__ */ new Map());
|
|
@@ -18813,13 +18872,13 @@ var DateTimeInput = forwardRef20(function DateTimeInput2({
|
|
|
18813
18872
|
const translation = useHightideTranslation();
|
|
18814
18873
|
const { timeZone: contextTimeZone } = useLocale();
|
|
18815
18874
|
const timeZone = timeZoneOverride ?? contextTimeZone;
|
|
18816
|
-
const [isOpen, setIsOpen] =
|
|
18875
|
+
const [isOpen, setIsOpen] = useState34(false);
|
|
18817
18876
|
const [state, setState] = useControlledState({
|
|
18818
18877
|
value,
|
|
18819
18878
|
onValueChange,
|
|
18820
18879
|
defaultValue: initialValue
|
|
18821
18880
|
});
|
|
18822
|
-
const [dialogValue, setDialogValue] =
|
|
18881
|
+
const [dialogValue, setDialogValue] = useState34(state);
|
|
18823
18882
|
const changeOpenWrapper = useCallback36((isOpen2) => {
|
|
18824
18883
|
onDialogOpeningChange?.(isOpen2);
|
|
18825
18884
|
setIsOpen(isOpen2);
|
|
@@ -18977,7 +19036,7 @@ var DateTimeInput = forwardRef20(function DateTimeInput2({
|
|
|
18977
19036
|
import { forwardRef as forwardRef24 } from "react";
|
|
18978
19037
|
|
|
18979
19038
|
// src/components/user-interaction/MultiSelect/MultiSelectRoot.tsx
|
|
18980
|
-
import { useCallback as useCallback39, useEffect as useEffect41, useId as useId17, useMemo as useMemo37, useState as
|
|
19039
|
+
import { useCallback as useCallback39, useEffect as useEffect41, useId as useId17, useMemo as useMemo37, useState as useState36 } from "react";
|
|
18981
19040
|
|
|
18982
19041
|
// src/components/user-interaction/MultiSelect/MultiSelectContext.tsx
|
|
18983
19042
|
import { createContext as createContext16, useContext as useContext18 } from "react";
|
|
@@ -18993,7 +19052,7 @@ import {
|
|
|
18993
19052
|
useCallback as useCallback38,
|
|
18994
19053
|
useEffect as useEffect40,
|
|
18995
19054
|
useMemo as useMemo36,
|
|
18996
|
-
useState as
|
|
19055
|
+
useState as useState35
|
|
18997
19056
|
} from "react";
|
|
18998
19057
|
|
|
18999
19058
|
// src/hooks/useMultiSelection.ts
|
|
@@ -19046,8 +19105,8 @@ function useMultiSelect({
|
|
|
19046
19105
|
initialIsOpen = false,
|
|
19047
19106
|
typeAheadResetMs = 500
|
|
19048
19107
|
}) {
|
|
19049
|
-
const [isOpen, setIsOpen] =
|
|
19050
|
-
const [searchQuery, setSearchQuery] =
|
|
19108
|
+
const [isOpen, setIsOpen] = useState35(initialIsOpen);
|
|
19109
|
+
const [searchQuery, setSearchQuery] = useState35("");
|
|
19051
19110
|
const selectionOptions = useMemo36(
|
|
19052
19111
|
() => options.map((o) => ({ id: o.id, disabled: o.disabled })),
|
|
19053
19112
|
[options]
|
|
@@ -19221,10 +19280,10 @@ function MultiSelectRoot({
|
|
|
19221
19280
|
readOnly = false,
|
|
19222
19281
|
required = false
|
|
19223
19282
|
}) {
|
|
19224
|
-
const [triggerRef, setTriggerRef] =
|
|
19225
|
-
const [options, setOptions] =
|
|
19283
|
+
const [triggerRef, setTriggerRef] = useState36(null);
|
|
19284
|
+
const [options, setOptions] = useState36([]);
|
|
19226
19285
|
const generatedId = useId17();
|
|
19227
|
-
const [ids, setIds] =
|
|
19286
|
+
const [ids, setIds] = useState36({
|
|
19228
19287
|
trigger: "multi-select-" + generatedId,
|
|
19229
19288
|
content: "multi-select-content-" + generatedId,
|
|
19230
19289
|
listbox: "multi-select-listbox-" + generatedId,
|
|
@@ -19961,8 +20020,8 @@ var DateFilterPopUp = forwardRef25(function DateFilterPopUp2({
|
|
|
19961
20020
|
return suggestion;
|
|
19962
20021
|
}, [value]);
|
|
19963
20022
|
const parameter = value?.parameter ?? {};
|
|
19964
|
-
const [temporaryMinDateValue, setTemporaryMinDateValue] =
|
|
19965
|
-
const [temporaryMaxDateValue, setTemporaryMaxDateValue] =
|
|
20023
|
+
const [temporaryMinDateValue, setTemporaryMinDateValue] = useState37(null);
|
|
20024
|
+
const [temporaryMaxDateValue, setTemporaryMaxDateValue] = useState37(null);
|
|
19966
20025
|
const needsRangeInput = operator === "between" || operator === "notBetween";
|
|
19967
20026
|
const needsParameterInput = operator !== "isUndefined" && operator !== "isNotUndefined";
|
|
19968
20027
|
return /* @__PURE__ */ jsxs52(
|
|
@@ -20103,8 +20162,8 @@ var DatetimeFilterPopUp = forwardRef25(function DatetimeFilterPopUp2({
|
|
|
20103
20162
|
return suggestion;
|
|
20104
20163
|
}, [value]);
|
|
20105
20164
|
const parameter = value?.parameter ?? {};
|
|
20106
|
-
const [temporaryMinDateValue, setTemporaryMinDateValue] =
|
|
20107
|
-
const [temporaryMaxDateValue, setTemporaryMaxDateValue] =
|
|
20165
|
+
const [temporaryMinDateValue, setTemporaryMinDateValue] = useState37(null);
|
|
20166
|
+
const [temporaryMaxDateValue, setTemporaryMaxDateValue] = useState37(null);
|
|
20108
20167
|
const needsRangeInput = operator === "between" || operator === "notBetween";
|
|
20109
20168
|
const needsParameterInput = operator !== "isUndefined" && operator !== "isNotUndefined";
|
|
20110
20169
|
return /* @__PURE__ */ jsxs52(
|
|
@@ -20434,11 +20493,11 @@ var TableFilterButton = ({
|
|
|
20434
20493
|
const translation = useHightideTranslation();
|
|
20435
20494
|
const column = header.column;
|
|
20436
20495
|
const columnFilterValue = column.getFilterValue();
|
|
20437
|
-
const [filterValue, setFilterValue] =
|
|
20496
|
+
const [filterValue, setFilterValue] = useState38(columnFilterValue);
|
|
20438
20497
|
const hasFilter = !!filterValue;
|
|
20439
20498
|
const anchorRef = useRef39(null);
|
|
20440
20499
|
const containerRef = useRef39(null);
|
|
20441
|
-
const [isOpen, setIsOpen] =
|
|
20500
|
+
const [isOpen, setIsOpen] = useState38(false);
|
|
20442
20501
|
const id = useId20();
|
|
20443
20502
|
const ids = useMemo39(() => ({
|
|
20444
20503
|
button: `table-filter-button-${id}`,
|
|
@@ -20703,7 +20762,7 @@ var TableHeader = ({ isSticky = false }) => {
|
|
|
20703
20762
|
};
|
|
20704
20763
|
|
|
20705
20764
|
// src/components/layout/table/VirtualizedTableBody.tsx
|
|
20706
|
-
import { useEffect as useEffect48, useRef as useRef40, useState as
|
|
20765
|
+
import { useEffect as useEffect48, useRef as useRef40, useState as useState39 } from "react";
|
|
20707
20766
|
import { flexRender as flexRender4 } from "@tanstack/react-table";
|
|
20708
20767
|
import { useVirtualizer, useWindowVirtualizer } from "@tanstack/react-virtual";
|
|
20709
20768
|
import clsx36 from "clsx";
|
|
@@ -20717,8 +20776,8 @@ var VirtualizedTableBody = ({
|
|
|
20717
20776
|
const { containerRef } = useTableContainerContext();
|
|
20718
20777
|
const rows = table.getRowModel().rows;
|
|
20719
20778
|
const bodyRef = useRef40(null);
|
|
20720
|
-
const [isMounted, setIsMounted] =
|
|
20721
|
-
const [scrollMargin, setScrollMargin] =
|
|
20779
|
+
const [isMounted, setIsMounted] = useState39(false);
|
|
20780
|
+
const [scrollMargin, setScrollMargin] = useState39(0);
|
|
20722
20781
|
useEffect48(() => setIsMounted(true), []);
|
|
20723
20782
|
useEffect48(() => {
|
|
20724
20783
|
if (scroll !== "window") return;
|
|
@@ -21032,7 +21091,7 @@ var TableWithSelection = ({
|
|
|
21032
21091
|
};
|
|
21033
21092
|
|
|
21034
21093
|
// src/components/layout/table/TableColumn.tsx
|
|
21035
|
-
import { memo as memo2, useEffect as useEffect49, useMemo as useMemo41, useState as
|
|
21094
|
+
import { memo as memo2, useEffect as useEffect49, useMemo as useMemo41, useState as useState40 } from "react";
|
|
21036
21095
|
import { jsx as jsx94 } from "react/jsx-runtime";
|
|
21037
21096
|
var TableColumnComponent = ({
|
|
21038
21097
|
filterType,
|
|
@@ -21044,7 +21103,7 @@ var TableColumnComponent = ({
|
|
|
21044
21103
|
"TableColumn: For filterType === multiTags or singleTag, filterData.tags must be set.",
|
|
21045
21104
|
(filterType === "multiTags" || filterType === "singleTag") && props.meta?.filterData?.tags === void 0
|
|
21046
21105
|
);
|
|
21047
|
-
const [column] =
|
|
21106
|
+
const [column] = useState40({
|
|
21048
21107
|
...props,
|
|
21049
21108
|
filterFn
|
|
21050
21109
|
});
|
|
@@ -21346,7 +21405,7 @@ var TableColumnSwitcher = ({ buttonProps, ...props }) => {
|
|
|
21346
21405
|
import { forwardRef as forwardRef28 } from "react";
|
|
21347
21406
|
|
|
21348
21407
|
// src/components/user-interaction/Combobox/ComboboxRoot.tsx
|
|
21349
|
-
import { useCallback as useCallback45, useId as useId22, useMemo as useMemo44, useState as
|
|
21408
|
+
import { useCallback as useCallback45, useId as useId22, useMemo as useMemo44, useState as useState41 } from "react";
|
|
21350
21409
|
|
|
21351
21410
|
// src/components/user-interaction/Combobox/ComboboxContext.tsx
|
|
21352
21411
|
import { createContext as createContext18, useContext as useContext20 } from "react";
|
|
@@ -21432,10 +21491,10 @@ function ComboboxRoot({
|
|
|
21432
21491
|
onItemClick,
|
|
21433
21492
|
...hookProps
|
|
21434
21493
|
}) {
|
|
21435
|
-
const [options, setOptions] =
|
|
21436
|
-
const [listRef, setListRef] =
|
|
21494
|
+
const [options, setOptions] = useState41([]);
|
|
21495
|
+
const [listRef, setListRef] = useState41(null);
|
|
21437
21496
|
const generatedId = useId22();
|
|
21438
|
-
const [ids, setIds] =
|
|
21497
|
+
const [ids, setIds] = useState41({
|
|
21439
21498
|
trigger: `combobox-${generatedId}`,
|
|
21440
21499
|
listbox: `combobox-${generatedId}-listbox`
|
|
21441
21500
|
});
|
|
@@ -21743,7 +21802,7 @@ var ComboboxOption = forwardRef29(function ComboboxOption2({
|
|
|
21743
21802
|
ComboboxOption.displayName = "ComboboxOption";
|
|
21744
21803
|
|
|
21745
21804
|
// src/components/user-interaction/CopyToClipboardWrapper.tsx
|
|
21746
|
-
import { useState as
|
|
21805
|
+
import { useState as useState42 } from "react";
|
|
21747
21806
|
import { clsx as clsx41 } from "clsx";
|
|
21748
21807
|
|
|
21749
21808
|
// src/utils/writeToClipboard.ts
|
|
@@ -21766,7 +21825,7 @@ var CopyToClipboardWrapper = ({
|
|
|
21766
21825
|
...props
|
|
21767
21826
|
}) => {
|
|
21768
21827
|
const translation = useHightideTranslation();
|
|
21769
|
-
const [isShowingConfirmation, setIsShowingConfirmation] =
|
|
21828
|
+
const [isShowingConfirmation, setIsShowingConfirmation] = useState42(false);
|
|
21770
21829
|
return /* @__PURE__ */ jsxs63(
|
|
21771
21830
|
TooltipRoot,
|
|
21772
21831
|
{
|
|
@@ -21815,7 +21874,7 @@ var CopyToClipboardWrapper = ({
|
|
|
21815
21874
|
};
|
|
21816
21875
|
|
|
21817
21876
|
// src/components/user-interaction/Menu.tsx
|
|
21818
|
-
import { useCallback as useCallback47, useRef as useRef44, useState as
|
|
21877
|
+
import { useCallback as useCallback47, useRef as useRef44, useState as useState43 } from "react";
|
|
21819
21878
|
import clsx42 from "clsx";
|
|
21820
21879
|
import { Fragment as Fragment12, jsx as jsx102, jsxs as jsxs64 } from "react/jsx-runtime";
|
|
21821
21880
|
var MenuItem = ({
|
|
@@ -21842,7 +21901,7 @@ var Menu = ({
|
|
|
21842
21901
|
...props
|
|
21843
21902
|
}) => {
|
|
21844
21903
|
const triggerRef = useRef44(null);
|
|
21845
|
-
const [isOpen, setIsOpen] =
|
|
21904
|
+
const [isOpen, setIsOpen] = useState43(false);
|
|
21846
21905
|
const bag = {
|
|
21847
21906
|
isOpen,
|
|
21848
21907
|
close: () => setIsOpen(false),
|
|
@@ -21985,7 +22044,7 @@ var MultiSelectChipDisplay = forwardRef30(
|
|
|
21985
22044
|
);
|
|
21986
22045
|
|
|
21987
22046
|
// src/components/user-interaction/ScrollPicker.tsx
|
|
21988
|
-
import { useCallback as useCallback48, useEffect as useEffect53, useState as
|
|
22047
|
+
import { useCallback as useCallback48, useEffect as useEffect53, useState as useState44 } from "react";
|
|
21989
22048
|
import clsx43 from "clsx";
|
|
21990
22049
|
import { jsx as jsx104, jsxs as jsxs66 } from "react/jsx-runtime";
|
|
21991
22050
|
var up = 1;
|
|
@@ -22006,7 +22065,7 @@ var ScrollPicker = ({
|
|
|
22006
22065
|
transition,
|
|
22007
22066
|
items,
|
|
22008
22067
|
lastTimeStamp
|
|
22009
|
-
}, setAnimation] =
|
|
22068
|
+
}, setAnimation] = useState44({
|
|
22010
22069
|
targetIndex: selectedIndex,
|
|
22011
22070
|
currentIndex: disabled ? selectedIndex : 0,
|
|
22012
22071
|
velocity: 0,
|
|
@@ -22327,7 +22386,7 @@ var TextareaWithHeadline = ({
|
|
|
22327
22386
|
};
|
|
22328
22387
|
|
|
22329
22388
|
// src/components/user-interaction/data/FilterList.tsx
|
|
22330
|
-
import { useMemo as useMemo45, useState as
|
|
22389
|
+
import { useMemo as useMemo45, useState as useState45 } from "react";
|
|
22331
22390
|
import { PlusIcon } from "lucide-react";
|
|
22332
22391
|
import { Fragment as Fragment13, jsx as jsx107, jsxs as jsxs68 } from "react/jsx-runtime";
|
|
22333
22392
|
var FilterList = ({ value, onValueChange, availableItems }) => {
|
|
@@ -22339,7 +22398,7 @@ var FilterList = ({ value, onValueChange, availableItems }) => {
|
|
|
22339
22398
|
acc[item.id] = item;
|
|
22340
22399
|
return acc;
|
|
22341
22400
|
}, {}), [availableItems]);
|
|
22342
|
-
const [editState, setEditState] =
|
|
22401
|
+
const [editState, setEditState] = useState45(void 0);
|
|
22343
22402
|
const valueWithEditState = useMemo45(() => {
|
|
22344
22403
|
let foundEditValue = false;
|
|
22345
22404
|
for (const item of value) {
|
|
@@ -22637,7 +22696,7 @@ var TimeDisplay = ({
|
|
|
22637
22696
|
};
|
|
22638
22697
|
|
|
22639
22698
|
// src/components/user-interaction/input/FlexibleDateTimeInput.tsx
|
|
22640
|
-
import { forwardRef as forwardRef32, useState as
|
|
22699
|
+
import { forwardRef as forwardRef32, useState as useState46 } from "react";
|
|
22641
22700
|
import { ClockFading, ClockPlus } from "lucide-react";
|
|
22642
22701
|
import { jsx as jsx110 } from "react/jsx-runtime";
|
|
22643
22702
|
var FlexibleDateTimeInput = forwardRef32(function FlexibleDateTimeInput2({
|
|
@@ -22662,7 +22721,7 @@ var FlexibleDateTimeInput = forwardRef32(function FlexibleDateTimeInput2({
|
|
|
22662
22721
|
const zoned = (date) => DateUtils.toZonedDate(date, timeZone);
|
|
22663
22722
|
const unzoned = (date) => DateUtils.fromZonedDate(date, timeZone);
|
|
22664
22723
|
const hasFixedTime = (date) => DateUtils.sameTime(zoned(date), fixedTime, true, true);
|
|
22665
|
-
const [mode, setMode] =
|
|
22724
|
+
const [mode, setMode] = useState46(() => {
|
|
22666
22725
|
if (value && !hasFixedTime(value)) {
|
|
22667
22726
|
return "dateTime";
|
|
22668
22727
|
}
|
|
@@ -22708,7 +22767,7 @@ var FlexibleDateTimeInput = forwardRef32(function FlexibleDateTimeInput2({
|
|
|
22708
22767
|
|
|
22709
22768
|
// src/components/user-interaction/input/InsideLabelInput.tsx
|
|
22710
22769
|
import { useId as useId25 } from "react";
|
|
22711
|
-
import { forwardRef as forwardRef33, useState as
|
|
22770
|
+
import { forwardRef as forwardRef33, useState as useState47 } from "react";
|
|
22712
22771
|
import clsx46 from "clsx";
|
|
22713
22772
|
import { jsx as jsx111, jsxs as jsxs70 } from "react/jsx-runtime";
|
|
22714
22773
|
var InsideLabelInput = forwardRef33(function InsideLabelInput2({
|
|
@@ -22724,7 +22783,7 @@ var InsideLabelInput = forwardRef33(function InsideLabelInput2({
|
|
|
22724
22783
|
onValueChange,
|
|
22725
22784
|
defaultValue: initialValue
|
|
22726
22785
|
});
|
|
22727
|
-
const [isFocused, setIsFocused] =
|
|
22786
|
+
const [isFocused, setIsFocused] = useState47(false);
|
|
22728
22787
|
const generatedId = useId25();
|
|
22729
22788
|
const id = customId ?? generatedId;
|
|
22730
22789
|
return /* @__PURE__ */ jsxs70("div", { className: clsx46("relative"), children: [
|
|
@@ -22814,7 +22873,7 @@ var SearchBar = ({
|
|
|
22814
22873
|
};
|
|
22815
22874
|
|
|
22816
22875
|
// src/components/user-interaction/input/ToggleableInput.tsx
|
|
22817
|
-
import { forwardRef as forwardRef34, useEffect as useEffect54, useImperativeHandle as useImperativeHandle15, useRef as useRef46, useState as
|
|
22876
|
+
import { forwardRef as forwardRef34, useEffect as useEffect54, useImperativeHandle as useImperativeHandle15, useRef as useRef46, useState as useState48 } from "react";
|
|
22818
22877
|
import { Pencil } from "lucide-react";
|
|
22819
22878
|
import clsx48 from "clsx";
|
|
22820
22879
|
import { jsx as jsx113, jsxs as jsxs72 } from "react/jsx-runtime";
|
|
@@ -22831,7 +22890,7 @@ var ToggleableInput = forwardRef34(function ToggleableInput2({
|
|
|
22831
22890
|
onValueChange,
|
|
22832
22891
|
defaultValue: initialValue
|
|
22833
22892
|
});
|
|
22834
|
-
const [isEditing, setIsEditing] =
|
|
22893
|
+
const [isEditing, setIsEditing] = useState48(initialState !== "display");
|
|
22835
22894
|
const innerRef = useRef46(null);
|
|
22836
22895
|
useImperativeHandle15(forwardedRef, () => innerRef.current);
|
|
22837
22896
|
useEffect54(() => {
|
|
@@ -23282,14 +23341,14 @@ var PolymorphicSlot = forwardRef35(function PolymorphicSlot2({
|
|
|
23282
23341
|
});
|
|
23283
23342
|
|
|
23284
23343
|
// src/components/utils/Transition.tsx
|
|
23285
|
-
import { useEffect as useEffect55, useState as
|
|
23344
|
+
import { useEffect as useEffect55, useState as useState49 } from "react";
|
|
23286
23345
|
function Transition({
|
|
23287
23346
|
children,
|
|
23288
23347
|
show,
|
|
23289
23348
|
includeAnimation = true
|
|
23290
23349
|
}) {
|
|
23291
|
-
const [isOpen, setIsOpen] =
|
|
23292
|
-
const [isTransitioning, setIsTransitioning] =
|
|
23350
|
+
const [isOpen, setIsOpen] = useState49(show);
|
|
23351
|
+
const [isTransitioning, setIsTransitioning] = useState49(!isOpen);
|
|
23293
23352
|
const isUsingReducedMotion = typeof window !== "undefined" && typeof window.matchMedia === "function" ? window.matchMedia("(prefers-reduced-motion: reduce)").matches : true;
|
|
23294
23353
|
useEffect55(() => {
|
|
23295
23354
|
setIsOpen(show);
|
|
@@ -23397,11 +23456,11 @@ var useFocusOnceVisible = (ref, disable = false) => {
|
|
|
23397
23456
|
};
|
|
23398
23457
|
|
|
23399
23458
|
// src/hooks/focus/useIsMounted.ts
|
|
23400
|
-
import { useEffect as useEffect58, useLayoutEffect as useLayoutEffect8, useState as
|
|
23459
|
+
import { useEffect as useEffect58, useLayoutEffect as useLayoutEffect8, useState as useState50 } from "react";
|
|
23401
23460
|
var isClient = typeof window !== "undefined" && typeof document !== "undefined";
|
|
23402
23461
|
var useIsomorphicEffect = isClient ? useLayoutEffect8 : useEffect58;
|
|
23403
23462
|
var useIsMounted = () => {
|
|
23404
|
-
const [isMounted, setIsMounted] =
|
|
23463
|
+
const [isMounted, setIsMounted] = useState50(false);
|
|
23405
23464
|
useIsomorphicEffect(() => {
|
|
23406
23465
|
setIsMounted(true);
|
|
23407
23466
|
return () => {
|
|
@@ -23453,9 +23512,9 @@ function useLogUnstableDependencies(name, value) {
|
|
|
23453
23512
|
}
|
|
23454
23513
|
|
|
23455
23514
|
// src/hooks/useOverwritableState.ts
|
|
23456
|
-
import { useEffect as useEffect60, useState as
|
|
23515
|
+
import { useEffect as useEffect60, useState as useState51 } from "react";
|
|
23457
23516
|
var useOverwritableState = (overwriteValue, onChange) => {
|
|
23458
|
-
const [state, setState] =
|
|
23517
|
+
const [state, setState] = useState51(overwriteValue);
|
|
23459
23518
|
useEffect60(() => {
|
|
23460
23519
|
setState(overwriteValue);
|
|
23461
23520
|
}, [overwriteValue]);
|
|
@@ -23539,7 +23598,6 @@ var useSwipeGesture = ({
|
|
|
23539
23598
|
const listenTouch = inputMode === "touch" || inputMode === "both";
|
|
23540
23599
|
const listenMouse = inputMode === "mouse" || inputMode === "both";
|
|
23541
23600
|
const onGestureStart = (x, y, eventTarget) => {
|
|
23542
|
-
console.log("onGestureStart", x, y);
|
|
23543
23601
|
if (!isWithinStartRegion(x, y)) return;
|
|
23544
23602
|
const scrollableParent = findScrollableParent(eventTarget);
|
|
23545
23603
|
gestureEndRef.current = null;
|
|
@@ -23552,7 +23610,6 @@ var useSwipeGesture = ({
|
|
|
23552
23610
|
isScrollingRef.current = !!scrollableParent;
|
|
23553
23611
|
};
|
|
23554
23612
|
const onGestureMove = (x, y, eventTarget) => {
|
|
23555
|
-
console.log("onGestureMove", x, y);
|
|
23556
23613
|
const scrollableParent = findScrollableParent(eventTarget);
|
|
23557
23614
|
const currentScrollY = scrollableParent?.scrollTop ?? window.scrollY;
|
|
23558
23615
|
gestureEndRef.current = {
|
|
@@ -23669,13 +23726,13 @@ var useSwipeGesture = ({
|
|
|
23669
23726
|
};
|
|
23670
23727
|
|
|
23671
23728
|
// src/hooks/useUpdatingDateString.ts
|
|
23672
|
-
import { useEffect as useEffect62, useState as
|
|
23729
|
+
import { useEffect as useEffect62, useState as useState52 } from "react";
|
|
23673
23730
|
var useUpdatingDateString = ({ absoluteFormat = "dateTime", localeOverride, is24HourFormat: is24HourFormatOverride, timeZone: timeZoneOverride, date }) => {
|
|
23674
23731
|
const { locale: contextLocale, is24HourFormat: contextIs24HourFormat, timeZone: contextTimeZone } = useLocale();
|
|
23675
23732
|
const locale = localeOverride ?? contextLocale;
|
|
23676
23733
|
const is24HourFormat = is24HourFormatOverride ?? contextIs24HourFormat ?? true;
|
|
23677
23734
|
const timeZone = timeZoneOverride ?? contextTimeZone;
|
|
23678
|
-
const [dateAndTimeStrings, setDateAndTimeStrings] =
|
|
23735
|
+
const [dateAndTimeStrings, setDateAndTimeStrings] = useState52({
|
|
23679
23736
|
compareDate: date,
|
|
23680
23737
|
absolute: DateUtils.formatAbsolute(date, locale, absoluteFormat, { is24HourFormat, timeZone }),
|
|
23681
23738
|
relative: DateUtils.formatRelative(date, locale)
|
|
@@ -24272,6 +24329,7 @@ export {
|
|
|
24272
24329
|
processModelLibrary,
|
|
24273
24330
|
range,
|
|
24274
24331
|
resolveSetState,
|
|
24332
|
+
resolveTreeNodePath,
|
|
24275
24333
|
segmentBounds,
|
|
24276
24334
|
segmentPlaceholder,
|
|
24277
24335
|
setDayPeriod,
|