@invoicebox/ui 0.1.0-alpha.301 → 0.1.0-alpha.302

package/dist/components/form/Autocomplete/components/Autocomplete/index.js

@@ -19,6 +19,7 @@ var _Scrollbar = require("../../../../common/Scrollbar");
 var _constants = require("../../../constants");
 var _palette = require("../../../../../palette");
 var _ModernPlaceholder = require("../../../ModernPlaceholder");
+var _constants2 = require("../../../InputLabel/constants");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
@@ -198,10 +199,10 @@ var Autocomplete = exports.Autocomplete = /*#__PURE__*/(0, _react.forwardRef)(fu
     required: required,
     useModernStyles: useModernStyles,
     size: size,
-    left: useModernStyles ? inputPaddingLeft : undefined
+    left: useModernStyles && typeof inputPaddingLeft === 'number' ? inputPaddingLeft - _constants2.LABEL_PADDING : undefined
   }, /*#__PURE__*/_react["default"].createElement(S.InputLabelContent, null, children ? /*#__PURE__*/_react["default"].createElement(S.ChildrenWrapper, null, children) : null, useModernStyles && modernInputPlaceholder && /*#__PURE__*/_react["default"].createElement(_ModernPlaceholder.ModernPlaceholder, {
     visible: isModernPlaceholderVisible,
-    paddingLeft: inputPaddingLeft !== null && inputPaddingLeft !== void 0 ? inputPaddingLeft : 20,
+    paddingLeft: typeof inputPaddingLeft === 'number' ? inputPaddingLeft : 20,
     paddingTop: _constants.SIZE_PARAMS_MAP[size].paddingTop,
     size: size,
     required: required

package/dist/components/form/InputLabel/constants.d.ts

@@ -0,0 +1 @@
+export declare const LABEL_PADDING = 10;

package/dist/components/form/InputLabel/constants.js

@@ -0,0 +1,7 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.LABEL_PADDING = void 0;
+var LABEL_PADDING = exports.LABEL_PADDING = 10;

package/dist/components/form/InputLabel/styles.js

@@ -7,23 +7,24 @@ Object.defineProperty(exports, "__esModule", {
 exports.Wrapper = exports.Label = void 0;
 var _styledComponents = _interopRequireWildcard(require("styled-components"));
 var _Typography = require("../../common/Typography");
+var _constants = require("./constants");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
 var labelFadeIn = (0, _styledComponents.keyframes)(["from{opacity:0;transform:translateY(4px);}to{opacity:1;transform:translateY(0);}"]);
 var Label = exports.Label = (0, _styledComponents["default"])(_Typography.Typography).withConfig({
   displayName: "styles__Label",
   componentId: "sc-1prrc3p-0"
-})(["border-radius:10px;position:absolute;top:", ";left:", ";background-color:", ";padding:0 10px;z-index:2;transition:color 0.2s ease-in-out 0s;animation:", " 0.15s ease;color:", ";", ""], function (_ref) {
+})(["border-radius:10px;position:absolute;top:", ";left:", ";background-color:", ";padding:0 ", "px;z-index:2;transition:color 0.2s ease-in-out 0s;animation:", " 0.15s ease;color:", ";", ""], function (_ref) {
   var $paddingTop = _ref.$paddingTop;
   return $paddingTop ? "".concat($paddingTop, "px") : 0;
 }, function (_ref2) {
   var $left = _ref2.$left;
-  return $left ? "".concat($left, "px") : '10px';
+  return typeof $left === 'number' ? "".concat($left, "px") : '10px';
 }, function (_ref3) {
   var $palette = _ref3.$palette,
     $useModernStyles = _ref3.$useModernStyles;
   return $useModernStyles ? $palette.bgModern : $palette.bg;
-}, labelFadeIn, function (_ref4) {
+}, _constants.LABEL_PADDING, labelFadeIn, function (_ref4) {
   var $inFocus = _ref4.$inFocus,
     $palette = _ref4.$palette;
   return $inFocus ? $palette.textHighlight : $palette.text;

package/dist/esm/components/form/Autocomplete/components/Autocomplete/index.js

@@ -19,6 +19,7 @@ import { Scrollbar } from '../../../../common/Scrollbar';
 import { MODERN_STYLE_SIZE_PARAMS_MAP, SIZE_PARAMS_MAP } from '../../../constants';
 import { useComponentPalette } from '../../../../../palette';
 import { ModernPlaceholder } from '../../../ModernPlaceholder';
+import { LABEL_PADDING } from '../../../InputLabel/constants';
 var DefaultSkeletonItem = function DefaultSkeletonItem() {
   return /*#__PURE__*/React.createElement(S.DefaultSkeletonWrapper, null, /*#__PURE__*/React.createElement(Skeleton, {
     height: "20px"
@@ -189,10 +190,10 @@ export var Autocomplete = /*#__PURE__*/forwardRef(function (_ref, ref) {
     required: required,
     useModernStyles: useModernStyles,
     size: size,
-    left: useModernStyles ? inputPaddingLeft : undefined
+    left: useModernStyles && typeof inputPaddingLeft === 'number' ? inputPaddingLeft - LABEL_PADDING : undefined
   }, /*#__PURE__*/React.createElement(S.InputLabelContent, null, children ? /*#__PURE__*/React.createElement(S.ChildrenWrapper, null, children) : null, useModernStyles && modernInputPlaceholder && /*#__PURE__*/React.createElement(ModernPlaceholder, {
     visible: isModernPlaceholderVisible,
-    paddingLeft: inputPaddingLeft !== null && inputPaddingLeft !== void 0 ? inputPaddingLeft : 20,
+    paddingLeft: typeof inputPaddingLeft === 'number' ? inputPaddingLeft : 20,
     paddingTop: SIZE_PARAMS_MAP[size].paddingTop,
     size: size,
     required: required

package/dist/esm/components/form/InputLabel/constants.js

@@ -0,0 +1 @@
+export var LABEL_PADDING = 10;

package/dist/esm/components/form/InputLabel/styles.js

@@ -1,20 +1,21 @@
 import styled, { css, keyframes } from 'styled-components';
 import { Typography } from '../../common/Typography';
+import { LABEL_PADDING } from './constants';
 var labelFadeIn = keyframes(["from{opacity:0;transform:translateY(4px);}to{opacity:1;transform:translateY(0);}"]);
 export var Label = styled(Typography).withConfig({
   displayName: "styles__Label",
   componentId: "sc-1prrc3p-0"
-})(["border-radius:10px;position:absolute;top:", ";left:", ";background-color:", ";padding:0 10px;z-index:2;transition:color 0.2s ease-in-out 0s;animation:", " 0.15s ease;color:", ";", ""], function (_ref) {
+})(["border-radius:10px;position:absolute;top:", ";left:", ";background-color:", ";padding:0 ", "px;z-index:2;transition:color 0.2s ease-in-out 0s;animation:", " 0.15s ease;color:", ";", ""], function (_ref) {
   var $paddingTop = _ref.$paddingTop;
   return $paddingTop ? "".concat($paddingTop, "px") : 0;
 }, function (_ref2) {
   var $left = _ref2.$left;
-  return $left ? "".concat($left, "px") : '10px';
+  return typeof $left === 'number' ? "".concat($left, "px") : '10px';
 }, function (_ref3) {
   var $palette = _ref3.$palette,
     $useModernStyles = _ref3.$useModernStyles;
   return $useModernStyles ? $palette.bgModern : $palette.bg;
-}, labelFadeIn, function (_ref4) {
+}, LABEL_PADDING, labelFadeIn, function (_ref4) {
   var $inFocus = _ref4.$inFocus,
     $palette = _ref4.$palette;
   return $inFocus ? $palette.textHighlight : $palette.text;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@invoicebox/ui",
-    "version": "0.1.0-alpha.301",
+    "version": "0.1.0-alpha.302",
     "description": "Invoicebox UI",
     "license": "Apache License 2.0",
     "scripts": {