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

package/dist/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/dist/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/dist/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/dist/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/dist/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/dist/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/dist/sd_icons.svg

@@ -7,15 +7,15 @@
 <font-face units-per-em="1024" ascent="960" descent="-64" />
 <missing-glyph horiz-adv-x="1024" />
 <glyph unicode="&#x20;" horiz-adv-x="512" d="" />
-<glyph unicode="&#xe600;" glyph-name="photo" d="M656 421.394c0-79.171-64.181-143.352-143.352-143.352s-143.352 64.181-143.352 143.352c0 79.171 64.181 143.352 143.352 143.352s143.352-64.181 143.352-143.352zM860 768h-140l-112 128h-192l-112-128h-140c-55.228 0-100-44.772-100-100v-504c0-55.228 44.772-100 100-100h696c55.228 0 100 44.772 100 100v504c0 55.228-44.772 100-100 100zM512 197.408c-123.64 0-223.986 100.346-223.986 223.986 0 123.642 100.346 223.988 223.986 223.988s223.986-100.346 223.986-223.988c0-123.64-100.346-223.986-223.986-223.986z" />
-<glyph unicode="&#xe601;" glyph-name="video" d="M768 576v192c0 31.318-32.682 64-64 64h-640c-31.318 0-64-32.682-64-64v-576c0-31.318 32.682-64 64-64h640c31.318 0 64 32.682 64 64v192l256-192v575.854l-256-191.854z" />
+<glyph unicode="&#xe600;" glyph-name="photo" d="M608 896l112-128h140c55.228 0 100-44.772 100-100v-504c0-55.228-44.772-100-100-100h-696c-55.228 0-100 44.772-100 100v504c0 55.228 44.772 100 100 100h140l112 128zM512 645.382c-123.64 0-223.986-100.346-223.986-223.988 0-123.64 100.346-223.986 223.986-223.986s223.986 100.346 223.986 223.986c0 123.642-100.346 223.988-223.986 223.988zM512.648 564.746c79.118 0 143.352-64.234 143.352-143.352s-64.234-143.352-143.352-143.352-143.352 64.234-143.352 143.352 64.234 143.352 143.352 143.352z" />
+<glyph unicode="&#xe601;" glyph-name="video" d="M768 544v160c0 35.346-28.654 64-64 64h-576c-35.346 0-64-28.654-64-64v-512c0-35.346 28.654-64 64-64h576c35.346 0 64 28.654 64 64v160l192-160v512z" />
 <glyph unicode="&#xe602;" glyph-name="map-marker" d="M512 896c-173.828 0-314.416-140.59-314.416-314.416 0-235.814 314.416-581.584 314.416-581.584s314.416 345.77 314.416 581.584c0 173.826-140.588 314.416-314.416 314.416zM512 469.292c-61.986 0-112.292 50.306-112.292 112.292s50.306 112.292 112.292 112.292 112.292-50.306 112.292-112.292-50.308-112.292-112.292-112.292z" />
 <glyph unicode="&#xe603;" glyph-name="slideshow" d="M64 617.91l-34-13.366c-11.238-4.506-19.029-15.308-19.029-27.93 0-3.953 0.764-7.727 2.153-11.184l-0.072 0.202 50.948-129.576v181.854zM931.498 576h-772.898c-16.9 0-30.6-13.7-30.6-30.6v0-578.8c0-16.9 13.7-30.6 30.6-30.6h772.896c16.9 0 30.6 13.7 30.6 30.6v0 578.8c0 16.899-13.699 30.599-30.598 30.6v0zM192 64l192 256 128-176 176 272 208-352h-704zM655.272 720l101.186-80h206.28l-101.8 258.926c-4.515 11.259-15.337 19.065-27.982 19.065-3.96 0-7.741-0.766-11.204-2.157l0.202 0.072-701.766-275.906h518.348z" />
