> ## Documentation Index
> Fetch the complete documentation index at: https://docs.useparagon.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Box

> Connect to your users Box accounts

export const IntegrationsCompatibility = ({workflows = true, actionkit = false, proxy = true, managedSync = false, authType = "Basic Auth", integrationName: integrationNameProp, integrationSlug: integrationSlugProp}) => {
  const FEATURE_REQUEST_ENDPOINT = "https://agosnlmllwykglihfhiw.supabase.co/functions/v1/handle-vote";
  const FEATURE_REQUEST_HEADERS = {
    "Content-Type": "application/json",
    "Authorization": `Bearer sb_publishable_DlIzCjWe8NiqjZnLziegbg_P-w5L9X4`,
    'apikey': `sb_pubishable_DlIzCjWe8NiqjZnLziegbg_P-w5L9X4`
  };
  const SESSION_VOTE_PREFIX = "paragon_compat_vote:";
  const PURPLE = "rgb(102, 69, 230)";
  const slugifyFeature = label => label.toLowerCase().replace(/\s+/g, "-").replace(/[^a-z0-9-]/g, "");
  const integrationKeyFromPathname = pathname => {
    if (!pathname) return "";
    const match = pathname.match(/\/(?:resources\/)?integrations\/([^/?#]+)/);
    return match ? decodeURIComponent(match[1]).replace(/\/$/, "") : "";
  };
  const voteStorageKey = (integrationKey, featureKey) => `${SESSION_VOTE_PREFIX}${integrationKey}:${featureKey}`;
  const readVoteFromStorage = (integrationKey, featureKey) => {
    if (typeof sessionStorage === "undefined") return false;
    try {
      return sessionStorage.getItem(voteStorageKey(integrationKey, featureKey)) === "1";
    } catch {
      return false;
    }
  };
  const writeVoteToStorage = (integrationKey, featureKey) => {
    try {
      sessionStorage.setItem(voteStorageKey(integrationKey, featureKey), "1");
    } catch {}
  };
  const readPageTitleFallback = () => {
    if (typeof document === "undefined") return "";
    const h1 = document.querySelector("article h1") || document.querySelector("main h1") || document.querySelector('[class*="title"] h1') || document.querySelector("h1");
    const text = h1?.textContent?.trim();
    return text || "";
  };
  const getRuntimeConfig = () => {
    if (typeof window === "undefined") return null;
    return window.__PARAGON_FEATURE_REQUEST__ ?? null;
  };
  const resolveEndpoint = () => {
    const rt = getRuntimeConfig();
    if (rt?.endpoint) return String(rt.endpoint).trim();
    return String(FEATURE_REQUEST_ENDPOINT || "").trim();
  };
  const resolveHeaders = () => {
    const rt = getRuntimeConfig();
    const base = {
      ...FEATURE_REQUEST_HEADERS,
      ...rt?.headers && typeof rt.headers === "object" ? rt.headers : {}
    };
    return base;
  };
  const isValidEmail = s => (/^[^\s@]+@[^\s@]+\.[^\s@]+$/).test(String(s).trim());
  const renderCompatCheckSvg = (sizePx = 18) => <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640" fill={PURPLE} style={{
    width: `${sizePx}px`,
    height: `${sizePx}px`,
    flexShrink: 0,
    display: "block",
    verticalAlign: "middle"
  }} aria-hidden>
      <path d="M320 576C178.6 576 64 461.4 64 320C64 178.6 178.6 64 320 64C461.4 64 576 178.6 576 320C576 461.4 461.4 576 320 576zM438 209.7C427.3 201.9 412.3 204.3 404.5 215L285.1 379.2L233 327.1C223.6 317.7 208.4 317.7 199.1 327.1C189.8 336.5 189.7 351.7 199.1 361L271.1 433C276.1 438 282.9 440.5 289.9 440C296.9 439.5 303.3 435.9 307.4 430.2L443.3 243.2C451.1 232.5 448.7 217.5 438 209.7z" />
    </svg>;
  const inlineFieldReadonlyStyle = {
    width: "100%",
    boxSizing: "border-box",
    padding: "10px 12px",
    borderRadius: "8px",
    border: "1px solid rgba(0, 0, 0, 0.08)",
    backgroundColor: "rgba(250, 248, 245, 0.95)",
    fontSize: "14px",
    color: "rgba(35, 35, 38, 0.95)"
  };
  const inlineFieldEditableStyle = {
    width: "100%",
    boxSizing: "border-box",
    padding: "10px 12px",
    borderRadius: "8px",
    border: "1px solid rgba(0, 0, 0, 0.15)",
    backgroundColor: "#fff",
    fontSize: "14px",
    fontFamily: "inherit"
  };
  const products = useMemo(() => [{
    label: "ActionKit",
    value: actionkit
  }, {
    label: "Managed Sync",
    value: managedSync
  }, {
    label: "Workflows",
    value: workflows
  }, {
    label: "Proxy API",
    value: proxy
  }, {
    label: "Auth Type",
    value: authType
  }], [actionkit, managedSync, workflows, proxy, authType]);
  const [mounted, setMounted] = useState(false);
  const [resolvedIntegrationKey, setResolvedIntegrationKey] = useState(() => integrationSlugProp?.trim() || "");
  const [resolvedDisplayName, setResolvedDisplayName] = useState(() => integrationNameProp?.trim() || "Integration");
  const [inlineFormOpen, setInlineFormOpen] = useState(false);
  const [formFeature, setFormFeature] = useState({
    featureLabel: "",
    featureKey: ""
  });
  const [email, setEmail] = useState("");
  const [description, setDescription] = useState("");
  const [submitting, setSubmitting] = useState(false);
  const [submitError, setSubmitError] = useState("");
  const [voteClickError, setVoteClickError] = useState("");
  const [voteLogging, setVoteLogging] = useState(false);
  const [loggingFeatureKey, setLoggingFeatureKey] = useState("");
  const [, bumpVoteUi] = useState(0);
  const inlineCardRef = useRef(null);
  useEffect(() => {
    setMounted(true);
    const path = typeof window !== "undefined" ? window.location.pathname : "";
    const fromPath = integrationSlugProp?.trim() || integrationKeyFromPathname(path);
    setResolvedIntegrationKey(fromPath);
    const fromDom = readPageTitleFallback();
    const name = integrationNameProp?.trim() || fromDom || (fromPath ? fromPath.replace(/-/g, " ") : "Integration");
    setResolvedDisplayName(name);
  }, [integrationNameProp, integrationSlugProp]);
  const dismissInlineForm = useCallback(() => {
    setInlineFormOpen(false);
    setSubmitError("");
  }, []);
  const handleRequestClick = useCallback(async ({featureLabel, featureKey}) => {
    setVoteClickError("");
    const integrationKey = resolvedIntegrationKey || integrationKeyFromPathname(typeof window !== "undefined" ? window.location.pathname : "");
    if (!integrationKey) {
      setVoteClickError("Could not determine integration. Set the integrationSlug prop on this page.");
      return;
    }
    if (readVoteFromStorage(integrationKey, featureKey)) {
      return;
    }
    setLoggingFeatureKey(featureKey);
    setVoteLogging(true);
    const votedAt = new Date().toISOString();
    const ctaPayload = {
      integration_key: integrationKey,
      integration_name: resolvedDisplayName,
      feature_key: featureKey,
      feature_label: featureLabel,
      vote_phase: "cta_click",
      voted_at: votedAt
    };
    try {
      const endpoint = resolveEndpoint();
      if (endpoint) {
        const res = await fetch(endpoint, {
          method: "POST",
          headers: resolveHeaders(),
          body: JSON.stringify(ctaPayload)
        });
        if (!res.ok) {
          const text = await res.text().catch(() => "");
          throw new Error(text || `Request failed (${res.status})`);
        }
      } else if (typeof console !== "undefined" && console.warn) {
        console.warn("[IntegrationsCompatibility] FEATURE_REQUEST_ENDPOINT is empty; vote not sent. Set endpoint or window.__PARAGON_FEATURE_REQUEST__.");
      }
      writeVoteToStorage(integrationKey, featureKey);
      bumpVoteUi(v => v + 1);
      setFormFeature({
        featureLabel,
        featureKey
      });
      setEmail("");
      setDescription("");
      setSubmitError("");
      setInlineFormOpen(true);
    } catch (err) {
      setVoteClickError(err instanceof Error ? err.message : "Could not log your vote. Please try again.");
    } finally {
      setVoteLogging(false);
      setLoggingFeatureKey("");
    }
  }, [resolvedIntegrationKey, resolvedDisplayName]);
  useEffect(() => {
    if (!inlineFormOpen) return undefined;
    const id = window.setTimeout(() => {
      inlineCardRef.current?.scrollIntoView?.({
        behavior: "smooth",
        block: "nearest"
      });
    }, 80);
    return () => window.clearTimeout(id);
  }, [inlineFormOpen]);
  const submitEnrichment = useCallback(async () => {
    const trimmed = email.trim();
    if (!isValidEmail(trimmed)) {
      setSubmitError("Please enter a valid work email.");
      return;
    }
    const integrationKey = resolvedIntegrationKey || integrationKeyFromPathname(typeof window !== "undefined" ? window.location.pathname : "");
    if (!integrationKey) {
      setSubmitError("Could not determine integration. Set the integrationSlug prop on this page.");
      return;
    }
    const {featureKey, featureLabel} = formFeature;
    const endpoint = resolveEndpoint();
    const enrichedAt = new Date().toISOString();
    const payload = {
      integration_key: integrationKey,
      integration_name: resolvedDisplayName,
      feature_key: featureKey,
      feature_label: featureLabel,
      vote_phase: "enrichment",
      email: trimmed,
      description: description.trim() || undefined,
      voted_at: enrichedAt,
      enriched_at: enrichedAt
    };
    setSubmitting(true);
    setSubmitError("");
    try {
      if (endpoint) {
        const res = await fetch(endpoint, {
          method: "POST",
          headers: resolveHeaders(),
          body: JSON.stringify(payload)
        });
        if (!res.ok) {
          const text = await res.text().catch(() => "");
          throw new Error(text || `Request failed (${res.status})`);
        }
      } else if (typeof console !== "undefined" && console.warn) {
        console.warn("[IntegrationsCompatibility] FEATURE_REQUEST_ENDPOINT is empty; enrichment not sent. Set endpoint or window.__PARAGON_FEATURE_REQUEST__.");
      }
      setInlineFormOpen(false);
      setEmail("");
      setDescription("");
    } catch (err) {
      setSubmitError(err instanceof Error ? err.message : "Something went wrong. Please try again.");
    } finally {
      setSubmitting(false);
    }
  }, [email, description, formFeature, resolvedDisplayName, resolvedIntegrationKey]);
  const renderCompatProductCell = ({product, integrationKey, onRequestClick, alignWide, voteLogging, loggingFeatureKey}) => {
    const isAuthType = product.label === "Auth Type";
    const href = typeof product.value === "string" && !isAuthType ? product.value : null;
    const featureKey = slugifyFeature(product.label);
    const alreadyVoted = !isAuthType && integrationKey && !href && !product.value ? readVoteFromStorage(integrationKey, featureKey) : false;
    const unsupported = !isAuthType && !href && !product.value;
    const compatPillStyle = {
      display: "inline-flex",
      alignItems: "center",
      justifyContent: "center",
      gap: "4px",
      boxSizing: "border-box",
      minHeight: "32px",
      padding: "6px 12px",
      borderRadius: "999px",
      border: "1px solid rgba(0, 0, 0, 0.12)",
      backgroundColor: "rgba(250, 250, 249, 1)",
      fontSize: "12px",
      fontWeight: 500,
      color: "rgba(35, 35, 38, 1)",
      fontFamily: "inherit",
      lineHeight: 1.2,
      width: "auto"
    };
    const cellInner = isAuthType ? product.value : href ? <a href={href} className="compat-pill" style={{
      ...compatPillStyle,
      textDecoration: "none"
    }}>
        {renderCompatCheckSvg(14)}
        <span>Docs</span>
      </a> : product.value ? renderCompatCheckSvg() : alreadyVoted ? <span style={{
      fontSize: "12px",
      fontWeight: 500,
      color: "rgba(55, 55, 58, 0.85)"
    }}>Requested</span> : <button type="button" className="compat-pill" disabled={voteLogging && loggingFeatureKey === featureKey} onClick={() => onRequestClick({
      featureLabel: product.label,
      featureKey
    })} style={{
      ...compatPillStyle,
      margin: 0,
      cursor: voteLogging && loggingFeatureKey === featureKey ? "not-allowed" : "pointer",
      opacity: voteLogging && loggingFeatureKey === featureKey ? 0.65 : 1
    }}>
        <span style={{
      color: PURPLE,
      fontSize: "14px",
      fontWeight: 600,
      lineHeight: 1
    }} aria-hidden>
          +
        </span>
        {voteLogging && loggingFeatureKey === featureKey ? "…" : "Request"}
      </button>;
    if (alignWide) {
      return <div style={{
        fontSize: "13px",
        padding: "8px 8px",
        minHeight: unsupported || alreadyVoted ? "40px" : undefined,
        display: "flex",
        alignItems: "center",
        justifyContent: "center"
      }}>
          {cellInner}
        </div>;
    }
    return <span style={{
      fontSize: "13px",
      width: "auto",
      textAlign: "center",
      display: "inline-block"
    }}>{cellInner}</span>;
  };
  return <div style={{
    backgroundColor: "transparent",
    border: "0px solid rgba(225, 225, 229, 1)",
    borderRadius: "12px",
    padding: "0px 0px",
    overflow: "hidden"
  }}>
      <style>{`
        .compat-wide { display: flex; }
        .compat-narrow { display: none; }
        @media (max-width: 640px) {
          .compat-wide { display: none !important; }
          .compat-narrow { display: flex !important; }
        }
        .compat-pill {
          transition: box-shadow 0.15s ease;
        }
        .compat-pill:hover:not(:disabled) {
          box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
        }
      `}</style>

      <div style={{
    fontSize: "15px",
    fontWeight: 600,
    marginBottom: "16px"
  }}>Product Compatibility</div>

      <div className="compat-wide" style={{
    flexDirection: "row",
    gap: "0px"
  }}>
        {products.map(f => <div key={f.label} style={{
    flex: 1,
    minWidth: 0,
    textAlign: "center"
  }}>
            <div style={{
    fontSize: "13px",
    fontWeight: 500,
    padding: "6px 8px",
    borderBottom: "1px solid rgba(102, 69, 230, 0.15)",
    overflow: "hidden",
    textOverflow: "ellipsis",
    whiteSpace: "nowrap"
  }}>
              {f.label}
            </div>
            {renderCompatProductCell({
    product: f,
    integrationKey: mounted ? resolvedIntegrationKey : "",
    onRequestClick: handleRequestClick,
    alignWide: true,
    voteLogging,
    loggingFeatureKey
  })}
          </div>)}
      </div>

      <div className="compat-narrow" style={{
    flexDirection: "column",
    gap: "0px"
  }}>
        <div style={{
    display: "flex",
    justifyContent: "space-between",
    borderBottom: "1px solid rgba(102, 69, 230, 0.15)",
    padding: "6px 0"
  }}>
          <span style={{
    fontSize: "13px",
    fontWeight: 500
  }}>Product</span>
          <span style={{
    fontSize: "13px",
    fontWeight: 500,
    width: "80px",
    textAlign: "center"
  }}>Supported</span>
        </div>
        {products.map(f => <div key={f.label} style={{
    display: "flex",
    justifyContent: "space-between",
    alignItems: "center",
    padding: "5px 0"
  }}>
            <span style={{
    fontSize: "13px"
  }}>{f.label}</span>
            {renderCompatProductCell({
    product: f,
    integrationKey: mounted ? resolvedIntegrationKey : "",
    onRequestClick: handleRequestClick,
    alignWide: false,
    voteLogging,
    loggingFeatureKey
  })}
          </div>)}
      </div>

      {voteClickError ? <p style={{
    margin: "16px 0 0",
    fontSize: "13px",
    color: "#b42318"
  }} role="alert">
          {voteClickError}
        </p> : null}

      {inlineFormOpen ? <div ref={inlineCardRef} role="region" aria-labelledby="compat-feature-request-title" style={{
    marginTop: "24px",
    width: "100%",
    boxSizing: "border-box",
    backgroundColor: "#fff",
    borderRadius: "16px",
    border: "1px solid rgba(0, 0, 0, 0.1)",
    boxShadow: "0 8px 24px rgba(0,0,0,0.06)",
    padding: "24px"
  }}>
          <div style={{
    display: "flex",
    flexDirection: "row",
    alignItems: "center",
    justifyContent: "space-between",
    gap: "12px",
    marginBottom: "16px"
  }}>
            <div style={{
    display: "inline-flex",
    alignItems: "center",
    gap: "6px",
    padding: "6px 10px",
    borderRadius: "8px",
    backgroundColor: "rgba(102, 69, 230, 0.12)",
    border: "1px solid rgba(102, 69, 230, 0.35)",
    color: PURPLE,
    fontSize: "12px",
    fontWeight: 600
  }}>
              Feature request
            </div>
            <button type="button" onClick={dismissInlineForm} disabled={submitting} aria-label="Close feature request form" style={{
    flexShrink: 0,
    display: "inline-flex",
    alignItems: "center",
    justifyContent: "center",
    width: "36px",
    height: "36px",
    margin: 0,
    padding: 0,
    borderRadius: "8px",
    background: "#fff",
    color: "rgba(35, 35, 38, 0.75)",
    fontSize: "24px",
    lineHeight: 1,
    cursor: submitting ? "not-allowed" : "pointer",
    fontFamily: "inherit"
  }}>
              <span aria-hidden>×</span>
            </button>
          </div>
          <h2 id="compat-feature-request-title" style={{
    margin: "0 0 16px",
    fontSize: "20px",
    fontWeight: 700,
    color: "#111"
  }}>
            Request support for {formFeature.featureLabel}
          </h2>
          <p style={{
    display: "block",
    margin: "0 0 20px",
    fontSize: "14px",
    color: "rgba(55, 55, 58, 0.72)",
    lineHeight: 1.5
  }}>
            Your vote has been recorded. Add your email and an optional note and we'll notify you when support is added.
          </p>

          <div style={{
    display: "flex",
    flexDirection: "column",
    gap: "16px"
  }}>
            <label style={{
    display: "flex",
    flexDirection: "column",
    gap: "6px",
    fontSize: "13px",
    fontWeight: 500,
    color: "#333"
  }}>
              Integration
              <input type="text" readOnly value={resolvedDisplayName} style={inlineFieldReadonlyStyle} tabIndex={-1} />
            </label>
            <label style={{
    display: "flex",
    flexDirection: "column",
    gap: "6px",
    fontSize: "13px",
    fontWeight: 500,
    color: "#333"
  }}>
              Feature
              <input type="text" readOnly value={formFeature.featureLabel} style={inlineFieldReadonlyStyle} tabIndex={-1} />
            </label>
            <label style={{
    display: "flex",
    flexDirection: "column",
    gap: "6px",
    fontSize: "13px",
    fontWeight: 500,
    color: "#333"
  }}>
              Work email
              <input type="email" name="email" autoComplete="email" placeholder="you@company.com" value={email} onChange={e => setEmail(e.target.value)} style={inlineFieldEditableStyle} disabled={submitting} />
            </label>
            <label style={{
    display: "flex",
    flexDirection: "column",
    gap: "6px",
    fontSize: "13px",
    fontWeight: 500,
    color: "#333"
  }}>
              Describe your use case (optional)
              <textarea placeholder="What would you build if this were supported?" value={description} onChange={e => setDescription(e.target.value)} rows={4} style={{
    ...inlineFieldEditableStyle,
    resize: "vertical",
    minHeight: "96px"
  }} disabled={submitting} />
            </label>
          </div>

          {submitError ? <p style={{
    margin: "14px 0 0",
    fontSize: "13px",
    color: "#b42318"
  }} role="alert">
              {submitError}
            </p> : null}

          <div style={{
    display: "flex",
    justifyContent: "flex-end",
    gap: "10px",
    marginTop: "22px",
    flexWrap: "wrap"
  }}>
            <button type="button" onClick={submitEnrichment} disabled={submitting} style={{
    padding: "10px 16px",
    borderRadius: "8px",
    border: "1px solid rgba(0, 0, 0, 0.15)",
    background: "#fff",
    fontSize: "14px",
    fontWeight: 700,
    cursor: submitting ? "not-allowed" : "pointer",
    fontFamily: "inherit"
  }}>
              {submitting ? "Submitting…" : "Submit details"}
            </button>
          </div>
        </div> : null}
    </div>;
};

<IntegrationsCompatibility workflows={true} actionkit="/actionkit/integrations/box" proxy={true} managedSync="/managed-sync/integrations/box" authType="OAuth2" />

## Setup Guide

You can find your Box app credentials in your [Box Developer Account.](https://developer.box.com/reference/)

You'll need the following information to set up your Box App with Paragon Connect:

* Client ID
* Client Secret
* Scopes Requested

### Add your Box app to Paragon

Under **Integrations > Connected Integrations > Box > App Configuration > Configure**, fill out your credentials from your developer app in their respective sections:

* **Client ID:** Found under Client ID on your Box App page.
* **Client Secret:** Found under Client Secret on your Box App page.
* **Permissions:** Select the scopes you've requested for your application. For a list of recommended scopes, please view this integration within your Paragon dashboard. [View dashboard.](https://dashboard.useparagon.com)

<Info>
  Leaving the Client ID and Client Secret blank will use Paragon development
  keys.
</Info>

<Frame>
  <img src="https://mintcdn.com/paragon/JtnB3_DeUOyB_qxZ/assets/Connecting%20your%20Box%20app%20to%20Paragon%20Connect.png?fit=max&auto=format&n=JtnB3_DeUOyB_qxZ&q=85&s=05a61c4fc720e4e77e7697a39cf4bab3" alt="" width="2176" height="1162" data-path="assets/Connecting your Box app to Paragon Connect.png" />
</Frame>

## Connecting to Box

Once your users have connected their Box account, you can use the Paragon SDK to access the Box API on behalf of connected users.

See the Box [REST API documentation](https://developer.box.com/reference/) for their full API reference.

Any Box API endpoints can be accessed with the Paragon SDK as shown in this example.

```js theme={null}
// You can find your project ID in the Overview tab of any Integration

// Authenticate the user
paragon.authenticate(<ProjectId>, <UserToken>);

// Get File Information
await paragon.request("box", "/files/:file_id", {
  method: "GET"
});

// Copy a file
await paragon.request("box", "/files/:file_id/copy", {
  method: "POST",
  body: {
    "parent":{
      "id": "123"
    }
  }
});

// List all collections
await paragon.request("box", "/collections", {
  method: "GET"
});

```

## Building Box workflows

Once your Box account is connected, you can add steps to perform the following actions:

* Upload File from URL
* Upload File
* Get File by ID
* List Files
* Download File
* Create Folder
* Move Folder
* Get Folder by ID
* Search Folders
* Delete Folder

<Note>
  For actions that accept `folderId` as a value, you can pass `0` for the root
  or parent folder
</Note>

You can also use the [Box Request](/workflows/requests#making-integration-requests) step to access any of Box's API endpoints without the authentication piece.

When creating or updating records in Box, you can reference data from previous steps by typing `{{` to invoke the variable menu.

## Using the Box File Picker

You can allow your user to select files from their Box account in your app with the Box File Picker provided by the Paragon SDK.

#### Showing the File Picker

Use the Paragon SDK in your frontend application to show the File Picker in your app.

The SDK provides an `ExternalFilePicker` class to load Box's JavaScript into your page and authenticate with your user's connected Box account.

```javascript theme={null}
let picker = new paragon.ExternalFilePicker("box", {
    onFileSelect: (files) => {
        // Handle file selection
    },

    // Optional settings:
    integrationOptions: {
        box: {
            // If true, renders the Box picker UI inside an iframe to isolate
            // its styles from your application. Use this option if you experience
            // style conflicts between the Box picker and your app's CSS.
            scopeCSS: true
        }
    }
});

// Loads external dependencies and user's access token, and sets the folderId to the root folder
await picker.init({ folderId: "0" });

// Open the File Picker
picker.open();
```

You can configure the File Picker to listen for additional callbacks or to restrict allowed file types. Learn more about configuring File Picker options in the [SDK Reference](/apis/api-reference#externalfilepicker).

#### Downloading the Selected File

The Box File Picker callback will return a `Response` object describing the user's file picker interaction including an array of any files selected. Using this array of file objects, you can use the [Proxy API](/apis/proxy) to perform an authenticated proxy requests to download the files.

<CodeGroup>
  ```javascript JavaScript theme={null}
  await paragon.request('box', '/files/1917222621209/content', {
  	method: 'GET'
  });
  ```

  ```plain REST API theme={null}
  POST https://proxy.useparagon.com/projects/19d...012/sdk/proxy/box/files/<fileID>/content

  Authorization: Bearer eyJ...
  Content-Type: application/json
  ```
</CodeGroup>
