@steroidsjs/bootstrap 3.0.0-beta.122 → 3.0.0-beta.123

package/content/Calendar/CalendarView.js

@@ -38,7 +38,6 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 exports.__esModule = true;
 var React = __importStar(require("react"));
-var moment_1 = __importDefault(require("react-day-picker/moment"));
 var react_1 = require("react");
 var hooks_1 = require("@steroidsjs/core/hooks");
 var react_day_picker_1 = __importStar(require("react-day-picker"));
@@ -81,6 +80,6 @@ function CalendarView(props) {
             else {
                 onDaySelect(day);
             }
-        }, fixedWeeks: true, month: month, firstDayOfWeek: 1, modifiers: modifiers, canChangeMonth: false, onDayClick: onDaySelect, selectedDays: selectedDays, numberOfMonths: numberOfMonths, localeUtils: moment_1["default"], locale: localeComponent.language })));
+        }, fixedWeeks: true, month: month, firstDayOfWeek: 1, modifiers: modifiers, canChangeMonth: false, onDayClick: onDaySelect, selectedDays: selectedDays, numberOfMonths: numberOfMonths, localeUtils: react_day_picker_1.LocaleUtils, locale: localeComponent.language })));
 }
 exports["default"] = CalendarView;

package/form/DropDownField/DropDownFieldView.js

@@ -65,10 +65,10 @@ function DropDownFieldView(props) {
             _a["outline_".concat(props.color)] = props.outline,
             _a.opened = props.isOpened,
             _a['is-invalid'] = !!props.errors,
-            _a)), props.className), onKeyPress: function (e) { return e.key === 'Enter' && props.onOpen(); }, style: props.style, role: "button", tabIndex: 0 },
+            _a.disabled = props.disabled,
+            _a)), props.className), onKeyPress: function (e) { return e.key === 'Enter' && !props.disabled && props.onOpen(); }, style: props.style, role: "button", tabIndex: 0 },
         React.createElement("div", { className: bem.element('selected-items', {
-                reset: props.showReset,
-                disabled: props.disabled
+                reset: props.showReset
             }), onClick: props.onOpen, tabIndex: -1, role: 'button' },
             renderPlaceholder(),
             React.createElement("span", { className: bem.element('selected-items') }, props.showEllipses

package/form/DropDownField/DropDownFieldView.scss

@@ -427,4 +427,10 @@ $drop-down-color-themes: map.merge(
     &_is-invalid {
         border: 1px solid variables.$danger !important;
     }
+
+    &_disabled {
+        background-color: variables.$element-background-color-disabled;
+        border-color: transparent;
+        pointer-events: none;
+    }
 }

package/list/Grid/views/TreeColumnView/TreeColumnView.js

@@ -18,24 +18,23 @@ var react_1 = __importDefault(require("react"));
 var hooks_1 = require("@steroidsjs/core/hooks");
 var Format_1 = __importDefault(require("@steroidsjs/core/ui/format/Format"));
 var content_1 = require("@steroidsjs/core/ui/content");
-var DEFAULT_PADDING_LEFT = 32;
 var PADDING_WITH_ICON = 0;
 var PADDING_WITHOUT_ICON = 24;
 function TreeColumnView(props) {
     var bem = (0, hooks_1.useBem)('TreeColumnView');
-    var levelPadding = props.levelPadding || DEFAULT_PADDING_LEFT;
     var paddingBasedOnIcon = props.item.hasItems ? PADDING_WITH_ICON : PADDING_WITHOUT_ICON;
     var renderFormat = function () { return (react_1["default"].createElement(Format_1["default"], __assign({}, props, (props.formatter || {}), { attribute: props.attribute }))); };
     var renderValue = function () { return (react_1["default"].createElement("span", { className: bem.element('value') }, renderFormat())); };
     return (react_1["default"].createElement("div", { className: bem.block(bem.block({
-            size: props.size
-        })) },
+            size: props.size,
+            'has-items': props.item.hasItems
+        })), onClick: props.item.onClick, onKeyDown: function (e) { return e.key === 'Enter' && props.item.onClick(); }, role: 'button', tabIndex: 0 },
         react_1["default"].createElement("div", { className: bem.element('data'), style: {
-                paddingLeft: "".concat(props.item.level * levelPadding + paddingBasedOnIcon, "px")
+                paddingLeft: "".concat(props.item.level * props.levelPadding + paddingBasedOnIcon, "px")
             } },
             props.item.hasItems && (react_1["default"].createElement(content_1.Icon, { name: 'expand_right', className: bem.element('icon', {
                     opened: props.item.isOpened
-                }), onClick: function () { return props.item.onTreeItemClick(props.item.uniqueId, props.item); } })),
+                }), tabIndex: -1 })),
             renderValue())));
 }
 exports["default"] = TreeColumnView;

