@dmsi/wedgekit-react 0.0.1277 → 1.0.1

package/dist/chunk-Z5YP2GI6.js

@@ -1,142 +0,0 @@
-import {
-  useMatchesMobile
-} from "./chunk-WVGXD7HT.js";
-import {
-  Stack
-} from "./chunk-MVDGHWKO.js";
-
-// src/components/CompactImagesPreview.tsx
-import { useCallback, useEffect, useMemo, useState } from "react";
-import clsx from "clsx";
-import { jsx, jsxs } from "react/jsx-runtime";
-function hasValidSourceUri(uri, placeholderImageUri) {
-  const normalizedUri = uri == null ? void 0 : uri.trim();
-  return !!normalizedUri && normalizedUri !== placeholderImageUri && !normalizedUri.endsWith("/placeholder.svg") && !normalizedUri.includes("/placeholder.svg?");
-}
-function CompactImagesPreview(props) {
-  const {
-    sources,
-    currentSourceIndex = 0,
-    activeImageHeight = 243,
-    activeImageWidth = 242,
-    thumbnailWidth = 30.5,
-    thumbnailHeight = 30,
-    enableThumbnailBorder = false,
-    placeholderImageUri,
-    placeholderAlt = "placeholder image",
-    onChangeSource,
-    onMainImageClick,
-    testid
-  } = props;
-  const isMobile = useMatchesMobile();
-  const [failedSourceUris, setFailedSourceUris] = useState([]);
-  const sourceKey = useMemo(
-    () => sources.map((source) => source.uri).join("|"),
-    [sources]
-  );
-  const validSources = useMemo(
-    () => sources.filter(
-      (source) => hasValidSourceUri(source.uri, placeholderImageUri) && failedSourceUris.indexOf(source.uri) === -1
-    ),
-    [failedSourceUris, placeholderImageUri, sources]
-  );
-  const imagesCount = validSources.length;
-  const safeCurrentSourceIndex = currentSourceIndex >= 0 && currentSourceIndex < imagesCount ? currentSourceIndex : 0;
-  useEffect(() => {
-    setFailedSourceUris([]);
-  }, [sourceKey]);
-  const handleImgError = useCallback(
-    (e, failedUri) => {
-      if (failedUri) {
-        setFailedSourceUris(
-          (previousUris) => previousUris.indexOf(failedUri) >= 0 ? previousUris : [...previousUris, failedUri]
-        );
-      }
-      if (!placeholderImageUri) return;
-      const img = e.currentTarget;
-      if (img.src === placeholderImageUri) return;
-      img.src = placeholderImageUri;
-      if (!img.alt) img.alt = placeholderAlt;
-    },
-    [placeholderAlt, placeholderImageUri]
-  );
-  const handleThumbnailClick = useCallback(
-    (newIndex) => {
-      if (newIndex === currentSourceIndex) return;
-      if (newIndex < 0 || newIndex >= imagesCount) return;
-      onChangeSource(newIndex);
-    },
-    [currentSourceIndex, onChangeSource, imagesCount]
-  );
-  if (!validSources.length || typeof isMobile === "undefined")
-    return /* @__PURE__ */ jsx("div", { className: "flex flex-row justify-center w-full", children: /* @__PURE__ */ jsx(
-      "img",
-      {
-        "data-testid": testid ? `${testid}-placeholder` : void 0,
-        className: "object-center",
-        style: {
-          width: activeImageWidth,
-          height: activeImageHeight,
-          objectPosition: "center",
-          objectFit: "contain"
-        },
-        src: placeholderImageUri,
-        alt: placeholderAlt,
-        onError: (event) => handleImgError(event),
-        onClick: onMainImageClick
-      }
-    ) });
-  const currentSource = validSources[safeCurrentSourceIndex];
-  return /* @__PURE__ */ jsxs(Stack, { "data-testid": testid, sizing: "layout", children: [
-    /* @__PURE__ */ jsx(
-      "img",
-      {
-        "data-testid": testid ? `${testid}-main-image` : void 0,
-        className: clsx("object-center", onMainImageClick && "cursor-pointer"),
-        style: {
-          width: isMobile ? "100%" : activeImageWidth,
-          height: activeImageHeight,
-          objectPosition: "center",
-          objectFit: "contain"
-        },
-        src: currentSource.uri,
-        alt: currentSource.name,
-        onError: (event) => handleImgError(event, currentSource.uri),
-        onClick: onMainImageClick
-      }
-    ),
-    imagesCount > 1 && /* @__PURE__ */ jsx("div", { className: "flex flex-row flex-wrap items-center gap-3", children: validSources.slice(0, 4).map((source, index) => /* @__PURE__ */ jsx(
-      "button",
-      {
-        "data-testid": testid ? `${testid}-thumbnail-${index}` : void 0,
-        onClick: (e) => {
-          e.preventDefault();
-          handleThumbnailClick(index);
-        },
-        className: clsx(
-          "cursor-pointer",
-          safeCurrentSourceIndex === index && enableThumbnailBorder ? "ring-2 ring-offset-2 ring-brand-400 transition-discrete duration-300" : "ring-brand-400/0"
-        ),
-        children: /* @__PURE__ */ jsx(
-          "img",
-          {
-            src: source.uri,
-            alt: source.name,
-            style: {
-              width: thumbnailWidth,
-              height: thumbnailHeight,
-              objectPosition: "center",
-              objectFit: "cover"
-            },
-            onError: (event) => handleImgError(event, source.uri)
-          }
-        )
-      },
-      `compact-image-${source.uri}-${index}`
-    )) })
-  ] });
-}
-
-export {
-  CompactImagesPreview
-};

