@multiplatform.one/forms 7.47.1 → 7.47.2
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/cjs/ContextualSaveBar/index.cjs +2 -2
- package/dist/cjs/ContextualSaveBar/index.native.js +2 -2
- package/dist/cjs/ContextualSaveBar/index.native.js.map +1 -1
- package/dist/cjs/fields/Progress/index.cjs +2 -7
- package/dist/cjs/fields/Progress/index.native.js +2 -7
- package/dist/cjs/fields/Progress/index.native.js.map +1 -1
- package/dist/cjs/shared/utils.cjs +3 -2
- package/dist/cjs/shared/utils.native.js +3 -2
- package/dist/cjs/shared/utils.native.js.map +1 -1
- package/dist/esm/ContextualSaveBar/index.mjs +2 -2
- package/dist/esm/ContextualSaveBar/index.mjs.map +1 -1
- package/dist/esm/ContextualSaveBar/index.native.js +2 -2
- package/dist/esm/ContextualSaveBar/index.native.js.map +1 -1
- package/dist/esm/fields/Progress/index.mjs +2 -7
- package/dist/esm/fields/Progress/index.mjs.map +1 -1
- package/dist/esm/fields/Progress/index.native.js +2 -7
- package/dist/esm/fields/Progress/index.native.js.map +1 -1
- package/dist/esm/shared/utils.mjs +3 -2
- package/dist/esm/shared/utils.mjs.map +1 -1
- package/dist/esm/shared/utils.native.js +3 -2
- package/dist/esm/shared/utils.native.js.map +1 -1
- package/dist/jsx/ContextualSaveBar/index.mjs +2 -2
- package/dist/jsx/ContextualSaveBar/index.mjs.map +1 -1
- package/dist/jsx/ContextualSaveBar/index.native.js +2 -2
- package/dist/jsx/ContextualSaveBar/index.native.js.map +1 -1
- package/dist/jsx/fields/Progress/index.mjs +2 -7
- package/dist/jsx/fields/Progress/index.mjs.map +1 -1
- package/dist/jsx/fields/Progress/index.native.js +2 -7
- package/dist/jsx/fields/Progress/index.native.js.map +1 -1
- package/dist/jsx/shared/utils.mjs +3 -2
- package/dist/jsx/shared/utils.mjs.map +1 -1
- package/dist/jsx/shared/utils.native.js +3 -2
- package/dist/jsx/shared/utils.native.js.map +1 -1
- package/package.json +8 -8
- package/src/ContextualSaveBar/index.tsx +6 -2
- package/src/elevationHookCount.spec.tsx +145 -0
- package/src/fields/Progress/index.tsx +6 -6
- package/src/shared/utils.ts +12 -5
- package/types/ContextualSaveBar/index.d.ts.map +1 -1
- package/types/shared/utils.d.ts +5 -0
- package/types/shared/utils.d.ts.map +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["__defProp","Object","defineProperty","__getOwnPropDesc","getOwnPropertyDescriptor","__getOwnPropNames","getOwnPropertyNames","__hasOwnProp","prototype","hasOwnProperty","__export","target","all","name","get","enumerable","__copyProps","to","from","except","desc","key","call","__toCommonJS","mod","value","utils_exports","clampRadiusForControl","clampRadiusForLargeComponent","clampRadiusInStateProps","getElevationWrapperProps","getFieldError","getFieldHeight","getOTPCellRadius","mergeFieldHandler","stripRadiusFromStateProps","useFormField","useResolvedValidators","module","exports","import_theme","require","import_react","import_theme2","import_Form","import_validateOn","_type_of","obj","Symbol","constructor","sizeToken","rows","arguments","length","touch","isTouchSurface","sizeRecipeForToken","String","height","clampRadius","radiusToken","maxTokenNum","fallback","startsWith","num","Number","parseInt","slice","OTP_RADIUS_STOPS","keys","borderRadiusMap","otpRadiusStop","_iteratorNormalCompletion","_didIteratorError","_iteratorError","_iterator","iterator","_step","next","done","stop","err","return","Error","heightPx","resolveRadiusClass","knobProps","elevationRecipe","_elevationRecipe_hoverKnobProps","_elevationRecipe_pressKnobProps","_elevationRecipe_focusVisibleKnobProps","elevation","hoverKnobProps","pressKnobProps","focusVisibleKnobProps","props","overflow","elevationChrome","hoverStyle","pressStyle","focusVisibleStyle","assign","
|
|
1
|
+
{"version":3,"names":["__defProp","Object","defineProperty","__getOwnPropDesc","getOwnPropertyDescriptor","__getOwnPropNames","getOwnPropertyNames","__hasOwnProp","prototype","hasOwnProperty","__export","target","all","name","get","enumerable","__copyProps","to","from","except","desc","key","call","__toCommonJS","mod","value","utils_exports","clampRadiusForControl","clampRadiusForLargeComponent","clampRadiusInStateProps","getElevationWrapperProps","getFieldError","getFieldHeight","getOTPCellRadius","mergeFieldHandler","stripRadiusFromStateProps","useFormField","useResolvedValidators","module","exports","import_theme","require","import_react","import_theme2","import_Form","import_validateOn","_type_of","obj","Symbol","constructor","sizeToken","rows","arguments","length","touch","isTouchSurface","sizeRecipeForToken","String","height","clampRadius","radiusToken","maxTokenNum","fallback","startsWith","num","Number","parseInt","slice","OTP_RADIUS_STOPS","keys","borderRadiusMap","otpRadiusStop","_iteratorNormalCompletion","_didIteratorError","_iteratorError","_iterator","iterator","_step","next","done","stop","err","return","Error","heightPx","resolveRadiusClass","knobProps","elevationRecipe","_elevationRecipe_hoverKnobProps","_elevationRecipe_pressKnobProps","_elevationRecipe_focusVisibleKnobProps","motion","transitionProps","control","elevation","hoverKnobProps","pressKnobProps","focusVisibleKnobProps","props","overflow","elevationChrome","hoverStyle","pressStyle","focusVisibleStyle","assign","formContext","useFormContext","resolvedForm","form","resolved","useResolvedKnobs","size","generatedId","useId","id","field","propError","fieldError","state","meta","errors","defaultIsEmpty","defaultIsEmpty2","v","required","validators","label","isEmpty","validateOn","hasSubmitted","useFormValidate","effective","resolveEffectiveValidateOn","useMemo","requiredValidator","requiredValidator2","param","onSubmit","existingOnSubmit","composedOnSubmit","_existingOnSubmit"],"sources":["../../../src/shared/utils.ts"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@multiplatform.one/forms",
|
|
3
|
-
"version": "7.47.
|
|
3
|
+
"version": "7.47.2",
|
|
4
4
|
"description": "Cross-platform form components with URL state management",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"cross-platform",
|
|
@@ -57,10 +57,10 @@
|
|
|
57
57
|
},
|
|
58
58
|
"dependencies": {
|
|
59
59
|
"@floating-ui/react": "^0.27.20",
|
|
60
|
-
"@multiplatform.one/platform": "^7.47.
|
|
61
|
-
"@multiplatform.one/router": "^7.47.
|
|
62
|
-
"@multiplatform.one/table-primitives": "^7.47.
|
|
63
|
-
"@multiplatform.one/theme": "^7.47.
|
|
60
|
+
"@multiplatform.one/platform": "^7.47.2",
|
|
61
|
+
"@multiplatform.one/router": "^7.47.2",
|
|
62
|
+
"@multiplatform.one/table-primitives": "^7.47.2",
|
|
63
|
+
"@multiplatform.one/theme": "^7.47.2",
|
|
64
64
|
"@phosphor-icons/react": "^2.1.10",
|
|
65
65
|
"@tamagui/get-font-sized": "2.7.6",
|
|
66
66
|
"@tamagui/get-token": "2.7.6",
|
|
@@ -79,9 +79,9 @@
|
|
|
79
79
|
"tamagui": "2.7.6"
|
|
80
80
|
},
|
|
81
81
|
"devDependencies": {
|
|
82
|
-
"@multiplatform.one/config": "7.47.
|
|
83
|
-
"@multiplatform.one/storybook": "7.47.
|
|
84
|
-
"@multiplatform.one/test-utils": "7.47.
|
|
82
|
+
"@multiplatform.one/config": "7.47.2",
|
|
83
|
+
"@multiplatform.one/storybook": "7.47.2",
|
|
84
|
+
"@multiplatform.one/test-utils": "7.47.2",
|
|
85
85
|
"@tamagui/build": "2.7.6",
|
|
86
86
|
"@tamagui/config": "2.7.6",
|
|
87
87
|
"@tamagui/vite-plugin": "2.7.6",
|
|
@@ -263,10 +263,14 @@ export function ContextualSaveBar({
|
|
|
263
263
|
{...smoothRest}
|
|
264
264
|
className={smoothClass}
|
|
265
265
|
{...knobProps.gap}
|
|
266
|
-
{...
|
|
266
|
+
{...elevationProps}
|
|
267
|
+
{...transitionProps(knobProps.motion.overlay, [
|
|
268
|
+
"boxShadow",
|
|
269
|
+
"shadowOpacity",
|
|
270
|
+
"shadowRadius",
|
|
271
|
+
])}
|
|
267
272
|
enterStyle={transition ? { y: 12, opacity: 0 } : undefined}
|
|
268
273
|
exitStyle={transition ? { y: 12, opacity: 0 } : undefined}
|
|
269
|
-
{...elevationProps}
|
|
270
274
|
{...barRadius(knobProps)}
|
|
271
275
|
style={{
|
|
272
276
|
...(isWeb
|
|
@@ -0,0 +1,145 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* FZ-7865: switching the elevation knob at runtime must not change a
|
|
3
|
+
* component's hook count (React #310).
|
|
4
|
+
*
|
|
5
|
+
* Tamagui runs a part's animation hooks (`usePresence`, the driver's
|
|
6
|
+
* `useAnimations`) when the `transition` KEY is in its props, and keeps them
|
|
7
|
+
* once on. `getElevationWrapperProps` returned `{}` at none/small and a
|
|
8
|
+
* fragment carrying `transition` at medium/large, so a part spreading it
|
|
9
|
+
* called more hooks after the switch and React threw "Rendered more hooks than
|
|
10
|
+
* during the previous render". Progress made it worse: its flat branch was a
|
|
11
|
+
* second `<View>` with no spread at all, the same element type in the same
|
|
12
|
+
* slot, so React reused the fiber and hit the new hooks.
|
|
13
|
+
*
|
|
14
|
+
* The sequence walks none → small → medium → large → none → large on ONE
|
|
15
|
+
* mounted tree, the way a knob, preset or theme switch does.
|
|
16
|
+
*/
|
|
17
|
+
import { renderWithProviders } from "@multiplatform.one/test-utils";
|
|
18
|
+
import { type Elevation, Preset, useResolvedKnobs } from "@multiplatform.one/theme";
|
|
19
|
+
import { cleanup } from "@testing-library/react";
|
|
20
|
+
import type { ReactElement } from "react";
|
|
21
|
+
import { View } from "tamagui";
|
|
22
|
+
import { afterEach, describe, expect, it, vi } from "vitest";
|
|
23
|
+
import { Button } from "./Button";
|
|
24
|
+
import { ContextualSaveBar } from "./ContextualSaveBar";
|
|
25
|
+
import { ControlGroup } from "./ControlGroup";
|
|
26
|
+
import { Checkbox } from "./fields/Checkbox";
|
|
27
|
+
import { Input } from "./fields/Input";
|
|
28
|
+
import { Progress } from "./fields/Progress";
|
|
29
|
+
import { RadioGroup } from "./fields/RadioGroup";
|
|
30
|
+
import { Slider } from "./fields/Slider";
|
|
31
|
+
import { Switch } from "./fields/Switch";
|
|
32
|
+
import { ToggleGroup } from "./fields/ToggleGroup";
|
|
33
|
+
import { Form } from "./Form";
|
|
34
|
+
import { getElevationWrapperProps } from "./shared/utils";
|
|
35
|
+
|
|
36
|
+
afterEach(cleanup);
|
|
37
|
+
|
|
38
|
+
const sequence: Elevation[] = ["none", "small", "medium", "large", "none", "large"];
|
|
39
|
+
const options = [
|
|
40
|
+
{ label: "One", value: "one" },
|
|
41
|
+
{ label: "Two", value: "two" },
|
|
42
|
+
];
|
|
43
|
+
|
|
44
|
+
/** One raw part spreading the shared fragment, as every caller does. */
|
|
45
|
+
function ElevatedPart() {
|
|
46
|
+
const { knobProps, elevation } = useResolvedKnobs({});
|
|
47
|
+
return <View testID="elevated-part" {...getElevationWrapperProps(knobProps, elevation)} />;
|
|
48
|
+
}
|
|
49
|
+
|
|
50
|
+
const cases: Array<[string, () => ReactElement]> = [
|
|
51
|
+
["getElevationWrapperProps on a View", () => <ElevatedPart />],
|
|
52
|
+
["Progress", () => <Progress label="Done" value={40} />],
|
|
53
|
+
["Progress (intent)", () => <Progress label="Done" value={40} intent="success" />],
|
|
54
|
+
["Checkbox", () => <Checkbox label="Agree" />],
|
|
55
|
+
["RadioGroup", () => <RadioGroup label="Pick" options={options} />],
|
|
56
|
+
["Switch", () => <Switch label="On" />],
|
|
57
|
+
["Slider", () => <Slider label="Level" defaultValue={[30]} />],
|
|
58
|
+
["ToggleGroup", () => <ToggleGroup label="Pick" options={options} />],
|
|
59
|
+
["Input", () => <Input label="Name" />],
|
|
60
|
+
["Button", () => <Button>Save</Button>],
|
|
61
|
+
[
|
|
62
|
+
"ControlGroup",
|
|
63
|
+
() => (
|
|
64
|
+
<ControlGroup>
|
|
65
|
+
<Button>One</Button>
|
|
66
|
+
<Button>Two</Button>
|
|
67
|
+
</ControlGroup>
|
|
68
|
+
),
|
|
69
|
+
],
|
|
70
|
+
[
|
|
71
|
+
"ContextualSaveBar",
|
|
72
|
+
() => (
|
|
73
|
+
<Form>
|
|
74
|
+
<ContextualSaveBar forceVisible />
|
|
75
|
+
</Form>
|
|
76
|
+
),
|
|
77
|
+
],
|
|
78
|
+
];
|
|
79
|
+
|
|
80
|
+
function hookCountErrors(calls: unknown[][]): string[] {
|
|
81
|
+
return calls
|
|
82
|
+
.map((args) => args.map(String).join(" "))
|
|
83
|
+
.filter((line) => /#310|more hooks|fewer hooks|order of Hooks/i.test(line));
|
|
84
|
+
}
|
|
85
|
+
|
|
86
|
+
describe("FZ-7865 elevation switches keep every hook in place", () => {
|
|
87
|
+
it.each(cases)("%s re-renders across every elevation without React #310", (_name, ui) => {
|
|
88
|
+
const spy = vi.spyOn(console, "error").mockImplementation(() => {});
|
|
89
|
+
const uncaught: string[] = [];
|
|
90
|
+
const onError = (event: ErrorEvent) => uncaught.push(String(event.error?.message ?? event));
|
|
91
|
+
window.addEventListener("error", onError);
|
|
92
|
+
try {
|
|
93
|
+
const view = renderWithProviders(
|
|
94
|
+
<Preset overrides={{ elevation: sequence[0] }}>{ui()}</Preset>,
|
|
95
|
+
);
|
|
96
|
+
for (const elevation of sequence.slice(1)) {
|
|
97
|
+
view.rerender(<Preset overrides={{ elevation }}>{ui()}</Preset>);
|
|
98
|
+
expect(view.container.childElementCount, `tree unmounted at ${elevation}`).toBe(1);
|
|
99
|
+
}
|
|
100
|
+
expect([...hookCountErrors(spy.mock.calls), ...hookCountErrors([uncaught])]).toEqual([]);
|
|
101
|
+
} finally {
|
|
102
|
+
window.removeEventListener("error", onError);
|
|
103
|
+
spy.mockRestore();
|
|
104
|
+
}
|
|
105
|
+
});
|
|
106
|
+
|
|
107
|
+
// The compiler flattens a static `<View>` to a plain element in this suite,
|
|
108
|
+
// which hides the fiber reuse that crashes Storybook and native. The track
|
|
109
|
+
// wrapper keeping its node across switches is the same contract seen here:
|
|
110
|
+
// one element whose props change, never a second element swapped in.
|
|
111
|
+
it("Progress keeps one track wrapper node across every elevation", () => {
|
|
112
|
+
const view = renderWithProviders(
|
|
113
|
+
<Preset overrides={{ elevation: sequence[0] }}>
|
|
114
|
+
<Progress label="Done" value={40} />
|
|
115
|
+
</Preset>,
|
|
116
|
+
);
|
|
117
|
+
// progressbar → its Progress sub-theme span → the track wrapper.
|
|
118
|
+
const wrapper = () =>
|
|
119
|
+
view.container.querySelector("[role='progressbar']")?.parentElement?.parentElement;
|
|
120
|
+
const first = wrapper();
|
|
121
|
+
expect(first).toBeTruthy();
|
|
122
|
+
for (const elevation of sequence.slice(1)) {
|
|
123
|
+
view.rerender(
|
|
124
|
+
<Preset overrides={{ elevation }}>
|
|
125
|
+
<Progress label="Done" value={40} />
|
|
126
|
+
</Preset>,
|
|
127
|
+
);
|
|
128
|
+
expect(wrapper(), `track wrapper replaced at ${elevation}`).toBe(first);
|
|
129
|
+
}
|
|
130
|
+
});
|
|
131
|
+
});
|
|
132
|
+
|
|
133
|
+
describe("getElevationWrapperProps holds its keys at every elevation", () => {
|
|
134
|
+
it("returns `transition` whether the part is flat or raised", () => {
|
|
135
|
+
const motion = { control: { transition: "quick", animateOnly: ["opacity"] } };
|
|
136
|
+
const flat = getElevationWrapperProps({ motion, elevation: undefined } as any, {} as any);
|
|
137
|
+
const raised = getElevationWrapperProps(
|
|
138
|
+
{ motion, elevation: 4, elevationChrome: { elevation: 4 } } as any,
|
|
139
|
+
{} as any,
|
|
140
|
+
);
|
|
141
|
+
expect("transition" in flat).toBe("transition" in raised);
|
|
142
|
+
expect(flat.elevation).toBeUndefined();
|
|
143
|
+
expect(raised.elevation).toBe(4);
|
|
144
|
+
});
|
|
145
|
+
});
|
|
@@ -218,20 +218,20 @@ function ProgressTrack({
|
|
|
218
218
|
</ProgressFrame>
|
|
219
219
|
);
|
|
220
220
|
|
|
221
|
-
|
|
221
|
+
// One wrapper at every elevation (FZ-7865): two `<View>` branches share a
|
|
222
|
+
// fiber, so the flat one meeting the raised one's motion keys threw #310.
|
|
223
|
+
const bar = (
|
|
222
224
|
<View
|
|
223
225
|
{...elevationWrapperProps}
|
|
224
|
-
borderRadius={
|
|
226
|
+
borderRadius={
|
|
227
|
+
elevationWrapperProps.elevation ? knobProps.borderRadius.borderRadius : undefined
|
|
228
|
+
}
|
|
225
229
|
flex={1}
|
|
226
230
|
minWidth={0}
|
|
227
231
|
width="100%"
|
|
228
232
|
>
|
|
229
233
|
{progressElement}
|
|
230
234
|
</View>
|
|
231
|
-
) : (
|
|
232
|
-
<View flex={1} minWidth={0} width="100%">
|
|
233
|
-
{progressElement}
|
|
234
|
-
</View>
|
|
235
235
|
);
|
|
236
236
|
|
|
237
237
|
return (
|
package/src/shared/utils.ts
CHANGED
|
@@ -96,11 +96,21 @@ export function getOTPCellRadius(radiusToken: string | undefined, heightPx: numb
|
|
|
96
96
|
* Tamagui's create* HOC chains (createCheckbox, createSwitch, etc.) swallow
|
|
97
97
|
* the elevation variant. Spread the complete `elevationChrome` fragment from
|
|
98
98
|
* resolveKnobs (LC-85). Surface sub-themes own the fill.
|
|
99
|
+
*
|
|
100
|
+
* The motion keys come back at EVERY elevation, flat included (FZ-7865).
|
|
101
|
+
* Tamagui runs its animation hooks when `transition` is among a part's props,
|
|
102
|
+
* so a fragment that gains the key only once raised changes the hook count
|
|
103
|
+
* when the knob, a preset or a theme switches live (React #310).
|
|
99
104
|
*/
|
|
100
105
|
export function getElevationWrapperProps(
|
|
101
106
|
knobProps: KnobProps,
|
|
102
107
|
elevationRecipe: KnobRecipe<ElevationStateProps>,
|
|
103
108
|
): Record<string, any> {
|
|
109
|
+
const motion = transitionProps(knobProps.motion.control, [
|
|
110
|
+
"boxShadow",
|
|
111
|
+
"shadowOpacity",
|
|
112
|
+
"shadowRadius",
|
|
113
|
+
]);
|
|
104
114
|
const elevation = knobProps.elevation;
|
|
105
115
|
if (
|
|
106
116
|
!elevation &&
|
|
@@ -108,7 +118,7 @@ export function getElevationWrapperProps(
|
|
|
108
118
|
!elevationRecipe.pressKnobProps?.elevation &&
|
|
109
119
|
!elevationRecipe.focusVisibleKnobProps?.elevation
|
|
110
120
|
) {
|
|
111
|
-
return
|
|
121
|
+
return motion;
|
|
112
122
|
}
|
|
113
123
|
const props: Record<string, any> = {
|
|
114
124
|
overflow: "visible" as const,
|
|
@@ -123,10 +133,7 @@ export function getElevationWrapperProps(
|
|
|
123
133
|
if (elevationRecipe.focusVisibleKnobProps) {
|
|
124
134
|
props.focusVisibleStyle = elevationRecipe.focusVisibleKnobProps;
|
|
125
135
|
}
|
|
126
|
-
Object.assign(
|
|
127
|
-
props,
|
|
128
|
-
transitionProps(knobProps.motion.control, ["boxShadow", "shadowOpacity", "shadowRadius"]),
|
|
129
|
-
);
|
|
136
|
+
Object.assign(props, motion);
|
|
130
137
|
return props;
|
|
131
138
|
}
|
|
132
139
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/ContextualSaveBar/index.tsx"],"names":[],"mappings":"AAeA,OAAO,EAGL,KAAK,oBAAoB,EAC1B,MAAM,0BAA0B,CAAC;AAElC,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAC9D,YAAY,EAAE,iBAAiB,EAAE,oBAAoB,EAAE,MAAM,0BAA0B,CAAC;AAExF,MAAM,WAAW,sBAAsB;IACrC;;;OAGG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;OAEG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,uEAAuE;IACvE,UAAU,CAAC,EAAE,oBAAoB,CAAC;IAClC,OAAO,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,KAAK,IAAI,CAAC;IACpD;;;OAGG;IACH,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;IACtD,iFAAiF;IACjF,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAyFD,wBAAgB,iBAAiB,CAAC,EAChC,YAAoB,EACpB,eAAuB,EACvB,UAAU,EACV,OAAO,EACP,OAAO,GACR,EAAE,sBAAsB,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/ContextualSaveBar/index.tsx"],"names":[],"mappings":"AAeA,OAAO,EAGL,KAAK,oBAAoB,EAC1B,MAAM,0BAA0B,CAAC;AAElC,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAC9D,YAAY,EAAE,iBAAiB,EAAE,oBAAoB,EAAE,MAAM,0BAA0B,CAAC;AAExF,MAAM,WAAW,sBAAsB;IACrC;;;OAGG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;OAEG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,uEAAuE;IACvE,UAAU,CAAC,EAAE,oBAAoB,CAAC;IAClC,OAAO,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,KAAK,IAAI,CAAC;IACpD;;;OAGG;IACH,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;IACtD,iFAAiF;IACjF,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAyFD,wBAAgB,iBAAiB,CAAC,EAChC,YAAoB,EACpB,eAAuB,EACvB,UAAU,EACV,OAAO,EACP,OAAO,GACR,EAAE,sBAAsB,2CAkNxB"}
|
package/types/shared/utils.d.ts
CHANGED
|
@@ -33,6 +33,11 @@ export declare function getOTPCellRadius(radiusToken: string | undefined, height
|
|
|
33
33
|
* Tamagui's create* HOC chains (createCheckbox, createSwitch, etc.) swallow
|
|
34
34
|
* the elevation variant. Spread the complete `elevationChrome` fragment from
|
|
35
35
|
* resolveKnobs (LC-85). Surface sub-themes own the fill.
|
|
36
|
+
*
|
|
37
|
+
* The motion keys come back at EVERY elevation, flat included (FZ-7865).
|
|
38
|
+
* Tamagui runs its animation hooks when `transition` is among a part's props,
|
|
39
|
+
* so a fragment that gains the key only once raised changes the hook count
|
|
40
|
+
* when the knob, a preset or a theme switches live (React #310).
|
|
36
41
|
*/
|
|
37
42
|
export declare function getElevationWrapperProps(knobProps: KnobProps, elevationRecipe: KnobRecipe<ElevationStateProps>): Record<string, any>;
|
|
38
43
|
export declare function useFormField(props: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../src/shared/utils.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,SAAS,EAAkB,MAAM,OAAO,CAAC;AACvD,OAAO,KAAK,EAEV,mBAAmB,EACnB,SAAS,EACT,UAAU,EACV,aAAa,EACd,MAAM,0BAA0B,CAAC;AAQlC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAG1C,OAAO,KAAK,EAAE,UAAU,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAE3D;;;GAGG;AACH,wBAAgB,cAAc,CAAC,SAAS,EAAE,UAAU,EAAE,IAAI,SAAI,EAAE,KAAK,UAAmB,GAAG,MAAM,CAEhG;AAgBD;;;GAGG;AACH,wBAAgB,qBAAqB,CACnC,WAAW,EAAE,MAAM,GAAG,SAAS,EAC/B,WAAW,SAAI,GACd,MAAM,GAAG,CAAC,CAEZ;AAED;;;;;;GAMG;AACH,wBAAgB,4BAA4B,CAC1C,WAAW,EAAE,MAAM,GAAG,SAAS,EAC/B,WAAW,SAAI,GACd,MAAM,GAAG,CAAC,CAEZ;AAgBD;;;;;GAKG;AACH,wBAAgB,gBAAgB,CAAC,WAAW,EAAE,MAAM,GAAG,SAAS,EAAE,QAAQ,EAAE,MAAM,GAAG,MAAM,CAE1F;AAED
|
|
1
|
+
{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../src/shared/utils.ts"],"names":[],"mappings":"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"}
|