mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-07-24 17:32:15 +00:00
[ACS-4986] Advanced Search - New component for Tags and Location filters (#8655)
* [ACS-4986] SearchChipsAutocompleteComponent - minimal state * [ACS-4986] refactored components * [ACS-4986] documentation * [ACS-4986] i18n * [ACS-4986] versionIndex.md * [ACS-4986] unit tests * [ACS-4986] replaced function calls on pipe * [ACS-4986] linting * [ACS-4986] slight correction * [ACS-4986] missing types * [ACS-4986] space * [ACS-4986] moved pipe + docs & tests * [ACS-4986] changed pipe type * [ACS-4986] versionIndex.md * [ACS-4986] removed 'important' in styles * [ACS-4986] fixed code smell * [ACS-4986] linting
This commit is contained in:
Mykyta Maliarchuk
committed by
GitHub
GitHub
parent
5fafb0ea6f
commit
61d5aa965b
@@ -287,10 +287,12 @@ for more information about installing and using the source code.
|
||||
| [Rating component](content-services/components/rating.component.md) | Allows a user to add and remove rating to an item. | [Source](../lib/content-services/src/lib/social/rating.component.ts) |
|
||||
| [Search check list component](content-services/components/search-check-list.component.md) | Implements a checklist widget for the Search Filter component. | [Source](../lib/content-services/src/lib/search/components/search-check-list/search-check-list.component.ts) |
|
||||
| [Search Chip Input Component](content-services/components/search-chip-input.component.md) | Displays input for providing phrases display as "chips". | [Source](../lib/content-services/src/lib/search/components/search-chip-input/search-chip-input.component.ts) |
|
||||
| [Search Chip Autocomplete Input component](content-services/components/search-chip-autocomplete-input.component.md) | Displays an input with autocomplete options. | [Source](../lib/content-services/src/lib/search/components/search-chip-autocomplete-input/search-chip-autocomplete-input.component.ts) |
|
||||
| [Search Chip List Component](content-services/components/search-chip-list.component.md) | Displays search criteria as a set of "chips". | [Source](../lib/content-services/src/lib/search/components/search-chip-list/search-chip-list.component.ts) |
|
||||
| [Search control component](content-services/components/search-control.component.md) | Displays a input text that shows find-as-you-type suggestions. | [Source](../lib/content-services/src/lib/search/components/search-control.component.ts) |
|
||||
| [Search date range component](content-services/components/search-date-range.component.md) | Implements a search widget for the Search Filter component. | [Source](../lib/content-services/src/lib/search/components/search-date-range/search-date-range.component.ts) |
|
||||
| [Search datetime range component](content-services/components/search-datetime-range.component.md) | Implements a search widget for the Search Filter component. | [Source](../lib/content-services/src/lib/search/components/search-datetime-range/search-datetime-range.component.ts) |
|
||||
| [Search Filter Autocomplete Chips component](content-services/components/search-filter-autocomplete-chips.component.md) | Implements a search widget for the Search Filter component. | [Source](../lib/content-services/src/lib/search/components/search-filter-autocomplete-chips/search-filter-autocomplete-chips.component.ts) |
|
||||
| [Search Filter Chips component](content-services/components/search-filter-chips.component.md) | Represents a chip based container component for custom search and faceted search settings. | [Source](../lib/content-services/src/lib/search/components/search-filter-chips/search-filter-chips.component.ts) |
|
||||
| [Search Filter component](content-services/components/search-filter.component.md) | Represents a main container component for custom search and faceted search settings. | [Source](../lib/content-services/src/lib/search/components/search-filter/search-filter.component.ts) |
|
||||
| [Search Form component](content-services/components/search-form.component.md) | Search Form screenshot | [Source](../lib/content-services/src/lib/search/components/search-form/search-form.component.ts) |
|
||||
|
||||
@@ -0,0 +1,52 @@
|
||||
---
|
||||
Title: Search Chip Autocomplete Input component
|
||||
Added: v6.1.0
|
||||
Status: Active
|
||||
Last reviewed: 2023-06-13
|
||||
---
|
||||
|
||||
# [Search Chip Autocomplete Input component](../../../lib/content-services/src/lib/search/components/search-chip-autocomplete-input/search-chip-autocomplete-input.component.ts "Defined in search-chip-autocomplete-input.component.ts")
|
||||
|
||||
Represents an input with autocomplete options.
|
||||
|
||||
|
||||
|
||||
## Basic usage
|
||||
|
||||
```html
|
||||
<adf-search-chip-autocomplete-input
|
||||
[autocompleteOptions]="allOptions"
|
||||
[onReset$]="onResetObservable$"
|
||||
[allowOnlyPredefinedValues]="allowOnlyPredefinedValues"
|
||||
(optionsChanged)="onOptionsChange($event)">
|
||||
</adf-search-chip-autocomplete-input>
|
||||
```
|
||||
|
||||
### Properties
|
||||
|
||||
| Name | Type | Default value | Description |
|
||||
|---------------------------|--------------------------|----|-----------------------------------------------------------------------------------------------|
|
||||
| autocompleteOptions | `string[]` | [] | Options for autocomplete |
|
||||
| onReset$ | [`Observable`](https://rxjs.dev/guide/observable)`<void>` | | Observable that will listen to any reset event causing component to clear the chips and input |
|
||||
| allowOnlyPredefinedValues | boolean | true | A flag that indicates whether it is possible to add a value not from the predefined ones |
|
||||
|
||||
### Events
|
||||
|
||||
| Name | Type | Description |
|
||||
| ---- | ---- |-----------------------------------------------|
|
||||
| optionsChanged | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<string[]>` | Emitted when the selected options are changed |
|
||||
|
||||
## See also
|
||||
|
||||
- [Search Configuration Guide](../../user-guide/search-configuration-guide.md)
|
||||
- [Search Query Builder service](../services/search-query-builder.service.md)
|
||||
- [Search Widget Interface](../interfaces/search-widget.interface.md)
|
||||
- [Search Filter Autocomplete Chips component](search-filter-autocomplete-chips.component.md)
|
||||
- [Search Logical Filter component](search-logical-filter.component.md)
|
||||
- [Search check list component](search-check-list.component.md)
|
||||
- [Search date range component](search-date-range.component.md)
|
||||
- [Search number range component](search-number-range.component.md)
|
||||
- [Search radio component](search-radio.component.md)
|
||||
- [Search slider component](search-slider.component.md)
|
||||
- [Search text component](search-text.component.md)
|
||||
- [Search Chip Input component](search-chip-input.component.md)
|
||||
@@ -0,0 +1,67 @@
|
||||
---
|
||||
Title: Search Filter Autocomplete Chips component
|
||||
Added: v6.1.0
|
||||
Status: Active
|
||||
Last reviewed: 2023-06-13
|
||||
---
|
||||
|
||||
# [Search Filter Autocomplete Chips component](../../../lib/content-services/src/lib/search/components/search-filter-autocomplete-chips/search-filter-autocomplete-chips.component.ts "Defined in search-filter-autocomplete-chips.component.ts")
|
||||
|
||||
Implements a [search widget](../../../lib/content-services/src/lib/search/models/search-widget.interface.ts) consists of 1 input with autocomplete options representing conditions to form search query.
|
||||
|
||||
|
||||
|
||||
## Basic usage
|
||||
|
||||
```json
|
||||
{
|
||||
"search": {
|
||||
"categories": [
|
||||
{
|
||||
"id": "location",
|
||||
"name": "Location",
|
||||
"enabled": true,
|
||||
"component": {
|
||||
"selector": "autocomplete-chips",
|
||||
"settings": {
|
||||
"allowUpdateOnChange": false,
|
||||
"hideDefaultAction": true,
|
||||
"allowOnlyPredefinedValues": false,
|
||||
"field": "SITE",
|
||||
"options": [ "Option 1", "Option 2" ]
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### Settings
|
||||
|
||||
| Name | Type | Description |
|
||||
| ---- |----------|--------------------------------------------------------------------------------------------------------------------|
|
||||
| field | `string` | Field to apply the query to. Required value |
|
||||
| options | `string[]` | Predefined options for autocomplete |
|
||||
| allowOnlyPredefinedValues | `boolean` | Specifies whether the input values should only be from predefined |
|
||||
| allowUpdateOnChange | `boolean` | Enable/Disable the update fire event when text has been changed. By default is true |
|
||||
| hideDefaultAction | `boolean` | Show/hide the widget actions. By default is false |
|
||||
## Details
|
||||
|
||||
This component allows the user to choose filter options for the search query.
|
||||
See the [Search Chip Autocomplete Input component](search-chip-autocomplete-input.component.md) for more details.
|
||||
|
||||
## See also
|
||||
|
||||
- [Search Configuration Guide](../../user-guide/search-configuration-guide.md)
|
||||
- [Search Query Builder service](../services/search-query-builder.service.md)
|
||||
- [Search Widget Interface](../interfaces/search-widget.interface.md)
|
||||
- [Search Chip Autocomplete Input component](search-chip-autocomplete-input.component.md)
|
||||
- [Search Chip Input component](search-chip-input.component.md)
|
||||
- [Search check list component](search-check-list.component.md)
|
||||
- [Search date range component](search-date-range.component.md)
|
||||
- [Search number range component](search-number-range.component.md)
|
||||
- [Search radio component](search-radio.component.md)
|
||||
- [Search slider component](search-slider.component.md)
|
||||
- [Search text component](search-text.component.md)
|
||||
- [Search Logical Filter component](search-logical-filter.component.md)
|
||||
28
docs/content-services/pipes/is-included.pipe.md
Normal file
28
docs/content-services/pipes/is-included.pipe.md
Normal file
@@ -0,0 +1,28 @@
|
||||
---
|
||||
Title: Is Included pipe
|
||||
Added: v6.1.0
|
||||
Status: Active
|
||||
Last reviewed: 2023-06-13
|
||||
---
|
||||
|
||||
# [Is Included pipe](../../../lib/content-services/src/lib/pipes/is-included.pipe.ts "Defined in is-included.pipe.ts")
|
||||
|
||||
Checks if the provided value is contained in the provided array.
|
||||
|
||||
## Basic Usage
|
||||
|
||||
<!-- {% raw %} -->
|
||||
|
||||
```HTML
|
||||
<mat-option [disabled]="value | adfIsIncluded: arrayOfValues"</mat-option>
|
||||
```
|
||||
|
||||
<!-- {% endraw %} -->
|
||||
|
||||
## Details
|
||||
|
||||
The pipe takes the provided value and checks if that value is included in the provided array and returns the appropriate boolean value.
|
||||
|
||||
## See also
|
||||
|
||||
- [File upload error pipe](./file-upload-error.pipe.md)
|
||||
BIN
docs/docassets/images/search-chip-autocomplete-input.png
Normal file
BIN
docs/docassets/images/search-chip-autocomplete-input.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 10 KiB |
BIN
docs/docassets/images/search-filter-autocomplete-chips.png
Normal file
BIN
docs/docassets/images/search-filter-autocomplete-chips.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 13 KiB |
@@ -49,6 +49,9 @@ backend services have been tested with each released version of ADF.
|
||||
- [Use none component view encapsulation](eslint-angular/rules/use-none-component-view-encapsulation.md)
|
||||
- [Search Chip Input component](content-services/components/search-chip-input.component.md)
|
||||
- [Search Logical Filter component](content-services/components/search-logical-filter.component.md)
|
||||
- [Search Chip Autocomplete Input component](content-services/components/search-chip-autocomplete-input.component.md)
|
||||
- [Search Filter Autocomplete Chips component](content-services/components/search-filter-autocomplete-chips.component.md)
|
||||
- [Is Included pipe](content-services/pipes/is-included.pipe.md)
|
||||
|
||||
<!--v610 end-->
|
||||
|
||||
|
||||
Reference in New Issue
Block a user