@autoguru/overdrive 4.54.0 → 4.55.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (46) hide show
  1. package/dist/components/BulletList/Bullet.css.d.ts +1 -1
  2. package/dist/components/DataTable/DataTable.css.d.ts +3 -0
  3. package/dist/components/DataTable/DataTable.css.d.ts.map +1 -0
  4. package/dist/components/DataTable/DataTable.css.js +55 -0
  5. package/dist/components/DataTable/DataTable.d.ts +23 -0
  6. package/dist/components/DataTable/DataTable.d.ts.map +1 -0
  7. package/dist/components/DataTable/DataTable.js +48 -0
  8. package/dist/components/DataTable/index.d.ts +2 -0
  9. package/dist/components/DataTable/index.d.ts.map +1 -0
  10. package/dist/components/DataTable/index.js +1 -0
  11. package/dist/components/EditableText/EditableText.css.d.ts.map +1 -1
  12. package/dist/components/EditableText/EditableText.css.js +0 -1
  13. package/dist/components/OverdriveProvider/OverdriveProvider.d.ts +10 -1
  14. package/dist/components/OverdriveProvider/OverdriveProvider.d.ts.map +1 -1
  15. package/dist/components/OverdriveProvider/OverdriveProvider.js +41 -5
  16. package/dist/components/ScrollPane/ScrollPane.css.d.ts +0 -1
  17. package/dist/components/ScrollPane/ScrollPane.css.d.ts.map +1 -1
  18. package/dist/components/ScrollPane/ScrollPane.css.js +8 -19
  19. package/dist/components/ScrollPane/ScrollPane.d.ts +2 -1
  20. package/dist/components/ScrollPane/ScrollPane.d.ts.map +1 -1
  21. package/dist/components/ScrollPane/ScrollPane.js +5 -5
  22. package/dist/components/Table/Table.d.ts +1 -1
  23. package/dist/components/Table/Table.d.ts.map +1 -1
  24. package/dist/components/Table/Table.js +1 -0
  25. package/dist/components/Table/TableCell.d.ts +1 -1
  26. package/dist/components/Table/TableCell.d.ts.map +1 -1
  27. package/dist/components/Table/TableCell.js +2 -4
  28. package/dist/components/Table/TableHeadCell.css.d.ts.map +1 -1
  29. package/dist/components/Table/TableHeadCell.css.js +11 -16
  30. package/dist/components/Table/TableHeadCell.d.ts +3 -3
  31. package/dist/components/Table/TableHeadCell.d.ts.map +1 -1
  32. package/dist/components/Table/TableHeadCell.js +5 -9
  33. package/dist/components/Table/TableRow.css.d.ts +3 -0
  34. package/dist/components/Table/TableRow.css.d.ts.map +1 -0
  35. package/dist/components/Table/TableRow.css.js +29 -0
  36. package/dist/components/Table/TableRow.d.ts +22 -2
  37. package/dist/components/Table/TableRow.d.ts.map +1 -1
  38. package/dist/components/Table/TableRow.js +28 -8
  39. package/dist/components/Table/TableRowGroup.d.ts +1 -1
  40. package/dist/components/Table/TableRowGroup.d.ts.map +1 -1
  41. package/dist/components/Table/TableRowGroup.js +1 -0
  42. package/dist/components/index.d.ts +3 -2
  43. package/dist/components/index.d.ts.map +1 -1
  44. package/dist/components/index.js +1 -0
  45. package/dist/styles/sprinkles.css.d.ts +7 -7
  46. package/package.json +5 -5
@@ -1,3 +1,3 @@
1
- export declare const root: Record<"default" | "circle" | "square" | "disc", string>;
1
+ export declare const root: Record<"default" | "square" | "circle" | "disc", string>;
2
2
  export declare const noDot: string;
3
3
  //# sourceMappingURL=Bullet.css.d.ts.map