package/dist/chunk-ZRFXUER3.js

@@ -1,468 +0,0 @@
-import {
-  LocalStoragePrefixVersion
-} from "./chunk-TBZ243DS.js";
-import {
-  __spreadProps,
-  __spreadValues
-} from "./chunk-ORMEWXMH.js";
-
-// src/hooks/useKeydown.ts
-import { useEffect } from "react";
-function useKeydown(keys, isActive) {
-  function handleKeyDown(event) {
-    if (!Object.keys(keys).includes(event.key) && !Object.keys(keys).join("").includes("/"))
-      return;
-    Object.entries(keys).forEach(([key, handler]) => {
-      if (event.key !== key && !key.includes("/")) return;
-      if (key.includes("/") && key.replace("Space", " ").split("/").includes(event.key)) {
-        event.preventDefault();
-        handler(event);
-        return;
-      }
-      if (event.key === key) {
-        event.preventDefault();
-        handler(event);
-      }
-    });
-  }
-  useEffect(() => {
-    if (!isActive)
-      return document.removeEventListener("keydown", handleKeyDown);
-    document.addEventListener("keydown", handleKeyDown);
-    return () => {
-      document.removeEventListener("keydown", handleKeyDown);
-    };
-  }, [keys, isActive]);
-}
-
-// src/hooks/useInfiniteScroll.tsx
-import { useEffect as useEffect2 } from "react";
-function useInfiniteScroll({
-  containerRef,
-  onLoadMore,
-  isLoading,
-  offset = 50,
-  enabled = true
-  // ✅ Add this
-}) {
-  useEffect2(() => {
-    if (!enabled) return;
-    const handleScroll = () => {
-      const el2 = containerRef.current;
-      if (!el2 || isLoading) return;
-      const { scrollTop, scrollHeight, clientHeight } = el2;
-      const isNearBottom = scrollTop + clientHeight >= scrollHeight - offset;
-      if (isNearBottom) {
-        onLoadMore();
-      }
-    };
-    const el = containerRef.current;
-    if (el) el.addEventListener("scroll", handleScroll);
-    return () => {
-      if (el) el.removeEventListener("scroll", handleScroll);
-    };
-  }, [containerRef, onLoadMore, isLoading, offset, enabled]);
-}
-
-// src/hooks/useTableLayout/useTableLayout.ts
-import {
-  useState,
-  useEffect as useEffect3,
-  useCallback,
-  useRef
-} from "react";
-
-// src/hooks/useTableLayout/storage.ts
-var STORAGE_PREFIX = `${LocalStoragePrefixVersion}-tablePrefs`;
-var LEGACY_STORAGE_PREFIX = `${LocalStoragePrefixVersion}-tableLayout`;
-var CURRENT_SCHEMA_VERSION = 2;
-function getStorageKey(key) {
-  return `${STORAGE_PREFIX}__${key}`;
-}
-function getLegacyStorageKey(key) {
-  return `${LEGACY_STORAGE_PREFIX}__${key}-tableLayout`;
-}
-function loadPreferences(key) {
-  const storageKey = getStorageKey(key);
-  const legacyKey = getLegacyStorageKey(key);
-  const newData = localStorage.getItem(storageKey);
-  if (newData) {
-    try {
-      const parsed = JSON.parse(newData);
-      if (parsed.version === CURRENT_SCHEMA_VERSION) {
-        return parsed;
-      }
-      localStorage.removeItem(storageKey);
-    } catch (e) {
-      localStorage.removeItem(storageKey);
-    }
-  }
-  const legacyData = localStorage.getItem(legacyKey);
-  if (legacyData) {
-    localStorage.removeItem(legacyKey);
-  }
-  return null;
-}
-function savePreferences(key, preferences) {
-  var _a, _b, _c, _d, _e, _f, _g;
-  const storageKey = getStorageKey(key);
-  const hasPreferences = ((_b = (_a = preferences.columnOrder) == null ? void 0 : _a.length) != null ? _b : 0) > 0 || ((_d = (_c = preferences.hiddenByUser) == null ? void 0 : _c.length) != null ? _d : 0) > 0 || ((_f = (_e = preferences.shownByUser) == null ? void 0 : _e.length) != null ? _f : 0) > 0 || Object.keys((_g = preferences.columnWidths) != null ? _g : {}).length > 0;
-  if (!hasPreferences) {
-    localStorage.removeItem(storageKey);
-    return;
-  }
-  const data = __spreadProps(__spreadValues({}, preferences), {
-    version: CURRENT_SCHEMA_VERSION
-  });
-  localStorage.setItem(storageKey, JSON.stringify(data));
-}
-function clearPreferences(key) {
-  const storageKey = getStorageKey(key);
-  const legacyKey = getLegacyStorageKey(key);
-  localStorage.removeItem(storageKey);
-  localStorage.removeItem(legacyKey);
-}
-function clearAllLegacyData() {
-  if (typeof window === "undefined") return;
-  const keysToRemove = [];
-  for (let i = 0; i < localStorage.length; i++) {
-    const key = localStorage.key(i);
-    if ((key == null ? void 0 : key.includes("-tableLayout__")) && key.endsWith("-tableLayout")) {
-      keysToRemove.push(key);
-    }
-  }
-  keysToRemove.forEach((key) => {
-    localStorage.removeItem(key);
-  });
-}
-function hasPerformedLegacyMigration() {
-  if (typeof window === "undefined") return true;
-  return localStorage.getItem(`${STORAGE_PREFIX}__migrated`) === "true";
-}
-function markLegacyMigrationComplete() {
-  if (typeof window === "undefined") return;
-  localStorage.setItem(`${STORAGE_PREFIX}__migrated`, "true");
-}
-
-// src/hooks/useTableLayout/computeColumns.ts
-function computeColumnVisibility(column, preferences) {
-  var _a, _b, _c, _d, _e, _f;
-  const columnId = column.id;
-  if (!columnId) return true;
-  const systemVisible = (_b = (_a = column.meta) == null ? void 0 : _a.visible) != null ? _b : true;
-  const canUserToggle = (_d = (_c = column.meta) == null ? void 0 : _c.inVisibilityMenu) != null ? _d : true;
-  if (!canUserToggle) {
-    return systemVisible;
-  }
-  if (preferences) {
-    if ((_e = preferences.hiddenByUser) == null ? void 0 : _e.includes(columnId)) {
-      return false;
-    }
-    if ((_f = preferences.shownByUser) == null ? void 0 : _f.includes(columnId)) {
-      return true;
-    }
-  }
-  return systemVisible;
-}
-function applyPreferencesToColumns(systemColumns, preferences) {
-  var _a;
-  let columns = systemColumns.map((col) => __spreadProps(__spreadValues({}, col), {
-    meta: __spreadProps(__spreadValues({}, col.meta), {
-      // Compute visibility based on system + user preferences
-      visible: computeColumnVisibility(col, preferences)
-    })
-  }));
-  if ((_a = preferences == null ? void 0 : preferences.columnOrder) == null ? void 0 : _a.length) {
-    const orderMap = new Map(
-      preferences.columnOrder.map((id, index) => [id, index])
-    );
-    columns = columns.sort((a, b) => {
-      var _a2, _b;
-      const orderA = (_a2 = orderMap.get(a.id)) != null ? _a2 : Number.MAX_SAFE_INTEGER;
-      const orderB = (_b = orderMap.get(b.id)) != null ? _b : Number.MAX_SAFE_INTEGER;
-      if (orderA === Number.MAX_SAFE_INTEGER && orderB === Number.MAX_SAFE_INTEGER) {
-        return 0;
-      }
-      return orderA - orderB;
-    });
-  }
-  if (preferences == null ? void 0 : preferences.columnWidths) {
-    columns = columns.map((col) => {
-      var _a2;
-      const width = col.id ? (_a2 = preferences.columnWidths) == null ? void 0 : _a2[col.id] : void 0;
-      if (width !== void 0) {
-        return __spreadProps(__spreadValues({}, col), {
-          size: width
-        });
-      }
-      return col;
-    });
-  }
-  return columns;
-}
-function extractColumnOrder(columns) {
-  return columns.filter((c) => c.id).map((c) => c.id);
-}
-function extractVisibilityChanges(columns, systemColumns) {
-  const hiddenByUser = [];
-  const shownByUser = [];
-  columns.forEach((col) => {
-    var _a, _b, _c, _d, _e, _f, _g;
-    if (!col.id) return;
-    const systemCol = systemColumns.find((c) => c.id === col.id);
-    if (!systemCol) return;
-    const systemVisible = (_b = (_a = systemCol.meta) == null ? void 0 : _a.visible) != null ? _b : true;
-    const currentVisible = (_d = (_c = col.meta) == null ? void 0 : _c.visible) != null ? _d : true;
-    const canToggle = (_f = (_e = systemCol.meta) == null ? void 0 : _e.inVisibilityMenu) != null ? _f : true;
-    if (!canToggle) return;
-    if (systemVisible && !currentVisible) {
-      hiddenByUser.push(col.id);
-    } else if (!systemVisible && currentVisible) {
-      if (((_g = systemCol.meta) == null ? void 0 : _g.inVisibilityMenu) !== false) {
-        shownByUser.push(col.id);
-      }
-    }
-  });
-  return { hiddenByUser, shownByUser };
-}
-
-// src/hooks/useTableLayout/useTableLayout.ts
-var hasCleanedLegacyDataThisSession = false;
-function useTableLayout(initialColumns, key, autosync = true) {
-  const [preferences, setPreferences] = useState(null);
-  const [columns, setColumnsState] = useState(
-    () => (
-      // Initialize with system columns (no preferences applied yet)
-      initialColumns.map((col) => __spreadValues({}, col))
-    )
-  );
-  const [isReady, setIsReady] = useState(false);
-  const keyRef = useRef(key);
-  const initialColumnsRef = useRef(initialColumns);
-  const preferencesRef = useRef(preferences);
-  const autosyncRef = useRef(autosync);
-  useEffect3(() => {
-    keyRef.current = key;
-  }, [key]);
-  useEffect3(() => {
-    initialColumnsRef.current = initialColumns;
-  }, [initialColumns]);
-  useEffect3(() => {
-    preferencesRef.current = preferences;
-  }, [preferences]);
-  useEffect3(() => {
-    autosyncRef.current = autosync;
-  }, [autosync]);
-  useEffect3(() => {
-    if (typeof window === "undefined") return;
-    if (!hasCleanedLegacyDataThisSession && !hasPerformedLegacyMigration()) {
-      clearAllLegacyData();
-      markLegacyMigrationComplete();
-      hasCleanedLegacyDataThisSession = true;
-    }
-  }, []);
-  useEffect3(() => {
-    if (!autosync) {
-      setIsReady(true);
-      return;
-    }
-    if (!key) {
-      setIsReady(true);
-      return;
-    }
-    const savedPrefs = loadPreferences(key);
-    setPreferences(savedPrefs);
-    const computedColumns = applyPreferencesToColumns(
-      initialColumns,
-      savedPrefs
-    );
-    setColumnsState(computedColumns);
-    setIsReady(true);
-  }, [key, autosync]);
-  useEffect3(() => {
-    if (!isReady) return;
-    const computedColumns = applyPreferencesToColumns(
-      initialColumns,
-      preferencesRef.current
-    );
-    setColumnsState(computedColumns);
-  }, [initialColumns, isReady]);
-  const persistPreferences = useCallback(
-    (newPrefs) => {
-      if (!keyRef.current) return;
-      const updated = __spreadProps(__spreadValues(__spreadValues({}, preferencesRef.current), newPrefs), {
-        version: 2
-      });
-      setPreferences(updated);
-      if (autosyncRef.current) {
-        savePreferences(keyRef.current, updated);
-      }
-      const computedColumns = applyPreferencesToColumns(
-        initialColumnsRef.current,
-        updated
-      );
-      setColumnsState(computedColumns);
-    },
-    []
-  );
-  const hideColumn = useCallback(
-    (columnId) => {
-      var _a, _b;
-      const currentPrefs = preferencesRef.current;
-      const currentHidden = (_a = currentPrefs == null ? void 0 : currentPrefs.hiddenByUser) != null ? _a : [];
-      const currentShown = (_b = currentPrefs == null ? void 0 : currentPrefs.shownByUser) != null ? _b : [];
-      const newShown = currentShown.filter((id) => id !== columnId);
-      const newHidden = currentHidden.includes(columnId) ? currentHidden : [...currentHidden, columnId];
-      persistPreferences(__spreadProps(__spreadValues({}, currentPrefs), {
-        hiddenByUser: newHidden,
-        shownByUser: newShown
-      }));
-    },
-    [persistPreferences]
-  );
-  const showColumn = useCallback(
-    (columnId) => {
-      var _a, _b;
-      const currentPrefs = preferencesRef.current;
-      const currentHidden = (_a = currentPrefs == null ? void 0 : currentPrefs.hiddenByUser) != null ? _a : [];
-      const currentShown = (_b = currentPrefs == null ? void 0 : currentPrefs.shownByUser) != null ? _b : [];
-      const newHidden = currentHidden.filter((id) => id !== columnId);
-      const newShown = currentShown.includes(columnId) ? currentShown : [...currentShown, columnId];
-      persistPreferences(__spreadProps(__spreadValues({}, currentPrefs), {
-        hiddenByUser: newHidden,
-        shownByUser: newShown
-      }));
-    },
-    [persistPreferences]
-  );
-  const reorderColumns = useCallback(
-    (columnIds) => {
-      persistPreferences(__spreadProps(__spreadValues({}, preferencesRef.current), {
-        columnOrder: columnIds
-      }));
-    },
-    [persistPreferences]
-  );
-  const setColumnWidth = useCallback(
-    (columnId, width) => {
-      var _a;
-      const currentPrefs = preferencesRef.current;
-      const currentWidths = (_a = currentPrefs == null ? void 0 : currentPrefs.columnWidths) != null ? _a : {};
-      persistPreferences(__spreadProps(__spreadValues({}, currentPrefs), {
-        columnWidths: __spreadProps(__spreadValues({}, currentWidths), { [columnId]: width })
-      }));
-    },
-    [persistPreferences]
-  );
-  const resetToDefaults = useCallback(() => {
-    if (!keyRef.current) return;
-    clearPreferences(keyRef.current);
-    setPreferences(null);
-    const computedColumns = applyPreferencesToColumns(
-      initialColumnsRef.current,
-      null
-    );
-    setColumnsState(computedColumns);
-  }, []);
-  const getUserPreferences = useCallback(() => {
-    var _a;
-    return (_a = preferencesRef.current) != null ? _a : { version: 2 };
-  }, []);
-  const getSavedLayout = useCallback(() => {
-    return columns;
-  }, [columns]);
-  const setColumns = useCallback(
-    (setter) => {
-      setColumnsState((prev) => {
-        var _a, _b, _c, _d;
-        const newColumns = typeof setter === "function" ? setter(prev) : setter;
-        const newOrder = extractColumnOrder(newColumns);
-        const { hiddenByUser, shownByUser } = extractVisibilityChanges(
-          newColumns,
-          initialColumnsRef.current
-        );
-        const existingPrefs = preferencesRef.current;
-        const mergedHidden = Array.from(
-          /* @__PURE__ */ new Set([
-            ...hiddenByUser,
-            // Keep existing hidden prefs for columns that are still hidden
-            ...(_b = (_a = existingPrefs == null ? void 0 : existingPrefs.hiddenByUser) == null ? void 0 : _a.filter((id) => {
-              var _a2;
-              const col = newColumns.find((c) => c.id === id);
-              return col && ((_a2 = col.meta) == null ? void 0 : _a2.visible) === false;
-            })) != null ? _b : []
-          ])
-        );
-        const mergedShown = Array.from(
-          /* @__PURE__ */ new Set([
-            ...shownByUser,
-            // Keep existing shown prefs for columns that are still visible
-            ...(_d = (_c = existingPrefs == null ? void 0 : existingPrefs.shownByUser) == null ? void 0 : _c.filter((id) => {
-              var _a2;
-              const col = newColumns.find((c) => c.id === id);
-              return col && ((_a2 = col.meta) == null ? void 0 : _a2.visible) !== false;
-            })) != null ? _d : []
-          ])
-        );
-        if (keyRef.current && autosync) {
-          const newPrefs = {
-            columnOrder: newOrder,
-            hiddenByUser: mergedHidden,
-            shownByUser: mergedShown,
-            columnWidths: existingPrefs == null ? void 0 : existingPrefs.columnWidths,
-            version: 2
-          };
-          setPreferences(newPrefs);
-          savePreferences(keyRef.current, newPrefs);
-        }
-        return newColumns;
-      });
-    },
-    [autosync]
-  );
-  return {
-    columns,
-    setColumns,
-    isReady,
-    getSavedLayout,
-    hideColumn,
-    showColumn,
-    reorderColumns,
-    setColumnWidth,
-    resetToDefaults,
-    getUserPreferences
-  };
-}
-
-// src/hooks/useEditCell.tsx
-import { useRef as useRef2, useState as useState2 } from "react";
-function useEditCell(initialValue) {
-  const [value, setValue] = useState2(initialValue);
-  const [isEdit, setIsEdit] = useState2(false);
-  const inputRef = useRef2(null);
-  function changeToEditMode() {
-    setIsEdit(true);
-    requestAnimationFrame(() => {
-      var _a;
-      (_a = inputRef.current) == null ? void 0 : _a.focus();
-    });
-  }
-  function changeToViewMode() {
-    setIsEdit(false);
-  }
-  return {
-    value,
-    setValue,
-    isEdit,
-    inputRef,
-    changeToEditMode,
-    changeToViewMode
-  };
-}
-
-export {
-  useKeydown,
-  useInfiniteScroll,
-  useTableLayout,
-  useEditCell
-};