JSPM

  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 66052
  • Score
    100M100P100Q155339F
  • License MIT

A minimal toolbelt for builing fast SVG-based applications

Package Exports

  • tiny-svg
  • tiny-svg/dist/index.cjs.js
  • tiny-svg/dist/index.esm.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (tiny-svg) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

tiny-svg

CI

tiny-svg is a minimal toolbelt for creating clean SVG applications.

Features

  • no wrapping magic, using native DOM elements instead
  • modular, just use what you need
  • 2kB minified + gzipped
  • innerSVG support
  • simplified attribute handling
  • geometry helpers

Checkout provided utilities.

Usage

import {
  appendTo,
  classes,
  create,
  innerSVG
} from 'tiny-svg';

var container = document.createElement('div');
var element = appendTo(create('svg'), container);

var g = appendTo(create('g'), element);

// add classes, SVG style!
classes(g).add('foo');

var text = `
  <g class="foo bar">
    <rect x="0" y="0" width="0" height="0" rx="50" ry="50"/>
  </g>
`;

// set innerSVG
innerSVG(g, text);

Your favourite module bundler should apply tree-shaking to only include the components your application requires. If you're using CommonJS modules give common-shake a try.

  • min-dom - minimal DOM utility toolbelt
  • min-dash - minimal lodash inspired utility toolbelt

License

MIT