@amityco/react-native-social-uikit 4.1.0 → 4.1.1-d7da0c5c.0

package/lib/module/social/features/chat/elements/MediaUploadOverlay/MediaUploadOverlay.js

@@ -0,0 +1,33 @@
+// MediaUploadOverlay — ported from AmityUiKitWeb chat/elements/MediaUploadOverlay.
+// A dark scrim covering a media bubble while its file uploads, with a centered upload
+// spinner (Loader.Upload) that optionally exposes a cancel control. Web set the scrim
+// pointer-events: none; RN uses pointerEvents="box-none" so the cancel button stays
+// tappable while taps on the scrim itself fall through to the bubble.
+
+// 1. React / RN imports
+import { View } from 'react-native';
+
+// 2. Internal imports
+import { Loader } from '../../../../../core/design/atoms/Loader';
+import { useStyles } from './styles';
+
+// 3. Types
+
+// 4. Named function component
+export function MediaUploadOverlay({
+  onCancel,
+  cancelAccessibilityLabel = 'Cancel upload'
+}) {
+  const {
+    styles
+  } = useStyles();
+  return /*#__PURE__*/React.createElement(View, {
+    style: styles.overlay,
+    pointerEvents: "box-none"
+  }, /*#__PURE__*/React.createElement(Loader.Upload, {
+    size: "medium",
+    onCancel: onCancel,
+    accessibilityLabel: cancelAccessibilityLabel
+  }));
+}
+//# sourceMappingURL=MediaUploadOverlay.js.map

package/lib/module/social/features/chat/elements/MediaUploadOverlay/MediaUploadOverlay.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["View","Loader","useStyles","MediaUploadOverlay","onCancel","cancelAccessibilityLabel","styles","React","createElement","style","overlay","pointerEvents","Upload","size","accessibilityLabel"],"sourceRoot":"../../../../../../../src","sources":["social/features/chat/elements/MediaUploadOverlay/MediaUploadOverlay.tsx"],"mappings":"AAAA;AACA;AACA;AACA;AACA;;AAEA;AACA,SAASA,IAAI,QAAQ,cAAc;;AAEnC;AACA,SAASC,MAAM,QAAQ,yCAAyC;AAChE,SAASC,SAAS,QAAQ,UAAU;;AAEpC;;AAMA;AACA,OAAO,SAASC,kBAAkBA,CAAC;EACjCC,QAAQ;EACRC,wBAAwB,GAAG;AACJ,CAAC,EAAE;EAC1B,MAAM;IAAEC;EAAO,CAAC,GAAGJ,SAAS,CAAC,CAAC;EAE9B,oBACEK,KAAA,CAAAC,aAAA,CAACR,IAAI;IAACS,KAAK,EAAEH,MAAM,CAACI,OAAQ;IAACC,aAAa,EAAC;EAAU,gBACnDJ,KAAA,CAAAC,aAAA,CAACP,MAAM,CAACW,MAAM;IACZC,IAAI,EAAC,QAAQ;IACbT,QAAQ,EAAEA,QAAS;IACnBU,kBAAkB,EAAET;EAAyB,CAC9C,CACG,CAAC;AAEX","ignoreList":[]}

package/lib/module/social/features/chat/elements/MediaUploadOverlay/index.js

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

package/lib/module/social/features/chat/elements/MediaUploadOverlay/index.js.map

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

package/lib/module/social/features/chat/elements/MediaUploadOverlay/styles.js

@@ -0,0 +1,24 @@
+// Styles for MediaUploadOverlay — ported from AmityUiKitWeb MediaUploadOverlay.module.css.
+// Absolute inset:0 scrim centered over its parent. Web's --asc-color-message-overlay
+// (rgb(41 43 50 / 40%)) has no RN token; substituted with the closest media-context dark
+// scrim (SurfaceBadgeSemanticBadgePostStatusTotalMedia, 50% black) — reported as a gap.
+
+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({
+    overlay: {
+      ...StyleSheet.absoluteFillObject,
+      alignItems: 'center',
+      justifyContent: 'center',
+      backgroundColor: token(AmityColorToken.SurfaceBadgeSemanticBadgePostStatusTotalMedia)
+    }
+  });
+  return {
+    styles,
+    token
+  };
+};
+//# sourceMappingURL=styles.js.map

package/lib/module/social/features/chat/elements/MediaUploadOverlay/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["StyleSheet","useToken","AmityColorToken","useStyles","token","styles","create","overlay","absoluteFillObject","alignItems","justifyContent","backgroundColor","SurfaceBadgeSemanticBadgePostStatusTotalMedia"],"sourceRoot":"../../../../../../../src","sources":["social/features/chat/elements/MediaUploadOverlay/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,OAAO,EAAE;MACP,GAAGP,UAAU,CAACQ,kBAAkB;MAChCC,UAAU,EAAE,QAAQ;MACpBC,cAAc,EAAE,QAAQ;MACxBC,eAAe,EAAEP,KAAK,CACpBF,eAAe,CAACU,6CAClB;IACF;EACF,CAAC,CAAC;EAEF,OAAO;IAAEP,MAAM;IAAED;EAAM,CAAC;AAC1B,CAAC","ignoreList":[]}

package/lib/module/social/features/chat/elements/ReactionPicker/ReactionPicker.js

