@pushwoosh/dumb-components 1.1.224 → 1.1.226

package/WhatsAppPreview/types.d.ts

@@ -1,8 +1,4 @@
 import type { ReactNode } from 'react';
-/** Who sent the message: `outgoing` is the phone owner (green, right), `incoming` is the business (white, left). */
-export type WhatsAppMessageDirection = 'incoming' | 'outgoing';
-/** Delivery state drawn as ticks next to an outgoing message's time. */
-export type WhatsAppMessageStatus = 'sent' | 'delivered' | 'read';
 /** How WhatsApp draws an attachment: media fills the bubble, a document becomes a card inside it. */
 export type WhatsAppAttachmentKind = 'image' | 'video' | 'document';
 /** File attached to a {@link WhatsAppMessage}. */
@@ -19,46 +15,26 @@ export interface WhatsAppAttachment {
     kind?: WhatsAppAttachmentKind;
     /** Video length in seconds; read from the file itself when omitted. */
     duration?: number;
+    /** Ready-made poster — a document's first page or a video frame — drawn instead of decoding the file itself. */
+    thumbnailSource?: string;
+    /** Page count of the document, shown in the meta line before the size. */
+    pageCount?: number;
 }
-/** One chat bubble of {@link WhatsAppPreview}. */
+/** The message drawn by {@link WhatsAppPreview}. */
 export interface WhatsAppMessage {
-    /** Stable key when the list is re-ordered or edited. */
-    id?: string;
-    /** Bubble side and colour. */
-    direction: WhatsAppMessageDirection;
     /** Message body; WhatsApp markup (`*bold*`, `_italic_`, `~strike~`, `` `mono` ``) is rendered. */
     text?: string;
     /** Custom body rendered instead of `text` — e.g. an inline editor for the welcome message. */
     content?: ReactNode;
-    /** File shown above the text, the way WhatsApp renders images, videos and documents. */
-    attachment?: WhatsAppAttachment;
-    /** Time stamp inside the bubble. */
-    time?: string;
-    /** Tick state; ignored for incoming messages. */
-    status?: WhatsAppMessageStatus;
+    /** Files shown above the text, in order, the way WhatsApp renders images, videos and documents. */
+    attachments?: WhatsAppAttachment[];
 }
 /** Props of {@link WhatsAppPreview}. */
 export interface WhatsAppPreviewProps {
-    /** Chat messages, oldest first. */
-    messages?: WhatsAppMessage[];
-    /** Business name in the chat header. */
-    contactName?: string;
-    /** Caption under the name; defaults to the localized "Business account". */
-    contactSubtitle?: string;
-    /** Business avatar URL; a placeholder glyph is drawn when absent. */
-    avatarUrl?: string;
-    /** Date separator above the first message; hide it with an empty string. */
-    dateLabel?: string;
-    /** Clock in the device status bar. */
-    statusBarTime?: string;
-    /** Chat wallpaper URL replacing the built-in pattern. */
-    wallpaperUrl?: string;
-    /** Text shown on the wallpaper while the chat has no messages. */
+    /** Message to draw; the placeholder is shown while it has neither body nor files. */
+    message?: WhatsAppMessage;
+    /** Text shown while the card has no message to draw. */
     emptyText?: ReactNode;
-    /** CSS width of the device. */
-    width?: string | number;
-    /** CSS height of the device. */
-    height?: string | number;
-    /** Show the loading placeholder instead of the chat. */
+    /** Show the loading placeholder instead of the messages. */
     isLoading?: boolean;
 }

package/index.d.ts

