@bbl-digital/snorre 4.2.74 → 4.2.75

package/lib/v2/core/Box/styles.js

@@ -1,58 +1,69 @@
-"use strict";
+import { css } from '@emotion/react';
+import styled from '@emotion/styled';
+import Button from '../Button';
+import bp from '../../../globals/styles/breakpoints';
+const styles = {
+    default: (theme) => css `
+    position: relative;
+    border-radius: 8px;
+    background: #ffffff;
+    box-shadow: ${theme.shadowSmall};
 
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.styles = exports.default = exports.HeaderWrapper = exports.FooterWrapper = exports.ContentWrapper = exports.CollapseButton = void 0;
-var _base = _interopRequireDefault(require("@emotion/styled/base"));
-var _react = require("@emotion/react");
-var _Button = _interopRequireDefault(require("../Button"));
-var _breakpoints = _interopRequireDefault(require("../../../globals/styles/breakpoints"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
-const styles = exports.styles = {
-  default: theme => /*#__PURE__*/(0, _react.css)("position:relative;border-radius:8px;background:#ffffff;box-shadow:", theme.shadowSmall, ";&>button{width:100%;display:block;}" + (process.env.NODE_ENV === "production" ? "" : ";label:default;")),
-  mysite: theme => /*#__PURE__*/(0, _react.css)("padding:0.5em 0;border-radius:", theme.mypageBoxBorderRadius, ";box-shadow:", theme.mypageBoxShadow, ";" + (process.env.NODE_ENV === "production" ? "" : ";label:mysite;")),
-  noshadow: process.env.NODE_ENV === "production" ? {
-    name: "1t90u8d",
-    styles: "box-shadow:none"
-  } : {
-    name: "1u50o93-noshadow",
-    styles: "box-shadow:none;label:noshadow;",
-    toString: _EMOTION_STRINGIFIED_CSS_ERROR__
-  },
-  background: bg => /*#__PURE__*/(0, _react.css)("background:", bg, ";" + (process.env.NODE_ENV === "production" ? "" : ";label:background;")),
-  padding: /*#__PURE__*/(0, _react.css)("padding:1.5rem 0;@media (max-width: ", _breakpoints.default.small, "){padding:1rem 0;}" + (process.env.NODE_ENV === "production" ? "" : ";label:padding;"))
+    & > button {
+      width: 100%;
+      display: block;
+    }
+  `,
+    mysite: (theme) => css `
+    padding: 0.5em 0;
+    border-radius: ${theme.mypageBoxBorderRadius};
+    box-shadow: ${theme.mypageBoxShadow};
+  `,
+    noshadow: css `
+    box-shadow: none;
+  `,
+    background: (bg) => css `
+    background: ${bg};
+  `,
+    padding: css `
+    padding: 1.5rem 0;
+    @media (max-width: ${bp.small}) {
+      padding: 1rem 0;
+    }
+  `,
 };