@@ -0,0 +1,77 @@
+// ReactionPicker — RN port of AmityUiKitWeb v4/chat/elements/ReactionPicker.
+// The horizontal reactions row shown in the message action popover. Tapping a
+// reaction fires onReactionClick (+ onSelectReaction), matching web. The active
+// reaction shows the reactionstate-active circle; the reaction name floats above
+// on press (web shows it on hover — RN has no hover, so it surfaces on press-in).
+//
+// RN adaptations from web:
+//   - Web reads the reaction set from CustomReactionProvider; RN has no runtime
+//     accessor for the top-level `message_reactions` config, so it defaults to
+//     DEFAULT_MESSAGE_REACTIONS (overridable via the `reactions` prop).
+//   - Web renders reaction.image URLs; RN renders the ported ReactionGlyph art.
+//   - Web hover/touch-hover drag + above/below label flip are web-only
+//     interactions and are omitted.
+
+// 1. React / RN imports
+import { Pressable, View } from 'react-native';
+
+// 2. Internal imports
+import { Typography } from '../../../../../core/design/components/Typography';
+import { resolveString } from '../../../../../core/localization';
+import { DEFAULT_MESSAGE_REACTIONS, ReactionGlyph } from '../../features/shared/utils/reactionIcons';
+import { useStyles } from './styles';
+
+// 3. Types
+
+// Web CustomReactionProvider.getChatReactionLabel.
+function getChatReactionLabel(reactionName) {
+  const name = reactionName.toLowerCase();
+  const key = `amity_chat_reaction_label_${name}`;
+  const localized = resolveString(key);
+  return localized === key ? reactionName : localized;
+}
+
+// 4. Named function component
+export function ReactionPicker({
+  reactions = DEFAULT_MESSAGE_REACTIONS,
+  myReaction,
+  onReactionClick,
+  onSelectReaction
+}) {
+  const {
+    styles
+  } = useStyles();
+  if (!reactions || reactions.length === 0) return null;
+  const onClickReaction = reactionName => {
+    onReactionClick(reactionName);
+    onSelectReaction === null || onSelectReaction === void 0 || onSelectReaction(reactionName);
+  };
+  return /*#__PURE__*/React.createElement(View, {
+    style: styles.pill
+  }, /*#__PURE__*/React.createElement(View, {
+    style: styles.row
+  }, reactions.map(name => {
+    const active = myReaction === name;
+    return /*#__PURE__*/React.createElement(Pressable, {
+      key: name,
+      onPress: () => onClickReaction(name),
+      accessibilityRole: "button",
+      accessibilityLabel: "Reaction picker"
+    }, ({
+      pressed
+    }) => /*#__PURE__*/React.createElement(View, {
+      style: styles.reactionButton
+    }, pressed ? /*#__PURE__*/React.createElement(View, {
+      style: styles.label
+    }, /*#__PURE__*/React.createElement(Typography, {
+      variant: "caption",
+      style: styles.labelText
+    }, getChatReactionLabel(name))) : null, active ? /*#__PURE__*/React.createElement(View, {
+      style: styles.activeBackground
+    }) : null, /*#__PURE__*/React.createElement(ReactionGlyph, {
+      name: name,
+      size: 32
+    })));
+  })));
+}
+//# sourceMappingURL=ReactionPicker.js.map

package/lib/module/social/features/chat/elements/ReactionPicker/ReactionPicker.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["Pressable","View","Typography","resolveString","DEFAULT_MESSAGE_REACTIONS","ReactionGlyph","useStyles","getChatReactionLabel","reactionName","name","toLowerCase","key","localized","ReactionPicker","reactions","myReaction","onReactionClick","onSelectReaction","styles","length","onClickReaction","React","createElement","style","pill","row","map","active","onPress","accessibilityRole","accessibilityLabel","pressed","reactionButton","label","variant","labelText","activeBackground","size"],"sourceRoot":"../../../../../../../src","sources":["social/features/chat/elements/ReactionPicker/ReactionPicker.tsx"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA,SAASA,SAAS,EAAEC,IAAI,QAAQ,cAAc;;AAE9C;AACA,SAASC,UAAU,QAAQ,kDAAkD;AAC7E,SAASC,aAAa,QAAQ,kCAAkC;AAChE,SACEC,yBAAyB,EACzBC,aAAa,QACR,2CAA2C;AAClD,SAASC,SAAS,QAAQ,UAAU;;AAEpC;;AAWA;AACA,SAASC,oBAAoBA,CAACC,YAAoB,EAAU;EAC1D,MAAMC,IAAI,GAAGD,YAAY,CAACE,WAAW,CAAC,CAAC;EACvC,MAAMC,GAAG,GAAG,6BAA6BF,IAAI,EAAE;EAC/C,MAAMG,SAAS,GAAGT,aAAa,CAACQ,GAAG,CAAC;EACpC,OAAOC,SAAS,KAAKD,GAAG,GAAGH,YAAY,GAAGI,SAAS;AACrD;;AAEA;AACA,OAAO,SAASC,cAAcA,CAAC;EAC7BC,SAAS,GAAGV,yBAAyB;EACrCW,UAAU;EACVC,eAAe;EACfC;AACmB,CAAC,EAAE;EACtB,MAAM;IAAEC;EAAO,CAAC,GAAGZ,SAAS,CAAC,CAAC;EAE9B,IAAI,CAACQ,SAAS,IAAIA,SAAS,CAACK,MAAM,KAAK,CAAC,EAAE,OAAO,IAAI;EAErD,MAAMC,eAAe,GAAIZ,YAAoB,IAAK;IAChDQ,eAAe,CAACR,YAAY,CAAC;IAC7BS,gBAAgB,aAAhBA,gBAAgB,eAAhBA,gBAAgB,CAAGT,YAAY,CAAC;EAClC,CAAC;EAED,oBACEa,KAAA,CAAAC,aAAA,CAACrB,IAAI;IAACsB,KAAK,EAAEL,MAAM,CAACM;EAAK,gBACvBH,KAAA,CAAAC,aAAA,CAACrB,IAAI;IAACsB,KAAK,EAAEL,MAAM,CAACO;EAAI,GACrBX,SAAS,CAACY,GAAG,CAAEjB,IAAI,IAAK;IACvB,MAAMkB,MAAM,GAAGZ,UAAU,KAAKN,IAAI;IAClC,oBACEY,KAAA,CAAAC,aAAA,CAACtB,SAAS;MACRW,GAAG,EAAEF,IAAK;MACVmB,OAAO,EAAEA,CAAA,KAAMR,eAAe,CAACX,IAAI,CAAE;MACrCoB,iBAAiB,EAAC,QAAQ;MAC1BC,kBAAkB,EAAC;IAAiB,GAEnC,CAAC;MAAEC;IAAQ,CAAC,kBACXV,KAAA,CAAAC,aAAA,CAACrB,IAAI;MAACsB,KAAK,EAAEL,MAAM,CAACc;IAAe,GAChCD,OAAO,gBACNV,KAAA,CAAAC,aAAA,CAACrB,IAAI;MAACsB,KAAK,EAAEL,MAAM,CAACe;IAAM,gBACxBZ,KAAA,CAAAC,aAAA,CAACpB,UAAU;MAACgC,OAAO,EAAC,SAAS;MAACX,KAAK,EAAEL,MAAM,CAACiB;IAAU,GACnD5B,oBAAoB,CAACE,IAAI,CAChB,CACR,CAAC,GACL,IAAI,EAKPkB,MAAM,gBAAGN,KAAA,CAAAC,aAAA,CAACrB,IAAI;MAACsB,KAAK,EAAEL,MAAM,CAACkB;IAAiB,CAAE,CAAC,GAAG,IAAI,eACzDf,KAAA,CAAAC,aAAA,CAACjB,aAAa;MAACI,IAAI,EAAEA,IAAK;MAAC4B,IAAI,EAAE;IAAG,CAAE,CAClC,CAEC,CAAC;EAEhB,CAAC,CACG,CACF,CAAC;AAEX","ignoreList":[]}

package/lib/module/social/features/chat/elements/ReactionPicker/index.js

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

package/lib/module/social/features/chat/elements/ReactionPicker/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["ReactionPicker"],"sourceRoot":"../../../../../../../src","sources":["social/features/chat/elements/ReactionPicker/index.ts"],"mappings":"AAAA,SAASA,cAAc,QAAQ,kBAAkB","ignoreList":[]}

