@galaxy-io/dls 2.4.0 → 2.4.1

package/dist/navigation/Tabs.d.ts

@@ -76,7 +76,8 @@ export interface TabsProps<TId extends string = string> extends AriaAttributes {
      */
     orientation?: Orientation;
     /**
-     * Horizontal only: the row spans its parent and every tab takes an equal share; labels truncate instead of overflowing into a menu.
+     * Horizontal: the row spans its parent and every tab takes an equal share; labels truncate instead of overflowing into a menu.
+     * Vertical: the column (and its `UNDERLINE` hairline) spans its parent instead of hugging the widest label; for a column with no panel beside it.
      * @default false
      */
     fillWidth?: boolean;

package/dist/navigation/Tabs.js

@@ -112,9 +112,11 @@ var TABS_ORIENTATION_TO_CSS_MAP = {
 };
 /** Horizontal `fillWidth`: the row spans its parent and every tab takes an equal share. */
 var FILL_WIDTH_CSS = "gx-Tabs-FILL_WIDTH_CSS-fs6iug3";
+/** Vertical `fillWidth`: a column with no panel beside it spans its parent, so the hairline sits on the parent's edge. */
+var VERTICAL_FILL_WIDTH_CSS = "gx-Tabs-VERTICAL_FILL_WIDTH_CSS-vvxftzj";
 var TABS_ORIENTATION_TO_BAR_CSS_MAP = {
-	[Orientation.HORIZONTAL]: "gx-Tabs-Orientation_HORIZONTAL-ovxftzj",
-	[Orientation.VERTICAL]: "gx-Tabs-Orientation_VERTICAL-oduyhd6"
+	[Orientation.HORIZONTAL]: "gx-Tabs-Orientation_HORIZONTAL-oduyhd6",
+	[Orientation.VERTICAL]: "gx-Tabs-Orientation_VERTICAL-oux4b2d"
 };
 /**
 * The hairline on the edge facing the panel (`UNDERLINE` only). A horizontal row draws it as an
@@ -125,52 +127,52 @@ var TABS_ORIENTATION_TO_BAR_CSS_MAP = {
 */
 var TABS_VARIANT_TO_BAR_CSS_MAP = {
 	["UNDERLINE"]: {
-		[Orientation.HORIZONTAL]: "gx-Tabs-Orientation_HORIZONTAL-oux4b2d",
-		[Orientation.VERTICAL]: "gx-Tabs-Orientation_VERTICAL-o6lhzlg"
+		[Orientation.HORIZONTAL]: "gx-Tabs-Orientation_HORIZONTAL-o6lhzlg",
+		[Orientation.VERTICAL]: "gx-Tabs-Orientation_VERTICAL-otj50wv"
 	},
 	["PILL"]: {
-		[Orientation.HORIZONTAL]: "gx-Tabs-Orientation_HORIZONTAL-otj50wv",
-		[Orientation.VERTICAL]: "gx-Tabs-Orientation_VERTICAL-o1wa4rz3"
+		[Orientation.HORIZONTAL]: "gx-Tabs-Orientation_HORIZONTAL-o1wa4rz3",
+		[Orientation.VERTICAL]: "gx-Tabs-Orientation_VERTICAL-o19ax5w1"
 	}
 };
 var TABS_ORIENTATION_TO_LIST_CSS_MAP = {
-	[Orientation.HORIZONTAL]: "gx-Tabs-Orientation_HORIZONTAL-o19ax5w1",
-	[Orientation.VERTICAL]: "gx-Tabs-Orientation_VERTICAL-o6on29c"
+	[Orientation.HORIZONTAL]: "gx-Tabs-Orientation_HORIZONTAL-o6on29c",
+	[Orientation.VERTICAL]: "gx-Tabs-Orientation_VERTICAL-o1cleozi"
 };
 /** While unmeasured (server, first paint, after items change): every tab renders, clipped. */
-var MEASURING_CSS = "gx-Tabs-MEASURING_CSS-m1cleozi";
+var MEASURING_CSS = "gx-Tabs-MEASURING_CSS-mfzxznm";
 /** The overflow trigger copy that is only measured. */
-var MEASURING_TRIGGER_CSS = "gx-Tabs-MEASURING_TRIGGER_CSS-mfzxznm";
+var MEASURING_TRIGGER_CSS = "gx-Tabs-MEASURING_TRIGGER_CSS-m10e4gpz";
 /**
 * Height, padding and icon-label gap per rung (custom properties on `Bar`). `--gx-tabs-row-height`
 * is the horizontal `UNDERLINE` row's minimum: the label centered with 8 / 12 / 12px above and
 * below it, the 2px indicator drawn over the bottom of that space.
 */
 var TABS_SIZE_TO_CSS_MAP = {
-	["SMALL"]: "gx-Tabs-SMALL-s10e4gpz",
-	["MEDIUM"]: "gx-Tabs-MEDIUM-m1k4ei2n",
-	["LARGE"]: "gx-Tabs-LARGE-l1fu2ke2"
+	["SMALL"]: "gx-Tabs-SMALL-s1k4ei2n",
+	["MEDIUM"]: "gx-Tabs-MEDIUM-m1fu2ke2",
+	["LARGE"]: "gx-Tabs-LARGE-l1q90ijz"
 };
 /** Shape per mode (every tab and the overflow trigger). */
 var TABS_VARIANT_TO_TAB_CSS_MAP = {
-	["UNDERLINE"]: "gx-Tabs-UNDERLINE-u1q90ijz",
-	["PILL"]: "gx-Tabs-PILL-p1xzvabb"
+	["UNDERLINE"]: "gx-Tabs-UNDERLINE-u1xzvabb",
+	["PILL"]: "gx-Tabs-PILL-pxgth9d"
 };
 /** Hover and press on an enabled, unselected tab (and the overflow trigger). */
 var TABS_VARIANT_TO_INTERACTIVE_CSS_MAP = {
-	["UNDERLINE"]: "gx-Tabs-UNDERLINE-uxgth9d",
-	["PILL"]: "gx-Tabs-PILL-p15kodi3"
+	["UNDERLINE"]: "gx-Tabs-UNDERLINE-u15kodi3",
+	["PILL"]: "gx-Tabs-PILL-phu3rsh"
 };
 var TABS_VARIANT_TO_SELECTED_CSS_MAP = {
-	["UNDERLINE"]: "gx-Tabs-UNDERLINE-uhu3rsh",
-	["PILL"]: "gx-Tabs-PILL-p1nmauec"
+	["UNDERLINE"]: "gx-Tabs-UNDERLINE-u1nmauec",
+	["PILL"]: "gx-Tabs-PILL-p14ug43i"
 };
 /** The `UNDERLINE` indicator's edge: always the one facing the panel, over the bar hairline. */
 var TABS_ORIENTATION_TO_INDICATOR_CSS_MAP = {
-	[Orientation.HORIZONTAL]: "gx-Tabs-Orientation_HORIZONTAL-o14ug43i",
-	[Orientation.VERTICAL]: "gx-Tabs-Orientation_VERTICAL-o1qvds3x"
+	[Orientation.HORIZONTAL]: "gx-Tabs-Orientation_HORIZONTAL-o1qvds3x",
+	[Orientation.VERTICAL]: "gx-Tabs-Orientation_VERTICAL-oa8x8b6"
 };
-var TAB_DISABLED_CSS = "gx-Tabs-TAB_DISABLED_CSS-ta8x8b6";
+var TAB_DISABLED_CSS = "gx-Tabs-TAB_DISABLED_CSS-t2u7szj";
 /** Tab icon px per rung: one step below the rung's III-A.4 icon (Mitch, 2026-10-04). */
 var TABS_SIZE_TO_ICON_PX_MAP = {
 	["SMALL"]: 12,
@@ -469,7 +471,7 @@ function TabsImpl(props, ref) {
 	const selectedPanel = selectedItem !== void 0 && selectedItem.href === void 0 ? selectedItem.panel : void 0;
 	return /* @__PURE__ */ jsxs(Root, {
 		ref,
-		className: cx(TABS_ORIENTATION_TO_CSS_MAP[orientation], fillWidth && isHorizontal && FILL_WIDTH_CSS, className),
+		className: cx(TABS_ORIENTATION_TO_CSS_MAP[orientation], fillWidth && (isHorizontal ? FILL_WIDTH_CSS : VERTICAL_FILL_WIDTH_CSS), className),
 		style,
 		children: [/* @__PURE__ */ jsxs(Bar, {
 			ref: barRef,