@originallyus/feedback-rn-sdk 4.0.0-beta.24 → 4.0.0-beta.26

package/lib/module/component/AIA/molecules/ContentCard/ContentCard.js

@@ -0,0 +1,131 @@
+"use strict";
+
+/**
+ *
+ * ContentCard
+ * @format
+ *
+ */
+
+import React from 'react';
+import { View } from 'react-native';
+import useCustomTheme from "../../hooks/useCustomTheme/index.js";
+import ContentCardStyles from "./styles/index.js";
+import CardContainer from "../../atoms/CardContainer/index.js";
+import Image from "../../atoms/Image/index.js";
+import Text from "../../atoms/Text/index.js";
+import Tag from "../../atoms/Tag/index.js";
+import IconText from "../IconText/index.js";
+import FlexWrapWithGap from "./FlexWrapWithGap.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const ContentCard = props => {
+  const {
+    captions,
+    title,
+    description,
+    tags,
+    onPress,
+    imageHeight = 180,
+    imageCustomStyle,
+    imageResizeMode = 'cover',
+    imageSource,
+    imageAspectRatio = '16:9',
+    variant = 'vertical',
+    iconTextLeftIcon,
+    iconTextLabel,
+    testID,
+    accessible,
+    accessibilityLabel,
+    accessibilityHint,
+    accessibilityRole,
+    accessibilityState
+  } = props;
+  const {
+    colors,
+    border,
+    size,
+    spacing
+  } = useCustomTheme();
+  const styles = ContentCardStyles(colors, border, size, spacing);
+  const displayedTags = Array.isArray(tags) && tags.length > 3 ? [...tags.slice(0, 3), {
+    label: '+#',
+    variant: 'warmgrey'
+  }] : tags || [];
+  return /*#__PURE__*/_jsxs(CardContainer, {
+    color: "surface-layer-1",
+    onPress: onPress,
+    isRemovePadding: variant === 'horizontal',
+    testID: testID,
+    accessible: accessible,
+    accessibilityLabel: accessibilityLabel,
+    accessibilityHint: accessibilityHint,
+    accessibilityRole: accessibilityRole,
+    accessibilityState: accessibilityState,
+    children: [variant === 'horizontal' && imageSource && /*#__PURE__*/_jsx(View, {
+      style: [styles.horizontalImageWrapper, styles.imageRadius, {
+        height: imageHeight
+      }],
+      children: /*#__PURE__*/_jsx(Image, {
+        source: imageSource,
+        aspectRatio: imageAspectRatio,
+        resizeMode: imageResizeMode,
+        customStyle: imageCustomStyle
+      })
+    }), /*#__PURE__*/_jsxs(View, {
+      style: [styles.cardContainerWrapper, variant === 'horizontal' && styles.containerPadding],
+      children: [variant === 'vertical' && imageSource && /*#__PURE__*/_jsx(View, {
+        style: styles.imageWrapper,
+        children: /*#__PURE__*/_jsx(Image, {
+          aspectRatio: "1:1",
+          resizeMode: imageResizeMode,
+          customStyle: imageCustomStyle,
+          source: imageSource
+        })
+      }), /*#__PURE__*/_jsxs(View, {
+        style: styles.container,
+        children: [Array.isArray(captions) && captions.length > 0 && /*#__PURE__*/_jsx(View, {
+          style: [styles.spacingOneMarginBottom, styles.row, styles.captionContainer],
+          children: captions.map((caption, index) => /*#__PURE__*/_jsxs(View, {
+            style: styles.captionWrapper,
+            children: [/*#__PURE__*/_jsx(Text, {
+              variant: "body-2-semibold",
+              children: caption
+            }), index < captions.length - 1 && /*#__PURE__*/_jsx(View, {
+              style: styles.dot
+            })]
+          }, `${index}-captions-product-card`))
+        }), /*#__PURE__*/_jsx(Text, {
+          variant: "headline-6-medium",
+          customContainerStyle: styles.spacingTwoMarginBottom,
+          children: title
+        }), description && /*#__PURE__*/_jsx(Text, {
+          variant: "body-2-regular",
+          children: description
+        }), Array.isArray(tags) && tags.length > 0 && /*#__PURE__*/_jsx(FlexWrapWithGap, {
+          style: styles.tagsWrapper,
+          gap: styles.tagsWrapper.marginTop,
+          children: displayedTags.map((tag, index) => {
+            return /*#__PURE__*/_jsx(Tag, {
+              label: tag.label,
+              variant: tag.variant
+            }, `${index}-tag-product-card`);
+          })
+        }), iconTextLeftIcon && /*#__PURE__*/_jsx(View, {
+          style: styles.iconTextWrapper,
+          children: /*#__PURE__*/_jsx(IconText, {
+            leadingIcon: {
+              ...iconTextLeftIcon,
+              color: 'subdued'
+            },
+            label: iconTextLabel ?? '',
+            size: "small",
+            textBoldVariation: 'regular',
+            labelColor: "subdued"
+          })
+        })]
+      })]
+    })]
+  });
+};
+export default ContentCard;
+//# sourceMappingURL=ContentCard.js.map

