@sanity/ui 5.0.0-alpha.13 → 5.0.0-alpha.15

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sanity/ui",
-  "version": "5.0.0-alpha.13",
+  "version": "5.0.0-alpha.15",
   "description": "Sanity UI Library",
   "keywords": [
     "components",
@@ -48,7 +48,7 @@
     }
   },
   "dependencies": {
-    "@sanity-labs/design-tokens": "0.0.2-alpha.5",
+    "@sanity-labs/design-tokens": "0.0.2-alpha.7",
     "@sanity/icons": "^5.2.1",
     "clsx": "^2.1.1",
     "comment-json": "^5.0.0",

package/src/components/grid/grid.props.ts

@@ -1,3 +1,4 @@
+import {flexParentProps, type FlexParentProps} from '../../props/flexParent'
 import {type GapProps, gapProps} from '../../props/gap'
 import {type GridParentProps, gridParentProps} from '../../props/gridParent'
 import {type LayoutProps, layoutProps} from '../../props/layout'
@@ -7,7 +8,11 @@ import type {Responsive} from '../../types/Responsive'
 
 /** @public */
 export interface GridProps<T extends React.ElementType = 'div'>
-  extends GridParentProps, GapProps, LayoutProps {
+  extends
+    Pick<FlexParentProps, 'alignItems' | 'justifyContent'>,
+    GridParentProps,
+    GapProps,
+    LayoutProps {
   /**
    * HTML element or component to render.
    */
@@ -27,6 +32,8 @@ export const gridProps: Record<string, PropDef> = {
     className: 'display',
     values: DISPLAY_GRID,
   },
+  alignItems: flexParentProps['alignItems'] as PropDef,
+  justifyContent: flexParentProps['justifyContent'] as PropDef,
   ...gridParentProps,
   ...gapProps,
   ...layoutProps,

package/src/components/icon/Icon.tsx

@@ -17,6 +17,7 @@ export function Icon({icon, size = 2, ...props}: IconProps) {
   const svgProps = {
     'className': clsx(
       iconClassName,
+      'sui-display-block',
       className,
       iconElement ? iconElement.props.className : undefined,
     ),

package/src/css/classes/local/text-trim.css

@@ -32,10 +32,6 @@
   .sui-text-heading3 { --trim: -7px; }
   .sui-text-heading4 { --trim: -8px; }
   .sui-text-heading5 { --trim: -10px; }
-  .sui-text-heading6 { --trim: -13px; }
-  .sui-text-heading7 { --trim: -16px; }
-  .sui-text-heading8 { --trim: -22px; }
-  .sui-text-heading9 { --trim: -30px; }
 
   .sui-text-code0 { --trim: -4px; }
   .sui-text-code1 { --trim: -5px; }

package/src/css/classes/system/typography.css

@@ -17,10 +17,6 @@
   .sui-text-heading3 { font: var(--heading-3); }
   .sui-text-heading4 { font: var(--heading-4); }
   .sui-text-heading5 { font: var(--heading-5); }
-  .sui-text-heading6 { font: var(--heading-6); }
-  .sui-text-heading7 { font: var(--heading-7); }
-  .sui-text-heading8 { font: var(--heading-8); }
-  .sui-text-heading9 { font: var(--heading-9); }
 
   .sui-text-eyebrow0 { font: var(--label-0); }
   .sui-text-eyebrow1 { font: var(--label-1); }

package/src/types/Heading.ts

@@ -1,6 +1,6 @@
 export const HEADING_TAG = ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'] as const
 export type HeadingTag = (typeof HEADING_TAG)[number]
 
-export const HEADING_SIZE = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9] as const
+export const HEADING_SIZE = [0, 1, 2, 3, 4, 5] as const
 /** @public */
 export type HeadingSize = (typeof HEADING_SIZE)[number]

package/src/version.ts

@@ -1,3 +1,3 @@
 // This file is generated by scripts/write-version.js. Do not edit.
-export const VERSION = '500alpha13'
-export const HASH = '0ef1ec'
+export const VERSION = '500alpha15'
+export const HASH = '29dcdf'