@autoguru/overdrive 4.45.2 → 4.47.0

package/dist/utils/utils.spec.js

@@ -0,0 +1,342 @@
+"use strict";
+
+import { renderHook, act } from '@testing-library/react';
+import React from 'react';
+import { describe, expect, it, vi, beforeEach, afterEach } from 'vitest';
+import { useId, setRef, mergeRefs, isHtmlElement, hex2rgba, ownerDocument, ownerWindow, useEventCallback, useUncontrolledState, useInputControlledState, animate, arrayRingLookup } from "./index.js"; // Mock requestAnimationFrame for animate tests
+const mockRequestAnimationFrame = vi.fn();
+const mockCancelAnimationFrame = vi.fn();
+Object.defineProperty(window, 'requestAnimationFrame', {
+  writable: true,
+  value: mockRequestAnimationFrame
+});
+Object.defineProperty(window, 'cancelAnimationFrame', {
+  writable: true,
+  value: mockCancelAnimationFrame
+});
+describe('Utils', () => {
+  beforeEach(() => {
+    vi.clearAllMocks();
+    mockRequestAnimationFrame.mockClear();
+    mockCancelAnimationFrame.mockClear();
+  });
+  afterEach(() => {
+    vi.restoreAllMocks();
+  });
+  describe('useId', () => {
+    it('generates unique IDs', () => {
+      const {
+        result: result1
+      } = renderHook(() => useId());
+      const {
+        result: result2
+      } = renderHook(() => useId());
+      expect(result1.current).toBeTruthy();
+      expect(result2.current).toBeTruthy();
+      expect(result1.current).not.toBe(result2.current);
+    });
+    it('generates consistent ID for same hook instance', () => {
+      const {
+        result,
+        rerender
+      } = renderHook(() => useId());
+      const firstId = result.current;
+      rerender();
+      expect(result.current).toBe(firstId);
+    });
+    it('uses provided prefix', () => {
+      const {
+        result
+      } = renderHook(() => useId('test-prefix'));
+      expect(result.current).toContain('test-prefix');
+    });
+  });
+  describe('setRef', () => {
+    it('sets ref object current value', () => {
+      const refObject = {
+        current: null
+      };
+      const value = document.createElement('div');
+      setRef(refObject, value);
+      expect(refObject.current).toBe(value);
+    });
+    it('calls ref function', () => {
+      const refFunction = vi.fn();
+      const value = document.createElement('div');
+      setRef(refFunction, value);
+      expect(refFunction).toHaveBeenCalledWith(value);
+    });
+    it('handles null ref gracefully', () => {
+      const value = document.createElement('div');
+      expect(() => setRef(null, value)).not.toThrow();
+    });
+    it('handles undefined ref gracefully', () => {
+      const value = document.createElement('div');
+      expect(() => setRef(undefined, value)).not.toThrow();
+    });
+  });
+  describe('mergeRefs', () => {
+    it('merges ref objects', () => {
+      const ref1 = /*#__PURE__*/React.createRef();
+      const ref2 = /*#__PURE__*/React.createRef();
+      const value = document.createElement('div');
+      const mergedRef = mergeRefs([ref1, ref2]);
+      mergedRef(value);
+      expect(ref1.current).toBe(value);
+      expect(ref2.current).toBe(value);
+    });
+    it('merges ref functions', () => {
+      const ref1 = vi.fn();
+      const ref2 = vi.fn();
+      const value = document.createElement('div');
+      const mergedRef = mergeRefs([ref1, ref2]);
+      mergedRef(value);
+      expect(ref1).toHaveBeenCalledWith(value);
+      expect(ref2).toHaveBeenCalledWith(value);
+    });
+    it('handles mixed ref types', () => {
+      const refObject = /*#__PURE__*/React.createRef();
+      const refFunction = vi.fn();
+      const value = document.createElement('div');
+      const mergedRef = mergeRefs([refObject, refFunction]);
+      mergedRef(value);
+      expect(refObject.current).toBe(value);
+      expect(refFunction).toHaveBeenCalledWith(value);
+    });
+    it('handles null and undefined refs', () => {
+      const ref = /*#__PURE__*/React.createRef();
+      const value = document.createElement('div');
+      const mergedRef = mergeRefs([ref, null, undefined]);
+      expect(() => mergedRef(value)).not.toThrow();
+      expect(ref.current).toBe(value);
+    });
+  });
+  describe('isHtmlElement', () => {
+    it('returns true for Element instances', () => {
+      const div = document.createElement('div');
+      expect(isHtmlElement(div)).toBe(true);
+    });
+    it('returns true for Document instances', () => {
+      expect(isHtmlElement(document)).toBe(true);
+    });
+    it('returns false for non-DOM objects', () => {
+      expect(isHtmlElement({})).toBe(false);
+      expect(isHtmlElement('string')).toBe(false);
+      expect(isHtmlElement(123)).toBe(false);
+      expect(isHtmlElement(null)).toBe(false);
+      let undefinedValue;
+      expect(isHtmlElement(undefinedValue)).toBe(false);
+    });
+  });
+  describe('hex2rgba', () => {
+    it('converts hex color to rgba', () => {
+      expect(hex2rgba('#ff0000')).toBe('rgb(255,0,0,1)');
+      expect(hex2rgba('#00ff00')).toBe('rgb(0,255,0,1)');
+      expect(hex2rgba('#0000ff')).toBe('rgb(0,0,255,1)');
+    });
+    it('handles custom alpha values', () => {
+      expect(hex2rgba('#ff0000', '0.5')).toBe('rgb(255,0,0,0.5)');
+      expect(hex2rgba('#000000', '0')).toBe('rgb(0,0,0,0)');
+    });
+    it('handles uppercase hex values', () => {
+      expect(hex2rgba('#FF0000')).toBe('rgb(255,0,0,1)');
+    });
+    it('handles mixed case hex values', () => {
+      expect(hex2rgba('#Ff00Aa')).toBe('rgb(255,0,170,1)');
+    });
+  });
+  describe('ownerDocument', () => {
+    it('returns node ownerDocument when available', () => {
+      const div = document.createElement('div');
+      expect(ownerDocument(div)).toBe(document);
+    });
+    it('returns global document when node is undefined', () => {
+      expect(ownerDocument()).toBe(document);
+    });
+    it('returns global document when node has no ownerDocument', () => {
+      const nodeWithoutOwner = {
+        ownerDocument: null
+      };
+      expect(ownerDocument(nodeWithoutOwner)).toBe(document);
+    });
+  });
+  describe('ownerWindow', () => {
+    it('returns window from node ownerDocument', () => {
+      const div = document.createElement('div');
+      expect(ownerWindow(div)).toBe(window);
+    });
+    it('returns global window when node is undefined', () => {
+      expect(ownerWindow()).toBe(window);
+    });
+  });
+  describe('useEventCallback', () => {
+    it('returns a stable callback function', () => {
+      const fn = vi.fn();
+      const {
+        result,
+        rerender
+      } = renderHook(() => useEventCallback(fn));
+      const callback1 = result.current;
+      rerender();
+      const callback2 = result.current;
+      expect(callback1).toBe(callback2);
+    });
+    it('calls the latest version of the function', () => {
+      let fn = vi.fn();
+      const {
+        result,
+        rerender
+      } = renderHook(({
+        fn
+      }) => useEventCallback(fn), {
+        initialProps: {
+          fn
+        }
+      });
+
+      // Call initial version
+      result.current('test1');
+      expect(fn).toHaveBeenCalledWith('test1');
+
+      // Update function and rerender
+      fn = vi.fn();
+      rerender({
+        fn
+      });
+
+      // Call updated version
+      result.current('test2');
+      expect(fn).toHaveBeenCalledWith('test2');
+    });
+  });
+  describe('useUncontrolledState', () => {
+    it('returns controlled state when onChange is provided', () => {
+      const onChange = vi.fn();
+      const {
+        result
+      } = renderHook(() => useUncontrolledState('test', onChange));
+      const [value, setter] = result.current;
+      expect(value).toBe('test');
+      expect(setter).toBe(onChange);
+    });
+    it('returns uncontrolled state when onChange is not provided', () => {
+      const {
+        result
+      } = renderHook(() => useUncontrolledState('test'));
+      const [value, setter] = result.current;
+      expect(value).toBe('test');
+      expect(typeof setter).toBe('function');
+      expect(setter).not.toBe(undefined);
+    });
+    it('updates uncontrolled state when setter is called', () => {
+      const {
+        result
+      } = renderHook(() => useUncontrolledState('initial'));
+      const [, setter] = result.current;
+      act(() => {
+        setter('updated');
+      });
+      const [newValue] = result.current;
+      expect(newValue).toBe('updated');
+    });
+  });
+  describe('useInputControlledState', () => {
+    it('returns controlled state when onChange is provided', () => {
+      const onChange = vi.fn();
+      const {
+        result
+      } = renderHook(() => useInputControlledState('test', onChange));
+      const [value, handler] = result.current;
+      expect(value).toBe('test');
+      expect(handler).toBe(onChange);
+    });
+    it('returns uncontrolled state when onChange is not provided', () => {
+      const {
+        result
+      } = renderHook(() => useInputControlledState('test'));
+      const [value, handler] = result.current;
+      expect(value).toBe('test');
+      expect(typeof handler).toBe('function');
+    });
+    it('handles input events in uncontrolled mode', () => {
+      const {
+        result
+      } = renderHook(() => useInputControlledState('initial'));
+      const [, handler] = result.current;
+
+      // Simulate input event
+      const event = {
+        target: {
+          value: 'new value'
+        }
+      };
+      act(() => {
+        handler(event);
+      });
+      const [newValue] = result.current;
+      expect(newValue).toBe('new value');
+    });
+  });
+  describe('animate', () => {
+    beforeEach(() => {
+      // Mock performance.now for consistent testing
+      vi.spyOn(performance, 'now').mockReturnValue(0);
+    });
+    it('returns cancellation function', () => {
+      const element = {
+        scrollTop: 0
+      };
+      const cancel = animate(element, 'scrollTop', 100);
+      expect(typeof cancel).toBe('function');
+    });
+    it('starts animation with requestAnimationFrame', () => {
+      const element = {
+        scrollTop: 0
+      };
+      animate(element, 'scrollTop', 100);
+      expect(mockRequestAnimationFrame).toHaveBeenCalled();
+    });
+  });
+  describe('arrayRingLookup', () => {
+    const array = ['a', 'b', 'c'];
+    it('returns function that looks up array values', () => {
+      const lookup = arrayRingLookup(array);
+      expect(typeof lookup).toBe('function');
+    });
+    it('handles positive indices', () => {
+      const lookup = arrayRingLookup(array);
+      expect(lookup(0)).toBe('a');
+      expect(lookup(1)).toBe('b');
+      expect(lookup(2)).toBe('c');
+    });
+    it('wraps around for indices beyond array length', () => {
+      const lookup = arrayRingLookup(array);
+      expect(lookup(3)).toBe('a');
+      expect(lookup(4)).toBe('b');
+      expect(lookup(5)).toBe('c');
+    });
+    it('handles negative indices', () => {
+      const lookup = arrayRingLookup(array);
+      expect(lookup(-1)).toBe('c');
+      expect(lookup(-2)).toBe('b');
+      expect(lookup(-3)).toBe('a');
+    });
+    it('handles large negative indices', () => {
+      const lookup = arrayRingLookup(array);
+      expect(lookup(-4)).toBe('c');
+      expect(lookup(-5)).toBe('b');
+    });
+    it('handles empty arrays', () => {
+      const lookup = arrayRingLookup([]);
+      expect(lookup(0)).toBeUndefined();
+      expect(lookup(1)).toBeUndefined();
+      expect(lookup(-1)).toBeUndefined();
+    });
+    it('handles single element arrays', () => {
+      const lookup = arrayRingLookup(['only']);
+      expect(lookup(0)).toBe('only');
+      expect(lookup(1)).toBe('only');
+      expect(lookup(-1)).toBe('only');
+    });
+  });
+});

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@autoguru/overdrive",
-	"version": "4.45.2",
+	"version": "4.47.0",
 	"description": "Overdrive is a product component library, and design system for AutoGuru.",
 	"types": "dist/index.d.ts",
 	"main": "dist/index.js",