@@ -36,7 +36,7 @@ export { EmailTemplatePreview, NoEmailTemplatePreview, replaceLocalization, repl
 export { PushPreview } from './PushPreview';
 export { InboxPreview, resolveInboxLayout, MAX_CAROUSEL_SLIDES, type InboxLayoutType, type InboxPreviewPlatform, type InboxPreviewContent, type InboxPreviewProps, type InboxPreviewSlide, } from './InboxPreview';
 export { WhatsAppPreview } from './WhatsAppPreview';
-export type { WhatsAppAttachment, WhatsAppAttachmentKind, WhatsAppMessage, WhatsAppMessageDirection, WhatsAppMessageStatus, WhatsAppPreviewProps, } from './WhatsAppPreview';
+export type { WhatsAppAttachment, WhatsAppAttachmentKind, WhatsAppMessage, WhatsAppPreviewProps, } from './WhatsAppPreview';
 export { Toast, ToastProvider, useToast } from './Toast';
 export { AutosizeInput, PageHeader, PageHeaderEditable } from './PageHeader';
 export { ExportResult } from './ExportResult';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pushwoosh/dumb-components",
-  "version": "1.1.224",
+  "version": "1.1.226",
   "description": "React components to build Pushwoosh products",
   "main": "index.js",
   "module": "index.js",

package/WhatsAppPreview/components/WhatsAppChatHeader/WhatsAppChatHeader.d.ts

@@ -1,4 +0,0 @@
-import { type ReactElement } from 'react';
-import type { WhatsAppChatHeaderProps } from './types';
-/** Chat screen header of the previewed conversation. */
-export declare function WhatsAppChatHeader(props: WhatsAppChatHeaderProps): ReactElement;

package/WhatsAppPreview/components/WhatsAppChatHeader/WhatsAppChatHeader.js

@@ -1,39 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Horizontal, Vertical } from '@pushwoosh/kit-helpers';
-import { Text } from '@pushwoosh/kit-typography';
-import { HeaderAvatar, HeaderAvatarImage, HeaderBox } from './styles';
-import { WHATSAPP_COLOR } from '../../constants';
-import { WhatsAppAvatarIcon, WhatsAppBackIcon, WhatsAppCallIcon, WhatsAppMenuIcon } from '../../icons';
-/** Chat screen header of the previewed conversation. */
-export function WhatsAppChatHeader(props) {
-  const {
-    name,
-    subtitle,
-    avatarUrl
-  } = props;
-  return _jsxs(HeaderBox, {
-    children: [_jsx(WhatsAppBackIcon, {}), _jsx(HeaderAvatar, {
-      children: avatarUrl ? _jsx(HeaderAvatarImage, {
-        alt: name,
-        src: avatarUrl
-      }) : _jsx(WhatsAppAvatarIcon, {})
-    }), _jsxs(Vertical, {
-      "$minWidth": 0,
-      children: [_jsx(Text, {
-        "$color": WHATSAPP_COLOR.TITLE,
-        "$ellipsis": true,
-        "$variant": "h4",
-        children: name
-      }), _jsx(Text, {
-        "$color": WHATSAPP_COLOR.SUBTITLE,
-        "$ellipsis": true,
-        "$variant": "footnote",
-        children: subtitle
-      })]
-    }), _jsxs(Horizontal, {
-      "$alignItems": "center",
-      "$gap": 14,
-      children: [_jsx(WhatsAppCallIcon, {}), _jsx(WhatsAppMenuIcon, {})]
-    })]
-  });
-}

package/WhatsAppPreview/components/WhatsAppChatHeader/index.d.ts

@@ -1 +0,0 @@
-export { WhatsAppChatHeader } from './WhatsAppChatHeader';

package/WhatsAppPreview/components/WhatsAppChatHeader/index.js

@@ -1 +0,0 @@
-export { WhatsAppChatHeader } from './WhatsAppChatHeader';

package/WhatsAppPreview/components/WhatsAppChatHeader/styles.d.ts