package/lib/module/social/features/chat/elements/ReactionPicker/styles.js

@@ -0,0 +1,87 @@
+// Styles for ReactionPicker — ported from AmityUiKitWeb
+// v4/chat/elements/ReactionPicker/ReactionPicker.module.css PLUS the pill
+// wrapper web keeps in MessageActionsPopover.module.css
+// (`.messageActionsPopover__reactionPicker`: filled-default surface, full radius,
+// box-shadow-04). The wrapper is folded in here so the component is a drop-in
+// for the RN action menu — mounting it closes web's reactionpopover-filled-default
+// gap. Orchestrator MUST NOT double-wrap it in another pill.
+// rem→px ×16.
+
+import { StyleSheet } from 'react-native';
+import { useToken } from '../../../../../core/design/theme/useToken';
+import { useAmityTheme } from '../../../../../core/design/theme/AmityThemeProvider';
+import { AmityColorToken } from '../../../../../core/design/tokens/amity-color-tokens';
+export const useStyles = () => {
+  const token = useToken();
+  const {
+    mode
+  } = useAmityTheme();
+  const styles = StyleSheet.create({
+    // .messageActionsPopover__reactionPicker (the filled pill)
+    pill: {
+      alignSelf: 'flex-start',
+      flexDirection: 'row',
+      alignItems: 'center',
+      padding: 8,
+      borderRadius: 9999,
+      backgroundColor: token(AmityColorToken.SurfaceReactionsReactionPopoverFilledDefault),
+      // PDT-3934: match web reaction-bar elevation-08 (3 stacked layers:
+      // 0 4px 24px 4px / 0 32px 64px -12px / 0 6px 6px -4px). RN can't stack
+      // shadows, so approximate with a single heavier, softer shadow; colour is
+      // theme-aware (light rgba(41,43,50), dark rgba(0,0,0)) per the token defs.
+      shadowColor: mode === 'dark' ? 'rgb(0, 0, 0)' : 'rgb(41, 43, 50)',
+      shadowOffset: {
+        width: 0,
+        height: 8
+      },
+      shadowOpacity: 0.18,
+      shadowRadius: 24,
+      elevation: 12
+    },
+    // .reactionPickerContainer
+    row: {
+      flexDirection: 'row',
+      alignItems: 'center',
+      gap: 8
+    },
+    // .reactionButton (2rem × 2rem)
+    reactionButton: {
+      position: 'relative',
+      alignItems: 'center',
+      justifyContent: 'center',
+      width: 32,
+      height: 32
+    },
+    // .reactionButton__activeBackground
+    activeBackground: {
+      position: 'absolute',
+      top: 0,
+      left: 0,
+      width: 32,
+      height: 32,
+      borderRadius: 9999,
+      backgroundColor: token(AmityColorToken.SurfaceReactionsReactionPopoverReactionStateActive)
+    },
+    // .reactionButton__text (floating label tooltip)
+    label: {
+      position: 'absolute',
+      top: -33,
+      alignSelf: 'center',
+      maxWidth: 64,
+      paddingVertical: 2,
+      paddingHorizontal: 6,
+      borderRadius: 28,
+      backgroundColor: token(AmityColorToken.SurfaceReactionsReactionPopoverReactionNameActive),
+      zIndex: 2
+    },
+    labelText: {
+      textTransform: 'capitalize',
+      textAlign: 'center',
+      color: token(AmityColorToken.TextReactionsReactionPopoverReactionNameGeneral)
+    }
+  });
+  return {
+    styles
+  };
+};
+//# sourceMappingURL=styles.js.map

