@synerise/ds-grid 1.1.4 → 1.1.6

package/README.md

@@ -6,6 +6,7 @@ title: Grid
 Grid UI Component
 
 ## Installation
+
 ```
 npm i @synerise/ds-grid
 or
@@ -13,9 +14,10 @@ yarn add @synerise/ds-grid
 ```
 
 ## Usage
+
 ```
 import Grid from '@synerise/ds-grid'
- 
+
 <Grid>
     <Grid.Item xxl={12} xl={8} lg={6} md={4} sm={4} xs={3}>
         <Card>...</Card>
@@ -39,15 +41,13 @@ import Grid from '@synerise/ds-grid'
 ### Grid
 
 | Property | Description                | Type   | Default |
-| -------- | -----------                | ----   | ------- |
+| -------- | -------------------------- | ------ | ------- |
 | gutter   | Spacing between grids (px) | number | 24      |
 
-
-
 ### Grid.Item
 
 | Property       | Description                                                                               | Type    | Default |
-| --------       | -----------                                                                               | ----    | ------- |
+| -------------- | ----------------------------------------------------------------------------------------- | ------- | ------- |
 | xxl            | `screen > 1600`, number of cells to occupy, 0 corresponds to display: none, max value: 24 | number  | -       |
 | xl             | `screen > 1280`, number of cells to occupy, 0 corresponds to display: none, max value: 16 | number  | -       |
 | lg             | `screen > 960`, number of cells to occupy, 0 corresponds to display: none, max value: 12  | number  | -       |
@@ -55,5 +55,3 @@ import Grid from '@synerise/ds-grid'
 | sm             | `screen > 320`, number of cells to occupy, 0 corresponds to display: none, max value: 8   | number  | -       |
 | xs             | `screen <= 320`, number of cells to occupy, 0 corresponds to display: none, max value: 3  | number  | -       |
 | contentWrapper | Group content with max size (defined in col size props) and center them horizontally      | boolean | -       |
-
-

package/dist/Grid.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { GridProps } from './Grid.types';
+import { type GridProps } from './Grid.types';
 export declare const GridContext: React.Context<{
     dimensions: {
         width: number;

package/dist/Grid.styles.d.ts

@@ -3,7 +3,7 @@ export declare const GridContainer: import("styled-components").StyledComponent<
     gutter: number;
 }, never>;
 export declare const GridItem: import("styled-components").StyledComponent<"div", any, {
-    columns?: number | undefined;
+    columns?: number;
     contentWrapper: boolean;
     maxColumns: number;
 }, never>;

package/dist/Grid.types.d.ts

@@ -1,4 +1,4 @@
-import { CSSProperties, ReactNode } from 'react';
+import { type CSSProperties, type ReactNode } from 'react';
 export type GridProps = {
     gutter?: number;
     style?: CSSProperties;

package/dist/GridItem/GridItem.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
-import { GridItemProps } from '../Grid.types';
+import { type GridItemProps } from '../Grid.types';
 declare const Item: ({ children, contentWrapper, ...props }: GridItemProps) => React.JSX.Element;
 export default Item;

package/dist/GridItem/GridItem.js

@@ -1,16 +1,16 @@
 var _excluded = ["children", "contentWrapper"];
 function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
-import React from 'react';
-import * as S from '../Grid.styles';
+import React, { useContext, useMemo } from 'react';
 import { DEFAULT_COLUMNS_NUMBER, GridContext } from '../Grid';
+import * as S from '../Grid.styles';
 var BREAKPOINTS = ['xxl', 'xl', 'lg', 'md', 'sm', 'xs'];
 var Item = function Item(_ref) {
   var _breakpointData$break2;
   var children = _ref.children,
     contentWrapper = _ref.contentWrapper,
     props = _objectWithoutPropertiesLoose(_ref, _excluded);
-  var breakpointData = React.useContext(GridContext);
-  var definedBreakpoints = React.useMemo(function () {
+  var breakpointData = useContext(GridContext);
+  var definedBreakpoints = useMemo(function () {
     return BREAKPOINTS.filter(function (breakpoint) {
       return props[breakpoint] !== undefined;
     }).map(function (breakpoint) {
@@ -20,10 +20,12 @@ var Item = function Item(_ref) {
       };
     });
   }, [props]);
-  var breakpointColumns = React.useMemo(function () {
+  var breakpointColumns = useMemo(function () {
     if (breakpointData.breakpoint) {
       var name = breakpointData.breakpoint.name;
-      if (props[name] !== undefined) return props[name];
+      if (props[name] !== undefined) {
+        return props[name];
+      }
       var indexOfCurrentBreakpoint = BREAKPOINTS.indexOf(name);
       var nextAvailableBreakpoint = definedBreakpoints.find(function (breakpoint) {
         return breakpoint.index >= indexOfCurrentBreakpoint;
@@ -32,9 +34,11 @@ var Item = function Item(_ref) {
     }
     return undefined;
   }, [breakpointData.breakpoint, definedBreakpoints, props]);
-  var getColumns = React.useMemo(function () {
+  var getColumns = useMemo(function () {
     var _breakpointData$break;
-    if (breakpointColumns !== undefined) return breakpointColumns;
+    if (breakpointColumns !== undefined) {
+      return breakpointColumns;
+    }
     return ((_breakpointData$break = breakpointData.breakpoint) == null ? void 0 : _breakpointData$break.columns) || DEFAULT_COLUMNS_NUMBER;
   }, [breakpointColumns, breakpointData]);
   return /*#__PURE__*/React.createElement(S.GridItem, {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@synerise/ds-grid",
-  "version": "1.1.4",
+  "version": "1.1.6",
   "description": "Grid UI Component for the Synerise Design System",
   "license": "ISC",
   "repository": "Synerise/synerise-design",
@@ -34,12 +34,12 @@
   ],
   "types": "dist/index.d.ts",
   "dependencies": {
-    "@synerise/ds-utils": "^1.3.0"
+    "@synerise/ds-utils": "^1.4.0"
   },
   "peerDependencies": {
     "@synerise/ds-core": "*",
     "react": ">=16.9.0 <= 18.3.1",
     "styled-components": "^5.3.3"
   },
-  "gitHead": "f2713cd35cfe22f63a159f05144585834897a132"
+  "gitHead": "b35b1875727156fe9f5b3bad55aed5ca447c8c8d"
 }