@doodl/slate 1.22.2 → 1.22.3

package/CHANGELOG.md

@@ -2,6 +2,13 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+### [1.22.3](https://bitbucket.org/doodlltd/slate/compare/v1.22.2...v1.22.3) (2022-02-13)
+
+
+### Bug Fixes
+
+* Flag default breakpoints as SCSS defaults ([f380ddc](https://bitbucket.org/doodlltd/slate/commit/f380ddce65ef6287b040e2a2a796ebf0eecbc29d))
+
 ### [1.22.2](https://bitbucket.org/doodlltd/slate/compare/v1.22.1...v1.22.2) (2021-12-22)
 
 

package/js/dist/react-components/grid/grid-item.js

@@ -10,11 +10,11 @@ function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToAr
 
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
 
-import React from 'react';
+import React, { forwardRef } from 'react';
 import classNames from "classnames";
 import styles from '../../../../scss/css-modules/grid.module.scss';
 
-var GridItem = function GridItem(props) {
+var GridItem = function GridItem(props, ref) {
   var children = props.children,
       className = props.className,
       _props$component = props.component,
@@ -28,8 +28,9 @@ var GridItem = function GridItem(props) {
   });
   var gridItemClasses = classNames.apply(void 0, _toConsumableArray(gridSizes).concat([className]));
   return /*#__PURE__*/React.createElement(Component, {
+    ref: ref,
     className: gridItemClasses
   }, children);
 };
 
-export default GridItem;
+export default /*#__PURE__*/forwardRef(GridItem);

package/js/dist/react-components/grid/index.js

@@ -12,14 +12,15 @@ function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToAr
 
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
 
-import React from 'react';
+import React, { forwardRef } from 'react';
 import classNames from 'classnames';
 import styles from '../../../../scss/css-modules/grid.module.scss';
 
-var Grid = function Grid(props) {
+var Grid = function Grid(props, ref) {
   var _ref;
 
   var children = props.children,
+      className = props.className,
       _props$component = props.component,
       Component = _props$component === void 0 ? 'div' : _props$component,
       _props$center = props.center,
@@ -34,10 +35,11 @@ var Grid = function Grid(props) {
   var gridSizes = sizes.split(" ").map(function (size) {
     return styles["".concat(slateGridClassName, "-width-").concat(size)];
   });
-  var gridClasses = classNames.apply(void 0, [styles[slateGridClassName]].concat(_toConsumableArray(gridSizes), [(_ref = {}, _defineProperty(_ref, styles['center'], center), _defineProperty(_ref, styles['verticalCenter'], verticalCenter), _ref), gridClassName]));
+  var gridClasses = classNames.apply(void 0, [styles[slateGridClassName]].concat(_toConsumableArray(gridSizes), [(_ref = {}, _defineProperty(_ref, styles.center, center), _defineProperty(_ref, styles.verticalCenter, verticalCenter), _ref), className, gridClassName]));
   return /*#__PURE__*/React.createElement(Component, {
+    ref: ref,
     className: gridClasses
   }, children);
 };
 
-export default Grid;
+export default /*#__PURE__*/forwardRef(Grid);

package/js/dist/react-components/grid/padded-grid.js

@@ -1,27 +1,27 @@
-var _excluded = ["children", "component", "className", "gridClassName"];
+var _excluded = ["children", "component", "className"];
 
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 
-import React from 'react';
+import React, { forwardRef } from 'react';
 import classNames from "classnames";
 import Grid from ".";
 import styles from '../../../../scss/css-modules/grid.module.scss';
 
-var PaddedGrid = function PaddedGrid(props) {
+var PaddedGrid = function PaddedGrid(props, ref) {
   var children = props.children,
       _props$component = props.component,
       Component = _props$component === void 0 ? 'div' : _props$component,
       className = props.className,
-      gridClassName = props.gridClassName,
       gridProps = _objectWithoutProperties(props, _excluded);
 
   var slatePaddedGridClassName = styles.slatePaddedGridClassName;
   var paddedGridClasses = classNames(styles[slatePaddedGridClassName], className);
   return /*#__PURE__*/React.createElement(Component, {
+    ref: ref,
     className: paddedGridClasses
   }, /*#__PURE__*/React.createElement(Grid, gridProps, children));
 };
 
-export default PaddedGrid;
+export default /*#__PURE__*/forwardRef(PaddedGrid);

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@doodl/slate",
-    "version": "1.22.2",
+    "version": "1.22.3",
     "description": "",
     "main": "./js/dist/index.js",
     "module": "./js/dist/index.js",

package/scss/variables/_breakpoints.scss

@@ -10,14 +10,14 @@ $slate-breakpoints: (
     medium: $slate-breakpoints-medium,
     large: $slate-breakpoints-large,
     x-large: $slate-breakpoints-x-large
-);
+) !default;
 
 $slate-media-queries: (
     small: screen and (min-width: $slate-breakpoints-small),
     medium: screen and (min-width: $slate-breakpoints-medium),
     large: screen and (min-width: $slate-breakpoints-large),
     x-large: screen and (min-width: $slate-breakpoints-x-large)
-);
+) !default;
 
 :export {
     small: $slate-breakpoints-small;