package/lib/module/social/features/chat/elements/ReactionPicker/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["StyleSheet","useToken","useAmityTheme","AmityColorToken","useStyles","token","mode","styles","create","pill","alignSelf","flexDirection","alignItems","padding","borderRadius","backgroundColor","SurfaceReactionsReactionPopoverFilledDefault","shadowColor","shadowOffset","width","height","shadowOpacity","shadowRadius","elevation","row","gap","reactionButton","position","justifyContent","activeBackground","top","left","SurfaceReactionsReactionPopoverReactionStateActive","label","maxWidth","paddingVertical","paddingHorizontal","SurfaceReactionsReactionPopoverReactionNameActive","zIndex","labelText","textTransform","textAlign","color","TextReactionsReactionPopoverReactionNameGeneral"],"sourceRoot":"../../../../../../../src","sources":["social/features/chat/elements/ReactionPicker/styles.ts"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,UAAU,QAAQ,cAAc;AACzC,SAASC,QAAQ,QAAQ,2CAA2C;AACpE,SAASC,aAAa,QAAQ,qDAAqD;AACnF,SAASC,eAAe,QAAQ,sDAAsD;AAEtF,OAAO,MAAMC,SAAS,GAAGA,CAAA,KAAM;EAC7B,MAAMC,KAAK,GAAGJ,QAAQ,CAAC,CAAC;EACxB,MAAM;IAAEK;EAAK,CAAC,GAAGJ,aAAa,CAAC,CAAC;EAEhC,MAAMK,MAAM,GAAGP,UAAU,CAACQ,MAAM,CAAC;IAC/B;IACAC,IAAI,EAAE;MACJC,SAAS,EAAE,YAAY;MACvBC,aAAa,EAAE,KAAK;MACpBC,UAAU,EAAE,QAAQ;MACpBC,OAAO,EAAE,CAAC;MACVC,YAAY,EAAE,IAAI;MAClBC,eAAe,EAAEV,KAAK,CACpBF,eAAe,CAACa,4CAClB,CAAC;MACD;MACA;MACA;MACA;MACAC,WAAW,EAAEX,IAAI,KAAK,MAAM,GAAG,cAAc,GAAG,iBAAiB;MACjEY,YAAY,EAAE;QAAEC,KAAK,EAAE,CAAC;QAAEC,MAAM,EAAE;MAAE,CAAC;MACrCC,aAAa,EAAE,IAAI;MACnBC,YAAY,EAAE,EAAE;MAChBC,SAAS,EAAE;IACb,CAAC;IACD;IACAC,GAAG,EAAE;MACHb,aAAa,EAAE,KAAK;MACpBC,UAAU,EAAE,QAAQ;MACpBa,GAAG,EAAE;IACP,CAAC;IACD;IACAC,cAAc,EAAE;MACdC,QAAQ,EAAE,UAAU;MACpBf,UAAU,EAAE,QAAQ;MACpBgB,cAAc,EAAE,QAAQ;MACxBT,KAAK,EAAE,EAAE;MACTC,MAAM,EAAE;IACV,CAAC;IACD;IACAS,gBAAgB,EAAE;MAChBF,QAAQ,EAAE,UAAU;MACpBG,GAAG,EAAE,CAAC;MACNC,IAAI,EAAE,CAAC;MACPZ,KAAK,EAAE,EAAE;MACTC,MAAM,EAAE,EAAE;MACVN,YAAY,EAAE,IAAI;MAClBC,eAAe,EAAEV,KAAK,CACpBF,eAAe,CAAC6B,kDAClB;IACF,CAAC;IACD;IACAC,KAAK,EAAE;MACLN,QAAQ,EAAE,UAAU;MACpBG,GAAG,EAAE,CAAC,EAAE;MACRpB,SAAS,EAAE,QAAQ;MACnBwB,QAAQ,EAAE,EAAE;MACZC,eAAe,EAAE,CAAC;MAClBC,iBAAiB,EAAE,CAAC;MACpBtB,YAAY,EAAE,EAAE;MAChBC,eAAe,EAAEV,KAAK,CACpBF,eAAe,CAACkC,iDAClB,CAAC;MACDC,MAAM,EAAE;IACV,CAAC;IACDC,SAAS,EAAE;MACTC,aAAa,EAAE,YAAY;MAC3BC,SAAS,EAAE,QAAQ;MACnBC,KAAK,EAAErC,KAAK,CACVF,eAAe,CAACwC,+CAClB;IACF;EACF,CAAC,CAAC;EAEF,OAAO;IAAEpC;EAAO,CAAC;AACnB,CAAC","ignoreList":[]}

package/lib/module/social/features/chat/elements/SettingMenu/SettingMenu.js

@@ -0,0 +1,63 @@
+// SettingMenu element — ported from AmityUiKitWeb chat/elements/SettingMenu.
+// A single tappable settings row: leading icon-badge + label on the left, an
+// optional trailing text + chevron on the right. A `destructive` row instead
+// renders just a bold destructive-coloured label (e.g. "Leave group").
+//
+// RN adaptation from web: web's `icon?: React.ElementType` cannot cross the RN
+// icon system (SoT SVGs rendered by name), so it becomes `iconName?: AmityIconName`.
+
+// 1. React / RN imports
+import { Pressable, View } from 'react-native';
+
+// 2. Internal imports (relative)
+import { Typography } from '../../../../../core/design/components/Typography';
+import { AmityIcon } from '../../../../../core/design/icons';
+import { AmityColorToken } from '../../../../../core/design/tokens/amity-color-tokens';
+import { useStyles } from './styles';
+
+// 3. Types
+
+// 4. Named function component
+export function SettingMenu({
+  iconName,
+  label,
+  trailingText,
+  destructive = false,
+  accessibilityLabel,
+  onPress
+}) {
+  const {
+    styles
+  } = useStyles();
+  return /*#__PURE__*/React.createElement(Pressable, {
+    style: styles.row,
+    onPress: onPress,
+    accessibilityRole: "button",
+    accessibilityLabel: accessibilityLabel ?? label
+  }, destructive ? /*#__PURE__*/React.createElement(Typography, {
+    variant: "bodyBold",
+    style: styles.destructiveLabel
+  }, label) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(View, {
+    style: styles.leading
+  }, iconName ? /*#__PURE__*/React.createElement(View, {
+    style: styles.iconBadge
+  }, /*#__PURE__*/React.createElement(AmityIcon, {
+    name: iconName,
+    size: 24,
+    tokenColor: AmityColorToken.IconFeaturedIconTinted
+  })) : null, /*#__PURE__*/React.createElement(Typography, {
+    variant: "body",
+    style: styles.label,
+    numberOfLines: 1
+  }, label)), /*#__PURE__*/React.createElement(View, {
+    style: styles.trailing
+  }, trailingText ? /*#__PURE__*/React.createElement(Typography, {
+    variant: "body",
+    style: styles.trailingText
+  }, trailingText) : null, /*#__PURE__*/React.createElement(AmityIcon, {
+    name: "chevron-right",
+    size: 24,
+    tokenColor: AmityColorToken.IconListLeadingDefaultDefault
+  }))));
+}
+//# sourceMappingURL=SettingMenu.js.map

