CodeMirror/budibase
1
0
Fork 0
mirror of synced 2024-09-18 18:28:33 +12:00
Code Issues Projects Releases Wiki Activity

Include block results when searching for components

Browse source
This commit is contained in:
Andrew Kingston 2022-06-07 15:08:46 +01:00
parent 6e83c96236
commit 153fc0d7af
1 changed files with 23 additions and 27 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

50
packages/builder/src/pages/builder/app/[application]/design/[screenId]/components/new/_components/NewComponentPanel.svelte
View file

@ -76,11 +76,9 @@
return [] return []
} }
// Split list into either components or blocks initially // Remove blocks if there is no search string
if (section === "components") { if (!search) {
structure = structure.filter(category => category.name !== "Blocks") structure = structure.filter(category => category.name !== "Blocks")
} else {
structure = structure.filter(category => category.name === "Blocks")
} }
// Return only items which match the search string // Return only items which match the search string
@ -159,33 +157,31 @@
borderRight borderRight
> >
<Layout paddingX="L" paddingY="XL" gap="S"> <Layout paddingX="L" paddingY="XL" gap="S">
<ActionGroup compact justified> <Search
<ActionButton placeholder="Search"
fullWidth value={searchString}
selected={section === "components"} on:change={e => (searchString = e.detail)}
on:click={() => (section = "components")}>Components</ActionButton bind:inputRef={searchRef}
> />
<ActionButton {#if !searchString}
fullWidth <ActionGroup compact justified>
selected={section === "blocks"} <ActionButton
on:click={() => (section = "blocks")}>Blocks</ActionButton fullWidth
> selected={section === "components"}
</ActionGroup> on:click={() => (section = "components")}>Components</ActionButton
>
<ActionButton
fullWidth
selected={section === "blocks"}
on:click={() => (section = "blocks")}>Blocks</ActionButton
>
</ActionGroup>
{/if}
</Layout> </Layout>
<div> <div>
<Divider noMargin noGrid /> <Divider noMargin noGrid />
</div> </div>
{#if section === "components"} {#if searchString || section === "components"}
<Layout paddingX="L" paddingY="XL">
<Search
placeholder="Search"
value={searchString}
on:change={e => (searchString = e.detail)}
bind:inputRef={searchRef}
/>
</Layout>
{/if}
{#if section === "components"}
{#each filteredStructure as category} {#each filteredStructure as category}
<DetailSummary name={category.name} collapsible={false}> <DetailSummary name={category.name} collapsible={false}>
<div class="component-grid"> <div class="component-grid">