@@ -64,39 +64,39 @@
 		"@autoguru/tsconfig": "1.3.1",
 		"@autoguru/utilities": "^1.3.3",
 		"@babel/cli": "7.28.3",
-		"@babel/core": "7.28.3",
+		"@babel/core": "7.28.4",
 		"@babel/plugin-proposal-class-properties": "7.18.6",
 		"@babel/plugin-proposal-export-default-from": "7.27.1",
 		"@babel/plugin-proposal-nullish-coalescing-operator": "7.18.6",
 		"@babel/plugin-proposal-object-rest-spread": "7.20.7",
 		"@babel/plugin-proposal-optional-chaining": "7.21.0",
 		"@babel/plugin-syntax-dynamic-import": "7.8.3",
-		"@babel/plugin-transform-classes": "7.28.3",
+		"@babel/plugin-transform-classes": "7.28.4",
 		"@babel/plugin-transform-runtime": "7.28.3",
 		"@babel/plugin-transform-spread": "7.27.1",
 		"@babel/plugin-transform-strict-mode": "7.27.1",
 		"@babel/preset-env": "7.28.3",
 		"@babel/preset-react": "7.27.1",
 		"@babel/preset-typescript": "7.27.1",
-		"@babel/runtime-corejs3": "7.28.3",
+		"@babel/runtime-corejs3": "7.28.4",
 		"@changesets/cli": "2.29.6",
 		"@chromatic-com/storybook": "4.1.1",
