@autoguru/overdrive 4.45.2 → 4.47.0

package/dist/components/OptionGrid/OptionGrid.css.d.ts

@@ -1,57 +1,56 @@
 import { type RecipeVariants } from '@vanilla-extract/recipes';
+import { cssLayerComponent } from '../../styles/layers.css';
 export declare const gridContainer: string;
 export declare const gridContainerStyle: string;
-export declare const styledGrid: import("@vanilla-extract/recipes").RuntimeFn<{
+export declare const gridVariants: import("@vanilla-extract/recipes").RuntimeFn<{
     columns: {
         '1': {};
         '2': {
-            '@container': {
-                [x: string]: {
-                    gridTemplateColumns: "repeat(2, 1fr)";
-                } | {
-                    gridTemplateColumns: "repeat(3, 1fr)";
+            '@layer': {
+                [cssLayerComponent]: {
+                    '@container': {
+                        [x: string]: {
+                            gridTemplateColumns: "repeat(2, 1fr)";
+                        } | {
+                            gridTemplateColumns: "repeat(3, 1fr)";
+                        };
+                    };
                 };
             };
         };
         '3': {
-            '@container': {
-                [x: string]: {
-                    gridTemplateColumns: "repeat(2, 1fr)";
-                } | {
-                    gridTemplateColumns: "repeat(3, 1fr)";
+            '@layer': {
+                [cssLayerComponent]: {
+                    '@container': {
+                        [x: string]: {
+                            gridTemplateColumns: "repeat(2, 1fr)";
+                        } | {
+                            gridTemplateColumns: "repeat(3, 1fr)";
+                        };
+                    };
                 };
             };
         };
         '4': string;
         '5': (string | {
-            '@container': {
-                [x: string]: {
-                    gridTemplateColumns: "repeat(5, 1fr)";
+            '@layer': {
+                [cssLayerComponent]: {
+                    '@container': {
+                        [x: string]: {
+                            gridTemplateColumns: "repeat(5, 1fr)";
+                        };
+                    };
                 };
             };
         })[];
     };
 }>;
-export type StyledGridProps = NonNullable<RecipeVariants<typeof styledGrid>>;
-export declare const styledGridItem: import("@vanilla-extract/recipes").RuntimeFn<{
-    [x: string]: {
-        [x: string]: string | import("@vanilla-extract/css").ComplexStyleRule;
-    };
-}>;
-export type StyledGridItemProps = NonNullable<RecipeVariants<typeof styledGridItem>>;
-export declare const styleIndicator: string;
-export declare const styledCheckbox: import("@vanilla-extract/recipes").RuntimeFn<{
-    [x: string]: {
-        [x: string]: string | import("@vanilla-extract/css").ComplexStyleRule;
-    };
-}>;
-export type StyledCheckboxProps = NonNullable<RecipeVariants<typeof styledCheckbox>>;
-export declare const styledRadioButton: import("@vanilla-extract/recipes").RuntimeFn<{
-    [x: string]: {
-        [x: string]: string | import("@vanilla-extract/css").ComplexStyleRule;
-    };
-}>;
-export type StyledRadioButtonProps = NonNullable<RecipeVariants<typeof styledRadioButton>>;
+export type GridVariants = NonNullable<RecipeVariants<typeof gridVariants>>;
+export declare const gridItemContainerStyle: string;
+export declare const gridItemStyle: string;
+export declare const indicatorStyle: string;
+export declare const checkboxStyle: string;
+export declare const radioButtonStyle: string;
 export declare const labelStyle: string;
 export declare const descriptionStyle: string;
 //# sourceMappingURL=OptionGrid.css.d.ts.map

package/dist/components/OptionGrid/OptionGrid.css.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"OptionGrid.css.d.ts","sourceRoot":"","sources":["../../../lib/components/OptionGrid/OptionGrid.css.ts"],"names":[],"mappings":"AACA,OAAO,EAAU,KAAK,cAAc,EAAE,MAAM,0BAA0B,CAAC;AASvE,eAAO,MAAM,aAAa,QAAoB,CAAC;AAC/C,eAAO,MAAM,kBAAkB,QAG7B,CAAC;AAuBH,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA6CrB,CAAC;AAEH,MAAM,MAAM,eAAe,GAAG,WAAW,CAAC,cAAc,CAAC,OAAO,UAAU,CAAC,CAAC,CAAC;AAO7E,eAAO,MAAM,cAAc;;;;EAkDzB,CAAC;AAEH,MAAM,MAAM,mBAAmB,GAAG,WAAW,CAC5C,cAAc,CAAC,OAAO,cAAc,CAAC,CACrC,CAAC;AAGF,eAAO,MAAM,cAAc,QAGzB,CAAC;AAEH,eAAO,MAAM,cAAc;;;;EAiCzB,CAAC;AAEH,MAAM,MAAM,mBAAmB,GAAG,WAAW,CAC5C,cAAc,CAAC,OAAO,cAAc,CAAC,CACrC,CAAC;AAwBF,eAAO,MAAM,iBAAiB;;;;EAgC5B,CAAC;AAEH,MAAM,MAAM,sBAAsB,GAAG,WAAW,CAC/C,cAAc,CAAC,OAAO,iBAAiB,CAAC,CACxC,CAAC;AAIF,eAAO,MAAM,UAAU,QAErB,CAAC;AAEH,eAAO,MAAM,gBAAgB,QAE3B,CAAC"}
+{"version":3,"file":"OptionGrid.css.d.ts","sourceRoot":"","sources":["../../../lib/components/OptionGrid/OptionGrid.css.ts"],"names":[],"mappings":"AACA,OAAO,EAAU,KAAK,cAAc,EAAE,MAAM,0BAA0B,CAAC;AAGvE,OAAO,EAAE,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;AAQ5D,eAAO,MAAM,aAAa,QAAoB,CAAC;AAC/C,eAAO,MAAM,kBAAkB,QAO7B,CAAC;AA4BH,eAAO,MAAM,YAAY;;;;;gBAWpB,CAAC,iBAAiB,CAAC;;;;;;;;kBASlB;;;;;gBAKD,CAAC,iBAAiB,CAAC;;;;;;;;kBAUlB;;;;;;gBAQA,CAAC,iBAAiB,CAAC;;;;;;kBAMlB;;;;EASL,CAAC;AAEH,MAAM,MAAM,YAAY,GAAG,WAAW,CAAC,cAAc,CAAC,OAAO,YAAY,CAAC,CAAC,CAAC;AAY5E,eAAO,MAAM,sBAAsB,QAsBjC,CAAC;AAEH,eAAO,MAAM,aAAa,QA8CxB,CAAC;AAIH,eAAO,MAAM,cAAc,QAOzB,CAAC;AAEH,eAAO,MAAM,aAAa,QAkCxB,CAAC;AA4BH,eAAO,MAAM,gBAAgB,QAkC3B,CAAC;AAIH,eAAO,MAAM,UAAU,QAA+B,CAAC;AACvD,eAAO,MAAM,gBAAgB,QAA+B,CAAC"}

package/dist/components/OptionGrid/OptionGrid.css.js

@@ -5,36 +5,46 @@ __vanilla_filescope__.setFileScope("lib/components/OptionGrid/OptionGrid.css.ts"
 import { createContainer, style } from '@vanilla-extract/css';
 import { recipe } from '@vanilla-extract/recipes';
 import { focusOutlineStyle } from "../../styles/focusOutline.css.js";
+import { cssLayerComponent } from "../../styles/layers.css.js";
+import { selectors } from "../../styles/selectors.js";
 import { sprinkles } from "../../styles/sprinkles.css.js";
 import { breakpoints } from "../../themes/makeTheme.js";
-import { overdriveTokens as tokens } from "../../themes/theme.css.js";
-import { interactionStyle, notDisabled, notSelected } from "../../utils/css.js"; // === Container styles
+import { overdriveTokens as tokens } from "../../themes/theme.css.js"; // === Container styles
 export const gridContainer = createContainer("gridContainer");
 export const gridContainerStyle = style({
-  containerName: gridContainer,
-  containerType: 'inline-size'
+  '@layer': {
+    [cssLayerComponent]: {
+      containerName: gridContainer,
+      containerType: 'inline-size'
+    }
+  }
 }, "gridContainerStyle");
 
-// == Grid styles
+// === Grid styles
+
 const minWidth1200 = '(min-width: 1200px)';
 const repeat2Col = 'repeat(2, 1fr)';
 const repeat3Col = 'repeat(3, 1fr)';
 const repeat4Col = 'repeat(4, 1fr)';
 const repeat5Col = 'repeat(5, 1fr)';
 const grid4ColStyle = style({
-  '@container': {
-    [`${gridContainer} (min-width: ${breakpoints.mobile})`]: {
-      gridTemplateColumns: repeat2Col
-    },
-    [`${gridContainer} (min-width: ${breakpoints.tablet})`]: {
-      gridTemplateColumns: repeat3Col
-    },
-    [`${gridContainer} (min-width: ${breakpoints.desktop})`]: {
-      gridTemplateColumns: repeat4Col
+  '@layer': {
+    [cssLayerComponent]: {
+      '@container': {
+        [`${gridContainer} (min-width: ${breakpoints.mobile})`]: {
+          gridTemplateColumns: repeat2Col
+        },
+        [`${gridContainer} (min-width: ${breakpoints.tablet})`]: {
+          gridTemplateColumns: repeat3Col
+        },
+        [`${gridContainer} (min-width: ${breakpoints.desktop})`]: {
+          gridTemplateColumns: repeat4Col
+        }
+      }
     }
   }
 }, "grid4ColStyle");
-export const styledGrid = recipe({
+export const gridVariants = recipe({
   base: sprinkles({
     display: 'grid',
     gridColumns: {
@@ -46,30 +56,42 @@ export const styledGrid = recipe({
     columns: {
       '1': {},
       '2': {
-        '@container': {
-          [`${gridContainer} (min-width: 640px)`]: {
-            gridTemplateColumns: repeat2Col
-          },
-          [`${gridContainer} ${minWidth1200}`]: {
-            gridTemplateColumns: repeat3Col
+        '@layer': {
+          [cssLayerComponent]: {
+            '@container': {
+              [`${gridContainer} (min-width: 640px)`]: {
+                gridTemplateColumns: repeat2Col
+              },
+              [`${gridContainer} ${minWidth1200}`]: {
+                gridTemplateColumns: repeat3Col
+              }
+            }
           }
         }
       },
       '3': {
-        '@container': {
-          [`${gridContainer} (min-width: 550px)`]: {
-            gridTemplateColumns: repeat2Col
-          },
-          [`${gridContainer} (min-width: ${breakpoints.desktop})`]: {
-            gridTemplateColumns: repeat3Col
+        '@layer': {
+          [cssLayerComponent]: {
+            '@container': {
+              [`${gridContainer} (min-width: 550px)`]: {
+                gridTemplateColumns: repeat2Col
+              },
+              [`${gridContainer} (min-width: ${breakpoints.desktop})`]: {
+                gridTemplateColumns: repeat3Col
+              }
+            }
           }
         }
       },
       '4': grid4ColStyle,
       '5': [grid4ColStyle, {
-        '@container': {
-          [`${gridContainer} ${minWidth1200}`]: {
-            gridTemplateColumns: repeat5Col
+        '@layer': {
+          [cssLayerComponent]: {
+            '@container': {
+              [`${gridContainer} ${minWidth1200}`]: {
+                gridTemplateColumns: repeat5Col
+              }
+            }
           }
         }
       }]
@@ -78,139 +100,179 @@ export const styledGrid = recipe({
   defaultVariants: {
     columns: '2'
   }
-}, "styledGrid");
+}, "gridVariants");
 // === Option item styles
+
 const optionTransition = style({
-  transition: 'background 100ms ease-in, border-color 100ms ease-in'
+  '@layer': {
+    [cssLayerComponent]: {
+      transition: 'background 100ms ease-in, border-color 100ms ease-in'
+    }
+  }
 }, "optionTransition");
-export const styledGridItem = recipe({
-  base: [{
-    alignItems: 'center',
-    backgroundColor: tokens.colours.background.body,
-    borderColor: tokens.border.colours.gray,
-    borderRadius: tokens.border.radius['md'],
-    borderStyle: 'solid',
-    borderWidth: tokens.border.width[1],
-    minHeight: '80px',
-    userSelect: 'none',
-    display: 'flex',
-    gap: tokens.space[2],
-    padding: `${tokens.space[3]} ${tokens.space[4]}`,
-    position: 'relative'
-  }, interactionStyle({
-    hover: {
-      cursor: 'pointer'
-    },
-    selected: {
+export const gridItemContainerStyle = style([sprinkles({
+  alignItems: 'center',
+  borderRadius: 'md',
+  borderStyle: 'solid',
+  borderWidth: '1',
+  display: 'flex',
+  gap: '2',
+  px: '4',
+  py: '3',
+  position: 'relative',
+  userSelect: 'none'
+}), {
+  '@layer': {
+    [cssLayerComponent]: {
       backgroundColor: tokens.colours.background.body,
-      borderColor: tokens.border.colours.dark
+      borderColor: tokens.border.colours.gray,
+      minHeight: '80px'
     }
-  }), {
-    selectors: {
-      '&[data-selected]:after': {
-        outlineColor: tokens.colours.gamut.black900,
-        outlineStyle: 'solid',
-        outlineWidth: tokens.border.width[2],
-        borderRadius: 'inherit',
-        content: '',
-        display: 'block',
-        position: 'absolute',
-        width: '100%',
-        height: '100%',
-        left: 0,
-        top: 0
-      },
-      '&:hover:not([data-selected]), &[data-focus-visible]:not([data-selected])': {
-        backgroundColor: tokens.border.colours.light,
-        borderColor: tokens.border.colours.light
+  }
+}], "gridItemContainerStyle");
+export const gridItemStyle = style([gridItemContainerStyle, {
+  '@layer': {
+    [cssLayerComponent]: {
+      backgroundColor: tokens.colours.background.body,
+      borderColor: tokens.border.colours.gray,
+      minHeight: '80px',
+      selectors: {
+        [selectors.hover]: {
+          cursor: 'pointer'
+        },
+        [selectors.selected]: {
+          backgroundColor: tokens.colours.background.body,
+          borderColor: tokens.border.colours.dark
+        },
+        [`${selectors.hoverNotSelected}, ${selectors.focusVisibleNotSelected}`]: {
+          backgroundColor: tokens.border.colours.light,
+          borderColor: tokens.border.colours.light
+        },
+        [`&[data-selected]:after`]: {
+          borderRadius: 'inherit',
+          content: '',
+          display: 'block',
+          height: '100%',
+          left: 0,
+          outlineColor: tokens.colours.gamut.black900,
+          outlineStyle: 'solid',
+          outlineWidth: tokens.border.width[2],
+          position: 'absolute',
+          top: 0,
+          width: '100%'
+        },
+        [selectors.disabled]: {
+          backgroundColor: tokens.colours.gamut.gray100,
+          borderColor: 'transparent',
+          color: tokens.colours.gamut.black500,
+          cursor: 'not-allowed'
+        }
       }
     }
-  }, optionTransition, focusOutlineStyle]
-}, "styledGridItem");
+  }
+}, optionTransition, focusOutlineStyle], "gridItemStyle");
+
 // === Indicator styles
-export const styleIndicator = style({
-  height: '26px',
-  width: '26px'
-}, "styleIndicator");
-export const styledCheckbox = recipe({
-  base: [{
-    borderColor: tokens.border.colours.gray,
-    borderRadius: tokens.border.radius['sm'],
-    borderStyle: 'solid',
-    borderWidth: tokens.border.width[1],
-    color: 'transparent'
-  }, interactionStyle({
-    selected: {
-      backgroundColor: tokens.colours.foreground.body,
-      color: tokens.colours.background.body
+
+export const indicatorStyle = style({
+  '@layer': {
+    [cssLayerComponent]: {
+      height: '26px',
+      width: '26px'
     }
-  }), {
-    selectors: {
-      [`&[data-hover]${notSelected}${notDisabled}, &[data-focus-visible]${notSelected}${notDisabled}`]: {
-        backgroundColor: tokens.colours.gamut.gray300,
-        color: tokens.colours.background.body
+  }
+}, "indicatorStyle");
+export const checkboxStyle = style([sprinkles({
+  alignItems: 'center',
+  borderColour: 'gray',
+  borderRadius: 'sm',
+  borderStyle: 'solid',
+  borderWidth: '1',
+  display: 'flex',
+  flexShrink: '0',
+  justifyContent: 'center',
+  size: '6'
+}), {
+  '@layer': {
+    [cssLayerComponent]: {
+      color: 'transparent',
+      selectors: {
+        [selectors.selected]: {
+          backgroundColor: tokens.colours.foreground.body,
+          color: tokens.colours.background.body
+        },
+        [`${selectors.hoverNotSelected}, ${selectors.focusVisibleNotSelected}`]: {
+          backgroundColor: tokens.colours.gamut.gray300,
+          color: tokens.colours.background.body
+        },
+        [selectors.disabled]: {
+          borderColor: tokens.colours.gamut.gray200
+        }
       }
     }
-  }, sprinkles({
-    alignItems: 'center',
-    display: 'flex',
-    flexShrink: '0',
-    justifyContent: 'center',
-    size: '6'
-  }), optionTransition]
-}, "styledCheckbox");
+  }
+}, optionTransition], "checkboxStyle");
 const pseudoRadio = style({
-  selectors: {
-    '&:after': {
-      borderRadius: 'inherit',
-      content: '',
-      display: 'block',
-      height: '100%',
-      left: 0,
-      position: 'absolute',
-      top: 0,
-      transform: 'scale(0.475)',
-      width: '100%'
-    },
-    '&[data-hover]:after, &[data-focus-visible]:after': {
-      background: tokens.colours.gamut.gray200
-    },
-    '&[data-selected]:after': {
-      background: tokens.colours.gamut.white
+  '@layer': {
+    [cssLayerComponent]: {
+      selectors: {
+        '&:after': {
+          borderRadius: 'inherit',
+          content: '',
+          display: 'block',
+          height: '100%',
+          left: 0,
+          position: 'absolute',
+          top: 0,
+          transform: 'scale(0.475)',
+          width: '100%'
+        },
+        [`${selectors.hover}:after, ${selectors.focusVisible}:after`]: {
+          background: tokens.colours.gamut.gray200
+        },
+        [`&[data-selected]:after`]: {
+          background: tokens.colours.gamut.white
+        }
+      }
     }
   }
 }, "pseudoRadio");
-export const styledRadioButton = recipe({
-  base: [{
-    backgroundColor: tokens.colours.background.body,
-    borderColor: tokens.border.colours.gray,
-    borderRadius: tokens.border.radius.full,
-    borderStyle: 'solid',
-    borderWidth: tokens.border.width[1],
-    position: 'relative'
-  }, interactionStyle({
-    selected: {
-      backgroundColor: tokens.colours.foreground.body,
-      borderColor: tokens.border.colours.dark
-    }
-  }), sprinkles({
-    alignItems: 'center',
-    size: '6'
-  }), {
-    selectors: {
-      '&[data-hover]:not([data-selected]),&[focus-visible]:not([data-selected])': {
-        backgroundColor: tokens.colours.gamut.gray300,
-        borderColor: tokens.colours.gamut.gray300
+export const radioButtonStyle = style([sprinkles({
+  alignItems: 'center',
+  borderRadius: 'full',
+  borderStyle: 'solid',
+  borderWidth: '1',
+  position: 'relative',
+  size: '6'
+}), {
+  '@layer': {
+    [cssLayerComponent]: {
+      backgroundColor: tokens.colours.background.body,
+      borderColor: tokens.border.colours.gray,
+      selectors: {
+        [selectors.selected]: {
+          backgroundColor: tokens.colours.foreground.body,
+          borderColor: tokens.border.colours.dark
+        },
+        [`${selectors.hoverNotSelected}, ${selectors.focusVisibleNotSelected}`]: {
+          backgroundColor: tokens.colours.gamut.gray300,
+          borderColor: tokens.colours.gamut.gray300
+        },
+        [selectors.disabled]: {
+          backgroundColor: tokens.colours.gamut.gray100,
+          borderColor: tokens.colours.gamut.gray200
+        }
       }
     }
-  }, pseudoRadio, optionTransition]
-}, "styledRadioButton");
+  }
+}, pseudoRadio, optionTransition], "radioButtonStyle");
+
 // === Label styles
 
-export const labelStyle = style({
-  fontSize: tokens.typography.size[4].fontSize
-}, "labelStyle");
-export const descriptionStyle = style({
-  fontSize: tokens.typography.size[2].fontSize
-}, "descriptionStyle");
+export const labelStyle = sprinkles({
+  fontSize: '4'
+});
+export const descriptionStyle = sprinkles({
+  fontSize: '2'
+});
 __vanilla_filescope__.endFileScope();

package/dist/components/OptionGrid/OptionGrid.d.ts

@@ -3,7 +3,7 @@ import { type ListBoxProps } from 'react-aria-components';
 import { type SelectionMode } from 'react-stately';
 import type { TestIdProp } from '../../types';
 import { type IconEl } from '../Icon';
-import { type StyledGridProps } from './OptionGrid.css';
+import { type GridVariants } from './OptionGrid.css';
 export interface OptionItem {
     name: string;
     label: string;
@@ -13,6 +13,10 @@ export interface OptionItem {
      */
     icon?: IconEl;
     description?: string;
+    /**
+     * Whether this option should be disabled
+     */
+    disabled?: boolean;
 }
 export interface OptionGridProps<T> extends Omit<ListBoxProps<T>, 'items'>, TestIdProp {
     /**
@@ -34,7 +38,11 @@ export interface OptionGridProps<T> extends Omit<ListBoxProps<T>, 'items'>, Test
     /**
      * Number of columns to display the options in
      */
-    columns?: StyledGridProps['columns'];
+    columns?: GridVariants['columns'];
+    /**
+     * Loading state
+     */
+    isLoading?: boolean;
 }
 /**
  * The OptionGrid is primarily used in the booking flow to provide large selectable tiles to the user. It is not a form
@@ -42,13 +50,16 @@ export interface OptionGridProps<T> extends Omit<ListBoxProps<T>, 'items'>, Test
  * and implements a listbox behaviour without wrapping an input element. It supports controlled and uncontrolled usage.
  * Following ARIA guidelines, the arrow keys can be used to navigate withing the group of options.
  *
+ * The ListBox implementation provides a Set of selected keys to the `onSelectionChange` handler. To preselect options
+ * in uncontrolled usage, simply provide a default selection using the `defaultSelectedKeys` prop.
  * See more details on react-aria [ListBox props](https://react-spectrum.adobe.com/react-aria/ListBox.html#listbox-1).
  *
- * Not yet implemented: disabled appearance, empty state, loading state, error state.
- *
  * Accessibility note: The ARIA spec prohibits listbox items from including interactive content such as buttons,
  * tooltips, etc. For these cases a completely different implementation is required (e.g. react-aria [GridList](
  * https://react-spectrum.adobe.com/react-aria/GridList.html))
  */
-export declare const OptionGrid: ({ className, columns, indicator, label, layout, selectionMode, testId, ...props }: OptionGridProps<OptionItem>) => React.JSX.Element;
+export declare const OptionGrid: {
+    ({ className, columns, indicator, isLoading, label, layout, selectionMode, testId, ...props }: OptionGridProps<OptionItem>): React.JSX.Element;
+    displayName: string;
+};
 //# sourceMappingURL=OptionGrid.d.ts.map

package/dist/components/OptionGrid/OptionGrid.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"OptionGrid.d.ts","sourceRoot":"","sources":["../../../lib/components/OptionGrid/OptionGrid.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAIN,KAAK,YAAY,EACjB,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAE,KAAK,aAAa,EAAE,MAAM,eAAe,CAAC;AAEnD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAE9C,OAAO,EAAQ,KAAK,MAAM,EAAE,MAAM,SAAS,CAAC;AAE5C,OAAO,EASN,KAAK,eAAe,EACpB,MAAM,kBAAkB,CAAC;AAE1B,MAAM,WAAW,UAAU;IAC1B,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;CACrB;AACD,MAAM,WAAW,eAAe,CAAC,CAAC,CACjC,SAAQ,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,OAAO,CAAC,EACrC,UAAU;IACX;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,KAAK,EAAE,UAAU,EAAE,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,GAAG,UAAU,GAAG,OAAO,CAAC;IAC1C;;OAEG;IACH,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B;;OAEG;IACH,OAAO,CAAC,EAAE,eAAe,CAAC,SAAS,CAAC,CAAC;CACrC;AAED;;;;;;;;;;;;;GAaG;AACH,eAAO,MAAM,UAAU,GAAI,mFAUxB,eAAe,CAAC,UAAU,CAAC,sBA+E7B,CAAC"}
+{"version":3,"file":"OptionGrid.d.ts","sourceRoot":"","sources":["../../../lib/components/OptionGrid/OptionGrid.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAIN,KAAK,YAAY,EACjB,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAE,KAAK,aAAa,EAAE,MAAM,eAAe,CAAC;AAEnD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAE9C,OAAO,EAAQ,KAAK,MAAM,EAAE,MAAM,SAAS,CAAC;AAG5C,OAAO,EAUN,KAAK,YAAY,EACjB,MAAM,kBAAkB,CAAC;AAE1B,MAAM,WAAW,UAAU;IAC1B,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACnB;AACD,MAAM,WAAW,eAAe,CAAC,CAAC,CACjC,SAAQ,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,OAAO,CAAC,EACrC,UAAU;IACX;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,KAAK,EAAE,UAAU,EAAE,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,GAAG,UAAU,GAAG,OAAO,CAAC;IAC1C;;OAEG;IACH,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B;;OAEG;IACH,OAAO,CAAC,EAAE,YAAY,CAAC,SAAS,CAAC,CAAC;IAClC;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;CACpB;AAED;;;;;;;;;;;;;GAaG;AACH,eAAO,MAAM,UAAU;mGAWpB,eAAe,CAAC,UAAU,CAAC;;CAgG7B,CAAC"}