package/lib/module/component/AIA/molecules/ContentCard/ContentCard.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","View","useCustomTheme","ContentCardStyles","CardContainer","Image","Text","Tag","IconText","FlexWrapWithGap","jsx","_jsx","jsxs","_jsxs","ContentCard","props","captions","title","description","tags","onPress","imageHeight","imageCustomStyle","imageResizeMode","imageSource","imageAspectRatio","variant","iconTextLeftIcon","iconTextLabel","testID","accessible","accessibilityLabel","accessibilityHint","accessibilityRole","accessibilityState","colors","border","size","spacing","styles","displayedTags","Array","isArray","length","slice","label","color","isRemovePadding","children","style","horizontalImageWrapper","imageRadius","height","source","aspectRatio","resizeMode","customStyle","cardContainerWrapper","containerPadding","imageWrapper","container","spacingOneMarginBottom","row","captionContainer","map","caption","index","captionWrapper","dot","customContainerStyle","spacingTwoMarginBottom","tagsWrapper","gap","marginTop","tag","iconTextWrapper","leadingIcon","textBoldVariation","labelColor"],"sourceRoot":"../../../../../../src","sources":["component/AIA/molecules/ContentCard/ContentCard.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/component/AIA/molecules/ContentCard/FlexWrapWithGap.js

@@ -0,0 +1,32 @@
+"use strict";
+
+import React from 'react';
+import { View, StyleSheet } from 'react-native';
+import { jsx as _jsx } from "react/jsx-runtime";
+const FlexWrapWithGap = ({
+  children,
+  gap = 0,
+  style
+}) => {
+  const childrenWithGap = React.Children.map(children, (child, index) => /*#__PURE__*/_jsx(View, {
+    style: {
+      marginRight: gap,
+      marginBottom: gap
+    },
+    children: child
+  }, index));
+  return /*#__PURE__*/_jsx(View, {
+    style: [styles.container, style],
+    children: childrenWithGap
+  });
+};
+const styles = StyleSheet.create({
+  container: {
+    flexDirection: 'row',
+    flexWrap: 'wrap',
+    marginRight: -10,
+    marginBottom: -10
+  }
+});
+export default FlexWrapWithGap;
+//# sourceMappingURL=FlexWrapWithGap.js.map

