@dfds-ui/grid 2.2.0-alpha.98e68873 → 2.2.0-alpha.9edc847c

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -3,7 +3,7 @@
3
3
  "description": "Grid components",
4
4
  "license": "MIT",
5
5
  "private": false,
6
- "version": "2.2.0-alpha.98e68873",
6
+ "version": "2.2.0-alpha.9edc847c",
7
7
  "sideEffects": false,
8
8
  "main": "./cjs/index.js",
9
9
  "module": "./index.js",
@@ -11,18 +11,18 @@
11
11
  "typings": "./index.d.ts",
12
12
  "peerDependencies": {
13
13
  "@emotion/react": "11.14.0",
14
- "@emotion/styled": "11.14.0",
14
+ "@emotion/styled": "11.14.1",
15
15
  "react": ">= 18.3.1",
16
16
  "react-dom": ">= 18.3.1"
17
17
  },
18
18
  "dependencies": {
19
- "@dfds-ui/colors": "2.2.0-alpha.98e68873",
20
- "@dfds-ui/icons": "2.2.0-alpha.98e68873",
21
- "@dfds-ui/react-components": "2.2.0-alpha.98e68873",
22
- "@dfds-ui/theme": "2.2.0-alpha.98e68873",
19
+ "@dfds-ui/colors": "2.2.0-alpha.9edc847c",
20
+ "@dfds-ui/icons": "2.2.0-alpha.9edc847c",
21
+ "@dfds-ui/react-components": "2.2.0-alpha.9edc847c",
22
+ "@dfds-ui/theme": "2.2.0-alpha.9edc847c",
23
23
  "classnames": "^2.5.1"
24
24
  },
25
- "gitHead": "98e68873ace8ad4db37fd407dfe757396da57ac8",
25
+ "gitHead": "9edc847c21d2f86054d768d1f84d34027ca9d675",
26
26
  "publishConfig": {
27
27
  "access": "public"
28
28
  }