@@ -1,47 +0,0 @@
-export declare const HeaderBox: import("styled-components").StyledComponent<"div", any, import("@pushwoosh/kit-helpers/styled-helpers").CommonBoxProps & {
-    $alignContent?: import("@pushwoosh/kit-helpers/styled-helpers").AlignContentValue | undefined;
-    $alignItems?: import("@pushwoosh/kit-helpers/styled-helpers").ItemAlignmentValue | undefined;
-    $gap?: import("@pushwoosh/kit-helpers/styled-helpers").StrNum | undefined;
-    $justifyContent?: import("@pushwoosh/kit-helpers/styled-helpers").JustifyContentValue | undefined;
-} & {
-    $gridAutoFlow?: "row" | "column" | "dense" | "row dense" | "column dense" | undefined;
-    $justifyItems?: import("@pushwoosh/kit-helpers/styled-helpers").ItemAlignmentValue | undefined;
-    $placeItems?: import("@pushwoosh/kit-helpers/styled-helpers").ItemAlignmentValue | undefined;
-} & {
-    $sizes: import("@pushwoosh/kit-helpers/styled-helpers").StrNum;
-} & {
-    $alignItems: string;
-    $gap: number;
-    $sizes: string;
-    $padding: {
-        top: number;
-        right: number;
-        bottom: number;
-        left: number;
-    };
-    $bgColor: "#F6F3EF";
-    $border: {
-        bottom: string;
-    };
-}, "$bgColor" | "$border" | "$padding" | "$alignItems" | "$gap" | "$sizes">;
-export declare const HeaderAvatar: import("styled-components").StyledComponent<"div", any, import("@pushwoosh/kit-helpers/styled-helpers").CommonBoxProps & {
-    $alignContent?: import("@pushwoosh/kit-helpers/styled-helpers").AlignContentValue | undefined;
-    $alignItems?: import("@pushwoosh/kit-helpers/styled-helpers").ItemAlignmentValue | undefined;
-    $gap?: import("@pushwoosh/kit-helpers/styled-helpers").StrNum | undefined;
-    $justifyContent?: import("@pushwoosh/kit-helpers/styled-helpers").JustifyContentValue | undefined;
-} & {
-    $gridAutoFlow?: "row" | "column" | "dense" | "row dense" | "column dense" | undefined;
-    $justifyItems?: import("@pushwoosh/kit-helpers/styled-helpers").ItemAlignmentValue | undefined;
-    $placeItems?: import("@pushwoosh/kit-helpers/styled-helpers").ItemAlignmentValue | undefined;
-} & {
-    $gridAutoFlow: string;
-} & {
-    $alignItems: string;
-    $justifyContent: string;
-    $width: number;
-    $height: number;
-    $borderRadius: string;
-    $overflow: string;
-    $bgColor: "#CFD6DB";
-}, "$gridAutoFlow" | "$bgColor" | "$borderRadius" | "$height" | "$overflow" | "$width" | "$alignItems" | "$justifyContent">;
-export declare const HeaderAvatarImage: import("styled-components").StyledComponent<"img", any, {}, never>;

package/WhatsAppPreview/components/WhatsAppChatHeader/styles.js

@@ -1,37 +0,0 @@
-import styled from 'styled-components';
-import { Columns, Horizontal } from '@pushwoosh/kit-helpers';
-import { WHATSAPP_COLOR } from '../../constants';
-export const HeaderBox = styled(Columns).attrs({
-  $alignItems: 'center',
-  $gap: 10,
-  $sizes: 'auto auto minmax(0, 1fr) auto',
-  $padding: {
-    top: 6,
-    right: 14,
-    bottom: 10,
-    left: 14
-  },
-  $bgColor: WHATSAPP_COLOR.HEADER,
-  $border: {
-    bottom: `1px solid ${WHATSAPP_COLOR.HEADER_BORDER}`
-  }
-}).withConfig({
-  displayName: "HeaderBox",
-  componentId: "sc-7fu7hq-0"
-})(["color:", ";svg{display:block;}"], WHATSAPP_COLOR.ACTION);
-export const HeaderAvatar = styled(Horizontal).attrs({
-  $alignItems: 'center',
-  $justifyContent: 'center',
-  $width: 34,
-  $height: 34,
-  $borderRadius: '50%',
-  $overflow: 'hidden',
-  $bgColor: WHATSAPP_COLOR.AVATAR
-}).withConfig({
-  displayName: "HeaderAvatar",
-  componentId: "sc-7fu7hq-1"
-})(["color:", ";"], WHATSAPP_COLOR.AVATAR_GLYPH);
-export const HeaderAvatarImage = styled.img.withConfig({
-  displayName: "HeaderAvatarImage",
-  componentId: "sc-7fu7hq-2"
-})(["width:100%;height:100%;object-fit:cover;"]);

