@commercetools/nimbus 2.1.0 → 2.3.0

package/dist/patterns/fields/search-input-field/search-input-field.types.d.ts

@@ -0,0 +1,50 @@
+import { ReactNode } from 'react';
+import { SearchInputProps } from '../../../components/search-input/search-input.types';
+import { FieldErrorsData } from '../../../components';
+import { FormFieldProps } from '../../../components/form-field';
+/**
+ * Props for the SearchInputField component.
+ *
+ * Combines SearchInput functionality with form field features like labels,
+ * descriptions, error handling, and validation feedback.
+ *
+ * Style props (margin, padding, width, etc.) are applied to the input element.
+ * Functional props (aria-*, data-*, id, isRequired, etc.) are applied to the form field wrapper.
+ */
+export type SearchInputFieldProps = Omit<SearchInputProps, "isInvalid" | "id"> & Pick<FormFieldProps, "isRequired" | "isInvalid" | "isDisabled" | "isReadOnly" | "id"> & {
+    /**
+     * Used as HTML name of the input component.
+     */
+    name?: string;
+    /**
+     * Label text for the input field (required for accessibility)
+     */
+    label: string | ReactNode;
+    /**
+     * Description text that appears below the input
+     */
+    description?: string | ReactNode;
+    /**
+     * Info content that appears in a popover when the info button is clicked.
+     * Info button will only be visible when this prop is passed.
+     */
+    info?: ReactNode;
+    /**
+     * Error object - only truthy values will be rendered
+     * Compatible with FieldErrors format
+     */
+    errors?: FieldErrorsData;
+    /**
+     * Custom error renderer function
+     */
+    renderError?: (errorKey: string) => ReactNode;
+    /**
+     * Indicates whether the field was touched. Errors will only be shown when the field was touched.
+     */
+    touched?: boolean;
+    /**
+     * Size of the search input
+     * @default "md"
+     */
+    size?: "sm" | "md";
+};

package/dist/patterns/fields/text-input-field/text-input-field.d.ts

