dotdata_widgets 0.1.4 → 0.1.6

package/lib/feature-descriptor/domains-descriptions-tree/models/index.js

@@ -0,0 +1,18 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./domains-descriptions-tree.model"), exports);
+//# sourceMappingURL=index.js.map

package/lib/feature-descriptor/domains-descriptions-tree/utils/create-domain-predicate.js

@@ -0,0 +1,16 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createDomainPredicate = void 0;
+function createDomainPredicate(selectedDomains, selectedJoinIds) {
+    const joinIds = new Set(selectedJoinIds);
+    const domainIds = Object.values(selectedDomains).flatMap(d => d.filter(({ joinId }) => (joinIds.size ? joinIds.has(joinId) : true)));
+    return (description) => {
+        return domainIds.length
+            ? description.domains.some(x => domainIds.find(({ domainIdx, joinId }) => x.joinId === joinId && x.domainIdx === domainIdx))
+            : joinIds.size
+                ? description.domains.some(({ joinId }) => joinIds.has(joinId))
+                : true;
+    };
+}
+exports.createDomainPredicate = createDomainPredicate;
+//# sourceMappingURL=create-domain-predicate.js.map

package/lib/feature-descriptor/domains-descriptions-tree/utils/filter-domains-descriptions-tree.js

@@ -0,0 +1,23 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.filterDomainsDescriptionsTree = void 0;
+const isNotEmpty = (arr) => arr.length > 0;
+function filterDomainsDescriptionsTree(domains, predicateFn) {
+    return {
+        types: domains.types
+            .map(({ summary, columns, nodeId }) => ({
+            summary,
+            nodeId,
+            columns: columns
+                .map(column => ({
+                summary: column.summary,
+                nodeId: column.nodeId,
+                descriptions: column.descriptions.filter(predicateFn),
+            }))
+                .filter(({ descriptions }) => isNotEmpty(descriptions)),
+        }))
+            .filter(({ columns }) => isNotEmpty(columns)),
+    };
+}
+exports.filterDomainsDescriptionsTree = filterDomainsDescriptionsTree;
+//# sourceMappingURL=filter-domains-descriptions-tree.js.map

package/lib/feature-descriptor/domains-descriptions-tree/utils/index.js

@@ -0,0 +1,19 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./filter-domains-descriptions-tree"), exports);
+__exportStar(require("./create-domain-predicate"), exports);
+//# sourceMappingURL=index.js.map

package/lib/feature-descriptor/domains-descriptors-tree/config/index.js

@@ -0,0 +1,2 @@
+"use strict";
+//# sourceMappingURL=index.js.map

package/lib/feature-descriptor/domains-descriptors-tree/context/domains-descriptions-tree-config-context.js

@@ -0,0 +1,43 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DomainsDescriptionsTreeConfigContextProvider = exports.useDomainsDescriptionsTreeConfig = exports.DomainsDescriptionsTreeConfigContext = void 0;
+const React = __importStar(require("react"));
+exports.DomainsDescriptionsTreeConfigContext = React.createContext({
+    isSelectable: true,
+});
+function useDomainsDescriptionsTreeConfig() {
+    const context = React.useContext(exports.DomainsDescriptionsTreeConfigContext);
+    if (context === undefined) {
+        throw new Error('useDomainsDescriptionsTreeConfig must be used within a DomainsDescriptionsTreeConfigContext');
+    }
+    return context;
+}
+exports.useDomainsDescriptionsTreeConfig = useDomainsDescriptionsTreeConfig;
+function DomainsDescriptionsTreeConfigContextProvider(props) {
+    return (React.createElement(exports.DomainsDescriptionsTreeConfigContext.Provider, { value: props.configuration, ...props }));
+}
+exports.DomainsDescriptionsTreeConfigContextProvider = DomainsDescriptionsTreeConfigContextProvider;
+//# sourceMappingURL=domains-descriptions-tree-config-context.js.map

package/lib/feature-descriptor/domains-descriptors-tree/context/domains-descriptions-tree-context-provider.js

