@amityco/react-native-social-uikit 4.2.1-f052efd.0 → 4.3.0

package/lib/module/chat/features/shared/components/DateSeparator/styles.js

@@ -0,0 +1,48 @@
+// Styles for DateSeparator — ported from DateSeparator.module.css.
+// Geometry: outer paddingVertical 0.5rem→8; pill padding 0.25rem/0.5rem→4/8,
+// border-radius 1rem→16. Colours via tokens.
+//
+// Shadow: web's pill relies on a box-shadow for definition — without it the pill
+// blends into a light message-list background. Web's shadow colours are RAW rgba
+// (NOT design tokens — there is no shadow token to map to), so we port them verbatim
+// as rgb()+opacity. rgb()/rgba() (no `#`) is intentionally allowed by the no-hex gate;
+// dropping the shadow would be an unfaithful silent simplification.
+// web: 0 0 2px rgb(40 41 61 /10%), 0 2px 4px rgb(96 97 112 /16%) → RN approximates the
+// dominant drop layer (iOS shadow* + Android elevation).
+
+import { StyleSheet } from 'react-native';
+import { useToken } from '../../../../../core/design/theme/useToken';
+import { AmityColorToken } from '../../../../../core/design/tokens/amity-color-tokens';
+export const useStyles = () => {
+  const token = useToken();
+  const styles = StyleSheet.create({
+    dateSeparator: {
+      alignItems: 'center',
+      justifyContent: 'center',
+      paddingVertical: 8
+    },
+    pill: {
+      paddingVertical: 4,
+      paddingHorizontal: 8,
+      borderRadius: 16,
+      backgroundColor: token(AmityColorToken.SurfaceDateAndTimeDateSeparatorDefault),
+      // web box-shadow (raw rgba, non-tokenized) — ported so the pill reads on light bg
+      shadowColor: 'rgb(96, 97, 112)',
+      shadowOffset: {
+        width: 0,
+        height: 2
+      },
+      shadowOpacity: 0.16,
+      shadowRadius: 4,
+      elevation: 2
+    },
+    label: {
+      color: token(AmityColorToken.TextDateAndTimeDateSeparatorDefault)
+    }
+  });
+  return {
+    styles,
+    token
+  };
+};
+//# sourceMappingURL=styles.js.map

