@draftbit/core 46.7.4 → 46.7.5
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/components/Button.js +2 -2
- package/lib/commonjs/components/Divider.js +14 -1
- package/lib/commonjs/components/Elevation.js +14 -2
- package/lib/commonjs/components/IconButton.js +4 -2
- package/lib/commonjs/components/Justification.js +5 -1
- package/lib/commonjs/components/NumberInput.js +1 -1
- package/lib/commonjs/components/Pressable.js +2 -2
- package/lib/commonjs/components/ResizeMode.js +5 -1
- package/lib/commonjs/components/Touchable.js +2 -2
- package/lib/commonjs/constants.js +1 -1
- package/lib/commonjs/mappings/Button.js +2 -2
- package/lib/commonjs/mappings/FlashList.js +28 -0
- package/lib/commonjs/mappings/FlatList.js +14 -0
- package/lib/commonjs/mappings/IconButton.js +4 -6
- package/lib/commonjs/mappings/MapView.js +3 -1
- package/lib/commonjs/mappings/ScrollView.js +7 -1
- package/lib/commonjs/mappings/StarRating.js +6 -2
- package/lib/commonjs/mappings/Touchable.js +9 -2
- package/lib/commonjs/styles/overlay.js +1 -3
- package/lib/module/components/Button.js +2 -2
- package/lib/module/components/IconButton.js +4 -2
- package/lib/module/components/Justification.js +1 -0
- package/lib/module/components/NumberInput.js +1 -1
- package/lib/module/components/Pressable.js +2 -2
- package/lib/module/components/ResizeMode.js +1 -0
- package/lib/module/components/Touchable.js +2 -2
- package/lib/module/mappings/Button.js +2 -2
- package/lib/module/mappings/FlashList.js +29 -1
- package/lib/module/mappings/FlatList.js +15 -1
- package/lib/module/mappings/IconButton.js +5 -7
- package/lib/module/mappings/MapView.js +3 -1
- package/lib/module/mappings/ScrollView.js +8 -2
- package/lib/module/mappings/Touchable.js +10 -3
- package/lib/typescript/src/components/IconButton.d.ts +2 -0
- package/lib/typescript/src/components/IconButton.d.ts.map +1 -1
- package/lib/typescript/src/components/Pressable.d.ts.map +1 -1
- package/lib/typescript/src/components/Touchable.d.ts.map +1 -1
- package/lib/typescript/src/mappings/FlashList.d.ts +60 -0
- package/lib/typescript/src/mappings/FlashList.d.ts.map +1 -1
- package/lib/typescript/src/mappings/FlatList.d.ts +30 -0
- package/lib/typescript/src/mappings/FlatList.d.ts.map +1 -1
- package/lib/typescript/src/mappings/IconButton.d.ts +20 -10
- package/lib/typescript/src/mappings/IconButton.d.ts.map +1 -1
- package/lib/typescript/src/mappings/MapView.d.ts +2 -0
- package/lib/typescript/src/mappings/MapView.d.ts.map +1 -1
- package/lib/typescript/src/mappings/ScrollView.d.ts +21 -0
- package/lib/typescript/src/mappings/ScrollView.d.ts.map +1 -1
- package/lib/typescript/src/mappings/Touchable.d.ts +20 -0
- package/lib/typescript/src/mappings/Touchable.d.ts.map +1 -1
- package/package.json +3 -3
- package/src/Provider.js +9 -0
- package/src/components/Accordion/AccordionGroup.js +44 -0
- package/src/components/Accordion/AccordionItem.js +32 -0
- package/src/components/Accordion/index.js +2 -0
- package/src/components/ActionSheet/ActionSheet.js +45 -0
- package/src/components/ActionSheet/ActionSheetCancel.js +6 -0
- package/src/components/ActionSheet/ActionSheetItem.js +30 -0
- package/src/components/ActionSheet/index.js +3 -0
- package/src/components/AnimatedCircularProgress.js +43 -0
- package/src/components/AspectRatio.js +18 -0
- package/src/components/AvatarEdit.js +30 -0
- package/src/components/Banner.js +109 -0
- package/src/components/Button.js +114 -0
- package/src/components/Button.tsx +2 -2
- package/src/components/Card.js +57 -0
- package/src/components/Checkbox/Checkbox.js +62 -0
- package/src/components/Checkbox/CheckboxGroup.js +21 -0
- package/src/components/Checkbox/CheckboxGroupRow.js +76 -0
- package/src/components/Checkbox/CheckboxRow.js +77 -0
- package/src/components/Checkbox/context.js +14 -0
- package/src/components/Checkbox/index.js +3 -0
- package/src/components/CircleImage.js +8 -0
- package/src/components/CircularProgress.js +81 -0
- package/src/components/Config.js +64 -0
- package/src/components/Container.js +43 -0
- package/src/components/DatePicker/DatePicker.js +377 -0
- package/src/components/DatePicker/DatePickerComponent.js +13 -0
- package/src/components/DatePicker/DatePickerComponent.web.js +30 -0
- package/src/components/DatePicker/DatePickerComponentType.js +1 -0
- package/src/components/DeprecatedButton.js +83 -0
- package/src/components/DeprecatedCardWrapper.js +18 -0
- package/src/components/DeprecatedFAB.js +114 -0
- package/src/components/Divider.js +13 -0
- package/src/components/Elevation.js +20 -0
- package/src/components/FAB.js +46 -0
- package/src/components/FieldSearchBarFull.js +53 -0
- package/src/components/FormRow.js +19 -0
- package/src/components/IconButton.js +35 -0
- package/src/components/IconButton.tsx +6 -2
- package/src/components/Image.js +47 -0
- package/src/components/Justification.js +1 -0
- package/src/components/Layout.js +50 -0
- package/src/components/NumberInput.js +49 -0
- package/src/components/NumberInput.tsx +1 -1
- package/src/components/Picker/Picker.js +267 -0
- package/src/components/Picker/PickerComponent.android.js +69 -0
- package/src/components/Picker/PickerComponent.ios.js +79 -0
- package/src/components/Picker/PickerComponent.web.js +70 -0
- package/src/components/Picker/PickerTypes.js +1 -0
- package/src/components/Portal/Portal.js +35 -0
- package/src/components/Portal/PortalConsumer.js +27 -0
- package/src/components/Portal/PortalHost.js +107 -0
- package/src/components/Portal/PortalManager.js +32 -0
- package/src/components/Pressable.js +12 -0
- package/src/components/Pressable.tsx +2 -2
- package/src/components/ProgressBar.js +118 -0
- package/src/components/ProgressCircle.js +13 -0
- package/src/components/ProgressIndicator.js +27 -0
- package/src/components/RadioButton/RadioButton.js +17 -0
- package/src/components/RadioButton/RadioButtonFieldGroup.js +17 -0
- package/src/components/RadioButton/RadioButtonGroup.js +43 -0
- package/src/components/RadioButton/RadioButtonRow.js +76 -0
- package/src/components/RadioButton/context.js +14 -0
- package/src/components/RadioButton/index.js +4 -0
- package/src/components/ResizeMode.js +1 -0
- package/src/components/Row.js +48 -0
- package/src/components/RowBodyIcon.js +8 -0
- package/src/components/RowHeadlineImageCaption.js +12 -0
- package/src/components/RowHeadlineImageIcon.js +14 -0
- package/src/components/SVG.js +13 -0
- package/src/components/ScreenContainer.js +34 -0
- package/src/components/Slider.js +63 -0
- package/src/components/StarRating.js +50 -0
- package/src/components/StepIndicator.js +346 -0
- package/src/components/Stepper.js +41 -0
- package/src/components/Surface.js +32 -0
- package/src/components/Swiper/Swiper.js +29 -0
- package/src/components/Swiper/SwiperItem.js +9 -0
- package/src/components/Swiper/index.js +2 -0
- package/src/components/Switch.js +56 -0
- package/src/components/Text.js +33 -0
- package/src/components/TextField.js +428 -0
- package/src/components/ToggleButton.js +39 -0
- package/src/components/Touchable.js +12 -0
- package/src/components/Touchable.tsx +2 -2
- package/src/components/Touchable.web.js +2 -0
- package/src/components/Typography.js +36 -0
- package/src/components/useAuthState.js +31 -0
- package/src/constants.js +10 -0
- package/src/hooks.js +12 -0
- package/src/index.js +45 -0
- package/src/interfaces/Icon.js +8 -0
- package/src/mappings/Accordion.js +41 -0
- package/src/mappings/AccordionItem.js +16 -0
- package/src/mappings/ActionSheet.js +13 -0
- package/src/mappings/ActionSheetCancel.js +19 -0
- package/src/mappings/ActionSheetItem.js +23 -0
- package/src/mappings/ActivityIndicator.js +58 -0
- package/src/mappings/AudioPlayer.js +57 -0
- package/src/mappings/AvatarEdit.js +38 -0
- package/src/mappings/Banner.js +32 -0
- package/src/mappings/BlurView.js +42 -0
- package/src/mappings/Button.js +116 -0
- package/src/mappings/Button.ts +2 -2
- package/src/mappings/Card.js +52 -0
- package/src/mappings/CardBlock.js +123 -0
- package/src/mappings/CardContainer.js +104 -0
- package/src/mappings/CardContainerRating.js +126 -0
- package/src/mappings/CardContainerShortImage.js +120 -0
- package/src/mappings/CardInline.js +52 -0
- package/src/mappings/Carousel.js +19 -0
- package/src/mappings/Checkbox.js +46 -0
- package/src/mappings/CheckboxGroup.js +26 -0
- package/src/mappings/CheckboxRow.js +61 -0
- package/src/mappings/CircleImage.js +25 -0
- package/src/mappings/Container.js +30 -0
- package/src/mappings/CustomCode.js +8 -0
- package/src/mappings/DatePicker.js +176 -0
- package/src/mappings/Divider.js +27 -0
- package/src/mappings/FAB.js +37 -0
- package/src/mappings/Fetch.js +13 -0
- package/src/mappings/FieldSearchBarFull.js +50 -0
- package/src/mappings/FlashList.js +113 -0
- package/src/mappings/FlashList.ts +33 -0
- package/src/mappings/FlatList.js +51 -0
- package/src/mappings/FlatList.ts +17 -0
- package/src/mappings/HeaderLarge.js +29 -0
- package/src/mappings/HeaderMedium.js +55 -0
- package/src/mappings/HeaderOverline.js +55 -0
- package/src/mappings/Icon.js +32 -0
- package/src/mappings/IconButton.js +33 -0
- package/src/mappings/IconButton.ts +5 -7
- package/src/mappings/Image.js +35 -0
- package/src/mappings/ImageBackground.js +29 -0
- package/src/mappings/KeyboardAvoidingView.js +41 -0
- package/src/mappings/KeyboardAwareScrollView.js +50 -0
- package/src/mappings/Layout.js +200 -0
- package/src/mappings/LinearGradient.js +77 -0
- package/src/mappings/MapCallout.js +21 -0
- package/src/mappings/MapMarker.js +47 -0
- package/src/mappings/MapView.js +141 -0
- package/src/mappings/MapView.ts +2 -0
- package/src/mappings/Modal.js +42 -0
- package/src/mappings/NumberInput.js +254 -0
- package/src/mappings/Picker.js +148 -0
- package/src/mappings/ProgressBar.js +101 -0
- package/src/mappings/ProgressCircle.js +109 -0
- package/src/mappings/ProgressIndicator.js +181 -0
- package/src/mappings/RadioButton.js +51 -0
- package/src/mappings/RadioButtonGroup.js +17 -0
- package/src/mappings/RadioButtonRow.js +42 -0
- package/src/mappings/RowBodyIcon.js +75 -0
- package/src/mappings/RowHeadlineImageCaption.js +167 -0
- package/src/mappings/RowHeadlineImageIcon.js +99 -0
- package/src/mappings/SVG.js +20 -0
- package/src/mappings/SafeAreaView.js +33 -0
- package/src/mappings/ScrollView.js +37 -0
- package/src/mappings/ScrollView.ts +10 -1
- package/src/mappings/Slider.js +60 -0
- package/src/mappings/StarRating.js +43 -0
- package/src/mappings/Stepper.js +32 -0
- package/src/mappings/Surface.js +14 -0
- package/src/mappings/Swiper.js +62 -0
- package/src/mappings/SwiperItem.js +8 -0
- package/src/mappings/Switch.js +81 -0
- package/src/mappings/Text.js +251 -0
- package/src/mappings/TextArea.js +274 -0
- package/src/mappings/TextField.js +391 -0
- package/src/mappings/TextInput.js +402 -0
- package/src/mappings/ToggleButton.js +50 -0
- package/src/mappings/Touchable.js +67 -0
- package/src/mappings/Touchable.ts +12 -2
- package/src/mappings/Video.js +81 -0
- package/src/mappings/View.js +207 -0
- package/src/mappings/WebView.js +88 -0
- package/src/styles/DarkTheme.js +26 -0
- package/src/styles/DefaultTheme.js +111 -0
- package/src/styles/fonts.js +62 -0
- package/src/styles/overlay.js +60 -0
- package/src/styles/shadow.js +51 -0
- package/src/theming.js +3 -0
- package/src/utilities.js +102 -0
|
@@ -9,7 +9,6 @@ var _reactNative = require("react-native");
|
|
|
9
9
|
var _theming = require("../theming");
|
|
10
10
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
11
11
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
12
|
-
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
13
12
|
const Divider = _ref => {
|
|
14
13
|
let {
|
|
15
14
|
style,
|
|
@@ -19,6 +18,20 @@ const Divider = _ref => {
|
|
|
19
18
|
},
|
|
20
19
|
...rest
|
|
21
20
|
} = _ref;
|
|
21
|
+
return /*#__PURE__*/React.createElement(_reactNative.View, {
|
|
22
|
+
style: [{
|
|
23
|
+
backgroundColor: color || colors.divider,
|
|
24
|
+
height: _reactNative.StyleSheet.hairlineWidth
|
|
25
|
+
}, style],
|
|
26
|
+
...rest
|
|
27
|
+
});
|
|
28
|
+
};
|
|
29
|
+
var _default = (0, _theming.withTheme)(Divider);
|
|
30
|
+
exports.default = _default;eme: {
|
|
31
|
+
colors
|
|
32
|
+
},
|
|
33
|
+
...rest
|
|
34
|
+
} = _ref;
|
|
22
35
|
return /*#__PURE__*/React.createElement(_reactNative.View, _extends({
|
|
23
36
|
style: [{
|
|
24
37
|
backgroundColor: color || colors.divider,
|
|
@@ -11,7 +11,6 @@ var _theming = require("../theming");
|
|
|
11
11
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
12
12
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
13
13
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
14
|
-
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
15
14
|
/* directly copied from https://github.com/callstack/react-native-paper/blob/main/src/components/Surface.tsx#L62 */
|
|
16
15
|
const Elevation = _ref => {
|
|
17
16
|
let {
|
|
@@ -28,11 +27,24 @@ const Elevation = _ref => {
|
|
|
28
27
|
colors
|
|
29
28
|
} = theme;
|
|
30
29
|
const borderRadius = radius;
|
|
31
|
-
return /*#__PURE__*/React.createElement(_reactNative.Animated.View,
|
|
30
|
+
return /*#__PURE__*/React.createElement(_reactNative.Animated.View, {
|
|
31
|
+
...rest,
|
|
32
32
|
style: [{
|
|
33
33
|
borderRadius,
|
|
34
34
|
backgroundColor: colors.surface
|
|
35
35
|
}, elevation ? (0, _shadow.default)(elevation) : null, style]
|
|
36
|
+
}, /*#__PURE__*/React.createElement(_reactNative.View, {
|
|
37
|
+
style: {
|
|
38
|
+
overflow: "hidden",
|
|
39
|
+
borderRadius
|
|
40
|
+
}
|
|
41
|
+
}, children));
|
|
42
|
+
};
|
|
43
|
+
var _default = (0, _theming.withTheme)(Elevation);
|
|
44
|
+
exports.default = _default;
|
|
45
|
+
borderRadius,
|
|
46
|
+
backgroundColor: colors.surface
|
|
47
|
+
}, elevation ? (0, _shadow.default)(elevation) : null, style]
|
|
36
48
|
}), /*#__PURE__*/React.createElement(_reactNative.View, {
|
|
37
49
|
style: {
|
|
38
50
|
overflow: "hidden",
|
|
@@ -16,11 +16,13 @@ const IconButton = _ref => {
|
|
|
16
16
|
icon,
|
|
17
17
|
color: customColor,
|
|
18
18
|
size = 32,
|
|
19
|
-
disabled
|
|
19
|
+
disabled,
|
|
20
20
|
loading = false,
|
|
21
21
|
onPress,
|
|
22
22
|
theme,
|
|
23
23
|
style,
|
|
24
|
+
activeOpacity = 0.8,
|
|
25
|
+
disabledOpacity = 0.8,
|
|
24
26
|
...props
|
|
25
27
|
} = _ref;
|
|
26
28
|
const iconColor = customColor || theme.colors.primary;
|
|
@@ -32,7 +34,7 @@ const IconButton = _ref => {
|
|
|
32
34
|
pressed
|
|
33
35
|
} = _ref2;
|
|
34
36
|
return [styles.container, {
|
|
35
|
-
opacity: pressed
|
|
37
|
+
opacity: pressed ? activeOpacity : disabled ? disabledOpacity : 1,
|
|
36
38
|
width: size,
|
|
37
39
|
height: size,
|
|
38
40
|
alignItems: "center",
|
|
@@ -17,7 +17,7 @@ const NumberInput = _ref => {
|
|
|
17
17
|
defaultValue,
|
|
18
18
|
...props
|
|
19
19
|
} = _ref;
|
|
20
|
-
const [currentStringNumberValue, setCurrentStringNumberValue] = (0, _react.useState)("
|
|
20
|
+
const [currentStringNumberValue, setCurrentStringNumberValue] = (0, _react.useState)("");
|
|
21
21
|
const formatValueToStringNumber = valueToFormat => {
|
|
22
22
|
if (valueToFormat != null) {
|
|
23
23
|
if ((0, _lodash.isString)(valueToFormat) && valueToFormat !== "") {
|
|
@@ -12,4 +12,4 @@ const APPROX_STATUSBAR_HEIGHT = _reactNative.Platform.select({
|
|
|
12
12
|
android: DEFAULT_STATUSBAR_HEIGHT_EXPO,
|
|
13
13
|
ios: _reactNative.Platform.Version < 11 ? DEFAULT_STATUSBAR_HEIGHT_EXPO : 0
|
|
14
14
|
});
|
|
15
|
-
exports.APPROX_STATUSBAR_HEIGHT = APPROX_STATUSBAR_HEIGHT;
|
|
15
|
+
exports.APPROX_STATUSBAR_HEIGHT = APPROX_STATUSBAR_HEIGHT;AR_HEIGHT;
|
|
@@ -23,7 +23,7 @@ const SEED_DATA_PROPS = {
|
|
|
23
23
|
activeOpacity: (0, _types.createStaticNumberProp)({
|
|
24
24
|
label: "Active Opacity",
|
|
25
25
|
description: "Opacity of the button when active.",
|
|
26
|
-
defaultValue:
|
|
26
|
+
defaultValue: null,
|
|
27
27
|
min: 0,
|
|
28
28
|
max: 1,
|
|
29
29
|
step: 0.01,
|
|
@@ -33,7 +33,7 @@ const SEED_DATA_PROPS = {
|
|
|
33
33
|
disabledOpacity: (0, _types.createStaticNumberProp)({
|
|
34
34
|
label: "Disabled Opacity",
|
|
35
35
|
description: "Opacity of the button when disabled.",
|
|
36
|
-
defaultValue:
|
|
36
|
+
defaultValue: null,
|
|
37
37
|
min: 0,
|
|
38
38
|
max: 1,
|
|
39
39
|
step: 0.01,
|
|
@@ -39,6 +39,20 @@ const SEED_DATA = [{
|
|
|
39
39
|
label: "End Reached Threshold",
|
|
40
40
|
description: "How far from the end (in units of visible length of the list) the bottom edge of the list must be from the end of the content to trigger the onEndReached callback. Thus a value of 0.5 will trigger onEndReached when the end of the content is within half the visible length of the list.",
|
|
41
41
|
defaultValue: 0.5
|
|
42
|
+
}),
|
|
43
|
+
refreshColor: (0, _types.createColorProp)({
|
|
44
|
+
label: "Refreshing Color",
|
|
45
|
+
description: "Color of the refresh indicator"
|
|
46
|
+
}),
|
|
47
|
+
showsHorizontalScrollIndicator: (0, _types.createStaticBoolProp)({
|
|
48
|
+
label: "Show Horizontal Scroll Indicator",
|
|
49
|
+
description: "When true, shows a horizontal scroll indicator. The default value is true.",
|
|
50
|
+
defaultValue: true
|
|
51
|
+
}),
|
|
52
|
+
showsVerticalScrollIndicator: (0, _types.createStaticBoolProp)({
|
|
53
|
+
label: "Show Vertical Scroll Indicator",
|
|
54
|
+
description: "When true, shows a vertical scroll indicator. The default value is true.",
|
|
55
|
+
defaultValue: true
|
|
42
56
|
})
|
|
43
57
|
}
|
|
44
58
|
}, {
|
|
@@ -83,6 +97,20 @@ const SEED_DATA = [{
|
|
|
83
97
|
label: "End Reached Threshold",
|
|
84
98
|
description: "How far from the end (in units of visible length of the list) the bottom edge of the list must be from the end of the content to trigger the onEndReached callback. Thus a value of 0.5 will trigger onEndReached when the end of the content is within half the visible length of the list.",
|
|
85
99
|
defaultValue: 0.5
|
|
100
|
+
}),
|
|
101
|
+
refreshColor: (0, _types.createColorProp)({
|
|
102
|
+
label: "Refreshing Color",
|
|
103
|
+
description: "Color of the refresh indicator"
|
|
104
|
+
}),
|
|
105
|
+
showsHorizontalScrollIndicator: (0, _types.createStaticBoolProp)({
|
|
106
|
+
label: "Show Horizontal Scroll Indicator",
|
|
107
|
+
description: "When true, shows a horizontal scroll indicator. The default value is true.",
|
|
108
|
+
defaultValue: true
|
|
109
|
+
}),
|
|
110
|
+
showsVerticalScrollIndicator: (0, _types.createStaticBoolProp)({
|
|
111
|
+
label: "Show Vertical Scroll Indicator",
|
|
112
|
+
description: "When true, shows a vertical scroll indicator. The default value is true.",
|
|
113
|
+
defaultValue: true
|
|
86
114
|
})
|
|
87
115
|
}
|
|
88
116
|
}];
|
|
@@ -38,6 +38,20 @@ const SEED_DATA = {
|
|
|
38
38
|
label: "End Reached Threshold",
|
|
39
39
|
description: "How far from the end (in units of visible length of the list) the bottom edge of the list must be from the end of the content to trigger the onEndReached callback. Thus a value of 0.5 will trigger onEndReached when the end of the content is within half the visible length of the list.",
|
|
40
40
|
defaultValue: 0.5
|
|
41
|
+
}),
|
|
42
|
+
refreshColor: (0, _types.createColorProp)({
|
|
43
|
+
label: "Refreshing Color",
|
|
44
|
+
description: "Color of the refresh indicator"
|
|
45
|
+
}),
|
|
46
|
+
showsHorizontalScrollIndicator: (0, _types.createStaticBoolProp)({
|
|
47
|
+
label: "Show Horizontal Scroll Indicator",
|
|
48
|
+
description: "When true, shows a horizontal scroll indicator. The default value is true.",
|
|
49
|
+
defaultValue: true
|
|
50
|
+
}),
|
|
51
|
+
showsVerticalScrollIndicator: (0, _types.createStaticBoolProp)({
|
|
52
|
+
label: "Show Vertical Scroll Indicator",
|
|
53
|
+
description: "When true, shows a vertical scroll indicator. The default value is true.",
|
|
54
|
+
defaultValue: true
|
|
41
55
|
})
|
|
42
56
|
}
|
|
43
57
|
};
|
|
@@ -10,26 +10,24 @@ const SEED_DATA = {
|
|
|
10
10
|
tag: "IconButton",
|
|
11
11
|
category: _types.COMPONENT_TYPES.button,
|
|
12
12
|
layout: {},
|
|
13
|
-
triggers: [_types.Triggers.OnPress],
|
|
13
|
+
triggers: [_types.Triggers.OnPress, _types.Triggers.OnLongPress],
|
|
14
14
|
stylesPanelSections: [_types.StylesPanelSections.Margins, _types.StylesPanelSections.Effects, _types.StylesPanelSections.Position],
|
|
15
15
|
props: {
|
|
16
16
|
onPress: (0, _types.createActionProp)(),
|
|
17
|
+
onLongPress: (0, _types.createActionProp)(),
|
|
18
|
+
disabled: (0, _types.createDisabledProp)(),
|
|
17
19
|
icon: (0, _types.createIconProp)(),
|
|
18
20
|
color: (0, _types.createColorProp)({
|
|
19
21
|
label: "Color",
|
|
20
22
|
group: _types.GROUPS.basic
|
|
21
23
|
}),
|
|
22
|
-
disabled: (0, _types.createBoolProp)({
|
|
23
|
-
label: "Disabled",
|
|
24
|
-
group: _types.GROUPS.basic
|
|
25
|
-
}),
|
|
26
24
|
size: (0, _types.createNumberProp)({
|
|
27
25
|
group: _types.GROUPS.basic,
|
|
28
26
|
label: "Size",
|
|
29
27
|
description: "Width and height of your icon",
|
|
30
28
|
defaultValue: 32,
|
|
31
29
|
min: 16,
|
|
32
|
-
max:
|
|
30
|
+
max: 256,
|
|
33
31
|
step: 1,
|
|
34
32
|
precision: 0
|
|
35
33
|
})
|
|
@@ -12,7 +12,9 @@ const SEED_DATA = {
|
|
|
12
12
|
category: _types.COMPONENT_TYPES.view,
|
|
13
13
|
stylesPanelSections: _types.CONTAINER_COMPONENT_STYLES_SECTIONS,
|
|
14
14
|
layout: {},
|
|
15
|
+
triggers: [_types.Triggers.OnRefresh],
|
|
15
16
|
props: {
|
|
17
|
+
onRefresh: (0, _types.createActionProp)(),
|
|
16
18
|
horizontal: (0, _types.createStaticBoolProp)({
|
|
17
19
|
label: "Horizontal",
|
|
18
20
|
description: "Render your list horizontally",
|
|
@@ -21,7 +23,7 @@ const SEED_DATA = {
|
|
|
21
23
|
showsHorizontalScrollIndicator: (0, _types.createStaticBoolProp)({
|
|
22
24
|
label: "Show Horizontal Scroll Indicator",
|
|
23
25
|
description: "When true, shows a horizontal scroll indicator. The default value is true.",
|
|
24
|
-
defaultValue:
|
|
26
|
+
defaultValue: true
|
|
25
27
|
}),
|
|
26
28
|
showsVerticalScrollIndicator: (0, _types.createStaticBoolProp)({
|
|
27
29
|
label: "Show Vertical Scroll Indicator",
|
|
@@ -32,6 +34,10 @@ const SEED_DATA = {
|
|
|
32
34
|
label: "Bounce",
|
|
33
35
|
description: "When true, the scroll view bounces when it reaches the end of the content if the content is larger then the scroll view along the axis of the scroll direction.",
|
|
34
36
|
defaultValue: true
|
|
37
|
+
}),
|
|
38
|
+
refreshColor: (0, _types.createColorProp)({
|
|
39
|
+
label: "Refreshing Color",
|
|
40
|
+
description: "Color of the refresh indicator"
|
|
35
41
|
})
|
|
36
42
|
}
|
|
37
43
|
};
|
|
@@ -23,9 +23,7 @@ const SEED_DATA = {
|
|
|
23
23
|
}),
|
|
24
24
|
fieldName: (0, _types.createFieldNameProp)({
|
|
25
25
|
defaultValue: "ratingValue",
|
|
26
|
-
// this is the name of the variable declared on the screen in Draftbit
|
|
27
26
|
handlerPropName: "onPress",
|
|
28
|
-
// the change handler prop in this component
|
|
29
27
|
valuePropName: "rating" // the value prop in this component
|
|
30
28
|
}),
|
|
31
29
|
|
|
@@ -50,4 +48,10 @@ const SEED_DATA = {
|
|
|
50
48
|
})
|
|
51
49
|
}
|
|
52
50
|
};
|
|
51
|
+
exports.SEED_DATA = SEED_DATA;pes.createColorProp)({
|
|
52
|
+
label: "Inactive Color",
|
|
53
|
+
defaultValue: "divider"
|
|
54
|
+
})
|
|
55
|
+
}
|
|
56
|
+
};
|
|
53
57
|
exports.SEED_DATA = SEED_DATA;
|
|
@@ -12,10 +12,11 @@ const SEED_DATA_PROPS = {
|
|
|
12
12
|
props: {
|
|
13
13
|
onPress: (0, _types.createActionProp)(),
|
|
14
14
|
onLongPress: (0, _types.createActionProp)(),
|
|
15
|
+
disabled: (0, _types.createDisabledProp)(),
|
|
15
16
|
activeOpacity: (0, _types.createStaticNumberProp)({
|
|
16
17
|
label: "Active Opacity",
|
|
17
18
|
description: "The opacity when the button is pressed.",
|
|
18
|
-
defaultValue:
|
|
19
|
+
defaultValue: null,
|
|
19
20
|
min: 0,
|
|
20
21
|
max: 1,
|
|
21
22
|
step: 0.01,
|
|
@@ -25,7 +26,7 @@ const SEED_DATA_PROPS = {
|
|
|
25
26
|
disabledOpacity: (0, _types.createStaticNumberProp)({
|
|
26
27
|
label: "Disabled Opacity",
|
|
27
28
|
description: "The opacity when the button is disabled.",
|
|
28
|
-
defaultValue:
|
|
29
|
+
defaultValue: null,
|
|
29
30
|
min: 0,
|
|
30
31
|
max: 1,
|
|
31
32
|
step: 0.01,
|
|
@@ -41,6 +42,12 @@ const SEED_DATA_PROPS = {
|
|
|
41
42
|
label: "Hit Slop",
|
|
42
43
|
description: "Sets additional distance outside of element in which a press can be detected.",
|
|
43
44
|
required: false
|
|
45
|
+
}),
|
|
46
|
+
android_disableSound: (0, _types.createStaticBoolProp)({
|
|
47
|
+
label: "Disable Sound",
|
|
48
|
+
description: "Disable the Android sound effect.",
|
|
49
|
+
defaultValue: null,
|
|
50
|
+
group: _types.GROUPS.android
|
|
44
51
|
})
|
|
45
52
|
}
|
|
46
53
|
};
|
|
@@ -15,7 +15,6 @@ function overlay(elevation) {
|
|
|
15
15
|
let surfaceColor = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : _DarkTheme.default.colors.surface;
|
|
16
16
|
if (isAnimatedValue(elevation)) {
|
|
17
17
|
const inputRange = [0, 1, 2, 3, 8, 24];
|
|
18
|
-
|
|
19
18
|
// @ts-expect-error: TS doesn't seem to refine the type correctly
|
|
20
19
|
return elevation.interpolate({
|
|
21
20
|
inputRange,
|
|
@@ -24,7 +23,6 @@ function overlay(elevation) {
|
|
|
24
23
|
})
|
|
25
24
|
});
|
|
26
25
|
}
|
|
27
|
-
|
|
28
26
|
// @ts-expect-error: TS doesn't seem to refine the type correctly
|
|
29
27
|
return calculateColor(surfaceColor, elevation);
|
|
30
28
|
}
|
|
@@ -65,4 +63,4 @@ const elevationOverlayTransparency = {
|
|
|
65
63
|
22: 15.72,
|
|
66
64
|
23: 15.84,
|
|
67
65
|
24: 16
|
|
68
|
-
};
|
|
66
|
+
};};
|
|
@@ -8,11 +8,13 @@ const IconButton = _ref => {
|
|
|
8
8
|
icon,
|
|
9
9
|
color: customColor,
|
|
10
10
|
size = 32,
|
|
11
|
-
disabled
|
|
11
|
+
disabled,
|
|
12
12
|
loading = false,
|
|
13
13
|
onPress,
|
|
14
14
|
theme,
|
|
15
15
|
style,
|
|
16
|
+
activeOpacity = 0.8,
|
|
17
|
+
disabledOpacity = 0.8,
|
|
16
18
|
...props
|
|
17
19
|
} = _ref;
|
|
18
20
|
const iconColor = customColor || theme.colors.primary;
|
|
@@ -24,7 +26,7 @@ const IconButton = _ref => {
|
|
|
24
26
|
pressed
|
|
25
27
|
} = _ref2;
|
|
26
28
|
return [styles.container, {
|
|
27
|
-
opacity: pressed
|
|
29
|
+
opacity: pressed ? activeOpacity : disabled ? disabledOpacity : 1,
|
|
28
30
|
width: size,
|
|
29
31
|
height: size,
|
|
30
32
|
alignItems: "center",
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -9,7 +9,7 @@ const NumberInput = _ref => {
|
|
|
9
9
|
defaultValue,
|
|
10
10
|
...props
|
|
11
11
|
} = _ref;
|
|
12
|
-
const [currentStringNumberValue, setCurrentStringNumberValue] = useState("
|
|
12
|
+
const [currentStringNumberValue, setCurrentStringNumberValue] = useState("");
|
|
13
13
|
const formatValueToStringNumber = valueToFormat => {
|
|
14
14
|
if (valueToFormat != null) {
|
|
15
15
|
if (isString(valueToFormat) && valueToFormat !== "") {
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -17,7 +17,7 @@ const SEED_DATA_PROPS = {
|
|
|
17
17
|
activeOpacity: createStaticNumberProp({
|
|
18
18
|
label: "Active Opacity",
|
|
19
19
|
description: "Opacity of the button when active.",
|
|
20
|
-
defaultValue:
|
|
20
|
+
defaultValue: null,
|
|
21
21
|
min: 0,
|
|
22
22
|
max: 1,
|
|
23
23
|
step: 0.01,
|
|
@@ -27,7 +27,7 @@ const SEED_DATA_PROPS = {
|
|
|
27
27
|
disabledOpacity: createStaticNumberProp({
|
|
28
28
|
label: "Disabled Opacity",
|
|
29
29
|
description: "Opacity of the button when disabled.",
|
|
30
|
-
defaultValue:
|
|
30
|
+
defaultValue: null,
|
|
31
31
|
min: 0,
|
|
32
32
|
max: 1,
|
|
33
33
|
step: 0.01,
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { COMPONENT_TYPES, createNumColumnsType, createStaticBoolProp, createNumberProp, CONTAINER_COMPONENT_STYLES_SECTIONS, GROUPS, Triggers, createActionProp, createStaticNumberProp } from "@draftbit/types";
|
|
1
|
+
import { COMPONENT_TYPES, createNumColumnsType, createStaticBoolProp, createNumberProp, CONTAINER_COMPONENT_STYLES_SECTIONS, GROUPS, Triggers, createActionProp, createStaticNumberProp, createColorProp } from "@draftbit/types";
|
|
2
2
|
export const SEED_DATA = [{
|
|
3
3
|
name: "Masonry List",
|
|
4
4
|
tag: "MasonryFlashList",
|
|
@@ -33,6 +33,20 @@ export const SEED_DATA = [{
|
|
|
33
33
|
label: "End Reached Threshold",
|
|
34
34
|
description: "How far from the end (in units of visible length of the list) the bottom edge of the list must be from the end of the content to trigger the onEndReached callback. Thus a value of 0.5 will trigger onEndReached when the end of the content is within half the visible length of the list.",
|
|
35
35
|
defaultValue: 0.5
|
|
36
|
+
}),
|
|
37
|
+
refreshColor: createColorProp({
|
|
38
|
+
label: "Refreshing Color",
|
|
39
|
+
description: "Color of the refresh indicator"
|
|
40
|
+
}),
|
|
41
|
+
showsHorizontalScrollIndicator: createStaticBoolProp({
|
|
42
|
+
label: "Show Horizontal Scroll Indicator",
|
|
43
|
+
description: "When true, shows a horizontal scroll indicator. The default value is true.",
|
|
44
|
+
defaultValue: true
|
|
45
|
+
}),
|
|
46
|
+
showsVerticalScrollIndicator: createStaticBoolProp({
|
|
47
|
+
label: "Show Vertical Scroll Indicator",
|
|
48
|
+
description: "When true, shows a vertical scroll indicator. The default value is true.",
|
|
49
|
+
defaultValue: true
|
|
36
50
|
})
|
|
37
51
|
}
|
|
38
52
|
}, {
|
|
@@ -77,6 +91,20 @@ export const SEED_DATA = [{
|
|
|
77
91
|
label: "End Reached Threshold",
|
|
78
92
|
description: "How far from the end (in units of visible length of the list) the bottom edge of the list must be from the end of the content to trigger the onEndReached callback. Thus a value of 0.5 will trigger onEndReached when the end of the content is within half the visible length of the list.",
|
|
79
93
|
defaultValue: 0.5
|
|
94
|
+
}),
|
|
95
|
+
refreshColor: createColorProp({
|
|
96
|
+
label: "Refreshing Color",
|
|
97
|
+
description: "Color of the refresh indicator"
|
|
98
|
+
}),
|
|
99
|
+
showsHorizontalScrollIndicator: createStaticBoolProp({
|
|
100
|
+
label: "Show Horizontal Scroll Indicator",
|
|
101
|
+
description: "When true, shows a horizontal scroll indicator. The default value is true.",
|
|
102
|
+
defaultValue: true
|
|
103
|
+
}),
|
|
104
|
+
showsVerticalScrollIndicator: createStaticBoolProp({
|
|
105
|
+
label: "Show Vertical Scroll Indicator",
|
|
106
|
+
description: "When true, shows a vertical scroll indicator. The default value is true.",
|
|
107
|
+
defaultValue: true
|
|
80
108
|
})
|
|
81
109
|
}
|
|
82
110
|
}];
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { COMPONENT_TYPES, createNumColumnsType, createStaticBoolProp, CONTAINER_COMPONENT_STYLES_SECTIONS, Triggers, createActionProp, createStaticNumberProp } from "@draftbit/types";
|
|
1
|
+
import { COMPONENT_TYPES, createNumColumnsType, createStaticBoolProp, CONTAINER_COMPONENT_STYLES_SECTIONS, Triggers, createActionProp, createStaticNumberProp, createColorProp } from "@draftbit/types";
|
|
2
2
|
export const SEED_DATA = {
|
|
3
3
|
name: "List",
|
|
4
4
|
tag: "FlatList",
|
|
@@ -32,6 +32,20 @@ export const SEED_DATA = {
|
|
|
32
32
|
label: "End Reached Threshold",
|
|
33
33
|
description: "How far from the end (in units of visible length of the list) the bottom edge of the list must be from the end of the content to trigger the onEndReached callback. Thus a value of 0.5 will trigger onEndReached when the end of the content is within half the visible length of the list.",
|
|
34
34
|
defaultValue: 0.5
|
|
35
|
+
}),
|
|
36
|
+
refreshColor: createColorProp({
|
|
37
|
+
label: "Refreshing Color",
|
|
38
|
+
description: "Color of the refresh indicator"
|
|
39
|
+
}),
|
|
40
|
+
showsHorizontalScrollIndicator: createStaticBoolProp({
|
|
41
|
+
label: "Show Horizontal Scroll Indicator",
|
|
42
|
+
description: "When true, shows a horizontal scroll indicator. The default value is true.",
|
|
43
|
+
defaultValue: true
|
|
44
|
+
}),
|
|
45
|
+
showsVerticalScrollIndicator: createStaticBoolProp({
|
|
46
|
+
label: "Show Vertical Scroll Indicator",
|
|
47
|
+
description: "When true, shows a vertical scroll indicator. The default value is true.",
|
|
48
|
+
defaultValue: true
|
|
35
49
|
})
|
|
36
50
|
}
|
|
37
51
|
};
|
|
@@ -1,29 +1,27 @@
|
|
|
1
|
-
import { COMPONENT_TYPES, GROUPS, createIconProp, createColorProp, createNumberProp,
|
|
1
|
+
import { COMPONENT_TYPES, GROUPS, createIconProp, createColorProp, createNumberProp, createActionProp, Triggers, StylesPanelSections, createDisabledProp } from "@draftbit/types";
|
|
2
2
|
export const SEED_DATA = {
|
|
3
3
|
name: "Icon Button",
|
|
4
4
|
tag: "IconButton",
|
|
5
5
|
category: COMPONENT_TYPES.button,
|
|
6
6
|
layout: {},
|
|
7
|
-
triggers: [Triggers.OnPress],
|
|
7
|
+
triggers: [Triggers.OnPress, Triggers.OnLongPress],
|
|
8
8
|
stylesPanelSections: [StylesPanelSections.Margins, StylesPanelSections.Effects, StylesPanelSections.Position],
|
|
9
9
|
props: {
|
|
10
10
|
onPress: createActionProp(),
|
|
11
|
+
onLongPress: createActionProp(),
|
|
12
|
+
disabled: createDisabledProp(),
|
|
11
13
|
icon: createIconProp(),
|
|
12
14
|
color: createColorProp({
|
|
13
15
|
label: "Color",
|
|
14
16
|
group: GROUPS.basic
|
|
15
17
|
}),
|
|
16
|
-
disabled: createBoolProp({
|
|
17
|
-
label: "Disabled",
|
|
18
|
-
group: GROUPS.basic
|
|
19
|
-
}),
|
|
20
18
|
size: createNumberProp({
|
|
21
19
|
group: GROUPS.basic,
|
|
22
20
|
label: "Size",
|
|
23
21
|
description: "Width and height of your icon",
|
|
24
22
|
defaultValue: 32,
|
|
25
23
|
min: 16,
|
|
26
|
-
max:
|
|
24
|
+
max: 256,
|
|
27
25
|
step: 1,
|
|
28
26
|
precision: 0
|
|
29
27
|
})
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { COMPONENT_TYPES, createStaticBoolProp, CONTAINER_COMPONENT_STYLES_SECTIONS } from "@draftbit/types";
|
|
1
|
+
import { COMPONENT_TYPES, createStaticBoolProp, CONTAINER_COMPONENT_STYLES_SECTIONS, Triggers, createActionProp, createColorProp } from "@draftbit/types";
|
|
2
2
|
export const SEED_DATA = {
|
|
3
3
|
name: "Scroll View",
|
|
4
4
|
tag: "ScrollView",
|
|
@@ -6,7 +6,9 @@ export const SEED_DATA = {
|
|
|
6
6
|
category: COMPONENT_TYPES.view,
|
|
7
7
|
stylesPanelSections: CONTAINER_COMPONENT_STYLES_SECTIONS,
|
|
8
8
|
layout: {},
|
|
9
|
+
triggers: [Triggers.OnRefresh],
|
|
9
10
|
props: {
|
|
11
|
+
onRefresh: createActionProp(),
|
|
10
12
|
horizontal: createStaticBoolProp({
|
|
11
13
|
label: "Horizontal",
|
|
12
14
|
description: "Render your list horizontally",
|
|
@@ -15,7 +17,7 @@ export const SEED_DATA = {
|
|
|
15
17
|
showsHorizontalScrollIndicator: createStaticBoolProp({
|
|
16
18
|
label: "Show Horizontal Scroll Indicator",
|
|
17
19
|
description: "When true, shows a horizontal scroll indicator. The default value is true.",
|
|
18
|
-
defaultValue:
|
|
20
|
+
defaultValue: true
|
|
19
21
|
}),
|
|
20
22
|
showsVerticalScrollIndicator: createStaticBoolProp({
|
|
21
23
|
label: "Show Vertical Scroll Indicator",
|
|
@@ -26,6 +28,10 @@ export const SEED_DATA = {
|
|
|
26
28
|
label: "Bounce",
|
|
27
29
|
description: "When true, the scroll view bounces when it reaches the end of the content if the content is larger then the scroll view along the axis of the scroll direction.",
|
|
28
30
|
defaultValue: true
|
|
31
|
+
}),
|
|
32
|
+
refreshColor: createColorProp({
|
|
33
|
+
label: "Refreshing Color",
|
|
34
|
+
description: "Color of the refresh indicator"
|
|
29
35
|
})
|
|
30
36
|
}
|
|
31
37
|
};
|