@rancher/shell 3.0.9 → 3.0.10

package/rancher-components/RcSection/RcSectionBadges.vue

@@ -0,0 +1,29 @@
+<script setup lang="ts">
+import { computed } from 'vue';
+import RcStatusBadge from '@components/Pill/RcStatusBadge';
+import type { RcSectionBadgesProps } from './types';
+
+const MAX_BADGES = 3;
+
+const props = defineProps<RcSectionBadgesProps>();
+
+const visibleBadges = computed(() => {
+  if (props.badges.length > MAX_BADGES) {
+    // eslint-disable-next-line no-console
+    console.warn(`[RcSectionBadges]: Received ${ props.badges.length } badges but only ${ MAX_BADGES } are allowed. Extra badges will be hidden.`);
+  }
+
+  return props.badges.slice(0, MAX_BADGES);
+});
+</script>
+
+<template>
+  <RcStatusBadge
+    v-for="(badge, i) in visibleBadges"
+    :key="i"
+    v-clean-tooltip="badge.tooltip"
+    :status="badge.status"
+  >
+    {{ badge.label }}
+  </RcStatusBadge>
+</template>

package/rancher-components/RcSection/index.ts

@@ -0,0 +1,12 @@
+export { default as RcSection } from './RcSection.vue';
+export { default as RcSectionBadges } from './RcSectionBadges.vue';
+export { default as RcSectionActions } from './RcSectionActions.vue';
+export type {
+  RcSectionProps,
+  SectionType,
+  SectionMode,
+  BadgeConfig,
+  RcSectionBadgesProps,
+  ActionConfig,
+  RcSectionActionsProps,
+} from './types';

package/rancher-components/RcSection/types.ts

@@ -0,0 +1,86 @@
+import type { Status } from '@components/utils/status';
+import type { RcIconType } from '@components/RcIcon/types';
+
+export type SectionType = 'primary' | 'secondary';
+
+export type SectionMode = 'with-header' | 'no-header';
+
+export type SectionBackground = 'primary' | 'secondary';
+
+// ---------------------------------------------------------------------------
+// Badge helpers
+// ---------------------------------------------------------------------------
+
+export interface BadgeConfig {
+  /** Display text inside the badge. */
+  label: string;
+  /** Status colour of the badge. */
+  status: Status;
+  /** Optional tooltip text shown on hover. */
+  tooltip?: string;
+}
+
+export interface RcSectionBadgesProps {
+  badges: BadgeConfig[];
+}
+
+// ---------------------------------------------------------------------------
+// Action helpers
+// ---------------------------------------------------------------------------
+
+export interface ActionConfig {
+  /** Button label. When omitted the button renders as icon-only (ghost). */
+  label?: string;
+  /** Icon shown on the button (left position for labeled, sole content for icon-only). */
+  icon?: RcIconType;
+  /** Accessible label for the button. Required when `label` is omitted so screen readers can describe the action. */
+  ariaLabel?: string;
+  /** Callback invoked when the action is clicked. */
+  action: () => void;
+}
+
+export interface RcSectionActionsProps {
+  actions: ActionConfig[];
+}
+
+// ---------------------------------------------------------------------------
+// Section
+// ---------------------------------------------------------------------------
+
+export interface RcSectionProps {
+  /**
+   * Visual type of the section.
+   * - Primary: no lateral padding, border-radius, or background (inherits from parent). Bolder title (700).
+   * - Secondary: has lateral padding (16px), border-radius (8px), and background color. Lighter title (600).
+   */
+  type: SectionType;
+
+  /**
+   * Controls whether the section renders with a header or without.
+   * - 'with-header': renders the full header (title, badges, actions, errors).
+   * - 'no-header': hides the header entirely; content padding adjusts to 16px vertical.
+   */
+  mode: SectionMode;
+
+  /**
+   * Background color of the section. When omitted, automatically alternates
+   * from the parent RcSection's background (primary -> secondary -> primary).
+   */
+  background?: SectionBackground;
+
+  /**
+   * Whether the section can be expanded/collapsed via the header.
+   */
+  expandable: boolean;
+
+  /**
+   * Whether the section content is expanded. Only applies when `expandable` is true.
+   * Supports `v-model:expanded`.
+   */
+  expanded?: boolean;
+
+  /**
+   * The section title text. Can also be provided via the `title` slot.
+   */
+  title?: string;
+}

