@ornikar/kitt-universal 32.6.0 → 32.8.0

package/dist/index.es.web.js

@@ -26,6 +26,7 @@ import { parseNumber, getCountryCallingCode, isValidNumber } from 'libphonenumbe
 import { useSafeAreaInsets } from 'react-native-safe-area-context';
 import Svg, { Circle as Circle$1 } from 'react-native-svg';
 import { useFloating, autoUpdate, offset, autoPlacement, shift, arrow } from '@floating-ui/react-dom';
+import { defineMessages, FormattedMessage } from 'react-intl';
 import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
 import { LinearGradient } from 'expo-linear-gradient';
 import { makeDecorator } from '@storybook/addons';
@@ -12076,6 +12077,108 @@ Picker.Option = PickerOption;
  */
 Picker.UnsafeInternalItem = PickerItem;
 
+var styles = {"displayUnderline":"TypographyLinkWebWrapper-module_displayUnderline__KxwMp","displayUnderlineWhenHovered":"TypographyLinkWebWrapper-module_displayUnderlineWhenHovered__5V5Cl"};
+
+function TypographyLinkWebWrapper(_ref) {
+  var children = _ref.children,
+    hasNoUnderline = _ref.hasNoUnderline;
+  var className = hasNoUnderline ? "".concat(styles.displayUnderline, " ").concat(styles.displayUnderlineWhenHovered) : styles.displayUnderline;
+  return /*#__PURE__*/jsx("span", {
+    className: className,
+    children: children
+  });
+}
+
+var _excluded$8 = ["children", "disabled", "noUnderline", "href", "hrefAttrs", "onPress"];
+var TypographyLink = /*#__PURE__*/forwardRef(function (_ref, ref) {
+  var children = _ref.children,
+    disabled = _ref.disabled,
+    noUnderline = _ref.noUnderline,
+    href = _ref.href,
+    hrefAttrs = _ref.hrefAttrs,
+    onPress = _ref.onPress,
+    otherProps = _objectWithoutProperties(_ref, _excluded$8);
+  return /*#__PURE__*/jsx(TypographyLinkWebWrapper, {
+    hasNoUnderline: noUnderline,
+    children: /*#__PURE__*/jsx(Typography, _objectSpread(_objectSpread({
+      ref: ref,
+      underline: !noUnderline,
+      color: disabled ? 'black-disabled' : undefined,
+      href: href,
+      hrefAttrs: hrefAttrs,
+      accessibilityRole: "link",
+      dataSet: {
+        // remove data-kitt-universal when we delete kitt web. See :global(a) in Link styles.module.css
+        'kitt-universal': 'true'
+      },
+      _web: {
+        // @ts-expect-error: This is only used on web where 'not-allowed' and 'pointer' are valid cursor values
+        cursor: disabled ? 'not-allowed' : 'pointer',
+        transitionProperty: 'color',
+        transitionDuration: '0.2s',
+        transitionTimingFunction: 'ease-in-out'
+      }
+      // TODO[native-base@>=3.4.19] this currently does not work. Retest when updating native-base.
+      // _active={{
+      //   underline: !!noUnderline,
+      // }}
+      // _hover={{
+      //   underline: !!noUnderline,
+      // }}
+      ,
+      onPress: disabled ? undefined : onPress
+    }, otherProps), {}, {
+      children: children
+    }))
+  });
+});
+
+var messages = defineMessages({
+  seeMore: {
+    id: "shared.components.ReadMore.seeMore"
+  },
+  seeLess: {
+    id: "shared.components.ReadMore.seeLess"
+  }
+});
+function ReadMore(_ref) {
+  var lines = _ref.lines,
+    children = _ref.children,
+    _ref$textColor = _ref.textColor,
+    textColor = _ref$textColor === void 0 ? 'bumper.content.base.hi' : _ref$textColor,
+    _ref$noUnderline = _ref.noUnderline,
+    noUnderline = _ref$noUnderline === void 0 ? false : _ref$noUnderline;
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    isExpanded = _useState2[0],
+    setIsExpanded = _useState2[1];
+  var nbOfLines = isExpanded ? undefined : lines;
+  var messageProps = isExpanded ? messages.seeLess : messages.seeMore;
+  return /*#__PURE__*/jsxs(Fragment, {
+    children: [/*#__PURE__*/jsx(View, {
+      flexShrink: 1,
+      children: /*#__PURE__*/jsx(Typography.Text, {
+        textAlign: "left",
+        numberOfLines: nbOfLines,
+        ellipsizeMode: "tail",
+        children: children
+      })
+    }), lines ? /*#__PURE__*/jsx(View, {
+      children: /*#__PURE__*/jsx(TypographyLink, {
+        noUnderline: noUnderline,
+        color: textColor,
+        variant: "bold",
+        onPress: function () {
+          setIsExpanded(function (prev) {
+            return !prev;
+          });
+        },
+        children: /*#__PURE__*/jsx(FormattedMessage, _objectSpread({}, messageProps))
+      })
+    }) : null]
+  });
+}
+
 var SvgStripesinline = function SvgStripesinline(props) {
   return /*#__PURE__*/jsx("svg", _objectSpread(_objectSpread({
     viewBox: "0 0 453 71",
@@ -12176,7 +12279,7 @@ function SkeletonContent(_ref) {
   });
 }
 
-var _excluded$8 = ["isLoading", "style"],
+var _excluded$7 = ["isLoading", "style"],
   _excluded2$1 = ["size"],
   _excluded3$1 = ["size"],
   _excluded4$1 = ["size"];
@@ -12184,7 +12287,7 @@ function Skeleton(_ref) {
   var _ref$isLoading = _ref.isLoading,
     isLoading = _ref$isLoading === void 0 ? false : _ref$isLoading,
     style = _ref.style,
-    props = _objectWithoutProperties(_ref, _excluded$8);
+    props = _objectWithoutProperties(_ref, _excluded$7);
   var _useState = useState(0),
     _useState2 = _slicedToArray(_useState, 2),
     width = _useState2[0],
@@ -12367,7 +12470,7 @@ function getShouldDisplay2x() {
   return window.devicePixelRatio ? window.devicePixelRatio > 1 : false;
 }
 
-var _excluded$7 = ["width", "height", "alt", "apiToken", "mapId", "marker", "center", "onLoaded", "onError"];
+var _excluded$6 = ["width", "height", "alt", "apiToken", "mapId", "marker", "center", "onLoaded", "onError"];
 var mapBoxMaxPictureWidth = 1280;
 
 // Mapbox requestable width for image is between 1 - 1280px
@@ -12385,7 +12488,7 @@ function StaticMap(_ref) {
     center = _ref.center,
     onLoaded = _ref.onLoaded,
     onError = _ref.onError,
-    props = _objectWithoutProperties(_ref, _excluded$7);
+    props = _objectWithoutProperties(_ref, _excluded$6);
   var _useState = useState(getPictureWidth(width)),
     _useState2 = _slicedToArray(_useState, 2),
     currentWidth = _useState2[0],
@@ -12568,12 +12671,12 @@ function Sticker(_ref) {
   });
 }
 
-var _excluded$6 = ["direction", "wrap"];
+var _excluded$5 = ["direction", "wrap"];
 function Flex(_ref) {
   var direction = _ref.direction,
     _ref$wrap = _ref.wrap,
     wrap = _ref$wrap === void 0 ? 'wrap' : _ref$wrap,
-    props = _objectWithoutProperties(_ref, _excluded$6);
+    props = _objectWithoutProperties(_ref, _excluded$5);
   return /*#__PURE__*/jsx(View, _objectSpread(_objectSpread({}, props), {}, {
     flexDirection: direction,
     flexWrap: wrap
@@ -12711,7 +12814,7 @@ function Story(_ref) {
   });
 }
 
-var _excluded$5 = ["title", "children", "internalIsDemoSection"],
+var _excluded$4 = ["title", "children", "internalIsDemoSection"],
   _excluded2 = ["title", "children"],
   _excluded3 = ["title", "children"],
   _excluded4 = ["children"];
@@ -12719,7 +12822,7 @@ function StorySection(_ref) {
   var title = _ref.title,
     children = _ref.children,
     internalIsDemoSection = _ref.internalIsDemoSection,
-    props = _objectWithoutProperties(_ref, _excluded$5);
+    props = _objectWithoutProperties(_ref, _excluded$4);
   if (title === 'Demo' && !internalIsDemoSection) throw new Error('Use StorySection.Demo instead');
   return /*#__PURE__*/jsxs(View, _objectSpread(_objectSpread({
     marginBottom: "kitt.8"
@@ -13078,7 +13181,7 @@ function Tag(_ref) {
   });
 }
 
-var _excluded$4 = ["value", "disabled", "stretch", "placeholder", "isHoveredInternal", "isFocusedInternal", "isPressedInternal", "onChange", "onBlur", "title", "validateButtonLabel", "isDefaultVisible", "modalTestID", "pickerTestID"];
+var _excluded$3 = ["value", "disabled", "stretch", "placeholder", "isHoveredInternal", "isFocusedInternal", "isPressedInternal", "onChange", "onBlur", "title", "validateButtonLabel", "isDefaultVisible", "modalTestID", "pickerTestID"];
 function getCurrentInternalForcedState(_ref) {
   var isDisabled = _ref.isDisabled,
     isHoveredInternal = _ref.isHoveredInternal,
@@ -13130,7 +13233,7 @@ var TimePicker = /*#__PURE__*/forwardRef(function (_ref2, ref) {
     _ref2.isDefaultVisible;
     _ref2.modalTestID;
     _ref2.pickerTestID;
-    var props = _objectWithoutProperties(_ref2, _excluded$4);
+    var props = _objectWithoutProperties(_ref2, _excluded$3);
   var _useState = useState(value ? getInitialInputValueFromDateValue(value) : ''),
     _useState2 = _slicedToArray(_useState, 2),
     inputValue = _useState2[0],
@@ -13704,62 +13807,6 @@ function TypographyEmoji(_ref3) {
   });
 }
 
-var styles = {"displayUnderline":"TypographyLinkWebWrapper-module_displayUnderline__KxwMp","displayUnderlineWhenHovered":"TypographyLinkWebWrapper-module_displayUnderlineWhenHovered__5V5Cl"};
-
-function TypographyLinkWebWrapper(_ref) {
-  var children = _ref.children,
-    hasNoUnderline = _ref.hasNoUnderline;
-  var className = hasNoUnderline ? "".concat(styles.displayUnderline, " ").concat(styles.displayUnderlineWhenHovered) : styles.displayUnderline;
-  return /*#__PURE__*/jsx("span", {
-    className: className,
-    children: children
-  });
-}
-
-var _excluded$3 = ["children", "disabled", "noUnderline", "href", "hrefAttrs", "onPress"];
-var TypographyLink = /*#__PURE__*/forwardRef(function (_ref, ref) {
-  var children = _ref.children,
-    disabled = _ref.disabled,
-    noUnderline = _ref.noUnderline,
-    href = _ref.href,
-    hrefAttrs = _ref.hrefAttrs,
-    onPress = _ref.onPress,
-    otherProps = _objectWithoutProperties(_ref, _excluded$3);
-  return /*#__PURE__*/jsx(TypographyLinkWebWrapper, {
-    hasNoUnderline: noUnderline,
-    children: /*#__PURE__*/jsx(Typography, _objectSpread(_objectSpread({
-      ref: ref,
-      underline: !noUnderline,
-      color: disabled ? 'black-disabled' : undefined,
-      href: href,
-      hrefAttrs: hrefAttrs,
-      accessibilityRole: "link",
-      dataSet: {
-        // remove data-kitt-universal when we delete kitt web. See :global(a) in Link styles.module.css
-        'kitt-universal': 'true'
-      },
-      _web: {
-        // @ts-expect-error: This is only used on web where 'not-allowed' and 'pointer' are valid cursor values
-        cursor: disabled ? 'not-allowed' : 'pointer',
-        transitionProperty: 'color',
-        transitionDuration: '0.2s',
-        transitionTimingFunction: 'ease-in-out'
-      }
-      // TODO[native-base@>=3.4.19] this currently does not work. Retest when updating native-base.
-      // _active={{
-      //   underline: !!noUnderline,
-      // }}
-      // _hover={{
-      //   underline: !!noUnderline,
-      // }}
-      ,
-      onPress: disabled ? undefined : onPress
-    }, otherProps), {}, {
-      children: children
-    }))
-  });
-});
-
 var ChromaticReducedMotionDecorator = makeDecorator({
   name: 'ChromaticReducedMotionDecorator',
   parameterName: 'chromaticReducedMotion',
@@ -14125,5 +14172,5 @@ function VerticalSteps(_ref) {
 VerticalSteps.Step = Step;
 VerticalSteps.BorderlessStep = BorderlessStep;
 
-export { ActionCard, Actions, Autocomplete, Avatar, BottomSheet, Button, ButtonBadge, CardModal, Center, Checkbox, ChoicesElements, ChromaticReducedMotionDecorator, CloseIconButton, DatePicker, DialogModal, DocumentPicker, Emoji, ExternalAppLink, ExternalLink, FilePicker, FlatList, Flex, FullscreenModal, GoogleMapsApiKeyProvider, GoogleMapsAutocompleteProvider, GroupTags, HStack, Highlight, Icon, IconButton, Image, ImagePicker, InfoCard, InputAddress, InputAddressLegacy, InputEmail, InputFeedback, InputField, InputIban, InputIcon, InputNumber, InputPassword, InputPhone, InputPressable, InputTag, InputText, KittBreakpointNameEnum, KittBreakpoints, KittBreakpointsMax, KittMapConfigProvider, KittNativeBaseProvider, KittThemeDecorator, KittThemeProvider, Label, ListItem, LoaderIcon, MapMarker, MapMarkerVariantEnum, MatchWindowSize, Message, ModalBehaviour, NativeOnlyFlatList, NavigationBottomSheet, NavigationModal, Notification, Overlay, PageLoader, Picker, Pressable, RadioWithRef as Radio, RadioButtonGroup, ScrollView, DeprecatedSection as Section, SectionList, SegmentedProgressBar, Skeleton, SpinningIcon, Stack, StaticMap, Sticker, Story, StoryBlock, StoryContainer, StoryDecorator, StoryGrid, StorySection, StoryTitle, StyleWebWrapper, SwitchBreakpoints, TabBar, Tag, TextArea, TimePicker, ToastComponent, Toggle, Tooltip, TopNavBar, Typography, TypographyEmoji, TypographyIcon, TypographyLink, VStack, VerticalSteps, View, createChoicesComponent, createResponsiveStyleFromProp, getStaticMapImageUrl, getValueForBreakpoint, hex2rgba, matchWindowSize, storyPadding, theme, useBottomSheet, useBreakpointValue, useCurrentBreakpointName, useGetStaticMapImageUrl, useKittMapConfig, useKittTheme, useMatchWindowSize, useOpenExternalLink, useStaticBottomSheet, useStoryBlockColor, useTheme };
+export { ActionCard, Actions, Autocomplete, Avatar, BottomSheet, Button, ButtonBadge, CardModal, Center, Checkbox, ChoicesElements, ChromaticReducedMotionDecorator, CloseIconButton, DatePicker, DialogModal, DocumentPicker, Emoji, ExternalAppLink, ExternalLink, FilePicker, FlatList, Flex, FullscreenModal, GoogleMapsApiKeyProvider, GoogleMapsAutocompleteProvider, GroupTags, HStack, Highlight, Icon, IconButton, Image, ImagePicker, InfoCard, InputAddress, InputAddressLegacy, InputEmail, InputFeedback, InputField, InputIban, InputIcon, InputNumber, InputPassword, InputPhone, InputPressable, InputTag, InputText, KittBreakpointNameEnum, KittBreakpoints, KittBreakpointsMax, KittMapConfigProvider, KittNativeBaseProvider, KittThemeDecorator, KittThemeProvider, Label, ListItem, LoaderIcon, MapMarker, MapMarkerVariantEnum, MatchWindowSize, Message, ModalBehaviour, NativeOnlyFlatList, NavigationBottomSheet, NavigationModal, Notification, Overlay, PageLoader, Picker, Pressable, RadioWithRef as Radio, RadioButtonGroup, ReadMore, ScrollView, DeprecatedSection as Section, SectionList, SegmentedProgressBar, Skeleton, SpinningIcon, Stack, StaticMap, Sticker, Story, StoryBlock, StoryContainer, StoryDecorator, StoryGrid, StorySection, StoryTitle, StyleWebWrapper, SwitchBreakpoints, TabBar, Tag, TextArea, TimePicker, ToastComponent, Toggle, Tooltip, TopNavBar, Typography, TypographyEmoji, TypographyIcon, TypographyLink, VStack, VerticalSteps, View, createChoicesComponent, createResponsiveStyleFromProp, getStaticMapImageUrl, getValueForBreakpoint, hex2rgba, matchWindowSize, storyPadding, theme, useBottomSheet, useBreakpointValue, useCurrentBreakpointName, useGetStaticMapImageUrl, useKittMapConfig, useKittTheme, useMatchWindowSize, useOpenExternalLink, useStaticBottomSheet, useStoryBlockColor, useTheme };
 //# sourceMappingURL=index.es.web.js.map