superdesk-ui-framework 3.0.1-beta.7 → 3.0.1-beta.9

package/dist/vendor.bundle.js

@@ -70,7 +70,7 @@ return /******/ (function(modules) { // webpackBootstrap
 /******/ 	__webpack_require__.p = "";
 /******/
 /******/ 	// Load entry module and return exports
-/******/ 	return __webpack_require__(__webpack_require__.s = 513);
+/******/ 	return __webpack_require__(__webpack_require__.s = 514);
 /******/ })
 /************************************************************************/
 /******/ ({
@@ -28246,7 +28246,7 @@ module.exports = function(module) {
 
 /***/ }),
 
-/***/ 513:
+/***/ 514:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
@@ -28256,11 +28256,11 @@ __webpack_require__(34);
 
 __webpack_require__(41);
 
-__webpack_require__(514);
+__webpack_require__(515);
 
-__webpack_require__(516);
+__webpack_require__(517);
 
-__webpack_require__(518);
+__webpack_require__(519);
 
 __webpack_require__(0);
 
@@ -28268,7 +28268,7 @@ __webpack_require__(9);
 
 /***/ }),
 
-/***/ 514:
+/***/ 515:
 /***/ (function(module, exports, __webpack_require__) {
 
 var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_DEFINE_RESULT__;/*!
@@ -28292,7 +28292,7 @@ var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_
 	if ( true ) {
 
 		// AMD. Register as an anonymous module.
-		!(__WEBPACK_AMD_DEFINE_ARRAY__ = [ __webpack_require__(41), __webpack_require__(515) ], __WEBPACK_AMD_DEFINE_FACTORY__ = (factory),
+		!(__WEBPACK_AMD_DEFINE_ARRAY__ = [ __webpack_require__(41), __webpack_require__(516) ], __WEBPACK_AMD_DEFINE_FACTORY__ = (factory),
 				__WEBPACK_AMD_DEFINE_RESULT__ = (typeof __WEBPACK_AMD_DEFINE_FACTORY__ === 'function' ?
 				(__WEBPACK_AMD_DEFINE_FACTORY__.apply(exports, __WEBPACK_AMD_DEFINE_ARRAY__)) : __WEBPACK_AMD_DEFINE_FACTORY__),
 				__WEBPACK_AMD_DEFINE_RESULT__ !== undefined && (module.exports = __WEBPACK_AMD_DEFINE_RESULT__));
@@ -29030,7 +29030,7 @@ return $.widget;
 
 /***/ }),
 