package/lib/module/component/AIA/molecules/ContentCard/FlexWrapWithGap.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","View","StyleSheet","jsx","_jsx","FlexWrapWithGap","children","gap","style","childrenWithGap","Children","map","child","index","marginRight","marginBottom","styles","container","create","flexDirection","flexWrap"],"sourceRoot":"../../../../../../src","sources":["component/AIA/molecules/ContentCard/FlexWrapWithGap.tsx"],"mappings":";;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAAQC,IAAI,EAAEC,UAAU,QAAO,cAAc;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAE7C,MAAMC,eAAe,GAAGA,CAAC;EAACC,QAAQ;EAAEC,GAAG,GAAG,CAAC;EAAEC;AAAK,CAAC,KAAK;EACvD,MAAMC,eAAe,GAAGT,KAAK,CAACU,QAAQ,CAACC,GAAG,CAACL,QAAQ,EAAE,CAACM,KAAK,EAAEC,KAAK,kBACjET,IAAA,CAACH,IAAI;IAACO,KAAK,EAAE;MAACM,WAAW,EAAEP,GAAG;MAAEQ,YAAY,EAAER;IAAG,CAAE;IAAAD,QAAA,EACjDM;EAAK,GADkDC,KAEnD,CACN,CAAC;EAEF,oBAAOT,IAAA,CAACH,IAAI;IAACO,KAAK,EAAE,CAACQ,MAAM,CAACC,SAAS,EAAET,KAAK,CAAE;IAAAF,QAAA,EAAEG;EAAe,CAAO,CAAC;AACxE,CAAC;AAED,MAAMO,MAAM,GAAGd,UAAU,CAACgB,MAAM,CAAC;EAChCD,SAAS,EAAE;IACVE,aAAa,EAAE,KAAK;IACpBC,QAAQ,EAAE,MAAM;IAChBN,WAAW,EAAE,CAAC,EAAE;IAChBC,YAAY,EAAE,CAAC;EAChB;AACD,CAAC,CAAC;AAEF,eAAeV,eAAe","ignoreList":[]}

package/lib/module/component/AIA/molecules/ContentCard/README.md

@@ -0,0 +1,35 @@
+# ContentCard
+
+## Usage & Example
+
+```js
+import ContentCard from '@/ContentCard';
+
+<ContentCard
+  captions={['Caption 1', 'Caption 2', 'Caption 3']}
+  title="Title"
+  description="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor"
+  tags={[
+    {variant: 'warmgrey', label: 'Tag content'},
+    {variant: 'warmgrey', label: 'Tag content'},
+    {variant: 'warmgrey', label: 'Tag content'},
+    {variant: 'warmgrey', label: 'Tag content'},
+  ]}
+  imageSource={require('@aia-dds/assets/images/general/default.png')}
+  iconTextLeftIcon={{group: 'general', name: 'time', color: 'subdued'}}
+  iconTextLabel="5 mins read"
+  variant="horizontal"
+/>
+```
+
+Key                 | Type                  | Required  | Description                         |
+---------------     | --------------        | --------- | ----------------------------------- |
+captions            | `Array`               | True      | Captions for the component.         |
+title               | `String`              | True      | Title for the component.            |
+description         | `String`              | False     | Description for the component.      |
+tags                | `Array`               | False     | Tag content.                        |
+onPress             | `Function`            | False     | onPress callback.                   |
+imageSource         | `ImageSourcePropType` | False     | Image display source.               |
+iconTextLeftIcon    | `Object`              | False     | Icon text leading icon.             |
+iconTextLabel       | `String`              | False     | Icon text display label.            |
+variant             | `String`              | False     | Image display variant.              |

package/lib/module/component/AIA/molecules/ContentCard/changelog.txt

@@ -0,0 +1,30 @@
+# DDS 3.0
+## ContentCard Changelog
+
+## Apr 4, 2024
+### Updated
+- Update image default height.
+
+## Feb 21, 2024
+### Updated
+- Removed iconTextBoldVariant type and hardcoded to regular option.
+
+## Feb 2, 2024
+### Updated
+- Updated forth tag from ... to +#.
+
+## Dec 20, 2023
+### Updated
+- Adjust the horizontal image put inside card container and testID props
+
+## Nov 22, 2023
+### Updated
+- Remove iconTextColor as design only accept subdued color
+
+## Nov 22, 2023
+### Updated
+- Code cleaning and type error fixing
+
+## Nov 14, 2023
+### Updated
+- Added new component

package/lib/module/component/AIA/molecules/ContentCard/config/index.js

@@ -0,0 +1,7 @@
+/**
+ *
+ * @format
+ *
+ */
+"use strict";
+//# sourceMappingURL=index.js.map

