Experience Cloudで顧客向けのパスを表示する方法

<template>
    <div class="path-container">
        <lightning-progress-indicator current-step={currentStatus} type="path">
            <template for:each={statusOptions} for:item="step">
                <lightning-progress-step
                    key={step.value}
                    label={step.label}
                    value={step.value}>
                </lightning-progress-step>
            </template>
        </lightning-progress-indicator>
    </div>
</template>

import { LightningElement, wire, api } from 'lwc';
import { getPicklistValues, getObjectInfo } from 'lightning/uiObjectInfoApi';
import { getRecord, getFieldValue } from 'lightning/uiRecordApi';
import CASE_OBJECT from '@salesforce/schema/Case';
import CASE_STATUS_FIELD from '@salesforce/schema/Case.InquiryStatus__c';

export default class pathComponent extends LightningElement {
    @api recordId;          // レコードId
    defaultRecordTypeId;    // レコードタイプId
    statusOptions;          // 問い合わせ状況項目の選択リスト値
    currentStatus;          // 現在の問い合わせ状況

    // レコードタイプIdを取得
    @wire( getObjectInfo, { objectApiName: CASE_OBJECT })
    wireObjectInfo({ error, data }){
        if( data ){
            this.defaultRecordTypeId = data.defaultRecordTypeId;
        } else if ( error ) {
            // handle error
        }
    }

    // 現在の問い合わせ状況項目値を取得
    @wire( getRecord, { recordId: '$recordId', fields: CASE_STATUS_FIELD })
    getRecordValues({ error, data }) {
        if( data ){
            this.currentStatus = getFieldValue( data, CASE_STATUS_FIELD );
        } else if( error ) {
            // handle error
        }
    }

    // 問い合わせ状況項目の選択リスト値を取得し、パスの矢羽として表示
    @wire( getPicklistValues, { recordTypeId: '$defaultRecordTypeId', fieldApiName: CASE_STATUS_FIELD })
    pickValues({ error, data }) {
        if( data ){
            this.statusOptions = data.values.map( item => {
                return {
                    label: item.label,
                    value: item.value
                }
            });
        } else if( error ) {
            // handle error
        }
    }
}

<?xml version="1.0" encoding="UTF-8"?>
<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata">
    <apiVersion>58.0</apiVersion>
    <isExposed>true</isExposed>
    <targets>
        <target>lightningCommunity__Page</target>
        <target>lightningCommunity__Page_Layout</target>
        <target>lightningCommunity__Default</target>
    </targets>
    <targetConfigs>
        <targetConfig targets="lightningCommunity__Default">
            <property name="recordId" type="String" label="Record ID" />
        </targetConfig>
    </targetConfigs>
</LightningComponentBundle>