@@ -23,6 +23,6 @@ import { TextInputFieldProps } from './text-input-field.types';
  * ```
  */
 export declare const TextInputField: {
-    ({ id, label, description, info, errors, onChange, renderError, touched, isRequired, isDisabled, isReadOnly, isInvalid, value, placeholder, type, ...rest }: TextInputFieldProps): import("react/jsx-runtime").JSX.Element;
+    ({ id, label, description, info, errors, onChange, renderError, touched, isRequired, isDisabled, isReadOnly, isInvalid, size, value, placeholder, type, ...rest }: TextInputFieldProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };

package/dist/patterns/fields/text-input-field/text-input-field.types.d.ts

@@ -1,7 +1,7 @@
-import { TextInputProps } from '../../../components/text-input';
-import { FormFieldProps } from '../../../components/form-field';
+import { TextInputProps } from '../../../components/text-input/text-input.types';
+import { FormFieldProps } from '../../../components/form-field/form-field.types';
 import { ReactNode } from 'react';
-import { FieldErrorsData } from '../../../components/field-errors';
+import { FieldErrorsData } from '../../../components/field-errors/field-errors.types';
 /**
  * Props for the TextInputField component.
  *
@@ -41,4 +41,9 @@ export type TextInputFieldProps = Omit<TextInputProps, "type"> & Pick<FormFieldP
      */
     errors?: FieldErrorsData;
     renderError?: (errorKey: string) => ReactNode;
+    /**
+     * Size of the text input
+     * @default "md"
+     */
+    size?: "sm" | "md";
 };

package/dist/setup-jsdom-polyfills.cjs

@@ -1,2 +1,2 @@
-"use strict";typeof globalThis.structuredClone!="function"&&(globalThis.structuredClone=function(e){if(e==null)return e;try{return typeof e=="object"?JSON.parse(JSON.stringify(e)):e}catch(t){return console.warn("structuredClone polyfill failed:",t),Array.isArray(e)?[...e]:{...e}}});if(typeof globalThis.ResizeObserver>"u"){class r{observe(){}unobserve(){}disconnect(){}}globalThis.ResizeObserver=r}if(typeof globalThis.IntersectionObserver>"u"){class r{root=null;rootMargin="";thresholds=[];disconnect(){}observe(){}takeRecords(){return[]}unobserve(){}}globalThis.IntersectionObserver=r}typeof Element<"u"&&(Element.prototype.scrollTo=Element.prototype.scrollTo||(()=>{}),Element.prototype.scrollIntoView=Element.prototype.scrollIntoView||(()=>{}));typeof window<"u"&&!window.requestAnimationFrame&&(window.requestAnimationFrame=r=>setTimeout(()=>r(Date.now()),1e3/60));
+"use strict";typeof globalThis.structuredClone!="function"&&(globalThis.structuredClone=function(e){if(e==null)return e;try{return typeof e=="object"?JSON.parse(JSON.stringify(e)):e}catch(t){return console.warn("structuredClone polyfill failed:",t),Array.isArray(e)?[...e]:{...e}}});typeof window<"u"&&!window.matchMedia&&(window.matchMedia=r=>({matches:!1,media:r,onchange:null,addListener:()=>{},removeListener:()=>{},addEventListener:()=>{},removeEventListener:()=>{},dispatchEvent:()=>!1}));if(typeof globalThis.ResizeObserver>"u"){class r{observe(){}unobserve(){}disconnect(){}}globalThis.ResizeObserver=r}if(typeof globalThis.IntersectionObserver>"u"){class r{root=null;rootMargin="";thresholds=[];disconnect(){}observe(){}takeRecords(){return[]}unobserve(){}}globalThis.IntersectionObserver=r}typeof Element<"u"&&(Element.prototype.scrollTo=Element.prototype.scrollTo||(()=>{}),Element.prototype.scrollIntoView=Element.prototype.scrollIntoView||(()=>{}));typeof window<"u"&&!window.requestAnimationFrame&&(window.requestAnimationFrame=r=>setTimeout(()=>r(Date.now()),1e3/60));
 //# sourceMappingURL=setup-jsdom-polyfills.cjs.map

package/dist/setup-jsdom-polyfills.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"setup-jsdom-polyfills.cjs","sources":["../src/test/setup-jsdom-polyfills.ts"],"sourcesContent":["/**\n * Polyfills for JSDOM test environments\n *\n * These polyfills prevent `NimbusProvider` from crashing in JSDOM\n * environments (e.g., Jest, Vitest).\n *\n * **Usage with Jest:**\n * ```js\n * // jest.config.js\n * module.exports = {\n *   setupFiles: [\n *     '@commercetools/nimbus/setup-jsdom-polyfills'\n *   ]\n * };\n * ```\n *\n * **Usage with Vitest:**\n * ```ts\n * // vitest.config.ts\n * export default defineConfig({\n *   test: {\n *     setupFiles: [\n *       '@commercetools/nimbus/setup-jsdom-polyfills'\n *     ]\n *   }\n * });\n * ```\n\n */\n\n/**\n * Mock structuredClone\n *\n * **Why**: Required by Chakra UI provider for deep cloning objects\n *\n * **Use cases**:\n * - NimbusProvider initialization\n * - Chakra UI theme configuration\n * - Deep cloning of component state\n * - React context value cloning\n */\nif (typeof globalThis.structuredClone !== \"function\") {\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  globalThis.structuredClone = function structuredClone(value: any) {\n    if (value === null || value === undefined) {\n      return value;\n    }\n\n    try {\n      // For objects and arrays, use JSON methods\n      if (typeof value === \"object\") {\n        return JSON.parse(JSON.stringify(value));\n      }\n      // For primitive values, return directly\n      return value;\n    } catch (error) {\n      console.warn(\"structuredClone polyfill failed:\", error);\n\n      // Returns a shallow copy as fallback\n      return Array.isArray(value) ? [...value] : { ...value };\n    }\n  };\n}\n\n/**\n * Mock window.matchMedia\n *\n * **Why**: Required for responsive design and theme system\n *\n * **Use cases**:\n * - Chakra UI color mode and theme detection\n * - Responsive component behavior\n * - Media query hooks (useMediaQuery)\n * - Breakpoint-based rendering\n */\nObject.defineProperty(window, \"matchMedia\", {\n  writable: true,\n  value: (query: unknown) => ({\n    matches: false, // Default, can be overridden in tests\n    media: query,\n    onchange: null,\n    addListener: () => {}, // Deprecated but needed\n    removeListener: () => {}, // Deprecated but needed\n    addEventListener: () => {},\n    removeEventListener: () => {},\n    dispatchEvent: () => false,\n  }),\n});\n\n/**\n * Mock ResizeObserver\n *\n * **Why**: Required for components that adjust based on size\n *\n * **Use cases**:\n * - Chakra UI responsive components\n * - React Aria components with responsive behavior\n * - Components that measure container dimensions\n */\nif (typeof globalThis.ResizeObserver === \"undefined\") {\n  class ResizeObserverMock {\n    observe() {}\n    unobserve() {}\n    disconnect() {}\n  }\n  globalThis.ResizeObserver =\n    ResizeObserverMock as unknown as typeof ResizeObserver;\n}\n\n/**\n * Mock IntersectionObserver\n *\n * **Why**: Required for lazy loading and viewport-based effects\n *\n * **Use cases**:\n * - Components that trigger actions when entering viewport\n * - Infinite scroll implementations\n * - Lazy image loading\n * - Visibility tracking for analytics\n */\nif (typeof globalThis.IntersectionObserver === \"undefined\") {\n  class IntersectionObserverMock {\n    readonly root: Element | null = null;\n    readonly rootMargin: string = \"\";\n    readonly thresholds: ReadonlyArray<number> = [];\n\n    disconnect() {}\n    observe() {}\n    takeRecords(): IntersectionObserverEntry[] {\n      return [];\n    }\n    unobserve() {}\n  }\n  globalThis.IntersectionObserver =\n    IntersectionObserverMock as unknown as typeof IntersectionObserver;\n}\n\n/**\n * Mock Element.prototype scroll methods\n *\n * **Why**: Used by navigation, modals, and focus management\n *\n * **Use cases**:\n * - React Aria focus management\n * - Scroll-to-top features\n * - Dialog auto-focus and scroll behavior\n * - Dropdown and menu positioning\n */\nif (typeof Element !== \"undefined\") {\n  Element.prototype.scrollTo = Element.prototype.scrollTo || (() => {});\n  Element.prototype.scrollIntoView =\n    Element.prototype.scrollIntoView || (() => {});\n}\n\n/**\n * Mock requestAnimationFrame\n *\n * **Why**: Used in animations and transitions\n *\n * **Use cases**:\n * - Chakra UI animations and motion components\n * - React Aria transition hooks\n * - Smooth UI updates and state changes\n * - Custom animation implementations\n */\nif (typeof window !== \"undefined\" && !window.requestAnimationFrame) {\n  window.requestAnimationFrame = (callback: FrameRequestCallback) => {\n    return setTimeout(\n      () => callback(Date.now()),\n      1000 / 60\n    ) as unknown as number;\n  };\n}\n"],"names":["value","error","ResizeObserverMock","IntersectionObserverMock","callback"],"mappings":"aAyCI,OAAO,WAAW,iBAAoB,aAExC,WAAW,gBAAkB,SAAyBA,EAAY,CAChE,GAAIA,GAAU,KACZ,OAAOA,EAGT,GAAI,CAEF,OAAI,OAAOA,GAAU,SACZ,KAAK,MAAM,KAAK,UAAUA,CAAK,CAAC,EAGlCA,CACT,OAASC,EAAO,CACd,eAAQ,KAAK,mCAAoCA,CAAK,EAG/C,MAAM,QAAQD,CAAK,EAAI,CAAC,GAAGA,CAAK,EAAI,CAAE,GAAGA,CAAA,CAClD,CACF,GAsCF,GAAI,OAAO,WAAW,eAAmB,IAAa,CACpD,MAAME,CAAmB,CACvB,SAAU,CAAC,CACX,WAAY,CAAC,CACb,YAAa,CAAC,CAAA,CAEhB,WAAW,eACTA,CACJ,CAaA,GAAI,OAAO,WAAW,qBAAyB,IAAa,CAC1D,MAAMC,CAAyB,CACpB,KAAuB,KACvB,WAAqB,GACrB,WAAoC,CAAA,EAE7C,YAAa,CAAC,CACd,SAAU,CAAC,CACX,aAA2C,CACzC,MAAO,CAAA,CACT,CACA,WAAY,CAAC,CAAA,CAEf,WAAW,qBACTA,CACJ,CAaI,OAAO,QAAY,MACrB,QAAQ,UAAU,SAAW,QAAQ,UAAU,WAAa,IAAM,CAAC,GACnE,QAAQ,UAAU,eAChB,QAAQ,UAAU,iBAAmB,IAAM,CAAC,IAc5C,OAAO,OAAW,KAAe,CAAC,OAAO,wBAC3C,OAAO,sBAAyBC,GACvB,WACL,IAAMA,EAAS,KAAK,KAAK,EACzB,IAAO,EAAA"}
+{"version":3,"file":"setup-jsdom-polyfills.cjs","sources":["../src/test/setup-jsdom-polyfills.ts"],"sourcesContent":["/**\n * Polyfills for JSDOM test environments\n *\n * These polyfills prevent `NimbusProvider` from crashing in JSDOM\n * environments (e.g., Jest, Vitest).\n *\n * **Usage with Jest:**\n * ```js\n * // jest.config.js\n * module.exports = {\n *   setupFiles: [\n *     '@commercetools/nimbus/setup-jsdom-polyfills'\n *   ]\n * };\n * ```\n *\n * **Usage with Vitest:**\n * ```ts\n * // vitest.config.ts\n * export default defineConfig({\n *   test: {\n *     setupFiles: [\n *       '@commercetools/nimbus/setup-jsdom-polyfills'\n *     ]\n *   }\n * });\n * ```\n\n */\n\n/**\n * Mock structuredClone\n *\n * **Why**: Required by Chakra UI provider for deep cloning objects\n *\n * **Use cases**:\n * - NimbusProvider initialization\n * - Chakra UI theme configuration\n * - Deep cloning of component state\n * - React context value cloning\n */\nif (typeof globalThis.structuredClone !== \"function\") {\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  globalThis.structuredClone = function structuredClone(value: any) {\n    if (value === null || value === undefined) {\n      return value;\n    }\n\n    try {\n      // For objects and arrays, use JSON methods\n      if (typeof value === \"object\") {\n        return JSON.parse(JSON.stringify(value));\n      }\n      // For primitive values, return directly\n      return value;\n    } catch (error) {\n      console.warn(\"structuredClone polyfill failed:\", error);\n\n      // Returns a shallow copy as fallback\n      return Array.isArray(value) ? [...value] : { ...value };\n    }\n  };\n}\n\n/**\n * Mock window.matchMedia\n *\n * **Why**: Required for responsive design and theme system\n *\n * **Use cases**:\n * - Chakra UI color mode and theme detection\n * - Responsive component behavior\n * - Media query hooks (useMediaQuery)\n * - Breakpoint-based rendering\n */\nif (typeof window !== \"undefined\" && !window.matchMedia) {\n  window.matchMedia = (query: string) =>\n    ({\n      matches: false, // Default, can be overridden in tests\n      media: query,\n      onchange: null,\n      addListener: () => {}, // Deprecated but needed\n      removeListener: () => {}, // Deprecated but needed\n      addEventListener: () => {},\n      removeEventListener: () => {},\n      dispatchEvent: () => false,\n    }) as MediaQueryList;\n}\n\n/**\n * Mock ResizeObserver\n *\n * **Why**: Required for components that adjust based on size\n *\n * **Use cases**:\n * - Chakra UI responsive components\n * - React Aria components with responsive behavior\n * - Components that measure container dimensions\n */\nif (typeof globalThis.ResizeObserver === \"undefined\") {\n  class ResizeObserverMock {\n    observe() {}\n    unobserve() {}\n    disconnect() {}\n  }\n  globalThis.ResizeObserver =\n    ResizeObserverMock as unknown as typeof ResizeObserver;\n}\n\n/**\n * Mock IntersectionObserver\n *\n * **Why**: Required for lazy loading and viewport-based effects\n *\n * **Use cases**:\n * - Components that trigger actions when entering viewport\n * - Infinite scroll implementations\n * - Lazy image loading\n * - Visibility tracking for analytics\n */\nif (typeof globalThis.IntersectionObserver === \"undefined\") {\n  class IntersectionObserverMock {\n    readonly root: Element | null = null;\n    readonly rootMargin: string = \"\";\n    readonly thresholds: ReadonlyArray<number> = [];\n\n    disconnect() {}\n    observe() {}\n    takeRecords(): IntersectionObserverEntry[] {\n      return [];\n    }\n    unobserve() {}\n  }\n  globalThis.IntersectionObserver =\n    IntersectionObserverMock as unknown as typeof IntersectionObserver;\n}\n\n/**\n * Mock Element.prototype scroll methods\n *\n * **Why**: Used by navigation, modals, and focus management\n *\n * **Use cases**:\n * - React Aria focus management\n * - Scroll-to-top features\n * - Dialog auto-focus and scroll behavior\n * - Dropdown and menu positioning\n */\nif (typeof Element !== \"undefined\") {\n  Element.prototype.scrollTo = Element.prototype.scrollTo || (() => {});\n  Element.prototype.scrollIntoView =\n    Element.prototype.scrollIntoView || (() => {});\n}\n\n/**\n * Mock requestAnimationFrame\n *\n * **Why**: Used in animations and transitions\n *\n * **Use cases**:\n * - Chakra UI animations and motion components\n * - React Aria transition hooks\n * - Smooth UI updates and state changes\n * - Custom animation implementations\n */\nif (typeof window !== \"undefined\" && !window.requestAnimationFrame) {\n  window.requestAnimationFrame = (callback: FrameRequestCallback) => {\n    return setTimeout(\n      () => callback(Date.now()),\n      1000 / 60\n    ) as unknown as number;\n  };\n}\n"],"names":["value","error","query","ResizeObserverMock","IntersectionObserverMock","callback"],"mappings":"aAyCI,OAAO,WAAW,iBAAoB,aAExC,WAAW,gBAAkB,SAAyBA,EAAY,CAChE,GAAIA,GAAU,KACZ,OAAOA,EAGT,GAAI,CAEF,OAAI,OAAOA,GAAU,SACZ,KAAK,MAAM,KAAK,UAAUA,CAAK,CAAC,EAGlCA,CACT,OAASC,EAAO,CACd,eAAQ,KAAK,mCAAoCA,CAAK,EAG/C,MAAM,QAAQD,CAAK,EAAI,CAAC,GAAGA,CAAK,EAAI,CAAE,GAAGA,CAAA,CAClD,CACF,GAcE,OAAO,OAAW,KAAe,CAAC,OAAO,aAC3C,OAAO,WAAcE,IAClB,CACC,QAAS,GACT,MAAOA,EACP,SAAU,KACV,YAAa,IAAM,CAAC,EACpB,eAAgB,IAAM,CAAC,EACvB,iBAAkB,IAAM,CAAC,EACzB,oBAAqB,IAAM,CAAC,EAC5B,cAAe,IAAM,EAAA,IAc3B,GAAI,OAAO,WAAW,eAAmB,IAAa,CACpD,MAAMC,CAAmB,CACvB,SAAU,CAAC,CACX,WAAY,CAAC,CACb,YAAa,CAAC,CAAA,CAEhB,WAAW,eACTA,CACJ,CAaA,GAAI,OAAO,WAAW,qBAAyB,IAAa,CAC1D,MAAMC,CAAyB,CACpB,KAAuB,KACvB,WAAqB,GACrB,WAAoC,CAAA,EAE7C,YAAa,CAAC,CACd,SAAU,CAAC,CACX,aAA2C,CACzC,MAAO,CAAA,CACT,CACA,WAAY,CAAC,CAAA,CAEf,WAAW,qBACTA,CACJ,CAaI,OAAO,QAAY,MACrB,QAAQ,UAAU,SAAW,QAAQ,UAAU,WAAa,IAAM,CAAC,GACnE,QAAQ,UAAU,eAChB,QAAQ,UAAU,iBAAmB,IAAM,CAAC,IAc5C,OAAO,OAAW,KAAe,CAAC,OAAO,wBAC3C,OAAO,sBAAyBC,GACvB,WACL,IAAMA,EAAS,KAAK,KAAK,EACzB,IAAO,EAAA"}

