zx-sml

v0.9.4

Published

23 days ago

Some static method library and documentation generator

Downloads

810

0High
0Medium
0Low

capricorncd

zx-sml static method library format method typescript vite vitest documentation generator

zx-sml

zx-sml is some static method library, which contains toSnakeCase, splitValue, getLocalStorage, formatDate, createElement, classNames and other methods.

zx-sml/docgen is some tool functions used in the Nodejs environment, which contains getCommentsData, outputFile, mkdirSync and other methods. It is mainly used to obtain the comment information in the code, and then output it as a Markdown file.

Install

NPM Install

npm install zx-sml

Yarn add

yarn add zx-sml

pnpm install

pnpm i zx-sml

Usage

import { formatDate } from 'zx-sml'

formatDate('2020-12-04', 'yyyy/MM/dd W')
// 2020/12/04 Fri

zx-sml/docgen

A document generator that read the comments in the code and automatically generate MarkDown documents, docs.

const { log, outputFile } = require('zx-sml/docgen');

log('hello docgen')

outputFile(path.resolve(__dirname, './src'), path.resolve(__dirname, './docs/README.md'));

Methods

$$(selector, doc)

Get the DOM elements that matches selector

@returns HTMLElement[]

$(selector, doc)

Get the DOM element that matches selector

@returns HTMLElement | null

base64ToBlob(base64, type)

base64 to blob data

@returns Blob

classNames(...args)

Merge css class names. NOTE: Duplicate names will not be removed.

classNames({ active: true, zero: 0 }, ['text-center'], 'flex', 0)
// 'active text-center flex 0'

Param|Types|Required|Description :--|:--|:--:|:-- args|string/any[]/{ bool: true, number: 1, str: 'x', obj: {}, arr: [], other: ? }|yes|-

@returns string

clearLocalStorage()

Removing all the localStorage items.

@returns void

clearSessionStorage()

Removing all the sessionStorage items.

@returns void

createBlobURL(blob)

creates a string containing a URL representing the object given in the parameter.

@returns string

createElement(tag, attrs, children)

create an element

Param|Types|Required|Description :--|:--|:--:|:-- tag|string|yes|- attrs|Record<string, any>|no|HTMLElement's attributes. children|string/HTMLElement/Node/string[]/HTMLElement[]/Node[]|no|-

@returns HTMLElement

createUrlForGetRequest(url, params)

Create full URL for GET request

createUrlForGetRequest('api/user', { age: 18 })
// 'api/user?age=18'
createUrlForGetRequest('api/user?class=a', { age: 18 })
// 'api/user?class=a&age=18'

Param|Types|Required|Description :--|:--|:--:|:-- url|string|yes|- params|Record<string, unknown>|yes|-

@returns string

fileToBase64(file)

read file to base64 string

@returns Promise<string>

formatBytes(bytes, useDecimal, decimalPlaces)

Digital Information Sizes Calculator

@returns object {unit: string, text: string, value: number, bytes: number}

formatDate(date, format, langPackage)

Date format, see date-utils-2020 for details

// timestamp
formatDate( 20210101 , 'yyyy-MM-dd hh:mm:ss') // 1970-01-01 14:36:50
// yyyyMMdd
formatDate('20210101', 'yyyy-MM-dd hh:mm:ss') // 2021-01-01 00:00:00

Param|Types|Required|Description :--|:--|:--:|:-- date|any|yes|any type of object format|string|yes|like this yyyy-MM-dd hh:mm:ss W langPackage|ILangPackage|no|-

@returns string

formatKeys(obj, isCamelCase)

Format the key of the object, using the toSnakeCase or toCamelCase method.

formatObjKeys({lineHeight: 1.5}) // {'line-height': 1.5}
formatObjKeys({lineHeight: 1.5, childObj: {maxWidth: 100}})
// {'line-height': 1.5, 'child-obj': {'max-width': 100}}
formatObjKeys({'line-height': 1.5}, true) // {lineHeight: 1.5}
formatObjKeys({'line-height': 1.5, 'child-obj': {'max-width': 100}}, true)
// {lineHeight: 1.5, childObj: {maxWidth: 100}}

@returns object

getLocalStorage(key, def)

Reading the localStorage item.

Param|Types|Required|Description :--|:--|:--:|:-- key|string|yes|A string containing the name of the key you want to retrieve the value of. def|any|yes|If the key does not exist, def is returned.

@returns any Any object the value of the key. If the key does not exist, def is returned.

getMaxZIndex(defaultZIndex)

Get the max zIndex value in the document

@returns number

getScrollableParents(el, scrollDirection)

Get scrollable parent elements

@returns HTMLElement[]

getSessionStorage(key, def)

Reading the sessionStorage item.

@returns any Any object the value of the key. If the key does not exist, def is returned.

getStyleValue(el, attr, needNumber)

Get the value of CSSStyleDeclaration or CSSStyleDeclaration[attr]

@returns string | number | CSSStyleDeclaration | CSSRule | ((index: number) => string) | ((property: string, value: string/null, priority?: string) => void) | null

isArray(input)

determines whether the passed value is an Array

@returns boolean

isElement(el)

determines whether the el is an Element

@returns boolean

isNumber(input)

Determine whether it is a valid number.

isNumber(10) // true
isNumber(-10.02) // true

isNumber(NaN) // false
isNumber(null) // false
isNumber(undefined) // false

@returns boolean

isNumberLike(input)

Determine if input is a string number

@returns boolean

isObject(input)

determines whether the passed value is an object

@returns boolean

joinUrl(...args)

format url,

