@linktr.ee/messaging-react 3.37.0-rc-1786190741 → 3.37.0

package/dist/Card-qS17qnN0.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Card-qS17qnN0.js","sources":["../src/components/CustomMessage/LockedAttachment/components/_shared/PriceLockRow.tsx","../src/components/CustomMessage/LockedAttachment/components/_shared/SkeletonTextLines.tsx","../src/components/CustomMessage/LockedAttachment/components/_shared/TextShell.tsx","../src/components/CustomMessage/LockedAttachment/components/Text/Card.tsx"],"sourcesContent":["import { LockSimpleIcon } from '@phosphor-icons/react'\nimport type React from 'react'\n\n/**\n * The lock-icon + amount/status row shared by every LockedAttachment text-mode\n * card. Only the wrapper and the leading lock icon are shared — the amount and\n * any trailing status live in `children`, since they genuinely differ per card\n * (placeholder fallback vs. paid badge vs. bare amount).\n */\nconst PriceLockRow: React.FC<React.PropsWithChildren> = ({ children }) => (\n  <div className=\"flex items-center gap-1 text-xs font-medium\">\n    <LockSimpleIcon\n      className=\"size-3.5 shrink-0 opacity-55\"\n      weight=\"fill\"\n      aria-hidden\n    />\n    {children}\n  </div>\n)\n\nexport default PriceLockRow\n","import classNames from 'classnames'\nimport React from 'react'\n\nexport interface SkeletonTextLinesProps {\n  /** Matches the bubble it sits in — \"dark\" for the sender's own bubble. */\n  variant: 'light' | 'dark'\n}\n\n/**\n * Two skeleton bars standing in for the redacted text of a paid text-only\n * message — the real content is never sent to the client until purchase, so\n * there's nothing to render yet.\n *\n * Uses explicit black/white (not `bg-current`) because Tailwind doesn't\n * support opacity modifiers on the `current` color — `bg-current/30` silently\n * produces no CSS rule at all.\n */\nconst SkeletonTextLines: React.FC<SkeletonTextLinesProps> = ({ variant = 'dark' }) => {\n  const colour = variant === 'dark' ? 'bg-white/25' : 'bg-black/15'\n\n  return (\n    <div className=\"flex flex-col gap-2 str-chat__message-text my-1 animate-pulse\" aria-hidden>\n      <div className={classNames('h-3 w-40 rounded-full', colour)} />\n      <div className={classNames('h-3 w-24 rounded-full', colour)} />\n    </div>\n  )\n}\n\nexport default SkeletonTextLines\n","import classNames from 'classnames'\nimport React from 'react'\n\n/**\n * Chat-bubble chrome for a paid text-only message/preview. Deliberately\n * doesn't lean on `.str-chat`'s CSS variables (`--str-chat__message-bubble-*`)\n * — this renders in the Composer preview too, which sits outside any\n * `.str-chat` ancestor, so every value here (radius, colour, type scale) is\n * hardcoded to match the Figma spec directly.\n */\nconst TextShell: React.FC<\n  React.PropsWithChildren<{ isMine: boolean; className?: string }>\n> = ({ isMine, children, className }) => (\n  <div\n    className={classNames(\n      'message-locked-attachment-text',\n      'relative flex min-w-[225px] max-w-[280px] flex-col gap-1 rounded-[1.5rem] px-4 py-3',\n      'text-[0.875rem] leading-[1.3125rem] tracking-[0.14px]',\n      isMine ? 'bg-[#1e2330] text-white' : 'bg-[#f2f1ef] text-black',\n      'shadow-[0_1px_2px_rgba(0,0,0,0.08)]',\n      className\n    )}\n  >\n    {children}\n  </div>\n)\n\nexport default TextShell\n","import { LockSimpleIcon, XIcon } from '@phosphor-icons/react'\nimport type React from 'react'\n\nimport LoadingDots from '../_shared/LoadingDots'\nimport PriceLockRow from '../_shared/PriceLockRow'\nimport PurchaseStatusBadge from '../_shared/PurchaseStatusBadge'\nimport SkeletonTextLines from '../_shared/SkeletonTextLines'\nimport TextShell from '../_shared/TextShell'\n\nimport type {\n  TextCardDraftProps,\n  TextCardOtherProps,\n  TextCardOwnProps,\n  TextCardPreviewProps,\n  TextCardProps,\n} from './types'\n\nexport type { TextCardProps } from './types'\n\nconst DraftTextCard: React.FC<TextCardDraftProps> = ({\n  renderedText,\n  amountText,\n  placeholderAmountText,\n  onDismiss,\n}) => (\n  <TextShell isMine className=\"pr-8\">\n      {renderedText || <SkeletonTextLines variant=\"dark\" />}\n    <PriceLockRow>\n      <span className={amountText ? 'text-white/55' : 'text-white/30'}>\n        {amountText || placeholderAmountText}\n      </span>\n    </PriceLockRow>\n    {onDismiss && (\n      <button\n        type=\"button\"\n        onClick={onDismiss}\n        className=\"absolute right-3 top-3 flex size-6 shrink-0 items-center justify-center rounded-full bg-white/10 text-white hover:bg-white/15\"\n        aria-label=\"Dismiss attachment\"\n      >\n        <XIcon className=\"size-3\" weight=\"bold\" />\n      </button>\n    )}\n  </TextShell>\n)\n\nconst PreviewTextCard: React.FC<TextCardPreviewProps> = ({\n  amountText,\n  placeholderAmountText,\n}) => (\n  <TextShell isMine={false}>\n    <SkeletonTextLines variant=\"light\" />\n    <PriceLockRow>\n      <span className=\"opacity-55\">{amountText || placeholderAmountText}</span>\n    </PriceLockRow>\n  </TextShell>\n)\n\nconst OwnTextCard: React.FC<TextCardOwnProps> = ({\n  renderedText,\n  amountText,\n  paymentStatus = 'pending',\n}) => {\n  const isPaid = paymentStatus === 'paid'\n\n  return (\n    <TextShell isMine>\n      {isPaid && renderedText ? (\n        renderedText\n      ) : (\n        <SkeletonTextLines variant=\"dark\" />\n      )}\n      <PriceLockRow>\n        {amountText && <span className=\"text-white/55\">{amountText}</span>}\n        <PurchaseStatusBadge isMine paymentStatus={paymentStatus} />\n      </PriceLockRow>\n    </TextShell>\n  )\n}\n\nconst OtherTextCard: React.FC<TextCardOtherProps> = ({\n  renderedText,\n  amountText,\n  paymentStatus,\n  onUnlockClick,\n  isUnlocking = false,\n}) => {\n  const isPaid = paymentStatus === 'paid'\n\n  if (isPaid && renderedText) {\n    return (\n      <TextShell isMine={false}>\n        {renderedText}\n        <PriceLockRow>\n          {amountText != null && (\n            <span className=\"opacity-55\">{amountText}</span>\n          )}\n          <PurchaseStatusBadge isMine={false} paymentStatus=\"paid\" />\n        </PriceLockRow>\n      </TextShell>\n    )\n  }\n\n  const ariaLabel = isUnlocking\n    ? 'Unlocking message.'\n    : 'Unlock this message.'\n\n  return (\n    <TextShell isMine={false}>\n      <div className=\"flex items-center gap-3\">\n        <div className=\"flex flex-1 flex-col gap-2\">\n          <SkeletonTextLines variant=\"light\" />\n          <span className=\"sr-only\" aria-live=\"polite\">\n            {ariaLabel}\n          </span>\n          <PriceLockRow>\n            {amountText != null && (\n              <span className=\"opacity-55\">{amountText}</span>\n            )}\n          </PriceLockRow>\n        </div>\n        <button\n          type=\"button\"\n          onClick={onUnlockClick}\n          disabled={isUnlocking}\n          aria-label={isUnlocking ? 'Unlocking message' : 'Unlock message'}\n          aria-busy={isUnlocking}\n          title={isUnlocking ? 'Unlocking message' : 'Unlock message'}\n          className=\"flex size-10 shrink-0 items-center justify-center rounded-full bg-[#121110] text-white hover:bg-[#2a2928]\"\n        >\n          {isUnlocking ? (\n            <LoadingDots />\n          ) : (\n            <LockSimpleIcon className=\"size-4\" weight=\"fill\" aria-hidden />\n          )}\n        </button>\n      </div>\n    </TextShell>\n  )\n}\n\nconst TextCard: React.FC<TextCardProps> = (props) => {\n  if (props.isDraft) {\n    return <DraftTextCard {...props} />\n  } else if (props.isPreview) {\n    return <PreviewTextCard {...props} />\n  } else if (props.isMine) {\n    return <OwnTextCard {...props} />\n  } else {\n    return <OtherTextCard {...props} />\n  }\n}\n\nexport default TextCard\n"],"names":["PriceLockRow","children","jsxs","jsx","LockSimpleIcon","SkeletonTextLines","variant","colour","classNames","TextShell","isMine","className","DraftTextCard","renderedText","amountText","placeholderAmountText","onDismiss","XIcon","PreviewTextCard","OwnTextCard","paymentStatus","PurchaseStatusBadge","OtherTextCard","onUnlockClick","isUnlocking","LoadingDots","TextCard","props"],"mappings":"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"}

