@typespec/html-program-viewer 0.72.0-dev.1 → 0.72.0-dev.3

package/dist/emitter/index.js

@@ -3991,7 +3991,7 @@ function disposeKeyborg(instance) {
         disposeCurrentElement();
         scope.removeEventListener(KEYBORG_FOCUSIN, keyborgListener);
         scope.removeEventListener('focusout', blurListener);
-        delete scope.focusVisible;
+        scope.focusVisible = undefined;
         disposeKeyborg(keyborg);
     };
 }
@@ -5427,39 +5427,62 @@ const JsValue = ({ value }) => {
   }
 };
 
-const TypeConfig = {
+const CommonPropsConfig = {
+  namespace: "parent",
+  name: "value"
+};
+const HiddenProps = [
+  "entityKind",
+  "kind",
+  "node",
+  "symbol",
+  "templateNode",
+  "templateArguments",
+  "templateMapper",
+  "instantiationParameters",
+  "decorators",
+  "isFinished"
+];
+const HiddenPropsConfig = Object.fromEntries(HiddenProps.map((prop) => [prop, "skip"]));
+const TypeConfig = buildConfig({
   Namespace: {
     namespaces: "skip",
-    models: "nested",
-    scalars: "nested",
-    interfaces: "nested",
-    operations: "nested",
-    unions: "nested",
-    enums: "nested",
-    decoratorDeclarations: "nested"
+    models: "nested-items",
+    scalars: "nested-items",
+    interfaces: "nested-items",
+    operations: "nested-items",
+    unions: "nested-items",
+    enums: "nested-items",
+    decoratorDeclarations: "nested-items"
   },
   Interface: {
-    operations: "nested",
+    operations: "nested-items",
     sourceInterfaces: "ref"
   },
   Operation: {
     interface: "parent",
-    parameters: "nested",
+    parameters: "nested-items",
     returnType: "ref",
     sourceOperation: "ref"
   },
   Model: {
-    indexer: "skip",
+    indexer: {
+      kind: "nested",
+      properties: {
+        key: "ref",
+        value: "ref"
+      }
+    },
     baseModel: "ref",
     derivedModels: "ref",
-    properties: "nested",
+    properties: "nested-items",
     sourceModel: "ref",
     sourceModels: "value"
   },
   Scalar: {
     baseScalar: "ref",
     derivedScalars: "ref",
-    constructors: "nested"
+    constructors: "nested-items"
   },
   ModelProperty: {
     model: "parent",
@@ -5469,7 +5492,7 @@ const TypeConfig = {
     defaultValue: "value"
   },
   Enum: {
-    members: "nested"
+    members: "nested-items"
   },
   EnumMember: {
     enum: "parent",
@@ -5477,8 +5500,8 @@ const TypeConfig = {
     value: "value"
   },
   Union: {
-    expression: "skip",
-    variants: "nested"
+    expression: "value",
+    variants: "nested-items"
   },
   UnionVariant: {
     union: "parent",
@@ -5488,13 +5511,13 @@ const TypeConfig = {
     value: "value"
   },
   Decorator: {
-    parameters: "nested",
+    parameters: "nested-items",
     implementation: "skip",
     target: "ref"
   },
   ScalarConstructor: {
     scalar: "parent",
-    parameters: "nested"
+    parameters: "nested-items"
   },
   FunctionParameter: null,
   Number: {
@@ -5506,10 +5529,10 @@ const TypeConfig = {
     value: "value"
   },
   Tuple: {
-    values: "nested"
+    values: "nested-items"
   },
   StringTemplate: {
-    spans: "nested",
+    spans: "nested-items",
     stringValue: "value"
   },
   StringTemplateSpan: {
@@ -5522,29 +5545,38 @@ const TypeConfig = {
   },
   // Don't want to expose those for now
   Intrinsic: null
-};
-const CommonPropsConfig = {
-  namespace: "parent"
-};
-const HiddenProps = [
-  "entityKind",
-  "kind",
-  "name",
-  "node",
-  "symbol",
-  "templateNode",
-  "templateArguments",
-  "templateMapper",
-  "instantiationParameters",
-  "decorators",
-  "projector",
-  "isFinished"
-];
+});
 new Set(HiddenProps);
-function getPropertyRendering(type, key) {
-  const properties = TypeConfig[type.kind];
-  const action = properties?.[key] ?? CommonPropsConfig[key];
-  return action;
+function getRenderingConfig(type) {
+  return TypeConfig[type.kind];
+}
+function buildConfig(raw) {
+  return Object.fromEntries(
+    Object.entries(raw).map(([kind, config]) => {
+      return [kind, buildConfigForKind(config)];
+    })
+  );
+}
+function buildConfigForKind(config) {
+  if (config === null) {
+    return null;
+  }
+  return Object.fromEntries(
+    Object.entries({ ...CommonPropsConfig, ...HiddenPropsConfig, ...config }).map(
+      ([key, value]) => {
+        return [key, buildConfigForProperty(value)];
+      }
+    )
+  );
+}
+function buildConfigForProperty(value) {
+  if (typeof value === "string") {
+    return { kind: value };
+  }
+  return {
+    kind: "nested",
+    properties: buildConfigForKind(value.properties)
+  };
 }
 
 const TreeNavigatorContext = createContext(void 0);
@@ -5669,13 +5701,22 @@ const SimpleType = ({ type, children }) => {
     children
   ] });
 };
-const EntityProperties = ({ entity: type }) => {
-  const props = Object.entries(type).map(([key, value]) => {
-    const action = getPropertyRendering(type, key);
-    if (action === void 0 || action === "skip") {
+const EntityProperties = ({ entity }) => {
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(InspectObject, { value: entity, config: getRenderingConfig(entity) });
+};
+const InspectObject = ({
+  value,
+  config
+}) => {
+  if (value === void 0) {
+    return null;
+  }
+  const props = Object.entries(value).map(([key, value2]) => {
+    const action = config?.[key];
+    if (action === void 0 || action === null || action.kind === "skip") {
       return void 0;
     }
-    return /* @__PURE__ */ jsxRuntimeExports.jsx(EntityProperty, { name: key, value, action }, key);
+    return /* @__PURE__ */ jsxRuntimeExports.jsx(EntityProperty, { name: key, value: value2, action }, key);
   }).filter((x) => Boolean(x));
   return /* @__PURE__ */ jsxRuntimeExports.jsx("ul", { children: props });
 };
@@ -5689,12 +5730,15 @@ const EntityProperty = (props) => {
 };
 const EntityPropertyValue = ({ value, action }) => {
   const render = (x) => {
-    if (action === "parent") {
+    if (action.kind === "parent") {
       return x.entityKind === "Type" ? /* @__PURE__ */ jsxRuntimeExports.jsx(ParentReference, { type: x }) : null;
     }
-    const renderRef = action === "ref";
+    const renderRef = action.kind === "ref";
     return renderRef ? /* @__PURE__ */ jsxRuntimeExports.jsx(EntityReference, { entity: x }) : /* @__PURE__ */ jsxRuntimeExports.jsx(EntityUI, { entity: x });
   };
+  if (action.kind === "nested") {
+    return /* @__PURE__ */ jsxRuntimeExports.jsx(InspectObject, { value, config: action.properties });
+  }
   if (value === void 0) {
     return null;
   } else if (value.entityKind) {

package/dist/{manifest-DvYpHITg.js → manifest-DH1LKq9n.js}

@@ -1,6 +1,6 @@
 const manifest = {
   "version": "1.1.0",
-  "commit": "96088468048e5bc5eb450816a8f047ec68be9646"
+  "commit": "e06d7434ea7c8348b49b31f47128ae02a300b129"
 };
 
 export { manifest as default };

package/dist/react/index.js

@@ -31494,219 +31494,19 @@ defineKit({
     },
 });
 
-class InvalidNumericError extends Error {
-    code = "InvalidNumeric";
-}
-/** @internal */
-const InternalDataSym = Symbol.for("NumericInternalData");
-/**
- * Represent any possible numeric value
- */
-function Numeric(stringValue) {
-    if (new.target) {
-        throw new Error("Numeric is not a constructor");
-    }
-    const data = parse(stringValue);
-    const isInteger = data.d === 0;
-    const obj = {
-        [InternalDataSym]: data,
-        isInteger,
-    };
-    // We are explicitly not using a class here due to version mismatch between the compiler and the runtime that could happen and break instanceof checks.
-    const numeric = setTypedProptotype(obj, NumericPrototype);
-    return Object.freeze(numeric);
-}
-function setTypedProptotype(obj, prototype) {
-    Object.setPrototypeOf(obj, prototype);
-    return obj;
-}
-function parse(original) {
-    let stringValue = original;
-    let start = 0;
-    let sign = 1;
-    let n;
-    let exp;
-    let decimal = undefined;
-    if (stringValue[0] === "-") {
-        start = 1;
-        sign = -1;
-    }
-    const second = stringValue[start + 1]?.toLowerCase();
-    if (stringValue[start] === "0" && (second === "b" || second === "x" || second === "o")) {
-        try {
-            n = BigInt(stringValue.slice(start));
-            exp = n.toString().length;
-            decimal = 0;
-        }
-        catch {
-            throw new InvalidNumericError(`Invalid numeric value: ${original}`);
-        }
-    }
-    else {
-        // Skip leading 0.
-        while (stringValue[start] === "0") {
-            start++;
-        }
-        const decimalPointIndex = stringValue.indexOf(".");
-        const adjustedPointIndex = decimalPointIndex - start;
-        // Decimal point?
-        if (decimalPointIndex !== -1) {
-            exp = adjustedPointIndex;
-            stringValue = stringValue.replace(".", "");
-        }
-        let i;
-        if ((i = stringValue.search(/e/i)) > 0) {
-            // Determine exponent.
-            if (exp === undefined) {
-                exp = i - start;
-            }
-            exp += Number(stringValue.slice(i + 1));
-            stringValue = stringValue.slice(start, i);
-            decimal = Math.max(stringValue.length - exp, 0);
-        }
-        else if (exp === undefined) {
-            // Integer.
-            exp = stringValue.length - start;
-            stringValue = stringValue.slice(start);
-        }
-        else {
-            stringValue = stringValue.slice(start);
-        }
-        let end = stringValue.length;
-        while (stringValue[end - 1] === "0" && end > adjustedPointIndex) {
-            end--;
-        }
-        // Only if there is 0 before the decimal point, keeps checking how many 0 there is after it and update the exponent accordingly.
-        if (start === adjustedPointIndex + 1) {
-            let cur = adjustedPointIndex;
-            while (stringValue[cur] === "0" && cur < end) {
-                cur++;
-                exp--;
-            }
-        }
-        try {
-            stringValue = stringValue.slice(0, end);
-            stringValue = stringValue + "0".repeat(Math.max(exp - stringValue.length, 0)); // add remaining zeros for cases like 3e30
-            n = BigInt(stringValue);
-            if (n === 0n) {
-                decimal = 0;
-            }
-            else if (decimal === undefined) {
-                decimal = Math.max(stringValue.length - Math.max(exp, 0), 0);
-            }
-        }
-        catch {
-            throw new InvalidNumericError(`Invalid numeric value: ${original}`);
-        }
-    }
-    return { n, e: exp, s: sign, d: decimal };
-}
-function stringify(value) {
-    if (value.n === 0n)
-        return "0";
-    const n = value.n.toString();
-    const sign = value.s === -1 ? "-" : "";
-    const int = value.e <= 0 ? "0" : n.slice(0, value.e);
-    const decimal = value.e < n.length ? "." + n.slice(-value.d).padStart(value.d, "0") : "";
-    return sign + int + decimal;
-}
-const equals = (a, b) => a.n === b.n && a.e === b.e;
-const compare = (a, b) => {
-    if (a.s < b.s) {
-        return -1;
-    }
-    else if (a.s > b.s) {
-        return 1;
-    }
-    const neg = a.s;
-    if (a.e < b.e) {
-        return (-1 * neg);
-    }
-    else if (a.e > b.e) {
-        return (1 * neg);
-    }
-    let aN = a.n;
-    let bN = b.n;
-    if (a.d < b.d) {
-        aN *= 10n ** BigInt(b.d - a.d);
-    }
-    else {
-        bN *= 10n ** BigInt(a.d - b.d);
-    }
-    if (aN < bN)
-        return (-1 * neg);
-    if (aN > bN)
-        return (1 * neg);
-    return 0;
-};
-const NumericPrototype = {
-    toString: function () {
-        return stringify(this[InternalDataSym]);
-    },
-    asNumber: function () {
-        const num = Number(stringify(this[InternalDataSym]));
-        return equals(this[InternalDataSym], Numeric(num.toString())[InternalDataSym]) ? num : null;
-    },
-    asBigInt: function () {
-        if (!this.isInteger) {
-            return null;
-        }
-        const { s, n } = this[InternalDataSym];
-        return BigInt(s) * n;
-    },
-    equals: function (other) {
-        return equals(this[InternalDataSym], other[InternalDataSym]);
-    },
-    lt: function (other) {
-        return compare(this[InternalDataSym], other[InternalDataSym]) === -1;
-    },
-    lte: function (other) {
-        return compare(this[InternalDataSym], other[InternalDataSym]) <= 0;
-    },
-    gt: function (other) {
-        return compare(this[InternalDataSym], other[InternalDataSym]) === 1;
-    },
-    gte: function (other) {
-        return compare(this[InternalDataSym], other[InternalDataSym]) >= 0;
-    },
-};
-NumericPrototype.toString = function () {
-    return stringify(this[InternalDataSym]);
-};
-
 defineKit({
     literal: {
         create(value) {
-            if (typeof value === "string") {
-                return this.literal.createString(value);
-            }
-            else if (typeof value === "number") {
-                return this.literal.createNumeric(value);
-            }
-            else {
-                return this.literal.createBoolean(value);
-            }
+            return this.program.checker.createLiteralType(value);
         },
         createString(value) {
-            return this.program.checker.createType({
-                kind: "String",
-                value,
-            });
+            return this.program.checker.createLiteralType(value);
         },
         createNumeric(value) {
-            const valueAsString = String(value);
-            return this.program.checker.createType({
-                kind: "Number",
-                value,
-                valueAsString,
-                numericValue: Numeric(valueAsString),
-            });
+            return this.program.checker.createLiteralType(value);
         },
         createBoolean(value) {
-            return this.program.checker.createType({
-                kind: "Boolean",
-                value,
-            });
+            return this.program.checker.createLiteralType(value);
         },
         isBoolean(type) {
             return type.entityKind === "Type" && type.kind === "Boolean";
@@ -32346,6 +32146,186 @@ defineKit({
     },
 });
 
+class InvalidNumericError extends Error {
+    code = "InvalidNumeric";
+}
+/** @internal */
+const InternalDataSym = Symbol.for("NumericInternalData");
+/**
+ * Represent any possible numeric value
+ */
+function Numeric(stringValue) {
+    if (new.target) {
+        throw new Error("Numeric is not a constructor");
+    }
+    const data = parse(stringValue);
+    const isInteger = data.d === 0;
+    const obj = {
+        [InternalDataSym]: data,
+        isInteger,
+    };
+    // We are explicitly not using a class here due to version mismatch between the compiler and the runtime that could happen and break instanceof checks.
+    const numeric = setTypedProptotype(obj, NumericPrototype);
+    return Object.freeze(numeric);
+}
+function setTypedProptotype(obj, prototype) {
+    Object.setPrototypeOf(obj, prototype);
+    return obj;
+}
+function parse(original) {
+    let stringValue = original;
+    let start = 0;
+    let sign = 1;
+    let n;
+    let exp;
+    let decimal = undefined;
+    if (stringValue[0] === "-") {
+        start = 1;
+        sign = -1;
+    }
+    const second = stringValue[start + 1]?.toLowerCase();
+    if (stringValue[start] === "0" && (second === "b" || second === "x" || second === "o")) {
+        try {
+            n = BigInt(stringValue.slice(start));
+            exp = n.toString().length;
+            decimal = 0;
+        }
+        catch {
+            throw new InvalidNumericError(`Invalid numeric value: ${original}`);
+        }
+    }
+    else {
+        // Skip leading 0.
+        while (stringValue[start] === "0") {
+            start++;
+        }
+        const decimalPointIndex = stringValue.indexOf(".");
+        const adjustedPointIndex = decimalPointIndex - start;
+        // Decimal point?
+        if (decimalPointIndex !== -1) {
+            exp = adjustedPointIndex;
+            stringValue = stringValue.replace(".", "");
+        }
+        let i;
+        if ((i = stringValue.search(/e/i)) > 0) {
+            // Determine exponent.
+            if (exp === undefined) {
+                exp = i - start;
+            }
+            exp += Number(stringValue.slice(i + 1));
+            stringValue = stringValue.slice(start, i);
+            decimal = Math.max(stringValue.length - exp, 0);
+        }
+        else if (exp === undefined) {
+            // Integer.
+            exp = stringValue.length - start;
+            stringValue = stringValue.slice(start);
+        }
+        else {
+            stringValue = stringValue.slice(start);
+        }
+        let end = stringValue.length;
+        while (stringValue[end - 1] === "0" && end > adjustedPointIndex) {
+            end--;
+        }
+        // Only if there is 0 before the decimal point, keeps checking how many 0 there is after it and update the exponent accordingly.
+        if (start === adjustedPointIndex + 1) {
+            let cur = adjustedPointIndex;
+            while (stringValue[cur] === "0" && cur < end) {
+                cur++;
+                exp--;
+            }
+        }
+        try {
+            stringValue = stringValue.slice(0, end);
+            stringValue = stringValue + "0".repeat(Math.max(exp - stringValue.length, 0)); // add remaining zeros for cases like 3e30
+            n = BigInt(stringValue);
+            if (n === 0n) {
+                decimal = 0;
+            }
+            else if (decimal === undefined) {
+                decimal = Math.max(stringValue.length - Math.max(exp, 0), 0);
+            }
+        }
+        catch {
+            throw new InvalidNumericError(`Invalid numeric value: ${original}`);
+        }
+    }
+    return { n, e: exp, s: sign, d: decimal };
+}
+function stringify(value) {
+    if (value.n === 0n)
+        return "0";
+    const n = value.n.toString();
+    const sign = value.s === -1 ? "-" : "";
+    const int = value.e <= 0 ? "0" : n.slice(0, value.e);
+    const decimal = value.e < n.length ? "." + n.slice(-value.d).padStart(value.d, "0") : "";
+    return sign + int + decimal;
+}
+const equals = (a, b) => a.n === b.n && a.e === b.e;
+const compare = (a, b) => {
+    if (a.s < b.s) {
+        return -1;
+    }
+    else if (a.s > b.s) {
+        return 1;
+    }
+    const neg = a.s;
+    if (a.e < b.e) {
+        return (-1 * neg);
+    }
+    else if (a.e > b.e) {
+        return (1 * neg);
+    }
+    let aN = a.n;
+    let bN = b.n;
+    if (a.d < b.d) {
+        aN *= 10n ** BigInt(b.d - a.d);
+    }
+    else {
+        bN *= 10n ** BigInt(a.d - b.d);
+    }
+    if (aN < bN)
+        return (-1 * neg);
+    if (aN > bN)
+        return (1 * neg);
+    return 0;
+};
+const NumericPrototype = {
+    toString: function () {
+        return stringify(this[InternalDataSym]);
+    },
+    asNumber: function () {
+        const num = Number(stringify(this[InternalDataSym]));
+        return equals(this[InternalDataSym], Numeric(num.toString())[InternalDataSym]) ? num : null;
+    },
+    asBigInt: function () {
+        if (!this.isInteger) {
+            return null;
+        }
+        const { s, n } = this[InternalDataSym];
+        return BigInt(s) * n;
+    },
+    equals: function (other) {
+        return equals(this[InternalDataSym], other[InternalDataSym]);
+    },
+    lt: function (other) {
+        return compare(this[InternalDataSym], other[InternalDataSym]) === -1;
+    },
+    lte: function (other) {
+        return compare(this[InternalDataSym], other[InternalDataSym]) <= 0;
+    },
+    gt: function (other) {
+        return compare(this[InternalDataSym], other[InternalDataSym]) === 1;
+    },
+    gte: function (other) {
+        return compare(this[InternalDataSym], other[InternalDataSym]) >= 0;
+    },
+};
+NumericPrototype.toString = function () {
+    return stringify(this[InternalDataSym]);
+};
+
 defineKit({
     value: {
         is(value) {
@@ -34325,7 +34305,7 @@ let manifest;
 try {
     // eslint-disable-next-line @typescript-eslint/ban-ts-comment
     // @ts-ignore
-    manifest = (await import('../manifest-DvYpHITg.js')).default;
+    manifest = (await import('../manifest-DH1LKq9n.js')).default;
 }
 catch {
     const name = "../dist/manifest.js";
@@ -45459,39 +45439,62 @@ function isMapLike(value) {
   return "entries" in value && typeof value.entries === "function";
 }
 
-const TypeConfig = {
+const CommonPropsConfig = {
+  namespace: "parent",
+  name: "value"
+};
+const HiddenProps = [
+  "entityKind",
+  "kind",
+  "node",
+  "symbol",
+  "templateNode",
+  "templateArguments",
+  "templateMapper",
+  "instantiationParameters",
+  "decorators",
+  "isFinished"
+];
+const HiddenPropsConfig = Object.fromEntries(HiddenProps.map((prop) => [prop, "skip"]));
+const TypeConfig = buildConfig({
   Namespace: {
     namespaces: "skip",
-    models: "nested",
-    scalars: "nested",
-    interfaces: "nested",
-    operations: "nested",
-    unions: "nested",
-    enums: "nested",
-    decoratorDeclarations: "nested"
+    models: "nested-items",
+    scalars: "nested-items",
+    interfaces: "nested-items",
+    operations: "nested-items",
+    unions: "nested-items",
+    enums: "nested-items",
+    decoratorDeclarations: "nested-items"
   },
   Interface: {
-    operations: "nested",
+    operations: "nested-items",
     sourceInterfaces: "ref"
   },
   Operation: {
     interface: "parent",
-    parameters: "nested",
+    parameters: "nested-items",
     returnType: "ref",
     sourceOperation: "ref"
   },
   Model: {
-    indexer: "skip",
+    indexer: {
+      kind: "nested",
+      properties: {
+        key: "ref",
+        value: "ref"
+      }
+    },
     baseModel: "ref",
     derivedModels: "ref",
-    properties: "nested",
+    properties: "nested-items",
     sourceModel: "ref",
     sourceModels: "value"
   },
   Scalar: {
     baseScalar: "ref",
     derivedScalars: "ref",
-    constructors: "nested"
+    constructors: "nested-items"
   },
   ModelProperty: {
     model: "parent",
@@ -45501,7 +45504,7 @@ const TypeConfig = {
     defaultValue: "value"
   },
   Enum: {
-    members: "nested"
+    members: "nested-items"
   },
   EnumMember: {
     enum: "parent",
@@ -45509,8 +45512,8 @@ const TypeConfig = {
     value: "value"
   },
   Union: {
-    expression: "skip",
-    variants: "nested"
+    expression: "value",
+    variants: "nested-items"
   },
   UnionVariant: {
     union: "parent",
@@ -45520,13 +45523,13 @@ const TypeConfig = {
     value: "value"
   },
   Decorator: {
-    parameters: "nested",
+    parameters: "nested-items",
     implementation: "skip",
     target: "ref"
   },
   ScalarConstructor: {
     scalar: "parent",
-    parameters: "nested"
+    parameters: "nested-items"
   },
   FunctionParameter: null,
   Number: {
@@ -45538,10 +45541,10 @@ const TypeConfig = {
     value: "value"
   },
   Tuple: {
-    values: "nested"
+    values: "nested-items"
   },
   StringTemplate: {
-    spans: "nested",
+    spans: "nested-items",
     stringValue: "value"
   },
   StringTemplateSpan: {
@@ -45554,29 +45557,38 @@ const TypeConfig = {
   },
   // Don't want to expose those for now
   Intrinsic: null
-};
-const CommonPropsConfig = {
-  namespace: "parent"
-};
-const HiddenProps = [
-  "entityKind",
-  "kind",
-  "name",
-  "node",
-  "symbol",
-  "templateNode",
-  "templateArguments",
-  "templateMapper",
-  "instantiationParameters",
-  "decorators",
-  "projector",
-  "isFinished"
-];
+});
 new Set(HiddenProps);
-function getPropertyRendering(type, key) {
-  const properties = TypeConfig[type.kind];
-  const action = properties?.[key] ?? CommonPropsConfig[key];
-  return action;
+function getRenderingConfig(type) {
+  return TypeConfig[type.kind];
+}
+function buildConfig(raw) {
+  return Object.fromEntries(
+    Object.entries(raw).map(([kind, config]) => {
+      return [kind, buildConfigForKind(config)];
+    })
+  );
+}
+function buildConfigForKind(config) {
+  if (config === null) {
+    return null;
+  }
+  return Object.fromEntries(
+    Object.entries({ ...CommonPropsConfig, ...HiddenPropsConfig, ...config }).map(
+      ([key, value]) => {
+        return [key, buildConfigForProperty(value)];
+      }
+    )
+  );
+}
+function buildConfigForProperty(value) {
+  if (typeof value === "string") {
+    return { kind: value };
+  }
+  return {
+    kind: "nested",
+    properties: buildConfigForKind(value.properties)
+  };
 }
 
 function expandNamespaces(namespace) {
@@ -45646,7 +45658,7 @@ function computeTypeNode(parentPath, type, name) {
 }
 function computeTypeNodeProps(path, type, name) {
   const typeRendering = TypeConfig[type.kind];
-  const children = Object.entries(type).filter(([key]) => typeRendering?.[key] === "nested").map(([key, value]) => {
+  const children = Object.entries(type).filter(([key]) => typeRendering?.[key]?.kind === "nested-items").map(([key, value]) => {
     const propPath = path + "." + key;
     if (isMapLike(value)) {
       return computeItemList(propPath, key, value);
@@ -46066,13 +46078,22 @@ const SimpleType = ({ type, children }) => {
     children
   ] });
 };
-const EntityProperties = ({ entity: type }) => {
-  const props = Object.entries(type).map(([key, value]) => {
-    const action = getPropertyRendering(type, key);
-    if (action === void 0 || action === "skip") {
+const EntityProperties = ({ entity }) => {
+  return /* @__PURE__ */ jsxRuntimeExports$1.jsx(InspectObject, { value: entity, config: getRenderingConfig(entity) });
+};
+const InspectObject = ({
+  value,
+  config
+}) => {
+  if (value === void 0) {
+    return null;
+  }
+  const props = Object.entries(value).map(([key, value2]) => {
+    const action = config?.[key];
+    if (action === void 0 || action === null || action.kind === "skip") {
       return void 0;
     }
-    return /* @__PURE__ */ jsxRuntimeExports$1.jsx(EntityProperty, { name: key, value, action }, key);
+    return /* @__PURE__ */ jsxRuntimeExports$1.jsx(EntityProperty, { name: key, value: value2, action }, key);
   }).filter((x) => Boolean(x));
   return /* @__PURE__ */ jsxRuntimeExports$1.jsx("ul", { children: props });
 };
@@ -46086,12 +46107,15 @@ const EntityProperty = (props) => {
 };
 const EntityPropertyValue = ({ value, action }) => {
   const render = (x) => {
-    if (action === "parent") {
+    if (action.kind === "parent") {
       return x.entityKind === "Type" ? /* @__PURE__ */ jsxRuntimeExports$1.jsx(ParentReference, { type: x }) : null;
     }
-    const renderRef = action === "ref";
+    const renderRef = action.kind === "ref";
     return renderRef ? /* @__PURE__ */ jsxRuntimeExports$1.jsx(EntityReference, { entity: x }) : /* @__PURE__ */ jsxRuntimeExports$1.jsx(EntityUI, { entity: x });
   };
+  if (action.kind === "nested") {
+    return /* @__PURE__ */ jsxRuntimeExports$1.jsx(InspectObject, { value, config: action.properties });
+  }
   if (value === void 0) {
     return null;
   } else if (value.entityKind) {
@@ -46361,9 +46385,9 @@ const style$1 = {
 
 const TypeDataTable = ({ type }) => {
   const program = useProgram();
-  const entries = [...program.stateMaps.entries()].map(([k, v]) => [k, v.get(void 0)?.get(type)]).filter(([k, v]) => !!v);
+  const entries = [...program.stateMaps.entries()].map(([k, v]) => [k, v.get(type)]).filter(([k, v]) => !!v);
   if (entries.length === 0) {
-    return null;
+    return "No decorator state found on this type.";
   }
   return /* @__PURE__ */ jsxRuntimeExports$1.jsxs("table", { className: style$1["table"], children: [
     /* @__PURE__ */ jsxRuntimeExports$1.jsx("thead", { children: /* @__PURE__ */ jsxRuntimeExports$1.jsxs("tr", { children: [

package/dist/react/inspect-type/inspect-type.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"inspect-type.d.ts","sourceRoot":"","sources":["../../../src/react/inspect-type/inspect-type.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,oBAAoB,CAAC;AAEvD,OAAO,EAAe,KAAK,iBAAiB,EAAqC,MAAM,OAAO,CAAC;AAU/F,UAAU,gBAAgB;IACxB,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAC;CACzB;AAED,eAAO,MAAM,WAAW,EAAE,iBAAiB,CAAC,gBAAgB,CAM3D,CAAC;AAuEF,eAAO,MAAM,aAAa,EAAE,iBAAiB,CAAC;IAAE,IAAI,EAAE,IAAI,CAAA;CAAE,CAmD3D,CAAC"}
+{"version":3,"file":"inspect-type.d.ts","sourceRoot":"","sources":["../../../src/react/inspect-type/inspect-type.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,oBAAoB,CAAC;AAEvD,OAAO,EAAe,KAAK,iBAAiB,EAAqC,MAAM,OAAO,CAAC;AAc/F,UAAU,gBAAgB;IACxB,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAC;CACzB;AAED,eAAO,MAAM,WAAW,EAAE,iBAAiB,CAAC,gBAAgB,CAM3D,CAAC;AAuEF,eAAO,MAAM,aAAa,EAAE,iBAAiB,CAAC;IAAE,IAAI,EAAE,IAAI,CAAA;CAAE,CAmD3D,CAAC"}

package/dist/react/type-config.d.ts

@@ -1,19 +1,35 @@
-import { Type } from '@typespec/compiler';
-export type EntityPropertyConfig = "parent" | "nested" | "ref" | "value" | "skip";
+import { Entity, Type } from '@typespec/compiler';
+export type PropertyRendering<T> = {
+    kind: "parent" | "nested-items" | "ref" | "value" | "skip";
+} | NestedPropertyRendering<T>;
+export type PropertyRenderingRaw<T> = "parent" | "nested-items" | "ref" | "value" | "skip" | NestedPropertyRenderingRaw<T>;
+export type PropertiesRenderingRaw<T> = {
+    [K in keyof T]: PropertyRenderingRaw<T[K]>;
+};
+export type PropertiesRendering<T> = {
+    [K in keyof T]: PropertyRendering<T[K]>;
+};
+export type NestedPropertyRendering<T> = {
+    kind: "nested";
+    properties: PropertiesRendering<T>;
+};
+export type NestedPropertyRenderingRaw<T> = {
+    kind: "nested";
+    properties: PropertiesRenderingRaw<T>;
+};
+export declare const CommonPropsConfig: {
+    namespace: string;
+    name: string;
+};
 export declare const TypeConfig: TypeGraphConfig;
-type PropsToDefine<T extends Type> = Exclude<keyof T, HiddenPropsType | keyof typeof CommonPropsConfig>;
-type TypeConfig<T extends Type> = Record<PropsToDefine<T>, EntityPropertyConfig> | null;
+type TypeConfig<T extends Type> = PropertiesRendering<T> | null;
 type TypeGraphConfig = {
     [K in Type["kind"]]: TypeConfig<Extract<Type, {
         kind: K;
     }>>;
 };
-export declare const CommonPropsConfig: {
-    namespace: string;
-};
-declare const HiddenProps: readonly ["entityKind", "kind", "name", "node", "symbol", "templateNode", "templateArguments", "templateMapper", "instantiationParameters", "decorators", "projector", "isFinished"];
-type HiddenPropsType = (typeof HiddenProps)[number];
-export declare const HiddenPropsSet: Set<"symbol" | "kind" | "entityKind" | "name" | "node" | "templateNode" | "templateArguments" | "templateMapper" | "instantiationParameters" | "decorators" | "projector" | "isFinished">;
-export declare function getPropertyRendering<T extends Type, K extends keyof T>(type: T, key: K): EntityPropertyConfig;
+export declare const HiddenPropsSet: Set<"symbol" | "entityKind" | "kind" | "node" | "templateNode" | "templateArguments" | "templateMapper" | "instantiationParameters" | "decorators" | "isFinished">;
+export declare function getPropertyRendering<T extends Type, K extends keyof T>(type: T, key: K): PropertyRenderingRaw<T>;
+export declare function getRenderingConfig<T extends Entity>(type: T): PropertiesRendering<T> | null;
 export {};
 //# sourceMappingURL=type-config.d.ts.map

package/dist/react/type-config.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"type-config.d.ts","sourceRoot":"","sources":["../../src/react/type-config.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,oBAAoB,CAAC;AAE/C,MAAM,MAAM,oBAAoB,GAAG,QAAQ,GAAG,QAAQ,GAAG,KAAK,GAAG,OAAO,GAAG,MAAM,CAAC;AAElF,eAAO,MAAM,UAAU,EAAE,eAgGxB,CAAC;AAEF,KAAK,aAAa,CAAC,CAAC,SAAS,IAAI,IAAI,OAAO,CAC1C,MAAM,CAAC,EACP,eAAe,GAAG,MAAM,OAAO,iBAAiB,CACjD,CAAC;AACF,KAAK,UAAU,CAAC,CAAC,SAAS,IAAI,IAAI,MAAM,CAAC,aAAa,CAAC,CAAC,CAAC,EAAE,oBAAoB,CAAC,GAAG,IAAI,CAAC;AACxF,KAAK,eAAe,GAAG;KACpB,CAAC,IAAI,IAAI,CAAC,MAAM,CAAC,GAAG,UAAU,CAAC,OAAO,CAAC,IAAI,EAAE;QAAE,IAAI,EAAE,CAAC,CAAA;KAAE,CAAC,CAAC;CAC5D,CAAC;AAEF,eAAO,MAAM,iBAAiB;;CAE7B,CAAC;AAEF,QAAA,MAAM,WAAW,sLAaP,CAAC;AACX,KAAK,eAAe,GAAG,CAAC,OAAO,WAAW,CAAC,CAAC,MAAM,CAAC,CAAC;AAEpD,eAAO,MAAM,cAAc,2LAAuB,CAAC;AAEnD,wBAAgB,oBAAoB,CAAC,CAAC,SAAS,IAAI,EAAE,CAAC,SAAS,MAAM,CAAC,EACpE,IAAI,EAAE,CAAC,EACP,GAAG,EAAE,CAAC,GACL,oBAAoB,CAItB"}
+{"version":3,"file":"type-config.d.ts","sourceRoot":"","sources":["../../src/react/type-config.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,oBAAoB,CAAC;AAEvD,MAAM,MAAM,iBAAiB,CAAC,CAAC,IAC3B;IAAE,IAAI,EAAE,QAAQ,GAAG,cAAc,GAAG,KAAK,GAAG,OAAO,GAAG,MAAM,CAAA;CAAE,GAC9D,uBAAuB,CAAC,CAAC,CAAC,CAAC;AAC/B,MAAM,MAAM,oBAAoB,CAAC,CAAC,IAC9B,QAAQ,GACR,cAAc,GACd,KAAK,GACL,OAAO,GACP,MAAM,GACN,0BAA0B,CAAC,CAAC,CAAC,CAAC;AAElC,MAAM,MAAM,sBAAsB,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,GAAG,oBAAoB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;CAAE,CAAC;AACvF,MAAM,MAAM,mBAAmB,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,GAAG,iBAAiB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;CAAE,CAAC;AAEjF,MAAM,MAAM,uBAAuB,CAAC,CAAC,IAAI;IACvC,IAAI,EAAE,QAAQ,CAAC;IACf,UAAU,EAAE,mBAAmB,CAAC,CAAC,CAAC,CAAC;CACpC,CAAC;AACF,MAAM,MAAM,0BAA0B,CAAC,CAAC,IAAI;IAC1C,IAAI,EAAE,QAAQ,CAAC;IACf,UAAU,EAAE,sBAAsB,CAAC,CAAC,CAAC,CAAC;CACvC,CAAC;AAEF,eAAO,MAAM,iBAAiB;;;CAG7B,CAAC;AAoBF,eAAO,MAAM,UAAU,EAAE,eAsGvB,CAAC;AAOH,KAAK,UAAU,CAAC,CAAC,SAAS,IAAI,IAAI,mBAAmB,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC;AAChE,KAAK,eAAe,GAAG;KACpB,CAAC,IAAI,IAAI,CAAC,MAAM,CAAC,GAAG,UAAU,CAAC,OAAO,CAAC,IAAI,EAAE;QAAE,IAAI,EAAE,CAAC,CAAA;KAAE,CAAC,CAAC;CAC5D,CAAC;AAIF,eAAO,MAAM,cAAc,oKAAuB,CAAC;AAEnD,wBAAgB,oBAAoB,CAAC,CAAC,SAAS,IAAI,EAAE,CAAC,SAAS,MAAM,CAAC,EACpE,IAAI,EAAE,CAAC,EACP,GAAG,EAAE,CAAC,GACL,oBAAoB,CAAC,CAAC,CAAC,CAIzB;AACD,wBAAgB,kBAAkB,CAAC,CAAC,SAAS,MAAM,EAAE,IAAI,EAAE,CAAC,GAAG,mBAAmB,CAAC,CAAC,CAAC,GAAG,IAAI,CAE3F"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@typespec/html-program-viewer",
-  "version": "0.72.0-dev.1",
+  "version": "0.72.0-dev.3",
   "author": "Microsoft Corporation",
   "description": "TypeSpec library for emitting an html view of the program.",
   "homepage": "https://typespec.io",