package/lib/module/chat/features/shared/components/DateSeparator/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["StyleSheet","useToken","AmityColorToken","useStyles","token","styles","create","dateSeparator","alignItems","justifyContent","paddingVertical","pill","paddingHorizontal","borderRadius","backgroundColor","SurfaceDateAndTimeDateSeparatorDefault","shadowColor","shadowOffset","width","height","shadowOpacity","shadowRadius","elevation","label","color","TextDateAndTimeDateSeparatorDefault"],"sourceRoot":"../../../../../../../src","sources":["chat/features/shared/components/DateSeparator/styles.ts"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,UAAU,QAAQ,cAAc;AACzC,SAASC,QAAQ,QAAQ,2CAA2C;AACpE,SAASC,eAAe,QAAQ,sDAAsD;AAEtF,OAAO,MAAMC,SAAS,GAAGA,CAAA,KAAM;EAC7B,MAAMC,KAAK,GAAGH,QAAQ,CAAC,CAAC;EAExB,MAAMI,MAAM,GAAGL,UAAU,CAACM,MAAM,CAAC;IAC/BC,aAAa,EAAE;MACbC,UAAU,EAAE,QAAQ;MACpBC,cAAc,EAAE,QAAQ;MACxBC,eAAe,EAAE;IACnB,CAAC;IACDC,IAAI,EAAE;MACJD,eAAe,EAAE,CAAC;MAClBE,iBAAiB,EAAE,CAAC;MACpBC,YAAY,EAAE,EAAE;MAChBC,eAAe,EAAEV,KAAK,CACpBF,eAAe,CAACa,sCAClB,CAAC;MACD;MACAC,WAAW,EAAE,kBAAkB;MAC/BC,YAAY,EAAE;QAAEC,KAAK,EAAE,CAAC;QAAEC,MAAM,EAAE;MAAE,CAAC;MACrCC,aAAa,EAAE,IAAI;MACnBC,YAAY,EAAE,CAAC;MACfC,SAAS,EAAE;IACb,CAAC;IACDC,KAAK,EAAE;MACLC,KAAK,EAAEpB,KAAK,CAACF,eAAe,CAACuB,mCAAmC;IAClE;EACF,CAAC,CAAC;EAEF,OAAO;IAAEpB,MAAM;IAAED;EAAM,CAAC;AAC1B,CAAC","ignoreList":[]}

package/lib/module/chat/features/shared/components/DeletedMessagePill/DeletedMessagePill.js

@@ -0,0 +1,40 @@
+// DeletedMessagePill — ported from AmityUiKitWeb features/shared/components/DeletedMessagePill.
+// An outlined pill with a trash glyph + "This message was deleted". Web relies on
+// CSS `currentcolor` to tint icon/text/border from one `color` per data-user side;
+// RN has no `currentcolor`, so the side colour is resolved explicitly for the icon
+// (tokenColor) and for the border/label (styles).
+
+// 1. React / RN imports
+import { View } from 'react-native';
+
+// 2. Internal imports
+import { Typography } from '../../../../../core/design/components/Typography';
+import { AmityIcon } from '../../../../../core/design/icons';
+import { AmityColorToken } from '../../../../../core/design/tokens/amity-color-tokens';
+import { useString } from '../../../../../core/localization';
+import { useStyles } from './styles';
+
+// 3. Types
+
+// 4. Named function component
+export function DeletedMessagePill({
+  isUser
+}) {
+  const {
+    styles
+  } = useStyles(isUser);
+  const deletedLabel = useString('amity_chat_message_deleted');
+  const iconColor = isUser ? AmityColorToken.TextChatBubbleOutboundMessagesDeleted : AmityColorToken.TextChatBubbleInboundMessagesDeleted;
+  return /*#__PURE__*/React.createElement(View, {
+    style: styles.pill
+  }, /*#__PURE__*/React.createElement(AmityIcon, {
+    name: "trash-r",
+    size: 16,
+    tokenColor: iconColor
+  }), /*#__PURE__*/React.createElement(Typography, {
+    variant: "caption",
+    style: styles.label,
+    numberOfLines: 1
+  }, deletedLabel));
+}
+//# sourceMappingURL=DeletedMessagePill.js.map

package/lib/module/chat/features/shared/components/DeletedMessagePill/DeletedMessagePill.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["View","Typography","AmityIcon","AmityColorToken","useString","useStyles","DeletedMessagePill","isUser","styles","deletedLabel","iconColor","TextChatBubbleOutboundMessagesDeleted","TextChatBubbleInboundMessagesDeleted","React","createElement","style","pill","name","size","tokenColor","variant","label","numberOfLines"],"sourceRoot":"../../../../../../../src","sources":["chat/features/shared/components/DeletedMessagePill/DeletedMessagePill.tsx"],"mappings":"AAAA;AACA;AACA;AACA;AACA;;AAEA;AACA,SAASA,IAAI,QAAQ,cAAc;;AAEnC;AACA,SAASC,UAAU,QAAQ,kDAAkD;AAC7E,SAASC,SAAS,QAAQ,kCAAkC;AAC5D,SAASC,eAAe,QAAQ,sDAAsD;AACtF,SAASC,SAAS,QAAQ,kCAAkC;AAC5D,SAASC,SAAS,QAAQ,UAAU;;AAEpC;;AAKA;AACA,OAAO,SAASC,kBAAkBA,CAAC;EAAEC;AAAgC,CAAC,EAAE;EACtE,MAAM;IAAEC;EAAO,CAAC,GAAGH,SAAS,CAACE,MAAM,CAAC;EACpC,MAAME,YAAY,GAAGL,SAAS,CAAC,4BAA4B,CAAC;EAE5D,MAAMM,SAAS,GAAGH,MAAM,GACpBJ,eAAe,CAACQ,qCAAqC,GACrDR,eAAe,CAACS,oCAAoC;EAExD,oBACEC,KAAA,CAAAC,aAAA,CAACd,IAAI;IAACe,KAAK,EAAEP,MAAM,CAACQ;EAAK,gBACvBH,KAAA,CAAAC,aAAA,CAACZ,SAAS;IAACe,IAAI,EAAC,SAAS;IAACC,IAAI,EAAE,EAAG;IAACC,UAAU,EAAET;EAAU,CAAE,CAAC,eAC7DG,KAAA,CAAAC,aAAA,CAACb,UAAU;IAACmB,OAAO,EAAC,SAAS;IAACL,KAAK,EAAEP,MAAM,CAACa,KAAM;IAACC,aAAa,EAAE;EAAE,GACjEb,YACS,CACR,CAAC;AAEX","ignoreList":[]}

package/lib/module/chat/features/shared/components/DeletedMessagePill/index.js

@@ -0,0 +1,2 @@
+export { DeletedMessagePill } from './DeletedMessagePill';
+//# sourceMappingURL=index.js.map

package/lib/module/chat/features/shared/components/DeletedMessagePill/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["DeletedMessagePill"],"sourceRoot":"../../../../../../../src","sources":["chat/features/shared/components/DeletedMessagePill/index.ts"],"mappings":"AAAA,SAASA,kBAAkB,QAAQ,sBAAsB","ignoreList":[]}

package/lib/module/chat/features/shared/components/DeletedMessagePill/styles.js

@@ -0,0 +1,35 @@
+// Styles for DeletedMessagePill — ported from DeletedMessagePill.module.css.
+// Geometry: gap 0.25rem→4, padding 0.25rem/0.5rem→4/8, border 0.0625rem→1,
+// border-radius 1.25rem→20. `inline-flex` → alignSelf 'flex-start' so the pill
+// hugs its content instead of stretching the row. Per-side colour resolved here
+// (web `currentcolor` cascade has no RN equivalent).
+
+import { StyleSheet } from 'react-native';
+import { useToken } from '../../../../../core/design/theme/useToken';
+import { AmityColorToken } from '../../../../../core/design/tokens/amity-color-tokens';
+export const useStyles = isUser => {
+  const token = useToken();
+  const labelColor = token(isUser ? AmityColorToken.TextChatBubbleOutboundMessagesDeleted : AmityColorToken.TextChatBubbleInboundMessagesDeleted);
+  const borderColor = token(isUser ? AmityColorToken.BorderChatBubbleOutboundDeleted : AmityColorToken.BorderChatBubbleInboundDeleted);
+  const styles = StyleSheet.create({
+    pill: {
+      alignSelf: 'flex-start',
+      flexDirection: 'row',
+      alignItems: 'center',
+      gap: 4,
+      paddingVertical: 4,
+      paddingHorizontal: 8,
+      borderWidth: 1,
+      borderColor,
+      borderRadius: 20
+    },
+    label: {
+      color: labelColor
+    }
+  });
+  return {
+    styles,
+    token
+  };
+};
+//# sourceMappingURL=styles.js.map