joinUrl('https://a.com/', '/news', 'detail/100001/?x=9')
// https://a.com/news/detail/100001?x=9

@returns string

randomId(prefix, suffix)

Generate a random string id.

@returns string Like this prefix-xxxxx-xxxxx-xxxxxxxxxx-suffix

randomStr(length)

Generate a random string with a maximum length of 1000.

@returns string

removeLocalStorage(key)

Removing the localStorage item.

@returns void

removeSessionStorage(key)

Removing the sessionStorage item.

@returns void

setLocalStorage(key, value)

It's accesses the current domain's localStorage object and adds a value to it using localStorage.setItem().

Param|Types|Required|Description :--|:--|:--:|:-- key|string|yes|A string containing the name of the key you want to create/update. value|any|yes|Any object the value you want to give the key you are creating/updating.

@returns void

setSessionStorage(key, value)

It's accesses the current domain's sessionStorage object and adds a value to it using sessionStorage.setItem().

@returns void

slice(arrayLike, offset)

Convert pseudo-array to array

slice({ length: 2, 0: 100, 1: 100 }) // [100, 100]

@returns array T[]

splitBase64(base64)

split base64 data

@returns { type: string; data: string }

splitValue(input)

Split an attribute value into number and suffix unit. Returns [0, ''] if the string does not start with a number or -number.

splitValue('100px') // [100, 'px']
splitValue(100) // [100, '']
splitValue('2.5rem') // [2.5, 'rem']
splitValue('-2.5rem') // [-2.5, 'rem']
splitValue('50%') // [50, '%']
splitValue('1,600円') // [1600, '円']
splitValue(',1,600円') // [0, '']
splitValue('0000,600円') // [0, ',600円']

@returns [number, string]

toCamelCase(input, isFirstCapitalLetter)

Format string as camel case

toCamelCase('hello_world') // helloWorld
toCamelCase('hello-world') // helloWorld
toCamelCase('hello world') // helloWorld
toCamelCase('hello-world', true) // HelloWorld

@returns string

toCssValue(value, unit)

toCssValue('10 20') // 10px 20px
toCssValue('10') // 10px
toCssValue(' 25em 10px 0 8') // 25em 10px 0px 8px

@returns string

toDate(input)

Convert input to Date, please click date-utils-2020 for details

@returns Date | null

toNumber(input, isStrictMode, defaultValue?: number)

Convert any type to number.

toNumber('1.3rem') // 1.3
toNumber('1.3rem', true) // 0
toNumber('-12px') // -12
toNumber('-12px', true) // 0
toNumber('1,000,999Yan') // 1000999
toNumber('1,000,999', true) // 0

@returns number

toSnakeCase(input, connectSymbol)

Format string as snake case

toSnakeCase('helloWorld') // hello-world
toSnakeCase('HelloWorld') // hello-world
toSnakeCase('helloWorld', '_') // hello_world
toSnakeCase('helloWorld', ' ') // hello world

@returns string

toStrStyles(...styles)

Convert styles object to string. When the properties are the same, the previous object properties will be overwritten

toStrStyles({'line-height': 1.5, width: '50%'})
// `line-height:1.5;width:'50%'`
toStrStyles({lineHeight: 1.5, width: '50%'})
// `line-height:1.5;width:50%`
toStrStyles({ lineHeight: 1.5, width: '50%' }, { 'line-height': '24px' })
// line-height:24px;width:50%

@returns string

Types

FormatDateLangPackage

The function formatDate(date, format, langPackage) args langPackage's interface. ILangPackage

type FormatDateLangPackage = ILangPackage

GetStyleValueReturnType<T, N>

type of getStyleValue return

type GetStyleValueReturnType<T, N> = T extends undefined
  ? CSSStyleDeclaration
  : N extends true
  ? number
  : string

ScrollDirection

type of scroll direction, x-axis/y-axis

type ScrollDirection = 'x' | 'y'

ILangPackage

The function formatDate(date, format, langPackage) args langPackage's interface.

interface ILangPackage {
  // Starting on sunday. For example ['周日', '周一', ..., '周六']
  weeks: string[],
  [key: string]: any
}

Published

Vulnerabilities

Links

Maintainers

Keywords

Readme

zx-sml

Install

NPM Install

Yarn add

pnpm install

Usage

zx-sml/docgen

Methods

$$(selector, doc)

$(selector, doc)

base64ToBlob(base64, type)

classNames(...args)

clearLocalStorage()

clearSessionStorage()

createBlobURL(blob)

createElement(tag, attrs, children)

createUrlForGetRequest(url, params)

fileToBase64(file)

formatBytes(bytes, useDecimal, decimalPlaces)

formatDate(date, format, langPackage)

formatKeys(obj, isCamelCase)

getLocalStorage(key, def)

getMaxZIndex(defaultZIndex)

getScrollableParents(el, scrollDirection)

getSessionStorage(key, def)

getStyleValue(el, attr, needNumber)

isArray(input)

isElement(el)

isNumber(input)

isNumberLike(input)

isObject(input)

joinUrl(...args)

randomId(prefix, suffix)

randomStr(length)

removeLocalStorage(key)

removeSessionStorage(key)

setLocalStorage(key, value)

setSessionStorage(key, value)

slice(arrayLike, offset)

splitBase64(base64)

splitValue(input)

toCamelCase(input, isFirstCapitalLetter)

toCssValue(value, unit)

toDate(input)

toNumber(input, isStrictMode, defaultValue?: number)

toSnakeCase(input, connectSymbol)

toStrStyles(...styles)

Types

FormatDateLangPackage

GetStyleValueReturnType<T, N>

ScrollDirection

ILangPackage

License