@@ -0,0 +1,3 @@
1
+ export declare const scrollContainer: string;
2
+ export declare const innerWrapper: string;
3
+ //# sourceMappingURL=DataTable.css.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"DataTable.css.d.ts","sourceRoot":"","sources":["../../../lib/components/DataTable/DataTable.css.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,eAAe,QAO1B,CAAC;AAEH,eAAO,MAAM,YAAY,QAAY,CAAC"}
@@ -0,0 +1,55 @@
1
+ import * as __vanilla_filescope__ from '@vanilla-extract/css/fileScope';
2
+ __vanilla_filescope__.setFileScope("lib/components/DataTable/DataTable.css.ts", "@autoguru/overdrive");
3
+ import { globalStyle, keyframes, style } from '@vanilla-extract/css';
4
+ import { overdriveTokens as vars } from "../../themes/theme.css.js";
5
+ export const scrollContainer = style({
6
+ selectors: {
7
+ ['&:focus-visible']: {
8
+ outline: `2px solid ${vars.colours.intent.primary.background.standard}`,
9
+ outlineOffset: '-2px'
10
+ }
11
+ }
12
+ }, "scrollContainer");
13
+ export const innerWrapper = style({}, "innerWrapper");
14
+
15
+ /*
16
+ * Scroll-driven sticky header background. The background only appears
17
+ * once the user scrolls, driven by animation-timeline: scroll().
18
+ * The animation completes in the first 1px of scroll so the effect
19
+ * snaps in immediately when content passes under the header.
20
+ *
21
+ * Guarded behind @supports because browsers without animation-timeline
22
+ * support would otherwise treat the `animation` shorthand as a 0s
23
+ * time-based animation and, combined with `animation-fill-mode: both`,
24
+ * apply the end-state background immediately on render.
25
+ */
26
+ const stickyReveal = keyframes({
27
+ from: {
28
+ backgroundColor: 'transparent'
29
+ },
30
+ to: {
31
+ backgroundColor: vars.colours.background.body
32
+ }
33
+ }, "stickyReveal");
34
+ globalStyle(`${scrollContainer} [role="columnheader"]`, {
35
+ '@supports': {
36
+ '(animation-timeline: scroll())': {
37
+ animation: `${stickyReveal} linear both`,
38
+ animationRange: '0px 1px',
39
+ animationTimeline: 'scroll()'
40
+ }
41
+ }
42
+ });
43
+
44
+ /*
45
+ * Constrain the TableCell ::before hover pseudo-elements within DataTable.
46
+ * Without this, left/right: -1000% inflates scrollWidth to ~7400px inside
47
+ * the overflowX:auto scroll container. Pinning to 0 keeps the hover
48
+ * background within each cell instead of spanning the full row — a
49
+ * necessary trade-off to prevent phantom horizontal scroll.
50
+ */
51
+ globalStyle(`${innerWrapper} [role="gridcell"]::before`, {
52
+ left: 0,
53
+ right: 0
54
+ });
55
+ __vanilla_filescope__.endFileScope();
@@ -0,0 +1,23 @@
1
+ import type { ReactNode } from 'react';
2
+ import * as React from 'react';
3
+ import { type TableProps } from '../Table/Table';
4
+ export interface DataTableProps extends Omit<TableProps, 'ref'> {
5
+ /** Minimum width before horizontal scroll activates. CSS value, e.g. '800px'. */
6
+ minWidth?: string;
7
+ /** Maximum height before vertical scroll activates. Required for stickyHead to work. */
8
+ maxHeight?: string;
9
+ /** Accessible label for the scrollable region. */
10
+ 'aria-label'?: string;
11
+ children: ReactNode | ReactNode[];
12
+ }
13
+ /**
14
+ * A responsive data table wrapper that enables horizontal scrolling on narrow
15
+ * containers. Composes the existing `Table` component inside a scrollable
16
+ * region with keyboard-accessible overflow.
17
+ *
18
+ * When using `stickyHead`, set `maxHeight` so the DataTable itself is the
19
+ * vertical scroll container — this ensures sticky headers resolve against
20
+ * the correct scroll ancestor.
21
+ */
22
+ export declare const DataTable: React.ForwardRefExoticComponent<DataTableProps & React.RefAttributes<HTMLDivElement>>;
23
+ //# sourceMappingURL=DataTable.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"DataTable.d.ts","sourceRoot":"","sources":["../../../lib/components/DataTable/DataTable.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,OAAO,EAAS,KAAK,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAIxD,MAAM,WAAW,cAAe,SAAQ,IAAI,CAAC,UAAU,EAAE,KAAK,CAAC;IAC9D,iFAAiF;IACjF,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB,wFAAwF;IACxF,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,kDAAkD;IAClD,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB,QAAQ,EAAE,SAAS,GAAG,SAAS,EAAE,CAAC;CAClC;AAED;;;;;;;;GAQG;AACH,eAAO,MAAM,SAAS,uFAoCrB,CAAC"}
@@ -0,0 +1,48 @@
1
+ import * as React from 'react';
2
+ import { forwardRef } from 'react';
3
+ import { Box } from "../Box/Box.js";
4
+ import { ScrollPane } from "../ScrollPane/ScrollPane.js";
5
+ import { Table } from "../Table/Table.js";
6
+ import * as styles from "./DataTable.css.js";
7
+ import { jsx as _jsx } from "react/jsx-runtime";
8
+ /**
9
+ * A responsive data table wrapper that enables horizontal scrolling on narrow
10
+ * containers. Composes the existing `Table` component inside a scrollable
11
+ * region with keyboard-accessible overflow.
12
+ *
13
+ * When using `stickyHead`, set `maxHeight` so the DataTable itself is the
14
+ * vertical scroll container — this ensures sticky headers resolve against
15
+ * the correct scroll ancestor.
16
+ */
17
+ export const DataTable = /*#__PURE__*/forwardRef(({
18
+ minWidth,
19
+ maxHeight,
20
+ 'aria-label': ariaLabel = 'Data table',
21
+ children,
22
+ columnTemplate,
23
+ padding,
24
+ stickyHead
25
+ }, ref) => /*#__PURE__*/_jsx(ScrollPane, {
26
+ ref: ref,
27
+ role: "region",
28
+ "aria-label": ariaLabel,
29
+ tabIndex: 0,
30
+ style: maxHeight ? {
31
+ maxHeight
32
+ } : undefined,
33
+ className: styles.scrollContainer,
34
+ odComponent: "data-table",
35
+ children: /*#__PURE__*/_jsx(Box, {
36
+ className: styles.innerWrapper,
37
+ style: minWidth ? {
38
+ minWidth
39
+ } : undefined,
40
+ children: /*#__PURE__*/_jsx(Table, {
41
+ columnTemplate: columnTemplate,
42
+ padding: padding,
43
+ stickyHead: stickyHead,
44
+ children: children
45
+ })
46
+ })
47
+ }));
48
+ DataTable.displayName = 'DataTable';
@@ -0,0 +1,2 @@
1
+ export { DataTable, type DataTableProps } from './DataTable';
2
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../lib/components/DataTable/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,cAAc,EAAE,MAAM,aAAa,CAAC"}
@@ -0,0 +1 @@
1
+ export { DataTable } from "./DataTable.js";
@@ -1 +1 @@
1
- {"version":3,"file":"EditableText.css.d.ts","sourceRoot":"","sources":["../../../lib/components/EditableText/EditableText.css.ts"],"names":[],"mappings":"AAKA,eAAO,MAAM,IAAI,QAUf,CAAC;AAEH,eAAO,MAAM,KAAK,QAmBhB,CAAC;AAEH,eAAO,MAAM,IAAI,QAMf,CAAC;AAEH,eAAO,MAAM,UAAU,QAOrB,CAAC"}
1
+ {"version":3,"file":"EditableText.css.d.ts","sourceRoot":"","sources":["../../../lib/components/EditableText/EditableText.css.ts"],"names":[],"mappings":"AAKA,eAAO,MAAM,IAAI,QAUf,CAAC;AAEH,eAAO,MAAM,KAAK,QAkBhB,CAAC;AAEH,eAAO,MAAM,IAAI,QAMf,CAAC;AAEH,eAAO,MAAM,UAAU,QAOrB,CAAC"}
@@ -20,7 +20,6 @@ export const input = style({
20
20
  width: 'var(--width)',
21
21
  '@supports': {
22
22
  '(field-sizing: content)': {
23
- //@ts-expect-error 'field-sizing' property is not yet baseline available
24
23
  fieldSizing: 'content',
25
24
  width: 'unset'
26
25
  }
@@ -18,6 +18,15 @@ export interface ProviderProps {
18
18
  colorOverrides?: Partial<ColorOverrides>;
19
19
  /** Reference to an HTML element where portals should be mounted */
20
20
  portalMountPoint?: PortalMountPoint;
21
+ /**
22
+ * BCP47 locale string for React Aria components (DateInput, Calendar, etc.).
23
+ * Controls date segment ordering, number formatting, and text direction.
24
+ *
25
+ * @example "en-AU" for Australian English (DD/MM/YYYY)
26
+ * @example "de-DE" for German
27
+ * @default Falls back to browser's navigator.language
28
+ */
29
+ locale?: string;
21
30
  children?: React.ReactNode;
22
31
  }
23
32
  export interface ProviderContext extends Pick<ProviderProps, 'colorOverrides' | 'portalMountPoint'> {
@@ -28,7 +37,7 @@ export interface ProviderContext extends Pick<ProviderProps, 'colorOverrides' |
28
37
  }
29
38
  export declare const useTheme: () => ProviderContext;
30
39
  export declare const useRuntimeTokens: () => RuntimeTokens;
31
- export declare const Provider: ({ breakpoints, children, colorOverrides, noBodyLevelTheming, portalMountPoint, theme, }: ProviderProps) => React.JSX.Element;
40
+ export declare const Provider: ({ breakpoints, children, colorOverrides, locale, noBodyLevelTheming, portalMountPoint, theme, }: ProviderProps) => React.JSX.Element;
32
41
  export declare const OverdriveProvider: React.NamedExoticComponent<ProviderProps>;
33
42
  export {};
34
43
  //# sourceMappingURL=OverdriveProvider.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"OverdriveProvider.d.ts","sourceRoot":"","sources":["../../../lib/components/OverdriveProvider/OverdriveProvider.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,gBAAgB,EAAE,MAAM,0BAA0B,CAAC;AAE5D,OAAO,KAAwD,MAAM,OAAO,CAAC;AAE7E,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAChD,OAAO,SAAS,MAAM,mBAAmB,CAAC;AAC1C,OAAO,EAAqB,KAAK,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAC/E,OAAO,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;AAGzD,OAAO,EAAqB,KAAK,cAAc,EAAE,MAAM,qBAAqB,CAAC;AAE7E,KAAK,aAAa,GAAG,OAAO,eAAe,CAAC;AAC5C,KAAK,gBAAgB,GAAG,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;AAE5D,MAAM,WAAW,aAAa;IAC7B,6DAA6D;IAC7D,KAAK,CAAC,EAAE,OAAO,SAAS,CAAC;IACzB,+CAA+C;IAC/C,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,kEAAkE;IAClE,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,sDAAsD;IACtD,cAAc,CAAC,EAAE,OAAO,CAAC,cAAc,CAAC,CAAC;IACzC,mEAAmE;IACnE,gBAAgB,CAAC,EAAE,gBAAgB,CAAC;IACpC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,MAAM,WAAW,eAChB,SAAQ,IAAI,CAAC,aAAa,EAAE,gBAAgB,GAAG,kBAAkB,CAAC;IAClE,UAAU,EAAE,CAAC,OAAO,SAAS,CAAC,CAAC,UAAU,CAAC,CAAC;IAC3C,SAAS,EAAE,MAAM,CAAC;IAClB,cAAc,EAAE,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC;IACpD,IAAI,EAAE,aAAa,CAAC;CACpB;AAMD,eAAO,MAAM,QAAQ,uBAIpB,CAAC;AAEF,eAAO,MAAM,gBAAgB,QAAO,aAInC,CAAC;AAUF,eAAO,MAAM,QAAQ,GAAI,yFAOtB,aAAa,sBAyDf,CAAC;AAEF,eAAO,MAAM,iBAAiB,2CAK7B,CAAC"}
1
+ {"version":3,"file":"OverdriveProvider.d.ts","sourceRoot":"","sources":["../../../lib/components/OverdriveProvider/OverdriveProvider.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,gBAAgB,EAAE,MAAM,0BAA0B,CAAC;AAE5D,OAAO,KAAwD,MAAM,OAAO,CAAC;AAE7E,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAChD,OAAO,SAAS,MAAM,mBAAmB,CAAC;AAC1C,OAAO,EAAqB,KAAK,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAC/E,OAAO,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;AAGzD,OAAO,EAAqB,KAAK,cAAc,EAAE,MAAM,qBAAqB,CAAC;AAE7E,KAAK,aAAa,GAAG,OAAO,eAAe,CAAC;AAC5C,KAAK,gBAAgB,GAAG,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;AAqC5D,MAAM,WAAW,aAAa;IAC7B,6DAA6D;IAC7D,KAAK,CAAC,EAAE,OAAO,SAAS,CAAC;IACzB,+CAA+C;IAC/C,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,kEAAkE;IAClE,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,sDAAsD;IACtD,cAAc,CAAC,EAAE,OAAO,CAAC,cAAc,CAAC,CAAC;IACzC,mEAAmE;IACnE,gBAAgB,CAAC,EAAE,gBAAgB,CAAC;IACpC;;;;;;;OAOG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,MAAM,WAAW,eAChB,SAAQ,IAAI,CAAC,aAAa,EAAE,gBAAgB,GAAG,kBAAkB,CAAC;IAClE,UAAU,EAAE,CAAC,OAAO,SAAS,CAAC,CAAC,UAAU,CAAC,CAAC;IAC3C,SAAS,EAAE,MAAM,CAAC;IAClB,cAAc,EAAE,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC;IACpD,IAAI,EAAE,aAAa,CAAC;CACpB;AAMD,eAAO,MAAM,QAAQ,uBAIpB,CAAC;AAEF,eAAO,MAAM,gBAAgB,QAAO,aAInC,CAAC;AAUF,eAAO,MAAM,QAAQ,GAAI,iGAQtB,aAAa,sBA6Df,CAAC;AAEF,eAAO,MAAM,iBAAiB,2CAK7B,CAAC"}
@@ -2,6 +2,7 @@ import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
2
2
  function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
3
3
  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; }
4
4
  import { invariant } from '@autoguru/utilities';
5
+ import { I18nProvider as ReactAriaI18nProvider } from '@react-aria/i18n';
5
6
  import { isEqual } from 'es-toolkit';
6
7
  import React, { createContext, useContext, useEffect, useMemo } from 'react';
7
8
  import baseTheme from "../../themes/base/index.js";
@@ -9,6 +10,36 @@ import { makeRuntimeTokens } from "../../themes/makeTheme.js";
9
10
  import { isBrowser } from "../../utils/index.js";
10
11
  import { useColorOverrides } from "./useColorOverrides.js";
11
12
  import { jsx as _jsx } from "react/jsx-runtime";
13
+ /**
14
+ * Maps 2-letter language codes to full BCP47 locale codes.
15
+ * English defaults to Australian locale (DD/MM/YYYY format).
16
+ */
17
+ const LANGUAGE_TO_LOCALE = {
18
+ en: 'en-AU',
19
+ de: 'de-DE',
20
+ fr: 'fr-FR',
21
+ es: 'es-ES',
22
+ it: 'it-IT',
23
+ nl: 'nl-NL',
24
+ pl: 'pl-PL',
25
+ sv: 'sv-SE',
26
+ ja: 'ja-JP'
27
+ };
28
+
29
+ /**
30
+ * Resolves the locale for React Aria components.
31
+ * Priority: explicit prop > i18next language (mapped to full locale) > undefined (React Aria browser default)
32
+ */
33
+ function resolveLocale(localeProp) {
34
+ var _i18next;
35
+ if (localeProp) return localeProp;
36
+ if (!isBrowser) return undefined;
37
+ const i18nextLang = (_i18next = window.i18next) === null || _i18next === void 0 ? void 0 : _i18next.language;
38
+ if (i18nextLang) {
39
+ return LANGUAGE_TO_LOCALE[i18nextLang] || i18nextLang;
40
+ }
41
+ return undefined;
42
+ }
12
43
  const OverdriveContext = /*#__PURE__*/createContext(null);
13
44
  const RuntimeTokensContext = /*#__PURE__*/createContext(null);
14
45
  const msgInvariantError = "You haven't used an `<OverdriveProvider>`.";
@@ -29,6 +60,7 @@ export const Provider = ({
29
60
  breakpoints,
30
61
  children,
31
62
  colorOverrides,
63
+ locale,
32
64
  noBodyLevelTheming = false,
33
65
  portalMountPoint,
34
66
  theme = baseTheme
@@ -60,15 +92,19 @@ export const Provider = ({
60
92
  portalMountPoint.current = null;
61
93
  }
62
94
  }, [portalMountPoint]);
95
+ const resolvedLocale = resolveLocale(locale);
63
96
  return /*#__PURE__*/_jsx(OverdriveContext.Provider, {
64
97
  value: themeValues,
65
98
  children: /*#__PURE__*/_jsx(RuntimeTokensContext.Provider, {
66
99
  value: runtimeTokens,
67
- children: /*#__PURE__*/_jsx("div", {
68
- className: theme.themeRef,
69
- style: styles,
70
- "data-od-component": "provider",
71
- children: children
100
+ children: /*#__PURE__*/_jsx(ReactAriaI18nProvider, {
101
+ locale: resolvedLocale,
102
+ children: /*#__PURE__*/_jsx("div", {
103
+ className: theme.themeRef,
104
+ style: styles,
105
+ "data-od-component": "provider",
106
+ children: children
107
+ })
72
108
  })
73
109
  })
74
110
  });
@@ -1,3 +1,2 @@
1
1
  export declare const root: string;
2
- export declare const rounded: string;
3
2
  //# sourceMappingURL=ScrollPane.css.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"ScrollPane.css.d.ts","sourceRoot":"","sources":["../../../lib/components/ScrollPane/ScrollPane.css.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,IAAI,QA6Bf,CAAC;AAEH,eAAO,MAAM,OAAO,QAOlB,CAAC"}
1
+ {"version":3,"file":"ScrollPane.css.d.ts","sourceRoot":"","sources":["../../../lib/components/ScrollPane/ScrollPane.css.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,IAAI,QA0Bf,CAAC"}
@@ -3,41 +3,30 @@ __vanilla_filescope__.setFileScope("lib/components/ScrollPane/ScrollPane.css.ts"
3
3
  import { style } from '@vanilla-extract/css';
4
4
  import { overdriveTokens as vars } from "../../themes/theme.css.js";
5
5
  export const root = style({
6
+ scrollbarColor: `${vars.colours.gamut.gray300} transparent`,
7
+ scrollbarWidth: 'thin',
6
8
  '::-webkit-scrollbar': {
7
9
  backgroundColor: 'transparent',
10
+ height: 6,
8
11
  width: 6
9
12
  },
10
13
  '::-webkit-scrollbar-corner': {
11
14
  background: 'transparent'
12
15
  },
16
+ '::-webkit-scrollbar-track': {
17
+ backgroundColor: 'transparent'
18
+ },
13
19
  '::-webkit-scrollbar-thumb': {
14
20
  backgroundColor: vars.colours.gamut.gray300,
15
- overflow: 'hidden'
16
- },
17
- '::-webkit-scrollbar-track': {
18
- backgroundColor: vars.colours.gamut.gray100,
19
- border: `1px solid ${vars.colours.gamut.gray200}`,
20
- position: 'absolute'
21
+ borderRadius: '999px'
21
22
  },
22
23
  '::-webkit-scrollbar-button': {
23
24
  display: 'none'
24
25
  },
25
26
  selectors: {
26
- ['&::-webkit-scrollbar-track:hover']: {
27
- backgroundColor: vars.colours.gamut.gray300
28
- },
29
27
  ['&::-webkit-scrollbar-thumb:hover']: {
30
- backgroundColor: vars.colours.gamut.gray400,
31
- border: `1px solid ${vars.colours.gamut.gray400}`
28
+ backgroundColor: vars.colours.gamut.gray400
32
29
  }
33
30
  }
34
31
  }, "root");
35
- export const rounded = style({
36
- '::-webkit-scrollbar-thumb': {
37
- borderRadius: vars.border.radius['sm']
38
- },
39
- '::-webkit-scrollbar-track': {
40
- borderRadius: `0 ${vars.border.radius['sm']} ${vars.border.radius['sm']} 0`
41
- }
42
- }, "rounded");
43
32
  __vanilla_filescope__.endFileScope();
@@ -5,8 +5,9 @@ export interface ScrollPaneProps extends Omit<ComponentProps<typeof Box>, 'overf
5
5
  bottomGap?: keyof Tokens['space'];
6
6
  serverVhFallback?: number;
7
7
  includeMobile?: boolean;
8
- rounded?: boolean;
9
8
  className?: string;
9
+ /** @deprecated No-op. Thumb is pill-rounded by default. Will be removed in the next major. */
10
+ rounded?: boolean;
10
11
  }
11
12
  export declare const ScrollPane: React.ForwardRefExoticComponent<Omit<ScrollPaneProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
12
13
  //# sourceMappingURL=ScrollPane.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"ScrollPane.d.ts","sourceRoot":"","sources":["../../../lib/components/ScrollPane/ScrollPane.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,KAAK,cAAc,EAAc,MAAM,OAAO,CAAC;AAE/D,OAAO,KAAK,EAAE,WAAW,IAAI,MAAM,EAAE,MAAM,cAAc,CAAC;AAC1D,OAAO,EAAE,GAAG,EAAE,MAAM,QAAQ,CAAC;AAI7B,MAAM,WAAW,eAChB,SAAQ,IAAI,CAAC,cAAc,CAAC,OAAO,GAAG,CAAC,EAAE,UAAU,CAAC;IACpD,SAAS,CAAC,EAAE,MAAM,MAAM,CAAC,OAAO,CAAC,CAAC;IAClC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,eAAO,MAAM,UAAU,qGAYtB,CAAC"}
1
+ {"version":3,"file":"ScrollPane.d.ts","sourceRoot":"","sources":["../../../lib/components/ScrollPane/ScrollPane.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,KAAK,cAAc,EAAc,MAAM,OAAO,CAAC;AAE/D,OAAO,KAAK,EAAE,WAAW,IAAI,MAAM,EAAE,MAAM,cAAc,CAAC;AAC1D,OAAO,EAAE,GAAG,EAAE,MAAM,QAAQ,CAAC;AAI7B,MAAM,WAAW,eAChB,SAAQ,IAAI,CAAC,cAAc,CAAC,OAAO,GAAG,CAAC,EAAE,UAAU,CAAC;IACpD,SAAS,CAAC,EAAE,MAAM,MAAM,CAAC,OAAO,CAAC,CAAC;IAClC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,8FAA8F;IAC9F,OAAO,CAAC,EAAE,OAAO,CAAC;CAClB;AAED,eAAO,MAAM,UAAU,qGAWtB,CAAC"}
@@ -8,18 +8,18 @@ import React, { forwardRef } from 'react';
8
8
  import { Box } from "../Box/index.js";
9
9
  import * as styles from "./ScrollPane.css.js";
10
10
  import { jsx as _jsx } from "react/jsx-runtime";
11
- export const ScrollPane = /*#__PURE__*/forwardRef((_ref, ref) => {
11
+ export const ScrollPane = /*#__PURE__*/forwardRef(
12
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
13
+ (_ref, ref) => {
12
14
  let {
13
15
  className = '',
14
- rounded = false
16
+ rounded: _rounded
15
17
  } = _ref,
16
18
  rest = _objectWithoutProperties(_ref, _excluded);
17
19
  return /*#__PURE__*/_jsx(Box, _objectSpread({
18
20
  ref: ref,
19
21
  overflow: "auto",
20
- className: clsx(className, styles.root, {
21
- [styles.rounded]: rounded
22
- }),
22
+ className: clsx(className, styles.root),
23
23
  odComponent: "scroll-pane"
24
24
  }, rest));
25
25
  });
@@ -5,5 +5,5 @@ export interface TableProps extends Partial<TableContext> {
5
5
  columnTemplate: string;
6
6
  children: ReactNode | ReactNode[];
7
7
  }
8
- export declare const Table: React.ForwardRefExoticComponent<TableProps & React.RefAttributes<HTMLDivElement>>;
8
+ export declare const Table: React.ForwardRefExoticComponent<TableProps & React.RefAttributes<HTMLTableElement>>;
9
9
  //# sourceMappingURL=Table.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"Table.d.ts","sourceRoot":"","sources":["../../../lib/components/Table/Table.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AAG9C,MAAM,WAAW,UAAW,SAAQ,OAAO,CAAC,YAAY,CAAC;IACxD,cAAc,EAAE,MAAM,CAAC;IAEvB,QAAQ,EAAE,SAAS,GAAG,SAAS,EAAE,CAAC;CAClC;AAQD,eAAO,MAAM,KAAK,mFAejB,CAAC"}
1
+ {"version":3,"file":"Table.d.ts","sourceRoot":"","sources":["../../../lib/components/Table/Table.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AAG9C,MAAM,WAAW,UAAW,SAAQ,OAAO,CAAC,YAAY,CAAC;IACxD,cAAc,EAAE,MAAM,CAAC;IAEvB,QAAQ,EAAE,SAAS,GAAG,SAAS,EAAE,CAAC;CAClC;AAQD,eAAO,MAAM,KAAK,qFAgBjB,CAAC"}
@@ -19,6 +19,7 @@ export const Table = /*#__PURE__*/forwardRef(({
19
19
  padding: padding,
20
20
  stickyHead: stickyHead,
21
21
  children: /*#__PURE__*/_jsx(Box, {
22
+ as: "table",
22
23
  ref: ref,
23
24
  role: "grid",
24
25
  width: "full",
@@ -8,5 +8,5 @@ export interface TableCellProps extends Partial<Pick<AriaAttributes, 'aria-label
8
8
  padding?: keyof Tokens['space'];
9
9
  children?: ReactNode | null;
10
10
  }
11
- export declare const TableCell: React.ForwardRefExoticComponent<TableCellProps & React.RefAttributes<HTMLDivElement>>;
11
+ export declare const TableCell: React.ForwardRefExoticComponent<TableCellProps & React.RefAttributes<HTMLTableCellElement>>;
12
12
  //# sourceMappingURL=TableCell.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"TableCell.d.ts","sourceRoot":"","sources":["../../../lib/components/Table/TableCell.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,cAAc,EAAc,MAAM,OAAO,CAAC;AAEnD,OAAO,EAAE,WAAW,IAAI,MAAM,EAAE,MAAM,cAAc,CAAC;AACrD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAQ7C,MAAM,WAAW,cAChB,SAAQ,OAAO,CAAC,IAAI,CAAC,cAAc,EAAE,YAAY,CAAC,CAAC;IACnD,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,MAAM,CAAC,OAAO,CAAC,CAAC;IAEhC,QAAQ,CAAC,EAAE,SAAS,GAAG,IAAI,CAAC;CAC5B;AAED,eAAO,MAAM,SAAS,uFAwCrB,CAAC"}
1
+ {"version":3,"file":"TableCell.d.ts","sourceRoot":"","sources":["../../../lib/components/Table/TableCell.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,cAAc,EAAc,MAAM,OAAO,CAAC;AAEnD,OAAO,EAAE,WAAW,IAAI,MAAM,EAAE,MAAM,cAAc,CAAC;AACrD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAQ7C,MAAM,WAAW,cAChB,SAAQ,OAAO,CAAC,IAAI,CAAC,cAAc,EAAE,YAAY,CAAC,CAAC;IACnD,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,MAAM,CAAC,OAAO,CAAC,CAAC;IAEhC,QAAQ,CAAC,EAAE,SAAS,GAAG,IAAI,CAAC;CAC5B;AAED,eAAO,MAAM,SAAS,6FAuCrB,CAAC"}
@@ -16,11 +16,9 @@ export const TableCell = /*#__PURE__*/forwardRef(({
16
16
  const tableContext = useTableContext();
17
17
  const padding = (_ref = incomingPadding !== null && incomingPadding !== void 0 ? incomingPadding : tableContext === null || tableContext === void 0 ? void 0 : tableContext.padding) !== null && _ref !== void 0 ? _ref : 'none';
18
18
  return /*#__PURE__*/_jsx(Box, {
19
+ as: "td",
19
20
  ref: ref,
20
- role: "gridcell"
21
- // TODO: look into use of `scope` prop on non table headinging cells
22
- // scope="row"
23
- ,
21
+ role: "gridcell",
24
22
  display: "flex",
25
23
  alignItems: "center",
26
24
  position: "relative",
@@ -1 +1 @@
1
- {"version":3,"file":"TableHeadCell.css.d.ts","sourceRoot":"","sources":["../../../lib/components/Table/TableHeadCell.css.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,YAAY,QAAgC,CAAC;AAE1D,eAAO,MAAM,IAAI,QAMf,CAAC;AASH,eAAO,MAAM,MAAM;;;;;CAiClB,CAAC;AAEF,eAAO,MAAM,MAAM,QAIjB,CAAC"}
1
+ {"version":3,"file":"TableHeadCell.css.d.ts","sourceRoot":"","sources":["../../../lib/components/Table/TableHeadCell.css.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,YAAY,QAAgC,CAAC;AAE1D,eAAO,MAAM,IAAI,QAMf,CAAC;AASH,eAAO,MAAM,MAAM;;;;;CA4BlB,CAAC;AAEF,eAAO,MAAM,MAAM,QAIjB,CAAC"}
@@ -18,34 +18,29 @@ export const text = style({
18
18
  const sorterRoot = style({
19
19
  transformOrigin: 'center',
20
20
  transitionDuration: '0.3s',
21
- transitionProperty: 'transform',
22
- willChange: 'transform'
21
+ transitionProperty: 'transform, opacity, color',
22
+ willChange: 'transform, opacity'
23
23
  }, "sorterRoot");
24
24
  export const sorter = _objectSpread({
25
25
  root: [sorterRoot, style({
26
- color: vars.typography.colour.muted,
27
- transitionTimingFunction: vars.animation.easing.standard,
28
- selectors: {
29
- [`${sorterButton}:hover &`]: {
30
- color: vars.typography.colour.dark
31
- }
32
- }
26
+ color: vars.typography.colour.dark,
27
+ transitionTimingFunction: vars.animation.easing.standard
33
28
  }, "sorter_root")]
34
29
  }, styleVariants({
35
30
  asc: {
36
- transform: 'translateY(0px) rotateY(0)'
31
+ opacity: '1',
32
+ transform: 'rotateX(0)'
37
33
  },
38
34
  desc: {
39
- transform: 'translateY(0px) rotateX(180deg)'
35
+ opacity: '1',
36
+ transform: 'rotateX(180deg)'
40
37
  },
41
38
  none: {
42
- opacity: '0',
43
- transform: 'translateY(10%) rotateX(0)',
44
- transitionProperty: 'transform, opacity',
39
+ opacity: '0.5',
40
+ transform: 'rotateX(0)',
45
41
  selectors: {
46
42
  [`${sorterButton}:hover &`]: {
47
- opacity: '0.50',
48
- transform: 'translateY(0px) rotateX(0)'
43
+ opacity: '1'
49
44
  }
50
45
  }
51
46
  }
@@ -1,4 +1,4 @@
1
- import type { AriaAttributes } from 'react';
1
+ import type { AriaAttributes, MouseEventHandler, ReactNode } from 'react';
2
2
  import * as React from 'react';
3
3
  import { Alignment } from '../../utils';
4
4
  import { type BoxProps } from '../Box/Box';
@@ -6,8 +6,8 @@ type Sort = 'asc' | 'desc' | 'none';
6
6
  export interface TableHeadCellProps extends Partial<Pick<AriaAttributes, 'aria-label'>>, Pick<BoxProps, 'padding'> {
7
7
  align?: Alignment;
8
8
  sort?: Sort;
9
- onSort?: (event: MouseEvent) => void;
10
- children?: string | null;
9
+ onSort?: MouseEventHandler<HTMLTableCellElement>;
10
+ children?: ReactNode;
11
11
  }
12
12
  export declare const TableHeadCell: React.ForwardRefExoticComponent<TableHeadCellProps & React.RefAttributes<HTMLTableCellElement>>;
13
13
  export {};
@@ -1 +1 @@
1
- {"version":3,"file":"TableHeadCell.d.ts","sourceRoot":"","sources":["../../../lib/components/Table/TableHeadCell.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAC5C,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,SAAS,EAA4B,MAAM,aAAa,CAAC;AAClE,OAAO,EAAO,KAAK,QAAQ,EAAE,MAAM,YAAY,CAAC;AAShD,KAAK,IAAI,GAAG,KAAK,GAAG,MAAM,GAAG,MAAM,CAAC;AAEpC,MAAM,WAAW,kBAChB,SAAQ,OAAO,CAAC,IAAI,CAAC,cAAc,EAAE,YAAY,CAAC,CAAC,EAClD,IAAI,CAAC,QAAQ,EAAE,SAAS,CAAC;IAC1B,KAAK,CAAC,EAAE,SAAS,CAAC;IAElB,IAAI,CAAC,EAAE,IAAI,CAAC;IACZ,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,KAAK,IAAI,CAAC;IAErC,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CACzB;AAUD,eAAO,MAAM,aAAa,iGAyGzB,CAAC"}
1
+ {"version":3,"file":"TableHeadCell.d.ts","sourceRoot":"","sources":["../../../lib/components/Table/TableHeadCell.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAC1E,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,SAAS,EAA4B,MAAM,aAAa,CAAC;AAClE,OAAO,EAAO,KAAK,QAAQ,EAAE,MAAM,YAAY,CAAC;AAQhD,KAAK,IAAI,GAAG,KAAK,GAAG,MAAM,GAAG,MAAM,CAAC;AAEpC,MAAM,WAAW,kBAChB,SAAQ,OAAO,CAAC,IAAI,CAAC,cAAc,EAAE,YAAY,CAAC,CAAC,EAClD,IAAI,CAAC,QAAQ,EAAE,SAAS,CAAC;IAC1B,KAAK,CAAC,EAAE,SAAS,CAAC;IAElB,IAAI,CAAC,EAAE,IAAI,CAAC;IACZ,MAAM,CAAC,EAAE,iBAAiB,CAAC,oBAAoB,CAAC,CAAC;IAEjD,QAAQ,CAAC,EAAE,SAAS,CAAC;CACrB;AAUD,eAAO,MAAM,aAAa,iGAqGzB,CAAC"}
@@ -1,4 +1,4 @@
1
- import { ArrowUpIcon } from '@autoguru/icons';
1
+ import { SortIcon } from '@autoguru/icons';
2
2
  import clsx from 'clsx';
3
3
  import * as React from 'react';
4
4
  import { forwardRef, useCallback } from 'react';
@@ -7,7 +7,6 @@ import { Box } from "../Box/Box.js";
7
7
  import { inline } from "../Flex/flex.js";
8
8
  import { Icon } from "../Icon/Icon.js";
9
9
  import { Text } from "../Text/Text.js";
10
- import { VisuallyHidden } from "../VisuallyHidden/VisuallyHidden.js";
11
10
  import * as styles from "./TableHeadCell.css.js";
12
11
  import { useTableContext } from "./context.js";
13
12
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
@@ -34,7 +33,7 @@ export const TableHeadCell = /*#__PURE__*/forwardRef(({
34
33
  }, [onSort]);
35
34
  const shouldSort = typeof sort === 'string';
36
35
  const sorter = /*#__PURE__*/_jsx(Icon, {
37
- icon: ArrowUpIcon,
36
+ icon: SortIcon,
38
37
  size: "small",
39
38
  className: clsx([styles.sorter.root, styles.sorter[sort !== null && sort !== void 0 ? sort : 'none']])
40
39
  });
@@ -44,16 +43,13 @@ export const TableHeadCell = /*#__PURE__*/forwardRef(({
44
43
  align: alignmentToFlexAlignment(align),
45
44
  justify: 'center'
46
45
  }),
47
- children: [align === 'right' && shouldSort ? sorter : null, /*#__PURE__*/_jsxs(Text, {
46
+ children: [align === 'right' && shouldSort ? sorter : null, /*#__PURE__*/_jsx(Text, {
48
47
  strong: true,
49
48
  size: "3",
50
49
  as: "span",
51
50
  align: align,
52
51
  className: styles.text,
53
- children: [children, shouldSort ? /*#__PURE__*/_jsxs(VisuallyHidden, {
54
- as: "span",
55
- children: [' ', "sorted ", sortToAria(sort)]
56
- }) : null]
52
+ children: children
57
53
  }), (align === 'left' || align === 'center') && shouldSort ? sorter : null]
58
54
  });
59
55
  return /*#__PURE__*/_jsx(Box, {
@@ -73,10 +69,10 @@ export const TableHeadCell = /*#__PURE__*/forwardRef(({
73
69
  onClick: sort ? sortClickHandler : undefined,
74
70
  children: sort ? /*#__PURE__*/_jsx(Box, {
75
71
  as: "button",
72
+ type: "button",
76
73
  display: "block",
77
74
  width: "full",
78
75
  padding: padding,
79
- tabIndex: -1,
80
76
  className: styles.sorterButton,
81
77
  children: child
82
78
  }) : child
@@ -0,0 +1,3 @@
1
+ export declare const staggerIndex: `var(--${string})`;
2
+ export declare const rowEntering: string;
3
+ //# sourceMappingURL=TableRow.css.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TableRow.css.d.ts","sourceRoot":"","sources":["../../../lib/components/Table/TableRow.css.ts"],"names":[],"mappings":"AAaA,eAAO,MAAM,YAAY,oBAAc,CAAC;AAaxC,eAAO,MAAM,WAAW,QAAY,CAAC"}
@@ -0,0 +1,29 @@
1
+ import * as __vanilla_filescope__ from '@vanilla-extract/css/fileScope';
2
+ __vanilla_filescope__.setFileScope("lib/components/Table/TableRow.css.ts", "@autoguru/overdrive");
3
+ import { createVar, globalStyle, keyframes, style } from '@vanilla-extract/css';
4
+ import { overdriveTokens as vars } from "../../themes/theme.css.js";
5
+ /*
6
+ * Staggered row-entrance animation — slide-up with fade.
7
+ *
8
+ * Opt in by passing `staggerIndex={i}` to a <TableRow>; that applies
9
+ * the `rowEntering` class and sets the `--staggerIndex` CSS variable.
10
+ * TableRow uses `display: contents` so we can't animate the row box
11
+ * itself — the global selector targets the row's gridcell children.
12
+ */
13
+ export const staggerIndex = createVar("staggerIndex");
14
+ const slideUp = keyframes({
15
+ from: {
16
+ opacity: 0,
17
+ transform: 'translateY(12px)'
18
+ },
19
+ to: {
20
+ opacity: 1,
21
+ transform: 'translateY(0)'
22
+ }
23
+ }, "slideUp");
24
+ export const rowEntering = style({}, "rowEntering");
25
+ globalStyle(`${rowEntering} > [role="gridcell"]`, {
26
+ animation: `${slideUp} 300ms ${vars.animation.easing.decelerate} both`,
27
+ animationDelay: `calc(${staggerIndex} * 50ms)`
28
+ });
29
+ __vanilla_filescope__.endFileScope();
@@ -1,8 +1,28 @@
1
1
  import * as React from 'react';
2
2
  import { MouseEventHandler, ReactNode } from 'react';
3
3
  export interface TableRowProps {
4
- onClick?: MouseEventHandler<HTMLDivElement>;
4
+ /** Click handler fired when any part of the row is clicked. */
5
+ onClick?: MouseEventHandler<HTMLTableRowElement>;
6
+ /**
7
+ * Opt-in entrance animation. When set to a number, the row's cells
8
+ * animate in with a staggered slide-up-and-fade (translateY 12px → 0,
9
+ * opacity 0 → 1, 300 ms with the decelerate easing token).
10
+ *
11
+ * Pass the row's index within the list (0, 1, 2, …) so each row waits
12
+ * `staggerIndex * 50 ms` before animating — producing a cascade.
13
+ * Omit the prop to disable the animation entirely.
14
+ *
15
+ * @example
16
+ * {rows.map((row, i) => (
17
+ * <TableRow key={row.id} staggerIndex={i}>…</TableRow>
18
+ * ))}
19
+ */
20
+ staggerIndex?: number;
21
+ /** Custom className applied to the underlying `<tr>` element. */
22
+ className?: string;
23
+ /** Inline style applied to the underlying `<tr>` element. */
24
+ style?: React.CSSProperties;
5
25
  children: ReactNode | ReactNode[];
6
26
  }
7
- export declare const TableRow: React.ForwardRefExoticComponent<TableRowProps & React.RefAttributes<HTMLDivElement>>;
27
+ export declare const TableRow: React.ForwardRefExoticComponent<TableRowProps & React.RefAttributes<HTMLTableRowElement>>;
8
28
  //# sourceMappingURL=TableRow.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"TableRow.d.ts","sourceRoot":"","sources":["../../../lib/components/Table/TableRow.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAc,iBAAiB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIjE,MAAM,WAAW,aAAa;IAC7B,OAAO,CAAC,EAAE,iBAAiB,CAAC,cAAc,CAAC,CAAC;IAE5C,QAAQ,EAAE,SAAS,GAAG,SAAS,EAAE,CAAC;CAClC;AAED,eAAO,MAAM,QAAQ,sFAMpB,CAAC"}
1
+ {"version":3,"file":"TableRow.d.ts","sourceRoot":"","sources":["../../../lib/components/Table/TableRow.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAc,iBAAiB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AASjE,MAAM,WAAW,aAAa;IAC7B,+DAA+D;IAC/D,OAAO,CAAC,EAAE,iBAAiB,CAAC,mBAAmB,CAAC,CAAC;IAEjD;;;;;;;;;;;;;OAaG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB,iEAAiE;IACjE,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,6DAA6D;IAC7D,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAE5B,QAAQ,EAAE,SAAS,GAAG,SAAS,EAAE,CAAC;CAClC;AAED,eAAO,MAAM,QAAQ,2FA4BpB,CAAC"}
@@ -1,15 +1,35 @@
1
+ import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
2
+ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
3
+ 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; }
4
+ import { assignInlineVars } from '@vanilla-extract/dynamic';
5
+ import clsx from 'clsx';
1
6
  import * as React from 'react';
2
7
  import { forwardRef } from 'react';
3
8
  import { Box } from "../Box/Box.js";
9
+ import { rowEntering, staggerIndex as staggerIndexVar } from "./TableRow.css.js";
4
10
  import { jsx as _jsx } from "react/jsx-runtime";
5
11
  export const TableRow = /*#__PURE__*/forwardRef(({
6
12
  children,
7
- onClick
8
- }, ref) => /*#__PURE__*/_jsx(Box, {
9
- ref: ref,
10
- display: "contents",
11
- role: "row",
12
- onClick: onClick,
13
- children: children
14
- }));
13
+ onClick,
14
+ className,
15
+ style,
16
+ staggerIndex
17
+ }, ref) => {
18
+ const shouldAnimate = typeof staggerIndex === 'number';
19
+ const mergedStyle = shouldAnimate ? _objectSpread(_objectSpread({}, style), assignInlineVars({
20
+ [staggerIndexVar]: String(staggerIndex)
21
+ })) : style;
22
+ return /*#__PURE__*/_jsx(Box, {
23
+ as: "tr",
24
+ ref: ref,
25
+ display: "contents",
26
+ role: "row",
27
+ onClick: onClick,
28
+ className: clsx(className, {
29
+ [rowEntering]: shouldAnimate
30
+ }),
31
+ style: mergedStyle,
32
+ children: children
33
+ });
34
+ });
15
35
  TableRow.displayName = 'TableRow';
@@ -3,5 +3,5 @@ import { ReactNode } from 'react';
3
3
  export interface TableRowGroupProps {
4
4
  children: ReactNode | ReactNode[];
5
5
  }
6
- export declare const TableRowGroup: React.ForwardRefExoticComponent<TableRowGroupProps & React.RefAttributes<HTMLDivElement>>;
6
+ export declare const TableRowGroup: React.ForwardRefExoticComponent<TableRowGroupProps & React.RefAttributes<HTMLTableSectionElement>>;
7
7
  //# sourceMappingURL=TableRowGroup.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"TableRowGroup.d.ts","sourceRoot":"","sources":["../../../lib/components/Table/TableRowGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAc,SAAS,EAAE,MAAM,OAAO,CAAC;AAI9C,MAAM,WAAW,kBAAkB;IAClC,QAAQ,EAAE,SAAS,GAAG,SAAS,EAAE,CAAC;CAClC;AAED,eAAO,MAAM,aAAa,2FAMzB,CAAC"}
1
+ {"version":3,"file":"TableRowGroup.d.ts","sourceRoot":"","sources":["../../../lib/components/Table/TableRowGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAc,SAAS,EAAE,MAAM,OAAO,CAAC;AAI9C,MAAM,WAAW,kBAAkB;IAClC,QAAQ,EAAE,SAAS,GAAG,SAAS,EAAE,CAAC;CAClC;AAED,eAAO,MAAM,aAAa,oGAOxB,CAAC"}
@@ -5,6 +5,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
5
5
  export const TableRowGroup = /*#__PURE__*/forwardRef(({
6
6
  children
7
7
  }, ref) => /*#__PURE__*/_jsx(Box, {
8
+ as: "tbody",
8
9
  ref: ref,
9
10
  role: "rowgroup",
10
11
  display: "contents",
@@ -3,7 +3,7 @@ export { Alert } from './Alert';
3
3
  export { Anchor } from './Anchor';
4
4
  export { AutoSuggest, type AutoSuggestValue, type AutoSuggestItemRenderer, } from './AutoSuggest';
5
5
  export { Badge } from './Badge';
6
- export { Box, type BoxProps, useBox, type UseBoxProps, } from './Box';
6
+ export { Box, type BoxProps, useBox, type UseBoxProps } from './Box';
7
7
  export { BulletList, Bullet } from './BulletList';
8
8
  export { BulletText } from './BulletText';
9
9
  export { Button } from './Button';
@@ -14,6 +14,7 @@ export { Columns, Column } from './Columns';
14
14
  export { DateInput } from './DateInput';
15
15
  export { DatePicker } from './DatePicker';
16
16
  export { DateTimeField, type DateTimeFieldProps, DateField, type DateFieldProps, TimeField, type TimeFieldProps, type CommonSelectorProps, } from './DateTimeField';
17
+ export { DataTable, type DataTableProps } from './DataTable';
17
18
  export { DividerLine } from './DividerLine';
18
19
  export { DropDown, DropDownOption } from './DropDown';
19
20
  export { EditableText } from './EditableText';
@@ -50,7 +51,7 @@ export { ScrollPane } from './ScrollPane';
50
51
  export { SearchBar, type SearchBarProps } from './SearchBar';
51
52
  export { Section } from './Section';
52
53
  export { SelectInput } from './SelectInput';
53
- export { SimplePagination, EPageChangeDirection, } from './SimplePagination';
54
+ export { SimplePagination, EPageChangeDirection } from './SimplePagination';
54
55
  export { Slider, type SliderProps } from './Slider';
55
56
  export { SliderProgress } from './SliderProgress';
56
57
  export { Stack } from './Stack';
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../lib/components/index.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../lib/components/index.ts"],"names":[],"mappings":"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"}
@@ -14,6 +14,7 @@ export { Columns, Column } from "./Columns/index.js";
14
14
  export { DateInput } from "./DateInput/index.js";
15
15
  export { DatePicker } from "./DatePicker/index.js";
16
16
  export { DateTimeField, DateField, TimeField } from "./DateTimeField/index.js";
17
+ export { DataTable } from "./DataTable/index.js";
17
18
  export { DividerLine } from "./DividerLine/index.js";
18
19
  export { DropDown, DropDownOption } from "./DropDown/index.js";
19
20
  export { EditableText } from "./EditableText/index.js";
@@ -50,12 +50,12 @@ export declare const sprinkles: ((props: {
50
50
  borderStyleRight?: "none" | "solid" | undefined;
51
51
  borderStyleTop?: "none" | "solid" | undefined;
52
52
  } & {
53
- display?: ("none" | "flex" | "grid" | "block" | "contents" | "inline" | "inline-block" | "inline-flex" | "inlineBlock" | "inlineFlex" | {
54
- mobile?: "none" | "flex" | "grid" | "block" | "contents" | "inline" | "inline-block" | "inline-flex" | "inlineBlock" | "inlineFlex" | undefined;
55
- tablet?: "none" | "flex" | "grid" | "block" | "contents" | "inline" | "inline-block" | "inline-flex" | "inlineBlock" | "inlineFlex" | undefined;
56
- desktop?: "none" | "flex" | "grid" | "block" | "contents" | "inline" | "inline-block" | "inline-flex" | "inlineBlock" | "inlineFlex" | undefined;
57
- largeDesktop?: "none" | "flex" | "grid" | "block" | "contents" | "inline" | "inline-block" | "inline-flex" | "inlineBlock" | "inlineFlex" | undefined;
58
- } | undefined) | import("@vanilla-extract/sprinkles").ResponsiveArray<1 | 2 | 3 | 4, "none" | "flex" | "grid" | "block" | "contents" | "inline" | "inline-block" | "inline-flex" | "inlineBlock" | "inlineFlex" | null>;
53
+ display?: ("none" | "flex" | "grid" | "block" | "inline" | "inline-block" | "inline-flex" | "contents" | "inlineBlock" | "inlineFlex" | {
54
+ mobile?: "none" | "flex" | "grid" | "block" | "inline" | "inline-block" | "inline-flex" | "contents" | "inlineBlock" | "inlineFlex" | undefined;
55
+ tablet?: "none" | "flex" | "grid" | "block" | "inline" | "inline-block" | "inline-flex" | "contents" | "inlineBlock" | "inlineFlex" | undefined;
56
+ desktop?: "none" | "flex" | "grid" | "block" | "inline" | "inline-block" | "inline-flex" | "contents" | "inlineBlock" | "inlineFlex" | undefined;
57
+ largeDesktop?: "none" | "flex" | "grid" | "block" | "inline" | "inline-block" | "inline-flex" | "contents" | "inlineBlock" | "inlineFlex" | undefined;
58
+ } | undefined) | import("@vanilla-extract/sprinkles").ResponsiveArray<1 | 2 | 3 | 4, "none" | "flex" | "grid" | "block" | "inline" | "inline-block" | "inline-flex" | "contents" | "inlineBlock" | "inlineFlex" | null>;
59
59
  overflow?: ("auto" | "hidden" | "visible" | {
60
60
  mobile?: "auto" | "hidden" | "visible" | undefined;
61
61
  tablet?: "auto" | "hidden" | "visible" | undefined;
@@ -477,7 +477,7 @@ export declare const sprinkles: ((props: {
477
477
  largeDesktop?: "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "none" | "auto" | undefined;
478
478
  } | undefined) | import("@vanilla-extract/sprinkles").ResponsiveArray<1 | 2 | 3 | 4, "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "none" | "auto" | null>;
479
479
  }) => string) & {
480
- properties: Set<"colour" | "backgroundColour" | "color" | "width" | "size" | "fontSize" | "lineHeight" | "fontWeight" | "opacity" | "alignContent" | "alignItems" | "alignSelf" | "backgroundColor" | "borderBottomColor" | "borderBottomStyle" | "borderBottomWidth" | "borderLeftColor" | "borderLeftStyle" | "borderLeftWidth" | "borderRightColor" | "borderRightStyle" | "borderRightWidth" | "borderTopColor" | "borderTopStyle" | "borderTopWidth" | "boxShadow" | "columnGap" | "display" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "height" | "justifyContent" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "maxWidth" | "minWidth" | "order" | "overflowX" | "overflowY" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "pointerEvents" | "position" | "rowGap" | "textAlign" | "textTransform" | "textWrap" | "userSelect" | "wordBreak" | "borderColor" | "borderRadius" | "borderStyle" | "borderWidth" | "gap" | "margin" | "overflow" | "padding" | "placeItems" | "text" | "p" | "borderBottomColour" | "borderLeftColour" | "borderRightColour" | "borderTopColour" | "useVar" | "bg" | "fg" | "borderColorX" | "borderColorY" | "borderColour" | "borderColourX" | "borderColourY" | "borderStyleBottom" | "borderStyleLeft" | "borderStyleRight" | "borderStyleTop" | "gridColumns" | "borderWidthX" | "borderWidthY" | "borderWidthBottom" | "borderWidthLeft" | "borderWidthRight" | "borderWidthTop" | "paddingX" | "px" | "paddingY" | "py" | "pt" | "pr" | "pb" | "pl" | "m" | "marginX" | "mx" | "marginY" | "my" | "mt" | "mr" | "mb" | "ml">;
480
+ properties: Set<"colour" | "backgroundColour" | "color" | "width" | "size" | "fontSize" | "lineHeight" | "fontWeight" | "opacity" | "alignContent" | "alignItems" | "alignSelf" | "backgroundColor" | "borderBottomColor" | "borderBottomStyle" | "borderBottomWidth" | "borderLeftColor" | "borderLeftStyle" | "borderLeftWidth" | "borderRightColor" | "borderRightStyle" | "borderRightWidth" | "borderTopColor" | "borderTopStyle" | "borderTopWidth" | "boxShadow" | "columnGap" | "display" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "height" | "justifyContent" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "maxWidth" | "minWidth" | "order" | "overflowX" | "overflowY" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "pointerEvents" | "position" | "rowGap" | "textAlign" | "textTransform" | "userSelect" | "wordBreak" | "borderColor" | "borderRadius" | "borderStyle" | "borderWidth" | "gap" | "margin" | "overflow" | "padding" | "placeItems" | "textWrap" | "text" | "p" | "borderBottomColour" | "borderLeftColour" | "borderRightColour" | "borderTopColour" | "useVar" | "bg" | "fg" | "borderColorX" | "borderColorY" | "borderColour" | "borderColourX" | "borderColourY" | "borderStyleBottom" | "borderStyleLeft" | "borderStyleRight" | "borderStyleTop" | "gridColumns" | "borderWidthX" | "borderWidthY" | "borderWidthBottom" | "borderWidthLeft" | "borderWidthRight" | "borderWidthTop" | "paddingX" | "px" | "paddingY" | "py" | "pt" | "pr" | "pb" | "pl" | "m" | "marginX" | "mx" | "marginY" | "my" | "mt" | "mr" | "mb" | "ml">;
481
481
  };
482
482
  export type Sprinkles = Parameters<typeof sprinkles>[0];
483
483
  /**
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@autoguru/overdrive",
3
- "version": "4.54.0",
3
+ "version": "4.55.0",
4
4
  "description": "Overdrive is a product component library, and design system for AutoGuru.",
5
5
  "types": "dist/index.d.ts",
6
6
  "main": "dist/index.js",
@@ -123,7 +123,7 @@
123
123
  "@antebudimir/eslint-plugin-vanilla-extract": "^1.12.0",
124
124
  "@autoguru/babel-preset": "3.2.0",
125
125
  "@autoguru/eslint-plugin": "2.0.0",
126
- "@autoguru/icons": "1.8.16",
126
+ "@autoguru/icons": "1.8.22",
127
127
  "@autoguru/tsconfig": "1.3.1",
128
128
  "@autoguru/utilities": "^1.3.3",
129
129
  "@babel/cli": "7.28.3",
@@ -144,7 +144,7 @@
144
144
  "@babel/runtime-corejs3": "7.28.4",
145
145
  "@changesets/cli": "2.29.7",
146
146
  "@chromatic-com/storybook": "4.1.1",
147
- "@internationalized/date": "3.10.0",
147
+ "@internationalized/date": "3.12.1",
148
148
  "@octokit/rest": "22.0.0",
149
149
  "@popperjs/core": "2.11.8",
150
150
  "@react-stately/toggle": "3.9.2",
@@ -209,7 +209,7 @@
209
209
  "react-intersection-observer": "9.16.0",
210
210
  "react-keyed-flatten-children": "5.0.1",
211
211
  "react-markdown": "^9.0.0",
212
- "react-stately": "3.42.0",
212
+ "react-stately": "3.46.0",
213
213
  "react-swipeable": "7.0.2",
214
214
  "remark-gfm": "^4.0.0",
215
215
  "rollup-plugin-visualizer": "6.0.5",
@@ -252,7 +252,7 @@
252
252
  }
253
253
  },
254
254
  "volta": {
255
- "node": "22.20.0",
255
+ "node": "22.22.2",
256
256
  "yarn": "4.10.3"
257
257
  },
258
258
  "packageManager": "yarn@4.10.3"