package/lib/module/social/features/chat/elements/SettingMenu/SettingMenu.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["Pressable","View","Typography","AmityIcon","AmityColorToken","useStyles","SettingMenu","iconName","label","trailingText","destructive","accessibilityLabel","onPress","styles","React","createElement","style","row","accessibilityRole","variant","destructiveLabel","Fragment","leading","iconBadge","name","size","tokenColor","IconFeaturedIconTinted","numberOfLines","trailing","IconListLeadingDefaultDefault"],"sourceRoot":"../../../../../../../src","sources":["social/features/chat/elements/SettingMenu/SettingMenu.tsx"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA,SAASA,SAAS,EAAEC,IAAI,QAAQ,cAAc;;AAE9C;AACA,SAASC,UAAU,QAAQ,kDAAkD;AAC7E,SACEC,SAAS,QAEJ,kCAAkC;AACzC,SAASC,eAAe,QAAQ,sDAAsD;AACtF,SAASC,SAAS,QAAQ,UAAU;;AAEpC;;AAWA;AACA,OAAO,SAASC,WAAWA,CAAC;EAC1BC,QAAQ;EACRC,KAAK;EACLC,YAAY;EACZC,WAAW,GAAG,KAAK;EACnBC,kBAAkB;EAClBC;AACgB,CAAC,EAAE;EACnB,MAAM;IAAEC;EAAO,CAAC,GAAGR,SAAS,CAAC,CAAC;EAE9B,oBACES,KAAA,CAAAC,aAAA,CAACf,SAAS;IACRgB,KAAK,EAAEH,MAAM,CAACI,GAAI;IAClBL,OAAO,EAAEA,OAAQ;IACjBM,iBAAiB,EAAC,QAAQ;IAC1BP,kBAAkB,EAAEA,kBAAkB,IAAIH;EAAM,GAE/CE,WAAW,gBACVI,KAAA,CAAAC,aAAA,CAACb,UAAU;IAACiB,OAAO,EAAC,UAAU;IAACH,KAAK,EAAEH,MAAM,CAACO;EAAiB,GAC3DZ,KACS,CAAC,gBAEbM,KAAA,CAAAC,aAAA,CAAAD,KAAA,CAAAO,QAAA,qBACEP,KAAA,CAAAC,aAAA,CAACd,IAAI;IAACe,KAAK,EAAEH,MAAM,CAACS;EAAQ,GACzBf,QAAQ,gBACPO,KAAA,CAAAC,aAAA,CAACd,IAAI;IAACe,KAAK,EAAEH,MAAM,CAACU;EAAU,gBAC5BT,KAAA,CAAAC,aAAA,CAACZ,SAAS;IACRqB,IAAI,EAAEjB,QAAS;IACfkB,IAAI,EAAE,EAAG;IACTC,UAAU,EAAEtB,eAAe,CAACuB;EAAuB,CACpD,CACG,CAAC,GACL,IAAI,eACRb,KAAA,CAAAC,aAAA,CAACb,UAAU;IAACiB,OAAO,EAAC,MAAM;IAACH,KAAK,EAAEH,MAAM,CAACL,KAAM;IAACoB,aAAa,EAAE;EAAE,GAC9DpB,KACS,CACR,CAAC,eACPM,KAAA,CAAAC,aAAA,CAACd,IAAI;IAACe,KAAK,EAAEH,MAAM,CAACgB;EAAS,GAC1BpB,YAAY,gBACXK,KAAA,CAAAC,aAAA,CAACb,UAAU;IAACiB,OAAO,EAAC,MAAM;IAACH,KAAK,EAAEH,MAAM,CAACJ;EAAa,GACnDA,YACS,CAAC,GACX,IAAI,eACRK,KAAA,CAAAC,aAAA,CAACZ,SAAS;IACRqB,IAAI,EAAC,eAAe;IACpBC,IAAI,EAAE,EAAG;IACTC,UAAU,EAAEtB,eAAe,CAAC0B;EAA8B,CAC3D,CACG,CACN,CAEK,CAAC;AAEhB","ignoreList":[]}

package/lib/module/social/features/chat/elements/SettingMenu/index.js

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

package/lib/module/social/features/chat/elements/SettingMenu/index.js.map

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

package/lib/module/social/features/chat/elements/SettingMenu/styles.js

@@ -0,0 +1,59 @@
+import { StyleSheet } from 'react-native';
+import { useToken } from '../../../../../core/design/theme/useToken';
+import { AmityColorToken } from '../../../../../core/design/tokens/amity-color-tokens';
+
+// Geometry ported from AmityUiKitWeb SettingMenu.module.css (rem -> px, x16):
+// row padding 1rem=16, gap 0.5rem=8; leading gap 0.75rem=12; icon badge 2rem=32
+// (padding 0.25rem=4, radius 0.5rem=8); icon 1.5rem=24; chevron 1.5rem=24;
+// trailing gap 0.5rem=8.
+export const useStyles = () => {
+  const token = useToken();
+  const styles = StyleSheet.create({
+    row: {
+      flexDirection: 'row',
+      alignItems: 'center',
+      justifyContent: 'space-between',
+      gap: 8,
+      width: '100%',
+      padding: 16,
+      backgroundColor: token(AmityColorToken.SurfaceListDefaultDefault)
+    },
+    leading: {
+      flex: 1,
+      minWidth: 0,
+      flexDirection: 'row',
+      alignItems: 'center',
+      gap: 12,
+      overflow: 'hidden'
+    },
+    iconBadge: {
+      alignItems: 'center',
+      justifyContent: 'center',
+      width: 32,
+      height: 32,
+      padding: 4,
+      borderRadius: 8,
+      backgroundColor: token(AmityColorToken.SurfaceFeaturedIconTinted)
+    },
+    label: {
+      flexShrink: 1,
+      color: token(AmityColorToken.TextListHeaderDefaultDefault)
+    },
+    destructiveLabel: {
+      color: token(AmityColorToken.TextListHeaderDestructiveDefault)
+    },
+    trailing: {
+      flexDirection: 'row',
+      alignItems: 'center',
+      gap: 8
+    },
+    trailingText: {
+      color: token(AmityColorToken.TextListTrailingTextGeneral)
+    }
+  });
+  return {
+    styles,
+    token
+  };
+};
+//# sourceMappingURL=styles.js.map

package/lib/module/social/features/chat/elements/SettingMenu/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["StyleSheet","useToken","AmityColorToken","useStyles","token","styles","create","row","flexDirection","alignItems","justifyContent","gap","width","padding","backgroundColor","SurfaceListDefaultDefault","leading","flex","minWidth","overflow","iconBadge","height","borderRadius","SurfaceFeaturedIconTinted","label","flexShrink","color","TextListHeaderDefaultDefault","destructiveLabel","TextListHeaderDestructiveDefault","trailing","trailingText","TextListTrailingTextGeneral"],"sourceRoot":"../../../../../../../src","sources":["social/features/chat/elements/SettingMenu/styles.ts"],"mappings":"AAAA,SAASA,UAAU,QAAQ,cAAc;AACzC,SAASC,QAAQ,QAAQ,2CAA2C;AACpE,SAASC,eAAe,QAAQ,sDAAsD;;AAEtF;AACA;AACA;AACA;AACA,OAAO,MAAMC,SAAS,GAAGA,CAAA,KAAM;EAC7B,MAAMC,KAAK,GAAGH,QAAQ,CAAC,CAAC;EAExB,MAAMI,MAAM,GAAGL,UAAU,CAACM,MAAM,CAAC;IAC/BC,GAAG,EAAE;MACHC,aAAa,EAAE,KAAK;MACpBC,UAAU,EAAE,QAAQ;MACpBC,cAAc,EAAE,eAAe;MAC/BC,GAAG,EAAE,CAAC;MACNC,KAAK,EAAE,MAAM;MACbC,OAAO,EAAE,EAAE;MACXC,eAAe,EAAEV,KAAK,CAACF,eAAe,CAACa,yBAAyB;IAClE,CAAC;IACDC,OAAO,EAAE;MACPC,IAAI,EAAE,CAAC;MACPC,QAAQ,EAAE,CAAC;MACXV,aAAa,EAAE,KAAK;MACpBC,UAAU,EAAE,QAAQ;MACpBE,GAAG,EAAE,EAAE;MACPQ,QAAQ,EAAE;IACZ,CAAC;IACDC,SAAS,EAAE;MACTX,UAAU,EAAE,QAAQ;MACpBC,cAAc,EAAE,QAAQ;MACxBE,KAAK,EAAE,EAAE;MACTS,MAAM,EAAE,EAAE;MACVR,OAAO,EAAE,CAAC;MACVS,YAAY,EAAE,CAAC;MACfR,eAAe,EAAEV,KAAK,CAACF,eAAe,CAACqB,yBAAyB;IAClE,CAAC;IACDC,KAAK,EAAE;MACLC,UAAU,EAAE,CAAC;MACbC,KAAK,EAAEtB,KAAK,CAACF,eAAe,CAACyB,4BAA4B;IAC3D,CAAC;IACDC,gBAAgB,EAAE;MAChBF,KAAK,EAAEtB,KAAK,CAACF,eAAe,CAAC2B,gCAAgC;IAC/D,CAAC;IACDC,QAAQ,EAAE;MACRtB,aAAa,EAAE,KAAK;MACpBC,UAAU,EAAE,QAAQ;MACpBE,GAAG,EAAE;IACP,CAAC;IACDoB,YAAY,EAAE;MACZL,KAAK,EAAEtB,KAAK,CAACF,eAAe,CAAC8B,2BAA2B;IAC1D;EACF,CAAC,CAAC;EAEF,OAAO;IAAE3B,MAAM;IAAED;EAAM,CAAC;AAC1B,CAAC","ignoreList":[]}

