@hzblj/kara-components 0.26.1 → 0.27.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 +30 -0
- package/lib/module/atoms/activity-indicator/activity-indicator.android.js +3 -4
- package/lib/module/atoms/activity-indicator/activity-indicator.android.js.map +1 -1
- package/lib/module/atoms/date-picker/date-picker.android.js +3 -4
- package/lib/module/atoms/date-picker/date-picker.android.js.map +1 -1
- package/lib/module/atoms/island/island.android.js +2 -6
- package/lib/module/atoms/island/island.android.js.map +1 -1
- package/lib/module/atoms/picker/picker.android.js +3 -4
- package/lib/module/atoms/picker/picker.android.js.map +1 -1
- package/lib/module/atoms/pressable/pressable.js +5 -4
- package/lib/module/atoms/pressable/pressable.js.map +1 -1
- package/lib/module/atoms/segmented-control/segmented-control.android.js +3 -4
- package/lib/module/atoms/segmented-control/segmented-control.android.js.map +1 -1
- package/lib/module/hooks/compose-host.js +27 -0
- package/lib/module/hooks/compose-host.js.map +1 -0
- package/lib/module/molecules/navigation-bar/bar-search-field.js +80 -0
- package/lib/module/molecules/navigation-bar/bar-search-field.js.map +1 -0
- package/lib/module/molecules/navigation-bar/navigation-bar.android.js +97 -22
- package/lib/module/molecules/navigation-bar/navigation-bar.android.js.map +1 -1
- package/lib/module/molecules/rn-list-item/rn-list-item.js +3 -2
- package/lib/module/molecules/rn-list-item/rn-list-item.js.map +1 -1
- package/lib/module/molecules/rn-tooltip/rn-tooltip.android.js +3 -4
- package/lib/module/molecules/rn-tooltip/rn-tooltip.android.js.map +1 -1
- package/lib/module/organisms/context-menu/context-menu.android.js +4 -5
- package/lib/module/organisms/context-menu/context-menu.android.js.map +1 -1
- package/lib/module/organisms/header/header-options.android.js +2 -6
- package/lib/module/organisms/header/header-options.android.js.map +1 -1
- package/lib/module/organisms/header/header-search-accessory.android.js +29 -2
- package/lib/module/organisms/header/header-search-accessory.android.js.map +1 -1
- package/lib/module/organisms/header/header-search-input.android.js +11 -51
- package/lib/module/organisms/header/header-search-input.android.js.map +1 -1
- package/lib/module/organisms/header/use-header-search.js +19 -11
- package/lib/module/organisms/header/use-header-search.js.map +1 -1
- package/lib/module/organisms/sheet/sheet.js +17 -1
- package/lib/module/organisms/sheet/sheet.js.map +1 -1
- package/lib/module/organisms/sheet/use-sheet-header.js +7 -1
- package/lib/module/organisms/sheet/use-sheet-header.js.map +1 -1
- package/lib/module/templates/screen/screen.android.js +3 -6
- package/lib/module/templates/screen/screen.android.js.map +1 -1
- package/lib/typescript/hooks/compose-host.d.ts +8 -0
- package/lib/typescript/molecules/navigation-bar/bar-search-field.d.ts +29 -0
- package/lib/typescript/molecules/navigation-bar/navigation-bar.types.d.ts +8 -6
- package/lib/typescript/organisms/header/header.types.d.ts +20 -10
- package/lib/typescript/organisms/header/use-header-search.d.ts +5 -3
- package/lib/typescript/organisms/sheet/sheet.types.d.ts +1 -1
- package/package.json +4 -4
- package/src/atoms/activity-indicator/activity-indicator.android.tsx +3 -6
- package/src/atoms/date-picker/date-picker.android.tsx +3 -12
- package/src/atoms/island/island.android.tsx +3 -7
- package/src/atoms/picker/picker.android.tsx +3 -3
- package/src/atoms/pressable/pressable.tsx +5 -7
- package/src/atoms/segmented-control/segmented-control.android.tsx +3 -6
- package/src/hooks/compose-host.tsx +20 -0
- package/src/molecules/navigation-bar/bar-search-field.tsx +94 -0
- package/src/molecules/navigation-bar/navigation-bar.android.tsx +123 -19
- package/src/molecules/navigation-bar/navigation-bar.types.ts +8 -6
- package/src/molecules/rn-list-item/rn-list-item.tsx +2 -1
- package/src/molecules/rn-tooltip/rn-tooltip.android.tsx +4 -3
- package/src/organisms/context-menu/context-menu.android.tsx +5 -9
- package/src/organisms/header/header-options.android.tsx +3 -7
- package/src/organisms/header/header-search-accessory.android.tsx +37 -3
- package/src/organisms/header/header-search-input.android.tsx +14 -53
- package/src/organisms/header/header.types.ts +20 -10
- package/src/organisms/header/use-header-search.tsx +18 -10
- package/src/organisms/sheet/sheet.tsx +19 -2
- package/src/organisms/sheet/sheet.types.ts +1 -1
- package/src/organisms/sheet/use-sheet-header.tsx +7 -1
- package/src/templates/screen/screen.android.tsx +4 -7
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,35 @@
|
|
|
1
1
|
# @hzblj/kara-components
|
|
2
2
|
|
|
3
|
+
## 0.27.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- [#90](https://github.com/hzblj/kara-ui/pull/90) [`31cb3e0`](https://github.com/hzblj/kara-ui/commit/31cb3e0d3562b5030e6e8221e790f3078e96950e) Thanks [@hzblj](https://github.com/hzblj)! - Android catches up with iOS:
|
|
8
|
+
|
|
9
|
+
- Every ripple on Android takes the new `fill.ripple` token, Compose controls and pressables alike, instead of each control's content colour. Override it in your theme like any colour.
|
|
10
|
+
- `useHeaderSearch({placement: 'integratedButton'})` is the toolbar's own search on Android too: a magnifier in the bar's corner that expands over the title, with the microphone in the field. Pass `searchBar` to `useHeader` on both platforms.
|
|
11
|
+
- `NavigationBar` and `Sheet.Header` take `search` on Android: a field in a row under the bar, or a search item that grows into the field over the bar and closes once the field is cancelled, cleared or left empty.
|
|
12
|
+
- `NavigationItemSearch` has an Android side, `TopAppBar` a `Search` slot with `searchActive`, and `SearchField` an `autoFocus`.
|
|
13
|
+
- A `TopAppBar` that loses its leading or trailing items drops them instead of keeping the last ones.
|
|
14
|
+
|
|
15
|
+
### Patch Changes
|
|
16
|
+
|
|
17
|
+
- [#92](https://github.com/hzblj/kara-ui/pull/92) [`4eb4fff`](https://github.com/hzblj/kara-ui/commit/4eb4fffea8122e7391ddf2d3b9a58c3f55533c5e) Thanks [@hzblj](https://github.com/hzblj)! - `Sheet`'s grabber on Android follows the app's theme: Material's handle colour at 40 %, light under an `inverted` header. It used to follow the phone's dark mode, so a light app on a dark phone drew a white grabber on a white sheet. A `Sheet.Header` without a bar starts below the grabber instead of under it.
|
|
18
|
+
|
|
19
|
+
- Updated dependencies [[`31cb3e0`](https://github.com/hzblj/kara-ui/commit/31cb3e0d3562b5030e6e8221e790f3078e96950e)]:
|
|
20
|
+
- @hzblj/kara-theme@0.27.0
|
|
21
|
+
- @hzblj/kara-native@0.27.0
|
|
22
|
+
- @hzblj/kara-sx@0.27.0
|
|
23
|
+
|
|
24
|
+
## 0.26.2
|
|
25
|
+
|
|
26
|
+
### Patch Changes
|
|
27
|
+
|
|
28
|
+
- Updated dependencies [[`a42700c`](https://github.com/hzblj/kara-ui/commit/a42700c6897c9102f24faa52ef5117516f021cc6)]:
|
|
29
|
+
- @hzblj/kara-native@0.26.2
|
|
30
|
+
- @hzblj/kara-theme@0.26.2
|
|
31
|
+
- @hzblj/kara-sx@0.26.2
|
|
32
|
+
|
|
3
33
|
## 0.26.1
|
|
4
34
|
|
|
5
35
|
### Patch Changes
|
|
@@ -1,11 +1,12 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
import {
|
|
3
|
+
import { LoadingIndicator } from '@expo/ui/jetpack-compose';
|
|
4
4
|
import { fillMaxSize, size as sizeModifier, testID as testIdModifier } from '@expo/ui/jetpack-compose/modifiers';
|
|
5
5
|
import { useAccessibilityModifiers } from '@hzblj/kara-sx';
|
|
6
6
|
import { useAppTheme } from '@hzblj/kara-theme';
|
|
7
7
|
import { useMemo } from 'react';
|
|
8
8
|
import { StyleSheet } from 'react-native';
|
|
9
|
+
import { ComposeHost } from "../../hooks/compose-host.js";
|
|
9
10
|
import { useInsideHost } from "../../hooks/host-context.js";
|
|
10
11
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
11
12
|
/** Material's 48dp for a screen; half of it in a row, about where React Native's small spinner sat. */
|
|
@@ -44,9 +45,7 @@ export const ActivityIndicator = ({
|
|
|
44
45
|
if (insideHost) {
|
|
45
46
|
return indicator;
|
|
46
47
|
}
|
|
47
|
-
return /*#__PURE__*/_jsx(
|
|
48
|
-
colorScheme: theme.dark ? 'dark' : 'light',
|
|
49
|
-
seedColor: theme.materialSeed,
|
|
48
|
+
return /*#__PURE__*/_jsx(ComposeHost, {
|
|
50
49
|
style: styles[size],
|
|
51
50
|
children: indicator
|
|
52
51
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["
|
|
1
|
+
{"version":3,"names":["LoadingIndicator","fillMaxSize","size","sizeModifier","testID","testIdModifier","useAccessibilityModifiers","useAppTheme","useMemo","StyleSheet","ComposeHost","useInsideHost","jsx","_jsx","styles","create","large","height","width","small","ActivityIndicator","accessibilityLabel","color","theme","insideHost","accessibilityModifiers","modifiers","indicator","style","children"],"sourceRoot":"../../../../src","sources":["atoms/activity-indicator/activity-indicator.android.tsx"],"mappings":";;AAAA,SAAQA,gBAAgB,QAAO,0BAA0B;AACzD,SAAQC,WAAW,EAAEC,IAAI,IAAIC,YAAY,EAAEC,MAAM,IAAIC,cAAc,QAAO,oCAAoC;AAC9G,SAAQC,yBAAyB,QAAO,gBAAgB;AACxD,SAAQC,WAAW,QAAO,mBAAmB;AAC7C,SAAQC,OAAO,QAAO,OAAO;AAC7B,SAAQC,UAAU,QAAO,cAAc;AAEvC,SAAQC,WAAW,QAAO,6BAA0B;AACpD,SAAQC,aAAa,QAAO,6BAA0B;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAGtD;AACA,MAAMC,MAAM,GAAGL,UAAU,CAACM,MAAM,CAAC;EAC/BC,KAAK,EAAE;IAACC,MAAM,EAAE,EAAE;IAAEC,KAAK,EAAE;EAAE,CAAC;EAC9BC,KAAK,EAAE;IAACF,MAAM,EAAE,EAAE;IAAEC,KAAK,EAAE;EAAE;AAC/B,CAAC,CAAC;;AAEF;AACA;AACA;AACA;AACA;AACA,OAAO,MAAME,iBAA6C,GAAGA,CAAC;EAC5DC,kBAAkB;EAClBC,KAAK,GAAG,qBAAqB;EAC7BpB,IAAI,GAAG,OAAO;EACdE;AACsB,CAAC,KAAK;EAC5B,MAAMmB,KAAK,GAAGhB,WAAW,CAAC,CAAC;EAC3B,MAAMiB,UAAU,GAAGb,aAAa,CAAC,CAAC;EAClC,MAAMc,sBAAsB,GAAGnB,yBAAyB,CAAC;IAACe;EAAkB,CAAC,CAAC;EAC9E,MAAMK,SAAS,GAAGlB,OAAO,CACvB,MAAM,CACJgB,UAAU,GAAGrB,YAAY,CAACW,MAAM,CAACZ,IAAI,CAAC,CAACgB,KAAK,EAAEJ,MAAM,CAACZ,IAAI,CAAC,CAACe,MAAM,CAAC,GAAGhB,WAAW,CAAC,CAAC,EAClF,IAAIG,MAAM,GAAG,CAACC,cAAc,CAACD,MAAM,CAAC,CAAC,GAAG,EAAE,CAAC,EAC3C,GAAGqB,sBAAsB,CAC1B,EACD,CAACA,sBAAsB,EAAED,UAAU,EAAEtB,IAAI,EAAEE,MAAM,CACnD,CAAC;EAED,MAAMuB,SAAS,gBAAGd,IAAA,CAACb,gBAAgB;IAACsB,KAAK,EAAEC,KAAK,CAACD,KAAK,CAACA,KAAK,CAAE;IAACI,SAAS,EAAEA;EAAU,CAAE,CAAC;EAEvF,IAAIF,UAAU,EAAE;IACd,OAAOG,SAAS;EAClB;EAEA,oBAAOd,IAAA,CAACH,WAAW;IAACkB,KAAK,EAAEd,MAAM,CAACZ,IAAI,CAAE;IAAA2B,QAAA,EAAEF;EAAS,CAAc,CAAC;AACpE,CAAC","ignoreList":[]}
|
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
import { DateTimePicker } from '@expo/ui/community/datetime-picker';
|
|
4
|
-
import { DateTimePicker as ComposeDateTimePicker,
|
|
4
|
+
import { DateTimePicker as ComposeDateTimePicker, RNHostView } from '@expo/ui/jetpack-compose';
|
|
5
5
|
import { alpha, testID as testIdModifier } from '@expo/ui/jetpack-compose/modifiers';
|
|
6
6
|
import { opacity, useAppTheme } from '@hzblj/kara-theme';
|
|
7
7
|
import { useCallback, useMemo, useState } from 'react';
|
|
8
|
+
import { ComposeHost } from "../../hooks/compose-host.js";
|
|
8
9
|
import { useInsideHost } from "../../hooks/host-context.js";
|
|
9
10
|
import { Box } from "../box/index.js";
|
|
10
11
|
import { Pressable } from "../pressable/index.js";
|
|
@@ -116,10 +117,8 @@ export const DatePicker = props => {
|
|
|
116
117
|
...props,
|
|
117
118
|
disabled: disabled
|
|
118
119
|
});
|
|
119
|
-
return insideHost ? calendar : /*#__PURE__*/_jsx(
|
|
120
|
-
colorScheme: theme.dark ? 'dark' : 'light',
|
|
120
|
+
return insideHost ? calendar : /*#__PURE__*/_jsx(ComposeHost, {
|
|
121
121
|
matchContents: MATCH_HEIGHT_ONLY,
|
|
122
|
-
seedColor: theme.materialSeed,
|
|
123
122
|
children: calendar
|
|
124
123
|
});
|
|
125
124
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["DateTimePicker","ComposeDateTimePicker","
|
|
1
|
+
{"version":3,"names":["DateTimePicker","ComposeDateTimePicker","RNHostView","alpha","testID","testIdModifier","opacity","useAppTheme","useCallback","useMemo","useState","ComposeHost","useInsideHost","Box","Pressable","RnText","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","MATCH_HEIGHT_ONLY","horizontal","vertical","formatted","value","mode","toLocaleTimeString","undefined","hour","minute","date","toLocaleDateString","day","month","year","utcDayOf","Date","UTC","getFullYear","getMonth","getDate","toISOString","localDayOf","utcDay","next","setFullYear","getUTCFullYear","getUTCMonth","getUTCDate","Calendar","disabled","max","min","onValueChange","theme","onDateSelected","getTime","modifiers","o40","color","displayedComponents","initialDate","selectableDates","end","start","showHeadline","showTitle","showVariantToggle","variant","DatePicker","props","datePickerStyle","insideHost","open","setOpen","show","hide","onChange","_event","calendar","matchContents","children","field","alignSelf","bg","borderRadius","onPress","px","py","accentColor","colorString","maximumDate","minimumDate","onDismiss","presentation"],"sourceRoot":"../../../../src","sources":["atoms/date-picker/date-picker.android.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -1,8 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
import { Host } from '@expo/ui/jetpack-compose';
|
|
4
3
|
import { useSx } from '@hzblj/kara-sx';
|
|
5
|
-
import {
|
|
4
|
+
import { ComposeHost } from "../../hooks/compose-host.js";
|
|
6
5
|
import { HostBoundary } from "../../hooks/host-context.js";
|
|
7
6
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
8
7
|
const MATCH_HEIGHT_ONLY = {
|
|
@@ -21,13 +20,10 @@ export const Island = ({
|
|
|
21
20
|
testID: _testID,
|
|
22
21
|
...sx
|
|
23
22
|
}) => {
|
|
24
|
-
const theme = useAppTheme();
|
|
25
23
|
const resolved = useSx(sx);
|
|
26
|
-
return /*#__PURE__*/_jsx(
|
|
27
|
-
colorScheme: theme.dark ? 'dark' : 'light',
|
|
24
|
+
return /*#__PURE__*/_jsx(ComposeHost, {
|
|
28
25
|
ignoreSafeAreaKeyboardInsets: ignoreSafeArea === 'all' || ignoreSafeArea === 'keyboard',
|
|
29
26
|
matchContents: matchContents ? MATCH_HEIGHT_ONLY : MATCH_NEITHER,
|
|
30
|
-
seedColor: theme.materialSeed,
|
|
31
27
|
style: style ? [resolved, style] : resolved,
|
|
32
28
|
children: /*#__PURE__*/_jsx(HostBoundary, {
|
|
33
29
|
children: children
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["
|
|
1
|
+
{"version":3,"names":["useSx","ComposeHost","HostBoundary","jsx","_jsx","MATCH_HEIGHT_ONLY","horizontal","vertical","MATCH_NEITHER","Island","children","ignoreSafeArea","matchContents","style","testID","_testID","sx","resolved","ignoreSafeAreaKeyboardInsets"],"sourceRoot":"../../../../src","sources":["atoms/island/island.android.tsx"],"mappings":";;AAAA,SAAQA,KAAK,QAAO,gBAAgB;AAEpC,SAAQC,WAAW,QAAO,6BAA0B;AACpD,SAAQC,YAAY,QAAO,6BAA0B;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAGrD,MAAMC,iBAAiB,GAAG;EAACC,UAAU,EAAE,KAAK;EAAEC,QAAQ,EAAE;AAAI,CAAC;AAE7D,MAAMC,aAAa,GAAG;EAACF,UAAU,EAAE,KAAK;EAAEC,QAAQ,EAAE;AAAK,CAAC;AAE1D,OAAO,MAAME,MAAuB,GAAGA,CAAC;EACtCC,QAAQ;EACRC,cAAc,GAAG,UAAU;EAC3BC,aAAa,GAAG,IAAI;EACpBC,KAAK;EACLC,MAAM,EAAEC,OAAO;EACf,GAAGC;AACQ,CAAC,KAAK;EACjB,MAAMC,QAAQ,GAAGjB,KAAK,CAACgB,EAAE,CAAC;EAE1B,oBACEZ,IAAA,CAACH,WAAW;IACViB,4BAA4B,EAAEP,cAAc,KAAK,KAAK,IAAIA,cAAc,KAAK,UAAW;IACxFC,aAAa,EAAEA,aAAa,GAAGP,iBAAiB,GAAGG,aAAc;IACjEK,KAAK,EAAEA,KAAK,GAAG,CAACI,QAAQ,EAAEJ,KAAK,CAAC,GAAGI,QAAS;IAAAP,QAAA,eAE5CN,IAAA,CAACF,YAAY;MAAAQ,QAAA,EAAEA;IAAQ,CAAe;EAAC,CAC5B,CAAC;AAElB,CAAC","ignoreList":[]}
|
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
import { Text as ComposeText, DropdownMenuItem, ExposedDropdownMenu, ExposedDropdownMenuBox,
|
|
3
|
+
import { Text as ComposeText, DropdownMenuItem, ExposedDropdownMenu, ExposedDropdownMenuBox, OutlinedTextField, useNativeState } from '@expo/ui/jetpack-compose';
|
|
4
4
|
import { fillMaxWidth, menuAnchor, testID as testIdModifier } from '@expo/ui/jetpack-compose/modifiers';
|
|
5
5
|
import { useAppTheme } from '@hzblj/kara-theme';
|
|
6
6
|
import { useEffect, useMemo, useState } from 'react';
|
|
7
|
+
import { ComposeHost } from "../../hooks/compose-host.js";
|
|
7
8
|
import { HostBoundary, useInsideHost } from "../../hooks/host-context.js";
|
|
8
9
|
import { Glyph } from "../glyph/index.js";
|
|
9
10
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
@@ -82,10 +83,8 @@ export const Picker = ({
|
|
|
82
83
|
if (insideHost) {
|
|
83
84
|
return menu;
|
|
84
85
|
}
|
|
85
|
-
return /*#__PURE__*/_jsx(
|
|
86
|
-
colorScheme: theme.dark ? 'dark' : 'light',
|
|
86
|
+
return /*#__PURE__*/_jsx(ComposeHost, {
|
|
87
87
|
matchContents: MATCH_HEIGHT_ONLY,
|
|
88
|
-
seedColor: theme.materialSeed,
|
|
89
88
|
children: /*#__PURE__*/_jsx(HostBoundary, {
|
|
90
89
|
children: menu
|
|
91
90
|
})
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["Text","ComposeText","DropdownMenuItem","ExposedDropdownMenu","ExposedDropdownMenuBox","
|
|
1
|
+
{"version":3,"names":["Text","ComposeText","DropdownMenuItem","ExposedDropdownMenu","ExposedDropdownMenuBox","OutlinedTextField","useNativeState","fillMaxWidth","menuAnchor","testID","testIdModifier","useAppTheme","useEffect","useMemo","useState","ComposeHost","HostBoundary","useInsideHost","Glyph","jsx","_jsx","jsxs","_jsxs","MATCH_HEIGHT_ONLY","horizontal","vertical","Picker","disabled","onValueChange","options","value","theme","insideHost","expanded","setExpanded","selectedLabel","find","option","label","fieldModifiers","list","set","menu","onExpandedChange","undefined","children","enabled","modifiers","readOnly","singleLine","textStyle","color","colorString","fontFamily","typography","body","fontWeight","TrailingIcon","name","size","containerColor","onDismissRequest","map","onClick","style","matchContents"],"sourceRoot":"../../../../src","sources":["atoms/picker/picker.android.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
import { haptics } from '@hzblj/expo-rich-haptics';
|
|
4
4
|
import { accessibilityProps, markMotionComponent, splitAccessibility, spring, timing, useSplitSxMotion } from '@hzblj/kara-sx';
|
|
5
|
-
import { opacity, springs, useAppTheme, useReducedMotion
|
|
5
|
+
import { opacity, springs, useAppTheme, useReducedMotion } from '@hzblj/kara-theme';
|
|
6
6
|
import { useCallback, useMemo } from 'react';
|
|
7
7
|
import { Platform, Pressable as RNPressable } from 'react-native';
|
|
8
8
|
import Animated, { useAnimatedStyle, useSharedValue, withSpring, withTiming } from 'react-native-reanimated';
|
|
@@ -94,10 +94,11 @@ export const Pressable = markMotionComponent(({
|
|
|
94
94
|
} : {};
|
|
95
95
|
}, [dimmed, effect, pressedScale]);
|
|
96
96
|
|
|
97
|
-
// Android's press is Material's: a ripple over the content
|
|
98
|
-
// the shape by an outer view (`splitForRipple`). The effect, when there is one,
|
|
97
|
+
// Android's press is Material's: a ripple over the content in the theme's `fill.ripple`, the colour every Compose
|
|
98
|
+
// control ripples in too, clipped to the shape by an outer view (`splitForRipple`). The effect, when there is one,
|
|
99
|
+
// moves that outer view, ripple and all.
|
|
99
100
|
const ripple = useMemo(() => isAndroid && withRipple ? {
|
|
100
|
-
color:
|
|
101
|
+
color: theme.color('fill.ripple'),
|
|
101
102
|
foreground: true
|
|
102
103
|
} : undefined, [isAndroid, theme, withRipple]);
|
|
103
104
|
const androidStyle = useMemo(() => isAndroid ? splitForRipple(resolved) : undefined, [isAndroid, resolved]);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["haptics","accessibilityProps","markMotionComponent","splitAccessibility","spring","timing","useSplitSxMotion","opacity","springs","useAppTheme","useReducedMotion","
|
|
1
|
+
{"version":3,"names":["haptics","accessibilityProps","markMotionComponent","splitAccessibility","spring","timing","useSplitSxMotion","opacity","springs","useAppTheme","useReducedMotion","useCallback","useMemo","Platform","Pressable","RNPressable","Animated","useAnimatedStyle","useSharedValue","withSpring","withTiming","splitForRipple","jsx","_jsx","SCALE_IN","SCALE_OUT","DIM_IN","DIM_OUT","PLATFORM_EFFECT","OS","AnimatedPressable","createAnimatedComponent","VISUAL_KEYS","TRANSFORM_KEYS","Set","withoutTransform","animate","undefined","keys","duration","filter","key","has","children","disabled","haptic","onPress","pressEffect","pressedOpacity","pressedScale","ripple","withRipple","testID","props","accessibility","ownProps","reduced","effect","resolved","motion","rest","pressed","feedback","a11y","dimmed","theme","isAndroid","rStyle","transform","scale","value","color","foreground","androidStyle","onPressIn","prepare","onPressOut","onPressWithHaptic","play","View","entering","exiting","layout","style","outer","android_ripple","hitSlop","inner"],"sourceRoot":"../../../../src","sources":["atoms/pressable/pressable.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -1,12 +1,13 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
import {
|
|
3
|
+
import { SegmentedButton, SingleChoiceSegmentedButtonRow, Text } from '@expo/ui/jetpack-compose';
|
|
4
4
|
import { fillMaxWidth, height, testID as testIdModifier, weight } from '@expo/ui/jetpack-compose/modifiers';
|
|
5
5
|
import { iconResourceName } from '@hzblj/expo-native-icons';
|
|
6
6
|
import { haptics } from '@hzblj/expo-rich-haptics';
|
|
7
7
|
import { DrawableIcon, NativeImage } from '@hzblj/kara-native/jetpack-compose';
|
|
8
8
|
import { spacing as spacingTokens, useAppTheme } from '@hzblj/kara-theme';
|
|
9
9
|
import { useCallback, useMemo } from 'react';
|
|
10
|
+
import { ComposeHost } from "../../hooks/compose-host.js";
|
|
10
11
|
import { useInsideHost } from "../../hooks/host-context.js";
|
|
11
12
|
import { HStack } from "../h-stack/index.js";
|
|
12
13
|
import { imageUri, segmentOf } from "./segments.js";
|
|
@@ -133,10 +134,8 @@ export const SegmentedControl = ({
|
|
|
133
134
|
if (insideHost) {
|
|
134
135
|
return row;
|
|
135
136
|
}
|
|
136
|
-
return /*#__PURE__*/_jsx(
|
|
137
|
-
colorScheme: theme.dark ? 'dark' : 'light',
|
|
137
|
+
return /*#__PURE__*/_jsx(ComposeHost, {
|
|
138
138
|
matchContents: MATCH_HEIGHT_ONLY,
|
|
139
|
-
seedColor: theme.materialSeed,
|
|
140
139
|
children: row
|
|
141
140
|
});
|
|
142
141
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["
|
|
1
|
+
{"version":3,"names":["SegmentedButton","SingleChoiceSegmentedButtonRow","Text","fillMaxWidth","height","testID","testIdModifier","weight","iconResourceName","haptics","DrawableIcon","NativeImage","spacing","spacingTokens","useAppTheme","useCallback","useMemo","ComposeHost","useInsideHost","HStack","imageUri","segmentOf","jsx","_jsx","jsxs","_jsxs","MATCH_HEIGHT_ONLY","horizontal","vertical","MATERIAL_HEIGHT","SegmentLabel","iconSize","segment","variant","theme","face","typography","image","undefined","fontFamily","fontSize","fontWeight","String","imageHeight","label","source","style","children","icon","align","resourceName","SegmentedControl","bg","disabled","onChange","selectedIndex","values","insideHost","segments","map","iconPoints","segmentModifiers","content","Math","max","lineHeight","colors","activeBorderColor","color","activeContainerColor","activeContentColor","disabledActiveBorderColor","disabledActiveContainerColor","disabledActiveContentColor","disabledInactiveBorderColor","disabledInactiveContentColor","inactiveBorderColor","inactiveContainerColor","inactiveContentColor","rowModifiers","select","index","selection","row","modifiers","enabled","onClick","selected","Label","matchContents"],"sourceRoot":"../../../../src","sources":["atoms/segmented-control/segmented-control.android.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import { Host } from '@expo/ui/jetpack-compose';
|
|
4
|
+
import { RippleConfiguration } from '@hzblj/kara-native/jetpack-compose';
|
|
5
|
+
import { useAppTheme } from '@hzblj/kara-theme';
|
|
6
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
7
|
+
/**
|
|
8
|
+
* Every Compose tree kara draws on Android: the theme's appearance and Material seed, and `fill.ripple` as the ripple of
|
|
9
|
+
* every Material control inside, so a press looks the same on a button, a chip and a list row. Import it only from
|
|
10
|
+
* `.android` files.
|
|
11
|
+
*/
|
|
12
|
+
export const ComposeHost = ({
|
|
13
|
+
children,
|
|
14
|
+
...props
|
|
15
|
+
}) => {
|
|
16
|
+
const theme = useAppTheme();
|
|
17
|
+
return /*#__PURE__*/_jsx(Host, {
|
|
18
|
+
colorScheme: theme.dark ? 'dark' : 'light',
|
|
19
|
+
seedColor: theme.materialSeed,
|
|
20
|
+
...props,
|
|
21
|
+
children: /*#__PURE__*/_jsx(RippleConfiguration, {
|
|
22
|
+
color: theme.color('fill.ripple'),
|
|
23
|
+
children: children
|
|
24
|
+
})
|
|
25
|
+
});
|
|
26
|
+
};
|
|
27
|
+
//# sourceMappingURL=compose-host.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["Host","RippleConfiguration","useAppTheme","jsx","_jsx","ComposeHost","children","props","theme","colorScheme","dark","seedColor","materialSeed","color"],"sourceRoot":"../../../src","sources":["hooks/compose-host.tsx"],"mappings":";;AAAA,SAAQA,IAAI,QAAuB,0BAA0B;AAC7D,SAAQC,mBAAmB,QAAO,oCAAoC;AACtE,SAAQC,WAAW,QAAO,mBAAmB;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAI7C;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMC,WAAW,GAAGA,CAAC;EAACC,QAAQ;EAAE,GAAGC;AAAuB,CAAC,KAAK;EACrE,MAAMC,KAAK,GAAGN,WAAW,CAAC,CAAC;EAE3B,oBACEE,IAAA,CAACJ,IAAI;IAACS,WAAW,EAAED,KAAK,CAACE,IAAI,GAAG,MAAM,GAAG,OAAQ;IAACC,SAAS,EAAEH,KAAK,CAACI,YAAa;IAAA,GAAKL,KAAK;IAAAD,QAAA,eACxFF,IAAA,CAACH,mBAAmB;MAACY,KAAK,EAAEL,KAAK,CAACK,KAAK,CAAC,aAAa,CAAE;MAAAP,QAAA,EAAEA;IAAQ,CAAsB;EAAC,CACpF,CAAC;AAEX,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,80 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import { iconResourceName } from '@hzblj/expo-native-icons';
|
|
4
|
+
import { SearchField } from '@hzblj/kara-native/jetpack-compose';
|
|
5
|
+
import { useAppTheme } from '@hzblj/kara-theme';
|
|
6
|
+
import { useMemo } from 'react';
|
|
7
|
+
import { StyleSheet, View } from 'react-native';
|
|
8
|
+
import { ComposeHost } from "../../hooks/compose-host.js";
|
|
9
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
10
|
+
/** Material's search field is 56dp; a row adds 8dp above it and 12dp below, under a top app bar. */
|
|
11
|
+
const FIELD_HEIGHT = 56;
|
|
12
|
+
|
|
13
|
+
/** A search row's height under a bar, for what is laid out below it. */
|
|
14
|
+
export const BAR_SEARCH_ROW_HEIGHT = 8 + FIELD_HEIGHT + 12;
|
|
15
|
+
const styles = StyleSheet.create({
|
|
16
|
+
field: {
|
|
17
|
+
height: FIELD_HEIGHT
|
|
18
|
+
},
|
|
19
|
+
row: {
|
|
20
|
+
paddingBottom: 12,
|
|
21
|
+
paddingHorizontal: 16,
|
|
22
|
+
paddingTop: 8
|
|
23
|
+
}
|
|
24
|
+
});
|
|
25
|
+
/**
|
|
26
|
+
* The search field kara draws on Android, in a header row or inside a bar: Material's input field in the theme's
|
|
27
|
+
* colours and body face, with the app's icons and the voice. A Compose view, so the caller brings the host. Import it
|
|
28
|
+
* only from `.android` files.
|
|
29
|
+
*/
|
|
30
|
+
export const BarSearchField = ({
|
|
31
|
+
autoFocus,
|
|
32
|
+
cancelLabel = 'Cancel',
|
|
33
|
+
clearIcon,
|
|
34
|
+
onChangeText,
|
|
35
|
+
onFocusChange,
|
|
36
|
+
placeholder,
|
|
37
|
+
ref,
|
|
38
|
+
testID,
|
|
39
|
+
voice
|
|
40
|
+
}) => {
|
|
41
|
+
const theme = useAppTheme();
|
|
42
|
+
const face = theme.typography.body;
|
|
43
|
+
const nativeVoice = useMemo(() => voice && {
|
|
44
|
+
...voice,
|
|
45
|
+
microphoneIconName: voice.microphoneIcon ? iconResourceName(voice.microphoneIcon) : undefined,
|
|
46
|
+
stopIconName: voice.stopIcon ? iconResourceName(voice.stopIcon) : undefined
|
|
47
|
+
}, [voice]);
|
|
48
|
+
const fieldClearIcon = voice?.clearIcon ?? clearIcon;
|
|
49
|
+
return /*#__PURE__*/_jsx(SearchField, {
|
|
50
|
+
autoFocus: autoFocus,
|
|
51
|
+
cancelLabel: cancelLabel,
|
|
52
|
+
clearIconName: fieldClearIcon ? iconResourceName(fieldClearIcon) : undefined,
|
|
53
|
+
clearLabel: voice?.clearLabel ?? 'Clear',
|
|
54
|
+
containerColor: theme.color('fill.quaternary'),
|
|
55
|
+
fontFamily: face.fontFamily,
|
|
56
|
+
fontSize: face.fontSize,
|
|
57
|
+
iconColor: theme.color('content.secondary'),
|
|
58
|
+
onFocusChange: onFocusChange,
|
|
59
|
+
onQueryChange: onChangeText,
|
|
60
|
+
placeholder: placeholder,
|
|
61
|
+
placeholderColor: theme.color('content.tertiary'),
|
|
62
|
+
ref: ref,
|
|
63
|
+
testID: testID,
|
|
64
|
+
textColor: theme.color('content.primary'),
|
|
65
|
+
voice: nativeVoice
|
|
66
|
+
});
|
|
67
|
+
};
|
|
68
|
+
|
|
69
|
+
/** A search field's own row under a bar, in its own host. */
|
|
70
|
+
export const BarSearchRow = ({
|
|
71
|
+
children
|
|
72
|
+
}) => /*#__PURE__*/_jsx(View, {
|
|
73
|
+
style: styles.row,
|
|
74
|
+
children: /*#__PURE__*/_jsx(ComposeHost, {
|
|
75
|
+
ignoreSafeAreaKeyboardInsets: true,
|
|
76
|
+
style: styles.field,
|
|
77
|
+
children: children
|
|
78
|
+
})
|
|
79
|
+
});
|
|
80
|
+
//# sourceMappingURL=bar-search-field.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["iconResourceName","SearchField","useAppTheme","useMemo","StyleSheet","View","ComposeHost","jsx","_jsx","FIELD_HEIGHT","BAR_SEARCH_ROW_HEIGHT","styles","create","field","height","row","paddingBottom","paddingHorizontal","paddingTop","BarSearchField","autoFocus","cancelLabel","clearIcon","onChangeText","onFocusChange","placeholder","ref","testID","voice","theme","face","typography","body","nativeVoice","microphoneIconName","microphoneIcon","undefined","stopIconName","stopIcon","fieldClearIcon","clearIconName","clearLabel","containerColor","color","fontFamily","fontSize","iconColor","onQueryChange","placeholderColor","textColor","BarSearchRow","children","style","ignoreSafeAreaKeyboardInsets"],"sourceRoot":"../../../../src","sources":["molecules/navigation-bar/bar-search-field.tsx"],"mappings":";;AAAA,SAAQA,gBAAgB,QAAO,0BAA0B;AACzD,SAAQC,WAAW,QAA4B,oCAAoC;AACnF,SAAQC,WAAW,QAAO,mBAAmB;AAC7C,SAAkCC,OAAO,QAAO,OAAO;AACvD,SAAQC,UAAU,EAAEC,IAAI,QAAO,cAAc;AAE7C,SAAQC,WAAW,QAAO,6BAA0B;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAGpD;AACA,MAAMC,YAAY,GAAG,EAAE;;AAEvB;AACA,OAAO,MAAMC,qBAAqB,GAAG,CAAC,GAAGD,YAAY,GAAG,EAAE;AAE1D,MAAME,MAAM,GAAGP,UAAU,CAACQ,MAAM,CAAC;EAC/BC,KAAK,EAAE;IAACC,MAAM,EAAEL;EAAY,CAAC;EAC7BM,GAAG,EAAE;IAACC,aAAa,EAAE,EAAE;IAAEC,iBAAiB,EAAE,EAAE;IAAEC,UAAU,EAAE;EAAC;AAC/D,CAAC,CAAC;AAgBF;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMC,cAAc,GAAGA,CAAC;EAC7BC,SAAS;EACTC,WAAW,GAAG,QAAQ;EACtBC,SAAS;EACTC,YAAY;EACZC,aAAa;EACbC,WAAW;EACXC,GAAG;EACHC,MAAM;EACNC;AACmB,CAAC,KAAK;EACzB,MAAMC,KAAK,GAAG3B,WAAW,CAAC,CAAC;EAC3B,MAAM4B,IAAI,GAAGD,KAAK,CAACE,UAAU,CAACC,IAAI;EAElC,MAAMC,WAAW,GAAG9B,OAAO,CACzB,MACEyB,KAAK,IAAI;IACP,GAAGA,KAAK;IACRM,kBAAkB,EAAEN,KAAK,CAACO,cAAc,GAAGnC,gBAAgB,CAAC4B,KAAK,CAACO,cAAc,CAAC,GAAGC,SAAS;IAC7FC,YAAY,EAAET,KAAK,CAACU,QAAQ,GAAGtC,gBAAgB,CAAC4B,KAAK,CAACU,QAAQ,CAAC,GAAGF;EACpE,CAAC,EACH,CAACR,KAAK,CACR,CAAC;EACD,MAAMW,cAAc,GAAGX,KAAK,EAAEN,SAAS,IAAIA,SAAS;EAEpD,oBACEd,IAAA,CAACP,WAAW;IACVmB,SAAS,EAAEA,SAAU;IACrBC,WAAW,EAAEA,WAAY;IACzBmB,aAAa,EAAED,cAAc,GAAGvC,gBAAgB,CAACuC,cAAc,CAAC,GAAGH,SAAU;IAC7EK,UAAU,EAAEb,KAAK,EAAEa,UAAU,IAAI,OAAQ;IACzCC,cAAc,EAAEb,KAAK,CAACc,KAAK,CAAC,iBAAiB,CAAE;IAC/CC,UAAU,EAAEd,IAAI,CAACc,UAAW;IAC5BC,QAAQ,EAAEf,IAAI,CAACe,QAAS;IACxBC,SAAS,EAAEjB,KAAK,CAACc,KAAK,CAAC,mBAAmB,CAAE;IAC5CnB,aAAa,EAAEA,aAAc;IAC7BuB,aAAa,EAAExB,YAAa;IAC5BE,WAAW,EAAEA,WAAY;IACzBuB,gBAAgB,EAAEnB,KAAK,CAACc,KAAK,CAAC,kBAAkB,CAAE;IAClDjB,GAAG,EAAEA,GAAI;IACTC,MAAM,EAAEA,MAAO;IACfsB,SAAS,EAAEpB,KAAK,CAACc,KAAK,CAAC,iBAAiB,CAAE;IAC1Cf,KAAK,EAAEK;EAAY,CACpB,CAAC;AAEN,CAAC;;AAED;AACA,OAAO,MAAMiB,YAAY,GAAGA,CAAC;EAACC;AAA+B,CAAC,kBAC5D3C,IAAA,CAACH,IAAI;EAAC+C,KAAK,EAAEzC,MAAM,CAACI,GAAI;EAAAoC,QAAA,eACtB3C,IAAA,CAACF,WAAW;IAAC+C,4BAA4B;IAACD,KAAK,EAAEzC,MAAM,CAACE,KAAM;IAAAsC,QAAA,EAC3DA;EAAQ,CACE;AAAC,CACV,CACP","ignoreList":[]}
|
|
@@ -1,17 +1,22 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
import { iconResourceName } from '@hzblj/expo-native-icons';
|
|
4
|
+
import { GLYPHS } from '@hzblj/kara-native';
|
|
4
5
|
import { TopAppBar } from '@hzblj/kara-native/jetpack-compose';
|
|
5
6
|
import { useAppTheme } from '@hzblj/kara-theme';
|
|
6
|
-
import { useMemo } from 'react';
|
|
7
|
+
import { useCallback, useImperativeHandle, useMemo, useRef, useState } from 'react';
|
|
7
8
|
import { Island } from "../../atoms/island/index.js";
|
|
8
|
-
import {
|
|
9
|
+
import { BarSearchField, BarSearchRow } from "./bar-search-field.js";
|
|
10
|
+
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
9
11
|
/** Material's small top app bar. */
|
|
10
12
|
const BAR_HEIGHT = 64;
|
|
11
13
|
const DEFAULT_LABELS = {
|
|
12
14
|
back: 'Back',
|
|
13
|
-
close: 'Close'
|
|
15
|
+
close: 'Close',
|
|
16
|
+
search: 'Search'
|
|
14
17
|
};
|
|
18
|
+
const NO_ITEMS = [];
|
|
19
|
+
const ignoreDetachedView = () => undefined;
|
|
15
20
|
const toNativeItem = ({
|
|
16
21
|
onPress,
|
|
17
22
|
testID,
|
|
@@ -29,10 +34,15 @@ const toNativeItem = ({
|
|
|
29
34
|
type: item.type
|
|
30
35
|
};
|
|
31
36
|
|
|
32
|
-
/**
|
|
37
|
+
/**
|
|
38
|
+
* Material's top app bar in its own host. `search` is a field in a row under the bar (`stacked`), or a search item
|
|
39
|
+
* that grows into the field over the bar (`integratedButton`) and collapses back once the field is cancelled, cleared
|
|
40
|
+
* or left empty. `separated` has no Material counterpart.
|
|
41
|
+
*/
|
|
33
42
|
export const NavigationBar = ({
|
|
34
43
|
inverted = false,
|
|
35
44
|
leadingItems,
|
|
45
|
+
search,
|
|
36
46
|
testID,
|
|
37
47
|
title,
|
|
38
48
|
titleAlignment = 'center',
|
|
@@ -42,24 +52,89 @@ export const NavigationBar = ({
|
|
|
42
52
|
const theme = useAppTheme();
|
|
43
53
|
const font = theme.typography.headline;
|
|
44
54
|
const color = theme.color(inverted ? 'content.on.accent' : 'content.primary');
|
|
45
|
-
const
|
|
46
|
-
const
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
55
|
+
const fieldRef = useRef(null);
|
|
56
|
+
const query = useRef('');
|
|
57
|
+
const echo = useRef(null);
|
|
58
|
+
const [searchActive, setSearchActive] = useState(false);
|
|
59
|
+
const integrated = search?.placement === 'integratedButton';
|
|
60
|
+
const buttonPlacement = search?.buttonPlacement ?? 'trailing';
|
|
61
|
+
const onChangeText = search?.onChangeText;
|
|
62
|
+
const onFocusChange = search?.onFocusChange;
|
|
63
|
+
const searchItem = useMemo(() => integrated ? {
|
|
64
|
+
iconName: search?.buttonIcon ? iconResourceName(search.buttonIcon) : GLYPHS.search.android,
|
|
65
|
+
label: search?.buttonLabel ?? DEFAULT_LABELS.search,
|
|
66
|
+
onPress: () => setSearchActive(true),
|
|
67
|
+
type: 'icon'
|
|
68
|
+
} : undefined, [integrated, search?.buttonIcon, search?.buttonLabel]);
|
|
69
|
+
const nativeLeadingItems = useMemo(() => {
|
|
70
|
+
const items = (leadingItems ?? NO_ITEMS).map(toNativeItem);
|
|
71
|
+
return searchItem && buttonPlacement === 'leading' ? [...items, searchItem] : items;
|
|
72
|
+
}, [buttonPlacement, leadingItems, searchItem]);
|
|
73
|
+
const nativeTrailingItems = useMemo(() => {
|
|
74
|
+
const items = (trailingItems ?? NO_ITEMS).map(toNativeItem);
|
|
75
|
+
return searchItem && buttonPlacement === 'trailing' ? [searchItem, ...items] : items;
|
|
76
|
+
}, [buttonPlacement, searchItem, trailingItems]);
|
|
77
|
+
const handleChangeText = useCallback(text => {
|
|
78
|
+
query.current = text;
|
|
79
|
+
if (echo.current === text) {
|
|
80
|
+
echo.current = null;
|
|
81
|
+
return;
|
|
82
|
+
}
|
|
83
|
+
onChangeText?.(text);
|
|
84
|
+
}, [onChangeText]);
|
|
85
|
+
const handleFocusChange = useCallback(focused => {
|
|
86
|
+
onFocusChange?.(focused);
|
|
87
|
+
if (!focused && query.current === '') {
|
|
88
|
+
setSearchActive(false);
|
|
89
|
+
}
|
|
90
|
+
}, [onFocusChange]);
|
|
91
|
+
useImperativeHandle(search?.ref, () => ({
|
|
92
|
+
clear: () => {
|
|
93
|
+
fieldRef.current?.clearQuery().catch(ignoreDetachedView);
|
|
94
|
+
fieldRef.current?.blurField().catch(ignoreDetachedView);
|
|
95
|
+
setSearchActive(false);
|
|
96
|
+
},
|
|
97
|
+
setText: text => {
|
|
98
|
+
echo.current = text;
|
|
99
|
+
query.current = text;
|
|
100
|
+
fieldRef.current?.setQuery(text).catch(ignoreDetachedView);
|
|
101
|
+
}
|
|
102
|
+
}), []);
|
|
103
|
+
const field = search ? /*#__PURE__*/_jsx(BarSearchField, {
|
|
104
|
+
autoFocus: integrated,
|
|
105
|
+
cancelLabel: search.cancelLabel,
|
|
106
|
+
clearIcon: search.clearIcon,
|
|
107
|
+
onChangeText: handleChangeText,
|
|
108
|
+
onFocusChange: handleFocusChange,
|
|
109
|
+
placeholder: search.placeholder,
|
|
110
|
+
ref: fieldRef,
|
|
111
|
+
testID: search.testID,
|
|
112
|
+
voice: search.voice
|
|
113
|
+
}) : null;
|
|
114
|
+
return /*#__PURE__*/_jsxs(_Fragment, {
|
|
115
|
+
children: [/*#__PURE__*/_jsx(Island, {
|
|
116
|
+
h: BAR_HEIGHT,
|
|
117
|
+
matchContents: false,
|
|
118
|
+
testID: testID,
|
|
119
|
+
w: "100%",
|
|
120
|
+
children: /*#__PURE__*/_jsx(TopAppBar, {
|
|
121
|
+
fontFamily: font.fontFamily,
|
|
122
|
+
fontSize: font.fontSize,
|
|
123
|
+
itemColor: color,
|
|
124
|
+
leadingItems: nativeLeadingItems,
|
|
125
|
+
searchActive: integrated && searchActive,
|
|
126
|
+
title: title,
|
|
127
|
+
titleAlignment: titleAlignment,
|
|
128
|
+
titleColor: color,
|
|
129
|
+
titleVisible: titleVisible,
|
|
130
|
+
trailingItems: nativeTrailingItems,
|
|
131
|
+
children: integrated ? /*#__PURE__*/_jsx(TopAppBar.Search, {
|
|
132
|
+
children: field
|
|
133
|
+
}) : null
|
|
134
|
+
})
|
|
135
|
+
}), search && !integrated ? /*#__PURE__*/_jsx(BarSearchRow, {
|
|
136
|
+
children: field
|
|
137
|
+
}) : null]
|
|
63
138
|
});
|
|
64
139
|
};
|
|
65
140
|
//# sourceMappingURL=navigation-bar.android.js.map
|