@databiosphere/findable-ui 29.0.2 → 31.0.0

package/.release-please-manifest.json

@@ -1,3 +1,3 @@
 {
-  ".": "29.0.2"
+  ".": "31.0.0"
 }

package/CHANGELOG.md

@@ -1,5 +1,40 @@
 # Changelog
 
+## [31.0.0](https://github.com/DataBiosphere/findable-ui/compare/v30.0.0...v31.0.0) (2025-05-15)
+
+
+### ⚠ BREAKING CHANGES
+
+* create data dictionary table cell for displaying markdown ([#453](https://github.com/DataBiosphere/findable-ui/issues/453)) (#480)
+* make data dictionary config generic with attribute as default ([#476](https://github.com/DataBiosphere/findable-ui/issues/476)) (#477)
+
+### Features
+
+* create data dictionary table cell for displaying markdown ([#453](https://github.com/DataBiosphere/findable-ui/issues/453)) ([#480](https://github.com/DataBiosphere/findable-ui/issues/480)) ([4ee16e7](https://github.com/DataBiosphere/findable-ui/commit/4ee16e75e66dd56d126ed01773364d6fe5a32ab7))
+* make data dictionary config generic with attribute as default ([#476](https://github.com/DataBiosphere/findable-ui/issues/476)) ([#477](https://github.com/DataBiosphere/findable-ui/issues/477)) ([723585d](https://github.com/DataBiosphere/findable-ui/commit/723585de6e6380eccd5d39f72cbc0aa6db1fc398))
+
+## [30.0.0](https://github.com/DataBiosphere/findable-ui/compare/v29.0.2...v30.0.0) (2025-05-13)
+
+
+### ⚠ BREAKING CHANGES
+
+* create table cell for displaying links ([#468](https://github.com/DataBiosphere/findable-ui/issues/468)) (#473)
+* create data dictionary chip ([#451](https://github.com/DataBiosphere/findable-ui/issues/451)) (#467)
+* implement filter range in category filters ([#440](https://github.com/DataBiosphere/findable-ui/issues/440)) (#458)
+
+### Features
+
+* create data dictionary chip ([#451](https://github.com/DataBiosphere/findable-ui/issues/451)) ([#467](https://github.com/DataBiosphere/findable-ui/issues/467)) ([f3fa731](https://github.com/DataBiosphere/findable-ui/commit/f3fa7315c4266e00f323a466a9d49ab2a8759697))
+* create table cell for displaying links ([#468](https://github.com/DataBiosphere/findable-ui/issues/468)) ([#473](https://github.com/DataBiosphere/findable-ui/issues/473)) ([ac13085](https://github.com/DataBiosphere/findable-ui/commit/ac130852f8dc8200407b2d4c640f6d2d8a871f1b))
+* implement filter range in category filters ([#440](https://github.com/DataBiosphere/findable-ui/issues/440)) ([#458](https://github.com/DataBiosphere/findable-ui/issues/458)) ([70644d1](https://github.com/DataBiosphere/findable-ui/commit/70644d12609e05551ec0d276630b9b8cd686edcf))
+* update data dictionary view to be full width ([#456](https://github.com/DataBiosphere/findable-ui/issues/456)) ([#465](https://github.com/DataBiosphere/findable-ui/issues/465)) ([16e98bd](https://github.com/DataBiosphere/findable-ui/commit/16e98bd9b9e9680bad532126cb760cc117d5690f))
+
+
+### Bug Fixes
+
+* fix data dictionary basiccell component to render boolean values as string ([#474](https://github.com/DataBiosphere/findable-ui/issues/474)) ([#475](https://github.com/DataBiosphere/findable-ui/issues/475)) ([d754d31](https://github.com/DataBiosphere/findable-ui/commit/d754d31929b09509e30e624edb9aae44b8114876))
+* update table chipcell component interface ([#471](https://github.com/DataBiosphere/findable-ui/issues/471)) ([#472](https://github.com/DataBiosphere/findable-ui/issues/472)) ([992a0f2](https://github.com/DataBiosphere/findable-ui/commit/992a0f24d6f08dcf3fbfab545bad47816f791e11))
+
 ## [29.0.2](https://github.com/DataBiosphere/findable-ui/compare/v29.0.1...v29.0.2) (2025-05-07)
 
 

package/lib/common/categories/config/types.d.ts

@@ -0,0 +1,28 @@
+import { CategoryKey, DataDictionaryAnnotation, SelectCategoryValueView } from "../../entities";
+import { RangeViewKind } from "../views/range/types";
+import { SelectViewKind } from "../views/select/types";
+/**
+ * Category config.
+ */
+export type CategoryConfig = RangeCategoryConfig | SelectCategoryConfig;
+/**
+ * Common category config.
+ */
+export interface CommonCategoryConfig {
+    annotation?: DataDictionaryAnnotation;
+    key: CategoryKey;
+    label: string;
+}
+/**
+ * Range category config.
+ */
+export interface RangeCategoryConfig extends CommonCategoryConfig, RangeViewKind {
+    unit?: string;
+}
+/**
+ * Select category config.
+ */
+export interface SelectCategoryConfig extends CommonCategoryConfig, SelectViewKind {
+    enableChartView?: boolean;
+    mapSelectCategoryValue?: (selectCategoryValue: SelectCategoryValueView) => SelectCategoryValueView;
+}

package/lib/common/categories/config/utils.d.ts

@@ -0,0 +1,31 @@
+import { Category } from "../models/types";
+import { VIEW_KIND } from "../views/types";
+import { CategoryConfig } from "./types";
+/**
+ * Returns the category config for the given category config key and view kind.
+ * @param viewKind - View kind.
+ * @param key - Category config key.
+ * @param configs - Category configs.
+ * @returns category config.
+ */
+export declare function findCategoryConfig<V extends VIEW_KIND>(viewKind: V, key: Category["key"], configs: CategoryConfig[]): Extract<CategoryConfig, {
+    viewKind: V;
+}> | undefined;
+/**
+ * Returns the range category config for the given category config key.
+ * @param key - Category config key.
+ * @param configs - Category configs.
+ * @returns category config.
+ */
+export declare function findRangeCategoryConfig(key: Category["key"], configs: CategoryConfig[]): Extract<CategoryConfig, {
+    viewKind: VIEW_KIND.RANGE;
+}> | undefined;
+/**
+ * Returns the select category config for the given category config key.
+ * @param key - Category config key.
+ * @param configs - Category configs.
+ * @returns category config.
+ */
+export declare function findSelectCategoryConfig(key: Category["key"], configs: CategoryConfig[]): Extract<CategoryConfig, {
+    viewKind?: VIEW_KIND.SELECT;
+}> | undefined;

package/lib/common/categories/config/utils.js

@@ -0,0 +1,29 @@
+import { VIEW_KIND } from "../views/types";
+/**
+ * Returns the category config for the given category config key and view kind.
+ * @param viewKind - View kind.
+ * @param key - Category config key.
+ * @param configs - Category configs.
+ * @returns category config.
+ */
+export function findCategoryConfig(viewKind, key, configs) {
+    return configs.find((c) => c.viewKind === viewKind && c.key === key);
+}
+/**
+ * Returns the range category config for the given category config key.
+ * @param key - Category config key.
+ * @param configs - Category configs.
+ * @returns category config.
+ */
+export function findRangeCategoryConfig(key, configs) {
+    return findCategoryConfig(VIEW_KIND.RANGE, key, configs);
+}
+/**
+ * Returns the select category config for the given category config key.
+ * @param key - Category config key.
+ * @param configs - Category configs.
+ * @returns category config.
+ */
+export function findSelectCategoryConfig(key, configs) {
+    return findCategoryConfig(VIEW_KIND.SELECT, key, configs);
+}

package/lib/common/categories/models/range/typeGuards.d.ts

@@ -0,0 +1,14 @@
+import { Category } from "../types";
+import { RangeCategory, SelectedRange } from "./types";
+/**
+ * Determine if category is a range category.
+ * @param category - Category to check if range category.
+ * @returns true if category is a range category.
+ */
+export declare function isRangeCategory(category: Category): category is RangeCategory;
+/**
+ * Determine if value is a selected range.
+ * @param value - Value to check if selected range.
+ * @returns true if value is a selected range.
+ */
+export declare function isSelectedRange(value: unknown): value is SelectedRange;

package/lib/common/categories/models/range/typeGuards.js

@@ -0,0 +1,18 @@
+/**
+ * Determine if category is a range category.
+ * @param category - Category to check if range category.
+ * @returns true if category is a range category.
+ */
+export function isRangeCategory(category) {
+    return "max" in category && "min" in category;
+}
+/**
+ * Determine if value is a selected range.
+ * @param value - Value to check if selected range.
+ * @returns true if value is a selected range.
+ */
+export function isSelectedRange(value) {
+    return (Array.isArray(value) &&
+        value.length === 2 &&
+        value.every((v) => v === null || typeof v === "number"));
+}

package/lib/common/categories/models/range/types.d.ts

@@ -0,0 +1,15 @@
+import { CategoryKey } from "../../../entities";
+/**
+ * Internal filter model of a range category.
+ */
+export interface RangeCategory {
+    key: CategoryKey;
+    max: number;
+    min: number;
+    selectedMax: SelectedRange[1];
+    selectedMin: SelectedRange[0];
+}
+/**
+ * Min and max values selected in range category.
+ */
+export type SelectedRange = [number | null, number | null];

package/lib/common/categories/models/range/types.js

@@ -0,0 +1 @@
+export {};

package/lib/common/categories/models/range/utils.d.ts

@@ -0,0 +1,23 @@
+import { CategoryValueKey, SelectedFilter } from "../../../entities";
+import { SelectedRange } from "./types";
+/**
+ * Asserts that the given value is a selected range.
+ * Throws an error if the value is not a selected range.
+ * @param value - Value to assert is a selected range.
+ */
+export declare function assertIsRange(value: unknown): asserts value is SelectedRange;
+/**
+ * Build the next filter state for the given range category.
+ * @param nextCategorySelectedFilter - Next filter state for the range category.
+ * @param selectedValue - Selected value for the range category.
+ * @param selected - Whether the category value is selected.
+ */
+export declare function buildNextRangeFilterState(nextCategorySelectedFilter: SelectedFilter, selectedValue: CategoryValueKey, selected: boolean): void;
+/**
+ * Get the selected values for the given category, if any.
+ * Handles type checking for selected range.
+ * Falls back to empty array if no selected values or invalid type (should never happen).
+ * @param categorySelectedFilter - Current filter state for a category.
+ * @returns The selected filter (i.e. the set of selected values) for the given category.
+ */
+export declare function getRangeSelectedValue(categorySelectedFilter?: SelectedFilter): SelectedRange;

package/lib/common/categories/models/range/utils.js

@@ -0,0 +1,41 @@
+import { isSelectedRange } from "./typeGuards";
+/**
+ * Asserts that the given value is a selected range.
+ * Throws an error if the value is not a selected range.
+ * @param value - Value to assert is a selected range.
+ */
+export function assertIsRange(value) {
+    if (!isSelectedRange(value)) {
+        throw new Error("Value is not SelectedRange");
+    }
+}
+/**
+ * Build the next filter state for the given range category.
+ * @param nextCategorySelectedFilter - Next filter state for the range category.
+ * @param selectedValue - Selected value for the range category.
+ * @param selected - Whether the category value is selected.
+ */
+export function buildNextRangeFilterState(nextCategorySelectedFilter, selectedValue, selected) {
+    if (selected) {
+        // Assert that the selected value is a range.
+        assertIsRange(selectedValue);
+        // Set the selected range.
+        nextCategorySelectedFilter.value = selectedValue;
+    }
+    else {
+        // Remove the selected range.
+        nextCategorySelectedFilter.value = [];
+    }
+}
+/**
+ * Get the selected values for the given category, if any.
+ * Handles type checking for selected range.
+ * Falls back to empty array if no selected values or invalid type (should never happen).
+ * @param categorySelectedFilter - Current filter state for a category.
+ * @returns The selected filter (i.e. the set of selected values) for the given category.
+ */
+export function getRangeSelectedValue(categorySelectedFilter) {
+    return isSelectedRange(categorySelectedFilter?.value)
+        ? categorySelectedFilter?.value
+        : [null, null];
+}

package/lib/common/categories/models/select/utils.d.ts

@@ -0,0 +1,8 @@
+import { CategoryValueKey, SelectedFilter } from "../../../entities";
+/**
+ * Build the next filter state for the given select category.
+ * @param nextCategorySelectedFilter - Next filter state for the select category.
+ * @param selectedValue - Selected value for the select category.
+ * @param selected - Whether the category value is selected.
+ */
+export declare function buildNextSelectFilterState(nextCategorySelectedFilter: SelectedFilter, selectedValue: CategoryValueKey, selected: boolean): void;

package/lib/common/categories/models/select/utils.js

@@ -0,0 +1,16 @@
+/**
+ * Build the next filter state for the given select category.
+ * @param nextCategorySelectedFilter - Next filter state for the select category.
+ * @param selectedValue - Selected value for the select category.
+ * @param selected - Whether the category value is selected.
+ */
+export function buildNextSelectFilterState(nextCategorySelectedFilter, selectedValue, selected) {
+    if (selected) {
+        // Set the selected value.
+        nextCategorySelectedFilter.value.push(selectedValue);
+    }
+    else {
+        // Remove the selected value from the selected set of values.
+        nextCategorySelectedFilter.value = nextCategorySelectedFilter.value.filter((value) => value !== selectedValue);
+    }
+}

package/lib/common/categories/models/types.d.ts

@@ -0,0 +1,6 @@
+import { SelectCategory } from "../../entities";
+import { RangeCategory } from "./range/types";
+/**
+ * Internal filter model of a category.
+ */
+export type Category = SelectCategory | RangeCategory;

package/lib/common/categories/models/types.js

@@ -0,0 +1 @@
+export {};

package/lib/common/categories/views/common/types.d.ts

@@ -0,0 +1,10 @@
+import { CategoryKey, DataDictionaryAnnotation } from "../../../entities";
+/**
+ * Common properties for category views.
+ */
+export interface BaseCategoryView {
+    annotation?: DataDictionaryAnnotation;
+    isDisabled?: boolean;
+    key: CategoryKey;
+    label: string;
+}

package/lib/common/categories/views/common/types.js

@@ -0,0 +1 @@
+export {};

package/lib/common/categories/views/range/typeGuards.d.ts

@@ -0,0 +1,8 @@
+import { CategoryView } from "../types";
+import { RangeCategoryView } from "./types";
+/**
+ * Returns true if the category view is a range category view.
+ * @param view - Category view.
+ * @returns true if the category view is a range category view.
+ */
+export declare function isRangeCategoryView(view: CategoryView): view is RangeCategoryView;

package/lib/common/categories/views/range/typeGuards.js

@@ -0,0 +1,8 @@
+/**
+ * Returns true if the category view is a range category view.
+ * @param view - Category view.
+ * @returns true if the category view is a range category view.
+ */
+export function isRangeCategoryView(view) {
+    return "max" in view && "min" in view;
+}

package/lib/common/categories/views/range/types.d.ts

@@ -0,0 +1,19 @@
+import { SelectedRange } from "../../models/range/types";
+import { BaseCategoryView } from "../common/types";
+import { VIEW_KIND } from "../types";
+/**
+ * View model of range category.
+ */
+export interface RangeCategoryView extends BaseCategoryView {
+    max: number;
+    min: number;
+    selectedMax: SelectedRange[1];
+    selectedMin: SelectedRange[0];
+    unit?: string;
+}
+/**
+ * Model of range category view kind.
+ */
+export interface RangeViewKind {
+    viewKind: VIEW_KIND.RANGE;
+}

package/lib/common/categories/views/range/types.js

@@ -0,0 +1 @@
+export {};

package/lib/common/categories/views/range/utils.d.ts

@@ -0,0 +1,12 @@
+import { SelectedFilter } from "../../../entities";
+import { CategoryConfig } from "../../config/types";
+import { RangeCategory } from "../../models/range/types";
+import { RangeCategoryView } from "../../views/range/types";
+/**
+ * Build the view-specific model of the given range category.
+ * @param category - The range category to build a view model of.
+ * @param categoryConfigs - Category configs indicating accept list as well as label configuration.
+ * @param categorySelectedFilter - Current filter state for a category.
+ * @returns Full built range category view, ready for display.
+ */
+export declare function buildRangeCategoryView(category: RangeCategory, categoryConfigs: CategoryConfig[], categorySelectedFilter?: SelectedFilter): RangeCategoryView;

package/lib/common/categories/views/range/utils.js

@@ -0,0 +1,24 @@
+import { findRangeCategoryConfig } from "../../config/utils";
+import { getRangeSelectedValue } from "../../models/range/utils";
+/**
+ * Build the view-specific model of the given range category.
+ * @param category - The range category to build a view model of.
+ * @param categoryConfigs - Category configs indicating accept list as well as label configuration.
+ * @param categorySelectedFilter - Current filter state for a category.
+ * @returns Full built range category view, ready for display.
+ */
+export function buildRangeCategoryView(category, categoryConfigs, categorySelectedFilter) {
+    const categoryConfig = findRangeCategoryConfig(category.key, categoryConfigs);
+    const [selectedMin, selectedMax] = getRangeSelectedValue(categorySelectedFilter);
+    return {
+        annotation: categoryConfig?.annotation,
+        isDisabled: false,
+        key: category.key,
+        label: categoryConfig?.label || category.key,
+        max: category.max,
+        min: category.min,
+        selectedMax,
+        selectedMin,
+        unit: categoryConfig?.unit,
+    };
+}

package/lib/common/categories/views/select/typeGuards.d.ts

@@ -0,0 +1,8 @@
+import { SelectCategoryView } from "../../../entities";
+import { CategoryView } from "../types";
+/**
+ * Returns true if the category view is a select category view.
+ * @param view - Category view.
+ * @returns true if the category view is a select category view.
+ */
+export declare function isSelectCategoryView(view: CategoryView): view is SelectCategoryView;

package/lib/common/categories/views/select/typeGuards.js

@@ -0,0 +1,8 @@
+/**
+ * Returns true if the category view is a select category view.
+ * @param view - Category view.
+ * @returns true if the category view is a select category view.
+ */
+export function isSelectCategoryView(view) {
+    return "values" in view;
+}

package/lib/common/categories/views/select/types.d.ts

@@ -0,0 +1,7 @@
+import { VIEW_KIND } from "../types";
+/**
+ * Model of select category view kind.
+ */
+export interface SelectViewKind {
+    viewKind?: VIEW_KIND.SELECT;
+}

package/lib/common/categories/views/select/types.js

@@ -0,0 +1 @@
+export {};

package/lib/common/categories/views/types.d.ts

@@ -0,0 +1,13 @@
+import { SelectCategoryView } from "../../entities";
+import { RangeCategoryView } from "./range/types";
+/**
+ * Possible category view model types.
+ */
+export type CategoryView = RangeCategoryView | SelectCategoryView;
+/**
+ * Category view kind.
+ */
+export declare enum VIEW_KIND {
+    RANGE = "RANGE",
+    SELECT = "SELECT"
+}

package/lib/common/categories/views/types.js

@@ -0,0 +1,8 @@
+/**
+ * Category view kind.
+ */
+export var VIEW_KIND;
+(function (VIEW_KIND) {
+    VIEW_KIND["RANGE"] = "RANGE";
+    VIEW_KIND["SELECT"] = "SELECT";
+})(VIEW_KIND || (VIEW_KIND = {}));

package/lib/common/entities.d.ts

@@ -1,4 +1,4 @@
-import { ColumnDef } from "@tanstack/react-table";
+import { ColumnDef, RowData } from "@tanstack/react-table";
 /**
  * Model of a value of a metadata class.
  */
@@ -16,10 +16,6 @@ export interface Attribute {
     title: string;
     values?: string;
 }
-/**
- * Model of attribute key types; used mostly when building data dictionary column definitions.
- */
-export type AttributeValueTypes = string | boolean;
 /**
  * Filterable metadata keys.
  */
@@ -35,8 +31,8 @@ export interface CategoryTag {
 /**
  * Model of a metadata class, to be specified manually or built from LinkML schema.
  */
-export interface Class {
-    attributes: Attribute[];
+export interface Class<T extends RowData = Attribute> {
+    attributes: T[];
     description: string;
     name: string;
     title: string;
@@ -53,34 +49,23 @@ export type DataDictionaryPrefix = Record<string, string>;
 /**
  * Model of a metadata dictionary containing a set of classes and their definitions.
  */
-export interface DataDictionary {
+export interface DataDictionary<T extends RowData = Attribute> {
     annotations?: {
         [key in keyof DataDictionaryPrefix]: string;
     };
-    classes: Class[];
+    classes: Class<T>[];
     description?: string;
     name: string;
     prefixes?: DataDictionaryPrefix;
     title: string;
 }
-/**
- * Display model of a data dictionary column.
- */
-export interface DataDictionaryColumnDef {
-    attributeDisplayName: string;
-    attributeSlotName: string;
-    width: {
-        max: string;
-        min: string;
-    };
-}
 /**
  * Configuration of data dictionary; contains schema definition (that is, the actual data
  * dictionary) as well as column def for displaying the data dictionary.
  */
-export interface DataDictionaryConfig {
-    columnDefs: ColumnDef<Attribute, AttributeValueTypes>[];
-    dataDictionary: DataDictionary;
+export interface DataDictionaryConfig<T extends RowData = Attribute> {
+    columnDefs: ColumnDef<T, T[keyof T]>[];
+    dataDictionary: DataDictionary<T>;
 }
 /**
  * Label and description values from a data dictionary that are added to a site

package/lib/components/DataDictionary/components/Entities/entities.d.ts

@@ -1,2 +1,4 @@
+import { RowData } from "@tanstack/react-table";
+import { Attribute } from "../../../../common/entities";
 import { ClassesProps } from "./types";
-export declare const Entities: ({ classes, columnDefs, spacing, }: ClassesProps) => JSX.Element;
+export declare const Entities: <T extends RowData = Attribute>({ classes, columnDefs, spacing, }: ClassesProps<T>) => JSX.Element;

package/lib/components/DataDictionary/components/Entities/entities.js

@@ -3,5 +3,5 @@ import React from "react";
 import { Entity } from "../Entity/entity";
 import { GRID_PROPS } from "./constants";
 export const Entities = ({ classes, columnDefs, spacing, }) => {
-    return (React.createElement(Grid, { ...GRID_PROPS }, classes.map((classData) => (React.createElement(Entity, { key: classData.name, class: classData, columnDefs: columnDefs, spacing: spacing })))));
+    return (React.createElement(Grid, { ...GRID_PROPS }, classes.map((cls) => (React.createElement(Entity, { key: cls.name, class: cls, columnDefs: columnDefs, spacing: spacing })))));
 };

package/lib/components/DataDictionary/components/Entities/types.d.ts

@@ -1,8 +1,8 @@
-import { ColumnDef } from "@tanstack/react-table";
-import { Attribute, AttributeValueTypes, Class } from "../../../../common/entities";
+import { ColumnDef, RowData } from "@tanstack/react-table";
+import { Attribute, Class } from "../../../../common/entities";
 import { LayoutSpacing } from "../../hooks/UseLayoutSpacing/types";
-export interface ClassesProps {
-    classes: Class[];
-    columnDefs: ColumnDef<Attribute, AttributeValueTypes>[];
+export interface ClassesProps<T extends RowData = Attribute> {
+    classes: Class<T>[];
+    columnDefs: ColumnDef<T, T[keyof T]>[];
     spacing?: LayoutSpacing;
 }

package/lib/components/DataDictionary/components/Entity/entity.d.ts

@@ -1,2 +1,4 @@
+import { RowData } from "@tanstack/react-table";
+import { Attribute } from "../../../../common/entities";
 import { EntityProps } from "./types";
-export declare const Entity: ({ class: classData, columnDefs, spacing, }: EntityProps) => JSX.Element;
+export declare const Entity: <T extends RowData = Attribute>({ class: cls, columnDefs, spacing, }: EntityProps<T>) => JSX.Element;

package/lib/components/DataDictionary/components/Entity/entity.js

@@ -6,14 +6,14 @@ import { useTable } from "../Table/hook";
 import { Table } from "../Table/table";
 import { GRID_PROPS } from "./constants";
 import { StyledTypography } from "./entity.styles";
-export const Entity = ({ class: classData, columnDefs, spacing, }) => {
-    const table = useTable(classData.attributes, columnDefs);
+export const Entity = ({ class: cls, columnDefs, spacing, }) => {
+    const table = useTable(cls.attributes, columnDefs);
     return (React.createElement(Grid, { ...GRID_PROPS, rowGap: 4 },
         React.createElement(Grid, { ...GRID_PROPS, rowGap: 1 },
-            React.createElement(StyledTypography, { component: "h3", id: classData.name, variant: TYPOGRAPHY_PROPS.VARIANT.TEXT_HEADING_SMALL, ...spacing },
-                classData.title,
+            React.createElement(StyledTypography, { component: "h3", id: cls.name, variant: TYPOGRAPHY_PROPS.VARIANT.TEXT_HEADING_SMALL, ...spacing },
+                cls.title,
                 " ",
-                React.createElement(AnchorLink, { anchorLink: classData.name })),
-            React.createElement(Typography, { color: TYPOGRAPHY_PROPS.COLOR.INK_LIGHT, component: "div", variant: TYPOGRAPHY_PROPS.VARIANT.TEXT_BODY_400_2_LINES }, classData.description)),
+                React.createElement(AnchorLink, { anchorLink: cls.name })),
+            React.createElement(Typography, { color: TYPOGRAPHY_PROPS.COLOR.INK_LIGHT, component: "div", variant: TYPOGRAPHY_PROPS.VARIANT.TEXT_BODY_400_2_LINES }, cls.description)),
         React.createElement(Table, { table: table })));
 };

package/lib/components/DataDictionary/components/Entity/types.d.ts

@@ -1,8 +1,8 @@
-import { ColumnDef } from "@tanstack/react-table";
-import { Attribute, AttributeValueTypes, Class } from "../../../../common/entities";
+import { ColumnDef, RowData } from "@tanstack/react-table";
+import { Attribute, Class } from "../../../../common/entities";
 import { LayoutSpacing } from "../../hooks/UseLayoutSpacing/types";
-export interface EntityProps {
-    class: Class;
-    columnDefs: ColumnDef<Attribute, AttributeValueTypes>[];
+export interface EntityProps<T extends RowData = Attribute> {
+    class: Class<T>;
+    columnDefs: ColumnDef<T, T[keyof T]>[];
     spacing?: LayoutSpacing;
 }

package/lib/components/DataDictionary/components/Outline/utils.d.ts

@@ -1,8 +1,9 @@
-import { Class } from "../../../../common/entities";
+import { RowData } from "@tanstack/react-table";
+import { Attribute, Class } from "../../../../common/entities";
 import { OutlineItem } from "../../../Layout/components/Outline/types";
 /**
  * Returns outline items from classes.
  * @param classes - Class entities.
  * @returns Outline items.
  */
-export declare function buildClassesOutline(classes: Class[]): OutlineItem[];
+export declare function buildClassesOutline<T extends RowData = Attribute>(classes: Class<T>[]): OutlineItem[];

package/lib/components/DataDictionary/components/Table/components/BasicCell/basicCell.d.ts

@@ -1,2 +1,3 @@
-import { BasicCellProps } from "./types";
-export declare const BasicCell: ({ getValue }: BasicCellProps) => JSX.Element;
+import { CellContext, RowData } from "@tanstack/react-table";
+import React, { ReactNode } from "react";
+export declare const BasicCell: <T extends RowData, TValue extends ReactNode = React.ReactNode>({ getValue, }: CellContext<T, TValue>) => JSX.Element | null;

package/lib/components/DataDictionary/components/Table/components/BasicCell/basicCell.js

@@ -1,6 +1,10 @@
 import { Typography } from "@mui/material";
 import React from "react";
 import { TYPOGRAPHY_PROPS } from "../../../../../../styles/common/mui/typography";
-export const BasicCell = ({ getValue }) => {
-    return (React.createElement(Typography, { variant: TYPOGRAPHY_PROPS.VARIANT.INHERIT }, getValue()));
+import { parseValue } from "./utils";
+export const BasicCell = ({ getValue, }) => {
+    const value = getValue();
+    if (value === undefined || value === null)
+        return null;
+    return (React.createElement(Typography, { variant: TYPOGRAPHY_PROPS.VARIANT.INHERIT }, parseValue(value)));
 };