-const HeaderWrapper = exports.HeaderWrapper = /*#__PURE__*/(0, _base.default)("div", process.env.NODE_ENV === "production" ? {
-  target: "e13mu5073"
-} : {
-  target: "e13mu5073",
-  label: "HeaderWrapper"
-})("display:flex;justify-content:space-between;svg{align-self:center;}padding:0 1.5rem 0 1.5rem;@media (max-width: ", _breakpoints.default.small, "){padding:0 1rem 0 1rem;}");
-const FooterWrapper = exports.FooterWrapper = /*#__PURE__*/(0, _base.default)("div", process.env.NODE_ENV === "production" ? {
-  target: "e13mu5072"
-} : {
-  target: "e13mu5072",
-  label: "FooterWrapper"
-})("display:flex;justify-content:", props => props.align || 'start', ";padding:1rem 1.5rem 0 1.5rem;@media (max-width: ", _breakpoints.default.small, "){padding:1rem 1rem 0 1rem;}");
-const ContentWrapper = exports.ContentWrapper = /*#__PURE__*/(0, _base.default)("div", process.env.NODE_ENV === "production" ? {
-  target: "e13mu5071"
-} : {
-  target: "e13mu5071",
-  label: "ContentWrapper"
-})("display:block;padding:", props => props.hasPadding ? '0 1.5rem' : '0', ";padding-top:", props => props.hasHeader ? '0' : '1rem', ";@media (max-width: ", _breakpoints.default.small, "){padding:", props => props.hasPadding ? '0 1rem' : '0', ";padding-top:", props => props.hasHeader ? '0' : '0.5rem', ";}");
-const CollapseButton = exports.CollapseButton = /*#__PURE__*/(0, _base.default)(_Button.default, process.env.NODE_ENV === "production" ? {
-  target: "e13mu5070"
-} : {
-  target: "e13mu5070",
-  label: "CollapseButton"
-})(process.env.NODE_ENV === "production" ? {
-  name: "1082qq3",
-  styles: "display:block;width:100%"
-} : {
-  name: "1082qq3",
-  styles: "display:block;width:100%",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
-});
-var _default = exports.default = styles;
+const HeaderWrapper = styled.div `
+  display: flex;
+  justify-content: space-between;
+  svg {
+    align-self: center;
+  }
+  padding: 0 1.5rem 0 1.5rem;
+  @media (max-width: ${bp.small}) {
+    padding: 0 1rem 0 1rem;
+  }
+`;
+const FooterWrapper = styled.div `
+  display: flex;
+  justify-content: ${(props) => props.align || 'start'};
+
+  padding: 1rem 1.5rem 0 1.5rem;
+  @media (max-width: ${bp.small}) {
+    padding: 1rem 1rem 0 1rem;
+  }
+`;
+const ContentWrapper = styled.div `
+  display: block;
+  padding: ${(props) => (props.hasPadding ? '0 1.5rem' : '0')};
+  padding-top: ${(props) => (props.hasHeader ? '0' : '1rem')};
+  @media (max-width: ${bp.small}) {
+    padding: ${(props) => (props.hasPadding ? '0 1rem' : '0')};
+    padding-top: ${(props) => (props.hasHeader ? '0' : '0.5rem')};
+  }
+`;
+const CollapseButton = styled(Button) `
+  display: block;
+  width: 100%;
+`;
+export default styles;
+export { styles, HeaderWrapper, FooterWrapper, ContentWrapper, CollapseButton };

package/lib/v2/core/BoxedTable/BoxedTable.stories.d.ts

@@ -2,35 +2,34 @@ import { Meta } from '@storybook/react';
 declare const _default: Meta;
 export default _default;
 export declare const Table: {
-    render: () => import("react").JSX.Element;
+    render: () => import("react/jsx-runtime").JSX.Element;
     name: string;
 };
 export declare const WithCheckbox: {
-    render: () => import("react").JSX.Element;
+    render: () => import("react/jsx-runtime").JSX.Element;
     name: string;
 };
 export declare const WithSort: {
-    render: () => import("react").JSX.Element;
+    render: () => import("react/jsx-runtime").JSX.Element;
     name: string;
 };
 export declare const Mysite: {
-    render: () => import("react").JSX.Element;
+    render: () => import("react/jsx-runtime").JSX.Element;
     name: string;
 };
 export declare const Compact: {
-    render: () => import("react").JSX.Element;
+    render: () => import("react/jsx-runtime").JSX.Element;
     name: string;
 };
 export declare const Expandable: {
-    render: () => import("react").JSX.Element;
+    render: () => import("react/jsx-runtime").JSX.Element;
     name: string;
 };
 export declare const DragAndDropList: {
-    render: () => import("react").JSX.Element;
+    render: () => import("react/jsx-runtime").JSX.Element;
     name: string;
 };
 export declare const DragAndDropListDragDisabled: {
-    render: () => import("react").JSX.Element;
+    render: () => import("react/jsx-runtime").JSX.Element;
     name: string;
 };
