Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(list-item): always show hover and pointer styling #8622

Merged
merged 5 commits into from
Jan 18, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
62 changes: 0 additions & 62 deletions packages/calcite-components/src/components.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -1905,11 +1905,6 @@ export namespace Components {
* When `true`, number values are displayed with a group separator corresponding to the language and country format.
*/
"groupSeparator": boolean;
/**
* When `true`, the component will not be visible.
* @mdn [hidden](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/hidden)
*/
"hidden": boolean;
/**
* When `true`, shows a default recommended icon. Alternatively, pass a Calcite UI Icon name to display a specific icon.
*/
Expand Down Expand Up @@ -2238,11 +2233,6 @@ export namespace Components {
* When `true`, number values are displayed with a group separator corresponding to the language and country format.
*/
"groupSeparator": boolean;
/**
* When `true`, the component will not be visible.
* @mdn [hidden](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/hidden)
*/
"hidden": boolean;
/**
* Specifies an icon to display.
* @futureBreaking Remove boolean type as it is not supported.
Expand Down Expand Up @@ -2404,11 +2394,6 @@ export namespace Components {
* The `id` of the form that will be associated with the component. When not set, the component will be associated with its ancestor form element, if any.
*/
"form": string;
/**
* When `true`, the component will not be visible.
* @mdn [hidden](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/hidden)
*/
"hidden": boolean;
/**
* Specifies an icon to display.
* @futureBreaking Remove boolean type as it is not supported.
Expand Down Expand Up @@ -3729,10 +3714,6 @@ export namespace Components {
* The `id` of the component. When omitted, a globally unique identifier is used.
*/
"guid": string;
/**
* When `true`, the component is not displayed and is not focusable or checkable.
*/
"hidden": boolean;
/**
* The hovered state of the component.
*/
Expand Down Expand Up @@ -3767,10 +3748,6 @@ export namespace Components {
* When `true`, interaction is prevented and the component is displayed with lower opacity.
*/
"disabled": boolean;
/**
* When `true`, the component is not displayed and its `calcite-radio-button`s are not focusable or checkable.
*/
"hidden": boolean;
/**
* Defines the layout of the component.
*/
Expand Down Expand Up @@ -4958,10 +4935,6 @@ export namespace Components {
* The component header text, which displays between the icon and description.
*/
"heading": string;
/**
* When `true`, the component is not displayed and is not focusable.
*/
"hidden": boolean;
/**
* When embed is `"false"`, the URL for the component.
*/
Expand Down Expand Up @@ -4996,10 +4969,6 @@ export namespace Components {
* The component header text, which displays between the icon and description.
*/
"heading": string;
/**
* When `true`, the component is not displayed and is not focusable or checkable.
*/
"hidden": boolean;
/**
* Specifies an icon to display.
*/
Expand Down Expand Up @@ -9266,11 +9235,6 @@ declare namespace LocalJSX {
* When `true`, number values are displayed with a group separator corresponding to the language and country format.
*/
"groupSeparator"?: boolean;
/**
* When `true`, the component will not be visible.
* @mdn [hidden](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/hidden)
*/
"hidden"?: boolean;
/**
* When `true`, shows a default recommended icon. Alternatively, pass a Calcite UI Icon name to display a specific icon.
*/
Expand Down Expand Up @@ -9612,11 +9576,6 @@ declare namespace LocalJSX {
* When `true`, number values are displayed with a group separator corresponding to the language and country format.
*/
"groupSeparator"?: boolean;
/**
* When `true`, the component will not be visible.
* @mdn [hidden](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/hidden)
*/
"hidden"?: boolean;
/**
* Specifies an icon to display.
* @futureBreaking Remove boolean type as it is not supported.
Expand Down Expand Up @@ -9780,11 +9739,6 @@ declare namespace LocalJSX {
* The `id` of the form that will be associated with the component. When not set, the component will be associated with its ancestor form element, if any.
*/
"form"?: string;
/**
* When `true`, the component will not be visible.
* @mdn [hidden](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/hidden)
*/
"hidden"?: boolean;
/**
* Specifies an icon to display.
* @futureBreaking Remove boolean type as it is not supported.
Expand Down Expand Up @@ -11195,10 +11149,6 @@ declare namespace LocalJSX {
* The `id` of the component. When omitted, a globally unique identifier is used.
*/
"guid"?: string;
/**
* When `true`, the component is not displayed and is not focusable or checkable.
*/
"hidden"?: boolean;
/**
* The hovered state of the component.
*/
Expand Down Expand Up @@ -11245,10 +11195,6 @@ declare namespace LocalJSX {
* When `true`, interaction is prevented and the component is displayed with lower opacity.
*/
"disabled"?: boolean;
/**
* When `true`, the component is not displayed and its `calcite-radio-button`s are not focusable or checkable.
*/
"hidden"?: boolean;
/**
* Defines the layout of the component.
*/
Expand Down Expand Up @@ -12461,10 +12407,6 @@ declare namespace LocalJSX {
* The component header text, which displays between the icon and description.
*/
"heading"?: string;
/**
* When `true`, the component is not displayed and is not focusable.
*/
"hidden"?: boolean;
/**
* When embed is `"false"`, the URL for the component.
*/
Expand Down Expand Up @@ -12499,10 +12441,6 @@ declare namespace LocalJSX {
* The component header text, which displays between the icon and description.
*/
"heading"?: string;
/**
* When `true`, the component is not displayed and is not focusable or checkable.
*/
"hidden"?: boolean;
/**
* Specifies an icon to display.
*/
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -67,6 +67,14 @@ describe("calcite-list-item", () => {
disabled(`<calcite-list-item label="test" active></calcite-list-item>`);
});

it("always displays hover class", async () => {
const page = await newE2EPage();
await page.setContent(`<calcite-list-item></calcite-list-item>`);
await page.waitForChanges();

expect(await page.find(`calcite-list-item >>> .${CSS.containerHover}`)).not.toBeNull();
});

it("renders dragHandle when property is true", async () => {
const page = await newE2EPage();
await page.setContent(`<calcite-list-item></calcite-list-item>`);
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -671,7 +671,7 @@ export class ListItem
aria-setsize={setSize}
class={{
[CSS.container]: true,
[CSS.containerHover]: selectionMode !== "none",
[CSS.containerHover]: true,
[CSS.containerBorder]: showBorder,
[CSS.containerBorderSelected]: borderSelected,
[CSS.containerBorderUnselected]: borderUnselected,
Expand Down
Loading