@orangesk/orange-design-system 3.6.1 → 3.6.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@orangesk/orange-design-system",
-  "version": "3.6.1",
+  "version": "3.6.2",
   "private": false,
   "engines": {
     "node": ">=20.x"
@@ -27,7 +27,7 @@
     "@cloudfour/transition-hidden-element": "^2.0.2",
     "@mdx-js/loader": "^3.1.1",
     "@mdx-js/react": "^3.1.1",
-    "@next/mdx": "16.3.3",
+    "@next/mdx": "16.3.4",
     "@orangesk/accessible-autocomplete": "3.2.2",
     "@popperjs/core": "^2.11.8",
     "@types/mdx": "^2.0.14",
@@ -39,11 +39,11 @@
     "html-react-parser": "6.1.7",
     "lorem-ipsum": "3.0.0",
     "minisearch": "7.2.0",
-    "next": "16.3.3",
+    "next": "16.3.4",
     "normalize.css": "^8.0.1",
     "nouislider": "^15.8.1",
     "prism-react-renderer": "^2.4.1",
-    "query-string": "^9.5.0",
+    "query-string": "^9.5.1",
     "react": "^19.2.8",
     "react-dom": "^19.2.8",
     "react-element-to-jsx-string": "^17.0.1",
@@ -71,16 +71,16 @@
     "@rollup/plugin-terser": "1.0.0",
     "@rollup/plugin-typescript": "^12.3.0",
     "@rollup/plugin-url": "^8.0.2",
-    "@rollup/rollup-darwin-arm64": "^4.63.0",
+    "@rollup/rollup-darwin-arm64": "^4.63.1",
     "@testing-library/dom": "^10.4.1",
     "@testing-library/jest-dom": "7.0.1",
-    "@testing-library/react": "^16.3.2",
-    "@testing-library/user-event": "^14.6.6",
-    "@types/node": "26.4.0",
+    "@testing-library/react": "^16.3.3",
+    "@testing-library/user-event": "^14.6.7",
+    "@types/node": "26.4.1",
     "@types/react": "19.2.18",
     "@types/react-dom": "19.2.5",
     "@types/wnumb": "^1.2.3",
-    "@vitejs/plugin-react": "6.1.0",
+    "@vitejs/plugin-react": "6.1.1",
     "@vitest/browser": "^4.1.11",
     "@vitest/browser-playwright": "^4.1.11",
     "@vitest/coverage-v8": "^4.1.11",
@@ -88,14 +88,14 @@
     "canvas": "^3.2.3",
     "fs-extra": "^11.4.0",
     "glob": "13.0.6",
-    "html-validate": "11.10.0",
+    "html-validate": "11.12.0",
     "husky": "^9.1.7",
     "identity-obj-proxy": "^3.0.0",
     "jsdom": "30.0.1",
-    "lint-staged": "17.3.0",
+    "lint-staged": "17.4.1",
     "playwright": "^1.62.1",
     "prettier": "^3.9.6",
-    "rollup": "^4.63.0",
+    "rollup": "^4.63.1",
     "rollup-plugin-copy": "^3.5.0",
     "rollup-plugin-dts": "^6.5.1",
     "rollup-plugin-postcss": "^4.0.2",

package/src/components/BodyBanner/styles/mixins.scss

@@ -54,7 +54,7 @@
   width: 100%;
   display: flex;
   padding: space.get("large");
-  gap: convert.to-rem(60px);
+  gap: convert.to-rem(30px);
 
   > div:not(.body-banner__button) {
     flex: 1;
@@ -116,18 +116,20 @@
   }
 
   .body-banner__image {
+    display: flex;
+    align-items: flex-start;
+    justify-content: flex-end;
+
     > * {
       width: fit-content;
       max-width: 100%;
-      height: 100%;
+      height: auto;
     }
 
     img {
       width: 100%;
-      height: 100%;
+      height: auto;
       max-height: none;
-      object-fit: cover;
-      object-position: center;
       margin: 0 !important;
       display: block;
     }

package/src/components/Countdown/Countdown.shared.ts

@@ -106,6 +106,7 @@ export abstract class BaseCountdownStatic {
   observer?: IntersectionObserver;
   private instanceKey: string;
   private defaultConfig: CountdownConfig;
+  private configOverrides: Partial<CountdownConfig>;
 
   constructor(
     element: HTMLElement,
@@ -118,6 +119,7 @@ export abstract class BaseCountdownStatic {
     this.element = element;
     this.defaultConfig = options.defaultConfig;
     this.instanceKey = options.instanceKey;
+    this.configOverrides = { ...(config ?? {}) };
     this.config = { ...options.defaultConfig, ...(config ?? {}) };
     this.liveRegion = null;
 
@@ -183,7 +185,7 @@ export abstract class BaseCountdownStatic {
     this.config = {
       ...this.defaultConfig,
       ...elementConfig,
-      ...this.config,
+      ...this.configOverrides,
     };
 
     this.liveRegion = this.getLiveRegion();
@@ -208,8 +210,8 @@ export abstract class BaseCountdownStatic {
     this.stop();
     this.observer?.disconnect();
     this.destroyElements();
-    this.config = {
-      ...this.config,
+    this.configOverrides = {
+      ...this.configOverrides,
       ...(config ?? {}),
     };
     this.init();

package/src/components/Countdown/Countdown.static.ts

@@ -123,7 +123,7 @@ export default class CountdownStatic extends BaseCountdownStatic {
       return;
     }
 
-    if (!topLabel.textContent) {
+    if (!topLabel.textContent || topLabel.textContent === "00") {
       this.setLeafValue(leaf, value);
       return;
     }

package/src/components/Countdown/tests/Countdown.static.test.jsx

@@ -45,6 +45,25 @@ describe("Countdown static behavior", () => {
     vi.useRealTimers();
   });
 
+  it("sets all value layers on initial render", () => {
+    vi.useFakeTimers();
+    vi.setSystemTime(new Date("2026-07-24T00:00:00.000Z"));
+
+    const { container } = render(
+      <Countdown targetDate="2026-07-25T01:02:03.000Z" />,
+    );
+
+    const values = Array.from(
+      container
+        .querySelectorAll(".countdown__unit")[0]
+        .querySelectorAll(".countdown__value"),
+    ).map((element) => element.textContent);
+
+    expect(values).toEqual(["01", "01", "01", "01"]);
+
+    vi.useRealTimers();
+  });
+
   it("switches day label based on remaining value", () => {
     vi.useFakeTimers();
     vi.setSystemTime(new Date("2026-07-24T00:00:00.000Z"));

package/src/components/Countdown/tests/CountdownTag.static.test.jsx

@@ -4,6 +4,35 @@ import { CountdownTag } from "../CountdownTag";
 import CountdownTagStatic from "../CountdownTag.static";
 
 describe("CountdownTag static behavior", () => {
+  it("initializes target date from data-countdown-config", () => {
+    vi.useFakeTimers();
+    vi.setSystemTime(new Date("2026-07-24T00:00:00.000Z"));
+
+    const element = document.createElement("div");
+    element.setAttribute(
+      "data-countdown-config",
+      JSON.stringify({
+        targetDate: "2026-07-24T00:00:59.000Z",
+        units: ["seconds"],
+      }),
+    );
+    element.innerHTML = `
+      <span data-countdown-unit="seconds">
+        <span data-countdown-tag-value="true">00</span>
+        <span class="countdown-tag__label"></span>
+      </span>
+    `;
+
+    new CountdownTagStatic(element);
+
+    expect(
+      element.querySelector("[data-countdown-tag-value]"),
+    ).toHaveTextContent("59");
+
+    CountdownTagStatic.getInstance(element)?.destroy();
+    vi.useRealTimers();
+  });
+
   it("updates visible value from current time", () => {
     vi.useFakeTimers();
     vi.setSystemTime(new Date("2026-07-24T00:00:00.000Z"));