-<glyph unicode="&#xe604;" glyph-name="text" d="M831.6 896h-639.2c-35.4 0-64.4-29-64.4-64.4v-703c0-35.4 29-64.4 64.4-64.4h639c35.4 0 64.4 29 64.4 64.4v703c0.2 35.4-28.8 64.4-64.2 64.4zM704 256h-384v64h384v-64zM704 384h-384v64h384v-64zM704 512h-384v64h384v-64zM704 640h-384v64h384v-64z" />
-<glyph unicode="&#xe605;" glyph-name="file" d="M896 576l-320 320h-320.666c-34.936-0.105-63.229-28.398-63.334-63.324v-769.342c0.105-34.936 28.398-63.229 63.324-63.334h577.342c34.936 0.105 63.229 28.398 63.334 63.324v512.676zM832 576h-256v256z" />
+<glyph unicode="&#xe604;" glyph-name="text" d="M832 896h-640c-35.4 0-64-28.6-64-64v-768c0-35.4 28.6-64 64-64h640c35.4 0 64.001 28.6 64.001 64v768c0.199 35.4-28.601 64-64.001 64zM704 256h-384v64h384zM704 384h-384v64h384zM704 512h-384v64h384zM704 640h-384v64h384z" />
+<glyph unicode="&#xe605;" glyph-name="file" d="M896 576l-320 320h-384c-34.706 0-64-29.294-64-64v-768c0-34.706 29.294-64 64-64h640c34.706 0 64 29.294 64 64zM832 576h-192c-35.346 0-64 28.654-64 64v192z" />
 <glyph unicode="&#xe606;" glyph-name="calender" d="M256 512h256v-256h-256zM896 832h-64v64h-128v-64h-384v64h-128v-64h-64c-43.316 0-64-20.684-64-64v-704c0-43.316 20.684-64 64-64h768c43.316 0 64 20.684 64 64v704c0 43.316-20.684 64-64 64zM896 64h-768v576h768v-576z" />
 <glyph unicode="&#xe607;" glyph-name="composite" d="M64 896h896v-192h-896zM128 640v-512c0-35.346 28.654-64 64-64h640c35.346 0 64 28.654 64 64v512h-768zM704 448h-384v128h384v-128z" />
-<glyph unicode="&#xe608;" glyph-name="audio" d="M0 640v-320h192l320-256v832l-320-256h-192zM710.152 478.396c0 94.98-54.734 176.544-134.152 216.252v-431.968c79.418 39.174 134.152 120.738 134.152 215.716zM576 949v-110.54c155.078-46.148 268.302-189.958 268.302-360.062s-113.224-313.916-268.302-360.064v-110.54c215.178 48.832 375.624 240.936 375.624 470.604s-160.446 421.77-375.624 470.602z" />
+<glyph unicode="&#xe608;" glyph-name="audio" d="M0 640v-320h192l320-256v832l-320-256zM710.152 478.396c0 94.98-54.734 176.544-134.152 216.252v-431.968c79.418 39.174 134.152 120.738 134.152 215.716zM576 949v-110.54c155.078-46.148 268.302-189.958 268.302-360.062s-113.224-313.916-268.302-360.064v-110.54c215.178 48.832 375.624 240.936 375.624 470.604s-160.446 421.77-375.624 470.602z" />
 <glyph unicode="&#xe609;" glyph-name="stream" d="M832 768h-640c-35.346 0-64-28.654-64-64v-64c0-35.346 28.654-64 64-64h640c35.346 0 64 28.654 64 64v64c0 35.346-28.654 64-64 64zM256 640h-64v64h64v-64zM832 512h-640c-35.346 0-64-28.652-64-64v-64c0-35.348 28.654-64 64-64h640c35.346 0 64 28.652 64 64v64c0 35.348-28.654 64-64 64zM256 384h-64v64h64v-64zM832 256h-640c-35.346 0-64-28.652-64-64v-64c0-35.348 28.654-64 64-64h640c35.346 0 64 28.652 64 64v64c0 35.348-28.654 64-64 64zM256 128h-64v64h64v-64z" />
 <glyph unicode="&#xe60a;" glyph-name="ingest" d="M832 384v-256h-640v256h-128v-384h896v384zM770 512h-190v256h-132v-256h-192l256-256zM384 256h-128v-64h192zM768 192v64h-128l-64-64z" />
 <glyph unicode="&#xe60b;" glyph-name="archive" d="M960 768h-320v-320h128l-224-256-224 256h128v320h-320c-35.346 0-64-28.654-64-64v-192h64v-448c0-35.346 28.654-64 64-64h704c35.346 0 64 28.654 64 64v448h64v192c0 35.346-28.654 64-64 64z" />