package/dist/LoadingDots-Ct3WmVlT.js.map

@@ -1 +1 @@
-{"version":3,"file":"LoadingDots-Ct3WmVlT.js","sources":["../src/components/CustomMessage/LockedAttachment/components/_shared/PurchaseStatusBadge.tsx","../src/components/CustomMessage/LockedAttachment/components/_shared/LoadingDots.tsx"],"sourcesContent":["import { CheckCircleIcon } from '@phosphor-icons/react'\nimport classNames from 'classnames'\nimport React from 'react'\n\nimport type { PaymentStatus } from '../../types'\n\nexport interface PurchaseStatusBadgeProps {\n  /** 'own' matches the sender's dark/own-message context; 'other' matches the recipient's light/other-message context. */\n  isMine: boolean\n  /** 'paid' renders the \"Sold\"/\"Purchased\" + checkmark variant; otherwise falls back to plain amount text, or nothing. */\n  paymentStatus?: PaymentStatus\n  amountText?: string\n}\n\n/**\n * Bullet + amount/label + checkmark row for a paid attachment or message.\n * Shared by `LockedAttachment.Media`/`.Text`'s status badges.\n */\nconst PurchaseStatusBadge: React.FC<PurchaseStatusBadgeProps> = ({\n  isMine,\n  paymentStatus,\n  amountText,\n}) => {\n  const labelColour = isMine ? 'text-white/55' : 'text-black/55'\n  const successColour = isMine ? 'text-[#34c759]' : 'text-[#008236]'\n  if (paymentStatus === 'paid') {\n    return (\n      <React.Fragment>\n        <span className={classNames('text-xs font-medium', labelColour)}>\n          &bull;\n        </span>\n        <span className={classNames('text-xs font-medium', successColour)}>\n          {isMine ? 'Sold' : 'Purchased'}\n        </span>\n        <CheckCircleIcon\n          className={classNames('shrink-0 size-3.5', successColour)}\n          weight=\"bold\"\n          aria-hidden\n        />\n      </React.Fragment>\n    )\n  }\n\n  if (amountText != null) {\n    return (\n      <React.Fragment>\n        <span className={classNames('text-xs font-medium', labelColour)}>\n          &bull;\n        </span>\n        <span className={classNames('text-xs font-medium', labelColour)}>\n          {amountText}\n        </span>\n      </React.Fragment>\n    )\n  }\n\n  if (paymentStatus === 'failed' || paymentStatus === 'refunded') {\n    return (\n      <React.Fragment>\n        <span className={classNames('text-xs font-medium', labelColour)}>\n          &bull;\n        </span>\n        <span className={classNames('text-xs font-medium', labelColour)}>\n          {paymentStatus === 'failed' ? 'Payment failed' : 'Refunded'}\n        </span>\n      </React.Fragment>\n    )\n  }\n\n  return null\n}\n\nexport default PurchaseStatusBadge\n","import React from 'react'\n\nconst Dot = ({ cx, index }: { cx: string; index: number }) => (\n  <circle cx={cx} cy=\"6.15\" r=\"2.4\" fill=\"currentColor\">\n    <animateTransform\n      attributeName=\"transform\"\n      type=\"translate\"\n      values=\"0 0; 0 -2.25; 0 0;\"\n      dur=\"900ms\"\n      begin={`${120 * index}ms`}\n      repeatCount=\"indefinite\"\n    />\n  </circle>\n)\n\n/**\n * Three bouncing dots, inline-sized for use inside buttons/labels (e.g. the\n * Unlock CTA while a purchase is in flight). Mirrors the typing indicator's\n * animation but uses `currentColor` so it adopts the surrounding text color.\n */\nconst LoadingDots: React.FC<{ className?: string }> = ({ className }) => (\n  <svg\n    aria-hidden=\"true\"\n    className={className}\n    viewBox=\"0 0 20 12.3\"\n    width=\"20\"\n    height=\"13\"\n    overflow=\"visible\"\n  >\n    <Dot cx=\"3\" index={0} />\n    <Dot cx=\"10\" index={1} />\n    <Dot cx=\"17\" index={2} />\n  </svg>\n)\n\nexport default LoadingDots\n"],"names":["PurchaseStatusBadge","isMine","paymentStatus","amountText","labelColour","successColour","jsxs","React","jsx","classNames","CheckCircleIcon","Dot","cx","index","LoadingDots","className"],"mappings":";;;;AAkBA,MAAMA,IAA0D,CAAC;AAAA,EAC/D,QAAAC;AAAA,EACA,eAAAC;AAAA,EACA,YAAAC;AACF,MAAM;AACJ,QAAMC,IAAcH,IAAS,kBAAkB,iBACzCI,IAAgBJ,IAAS,mBAAmB;AAClD,SAAIC,MAAkB,SAElB,gBAAAI,EAACC,EAAM,UAAN,EACC,UAAA;AAAA,IAAA,gBAAAC,EAAC,UAAK,WAAWC,EAAW,uBAAuBL,CAAW,GAAG,UAAA,KAEjE;AAAA,IACA,gBAAAI,EAAC,UAAK,WAAWC,EAAW,uBAAuBJ,CAAa,GAC7D,UAAAJ,IAAS,SAAS,YAAA,CACrB;AAAA,IACA,gBAAAO;AAAA,MAACE;AAAA,MAAA;AAAA,QACC,WAAWD,EAAW,qBAAqBJ,CAAa;AAAA,QACxD,QAAO;AAAA,QACP,eAAW;AAAA,MAAA;AAAA,IAAA;AAAA,EACb,GACF,IAIAF,KAAc,OAEd,gBAAAG,EAACC,EAAM,UAAN,EACC,UAAA;AAAA,IAAA,gBAAAC,EAAC,UAAK,WAAWC,EAAW,uBAAuBL,CAAW,GAAG,UAAA,KAEjE;AAAA,sBACC,QAAA,EAAK,WAAWK,EAAW,uBAAuBL,CAAW,GAC3D,UAAAD,EAAA,CACH;AAAA,EAAA,GACF,IAIAD,MAAkB,YAAYA,MAAkB,aAEhD,gBAAAI,EAACC,EAAM,UAAN,EACC,UAAA;AAAA,IAAA,gBAAAC,EAAC,UAAK,WAAWC,EAAW,uBAAuBL,CAAW,GAAG,UAAA,KAEjE;AAAA,IACA,gBAAAI,EAAC,QAAA,EAAK,WAAWC,EAAW,uBAAuBL,CAAW,GAC3D,UAAAF,MAAkB,WAAW,mBAAmB,WAAA,CACnD;AAAA,EAAA,GACF,IAIG;AACT,GCpEMS,IAAM,CAAC,EAAE,IAAAC,GAAI,OAAAC,QACjB,gBAAAL,EAAC,UAAA,EAAO,IAAAI,GAAQ,IAAG,QAAO,GAAE,OAAM,MAAK,gBACrC,UAAA,gBAAAJ;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,eAAc;AAAA,IACd,MAAK;AAAA,IACL,QAAO;AAAA,IACP,KAAI;AAAA,IACJ,OAAO,GAAG,MAAMK,CAAK;AAAA,IACrB,aAAY;AAAA,EAAA;AACd,GACF,GAQIC,IAAgD,CAAC,EAAE,WAAAC,EAAA,MACvD,gBAAAT;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,eAAY;AAAA,IACZ,WAAAS;AAAA,IACA,SAAQ;AAAA,IACR,OAAM;AAAA,IACN,QAAO;AAAA,IACP,UAAS;AAAA,IAET,UAAA;AAAA,MAAA,gBAAAP,EAACG,GAAA,EAAI,IAAG,KAAI,OAAO,GAAG;AAAA,MACtB,gBAAAH,EAACG,GAAA,EAAI,IAAG,MAAK,OAAO,GAAG;AAAA,MACvB,gBAAAH,EAACG,GAAA,EAAI,IAAG,MAAK,OAAO,EAAA,CAAG;AAAA,IAAA;AAAA,EAAA;AACzB;"}
+{"version":3,"file":"LoadingDots-Ct3WmVlT.js","sources":["../src/components/CustomMessage/LockedAttachment/components/_shared/PurchaseStatusBadge.tsx","../src/components/CustomMessage/LockedAttachment/components/_shared/LoadingDots.tsx"],"sourcesContent":["import { CheckCircleIcon } from '@phosphor-icons/react'\nimport classNames from 'classnames'\nimport React from 'react'\n\nimport type { PaymentStatus } from '../../types'\n\nexport interface PurchaseStatusBadgeProps {\n  /** 'own' matches the sender's dark/own-message context; 'other' matches the recipient's light/other-message context. */\n  isMine: boolean\n  /** 'paid' renders the \"Sold\"/\"Purchased\" + checkmark variant; otherwise falls back to plain amount text, or nothing. */\n  paymentStatus?: PaymentStatus\n  amountText?: string\n}\n\n/**\n * Bullet + amount/label + checkmark row for a paid attachment or message.\n * Shared by `LockedAttachment.Media`/`.Text`'s status badges.\n */\nconst PurchaseStatusBadge: React.FC<PurchaseStatusBadgeProps> = ({\n  isMine,\n  paymentStatus,\n  amountText,\n}) => {\n  const labelColour = isMine ? 'text-white/55' : 'text-black/55'\n  const successColour = isMine ? 'text-[#34c759]' : 'text-[#008236]'\n  if (paymentStatus === 'paid') {\n    return (\n      <React.Fragment>\n        <span className={classNames('text-xs font-medium', labelColour)}>\n          &bull;\n        </span>\n        <span className={classNames('text-xs font-medium', successColour)}>\n          {isMine ? 'Sold' : 'Purchased'}\n        </span>\n        <CheckCircleIcon\n          className={classNames('shrink-0 size-3.5', successColour)}\n          weight=\"bold\"\n          aria-hidden\n        />\n      </React.Fragment>\n    )\n  }\n\n  if (amountText != null) {\n    return (\n      <React.Fragment>\n        <span className={classNames('text-xs font-medium', labelColour)}>\n          &bull;\n        </span>\n        <span className={classNames('text-xs font-medium', labelColour)}>\n          {amountText}\n        </span>\n      </React.Fragment>\n    )\n  }\n\n\n  if (paymentStatus === 'failed' || paymentStatus === 'refunded') {\n    return (\n      <React.Fragment>\n        <span className={classNames('text-xs font-medium', labelColour)}>\n          &bull;\n        </span>\n        <span className={classNames('text-xs font-medium', labelColour)}>\n          {paymentStatus === 'failed' ? 'Payment failed' : 'Refunded'}\n        </span>\n      </React.Fragment>\n    )\n  }\n\n  return null\n}\n\nexport default PurchaseStatusBadge\n","import React from 'react'\n\nconst Dot = ({ cx, index }: { cx: string; index: number }) => (\n  <circle cx={cx} cy=\"6.15\" r=\"2.4\" fill=\"currentColor\">\n    <animateTransform\n      attributeName=\"transform\"\n      type=\"translate\"\n      values=\"0 0; 0 -2.25; 0 0;\"\n      dur=\"900ms\"\n      begin={`${120 * index}ms`}\n      repeatCount=\"indefinite\"\n    />\n  </circle>\n)\n\n/**\n * Three bouncing dots, inline-sized for use inside buttons/labels (e.g. the\n * Unlock CTA while a purchase is in flight). Mirrors the typing indicator's\n * animation but uses `currentColor` so it adopts the surrounding text color.\n */\nconst LoadingDots: React.FC<{ className?: string }> = ({ className }) => (\n  <svg\n    aria-hidden=\"true\"\n    className={className}\n    viewBox=\"0 0 20 12.3\"\n    width=\"20\"\n    height=\"13\"\n    overflow=\"visible\"\n  >\n    <Dot cx=\"3\" index={0} />\n    <Dot cx=\"10\" index={1} />\n    <Dot cx=\"17\" index={2} />\n  </svg>\n)\n\nexport default LoadingDots\n"],"names":["PurchaseStatusBadge","isMine","paymentStatus","amountText","labelColour","successColour","jsxs","React","jsx","classNames","CheckCircleIcon","Dot","cx","index","LoadingDots","className"],"mappings":";;;;AAkBA,MAAMA,IAA0D,CAAC;AAAA,EAC/D,QAAAC;AAAA,EACA,eAAAC;AAAA,EACA,YAAAC;AACF,MAAM;AACJ,QAAMC,IAAcH,IAAS,kBAAkB,iBACzCI,IAAgBJ,IAAS,mBAAmB;AAClD,SAAIC,MAAkB,SAElB,gBAAAI,EAACC,EAAM,UAAN,EACC,UAAA;AAAA,IAAA,gBAAAC,EAAC,UAAK,WAAWC,EAAW,uBAAuBL,CAAW,GAAG,UAAA,KAEjE;AAAA,IACA,gBAAAI,EAAC,UAAK,WAAWC,EAAW,uBAAuBJ,CAAa,GAC7D,UAAAJ,IAAS,SAAS,YAAA,CACrB;AAAA,IACA,gBAAAO;AAAA,MAACE;AAAA,MAAA;AAAA,QACC,WAAWD,EAAW,qBAAqBJ,CAAa;AAAA,QACxD,QAAO;AAAA,QACP,eAAW;AAAA,MAAA;AAAA,IAAA;AAAA,EACb,GACF,IAIAF,KAAc,OAEd,gBAAAG,EAACC,EAAM,UAAN,EACC,UAAA;AAAA,IAAA,gBAAAC,EAAC,UAAK,WAAWC,EAAW,uBAAuBL,CAAW,GAAG,UAAA,KAEjE;AAAA,sBACC,QAAA,EAAK,WAAWK,EAAW,uBAAuBL,CAAW,GAC3D,UAAAD,EAAA,CACH;AAAA,EAAA,GACF,IAKAD,MAAkB,YAAYA,MAAkB,aAEhD,gBAAAI,EAACC,EAAM,UAAN,EACC,UAAA;AAAA,IAAA,gBAAAC,EAAC,UAAK,WAAWC,EAAW,uBAAuBL,CAAW,GAAG,UAAA,KAEjE;AAAA,IACA,gBAAAI,EAAC,QAAA,EAAK,WAAWC,EAAW,uBAAuBL,CAAW,GAC3D,UAAAF,MAAkB,WAAW,mBAAmB,WAAA,CACnD;AAAA,EAAA,GACF,IAIG;AACT,GCrEMS,IAAM,CAAC,EAAE,IAAAC,GAAI,OAAAC,QACjB,gBAAAL,EAAC,UAAA,EAAO,IAAAI,GAAQ,IAAG,QAAO,GAAE,OAAM,MAAK,gBACrC,UAAA,gBAAAJ;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,eAAc;AAAA,IACd,MAAK;AAAA,IACL,QAAO;AAAA,IACP,KAAI;AAAA,IACJ,OAAO,GAAG,MAAMK,CAAK;AAAA,IACrB,aAAY;AAAA,EAAA;AACd,GACF,GAQIC,IAAgD,CAAC,EAAE,WAAAC,EAAA,MACvD,gBAAAT;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,eAAY;AAAA,IACZ,WAAAS;AAAA,IACA,SAAQ;AAAA,IACR,OAAM;AAAA,IACN,QAAO;AAAA,IACP,UAAS;AAAA,IAET,UAAA;AAAA,MAAA,gBAAAP,EAACG,GAAA,EAAI,IAAG,KAAI,OAAO,GAAG;AAAA,MACtB,gBAAAH,EAACG,GAAA,EAAI,IAAG,MAAK,OAAO,GAAG;AAAA,MACvB,gBAAAH,EAACG,GAAA,EAAI,IAAG,MAAK,OAAO,EAAA,CAAG;AAAA,IAAA;AAAA,EAAA;AACzB;"}

