4723 implement redesign of model from equation component

packages/client/hmi-client/src/components/drilldown/tera-drilldown.vue

@@ -68,6 +68,7 @@
 			</tera-drilldown-header>
 			<main class="flex overflow-hidden h-full">
 				<slot name="sidebar" />
+				<slot name="content" />
 				<tera-columnar-panel class="flex-1">
 					<template v-for="(tab, index) in tabs" :key="index">
 						<!--

packages/client/hmi-client/src/components/widgets/tera-asset-block.vue

@@ -1,5 +1,5 @@
 <template>
-	<Panel :toggleable="isToggleable">
+	<Panel :toggleable="isToggleable" :class="useDefaultStyle ? 'asset-panel' : ''">
 		<template #header>
 			<section>
 				<slot name="header" />
@@ -51,12 +51,16 @@ defineProps({
 	isToggleable: {
 		type: Boolean,
 		default: true
+	},
+	useDefaultStyle: {
+		type: Boolean,
+		default: true
 	}
 });
 </script>
 
 <style scoped>
-.p-panel {
+.asset-panel {
 	border: 1px solid var(--surface-border-light);
 	border-radius: var(--border-radius-medium);
 	border-left: 0.5rem solid var(--primary-color);

packages/client/hmi-client/src/components/widgets/tera-slider-panel.vue

@@ -1,5 +1,11 @@
 <template>
-	<tera-slider :content-width="contentWidth" :tab-width="tabWidth" :direction="direction" :is-open="isOpen">
+	<tera-slider
+		:content-width="contentWidth"
+		:tab-width="tabWidth"
+		:min-tab-width="minTabWidth"
+		:direction="direction"
+		:is-open="isOpen"
+	>
 		<template v-slot:content>
 			<aside @scroll="onScroll">
 				<header :class="{ shadow: isScrolled }">
@@ -60,6 +66,10 @@ defineProps({
 		type: String,
 		default: '40px'
 	},
+	minTabWidth: {
+		type: String,
+		default: '40px'
+	},
 	// slider-panel props
 	header: {
 		type: String,

packages/client/hmi-client/src/components/widgets/tera-slider.vue

@@ -1,7 +1,7 @@
 <template>
 	<aside
 		:class="`slider ${isOpen ? 'open' : 'closed'} ${direction}`"
-		:style="{ width: isOpen ? contentWidth : tabWidth }"
+		:style="{ width: isOpen ? contentWidth : tabWidth, minWidth: minTabWidth }"
 	>
 		<div class="slider-content-container" :style="{ width: isOpen ? contentWidth : 0 }">
 			<section class="slider-content" :style="sidePanelContentStyle">
@@ -36,6 +36,10 @@ const props = defineProps({
 	tabWidth: {
 		type: String,
 		default: '50px'
+	},
+	minTabWidth: {
+		type: String,
+		default: '50px'
 	}
 });