@@ -0,0 +1,53 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DomainsDescriptionsTreeItemSelectionContextProvider = void 0;
+const React = __importStar(require("react"));
+const _utils_1 = require("../../../utils");
+const lodash_1 = require("lodash");
+const domains_descriptions_tree_item_selection_context_1 = require("./domains-descriptions-tree-item-selection-context");
+const domains_descriptions_tree_config_context_1 = require("./domains-descriptions-tree-config-context");
+function DomainsDescriptionsTreeItemSelectionContextProvider(
+// props: React.PropsWithChildren<Record<'selectedJoinIds', JoinDescriptionId[]>>
+props) {
+    const { configuration, ...restProps } = props;
+    const [selectedTreeItems, setSelectedTreeItems] = React.useState(() => ({}));
+    function toggleTreeItemSelection(nodeId, domains) {
+        if ((0, _utils_1.isSet)(selectedTreeItems[nodeId])) {
+            const { [nodeId]: _remove, ...rest } = selectedTreeItems;
+            setSelectedTreeItems(rest);
+        }
+        else {
+            setSelectedTreeItems({
+                ...selectedTreeItems,
+                [nodeId]: (0, lodash_1.uniqBy)(domains, JSON.stringify),
+            });
+        }
+    }
+    return (React.createElement(domains_descriptions_tree_config_context_1.DomainsDescriptionsTreeConfigContext.Provider, { value: configuration },
+        React.createElement(domains_descriptions_tree_item_selection_context_1.DomainsDescriptionsTreeItemSelectionContext.Provider, { value: [selectedTreeItems, { toggleTreeItemSelection }], ...restProps })));
+}
+exports.DomainsDescriptionsTreeItemSelectionContextProvider = DomainsDescriptionsTreeItemSelectionContextProvider;
+//# sourceMappingURL=domains-descriptions-tree-context-provider.js.map

package/lib/feature-descriptor/domains-descriptors-tree/context/index.js

@@ -15,4 +15,5 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 __exportStar(require("./domains-descriptions-tree-item-selection-context"), exports);
+__exportStar(require("./domains-descriptions-tree-config-context"), exports);
 //# sourceMappingURL=index.js.map

package/lib/models/column/field.js

@@ -0,0 +1,3 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+//# sourceMappingURL=field.js.map

package/lib/models/feature-descriptor/fd_data/aggregation.js

@@ -0,0 +1,42 @@
+"use strict";
+// import { ColumnName } from '../../column';
+// // export interface AbsoluteTemporalChangeCountRecords {}
+//
+// export type Aggregation = AbsoluteTemporalChangeCountRecords;
+//
+// interface TemporalChange {
+//
+// }
+//
+// export interface AbsoluteTemporalChangeCountRecords {
+//   source_time_column: ColumnName;
+//   targetTimeColumn: ColumnName;
+//   upperBound: string;
+//   lowerBound: string;
+//   rangeShift: string;
+// }
+//
+// export interface AbsoluteTemporalChangeMax {
+//   sourceTimeColumn: ColumnName;
+//   targetTimeColumn: ColumnName;
+//   upperBound: string;
+//   lowerBound: string;
+//   sourceColumn: string;
+//   rangeShift: string;
+// }
+//
+// export interface AbsoluteTemporalChangeMean extends AbsoluteTemporalChange {
+//   source_column: string;
+//   range_shift: string;
+// }
+//
+// export interface AbsoluteTemporalChangeMin extends AbsoluteTemporalChange {
+//   source_column: string;
+//   range_shift: string;
+// }
+//
+// export interface AbsoluteTemporalChangeSum extends AbsoluteTemporalChange {
+//   source_column: string;
+//   range_shift: string;
+// }
+//# sourceMappingURL=aggregation.js.map

package/lib/models/feature-descriptor/fd_data/filter.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Filter = void 0;
+class Filter {
+}
+exports.Filter = Filter;
+//# sourceMappingURL=filter.js.map

package/lib/models/feature-descriptor/feature-descriptor.js

@@ -1,3 +1,11 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
+// import { Aggregation } from './fd_data/aggregation';
+// import { Filter } from './fd_data/filter';
+//
+// export interface FeatureDescriptor {
+//   name: string;
+//   join: any;
+//   filter: Filter;
+//   aggregation: Aggregation;
+// }
 //# sourceMappingURL=feature-descriptor.js.map

package/lib/models/feature-descriptor/index.js

