# iframe-manager

> Helper tool for creating and managing iframes within the DOM.

Latest version **1.0.1** (published 2019-12-19) · ISC license · 0 weekly downloads

## Install

```sh
npm install iframe-manager
pnpm add iframe-manager
yarn add iframe-manager
bun add iframe-manager
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.1 |
| Published | 2019-12-19 |
| First published | 2019-12-19 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 9.9 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | Martin Suba |
| Maintainers | martinsuba |
| Keywords | iframe, iframes, manager, injector, inject, destroy, style, web |

## Links

- npm: https://www.npmjs.com/package/iframe-manager
- Repository: https://github.com/martinsuba/iframe-manager
- Homepage: https://github.com/martinsuba/iframe-manager#readme
- Issues: https://github.com/martinsuba/iframe-manager/issues
- npm.io page: https://npm.io/package/iframe-manager

## Alternatives

- [@opentelemetry/exporter-zipkin](https://npm.io/package/@opentelemetry/exporter-zipkin.md) — 14.8M weekly downloads
- [pusher-js](https://npm.io/package/pusher-js.md) — 2.0M weekly downloads
- [browserify](https://npm.io/package/browserify.md) — 1.7M weekly downloads
- [sqs-consumer](https://npm.io/package/sqs-consumer.md) — 1.7M weekly downloads
- [@sanity/eventsource](https://npm.io/package/@sanity/eventsource.md) — 930.8K weekly downloads

## Recent versions

- 1.0.1 (latest) — 2019-12-19
- 1.0.0 — 2019-12-19

## README

[![Build Status](https://travis-ci.org/martinsuba/iframe-manager.svg?branch=master)](https://travis-ci.org/martinsuba/iframe-manager)
[![codecov](https://codecov.io/gh/martinsuba/iframe-manager/branch/master/graph/badge.svg)](https://codecov.io/gh/martinsuba/iframe-manager)
[![](https://badgen.net/npm/v/iframe-manager)](https://www.npmjs.com/package/iframe-manager)
[![](https://badgen.net/bundlephobia/minzip/iframe-manager)](https://bundlephobia.com/result?p=iframe-manager@1.0.0)

# Iframe Manager

Iframe Manager is simple tool which allows you to create, inject, destroy and style iframes in the DOM. It's written in TypeScript and it works as npm package.

## Install
```
npm i -S iframe-manager
```

## Usage
```js
import IframeManager from 'iframe-manager';

const iframeManager = new IframeManager();

const style = {
  position: 'fixed',
  top: 0,
  left: 0,
};

const attributes = {
  class: 'iframe-css-class',
};

const target = 'body > div > .className';

// inject new iframe to the DOM
const injectedIframe = iframeManager.inject({
  source: 'https://www.github.com',
  style, // optional
  attributes, // optional
  target, // optional
});

// update iframe's style
injectedIframe.style({
  border: '5px solid red',
  backgroundColor: 'red',
});

// iframe HTMLElement is accessible under `element` property
injectedIframe.element.addEventListener('click', () => {});

// destroy injected iframe
injectedIframe.destroy();

// list of injected iframes is accessible under IframeManager's `iframes` property
iframeManager.iframes // returns Set object
```

## Methods
### IframeManager.inject(settings: Settings): Iframe
Injects iframe element to the DOM.
```ts
interface Settings {
  source: string;
  style?: object;
  attributes?: object;
  target?: string;
}
```
### Settings
Setting | Type | Description
------ | ---- | ----
source | string | Path to the iframe's content. Iframe's `src` attribute. Required.
style | object | Object with css style of the iframe in camel case. Not required.
attributes | object | Object with iframe's html attributes in camel case. Not required.
target | string | QuerySelector of an element to which should be iframe appended. Not required. By default iframe is appended to the body element.

### Iframe.style(style: object): void
Changes the style of the injected iframe.

### Iframe.destroy(): void
Removes injected iframe from the DOM.

## Properties
### IframeManager.iframes: Set
Set object of injected iframes.

### Iframe.element: HTMLElement
HTMLElement of injected iframe.

---
_Source: https://npm.io/package/iframe-manager · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._