ios – When eradicating a ToolbarItem from the navigation bar, how do I make the remaining ToolbarItems resize accurately?

As a result of .searchable doesn’t permit for customizing buttons within the search bar, I’ve manually needed to recreate the search bar as proven under. Nonetheless, when eradicating one of many objects within the search bar, the TextField doesn’t resize accurately and successfully inserts padding on the forefront. When the TextField is targeted, it resizes and fills your entire area. If the “Compose” button was already hidden when the search bar is introduced, it lays out accurately. How do I resize the TextField after eradicating the “Compose” button routinely?

Thanks,
jjp

struct ContentView: View {
    @State var isSearchBarVisible = false
    @State var isComposingMessage = false
    @State var searchText = ""

    let objects: [String] = ["hey", "there", "how", "are", "you"]

    var searchItems: [String] {
        objects.filter { merchandise in
            merchandise.lowercased().comprises(searchText.lowercased())
        }
    }

    var physique: some View {
        NavigationStack {
            VStack {
                Record {
                    if !searchText.isEmpty {
                        ForEach(searchItems, id: .self) { merchandise in
                            Textual content(merchandise)
                        }
                    } else {
                        ForEach(objects, id: .self) { merchandise in
                            Textual content(merchandise)
                        }
                    }
                }
            }
            .toolbar {
                if isSearchBarVisible {
                    ToolbarItem(placement: .principal) {
                        TextField("Search", textual content: $searchText)
                            .padding(8)
                            .background(Colour.grey.opacity(0.2))
                    }
                    ToolbarItem(placement: .topBarTrailing) {
                        Button(motion: {
                            isSearchBarVisible = false
                        },[![enter image description here][1]][1]
                               label: {
                            Textual content("Cancel")
                        })
                    }
                    if !isComposingMessage {
                        ToolbarItem(placement: .topBarTrailing) {
                            Button(motion: {
                                isComposingMessage.toggle()
                            },
                                   label: {
                                Textual content("Compose")
                            })
                        }
                    }
                }
                else {
                    ToolbarItem(placement: .topBarLeading) {
                        Button(motion: {
                            isSearchBarVisible = true
                        },
                               label: {
                            Textual content("Search")
                        })
                    }
                    ToolbarItem(placement: .principal) {
                        Textual content("Title")
                    }
                    ToolbarItem(placement: .topBarTrailing) {
                        Button(motion: {
                            isComposingMessage.toggle()
                        },
                               label: {
                            Textual content("Compose")
                        })
                    }
                }
            }
        }
    }
}