@databiosphere/findable-ui 5.0.0 → 7.0.0

package/README.md

@@ -28,4 +28,8 @@
     - Run `npm link ../../findable-ui`, which will create a symlink in node_modules pointing
       to findable-ui.
     - If any packages are later installed or uninstalled, the symlink will need to be created again, which can be done
-      with the same command or by running `npm link @databiosphere/findable-ui`.
+      with the same command or by running `npm link @databiosphere/findable-ui`. 
+    - To successfully link to findable-ui, you may need to comment out the following packages from the `next.config.mjs` webpack configuration:
+      - `@tanstack/react-table`
+      - `axios`
+

package/lib/apis/azul/common/constants.js

@@ -1,13 +1,10 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.EXPORT_TO_TERRA_URL_PFB_FORMAT = exports.FILE_LOCATION_PENDING = exports.FILE_LOCATION_SUCCESSFULLY = exports.API_FILE_LOCATION_FETCH = void 0;
 /**
  * Path to add to file URL when requesting file location.
  */
-exports.API_FILE_LOCATION_FETCH = "fetch";
-exports.FILE_LOCATION_SUCCESSFULLY = 302;
-exports.FILE_LOCATION_PENDING = 301;
+export const API_FILE_LOCATION_FETCH = "fetch";
+export const FILE_LOCATION_SUCCESSFULLY = 302;
+export const FILE_LOCATION_PENDING = 301;
 /**
  * "format" request parameter value to include when generating a link to Terra for PFB.
  */
-exports.EXPORT_TO_TERRA_URL_PFB_FORMAT = "PFB";
+export const EXPORT_TO_TERRA_URL_PFB_FORMAT = "PFB";

package/lib/apis/azul/common/entities.js

@@ -1,32 +1,29 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.MANIFEST_DOWNLOAD_FORMAT = exports.LABEL = exports.AZUL_PARAM = exports.AZUL_FILTER_OPERATOR = exports.APIEndpoints = void 0;
 /**
  * Set of end point paths accepted by Azul.
  */
-var APIEndpoints;
+export var APIEndpoints;
 (function (APIEndpoints) {
     APIEndpoints["CATALOGS"] = "/index/catalogs";
     APIEndpoints["FETCH"] = "/fetch";
     APIEndpoints["FILES"] = "/files";
     APIEndpoints["INDEX_STATUS"] = "/health/progress";
     APIEndpoints["SUMMARY"] = "/summary";
-})(APIEndpoints = exports.APIEndpoints || (exports.APIEndpoints = {}));
+})(APIEndpoints || (APIEndpoints = {}));
 /**
  * Set of filter operators accepted by Azul.
  */
-var AZUL_FILTER_OPERATOR;
+export var AZUL_FILTER_OPERATOR;
 (function (AZUL_FILTER_OPERATOR) {
     AZUL_FILTER_OPERATOR["IS"] = "is";
-})(AZUL_FILTER_OPERATOR = exports.AZUL_FILTER_OPERATOR || (exports.AZUL_FILTER_OPERATOR = {}));
+})(AZUL_FILTER_OPERATOR || (AZUL_FILTER_OPERATOR = {}));
 /**
  * Set of valid request params accepted by Azul.
  */
-var AZUL_PARAM;
+export var AZUL_PARAM;
 (function (AZUL_PARAM) {
     AZUL_PARAM["CATALOG"] = "catalog";
     AZUL_PARAM["FILTERS"] = "filters";
-})(AZUL_PARAM = exports.AZUL_PARAM || (exports.AZUL_PARAM = {}));
+})(AZUL_PARAM || (AZUL_PARAM = {}));
 /**
  * Set of possible term types retured from Azul.
  */
@@ -37,17 +34,17 @@ var AZUL_TERM_TYPE;
 /**
  * Set of labels that values returned from Azul can be sanitized to.
  */
-var LABEL;
+export var LABEL;
 (function (LABEL) {
     LABEL["EMPTY"] = "";
     LABEL["ERROR"] = "Error";
     LABEL["NONE"] = "None";
     LABEL["UNSPECIFIED"] = "Unspecified";
-})(LABEL = exports.LABEL || (exports.LABEL = {}));
+})(LABEL || (LABEL = {}));
 /**
  * Set of possible manifest download formats.
  */
