superdesk-ui-framework 6.1.0-dev1 → 7.0.0-dev-hg0

package/dist/design-patterns/ThreePaneLayoutPattern.tsx

@@ -1,378 +0,0 @@
-import * as React from 'react';
-import * as Markup from '../../js/react';
-import {Prop, PropsList} from '../../../app-typescript';
-import {
-    ButtonGroup,
-    Button,
-    NavButton,
-    SubNav,
-    Dropdown,
-    Icon,
-    IconButton,
-    Checkbox,
-    GridList,
-    Badge,
-    Divider,
-    BoxedList,
-    BoxedListItem,
-    EmptyState,
-    Tooltip,
-    Heading,
-    Container,
-    Label,
-} from '../../../app-typescript/index';
-import * as Layout from '../../../app-typescript/components/Layouts';
-
-interface IProps {
-    children?: React.ReactNode;
-}
-
-interface IState {
-    theme: 'dark' | 'light' | string;
-    itemType: string;
-    dropDownState: string;
-    itemSelected1: boolean;
-    itemSelected2: boolean;
-    itemSelected3: boolean;
-    value1: boolean;
-    leftPanelOpen: boolean;
-    rightPanelOpen: boolean;
-}
-
-class ThreePaneLayoutPattern extends React.Component<IProps, IState> {
-    constructor(props: IProps) {
-        super(props);
-        this.state = {
-            theme: 'light',
-            itemType: 'itemtype01',
-            dropDownState: '',
-            itemSelected1: false,
-            itemSelected2: false,
-            itemSelected3: false,
-            value1: false,
-            leftPanelOpen: false,
-            rightPanelOpen: false,
-        };
-    }
-
-    changeStatus(item: any, status: string) {
-        if (item.status.includes(status)) {
-            item.status.splice(item.status.indexOf(status), 1);
-        } else {
-            item.status.push(status);
-        }
-    }
-
-    render() {
-        return (
-            <section className="docs-page__container">
-                <h2 className="docs-page__h2">Three Pane Layout</h2>
-
-                <Markup.ReactMarkupCodePreview>
-                    {`
-                    <PageLayout
-                        header={(
-                            ...
-                        )}
-                        leftPanelOpen={true}
-                        leftPanel={(
-                            ...
-                        )}
-                        rightPanelOpen={false}
-                        rightPanel={(
-                            ...
-                        )}
-                        main={(
-                            ...
-                        )}
-                    />
-                `}
-                </Markup.ReactMarkupCodePreview>
-
-                <p className="docs-page__paragraph"></p>
-
-                <Markup.ReactMarkup>
-                    <Markup.ReactMarkupPreview>
-                        <div style={{height: 600}} className="sd-border--light">
-                            <Layout.PageLayout
-                                fullHeight={true}
-                                header={
-                                    <SubNav>
-                                        <ButtonGroup align="inline">
-                                            <Tooltip text="Click to toggle left panel" flow="right">
-                                                <NavButton
-                                                    type="darker"
-                                                    icon="filter-large"
-                                                    onClick={() =>
-                                                        this.setState({leftPanelOpen: !this.state.leftPanelOpen})
-                                                    }
-                                                />
-                                            </Tooltip>
-                                        </ButtonGroup>
-                                        <Heading type="h3" className="ms-2">
-                                            Layout example
-                                        </Heading>
-                                        <ButtonGroup align="end">
-                                            <NavButton icon="dots-vertical" onClick={() => false} />
-                                        </ButtonGroup>
-                                    </SubNav>
-                                }
-                                leftPanelOpen={this.state.leftPanelOpen}
-                                leftPanel={
-                                    <Layout.Panel
-                                        side="left"
-                                        background="grey"
-                                        open={this.state.leftPanelOpen}
-                                        size="x-small"
-                                    >
-                                        <Layout.PanelHeader
-                                            title="Left Panel title"
-                                            onClose={() => this.setState({leftPanelOpen: false})}
-                                        />
-                                        <Layout.PanelContent>
-                                            <EmptyState
-                                                title={'No content yet'}
-                                                description={'Please come later.'}
-                                                size="small"
-                                                illustration="1"
-                                            />
-                                        </Layout.PanelContent>
-                                    </Layout.Panel>
-                                }
-                                rightPanelOpen={this.state.rightPanelOpen}
-                                rightPanel={
-                                    <Layout.Panel side="right" open={this.state.rightPanelOpen} size="x-small">
-                                        <Layout.PanelHeader
-                                            title="Right Panel title"
-                                            onClose={() => this.setState({rightPanelOpen: false})}
-                                        />
-                                        <Layout.PanelContent>
-                                            <Layout.PanelContentBlock>
-                                                <p className="mb-2">
-                                                    Preview of the items in the main panel would go here.
-                                                </p>
-                                                <p>
-                                                    Maecenas sed diam eget risus varius blandit sit amet non magna.
-                                                    Lorem ipsum dolor sit amet, consectetur adipiscing elit.
-                                                </p>
-                                            </Layout.PanelContentBlock>
-                                        </Layout.PanelContent>
-                                    </Layout.Panel>
-                                }
-                                main={
-                                    <BoxedList>
-                                        <BoxedListItem
-                                            alignVertical="center"
-                                            clickable={true}
-                                            density="compact"
-                                            selected={this.state.rightPanelOpen}
-                                            onClick={() => this.setState({rightPanelOpen: !this.state.rightPanelOpen})}
-                                            actions={
-                                                <IconButton
-                                                    icon="dots-vertical"
-                                                    size="small"
-                                                    ariaValue="More actions"
-                                                    onClick={() => false}
-                                                />
-                                            }
-                                        >
-                                            <Container gap="small">
-                                                <Label style="translucent" text="Published" type="success" />
-                                                <span>Click to open the right panel</span>
-                                            </Container>
-                                        </BoxedListItem>
-                                        <BoxedListItem
-                                            alignVertical="center"
-                                            clickable={true}
-                                            density="compact"
-                                            selected={false}
-                                            onClick={() => false}
-                                            actions={
-                                                <IconButton
-                                                    icon="dots-vertical"
-                                                    size="small"
-                                                    ariaValue="More actions"
-                                                    onClick={() => false}
-                                                />
-                                            }
-                                        >
-                                            <Container gap="small">
-                                                <Label style="translucent" text="In progress" type="warning" />
-                                                <span>Parturient pellentesque aenean commodo</span>
-                                            </Container>
-                                        </BoxedListItem>
-                                        <BoxedListItem
-                                            alignVertical="center"
-                                            clickable={true}
-                                            density="compact"
-                                            selected={false}
-                                            onClick={() => false}
-                                            actions={
-                                                <IconButton
-                                                    icon="dots-vertical"
-                                                    size="small"
-                                                    ariaValue="More actions"
-                                                    onClick={() => false}
-                                                />
-                                            }
-                                        >
-                                            <Container gap="small">
-                                                <Label style="translucent" text="Canceled" type="alert" />
-                                                <span>Lorem fringilla malesuada cursus</span>
-                                            </Container>
-                                        </BoxedListItem>
-                                    </BoxedList>
-                                }
-                            />
-                        </div>
-                    </Markup.ReactMarkupPreview>
-                    <Markup.ReactMarkupCode>
-                        {`
-                        <Layout.PageLayout
-                            header={(
-                                <SubNav>
-                                    <ButtonGroup align="inline">
-                                        <Tooltip text='Click to toggle left panel' flow='right'>
-                                            <NavButton 
-                                                type='darker'
-                                                icon='filter-large'
-                                                onClick={() => this.setState({'leftPanelOpen': !this.state.leftPanelOpen})}
-                                            />
-                                        </Tooltip>
-                                    </ButtonGroup>
-                                    <Heading type='h3' className='ms-2'>Layout example</Heading>
-                                    <ButtonGroup align='end'>
-                                        <NavButton 
-                                            icon='dots-vertical'
-                                            onClick={()=> false}
-                                        />
-                                    </ButtonGroup>
-                                </SubNav>
-                            )}
-                            leftPanelOpen={this.state.leftPanelOpen}
-                            leftPanel={(
-                                <Layout.Panel
-                                    side='left'
-                                    background='grey'
-                                    open={this.state.leftPanelOpen}
-                                    size='x-small'
-                                >
-                                    <Layout.PanelHeader
-                                        title='Left Panel title'
-                                        onClose={() => this.setState({'leftPanelOpen': false})}
-                                    />
-                                    <Layout.PanelContent>
-                                        <EmptyState
-                                            title={'No content yet'} 
-                                            description={'Please come later.'} 
-                                            size='small' 
-                                            illustration="1"
-                                        />
-                                    </Layout.PanelContent>
-                                </Layout.Panel>
-                            )}
-                            rightPanelOpen={this.state.rightPanelOpen}
-                            rightPanel={(
-                                <Layout.Panel
-                                    side='right'
-                                    open={this.state.rightPanelOpen}
-                                    size='x-small'
-                                >
-                                    <Layout.PanelHeader
-                                        title='Right Panel title'
-                                        onClose={() => this.setState({'rightPanelOpen': false})}
-                                    />
-                                    <Layout.PanelContent>
-                                        <Layout.PanelContentBlock>
-                                            <p className='mb-2'>
-                                                Preview of the items in the main panel would go here.
-                                            </p>
-                                            <p>
-                                                Maecenas sed diam eget risus varius blandit sit amet non magna.
-                                                Lorem ipsum dolor sit amet, consectetur adipiscing elit.
-                                            </p>
-                                        </Layout.PanelContentBlock>
-                                    </Layout.PanelContent>
-                                </Layout.Panel>
-                            )}
-                            main={(
-                                <BoxedList>
-                                    <BoxedListItem
-                                        alignVertical='center'
-                                        clickable={true}
-                                        density='compact'
-                                        selected={this.state.rightPanelOpen}
-                                        onClick={() => this.setState({rightPanelOpen: !this.state.rightPanelOpen})}
-                                        actions={(
-                                            <IconButton
-                                                icon="dots-vertical"
-                                                size='small'
-                                                ariaValue="More actions"
-                                                onClick={()=> false}
-                                            />
-                                        )}
-                                    >
-                                        <Container gap='small' >
-                                            <Label style='translucent' text='Published' type='success' />
-                                            <span>Click to open the right panel</span>
-                                        </Container>
-                                    </BoxedListItem>
-                                    <BoxedListItem
-                                        alignVertical='center'
-                                        clickable={true}
-                                        density='compact'
-                                        selected={false}
-                                        onClick={()=> false}
-                                        actions={(
-                                            <IconButton
-                                                icon="dots-vertical"
-                                                size='small'
-                                                ariaValue="More actions"
-                                                onClick={()=> false}
-                                            />
-                                        )}
-                                    >
-                                        <Container gap='small' >
-                                            <Label style='translucent' text='In progress' type='warning' />
-                                            <span>Parturient pellentesque aenean commodo</span>
-                                        </Container>
-                                    </BoxedListItem>
-                                    <BoxedListItem
-                                        alignVertical='center'
-                                        clickable={true}
-                                        density='compact'
-                                        selected={false}
-                                        onClick={()=> false}
-                                        actions={(
-                                            <IconButton
-                                                icon="dots-vertical"
-                                                size='small'
-                                                ariaValue="More actions"
-                                                onClick={()=> false}
-                                            />
-                                        )}
-                                    >
-                                        <Container gap='small' >
-                                            <Label style='translucent' text='Canceled' type='alert' />
-                                            <span>Lorem fringilla malesuada cursus</span>
-                                        </Container>
-                                    </BoxedListItem>
-                                </BoxedList>
-                            )}
-                        />   
-                    `}
-                    </Markup.ReactMarkupCode>
-                </Markup.ReactMarkup>
-
-                {/* <h3 className="docs-page__h3">Props</h3>
-                <PropsList>
-                    <Prop name='size' isRequired={false} type='x-small | small | medium | large' default='small' description='Specifies the size of the items in the grid. '/>
-                    <Prop name='gap' isRequired={false} type='small | medium | large | x-large' default='small' description='Defines the gap between the items inside the Grid list. '/>
-                    <Prop name='margin' isRequired={false} type='0 | 1 | 2 | 3' default='3' description='Defines the margin around the Grid list. The values are based on multipliers of the the $sd-base-increment (equal to 8px). Setting the value to 3 results in a margin of 24px.'/>
-                </PropsList> */}
-            </section>
-        );
-    }
-}
-
-export {ThreePaneLayoutPattern};