package/lib/module/chat/features/shared/components/DeletedMessagePill/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["StyleSheet","useToken","AmityColorToken","useStyles","isUser","token","labelColor","TextChatBubbleOutboundMessagesDeleted","TextChatBubbleInboundMessagesDeleted","borderColor","BorderChatBubbleOutboundDeleted","BorderChatBubbleInboundDeleted","styles","create","pill","alignSelf","flexDirection","alignItems","gap","paddingVertical","paddingHorizontal","borderWidth","borderRadius","label","color"],"sourceRoot":"../../../../../../../src","sources":["chat/features/shared/components/DeletedMessagePill/styles.ts"],"mappings":"AAAA;AACA;AACA;AACA;AACA;;AAEA,SAASA,UAAU,QAAQ,cAAc;AACzC,SAASC,QAAQ,QAAQ,2CAA2C;AACpE,SAASC,eAAe,QAAQ,sDAAsD;AAEtF,OAAO,MAAMC,SAAS,GAAIC,MAAe,IAAK;EAC5C,MAAMC,KAAK,GAAGJ,QAAQ,CAAC,CAAC;EAExB,MAAMK,UAAU,GAAGD,KAAK,CACtBD,MAAM,GACFF,eAAe,CAACK,qCAAqC,GACrDL,eAAe,CAACM,oCACtB,CAAC;EACD,MAAMC,WAAW,GAAGJ,KAAK,CACvBD,MAAM,GACFF,eAAe,CAACQ,+BAA+B,GAC/CR,eAAe,CAACS,8BACtB,CAAC;EAED,MAAMC,MAAM,GAAGZ,UAAU,CAACa,MAAM,CAAC;IAC/BC,IAAI,EAAE;MACJC,SAAS,EAAE,YAAY;MACvBC,aAAa,EAAE,KAAK;MACpBC,UAAU,EAAE,QAAQ;MACpBC,GAAG,EAAE,CAAC;MACNC,eAAe,EAAE,CAAC;MAClBC,iBAAiB,EAAE,CAAC;MACpBC,WAAW,EAAE,CAAC;MACdZ,WAAW;MACXa,YAAY,EAAE;IAChB,CAAC;IACDC,KAAK,EAAE;MACLC,KAAK,EAAElB;IACT;EACF,CAAC,CAAC;EAEF,OAAO;IAAEM,MAAM;IAAEP;EAAM,CAAC;AAC1B,CAAC","ignoreList":[]}

package/lib/module/chat/features/shared/components/EmptyState/EmptyState.js

@@ -0,0 +1,52 @@
+// EmptyState — ported from AmityUiKitWeb features/shared/components/EmptyState.
+// A centered icon + title for the various chat empty/prompt states. Web icons
+// (Search.Light / SearchCross / ListRadio / Inbox) map to the SoT icon registry.
+// The `min-height: calc(100svh - …)` fill → flex:1 (no svh in RN).
+
+// 1. React / RN imports
+import { View } from 'react-native';
+
+// 2. Internal imports
+import { Typography } from '../../../../../core/design/components/Typography';
+import { AmityIcon } from '../../../../../core/design/icons';
+import { AmityColorToken } from '../../../../../core/design/tokens/amity-color-tokens';
+import { useString } from '../../../../../core/localization';
+import { useStyles } from './styles';
+
+// 3. Types
+
+function getIconName(variant) {
+  if (variant === 'prompt') return 'search-l';
+  if (variant === 'no-banned-users') return 'list-radio-l';
+  if (variant === 'no-archived-chats') return 'inbox-l';
+  return 'search-cross-l';
+}
+
+// 4. Named function component
+export function EmptyState({
+  variant
+}) {
+  const {
+    styles
+  } = useStyles();
+
+  // Resolved unconditionally (matches web) to respect rules-of-hooks.
+  const content = {
+    'prompt': useString('amity_chat_search_min_chars'),
+    'no-results': useString('amity_chat_search_no_results'),
+    'no-members': useString('amity_chat_no_members_found'),
+    'no-banned-users': useString('amity_chat_banned_members_empty'),
+    'no-archived-chats': useString('amity_chat_archived_empty_title')
+  };
+  return /*#__PURE__*/React.createElement(View, {
+    style: styles.emptyState
+  }, /*#__PURE__*/React.createElement(AmityIcon, {
+    name: getIconName(variant),
+    size: 64,
+    tokenColor: AmityColorToken.IconEmptyStateIconDefault
+  }), /*#__PURE__*/React.createElement(Typography, {
+    variant: "titleBold",
+    style: styles.text
+  }, content[variant]));
+}
+//# sourceMappingURL=EmptyState.js.map

