@sanity/ui 5.0.0-alpha.1 → 5.0.0-alpha.11

package/src/index.ts

@@ -1,9 +1,12 @@
+'use client'
+
 export * from './components/box/Box'
 export * from './components/button/Button'
 export * from './components/card/Card'
 export * from './components/checkbox/Checkbox'
 export * from './components/code/Code'
 export * from './components/container/Container'
+export * from './components/dialog/Dialog'
 export * from './components/divider/Divider'
 export * from './components/eyebrow/Eyebrow'
 export * from './components/flex/Flex'
@@ -18,8 +21,10 @@ export * from './components/inline/Inline'
 export * from './components/label/Label'
 export * from './components/link/Link'
 export * from './components/list/List'
+export * from './components/popover/Popover'
 export * from './components/press-area/PressArea'
 export * from './components/radio/Radio'
+export * from './components/select/Select'
 export * from './components/skip-to-content/SkipToContent'
 export * from './components/spinner/Spinner'
 export * from './components/switch/Switch'
@@ -29,6 +34,8 @@ export * from './components/tooltip-group/TooltipGroup'
 export * from './components/v-stack/VStack'
 export * from './components/visually-hidden/VisuallyHidden'
 
+export * from './hooks/useIsClient'
+
 export type {FlexParentProps} from './props/flexParent'
 export type {GapProps} from './props/gap'
 export type {GridParentProps} from './props/gridParent'
@@ -58,3 +65,4 @@ export type {TextSize} from './types/Text'
 export type {TextAlign} from './types/TextAlign'
 export type {FontWeight} from './types/FontWeight'
 export type {Tone} from './types/Tone'
+export * from './components/badge/Badge'

package/src/polyfills.ts

@@ -0,0 +1,17 @@
+'use client'
+
+import {
+  apply as applyClosedByPolyfill,
+  isSupported as isClosedBySupported,
+} from 'dialog-closedby-polyfill'
+
+if (
+  typeof HTMLButtonElement !== 'undefined' &&
+  !('interestForElement' in HTMLButtonElement.prototype)
+) {
+  void import('interestfor')
+}
+
+if (typeof HTMLDialogElement !== 'undefined' && !isClosedBySupported()) {
+  applyClosedByPolyfill()
+}

package/src/props/formElement.ts

@@ -0,0 +1,34 @@
+import {FORM_ELEMENT_DENSITY, type FormElementDensity} from '../types/FormElement'
+import type {PropDef} from '../types/PropDef'
+import {paddingProps} from './padding'
+
+/** @public */
+export type FormElementDensityProps = {
+  /**
+   * Sets padding, gap, and other spacing values on the form element.
+   */
+  density?: FormElementDensity
+}
+
+export const formElementDensityProps: Record<string, PropDef> = {
+  density: {
+    type: 'composite',
+    values: FORM_ELEMENT_DENSITY,
+    composition: {
+      paddingX: {
+        propDef: paddingProps['paddingX'] as PropDef,
+        mapping: {
+          regular: 2,
+          loose: 3,
+        },
+      },
+      paddingY: {
+        propDef: paddingProps['paddingY'] as PropDef,
+        mapping: {
+          regular: 1,
+          loose: 2,
+        },
+      },
+    },
+  },
+}

package/src/types/FormElement.ts

@@ -0,0 +1,2 @@
+export const FORM_ELEMENT_DENSITY = ['regular', 'loose'] as const
+export type FormElementDensity = (typeof FORM_ELEMENT_DENSITY)[number]

package/src/utils/getProps.ts

@@ -5,7 +5,7 @@ import {type PropDef} from '../types/PropDef'
 const PREFIX = 'sui'
 const BREAKPOINTS_LENGTH = 6
 
