svt · axelboberg · Feb 22, 2026 · Feb 7, 2026 · Feb 7, 2026 · Feb 8, 2026
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,5 +1,14 @@
 # Changelog
 
+## 1.0.0-beta.10 [UNRELEASED]
+### Added
+- Human/AI readable descriptors for types
+- Free run for LTC inputs
+- Reference items now show a warning if they're missing a target id
+### Fixed
+- An issue where invalid types could crash the rundown widget
+- An issue where 0 (or falsy values) could not be used as ids for options in preferences of the select type
+
 ## 1.0.0-beta.9
 ### Added
 - Support for named urls when sharing links to workspaces

diff --git a/api/events.js b/api/events.js
@@ -88,13 +88,24 @@ class Events {
 
   /**
    * Emit an event
-   * @param { String } event The name of the event to emit
+   * @param { string } event The name of the event to emit
    * @param  { ...any } args Any data to pass along with the event
    */
   emit (event, ...args) {
     this.props.Commands.executeRawCommand('events.emit', event, ...args)
   }
 
+  /**
+   * Emit an event for all listeners
+   * registered by a single owner
+   * @param { string } event The name of the event to emit
+   * @param { string } owner The id of the owner to target
+   * @param  { ...any } args Any data to pass along with the event
+   */
+  emitForOwner (event, owner, ...args) {
+    this.props.Commands.executeRawCommand('events.emitForOwner', event, owner, ...args)
+  }
+
   /**
    * Emit an event but only call local handlers
    *

diff --git a/api/items.js b/api/items.js
@@ -154,6 +154,14 @@ class Items {
    * @param { Item } set An item object to apply
    */
   async applyExistingItem (id, set = {}) {
+    const itemExists = await this.itemExists(id)
+    if (!itemExists) {
+      return
+    }
+    await this.applyItem(id, set)
+  }
+
+  async itemExists (id) {
     if (typeof id !== 'string') {
       throw new MissingArgumentError('Invalid value for item id, must be a string')
     }
@@ -162,8 +170,7 @@ class Items {
     if (!item) {
       throw new InvalidArgumentError('Invalid item id, item does not exist')
     }
-
-    await this.applyItem(id, set)
+    return true
   }
 
   /**

diff --git a/app/bridge.css b/app/bridge.css
@@ -46,7 +46,7 @@ html:not([data-platform="darwin"]) *::-webkit-scrollbar-track {
 }
 
 html:not([data-platform="darwin"]) *::-webkit-scrollbar-thumb {
-  background-color: var(--base-color--shade);
+  background-color: var(--base-color--shade1);
   border-radius: 10px;
   outline: none;
 }
@@ -84,7 +84,7 @@ button {
   border: none;
   border-radius: 12px;
 
-  box-shadow: inset 0 0 0 1px var(--base-color--shade), 0 2px 5px rgba(0, 0, 0, 0.07);
+  box-shadow: inset 0 0 0 1px var(--base-color--shade1), 0 2px 5px rgba(0, 0, 0, 0.07);
 
   color: var(--base-color);
   background: inherit;
@@ -101,7 +101,7 @@ button {
 .Button--secondary:active,
 .Button--ghost:active{
   opacity: 0.8;
-  box-shadow: inset 0 0 0 1px var(--base-color--shade), 0 2px 4px transparent;
+  box-shadow: inset 0 0 0 1px var(--base-color--shade1), 0 2px 4px transparent;
 }
 
 .Button--accent {
@@ -175,8 +175,8 @@ textarea {
   border-radius: 8px;
 
   color: var(--base-color);
-  background: var(--base-color--shade2);
-  box-shadow: inset 0 0 0 1px var(--base-color--shade2);
+  background: var(--base-color--shade3);
+  box-shadow: inset 0 0 0 1px var(--base-color--shade3);
 
   box-sizing: border-box;
 }
@@ -189,7 +189,7 @@ input[type="number"]:focus,
 input[type="search"]:focus,
 input[type="password"]:focus,
 textarea:focus {
-  box-shadow: inset 0 0 0 1px var(--base-color--shade);
+  box-shadow: inset 0 0 0 1px var(--base-color--shade1);
 }
 
 input[type="search"] {
@@ -208,7 +208,7 @@ input[type="checkbox"] {
 
   border-radius: 50px;
 
-  box-shadow: inset 0 0 0 1px var(--base-color--shade);
+  box-shadow: inset 0 0 0 1px var(--base-color--shade1);
 
   vertical-align: middle;
 
@@ -254,7 +254,7 @@ input[type="checkbox"]:checked::after {
 }
 
 input[type="checkbox"]:focus {
-  box-shadow: inset 0 0 0 1px var(--base-color--shade), 0 0 0 1px var(--base-color--shade);
+  box-shadow: inset 0 0 0 1px var(--base-color--shade1), 0 0 0 1px var(--base-color--shade1);
 }
 
 input[type="checkbox"]:checked::after {
@@ -274,10 +274,10 @@ select {
   font-size: 1em;
   font-family: var(--base-fontFamily--primary);
 
-  border: 1px solid var(--base-color--shade);
+  border: 1px solid var(--base-color--shade1);
   border-radius: 8px;
 
-  background: url('./assets/icons/arrow-down.svg') no-repeat right 10px center var(--base-color--shade2);
+  background: url('./assets/icons/arrow-down.svg') no-repeat right 10px center var(--base-color--shade3);
 
   -webkit-appearance: none;
   appearance: none;
@@ -290,7 +290,7 @@ select {
 }
 
 select:focus {
-  background: url('./assets/icons/arrow-down.svg') no-repeat right 10px center var(--base-color--background);
+  background: url('./assets/icons/arrow-down.svg') no-repeat right 10px center var(--base-color--background1);
 }
 
 /* Labels */

diff --git a/app/components/AppMenu/AppMenuRootItem.css b/app/components/AppMenu/AppMenuRootItem.css
@@ -6,5 +6,5 @@
 
 .AppMenuRootItem:hover,
 .AppMenuRootItem:focus {
-  background: var(--base-color--shade);
+  background: var(--base-color--shade1);
 }
diff --git a/app/components/ContextMenu/style.css b/app/components/ContextMenu/style.css
@@ -1,15 +1,15 @@
 .ContextMenu {
   position: fixed;
 
-  background: var(--base-color--background1);
+  background: var(--base-color--background2);
   color: var(--base-color);
 
   border-radius: 5px;
 
   box-sizing: border-box;
   box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
 
-  border: 1px solid var(--base-color--shade);
+  border: 1px solid var(--base-color--shade1);
 
   margin-top: -3px;
 

diff --git a/app/components/ContextMenuDivider/style.css b/app/components/ContextMenuDivider/style.css
@@ -2,6 +2,6 @@
   width: 100%;
   height: 1px;
 
-  background: var(--base-color--shade3);
+  background: var(--base-color--shade4);
   opacity: 0.3;
 }
diff --git a/app/components/ContextMenuItem/style.css b/app/components/ContextMenuItem/style.css
@@ -4,7 +4,7 @@
 }
 
 .ContextMenuItem:focus .ContextMenuItem-text {
-  box-shadow: inset 0 0 0 2px var(--base-color--shade);
+  box-shadow: inset 0 0 0 2px var(--base-color--shade1);
 }
 
 .ContextMenuItem-text {
@@ -29,9 +29,9 @@
 
 .ContextMenuItem:hover > .ContextMenuItem-text,
 .ContextMenuItem.is-hovered > .ContextMenuItem-text {
-  background: var(--base-color--shade);
+  background: var(--base-color--shade1);
 }
 
 .ContextMenuItem:active > .ContextMenuItem-text {
-  box-shadow: 2px solid var(--base-color--shade3);
+  box-shadow: 2px solid var(--base-color--shade4);
 }
diff --git a/app/components/Footer/style.css b/app/components/Footer/style.css
@@ -5,7 +5,7 @@
   width: 100%;
   height: 24px;
 
-  border-top: 1px solid var(--base-color--shade);
+  border-top: 1px solid var(--base-color--shade1);
   box-sizing: border-box;
 
   flex-shrink: 0;
@@ -45,7 +45,7 @@
 
   margin-right: 7px;
 
-  background: var(--base-color--shade);
+  background: var(--base-color--shade1);
 }
 
 .Footer-button.Footer-roleBtn.is-main::before {
@@ -75,7 +75,7 @@
 }
 
 .Footer-button:not(.is-active):hover {
-  background: var(--base-color--shade);
+  background: var(--base-color--shade1);
   opacity: 0.7;
 }
 

diff --git a/app/components/Frame/index.jsx b/app/components/Frame/index.jsx
@@ -30,14 +30,14 @@ const COPY_THEME_VARIABLES = [
   '--base-color',
   '--base-color--accent1',
   '--base-color--accent2',
-  '--base-color--accent4',
-  '--base-color--accent5',
+  '--base-color--accent3',
   '--base-color--grey1',
   '--base-color--grey2',
   '--base-color--grey3',
-  '--base-color--shade',
   '--base-color--shade1',
   '--base-color--shade2',
+  '--base-color--shade3',
+  '--base-color--shade4',
   '--base-color--alert',
   '--base-color--background',
   '--base-fontFamily--primary',

diff --git a/app/components/FrameComponent/index.jsx b/app/components/FrameComponent/index.jsx
@@ -45,14 +45,14 @@ const COPY_THEME_VARIABLES = [
   '--base-color',
   '--base-color--accent1',
   '--base-color--accent2',
-  '--base-color--accent4',
-  '--base-color--accent5',
+  '--base-color--accent3',
   '--base-color--grey1',
   '--base-color--grey2',
   '--base-color--grey3',
-  '--base-color--shade',
   '--base-color--shade1',
   '--base-color--shade2',
+  '--base-color--shade3',
+  '--base-color--shade4',
   '--base-color--alert',
   '--base-color--background',
   '--base-fontFamily--primary',

diff --git a/app/components/FrameComponent/style.css b/app/components/FrameComponent/style.css
@@ -19,7 +19,7 @@
   height: 100%;
 
   border-radius: 5px;
-  box-shadow: inset 0 0 0 1px var(--base-color--accent4);
+  box-shadow: inset 0 0 0 1px var(--base-color--accent3);
 
   pointer-events: none;
   z-index: 1;
@@ -88,7 +88,7 @@
 }
 
 .FrameComponent-headerButton:not(.is-active):hover {
-  background: var(--base-color--shade);
+  background: var(--base-color--shade1);
   opacity: 0.7;
 }
 

diff --git a/app/components/GridItem/style.css b/app/components/GridItem/style.css
@@ -11,7 +11,7 @@
 }
 
 .GridItem.is-editing {
-  box-shadow: inset 0 0 0 1px var(--base-color--shade3);
+  box-shadow: inset 0 0 0 1px var(--base-color--shade4);
 }
 
 .GridItem .GridItem-content {

diff --git a/app/components/Header/style.css b/app/components/Header/style.css
@@ -80,7 +80,7 @@ Do the same for Windows
 }
 
 .Header-button:not(.is-active):hover {
-  background: var(--base-color--shade);
+  background: var(--base-color--shade1);
   opacity: 0.7;
 }
 

diff --git a/app/components/Layout/style.css b/app/components/Layout/style.css
@@ -12,7 +12,7 @@
   width: 250px;
   padding: 20px;
 
-  border-right: 1px solid var(--base-color--shade);
+  border-right: 1px solid var(--base-color--shade1);
 
   text-align: left;
 }