-/***/ 515:
+/***/ 516:
 /***/ (function(module, exports, __webpack_require__) {
 
 var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_DEFINE_RESULT__;( function( factory ) {
@@ -29060,16 +29060,16 @@ return $.ui.version = "1.13.0";
 
 /***/ }),
 
-/***/ 516:
+/***/ 517:
 /***/ (function(module, exports, __webpack_require__) {
 
-__webpack_require__(517);
+__webpack_require__(518);
 module.exports = angular;
 
 
 /***/ }),
 
-/***/ 517:
+/***/ 518:
 /***/ (function(module, exports, __webpack_require__) {
 
 /* WEBPACK VAR INJECTION */(function(__webpack_provided_window_dot_jQuery) {/**
@@ -65676,16 +65676,16 @@ $provide.value("$locale", {
 
 /***/ }),
 
-/***/ 518:
+/***/ 519:
 /***/ (function(module, exports, __webpack_require__) {
 
-__webpack_require__(519);
+__webpack_require__(520);
 module.exports = 'ngAnimate';
 
 
 /***/ }),
 
-/***/ 519:
+/***/ 520:
 /***/ (function(module, exports) {
 
 /**

package/examples/pages/playgrounds/react-playgrounds/RundownEditor.tsx

@@ -337,7 +337,7 @@ export class RundownEditor extends React.Component<IProps, IState> {
                 </Layout.MainPanel>
 
                 <Layout.RightPanel open={this.state.rightPanelOpen}>
-                    <Layout.Panel size='x-large' side='right'>
+                    <Layout.Panel size='full' side='right'>
                         <Layout.PanelContent>
                             <Layout.AuthoringFrame
                                 main={

package/examples/pages/playgrounds/react-playgrounds/SamsPlayground.tsx

@@ -141,7 +141,10 @@ export class SamsPlayground extends React.Component<IProps, IState> {
                                 <Components.PanelContentBlock>
                                     <div className="form__group">
                                         <div className="form__item">
-                                            <Input label='Title'
+                                            <Input
+                                                label='Title'
+                                                type='text'
+                                                value=''
                                                 error='This is error message'
                                                 inlineLabel={false}
                                                 disabled={false}
@@ -167,7 +170,10 @@ export class SamsPlayground extends React.Component<IProps, IState> {
 
                                     <div className="form__group">
                                         <div className="form__item">
-                                            <Input label='Keyword'
+                                            <Input 
+                                                label='Keyword'
+                                                type='text'
+                                                value=''
                                                 error='This is error message'
                                                 inlineLabel={false}
                                                 disabled={false}
@@ -232,8 +238,11 @@ export class SamsPlayground extends React.Component<IProps, IState> {
                                             <Badge text={item.urgency} color={item.urgencyColor} />
                                             <Badge text={item.priority} shape='square' color={item.priorityColor} />
                                         </GridElements.GridItemFooterBlock>
+                                        <GridElements.GridItemFooterBlock align='right'>
+                                            <Label type='success' style='translucent' text='In progress' />
+                                        </GridElements.GridItemFooterBlock>
                                         <GridElements.GridItemFooterActions>
-                                            <IconButton icon='dots-vertical' ariaValue='More actions' onClick={()=> this.changeStatus(item, 'archived')} />
+                                            <IconButton size='small' icon='dots-vertical' ariaValue='More actions' onClick={()=> this.changeStatus(item, 'archived')} />
                                         </GridElements.GridItemFooterActions>
                                     </GridElements.GridItemFooter>
                                 </GridElements.GridItem>

package/examples/pages/playgrounds/react-playgrounds/TestGround.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import * as Components from './components/Index';
-import { Checkbox, RadioGroup, CheckboxButton, RadioButtonGroup, Button, NavButton, SubNav, Dropdown, CheckButtonGroup, Input, Select, Option, Label, Icon, IconButton, CheckGroup, GridList, Badge, ThemeSelector, Container, IconLabel, Tooltip, Spinner, Divider, InputWrapper, DatePicker, TimePicker, InputNew, InputBase } from '../../../../app-typescript/index';
+import { Checkbox, RadioGroup, CheckboxButton, RadioButtonGroup, Button, NavButton, SubNav, Dropdown, CheckButtonGroup, Input, Select, Option, Label, Icon, IconButton, CheckGroup, GridList, Badge, ThemeSelector, Container, IconLabel, Tooltip, Spinner, Divider, InputWrapper, DatePicker, TimePicker, InputNew, InputBase, Text, FormRowNew } from '../../../../app-typescript/index';
 import { Carousel } from '../../../../app-typescript/index';
 import * as GridElements from '../../../../app-typescript/components/GridItem';
 
@@ -63,24 +63,33 @@ export class TestGround extends React.Component<IProps, IState> {
                 <Components.LayoutContainer>
                     <Components.MainPanel>
                         <InputNew
-                            label='testt'
+                            label='test'
                             value=''
                             onChange={(value) => false}
-                            //placeholder='test'
+                            placeholder='test'
                             required={true}
                             info='Nullam Sollicitudin'
                             maxLength={20}
-                            //invalid={true}
-                            //disabled={true}
                             error='Error message'
-                            //inlineLabel={true}
-                            //labelHidden={true}
+                            inlineLabel={true}
+                            labelHidden={true}
                             type='text' />
                         
                         <hr />
                         <div className='form__group-new'>
-                            <Input value='' onChange={(value) => {}} type='text' label='Text input' placeholder='Enter text' disabled={true} />
-                            <Input value='' onChange={(value) => {}} type='text' label='Text input' placeholder='Enter text' disabled={true} />
+                            <Input
+                                value=''
+                                onChange={(value) => {}}
+                                type='text'
+                                label='Text input'
+                                placeholder='Enter text'
+                                disabled={true} />
+                            <Input value=''
+                                onChange={(value) => {}}
+                                type='text'
+                                label='Text input'
+                                placeholder='Enter text'
+                                disabled={true} />
                             <DatePicker
                                 value={this.state.date}
                                 onChange={(date) => {
@@ -91,8 +100,7 @@ export class TestGround extends React.Component<IProps, IState> {
                                 label='Date'
                                 info='Nullam Sollicitudin'
                                 error='Error message'
-                                inlineLabel={true}
-
+                                inlineLabel={false}
                                 shortcuts={[
                                     {label: 'tomorrow', days: 1},
                                     {label: 'yesterday', days: -1},
@@ -107,12 +115,110 @@ export class TestGround extends React.Component<IProps, IState> {
                                     this.setState({time});
                                 }}
                             />
-                            <Button text="Exit" type='primary' onClick={()=> false} />
-
+                            <Button text="Clear" onClick={()=> false} />
                             <Button text="Cancel" onClick={()=> false} />
-
                             <Button text="Save" type='primary' onClick={()=> false} />
                         </div>
+                        <hr />
+
+                        <FormRowNew rowLabel='My group label' inlineLabels={true}>
+                            <Input
+                                value=''
+                                onChange={(value) => {}}
+                                type='text'
+                                label='Text input'
+                                placeholder='Enter text'
+                                inlineLabel={true}
+                                labelHidden={true}
+                                disabled={false} />
+                            <Text size='small' align='center'>To:</Text>
+                            <Input
+                                value=''
+                                onChange={(value) => {}}
+                                type='text'
+                                label='Text input'
+                                placeholder='Enter text'
+                                inlineLabel={true}
+                                labelHidden={true}
+                                disabled={false} />
+                            <DatePicker
+                                value={this.state.date}
+                                onChange={(date) => {
+                                    this.setState({date});
+                                }}
+                                // disabled={true}
+                                dateFormat="DD-MM-YYYY"
+                                label='Date'
+                                info='Nullam Sollicitudin'
+                                error='Error message'
+                                inlineLabel={true}
+                                labelHidden={true}
+                                shortcuts={[
+                                    {label: 'tomorrow', days: 1},
+                                    {label: 'yesterday', days: -1},
+                                ]}
+                            />
+                            <TimePicker
+                                value={this.state.time}
+                                // disabled={true}
+                                required={true}
+                                inlineLabel={true}
+                                labelHidden={true}
+                                label='Time'
+                                onChange={(time) => {
+                                    this.setState({time});
+                                }}
+                            />
+                            <Button text="Save" type='primary' onClick={()=> false} />
+                        </FormRowNew>
+
+                        <hr />
+
+                        <FormRowNew>
+                            <Input
+                                value=''
+                                onChange={(value) => {}}
+                                type='text'
+                                label='Text input'
+                                placeholder='Enter text'
+                                disabled={false} />
+                            <Text size='small' align='center'>To:</Text>
+                            <Input
+                                value=''
+                                onChange={(value) => {}}
+                                type='text'
+                                label='Text input'
+                                placeholder='Enter text'
+                                labelHidden={true}
+                                disabled={false} />
+                            <DatePicker
+                                value={this.state.date}
+                                onChange={(date) => {
+                                    this.setState({date});
+                                }}
+                                // disabled={true}
+                                dateFormat="DD-MM-YYYY"
+                                label='Date'
+                                info='Nullam Sollicitudin'
+                                error='Error message'
+                                inlineLabel={false}
+                                shortcuts={[
+                                    {label: 'tomorrow', days: 1},
+                                    {label: 'yesterday', days: -1},
+                                ]}
+                            />
+                            <TimePicker
+                                value={this.state.time}
+                                // disabled={true}
+                                required={true}
+                                label='Time'
+                                onChange={(time) => {
+                                    this.setState({time});
+                                }}
+                            />
+                            <Button text="Save" type='primary' onClick={()=> false} />
+                        </FormRowNew>
+
                         <hr />
                         <h3 className="docs-page__h3 sd-margin-y--0">Table list</h3>
                         <hr />

package/examples/pages/react/LeftNavigations.tsx

@@ -13,11 +13,17 @@ export default class LeftNavigationsDoc extends React.Component<{}> {
                     <LeftMenu 
                         activeItemId='1' 
                         groups={[
-                                { label: 'SYSTEM SETTINGS', items: [{id: '1', label: 'General'}, {id: '2', label: 'Email settings'}, {id: '3', label: 'Spell checking'}]},
-                                { label: 'WORKFLOW', items: [{ id: '4', label: 'Desk' }, { id: '5', label: 'User Roles & Privileges'}]},
-                                { label: 'CONTENT CONFIG', items: [{id: '6', label: 'Image renditions'}, {id: '7', label: 'Controlled Vocabularies'}]}
+                                { label: 'SYSTEM SETTINGS', items: [
+                                    {id: '1', label: 'General'},
+                                    {id: '2', label: 'Email settings'},
+                                ]},
+                                { label: 'WORKFLOW', items: [
+                                    { id: '4', label: 'Desk' },
+                                    { id: '5', label: 'User Roles & Privileges'},
+                                ]}
                             ]}
-                        onSelect={() => false} />
+                        onSelect={() => false}
+                    />
                 `}
                 </Markup.ReactMarkupCodePreview>
 
@@ -32,25 +38,41 @@ export default class LeftNavigationsDoc extends React.Component<{}> {
                                         <p className="sd-top-menu__header">Top menu</p>
                                     </div>
                                 </div>
-                                    <LeftMenu ariaLabel={'Left navigation'} className={'docs-page__grid-page-example__side'} activeItemId='1' 
-                                        groups={[
-                                                {label: 'SYSTEM SETTINGS', items: [{id: '1', label: 'General'}, {id: '2', label: 'Email settings'}, {id: '3', label: 'Spell checking'}]},
-                                                {label: 'WORKFLOW', items: [{id: '4', label: 'Desk'}, {id: '5', label: 'User Roles & Privileges'}]},
-                                                {label: 'CONTENT CONFIG', items: [{id: '6', label: 'Image renditions'}, {id: '7', label: 'Controlled Vocabularies'}]}
-                                            ]}
-                                        onSelect={() => false} />
+                                    <LeftMenu ariaLabel={'Left navigation'}
+                                    className={'docs-page__grid-page-example__side'}
+                                    activeItemId='3' 
+                                    groups={[
+                                            {label: 'SYSTEM SETTINGS', items: [{id: '1', label: 'General'}, {id: '2', label: 'Email settings'}, {id: '3', label: 'Spell checking'}]},
+                                            {label: 'WORKFLOW', items: [{id: '4', label: 'Desk'}, {id: '5', label: 'User Roles & Privileges'}]},
+                                            {label: 'CONTENT CONFIG', items: [{id: '6', label: 'Image renditions'}, {id: '7', label: 'Controlled Vocabularies'}]}
+                                        ]}
+                                    onSelect={() => false} />
                                 <div className='docs-page__grid-page-example__main'></div>
                             </div>
                         </div>
                     </Markup.ReactMarkupPreview>
                     <Markup.ReactMarkupCode>{`
-                        <LeftMenu ariaLabel={'Left navigation'} className={'docs-page__grid-page-example__side'} activeItemId='1' 
+                        <LeftMenu 
+                            ariaLabel={'Left navigation'}
+                            className={'docs-page__grid-page-example__side'}
+                            activeItemId='1' 
                             groups={[
-                                    {label: 'SYSTEM SETTINGS', items: [{id: '1', label: 'General'}, {id: '2', label: 'Email settings'}, {id: '3', label: 'Spell checking'}]},
-                                    {label: 'WORKFLOW', items: [{id: '4', label: 'Desk'}, {id: '5', label: 'User Roles & Privileges'}]},
-                                    {label: 'CONTENT CONFIG', items: [{id: '6', label: 'Image renditions'}, {id: '7', label: 'Controlled Vocabularies'}]}
+                                {label: 'SYSTEM SETTINGS', items: [
+                                    {id: '1', label: 'General'},
+                                    {id: '2', label: 'Email settings'},
+                                    {id: '3', label: 'Spell checking'},
+                                ]},
+                                {label: 'WORKFLOW', items: [
+                                    {id: '4', label: 'Desk'},
+                                    {id: '5', label: 'User Roles & Privileges'},
+                                ]},
+                                {label: 'CONTENT CONFIG', items: [
+                                    {id: '6', label: 'Image renditions'},
+                                    {id: '7', label: 'Controlled Vocabularies'},
                                 ]}
-                            onSelect={() => false} />
+                            ]}
+                            onSelect={() => false}
+                        />
                     `}
                     </Markup.ReactMarkupCode>
                 </Markup.ReactMarkup>
@@ -67,26 +89,26 @@ export default class LeftNavigationsDoc extends React.Component<{}> {
                                     </div>
                                 </div>
                                     <LeftMenu ariaLabel={'Left navigation'}
-                                        className={'docs-page__grid-page-example__side'}     
-                                        scrollSpy='#scrollContainer'
-                                        offset={-300}
-                                        activeItemId='1'
-                                        groups={[
-                                            { label: 'MAIN SECTIONS', items: [
-                                                { id: '1', label: 'Section 1', ref:'section1'},
-                                                { id: '2', label: 'Section 2', ref: 'section2' },
-                                                { id: '3', label: 'Section 3', ref: 'section3' },
-                                            
-                                            ]},
-                                            { label:'OTHER SECTIONS', items: [
-                                                { id: '4', label: 'Section 4', ref: 'section4' },
-                                                { id: '5', label: 'Section 5', ref: 'section5' }
-                                            ]},
-                                            { label:'OTHER SECTIONS', items: [
-                                                { id: '6', label: 'Section 6', ref: 'section6' },
-                                                { id: '7', label: 'Section 7', ref: 'section7' }
-                                            ]}
+                                    className={'docs-page__grid-page-example__side'}     
+                                    scrollSpy='#scrollContainer'
+                                    offset={-300}
+                                    //scrollTo={'section4'}
+                                    groups={[
+                                        { label: 'MAIN SECTIONS', items: [
+                                            { id: '1', label: 'Section 1', ref:'section1'},
+                                            { id: '2', label: 'Section 2', ref: 'section2' },
+                                            { id: '3', label: 'Section 3', ref: 'section3' },
+                                        
+                                        ]},
+                                        { label:'OTHER SECTIONS', items: [
+                                            { id: '4', label: 'Section 4', ref: 'section4' },
+                                            { id: '5', label: 'Section 5', ref: 'section5' }
+                                        ]},
+                                        { label:'OTHER SECTIONS', items: [
+                                            { id: '6', label: 'Section 6', ref: 'section6' },
+                                            { id: '7', label: 'Section 7', ref: 'section7' }
                                         ]}
+                                    ]}
                                     onSelect={() => false} />
                                 <div className='docs-page__grid-page-example__main sd-padding--4' id='scrollContainer' style={{height:600}}>
                                         <SimpleList density='comfortable'>
@@ -160,16 +182,17 @@ export default class LeftNavigationsDoc extends React.Component<{}> {
                     </Markup.ReactMarkupPreview> 
                     <Markup.ReactMarkupCode>
                         {`
-                            <LeftMenu ariaLabel={'Left navigation'}
+                            <LeftMenu
+                                ariaLabel={'Left navigation'}
                                 className={'docs-page__grid-page-example__side'}     
                                 scrollSpy='#scrollContainer'
+                                offset={-300}
                                 activeItemId='1' 
                                 groups={[
                                     { label: 'MAIN SECTIONS', items: [
                                         { id: '1', label: 'Section 1', ref:'section1'},
                                         { id: '2', label: 'Section 2', ref: 'section2' },
-                                        { id: '3', label: 'Section 3', ref: 'section3' },
-                                    
+                                        { id: '3', label: 'Section 3', ref: 'section3' }
                                     ]},
                                     {label:'OTHER SECTIONS', items: [
                                         { id: '4', label: 'Section 4', ref: 'section4' },
@@ -180,7 +203,8 @@ export default class LeftNavigationsDoc extends React.Component<{}> {
                                         { id: '5', label: 'Section 7', ref: 'section7' }
                                     ]}
                                 ]}
-                                onSelect={() => false} />
+                                onSelect={() => false}
+                            />
                                 
                             <div id='#scrollContainer'>...</div>
                         `}  
@@ -189,16 +213,19 @@ export default class LeftNavigationsDoc extends React.Component<{}> {
 
                 <h3 className="docs-page__h3">Props</h3>
                 <PropsList>
-                    <Prop name='groups' isRequired={true} type='Array<menugroup>' default='/' description='Array of groups'/>
-                    <Prop name='activeItemId' isRequired={true} type='string' default='/' description='Id of active item'/>
+                    <Prop name='groups' isRequired={true} type='Array<menugroup>' default='/' description='Array of groups.'/>
                     <Prop name='menugroup label' isRequired={true} type='string' default='/' description='Menugroup label text value.'/>
-                    <Prop name='menugroup items' isRequired={true} type='Array<menuitem>' default='/' description='Array of items'/>
-                    <Prop name='menuitem id' isRequired={true} type='string' default='/' description='Menugroup id value'/>
+                    <Prop name='menugroup items' isRequired={true} type='Array<menuitem>' default='/' description='Array of items.'/>
+                    <Prop name='menuitem id' isRequired={true} type='string' default='/' description='Menugroup id value.'/>
                     <Prop name='menuitem label' isRequired={true} type='string' default='/' description='Menugroup label text value.'/>
+                    <Prop name='menuitem ref' isRequired={false} type='string' default='/' description='Menugroup ref.'/>
+                    <Prop name='menuitem route' isRequired={false} type='string' default='/' description='Menugroup route value.'/>
+                    <Prop name='menuitem onCLick' isRequired={true} type='string' default='/' description='On click function.'/>
                     <Prop name='scrollSpy' isRequired={false} type='string' default='HTML' description='Name of the element of scrollable container.'/>
                     <Prop name='offset' isRequired={false} type='number' default='-300' description='Offset value that adjusts to determine the elements are in the viewport.'/>
+                    <Prop name='activeItemId' isRequired={false} type='string' default='/' description='Id of active item'/>
+                    <Prop name='scrollTo' isRequired={false} type='string' default='/' description='Ref of active item.'/>
                 </PropsList>
-
             </section>
         )
     }

package/examples/pages/react/TimePicker.tsx

@@ -24,6 +24,7 @@ class TimePickerExample extends React.PureComponent<{}, {time: string}> {
             label={'This is Label'}
             info={'This is info'}
             error={'This is error'}
+            allowSeconds
             />
         );
     }
@@ -75,14 +76,15 @@ export default class TimePickerDoc extends React.Component {
 
                 <h3 className='docs-page__h3'>Props</h3>
                 <PropsList>
-                    <Prop name='value' isRequired={true} type='string' default='/' description='Item value' />
-                    <Prop name='required' isRequired={false} type='boolean' default='false' description='Mark field as required' />
-                    <Prop name='disabled' isRequired={false} type='boolean' default='false' description='Mark field as disabled' />
+                    <Prop name='value' isRequired={true} type='string' default='/' description='Item value.' />
+                    <Prop name='allowSeconds' isRequired={true} type='string' default='/' description='Allow seconds.' />
+                    <Prop name='required' isRequired={false} type='boolean' default='false' description='Mark field as required.' />
+                    <Prop name='disabled' isRequired={false} type='boolean' default='false' description='Mark field as disabled.' />
                 </PropsList>
 
                 <h3 className='docs-page__h3'>Events</h3>
                 <PropsList>
-                    <Prop name='onChange' isRequired={true} type='function' default='/' description='Returns value of time input' />
+                    <Prop name='onChange' isRequired={true} type='function' default='/' description='Returns value of time input.' />
                 </PropsList>
             </section>
         );

package/examples/pages/react/TreeSelect.tsx

@@ -183,7 +183,7 @@ export class TreeSelectDocs extends React.Component<{}, IState> {
                                     error={'Error Message'}
                                     required
                                     label={'TreeSelect Label'}
-                                    singleLevelSearch
+
                                 />
                             </div>
                         </div>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "superdesk-ui-framework",
-  "version": "3.0.1-beta.7",
+  "version": "3.0.1-beta.9",
   "license": "AGPL-3.0",
   "repository": {
     "type": "git",
@@ -24,7 +24,7 @@
     "lint": "eslint --parser=@typescript-eslint/parser app && tslint -c tslint.json 'app-typescript/**/*.{ts,tsx}'",
     "lint-fix": "tsc -p tsconfig.json --noEmit && tslint --fix -c tslint.json 'app-typescript/**/*.{ts,tsx}'",
     "prepublishOnly": "npm run build",
-    "prepublish": "patch-package"
+    "postinstall": "patch-package"
   },
   "devDependencies": {
     "@types/chart.js": "^2.9.24",

package/react/components/EmptyState.d.ts

@@ -4,6 +4,7 @@ interface IProps {
     size?: 'small' | 'large';
     title: string;
     description?: string;
+    absolutePositioned?: boolean;
 }
 export declare class EmptyState extends React.PureComponent<IProps> {
     render(): JSX.Element;

package/react/components/EmptyState.js

@@ -53,7 +53,7 @@ var EmptyState = /** @class */ (function (_super) {
             _a["content-state__image--".concat(this.props.size)] = this.props.size || this.props.size !== undefined,
             _a));
         var image = require("../../app/img/empty_states/empty-state--".concat(this.props.size ? this.props.size : 'small', "-").concat(this.props.illustration ? this.props.illustration : '1', ".svg"));
-        return (React.createElement("div", { className: 'content-state--empty-container' },
+        return (React.createElement("div", { className: 'content-state--empty-container' + (this.props.absolutePositioned ? ' content-state__empty-container--absolute' : '') },
             React.createElement("div", { className: 'content-state__empty-info' },
                 React.createElement("figure", { className: classes },
                     React.createElement("img", { src: image, alt: this.props.illustration })),

package/react/components/Form/FormRowNew.d.ts

@@ -0,0 +1,12 @@
+import * as React from 'react';
+interface IProps {
+    children: React.ReactNode;
+    spaces?: 'default' | 'condensed' | 'relaxed';
+    marginBottom?: '0' | '1' | '2' | '3' | '4';
+    inlineLabels?: boolean;
+    rowLabel?: string;
+}
+export declare class FormRowNew extends React.PureComponent<IProps> {
+    render(): JSX.Element;
+}
+export {};