@sanity/ui 1.1.0-beta.2 → 1.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (51) hide show
  1. package/LICENSE +1 -1
  2. package/dist/index.cjs.mjs +120 -0
  3. package/dist/index.d.ts +26 -4
  4. package/dist/{index.cjs → index.esm.js} +1987 -1946
  5. package/dist/index.esm.js.map +1 -0
  6. package/dist/index.js +2114 -1819
  7. package/dist/index.js.map +1 -1
  8. package/package.json +47 -44
  9. package/src/components/dialog/__workshop__/activate.tsx +134 -0
  10. package/src/components/dialog/__workshop__/index.ts +3 -0
  11. package/src/components/dialog/__workshop__/nested.tsx +14 -3
  12. package/src/components/dialog/__workshop__/panes.tsx +86 -0
  13. package/src/components/dialog/__workshop__/wrapped.tsx +78 -0
  14. package/src/components/dialog/dialog.tsx +110 -25
  15. package/src/components/toast/toastProvider.tsx +55 -52
  16. package/src/constants.ts +2 -2
  17. package/src/helpers/element.ts +7 -0
  18. package/src/hooks/index.ts +1 -0
  19. package/src/hooks/useArrayProp.ts +2 -1
  20. package/src/hooks/useMediaIndex/useMediaIndex.test.tsx +31 -0
  21. package/src/hooks/useMediaIndex/useMediaIndex.ts +98 -6
  22. package/src/hooks/useMounted.ts +14 -0
  23. package/src/hooks/usePrefersDark.hydration.test.tsx +56 -0
  24. package/src/hooks/usePrefersDark.test.tsx +18 -0
  25. package/src/hooks/usePrefersDark.ts +51 -18
  26. package/src/hooks/usePrefersReducedMotion.hydration.test.tsx +56 -0
  27. package/src/hooks/usePrefersReducedMotion.test.tsx +18 -0
  28. package/src/hooks/usePrefersReducedMotion.ts +62 -0
  29. package/src/observers/resizeObserver.ts +1 -1
  30. package/src/primitives/code/styles.ts +6 -0
  31. package/src/primitives/heading/styles.ts +6 -0
  32. package/src/primitives/label/styles.ts +6 -0
  33. package/src/primitives/popover/__workshop__/OpenOnMountStory.tsx +11 -0
  34. package/src/primitives/popover/__workshop__/index.ts +5 -0
  35. package/src/primitives/text/styles.ts +6 -0
  36. package/src/utils/layer/__workshop__/_debug.tsx +9 -3
  37. package/src/utils/layer/__workshop__/index.ts +3 -3
  38. package/src/utils/layer/__workshop__/multipleRoots.tsx +2 -1
  39. package/src/utils/layer/__workshop__/{plain.tsx → nested.tsx} +14 -4
  40. package/src/utils/layer/getLayerContext.test.ts +30 -0
  41. package/src/utils/layer/getLayerContext.ts +21 -0
  42. package/src/utils/layer/layer.test.tsx +1 -0
  43. package/src/utils/layer/layer.tsx +49 -7
  44. package/src/utils/layer/layerContext.ts +2 -2
  45. package/src/utils/layer/layerProvider.tsx +73 -12
  46. package/src/utils/layer/types.ts +3 -4
  47. package/src/utils/layer/useLayer.ts +9 -8
  48. package/src/utils/portal/portalContext.ts +1 -1
  49. package/src/utils/portal/portalProvider.tsx +1 -1
  50. package/dist/index.cjs.map +0 -1
  51. package/src/hooks/useMediaIndex/lib/media.ts +0 -88
@@ -1,88 +0,0 @@
1
- /**
2
- * @internal
3
- */
4
- export interface _MediaManager {
5
- getCurrentIndex: () => number
6
- subscribe: (subscriber: (index: number) => void) => () => void
7
- }
8
-
9
- const MEDIA_MANAGER_CACHE = new WeakMap<number[], _MediaManager>()
10
-
11
- function _getMediaQuery(media: number[], index: number) {
12
- if (index === 0) {
13
- return `screen and (max-width: ${media[index] - 1}px)`
14
- }
15
-
16
- if (index === media.length) {
17
- return `screen and (min-width: ${media[index - 1]}px)`
18
- }
19
-
20
- return `screen and (min-width: ${media[index - 1]}px) and (max-width: ${media[index] - 1}px)`
21
- }
22
-
23
- function _createMediaManager(media: number[]): _MediaManager {
24
- const mediaLen = media.length
25
- const sizes: {mq: MediaQueryList; index: number}[] = []
26
-
27
- if (typeof window !== 'undefined') {
28
- for (let index = mediaLen; index > -1; index -= 1) {
29
- const mediaQuery = _getMediaQuery(media, index)
30
-
31
- sizes.push({index, mq: window.matchMedia(mediaQuery)})
32
- }
33
- }
34
-
35
- const getCurrentIndex = () => {
36
- for (const {index, mq} of sizes) {
37
- if (mq.matches) return index
38
- }
39
-
40
- return 0
41
- }
42
-
43
- const subscribe = (subscriber: (index: number) => void) => {
44
- const disposeFns: (() => void)[] = []
45
-
46
- for (const {index, mq} of sizes) {
47
- const handleChange = () => {
48
- if (mq.matches) subscriber(index)
49
- }
50
-
51
- if (mq.addEventListener) {
52
- mq.addEventListener('change', handleChange)
53
- } else {
54
- mq.addListener(handleChange)
55
- }
56
-
57
- disposeFns.push(() => {
58
- if (mq.removeEventListener) {
59
- mq.removeEventListener('change', handleChange)
60
- } else {
61
- mq.removeListener(handleChange)
62
- }
63
- })
64
- }
65
-
66
- return () => {
67
- for (const disposeFn of disposeFns) {
68
- disposeFn()
69
- }
70
- }
71
- }
72
-
73
- return {getCurrentIndex, subscribe}
74
- }
75
-
76
- /**
77
- * @internal
78
- */
79
- export function _getMediaManager(media: number[]): _MediaManager {
80
- let manager = MEDIA_MANAGER_CACHE.get(media)
81
-
82
- if (!manager) {
83
- manager = _createMediaManager(media)
84
- MEDIA_MANAGER_CACHE.set(media, manager)
85
- }
86
-
87
- return manager
88
- }