package/lib/module/component/AIA/molecules/ContentCard/config/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sourceRoot":"../../../../../../../src","sources":["component/AIA/molecules/ContentCard/config/index.ts"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AAJA","ignoreList":[]}

package/lib/module/component/AIA/molecules/ContentCard/index.js

@@ -0,0 +1,4 @@
+"use strict";
+
+export { default } from "./ContentCard.js";
+//# sourceMappingURL=index.js.map

package/lib/module/component/AIA/molecules/ContentCard/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["default"],"sourceRoot":"../../../../../../src","sources":["component/AIA/molecules/ContentCard/index.ts"],"mappings":";;AAAA,SAAQA,OAAO","ignoreList":[]}

package/lib/module/component/AIA/molecules/ContentCard/styles/index.js

@@ -0,0 +1,75 @@
+"use strict";
+
+/**
+ *
+ * @format
+ *
+ */
+
+import { StyleSheet } from 'react-native';
+const ContentCardStyles = (colors, border, size, spacing) => StyleSheet.create({
+  container: {
+    flex: 1
+  },
+  cardContainerWrapper: {
+    width: '100%',
+    flexDirection: 'row'
+  },
+  containerPadding: {
+    paddingHorizontal: spacing.md,
+    paddingBottom: spacing.md
+  },
+  captionWrapper: {
+    flexDirection: 'row',
+    alignItems: 'center'
+  },
+  captionContainer: {
+    flexWrap: 'wrap'
+  },
+  dot: {
+    width: 4,
+    height: 4,
+    borderRadius: 2,
+    backgroundColor: colors['icon-subdued'],
+    marginHorizontal: spacing.xs
+  },
+  spacingOneMarginBottom: {
+    marginBottom: spacing['2xs']
+  },
+  spacingTwoMarginBottom: {
+    marginBottom: spacing.xs
+  },
+  spacingTwoMarginTop: {
+    marginTop: spacing.xs
+  },
+  tagsWrapper: {
+    flexDirection: 'row',
+    flexWrap: 'wrap',
+    alignItems: 'flex-start',
+    marginTop: spacing.xs
+  },
+  row: {
+    flexDirection: 'row'
+  },
+  imageWrapper: {
+    height: size['7xl'],
+    width: size['7xl'],
+    marginRight: spacing.md,
+    borderRadius: border['radius-md'],
+    overflow: 'hidden'
+  },
+  iconTextWrapper: {
+    marginTop: spacing.md
+  },
+  horizontalImageWrapper: {
+    minHeight: 152,
+    width: '100%',
+    marginBottom: spacing.md
+  },
+  imageRadius: {
+    borderTopLeftRadius: border['radius-md'],
+    borderTopRightRadius: border['radius-md']
+  }
+});
+export default ContentCardStyles;
+//# sourceMappingURL=index.js.map