-		"@internationalized/date": "3.8.2",
+		"@internationalized/date": "3.9.0",
 		"@octokit/rest": "22.0.0",
 		"@popperjs/core": "2.11.8",
-		"@react-stately/toggle": "3.8.5",
-		"@storybook/addon-a11y": "9.1.3",
-		"@storybook/addon-docs": "9.1.3",
-		"@storybook/addon-links": "9.1.3",
-		"@storybook/addon-onboarding": "9.1.3",
-		"@storybook/addon-vitest": "9.1.3",
-		"@storybook/react-vite": "9.1.3",
+		"@react-stately/toggle": "3.9.1",
+		"@storybook/addon-a11y": "9.1.5",
+		"@storybook/addon-docs": "9.1.5",
+		"@storybook/addon-links": "9.1.5",
+		"@storybook/addon-onboarding": "9.1.5",
+		"@storybook/addon-vitest": "9.1.5",
+		"@storybook/react-vite": "9.1.5",
 		"@testing-library/dom": "^10.4.1",
 		"@testing-library/jest-dom": "6.8.0",
 		"@testing-library/react": "16.3.0",
 		"@testing-library/react-hooks": "8.0.1",
 		"@testing-library/user-event": "14.6.1",
-		"@types/node": "24.3.0",
+		"@types/node": "24.3.1",
 		"@types/react": "19.1.12",
 		"@types/react-dom": "19.1.9",
 		"@types/webpack-env": "1.18.8",
