Skip to content

Commit

Permalink
fix(ebay-table): update row-header attribute, removed aria-pressed
Browse files Browse the repository at this point in the history
  • Loading branch information
@WinkeeFace @agliga
WinkeeFace authored and agliga committed Jan 21, 2025
1 parent fb8ddec commit 7c39f9d
Show file tree
Hide file tree
Showing 13 changed files with 47 additions and 32 deletions.
5 changes: 5 additions & 0 deletions .changeset/poor-mirrors-float.md
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
"@ebay/ebayui-core": minor
---

fix(ebay-table): update row-header attribute, removed aria-pressed
9 changes: 3 additions & 6 deletions src/components/ebay-table/component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,13 +3,10 @@ import { WithNormalizedProps } from "../../global";
import { CheckboxEvent } from "../ebay-checkbox/component-browser";

export type TableSort = "asc" | "desc" | "none";

export interface TableHeader extends Omit<Marko.Input<"th">, `on${string}`> {
"column-type"?:
| "normal"
| "numeric"
| "row-header"
| "layout"
| "icon-action";
"column-type"?: "normal" | "numeric" | "layout" | "icon-action";
"row-header"?: boolean;
name?: string;
sort?: TableSort | boolean;
href?: AttrString;
Expand Down
2 changes: 1 addition & 1 deletion src/components/ebay-table/examples/default.marko
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import data from "./data.json";

<ebay-table ...input>
<@header column-type="row-header">
<@header row-header>
Seller
</@header>
<@header>Item</@header>
Expand Down
2 changes: 1 addition & 1 deletion src/components/ebay-table/examples/selection.marko
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import data from "./data.json";

<ebay-table mode="selection" on-select("emit", "select") ...input>
<@header column-type="row-header">
<@header row-header>
Seller
</@header>
<@header>Item</@header>
Expand Down
2 changes: 1 addition & 1 deletion src/components/ebay-table/examples/sort-client-side.marko
View file
Original file line number Diff line number Diff line change
Expand Up @@ -36,7 +36,7 @@ class {
}
}
<ebay-table on-sort("onSort") ...input>
<@header name="sellerCol" column-type="row-header">
<@header name="sellerCol" row-header>
Seller
</@header>
<@header name="itemCol">
Expand Down
2 changes: 1 addition & 1 deletion src/components/ebay-table/examples/sort-with-link.marko
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ import data from "./data.json";

