@rancher/shell 3.0.0-rc.2 → 3.0.0-rc.4

package/assets/styles/base/_variables.scss

@@ -25,11 +25,20 @@ $z-indexes: (
   overContent: 2,
   hoverOverContent: 3,
 
-  mainHeader: 12,
-
   tableGroup: 10,
   fixedTableHeader: 11,
 
+  // ---- Boundary for central content (in `<main>`)
+
+  // This covers both relative and content modes of the loading indicator
+  loading: 12,
+
+  // Users can click on shell in header and show shell even with most loading indicators showing,
+  // so add it above them
+  windowsManager: 13,
+
+  mainHeader: 14,
+
   modalOverlay: 20,
   modalContent: 21,
 
@@ -38,8 +47,7 @@ $z-indexes: (
   dropdownOverlay: 40,
   dropdownContent: 41,
 
-  loadingOverlay: 50,
-  loadingContent: 51
+  loadingMain: 51
 );
 
 // Usage Example:

package/assets/styles/global/_layout.scss

@@ -115,7 +115,7 @@ HEADER {
 .wm {
   grid-area: wm;
   overflow-y: hidden;
-  z-index: 1;
+  z-index: z-index('windowsManager');
 }
 
 .localeSelector {
@@ -131,6 +131,15 @@ HEADER {
     outline: 0;
   }
 
+  &[data-popper-placement^="top"] {
+    .v-popper__arrow-container {
+      .v-popper__arrow-inner {
+        top: 0;
+        border-color: var(--tooltip-bg);
+      }
+    }
+  }
+
   li {
     padding: 8px 20px;
 

package/assets/styles/global/_tooltip.scss

@@ -123,7 +123,6 @@
     color: var(--popover-text);
     padding: 10px;
     border-radius: var(--border-radius);
-    box-shadow: 0 5px 20px var(--shadow);
     border: none;
 
     a {
@@ -133,6 +132,19 @@
 
   .v-popper__arrow-container {
     border-color: transparent;
+    .v-popper__arrow-outer {
+      border-color: transparent;
+    }
+  }
+}
+
+.v-popper__popper.v-popper--theme-dropdown {
+  z-index: z-index('tooltip');
+
+  &.containerLogsDropdown {
+    .v-popper__arrow-container {
+      display: none;
+    }
   }
 }
 

package/assets/translations/en-us.yaml

@@ -438,7 +438,7 @@ authConfig:
           5: 'Upload the downloaded JSON file in the OAuth credentials box.'
       3:
         title: 'Create Service Account credentials'
-        introduction: 'Follow <a href="{docsBase}/admin-settings/authentication/google/#3-creating-service-account-credentials" target="_blank" rel="noopener noreferrer nofollow">this</a> guide to:'
+        introduction: 'Follow <a href="{docsBase}/how-to-guides/new-user-guides/authentication-permissions-and-global-configuration/authentication-config/configure-google-oauth#3-creating-service-account-credentials" target="_blank" rel="noopener noreferrer nofollow">this</a> guide to:'
         body:
           1: Create a service account.
           2: Generate a key for the service account.
@@ -1134,7 +1134,7 @@ cis:
   alertNeeded: |-
     Alerting must be enabled within the CIS chart values.yaml.
     This requires that the <a tabindex="0" href="{link}">{vendor} Monitoring and Alerting app</a> is installed
-    and the Receivers and Routes are <a target="_blank" rel='noopener noreferrer nofollow' href='{docsBase}/monitoring-alerting/configuration/#alertmanager-configuration/'> configured to send out alerts.</a>
+    and the Receivers and Routes are <a target="_blank" rel='noopener noreferrer nofollow' href='{docsBase}/how-to-guides/advanced-user-guides/monitoring-v2-configuration-guides/advanced-configuration/alertmanager'> configured to send out alerts.</a>
   alertOnComplete: Alert on scan completion
   alertOnFailure: Alert on scan failure
   benchmarkVersion: Benchmark Version
@@ -1177,6 +1177,7 @@ cis:
     total: Total
     warn: Warn
   scheduling:
+    title: Scheduling
     disable: Run scan once
     enable: Run scan on a schedule
   scoreWarning:
@@ -1185,23 +1186,46 @@ cis:
   testID: Test ID
   testsSkipped: Tests Skipped
   testsToSkip: Tests to Skip
+  alerting: Alerting
 
 cluster:
   jwtAuthentication:
     banner: "Service Account access with JWT authentication can be configured after cluster creation from <br>
       <code>Cluster Management > Advanced > JWT Authentication</code>"
   addonChart:
-    rancher-vsphere-cpi: vSphere CPI Configuration
-    rancher-vsphere-csi: vSphere CSI Configuration
-    rke2-calico: Calico Configuration
-    rke2-calico-crd: Calico Configuration
-    rke2-canal: Canal Configuration
-    rke2-cilium: Cilium Configuration
-    rke2-coredns: CoreDNS Configuration
-    rke2-ingress-nginx: NGINX Ingress Configuration
-    rke2-kube-proxy: Kube Proxy Configuration
-    rke2-metrics-server: Metrics Server Configuration
-    rke2-multus: Multus Configuration
+    rancher-vsphere-cpi:
+      label: vSphere CPI
+      configuration: vSphere CPI Configuration
+    rancher-vsphere-csi:
+      label: vSphere CSI
+      configuration: vSphere CSI Configuration
+    rke2-calico:
+      label: Calico
+      configuration: Calico Configuration
+    rke2-calico-crd:
+      label:  Calico
+      configuration: Calico Configuration
+    rke2-canal:
+      label: Canal
+      configuration: Canal Configuration
+    rke2-cilium:
+      label: Cilium
+      configuration: Cilium Configuration
+    rke2-coredns:
+      label: CoreDNS
+      configuration: CoreDNS Configuration
+    rke2-ingress-nginx:
+      label: NGINX
+      configuration: NGINX Ingress Configuration
+    rke2-kube-proxy:
+      label: Kube Proxy
+      configuration: Kube Proxy Configuration
+    rke2-metrics-server:
+      label: Metrics Server
+      configuration: Metrics Server Configuration
+    rke2-multus:
+      label: Multus
+      configuration: Multus Configuration
   agentEnvVars:
     label: Agent Environment
     detail: Add additional environment variables to the agent container.  This is most commonly useful for configuring a HTTP proxy.
@@ -1217,7 +1241,7 @@ cluster:
       label: Google
     rancher-vsphere:
       label: vSphere
-      note: '<b>Important:</b> Configure the vSphere Cloud Provider and Storage Provider options in the Add-On Config tab.'
+      note: '<b>Important:</b> Configure the vSphere Cloud Provider and Storage Provider options in the tabs on the left.'
     harvester:
       label: Harvester
   copyConfig: Copy KubeConfig to Clipboard
@@ -1363,8 +1387,10 @@ cluster:
         macAddress: Mac Address
         macFormat: 'Invalid MAC address format.'
       vGpus:
+        warnings:
+          minimumAllocatable: It's highly recommended to select a vGPU with a number of allocatable devices greater than the number of nodes (Machine Count) to avoid "un-schedulable" errors after cluster updates.
         errors:
-          notAllocatable: '"VGPUs" not allocatable. There are not enough [{vGpus}] devices to be allocated to each node in machine pool [{pool}]'
+          notAllocatable: '[{vGpu}] vGPU device is not allocatable; required: {allocated}, allocatable: {allocatable}'
       volume:
         title: Volumes
         volume: Volume
@@ -1883,7 +1909,7 @@ cluster:
     header: Registry for Rancher System Container Images
     label: Enable cluster scoped container registry for Rancher system container images
     description: "If enabled, Rancher will pull container images from this registry during cluster provisioning. By default, Rancher will also use this registry when installing Rancher's official Helm chart apps. If the cluster scoped registry is disabled, system images are pulled from the System Default Registry in the global settings."
-    docsLinkRke2: "For help configuring private registry mirrors, see the RKE2 <a href=\"https://docs.rke2.io/install/containerd_registry_configuration/\" target=\"_blank\">documentation.</a>"
+    docsLinkRke2: "For help configuring private registry mirrors, see the RKE2 <a href=\"https://docs.rke2.io/install/containerd_registry_configuration\" target=\"_blank\">documentation.</a>"
     docsLinkK3s: "For help configuring private registry mirrors, see the K3s <a href=\"https://docs.k3s.io/installation/private-registry\" target=\"_blank\">documentation.</a>"
   provider:
     aliyunecs: Aliyun ECS
@@ -1927,6 +1953,7 @@ cluster:
     oracleoke: Oracle OKE
     otc: Open Telekom Cloud
     other: Other
+    ovhcloudmks: OVHcloud MKS
     packet: Equinix Metal
     pinganyunecs: Pinganyun ECS
     pnap: phoenixNAP
@@ -2089,7 +2116,7 @@ cluster:
       s3: s3
   tabs:
     ace: Authorized Endpoint
-    addons: Add-On Config
+    addOnAdditionalManifest: Additional Manifest
     advanced: Advanced
     agentEnv: Agent Environment Vars
     basic: Basics
@@ -3482,7 +3509,7 @@ monitoring:
       keyFilePath:
         label: Key File Path
         placeholder: e.g. ./key-file.pfx
-      secretsBanner: The file paths below must be referenced in <pre class="inline-block m-0 p-0 vertical-middle">alertmanager.alertmanagerSpec.secrets</pre> when deploying the Monitoring chart. For more information see our <a href="{docsBase}/monitoring-alerting/" target="_blank" rel="noopener noreferrer nofollow">documentation</a>.
+      secretsBanner: The file paths below must be referenced in <pre class="inline-block m-0 p-0 vertical-middle">alertmanager.alertmanagerSpec.secrets</pre> when deploying the Monitoring chart. For more information see our <a href="{docsBase}/how-to-guides/advanced-user-guides/monitoring-alerting-guides" target="_blank" rel="noopener noreferrer nofollow">documentation</a>.
   projectMonitoring:
     detail:
       error: "Unable to fetch Dashboard values with status: "
@@ -4262,8 +4289,11 @@ inactivity:
 
 # Rancher Extensions
 plugins:
-  incompatibleRancherVersion: "The latest version of this extension ({ version }) is not compatible with the current Rancher version ({ rancherVersion })."
-  incompatibleKubeVersion: "The latest version of this extension ({ version }) is not compatible with the current Kube version ({ kubeVersion })."
+  incompatibleRancherVersion: "The latest version of this extension ({ version }) is not compatible with the current Rancher version ({ required })."
+  incompatibleKubeVersion: "The latest version of this extension ({ version }) is not compatible with the current Kube version ({ required })."
+  incompatibleUiExtensionsApiVersionMissing: 'The latest version of this extension ({ version }) is missing the mandatory annotation catalog.cattle.io/ui-extensions-version from Rancher 2.10 and onwards.'
+  incompatibleUiExtensionsApiVersion: "The latest version of this extension ({ version }) is not compatible with the current Extensions API version ({ required })."
+  incompatibleHost: 'The latest version of this extension ({ version }) has a host of "{ required }" which is not compatible with this application "{ mainHost }".'
   currentInstalledVersionBlockedByKubeVersion: "This version is not compatible with the current Kubernetes version ({ kubeVersion }  Vs  { kubeVersionToCheck })."
   labels:
     builtin: Built-in
@@ -4281,9 +4311,11 @@ plugins:
     title: Error loading extension
     message: Could not load extension code
     generic: Extension error
-    api: This Extension is not compatible with the current Extensions API version
-    host: This Extension is not compatible with this application
-    version: This Extension is not compatible with this version of Rancher
+    apiAnnotationMissing: 'Unable to load Extension. The version installed is not compatible with the current Extensions API Version (Extension is missing the annotation catalog.cattle.io/ui-extensions-version which implies incompatibility with Rancher 2.10 and onwards)'
+    api: Unable to load Extension. The version installed is not compatible with the current Extensions API version
+    host: Unable to load Extension. The version installed is not compatible with this application host
+    version: Unable to load Extension. The version installed is not compatible with the current version of Rancher
+    kubeVersion: Unable to load Extension. The version installed is not compatible with the current Rancher kubernetes version
     load: An error occurred loading the code for this Extension
     developerPkg: This Extension has been loaded internally, so we won't load the external version
   success:
@@ -4301,8 +4333,11 @@ plugins:
     detail: Detail
     versions: Versions
     versionError: Could not load version information
-    requiresRancherVersion: "Requires Rancher {version}"
-    requiresKubeVersion: "Requires Kube version {version}"
+    requiresRancherVersion: "Requires Rancher {required}"
+    requiresKubeVersion: "Requires Kube version {required}"
+    requiresExtensionApiVersionMissing: 'Missing the annotation catalog.cattle.io/ui-extensions-version which implies incompatibility with Rancher 2.10 and onwards'
+    requiresExtensionApiVersion: "Requires Extensions API version {required}"
+    requiresHost: 'Requires a host that matches "{mainHost}"'
   empty:
     all: Extensions are neither installed nor available
     available: No Extensions available
@@ -5243,7 +5278,7 @@ setup:
     skip: Skip
     tip: What URL should be used for this {vendor} installation? All the nodes in your clusters will need to be able to reach this.
   setPassword: The first order of business is to set a strong password for the default <code>{username}</code> user. We suggest using this random one generated just for you, but enter your own if you like.
-  telemetry: Allow collection of <a href="{docsBase}/faq/telemetry/" target="_blank" rel="noopener noreferrer nofollow">anonymous statistics</a> to help us improve {name}
+  telemetry: Allow collection of <a href="{docsBase}/faq/telemetry" target="_blank" rel="noopener noreferrer nofollow">anonymous statistics</a> to help us improve {name}
   useManual: Set a specific password to use
   useRandom: Use a randomly generated password
   welcome: Welcome to {vendor}!
@@ -6287,6 +6322,7 @@ workload:
     workload: Workload
     pods: Pods by State
     runs: Runs
+  error: Pod { name } Security Policy Violation { policy }
   gaugeStates:
     succeeded: Successful
     running: Running

package/assets/translations/zh-hans.yaml

@@ -429,7 +429,7 @@ authConfig:
           5: '在 OAuth 凭证框中，上传下载的 JSON 文件。'
       3:
         title: '创建 Service Account 凭证'
-        introduction: '参照本<a href="{docsBase}/admin-settings/authentication/google/#3-creating-service-account-credentials" target="_blank" rel="noopener noreferrer nofollow">指南</a>：'
+        introduction: '参照本<a href="{docsBase}/how-to-guides/new-user-guides/authentication-permissions-and-global-configuration/authentication-config/configure-google-oauth#3-creating-service-account-credentials" target="_blank" rel="noopener noreferrer nofollow">指南</a>：'
         body:
           1: 创建一个 Service Account。
           2: 为这个 Service Account 生成密钥。
@@ -1049,7 +1049,7 @@ cis:
   alertNeeded: |-
     必须在 CIS Chart values.yaml 中开启告警。
     这要求<a tabindex="0" href="{link}"> {vendor} 的 Monitoring 与 Alerting 应用</a>已经安装
-    ，而且接收器和路由<a target="_blank" rel='noopener noreferrer nofollow' href='{docsBase}/monitoring-alerting/configuration/#alertmanager-configuration/'>已配置告警发送</a>。
+    ，而且接收器和路由<a target="_blank" rel='noopener noreferrer nofollow' href='{docsBase}/how-to-guides/advanced-user-guides/monitoring-v2-configuration-guides/advanced-configuration/alertmanager'>已配置告警发送</a>。
   alertOnComplete: 扫描完成告警
   alertOnFailure: 扫描失败告警
   benchmarkVersion: Benchmark 版本
@@ -1752,7 +1752,7 @@ cluster:
   privateRegistry:
     label: 为 Rancher 系统容器镜像启用集群级别的容器镜像仓库
     description: "如果启用，Rancher 将在集群配置期间从该镜像仓库中拉取容器镜像。默认情况下，Rancher 在安装 Rancher 的官方 Helm Chart 应用程序时也会使用此镜像仓库。如果集群级别的镜像仓库被禁用，将从全局设置中的系统默认镜像仓库中拉取系统镜像。"
-    docsLinkRke2: "如需配置私有镜像仓库 mirror 的帮助，请参阅 RKE2 <a href=\"https://docs.rke2.io/install/containerd_registry_configuration/\" target=\"_blank\">文档</a>。"
+    docsLinkRke2: "如需配置私有镜像仓库 mirror 的帮助，请参阅 RKE2 <a href=\"https://docs.rke2.io/install/containerd_registry_configuration\" target=\"_blank\">文档</a>。"
     docsLinkK3s: "如需配置私有镜像仓库 mirror 的帮助，请参阅 K3s <a href=\"https://docs.k3s.io/installation/private-registry\" target=\"_blank\">文档</a>。"
   provider:
     aliyunecs: Aliyun ECS
@@ -1796,6 +1796,7 @@ cluster:
     oracleoke: Oracle OKE
     otc: Open Telekom Cloud
     other: 其他
+    ovhcloudmks: OVHcloud MKS
     packet: Equinix Metal
     pinganyunecs: 平安云 ECS
     pnap: phoenixNAP
@@ -3235,7 +3236,7 @@ monitoring:
       keyFilePath:
         label: 密钥文件路径
         placeholder: 例如：./key-file.pfx
-      secretsBanner: 部署 Monitoring Chart 时，必须在<<pre class="inline-block m-0 p-0 vertical-middle">alertmanager.alertmanagerSpec.secrets</pre>中引用以下文件路径。详情请查看<a href="{docsBase}/monitoring-alerting/" target="_blank" rel="noopener noreferrer nofollow">官方文档</a>。
+      secretsBanner: 部署 Monitoring Chart 时，必须在<<pre class="inline-block m-0 p-0 vertical-middle">alertmanager.alertmanagerSpec.secrets</pre>中引用以下文件路径。详情请查看<a href="{docsBase}/how-to-guides/advanced-user-guides/monitoring-alerting-guides" target="_blank" rel="noopener noreferrer nofollow">官方文档</a>。
   projectMonitoring:
     detail:
       error: "无法获取具有状态的仪表板值： "
@@ -4967,7 +4968,7 @@ setup:
     skip: 跳过
     tip: 此 {vendor} 安装应使用什么 URL？集群中的所有节点都需要能访问该 URL。
   setPassword: 请为默认用户 <code>{username}</code>设置强密码。建议使用生成的随机密码。你也可以自行设置。
-  telemetry: 允许收集<a href="{docsBase}/faq/telemetry/" target="_blank" rel="noopener noreferrer nofollow">匿名统计数据</a>，以帮我们改进 {name}。
+  telemetry: 允许收集<a href="{docsBase}/faq/telemetry" target="_blank" rel="noopener noreferrer nofollow">匿名统计数据</a>，以帮我们改进 {name}。
   useManual: 设置密码
   useRandom: 使用随机生成的密码
   welcome: 欢迎使用 {vendor}！

package/chart/istio.vue

@@ -49,6 +49,8 @@ const defaultOverlayFile = `#apiVersion: install.istio.io/v1alpha1
 `;
 
 export default {
+  emits: ['update:value'],
+
   components: {
     Checkbox,
     FileSelector,

package/chart/monitoring/ClusterSelector.vue

@@ -87,6 +87,8 @@ const CLUSTER_TYPES = [
 ];
 
 export default {
+  emits: ['onClusterTypeChanged'],
+
   components: { LabeledSelect },
   props:      {
     value: {

package/chart/monitoring/StorageClassSelector.vue

@@ -2,7 +2,10 @@
 import LabeledSelect from '@shell/components/form/LabeledSelect';
 
 export default {
-  name:       'StorageClassSelector',
+  name: 'StorageClassSelector',
+
+  emits: ['updateName'],
+
   components: { LabeledSelect },
   props:      {
     options: {

package/chart/monitoring/index.vue

@@ -19,6 +19,8 @@ import { STORAGE_CLASS, PVC, SECRET, WORKLOAD_TYPES } from '@shell/config/types'
 import { CATTLE_MONITORING_NAMESPACE } from '@shell/utils/monitoring';
 
 export default {
+  emits: ['register-before-hook', 'input'],
+
   components: {
     Alerting,
     Checkbox,

package/chart/rancher-backup/S3.vue

@@ -7,6 +7,8 @@ import { mapGetters } from 'vuex';
 import { SECRET } from '@shell/config/types';
 
 export default {
+  emits: ['valid'],
+
   components: {
     LabeledInput,
     Checkbox,

package/chart/rancher-backup/index.vue

@@ -13,6 +13,8 @@ import { mapGetters } from 'vuex';
 import { STORAGE } from '@shell/config/labels-annotations';
 
 export default {
+  emits: ['valid'],
+
   components: {
     Tab,
     Tabbed,

package/cloud-credential/aws.vue

@@ -5,6 +5,8 @@ import { LabeledInput } from '@components/Form/LabeledInput';
 import LabeledSelect from '@shell/components/form/LabeledSelect';
 
 export default {
+  emits: ['validationChanged'],
+
   components: {
     Loading, LabeledInput, LabeledSelect
   },

package/cloud-credential/azure.vue

@@ -6,6 +6,8 @@ import { parseAzureError } from '@shell/utils/azure';
 import LabeledSelect from '@shell/components/form/LabeledSelect';
 
 export default {
+  emits: ['validationChanged'],
+
   components: { LabeledInput, LabeledSelect },
   mixins:     [CreateEditView],
 

package/cloud-credential/digitalocean.vue

@@ -3,6 +3,8 @@ import CreateEditView from '@shell/mixins/create-edit-view';
 import { LabeledInput } from '@components/Form/LabeledInput';
 
 export default {
+  emits: ['validationChanged'],
+
   components: { LabeledInput },
   mixins:     [CreateEditView],
 

package/cloud-credential/gcp.vue

@@ -4,6 +4,8 @@ import { LabeledInput } from '@components/Form/LabeledInput';
 import FileSelector from '@shell/components/form/FileSelector';
 
 export default {
+  emits: ['validationChanged'],
+
   components: { LabeledInput, FileSelector },
   mixins:     [CreateEditView],
 

package/cloud-credential/generic.vue

@@ -6,6 +6,8 @@ import { simplify, iffyFields, likelyFields } from '@shell/store/plugins';
 import Loading from '@shell/components/Loading';
 
 export default {
+  emits: ['validationChanged'],
+
   components: {
     KeyValue, Banner, Loading
   },

package/cloud-credential/harvester.vue

@@ -7,6 +7,8 @@ import { get, set } from '@shell/utils/object';
 import { MANAGEMENT, VIRTUAL_HARVESTER_PROVIDER } from '@shell/config/types';
 
 export default {
+  emits: ['validationChanged'],
+
   components: { LabeledSelect, Banner },
   mixins:     [CreateEditView],
 

package/cloud-credential/linode.vue

@@ -3,6 +3,8 @@ import CreateEditView from '@shell/mixins/create-edit-view';
 import { LabeledInput } from '@components/Form/LabeledInput';
 
 export default {
+  emits: ['validationChanged'],
+
   components: { LabeledInput },
   mixins:     [CreateEditView],
 

package/cloud-credential/pnap.vue

@@ -4,6 +4,8 @@ import { LabeledInput } from '@components/Form/LabeledInput';
 import { base64Encode } from '@shell/utils/crypto';
 
 export default {
+  emits: ['validationChanged'],
+
   components: { LabeledInput },
   mixins:     [CreateEditView],
 

package/cloud-credential/s3.vue

@@ -6,6 +6,8 @@ import { LabeledInput } from '@components/Form/LabeledInput';
 import LabeledSelect from '@shell/components/form/LabeledSelect';
 
 export default {
+  emits: ['validationChanged'],
+
   components: {
     Loading, Checkbox, LabeledInput, LabeledSelect
   },

package/cloud-credential/vmwarevsphere.vue

@@ -4,6 +4,8 @@ import { LabeledInput } from '@components/Form/LabeledInput';
 import { NORMAN } from '@shell/config/types';
 
 export default {
+  emits: ['validationChanged'],
+
   components: { LabeledInput },
   mixins:     [CreateEditView],
 

package/components/ActionDropdown.vue

@@ -66,7 +66,7 @@ export default {
         placement="bottom"
         :container="false"
         :disabled="disableButton"
-        :popper-options="{modifiers: { flip: { enabled: false } } }"
+        :flip="false"
       >
         <slot
           name="button-content"

package/components/ActionMenu.vue

@@ -9,7 +9,10 @@ const CALC = 'calculate';
 const SHOW = 'show';
 
 export default {
-  name:       'ActionMenu',
+  name: 'ActionMenu',
+
+  emits: ['close'],
+
   components: { IconOrSvg },
   props:      {
     customActions: {

package/components/AppModal.vue

@@ -2,7 +2,10 @@
 import { defineComponent } from 'vue';
 
 export default defineComponent({
-  name:         'AppModal',
+  name: 'AppModal',
+
+  emits: ['close'],
+
   inheritAttrs: false,
   props:        {
     /**

package/components/ButtonDropdown.vue

@@ -5,6 +5,8 @@ import isString from 'lodash/isString';
 import VueSelectOverrides from '@shell/mixins/vue-select-overrides';
 
 export default {
+  emits: ['dd-button-action', 'click-action'],
+
   mixins: [VueSelectOverrides],
   props:  {
     buttonLabel: {
@@ -202,6 +204,7 @@ export default {
         tabindex="-1"
         type="button"
         class="dropdown-button-two btn"
+        data-testid="dropdown-button"
         @click="ddButtonAction(option)"
         @focus="focusSearch"
       >

package/components/ButtonGroup.vue

@@ -1,5 +1,7 @@
 <script>
 export default {
+  emits: ['update:value'],
+
   props: {
     value: {
       type:     [String, Number, Boolean, Object],

package/components/ButtonMultiAction.vue

@@ -0,0 +1,41 @@
+<script setup lang="ts">
+import { computed, defineEmits } from 'vue';
+
+defineEmits(['click']);
+
+type Props = {
+  borderless?: boolean;
+  invisible?: boolean;
+}
+
+const props = defineProps<Props>();
+
+const buttonClass = computed(() => {
+  return {
+    borderless: props?.borderless,
+    invisible:  props?.invisible,
+  };
+});
+</script>
+
+<template>
+  <button
+    type="button"
+    class="btn btn-sm role-multi-action actions"
+    :class="buttonClass"
+    @click="(e: Event) => $emit('click', e)"
+  >
+    <i class="icon icon-actions" />
+  </button>
+</template>
+
+<style lang="scss" scoped>
+.borderless {
+  background-color: transparent;
+  border: none;
+  &:hover, &:focus {
+    background-color: var(--accent-btn);
+    box-shadow: none;
+  }
+}
+</style>

package/components/Carousel.vue

@@ -6,6 +6,8 @@ import { mapGetters } from 'vuex';
 const carouselSeenStorageKey = `carousel-seen`;
 
 export default {
+  emits: ['clicked'],
+
   components: { BadgeState },
   name:       'Carousel',
   props:      {
@@ -291,6 +293,7 @@ export default {
     height: 100%;
 
     .slide-img {
+      align-self: flex-start;
       width: 150px;
       background: var(--card-badge-text);
       border-radius: calc(2 * var(--border-radius));