adjust controls panel width and update null value label to en dash

Author: francisrupert

packages/combinator/src/components/combinator.vue

@@ -609,14 +609,15 @@ export default {
   }
 
   &__controls {
-    inline-size: var(--dt-size-875);
+    inline-size: var(--dt-size-900);
     max-inline-size: var(--dt-size-1000);
     flex-shrink: 0;
     max-block-size: var(--dt-size-950);
     font: var(--dt-text-body-sm);
 
     :where(.dialtone-playground--fullscreen) & {
       @media screen and (min-width: 640px) {
+        inline-size: var(--dt-size-950);
         max-block-size: 100%;
       }
     }

packages/combinator/src/components/controls/control_selection.vue

@@ -162,7 +162,7 @@ const options = computed(() => {
   }) ?? [];
 
   if (props.defaultValue === null || props.defaultValue === undefined) {
-    return [{ value: null, label: 'null' }, ...valueOptions];
+    return [{ value: null, label: '\u2013' }, ...valueOptions];
   }
   return valueOptions;
 });