Frontend utilities and components.
Clone the repository:
git clone https://gitlab.com/catamphetamine/frontend-lib.git
And then simply import
modules from it:
import Button from '../../frontend-lib/components/Button.js'
The reason for using these components as source code instead of importing them from an npm package is because a developer might prefer to modify them.
-
<Button/>
— renders a generic button. -
<PressedStateButton/>
— renders a "pressed state" button: a button that stays "pressed" until "depressed". -
<Clickable/>
— makes any element behave as if it was a button (but not in an ARIA-compliant way): the element will start responding to click and touch events, and will callonClick()
when clicked or tapped. -
<OnLongPress/>
— adds anonLongPress()
property to an arbitrary element, which is triggered "on long press" (supports touch and mouse devices). -
<Snackbar/>
— shows slide-in/slide-out notifications. -
<OkCancelDialog/>
— shows an "Ok"/"Cancel" dialog. -
<TextSelectionTooltip/>
— shows a tooltip with arbitrary content (for example, buttons) on text selection. -
<LinearProgress/>
— renders a linear progress bar (progress indicator). -
<PopIconButton/>
— renders an on/off button that plays a "pop" animation when it's switched "on". -
<ContentSection/>
— a generic section of content. Can be used to organize page content into sections. -
<Announcement/>
— renders a closeable "announcement" element. -
<Menu/>
— renders a list of menu items. -
<Form/>
— renders a<form/>
with fields and buttons. -
<DeviceInfo/>
— returns the information about the user's device: what's the width of the screen and whether it's a touch device. -
<ExternalLink/>
— just a wrapper for a<a href="..."/>
link. Only exists to accept ato
property instead of ahref
property. -
Padding.css
— Provides a utility CSS.Padding
class.
On March 9th, 2020, GitHub, Inc. silently banned my account (erasing all my repos, issues and comments) without any notice or explanation. Because of that, all source codes had to be promptly moved to GitLab. The GitHub repo is now only used as a backup (you can star the repo there too), and the primary repo is now the GitLab one. Issues can be reported in any repo.