@@ -47,7 +47,7 @@
 <glyph unicode="&#xe625;" glyph-name="upload" d="M544 704l-416-384h256v-384h320v384h256l-416 384zM960 832v128h-832v-128h832z" />
 <glyph unicode="&#xe626;" glyph-name="repeat" d="M511.408 119.25c-182.558 0-330.48 148.006-330.48 330.478s147.922 330.48 330.48 330.48c146.956 0 202.996-64.658 202.996-64.658l-122.404-139.55h304v336l-102.712-110.676c0 0-98.958 87.77-281.88 87.77-242.24 0-439.376-197.050-439.376-439.3 0-242.226 197.136-439.28 439.376-439.28 242.238 0.002 439.592 195.26 439.592 437.486h-103c0-182.538-154.044-328.75-336.592-328.75z" />
 <glyph unicode="&#xe627;" glyph-name="refresh" d="M180.95 448c-0.002 0.576-0.022 1.15-0.022 1.728 0 182.472 147.922 330.48 330.48 330.48 146.956 0 202.996-64.658 202.996-64.658l-122.404-139.55h304v336l-102.712-110.676c0 0-98.958 87.77-281.88 87.77-242.24 0-439.376-197.050-439.376-439.3 0-0.6 0.020-1.196 0.022-1.796h108.896zM843.050 448c0.002-0.576 0.022-1.15 0.022-1.728 0-182.472-147.922-330.48-330.48-330.48-146.956 0-202.996 64.658-202.996 64.658l122.404 139.55h-304v-336l102.712 110.676c0 0 98.958-87.77 281.88-87.77 242.24 0 439.376 197.050 439.376 439.3 0 0.6-0.020 1.196-0.022 1.796h-108.896z" />
-<glyph unicode="&#xe628;" glyph-name="list-alt" d="M836.694 896h-649.388c-32.754 0-59.306-26.552-59.306-59.306v-777.388c0-32.754 26.552-59.306 59.306-59.306v0h649.388c32.754 0 59.306 26.552 59.306 59.306v0 777.388c0 32.754-26.552 59.306-59.306 59.306v0zM320 256h-64v64h64v-64zM320 384h-64v64h64v-64zM320 512h-64v64h64v-64zM320 640h-64v64h64v-64zM768 256h-384v64h384v-64zM768 384h-384v64h384v-64zM768 512h-384v64h384v-64zM768 640h-384v64h384v-64z" />
+<glyph unicode="&#xe628;" glyph-name="list-alt" d="M832 896h-640c-34.7 0-64-29.3-64-64v-768c0-32.7 29.3-64 64-64h640c34.7 0 64 29.3 64 64v768c0 34.7-29.3 64-64 64zM320 256h-64v64h64zM320 384h-64v64h64zM320 512h-64v64h64zM320 640h-64v64h64zM768 256h-384v64h384zM768 384h-384v64h384zM768 512h-384v64h384zM768 640h-384v64h384z" />
 <glyph unicode="&#xe629;" glyph-name="plus-large" d="M896 512h-320v320h-128v-320h-320v-128h320v-320h128v320h320z" />
 <glyph unicode="&#xe62a;" glyph-name="picture" d="M960 128.284v639.432c0 35.503-28.781 64.284-64.284 64.284v0h-767.432c-35.503 0-64.284-28.781-64.284-64.284v0-639.432c0-35.503 28.781-64.284 64.284-64.284v0h767.432c35.503 0 64.284 28.781 64.284 64.284v0zM336 432l128-144.556 176 272.556 256-368h-752z" />
 <glyph unicode="&#xe62b;" glyph-name="question-sign" d="M512 895.998c-247.424 0-448-200.578-448-448s200.576-448 448-448 448 200.578 448 448-200.576 448-448 448zM576 128h-128v128h128v-128zM512 320c-54.666 0-64 0-64 0v112c0 0 178.666-35.334 178.666 101.334 0 54.666-27.334 109.334-109.334 109.334-109.332-0.002-109.332-109.334-109.332-109.334h-109.334c0 0 0 218.666 218.666 218.666 109.334 0 218.668-54.666 218.668-218.666 0-136.668-87.334-213.334-224-213.334z" />
@@ -79,7 +79,7 @@
 <glyph unicode="&#xe645;" glyph-name="plus-small" d="M768 512h-192v192h-128v-192h-192v-128h192v-192h128v192h192z" />
 <glyph unicode="&#xe646;" glyph-name="minus-small" d="M256 512h512v-128h-512v128z" />
 <glyph unicode="&#xe647;" glyph-name="close-small" d="M835.672 203.3l-244.004 243.878 241.518 241.594-77.296 77.098-243.812-243.824-243.75 243.694-77.17-77.36 242.092-242.032-243.75-243.67 79.72-79.588 241.966 242.086 243.238-243.176z" />