package/WhatsAppPreview/components/WhatsAppChatHeader/types.d.ts

@@ -1,10 +0,0 @@
-import type { ReactNode } from 'react';
-/** Props of {@link WhatsAppChatHeader}. */
-export interface WhatsAppChatHeaderProps {
-    /** Business name. */
-    name: string;
-    /** Caption under the name. */
-    subtitle: ReactNode;
-    /** Avatar image URL; a glyph is drawn when absent. */
-    avatarUrl?: string;
-}

package/WhatsAppPreview/components/WhatsAppChatHeader/types.js

@@ -1 +0,0 @@
-export {};

package/WhatsAppPreview/components/WhatsAppDateChip/WhatsAppDateChip.d.ts

@@ -1,4 +0,0 @@
-import { type ReactElement } from 'react';
-import type { WhatsAppDateChipProps } from './types';
-/** Date separator drawn above the first message of a day. */
-export declare function WhatsAppDateChip(props: WhatsAppDateChipProps): ReactElement;

package/WhatsAppPreview/components/WhatsAppDateChip/WhatsAppDateChip.js

@@ -1,28 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { ShapeRadius } from '@pushwoosh/kit-constants';
-import { Horizontal, Vertical } from '@pushwoosh/kit-helpers';
-import { DateChipText } from './styles';
-import { WHATSAPP_COLOR } from '../../constants';
-/** Date separator drawn above the first message of a day. */
-export function WhatsAppDateChip(props) {
-  const {
-    children
-  } = props;
-  return _jsx(Horizontal, {
-    "$justifyContent": "center",
-    children: _jsx(Vertical, {
-      "$bgColor": WHATSAPP_COLOR.INCOMING_BUBBLE,
-      "$borderRadius": ShapeRadius.SECTION,
-      "$boxShadow": `0 1px 0.5px ${WHATSAPP_COLOR.BUBBLE_SHADOW}`,
-      "$padding": {
-        vertical: 5,
-        horizontal: 12
-      },
-      children: _jsx(DateChipText, {
-        "$color": WHATSAPP_COLOR.DATE_CHIP_TEXT,
-        "$variant": "footnote",
-        children: children
-      })
-    })
-  });
-}

package/WhatsAppPreview/components/WhatsAppDateChip/index.d.ts

@@ -1 +0,0 @@
-export { WhatsAppDateChip } from './WhatsAppDateChip';

package/WhatsAppPreview/components/WhatsAppDateChip/index.js

@@ -1 +0,0 @@
-export { WhatsAppDateChip } from './WhatsAppDateChip';

package/WhatsAppPreview/components/WhatsAppDateChip/styles.d.ts

@@ -1,6 +0,0 @@
-export declare const DateChipText: import("styled-components").StyledComponent<"span", any, {
-    $color?: string | undefined;
-    $uppercase?: boolean | undefined;
-    $ellipsis?: boolean | undefined;
-    $variant?: import("@pushwoosh/kit-typography").TypographyVariant | undefined;
-}, never>;

package/WhatsAppPreview/components/WhatsAppDateChip/styles.js

@@ -1,6 +0,0 @@
-import styled from 'styled-components';
-import { Text } from '@pushwoosh/kit-typography';
-export const DateChipText = styled(Text).withConfig({
-  displayName: "DateChipText",
-  componentId: "sc-1n9qlgp-0"
-})(["display:block;&::first-letter{text-transform:uppercase;}"]);

package/WhatsAppPreview/components/WhatsAppDateChip/types.d.ts

