Skip to main content

@lithen/fns@4.3.0

latest

Functions to use with html and css to create simple and powerful UI elements. Its part of Lithen modules. It works alone but is created to use with Web Components.

This package works with Node.js, BrowsersIt is unknown whether this package works with Cloudflare Workers, Deno, Bun
It is unknown whether this package works with Cloudflare Workers
This package works with Node.js
It is unknown whether this package works with Deno
It is unknown whether this package works with Bun
This package works with Browsers
JSR Score
100%
Published
2 weeks ago (4.3.0)
f
createStyled

This function creates an element by the provided tag name,adds to it the hash class from the LithenCSSText and createsa CSSStyleSheet to append the styles to the DOM.

f
css

Function that parses the css text passed and minifies it.Also can replace every & in the code with a random hashclass.

c
DataSignal

A Class used to create an object that holds a value anda list of listeners that listen to change made to thishold value.

c
DataSignalRecord

A class that represents an object that is a group of DataSignals.It will make a swallow copy of the object passed as argument to it.The copy is swallow, so it will not cycle through nested objects tomake them DataSignalRecords too. But if the value of some field ofthe object already is a DataSignal or DataSignalRecord it justleave the value as it is.

f
el

Similar to the html tag function, but instead of returning aDocumentFragment it returns the first child node declared inthe template. This function is replacing the old html.first.

c
ElementRef

Class used to hold a reference to some element.You can access it through the el property, itis useful to hold elements references before itscreation.

f
html

Function that parses the html text passed to it.

T
HtmlStrings

Type of value the html function accepts as first parameter.

c
LithenCSSString

Class used to represent a CSS text created by the csstag function. It also replaces any & with a random hash classcreated on its instantiation, used to avoid a CSS classcollision and give an impression of scoped styles.

f
raw

Function that enables to use raw html as inputwithout it being parsed to protect for XSS.

T
RawTagFnStrings

Type of values the raw function accepts.

f
ref

A helper function to create an ElementRef.

f
N
shell

Creates a conditional rendering zone, that updates based on a valuechange of a DataSignal. This shell can be used to show or hide,to show a list of elements and more. It all depends if on the elementsreturned by a callback function passed to the shell.

v
shell.once

Works just like the normal shell, but it will have only one update.

f
signal

A helper function to create a SignalData instance.

T
SignalListener

Type of function the can be passed to theonChange method. And is the same typeused in the remove method.

T
SignalRecord

Type that represents an object that all its propertiesare signals. You pass the object type you want as genericand will be generated a SignalRecord version of it.

f
signalRecord

A helper function that creates an instance of DataSignalRecord,which is used to create a object like group of signals.Currently if you pass an object as value to a DataSignalthe object itself will be the value hold by the signal. Butif we want that which key of the object to be a signal andnot the object itself. That is the usage of this function.