-<glyph unicode="&#xe648;" glyph-name="post" d="M896 832h-768c-33 0-64-33-64-64v-704l192 192h640c32 0 64 30 64 64v448c0 31-30 64-64 64zM640 384h-384v64h384v-64zM768 512h-512v64h512v-64zM768 640h-512v64h512v-64z" />
+<glyph unicode="&#xe648;" glyph-name="post" d="M896 832h-768c-33.3 0-64-28.7-64-64v-704l192 192h640c34.7 0 64 29.3 64 64v448c0 34.7-29.3 64-64 64zM640 384h-384v64h384zM768 512h-512v64h512zM768 640h-512v64h512z" />
 <glyph unicode="&#xe649;" glyph-name="external" d="M832 128l-640.588-0.586 0.588 640.586h192v128h-192.588c-70.714 0-127.412-57.336-127.412-127.414v-640.586c0-70.078 56.698-128 127.412-128h641.174c70.078 0 127.414 57.336 127.414 127.414v192.586h-127.412l-0.588-192zM512 896v-128h224l-424-424 96-96 424 424v-224l128-0.126v448.126z" />
 <glyph unicode="&#xe64a;" glyph-name="chevron-up-thin" d="M857.518 349.148l-345.204 354.852-338.98-358.16 74.562-70.562 265.484 280.518 270.562-278.214z" />
 <glyph unicode="&#xe64b;" glyph-name="chevron-down-thin" d="M167.282 630.128l345.204-354.85 338.98 358.16-74.562 70.562-265.484-280.52-270.562 278.216z" />
@@ -186,4 +186,11 @@
 <glyph unicode="&#xe6b0;" glyph-name="arrow_small" d="M320 320v-64h64l256 256v-192h128v384h-384v-128h192z" />
 <glyph unicode="&#xe6b1;" glyph-name="clean_all" d="M769.032 480c-0.594 25.87-1.032 52.57-1.032 80 0 48-35.818 80-80 80h-112l16 176c0 44.182-35.818 80-80 80s-80-35.818-80-80l16-176h-112c-44.182 0-80-32-80-80 0-12.182-0.824-41.216-4.972-80h518.004zM247.082 448c-16.21-116.3-61.060-289.664-183.082-384 8.212 0 112.528 0 220.346 0 48.088 48.254 71.068 91.66 96 159.25 0.452 1.226 2.272 0.86 2.25-0.446-1.38-76.748-25.394-132.882-39.074-158.802 61.704 0 125.992 0 182.998 0 21.324 28.882 34.74 62.266 46.144 95.41 0.37 1.074 1.77 0.564 1.686-0.582-3.252-44.010-7.996-74.162-12.97-94.828 10.592 0 20.838 0 30.62 0 193.734 0 184.006 155.668 177.84 384h-522.758z" />
 <glyph unicode="&#xe6b2;" glyph-name="broascast" d="M896 704h-293.786l210.586 210.586-44.8 45.414-256-256-256 256-45.414-45.414 211.2-210.586h-293.786c-70.4 0-128-56.986-128-128v-512c0-70.4 57.6-128 128-128h768c70.4 0 128 57.6 128 128v512c0 71.014-57.6 128-128 128zM128 64v512h768v-512zM704 320l-320-192v384z" />