@@ -1,6 +0,0 @@
-import type { ReactNode } from 'react';
-/** Props of {@link WhatsAppDateChip}. */
-export interface WhatsAppDateChipProps {
-    /** Label inside the chip, e.g. `Today`. */
-    children: ReactNode;
-}

package/WhatsAppPreview/components/WhatsAppDateChip/types.js

@@ -1 +0,0 @@
-export {};

package/WhatsAppPreview/components/WhatsAppStatusBar/WhatsAppStatusBar.d.ts

@@ -1,4 +0,0 @@
-import { type ReactElement } from 'react';
-import type { WhatsAppStatusBarProps } from './types';
-/** iOS status bar of the previewed device: clock, dynamic island and the signal indicators. */
-export declare function WhatsAppStatusBar(props: WhatsAppStatusBarProps): ReactElement;

package/WhatsAppPreview/components/WhatsAppStatusBar/WhatsAppStatusBar.js

@@ -1,18 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { StatusBarBox, StatusBarClock, StatusBarIndicators, StatusBarIsland, StatusBarRow } from './styles';
-import { WhatsAppBatteryIcon, WhatsAppSignalIcon, WhatsAppWifiIcon } from '../../icons';
-/** iOS status bar of the previewed device: clock, dynamic island and the signal indicators. */
-export function WhatsAppStatusBar(props) {
-  const {
-    time
-  } = props;
-  return _jsx(StatusBarBox, {
-    children: _jsxs(StatusBarRow, {
-      children: [_jsx(StatusBarClock, {
-        children: time
-      }), _jsx(StatusBarIsland, {}), _jsxs(StatusBarIndicators, {
-        children: [_jsx(WhatsAppSignalIcon, {}), _jsx(WhatsAppWifiIcon, {}), _jsx(WhatsAppBatteryIcon, {})]
-      })]
-    })
-  });
-}

package/WhatsAppPreview/components/WhatsAppStatusBar/index.d.ts

@@ -1 +0,0 @@
-export { WhatsAppStatusBar } from './WhatsAppStatusBar';

package/WhatsAppPreview/components/WhatsAppStatusBar/index.js

@@ -1 +0,0 @@
-export { WhatsAppStatusBar } from './WhatsAppStatusBar';

package/WhatsAppPreview/components/WhatsAppStatusBar/styles.d.ts