-var MANIFEST_DOWNLOAD_FORMAT;
+export var MANIFEST_DOWNLOAD_FORMAT;
 (function (MANIFEST_DOWNLOAD_FORMAT) {
     MANIFEST_DOWNLOAD_FORMAT["COMPACT"] = "compact";
     MANIFEST_DOWNLOAD_FORMAT["CURL"] = "curl";
@@ -55,4 +52,4 @@ var MANIFEST_DOWNLOAD_FORMAT;
     MANIFEST_DOWNLOAD_FORMAT["TERRA_BDBAG"] = "terra.bdbag";
     MANIFEST_DOWNLOAD_FORMAT["TERRA_PFB"] = "terra.pfb";
     MANIFEST_DOWNLOAD_FORMAT["VERBATIM_PFB"] = "verbatim.pfb";
-})(MANIFEST_DOWNLOAD_FORMAT = exports.MANIFEST_DOWNLOAD_FORMAT || (exports.MANIFEST_DOWNLOAD_FORMAT = {}));
+})(MANIFEST_DOWNLOAD_FORMAT || (MANIFEST_DOWNLOAD_FORMAT = {}));

package/lib/apis/azul/common/filterTransformer.js

@@ -1,8 +1,5 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.transformTermFacets = exports.transformAzulPagination = exports.transformFilters = void 0;
-const entities_1 = require("./entities");
-const utils_1 = require("./utils");
+import { AZUL_FILTER_OPERATOR, LABEL, } from "./entities";
+import { getFilterParameterValue } from "./utils";
 /**
  * Transform selected categories and category values to query string format.
  * Return JSON string (for example):
@@ -11,11 +8,11 @@ const utils_1 = require("./utils");
  * @param filters - Set of selected categories and cateogry values.
  * @returns Azul-specific filter query string param.
  */
