The Updog CSV importer for every framework

Updog embeds as a real element in your own page. It ships as a native React package, with a Web Component for every other framework. Updog inherits your styles, your layout, and your accessibility tree. There is no iframe to seal it off and no resize handshake to maintain.

A Web Component in your own DOM

Most embedded importers drop an <iframe> into your page, which is a separate document sealed off from yours. Updog renders as a custom element in your own DOM, so people cannot tell where your app ends and the importer begins. The comparison below shows what that changes.

  • Styling & theming

    Iframe widget

    A separate document. Your CSS, fonts, and design tokens do not cross in. You are limited to the vendor’s theme settings.

    Updog

    Lives in your DOM. Inherited typography and color flow in; theme the rest with the same CSS variables you use everywhere.

  • Sizing & layout

    Iframe widget

    An iframe has no intrinsic content height. You hardcode a height or run a postMessage resize handshake that lags on dynamic content.

    Updog

    Sizes like any block element and grows with its own content, with nothing to measure or sync.

  • Data exchange

    Iframe widget

    Cross-origin frames talk only through asynchronous postMessage, which sends serialized messages with no direct calls or shared objects.

    Updog

    Plain props and attributes go in, and real DOM events come out, in the same JavaScript context as your app.

  • Overlays & modals

    Iframe widget

    A full-screen import modal is clipped to the iframe’s box, so vendors take over the whole viewport with a fixed overlay.

    Updog

    Renders against your viewport, so overlays, dropdowns, and toasts are not boxed into a frame.

  • Performance & load

    Iframe widget

    Loads a whole separate document, with its own HTML, CSS, and JS bundle in a separate browsing context, plus extra network and memory.

    Updog

    One document and one bundle, sharing the page’s runtime.

  • Cookies & storage

    Iframe widget

    Modern browsers partition third-party storage by site (Safari ITP, Firefox Total Cookie Protection, Chrome). Third-party frame state can silently break.

    Updog

    Same origin as your app, so there is no third-party storage partitioning to work around.

  • Accessibility

    Iframe widget

    ARIA relationships like aria-controls and aria-activedescendant cannot reference elements across the frame boundary, and focus is split across documents.

    Updog

    One accessibility tree, so focus order, ARIA semantics, and screen-reader flow stay continuous.

Updog blends in because it is part of your page

  • Updog is a real element

    <updog-editor> is a custom element in your markup, with no document boundary around it. Nothing marks where it begins.

  • Your styles and tokens

    Theme Updog with the same CSS variables you use everywhere else, without a vendor settings panel or a round-trip to restyle a button.

  • No handshake

    Configure Updog with props and attributes, then handle completion with an onComplete callback. There is no postMessage protocol to design or maintain.

Pick your framework

React and Next.js get the native package. Every other framework uses the same Updog Web Component.

Browse all examples on GitHub

Try it in the browser

Install the package, add your columns, render the component. Free on localhost. Every feature included.

Go to console Read the docs