-//# sourceMappingURL=BoxedTable.stories.d.ts.map

package/lib/v2/core/BoxedTable/BoxedTable.stories.js

@@ -1,358 +1,44 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.WithSort = exports.WithCheckbox = exports.Table = exports.Mysite = exports.Expandable = exports.DragAndDropListDragDisabled = exports.DragAndDropList = exports.Compact = void 0;
-var _ = _interopRequireDefault(require("."));
-var _TableHeader = _interopRequireDefault(require("./TableHeader"));
-var _HeaderCell = _interopRequireDefault(require("./HeaderCell"));
-var _TableRow = _interopRequireDefault(require("./TableRow"));
-var _RowCell = _interopRequireDefault(require("./RowCell"));
-var _DraggableRow = _interopRequireDefault(require("./DraggableRow"));
-var _Checkbox = _interopRequireDefault(require("../../../core/Checkbox"));
-var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-var _default = exports.default = {
-  title: 'v2/Core/BoxedTable',
-  component: _.default
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import BoxedTable from '.';
+import TableHeader from './TableHeader';
+import HeaderCell from './HeaderCell';
+import TableRow from './TableRow';
+import RowCell from './RowCell';
+import DraggableRow from './DraggableRow';
+import Checkbox from '../../../core/Checkbox';
+export default {
+    title: 'v2/Core/BoxedTable',
+    component: BoxedTable,
+};
+export const Table = {
+    render: () => (_jsxs(BoxedTable, { columns: "2fr 1fr 1fr", children: [_jsxs(TableHeader, { children: [_jsx(HeaderCell, { children: "Header 1" }), _jsx(HeaderCell, { children: "Header 2" }), _jsx(HeaderCell, { align: "center", children: "Header 3 centered" })] }), _jsxs(TableRow, { onClick: () => console.log('row clicked'), children: [_jsx(RowCell, { children: "Clickable row cell 1" }), _jsx(RowCell, { pLeft: "1em", pRight: "0.5em", size: "12px", children: "cell 2 with custom padding and size" }), _jsx(RowCell, { align: "center", children: "cell 3 centered" })] }), _jsxs(TableRow, { children: [_jsx(RowCell, { mobileTitle: "Mobile title", children: "Non clickable row cell 1" }), _jsx(RowCell, { mobileTitle: "Mobile title", children: "cell 2" }), _jsx(RowCell, { align: "right", children: "cell 3 right align" })] })] })),
+    name: 'Table',
+};
+export const WithCheckbox = {
+    render: () => (_jsxs(BoxedTable, { hasCheckbox: true, columns: "35px 1fr 1fr", type: "compact", children: [_jsxs(TableHeader, { children: [_jsx(HeaderCell, {}), _jsx(HeaderCell, { children: "Header 1" }), _jsx(HeaderCell, { children: "Header 2" })] }), _jsxs(TableRow, { children: [_jsx(Checkbox, { checked: true }), _jsx(RowCell, { children: "cell 2 with custom padding and size" }), _jsx(RowCell, { children: "cell 3 centered with very long text blablablablablablablablablabla" }), _jsx(RowCell, { children: "cell 3 centered" })] }), _jsxs(TableRow, { children: [_jsx(Checkbox, { checked: true }), _jsx(RowCell, { children: "cell 2" }), _jsx(RowCell, { children: "cell 3 right align" }), _jsx(RowCell, { children: "cell 3 right align" })] }), _jsxs(TableRow, { children: [_jsx(Checkbox, { checked: true }), _jsx(RowCell, { children: "cell 2" }), _jsx(RowCell, { children: "cell 3 right align" }), _jsx(Checkbox, { children: "Should not break" })] })] })),
+    name: 'Checkbox',
+};
+export const WithSort = {
+    render: () => (_jsxs(BoxedTable, { columns: "2fr 1fr 1fr", children: [_jsxs(TableHeader, { children: [_jsx(HeaderCell, { sortable: true, sortOrder: "asc", noSortReturnValue: "my value", onSortChange: (e) => console.log('sort changed with value:', e), children: "Sortable headers" }), _jsx(HeaderCell, { sortable: true, sortOrder: "desc", onSortChange: (e) => console.log('sort changed with value:', e), children: "Header 2" }), _jsx(HeaderCell, { sortable: true, sortOrder: "none", onSortChange: (e) => console.log('sort changed with value:', e), children: "Header 3" })] }), _jsxs(TableRow, { children: [_jsx(RowCell, { className: "my-classname", children: "row 1 cell 1" }), _jsx(RowCell, { children: "row 1 cell 2" }), _jsx(RowCell, { children: "row 1 cell 3" })] }), _jsxs(TableRow, { children: [_jsx(RowCell, { children: "row 2 cell 1" }), _jsx(RowCell, { children: "row 2 cell 2" }), _jsx(RowCell, { ellipsis: true, title: "Hello lots of stuff can be found here", children: "Lots of stuff Lots of stuff Lots of stuff Lots of stuff Lots of stuff Lots of stuff Lots of stuff Lots of stuff Lots of stuff Lots of stuff Lots of stuff Lots of stuff" })] })] })),
+    name: 'With sort',
+};
+export const Mysite = {
+    render: () => (_jsxs(BoxedTable, { type: "mysite", columns: "2fr 1fr 1fr", children: [_jsxs(TableHeader, { children: [_jsx(HeaderCell, { sortable: true, sortOrder: "asc", noSortReturnValue: "my value", onSortChange: (e) => console.log('sort changed with value:', e), children: "Sortable headers" }), _jsx(HeaderCell, { sortable: true, sortOrder: "desc", onSortChange: (e) => console.log('sort changed with value:', e), children: "Header 2" }), _jsx(HeaderCell, { sortable: true, sortOrder: "none", onSortChange: (e) => console.log('sort changed with value:', e), children: "Header 3" })] }), _jsxs(TableRow, { children: [_jsx(RowCell, { children: "row 1 cell 1" }), _jsx(RowCell, { children: "row 1 cell 2" }), _jsx(RowCell, { children: "row 1 cell 3" })] }), _jsxs(TableRow, { children: [_jsx(RowCell, { children: "row 2 cell 1" }), _jsx(RowCell, { children: "row 2 cell 2" }), _jsx(RowCell, { children: "row 2 cell 3" })] })] })),
+    name: 'Mysite',
+};
+export const Compact = {
+    render: () => (_jsxs(BoxedTable, { type: "compact", columns: "2fr 1fr 1fr", minWidth: "100%", children: [_jsxs(TableHeader, { children: [_jsx(HeaderCell, { sortable: true, sortOrder: "asc", noSortReturnValue: "my value", onSortChange: (e) => console.log('sort changed with value:', e), children: "Sortable headers" }), _jsx(HeaderCell, { sortable: true, sortOrder: "desc", onSortChange: (e) => console.log('sort changed with value:', e), children: "Header 2" }), _jsx(HeaderCell, { sortable: true, sortOrder: "none", onSortChange: (e) => console.log('sort changed with value:', e), children: "Header 3" })] }), _jsxs(TableRow, { children: [_jsx(RowCell, { children: "row 1 cell 1" }), _jsx(RowCell, { children: "row 1 cell 2" }), _jsx(RowCell, { children: "row 1 cell 3" })] }), _jsxs(TableRow, { children: [_jsx(RowCell, { children: "row 2 cell 1" }), _jsx(RowCell, { children: "row 2 cell 2" }), _jsx(RowCell, { children: "row 2 cell 3" })] })] })),
+    name: 'Compact',
+};
+export const Expandable = {
+    render: () => (_jsxs(BoxedTable, { type: "mysite", columns: "1fr 1fr 1fr", children: [_jsxs(TableHeader, { children: [_jsx(HeaderCell, { children: "Header 1" }), _jsx(HeaderCell, { children: "Header 2" }), _jsx(HeaderCell, { children: "Header 3" })] }), _jsxs(TableRow, { expandable: true, expandableContent: _jsx("span", { children: "This is some nice content" }), defaultExpanded: true, children: [_jsx(RowCell, { children: "row 1 cell 1" }), _jsx(RowCell, { children: "row 1 cell 2" }), _jsx(RowCell, { children: "row 1 cell 3" })] }), _jsxs(TableRow, { children: [_jsx(RowCell, { children: "row 2 cell 1" }), _jsx(RowCell, { children: "row 2 cell 2" }), _jsx(RowCell, { children: "row 2 cell 3" })] })] })),
+    name: 'Expandable',
+};
+export const DragAndDropList = {
+    render: () => (_jsxs(BoxedTable, { columns: "1fr 1fr 1fr", onDrop: console.log, children: [_jsxs(TableHeader, { children: [_jsx(HeaderCell, { children: "Header 1" }), _jsx(HeaderCell, { children: "Header 2" }), _jsx(HeaderCell, { align: "center", children: "Header 3 centered" })] }), _jsxs(DraggableRow, { id: "1", index: 0, subContent: _jsxs("div", { children: [_jsx("span", { children: "This is some nice content" }), _jsx("br", {}), _jsx("span", { children: "Here we can add lots of stuff" })] }), children: [_jsx(RowCell, { children: "row 1 cell 1" }), _jsx(RowCell, { children: "row 1 cell 2" }), _jsx(RowCell, { children: "row 1 cell 3" })] }), _jsxs(DraggableRow, { id: "2", index: 1, children: [_jsx(RowCell, { children: "row 2 cell 1" }), _jsx(RowCell, { children: "row 2 cell 2" }), _jsx(RowCell, { children: "row 2 cell 3" })] })] })),
+    name: 'Drag and drop list',
+};
+export const DragAndDropListDragDisabled = {
+    render: () => (_jsxs(BoxedTable, { columns: "1fr 1fr 1fr", onDrop: console.log, children: [_jsxs(TableHeader, { children: [_jsx(HeaderCell, { children: "Header 1" }), _jsx(HeaderCell, { children: "Header 2" }), _jsx(HeaderCell, { align: "center", children: "Header 3 centered" })] }), _jsxs(DraggableRow, { disableDrag: true, id: "1", index: 0, subContent: _jsx("div", { children: _jsx("span", { children: "This is some nice content" }) }), children: [_jsx(RowCell, { children: "row 1 cell 1" }), _jsx(RowCell, { children: "row 1 cell 2" }), _jsx(RowCell, { children: "row 1 cell 3" })] }), _jsxs(DraggableRow, { disableDrag: true, id: "2", index: 1, children: [_jsx(RowCell, { children: "row 2 cell 1" }), _jsx(RowCell, { children: "row 2 cell 2" }), _jsx(RowCell, { children: "row 2 cell 3" })] })] })),
+    name: 'Drag and drop list (drag disabled)',
 };
-const Table = exports.Table = {
-  render: () => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.default, {
-    columns: "2fr 1fr 1fr",
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_TableHeader.default, {
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_HeaderCell.default, {
-        children: "Header 1"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_HeaderCell.default, {
-        children: "Header 2"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_HeaderCell.default, {
-        align: "center",
-        children: "Header 3 centered"
-      })]
-    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_TableRow.default, {
-      onClick: () => console.log('row clicked'),
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_RowCell.default, {
-        children: "Clickable row cell 1"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_RowCell.default, {
-        pLeft: "1em",
-        pRight: "0.5em",
-        size: "12px",
-        children: "cell 2 with custom padding and size"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_RowCell.default, {
-        align: "center",
-        children: "cell 3 centered"
-      })]
-    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_TableRow.default, {
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_RowCell.default, {
-        mobileTitle: "Mobile title",
-        children: "Non clickable row cell 1"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_RowCell.default, {
-        mobileTitle: "Mobile title",
-        children: "cell 2"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_RowCell.default, {
-        align: "right",
-        children: "cell 3 right align"
-      })]
-    })]
-  }),
-  name: 'Table'
-};
-const WithCheckbox = exports.WithCheckbox = {
-  render: () => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.default, {
-    hasCheckbox: true,
-    columns: "35px 1fr 1fr",
-    type: "compact",
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_TableHeader.default, {
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_HeaderCell.default, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_HeaderCell.default, {
-        children: "Header 1"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_HeaderCell.default, {
-        children: "Header 2"
-      })]
-    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_TableRow.default, {
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Checkbox.default, {
-        checked: true
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_RowCell.default, {
-        children: "cell 2 with custom padding and size"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_RowCell.default, {
-        children: "cell 3 centered with very long text blablablablablablablablablabla"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_RowCell.default, {
-        children: "cell 3 centered"
-      })]
-    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_TableRow.default, {
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Checkbox.default, {
-        checked: true
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_RowCell.default, {
-        children: "cell 2"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_RowCell.default, {
-        children: "cell 3 right align"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_RowCell.default, {
-        children: "cell 3 right align"
-      })]
-    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_TableRow.default, {
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Checkbox.default, {
-        checked: true
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_RowCell.default, {
-        children: "cell 2"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_RowCell.default, {
-        children: "cell 3 right align"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Checkbox.default, {
-        children: "Should not break"
-      })]
-    })]
-  }),
-  name: 'Checkbox'
-};
-const WithSort = exports.WithSort = {
-  render: () => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.default, {
-    columns: "2fr 1fr 1fr",
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_TableHeader.default, {
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_HeaderCell.default, {
-        sortable: true,
-        sortOrder: "asc",
-        noSortReturnValue: "my value",
-        onSortChange: e => console.log('sort changed with value:', e),
-        children: "Sortable headers"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_HeaderCell.default, {
-        sortable: true,
-        sortOrder: "desc",
-        onSortChange: e => console.log('sort changed with value:', e),
-        children: "Header 2"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_HeaderCell.default, {
-        sortable: true,
-        sortOrder: "none",
-        onSortChange: e => console.log('sort changed with value:', e),
-        children: "Header 3"
-      })]
-    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_TableRow.default, {
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_RowCell.default, {
-        className: "my-classname",
-        children: "row 1 cell 1"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_RowCell.default, {
-        children: "row 1 cell 2"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_RowCell.default, {
-        children: "row 1 cell 3"
-      })]
-    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_TableRow.default, {
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_RowCell.default, {
-        children: "row 2 cell 1"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_RowCell.default, {
-        children: "row 2 cell 2"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_RowCell.default, {
-        ellipsis: true,
-        title: "Hello lots of stuff can be found here",
-        children: "Lots of stuff Lots of stuff Lots of stuff Lots of stuff Lots of stuff Lots of stuff Lots of stuff Lots of stuff Lots of stuff Lots of stuff Lots of stuff Lots of stuff"
-      })]
-    })]
-  }),
-  name: 'With sort'
-};
-const Mysite = exports.Mysite = {
-  render: () => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.default, {
-    type: "mysite",
-    columns: "2fr 1fr 1fr",
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_TableHeader.default, {
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_HeaderCell.default, {
-        sortable: true,
-        sortOrder: "asc",
-        noSortReturnValue: "my value",
-        onSortChange: e => console.log('sort changed with value:', e),
-        children: "Sortable headers"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_HeaderCell.default, {
-        sortable: true,
-        sortOrder: "desc",
-        onSortChange: e => console.log('sort changed with value:', e),
-        children: "Header 2"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_HeaderCell.default, {
-        sortable: true,
-        sortOrder: "none",
-        onSortChange: e => console.log('sort changed with value:', e),
-        children: "Header 3"
-      })]
-    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_TableRow.default, {
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_RowCell.default, {
-        children: "row 1 cell 1"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_RowCell.default, {
-        children: "row 1 cell 2"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_RowCell.default, {
-        children: "row 1 cell 3"
-      })]
-    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_TableRow.default, {
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_RowCell.default, {
-        children: "row 2 cell 1"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_RowCell.default, {
-        children: "row 2 cell 2"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_RowCell.default, {
-        children: "row 2 cell 3"
-      })]
-    })]
-  }),
-  name: 'Mysite'
-};
-const Compact = exports.Compact = {
-  render: () => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.default, {
-    type: "compact",
-    columns: "2fr 1fr 1fr",
-    minWidth: "100%",
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_TableHeader.default, {
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_HeaderCell.default, {
-        sortable: true,
-        sortOrder: "asc",
-        noSortReturnValue: "my value",
-        onSortChange: e => console.log('sort changed with value:', e),
-        children: "Sortable headers"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_HeaderCell.default, {
-        sortable: true,
-        sortOrder: "desc",
-        onSortChange: e => console.log('sort changed with value:', e),
-        children: "Header 2"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_HeaderCell.default, {
-        sortable: true,
-        sortOrder: "none",
-        onSortChange: e => console.log('sort changed with value:', e),
-        children: "Header 3"
-      })]
-    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_TableRow.default, {
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_RowCell.default, {
-        children: "row 1 cell 1"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_RowCell.default, {
-        children: "row 1 cell 2"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_RowCell.default, {
-        children: "row 1 cell 3"
-      })]
-    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_TableRow.default, {
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_RowCell.default, {
-        children: "row 2 cell 1"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_RowCell.default, {
-        children: "row 2 cell 2"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_RowCell.default, {
-        children: "row 2 cell 3"
-      })]
-    })]
-  }),
-  name: 'Compact'
-};
-const Expandable = exports.Expandable = {
-  render: () => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.default, {
-    type: "mysite",
-    columns: "1fr 1fr 1fr",
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_TableHeader.default, {
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_HeaderCell.default, {
-        children: "Header 1"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_HeaderCell.default, {
-        children: "Header 2"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_HeaderCell.default, {
-        children: "Header 3"
-      })]
-    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_TableRow.default, {
-      expandable: true,
-      expandableContent: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-        children: "This is some nice content"
-      }),
-      defaultExpanded: true,
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_RowCell.default, {
-        children: "row 1 cell 1"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_RowCell.default, {
-        children: "row 1 cell 2"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_RowCell.default, {
-        children: "row 1 cell 3"
-      })]
-    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_TableRow.default, {
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_RowCell.default, {
-        children: "row 2 cell 1"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_RowCell.default, {
-        children: "row 2 cell 2"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_RowCell.default, {
-        children: "row 2 cell 3"
-      })]
-    })]
-  }),
-  name: 'Expandable'
-};
-const DragAndDropList = exports.DragAndDropList = {
-  render: () => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.default, {
-    columns: "1fr 1fr 1fr",
-    onDrop: console.log,
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_TableHeader.default, {
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_HeaderCell.default, {
-        children: "Header 1"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_HeaderCell.default, {
-        children: "Header 2"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_HeaderCell.default, {
-        align: "center",
-        children: "Header 3 centered"
-      })]
-    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_DraggableRow.default, {
-      id: "1",
-      index: 0,
-      subContent: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-          children: "This is some nice content"
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)("br", {}), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-          children: "Here we can add lots of stuff"
-        })]
-      }),
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_RowCell.default, {
-        children: "row 1 cell 1"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_RowCell.default, {
-        children: "row 1 cell 2"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_RowCell.default, {
-        children: "row 1 cell 3"
-      })]
-    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_DraggableRow.default, {
-      id: "2",
-      index: 1,
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_RowCell.default, {
-        children: "row 2 cell 1"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_RowCell.default, {
-        children: "row 2 cell 2"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_RowCell.default, {
-        children: "row 2 cell 3"
-      })]
-    })]
-  }),
-  name: 'Drag and drop list'
-};
-const DragAndDropListDragDisabled = exports.DragAndDropListDragDisabled = {
-  render: () => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_.default, {
-    columns: "1fr 1fr 1fr",
-    onDrop: console.log,
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_TableHeader.default, {
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_HeaderCell.default, {
-        children: "Header 1"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_HeaderCell.default, {
-        children: "Header 2"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_HeaderCell.default, {
-        align: "center",
-        children: "Header 3 centered"
-      })]
-    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_DraggableRow.default, {
-      disableDrag: true,
-      id: "1",
-      index: 0,
-      subContent: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-          children: "This is some nice content"
-        })
-      }),
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_RowCell.default, {
-        children: "row 1 cell 1"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_RowCell.default, {
-        children: "row 1 cell 2"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_RowCell.default, {
-        children: "row 1 cell 3"
-      })]
-    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_DraggableRow.default, {
-      disableDrag: true,
-      id: "2",
-      index: 1,
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_RowCell.default, {
-        children: "row 2 cell 1"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_RowCell.default, {
-        children: "row 2 cell 2"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_RowCell.default, {
-        children: "row 2 cell 3"
-      })]
-    })]
-  }),
-  name: 'Drag and drop list (drag disabled)'
-};

