<div>
<!-- A barebones version of the directive -->
<cp-select-sort id="basic"
sort-meta="meta"
sort-fields="sortFields">
Title
</cp-select-sort>
<!-- A version with multiple common options -->
<cp-select-sort id="common"
sort-meta="meta"
sort-fields="sortFields"
onsort="sortHandler"
default-field="field_1"
default-dir="desc"
id-suffix="test-suffix"
label="test-label">
Title
</cp-select-sort>
<!-- Both default attributes set -->
<cp-select-sort id="allDefaults"
sort-meta="meta"
sort-fields="sortFields"
default-field="field_1"
default-dir="desc">
Title
</cp-select-sort>
<!-- Just default field is set -->
<cp-select-sort id="defaultField"
sort-meta="meta"
sort-fields="sortFields"
default-field="field_2">
Title
</cp-select-sort>
</div>