package/dist/setup-jsdom-polyfills.es.js

@@ -7,6 +7,23 @@ typeof globalThis.structuredClone != "function" && (globalThis.structuredClone =
     return console.warn("structuredClone polyfill failed:", t), Array.isArray(e) ? [...e] : { ...e };
   }
 });
+typeof window < "u" && !window.matchMedia && (window.matchMedia = (r) => ({
+  matches: !1,
+  // Default, can be overridden in tests
+  media: r,
+  onchange: null,
+  addListener: () => {
+  },
+  // Deprecated but needed
+  removeListener: () => {
+  },
+  // Deprecated but needed
+  addEventListener: () => {
+  },
+  removeEventListener: () => {
+  },
+  dispatchEvent: () => !1
+}));
 if (typeof globalThis.ResizeObserver > "u") {
   class r {
     observe() {

package/dist/setup-jsdom-polyfills.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"setup-jsdom-polyfills.es.js","sources":["../src/test/setup-jsdom-polyfills.ts"],"sourcesContent":["/**\n * Polyfills for JSDOM test environments\n *\n * These polyfills prevent `NimbusProvider` from crashing in JSDOM\n * environments (e.g., Jest, Vitest).\n *\n * **Usage with Jest:**\n * ```js\n * // jest.config.js\n * module.exports = {\n *   setupFiles: [\n *     '@commercetools/nimbus/setup-jsdom-polyfills'\n *   ]\n * };\n * ```\n *\n * **Usage with Vitest:**\n * ```ts\n * // vitest.config.ts\n * export default defineConfig({\n *   test: {\n *     setupFiles: [\n *       '@commercetools/nimbus/setup-jsdom-polyfills'\n *     ]\n *   }\n * });\n * ```\n\n */\n\n/**\n * Mock structuredClone\n *\n * **Why**: Required by Chakra UI provider for deep cloning objects\n *\n * **Use cases**:\n * - NimbusProvider initialization\n * - Chakra UI theme configuration\n * - Deep cloning of component state\n * - React context value cloning\n */\nif (typeof globalThis.structuredClone !== \"function\") {\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  globalThis.structuredClone = function structuredClone(value: any) {\n    if (value === null || value === undefined) {\n      return value;\n    }\n\n    try {\n      // For objects and arrays, use JSON methods\n      if (typeof value === \"object\") {\n        return JSON.parse(JSON.stringify(value));\n      }\n      // For primitive values, return directly\n      return value;\n    } catch (error) {\n      console.warn(\"structuredClone polyfill failed:\", error);\n\n      // Returns a shallow copy as fallback\n      return Array.isArray(value) ? [...value] : { ...value };\n    }\n  };\n}\n\n/**\n * Mock window.matchMedia\n *\n * **Why**: Required for responsive design and theme system\n *\n * **Use cases**:\n * - Chakra UI color mode and theme detection\n * - Responsive component behavior\n * - Media query hooks (useMediaQuery)\n * - Breakpoint-based rendering\n */\nObject.defineProperty(window, \"matchMedia\", {\n  writable: true,\n  value: (query: unknown) => ({\n    matches: false, // Default, can be overridden in tests\n    media: query,\n    onchange: null,\n    addListener: () => {}, // Deprecated but needed\n    removeListener: () => {}, // Deprecated but needed\n    addEventListener: () => {},\n    removeEventListener: () => {},\n    dispatchEvent: () => false,\n  }),\n});\n\n/**\n * Mock ResizeObserver\n *\n * **Why**: Required for components that adjust based on size\n *\n * **Use cases**:\n * - Chakra UI responsive components\n * - React Aria components with responsive behavior\n * - Components that measure container dimensions\n */\nif (typeof globalThis.ResizeObserver === \"undefined\") {\n  class ResizeObserverMock {\n    observe() {}\n    unobserve() {}\n    disconnect() {}\n  }\n  globalThis.ResizeObserver =\n    ResizeObserverMock as unknown as typeof ResizeObserver;\n}\n\n/**\n * Mock IntersectionObserver\n *\n * **Why**: Required for lazy loading and viewport-based effects\n *\n * **Use cases**:\n * - Components that trigger actions when entering viewport\n * - Infinite scroll implementations\n * - Lazy image loading\n * - Visibility tracking for analytics\n */\nif (typeof globalThis.IntersectionObserver === \"undefined\") {\n  class IntersectionObserverMock {\n    readonly root: Element | null = null;\n    readonly rootMargin: string = \"\";\n    readonly thresholds: ReadonlyArray<number> = [];\n\n    disconnect() {}\n    observe() {}\n    takeRecords(): IntersectionObserverEntry[] {\n      return [];\n    }\n    unobserve() {}\n  }\n  globalThis.IntersectionObserver =\n    IntersectionObserverMock as unknown as typeof IntersectionObserver;\n}\n\n/**\n * Mock Element.prototype scroll methods\n *\n * **Why**: Used by navigation, modals, and focus management\n *\n * **Use cases**:\n * - React Aria focus management\n * - Scroll-to-top features\n * - Dialog auto-focus and scroll behavior\n * - Dropdown and menu positioning\n */\nif (typeof Element !== \"undefined\") {\n  Element.prototype.scrollTo = Element.prototype.scrollTo || (() => {});\n  Element.prototype.scrollIntoView =\n    Element.prototype.scrollIntoView || (() => {});\n}\n\n/**\n * Mock requestAnimationFrame\n *\n * **Why**: Used in animations and transitions\n *\n * **Use cases**:\n * - Chakra UI animations and motion components\n * - React Aria transition hooks\n * - Smooth UI updates and state changes\n * - Custom animation implementations\n */\nif (typeof window !== \"undefined\" && !window.requestAnimationFrame) {\n  window.requestAnimationFrame = (callback: FrameRequestCallback) => {\n    return setTimeout(\n      () => callback(Date.now()),\n      1000 / 60\n    ) as unknown as number;\n  };\n}\n"],"names":["value","error","ResizeObserverMock","IntersectionObserverMock","callback"],"mappings":"AAyCI,OAAO,WAAW,mBAAoB,eAExC,WAAW,kBAAkB,SAAyBA,GAAY;AAChE,MAAIA,KAAU;AACZ,WAAOA;AAGT,MAAI;AAEF,WAAI,OAAOA,KAAU,WACZ,KAAK,MAAM,KAAK,UAAUA,CAAK,CAAC,IAGlCA;AAAA,EACT,SAASC,GAAO;AACd,mBAAQ,KAAK,oCAAoCA,CAAK,GAG/C,MAAM,QAAQD,CAAK,IAAI,CAAC,GAAGA,CAAK,IAAI,EAAE,GAAGA,EAAA;AAAA,EAClD;AACF;AAsCF,IAAI,OAAO,WAAW,iBAAmB,KAAa;AAAA,EACpD,MAAME,EAAmB;AAAA,IACvB,UAAU;AAAA,IAAC;AAAA,IACX,YAAY;AAAA,IAAC;AAAA,IACb,aAAa;AAAA,IAAC;AAAA,EAAA;AAEhB,aAAW,iBACTA;AACJ;AAaA,IAAI,OAAO,WAAW,uBAAyB,KAAa;AAAA,EAC1D,MAAMC,EAAyB;AAAA,IACpB,OAAuB;AAAA,IACvB,aAAqB;AAAA,IACrB,aAAoC,CAAA;AAAA,IAE7C,aAAa;AAAA,IAAC;AAAA,IACd,UAAU;AAAA,IAAC;AAAA,IACX,cAA2C;AACzC,aAAO,CAAA;AAAA,IACT;AAAA,IACA,YAAY;AAAA,IAAC;AAAA,EAAA;AAEf,aAAW,uBACTA;AACJ;AAaI,OAAO,UAAY,QACrB,QAAQ,UAAU,WAAW,QAAQ,UAAU,aAAa,MAAM;AAAC,IACnE,QAAQ,UAAU,iBAChB,QAAQ,UAAU,mBAAmB,MAAM;AAAC;AAc5C,OAAO,SAAW,OAAe,CAAC,OAAO,0BAC3C,OAAO,wBAAwB,CAACC,MACvB;AAAA,EACL,MAAMA,EAAS,KAAK,KAAK;AAAA,EACzB,MAAO;AAAA;"}
+{"version":3,"file":"setup-jsdom-polyfills.es.js","sources":["../src/test/setup-jsdom-polyfills.ts"],"sourcesContent":["/**\n * Polyfills for JSDOM test environments\n *\n * These polyfills prevent `NimbusProvider` from crashing in JSDOM\n * environments (e.g., Jest, Vitest).\n *\n * **Usage with Jest:**\n * ```js\n * // jest.config.js\n * module.exports = {\n *   setupFiles: [\n *     '@commercetools/nimbus/setup-jsdom-polyfills'\n *   ]\n * };\n * ```\n *\n * **Usage with Vitest:**\n * ```ts\n * // vitest.config.ts\n * export default defineConfig({\n *   test: {\n *     setupFiles: [\n *       '@commercetools/nimbus/setup-jsdom-polyfills'\n *     ]\n *   }\n * });\n * ```\n\n */\n\n/**\n * Mock structuredClone\n *\n * **Why**: Required by Chakra UI provider for deep cloning objects\n *\n * **Use cases**:\n * - NimbusProvider initialization\n * - Chakra UI theme configuration\n * - Deep cloning of component state\n * - React context value cloning\n */\nif (typeof globalThis.structuredClone !== \"function\") {\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  globalThis.structuredClone = function structuredClone(value: any) {\n    if (value === null || value === undefined) {\n      return value;\n    }\n\n    try {\n      // For objects and arrays, use JSON methods\n      if (typeof value === \"object\") {\n        return JSON.parse(JSON.stringify(value));\n      }\n      // For primitive values, return directly\n      return value;\n    } catch (error) {\n      console.warn(\"structuredClone polyfill failed:\", error);\n\n      // Returns a shallow copy as fallback\n      return Array.isArray(value) ? [...value] : { ...value };\n    }\n  };\n}\n\n/**\n * Mock window.matchMedia\n *\n * **Why**: Required for responsive design and theme system\n *\n * **Use cases**:\n * - Chakra UI color mode and theme detection\n * - Responsive component behavior\n * - Media query hooks (useMediaQuery)\n * - Breakpoint-based rendering\n */\nif (typeof window !== \"undefined\" && !window.matchMedia) {\n  window.matchMedia = (query: string) =>\n    ({\n      matches: false, // Default, can be overridden in tests\n      media: query,\n      onchange: null,\n      addListener: () => {}, // Deprecated but needed\n      removeListener: () => {}, // Deprecated but needed\n      addEventListener: () => {},\n      removeEventListener: () => {},\n      dispatchEvent: () => false,\n    }) as MediaQueryList;\n}\n\n/**\n * Mock ResizeObserver\n *\n * **Why**: Required for components that adjust based on size\n *\n * **Use cases**:\n * - Chakra UI responsive components\n * - React Aria components with responsive behavior\n * - Components that measure container dimensions\n */\nif (typeof globalThis.ResizeObserver === \"undefined\") {\n  class ResizeObserverMock {\n    observe() {}\n    unobserve() {}\n    disconnect() {}\n  }\n  globalThis.ResizeObserver =\n    ResizeObserverMock as unknown as typeof ResizeObserver;\n}\n\n/**\n * Mock IntersectionObserver\n *\n * **Why**: Required for lazy loading and viewport-based effects\n *\n * **Use cases**:\n * - Components that trigger actions when entering viewport\n * - Infinite scroll implementations\n * - Lazy image loading\n * - Visibility tracking for analytics\n */\nif (typeof globalThis.IntersectionObserver === \"undefined\") {\n  class IntersectionObserverMock {\n    readonly root: Element | null = null;\n    readonly rootMargin: string = \"\";\n    readonly thresholds: ReadonlyArray<number> = [];\n\n    disconnect() {}\n    observe() {}\n    takeRecords(): IntersectionObserverEntry[] {\n      return [];\n    }\n    unobserve() {}\n  }\n  globalThis.IntersectionObserver =\n    IntersectionObserverMock as unknown as typeof IntersectionObserver;\n}\n\n/**\n * Mock Element.prototype scroll methods\n *\n * **Why**: Used by navigation, modals, and focus management\n *\n * **Use cases**:\n * - React Aria focus management\n * - Scroll-to-top features\n * - Dialog auto-focus and scroll behavior\n * - Dropdown and menu positioning\n */\nif (typeof Element !== \"undefined\") {\n  Element.prototype.scrollTo = Element.prototype.scrollTo || (() => {});\n  Element.prototype.scrollIntoView =\n    Element.prototype.scrollIntoView || (() => {});\n}\n\n/**\n * Mock requestAnimationFrame\n *\n * **Why**: Used in animations and transitions\n *\n * **Use cases**:\n * - Chakra UI animations and motion components\n * - React Aria transition hooks\n * - Smooth UI updates and state changes\n * - Custom animation implementations\n */\nif (typeof window !== \"undefined\" && !window.requestAnimationFrame) {\n  window.requestAnimationFrame = (callback: FrameRequestCallback) => {\n    return setTimeout(\n      () => callback(Date.now()),\n      1000 / 60\n    ) as unknown as number;\n  };\n}\n"],"names":["value","error","query","ResizeObserverMock","IntersectionObserverMock","callback"],"mappings":"AAyCI,OAAO,WAAW,mBAAoB,eAExC,WAAW,kBAAkB,SAAyBA,GAAY;AAChE,MAAIA,KAAU;AACZ,WAAOA;AAGT,MAAI;AAEF,WAAI,OAAOA,KAAU,WACZ,KAAK,MAAM,KAAK,UAAUA,CAAK,CAAC,IAGlCA;AAAA,EACT,SAASC,GAAO;AACd,mBAAQ,KAAK,oCAAoCA,CAAK,GAG/C,MAAM,QAAQD,CAAK,IAAI,CAAC,GAAGA,CAAK,IAAI,EAAE,GAAGA,EAAA;AAAA,EAClD;AACF;AAcE,OAAO,SAAW,OAAe,CAAC,OAAO,eAC3C,OAAO,aAAa,CAACE,OAClB;AAAA,EACC,SAAS;AAAA;AAAA,EACT,OAAOA;AAAA,EACP,UAAU;AAAA,EACV,aAAa,MAAM;AAAA,EAAC;AAAA;AAAA,EACpB,gBAAgB,MAAM;AAAA,EAAC;AAAA;AAAA,EACvB,kBAAkB,MAAM;AAAA,EAAC;AAAA,EACzB,qBAAqB,MAAM;AAAA,EAAC;AAAA,EAC5B,eAAe,MAAM;AAAA;AAc3B,IAAI,OAAO,WAAW,iBAAmB,KAAa;AAAA,EACpD,MAAMC,EAAmB;AAAA,IACvB,UAAU;AAAA,IAAC;AAAA,IACX,YAAY;AAAA,IAAC;AAAA,IACb,aAAa;AAAA,IAAC;AAAA,EAAA;AAEhB,aAAW,iBACTA;AACJ;AAaA,IAAI,OAAO,WAAW,uBAAyB,KAAa;AAAA,EAC1D,MAAMC,EAAyB;AAAA,IACpB,OAAuB;AAAA,IACvB,aAAqB;AAAA,IACrB,aAAoC,CAAA;AAAA,IAE7C,aAAa;AAAA,IAAC;AAAA,IACd,UAAU;AAAA,IAAC;AAAA,IACX,cAA2C;AACzC,aAAO,CAAA;AAAA,IACT;AAAA,IACA,YAAY;AAAA,IAAC;AAAA,EAAA;AAEf,aAAW,uBACTA;AACJ;AAaI,OAAO,UAAY,QACrB,QAAQ,UAAU,WAAW,QAAQ,UAAU,aAAa,MAAM;AAAC,IACnE,QAAQ,UAAU,iBAChB,QAAQ,UAAU,mBAAmB,MAAM;AAAC;AAc5C,OAAO,SAAW,OAAe,CAAC,OAAO,0BAC3C,OAAO,wBAAwB,CAACC,MACvB;AAAA,EACL,MAAMA,EAAS,KAAK,KAAK;AAAA,EACzB,MAAO;AAAA;"}

package/dist/theme/semantic-tokens/colors.d.ts

@@ -6201,10 +6201,7 @@ export declare const colors: {
     };
     fg: {
         DEFAULT: {
-            value: {
-                _light: string;
-                _dark: string;
-            };
+            value: string;
         };
     };
     border: {
@@ -12440,10 +12437,7 @@ export declare const darkColors: {
     };
     fg: {
         DEFAULT: {
-            value: {
-                _light: string;
-                _dark: string;
-            };
+            value: string;
         };
     };
     border: {

package/dist/theme/semantic-tokens/index.d.ts

@@ -6202,10 +6202,7 @@ export declare const semanticTokens: {
         };
         fg: {
             DEFAULT: {
-                value: {
-                    _light: string;
-                    _dark: string;
-                };
+                value: string;
             };
         };
         border: {

package/dist/theme/slot-recipes/index.d.ts

@@ -169,7 +169,7 @@ export declare const slotRecipes: {
             ghost: {};
         };
     }>;
-    dataTable: import('@chakra-ui/react').SlotRecipeDefinition<"table" | "root" | "body" | "footer" | "header" | "cell" | "column" | "row" | "selectionCell" | "expandButton" | "nestedIcon" | "headerSortIcon" | "columnResizer", {
+    dataTable: import('@chakra-ui/react').SlotRecipeDefinition<"table" | "root" | "body" | "footer" | "header" | "cell" | "row" | "column" | "selectionCell" | "expandButton" | "nestedIcon" | "headerSortIcon" | "columnResizer", {
         truncated: {
             true: {
                 root: {
@@ -214,54 +214,55 @@ export declare const slotRecipes: {
             };
         };
     }>;
-    combobox: import('@chakra-ui/react').SlotRecipeDefinition<"root" | "popover" | "option" | "value" | "leadingElement" | "options" | "optionGroup" | "buttonGroup" | "multiSelectInput" | "optionIndicator" | "optionContent", {
+    combobox: import('@chakra-ui/react').SlotRecipeDefinition<"root" | "trigger" | "popover" | "content" | "input" | "option" | "section" | "leadingElement" | "tagGroup" | "listBox" | "optionIndicator" | "optionContent", {
         size: {
             sm: {
-                value: {
+                trigger: {
                     minH: "800";
                     textStyle: "sm";
-                    pl: "calc(var(--leading-element-width) + {sizes.100})";
                 };
                 leadingElement: {
                     minH: "800";
-                    pl: "300";
                 };
             };
             md: {
-                value: {
+                trigger: {
                     minH: "1000";
                     textStyle: "md";
-                    pl: "calc(var(--leading-element-width) + {sizes.200})";
                 };
                 leadingElement: {
                     minH: "1000";
-                    pl: "400";
                 };
             };
         };
         variant: {
             solid: {
                 root: {
+                    bg: "primary.1";
+                    "&:hover:not([data-disabled='true'])": {
+                        bg: "primary.2";
+                    };
                     width: "7200";
                 };
-                value: {
+                trigger: {
+                    "--border-width": "sizes.25";
+                    "--border-color": "colors.neutral.7";
                     width: "100%";
-                    "--border-width"?: "sizes.25" | undefined;
-                    "--border-color"?: "colors.neutral.7" | undefined;
                 };
             };
             ghost: {
                 root: {
-                    maxW: "7200";
-                    bg?: "transparent" | undefined;
-                    "&:hover"?: {
+                    bg: "transparent";
+                    "&:hover:not([data-disabled='true'])": {
                         bg: "primaryAlpha.2";
-                    } | undefined;
+                    };
+                    width: "7200";
                 };
-                value: {
+                trigger: {
+                    "--border-width": "sizes.25";
+                    "--border-color": "transparent";
                     bg: "transparent";
-                    "--border-width"?: "sizes.25" | undefined;
-                    "--border-color"?: "transparent" | undefined;
+                    width: "100%";
                 };
             };
         };
@@ -555,22 +556,23 @@ export declare const slotRecipes: {
             };
         };
     }>;
-    tabs: import('@chakra-ui/react').SlotRecipeDefinition<"list" | "root" | "trigger" | "panel" | "tab" | "panels", {
+    tabs: import('@chakra-ui/react').SlotRecipeDefinition<"list" | "root" | "trigger" | "tab" | "panel" | "panels", {
+        variant: {
+            line: {};
+            pills: {
+                tab: {
+                    borderRadius: "full";
+                    _selected: {
+                        backgroundColor: "primary.3";
+                    };
+                };
+            };
+        };
         orientation: {
             horizontal: {
                 root: {
                     flexDirection: "column";
                 };
-                list: {
-                    borderBottom: "{spacing.25} {colors.neutral.6} solid";
-                };
-                tab: {
-                    borderBottom: "{spacing.50} solid transparent";
-                    marginRight: "-25";
-                    _selected: {
-                        borderBottomColor: "primary.9";
-                    };
-                };
             };
             vertical: {
                 root: {
@@ -678,7 +680,7 @@ export declare const slotRecipes: {
         backgroundStyle: {
             default: {
                 root: {
-                    backgroundColor: "colorPalette.contrast";
+                    backgroundColor: "bg";
                 };
             };
             muted: {
@@ -846,7 +848,7 @@ export declare const slotRecipes: {
             };
         };
     }>;
-    moneyInput: import('@chakra-ui/react').SlotRecipeDefinition<"root" | "container" | "currencySelect" | "currencyLabel" | "amountInput" | "badge", {
+    moneyInput: import('@chakra-ui/react').SlotRecipeDefinition<"root" | "container" | "badge" | "currencySelect" | "currencyLabel" | "amountInput", {
         size: {
             sm: {
                 root: {
@@ -1108,7 +1110,7 @@ export declare const slotRecipes: {
             ghost: {};
         };
     }>;
-    select: import('@chakra-ui/react').SlotRecipeDefinition<"root" | "trigger" | "option" | "leadingElement" | "triggerLabel" | "options" | "optionGroup", {
+    select: import('@chakra-ui/react').SlotRecipeDefinition<"root" | "trigger" | "option" | "leadingElement" | "options" | "triggerLabel" | "optionGroup", {
         size: {
             sm: {
                 root: {};

package/dist/type-utils/shared-types.d.ts

@@ -1,3 +1,4 @@
+import { SEMANTIC_COLOR_PALETTES, ALL_COLOR_PALETTES } from '../constants/color-palettes';
 import { ConditionalValue } from '@chakra-ui/react';
 /**
  * Date value type from @internationalized/date
@@ -10,9 +11,16 @@ export type { DateValue } from '@internationalized/date';
  */
 export type { TimeValue } from 'react-aria';
 /**
- * Key type for collection items from react-aria-components
- * Used by: Select, ComboBox, Menu, TagGroup, DataTable, and other collection components
+ * Union type of all available color palette names.
+ * Derived from ALL_PALETTES constant to ensure type safety when referencing palettes.
+ */
+export type NimbusColorPalette = (typeof ALL_COLOR_PALETTES)[number];
+/**
+ * Union type of all available semantic palette names.
+ * Derived from SEMANTIC_PALETTES constant to ensure type safety when referencing palettes.
+ */
+type SemanticColorPalette = (typeof SEMANTIC_COLOR_PALETTES)[number];
+/**
+ * Utility Type that narrows the colorPalette prop in chakra-ui recipes to only accept semantic color palettes
  */
-export type { Key } from 'react-aria-components';
-type SemanticColorPalette = "primary" | "neutral" | "info" | "positive" | "warning" | "critical";
 export type SemanticPalettesOnly = ConditionalValue<SemanticColorPalette>;

package/dist/utils/display-color-palettes.d.ts

@@ -0,0 +1,39 @@
+import { ReactNode } from 'react';
+import { NimbusColorPalette } from '../type-utils';
+/**
+ * Props for the DisplayColorPalettes component.
+ */
+type DisplayColorPalettesProps = {
+    /**
+     * Render function that receives a color palette string and returns a ReactNode.
+     * This function is called for each palette in each palette group, allowing
+     * components to be rendered with different colorPalette props.
+     *
+     * @example
+     * <DisplayColorPalettes>
+     *   {(palette) => <Badge colorPalette={palette}>{palette}</Badge>}
+     * </DisplayColorPalettes>
+     */
+    children: (palette: NimbusColorPalette) => ReactNode;
+};
+/**
+ * Component for displaying all color palettes in organized groups.
+ *
+ * This utility component iterates through semantic, brand, and system color
+ * palettes, rendering a custom component for each palette using the provided
+ * render function. Useful for showcasing component variations across all
+ * available color palettes in Storybook stories.
+ *
+ * @example
+ * ```tsx
+ * <DisplayColorPalettes>
+ *   {(palette) => (
+ *     <Badge colorPalette={palette}>
+ *       {palette}
+ *     </Badge>
+ *   )}
+ * </DisplayColorPalettes>
+ * ```
+ */
+export declare const DisplayColorPalettes: ({ children, }: DisplayColorPalettesProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/utils/index.d.ts

@@ -1,3 +1,4 @@
+export { DisplayColorPalettes } from './display-color-palettes';
 export { extractAriaAttributes } from './extract-aria-attributes';
 export { extractStyleProps } from './extract-style-props';
 export { noop } from './no-op';

package/dist/utils/normalize-messages.d.ts

@@ -0,0 +1,10 @@
+import { LocalizedString } from '@internationalized/string';
+/**
+ * Normalizes compiled messages to match LocalizedString signature.
+ *
+ * This function adapts messages compiled by @internationalized/string-compiler
+ * to match the signature expected by LocalizedStringDictionary.
+ *
+ * @see packages/i18n/README.md for detailed explanation of why this normalization is needed.
+ */
+export declare function normalizeMessages(messages: Record<string, string | ((args: Record<string, string | number>) => string)>): Record<string, LocalizedString>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@commercetools/nimbus",
-  "version": "2.1.0",
+  "version": "2.3.0",
   "main": "./dist/index.cjs",
   "module": "./dist/index.es.js",
   "type": "module",
@@ -50,6 +50,7 @@
   },
   "dependencies": {
     "@emotion/is-prop-valid": "^1.4.0",
+    "@internationalized/string": "^3.2.7",
     "@react-aria/interactions": "3.25.6",
     "dequal": "^2.0.3",
     "escape-html": "^1.0.3",
@@ -59,61 +60,64 @@
     "react-aria-components": "1.13.0",
     "react-hotkeys-hook": "^5.2.1",
     "react-stately": "3.42.0",
-    "react-use": "^17.5.1"
+    "react-use": "^17.5.1",
+    "use-debounce": "^10.1.0"
   },
   "devDependencies": {
-    "@chakra-ui/cli": "^3.27.1",
-    "@chakra-ui/react": "^3.27.1",
-    "@internationalized/date": "^3.10.0",
+    "@chakra-ui/cli": "^3.31.0",
+    "@chakra-ui/react": "^3.31.0",
+    "@internationalized/date": "^3.10.1",
     "@react-aria/optimize-locales-plugin": "1.1.5",
-    "@storybook/addon-a11y": "^9.1.13",
-    "@storybook/addon-docs": "^9.1.13",
-    "@storybook/addon-vitest": "^9.1.13",
-    "@storybook/react-vite": "^9.1.13",
+    "@react-types/shared": "^3.32.1",
+    "@storybook/addon-a11y": "^10.1.11",
+    "@storybook/addon-docs": "^10.1.11",
+    "@storybook/addon-vitest": "^10.1.11",
+    "@storybook/react-vite": "^10.1.11",
     "@testing-library/jest-dom": "^6.9.1",
-    "@testing-library/react": "^16.3.0",
+    "@testing-library/react": "^16.3.1",
     "@testing-library/user-event": "^14.6.1",
     "@types/escape-html": "^1.0.4",
     "@types/is-hotkey": "^0.1.10",
     "@types/jsdom": "^27.0.0",
-    "@types/react": "^19.0.0",
-    "@types/react-dom": "^19.0.0",
-    "@vitejs/plugin-react": "^5.0.4",
-    "@vitest/browser": "^3.2.4",
-    "@vitest/coverage-v8": "^3.2.4",
-    "@vueless/storybook-dark-mode": "^9.0.9",
+    "@types/react": "^19.2.8",
+    "@types/react-dom": "^19.2.3",
+    "@vitejs/plugin-react": "^5.1.2",
+    "@vitest/browser": "^4.0.17",
+    "@vitest/browser-playwright": "^4.0.17",
+    "@vitest/coverage-v8": "^4.0.17",
+    "@vueless/storybook-dark-mode": "^10.0.6",
     "apca-w3": "^0.1.9",
     "axe-core": "^4.11.0",
-    "dompurify": "^3.3.0",
+    "dompurify": "^3.3.1",
     "glob": "^11.0.3",
-    "jsdom": "^27.0.1",
-    "playwright": "^1.56.1",
+    "jsdom": "^27.4.0",
+    "playwright": "^1.57.0",
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
     "react-intl": "^7.1.13",
+    "rollup": "^4.55.1",
     "rollup-plugin-tree-shakeable": "^2.0.0",
     "slate": "^0.75.0",
     "slate-history": "^0.113.1",
     "slate-hyperscript": "^0.77.0",
     "slate-react": "^0.75.0",
-    "storybook": "^9.1.13",
-    "vite": "^7.1.11",
+    "storybook": "^10.1.11",
+    "vite": "^7.3.1",
     "vite-plugin-dts": "^4.5.4",
     "vite-tsconfig-paths": "^5.1.4",
-    "vitest": "^3.2.4",
-    "@commercetools/nimbus-icons": "^2.1.0",
-    "@commercetools/nimbus-tokens": "^2.1.0"
+    "vitest": "^4.0.17",
+    "@commercetools/nimbus-icons": "^2.3.0",
+    "@commercetools/nimbus-tokens": "^2.3.0"
   },
   "peerDependencies": {
-    "@chakra-ui/react": "^3.27.1",
+    "@chakra-ui/react": "^3.31.0",
     "react": "19.x",
-    "react-intl": "7.x",
     "slate": "^0.75.0",
     "slate-history": "^0.113.1",
     "slate-hyperscript": "^0.77.0",
     "slate-react": "^0.75.0",
-    "@commercetools/nimbus-icons": "^2.1.0",
-    "@commercetools/nimbus-tokens": "^2.1.0"
+    "@commercetools/nimbus-icons": "^2.3.0",
+    "@commercetools/nimbus-tokens": "^2.3.0"
   },
   "scripts": {
     "build": "pnpm run build-theme-typings && pnpm run build:lib",