package/dist/LoadingDots-D9GGphgM.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"LoadingDots-D9GGphgM.cjs","sources":["../src/components/CustomMessage/LockedAttachment/components/_shared/PurchaseStatusBadge.tsx","../src/components/CustomMessage/LockedAttachment/components/_shared/LoadingDots.tsx"],"sourcesContent":["import { CheckCircleIcon } from '@phosphor-icons/react'\nimport classNames from 'classnames'\nimport React from 'react'\n\nimport type { PaymentStatus } from '../../types'\n\nexport interface PurchaseStatusBadgeProps {\n  /** 'own' matches the sender's dark/own-message context; 'other' matches the recipient's light/other-message context. */\n  isMine: boolean\n  /** 'paid' renders the \"Sold\"/\"Purchased\" + checkmark variant; otherwise falls back to plain amount text, or nothing. */\n  paymentStatus?: PaymentStatus\n  amountText?: string\n}\n\n/**\n * Bullet + amount/label + checkmark row for a paid attachment or message.\n * Shared by `LockedAttachment.Media`/`.Text`'s status badges.\n */\nconst PurchaseStatusBadge: React.FC<PurchaseStatusBadgeProps> = ({\n  isMine,\n  paymentStatus,\n  amountText,\n}) => {\n  const labelColour = isMine ? 'text-white/55' : 'text-black/55'\n  const successColour = isMine ? 'text-[#34c759]' : 'text-[#008236]'\n  if (paymentStatus === 'paid') {\n    return (\n      <React.Fragment>\n        <span className={classNames('text-xs font-medium', labelColour)}>\n          &bull;\n        </span>\n        <span className={classNames('text-xs font-medium', successColour)}>\n          {isMine ? 'Sold' : 'Purchased'}\n        </span>\n        <CheckCircleIcon\n          className={classNames('shrink-0 size-3.5', successColour)}\n          weight=\"bold\"\n          aria-hidden\n        />\n      </React.Fragment>\n    )\n  }\n\n  if (amountText != null) {\n    return (\n      <React.Fragment>\n        <span className={classNames('text-xs font-medium', labelColour)}>\n          &bull;\n        </span>\n        <span className={classNames('text-xs font-medium', labelColour)}>\n          {amountText}\n        </span>\n      </React.Fragment>\n    )\n  }\n\n  if (paymentStatus === 'failed' || paymentStatus === 'refunded') {\n    return (\n      <React.Fragment>\n        <span className={classNames('text-xs font-medium', labelColour)}>\n          &bull;\n        </span>\n        <span className={classNames('text-xs font-medium', labelColour)}>\n          {paymentStatus === 'failed' ? 'Payment failed' : 'Refunded'}\n        </span>\n      </React.Fragment>\n    )\n  }\n\n  return null\n}\n\nexport default PurchaseStatusBadge\n","import React from 'react'\n\nconst Dot = ({ cx, index }: { cx: string; index: number }) => (\n  <circle cx={cx} cy=\"6.15\" r=\"2.4\" fill=\"currentColor\">\n    <animateTransform\n      attributeName=\"transform\"\n      type=\"translate\"\n      values=\"0 0; 0 -2.25; 0 0;\"\n      dur=\"900ms\"\n      begin={`${120 * index}ms`}\n      repeatCount=\"indefinite\"\n    />\n  </circle>\n)\n\n/**\n * Three bouncing dots, inline-sized for use inside buttons/labels (e.g. the\n * Unlock CTA while a purchase is in flight). Mirrors the typing indicator's\n * animation but uses `currentColor` so it adopts the surrounding text color.\n */\nconst LoadingDots: React.FC<{ className?: string }> = ({ className }) => (\n  <svg\n    aria-hidden=\"true\"\n    className={className}\n    viewBox=\"0 0 20 12.3\"\n    width=\"20\"\n    height=\"13\"\n    overflow=\"visible\"\n  >\n    <Dot cx=\"3\" index={0} />\n    <Dot cx=\"10\" index={1} />\n    <Dot cx=\"17\" index={2} />\n  </svg>\n)\n\nexport default LoadingDots\n"],"names":["PurchaseStatusBadge","isMine","paymentStatus","amountText","labelColour","successColour","jsxs","React","jsx","classNames","CheckCircleIcon","Dot","cx","index","LoadingDots","className"],"mappings":"gIAkBMA,EAA0D,CAAC,CAC/D,OAAAC,EACA,cAAAC,EACA,WAAAC,CACF,IAAM,CACJ,MAAMC,EAAcH,EAAS,gBAAkB,gBACzCI,EAAgBJ,EAAS,iBAAmB,iBAClD,OAAIC,IAAkB,OAElBI,OAACC,EAAM,SAAN,CACC,SAAA,CAAAC,MAAC,QAAK,UAAWC,EAAW,sBAAuBL,CAAW,EAAG,SAAA,IAEjE,EACAI,EAAAA,IAAC,QAAK,UAAWC,EAAW,sBAAuBJ,CAAa,EAC7D,SAAAJ,EAAS,OAAS,WAAA,CACrB,EACAO,EAAAA,IAACE,EAAAA,gBAAA,CACC,UAAWD,EAAW,oBAAqBJ,CAAa,EACxD,OAAO,OACP,cAAW,EAAA,CAAA,CACb,EACF,EAIAF,GAAc,KAEdG,OAACC,EAAM,SAAN,CACC,SAAA,CAAAC,MAAC,QAAK,UAAWC,EAAW,sBAAuBL,CAAW,EAAG,SAAA,IAEjE,QACC,OAAA,CAAK,UAAWK,EAAW,sBAAuBL,CAAW,EAC3D,SAAAD,CAAA,CACH,CAAA,EACF,EAIAD,IAAkB,UAAYA,IAAkB,WAEhDI,OAACC,EAAM,SAAN,CACC,SAAA,CAAAC,MAAC,QAAK,UAAWC,EAAW,sBAAuBL,CAAW,EAAG,SAAA,IAEjE,EACAI,EAAAA,IAAC,OAAA,CAAK,UAAWC,EAAW,sBAAuBL,CAAW,EAC3D,SAAAF,IAAkB,SAAW,iBAAmB,UAAA,CACnD,CAAA,EACF,EAIG,IACT,ECpEMS,EAAM,CAAC,CAAE,GAAAC,EAAI,MAAAC,KACjBL,EAAAA,IAAC,SAAA,CAAO,GAAAI,EAAQ,GAAG,OAAO,EAAE,MAAM,KAAK,eACrC,SAAAJ,EAAAA,IAAC,mBAAA,CACC,cAAc,YACd,KAAK,YACL,OAAO,qBACP,IAAI,QACJ,MAAO,GAAG,IAAMK,CAAK,KACrB,YAAY,YAAA,CACd,EACF,EAQIC,EAAgD,CAAC,CAAE,UAAAC,CAAA,IACvDT,EAAAA,KAAC,MAAA,CACC,cAAY,OACZ,UAAAS,EACA,QAAQ,cACR,MAAM,KACN,OAAO,KACP,SAAS,UAET,SAAA,CAAAP,EAAAA,IAACG,EAAA,CAAI,GAAG,IAAI,MAAO,EAAG,EACtBH,EAAAA,IAACG,EAAA,CAAI,GAAG,KAAK,MAAO,EAAG,EACvBH,EAAAA,IAACG,EAAA,CAAI,GAAG,KAAK,MAAO,CAAA,CAAG,CAAA,CAAA,CACzB"}
+{"version":3,"file":"LoadingDots-D9GGphgM.cjs","sources":["../src/components/CustomMessage/LockedAttachment/components/_shared/PurchaseStatusBadge.tsx","../src/components/CustomMessage/LockedAttachment/components/_shared/LoadingDots.tsx"],"sourcesContent":["import { CheckCircleIcon } from '@phosphor-icons/react'\nimport classNames from 'classnames'\nimport React from 'react'\n\nimport type { PaymentStatus } from '../../types'\n\nexport interface PurchaseStatusBadgeProps {\n  /** 'own' matches the sender's dark/own-message context; 'other' matches the recipient's light/other-message context. */\n  isMine: boolean\n  /** 'paid' renders the \"Sold\"/\"Purchased\" + checkmark variant; otherwise falls back to plain amount text, or nothing. */\n  paymentStatus?: PaymentStatus\n  amountText?: string\n}\n\n/**\n * Bullet + amount/label + checkmark row for a paid attachment or message.\n * Shared by `LockedAttachment.Media`/`.Text`'s status badges.\n */\nconst PurchaseStatusBadge: React.FC<PurchaseStatusBadgeProps> = ({\n  isMine,\n  paymentStatus,\n  amountText,\n}) => {\n  const labelColour = isMine ? 'text-white/55' : 'text-black/55'\n  const successColour = isMine ? 'text-[#34c759]' : 'text-[#008236]'\n  if (paymentStatus === 'paid') {\n    return (\n      <React.Fragment>\n        <span className={classNames('text-xs font-medium', labelColour)}>\n          &bull;\n        </span>\n        <span className={classNames('text-xs font-medium', successColour)}>\n          {isMine ? 'Sold' : 'Purchased'}\n        </span>\n        <CheckCircleIcon\n          className={classNames('shrink-0 size-3.5', successColour)}\n          weight=\"bold\"\n          aria-hidden\n        />\n      </React.Fragment>\n    )\n  }\n\n  if (amountText != null) {\n    return (\n      <React.Fragment>\n        <span className={classNames('text-xs font-medium', labelColour)}>\n          &bull;\n        </span>\n        <span className={classNames('text-xs font-medium', labelColour)}>\n          {amountText}\n        </span>\n      </React.Fragment>\n    )\n  }\n\n\n  if (paymentStatus === 'failed' || paymentStatus === 'refunded') {\n    return (\n      <React.Fragment>\n        <span className={classNames('text-xs font-medium', labelColour)}>\n          &bull;\n        </span>\n        <span className={classNames('text-xs font-medium', labelColour)}>\n          {paymentStatus === 'failed' ? 'Payment failed' : 'Refunded'}\n        </span>\n      </React.Fragment>\n    )\n  }\n\n  return null\n}\n\nexport default PurchaseStatusBadge\n","import React from 'react'\n\nconst Dot = ({ cx, index }: { cx: string; index: number }) => (\n  <circle cx={cx} cy=\"6.15\" r=\"2.4\" fill=\"currentColor\">\n    <animateTransform\n      attributeName=\"transform\"\n      type=\"translate\"\n      values=\"0 0; 0 -2.25; 0 0;\"\n      dur=\"900ms\"\n      begin={`${120 * index}ms`}\n      repeatCount=\"indefinite\"\n    />\n  </circle>\n)\n\n/**\n * Three bouncing dots, inline-sized for use inside buttons/labels (e.g. the\n * Unlock CTA while a purchase is in flight). Mirrors the typing indicator's\n * animation but uses `currentColor` so it adopts the surrounding text color.\n */\nconst LoadingDots: React.FC<{ className?: string }> = ({ className }) => (\n  <svg\n    aria-hidden=\"true\"\n    className={className}\n    viewBox=\"0 0 20 12.3\"\n    width=\"20\"\n    height=\"13\"\n    overflow=\"visible\"\n  >\n    <Dot cx=\"3\" index={0} />\n    <Dot cx=\"10\" index={1} />\n    <Dot cx=\"17\" index={2} />\n  </svg>\n)\n\nexport default LoadingDots\n"],"names":["PurchaseStatusBadge","isMine","paymentStatus","amountText","labelColour","successColour","jsxs","React","jsx","classNames","CheckCircleIcon","Dot","cx","index","LoadingDots","className"],"mappings":"gIAkBMA,EAA0D,CAAC,CAC/D,OAAAC,EACA,cAAAC,EACA,WAAAC,CACF,IAAM,CACJ,MAAMC,EAAcH,EAAS,gBAAkB,gBACzCI,EAAgBJ,EAAS,iBAAmB,iBAClD,OAAIC,IAAkB,OAElBI,OAACC,EAAM,SAAN,CACC,SAAA,CAAAC,MAAC,QAAK,UAAWC,EAAW,sBAAuBL,CAAW,EAAG,SAAA,IAEjE,EACAI,EAAAA,IAAC,QAAK,UAAWC,EAAW,sBAAuBJ,CAAa,EAC7D,SAAAJ,EAAS,OAAS,WAAA,CACrB,EACAO,EAAAA,IAACE,EAAAA,gBAAA,CACC,UAAWD,EAAW,oBAAqBJ,CAAa,EACxD,OAAO,OACP,cAAW,EAAA,CAAA,CACb,EACF,EAIAF,GAAc,KAEdG,OAACC,EAAM,SAAN,CACC,SAAA,CAAAC,MAAC,QAAK,UAAWC,EAAW,sBAAuBL,CAAW,EAAG,SAAA,IAEjE,QACC,OAAA,CAAK,UAAWK,EAAW,sBAAuBL,CAAW,EAC3D,SAAAD,CAAA,CACH,CAAA,EACF,EAKAD,IAAkB,UAAYA,IAAkB,WAEhDI,OAACC,EAAM,SAAN,CACC,SAAA,CAAAC,MAAC,QAAK,UAAWC,EAAW,sBAAuBL,CAAW,EAAG,SAAA,IAEjE,EACAI,EAAAA,IAAC,OAAA,CAAK,UAAWC,EAAW,sBAAuBL,CAAW,EAC3D,SAAAF,IAAkB,SAAW,iBAAmB,UAAA,CACnD,CAAA,EACF,EAIG,IACT,ECrEMS,EAAM,CAAC,CAAE,GAAAC,EAAI,MAAAC,KACjBL,EAAAA,IAAC,SAAA,CAAO,GAAAI,EAAQ,GAAG,OAAO,EAAE,MAAM,KAAK,eACrC,SAAAJ,EAAAA,IAAC,mBAAA,CACC,cAAc,YACd,KAAK,YACL,OAAO,qBACP,IAAI,QACJ,MAAO,GAAG,IAAMK,CAAK,KACrB,YAAY,YAAA,CACd,EACF,EAQIC,EAAgD,CAAC,CAAE,UAAAC,CAAA,IACvDT,EAAAA,KAAC,MAAA,CACC,cAAY,OACZ,UAAAS,EACA,QAAQ,cACR,MAAM,KACN,OAAO,KACP,SAAS,UAET,SAAA,CAAAP,EAAAA,IAACG,EAAA,CAAI,GAAG,IAAI,MAAO,EAAG,EACtBH,EAAAA,IAACG,EAAA,CAAI,GAAG,KAAK,MAAO,EAAG,EACvBH,EAAAA,IAACG,EAAA,CAAI,GAAG,KAAK,MAAO,CAAA,CAAG,CAAA,CAAA,CACzB"}