Skip to content

Commit 7142a93

Browse files
authored
Merge pull request #2502 from hashicorp/alex-ju/super-select-custom-result-count-message
`SuperSelect::Multiple` - allow custom result count message
2 parents 4030b10 + f502329 commit 7142a93

File tree

5 files changed

+50
-1
lines changed

5 files changed

+50
-1
lines changed

.changeset/spotty-boxes-do.md

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
"@hashicorp/design-system-components": minor
3+
---
4+
5+
`SuperSelect::Multiple` - Added `@resultCountMessage` argument to enable override

packages/components/src/components/hds/form/super-select/multiple/base.ts

+4-1
Original file line numberDiff line numberDiff line change
@@ -55,7 +55,10 @@ export default class HdsFormSuperSelectMultipleBase extends Component<HdsFormSup
5555
}
5656

5757
get resultCountMessage(): string {
58-
return `${this.selectedCount} selected of ${this.optionsCount} total`;
58+
return (
59+
this.args.resultCountMessage ||
60+
`${this.selectedCount} selected of ${this.optionsCount} total`
61+
);
5962
}
6063

6164
@action calculatePosition(

showcase/app/templates/components/form/super-select.hbs

+19
Original file line numberDiff line numberDiff line change
@@ -859,6 +859,25 @@
859859
</SF.Item>
860860
</Shw::Flex>
861861

862+
<Shw::Text::H4>Custom result count message</Shw::Text::H4>
863+
864+
<Shw::Flex {{style padding-bottom="15em"}} @direction="row" as |SF|>
865+
<SF.Item>
866+
<Hds::Form::SuperSelect::Multiple::Base
867+
@resultCountMessage="{{@model.PLACES_OPTIONS.length}} total"
868+
@onChange={{fn (mut @model.SELECTED_PLACES_OPTIONS)}}
869+
@options={{@model.PLACES_OPTIONS}}
870+
@selected={{@model.SELECTED_PLACES_OPTIONS}}
871+
@initiallyOpened={{true}}
872+
@verticalPosition="below"
873+
@ariaLabel="Label"
874+
as |option|
875+
>
876+
{{option}}
877+
</Hds::Form::SuperSelect::Multiple::Base>
878+
</SF.Item>
879+
</Shw::Flex>
880+
862881
<Shw::Divider />
863882

864883
<Shw::Text::H2>Form::SuperSelect::Multiple::Field</Shw::Text::H2>

showcase/tests/integration/components/hds/form/super-select/multiple/base-test.js

+19
Original file line numberDiff line numberDiff line change
@@ -163,6 +163,25 @@ module(
163163
assert.dom('.hds-form-super-select__after-options').doesNotExist();
164164
});
165165

166+
test('it should render the default after options block with custom result count message when `@resultCountMessage` exists', async function (assert) {
167+
setOptionsData(this);
168+
await render(
169+
hbs`<Hds::Form::SuperSelect::Multiple::Base @onChange={{this.NOOP}} @options={{this.OPTIONS}} @resultCountMessage="custom result count message" as |option|>{{option}}</Hds::Form::SuperSelect::Multiple::Base>`
170+
);
171+
await click('.hds-form-super-select .ember-basic-dropdown-trigger');
172+
assert
173+
.dom(
174+
'.hds-form-super-select__after-options .hds-form-super-select__result-count'
175+
)
176+
.hasText('custom result count message');
177+
assert
178+
.dom('.hds-form-super-select__after-options .hds-button')
179+
.hasText('Show selected');
180+
assert
181+
.dom('.hds-form-super-select__after-options .hds-button')
182+
.doesNotHaveTextContaining('Clear selected');
183+
});
184+
166185
// MATCH TRIGGER WIDTH
167186

168187
test('`@matchTriggerWidth` should be true by default', async function (assert) {

website/docs/components/form/super-select/partials/code/component-api.md

+3
Original file line numberDiff line numberDiff line change
@@ -185,6 +185,9 @@ The default values of some [ember-power-select](https://ember-power-select.com/d
185185
<C.Property @name="afterOptionsContent" @type="string" @default="resultCountMessage">
186186
Sets the content of the default `afterOptions` component overriding the default content.
187187
</C.Property>
188+
<C.Property @name="resultCountMessage" @type="string">
189+
Overrides the default result count message. The default message follows this pattern: X selected of Y total.
190+
</C.Property>
188191
<C.Property @name="closeOnSelect" @type="boolean" @default="false">
189192
Defaults to true instead for `SuperSelect::Single`.
190193
</C.Property>

0 commit comments

Comments
 (0)