1.1.80 • Published 9 months ago

@fluid-topics/ft-search-bar v1.1.80

Weekly downloads
-
License
ISC
Repository
-
Last release
9 months ago

A search bar component using Fluid Topics public API.

The search bar requires the Fluid Topics public API and Material Icon font to be imported independently.

Install

Javascript

npm install @fluid-topics/ft-search-bar
yarn add @fluid-topics/ft-search-bar

HTML

To be placed at the end of HTML body:

<script src="https://cdn.jsdelivr.net/npm/@fluid-topics/public-api/dist/fluidtopics.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@fluid-topics/ft-search-bar/build/ft-search-bar.min.js"></script>

Usage

Lit

import { html } from "lit"
import "@fluid-topics/public-api/dist/fluidtopics.min.js"
import "@fluid-topics/ft-search-bar"

function render() {
    return html` 
        <ft-search-bar 
            baseUrl="http://doc.fluidtopics.com"
            .displayedFilters=${ [ "Version_FT", "Category", "Platform", "audience" ] }
            @change=${ (e: SearchStateChangeEvent) => console.log("Search state change:", e.detail) }
            @launch-search=${ (e: LaunchSearchEvent) => console.log("Launch search:", e.detail) }
        ></ft-search-bar> 
    `
}

HTML

<html lang="en">
<head>
    <title>My custom integration</title>
    <link href="http://doc.fluidtopics.com/api/stylesheets/fonts.css" rel="stylesheet">
    <link href="http://doc.fluidtopics.com/api/stylesheets/theme.css" rel="stylesheet">
</head>
<body>
    <ft-search-bar
            baseUrl="http://doc.fluidtopics.com"
            displayedfilters="[&quot;Version_FT&quot;,&quot;Category&quot;,&quot;Platform&quot;,&quot;audience&quot;]"
    ></ft-search-bar>

    <script src="https://cdn.jsdelivr.net/npm/@fluid-topics/public-api/dist/fluidtopics.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/@fluid-topics/ft-search-bar/build/ft-search-bar.min.js"></script>
    <script>
        const searchBar = document.querySelector('ft-search-bar');
        searchBar.setAttribute("labels", JSON.stringify({
                                                            filtersButton: "Refine your search",
                                                            inputPlaceHolder: "Search our documentation"
                                                        }));
        searchBar.addEventListener("launch-search", event => {
            console.log("Launch search:", event.detail)
            console.log("URL:", searchBar.searchRequestSerializer(event.detail))
        });
    </script>
</body>
</html>
Lit
@fluid-topics/ft-accordion@fluid-topics/ft-app-context@fluid-topics/ft-button@fluid-topics/ft-chip@fluid-topics/ft-filter@fluid-topics/ft-icon@fluid-topics/ft-select@fluid-topics/ft-size-watcher@fluid-topics/ft-skeleton@fluid-topics/ft-snap-scroll@fluid-topics/ft-tooltip@fluid-topics/ft-typography@fluid-topics/ft-wc-utilslit
1.1.78

9 months ago

1.1.77

9 months ago

1.1.79

9 months ago

1.1.80

9 months ago

1.1.76

9 months ago

1.1.75

9 months ago

1.1.70

9 months ago

1.1.74

9 months ago

1.1.73

9 months ago

1.1.72

9 months ago

1.1.71

9 months ago

1.1.69

10 months ago

1.1.68

10 months ago

1.1.67

10 months ago

1.1.66

10 months ago

1.1.65

10 months ago

1.1.63

10 months ago

1.1.62

10 months ago

1.1.64

10 months ago

1.1.61

11 months ago

1.1.52

12 months ago

1.1.51

12 months ago

1.1.50

12 months ago

1.1.56

11 months ago

1.1.55

12 months ago

1.1.54

12 months ago

1.1.53

12 months ago

1.1.59

11 months ago

1.1.58

11 months ago

1.1.57

11 months ago

1.1.60

11 months ago

1.1.39

1 year ago

1.1.41

1 year ago

1.1.40

1 year ago

1.1.45

1 year ago

1.1.44

1 year ago

1.1.43

1 year ago

1.1.42

1 year ago

1.1.49

12 months ago

1.1.48

1 year ago

1.1.47

1 year ago

1.1.46

1 year ago

1.1.38

1 year ago

1.1.37

1 year ago

1.1.36

1 year ago

1.1.35

1 year ago

1.1.34

1 year ago

1.1.33

1 year ago

1.1.32

1 year ago

1.1.31

1 year ago

1.1.29

1 year ago

1.1.30

1 year ago

1.1.28

1 year ago

1.1.27

1 year ago

1.1.26

1 year ago

1.1.25

1 year ago

1.1.24

1 year ago

1.1.23

1 year ago

1.1.22

1 year ago

1.1.21

1 year ago

1.1.20

1 year ago

1.1.19

1 year ago

1.1.18

1 year ago

1.1.17

1 year ago

1.1.16

1 year ago

1.1.15

1 year ago

1.1.14

1 year ago

1.1.13

1 year ago

1.1.12

1 year ago

1.1.11

1 year ago

1.1.10

1 year ago

1.1.9

2 years ago

1.1.8

2 years ago

1.1.7

2 years ago

1.1.6

2 years ago

1.1.5

2 years ago

