@dbcdk/react-components 0.0.191 → 0.0.192

package/dist/hooks/useTreeViewSettings.d.ts

@@ -0,0 +1,35 @@
+import type { TreeNode, TreeViewProps } from '../components/tree-view/types';
+type TreeViewSettingsState = {
+    wrapLabels: boolean;
+};
+export type TreeViewSettingsStorage = {
+    get: (key: string) => TreeViewSettingsState | undefined;
+    set: (key: string, next: TreeViewSettingsState) => void;
+};
+export declare const localStorageTreeViewSettingsStorage: TreeViewSettingsStorage;
+export interface UseTreeViewSettingsOptions<T = unknown> {
+    data?: TreeNode<T>[];
+    defaultExpandedIds?: string[];
+    expandedIds?: string[];
+    onExpandedIdsChange?: (ids: string[]) => void;
+    defaultWrapLabels?: boolean;
+    wrapLabels?: boolean;
+    onWrapLabelsChange?: (value: boolean) => void;
+    storageKey?: string;
+    storage?: TreeViewSettingsStorage;
+}
+export interface UseTreeViewSettingsResult<T = unknown> {
+    wrapLabels: boolean;
+    setWrapLabels: (value: boolean) => void;
+    toggleWrapLabels: () => void;
+    expandedIds: string[];
+    setExpandedIds: (ids: string[]) => void;
+    expand: (id: string) => void;
+    collapse: (id: string) => void;
+    toggle: (id: string) => void;
+    expandAll: () => void;
+    collapseAll: () => void;
+    treeViewProps: Pick<TreeViewProps<T>, 'expandedIds' | 'onExpandedIdsChange' | 'wrapLabels'>;
+}
+export declare function useTreeViewSettings<T = unknown>({ data, defaultExpandedIds, expandedIds: controlledExpandedIds, onExpandedIdsChange, defaultWrapLabels, wrapLabels: controlledWrapLabels, onWrapLabelsChange, storageKey, storage, }: UseTreeViewSettingsOptions<T>): UseTreeViewSettingsResult<T>;
+export {};

package/dist/hooks/useTreeViewSettings.js

@@ -0,0 +1,84 @@
+'use client';
+import { useState, useEffect, useCallback, useMemo } from 'react';
+import { useTreeExpansion } from '../components/tree-view/useTreeExpansion';
+import { collectExpandableIds } from '../components/tree-view/utils';
+import { writeLocalStorage, readLocalStorage } from '../utils/localStorage.utils';
+
+function isTreeViewSettingsState(value) {
+  return typeof value === "object" && value !== null && typeof value.wrapLabels === "boolean";
+}
+const localStorageTreeViewSettingsStorage = {
+  get: (key) => {
+    const stored = readLocalStorage(key);
+    return isTreeViewSettingsState(stored) ? stored : void 0;
+  },
+  set: (key, next) => {
+    writeLocalStorage(key, next);
+  }
+};
+function useTreeViewSettings({
+  data = [],
+  defaultExpandedIds = [],
+  expandedIds: controlledExpandedIds,
+  onExpandedIdsChange,
+  defaultWrapLabels = true,
+  wrapLabels: controlledWrapLabels,
+  onWrapLabelsChange,
+  storageKey,
+  storage = localStorageTreeViewSettingsStorage
+}) {
+  const [uncontrolledWrapLabels, setUncontrolledWrapLabels] = useState(defaultWrapLabels);
+  const isWrapControlled = controlledWrapLabels !== void 0;
+  const wrapLabels = isWrapControlled ? controlledWrapLabels : uncontrolledWrapLabels;
+  useEffect(() => {
+    if (!storageKey || isWrapControlled) return;
+    const stored = storage.get(storageKey);
+    if (stored) {
+      setUncontrolledWrapLabels(stored.wrapLabels);
+    }
+  }, [isWrapControlled, storage, storageKey]);
+  const setWrapLabels = useCallback(
+    (value) => {
+      if (wrapLabels === value) return;
+      if (!isWrapControlled) {
+        setUncontrolledWrapLabels(value);
+        if (storageKey) {
+          storage.set(storageKey, { wrapLabels: value });
+        }
+      }
+      onWrapLabelsChange == null ? void 0 : onWrapLabelsChange(value);
+    },
+    [isWrapControlled, onWrapLabelsChange, storage, storageKey, wrapLabels]
+  );
+  const toggleWrapLabels = useCallback(() => {
+    setWrapLabels(!wrapLabels);
+  }, [setWrapLabels, wrapLabels]);
+  const expansion = useTreeExpansion(defaultExpandedIds, controlledExpandedIds, onExpandedIdsChange);
+  const expandedIds = useMemo(() => Array.from(expansion.expandedIds), [expansion.expandedIds]);
+  const expandAll = useCallback(() => {
+    expansion.setExpandedIds(collectExpandableIds(data));
+  }, [data, expansion]);
+  const treeViewProps = useMemo(
+    () => ({
+      expandedIds,
+      onExpandedIdsChange: expansion.setExpandedIds,
+      wrapLabels
+    }),
+    [expandedIds, expansion.setExpandedIds, wrapLabels]
+  );
+  return {
+    wrapLabels,
+    setWrapLabels,
+    toggleWrapLabels,
+    expandedIds,
+    setExpandedIds: expansion.setExpandedIds,
+    expand: expansion.expand,
+    collapse: expansion.collapse,
+    toggle: expansion.toggle,
+    expandAll,
+    collapseAll: expansion.collapseAll,
+    treeViewProps
+  };
+}
+
+export { localStorageTreeViewSettingsStorage, useTreeViewSettings };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dbcdk/react-components",
-  "version": "0.0.191",
+  "version": "0.0.192",
   "description": "Reusable React components for DBC projects",
   "license": "ISC",
   "author": "",