@adaptabletools/adaptable 23.0.4-canary.0 → 23.0.5-canary.0

package/src/View/Components/RangesComponent.js

@@ -21,16 +21,6 @@ const DEFAULT_ZERO_CENTRED_COLORS = {
     PositiveColor: 'rgba(40, 167, 69, 0.55)',
 };
 const hasConfiguredRanges = (ranges) => (ranges?.length ?? 0) > 0;
-/**
- * Decide which range tab should be active given the current props.
- *
- * Precedence:
- *  1. `columnComparison` set       → Column Comparison tab
- *  2. Zero Centred set + supported → Zero Centred tab
- *  3. `allowEmptyRanges` + no bands → No Ranges tab
- *  4. `rangeValueType === 'Percentage'` → Percentage Range tab
- *  5. otherwise                    → Number Range tab (default for new styles)
- */
 function deriveInitialRangesType(props) {
     if (props.columnComparison) {
         return 'ColumnComparison';
@@ -43,14 +33,6 @@ function deriveInitialRangesType(props) {
     }
     return props.rangeValueType === 'Percentage' ? 'PercentageRange' : 'NumberRange';
 }
-/**
- * A single Column Comparison bound (Min or Max). The user picks whether the
- * bound is a fixed `Value` (a number applied to every row) or a `Column`
- * (read from another column and evaluated per row). The underlying
- * `ColumnComparison.MinValue`/`MaxValue` stays a `number | string` — number =>
- * fixed value, non-numeric string => columnId — so the type is derived from the
- * stored value via `isNaN`, mirroring how the runtime resolver discriminates it.
- */
 const ColumnComparisonBoundInput = ({ value, disabled, onChange }) => {
     const [type, setType] = React.useState(value != null && value !== '' && isNaN(Number(value)) ? 'column' : 'value');
     const typeOptions = [
@@ -64,22 +46,12 @@ const ColumnComparisonBoundInput = ({ value, disabled, onChange }) => {
         },
     ];
     const editor = type === 'value' ? (_jsx(NumberInput, { className: "twa:w-full", disabled: disabled, type: "number", value: value != null && !isNaN(Number(value)) ? Number(value) : '', onChange: (v) => onChange(v) })) : (_jsx(ColumnSelector, { disabled: disabled, type: "number", value: value != null && isNaN(Number(value)) ? String(value) : undefined, onChange: (columnId) => onChange(columnId || undefined) }));
-    // The select trigger, the `NumberInput` (`.ab-Input`) and the `ColumnSelector`
-    // (a Combobox that does NOT forward `className`, rendering its border on a
-    // `[data-slot="input-group"]` wrapper) all hard-code `rounded-input`, so the
-    // InputGroup CSS-variable joining has no effect. We flatten the touching
-    // corners directly (important, to beat `rounded-input`) and overlap the shared
-    // border via `-ml-px` so the two controls read as a single block. The editor
-    // side targets both inner border elements through descendant arbitrary
-    // variants and forces them to fill the flex item.
     const editorWrapperClassName = [
         'twa:flex-1 twa:basis-0 twa:min-w-0 twa:-ml-px',
         'twa:[&_.ab-Input]:w-full twa:[&_.ab-Input]:rounded-l-none!',
         'twa:[&_[data-slot=input-group]]:w-full! twa:[&_[data-slot=input-group]]:rounded-l-none!',
     ].join(' ');
     return (_jsxs(InputGroup, { Component: Flex, className: "twa:items-stretch twa:max-w-[20rem]", children: [_jsx(SingleSelect, { className: "twa:w-[120px] twa:max-w-none twa:shrink-0 twa:box-border twa:rounded-r-none!", disabled: disabled, value: type, items: typeOptions, onValueChange: (next) => {
-                    // Switching type clears the stale bound so a fixed number can never
-                    // be misread as a columnId (or vice versa).
                     onChange(undefined);
                     setType(next);
                 } }), _jsx(Box, { className: editorWrapperClassName, children: editor })] }));
@@ -93,14 +65,8 @@ export class RangesComponent extends React.Component {
         let comparisonColor = this.props.columnComparison != null && this.props.columnComparison.Color != null
             ? this.props.columnComparison.Color
             : undefined;
-        // Number / Percentage is now expressed at the tab level (Number Range tab
-        // vs Percentage Range tab) instead of an inline radio. The inner content
-        // is shared between the two range tabs and parameterised on this flag.
         const isRangeValueTypeNumber = this.state.rangesType === 'NumberRange';
         const renderNoneContent = () => (_jsx(Box, { className: "twa:text-2 twa:opacity-70 twa:py-2 twa:max-w-[520px]", children: "No coloured bands configured" }));
-        // Columns: Min, Max, Colour, [Reverse Gradient], Delete. Using one shared
-        // grid (rows are `display: contents`) keeps every band's cells aligned and
-        // spacing uniform via grid gaps, even with a single row.
         const rangeGridTemplateColumns = [
             'max-content',
             'max-content',
@@ -152,20 +118,14 @@ export class RangesComponent extends React.Component {
         const isComparison = !!this.props.columnComparison;
         const wasZc = !!prevProps.zeroCentred;
         const isZc = !!this.props.zeroCentred;
-        // External mutations to columnComparison drive the tab.
         if (wasComparison !== isComparison) {
             this.setState({ rangesType: deriveInitialRangesType(this.props) });
             return;
         }
-        // External mutations to zeroCentred drive the tab (when not in CC mode).
         if (!isComparison && wasZc !== isZc) {
             this.setState({ rangesType: deriveInitialRangesType(this.props) });
             return;
         }
-        // External flips of RangeValueType while the user is sitting on a range
-        // tab — keep the active tab in sync. We deliberately do NOT react when the
-        // user is on Zero Centred / Column Comparison tabs (parent code can still
-        // set RangeValueType: 'Number' as part of those flows).
         if ((this.state.rangesType === 'NumberRange' || this.state.rangesType === 'PercentageRange') &&
             prevProps.rangeValueType !== this.props.rangeValueType) {
             this.setState({
@@ -210,9 +170,6 @@ export class RangesComponent extends React.Component {
             this.props.onApplyZeroCentred?.(this.props.zeroCentred ?? DEFAULT_ZERO_CENTRED_COLORS);
             return;
         }
-        // Switching to a range tab — let the parent reseed CellRanges + the right
-        // RangeValueType (and clear ColumnComparison / ZeroCentred). Tab switches
-        // wipe any previously configured ranges by design.
         this.props.onRangeValueTypeChange(value === 'PercentageRange' ? 'Percentage' : 'Number');
     }
     changeRangeMin(index, value) {
@@ -252,7 +209,6 @@ export class RangesComponent extends React.Component {
     removeRange(index) {
         let ranges = [...this.props.ranges];
         ranges.splice(index, 1);
-        // Max 100 is always disabled, this prevents from having a Max range lower than 100
         if (this.props.rangeValueType === 'Percentage' && ranges.length === 1) {
             ranges[0] = {
                 ...ranges[0],
@@ -288,13 +244,6 @@ export class RangesComponent extends React.Component {
         this.props.updateRanges(newRanges);
     }
     addRange() {
-        // Most callers seed `ranges` with at least one entry, but Range Bar
-        // legitimately leaves `CellRanges` undefined (bands are optional). Handle
-        // both cases so the "Add Range" button always works.
-        //
-        // When starting from empty we seed TWO bands split at the midpoint — a
-        // single full-width band would just look like a back colour and wouldn't
-        // communicate the "qualitative scale" idea bands are intended for.
         const existingRanges = this.props.ranges ?? [];
         if (existingRanges.length === 0) {
             const isPercentage = this.props.rangeValueType === 'Percentage';
@@ -326,8 +275,6 @@ export class RangesComponent extends React.Component {
             this.props.updateRanges(seedRanges);
             return;
         }
-        // Splitting a single full-width band at the midpoint is easier to reason
-        // about than anchoring the break at the column maximum (e.g. tradeId 1–200 → 100).
         if (existingRanges.length === 1) {
             const splitAtMidpoint = this.splitFullSpanRangeAtMidpoint(existingRanges[0]);
             if (splitAtMidpoint) {
@@ -356,10 +303,6 @@ export class RangesComponent extends React.Component {
         const newRanges = [...existingRanges.slice(0, -1), previousRange, newRange];
         this.props.updateRanges(newRanges);
     }
-    /**
-     * When there is exactly one band spanning the full scale (Col-Min→Col-Max or
-     * 0→100), split at the midpoint instead of at the column maximum.
-     */
     splitFullSpanRangeAtMidpoint(onlyRange) {
         const isPercentage = this.props.rangeValueType === 'Percentage';
         if (isPercentage) {

package/src/View/Components/Selectors/BulkUpdateValueSelector.js

@@ -16,9 +16,6 @@ export const BulkUpdateValueSelector = (props) => {
     const columnDataType = props.selectedColumn?.dataType;
     const isDateType = props.selectedColumn && columnDataType === 'date';
     const columnId = props.selectedColumn?.columnId;
-    // TODO = this seems to be called whenever we edit a cell
-    // which is then triggering a get all values
-    // not sure that we need to
     const permittedValueSelector = (_jsx(Box, { className: 'twa:flex-1', children: _jsx(PermittedValuesSelector, { allowNewValues: true, searchable: 'inline', disabled: props.disabled || !props.selectedColumn, value: props.selectedColumnValue === '' ? null : props.selectedColumnValue, columnId: columnId, placeholder: 'Select value', loadValues: useCallback(({ currentSearchValue }) => {
                 if (!columnId || !props.selectedGridCells.length) {
                     return Promise.resolve([]);

package/src/View/Components/Selectors/PermittedValuesSelector.js

@@ -37,9 +37,7 @@ export const PermittedValuesSelector = function (props) {
                         return currentSearchValue;
                     },
                 });
-            const distinctColumnValues = await runIfNotResolvedIn(
-            // we are here ALWAYS getting Filter values but sometimes we want to get other things!!!
-            p, () => {
+            const distinctColumnValues = await runIfNotResolvedIn(p, () => {
                 setIsLoading(true);
             });
             setSearchValueWasUsedWhenFiltering(searchValueUsedInFilterValue);
@@ -50,7 +48,6 @@ export const PermittedValuesSelector = function (props) {
     const isCreatable = (props.allowNewValues && !dataType) || ['text', 'number'].includes(dataType);
     const handleSingleValueChange = (value) => {
         if (isCreatable) {
-            // try to convert to correct type, when there is not type, e.g. field
             if (!dataType && typeof value === 'string' && !isNaN(parseFloat(value))) {
                 props.onChange(parseFloat(value));
             }
@@ -82,7 +79,6 @@ export const PermittedValuesSelector = function (props) {
         }
     };
     const handleOnChange = (value) => {
-        // convert numbers
         if (props.isMulti) {
             handleMultiValueChange(value);
         }
@@ -120,7 +116,6 @@ export const PermittedValuesSelector = function (props) {
         virtualized: true,
         resizable: true,
         showClear: true,
-        // showClear: false,
         onFocus: props.onFocus,
         onBlur: props.onBlur,
     };

package/src/View/Components/ToolPanel/AdaptableToolPanel.js

@@ -25,12 +25,10 @@ const AdaptableToolPanelComponent = (props) => {
     const toolPanelOptions = adaptableOptions.toolPanelOptions;
     const settingsPanelOptions = adaptableOptions.settingsPanelOptions;
     if (props.api.entitlementApi.isModuleHiddenEntitlement('ToolPanel')) {
-        // do NOT show any toolPanel content if the required entitlements are missing
         return _jsx(HelpBlock, { className: "twa:my-2 twa:p-2 twa:text-3", children: "Not enough rights" });
     }
     const availableModuleItems = props.MainMenuItems.filter((menuItem) => menuItem.isVisible);
     const availableModules = availableModuleItems.map((menuItem) => menuItem.category);
-    // 'Dashboard' is a special case because it's not available in the dashboard menu items, s we have to add it manually
     if (!props.api.entitlementApi.isModuleHiddenEntitlement('Dashboard')) {
         availableModules.push('Dashboard');
     }
@@ -58,15 +56,12 @@ const AdaptableToolPanelComponent = (props) => {
     const visibleToolPanels = [];
     const visibleToolPanelControls = (props.ToolPanels ?? []).map((toolPanelDefinition) => {
         const visibilityMode = toolPanelDefinition.VisibilityMode ?? 'collapsed';
-        // 1. check if it is a custom toolPanel
         const customToolPanel = props.api.toolPanelApi.getCustomToolPanelByName(toolPanelDefinition.Name);
         if (customToolPanel) {
             visibleToolPanels.push(customToolPanel.name);
             return (_jsx(ToolPanelWrapper, { customToolPanel: customToolPanel, visibilityMode: visibilityMode, onVisibilityModeChange: (state) => onStateChange(customToolPanel.name, state) }, customToolPanel.name));
         }
-        // 2. check if it's an available module toolPanel
         if (availableModuleToolPanels.some((module) => module === toolPanelDefinition.Name)) {
-            // assertion is safe as if just checked it in the if clause
             const moduleToolPanel = toolPanelDefinition.Name;
             visibleToolPanels.push(moduleToolPanel);
             return (_jsx(ToolPanelWrapper, { adaptableToolPanel: moduleToolPanel, visibilityMode: visibilityMode, onVisibilityModeChange: (state) => onStateChange(moduleToolPanel, state) }, moduleToolPanel));
@@ -95,17 +90,14 @@ const AdaptableToolPanelComponent = (props) => {
                 label: (_jsx(CheckBox, { className: "ab-dd-checkbox twa:my-0", value: toolPanel, checked: isVisible, onMouseDown: preventDefault, children: toolPanel }, toolPanel)),
             };
         };
-        // 1. process custom tool panels
         props.api.toolPanelApi.getCustomToolPanels().forEach((customToolPanel) => {
             const customToolPanelName = customToolPanel.name;
             toolpanelItems.push(buildDropdownButtonItem(customToolPanelName, customToolPanelName, isItemVisible(customToolPanelName)));
         });
-        // 2. process module tool panels
         availableModuleToolPanels.forEach((toolPanel) => {
             let moduleName = moduleService.getModuleInfoByModule(toolPanel).FriendlyName;
             toolpanelItems.push(buildDropdownButtonItem(toolPanel, moduleName, isItemVisible(toolPanel)));
         });
-        // 3. sort the dropdown items alphabetically
         toolpanelItems.sort((first, second) => {
             if (first.label < second.label) {
                 return -1;
@@ -162,13 +154,7 @@ const AdaptableToolPanelComponent = (props) => {
             } }));
     };
     const toolPanelButtons = renderToolPanelButtons();
-    return (_jsxs(Flex // Cannot have the with of the parent, on windows, when you have scrollbars
-    // the inner-width is smaller
-    // minWidth: 'var(--ab-cmp-toolpanel__width)',
-    , { 
-        // the inner-width is smaller
-        // minWidth: 'var(--ab-cmp-toolpanel__width)',
-        className: "ab-ToolPanel twa:p-2 twa:w-full", "data-name": "adaptable-tool-panel", flexDirection: "column", justifyContent: "center", children: [_jsxs(Flex, { className: "ab-ToolPanel__header twa:p-1 twa:w-full twa:justify-start", flexDirection: "row", flexWrap: "wrap", children: [isToolPanelModuleConfigurable && renderToolPanelDropdowns(), toolPanelButtons, isToolPanelModuleConfigurable && renderToolPanelConfigureButton()] }), Boolean(props.api.toolPanelApi.getCustomToolPanelButtons().length) && (_jsx(Flex, { className: "ab-ToolPanel__header__buttons twa:p-1 twa:justify-start", flexDirection: "row", flexWrap: "wrap", children: renderCustomToolPanelButtons() })), visibleToolPanelControls] }));
+    return (_jsxs(Flex, { className: "ab-ToolPanel twa:p-2 twa:w-full", "data-name": "adaptable-tool-panel", flexDirection: "column", justifyContent: "center", children: [_jsxs(Flex, { className: "ab-ToolPanel__header twa:p-1 twa:w-full twa:justify-start", flexDirection: "row", flexWrap: "wrap", children: [isToolPanelModuleConfigurable && renderToolPanelDropdowns(), toolPanelButtons, isToolPanelModuleConfigurable && renderToolPanelConfigureButton()] }), Boolean(props.api.toolPanelApi.getCustomToolPanelButtons().length) && (_jsx(Flex, { className: "ab-ToolPanel__header__buttons twa:p-1 twa:justify-start", flexDirection: "row", flexWrap: "wrap", children: renderCustomToolPanelButtons() })), visibleToolPanelControls] }));
 };
 function mapStateToProps(state) {
     return {
@@ -210,10 +196,8 @@ export const getAdaptableToolPanelAgGridComponent = (adaptable) => {
             const api = adaptable.api;
             this.gui = document.createElement('div');
             this.gui.id = getContainerId();
-            // preserve AG Grid naming convention
             this.gui.className = 'ag-adaptable-panel';
             Object.keys(toolPanelContainerStyle).forEach((key) => {
-                //@ts-ignore
                 this.gui.style[key] = toolPanelContainerStyle[key];
             });
             this.unmountReactRoot = adaptable.renderReactRoot(renderWithAdaptableContext(_jsx(ConnectedAdaptableToolPanel, { api: api, teamSharingActivated: false }), adaptable), this.gui);
@@ -225,7 +209,6 @@ export const getAdaptableToolPanelAgGridComponent = (adaptable) => {
             return this.gui;
         }
         refresh() {
-            // no refresh logic needed
         }
         destroy() {
             this.unmountReactRoot?.();

package/src/View/Components/ToolPanel/ToolPanelPopupSections.js

@@ -14,10 +14,6 @@ export var ToolPanelConfigView;
 })(ToolPanelConfigView || (ToolPanelConfigView = {}));
 export const ToolPanelPopupSections = (props) => {
     const { api } = useAdaptable();
-    // Start with both cards collapsed so the user sees the popup's full
-    // summary at a glance and explicitly chooses which to edit. `initialTab`
-    // is still accepted on the props for backwards compatibility but no
-    // longer pre-expands a card.
     const { bindCard, hasExpandedCard, expandedFillsSpace } = useWizardCardAccordion(null);
     const selectedModuleButtons = [];
     if (ArrayExtensions.IsNotNullOrEmpty(props.ToolPanelState.ModuleButtons)) {

package/src/View/Components/ToolPanel/ToolPanelWrapper.js

@@ -25,7 +25,6 @@ export const ToolPanelWrapper = (props) => {
             ];
         }
         else {
-            // custom toolPanel
             return [
                 customToolPanel.name,
                 customToolPanel?.title ?? customToolPanel.name,
@@ -35,9 +34,7 @@ export const ToolPanelWrapper = (props) => {
     };
     const [toolPanelName, toolPanelHeader, toolPanelContent, moduleInfo] = getToolPanelConfiguration();
     const isMinimised = visibilityMode === 'collapsed';
-    const isConfigurable = 
-    // only module toolPanels are configurable
-    !!moduleInfo && toolPanelName !== 'OpenFin' && toolPanelName !== 'IPushPull';
+    const isConfigurable = !!moduleInfo && toolPanelName !== 'OpenFin' && toolPanelName !== 'IPushPull';
     const isToolPanelModuleConfigurable = api.internalApi
         .getModuleService()
         .getModuleById(ToolPanelModuleId)

package/src/View/Components/ValueSelector/index.js

@@ -32,7 +32,6 @@ function useValuesMap({ options, value, toIdentifier, selectedMap, }) {
     return { selectedMap: result, optionsMap };
 }
 const baseClassName = 'ab-ValueSelector';
-/** Clicks on these targets must not toggle row selection (`toggleSelectionOnRowClick`). */
 const ROW_CLICK_IGNORE_SELECTOR = 'button, input, select, textarea, a, [data-drag-handle], [data-slot=select-trigger], [data-slot=select-content], [data-slot=select-item], .ab-Select';
 const ROW_TOGGLE_SUPPRESS_MS = 150;
 export function ValueSelector(props) {
@@ -241,9 +240,6 @@ export const renderSelectionSection = (props) => {
                         props.onClear();
                     }
                 }, children: "Select All" })), hideShowSelectedOnly ? null : (_jsx(Box, { className: "twa:shrink-0 twa:text-2 twa:font-normal", children: props.showOnlySelectedCheckbox })), showFilterInput && filter ? (_jsxs(_Fragment, { children: [compactFilterUsesSpacer ? _jsx(Box, { className: "twa:flex-1 twa:min-w-0" }) : null, _jsx(AdaptableFormControlTextClear, { value: searchInputValue ?? '', OnTextChange: setSearchInputValue ?? (() => undefined), placeholder: filterPlaceholder ?? 'Search...', className: compactFilterClass })] })) : null] })) : (_jsx(Box, { className: "twa:flex twa:flex-col twa:gap-2 twa:py-2", children: _jsxs(Box, { className: headerRowClassName, children: [singleSelect ? (_jsx(Box, { className: "twa:flex twa:flex-row twa:text-3 twa:font-normal twa:items-center", children: (() => {
-                        // For single-select we show the *name* of the selected option
-                        // rather than a (1 of N) counter — useful when the list is
-                        // long enough to scroll past the chosen row.
                         if (!value.length) {
                             return _jsx("span", { className: "twa:opacity-70", children: "(none selected)" });
                         }

package/src/View/Components/wizardColumnListStyles.js

@@ -1,10 +1,5 @@
-/** ValueSelector row sizing — matches Visibility and Order list rows. */
 export const WIZARD_COLUMN_LIST_OPTION_CLASS = 'twa:!py-1 twa:!px-1.5';
-/** Single-select column lists — ~50% taller than multi-select compact rows. */
 export const WIZARD_COLUMN_LIST_OPTION_CLASS_SINGLE_SELECT = 'twa:!py-1.5 twa:!px-1.5';
-/** Taller rows when ultra-compact one-line cards are not required (e.g. Custom Sort wizard). */
 export const WIZARD_COLUMN_LIST_OPTION_CLASS_RELAXED = 'twa:!py-2 twa:!px-2';
-/** Compact list header — spacing between Select All, Show Selected Only, and search. */
 export const WIZARD_COLUMN_LIST_HEADER_CLASS = 'twa:gap-4';
-/** Narrow search field (matches Visibility list column width, not full card width). */
 export const WIZARD_COLUMN_LIST_SEARCH_CLASS = 'twa:w-[12rem] twa:shrink-0 twa:min-w-0';

package/src/View/Dashboard/CustomToolbar.js

@@ -7,7 +7,6 @@ import { AdaptableFormComponent } from '../../components/AdaptableFormComponent/
 import { getDefaultAdaptableFormData, validateAdaptableForm, } from '../../AdaptableState/Common/AdaptableForm';
 export const CustomToolbarCmp = (props) => {
     const { api } = useAdaptable();
-    // dummy object which is used to force a re-render of the toolbar
     const [componentRevision, setComponentRevision] = useState(1);
     const renderContentContainerId = api.dashboardApi.internalApi.getCustomToolbarRenderContainerId(props.customToolbar.name);
     const renderContentContainerRef = useRef(null);
@@ -16,17 +15,9 @@ export const CustomToolbarCmp = (props) => {
     const componentContainerId = api.dashboardApi.internalApi.getCustomToolbarComponentContainerId(props.customToolbar.name);
     const componentContainerRef = useRef(null);
     const formContainerId = `${buttonsContainerId}-form`;
-    // Local form state for `customToolbar.toolbarForm`.
-    // Defaults are seeded from the form's field `defaultValue`s (if any) on
-    // first mount; subsequent definition swaps (different toolbar instance) are
-    // re-seeded too because the dependency includes the form definition.
     const [toolbarFormData, setToolbarFormData] = useState(() => props.customToolbar.toolbarForm
         ? getDefaultAdaptableFormData(props.customToolbar.toolbarForm)
         : {});
-    // Register a reset callback so `dashboardApi.resetCustomToolbarFormData(name)`
-    // can wipe this toolbar's state back to its declared defaults without
-    // forcing a re-mount. The unregister guard inside the internal API
-    // ensures a stale unmount can't clobber a fresh registration.
     useEffect(() => {
         if (!props.customToolbar.toolbarForm) {
             return;
@@ -34,9 +25,6 @@ export const CustomToolbarCmp = (props) => {
         const resetter = () => {
             const next = getDefaultAdaptableFormData(props.customToolbar.toolbarForm);
             setToolbarFormData(next);
-            // Mirror the public form-change callback so consumer code (e.g. a
-            // grid-filter helper) can rebuild itself from the cleared data
-            // without re-implementing default-seeding.
             if (props.customToolbar.onToolbarFormChange) {
                 props.customToolbar.onToolbarFormChange(next, buildToolbarFormContext(next));
             }
@@ -45,8 +33,6 @@ export const CustomToolbarCmp = (props) => {
         return () => {
             api.dashboardApi.internalApi.unregisterCustomToolbarFormResetter(props.customToolbar.name, resetter);
         };
-        // We deliberately depend on the toolbar identity + form definition so
-        // that a re-render with the same toolbar doesn't churn the registration.
     }, [api, props.customToolbar.name, props.customToolbar.toolbarForm]);
     const buildToolbarFormContext = (data) => {
         const baseCtx = {
@@ -55,9 +41,6 @@ export const CustomToolbarCmp = (props) => {
             formData: data,
             ...api.internalApi.buildBaseContext(),
         };
-        // Validate against the same context the consumer will see, then attach
-        // the results so button hidden/disabled/onClick callbacks can gate on
-        // form validity (e.g. a "Submit" button disabled while invalid).
         const formErrors = props.customToolbar.toolbarForm
             ? validateAdaptableForm(props.customToolbar.toolbarForm, data, baseCtx)
             : {};
@@ -80,7 +63,6 @@ export const CustomToolbarCmp = (props) => {
     useLayoutEffect(() => {
         const element = renderContentContainerRef.current;
         const adaptableApi = api;
-        // cleanup runs in a separate effect, this way it's executed only once on unmount
         return () => {
             if (props.customToolbar.render) {
                 props.customToolbar.render({
@@ -116,13 +98,7 @@ export const CustomToolbarCmp = (props) => {
                         ...api.internalApi.buildBaseContext(),
                     };
                     return (_jsx(AdaptableButtonView, { button: button, context: dashboardContext, api: api, defaults: ADAPTABLE_BUTTON_SURFACE_DEFAULTS.customToolbar, rerenderOnClick: false, style: { marginLeft: index ? 'var(--ab-base-space)' : 0 }, onAfterClick: () => setComponentRevision(componentRevision + 1) }, index));
-                }) })), props.customToolbar.toolbarForm && (_jsx("div", { id: formContainerId, className: `ab-CustomToolbar__form ab-CustomToolbar--${props.customToolbar.name}`, style: { minHeight: 22 }, children: _jsx(AdaptableFormComponent
-                // ensure the form uses the inline (toolbar-friendly) layout even
-                // if the consumer forgot to set it explicitly
-                , { 
-                    // ensure the form uses the inline (toolbar-friendly) layout even
-                    // if the consumer forgot to set it explicitly
-                    formDef: { ...props.customToolbar.toolbarForm, layout: 'inline' }, data: toolbarFormData, displayTitle: false, api: api, context: buildToolbarFormContext(toolbarFormData), focusFirstButton: false, onChange: (newData) => {
+                }) })), props.customToolbar.toolbarForm && (_jsx("div", { id: formContainerId, className: `ab-CustomToolbar__form ab-CustomToolbar--${props.customToolbar.name}`, style: { minHeight: 22 }, children: _jsx(AdaptableFormComponent, { formDef: { ...props.customToolbar.toolbarForm, layout: 'inline' }, data: toolbarFormData, displayTitle: false, api: api, context: buildToolbarFormContext(toolbarFormData), focusFirstButton: false, onChange: (newData) => {
                         setToolbarFormData(newData);
                         if (props.customToolbar.onToolbarFormChange) {
                             props.customToolbar.onToolbarFormChange(newData, buildToolbarFormContext(newData));

package/src/View/Dashboard/PinnedToolbarsSelector.js

@@ -26,7 +26,6 @@ export const PinnedToolbarsSelector = (props) => {
     const tabs = React.useMemo(() => {
         return [
             {
-                // Name: 'Pinned Toolbars',
                 Name: '',
                 Items: pinnedToolbars ?? [],
             },

package/src/View/DataImport/DataImportWizard/DataImportWizard.js

@@ -16,9 +16,6 @@ export const DataImportWizard = (props) => {
     const [rowData, setRowData] = React.useState(null);
     const [file, setFile] = React.useState(null);
     const [text, setText] = React.useState('');
-    // This needs to be called only when:
-    // - columnsMap changes
-    // - new data is loaded
     const [importType, setImportType] = React.useState('file');
     const primaryKey = adaptableApi.optionsApi.getPrimaryKey();
     const hasDynamicallyAddedPrimaryKey = typeof dataImportOptions._getPrimaryKeyValue === 'function';
@@ -38,7 +35,6 @@ export const DataImportWizard = (props) => {
                 rowData,
             });
         }
-        // by default just trim the keys
         let processedRowData = {};
         if (rowData) {
             processedRowData = Object.keys(rowData).reduce((acc, key) => {
@@ -48,11 +44,9 @@ export const DataImportWizard = (props) => {
         }
         return processedRowData;
     };
-    // ---- COLUMNS ----
     const [columnsMap, setColumnsMap] = React.useState(null);
     const mappedRowDataToColumns = React.useMemo(() => {
         return (rowData ?? []).map((row) => {
-            // pick only included columns, and need to map to abColumn.field
             return columnsMap?.reduce((acc, colMap) => {
                 if (colMap.include && colMap.abColumn && colMap.abColumn.field) {
                     acc[colMap.abColumn.field] = row[colMap.field];
@@ -84,24 +78,19 @@ export const DataImportWizard = (props) => {
             const allAbColumns = adaptableApi.columnApi.getColumns();
             const columnsMap = Array.from(fields).map((field) => {
                 const abColumn = allAbColumns.find((c) => {
-                    // exact field match
                     if (c.field === field) {
                         return true;
                     }
-                    // based on friendly name
                     const friendlyName = c.friendlyName;
                     if (typeof friendlyName !== 'string') {
                         return false;
                     }
-                    // exact match
                     if (friendlyName === field) {
                         return true;
                     }
-                    // match without case
                     if (friendlyName.toLowerCase() === field.toLowerCase()) {
                         return true;
                     }
-                    // match without spaces and case, and special characters: ' ', '-', '_'
                     if (friendlyName.replace(/\s|-|_/g, '').toLowerCase() === field.toLowerCase()) {
                         return true;
                     }
@@ -126,12 +115,10 @@ export const DataImportWizard = (props) => {
     }, []);
     const handleChangeImportType = React.useCallback((importType) => {
         setImportType(importType);
-        // clear data
         handleNewRowData(null);
         setFile(null);
         setText('');
     }, []);
-    // ---- FILE HANDLERS ----
     const fileHandlers = React.useMemo(() => {
         const userDefinedHandlers = adaptableApi.optionsApi.getDataImportOptions()?.fileHandlers ?? [];
         return [...userDefinedHandlers, ...systemFileHandlers];
@@ -158,13 +145,10 @@ export const DataImportWizard = (props) => {
         }
     }, [adaptable]);
     const fileMessage = file ? (_jsxs(HelpBlock, { className: "twa:mb-2", children: ["File ", _jsx(Tag, { children: file.name }), " is ready to be imported."] })) : (_jsxs(HelpBlock, { className: "twa:mb-2", children: ["Supported file types: ", supportedFileFormats] }));
-    // ---- TEXT IMPORT ----
     const [textError, setTextError] = React.useState(null);
     const handleTextChange = React.useCallback(async (text) => {
-        //
         let textHandler = adaptableApi.optionsApi.getDataImportOptions()?.textHandler;
         if (!textHandler) {
-            // regex to test for json
             const jsonRegex = /^\s*[\[{]/;
             if (text && jsonRegex.test(text)) {
                 textHandler = JSON.parse;
@@ -196,7 +180,6 @@ export const DataImportWizard = (props) => {
         }
     }, []);
     const textMessage = textError ?? (!rowData ? 'Paste your data here' : '');
-    // ---- VALIDATION ----
     const errors = React.useMemo(() => {
         if (!dataImportOptions?.validate) {
             return null;
@@ -237,11 +220,7 @@ export const DataImportWizard = (props) => {
                 },
                 details: 'Upload the data',
                 render: () => {
-                    return (_jsx(UploadSection, { importType: importType, onImportTypeChange: handleChangeImportType, 
-                        // FILE
-                        readFile: readFile, supportedFileFormats: supportedFileFormats, fileMessage: fileMessage, 
-                        // TEXT
-                        text: text, onTextChange: handleTextChange, textMessage: textMessage }));
+                    return (_jsx(UploadSection, { importType: importType, onImportTypeChange: handleChangeImportType, readFile: readFile, supportedFileFormats: supportedFileFormats, fileMessage: fileMessage, text: text, onTextChange: handleTextChange, textMessage: textMessage }));
                 },
             },
             {

package/src/View/DataImport/DataImportWizard/sections/DataPreview.js

@@ -107,7 +107,6 @@ export const DataPreview = (props) => {
                     return isExistingRow ? 'Update' : 'New';
                 }
                 catch (error) {
-                    // empty
                 }
                 return _jsx(_Fragment, {});
             },

package/src/View/DataImport/systemFileHandlers.js

@@ -16,7 +16,7 @@ export const parseCSV = (content) => {
             const item = {};
             for (let j = 0; j < headers.length; j++) {
                 const value = values[j];
-                item[headers[j]] = value === '' || isNaN(Number(value)) ? value : Number(value); // '0012345'
+                item[headers[j]] = value === '' || isNaN(Number(value)) ? value : Number(value);
             }
             data.push(item);
         }

package/src/View/FlashingCell/Wizard/isValidFlashingCellRules.js

@@ -7,7 +7,6 @@ export const isValidFlashingCellRules = (flashingCell, api, context) => {
     if (typeof isRuleValid === 'string') {
         return isRuleValid;
     }
-    // boolean expressions may also be saved as named queries
     if (context.namedQuery != false) {
         const isValidName = api.namedQueryApi.isValidNamedQuery(context.namedQuery);
         if (!isValidName.valid) {