package/lib/module/social/features/chat/elements/TopBar/TopBar.js

@@ -0,0 +1,55 @@
+// TopBar — ported from AmityUiKitWeb v4/chat/elements/TopBar.
+// A generic top bar: a leading icon button (back chevron or close cross), a
+// centered bold title, and an optional trailing slot.
+//
+// RN adaptations from web:
+//   - Web `Button.Icon` (ghost/secondary) → a Pressable + AmityIcon tinted with
+//     the Icon/IconButton/Ghost/Secondary token (matches the conversation Header).
+//   - `<header>`/`<div>` → View. `position: sticky` has no RN equivalent and is
+//     dropped — the hosting page lays the bar out at the top.
+
+// 1. React / RN imports
+
+import { Pressable, View } from 'react-native';
+
+// 2. Internal imports (relative)
+import { Typography } from '../../../../../core/design/components/Typography';
+import { AmityIcon } from '../../../../../core/design/icons';
+import { AmityColorToken } from '../../../../../core/design/tokens/amity-color-tokens';
+import { useStyles } from './styles';
+
+// 3. Types
+
+// 4. Named function component
+export function TopBar({
+  title,
+  leadingType = 'back',
+  onLeading,
+  trailing
+}) {
+  const {
+    styles
+  } = useStyles();
+  const isBack = leadingType === 'back';
+  return /*#__PURE__*/React.createElement(View, {
+    style: styles.topBar
+  }, /*#__PURE__*/React.createElement(View, {
+    style: styles.leftAction
+  }, /*#__PURE__*/React.createElement(Pressable, {
+    style: styles.iconButton,
+    onPress: onLeading,
+    accessibilityRole: "button",
+    accessibilityLabel: isBack ? 'Back' : 'Close'
+  }, /*#__PURE__*/React.createElement(AmityIcon, {
+    name: isBack ? 'chevron-left' : 'cross-r',
+    size: 24,
+    tokenColor: AmityColorToken.IconIconButtonGhostSecondaryDefault
+  }))), /*#__PURE__*/React.createElement(Typography, {
+    variant: "titleBold",
+    style: styles.title,
+    numberOfLines: 1
+  }, title), /*#__PURE__*/React.createElement(View, {
+    style: styles.rightAction
+  }, trailing));
+}
+//# sourceMappingURL=TopBar.js.map

package/lib/module/social/features/chat/elements/TopBar/TopBar.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["Pressable","View","Typography","AmityIcon","AmityColorToken","useStyles","TopBar","title","leadingType","onLeading","trailing","styles","isBack","React","createElement","style","topBar","leftAction","iconButton","onPress","accessibilityRole","accessibilityLabel","name","size","tokenColor","IconIconButtonGhostSecondaryDefault","variant","numberOfLines","rightAction"],"sourceRoot":"../../../../../../../src","sources":["social/features/chat/elements/TopBar/TopBar.tsx"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;;AAEA,SAASA,SAAS,EAAEC,IAAI,QAAQ,cAAc;;AAE9C;AACA,SAASC,UAAU,QAAQ,kDAAkD;AAC7E,SAASC,SAAS,QAAQ,kCAAkC;AAC5D,SAASC,eAAe,QAAQ,sDAAsD;AACtF,SAASC,SAAS,QAAQ,UAAU;;AAEpC;;AAQA;AACA,OAAO,SAASC,MAAMA,CAAC;EACrBC,KAAK;EACLC,WAAW,GAAG,MAAM;EACpBC,SAAS;EACTC;AACW,CAAC,EAAE;EACd,MAAM;IAAEC;EAAO,CAAC,GAAGN,SAAS,CAAC,CAAC;EAC9B,MAAMO,MAAM,GAAGJ,WAAW,KAAK,MAAM;EAErC,oBACEK,KAAA,CAAAC,aAAA,CAACb,IAAI;IAACc,KAAK,EAAEJ,MAAM,CAACK;EAAO,gBACzBH,KAAA,CAAAC,aAAA,CAACb,IAAI;IAACc,KAAK,EAAEJ,MAAM,CAACM;EAAW,gBAC7BJ,KAAA,CAAAC,aAAA,CAACd,SAAS;IACRe,KAAK,EAAEJ,MAAM,CAACO,UAAW;IACzBC,OAAO,EAAEV,SAAU;IACnBW,iBAAiB,EAAC,QAAQ;IAC1BC,kBAAkB,EAAET,MAAM,GAAG,MAAM,GAAG;EAAQ,gBAE9CC,KAAA,CAAAC,aAAA,CAACX,SAAS;IACRmB,IAAI,EAAEV,MAAM,GAAG,cAAc,GAAG,SAAU;IAC1CW,IAAI,EAAE,EAAG;IACTC,UAAU,EAAEpB,eAAe,CAACqB;EAAoC,CACjE,CACQ,CACP,CAAC,eACPZ,KAAA,CAAAC,aAAA,CAACZ,UAAU;IAACwB,OAAO,EAAC,WAAW;IAACX,KAAK,EAAEJ,MAAM,CAACJ,KAAM;IAACoB,aAAa,EAAE;EAAE,GACnEpB,KACS,CAAC,eACbM,KAAA,CAAAC,aAAA,CAACb,IAAI;IAACc,KAAK,EAAEJ,MAAM,CAACiB;EAAY,GAAElB,QAAe,CAC7C,CAAC;AAEX","ignoreList":[]}

package/lib/module/social/features/chat/elements/TopBar/index.js

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

package/lib/module/social/features/chat/elements/TopBar/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["TopBar"],"sourceRoot":"../../../../../../../src","sources":["social/features/chat/elements/TopBar/index.ts"],"mappings":"AAAA,SAASA,MAAM,QAAQ,UAAU","ignoreList":[]}