+<glyph unicode="&#xe6b3;" glyph-name="photo-cancel" d="M67.882 891.8l123.8-123.8h0.228l175.541-175.541-0.123-0.105 57.603-57.603c0.043 0.033 0.086 0.066 0.129 0.1l201.045-201.045-0.101-0.128 56.955-56.956c0.035 0.041 0.070 0.083 0.105 0.124l207.943-207.946-0.174-0.053 65.174-65.174-67.882-67.882-128.208 128.208h-595.918c-54.676 0-99.104 43.881-99.987 98.346l-0.013 1.654v504c0 25.557 9.588 48.875 25.363 66.554l-89.363 89.364zM608 896l112-128h140c54.676 0 99.104-43.881 99.987-98.346l0.013-1.654v-504c0-8.682-1.107-17.106-3.186-25.139l-227.618 227.619c4.434 17.573 6.79 35.97 6.79 54.914 0 123.642-100.346 223.988-223.986 223.988-18.944 0-37.342-2.356-54.916-6.79l-142.036 142.034 100.952 115.374zM288.014 421.394c0-123.64 100.346-223.986 223.986-223.986 33.528 0 65.344 7.379 93.91 20.601l-63.198 63.196c-9.696-2.072-19.753-3.163-30.063-3.163-79.118 0-143.352 64.234-143.352 143.352 0 10.31 1.091 20.368 3.163 30.063l-63.845 63.846c-13.221-28.566-20.6-60.381-20.6-93.91zM532.268 563.412c63.434-8.698 113.7-58.963 122.398-122.398z" />
+<glyph unicode="&#xe6b4;" glyph-name="video-cancel" d="M67.882 891.8l123.796-123.796 0.23-0.002 764.1-764.328-67.882-67.882-192.21 192.21-567.916-0.002c-34.993 0-63.426 28.084-63.991 62.942l-0.009 1.058v512c0 15.615 5.592 29.924 14.884 41.034l-78.884 78.884zM327.672 768.002l376.328-0.002c34.993 0 63.426-28.084 63.991-62.942l0.009-1.058v-160l192 160v-512l-192 160v-24.324z" />
+<glyph unicode="&#xe6b5;" glyph-name="text-cancel" d="M896 63.882l60.212-60.213-67.882-67.882-64.212 64.213h-632.118c-35.046 0-63.427 28.031-63.991 62.94l-0.009 1.060v632.118l-127.796 127.795 67.882 67.882 59.914-59.914v0.234l768-767.998zM832 896c35.046 0 63.623-28.031 63.998-62.94l0.003-1.060-0.001-632.118-192 192v56.118h-56.118l-64 64h120.118v64h-184.118l-64 64h248.118v64h-312.118l-192 192zM504.116 320.002l-184.116-0.002v-64h248.118zM376.118 448h-56.118v-64h120.118z" />
+<glyph unicode="&#xe6b6;" glyph-name="file-cancel" d="M67.882 891.8l60.116-60.114 0.002 0.226 828.009-828.238-67.882-67.882-64.208 64.208h-631.918c-34.359 0-63.414 28.711-63.991 62.96l-0.009 1.040-0.002 631.92-127.998 127.998zM576 896l320-320v-376.324l-696.322 696.324zM576 832v-192c0-34.993 28.084-63.426 62.942-63.991l1.058-0.009h192z" />
+<glyph unicode="&#xe6b7;" glyph-name="audio-cancel" d="M67.882 891.8l195.052-195.052 0.128 0.102 477.43-477.66c0.037 0.039 0.074 0.077 0.111 0.116l75.807-75.805-0.114-0.115 139.712-139.712-67.882-67.882-145.282 145.284c-48.898-33.743-104.339-58.713-164.049-72.639l-2.796-0.643v110.54c31.797 9.462 61.834 23.030 89.496 40.088l-153.496 153.496v-247.918l-320 256h-192v320h183.918l-183.918 183.918zM576 949c215.178-48.832 375.624-240.934 375.624-470.602 0-95.32-27.637-184.169-75.354-258.991l-78.258 78.258c29.502 53.629 46.29 115.232 46.29 180.733 0 168.403-110.971 311.035-263.662 358.648l-4.64 1.414zM576 694.648c79.418-39.708 134.152-121.272 134.152-216.252 0-27.892-4.72-54.628-13.4-79.473l-120.752 120.751zM512 896v-312.326l-173.516 173.514z" />
+<glyph unicode="&#xe6b8;" glyph-name="list-alt-cancel" d="M67.882 891.8l60.116-60.116 0.002 0.228 128-128-0.002-0.228 63.684-63.684h0.23l64.088-64.088-0.002-0.228 63.684-63.684h0.23l64-64h-0.23l64-64h0.23l64-64h-0.23l64-64h0.23l192.088-192.088-0.004-0.226 60.012-60.012-67.882-67.882-64.208 64.208h-631.918c-34.353 0-63.413 30.677-63.991 63.019l-0.009 0.981-0.002 631.92-127.998 127.998zM832 896c34.353 0 63.413-28.717 63.991-62.961l0.009-1.039v-632.324l-184.324 184.324h56.324v64h-120.324l-63.998 64h184.322v64h-248.322l-64 64h312.322v64h-376.322l-192 192zM567.918 256l-64 64h-119.918v-64zM320 320h-64v-64h64zM439.918 384l-55.92 55.92 0.002-55.92zM320 448h-64v-64h64zM255.998 567.92l0.002-55.92h55.918z" />
+<glyph unicode="&#xe6b9;" glyph-name="post-cancel" d="M67.882 891.8l59.8-59.8 0.228 0.002 128.090-128.092v-0.228l63.68-63.68h0.228l64-64h-0.228l64-64h0.228l64-64h-0.228l64-64h0.23l128-128h-0.23l252.328-252.328-67.882-67.882-320.21 320.21-311.916-0.002-192-192v695.918l-64 64zM896 832c34.353 0 63.413-28.717 63.991-62.961l0.009-1.039v-448c0-34.353-28.717-63.413-62.961-63.991l-1.039-0.009-56.326 0.002-256.002 256 184.328-0.002v64l-248.328 0.002-64 64 312.328-0.002v64l-376.328 0.002-128 128zM439.916 384.002l-64 64-119.916-0.002v-64zM311.916 512.002l-55.916 55.916v-55.918z" />
 </font></defs></svg>