@@ -1,69 +0,0 @@
-export declare const StatusBarBox: import("styled-components").StyledComponent<"div", any, import("@pushwoosh/kit-helpers/styled-helpers").CommonBoxProps & {
-    $alignContent?: import("@pushwoosh/kit-helpers/styled-helpers").AlignContentValue | undefined;
-    $alignItems?: import("@pushwoosh/kit-helpers/styled-helpers").ItemAlignmentValue | undefined;
-    $gap?: import("@pushwoosh/kit-helpers/styled-helpers").StrNum | undefined;
-    $justifyContent?: import("@pushwoosh/kit-helpers/styled-helpers").JustifyContentValue | undefined;
-} & {
-    $gridAutoFlow?: "row" | "column" | "dense" | "row dense" | "column dense" | undefined;
-    $justifyItems?: import("@pushwoosh/kit-helpers/styled-helpers").ItemAlignmentValue | undefined;
-    $placeItems?: import("@pushwoosh/kit-helpers/styled-helpers").ItemAlignmentValue | undefined;
-} & {
-    $gridAutoFlow: string;
-}, "$gridAutoFlow">;
-export declare const StatusBarRow: import("styled-components").StyledComponent<"div", any, import("@pushwoosh/kit-helpers/styled-helpers").CommonBoxProps & {
-    $alignContent?: import("@pushwoosh/kit-helpers/styled-helpers").AlignContentValue | undefined;
-    $alignItems?: import("@pushwoosh/kit-helpers/styled-helpers").ItemAlignmentValue | undefined;
-    $gap?: import("@pushwoosh/kit-helpers/styled-helpers").StrNum | undefined;
-    $justifyContent?: import("@pushwoosh/kit-helpers/styled-helpers").JustifyContentValue | undefined;
-} & {
-    $gridAutoFlow?: "row" | "column" | "dense" | "row dense" | "column dense" | undefined;
-    $justifyItems?: import("@pushwoosh/kit-helpers/styled-helpers").ItemAlignmentValue | undefined;
-    $placeItems?: import("@pushwoosh/kit-helpers/styled-helpers").ItemAlignmentValue | undefined;
-} & {
-    $gridAutoFlow: string;
-} & {
-    $alignItems: string;
-    $justifyContent: string;
-    $position: string;
-    $height: string;
-    $padding: {
-        left: string;
-        right: string;
-    };
-}, "$gridAutoFlow" | "$height" | "$padding" | "$position" | "$alignItems" | "$justifyContent">;
-export declare const StatusBarIsland: import("styled-components").StyledComponent<"div", any, import("@pushwoosh/kit-helpers/styled-helpers").CommonBoxProps & {
-    $alignContent?: import("@pushwoosh/kit-helpers/styled-helpers").AlignContentValue | undefined;
-    $alignItems?: import("@pushwoosh/kit-helpers/styled-helpers").ItemAlignmentValue | undefined;
-    $gap?: import("@pushwoosh/kit-helpers/styled-helpers").StrNum | undefined;
-    $justifyContent?: import("@pushwoosh/kit-helpers/styled-helpers").JustifyContentValue | undefined;
-} & {
-    $gridAutoFlow?: "row" | "column" | "dense" | "row dense" | "column dense" | undefined;
-    $justifyItems?: import("@pushwoosh/kit-helpers/styled-helpers").ItemAlignmentValue | undefined;
-    $placeItems?: import("@pushwoosh/kit-helpers/styled-helpers").ItemAlignmentValue | undefined;
-} & {
-    $gridAutoFlow: string;
-} & {
-    $position: string;
-    $bgColor: "#2B2F33";
-    $top: string;
-    $left: string;
-    $width: string;
-    $height: string;
-    $borderRadius: string;
-}, "$gridAutoFlow" | "$bgColor" | "$borderRadius" | "$height" | "$left" | "$position" | "$top" | "$width">;
-export declare const StatusBarIndicators: import("styled-components").StyledComponent<"div", any, import("@pushwoosh/kit-helpers/styled-helpers").CommonBoxProps & {
-    $alignContent?: import("@pushwoosh/kit-helpers/styled-helpers").AlignContentValue | undefined;
-    $alignItems?: import("@pushwoosh/kit-helpers/styled-helpers").ItemAlignmentValue | undefined;
-    $gap?: import("@pushwoosh/kit-helpers/styled-helpers").StrNum | undefined;
-    $justifyContent?: import("@pushwoosh/kit-helpers/styled-helpers").JustifyContentValue | undefined;
-} & {
-    $gridAutoFlow?: "row" | "column" | "dense" | "row dense" | "column dense" | undefined;
-    $justifyItems?: import("@pushwoosh/kit-helpers/styled-helpers").ItemAlignmentValue | undefined;
-    $placeItems?: import("@pushwoosh/kit-helpers/styled-helpers").ItemAlignmentValue | undefined;
-} & {
-    $gridAutoFlow: string;
-} & {
-    $alignItems: string;
-    $gap: string;
-}, "$gridAutoFlow" | "$alignItems" | "$gap">;
-export declare const StatusBarClock: import("styled-components").StyledComponent<"span", any, {}, never>;

package/WhatsAppPreview/components/WhatsAppStatusBar/styles.js

