diff --git a/.eslintrc.cjs b/.eslintrc.cjs
index 6607a1c553..73b902a78e 100644
--- a/.eslintrc.cjs
+++ b/.eslintrc.cjs
@@ -14,7 +14,8 @@ const config = {
     __OPENMCT_VERSION__: 'readonly',
     __OPENMCT_BUILD_DATE__: 'readonly',
     __OPENMCT_REVISION__: 'readonly',
-    __OPENMCT_BUILD_BRANCH__: 'readonly'
+    __OPENMCT_BUILD_BRANCH__: 'readonly',
+    __OPENMCT_ROOT_RELATIVE__: 'readonly'
   },
   plugins: ['prettier', 'unicorn', 'simple-import-sort'],
   extends: [
diff --git a/.webpack/webpack.common.mjs b/.webpack/webpack.common.mjs
index 7290ce999e..8a745cb464 100644
--- a/.webpack/webpack.common.mjs
+++ b/.webpack/webpack.common.mjs
@@ -48,6 +48,7 @@ const config = {
     generatorWorker: './example/generator/generatorWorker.js',
     couchDBChangesFeed: './src/plugins/persistence/couch/CouchChangesFeed.js',
     inMemorySearchWorker: './src/api/objects/InMemorySearchWorker.js',
+    compsMathWorker: './src/plugins/comps/CompsMathWorker.js',
     espressoTheme: './src/plugins/themes/espresso-theme.scss',
     snowTheme: './src/plugins/themes/snow-theme.scss',
     darkmatterTheme: './src/plugins/themes/darkmatter-theme.scss'
@@ -89,7 +90,8 @@ const config = {
       __OPENMCT_REVISION__: `'${gitRevision}'`,
       __OPENMCT_BUILD_BRANCH__: `'${gitBranch}'`,
       __VUE_OPTIONS_API__: true, // enable/disable Options API support, default: true
-      __VUE_PROD_DEVTOOLS__: false // enable/disable devtools support in production, default: false
+      __VUE_PROD_DEVTOOLS__: false, // enable/disable devtools support in production, default: false
+      __VUE_PROD_HYDRATION_MISMATCH_DETAILS__: false, // enable/disable hydration mismatch details in production, default: false
     }),
     new VueLoaderPlugin(),
     new CopyWebpackPlugin({
diff --git a/e2e/appActions.js b/e2e/appActions.js
index 7bb82726f2..bdc56a9fa0 100644
--- a/e2e/appActions.js
+++ b/e2e/appActions.js
@@ -116,6 +116,22 @@ async function createDomainObjectWithDefaults(page, { type, name, parent = 'mine
   };
 }
 
+/**
+ * Retrieves the properties of an OpenMCT domain object by its identifier.
+ *
+ * @param {import('@playwright/test').Page} page - The Playwright page object.
+ * @param {string | identifier - The identifier or UUID of the domain object.
+ * @returns {Promise<Object>} An object containing the properties of the domain object.
+ */
+async function getDomainObject(page, identifier) {
+  const domainObject = await page.evaluate(async (objIdentifier) => {
+    const object = await window.openmct.objects.get(objIdentifier);
+    return object;
+  }, identifier);
+
+  return domainObject;
+}
+
 /**
  * Generate a notification with the given options.
  * @param {import('@playwright/test').Page} page
@@ -705,6 +721,7 @@ export {
   createStableStateTelemetry,
   expandEntireTree,
   getCanvasPixels,
+  getDomainObject,
   linkParameterToObject,
   navigateToObjectWithFixedTimeBounds,
   navigateToObjectWithRealTime,
diff --git a/e2e/tests/functional/plugins/comps/comps.e2e.spec.js b/e2e/tests/functional/plugins/comps/comps.e2e.spec.js
new file mode 100644
index 0000000000..72ce7d86e9
--- /dev/null
+++ b/e2e/tests/functional/plugins/comps/comps.e2e.spec.js
@@ -0,0 +1,111 @@
+/*****************************************************************************
+ * Open MCT, Copyright (c) 2014-2024, United States Government
+ * as represented by the Administrator of the National Aeronautics and Space
+ * Administration. All rights reserved.
+ *
+ * Open MCT is licensed under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ * http://www.apache.org/licenses/LICENSE-2.0.
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations
+ * under the License.
+ *
+ * Open MCT includes source code licensed under additional open source
+ * licenses. See the Open Source Licenses file (LICENSES.md) included with
+ * this source code distribution or the Licensing information page available
+ * at runtime from the About dialog for additional information.
+ *****************************************************************************/
+import {
+  createDomainObjectWithDefaults,
+  createExampleTelemetryObject,
+  setRealTimeMode
+} from '../../../../appActions.js';
+import { expect, test } from '../../../../pluginFixtures.js';
+
+test.describe('Comps', () => {
+  test.use({ failOnConsoleError: false });
+  test.beforeEach(async ({ page }) => {
+    // Open a browser, navigate to the main page, and wait until all networkevents to resolve
+    await page.goto('./', { waitUntil: 'domcontentloaded' });
+  });
+
+  test('Basic Functionality Works', async ({ page, openmctConfig }) => {
+    const folder = await createDomainObjectWithDefaults(page, {
+      type: 'Folder'
+    });
+
+    // Create the comps with defaults
+    const comp = await createDomainObjectWithDefaults(page, {
+      type: 'Derived Telemetry',
+      parent: folder.uuid
+    });
+
+    const telemetryObject = await createExampleTelemetryObject(page, comp.uuid);
+
+    // Check that expressions can be edited
+    await page.goto(comp.url);
+    await page.getByLabel('Edit Object').click();
+    await page.getByPlaceholder('Enter an expression').fill('a*2');
+    await page.getByText('Current Output').click();
+    await expect(page.getByText('Expression valid')).toBeVisible();
+
+    // Check that expressions are marked invalid
+    await page.getByLabel('Reference Name Input for a').fill('b');
+    await page.getByText('Current Output').click();
+    await expect(page.getByText('Invalid: Undefined symbol a')).toBeVisible();
+
+    // Check that test data works
+    await page.getByPlaceholder('Enter an expression').fill('b*2');
+    await page.getByLabel('Reference Test Value for b').fill('5');
+    await page.getByLabel('Apply Test Data').click();
+    let testValue = await page.getByLabel('Current Output Value').textContent();
+    expect(testValue).toBe('10');
+
+    // Check that real data works
+    await page.getByLabel('Apply Test Data').click();
+    await setRealTimeMode(page);
+    testValue = await page.getByLabel('Current Output Value').textContent();
+    expect(testValue).not.toBe('10');
+    // should be a number
+    expect(parseFloat(testValue)).not.toBeNaN();
+
+    // Check that object path is correct
+    const { myItemsFolderName } = openmctConfig;
+    let objectPath = await page.getByLabel(`${telemetryObject.name} Object Path`).textContent();
+    const expectedObjectPath = `/${myItemsFolderName}/${folder.name}/${comp.name}/${telemetryObject.name}`;
+    expect(objectPath).toBe(expectedObjectPath);
+
+    // Check that the comps are saved
+    await page.getByLabel('Save').click();
+    await page.getByRole('listitem', { name: 'Save and Finish Editing' }).click();
+    const expression = await page.getByLabel('Expression', { exact: true }).textContent();
+    expect(expression).toBe('b*2');
+
+    // Check that object path is still correct after save
+    objectPath = await page.getByLabel(`${telemetryObject.name} Object Path`).textContent();
+    expect(objectPath).toBe(expectedObjectPath);
+
+    // Check that comps work after being saved
+    testValue = await page.getByLabel('Current Output Value').textContent();
+    expect(testValue).not.toBe('10');
+    // should be a number
+    expect(parseFloat(testValue)).not.toBeNaN();
+
+    // Check that output format can be changed
+    await page.getByLabel('Edit Object').click();
+    await page.getByRole('tab', { name: 'Config' }).click();
+    await page.getByLabel('Output Format').click();
+    await page.getByLabel('Output Format').fill('%d');
+    await page.getByRole('tab', { name: 'Config' }).click();
+    // Ensure we only have one digit
+    await expect(page.getByLabel('Current Output Value')).toHaveText(/^-1$|^0$|^1$/);
+    // And that it persists post save
+    await page.getByLabel('Save').click();
+    await page.getByRole('listitem', { name: 'Save and Finish Editing' }).click();
+    await expect(page.getByLabel('Current Output Value')).toHaveText(/^-1$|^0$|^1$/);
+  });
+});
diff --git a/e2e/tests/functional/plugins/conditionSet/conditionSet.e2e.spec.js b/e2e/tests/functional/plugins/conditionSet/conditionSet.e2e.spec.js
index 6b76088b39..9ebe193431 100644
--- a/e2e/tests/functional/plugins/conditionSet/conditionSet.e2e.spec.js
+++ b/e2e/tests/functional/plugins/conditionSet/conditionSet.e2e.spec.js
@@ -29,7 +29,8 @@ import { fileURLToPath } from 'url';
 
 import {
   createDomainObjectWithDefaults,
-  createExampleTelemetryObject
+  createExampleTelemetryObject,
+  getDomainObject
 } from '../../../../appActions.js';
 import { expect, test } from '../../../../pluginFixtures.js';
 
@@ -468,6 +469,34 @@ test.describe('Basic Condition Set Use', () => {
       description: 'https://github.com/nasa/openmct/issues/7484'
     });
   });
+
+  test('should toggle shouldFetchHistorical property in inspector', async ({ page }) => {
+    await page.goto(conditionSet.url);
+    await page.getByLabel('Edit Object').click();
+    await page.getByRole('tab', { name: 'Config' }).click();
+    let toggleSwitch = page.getByLabel('condition-historical-toggle');
+    const initialState = await toggleSwitch.isChecked();
+    expect(initialState).toBe(false);
+
+    await toggleSwitch.click();
+    let toggledState = await toggleSwitch.isChecked();
+    expect(toggledState).toBe(true);
+    await page.click('button[title="Save"]');
+    await page.getByRole('listitem', { name: 'Save and Finish Editing' }).click();
+    let conditionSetObject = await getDomainObject(page, conditionSet.uuid);
+    expect(conditionSetObject.configuration.shouldFetchHistorical).toBe(true);
+
+    await page.getByLabel('Edit Object').click();
+    await page.getByRole('tab', { name: 'Config' }).click();
+    toggleSwitch = page.getByLabel('condition-historical-toggle');
+    await toggleSwitch.click();
+    toggledState = await toggleSwitch.isChecked();
+    expect(toggledState).toBe(false);
+    await page.click('button[title="Save"]');
+    await page.getByRole('listitem', { name: 'Save and Finish Editing' }).click();
+    conditionSetObject = await getDomainObject(page, conditionSet.uuid);
+    expect(conditionSetObject.configuration.shouldFetchHistorical).toBe(false);
+  });
 });
 
 test.describe('Condition Set Composition', () => {
diff --git a/karma.conf.cjs b/karma.conf.cjs
index e96836acbb..4304662402 100644
--- a/karma.conf.cjs
+++ b/karma.conf.cjs
@@ -66,6 +66,10 @@ module.exports = async (config) => {
       {
         pattern: 'dist/generatorWorker.js*',
         included: false
+      },
+      {
+        pattern: 'dist/historicalTelemetryWorker.js*',
+        included: false
       }
     ],
     port: 9876,
diff --git a/package-lock.json b/package-lock.json
index 7dc0829bb9..ab90e82caa 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -62,6 +62,7 @@
         "location-bar": "3.0.1",
         "lodash": "4.17.21",
         "marked": "12.0.0",
+        "mathjs": "13.1.1",
         "mini-css-extract-plugin": "2.7.6",
         "moment": "2.30.1",
         "moment-duration-format": "2.3.2",
@@ -643,6 +644,18 @@
         "node": ">=6.0.0"
       }
     },
+    "node_modules/@babel/runtime": {
+      "version": "7.25.6",
+      "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.25.6.tgz",
+      "integrity": "sha512-VBj9MYyDb9tuLq7yzqjgzt6Q+IBQLrGZfdjOekyEirZPHxXWoTSGUTMrpsfi58Up73d13NfYLv8HT9vmznjzhQ==",
+      "dev": true,
+      "dependencies": {
+        "regenerator-runtime": "^0.14.0"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
     "node_modules/@babel/template": {
       "version": "7.24.0",
       "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.24.0.tgz",
@@ -3088,6 +3101,19 @@
       "integrity": "sha512-W9pAhw0ja1Edb5GVdIF1mjZw/ASI0AlShXM83UUGe2DVr5TdAPEA1OA8m/g8zWp9x6On7gqufY+FatDbC3MDQg==",
       "dev": true
     },
+    "node_modules/complex.js": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/complex.js/-/complex.js-2.1.1.tgz",
+      "integrity": "sha512-8njCHOTtFFLtegk6zQo0kkVX1rngygb/KQI6z1qZxlFI3scluC+LVTCFbrkWjBv4vvLlbQ9t88IPMC6k95VTTg==",
+      "dev": true,
+      "engines": {
+        "node": "*"
+      },
+      "funding": {
+        "type": "patreon",
+        "url": "https://www.patreon.com/infusion"
+      }
+    },
     "node_modules/compressible": {
       "version": "2.0.18",
       "resolved": "https://registry.npmjs.org/compressible/-/compressible-2.0.18.tgz",
@@ -4033,6 +4059,12 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/decimal.js": {
+      "version": "10.4.3",
+      "resolved": "https://registry.npmjs.org/decimal.js/-/decimal.js-10.4.3.tgz",
+      "integrity": "sha512-VBBaLc1MgL5XpzgIP7ny5Z6Nx3UrRkIViUkPUdtl9aya5amy3De1gsUUSB1g3+3sExYNjCAsAznmukyxCb1GRA==",
+      "dev": true
+    },
     "node_modules/deep-is": {
       "version": "0.1.4",
       "resolved": "https://registry.npmjs.org/deep-is/-/deep-is-0.1.4.tgz",
@@ -4483,6 +4515,12 @@
       "integrity": "sha512-NiSupZ4OeuGwr68lGIeym/ksIZMJodUGOSCZ/FSnTxcrekbvqrgdUxlJOMpijaKZVjAJrWrGs/6Jy8OMuyj9ow==",
       "dev": true
     },
+    "node_modules/escape-latex": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/escape-latex/-/escape-latex-1.2.0.tgz",
+      "integrity": "sha512-nV5aVWW1K0wEiUIEdZ4erkGGH8mDxGyxSeqPzRNtWP7ataw+/olFObw7hujFWlVjNsaDFw5VZ5NzVSIqRgfTiw==",
+      "dev": true
+    },
     "node_modules/escape-string-regexp": {
       "version": "1.0.5",
       "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz",
@@ -5817,6 +5855,19 @@
         "node": ">= 0.6"
       }
     },
+    "node_modules/fraction.js": {
+      "version": "4.3.7",
+      "resolved": "https://registry.npmjs.org/fraction.js/-/fraction.js-4.3.7.tgz",
+      "integrity": "sha512-ZsDfxO51wGAXREY55a7la9LScWpwv9RxIrYABrlvOFBlH/ShPnrtsXeuUIfXKKOVicNxQ+o8JTbJvjS4M89yew==",
+      "dev": true,
+      "engines": {
+        "node": "*"
+      },
+      "funding": {
+        "type": "patreon",
+        "url": "https://github.com/sponsors/rawify"
+      }
+    },
     "node_modules/fresh": {
       "version": "0.5.2",
       "resolved": "https://registry.npmjs.org/fresh/-/fresh-0.5.2.tgz",
@@ -7063,6 +7114,12 @@
       "integrity": "sha512-UrzO3fL7nnxlQXlvTynNAenL+21oUQRlzqQFsA2U11ryb4+NLOCOePZ70PTojEaUKhiFugh7dG0Q+I58xlPdWg==",
       "dev": true
     },
+    "node_modules/javascript-natural-sort": {
+      "version": "0.7.1",
+      "resolved": "https://registry.npmjs.org/javascript-natural-sort/-/javascript-natural-sort-0.7.1.tgz",
+      "integrity": "sha512-nO6jcEfZWQXDhOiBtG2KvKyEptz7RVbpGP4vTD2hLBdmNQSsCiicO2Ioinv6UI4y9ukqnBpy+XZ9H6uLNgJTlw==",
+      "dev": true
+    },
     "node_modules/jest-worker": {
       "version": "27.5.1",
       "resolved": "https://registry.npmjs.org/jest-worker/-/jest-worker-27.5.1.tgz",
@@ -7708,6 +7765,29 @@
         "node": ">= 18"
       }
     },
+    "node_modules/mathjs": {
+      "version": "13.1.1",
+      "resolved": "https://registry.npmjs.org/mathjs/-/mathjs-13.1.1.tgz",
+      "integrity": "sha512-duaSAy7m4F+QtP1Dyv8MX2XuxcqpNDDlGly0SdVTCqpAmwdOFWilDdQKbLdo9RfD6IDNMOdo9tIsEaTXkconlQ==",
+      "dev": true,
+      "dependencies": {
+        "@babel/runtime": "^7.25.4",
+        "complex.js": "^2.1.1",
+        "decimal.js": "^10.4.3",
+        "escape-latex": "^1.2.0",
+        "fraction.js": "^4.3.7",
+        "javascript-natural-sort": "^0.7.1",
+        "seedrandom": "^3.0.5",
+        "tiny-emitter": "^2.1.0",
+        "typed-function": "^4.2.1"
+      },
+      "bin": {
+        "mathjs": "bin/cli.js"
+      },
+      "engines": {
+        "node": ">= 18"
+      }
+    },
     "node_modules/media-typer": {
       "version": "0.3.0",
       "resolved": "https://registry.npmjs.org/media-typer/-/media-typer-0.3.0.tgz",
@@ -9491,6 +9571,12 @@
         "node": ">= 0.10"
       }
     },
+    "node_modules/regenerator-runtime": {
+      "version": "0.14.1",
+      "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.14.1.tgz",
+      "integrity": "sha512-dYnhHh0nJoMfnkZs6GmmhFknAGRrLznOu5nc9ML+EJxGvrx6H7teuevqVqCuPcPK//3eDrrjQhehXVx9cnkGdw==",
+      "dev": true
+    },
     "node_modules/regex-parser": {
       "version": "2.3.0",
       "resolved": "https://registry.npmjs.org/regex-parser/-/regex-parser-2.3.0.tgz",
@@ -9847,6 +9933,12 @@
         "url": "https://opencollective.com/webpack"
       }
     },
+    "node_modules/seedrandom": {
+      "version": "3.0.5",
+      "resolved": "https://registry.npmjs.org/seedrandom/-/seedrandom-3.0.5.tgz",
+      "integrity": "sha512-8OwmbklUNzwezjGInmZ+2clQmExQPvomqjL7LFqOYqtmuxRgQYqOD3mHaU+MvZn5FLUeVxVfQjwLZW/n/JFuqg==",
+      "dev": true
+    },
     "node_modules/select-hose": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/select-hose/-/select-hose-2.0.0.tgz",
@@ -10833,6 +10925,15 @@
         "node": ">= 0.6"
       }
     },
