finezza-ui-component 1.8.7 → 2.0.0

package/README.md

@@ -1,193 +1,193 @@
-# finezza-ui-component
-
-> Components for finezza
-
-[![NPM](https://img.shields.io/npm/v/finezza-ui-component.svg)](https://www.npmjs.com/package/finezza-ui-component) [![JavaScript Style Guide](https://img.shields.io/badge/code_style-standard-brightgreen.svg)](https://standardjs.com)
-
-## Install
-
-```bash
-npm install --save finezza-ui-component
-```
-
-## Usage
-
-To Import ConfirmButton
-
-```jsx
-import React, { Component } from 'react'
-
-import { ConfirmButton } from 'finezza-ui-component'
-class Example extends Component {
-  render() {
-    return (
-      <ConfirmButton
-        handleConfirm='func(), it will not return any value only take a callback function'
-        buttonTitle='string, the name of the button'
-        popupTitle='string, the title of the dialog box'
-        className='object, will pass the className'
-        style='object, styling object style'
-        buttonType='string, icon -> if we need only icon, else it will show the texted button'
-        color="string, it will take only the mentioned values -> 'default','inherit','primary','secondary'"
-        IconButton='icon name, name of the icon if we want the button as only icon'
-        disabled='bool, to disbale the button'
-        type='string, the type of the button such as submit type'
-      />
-    )
-  }
-}
-```
-
-To Import CurrencyInputbox
-
-```jsx
-import React, { Component } from 'react'
-
-import { CurrencyInputbox } from 'finezza-ui-component'
-
-class Example extends Component {
-  render() {
-    return (
-      <CurrencyInputbox
-        handleChange='func(event, value), will return event,value(without comma)'
-        value='string, will place the value'
-        label='string, will give the label of the textbox'
-        name='string, will give the name of the textbox'
-        errorMessage='string, will give the error message to show'
-        required='bool, will give true or false'
-        disable='bool, will give true or false'
-        disableInword='if text in word is not required'
-      />
-    )
-  }
-}
-```
-
-To Import PercentageInputbox
-
-```jsx
-import React, { Component } from 'react'
-
-import { PercentageInputbox } from 'finezza-ui-component'
-
-class Example extends Component {
-  render() {
-    return (
-      <PercentageInputbox
-        handleChange='func, will return event'
-        value='string, will place the value'
-        label='string, will give the label of the textbox'
-        name='string, will give the name of the textbox'
-        errorMessage='string, will give the error message to show'
-        required='bool, will give true or false'
-        disable='bool, will give true or false'
-        inputMask='string, will give the valid masking pattern'
-      />
-    )
-  }
-}
-```
-
-To Import Textbox
-
-```jsx
-import React, { Component } from 'react'
-
-import { Textbox } from 'finezza-ui-component'
-
-class Example extends Component {
-  render() {
-    return (
-      <Textbox
-        handleChange='func, will return event'
-        value='string, will place the value'
-        label='string, will give the label of the textbox'
-        name='string, will give the name of the textbox'
-        errorMessage='string, will give the error message to show'
-        required='bool, will give true or false'
-        disable='bool, will give true or false'
-        inputMask='string, will give the valid masking pattern'
-      />
-    )
-  }
-}
-```
-
-To Import Table
-
-```jsx
-import React, { Component } from 'react'
-
-import { CustomTable } from 'finezza-ui-component'
-
-class Example extends Component {
-  const
-  tableHeader = [
-    {
-      displayName: 'AMOUNT',
-      fieldName: 'amount',
-      isAmount: true,
-      width: '550px',
-      align: 'center'
-    }
-  ]
-  render() {
-    return (
-      <CustomTable
-        tableHeader='array'
-        rowData='array'
-        checkbox='bool'
-        handleCheckBox='func,(will return index of selected rows)'
-        title='string'
-        onClickRow='func (will return index of select row)'
-        bankStyle='bool'
-      />
-    )
-  }
-}
-```
-
-To Import Loading Screen
-
-```jsx
-import React, { Component } from 'react'
-
-import { LoadingScreen } from 'finezza-ui-component'
-
-class Example extends Component {
-  render() {
-    return (
-      <LoadingScreen src='if we need to change the logo, by default it will show finezza logo' />
-    )
-  }
-}
-```
-
-To Import Spinner
-
-```jsx
-import React, { Component } from 'react'
-
-import { SpinnerScreen } from 'finezza-ui-component'
-
-class Example extends Component {
-  render() {
-    return (
-      <SpinnerScreen
-        open='bool'
-        src='if we need to change the logo, by default it will show finezza logo'
-      />
-    )
-  }
-}
-```
-
-To Import all together
-
-```jsx
-import { SpinnerScreen, LoadingScreen, CustomTable } from 'finezza-ui-component'
-```
-
-## License
-
-MIT © [](https://github.com/)
+# finezza-ui-component
+
+> Components for finezza
+
+[![NPM](https://img.shields.io/npm/v/finezza-ui-component.svg)](https://www.npmjs.com/package/finezza-ui-component) [![JavaScript Style Guide](https://img.shields.io/badge/code_style-standard-brightgreen.svg)](https://standardjs.com)
+
+## Install
+
+```bash
+npm install --save finezza-ui-component
+```
+
+## Usage
+
+To Import ConfirmButton
+
+```jsx
+import React, { Component } from 'react'
+
+import { ConfirmButton } from 'finezza-ui-component'
+class Example extends Component {
+  render() {
+    return (
+      <ConfirmButton
+        handleConfirm='func(), it will not return any value only take a callback function'
+        buttonTitle='string, the name of the button'
+        popupTitle='string, the title of the dialog box'
+        className='object, will pass the className'
+        style='object, styling object style'
+        buttonType='string, icon -> if we need only icon, else it will show the texted button'
+        color="string, it will take only the mentioned values -> 'default','inherit','primary','secondary'"
+        IconButton='icon name, name of the icon if we want the button as only icon'
+        disabled='bool, to disbale the button'
+        type='string, the type of the button such as submit type'
+      />
+    )
+  }
+}
+```
+
+To Import CurrencyInputbox
+
+```jsx
+import React, { Component } from 'react'
+
+import { CurrencyInputbox } from 'finezza-ui-component'
+
+class Example extends Component {
+  render() {
+    return (
+      <CurrencyInputbox
+        handleChange='func(event, value), will return event,value(without comma)'
+        value='string, will place the value'
+        label='string, will give the label of the textbox'
+        name='string, will give the name of the textbox'
+        errorMessage='string, will give the error message to show'
+        required='bool, will give true or false'
+        disable='bool, will give true or false'
+        disableInword='if text in word is not required'
+      />
+    )
+  }
+}
+```
+
+To Import PercentageInputbox
+
+```jsx
+import React, { Component } from 'react'
+
+import { PercentageInputbox } from 'finezza-ui-component'
+
+class Example extends Component {
+  render() {
+    return (
+      <PercentageInputbox
+        handleChange='func, will return event'
+        value='string, will place the value'
+        label='string, will give the label of the textbox'
+        name='string, will give the name of the textbox'
+        errorMessage='string, will give the error message to show'
+        required='bool, will give true or false'
+        disable='bool, will give true or false'
+        inputMask='string, will give the valid masking pattern'
+      />
+    )
+  }
+}
+```
+
+To Import Textbox
+
+```jsx
+import React, { Component } from 'react'
+
+import { Textbox } from 'finezza-ui-component'
+
+class Example extends Component {
+  render() {
+    return (
+      <Textbox
+        handleChange='func, will return event'
+        value='string, will place the value'
+        label='string, will give the label of the textbox'
+        name='string, will give the name of the textbox'
+        errorMessage='string, will give the error message to show'
+        required='bool, will give true or false'
+        disable='bool, will give true or false'
+        inputMask='string, will give the valid masking pattern'
+      />
+    )
+  }
+}
+```
+
+To Import Table
+
+```jsx
+import React, { Component } from 'react'
+
+import { CustomTable } from 'finezza-ui-component'
+
+class Example extends Component {
+  const
+  tableHeader = [
+    {
+      displayName: 'AMOUNT',
+      fieldName: 'amount',
+      isAmount: true,
+      width: '550px',
+      align: 'center'
+    }
+  ]
+  render() {
+    return (
+      <CustomTable
+        tableHeader='array'
+        rowData='array'
+        checkbox='bool'
+        handleCheckBox='func,(will return index of selected rows)'
+        title='string'
+        onClickRow='func (will return index of select row)'
+        bankStyle='bool'
+      />
+    )
+  }
+}
+```
+
+To Import Loading Screen
+
+```jsx
+import React, { Component } from 'react'
+
+import { LoadingScreen } from 'finezza-ui-component'
+
+class Example extends Component {
+  render() {
+    return (
+      <LoadingScreen src='if we need to change the logo, by default it will show finezza logo' />
+    )
+  }
+}
+```
+
+To Import Spinner
+
+```jsx
+import React, { Component } from 'react'
+
+import { SpinnerScreen } from 'finezza-ui-component'
+
+class Example extends Component {
+  render() {
+    return (
+      <SpinnerScreen
+        open='bool'
+        src='if we need to change the logo, by default it will show finezza logo'
+      />
+    )
+  }
+}
+```
+
+To Import all together
+
+```jsx
+import { SpinnerScreen, LoadingScreen, CustomTable } from 'finezza-ui-component'
+```
+
+## License
+
+MIT © [](https://github.com/)

package/dist/finezza-ui-component.css

@@ -0,0 +1 @@
+[data-simplebar]{position:relative;flex-direction:column;flex-wrap:wrap;justify-content:flex-start;align-content:flex-start;align-items:flex-start}.simplebar-wrapper{overflow:hidden;width:inherit;height:inherit;max-width:inherit;max-height:inherit}.simplebar-mask{direction:inherit;position:absolute;overflow:hidden;padding:0;margin:0;inset:0;width:auto!important;height:auto!important;z-index:0}.simplebar-offset{direction:inherit!important;box-sizing:inherit!important;resize:none!important;position:absolute;inset:0;padding:0;margin:0;-webkit-overflow-scrolling:touch}.simplebar-content-wrapper{direction:inherit;box-sizing:border-box!important;position:relative;display:block;height:100%;width:auto;max-width:100%;max-height:100%;overflow:auto;scrollbar-width:none;-ms-overflow-style:none}.simplebar-content-wrapper::-webkit-scrollbar,.simplebar-hide-scrollbar::-webkit-scrollbar{display:none;width:0;height:0}.simplebar-content:after,.simplebar-content:before{content:" ";display:table}.simplebar-placeholder{max-height:100%;max-width:100%;width:100%;pointer-events:none}.simplebar-height-auto-observer-wrapper{box-sizing:inherit!important;height:100%;width:100%;max-width:1px;position:relative;float:left;max-height:1px;overflow:hidden;z-index:-1;padding:0;margin:0;pointer-events:none;flex-grow:inherit;flex-shrink:0;flex-basis:0}.simplebar-height-auto-observer{box-sizing:inherit;display:block;opacity:0;position:absolute;top:0;left:0;height:1000%;width:1000%;min-height:1px;min-width:1px;overflow:hidden;pointer-events:none;z-index:-1}.simplebar-track{z-index:1;position:absolute;right:0;bottom:0;pointer-events:none;overflow:hidden}[data-simplebar].simplebar-dragging,[data-simplebar].simplebar-dragging .simplebar-content{pointer-events:none;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}[data-simplebar].simplebar-dragging .simplebar-track{pointer-events:all}.simplebar-scrollbar{position:absolute;left:0;right:0;min-height:10px}.simplebar-scrollbar:before{position:absolute;content:"";background:#000;border-radius:7px;left:2px;right:2px;opacity:0;transition:opacity .2s .5s linear}.simplebar-scrollbar.simplebar-visible:before{opacity:.5;transition-delay:0s;transition-duration:0s}.simplebar-track.simplebar-vertical{top:0;width:11px}.simplebar-scrollbar:before{inset:2px}.simplebar-track.simplebar-horizontal{left:0;height:11px}.simplebar-track.simplebar-horizontal .simplebar-scrollbar{inset:0 auto 0 0;min-height:0;min-width:10px;width:auto}[data-simplebar-direction=rtl] .simplebar-track.simplebar-vertical{right:auto;left:0}.simplebar-dummy-scrollbar-size{direction:rtl;position:fixed;opacity:0;visibility:hidden;height:500px;width:500px;overflow-y:hidden;overflow-x:scroll;-ms-overflow-style:scrollbar!important}.simplebar-dummy-scrollbar-size>div{width:200%;height:200%;margin:10px 0}.simplebar-hide-scrollbar{position:fixed;left:0;visibility:hidden;overflow-y:scroll;scrollbar-width:none;-ms-overflow-style:none}