-
{summary.entity.title}
+ {titleLead ? (
+
+ {titleLead}
+
{summary.entity.title}
+
+ ) : (
+
{summary.entity.title}
+ )}
{summary.inline_fields.map((field) => {
const value = getValue(field.value);
diff --git a/command-center-sdk/src/views/README.md b/command-center-sdk/src/views/README.md
index 6a073f3f..0a70c1fc 100644
--- a/command-center-sdk/src/views/README.md
+++ b/command-center-sdk/src/views/README.md
@@ -138,4 +138,5 @@ fitting rules are pure functions in `detail-tab-layout.ts`, and its More menu is
in action mode. Hosts resolve tabs once with `resolveResourceDetailTabs` from `/resource`, which is
the only place `isVisible` and function-valued `disabled` run, and switch the body on that result. `EntitySummary` and `CollapsedEntitySummary` render normalized backend-neutral summary
data; hosts contribute icons, link handling, editing, label mutations, and notifications through
-callbacks. No view in this module knows a consumer endpoint or application-owned search parameter.
+callbacks. `EntitySummary`'s `titleLead` puts a host node, such as the entity's icon, before the
+title; the host sizes it, and a lead that renders nothing takes no space. No view in this module knows a consumer endpoint or application-owned search parameter.
diff --git a/command-center-sdk/styles.css b/command-center-sdk/styles.css
index ff7c6d90..a152fafa 100644
--- a/command-center-sdk/styles.css
+++ b/command-center-sdk/styles.css
@@ -921,6 +921,22 @@ h3),
min-width: 0;
}
+.cc-entity-summary__heading {
+ align-items: center;
+ display: flex;
+ gap: 0.6rem;
+ min-width: 0;
+}
+
+.cc-entity-summary__title-lead {
+ display: inline-flex;
+ flex-shrink: 0;
+}
+
+.cc-entity-summary__title-lead:empty {
+ display: none;
+}
+
.cc-entity-summary h2 {
font-size: var(--font-size-markdown-h1);
font-weight: var(--font-weight-semibold);