Skip to content

Commit

Permalink
fix(html): consolidate grid filter row rendering with a11y spec
Browse files Browse the repository at this point in the history
  • Loading branch information
@epetrow
epetrow committed Feb 19, 2024
1 parent b5f35af commit 4fcce30
Show file tree
Hide file tree
Showing 4 changed files with 62 additions and 62 deletions.
34 changes: 17 additions & 17 deletions packages/html/src/grid/tests/grid-filter-row-blazor.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ import { DropdownList } from '../../dropdownlist';
import { NumericTextbox } from '../../numerictextbox';
import { Textbox } from '../../textbox';
import { GridWithFilterRow, GridHeader, GridHeaderTable, GridHeaderCell, GridContainer, GridContent, GridTable, GridToolbar } from '../../grid';
import { TableThead, TableTbody, TableRow, TableTh, TableTd } from '../../table';
import { TableThead, TableTbody, TableRow, TableTd } from '../../table';


export default () =>(
Expand All @@ -31,12 +31,12 @@ export default () =>(
<GridHeaderCell colspan={1} columnTitle="Command"></GridHeaderCell>
</TableRow>
<TableRow className="k-filter-row">
<TableTh>
<TableTd>
<div className="k-filtercell">
<div className="k-filtercell-wrapper"></div>
</div>
</TableTh>
<TableTh>
</TableTd>
<TableTd>
<div className="k-filtercell">
<div className="k-filtercell-wrapper">
<NumericTextbox />
Expand All @@ -47,8 +47,8 @@ export default () =>(
</div>
</div>
</div>
</TableTh>
<TableTh>
</TableTd>
<TableTd>
<div className="k-filtercell">
<div className="k-filtercell-wrapper">
<Textbox showClearButton={false} value="p" />
Expand All @@ -59,12 +59,12 @@ export default () =>(
</div>
</div>
</div>
</TableTh>
<TableTh>
</TableTd>
<TableTd>
<div className="k-filtercell">
<div className="k-filtercell-wrapper"></div>
</div>
</TableTh>
</TableTd>
</TableRow>
</TableThead>
</GridHeaderTable>
Expand Down Expand Up @@ -154,12 +154,12 @@ export default () =>(
<GridHeaderCell colspan={1} columnTitle="Command"></GridHeaderCell>
</TableRow>
<TableRow className="k-filter-row">
<TableTh>
<TableTd>
<div className="k-filtercell">
<div className="k-filtercell-wrapper"></div>
</div>
</TableTh>
<TableTh>
</TableTd>
<TableTd>
<div className="k-filtercell">
<div className="k-filtercell-wrapper">
<NumericTextbox />
Expand All @@ -170,8 +170,8 @@ export default () =>(
</div>
</div>
</div>
</TableTh>
<TableTh>
</TableTd>
<TableTd>
<div className="k-filtercell">
<div className="k-filtercell-wrapper">
<Textbox showClearButton={false} value="p" />
Expand All @@ -182,12 +182,12 @@ export default () =>(
</div>
</div>
</div>
</TableTh>
<TableTh>
</TableTd>
<TableTd>
<div className="k-filtercell">
<div className="k-filtercell-wrapper"></div>
</div>
</TableTh>
</TableTd>
</TableRow>
</TableThead>
</GridHeaderTable>
Expand Down
38 changes: 19 additions & 19 deletions packages/html/src/grid/tests/grid-filter-row.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ import { NumericTextbox } from '../../numerictextbox';
import { Textbox } from '../../textbox';
import { TimePicker } from '../../timepicker';
import { Grid, GridHeader, GridHeaderTable, GridWithFilterRow } from '../../grid';
import { TableThead, TableRow, TableTh } from '../../table';
import { TableThead, TableRow, TableTd } from '../../table';

export default () =>(
<>
Expand All @@ -25,15 +25,15 @@ export default () =>(
</colgroup>
<TableThead>
<TableRow className="k-filter-row">
<TableTh>
<TableTd>
<span className="k-filtercell">
<span>
<ColorPicker />
<DropdownList className="k-dropdown-operator" arrowIconName="filter" />
<Button icon="filter-clear" disabled></Button>
</span>
</span>
</TableTh>
</TableTd>
</TableRow>
</TableThead>
</GridHeaderTable>
Expand All @@ -54,15 +54,15 @@ export default () =>(
</colgroup>
<TableThead>
<TableRow className="k-filter-row">
<TableTh>
<TableTd>
<span className="k-filtercell">
<span>
<Autocomplete placeholder="Autocomplete..." />
<DropdownList className="k-dropdown-operator" arrowIconName="filter" />
<Button icon="filter-clear" disabled></Button>
</span>
</span>
</TableTh>
</TableTd>
</TableRow>
</TableThead>
</GridHeaderTable>
Expand All @@ -81,15 +81,15 @@ export default () =>(
</colgroup>
<TableThead>
<TableRow className="k-filter-row">
<TableTh>
<TableTd>
<span className="k-filtercell">
<span>
<Combobox placeholder="Combobox..." />
<DropdownList className="k-dropdown-operator" arrowIconName="filter" />
<Button icon="filter-clear" disabled></Button>
</span>
</span>
</TableTh>
</TableTd>
</TableRow>
</TableThead>
</GridHeaderTable>
Expand All @@ -108,15 +108,15 @@ export default () =>(
</colgroup>
<TableThead>
<TableRow className="k-filter-row">
<TableTh>
<TableTd>
<span className="k-filtercell">
<span>
<DropdownList placeholder="DropdownList..." />
<DropdownList className="k-dropdown-operator" arrowIconName="filter" />
<Button icon="filter-clear" disabled></Button>
</span>
</span>
</TableTh>
</TableTd>
</TableRow>
</TableThead>
</GridHeaderTable>
Expand All @@ -135,15 +135,15 @@ export default () =>(
</colgroup>
<TableThead>
<TableRow className="k-filter-row">
<TableTh>
<TableTd>
<span className="k-filtercell">
<span>
<NumericTextbox placeholder="Numeric..." />
<DropdownList className="k-dropdown-operator" arrowIconName="filter" />
<Button icon="filter-clear" disabled></Button>
</span>
</span>
</TableTh>
</TableTd>
</TableRow>
</TableThead>
</GridHeaderTable>
Expand All @@ -162,15 +162,15 @@ export default () =>(
</colgroup>
<TableThead>
<TableRow className="k-filter-row">
<TableTh>
<TableTd>
<span className="k-filtercell">
<span>
<Textbox placeholder="Textbox..." />
<DropdownList className="k-dropdown-operator" arrowIconName="filter" />
<Button icon="filter-clear" disabled></Button>
</span>
</span>
</TableTh>
</TableTd>
</TableRow>
</TableThead>
</GridHeaderTable>
Expand All @@ -191,15 +191,15 @@ export default () =>(
</colgroup>
<TableThead>
<TableRow className="k-filter-row">
<TableTh>
<TableTd>
<span className="k-filtercell">
<span>
<DatePicker placeholder="Datepicker..." />
<DropdownList className="k-dropdown-operator" arrowIconName="filter" />
<Button icon="filter-clear" disabled></Button>
</span>
</span>
</TableTh>
</TableTd>
</TableRow>
</TableThead>
</GridHeaderTable>
Expand All @@ -218,15 +218,15 @@ export default () =>(
</colgroup>
<TableThead>
<TableRow className="k-filter-row">
<TableTh>
<TableTd>
<span className="k-filtercell">
<span>
<TimePicker placeholder="TimePicker..." />
<DropdownList className="k-dropdown-operator" arrowIconName="filter" />
<Button icon="filter-clear" disabled></Button>
</span>
</span>
</TableTh>
</TableTd>
</TableRow>
</TableThead>
</GridHeaderTable>
Expand All @@ -245,15 +245,15 @@ export default () =>(
</colgroup>
<TableThead>
<TableRow className="k-filter-row">
<TableTh>
<TableTd>
<span className="k-filtercell">
<span>
<DateTimePicker placeholder="DateTimePicker..." />
<DropdownList className="k-dropdown-operator" arrowIconName="filter" />
<Button icon="filter-clear" disabled></Button>
</span>
</span>
</TableTh>
</TableTd>
</TableRow>
</TableThead>
</GridHeaderTable>
Expand Down
26 changes: 13 additions & 13 deletions packages/html/src/grid/tests/grid-size-sm-comp-sm.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import { GridNormal, GridContainer, GridContent, GridHeader, GridTable, GridHeaderTable, GridHeaderCell, GridPager, GridToolbar, GridGroupingHeader } from '../../grid';
import { TableThead, TableTh, TableRow, TableTbody, TableTd } from '../../table';
import { TableThead, TableRow, TableTbody, TableTd } from '../../table';
import { Button } from '../../button';
import { Checkbox } from '../../checkbox';
import { Chip, ChipAction, ChipList } from '../../chip';
Expand Down Expand Up @@ -101,12 +101,12 @@ export default () =>(
<GridHeaderCell columnTitle="Sorted" menu="filter" sortable></GridHeaderCell>
</TableRow>
<TableRow className="k-filter-row">
<TableTh>
<TableTd>
<div className="k-filtercell">
<div className="k-filtercell-wrapper"></div>
</div>
</TableTh>
<TableTh>
</TableTd>
<TableTd>
<div className="k-filtercell">
<div className="k-filtercell-wrapper">
<NumericTextbox size="small" />
Expand All @@ -117,8 +117,8 @@ export default () =>(
</div>
</div>
</div>
</TableTh>
<TableTh>
</TableTd>
<TableTd>
<div className="k-filtercell">
<div className="k-filtercell-wrapper">
<Textbox size="small" showClearButton={false} value="p" />
Expand All @@ -129,8 +129,8 @@ export default () =>(
</div>
</div>
</div>
</TableTh>
<TableTh>
</TableTd>
<TableTd>
<div className="k-filtercell">
<div className="k-filtercell-wrapper">
<Textbox size="small" showClearButton={false} value="p" />
Expand All @@ -141,8 +141,8 @@ export default () =>(
</div>
</div>
</div>
</TableTh>
<TableTh>
</TableTd>
<TableTd>
<div className="k-filtercell">
<div className="k-filtercell-wrapper">
<Textbox size="small" showClearButton={false} value="p" />
Expand All @@ -153,12 +153,12 @@ export default () =>(
</div>
</div>
</div>
</TableTh>
<TableTh>
</TableTd>
<TableTd>
<div className="k-filtercell">
<div className="k-filtercell-wrapper"></div>
</div>
</TableTh>
</TableTd>
</TableRow>
</TableThead>
</GridHeaderTable>
Expand Down
Loading

0 comments on commit 4fcce30

Please sign in to comment.