@@ -0,0 +1,2 @@
+"use strict";
+//# sourceMappingURL=index.js.map

package/lib/models/feature-descriptor-domain/fd-domains-description.js

@@ -1,3 +1,15 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.DomainsDescriptionId = void 0;
+var DomainsDescriptionId;
+(function (DomainsDescriptionId) {
+    function toString(id) {
+        return `${id.joinId}_${id.domainIdx}_${id.opIdx}`;
+    }
+    DomainsDescriptionId.toString = toString;
+    function listToMap(list) {
+        return new Map(list.map(el => [DomainsDescriptionId.toString(el), el]));
+    }
+    DomainsDescriptionId.listToMap = listToMap;
+})(DomainsDescriptionId = exports.DomainsDescriptionId || (exports.DomainsDescriptionId = {}));
 //# sourceMappingURL=fd-domains-description.js.map

package/lib/utils/transducer.js

@@ -0,0 +1,16 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.filter = exports.map = exports.compose = void 0;
+function compose(...fns) {
+    return (x) => fns.reduce((y, f) => f(y), x);
+}
+exports.compose = compose;
+function map(transformFn) {
+    return (step) => (a, c) => step(a, transformFn(c));
+}
+exports.map = map;
+function filter(predicate) {
+    return (step) => (a, c) => predicate(c) ? step(a, c) : a;
+}
+exports.filter = filter;
+//# sourceMappingURL=transducer.js.map

package/lib/widgets/FeatureSpaceWidget.js

@@ -18,8 +18,9 @@ const defaultState = {
         filters: { types: [] },
         aggregations: { types: [] },
     },