package/scripts/test-plugins-build.sh

@@ -235,10 +235,11 @@ function clone_repo_test_extension_build() {
 
 # Here we just add the extension that we want to include as a check (all our official extensions should be included here)
 # Don't forget to add the unit tests exception to clone_repo_test_extension_build function if a new extension has those
-clone_repo_test_extension_build "rancher" "kubewarden-ui" "kubewarden"
-clone_repo_test_extension_build "rancher" "elemental-ui" "elemental"
+# TODO: ISSUE #16858 - Reenable the tests as packages migrate to node version 24
+# clone_repo_test_extension_build "rancher" "kubewarden-ui" "kubewarden"
+# clone_repo_test_extension_build "rancher" "elemental-ui" "elemental"
 clone_repo_test_extension_build "neuvector" "manager-ext" "neuvector-ui-ext"
-clone_repo_test_extension_build "StackVista" "rancher-extension-stackstate" "observability"
-clone_repo_test_extension_build "harvester" "harvester-ui-extension" "harvester"
+# clone_repo_test_extension_build "StackVista" "rancher-extension-stackstate" "observability"
+# clone_repo_test_extension_build "harvester" "harvester-ui-extension" "harvester"
 
 echo "All done"

package/types/shell/index.d.ts

@@ -1789,21 +1789,23 @@ export namespace SCOPE_NORMAN {
     let sort_103: string[];
     export { sort_103 as sort };
 }
-export namespace NORMAN_KEY_DEPRECATION {
+export namespace EXPIRES {
     let name_114: string;
     export { name_114 as name };
+    let value_113: string;
+    export { value_113 as value };
     let labelKey_111: string;
     export { labelKey_111 as labelKey };
-    export function value_113(row: any): string;
-    export { value_113 as value };
-    let sort_104: string;
-    export { sort_104 as sort };
     let align_18: string;
     export { align_18 as align };
-    let dashIfEmpty_7: boolean;
-    export { dashIfEmpty_7 as dashIfEmpty };
+    let sort_104: string[];
+    export { sort_104 as sort };
+    let width_30: number;
+    export { width_30 as width };
+    let formatter_62: string;
+    export { formatter_62 as formatter };
 }
-export namespace EXPIRES {
+export namespace LAST_USED {
     let name_115: string;
     export { name_115 as name };
     let value_114: string;
@@ -1814,22 +1816,6 @@ export namespace EXPIRES {
     export { align_19 as align };
     let sort_105: string[];
     export { sort_105 as sort };
-    let width_30: number;
-    export { width_30 as width };
-    let formatter_62: string;
-    export { formatter_62 as formatter };
-}
-export namespace LAST_USED {
-    let name_116: string;
-    export { name_116 as name };
-    let value_115: string;
-    export { value_115 as value };
-    let labelKey_113: string;
-    export { labelKey_113 as labelKey };
-    let align_20: string;
-    export { align_20 as align };
-    let sort_106: string[];
-    export { sort_106 as sort };
     let width_31: number;
     export { width_31 as width };
     let formatter_63: string;
@@ -1840,40 +1826,40 @@ export namespace LAST_USED {
     export { formatterOpts_15 as formatterOpts };
 }
 export namespace RESTART {
-    let name_117: string;
-    export { name_117 as name };
-    let labelKey_114: string;
-    export { labelKey_114 as labelKey };
-    let value_116: string;
-    export { value_116 as value };
-    let sort_107: string[];
-    export { sort_107 as sort };
+    let name_116: string;
+    export { name_116 as name };
+    let labelKey_113: string;
+    export { labelKey_113 as labelKey };
+    let value_115: string;
+    export { value_115 as value };
+    let sort_106: string[];
+    export { sort_106 as sort };
     let formatter_64: string;
     export { formatter_64 as formatter };
     let width_32: number;
     export { width_32 as width };
-    let align_21: string;
-    export { align_21 as align };
+    let align_20: string;
+    export { align_20 as align };
 }
 export namespace ROLE {
+    let name_117: string;
+    export { name_117 as name };
+    let value_116: string;
+    export { value_116 as value };
+    let labelKey_114: string;
+    export { labelKey_114 as labelKey };
+}
+export namespace FEATURE_DESCRIPTION {
     let name_118: string;
     export { name_118 as name };
-    let value_117: string;
-    export { value_117 as value };
     let labelKey_115: string;
     export { labelKey_115 as labelKey };
-}
-export namespace FEATURE_DESCRIPTION {
-    let name_119: string;
-    export { name_119 as name };
-    let labelKey_116: string;
-    export { labelKey_116 as labelKey };
-    let value_118: string;
-    export { value_118 as value };
-    let align_22: string;
-    export { align_22 as align };
-    let sort_108: string[];
-    export { sort_108 as sort };
+    let value_117: string;
+    export { value_117 as value };
+    let align_21: string;
+    export { align_21 as align };
+    let sort_107: string[];
+    export { sort_107 as sort };
     let formatter_65: string;
     export { formatter_65 as formatter };
     export namespace formatterOpts_16 {
@@ -1882,14 +1868,14 @@ export namespace FEATURE_DESCRIPTION {
     export { formatterOpts_16 as formatterOpts };
 }
 export namespace STATE_NORMAN {
-    let name_120: string;
-    export { name_120 as name };
-    let labelKey_117: string;
-    export { labelKey_117 as labelKey };
-    let sort_109: string[];
-    export { sort_109 as sort };
-    let value_119: string;
-    export { value_119 as value };
+    let name_119: string;
+    export { name_119 as name };
+    let labelKey_116: string;
+    export { labelKey_116 as labelKey };
+    let sort_108: string[];
+    export { sort_108 as sort };
+    let value_118: string;
+    export { value_118 as value };
     let width_33: number;
     export { width_33 as width };
     let _default_3: string;
@@ -1898,6 +1884,18 @@ export namespace STATE_NORMAN {
     export { formatter_66 as formatter };
 }
 export namespace KUBE_NODE_OS {
+    let name_120: string;
+    export { name_120 as name };
+    let labelKey_117: string;
+    export { labelKey_117 as labelKey };
+    let value_119: string;
+    export { value_119 as value };
+    let sort_109: string[];
+    export { sort_109 as sort };
+    let formatter_67: string;
+    export { formatter_67 as formatter };
+}
+export namespace MACHINE_NODE_OS {
     let name_121: string;
     export { name_121 as name };
     let labelKey_118: string;
@@ -1906,10 +1904,12 @@ export namespace KUBE_NODE_OS {
     export { value_120 as value };
     let sort_110: string[];
     export { sort_110 as sort };
-    let formatter_67: string;
-    export { formatter_67 as formatter };
+    let formatter_68: string;
+    export { formatter_68 as formatter };
+    let dashIfEmpty_7: boolean;
+    export { dashIfEmpty_7 as dashIfEmpty };
 }
-export namespace MACHINE_NODE_OS {
+export namespace MANAGEMENT_NODE_OS {
     let name_122: string;
     export { name_122 as name };
     let labelKey_119: string;
@@ -1918,63 +1918,49 @@ export namespace MACHINE_NODE_OS {
     export { value_121 as value };
     let sort_111: string[];
     export { sort_111 as sort };
-    let formatter_68: string;
-    export { formatter_68 as formatter };
+    let formatter_69: string;
+    export { formatter_69 as formatter };
     let dashIfEmpty_8: boolean;
     export { dashIfEmpty_8 as dashIfEmpty };
 }
-export namespace MANAGEMENT_NODE_OS {
+export namespace FLEET_BUNDLE_LAST_UPDATED {
     let name_123: string;
     export { name_123 as name };
     let labelKey_120: string;
     export { labelKey_120 as labelKey };
     let value_122: string;
     export { value_122 as value };
+    let formatter_70: string;
+    export { formatter_70 as formatter };
+    export namespace formatterOpts_17 {
+        let addSuffix_3: boolean;
+        export { addSuffix_3 as addSuffix };
+    }
+    export { formatterOpts_17 as formatterOpts };
     let sort_112: string[];
     export { sort_112 as sort };
-    let formatter_69: string;
-    export { formatter_69 as formatter };
-    let dashIfEmpty_9: boolean;
-    export { dashIfEmpty_9 as dashIfEmpty };
 }
-export namespace FLEET_BUNDLE_LAST_UPDATED {
+export namespace FLEET_REPO_TARGET {
     let name_124: string;
     export { name_124 as name };
     let labelKey_121: string;
     export { labelKey_121 as labelKey };
     let value_123: string;
     export { value_123 as value };
-    let formatter_70: string;
-    export { formatter_70 as formatter };
-    export namespace formatterOpts_17 {
-        let addSuffix_3: boolean;
-        export { addSuffix_3 as addSuffix };
-    }
-    export { formatterOpts_17 as formatterOpts };
     let sort_113: string[];
     export { sort_113 as sort };
 }
-export namespace FLEET_REPO_TARGET {
+export namespace FLEET_REPO {
     let name_125: string;
     export { name_125 as name };
     let labelKey_122: string;
     export { labelKey_122 as labelKey };
     let value_124: string;
     export { value_124 as value };
-    let sort_114: string[];
-    export { sort_114 as sort };
-}
-export namespace FLEET_REPO {
-    let name_126: string;
-    export { name_126 as name };
-    let labelKey_123: string;
-    export { labelKey_123 as labelKey };
-    let value_125: string;
-    export { value_125 as value };
     let formatter_71: string;
     export { formatter_71 as formatter };
-    let sort_115: string;
-    export { sort_115 as sort };
+    let sort_114: string;
+    export { sort_114 as sort };
     let search_19: string[];
     export { search_19 as search };
 }
@@ -2009,20 +1995,20 @@ export const UI_PLUGIN_CATALOG: ({
     formatterOpts?: undefined;
 })[];
 export namespace PROJECT {
+    let name_126: string;
+    export { name_126 as name };
+    let labelKey_123: string;
+    export { labelKey_123 as labelKey };
+}
+export namespace AUTOSCALER_ENABLED {
     let name_127: string;
     export { name_127 as name };
     let labelKey_124: string;
     export { labelKey_124 as labelKey };
-}
-export namespace AUTOSCALER_ENABLED {
-    let name_128: string;
-    export { name_128 as name };
-    let labelKey_125: string;
-    export { labelKey_125 as labelKey };
-    let value_126: string;
-    export { value_126 as value };
-    let sort_116: string[];
-    export { sort_116 as sort };
+    let value_125: string;
+    export { value_125 as value };
+    let sort_115: string[];
+    export { sort_115 as sort };
     let formatter_72: string;
     export { formatter_72 as formatter };
 }
@@ -2250,13 +2236,11 @@ export namespace BRAND {
     let RGS: string;
 }
 export namespace EXT {
-    export let USER_ACTIVITY: string;
-    export let SELFUSER: string;
-    export let GROUP_MEMBERSHIP_REFRESH_REQUESTS: string;
-    export let PASSWORD_CHANGE_REQUESTS: string;
-    export let KUBECONFIG: string;
-    let TOKEN_2: string;
-    export { TOKEN_2 as TOKEN };
+    let USER_ACTIVITY: string;
+    let SELFUSER: string;
+    let GROUP_MEMBERSHIP_REFRESH_REQUESTS: string;
+    let PASSWORD_CHANGE_REQUESTS: string;
+    let KUBECONFIG: string;
 }
 export namespace CAPI {
     let CAPI_CLUSTER: string;
@@ -2277,8 +2261,8 @@ export namespace FLEET {
     export let GIT_REPO: string;
     export let HELM_OP: string;
     export let WORKSPACE: string;
-    let TOKEN_3: string;
-    export { TOKEN_3 as TOKEN };
+    let TOKEN_2: string;
+    export { TOKEN_2 as TOKEN };
     export let BUNDLE_NAMESPACE_MAPPING: string;
     export let GIT_REPO_RESTRICTION: string;
 }
@@ -3460,7 +3444,7 @@ export default class Resource {
      * Allow to handle the response of the save request
      * @param {*} res Full request response
      */
-    processSaveResponse(res: any): void;
+    processSaveResponse(res: any, opt?: {}): void;
     _save(opt?: {}): Promise<this>;
     remove(...args: any[]): Promise<void>;
     _remove(opt?: {}): Promise<void>;
@@ -3826,7 +3810,7 @@ export default class SteveModel extends HybridModel {
      *
      * @param {*} res
      */
-    processSaveResponse(res: any): void;
+    processSaveResponse(res: any, opt?: {}): void;
 }
 import HybridModel from './hybrid-class';
 }

package/utils/style.ts

@@ -40,3 +40,20 @@ export function getHighestAlertColor(colors: StateColor[]) {
 
 // 1x1 transparent image as a placeholder image
 export const BLANK_IMAGE = 'data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7';
+
+/**
+ * Checks if the given element's text is truncated.
+ *
+ * @param element The DOM element to check for truncation
+ * @returns boolean indicating if the element's text is truncated
+ */
+export function isTruncated(element: HTMLElement | null): boolean {
+  if (!element) {
+    return false;
+  }
+
+  const isHorizontallyTruncated = element.scrollWidth > element.clientWidth;
+  const isVerticallyTruncated = element.scrollHeight - element.clientHeight > 1;
+
+  return isHorizontallyTruncated || isVerticallyTruncated;
+}

package/utils/units.js

@@ -166,13 +166,22 @@ function createMemoryUnits(n) {
 export function createMemoryValues(total, useful) {
   const parsedTotal = parseSi((total || '0').toString());
   const parsedUseful = parseSi((useful || '0').toString());
-  const format = createMemoryFormat(parsedTotal);
-  const formattedTotal = formatSi(parsedTotal, format);
-  const formattedUseful = formatSi(parsedUseful, format);
+
+  // Determine the appropriate unit based on total
+  const exponent = exponentNeeded(parsedTotal, 1024);
+  const divisor = 1024 ** exponent;
+
+  // Convert bytes to the appropriate unit, preserving precision
+  const totalInUnits = parsedTotal / divisor;
+  const usefulInUnits = parsedUseful / divisor;
+
+  // Apply maxPrecision rounding (2 decimal places) directly to numbers
+  const roundedTotal = Math.round(totalInUnits * 100) / 100;
+  const roundedUseful = Math.round(usefulInUnits * 100) / 100;
 
   return {
-    total:  Number.parseFloat(formattedTotal),
-    useful: Number.parseFloat(formattedUseful),
+    total:  roundedTotal,
+    useful: roundedUseful,
     units:  createMemoryUnits(parsedTotal)
   };
 }

package/models/ext.cattle.io.token.js

@@ -1,48 +0,0 @@
-import SteveModel from '@shell/plugins/steve/steve-class';
-
-export default class SteveToken extends SteveModel {
-  // for now, we are only showing the new tokens in the UI. Later we will be able to edit a few of it's fields
-  get _availableActions() {
-    return super._availableActions.filter((a) => ['viewInApi', 'promptRemove'].includes(a.action));
-  }
-
-  cleanForSave(data) {
-    const val = super.cleanForSave(data);
-
-    delete val.type;
-
-    return val;
-  }
-
-  get isDeprecated() {
-    return undefined;
-  }
-
-  get state() {
-    return this.isExpired ? 'expired' : !this.spec?.enabled ? 'inactive' : 'active';
-  }
-
-  get isExpired() {
-    return this.status?.expired;
-  }
-
-  get expiresAt() {
-    return this.status?.expiresAt || '';
-  }
-
-  get lastUsedAt() {
-    return this.status?.lastUsedAt || '';
-  }
-
-  get description() {
-    return this.spec?.description || '';
-  }
-
-  get clusterId() {
-    return this.spec?.clusterName || '';
-  }
-
-  get created() {
-    return this.metadata?.creationTimestamp;
-  }
-}