+    "node_modules/typed-function": {
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/typed-function/-/typed-function-4.2.1.tgz",
+      "integrity": "sha512-EGjWssW7Tsk4DGfE+5yluuljS1OGYWiI1J6e8puZz9nTMM51Oug8CD5Zo4gWMsOhq5BI+1bF+rWTm4Vbj3ivRA==",
+      "dev": true,
+      "engines": {
+        "node": ">= 18"
+      }
+    },
     "node_modules/typedarray-to-buffer": {
       "version": "3.1.5",
       "resolved": "https://registry.npmjs.org/typedarray-to-buffer/-/typedarray-to-buffer-3.1.5.tgz",
diff --git a/package.json b/package.json
index 6e96eace12..be1e65a21b 100644
--- a/package.json
+++ b/package.json
@@ -65,6 +65,7 @@
     "location-bar": "3.0.1",
     "lodash": "4.17.21",
     "marked": "12.0.0",
+    "mathjs": "13.1.1",
     "mini-css-extract-plugin": "2.7.6",
     "moment": "2.30.1",
     "moment-duration-format": "2.3.2",
diff --git a/src/MCT.js b/src/MCT.js
index 6c16c3e8c2..4c875263e2 100644
--- a/src/MCT.js
+++ b/src/MCT.js
@@ -306,6 +306,7 @@ export class MCT extends EventEmitter {
     this.install(this.plugins.UserIndicator());
     this.install(this.plugins.Gauge());
     this.install(this.plugins.InspectorViews());
+    this.install(this.plugins.Comps());
   }
   /**
    * Set path to where assets are hosted.  This should be the path to main.js.
diff --git a/src/api/telemetry/TelemetryAPI.js b/src/api/telemetry/TelemetryAPI.js
index e5be70590f..81fa577550 100644
--- a/src/api/telemetry/TelemetryAPI.js
+++ b/src/api/telemetry/TelemetryAPI.js
@@ -760,6 +760,15 @@ export default class TelemetryAPI {
     return this.metadataCache.get(domainObject);
   }
 
+  /**
+   * Remove a domain object from the telemetry metadata cache.
+   * @param {import('openmct').DomainObject} domainObject
+   */
+
+  removeMetadataFromCache(domainObject) {
+    this.metadataCache.delete(domainObject);
+  }
+
   /**
    * Get a value formatter for a given valueMetadata.
    *
diff --git a/src/api/telemetry/TelemetryCollection.js b/src/api/telemetry/TelemetryCollection.js
index 602eb5ce87..ed1463933e 100644
--- a/src/api/telemetry/TelemetryCollection.js
+++ b/src/api/telemetry/TelemetryCollection.js
@@ -86,14 +86,23 @@ export default class TelemetryCollection extends EventEmitter {
     }
     this._setTimeSystem(this.options.timeContext.getTimeSystem());
     this.lastBounds = this.options.timeContext.getBounds();
+    // prioritize passed options over time bounds
+    if (this.options.start) {
+      this.lastBounds.start = this.options.start;
+    }
+    if (this.options.end) {
+      this.lastBounds.end = this.options.end;
+    }
     this._watchBounds();
     this._watchTimeSystem();
     this._watchTimeModeChange();
 
-    this._requestHistoricalTelemetry();
+    const historicalTelemetryLoadedPromise = this._requestHistoricalTelemetry();
     this._initiateSubscriptionTelemetry();
 
     this.loaded = true;
+
+    return historicalTelemetryLoadedPromise;
   }
 
   /**
@@ -113,6 +122,7 @@ export default class TelemetryCollection extends EventEmitter {
     }
 
     this.removeAllListeners();
+    this.loaded = false;
   }
 
   /**
@@ -168,7 +178,7 @@ export default class TelemetryCollection extends EventEmitter {
       return;
     }
 
-    this._processNewTelemetry(historicalData);
+    this._processNewTelemetry(historicalData, false);
   }
 
   /**
@@ -182,10 +192,9 @@ export default class TelemetryCollection extends EventEmitter {
     const options = { ...this.options };
     //We always want to receive all available values in telemetry tables.
     options.strategy = this.openmct.telemetry.SUBSCRIBE_STRATEGY.BATCH;
-
     this.unsubscribe = this.openmct.telemetry.subscribe(
       this.domainObject,
-      (datum) => this._processNewTelemetry(datum),
+      (datum) => this._processNewTelemetry(datum, true),
       options
     );
   }
@@ -196,9 +205,10 @@ export default class TelemetryCollection extends EventEmitter {
    *
    * @param  {(Object|Object[])} telemetryData - telemetry data object or
    * array of telemetry data objects
+   * @param  {boolean} isSubscriptionData - `true` if the telemetry data is new subscription data,
    * @private
    */
-  _processNewTelemetry(telemetryData) {
+  _processNewTelemetry(telemetryData, isSubscriptionData = false) {
     if (telemetryData === undefined) {
       return;
     }
@@ -213,12 +223,19 @@ export default class TelemetryCollection extends EventEmitter {
     let hasDataBeforeStartBound = false;
     let size = this.options.size;
     let enforceSize = size !== undefined && this.options.enforceSize;
+    const boundsToUse = this.lastBounds;
+    if (!isSubscriptionData && this.options.start) {
+      boundsToUse.start = this.options.start;
+    }
+    if (!isSubscriptionData && this.options.end) {
+      boundsToUse.end = this.options.end;
+    }
 
     // loop through, sort and dedupe
     for (let datum of data) {
       parsedValue = this.parseTime(datum);
-      beforeStartOfBounds = parsedValue < this.lastBounds.start;
-      afterEndOfBounds = parsedValue > this.lastBounds.end;
+      beforeStartOfBounds = parsedValue < boundsToUse.start;
+      afterEndOfBounds = parsedValue > boundsToUse.end;
 
       if (
         !afterEndOfBounds &&
@@ -397,7 +414,10 @@ export default class TelemetryCollection extends EventEmitter {
         this.emit('add', added, [this.boundedTelemetry.length]);
       }
     } else {
-      // user bounds change, reset
+      // user bounds change, reset and remove initial requested bounds (we're using new bounds)
+      delete this.options?.start;
+      delete this.options?.end;
+      this.lastBounds = bounds;
       this._reset();
     }
   }
@@ -477,9 +497,9 @@ export default class TelemetryCollection extends EventEmitter {
     this.boundedTelemetry = [];
     this.futureBuffer = [];
 
-    this.emit('clear');
+    const telemetryLoadPromise = this._requestHistoricalTelemetry();
 
-    this._requestHistoricalTelemetry();
+    this.emit('clear', telemetryLoadPromise);
   }
 
   /**
diff --git a/src/plugins/comps/CompsInspectorViewProvider.js b/src/plugins/comps/CompsInspectorViewProvider.js
new file mode 100644
index 0000000000..d2241ef2db
--- /dev/null
+++ b/src/plugins/comps/CompsInspectorViewProvider.js
@@ -0,0 +1,85 @@
+/*****************************************************************************
+ * Open MCT, Copyright (c) 2014-2024, United States Government
+ * as represented by the Administrator of the National Aeronautics and Space
+ * Administration. All rights reserved.
+ *
+ * Open MCT is licensed under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ * http://www.apache.org/licenses/LICENSE-2.0.
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations
+ * under the License.
+ *
+ * Open MCT includes source code licensed under additional open source
+ * licenses. See the Open Source Licenses file (LICENSES.md) included with
+ * this source code distribution or the Licensing information page available
+ * at runtime from the About dialog for additional information.
+ *****************************************************************************/
+
+import mount from 'utils/mount';
+
+import CompsInspectorView from './components/CompsInspectorView.vue';
+
+export default class ConditionSetViewProvider {
+  constructor(openmct, compsManagerPool) {
+    this.openmct = openmct;
+    this.name = 'Config';
+    this.key = 'comps-configuration';
+    this.compsManagerPool = compsManagerPool;
+  }
+
+  canView(selection) {
+    if (selection.length !== 1 || selection[0].length === 0) {
+      return false;
+    }
+
+    let object = selection[0][0].context.item;
+    return object && object.type === 'comps';
+  }
+
+  view(selection) {
+    let _destroy = null;
+    const domainObject = selection[0][0].context.item;
+    const openmct = this.openmct;
+    const compsManagerPool = this.compsManagerPool;
+
+    return {
+      show: function (element) {
+        const { destroy } = mount(
+          {
+            el: element,
+            components: {
+              CompsInspectorView: CompsInspectorView
+            },
+            provide: {
+              openmct,
+              domainObject,
+              compsManagerPool
+            },
+            template: '<comps-inspector-view></comps-inspector-view>'
+          },
+          {
+            app: openmct.app,
+            element
+          }
+        );
+        _destroy = destroy;
+      },
+      showTab: function (isEditing) {
+        return isEditing;
+      },
+      priority: function () {
+        return 1;
+      },
+      destroy: function () {
+        if (_destroy) {
+          _destroy();
+        }
+      }
+    };
+  }
+}
diff --git a/src/plugins/comps/CompsManager.js b/src/plugins/comps/CompsManager.js
new file mode 100644
index 0000000000..0fc0651619
--- /dev/null
+++ b/src/plugins/comps/CompsManager.js
@@ -0,0 +1,379 @@
+import { EventEmitter } from 'eventemitter3';
+
+export default class CompsManager extends EventEmitter {
+  #openmct;
+  #domainObject;
+  #composition;
+  #telemetryObjects = {};
+  #telemetryCollections = {};
+  #telemetryLoadedPromises = [];
+  #telemetryOptions = {};
+  #loaded = false;
+  #compositionLoaded = false;
+  #telemetryProcessors = {};
+  #loadVersion = 0;
+  #currentLoadPromise = null;
+
+  constructor(openmct, domainObject) {
+    super();
+    this.#openmct = openmct;
+    this.#domainObject = domainObject;
+    this.clearData = this.clearData.bind(this);
+  }
+
+  #getNextAlphabeticalParameterName() {
+    const parameters = this.#domainObject.configuration.comps.parameters;
+    const existingNames = new Set(parameters.map((p) => p.name));
+    const alphabet = 'abcdefghijklmnopqrstuvwxyz';
+    let suffix = '';
+    // eslint-disable-next-line no-constant-condition
+    while (true) {
+      for (let letter of alphabet) {
+        const proposedName = letter + suffix;
+        if (!existingNames.has(proposedName)) {
+          return proposedName;
+        }
+      }
+      // Increment suffix after exhausting the alphabet
+      suffix = (parseInt(suffix, 10) || 0) + 1;
+    }
+  }
+
+  addParameter(telemetryObject) {
+    const keyString = this.#openmct.objects.makeKeyString(telemetryObject.identifier);
+    const metaData = this.#openmct.telemetry.getMetadata(telemetryObject);
+    const timeSystem = this.#openmct.time.getTimeSystem();
+    const domains = metaData?.valuesForHints(['domain']);
+    const timeMetaData = domains.find((d) => d.key === timeSystem.key);
+    // in the valuesMetadata, find the first numeric data type
+    const rangeItems = metaData.valueMetadatas.filter(
+      (metaDatum) => metaDatum.hints && metaDatum.hints.range
+    );
+    rangeItems.sort((a, b) => a.hints.range - b.hints.range);
+    let valueToUse = rangeItems[0]?.key;
+    if (!valueToUse) {
+      // if no numeric data type, just use the first one
+      valueToUse = metaData.valueMetadatas[0]?.key;
+    }
+    this.#domainObject.configuration.comps.parameters.push({
+      keyString,
+      name: `${this.#getNextAlphabeticalParameterName()}`,
+      valueToUse,
+      testValue: 0,
+      timeMetaData,
+      accumulateValues: false,
+      sampleSize: 10
+    });
+    this.emit('parameterAdded', this.#domainObject);
+  }
+
+  getParameters() {
+    const parameters = this.#domainObject.configuration.comps.parameters;
+    const parametersWithTimeKey = parameters.map((parameter) => {
+      return {
+        ...parameter,
+        timeKey: this.#telemetryCollections[parameter.keyString]?.timeKey
+      };
+    });
+    return parametersWithTimeKey;
+  }
+
+  getTelemetryObjectForParameter(keyString) {
+    return this.#telemetryObjects[keyString];
+  }
+
+  getMetaDataValuesForParameter(keyString) {
+    const telemetryObject = this.getTelemetryObjectForParameter(keyString);
+    const metaData = this.#openmct.telemetry.getMetadata(telemetryObject);
+    return metaData.valueMetadatas;
+  }
+
+  deleteParameter(keyString) {
+    this.#domainObject.configuration.comps.parameters =
+      this.#domainObject.configuration.comps.parameters.filter(
+        (parameter) => parameter.keyString !== keyString
+      );
+    // if there are no parameters referencing this parameter keyString, remove the telemetry object too
+    const parameterExists = this.#domainObject.configuration.comps.parameters.some(
+      (parameter) => parameter.keyString === keyString
+    );
+    if (!parameterExists) {
+      this.emit('parameterRemoved', this.#domainObject);
+    }
+  }
+
+  setDomainObject(passedDomainObject) {
+    this.#domainObject = passedDomainObject;
+  }
+
+  isReady() {
+    return this.#loaded;
+  }
+
+  async load(telemetryOptions) {
+    // Increment the load version to mark a new load operation
+    const loadVersion = ++this.#loadVersion;
+
+    if (!_.isEqual(this.#telemetryOptions, telemetryOptions)) {
+      this.#destroy();
+    }
+
+    this.#telemetryOptions = telemetryOptions;
+
+    // Start the load process and store the promise
+    this.#currentLoadPromise = (async () => {
+      // Load composition if not already loaded
+      if (!this.#compositionLoaded) {
+        await this.#loadComposition();
+        // Check if a newer load has been initiated
+        if (loadVersion !== this.#loadVersion) {
+          await this.#currentLoadPromise;
+          return;
+        }
+        this.#compositionLoaded = true;
+      }
+
+      // Start listening to telemetry if not already done
+      if (!this.#loaded) {
+        await this.#startListeningToUnderlyingTelemetry();
+        // Check again for newer load
+        if (loadVersion !== this.#loadVersion) {
+          await this.#currentLoadPromise;
+          return;
+        }
+        this.#loaded = true;
+      }
+    })();
+
+    // Await the load process
+    await this.#currentLoadPromise;
+  }
+
+  async #startListeningToUnderlyingTelemetry() {
+    Object.keys(this.#telemetryCollections).forEach((keyString) => {
+      if (!this.#telemetryCollections[keyString].loaded) {
+        this.#telemetryCollections[keyString].on('add', this.#getTelemetryProcessor(keyString));
+        this.#telemetryCollections[keyString].on('clear', this.clearData);
+        const telemetryLoadedPromise = this.#telemetryCollections[keyString].load();
+        this.#telemetryLoadedPromises.push(telemetryLoadedPromise);
+      }
+    });
+    await Promise.all(this.#telemetryLoadedPromises);
+    this.#telemetryLoadedPromises = [];
+  }
+
+  #destroy() {
+    this.stopListeningToUnderlyingTelemetry();
+    this.#composition = null;
+    this.#telemetryCollections = {};
+    this.#compositionLoaded = false;
+    this.#loaded = false;
+    this.#telemetryObjects = {};
+  }
+
+  stopListeningToUnderlyingTelemetry() {
+    this.#loaded = false;
+    Object.keys(this.#telemetryCollections).forEach((keyString) => {
+      const specificTelemetryProcessor = this.#telemetryProcessors[keyString];
+      delete this.#telemetryProcessors[keyString];
+      this.#telemetryCollections[keyString].off('add', specificTelemetryProcessor);
+      this.#telemetryCollections[keyString].off('clear', this.clearData);
+      this.#telemetryCollections[keyString].destroy();
+    });
+  }
+
+  getTelemetryObjects() {
+    return this.#telemetryObjects;
+  }
+
+  async #loadComposition() {
+    this.#composition = this.#openmct.composition.get(this.#domainObject);
+    if (this.#composition) {
+      this.#composition.on('add', this.#addTelemetryObject);
+      this.#composition.on('remove', this.#removeTelemetryObject);
+      await this.#composition.load();
+    }
+  }
+
+  #getParameterForKeyString(keyString) {
+    return this.#domainObject.configuration.comps.parameters.find(
+      (parameter) => parameter.keyString === keyString
+    );
+  }
+
+  #getImputedDataUsingLOCF(datum, telemetryCollection) {
+    const telemetryCollectionData = telemetryCollection.getAll();
+    let insertionPointForNewData = telemetryCollection._sortedIndex(datum);
+    if (insertionPointForNewData && insertionPointForNewData >= telemetryCollectionData.length) {
+      insertionPointForNewData = telemetryCollectionData.length - 1;
+    }
+    // get the closest datum to the new datum
+    const closestDatum = telemetryCollectionData[insertionPointForNewData];
+    // clone the closest datum and replace the time key with the new time
+    const imputedData = {
+      ...closestDatum,
+      [telemetryCollection.timeKey]: datum[telemetryCollection.timeKey]
+    };
+    return imputedData;
+  }
+
+  getDataFrameForRequest() {
+    // Step 1: Collect all unique timestamps from all telemetry collections
+    const allTimestampsSet = new Set();
+
+    Object.values(this.#telemetryCollections).forEach((collection) => {
+      collection.getAll().forEach((dataPoint) => {
+        allTimestampsSet.add(dataPoint.timestamp);
+      });
+    });
+
+    // Convert the set to a sorted array
+    const allTimestamps = Array.from(allTimestampsSet).sort((a, b) => a - b);
+
+    // Step 2: Initialize the result object
+    const telemetryForComps = {};
+
+    // Step 3: Iterate through each telemetry collection to align data
+    Object.keys(this.#telemetryCollections).forEach((keyString) => {
+      const telemetryCollection = this.#telemetryCollections[keyString];
+      const alignedValues = [];
+
+      // Iterate through each common timestamp
+      allTimestamps.forEach((timestamp) => {
+        const timeKey = telemetryCollection.timeKey;
+        const fakeData = { [timeKey]: timestamp };
+        const imputedDatum = this.#getImputedDataUsingLOCF(fakeData, telemetryCollection);
+        if (imputedDatum) {
+          alignedValues.push(imputedDatum);
+        }
+      });
+
+      telemetryForComps[keyString] = alignedValues;
+    });
+
+    return telemetryForComps;
+  }
+
+  getDataFrameForSubscription(newTelemetry) {
+    const telemetryForComps = {};
+    const newTelemetryKey = Object.keys(newTelemetry)[0];
+    const newTelemetryParameter = this.#getParameterForKeyString(newTelemetryKey);
+    const newTelemetryData = newTelemetry[newTelemetryKey];
+    const otherTelemetryKeys = Object.keys(this.#telemetryCollections).slice(0);
+    if (newTelemetryParameter.accumulateValues) {
+      telemetryForComps[newTelemetryKey] = this.#telemetryCollections[newTelemetryKey].getAll();
+    } else {
+      telemetryForComps[newTelemetryKey] = newTelemetryData;
+    }
+    otherTelemetryKeys.forEach((keyString) => {
+      telemetryForComps[keyString] = [];
+    });
+
+    const otherTelemetryKeysNotAccumulating = otherTelemetryKeys.filter(
+      (keyString) => !this.#getParameterForKeyString(keyString).accumulateValues
+    );
+    const otherTelemetryKeysAccumulating = otherTelemetryKeys.filter(
+      (keyString) => this.#getParameterForKeyString(keyString).accumulateValues
+    );
+
+    // if we're accumulating, just add all the data
+    otherTelemetryKeysAccumulating.forEach((keyString) => {
+      telemetryForComps[keyString] = this.#telemetryCollections[keyString].getAll();
+    });
+
+    // for the others, march through the new telemetry data and add data to the frame from the other telemetry objects
+    // using LOCF
+    newTelemetryData.forEach((newDatum) => {
+      otherTelemetryKeysNotAccumulating.forEach((otherKeyString) => {
+        const otherCollection = this.#telemetryCollections[otherKeyString];
+        const imputedDatum = this.#getImputedDataUsingLOCF(newDatum, otherCollection);
+        if (imputedDatum) {
+          telemetryForComps[otherKeyString].push(imputedDatum);
+        }
+      });
+    });
+    return telemetryForComps;
+  }
+
+  #removeTelemetryObject = (telemetryObjectIdentifier) => {
+    const keyString = this.#openmct.objects.makeKeyString(telemetryObjectIdentifier);
+    delete this.#telemetryObjects[keyString];
+    this.#telemetryCollections[keyString]?.destroy();
+    delete this.#telemetryCollections[keyString];
+    // remove all parameters that reference this telemetry object
+    this.deleteParameter(keyString);
+  };
+
+  #requestUnderlyingTelemetry() {
+    const underlyingTelemetry = {};
+    Object.keys(this.#telemetryCollections).forEach((collectionKey) => {
+      const collection = this.#telemetryCollections[collectionKey];
+      underlyingTelemetry[collectionKey] = collection.getAll();
+    });
+    return underlyingTelemetry;
+  }
+
+  #getTelemetryProcessor(keyString) {
+    if (this.#telemetryProcessors[keyString]) {
+      return this.#telemetryProcessors[keyString];
+    }
+
+    const telemetryProcessor = (newTelemetry) => {
+      this.emit('underlyingTelemetryUpdated', { [keyString]: newTelemetry });
+    };
+    this.#telemetryProcessors[keyString] = telemetryProcessor;
+    return telemetryProcessor;
+  }
+
+  #telemetryProcessor = (newTelemetry, keyString) => {
+    this.emit('underlyingTelemetryUpdated', { [keyString]: newTelemetry });
+  };
+
+  clearData(telemetryLoadedPromise) {
+    this.#loaded = false;
+    if (telemetryLoadedPromise) {
+      this.#telemetryLoadedPromises.push(telemetryLoadedPromise);
+    }
+  }
+
+  setOutputFormat(outputFormat) {
+    this.#domainObject.configuration.comps.outputFormat = outputFormat;
+    this.emit('outputFormatChanged', outputFormat);
+  }
+
+  getOutputFormat() {
+    return this.#domainObject.configuration.comps.outputFormat;
+  }
+
+  getExpression() {
+    return this.#domainObject.configuration.comps.expression;
+  }
+
+  #addTelemetryObject = (telemetryObject) => {
+    const keyString = this.#openmct.objects.makeKeyString(telemetryObject.identifier);
+    this.#telemetryObjects[keyString] = telemetryObject;
+    this.#telemetryCollections[keyString] = this.#openmct.telemetry.requestCollection(
+      telemetryObject,
+      this.#telemetryOptions
+    );
+
+    // check to see if we have a corresponding parameter
+    // if not, add one
+    const parameterExists = this.#domainObject.configuration.comps.parameters.some(
+      (parameter) => parameter.keyString === keyString
+    );
+    if (!parameterExists) {
+      this.addParameter(telemetryObject);
+    }
+  };
+
+  static getCompsManager(domainObject, openmct, compsManagerPool) {
+    const id = openmct.objects.makeKeyString(domainObject.identifier);
+
+    if (!compsManagerPool[id]) {
+      compsManagerPool[id] = new CompsManager(openmct, domainObject);
+    }
+
+    return compsManagerPool[id];
+  }
+}
diff --git a/src/plugins/comps/CompsMathWorker.js b/src/plugins/comps/CompsMathWorker.js
new file mode 100644
index 0000000000..a0097c00ef
--- /dev/null
+++ b/src/plugins/comps/CompsMathWorker.js
@@ -0,0 +1,139 @@
+import { evaluate } from 'mathjs';
+
+// eslint-disable-next-line no-undef
+onconnect = function (e) {
+  const port = e.ports[0];
+
+  port.onmessage = function (event) {
+    const { type, callbackID, telemetryForComps, expression, parameters, newTelemetry } =
+      event.data;
+    let responseType = 'unknown';
+    let error = null;
+    let result = [];
+    try {
+      if (type === 'calculateRequest') {
+        responseType = 'calculationRequestResult';
+        console.debug(`📫 Received new calculation request with callback ID ${callbackID}`);
+        result = calculateRequest(telemetryForComps, parameters, expression);
+      } else if (type === 'calculateSubscription') {
+        responseType = 'calculationSubscriptionResult';
+        result = calculateSubscription(telemetryForComps, newTelemetry, parameters, expression);
+      } else if (type === 'init') {
+        port.postMessage({ type: 'ready' });
+        return;
+      } else {
+        throw new Error('Invalid message type');
+      }
+    } catch (errorInCalculation) {
+      error = errorInCalculation;
+    }
+    console.debug(`📭 Sending response for callback ID ${callbackID}`, result);
+    port.postMessage({ type: responseType, callbackID, result, error });
+  };
+};
+
+function getFullDataFrame(telemetryForComps, parameters) {
+  const dataFrame = {};
+  Object.keys(telemetryForComps)?.forEach((key) => {
+    const parameter = parameters.find((p) => p.keyString === key);
+    const dataSet = telemetryForComps[key];
+    const telemetryMap = new Map(dataSet.map((item) => [item[parameter.timeKey], item]));
+    dataFrame[key] = telemetryMap;
+  });
+  return dataFrame;
+}
+
+function calculateSubscription(telemetryForComps, newTelemetry, parameters, expression) {
+  const dataFrame = getFullDataFrame(telemetryForComps, parameters);
+  const calculation = calculate(dataFrame, parameters, expression);
+  const newTelemetryKey = Object.keys(newTelemetry)[0];
+  const newTelemetrySize = newTelemetry[newTelemetryKey].length;
+  let trimmedCalculation = calculation;
+  if (calculation.length > newTelemetrySize) {
+    trimmedCalculation = calculation.slice(calculation.length - newTelemetrySize);
+  }
+  return trimmedCalculation;
+}
+
+function calculateRequest(telemetryForComps, parameters, expression) {
+  const dataFrame = getFullDataFrame(telemetryForComps, parameters);
+  return calculate(dataFrame, parameters, expression);
+}
+
+function calculate(dataFrame, parameters, expression) {
+  const sumResults = [];
+  // ensure all parameter keyStrings have corresponding telemetry data
+  if (!expression) {
+    return sumResults;
+  }
+  // set up accumulated data structure
+  const accumulatedData = {};
+  parameters.forEach((parameter) => {
+    if (parameter.accumulateValues) {
+      accumulatedData[parameter.name] = [];
+    }
+  });
+
+  // take the first parameter keyString as the reference
+  const referenceParameter = parameters[0];
+  const otherParameters = parameters.slice(1);
+  // iterate over the reference telemetry data
+  const referenceTelemetry = dataFrame[referenceParameter.keyString];
+  referenceTelemetry?.forEach((referenceTelemetryItem) => {
+    let referenceValue = referenceTelemetryItem[referenceParameter.valueToUse];
+    if (referenceParameter.accumulateValues) {
+      accumulatedData[referenceParameter.name].push(referenceValue);
+      referenceValue = accumulatedData[referenceParameter.name];
+    }
+    if (
+      referenceParameter.accumulateValues &&
+      referenceParameter.sampleSize &&
+      referenceParameter.sampleSize > 0
+    ) {
+      // enforce sample size by ensuring referenceValue has the latest n elements
+      // if we don't have at least the sample size, skip this iteration
+      if (!referenceValue.length || referenceValue.length < referenceParameter.sampleSize) {
+        return;
+      }
+      referenceValue = referenceValue.slice(-referenceParameter.sampleSize);
+    }
+
+    const scope = {
+      [referenceParameter.name]: referenceValue
+    };
+    const referenceTime = referenceTelemetryItem[referenceParameter.timeKey];
+    // iterate over the other parameters to set the scope
+    let missingData = false;
+    otherParameters.forEach((parameter) => {
+      const otherDataFrame = dataFrame[parameter.keyString];
+      const otherTelemetry = otherDataFrame.get(referenceTime);
+      if (otherTelemetry === undefined || otherTelemetry === null) {
+        missingData = true;
+        return;
+      }
+      let otherValue = otherTelemetry[parameter.valueToUse];
+      if (parameter.accumulateValues) {
+        accumulatedData[parameter.name].push(referenceValue);
+        otherValue = accumulatedData[referenceParameter.name];
+      }
+      scope[parameter.name] = otherValue;
+    });
+    if (missingData) {
+      console.debug('🤦‍♂️ Missing data for some parameters, skipping calculation');
+      return;
+    }
+    const rawComputedValue = evaluate(expression, scope);
+    let computedValue = rawComputedValue;
+    if (computedValue.entries) {
+      // if there aren't any entries, return with nothing
+      if (computedValue.entries.length === 0) {
+        return;
+      }
+      console.debug('📊 Computed value is an array of entries', computedValue.entries);
+      // make array of arrays of entries
+      computedValue = computedValue.entries?.[0];
+    }
+    sumResults.push({ [referenceParameter.timeKey]: referenceTime, value: computedValue });
+  });
+  return sumResults;
+}
diff --git a/src/plugins/comps/CompsMetadataProvider.js b/src/plugins/comps/CompsMetadataProvider.js
new file mode 100644
index 0000000000..1b4a489277
--- /dev/null
+++ b/src/plugins/comps/CompsMetadataProvider.js
@@ -0,0 +1,79 @@
+/*****************************************************************************
+ * Open MCT, Copyright (c) 2014-2024, United States Government
+ * as represented by the Administrator of the National Aeronautics and Space
+ * Administration. All rights reserved.
+ *
+ * Open MCT is licensed under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ * http://www.apache.org/licenses/LICENSE-2.0.
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations
+ * under the License.
+ *
+ * Open MCT includes source code licensed under additional open source
+ * licenses. See the Open Source Licenses file (LICENSES.md) included with
+ * this source code distribution or the Licensing information page available
+ * at runtime from the About dialog for additional information.
+ *****************************************************************************/
+import CompsManager from './CompsManager.js';
+
+export default class CompsMetadataProvider {
+  #openmct = null;
+  #compsManagerPool = null;
+
+  constructor(openmct, compsManagerPool) {
+    this.#openmct = openmct;
+    this.#compsManagerPool = compsManagerPool;
+  }
+
+  supportsMetadata(domainObject) {
+    return domainObject.type === 'comps';
+  }
+
+  getDefaultDomains(domainObject) {
+    return this.#openmct.time.getAllTimeSystems().map(function (ts, i) {
+      return {
+        key: ts.key,
+        name: ts.name,
+        format: ts.timeFormat,
+        hints: {
+          domain: i
+        }
+      };
+    });
+  }
+
+  getMetadata(domainObject) {
+    const specificCompsManager = CompsManager.getCompsManager(
+      domainObject,
+      this.#openmct,
+      this.#compsManagerPool
+    );
+    // if there are any parameters, grab the first one's timeMetaData
+    const timeMetaData = specificCompsManager?.getParameters()[0]?.timeMetaData;
+    const metaDataToReturn = {
+      values: [
+        {
+          key: 'value',
+          name: 'Value',
+          derived: true,
+          formatString: specificCompsManager.getOutputFormat(),
+          hints: {
+            range: 1
+          }
+        }
+      ]
+    };
+    if (timeMetaData) {
+      metaDataToReturn.values.push(timeMetaData);
+    } else {
+      const defaultDomains = this.getDefaultDomains(domainObject);
+      metaDataToReturn.values.push(...defaultDomains);
+    }
+    return metaDataToReturn;
+  }
+}
diff --git a/src/plugins/comps/CompsTelemetryProvider.js b/src/plugins/comps/CompsTelemetryProvider.js
new file mode 100644
index 0000000000..c53676d80d
--- /dev/null
+++ b/src/plugins/comps/CompsTelemetryProvider.js
@@ -0,0 +1,175 @@
+/*****************************************************************************
+ * Open MCT, Copyright (c) 2014-2024, United States Government
+ * as represented by the Administrator of the National Aeronautics and Space
+ * Administration. All rights reserved.
+ *
+ * Open MCT is licensed under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ * http://www.apache.org/licenses/LICENSE-2.0.
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations
+ * under the License.
+ *
+ * Open MCT includes source code licensed under additional open source
+ * licenses. See the Open Source Licenses file (LICENSES.md) included with
+ * this source code distribution or the Licensing information page available
+ * at runtime from the About dialog for additional information.
+ *****************************************************************************/
+
+import CompsManager from './CompsManager.js';
+
+export default class CompsTelemetryProvider {
+  #openmct = null;
+  #sharedWorker = null;
+  #compsManagerPool = null;
+  #lastUniqueID = 1;
+  #requestPromises = {};
+  #subscriptionCallbacks = {};
+  // id is random 4 digit number
+  #id = Math.floor(Math.random() * 9000) + 1000;
+
+  constructor(openmct, compsManagerPool) {
+    this.#openmct = openmct;
+    this.#compsManagerPool = compsManagerPool;
+    this.#openmct.on('start', this.#startSharedWorker.bind(this));
+  }
+
+  isTelemetryObject(domainObject) {
+    return domainObject.type === 'comps';
+  }
+
+  supportsRequest(domainObject) {
+    return domainObject.type === 'comps';
+  }
+
+  supportsSubscribe(domainObject) {
+    return domainObject.type === 'comps';
+  }
+
+  #getCallbackID() {
+    return this.#lastUniqueID++;
+  }
+
+  request(domainObject, options) {
+    return new Promise((resolve, reject) => {
+      const specificCompsManager = CompsManager.getCompsManager(
+        domainObject,
+        this.#openmct,
+        this.#compsManagerPool
+      );
+      specificCompsManager.load(options).then(() => {
+        const callbackID = this.#getCallbackID();
+        const telemetryForComps = JSON.parse(
+          JSON.stringify(specificCompsManager.getDataFrameForRequest())
+        );
+        const expression = specificCompsManager.getExpression();
+        const parameters = JSON.parse(JSON.stringify(specificCompsManager.getParameters()));
+        if (!expression || !parameters) {
+          resolve([]);
+          return;
+        }
+        this.#requestPromises[callbackID] = { resolve, reject };
+        const payload = {
+          type: 'calculateRequest',
+          telemetryForComps,
+          expression,
+          parameters,
+          callbackID
+        };
+        this.#sharedWorker.port.postMessage(payload);
+      });
+    });
+  }
+
+  #computeOnNewTelemetry(specificCompsManager, callbackID, newTelemetry) {
+    if (!specificCompsManager.isReady()) {
+      return;
+    }
+    const expression = specificCompsManager.getExpression();
+    const telemetryForComps = specificCompsManager.getDataFrameForSubscription(newTelemetry);
+    const parameters = JSON.parse(JSON.stringify(specificCompsManager.getParameters()));
+    if (!expression || !parameters) {
+      return;
+    }
+    const payload = {
+      type: 'calculateSubscription',
+      telemetryForComps,
+      newTelemetry,
+      expression,
+      parameters,
+      callbackID
+    };
+    this.#sharedWorker.port.postMessage(payload);
+  }
+
+  subscribe(domainObject, callback) {
+    const specificCompsManager = CompsManager.getCompsManager(
+      domainObject,
+      this.#openmct,
+      this.#compsManagerPool
+    );
+    const callbackID = this.#getCallbackID();
+    this.#subscriptionCallbacks[callbackID] = callback;
+    const boundComputeOnNewTelemetry = this.#computeOnNewTelemetry.bind(
+      this,
+      specificCompsManager,
+      callbackID
+    );
+    specificCompsManager.on('underlyingTelemetryUpdated', boundComputeOnNewTelemetry);
+    const telemetryOptions = {
+      strategy: 'latest',
+      size: 1
+    };
+    specificCompsManager.load(telemetryOptions);
+    return () => {
+      delete this.#subscriptionCallbacks[callbackID];
+      specificCompsManager.stopListeningToUnderlyingTelemetry();
+      specificCompsManager.off('underlyingTelemetryUpdated', boundComputeOnNewTelemetry);
+    };
+  }
+
+  #startSharedWorker() {
+    if (this.#sharedWorker) {
+      throw new Error('Shared worker already started');
+    }
+    const sharedWorkerURL = `${this.#openmct.getAssetPath()}${__OPENMCT_ROOT_RELATIVE__}compsMathWorker.js`;
+
+    this.#sharedWorker = new SharedWorker(sharedWorkerURL, `Comps Math Worker`);
+    this.#sharedWorker.port.onmessage = this.onSharedWorkerMessage.bind(this);
+    this.#sharedWorker.port.onmessageerror = this.onSharedWorkerMessageError.bind(this);
+    this.#sharedWorker.port.start();
+
+    this.#sharedWorker.port.postMessage({ type: 'init' });
+
+    this.#openmct.on('destroy', () => {
+      this.#sharedWorker.port.close();
+    });
+  }
+
+  onSharedWorkerMessage(event) {
+    const { type, result, callbackID, error } = event.data;
+    if (
+      type === 'calculationSubscriptionResult' &&
+      this.#subscriptionCallbacks[callbackID] &&
+      result.length
+    ) {
+      this.#subscriptionCallbacks[callbackID](result);
+    } else if (type === 'calculationRequestResult' && this.#requestPromises[callbackID]) {
+      if (error) {
+        console.error('📝 Error calculating request:', event.data);
+        this.#requestPromises[callbackID].resolve([]);
+      } else {
+        this.#requestPromises[callbackID].resolve(result);
+      }
+      delete this.#requestPromises[callbackID];
+    }
+  }
+
+  onSharedWorkerMessageError(event) {
+    console.error('❌ Shared worker message error:', event);
+  }
+}
diff --git a/src/plugins/comps/CompsViewProvider.js b/src/plugins/comps/CompsViewProvider.js
new file mode 100644
index 0000000000..7939670e7f
--- /dev/null
+++ b/src/plugins/comps/CompsViewProvider.js
@@ -0,0 +1,98 @@
+/*****************************************************************************
+ * Open MCT, Copyright (c) 2014-2024, United States Government
+ * as represented by the Administrator of the National Aeronautics and Space
+ * Administration. All rights reserved.
+ *
+ * Open MCT is licensed under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ * http://www.apache.org/licenses/LICENSE-2.0.
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations
+ * under the License.
+ *
+ * Open MCT includes source code licensed under additional open source
+ * licenses. See the Open Source Licenses file (LICENSES.md) included with
+ * this source code distribution or the Licensing information page available
+ * at runtime from the About dialog for additional information.
+ *****************************************************************************/
+
+import mount from 'utils/mount';
+
+import CompsView from './components/CompsView.vue';
+
+const DEFAULT_VIEW_PRIORITY = 100;
+
+export default class ConditionSetViewProvider {
+  constructor(openmct, compsManagerPool) {
+    this.openmct = openmct;
+    this.name = 'Comps View';
+    this.key = 'comps.view';
+    this.cssClass = 'icon-derived-telemetry';
+    this.compsManagerPool = compsManagerPool;
+  }
+
+  canView(domainObject, objectPath) {
+    return domainObject.type === 'comps' && this.openmct.router.isNavigatedObject(objectPath);
+  }
+
+  canEdit(domainObject, objectPath) {
+    return domainObject.type === 'comps' && this.openmct.router.isNavigatedObject(objectPath);
+  }
+
+  view(domainObject, objectPath) {
+    let _destroy = null;
+    let component = null;
+
+    return {
+      show: (container, isEditing) => {
+        const { vNode, destroy } = mount(
+          {
+            el: container,
+            components: {
+              CompsView
+            },
+            provide: {
+              openmct: this.openmct,
+              domainObject,
+              objectPath,
+              compsManagerPool: this.compsManagerPool
+            },
+            data() {
+              return {
+                isEditing
+              };
+            },
+            template: '<CompsView :isEditing="isEditing"></CompsView>'
+          },
+          {
+            app: this.openmct.app,
+            element: container
+          }
+        );
+        _destroy = destroy;
+        component = vNode.componentInstance;
+      },
+      onEditModeChange: (isEditing) => {
+        component.isEditing = isEditing;
+      },
+      destroy: () => {
+        if (_destroy) {
+          _destroy();
+        }
+        component = null;
+      }
+    };
+  }
+
+  priority(domainObject) {
+    if (domainObject.type === 'comps') {
+      return Number.MAX_VALUE;
+    } else {
+      return DEFAULT_VIEW_PRIORITY;
+    }
+  }
+}
diff --git a/src/plugins/comps/components/CompsInspectorView.vue b/src/plugins/comps/components/CompsInspectorView.vue
new file mode 100644
index 0000000000..ff02eb94e7
--- /dev/null
+++ b/src/plugins/comps/components/CompsInspectorView.vue
@@ -0,0 +1,77 @@
+<!--
+ Open MCT, Copyright (c) 2014-2024, United States Government
+ as represented by the Administrator of the National Aeronautics and Space
+ Administration. All rights reserved.
+
+ Open MCT is licensed under the Apache License, Version 2.0 (the
+ "License"); you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+ http://www.apache.org/licenses/LICENSE-2.0.
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ License for the specific language governing permissions and limitations
+ under the License.
+
+ Open MCT includes source code licensed under additional open source
+ licenses. See the Open Source Licenses file (LICENSES.md) included with
+ this source code distribution or the Licensing information page available
+ at runtime from the About dialog for additional information.
+-->
+<template>
+  <div class="c-inspect-properties">
+    <template v-if="isEditing">
+      <ul class="c-inspect-properties__section">
+        <li class="c-inspect-properties__row">
+          <div class="c-inspect-properties__label" title="Output Format">
+            <label for="OutputFormatControl">Output Format</label>
+          </div>
+          <div class="c-inspect-properties__value">
+            <input
+              id="OutputFormatControl"
+              v-model="inputFormatValue"
+              type="text"
+              class="c-input--flex"
+              placeholder="e.g. %0.2f"
+              @change="changeInputFormat()"
+            />
+          </div>
+        </li>
+      </ul>
+    </template>
+  </div>
+</template>
+
+<script setup>
+import { inject, onBeforeMount, onBeforeUnmount, ref } from 'vue';
+
+import CompsManager from '../CompsManager';
+
+const isEditing = ref(false);
+const inputFormatValue = ref('');
+
+const openmct = inject('openmct');
+const domainObject = inject('domainObject');
+const compsManagerPool = inject('compsManagerPool');
+
+onBeforeMount(() => {
+  isEditing.value = openmct.editor.isEditing();
+  openmct.editor.on('isEditing', toggleEdit);
+  inputFormatValue.value = domainObject.configuration.comps.outputFormat;
+});
+
+onBeforeUnmount(() => {
+  openmct.editor.off('isEditing', toggleEdit);
+});
+
+function toggleEdit(passedIsEditing) {
+  isEditing.value = passedIsEditing;
+}
+
+function changeInputFormat() {
+  openmct.objects.mutate(domainObject, `configuration.comps.outputFormat`, inputFormatValue.value);
+  const compsManager = CompsManager.getCompsManager(domainObject, openmct, compsManagerPool);
+  compsManager.setOutputFormat(inputFormatValue.value);
+}
+</script>
diff --git a/src/plugins/comps/components/CompsView.vue b/src/plugins/comps/components/CompsView.vue
new file mode 100644
index 0000000000..1c2b599e4d
--- /dev/null
+++ b/src/plugins/comps/components/CompsView.vue
@@ -0,0 +1,399 @@
+<!--
+ Open MCT, Copyright (c) 2014-2024, United States Government
+ as represented by the Administrator of the National Aeronautics and Space
+ Administration. All rights reserved.
+
+ Open MCT is licensed under the Apache License, Version 2.0 (the
+ "License"); you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+ http://www.apache.org/licenses/LICENSE-2.0.
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ License for the specific language governing permissions and limitations
+ under the License.
+
+ Open MCT includes source code licensed under additional open source
+ licenses. See the Open Source Licenses file (LICENSES.md) included with
+ this source code distribution or the Licensing information page available
+ at runtime from the About dialog for additional information.
+-->
+
+<template>
+  <div class="c-comps" aria-label="Derived Telemetry">
+    <section class="c-section c-comps-output">
+      <div class="c-output-featured">
+        <span class="c-output-featured__label">Current Output</span>
+        <span class="c-output-featured__value" aria-label="Current Output Value">
+          <template
+            v-if="testDataApplied && currentTestOutput !== undefined && currentTestOutput !== null"
+          >
+            {{ currentTestOutput }}
+          </template>
+          <template
+            v-else-if="
+              !testDataApplied && currentCompOutput !== undefined && currentCompOutput !== null
+            "
+          >
+            {{ currentCompOutput }}
+          </template>
+          <template v-else> --- </template>
+        </span>
+      </div>
+    </section>
+    <section
+      id="telemetryReferenceSection"
+      class="c-comps__section c-comps__refs-and-controls"
+      aria-describedby="telemetryReferences"
+    >
+      <div class="c-cs__header c-section__header">
+        <div id="telemetryReferences" class="c-cs__header-label c-section__label">
+          Telemetry References
+        </div>
+      </div>
+
+      <div
+        v-if="isEditing"
+        class="c-comps__apply-test-data-control"
+        :class="['c-comps__refs-controls c-cdef__controls', { disabled: !parameters?.length }]"
+      >
+        <label class="c-toggle-switch">
+          <input type="checkbox" :checked="testDataApplied" @change="toggleTestData" />
+          <span class="c-toggle-switch__slider" aria-label="Apply Test Data"></span>
+          <span class="c-toggle-switch__label">Apply Test Values</span>
+        </label>
+      </div>
+      <div class="c-comps__refs">
+        <div v-for="parameter in parameters" :key="parameter.keyString" class="c-comps__ref">
+          <div class="c-comps__ref-section">
+            <div class="c-comps__ref-sub-section ref-and-path">
+              <span class="c-test-datum__string">Reference</span>
+              <input
+                v-if="isEditing"
+                v-model="parameter.name"
+                :aria-label="`Reference Name Input for ${parameter.name}`"
+                type="text"
+                class="c-input--md"
+                @change="updateParameters"
+              />
+              <div v-else class="--em">{{ parameter.name }}</div>
+              <span class="c-test-datum__string">=</span>
+              <span
+                class="c-comps__path-and-field"
+                :aria-label="`Reference ${parameter.name} Object Path`"
+              >
+                <ObjectPathString
+                  :domain-object="compsManager.getTelemetryObjectForParameter(parameter.keyString)"
+                  :show-object-itself="true"
+                  class="c-comp__ref-path --em"
+                />
+                <!-- drop down to select value from telemetry -->
+                <select
+                  v-if="isEditing"
+                  v-model="parameter.valueToUse"
+                  class="c-comp__ref-field"
+                  @change="updateParameters"
+                >
+                  <option
+                    v-for="parameterValueOption in compsManager.getMetaDataValuesForParameter(
+                      parameter.keyString
+                    )"
+                    :key="parameterValueOption.key"
+                    :value="parameterValueOption.key"
+                  >
+                    {{ parameterValueOption.name }}
+                  </option>
+                </select>
+                <div v-else class="c-comp__ref-field">{{ parameter.valueToUse }}</div>
+              </span>
+            </div>
+
+            <div
+              v-if="isEditing"
+              class="c-comps__ref-sub-section accum-vals"
+              :class="['c-comps__refs-controls', { disabled: !parameters?.length }]"
+            >
+              <label class="c-toggle-switch">
+                <span class="c-toggle-switch__label">Accumulate Values</span>
+                <input
+                  v-model="parameter.accumulateValues"
+                  type="checkbox"
+                  @change="updateAccumulateValues(parameter)"
+                />
+                <span
+                  class="c-toggle-switch__slider"
+                  aria-label="Toggle Parameter Accumulation"
+                ></span>
+              </label>
+
+              <span v-if="isEditing && parameter.accumulateValues" class="c-comps__label"
+                >Sample Size</span
+              >
+              <input
+                v-if="isEditing && parameter.accumulateValues"
+                v-model="parameter.sampleSize"
+                :aria-label="`Sample Size for ${parameter.name}`"
+                type="number"
+                class="c-input--sm c-comps__value"
+                @change="updateParameters"
+              />
+            </div>
+
+            <div
+              v-if="!isEditing && parameter.accumulateValues"
+              class="c-comps__ref-sub-section accum-vals"
+            >
+              Accumulating values with sample size {{ parameter.sampleSize }}
+            </div>
+          </div>
+
+          <div v-if="isEditing" class="c-comps__ref-section">
+            <span class="c-comps__label">Test value</span>
+            <input
+              v-if="isEditing"
+              v-model="parameter.testValue"
+              :aria-label="`Reference Test Value for ${parameter.name}`"
+              type="text"
+              class="c-input--md c-comps__value"
+              @change="updateTestValue(parameter)"
+            />
+          </div>
+        </div>
+      </div>
+    </section>
+    <section id="expressionSection" class="c-comps__section c-comps__expression">
+      <div class="c-cs__header c-section__header">
+        <div class="c-cs__header-label c-section__label">Expression</div>
+      </div>
+
+      <div v-if="!parameters?.length && isEditing" class="hint">
+        Drag in telemetry to add references for an expression.
+      </div>
+
+      <textarea
+        v-if="parameters?.length && isEditing"
+        v-model="expression"
+        class="c-comps__expression-value"
+        placeholder="Enter an expression"
+        @change="updateExpression"
+      ></textarea>
+      <div v-else>
+        <div class="c-comps__expression-value" aria-label="Expression">
+          {{ expression }}
+        </div>
+      </div>
+      <span
+        v-if="expression && expressionOutput"
+        class="icon-alert-triangle c-comps__expression-msg --bad"
+      >
+        Invalid: {{ expressionOutput }}
+      </span>
+      <span
+        v-else-if="expression && !expressionOutput && isEditing"
+        class="c-comps__expression-msg --good"
+      >
+        Expression valid
+      </span>
+    </section>
+  </div>
+</template>
+
+<script setup>
+import { evaluate } from 'mathjs';
+import { inject, onBeforeMount, onBeforeUnmount, ref, watch } from 'vue';
+
+import ObjectPathString from '../../../ui/components/ObjectPathString.vue';
+import CompsManager from '../CompsManager';
+
+const openmct = inject('openmct');
+const domainObject = inject('domainObject');
+const compsManagerPool = inject('compsManagerPool');
+const compsManager = CompsManager.getCompsManager(domainObject, openmct, compsManagerPool);
+const currentCompOutput = ref(null);
+const currentTestOutput = ref(null);
+const testDataApplied = ref(false);
+const parameters = ref(null);
+const expression = ref(null);
+const expressionOutput = ref(null);
+const outputFormat = ref(null);
+
+let outputTelemetryCollection;
+
+const props = defineProps({
+  isEditing: {
+    type: Boolean,
+    required: true
+  }
+});
+
+onBeforeMount(async () => {
+  let maxSampleSize = 20;
+  if (parameters.value) {
+    maxSampleSize =
+      parameters.value.reduce((max, param) => {
+        if (param.accumulateValues) {
+          return Math.max(max, param.sampleSize);
+        }
+        return max;
+      }, 0) + 20;
+  }
+
+  const telemetryOptions = {
+    strategy: 'minmax',
+    size: maxSampleSize
+  };
+  // TODO: we should dynamically set size to the largest comp input window
+  outputTelemetryCollection = openmct.telemetry.requestCollection(domainObject, telemetryOptions);
+  outputTelemetryCollection.on('add', telemetryProcessor);
+  outputTelemetryCollection.on('clear', clearData);
+  compsManager.on('parameterAdded', reloadParameters);
+  compsManager.on('parameterRemoved', reloadParameters);
+  compsManager.on('outputFormatChanged', updateOutputFormat);
+  await outputTelemetryCollection.load(telemetryOptions); // will implicitly load compsManager
+  parameters.value = compsManager.getParameters();
+  expression.value = compsManager.getExpression();
+  outputFormat.value = compsManager.getOutputFormat();
+  applyTestData();
+});
+
+onBeforeUnmount(() => {
+  outputTelemetryCollection.off('add', telemetryProcessor);
+  outputTelemetryCollection.off('clear', clearData);
+  compsManager.off('parameterAdded', reloadParameters);
+  compsManager.off('parameterRemoved', reloadParameters);
+  compsManager.off('outputFormatChanged', updateOutputFormat);
+  outputTelemetryCollection.destroy();
+});
+
+watch(
+  () => props.isEditing,
+  (editMode) => {
+    if (!editMode) {
+      testDataApplied.value = false;
+    }
+  }
+);
+
+function updateOutputFormat() {
+  outputFormat.value = compsManager.getOutputFormat();
+  // delete the metadata cache so that the new output format is used
+  openmct.telemetry.removeMetadataFromCache(domainObject);
+}
+
+function reloadParameters(passedDomainObject) {
+  // Because this is triggered by a composition change, we have
+  // to defer mutation of our domain object, otherwise we might
+  // mutate an outdated version of the domain object.
+  setTimeout(function () {
+    domainObject.configuration.comps.parameters = passedDomainObject.configuration.comps.parameters;
+    parameters.value = domainObject.configuration.comps.parameters;
+    openmct.objects.mutate(domainObject, `configuration.comps.parameters`, parameters.value);
+    compsManager.setDomainObject(domainObject);
+    applyTestData();
+  });
+}
+
+function updateParameters() {
+  openmct.objects.mutate(domainObject, `configuration.comps.parameters`, parameters.value);
+  compsManager.setDomainObject(domainObject);
+  applyTestData();
+  reload();
+}
+
+function updateAccumulateValues(parameter) {
+  if (parameter.accumulateValues) {
+    parameter.testValue = [''];
+  } else {
+    parameter.testValue = '';
+  }
+  updateParameters();
+}
+
+function updateTestValue(parameter) {
+  if (parameter.accumulateValues && parameter.testValue === '') {
+    parameter.testValue = [];
+  }
+  updateParameters();
+}
+
+function toggleTestData() {
+  testDataApplied.value = !testDataApplied.value;
+  if (testDataApplied.value) {
+    applyTestData();
+  } else {
+    clearData();
+  }
+}
+
+function updateExpression() {
+  openmct.objects.mutate(domainObject, `configuration.comps.expression`, expression.value);
+  compsManager.setDomainObject(domainObject);
+  applyTestData();
+  reload();
+}
+
+function getValueFormatter() {
+  const metaData = openmct.telemetry.getMetadata(domainObject);
+  const outputMetaDatum = metaData.values().find((metaDatum) => metaDatum.key === 'value');
+  return openmct.telemetry.getValueFormatter(outputMetaDatum);
+}
+
+function applyTestData() {
+  if (!expression.value || !parameters.value) {
+    return;
+  }
+  const scope = parameters.value.reduce((acc, parameter) => {
+    // try to parse the test value as JSON
+    try {
+      const parsedValue = JSON.parse(parameter.testValue);
+      acc[parameter.name] = parsedValue;
+    } catch (error) {
+      acc[parameter.name] = parameter.testValue;
+    }
+    return acc;
+  }, {});
+
+  // see which parameters are misconfigured as non-arrays
+  const misconfiguredParameterNames = parameters.value
+    .filter((parameter) => {
+      return parameter.accumulateValues && !Array.isArray(scope[parameter.name]);
+    })
+    .map((parameter) => parameter.name);
+  if (misconfiguredParameterNames.length) {
+    const misconfiguredParameterNamesString = misconfiguredParameterNames.join(', ');
+    currentTestOutput.value = null;
+    expressionOutput.value = `Reference "${misconfiguredParameterNamesString}" set to accumulating, but test values aren't arrays.`;
+    return;
+  }
+
+  try {
+    const testOutput = evaluate(expression.value, scope);
+    const formattedData = getValueFormatter().format(testOutput);
+    currentTestOutput.value = formattedData;
+    expressionOutput.value = null;
+  } catch (error) {
+    currentTestOutput.value = null;
+    expressionOutput.value = error.message;
+  }
+}
+
+function telemetryProcessor(data) {
+  if (testDataApplied.value) {
+    return;
+  }
+  // new data will come in as array, so just take the last element
+  const currentOutput = data[data.length - 1]?.value;
+  const formattedOutput = getValueFormatter().format(currentOutput);
+  currentCompOutput.value = formattedOutput;
+}
+
+function reload() {
+  clearData();
+  outputTelemetryCollection._requestHistoricalTelemetry();
+}
+
+function clearData() {
+  currentCompOutput.value = null;
+}
+</script>
diff --git a/src/plugins/comps/components/comps.scss b/src/plugins/comps/components/comps.scss
new file mode 100644
index 0000000000..988abd34ee
--- /dev/null
+++ b/src/plugins/comps/components/comps.scss
@@ -0,0 +1,153 @@
+/*****************************************************************************
+ * Open MCT, Copyright (c) 2014-2024, United States Government
+ * as represented by the Administrator of the National Aeronautics and Space
+ * Administration. All rights reserved.
+ *
+ * Open MCT is licensed under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ * http://www.apache.org/licenses/LICENSE-2.0.
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations
+ * under the License.
+ *
+ * Open MCT includes source code licensed under additional open source
+ * licenses. See the Open Source Licenses file (LICENSES.md) included with
+ * this source code distribution or the Licensing information page available
+ * at runtime from the About dialog for additional information.
+ *****************************************************************************/
+@mixin expressionMsg($fg, $bg) {
+  $op: 0.4;
+  color: rgba($fg, $op * 1.5);
+  background: rgba($bg, $op);
+}
+
+.c-comps {
+  display: flex;
+  flex-direction: column;
+  gap: $interiorMarginLg;
+
+  .is-editing & {
+    padding: $interiorMargin;
+  }
+
+  &__output {
+    display: flex;
+    align-items: baseline;
+    gap: $interiorMargin;
+
+    &-label {
+      flex: 0 0 auto;
+      text-transform: uppercase;
+    }
+
+    &-value {
+      flex: 0 1 auto;
+    }
+  }
+
+  &__section,
+  &__refs {
+    display: flex;
+    flex-direction: column;
+    gap: $interiorMarginSm;
+  }
+
+
+  &__apply-test-data-control {
+    padding: $interiorMargin 0;
+  }
+
+  &__refs {
+
+  }
+
+  &__ref {
+    @include discreteItem();
+    align-items: start;
+    display: flex;
+    flex-direction: column;
+    padding: 0 $interiorMargin;
+    line-height: 170%; // Aligns text with controls like selects
+
+    > * + * {
+      border-top: 1px solid $colorInteriorBorder;
+    }
+  }
+
+  &__ref-section {
+    align-items: baseline;
+    display: flex;
+    flex-wrap: wrap;
+    gap: $interiorMargin;
+    padding: $interiorMargin 0;
+    width: 100%;
+  }
+
+  &__ref-sub-section {
+    align-items: baseline;
+    display: flex;
+    flex: 1 1 auto;
+    gap: $interiorMargin;
+
+    &.ref-and-path {
+      flex: 0 1 auto;
+      flex-wrap: wrap;
+    }
+  }
+
+  &__path-and-field {
+    align-items: start;
+    display: flex;
+    flex-wrap: wrap;
+    gap: $interiorMargin;
+
+    .c-comp__ref-path {
+      word-break: break-all;
+    }
+  }
+
+  &__label,
+  &__value {
+    white-space: nowrap;
+  }
+
+  &__expression {
+    *[class*=value] {
+      font-family: monospace;
+      resize: vertical; // Only applies to textarea
+    }
+    div[class*=value] {
+      padding: $interiorMargin;
+    }
+  }
+
+  &__expression-msg {
+    @include expressionMsg($colorOkFg, $colorOk);
+    border-radius: $basicCr;
+    display: flex; // Creates hanging indent from :before icon
+    padding: $interiorMarginSm $interiorMarginLg $interiorMarginSm $interiorMargin;
+    max-width: max-content;
+
+    &:before {
+      content: $glyph-icon-check;
+      font-family: symbolsfont;
+      margin-right: $interiorMarginSm;
+    }
+
+    &.--bad {
+      @include expressionMsg($colorErrorFg, $colorError);
+
+      &:before {
+        content: $glyph-icon-alert-triangle;
+      }
+    }
+  }
+
+  .--em {
+    color: $colorBodyFgEm;
+  }
+}
diff --git a/src/plugins/comps/plugin.js b/src/plugins/comps/plugin.js
new file mode 100644
index 0000000000..19c1676954
--- /dev/null
+++ b/src/plugins/comps/plugin.js
@@ -0,0 +1,60 @@
+/*****************************************************************************
+ * Open MCT, Copyright (c) 2014-2024, United States Government
+ * as represented by the Administrator of the National Aeronautics and Space
+ * Administration. All rights reserved.
+ *
+ * Open MCT is licensed under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ * http://www.apache.org/licenses/LICENSE-2.0.
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations
+ * under the License.
+ *
+ * Open MCT includes source code licensed under additional open source
+ * licenses. See the Open Source Licenses file (LICENSES.md) included with
+ * this source code distribution or the Licensing information page available
+ * at runtime from the About dialog for additional information.
+ *****************************************************************************/
+import CompsInspectorViewProvider from './CompsInspectorViewProvider.js';
+import CompsMetadataProvider from './CompsMetadataProvider.js';
+import CompsTelemetryProvider from './CompsTelemetryProvider.js';
+import CompsViewProvider from './CompsViewProvider.js';
+
+export default function CompsPlugin() {
+  const compsManagerPool = {};
+
+  return function install(openmct) {
+    openmct.types.addType('comps', {
+      name: 'Derived Telemetry',
+      key: 'comps',
+      description:
+        'Add one or more telemetry end points, apply a mathematical operation to them, and output the result as new telemetry.',
+      creatable: true,
+      cssClass: 'icon-derived-telemetry',
+      initialize: function (domainObject) {
+        domainObject.configuration = {
+          comps: {
+            expression: '',
+            parameters: []
+          }
+        };
+        domainObject.composition = [];
+        domainObject.telemetry = {};
+      }
+    });
+    openmct.composition.addPolicy((parent, child) => {
+      if (parent.type === 'comps' && !openmct.telemetry.isTelemetryObject(child)) {
+        return false;
+      }
+      return true;
+    });
+    openmct.telemetry.addProvider(new CompsMetadataProvider(openmct, compsManagerPool));
+    openmct.telemetry.addProvider(new CompsTelemetryProvider(openmct, compsManagerPool));
+    openmct.objectViews.addProvider(new CompsViewProvider(openmct, compsManagerPool));
+    openmct.inspectorViews.addProvider(new CompsInspectorViewProvider(openmct, compsManagerPool));
+  };
+}
diff --git a/src/plugins/condition/ConditionInspectorViewProvider.js b/src/plugins/condition/ConditionInspectorViewProvider.js
new file mode 100644
index 0000000000..fc972f60ea
--- /dev/null
+++ b/src/plugins/condition/ConditionInspectorViewProvider.js
@@ -0,0 +1,53 @@
+// src/plugins/condition/ConditionInspectorView.js
+
+import mount from 'utils/mount';
+
+import ConditionConfigView from './components/ConditionInspectorConfigView.vue';
+
+export default function ConditionInspectorView(openmct) {
+  return {
+    key: 'condition-config',
+    name: 'Config',
+    canView: function (selection) {
+      return selection.length > 0 && selection[0][0].context.item.type === 'conditionSet';
+    },
+    view: function (selection) {
+      let _destroy = null;
+      const domainObject = selection[0][0].context.item;
+
+      return {
+        show: function (element) {
+          const { destroy } = mount(
+            {
+              el: element,
+              components: {
+                ConditionConfigView: ConditionConfigView
+              },
+              provide: {
+                openmct,
+                domainObject
+              },
+              template: '<condition-config-view></condition-config-view>'
+            },
+            {
+              app: openmct.app,
+              element
+            }
+          );
+          _destroy = destroy;
+        },
+        showTab: function (isEditing) {
+          return isEditing;
+        },
+        priority: function () {
+          return 1;
+        },
+        destroy: function () {
+          if (_destroy) {
+            _destroy();
+          }
+        }
+      };
+    }
+  };
+}
diff --git a/src/plugins/condition/ConditionManager.js b/src/plugins/condition/ConditionManager.js
index 4a18140cf7..10b7409eb6 100644
--- a/src/plugins/condition/ConditionManager.js
+++ b/src/plugins/condition/ConditionManager.js
@@ -24,6 +24,7 @@ import { EventEmitter } from 'eventemitter3';
 import { v4 as uuid } from 'uuid';
 
 import Condition from './Condition.js';
