quilling.dev
An ATproto social media client -- with an independent Appview.
Mark old components as deprecated (#8747)
* mark a bunch of stuff as deprecated
* mark s as deprecated (serverence reference????)
* rm type import
samuel.fm
+7
-3
src/lib/ThemeContext.tsx
+7
-3
src/lib/ThemeContext.tsx
···
1
-
import React, {createContext, ReactNode, useContext} from 'react'
2
-
import {TextStyle, ViewStyle} from 'react-native'
1
+
import {type ReactNode} from 'react'
2
+
import {createContext, useContext} from 'react'
3
+
import {type TextStyle, type ViewStyle} from 'react-native'
3
4
4
-
import {ThemeName} from '#/alf/types'
5
+
import {type ThemeName} from '#/alf/types'
5
6
import {darkTheme, defaultTheme, dimTheme} from './themes'
6
7
7
8
export type ColorScheme = 'light' | 'dark'
···
29
30
export type ShapeName = 'button' | 'bigButton' | 'smallButton'
30
31
export type Shapes = Record<ShapeName, ViewStyle>
31
32
33
+
/**
34
+
* @deprecated use typography atoms from `#/alf`
35
+
*/
32
36
export type TypographyVariant =
33
37
| '2xl-thin'
34
38
| '2xl'
+10
-2
src/lib/hooks/usePalette.ts
+10
-2
src/lib/hooks/usePalette.ts
···
1
1
import {useMemo} from 'react'
2
-
import {TextStyle, ViewStyle} from 'react-native'
2
+
import {type TextStyle, type ViewStyle} from 'react-native'
3
3
4
-
import {PaletteColor, PaletteColorName, useTheme} from '../ThemeContext'
4
+
import {
5
+
type PaletteColor,
6
+
type PaletteColorName,
7
+
useTheme,
8
+
} from '../ThemeContext'
5
9
6
10
export interface UsePaletteValue {
7
11
colors: PaletteColor
···
16
20
link: TextStyle
17
21
icon: TextStyle
18
22
}
23
+
24
+
/**
25
+
* @deprecated use `useTheme` from `#/alf`
26
+
*/
19
27
export function usePalette(color: PaletteColorName): UsePaletteValue {
20
28
const theme = useTheme()
21
29
return useMemo(() => {
+13
-2
src/lib/styles.ts
+13
-2
src/lib/styles.ts
···
1
-
import {Dimensions, StyleProp, StyleSheet, TextStyle} from 'react-native'
1
+
import {
2
+
Dimensions,
3
+
type StyleProp,
4
+
StyleSheet,
5
+
type TextStyle,
6
+
} from 'react-native'
2
7
3
8
import {isWeb} from '#/platform/detection'
4
-
import {Theme, TypographyVariant} from './ThemeContext'
9
+
import {type Theme, type TypographyVariant} from './ThemeContext'
5
10
6
11
// 1 is lightest, 2 is light, 3 is mid, 4 is dark, 5 is darkest
12
+
/**
13
+
* @deprecated use ALF colors instead
14
+
*/
7
15
export const colors = {
8
16
white: '#ffffff',
9
17
black: '#000000',
···
63
71
blueDark: {start: '#5F45E0', end: colors.blue3}, // avis, banner
64
72
}
65
73
74
+
/**
75
+
* @deprecated use atoms from `#/alf`
76
+
*/
66
77
export const s = StyleSheet.create({
67
78
// helpers
68
79
footerSpacer: {height: 100},
+9
src/state/modals/index.tsx
+9
src/state/modals/index.tsx
···
43
43
name: 'change-password'
44
44
}
45
45
46
+
/**
47
+
* @deprecated DO NOT ADD NEW MODALS
48
+
*/
46
49
export type Modal =
47
50
// Account
48
51
| DeleteAccountModal
···
125
128
)
126
129
}
127
130
131
+
/**
132
+
* @deprecated use the dialog system from `#/components/Dialog.tsx`
133
+
*/
128
134
export function useModals() {
129
135
return React.useContext(ModalContext)
130
136
}
131
137
138
+
/**
139
+
* @deprecated use the dialog system from `#/components/Dialog.tsx`
140
+
*/
132
141
export function useModalControls() {
133
142
return React.useContext(ModalControlContext)
134
143
}
+9
src/view/com/util/Link.tsx
+9
src/view/com/util/Link.tsx
···
56
56
onBeforePress?: () => void
57
57
}
58
58
59
+
/**
60
+
* @deprecated use Link from `#/components/Link.tsx` instead
61
+
*/
59
62
export const Link = memo(function Link({
60
63
testID,
61
64
style,
···
156
159
)
157
160
})
158
161
162
+
/**
163
+
* @deprecated use InlineLinkText from `#/components/Link.tsx` instead
164
+
*/
159
165
export const TextLink = memo(function TextLink({
160
166
testID,
161
167
type = 'md',
···
301
307
onPointerEnter?: () => void
302
308
anchorNoUnderline?: boolean
303
309
}
310
+
/**
311
+
* @deprecated use WebOnlyInlineLinkText from `#/components/Link.tsx` instead
312
+
*/
304
313
export const TextLinkOnWebOnly = memo(function DesktopWebTextLink({
305
314
testID,
306
315
type = 'md',
+1
-1
src/view/com/util/ViewHeader.tsx
+1
-1
src/view/com/util/ViewHeader.tsx
+10
-8
src/view/com/util/forms/Button.tsx
+10
-8
src/view/com/util/forms/Button.tsx
···
1
1
import React from 'react'
2
2
import {
3
3
ActivityIndicator,
4
-
GestureResponderEvent,
5
-
NativeSyntheticEvent,
6
-
NativeTouchEvent,
4
+
type GestureResponderEvent,
5
+
type NativeSyntheticEvent,
6
+
type NativeTouchEvent,
7
7
Pressable,
8
-
PressableStateCallbackType,
9
-
StyleProp,
8
+
type PressableStateCallbackType,
9
+
type StyleProp,
10
10
StyleSheet,
11
-
TextStyle,
11
+
type TextStyle,
12
12
View,
13
-
ViewStyle,
13
+
type ViewStyle,
14
14
} from 'react-native'
15
15
16
16
import {choose} from '#/lib/functions'
···
37
37
}
38
38
}
39
39
40
-
// TODO: Enforce that button always has a label
40
+
/**
41
+
* @deprecated use Button from `#/components/Button.tsx` instead
42
+
*/
41
43
export function Button({
42
44
type = 'primary',
43
45
label,
+12
-7
src/view/com/util/forms/DropdownButton.tsx
+12
-7
src/view/com/util/forms/DropdownButton.tsx
···
1
-
import React, {PropsWithChildren, useMemo, useRef} from 'react'
1
+
import {type PropsWithChildren} from 'react'
2
+
import {useMemo, useRef} from 'react'
2
3
import {
3
4
Dimensions,
4
-
GestureResponderEvent,
5
-
Insets,
6
-
StyleProp,
5
+
type GestureResponderEvent,
6
+
type Insets,
7
+
type StyleProp,
7
8
StyleSheet,
8
9
TouchableOpacity,
9
10
TouchableWithoutFeedback,
10
11
useWindowDimensions,
11
12
View,
12
-
ViewStyle,
13
+
type ViewStyle,
13
14
} from 'react-native'
14
15
import Animated, {FadeIn, FadeInDown, FadeInUp} from 'react-native-reanimated'
15
16
import RootSiblings from 'react-native-root-siblings'
16
-
import {IconProp} from '@fortawesome/fontawesome-svg-core'
17
+
import {type IconProp} from '@fortawesome/fontawesome-svg-core'
17
18
import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
18
19
import {msg} from '@lingui/macro'
19
20
import {useLingui} from '@lingui/react'
21
+
import type React from 'react'
20
22
21
23
import {HITSLOP_10} from '#/lib/constants'
22
24
import {usePalette} from '#/lib/hooks/usePalette'
···
26
28
import {native} from '#/alf'
27
29
import {FullWindowOverlay} from '#/components/FullWindowOverlay'
28
30
import {Text} from '../text/Text'
29
-
import {Button, ButtonType} from './Button'
31
+
import {Button, type ButtonType} from './Button'
30
32
31
33
const ESTIMATED_BTN_HEIGHT = 50
32
34
const ESTIMATED_SEP_HEIGHT = 16
···
70
72
accessibilityHint?: string
71
73
}
72
74
75
+
/**
76
+
* @deprecated use Menu from `#/components/Menu.tsx` instead
77
+
*/
73
78
export function DropdownButton({
74
79
testID,
75
80
type = 'bare',
+34
-4
src/view/com/util/forms/NativeDropdown.tsx
+34
-4
src/view/com/util/forms/NativeDropdown.tsx
···
1
1
import React from 'react'
2
-
import {Platform, Pressable, StyleSheet, View, ViewStyle} from 'react-native'
3
-
import {IconProp} from '@fortawesome/fontawesome-svg-core'
2
+
import {
3
+
Platform,
4
+
Pressable,
5
+
StyleSheet,
6
+
View,
7
+
type ViewStyle,
8
+
} from 'react-native'
9
+
import {type IconProp} from '@fortawesome/fontawesome-svg-core'
4
10
import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
5
11
import * as DropdownMenu from 'zeego/dropdown-menu'
6
-
import {MenuItemCommonProps} from 'zeego/lib/typescript/menu'
12
+
import {type MenuItemCommonProps} from 'zeego/lib/typescript/menu'
7
13
8
14
import {usePalette} from '#/lib/hooks/usePalette'
9
15
import {useTheme} from '#/lib/ThemeContext'
···
12
18
13
19
// Custom Dropdown Menu Components
14
20
// ==
21
+
/**
22
+
* @deprecated use Menu from `#/components/Menu.tsx` instead
23
+
*/
15
24
export const DropdownMenuRoot = DropdownMenu.Root
16
25
// export const DropdownMenuTrigger = DropdownMenu.Trigger
26
+
/**
27
+
* @deprecated use Menu from `#/components/Menu.tsx` instead
28
+
*/
17
29
export const DropdownMenuContent = DropdownMenu.Content
18
30
19
31
type TriggerProps = Omit<
···
25
37
accessibilityLabel?: string
26
38
accessibilityHint?: string
27
39
}>
40
+
/**
41
+
* @deprecated use Menu from `#/components/Menu.tsx` instead
42
+
*/
28
43
export const DropdownMenuTrigger = DropdownMenu.create(
29
44
(props: TriggerProps) => {
30
45
const theme = useTheme()
···
59
74
)
60
75
61
76
type ItemProps = React.ComponentProps<(typeof DropdownMenu)['Item']>
77
+
/**
78
+
* @deprecated use Menu from `#/components/Menu.tsx` instead
79
+
*/
62
80
export const DropdownMenuItem = DropdownMenu.create(
63
81
(props: ItemProps & {testID?: string}) => {
64
82
const theme = useTheme()
···
84
102
)
85
103
86
104
type TitleProps = React.ComponentProps<(typeof DropdownMenu)['ItemTitle']>
105
+
/**
106
+
* @deprecated use Menu from `#/components/Menu.tsx` instead
107
+
*/
87
108
export const DropdownMenuItemTitle = DropdownMenu.create(
88
109
(props: TitleProps) => {
89
110
const pal = usePalette('default')
···
98
119
)
99
120
100
121
type IconProps = React.ComponentProps<(typeof DropdownMenu)['ItemIcon']>
122
+
/**
123
+
* @deprecated use Menu from `#/components/Menu.tsx` instead
124
+
*/
101
125
export const DropdownMenuItemIcon = DropdownMenu.create((props: IconProps) => {
102
126
return <DropdownMenu.ItemIcon {...props} />
103
127
}, 'ItemIcon')
104
128
105
129
type SeparatorProps = React.ComponentProps<(typeof DropdownMenu)['Separator']>
130
+
/**
131
+
* @deprecated use Menu from `#/components/Menu.tsx` instead
132
+
*/
106
133
export const DropdownMenuSeparator = DropdownMenu.create(
107
134
(props: SeparatorProps) => {
108
135
const pal = usePalette('default')
···
142
169
triggerStyle?: ViewStyle
143
170
}
144
171
145
-
/* The `NativeDropdown` function uses native iOS and Android dropdown menus.
172
+
/**
173
+
* The `NativeDropdown` function uses native iOS and Android dropdown menus.
146
174
* It also creates a animated custom dropdown for web that uses
147
175
* Radix UI primitives under the hood
148
176
* @prop {DropdownItem[]} items - An array of dropdown items
149
177
* @prop {React.ReactNode} children - A custom dropdown trigger
178
+
*
179
+
* @deprecated use Menu from `#/components/Menu.tsx` instead
150
180
*/
151
181
export function NativeDropdown({
152
182
items,
+3
src/view/com/util/forms/NativeDropdown.web.tsx
+3
src/view/com/util/forms/NativeDropdown.web.tsx
+12
-3
src/view/com/util/forms/ToggleButton.tsx
+12
-3
src/view/com/util/forms/ToggleButton.tsx
···
1
-
import {StyleProp, StyleSheet, TextStyle, View, ViewStyle} from 'react-native'
1
+
import {
2
+
type StyleProp,
3
+
StyleSheet,
4
+
type TextStyle,
5
+
View,
6
+
type ViewStyle,
7
+
} from 'react-native'
2
8
3
9
import {choose} from '#/lib/functions'
4
10
import {colors} from '#/lib/styles'
5
11
import {useTheme} from '#/lib/ThemeContext'
6
-
import {TypographyVariant} from '#/lib/ThemeContext'
12
+
import {type TypographyVariant} from '#/lib/ThemeContext'
7
13
import {Text} from '../text/Text'
8
-
import {Button, ButtonType} from './Button'
14
+
import {Button, type ButtonType} from './Button'
9
15
16
+
/**
17
+
* @deprecated use Toggle from `#/components/form/Toggle.tsx` instead
18
+
*/
10
19
export function ToggleButton({
11
20
testID,
12
21
type = 'default-light',
+4
-4
src/view/com/util/text/Text.tsx
+4
-4
src/view/com/util/text/Text.tsx
···
1
1
import React from 'react'
2
-
import {StyleSheet, TextProps} from 'react-native'
2
+
import {StyleSheet, type TextProps} from 'react-native'
3
3
import {UITextView} from 'react-native-uitextview'
4
4
5
5
import {lh, s} from '#/lib/styles'
6
-
import {TypographyVariant, useTheme} from '#/lib/ThemeContext'
6
+
import {type TypographyVariant, useTheme} from '#/lib/ThemeContext'
7
7
import {logger} from '#/logger'
8
8
import {isIOS, isWeb} from '#/platform/detection'
9
9
import {applyFonts, useAlf} from '#/alf'
10
10
import {
11
11
childHasEmoji,
12
12
renderChildrenWithEmoji,
13
-
StringChild,
13
+
type StringChild,
14
14
} from '#/alf/typography'
15
15
16
16
export type CustomTextProps = Omit<TextProps, 'children'> & {
···
32
32
33
33
export {Text_DEPRECATED as Text}
34
34
/**
35
-
* @deprecated use Text from Typography instead.
35
+
* @deprecated use Text from `#/components/Typography.tsx` instead
36
36
*/
37
37
function Text_DEPRECATED({
38
38
type = 'md',