-    selected_filters: [],
-    selected_aggregations: [],
+    _selected_filters: [],
+    _selected_aggregations: [],
+    configuration: { selectable: true },
 };
 class FeatureSpaceWidgetModel extends base_1.DOMWidgetModel {
     defaults() {

package/lib/widgets/feature-leaderboard/FeatureLeaderboardOverview.js

@@ -6,12 +6,20 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.FeatureLeaderboardOverview = void 0;
 const react_1 = __importDefault(require("react"));
 const overview_slider_1 = require("./leaderboard-overview/overview-slider");
+const material_1 = require("@mui/material");
 const MAX_COLLINEARITY_TOOLTIP = 'Maximum correlation of any two features on the list';
 const CONFIDENCE_TOOLTIP = 'The probability that a feature is better than a random feature';
-const FeatureLeaderboardOverview = ({ confidence, setConfidence, maxCollinearity, setMaxCollinearity }) => {
-    return (react_1.default.createElement("div", null,
-        react_1.default.createElement(overview_slider_1.OverviewSlider, { value: maxCollinearity, setValue: setMaxCollinearity, label: "Max collinearity:", labelTooltip: MAX_COLLINEARITY_TOOLTIP }),
-        react_1.default.createElement(overview_slider_1.OverviewSlider, { value: confidence, setValue: setConfidence, label: "Confidence:", labelTooltip: CONFIDENCE_TOOLTIP })));
+const FeatureLeaderboardOverview = ({ isAssessed, confidence, setConfidence, maxCollinearity, setMaxCollinearity, setSearch, }) => {
+    const [searchPhrase, setSearchPhrase] = react_1.default.useState(() => '');
+    return (react_1.default.createElement("div", { style: { display: 'flex' } },
+        isAssessed ? (react_1.default.createElement(react_1.default.Fragment, null,
+            react_1.default.createElement(overview_slider_1.OverviewSlider, { value: maxCollinearity, setValue: setMaxCollinearity, label: "Max collinearity:", labelTooltip: MAX_COLLINEARITY_TOOLTIP }),
+            react_1.default.createElement(overview_slider_1.OverviewSlider, { value: confidence, setValue: setConfidence, label: "Confidence:", labelTooltip: CONFIDENCE_TOOLTIP }))) : null,
+        react_1.default.createElement("span", { style: { marginLeft: 'auto' } },
+            react_1.default.createElement(material_1.TextField, { sx: { top: '-8px' }, size: "small", label: "Search", type: "search", variant: "standard", margin: "dense", value: searchPhrase, onChange: e => {
+                    setSearchPhrase(e.target.value);
+                    setSearch(e.target.value);
+                } }))));
 };
 exports.FeatureLeaderboardOverview = FeatureLeaderboardOverview;
 //# sourceMappingURL=FeatureLeaderboardOverview.js.map

package/lib/widgets/feature-leaderboard/FeatureLeaderboardView.js

@@ -6,30 +6,39 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.FeatureLeaderboardView = void 0;
 const react_1 = __importDefault(require("react"));
 const widget_model_1 = require("../../utils/widget-model");
+const transducer_1 = require("../../utils/transducer");
+const _utils_1 = require("../../utils");
 const FeatureLeaderboardOverview_1 = require("./FeatureLeaderboardOverview");
 const FeatureLeaderboardEntry_1 = require("./leaderboard-entry/FeatureLeaderboardEntry");
 const FeatureLeaderboardEntryRow_1 = require("./leaderboard-entry/FeatureLeaderboardEntryRow");
 const FeatureLeaderboardView = ({ model }) => {
     const [featureLeaderboard] = (0, widget_model_1.useModelState)('value');
+    const isAssessed = (0, _utils_1.isNotSet)(featureLeaderboard.isAssessed) || featureLeaderboard.isAssessed;
     const [confidence, setConfidence] = (0, widget_model_1.useModelState)('confidence');
     const [maxCollinearity, setMaxCollinearity] = (0, widget_model_1.useModelState)('max_collinearity');
-    const featureEntries = react_1.default.useMemo(() => filterFeatures(featureLeaderboard, maxCollinearity, confidence), [maxCollinearity, confidence, featureLeaderboard]);
+    const [explanationSearch, setExplanationSearch] = react_1.default.useState(() => '');
+    const featureEntries = react_1.default.useMemo(() => filterFeatures(featureLeaderboard, maxCollinearity, confidence, explanationSearch, isAssessed), [maxCollinearity, confidence, explanationSearch, featureLeaderboard]);
     return (react_1.default.createElement(react_1.default.Fragment, null,
         react_1.default.createElement("h2", { className: "grey-label" }, "Feature Pipeline Overview:"),
-        react_1.default.createElement(FeatureLeaderboardOverview_1.FeatureLeaderboardOverview, { confidence: confidence, setConfidence: setConfidence, maxCollinearity: maxCollinearity, setMaxCollinearity: setMaxCollinearity }),
+        react_1.default.createElement(FeatureLeaderboardOverview_1.FeatureLeaderboardOverview, { isAssessed: isAssessed, confidence: confidence, setConfidence: setConfidence, maxCollinearity: maxCollinearity, setMaxCollinearity: setMaxCollinearity, setSearch: setExplanationSearch }),
         react_1.default.createElement("br", null),
-        featureLeaderboard.isAssessed
+        react_1.default.createElement("div", { style: { display: 'inline-block', minWidth: '100%' } }, isAssessed
             ? featureEntries.map(featureEntry => (react_1.default.createElement(FeatureLeaderboardEntry_1.FeatureLeaderboardEntry, { key: featureEntry.feature.id, featureEntry: featureEntry })))
             : featureEntries.map(featureEntry => (react_1.default.createElement("div", { className: "feature-leaderboard-entry-row-wrapper", key: featureEntry.feature.id },
-                react_1.default.createElement(FeatureLeaderboardEntryRow_1.FeatureLeaderboardEntryRow, { feature: featureEntry.feature }))))));
+                react_1.default.createElement(FeatureLeaderboardEntryRow_1.FeatureLeaderboardEntryRow, { feature: featureEntry.feature })))))));
 };
 exports.FeatureLeaderboardView = FeatureLeaderboardView;