package/lib/module/chat/features/shared/components/EmptyState/EmptyState.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["View","Typography","AmityIcon","AmityColorToken","useString","useStyles","getIconName","variant","EmptyState","styles","content","React","createElement","style","emptyState","name","size","tokenColor","IconEmptyStateIconDefault","text"],"sourceRoot":"../../../../../../../src","sources":["chat/features/shared/components/EmptyState/EmptyState.tsx"],"mappings":"AAAA;AACA;AACA;AACA;;AAEA;AACA,SAASA,IAAI,QAAQ,cAAc;;AAEnC;AACA,SAASC,UAAU,QAAQ,kDAAkD;AAC7E,SACEC,SAAS,QAEJ,kCAAkC;AACzC,SAASC,eAAe,QAAQ,sDAAsD;AACtF,SAASC,SAAS,QAAQ,kCAAkC;AAC5D,SAASC,SAAS,QAAQ,UAAU;;AAEpC;;AAYA,SAASC,WAAWA,CAACC,OAA0B,EAAiB;EAC9D,IAAIA,OAAO,KAAK,QAAQ,EAAE,OAAO,UAAU;EAC3C,IAAIA,OAAO,KAAK,iBAAiB,EAAE,OAAO,cAAc;EACxD,IAAIA,OAAO,KAAK,mBAAmB,EAAE,OAAO,SAAS;EACrD,OAAO,gBAAgB;AACzB;;AAEA;AACA,OAAO,SAASC,UAAUA,CAAC;EAAED;AAAyB,CAAC,EAAE;EACvD,MAAM;IAAEE;EAAO,CAAC,GAAGJ,SAAS,CAAC,CAAC;;EAE9B;EACA,MAAMK,OAA0C,GAAG;IACjD,QAAQ,EAAEN,SAAS,CAAC,6BAA6B,CAAC;IAClD,YAAY,EAAEA,SAAS,CAAC,8BAA8B,CAAC;IACvD,YAAY,EAAEA,SAAS,CAAC,6BAA6B,CAAC;IACtD,iBAAiB,EAAEA,SAAS,CAAC,iCAAiC,CAAC;IAC/D,mBAAmB,EAAEA,SAAS,CAAC,iCAAiC;EAClE,CAAC;EAED,oBACEO,KAAA,CAAAC,aAAA,CAACZ,IAAI;IAACa,KAAK,EAAEJ,MAAM,CAACK;EAAW,gBAC7BH,KAAA,CAAAC,aAAA,CAACV,SAAS;IACRa,IAAI,EAAET,WAAW,CAACC,OAAO,CAAE;IAC3BS,IAAI,EAAE,EAAG;IACTC,UAAU,EAAEd,eAAe,CAACe;EAA0B,CACvD,CAAC,eACFP,KAAA,CAAAC,aAAA,CAACX,UAAU;IAACM,OAAO,EAAC,WAAW;IAACM,KAAK,EAAEJ,MAAM,CAACU;EAAK,GAChDT,OAAO,CAACH,OAAO,CACN,CACR,CAAC;AAEX","ignoreList":[]}

package/lib/module/chat/features/shared/components/EmptyState/index.js

@@ -0,0 +1,2 @@
+export { EmptyState } from './EmptyState';
+//# sourceMappingURL=index.js.map

package/lib/module/chat/features/shared/components/EmptyState/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["EmptyState"],"sourceRoot":"../../../../../../../src","sources":["chat/features/shared/components/EmptyState/index.ts"],"mappings":"AAAA,SAASA,UAAU,QAAQ,cAAc","ignoreList":[]}

package/lib/module/chat/features/shared/components/EmptyState/styles.js

@@ -0,0 +1,31 @@
+// Styles for EmptyState — ported from EmptyState.module.css.
+// Geometry: gap 0.5rem→8, padding 1.5rem→24, icon 4rem→64, title max-width
+// 15.75rem→252. `min-height: calc(100svh - …)` → flex:1 fill + center. Colours
+// via tokens. `white-space: pre-line` is native to RN Text (\n honoured).
+
+import { StyleSheet } from 'react-native';
+import { useToken } from '../../../../../core/design/theme/useToken';
+import { AmityColorToken } from '../../../../../core/design/tokens/amity-color-tokens';
+export const useStyles = () => {
+  const token = useToken();
+  const styles = StyleSheet.create({
+    emptyState: {
+      flex: 1,
+      flexDirection: 'column',
+      alignItems: 'center',
+      justifyContent: 'center',
+      gap: 8,
+      padding: 24
+    },
+    text: {
+      maxWidth: 252,
+      textAlign: 'center',
+      color: token(AmityColorToken.TextEmptyStateTitleDefault)
+    }
+  });
+  return {
+    styles,
+    token
+  };
+};
+//# sourceMappingURL=styles.js.map

package/lib/module/chat/features/shared/components/EmptyState/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["StyleSheet","useToken","AmityColorToken","useStyles","token","styles","create","emptyState","flex","flexDirection","alignItems","justifyContent","gap","padding","text","maxWidth","textAlign","color","TextEmptyStateTitleDefault"],"sourceRoot":"../../../../../../../src","sources":["chat/features/shared/components/EmptyState/styles.ts"],"mappings":"AAAA;AACA;AACA;AACA;;AAEA,SAASA,UAAU,QAAQ,cAAc;AACzC,SAASC,QAAQ,QAAQ,2CAA2C;AACpE,SAASC,eAAe,QAAQ,sDAAsD;AAEtF,OAAO,MAAMC,SAAS,GAAGA,CAAA,KAAM;EAC7B,MAAMC,KAAK,GAAGH,QAAQ,CAAC,CAAC;EAExB,MAAMI,MAAM,GAAGL,UAAU,CAACM,MAAM,CAAC;IAC/BC,UAAU,EAAE;MACVC,IAAI,EAAE,CAAC;MACPC,aAAa,EAAE,QAAQ;MACvBC,UAAU,EAAE,QAAQ;MACpBC,cAAc,EAAE,QAAQ;MACxBC,GAAG,EAAE,CAAC;MACNC,OAAO,EAAE;IACX,CAAC;IACDC,IAAI,EAAE;MACJC,QAAQ,EAAE,GAAG;MACbC,SAAS,EAAE,QAAQ;MACnBC,KAAK,EAAEb,KAAK,CAACF,eAAe,CAACgB,0BAA0B;IACzD;EACF,CAAC,CAAC;EAEF,OAAO;IAAEb,MAAM;IAAED;EAAM,CAAC;AAC1B,CAAC","ignoreList":[]}