1.1.4

2 years ago

1.1.3

2 years ago

1.1.2

2 years ago

1.1.1

2 years ago

1.0.63

2 years ago

1.1.0

2 years ago

1.0.62

2 years ago

1.0.61

2 years ago

1.0.60

2 years ago

1.0.39

2 years ago

1.0.38

2 years ago

1.0.40

2 years ago

1.0.44

2 years ago

1.0.43

2 years ago

1.0.42

2 years ago

1.0.41

2 years ago

1.0.48

2 years ago

1.0.47

2 years ago

1.0.46

2 years ago

1.0.45

2 years ago

1.0.49

2 years ago

1.0.51

2 years ago

1.0.50

2 years ago

1.0.55

2 years ago

1.0.54

2 years ago

1.0.53

2 years ago

1.0.52

2 years ago

1.0.59

2 years ago

1.0.58

2 years ago

1.0.57

2 years ago

1.0.56

2 years ago

1.0.19

2 years ago

1.0.18

2 years ago

1.0.22

2 years ago

1.0.21

2 years ago

1.0.20

2 years ago

1.0.26

2 years ago

1.0.25

2 years ago

1.0.24

2 years ago

1.0.23

2 years ago

1.0.29

2 years ago

1.0.28

2 years ago

1.0.27

2 years ago

1.0.33

2 years ago

1.0.31

2 years ago

1.0.30

2 years ago

1.0.37

2 years ago

1.0.36

2 years ago

1.0.35

2 years ago

1.0.34

2 years ago

1.0.17

2 years ago

1.0.16

2 years ago

1.0.15

2 years ago

1.0.14

2 years ago

1.0.13

2 years ago

1.0.12

2 years ago

0.3.71

2 years ago

0.3.70

2 years ago

1.0.0-alpha.1

2 years ago

1.0.0-alpha.0

2 years ago

0.3.64

2 years ago

0.3.63

2 years ago

0.3.62

2 years ago

0.3.61

2 years ago

0.3.60

2 years ago

0.3.69

2 years ago

0.3.68

2 years ago

0.3.67

2 years ago

0.3.66

2 years ago

0.3.65

2 years ago

0.3.58

2 years ago

1.0.1

2 years ago

1.0.0

2 years ago

1.0.9

2 years ago

1.0.8

2 years ago

1.0.7

2 years ago

1.0.5

2 years ago

1.0.4

2 years ago

1.0.3

2 years ago

1.0.11

2 years ago

1.0.10

2 years ago

0.3.57

2 years ago

0.3.56

2 years ago

0.3.55

2 years ago

0.3.53

2 years ago

0.3.52

2 years ago

0.3.54

2 years ago

0.3.51

2 years ago

0.3.50

2 years ago

0.3.49

2 years ago

0.3.48

2 years ago

0.3.47

2 years ago

0.3.46

2 years ago

0.3.31

3 years ago

0.3.30

3 years ago

0.3.39

3 years ago

0.3.38

3 years ago

0.3.37

3 years ago

0.3.36

3 years ago

0.3.35

3 years ago

0.3.34

3 years ago

0.3.33

3 years ago

0.3.32

3 years ago

0.3.20

3 years ago

0.3.28

3 years ago

0.3.27

3 years ago

0.3.26

3 years ago

0.3.25

3 years ago

0.3.24

3 years ago

0.3.23

3 years ago

0.3.22

3 years ago

0.3.21

3 years ago

0.3.19

3 years ago

0.3.40

3 years ago

0.3.45

3 years ago

0.3.43

3 years ago

0.3.18

3 years ago

0.3.8

3 years ago

0.3.7

3 years ago

0.3.9

3 years ago

0.3.17

3 years ago

0.3.16

3 years ago

0.3.15

3 years ago

0.3.14

3 years ago

0.3.13

3 years ago

0.3.12

3 years ago

0.3.11

3 years ago

0.3.6

3 years ago

0.3.5

3 years ago

0.3.4

3 years ago

0.3.3

3 years ago

0.2.22

3 years ago

0.2.21

3 years ago

0.2.20

3 years ago

0.2.19

3 years ago

0.2.18

3 years ago

0.2.17

3 years ago

0.2.16

3 years ago

0.2.15

3 years ago

0.2.14

3 years ago

0.2.13

3 years ago

0.2.11

3 years ago

0.3.0

3 years ago

0.3.2

3 years ago

0.3.1

3 years ago

0.2.10

3 years ago

0.2.7

3 years ago

0.2.6

3 years ago

0.2.9

3 years ago

0.2.8

3 years ago

0.2.4

3 years ago

0.2.1

3 years ago

0.2.0

3 years ago

0.1.18

3 years ago

0.2.3

3 years ago

0.2.2

3 years ago

0.1.14

3 years ago

0.1.15

3 years ago

0.1.16

3 years ago

0.1.17

3 years ago

0.1.10

3 years ago

0.1.11

3 years ago

0.1.12

3 years ago

0.1.13

3 years ago

0.1.8

3 years ago

0.1.9

3 years ago

0.1.2

3 years ago

0.1.1

3 years ago

0.1.7

3 years ago

0.1.3

3 years ago

0.1.6

3 years ago

0.1.5

3 years ago

0.1.0

3 years ago

0.0.88

3 years ago