-function filterFeatures(featureLeaderboard, maxCollinearity, confidence) {
-    const fulfillCollinearity = (entry) => entry.maxAbsCorrelationOfSimplerFeature < maxCollinearity;
-    const fulfillNoise = (entry) => entry.signalConfidence >= confidence;
+function filterFeatures(featureLeaderboard, maxCollinearity, confidence, explanationSearchPhrase, isAssessed) {
+    const explanationSearchFilter = (entry) => !explanationSearchPhrase ||
+        entry.feature.explanation_str?.includes(explanationSearchPhrase);
+    const correlationFilter = (entry) => entry.maxAbsCorrelationOfSimplerFeature <= maxCollinearity;
+    const confidenceFilter = (entry) => entry.signalConfidence >= confidence;
+    const reduces = isAssessed
+        ? (0, transducer_1.compose)((0, transducer_1.filter)(explanationSearchFilter), (0, transducer_1.filter)(correlationFilter), (0, transducer_1.filter)(confidenceFilter))
+        : (0, transducer_1.compose)((0, transducer_1.filter)(explanationSearchFilter));
+    const aggregation = (a, b) => a.concat([b]);
     return featureLeaderboard.allEntries
         .flat()
-        .filter(fulfillCollinearity)
-        .filter(fulfillNoise);
+        .reduce(reduces(aggregation), []);
 }
 //# sourceMappingURL=FeatureLeaderboardView.js.map

package/lib/widgets/feature-leaderboard/components/leaderboard-feature-likes.js

@@ -28,7 +28,7 @@ const LeaderBoardFeatureLikes = ({ featureId, }) => {
             setLikedFeatures((0, lodash_1.without)(likedFeatures, featureId));
         }
         if (liked === feature_likes_1.FeatureLike.Disliked) {
-            setDislikedFeatures((0, lodash_1.without)(likedFeatures, featureId));
+            setDislikedFeatures((0, lodash_1.without)(dislikedFeatures, featureId));
             setLikedFeatures([...likedFeatures, featureId]);
         }
     }
@@ -37,11 +37,11 @@ const LeaderBoardFeatureLikes = ({ featureId, }) => {
             setDislikedFeatures([...dislikedFeatures, featureId]);
         }
         if (liked === feature_likes_1.FeatureLike.Disliked) {
-            setDislikedFeatures((0, lodash_1.without)(likedFeatures, featureId));
+            setDislikedFeatures((0, lodash_1.without)(dislikedFeatures, featureId));
         }
         if (liked === feature_likes_1.FeatureLike.Liked) {
             setLikedFeatures((0, lodash_1.without)(likedFeatures, featureId));
-            setDislikedFeatures([...likedFeatures, featureId]);
+            setDislikedFeatures([...dislikedFeatures, featureId]);
         }
     }
     return (react_1.default.createElement(feature_likes_1.FeatureLikes, { liked: liked, toggleIsLiked: toggleIsLiked, toggleIsDisliked: toggleIsDisliked }));

package/lib/widgets/feature-leaderboard/leaderboard-entry/FeatureLeaderboardEntry.js