package/lib/module/chat/features/shared/components/FailedToShow/FailedToShow.js

@@ -0,0 +1,48 @@
+// FailedToShow — ported from AmityUiKitWeb features/shared/components/FailedToShow.
+// A centered icon + title + description shown when content can't be displayed.
+// Web `className` (CSS-module override) → RN `style` prop, applied after the base
+// container style. `flex: 1 1 auto` → flex:1 fill + center.
+//
+// The default copy is the generic livestream-unavailable pair ("Something went
+// wrong" / "The content you're looking for is unavailable."). A caller that knows
+// what the content was can pass a narrower line — the report sheet says "message"
+// rather than "content".
+
+// 1. React / RN imports
+import { View } from 'react-native';
+
+// 2. Internal imports
+import { Typography } from '../../../../../core/design/components/Typography';
+import { AmityIcon } from '../../../../../core/design/icons';
+import { AmityColorToken } from '../../../../../core/design/tokens/amity-color-tokens';
+import { useString } from '../../../../../core/localization';
+import { useStyles } from './styles';
+
+// 3. Types
+
+// 4. Named function component
+export function FailedToShow({
+  style,
+  title,
+  description
+}) {
+  const {
+    styles
+  } = useStyles();
+  const defaultTitle = useString('amity_social_label_livestream_deleted_page_title');
+  const defaultDescription = useString('amity_social_button_livestream_unavailable_desc');
+  return /*#__PURE__*/React.createElement(View, {
+    style: [styles.failedToShow, style]
+  }, /*#__PURE__*/React.createElement(AmityIcon, {
+    name: "newspaper-question-l",
+    size: 64,
+    tokenColor: AmityColorToken.IconEmptyStateIconDefault
+  }), /*#__PURE__*/React.createElement(Typography, {
+    variant: "titleBold",
+    style: styles.title
+  }, title ?? defaultTitle), /*#__PURE__*/React.createElement(Typography, {
+    variant: "body",
+    style: styles.desc
+  }, description ?? defaultDescription));
+}
+//# sourceMappingURL=FailedToShow.js.map

package/lib/module/chat/features/shared/components/FailedToShow/FailedToShow.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["View","Typography","AmityIcon","AmityColorToken","useString","useStyles","FailedToShow","style","title","description","styles","defaultTitle","defaultDescription","React","createElement","failedToShow","name","size","tokenColor","IconEmptyStateIconDefault","variant","desc"],"sourceRoot":"../../../../../../../src","sources":["chat/features/shared/components/FailedToShow/FailedToShow.tsx"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA,SAASA,IAAI,QAAwC,cAAc;;AAEnE;AACA,SAASC,UAAU,QAAQ,kDAAkD;AAC7E,SAASC,SAAS,QAAQ,kCAAkC;AAC5D,SAASC,eAAe,QAAQ,sDAAsD;AACtF,SAASC,SAAS,QAAQ,kCAAkC;AAC5D,SAASC,SAAS,QAAQ,UAAU;;AAEpC;;AAOA;AACA,OAAO,SAASC,YAAYA,CAAC;EAAEC,KAAK;EAAEC,KAAK;EAAEC;AAA+B,CAAC,EAAE;EAC7E,MAAM;IAAEC;EAAO,CAAC,GAAGL,SAAS,CAAC,CAAC;EAC9B,MAAMM,YAAY,GAAGP,SAAS,CAC5B,kDACF,CAAC;EACD,MAAMQ,kBAAkB,GAAGR,SAAS,CAClC,iDACF,CAAC;EAED,oBACES,KAAA,CAAAC,aAAA,CAACd,IAAI;IAACO,KAAK,EAAE,CAACG,MAAM,CAACK,YAAY,EAAER,KAAK;EAAE,gBACxCM,KAAA,CAAAC,aAAA,CAACZ,SAAS;IACRc,IAAI,EAAC,sBAAsB;IAC3BC,IAAI,EAAE,EAAG;IACTC,UAAU,EAAEf,eAAe,CAACgB;EAA0B,CACvD,CAAC,eACFN,KAAA,CAAAC,aAAA,CAACb,UAAU;IAACmB,OAAO,EAAC,WAAW;IAACb,KAAK,EAAEG,MAAM,CAACF;EAAM,GACjDA,KAAK,IAAIG,YACA,CAAC,eACbE,KAAA,CAAAC,aAAA,CAACb,UAAU;IAACmB,OAAO,EAAC,MAAM;IAACb,KAAK,EAAEG,MAAM,CAACW;EAAK,GAC3CZ,WAAW,IAAIG,kBACN,CACR,CAAC;AAEX","ignoreList":[]}

package/lib/module/chat/features/shared/components/FailedToShow/index.js

@@ -0,0 +1,2 @@
+export { FailedToShow } from './FailedToShow';
+//# sourceMappingURL=index.js.map

package/lib/module/chat/features/shared/components/FailedToShow/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["FailedToShow"],"sourceRoot":"../../../../../../../src","sources":["chat/features/shared/components/FailedToShow/index.ts"],"mappings":"AAAA,SAASA,YAAY,QAAQ,gBAAgB","ignoreList":[]}