package/lib/module/social/features/chat/elements/TopBar/styles.js

@@ -0,0 +1,51 @@
+// Styles for TopBar — ported from AmityUiKitWeb v4/chat/elements/TopBar.module.css.
+// Geometry: gap 0.5rem→8, padding 0.75rem 1rem→12/16, height 3.5rem→56,
+// title max-width 16rem→256. Colours via design tokens (no hardcoded hex).
+
+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',
+      gap: 8,
+      paddingVertical: 12,
+      paddingHorizontal: 16,
+      height: 56,
+      backgroundColor: token(AmityColorToken.SurfacePageBackgroundDefault)
+    },
+    leftAction: {
+      flex: 1,
+      flexDirection: 'row',
+      alignItems: 'center',
+      minWidth: 0
+    },
+    rightAction: {
+      flex: 1,
+      flexDirection: 'row',
+      alignItems: 'center',
+      justifyContent: 'flex-end',
+      minWidth: 0
+    },
+    title: {
+      flexShrink: 0,
+      maxWidth: 256,
+      textAlign: 'center',
+      color: token(AmityColorToken.TextSheetsHeaderTitleDefault)
+    },
+    iconButton: {
+      width: 32,
+      height: 32,
+      alignItems: 'center',
+      justifyContent: 'center'
+    }
+  });
+  return {
+    styles,
+    token
+  };
+};
+//# sourceMappingURL=styles.js.map

package/lib/module/social/features/chat/elements/TopBar/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["StyleSheet","useToken","AmityColorToken","useStyles","token","styles","create","topBar","flexDirection","alignItems","gap","paddingVertical","paddingHorizontal","height","backgroundColor","SurfacePageBackgroundDefault","leftAction","flex","minWidth","rightAction","justifyContent","title","flexShrink","maxWidth","textAlign","color","TextSheetsHeaderTitleDefault","iconButton","width"],"sourceRoot":"../../../../../../../src","sources":["social/features/chat/elements/TopBar/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,MAAM,EAAE;MACNC,aAAa,EAAE,KAAK;MACpBC,UAAU,EAAE,QAAQ;MACpBC,GAAG,EAAE,CAAC;MACNC,eAAe,EAAE,EAAE;MACnBC,iBAAiB,EAAE,EAAE;MACrBC,MAAM,EAAE,EAAE;MACVC,eAAe,EAAEV,KAAK,CAACF,eAAe,CAACa,4BAA4B;IACrE,CAAC;IACDC,UAAU,EAAE;MACVC,IAAI,EAAE,CAAC;MACPT,aAAa,EAAE,KAAK;MACpBC,UAAU,EAAE,QAAQ;MACpBS,QAAQ,EAAE;IACZ,CAAC;IACDC,WAAW,EAAE;MACXF,IAAI,EAAE,CAAC;MACPT,aAAa,EAAE,KAAK;MACpBC,UAAU,EAAE,QAAQ;MACpBW,cAAc,EAAE,UAAU;MAC1BF,QAAQ,EAAE;IACZ,CAAC;IACDG,KAAK,EAAE;MACLC,UAAU,EAAE,CAAC;MACbC,QAAQ,EAAE,GAAG;MACbC,SAAS,EAAE,QAAQ;MACnBC,KAAK,EAAErB,KAAK,CAACF,eAAe,CAACwB,4BAA4B;IAC3D,CAAC;IACDC,UAAU,EAAE;MACVC,KAAK,EAAE,EAAE;MACTf,MAAM,EAAE,EAAE;MACVJ,UAAU,EAAE,QAAQ;MACpBW,cAAc,EAAE;IAClB;EACF,CAAC,CAAC;EAEF,OAAO;IAAEf,MAAM;IAAED;EAAM,CAAC;AAC1B,CAAC","ignoreList":[]}

package/lib/module/social/features/chat/elements/WaitingForNetwork/WaitingForNetwork.js

