@flonix/ig-embed 0.0.0-stage → 0.1.0

package/dist/index.d.ts

@@ -0,0 +1,199 @@
+/** shadcn-style design tokens. Every value is a raw CSS color string so a
+ *  host can pass any format (hex, rgb(), hsl(), oklch(), var(), …). */
+interface ThemeTokens {
+    background: string;
+    foreground: string;
+    card: string;
+    cardForeground: string;
+    popover: string;
+    popoverForeground: string;
+    primary: string;
+    primaryForeground: string;
+    secondary: string;
+    secondaryForeground: string;
+    muted: string;
+    mutedForeground: string;
+    accent: string;
+    accentForeground: string;
+    destructive: string;
+    destructiveForeground: string;
+    border: string;
+    input: string;
+    ring: string;
+}
+type ThemeMode = "light" | "dark" | "auto";
+interface ThemeConfig {
+    /** `auto` follows the host's `prefers-color-scheme`. Default: `auto`. */
+    mode?: ThemeMode;
+    /** CSS font-family stack. Default: Flonix font. */
+    fontFamily?: string;
+    /** Base corner radius, any CSS length. Default: `12px`. */
+    radius?: string;
+    /** Per-mode token overrides. Anything omitted falls back to Flonix defaults. */
+    tokens?: {
+        light?: Partial<ThemeTokens>;
+        dark?: Partial<ThemeTokens>;
+    };
+}
+/** The end-user inside the host platform (e.g. a partner merchant). */
+interface FlonixUser {
+    id: string;
+    email?: string;
+    name?: string;
+}
+/**
+ * Partner co-branding. The logo is shown next to the Flonix mark as
+ * "<partner logo> × flonix".
+ *
+ * `logo` / `logoDark` accept any image — an https URL or a data URI, in any
+ * format (SVG, PNG, WebP…). The logo is displayed at **18px height, width auto
+ * (max 120px)**, so supply a transparent-background asset ideally ~2× that
+ * (≈40px tall / SVG) for a crisp result.
+ */
+interface PartnerBranding {
+    /** Partner/brand name — used as the logo's alt text. */
+    name: string;
+    /** Logo shown in light theme (and dark, if `logoDark` is omitted). */
+    logo: string;
+    /** Optional logo variant for dark theme. Falls back to `logo`. */
+    logoDark?: string;
+}
+interface InstagramAccount {
+    instagramId: string | null;
+    username: string | null;
+}
+type MediaType = "IMAGE" | "VIDEO" | "CAROUSEL" | "REELS";
+interface InstagramPost {
+    id: string;
+    caption: string | null;
+    media: string | null;
+    mediaType: MediaType;
+    permalink?: string | null;
+    timestamp?: string | null;
+}
+type AutomationType = "COMMENT" | "DM";
+/** A link button delivered in the DM (label + destination URL). Max 3. */
+interface LinkButton {
+    label: string;
+    url: string;
+}
+declare const MAX_LINK_BUTTONS = 3;
+interface FollowGateConfig {
+    enabled: boolean;
+    followProfileUrl: string;
+    followButtonLabel: string;
+    followConfirmButtonLabel: string;
+    followUpMessage: string;
+}
+interface CreateAutomationInput {
+    postId: string;
+    type: AutomationType;
+    name: string;
+    /** Trigger keywords (comment text / DM text). */
+    keywords: string[];
+    /** Public reply posted under the comment (COMMENT automations). */
+    commentReply: string | null;
+    /** Label on the opt-in button of the first DM. */
+    entryButtonLabel: string;
+    /** The DM delivered to the user. */
+    deliveryMessage: string;
+    /** Up to MAX_LINK_BUTTONS link buttons delivered with the DM. */
+    linkButtons: LinkButton[];
+    followGate: FollowGateConfig;
+}
+interface SessionResponse {
+    connected: boolean;
+    token: string;
+    account: InstagramAccount | null;
+}
+interface ConnectStartResponse {
+    authorizeUrl: string;
+}
+interface PostsResponse {
+    posts: InstagramPost[];
+    nextCursor: string | null;
+}
+interface CreateAutomationResponse {
+    id: string;
+}
+/** Transport abstraction. The real implementation hits `/api/embed/*`;
+ *  the demo injects a mock. */
+interface Transport {
+    session(input: {
+        apiKey: string;
+        user: FlonixUser;
+    }): Promise<SessionResponse>;
+    connectStart(input: {
+        token: string;
+        returnUrl: string;
+    }): Promise<ConnectStartResponse>;
+    posts(input: {
+        token: string;
+        cursor: string | null;
+    }): Promise<PostsResponse>;
+    createAutomation(input: {
+        token: string;
+        data: CreateAutomationInput;
+    }): Promise<CreateAutomationResponse>;
+}
+interface FlonixIGConfig {
+    /** Org API key issued from the Flonix admin dashboard. */
+    apiKey: string;
+    /** The host platform's end-user. `id` must be stable per merchant. */
+    user: FlonixUser;
+    /** Co-branding (required): renders "<partner logo> × flonix". */
+    partner: PartnerBranding;
+    /** Flonix base URL. Default: `https://flonix.pro`. */
+    baseUrl?: string;
+    /** Where Instagram OAuth returns to. Default: current page URL. */
+    returnUrl?: string;
+    /** Theme + branding customization. */
+    theme?: ThemeConfig;
+    onConnected?: (account: InstagramAccount) => void;
+    onAutomationCreated?: (automation: CreateAutomationResponse) => void;
+    onError?: (error: Error) => void;
+    /** Advanced/testing: inject a custom transport (the demo uses this). */
+    transport?: Transport;
+}
+interface FlonixIGInstance {
+    /** Re-fetch session + posts. */
+    refresh(): void;
+    /** Tear down the widget and detach from the DOM. */
+    unmount(): void;
+}
+
+interface MockOptions {
+    /** Pages of posts to serve before stopping. Default 3. */
+    totalPages?: number;
+    /** Posts per page. Default 8. */
+    perPage?: number;
+    /** localStorage key suffix so multiple demos don't collide. */
+    namespace?: string;
+}
+declare function createMockTransport(options?: MockOptions): Transport;
+
+declare function createHttpTransport(baseUrl: string): Transport;
+
+/** Flonix brand defaults for both color schemes. Hosts override any subset. */
+declare const DEFAULT_TOKENS: {
+    light: ThemeTokens;
+    dark: ThemeTokens;
+};
+
+declare const version = "0.1.0";
+/**
+ * Mount the Flonix Instagram automation widget into a container.
+ *
+ * @example
+ *   FlonixIG.mount("#flonix", {
+ *     apiKey: "flxig.…",
+ *     user: { id: "merchant_42", email: "me@shop.com" },
+ *   })
+ */
+declare function mount(target: string | HTMLElement, config: FlonixIGConfig): FlonixIGInstance;
+declare const FlonixIG: {
+    mount: typeof mount;
+    version: string;
+};
+
+export { type AutomationType, type ConnectStartResponse, type CreateAutomationInput, type CreateAutomationResponse, DEFAULT_TOKENS, FlonixIG, type FlonixIGConfig, type FlonixIGInstance, type FlonixUser, type FollowGateConfig, type InstagramAccount, type InstagramPost, type LinkButton, MAX_LINK_BUTTONS, type MediaType, type PartnerBranding, type PostsResponse, type SessionResponse, type ThemeConfig, type ThemeMode, type ThemeTokens, type Transport, createHttpTransport, createMockTransport, mount, version };