@@ -1,11 +0,0 @@
1
- import React, { ReactNode } from 'react';
2
- export declare type GridProps = {
3
- children: ReactNode;
4
- gap?: 's' | 'l';
5
- surface?: 'inverted' | 'dark' | 'transparent';
6
- top?: 's' | 'l';
7
- bottom?: 's' | 'l';
8
- className?: string;
9
- };
10
- export declare const Grid: ({ gap, surface, top, bottom, children, className }: GridProps) => React.JSX.Element;
11
- export default Grid;
package/cjs/grid/Grid.js DELETED
@@ -1,49 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = exports.Grid = void 0;
7
- var _react = _interopRequireDefault(require("react"));
8
- var _theme = require("@dfds-ui/theme");
9
- var _react2 = require("@emotion/react");
10
- var _classnames = _interopRequireDefault(require("classnames"));
11
- function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
12
- const Grid = ({
13
- gap,
14
- surface,
15
- top,
16
- bottom,
17
- children,
18
- className
19
- }) => {
20
- const getSurface = () => {
21
- if (surface === 'dark') return _theme.theme.colors.surface.secondary;
22
- if (surface === 'inverted') return _theme.theme.colors.surface.tertiary;
23
- if (surface === 'transparent') return 'rgba(0,0,0,0)';
24
- return _theme.theme.colors.surface.primary;
25
- };
26
- const getSize = size => {
27
- if (size && size === 's') return _theme.theme.spacing.s;
28
- if (size && size === 'l') return _theme.theme.spacing.l;
29
- return 0;
30
- };
31
- return (0, _react2.jsx)(_react.default.Fragment, null, (0, _react2.jsx)("div", {
32
- className: (0, _classnames.default)('grid-container', className),
33
- css: /*#__PURE__*/(0, _react2.css)("background-color:", getSurface(), ";" + (process.env.NODE_ENV === "production" ? "" : ";label:Grid;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9ncmlkL0dyaWQudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWdDZ0IiLCJmaWxlIjoiLi4vLi4vLi4vc3JjL2dyaWQvR3JpZC50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgUmVhY3QsIHsgUmVhY3ROb2RlIH0gZnJvbSAncmVhY3QnXG5pbXBvcnQgeyBtZWRpYSwgdGhlbWUgfSBmcm9tICdAZGZkcy11aS90aGVtZSdcbmltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0J1xuaW1wb3J0IGN4IGZyb20gJ2NsYXNzbmFtZXMnXG5cbmV4cG9ydCB0eXBlIEdyaWRQcm9wcyA9IHtcbiAgY2hpbGRyZW46IFJlYWN0Tm9kZVxuICBnYXA/OiAncycgfCAnbCdcbiAgc3VyZmFjZT86ICdpbnZlcnRlZCcgfCAnZGFyaycgfCAndHJhbnNwYXJlbnQnXG4gIHRvcD86ICdzJyB8ICdsJ1xuICBib3R0b20/OiAncycgfCAnbCdcbiAgY2xhc3NOYW1lPzogc3RyaW5nXG59XG5cbmV4cG9ydCBjb25zdCBHcmlkID0gKHsgZ2FwLCBzdXJmYWNlLCB0b3AsIGJvdHRvbSwgY2hpbGRyZW4sIGNsYXNzTmFtZSB9OiBHcmlkUHJvcHMpID0+IHtcbiAgY29uc3QgZ2V0U3VyZmFjZSA9ICgpID0+IHtcbiAgICBpZiAoc3VyZmFjZSA9PT0gJ2RhcmsnKSByZXR1cm4gdGhlbWUuY29sb3JzLnN1cmZhY2Uuc2Vjb25kYXJ5XG4gICAgaWYgKHN1cmZhY2UgPT09ICdpbnZlcnRlZCcpIHJldHVybiB0aGVtZS5jb2xvcnMuc3VyZmFjZS50ZXJ0aWFyeVxuICAgIGlmIChzdXJmYWNlID09PSAndHJhbnNwYXJlbnQnKSByZXR1cm4gJ3JnYmEoMCwwLDAsMCknXG4gICAgcmV0dXJuIHRoZW1lLmNvbG9ycy5zdXJmYWNlLnByaW1hcnlcbiAgfVxuXG4gIGNvbnN0IGdldFNpemUgPSAoc2l6ZT86IHN0cmluZykgPT4ge1xuICAgIGlmIChzaXplICYmIHNpemUgPT09ICdzJykgcmV0dXJuIHRoZW1lLnNwYWNpbmcuc1xuICAgIGlmIChzaXplICYmIHNpemUgPT09ICdsJykgcmV0dXJuIHRoZW1lLnNwYWNpbmcubFxuICAgIHJldHVybiAwXG4gIH1cblxuICByZXR1cm4gKFxuICAgIDw+XG4gICAgICA8ZGl2XG4gICAgICAgIGNsYXNzTmFtZT17Y3goJ2dyaWQtY29udGFpbmVyJywgY2xhc3NOYW1lKX1cbiAgICAgICAgY3NzPXtjc3NgXG4gICAgICAgICAgYmFja2dyb3VuZC1jb2xvcjogJHtnZXRTdXJmYWNlKCl9O1xuICAgICAgICBgfVxuICAgICAgPlxuICAgICAgICA8ZGl2XG4gICAgICAgICAgY2xhc3NOYW1lPVwiZ3JpZC1pbm5lci1jb250YWluZXJcIlxuICAgICAgICAgIGNzcz17Y3NzYFxuICAgICAgICAgICAgZGlzcGxheTogZ3JpZDtcbiAgICAgICAgICAgIG1hcmdpbjogMCBhdXRvOyAvKiBjZW50ZXIgaW4gdGhlIHZpZXdwb3J0ICovXG4gICAgICAgICAgICBncmlkLXRlbXBsYXRlLWNvbHVtbnM6IHJlcGVhdCgxMiwgMWZyKTtcbiAgICAgICAgICAgIG1heC13aWR0aDogMTIwMHB4O1xuICAgICAgICAgICAgZ3JpZC1yb3ctZ2FwOiAwO1xuICAgICAgICAgICAgZ3JpZC1jb2x1bW4tZ2FwOiAke2dhcCA9PT0gJ3MnID8gdGhlbWUuc3BhY2luZy5zIDogdGhlbWUuc3BhY2luZy5sfTtcbiAgICAgICAgICAgIHBhZGRpbmctdG9wOiAke2dldFNpemUodG9wKX07XG4gICAgICAgICAgICBwYWRkaW5nLWJvdHRvbTogJHtnZXRTaXplKGJvdHRvbSl9O1xuXG4gICAgICAgICAgICAke21lZGlhLmxlc3NUaGFuRXF1YWwoJ3hsJylgXG4gICAgICAgICAgICAgIG1heC13aWR0aDogdW5zZXQ7XG4gICAgICAgICAgICAgIG1hcmdpbi1sZWZ0OiA0MHB4O1xuICAgICAgICAgICAgICBtYXJnaW4tcmlnaHQ6IDQwcHg7XG4gICAgICAgICAgICBgfVxuXG4gICAgICAgICAgICAke21lZGlhLmxlc3NUaGFuRXF1YWwoJ20nKWBcbiAgICAgICAgICAgICAgbWFyZ2luLWxlZnQ6IDA7XG4gICAgICAgICAgICAgIG1hcmdpbi1yaWdodDogMDtcbiAgICAgICAgICAgICAgZ3JpZC1jb2x1bW4tZ2FwOiAke3RoZW1lLnNwYWNpbmcuc307XG4gICAgICAgICAgICBgfVxuICAgICAgICAgIGB9XG4gICAgICAgID5cbiAgICAgICAgICB7Y2hpbGRyZW59XG4gICAgICAgIDwvZGl2PlxuICAgICAgPC9kaXY+XG4gICAgPC8+XG4gIClcbn1cblxuZXhwb3J0IGRlZmF1bHQgR3JpZFxuIl19 */")
34
- }, (0, _react2.jsx)("div", {
35
- className: "grid-inner-container",
36
- css: /*#__PURE__*/(0, _react2.css)("display:grid;margin:0 auto;grid-template-columns:repeat(12, 1fr);max-width:1200px;grid-row-gap:0;grid-column-gap:", gap === 's' ? _theme.theme.spacing.s : _theme.theme.spacing.l, ";padding-top:", getSize(top), ";padding-bottom:", getSize(bottom), ";", _theme.media.lessThanEqual('xl')`
37
- max-width: unset;
38
- margin-left: 40px;
39
- margin-right: 40px;
40
- `, " ", _theme.media.lessThanEqual('m')`
41
- margin-left: 0;
42
- margin-right: 0;
43
- grid-column-gap: ${_theme.theme.spacing.s};
44
- `, ";" + (process.env.NODE_ENV === "production" ? "" : ";label:Grid;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9ncmlkL0dyaWQudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXNDa0IiLCJmaWxlIjoiLi4vLi4vLi4vc3JjL2dyaWQvR3JpZC50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgUmVhY3QsIHsgUmVhY3ROb2RlIH0gZnJvbSAncmVhY3QnXG5pbXBvcnQgeyBtZWRpYSwgdGhlbWUgfSBmcm9tICdAZGZkcy11aS90aGVtZSdcbmltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0J1xuaW1wb3J0IGN4IGZyb20gJ2NsYXNzbmFtZXMnXG5cbmV4cG9ydCB0eXBlIEdyaWRQcm9wcyA9IHtcbiAgY2hpbGRyZW46IFJlYWN0Tm9kZVxuICBnYXA/OiAncycgfCAnbCdcbiAgc3VyZmFjZT86ICdpbnZlcnRlZCcgfCAnZGFyaycgfCAndHJhbnNwYXJlbnQnXG4gIHRvcD86ICdzJyB8ICdsJ1xuICBib3R0b20/OiAncycgfCAnbCdcbiAgY2xhc3NOYW1lPzogc3RyaW5nXG59XG5cbmV4cG9ydCBjb25zdCBHcmlkID0gKHsgZ2FwLCBzdXJmYWNlLCB0b3AsIGJvdHRvbSwgY2hpbGRyZW4sIGNsYXNzTmFtZSB9OiBHcmlkUHJvcHMpID0+IHtcbiAgY29uc3QgZ2V0U3VyZmFjZSA9ICgpID0+IHtcbiAgICBpZiAoc3VyZmFjZSA9PT0gJ2RhcmsnKSByZXR1cm4gdGhlbWUuY29sb3JzLnN1cmZhY2Uuc2Vjb25kYXJ5XG4gICAgaWYgKHN1cmZhY2UgPT09ICdpbnZlcnRlZCcpIHJldHVybiB0aGVtZS5jb2xvcnMuc3VyZmFjZS50ZXJ0aWFyeVxuICAgIGlmIChzdXJmYWNlID09PSAndHJhbnNwYXJlbnQnKSByZXR1cm4gJ3JnYmEoMCwwLDAsMCknXG4gICAgcmV0dXJuIHRoZW1lLmNvbG9ycy5zdXJmYWNlLnByaW1hcnlcbiAgfVxuXG4gIGNvbnN0IGdldFNpemUgPSAoc2l6ZT86IHN0cmluZykgPT4ge1xuICAgIGlmIChzaXplICYmIHNpemUgPT09ICdzJykgcmV0dXJuIHRoZW1lLnNwYWNpbmcuc1xuICAgIGlmIChzaXplICYmIHNpemUgPT09ICdsJykgcmV0dXJuIHRoZW1lLnNwYWNpbmcubFxuICAgIHJldHVybiAwXG4gIH1cblxuICByZXR1cm4gKFxuICAgIDw+XG4gICAgICA8ZGl2XG4gICAgICAgIGNsYXNzTmFtZT17Y3goJ2dyaWQtY29udGFpbmVyJywgY2xhc3NOYW1lKX1cbiAgICAgICAgY3NzPXtjc3NgXG4gICAgICAgICAgYmFja2dyb3VuZC1jb2xvcjogJHtnZXRTdXJmYWNlKCl9O1xuICAgICAgICBgfVxuICAgICAgPlxuICAgICAgICA8ZGl2XG4gICAgICAgICAgY2xhc3NOYW1lPVwiZ3JpZC1pbm5lci1jb250YWluZXJcIlxuICAgICAgICAgIGNzcz17Y3NzYFxuICAgICAgICAgICAgZGlzcGxheTogZ3JpZDtcbiAgICAgICAgICAgIG1hcmdpbjogMCBhdXRvOyAvKiBjZW50ZXIgaW4gdGhlIHZpZXdwb3J0ICovXG4gICAgICAgICAgICBncmlkLXRlbXBsYXRlLWNvbHVtbnM6IHJlcGVhdCgxMiwgMWZyKTtcbiAgICAgICAgICAgIG1heC13aWR0aDogMTIwMHB4O1xuICAgICAgICAgICAgZ3JpZC1yb3ctZ2FwOiAwO1xuICAgICAgICAgICAgZ3JpZC1jb2x1bW4tZ2FwOiAke2dhcCA9PT0gJ3MnID8gdGhlbWUuc3BhY2luZy5zIDogdGhlbWUuc3BhY2luZy5sfTtcbiAgICAgICAgICAgIHBhZGRpbmctdG9wOiAke2dldFNpemUodG9wKX07XG4gICAgICAgICAgICBwYWRkaW5nLWJvdHRvbTogJHtnZXRTaXplKGJvdHRvbSl9O1xuXG4gICAgICAgICAgICAke21lZGlhLmxlc3NUaGFuRXF1YWwoJ3hsJylgXG4gICAgICAgICAgICAgIG1heC13aWR0aDogdW5zZXQ7XG4gICAgICAgICAgICAgIG1hcmdpbi1sZWZ0OiA0MHB4O1xuICAgICAgICAgICAgICBtYXJnaW4tcmlnaHQ6IDQwcHg7XG4gICAgICAgICAgICBgfVxuXG4gICAgICAgICAgICAke21lZGlhLmxlc3NUaGFuRXF1YWwoJ20nKWBcbiAgICAgICAgICAgICAgbWFyZ2luLWxlZnQ6IDA7XG4gICAgICAgICAgICAgIG1hcmdpbi1yaWdodDogMDtcbiAgICAgICAgICAgICAgZ3JpZC1jb2x1bW4tZ2FwOiAke3RoZW1lLnNwYWNpbmcuc307XG4gICAgICAgICAgICBgfVxuICAgICAgICAgIGB9XG4gICAgICAgID5cbiAgICAgICAgICB7Y2hpbGRyZW59XG4gICAgICAgIDwvZGl2PlxuICAgICAgPC9kaXY+XG4gICAgPC8+XG4gIClcbn1cblxuZXhwb3J0IGRlZmF1bHQgR3JpZFxuIl19 */")
45
- }, children)));
46
- };
47
- exports.Grid = Grid;
48
- var _default = Grid;
49
- exports.default = _default;
@@ -1,14 +0,0 @@
1
- import React, { ReactNode } from 'react';
2
- export declare type GridItemProps = {
3
- children: ReactNode;
4
- small?: 6 | 12;
5
- medium?: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;
6
- large?: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;
7
- xlarge?: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;
8
- /**
9
- * Class name to be assigned to the component
10
- */
11
- className?: string;
12
- };
13
- export declare const GridItem: (props: GridItemProps) => React.JSX.Element;
14
- export default GridItem;
@@ -1,30 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = exports.GridItem = void 0;
7
- var _react = _interopRequireDefault(require("react"));
8
- var _react2 = require("@emotion/react");
9
- var _theme = require("@dfds-ui/theme");
10
- var _classnames = _interopRequireDefault(require("classnames"));
11
- function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
12
- const GridItem = props => {
13
- const smallWidth = props.small || 12;
14
- const mediumWidth = props.medium || smallWidth;
15
- const largeWidth = props.large || mediumWidth;
16
- const xLargeWidth = props.xlarge || largeWidth;
17
- return (0, _react2.jsx)("div", {
18
- css: /*#__PURE__*/(0, _react2.css)("grid-column:span ", smallWidth, ";", _theme.media.greaterThan('m')`
19
- grid-column: span ${mediumWidth};
20
- `, " ", _theme.media.greaterThan('l')`
21
- grid-column: span ${largeWidth};
22
- `, " ", _theme.media.greaterThan('xl')`
23
- grid-column: span ${xLargeWidth};
24
- `, ";" + (process.env.NODE_ENV === "production" ? "" : ";label:GridItem;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9ncmlkL0dyaWRJdGVtLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUF5QmMiLCJmaWxlIjoiLi4vLi4vLi4vc3JjL2dyaWQvR3JpZEl0ZW0udHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0LCB7IFJlYWN0Tm9kZSB9IGZyb20gJ3JlYWN0J1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnXG5pbXBvcnQgeyBtZWRpYSB9IGZyb20gJ0BkZmRzLXVpL3RoZW1lJ1xuaW1wb3J0IGN4IGZyb20gJ2NsYXNzbmFtZXMnXG5cbmV4cG9ydCB0eXBlIEdyaWRJdGVtUHJvcHMgPSB7XG4gIGNoaWxkcmVuOiBSZWFjdE5vZGVcbiAgc21hbGw/OiA2IHwgMTJcbiAgbWVkaXVtPzogMSB8IDIgfCAzIHwgNCB8IDUgfCA2IHwgNyB8IDggfCA5IHwgMTAgfCAxMSB8IDEyXG4gIGxhcmdlPzogMSB8IDIgfCAzIHwgNCB8IDUgfCA2IHwgNyB8IDggfCA5IHwgMTAgfCAxMSB8IDEyXG4gIHhsYXJnZT86IDEgfCAyIHwgMyB8IDQgfCA1IHwgNiB8IDcgfCA4IHwgOSB8IDEwIHwgMTEgfCAxMlxuICAvKipcbiAgICogQ2xhc3MgbmFtZSB0byBiZSBhc3NpZ25lZCB0byB0aGUgY29tcG9uZW50XG4gICAqL1xuICBjbGFzc05hbWU/OiBzdHJpbmdcbn1cblxuZXhwb3J0IGNvbnN0IEdyaWRJdGVtID0gKHByb3BzOiBHcmlkSXRlbVByb3BzKSA9PiB7XG4gIGNvbnN0IHNtYWxsV2lkdGggPSBwcm9wcy5zbWFsbCB8fCAxMlxuICBjb25zdCBtZWRpdW1XaWR0aCA9IHByb3BzLm1lZGl1bSB8fCBzbWFsbFdpZHRoXG4gIGNvbnN0IGxhcmdlV2lkdGggPSBwcm9wcy5sYXJnZSB8fCBtZWRpdW1XaWR0aFxuICBjb25zdCB4TGFyZ2VXaWR0aCA9IHByb3BzLnhsYXJnZSB8fCBsYXJnZVdpZHRoXG5cbiAgcmV0dXJuIChcbiAgICA8ZGl2XG4gICAgICBjc3M9e2Nzc2BcbiAgICAgICAgZ3JpZC1jb2x1bW46IHNwYW4gJHtzbWFsbFdpZHRofTtcbiAgICAgICAgJHttZWRpYS5ncmVhdGVyVGhhbignbScpYFxuICAgICAgICAgIGdyaWQtY29sdW1uOiBzcGFuICR7bWVkaXVtV2lkdGh9O1xuICAgICAgICBgfVxuICAgICAgICAke21lZGlhLmdyZWF0ZXJUaGFuKCdsJylgXG4gICAgICAgICAgZ3JpZC1jb2x1bW46IHNwYW4gJHtsYXJnZVdpZHRofTtcbiAgICAgICAgYH1cbiAgICAgICAgJHttZWRpYS5ncmVhdGVyVGhhbigneGwnKWBcbiAgICAgICAgICBncmlkLWNvbHVtbjogc3BhbiAke3hMYXJnZVdpZHRofTtcbiAgICAgICAgYH1cbiAgICAgIGB9XG4gICAgICBjbGFzc05hbWU9e2N4KCdncmlkLWl0ZW0nLCBwcm9wcy5jbGFzc05hbWUpfVxuICAgID5cbiAgICAgIHtwcm9wcy5jaGlsZHJlbn1cbiAgICA8L2Rpdj5cbiAgKVxufVxuXG5leHBvcnQgZGVmYXVsdCBHcmlkSXRlbVxuIl19 */"),
25
- className: (0, _classnames.default)('grid-item', props.className)
26
- }, props.children);
27
- };
28
- exports.GridItem = GridItem;
29
- var _default = GridItem;
30
- exports.default = _default;
@@ -1,2 +0,0 @@
1
- export * from './Grid';
2
- export * from './GridItem';
package/cjs/grid/index.js DELETED
@@ -1,27 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- var _Grid = require("./Grid");
7
- Object.keys(_Grid).forEach(function (key) {
8
- if (key === "default" || key === "__esModule") return;
9
- if (key in exports && exports[key] === _Grid[key]) return;
10
- Object.defineProperty(exports, key, {
11
- enumerable: true,
12
- get: function () {
13
- return _Grid[key];
14
- }
15
- });
16
- });
17
- var _GridItem = require("./GridItem");
18
- Object.keys(_GridItem).forEach(function (key) {
19
- if (key === "default" || key === "__esModule") return;
20
- if (key in exports && exports[key] === _GridItem[key]) return;
21
- Object.defineProperty(exports, key, {
22
- enumerable: true,
23
- get: function () {
24
- return _GridItem[key];
25
- }
26
- });
27
- });
package/cjs/index.d.ts DELETED
@@ -1 +0,0 @@
1
- export * from './grid';
package/cjs/index.js DELETED
@@ -1,16 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- var _grid = require("./grid");
7
- Object.keys(_grid).forEach(function (key) {
8
- if (key === "default" || key === "__esModule") return;
9
- if (key in exports && exports[key] === _grid[key]) return;
10
- Object.defineProperty(exports, key, {
11
- enumerable: true,
12
- get: function () {
13
- return _grid[key];
14
- }
15
- });
16
- });
package/grid/Grid.d.ts DELETED
@@ -1,11 +0,0 @@
1
- import React, { ReactNode } from 'react';
2
- export declare type GridProps = {
3
- children: ReactNode;
4
- gap?: 's' | 'l';
5
- surface?: 'inverted' | 'dark' | 'transparent';
6
- top?: 's' | 'l';
7
- bottom?: 's' | 'l';
8
- className?: string;
9
- };
10
- export declare const Grid: ({ gap, surface, top, bottom, children, className }: GridProps) => React.JSX.Element;
11
- export default Grid;
package/grid/Grid.js DELETED
@@ -1,34 +0,0 @@
1
- var _templateObject, _templateObject2;
2
- function _taggedTemplateLiteral(e, t) { return t || (t = e.slice(0)), Object.freeze(Object.defineProperties(e, { raw: { value: Object.freeze(t) } })); }
3
- import React from 'react';
4
- import { media, theme } from '@dfds-ui/theme';
5
- import { css } from '@emotion/react';
6
- import cx from 'classnames';
7
- import { jsx as ___EmotionJSX } from "@emotion/react";
8
- export var Grid = function Grid(_ref) {
9
- var gap = _ref.gap,
10
- surface = _ref.surface,
11
- top = _ref.top,
12
- bottom = _ref.bottom,
13
- children = _ref.children,
14
- className = _ref.className;
15
- var getSurface = function getSurface() {
16
- if (surface === 'dark') return theme.colors.surface.secondary;
17
- if (surface === 'inverted') return theme.colors.surface.tertiary;
18
- if (surface === 'transparent') return 'rgba(0,0,0,0)';
19
- return theme.colors.surface.primary;
20
- };
21
- var getSize = function getSize(size) {
22
- if (size && size === 's') return theme.spacing.s;
23
- if (size && size === 'l') return theme.spacing.l;
24
- return 0;
25
- };
26
- return ___EmotionJSX(React.Fragment, null, ___EmotionJSX("div", {
27
- className: cx('grid-container', className),
28
- css: /*#__PURE__*/css("background-color:", getSurface(), ";" + (process.env.NODE_ENV === "production" ? "" : ";label:Grid;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9ncmlkL0dyaWQudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWdDZ0IiLCJmaWxlIjoiLi4vLi4vc3JjL2dyaWQvR3JpZC50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgUmVhY3QsIHsgUmVhY3ROb2RlIH0gZnJvbSAncmVhY3QnXG5pbXBvcnQgeyBtZWRpYSwgdGhlbWUgfSBmcm9tICdAZGZkcy11aS90aGVtZSdcbmltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0J1xuaW1wb3J0IGN4IGZyb20gJ2NsYXNzbmFtZXMnXG5cbmV4cG9ydCB0eXBlIEdyaWRQcm9wcyA9IHtcbiAgY2hpbGRyZW46IFJlYWN0Tm9kZVxuICBnYXA/OiAncycgfCAnbCdcbiAgc3VyZmFjZT86ICdpbnZlcnRlZCcgfCAnZGFyaycgfCAndHJhbnNwYXJlbnQnXG4gIHRvcD86ICdzJyB8ICdsJ1xuICBib3R0b20/OiAncycgfCAnbCdcbiAgY2xhc3NOYW1lPzogc3RyaW5nXG59XG5cbmV4cG9ydCBjb25zdCBHcmlkID0gKHsgZ2FwLCBzdXJmYWNlLCB0b3AsIGJvdHRvbSwgY2hpbGRyZW4sIGNsYXNzTmFtZSB9OiBHcmlkUHJvcHMpID0+IHtcbiAgY29uc3QgZ2V0U3VyZmFjZSA9ICgpID0+IHtcbiAgICBpZiAoc3VyZmFjZSA9PT0gJ2RhcmsnKSByZXR1cm4gdGhlbWUuY29sb3JzLnN1cmZhY2Uuc2Vjb25kYXJ5XG4gICAgaWYgKHN1cmZhY2UgPT09ICdpbnZlcnRlZCcpIHJldHVybiB0aGVtZS5jb2xvcnMuc3VyZmFjZS50ZXJ0aWFyeVxuICAgIGlmIChzdXJmYWNlID09PSAndHJhbnNwYXJlbnQnKSByZXR1cm4gJ3JnYmEoMCwwLDAsMCknXG4gICAgcmV0dXJuIHRoZW1lLmNvbG9ycy5zdXJmYWNlLnByaW1hcnlcbiAgfVxuXG4gIGNvbnN0IGdldFNpemUgPSAoc2l6ZT86IHN0cmluZykgPT4ge1xuICAgIGlmIChzaXplICYmIHNpemUgPT09ICdzJykgcmV0dXJuIHRoZW1lLnNwYWNpbmcuc1xuICAgIGlmIChzaXplICYmIHNpemUgPT09ICdsJykgcmV0dXJuIHRoZW1lLnNwYWNpbmcubFxuICAgIHJldHVybiAwXG4gIH1cblxuICByZXR1cm4gKFxuICAgIDw+XG4gICAgICA8ZGl2XG4gICAgICAgIGNsYXNzTmFtZT17Y3goJ2dyaWQtY29udGFpbmVyJywgY2xhc3NOYW1lKX1cbiAgICAgICAgY3NzPXtjc3NgXG4gICAgICAgICAgYmFja2dyb3VuZC1jb2xvcjogJHtnZXRTdXJmYWNlKCl9O1xuICAgICAgICBgfVxuICAgICAgPlxuICAgICAgICA8ZGl2XG4gICAgICAgICAgY2xhc3NOYW1lPVwiZ3JpZC1pbm5lci1jb250YWluZXJcIlxuICAgICAgICAgIGNzcz17Y3NzYFxuICAgICAgICAgICAgZGlzcGxheTogZ3JpZDtcbiAgICAgICAgICAgIG1hcmdpbjogMCBhdXRvOyAvKiBjZW50ZXIgaW4gdGhlIHZpZXdwb3J0ICovXG4gICAgICAgICAgICBncmlkLXRlbXBsYXRlLWNvbHVtbnM6IHJlcGVhdCgxMiwgMWZyKTtcbiAgICAgICAgICAgIG1heC13aWR0aDogMTIwMHB4O1xuICAgICAgICAgICAgZ3JpZC1yb3ctZ2FwOiAwO1xuICAgICAgICAgICAgZ3JpZC1jb2x1bW4tZ2FwOiAke2dhcCA9PT0gJ3MnID8gdGhlbWUuc3BhY2luZy5zIDogdGhlbWUuc3BhY2luZy5sfTtcbiAgICAgICAgICAgIHBhZGRpbmctdG9wOiAke2dldFNpemUodG9wKX07XG4gICAgICAgICAgICBwYWRkaW5nLWJvdHRvbTogJHtnZXRTaXplKGJvdHRvbSl9O1xuXG4gICAgICAgICAgICAke21lZGlhLmxlc3NUaGFuRXF1YWwoJ3hsJylgXG4gICAgICAgICAgICAgIG1heC13aWR0aDogdW5zZXQ7XG4gICAgICAgICAgICAgIG1hcmdpbi1sZWZ0OiA0MHB4O1xuICAgICAgICAgICAgICBtYXJnaW4tcmlnaHQ6IDQwcHg7XG4gICAgICAgICAgICBgfVxuXG4gICAgICAgICAgICAke21lZGlhLmxlc3NUaGFuRXF1YWwoJ20nKWBcbiAgICAgICAgICAgICAgbWFyZ2luLWxlZnQ6IDA7XG4gICAgICAgICAgICAgIG1hcmdpbi1yaWdodDogMDtcbiAgICAgICAgICAgICAgZ3JpZC1jb2x1bW4tZ2FwOiAke3RoZW1lLnNwYWNpbmcuc307XG4gICAgICAgICAgICBgfVxuICAgICAgICAgIGB9XG4gICAgICAgID5cbiAgICAgICAgICB7Y2hpbGRyZW59XG4gICAgICAgIDwvZGl2PlxuICAgICAgPC9kaXY+XG4gICAgPC8+XG4gIClcbn1cblxuZXhwb3J0IGRlZmF1bHQgR3JpZFxuIl19 */")
29
- }, ___EmotionJSX("div", {
30
- className: "grid-inner-container",
31
- css: /*#__PURE__*/css("display:grid;margin:0 auto;grid-template-columns:repeat(12, 1fr);max-width:1200px;grid-row-gap:0;grid-column-gap:", gap === 's' ? theme.spacing.s : theme.spacing.l, ";padding-top:", getSize(top), ";padding-bottom:", getSize(bottom), ";", media.lessThanEqual('xl')(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n max-width: unset;\n margin-left: 40px;\n margin-right: 40px;\n "]))), " ", media.lessThanEqual('m')(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n margin-left: 0;\n margin-right: 0;\n grid-column-gap: ", ";\n "])), theme.spacing.s), ";" + (process.env.NODE_ENV === "production" ? "" : ";label:Grid;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9ncmlkL0dyaWQudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXNDa0IiLCJmaWxlIjoiLi4vLi4vc3JjL2dyaWQvR3JpZC50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgUmVhY3QsIHsgUmVhY3ROb2RlIH0gZnJvbSAncmVhY3QnXG5pbXBvcnQgeyBtZWRpYSwgdGhlbWUgfSBmcm9tICdAZGZkcy11aS90aGVtZSdcbmltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0J1xuaW1wb3J0IGN4IGZyb20gJ2NsYXNzbmFtZXMnXG5cbmV4cG9ydCB0eXBlIEdyaWRQcm9wcyA9IHtcbiAgY2hpbGRyZW46IFJlYWN0Tm9kZVxuICBnYXA/OiAncycgfCAnbCdcbiAgc3VyZmFjZT86ICdpbnZlcnRlZCcgfCAnZGFyaycgfCAndHJhbnNwYXJlbnQnXG4gIHRvcD86ICdzJyB8ICdsJ1xuICBib3R0b20/OiAncycgfCAnbCdcbiAgY2xhc3NOYW1lPzogc3RyaW5nXG59XG5cbmV4cG9ydCBjb25zdCBHcmlkID0gKHsgZ2FwLCBzdXJmYWNlLCB0b3AsIGJvdHRvbSwgY2hpbGRyZW4sIGNsYXNzTmFtZSB9OiBHcmlkUHJvcHMpID0+IHtcbiAgY29uc3QgZ2V0U3VyZmFjZSA9ICgpID0+IHtcbiAgICBpZiAoc3VyZmFjZSA9PT0gJ2RhcmsnKSByZXR1cm4gdGhlbWUuY29sb3JzLnN1cmZhY2Uuc2Vjb25kYXJ5XG4gICAgaWYgKHN1cmZhY2UgPT09ICdpbnZlcnRlZCcpIHJldHVybiB0aGVtZS5jb2xvcnMuc3VyZmFjZS50ZXJ0aWFyeVxuICAgIGlmIChzdXJmYWNlID09PSAndHJhbnNwYXJlbnQnKSByZXR1cm4gJ3JnYmEoMCwwLDAsMCknXG4gICAgcmV0dXJuIHRoZW1lLmNvbG9ycy5zdXJmYWNlLnByaW1hcnlcbiAgfVxuXG4gIGNvbnN0IGdldFNpemUgPSAoc2l6ZT86IHN0cmluZykgPT4ge1xuICAgIGlmIChzaXplICYmIHNpemUgPT09ICdzJykgcmV0dXJuIHRoZW1lLnNwYWNpbmcuc1xuICAgIGlmIChzaXplICYmIHNpemUgPT09ICdsJykgcmV0dXJuIHRoZW1lLnNwYWNpbmcubFxuICAgIHJldHVybiAwXG4gIH1cblxuICByZXR1cm4gKFxuICAgIDw+XG4gICAgICA8ZGl2XG4gICAgICAgIGNsYXNzTmFtZT17Y3goJ2dyaWQtY29udGFpbmVyJywgY2xhc3NOYW1lKX1cbiAgICAgICAgY3NzPXtjc3NgXG4gICAgICAgICAgYmFja2dyb3VuZC1jb2xvcjogJHtnZXRTdXJmYWNlKCl9O1xuICAgICAgICBgfVxuICAgICAgPlxuICAgICAgICA8ZGl2XG4gICAgICAgICAgY2xhc3NOYW1lPVwiZ3JpZC1pbm5lci1jb250YWluZXJcIlxuICAgICAgICAgIGNzcz17Y3NzYFxuICAgICAgICAgICAgZGlzcGxheTogZ3JpZDtcbiAgICAgICAgICAgIG1hcmdpbjogMCBhdXRvOyAvKiBjZW50ZXIgaW4gdGhlIHZpZXdwb3J0ICovXG4gICAgICAgICAgICBncmlkLXRlbXBsYXRlLWNvbHVtbnM6IHJlcGVhdCgxMiwgMWZyKTtcbiAgICAgICAgICAgIG1heC13aWR0aDogMTIwMHB4O1xuICAgICAgICAgICAgZ3JpZC1yb3ctZ2FwOiAwO1xuICAgICAgICAgICAgZ3JpZC1jb2x1bW4tZ2FwOiAke2dhcCA9PT0gJ3MnID8gdGhlbWUuc3BhY2luZy5zIDogdGhlbWUuc3BhY2luZy5sfTtcbiAgICAgICAgICAgIHBhZGRpbmctdG9wOiAke2dldFNpemUodG9wKX07XG4gICAgICAgICAgICBwYWRkaW5nLWJvdHRvbTogJHtnZXRTaXplKGJvdHRvbSl9O1xuXG4gICAgICAgICAgICAke21lZGlhLmxlc3NUaGFuRXF1YWwoJ3hsJylgXG4gICAgICAgICAgICAgIG1heC13aWR0aDogdW5zZXQ7XG4gICAgICAgICAgICAgIG1hcmdpbi1sZWZ0OiA0MHB4O1xuICAgICAgICAgICAgICBtYXJnaW4tcmlnaHQ6IDQwcHg7XG4gICAgICAgICAgICBgfVxuXG4gICAgICAgICAgICAke21lZGlhLmxlc3NUaGFuRXF1YWwoJ20nKWBcbiAgICAgICAgICAgICAgbWFyZ2luLWxlZnQ6IDA7XG4gICAgICAgICAgICAgIG1hcmdpbi1yaWdodDogMDtcbiAgICAgICAgICAgICAgZ3JpZC1jb2x1bW4tZ2FwOiAke3RoZW1lLnNwYWNpbmcuc307XG4gICAgICAgICAgICBgfVxuICAgICAgICAgIGB9XG4gICAgICAgID5cbiAgICAgICAgICB7Y2hpbGRyZW59XG4gICAgICAgIDwvZGl2PlxuICAgICAgPC9kaXY+XG4gICAgPC8+XG4gIClcbn1cblxuZXhwb3J0IGRlZmF1bHQgR3JpZFxuIl19 */")
32
- }, children)));
33
- };
34
- export default Grid;
@@ -1,14 +0,0 @@
1
- import React, { ReactNode } from 'react';
2
- export declare type GridItemProps = {
3
- children: ReactNode;
4
- small?: 6 | 12;
5
- medium?: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;
6
- large?: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;
7
- xlarge?: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;
8
- /**
9
- * Class name to be assigned to the component
10
- */
11
- className?: string;
12
- };
13
- export declare const GridItem: (props: GridItemProps) => React.JSX.Element;
14
- export default GridItem;
package/grid/GridItem.js DELETED
@@ -1,18 +0,0 @@
1
- var _templateObject, _templateObject2, _templateObject3;
2
- function _taggedTemplateLiteral(e, t) { return t || (t = e.slice(0)), Object.freeze(Object.defineProperties(e, { raw: { value: Object.freeze(t) } })); }
3
- import React from 'react';
4
- import { css } from '@emotion/react';
5
- import { media } from '@dfds-ui/theme';
6
- import cx from 'classnames';
7
- import { jsx as ___EmotionJSX } from "@emotion/react";
8
- export var GridItem = function GridItem(props) {
9
- var smallWidth = props.small || 12;
10
- var mediumWidth = props.medium || smallWidth;
11
- var largeWidth = props.large || mediumWidth;
12
- var xLargeWidth = props.xlarge || largeWidth;
13
- return ___EmotionJSX("div", {
14
- css: /*#__PURE__*/css("grid-column:span ", smallWidth, ";", media.greaterThan('m')(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n grid-column: span ", ";\n "])), mediumWidth), " ", media.greaterThan('l')(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n grid-column: span ", ";\n "])), largeWidth), " ", media.greaterThan('xl')(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n grid-column: span ", ";\n "])), xLargeWidth), ";" + (process.env.NODE_ENV === "production" ? "" : ";label:GridItem;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9ncmlkL0dyaWRJdGVtLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUF5QmMiLCJmaWxlIjoiLi4vLi4vc3JjL2dyaWQvR3JpZEl0ZW0udHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0LCB7IFJlYWN0Tm9kZSB9IGZyb20gJ3JlYWN0J1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnXG5pbXBvcnQgeyBtZWRpYSB9IGZyb20gJ0BkZmRzLXVpL3RoZW1lJ1xuaW1wb3J0IGN4IGZyb20gJ2NsYXNzbmFtZXMnXG5cbmV4cG9ydCB0eXBlIEdyaWRJdGVtUHJvcHMgPSB7XG4gIGNoaWxkcmVuOiBSZWFjdE5vZGVcbiAgc21hbGw/OiA2IHwgMTJcbiAgbWVkaXVtPzogMSB8IDIgfCAzIHwgNCB8IDUgfCA2IHwgNyB8IDggfCA5IHwgMTAgfCAxMSB8IDEyXG4gIGxhcmdlPzogMSB8IDIgfCAzIHwgNCB8IDUgfCA2IHwgNyB8IDggfCA5IHwgMTAgfCAxMSB8IDEyXG4gIHhsYXJnZT86IDEgfCAyIHwgMyB8IDQgfCA1IHwgNiB8IDcgfCA4IHwgOSB8IDEwIHwgMTEgfCAxMlxuICAvKipcbiAgICogQ2xhc3MgbmFtZSB0byBiZSBhc3NpZ25lZCB0byB0aGUgY29tcG9uZW50XG4gICAqL1xuICBjbGFzc05hbWU/OiBzdHJpbmdcbn1cblxuZXhwb3J0IGNvbnN0IEdyaWRJdGVtID0gKHByb3BzOiBHcmlkSXRlbVByb3BzKSA9PiB7XG4gIGNvbnN0IHNtYWxsV2lkdGggPSBwcm9wcy5zbWFsbCB8fCAxMlxuICBjb25zdCBtZWRpdW1XaWR0aCA9IHByb3BzLm1lZGl1bSB8fCBzbWFsbFdpZHRoXG4gIGNvbnN0IGxhcmdlV2lkdGggPSBwcm9wcy5sYXJnZSB8fCBtZWRpdW1XaWR0aFxuICBjb25zdCB4TGFyZ2VXaWR0aCA9IHByb3BzLnhsYXJnZSB8fCBsYXJnZVdpZHRoXG5cbiAgcmV0dXJuIChcbiAgICA8ZGl2XG4gICAgICBjc3M9e2Nzc2BcbiAgICAgICAgZ3JpZC1jb2x1bW46IHNwYW4gJHtzbWFsbFdpZHRofTtcbiAgICAgICAgJHttZWRpYS5ncmVhdGVyVGhhbignbScpYFxuICAgICAgICAgIGdyaWQtY29sdW1uOiBzcGFuICR7bWVkaXVtV2lkdGh9O1xuICAgICAgICBgfVxuICAgICAgICAke21lZGlhLmdyZWF0ZXJUaGFuKCdsJylgXG4gICAgICAgICAgZ3JpZC1jb2x1bW46IHNwYW4gJHtsYXJnZVdpZHRofTtcbiAgICAgICAgYH1cbiAgICAgICAgJHttZWRpYS5ncmVhdGVyVGhhbigneGwnKWBcbiAgICAgICAgICBncmlkLWNvbHVtbjogc3BhbiAke3hMYXJnZVdpZHRofTtcbiAgICAgICAgYH1cbiAgICAgIGB9XG4gICAgICBjbGFzc05hbWU9e2N4KCdncmlkLWl0ZW0nLCBwcm9wcy5jbGFzc05hbWUpfVxuICAgID5cbiAgICAgIHtwcm9wcy5jaGlsZHJlbn1cbiAgICA8L2Rpdj5cbiAgKVxufVxuXG5leHBvcnQgZGVmYXVsdCBHcmlkSXRlbVxuIl19 */"),
15
- className: cx('grid-item', props.className)
16
- }, props.children);
17
- };
18
- export default GridItem;
package/grid/index.d.ts DELETED
@@ -1,2 +0,0 @@
1
- export * from './Grid';
2
- export * from './GridItem';
package/grid/index.js DELETED
@@ -1,2 +0,0 @@
1
- export * from './Grid';
2
- export * from './GridItem';
package/index.d.ts DELETED
@@ -1 +0,0 @@
1
- export * from './grid';
package/index.js DELETED
@@ -1 +0,0 @@
1
- export * from './grid';