add resize handles to time strip views

src/plugins/flexibleLayout/components/FlexibleLayout.vue

@@ -77,10 +77,10 @@
 </template>
 
 <script>
+import Container from '@/ui/layout/Container.js';
+import Frame from '@/ui/layout/Frame.js';
 import ResizeHandle from '@/ui/layout/ResizeHandle/ResizeHandle.vue';
 
-import Container from '../utils/container.js';
-import Frame from '../utils/frame.js';
 import ContainerComponent from './ContainerComponent.vue';
 import DropHint from './DropHint.vue';
 

src/plugins/flexibleLayout/plugin.js

@@ -20,9 +20,10 @@
  * at runtime from the About dialog for additional information.
  *****************************************************************************/
 
+import Container from '@/ui/layout/Container.js';
+
 import FlexibleLayoutViewProvider from './flexibleLayoutViewProvider.js';
 import ToolBarProvider from './toolbarProvider.js';
-import Container from './utils/container.js';
 
 export default function plugin() {
   return function install(openmct) {

src/plugins/timeline/TimelineViewLayout.vue

@@ -41,13 +41,22 @@
     </SwimLane>
 
     <div ref="contentHolder" class="c-timeline__objects">
-      <TimelineObjectView
+      <template v-for="(item, index) in items" :key="item.keyString">
-        v-for="item in items"
+        <TimelineObjectView
-        :key="item.keyString"
+          class="c-timeline__content js-timeline__content"
-        class="c-timeline__content js-timeline__content"
+          :item="item"
-        :item="item"
+          :extended-lines-bus
-        :extended-lines-bus
+        />
-      />
+        <ResizeHandle
+          v-if="index !== items.length - 1"
+          :index="index"
+          drag-orientation="'vertical'"
+          :is-editing="isEditing"
+          @init-move="startContainerResizing"
+          @move="containerResizing"
+          @end-move="endContainerResizing"
+        />
+      </template>
     </div>
 
     <ExtendedLinesOverlay
@@ -66,6 +75,7 @@ import { useDragResizer } from 'utils/vue/useDragResizer.js';
 import { inject, provide } from 'vue';
 
 import SwimLane from '@/ui/components/swim-lane/SwimLane.vue';
+import ResizeHandle from '@/ui/layout/ResizeHandle/ResizeHandle.vue';
 
 import TimelineAxis from '../../ui/components/TimeSystemAxis.vue';
 import { useAlignment } from '../../ui/composables/alignmentContext.js';
@@ -85,6 +95,7 @@ const PLOT_ITEM_H_PX = 100;
 
 export default {
   components: {
+    ResizeHandle,
     TimelineObjectView,
     TimelineAxis,
     SwimLane,