fluent-styles 1.58.0 → 1.60.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/lib/commonjs/button/index.js +5 -10
- package/lib/commonjs/button/index.js.map +1 -1
- package/lib/commonjs/form/index.js +267 -0
- package/lib/commonjs/form/index.js.map +1 -1
- package/lib/commonjs/header/index.js +79 -66
- package/lib/commonjs/header/index.js.map +1 -1
- package/lib/commonjs/index.js +95 -71
- package/lib/commonjs/index.js.map +1 -1
- package/lib/commonjs/input/index.js +2 -3
- package/lib/commonjs/input/index.js.map +1 -1
- package/lib/commonjs/shape/cycle.js +116 -0
- package/lib/commonjs/shape/cycle.js.map +1 -0
- package/lib/module/button/index.js +5 -10
- package/lib/module/button/index.js.map +1 -1
- package/lib/module/form/index.js +262 -0
- package/lib/module/form/index.js.map +1 -1
- package/lib/module/header/index.js +81 -68
- package/lib/module/header/index.js.map +1 -1
- package/lib/module/index.js +3 -1
- package/lib/module/index.js.map +1 -1
- package/lib/module/input/index.js +1 -0
- package/lib/module/input/index.js.map +1 -1
- package/lib/module/shape/cycle.js +112 -0
- package/lib/module/shape/cycle.js.map +1 -0
- package/lib/typescript/button/index.d.ts.map +1 -1
- package/lib/typescript/form/index.d.ts +127 -0
- package/lib/typescript/form/index.d.ts.map +1 -1
- package/lib/typescript/header/index.d.ts +4 -9
- package/lib/typescript/header/index.d.ts.map +1 -1
- package/lib/typescript/index.d.ts +3 -1
- package/lib/typescript/index.d.ts.map +1 -1
- package/lib/typescript/input/index.d.ts +1 -1
- package/lib/typescript/input/index.d.ts.map +1 -1
- package/lib/typescript/shape/cycle.d.ts +65 -0
- package/lib/typescript/shape/cycle.d.ts.map +1 -0
- package/package.json +1 -1
- package/src/button/index.tsx +1 -6
- package/src/form/index.tsx +331 -0
- package/src/header/index.tsx +87 -103
- package/src/index.ts +3 -1
- package/src/input/index.tsx +1 -0
- package/src/shape/cycle.tsx +134 -0
|
@@ -23,11 +23,10 @@ const ButtonBase = (0, _styled.styled)(_reactNative.TouchableOpacity, {
|
|
|
23
23
|
justifyContent: 'center',
|
|
24
24
|
flexDirection: 'row',
|
|
25
25
|
gap: 6,
|
|
26
|
-
borderRadius:
|
|
26
|
+
borderRadius: 32,
|
|
27
27
|
// pill by default
|
|
28
28
|
paddingHorizontal: 20,
|
|
29
29
|
paddingVertical: 10,
|
|
30
|
-
flex: 1,
|
|
31
30
|
borderWidth: 0
|
|
32
31
|
},
|
|
33
32
|
variants: {
|
|
@@ -128,15 +127,13 @@ const ButtonBase = (0, _styled.styled)(_reactNative.TouchableOpacity, {
|
|
|
128
127
|
xs: {
|
|
129
128
|
true: {
|
|
130
129
|
paddingHorizontal: 10,
|
|
131
|
-
paddingVertical: 4
|
|
132
|
-
borderWidth: 0
|
|
130
|
+
paddingVertical: 4
|
|
133
131
|
}
|
|
134
132
|
},
|
|
135
133
|
sm: {
|
|
136
134
|
true: {
|
|
137
135
|
paddingHorizontal: 14,
|
|
138
|
-
paddingVertical: 6
|
|
139
|
-
borderWidth: 0
|
|
136
|
+
paddingVertical: 6
|
|
140
137
|
}
|
|
141
138
|
},
|
|
142
139
|
md: {
|
|
@@ -148,15 +145,13 @@ const ButtonBase = (0, _styled.styled)(_reactNative.TouchableOpacity, {
|
|
|
148
145
|
lg: {
|
|
149
146
|
true: {
|
|
150
147
|
paddingHorizontal: 28,
|
|
151
|
-
paddingVertical: 14
|
|
152
|
-
borderWidth: 0
|
|
148
|
+
paddingVertical: 14
|
|
153
149
|
}
|
|
154
150
|
},
|
|
155
151
|
xl: {
|
|
156
152
|
true: {
|
|
157
153
|
paddingHorizontal: 36,
|
|
158
|
-
paddingVertical: 18
|
|
159
|
-
borderWidth: 0
|
|
154
|
+
paddingVertical: 18
|
|
160
155
|
}
|
|
161
156
|
},
|
|
162
157
|
// ── Layout ────────────────────────────────────────────────────────────────
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_react","_interopRequireDefault","require","_reactNative","_styled","_viewStyleVariants","_index","_theme","_jsxRuntime","e","__esModule","default","ButtonBase","styled","TouchableOpacity","base","position","alignItems","justifyContent","flexDirection","gap","borderRadius","paddingHorizontal","paddingVertical","
|
|
1
|
+
{"version":3,"names":["_react","_interopRequireDefault","require","_reactNative","_styled","_viewStyleVariants","_index","_theme","_jsxRuntime","e","__esModule","default","ButtonBase","styled","TouchableOpacity","base","position","alignItems","justifyContent","flexDirection","gap","borderRadius","paddingHorizontal","paddingVertical","borderWidth","variants","viewStyleVariants","viewStyleStringVariants","primary","true","backgroundColor","theme","colors","cyan","secondary","indigo","outline","transparent","borderColor","gray","ghost","link","danger","red","success","green","warning","amber","dropdown","white","borderLeftWidth","borderTopWidth","borderRightWidth","borderBottomWidth","disabled","opacity","pill","rounded","square","xs","sm","md","lg","xl","compact","flex","alignSelf","block","icon","width","height","padding","spinnerColor","props","Button","React","forwardRef","children","loading","leftIcon","rightIcon","rest","ref","isDisabled","jsxs","undefined","activeOpacity","jsx","ActivityIndicator","size","color","style","marginRight","StyledText","displayName","StyledButton","exports","Text"],"sourceRoot":"../../../src","sources":["button/index.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -1,2 +1,269 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.useFormContext = exports.StyledForm = void 0;
|
|
7
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
8
|
+
var _reactNative = require("react-native");
|
|
9
|
+
var _index = require("../stack/index.js");
|
|
10
|
+
var _index2 = require("../text/index.js");
|
|
11
|
+
var _index3 = require("../divider/index.js");
|
|
12
|
+
var _index4 = require("../input/index.js");
|
|
13
|
+
var _index5 = require("../checkBox/index.js");
|
|
14
|
+
var _index6 = require("../switch/index.js");
|
|
15
|
+
var _index7 = require("../dropdown/index.js");
|
|
16
|
+
var _index8 = require("../radio/index.js");
|
|
17
|
+
var _index9 = require("../datePicker/index.js");
|
|
18
|
+
var _index0 = require("../slider/index.js");
|
|
19
|
+
var _theme = require("../utiles/theme.js");
|
|
20
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
21
|
+
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
|
|
22
|
+
// ─── CompatNode ───────────────────────────────────────────────────────────────
|
|
23
|
+
|
|
24
|
+
// ─── Form context ─────────────────────────────────────────────────────────────
|
|
25
|
+
|
|
26
|
+
const FormContext = /*#__PURE__*/(0, _react.createContext)({});
|
|
27
|
+
const useFormContext = () => (0, _react.useContext)(FormContext);
|
|
28
|
+
|
|
29
|
+
// ─── Types ────────────────────────────────────────────────────────────────────
|
|
30
|
+
exports.useFormContext = useFormContext;
|
|
31
|
+
// ─── Layout sub-components ────────────────────────────────────────────────────
|
|
32
|
+
|
|
33
|
+
/**
|
|
34
|
+
* StyledForm.Row
|
|
35
|
+
* Side-by-side inputs — e.g. First name / Last name.
|
|
36
|
+
*
|
|
37
|
+
* <StyledForm.Row>
|
|
38
|
+
* <StyledForm.Input label="First" flex={1} />
|
|
39
|
+
* <StyledForm.Input label="Last" flex={1} />
|
|
40
|
+
* </StyledForm.Row>
|
|
41
|
+
*/
|
|
42
|
+
const Row = ({
|
|
43
|
+
gap = 12,
|
|
44
|
+
children,
|
|
45
|
+
...rest
|
|
46
|
+
}) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Stack, {
|
|
47
|
+
horizontal: true,
|
|
48
|
+
gap: gap,
|
|
49
|
+
...rest,
|
|
50
|
+
children: children
|
|
51
|
+
});
|
|
52
|
+
Row.displayName = "StyledForm.Row";
|
|
53
|
+
|
|
54
|
+
/**
|
|
55
|
+
* StyledForm.Section
|
|
56
|
+
* Groups related inputs under a titled section.
|
|
57
|
+
*
|
|
58
|
+
* <StyledForm.Section title="Personal info" subtitle="Shown on your profile">
|
|
59
|
+
* <StyledForm.Input label="Name" />
|
|
60
|
+
* </StyledForm.Section>
|
|
61
|
+
*/
|
|
62
|
+
const Section = ({
|
|
63
|
+
title,
|
|
64
|
+
titleProps,
|
|
65
|
+
subtitle,
|
|
66
|
+
subtitleProps,
|
|
67
|
+
showDivider = true,
|
|
68
|
+
children,
|
|
69
|
+
...rest
|
|
70
|
+
}) => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_index.Stack, {
|
|
71
|
+
gap: 14,
|
|
72
|
+
...rest,
|
|
73
|
+
children: [(title || subtitle) && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_index.Stack, {
|
|
74
|
+
gap: 2,
|
|
75
|
+
children: [title && /*#__PURE__*/(0, _jsxRuntime.jsx)(_index2.StyledText, {
|
|
76
|
+
fontSize: 15,
|
|
77
|
+
fontWeight: "700",
|
|
78
|
+
color: _theme.theme.colors.gray[900],
|
|
79
|
+
...titleProps,
|
|
80
|
+
children: title
|
|
81
|
+
}), subtitle && /*#__PURE__*/(0, _jsxRuntime.jsx)(_index2.StyledText, {
|
|
82
|
+
fontSize: 13,
|
|
83
|
+
color: _theme.theme.colors.gray[400],
|
|
84
|
+
...subtitleProps,
|
|
85
|
+
children: subtitle
|
|
86
|
+
}), showDivider && /*#__PURE__*/(0, _jsxRuntime.jsx)(_index3.StyledDivider, {
|
|
87
|
+
borderBottomColor: _theme.theme.colors.gray[100],
|
|
88
|
+
marginTop: 6
|
|
89
|
+
})]
|
|
90
|
+
}), children]
|
|
91
|
+
});
|
|
92
|
+
Section.displayName = "StyledForm.Section";
|
|
93
|
+
|
|
94
|
+
/**
|
|
95
|
+
* StyledForm.Actions
|
|
96
|
+
* Slot for submit / cancel buttons.
|
|
97
|
+
*
|
|
98
|
+
* <StyledForm.Actions>
|
|
99
|
+
* <StyledButton primary block>Submit</StyledButton>
|
|
100
|
+
* <StyledButton outline block>Cancel</StyledButton>
|
|
101
|
+
* </StyledForm.Actions>
|
|
102
|
+
*/
|
|
103
|
+
const Actions = ({
|
|
104
|
+
horizontal = false,
|
|
105
|
+
gap = 10,
|
|
106
|
+
children,
|
|
107
|
+
...rest
|
|
108
|
+
}) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Stack, {
|
|
109
|
+
horizontal: horizontal,
|
|
110
|
+
gap: gap,
|
|
111
|
+
...rest,
|
|
112
|
+
children: children
|
|
113
|
+
});
|
|
114
|
+
Actions.displayName = "StyledForm.Actions";
|
|
115
|
+
|
|
116
|
+
// ─── Input sub-components — thin aliases that read FormContext ────────────────
|
|
117
|
+
// Each one forwards all props of the underlying component unchanged.
|
|
118
|
+
// The only addition: they read disabled/loading from FormContext so form-level
|
|
119
|
+
// state propagates without prop drilling.
|
|
120
|
+
|
|
121
|
+
/**
|
|
122
|
+
* StyledForm.Input → StyledTextInput
|
|
123
|
+
*
|
|
124
|
+
* <StyledForm.Input label="Email" required variant="outline" />
|
|
125
|
+
*/
|
|
126
|
+
const Input = props => {
|
|
127
|
+
const ctx = useFormContext();
|
|
128
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_index4.StyledTextInput, {
|
|
129
|
+
editable: ctx.disabled ? false : props.editable,
|
|
130
|
+
loading: props.loading ?? ctx.loading,
|
|
131
|
+
...props
|
|
132
|
+
});
|
|
133
|
+
};
|
|
134
|
+
Input.displayName = "StyledForm.Input";
|
|
135
|
+
|
|
136
|
+
/**
|
|
137
|
+
* StyledForm.Checkbox → StyledCheckBox
|
|
138
|
+
*
|
|
139
|
+
* <StyledForm.Checkbox label="I agree to the terms" checked={agreed} onCheck={setAgreed} />
|
|
140
|
+
*/
|
|
141
|
+
const Checkbox = props => {
|
|
142
|
+
const ctx = useFormContext();
|
|
143
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_index5.StyledCheckBox, {
|
|
144
|
+
disabled: props.disabled ?? ctx.disabled,
|
|
145
|
+
...props
|
|
146
|
+
});
|
|
147
|
+
};
|
|
148
|
+
Checkbox.displayName = "StyledForm.Checkbox";
|
|
149
|
+
|
|
150
|
+
/**
|
|
151
|
+
* StyledForm.Switch → Switch
|
|
152
|
+
*
|
|
153
|
+
* <StyledForm.Switch label="Email notifications" value={notifs} onChange={setNotifs} />
|
|
154
|
+
*/
|
|
155
|
+
const FormSwitch = props => {
|
|
156
|
+
const ctx = useFormContext();
|
|
157
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_index6.Switch, {
|
|
158
|
+
disabled: props.disabled ?? ctx.disabled,
|
|
159
|
+
loading: props.loading ?? ctx.loading,
|
|
160
|
+
...props
|
|
161
|
+
});
|
|
162
|
+
};
|
|
163
|
+
FormSwitch.displayName = "StyledForm.Switch";
|
|
164
|
+
|
|
165
|
+
/**
|
|
166
|
+
* StyledForm.Select → StyledDropdown
|
|
167
|
+
*
|
|
168
|
+
* <StyledForm.Select label="Country" options={countries} value={country} onChange={setCountry} />
|
|
169
|
+
*/
|
|
170
|
+
const Select = props => {
|
|
171
|
+
const ctx = useFormContext();
|
|
172
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_index7.StyledDropdown, {
|
|
173
|
+
disabled: props.disabled ?? ctx.disabled,
|
|
174
|
+
...props
|
|
175
|
+
});
|
|
176
|
+
};
|
|
177
|
+
Select.displayName = "StyledForm.Select";
|
|
178
|
+
|
|
179
|
+
/**
|
|
180
|
+
* StyledForm.Radio → StyledRadioGroup
|
|
181
|
+
*
|
|
182
|
+
* <StyledForm.Radio options={plans} value={plan} onChange={setPlan} />
|
|
183
|
+
*/
|
|
184
|
+
const Radio = props => /*#__PURE__*/(0, _jsxRuntime.jsx)(_index8.StyledRadioGroup, {
|
|
185
|
+
...props
|
|
186
|
+
});
|
|
187
|
+
Radio.displayName = "StyledForm.Radio";
|
|
188
|
+
|
|
189
|
+
/**
|
|
190
|
+
* StyledForm.DatePicker → StyledDatePicker
|
|
191
|
+
*
|
|
192
|
+
* <StyledForm.DatePicker label="Date of birth" value={dob} onChange={setDob} variant="input" />
|
|
193
|
+
*/
|
|
194
|
+
const DatePicker = props => {
|
|
195
|
+
const ctx = useFormContext();
|
|
196
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_index9.StyledDatePicker, {
|
|
197
|
+
disabled: props.disabled ?? ctx.disabled,
|
|
198
|
+
...props
|
|
199
|
+
});
|
|
200
|
+
};
|
|
201
|
+
DatePicker.displayName = "StyledForm.DatePicker";
|
|
202
|
+
|
|
203
|
+
/**
|
|
204
|
+
* StyledForm.Slider → StyledSlider
|
|
205
|
+
*
|
|
206
|
+
* <StyledForm.Slider label="Budget" value={budget} onValueChange={setBudget} min={0} max={1000} />
|
|
207
|
+
*/
|
|
208
|
+
const Slider = props => {
|
|
209
|
+
const ctx = useFormContext();
|
|
210
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_index0.StyledSlider, {
|
|
211
|
+
disabled: props.disabled ?? ctx.disabled,
|
|
212
|
+
...props
|
|
213
|
+
});
|
|
214
|
+
};
|
|
215
|
+
Slider.displayName = "StyledForm.Slider";
|
|
216
|
+
|
|
217
|
+
// ─── StyledForm (root) ────────────────────────────────────────────────────────
|
|
218
|
+
|
|
219
|
+
const StyledForm = ({
|
|
220
|
+
disabled,
|
|
221
|
+
loading,
|
|
222
|
+
gap = 16,
|
|
223
|
+
avoidKeyboard = true,
|
|
224
|
+
scrollable = false,
|
|
225
|
+
scrollPadding = 40,
|
|
226
|
+
children,
|
|
227
|
+
...rest
|
|
228
|
+
}) => {
|
|
229
|
+
const fields = /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Stack, {
|
|
230
|
+
gap: gap,
|
|
231
|
+
...rest,
|
|
232
|
+
children: children
|
|
233
|
+
});
|
|
234
|
+
const content = scrollable ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.ScrollView, {
|
|
235
|
+
keyboardShouldPersistTaps: "handled",
|
|
236
|
+
showsVerticalScrollIndicator: false,
|
|
237
|
+
contentContainerStyle: {
|
|
238
|
+
flexGrow: 1,
|
|
239
|
+
paddingBottom: scrollPadding
|
|
240
|
+
},
|
|
241
|
+
children: fields
|
|
242
|
+
}) : fields;
|
|
243
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(FormContext.Provider, {
|
|
244
|
+
value: {
|
|
245
|
+
disabled,
|
|
246
|
+
loading
|
|
247
|
+
},
|
|
248
|
+
children: avoidKeyboard ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.KeyboardAvoidingView, {
|
|
249
|
+
behavior: _reactNative.Platform.OS === "ios" ? "padding" : "height",
|
|
250
|
+
style: {
|
|
251
|
+
flex: 1
|
|
252
|
+
},
|
|
253
|
+
children: content
|
|
254
|
+
}) : content
|
|
255
|
+
});
|
|
256
|
+
};
|
|
257
|
+
exports.StyledForm = StyledForm;
|
|
258
|
+
StyledForm.displayName = "StyledForm";
|
|
259
|
+
StyledForm.Row = Row;
|
|
260
|
+
StyledForm.Section = Section;
|
|
261
|
+
StyledForm.Actions = Actions;
|
|
262
|
+
StyledForm.Input = Input;
|
|
263
|
+
StyledForm.Checkbox = Checkbox;
|
|
264
|
+
StyledForm.Switch = FormSwitch;
|
|
265
|
+
StyledForm.Select = Select;
|
|
266
|
+
StyledForm.Radio = Radio;
|
|
267
|
+
StyledForm.DatePicker = DatePicker;
|
|
268
|
+
StyledForm.Slider = Slider;
|
|
2
269
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":[],"sourceRoot":"../../../src","sources":["form/index.tsx"],"mappings":"","ignoreList":[]}
|
|
1
|
+
{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_index","_index2","_index3","_index4","_index5","_index6","_index7","_index8","_index9","_index0","_theme","_jsxRuntime","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","FormContext","createContext","useFormContext","useContext","exports","Row","gap","children","rest","jsx","Stack","horizontal","displayName","Section","title","titleProps","subtitle","subtitleProps","showDivider","jsxs","StyledText","fontSize","fontWeight","color","theme","colors","gray","StyledDivider","borderBottomColor","marginTop","Actions","Input","props","ctx","StyledTextInput","editable","disabled","loading","Checkbox","StyledCheckBox","FormSwitch","Switch","Select","StyledDropdown","Radio","StyledRadioGroup","DatePicker","StyledDatePicker","Slider","StyledSlider","StyledForm","avoidKeyboard","scrollable","scrollPadding","fields","content","ScrollView","keyboardShouldPersistTaps","showsVerticalScrollIndicator","contentContainerStyle","flexGrow","paddingBottom","Provider","value","KeyboardAvoidingView","behavior","Platform","OS","style","flex"],"sourceRoot":"../../../src","sources":["form/index.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -14,11 +14,14 @@ var _index3 = require("../shape/index.js");
|
|
|
14
14
|
var _index4 = require("../text/index.js");
|
|
15
15
|
var _index5 = require("../icons/index.js");
|
|
16
16
|
var _theme = require("../utiles/theme.js");
|
|
17
|
+
var _index6 = require("../pressable/index.js");
|
|
18
|
+
var _viewStyleVariants = require("../utiles/viewStyleVariants.js");
|
|
17
19
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
18
20
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
19
|
-
// Types
|
|
21
|
+
// ─── Types ────────────────────────────────────────────────────────────────────
|
|
22
|
+
|
|
23
|
+
// ─── Container ────────────────────────────────────────────────────────────────
|
|
20
24
|
|
|
21
|
-
// Styled Components
|
|
22
25
|
const StyledHeaderContainer = (0, _styled.styled)(_reactNative.View, {
|
|
23
26
|
base: {
|
|
24
27
|
position: "relative",
|
|
@@ -29,40 +32,31 @@ const StyledHeaderContainer = (0, _styled.styled)(_reactNative.View, {
|
|
|
29
32
|
ios: 44,
|
|
30
33
|
android: 56,
|
|
31
34
|
default: 56
|
|
32
|
-
})
|
|
35
|
+
}),
|
|
36
|
+
paddingHorizontal: 4
|
|
37
|
+
},
|
|
38
|
+
variants: {
|
|
39
|
+
// ── Forward all generic style props ─────────────────────────────────────
|
|
40
|
+
..._viewStyleVariants.viewStyleVariants,
|
|
41
|
+
..._viewStyleVariants.viewStyleStringVariants
|
|
33
42
|
}
|
|
34
43
|
});
|
|
35
44
|
|
|
36
|
-
// Full
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
const {
|
|
45
|
-
width
|
|
46
|
-
} = (0, _reactNative.useWindowDimensions)();
|
|
47
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_index.Stack, {
|
|
48
|
-
vertical: true,
|
|
49
|
-
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_index2.default, {
|
|
50
|
-
...statusBarProps
|
|
51
|
-
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledHeaderContainer, {
|
|
52
|
-
ref: ref,
|
|
53
|
-
width: width,
|
|
54
|
-
marginTop: (0, _statusBar.getStatusBarHeight)({
|
|
55
|
-
skipAndroid: skipStatusBarOnAndroid,
|
|
56
|
-
skipIos: skipStatusBarOnIOS
|
|
57
|
-
}),
|
|
58
|
-
...rest,
|
|
59
|
-
children: children
|
|
60
|
-
})]
|
|
61
|
-
});
|
|
45
|
+
// ─── Full — pure children pass-through ───────────────────────────────────────
|
|
46
|
+
// No layout of its own. StyledHeader (the outer wrapper) owns all spacing,
|
|
47
|
+
// status bar, and container sizing. Full just renders whatever is inside it.
|
|
48
|
+
|
|
49
|
+
const Full = ({
|
|
50
|
+
children
|
|
51
|
+
}) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
|
|
52
|
+
children: children
|
|
62
53
|
});
|
|
54
|
+
Full.displayName = "StyledHeader.Full";
|
|
55
|
+
|
|
56
|
+
// ─── StyledHeader ─────────────────────────────────────────────────────────────
|
|
63
57
|
|
|
64
|
-
// Main Header Component
|
|
65
58
|
const HeaderComponent = /*#__PURE__*/_react.default.forwardRef(({
|
|
59
|
+
// built-in title/icon layout props
|
|
66
60
|
showBackArrow,
|
|
67
61
|
backArrowProps,
|
|
68
62
|
showStatusBar = true,
|
|
@@ -76,72 +70,91 @@ const HeaderComponent = /*#__PURE__*/_react.default.forwardRef(({
|
|
|
76
70
|
statusBarProps,
|
|
77
71
|
skipStatusBarOnAndroid = true,
|
|
78
72
|
skipStatusBarOnIOS = true,
|
|
73
|
+
// children covers StyledHeader.Full usage
|
|
74
|
+
children,
|
|
79
75
|
...rest
|
|
80
76
|
}, ref) => {
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
77
|
+
// ── Left slot ─────────────────────────────────────────────────────────
|
|
78
|
+
const renderLeft = () => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_index.Stack, {
|
|
79
|
+
flex: 1,
|
|
80
|
+
horizontal: true,
|
|
81
|
+
alignItems: "center",
|
|
82
|
+
justifyContent: "flex-start",
|
|
83
|
+
children: [showBackArrow && /*#__PURE__*/(0, _jsxRuntime.jsx)(_index6.StyledPressable, {
|
|
84
|
+
onPress: onBackPress ?? backArrowProps?.onPress,
|
|
85
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_index3.StyleShape, {
|
|
89
86
|
cycle: true,
|
|
90
87
|
...shapeProps,
|
|
91
88
|
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_index5.ChevronLeft, {
|
|
92
|
-
size:
|
|
93
|
-
color: _theme.theme.colors.gray[
|
|
94
|
-
|
|
95
|
-
...backArrowProps
|
|
89
|
+
size: backArrowProps?.size ?? 24,
|
|
90
|
+
color: backArrowProps?.color ?? _theme.theme.colors.gray[700],
|
|
91
|
+
strokeWidth: backArrowProps?.strokeWidth
|
|
96
92
|
})
|
|
97
|
-
})
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
})
|
|
103
|
-
};
|
|
104
|
-
|
|
93
|
+
})
|
|
94
|
+
}), leftIcon, titleAlignment === "left" && title && /*#__PURE__*/(0, _jsxRuntime.jsx)(_index4.StyledText, {
|
|
95
|
+
marginLeft: showBackArrow || leftIcon ? 8 : 0,
|
|
96
|
+
...titleProps,
|
|
97
|
+
children: title
|
|
98
|
+
})]
|
|
99
|
+
});
|
|
100
|
+
|
|
101
|
+
// ── Center slot ───────────────────────────────────────────────────────
|
|
102
|
+
const renderCenter = () => {
|
|
105
103
|
if (titleAlignment !== "center" || !title) return null;
|
|
106
104
|
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Stack, {
|
|
107
|
-
flex:
|
|
108
|
-
flexWrap: "nowrap",
|
|
105
|
+
flex: 2,
|
|
109
106
|
alignItems: "center",
|
|
110
|
-
|
|
107
|
+
justifyContent: "center",
|
|
108
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_index4.StyledText, {
|
|
109
|
+
numberOfLines: 1,
|
|
111
110
|
...titleProps,
|
|
112
111
|
children: title
|
|
113
112
|
})
|
|
114
113
|
});
|
|
115
114
|
};
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
115
|
+
|
|
116
|
+
// ── Right slot ────────────────────────────────────────────────────────
|
|
117
|
+
const renderRight = () => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_index.Stack, {
|
|
118
|
+
flex: 1,
|
|
119
|
+
horizontal: true,
|
|
120
|
+
alignItems: "center",
|
|
121
|
+
justifyContent: "flex-end",
|
|
122
|
+
children: [titleAlignment === "right" && title && /*#__PURE__*/(0, _jsxRuntime.jsx)(_index4.StyledText, {
|
|
123
|
+
marginRight: rightIcon ? 8 : 0,
|
|
124
|
+
...titleProps,
|
|
125
|
+
children: title
|
|
126
|
+
}), rightIcon]
|
|
127
|
+
});
|
|
128
|
+
|
|
129
|
+
// ── When children is present (e.g. StyledHeader.Full usage), render
|
|
130
|
+
// them directly inside the container — skip the built-in layout slots.
|
|
131
|
+
const renderContent = () => {
|
|
132
|
+
if (children) return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
|
|
133
|
+
children: children
|
|
134
|
+
});
|
|
135
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
|
|
136
|
+
children: [renderLeft(), renderCenter(), renderRight()]
|
|
123
137
|
});
|
|
124
138
|
};
|
|
125
139
|
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_index.Stack, {
|
|
126
140
|
vertical: true,
|
|
127
|
-
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_index2.default, {
|
|
141
|
+
children: [showStatusBar && /*#__PURE__*/(0, _jsxRuntime.jsx)(_index2.default, {
|
|
128
142
|
...statusBarProps
|
|
129
|
-
}), /*#__PURE__*/(0, _jsxRuntime.
|
|
143
|
+
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledHeaderContainer, {
|
|
130
144
|
ref: ref,
|
|
131
145
|
marginTop: (0, _statusBar.getStatusBarHeight)({
|
|
132
146
|
skipAndroid: skipStatusBarOnAndroid,
|
|
133
147
|
skipIos: skipStatusBarOnIOS
|
|
134
148
|
}),
|
|
135
149
|
...rest,
|
|
136
|
-
children:
|
|
150
|
+
children: renderContent()
|
|
137
151
|
})]
|
|
138
152
|
});
|
|
139
153
|
});
|
|
140
154
|
|
|
141
|
-
//
|
|
155
|
+
// ─── Composition ──────────────────────────────────────────────────────────────
|
|
142
156
|
|
|
143
157
|
const StyledHeader = exports.StyledHeader = HeaderComponent;
|
|
144
|
-
StyledHeader.Full =
|
|
145
|
-
StyledHeader.Full.displayName = "StyledHeader.Full";
|
|
158
|
+
StyledHeader.Full = Full;
|
|
146
159
|
StyledHeader.displayName = "StyledHeader";
|
|
147
160
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_react","_interopRequireDefault","require","_reactNative","_styled","_statusBar","_index","_index2","_index3","_index4","_index5","_theme","_jsxRuntime","e","__esModule","default","StyledHeaderContainer","styled","View","base","position","flexDirection","alignItems","justifyContent","height","Platform","select","ios","android","
|
|
1
|
+
{"version":3,"names":["_react","_interopRequireDefault","require","_reactNative","_styled","_statusBar","_index","_index2","_index3","_index4","_index5","_theme","_index6","_viewStyleVariants","_jsxRuntime","e","__esModule","default","StyledHeaderContainer","styled","View","base","position","flexDirection","alignItems","justifyContent","height","Platform","select","ios","android","paddingHorizontal","variants","viewStyleVariants","viewStyleStringVariants","Full","children","jsx","Fragment","displayName","HeaderComponent","React","forwardRef","showBackArrow","backArrowProps","showStatusBar","onBackPress","title","titleAlignment","titleProps","leftIcon","rightIcon","shapeProps","statusBarProps","skipStatusBarOnAndroid","skipStatusBarOnIOS","rest","ref","renderLeft","jsxs","Stack","flex","horizontal","StyledPressable","onPress","StyleShape","cycle","ChevronLeft","size","color","theme","colors","gray","strokeWidth","StyledText","marginLeft","renderCenter","numberOfLines","renderRight","marginRight","renderContent","vertical","marginTop","getStatusBarHeight","skipAndroid","skipIos","StyledHeader","exports"],"sourceRoot":"../../../src","sources":["header/index.tsx"],"mappings":"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","ignoreList":[]}
|