@digital-terrain/digital-terrain-ui-library

Insig UI Library

This Component Library is a collection of Vue UI components for use in the development of Insig applications It was built with the intention of hastening development times, enabling reusability and to provide clarity for compositional decisions

Prerequisites

This project requires NodeJS (16.3.0 or later) and NPM (7.15.1 or later)

To make sure you have these versions available on your machine, try running the following command

$ npm -v && node -v
7.15.1
v16.3.0

Table of contents

• Insig UI Library
  • Prerequisites
  • Table of contents
  • Getting Started
  • Installation
  • Usage
    • Serving the UI Library 'kitchen sink'
    • Building a package distribution version
    • Serving the distribution version
    • Serving Storybook
    • Building Storybook
  • Contributing
    • Tasklist
  • Built With
  • Authors
  • License

Getting Started

These instructions will get you a copy of the project up and running on your local machine for development and testing purposes. See deployment for notes on how to deploy the project on a live system

Installation

BEFORE YOU INSTALL: please read the prerequisites

Start with cloning this repo on your local machine:

$ git clone https://[e-mail]/InsigTechnologies/Insig%20UI%20Library/_git/insig-ui-library
$ cd insig-ui-library

To install and set up the library, run:

$ ./workspaces.install.sh

Note If you have issues with workspaces, please ensure you are using the correct versions of NodeJS and NPM

Usage

Serving the UI Library 'kitchen sink'

$ npm run complib:dev

Building a package distribution version

$ npm run complib:build

Note If you have issues with TSC module not found, please blow away node_modules and perform a clean install

This task will create a distribution version of the project inside your local packages/complib/dist/ folder

Publishing the distribution version

Note Before publishing please be sure to increment the version number correctly in packages/complib/package.json

$ npm run complib:publish

Note If you have issues with NPM authentication please ensure your project contains a valid .npmrc file with a valid token

Note this requires Building a package distribution version first

Serving Storybook

$ npm run storybook:start

Building Storybook

$ npm run storybook:build

Note You will most likely not need to run a manual build for Storybook as this should be managed by deployment pipelines

Contributing

Please see documentation within the Storybook instance related to contribution specifics

1. Fork it!
2. Create your feature branch: git checkout -b my-new-feature
3. Add your changes: git add .
4. Commit your changes: git commit -m 'Add some feature'
5. Push to the branch: git push origin my-new-feature
6. Submit a pull request 😎

Tasklist

Remaining Tasks

• Create component: InsigActionsDataTableCell
• any magic strings -> define and export (check classes for colors or other string params eg. buttonType, iconType etc.)
• double check / update props in components for all optionals and defaults
• double check / update all args in SB components to reflect final props
• complete documentation for all components
• complete documentation for all services

Component and Documentation Status

Component Name	Integrated	Documented	Comment
font-awesome-icon	N/A	Yes
Toast Service	N/A	Yes
Confirm Dialog Service	N/A	Yes
InsigApplication	Yes	Yes
InsigAvatar	Yes	Yes
InsigBreadcrumb	Yes	Yes
InsigButton	Yes	Yes
InsigButtonGroup	Yes	Yes
InsigDataTable	Yes	Yes
InsigDisplayField	Yes	Yes
InsigEmptyDataTableCell	Yes	Yes
InsigExpandablePanel	Yes	Yes
InsigFieldset	Yes	Yes
InsigFileUpload	Yes	Yes
InsigInput	Yes	Yes
InsigInputAutoComplete	Yes	Yes
InsigInputCalendar	Yes	Yes
InsigInputCheckbox	Yes	Yes
InsigInputDropdown	Yes	Yes
InsigInputIncrement	Yes	Yes
InsigInputMultiSelect	Yes	Yes
InsigInputNumber	Yes	Yes
InsigInputPassword	Yes	Yes
InsigInputRadioButtonGroup	Yes	Yes
InsigInputSwitch	Yes	Yes
InsigInputTextArea	Yes	Yes
InsigInputText	Yes	Yes
InsigLayout	Yes	Yes
InsigLegend	Yes	Yes
InsigLogin	Yes	No	Not used for now
InsigMenuBar	Yes	Yes
InsigMenu	Yes	Yes
InsigMenuButton	No	No	To do
InsigModal	Yes	Yes
InsigModalNotification	Yes	Yes
InsigModalProgress	Yes	Yes
InsigNotice	Yes	Yes
InsigPage	Yes	Yes
InsigPageNotAuthorized	Yes	Yes
InsigPageNotFound	Yes	Yes
InsigPanel	Yes	Yes
InsigPanelLoadError	Yes	Yes
InsigPanelLoadProgress	Yes	Yes
InsigProgressSpinner	Yes	Yes
InsigRouterLink	Yes	Yes
InsigSearchHeader	Yes	Yes
InsigSelectButton	Yes	Yes
InsigSideMenu	Yes	Yes
InsigTabPanelHeader	Yes	Yes
InsigTabView	Yes	Yes
InsigTag	Yes	Yes
InsigTimeline	Yes	Yes
InsigToolbarView	Yes	Yes
InsigTree	Yes	Yes
InsigTreeTable	Yes	Yes
InsigUserMenu	Yes	Yes

Built With

• Vue 3
• Vite
• NPM Workspaces
• PrimeVue
• Sass
• Typescript

Authors

• Sam Barnett - Initial components work
• Blake Simpson - Monorepo, packaging, components work and documentation
• John Capt - Storybook components and documentation
• Alyssa Booth - Storybook documentation

License

TODO Add license