package/lib/module/component/AIA/molecules/ContentCard/styles/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["StyleSheet","ContentCardStyles","colors","border","size","spacing","create","container","flex","cardContainerWrapper","width","flexDirection","containerPadding","paddingHorizontal","md","paddingBottom","captionWrapper","alignItems","captionContainer","flexWrap","dot","height","borderRadius","backgroundColor","marginHorizontal","xs","spacingOneMarginBottom","marginBottom","spacingTwoMarginBottom","spacingTwoMarginTop","marginTop","tagsWrapper","row","imageWrapper","marginRight","overflow","iconTextWrapper","horizontalImageWrapper","minHeight","imageRadius","borderTopLeftRadius","borderTopRightRadius"],"sourceRoot":"../../../../../../../src","sources":["component/AIA/molecules/ContentCard/styles/index.ts"],"mappings":";;AAAA;AACA;AACA;AACA;AACA;;AAEA,SAAQA,UAAU,QAAO,cAAc;AAEvC,MAAMC,iBAAiB,GAAGA,CAACC,MAAM,EAAEC,MAAM,EAAEC,IAAI,EAAEC,OAAO,KACvDL,UAAU,CAACM,MAAM,CAAC;EACjBC,SAAS,EAAE;IACVC,IAAI,EAAE;EACP,CAAC;EACDC,oBAAoB,EAAE;IACrBC,KAAK,EAAE,MAAM;IACbC,aAAa,EAAE;EAChB,CAAC;EACDC,gBAAgB,EAAE;IACjBC,iBAAiB,EAAER,OAAO,CAACS,EAAE;IAC7BC,aAAa,EAAEV,OAAO,CAACS;EACxB,CAAC;EACDE,cAAc,EAAE;IACfL,aAAa,EAAE,KAAK;IACpBM,UAAU,EAAE;EACb,CAAC;EACDC,gBAAgB,EAAE;IACjBC,QAAQ,EAAE;EACX,CAAC;EACDC,GAAG,EAAE;IACJV,KAAK,EAAE,CAAC;IACRW,MAAM,EAAE,CAAC;IACTC,YAAY,EAAE,CAAC;IACfC,eAAe,EAAErB,MAAM,CAAC,cAAc,CAAC;IACvCsB,gBAAgB,EAAEnB,OAAO,CAACoB;EAC3B,CAAC;EACDC,sBAAsB,EAAE;IACvBC,YAAY,EAAEtB,OAAO,CAAC,KAAK;EAC5B,CAAC;EACDuB,sBAAsB,EAAE;IACvBD,YAAY,EAAEtB,OAAO,CAACoB;EACvB,CAAC;EACDI,mBAAmB,EAAE;IACpBC,SAAS,EAAEzB,OAAO,CAACoB;EACpB,CAAC;EACDM,WAAW,EAAE;IACZpB,aAAa,EAAE,KAAK;IACpBQ,QAAQ,EAAE,MAAM;IAChBF,UAAU,EAAE,YAAY;IACxBa,SAAS,EAAEzB,OAAO,CAACoB;EACpB,CAAC;EACDO,GAAG,EAAE;IACJrB,aAAa,EAAE;EAChB,CAAC;EACDsB,YAAY,EAAE;IACbZ,MAAM,EAAEjB,IAAI,CAAC,KAAK,CAAC;IACnBM,KAAK,EAAEN,IAAI,CAAC,KAAK,CAAC;IAClB8B,WAAW,EAAE7B,OAAO,CAACS,EAAE;IACvBQ,YAAY,EAAEnB,MAAM,CAAC,WAAW,CAAC;IACjCgC,QAAQ,EAAE;EACX,CAAC;EACDC,eAAe,EAAE;IAChBN,SAAS,EAAEzB,OAAO,CAACS;EACpB,CAAC;EACDuB,sBAAsB,EAAE;IACvBC,SAAS,EAAE,GAAG;IACd5B,KAAK,EAAE,MAAM;IACbiB,YAAY,EAAEtB,OAAO,CAACS;EACvB,CAAC;EACDyB,WAAW,EAAE;IACZC,mBAAmB,EAAErC,MAAM,CAAC,WAAW,CAAC;IACxCsC,oBAAoB,EAAEtC,MAAM,CAAC,WAAW;EACzC;AACD,CAAC,CAAC;AAEH,eAAeF,iBAAiB","ignoreList":[]}

package/lib/module/component/AIA/molecules/ContentCard/types/index.js

@@ -0,0 +1,4 @@
+"use strict";
+
+export {};
+//# sourceMappingURL=index.js.map

package/lib/module/component/AIA/molecules/ContentCard/types/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sourceRoot":"../../../../../../../src","sources":["component/AIA/molecules/ContentCard/types/index.ts"],"mappings":"","ignoreList":[]}

package/lib/module/component/AIA/molecules/ContentFlatCard/ContentFlatCard.js

