@hero-design/rn 8.122.0 → 8.123.1-test-dispatch-downstream.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 +25 -13
- package/es/index.js +281 -32
- package/lib/index.js +281 -31
- package/package.json +7 -7
- package/src/components/InlineLoader/AnimatedGradientText.tsx +135 -0
- package/src/components/InlineLoader/InlineLoader.tsx +93 -0
- package/src/components/InlineLoader/StyledInlineLoader.tsx +20 -0
- package/src/components/InlineLoader/index.tsx +4 -0
- package/src/components/InlineLoader/types.ts +9 -0
- package/src/components/InlineLoader/utils.ts +66 -0
- package/src/index.ts +5 -0
- package/src/theme/components/inlineLoader.ts +18 -0
- package/src/theme/getTheme.ts +3 -0
- package/types/components/InlineLoader/AnimatedGradientText.d.ts +8 -0
- package/types/components/InlineLoader/InlineLoader.d.ts +31 -0
- package/types/components/InlineLoader/StyledInlineLoader.d.ts +18 -0
- package/types/components/InlineLoader/index.d.ts +3 -0
- package/types/components/InlineLoader/types.d.ts +4 -0
- package/types/components/InlineLoader/utils.d.ts +9 -0
- package/types/index.d.ts +2 -1
- package/types/theme/components/inlineLoader.d.ts +16 -0
- package/types/theme/getTheme.d.ts +2 -0
package/CHANGELOG.md
CHANGED
|
@@ -1,32 +1,44 @@
|
|
|
1
1
|
# @hero-design/rn
|
|
2
2
|
|
|
3
|
-
## 8.
|
|
3
|
+
## 8.123.1-test-dispatch-downstream.0
|
|
4
4
|
|
|
5
|
-
###
|
|
5
|
+
### Patch Changes
|
|
6
6
|
|
|
7
|
-
-
|
|
7
|
+
- test
|
|
8
8
|
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
9
|
+
- Updated dependencies []:
|
|
10
|
+
- @hero-design/react-native-month-year-picker@8.45.3-test-dispatch-downstream.0
|
|
11
|
+
- @hero-design/colors@8.47.4-test-dispatch-downstream.0
|
|
12
12
|
|
|
13
|
-
## 8.
|
|
13
|
+
## 8.120.2-test-dispatch-downstream.2
|
|
14
14
|
|
|
15
|
-
###
|
|
15
|
+
### Patch Changes
|
|
16
16
|
|
|
17
|
-
-
|
|
17
|
+
- test dispatch workflow
|
|
18
18
|
|
|
19
|
-
-
|
|
19
|
+
- Updated dependencies []:
|
|
20
|
+
- @hero-design/react-native-month-year-picker@8.45.3-test-dispatch-downstream.2
|
|
21
|
+
- @hero-design/colors@8.47.4-test-dispatch-downstream.2
|
|
22
|
+
|
|
23
|
+
## 8.120.2-test-dispatch-downstream.1
|
|
20
24
|
|
|
21
25
|
### Patch Changes
|
|
22
26
|
|
|
23
|
-
-
|
|
27
|
+
- test
|
|
28
|
+
|
|
29
|
+
- Updated dependencies []:
|
|
30
|
+
- @hero-design/react-native-month-year-picker@8.45.3-test-dispatch-downstream.1
|
|
31
|
+
- @hero-design/colors@8.47.4-test-dispatch-downstream.1
|
|
24
32
|
|
|
25
|
-
## 8.120.2
|
|
33
|
+
## 8.120.2-test-dispatch-downstream.0
|
|
26
34
|
|
|
27
35
|
### Patch Changes
|
|
28
36
|
|
|
29
|
-
-
|
|
37
|
+
- bump test version
|
|
38
|
+
|
|
39
|
+
- Updated dependencies []:
|
|
40
|
+
- @hero-design/colors@8.47.4-test-dispatch-downstream.0
|
|
41
|
+
- @hero-design/react-native-month-year-picker@8.45.3-test-dispatch-downstream.0
|
|
30
42
|
|
|
31
43
|
## 8.120.1
|
|
32
44
|
|
package/es/index.js
CHANGED
|
@@ -7886,6 +7886,23 @@ var getSegmentedControlTheme = function getSegmentedControlTheme(theme) {
|
|
|
7886
7886
|
};
|
|
7887
7887
|
};
|
|
7888
7888
|
|
|
7889
|
+
var getInlineLoaderTheme = function getInlineLoaderTheme(theme) {
|
|
7890
|
+
return {
|
|
7891
|
+
space: {
|
|
7892
|
+
gap: theme.space.small
|
|
7893
|
+
},
|
|
7894
|
+
icon: {
|
|
7895
|
+
lineHeights: {
|
|
7896
|
+
xsmall: theme.lineHeights.xsmall,
|
|
7897
|
+
small: theme.lineHeights.small,
|
|
7898
|
+
medium: theme.lineHeights.medium,
|
|
7899
|
+
large: theme.lineHeights.large,
|
|
7900
|
+
xlarge: theme.lineHeights.xlarge
|
|
7901
|
+
}
|
|
7902
|
+
}
|
|
7903
|
+
};
|
|
7904
|
+
};
|
|
7905
|
+
|
|
7889
7906
|
var getTheme = function getTheme() {
|
|
7890
7907
|
var scale = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : scale$1;
|
|
7891
7908
|
var systemPallete = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : swagSystemPalette$2;
|
|
@@ -7947,6 +7964,7 @@ var getTheme = function getTheme() {
|
|
|
7947
7964
|
toolbar: getToolbarTheme(globalTheme),
|
|
7948
7965
|
typography: getTypographyTheme(globalTheme),
|
|
7949
7966
|
floatingIsland: getFloatingIslandTheme(globalTheme),
|
|
7967
|
+
inlineLoader: getInlineLoaderTheme(globalTheme),
|
|
7950
7968
|
segmentedControl: getSegmentedControlTheme(globalTheme)
|
|
7951
7969
|
}
|
|
7952
7970
|
});
|
|
@@ -9397,7 +9415,7 @@ var StyledContent$1 = index$c(View)(function (_ref) {
|
|
|
9397
9415
|
alignSelf: 'center'
|
|
9398
9416
|
};
|
|
9399
9417
|
});
|
|
9400
|
-
var StyledContainer$
|
|
9418
|
+
var StyledContainer$a = index$c(View)(function (_ref2) {
|
|
9401
9419
|
var theme = _ref2.theme;
|
|
9402
9420
|
return {
|
|
9403
9421
|
width: '100%',
|
|
@@ -9405,7 +9423,7 @@ var StyledContainer$9 = index$c(View)(function (_ref2) {
|
|
|
9405
9423
|
backgroundColor: theme.__hd__.appCue.colors.backdropColor
|
|
9406
9424
|
};
|
|
9407
9425
|
});
|
|
9408
|
-
var StyledIconContainer$
|
|
9426
|
+
var StyledIconContainer$2 = index$c(Animated.View)(function (_ref3) {
|
|
9409
9427
|
var theme = _ref3.theme,
|
|
9410
9428
|
themePlacement = _ref3.themePlacement;
|
|
9411
9429
|
return _objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2({
|
|
@@ -9720,7 +9738,7 @@ var AppCue = function AppCue(_ref) {
|
|
|
9720
9738
|
onPress: function onPress() {
|
|
9721
9739
|
return setVisible(false);
|
|
9722
9740
|
}
|
|
9723
|
-
}, /*#__PURE__*/React__default.createElement(StyledContainer$
|
|
9741
|
+
}, /*#__PURE__*/React__default.createElement(StyledContainer$a, null, /*#__PURE__*/React__default.createElement(View, {
|
|
9724
9742
|
style: StyleSheet$1.flatten([{
|
|
9725
9743
|
position: 'absolute',
|
|
9726
9744
|
top: pos.top,
|
|
@@ -9735,7 +9753,7 @@ var AppCue = function AppCue(_ref) {
|
|
|
9735
9753
|
maxWidth: maxWidth
|
|
9736
9754
|
},
|
|
9737
9755
|
testID: testID && "".concat(testID, "-content")
|
|
9738
|
-
}, renderContent()), /*#__PURE__*/React__default.createElement(StyledIconContainer$
|
|
9756
|
+
}, renderContent()), /*#__PURE__*/React__default.createElement(StyledIconContainer$2, {
|
|
9739
9757
|
themePlacement: placement,
|
|
9740
9758
|
testID: testID && "".concat(testID, "-arrow")
|
|
9741
9759
|
}, /*#__PURE__*/React__default.createElement(Icon, {
|
|
@@ -9744,7 +9762,7 @@ var AppCue = function AppCue(_ref) {
|
|
|
9744
9762
|
})))))));
|
|
9745
9763
|
};
|
|
9746
9764
|
|
|
9747
|
-
var StyledContainer$
|
|
9765
|
+
var StyledContainer$9 = index$c(View)({
|
|
9748
9766
|
alignItems: 'center',
|
|
9749
9767
|
flexDirection: 'row'
|
|
9750
9768
|
});
|
|
@@ -9786,7 +9804,7 @@ var Attachment = function Attachment(_ref) {
|
|
|
9786
9804
|
backgroundHighlighted = _ref$backgroundHighli === void 0 ? false : _ref$backgroundHighli,
|
|
9787
9805
|
style = _ref.style,
|
|
9788
9806
|
testID = _ref.testID;
|
|
9789
|
-
return /*#__PURE__*/React__default.createElement(StyledContainer$
|
|
9807
|
+
return /*#__PURE__*/React__default.createElement(StyledContainer$9, {
|
|
9790
9808
|
testID: testID,
|
|
9791
9809
|
style: style
|
|
9792
9810
|
}, /*#__PURE__*/React__default.createElement(StyledContentContainer$1, {
|
|
@@ -13908,7 +13926,7 @@ function ContentNavigator(_ref) {
|
|
|
13908
13926
|
}));
|
|
13909
13927
|
}
|
|
13910
13928
|
|
|
13911
|
-
var StyledContainer$
|
|
13929
|
+
var StyledContainer$8 = index$c(View)(function (_ref) {
|
|
13912
13930
|
var theme = _ref.theme;
|
|
13913
13931
|
return {
|
|
13914
13932
|
backgroundColor: theme.__hd__.calendar.colors.background
|
|
@@ -14343,7 +14361,7 @@ var CalendarRange = function CalendarRange(_ref) {
|
|
|
14343
14361
|
textIntent: isCurrentMonth ? undefined : 'subdued'
|
|
14344
14362
|
});
|
|
14345
14363
|
};
|
|
14346
|
-
return /*#__PURE__*/React__default.createElement(StyledContainer$
|
|
14364
|
+
return /*#__PURE__*/React__default.createElement(StyledContainer$8, {
|
|
14347
14365
|
testID: testID
|
|
14348
14366
|
}, /*#__PURE__*/React__default.createElement(StyledCalendarHeader, null, /*#__PURE__*/React__default.createElement(ContentNavigator, {
|
|
14349
14367
|
value: !shouldShowMonthPicker ? formatTime('MMMM yyyy', visibleDate) : /*#__PURE__*/React__default.createElement(TouchableOpacity, {
|
|
@@ -14477,7 +14495,7 @@ var Calendar$1 = function Calendar(_ref) {
|
|
|
14477
14495
|
monthPickerVisible = _useState2[0],
|
|
14478
14496
|
setMonthPickerVisible = _useState2[1];
|
|
14479
14497
|
var now = new Date();
|
|
14480
|
-
return /*#__PURE__*/React__default.createElement(StyledContainer$
|
|
14498
|
+
return /*#__PURE__*/React__default.createElement(StyledContainer$8, {
|
|
14481
14499
|
testID: testID
|
|
14482
14500
|
}, /*#__PURE__*/React__default.createElement(StyledCalendarHeader, null, /*#__PURE__*/React__default.createElement(ContentNavigator, {
|
|
14483
14501
|
value: !shouldShowMonthPicker ? formatTime('MMMM yyyy', visibleDate) : /*#__PURE__*/React__default.createElement(TouchableOpacity, {
|
|
@@ -20625,7 +20643,7 @@ var index$9 = Object.assign(DefaultCheckbox, {
|
|
|
20625
20643
|
Inline: InlineCheckbox
|
|
20626
20644
|
});
|
|
20627
20645
|
|
|
20628
|
-
var StyledContainer$
|
|
20646
|
+
var StyledContainer$7 = index$c(View)(function (_ref) {
|
|
20629
20647
|
var theme = _ref.theme;
|
|
20630
20648
|
return {
|
|
20631
20649
|
width: '100%',
|
|
@@ -21013,7 +21031,7 @@ var TextInput = /*#__PURE__*/forwardRef(function (_ref8, ref) {
|
|
|
21013
21031
|
defaultValue: defaultValue,
|
|
21014
21032
|
placeholder: isFocused || label === undefined ? nativeProps.placeholder : EMPTY_PLACEHOLDER_VALUE
|
|
21015
21033
|
});
|
|
21016
|
-
return /*#__PURE__*/React__default.createElement(StyledContainer$
|
|
21034
|
+
return /*#__PURE__*/React__default.createElement(StyledContainer$7, {
|
|
21017
21035
|
style: styleWithoutBackgroundColor,
|
|
21018
21036
|
pointerEvents: state === 'disabled' || state === 'readonly' ? 'none' : 'auto',
|
|
21019
21037
|
testID: testID
|
|
@@ -21693,7 +21711,7 @@ var index$8 = Object.assign(PublicDatePicker, {
|
|
|
21693
21711
|
});
|
|
21694
21712
|
|
|
21695
21713
|
var AnimatedPressable = Animated.createAnimatedComponent(Pressable);
|
|
21696
|
-
var StyledContainer$
|
|
21714
|
+
var StyledContainer$6 = index$c(View)(function (_ref) {
|
|
21697
21715
|
var theme = _ref.theme,
|
|
21698
21716
|
enableShadow = _ref.enableShadow;
|
|
21699
21717
|
return _objectSpread2(_objectSpread2({}, StyleSheet$1.absoluteFillObject), {}, {
|
|
@@ -21953,7 +21971,7 @@ var Drawer = function Drawer(_ref) {
|
|
|
21953
21971
|
return animation.stop();
|
|
21954
21972
|
};
|
|
21955
21973
|
}, [visible]);
|
|
21956
|
-
return /*#__PURE__*/React__default.createElement(StyledContainer$
|
|
21974
|
+
return /*#__PURE__*/React__default.createElement(StyledContainer$6, {
|
|
21957
21975
|
testID: testID,
|
|
21958
21976
|
enableShadow: enableShadow,
|
|
21959
21977
|
pointerEvents: "box-none"
|
|
@@ -23944,7 +23962,7 @@ var StyledFABText = index$c(Typography.Body)(function (_ref3) {
|
|
|
23944
23962
|
marginHorizontal: theme.__hd__.fab.space.titleMarginHorizontal
|
|
23945
23963
|
};
|
|
23946
23964
|
});
|
|
23947
|
-
var StyledIconContainer = index$c(Box)(function (_ref4) {
|
|
23965
|
+
var StyledIconContainer$1 = index$c(Box)(function (_ref4) {
|
|
23948
23966
|
var theme = _ref4.theme;
|
|
23949
23967
|
return {
|
|
23950
23968
|
width: theme.__hd__.fab.sizes.iconContainerWidth,
|
|
@@ -23988,7 +24006,7 @@ var ActionItem = function ActionItem(_ref) {
|
|
|
23988
24006
|
style: style,
|
|
23989
24007
|
onPress: onPress,
|
|
23990
24008
|
testID: testID
|
|
23991
|
-
}, /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(StyledIconContainer, null, /*#__PURE__*/React__default.createElement(StyledIcon$3, {
|
|
24009
|
+
}, /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(StyledIconContainer$1, null, /*#__PURE__*/React__default.createElement(StyledIcon$3, {
|
|
23992
24010
|
size: "xsmall",
|
|
23993
24011
|
icon: icon
|
|
23994
24012
|
})), /*#__PURE__*/React__default.createElement(StyledActionItemText, null, title))));
|
|
@@ -24037,14 +24055,14 @@ var IconOnlyContent = function IconOnlyContent(_ref) {
|
|
|
24037
24055
|
animated = _ref.animated,
|
|
24038
24056
|
active = _ref.active;
|
|
24039
24057
|
if (animated) {
|
|
24040
|
-
return /*#__PURE__*/React__default.createElement(StyledIconContainer, null, /*#__PURE__*/React__default.createElement(AnimatedFABIcon, {
|
|
24058
|
+
return /*#__PURE__*/React__default.createElement(StyledIconContainer$1, null, /*#__PURE__*/React__default.createElement(AnimatedFABIcon, {
|
|
24041
24059
|
active: active,
|
|
24042
24060
|
icon: icon,
|
|
24043
24061
|
testID: "animated-fab-icon",
|
|
24044
24062
|
size: "xsmall"
|
|
24045
24063
|
}));
|
|
24046
24064
|
}
|
|
24047
|
-
return /*#__PURE__*/React__default.createElement(StyledIconContainer, null, /*#__PURE__*/React__default.createElement(StyledFABIcon, {
|
|
24065
|
+
return /*#__PURE__*/React__default.createElement(StyledIconContainer$1, null, /*#__PURE__*/React__default.createElement(StyledFABIcon, {
|
|
24048
24066
|
size: "xsmall",
|
|
24049
24067
|
icon: icon,
|
|
24050
24068
|
testID: "styled-fab-icon"
|
|
@@ -24053,7 +24071,7 @@ var IconOnlyContent = function IconOnlyContent(_ref) {
|
|
|
24053
24071
|
var IconWithTextContent = function IconWithTextContent(_ref2) {
|
|
24054
24072
|
var icon = _ref2.icon,
|
|
24055
24073
|
title = _ref2.title;
|
|
24056
|
-
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(StyledIconContainer, null, /*#__PURE__*/React__default.createElement(StyledFABIcon, {
|
|
24074
|
+
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(StyledIconContainer$1, null, /*#__PURE__*/React__default.createElement(StyledFABIcon, {
|
|
24057
24075
|
size: "xsmall",
|
|
24058
24076
|
icon: icon,
|
|
24059
24077
|
testID: "styled-fab-icon"
|
|
@@ -24211,7 +24229,7 @@ var FAB$1 = /*#__PURE__*/forwardRef(function (_ref3, ref) {
|
|
|
24211
24229
|
});
|
|
24212
24230
|
FAB$1.displayName = 'FAB';
|
|
24213
24231
|
|
|
24214
|
-
var StyledContainer$
|
|
24232
|
+
var StyledContainer$5 = index$c(View)({
|
|
24215
24233
|
position: 'absolute',
|
|
24216
24234
|
left: 0,
|
|
24217
24235
|
right: 0,
|
|
@@ -24318,7 +24336,7 @@ var ActionGroup = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
24318
24336
|
inputRange: [0, 1],
|
|
24319
24337
|
outputRange: [0, 1]
|
|
24320
24338
|
});
|
|
24321
|
-
return /*#__PURE__*/React__default.createElement(StyledContainer$
|
|
24339
|
+
return /*#__PURE__*/React__default.createElement(StyledContainer$5, {
|
|
24322
24340
|
testID: testID,
|
|
24323
24341
|
pointerEvents: "box-none",
|
|
24324
24342
|
style: style
|
|
@@ -25049,7 +25067,7 @@ var HeroDesignProvider = function HeroDesignProvider(_ref) {
|
|
|
25049
25067
|
}, /*#__PURE__*/React__default.createElement(Toast.Provider, null, /*#__PURE__*/React__default.createElement(Portal.Provider, null, children))));
|
|
25050
25068
|
};
|
|
25051
25069
|
|
|
25052
|
-
var StyledContainer$
|
|
25070
|
+
var StyledContainer$4 = index$c(View)(function (_ref) {
|
|
25053
25071
|
var theme = _ref.theme;
|
|
25054
25072
|
return {
|
|
25055
25073
|
width: theme.__hd__.mapPin.sizes["default"],
|
|
@@ -25129,7 +25147,7 @@ var MapPinFocussed = function MapPinFocussed(_ref) {
|
|
|
25129
25147
|
var style = _ref.style,
|
|
25130
25148
|
testID = _ref.testID,
|
|
25131
25149
|
nativeProps = _objectWithoutProperties(_ref, _excluded$o);
|
|
25132
|
-
return /*#__PURE__*/React__default.createElement(StyledContainer$
|
|
25150
|
+
return /*#__PURE__*/React__default.createElement(StyledContainer$4, _extends$1({}, nativeProps, {
|
|
25133
25151
|
style: style,
|
|
25134
25152
|
testID: testID
|
|
25135
25153
|
}), /*#__PURE__*/React__default.createElement(StyledFocusIcon, {
|
|
@@ -25156,7 +25174,7 @@ var MapPin = function MapPin(_ref) {
|
|
|
25156
25174
|
icon = _ref.icon,
|
|
25157
25175
|
nativeProps = _objectWithoutProperties(_ref, _excluded$n);
|
|
25158
25176
|
var badgeIcon = getBadgeIconName(state);
|
|
25159
|
-
return /*#__PURE__*/React__default.createElement(StyledContainer$
|
|
25177
|
+
return /*#__PURE__*/React__default.createElement(StyledContainer$4, _extends$1({}, nativeProps, {
|
|
25160
25178
|
style: style,
|
|
25161
25179
|
testID: testID
|
|
25162
25180
|
}), /*#__PURE__*/React__default.createElement(StyledContent, {
|
|
@@ -25438,7 +25456,7 @@ var PinInput = /*#__PURE__*/forwardRef(function (_ref2, ref) {
|
|
|
25438
25456
|
});
|
|
25439
25457
|
PinInput.displayName = 'PinInput';
|
|
25440
25458
|
|
|
25441
|
-
var StyledContainer$
|
|
25459
|
+
var StyledContainer$3 = index$c(View)(function (_ref) {
|
|
25442
25460
|
var theme = _ref.theme;
|
|
25443
25461
|
return {
|
|
25444
25462
|
flexDirection: 'row',
|
|
@@ -25510,7 +25528,7 @@ var ProgressCircle = function ProgressCircle(_ref) {
|
|
|
25510
25528
|
return /*#__PURE__*/React__default.createElement(View, _extends$1({}, nativeProps, {
|
|
25511
25529
|
testID: testID,
|
|
25512
25530
|
style: style
|
|
25513
|
-
}), /*#__PURE__*/React__default.createElement(StyledContainer$
|
|
25531
|
+
}), /*#__PURE__*/React__default.createElement(StyledContainer$3, null, /*#__PURE__*/React__default.createElement(Svg, {
|
|
25514
25532
|
width: size,
|
|
25515
25533
|
height: size,
|
|
25516
25534
|
viewBox: "0 0 ".concat(size, " ").concat(size)
|
|
@@ -27244,7 +27262,7 @@ var index$4 = Object.assign(SingleSelect, {
|
|
|
27244
27262
|
Multi: MultiSelect
|
|
27245
27263
|
});
|
|
27246
27264
|
|
|
27247
|
-
var StyledContainer$
|
|
27265
|
+
var StyledContainer$2 = index$c(Box)(function (_ref) {
|
|
27248
27266
|
var theme = _ref.theme,
|
|
27249
27267
|
themeIntent = _ref.themeIntent,
|
|
27250
27268
|
themeVariant = _ref.themeVariant;
|
|
@@ -27330,7 +27348,7 @@ var Skeleton = function Skeleton(_ref) {
|
|
|
27330
27348
|
}
|
|
27331
27349
|
onLayout === null || onLayout === void 0 || onLayout(e);
|
|
27332
27350
|
}, []);
|
|
27333
|
-
return /*#__PURE__*/React__default.createElement(StyledContainer$
|
|
27351
|
+
return /*#__PURE__*/React__default.createElement(StyledContainer$2, _extends$1({
|
|
27334
27352
|
style: style,
|
|
27335
27353
|
themeVariant: variant,
|
|
27336
27354
|
themeIntent: intent,
|
|
@@ -41305,7 +41323,7 @@ var RichTextEditor = function RichTextEditor(_ref) {
|
|
|
41305
41323
|
onBlur === null || onBlur === void 0 || onBlur();
|
|
41306
41324
|
setIsFocused(false);
|
|
41307
41325
|
}, [onBlur]);
|
|
41308
|
-
return /*#__PURE__*/React__default.createElement(StyledContainer$
|
|
41326
|
+
return /*#__PURE__*/React__default.createElement(StyledContainer$7, {
|
|
41309
41327
|
testID: testID
|
|
41310
41328
|
}, /*#__PURE__*/React__default.createElement(StyledLabelContainerInsideTextInput, {
|
|
41311
41329
|
themeHasPrefix: false,
|
|
@@ -41559,7 +41577,7 @@ function SectionListWithFAB(_ref) {
|
|
|
41559
41577
|
});
|
|
41560
41578
|
}
|
|
41561
41579
|
|
|
41562
|
-
var StyledContainer = index$c(View)(function () {
|
|
41580
|
+
var StyledContainer$1 = index$c(View)(function () {
|
|
41563
41581
|
return {
|
|
41564
41582
|
width: '100%'
|
|
41565
41583
|
};
|
|
@@ -41664,7 +41682,7 @@ var SearchTwoLine = function SearchTwoLine(props) {
|
|
|
41664
41682
|
_props$variant = props.variant,
|
|
41665
41683
|
variant = _props$variant === void 0 ? 'basic' : _props$variant,
|
|
41666
41684
|
accessible = props.accessible;
|
|
41667
|
-
return /*#__PURE__*/React__default.createElement(StyledContainer, {
|
|
41685
|
+
return /*#__PURE__*/React__default.createElement(StyledContainer$1, {
|
|
41668
41686
|
style: style,
|
|
41669
41687
|
testID: testID,
|
|
41670
41688
|
accessible: accessible
|
|
@@ -41781,7 +41799,7 @@ var SearchOneLine = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
|
41781
41799
|
}));
|
|
41782
41800
|
};
|
|
41783
41801
|
var shouldShowClearButton = clearable && (state === 'filled' || isFocused) && !isEmptyValue;
|
|
41784
|
-
return /*#__PURE__*/React__default.createElement(StyledContainer, {
|
|
41802
|
+
return /*#__PURE__*/React__default.createElement(StyledContainer$1, {
|
|
41785
41803
|
pointerEvents: state === 'disabled' || state === 'readonly' ? 'none' : 'auto',
|
|
41786
41804
|
testID: testID,
|
|
41787
41805
|
style: style,
|
|
@@ -42238,4 +42256,235 @@ var FilterTrigger = function FilterTrigger(_ref) {
|
|
|
42238
42256
|
})));
|
|
42239
42257
|
};
|
|
42240
42258
|
|
|
42241
|
-
|
|
42259
|
+
var ANIMATION_DURATION_MS = 2000;
|
|
42260
|
+
var AnimatedGradientText = function AnimatedGradientText(_ref) {
|
|
42261
|
+
var children = _ref.children,
|
|
42262
|
+
fontSize = _ref.fontSize,
|
|
42263
|
+
lineHeight = _ref.lineHeight;
|
|
42264
|
+
var theme = useTheme();
|
|
42265
|
+
var gradient = theme.colors.gradients.aiHorizontal;
|
|
42266
|
+
var _useState = useState(null),
|
|
42267
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
42268
|
+
size = _useState2[0],
|
|
42269
|
+
setSize = _useState2[1];
|
|
42270
|
+
var animatedValue = useRef(new Animated.Value(0));
|
|
42271
|
+
var onLayout = useCallback(function (event) {
|
|
42272
|
+
var _event$nativeEvent$la = event.nativeEvent.layout,
|
|
42273
|
+
width = _event$nativeEvent$la.width,
|
|
42274
|
+
height = _event$nativeEvent$la.height;
|
|
42275
|
+
setSize(function (prev) {
|
|
42276
|
+
if ((prev === null || prev === void 0 ? void 0 : prev.width) === width && (prev === null || prev === void 0 ? void 0 : prev.height) === height) return prev;
|
|
42277
|
+
return {
|
|
42278
|
+
width: width,
|
|
42279
|
+
height: height
|
|
42280
|
+
};
|
|
42281
|
+
});
|
|
42282
|
+
}, []);
|
|
42283
|
+
useEffect(function () {
|
|
42284
|
+
if (!size) return;
|
|
42285
|
+
animatedValue.current.setValue(0);
|
|
42286
|
+
var animation = Animated.loop(Animated.timing(animatedValue.current, {
|
|
42287
|
+
toValue: 1,
|
|
42288
|
+
duration: ANIMATION_DURATION_MS,
|
|
42289
|
+
easing: Easing.linear,
|
|
42290
|
+
useNativeDriver: Platform.OS !== 'web'
|
|
42291
|
+
}));
|
|
42292
|
+
animation.start();
|
|
42293
|
+
return function () {
|
|
42294
|
+
return animation.stop();
|
|
42295
|
+
};
|
|
42296
|
+
}, [size]);
|
|
42297
|
+
// Slide left by one full text-width per loop cycle.
|
|
42298
|
+
// Starting at 0 keeps the gradient visible from the first frame.
|
|
42299
|
+
var translateX = size ? animatedValue.current.interpolate({
|
|
42300
|
+
inputRange: [0, 1],
|
|
42301
|
+
outputRange: [0, -size.width]
|
|
42302
|
+
}) : animatedValue.current;
|
|
42303
|
+
return /*#__PURE__*/React__default.createElement(View, null, /*#__PURE__*/React__default.createElement(MaskedView, {
|
|
42304
|
+
accessibilityElementsHidden: true,
|
|
42305
|
+
importantForAccessibility: "no-hide-descendants",
|
|
42306
|
+
maskElement: /*#__PURE__*/React__default.createElement(View, {
|
|
42307
|
+
onLayout: onLayout,
|
|
42308
|
+
style: {
|
|
42309
|
+
backgroundColor: 'transparent'
|
|
42310
|
+
},
|
|
42311
|
+
testID: "animated-gradient-text-mask"
|
|
42312
|
+
}, /*#__PURE__*/React__default.createElement(Typography.Body, {
|
|
42313
|
+
intent: "body",
|
|
42314
|
+
style: {
|
|
42315
|
+
fontSize: fontSize,
|
|
42316
|
+
lineHeight: lineHeight
|
|
42317
|
+
}
|
|
42318
|
+
}, children))
|
|
42319
|
+
}, size ? /*#__PURE__*/React__default.createElement(View, {
|
|
42320
|
+
style: {
|
|
42321
|
+
width: size.width,
|
|
42322
|
+
height: size.height,
|
|
42323
|
+
overflow: 'hidden'
|
|
42324
|
+
}
|
|
42325
|
+
}, /*#__PURE__*/React__default.createElement(Animated.View, {
|
|
42326
|
+
style: {
|
|
42327
|
+
width: size.width * 2,
|
|
42328
|
+
height: size.height,
|
|
42329
|
+
transform: [{
|
|
42330
|
+
translateX: translateX
|
|
42331
|
+
}]
|
|
42332
|
+
}
|
|
42333
|
+
}, /*#__PURE__*/React__default.createElement(LinearGradient, {
|
|
42334
|
+
start: gradient.start,
|
|
42335
|
+
end: gradient.end,
|
|
42336
|
+
colors: [gradient.colors[0], gradient.colors[1], gradient.colors[2], gradient.colors[1], gradient.colors[0]],
|
|
42337
|
+
locations: [0, 0.25, 0.5, 0.75, 1.0],
|
|
42338
|
+
style: {
|
|
42339
|
+
width: '100%',
|
|
42340
|
+
height: '100%'
|
|
42341
|
+
}
|
|
42342
|
+
}))) : /*#__PURE__*/React__default.createElement(Typography.Body, {
|
|
42343
|
+
intent: "body",
|
|
42344
|
+
style: {
|
|
42345
|
+
fontSize: fontSize,
|
|
42346
|
+
lineHeight: lineHeight
|
|
42347
|
+
}
|
|
42348
|
+
}, children)), /*#__PURE__*/React__default.createElement(View, {
|
|
42349
|
+
style: {
|
|
42350
|
+
position: 'absolute',
|
|
42351
|
+
opacity: 0
|
|
42352
|
+
},
|
|
42353
|
+
importantForAccessibility: "yes",
|
|
42354
|
+
accessibilityElementsHidden: false
|
|
42355
|
+
}, /*#__PURE__*/React__default.createElement(Typography.Body, {
|
|
42356
|
+
intent: "body",
|
|
42357
|
+
style: {
|
|
42358
|
+
fontSize: fontSize,
|
|
42359
|
+
lineHeight: lineHeight
|
|
42360
|
+
}
|
|
42361
|
+
}, children)));
|
|
42362
|
+
};
|
|
42363
|
+
|
|
42364
|
+
var TEXT_SIZE_NAMES = {
|
|
42365
|
+
10: 'xsmall',
|
|
42366
|
+
12: 'small',
|
|
42367
|
+
14: 'medium',
|
|
42368
|
+
16: 'large',
|
|
42369
|
+
18: 'xlarge'
|
|
42370
|
+
};
|
|
42371
|
+
var getTextSizeName = function getTextSizeName(size) {
|
|
42372
|
+
return TEXT_SIZE_NAMES[size];
|
|
42373
|
+
};
|
|
42374
|
+
var getIconName = function getIconName(state) {
|
|
42375
|
+
switch (state) {
|
|
42376
|
+
case 'idle':
|
|
42377
|
+
return 'circle-ok-outlined';
|
|
42378
|
+
case 'loading':
|
|
42379
|
+
return 'loading';
|
|
42380
|
+
case 'success':
|
|
42381
|
+
return 'circle-check';
|
|
42382
|
+
case 'error':
|
|
42383
|
+
return 'circle-cancel-outlined';
|
|
42384
|
+
}
|
|
42385
|
+
};
|
|
42386
|
+
var getIconIntent = function getIconIntent(state, intent) {
|
|
42387
|
+
switch (state) {
|
|
42388
|
+
case 'idle':
|
|
42389
|
+
return 'inactive';
|
|
42390
|
+
case 'loading':
|
|
42391
|
+
return intent === 'ai' ? 'ai' : 'primary';
|
|
42392
|
+
case 'success':
|
|
42393
|
+
return 'success';
|
|
42394
|
+
case 'error':
|
|
42395
|
+
return 'danger';
|
|
42396
|
+
}
|
|
42397
|
+
};
|
|
42398
|
+
var getIconSize = function getIconSize(textSize) {
|
|
42399
|
+
switch (textSize) {
|
|
42400
|
+
case 10:
|
|
42401
|
+
return {
|
|
42402
|
+
size: 'xxxsmall'
|
|
42403
|
+
};
|
|
42404
|
+
case 12:
|
|
42405
|
+
return {
|
|
42406
|
+
size: 'xxxsmall',
|
|
42407
|
+
styleFontSize: 14
|
|
42408
|
+
};
|
|
42409
|
+
case 14:
|
|
42410
|
+
return {
|
|
42411
|
+
size: 'xxxsmall',
|
|
42412
|
+
styleFontSize: 14
|
|
42413
|
+
};
|
|
42414
|
+
case 16:
|
|
42415
|
+
return {
|
|
42416
|
+
size: 'xsmall'
|
|
42417
|
+
};
|
|
42418
|
+
case 18:
|
|
42419
|
+
return {
|
|
42420
|
+
size: 'small'
|
|
42421
|
+
};
|
|
42422
|
+
}
|
|
42423
|
+
};
|
|
42424
|
+
|
|
42425
|
+
var StyledContainer = index$c(View)(function (_ref) {
|
|
42426
|
+
var theme = _ref.theme;
|
|
42427
|
+
return {
|
|
42428
|
+
flexDirection: 'row',
|
|
42429
|
+
alignItems: 'flex-start',
|
|
42430
|
+
gap: theme.__hd__.inlineLoader.space.gap
|
|
42431
|
+
};
|
|
42432
|
+
});
|
|
42433
|
+
var StyledIconContainer = index$c(View)(function (_ref2) {
|
|
42434
|
+
var themeSize = _ref2.themeSize,
|
|
42435
|
+
theme = _ref2.theme;
|
|
42436
|
+
return {
|
|
42437
|
+
height: theme.__hd__.inlineLoader.icon.lineHeights[themeSize],
|
|
42438
|
+
justifyContent: 'center'
|
|
42439
|
+
};
|
|
42440
|
+
});
|
|
42441
|
+
|
|
42442
|
+
var InlineLoader = function InlineLoader(_ref) {
|
|
42443
|
+
var text = _ref.text,
|
|
42444
|
+
_ref$state = _ref.state,
|
|
42445
|
+
state = _ref$state === void 0 ? 'idle' : _ref$state,
|
|
42446
|
+
_ref$intent = _ref.intent,
|
|
42447
|
+
intent = _ref$intent === void 0 ? 'neutral' : _ref$intent,
|
|
42448
|
+
_ref$size = _ref.size,
|
|
42449
|
+
size = _ref$size === void 0 ? 14 : _ref$size,
|
|
42450
|
+
style = _ref.style,
|
|
42451
|
+
testID = _ref.testID;
|
|
42452
|
+
var theme = useTheme();
|
|
42453
|
+
var textSizeName = getTextSizeName(size);
|
|
42454
|
+
var lineHeight = theme.__hd__.inlineLoader.icon.lineHeights[textSizeName];
|
|
42455
|
+
var iconName = getIconName(state);
|
|
42456
|
+
var iconIntent = getIconIntent(state, intent);
|
|
42457
|
+
var _getIconSize = getIconSize(size),
|
|
42458
|
+
iconSize = _getIconSize.size,
|
|
42459
|
+
styleFontSize = _getIconSize.styleFontSize;
|
|
42460
|
+
var iconStyle = styleFontSize ? {
|
|
42461
|
+
fontSize: styleFontSize
|
|
42462
|
+
} : undefined;
|
|
42463
|
+
var isAiLoading = state === 'loading' && intent === 'ai';
|
|
42464
|
+
return /*#__PURE__*/React__default.createElement(StyledContainer, {
|
|
42465
|
+
testID: testID,
|
|
42466
|
+
style: style
|
|
42467
|
+
}, /*#__PURE__*/React__default.createElement(StyledIconContainer, {
|
|
42468
|
+
themeSize: textSizeName
|
|
42469
|
+
}, /*#__PURE__*/React__default.createElement(Icon, {
|
|
42470
|
+
icon: iconName,
|
|
42471
|
+
intent: iconIntent,
|
|
42472
|
+
size: iconSize,
|
|
42473
|
+
spin: state === 'loading',
|
|
42474
|
+
style: iconStyle,
|
|
42475
|
+
accessible: false,
|
|
42476
|
+
accessibilityElementsHidden: true,
|
|
42477
|
+
importantForAccessibility: "no-hide-descendants"
|
|
42478
|
+
})), isAiLoading ? /*#__PURE__*/React__default.createElement(AnimatedGradientText, {
|
|
42479
|
+
fontSize: size,
|
|
42480
|
+
lineHeight: lineHeight
|
|
42481
|
+
}, text) : /*#__PURE__*/React__default.createElement(Typography.Body, {
|
|
42482
|
+
intent: "body",
|
|
42483
|
+
style: {
|
|
42484
|
+
fontSize: size,
|
|
42485
|
+
lineHeight: lineHeight
|
|
42486
|
+
}
|
|
42487
|
+
}, text));
|
|
42488
|
+
};
|
|
42489
|
+
|
|
42490
|
+
export { Accordion, Alert, AppCue, Attachment, index$b as Avatar, Badge, BottomNavigation, BottomSheet, Box, CompoundButton as Button, Calendar, Card, index$a as Carousel, Chart, index$9 as Checkbox, Chip, Collapse, ContentNavigator, index$8 as DatePicker, Divider, index$7 as Drawer, Empty, ErrorComponent as Error, FAB, FilterTrigger, FlatListWithFAB, FloatingIsland, HeroDesignProvider, Icon, Illustration, IllustrationList, Image, InlineLoader, List$1 as List, LocaleProvider, index$6 as MapPin, PageControl, PinInput, Portal, Progress, CompoundRadio as Radio, Rate, RefreshControl, index as RichTextEditor, ScrollViewWithFAB, Search, SectionHeading, SectionListWithFAB, SegmentedControl, index$4 as Select, Skeleton, Slider, Spinner, Success, index$5 as Swipeable, index$3 as Switch, index$2 as Tabs, Tag, TextInput, ThemeProvider, ThemeSwitcher, PublicTimePicker as TimePicker, Toast, index$1 as Toolbar, Typography, eBensSystemPalette, ehJobsSystemPalette, ehWorkDarkSystemPalette, ehWorkSystemPalette, getTheme, jobsSystemPalette, scale, index$c as styled, swagDarkSystemPalette, swagLightJobsSystemPalette, swagSystemPalette$1 as swagLightSystemPalette, swagSystemPalette$2 as swagSystemPalette, defaultTheme as theme, useAvatarColors, useTheme, walletSystemPalette, withTheme, workSystemPalette };
|