@dtdot/lego 0.14.5 → 0.14.9

package/build/components/ActionMessage/ActionMessage.stories.js

@@ -8,8 +8,8 @@ export const Standard = () => (React.createElement(React.Fragment, null,
 export const InPanel = () => (React.createElement(React.Fragment, null,
     React.createElement(Menu, null,
         React.createElement(Menu.Heading, null, "Action Message")),
-    React.createElement(Menu.Content, { panelSize: 'sm' },
-        React.createElement(Menu.Panel, null,
+    React.createElement(Menu.Content, null,
+        React.createElement(Menu.Panel, { panelSize: 'sm' },
             React.createElement(ActionMessage, { header: 'Create an asset', info: "It looks like you don't have any assets, create one to get started", action: 'Create', onAction: () => {
                     console.log('testing');
                 } })),

package/build/components/Card/Card.component.js

@@ -30,7 +30,7 @@ const CardOuter = styled(motion.div) `
         `;
         case 'xs':
             return `
-          width: 240px;
+          width: 360px;
           ${responsive.useStylesFor('mobile').andSmaller(`
             width: 100%;
           `)}

package/build/components/Card/Card.stories.js

@@ -15,6 +15,10 @@ export const Standard = () => (React.createElement(CardGroup, null,
         React.createElement(Card.Content, null,
             React.createElement(LiveInput, { name: 'test', placeholder: 'Name of characters' })))));
 export const Sizes = () => (React.createElement(CardGroup, null,
+    React.createElement(Card, { size: 'xs' },
+        React.createElement(Card.Media, null,
+            React.createElement("img", { src: 'https://www.jotform.com/blog/wp-content/uploads/2012/07/mario-luigi-yoschi-figures-163036.jpeg' })),
+        React.createElement(Card.Content, null, "An extra small card!")),
     React.createElement(Card, { size: 'sm' },
         React.createElement(Card.Media, null,
             React.createElement("img", { src: 'https://www.jotform.com/blog/wp-content/uploads/2012/07/mario-luigi-yoschi-figures-163036.jpeg' })),

package/build/components/Card/_CardHeader.component.d.ts

@@ -2,7 +2,7 @@ import React from 'react';
 export interface CardHeaderProps {
     image?: string;
     heading: string;
-    subHeading: string;
+    subHeading?: string;
     meta?: React.ReactNode;
 }
 declare const CardHeader: ({ image, heading, subHeading, meta }: CardHeaderProps) => JSX.Element;

package/build/components/InlineCard/InlineCard.component.d.ts

@@ -1,10 +1,13 @@
 import React from 'react';
+export declare type InlineCardSize = 'fill' | 'xs' | 'sm' | 'md' | 'lg';
 export interface InlineCardProps extends React.HTMLAttributes<HTMLDivElement> {
     children: React.ReactNode;
+    size?: InlineCardSize;
 }
 declare const InlineCard: {
-    ({ children, onClick }: InlineCardProps): JSX.Element;
+    ({ children, size, onClick }: InlineCardProps): JSX.Element;
     Media: ({ children }: import("./_InlineCardMedia.component").InlineCardMediaProps) => JSX.Element;
-    Content: ({ children }: import("./_InlineCardContent.component").InlineCardContentProps) => JSX.Element;
+    Content: ({ children, center }: import("./_InlineCardContent.component").InlineCardContentProps) => JSX.Element;
+    Meta: ({ children }: import("./_InlineCardMeta.component").InlineCardMetaProps) => JSX.Element;
 };
 export default InlineCard;

package/build/components/InlineCard/InlineCard.component.js

@@ -1,7 +1,9 @@
 import React from 'react';
 import styled from 'styled-components';
+import { responsive } from '../..';
 import InlineCardContent from './_InlineCardContent.component';
 import InlineCardMedia from './_InlineCardMedia.component';
+import InlineCardMeta from './_InlineCardMeta.component';
 const CardOuter = styled.div `
   height: 64px;
   width: 100%;
@@ -11,10 +13,49 @@ const CardOuter = styled.div `
 
   background-color: ${(props) => props.theme.colours.cardBackground};
   box-shadow: ${(props) => props.theme.shadows.small};
+
+  ${(props) => {
+    switch (props.size) {
+        case 'fill':
+            return `
+          width: 100%;
+        `;
+        case 'xs':
+            return `
+          width: 360px;
+          ${responsive.useStylesFor('mobile').andSmaller(`
+            width: 100%;
+          `)}
+        `;
+        case 'sm':
+            return `
+          width: ${responsive.getWidthFor('mobile')};
+          ${responsive.useStylesFor('mobile').andSmaller(`
+            width: 100%;
+          `)}
+        `;
+        case 'md':
+            return `
+          width: ${responsive.getWidthFor('tablet')};
+          ${responsive.useStylesFor('tablet').andSmaller(`
+            width: 100%;
+          `)}
+        `;
+        case 'lg':
+        default:
+            return `
+          width: ${responsive.getWidthFor('desktop')};
+          ${responsive.useStylesFor('desktop').andSmaller(`
+            width: 100%;
+          `)}
+        `;
+    }
+}}
 `;
-const InlineCard = ({ children, onClick }) => {
-    return (React.createElement(CardOuter, { usePointer: !!onClick, onClick: onClick }, children));
+const InlineCard = ({ children, size, onClick }) => {
+    return (React.createElement(CardOuter, { size: size, usePointer: !!onClick, onClick: onClick }, children));
 };
 InlineCard.Media = InlineCardMedia;
 InlineCard.Content = InlineCardContent;
+InlineCard.Meta = InlineCardMeta;
 export default InlineCard;

package/build/components/InlineCard/InlineCard.stories.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import { InlineCard, InlineCardGroup } from '../..';
+import { Badge, InlineCard, InlineCardGroup } from '../..';
 export const Standard = () => (React.createElement(InlineCardGroup, null,
     React.createElement(InlineCard, null,
         React.createElement(InlineCard.Content, null, "Some content")),
@@ -10,7 +10,9 @@ export const Standard = () => (React.createElement(InlineCardGroup, null,
     React.createElement(InlineCard, { onClick: () => {
             console.log('Clicked');
         } },
-        React.createElement(InlineCard.Content, null, "Clickable card"))));
+        React.createElement(InlineCard.Content, null, "Clickable card"),
+        React.createElement(InlineCard.Meta, null,
+            React.createElement(Badge, { variant: 'info' }, "Clickable")))));
 export default {
     title: 'Components/InlineCard',
     component: InlineCard,

package/build/components/InlineCard/_InlineCardContent.component.d.ts

@@ -1,6 +1,7 @@
 import React from 'react';
 export interface InlineCardContentProps {
     children: React.ReactNode;
+    center?: boolean;
 }
-declare const InlineCardContent: ({ children }: InlineCardContentProps) => JSX.Element;
+declare const InlineCardContent: ({ children, center }: InlineCardContentProps) => JSX.Element;
 export default InlineCardContent;

package/build/components/InlineCard/_InlineCardContent.component.js

@@ -8,8 +8,15 @@ const ContentContainer = styled.div `
   font-weight: ${(props) => props.theme.fonts.default.weight};
   font-size: ${(props) => props.theme.fonts.default.size};
   color: ${(props) => props.theme.colours.defaultFont};
+
+  ${(props) => props.center &&
+    `
+      display: flex;
+      align-items: center;
+
+  `}
 `;
-const InlineCardContent = ({ children }) => {
-    return React.createElement(ContentContainer, null, children);
+const InlineCardContent = ({ children, center }) => {
+    return React.createElement(ContentContainer, { center: center }, children);
 };
 export default InlineCardContent;

package/build/components/InlineCard/_InlineCardMeta.component.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+export interface InlineCardMetaProps {
+    children: React.ReactNode;
+}
+declare const InlineCardMeta: ({ children }: InlineCardMetaProps) => JSX.Element;
+export default InlineCardMeta;

package/build/components/InlineCard/_InlineCardMeta.component.js

@@ -0,0 +1,15 @@
+import React from 'react';
+import styled from 'styled-components';
+const ContentContainer = styled.div `
+  height: 100%;
+  padding: 8px;
+  margin-left: 32px;
+
+  display: flex;
+  align-items: center;
+  margin-left: auto;
+`;
+const InlineCardMeta = ({ children }) => {
+    return React.createElement(ContentContainer, null, children);
+};
+export default InlineCardMeta;

package/build/components/Menu/Menu.component.d.ts

@@ -4,10 +4,10 @@ export interface MenuProps {
 }
 declare const Menu: {
     ({ children }: MenuProps): JSX.Element;
-    Page: ({ children }: import("./_MenuPage.component").MenuPageProps) => JSX.Element;
+    Page: ({ children, scrollable }: import("./_MenuPage.component").MenuPageProps) => JSX.Element;
     Heading: ({ children }: import("./_MenuHeading.component").MenuHeadingProps) => JSX.Element;
     Item: ({ children, icon, active, onClick }: import("./_MenuItem.component").MenuItemProps) => JSX.Element;
-    Content: ({ panelSize, independentScroll, children }: import("./_MenuContent.component").MenuContentProps) => JSX.Element;
-    Panel: ({ children }: import("./_MenuPanel.component").MenuPanelProps) => JSX.Element;
+    Content: ({ children }: import("./_MenuContent.component").MenuContentProps) => JSX.Element;
+    Panel: ({ children, scrollable, panelSize }: import("./_MenuPanel.component").MenuPanelProps) => JSX.Element;
 };
 export default Menu;

package/build/components/Menu/Menu.stories.js

@@ -29,8 +29,8 @@ export const WithPanel = () => {
             React.createElement(Menu.Item, { icon: faHamburger, active: menuHelpers.isActiveItem([/\/eat/g], route), onClick: () => setRoute('/eat') }, "Eat"),
             React.createElement(Menu.Item, { icon: faCalendarAlt, active: menuHelpers.isActiveItem([/\/plan/g], route), onClick: () => setRoute('/plan') }, "Plan"),
             React.createElement(Menu.Item, { icon: faCogs, active: menuHelpers.isActiveItem([/\/manage/g], route), onClick: () => setRoute('/manage') }, "Manage")),
-        React.createElement(Menu.Content, { panelSize: 'md' },
-            React.createElement(Menu.Panel, null,
+        React.createElement(Menu.Content, null,
+            React.createElement(Menu.Panel, { panelSize: 'md' },
                 React.createElement(PaddedLayout, null,
                     React.createElement(ControlGroup, { variation: 'comfortable' },
                         React.createElement(Heading.SubHeading, null, "You"),
@@ -57,8 +57,8 @@ export const IndependentScrolling = () => {
             React.createElement(Menu.Item, { icon: faHamburger, active: menuHelpers.isActiveItem([/\/eat/g], route), onClick: () => setRoute('/eat') }, "Eat"),
             React.createElement(Menu.Item, { icon: faCalendarAlt, active: menuHelpers.isActiveItem([/\/plan/g], route), onClick: () => setRoute('/plan') }, "Plan"),
             React.createElement(Menu.Item, { icon: faCogs, active: menuHelpers.isActiveItem([/\/manage/g], route), onClick: () => setRoute('/manage') }, "Manage")),
-        React.createElement(Menu.Content, { panelSize: 'sm', independentScroll: true },
-            React.createElement(Menu.Panel, null,
+        React.createElement(Menu.Content, null,
+            React.createElement(Menu.Panel, { panelSize: 'sm', scrollable: true },
                 React.createElement(PaddedLayout, null,
                     React.createElement(Text, null,
                         "Suspendisse sit amet pellentesque nisi. Quisque eget velit sit amet mauris tincidunt dictum id et ex. Integer pulvinar tellus id viverra finibus. Cras dapibus diam a ante eleifend, ac ultrices ligula vestibulum. Nulla gravida ante nec mi tristique, vel elementum arcu volutpat. Nunc in lorem id ligula sodales tincidunt non ut ipsum. Fusce risus eros, dapibus sed lacus et, faucibus auctor purus. Nulla sed rhoncus ligula, at porttitor tellus. Aliquam vitae gravida quam. Interdum et malesuada fames ac ante ipsum primis in faucibus. Pellentesque quis tempus risus.",
@@ -68,7 +68,7 @@ export const IndependentScrolling = () => {
                         React.createElement("br", null),
                         React.createElement("br", null),
                         "Aenean vestibulum aliquam purus ut fringilla. Maecenas aliquet a nunc eget scelerisque. Mauris varius dignissim velit, vitae faucibus massa posuere sit amet. Nulla rutrum enim tellus, eget interdum massa ultricies sed. Proin pulvinar odio non lectus scelerisque, et varius nisl blandit. Donec nisl ante, ultricies eu volutpat ut, dapibus sed ex. Aliquam risus ex, porttitor vel commodo in, convallis laoreet dolor. Proin pretium neque pretium, laoreet dolor ultrices, vulputate sapien. Aenean rutrum lorem non mauris egestas accumsan."))),
-            React.createElement(Menu.Page, null,
+            React.createElement(Menu.Page, { scrollable: true },
                 React.createElement(ContentLayout, null,
                     React.createElement(ContentLayout.Content, { size: 'sm' },
                         React.createElement(Text, null,

package/build/components/Menu/_MenuContent.component.d.ts

@@ -1,10 +1,6 @@
 import React from 'react';
-export declare type PanelSize = 'sm' | 'md';
-export declare const getMaxSize: (size: PanelSize) => "tablet" | "desktop";
 export interface MenuContentProps {
     children: React.ReactNode;
-    panelSize?: PanelSize;
-    independentScroll?: boolean;
 }
-declare const MenuContent: ({ panelSize, independentScroll, children }: MenuContentProps) => JSX.Element;
+declare const MenuContent: ({ children }: MenuContentProps) => JSX.Element;
 export default MenuContent;

package/build/components/Menu/_MenuContent.component.js

@@ -1,16 +1,6 @@
 import React from 'react';
 import styled from 'styled-components';
 import responsive from '../../responsive/responsive';
-import MenuContentContext from './_MenuContent.context';
-export const getMaxSize = (size) => {
-    switch (size) {
-        case 'sm':
-            return 'tablet';
-        case 'md':
-        default:
-            return 'desktop';
-    }
-};
 const MenuContentOuter = styled.div `
   display: flex;
 
@@ -20,12 +10,11 @@ const MenuContentOuter = styled.div `
   min-height: 100vh;
   padding: 8px;
 
-  ${(props) => responsive.useStylesFor(getMaxSize(props.panelSize)).andSmaller(`
+  ${responsive.useStylesFor('tablet').andSmaller(`
     flex-direction: column;
   `)}
 `;
-const MenuContent = ({ panelSize = 'md', independentScroll = false, children }) => {
-    return (React.createElement(MenuContentContext.Provider, { value: { panelSize, independentScroll } },
-        React.createElement(MenuContentOuter, { panelSize: panelSize }, children)));
+const MenuContent = ({ children }) => {
+    return React.createElement(MenuContentOuter, null, children);
 };
 export default MenuContent;

package/build/components/Menu/_MenuPage.component.d.ts

@@ -1,6 +1,7 @@
 import React from 'react';
 export interface MenuPageProps {
     children: React.ReactNode;
+    scrollable?: boolean;
 }
-declare const MenuPage: ({ children }: MenuPageProps) => JSX.Element;
+declare const MenuPage: ({ children, scrollable }: MenuPageProps) => JSX.Element;
 export default MenuPage;

package/build/components/Menu/_MenuPage.component.js

@@ -1,20 +1,18 @@
-import React, { useContext } from 'react';
+import React from 'react';
 import styled from 'styled-components';
 import responsive from '../../responsive/responsive';
-import { getMaxSize } from './_MenuContent.component';
-import MenuContentContext from './_MenuContent.context';
 const MenuPageInner = styled.div `
   background-color: ${(props) => props.theme.colours.background};
   border-radius: 2px;
   min-height: calc(100vh - 16px);
   flex-grow: 1;
 
-  ${(props) => responsive.useStylesFor(getMaxSize(props.panelSize)).andSmaller(`
+  ${responsive.useStylesFor('tablet').andSmaller(`
     min-height: unset;
   `)}
 
-  ${(props) => props.independentScroll &&
-    `
+  ${(props) => responsive.useStylesFor('desktop').andLarger(props.scrollable
+    ? `
     max-height: calc(100vh - 16px);
     overflow-y: auto;
 
@@ -30,10 +28,10 @@ const MenuPageInner = styled.div `
     &::-webkit-scrollbar-track {
       box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
     }
-  `}
+  `
+    : ``)}
 `;
-const MenuPage = ({ children }) => {
-    const { panelSize, independentScroll } = useContext(MenuContentContext);
-    return (React.createElement(MenuPageInner, { panelSize: panelSize, independentScroll: independentScroll }, children));
+const MenuPage = ({ children, scrollable }) => {
+    return React.createElement(MenuPageInner, { scrollable: scrollable }, children);
 };
 export default MenuPage;

package/build/components/Menu/_MenuPanel.component.d.ts

@@ -1,6 +1,9 @@
 import React from 'react';
+export declare type PanelSize = 'sm' | 'md';
 export interface MenuPanelProps {
     children: React.ReactNode;
+    scrollable?: boolean;
+    panelSize: PanelSize;
 }
-declare const MenuPanel: ({ children }: MenuPanelProps) => JSX.Element;
+declare const MenuPanel: ({ children, scrollable, panelSize }: MenuPanelProps) => JSX.Element;
 export default MenuPanel;

package/build/components/Menu/_MenuPanel.component.js

@@ -1,8 +1,6 @@
-import React, { useContext } from 'react';
+import React from 'react';
 import styled from 'styled-components';
 import responsive from '../../responsive/responsive';
-import { getMaxSize } from './_MenuContent.component';
-import MenuContentContext from './_MenuContent.context';
 const MenuPanelDiv = styled.div `
   background-color: ${(props) => props.theme.colours.background};
   border-radius: 2px;
@@ -27,7 +25,7 @@ const MenuPanelDiv = styled.div `
     }
 }}
 
-  ${(props) => responsive.useStylesFor(getMaxSize(props.panelSize)).andSmaller(`
+  ${responsive.useStylesFor('tablet').andSmaller(`
     max-width: unset;
     min-width: unset;
     min-height: unset;
@@ -36,9 +34,9 @@ const MenuPanelDiv = styled.div `
     margin-bottom: 8px;
   `)}
 
-  ${(props) => props.independentScroll &&
-    `
-    max-height: calc(100vh - 16px);
+${(props) => responsive.useStylesFor('desktop').andLarger(props.scrollable
+    ? `
+        max-height: calc(100vh - 16px);
     overflow-y: auto;
 
     &::-webkit-scrollbar {
@@ -53,10 +51,10 @@ const MenuPanelDiv = styled.div `
     &::-webkit-scrollbar-track {
       box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
     }
-  `}
+        `
+    : ``)}
 `;
-const MenuPanel = ({ children }) => {
-    const { panelSize, independentScroll } = useContext(MenuContentContext);
-    return (React.createElement(MenuPanelDiv, { panelSize: panelSize, independentScroll: independentScroll }, children));
+const MenuPanel = ({ children, scrollable, panelSize = 'sm' }) => {
+    return (React.createElement(MenuPanelDiv, { panelSize: panelSize, scrollable: scrollable }, children));
 };
 export default MenuPanel;

package/build/components/PageHeader/PageHeader.component.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+export interface PageHeaderProps {
+    heading: string;
+}
+declare const PageHeader: ({ heading }: PageHeaderProps) => JSX.Element;
+export default PageHeader;

package/build/components/PageHeader/PageHeader.component.js

@@ -0,0 +1,12 @@
+import React from 'react';
+import styled from 'styled-components';
+import { Heading } from '../..';
+const HeaderOuter = styled.div `
+  width: 100%;
+  padding: 32px;
+`;
+const PageHeader = ({ heading }) => {
+    return (React.createElement(HeaderOuter, null,
+        React.createElement(Heading, null, heading)));
+};
+export default PageHeader;

package/build/components/PageHeader/PageHeader.stories.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import { Meta } from '@storybook/react/types-6-0';
+export declare const Standard: () => JSX.Element;
+declare const _default: Meta<import("@storybook/react/types-6-0").Args>;
+export default _default;

package/build/components/PageHeader/PageHeader.stories.js

@@ -0,0 +1,9 @@
+import React from 'react';
+import { PageHeader } from '../../';
+export const Standard = () => {
+    return React.createElement(PageHeader, { heading: 'Frank the Drummer' });
+};
+export default {
+    title: 'Components/PageHeader',
+    component: PageHeader,
+};

package/build/components/Swimlane/Swimlane.component.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+export interface SwimlaneProps {
+    label: string;
+    children: React.ReactNode;
+}
+declare const Swimlane: ({ label, children }: SwimlaneProps) => JSX.Element;
+export default Swimlane;

package/build/components/Swimlane/Swimlane.component.js

@@ -0,0 +1,31 @@
+import React from 'react';
+import styled from 'styled-components';
+import { Heading } from '../..';
+const SwimlaneOuter = styled.div `
+  padding: 8px;
+  margin: 0 16px;
+  border-top: thin solid ${(props) => props.theme.colours.controlBorder};
+
+  display: flex;
+  align-items: center;
+
+  :last-child {
+    border-bottom: thin solid ${(props) => props.theme.colours.controlBorder};
+  }
+`;
+const SwimlaneLabel = styled.div `
+  padding-right: 32px;
+  width: 240px;
+  min-width: 240px;
+`;
+const SwimlaneContent = styled.div `
+  display: flex;
+  flex-wrap: wrap;
+`;
+const Swimlane = ({ label, children }) => {
+    return (React.createElement(SwimlaneOuter, null,
+        React.createElement(SwimlaneLabel, null,
+            React.createElement(Heading.FormHeading, null, label)),
+        React.createElement(SwimlaneContent, null, children)));
+};
+export default Swimlane;

package/build/components/Swimlane/Swimlane.stories.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import { Meta } from '@storybook/react/types-6-0';
+export declare const Standard: () => JSX.Element;
+declare const _default: Meta<import("@storybook/react/types-6-0").Args>;
+export default _default;

package/build/components/Swimlane/Swimlane.stories.js

@@ -0,0 +1,55 @@
+import React from 'react';
+import styled from 'styled-components';
+import { InlineCard, Badge, Swimlane, CenteredLayout } from '../../';
+const CardWrapper = styled.div `
+  margin: 8px;
+`;
+export const Standard = () => {
+    return (React.createElement(React.Fragment, null,
+        React.createElement(Swimlane, { label: 'Jobs' },
+            React.createElement(CardWrapper, null,
+                React.createElement(InlineCard, { size: 'xs' },
+                    React.createElement(InlineCard.Content, { center: true },
+                        React.createElement(CenteredLayout, null,
+                            "Jim",
+                            `'`,
+                            "s Mowing")),
+                    React.createElement(InlineCard.Meta, null,
+                        React.createElement(Badge, { variant: 'success' }, "Full Time"))))),
+        React.createElement(Swimlane, { label: 'Properties' },
+            React.createElement(CardWrapper, null,
+                React.createElement(InlineCard, { size: 'xs' },
+                    React.createElement(InlineCard.Content, { center: true },
+                        React.createElement(CenteredLayout, null, "33 Oak Street")),
+                    React.createElement(InlineCard.Meta, null,
+                        React.createElement(Badge, { variant: 'success' }, "Primary")))),
+            React.createElement(CardWrapper, null,
+                React.createElement(InlineCard, { size: 'xs' },
+                    React.createElement(InlineCard.Content, { center: true },
+                        React.createElement(CenteredLayout, null, "402 Main Street")),
+                    React.createElement(InlineCard.Meta, null,
+                        React.createElement(Badge, { variant: 'info' }, "Investment")))),
+            React.createElement(CardWrapper, null,
+                React.createElement(InlineCard, { size: 'xs' },
+                    React.createElement(InlineCard.Content, { center: true },
+                        React.createElement(CenteredLayout, null, "12 Heart Avenue")),
+                    React.createElement(InlineCard.Meta, null,
+                        React.createElement(Badge, { variant: 'info' }, "Investment"))))),
+        React.createElement(Swimlane, { label: 'Investments' },
+            React.createElement(CardWrapper, null,
+                React.createElement(InlineCard, { size: 'xs' },
+                    React.createElement(InlineCard.Content, { center: true },
+                        React.createElement(CenteredLayout, null, "ASX 200")),
+                    React.createElement(InlineCard.Meta, null,
+                        React.createElement(Badge, { variant: 'info' }, "Index Fund")))),
+            React.createElement(CardWrapper, null,
+                React.createElement(InlineCard, { size: 'xs' },
+                    React.createElement(InlineCard.Content, { center: true },
+                        React.createElement(CenteredLayout, null, "AMP Super")),
+                    React.createElement(InlineCard.Meta, null,
+                        React.createElement(Badge, { variant: 'info' }, "Super Fund")))))));
+};
+export default {
+    title: 'Components/Swimlane',
+    component: Swimlane,
+};

package/build/index.d.ts

@@ -20,10 +20,12 @@ export { default as LiveInput } from './components/LiveInput/LiveInput.component
 export { default as Loader } from './components/Loader/Loader.component';
 export { default as Menu } from './components/Menu/Menu.component';
 export { default as Modal } from './components/Modal/Modal.component';
+export { default as PageHeader } from './components/PageHeader/PageHeader.component';
 export { default as ProfileImage } from './components/ProfileImage/ProfileImage.component';
 export { default as QrCode } from './components/QrCode/QrCode.component';
 export { default as Spacer } from './components/Spacer/Spacer.component';
 export { default as SquareButton } from './components/SquareButton/SquareButton.component';
+export { default as Swimlane } from './components/Swimlane/Swimlane.component';
 export { default as Table } from './components/Table/Table.component';
 export { default as Text } from './components/Text/Text.component';
 export { default as LoginScreen } from './screens/Login/Login.screen';

package/build/index.js

@@ -20,10 +20,12 @@ export { default as LiveInput } from './components/LiveInput/LiveInput.component
 export { default as Loader } from './components/Loader/Loader.component';
 export { default as Menu } from './components/Menu/Menu.component';
 export { default as Modal } from './components/Modal/Modal.component';
+export { default as PageHeader } from './components/PageHeader/PageHeader.component';
 export { default as ProfileImage } from './components/ProfileImage/ProfileImage.component';
 export { default as QrCode } from './components/QrCode/QrCode.component';
 export { default as Spacer } from './components/Spacer/Spacer.component';
 export { default as SquareButton } from './components/SquareButton/SquareButton.component';
+export { default as Swimlane } from './components/Swimlane/Swimlane.component';
 export { default as Table } from './components/Table/Table.component';
 export { default as Text } from './components/Text/Text.component';
 export { default as LoginScreen } from './screens/Login/Login.screen';

package/build/theme/dark.theme.js

@@ -4,7 +4,7 @@ const darkTheme = {
         background: '#424448',
         overlayBackground: '#a4caf9',
         primary: {
-            main: '#61a4f5',
+            main: '#94b8e3',
             hover: '#83b7f7',
             contrastText: '#191919',
         },
@@ -56,7 +56,7 @@ const darkTheme = {
         },
         heading: {
             family: `'Roboto', sans-serif`,
-            size: '36px',
+            size: '28px',
             weight: '500',
         },
         subHeading: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dtdot/lego",
-  "version": "0.14.5",
+  "version": "0.14.9",
   "description": "Some reusable components for building my applications",
   "main": "build/index.js",
   "scripts": {

package/build/components/Menu/_MenuContent.context.d.ts

@@ -1,7 +0,0 @@
-/// <reference types="react" />
-export interface MenuContentContextProps {
-    panelSize: 'sm' | 'md';
-    independentScroll: boolean;
-}
-declare const MenuContentContext: import("react").Context<MenuContentContextProps>;
-export default MenuContentContext;

package/build/components/Menu/_MenuContent.context.js

@@ -1,6 +0,0 @@
-import { createContext } from 'react';
-const MenuContentContext = createContext({
-    panelSize: 'md',
-    independentScroll: false,
-});
-export default MenuContentContext;