@postrun/react 2.3.0 → 2.5.0

package/dist/index.cjs

@@ -14,6 +14,8 @@ var fi = require('react-icons/fi');
 var jsxRuntime = require('react/jsx-runtime');
 var twitterText = require('twitter-text');
 var lu = require('react-icons/lu');
+var useEmblaCarousel = require('embla-carousel-react');
+var io5 = require('react-icons/io5');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
 
@@ -23,6 +25,7 @@ var pLimit__default = /*#__PURE__*/_interopDefault(pLimit);
 var pRetry__default = /*#__PURE__*/_interopDefault(pRetry);
 var axios__default = /*#__PURE__*/_interopDefault(axios);
 var twitterText__default = /*#__PURE__*/_interopDefault(twitterText);
+var useEmblaCarousel__default = /*#__PURE__*/_interopDefault(useEmblaCarousel);
 
 // src/context.tsx
 function createDefaultQueryClient() {
@@ -1052,7 +1055,7 @@ var ACTIONS = [
   { label: "Share", Icon: fi.FiShare }
 ];
 function XPreviewActions() {
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { style: ROW, children: ACTIONS.map(({ label, Icon }) => /* @__PURE__ */ jsxRuntime.jsx(Icon, { size: 18, "aria-label": label, role: "img" }, label)) });
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { style: ROW, children: ACTIONS.map(({ label, Icon: Icon2 }) => /* @__PURE__ */ jsxRuntime.jsx(Icon2, { size: 18, "aria-label": label, role: "img" }, label)) });
 }
 var {
   extractCashtagsWithIndices,
@@ -1339,6 +1342,111 @@ function useIsDark(theme) {
   }
   return theme === "dark";
 }