@@ -0,0 +1,49 @@
+// WaitingForNetwork — ported from AmityUiKitWeb v4/chat/elements/WaitingForNetwork.
+// An offline indicator: a small spinner + label, shown only while the device is
+// offline.
+//
+// RN adaptations from web:
+//   - Web reads `react-use`'s `useNetworkState().online`; RN subscribes to
+//     `@react-native-community/netinfo` (already a repo dependency).
+//   - `state.isConnected` is `null` until the first callback, so we render only
+//     when it is explicitly `false` (mirrors web's `online !== false` guard,
+//     avoiding a flash on mount).
+
+// 1. React / RN imports
+import { useEffect, useState } from 'react';
+import { View } from 'react-native';
+
+// 2. Third-party imports
+import NetInfo from '@react-native-community/netinfo';
+
+// 3. Internal imports (relative)
+import { Typography } from '../../../../../core/design/components/Typography';
+import { Loader } from '../../../../../core/design/atoms/Loader';
+import { useString } from '../../../../../core/localization';
+import { useStyles } from './styles';
+
+// 4. Named function component
+export function WaitingForNetwork() {
+  const {
+    styles
+  } = useStyles();
+  const [isOffline, setIsOffline] = useState(false);
+  const label = useString('amity_chat_waiting_for_network');
+  useEffect(() => {
+    const unsubscribe = NetInfo.addEventListener(state => {
+      setIsOffline(state.isConnected === false);
+    });
+    return () => unsubscribe();
+  }, []);
+  if (!isOffline) return null;
+  return /*#__PURE__*/React.createElement(View, {
+    style: styles.waitingForNetwork
+  }, /*#__PURE__*/React.createElement(Loader.Spinner, {
+    size: "sm"
+  }), /*#__PURE__*/React.createElement(Typography, {
+    variant: "caption",
+    style: styles.text,
+    numberOfLines: 1
+  }, label));
+}
+//# sourceMappingURL=WaitingForNetwork.js.map

package/lib/module/social/features/chat/elements/WaitingForNetwork/WaitingForNetwork.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["useEffect","useState","View","NetInfo","Typography","Loader","useString","useStyles","WaitingForNetwork","styles","isOffline","setIsOffline","label","unsubscribe","addEventListener","state","isConnected","React","createElement","style","waitingForNetwork","Spinner","size","variant","text","numberOfLines"],"sourceRoot":"../../../../../../../src","sources":["social/features/chat/elements/WaitingForNetwork/WaitingForNetwork.tsx"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA,SAASA,SAAS,EAAEC,QAAQ,QAAQ,OAAO;AAC3C,SAASC,IAAI,QAAQ,cAAc;;AAEnC;AACA,OAAOC,OAAO,MAAM,iCAAiC;;AAErD;AACA,SAASC,UAAU,QAAQ,kDAAkD;AAC7E,SAASC,MAAM,QAAQ,yCAAyC;AAChE,SAASC,SAAS,QAAQ,kCAAkC;AAC5D,SAASC,SAAS,QAAQ,UAAU;;AAEpC;AACA,OAAO,SAASC,iBAAiBA,CAAA,EAAG;EAClC,MAAM;IAAEC;EAAO,CAAC,GAAGF,SAAS,CAAC,CAAC;EAC9B,MAAM,CAACG,SAAS,EAAEC,YAAY,CAAC,GAAGV,QAAQ,CAAC,KAAK,CAAC;EACjD,MAAMW,KAAK,GAAGN,SAAS,CAAC,gCAAgC,CAAC;EAEzDN,SAAS,CAAC,MAAM;IACd,MAAMa,WAAW,GAAGV,OAAO,CAACW,gBAAgB,CAAEC,KAAK,IAAK;MACtDJ,YAAY,CAACI,KAAK,CAACC,WAAW,KAAK,KAAK,CAAC;IAC3C,CAAC,CAAC;IACF,OAAO,MAAMH,WAAW,CAAC,CAAC;EAC5B,CAAC,EAAE,EAAE,CAAC;EAEN,IAAI,CAACH,SAAS,EAAE,OAAO,IAAI;EAE3B,oBACEO,KAAA,CAAAC,aAAA,CAAChB,IAAI;IAACiB,KAAK,EAAEV,MAAM,CAACW;EAAkB,gBACpCH,KAAA,CAAAC,aAAA,CAACb,MAAM,CAACgB,OAAO;IAACC,IAAI,EAAC;EAAI,CAAE,CAAC,eAC5BL,KAAA,CAAAC,aAAA,CAACd,UAAU;IAACmB,OAAO,EAAC,SAAS;IAACJ,KAAK,EAAEV,MAAM,CAACe,IAAK;IAACC,aAAa,EAAE;EAAE,GAChEb,KACS,CACR,CAAC;AAEX","ignoreList":[]}

package/lib/module/social/features/chat/elements/WaitingForNetwork/index.js

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

package/lib/module/social/features/chat/elements/WaitingForNetwork/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["WaitingForNetwork"],"sourceRoot":"../../../../../../../src","sources":["social/features/chat/elements/WaitingForNetwork/index.ts"],"mappings":"AAAA,SAASA,iBAAiB,QAAQ,qBAAqB","ignoreList":[]}

package/lib/module/social/features/chat/elements/WaitingForNetwork/styles.js

@@ -0,0 +1,31 @@
+// Styles for WaitingForNetwork — ported from AmityUiKitWeb
+// v4/chat/elements/WaitingForNetwork.module.css. Geometry: gap 0.25rem→4.
+// Colours via design tokens (no hardcoded hex).
+
+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({
+    waitingForNetwork: {
+      flexDirection: 'row',
+      alignItems: 'center',
+      gap: 4,
+      // Web pins this to flex-shrink: 0 — safe on a desktop header, but on a phone
+      // the chat-list header has barely enough room and the label overflowed on top
+      // of the action buttons. Allow it to shrink; the label ellipsizes instead.
+      flexShrink: 1,
+      minWidth: 0
+    },
+    text: {
+      flexShrink: 1,
+      color: token(AmityColorToken.TextListTextDescriptionDefaultDefault)
+    }
+  });
+  return {
+    styles,
+    token
+  };
+};
+//# sourceMappingURL=styles.js.map

package/lib/module/social/features/chat/elements/WaitingForNetwork/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["StyleSheet","useToken","AmityColorToken","useStyles","token","styles","create","waitingForNetwork","flexDirection","alignItems","gap","flexShrink","minWidth","text","color","TextListTextDescriptionDefaultDefault"],"sourceRoot":"../../../../../../../src","sources":["social/features/chat/elements/WaitingForNetwork/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,iBAAiB,EAAE;MACjBC,aAAa,EAAE,KAAK;MACpBC,UAAU,EAAE,QAAQ;MACpBC,GAAG,EAAE,CAAC;MACN;MACA;MACA;MACAC,UAAU,EAAE,CAAC;MACbC,QAAQ,EAAE;IACZ,CAAC;IACDC,IAAI,EAAE;MACJF,UAAU,EAAE,CAAC;MACbG,KAAK,EAAEV,KAAK,CAACF,eAAe,CAACa,qCAAqC;IACpE;EACF,CAAC,CAAC;EAEF,OAAO;IAAEV,MAAM;IAAED;EAAM,CAAC;AAC1B,CAAC","ignoreList":[]}