package/lib/module/chat/features/shared/components/FailedToShow/styles.js

@@ -0,0 +1,33 @@
+// Styles for FailedToShow — ported from FailedToShow.module.css.
+// Geometry: gap 0.5rem→8, padding 1.5rem→24, icon 4rem→64. `flex: 1 1 auto`
+// fill → flex:1 + center. Colours via tokens.
+
+import { StyleSheet } from 'react-native';
+import { useToken } from '../../../../../core/design/theme/useToken';
+import { AmityColorToken } from '../../../../../core/design/tokens/amity-color-tokens';
+export const useStyles = () => {
+  const token = useToken();
+  const styles = StyleSheet.create({
+    failedToShow: {
+      flex: 1,
+      flexDirection: 'column',
+      alignItems: 'center',
+      justifyContent: 'center',
+      gap: 8,
+      padding: 24
+    },
+    title: {
+      textAlign: 'center',
+      color: token(AmityColorToken.TextEmptyStateTitleDefault)
+    },
+    desc: {
+      textAlign: 'center',
+      color: token(AmityColorToken.TextEmptyStateDescriptionDefault)
+    }
+  });
+  return {
+    styles,
+    token
+  };
+};
+//# sourceMappingURL=styles.js.map

package/lib/module/chat/features/shared/components/FailedToShow/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["StyleSheet","useToken","AmityColorToken","useStyles","token","styles","create","failedToShow","flex","flexDirection","alignItems","justifyContent","gap","padding","title","textAlign","color","TextEmptyStateTitleDefault","desc","TextEmptyStateDescriptionDefault"],"sourceRoot":"../../../../../../../src","sources":["chat/features/shared/components/FailedToShow/styles.ts"],"mappings":"AAAA;AACA;AACA;;AAEA,SAASA,UAAU,QAAQ,cAAc;AACzC,SAASC,QAAQ,QAAQ,2CAA2C;AACpE,SAASC,eAAe,QAAQ,sDAAsD;AAEtF,OAAO,MAAMC,SAAS,GAAGA,CAAA,KAAM;EAC7B,MAAMC,KAAK,GAAGH,QAAQ,CAAC,CAAC;EAExB,MAAMI,MAAM,GAAGL,UAAU,CAACM,MAAM,CAAC;IAC/BC,YAAY,EAAE;MACZC,IAAI,EAAE,CAAC;MACPC,aAAa,EAAE,QAAQ;MACvBC,UAAU,EAAE,QAAQ;MACpBC,cAAc,EAAE,QAAQ;MACxBC,GAAG,EAAE,CAAC;MACNC,OAAO,EAAE;IACX,CAAC;IACDC,KAAK,EAAE;MACLC,SAAS,EAAE,QAAQ;MACnBC,KAAK,EAAEZ,KAAK,CAACF,eAAe,CAACe,0BAA0B;IACzD,CAAC;IACDC,IAAI,EAAE;MACJH,SAAS,EAAE,QAAQ;MACnBC,KAAK,EAAEZ,KAAK,CAACF,eAAe,CAACiB,gCAAgC;IAC/D;EACF,CAAC,CAAC;EAEF,OAAO;IAAEd,MAAM;IAAED;EAAM,CAAC;AAC1B,CAAC","ignoreList":[]}

package/lib/module/chat/features/shared/components/ImageViewer/ImageViewer.js