package/dist/design-patterns.html

@@ -1,14 +0,0 @@
-<header class="docs-page__header">
-    <a href="#/" class="docs-page__header-logo"></a>
-    <h1 class="docs-page__h1">Superdesk UI</h1>
-    <ul class="docs-page__header-nav">
-        <li class="docs-page__header-nav-item"><a class="docs-page__header-nav-link" href="#/">Home</a></li>
-        <li class="docs-page__header-nav-item"><a class="docs-page__header-nav-link" href="#/components">Components</a></li>
-        <li class="docs-page__header-nav-item docs-page__header-nav-item--active"><a class="docs-page__header-nav-link" href="#/design-patterns">Design Patterns</a></li>
-        <li class="docs-page__header-nav-item"><a class="docs-page__header-nav-link" href="#/design">Design guidelines</a></li>
-        <li class="docs-page__header-nav-item"><a class="docs-page__header-nav-link" href="#/playgrounds">Playground</a></li>
-    </ul>
-    <doc-theme-picker></doc-theme-picker>
-</header>
-
-<doc-design-patterns class="d-contents"></doc-react>

package/dist/design.html

@@ -1,39 +0,0 @@
-<header class="docs-page__header">
-    <a href="#/" class="docs-page__header-logo"></a>
-    <h1 class="docs-page__h1">Superdesk UI</h1>
-    <ul class="docs-page__header-nav">
-        <li class="docs-page__header-nav-item"><a class="docs-page__header-nav-link" href="#/">Home</a></li>
-        <li class="docs-page__header-nav-item"><a class="docs-page__header-nav-link" href="#/components">Components</a></li>
-        <li class="docs-page__header-nav-item"><a class="docs-page__header-nav-link" href="#/design-patterns">Design Patterns</a></li>
-        <li class="docs-page__header-nav-item docs-page__header-nav-item--active"><a class="docs-page__header-nav-link" href="#/design">Design guidelines</a></li>
-        <li class="docs-page__header-nav-item"><a class="docs-page__header-nav-link" href="#/playgrounds">Playground</a></li>
-    </ul>
-    <doc-theme-picker></doc-theme-picker>
-</header>
-
-<aside class="docs-page__sidebar">
-    <ul class="docs-page__nav" doc-nav>
-        <li ng-repeat="group in design">
-            <span class="docs-page__nav-title">{{group.name}}</span>
-            <ul class="docs-page__nav--sub-level">
-                <li class="docs-page__nav-item" ng-repeat="(name, item) in group.items">
-                    <a ng-class="{'docs-page__nav-item--active': isActive(name)}" href="#/design/{{name}}">{{item.name}}</a>
-                </li>
-            </ul>
-        </li>
-    </ul>
-</aside>
-
-<main class="docs-page__content docs-page__container-fluid" ng-if="page" ng-include="'design/' + page + '.html'"></main>
-
-<main class="docs-page__content docs-page__container-fluid" ng-if="!page">
-    <section class="docs-page__container">
-        <div class="docs-page__hero">
-            <figure class="docs-page__hero-image">
-                <img src="/illustration--design.svg" alt="Design guidelines">
-            </figure>
-            <h2 class="docs-page__hero-h2 docs-page__color--primary">Superdesk Design guidelines</h2>
-            <p class="docs-page__hero-text">What to do and what not while creating user interfaces in Superdesk.</p>
-        </div>
-    </section>
-</main>