@@ -110,7 +110,7 @@
 		"@vanilla-extract/webpack-plugin": "2.3.22",
 		"@vitest/browser": "3.2.4",
 		"@vitest/coverage-v8": "3.2.4",
-		"@vitest/eslint-plugin": "1.3.5",
+		"@vitest/eslint-plugin": "1.3.9",
 		"babel-plugin-add-import-extension": "1.6.0",
 		"babel-plugin-dev-expression": "0.2.3",
 		"babel-plugin-macros": "3.1.0",
@@ -124,35 +124,35 @@
 		"deepmerge": "4.3.1",
 		"es-toolkit": "1.39.10",
 		"eslint": "9.34.0",
-		"eslint-plugin-storybook": "9.1.3",
+		"eslint-plugin-storybook": "9.1.5",
 		"husky": "9.1.7",
 		"intersection-observer": "0.12.2",
 		"jsdom": "26.1.0",
-		"lint-staged": "16.1.5",
-		"magic-string": "0.30.18",
+		"lint-staged": "16.1.6",
+		"magic-string": "0.30.19",
 		"mini-css-extract-plugin": "2.9.4",
 		"mockdate": "3.0.5",
 		"playwright": "1.55.0",
-		"plop": "4.0.1",
+		"plop": "4.0.2",
 		"postcss": "8.5.6",
 		"prettier": "3.6.2",
 		"prop-types": "15.8.1",
 		"rand-seed": "3.0.0",
 		"react": "19.1.1",
