Skip to content
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
145 changes: 145 additions & 0 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions packages/lib/jest.config.ts
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ const config: Config = {
coveragePathIgnorePatterns: [
"utils.ts",
"index.ts",
"test/mocks",
".*Context\\.tsx$", // Is deprecated and will be removed in the future
],
moduleNameMapper: {
Expand Down
1 change: 1 addition & 0 deletions packages/lib/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -94,6 +94,7 @@
"playwright": "^1.54.1",
"storybook": "^9.1.10",
"storybook-addon-pseudo-states": "^9.1.10",
"ts-node": "^10.9.2",
"tsup": "^8.1.0",
"typescript": "^5.6.3",
"vitest": "^3.2.4",
Expand Down
14 changes: 14 additions & 0 deletions packages/lib/src/bleed/Bleed.test.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
import { render } from "@testing-library/react";
import DxcBleed from "./Bleed";

describe("Bleed component tests", () => {
test("Bleed renders correctly with children", () => {
const testContent = "Test content";
const { getByText } = render(
<DxcBleed space="1rem">
<div>{testContent}</div>
</DxcBleed>
);
expect(getByText(testContent)).toBeTruthy();
});
});
28 changes: 14 additions & 14 deletions packages/lib/src/bleed/Bleed.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,17 +3,17 @@ import DxcContainer from "../container/Container";

const getNegativeValue = (value?: string) => (value ? `calc(${value} * -1)` : null);

export default function DxcBleed({ space, horizontal, vertical, top, right, bottom, left, children }: BleedPropsType) {
return (
<DxcContainer
margin={{
top: getNegativeValue(top) ?? getNegativeValue(vertical) ?? getNegativeValue(space) ?? "0rem",
right: getNegativeValue(right) ?? getNegativeValue(horizontal) ?? getNegativeValue(space) ?? "0rem",
bottom: getNegativeValue(bottom) ?? getNegativeValue(vertical) ?? getNegativeValue(space) ?? "0rem",
left: getNegativeValue(left) ?? getNegativeValue(horizontal) ?? getNegativeValue(space) ?? "0rem",
}}
>
{children}
</DxcContainer>
);
}
const DxcBleed = ({ space, horizontal, vertical, top, right, bottom, left, children }: BleedPropsType) => (
<DxcContainer
margin={{
top: getNegativeValue(top) ?? getNegativeValue(vertical) ?? getNegativeValue(space) ?? "0rem",
right: getNegativeValue(right) ?? getNegativeValue(horizontal) ?? getNegativeValue(space) ?? "0rem",
bottom: getNegativeValue(bottom) ?? getNegativeValue(vertical) ?? getNegativeValue(space) ?? "0rem",
left: getNegativeValue(left) ?? getNegativeValue(horizontal) ?? getNegativeValue(space) ?? "0rem",
}}
>
{children}
</DxcContainer>
);

export default DxcBleed;
37 changes: 37 additions & 0 deletions packages/lib/src/breadcrumbs/Breadcrumbs.test.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -93,4 +93,41 @@ describe("Breadcrumbs component tests", () => {
userEvent.click(getByText("Preferences"));
expect(onItemClick).toHaveBeenCalledWith("/");
});
test("handleOnClick prevents default and calls onClick when href is provided", () => {
const onItemClick = jest.fn();
const { getByText } = render(
<DxcBreadcrumbs
onItemClick={onItemClick}
items={[
{ label: "Home", href: "/home" },
{ label: "Current Page", href: "" },
]}
/>
);
const homeLink = getByText("Home");
userEvent.click(homeLink);
expect(onItemClick).toHaveBeenCalledWith("/home");
});
test("handleOnMouseEnter sets title when text overflows", () => {
const { getByText } = render(
<DxcBreadcrumbs
items={[
{ label: "Home", href: "/home" },
{ label: "Very Long Current Page Label That Should Overflow", href: "" },
]}
/>
);

const currentPageElement = getByText("Very Long Current Page Label That Should Overflow");

// Mock element dimensions to simulate overflow
Object.defineProperty(currentPageElement, "scrollWidth", { value: 200, configurable: true });
Object.defineProperty(currentPageElement, "clientWidth", { value: 100, configurable: true });

// Simulate mouse enter
userEvent.hover(currentPageElement);

// Check if title is set when there's overflow
expect(currentPageElement.title).toBe("Very Long Current Page Label That Should Overflow");
});
});
7 changes: 1 addition & 6 deletions packages/lib/src/footer/Footer.tsx
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { ReactNode, useContext, useEffect, useMemo, useRef, useState } from "react";
import { useContext, useEffect, useMemo, useRef, useState } from "react";
import styled from "@emotion/styled";
import DxcIcon from "../icon/Icon";
import { Tooltip } from "../tooltip/Tooltip";
Expand Down Expand Up @@ -288,9 +288,4 @@ const DxcFooter = ({
);
};

const LeftContent = ({ children }: { children: ReactNode }) => <>{children}</>;
const RightContent = ({ children }: { children: ReactNode }) => <>{children}</>;

DxcFooter.LeftContent = LeftContent;
DxcFooter.RightContent = RightContent;
export default DxcFooter;
Loading