package/dist/design_ilustration.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" id="Layer_1" width="300" height="220" x="0" y="0" version="1.1" viewBox="0 0 300 220" xml:space="preserve"><style>.st0{fill:#f1f1f3}.st1{fill:#d2d5d9}.st2{fill:#b8bbc2}.st3{fill:#fff}.st4{fill:#afb3bb}.st5{fill:#dbdde1}.st6{fill:#9bd5ba}.st7{fill:#dbf0e6}.st8{fill:#6dc19b}.st9{fill:#92d1b4}.st10{fill:#5f6776}.st11{fill:#dddfe2}.st12{fill:#828995}.st13{fill:#a6aab3}.st14{fill:#969ba5}.st15{opacity:.59}.st16{fill:#79808d}.st17{fill:#54b789}.st18{fill:#edf7f2}.st19{fill:#848a96}.st20{fill:#edeef0}</style><path d="M24.6 175.6c-.8 0-1.5-.7-1.5-1.5V9c0-.8.7-1.5 1.5-1.5h225.1c.8 0 1.5.7 1.5 1.5v165.1c0 .8-.7 1.5-1.5 1.5H24.6z" class="st0"/><path d="M249.8 8c.6 0 1 .4 1 1v165.1c0 .6-.4 1-1 1H24.6c-.6 0-1-.4-1-1V9c0-.6.4-1 1-1h225.2m0-1H24.6c-1.1 0-2 .9-2 2v165.1c0 1.1.9 2 2 2h225.1c1.1 0 2-.9 2-2V9c.1-1.1-.8-2-1.9-2z" class="st1"/><circle cx="60.2" cy="21.4" r="4" class="st2"/><circle cx="48.6" cy="21.4" r="4" class="st2"/><circle cx="37" cy="21.4" r="4" class="st2"/><g><path d="M240 97.6H34.4c-.4 0-.8-.4-.8-.8V72.3c0-.4.4-.8.8-.8H240c.4 0 .8.4.8.8v24.5c0 .4-.4.8-.8.8z" class="st3"/><circle cx="47.6" cy="84.6" r="8" class="st1"/><path d="M84.7 81.9H62.9c-.6 0-1-.4-1-1v-2c0-.6.4-1 1-1h21.8c.6 0 1 .4 1 1v2c0 .6-.4 1-1 1zM100.9 81.9H91c-.6 0-1-.4-1-1v-2c0-.6.4-1 1-1h9.9c.6 0 1 .4 1 1v2c0 .6-.5 1-1 1z" class="st4"/><path d="M97.2 91.1H62.9c-.6 0-1-.4-1-1v-2c0-.6.4-1 1-1h34.3c.6 0 1 .4 1 1v2c0 .6-.5 1-1 1zM158.6 91.1h-9.2c-.6 0-1-.4-1-1v-2c0-.6.4-1 1-1h9.2c.6 0 1 .4 1 1v2c0 .6-.5 1-1 1zM143.9 91.1h-41.1c-.6 0-1-.4-1-1v-2c0-.6.4-1 1-1h41.1c.6 0 1 .4 1 1v2c0 .6-.4 1-1 1z" class="st5"/></g><g><path d="M240 130.7H34.4c-.4 0-.8-.4-.8-.8v-24.5c0-.4.4-.8.8-.8H240c.4 0 .8.4.8.8v24.5c0 .4-.4.8-.8.8z" class="st6"/><circle cx="47.6" cy="117.7" r="8" class="st3"/><path d="M84.7 115H62.9c-.6 0-1-.4-1-1v-2c0-.6.4-1 1-1h21.8c.6 0 1 .4 1 1v2c0 .6-.4 1-1 1zM131.4 115h-10.7c-.6 0-1-.4-1-1v-2c0-.6.4-1 1-1h10.7c.6 0 1 .4 1 1v2c0 .6-.4 1-1 1zM114.3 115H90.9c-.6 0-1-.4-1-1v-2c0-.6.4-1 1-1h23.4c.6 0 1 .4 1 1v2c0 .6-.4 1-1 1z" class="st3"/><path d="M97.2 124.2H62.9c-.6 0-1-.4-1-1v-2c0-.6.4-1 1-1h34.3c.6 0 1 .4 1 1v2c0 .6-.5 1-1 1zM143.9 124.2h-41.1c-.6 0-1-.4-1-1v-2c0-.6.4-1 1-1h41.1c.6 0 1 .4 1 1v2c0 .6-.4 1-1 1z" class="st7"/></g><g><path d="M240 163.8H34.4c-.4 0-.8-.4-.8-.8v-24.5c0-.4.4-.8.8-.8H240c.4 0 .8.4.8.8V163c0 .4-.4.8-.8.8z" class="st3"/><circle cx="47.6" cy="150.8" r="8" class="st1"/><path d="M93.3 148.1H62.1c-.1 0-.2-.1-.2-.2v-3.6c0-.1.1-.2.2-.2h31.1c.1 0 .2.1.2.2v3.6c.1.1 0 .2-.1.2zM114.3 148.1H98.4c-.6 0-1-.4-1-1v-2c0-.6.4-1 1-1h15.9c.6 0 1 .4 1 1v2c0 .6-.4 1-1 1z" class="st4"/><path d="M97.2 157.4H62.9c-.6 0-1-.4-1-1v-2.1c0-.6.4-1 1-1h34.3c.6 0 1 .4 1 1v2.1c0 .6-.5 1-1 1zM158.6 157.4h-29.3c-.6 0-1-.4-1-1v-2.1c0-.6.4-1 1-1h29.3c.6 0 1 .4 1 1v2.1c0 .6-.5 1-1 1zM123.3 157.4h-20.4c-.6 0-1-.4-1-1v-2.1c0-.6.4-1 1-1h20.4c.6 0 1 .4 1 1v2.1c0 .6-.5 1-1 1z" class="st5"/></g><g><path d="M0 78.3h14v113.9H0z" class="st8"/><path d="M3.7 78.3h6.7v113.9H3.7z" class="st9"/><path d="M4.8 63L7 55.7 9.3 63z" class="st10"/><path d="M9.3 63H4.8L0 78.3h14z" class="st11"/><path d="M9.5 208.9h-5c-2.5 0-4.5-2-4.5-4.5v-8.6h14v8.6c0 2.5-2 4.5-4.5 4.5z" class="st1"/><path d="M0 192.2h14v3.5H0z" class="st12"/></g><g><path d="M289.4 22.7v-3.3c0-1.1-.9-2-2-2h-46.7c-1.5 0-3 .6-4 1.7l-8.2 8.2c-.3.3-.1.7.3.7h36.4v178.4c0 1.1.9 2 2 2h15c1.1 0 2-.9 2-2V28h15.6c.1 0 .2-.1.2-.2v-1.1c0-2.2-1.8-4-4-4h-6.6z" class="st13"/><path d="M267 208.4h4.2V28h-6v178.4c0 1.1.8 2 1.8 2zM282.3 208.4h-4.2V28h6v178.4c0 1.1-.8 2-1.8 2z" class="st14"/><g class="st15"><path d="M279.9 28h4.2v1.6h-4.2zM282 33h2.1v1.6H282zM282 38h2.1v1.6H282zM282 43.1h2.1v1.6H282zM282 48.1h2.1v1.6H282zM279.9 53.1h4.2v1.6h-4.2zM282 68.3h2.1v1.6H282zM282 73.3h2.1v1.6H282zM282 58.2h2.1v1.6H282zM282 63.2h2.1v1.6H282zM279.9 78.3h4.2v1.6h-4.2zM282 83.4h2.1V85H282zM282 88.4h2.1V90H282zM282 93.4h2.1V95H282zM282 98.5h2.1v1.6H282zM279.9 103.5h4.2v1.6h-4.2zM282 108.5h2.1v1.6H282zM282 113.6h2.1v1.6H282zM282 118.6h2.1v1.6H282zM282 123.7h2.1v1.6H282zM279.9 128.7h4.2v1.6h-4.2zM282 133.7h2.1v1.6H282zM282 138.8h2.1v1.6H282zM282 143.8h2.1v1.6H282zM282 148.8h2.1v1.6H282zM279.9 153.9h4.2v1.6h-4.2z" class="st16"/></g><path d="M281.1 53.2v20.3c0 .2.2.4.4.4h5.9c1.1 0 2-.9 2-2V58.1h6.6c2.2 0 4-1.8 4-4V53c0-.1-.1-.2-.2-.2h-18.3c-.2 0-.4.2-.4.4zM228.5 53.5l8.2 8.2c1.1 1.1 2.5 1.7 4 1.7h19.2V72c0 1.1.9 2 2 2h5.9c.2 0 .4-.2.4-.4V53.2c0-.2-.2-.4-.4-.4h-39c-.4 0-.6.5-.3.7z" class="st4"/></g><g><path d="M238.8 49.4h-47.3c-1.1 0-2-.9-2-2v-14c0-1.1.9-2 2-2h47.3c1.1 0 2 .9 2 2v14c0 1.1-.9 2-2 2z" class="st17"/><path d="M214.8 42.4h-16c-.4 0-.8-.4-.8-.8v-2.4c0-.4.4-.8.8-.8h16c.4 0 .8.4.8.8v2.4c0 .4-.3.8-.8.8zM231.3 42.4h-11.9c-.4 0-.8-.4-.8-.8v-2.4c0-.4.4-.8.8-.8h11.9c.4 0 .8.4.8.8v2.4c0 .4-.4.8-.8.8z" class="st18"/></g><g><path d="M183.4 49.4h-47.3c-1.1 0-2-.9-2-2v-14c0-1.1.9-2 2-2h47.3c1.1 0 2 .9 2 2v14c0 1.1-.9 2-2 2z" class="st19"/><path d="M154.5 42.4h-11.1c-.4 0-.8-.4-.8-.8v-2.4c0-.4.4-.8.8-.8h11.1c.4 0 .8.4.8.8v2.4c0 .4-.3.8-.8.8zM175.9 42.4H159c-.4 0-.8-.4-.8-.8v-2.4c0-.4.4-.8.8-.8h16.9c.4 0 .8.4.8.8v2.4c0 .4-.3.8-.8.8z" class="st20"/></g></svg>