@@ -9,10 +9,7 @@ const accordion_1 = require("../../../components/accordion");
 const FeatureLeaderboardEntryDetails_1 = require("./FeatureLeaderboardEntryDetails");
 const FeatureLeaderboardEntryRow_1 = require("./FeatureLeaderboardEntryRow");
 const FeatureLeaderboardEntry = ({ featureEntry }) => {
-    return (react_1.default.createElement(accordion_1.Accordion, { expandedDetailsStyle: {
-            borderBottom: '1px solid var(--c-grey-500)',
-            paddingBlockEnd: '30px',
-        } },
+    return (react_1.default.createElement(accordion_1.Accordion, { className: "feature-leaderboard-entry" },
         react_1.default.createElement(accordion_1.AccordionHeader, null,
             react_1.default.createElement(FeatureLeaderboardEntryRow_1.FeatureLeaderboardEntryRow, { feature: featureEntry.feature })),
         react_1.default.createElement(accordion_1.AccordionDetails, null,

package/lib/widgets/feature-leaderboard/leaderboard-entry/FeatureLeaderboardEntryRow.js

@@ -10,19 +10,13 @@ const leaderboard_feature_likes_1 = require("../components/leaderboard-feature-l
 const featureNameLabelStyle = {
     color: 'var(--c-grey-600)',
     display: 'inline-block',
-    marginLeft: '10px',
     minWidth: '5rem',
 };
 const FeatureLeaderboardEntryRow = ({ feature }) => {
-    return (react_1.default.createElement("div", { style: {
-            display: 'flex',
-            alignItems: 'center',
-            position: 'relative',
-            width: '100%',
-        } },
+    return (react_1.default.createElement("div", { className: "feature-leaderboard-entry-row" },
         react_1.default.createElement("span", { className: "label-bold", style: featureNameLabelStyle }, feature.id),
         react_1.default.createElement(FeatureExplanation_1.FeatureExplanation, { key: feature.id, explanationBlocks: feature.explanation.tokens }),
-        react_1.default.createElement("div", { style: { marginLeft: 'auto' } },
+        react_1.default.createElement("div", { style: { marginLeft: 'auto', display: 'flex', gap: '5px' } },
             react_1.default.createElement(leaderboard_feature_likes_1.LeaderBoardFeatureLikes, { featureId: feature.id }))));
 };
 exports.FeatureLeaderboardEntryRow = FeatureLeaderboardEntryRow;

package/lib/widgets/feature-leaderboard/leaderboard-overview/overview-slider.js

@@ -41,7 +41,7 @@ const OverviewSlider = ({ value, setValue, label, labelTooltip, }) => {
         } },
         react_1.default.createElement(material_1.Grid, { item: true },
             react_1.default.createElement(material_1.Tooltip, { title: labelTooltip, placement: "bottom" },
-                react_1.default.createElement("span", { className: "grey-label label-bold" }, label))),
+                react_1.default.createElement("span", { className: "grey-label label-bold", style: { position: 'relative', top: '-3px' } }, label))),
         react_1.default.createElement(material_1.Grid, { item: true, sx: { maxWidth: '200px', width: '100%' } },
             react_1.default.createElement(material_1.Slider, { size: "small", step: STEP, min: MIN, max: MAX, value: sliderValue(localValue), onChange: (e, value) => {
                     setLocalValue(value);
@@ -57,6 +57,6 @@ const OverviewSlider = ({ value, setValue, label, labelTooltip, }) => {
 };
 exports.OverviewSlider = OverviewSlider;
 function sliderValue(value) {
-    return typeof value === 'number' ? value : 0;
+    return Number(value);
 }
 //# sourceMappingURL=overview-slider.js.map

package/lib/widgets/feature-space/FeatureDomainsDescriptions.js

@@ -25,23 +25,16 @@ var __importStar = (this && this.__importStar) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.FeatureDomainsDescriptions = void 0;
 const react_1 = __importStar(require("react"));
-const input_1 = require("../../components/input");
-const domains_descriptors_tree_1 = require("../../feature-descriptor/domains-descriptors-tree");
+const material_1 = require("@mui/material");
+const domains_descriptions_tree_1 = require("../../feature-descriptor/domains-descriptions-tree");
 const headerWrapperStyle = {
     display: 'flex',
     justifyContent: 'space-between',
     alignItems: 'center',
     width: '100%',
 };
-const searchBorder = {
-    borderLeft: '1px solid var(--c-grey-300)',
-    paddingLeft: '10px',
-};
-const searchInputStyle = {
-    width: '220px',
-};
 const FeatureDomainsDescriptions = props => {
-    const [selectedDomains] = (0, domains_descriptors_tree_1.useDomainsDescriptionsTreeItemSelection)();
+    const [selectedDomains] = (0, domains_descriptions_tree_1.useDomainsDescriptionsTreeItemSelection)();
     const [domainSearchValue, setDomainSearchValue] = (0, react_1.useState)(() => '');
     const [numberOfDescriptions, setNumberOfDescriptions] = (0, react_1.useState)(() => 0);
     const [searchedDomain, setSearchedDomain] = (0, react_1.useState)(() => props.descriptionsTree);
@@ -49,8 +42,8 @@ const FeatureDomainsDescriptions = props => {
         setNumberOfDescriptions(calculateNumberOfDescriptions(props.descriptionsTree));
     }, [props.descriptionsTree]);
     (0, react_1.useEffect)(() => {
-        const selectedDomainFilter = (0, domains_descriptors_tree_1.createDomainPredicate)(selectedDomains, props.selectedJoinIds);
-        const domains = (0, domains_descriptors_tree_1.filterDomainsDescriptionsTree)(props.descriptionsTree, description => description.description
+        const selectedDomainFilter = (0, domains_descriptions_tree_1.createDomainPredicate)(selectedDomains, props.selectedJoinIds);
+        const domains = (0, domains_descriptions_tree_1.filterDomainsDescriptionsTree)(props.descriptionsTree, description => description.description
             .toLowerCase()
             .includes(domainSearchValue.toLowerCase()) &&
             selectedDomainFilter(description));
@@ -61,16 +54,15 @@ const FeatureDomainsDescriptions = props => {
         props.selectedJoinIds,
         props.descriptionsTree,
     ]);
-    return (react_1.default.createElement(domains_descriptors_tree_1.DomainsDescriptionsTree, { descriptionsTree: searchedDomain },
-        react_1.default.createElement(domains_descriptors_tree_1.FeatureDomainDescriptionsTreeHeader, null,
+    return (react_1.default.createElement(domains_descriptions_tree_1.DomainsDescriptionsTree, { descriptionsTree: searchedDomain },
+        react_1.default.createElement(domains_descriptions_tree_1.FeatureDomainDescriptionsTreeHeader, null,
             react_1.default.createElement("div", { style: headerWrapperStyle },
-                react_1.default.createElement("h4", null,
+                react_1.default.createElement("h4", { style: { margin: 0 } },
                     props.domainName,
                     ": (",
                     numberOfDescriptions,
                     ")"),
-                react_1.default.createElement("div", { style: searchBorder },
-                    react_1.default.createElement(input_1.Input, { style: searchInputStyle, value: domainSearchValue, placeholder: `Search for ${props.domainName.toLowerCase()}`, onValueChange: setDomainSearchValue }))))));
+                react_1.default.createElement(material_1.TextField, { sx: { top: '-8px' }, size: "small", label: `Search for ${props.domainName.toLowerCase()}`, type: "search", variant: "standard", margin: "dense", value: domainSearchValue, onChange: e => setDomainSearchValue(e.target.value) })))));
 };
 exports.FeatureDomainsDescriptions = FeatureDomainsDescriptions;
 function calculateNumberOfDescriptions(descriptionsTree) {

package/lib/widgets/feature-space/FeatureSpaceView.js

@@ -10,8 +10,7 @@ const material_1 = require("@mui/material");
 const widget_model_1 = require("../../utils/widget-model");
 const widget_theme_1 = require("../../utils/widget-theme");
 const FeatureExplorationPaths_1 = require("./FeatureExplorationPaths");
-const context_1 = require("../../feature-descriptor/context");
-const domains_descriptors_tree_1 = require("../../feature-descriptor/domains-descriptors-tree");
+const domains_descriptions_tree_1 = require("../../feature-descriptor/domains-descriptions-tree");
 const FeatureDomainsDescriptions_1 = require("./FeatureDomainsDescriptions");
 const Divider = () => (react_1.default.createElement("div", { style: {
         height: '1px',
@@ -20,29 +19,31 @@ const Divider = () => (react_1.default.createElement("div", { style: {
     } }));
 const FeatureSpaceView = props => {
     const [featureSpace] = (0, widget_model_1.useModelState)('value');
-    const selectedFiltersModel = (0, widget_model_1.useModelState)('selected_filters');
-    const selectedAggregationsModel = (0, widget_model_1.useModelState)('selected_aggregations');
+    const [configuration] = (0, widget_model_1.useModelState)('configuration');
+    const selectedFiltersModel = (0, widget_model_1.useModelState)('_selected_filters');
+    const selectedAggregationsModel = (0, widget_model_1.useModelState)('_selected_aggregations');
     const [selectedJoinIds, setSelectedJoinIds] = react_1.default.useState(() => []);
     const [filterDescriptionsTree, setFilterDescriptionsTree] = react_1.default.useState(() => ({ types: [] }));
     const [aggregationDescriptionsTree, setAggregationDescriptionsTree] = react_1.default.useState(() => ({ types: [] }));
     react_1.default.useEffect(() => {
-        setFilterDescriptionsTree(domains_descriptors_tree_1.DescriptionsTree.appendGroupId(featureSpace.filters, 'f'));
+        setFilterDescriptionsTree(domains_descriptions_tree_1.DescriptionsTree.appendGroupId(featureSpace.filters, 'f'));
     }, [featureSpace.filters]);
     react_1.default.useEffect(() => {
-        setAggregationDescriptionsTree(domains_descriptors_tree_1.DescriptionsTree.appendGroupId(featureSpace.aggregations, 'a'));
+        setAggregationDescriptionsTree(domains_descriptions_tree_1.DescriptionsTree.appendGroupId(featureSpace.aggregations, 'a'));
     }, [featureSpace.aggregations]);
     return (react_1.default.createElement(styles_1.ThemeProvider, { theme: widget_theme_1.theme },
         react_1.default.createElement("h2", { className: "grey-label" }, "Feature Space Overview:"),
-        react_1.default.createElement(domains_descriptors_tree_1.DomainsDescriptionsTreeItemSelectionContextProvider, { selectedJoinIds: selectedJoinIds },
-            react_1.default.createElement(FeatureExplorationPaths_1.FeatureExplorationPaths, { explorationPaths: featureSpace.explorationPaths, selectedJoinIds: selectedJoinIds, setSelectedJoinIds: setSelectedJoinIds }),
-            react_1.default.createElement(Divider, null),
-            react_1.default.createElement(material_1.Grid, { container: true, spacing: 6 },
-                react_1.default.createElement(material_1.Grid, { item: true, xs: 6 },
-                    react_1.default.createElement(context_1.FdDomainsDescriptionsSelectionContext.Provider, { value: selectedFiltersModel },
-                        react_1.default.createElement(FeatureDomainsDescriptions_1.FeatureDomainsDescriptions, { domainName: "Filters", descriptionsTree: filterDescriptionsTree, selectedJoinIds: selectedJoinIds }))),
-                react_1.default.createElement(material_1.Grid, { item: true, xs: 6, sx: { overflow: 'hidden' } },
-                    react_1.default.createElement(context_1.FdDomainsDescriptionsSelectionContext.Provider, { value: selectedAggregationsModel },
-                        react_1.default.createElement(FeatureDomainsDescriptions_1.FeatureDomainsDescriptions, { domainName: "Aggregations", descriptionsTree: aggregationDescriptionsTree, selectedJoinIds: selectedJoinIds })))))));
+        react_1.default.createElement(domains_descriptions_tree_1.DomainsDescriptionsTreeConfigContextProvider, { configuration: configuration },
+            react_1.default.createElement(domains_descriptions_tree_1.DomainsDescriptionsTreeItemSelectionContextProvider, null,
+                react_1.default.createElement(FeatureExplorationPaths_1.FeatureExplorationPaths, { explorationPaths: featureSpace.explorationPaths, selectedJoinIds: selectedJoinIds, setSelectedJoinIds: setSelectedJoinIds }),
+                react_1.default.createElement(Divider, null),
+                react_1.default.createElement(material_1.Grid, { container: true, spacing: 6 },
+                    react_1.default.createElement(material_1.Grid, { item: true, xs: 6 },
+                        react_1.default.createElement(domains_descriptions_tree_1.DomainsDescriptionsSelectionContextProvider, { selectedDomainDescriptionIds: selectedFiltersModel[0], setSelectedDomainDescriptionIds: selectedFiltersModel[1] },
+                            react_1.default.createElement(FeatureDomainsDescriptions_1.FeatureDomainsDescriptions, { domainName: "Filters", descriptionsTree: filterDescriptionsTree, selectedJoinIds: selectedJoinIds }))),
+                    react_1.default.createElement(material_1.Grid, { item: true, xs: 6, sx: { overflow: 'hidden' } },
+                        react_1.default.createElement(domains_descriptions_tree_1.DomainsDescriptionsSelectionContextProvider, { selectedDomainDescriptionIds: selectedAggregationsModel[0], setSelectedDomainDescriptionIds: selectedAggregationsModel[1] },
+                            react_1.default.createElement(FeatureDomainsDescriptions_1.FeatureDomainsDescriptions, { domainName: "Aggregations", descriptionsTree: aggregationDescriptionsTree, selectedJoinIds: selectedJoinIds }))))))));
 };
 exports.FeatureSpaceView = FeatureSpaceView;
 //# sourceMappingURL=FeatureSpaceView.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dotdata_widgets",
-  "version": "0.1.4",
+  "version": "0.1.6",
   "description": "A dotdata widget",
   "keywords": [
     "dotdata",