@sanity/ui 3.1.13 → 4.0.0-beta.0

package/dist/tokens.d.ts

@@ -0,0 +1,4 @@
+export * from '@sanity/ui-tokens'
+export * from '@sanity/ui-tokens/constants'
+
+export {}

package/dist/tokens.js

@@ -0,0 +1,2 @@
+export * from "@sanity/ui-tokens/constants";
+//# sourceMappingURL=tokens.js.map

package/dist/tokens.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tokens.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/exports/css/index.css

@@ -0,0 +1 @@
+@import '@sanity/ui-css/index.css';

package/exports/css.ts

@@ -0,0 +1,2 @@
+export type {ResponsiveProp} from '@sanity/ui-css'
+export {BREAKPOINTS, vars} from '@sanity/ui-css'

package/exports/index.ts

@@ -1 +1,117 @@
-export * from '../src/core'
+// components
+export * from '../src/components/autocomplete/Autocomplete'
+export * from '../src/components/autocomplete/types'
+export * from '../src/components/breadcrumbs/Breadcrumbs'
+export * from '../src/components/dialog/Dialog'
+export * from '../src/components/dialog/DialogContext'
+export * from '../src/components/dialog/DialogProvider'
+export * from '../src/components/dialog/types'
+export * from '../src/components/dialog/useDialog'
+export * from '../src/components/hotkeys/Hotkeys'
+export * from '../src/components/menu/Menu'
+export * from '../src/components/menu/MenuButton'
+export * from '../src/components/menu/MenuDivider'
+export * from '../src/components/menu/MenuGroup'
+export * from '../src/components/menu/MenuItem'
+export * from '../src/components/tab/Tab'
+export * from '../src/components/tab/TabList'
+export * from '../src/components/tab/TabPanel'
+export * from '../src/components/toast/Toast'
+export * from '../src/components/toast/ToastProvider'
+export * from '../src/components/toast/types'
+export * from '../src/components/toast/useToast'
+export * from '../src/components/tree/Tree'
+export * from '../src/components/tree/TreeItem'
+export * from '../src/components/tree/types'
+export * from '../src/components/tree/useTree'
+export * from '../src/components/virtualList/VirtualList'
+
+// helpers
+export * from '../src/core/helpers/animation'
+export * from '../src/core/helpers/element'
+export * from '../src/core/helpers/focus'
+export * from '../src/core/helpers/props'
+export * from '../src/core/helpers/scroll'
+
+// hooks
+export * from '../src/hooks/useClickOutsideEvent'
+export * from '../src/hooks/useCustomValidity'
+export * from '../src/hooks/useElementSize'
+export * from '../src/hooks/useGlobalKeyDown'
+export * from '../src/hooks/useMatchMedia'
+export * from '../src/hooks/useMediaIndex/useMediaIndex'
+export * from '../src/hooks/usePrefersDark'
+export * from '../src/hooks/usePrefersReducedMotion'
+
+// observers
+export * from '../src/observers/elementSize'
+
+// primitives
+export * from '../src/primitives/_syntax/LazySyntax'
+export * from '../src/primitives/avatar/Avatar'
+export * from '../src/primitives/avatar/AvatarCounter'
+export * from '../src/primitives/avatar/AvatarStack'
+export * from '../src/primitives/avatar/types'
+export * from '../src/primitives/badge/Badge'
+export * from '../src/primitives/box/Box'
+export * from '../src/primitives/button/Button'
+export * from '../src/primitives/button/types'
+export * from '../src/primitives/card/Card'
+export * from '../src/primitives/card/CardProvider'
+export * from '../src/primitives/card/types'
+export {useCard} from '../src/primitives/card/useCard'
+export * from '../src/primitives/checkbox/Checkbox'
+export * from '../src/primitives/code/Code'
+export * from '../src/primitives/container/Container'
+export * from '../src/primitives/container/types'
+export * from '../src/primitives/flex/Flex'
+export * from '../src/primitives/grid/Grid'
+export * from '../src/primitives/heading/Heading'
+export * from '../src/primitives/inline/Inline'
+export * from '../src/primitives/kbd/Kbd'
+export * from '../src/primitives/label/Label'
+export * from '../src/primitives/layer/Layer'
+export * from '../src/primitives/layer/LayerProvider'
+export * from '../src/primitives/layer/types'
+export * from '../src/primitives/layer/useLayer'
+export * from '../src/primitives/popover/Popover'
+export * from '../src/primitives/popover/types'
+export * from '../src/primitives/radio/Radio'
+export * from '../src/primitives/select/Select'
+export * from '../src/primitives/selectable/Selectable'
+export * from '../src/primitives/skeleton/CodeSkeleton'
+export * from '../src/primitives/skeleton/HeadingSkeleton'
+export * from '../src/primitives/skeleton/LabelSkeleton'
+export * from '../src/primitives/skeleton/Skeleton'
+export * from '../src/primitives/skeleton/TextSkeleton'
+export * from '../src/primitives/spinner/Spinner'
+export * from '../src/primitives/srOnly/SrOnly'
+export * from '../src/primitives/stack/Stack'
+export * from '../src/primitives/switch/Switch'
+export * from '../src/primitives/text/InlineCode'
+export * from '../src/primitives/text/Text'
+export * from '../src/primitives/textArea/TextArea'
+export * from '../src/primitives/textInput/TextInput'
+export * from '../src/primitives/tooltip/Tooltip'
+export * from '../src/primitives/tooltip/tooltipDelayGroup/TooltipDelayGroupContext'
+export * from '../src/primitives/tooltip/tooltipDelayGroup/TooltipDelayGroupProvider'
+export * from '../src/primitives/tooltip/tooltipDelayGroup/types'
+export {useTooltipDelayGroup} from '../src/primitives/tooltip/tooltipDelayGroup/useTooltipDelayGroup'
+
+// utils
+export * from '../src/utils/boundaryElement/BoundaryElementProvider'
+export * from '../src/utils/boundaryElement/types'
+export {useBoundaryElement} from '../src/utils/boundaryElement/useBoundaryElement'
+export * from '../src/utils/elementQuery/ElementQuery'
+export * from '../src/utils/ErrorBoundary'
+export * from '../src/utils/portal/Portal'
+export * from '../src/utils/portal/PortalProvider'
+export * from '../src/utils/portal/types'
+export {usePortal} from '../src/utils/portal/usePortal'
+
+// root
+export * from '../src/root/Root'
+export * from '../src/root/RootProvider'
+
+// types
+export * from '../src/core/types'

