|
2 | 2 |
|
3 | 3 | <!-- Auto Generated Below --> |
4 | 4 |
|
5 | | - |
6 | 5 | ## Properties |
7 | 6 |
|
8 | | -| Property | Attribute | Description | Type | Default | |
9 | | -| ------------------------ | -------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------- | ----------- | |
10 | | -| `getUrlText` | -- | Callback function that returns the text body of a response that corresponds to an HTTP GET request for the given URL. For example, it would be the result of [Response.text()](https://developer.mozilla.org/en-US/docs/Web/API/Response/text). | `(url: string) => Promise<string>` | `undefined` | |
11 | | -| `handleQuery` | -- | Required callback function which is responsible for taking a given GraphQL query document and returns a Promise that resolves to a JavaScript object corresponding to the body of the associated network request, same as what would be produced by [Response.json()](https://developer.mozilla.org/en-US/docs/Web/API/Response/json). The query document is compliant with the GraphQL API at [api.fontawesome.com](https://fontawesome.com/v5.15/how-to-use/graphql-api/intro/getting-started). The implementation is responsible for handling any authorization that may be necessary to fulfill the request. For example, any time a kit is used to drive the Icon Chooser, it will be necessary to authorize GraphQL API requests sent to api.fontawesome.com with the [`kits_read` scope](https://fontawesome.com/v5.15/how-to-use/graphql-api/auth/scopes). | `(document: string, variables?: object, options?: object) => Promise<any>` | `undefined` | |
12 | | -| `kitToken` | `kit-token` | A kit token identifying a kit in which to find icons. Takes precedent over version prop if both are present. | `string` | `undefined` | |
13 | | -| `searchInputPlaceholder` | `search-input-placeholder` | Placeholder text for search form. Use this to provide translatable text. | `string` | `undefined` | |
14 | | -| `version` | `version` | Version to use for finding and loading icons when kitToken is not provided. Must be a valid semantic version, as parsed by the [semver NPM](https://www.npmjs.com/package/semver), like 5.5.13 or 6.0.0-beta1. | `string` | `undefined` | |
15 | | - |
| 7 | +| Property | Attribute | Description | Type | Default | |
| 8 | +| ------------------------ | -------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | -------------------------------------------------------------------------- | ----------- | |
| 9 | +| `getUrlText` | -- | Callback function that returns the text body of a response that corresponds to an HTTP GET request for the given URL. For example, it would be the result of [Response.text()](https://developer.mozilla.org/en-US/docs/Web/API/Response/text). | `(url: string) => Promise<string>` | `undefined` | |
| 10 | +| `handleQuery` | -- | Required callback function which is responsible for taking a given GraphQL query document and returns a Promise that resolves to a JavaScript object corresponding to the body of the associated network request, same as what would be produced by [Response.json()](https://developer.mozilla.org/en-US/docs/Web/API/Response/json). The query document is compliant with the GraphQL API at [api.fontawesome.com](https://fontawesome.com/v5.15/how-to-use/graphql-api/intro/getting-started). The implementation is responsible for handling any authorization that may be necessary to fulfill the request. For example, any time a kit is used to drive the Icon Chooser, it will be necessary to authorize GraphQL API requests sent to api.fontawesome.com with the [`kits_read` scope](https://fontawesome.com/v5.15/how-to-use/graphql-api/auth/scopes). | `(document: string, variables?: object, options?: object) => Promise<any>` | `undefined` | |
| 11 | +| `kitToken` | `kit-token` | A kit token identifying a kit in which to find icons. Takes precedent over version prop if both are present. | `string` | `undefined` | |
| 12 | +| `searchInputPlaceholder` | `search-input-placeholder` | Placeholder text for search form. Use this to provide translatable text. | `string` | `undefined` | |
| 13 | +| `version` | `version` | Version to use for finding and loading icons when kitToken is not provided. Must be a valid semantic version, as parsed by the [semver NPM](https://www.npmjs.com/package/semver), like 5.5.13 or 6.0.0-beta1. | `string` | `undefined` | |
16 | 14 |
|
17 | 15 | ## Events |
18 | 16 |
|
19 | | -| Event | Description | Type | |
20 | | -| -------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------- | |
21 | | -| `finish` | Clients of the Icon Chooser should listen for this event in order to handle the result of the user's interaction. The emitted `IconChooserResult` will not include SVG data (as an `IconDefinition`) when prohibited by the client's license. License terms for SVG icon data emitted are governed by the terms on the Font Awesome [plans page](https://fontawesome.com/plans), which are elaborated on the Font Awesome [support page](https://fontawesome.com/support). | `CustomEvent<IconDefinition \| IconLookup>` | |
22 | | - |
| 17 | +| Event | Description | Type | |
| 18 | +| -------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------- | |
| 19 | +| `finish` | Clients of the Icon Chooser should listen for this event in order to handle the result of the user's interaction. The emitted `IconChooserResult` will not include SVG data (as an `IconDefinition`) when prohibited by the client's license. License terms for SVG icon data emitted are governed by the terms on the Font Awesome [plans page](https://fontawesome.com/plans), which are elaborated on the Font Awesome [support page](https://fontawesome.com/support). | `CustomEvent<IconDefinition \| IconLookup>` | |
23 | 20 |
|
24 | 21 | ## Slots |
25 | 22 |
|
|
42 | 39 | | `"start-view-heading"` | heading for message on default view before search | |
43 | 40 | | `"suggest-icon-upload"` | message suggesting to try uploading a custom icon to a kit | |
44 | 41 |
|
45 | | - |
46 | 42 | ## Dependencies |
47 | 43 |
|
48 | 44 | ### Depends on |
49 | 45 |
|
50 | 46 | - [fa-icon](../fa-icon) |
51 | 47 |
|
52 | 48 | ### Graph |
| 49 | + |
53 | 50 | ```mermaid |
54 | 51 | graph TD; |
55 | 52 | fa-icon-chooser --> fa-icon |
56 | 53 | style fa-icon-chooser fill:#f9f,stroke:#333,stroke-width:4px |
57 | 54 | ``` |
58 | 55 |
|
59 | | ----------------------------------------------- |
| 56 | +--- |
60 | 57 |
|
61 | | -*Built with [StencilJS](https://stenciljs.com/)* |
| 58 | +_Built with [StencilJS](https://stenciljs.com/)_ |
0 commit comments