package/list/Grid/views/TreeColumnView/TreeColumnView.scss

@@ -11,6 +11,11 @@ html[data-theme="dark"] {
 $grid-icon-color: var(--grid-icon-color);
 
 .TreeColumnView {
+
+  &_has-items {
+    cursor: pointer;
+  }
+
   &__data {
     display: flex;
     align-items: center;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@steroidsjs/bootstrap",
-    "version": "3.0.0-beta.122",
+    "version": "3.0.0-beta.123",
     "description": "",
     "main": "index.js",
     "author": "Vladimir Kozhin <hello@kozhindev.com>",
@@ -37,7 +37,7 @@
         "react-use": "^17.4.0"
     },
     "devDependencies": {
-        "@steroidsjs/core": "^3.0 || >=3.0.0-beta.104",
+        "@steroidsjs/core": "^3.0 || >=3.0.0-beta.105",
         "@steroidsjs/eslint-config": "^2.1.4",
         "@types/enzyme": "^3.10.8",
         "@types/googlemaps": "^3.43.3",

package/scss/bootstrap-classes/spacing.scss

@@ -1,4 +1,46 @@
 // margin
+.m-1 {
+  margin: 0.25rem;
+}
+
+.m-2 {
+  margin: 0.5rem;
+}
+
+.m-3 {
+  margin: 1rem;
+}
+
+.m-horizontal-1 {
+  margin-left: 0.25rem;
+  margin-right: 0.25rem;
+}
+
+.m-horizontal-2 {
+  margin-left: 0.5rem;
+  margin-right: 0.5rem;
+}
+
+.m-horizontal-3 {
+  margin-left: 1rem;
+  margin-right: 1rem;
+}
+
+.m-vertical-1 {
+  margin-top: 0.25rem;
+  margin-bottom: 0.25rem;
+}
+
+.m-vertical-2 {
+  margin-top: 0.5rem;
+  margin-bottom: 0.5rem;
+}
+
+.m-vertical-3 {
+  margin-top: 1rem;
+  margin-bottom: 1rem;
+}
+
 .mb-1 {
   margin-bottom: 0.25rem;
 }
@@ -48,6 +90,48 @@
 }
 
 // padding
+.p-1 {
+  padding: 0.25rem;
+}
+
+.p-2 {
+  padding: 0.5rem;
+}
+
+.p-3 {
+  padding: 1rem;
+}
+
+.p-horizontal-1 {
+  padding-left: 0.25rem;
+  padding-right: 0.25rem;
+}
+
+.p-horizontal-2 {
+  padding-left: 0.5rem;
+  padding-right: 0.5rem;
+}
+
+.p-horizontal-3 {
+  padding-left: 1rem;
+  padding-right: 1rem;
+}
+
+.p-vertical-1 {
+  padding-top: 0.25rem;
+  padding-bottom: 0.25rem;
+}
+
+.p-vertical-2 {
+  padding-top: 0.5rem;
+  padding-bottom: 0.5rem;
+}
+
+.p-vertical-3 {
+  padding-top: 1rem;
+  padding-bottom: 1rem;
+}
+
 .pb-1 {
   padding-bottom: 0.25rem;
 }