seitu 0.2.2 → 0.2.3
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/dist/react/hooks.d.ts +2 -2
- package/dist/web/media-query.d.ts +8 -8
- package/dist/web/scroll-state.d.ts +7 -7
- package/dist/web.js +1 -1
- package/package.json +1 -1
package/dist/react/hooks.d.ts
CHANGED
|
@@ -76,12 +76,12 @@ export interface UseSubscriptionOptions<S extends Subscribable<any> & Readable<a
|
|
|
76
76
|
* 'use client'
|
|
77
77
|
*
|
|
78
78
|
* import * as React from 'react'
|
|
79
|
-
* import {
|
|
79
|
+
* import { createScrollState } from 'seitu/web'
|
|
80
80
|
* import { useSubscription } from 'seitu/react'
|
|
81
81
|
*
|
|
82
82
|
* export default function Page() {
|
|
83
83
|
* const ref = React.useRef<HTMLDivElement>(null)
|
|
84
|
-
* const state = useSubscription(() =>
|
|
84
|
+
* const state = useSubscription(() => createScrollState({ element: () => ref.current, direction: 'vertical' }))
|
|
85
85
|
*
|
|
86
86
|
* return (
|
|
87
87
|
* <div ref={ref}>
|
|
@@ -33,10 +33,10 @@ export interface MediaQueryOptions<T extends string> {
|
|
|
33
33
|
*
|
|
34
34
|
* @example Vanilla
|
|
35
35
|
* ```ts twoslash title="media-query.ts"
|
|
36
|
-
* import {
|
|
36
|
+
* import { createMediaQuery } from 'seitu/web'
|
|
37
37
|
* import { useSubscription } from 'seitu/react'
|
|
38
38
|
*
|
|
39
|
-
* const isDesktop =
|
|
39
|
+
* const isDesktop = createMediaQuery({ query: '(min-width: 768px)' })
|
|
40
40
|
*
|
|
41
41
|
* // Usage with subscribe
|
|
42
42
|
* isDesktop.subscribe(matches => {
|
|
@@ -49,10 +49,10 @@ export interface MediaQueryOptions<T extends string> {
|
|
|
49
49
|
*
|
|
50
50
|
* @example React
|
|
51
51
|
* ```tsx twoslash title="page.tsx"
|
|
52
|
-
* import {
|
|
52
|
+
* import { createMediaQuery } from 'seitu/web'
|
|
53
53
|
* import { useSubscription } from 'seitu/react'
|
|
54
54
|
*
|
|
55
|
-
* const isDesktop =
|
|
55
|
+
* const isDesktop = createMediaQuery({ query: '(min-width: 768px)' })
|
|
56
56
|
*
|
|
57
57
|
* // Usage with some function component
|
|
58
58
|
* function Layout() {
|
|
@@ -63,15 +63,15 @@ export interface MediaQueryOptions<T extends string> {
|
|
|
63
63
|
*
|
|
64
64
|
* @example Errors
|
|
65
65
|
* ```tsx twoslash
|
|
66
|
-
* import {
|
|
66
|
+
* import { createMediaQuery } from 'seitu/web'
|
|
67
67
|
* import { useSubscription } from 'seitu/react'
|
|
68
68
|
*
|
|
69
69
|
* // @errors: 2362 2322 1109
|
|
70
|
-
*
|
|
70
|
+
* createMediaQuery({ query: '(min-width: ' })
|
|
71
71
|
*
|
|
72
72
|
* // @errors: 2362 2322 2820
|
|
73
|
-
*
|
|
73
|
+
* createMediaQuery({ query: '(min-width: 768' })
|
|
74
74
|
* ```
|
|
75
75
|
*/
|
|
76
|
-
export declare function
|
|
76
|
+
export declare function createMediaQuery<T extends string>(options: MediaQueryOptions<T>): MediaQuery;
|
|
77
77
|
export {};
|
|
@@ -43,9 +43,9 @@ export interface ScrollStateOptions {
|
|
|
43
43
|
*
|
|
44
44
|
* @example Vanilla
|
|
45
45
|
* ```ts twoslash
|
|
46
|
-
* import {
|
|
46
|
+
* import { createScrollState } from 'seitu/web'
|
|
47
47
|
*
|
|
48
|
-
* const scroll =
|
|
48
|
+
* const scroll = createScrollState({
|
|
49
49
|
* element: document.querySelector('.container'),
|
|
50
50
|
* direction: 'vertical',
|
|
51
51
|
* threshold: 10,
|
|
@@ -67,12 +67,12 @@ export interface ScrollStateOptions {
|
|
|
67
67
|
* 'use client'
|
|
68
68
|
*
|
|
69
69
|
* import * as React from 'react'
|
|
70
|
-
* import {
|
|
70
|
+
* import { createScrollState } from 'seitu/web'
|
|
71
71
|
* import { useSubscription } from 'seitu/react'
|
|
72
72
|
*
|
|
73
73
|
* function Layout() {
|
|
74
74
|
* const ref = React.useRef<HTMLDivElement>(null)
|
|
75
|
-
* const state = useSubscription(() =>
|
|
75
|
+
* const state = useSubscription(() => createScrollState({
|
|
76
76
|
* element: () => ref.current,
|
|
77
77
|
* threshold: 10,
|
|
78
78
|
* }))
|
|
@@ -90,12 +90,12 @@ export interface ScrollStateOptions {
|
|
|
90
90
|
* 'use client'
|
|
91
91
|
*
|
|
92
92
|
* import * as React from 'react'
|
|
93
|
-
* import {
|
|
93
|
+
* import { createScrollState } from 'seitu/web'
|
|
94
94
|
* import { useSubscription } from 'seitu/react'
|
|
95
95
|
*
|
|
96
96
|
* function Layout() {
|
|
97
97
|
* const [ref, setRef] = React.useState<HTMLDivElement | null>(null)
|
|
98
|
-
* const state = useSubscription(() =>
|
|
98
|
+
* const state = useSubscription(() => createScrollState({
|
|
99
99
|
* element: ref,
|
|
100
100
|
* threshold: 10,
|
|
101
101
|
* }), { deps: [ref] })
|
|
@@ -108,4 +108,4 @@ export interface ScrollStateOptions {
|
|
|
108
108
|
* }
|
|
109
109
|
* ```
|
|
110
110
|
*/
|
|
111
|
-
export declare function
|
|
111
|
+
export declare function createScrollState(options: ScrollStateOptions): ScrollState;
|
package/dist/web.js
CHANGED
|
@@ -171,4 +171,4 @@ function d(e) {
|
|
|
171
171
|
kind: "sessionStorage"
|
|
172
172
|
});
|
|
173
173
|
}
|
|
174
|
-
export { i as createLocalStorage, o as createLocalStorageValue,
|
|
174
|
+
export { i as createLocalStorage, o as createLocalStorageValue, s as createMediaQuery, l as createScrollState, u as createSessionStorage, d as createSessionStorageValue };
|