@@ -0,0 +1,108 @@
+// ImageViewer — ported from AmityUiKitWeb chat/features/shared/components/ImageViewer.
+// Web wrapped MediaViewer around an <img>; RN uses react-native-image-viewing, which
+// provides its own pan/zoom full-screen viewer. We layer the same chrome via its
+// HeaderComponent (close) and FooterComponent (delete/save) props so the surface
+// matches VideoPlayer/MediaViewer.
+
+// 1. React / RN imports
+import { Pressable, View } from 'react-native';
+
+// 2. Third-party imports
+import ImageView from 'react-native-image-viewing';
+import { SafeAreaProvider, SafeAreaView } from 'react-native-safe-area-context';
+
+// 3. Internal imports
+import { AmityIcon } from '../../../../../core/design/icons';
+import { AmityColorToken } from '../../../../../core/design/tokens/amity-color-tokens';
+import { useString } from '../../../../../core/localization';
+import Toast from '../../../../../social/components/Toast';
+import { useStyles } from './styles';
+
+// 4. Types
+
+// 5. Named function component
+export function ImageViewer({
+  src,
+  onClose,
+  isOwn = false,
+  onDelete,
+  onSave
+}) {
+  const {
+    styles
+  } = useStyles();
+  const deleteLabel = useString('amity_chat_option_delete');
+  const saveLabel = useString('amity_chat_action_save');
+  const canDelete = isOwn && !!onDelete;
+  const canSave = !!onSave;
+  return /*#__PURE__*/React.createElement(ImageView, {
+    images: [{
+      uri: src
+    }],
+    imageIndex: 0,
+    visible: true,
+    onRequestClose: onClose
+    // Web MediaViewer overlay is solid black (.mediaViewer__overlay background);
+    // rgb() (no hex) keeps the repo's no-hex gate happy.
+    ,
+    backgroundColor: "rgb(0, 0, 0)"
+    // The bars take the real safe-area insets through a SafeAreaView, and the
+    // provider has to be mounted here, inside the viewer's own Modal: the
+    // provider the UIKit mounts at its root sits wherever the host app placed
+    // it (in the sample app that is below the status bar, so its top inset
+    // reads zero), and a Modal's content is a separate native hierarchy
+    // anyway. The top padding used to be a hardcoded 44 — the old notch
+    // height. On a Dynamic Island device the inset is 59, so the close button
+    // sat under the island, which does not pass touches through: the button
+    // could not be tapped at all and the viewer could not be closed.
+    ,
+    HeaderComponent: () => /*#__PURE__*/React.createElement(SafeAreaProvider, null, /*#__PURE__*/React.createElement(SafeAreaView, {
+      edges: ['top', 'left', 'right'],
+      style: styles.topBar
+    }, /*#__PURE__*/React.createElement(Pressable, {
+      style: styles.closeButton,
+      onPress: onClose,
+      accessibilityRole: "button",
+      accessibilityLabel: "Close"
+    }, /*#__PURE__*/React.createElement(AmityIcon, {
+      name: "cross-r",
+      size: 24,
+      tokenColor: AmityColorToken.IconIconButtonTransparentPrimaryDefault
+    }))))
+    // Always rendered: besides the action bar it hosts the chat toast. Save
+    // success/failure toasts fire while this Modal is open, and the global
+    // <Toast /> is mounted outside it (RN renders it beneath the native Modal
+    // layer), so a second instance lives here — it reads the same redux toast
+    // state, so only one pill is ever visible. It sits in the library's footer
+    // container, which slides away with the bars on tap-to-toggle; that is
+    // intended (bars hidden = "show me the image unobstructed"). Not a sibling
+    // <Modal>: stacked RN modals are unreliable on iOS.
+    ,
+    FooterComponent: () => /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(View, {
+      pointerEvents: "box-none",
+      style: styles.toastLayer
+    }, /*#__PURE__*/React.createElement(Toast, null)), canDelete || canSave ? /*#__PURE__*/React.createElement(SafeAreaProvider, null, /*#__PURE__*/React.createElement(SafeAreaView, {
+      edges: ['bottom', 'left', 'right'],
+      style: styles.bottomBar
+    }, canDelete ? /*#__PURE__*/React.createElement(Pressable, {
+      style: styles.bottomIconButton,
+      onPress: onDelete,
+      accessibilityRole: "button",
+      accessibilityLabel: deleteLabel
+    }, /*#__PURE__*/React.createElement(AmityIcon, {
+      name: "trash-r",
+      size: 24,
+      tokenColor: AmityColorToken.IconIconButtonTransparentPrimaryDefault
+    })) : /*#__PURE__*/React.createElement(View, null), canSave ? /*#__PURE__*/React.createElement(Pressable, {
+      style: styles.bottomIconButton,
+      onPress: onSave,
+      accessibilityRole: "button",
+      accessibilityLabel: saveLabel
+    }, /*#__PURE__*/React.createElement(AmityIcon, {
+      name: "arrow-down-to-bracket-r",
+      size: 24,
+      tokenColor: AmityColorToken.IconIconButtonTransparentPrimaryDefault
+    })) : /*#__PURE__*/React.createElement(View, null))) : null)
+  });
+}
+//# sourceMappingURL=ImageViewer.js.map

package/lib/module/chat/features/shared/components/ImageViewer/ImageViewer.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["Pressable","View","ImageView","SafeAreaProvider","SafeAreaView","AmityIcon","AmityColorToken","useString","Toast","useStyles","ImageViewer","src","onClose","isOwn","onDelete","onSave","styles","deleteLabel","saveLabel","canDelete","canSave","React","createElement","images","uri","imageIndex","visible","onRequestClose","backgroundColor","HeaderComponent","edges","style","topBar","closeButton","onPress","accessibilityRole","accessibilityLabel","name","size","tokenColor","IconIconButtonTransparentPrimaryDefault","FooterComponent","Fragment","pointerEvents","toastLayer","bottomBar","bottomIconButton"],"sourceRoot":"../../../../../../../src","sources":["chat/features/shared/components/ImageViewer/ImageViewer.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/chat/features/shared/components/ImageViewer/index.js

@@ -0,0 +1,2 @@
+export { ImageViewer } from './ImageViewer';
+//# sourceMappingURL=index.js.map

package/lib/module/chat/features/shared/components/ImageViewer/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["ImageViewer"],"sourceRoot":"../../../../../../../src","sources":["chat/features/shared/components/ImageViewer/index.ts"],"mappings":"AAAA,SAASA,WAAW,QAAQ,eAAe","ignoreList":[]}

package/lib/module/chat/features/shared/components/ImageViewer/styles.js