-		"react-aria": "3.41.1",
-		"react-aria-components": "1.10.1",
+		"react-aria": "3.43.1",
+		"react-aria-components": "1.12.1",
 		"react-dom": "19.1.1",
 		"react-focus-lock": "2.13.6",
 		"react-intersection-observer": "9.16.0",
 		"react-keyed-flatten-children": "5.0.1",
-		"react-stately": "3.39.0",
+		"react-stately": "3.41.0",
 		"react-swipeable": "7.0.2",
 		"rollup-plugin-visualizer": "6.0.3",
-		"storybook": "9.1.3",
+		"storybook": "9.1.5",
 		"storybook-addon-tag-badges": "2.0.2",
 		"typescript": "5.9.2",
 		"url-loader": "4.1.1",
-		"vite": "7.1.3",
+		"vite": "7.1.5",
 		"vitest": "3.2.4",
 		"webpack": "5.101.3"
 	},
@@ -168,7 +168,7 @@
 		"csstype": "^3.1.3",
 		"es-toolkit": "^1.34.1",
 		"react": ">=18 || >=19.0.0-rc.0",
-		"react-aria": "^3.38.1",
+		"react-aria": "^3.43.1",
 		"react-dom": ">=18 || >=19.0.0-rc.0",
 		"react-focus-lock": "^2.13.6",
 		"react-intersection-observer": ">=9.16.0",
@@ -177,7 +177,7 @@
 		"webpack": "*"
 	},
 	"volta": {
-		"node": "22.18.0",
+		"node": "22.19.0",
 		"yarn": "4.9.4"
 	},
 	"packageManager": "yarn@4.9.4"

package/dist/components/DateTimePicker/CalendarButton.d.ts

@@ -1,4 +0,0 @@
-import React from 'react';
-import { type AriaButtonProps } from 'react-aria';
-export declare const CalendarButton: (props: AriaButtonProps) => React.JSX.Element;
-//# sourceMappingURL=CalendarButton.d.ts.map

package/dist/components/DateTimePicker/CalendarButton.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"CalendarButton.d.ts","sourceRoot":"","sources":["../../../lib/components/DateTimePicker/CalendarButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAiB,MAAM,OAAO,CAAC;AACtC,OAAO,EAAa,KAAK,eAAe,EAAE,MAAM,YAAY,CAAC;AAI7D,eAAO,MAAM,cAAc,GAAI,OAAO,eAAe,sBAQpD,CAAC"}

package/dist/components/DateTimePicker/CalendarGrid.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"CalendarGrid.d.ts","sourceRoot":"","sources":["../../../lib/components/DateTimePicker/CalendarGrid.tsx"],"names":[],"mappings":"AACA,OAAO,KAAiB,MAAM,OAAO,CAAC;AACtC,OAAO,EAKN,KAAK,qBAAqB,EAC1B,MAAM,YAAY,CAAC;AACpB,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AA8CnD,UAAU,iBAAkB,SAAQ,qBAAqB;IACxD,KAAK,EAAE,aAAa,CAAC;CACrB;AAED,eAAO,MAAM,YAAY,GAAI,qBAAqB,iBAAiB,sBA2ClE,CAAC"}