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

table-size-layout

v1.0.1

Published

Calculate width for every columns (or height for every rows) based on given data

Downloads

5

Readme

Table Size Layout

English | 中文

Calculate width of columns based on size configuration of each column.

Installation

npm install --save table-size-layout

Import

ES6/Webpack

import Layout from 'table-size-layout';

Node.js

const Layout=require('table-size-layout');

Script Tag

<script type='text/javascript' src='./dist/index.js'></script>

Initialization

const layout = new Layout();

Initialize an empty instance of Layout().

const layout = new Layout(conf);

Initialize a new instance of Layout() with size configuration, format of conf parameter is the same as the set(conf) method below.

API

toJSON()

Return a copy of the size configuration in use, can be used with JSON.stringify().

layout(size)

Return the calculated sizes for each column.

Parameters

  • size - Size of the container, must be a number greater than 0.

Returns

An array of sizes for each column.

Throws

  • TypeError - If size parameter is not a number.
  • RangeError - If size parameter is not greater than 0.

set(conf)

Set configuration of each column.

Parameters

  • conf - A non-empty array contains size configuration elemets for each column.

Each size cofiguration element may have keys size, minSize, maxSize, all of them are optional, while the value of the keys must be greater than 0.

minSize specifies a column's minimum size, while maxSize specifies a column's maximum size.

size parameter is NOT intended for specifing the width of a column. To specify a fixed-width column, please set minSize and maxSize with the same column width value.

size parameter is used for specifing the column width relative to other columns. If one column's size value is 2, while other columns' size value is 1, then the column widths 2x wider than other columns.

Below is a example:

[
  {
    "minSize":10,
    "maxSize":200,
    "size":1
  },
  {
    "minSize":10,
    "maxSize":200,
    "size":2
  },
  {
    "minSize":20,
    "maxSize":20
  }
]

Returns

A reference to this instance for chaining.

Throws

  • TypeError - If conf is not a non-empty array or array contains element with minSize, maxSize, size not in number type.
  • RangeError - If conf array contains element with either minSize, maxSize, size parameter not greater than 0.

Table Size Layout

English | 中文

根据给定参数计算表格列宽。

安装

npm install --save table-size-layout

引入

ES6/Webpack

import Layout from 'table-size-layout';

Node.js

const Layout=require('table-size-layout');

Script标签

<script type='text/javascript' src='./dist/index.js'></script>

初始化

const layout = new Layout();

新建一个空的Layout()实例。

const layout = new Layout(conf);

使用给定的参数新建一个Layout()实例,参数的具体格式可参考set(conf)方法。

API

toJSON()

返回一份现在使用的参数的拷贝,可配合JSON.stringify()使用。

layout(size)

计算各个列的宽度。

参数

  • size - 容器宽度,必须大于0。

返回值

包含各列宽度的数组。

异常

  • TypeError - size参数不是数字格式。
  • RangeError - size参数的值不是大于0的数字。

set(conf)

设置每列的宽度计算参数。

参数

  • conf - 非空数组,数组中每一项对应一列的宽度配置。

每个配置项可含有键sizeminSizemaxSize,均为可选键,每个键的值均需大于0。

minSize指定了列的最小宽度,maxSize指定了列的最大宽度。

size参数不能用于指定列的宽度,如需指定固定宽度的列,请将minSizemaxSize设置成相同的值。

size用于指定当前列相对其它列的宽度。如果当前列的size值为2,而其它列的size值为1,则当前列的宽度为其它列的2倍。

以下为conf参数的范例:

[
  {
    "minSize":10,
    "maxSize":200,
    "size":1
  },
  {
    "minSize":10,
    "maxSize":200,
    "size":2
  },
  {
    "minSize":20,
    "maxSize":20
  }
]

返回值

返回当前对象的引用,可用于链式操作。

异常

  • TypeError - conf不是非空数组,或数组中存在sizeminSizemaxSize的值不为数字的情况。
  • RangeError - conf数组中存在配置项中sizeminSizemaxSize的值小于等于0的情况。