diff --git a/app/components/Message/style.css b/app/components/Message/style.css
@@ -5,10 +5,10 @@
   width: 300px;
   margin-top: 5px;
 
-  background: var(--base-color--background1);
+  background: var(--base-color--background2);
 
   box-shadow:
-    inset 0 0 0 1px var(--base-color--shade),
+    inset 0 0 0 1px var(--base-color--shade1),
     0 0 10px rgba(0, 0, 0, 0.5);
 
   padding: 9px 12px 9px 12px;

diff --git a/app/components/Modal/style.css b/app/components/Modal/style.css
@@ -73,7 +73,7 @@ slight box shadow instead
   text-align: center;
 
   border-radius: 15px;
-  background: var(--base-color--background);
+  background: var(--base-color--background1);
 
   box-sizing: border-box;
 

diff --git a/app/components/Notification/index.jsx b/app/components/Notification/index.jsx
@@ -4,7 +4,7 @@ import './style.css'
 
 import { Icon } from '../Icon'
 
-export function Notification ({ type, size = 'normal', icon, title, description, controls = <></>, closable }) {
+export function Notification ({ type, size = 'normal', icon, title, description, controls = <></>, closable, transparent }) {
   const [isHidden, setIsHidden] = React.useState(false)
 
   function handleHideBtnClick () {
@@ -20,7 +20,7 @@ export function Notification ({ type, size = 'normal', icon, title, description,
   }
 
   return (
-    <div className={`Notification Notification--${type} Notification-size--${size}`}>
+    <div className={`Notification Notification--${type} Notification-size--${size} ${transparent ? 'is-transparent' : ''}`}>
       <div className='Notification-content'>
         {
           icon && <span className='Notification-contentSection Notification-icon'><Icon name={icon} color='var(--color-text)' /></span>