+function domainOf(source) {
+  try {
+    return new URL(source).hostname.replace(/^www\./, "");
+  } catch {
+    return source;
+  }
+}
+function ArticleCard({ article, thumbnail }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { style: cardStyle, children: [
+    thumbnail ? /* @__PURE__ */ jsxRuntime.jsx("img", { src: thumbnail.src, alt: thumbnail.alt ?? "", style: thumbStyle }) : null,
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { style: metaStyle, children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { style: domainStyle, children: domainOf(article.source) }),
+      article.title ? /* @__PURE__ */ jsxRuntime.jsx("div", { style: titleStyle, children: article.title }) : null,
+      article.description ? /* @__PURE__ */ jsxRuntime.jsx("div", { style: descStyle, children: article.description }) : null
+    ] })
+  ] });
+}
+var cardStyle = {
+  border: `1px solid ${varRef(LI_VAR.border)}`,
+  borderRadius: 8,
+  overflow: "hidden"
+};
+var thumbStyle = {
+  width: "100%",
+  display: "block",
+  aspectRatio: "1.91 / 1",
+  objectFit: "cover"
+};
+var metaStyle = {
+  padding: "8px 12px",
+  display: "flex",
+  flexDirection: "column",
+  gap: 2
+};
+var domainStyle = {
+  fontSize: 12,
+  color: varRef(LI_VAR.muted)
+};
+var titleStyle = {
+  fontSize: 14,
+  fontWeight: 600,
+  color: varRef(LI_VAR.text),
+  lineHeight: 1.3,
+  display: "-webkit-box",
+  WebkitLineClamp: 2,
+  WebkitBoxOrient: "vertical",
+  overflow: "hidden"
+};
+var descStyle = {
+  fontSize: 12,
+  color: varRef(LI_VAR.muted),
+  lineHeight: 1.3,
+  display: "-webkit-box",
+  WebkitLineClamp: 1,
+  WebkitBoxOrient: "vertical",
+  overflow: "hidden"
+};
+function DocumentCard({ document, cover }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { style: cardStyle2, children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { style: pageStyle, children: cover ? /* @__PURE__ */ jsxRuntime.jsx("img", { src: cover.src, alt: cover.alt ?? "", style: coverStyle }) : /* @__PURE__ */ jsxRuntime.jsx(fi.FiFileText, { size: 56, "aria-hidden": true, style: { opacity: 0.5 } }) }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { style: barStyle, children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { style: titleStyle2, children: document.title }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { style: kindStyle, children: "Document" })
+    ] })
+  ] });
+}
+var cardStyle2 = {
+  border: `1px solid ${varRef(LI_VAR.border)}`,
+  borderRadius: 8,
+  overflow: "hidden"
+};
+var pageStyle = {
+  position: "relative",
+  aspectRatio: "4 / 3",
+  background: "rgba(127,127,127,0.12)",
+  display: "grid",
+  placeItems: "center",
+  color: varRef(LI_VAR.muted)
+};
+var coverStyle = {
+  width: "100%",
+  height: "100%",
+  objectFit: "cover"
+};
+var barStyle = {
+  background: "rgba(0,0,0,0.85)",
+  color: "#fff",
+  padding: "10px 14px",
+  display: "flex",
+  flexDirection: "column",
+  gap: 1
+};
+var titleStyle2 = {
+  fontSize: 14,
+  fontWeight: 600,
+  lineHeight: 1.3,
+  display: "-webkit-box",
+  WebkitLineClamp: 2,
+  WebkitBoxOrient: "vertical",
+  overflow: "hidden"
+};
+var kindStyle = {
+  fontSize: 12,
+  color: "rgba(255,255,255,0.7)"
+};
 var ROW2 = {
   display: "flex",
   justifyContent: "space-around",
@@ -1362,8 +1470,8 @@ var ACTIONS2 = [
   { label: "Send", Icon: fi.FiSend }
 ];
 function EngagementBar() {
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { style: ROW2, children: ACTIONS2.map(({ label, Icon }) => /* @__PURE__ */ jsxRuntime.jsxs("span", { style: ITEM, children: [
-    /* @__PURE__ */ jsxRuntime.jsx(Icon, { size: 20, "aria-hidden": true }),
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { style: ROW2, children: ACTIONS2.map(({ label, Icon: Icon2 }) => /* @__PURE__ */ jsxRuntime.jsxs("span", { style: ITEM, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(Icon2, { size: 20, "aria-hidden": true }),
     label
   ] }, label)) });
 }
@@ -1492,11 +1600,11 @@ function Tile({
   ] });
 }
 function ImageMosaic({ media }) {
-  if (media.length === 0) {
+  const [only] = media;
+  if (!only) {
     return null;
   }
   if (media.length === 1) {
-    const only = media[0];
     return /* @__PURE__ */ jsxRuntime.jsx(
       "img",
       {
@@ -1542,6 +1650,48 @@ function Media({ media }) {
   const images = media.filter((item) => item.kind === "image");
   return /* @__PURE__ */ jsxRuntime.jsx(ImageMosaic, { media: images });
 }
+function Poll({ poll }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { style: wrapStyle, children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { style: questionStyle, children: poll.question }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { style: optionsStyle, children: poll.options.map((option, i) => /* @__PURE__ */ jsxRuntime.jsx("div", { style: optionStyle, children: option }, `${option}-${i}`)) }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { style: footerStyle, children: [
+      "0 votes \u2022 ",
+      js.linkedinPollDurationLabel(poll.duration)
+    ] })
+  ] });
+}
+var wrapStyle = {
+  border: `1px solid ${varRef(LI_VAR.border)}`,
+  borderRadius: 8,
+  padding: 12,
+  display: "flex",
+  flexDirection: "column",
+  gap: 10
+};
+var questionStyle = {
+  fontSize: 14,
+  fontWeight: 600,
+  color: varRef(LI_VAR.text),
+  lineHeight: 1.35
+};
+var optionsStyle = {
+  display: "flex",
+  flexDirection: "column",
+  gap: 8
+};
+var optionStyle = {
+  border: `1px solid ${varRef(LI_VAR.accent)}`,
+  borderRadius: 999,
+  padding: "8px 16px",
+  textAlign: "center",
+  fontSize: 14,
+  fontWeight: 600,
+  color: varRef(LI_VAR.accent)
+};
+var footerStyle = {
+  fontSize: 12,
+  color: varRef(LI_VAR.muted)
+};
 var FOLD_CHARS = 200;
 var BODY_STYLE = {
   whiteSpace: "pre-wrap",
@@ -1669,7 +1819,7 @@ function LinkedInPostPreviewImpl({
     accent: varRef(LI_VAR.accent),
     muted: varRef(LI_VAR.muted)
   };
-  const cardStyle = {
+  const cardStyle4 = {
     ...paletteVars(dark),
     background: varRef(LI_VAR.bg),
     color: varRef(LI_VAR.text),
@@ -1680,7 +1830,7 @@ function LinkedInPostPreviewImpl({
     fontFamily: FONT_STACK,
     ...style
   };
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className, style: cardStyle, children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className, style: cardStyle4, children: [
     /* @__PURE__ */ jsxRuntime.jsx(Header, { author, visibility, time }),
     variant.body ? /* @__PURE__ */ jsxRuntime.jsx("div", { style: { padding: "8px 16px 0" }, children: /* @__PURE__ */ jsxRuntime.jsx(
       PostBody,
@@ -1690,15 +1840,1016 @@ function LinkedInPostPreviewImpl({
         colors: bodyColors
       }
     ) }) : null,
-    resolvedMedia.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", { style: { marginTop: 12 }, children: /* @__PURE__ */ jsxRuntime.jsx(Media, { media: resolvedMedia }) }) : null,
+    renderContent(variant, resolvedMedia),
     showActions ? /* @__PURE__ */ jsxRuntime.jsx(EngagementBar, {}) : null
   ] });
 }
+function renderContent(variant, media) {
+  const settings = variant.settings;
+  const kind = settings?.content_kind;
+  const [firstMedia] = media;
+  if (kind === "article" && settings?.article) {
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { style: INSET, children: /* @__PURE__ */ jsxRuntime.jsx(ArticleCard, { article: settings.article, thumbnail: firstMedia }) });
+  }
+  if (kind === "poll" && settings?.poll) {
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { style: INSET, children: /* @__PURE__ */ jsxRuntime.jsx(Poll, { poll: settings.poll }) });
+  }
+  if (kind === "document" && settings?.document) {
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { style: INSET, children: /* @__PURE__ */ jsxRuntime.jsx(DocumentCard, { document: settings.document, cover: firstMedia }) });
+  }
+  return media.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", { style: { marginTop: 12 }, children: /* @__PURE__ */ jsxRuntime.jsx(Media, { media }) }) : null;
+}
+var INSET = { padding: "12px 16px 0" };
 var LinkedInPostPreview = react.memo(LinkedInPostPreviewImpl);
+var LINK_COLOR = "#8ab4ff";
+var TOKEN = /([#@][\p{L}\p{N}_.]+)/gu;
+var IS_TOKEN = /^[#@][\p{L}\p{N}_.]+$/u;
+function Caption({ body }) {
+  const [expanded, setExpanded] = react.useState(false);
+  const [overflowing, setOverflowing] = react.useState(false);
+  const ref = react.useRef(null);
+  react.useLayoutEffect(() => {
+    const el = ref.current;
+    if (!el || expanded) {
+      return;
+    }
+    setOverflowing(el.scrollHeight > el.clientHeight + 1);
+  }, [body, expanded]);
+  const parts = body.split(TOKEN);
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { style: wrapStyle2, children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { ref, style: expanded ? expandedTextStyle : clampedTextStyle, children: parts.map(
+      (part, i) => IS_TOKEN.test(part) ? /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: LINK_COLOR }, children: part }, i) : /* @__PURE__ */ jsxRuntime.jsx("span", { children: part }, i)
+    ) }),
+    overflowing || expanded ? /* @__PURE__ */ jsxRuntime.jsx(
+      "button",
+      {
+        type: "button",
+        "aria-expanded": expanded,
+        "aria-label": expanded ? "Collapse caption" : "Expand caption",
+        onClick: () => setExpanded((v) => !v),
+        style: moreStyle,
+        children: expanded ? "less" : "more"
+      }
+    ) : null
+  ] });
+}
+var wrapStyle2 = {
+  fontSize: 14,
+  lineHeight: 1.35
+};
+var clampedTextStyle = {
+  display: "-webkit-box",
+  WebkitLineClamp: 2,
+  WebkitBoxOrient: "vertical",
+  overflow: "hidden",
+  whiteSpace: "pre-wrap",
+  wordBreak: "break-word"
+};
+var expandedTextStyle = {
+  maxHeight: 180,
+  overflowY: "auto",
+  whiteSpace: "pre-wrap",
+  wordBreak: "break-word",
+  overscrollBehavior: "contain"
+};
+var moreStyle = {
+  display: "inline-block",
+  marginTop: 2,
+  padding: 0,
+  border: 0,
+  background: "transparent",
+  color: "rgba(255,255,255,0.82)",
+  fontSize: 13,
+  fontWeight: 600,
+  cursor: "pointer",
+  fontFamily: "inherit"
+};
+function Media2({
+  media,
+  pending = false
+}) {
+  const [first] = media;
+  if (!first) {
+    return pending ? /* @__PURE__ */ jsxRuntime.jsx(ProcessingMedia, {}) : /* @__PURE__ */ jsxRuntime.jsx(EmptyMedia, {});
+  }
+  if (first.kind === "video") {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "video",
+      {
+        src: first.src,
+        poster: first.posterSrc,
+        autoPlay: true,
+        muted: true,
+        loop: true,
+        playsInline: true,
+        style: coverStyle2
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(PhotoCarousel, { media });
+}
+function PhotoCarousel({ media }) {
+  const [emblaRef, emblaApi] = useEmblaCarousel__default.default({
+    loop: false,
+    align: "start",
+    containScroll: "trimSnaps"
+  });
+  const [selected, setSelected] = react.useState(0);
+  const sync = react.useCallback((api) => {
+    setSelected(api.selectedScrollSnap());
+  }, []);
+  react.useEffect(() => {
+    if (!emblaApi) {
+      return;
+    }
+    sync(emblaApi);
+    emblaApi.on("select", sync).on("reInit", sync);
+    return () => {
+      emblaApi.off("select", sync).off("reInit", sync);
+    };
+  }, [emblaApi, sync]);
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { position: "absolute", inset: 0 }, children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { ref: emblaRef, style: viewportStyle, children: /* @__PURE__ */ jsxRuntime.jsx("div", { style: containerStyle, children: media.map((m, i) => /* @__PURE__ */ jsxRuntime.jsx("div", { style: slideStyle, children: /* @__PURE__ */ jsxRuntime.jsx("img", { src: m.src, alt: m.alt ?? "", style: coverStyle2 }) }, `${m.src}-${i}`)) }) }),
+    media.length > 1 ? /* @__PURE__ */ jsxRuntime.jsx("div", { style: dotsStyle, children: media.map((m, i) => /* @__PURE__ */ jsxRuntime.jsx(
+      "span",
+      {
+        style: { ...dotStyle, opacity: i === selected ? 1 : 0.4 }
+      },
+      `dot-${m.src}-${i}`
+    )) }) : null
+  ] });
+}
+function EmptyMedia() {
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { style: emptyStyle, children: "No media yet" });
+}
+function ProcessingMedia() {
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { style: emptyStyle, children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { style: shimmerStyle }),
+    /* @__PURE__ */ jsxRuntime.jsx("span", { style: { position: "relative", zIndex: 1 }, children: "Processing media\u2026" })
+  ] });
+}
+var coverStyle2 = {
+  position: "absolute",
+  inset: 0,
+  width: "100%",
+  height: "100%",
+  objectFit: "cover"
+};
+var viewportStyle = {
+  position: "absolute",
+  inset: 0,
+  overflow: "hidden"
+};
+var containerStyle = {
+  display: "flex",
+  height: "100%"
+};
+var slideStyle = {
+  position: "relative",
+  flex: "0 0 100%",
+  minWidth: 0,
+  height: "100%"
+};
+var dotsStyle = {
+  position: "absolute",
+  bottom: 124,
+  left: "50%",
+  transform: "translateX(-50%)",
+  display: "flex",
+  gap: 5,
+  alignItems: "center"
+};
+var dotStyle = {
+  width: 6,
+  height: 6,
+  borderRadius: "50%",
+  background: "#fff",
+  transition: "opacity 160ms ease"
+};
+var emptyStyle = {
+  position: "absolute",
+  inset: 0,
+  display: "flex",
+  alignItems: "center",
+  justifyContent: "center",
+  color: "rgba(255,255,255,0.55)",
+  fontSize: 13,
+  background: "linear-gradient(180deg,#1c1c20,#101013)",
+  overflow: "hidden"
+};
+var shimmerStyle = {
+  position: "absolute",
+  inset: 0,
+  background: "linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.06) 50%, rgba(255,255,255,0) 100%)",
+  backgroundSize: "200% 100%",
+  animation: "pr-tt-shimmer 1.4s ease-in-out infinite"
+};
+var Icon = ({
+  size = 24,
+  viewBox,
+  children,
+  ...rest
+}) => /* @__PURE__ */ jsxRuntime.jsx(
+  "svg",
+  {
+    width: size,
+    height: size,
+    viewBox,
+    fill: "currentColor",
+    xmlns: "http://www.w3.org/2000/svg",
+    ...rest,
+    children
+  }
+);
+var HeartIcon = (p) => /* @__PURE__ */ jsxRuntime.jsx(Icon, { viewBox: "0 0 24 24", ...p, children: /* @__PURE__ */ jsxRuntime.jsx(
+  "path",
+  {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M7.5 2.25C10.5 2.25 12 4.25 12 4.25C12 4.25 13.5 2.25 16.5 2.25C20 2.25 22.5 4.99999 22.5 8.5C22.5 12.5 19.2311 16.0657 16.25 18.75C14.4095 20.4072 13 21.5 12 21.5C11 21.5 9.55051 20.3989 7.75 18.75C4.81949 16.0662 1.5 12.5 1.5 8.5C1.5 4.99999 4 2.25 7.5 2.25Z"
+  }
+) });
+var CommentIcon = (p) => /* @__PURE__ */ jsxRuntime.jsx(Icon, { viewBox: "0 0 48 48", ...p, children: /* @__PURE__ */ jsxRuntime.jsx(
+  "path",
+  {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M2 21.5c0-10.22 9.88-18 22-18s22 7.78 22 18c0 5.63-3.19 10.74-7.32 14.8a43.6 43.6 0 0 1-14.14 9.1A1.5 1.5 0 0 1 22.5 44v-5.04C11.13 38.4 2 31.34 2 21.5M14 25a3 3 0 1 0 0-6 3 3 0 0 0 0 6m10 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6m13-3a3 3 0 1 1-6 0 3 3 0 0 1 6 0"
+  }
+) });
+var BookmarkIcon = (p) => /* @__PURE__ */ jsxRuntime.jsx(Icon, { viewBox: "0 0 24 24", ...p, children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M4 4.5a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v15.13a1 1 0 0 1-1.555.831l-6.167-4.12a.5.5 0 0 0-.556 0l-6.167 4.12A1 1 0 0 1 4 19.63z" }) });
+var ShareIcon = (p) => /* @__PURE__ */ jsxRuntime.jsx(Icon, { viewBox: "0 0 20 20", ...p, children: /* @__PURE__ */ jsxRuntime.jsx(
+  "path",
+  {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M10.938 3.175a.674.674 0 0 1 1.138-.488l6.526 6.215c.574.547.554 1.47-.043 1.991l-6.505 5.676a.674.674 0 0 1-1.116-.508V13.49s-6.985-1.258-9.225 2.854c-.209.384-1.023.518-.857-1.395.692-3.52 2.106-9.017 10.082-9.017z"
+  }
+) });
+var PlusIcon = (p) => /* @__PURE__ */ jsxRuntime.jsx(Icon, { viewBox: "0 0 48 48", ...p, children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M26 7a1 1 0 0 0-1-1h-2a1 1 0 0 0-1 1v15H7a1 1 0 0 0-1 1v2a1 1 0 0 0 1 1h15v15a1 1 0 0 0 1 1h2a1 1 0 0 0 1-1V26h15a1 1 0 0 0 1-1v-2a1 1 0 0 0-1-1H26V7Z" }) });
+var DASH = "\u2011\u2011\u2011";
+function commercialLabel(settings) {
+  if (settings?.brand_content_toggle) {
+    return "Paid partnership";
+  }
+  if (settings?.brand_organic_toggle) {
+    return "Promotional content";
+  }
+  return null;
+}
+function TikTokPostPreviewImpl({
+  variant,
+  creatorInfo,
+  media,
+  className,
+  style
+}) {
+  const resolvedMedia = useResolvedMedia(
+    media,
+    variant.media,
+    altSignatureOf(variant.media)
+  );
+  const { creator } = creatorInfo;
+  const handle = creator.username || creator.nickname;
+  const label = commercialLabel(variant.settings);
+  const isAigc = Boolean(variant.settings?.is_aigc);
+  const pending = (media?.length ?? 0) > 0 && resolvedMedia.length === 0;
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className, style: { ...cardStyle3, ...style }, children: [
+    /* @__PURE__ */ jsxRuntime.jsx("style", { children: KEYFRAMES }),
+    /* @__PURE__ */ jsxRuntime.jsx(Media2, { media: resolvedMedia, pending }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { style: scrimStyle }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { style: infoStyle, children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { style: usernameStyle, children: handle }),
+      variant.body ? /* @__PURE__ */ jsxRuntime.jsx(Caption, { body: variant.body }) : null,
+      label || isAigc ? /* @__PURE__ */ jsxRuntime.jsxs("div", { style: labelsStyle, children: [
+        label ? /* @__PURE__ */ jsxRuntime.jsx("span", { style: pillStyle, children: label }) : null,
+        isAigc ? /* @__PURE__ */ jsxRuntime.jsx("span", { style: pillStyle, children: "Creator labeled as AI-generated" }) : null
+      ] }) : null,
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { style: musicRowStyle, children: [
+        /* @__PURE__ */ jsxRuntime.jsx(io5.IoMusicalNotes, { size: 13 }),
+        /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
+          "Original sound - ",
+          creator.nickname
+        ] })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { style: railStyle, children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { style: avatarWrapStyle, children: [
+        /* @__PURE__ */ jsxRuntime.jsx(Avatar, { url: creator.avatar_url, name: creator.nickname }),
+        /* @__PURE__ */ jsxRuntime.jsx("span", { style: followBadgeStyle, children: /* @__PURE__ */ jsxRuntime.jsx(PlusIcon, { size: 14 }) })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx(RailAction, { icon: /* @__PURE__ */ jsxRuntime.jsx(HeartIcon, { size: 30 }), count: DASH }),
+      /* @__PURE__ */ jsxRuntime.jsx(RailAction, { icon: /* @__PURE__ */ jsxRuntime.jsx(CommentIcon, { size: 30 }), count: DASH }),
+      /* @__PURE__ */ jsxRuntime.jsx(RailAction, { icon: /* @__PURE__ */ jsxRuntime.jsx(BookmarkIcon, { size: 28 }), count: DASH }),
+      /* @__PURE__ */ jsxRuntime.jsx(RailAction, { icon: /* @__PURE__ */ jsxRuntime.jsx(ShareIcon, { size: 28 }), count: DASH }),
+      /* @__PURE__ */ jsxRuntime.jsx(Disc, { url: creator.avatar_url })
+    ] })
+  ] });
+}
+function RailAction({ icon, count }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { style: railActionStyle, children: [
+    /* @__PURE__ */ jsxRuntime.jsx("span", { style: railIconStyle, children: icon }),
+    /* @__PURE__ */ jsxRuntime.jsx("span", { style: railCountStyle, children: count })
+  ] });
+}
+function Avatar({ url, name }) {
+  if (url) {
+    return /* @__PURE__ */ jsxRuntime.jsx("img", { src: url, alt: name, style: avatarStyle });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { style: { ...avatarStyle, ...avatarFallbackStyle }, children: name.slice(0, 1).toUpperCase() });
+}
+function Disc({ url }) {
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { style: discStyle, children: url ? /* @__PURE__ */ jsxRuntime.jsx("img", { src: url, alt: "", style: discImgStyle }) : null });
+}
+var cardStyle3 = {
+  position: "relative",
+  width: "100%",
+  maxWidth: 320,
+  aspectRatio: "9 / 16",
+  borderRadius: 16,
+  overflow: "hidden",
+  background: "#000",
+  color: "#fff",
+  fontFamily: '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif'
+};
+var scrimStyle = {
+  position: "absolute",
+  inset: 0,
+  background: "linear-gradient(180deg, rgba(0,0,0,0) 55%, rgba(0,0,0,0.55) 100%)",
+  pointerEvents: "none"
+};
+var infoStyle = {
+  position: "absolute",
+  left: 14,
+  right: 70,
+  bottom: 14,
+  display: "flex",
+  flexDirection: "column",
+  gap: 6,
+  textShadow: "0 1px 3px rgba(0,0,0,0.5)"
+};
+var usernameStyle = {
+  fontWeight: 600,
+  fontSize: 16
+};
+var labelsStyle = {
+  display: "flex",
+  flexDirection: "column",
+  alignItems: "flex-start",
+  gap: 4,
+  marginTop: 2
+};
+var pillStyle = {
+  display: "inline-flex",
+  alignItems: "center",
+  background: "rgba(255,255,255,0.18)",
+  color: "#fff",
+  fontSize: 11,
+  fontWeight: 500,
+  padding: "2px 7px",
+  borderRadius: 4
+};
+var musicRowStyle = {
+  display: "flex",
+  alignItems: "center",
+  gap: 6,
+  fontSize: 13,
+  marginTop: 4
+};
+var railStyle = {
+  position: "absolute",
+  right: 8,
+  bottom: 14,
+  display: "flex",
+  flexDirection: "column",
+  alignItems: "center",
+  gap: 16,
+  color: "#fff"
+};
+var avatarWrapStyle = {
+  position: "relative",
+  marginBottom: 8
+};
+var avatarStyle = {
+  width: 46,
+  height: 46,
+  borderRadius: "50%",
+  objectFit: "cover",
+  display: "block",
+  border: "1px solid rgba(255,255,255,0.2)"
+};
+var avatarFallbackStyle = {
+  display: "grid",
+  placeItems: "center",
+  background: "#3a3a40",
+  color: "#fff",
+  fontSize: 18,
+  fontWeight: 700
+};
+var followBadgeStyle = {
+  position: "absolute",
+  bottom: -9,
+  left: "50%",
+  transform: "translateX(-50%)",
+  width: 19,
+  height: 19,
+  borderRadius: "50%",
+  background: "#fe2c55",
+  color: "#fff",
+  display: "grid",
+  placeItems: "center"
+};
+var railActionStyle = {
+  display: "flex",
+  flexDirection: "column",
+  alignItems: "center",
+  gap: 3
+};
+var railIconStyle = {
+  display: "grid",
+  placeItems: "center",
+  filter: "drop-shadow(0 1px 2px rgba(0,0,0,0.4))"
+};
+var railCountStyle = {
+  fontSize: 12,
+  fontWeight: 600,
+  textShadow: "0 1px 2px rgba(0,0,0,0.4)"
+};
+var discStyle = {
+  width: 44,
+  height: 44,
+  borderRadius: "50%",
+  background: "radial-gradient(circle, #555 0 36%, #111 37% 100%)",
+  display: "grid",
+  placeItems: "center",
+  marginTop: 2,
+  animation: "pr-tt-spin 4s linear infinite"
+};
+var discImgStyle = {
+  width: 22,
+  height: 22,
+  borderRadius: "50%",
+  objectFit: "cover"
+};
+var KEYFRAMES = `@keyframes pr-tt-spin{from{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes pr-tt-shimmer{0%{background-position:-200% 0}100%{background-position:200% 0}}`;
+var TikTokPostPreview = react.memo(TikTokPostPreviewImpl);
+var TT_VAR = {
+  text: "--pr-tt-text",
+  muted: "--pr-tt-muted",
+  border: "--pr-tt-border",
+  accent: "--pr-tt-accent",
+  switchOff: "--pr-tt-switch-off"
+};
+var LIGHT2 = {
+  text: "rgba(0,0,0,0.9)",
+  muted: "rgba(0,0,0,0.55)",
+  border: "rgba(0,0,0,0.12)",
+  accent: "#fe2c55",
+  switchOff: "rgba(0,0,0,0.18)"
+};
+var DARK2 = {
+  text: "rgba(255,255,255,0.92)",
+  muted: "#8a8a92",
+  border: "rgba(255,255,255,0.14)",
+  accent: "#fe2c55",
+  switchOff: "rgba(255,255,255,0.22)"
+};
+function varRef2(name) {
+  return `var(${name})`;
+}
+function paletteVars2(dark) {
+  const p = dark ? DARK2 : LIGHT2;
+  return {
+    [TT_VAR.text]: p.text,
+    [TT_VAR.muted]: p.muted,
+    [TT_VAR.border]: p.border,
+    [TT_VAR.accent]: p.accent,
+    [TT_VAR.switchOff]: p.switchOff
+  };
+}
+function usePrefersDark2() {
+  const [dark, setDark] = react.useState(false);
+  react.useEffect(() => {
+    if (typeof window === "undefined" || !window.matchMedia) {
+      return;
+    }
+    const mq = window.matchMedia("(prefers-color-scheme: dark)");
+    setDark(mq.matches);
+    const onChange = (event) => setDark(event.matches);
+    mq.addEventListener("change", onChange);
+    return () => mq.removeEventListener("change", onChange);
+  }, []);
+  return dark;
+}
+function useIsDark2(theme) {
+  const prefersDark = usePrefersDark2();
+  if (theme === "auto") {
+    return prefersDark;
+  }
+  return theme === "dark";
+}
+var MUTED = varRef2(TT_VAR.muted);
+var BORDER = varRef2(TT_VAR.border);
+var ACCENT = varRef2(TT_VAR.accent);
+var SWITCH_OFF = varRef2(TT_VAR.switchOff);
+var ON = "#34c759";
+function Row({
+  label,
+  sublabel,
+  control,
+  htmlFor
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { style: rowStyle, children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("label", { htmlFor, style: { display: "flex", flexDirection: "column", gap: 2 }, children: [
+      /* @__PURE__ */ jsxRuntime.jsx("span", { style: { fontSize: 14 }, children: label }),
+      sublabel ? /* @__PURE__ */ jsxRuntime.jsx("span", { style: { fontSize: 12, color: MUTED }, children: sublabel }) : null
+    ] }),
+    control
+  ] });
+}
+function Switch({
+  checked,
+  onChange,
+  disabled,
+  id,
+  ariaLabel
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "button",
+    {
+      type: "button",
+      role: "switch",
+      id,
+      "aria-label": ariaLabel,
+      "aria-checked": checked,
+      disabled,
+      onClick: () => onChange(!checked),
+      style: {
+        ...switchTrackStyle,
+        background: checked ? ON : SWITCH_OFF,
+        opacity: disabled ? 0.4 : 1,
+        cursor: disabled ? "not-allowed" : "pointer"
+      },
+      children: /* @__PURE__ */ jsxRuntime.jsx(
+        "span",
+        {
+          style: {
+            ...switchKnobStyle,
+            transform: checked ? "translateX(16px)" : "translateX(0)"
+          }
+        }
+      )
+    }
+  );
+}
+function SectionLabel({ children }) {
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { style: sectionLabelStyle, children });
+}
+function Hint({ children }) {
+  return /* @__PURE__ */ jsxRuntime.jsx("p", { style: hintStyle, children });
+}
+function Notice({ children }) {
+  return /* @__PURE__ */ jsxRuntime.jsx("p", { style: noticeStyle, children });
+}
+function CheckRow({
+  label,
+  checked,
+  onChange
+}) {
+  const id = react.useId();
+  return /* @__PURE__ */ jsxRuntime.jsxs("label", { htmlFor: id, style: checkRowStyle, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "input",
+      {
+        id,
+        type: "checkbox",
+        checked,
+        onChange: (e) => onChange(e.target.checked),
+        style: { accentColor: ACCENT, width: 16, height: 16 }
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx("span", { style: { fontSize: 14 }, children: label })
+  ] });
+}
+var rowStyle = {
+  display: "flex",
+  alignItems: "center",
+  justifyContent: "space-between",
+  gap: 12,
+  minHeight: 36
+};
+var switchTrackStyle = {
+  position: "relative",
+  width: 40,
+  height: 24,
+  borderRadius: 999,
+  border: 0,
+  padding: 2,
+  flex: "0 0 auto",
+  transition: "background 160ms ease"
+};
+var switchKnobStyle = {
+  display: "block",
+  width: 20,
+  height: 20,
+  borderRadius: "50%",
+  background: "#fff",
+  boxShadow: "0 1px 2px rgba(0,0,0,0.3)",
+  transition: "transform 160ms ease"
+};
+var sectionLabelStyle = {
+  fontSize: 13,
+  fontWeight: 600
+};
+var hintStyle = {
+  margin: 0,
+  fontSize: 12,
+  color: ACCENT,
+  lineHeight: 1.4
+};
+var noticeStyle = {
+  margin: 0,
+  fontSize: 12,
+  color: MUTED,
+  lineHeight: 1.4
+};
+var checkRowStyle = {
+  display: "flex",
+  alignItems: "center",
+  gap: 10,
+  cursor: "pointer"
+};
+var TOKENS = { MUTED, BORDER, ACCENT};
+function AudienceSelect({
+  creatorInfo,
+  value,
+  onChange
+}) {
+  const id = react.useId();
+  const options = js.audiencePrivacyOptions(creatorInfo.privacy_options, value);
+  const unselected = js.audienceUnselected(value);
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", flexDirection: "column", gap: 8 }, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(SectionLabel, { children: "Who can view this post" }),
+    /* @__PURE__ */ jsxRuntime.jsxs(
+      "select",
+      {
+        id,
+        value: value.privacy_level ?? "",
+        onChange: (e) => onChange({
+          ...value,
+          // Validate against the OFFERED (filtered) options, not the full set —
+          // so a manipulated value (e.g. SELF_ONLY while branded) can't slip in.
+          privacy_level: js.parsePrivacyLevel(e.target.value, options)
+        }),
+        style: selectStyle,
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx("option", { value: "", disabled: true, children: "Select who can view this post" }),
+          options.map((level) => /* @__PURE__ */ jsxRuntime.jsx("option", { value: level, children: js.tiktokPrivacyLabel(level) }, level))
+        ]
+      }
+    ),
+    unselected ? /* @__PURE__ */ jsxRuntime.jsx(Hint, { children: js.TIKTOK_AUDIENCE_REQUIRED_HINT }) : null
+  ] });
+}
+var selectStyle = {
+  width: "100%",
+  appearance: "none",
+  background: "transparent",
+  color: "inherit",
+  border: `1px solid ${TOKENS.BORDER}`,
+  borderRadius: 10,
+  padding: "10px 12px",
+  fontSize: 14,
+  fontFamily: "inherit",
+  outline: "none",
+  cursor: "pointer"
+};
+function TikTokCaptionField({
+  value,
+  onChange,
+  postType,
+  placeholder = "Describe your post\u2026",
+  className,
+  style
+}) {
+  const id = react.useId();
+  const max = js.captionMaxFor(postType);
+  const count = value.length;
+  const over = count > max;
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className, style: { ...wrapStyle3, ...style }, children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { style: labelRowStyle, children: [
+      /* @__PURE__ */ jsxRuntime.jsx("label", { htmlFor: id, style: labelStyle, children: "Caption" }),
+      /* @__PURE__ */ jsxRuntime.jsxs(
+        "span",
+        {
+          style: {
+            ...countStyle,
+            color: over ? varRef2(TT_VAR.accent) : varRef2(TT_VAR.muted)
+          },
+          children: [
+            count.toLocaleString(),
+            " / ",
+            max.toLocaleString()
+          ]
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "textarea",
+      {
+        id,
+        value,
+        onChange: (e) => onChange(e.target.value),
+        placeholder,
+        rows: 4,
+        style: {
+          ...textareaStyle,
+          borderColor: over ? varRef2(TT_VAR.accent) : varRef2(TT_VAR.border)
+        }
+      }
+    )
+  ] });
+}
+var wrapStyle3 = {
+  display: "flex",
+  flexDirection: "column",
+  gap: 6,
+  fontFamily: '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif'
+};
+var labelRowStyle = {
+  display: "flex",
+  alignItems: "baseline",
+  justifyContent: "space-between"
+};
+var labelStyle = {
+  fontSize: 13,
+  fontWeight: 600,
+  color: "inherit"
+};
+var countStyle = {
+  fontSize: 12,
+  fontVariantNumeric: "tabular-nums"
+};
+var textareaStyle = {
+  width: "100%",
+  resize: "vertical",
+  background: "transparent",
+  color: "inherit",
+  border: "1px solid rgba(255,255,255,0.14)",
+  borderRadius: 10,
+  padding: "10px 12px",
+  fontSize: 14,
+  lineHeight: 1.4,
+  fontFamily: "inherit",
+  outline: "none",
+  boxSizing: "border-box"
+};
+function CommercialDisclosure({
+  value,
+  onChange
+}) {
+  const labelNotice = js.commercialLabelNotice(value);
+  const incomplete = js.commercialDisclosureIncomplete(value);
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", flexDirection: "column", gap: 8 }, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(SectionLabel, { children: "Disclose post content" }),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      Row,
+      {
+        label: "Disclose commercial content",
+        sublabel: "Turn on if this post promotes a brand, product, or service.",
+        control: /* @__PURE__ */ jsxRuntime.jsx(
+          Switch,
+          {
+            checked: value.commercial_disclosure,
+            ariaLabel: "Disclose commercial content",
+            onChange: (next) => onChange(js.setCommercialDisclosure(value, next))
+          }
+        )
+      }
+    ),
+    value.commercial_disclosure ? /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", flexDirection: "column", gap: 8, paddingLeft: 2 }, children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        CheckRow,
+        {
+          label: "Your brand",
+          checked: value.your_brand,
+          onChange: (next) => onChange(js.setBrandKind(value, "your_brand", next))
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        CheckRow,
+        {
+          label: "Branded content",
+          checked: value.branded_content,
+          onChange: (next) => onChange(js.setBrandKind(value, "branded_content", next))
+        }
+      ),
+      incomplete ? /* @__PURE__ */ jsxRuntime.jsx(Hint, { children: js.TIKTOK_DISCLOSURE_REQUIRED_HINT }) : null,
+      labelNotice ? /* @__PURE__ */ jsxRuntime.jsx(Notice, { children: labelNotice }) : null
+    ] }) : null
+  ] });
+}
+function Declaration({ brandedContent }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("p", { style: declarationStyle, children: [
+    "By posting, you agree to TikTok's",
+    " ",
+    brandedContent ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(DeclarationLink, { href: js.TIKTOK_BRANDED_CONTENT_POLICY_URL, children: "Branded Content Policy" }),
+      " ",
+      "and",
+      " "
+    ] }) : null,
+    /* @__PURE__ */ jsxRuntime.jsx(DeclarationLink, { href: js.TIKTOK_MUSIC_CONFIRMATION_URL, children: "Music Usage Confirmation" }),
+    "."
+  ] });
+}
+function DeclarationLink({ href, children }) {
+  return /* @__PURE__ */ jsxRuntime.jsx("a", { href, target: "_blank", rel: "noreferrer", style: linkStyle2, children });
+}
+var declarationStyle = {
+  margin: 0,
+  fontSize: 12,
+  color: TOKENS.MUTED,
+  lineHeight: 1.45
+};
+var linkStyle2 = {
+  color: "inherit",
+  textDecoration: "underline"
+};
+function InteractionToggles({
+  creatorInfo,
+  value,
+  onChange,
+  isVideo
+}) {
+  const rows = js.interactionRows(creatorInfo, isVideo);
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", flexDirection: "column", gap: 8 }, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(SectionLabel, { children: "Allow users to" }),
+    rows.map((row) => {
+      const on = Boolean(value[js.interactionValueKey(row.key)]);
+      return /* @__PURE__ */ jsxRuntime.jsx(
+        Row,
+        {
+          label: row.label,
+          sublabel: row.disabled ? "Turned off by this creator" : void 0,
+          control: /* @__PURE__ */ jsxRuntime.jsx(
+            Switch,
+            {
+              checked: !row.disabled && on,
+              disabled: row.disabled,
+              ariaLabel: `Allow ${row.label}`,
+              onChange: (next) => onChange(js.toggleInteraction(value, row.key, next))
+            }
+          )
+        },
+        row.key
+      );
+    })
+  ] });
+}
+function mediaCountValid(postType, count) {
+  if (postType === "carousel") {
+    return count >= 2 && count <= 35;
+  }
+  return count === 1;
+}
+function TikTokPublishPanel({
+  variant,
+  creatorInfo,
+  caption,
+  onCaptionChange,
+  options,
+  onOptionsChange,
+  onPost,
+  posting = false,
+  theme = "auto",
+  className,
+  style
+}) {
+  const dark = useIsDark2(theme);
+  const isVideo = variant.post_type === "video";
+  const captionOver = caption.length > js.captionMaxFor(variant.post_type);
+  const mediaOk = mediaCountValid(variant.post_type, variant.media?.length ?? 0);
+  const ready = !captionOver && mediaOk && js.tiktokOptionsReady(options);
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      className,
+      style: {
+        ...paletteVars2(dark),
+        ...panelStyle,
+        color: varRef2(TT_VAR.text),
+        ...style
+      },
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          TikTokCaptionField,
+          {
+            value: caption,
+            onChange: onCaptionChange,
+            postType: variant.post_type
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(Divider, {}),
+        /* @__PURE__ */ jsxRuntime.jsx(AudienceSelect, { creatorInfo, value: options, onChange: onOptionsChange }),
+        /* @__PURE__ */ jsxRuntime.jsx(Divider, {}),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          InteractionToggles,
+          {
+            creatorInfo,
+            value: options,
+            onChange: onOptionsChange,
+            isVideo
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(Divider, {}),
+        /* @__PURE__ */ jsxRuntime.jsx(CommercialDisclosure, { value: options, onChange: onOptionsChange }),
+        isVideo ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(Divider, {}),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            Row,
+            {
+              label: "AI-generated content",
+              sublabel: "Disclose if this video was created or substantially edited with AI.",
+              control: /* @__PURE__ */ jsxRuntime.jsx(
+                Switch,
+                {
+                  checked: options.aigc,
+                  ariaLabel: "AI-generated content",
+                  onChange: (next) => onOptionsChange({ ...options, aigc: next })
+                }
+              )
+            }
+          )
+        ] }) : null,
+        /* @__PURE__ */ jsxRuntime.jsx(Divider, {}),
+        /* @__PURE__ */ jsxRuntime.jsx(Notice, { children: js.TIKTOK_PROCESSING_NOTICE }),
+        /* @__PURE__ */ jsxRuntime.jsx(Declaration, { brandedContent: js.brandedContentDeclared(options) }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "button",
+          {
+            type: "button",
+            disabled: !ready || posting,
+            onClick: onPost,
+            style: {
+              ...postButtonStyle,
+              opacity: !ready || posting ? 0.5 : 1,
+              cursor: !ready || posting ? "not-allowed" : "pointer"
+            },
+            children: posting ? "Posting\u2026" : "Post"
+          }
+        )
+      ]
+    }
+  );
+}
+function Divider() {
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { style: dividerStyle });
+}
+var panelStyle = {
+  display: "flex",
+  flexDirection: "column",
+  gap: 16,
+  width: "100%",
+  fontFamily: '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif'
+};
+var dividerStyle = {
+  height: 1,
+  background: TOKENS.BORDER
+};
+var postButtonStyle = {
+  width: "100%",
+  border: 0,
+  borderRadius: 10,
+  background: TOKENS.ACCENT,
+  color: "#fff",
+  fontSize: 15,
+  fontWeight: 600,
+  padding: "12px 16px",
+  transition: "opacity 160ms ease"
+};
 
+Object.defineProperty(exports, "TIKTOK_CAPTION_MAX", {
+  enumerable: true,
+  get: function () { return js.TIKTOK_CAPTION_MAX; }
+});
+Object.defineProperty(exports, "captionMaxFor", {
+  enumerable: true,
+  get: function () { return js.captionMaxFor; }
+});
+exports.ArticleCard = ArticleCard;
+exports.AudienceSelect = AudienceSelect;
+exports.CommercialDisclosure = CommercialDisclosure;
 exports.Connect = Connect;
+exports.Declaration = Declaration;
+exports.DocumentCard = DocumentCard;
+exports.InteractionToggles = InteractionToggles;
 exports.LinkedInPostPreview = LinkedInPostPreview;
+exports.Poll = Poll;
 exports.PostrunProvider = PostrunProvider;
+exports.TikTokCaptionField = TikTokCaptionField;
+exports.TikTokPostPreview = TikTokPostPreview;
+exports.TikTokPublishPanel = TikTokPublishPanel;
 exports.UploadError = UploadError;
 exports.XPostPreview = XPostPreview;
 exports.connectionKeys = connectionKeys;