package/exports/tokens.ts

@@ -0,0 +1,2 @@
+export type * from '@sanity/ui-tokens'
+export * from '@sanity/ui-tokens/constants'

package/package.json

@@ -1,57 +1,55 @@
 {
   "name": "@sanity/ui",
-  "version": "3.1.13",
+  "version": "4.0.0-beta.0",
   "keywords": [
-    "sanity",
+    "react",
     "ui",
+    "kit",
+    "library",
     "primitives",
-    "react",
     "components",
-    "design-system"
+    "utils"
   ],
-  "homepage": "https://www.sanity.io/",
+  "homepage": "https://www.sanity.io/ui",
   "bugs": {
     "url": "https://github.com/sanity-io/ui/issues"
   },
   "repository": {
     "type": "git",
-    "url": "git+https://github.com/sanity-io/ui.git"
+    "url": "git+https://github.com/sanity-io/ui.git",
+    "directory": "packages/ui"
   },
   "license": "MIT",
   "author": "Sanity.io <hello@sanity.io>",
-  "sideEffects": false,
-  "type": "commonjs",
+  "sideEffects": [
+    "*.css"
+  ],
+  "type": "module",
   "exports": {
     ".": {
       "source": "./exports/index.ts",
-      "import": "./dist/index.mjs",
-      "require": "./dist/index.js",
       "default": "./dist/index.js"
     },
-    "./_visual-editing": {
-      "source": "./exports/_visual-editing.ts",
-      "import": "./dist/_visual-editing.mjs",
-      "require": "./dist/_visual-editing.js",
-      "default": "./dist/_visual-editing.js"
+    "./css": {
+      "source": "./exports/css.ts",
+      "default": "./dist/css.js"
     },
-    "./theme": {
-      "source": "./exports/theme.ts",
-      "import": "./dist/theme.mjs",
-      "require": "./dist/theme.js",
-      "default": "./dist/theme.js"
-    },
-    "./package.json": "./package.json"
+    "./css/index.css": "./dist/css/index.css",
+    "./package.json": "./package.json",
+    "./tokens": {
+      "source": "./exports/tokens.ts",
+      "default": "./dist/tokens.js"
+    }
   },
   "main": "./dist/index.js",
-  "module": "./dist/index.mjs",
   "types": "./dist/index.d.ts",
   "typesVersions": {
     "*": {
-      "_visual-editing": [
-        "./dist/_visual-editing.d.ts"
+      "css": [
+        "./dist/css.d.ts"
       ],
-      "theme": [
-        "./dist/theme.d.ts"
+      "tokens": [
+        "./dist/tokens.d.ts"
       ]
     }
   },
@@ -60,174 +58,90 @@
     "exports",
     "src"
   ],
-  "scripts": {
-    "build": "run-s clean pkg:build pkg:check figma:pkg:build",
-    "clean": "rimraf .workshop dist",
-    "commit": "cz",
-    "cypress:dev": "run-p dev cypress:open",
-    "cypress:open": "cypress open",
-    "cypress:run": "cypress run",
-    "dev": "run-p storybook:dev workshop:dev",
-    "figma:pkg:build": "cd figma && pnpm build",
-    "format": "prettier --write --cache --ignore-unknown .",
-    "lint": "eslint .",
-    "prepack": "pnpm build",
-    "pkg:build": "pkg build --strict",
-    "pkg:check": "pkg --strict",
-    "prepare": "husky install",
-    "release": "semantic-release",
-    "storybook:build": "storybook build -o storybook/storybook-static",
-    "storybook:dev": "storybook dev -p 6006",
-    "test": "jest",
-    "test:browser": "start-server-and-test 'run-s workshop:build workshop:start' http://localhost:1337 'run-s cypress:run'",
-    "ts:check": "tsc",
-    "watch": "pkg watch --strict",
-    "workshop:build": "workshop build",
-    "workshop:dev": "workshop dev",
-    "workshop:start": "http-server -a localhost -c-0 -p 1337 -s -P http://localhost:1337/index.html? dist"
-  },
-  "commitlint": {
-    "extends": [
-      "@commitlint/config-conventional"
-    ]
-  },
-  "lint-staged": {
-    "*": [
-      "prettier --write --cache --ignore-unknown"
-    ]
-  },
-  "prettier": "@sanity/prettier-config",
-  "release": {
-    "branches": [
-      {
-        "name": "v2",
-        "range": "2.x",
-        "channel": "v2"
-      },
-      "main",
-      {
-        "name": "static",
-        "channel": "static",
-        "prerelease": true
-      }
-    ],
-    "extends": "@sanity/semantic-release-preset"
-  },
+  "browserslist": "extends @sanity/browserslist-config",
   "dependencies": {
-    "@floating-ui/react-dom": "^2.1.6",
-    "@juggle/resize-observer": "^3.4.0",
+    "@floating-ui/react-dom": "^2.1.8",
     "@sanity/color": "^3.0.6",
     "@sanity/icons": "^3.7.4",
-    "csstype": "^3.1.3",
-    "motion": "^12.23.24",
-    "react-compiler-runtime": "1.0.0",
+    "@vanilla-extract/dynamic": "^2.1.5",
+    "csstype": "^3.2.3",
+    "motion": "^12.38.0",
     "react-refractor": "^4.0.0",
-    "use-effect-event": "^2.0.3"
+    "@sanity/ui-css": "1.0.0-beta.0",
+    "@sanity/ui-tokens": "1.0.0-beta.0"
   },
   "devDependencies": {
-    "@babel/core": "^7.28.5",
-    "@babel/preset-env": "^7.28.5",
+    "@babel/core": "^7.29.0",
+    "@babel/preset-env": "^7.29.2",
     "@babel/preset-react": "^7.28.5",
     "@babel/preset-typescript": "^7.28.5",
-    "@commitlint/cli": "^19.8.1",
-    "@commitlint/config-conventional": "^19.8.1",
-    "@eslint/js": "^9.39.1",
-    "@sanity/pkg-utils": "^8.1.29",
-    "@sanity/prettier-config": "^2.0.1",
-    "@sanity/semantic-release-preset": "^5.0.0",
-    "@sanity/ui-workshop": "^3.4.0",
-    "@storybook/addon-a11y": "^8.6.14",
-    "@storybook/addon-docs": "^8.6.14",
-    "@storybook/addon-essentials": "^8.6.14",
-    "@storybook/addon-interactions": "^8.6.14",
-    "@storybook/addon-links": "^8.6.14",
-    "@storybook/addon-mdx-gfm": "^8.6.14",
-    "@storybook/addon-storysource": "^8.6.14",
-    "@storybook/addon-themes": "^8.6.14",
-    "@storybook/blocks": "^8.6.14",
-    "@storybook/manager-api": "^8.6.14",
-    "@storybook/react": "^8.6.14",
-    "@storybook/react-vite": "^8.6.14",
-    "@storybook/test": "^8.6.14",
-    "@storybook/theming": "^8.6.14",
+    "@playwright/test": "^1.59.1",
+    "@sanity/browserslist-config": "^1.0.5",
+    "@sanity/pkg-utils": "^10.4.14",
+    "@sanity/prettier-config": "^3.0.0",
     "@testing-library/dom": "^10.4.1",
-    "@testing-library/jest-dom": "^6.8.0",
-    "@testing-library/react": "^16.3.0",
+    "@testing-library/jest-dom": "^6.9.1",
+    "@testing-library/react": "^16.3.2",
     "@testing-library/user-event": "^14.6.1",
-    "@types/jest": "^30.0.0",
-    "@types/jest-axe": "^3.5.9",
-    "@types/node": "^22.18.1",
-    "@types/react": "^19.2.2",
-    "@types/react-dom": "^19.2.2",
+    "@types/node": "^24.12.2",
+    "@types/react": "^19.2.14",
+    "@types/react-dom": "^19.2.3",
     "@types/react-is": "^19.2.0",
-    "@vitejs/plugin-react": "^5.0.4",
+    "@vanilla-extract/css": "^1.20.1",
+    "@vanilla-extract/vite-plugin": "^5.2.2",
+    "@vitejs/plugin-react": "^6.0.1",
+    "@vitest/browser": "^4.1.4",
     "babel-plugin-react-compiler": "1.0.0",
-    "babel-plugin-styled-components": "^2.1.4",
-    "commitizen": "^4.3.1",
-    "cypress": "^13.17.0",
-    "cypress-real-events": "^1.14.0",
-    "cz-conventional-changelog": "^3.3.0",
-    "eslint": "^9.39.1",
-    "eslint-config-prettier": "^10.1.8",
-    "eslint-formatter-gha": "^1.6.0",
-    "eslint-plugin-boundaries": "^5.1.0",
-    "eslint-plugin-import": "^2.32.0",
-    "eslint-plugin-jsx-a11y": "^6.10.2",
-    "eslint-plugin-react": "^7.37.5",
-    "eslint-plugin-react-hooks": "7.0.1",
-    "eslint-plugin-react-refresh": "^0.4.24",
-    "eslint-plugin-simple-import-sort": "^12.1.1",
-    "eslint-plugin-storybook": "^0.12.0",
-    "globals": "^16.3.0",
-    "http-server": "^14.1.1",
-    "husky": "^8.0.3",
-    "jest": "^30.1.3",
-    "jest-axe": "^10.0.0",
-    "jest-environment-jsdom": "^30.1.2",
-    "lint-staged": "^14.0.1",
-    "module-alias": "^2.2.3",
-    "npm-run-all2": "^8.0.4",
-    "prettier": "^3.6.2",
-    "react": "^19.2.0",
-    "react-dom": "^19.2.0",
-    "react-is": "^19.2.0",
+    "eslint": "^9.39.4",
+    "eslint-plugin-boundaries": "^5.4.0",
+    "jsdom": "^29.0.2",
+    "react": "^19.2.5",
+    "react-dom": "^19.2.5",
+    "react-is": "^19.2.5",
     "refractor": "^5.0.0",
-    "rimraf": "^5.0.5",
-    "semantic-release": "^24.2.7",
-    "start-server-and-test": "^2.1.0",
-    "storybook": "^8.6.14",
-    "styled-components": "npm:@sanity/styled-components@^6.1.23",
+    "rimraf": "^6.1.3",
     "tsconfig-paths": "^4.2.0",
-    "typescript": "5.9.3",
-    "typescript-eslint": "^8.46.3",
-    "vite": "^7.2.2",
-    "vite-tsconfig-paths": "^5.1.4"
+    "tsx": "^4.21.0",
+    "typescript": "6.0.2",
+    "vite": "^8.0.8",
+    "vite-tsconfig-paths": "^6.1.1",
+    "vitest": "^4.1.4",
+    "vitest-axe": "1.0.0-pre.5",
+    "@repo/eslint-config": "0.0.0",
+    "@repo/typescript-config": "0.0.0"
   },
   "peerDependencies": {
-    "react": "^18 || >=19.0.0-0",
-    "react-dom": "^18 || >=19.0.0-0",
-    "react-is": "^18 || >=19.0.0-0",
-    "styled-components": "^5.2 || ^6"
+    "react": "^19.2",
+    "react-dom": "^19.2",
+    "react-is": "^19.2"
   },
-  "packageManager": "pnpm@9.15.9",
   "engines": {
     "node": ">=20.19 <22 || >=22.12"
   },
   "publishConfig": {
     "access": "public"
   },
-  "pnpm": {
-    "overrides": {
-      "@types/react": "$@types/react",
-      "@types/react-dom": "$@types/react-dom",
-      "@types/react-is": "$@types/react-is",
-      "conventional-changelog-conventionalcommits": ">= 8.0.0",
-      "react": "$react",
-      "react-dom": "$react-dom",
-      "react-is": "$react-is"
-    }
-  },
   "esm.sh": {
     "bundle": false
+  },
+  "scripts": {
+    "prebuild": "tsx scripts/prebuild.ts",
+    "build": "run-s pkg:build pkg:check",
+    "clean": "rimraf dist",
+    "dev": "pnpm workshop:dev",
+    "figma:build": "pnpm run --filter 'figma-plugin-sanity-ui' build",
+    "format": "prettier --write --cache --ignore-unknown .",
+    "lint": "eslint .",
+    "pkg:build": "NODE_ENV=production pkg build --strict",
+    "pkg:check": "pkg --strict",
+    "playwright:dev": "PLAYWRIGHT_DEV=true playwright test --ui",
+    "test": "vitest run",
+    "test:e2e": "playwright test",
+    "test:e2e:dev": "PLAYWRIGHT_DEV=true playwright test",
+    "test:e2e:ui": "playwright test --ui",
+    "typecheck": "tsc --build",
+    "workshop:build": "rimraf .workshop && workshop build",
+    "workshop:dev": "rimraf .workshop && workshop dev",
+    "workshop:preview": "workshop preview"
   }
-}
+}