New Condition Widget, WIP

- Add condition-widget.scss file;
- Add type definitions to control display behaviors in layouts;
- Refine widget structure;

src/plugins/conditionWidget/ConditionWidgetViewProvider.js

@@ -28,7 +28,6 @@ export default function ConditionWidget(openmct) {
         key: 'conditionWidget',
         name: 'Condition Widget',
         cssClass: 'icon-asterisk',
-        objectClass: 'o-condition-widget',
         canView: function (domainObject) {
             return domainObject.type === 'conditionWidget';
         },

src/plugins/conditionWidget/components/ConditionWidget.vue

@@ -1,6 +1,8 @@
 <template>
 <div class="c-condition-widget">
-    {{ currentDomainObject.label }}
+    <div class="c-condition-widget__label">
+        {{ currentDomainObject.label }}
+    </div>
 </div>
 </template>
 

src/plugins/conditionWidget/components/condition-widget.scss

@@ -0,0 +1,15 @@
+.c-condition-widget {
+    @include userSelectNone();
+    border-radius: $basicCr;
+    border: 1px solid transparent;
+    display: inline-block;
+    padding: $interiorMarginLg $interiorMarginLg * 2;
+}
+
+.c-so-view--no-frame > .c-so-view__object-view > .c-condition-widget {
+    @include abs();
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding: 0;
+}

src/plugins/displayLayout/components/SubobjectView.vue

@@ -45,7 +45,7 @@ import LayoutFrame from './LayoutFrame.vue'
 const MINIMUM_FRAME_SIZE = [320, 180],
     DEFAULT_DIMENSIONS = [10, 10],
     DEFAULT_POSITION = [1, 1],
-    DEFAULT_HIDDEN_FRAME_TYPES = ['hyperlink', 'summary-widget'];
+    DEFAULT_HIDDEN_FRAME_TYPES = ['hyperlink', 'summary-widget', 'conditionWidget'];
 
 function getDefaultDimensions(gridSize) {
     return MINIMUM_FRAME_SIZE.map((min, index) => {

src/styles/vue-styles.scss

@@ -2,6 +2,7 @@
 @import "../api/overlays/components/overlay-component.scss";
 @import "../plugins/condition/components/condition.scss";
 @import "../plugins/condition/components/condition-set.scss";
+@import "../plugins/conditionWidget/components/condition-widget.scss";
 @import "../plugins/condition/components/inspector/conditional-styles.scss";
 @import "../plugins/displayLayout/components/box-view.scss";
 @import "../plugins/displayLayout/components/display-layout.scss";

src/ui/components/ObjectFrame.vue

@@ -65,7 +65,7 @@ const SIMPLE_CONTENT_TYPES = [
     'timer',
     'summary-widget',
     'hyperlink',
-    'condition-widget'
+    'conditionWidget'
 ];
 
 export default {