package/dist/dots.svg

@@ -1,3 +0,0 @@
-<svg width="6" height="30" viewBox="0 0 6 30" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fill-rule="evenodd" clip-rule="evenodd" d="M1 2C1.55228 2 2 1.55228 2 1C2 0.447715 1.55228 0 1 0C0.447715 0 0 0.447715 0 1C0 1.55228 0.447715 2 1 2ZM5 2C5.55228 2 6 1.55228 6 1C6 0.447715 5.55228 0 5 0C4.44772 0 4 0.447715 4 1C4 1.55228 4.44772 2 5 2ZM6 5C6 5.55228 5.55228 6 5 6C4.44772 6 4 5.55228 4 5C4 4.44772 4.44772 4 5 4C5.55228 4 6 4.44772 6 5ZM1 6C1.55228 6 2 5.55228 2 5C2 4.44772 1.55228 4 1 4C0.447715 4 0 4.44772 0 5C0 5.55228 0.447715 6 1 6ZM6 9C6 9.55229 5.55228 10 5 10C4.44772 10 4 9.55229 4 9C4 8.44771 4.44772 8 5 8C5.55228 8 6 8.44771 6 9ZM1 10C1.55228 10 2 9.55229 2 9C2 8.44771 1.55228 8 1 8C0.447715 8 0 8.44771 0 9C0 9.55229 0.447715 10 1 10ZM6 13C6 13.5523 5.55228 14 5 14C4.44772 14 4 13.5523 4 13C4 12.4477 4.44772 12 5 12C5.55228 12 6 12.4477 6 13ZM1 14C1.55228 14 2 13.5523 2 13C2 12.4477 1.55228 12 1 12C0.447715 12 0 12.4477 0 13C0 13.5523 0.447715 14 1 14ZM6 17C6 17.5523 5.55228 18 5 18C4.44772 18 4 17.5523 4 17C4 16.4477 4.44772 16 5 16C5.55228 16 6 16.4477 6 17ZM1 18C1.55228 18 2 17.5523 2 17C2 16.4477 1.55228 16 1 16C0.447715 16 0 16.4477 0 17C0 17.5523 0.447715 18 1 18ZM6 21C6 21.5523 5.55228 22 5 22C4.44772 22 4 21.5523 4 21C4 20.4477 4.44772 20 5 20C5.55228 20 6 20.4477 6 21ZM1 22C1.55228 22 2 21.5523 2 21C2 20.4477 1.55228 20 1 20C0.447715 20 0 20.4477 0 21C0 21.5523 0.447715 22 1 22ZM6 25C6 25.5523 5.55228 26 5 26C4.44772 26 4 25.5523 4 25C4 24.4477 4.44772 24 5 24C5.55228 24 6 24.4477 6 25ZM1 26C1.55228 26 2 25.5523 2 25C2 24.4477 1.55228 24 1 24C0.447715 24 0 24.4477 0 25C0 25.5523 0.447715 26 1 26ZM6 29C6 29.5523 5.55228 30 5 30C4.44772 30 4 29.5523 4 29C4 28.4477 4.44772 28 5 28C5.55228 28 6 28.4477 6 29ZM1 30C1.55228 30 2 29.5523 2 29C2 28.4477 1.55228 28 1 28C0.447715 28 0 28.4477 0 29C0 29.5523 0.447715 30 1 30Z" fill="#ffffff"/>
-</svg>