@@ -0,0 +1,127 @@
+"use strict";
+
+/**
+ *
+ * ContentCard
+ * @format
+ *
+ */
+
+import React, { useState } from 'react';
+import { View, Pressable } from 'react-native';
+import useCustomTheme from "../../hooks/useCustomTheme/index.js";
+import ContentFlatCardStyles from "./styles/index.js";
+import Image from "../../atoms/Image/index.js";
+import Text from "../../atoms/Text/index.js";
+import Tag from "../../atoms/Tag/index.js";
+import IconText from "../IconText/index.js";
+import FlexWrapWithGap from "./FlexWrapWithGap.js";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+const ContentFlatCard = props => {
+  const {
+    caption,
+    title,
+    description,
+    tags,
+    onPress,
+    imageHeight = 200,
+    imageCustomStyle,
+    imageResizeMode = 'cover',
+    imageSource,
+    imageAspectRatio = '16:9',
+    iconTextLeftIcon,
+    iconTextLabel,
+    testID,
+    accessible,
+    accessibilityLabel,
+    accessibilityHint,
+    accessibilityRole,
+    accessibilityState
+  } = props;
+  const {
+    colors,
+    border,
+    size,
+    spacing
+  } = useCustomTheme();
+  const styles = ContentFlatCardStyles(colors, border, size, spacing);
+  const [isHolding, setIsHolding] = useState(false);
+  const displayedTags = Array.isArray(tags) && tags.length > 3 ? [...tags.slice(0, 3), {
+    label: '+#',
+    variant: 'warmgrey'
+  }] : tags || [];
+  const handleLongPress = () => {
+    setIsHolding(true);
+  };
+  const handlePressOut = () => {
+    if (isHolding) {
+      setIsHolding(false);
+    }
+  };
+  return /*#__PURE__*/_jsx(Pressable, {
+    onPress: onPress,
+    onLongPress: handleLongPress,
+    onPressOut: handlePressOut,
+    testID: testID,
+    accessible: accessible,
+    accessibilityLabel: accessibilityLabel,
+    accessibilityHint: accessibilityHint,
+    accessibilityRole: accessibilityRole,
+    accessibilityState: accessibilityState,
+    children: /*#__PURE__*/_jsxs(_Fragment, {
+      children: [imageSource && /*#__PURE__*/_jsx(View, {
+        style: [styles.horizontalImageWrapper, {
+          height: imageHeight
+        }],
+        children: /*#__PURE__*/_jsx(Image, {
+          source: imageSource,
+          aspectRatio: imageAspectRatio,
+          resizeMode: imageResizeMode,
+          customStyle: imageCustomStyle
+        })
+      }), /*#__PURE__*/_jsx(View, {
+        children: /*#__PURE__*/_jsx(View, {
+          style: styles.cardContainerWrapper,
+          children: /*#__PURE__*/_jsxs(View, {
+            style: styles.container,
+            children: [caption && /*#__PURE__*/_jsx(Text, {
+              variant: "body-3-semibold",
+              customContainerStyle: styles.spacingOneMarginBottom,
+              children: caption
+            }), /*#__PURE__*/_jsx(Text, {
+              variant: "headline-6-medium",
+              customContainerStyle: [styles.spacingTwoMarginBottom, isHolding ? styles.captionBorderActive : styles.captionBorder],
+              children: title
+            }), description && /*#__PURE__*/_jsx(Text, {
+              variant: "body-2-regular",
+              children: description
+            }), Array.isArray(tags) && tags.length > 0 && /*#__PURE__*/_jsx(FlexWrapWithGap, {
+              style: styles.tagsWrapper,
+              gap: styles.tagsWrapper.marginTop,
+              children: displayedTags.map((tag, index) => {
+                return /*#__PURE__*/_jsx(Tag, {
+                  label: tag.label,
+                  variant: tag.variant
+                }, `${index}-tag-product-card`);
+              })
+            }), iconTextLeftIcon && /*#__PURE__*/_jsx(View, {
+              style: styles.iconTextWrapper,
+              children: /*#__PURE__*/_jsx(IconText, {
+                leadingIcon: {
+                  ...iconTextLeftIcon,
+                  color: 'subdued'
+                },
+                label: iconTextLabel ?? '',
+                size: "small",
+                textBoldVariation: "regular",
+                labelColor: "subdued"
+              })
+            })]
+          })
+        })
+      })]
+    })
+  });
+};
+export default ContentFlatCard;
+//# sourceMappingURL=ContentFlatCard.js.map