@@ -0,0 +1,67 @@
+// Styles for ImageViewer — the header/footer chrome layered over
+// react-native-image-viewing. Mirrors MediaViewer's bars (padding 1rem→16, buttons
+// 32/40, radius 9999). The bars are wrapped in a SafeAreaView, which supplies the
+// notch/home-indicator insets on top of this padding — they used to be hardcoded at
+// 44 and 32, which are wrong on a Dynamic Island device (real top inset 59).
+
+import { StyleSheet } from 'react-native';
+import { useToken } from '../../../../../core/design/theme/useToken';
+import { AmityColorToken } from '../../../../../core/design/tokens/amity-color-tokens';
+export const useStyles = () => {
+  const token = useToken();
+  const styles = StyleSheet.create({
+    topBar: {
+      flexDirection: 'row',
+      alignItems: 'center',
+      justifyContent: 'flex-start',
+      paddingHorizontal: 16,
+      paddingTop: 16,
+      paddingBottom: 16,
+      // Web MediaViewer bars: rgb(0 0 0 / 50%) (.mediaViewer__topBar/__bottomBar).
+      backgroundColor: 'rgba(0, 0, 0, 0.5)'
+    },
+    bottomBar: {
+      flexDirection: 'row',
+      alignItems: 'center',
+      justifyContent: 'space-between',
+      paddingHorizontal: 16,
+      paddingTop: 16,
+      paddingBottom: 16,
+      // Web MediaViewer bars: rgb(0 0 0 / 50%) (.mediaViewer__topBar/__bottomBar).
+      backgroundColor: 'rgba(0, 0, 0, 0.5)'
+    },
+    // Host for the chat toast mounted inside react-native-image-viewing's Modal
+    // (the global <Toast /> is outside it and renders beneath the native Modal
+    // layer). Anchored above the bottom bar (40 icon + 16 top + 32 bottom = 88).
+    toastLayer: {
+      position: 'absolute',
+      left: 0,
+      right: 0,
+      bottom: 88,
+      zIndex: 4
+    },
+    closeButton: {
+      width: 32,
+      height: 32,
+      alignItems: 'center',
+      justifyContent: 'center',
+      padding: 4,
+      borderRadius: 9999,
+      backgroundColor: token(AmityColorToken.SurfaceIconButtonTransparentPrimaryEnabled)
+    },
+    bottomIconButton: {
+      width: 40,
+      height: 40,
+      alignItems: 'center',
+      justifyContent: 'center',
+      padding: 8,
+      borderRadius: 9999,
+      backgroundColor: token(AmityColorToken.SurfaceIconButtonTransparentPrimaryEnabled)
+    }
+  });
+  return {
+    styles,
+    token
+  };
+};
+//# sourceMappingURL=styles.js.map

package/lib/module/chat/features/shared/components/ImageViewer/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["StyleSheet","useToken","AmityColorToken","useStyles","token","styles","create","topBar","flexDirection","alignItems","justifyContent","paddingHorizontal","paddingTop","paddingBottom","backgroundColor","bottomBar","toastLayer","position","left","right","bottom","zIndex","closeButton","width","height","padding","borderRadius","SurfaceIconButtonTransparentPrimaryEnabled","bottomIconButton"],"sourceRoot":"../../../../../../../src","sources":["chat/features/shared/components/ImageViewer/styles.ts"],"mappings":"AAAA;AACA;AACA;AACA;AACA;;AAEA,SAASA,UAAU,QAAQ,cAAc;AACzC,SAASC,QAAQ,QAAQ,2CAA2C;AACpE,SAASC,eAAe,QAAQ,sDAAsD;AAEtF,OAAO,MAAMC,SAAS,GAAGA,CAAA,KAAM;EAC7B,MAAMC,KAAK,GAAGH,QAAQ,CAAC,CAAC;EAExB,MAAMI,MAAM,GAAGL,UAAU,CAACM,MAAM,CAAC;IAC/BC,MAAM,EAAE;MACNC,aAAa,EAAE,KAAK;MACpBC,UAAU,EAAE,QAAQ;MACpBC,cAAc,EAAE,YAAY;MAC5BC,iBAAiB,EAAE,EAAE;MACrBC,UAAU,EAAE,EAAE;MACdC,aAAa,EAAE,EAAE;MACjB;MACAC,eAAe,EAAE;IACnB,CAAC;IACDC,SAAS,EAAE;MACTP,aAAa,EAAE,KAAK;MACpBC,UAAU,EAAE,QAAQ;MACpBC,cAAc,EAAE,eAAe;MAC/BC,iBAAiB,EAAE,EAAE;MACrBC,UAAU,EAAE,EAAE;MACdC,aAAa,EAAE,EAAE;MACjB;MACAC,eAAe,EAAE;IACnB,CAAC;IACD;IACA;IACA;IACAE,UAAU,EAAE;MACVC,QAAQ,EAAE,UAAU;MACpBC,IAAI,EAAE,CAAC;MACPC,KAAK,EAAE,CAAC;MACRC,MAAM,EAAE,EAAE;MACVC,MAAM,EAAE;IACV,CAAC;IACDC,WAAW,EAAE;MACXC,KAAK,EAAE,EAAE;MACTC,MAAM,EAAE,EAAE;MACVf,UAAU,EAAE,QAAQ;MACpBC,cAAc,EAAE,QAAQ;MACxBe,OAAO,EAAE,CAAC;MACVC,YAAY,EAAE,IAAI;MAClBZ,eAAe,EAAEV,KAAK,CACpBF,eAAe,CAACyB,0CAClB;IACF,CAAC;IACDC,gBAAgB,EAAE;MAChBL,KAAK,EAAE,EAAE;MACTC,MAAM,EAAE,EAAE;MACVf,UAAU,EAAE,QAAQ;MACpBC,cAAc,EAAE,QAAQ;MACxBe,OAAO,EAAE,CAAC;MACVC,YAAY,EAAE,IAAI;MAClBZ,eAAe,EAAEV,KAAK,CACpBF,eAAe,CAACyB,0CAClB;IACF;EACF,CAAC,CAAC;EAEF,OAAO;IAAEtB,MAAM;IAAED;EAAM,CAAC;AAC1B,CAAC","ignoreList":[]}