@@ -1,47 +0,0 @@
-import styled from 'styled-components';
-import { FontFamily, FontWeight, LineHeight } from '@pushwoosh/kit-constants';
-import { Horizontal, Vertical } from '@pushwoosh/kit-helpers';
-import { WHATSAPP_COLOR, WHATSAPP_SCREEN_WIDTH, WHATSAPP_STATUS_BAR } from '../../constants';
-function scaled(value) {
-  return `${(value / WHATSAPP_SCREEN_WIDTH * 100).toFixed(4)}cqw`;
-}
-export const StatusBarBox = styled(Vertical).withConfig({
-  displayName: "StatusBarBox",
-  componentId: "sc-lua8an-0"
-})(["container-type:inline-size;"]);
-export const StatusBarRow = styled(Horizontal).attrs({
-  $alignItems: 'center',
-  $justifyContent: 'space-between',
-  $position: 'relative',
-  $height: scaled(WHATSAPP_STATUS_BAR.HEIGHT),
-  $padding: {
-    left: scaled(WHATSAPP_STATUS_BAR.PADDING_LEFT),
-    right: scaled(WHATSAPP_STATUS_BAR.PADDING_RIGHT)
-  }
-}).withConfig({
-  displayName: "StatusBarRow",
-  componentId: "sc-lua8an-1"
-})([""]);
-export const StatusBarIsland = styled(Horizontal).attrs({
-  $position: 'absolute',
-  $bgColor: WHATSAPP_COLOR.ISLAND,
-  $top: scaled(WHATSAPP_STATUS_BAR.ISLAND_TOP),
-  $left: `calc(50% - ${scaled(WHATSAPP_STATUS_BAR.ISLAND_WIDTH / 2)})`,
-  $width: scaled(WHATSAPP_STATUS_BAR.ISLAND_WIDTH),
-  $height: scaled(WHATSAPP_STATUS_BAR.ISLAND_HEIGHT),
-  $borderRadius: scaled(WHATSAPP_STATUS_BAR.ISLAND_HEIGHT / 2)
-}).withConfig({
-  displayName: "StatusBarIsland",
-  componentId: "sc-lua8an-2"
-})([""]);
-export const StatusBarIndicators = styled(Horizontal).attrs({
-  $alignItems: 'center',
-  $gap: scaled(WHATSAPP_STATUS_BAR.INDICATOR_GAP)
-}).withConfig({
-  displayName: "StatusBarIndicators",
-  componentId: "sc-lua8an-3"
-})(["color:", ";svg{display:block;width:auto;height:", ";}"], WHATSAPP_COLOR.STATUS_BAR, scaled(WHATSAPP_STATUS_BAR.INDICATOR_HEIGHT));
-export const StatusBarClock = styled.span.withConfig({
-  displayName: "StatusBarClock",
-  componentId: "sc-lua8an-4"
-})(["color:", ";font-family:", ";font-size:", ";font-weight:", ";line-height:", ";"], WHATSAPP_COLOR.STATUS_BAR, FontFamily.MAIN, scaled(WHATSAPP_STATUS_BAR.CLOCK_FONT_SIZE), FontWeight.MEDIUM, LineHeight.HEADING4);

package/WhatsAppPreview/components/WhatsAppStatusBar/types.d.ts

@@ -1,5 +0,0 @@
-/** Props of {@link WhatsAppStatusBar}. */
-export interface WhatsAppStatusBarProps {
-    /** Clock shown on the left side of the status bar. */
-    time: string;
-}

package/WhatsAppPreview/components/WhatsAppStatusBar/types.js

@@ -1 +0,0 @@
-export {};

package/WhatsAppPreview/icons/WhatsAppAvatarIcon.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor"><circle cx="12" cy="8.5" r="4"/><path d="M4 20.5c0-3.9 3.6-6.5 8-6.5s8 2.6 8 6.5z"/></svg>

package/WhatsAppPreview/icons/WhatsAppBackIcon.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="11" height="20" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"><path d="m9.5 1.5-8 8.5 8 8.5"/></svg>

package/WhatsAppPreview/icons/WhatsAppBatteryIcon.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 25 12" fill="none"><rect width="21" height="10.8" x=".6" y=".6" stroke="currentColor" stroke-opacity=".4" stroke-width="1.2" rx="3"/><rect width="17.8" height="7.6" x="2.2" y="2.2" fill="currentColor" rx="1.8"/><path fill="currentColor" fill-opacity=".4" d="M23.2 4.2v3.6a2 2 0 0 0 0-3.6"/></svg>