package/lib/module/component/AIA/molecules/ContentFlatCard/ContentFlatCard.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useState","View","Pressable","useCustomTheme","ContentFlatCardStyles","Image","Text","Tag","IconText","FlexWrapWithGap","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","ContentFlatCard","props","caption","title","description","tags","onPress","imageHeight","imageCustomStyle","imageResizeMode","imageSource","imageAspectRatio","iconTextLeftIcon","iconTextLabel","testID","accessible","accessibilityLabel","accessibilityHint","accessibilityRole","accessibilityState","colors","border","size","spacing","styles","isHolding","setIsHolding","displayedTags","Array","isArray","length","slice","label","variant","handleLongPress","handlePressOut","onLongPress","onPressOut","children","style","horizontalImageWrapper","height","source","aspectRatio","resizeMode","customStyle","cardContainerWrapper","container","customContainerStyle","spacingOneMarginBottom","spacingTwoMarginBottom","captionBorderActive","captionBorder","tagsWrapper","gap","marginTop","map","tag","index","iconTextWrapper","leadingIcon","color","textBoldVariation","labelColor"],"sourceRoot":"../../../../../../src","sources":["component/AIA/molecules/ContentFlatCard/ContentFlatCard.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/component/AIA/molecules/ContentFlatCard/FlexWrapWithGap.js

@@ -0,0 +1,32 @@
+"use strict";
+
+import React from 'react';
+import { View, StyleSheet } from 'react-native';
+import { jsx as _jsx } from "react/jsx-runtime";
+const FlexWrapWithGap = ({
+  children,
+  gap = 0,
+  style
+}) => {
+  const childrenWithGap = React.Children.map(children, (child, index) => /*#__PURE__*/_jsx(View, {
+    style: {
+      marginRight: gap,
+      marginBottom: gap
+    },
+    children: child
+  }, index));
+  return /*#__PURE__*/_jsx(View, {
+    style: [styles.container, style],
+    children: childrenWithGap
+  });
+};
+const styles = StyleSheet.create({
+  container: {
+    flexDirection: 'row',
+    flexWrap: 'wrap',
+    marginRight: -10,
+    marginBottom: -10
+  }
+});
+export default FlexWrapWithGap;
+//# sourceMappingURL=FlexWrapWithGap.js.map

package/lib/module/component/AIA/molecules/ContentFlatCard/FlexWrapWithGap.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","View","StyleSheet","jsx","_jsx","FlexWrapWithGap","children","gap","style","childrenWithGap","Children","map","child","index","marginRight","marginBottom","styles","container","create","flexDirection","flexWrap"],"sourceRoot":"../../../../../../src","sources":["component/AIA/molecules/ContentFlatCard/FlexWrapWithGap.tsx"],"mappings":";;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAAQC,IAAI,EAAEC,UAAU,QAAO,cAAc;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAE7C,MAAMC,eAAe,GAAGA,CAAC;EAACC,QAAQ;EAAEC,GAAG,GAAG,CAAC;EAAEC;AAAK,CAAC,KAAK;EACvD,MAAMC,eAAe,GAAGT,KAAK,CAACU,QAAQ,CAACC,GAAG,CAACL,QAAQ,EAAE,CAACM,KAAK,EAAEC,KAAK,kBACjET,IAAA,CAACH,IAAI;IAACO,KAAK,EAAE;MAACM,WAAW,EAAEP,GAAG;MAAEQ,YAAY,EAAER;IAAG,CAAE;IAAAD,QAAA,EACjDM;EAAK,GADkDC,KAEnD,CACN,CAAC;EAEF,oBAAOT,IAAA,CAACH,IAAI;IAACO,KAAK,EAAE,CAACQ,MAAM,CAACC,SAAS,EAAET,KAAK,CAAE;IAAAF,QAAA,EAAEG;EAAe,CAAO,CAAC;AACxE,CAAC;AAED,MAAMO,MAAM,GAAGd,UAAU,CAACgB,MAAM,CAAC;EAChCD,SAAS,EAAE;IACVE,aAAa,EAAE,KAAK;IACpBC,QAAQ,EAAE,MAAM;IAChBN,WAAW,EAAE,CAAC,EAAE;IAChBC,YAAY,EAAE,CAAC;EAChB;AACD,CAAC,CAAC;AAEF,eAAeV,eAAe","ignoreList":[]}