-function transformFilters(filters) {
+export function transformFilters(filters) {
     // Build up filter from selected categories and category values.
     const params = filters.reduce((accum, { categoryKey, value }) => {
         // Only handling "is" operator for now.
-        const operator = entities_1.AZUL_FILTER_OPERATOR.IS;
+        const operator = AZUL_FILTER_OPERATOR.IS;
         // Add the category to the filter if not already added.
         if (!accum[categoryKey]) {
             accum[categoryKey] = {
@@ -23,13 +20,12 @@ function transformFilters(filters) {
             };
         }
         // Accumulate the category parameter values.
-        accum[categoryKey][operator].push(...value.map(utils_1.getFilterParameterValue));
+        accum[categoryKey][operator].push(...value.map(getFilterParameterValue));
         return accum;
     }, {});
     return JSON.stringify(params);
 }
-exports.transformFilters = transformFilters;
-function transformAzulPagination(azulPagination) {
+export function transformAzulPagination(azulPagination) {
     if (!azulPagination) {
         return {
             nextIndex: null,
@@ -47,7 +43,6 @@ function transformAzulPagination(azulPagination) {
         rows: azulPagination.total,
     };
 }
-exports.transformAzulPagination = transformAzulPagination;
 function extractIndex(type, urlString) {
     if (!urlString) {
         return null;
@@ -65,17 +60,15 @@ function extractIndex(type, urlString) {
  * @param filterState - Filter state.
  * @returns Categories and category values built from Azul term facets.
  */
-function transformTermFacets(termFacets, filterState) {
+export function transformTermFacets(termFacets, filterState) {
     const categories = [];
     // Build categories and category values from term facets.
     return Object.keys(termFacets).reduce((accum, key) => {
-        var _a;
         const termFacet = termFacets[key];
         // Build a set of filter state category values for the category.
-        const setOfFilterStateValues = new Set((_a = filterState.find(({ categoryKey }) => categoryKey === key)) === null || _a === void 0 ? void 0 : _a.value);
+        const setOfFilterStateValues = new Set(filterState.find(({ categoryKey }) => categoryKey === key)?.value);
         // Build category values from terms of term facet.
         const categoryValues = termFacet.terms.map((term) => {
-            var _a;
             if (setOfFilterStateValues.has(term.term)) {
                 // Delete the filter state category value; the term facet term equivalent will build the
                 // select category value.
@@ -84,7 +77,7 @@ function transformTermFacets(termFacets, filterState) {
             return {
                 count: term.count,
                 key: term.term,
-                label: (_a = term.term) !== null && _a !== void 0 ? _a : entities_1.LABEL.UNSPECIFIED,
+                label: term.term ?? LABEL.UNSPECIFIED,
                 selected: false, // Selected state updated in filter hook.
             };
         });
@@ -95,7 +88,7 @@ function transformTermFacets(termFacets, filterState) {
             categoryValues.push({
                 count: 0,
                 key: term,
-                label: term !== null && term !== void 0 ? term : entities_1.LABEL.UNSPECIFIED,
+                label: term ?? LABEL.UNSPECIFIED,
                 selected: false, // Selected state updated in filter hook
             });
         }
@@ -109,4 +102,3 @@ function transformTermFacets(termFacets, filterState) {
         return accum;
     }, categories);
 }
-exports.transformTermFacets = transformTermFacets;

package/lib/apis/azul/common/utils.js

@@ -1,12 +1,9 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.getFilterParameterValue = void 0;
 /**
  * Return the value to be used when building up query string filter value.
  * @param value - Filter value.
  * @returns filter parameter value.
  */
-function getFilterParameterValue(value) {
+export function getFilterParameterValue(value) {
     if (value === "Unspecified") {
         return null;
     }
@@ -18,4 +15,3 @@ function getFilterParameterValue(value) {
     }
     return value;
 }
-exports.getFilterParameterValue = getFilterParameterValue;

package/lib/common/analytics/analytics.js

@@ -1,24 +1,18 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.track = exports.getGTMId = exports.getDataLayer = void 0;
-const config_1 = require("../../config/config");
+import { getConfig } from "../../config/config";
 /**
  * Returns the GTM data layer for the environment, if enabled.
  * @returns google tag manager data layer.
  */
-function getDataLayer() {
+export function getDataLayer() {
     return window.dataLayer;
 }
-exports.getDataLayer = getDataLayer;
 /**
  * Returns GTM ID for the site.
  * @returns google tag manager id.
  */
-function getGTMId() {
-    var _a;
-    return (_a = (0, config_1.getConfig)().analytics) === null || _a === void 0 ? void 0 : _a.gtmId;
+export function getGTMId() {
+    return getConfig().analytics?.gtmId;
 }
-exports.getGTMId = getGTMId;
 /**
  * Returns true if a GTM data layer exists for the environment.
  * @returns true a GTM data layer exits for the environment.
@@ -31,11 +25,10 @@ function isTrackingEnabled() {
  * @param eventName - Event name.
  * @param params - Event params.
  */
-function track(eventName, params) {
+export function track(eventName, params) {
     if (!isTrackingEnabled()) {
         return;
     }
     const event = { event: eventName, params: params };
     getDataLayer().push(event);
 }
-exports.track = track;

package/lib/common/analytics/entities.js

@@ -1,21 +1,18 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.SORT_DIRECTION = exports.PAGINATION_DIRECTION = exports.EVENT_PARAM = exports.EVENT_NAME = void 0;
 /**
  * Set of analytics event actions.
  */
-var EVENT_NAME;
+export var EVENT_NAME;
 (function (EVENT_NAME) {
     EVENT_NAME["BULK_DOWNLOAD_REQUESTED"] = "bulk_download_requested";
     EVENT_NAME["ENTITY_SELECTED"] = "entity_selected";
     EVENT_NAME["ENTITY_TABLE_PAGINATED"] = "entity_table_paginated";
     EVENT_NAME["ENTITY_TABLE_SORTED"] = "entity_table_sorted";
     EVENT_NAME["FILTER_SELECTED"] = "filter_selected";
-})(EVENT_NAME = exports.EVENT_NAME || (exports.EVENT_NAME = {}));
+})(EVENT_NAME || (EVENT_NAME = {}));
 /**
  * Set of analytics event parameters.
  */
-var EVENT_PARAM;
+export var EVENT_PARAM;
 (function (EVENT_PARAM) {
     EVENT_PARAM["CATALOG"] = "catalog";
     EVENT_PARAM["COLUMN_NAME"] = "column_name";
@@ -28,20 +25,20 @@ var EVENT_PARAM;
     EVENT_PARAM["PAGINATION_DIRECTION"] = "pagination_direction";
     EVENT_PARAM["SORT_DIRECTION"] = "sort_direction";
     EVENT_PARAM["TOOL_NAME"] = "tool_name";
-})(EVENT_PARAM = exports.EVENT_PARAM || (exports.EVENT_PARAM = {}));
+})(EVENT_PARAM || (EVENT_PARAM = {}));
 /**
  * Set of analytics pagination direction values.
  */
-var PAGINATION_DIRECTION;
+export var PAGINATION_DIRECTION;
 (function (PAGINATION_DIRECTION) {
     PAGINATION_DIRECTION["NEXT"] = "next";
     PAGINATION_DIRECTION["PREV"] = "prev";
-})(PAGINATION_DIRECTION = exports.PAGINATION_DIRECTION || (exports.PAGINATION_DIRECTION = {}));
+})(PAGINATION_DIRECTION || (PAGINATION_DIRECTION = {}));
 /**
  * Set of analytics sort direction values.
  */
-var SORT_DIRECTION;
+export var SORT_DIRECTION;
 (function (SORT_DIRECTION) {
     SORT_DIRECTION["ASC"] = "asc";
     SORT_DIRECTION["DESC"] = "desc";
-})(SORT_DIRECTION = exports.SORT_DIRECTION || (exports.SORT_DIRECTION = {}));
+})(SORT_DIRECTION || (SORT_DIRECTION = {}));

package/lib/common/constants.js

@@ -1,10 +1,7 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.PARAMS_INDEX_TAB = exports.PARAMS_INDEX_UUID = exports.COLLATOR_CASE_INSENSITIVE = void 0;
 /**
  * Case insensitive sorter
  */
-exports.COLLATOR_CASE_INSENSITIVE = new Intl.Collator("en", {
+export const COLLATOR_CASE_INSENSITIVE = new Intl.Collator("en", {
     numeric: true,
     sensitivity: "base",
 });
@@ -14,5 +11,5 @@ exports.COLLATOR_CASE_INSENSITIVE = new Intl.Collator("en", {
  * - ExploreView 0 returns the current UUID
  * - ExploreView 1 returns the current tab
  */
-exports.PARAMS_INDEX_UUID = 0;
-exports.PARAMS_INDEX_TAB = 1;
+export const PARAMS_INDEX_UUID = 0;
+export const PARAMS_INDEX_TAB = 1;

package/lib/common/entities.js

@@ -1,12 +1,9 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ELEMENT_ALIGNMENT = void 0;
 /**
  * Element alignment.
  */
-var ELEMENT_ALIGNMENT;
+export var ELEMENT_ALIGNMENT;
 (function (ELEMENT_ALIGNMENT) {
     ELEMENT_ALIGNMENT["CENTER"] = "CENTER";
     ELEMENT_ALIGNMENT["LEFT"] = "LEFT";
     ELEMENT_ALIGNMENT["RIGHT"] = "RIGHT";
-})(ELEMENT_ALIGNMENT = exports.ELEMENT_ALIGNMENT || (exports.ELEMENT_ALIGNMENT = {}));
+})(ELEMENT_ALIGNMENT || (ELEMENT_ALIGNMENT = {}));

package/lib/common/selectors.js

@@ -1,5 +1,2 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.SIDEBAR_POSITIONER = exports.BODY = void 0;
-exports.BODY = "body";
-exports.SIDEBAR_POSITIONER = "sidebar-positioner";
+export const BODY = "body";
+export const SIDEBAR_POSITIONER = "sidebar-positioner";

package/lib/common/utils.js

@@ -1,12 +1,9 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.escapeRegExp = exports.stringifyValues = exports.isValidUrl = void 0;
 /**
  * Return true if url specified is valid.
  * @param testUrl - URL to check if valid.
  * @returns true when the url is valid.
  */
-function isValidUrl(testUrl) {
+export function isValidUrl(testUrl) {
     try {
         return Boolean(new URL(testUrl));
     }
@@ -14,22 +11,19 @@ function isValidUrl(testUrl) {
         return false;
     }
 }
-exports.isValidUrl = isValidUrl;
 /**
  * String-concatenates the specified list of values to a string value, joined by a comma ",".
  * @param values - List of values.
  * @returns the values in a string, each value joined by a comma.
  */
-function stringifyValues(values) {
+export function stringifyValues(values) {
     return values.join(", ");
 }
-exports.stringifyValues = stringifyValues;
 /**
  * Returns string with any special characters escaped.
  * @param string - String to escape.
  * @returns string with any special characters escaped.
  */
-function escapeRegExp(string) {
+export function escapeRegExp(string) {
     return string.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
 }
-exports.escapeRegExp = escapeRegExp;

package/lib/components/ComponentCreator/ComponentCreator.d.ts

@@ -1,8 +1,9 @@
 /// <reference types="react" />
-import { ComponentsConfig } from "../../config/entities";
+import { ComponentsConfig, ViewContext } from "../../config/entities";
 export interface ComponentCreatorProps<T> {
     components: ComponentsConfig;
     response: T;
+    viewContext?: Partial<ViewContext<T>>;
 }
 /**
  * ComponentCreator uses React API to create components based on the component configs, instead of using JSX.
@@ -11,6 +12,7 @@ export interface ComponentCreatorProps<T> {
  * @param componentCreatorProps - Custom props required for creating component.
  * @param componentCreatorProps.components - Component config to render as React elements.
  * @param componentCreatorProps.response - Response returned from API endpoint, used to populate component props.
+ * @param componentCreatorProps.viewContext - Additional context to pass to the component.
  * @returns A set of React components.
  */
-export declare const ComponentCreator: <T>({ components, response, }: ComponentCreatorProps<T>) => JSX.Element;
+export declare const ComponentCreator: <T>({ components, response, viewContext, }: ComponentCreatorProps<T>) => JSX.Element;

package/lib/components/ComponentCreator/ComponentCreator.js

@@ -1,15 +1,9 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ComponentCreator = void 0;
-const react_1 = __importDefault(require("react"));
-const useAuthentication_1 = require("../../hooks/useAuthentication/useAuthentication");
-const useConfig_1 = require("../../hooks/useConfig");
-const useExploreState_1 = require("../../hooks/useExploreState");
-const useFileManifestState_1 = require("../../hooks/useFileManifestState");
-const useSystemStatus_1 = require("../../hooks/useSystemStatus");
+import React from "react";
+import { useAuthentication } from "../../hooks/useAuthentication/useAuthentication";
+import { useConfig } from "../../hooks/useConfig";
+import { useExploreState } from "../../hooks/useExploreState";
+import { useFileManifestState } from "../../hooks/useFileManifestState";
+import { useSystemStatus } from "../../hooks/useSystemStatus";
 /**
  * ComponentCreator uses React API to create components based on the component configs, instead of using JSX.
  * That way we can continue to create UI components without having to worry about if they should be able to transform model data into props.
@@ -17,22 +11,24 @@ const useSystemStatus_1 = require("../../hooks/useSystemStatus");
  * @param componentCreatorProps - Custom props required for creating component.
  * @param componentCreatorProps.components - Component config to render as React elements.
  * @param componentCreatorProps.response - Response returned from API endpoint, used to populate component props.
+ * @param componentCreatorProps.viewContext - Additional context to pass to the component.
  * @returns A set of React components.
  */
-const ComponentCreator = ({ components, response, }) => {
-    const { authenticationStatus, isAuthenticated } = (0, useAuthentication_1.useAuthentication)();
-    const { config, entityConfig } = (0, useConfig_1.useConfig)();
-    const { exploreState } = (0, useExploreState_1.useExploreState)();
-    const { fileManifestState } = (0, useFileManifestState_1.useFileManifestState)();
-    const systemStatus = (0, useSystemStatus_1.useSystemStatus)();
+export const ComponentCreator = ({ components, response, viewContext, }) => {
+    const { authenticationStatus, isAuthenticated } = useAuthentication();
+    const { config, entityConfig } = useConfig();
+    const { exploreState } = useExploreState();
+    const { fileManifestState } = useFileManifestState();
+    const systemStatus = useSystemStatus();
     const componentsValue = typeof components === "function" ? components(config) : components;
-    return (react_1.default.createElement(react_1.default.Fragment, null, componentsValue.map((c, k) => {
+    return (React.createElement(React.Fragment, null, componentsValue.map((c, k) => {
         // Using uuid as the component's key causes the component to re-mount on re-render.
         // An interim solution is to use the array item's index as its key; however, this may lead to subtle bugs.
         // See issue https://github.com/clevercanary/data-explorer/issues/363.
-        const children = c.children ? (react_1.default.createElement(exports.ComponentCreator, { key: k, components: c.children, response: response })) : null;
+        const children = c.children ? (React.createElement(ComponentCreator, { key: k, components: c.children, response: response, viewContext: viewContext })) : null;
         const props = c.viewBuilder
             ? c.viewBuilder(response, {
+                ...viewContext,
                 authState: {
                     authenticationStatus,
                     isAuthenticated,
@@ -43,7 +39,6 @@ const ComponentCreator = ({ components, response, }) => {
                 systemStatus,
             })
             : {};
-        return react_1.default.createElement(c.component, Object.assign(Object.assign(Object.assign({}, c.props), props), { key: k }), [children !== null && children !== void 0 ? children : props.children]);
+        return React.createElement(c.component, { ...c.props, ...props, key: k }, [children ?? props.children]);
     })));
 };
-exports.ComponentCreator = ComponentCreator;

package/lib/components/ComponentCreator/components/ConditionalComponent/conditionalComponent.js

@@ -1,11 +1,4 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
+import React from "react";
+export const ConditionalComponent = ({ children, isIn, }) => {
+    return isIn ? React.createElement(React.Fragment, null, children) : null;
 };
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ConditionalComponent = void 0;
-const react_1 = __importDefault(require("react"));
-const ConditionalComponent = ({ children, isIn, }) => {
-    return isIn ? react_1.default.createElement(react_1.default.Fragment, null, children) : null;
-};
-exports.ConditionalComponent = ConditionalComponent;

package/lib/components/ComponentCreator/components/RenderComponent/renderComponent.js

@@ -1,24 +1,5 @@
-"use strict";
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
+import React from "react";
+import { v4 as uuid4 } from "uuid";
+export const RenderComponent = ({ Component, ...props }) => {
+    return React.createElement(Component, { key: uuid4, ...props });
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.RenderComponent = void 0;
-const react_1 = __importDefault(require("react"));
-const uuid_1 = require("uuid");
-const RenderComponent = (_a) => {
-    var { Component } = _a, props = __rest(_a, ["Component"]);
-    return react_1.default.createElement(Component, Object.assign({ key: uuid_1.v4 }, props));
-};
-exports.RenderComponent = RenderComponent;

package/lib/components/Detail/components/AccessibilityBadge/accessibilityBadge.js

@@ -1,18 +1,11 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.AccessibilityBadge = void 0;
-const material_1 = require("@mui/material");
-const react_1 = __importDefault(require("react"));
-const statusBadge_1 = require("../../../common/StatusBadge/statusBadge");
+import { Fade as MFade, } from "@mui/material";
+import React from "react";
+import { StatusBadge } from "../../../common/StatusBadge/statusBadge";
 const DEFAULT_FADE_PROPS = {
     appear: false,
     in: true,
 };
-const AccessibilityBadge = ({ badgeProps, className, fadeProps = DEFAULT_FADE_PROPS, }) => {
-    return (react_1.default.createElement(material_1.Fade, Object.assign({}, fadeProps),
-        react_1.default.createElement(statusBadge_1.StatusBadge, Object.assign({ className: className }, badgeProps))));
+export const AccessibilityBadge = ({ badgeProps, className, fadeProps = DEFAULT_FADE_PROPS, }) => {
+    return (React.createElement(MFade, { ...fadeProps },
+        React.createElement(StatusBadge, { className: className, ...badgeProps })));
 };
-exports.AccessibilityBadge = AccessibilityBadge;

package/lib/components/Detail/components/DetailViewTable/detailViewTable.d.ts

@@ -1,8 +1,8 @@
-import { ColumnDef } from "@tanstack/react-table";
+import { ColumnDef, RowData } from "@tanstack/react-table";
 import { ReactNode } from "react";
 import { FlatPaper, FluidPaper, RoundedPaper } from "../../../common/Paper/paper.styles";
 import { TableProps } from "../Table/table";
-interface DetailViewTableProps<T extends object> extends TableProps<T> {
+interface DetailViewTableProps<T extends RowData> extends TableProps<T> {
     className?: string;
     columns: ColumnDef<T>[];
     gridTemplateColumns: string;
@@ -11,5 +11,5 @@ interface DetailViewTableProps<T extends object> extends TableProps<T> {
     Paper?: typeof FlatPaper | typeof FluidPaper | typeof RoundedPaper;
     tools?: ReactNode;
 }
-export declare const DetailViewTable: <T extends object>({ className, columns, gridTemplateColumns, items, noResultsTitle, Paper, tools, ...tableProps }: DetailViewTableProps<T>) => JSX.Element;
+export declare const DetailViewTable: <T extends unknown>({ className, columns, gridTemplateColumns, items, noResultsTitle, Paper, tools, ...tableProps }: DetailViewTableProps<T>) => JSX.Element;
 export {};

package/lib/components/Detail/components/DetailViewTable/detailViewTable.js

@@ -1,30 +1,11 @@
-"use strict";
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
+import React from "react";
+import { GridPaper, RoundedPaper, } from "../../../common/Paper/paper.styles";
+import { NoResults } from "../../../NoResults/noResults";
+import { Toolbar } from "../../../Table/components/TableToolbar/tableToolbar.styles";
+import { Table } from "../Table/table";
+export const DetailViewTable = ({ className, columns, gridTemplateColumns, items, noResultsTitle, Paper = RoundedPaper, tools, ...tableProps }) => {
+    return items.length > 0 ? (React.createElement(Paper, { className: className, variant: "table" },
+        React.createElement(GridPaper, null,
+            tools && React.createElement(Toolbar, { variant: "table" }, tools),
+            React.createElement(Table, { columns: columns, gridTemplateColumns: gridTemplateColumns, items: items, ...tableProps })))) : (React.createElement(NoResults, { Paper: Paper, title: noResultsTitle }));
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.DetailViewTable = void 0;
-const react_1 = __importDefault(require("react"));
-const paper_styles_1 = require("../../../common/Paper/paper.styles");
-const noResults_1 = require("../../../NoResults/noResults");
-const tableToolbar_styles_1 = require("../../../Table/components/TableToolbar/tableToolbar.styles");
-const table_1 = require("../Table/table");
-const DetailViewTable = (_a) => {
-    var { className, columns, gridTemplateColumns, items, noResultsTitle, Paper = paper_styles_1.RoundedPaper, tools } = _a, tableProps = __rest(_a, ["className", "columns", "gridTemplateColumns", "items", "noResultsTitle", "Paper", "tools"]);
-    return items.length > 0 ? (react_1.default.createElement(Paper, { className: className },
-        react_1.default.createElement(paper_styles_1.GridPaper, null,
-            tools && react_1.default.createElement(tableToolbar_styles_1.Toolbar, { variant: "table" }, tools),
-            react_1.default.createElement(table_1.Table, Object.assign({ columns: columns, gridTemplateColumns: gridTemplateColumns, items: items }, tableProps))))) : (react_1.default.createElement(noResults_1.NoResults, { Paper: Paper, title: noResultsTitle }));
-};
-exports.DetailViewTable = DetailViewTable;

package/lib/components/Detail/components/Table/common/utils.d.ts

@@ -1,7 +1,7 @@
-import { ColumnDef } from "@tanstack/react-table";
+import { ColumnDef, RowData } from "@tanstack/react-table";
 /**
  * Generates columns from column definitions with meta associated with the column.
  * @param columns - Column configuration.
  * @returns generated column definitions.
  */
-export declare function generateColumnDefinitions<T>(columns: ColumnDef<T>[]): ColumnDef<T>[];
+export declare function generateColumnDefinitions<T extends RowData>(columns: ColumnDef<T>[]): ColumnDef<T>[];

package/lib/components/Detail/components/Table/common/utils.js

@@ -1,15 +1,16 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.generateColumnDefinitions = void 0;
 /**
  * Generates columns from column definitions with meta associated with the column.
  * @param columns - Column configuration.
  * @returns generated column definitions.
  */
-function generateColumnDefinitions(columns) {
+export function generateColumnDefinitions(columns) {
     return columns.map((column) => {
-        var _a;
-        return Object.assign(Object.assign({}, column), { meta: Object.assign(Object.assign({}, column.meta), { header: ((_a = column.meta) === null || _a === void 0 ? void 0 : _a.header) || column.header }) });
+        return {
+            ...column,
+            meta: {
+                ...column.meta,
+                header: column.meta?.header || column.header,
+            },
+        };
     });
 }
-exports.generateColumnDefinitions = generateColumnDefinitions;