npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

platypusui

v0.16.9

Published

A front-end set of UI controls for PlatypusTS written in TypeScript

Downloads

45

Readme

npm version Downloads Dependency Status devDependency Status

PlatypusUI

A suite of controls built using PlatypusTS

Install

You can use either npm or bower to install the packaged version of PlatypusUI.

npm

npm install platypusui --save

The packaged version of this library works in CommonJS and on window, so if you are using Browserify or other CommonJS module loaders you can use require('platypusui'). If you want to use platui on window, you can include it in your index.html:

<link href="/node_modules/platypusui/platypus.min.css" rel="stylesheet" />

<script src="/node_modules/platypusui/platypusui.min.js"></script>

bower

bower install platypusui --save

The packaged version of this library works with CommonJS and on window, so if you are using a CommonJS loader, you can use require('/bower_components/platypusui/platypusui'). If you want to use platui on window, you can include it in your index.html:

<link href="/bower_components/platypusui/platypus.min.css" rel="stylesheet" />

<script src="/bower_components/platypusui/platypusui.min.js"></script>

Use with TypeScript

This package includes a declaration file, as well as the source .js and .min.js file. If you are using TypeScript >= 1.6.0 everything will be handled for you. Otherwise you can use one of the following methods.

with Typings

typings install --save npm:platypusui

without Typings

Reference /node_modules/platypusui/dist/platypusui.d.ts from your tsconfig.json

Use with LESS

The packaged version of this library includes a single platypus.less file. We recommend using a single LESS file to import all of your other LESS files, including platypus.less.

@import "/node_modules/platypusui/platypus.less";

or

@import "/bower_components/platypusui/platypus.less";

All of the platui variables and mixins are namespaced. The primary namespace is #platui. To overwrite a variable such as @primary-color simply re-declare the variable in the proper namespace.

#platui {
    #variables {
        @primary-color: #0000ff;
    }
}

Recommendations

It is recommended that you use a CommonJS module loader with PlatypusUI in favor of using window.platui.

Documentation

Documentation is available on the Platypi Developers Website.