@autoguru/overdrive 4.43.9-next.0 → 4.43.10-next.0

package/dist/utils/index.js

@@ -3,6 +3,8 @@
 import { useCallback, useEffect, useLayoutEffect, useRef, useState } from 'react';
 export const isBrowser = typeof window !== 'undefined';
 export const isomorphicLayoutEffect = isBrowser ? useLayoutEffect : useEffect;
+
+// eslint-disable-next-line @typescript-eslint/no-unnecessary-type-constraint
 export const useUncontrolledState = (value, onChange) => {
   if (typeof onChange === 'function') {
     return [value, onChange];
@@ -21,6 +23,13 @@ export const useInputControlledState = (incomingValue, incomingOnChange) => {
 let id = 0;
 const genId = () => ++id;
 let serverHandoffComplete = false;
+
+/*
+For rationale around this file, please see @reach-ui/auto-id's comments. We have opted to not use the npm package as they
+	import a series of utils that arent tree-shakable. And something that is too big to include for now.
+
+@see https://github.com/reach/reach-ui/blob/983acb60ee9ac64b1b708523b44f660c65af6726/packages/auto-id/src/index.ts#L1-L55
+ */
 export const useId = idFromProps => {
   const initialId = idFromProps !== null && idFromProps !== void 0 ? idFromProps : serverHandoffComplete ? genId() : null;
   const [id, setId] = useState(initialId);
@@ -43,6 +52,12 @@ export const setRef = (ref, value) => {
     ref.current = value;
   }
 };
+
+/**
+ * Used to merge multiple refs into a single ref callback
+ * @param refs an array of refs
+ */
+// using an arrow function here causes a typescript error with the `RefCallback` type
 export function mergeRefs(refs) {
   return value => {
     refs.forEach(ref => {
@@ -64,6 +79,15 @@ export const ownerWindow = node => {
   var _ownerDocument;
   return ((_ownerDocument = ownerDocument(node)) === null || _ownerDocument === void 0 ? void 0 : _ownerDocument.defaultView) || window;
 };
+
+/**
+ * A method to be used when dealing with callbacks that depend on data, but you don't want to trigger re-renders.
+ *
+ * @see {@link https://github.com/facebook/react/issues/14099#issuecomment-440013892|facebook/react#14099}
+ *
+ * @param fn
+ */
+// eslint-disable-next-line @typescript-eslint/no-unsafe-function-type
 export const useEventCallback = fn => {
   const ref = useRef(fn);
   isomorphicLayoutEffect(() => {
@@ -73,10 +97,13 @@ export const useEventCallback = fn => {
     return void ref.current.apply(ref, arguments);
   }, []);
 };
+
+// Taken from https://gist.github.com/gre/1650294
 const easeInOutCubic = t => t < 0.5 ? 4 * t * t * t : (t - 1) * (2 * t - 2) * (2 * t - 2) + 1;
 export const animate = function (element, property, to) {
   let duration = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 600;
   let start = null;
+  // @ts-expect-error Type 'T[keyof T]' is not assignable to type 'number'
   const from = element[property];
   if (start === from) return;
   let cancelled = false;
@@ -89,6 +116,7 @@ export const animate = function (element, property, to) {
       start = timestamp;
     }
     const time = Math.min(1, (timestamp - start) / duration);
+    // @ts-expect-error Type 'number' is not assignable to type 'T[keyof T]'
     element[property] = easeInOutCubic(time) * (to - from) + from;
     if (time >= 1) return;
     requestAnimationFrame(step);
@@ -101,6 +129,17 @@ export const alignmentToFlexAlignment = align => ({
   left: 'start',
   right: 'end'
 })[align];
+
+/**
+ * A function that returns the first item in the array, if the index exceeds its maximum length
+ *
+ * @example
+ * ```js
+ *  const sortFlowRingLookup = arrayRingLookup(['asc', 'desc', 'none']);
+ *
+ *  expect(sortFlowRingLookup(4)).toBe('desc');
+ * ```
+ */
 export const arrayRingLookup = collection => {
   const len = collection.length;
   return index => collection[(index % len + len) % len];

package/dist/utils/number.js

@@ -4,10 +4,15 @@ export const bigNumFormatter = num => {
   if (num < 1e3) return {
     value: num,
     descriptor: ''
-  };else if (num < 1e6) return {
+  };
+  // if value < 1000, nothing to do
+  else if (num < 1e6) return {
     value: num / 1e3,
     descriptor: 'K'
-  };else {
+  };
+  // convert to K for number from > 1000 < 1 million
+  else {
+    // convert to M for number from > 1 million
     return {
       value: num / 1e6,
       descriptor: 'M'

package/dist/utils/propGuards.d.ts

@@ -1,2 +1,16 @@
+/**
+ * Type guard that returns the value if it's a non-empty string, otherwise returns undefined.
+ * This is useful for ensuring type safety when working with props that should be strings.
+ *
+ * @example
+ * // Returns 'hello'
+ * onlyString('hello');
+ *
+ * // Returns undefined
+ * onlyString(42);
+ * onlyString('');
+ * onlyString(null);
+ * onlyString(undefined);
+ */
 export declare function onlyString<P extends string | unknown>(prop: P): (P & string) | undefined;
 //# sourceMappingURL=propGuards.d.ts.map

package/dist/utils/propGuards.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"propGuards.d.ts","sourceRoot":"","sources":["../../lib/utils/propGuards.ts"],"names":[],"mappings":"AAcA,wBAAgB,UAAU,CAAC,CAAC,SAAS,MAAM,GAAG,OAAO,EAAE,IAAI,EAAE,CAAC,4BAI7D"}
+{"version":3,"file":"propGuards.d.ts","sourceRoot":"","sources":["../../lib/utils/propGuards.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;GAaG;AACH,wBAAgB,UAAU,CAAC,CAAC,SAAS,MAAM,GAAG,OAAO,EAAE,IAAI,EAAE,CAAC,4BAI7D"}

package/dist/utils/propGuards.js

@@ -1,5 +1,19 @@
 "use strict";
 
+/**
+ * Type guard that returns the value if it's a non-empty string, otherwise returns undefined.
+ * This is useful for ensuring type safety when working with props that should be strings.
+ *
+ * @example
+ * // Returns 'hello'
+ * onlyString('hello');
+ *
+ * // Returns undefined
+ * onlyString(42);
+ * onlyString('');
+ * onlyString(null);
+ * onlyString(undefined);
+ */
 export function onlyString(prop) {
   return prop && typeof prop === 'string' && prop.length > 0 ? prop : undefined;
 }

package/dist/utils/responsiveProps.css.js

@@ -7,7 +7,7 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 import { style } from '@vanilla-extract/css';
 import { breakpoints } from "../themes/makeTheme.js";
-import { responsiveStyle } from "./responsiveStyle.js";
+import { responsiveStyle } from "./responsiveStyle.js"; // eslint-disable-next-line @typescript-eslint/no-unnecessary-type-constraint
 export const makeResponsiveStyle = (tokens, property) => Object.entries(tokens || {}).reduce((results, _ref) => {
   let [key, value] = _ref;
   const breakpointsKeys = Object.keys(breakpoints);

package/dist/utils/sprinkles.d.ts

@@ -6,8 +6,26 @@ interface SortedProps<T extends object> {
     sprinklesProps: Sprinkles;
     baseProps: RemainingProps<T>;
 }
+/**
+ * Typeguard function for base sprinkles (non-responsive) props
+ */
 export declare const isSprinklesProperty: (key: string) => boolean;
+/**
+ * Filters out sprinkles and responsive sprinkles props, returning only the non-sprinkles props.
+ *
+ * @param props - Object containing all props to be filtered
+ * @returns Object containing only non-sprinkles props
+ */
 export declare const filterNonSprinklesProps: <P extends object>(props: P) => RemainingProps<P>;
+/**
+ * Filters and separates props into four categories in a single pass:
+ * base sprinkles, responsive sprinkles, legacy colour sprinkles, and all other props.
+ *
+ * @param props - Object containing all props to be classified.
+ * @returns `{ sprinklesProps, sprinklesResponsiveProps, sprinklesLegacyColourProps, baseProps }`
+ *  - `sprinklesProps`: Props matching sprinkles
+ *  - `baseProps`: The remainder are the component's base props
+ */
 export declare const filterPropsWithStyles: <P extends object>(props: P) => SortedProps<P>;
 export {};
 //# sourceMappingURL=sprinkles.d.ts.map

package/dist/utils/sprinkles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"sprinkles.d.ts","sourceRoot":"","sources":["../../lib/utils/sprinkles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,KAAK,SAAS,EAAE,MAAM,yBAAyB,CAAC;AAGpE,KAAK,cAAc,CAAC,CAAC,SAAS,MAAM,IAAI;KACtC,CAAC,IAAI,MAAM,CAAC,IAAI,CAAC,SAAS,SAAS,GAAG,KAAK,GAAG,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CACvD,CAAC;AAEF,UAAU,WAAW,CAAC,CAAC,SAAS,MAAM;IACrC,cAAc,EAAE,SAAS,CAAC;IAC1B,SAAS,EAAE,cAAc,CAAC,CAAC,CAAC,CAAC;CAC7B;AAKD,eAAO,MAAM,mBAAmB,GAAI,KAAK,MAAM,YAE9C,CAAC;AAQF,eAAO,MAAM,uBAAuB,GAAI,CAAC,SAAS,MAAM,EAAE,OAAO,CAAC,sBAMtC,CAAC;AAW7B,eAAO,MAAM,qBAAqB,GAAI,CAAC,SAAS,MAAM,EACrD,OAAO,CAAC,KACN,WAAW,CAAC,CAAC,CAuBf,CAAC"}
+{"version":3,"file":"sprinkles.d.ts","sourceRoot":"","sources":["../../lib/utils/sprinkles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,KAAK,SAAS,EAAE,MAAM,yBAAyB,CAAC;AAGpE,KAAK,cAAc,CAAC,CAAC,SAAS,MAAM,IAAI;KACtC,CAAC,IAAI,MAAM,CAAC,IAAI,CAAC,SAAS,SAAS,GAAG,KAAK,GAAG,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CACvD,CAAC;AAEF,UAAU,WAAW,CAAC,CAAC,SAAS,MAAM;IACrC,cAAc,EAAE,SAAS,CAAC;IAC1B,SAAS,EAAE,cAAc,CAAC,CAAC,CAAC,CAAC;CAC7B;AAED;;GAEG;AACH,eAAO,MAAM,mBAAmB,GAAI,KAAK,MAAM,YAE9C,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,uBAAuB,GAAI,CAAC,SAAS,MAAM,EAAE,OAAO,CAAC,sBAMtC,CAAC;AAE7B;;;;;;;;GAQG;AACH,eAAO,MAAM,qBAAqB,GAAI,CAAC,SAAS,MAAM,EACrD,OAAO,CAAC,KACN,WAAW,CAAC,CAAC,CAuBf,CAAC"}

package/dist/utils/sprinkles.js

@@ -1,9 +1,19 @@
 "use strict";
 
-import { sprinkles } from "../styles/sprinkles.css.js";
+import { sprinkles } from "../styles/sprinkles.css.js"; // Type for 'baseProps', containing only non-sprinkle properties from T
+/**
+ * Typeguard function for base sprinkles (non-responsive) props
+ */
 export const isSprinklesProperty = key => {
   return sprinkles.properties.has(key);
 };
+
+/**
+ * Filters out sprinkles and responsive sprinkles props, returning only the non-sprinkles props.
+ *
+ * @param props - Object containing all props to be filtered
+ * @returns Object containing only non-sprinkles props
+ */
 export const filterNonSprinklesProps = props => Object.entries(props).reduce((acc, _ref) => {
   let [key, value] = _ref;
   if (!isSprinklesProperty(key)) {
@@ -11,6 +21,16 @@ export const filterNonSprinklesProps = props => Object.entries(props).reduce((ac
   }
   return acc;
 }, {});
+
+/**
+ * Filters and separates props into four categories in a single pass:
+ * base sprinkles, responsive sprinkles, legacy colour sprinkles, and all other props.
+ *
+ * @param props - Object containing all props to be classified.
+ * @returns `{ sprinklesProps, sprinklesResponsiveProps, sprinklesLegacyColourProps, baseProps }`
+ *  - `sprinklesProps`: Props matching sprinkles
+ *  - `baseProps`: The remainder are the component's base props
+ */
 export const filterPropsWithStyles = props => {
   const acc = {
     sprinklesProps: {},

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@autoguru/overdrive",
-	"version": "4.43.9-next.0",
+	"version": "4.43.10-next.0",
 	"description": "Overdrive is a product component library, and design system for AutoGuru.",
 	"types": "dist/index.d.ts",
 	"main": "dist/index.js",
@@ -40,7 +40,7 @@
 		"format": "prettier --list-different --write \"**/*.+(js|jsx|ts|tsx|json|yml|md|mdx|html)\"",
 		"format:staged": "prettier --write",
 		"prepublishOnly": "yarn dlx rimraf ./dist && yarn run build && yarn run typeEmit",
-		"lint:tsc": "tsc --noEmit --skipLibCheck",
+		"lint:tsc": "tsc --noEmit",
 		"lint:eslint": "eslint \"lib/**/*.+(ts|tsx)\" --fix --quiet",
 		"lint": "yarn run lint:eslint && yarn run lint:tsc",
 		"release": "changeset publish",
@@ -51,7 +51,7 @@
 		"test": "vitest --project=unit-tests",
 		"test:ci": "yarn vitest run --no-cache --coverage --project=unit-tests",
 		"test:a11y": "vitest run --coverage --project=storybook",
-		"typeEmit": "tsc -p tsconfig.dist.json --emitDeclarationOnly",
+		"typeEmit": "tsc -p tsconfig.dist.json",
 		"watch": "tsc --watch",
 		"prepare": "husky"
 	},
@@ -87,18 +87,18 @@
 		"@babel/preset-react": "7.27.1",
 		"@babel/preset-typescript": "7.27.1",
 		"@babel/runtime-corejs3": "7.27.6",
-		"@changesets/cli": "2.29.4",
-		"@chromatic-com/storybook": "4.0.0",
+		"@changesets/cli": "2.29.5",
+		"@chromatic-com/storybook": "4.0.1",
 		"@internationalized/date": "^3.8.2",
 		"@octokit/rest": "^22.0.0",
 		"@popperjs/core": "^2.11.8",
 		"@react-stately/toggle": "^3.8.5",
-		"@storybook/addon-a11y": "9.0.10",
-		"@storybook/addon-docs": "9.0.10",
-		"@storybook/addon-links": "9.0.10",
-		"@storybook/addon-onboarding": "9.0.10",
-		"@storybook/addon-vitest": "9.0.10",
-		"@storybook/react-vite": "9.0.10",
+		"@storybook/addon-a11y": "9.0.12",
+		"@storybook/addon-docs": "9.0.12",
+		"@storybook/addon-links": "9.0.12",
+		"@storybook/addon-onboarding": "9.0.12",
+		"@storybook/addon-vitest": "9.0.12",
+		"@storybook/react-vite": "9.0.12",
 		"@testing-library/dom": "^10.4.0",
 		"@testing-library/jest-dom": "^6.6.3",
 		"@testing-library/react": "^16.3.0",
@@ -116,23 +116,23 @@
 		"@vanilla-extract/sprinkles": "^1.6.5",
 		"@vanilla-extract/vite-plugin": "^5.0.6",
 		"@vanilla-extract/webpack-plugin": "^2.3.22",
-		"@vitest/browser": "3.2.3",
-		"@vitest/coverage-v8": "3.2.3",
+		"@vitest/browser": "3.2.4",
+		"@vitest/coverage-v8": "3.2.4",
 		"@vitest/eslint-plugin": "1.2.7",
 		"babel-plugin-add-import-extension": "^1.6.0",
 		"babel-plugin-dev-expression": "^0.2.3",
 		"babel-plugin-macros": "^3.1.0",
 		"browserslist-config-autoguru": "^2.4.4",
-		"chromatic": "13.0.0",
+		"chromatic": "13.0.1",
 		"clsx": "^2.1.1",
 		"colord": "^2.9.3",
 		"concurrently": "^9.1.2",
 		"core-js": "^3.43.0",
 		"csstype": "^3.1.3",
 		"deepmerge": "^4.3.1",
-		"es-toolkit": "1.39.3",
+		"es-toolkit": "1.39.4",
 		"eslint": "9.29.0",
-		"eslint-plugin-storybook": "9.0.10",
+		"eslint-plugin-storybook": "9.0.12",
 		"husky": "^9.1.7",
 		"intersection-observer": "^0.12.2",
 		"jsdom": "26.1.0",
@@ -140,7 +140,7 @@
 		"magic-string": "^0.30.17",
 		"mini-css-extract-plugin": "^2.9.2",
 		"mockdate": "^3.0.5",
-		"playwright": "^1.53.0",
+		"playwright": "1.53.1",
 		"plop": "^4.0.1",
 		"postcss": "^8.5.6",
 		"prettier": "^3.5.3",
@@ -156,7 +156,7 @@
 		"react-stately": "^3.39.0",
 		"react-swipeable": "^7.0.2",
 		"rollup-plugin-visualizer": "^6.0.3",
-		"storybook": "9.0.10",
+		"storybook": "9.0.12",
 		"storybook-addon-tag-badges": "^2.0.1",
 		"typescript": "5.8.3",
 		"url-loader": "^4.1.1",
@@ -185,7 +185,7 @@
 		"webpack": "*"
 	},
 	"volta": {
-		"node": "22.16.0",
+		"node": "22.17.0",
 		"yarn": "4.9.2"
 	},
 	"packageManager": "yarn@4.9.2"