package/WhatsAppPreview/icons/WhatsAppCallIcon.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"><path d="M6.3 2.5H3.9a1.6 1.6 0 0 0-1.6 1.8c.4 3.4 1.9 6.5 4.3 8.9s5.5 3.9 8.9 4.3a1.6 1.6 0 0 0 1.8-1.6v-2.4a1.2 1.2 0 0 0-1-1.2l-2.3-.4a1.2 1.2 0 0 0-1.2.5l-.8 1.1a10.6 10.6 0 0 1-4.6-4.6l1.1-.8A1.2 1.2 0 0 0 9 6.9l-.4-2.3a1.2 1.2 0 0 0-1.2-1Z"/></svg>

package/WhatsAppPreview/icons/WhatsAppMenuIcon.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="currentColor"><circle cx="10" cy="4" r="1.7"/><circle cx="10" cy="10" r="1.7"/><circle cx="10" cy="16" r="1.7"/></svg>

package/WhatsAppPreview/icons/WhatsAppSignalIcon.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 12" fill="currentColor"><rect width="3" height="4" y="8" rx="1"/><rect width="3" height="6.5" x="5" y="5.5" rx="1"/><rect width="3" height="9" x="10" y="3" rx="1"/><rect width="3" height="12" x="15" rx="1"/></svg>

package/WhatsAppPreview/icons/WhatsAppTickIcon.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="12" height="11" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.4"><path d="m1 6.1 2.6 2.7 7-6.8"/></svg>

package/WhatsAppPreview/icons/WhatsAppTicksIcon.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="16" height="11" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.4"><path d="m1 6.1 2.6 2.7L9.2 2M6.4 6.9 8 8.8 14.6 2"/></svg>

package/WhatsAppPreview/icons/WhatsAppWallpaperPattern.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg"><defs><pattern id="a" width="150" height="150" patternUnits="userSpaceOnUse"><g fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.4"><path d="M18 24c-4-4-7-6-7-9a3.2 3.2 0 0 1 5.9-1.6A3.2 3.2 0 0 1 25 15c0 3-3 5-7 9m34-14h16a3 3 0 0 1 3 3v8a3 3 0 0 1-3 3h-9l-5 4v-4h-2a3 3 0 0 1-3-3v-8a3 3 0 0 1 3-3m60 2 2.6 5.4 5.9.8-4.3 4.1 1 5.9-5.2-2.8-5.2 2.8 1-5.9-4.3-4.1 5.9-.8ZM14 56h12v8a6 6 0 0 1-12 0zm12 2h3a3 3 0 0 1 0 6h-3M13 74h14m33-6V54l10-2v14"/><circle cx="57" cy="68" r="3"/><circle cx="67" cy="66" r="3"/><path d="M100 58h4l2-3h8l2 3h4a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2h-20a2 2 0 0 1-2-2V60a2 2 0 0 1 2-2"/><circle cx="110" cy="65" r="4.5"/><circle cx="20" cy="105" r="9"/><path d="M16 108a5 5 0 0 0 8 0"/><circle cx="17" cy="102" r=".9"/><circle cx="23" cy="102" r=".9"/><path d="M54 100h18v13H54zm9 0v13m-9-13a4 4 0 0 1 9-2 4 4 0 0 1 9 2m28 10 22-9-9 22-4-9Z"/><circle cx="133" cy="133" r="8"/><path d="M133 128v5l3 2M126 24h10m-5-5v10"/></g></pattern></defs><rect width="100%" height="100%" fill="url(#a)"/></svg>

package/WhatsAppPreview/icons/WhatsAppWifiIcon.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 12" fill="none" stroke="currentColor" stroke-linecap="round" stroke-width="1.7"><path d="M1 4.2a11 11 0 0 1 14 0M3.6 7a7.2 7.2 0 0 1 8.8 0M6.2 9.7a3.3 3.3 0 0 1 3.6 0"/></svg>