package/lib/module/component/AIA/molecules/ContentFlatCard/README.md

@@ -0,0 +1,38 @@
+# ContentFlatCard
+
+## Usage & Example
+
+```js
+import ContentFlatCard from '@/ContentFlatCard';
+
+<ContentFlatCard
+  caption="Caption"
+  title="Title"
+  description="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor"
+  tags={[
+    {variant: 'warmgrey', label: 'Tag content'},
+    {variant: 'warmgrey', label: 'Tag content'},
+    {variant: 'warmgrey', label: 'Tag content'},
+    {variant: 'warmgrey', label: 'Tag content'},
+  ]}
+  imageSource={require('@aia-dds/assets/images/general/default.png')}
+  iconTextLeftIcon={{group: 'general', name: 'time'}}
+  iconTextLabel="5 mins read"
+  imageCustomStyle={{borderRadius: 8}}
+/>
+```
+
+Key                 | Type                  | Required  | Description                         |
+---------------     | --------------        | --------- | ----------------------------------- |
+caption             | `String`              | False     | Caption for the component.          |
+title               | `String`              | True      | Title for the component.            |
+description         | `String`              | False     | Description for the component.      |
+tags                | `Array`               | False     | Tag content.                        |
+onPress             | `Function`            | False     | onPress callback.                   |
+imageSource         | `ImageSourcePropType` | False     | Image display source.               |
+iconTextLeftIcon    | `Object`              | False     | Icon text leading icon.             |
+iconTextLabel       | `String`              | False     | Icon text display label.            |
+imageCustomStyle    | `String`              | False     | Image styles.                       |
+imageResizeMode     | `String`              | False     | Image resize mode.                  |
+imageAspectRatio    | `String`              | False     | Image aspect ratio.                 |
+imageHeight         | `Number`              | False     | Image height.                       |

package/lib/module/component/AIA/molecules/ContentFlatCard/changelog.txt

@@ -0,0 +1,22 @@
+# DDS 3.0
+## ContentFlatCard Changelog
+
+## Sept 23, 2024
+### Updated
+- Update spacing.
+
+## Feb 21, 2024
+### Updated
+- Remove titleBorder, show border when on press.
+
+## Feb 2, 2024
+### Updated
+- Updated forth tag from ... to +#.
+
+## Jan 18, 2023
+### Updated
+- Added spacing between image and caption
+
+## Dec 8, 2023
+### Updated
+- Added new component

package/lib/module/component/AIA/molecules/ContentFlatCard/config/index.js

@@ -0,0 +1,7 @@
+/**
+ *
+ * @format
+ *
+ */
+"use strict";
+//# sourceMappingURL=index.js.map

package/lib/module/component/AIA/molecules/ContentFlatCard/config/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sourceRoot":"../../../../../../../src","sources":["component/AIA/molecules/ContentFlatCard/config/index.ts"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AAJA","ignoreList":[]}

package/lib/module/component/AIA/molecules/ContentFlatCard/index.js

@@ -0,0 +1,4 @@
+"use strict";
+
+export { default } from "./ContentFlatCard.js";
+//# sourceMappingURL=index.js.map

package/lib/module/component/AIA/molecules/ContentFlatCard/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["default"],"sourceRoot":"../../../../../../src","sources":["component/AIA/molecules/ContentFlatCard/index.ts"],"mappings":";;AAAA,SAAQA,OAAO","ignoreList":[]}