@codecademy/gamut-styles 17.12.0-alpha.e6658d.0 → 17.12.0-alpha.f66feb.0

package/dist/ColorMode.d.ts

@@ -71,59 +71,32 @@ export declare const providerProps: import("@codecademy/variance/dist/types/conf
         readonly transform: (value: string | number) => string | 0;
     };
     readonly width: {
-        readonly property: {
-            readonly physical: "width";
-            readonly logical: "inlineSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "width";
         readonly transform: (value: string | number) => string | 0;
     };
     readonly minWidth: {
-        readonly property: {
-            readonly physical: "minWidth";
-            readonly logical: "minInlineSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "minWidth";
         readonly transform: (value: string | number) => string | 0;
     };
     readonly maxWidth: {
-        readonly property: {
-            readonly physical: "maxWidth";
-            readonly logical: "maxInlineSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "maxWidth";
         readonly transform: (value: string | number) => string | 0;
     };
     readonly height: {
-        readonly property: {
-            readonly physical: "height";
-            readonly logical: "blockSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "height";
         readonly transform: (value: string | number) => string | 0;
     };
     readonly minHeight: {
-        readonly property: {
-            readonly physical: "minHeight";
-            readonly logical: "minBlockSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "minHeight";
         readonly transform: (value: string | number) => string | 0;
     };
     readonly maxHeight: {
-        readonly property: {
-            readonly physical: "maxHeight";
-            readonly logical: "maxBlockSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "maxHeight";
         readonly transform: (value: string | number) => string | 0;
     };
     readonly verticalAlign: {
         readonly property: "verticalAlign";
     };
-    readonly direction: {
-        readonly property: "direction";
-    };
 }>>, import("@codecademy/variance/dist/types/config").Parser<import("@codecademy/variance/dist/types/config").TransformerMap<{
     readonly color: {
         readonly property: "color";
@@ -729,9 +702,6 @@ export declare const VariableProvider: import("@emotion/styled").StyledComponent
     containerType?: import("@codecademy/variance/dist/types/config").Scale<{
         readonly property: "containerType";
     }>;
-    direction?: import("@codecademy/variance/dist/types/config").Scale<{
-        readonly property: "direction";
-    }>;
     display?: import("@codecademy/variance/dist/types/config").Scale<{
         readonly property: "display";
     }>;
@@ -781,11 +751,7 @@ export declare const VariableProvider: import("@emotion/styled").StyledComponent
         readonly property: "gridTemplateRows";
     }>;
     height?: import("@codecademy/variance/dist/types/config").Scale<{
-        readonly property: {
-            readonly physical: "height";
-            readonly logical: "blockSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "height";
         readonly transform: (value: string | number) => string | 0;
     }>;
     justifyContent?: import("@codecademy/variance/dist/types/config").Scale<{
@@ -802,35 +768,19 @@ export declare const VariableProvider: import("@emotion/styled").StyledComponent
         readonly transform: (value: string | number) => string | 0;
     }>;
     maxHeight?: import("@codecademy/variance/dist/types/config").Scale<{
-        readonly property: {
-            readonly physical: "maxHeight";
-            readonly logical: "maxBlockSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "maxHeight";
         readonly transform: (value: string | number) => string | 0;
     }>;
     maxWidth?: import("@codecademy/variance/dist/types/config").Scale<{
-        readonly property: {
-            readonly physical: "maxWidth";
-            readonly logical: "maxInlineSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "maxWidth";
         readonly transform: (value: string | number) => string | 0;
     }>;
     minHeight?: import("@codecademy/variance/dist/types/config").Scale<{
-        readonly property: {
-            readonly physical: "minHeight";
-            readonly logical: "minBlockSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "minHeight";
         readonly transform: (value: string | number) => string | 0;
     }>;
     minWidth?: import("@codecademy/variance/dist/types/config").Scale<{
-        readonly property: {
-            readonly physical: "minWidth";
-            readonly logical: "minInlineSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "minWidth";
         readonly transform: (value: string | number) => string | 0;
     }>;
     opacity?: import("@codecademy/variance/dist/types/config").Scale<{
@@ -864,11 +814,7 @@ export declare const VariableProvider: import("@emotion/styled").StyledComponent
         readonly property: "verticalAlign";
     }>;
     width?: import("@codecademy/variance/dist/types/config").Scale<{
-        readonly property: {
-            readonly physical: "width";
-            readonly logical: "inlineSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "width";
         readonly transform: (value: string | number) => string | 0;
     }>;
     zIndex?: import("@codecademy/variance/dist/types/config").Scale<{
@@ -1330,9 +1276,6 @@ export declare const ColorMode: import("react").ForwardRefExoticComponent<Omit<O
     containerType?: import("@codecademy/variance/dist/types/config").Scale<{
         readonly property: "containerType";
     }>;
-    direction?: import("@codecademy/variance/dist/types/config").Scale<{
-        readonly property: "direction";
-    }>;
     display?: import("@codecademy/variance/dist/types/config").Scale<{
         readonly property: "display";
     }>;
@@ -1382,11 +1325,7 @@ export declare const ColorMode: import("react").ForwardRefExoticComponent<Omit<O
         readonly property: "gridTemplateRows";
     }>;
     height?: import("@codecademy/variance/dist/types/config").Scale<{
-        readonly property: {
-            readonly physical: "height";
-            readonly logical: "blockSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "height";
         readonly transform: (value: string | number) => string | 0;
     }>;
     justifyContent?: import("@codecademy/variance/dist/types/config").Scale<{
@@ -1403,35 +1342,19 @@ export declare const ColorMode: import("react").ForwardRefExoticComponent<Omit<O
         readonly transform: (value: string | number) => string | 0;
     }>;
     maxHeight?: import("@codecademy/variance/dist/types/config").Scale<{
-        readonly property: {
-            readonly physical: "maxHeight";
-            readonly logical: "maxBlockSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "maxHeight";
         readonly transform: (value: string | number) => string | 0;
     }>;
     maxWidth?: import("@codecademy/variance/dist/types/config").Scale<{
-        readonly property: {
-            readonly physical: "maxWidth";
-            readonly logical: "maxInlineSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "maxWidth";
         readonly transform: (value: string | number) => string | 0;
     }>;
     minHeight?: import("@codecademy/variance/dist/types/config").Scale<{
-        readonly property: {
-            readonly physical: "minHeight";
-            readonly logical: "minBlockSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "minHeight";
         readonly transform: (value: string | number) => string | 0;
     }>;
     minWidth?: import("@codecademy/variance/dist/types/config").Scale<{
-        readonly property: {
-            readonly physical: "minWidth";
-            readonly logical: "minInlineSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "minWidth";
         readonly transform: (value: string | number) => string | 0;
     }>;
     opacity?: import("@codecademy/variance/dist/types/config").Scale<{
@@ -1465,11 +1388,7 @@ export declare const ColorMode: import("react").ForwardRefExoticComponent<Omit<O
         readonly property: "verticalAlign";
     }>;
     width?: import("@codecademy/variance/dist/types/config").Scale<{
-        readonly property: {
-            readonly physical: "width";
-            readonly logical: "inlineSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "width";
         readonly transform: (value: string | number) => string | 0;
     }>;
     zIndex?: import("@codecademy/variance/dist/types/config").Scale<{

package/dist/variance/config.d.ts

@@ -509,59 +509,32 @@ export declare const layout: {
         readonly transform: (value: string | number) => string | 0;
     };
     readonly width: {
-        readonly property: {
-            readonly physical: "width";
-            readonly logical: "inlineSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "width";
         readonly transform: (value: string | number) => string | 0;
     };
     readonly minWidth: {
-        readonly property: {
-            readonly physical: "minWidth";
-            readonly logical: "minInlineSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "minWidth";
         readonly transform: (value: string | number) => string | 0;
     };
     readonly maxWidth: {
-        readonly property: {
-            readonly physical: "maxWidth";
-            readonly logical: "maxInlineSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "maxWidth";
         readonly transform: (value: string | number) => string | 0;
     };
     readonly height: {
-        readonly property: {
-            readonly physical: "height";
-            readonly logical: "blockSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "height";
         readonly transform: (value: string | number) => string | 0;
     };
     readonly minHeight: {
-        readonly property: {
-            readonly physical: "minHeight";
-            readonly logical: "minBlockSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "minHeight";
         readonly transform: (value: string | number) => string | 0;
     };
     readonly maxHeight: {
-        readonly property: {
-            readonly physical: "maxHeight";
-            readonly logical: "maxBlockSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "maxHeight";
         readonly transform: (value: string | number) => string | 0;
     };
     readonly verticalAlign: {
         readonly property: "verticalAlign";
     };
-    readonly direction: {
-        readonly property: "direction";
-    };
 };
 export declare const list: {
     readonly listStyle: {
@@ -1227,59 +1200,32 @@ export declare const all: {
         readonly transform: (value: string | number) => string | 0;
     };
     width: {
-        readonly property: {
-            readonly physical: "width";
-            readonly logical: "inlineSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "width";
         readonly transform: (value: string | number) => string | 0;
     };
     minWidth: {
-        readonly property: {
-            readonly physical: "minWidth";
-            readonly logical: "minInlineSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "minWidth";
         readonly transform: (value: string | number) => string | 0;
     };
     maxWidth: {
-        readonly property: {
-            readonly physical: "maxWidth";
-            readonly logical: "maxInlineSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "maxWidth";
         readonly transform: (value: string | number) => string | 0;
     };
     height: {
-        readonly property: {
-            readonly physical: "height";
-            readonly logical: "blockSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "height";
         readonly transform: (value: string | number) => string | 0;
     };
     minHeight: {
-        readonly property: {
-            readonly physical: "minHeight";
-            readonly logical: "minBlockSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "minHeight";
         readonly transform: (value: string | number) => string | 0;
     };
     maxHeight: {
-        readonly property: {
-            readonly physical: "maxHeight";
-            readonly logical: "maxBlockSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "maxHeight";
         readonly transform: (value: string | number) => string | 0;
     };
     verticalAlign: {
         readonly property: "verticalAlign";
     };
-    direction: {
-        readonly property: "direction";
-    };
     justifyContent: {
         readonly property: "justifyContent";
     };

package/dist/variance/config.js

@@ -467,59 +467,32 @@ export const layout = {
     transform: transformSize
   },
   width: {
-    property: {
-      physical: 'width',
-      logical: 'inlineSize'
-    },
-    resolveProperty: getPropertyMode,
+    property: 'width',
     transform: transformSize
   },
   minWidth: {
-    property: {
-      physical: 'minWidth',
-      logical: 'minInlineSize'
-    },
-    resolveProperty: getPropertyMode,
+    property: 'minWidth',
     transform: transformSize
   },
   maxWidth: {
-    property: {
-      physical: 'maxWidth',
-      logical: 'maxInlineSize'
-    },
-    resolveProperty: getPropertyMode,
+    property: 'maxWidth',
     transform: transformSize
   },
   height: {
-    property: {
-      physical: 'height',
-      logical: 'blockSize'
-    },
-    resolveProperty: getPropertyMode,
+    property: 'height',
     transform: transformSize
   },
   minHeight: {
-    property: {
-      physical: 'minHeight',
-      logical: 'minBlockSize'
-    },
-    resolveProperty: getPropertyMode,
+    property: 'minHeight',
     transform: transformSize
   },
   maxHeight: {
-    property: {
-      physical: 'maxHeight',
-      logical: 'maxBlockSize'
-    },
-    resolveProperty: getPropertyMode,
+    property: 'maxHeight',
     transform: transformSize
   },
   verticalAlign: {
     property: 'verticalAlign'
   },
-  direction: {
-    property: 'direction'
-  },
   ...selfAlignments,
   ...gridItems,
   ...flexItems

package/dist/variance/props.d.ts

@@ -211,59 +211,32 @@ export declare const layout: import("@codecademy/variance/dist/types/config").Pa
         readonly transform: (value: string | number) => string | 0;
     };
     readonly width: {
-        readonly property: {
-            readonly physical: "width";
-            readonly logical: "inlineSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "width";
         readonly transform: (value: string | number) => string | 0;
     };
     readonly minWidth: {
-        readonly property: {
-            readonly physical: "minWidth";
-            readonly logical: "minInlineSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "minWidth";
         readonly transform: (value: string | number) => string | 0;
     };
     readonly maxWidth: {
-        readonly property: {
-            readonly physical: "maxWidth";
-            readonly logical: "maxInlineSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "maxWidth";
         readonly transform: (value: string | number) => string | 0;
     };
     readonly height: {
-        readonly property: {
-            readonly physical: "height";
-            readonly logical: "blockSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "height";
         readonly transform: (value: string | number) => string | 0;
     };
     readonly minHeight: {
-        readonly property: {
-            readonly physical: "minHeight";
-            readonly logical: "minBlockSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "minHeight";
         readonly transform: (value: string | number) => string | 0;
     };
     readonly maxHeight: {
-        readonly property: {
-            readonly physical: "maxHeight";
-            readonly logical: "maxBlockSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "maxHeight";
         readonly transform: (value: string | number) => string | 0;
     };
     readonly verticalAlign: {
         readonly property: "verticalAlign";
     };
-    readonly direction: {
-        readonly property: "direction";
-    };
 }>>;
 export declare const positioning: import("@codecademy/variance/dist/types/config").Parser<import("@codecademy/variance/dist/types/config").TransformerMap<{
     readonly position: {
@@ -1230,59 +1203,32 @@ export declare const css: import("@codecademy/variance/dist/types/config").CSS<i
         readonly transform: (value: string | number) => string | 0;
     };
     width: {
-        readonly property: {
-            readonly physical: "width";
-            readonly logical: "inlineSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "width";
         readonly transform: (value: string | number) => string | 0;
     };
     minWidth: {
-        readonly property: {
-            readonly physical: "minWidth";
-            readonly logical: "minInlineSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "minWidth";
         readonly transform: (value: string | number) => string | 0;
     };
     maxWidth: {
-        readonly property: {
-            readonly physical: "maxWidth";
-            readonly logical: "maxInlineSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "maxWidth";
         readonly transform: (value: string | number) => string | 0;
     };
     height: {
-        readonly property: {
-            readonly physical: "height";
-            readonly logical: "blockSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "height";
         readonly transform: (value: string | number) => string | 0;
     };
     minHeight: {
-        readonly property: {
-            readonly physical: "minHeight";
-            readonly logical: "minBlockSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "minHeight";
         readonly transform: (value: string | number) => string | 0;
     };
     maxHeight: {
-        readonly property: {
-            readonly physical: "maxHeight";
-            readonly logical: "maxBlockSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "maxHeight";
         readonly transform: (value: string | number) => string | 0;
     };
     verticalAlign: {
         readonly property: "verticalAlign";
     };
-    direction: {
-        readonly property: "direction";
-    };
     justifyContent: {
         readonly property: "justifyContent";
     };
@@ -1875,59 +1821,32 @@ export declare const variant: import("@codecademy/variance/dist/types/config").V
         readonly transform: (value: string | number) => string | 0;
     };
     width: {
-        readonly property: {
-            readonly physical: "width";
-            readonly logical: "inlineSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "width";
         readonly transform: (value: string | number) => string | 0;
     };
     minWidth: {
-        readonly property: {
-            readonly physical: "minWidth";
-            readonly logical: "minInlineSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "minWidth";
         readonly transform: (value: string | number) => string | 0;
     };
     maxWidth: {
-        readonly property: {
-            readonly physical: "maxWidth";
-            readonly logical: "maxInlineSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "maxWidth";
         readonly transform: (value: string | number) => string | 0;
     };
     height: {
-        readonly property: {
-            readonly physical: "height";
-            readonly logical: "blockSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "height";
         readonly transform: (value: string | number) => string | 0;
     };
     minHeight: {
-        readonly property: {
-            readonly physical: "minHeight";
-            readonly logical: "minBlockSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "minHeight";
         readonly transform: (value: string | number) => string | 0;
     };
     maxHeight: {
-        readonly property: {
-            readonly physical: "maxHeight";
-            readonly logical: "maxBlockSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "maxHeight";
         readonly transform: (value: string | number) => string | 0;
     };
     verticalAlign: {
         readonly property: "verticalAlign";
     };
-    direction: {
-        readonly property: "direction";
-    };
     justifyContent: {
         readonly property: "justifyContent";
     };
@@ -2520,59 +2439,32 @@ export declare const states: import("@codecademy/variance/dist/types/config").St
         readonly transform: (value: string | number) => string | 0;
     };
     width: {
-        readonly property: {
-            readonly physical: "width";
-            readonly logical: "inlineSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "width";
         readonly transform: (value: string | number) => string | 0;
     };
     minWidth: {
-        readonly property: {
-            readonly physical: "minWidth";
-            readonly logical: "minInlineSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "minWidth";
         readonly transform: (value: string | number) => string | 0;
     };
     maxWidth: {
-        readonly property: {
-            readonly physical: "maxWidth";
-            readonly logical: "maxInlineSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "maxWidth";
         readonly transform: (value: string | number) => string | 0;
     };
     height: {
-        readonly property: {
-            readonly physical: "height";
-            readonly logical: "blockSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "height";
         readonly transform: (value: string | number) => string | 0;
     };
     minHeight: {
-        readonly property: {
-            readonly physical: "minHeight";
-            readonly logical: "minBlockSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "minHeight";
         readonly transform: (value: string | number) => string | 0;
     };
     maxHeight: {
-        readonly property: {
-            readonly physical: "maxHeight";
-            readonly logical: "maxBlockSize";
-        };
-        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
+        readonly property: "maxHeight";
         readonly transform: (value: string | number) => string | 0;
     };
     verticalAlign: {
         readonly property: "verticalAlign";
     };
-    direction: {
-        readonly property: "direction";
-    };
     justifyContent: {
         readonly property: "justifyContent";
     };

package/dist/variance/utils.d.ts

@@ -1,11 +1,11 @@
 /// <reference types="react" />
 import { ThemeProps } from '@codecademy/variance';
-declare const allPropnames: ["mode", "variant", "fontStyle" | "fontWeight" | "fontSize" | "fontFamily" | "lineHeight" | "color" | "background" | "border" | "p" | "alignContent" | "alignItems" | "alignSelf" | "backgroundImage" | "backgroundRepeat" | "backgroundSize" | "bottom" | "boxShadow" | "columnGap" | "containerType" | "direction" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridColumnEnd" | "gridColumnStart" | "gridRowEnd" | "gridRowStart" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "listStyleImage" | "listStylePosition" | "listStyleType" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "opacity" | "order" | "overflowX" | "overflowY" | "position" | "right" | "rowGap" | "textAlign" | "textShadow" | "textTransform" | "top" | "verticalAlign" | "whiteSpace" | "width" | "zIndex" | "backgroundPosition" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderStyle" | "borderTop" | "borderWidth" | "flex" | "gap" | "gridArea" | "gridColumn" | "gridRow" | "inset" | "listStyle" | "overflow" | "textDecoration" | "dimensions" | "textColor" | "bg" | "borderColorX" | "borderColorY" | "borderColorLeft" | "borderColorRight" | "borderColorTop" | "borderColorBottom" | "px" | "py" | "pt" | "pb" | "pr" | "pl" | "m" | "mx" | "my" | "mt" | "mb" | "mr" | "ml" | "borderX" | "borderY" | "borderWidthX" | "borderWidthY" | "borderWidthLeft" | "borderWidthRight" | "borderWidthTop" | "borderWidthBottom" | "borderRadiusLeft" | "borderRadiusTop" | "borderRadiusBottom" | "borderRadiusRight" | "borderRadiusTopLeft" | "borderRadiusTopRight" | "borderRadiusBottomRight" | "borderRadiusBottomLeft" | "borderStyleX" | "borderStyleY" | "borderStyleLeft" | "borderStyleRight" | "borderStyleTop" | "borderStyleBottom"];
+declare const allPropnames: ["mode", "variant", "fontStyle" | "fontWeight" | "fontSize" | "fontFamily" | "lineHeight" | "color" | "background" | "border" | "p" | "alignContent" | "alignItems" | "alignSelf" | "backgroundImage" | "backgroundRepeat" | "backgroundSize" | "bottom" | "boxShadow" | "columnGap" | "containerType" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridColumnEnd" | "gridColumnStart" | "gridRowEnd" | "gridRowStart" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "listStyleImage" | "listStylePosition" | "listStyleType" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "opacity" | "order" | "overflowX" | "overflowY" | "position" | "right" | "rowGap" | "textAlign" | "textShadow" | "textTransform" | "top" | "verticalAlign" | "whiteSpace" | "width" | "zIndex" | "backgroundPosition" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderStyle" | "borderTop" | "borderWidth" | "flex" | "gap" | "gridArea" | "gridColumn" | "gridRow" | "inset" | "listStyle" | "overflow" | "textDecoration" | "dimensions" | "textColor" | "bg" | "borderColorX" | "borderColorY" | "borderColorLeft" | "borderColorRight" | "borderColorTop" | "borderColorBottom" | "px" | "py" | "pt" | "pb" | "pr" | "pl" | "m" | "mx" | "my" | "mt" | "mb" | "mr" | "ml" | "borderX" | "borderY" | "borderWidthX" | "borderWidthY" | "borderWidthLeft" | "borderWidthRight" | "borderWidthTop" | "borderWidthBottom" | "borderRadiusLeft" | "borderRadiusTop" | "borderRadiusBottom" | "borderRadiusRight" | "borderRadiusTopLeft" | "borderRadiusTopRight" | "borderRadiusBottomRight" | "borderRadiusBottomLeft" | "borderStyleX" | "borderStyleY" | "borderStyleLeft" | "borderStyleRight" | "borderStyleTop" | "borderStyleBottom"];
 export type SystemPropNames = (typeof allPropnames)[number];
 export type ElementOrProps = keyof JSX.IntrinsicElements | ThemeProps;
 export type ForwardableProps<El extends ElementOrProps, Additional> = Exclude<El extends keyof JSX.IntrinsicElements ? keyof JSX.IntrinsicElements[El] : keyof Element, Additional | SystemPropNames>;
 export declare function createStyledOptions<El extends ElementOrProps = 'div', Additional extends string = never>(additional?: readonly Additional[]): {
-    shouldForwardProp: (prop: PropertyKey) => prop is Exclude<El extends keyof JSX.IntrinsicElements ? keyof JSX.IntrinsicElements[El] : keyof Element, "fontStyle" | "fontWeight" | "fontSize" | "fontFamily" | "lineHeight" | "color" | "background" | "border" | "mode" | "p" | "alignContent" | "alignItems" | "alignSelf" | "backgroundImage" | "backgroundRepeat" | "backgroundSize" | "bottom" | "boxShadow" | "columnGap" | "containerType" | "direction" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridColumnEnd" | "gridColumnStart" | "gridRowEnd" | "gridRowStart" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "listStyleImage" | "listStylePosition" | "listStyleType" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "opacity" | "order" | "overflowX" | "overflowY" | "position" | "right" | "rowGap" | "textAlign" | "textShadow" | "textTransform" | "top" | "verticalAlign" | "whiteSpace" | "width" | "zIndex" | "backgroundPosition" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderStyle" | "borderTop" | "borderWidth" | "flex" | "gap" | "gridArea" | "gridColumn" | "gridRow" | "inset" | "listStyle" | "overflow" | "textDecoration" | "dimensions" | "textColor" | "bg" | "borderColorX" | "borderColorY" | "borderColorLeft" | "borderColorRight" | "borderColorTop" | "borderColorBottom" | "px" | "py" | "pt" | "pb" | "pr" | "pl" | "m" | "mx" | "my" | "mt" | "mb" | "mr" | "ml" | "borderX" | "borderY" | "borderWidthX" | "borderWidthY" | "borderWidthLeft" | "borderWidthRight" | "borderWidthTop" | "borderWidthBottom" | "borderRadiusLeft" | "borderRadiusTop" | "borderRadiusBottom" | "borderRadiusRight" | "borderRadiusTopLeft" | "borderRadiusTopRight" | "borderRadiusBottomRight" | "borderRadiusBottomLeft" | "borderStyleX" | "borderStyleY" | "borderStyleLeft" | "borderStyleRight" | "borderStyleTop" | "borderStyleBottom" | "variant" | Additional>;
+    shouldForwardProp: (prop: PropertyKey) => prop is Exclude<El extends keyof JSX.IntrinsicElements ? keyof JSX.IntrinsicElements[El] : keyof Element, "fontStyle" | "fontWeight" | "fontSize" | "fontFamily" | "lineHeight" | "color" | "background" | "border" | "mode" | "p" | "alignContent" | "alignItems" | "alignSelf" | "backgroundImage" | "backgroundRepeat" | "backgroundSize" | "bottom" | "boxShadow" | "columnGap" | "containerType" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridColumnEnd" | "gridColumnStart" | "gridRowEnd" | "gridRowStart" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "listStyleImage" | "listStylePosition" | "listStyleType" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "opacity" | "order" | "overflowX" | "overflowY" | "position" | "right" | "rowGap" | "textAlign" | "textShadow" | "textTransform" | "top" | "verticalAlign" | "whiteSpace" | "width" | "zIndex" | "backgroundPosition" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderStyle" | "borderTop" | "borderWidth" | "flex" | "gap" | "gridArea" | "gridColumn" | "gridRow" | "inset" | "listStyle" | "overflow" | "textDecoration" | "dimensions" | "textColor" | "bg" | "borderColorX" | "borderColorY" | "borderColorLeft" | "borderColorRight" | "borderColorTop" | "borderColorBottom" | "px" | "py" | "pt" | "pb" | "pr" | "pl" | "m" | "mx" | "my" | "mt" | "mb" | "mr" | "ml" | "borderX" | "borderY" | "borderWidthX" | "borderWidthY" | "borderWidthLeft" | "borderWidthRight" | "borderWidthTop" | "borderWidthBottom" | "borderRadiusLeft" | "borderRadiusTop" | "borderRadiusBottom" | "borderRadiusRight" | "borderRadiusTopLeft" | "borderRadiusTopRight" | "borderRadiusBottomRight" | "borderRadiusBottomLeft" | "borderStyleX" | "borderStyleY" | "borderStyleLeft" | "borderStyleRight" | "borderStyleTop" | "borderStyleBottom" | "variant" | Additional>;
 };
 /**
  * @description

package/package.json

@@ -1,10 +1,10 @@
 {
   "name": "@codecademy/gamut-styles",
   "description": "Styleguide & Component library for codecademy.com",
-  "version": "17.12.0-alpha.e6658d.0",
+  "version": "17.12.0-alpha.f66feb.0",
   "author": "Jake Hiller <jake@codecademy.com>",
   "dependencies": {
-    "@codecademy/variance": "0.26.0-alpha.e6658d.0",
+    "@codecademy/variance": "0.26.0-alpha.f66feb.0",
     "@emotion/is-prop-valid": "^1.1.0",
     "polished": "^4.1.2"
   },
@@ -34,5 +34,5 @@
   "scripts": {
     "build": "nx build @codecademy/gamut-styles"
   },
-  "gitHead": "c9f76514b37c19884b8dcd3fcdff03be92fb7500"
+  "gitHead": "48caddfa6555eb3c8ea5ae0cf5b1b2602be21163"
 }