package/lib/v2/core/BoxedTable/DraggableRow/index.d.ts

@@ -14,4 +14,3 @@ interface IProps {
 }
 declare const DraggableRow: FC<IProps>;
 export default DraggableRow;
-//# sourceMappingURL=index.d.ts.map

package/lib/v2/core/BoxedTable/DraggableRow/index.js

@@ -1,42 +1,6 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _reactBeautifulDnd = require("react-beautiful-dnd");
-var _IconRearrange = _interopRequireDefault(require("../../../../icons/General/IconRearrange"));
-var _styles = require("./styles");
-var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const DraggableRow = ({
-  id,
-  index,
-  children,
-  subContent,
-  disableDrag = false
-}) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBeautifulDnd.Draggable, {
-  draggableId: id,
-  index: index,
-  isDragDisabled: disableDrag,
-  children: provided => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.DraggableWrapper, {
-    className: "table-dragable",
-    ref: provided.innerRef,
-    ...provided.dragHandleProps,
-    ...provided.draggableProps,
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.RowWrapper, {
-      className: "table-dragrow",
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.DragIcon, {
-        children: !disableDrag && /*#__PURE__*/(0, _jsxRuntime.jsx)(_IconRearrange.default, {
-          size: "14px"
-        })
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.ContentWrapper, {
-        children: children
-      })]
-    }), subContent && /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.ExtraWrapper, {
-      children: subContent
-    })]
-  })
-}, id);
-var _default = exports.default = DraggableRow;
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Draggable } from 'react-beautiful-dnd';
+import IconRearrange from '../../../../icons/General/IconRearrange';
+import { ContentWrapper, DragIcon, DraggableWrapper, ExtraWrapper, RowWrapper, } from './styles';
+const DraggableRow = ({ id, index, children, subContent, disableDrag = false, }) => (_jsx(Draggable, { draggableId: id, index: index, isDragDisabled: disableDrag, children: (provided) => (_jsxs(DraggableWrapper, { className: "table-dragable", ref: provided.innerRef, ...provided.dragHandleProps, ...provided.draggableProps, children: [_jsxs(RowWrapper, { className: "table-dragrow", children: [_jsx(DragIcon, { children: !disableDrag && _jsx(IconRearrange, { size: "14px" }) }), _jsx(ContentWrapper, { children: children })] }), subContent && _jsx(ExtraWrapper, { children: subContent })] })) }, id));
+export default DraggableRow;

package/lib/v2/core/BoxedTable/DraggableRow/styles.d.ts

@@ -18,4 +18,3 @@ export declare const DragIcon: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
-//# sourceMappingURL=styles.d.ts.map