<ebay-table ...input>
<@header
column-type="row-header"
row-header
sort=("asc" as const)
href="https://www.ebay.com"
>
Expand Down
2 changes: 1 addition & 1 deletion src/components/ebay-table/examples/sort.marko
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ class {
<ebay-table on-sort("onSort") ...input>
<@header
name="sellerCol"
column-type="row-header"
row-header
sort=(state.sorted.sellerCol || "none")
>
Seller
Expand Down
2 changes: 1 addition & 1 deletion src/components/ebay-table/examples/with-actions.marko
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import data from "./data.json";

<ebay-table ...input>
<@header column-type="row-header">
<@header row-header>
Seller
</@header>
<@header>Item</@header>
Expand Down
7 changes: 3 additions & 4 deletions src/components/ebay-table/index.marko
View file
Original file line number Diff line number Diff line change
Expand Up @@ -41,6 +41,7 @@ $ const {
<for|header, headerIndex| of=headers>
$ const {
columnType = "normal",
rowHeader,
class: thClass,
name = `${headerIndex}`,
sort,
Expand Down Expand Up @@ -73,9 +74,7 @@ $ const {
sortEleAttr = { href };
} else if (sortOrder) {
sortEleAttr = {
type: "button",
"aria-pressed":
sortOrder !== "none" ? "true" : "false",
type: "button"
};
}
<${href ? "a" : sortOrder ? "button" : null}
Expand Down Expand Up @@ -136,7 +135,7 @@ $ const {
) &&
`table-cell--${header.columnType}`,
];
<${header.columnType === "row-header" ? "th" : "td"}
<${header.rowHeader ? "th" : "td"}
...processHtmlAttributes(tdInput)
class=[cellBaseClass, tdClass]
>
Expand Down
5 changes: 3 additions & 2 deletions src/components/ebay-table/marko-tag.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,8 +19,9 @@
},
"@html-attributes": "expression",
"@column-type": {
"enum": ["normal", "numeric", "row-header", "layout", "icon-action"]
}
"enum": ["normal", "numeric", "layout", "icon-action"]
},
"@row-header": "boolean"
},
"@row <row>[]": {
"attribute-groups": ["html-attributes"],
Expand Down
12 changes: 11 additions & 1 deletion src/components/ebay-table/table.stories.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -47,6 +47,14 @@ export default {
category: "@attribute tags",
},
},
rowHeader: {
name: "row-header",
control: { type: "boolean" },
description: "If true, the cell will be rendered as a row header",
table: {
category: "@header attribute tags",
},
},
row: {
name: "@row",
description: "row attribute tags",
Expand All @@ -68,12 +76,14 @@ export default {
options: [
"normal",
"numeric",
"row-header",
"layout",
"icon-action",
],
table: {
category: "@header attribute tags",
defaultValue: {
summary: "normal",
},
},
},
href: {
Expand Down
27 changes: 16 additions & 11 deletions src/components/ebay-table/test/__snapshots__/test.server.js.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,6 @@ exports[`ebay-table > renders ColumnSorting 1`] = `
class="table-cell"
>
<button
aria-pressed="true"
type="button"
>
Seller
Expand Down Expand Up @@ -45,7 +44,6 @@ exports[`ebay-table > renders ColumnSorting 1`] = `
class="table-cell"
>
<button
aria-pressed="false"
type="button"
>
Item
Expand Down Expand Up @@ -75,7 +73,6 @@ exports[`ebay-table > renders ColumnSorting 1`] = `
class="table-cell"
>
<button
aria-pressed="false"
type="button"
>
Status
Expand All @@ -95,7 +92,6 @@ exports[`ebay-table > renders ColumnSorting 1`] = `
class="table-cell table-cell--numeric"
>
<button
aria-pressed="false"
type="button"
>
List Price
Expand All @@ -115,7 +111,6 @@ exports[`ebay-table > renders ColumnSorting 1`] = `
class="table-cell table-cell--numeric"
>
<button
aria-pressed="false"
type="button"
>
Quantity Available
Expand All @@ -135,7 +130,6 @@ exports[`ebay-table > renders ColumnSorting 1`] = `
class="table-cell"
>
<button
aria-pressed="false"
type="button"
>
Orders
Expand All @@ -155,7 +149,6 @@ exports[`ebay-table > renders ColumnSorting 1`] = `
class="table-cell table-cell--numeric"
>
<button
aria-pressed="false"
type="button"
>
Watchers
Expand All @@ -173,7 +166,17 @@ exports[`ebay-table > renders ColumnSorting 1`] = `
</th>
<th
class="table-cell table-cell--numeric"
..."
>
<button
type="button"
>
Protection
 
<svg
aria-hidden="true"
class="icon icon--12"
focusable="false"
[..."
`;

exports[`ebay-table > renders ColumnSortingClientSide 1`] = `
Expand Down Expand Up @@ -205,7 +208,6 @@ exports[`ebay-table > renders ColumnSortingClientSide 1`] = `
class="table-cell table-cell--numeric"
>
<button
aria-pressed="false"
type="button"
>
List Price
Expand Down Expand Up @@ -235,7 +237,6 @@ exports[`ebay-table > renders ColumnSortingClientSide 1`] = `
class="table-cell table-cell--numeric"
>
<button
aria-pressed="false"
type="button"
>
Quantity Available
Expand Down Expand Up @@ -374,7 +375,11 @@ exports[`ebay-table > renders ColumnSortingClientSide 1`] = `
>
<a
href="https://ebay.com"
..."
>
00-10542-89507
</a>
</td>
..."
`;

exports[`ebay-table > renders ColumnSortingWithLink 1`] = `
Expand Down
2 changes: 0 additions & 2 deletions src/components/ebay-table/test/sort/test.browser.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,6 @@ describe("given sortable table with Seller column is sorted in ascending order (
it("then proper sort event should be emitted", async () => {
expect(sellerColumn).toMatchInlineSnapshot(`
<button
aria-pressed="true"
type="button"
>
Expand Down Expand Up @@ -68,7 +67,6 @@ describe("given sortable table with Seller column is sorted in ascending order (
it("then proper sort event should be emitted", async () => {
expect(sellerColumn).toMatchInlineSnapshot(`
<button
aria-pressed="false"
type="button"
>
Expand Down

0 comments on commit 7c39f9d

Please sign in to comment.