+import HistoricalTelemetryProvider from './HistoricalTelemetryProvider.js';
 import { getLatestTimestamp } from './utils/time.js';
 
 export default class ConditionManager extends EventEmitter {
@@ -46,6 +47,8 @@ export default class ConditionManager extends EventEmitter {
       applied: false
     };
     this.initialize();
+    this.telemetryBuffer = [];
+    this.isProcessing = false;
   }
 
   subscribeToTelemetry(telemetryObject) {
@@ -320,69 +323,18 @@ export default class ConditionManager extends EventEmitter {
     return currentCondition;
   }
 
-  getCurrentConditionLAD(conditionResults) {
-    const conditionCollection = this.conditionSetDomainObject.configuration.conditionCollection;
-    let currentCondition = conditionCollection[conditionCollection.length - 1];
-
-    for (let i = 0; i < conditionCollection.length - 1; i++) {
-      if (conditionResults[conditionCollection[i].id]) {
-        //first condition to be true wins
-        currentCondition = conditionCollection[i];
-        break;
-      }
-    }
-
-    return currentCondition;
-  }
-
-  async requestLADConditionSetOutput(options) {
-    if (!this.conditions.length) {
+  async getHistoricalData(options) {
+    if (!this.conditionSetDomainObject.configuration.shouldFetchHistorical) {
       return [];
     }
-
-    await this.compositionLoad;
-
-    let latestTimestamp;
-    let conditionResults = {};
-    let nextLegOptions = { ...options };
-    delete nextLegOptions.onPartialResponse;
-
-    const results = await Promise.all(
-      this.conditions.map((condition) => condition.requestLADConditionResult(nextLegOptions))
+    const historicalTelemetry = new HistoricalTelemetryProvider(
+      this.openmct,
+      this.conditions,
+      this.conditionSetDomainObject,
+      options
     );
-
-    results.forEach((resultObj) => {
-      const {
-        id,
-        data,
-        data: { result }
-      } = resultObj;
-
-      if (this.findConditionById(id)) {
-        conditionResults[id] = Boolean(result);
-      }
-
-      latestTimestamp = getLatestTimestamp(
-        latestTimestamp,
-        data,
-        this.timeSystems,
-        this.openmct.time.getTimeSystem()
-      );
-    });
-
-    if (!Object.values(latestTimestamp).some((timeSystem) => timeSystem)) {
-      return [];
-    }
-
-    const currentCondition = this.getCurrentConditionLAD(conditionResults);
-    const currentOutput = {
-      output: currentCondition.configuration.output,
-      id: this.conditionSetDomainObject.identifier,
-      conditionId: currentCondition.id,
-      ...latestTimestamp
-    };
-
-    return [currentOutput];
+    const historicalData = await historicalTelemetry.getHistoricalData();
+    return historicalData;
   }
 
   isTelemetryUsed(endpoint) {
@@ -409,13 +361,16 @@ export default class ConditionManager extends EventEmitter {
     const datum = data[0];
 
     const normalizedDatum = this.createNormalizedDatum(datum, endpoint);
-    const timeSystemKey = this.openmct.time.getTimeSystem().key;
-    let timestamp = {};
-    const currentTimestamp = normalizedDatum[timeSystemKey];
-    timestamp[timeSystemKey] = currentTimestamp;
-    if (this.shouldEvaluateNewTelemetry(currentTimestamp)) {
+    const keyString = this.openmct.objects.makeKeyString(endpoint.identifier);
+    const associatedTelemetryCollection = this.telemetryCollections[keyString];
+    const timeKey = associatedTelemetryCollection.timeKey;
+    const formattedTimeStamp = associatedTelemetryCollection.parseTime(datum);
+    const rawTimestamp = {
+      [timeKey]: datum[timeKey]
+    };
+    if (this.shouldEvaluateNewTelemetry(formattedTimeStamp)) {
       this.updateConditionResults(normalizedDatum);
-      this.updateCurrentCondition(timestamp);
+      this.updateCurrentCondition(rawTimestamp, endpoint, datum);
     }
   }
 
@@ -428,20 +383,75 @@ export default class ConditionManager extends EventEmitter {
     });
   }
 
-  updateCurrentCondition(timestamp) {
-    const currentCondition = this.getCurrentCondition();
+  emitConditionSetResult(currentCondition, timestamp, outputValue, result) {
+    const conditionSetResult = {
+      id: this.conditionSetDomainObject.identifier,
+      conditionId: currentCondition.id,
+      value: outputValue,
+      result,
+      ...timestamp
+    };
+    this.emit('conditionSetResultUpdated', conditionSetResult);
+  }
 
-    this.emit(
-      'conditionSetResultUpdated',
-      Object.assign(
-        {
-          output: currentCondition.configuration.output,
-          id: this.conditionSetDomainObject.identifier,
-          conditionId: currentCondition.id
-        },
+  updateCurrentCondition(timestamp, telemetryObject, telemetryData) {
+    this.telemetryBuffer.push({ timestamp, telemetryObject, telemetryData });
+
+    if (!this.isProcessing) {
+      this.processBuffer();
+    }
+  }
+
+  async processBuffer() {
+    this.isProcessing = true;
+
+    while (this.telemetryBuffer.length > 0) {
+      const { timestamp, telemetryObject, telemetryData } = this.telemetryBuffer.shift();
+      await this.processCondition(timestamp, telemetryObject, telemetryData);
+    }
+
+    this.isProcessing = false;
+  }
+
+  fetchUnderlyingTelemetry(currentCondition, telemetryObject, telemetryData, timestamp) {
+    let telemetryValue;
+    const selectedOutputIdentifier = currentCondition?.configuration?.outputTelemetry;
+    const outputMetadata = currentCondition?.configuration?.outputMetadata;
+    const telemetryKeystring = this.openmct.objects.makeKeyString(telemetryObject.identifier);
+
+    if (selectedOutputIdentifier === telemetryKeystring) {
+      telemetryValue = telemetryData[outputMetadata];
+    } else {
+      // grab it from the associated telemetry collection
+      const outputTelemetryCollection = this.telemetryCollections[selectedOutputIdentifier];
+      const latestTelemetryData = outputTelemetryCollection.getAll();
+      const lastValue = latestTelemetryData[latestTelemetryData.length - 1];
+      if (lastValue && lastValue?.[outputMetadata]) {
+        telemetryValue = lastValue?.[outputMetadata];
+      } else {
+        telemetryValue = null;
+      }
+    }
+    return telemetryValue;
+  }
+
+  processCondition(timestamp, telemetryObject, telemetryData) {
+    const currentCondition = this.getCurrentCondition();
+    const conditionDetails = this.conditions.filter(
+      (condition) => condition.id === currentCondition.id
+    )?.[0];
+    const conditionResult = currentCondition?.isDefault ? false : conditionDetails?.result;
+    let telemetryValue = currentCondition.configuration.output;
+    if (currentCondition?.configuration?.outputTelemetry) {
+      telemetryValue = this.fetchUnderlyingTelemetry(
+        currentCondition,
+        telemetryObject,
+        telemetryData,
         timestamp
-      )
-    );
+      );
+    }
+
+    this.emitConditionSetResult(currentCondition, timestamp, telemetryValue, conditionResult);
   }
 
   getTestData(metadatum) {
@@ -460,18 +470,7 @@ export default class ConditionManager extends EventEmitter {
 
   createNormalizedDatum(telemetryDatum, endpoint) {
     const id = this.openmct.objects.makeKeyString(endpoint.identifier);
-    const metadata = this.openmct.telemetry.getMetadata(endpoint).valueMetadatas;
-
-    const normalizedDatum = Object.values(metadata).reduce((datum, metadatum) => {
-      const testValue = this.getTestData(metadatum);
-      const formatter = this.openmct.telemetry.getValueFormatter(metadatum);
-      datum[metadatum.key] =
-        testValue !== undefined
-          ? formatter.parse(testValue)
-          : formatter.parse(telemetryDatum[metadatum.source]);
-
-      return datum;
-    }, {});
+    const normalizedDatum = { ...telemetryDatum };
 
     normalizedDatum.id = id;
 
diff --git a/src/plugins/condition/ConditionSetMetadataProvider.js b/src/plugins/condition/ConditionSetMetadataProvider.js
index 0d3190d49b..60bc434e1c 100644
--- a/src/plugins/condition/ConditionSetMetadataProvider.js
+++ b/src/plugins/condition/ConditionSetMetadataProvider.js
@@ -29,7 +29,7 @@ export default class ConditionSetMetadataProvider {
     return domainObject.type === 'conditionSet';
   }
 
-  getDomains(domainObject) {
+  getDefaultDomains(domainObject) {
     return this.openmct.time.getAllTimeSystems().map(function (ts, i) {
       return {
         key: ts.key,
@@ -43,34 +43,59 @@ export default class ConditionSetMetadataProvider {
   }
 
   getMetadata(domainObject) {
-    const enumerations = domainObject.configuration.conditionCollection.map((condition, index) => {
-      return {
-        string: condition.configuration.output,
-        value: index
-      };
+    const format = {};
+    domainObject.configuration.conditionCollection.forEach((condition, index) => {
+      if (condition?.configuration?.valueMetadata?.enumerations) {
+        delete format.formatString;
+        format.format = 'enum';
+        format.enumerations = condition?.configuration?.valueMetadata?.enumerations;
+      }
     });
 
-    return {
-      values: this.getDomains().concat([
+    const resultEnum = [
+      {
+        string: 'true',
+        value: true
+      },
+      {
+        string: 'false',
+        value: false
+      }
+    ];
+
+    const metaDataToReturn = {
+      values: [
         {
-          key: 'state',
-          source: 'output',
-          name: 'State',
-          format: 'enum',
-          enumerations: enumerations,
+          key: 'value',
+          name: 'Value',
           hints: {
             range: 1
           }
         },
         {
-          key: 'output',
-          name: 'Value',
-          format: 'string',
+          key: 'result',
+          source: 'result',
+          name: 'Result',
+          format: 'enum',
+          enumerations: resultEnum,
           hints: {
             range: 2
           }
         }
-      ])
+      ]
     };
+
+    // if there are any parameters, grab the first one's timeMetaData
+    const timeMetaData =
+      domainObject?.configuration?.conditionCollection[0]?.configuration.timeMetadata;
+
+    if (timeMetaData) {
+      metaDataToReturn.values.push(timeMetaData);
+    } else {
+      const defaultDomains = this.getDefaultDomains(domainObject);
+      metaDataToReturn.values.push(...defaultDomains);
+    }
+
+    return metaDataToReturn;
   }
 }
diff --git a/src/plugins/condition/ConditionSetTelemetryProvider.js b/src/plugins/condition/ConditionSetTelemetryProvider.js
index 38e7d4cb83..8a0d9e17e1 100644
--- a/src/plugins/condition/ConditionSetTelemetryProvider.js
+++ b/src/plugins/condition/ConditionSetTelemetryProvider.js
@@ -42,15 +42,17 @@ export default class ConditionSetTelemetryProvider {
 
   async request(domainObject, options) {
     let conditionManager = this.getConditionManager(domainObject);
-    let latestOutput = await conditionManager.requestLADConditionSetOutput(options);
-    return latestOutput;
+    const formattedHistoricalData = await conditionManager.getHistoricalData(options);
+    return formattedHistoricalData;
   }
 
   subscribe(domainObject, callback) {
     let conditionManager = this.getConditionManager(domainObject);
 
     conditionManager.on('conditionSetResultUpdated', (data) => {
-      callback(data);
+      if (data?.result) {
+        callback(data);
+      }
     });
 
     return this.destroyConditionManager.bind(
diff --git a/src/plugins/condition/HistoricalTelemetryProvider.js b/src/plugins/condition/HistoricalTelemetryProvider.js
new file mode 100644
index 0000000000..6d866d5af1
--- /dev/null
+++ b/src/plugins/condition/HistoricalTelemetryProvider.js
@@ -0,0 +1,285 @@
+import { evaluateResults } from './utils/evaluator.js';
+
+export default class HistoricalTelemetryProvider {
+  #telemetryOptions;
+  #telemetryObjects = {};
+  #conditions;
+  #conditionSetDomainObject;
+  #openmct;
+  #telemetryCollections = {};
+  #composition;
+  #outputTelemetryDetails = {};
+
+  constructor(openmct, conditions, conditionSetDomainObject, telemetryOptions) {
+    this.#openmct = openmct;
+    this.#conditions = conditions;
+    this.#conditionSetDomainObject = conditionSetDomainObject;
+    this.#telemetryOptions = telemetryOptions;
+    this.addTelemetryObject = this.addTelemetryObject.bind(this);
+    this.removeTelemetryObject = this.removeTelemetryObject.bind(this);
+  }
+
+  #evaluateTrueCondition() {
+    return null;
+  }
+
+  #getInputTelemetry(conditionCriteria, dataFrame, timestamp) {
+    if (conditionCriteria?.telemetry === 'all') {
+      // if the criteria is 'all', return all telemetry data
+      const allTelemetry = [];
+      Object.keys(dataFrame).forEach((key) => {
+        const telemetryData = dataFrame[key][timestamp];
+        telemetryData.id = key;
+        if (telemetryData) {
+          allTelemetry.push(telemetryData);
+        }
+      });
+      return allTelemetry;
+    }
+    if (!conditionCriteria?.telemetry) {
+      console.debug('🚨 Missing telemetry key in condition criteria - are we the default?');
+      return null;
+    }
+    const conditionInputTelemetryKeyString = this.#openmct.objects.makeKeyString(
+      conditionCriteria?.telemetry
+    );
+
+    const inputTelemetryByDate = dataFrame[conditionInputTelemetryKeyString];
+    if (!inputTelemetryByDate) {
+      console.debug(`🚨 Missing ALL data for ${conditionInputTelemetryKeyString}`);
+      return null;
+    }
+    const specificDatum = inputTelemetryByDate[timestamp];
+
+    if (!specificDatum) {
+      console.debug(`🚨 Missing data for ${conditionInputTelemetryKeyString} at ${timestamp}`);
+      return null;
+    }
+    specificDatum.id = conditionInputTelemetryKeyString;
+    return specificDatum;
+  }
+
+  #formatDatumForOutput(datum, metadata, result) {
+    const formattedDatum = {
+      ...datum,
+      value: datum[metadata],
+      result
+    };
+    return formattedDatum;
+  }
+
+  #computeHistoricalDatum(timestamp, dataFrame, timekey) {
+    for (let conditionIndex = 0; conditionIndex < this.#conditions.length; conditionIndex++) {
+      const condition = this.#conditions[conditionIndex];
+      const { id } = condition;
+      const conditionCriteria = condition?.criteria.length > 0;
+      let result = false;
+      let defaultHit = false;
+      if (conditionCriteria) {
+        result = evaluateResults(
+          condition.criteria.map((criterion) => {
+            const inputTelemetry = this.#getInputTelemetry(criterion, dataFrame, timestamp);
+            return criterion.computeResult({ id, ...inputTelemetry });
+          }),
+          condition?.trigger
+        );
+      } else {
+        // default criteria is 'all'
+        defaultHit = true;
+      }
+      if (result || defaultHit) {
+        // generate the output telemetry object if available
+        const outputTelmetryDetail = this.#outputTelemetryDetails[id];
+        if (
+          outputTelmetryDetail?.outputTelemetryKeyString &&
+          outputTelmetryDetail?.outputMetadata
+        ) {
+          const outputTelmetryDatum =
+            dataFrame[outputTelmetryDetail.outputTelemetryKeyString][timestamp];
+          const formattedDatum = this.#formatDatumForOutput(
+            outputTelmetryDatum,
+            outputTelmetryDetail.outputMetadata,
+            result
+          );
+          return formattedDatum;
+        } else if (outputTelmetryDetail?.staticOutputValue) {
+          const staticOutput = {
+            output: outputTelmetryDetail?.staticOutputValue,
+            [timekey]: timestamp,
+            result
+          };
+          return staticOutput;
+        }
+      }
+    }
+  }
+
+  async #loadTelemetryCollections() {
+    await Promise.all(
+      Object.entries(this.#telemetryObjects).map(async ([keystring, telemetryObject]) => {
+        // clone telemetry options without size as we need to load all data
+        const telemetryOptionsWithoutSize = { ...this.#telemetryOptions };
+        delete telemetryOptionsWithoutSize.size;
+        const telemetryCollection = this.#openmct.telemetry.requestCollection(
+          telemetryObject,
+          telemetryOptionsWithoutSize
+        );
+        await telemetryCollection.load();
+        this.#telemetryCollections[keystring] = telemetryCollection;
+      })
+    );
+  }
+
+  #computeHistoricalData(dataFrame) {
+    const historicalData = [];
+    if (Object.keys(dataFrame).length === 0) {
+      // if we have no telemetry data, return an empty object
+      return historicalData;
+    }
+
+    // use the first telemetry collection as the reference for the frame
+    const referenceTelemetryKeyString = Object.keys(dataFrame)[0];
+    const referenceTelemetryCollection = this.#telemetryCollections[referenceTelemetryKeyString];
+    const referenceTelemetryData = referenceTelemetryCollection.getAll();
+    referenceTelemetryData.forEach((datum) => {
+      const timestamp = datum[referenceTelemetryCollection.timeKey];
+      const historicalDatum = this.#computeHistoricalDatum(
+        timestamp,
+        dataFrame,
+        referenceTelemetryCollection.timeKey
+      );
+      if (historicalDatum) {
+        historicalData.push(historicalDatum);
+      }
+    });
+    return historicalData;
+  }
+
+  #getImputedDataUsingLOCF(datum, telemetryCollection) {
+    const telemetryCollectionData = telemetryCollection.getAll();
+    let insertionPointForNewData = telemetryCollection._sortedIndex(datum);
+    if (insertionPointForNewData && insertionPointForNewData >= telemetryCollectionData.length) {
+      insertionPointForNewData = telemetryCollectionData.length - 1;
+    }
+    // get the closest datum to the new datum
+    const closestDatum = telemetryCollectionData[insertionPointForNewData];
+    // clone the closest datum and replace the time key with the new time
+    const imputedData = {
+      ...closestDatum,
+      [telemetryCollection.timeKey]: datum[telemetryCollection.timeKey]
+    };
+    return imputedData;
+  }
+
+  #createDataFrame() {
+    // Step 1: Collect all unique timestamps from all telemetry collections
+    const allTimestampsSet = new Set();
+
+    Object.values(this.#telemetryCollections).forEach((collection) => {
+      collection.getAll().forEach((dataPoint) => {
+        const timeKey = collection.timeKey;
+        allTimestampsSet.add(dataPoint[timeKey]);
+      });
+    });
+
+    // Convert the set to a sorted array
+    const allTimestamps = Array.from(allTimestampsSet).sort((a, b) => a - b);
+
+    // Step 2: Initialize the result object
+    const dataFrame = {};
+
+    // Step 3: Iterate through each telemetry collection to align data
+    Object.keys(this.#telemetryCollections)?.forEach((keyString) => {
+      const telemetryCollection = this.#telemetryCollections[keyString];
+      const alignedValues = {};
+
+      // Iterate through each common timestamp
+      allTimestamps.forEach((timestamp) => {
+        const timeKey = telemetryCollection.timeKey;
+        const fakeData = { [timeKey]: timestamp };
+        const imputedDatum = this.#getImputedDataUsingLOCF(fakeData, telemetryCollection);
+        if (imputedDatum) {
+          alignedValues[timestamp] = imputedDatum;
+        } else {
+          console.debug(`🚨 Missing data for ${keyString} at ${timestamp}`);
+        }
+      });
+
+      dataFrame[keyString] = alignedValues;
+    });
+    return dataFrame;
+  }
+
+  addTelemetryObject(telemetryObjectToAdd) {
+    const keyString = this.#openmct.objects.makeKeyString(telemetryObjectToAdd.identifier);
+    this.#telemetryObjects[keyString] = telemetryObjectToAdd;
+  }
+
+  removeTelemetryObject(telemetryIdentifierToRemove) {
+    const keyStringToRemove = this.#openmct.objects.makeKeyString(telemetryIdentifierToRemove);
+    this.#telemetryObjects = this.#telemetryObjects.filter((existingTelemetryObject) => {
+      const existingKeyString = this.#openmct.objects.makeKeyString(
+        existingTelemetryObject.identifier
+      );
+      return keyStringToRemove !== existingKeyString;
+    });
+  }
+
+  destroy() {
+    this.#composition.off('add', this.addTelemetryObject);
+    this.#composition.off('remove', this.removeTelemetryObject);
+    Object.keys(this.#telemetryCollections).forEach((key) => {
+      this.#telemetryCollections[key]?.destroy();
+    });
+  }
+
+  async #loadComposition() {
+    // load the composition of the condition set
+    this.#composition = this.#openmct.composition.get(this.#conditionSetDomainObject);
+    if (this.#composition) {
+      this.#composition.on('add', this.addTelemetryObject);
+      this.#composition.on('remove', this.removeTelemetryObject);
+      await this.#composition.load();
+    }
+  }
+
+  #processConditionSet() {
+    const conditionCollection = this.#conditionSetDomainObject.configuration.conditionCollection;
+    conditionCollection.forEach((condition, index) => {
+      const { outputTelemetry, outputMetadata, output } = condition.configuration;
+      if (outputTelemetry && outputMetadata) {
+        this.#outputTelemetryDetails[condition.id] = {
+          outputTelemetryKeyString: outputTelemetry,
+          outputMetadata
+        };
+      } else if (output) {
+        this.#outputTelemetryDetails[condition.id] = {
+          staticOutputValue: output
+        };
+      }
+    });
+  }
+
+  async getHistoricalData() {
+    console.debug('🍯 Getting historical data');
+    // get the telemetry objects from the condition set
+    await this.#loadComposition();
+    console.debug('🍯 Loaded telemetry objects', this.#telemetryObjects);
+    if (!this.#telemetryObjects) {
+      console.debug('🚨 No telemetry objects found in condition set');
+      return [];
+    }
+    console.debug('🍯 Processed Condition Set', this.#outputTelemetryDetails);
+    this.#processConditionSet();
+    // load telemetry collections for each telemetry object
+    await this.#loadTelemetryCollections();
+    console.debug('🍯 Loaded Telemetry Collections', this.#telemetryCollections);
+    // create data frame from telemetry collections
+    const dataFrame = this.#createDataFrame();
+    console.debug('🍯 Created data frame', dataFrame);
+    // compute historical data from data frame
+    const computedHistoricalData = this.#computeHistoricalData(dataFrame);
+    console.debug('🍯 Computed historical data', computedHistoricalData);
+    return computedHistoricalData;
+  }
+}
diff --git a/src/plugins/condition/components/ConditionCollection.vue b/src/plugins/condition/components/ConditionCollection.vue
index 84b5aff008..146955002f 100644
--- a/src/plugins/condition/components/ConditionCollection.vue
+++ b/src/plugins/condition/components/ConditionCollection.vue
@@ -235,10 +235,11 @@ export default {
 
       return arr;
     },
-    addTelemetryObject(domainObject) {
+    async addTelemetryObject(domainObject) {
       const keyString = this.openmct.objects.makeKeyString(domainObject.identifier);
+      const telemetryPath = await this.getFullTelemetryPath(domainObject);
 
-      this.telemetryObjs.push(domainObject);
+      this.telemetryObjs.push({ ...domainObject, path: telemetryPath });
       this.$emit('telemetry-updated', this.telemetryObjs);
 
       this.subscribeToStaleness(domainObject, (stalenessResponse) => {
@@ -248,6 +249,19 @@ export default {
         });
       });
     },
+    async getFullTelemetryPath(telemetry) {
+      const keyString = this.openmct.objects.makeKeyString(telemetry.identifier);
+      const originalPathObjects = await this.openmct.objects.getOriginalPath(keyString, []);
+
+      const telemetryPath = originalPathObjects.reverse().map((pathObject) => {
+        if (pathObject.type !== 'root') {
+          return pathObject.name;
+        }
+        return undefined;
+      });
+
+      return telemetryPath.join('/');
+    },
     removeTelemetryObject(identifier) {
       const keyString = this.openmct.objects.makeKeyString(identifier);
       const index = this.telemetryObjs.findIndex((obj) => {
diff --git a/src/plugins/condition/components/ConditionInspectorConfigView.vue b/src/plugins/condition/components/ConditionInspectorConfigView.vue
new file mode 100644
index 0000000000..02c0539ec0
--- /dev/null
+++ b/src/plugins/condition/components/ConditionInspectorConfigView.vue
@@ -0,0 +1,62 @@
+<template>
+  <div class="c-inspect-properties">
+    <h2>Configuration</h2>
+    <section>
+      <div class="c-form-row">
+        <label for="historical-toggle">Enable Historical: </label>
+        <ToggleSwitch
+          id="historical-toggle"
+          class="c-toggle-switch"
+          :checked="historicalEnabled"
+          name="condition-historical-toggle"
+          @change="onToggleChange"
+        />
+      </div>
+    </section>
+  </div>
+</template>
+
+<script>
+import ToggleSwitch from '../../../ui/components/ToggleSwitch.vue';
+
+export default {
+  components: {
+    ToggleSwitch
+  },
+  inject: ['openmct', 'domainObject'],
+  data() {
+    return {
+      historicalEnabled: false
+    };
+  },
+  mounted() {
+    this.historicalEnabled = this.domainObject.configuration.shouldFetchHistorical;
+  },
+  methods: {
+    onToggleChange() {
+      this.historicalEnabled = !this.historicalEnabled;
+      this.openmct.objects.mutate(
+        this.domainObject,
+        'configuration.shouldFetchHistorical',
+        this.historicalEnabled
+      );
+    }
+  }
+};
+</script>
+
+<style scoped>
+.c-inspect-properties {
+  padding: 10px;
+}
+
+.c-form-row {
+  display: flex;
+  align-items: center;
+  margin-bottom: 10px;
+}
+
+label {
+  margin-right: 10px;
+}
+</style>
diff --git a/src/plugins/condition/components/ConditionItem.vue b/src/plugins/condition/components/ConditionItem.vue
index b24045c59a..0554c96c21 100644
--- a/src/plugins/condition/components/ConditionItem.vue
+++ b/src/plugins/condition/components/ConditionItem.vue
@@ -99,13 +99,13 @@
               @change="setOutputValue"
             >
               <option v-for="option in outputOptions" :key="option" :value="option">
-                {{ initCap(option) }}
+                {{ option }}
               </option>
             </select>
           </span>
           <span class="c-cdef__control">
             <input
-              v-if="selectedOutputSelection === outputOptions[2]"
+              v-if="selectedOutputSelection === outputOptions[3]"
               v-model="condition.configuration.output"
               aria-label="Condition Output String"
               class="t-condition-name-input"
@@ -113,8 +113,41 @@
               @change="persist"
             />
           </span>
+          <span v-if="selectedOutputSelection === telemetryValueString" class="c-cdef__control">
+            <select
+              v-model="condition.configuration.outputTelemetry"
+              aria-label="Output Telemetry Selection"
+              @change="persist"
+            >
+              <option value="">- Select Telemetry -</option>
+              <option
+                v-for="telemetryOption in telemetry"
+                :key="openmct.objects.makeKeyString(telemetryOption.identifier)"
+                :value="openmct.objects.makeKeyString(telemetryOption.identifier)"
+              >
+                {{ telemetryOption.path }}
+              </option>
+            </select>
+          </span>
+          <span v-if="condition.configuration.outputTelemetry" class="c-cdef__control">
+            <select
+              v-model="condition.configuration.outputMetadata"
+              aria-label="Output Telemetry Metadata Selection"
+              @change="persist"
+            >
+              <option value="">- Select Field -</option>
+              <option
+                v-for="(option, index) in telemetryMetadataOptions[
+                  condition.configuration.outputTelemetry
+                ]"
+                :key="index"
+                :value="option.key"
+              >
+                {{ option.name }}
+              </option>
+            </select>
+          </span>
         </span>
-
         <div v-if="!condition.isDefault" class="c-cdef__match-and-criteria">
           <span class="c-cdef__separator c-row-separator"></span>
           <span class="c-cdef__label">Match</span>
@@ -183,7 +216,12 @@
         <span class="c-condition__name">
           {{ condition.configuration.name }}
         </span>
-        <span class="c-condition__output"> Output: {{ condition.configuration.output }} </span>
+        <span class="c-condition__output">
+          Output:
+          {{
+            condition.configuration.output === undefined ? 'none' : condition.configuration.output
+          }}
+        </span>
       </div>
       <div class="c-condition__summary">
         <ConditionDescription :show-label="false" :condition="condition" />
@@ -197,6 +235,7 @@ import { v4 as uuid } from 'uuid';
 
 import { TRIGGER, TRIGGER_LABEL } from '@/plugins/condition/utils/constants';
 
+import { TELEMETRY_VALUE } from '../utils/constants.js';
 import ConditionDescription from './ConditionDescription.vue';
 import Criterion from './CriterionItem.vue';
 
@@ -252,10 +291,13 @@ export default {
       expanded: true,
       trigger: 'all',
       selectedOutputSelection: '',
-      outputOptions: ['false', 'true', 'string'],
+      telemetryValueString: TELEMETRY_VALUE,
+      outputOptions: ['none', 'false', 'true', 'string', TELEMETRY_VALUE],
       criterionIndex: 0,
       draggingOver: false,
-      isDefault: this.condition.isDefault
+      isDefault: this.condition.isDefault,
+      telemetryMetadataOptions: {},
+      telemetryFormats: new Map()
     };
   },
   computed: {
@@ -289,32 +331,64 @@ export default {
       return false;
     }
   },
+  watch: {
+    condition: {
+      handler() {
+        const config = this.condition?.configuration;
+        if (config?.output !== TELEMETRY_VALUE) {
+          config.outputTelemetry = null;
+          config.outputMetadata = null;
+          config.timeMetadata = null;
+        }
+      },
+      deep: true
+    },
+    telemetry: {
+      handler() {
+        this.initializeMetadata();
+      },
+      deep: true
+    }
+  },
   unmounted() {
     this.destroy();
   },
   mounted() {
     this.setOutputSelection();
+    this.initializeMetadata();
   },
   methods: {
     setOutputSelection() {
       let conditionOutput = this.condition.configuration.output;
-      if (conditionOutput) {
-        if (conditionOutput !== 'false' && conditionOutput !== 'true') {
-          this.selectedOutputSelection = 'string';
-        } else {
-          this.selectedOutputSelection = conditionOutput;
-        }
+      if (conditionOutput === undefined) {
+        this.selectedOutputSelection = 'none';
+      } else if (['false', 'true', TELEMETRY_VALUE].includes(conditionOutput)) {
+        this.selectedOutputSelection = conditionOutput;
+      } else {
+        this.selectedOutputSelection = 'string';
       }
     },
     setOutputValue() {
       if (this.selectedOutputSelection === 'string') {
         this.condition.configuration.output = '';
+      } else if (this.selectedOutputSelection === 'none') {
+        this.condition.configuration.output = undefined;
       } else {
         this.condition.configuration.output = this.selectedOutputSelection;
       }
 
       this.persist();
     },
+    getOutputMetadata() {
+      const config = this.condition.configuration;
+      let valueMetadata;
+      if (config?.outputTelemetry && config?.outputMetadata) {
+        valueMetadata = this.telemetryFormats.get(
+          `${config?.outputTelemetry}_${config?.outputMetadata}`
+        );
+      }
+      return valueMetadata;
+    },
     addCriteria() {
       const criteriaObject = {
         id: uuid(),
@@ -396,13 +470,56 @@ export default {
       this.condition.configuration.criteria.splice(index + 1, 0, clonedCriterion);
       this.persist();
     },
+    persistTimeMetadata() {
+      if (!this.condition.configuration.outputTelemetry) {
+        return;
+      }
+      const outputTelemetryObject = this.telemetry.find(
+        (telemetryItem) =>
+          this.openmct.objects.makeKeyString(telemetryItem.identifier) ===
+          this.condition.configuration.outputTelemetry
+      );
+      const timeSystem = this.openmct.time.getTimeSystem();
+      const telemetryMetadata = this.openmct.telemetry.getMetadata(outputTelemetryObject);
+      const domains = telemetryMetadata?.valuesForHints(['domain']);
+      const timeMetaData = domains.find((d) => d.key === timeSystem.key);
+      if (telemetryMetadata) {
+        this.condition.configuration.timeMetadata = timeMetaData;
+      }
+    },
     persist() {
+      const valueMetadata = this.getOutputMetadata();
+      if (valueMetadata) {
+        this.condition.configuration.valueMetadata = valueMetadata;
+        this.persistTimeMetadata();
+      }
       this.$emit('update-condition', {
         condition: this.condition
       });
     },
     initCap(str) {
       return str.charAt(0).toUpperCase() + str.slice(1);
+    },
+    initializeMetadata() {
+      this.telemetry.forEach((telemetryObject) => {
+        const id = this.openmct.objects.makeKeyString(telemetryObject.identifier);
+        let telemetryMetadata = this.openmct.telemetry.getMetadata(telemetryObject);
+        if (telemetryMetadata) {
+          this.telemetryMetadataOptions[id] = telemetryMetadata.values().slice();
+          telemetryMetadata.values().forEach((telemetryValue) => {
+            this.telemetryFormats.set(`${id}_${telemetryValue.key}`, telemetryValue);
+          });
+        } else {
+          this.telemetryMetadataOptions[id] = [];
+        }
+      });
+    },
+    getId(identifier) {
+      if (identifier) {
+        return this.openmct.objects.makeKeyString(identifier);
+      }
+
+      return [];
     }
   }
 };
diff --git a/src/plugins/condition/components/ConditionSet.vue b/src/plugins/condition/components/ConditionSet.vue
index bdefc5ff5c..bb1a03b454 100644
--- a/src/plugins/condition/components/ConditionSet.vue
+++ b/src/plugins/condition/components/ConditionSet.vue
@@ -23,9 +23,9 @@
 <template>
   <div class="c-cs" :class="{ 'is-stale': isStale }" aria-label="Condition Set">
     <section class="c-cs__current-output c-section">
-      <div class="c-cs__content c-cs__current-output-value">
-        <span class="c-cs__current-output-value__label">Current Output</span>
-        <span class="c-cs__current-output-value__value" aria-label="Current Output Value">
+      <div class="c-output-featured">
+        <span class="c-output-featured__label">Current Output</span>
+        <span class="c-output-featured__value" aria-label="Current Output Value">
           <template v-if="currentConditionOutput">
             {{ currentConditionOutput }}
           </template>
@@ -86,7 +86,7 @@ export default {
   },
   methods: {
     updateCurrentOutput(currentConditionResult) {
-      this.currentConditionOutput = currentConditionResult.output;
+      this.currentConditionOutput = currentConditionResult.value;
     },
     updateDefaultOutput(output) {
       this.currentConditionOutput = output;
diff --git a/src/plugins/condition/components/CriterionItem.vue b/src/plugins/condition/components/CriterionItem.vue
index a632d675a1..4d0b94e094 100644
--- a/src/plugins/condition/components/CriterionItem.vue
+++ b/src/plugins/condition/components/CriterionItem.vue
@@ -40,7 +40,7 @@
             :key="telemetryOption.identifier.key"
             :value="telemetryOption.identifier"
           >
-            {{ telemetryOption.name }}
+            {{ telemetryOption.path }}
           </option>
         </select>
       </span>
diff --git a/src/plugins/condition/components/TestData.vue b/src/plugins/condition/components/TestData.vue
index 7d25680703..d087d948e7 100644
--- a/src/plugins/condition/components/TestData.vue
+++ b/src/plugins/condition/components/TestData.vue
@@ -63,7 +63,7 @@
                   :key="index"
                   :value="telemetryOption.identifier"
                 >
-                  {{ telemetryOption.name }}
+                  {{ telemetryOption.path || telemetryOption.name }}
                 </option>
               </select>
             </span>
@@ -147,7 +147,8 @@ export default {
       expanded: true,
       isApplied: false,
       testInputs: [],
-      telemetryMetadataOptions: {}
+      telemetryMetadataOptions: {},
+      telemetryPaths: []
     };
   },
   watch: {
@@ -244,6 +245,22 @@ export default {
         applied: this.isApplied,
         conditionTestInputs: this.testInputs
       });
+    },
+    async getFullTelemetryPath(telemetry) {
+      const keyStringForObject = this.openmct.objects.makeKeyString(telemetry.identifier);
+      const originalPathObjects = await this.openmct.objects.getOriginalPath(
+        keyStringForObject,
+        []
+      );
+
+      const telemetryPath = originalPathObjects.reverse().map((pathObject) => {
+        if (pathObject.type !== 'root') {
+          return pathObject.name;
+        }
+        return undefined;
+      });
+
+      return telemetryPath.join('/');
     }
   }
 };
diff --git a/src/plugins/condition/components/conditionals.scss b/src/plugins/condition/components/conditionals.scss
index 10ea1169aa..090cd41f67 100644
--- a/src/plugins/condition/components/conditionals.scss
+++ b/src/plugins/condition/components/conditionals.scss
@@ -51,6 +51,7 @@
   display: flex;
   flex-direction: column;
   flex: 1 1 auto;
+  gap: $interiorMargin;
   height: 100%;
   overflow: hidden;
 
@@ -89,23 +90,24 @@
   &__conditions {
     flex: 1 1 auto;
 
-    > * + * {
-      margin-top: $interiorMarginSm;
-    }
+    //> * + * {
+    //  margin-top: $interiorMarginSm;
+    //}
   }
 
   &__content {
     display: flex;
     flex-direction: column;
+    gap: $interiorMarginSm;
     flex: 0 1 auto;
     overflow: hidden;
 
     > * {
       flex: 0 0 auto;
       overflow: hidden;
-      + * {
-        margin-top: $interiorMarginSm;
-      }
+      //+ * {
+      //  margin-top: $interiorMarginSm;
+      //}
     }
 
     .c-button {
@@ -121,6 +123,7 @@
   section {
     display: flex;
     flex-direction: column;
+    gap: $interiorMargin;
     overflow: hidden;
   }
 
diff --git a/src/plugins/condition/plugin.js b/src/plugins/condition/plugin.js
index 365386ef68..5540746206 100644
--- a/src/plugins/condition/plugin.js
+++ b/src/plugins/condition/plugin.js
@@ -21,6 +21,7 @@
  *****************************************************************************/
 import { v4 as uuid } from 'uuid';
 
+import ConditionInspectorViewProvider from './ConditionInspectorViewProvider.js';
 import ConditionSetCompositionPolicy from './ConditionSetCompositionPolicy.js';
 import ConditionSetMetadataProvider from './ConditionSetMetadataProvider.js';
 import ConditionSetTelemetryProvider from './ConditionSetTelemetryProvider.js';
@@ -37,6 +38,7 @@ export default function ConditionPlugin() {
       cssClass: 'icon-conditional',
       initialize: function (domainObject) {
         domainObject.configuration = {
+          shouldFetchHistorical: false,
           conditionTestData: [],
           conditionCollection: [
             {
@@ -61,5 +63,6 @@ export default function ConditionPlugin() {
     openmct.telemetry.addProvider(new ConditionSetMetadataProvider(openmct));
     openmct.telemetry.addProvider(new ConditionSetTelemetryProvider(openmct));
     openmct.objectViews.addProvider(new ConditionSetViewProvider(openmct));
+    openmct.inspectorViews.addProvider(new ConditionInspectorViewProvider(openmct));
   };
 }
diff --git a/src/plugins/condition/utils/constants.js b/src/plugins/condition/utils/constants.js
index 1609dc80fc..0b53cccc34 100644
--- a/src/plugins/condition/utils/constants.js
+++ b/src/plugins/condition/utils/constants.js
@@ -62,3 +62,5 @@ export const ERROR = {
 
 export const IS_OLD_KEY = 'isStale';
 export const IS_STALE_KEY = 'isStale.new';
+
+export const TELEMETRY_VALUE = 'telemetry value';
diff --git a/src/plugins/conditionWidget/components/ConditionWidget.vue b/src/plugins/conditionWidget/components/ConditionWidget.vue
index 1d07e629b8..d83e4da31e 100644
--- a/src/plugins/conditionWidget/components/ConditionWidget.vue
+++ b/src/plugins/conditionWidget/components/ConditionWidget.vue
@@ -123,7 +123,7 @@ export default {
         return;
       }
 
-      this.conditionalLabel = latestDatum.output || '';
+      this.conditionalLabel = latestDatum.value || '';
     },
     async showToolTip() {
       const { BELOW } = this.openmct.tooltips.TOOLTIP_LOCATIONS;
diff --git a/src/plugins/plot/configuration/PlotSeries.js b/src/plugins/plot/configuration/PlotSeries.js
index 9f4f8329ea..34a1dec1ab 100644
--- a/src/plugins/plot/configuration/PlotSeries.js
+++ b/src/plugins/plot/configuration/PlotSeries.js
@@ -225,7 +225,13 @@ export default class PlotSeries extends Model {
 
     try {
       const points = await this.openmct.telemetry.request(this.domainObject, options);
-      const data = this.getSeriesData();
+      // if derived, we can't use the old data
+      let data = this.getSeriesData();
+
+      if (this.metadata.value(this.get('yKey')).derived) {
+        data = [];
+      }
+
       // eslint-disable-next-line you-dont-need-lodash-underscore/concat
       const newPoints = _(data)
         .concat(points)
diff --git a/src/plugins/plot/stackedPlot/StackedPlotItem.vue b/src/plugins/plot/stackedPlot/StackedPlotItem.vue
index 1541b8c980..91a52b656e 100644
--- a/src/plugins/plot/stackedPlot/StackedPlotItem.vue
+++ b/src/plugins/plot/stackedPlot/StackedPlotItem.vue
@@ -243,13 +243,15 @@ export default {
           domainObject: {
             ...this.childObject,
             configuration: {
+              ...this.childObject.configuration,
               series: [
                 {
                   identifier: this.childObject.identifier,
                   ...persistedSeriesConfig.series
                 }
               ],
-              yAxis: persistedSeriesConfig.yAxis
+              yAxis: persistedSeriesConfig.yAxis,
+              ...this.childObject.configuration
             }
           },
           openmct: this.openmct,
diff --git a/src/plugins/plot/stackedPlot/mixins/objectStyles-mixin.js b/src/plugins/plot/stackedPlot/mixins/objectStyles-mixin.js
index 0caa57c68b..011123a147 100644
--- a/src/plugins/plot/stackedPlot/mixins/objectStyles-mixin.js
+++ b/src/plugins/plot/stackedPlot/mixins/objectStyles-mixin.js
@@ -139,12 +139,14 @@ export default {
         styleObj.isStyleInvisible = null;
       }
 
-      Object.entries(styleObj).forEach(([key, value]) => {
-        if (typeof value !== 'string' || !value.includes('__no_value')) {
-          elemToStyle.style[key] = value;
-        } else {
-          elemToStyle.style[key] = ''; // remove the property
-        }
+      requestAnimationFrame(() => {
+        Object.entries(styleObj).forEach(([key, value]) => {
+          if (typeof value !== 'string' || !value.includes('__no_value')) {
+            elemToStyle.style[key] = value;
+          } else {
+            elemToStyle.style[key] = ''; // remove the property
+          }
+        });
       });
     }
   }
diff --git a/src/plugins/plot/tickUtils.js b/src/plugins/plot/tickUtils.js
index fff48cb546..80e19b5dce 100644
--- a/src/plugins/plot/tickUtils.js
+++ b/src/plugins/plot/tickUtils.js
@@ -94,7 +94,7 @@ export function ticks(start, stop, count) {
 }
 
 export function commonPrefix(a, b) {
-  const maxLen = Math.min(a.length, b.length);
+  const maxLen = Math.min(a.length, b?.length);
   let breakpoint = 0;
   for (let i = 0; i < maxLen; i++) {
     if (a[i] !== b[i]) {
@@ -110,7 +110,7 @@ export function commonPrefix(a, b) {
 }
 
 export function commonSuffix(a, b) {
-  const maxLen = Math.min(a.length, b.length);
+  const maxLen = Math.min(a.length, b?.length);
   let breakpoint = 0;
   for (let i = 0; i <= maxLen; i++) {
     if (a[a.length - i] !== b[b.length - i]) {
diff --git a/src/plugins/plugins.js b/src/plugins/plugins.js
index 76b9e590d3..3bc65685b5 100644
--- a/src/plugins/plugins.js
+++ b/src/plugins/plugins.js
@@ -32,6 +32,7 @@ import BarChartPlugin from './charts/bar/plugin.js';
 import ScatterPlotPlugin from './charts/scatter/plugin.js';
 import ClearData from './clearData/plugin.js';
 import Clock from './clock/plugin.js';
+import CompsPlugin from './comps/plugin.js';
 import ConditionPlugin from './condition/plugin.js';
 import ConditionWidgetPlugin from './conditionWidget/plugin.js';
 import CouchDBSearchFolder from './CouchDBSearchFolder/plugin.js';
@@ -178,5 +179,6 @@ plugins.Timelist = TimeList;
 plugins.InspectorViews = InspectorViews;
 plugins.InspectorDataVisualization = InspectorDataVisualization;
 plugins.EventTimestripPlugin = EventTimestripPlugin;
+plugins.Comps = CompsPlugin;
 
 export default plugins;
diff --git a/src/styles/_constants-espresso.scss b/src/styles/_constants-espresso.scss
index 19b4e6c30f..179fb90731 100644
--- a/src/styles/_constants-espresso.scss
+++ b/src/styles/_constants-espresso.scss
@@ -353,7 +353,7 @@ $colorInspectorBg: $colorBodyBg;
 $colorInspectorFg: $colorBodyFg;
 $colorInspectorPropName: $colorBodyFgSubtle;
 $colorInspectorPropVal: $colorBodyFgEm;
-$colorInspectorSectionHeaderBg: pullForward($colorInspectorBg, 5%);
+$colorInspectorSectionHeaderBg: pullForward($colorInspectorBg, 10%);
 $colorInspectorSectionHeaderFg: #bfbfbf;
 
 // Tabs
diff --git a/src/styles/_constants.scss b/src/styles/_constants.scss
index f8e00420d0..06e380a67f 100755
--- a/src/styles/_constants.scss
+++ b/src/styles/_constants.scss
@@ -277,8 +277,9 @@ $glyph-icon-bar-chart: '\eb2c';
 $glyph-icon-map: '\eb2d';
 $glyph-icon-plan: '\eb2e';
 $glyph-icon-timelist: '\eb2f';
-$glyph-icon-notebook-shift-log: '\eb31';
 $glyph-icon-plot-scatter: '\eb30';
+$glyph-icon-notebook-shift-log: '\eb31';
+$glyph-icon-derived-telemetry: '\eb32';
 
 /************************** GLYPHS AS DATA URI */
 // Only objects have been converted, for use in Create menu and folder views
@@ -335,3 +336,4 @@ $bg-icon-telemetry-aggregate: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns
 $bg-icon-trash: url("data:image/svg+xml;charset=UTF-8,%3csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' width='512px' height='512px' viewBox='0 0 512 512' enable-background='new 0 0 512 512' xml:space='preserve'%3e%3cpath d='M416,64h-96.18V32c0-17.6-14.4-32-32-32h-64c-17.6,0-32,14.4-32,32v32H96c-52.8,0-96,36-96,80s0,80,0,80h32v192 c0,52.8,43.2,96,96,96h256c52.8,0,96-43.2,96-96V224h32c0,0,0-36,0-80S468.8,64,416,64z M160,416H96V224h64V416z M288,416h-64V224 h64V416z M416,416h-64V224h64V416z'/%3e%3c/svg%3e");
 $bg-icon-eye-open: url("data:image/svg+xml;charset=UTF-8,%3csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 512 512' style='enable-background:new 0 0 512 512;' xml:space='preserve'%3e%3cstyle type='text/css'%3e .st0%7bfill:%2300A14B;%7d %3c/style%3e%3ctitle%3eicon-eye-open-v2%3c/title%3e%3cg%3e%3cpath class='st0' d='M256,58.2c-122.9,0-226.1,84-255.4,197.8C29.9,369.7,133.1,453.8,256,453.8s226.1-84,255.4-197.8 C482.1,142.3,378.9,58.2,256,58.2z M414.6,294.2c-11.3,17.2-25.3,32.4-41.5,45.2c-16.4,12.9-34.5,22.8-54,29.7 c-20.2,7.1-41.4,10.7-63,10.7s-42.9-3.6-63-10.7c-19.5-6.9-37.7-16.9-54-29.7c-16.2-12.8-30.2-27.9-41.5-45.2 c-7.9-12-14.4-24.8-19.3-38.2c5-13.4,11.5-26.2,19.3-38.2c11.3-17.2,25.3-32.4,41.5-45.2c16.4-12.9,34.5-22.8,54-29.7 c20.2-7.1,41.4-10.7,63-10.7s42.9,3.6,63,10.7c19.5,6.9,37.7,16.9,54,29.7c16.2,12.8,30.2,27.9,41.5,45.2 c7.9,12,14.4,24.8,19.3,38.2C429,269.4,422.5,282.2,414.6,294.2z'/%3e%3ccircle class='st0' cx='256' cy='256' r='96'/%3e%3c/g%3e%3c/svg%3e");
 $bg-icon-camera: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3e%3ctitle%3eicon-camera-v2%3c/title%3e%3cpath d='M448,128H384L320,0H192L128,128H64A64.2,64.2,0,0,0,0,192V448a64.2,64.2,0,0,0,64,64H448a64.2,64.2,0,0,0,64-64V192A64.2,64.2,0,0,0,448,128ZM256,432A128,128,0,1,1,384,304,128,128,0,0,1,256,432Z'/%3e%3c/svg%3e");
+$bg-icon-derived-telemetry: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3e%3cpath d='M66.1 166c20.2 24.3 35.1 54.6 44 75.7 10 23.6 21.7 44 33.1 57.7 11.1 13.3 18.5 16.3 20.2 16.3s9.1-3 20.2-16.3c11.4-13.7 23.1-34.2 33.1-57.7 8.9-21.1 23.8-51.4 44-75.7 23.3-28.1 48.7-42.3 75.6-42.3s52.2 14.2 75.6 42.3c20.2 24.3 35.1 54.6 44 75.7 10 23.6 21.7 44 33.1 57.7 11.1 13.3 18.5 16.3 20.2 16.3s1.6-.3 3.2-1.1v-58.9c-.2-141.3-114.9-256-256.2-256H.2v124.6c23.3 3 45.4 17 66 41.7Z'/%3e%3cpath d='M509 387.7c-26.8 0-52.2-14.2-75.6-42.3-20.2-24.3-35.1-54.6-44-75.7-10-23.6-21.7-44-33.1-57.7-11.1-13.3-18.5-16.3-20.2-16.3s-9.1 3-20.2 16.3c-11.4 13.7-23.1 34.2-33.1 57.7-8.9 21.1-23.8 51.4-44 75.7-23.3 28.1-48.7 42.3-75.6 42.3s-52.2-14.2-75.6-42.3c-20.2-24.3-35.1-54.6-44-75.7-10-23.6-21.7-44-33.1-57.7-4.1-4.9-7.6-8.4-10.6-10.8v54.5c.3 141.4 114.9 256 256.3 256h256V387.6H509Z'/%3e%3c/svg%3e");
diff --git a/src/styles/_controls.scss b/src/styles/_controls.scss
index aa40edb509..ac56d10818 100644
--- a/src/styles/_controls.scss
+++ b/src/styles/_controls.scss
@@ -24,67 +24,67 @@
 
 /******************************************************** CONTROL-SPECIFIC MIXINS */
 @mixin menuOuter() {
-  border-radius: $basicCr;
-  box-shadow: $shdwMenu;
-  @if $shdwMenuInner != none {
-    box-shadow: $shdwMenuInner, $shdwMenu;
-  }
-  background: $colorMenuBg;
-  backdrop-filter: blur($formRowCtrlsH);
-  color: $colorMenuFg;
-  text-shadow: $shdwMenuText;
-  padding: $interiorMarginSm;
-  display: flex;
-  flex-direction: column;
-  position: absolute;
-  z-index: 100;
+    border-radius: $basicCr;
+    box-shadow: $shdwMenu;
+    @if $shdwMenuInner != none {
+        box-shadow: $shdwMenuInner, $shdwMenu;
+    }
+    background: $colorMenuBg;
+    backdrop-filter: blur($formRowCtrlsH);
+    color: $colorMenuFg;
+    text-shadow: $shdwMenuText;
+    padding: $interiorMarginSm;
+    display: flex;
+    flex-direction: column;
+    position: absolute;
+    z-index: 100;
 
-  > * {
-    flex: 0 0 auto;
-  }
+    > * {
+        flex: 0 0 auto;
+    }
 }
 
 @mixin menuPositioning() {
-  display: flex;
-  flex-direction: column;
-  position: absolute;
-  z-index: 100;
+    display: flex;
+    flex-direction: column;
+    position: absolute;
+    z-index: 100;
 
-  > * {
-    flex: 0 0 auto;
-  }
+    > * {
+        flex: 0 0 auto;
+    }
 }
 
 @mixin menuInner() {
-  li {
-    @include cControl();
-    justify-content: start;
-    cursor: pointer;
-    display: flex;
-    padding: nth($menuItemPad, 1) nth($menuItemPad, 2);
-    white-space: nowrap;
+    li {
+        @include cControl();
+        justify-content: start;
+        cursor: pointer;
+        display: flex;
+        padding: nth($menuItemPad, 1) nth($menuItemPad, 2);
+        white-space: nowrap;
 
-    @include hover {
-      background: $colorMenuHovBg;
-      color: $colorMenuHovFg;
-      &:before {
-        color: $colorMenuHovIc !important;
-      }
+        @include hover {
+            background: $colorMenuHovBg;
+            color: $colorMenuHovFg;
+            &:before {
+                color: $colorMenuHovIc !important;
+            }
+        }
+
+        &:not(.c-menu--no-icon &) {
+            &:before {
+                color: $colorMenuIc;
+                font-size: 1em;
+                margin-right: $interiorMargin;
+                min-width: 1em;
+            }
+
+            &:not([class*='icon']):before {
+                content: ''; // Enable :before so that menu items without an icon still indent properly
+            }
+        }
     }
-
-    &:not(.c-menu--no-icon &) {
-      &:before {
-        color: $colorMenuIc;
-        font-size: 1em;
-        margin-right: $interiorMargin;
-        min-width: 1em;
-      }
-
-      &:not([class*='icon']):before {
-        content: ''; // Enable :before so that menu items without an icon still indent properly
-      }
-    }
-  }
 }
 
 @mixin resizeHandleStyle($size: 1px, $margin: 3px) {
@@ -136,168 +136,169 @@
 /******************************************************** BUTTONS */
 // Optionally can include icon in :before via markup
 button {
-  @include htmlInputReset();
+    @include htmlInputReset();
 }
 
 .c-button,
 .c-button--menu {
-  @include cButton();
+    @include cButton();
 }
 
 .c-button {
-  &--menu {
-    &:after {
-      content: $glyph-icon-arrow-down;
-      font-family: symbolsfont;
-      opacity: 0.5;
-    }
-  }
-
-  &--swatched {
-    // Used with c-button--menu: a visual button with a larger swatch element adjacent to an icon
-    .c-swatch {
-      $d: 12px;
-      margin-left: $interiorMarginSm;
-      height: $d;
-      width: $d;
-    }
-  }
-
-  &[class*='__collapse-button'] {
-    box-shadow: none;
-    background: $splitterBtnColorBg;
-    color: $splitterBtnColorFg;
-    border-radius: $smallCr;
-    line-height: 90%;
-    padding: 3px 10px;
-
-    @include desktop() {
-      font-size: 6px;
+    &--menu {
+        &:after {
+            content: $glyph-icon-arrow-down;
+            font-family: symbolsfont;
+            opacity: 0.5;
+        }
     }
 
-    &:before {
-      content: $glyph-icon-arrow-down;
-      font-size: 1.1em;
+    &--swatched {
+        // Used with c-button--menu: a visual button with a larger swatch element adjacent to an icon
+        .c-swatch {
+            $d: 12px;
+            margin-left: $interiorMarginSm;
+            height: $d;
+            width: $d;
+        }
     }
-  }
 
-  &.is-active {
-    background: $colorBtnActiveBg;
-    color: $colorBtnActiveFg;
-  }
+    &[class*='__collapse-button'] {
+        box-shadow: none;
+        background: $splitterBtnColorBg;
+        color: $splitterBtnColorFg;
+        border-radius: $smallCr;
+        line-height: 90%;
+        padding: 3px 10px;
 
-  &.is-selected {
-    background: $colorBtnSelectedBg;
-    color: $colorBtnSelectedFg;
-  }
+        @include desktop() {
+            font-size: 6px;
+        }
+
+        &:before {
+            content: $glyph-icon-arrow-down;
+            font-size: 1.1em;
+        }
+    }
+
+    &.is-active {
+        background: $colorBtnActiveBg;
+        color: $colorBtnActiveFg;
+    }
+
+    &.is-selected {
+        background: $colorBtnSelectedBg;
+        color: $colorBtnSelectedFg;
+    }
 }
 
 /********* Icon Buttons and Links */
 .c-click-icon {
-  @include cClickIcon();
+    @include cClickIcon();
 
-  &--section-collapse {
-    color: inherit;
-    display: block;
-    transition: transform $transOutTime;
-    &:before {
-      content: $glyph-icon-arrow-down;
-      font-family: symbolsfont;
-    }
+    &--section-collapse {
+        color: inherit;
+        display: block;
+        transition: transform $transOutTime;
 
-    &.is-collapsed {
-      transform: rotate(180deg);
+        &:before {
+            content: $glyph-icon-arrow-down;
+            font-family: symbolsfont;
+        }
+
+        &.is-collapsed {
+            transform: rotate(180deg);
+        }
     }
-  }
 }
 
 .c-click-link,
 .c-icon-link {
-  // A clickable element, typically inline, with an icon and label
-  @include cControl();
-  cursor: pointer;
+    // A clickable element, typically inline, with an icon and label
+    @include cControl();
+    cursor: pointer;
 }
 
 .c-icon-button,
 .c-click-swatch {
-  @include cClickIconButton();
+    @include cClickIconButton();
 
-  &--menu {
-    @include hasMenu();
-  }
+    &--menu {
+        @include hasMenu();
+    }
 }
 
 .c-icon-button--disabled {
-  @include cClickIconButtonLayout();
+    @include cClickIconButtonLayout();
 }
 
 .c-icon-link {
-  &:before {
-    // Icon
-    //color: $colorBtnMajorBg;
-  }
+    &:before {
+        // Icon
+        //color: $colorBtnMajorBg;
+    }
 }
 
 .c-icon-button {
-  [class*='label'] {
-    padding: 1px 0;
-  }
-
-  &--mixed {
-    @include mixedBg();
-  }
-
-  &--swatched {
-    // Color control, show swatch element
-    display: flex;
-    flex-flow: column nowrap;
-    align-items: center;
-    justify-content: center;
-
-    > [class*='swatch'] {
-      box-shadow: inset rgba($editUIBaseColorFg, 0.2) 0 0 0 1px;
-      flex: 0 0 auto;
-      height: 5px;
-      width: 100%;
-      margin-top: 1px;
+    [class*='label'] {
+        padding: 1px 0;
     }
 
-    &:before {
-      // Reduce size of icon to make a bit of room
-      flex: 1 1 auto;
-      font-size: 1.1em;
+    &--mixed {
+        @include mixedBg();
     }
-  }
 
-  &--sm {
-    padding: $interiorMarginSm $interiorMargin;
-  }
+    &--swatched {
+        // Color control, show swatch element
+        display: flex;
+        flex-flow: column nowrap;
+        align-items: center;
+        justify-content: center;
+
+        > [class*='swatch'] {
+            box-shadow: inset rgba($editUIBaseColorFg, 0.2) 0 0 0 1px;
+            flex: 0 0 auto;
+            height: 5px;
+            width: 100%;
+            margin-top: 1px;
+        }
+
+        &:before {
+            // Reduce size of icon to make a bit of room
+            flex: 1 1 auto;
+            font-size: 1.1em;
+        }
+    }
+
+    &--sm {
+        padding: $interiorMarginSm $interiorMargin;
+    }
 }
 
 .c-list-button {
-  @include cControl();
-  color: $colorBodyFg;
-  cursor: pointer;
-  justify-content: start;
-  padding: $interiorMargin;
+    @include cControl();
+    color: $colorBodyFg;
+    cursor: pointer;
+    justify-content: start;
+    padding: $interiorMargin;
 
-  > * + * {
-    margin-left: $interiorMargin;
-  }
+    > * + * {
+        margin-left: $interiorMargin;
+    }
 
-  @include hover() {
-    background: $colorItemTreeHoverBg;
-  }
+    @include hover() {
+        background: $colorItemTreeHoverBg;
+    }
 
-  .c-button {
-    flex: 0 0 auto;
-  }
+    .c-button {
+        flex: 0 0 auto;
+    }
 }
 
 .c-not-button {
-  // Use within a holder that's clickable; use to indicate interactability
-  @include cButtonLayout();
-  cursor: pointer;
+    // Use within a holder that's clickable; use to indicate interactability
+    @include cButtonLayout();
+    cursor: pointer;
 }
 
 /******************************************************** DISCLOSURE CONTROLS */
@@ -305,97 +306,100 @@ button {
 // Provides a downward arrow icon that when clicked displays additional options and/or info.
 // Always placed AFTER an element
 .c-disclosure-button {
-  @include cClickIcon();
-  margin-left: $interiorMarginSm;
+    @include cClickIcon();
+    margin-left: $interiorMarginSm;
 
-  &:before {
-    content: $glyph-icon-arrow-down;
-    font-family: symbolsfont;
-    font-size: 0.7em;
-  }
+    &:before {
+        content: $glyph-icon-arrow-down;
+        font-family: symbolsfont;
+        font-size: 0.7em;
+    }
 }
+
 /********* Disclosure Triangle */
 // Provides an arrow icon that when clicked expands an element to reveal its contents.
 // Used in tree items, plot legends. Always placed BEFORE an element.
 .c-disclosure-triangle {
-  $d: 12px;
-  color: $colorDisclosureCtrl;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  flex: 0 0 auto;
-  width: $d;
-  position: relative;
-  visibility: hidden;
+    $d: 12px;
+    color: $colorDisclosureCtrl;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    flex: 0 0 auto;
+    width: $d;
+    position: relative;
+    visibility: hidden;
 
-  &.is-enabled {
-    cursor: pointer;
-    visibility: visible;
+    &.is-enabled {
+        cursor: pointer;
+        visibility: visible;
 
-    &:hover {
-      color: $colorDisclosureCtrlHov;
+        &:hover {
+            color: $colorDisclosureCtrlHov;
+        }
+
+        &:before {
+            $s: 0.65;
+            content: $glyph-icon-arrow-right-equilateral;
+            display: block;
+            font-family: symbolsfont;
+            font-size: 1rem * $s;
+        }
     }
 
-    &:before {
-      $s: 0.65;
-      content: $glyph-icon-arrow-right-equilateral;
-      display: block;
-      font-family: symbolsfont;
-      font-size: 1rem * $s;
+    &--expanded {
+        &:before {
+            transform: rotate(90deg);
+        }
     }
-  }
-
-  &--expanded {
-    &:before {
-      transform: rotate(90deg);
-    }
-  }
 }
 
 /******************************************************** DRAG AFFORDANCES */
 .c-grippy {
-  $d: 10px;
-  @include grippy($c: $colorItemTreeVC, $dir: 'y');
-  width: $d;
-  height: $d;
+    $d: 10px;
+    @include grippy($c: $colorItemTreeVC, $dir: 'y');
+    width: $d;
+    height: $d;
 
-  &--vertical-drag {
-    cursor: ns-resize;
-  }
+    &--vertical-drag {
+        cursor: ns-resize;
+    }
 }
 
 /******************************************************** SECTION */
 section {
-  flex: 0 1 auto;
-  overflow: hidden;
-  + section {
-    margin-top: $interiorMargin;
-  }
+    flex: 0 1 auto;
+    overflow: hidden;
 
-  .c-section__header {
-    @include propertiesHeader();
-    display: flex;
-    flex: 0 0 auto;
-    align-items: center;
-    margin-bottom: $interiorMargin;
-
-    > * + * {
-      margin-left: $interiorMarginSm;
+    + section {
+        //margin-top: $interiorMargin;
     }
-  }
 
-  > [class*='__label'] {
-    flex: 1 1 auto;
-    text-transform: uppercase;
-  }
+    .c-section__header {
+        @include propertiesHeader();
+        display: flex;
+        flex: 0 0 auto;
+        align-items: center;
+        gap: $interiorMarginSm;
+        //margin-bottom: $interiorMargin;
+        //
+        //> * + * {
+        //    margin-left: $interiorMarginSm;
+        //}
+    }
+
+    > [class*='__label'] {
+        flex: 1 1 auto;
+        text-transform: uppercase;
+    }
 }
 
 /******************************************************** FORM ELEMENTS */
 input,
 textarea {
-  font-family: inherit;
-  font-weight: inherit;
-  letter-spacing: inherit;
+    font-family: inherit;
+    font-weight: inherit;
+    letter-spacing: inherit;
 }
 
 input[type='text'],
@@ -404,10 +408,11 @@ input[type='number'],
 input[type='password'],
 input[type='date'],
 textarea {
-  @include reactive-input();
-  &.numeric {
-    text-align: right;
-  }
+    @include reactive-input();
+
+    &.numeric {
+        text-align: right;
+    }
 }
 
 input[type='text'],
@@ -415,843 +420,880 @@ input[type='search'],
 input[type='password'],
 input[type='date'],
 textarea {
-  padding: $inputTextP;
+    padding: $inputTextP;
 }
 
 .c-input {
-  &--flex {
-    width: 100%;
-    min-width: 20px;
-  }
-
-  &--datetime {
-    // Sized for values such as 2018-09-28 22:32:33.468Z
-    width: 160px;
-  }
-
-  &--hrs-min-sec {
-    // Sized for values such as 00:25:00
-    width: 60px;
-  }
-
-  &-inline,
-  &--inline {
-    // A text input or contenteditable element that indicates edit affordance on hover and looks like an input on focus
-    @include inlineInput;
-
-    &:hover,
-    &:focus {
-      background: $colorInputBg;
-      padding-left: $inputTextPLeftRight;
-      padding-right: $inputTextPLeftRight;
+    &--flex {
+        width: 100%;
+        min-width: 20px;
     }
-  }
 
-  &--labeled {
-    // TODO: replace .c-labeled-input with this
+    &--datetime {
+        // Sized for values such as 2018-09-28 22:32:33.468Z
+        width: 160px;
+    }
+
+    &--hrs-min-sec {
+        // Sized for values such as 00:25:00
+        width: 60px;
+    }
+
+    &-inline,
+    &--inline {
+        // A text input or contenteditable element that indicates edit affordance on hover and looks like an input on focus
+        @include inlineInput;
+
+        &:hover,
+        &:focus {
+            background: $colorInputBg;
+            padding-left: $inputTextPLeftRight;
+            padding-right: $inputTextPLeftRight;
+        }
+    }
+
+    &--labeled {
+        // TODO: replace .c-labeled-input with this
+        // An input used in the Toolbar
+        // Assumes label is before the input
+        @include cControl();
+
+        input {
+            margin-left: $interiorMarginSm;
+        }
+    }
+
+    &--sm {
+        // Small inputs, like small numerics
+        width: 40px;
+    }
+
+    &--md {
+        // Smallish inputs, like numerics or short text
+        width: 80px;
+    }
+
+    &--autocomplete {
+        &__wrapper {
+            display: flex;
+            flex-direction: row;
+            align-items: center;
+            overflow: hidden;
+            width: 100%;
+        }
+
+        &__input {
+            min-width: 100px;
+            width: 100%;
+
+            // Fend off from afford-arrow
+            padding-right: 2.5em !important;
+        }
+
+        &__options {
+            @include menuOuter();
+            @include menuInner();
+            display: flex;
+
+            ul {
+                flex: 1 1 auto;
+                overflow: auto;
+            }
+
+            li {
+                &:before {
+                    color: var(--optionIconColor) !important;
+                    font-size: 0.8em !important;
+                }
+            }
+        }
+
+        &__afford-arrow {
+            $p: 2px;
+            font-size: 0.8em;
+            padding-bottom: $p;
+            padding-top: $p;
+            position: absolute;
+            right: 2px;
+            z-index: 2;
+        }
+    }
+}
+
+input[type='number'].c-input-number--no-spinners {
+    &::-webkit-inner-spin-button,
+    &::-webkit-outer-spin-button {
+        -webkit-appearance: none;
+        margin: 0;
+    }
+
+    -moz-appearance: textfield;
+}
+
+.c-labeled-input {
     // An input used in the Toolbar
     // Assumes label is before the input
     @include cControl();
 
     input {
-      margin-left: $interiorMarginSm;
+        margin-left: $interiorMarginSm;
     }
-  }
-
-  &--sm {
-    // Small inputs, like small numerics
-    width: 40px;
-  }
-
-  &--autocomplete {
-    &__wrapper {
-      display: flex;
-      flex-direction: row;
-      align-items: center;
-      overflow: hidden;
-      width: 100%;
-    }
-
-    &__input {
-      min-width: 100px;
-      width: 100%;
-
-      // Fend off from afford-arrow
-      padding-right: 2.5em !important;
-    }
-
-    &__options {
-      @include menuOuter();
-      @include menuInner();
-      display: flex;
-
-      ul {
-        flex: 1 1 auto;
-        overflow: auto;
-      }
-
-      li {
-        &:before {
-          color: var(--optionIconColor) !important;
-          font-size: 0.8em !important;
-        }
-      }
-    }
-
-    &__afford-arrow {
-      $p: 2px;
-      font-size: 0.8em;
-      padding-bottom: $p;
-      padding-top: $p;
-      position: absolute;
-      right: 2px;
-      z-index: 2;
-    }
-  }
-}
-
-input[type='number'].c-input-number--no-spinners {
-  &::-webkit-inner-spin-button,
-  &::-webkit-outer-spin-button {
-    -webkit-appearance: none;
-    margin: 0;
-  }
-  -moz-appearance: textfield;
-}
-
-.c-labeled-input {
-  // An input used in the Toolbar
-  // Assumes label is before the input
-  @include cControl();
-
-  input {
-    margin-left: $interiorMarginSm;
-  }
 }
 
 .c-scrollcontainer {
-  @include nice-input();
-  margin-top: $interiorMargin;
-  background: $scrollContainer;
-  border-radius: $controlCr;
-  overflow: auto;
-  padding: $interiorMarginSm;
+    @include nice-input();
+    margin-top: $interiorMargin;
+    background: $scrollContainer;
+    border-radius: $controlCr;
+    overflow: auto;
+    padding: $interiorMarginSm;
 }
 
 // SELECTS
 select {
-  @include appearanceNone();
-  background-color: $colorSelectBg;
-  background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10'%3e%3cpath fill='%23#{svgColorFromHex($colorSelectArw)}' d='M5 5l5-5H0z'/%3e%3c/svg%3e");
-  color: $colorSelectFg;
-  box-shadow: $shdwSelect;
-  background-repeat: no-repeat, no-repeat;
-  background-position:
-    right 0.4em top 80%,
+    @include appearanceNone();
+    background-color: $colorSelectBg;
+    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10'%3e%3cpath fill='%23#{svgColorFromHex($colorSelectArw)}' d='M5 5l5-5H0z'/%3e%3c/svg%3e");
+    color: $colorSelectFg;
+    box-shadow: $shdwSelect;
+    background-repeat: no-repeat, no-repeat;
+    background-position: right 0.4em top 80%,
     0 0;
-  border: none;
-  border-radius: $controlCr;
-  padding: 2px 20px 2px $interiorMargin;
+    border: none;
+    border-radius: $controlCr;
+    padding: 2px 20px 2px $interiorMargin;
 
-  *,
-  option {
-    background: $colorBtnBg;
-    color: $colorBtnFg;
-  }
+    *,
+    option {
+        background: $colorBtnBg;
+        color: $colorBtnFg;
+    }
 }
 
 // CHECKBOX LISTS
 // __input followed by __label
 .c-checkbox-list {
-  // Rows
-  &__row + &__row {
-    margin-top: $interiorMarginSm;
-  }
-
-  // input and label in each __row
-  &__row {
-    > * + * {
-      margin-left: $interiorMargin;
+    // Rows
+    &__row + &__row {
+        margin-top: $interiorMarginSm;
     }
-  }
 
-  li {
-    white-space: nowrap;
-  }
+    // input and label in each __row
+    &__row {
+        > * + * {
+            margin-left: $interiorMargin;
+        }
+    }
+
+    li {
+        white-space: nowrap;
+    }
 }
 
 /******************************************************** TABS */
 .c-tabs {
-  // Single horizontal strip of tabs, with a bottom divider line
-  @include userSelectNone();
-  display: flex;
-  flex: 0 0 auto;
-  flex-wrap: wrap;
-  position: relative; // Required in case this is applied to a <ul>
+    // Single horizontal strip of tabs, with a bottom divider line
+    @include userSelectNone();
+    display: flex;
+    flex: 0 0 auto;
+    flex-wrap: wrap;
+    position: relative; // Required in case this is applied to a <ul>
 
-  &:before {
-    // Separator line at bottom of tabs
-    content: '';
-    display: block;
-    height: 1px;
-    width: 100%;
-    background: $colorTabsBaseline;
-    position: absolute;
-    bottom: 0px;
-    z-index: 1;
-  }
+    &:before {
+        // Separator line at bottom of tabs
+        content: '';
+        display: block;
+        height: 1px;
+        width: 100%;
+        background: $colorTabsBaseline;
+        position: absolute;
+        bottom: 0px;
+        z-index: 1;
+    }
 }
 
 .c-tab {
-  // Used in Tab View, generic tabs
-  $notchSize: 7px;
-  $clipPath: polygon(
-    0% 0%,
-    calc(100% - #{$notchSize}) 0%,
-    100% #{$notchSize},
-    100% calc(100% - #{$notchSize}),
-    100% 100%,
-    0% 100%
-  );
-  background: $colorTabBg;
-  color: $colorTabFg;
-  cursor: pointer;
-  display: flex;
-  align-items: center;
-  flex: 1 1 auto;
-  margin: 1px 1px 0 0;
-  padding: $interiorMargin $interiorMarginLg;
-  white-space: nowrap;
-  clip-path: $clipPath;
-  -webkit-clip-path: $clipPath; // Safari
+    // Used in Tab View, generic tabs
+    $notchSize: 7px;
+    $clipPath: polygon(
+                    0% 0%,
+                    calc(100% - #{$notchSize}) 0%,
+                    100% #{$notchSize},
+                    100% calc(100% - #{$notchSize}),
+                    100% 100%,
+                    0% 100%
+    );
+    background: $colorTabBg;
+    color: $colorTabFg;
+    cursor: pointer;
+    display: flex;
+    align-items: center;
+    flex: 1 1 auto;
+    margin: 1px 1px 0 0;
+    padding: $interiorMargin $interiorMarginLg;
+    white-space: nowrap;
+    clip-path: $clipPath;
+    -webkit-clip-path: $clipPath; // Safari
 
-  > * + * {
-    margin-left: $interiorMargin;
-  }
+    > * + * {
+        margin-left: $interiorMargin;
+    }
 
-  @include hover() {
-    box-shadow: $shdwBtnHov;
-  }
+    @include hover() {
+        box-shadow: $shdwBtnHov;
+    }
 
-  &.is-current {
-    background: $colorTabCurrentBg;
-    color: $colorTabCurrentFg;
-  }
+    &.is-current {
+        background: $colorTabCurrentBg;
+        color: $colorTabCurrentFg;
+    }
 }
 
 /******************************************************** HYPERLINKS AND HYPERLINK BUTTONS */
 .c-hyperlink {
-  display: inline-block;
-  color: $colorKey;
+    display: inline-block;
+    color: $colorKey;
 
-  &--button {
-    @include cButton();
-  }
+    &--button {
+        @include cButton();
+    }
 }
 
 .c-so-view--hyperlink.c-so-view--no-frame {
-  .c-hyperlink--button {
-    @include abs();
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    padding: 0;
-  }
+    .c-hyperlink--button {
+        @include abs();
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        padding: 0;
+    }
 
-  .c-so-view__frame-controls {
-    display: none;
-  }
+    .c-so-view__frame-controls {
+        display: none;
+    }
 }
 
 /******************************************************** MENUS */
 .c-menu {
-  @include menuOuter();
-  @include menuPositioning();
-  @include menuInner();
+    @include menuOuter();
+    @include menuPositioning();
+    @include menuInner();
 
-  &__section-hint {
-    $m: $interiorMargin;
-    margin: 0 0 $m 0;
-    padding: $m nth($menuItemPad, 2) 0 nth($menuItemPad, 2);
+    &__section-hint {
+        $m: $interiorMargin;
+        margin: 0 0 $m 0;
+        padding: $m nth($menuItemPad, 2) 0 nth($menuItemPad, 2);
 
-    opacity: 0.6;
-    font-size: 0.9em;
-    font-style: italic;
-  }
+        opacity: 0.6;
+        font-size: 0.9em;
+        font-style: italic;
+    }
 
-  &__section-separator {
-    $m: $interiorMargin;
-    border-top: 1px solid $colorInteriorBorder;
-    margin: $m 0;
-    padding: 0 nth($menuItemPad, 2) 0 nth($menuItemPad, 2);
-  }
+    &__section-separator {
+        $m: $interiorMargin;
+        border-top: 1px solid $colorInteriorBorder;
+        margin: $m 0;
+        padding: 0 nth($menuItemPad, 2) 0 nth($menuItemPad, 2);
+    }
 }
 
 .c-super-menu {
-  // Two column layout, menu items on left with detail of hover element on right
-  $m: $interiorMarginLg;
-  @include menuOuter();
-  @include menuPositioning();
-  display: flex;
-  height: auto;
-  padding: $interiorMarginLg;
-  flex-direction: row;
-
-  > [class*='__'] {
-    //flex: 1 1 50%;
-    //&:first-child {
-    //  margin-right: $m;
-    //}
-
-    &:last-child {
-      //border-left: 1px solid $colorInteriorBorder;
-      //padding-left: $m;
-    }
-  }
-
-  &__menu {
-    @include menuInner();
-    flex: 1 1 50%;
-    margin-right: $m;
-    overflow: auto;
-
-    ul {
-      margin-right: $interiorMarginSm; // Fend off scrollbar
-    }
-
-    li {
-      border-radius: $controlCr;
-    }
-  }
-
-  &__item-description {
-    border-left: 1px solid $colorInteriorBorder;
-    flex: 1 1 50%;
-    padding-left: $m;
+    // Two column layout, menu items on left with detail of hover element on right
+    $m: $interiorMarginLg;
+    @include menuOuter();
+    @include menuPositioning();
     display: flex;
-    flex-direction: column;
-    justify-content: stretch;
+    height: auto;
+    padding: $interiorMarginLg;
+    flex-direction: row;
 
-    > * + * {
-      margin-top: $interiorMarginLg;
+    > [class*='__'] {
+        //flex: 1 1 50%;
+        //&:first-child {
+        //  margin-right: $m;
+        //}
+
+        &:last-child {
+            //border-left: 1px solid $colorInteriorBorder;
+            //padding-left: $m;
+        }
     }
 
-    .l-item-description {
-      &__icon {
-        min-height: 20%;
-        margin: 10% 25%;
-      }
+    &__menu {
+        @include menuInner();
+        flex: 1 1 50%;
+        margin-right: $m;
+        overflow: auto;
 
-      &__name {
-        color: $colorMenuFg;
-        flex: 0 0 auto;
-        font-size: 1.25em;
-      }
+        ul {
+            margin-right: $interiorMarginSm; // Fend off scrollbar
+        }
 
-      &__description {
-        font-size: $fontBaseSize;
-      }
+        li {
+            border-radius: $controlCr;
+        }
+    }
+
+    &__item-description {
+        border-left: 1px solid $colorInteriorBorder;
+        flex: 1 1 50%;
+        padding-left: $m;
+        display: flex;
+        flex-direction: column;
+        justify-content: stretch;
+
+        > * + * {
+            margin-top: $interiorMarginLg;
+        }
+
+        .l-item-description {
+            &__icon {
+                min-height: 20%;
+                margin: 10% 25%;
+            }
+
+            &__name {
+                color: $colorMenuFg;
+                flex: 0 0 auto;
+                font-size: 1.25em;
+            }
+
+            &__description {
+                font-size: $fontBaseSize;
+            }
+        }
     }
-  }
 }
 
 .c-super-menu--sm {
-  // Small version of the super menu, used by the compact Time Conductor
-  height: 120px;
-  width: 500px;
+    // Small version of the super menu, used by the compact Time Conductor
+    height: 120px;
+    width: 500px;
 
-  .c-super-menu__menu {
-    flex: 1 1 30%;
-  }
-
-  .c-super-menu__item-description {
-    flex: 1 1 70%;
-
-    [class*='__icon'] {
-      display: none !important;
+    .c-super-menu__menu {
+        flex: 1 1 30%;
     }
 
-    [class*='__name'] {
-      margin-top: 0 !important;
-    }
+    .c-super-menu__item-description {
+        flex: 1 1 70%;
 
-    [class*='__item-description'] {
-      min-width: 200px;
+        [class*='__icon'] {
+            display: none !important;
+        }
+
+        [class*='__name'] {
+            margin-top: 0 !important;
+        }
+
+        [class*='__item-description'] {
+            min-width: 200px;
+        }
     }
-  }
 }
 
 /******************************************************** CONTROL BARS */
 .c-control-bar {
-  display: flex;
-  align-items: center;
+    display: flex;
+    align-items: center;
 
-  > * + * {
-    margin-left: $interiorMarginSm;
-  }
+    > * + * {
+        margin-left: $interiorMarginSm;
+    }
 
-  &__label {
-    display: inline-block;
-    white-space: nowrap;
-  }
+    &__label {
+        display: inline-block;
+        white-space: nowrap;
+    }
 }
 
 /******************************************************** PALETTES */
 .c-palette {
-  display: flex;
-  flex-flow: column nowrap;
-  line-height: normal;
-
-  &__items {
-    display: grid;
-    grid-gap: 1px;
-    grid-template-columns: repeat(auto-fill, 12px);
-    flex: 1 1 auto;
-
-    .c-menu & {
-      min-width: $paletteMenuMinW;
-    }
-  }
-
-  &__item {
-    $d: 12px;
-    border: 1px solid transparent;
-    cursor: pointer;
     display: flex;
-    align-items: center;
-    align-content: center;
-    width: $d;
-    height: $d;
-    text-align: center;
+    flex-flow: column nowrap;
+    line-height: normal;
 
-    &.is-selected {
-      border-width: 1px;
-    }
-  }
+    &__items {
+        display: grid;
+        grid-gap: 1px;
+        grid-template-columns: repeat(auto-fill, 12px);
+        flex: 1 1 auto;
 
-  &__item-none {
-    @include userSelectNone();
-    flex: 0 0 auto;
-    display: flex;
-    align-items: center;
-    margin-bottom: $interiorMarginSm;
-
-    .c-palette__item {
-      @include noColor();
-      border-color: $paletteItemBorderInnerColor;
-      margin-right: $interiorMarginSm;
-    }
-  }
-
-  &--color {
-    .c-palette__item {
-      &:hover {
-        border-color: rgba($paletteItemBorderOuterColorSelected, 0.7);
-        box-shadow: inset rgba($paletteItemBorderInnerColorSelected, 0.7) 0 0 0 1px;
-      }
-
-      &.is-selected {
-        border-color: $paletteItemBorderOuterColorSelected !important;
-        box-shadow: inset rgba($paletteItemBorderInnerColorSelected, 1) 0 0 0 1px;
-      }
-    }
-  }
-
-  &--icon {
-    .c-palette__items {
-      grid-gap: 3px;
+        .c-menu & {
+            min-width: $paletteMenuMinW;
+        }
     }
 
-    .c-palette__item {
-      border-radius: $smallCr;
-      font-size: 0.6rem;
+    &__item {
+        $d: 12px;
+        border: 1px solid transparent;
+        cursor: pointer;
+        display: flex;
+        align-items: center;
+        align-content: center;
+        width: $d;
+        height: $d;
+        text-align: center;
 
-      &:before {
-        display: block;
-        width: 100%;
-      }
-
-      &:hover {
-        box-shadow: rgba($paletteItemBorderInnerColorSelected, 0.3) 0 0 0 1px;
-      }
-
-      &.is-selected {
-        box-shadow: rgba($paletteItemBorderInnerColorSelected, 0.6) 0 0 0 1px;
-      }
+        &.is-selected {
+            border-width: 1px;
+        }
+    }
+
+    &__item-none {
+        @include userSelectNone();
+        flex: 0 0 auto;
+        display: flex;
+        align-items: center;
+        margin-bottom: $interiorMarginSm;
+
+        .c-palette__item {
+            @include noColor();
+            border-color: $paletteItemBorderInnerColor;
+            margin-right: $interiorMarginSm;
+        }
+    }
+
+    &--color {
+        .c-palette__item {
+            &:hover {
+                border-color: rgba($paletteItemBorderOuterColorSelected, 0.7);
+                box-shadow: inset rgba($paletteItemBorderInnerColorSelected, 0.7) 0 0 0 1px;
+            }
+
+            &.is-selected {
+                border-color: $paletteItemBorderOuterColorSelected !important;
+                box-shadow: inset rgba($paletteItemBorderInnerColorSelected, 1) 0 0 0 1px;
+            }
+        }
+    }
+
+    &--icon {
+        .c-palette__items {
+            grid-gap: 3px;
+        }
+
+        .c-palette__item {
+            border-radius: $smallCr;
+            font-size: 0.6rem;
+
+            &:before {
+                display: block;
+                width: 100%;
+            }
+
+            &:hover {
+                box-shadow: rgba($paletteItemBorderInnerColorSelected, 0.3) 0 0 0 1px;
+            }
+
+            &.is-selected {
+                box-shadow: rgba($paletteItemBorderInnerColorSelected, 0.6) 0 0 0 1px;
+            }
+        }
     }
-  }
 }
 
 /******************************************************** SWATCHES */
 .c-color-swatch {
-  border: 1px solid rgba(#fff, 0.2);
-  box-shadow: rgba(#000, 0.2) 0 0 0 1px;
+    border: 1px solid rgba(#fff, 0.2);
+    box-shadow: rgba(#000, 0.2) 0 0 0 1px;
 }
 
 /******************************************************** TOOLBAR */
 .c-ctrl-wrapper {
-  @include cCtrlWrapper();
+    @include cCtrlWrapper();
 }
 
 .c-toolbar,
 .c-toolbar .c-ctrl-wrapper {
-  display: flex;
-  align-items: stretch;
+    display: flex;
+    align-items: stretch;
 }
 
 @mixin cToolbarSeparator() {
-  $m: 1px;
-  $b: 1px;
-  display: block;
-  width: $m + $b; // Allow for border
-  border-right: $b solid $colorInteriorBorder;
-  margin-right: $m;
+    $m: 1px;
+    $b: 1px;
+    display: block;
+    width: $m + $b; // Allow for border
+    border-right: $b solid $colorInteriorBorder;
+    margin-right: $m;
 }
 
 .c-separator {
-  @include cToolbarSeparator();
-  height: 100%;
+    @include cToolbarSeparator();
+    height: 100%;
 }
 
 .c-row-separator {
-  border-top: 1px solid $colorInteriorBorder;
-  height: 1px;
+    border-top: 1px solid $colorInteriorBorder;
+    height: 1px;
 }
 
 .c-toolbar {
-  display: flex;
-  align-items: center;
-
-  > * {
-    // First level items
     display: flex;
+    align-items: center;
 
-    > * + * {
-      margin-left: 2px;
-    }
-  }
+    > * {
+        // First level items
+        display: flex;
 
-  &__separator {
-    @include cToolbarSeparator();
-  }
-
-  .c-icon-button,
-  .c-labeled-input {
-    color: $editUIBaseColorFg;
-  }
-
-  .c-icon-button {
-    @include cControl();
-    $pLR: $interiorMargin - 1;
-    $pTB: 2px;
-    padding: $pTB $pLR;
-
-    @include hover() {
-      background: $editUIBaseColorHov !important;
-      color: $editUIBaseColorFg !important;
-    }
-
-    &--menu {
-      $p: 4px;
-      padding-top: $p;
-      padding-bottom: $p;
-    }
-
-    &--swatched {
-      padding-bottom: floor(math.div($pTB, 2));
-      width: 2em; // Standardize the width
-    }
-
-    &[class*='--caution'] {
-      &:before {
-        color: $colorBtnCautionBg;
-      }
-
-      @include hover() {
-        background: rgba($colorBtnCautionBgHov, 0.2);
-        :before {
-          color: $colorBtnCautionBgHov;
+        > * + * {
+            margin-left: 2px;
         }
-      }
-    }
-  }
-
-  .c-labeled-input {
-    font-size: 0.9em;
-    input[type='number'] {
-      width: 40px; // Number input sucks and must have size set using this method
     }
 
-    + .c-labeled-input {
-      margin-left: $interiorMargin;
+    &__separator {
+        @include cToolbarSeparator();
+    }
+
+    .c-icon-button,
+    .c-labeled-input {
+        color: $editUIBaseColorFg;
+    }
+
+    .c-icon-button {
+        @include cControl();
+        $pLR: $interiorMargin - 1;
+        $pTB: 2px;
+        padding: $pTB $pLR;
+
+        @include hover() {
+            background: $editUIBaseColorHov !important;
+            color: $editUIBaseColorFg !important;
+        }
+
+        &--menu {
+            $p: 4px;
+            padding-top: $p;
+            padding-bottom: $p;
+        }
+
+        &--swatched {
+            padding-bottom: floor(math.div($pTB, 2));
+            width: 2em; // Standardize the width
+        }
+
+        &[class*='--caution'] {
+            &:before {
+                color: $colorBtnCautionBg;
+            }
+
+            @include hover() {
+                background: rgba($colorBtnCautionBgHov, 0.2);
+                :before {
+                    color: $colorBtnCautionBgHov;
+                }
+            }
+        }
+    }
+
+    .c-labeled-input {
+        font-size: 0.9em;
+
+        input[type='number'] {
+            width: 40px; // Number input sucks and must have size set using this method
+        }
+
+        + .c-labeled-input {
+            margin-left: $interiorMargin;
+        }
     }
-  }
 }
 
 /********* Button Sets */
 .c-button-set {
-  display: inline-flex;
-  flex: 0 0 auto;
-
-  > * {
-    // Assume buttons are immediate descendants
+    display: inline-flex;
     flex: 0 0 auto;
-  }
 
-  &[class*='--strip'] {
-    // Buttons are smashed together with minimal margin
-    // c-buttons don't have border-radius between buttons, creates a tool-button-strip look
-    // c-icon-buttons get grouped more closely together
-    [class^='c-button'] {
-      // Only apply the following to buttons that have background, eg. c-button
-      border-radius: 0;
-    }
-  }
-
-  &[class*='--strip-h'] {
-    // Horizontal strip
-
-    + .c-button-set {
-      margin-left: $interiorMargin;
+    > * {
+        // Assume buttons are immediate descendants
+        flex: 0 0 auto;
     }
 
-    [class^='c-button'] {
-      + * {
-        margin-left: 1px;
-      }
-
-      &:first-child {
-        border-top-left-radius: $controlCr;
-        border-bottom-left-radius: $controlCr;
-      }
-
-      &:last-child {
-        border-top-right-radius: $controlCr;
-        border-bottom-right-radius: $controlCr;
-      }
+    &[class*='--strip'] {
+        // Buttons are smashed together with minimal margin
+        // c-buttons don't have border-radius between buttons, creates a tool-button-strip look
+        // c-icon-buttons get grouped more closely together
+        [class^='c-button'] {
+            // Only apply the following to buttons that have background, eg. c-button
+            border-radius: 0;
+        }
+    }
+
+    &[class*='--strip-h'] {
+        // Horizontal strip
+
+        + .c-button-set {
+            margin-left: $interiorMargin;
+        }
+
+        [class^='c-button'] {
+            + * {
+                margin-left: 1px;
+            }
+
+            &:first-child {
+                border-top-left-radius: $controlCr;
+                border-bottom-left-radius: $controlCr;
+            }
+
+            &:last-child {
+                border-top-right-radius: $controlCr;
+                border-bottom-right-radius: $controlCr;
+            }
+        }
     }
-  }
 }
 
 /******************************************************** STYLE EDITING */
 .c-style {
-  display: flex;
-  flex: 1 1 auto;
-  align-items: center;
-  justify-content: space-between;
-
-  &__controls {
-    // Holds thumb, icon buttons
     display: flex;
-    flex: 1 0 auto;
+    flex: 1 1 auto;
+    align-items: center;
+    justify-content: space-between;
 
-    > * + * {
-      margin-left: $interiorMargin;
-    }
-  }
+    &__controls {
+        // Holds thumb, icon buttons
+        display: flex;
+        flex: 1 0 auto;
 
-  &__button-save,
-  &__button-delete {
-    // Holds save and delete buttons accordingly
-    flex: 0 0 auto;
-  }
-
-  &--saved {
-    border-radius: $controlCr;
-    padding: $interiorMargin !important;
-    cursor: pointer;
-
-    @include hover {
-      background: rgba($editUIBaseColorHov, 0.3);
-    }
-
-    .c-style__controls {
-      [class*='button'] {
-        pointer-events: none;
-
-        &:before {
-          opacity: $controlDisabledOpacity;
+        > * + * {
+            margin-left: $interiorMargin;
+        }
+    }
+
+    &__button-save,
+    &__button-delete {
+        // Holds save and delete buttons accordingly
+        flex: 0 0 auto;
+    }
+
+    &--saved {
+        border-radius: $controlCr;
+        padding: $interiorMargin !important;
+        cursor: pointer;
+
+        @include hover {
+            background: rgba($editUIBaseColorHov, 0.3);
+        }
+
+        .c-style__controls {
+            [class*='button'] {
+                pointer-events: none;
+
+                &:before {
+                    opacity: $controlDisabledOpacity;
+                }
+            }
         }
-      }
     }
-  }
 }
 
 .c-style-thumb {
-  background-size: cover;
-  border: 1px solid transparent;
-  border-radius: $basicCr;
-  box-shadow: rgba($colorBodyFg, 0.4) 0 0 3px;
-  flex: 0 0 auto;
-  padding: $interiorMargin;
-  text-align: center;
-  width: 50px;
+    background-size: cover;
+    border: 1px solid transparent;
+    border-radius: $basicCr;
+    box-shadow: rgba($colorBodyFg, 0.4) 0 0 3px;
+    flex: 0 0 auto;
+    padding: $interiorMargin;
+    text-align: center;
+    width: 50px;
 
-  &--mixed {
-    @include mixedBg();
-  }
+    &--mixed {
+        @include mixedBg();
+    }
 }
 
 /******************************************************** SLIDERS */
 .c-slider {
-  @include cControl();
-  > * + * {
-    margin-left: $interiorMargin;
-  }
+    @include cControl();
+
+    > * + * {
+        margin-left: $interiorMargin;
+    }
 }
 
 /******************************************************** SLIDERS AND RANGE */
 @mixin sliderKnobRound($h: 12px) {
-  @include themedButton();
-  cursor: pointer;
-  width: $h;
-  height: $h;
-  border-radius: 50% !important;
+    @include themedButton();
+    cursor: pointer;
+    width: $h;
+    height: $h;
+    border-radius: 50% !important;
 }
 
 @mixin sliderTrack($bg: $scrollbarTrackColorBg, $knobH: 12px, $trackH: 3px) {
-  border-radius: 2px;
-  $breakPointPx: floor(math.div($knobH - $trackH, 2));
-  $bp1: $breakPointPx;
-  $bp2: $breakPointPx + $trackH;
-  box-sizing: border-box;
-  // For cross-browser compatibility, the track needs to be the same height as the knob.
-  height: $knobH;
-  // Gradient visually adds a horizontal line smaller than the knob
-  background: linear-gradient(0deg, rgba($bg, 0) $bp1, $bg $bp1, $bg $bp2, rgba($bg, 0) $bp2);
+    border-radius: 2px;
+    $breakPointPx: floor(math.div($knobH - $trackH, 2));
+    $bp1: $breakPointPx;
+    $bp2: $breakPointPx + $trackH;
+    box-sizing: border-box;
+    // For cross-browser compatibility, the track needs to be the same height as the knob.
+    height: $knobH;
+    // Gradient visually adds a horizontal line smaller than the knob
+    background: linear-gradient(0deg, rgba($bg, 0) $bp1, $bg $bp1, $bg $bp2, rgba($bg, 0) $bp2);
 }
 
 input[type='range'] {
-  // HTML5 range inputs
-  $knobH: 11px;
-  $trackH: 3px;
-  -webkit-appearance: none; /* Hides the slider so that custom slider can be made */
-  background: transparent; /* Otherwise white in Chrome */
+    // HTML5 range inputs
+    $knobH: 11px;
+    $trackH: 3px;
+    -webkit-appearance: none; /* Hides the slider so that custom slider can be made */
+    background: transparent; /* Otherwise white in Chrome */
 
-  &:focus {
-    outline: none; /* Removes the blue border. */
-  }
+    &:focus {
+        outline: none; /* Removes the blue border. */
+    }
 
-  // Thumb
-  &::-webkit-slider-thumb {
-    -webkit-appearance: none;
-    @include sliderKnobRound($knobH);
-  }
-  &::-moz-range-thumb {
-    border: none;
-    @include sliderKnobRound($knobH);
-  }
-  &::-ms-thumb {
-    border: none;
-    @include sliderKnobRound($knobH);
-  }
+    // Thumb
+    &::-webkit-slider-thumb {
+        -webkit-appearance: none;
+        @include sliderKnobRound($knobH);
+    }
 
-  // Track
-  &::-webkit-slider-runnable-track {
-    width: 100%;
-    @include sliderTrack($knobH: $knobH, $trackH: $trackH);
-  }
+    &::-moz-range-thumb {
+        border: none;
+        @include sliderKnobRound($knobH);
+    }
 
-  &::-moz-range-track {
-    width: 100%;
-    @include sliderTrack($knobH: $knobH, $trackH: $trackH);
-  }
+    &::-ms-thumb {
+        border: none;
+        @include sliderKnobRound($knobH);
+    }
+
+    // Track
+    &::-webkit-slider-runnable-track {
+        width: 100%;
+        @include sliderTrack($knobH: $knobH, $trackH: $trackH);
+    }
+
+    &::-moz-range-track {
+        width: 100%;
+        @include sliderTrack($knobH: $knobH, $trackH: $trackH);
+    }
 }
 
 /******************************************************** LOCAL CONTROLS */
 .h-local-controls {
-  // Holder for local controls
-  &--horz {
-    // Horizontal layout be
-    display: inline-flex;
-    align-items: center;
-  }
+    // Holder for local controls
+    &--horz {
+        // Horizontal layout be
+        display: inline-flex;
+        align-items: center;
+    }
 
-  [class*='--menus-aligned'] {
-    // Contains top level elements that hold dropdown menus
-    // Top level elements use display: contents to allow their menus to compactly align
-    // 03-18-22: used in ImageControls.vue
-    display: flex;
-    flex-direction: row;
-  }
+    [class*='--menus-aligned'] {
+        // Contains top level elements that hold dropdown menus
+        // Top level elements use display: contents to allow their menus to compactly align
+        // 03-18-22: used in ImageControls.vue
+        display: flex;
+        flex-direction: row;
+    }
 }
 
 .c-local-controls {
-  // Controls that are in close proximity to an element they effect
-  &--show-on-hover {
-    // Hidden by default; requires a hover 1 - 3 levels above to display
-    @include transition(opacity, $transOutTime);
-    opacity: 0;
-    pointer-events: auto;
-  }
+    // Controls that are in close proximity to an element they effect
+    &--show-on-hover {
+        // Hidden by default; requires a hover 1 - 3 levels above to display
+        @include transition(opacity, $transOutTime);
+        opacity: 0;
+        pointer-events: auto;
+    }
 }
 
 .has-local-controls:hover {
-  > .c-local-controls--show-on-hover,
-  > * > .c-local-controls--show-on-hover,
-  > * > * > .c-local-controls--show-on-hover,
-  > * > * > * > .c-local-controls--show-on-hover {
-    @include transition(opacity);
-    opacity: 1;
-    pointer-events: inherit;
+    > .c-local-controls--show-on-hover,
+    > * > .c-local-controls--show-on-hover,
+    > * > * > .c-local-controls--show-on-hover,
+    > * > * > * > .c-local-controls--show-on-hover {
+        @include transition(opacity);
+        opacity: 1;
+        pointer-events: inherit;
 
-    &[disabled] {
-      opacity: $controlDisabledOpacity;
+        &[disabled] {
+            opacity: $controlDisabledOpacity;
+        }
     }
-  }
 }
 
 /***************************************************** DRAG AND DROP */
 .c-drop-hint {
-  // Used in Tabs View, Flexible Grid Layouts
-  @include abs();
-  @include transition($prop: background-color, $dur: $transOutTime);
-  background-color: $colorDropHintBg;
-  color: $colorDropHintFg;
-  border-radius: $basicCr;
-  border: 1px dashed $colorDropHintFg;
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
-  align-items: center;
-  z-index: 50;
+    // Used in Tabs View, Flexible Grid Layouts
+    @include abs();
+    @include transition($prop: background-color, $dur: $transOutTime);
+    background-color: $colorDropHintBg;
+    color: $colorDropHintFg;
+    border-radius: $basicCr;
+    border: 1px dashed $colorDropHintFg;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+    z-index: 50;
 
-  &:not(.c-drop-hint--always-show) {
-    opacity: 0; // Must use this (rather than display: none) to enable transition effects
-    pointer-events: none;
-  }
+    &:not(.c-drop-hint--always-show) {
+        opacity: 0; // Must use this (rather than display: none) to enable transition effects
+        pointer-events: none;
+    }
 
-  &:before {
-    $h: 80%;
-    $mh: 25px;
-    background: $bg-icon-plus;
-    background-size: contain;
-    background-position: center center;
-    background-repeat: no-repeat;
-    content: '';
-    display: block;
-    filter: $colorKeyFilterHov;
-    height: $h;
-    width: $h;
-    max-height: $mh;
-    max-width: $mh;
-  }
+    &:before {
+        $h: 80%;
+        $mh: 25px;
+        background: $bg-icon-plus;
+        background-size: contain;
+        background-position: center center;
+        background-repeat: no-repeat;
+        content: '';
+        display: block;
+        filter: $colorKeyFilterHov;
+        height: $h;
+        width: $h;
+        max-height: $mh;
+        max-width: $mh;
+    }
 
-  .is-dragging &,
-  &.is-dragging {
-    pointer-events: inherit;
-    opacity: 0.8;
-  }
+    .is-dragging &,
+    &.is-dragging {
+        pointer-events: inherit;
+        opacity: 0.8;
+    }
 
-  .is-mouse-over &,
-  &.is-mouse-over {
-    background-color: $colorDropHintBgHov;
-    opacity: 0.9;
-  }
+    .is-mouse-over &,
+    &.is-mouse-over {
+        background-color: $colorDropHintBgHov;
+        opacity: 0.9;
+    }
+}
+
+/***************************************************** DISCRETE ITEMS */
+// OUTPUT
+// Element that showcases an output value. Used in Condition Sets and Derived Telemetry
+
+.c-output-featured {
+    display: flex;
+    gap: $interiorMargin;
+    padding: 0 $interiorMargin;
+
+    > * {
+        padding: $interiorMargin;
+    }
+
+    &__label {
+        flex: 0 0 auto;
+        text-transform: uppercase;
+    }
+
+    &__value {
+        $p: $interiorMargin * 2;
+        //font-size: 1.25em;
+        padding-left: $p;
+        padding-right: $p;
+        background: rgba(black, 0.2);
+        border-radius: $basicCr;
+    }
 }
 
 /***************************************************** LEGACY */
 .l-btn-set {
-  display: flex;
-  align-items: center;
+    display: flex;
+    align-items: center;
 }
diff --git a/src/styles/_glyphs.scss b/src/styles/_glyphs.scss
index 750eba7e29..3ac76a9c50 100755
--- a/src/styles/_glyphs.scss
+++ b/src/styles/_glyphs.scss
@@ -21,704 +21,935 @@
  *****************************************************************************/
 
 @font-face {
-  // Use https://icomoon.io/app with `Icomoon.Open MCT Symbols 2018.json` to generate font files
-  font-family: 'symbolsfont';
-  src: url('./fonts/Open-MCT-Symbols-16px.woff') format('woff'),
+    // Use https://icomoon.io/app with `Icomoon.Open MCT Symbols 2018.json` to generate font files
+    font-family: 'symbolsfont';
+    src: url('./fonts/Open-MCT-Symbols-16px.woff') format('woff'),
     url('./fonts/Open-MCT-Symbols-16px.ttf') format('truetype');
-  font-weight: normal;
-  font-style: normal;
+    font-weight: normal;
+    font-style: normal;
 }
 
 @font-face {
-  // Use https://icomoon.io/app with icomoon-project-Open-MCT-Symbols-12px.json to generate font files
-  font-family: 'symbolsfont-12px';
-  src: url('./fonts/Open-MCT-Symbols-12px.woff') format('woff'),
+    // Use https://icomoon.io/app with icomoon-project-Open-MCT-Symbols-12px.json to generate font files
+    font-family: 'symbolsfont-12px';
+    src: url('./fonts/Open-MCT-Symbols-12px.woff') format('woff'),
     url('./fonts/Open-MCT-Symbols-12px.ttf') format('truetype');
-  font-weight: normal;
-  font-style: normal;
+    font-weight: normal;
+    font-style: normal;
 }
 
 /************************** 16 PX CLASSES */
 .icon-alert-rect {
-  @include glyphBefore($glyph-icon-alert-rect);
+    @include glyphBefore($glyph-icon-alert-rect);
 }
+
 .icon-alert-triangle {
-  @include glyphBefore($glyph-icon-alert-triangle);
+    @include glyphBefore($glyph-icon-alert-triangle);
 }
+
 .icon-arrow-up {
-  @include glyphBefore($glyph-icon-arrow-up);
+    @include glyphBefore($glyph-icon-arrow-up);
 }
+
 .icon-arrow-double-up {
-  @include glyphBefore($glyph-icon-arrow-double-up);
+    @include glyphBefore($glyph-icon-arrow-double-up);
 }
+
 .icon-arrow-tall-up {
-  @include glyphBefore($glyph-icon-arrow-tall-up);
+    @include glyphBefore($glyph-icon-arrow-tall-up);
 }
+
 .icon-arrow-right {
-  @include glyphBefore($glyph-icon-arrow-right);
+    @include glyphBefore($glyph-icon-arrow-right);
 }
+
 .icon-arrow-right-equilateral {
-  @include glyphBefore($glyph-icon-arrow-right-equilateral);
+    @include glyphBefore($glyph-icon-arrow-right-equilateral);
 }
+
 .icon-arrow-down {
-  @include glyphBefore($glyph-icon-arrow-down);
+    @include glyphBefore($glyph-icon-arrow-down);
 }
+
 .icon-arrow-double-down {
-  @include glyphBefore($glyph-icon-arrow-double-down);
+    @include glyphBefore($glyph-icon-arrow-double-down);
 }
+
 .icon-arrow-tall-down {
-  @include glyphBefore($glyph-icon-arrow-tall-down);
+    @include glyphBefore($glyph-icon-arrow-tall-down);
 }
+
 .icon-arrow-left {
-  @include glyphBefore($glyph-icon-arrow-left);
+    @include glyphBefore($glyph-icon-arrow-left);
 }
+
 .icon-asterisk {
-  @include glyphBefore($glyph-icon-asterisk);
+    @include glyphBefore($glyph-icon-asterisk);
 }
+
 .icon-bell {
-  @include glyphBefore($glyph-icon-bell);
+    @include glyphBefore($glyph-icon-bell);
 }
+
 .icon-box-round-corners {
-  @include glyphBefore($glyph-icon-box-round-corners);
+    @include glyphBefore($glyph-icon-box-round-corners);
 }
+
 .icon-box-with-arrow {
-  @include glyphBefore($glyph-icon-box-with-arrow);
+    @include glyphBefore($glyph-icon-box-with-arrow);
 }
+
 .icon-check {
-  @include glyphBefore($glyph-icon-check);
+    @include glyphBefore($glyph-icon-check);
 }
+
 .icon-connectivity {
-  @include glyphBefore($glyph-icon-connectivity);
+    @include glyphBefore($glyph-icon-connectivity);
 }
+
 .icon-database-in-brackets {
-  @include glyphBefore($glyph-icon-database-in-brackets);
+    @include glyphBefore($glyph-icon-database-in-brackets);
 }
+
 .icon-eye-open {
-  @include glyphBefore($glyph-icon-eye-open);
+    @include glyphBefore($glyph-icon-eye-open);
 }
+
 .icon-gear {
-  @include glyphBefore($glyph-icon-gear);
+    @include glyphBefore($glyph-icon-gear);
 }
+
 .icon-gear-after {
-  @include glyphAfter($glyph-icon-gear);
+    @include glyphAfter($glyph-icon-gear);
 }
+
 .icon-hourglass {
-  @include glyphBefore($glyph-icon-hourglass);
+    @include glyphBefore($glyph-icon-hourglass);
 }
+
 .icon-info {
-  @include glyphBefore($glyph-icon-info);
+    @include glyphBefore($glyph-icon-info);
 }
+
 .icon-link {
-  @include glyphBefore($glyph-icon-link);
+    @include glyphBefore($glyph-icon-link);
 }
+
 .icon-lock {
-  @include glyphBefore($glyph-icon-lock);
+    @include glyphBefore($glyph-icon-lock);
 }
+
 .icon-minus {
-  @include glyphBefore($glyph-icon-minus);
+    @include glyphBefore($glyph-icon-minus);
 }
+
 .icon-people {
-  @include glyphBefore($glyph-icon-people);
+    @include glyphBefore($glyph-icon-people);
 }
+
 .icon-person {
-  @include glyphBefore($glyph-icon-person);
+    @include glyphBefore($glyph-icon-person);
 }
+
 .icon-plus {
-  @include glyphBefore($glyph-icon-plus);
+    @include glyphBefore($glyph-icon-plus);
 }
+
 .icon-plus-in-rect {
-  @include glyphBefore($glyph-icon-plus-in-rect);
+    @include glyphBefore($glyph-icon-plus-in-rect);
 }
+
 .icon-trash {
-  @include glyphBefore($glyph-icon-trash);
+    @include glyphBefore($glyph-icon-trash);
 }
+
 .icon-x {
-  @include glyphBefore($glyph-icon-x);
+    @include glyphBefore($glyph-icon-x);
 }
+
 .icon-brackets {
-  @include glyphBefore($glyph-icon-brackets);
+    @include glyphBefore($glyph-icon-brackets);
 }
+
 .icon-crosshair {
-  @include glyphBefore($glyph-icon-crosshair);
+    @include glyphBefore($glyph-icon-crosshair);
 }
+
 .icon-grippy {
-  @include glyphBefore($glyph-icon-grippy);
+    @include glyphBefore($glyph-icon-grippy);
 }
+
 .icon-grid {
-  @include glyphBefore($glyph-icon-grid);
+    @include glyphBefore($glyph-icon-grid);
 }
+
 .icon-grippy-ew {
-  @include glyphBefore($glyph-icon-grippy-ew);
+    @include glyphBefore($glyph-icon-grippy-ew);
 }
+
 .icon-columns {
-  @include glyphBefore($glyph-icon-columns);
+    @include glyphBefore($glyph-icon-columns);
 }
+
 .icon-rows {
-  @include glyphBefore($glyph-icon-rows);
+    @include glyphBefore($glyph-icon-rows);
 }
+
 .icon-filter {
-  @include glyphBefore($glyph-icon-filter);
+    @include glyphBefore($glyph-icon-filter);
 }
+
 .icon-filter-outline {
-  @include glyphBefore($glyph-icon-filter-outline);
+    @include glyphBefore($glyph-icon-filter-outline);
 }
+
 .icon-suitcase {
-  @include glyphBefore($glyph-icon-suitcase);
+    @include glyphBefore($glyph-icon-suitcase);
 }
+
 .icon-cursor-lock {
-  @include glyphBefore($glyph-icon-cursor-lock);
+    @include glyphBefore($glyph-icon-cursor-lock);
 }
+
 .icon-flag {
-  @include glyphBefore($glyph-icon-flag);
+    @include glyphBefore($glyph-icon-flag);
 }
+
 .icon-eye-disabled {
-  @include glyphBefore($glyph-icon-eye-disabled);
+    @include glyphBefore($glyph-icon-eye-disabled);
 }
+
 .icon-notebook-page {
-  @include glyphBefore($glyph-icon-notebook-page);
+    @include glyphBefore($glyph-icon-notebook-page);
 }
+
 .icon-unlocked {
-  @include glyphBefore($glyph-icon-unlocked);
+    @include glyphBefore($glyph-icon-unlocked);
 }
+
 .icon-circle {
-  @include glyphBefore($glyph-icon-circle);
+    @include glyphBefore($glyph-icon-circle);
 }
+
 .icon-draft {
-  @include glyphBefore($glyph-icon-draft);
+    @include glyphBefore($glyph-icon-draft);
 }
+
 .icon-question-mark {
-  @include glyphBefore($glyph-icon-question-mark);
+    @include glyphBefore($glyph-icon-question-mark);
 }
+
 .icon-circle-slash {
-  @include glyphBefore($glyph-icon-circle-slash);
+    @include glyphBefore($glyph-icon-circle-slash);
 }
+
 .icon-status-poll-check {
-  @include glyphBefore($glyph-icon-status-poll-check);
+    @include glyphBefore($glyph-icon-status-poll-check);
 }
+
 .icon-status-poll-caution {
-  @include glyphBefore($glyph-icon-status-poll-caution);
+    @include glyphBefore($glyph-icon-status-poll-caution);
 }
+
 .icon-status-poll-circle-slash {
-  @include glyphBefore($glyph-icon-status-poll-circle-slash);
+    @include glyphBefore($glyph-icon-status-poll-circle-slash);
 }
+
 .icon-status-poll-question-mark {
-  @include glyphBefore($glyph-icon-status-poll-question-mark);
+    @include glyphBefore($glyph-icon-status-poll-question-mark);
 }
+
 .icon-status-poll-edit {
-  @include glyphBefore($glyph-icon-status-poll-edit);
+    @include glyphBefore($glyph-icon-status-poll-edit);
 }
+
 .icon-stale {
-  @include glyphBefore($glyph-icon-stale);
+    @include glyphBefore($glyph-icon-stale);
 }
+
 .icon-arrows-right-left {
-  @include glyphBefore($glyph-icon-arrows-right-left);
+    @include glyphBefore($glyph-icon-arrows-right-left);
 }
+
 .icon-arrows-up-down {
-  @include glyphBefore($glyph-icon-arrows-up-down);
+    @include glyphBefore($glyph-icon-arrows-up-down);
 }
+
 .icon-bullet {
-  @include glyphBefore($glyph-icon-bullet);
+    @include glyphBefore($glyph-icon-bullet);
 }
+
 .icon-calendar {
-  @include glyphBefore($glyph-icon-calendar);
+    @include glyphBefore($glyph-icon-calendar);
 }
+
 .icon-chain-links {
-  @include glyphBefore($glyph-icon-chain-links);
+    @include glyphBefore($glyph-icon-chain-links);
 }
+
 .icon-download {
-  @include glyphBefore($glyph-icon-download);
+    @include glyphBefore($glyph-icon-download);
 }
+
 .icon-duplicate {
-  @include glyphBefore($glyph-icon-duplicate);
+    @include glyphBefore($glyph-icon-duplicate);
 }
+
 .icon-folder-new {
-  @include glyphBefore($glyph-icon-folder-new);
+    @include glyphBefore($glyph-icon-folder-new);
 }
+
 .icon-fullscreen-collapse {
-  @include glyphBefore($glyph-icon-fullscreen-collapse);
+    @include glyphBefore($glyph-icon-fullscreen-collapse);
 }
+
 .icon-fullscreen-expand {
-  @include glyphBefore($glyph-icon-fullscreen-expand);
+    @include glyphBefore($glyph-icon-fullscreen-expand);
 }
+
 .icon-layers {
-  @include glyphBefore($glyph-icon-layers);
+    @include glyphBefore($glyph-icon-layers);
 }
+
 .icon-line-horz {
-  @include glyphBefore($glyph-icon-line-horz);
+    @include glyphBefore($glyph-icon-line-horz);
 }
+
 .icon-magnify {
-  @include glyphBefore($glyph-icon-magnify);
+    @include glyphBefore($glyph-icon-magnify);
 }
+
 .icon-magnify-in {
-  @include glyphBefore($glyph-icon-magnify-in);
+    @include glyphBefore($glyph-icon-magnify-in);
 }
+
 .icon-magnify-out {
-  @include glyphBefore($glyph-icon-magnify-out);
+    @include glyphBefore($glyph-icon-magnify-out);
 }
+
 .icon-menu-hamburger {
-  @include glyphBefore($glyph-icon-menu-hamburger);
+    @include glyphBefore($glyph-icon-menu-hamburger);
 }
+
 .icon-move {
-  @include glyphBefore($glyph-icon-move);
+    @include glyphBefore($glyph-icon-move);
 }
+
 .icon-new-window {
-  @include glyphBefore($glyph-icon-new-window);
+    @include glyphBefore($glyph-icon-new-window);
 }
+
 .icon-paint-bucket {
-  @include glyphBefore($glyph-icon-paint-bucket);
+    @include glyphBefore($glyph-icon-paint-bucket);
 }
+
 .icon-pencil {
-  @include glyphBefore($glyph-icon-pencil);
+    @include glyphBefore($glyph-icon-pencil);
 }
+
 .icon-pencil-in-brackets {
-  @include glyphBefore($glyph-icon-pencil-in-brackets);
+    @include glyphBefore($glyph-icon-pencil-in-brackets);
 }
+
 .icon-play {
-  @include glyphBefore($glyph-icon-play);
+    @include glyphBefore($glyph-icon-play);
 }
+
 .icon-pause {
-  @include glyphBefore($glyph-icon-pause);
+    @include glyphBefore($glyph-icon-pause);
 }
+
 .icon-plot-resource {
-  @include glyphBefore($glyph-icon-plot-resource);
+    @include glyphBefore($glyph-icon-plot-resource);
 }
+
 .icon-pointer-left {
-  @include glyphBefore($glyph-icon-pointer-left);
+    @include glyphBefore($glyph-icon-pointer-left);
 }
+
 .icon-pointer-right {
-  @include glyphBefore($glyph-icon-pointer-right);
+    @include glyphBefore($glyph-icon-pointer-right);
 }
+
 .icon-refresh {
-  @include glyphBefore($glyph-icon-refresh);
+    @include glyphBefore($glyph-icon-refresh);
 }
+
 .icon-save {
-  @include glyphBefore($glyph-icon-save);
+    @include glyphBefore($glyph-icon-save);
 }
+
 .icon-save-as {
-  @include glyphBefore($glyph-icon-save-as);
+    @include glyphBefore($glyph-icon-save-as);
 }
+
 .icon-sine {
-  @include glyphBefore($glyph-icon-sine);
+    @include glyphBefore($glyph-icon-sine);
 }
+
 .icon-font {
-  @include glyphBefore($glyph-icon-font);
+    @include glyphBefore($glyph-icon-font);
 }
+
 .icon-thumbs-strip {
-  @include glyphBefore($glyph-icon-thumbs-strip);
+    @include glyphBefore($glyph-icon-thumbs-strip);
 }
+
 .icon-two-parts-both {
-  @include glyphBefore($glyph-icon-two-parts-both);
+    @include glyphBefore($glyph-icon-two-parts-both);
 }
+
 .icon-two-parts-one-only {
-  @include glyphBefore($glyph-icon-two-parts-one-only);
+    @include glyphBefore($glyph-icon-two-parts-one-only);
 }
+
 .icon-resync {
-  @include glyphBefore($glyph-icon-resync);
+    @include glyphBefore($glyph-icon-resync);
 }
+
 .icon-reset {
-  @include glyphBefore($glyph-icon-reset);
+    @include glyphBefore($glyph-icon-reset);
 }
+
 .icon-x-in-circle {
-  @include glyphBefore($glyph-icon-x-in-circle);
+    @include glyphBefore($glyph-icon-x-in-circle);
 }
+
 .icon-brightness {
-  @include glyphBefore($glyph-icon-brightness);
+    @include glyphBefore($glyph-icon-brightness);
 }
+
 .icon-contrast {
-  @include glyphBefore($glyph-icon-contrast);
+    @include glyphBefore($glyph-icon-contrast);
 }
+
 .icon-expand {
-  @include glyphBefore($glyph-icon-expand);
+    @include glyphBefore($glyph-icon-expand);
 }
+
 .icon-list-view {
-  @include glyphBefore($glyph-icon-list-view);
+    @include glyphBefore($glyph-icon-list-view);
 }
+
 .icon-grid-snap-to {
-  @include glyphBefore($glyph-icon-grid-snap-to);
+    @include glyphBefore($glyph-icon-grid-snap-to);
 }
+
 .icon-grid-snap-no {
-  @include glyphBefore($glyph-icon-grid-snap-no);
+    @include glyphBefore($glyph-icon-grid-snap-no);
 }
+
 .icon-frame-show {
-  @include glyphBefore($glyph-icon-frame-show);
+    @include glyphBefore($glyph-icon-frame-show);
 }
+
 .icon-frame-hide {
-  @include glyphBefore($glyph-icon-frame-hide);
+    @include glyphBefore($glyph-icon-frame-hide);
 }
+
 .icon-import {
-  @include glyphBefore($glyph-icon-import);
+    @include glyphBefore($glyph-icon-import);
 }
+
 .icon-export {
-  @include glyphBefore($glyph-icon-export);
+    @include glyphBefore($glyph-icon-export);
 }
+
 .icon-font-size {
-  @include glyphBefore($glyph-icon-font-size);
+    @include glyphBefore($glyph-icon-font-size);
 }
+
 .icon-clear-data {
-  @include glyphBefore($glyph-icon-clear-data);
+    @include glyphBefore($glyph-icon-clear-data);
 }
+
 .icon-history {
-  @include glyphBefore($glyph-icon-history);
+    @include glyphBefore($glyph-icon-history);
 }
+
 .icon-arrow-nav-to-parent {
-  @include glyphBefore($glyph-icon-arrow-nav-to-parent);
+    @include glyphBefore($glyph-icon-arrow-nav-to-parent);
 }
+
 .icon-crosshair-in-circle {
-  @include glyphBefore($glyph-icon-crosshair-in-circle);
+    @include glyphBefore($glyph-icon-crosshair-in-circle);
 }
+
 .icon-target {
-  @include glyphBefore($glyph-icon-target);
+    @include glyphBefore($glyph-icon-target);
 }
+
 .icon-items-collapse {
-  @include glyphBefore($glyph-icon-items-collapse);
+    @include glyphBefore($glyph-icon-items-collapse);
 }
+
 .icon-items-expand {
-  @include glyphBefore($glyph-icon-items-expand);
+    @include glyphBefore($glyph-icon-items-expand);
 }
+
 .icon-3-dots {
-  @include glyphBefore($glyph-icon-3-dots);
+    @include glyphBefore($glyph-icon-3-dots);
 }
+
 .icon-grid-on {
-  @include glyphBefore($glyph-icon-grid-on);
+    @include glyphBefore($glyph-icon-grid-on);
 }
+
 .icon-grid-off {
-  @include glyphBefore($glyph-icon-grid-off);
+    @include glyphBefore($glyph-icon-grid-off);
 }
+
 .icon-camera {
-  @include glyphBefore($glyph-icon-camera);
+    @include glyphBefore($glyph-icon-camera);
 }
+
 .icon-folders-collapse {
-  @include glyphBefore($glyph-icon-folders-collapse);
+    @include glyphBefore($glyph-icon-folders-collapse);
 }
+
 .icon-activity {
-  @include glyphBefore($glyph-icon-activity);
+    @include glyphBefore($glyph-icon-activity);
 }
+
 .icon-activity-mode {
-  @include glyphBefore($glyph-icon-activity-mode);
+    @include glyphBefore($glyph-icon-activity-mode);
 }
+
 .icon-autoflow-tabular {
-  @include glyphBefore($glyph-icon-autoflow-tabular);
+    @include glyphBefore($glyph-icon-autoflow-tabular);
 }
+
 .icon-clock {
-  @include glyphBefore($glyph-icon-clock);
+    @include glyphBefore($glyph-icon-clock);
 }
+
 .icon-database {
-  @include glyphBefore($glyph-icon-database);
+    @include glyphBefore($glyph-icon-database);
 }
+
 .icon-database-query {
-  @include glyphBefore($glyph-icon-database-query);
+    @include glyphBefore($glyph-icon-database-query);
 }
+
 .icon-dataset {
-  @include glyphBefore($glyph-icon-dataset);
+    @include glyphBefore($glyph-icon-dataset);
 }
+
 .icon-datatable {
-  @include glyphBefore($glyph-icon-datatable);
+    @include glyphBefore($glyph-icon-datatable);
 }
+
 .icon-dictionary {
-  @include glyphBefore($glyph-icon-dictionary);
+    @include glyphBefore($glyph-icon-dictionary);
 }
+
 .icon-folder {
-  @include glyphBefore($glyph-icon-folder);
+    @include glyphBefore($glyph-icon-folder);
 }
+
 .icon-image {
-  @include glyphBefore($glyph-icon-image);
+    @include glyphBefore($glyph-icon-image);
 }
+
 .icon-layout {
-  @include glyphBefore($glyph-icon-layout);
+    @include glyphBefore($glyph-icon-layout);
 }
+
 .icon-object {
-  @include glyphBefore($glyph-icon-object);
+    @include glyphBefore($glyph-icon-object);
 }
+
 .icon-object-unknown {
-  @include glyphBefore($glyph-icon-object-unknown);
+    @include glyphBefore($glyph-icon-object-unknown);
 }
+
 .icon-packet {
-  @include glyphBefore($glyph-icon-packet);
+    @include glyphBefore($glyph-icon-packet);
 }
+
 .icon-page {
-  @include glyphBefore($glyph-icon-page);
+    @include glyphBefore($glyph-icon-page);
 }
+
 .icon-plot-overlay {
-  @include glyphBefore($glyph-icon-plot-overlay);
+    @include glyphBefore($glyph-icon-plot-overlay);
 }
+
 .icon-plot-stacked {
-  @include glyphBefore($glyph-icon-plot-stacked);
+    @include glyphBefore($glyph-icon-plot-stacked);
 }
+
 .icon-session {
-  @include glyphBefore($glyph-icon-session);
+    @include glyphBefore($glyph-icon-session);
 }
+
 .icon-tabular {
-  @include glyphBefore($glyph-icon-tabular);
+    @include glyphBefore($glyph-icon-tabular);
 }
+
 .icon-tabular-lad {
-  @include glyphBefore($glyph-icon-tabular-lad);
+    @include glyphBefore($glyph-icon-tabular-lad);
 }
+
 .icon-tabular-lad-set {
-  @include glyphBefore($glyph-icon-tabular-lad-set);
+    @include glyphBefore($glyph-icon-tabular-lad-set);
 }
+
 .icon-tabular-realtime {
-  @include glyphBefore($glyph-icon-tabular-realtime);
+    @include glyphBefore($glyph-icon-tabular-realtime);
 }
+
 .icon-tabular-scrolling {
-  @include glyphBefore($glyph-icon-tabular-scrolling);
+    @include glyphBefore($glyph-icon-tabular-scrolling);
 }
+
 .icon-telemetry {
-  @include glyphBefore($glyph-icon-telemetry);
+    @include glyphBefore($glyph-icon-telemetry);
 }
+
 .icon-timeline {
-  @include glyphBefore($glyph-icon-timeline);
+    @include glyphBefore($glyph-icon-timeline);
 }
+
 .icon-timer {
-  @include glyphBefore($glyph-icon-timer);
+    @include glyphBefore($glyph-icon-timer);
 }
+
 .icon-topic {
-  @include glyphBefore($glyph-icon-topic);
+    @include glyphBefore($glyph-icon-topic);
 }
+
 .icon-box-with-dashed-lines {
-  @include glyphBefore($glyph-icon-box-with-dashed-lines);
+    @include glyphBefore($glyph-icon-box-with-dashed-lines);
 }
+
 .icon-summary-widget {
-  @include glyphBefore($glyph-icon-summary-widget);
+    @include glyphBefore($glyph-icon-summary-widget);
 }
+
 .icon-notebook {
-  @include glyphBefore($glyph-icon-notebook);
+    @include glyphBefore($glyph-icon-notebook);
 }
+
 .icon-tabs-view {
-  @include glyphBefore($glyph-icon-tabs-view);
+    @include glyphBefore($glyph-icon-tabs-view);
 }
+
 .icon-flexible-layout {
-  @include glyphBefore($glyph-icon-flexible-layout);
+    @include glyphBefore($glyph-icon-flexible-layout);
 }
+
 .icon-generator-telemetry {
-  @include glyphBefore($glyph-icon-generator-telemetry);
+    @include glyphBefore($glyph-icon-generator-telemetry);
 }
+
 .icon-generator-events {
-  @include glyphBefore($glyph-icon-generator-events);
+    @include glyphBefore($glyph-icon-generator-events);
 }
+
 .icon-gauge {
-  @include glyphBefore($glyph-icon-gauge);
+    @include glyphBefore($glyph-icon-gauge);
 }
+
 .icon-spectra {
-  @include glyphBefore($glyph-icon-spectra);
+    @include glyphBefore($glyph-icon-spectra);
 }
+
 .icon-spectra-telemetry {
-  @include glyphBefore($glyph-icon-spectra-telemetry);
+    @include glyphBefore($glyph-icon-spectra-telemetry);
 }
+
 .icon-command {
-  @include glyphBefore($glyph-icon-command);
+    @include glyphBefore($glyph-icon-command);
 }
+
 .icon-conditional {
-  @include glyphBefore($glyph-icon-conditional);
+    @include glyphBefore($glyph-icon-conditional);
 }
+
 .icon-condition-widget {
-  @include glyphBefore($glyph-icon-condition-widget);
+    @include glyphBefore($glyph-icon-condition-widget);
 }
+
 .icon-alphanumeric {
-  @include glyphBefore($glyph-icon-alphanumeric);
+    @include glyphBefore($glyph-icon-alphanumeric);
 }
+
 .icon-image-telemetry {
-  @include glyphBefore($glyph-icon-image-telemetry);
+    @include glyphBefore($glyph-icon-image-telemetry);
 }
+
 .icon-telemetry-aggregate {
-  @include glyphBefore($glyph-icon-telemetry-aggregate);
+    @include glyphBefore($glyph-icon-telemetry-aggregate);
 }
+
 .icon-bar-chart {
-  @include glyphBefore($glyph-icon-bar-chart);
+    @include glyphBefore($glyph-icon-bar-chart);
 }
+
 .icon-map {
-  @include glyphBefore($glyph-icon-map);
+    @include glyphBefore($glyph-icon-map);
 }
+
 .icon-plan {
-  @include glyphBefore($glyph-icon-plan);
+    @include glyphBefore($glyph-icon-plan);
 }
+
 .icon-timelist {
-  @include glyphBefore($glyph-icon-timelist);
-}
-.icon-notebook-shift-log {
-  @include glyphBefore($glyph-icon-notebook-shift-log);
+    @include glyphBefore($glyph-icon-timelist);
 }
+
 .icon-plot-scatter {
-  @include glyphBefore($glyph-icon-plot-scatter);
+    @include glyphBefore($glyph-icon-plot-scatter);
+}
+
+.icon-notebook-shift-log {
+    @include glyphBefore($glyph-icon-notebook-shift-log);
+}
+
+.icon-derived-telemetry {
+    @include glyphBefore($glyph-icon-derived-telemetry);
 }
 
 /************************** 12 PX CLASSES */
 // TODO: sync with 16px redo as of 10/25/18
 .icon-filter-12px {
-  @include glyphBefore($glyph-icon-filter, 'symbolsfont-12px');
+    @include glyphBefore($glyph-icon-filter, 'symbolsfont-12px');
 }
+
 .icon-filter-outline-12px {
-  @include glyphBefore($glyph-icon-filter-outline, 'symbolsfont-12px');
+    @include glyphBefore($glyph-icon-filter-outline, 'symbolsfont-12px');
 }
+
 .icon-crosshair-12px {
-  @include glyphBefore($glyph-icon-crosshair, 'symbolsfont-12px');
+    @include glyphBefore($glyph-icon-crosshair, 'symbolsfont-12px');
 }
+
 .icon-folder-12px {
-  @include glyphBefore($glyph-icon-folder, 'symbolsfont-12px');
+    @include glyphBefore($glyph-icon-folder, 'symbolsfont-12px');
 }
+
 .icon-list-view-12px {
-  @include glyphBefore($glyph-icon-list-view, 'symbolsfont-12px');
+    @include glyphBefore($glyph-icon-list-view, 'symbolsfont-12px');
 }
+
 .icon-grippy-12px {
-  @include glyphBefore($glyph-icon-grippy, 'symbolsfont-12px');
+    @include glyphBefore($glyph-icon-grippy, 'symbolsfont-12px');
 }
 
 /************************** GLYPH BG CLASSES */
 .bg-icon-alert-rect {
-  @include glyphBg($bg-icon-alert-rect);
+    @include glyphBg($bg-icon-alert-rect);
 }
+
 .bg-icon-alert-triangle {
-  @include glyphBg($bg-icon-alert-triangle);
+    @include glyphBg($bg-icon-alert-triangle);
 }
+
 .bg-icon-bell {
-  @include glyphBg($bg-icon-bell);
+    @include glyphBg($bg-icon-bell);
 }
+
 .bg-icon-info {
-  @include glyphBg($bg-icon-info);
+    @include glyphBg($bg-icon-info);
 }
+
 .bg-icon-plus {
-  @include glyphBg($bg-icon-plus);
+    @include glyphBg($bg-icon-plus);
 }
+
 .bg-icon-grippy-ew {
-  @include glyphBg($bg-icon-grippy-ew);
+    @include glyphBg($bg-icon-grippy-ew);
 }
+
 .bg-icon-chain-links {
-  @include glyphBg($bg-icon-chain-links);
+    @include glyphBg($bg-icon-chain-links);
 }
+
 .bg-icon-clock {
-  @include glyphBg($bg-icon-clock);
+    @include glyphBg($bg-icon-clock);
 }
+
 .bg-icon-database {
-  @include glyphBg($bg-icon-database);
+    @include glyphBg($bg-icon-database);
 }
+
 .bg-icon-database-query {
-  @include glyphBg($bg-icon-database-query);
+    @include glyphBg($bg-icon-database-query);
 }
+
 .bg-icon-dataset {
-  @include glyphBg($bg-icon-dataset);
+    @include glyphBg($bg-icon-dataset);
 }
+
 .bg-icon-datatable {
-  @include glyphBg($bg-icon-datatable);
+    @include glyphBg($bg-icon-datatable);
 }
+
 .bg-icon-dictionary {
-  @include glyphBg($bg-icon-dictionary);
+    @include glyphBg($bg-icon-dictionary);
 }
+
 .bg-icon-folder {
-  @include glyphBg($bg-icon-folder);
+    @include glyphBg($bg-icon-folder);
 }
+
 .bg-icon-image {
-  @include glyphBg($bg-icon-image);
+    @include glyphBg($bg-icon-image);
 }
+
 .bg-icon-layout {
-  @include glyphBg($bg-icon-layout);
+    @include glyphBg($bg-icon-layout);
 }
+
 .bg-icon-object {
-  @include glyphBg($bg-icon-object);
+    @include glyphBg($bg-icon-object);
 }
+
 .bg-icon-object-unknown {
-  @include glyphBg($bg-icon-object-unknown);
+    @include glyphBg($bg-icon-object-unknown);
 }
+
 .bg-icon-packet {
-  @include glyphBg($bg-icon-packet);
+    @include glyphBg($bg-icon-packet);
 }
+
 .bg-icon-page {
-  @include glyphBg($bg-icon-page);
+    @include glyphBg($bg-icon-page);
 }
+
 .bg-icon-plot-overlay {
-  @include glyphBg($bg-icon-plot-overlay);
+    @include glyphBg($bg-icon-plot-overlay);
 }
+
 .bg-icon-plot-stacked {
-  @include glyphBg($bg-icon-plot-stacked);
+    @include glyphBg($bg-icon-plot-stacked);
 }
+
 .bg-icon-session {
-  @include glyphBg($bg-icon-session);
+    @include glyphBg($bg-icon-session);
 }
+
 .bg-icon-tabular {
-  @include glyphBg($bg-icon-tabular);
+    @include glyphBg($bg-icon-tabular);
 }
+
 .bg-icon-tabular-lad {
-  @include glyphBg($bg-icon-tabular-lad);
+    @include glyphBg($bg-icon-tabular-lad);
 }
+
 .bg-icon-tabular-lad-set {
-  @include glyphBg($bg-icon-tabular-lad-set);
+    @include glyphBg($bg-icon-tabular-lad-set);
 }
+
 .bg-icon-tabular-scrolling {
-  @include glyphBg($bg-icon-tabular-scrolling);
+    @include glyphBg($bg-icon-tabular-scrolling);
 }
+
 .bg-icon-telemetry {
-  @include glyphBg($bg-icon-telemetry);
+    @include glyphBg($bg-icon-telemetry);
 }
+
 .bg-icon-timeline {
-  @include glyphBg($bg-icon-timeline);
+    @include glyphBg($bg-icon-timeline);
 }
+
 .bg-icon-timer {
-  @include glyphBg($bg-icon-timer);
+    @include glyphBg($bg-icon-timer);
 }
+
 .bg-icon-box-with-dashed-lines {
-  @include glyphBg($bg-icon-box-with-dashed-lines);
+    @include glyphBg($bg-icon-box-with-dashed-lines);
 }
+
 .bg-icon-summary-widget {
-  @include glyphBg($bg-icon-summary-widget);
+    @include glyphBg($bg-icon-summary-widget);
 }
+
 .bg-icon-notebook {
-  @include glyphBg($bg-icon-notebook);
+    @include glyphBg($bg-icon-notebook);
 }
+
 .bg-icon-tabs-view {
-  @include glyphBg($bg-icon-tabs-view);
+    @include glyphBg($bg-icon-tabs-view);
 }
+
 .bg-icon-flexible-layout {
-  @include glyphBg($bg-icon-flexible-layout);
+    @include glyphBg($bg-icon-flexible-layout);
 }
+
 .bg-icon-generator-telemetry {
-  @include glyphBg($bg-icon-generator-telemetry);
+    @include glyphBg($bg-icon-generator-telemetry);
 }
+
 .bg-icon-generator-events {
-  @include glyphBg($bg-icon-generator-events);
+    @include glyphBg($bg-icon-generator-events);
 }
+
 .bg-icon-gauge {
-  @include glyphBg($bg-icon-gauge);
+    @include glyphBg($bg-icon-gauge);
 }
+
 .bg-icon-spectra {
-  @include glyphBg($bg-icon-spectra);
+    @include glyphBg($bg-icon-spectra);
 }
+
 .bg-icon-spectra-telemetry {
-  @include glyphBg($bg-icon-spectra-telemetry);
+    @include glyphBg($bg-icon-spectra-telemetry);
 }
+
 .bg-icon-command {
-  @include glyphBg($bg-icon-command);
+    @include glyphBg($bg-icon-command);
 }
+
 .bg-icon-conditional {
-  @include glyphBg($bg-icon-conditional);
+    @include glyphBg($bg-icon-conditional);
 }
+
 .bg-icon-condition-widget {
-  @include glyphBg($bg-icon-condition-widget);
+    @include glyphBg($bg-icon-condition-widget);
 }
+
 .bg-icon-bar-chart {
-  @include glyphBg($bg-icon-bar-chart);
+    @include glyphBg($bg-icon-bar-chart);
 }
+
 .bg-icon-map {
-  @include glyphBg($bg-icon-map);
+    @include glyphBg($bg-icon-map);
 }
+
 .bg-icon-plan {
-  @include glyphBg($bg-icon-plan);
+    @include glyphBg($bg-icon-plan);
 }
+
 .bg-icon-timelist {
-  @include glyphBg($bg-icon-timelist);
+    @include glyphBg($bg-icon-timelist);
 }
+
 .bg-icon-plot-scatter {
-  @include glyphBg($bg-icon-plot-scatter);
+    @include glyphBg($bg-icon-plot-scatter);
 }
+
 .bg-icon-notebook-shift-log {
-  @include glyphBg($bg-icon-notebook-shift-log);
+    @include glyphBg($bg-icon-notebook-shift-log);
 }
+
 .bg-icon-telemetry-aggregate {
-  @include glyphBg($bg-icon-telemetry-aggregate);
+    @include glyphBg($bg-icon-telemetry-aggregate);
 }
+
 .bg-icon-trash {
-  @include glyphBg($bg-icon-trash);
+    @include glyphBg($bg-icon-trash);
 }
+
 .bg-icon-eye-open {
-  @include glyphBg($bg-icon-eye-open);
+    @include glyphBg($bg-icon-eye-open);
 }
+
 .bg-icon-camera {
-  @include glyphBg($bg-icon-camera);
+    @include glyphBg($bg-icon-camera);
+}
+
+.bg-icon-derived-telemetry {
+    @include glyphBg($bg-icon-derived-telemetry);
 }
diff --git a/src/styles/fonts/Open MCT Symbols 16px.json b/src/styles/fonts/Open MCT Symbols 16px.json
index 5f4e667125..83952493d2 100644
--- a/src/styles/fonts/Open MCT Symbols 16px.json	
+++ b/src/styles/fonts/Open MCT Symbols 16px.json	
@@ -2,7 +2,7 @@
   "metadata": {
     "name": "Open MCT Symbols 16px",
     "lastOpened": 0,
-    "created": 1674103729548
+    "created": 1725468793547
   },
   "iconSets": [
     {
@@ -1328,19 +1328,27 @@
           "tempChar": ""
         },
         {
-          "order": 214,
+          "order": 218,
           "id": 184,
           "name": "icon-notebook-restricted",
           "prevSize": 16,
           "code": 60209,
           "tempChar": ""
+        },
+        {
+          "order": 217,
+          "id": 186,
+          "name": "icon-telemetry-derived",
+          "prevSize": 16,
+          "code": 60210,
+          "tempChar": ""
         }
       ],
       "id": 0,
       "metadata": {
         "name": "Open MCT Symbols 16px",
         "importSize": {
-          "width": 512,
+          "width": 576,
           "height": 512
         },
         "designer": "Charles Hacskaylo"
@@ -1355,7 +1363,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-alert-rect-v2"],
+          "tags": [
+            "icon-alert-rect-v2"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -1367,97 +1377,137 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-alert-triangle-v2"],
+          "tags": [
+            "icon-alert-triangle-v2"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
         },
         {
           "id": 112,
-          "paths": ["M512 256l-512 512h1024z"],
+          "paths": [
+            "M512 256l-512 512h1024z"
+          ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-arrow-up"],
+          "tags": [
+            "icon-arrow-up"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
         },
         {
           "id": 94,
-          "paths": ["M510 510l512 512h-1024z", "M510-2l512 512h-1024z"],
+          "paths": [
+            "M510 510l512 512h-1024z",
+            "M510-2l512 512h-1024z"
+          ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-arrow-double-up"],
+          "tags": [
+            "icon-arrow-double-up"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
         },
         {
           "id": 96,
-          "paths": ["M512 0l512 1024h-1024z"],
+          "paths": [
+            "M512 0l512 1024h-1024z"
+          ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-arrow-tall-up"],
+          "tags": [
+            "icon-arrow-tall-up"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
         },
         {
           "id": 111,
-          "paths": ["M768 512l-512-512v1024z"],
+          "paths": [
+            "M768 512l-512-512v1024z"
+          ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-arrow-right"],
+          "tags": [
+            "icon-arrow-right"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
         },
         {
           "id": 18,
-          "paths": ["M962 512l-896 512v-1024z"],
+          "paths": [
+            "M962 512l-896 512v-1024z"
+          ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-arrow-right-equilateral"],
+          "tags": [
+            "icon-arrow-right-equilateral"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
         },
         {
           "id": 113,
-          "paths": ["M512 768l512-512h-1024z"],
+          "paths": [
+            "M512 768l512-512h-1024z"
+          ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-arrow-down"],
+          "tags": [
+            "icon-arrow-down"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
         },
         {
           "id": 93,
-          "paths": ["M510 510l-512-512h1024z", "M510 1022l-512-512h1024z"],
+          "paths": [
+            "M510 510l-512-512h1024z",
+            "M510 1022l-512-512h1024z"
+          ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-arrow-double-down"],
+          "tags": [
+            "icon-arrow-double-down"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
         },
         {
           "id": 95,
-          "paths": ["M512 1024l-512-1024h1024z"],
+          "paths": [
+            "M512 1024l-512-1024h1024z"
+          ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-arrow-tall-down"],
+          "tags": [
+            "icon-arrow-tall-down"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
         },
         {
           "id": 114,
-          "paths": ["M256 512l512 512v-1024z"],
+          "paths": [
+            "M256 512l512 512v-1024z"
+          ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-arrow-left"],
+          "tags": [
+            "icon-arrow-left"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -1469,7 +1519,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-asterisk"],
+          "tags": [
+            "icon-asterisk"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -1482,7 +1534,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-bell"],
+          "tags": [
+            "icon-bell"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -1494,7 +1548,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-box-round-corners"],
+          "tags": [
+            "icon-box-round-corners"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -1507,17 +1563,23 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-box-with-arrow-cursor"],
+          "tags": [
+            "icon-box-with-arrow-cursor"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
         },
         {
           "id": 120,
-          "paths": ["M1024 0l-640 640-384-384v384l384 384 640-640z"],
+          "paths": [
+            "M1024 0l-640 640-384-384v384l384 384 640-640z"
+          ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-check"],
+          "tags": [
+            "icon-check"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -1531,7 +1593,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-connectivity"],
+          "tags": [
+            "icon-connectivity"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -1546,7 +1610,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-database-in-brackets"],
+          "tags": [
+            "icon-database-in-brackets"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -1559,7 +1625,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-eye-open-v2"],
+          "tags": [
+            "icon-eye-open-v2"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -1571,7 +1639,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-gear"],
+          "tags": [
+            "icon-gear"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -1584,7 +1654,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-hourglass"],
+          "tags": [
+            "icon-hourglass"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -1596,17 +1668,23 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-info"],
+          "tags": [
+            "icon-info"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
         },
         {
           "id": 75,
-          "paths": ["M1024 512l-512-512v307.2l-512 204.8v256h512v256z"],
+          "paths": [
+            "M1024 512l-512-512v307.2l-512 204.8v256h512v256z"
+          ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-link-v2"],
+          "tags": [
+            "icon-link-v2"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -1616,13 +1694,19 @@
           "paths": [
             "M702 384h-62v-128c0-141.385-114.615-256-256-256s-256 114.615-256 256v0 128h-64c-35.301 0.113-63.887 28.699-64 63.989v512.011c0.113 35.301 28.699 63.887 63.989 64h638.011c35.301-0.113 63.887-28.699 64-63.989v-512.011c-0.113-35.301-28.699-63.887-63.989-64h-0.011zM256 384v-128c0-70.692 57.308-128 128-128s128 57.308 128 128v0 128z"
           ],
-          "attrs": [{}],
+          "attrs": [
+            {}
+          ],
           "grid": 16,
-          "tags": ["icon-lock"],
+          "tags": [
+            "icon-lock"
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "colorPermutations": {
-            "12552552551": [{}]
+            "12552552551": [
+              {}
+            ]
           },
           "width": 768
         },
@@ -1633,7 +1717,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-minus"],
+          "tags": [
+            "icon-minus"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -1648,7 +1734,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-people"],
+          "tags": [
+            "icon-people"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -1661,7 +1749,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-person"],
+          "tags": [
+            "icon-person"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -1673,7 +1763,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-plus"],
+          "tags": [
+            "icon-plus"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -1683,13 +1775,19 @@
           "paths": [
             "M830 0h-636c-106.6 0-194 87.2-194 194v636c0 106.8 87.4 194 194 194h636c106.6 0 194-87.2 194-194v-636c0-106.8-87.4-194-194-194zM896 608c0 17.673-14.327 32-32 32v0h-224v224c0 17.673-14.327 32-32 32v0h-192c-17.673 0-32-14.327-32-32v0-224h-224c-17.673 0-32-14.327-32-32v0-192c0-17.673 14.327-32 32-32v0h224v-224c0-17.673 14.327-32 32-32v0h192c17.673 0 32 14.327 32 32v0 224h224c17.673 0 32 14.327 32 32v0z"
           ],
-          "attrs": [{}],
+          "attrs": [
+            {}
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "grid": 16,
-          "tags": ["icon-plus-in-rect"],
+          "tags": [
+            "icon-plus-in-rect"
+          ],
           "colorPermutations": {
-            "12552552551": [{}]
+            "12552552551": [
+              {}
+            ]
           }
         },
         {
@@ -1699,7 +1797,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-trash"],
+          "tags": [
+            "icon-trash"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -1711,7 +1811,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-x-heavy"],
+          "tags": [
+            "icon-x-heavy"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -1724,7 +1826,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-brackets"],
+          "tags": [
+            "icon-brackets"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -1739,7 +1843,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-crosshair"],
+          "tags": [
+            "icon-crosshair"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -1763,7 +1869,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-grippy-v2"],
+          "tags": [
+            "icon-grippy-v2"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -1778,7 +1886,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-grid-v2"],
+          "tags": [
+            "icon-grid-v2"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -1790,13 +1900,23 @@
             "M448 0h128v1024h-128v-1024z",
             "M192 0h128v1024h-128v-1024z"
           ],
-          "attrs": [{}, {}, {}],
+          "attrs": [
+            {},
+            {},
+            {}
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "grid": 16,
-          "tags": ["icon-grippy-ew"],
+          "tags": [
+            "icon-grippy-ew"
+          ],
           "colorPermutations": {
-            "12552552551": [{}, {}, {}]
+            "12552552551": [
+              {},
+              {},
+              {}
+            ]
           }
         },
         {
@@ -1806,13 +1926,23 @@
             "M384 0h256v1024h-256v-1024z",
             "M768 0h256v1024h-256v-1024z"
           ],
-          "attrs": [{}, {}, {}],
+          "attrs": [
+            {},
+            {},
+            {}
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "grid": 16,
-          "tags": ["icon-columns"],
+          "tags": [
+            "icon-columns"
+          ],
           "colorPermutations": {
-            "12552552551": [{}, {}, {}]
+            "12552552551": [
+              {},
+              {},
+              {}
+            ]
           }
         },
         {
@@ -1822,13 +1952,23 @@
             "M0 384h1024v256h-1024v-256z",
             "M0 768h1024v256h-1024v-256z"
           ],
-          "attrs": [{}, {}, {}],
+          "attrs": [
+            {},
+            {},
+            {}
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "grid": 16,
-          "tags": ["icon-rows"],
+          "tags": [
+            "icon-rows"
+          ],
           "colorPermutations": {
-            "12552552551": [{}, {}, {}]
+            "12552552551": [
+              {},
+              {},
+              {}
+            ]
           }
         },
         {
@@ -1836,13 +1976,19 @@
           "paths": [
             "M896 0h-768c-70.601 0.227-127.773 57.399-128 127.978l-0 0.022v768c0.227 70.601 57.399 127.773 127.978 128l0.022 0h256v-512l-192-192h640l-192 192v512h256c70.601-0.227 127.773-57.399 128-127.978l0-0.022v-768c-0.227-70.601-57.399-127.773-127.978-128l-0.022-0z"
           ],
-          "attrs": [{}],
+          "attrs": [
+            {}
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "grid": 16,
-          "tags": ["icon-filter"],
+          "tags": [
+            "icon-filter"
+          ],
           "colorPermutations": {
-            "12552552551": [{}]
+            "12552552551": [
+              {}
+            ]
           }
         },
         {
@@ -1850,13 +1996,19 @@
           "paths": [
             "M896 0h-768c-70.601 0.227-127.773 57.399-128 127.978l-0 0.022v768c0.227 70.601 57.399 127.773 127.978 128l0.022 0h768c70.601-0.227 127.773-57.399 128-127.978l0-0.022v-768c-0.227-70.601-57.399-127.773-127.978-128l-0.022-0zM896 895.8h-256v-383.8l192-192h-640l192 192v384h-256v-767.8h768z"
           ],
-          "attrs": [{}],
+          "attrs": [
+            {}
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "grid": 16,
-          "tags": ["icon-filter-outline"],
+          "tags": [
+            "icon-filter-outline"
+          ],
           "colorPermutations": {
-            "12552552551": [{}]
+            "12552552551": [
+              {}
+            ]
           }
         },
         {
@@ -1866,13 +2018,23 @@
             "M0 320v640c0.102 35.305 28.695 63.898 63.99 64l0.010 0h64v-768h-64c-35.305 0.102-63.898 28.695-64 63.99l-0 0.010z",
             "M960 256h-64v768h64c35.305-0.102 63.898-28.695 64-63.99l0-0.010v-640c-0.102-35.305-28.695-63.898-63.99-64l-0.010-0z"
           ],
-          "attrs": [{}, {}, {}],
+          "attrs": [
+            {},
+            {},
+            {}
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "grid": 16,
-          "tags": ["icon-suitcase"],
+          "tags": [
+            "icon-suitcase"
+          ],
           "colorPermutations": {
-            "12552552551": [{}, {}, {}]
+            "12552552551": [
+              {},
+              {},
+              {}
+            ]
           }
         },
         {
@@ -1880,14 +2042,20 @@
           "paths": [
             "M704 320h-64v-64c0-141.385-114.615-256-256-256s-256 114.615-256 256v0 64h-64c-35.301 0.113-63.887 28.699-64 63.989l-0 0.011v576c0.113 35.301 28.699 63.887 63.989 64l0.011 0h640c35.301-0.113 63.887-28.699 64-63.989l0-0.011v-576c-0.113-35.301-28.699-63.887-63.989-64l-0.011-0zM256 256c0-70.692 57.308-128 128-128s128 57.308 128 128v0 64h-256zM533.4 896l-128-128-43 85-170.4-383.6 383.6 170.2-85 43 128 128z"
           ],
-          "attrs": [{}],
+          "attrs": [
+            {}
+          ],
           "width": 768,
           "isMulticolor": false,
           "isMulticolor2": false,
           "grid": 16,
-          "tags": ["icon-cursor-locked"],
+          "tags": [
+            "icon-cursor-locked"
+          ],
           "colorPermutations": {
-            "12552552551": [{}]
+            "12552552551": [
+              {}
+            ]
           }
         },
         {
@@ -1895,13 +2063,19 @@
           "paths": [
             "M192 640h832l-192-320 192-320h-896c-70.606 0.215-127.785 57.394-128 127.979l-0 0.021v896h192z"
           ],
-          "attrs": [{}],
+          "attrs": [
+            {}
+          ],
           "grid": 16,
-          "tags": ["icon-flag"],
+          "tags": [
+            "icon-flag"
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "colorPermutations": {
-            "12552552551": [{}]
+            "12552552551": [
+              {}
+            ]
           }
         },
         {
@@ -1911,13 +2085,23 @@
             "M814.76 415.080q7.52 10 14.44 20.52c14.737 21.984 27.741 47.184 37.759 73.847l0.841 2.553c-10.859 29.216-23.863 54.416-39.447 77.748l0.847-1.348c-23.221 34.963-50.705 64.8-82.207 89.793l-0.793 0.607c-57.762 45.834-130.437 75.216-209.743 80.049l-1.057 0.051-114.46 140.86c27.346 4.988 58.817 7.84 90.955 7.84 0.037 0 0.074-0 0.111-0l-0.005 0c245.8 0 452.2-168 510.8-395.6-21.856-82.93-60.906-154.847-113.325-214.773l0.525 0.613z",
             "M832 0l-832 1024h192l832-1024h-192z"
           ],
-          "attrs": [{}, {}, {}],
+          "attrs": [
+            {},
+            {},
+            {}
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "grid": 16,
-          "tags": ["icon-eye-disabled"],
+          "tags": [
+            "icon-eye-disabled"
+          ],
           "colorPermutations": {
-            "12552552551": [{}, {}, {}]
+            "12552552551": [
+              {},
+              {},
+              {}
+            ]
           }
         },
         {
@@ -1925,13 +2109,19 @@
           "paths": [
             "M830 62h-830l-4 702c0 106.6 87.4 194 194 194h640c106.6 0 194-87.4 194-194v-508c0-106.8-87.4-194-194-194zM832 446l-384 384-192-192v-256l192 192 384-384v256z"
           ],
-          "attrs": [{}],
+          "attrs": [
+            {}
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "grid": 16,
-          "tags": ["icon-notebook-page"],
+          "tags": [
+            "icon-notebook-page"
+          ],
           "colorPermutations": {
-            "12552552551": [{}]
+            "12552552551": [
+              {}
+            ]
           }
         },
         {
@@ -1939,13 +2129,19 @@
           "paths": [
             "M768 0c-141.339 0.114-255.886 114.661-256 255.989l-0 0.011v128h-448c-35.301 0.113-63.887 28.699-64 63.989l-0 0.011v512c0.113 35.301 28.699 63.887 63.989 64l0.011 0h638c35.301-0.113 63.887-28.699 64-63.989l0-0.011v-512c-0.113-35.301-28.699-63.887-63.989-64l-0.011-0h-62v-128c0-70.692 57.308-128 128-128s128 57.308 128 128v0 128h128v-128c-0.114-141.339-114.661-255.886-255.989-256l-0.011-0z"
           ],
-          "attrs": [{}],
+          "attrs": [
+            {}
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "grid": 16,
-          "tags": ["icon-unlocked"],
+          "tags": [
+            "icon-unlocked"
+          ],
           "colorPermutations": {
-            "12552552551": [{}]
+            "12552552551": [
+              {}
+            ]
           }
         },
         {
@@ -1953,13 +2149,19 @@
           "paths": [
             "M1024 512c0 282.77-229.23 512-512 512s-512-229.23-512-512c0-282.77 229.23-512 512-512s512 229.23 512 512z"
           ],
-          "attrs": [{}],
+          "attrs": [
+            {}
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "grid": 16,
-          "tags": ["icon-circle"],
+          "tags": [
+            "icon-circle"
+          ],
           "colorPermutations": {
-            "12552552551": [{}]
+            "12552552551": [
+              {}
+            ]
           }
         },
         {
@@ -1968,13 +2170,21 @@
             "M876.34 635.58l-49.9 49.88-19.26 19.5-26 8.7-423.040 144.2 144.2-423.28 8.84-25.78 150-149.88-85.6-149.78c-34.92-61.12-92-61.12-127 0l-422.78 739.72c-34.94 61.14-5.92 111.14 64.48 111.14h843.44c70.4 0 99.42-50 64.48-111.14z",
             "M973.18 242.84c-19.32-19.3-40.66-34.62-60.16-43.16-34.42-15.12-52.38-4.54-60.1 3.16l-258.12 258.12-82.8 243.040 243-82.8 3.36-3.4 254.76-254.76c4.94-4.94 10.88-13.88 10.88-28.3 0-25.34-19.5-60.56-50.82-91.9zM631 619.82l-34.88-34.86 34.64-101.6 9.24-3.36h32v64h64v32l-3.42 9.26z"
           ],
-          "attrs": [{}, {}],
+          "attrs": [
+            {},
+            {}
+          ],
           "grid": 16,
-          "tags": ["icon-draft"],
+          "tags": [
+            "icon-draft"
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "colorPermutations": {
-            "12552552551": [{}, {}]
+            "12552552551": [
+              {},
+              {}
+            ]
           }
         },
         {
@@ -1982,13 +2192,19 @@
           "paths": [
             "M512 0c-282.78 0-512 229.22-512 512s229.22 512 512 512 512-229.22 512-512-229.22-512-512-512zM263.1 263.1c66.48-66.48 154.88-103.1 248.9-103.1 66.74 0 130.64 18.48 185.9 52.96l-484.94 484.94c-34.5-55.24-52.96-119.16-52.96-185.9 0-94.020 36.62-182.42 103.1-248.9zM760.9 760.9c-66.48 66.48-154.88 103.1-248.9 103.1-66.74 0-130.64-18.48-185.9-52.96l484.94-484.94c34.5 55.24 52.96 119.16 52.96 185.9 0 94.020-36.62 182.42-103.1 248.9z"
           ],
-          "attrs": [{}],
+          "attrs": [
+            {}
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "grid": 16,
-          "tags": ["icon-circle-slash"],
+          "tags": [
+            "icon-circle-slash"
+          ],
           "colorPermutations": {
-            "12552552551": [{}]
+            "12552552551": [
+              {}
+            ]
           }
         },
         {
@@ -1996,14 +2212,20 @@
           "paths": [
             "M136.86 52.26c54.080-34.82 120.58-52.26 199.44-52.26 103.6 0 189.7 24.76 258.24 74.28s102.82 122.88 102.82 220.060c0 59.6-14.86 109.8-44.58 150.6-17.38 24.76-50.76 56.4-100.14 94.9l-48.68 37.82c-26.54 20.64-44.14 44.7-52.82 72.2-5.5 17.44-8.46 44.48-8.92 81.14h-186.4c2.74-77.48 10.060-131 21.94-160.58s42.5-63.62 91.88-102.12l50.060-39.2c16.46-12.38 29.72-25.9 39.78-40.58 18.28-25.2 27.42-52.96 27.42-83.22 0-34.84-10.18-66.6-30.52-95.24-20.36-28.64-57.52-42.98-111.48-42.98s-90.68 17.66-112.88 52.96c-22.18 35.32-33.26 71.98-33.26 110.040h-198.76c5.5-130.64 51.12-223.24 136.86-277.82zM251.020 825.24h205.62v198.74h-205.62v-198.74z"
           ],
-          "attrs": [{}],
+          "attrs": [
+            {}
+          ],
           "width": 697,
           "isMulticolor": false,
           "isMulticolor2": false,
           "grid": 16,
-          "tags": ["icon-question-mark"],
+          "tags": [
+            "icon-question-mark"
+          ],
           "colorPermutations": {
-            "12552552551": [{}]
+            "12552552551": [
+              {}
+            ]
           }
         },
         {
@@ -2011,13 +2233,19 @@
           "paths": [
             "M512 0c-282.76 0-512 214.9-512 480 0 92.26 27.8 178.44 75.92 251.6l-75.92 292.4 313.5-101.42c61.040 24.1 128.12 37.42 198.5 37.42 282.76 0 512-214.9 512-480s-229.24-480-512-480zM768 448l-320 320-192-192v-192l192 192 320-320v192z"
           ],
-          "attrs": [{}],
+          "attrs": [
+            {}
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "grid": 16,
-          "tags": ["icon-status-poll-check"],
+          "tags": [
+            "icon-status-poll-check"
+          ],
           "colorPermutations": {
-            "12552552551": [{}]
+            "12552552551": [
+              {}
+            ]
           }
         },
         {
@@ -2027,13 +2255,23 @@
             "M457.14 417.86l24.2 122.64h61.32l24.2-122.64v-163.5h-109.72v163.5z",
             "M471.12 581.36h81.76v81.76h-81.76v-81.76z"
           ],
-          "attrs": [{}, {}, {}],
+          "attrs": [
+            {},
+            {},
+            {}
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "grid": 16,
-          "tags": ["icon-status-poll-caution"],
+          "tags": [
+            "icon-status-poll-caution"
+          ],
           "colorPermutations": {
-            "12552552551": [{}, {}, {}]
+            "12552552551": [
+              {},
+              {},
+              {}
+            ]
           }
         },
         {
@@ -2043,13 +2281,23 @@
             "M512 256c-59.84 0-116.080 23.3-158.4 65.6-42.3 42.3-65.6 98.56-65.6 158.4 0 43.5 12.32 85.080 35.3 120.82l309.52-309.52c-35.72-22.98-77.32-35.3-120.82-35.3z",
             "M512 0c-282.76 0-512 214.9-512 480 0 92.26 27.8 178.44 75.92 251.6l-75.92 292.4 313.5-101.42c61.040 24.1 128.12 37.42 198.5 37.42 282.76 0 512-214.9 512-480s-229.24-480-512-480zM512 800c-176.74 0-320-143.26-320-320s143.26-320 320-320 320 143.26 320 320-143.26 320-320 320z"
           ],
-          "attrs": [{}, {}, {}],
+          "attrs": [
+            {},
+            {},
+            {}
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "grid": 16,
-          "tags": ["icon-status-poll-circle-slash"],
+          "tags": [
+            "icon-status-poll-circle-slash"
+          ],
           "colorPermutations": {
-            "12552552551": [{}, {}, {}]
+            "12552552551": [
+              {},
+              {},
+              {}
+            ]
           }
         },
         {
@@ -2057,13 +2305,19 @@
           "paths": [
             "M512 0c-282.76 0-512 214.9-512 480 0 92.26 27.8 178.44 75.92 251.6l-75.92 292.4 313.5-101.42c61.040 24.1 128.12 37.42 198.5 37.42 282.76 0 512-214.9 512-480s-229.24-480-512-480zM579.020 832h-141.36v-136.64h141.36v136.64zM713.84 433.9c-11.94 17.020-34.9 38.78-68.84 65.24l-33.48 26c-18.24 14.18-30.34 30.74-36.32 49.64-3.78 11.98-5.82 30.58-6.14 55.8h-128.12c1.88-53.26 6.92-90.060 15.080-110.4 8.18-20.34 29.22-43.74 63.16-70.22l34.42-26.94c11.3-8.52 20.42-17.8 27.34-27.9 12.56-17.34 18.86-36.4 18.86-57.2 0-23.94-7-45.78-20.98-65.48-14-19.7-39.54-29.54-76.64-29.54s-62.34 12.14-77.6 36.4c-15.24 24.28-22.88 49.48-22.88 75.64h-136.64c3.78-89.84 35.14-153.5 94.080-191.020 37.18-23.94 82.9-35.94 137.12-35.94 71.22 0 130.42 17.020 177.54 51.060s70.68 84.48 70.68 151.3c0 40.98-10.22 75.5-30.66 103.54z"
           ],
-          "attrs": [{}],
+          "attrs": [
+            {}
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "grid": 16,
-          "tags": ["icon-status-poll-question-mark"],
+          "tags": [
+            "icon-status-poll-question-mark"
+          ],
           "colorPermutations": {
-            "12552552551": [{}]
+            "12552552551": [
+              {}
+            ]
           }
         },
         {
@@ -2072,13 +2326,21 @@
             "M1000.080 334.64l-336.6 336.76-20.52 6.88-450.96 153.72 160.68-471.52 332.34-332.34c-54.040-18.2-112.28-28.14-173.020-28.14-282.76 0-512 214.9-512 480 0 92.26 27.8 178.44 75.92 251.6l-75.92 292.4 313.5-101.42c61.040 24.1 128.12 37.42 198.5 37.42 282.76 0 512-214.9 512-480 0-50.68-8.4-99.5-23.92-145.36z",
             "M408.42 395.24l-2.16 6.3-111.7 327.9 334.12-113.86 4.62-4.68 350.28-350.28c6.8-6.78 14.96-19.1 14.96-38.9 0-34.86-26.82-83.28-69.88-126.38-26.54-26.54-55.9-47.6-82.7-59.34-47.34-20.8-72.020-6.24-82.64 4.36l-354.9 354.88zM470.56 421.42h44v88h88v44l-4.7 12.72-139.68 47.54-47.94-47.94 47.6-139.72 12.72-4.6z"
           ],
-          "attrs": [{}, {}],
+          "attrs": [
+            {},
+            {}
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "grid": 16,
-          "tags": ["icon-status-poll-edit"],
+          "tags": [
+            "icon-status-poll-edit"
+          ],
           "colorPermutations": {
-            "12552552551": [{}, {}]
+            "12552552551": [
+              {},
+              {}
+            ]
           }
         },
         {
@@ -2086,31 +2348,47 @@
           "paths": [
             "M832 0h-640c-105.6 0-192 86.4-192 192v640c0 105.6 86.4 192 192 192h640c105.6 0 192-86.4 192-192v-640c0-105.6-86.4-192-192-192zM681.38 365.14c0.68-20.46-2.22-37.7-8.7-51.68-6.5-13.98-15.7-25.4-27.64-34.28-11.94-8.86-26.1-15.18-42.48-18.94-16.38-3.74-33.78-5.62-52.2-5.62-15.020 0-30.2 1.54-45.54 4.6s-29.16 8.18-41.44 15.36-22.18 16.56-29.68 28.14c-7.52 11.62-11.26 25.94-11.26 42.98s6.66 32.6 19.96 44.52c13.3 11.94 29.34 21.84 48.1 29.68 18.76 7.86 38.020 14 57.82 18.42 19.78 4.44 35.82 8.020 48.1 10.74 28.66 7.52 54.92 16.22 78.8 26.1 23.88 9.9 44.52 22.68 61.92 38.38s30.86 34.8 40.42 57.32c9.54 22.52 14.32 50.16 14.32 82.9 0 43.68-9.040 80.86-27.12 111.56s-41.28 55.62-69.6 74.7c-28.32 19.1-60.22 32.92-95.7 41.44s-70.62 12.8-105.42 12.8c-102.34 0-178.6-20.8-228.74-62.44-50.16-41.6-75.22-107.1-75.22-196.5h152.5c-1.38 25.94 1.7 47.58 9.22 64.98 7.5 17.4 18.42 31.22 32.74 41.44 14.32 10.24 31.38 17.58 51.18 22 19.78 4.44 41.28 6.66 64.48 6.66 16.38 0 32.74-2.040 49.12-6.14s31.22-10.24 44.52-18.42c13.3-8.18 24.22-18.76 32.76-31.72 8.52-12.94 12.8-28.66 12.8-47.080s-5.46-32.24-16.38-43.5c-10.92-11.26-25.080-20.98-42.48-29.16s-37.2-15.36-59.36-21.5c-22.18-6.14-44.52-12.62-67.040-19.44-23.2-6.82-45.72-15-67.54-24.56-21.84-9.54-41.44-21.82-58.84-36.84-17.4-15-31.38-33.42-41.96-55.26-10.58-21.82-15.86-48.44-15.86-79.82 0-40.94 8.52-75.74 25.58-104.4 17.040-28.66 39.22-52.020 66.52-70.1 27.28-18.080 58.16-31.38 92.62-39.92 34.44-8.52 69.42-12.8 104.9-12.8 37.52 0 72.82 4.26 105.92 12.8 33.080 8.54 62.080 22.36 87 41.44 24.9 19.1 44.68 43.5 59.36 73.18 14.66 29.68 22 65.68 22 107.98h-152.5z"
           ],
-          "attrs": [{}],
+          "attrs": [
+            {}
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "grid": 16,
-          "tags": ["icon-stale"],
+          "tags": [
+            "icon-stale"
+          ],
           "colorPermutations": {
-            "12552552551": [{}]
+            "12552552551": [
+              {}
+            ]
           }
         },
         {
           "id": 105,
-          "paths": ["M1024 512l-448 512v-1024z", "M448 0l-448 512 448 512z"],
+          "paths": [
+            "M1024 512l-448 512v-1024z",
+            "M448 0l-448 512 448 512z"
+          ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-arrows-right-left"],
+          "tags": [
+            "icon-arrows-right-left"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
         },
         {
           "id": 106,
-          "paths": ["M512 0l512 448h-1024z", "M0 576l512 448 512-448z"],
+          "paths": [
+            "M512 0l512 448h-1024z",
+            "M0 576l512 448 512-448z"
+          ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-arrows-up-down"],
+          "tags": [
+            "icon-arrows-up-down"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -2122,7 +2400,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-bullet"],
+          "tags": [
+            "icon-bullet"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -2134,7 +2414,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-calendar"],
+          "tags": [
+            "icon-calendar"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -2146,7 +2428,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-chain-links"],
+          "tags": [
+            "icon-chain-links"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -2159,7 +2443,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-download"],
+          "tags": [
+            "icon-download"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -2172,7 +2458,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-duplicate"],
+          "tags": [
+            "icon-duplicate"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -2185,7 +2473,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-folder-new-v2.5"],
+          "tags": [
+            "icon-folder-new-v2.5"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -2200,7 +2490,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-fullscreen-collapse"],
+          "tags": [
+            "icon-fullscreen-collapse"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -2215,7 +2507,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-fullscreen-expand"],
+          "tags": [
+            "icon-fullscreen-expand"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -2228,7 +2522,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-layers"],
+          "tags": [
+            "icon-layers"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -2240,7 +2536,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-line-horz"],
+          "tags": [
+            "icon-line-horz"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -2252,7 +2550,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-magnify-v2"],
+          "tags": [
+            "icon-magnify-v2"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -2266,7 +2566,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-magnify-in-v2"],
+          "tags": [
+            "icon-magnify-in-v2"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -2279,7 +2581,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-magnify-out-v2"],
+          "tags": [
+            "icon-magnify-out-v2"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -2293,7 +2597,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-menu-v2.2"],
+          "tags": [
+            "icon-menu-v2.2"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -2306,7 +2612,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-move"],
+          "tags": [
+            "icon-move"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -2319,7 +2627,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-new-window"],
+          "tags": [
+            "icon-new-window"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -2333,7 +2643,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-paint-bucket-v2"],
+          "tags": [
+            "icon-paint-bucket-v2"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -2345,7 +2657,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-pencil"],
+          "tags": [
+            "icon-pencil"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -2359,27 +2673,38 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-pencil-edit-in-place"],
+          "tags": [
+            "icon-pencil-edit-in-place"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
         },
         {
           "id": 90,
-          "paths": ["M1024 512l-1024 512v-1024z"],
+          "paths": [
+            "M1024 512l-1024 512v-1024z"
+          ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-play"],
+          "tags": [
+            "icon-play"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
         },
         {
           "id": 88,
-          "paths": ["M126-2h256v1024h-256v-1024z", "M638-2h256v1024h-256v-1024z"],
+          "paths": [
+            "M126-2h256v1024h-256v-1024z",
+            "M638-2h256v1024h-256v-1024z"
+          ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-pause"],
+          "tags": [
+            "icon-pause"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -2392,27 +2717,37 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-plot-resource"],
+          "tags": [
+            "icon-plot-resource"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
         },
         {
           "id": 80,
-          "paths": ["M766 1024l-256-512 256-512h-256l-256 512 256 512z"],
+          "paths": [
+            "M766 1024l-256-512 256-512h-256l-256 512 256 512z"
+          ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-pointer-left"],
+          "tags": [
+            "icon-pointer-left"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
         },
         {
           "id": 81,
-          "paths": ["M254 0l256 512-256 512h256l256-512-256-512z"],
+          "paths": [
+            "M254 0l256 512-256 512h256l256-512-256-512z"
+          ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-pointer-right"],
+          "tags": [
+            "icon-pointer-right"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -2424,7 +2759,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-refresh-v1.5"],
+          "tags": [
+            "icon-refresh-v1.5"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -2437,7 +2774,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-save-v2"],
+          "tags": [
+            "icon-save-v2"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -2451,7 +2790,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-save-as"],
+          "tags": [
+            "icon-save-as"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -2463,7 +2804,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-sine"],
+          "tags": [
+            "icon-sine"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -2475,7 +2818,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-font"],
+          "tags": [
+            "icon-font"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -2490,7 +2835,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-thumbs-strip"],
+          "tags": [
+            "icon-thumbs-strip"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -2502,7 +2849,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-two-parts-both"],
+          "tags": [
+            "icon-two-parts-both"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -2514,7 +2863,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-two-parts-one-only"],
+          "tags": [
+            "icon-two-parts-one-only"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -2527,7 +2878,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-resync"],
+          "tags": [
+            "icon-resync"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -2539,7 +2892,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-reset"],
+          "tags": [
+            "icon-reset"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -2551,7 +2906,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-x-in-circle"],
+          "tags": [
+            "icon-x-in-circle"
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "colorPermutations": {
@@ -2573,7 +2930,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-brightness"],
+          "tags": [
+            "icon-brightness"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -2585,7 +2944,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-contrast"],
+          "tags": [
+            "icon-contrast"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -2600,7 +2961,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-expand"],
+          "tags": [
+            "icon-expand"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -2615,7 +2978,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-list-view"],
+          "tags": [
+            "icon-list-view"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -2632,7 +2997,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-grid-snap-to"],
+          "tags": [
+            "icon-grid-snap-to"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -2650,7 +3017,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-grid-snap-no"],
+          "tags": [
+            "icon-grid-snap-no"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -2663,7 +3032,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-frame-show"],
+          "tags": [
+            "icon-frame-show"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -2678,7 +3049,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-frame-hide"],
+          "tags": [
+            "icon-frame-hide"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -2691,7 +3064,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-import"],
+          "tags": [
+            "icon-import"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -2704,7 +3079,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-export"],
+          "tags": [
+            "icon-export"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -2715,14 +3092,22 @@
             "M1226.4 320h-176l-76.22 203.24 77 205.34 87.22-232.58 90.74 242h-174.44l49.5 132h174.44l57.76 154h154l-264-704z",
             "M384 0l-384 1024h224l84-224h408l84 224h224l-384-1024zM380 608l132-352 132 352z"
           ],
-          "attrs": [{}, {}],
+          "attrs": [
+            {},
+            {}
+          ],
           "grid": 16,
-          "tags": ["icon-font-size-alt1"],
+          "tags": [
+            "icon-font-size-alt1"
+          ],
           "width": 1504,
           "isMulticolor": false,
           "isMulticolor2": false,
           "colorPermutations": {
-            "12552552551": [{}, {}]
+            "12552552551": [
+              {},
+              {}
+            ]
           }
         },
         {
@@ -2731,13 +3116,21 @@
             "M632 312l-120 120-120-120-80 80 120 120-120 120 80 80 120-120 120 120 80-80-120-120 120-120-80-80z",
             "M512 0c-282.76 0-512 86-512 192v640c0 106 229.24 192 512 192s512-86 512-192v-640c0-106-229.24-192-512-192zM512 832c-176.731 0-320-143.269-320-320s143.269-320 320-320c176.731 0 320 143.269 320 320v0c0 176.731-143.269 320-320 320v0z"
           ],
-          "attrs": [{}, {}],
+          "attrs": [
+            {},
+            {}
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "grid": 16,
-          "tags": ["icon-clear-data"],
+          "tags": [
+            "icon-clear-data"
+          ],
           "colorPermutations": {
-            "12552552551": [{}, {}]
+            "12552552551": [
+              {},
+              {}
+            ]
           }
         },
         {
@@ -2746,13 +3139,21 @@
             "M576 64c-247.4 0-448 200.6-448 448h-128l192 192 192-192h-128c0-85.4 33.2-165.8 93.8-226.2 60.4-60.6 140.8-93.8 226.2-93.8s165.8 33.2 226.2 93.8c60.6 60.4 93.8 140.8 93.8 226.2s-33.2 165.8-93.8 226.2c-60.4 60.6-140.8 93.8-226.2 93.8s-165.8-33.2-226.2-93.8l-90.6 90.6c81 81 193 131.2 316.8 131.2 247.4 0 448-200.6 448-448s-200.6-448-448-448z",
             "M576 272c-26.6 0-48 21.4-48 48v211.8l142 142c9.4 9.4 21.6 14 34 14s24.6-4.6 34-14c18.8-18.8 18.8-49.2 0-67.8l-114-114v-172c0-26.6-21.4-48-48-48z"
           ],
-          "attrs": [{}, {}],
+          "attrs": [
+            {},
+            {}
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "grid": 16,
-          "tags": ["icon-history"],
+          "tags": [
+            "icon-history"
+          ],
           "colorPermutations": {
-            "12552552551": [{}, {}]
+            "12552552551": [
+              {},
+              {}
+            ]
           }
         },
         {
@@ -2760,14 +3161,20 @@
           "paths": [
             "M643.427 825.261c-81.955-0.697-148.179-67.065-148.642-149.010l-0-0.044v-395.828l296.871 247.393v-197.914l-395.828-329.857-395.828 328.62v197.502l296.871-246.156v396.241c0 190.905 155.239 346.556 346.144 346.968l412.321 0.825 0.412-197.914z"
           ],
-          "attrs": [{}],
+          "attrs": [
+            {}
+          ],
           "width": 1056,
           "isMulticolor": false,
           "isMulticolor2": false,
           "grid": 16,
-          "tags": ["icon-arrow-up-to-parent"],
+          "tags": [
+            "icon-arrow-up-to-parent"
+          ],
           "colorPermutations": {
-            "12552552551": [{}]
+            "12552552551": [
+              {}
+            ]
           }
         },
         {
@@ -2775,13 +3182,19 @@
           "paths": [
             "M512 0c-282.8 0-512 229.2-512 512s229.2 512 512 512 512-229.2 512-512-229.2-512-512-512zM783.6 783.6c-54.634 54.8-125.77 93.12-205.322 106.874l-2.278 0.326v-250.8h-128v250.8c-161.302-28.062-286.738-153.497-314.468-312.5l-0.332-2.3h250.8v-128h-250.8c28.062-161.302 153.497-286.738 312.5-314.468l2.3-0.332v250.8h128v-250.8c161.302 28.062 286.738 153.497 314.468 312.5l0.332 2.3h-250.8v128h250.8c-14.080 81.83-52.4 152.966-107.191 207.591l-0.009 0.009z"
           ],
-          "attrs": [{}],
+          "attrs": [
+            {}
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "grid": 16,
-          "tags": ["icon-crosshair-in-circle"],
+          "tags": [
+            "icon-crosshair-in-circle"
+          ],
           "colorPermutations": {
-            "12552552551": [{}]
+            "12552552551": [
+              {}
+            ]
           }
         },
         {
@@ -2790,13 +3203,21 @@
             "M512 384c70.692 0 128 57.308 128 128s-57.308 128-128 128c-70.692 0-128-57.308-128-128v0c0.114-70.647 57.353-127.886 127.989-128l0.011-0zM512 256c-141.385 0-256 114.615-256 256s114.615 256 256 256c141.385 0 256-114.615 256-256v0c-0.114-141.339-114.661-255.886-255.989-256l-0.011-0z",
             "M512 128c211.87 0.128 383.575 171.912 383.575 383.8 0 211.967-171.833 383.8-383.8 383.8s-383.8-171.833-383.8-383.8c0-105.99 42.963-201.945 112.425-271.4l-0 0c69.21-69.437 164.944-112.401 270.713-112.401 0.312 0 0.624 0 0.936 0.001l-0.048-0zM512 0c-282.8 0-512 229.2-512 512s229.2 512 512 512 512-229.2 512-512-229.2-512-512-512z"
           ],
-          "attrs": [{}, {}],
+          "attrs": [
+            {},
+            {}
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "grid": 16,
-          "tags": ["icon-target"],
+          "tags": [
+            "icon-target"
+          ],
           "colorPermutations": {
-            "12552552551": [{}, {}]
+            "12552552551": [
+              {},
+              {}
+            ]
           }
         },
         {
@@ -2805,13 +3226,21 @@
             "M45.2 658.8h229.6l-274.8 274.6 90.6 90.6 274.6-274.8v229.6h128v-448h-448v128z",
             "M1024 90.6l-90.6-90.6-274.6 274.8v-229.6h-128v448h448v-128h-229.6l274.8-274.6z"
           ],
-          "attrs": [{}, {}],
+          "attrs": [
+            {},
+            {}
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "grid": 16,
-          "tags": ["icon-items-collapse"],
+          "tags": [
+            "icon-items-collapse"
+          ],
           "colorPermutations": {
-            "12552552551": [{}, {}]
+            "12552552551": [
+              {},
+              {}
+            ]
           }
         },
         {
@@ -2820,13 +3249,21 @@
             "M448 896h-229.4l274.6-274.8-90.4-90.4-274.8 274.6v-229.4h-128v448h448v-128z",
             "M530.8 402.8l90.4 90.4 274.8-274.6v229.4h128v-448h-448v128h229.4l-274.6 274.8z"
           ],
-          "attrs": [{}, {}],
+          "attrs": [
+            {},
+            {}
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "grid": 16,
-          "tags": ["icon-items-expand"],
+          "tags": [
+            "icon-items-expand"
+          ],
           "colorPermutations": {
-            "12552552551": [{}, {}]
+            "12552552551": [
+              {},
+              {}
+            ]
           }
         },
         {
@@ -2836,13 +3273,23 @@
             "M640 512c0 70.692-57.308 128-128 128s-128-57.308-128-128c0-70.692 57.308-128 128-128s128 57.308 128 128z",
             "M1024 512c0 70.692-57.308 128-128 128s-128-57.308-128-128c0-70.692 57.308-128 128-128s128 57.308 128 128z"
           ],
-          "attrs": [{}, {}, {}],
+          "attrs": [
+            {},
+            {},
+            {}
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "grid": 16,
-          "tags": ["icon-3-dots"],
+          "tags": [
+            "icon-3-dots"
+          ],
           "colorPermutations": {
-            "12552552551": [{}, {}, {}]
+            "12552552551": [
+              {},
+              {},
+              {}
+            ]
           }
         },
         {
@@ -2850,13 +3297,19 @@
           "paths": [
             "M1024 384v-128h-256v-256h-128v256h-256v-256h-128v256h-256v128h256v256h-256v128h256v256h128v-256h256v256h128v-256h256v-128h-256v-256zM640 640h-256v-256h256z"
           ],
-          "attrs": [{}],
+          "attrs": [
+            {}
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "grid": 16,
-          "tags": ["icon-grid-on"],
+          "tags": [
+            "icon-grid-on"
+          ],
           "colorPermutations": {
-            "12552552551": [{}]
+            "12552552551": [
+              {}
+            ]
           }
         },
         {
@@ -2868,13 +3321,27 @@
             "M840 384h184v-128h-80l-104 128z",
             "M832 0l-832 1024h192l832-1024h-192z"
           ],
-          "attrs": [{}, {}, {}, {}, {}],
+          "attrs": [
+            {},
+            {},
+            {},
+            {},
+            {}
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "grid": 16,
-          "tags": ["icon-grid-off"],
+          "tags": [
+            "icon-grid-off"
+          ],
           "colorPermutations": {
-            "12552552551": [{}, {}, {}, {}, {}]
+            "12552552551": [
+              {},
+              {},
+              {},
+              {},
+              {}
+            ]
           }
         },
         {
@@ -2882,13 +3349,19 @@
           "paths": [
             "M896 256h-128l-128-256h-256l-128 256h-128c-70.601 0.227-127.773 57.399-128 127.978l-0 0.022v512c0.227 70.601 57.399 127.773 127.978 128l0.022 0h768c70.601-0.227 127.773-57.399 128-127.978l0-0.022v-512c-0.227-70.601-57.399-127.773-127.978-128l-0.022-0zM512 864c-141.385 0-256-114.615-256-256s114.615-256 256-256c141.385 0 256 114.615 256 256v0c0 141.385-114.615 256-256 256v0z"
           ],
-          "attrs": [{}],
+          "attrs": [
+            {}
+          ],
           "grid": 16,
-          "tags": ["icon-camera"],
+          "tags": [
+            "icon-camera"
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "colorPermutations": {
-            "12552552551": [{}]
+            "12552552551": [
+              {}
+            ]
           }
         },
         {
@@ -2897,13 +3370,21 @@
             "M896 320v448c-0.215 70.606-57.394 127.785-127.979 128l-0.021 0h-576c0.215 70.606 57.394 127.785 127.979 128l0.021 0h576c70.606-0.215 127.785-57.394 128-127.979l0-0.021v-448c-0.215-70.606-57.394-127.785-127.979-128l-0.021-0z",
             "M832 704v-448c-0.215-70.606-57.394-127.785-127.979-128l-0.021-0h-192l-101.5-82.74c-24.88-24.9-74.040-45.26-109.24-45.26h-237.26c-35.305 0.102-63.898 28.695-64 63.99l-0 0.010v640c0.215 70.606 57.394 127.785 127.979 128l0.021 0h576c70.606-0.215 127.785-57.394 128-127.979l0-0.021zM128 644v-516l256 260z"
           ],
-          "attrs": [{}, {}],
+          "attrs": [
+            {},
+            {}
+          ],
           "grid": 16,
-          "tags": ["icon-folders-collapse"],
+          "tags": [
+            "icon-folders-collapse"
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "colorPermutations": {
-            "12552552551": [{}, {}]
+            "12552552551": [
+              {},
+              {}
+            ]
           }
         },
         {
@@ -2913,7 +3394,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-activity"],
+          "tags": [
+            "icon-activity"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -2925,7 +3408,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-activity-mode"],
+          "tags": [
+            "icon-activity-mode"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -2939,7 +3424,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-autoflow-tabular"],
+          "tags": [
+            "icon-autoflow-tabular"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -2951,7 +3438,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-clock-v1.5"],
+          "tags": [
+            "icon-clock-v1.5"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -2964,7 +3453,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-database"],
+          "tags": [
+            "icon-database"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -2977,7 +3468,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-database-query"],
+          "tags": [
+            "icon-database-query"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -2990,7 +3483,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-dataset"],
+          "tags": [
+            "icon-dataset"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -3003,7 +3498,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-datatable"],
+          "tags": [
+            "icon-datatable"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -3015,7 +3512,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-dictionary"],
+          "tags": [
+            "icon-dictionary"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -3028,7 +3527,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-folder-v2.5"],
+          "tags": [
+            "icon-folder-v2.5"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -3041,7 +3542,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-image"],
+          "tags": [
+            "icon-image"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -3055,7 +3558,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-layout"],
+          "tags": [
+            "icon-layout"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -3067,7 +3572,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-object"],
+          "tags": [
+            "icon-object"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -3077,13 +3584,19 @@
           "paths": [
             "M511.98 0l-511.98 320v384l512 320 512-320v-384l-512.020-320zM586.22 896h-141.36v-136.64h141.36v136.64zM721.040 497.9c-11.94 17.020-34.9 38.78-68.84 65.24l-33.48 26c-18.24 14.18-30.34 30.74-36.32 49.64-3.78 11.98-5.82 30.58-6.14 55.8h-128.12c1.88-53.26 6.92-90.060 15.080-110.4 8.18-20.34 29.22-43.74 63.16-70.22l34.42-26.94c11.3-8.52 20.42-17.8 27.34-27.9 12.56-17.34 18.86-36.4 18.86-57.2 0-23.94-7-45.78-20.98-65.48-14-19.7-39.54-29.54-76.64-29.54s-62.34 12.14-77.6 36.4c-15.24 24.28-22.88 49.48-22.88 75.64h-136.64c3.78-89.84 35.14-153.5 94.080-191.020 37.18-23.94 82.9-35.94 137.12-35.94 71.22 0 130.42 17.020 177.54 51.060s70.68 84.48 70.68 151.3c0 40.98-10.22 75.5-30.66 103.54z"
           ],
-          "attrs": [{}],
+          "attrs": [
+            {}
+          ],
           "grid": 16,
-          "tags": ["icon-object-unknown"],
+          "tags": [
+            "icon-object-unknown"
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "colorPermutations": {
-            "12552552551": [{}]
+            "12552552551": [
+              {}
+            ]
           }
         },
         {
@@ -3093,7 +3606,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-packet"],
+          "tags": [
+            "icon-packet"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -3106,7 +3621,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-page"],
+          "tags": [
+            "icon-page"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -3119,7 +3636,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-plot-overlay"],
+          "tags": [
+            "icon-plot-overlay"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -3133,7 +3652,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-plot-stacked"],
+          "tags": [
+            "icon-plot-stacked"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -3148,7 +3669,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-session-v2.5"],
+          "tags": [
+            "icon-session-v2.5"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -3160,7 +3683,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-tabular"],
+          "tags": [
+            "icon-tabular"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -3173,7 +3698,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-tabular-lad"],
+          "tags": [
+            "icon-tabular-lad"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -3187,7 +3714,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-tabular-lad-set"],
+          "tags": [
+            "icon-tabular-lad-set"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -3199,7 +3728,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-tabular-realtime-v2"],
+          "tags": [
+            "icon-tabular-realtime-v2"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -3209,13 +3740,19 @@
           "paths": [
             "M896 0h-768c-70.606 0.215-127.785 57.394-128 127.979l-0 0.021v768c0.215 70.606 57.394 127.785 127.979 128l0.021 0h768c70.606-0.215 127.785-57.394 128-127.979l0-0.021v-768c-0.215-70.606-57.394-127.785-127.979-128l-0.021-0zM768 256v192h-192v-192zM576 512h192v192h-192zM512 704h-192v-192h192zM512 256v192h-192v-192zM64 256h192v192h-192zM64 512h192v192h-192zM128 960c-35.255-0.225-63.775-28.745-64-63.978l-0-0.022v-128h192v192zM320 960v-192h192v192zM704 960h-128v-192h192v192zM941.14 941.14c-11.511 11.644-27.483 18.856-45.139 18.86l-64.001 0v-64h128c-0.004 17.657-7.216 33.629-18.854 45.134l-0.006 0.006zM960 768h-128v-512h128z"
           ],
-          "attrs": [{}],
+          "attrs": [
+            {}
+          ],
           "grid": 16,
-          "tags": ["icon-tabular-scrolling"],
+          "tags": [
+            "icon-tabular-scrolling"
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "colorPermutations": {
-            "12552552551": [{}]
+            "12552552551": [
+              {}
+            ]
           }
         },
         {
@@ -3226,7 +3763,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-telemetry-v2"],
+          "tags": [
+            "icon-telemetry-v2"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -3236,13 +3775,19 @@
           "paths": [
             "M832 0h-640c-105.6 0-192 86.4-192 192v640c0 105.6 86.4 192 192 192h640c105.6 0 192-86.4 192-192v-640c0-105.6-86.4-192-192-192zM128 320v-128h256v128zM256 448h384v128h-384zM896 832h-448v-128h448zM896 576h-128v-128h128zM896 320h-384v-128h384z"
           ],
-          "attrs": [{}],
+          "attrs": [
+            {}
+          ],
           "grid": 16,
-          "tags": ["icon-timeline"],
+          "tags": [
+            "icon-timeline"
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "colorPermutations": {
-            "12552552551": [{}]
+            "12552552551": [
+              {}
+            ]
           }
         },
         {
@@ -3252,7 +3797,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-timer-v1.5"],
+          "tags": [
+            "icon-timer-v1.5"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -3267,7 +3814,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-topic-v2.5"],
+          "tags": [
+            "icon-topic-v2.5"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -3287,7 +3836,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-box-with-dashed-lines-v2"],
+          "tags": [
+            "icon-box-with-dashed-lines-v2"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -3299,7 +3850,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-summary-widget"],
+          "tags": [
+            "icon-summary-widget"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -3312,7 +3865,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-notebook"],
+          "tags": [
+            "icon-notebook"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -3323,13 +3878,21 @@
             "M0 896c0.227 70.601 57.399 127.773 127.978 128l0.022 0h768c70.601-0.227 127.773-57.399 128-127.978l0-0.022v-608h-512l-50.2-225.6c-7.6-34.2-42.6-62.4-77.8-62.4h-256c-70.601 0.227-127.773 57.399-128 127.978l-0 0.022zM832 768h-640v-256h640z",
             "M480 0c35.2 0 70.2 28.2 77.8 62.4l36 161.6h430.2v-96c-0.227-70.601-57.399-127.773-127.978-128l-0.022-0z"
           ],
-          "attrs": [{}, {}],
+          "attrs": [
+            {},
+            {}
+          ],
           "grid": 16,
-          "tags": ["icon-tabs-view"],
+          "tags": [
+            "icon-tabs-view"
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "colorPermutations": {
-            "12552552551": [{}, {}]
+            "12552552551": [
+              {},
+              {}
+            ]
           }
         },
         {
@@ -3343,7 +3906,9 @@
           ],
           "attrs": [],
           "grid": 16,
-          "tags": ["icon-flexible-layout"],
+          "tags": [
+            "icon-flexible-layout"
+          ],
           "colorPermutations": {
             "12552552551": []
           }
@@ -3356,13 +3921,25 @@
             "M512 640l135-59c-4.485 0.614-9.689 0.977-14.972 1l-0.028 0c-39.4 0-76-21.8-109.2-65-28-36.4-48.8-81.6-61-113.4-29-73.8-59-105.2-69.8-109.4-10.8 4.2-40.8 35.6-69.8 109.4-16.4 42.2-39.2 88.4-68.8 123.2z",
             "M1024 480l-512 224-512-224v320l512 224 512-224v-320z"
           ],
-          "attrs": [{}, {}, {}, {}],
+          "attrs": [
+            {},
+            {},
+            {},
+            {}
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "grid": 16,
-          "tags": ["icon-generator-sine"],
+          "tags": [
+            "icon-generator-sine"
+          ],
           "colorPermutations": {
-            "12552552551": [{}, {}, {}, {}]
+            "12552552551": [
+              {},
+              {},
+              {},
+              {}
+            ]
           }
         },
         {
@@ -3375,13 +3952,29 @@
             "M658.2 576h-292.4l146.2 64 146.2-64z",
             "M512 704l-512-224v320l512 224 512-224v-320l-512 224z"
           ],
-          "attrs": [{}, {}, {}, {}, {}, {}],
+          "attrs": [
+            {},
+            {},
+            {},
+            {},
+            {},
+            {}
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "grid": 16,
-          "tags": ["icon-generator-event"],
+          "tags": [
+            "icon-generator-event"
+          ],
           "colorPermutations": {
-            "12552552551": [{}, {}, {}, {}, {}, {}]
+            "12552552551": [
+              {},
+              {},
+              {},
+              {},
+              {},
+              {}
+            ]
           }
         },
         {
@@ -3389,13 +3982,19 @@
           "paths": [
             "M512 0c-282.8 0-512 229.2-512 512 0 226.4 147 418.4 350.6 486l257.4-486v503c236.8-45 416-253 416-503 0-282.8-229.2-512-512-512zM754.8 527.8c-58.967-68.597-145.842-111.772-242.8-111.772s-183.833 43.176-242.445 111.35l-0.355 0.422-146-125c8.6-10 17.4-19.6 26.8-28.8 92.628-92.679 220.619-150.006 362-150.006s269.372 57.326 361.997 150.003l0.003 0.003c9.4 9.2 18.2 18.8 26.8 28.8z"
           ],
-          "attrs": [{}],
+          "attrs": [
+            {}
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "grid": 16,
-          "tags": ["icon-gauge-v2"],
+          "tags": [
+            "icon-gauge-v2"
+          ],
           "colorPermutations": {
-            "12552552551": [{}]
+            "12552552551": [
+              {}
+            ]
           }
         },
         {
@@ -3405,13 +4004,23 @@
             "M830 0h-636c-106.6 0-194 87.2-194 194v318l400-60.2 112-195.8 109.8 192h402.2v-254c-0.227-107.052-86.948-193.773-193.978-194l-0.022-0z",
             "M1024 640v-64l-384-64 384 128z"
           ],
-          "attrs": [{}, {}, {}],
+          "attrs": [
+            {},
+            {},
+            {}
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "grid": 16,
-          "tags": ["icon-spectra"],
+          "tags": [
+            "icon-spectra"
+          ],
           "colorPermutations": {
-            "12552552551": [{}, {}, {}]
+            "12552552551": [
+              {},
+              {},
+              {}
+            ]
           }
         },
         {
@@ -3421,13 +4030,23 @@
             "M768 704h-512l102.4-179.2-354.4 50.6c31.2 252.8 246.8 448.6 508 448.6 201.6 0 376-116.6 459.6-286l-273.4-156.2z",
             "M640 512l384 128v-64l-384-64z"
           ],
-          "attrs": [{}, {}, {}],
+          "attrs": [
+            {},
+            {},
+            {}
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "grid": 16,
-          "tags": ["icon-telemetry-spectra"],
+          "tags": [
+            "icon-telemetry-spectra"
+          ],
           "colorPermutations": {
-            "12552552551": [{}, {}, {}]
+            "12552552551": [
+              {},
+              {},
+              {}
+            ]
           }
         },
         {
@@ -3436,13 +4055,21 @@
             "M370.2 459.4c9.326 8.53 19.666 16.261 30.729 22.914l0.871 0.486c-11.077-19.209-17.664-42.221-17.8-66.76l-0-0.040c0-39.6 17.8-77.6 50.2-107.4 37-34 87.4-52.6 141.8-52.6 40.2 0 78.2 10.2 110.2 29.2-8.918-15.653-19.693-29.040-32.268-40.482l-0.132-0.118c-37-34-87.4-52.6-141.8-52.6s-104.8 18.6-141.8 52.6c-32.4 29.8-50.2 67.8-50.2 107.4s17.8 77.6 50.2 107.4z",
             "M885.4 269.6c-40.6-154.6-192.4-269.6-373.4-269.6s-332.8 115-373.4 269.6c-86 80-138.6 187.8-138.6 306.4 0 247.4 229.2 448 512 448s512-200.6 512-448c0-118.6-52.6-226.4-138.6-306.4zM512 128c141.2 0 256 100.4 256 224s-114.8 224-256 224-256-100.4-256-224 114.8-224 256-224zM512 832c-175.4 0-318.4-127.8-320-285.4 68.8 94.8 186.4 157.4 320 157.4s251.2-62.6 320-157.4c-1.6 157.6-144.6 285.4-320 285.4z"
           ],
-          "attrs": [{}, {}],
+          "attrs": [
+            {},
+            {}
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "grid": 16,
-          "tags": ["icon-pushbutton"],
+          "tags": [
+            "icon-pushbutton"
+          ],
           "colorPermutations": {
-            "12552552551": [{}, {}]
+            "12552552551": [
+              {},
+              {}
+            ]
           }
         },
         {
@@ -3450,13 +4077,19 @@
           "paths": [
             "M512 0c-282.76 0-512 229.24-512 512s229.24 512 512 512 512-229.24 512-512-229.24-512-512-512zM512 768l-384-256 384-256 384 256z"
           ],
-          "attrs": [{}],
+          "attrs": [
+            {}
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "grid": 16,
-          "tags": ["icon-conditional"],
+          "tags": [
+            "icon-conditional"
+          ],
           "colorPermutations": {
-            "12552552551": [{}]
+            "12552552551": [
+              {}
+            ]
           }
         },
         {
@@ -3464,13 +4097,19 @@
           "paths": [
             "M832 0h-640c-105.6 0-192 86.4-192 192v640c0 105.6 86.4 192 192 192h640c105.6 0 192-86.4 192-192v-640c0-105.6-86.4-192-192-192zM512 768l-384-256 384-256 384 256z"
           ],
-          "attrs": [{}],
+          "attrs": [
+            {}
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "grid": 16,
-          "tags": ["icon-condition-widget"],
+          "tags": [
+            "icon-condition-widget"
+          ],
           "colorPermutations": {
-            "12552552551": [{}]
+            "12552552551": [
+              {}
+            ]
           }
         },
         {
@@ -3479,13 +4118,21 @@
             "M535.6 530.6c-8.4 1.6-17.2 3-26.2 4s-18.2 2.4-27.2 4c-10.196 1.861-18.808 4.010-27.21 6.633l1.61-0.433c-8.609 2.674-16.105 6.348-22.89 10.987l0.29-0.187c-6.693 4.517-12.283 10.107-16.663 16.585l-0.137 0.215c-4.6 6.8-7.4 15.6-8.8 26s-0.4 18.4 2.4 25.2c2.746 6.688 7.224 12.195 12.881 16.122l0.119 0.078c5.967 4.053 13.057 6.94 20.704 8.161l0.296 0.039c7.592 1.527 16.319 2.4 25.25 2.4 0.123 0 0.246-0 0.369-0l-0.019 0c22.2 0 39.6-3.6 52.6-11s23.2-16.2 30.2-26.4c6.273-8.873 11.271-19.191 14.426-30.285l0.174-0.715c1.853-6.809 3.601-15.41 4.855-24.169l0.145-1.231 5.2-41.6c-5.4 4.217-11.723 7.564-18.583 9.689l-0.417 0.111c-6.489 2.241-14.362 4.255-22.444 5.662l-0.956 0.138z",
             "M1024 384v-192h-152l24-192h-192l-24 192h-256l24-192h-192l-24 192h-232v192h208l-32 256h-176v192h152l-24 192h192l24-192h256l-24 192h192l24-192h232v-192h-208l32-256zM702.8 411.8l-26.4 211.8c-2.231 15.809-3.537 34.122-3.6 52.727l-0 0.073c0 16.8 2.2 29.4 6.4 37.8h-113.4c-1.342-5.556-2.338-12.122-2.781-18.84l-0.019-0.36c-0.261-3.524-0.409-7.634-0.409-11.778 0-2.962 0.076-5.907 0.226-8.832l-0.017 0.41c-18.663 17.401-41.395 30.694-66.597 38.289l-1.203 0.311c-22.627 6.956-48.639 10.974-75.586 11l-0.014 0c-0.764 0.011-1.666 0.018-2.569 0.018-18.098 0-35.598-2.563-52.156-7.345l1.325 0.328c-15.991-4.512-29.851-12.090-41.545-22.122l0.145 0.122c-11.233-9.982-19.792-22.733-24.624-37.192l-0.176-0.608c-5.2-15.2-6.4-33.4-3.8-54.4s9.4-42.2 19.4-57.2c9.524-14.399 21.535-26.346 35.532-35.512l0.468-0.288c13.387-8.662 28.922-15.533 45.512-19.765l1.088-0.235c13.436-3.792 30.801-7.554 48.47-10.41l2.93-0.39c17-2.6 33.8-4.6 50.4-6.2 16.628-1.527 31.69-4.070 46.349-7.643l-2.149 0.443c13-3 23.6-7.6 31.6-13.6s12.6-15 13.6-26.4 0.8-21.8-2.4-28.8c-2.849-6.902-7.542-12.56-13.468-16.517l-0.132-0.083c-6.217-4.011-13.604-6.78-21.543-7.774l-0.257-0.026c-7.897-1.277-17-2.007-26.274-2.007-0.537 0-1.073 0.002-1.609 0.007l0.082-0.001c-22 0-40 4.6-53.8 14.2s-23 25.2-28 47.2h-111.8c4.8-26.2 14.2-48 27.8-65.4 13.475-16.978 29.89-30.968 48.574-41.377l0.826-0.423c18.192-10.038 39.297-17.806 61.619-22.175l1.381-0.225c20.488-4.162 44.053-6.563 68.171-6.6l0.029-0c21.8 0.005 43.239 1.532 64.222 4.479l-2.422-0.279c20.641 2.809 39.324 8.783 56.401 17.461l-1.001-0.461c15.909 8.108 28.858 20.031 37.967 34.601l0.233 0.399c9 15 12.2 34.8 9 59.6z"
           ],
-          "attrs": [{}, {}],
+          "attrs": [
+            {},
+            {}
+          ],
           "grid": 16,
-          "tags": ["icon-alphanumeric"],
+          "tags": [
+            "icon-alphanumeric"
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "colorPermutations": {
-            "12552552551": [{}, {}]
+            "12552552551": [
+              {},
+              {}
+            ]
           }
         },
         {
@@ -3494,13 +4141,21 @@
             "M512 0c-282.8 0-512 229.2-512 512s229.2 512 512 512 512-229.2 512-512-229.2-512-512-512zM783.6 783.6c-69.581 69.675-165.757 112.776-272 112.776-212.298 0-384.4-172.102-384.4-384.4s172.102-384.4 384.4-384.4c212.298 0 384.4 172.102 384.4 384.4 0 0.008-0 0.017-0 0.025l0-0.001c0.001 0.264 0.001 0.575 0.001 0.887 0 105.769-42.964 201.503-112.391 270.703l-0.010 0.010z",
             "M704 384l-128 128-192-192-192 192c0 176.731 143.269 320 320 320s320-143.269 320-320v0z"
           ],
-          "attrs": [{}, {}],
+          "attrs": [
+            {},
+            {}
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "grid": 16,
-          "tags": ["icon-image-telemetry"],
+          "tags": [
+            "icon-image-telemetry"
+          ],
           "colorPermutations": {
-            "12552552551": [{}, {}]
+            "12552552551": [
+              {},
+              {}
+            ]
           }
         },
         {
@@ -3510,13 +4165,23 @@
             "M754 436.56c-14 41.44-37.48 100.8-69.2 148.36-38.56 57.78-82.32 87.080-130 87.080s-91.5-29.3-130-87.080c-31.72-47.56-55.14-106.92-69.2-148.36-30.88-90.96-63.14-134.98-78-146.54-14.94 11.56-47.2 55.58-78 146.54-14.38 41.44-37.8 100.8-69.6 148.36q-27.8 41.7-59.12 63.5c75.7 111.378 201.81 183.58 344.783 183.58 0.119 0 0.237-0 0.356-0l-0.019 0c229.76 0 416-186.24 416-416 0-0.071 0-0.156 0-0.24 0-39.119-5.396-76.977-15.484-112.871l0.704 2.931c-16.78 21.74-40.4 63.34-63.22 130.74z",
             "M921.56 334.62c4.098 24.449 6.44 52.617 6.44 81.332 0 0.017-0 0.034-0 0.051l0-0.003c0 0.095 0 0.208 0 0.32 0 282.593-229.087 511.68-511.68 511.68-0.113 0-0.225-0-0.338-0l0.018 0c-0.014 0-0.031 0-0.048 0-28.716 0-56.884-2.342-84.325-6.845l2.993 0.405c72.483 63.623 168.109 102.44 272.802 102.44 0.203 0 0.406-0 0.61-0l-0.031 0c229.76 0 416-186.24 416-416 0-0.172 0-0.375 0-0.578 0-104.692-38.817-200.319-102.844-273.271l0.404 0.47z"
           ],
-          "attrs": [{}, {}, {}],
+          "attrs": [
+            {},
+            {},
+            {}
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "grid": 16,
-          "tags": ["icon-telemetry-aggregate"],
+          "tags": [
+            "icon-telemetry-aggregate"
+          ],
           "colorPermutations": {
-            "12552552551": [{}, {}, {}]
+            "12552552551": [
+              {},
+              {},
+              {}
+            ]
           }
         },
         {
@@ -3524,13 +4189,19 @@
           "paths": [
             "M832 0h-640c-105.6 0-192 86.4-192 192v640c0 105.6 86.4 192 192 192h640c105.6 0 192-86.4 192-192v-640c0-105.6-86.4-192-192-192zM267.64 896h-139.64v-448h139.64zM477.1 896h-139.64v-768h139.64zM686.54 896h-139.64v-320h139.64zM896 896h-139.64v-640h139.64z"
           ],
-          "attrs": [{}],
+          "attrs": [
+            {}
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "grid": 16,
-          "tags": ["icon-bar-graph"],
+          "tags": [
+            "icon-bar-graph"
+          ],
           "colorPermutations": {
-            "12552552551": [{}]
+            "12552552551": [
+              {}
+            ]
           }
         },
         {
@@ -3540,13 +4211,23 @@
             "M320 912l387.2 96.8v-896l-387.2-96.8v896z",
             "M259.2 0.8l-3.2-0.8-128 62.6c-70.4 34.42-128 120.2-128 190.6v640c0 70.4 57.6 99.82 128 65.4l128-62.6 3.2 0.8z"
           ],
-          "attrs": [{}, {}, {}],
+          "attrs": [
+            {},
+            {},
+            {}
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "grid": 16,
-          "tags": ["icon-map"],
+          "tags": [
+            "icon-map"
+          ],
           "colorPermutations": {
-            "12552552551": [{}, {}, {}]
+            "12552552551": [
+              {},
+              {},
+              {}
+            ]
           }
         },
         {
@@ -3555,13 +4236,21 @@
             "M256 192v-64c0.215-70.606 57.394-127.785 127.979-128l0.021-0h256c70.606 0.215 127.785 57.394 128 127.979l0 0.021v64z",
             "M832 128v128h-640v-128c-105.6 0-192 86.4-192 192v512c0 105.6 86.4 192 192 192h640c105.6 0 192-86.4 192-192v-512c0-105.6-86.4-192-192-192zM128 576v-128h256v128zM640 832h-384v-128h384zM896 832h-128v-128h128zM896 576h-384v-128h384z"
           ],
-          "attrs": [{}, {}],
+          "attrs": [
+            {},
+            {}
+          ],
           "grid": 16,
-          "tags": ["icon-plan"],
+          "tags": [
+            "icon-plan"
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "colorPermutations": {
-            "12552552551": [{}, {}]
+            "12552552551": [
+              {},
+              {}
+            ]
           }
         },
         {
@@ -3569,13 +4258,19 @@
           "paths": [
             "M896 0h-768c-70.606 0.215-127.785 57.394-128 127.979l-0 0.021v768c0.215 70.606 57.394 127.785 127.979 128l0.021 0h768c70.606-0.215 127.785-57.394 128-127.979l0-0.021v-768c-0.215-70.606-57.394-127.785-127.979-128l-0.021-0zM426.94 533.46c-8.054 15.864-24.249 26.545-42.938 26.545-7.823 0-15.209-1.871-21.734-5.191l0.273 0.126-154.54-77.28v-221.66c0-26.51 21.49-48 48-48s48 21.49 48 48v0 162.34l101.46 50.72c15.864 8.054 26.545 24.249 26.545 42.938 0 7.823-1.871 15.209-5.191 21.734l0.126-0.273zM896 896h-320v-128h320zM896 704h-320v-128h320zM896 512h-320v-128h320zM896 320h-320v-128h320z"
           ],
-          "attrs": [{}],
+          "attrs": [
+            {}
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "grid": 16,
-          "tags": ["icon-timelist"],
+          "tags": [
+            "icon-timelist"
+          ],
           "colorPermutations": {
-            "12552552551": [{}]
+            "12552552551": [
+              {}
+            ]
           }
         },
         {
@@ -3583,13 +4278,19 @@
           "paths": [
             "M192 0c-105.6 0-192 86.4-192 192v640c0 105.6 86.4 192 192 192h640c105.6 0 192-86.4 192-192v-640c0-105.6-86.4-192-192-192zM128 352c0-53.019 42.981-96 96-96s96 42.981 96 96c0 53.019-42.981 96-96 96v0c-53.019 0-96-42.981-96-96v0zM288 832c-53.019 0-96-42.981-96-96s42.981-96 96-96c53.019 0 96 42.981 96 96v0c0 53.019-42.981 96-96 96v0zM544 640c-53.019 0-96-42.981-96-96s42.981-96 96-96c53.019 0 96 42.981 96 96v0c0 53.019-42.981 96-96 96v0zM544 320c-53.019 0-96-42.981-96-96s42.981-96 96-96c53.019 0 96 42.981 96 96v0c0 53.019-42.981 96-96 96v0zM800 832c-53.019 0-96-42.981-96-96s42.981-96 96-96c53.019 0 96 42.981 96 96v0c0 53.019-42.981 96-96 96v0z"
           ],
-          "attrs": [{}],
+          "attrs": [
+            {}
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "grid": 16,
-          "tags": ["icon-plot-scatter"],
+          "tags": [
+            "icon-plot-scatter"
+          ],
           "colorPermutations": {
-            "12552552551": [{}]
+            "12552552551": [
+              {}
+            ]
           }
         },
         {
@@ -3598,21 +4299,63 @@
             "M896 110.72c0-79.9-55.38-127.32-123.080-105.36l-772.92 250.64h896v-145.28z",
             "M896 320h-896v576c0 70.4 57.6 128 128 128h768c70.4 0 128-57.6 128-128v-448c0-70.4-57.6-128-128-128zM256 832h-128v-128h128v128zM256 640h-128v-128h128v128zM896 832h-512v-128h512v128zM896 640h-512v-128h512v128z"
           ],
-          "attrs": [{}, {}],
+          "attrs": [
+            {},
+            {}
+          ],
           "isMulticolor": false,
           "isMulticolor2": false,
           "grid": 16,
-          "tags": ["icon-notebook-restricted"],
+          "tags": [
+            "icon-notebook-restricted"
+          ],
           "colorPermutations": {
-            "12552552551": [{}, {}]
+            "12552552551": [
+              {},
+              {}
+            ]
+          }
+        },
+        {
+          "id": 187,
+          "paths": [
+            "M132.2 332c40.4 48.6 70.2 109.2 88 151.4 20 47.2 43.4 88 66.2 115.4 22.2 26.6 37 32.6 40.4 32.6s18.2-6 40.4-32.6c22.8-27.4 46.2-68.4 66.2-115.4 17.8-42.2 47.6-102.8 88-151.4 46.6-56.2 97.4-84.6 151.2-84.6s104.4 28.4 151.2 84.6c40.4 48.6 70.2 109.2 88 151.4 20 47.2 43.4 88 66.2 115.4 22.2 26.6 37 32.6 40.4 32.6s3.2-0.6 6.4-2.2v-117.8c-0.4-282.6-229.8-512-512.4-512h-512v249.2c46.6 6 90.8 34 132 83.4z",
+            "M1018 775.4c-53.6 0-104.4-28.4-151.2-84.6-40.4-48.6-70.2-109.2-88-151.4-20-47.2-43.4-88-66.2-115.4-22.2-26.6-37-32.6-40.4-32.6s-18.2 6-40.4 32.6c-22.8 27.4-46.2 68.4-66.2 115.4-17.8 42.2-47.6 102.8-88 151.4-46.6 56.2-97.4 84.6-151.2 84.6s-104.4-28.4-151.2-84.6c-40.4-48.6-70.2-109.2-88-151.4-20-47.2-43.4-88-66.2-115.4-8.2-9.8-15.2-16.8-21.2-21.6v109c0.6 282.8 229.8 512 512.6 512h512v-248.2c-2.2 0-4.2 0-6.4 0z"
+          ],
+          "attrs": [
+            {},
+            {}
+          ],
+          "width": 1152,
+          "grid": 16,
+          "tags": [
+            "icon-telemetry-derived"
+          ],
+          "isMulticolor": false,
+          "isMulticolor2": false,
+          "colorPermutations": {
+            "12552552551": [
+              {},
+              {}
+            ]
           }
         }
       ],
       "invisible": false,
       "colorThemes": [
         [
-          [0, 0, 0, 1],
-          [255, 255, 255, 1]
+          [
+            0,
+            0,
+            0,
+            1
+          ],
+          [
+            255,
+            255,
+            255,
+            1
+          ]
         ]
       ],
       "colorThemeIdx": 0
@@ -3664,4 +4407,4 @@
     }
   },
   "uid": -1
-}
+}
\ No newline at end of file
diff --git a/src/styles/fonts/Open-MCT-Symbols-16px.ttf b/src/styles/fonts/Open-MCT-Symbols-16px.ttf
index ace20d91a7..bc21299bfc 100644
Binary files a/src/styles/fonts/Open-MCT-Symbols-16px.ttf and b/src/styles/fonts/Open-MCT-Symbols-16px.ttf differ
diff --git a/src/styles/fonts/Open-MCT-Symbols-16px.woff b/src/styles/fonts/Open-MCT-Symbols-16px.woff
index 8a93d16893..68e38a67e1 100644
Binary files a/src/styles/fonts/Open-MCT-Symbols-16px.woff and b/src/styles/fonts/Open-MCT-Symbols-16px.woff differ
diff --git a/src/styles/vue-styles.scss b/src/styles/vue-styles.scss
index 01cae1a332..5918f64d33 100644
--- a/src/styles/vue-styles.scss
+++ b/src/styles/vue-styles.scss
@@ -2,6 +2,7 @@
 @import '../api/overlays/components/overlay-component.scss';
 @import '../api/tooltips/components/tooltip-component.scss';
 @import '../plugins/condition/components/conditionals.scss';
+@import '../plugins/comps/components/comps.scss';
 @import '../plugins/conditionWidget/components/condition-widget.scss';
 @import '../plugins/condition/components/inspector/conditional-styles.scss';
 @import '../plugins/displayLayout/components/box-and-line-views';
diff --git a/src/ui/components/ObjectPathString.vue b/src/ui/components/ObjectPathString.vue
new file mode 100644
index 0000000000..a5dff95d93
--- /dev/null
+++ b/src/ui/components/ObjectPathString.vue
@@ -0,0 +1,168 @@
+<!--
+ Open MCT, Copyright (c) 2014-2024, United States Government
+ as represented by the Administrator of the National Aeronautics and Space
+ Administration. All rights reserved.
+
+ Open MCT is licensed under the Apache License, Version 2.0 (the
+ "License"); you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+ http://www.apache.org/licenses/LICENSE-2.0.
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ License for the specific language governing permissions and limitations
+ under the License.
+
+ Open MCT includes source code licensed under additional open source
+ licenses. See the Open Source Licenses file (LICENSES.md) included with
+ this source code distribution or the Licensing information page available
+ at runtime from the About dialog for additional information.
+-->
+
+<template>
+  <div
+    v-if="orderedPath.length"
+    class="c-object-path-string"
+    :aria-label="`${domainObject.name} Object Path`"
+    role="navigation"
+  >
+    {{ orderedPathStr }}
+  </div>
+</template>
+
+<script>
+export default {
+  inject: ['openmct'],
+  props: {
+    domainObject: {
+      type: Object,
+      required: true
+    },
+    readOnly: {
+      type: Boolean,
+      required: false,
+      default() {
+        return false;
+      }
+    },
+    showObjectItself: {
+      type: Boolean,
+      required: false,
+      default() {
+        return false;
+      }
+    },
+    objectPath: {
+      type: Array,
+      default() {
+        return null;
+      }
+    }
+  },
+  data() {
+    return {
+      orderedPath: [],
+      orderedPathStr: ''
+    };
+  },
+  async mounted() {
+    this.abortController = new AbortController();
+    this.nameChangeListeners = {};
+    const keyString = this.openmct.objects.makeKeyString(this.domainObject.identifier);
+
+    if (keyString && this.keyString !== keyString) {
+      this.keyString = keyString;
+      this.originalPath = [];
+
+      let rawPath = null;
+      if (this.objectPath === null) {
+        try {
+          rawPath = await this.openmct.objects.getOriginalPath(
+            keyString,
+            [],
+            this.abortController.signal
+          );
+        } catch (error) {
+          // aborting the search is ok, everything else should be thrown
+          if (error.name !== 'AbortError') {
+            throw error;
+          }
+        }
+      } else {
+        rawPath = this.objectPath;
+      }
+
+      const pathWithDomainObject = rawPath.map((domainObject, index, pathArray) => {
+        let key = this.openmct.objects.makeKeyString(domainObject.identifier);
+        const objectPath = pathArray.slice(index);
+
+        return {
+          domainObject,
+          key,
+          objectPath
+        };
+      });
+      if (this.showObjectItself) {
+        // remove ROOT only
+        this.orderedPath = pathWithDomainObject.slice(0, pathWithDomainObject.length - 1).reverse();
+      } else {
+        // remove ROOT and object itself from path
+        this.orderedPath = pathWithDomainObject.slice(1, pathWithDomainObject.length - 1).reverse();
+      }
+
+      this.orderedPath.forEach((pathObject) => {
+        this.orderedPathStr = this.orderedPathStr.concat('/').concat(pathObject.domainObject.name);
+      });
+    }
+  },
+  unmounted() {
+    if (this.abortController) {
+      this.abortController.abort();
+    }
+    Object.values(this.nameChangeListeners).forEach((unlisten) => {
+      unlisten();
+    });
+  },
+  methods: {
+    /**
+     * Generate the hash url for the given object path, removing the '/ROOT' prefix if present.
+     * @param {import('../../api/objects/ObjectAPI').DomainObject[]} objectPath
+     */
+    navigateToPath(objectPath) {
+      /** @type {string} */
+      const path = `/browse/${this.openmct.objects.getRelativePath(objectPath)}`;
+
+      return path.replace('ROOT/', '');
+    },
+    updateObjectPathName(keyString, newName) {
+      this.orderedPath = this.orderedPath.map((pathObject) => {
+        if (this.openmct.objects.makeKeyString(pathObject.domainObject.identifier) === keyString) {
+          return {
+            ...pathObject,
+            domainObject: { ...pathObject.domainObject, name: newName }
+          };
+        }
+        return pathObject;
+      });
+    },
+    removeNameListenerFor(domainObject) {
+      const keyString = this.openmct.objects.makeKeyString(domainObject.identifier);
+      if (this.nameChangeListeners[keyString]) {
+        this.nameChangeListeners[keyString]();
+        delete this.nameChangeListeners[keyString];
+      }
+    },
+    addNameListenerFor(domainObject) {
+      const keyString = this.openmct.objects.makeKeyString(domainObject.identifier);
+      if (!this.nameChangeListeners[keyString]) {
+        this.nameChangeListeners[keyString] = this.openmct.objects.observe(
+          domainObject,
+          'name',
+          this.updateObjectPathName.bind(this, keyString)
+        );
+      }
+    }
+  }
+};
+</script>
diff --git a/src/ui/components/toggle-switch.scss b/src/ui/components/toggle-switch.scss
index 402af4c082..f2f6f85533 100644
--- a/src/ui/components/toggle-switch.scss
+++ b/src/ui/components/toggle-switch.scss
@@ -25,6 +25,7 @@
 .c-toggle-switch {
   cursor: pointer;
   display: inline-flex;
+  gap: $interiorMarginSm;
   align-items: center;
   vertical-align: middle;
 
@@ -55,7 +56,6 @@
   }
 
   &__label {
-    margin-left: $interiorMarginSm;
     white-space: nowrap;
   }