-interface ComponentProps {
+export interface ComponentProps {
   className?: string | undefined
   style?: React.CSSProperties | undefined
   [key: string]: any

package/src/utils/mergeTriggerProps.ts

@@ -0,0 +1,66 @@
+function isReactEventHandler(key: string, value: unknown): value is (e: never) => void {
+  return /^on[A-Z]/.test(key) && typeof value === 'function'
+}
+
+function chainEventHandlers<E>(
+  ...handlers: (((e: E) => void) | undefined)[]
+): ((e: E) => void) | undefined {
+  const defined = handlers.filter(Boolean) as ((e: E) => void)[]
+
+  if (defined.length === 0) {
+    return undefined
+  }
+
+  if (defined.length === 1) {
+    return defined[0]
+  }
+
+  return (e: E) => {
+    for (const handler of defined) {
+      handler(e)
+    }
+  }
+}
+
+export function mergeTriggerProps(
+  childProps: Record<string, unknown>,
+  forwardedProps?: Record<string, unknown>,
+  ownProps?: Record<string, unknown>,
+) {
+  const result: Record<string, unknown> = {}
+
+  for (const source of [forwardedProps, ownProps]) {
+    if (!source) {
+      continue
+    }
+
+    for (const [key, value] of Object.entries(source)) {
+      if (key === 'style') {
+        continue
+      }
+
+      if (isReactEventHandler(key, value)) {
+        result[key] = chainEventHandlers(result[key] as (e: never) => void, value)
+        continue
+      }
+
+      if (value !== undefined) {
+        result[key] = value
+      }
+    }
+  }
+
+  result['style'] = {
+    ...(childProps['style'] as object),
+    ...(forwardedProps?.['style'] as object),
+    ...(ownProps?.['style'] as object),
+  }
+
+  for (const [key, value] of Object.entries(childProps)) {
+    if (isReactEventHandler(key, value)) {
+      result[key] = chainEventHandlers(result[key] as (e: never) => void, value)
+    }
+  }
+
+  return result
+}

package/src/utils/renderPortal.tsx

@@ -0,0 +1,14 @@
+import {type ReactNode} from 'react'
+import {createPortal} from 'react-dom'
+
+export function renderPortal(node: ReactNode, mounted: boolean, portal?: boolean) {
+  if (!portal) {
+    return node
+  }
+
+  if (!mounted) {
+    return null
+  }
+
+  return createPortal(node, document.body)
+}

package/src/version.ts

@@ -1,3 +1,3 @@
 // This file is generated by scripts/write-version.js. Do not edit.
-export const VERSION = '500alpha1'
-export const HASH = '162541'
+export const VERSION = '500alpha11'
+export const HASH = '8b95a0'

package/dist/_chunks-es/LazyRefractor.js

@@ -1,20 +0,0 @@
-"use client";
-import { jsx } from "react/jsx-runtime";
-import { c } from "react/compiler-runtime";
-import { hasLanguage, Refractor } from "react-refractor";
-function LazyRefractor(t0) {
-  const $ = c(5), {
-    language,
-    value
-  } = t0;
-  if (!hasLanguage(language)) {
-    let t12;
-    return $[0] !== value ? (t12 = /* @__PURE__ */ jsx("code", { children: value }), $[0] = value, $[1] = t12) : t12 = $[1], t12;
-  }
-  let t1;
-  return $[2] !== language || $[3] !== value ? (t1 = /* @__PURE__ */ jsx(Refractor, { inline: !0, language, value }), $[2] = language, $[3] = value, $[4] = t1) : t1 = $[4], t1;
-}
-export {
-  LazyRefractor as default
-};
-//# sourceMappingURL=LazyRefractor.js.map

package/dist/_chunks-es/LazyRefractor.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"LazyRefractor.js","sources":["../../src/components/code/LazyRefractor.tsx"],"sourcesContent":["import {hasLanguage, Refractor, type RefractorProps} from 'react-refractor'\n\nexport default function LazyRefractor({language, value}: RefractorProps) {\n  if (!hasLanguage(language)) {\n    return <code>{value}</code>\n  }\n\n  return <Refractor inline language={language} value={value} />\n}\n"],"names":["LazyRefractor","t0","$","_c","language","value","hasLanguage","t1"],"mappings":";;;;AAEA,SAAeA,cAAAC,IAAA;AAAA,QAAAC,IAAAC,EAAA,CAAA,GAAuB;AAAA,IAAAC;AAAAA,IAAAC;AAAAA,EAAAA,IAAAJ;AACpC,MAAI,CAACK,YAAYF,QAAQ,GAAC;AAAA,QAAAG;AAAA,WAAAL,SAAAG,SACjBE,MAAA,oBAAA,QAAA,EAAOF,iBAAM,GAAOH,OAAAG,OAAAH,OAAAK,OAAAA,MAAAL,EAAA,CAAA,GAApBK;AAAAA,EAAoB;AAC5B,MAAAA;AAAA,SAAAL,EAAA,CAAA,MAAAE,YAAAF,SAAAG,SAEME,yBAAC,WAAA,EAAU,YAAiBH,UAAiBC,MAAAA,CAAK,GAAIH,OAAAE,UAAAF,OAAAG,OAAAH,OAAAK,MAAAA,KAAAL,EAAA,CAAA,GAAtDK;AAAsD;"}