Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
489 changes: 489 additions & 0 deletions docs/docset.yml

Large diffs are not rendered by default.

36 changes: 36 additions & 0 deletions docs/reference/advanced-usage.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,36 @@
---
navigation_title: "Advanced usage"
mapped_pages:
- https://www.elastic.co/guide/en/search-ui/current/guides-using-with-vue-js.html
---

# Using with Vue.js [guides-using-with-vue-js]


While Search UI doesn’t have a component library for Vue.js, you can still use them together, just with a little extra work.

To achieve that you’ll need to import and work directly with Search UI Core API. Read a short [API reference](/reference/api-reference.md) guide for high-level overview on the approach.

Once you’re familiar with the concept of Search UI core, the following docs will give you deeper dive into available APIs:

* [Core API](/reference/api-core-configuration.md)
* [State](/reference/api-core-state.md)
* [Actions](/reference/api-core-actions.md)


## Example [guides-using-with-vue-js-example]

The following demo is a good starting point for your Search UI implementation. The source code is available on GitHub: [https://github.com/elastic/search-ui/tree/main/examples/vue](https://github.com/elastic/search-ui/tree/main/examples/vue)

:::{tip}
Check out our Vue.js integration demo in [CodeSandbox](https://codesandbox.io/embed/github/elastic/search-ui/tree/main/examples/vue).

The example demonstrates how to implement Search UI in a Vue.js application.
:::







67 changes: 67 additions & 0 deletions docs/reference/api-connectors-app-search.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,67 @@
---
navigation_title: "Connectors API"
mapped_pages:
- https://www.elastic.co/guide/en/search-ui/current/api-connectors-app-search.html
---

# App Search Connector [api-connectors-app-search]


::::{admonition} Deprecation Notice
:class: important

App Search connector for Search UI is deprecated and will no longer be supported. Please migrate to [Elasticsearch Connector](/reference/tutorials-elasticsearch.md) for continued support.

::::


This Connector is used to connect Search UI to Elastic’s [App Search](https://www.elastic.co/cloud/app-search-service) API.


## Usage [api-connectors-app-search-usage]

```shell
npm install --save @elastic/search-ui-app-search-connector
```

```js
import AppSearchAPIConnector from "@elastic/search-ui-app-search-connector";

const connector = new AppSearchAPIConnector({
searchKey: "search-371auk61r2bwqtdzocdgutmg",
engineName: "search-ui-examples",
endpointBase: "http://127.0.0.1:3002"
});
```


### Additional options [api-connectors-app-search-additional-options]

Additional options will be passed through to the underlying [APIclient](https://github.com/elastic/app-search-javascript). Any valid parameter of the client can be used.

```js
const connector = new AppSearchAPIConnector({
searchKey: "search-371auk61r2bwqtdzocdgutmg",
engineName: "search-ui-examples",
endpointBase: "http://127.0.0.1:3002",
cacheResponses: false
});
```


## Options [api-connectors-app-search-options]

| Param | Description |
| --- | --- |
| searchKey | Required. String. Credential found in your App Search Dashboard |
| engineName | Required. String. Engine to query, found in your App Search Dashboard |
| endpointBase | Required. String. Endpoint path, found in your App Search Dashboard |
| cacheResponses | Optional. Boolean. Default is true. By default, connector will keep an in browser memory result cache of previous requests. |
| hostIdentifier | Optional. Useful when proxying the Swiftype API or developing against a local API server. |
| beforeSearchCall | Optional. A hook to amend query options before the request is sent to the API in a query on an "onSearch" event. |
| beforeAutocompleteResultsCall | Optional. A hook to amend query options before the request is sent to the API in a "results" query on an "onAutocomplete" event. |
| beforeAutocompleteSuggestionsCall | Optional. A hook to amend query options before the request is sent to the API in a "suggestions" query on an "onAutocomplete" event. |




Loading