@lv-x-software-house/x_view 1.2.5-dev.19 → 1.2.5-dev.20

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/dist/index.js +31 -13
  2. package/dist/index.mjs +31 -13
  3. package/package.json +1 -1
package/dist/index.js CHANGED
@@ -663,11 +663,21 @@ function XViewSidebar({
663
663
  });
664
664
  return Array.from(typesSet).sort();
665
665
  }, [dbNodes]);
666
- const filteredTypes = (0, import_react2.useMemo)(() => {
667
- if (!filterValue.trim()) return availableTypes;
666
+ const availableDatasets = (0, import_react2.useMemo)(() => {
667
+ const datasetsSet = /* @__PURE__ */ new Set();
668
+ (dbNodes || []).forEach((node) => {
669
+ if (node.dataset_name) {
670
+ datasetsSet.add(node.dataset_name);
671
+ }
672
+ });
673
+ return Array.from(datasetsSet).sort();
674
+ }, [dbNodes]);
675
+ const filteredAutocompleteOptions = (0, import_react2.useMemo)(() => {
676
+ const source = filterCategory === "Dataset" ? availableDatasets : availableTypes;
677
+ if (!filterValue.trim()) return source;
668
678
  const search = filterValue.toLowerCase().trim();
669
- return availableTypes.filter((t) => t.toLowerCase().includes(search));
670
- }, [availableTypes, filterValue]);
679
+ return source.filter((item) => item.toLowerCase().includes(search));
680
+ }, [availableTypes, availableDatasets, filterValue, filterCategory]);
671
681
  const filteredAndSorted = (0, import_react2.useMemo)(() => {
672
682
  const base = Array.isArray(dbNodes) ? dbNodes : [];
673
683
  let pool = base;
@@ -687,6 +697,8 @@ function XViewSidebar({
687
697
  return nodeTypes.some((t) => String(t).toLowerCase() === String(filter.value).toLowerCase());
688
698
  } else if (filter.type === "Color") {
689
699
  return String(node.color).toLowerCase() === String(filter.value).toLowerCase();
700
+ } else if (filter.type === "Dataset") {
701
+ return String(node.dataset_name || "").toLowerCase() === String(filter.value).toLowerCase();
690
702
  }
691
703
  return true;
692
704
  });
@@ -702,7 +714,7 @@ function XViewSidebar({
702
714
  inView.sort(byName);
703
715
  const ordered = [...notInView, ...inView];
704
716
  return ordered.slice(0, 200);
705
- }, [dbNodes, query, isNodeInView, viewVersion, activeFilters]);
717
+ }, [dbNodes, query, isNodeInView, viewVersion, activeFilters, filterCategory]);
706
718
  (0, import_react2.useEffect)(() => {
707
719
  const handleClickOutside = (event) => {
708
720
  if (filterMenuRef.current && !filterMenuRef.current.contains(event.target)) {
@@ -777,15 +789,15 @@ function XViewSidebar({
777
789
  if (e.key === "ArrowDown") {
778
790
  e.preventDefault();
779
791
  setHighlightedTypeIndex(
780
- (prev) => prev < filteredTypes.length - 1 ? prev + 1 : prev
792
+ (prev) => prev < filteredAutocompleteOptions.length - 1 ? prev + 1 : prev
781
793
  );
782
794
  } else if (e.key === "ArrowUp") {
783
795
  e.preventDefault();
784
796
  setHighlightedTypeIndex((prev) => prev > 0 ? prev - 1 : 0);
785
797
  } else if (e.key === "Enter") {
786
798
  e.preventDefault();
787
- if (highlightedTypeIndex >= 0 && filteredTypes[highlightedTypeIndex]) {
788
- setFilterValue(filteredTypes[highlightedTypeIndex]);
799
+ if (highlightedTypeIndex >= 0 && filteredAutocompleteOptions[highlightedTypeIndex]) {
800
+ setFilterValue(filteredAutocompleteOptions[highlightedTypeIndex]);
789
801
  setIsTypeDropdownOpen(false);
790
802
  setHighlightedTypeIndex(-1);
791
803
  } else {
@@ -918,7 +930,7 @@ function XViewSidebar({
918
930
  },
919
931
  /* @__PURE__ */ import_react2.default.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }, /* @__PURE__ */ import_react2.default.createElement("polygon", { points: "22 3 2 3 10 12.46 10 19 14 21 14 12.46 22 3" })),
920
932
  "Filters"
921
- ), isFilterMenuOpen && /* @__PURE__ */ import_react2.default.createElement("div", { className: "absolute right-0 top-full mt-2 w-56 p-3 rounded-lg bg-slate-900 border border-white/10 shadow-xl z-50 flex flex-col gap-3 animate-in fade-in zoom-in-95 duration-100" }, /* @__PURE__ */ import_react2.default.createElement("div", { className: "space-y-1" }, /* @__PURE__ */ import_react2.default.createElement("label", { className: "text-[10px] uppercase text-slate-400 font-semibold tracking-wider" }, "Filtro"), /* @__PURE__ */ import_react2.default.createElement("div", { className: "flex bg-slate-800/50 p-1 rounded-md" }, ["Type", "Color"].map((opt) => /* @__PURE__ */ import_react2.default.createElement(
933
+ ), isFilterMenuOpen && /* @__PURE__ */ import_react2.default.createElement("div", { className: "absolute right-0 top-full mt-2 w-56 p-3 rounded-lg bg-slate-900 border border-white/10 shadow-xl z-50 flex flex-col gap-3 animate-in fade-in zoom-in-95 duration-100" }, /* @__PURE__ */ import_react2.default.createElement("div", { className: "space-y-1" }, /* @__PURE__ */ import_react2.default.createElement("label", { className: "text-[10px] uppercase text-slate-400 font-semibold tracking-wider" }, "Filtro"), /* @__PURE__ */ import_react2.default.createElement("div", { className: "flex bg-slate-800/50 p-1 rounded-md" }, ["Type", "Color", "Dataset"].map((opt) => /* @__PURE__ */ import_react2.default.createElement(
922
934
  "button",
923
935
  {
924
936
  key: opt,
@@ -929,7 +941,7 @@ function XViewSidebar({
929
941
  className: `flex-1 text-xs py-1 rounded transition-colors ${filterCategory === opt ? "bg-indigo-600 text-white shadow-sm" : "text-slate-400 hover:text-slate-200"}`
930
942
  },
931
943
  opt
932
- )))), /* @__PURE__ */ import_react2.default.createElement("div", { className: "space-y-1" }, /* @__PURE__ */ import_react2.default.createElement("label", { className: "text-[10px] uppercase text-slate-400 font-semibold tracking-wider" }, "Valor"), filterCategory === "Type" ? /* @__PURE__ */ import_react2.default.createElement("div", { className: "relative", ref: typeDropdownRef }, /* @__PURE__ */ import_react2.default.createElement(
944
+ )))), /* @__PURE__ */ import_react2.default.createElement("div", { className: "space-y-1" }, /* @__PURE__ */ import_react2.default.createElement("label", { className: "text-[10px] uppercase text-slate-400 font-semibold tracking-wider" }, "Valor"), filterCategory === "Type" || filterCategory === "Dataset" ? /* @__PURE__ */ import_react2.default.createElement("div", { className: "relative", ref: typeDropdownRef }, /* @__PURE__ */ import_react2.default.createElement(
933
945
  "input",
934
946
  {
935
947
  type: "text",
@@ -941,11 +953,11 @@ function XViewSidebar({
941
953
  },
942
954
  onFocus: () => setIsTypeDropdownOpen(true),
943
955
  onKeyDown: handleTypeKeyDown,
944
- placeholder: "Ex: Concept",
956
+ placeholder: filterCategory === "Type" ? "Ex: Concept" : "Ex: Dataset 1",
945
957
  className: "w-full bg-slate-800 p-2 text-xs rounded border border-white/10 focus:outline-none focus:border-indigo-500/50 text-white",
946
958
  autoFocus: true
947
959
  }
948
- ), isTypeDropdownOpen && filteredTypes.length > 0 && /* @__PURE__ */ import_react2.default.createElement("div", { className: "absolute z-[60] left-0 right-0 mt-1 max-h-48 overflow-y-auto bg-slate-900/95 backdrop-blur-xl border border-white/10 rounded-md shadow-2xl custom-scrollbar" }, filteredTypes.map((t, idx) => /* @__PURE__ */ import_react2.default.createElement(
960
+ ), isTypeDropdownOpen && filteredAutocompleteOptions.length > 0 && /* @__PURE__ */ import_react2.default.createElement("div", { className: "absolute z-[60] left-0 right-0 mt-1 max-h-48 overflow-y-auto bg-slate-900/95 backdrop-blur-xl border border-white/10 rounded-md shadow-2xl custom-scrollbar" }, filteredAutocompleteOptions.map((t, idx) => /* @__PURE__ */ import_react2.default.createElement(
949
961
  "div",
950
962
  {
951
963
  key: t,
@@ -14719,7 +14731,13 @@ function XViewScene({
14719
14731
  if (!parentDataRef.current) {
14720
14732
  return [];
14721
14733
  }
14722
- return Object.values(parentDataRef.current).flatMap((fileData) => fileData.nodes).filter((node) => {
14734
+ return Object.entries(parentDataRef.current).flatMap(([dbId, fileData]) => {
14735
+ const datasetName = fileData.dataset_name || `Dataset #${dbId.substring(0, 6)}`;
14736
+ return (fileData.nodes || []).map((node) => ({
14737
+ ...node,
14738
+ dataset_name: datasetName
14739
+ }));
14740
+ }).filter((node) => {
14723
14741
  var _a2;
14724
14742
  return !((_a2 = node.version_node) == null ? void 0 : _a2.is_version);
14725
14743
  });
package/dist/index.mjs CHANGED
@@ -624,11 +624,21 @@ function XViewSidebar({
624
624
  });
625
625
  return Array.from(typesSet).sort();
626
626
  }, [dbNodes]);
627
- const filteredTypes = useMemo2(() => {
628
- if (!filterValue.trim()) return availableTypes;
627
+ const availableDatasets = useMemo2(() => {
628
+ const datasetsSet = /* @__PURE__ */ new Set();
629
+ (dbNodes || []).forEach((node) => {
630
+ if (node.dataset_name) {
631
+ datasetsSet.add(node.dataset_name);
632
+ }
633
+ });
634
+ return Array.from(datasetsSet).sort();
635
+ }, [dbNodes]);
636
+ const filteredAutocompleteOptions = useMemo2(() => {
637
+ const source = filterCategory === "Dataset" ? availableDatasets : availableTypes;
638
+ if (!filterValue.trim()) return source;
629
639
  const search = filterValue.toLowerCase().trim();
630
- return availableTypes.filter((t) => t.toLowerCase().includes(search));
631
- }, [availableTypes, filterValue]);
640
+ return source.filter((item) => item.toLowerCase().includes(search));
641
+ }, [availableTypes, availableDatasets, filterValue, filterCategory]);
632
642
  const filteredAndSorted = useMemo2(() => {
633
643
  const base = Array.isArray(dbNodes) ? dbNodes : [];
634
644
  let pool = base;
@@ -648,6 +658,8 @@ function XViewSidebar({
648
658
  return nodeTypes.some((t) => String(t).toLowerCase() === String(filter.value).toLowerCase());
649
659
  } else if (filter.type === "Color") {
650
660
  return String(node.color).toLowerCase() === String(filter.value).toLowerCase();
661
+ } else if (filter.type === "Dataset") {
662
+ return String(node.dataset_name || "").toLowerCase() === String(filter.value).toLowerCase();
651
663
  }
652
664
  return true;
653
665
  });
@@ -663,7 +675,7 @@ function XViewSidebar({
663
675
  inView.sort(byName);
664
676
  const ordered = [...notInView, ...inView];
665
677
  return ordered.slice(0, 200);
666
- }, [dbNodes, query, isNodeInView, viewVersion, activeFilters]);
678
+ }, [dbNodes, query, isNodeInView, viewVersion, activeFilters, filterCategory]);
667
679
  useEffect2(() => {
668
680
  const handleClickOutside = (event) => {
669
681
  if (filterMenuRef.current && !filterMenuRef.current.contains(event.target)) {
@@ -738,15 +750,15 @@ function XViewSidebar({
738
750
  if (e.key === "ArrowDown") {
739
751
  e.preventDefault();
740
752
  setHighlightedTypeIndex(
741
- (prev) => prev < filteredTypes.length - 1 ? prev + 1 : prev
753
+ (prev) => prev < filteredAutocompleteOptions.length - 1 ? prev + 1 : prev
742
754
  );
743
755
  } else if (e.key === "ArrowUp") {
744
756
  e.preventDefault();
745
757
  setHighlightedTypeIndex((prev) => prev > 0 ? prev - 1 : 0);
746
758
  } else if (e.key === "Enter") {
747
759
  e.preventDefault();
748
- if (highlightedTypeIndex >= 0 && filteredTypes[highlightedTypeIndex]) {
749
- setFilterValue(filteredTypes[highlightedTypeIndex]);
760
+ if (highlightedTypeIndex >= 0 && filteredAutocompleteOptions[highlightedTypeIndex]) {
761
+ setFilterValue(filteredAutocompleteOptions[highlightedTypeIndex]);
750
762
  setIsTypeDropdownOpen(false);
751
763
  setHighlightedTypeIndex(-1);
752
764
  } else {
@@ -879,7 +891,7 @@ function XViewSidebar({
879
891
  },
880
892
  /* @__PURE__ */ React2.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }, /* @__PURE__ */ React2.createElement("polygon", { points: "22 3 2 3 10 12.46 10 19 14 21 14 12.46 22 3" })),
881
893
  "Filters"
882
- ), isFilterMenuOpen && /* @__PURE__ */ React2.createElement("div", { className: "absolute right-0 top-full mt-2 w-56 p-3 rounded-lg bg-slate-900 border border-white/10 shadow-xl z-50 flex flex-col gap-3 animate-in fade-in zoom-in-95 duration-100" }, /* @__PURE__ */ React2.createElement("div", { className: "space-y-1" }, /* @__PURE__ */ React2.createElement("label", { className: "text-[10px] uppercase text-slate-400 font-semibold tracking-wider" }, "Filtro"), /* @__PURE__ */ React2.createElement("div", { className: "flex bg-slate-800/50 p-1 rounded-md" }, ["Type", "Color"].map((opt) => /* @__PURE__ */ React2.createElement(
894
+ ), isFilterMenuOpen && /* @__PURE__ */ React2.createElement("div", { className: "absolute right-0 top-full mt-2 w-56 p-3 rounded-lg bg-slate-900 border border-white/10 shadow-xl z-50 flex flex-col gap-3 animate-in fade-in zoom-in-95 duration-100" }, /* @__PURE__ */ React2.createElement("div", { className: "space-y-1" }, /* @__PURE__ */ React2.createElement("label", { className: "text-[10px] uppercase text-slate-400 font-semibold tracking-wider" }, "Filtro"), /* @__PURE__ */ React2.createElement("div", { className: "flex bg-slate-800/50 p-1 rounded-md" }, ["Type", "Color", "Dataset"].map((opt) => /* @__PURE__ */ React2.createElement(
883
895
  "button",
884
896
  {
885
897
  key: opt,
@@ -890,7 +902,7 @@ function XViewSidebar({
890
902
  className: `flex-1 text-xs py-1 rounded transition-colors ${filterCategory === opt ? "bg-indigo-600 text-white shadow-sm" : "text-slate-400 hover:text-slate-200"}`
891
903
  },
892
904
  opt
893
- )))), /* @__PURE__ */ React2.createElement("div", { className: "space-y-1" }, /* @__PURE__ */ React2.createElement("label", { className: "text-[10px] uppercase text-slate-400 font-semibold tracking-wider" }, "Valor"), filterCategory === "Type" ? /* @__PURE__ */ React2.createElement("div", { className: "relative", ref: typeDropdownRef }, /* @__PURE__ */ React2.createElement(
905
+ )))), /* @__PURE__ */ React2.createElement("div", { className: "space-y-1" }, /* @__PURE__ */ React2.createElement("label", { className: "text-[10px] uppercase text-slate-400 font-semibold tracking-wider" }, "Valor"), filterCategory === "Type" || filterCategory === "Dataset" ? /* @__PURE__ */ React2.createElement("div", { className: "relative", ref: typeDropdownRef }, /* @__PURE__ */ React2.createElement(
894
906
  "input",
895
907
  {
896
908
  type: "text",
@@ -902,11 +914,11 @@ function XViewSidebar({
902
914
  },
903
915
  onFocus: () => setIsTypeDropdownOpen(true),
904
916
  onKeyDown: handleTypeKeyDown,
905
- placeholder: "Ex: Concept",
917
+ placeholder: filterCategory === "Type" ? "Ex: Concept" : "Ex: Dataset 1",
906
918
  className: "w-full bg-slate-800 p-2 text-xs rounded border border-white/10 focus:outline-none focus:border-indigo-500/50 text-white",
907
919
  autoFocus: true
908
920
  }
909
- ), isTypeDropdownOpen && filteredTypes.length > 0 && /* @__PURE__ */ React2.createElement("div", { className: "absolute z-[60] left-0 right-0 mt-1 max-h-48 overflow-y-auto bg-slate-900/95 backdrop-blur-xl border border-white/10 rounded-md shadow-2xl custom-scrollbar" }, filteredTypes.map((t, idx) => /* @__PURE__ */ React2.createElement(
921
+ ), isTypeDropdownOpen && filteredAutocompleteOptions.length > 0 && /* @__PURE__ */ React2.createElement("div", { className: "absolute z-[60] left-0 right-0 mt-1 max-h-48 overflow-y-auto bg-slate-900/95 backdrop-blur-xl border border-white/10 rounded-md shadow-2xl custom-scrollbar" }, filteredAutocompleteOptions.map((t, idx) => /* @__PURE__ */ React2.createElement(
910
922
  "div",
911
923
  {
912
924
  key: t,
@@ -14724,7 +14736,13 @@ function XViewScene({
14724
14736
  if (!parentDataRef.current) {
14725
14737
  return [];
14726
14738
  }
14727
- return Object.values(parentDataRef.current).flatMap((fileData) => fileData.nodes).filter((node) => {
14739
+ return Object.entries(parentDataRef.current).flatMap(([dbId, fileData]) => {
14740
+ const datasetName = fileData.dataset_name || `Dataset #${dbId.substring(0, 6)}`;
14741
+ return (fileData.nodes || []).map((node) => ({
14742
+ ...node,
14743
+ dataset_name: datasetName
14744
+ }));
14745
+ }).filter((node) => {
14728
14746
  var _a2;
14729
14747
  return !((_a2 = node.version_node) == null ? void 0 : _a2.is_version);
14730
14748
  });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@lv-x-software-house/x_view",
3
- "version": "1.2.5-dev.19",
3
+ "version": "1.2.5-dev.20",
4
4
  "description": "Pacote privado contendo os componentes e lógica de renderização 3D do X View.",
5
5
  "author": "iv.x - Engenharia de Software - ivxsoftwarehouse@gmail.com",
6
6
  "license": "UNLICENSED",