@bsky.app/sift 0.2.11 → 0.3.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.
- package/CHANGELOG.md +10 -0
- package/build/computeStyles.d.ts.map +1 -1
- package/build/computeStyles.js +5 -2
- package/build/computeStyles.js.map +1 -1
- package/package.json +1 -1
- package/src/computeStyles.ts +6 -2
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,15 @@
|
|
|
1
1
|
# @bsky.app/sift
|
|
2
2
|
|
|
3
|
+
## 0.3.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- [`878376e`](https://github.com/bluesky-social/toolbox/commit/878376ea9e87779eb8930771acf167a5cb56990f) Thanks [@estrattonbailey](https://github.com/estrattonbailey)! - Bump stable minor
|
|
8
|
+
|
|
9
|
+
### Patch Changes
|
|
10
|
+
|
|
11
|
+
- [`acd32e2`](https://github.com/bluesky-social/toolbox/commit/acd32e28ff75d119f794ed9857d2efc16ebc0f5a) Thanks [@estrattonbailey](https://github.com/estrattonbailey)! - Fix alignment on android
|
|
12
|
+
|
|
3
13
|
## 0.2.11
|
|
4
14
|
|
|
5
15
|
### Patch Changes
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"computeStyles.d.ts","sourceRoot":"","sources":["../src/computeStyles.ts"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"computeStyles.d.ts","sourceRoot":"","sources":["../src/computeStyles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAuB,KAAK,SAAS,EAAC,MAAM,cAAc,CAAA;AACjE,OAAO,EAAC,KAAK,SAAS,EAAC,MAAM,WAAW,CAAA;AAkBxC,wBAAsB,aAAa,CACjC,EACE,MAAM,EACN,KAAK,EACL,OAAO,GACR,EAAE;IACD,MAAM,EAAE,GAAG,CAAA;IACX,KAAK,EAAE,GAAG,CAAA;IACV,OAAO,EAAE,GAAG,GAAG,IAAI,CAAA;CACpB,EACD,OAAO,EAAE;IACP,MAAM,EAAE,MAAM,CAAA;IACd,SAAS,EAAE,SAAS,CAAA;IACpB,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,MAAM,CAAC,EAAE;QAAC,GAAG,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAC,CAAA;CACvC,GACA,OAAO,CAAC,SAAS,GAAG,IAAI,CAAC,CA4D3B"}
|
package/build/computeStyles.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { Dimensions } from 'react-native';
|
|
1
|
+
import { Dimensions, Platform } from 'react-native';
|
|
2
2
|
function measureInWindow(node) {
|
|
3
3
|
return new Promise(resolve => {
|
|
4
4
|
try {
|
|
@@ -29,7 +29,10 @@ export async function computeStyles({ anchor, input, popover, }, options) {
|
|
|
29
29
|
let bottom = 'auto';
|
|
30
30
|
let maxHeight;
|
|
31
31
|
if (side === 'top') {
|
|
32
|
-
|
|
32
|
+
// android reports window size minus insets
|
|
33
|
+
const windowHeight = Dimensions.get('window').height +
|
|
34
|
+
(Platform.OS === 'android' ? insetBottom : 0);
|
|
35
|
+
bottom = windowHeight - anchorRect.y + options.offset;
|
|
33
36
|
maxHeight = anchorRect.y - options.offset - insetTop;
|
|
34
37
|
}
|
|
35
38
|
else {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"computeStyles.js","sourceRoot":"","sources":["../src/computeStyles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAAiB,MAAM,cAAc,CAAA;
|
|
1
|
+
{"version":3,"file":"computeStyles.js","sourceRoot":"","sources":["../src/computeStyles.ts"],"names":[],"mappings":"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","sourcesContent":["import {Dimensions, Platform, type ViewStyle} from 'react-native'\nimport {type Placement} from './useSift'\n\nfunction measureInWindow(\n node: any,\n): Promise<{x: number; y: number; width: number; height: number}> {\n return new Promise(resolve => {\n try {\n node.measureInWindow(\n (x: number, y: number, width: number, height: number) => {\n resolve({x, y, width, height})\n },\n )\n } catch {\n resolve({x: 0, y: 0, width: 0, height: 0})\n }\n })\n}\n\nexport async function computeStyles(\n {\n anchor,\n input,\n popover,\n }: {\n anchor: any\n input: any\n popover: any | null\n },\n options: {\n offset: number\n placement: Placement\n dynamicWidth?: boolean\n insets?: {top: number; bottom: number}\n },\n): Promise<ViewStyle | null> {\n const anchorRect = await measureInWindow(anchor)\n const inputRect = await measureInWindow(input)\n const popoverRect = popover ? await measureInWindow(popover) : null\n\n // If any measurement failed (view not in hierarchy yet), return null\n // so the caller keeps the previous styles.\n if (!anchorRect.width || !inputRect.width) return null\n if (popoverRect && !popoverRect.width && !popoverRect.height) return null\n\n const popoverWidth = popoverRect?.width ?? 0\n const [side, align] = options.placement.split('-') as [\n string,\n string | undefined,\n ]\n\n const insetTop = options.insets?.top ?? 0\n const insetBottom = options.insets?.bottom ?? 0\n\n let top: number | 'auto' = 'auto'\n let bottom: number | 'auto' = 'auto'\n let maxHeight: number | undefined\n if (side === 'top') {\n // android reports window size minus insets\n const windowHeight =\n Dimensions.get('window').height +\n (Platform.OS === 'android' ? insetBottom : 0)\n bottom = windowHeight - anchorRect.y + options.offset\n maxHeight = anchorRect.y - options.offset - insetTop\n } else {\n top = anchorRect.y + anchorRect.height + options.offset\n maxHeight =\n Dimensions.get('window').height -\n insetBottom -\n (anchorRect.y + anchorRect.height + options.offset)\n }\n\n let left: number\n if (align === 'start') {\n left = anchorRect.x\n } else if (align === 'end') {\n left = anchorRect.x + anchorRect.width - popoverWidth\n } else {\n left = anchorRect.x + (anchorRect.width - popoverWidth) / 2\n }\n\n let maxWidth: number | undefined\n if (options.dynamicWidth === false) {\n left = anchorRect.x\n maxWidth = anchorRect.width\n }\n\n return {\n position: 'absolute',\n top,\n bottom,\n left,\n maxWidth,\n maxHeight,\n }\n}\n"]}
|
package/package.json
CHANGED
package/src/computeStyles.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {Dimensions, type ViewStyle} from 'react-native'
|
|
1
|
+
import {Dimensions, Platform, type ViewStyle} from 'react-native'
|
|
2
2
|
import {type Placement} from './useSift'
|
|
3
3
|
|
|
4
4
|
function measureInWindow(
|
|
@@ -56,7 +56,11 @@ export async function computeStyles(
|
|
|
56
56
|
let bottom: number | 'auto' = 'auto'
|
|
57
57
|
let maxHeight: number | undefined
|
|
58
58
|
if (side === 'top') {
|
|
59
|
-
|
|
59
|
+
// android reports window size minus insets
|
|
60
|
+
const windowHeight =
|
|
61
|
+
Dimensions.get('window').height +
|
|
62
|
+
(Platform.OS === 'android' ? insetBottom : 0)
|
|
63
|
+
bottom = windowHeight - anchorRect.y + options.offset
|
|
60
64
|
maxHeight = anchorRect.y - options.offset - insetTop
|
|
61
65
|
} else {
|
|
62
66
|
top = anchorRect.y + anchorRect.height + options.offset
|