@pedidopago/ui 1.3.26 → 1.3.29

package/README.md

@@ -1,93 +1,93 @@
-<h1 align="center">
-  <img src="https://user-images.githubusercontent.com/75874462/145101826-9244932f-7072-4727-9124-8c26620ad786.png" alt="Logo"/>
-  <br/>
-</h1>
-
-<div align="center">
-  <img src="https://img.shields.io/badge/React-v17.0.2-1DD195?style=for-the-badge&logo=react&link=http://google.com" />
-  <img src="https://img.shields.io/badge/Emotion-v11.3.0-1DD195?style=for-the-badge&logo=styled-components" />
-  <img src="https://img.shields.io/badge/Storybook-v6.3.7-1DD195?style=for-the-badge&logo=storybook" />
-  <img src="https://img.shields.io/badge/React Testing Library-v11.1.0-1DD195?style=for-the-badge&logo=testinglibrary" />
-  <img src="https://img.shields.io/badge/FrameMotion-v4.1.17-1DD195?style=for-the-badge&logo=framer" />
-  <img src="https://img.shields.io/badge/Typescript-v4.3.5-1DD195?style=for-the-badge&logo=typescript" />
-</div>
-
-<p align="center">
-  <a href="#iniciar-">Iniciar&nbsp;</a> | &nbsp;
-  <a href="#estrutura-de-codigo-">Estrutura de codigo&nbsp;</a> | &nbsp;
-  <a href="#roadmap-">Roadmap&nbsp;</a> | &nbsp;
-  <a href="#contribuir-">Contribuir&nbsp;</a> 
-</p>
-
-## Iniciar 🚀
-  
-  ### Requisitos:
-  - [Nodejs](https://github.com/nodejs/node)
-  - [Yarn](https://github.com/yarnpkg/yarn)
-
-  ### Instalação:
-
-  1. Clone o Repositorio
-  
-  ``` bash
-  git clone git@github.com:pedidopago/pedidopago-ui.git 
-  ```
-
-  2. Instalar as dependencias:
-  
-  ```bash 
-  yarn
-  ```
-
-  ### Executar o projeto localmente:
-  
-  Iniciar o projeto com o storybook:
-  
-  ```bash 
-  yarn storybook
-  ```
-
-  Para executar os testes use o script: 
-  
-  ```bash
-  yarn test
-  ```
-
-  > Para mais detalhes dos scripts considere consultar o package.json na raiz do projeto.
-
-  #### 📌 Ira precisar tambem das variaveis de ambiente `CHROMATIC_PROJECT_TOKEN` e `SKIP_PREFLIGHT_CHECK`.
-
-
-## Estrutura de codigo
-
-
-
-> Ao entrar no projeto sempre entre em `packages/pedidopago-ui` para trabalhar/executar os scripts
-
-## Roadmap 🌐
-
-- [ ] Mudar a estrutura de pastas
-
-- [ ] Sessão de novos componentes
-
-- [ ] Atualização de pacotes
-
-- [ ] Incrementação dos testes
-
-- [ ] Melhorias na documentação
-
-- [ ] Adicionar license
-
-## Contribuir 💡
-
-1. Crie uma branch apartir da **`dev`** com o prefixo **`lib`-[número da issue]-[nome da issue]**.
-exemplo:
-```bash
- git checkout -b lib-99-buttom
-```
-2. Desenvolver
-
-3. Criar a pull request
- - Número da issue no inicio da pr.
- - Descritivo com pontos importantes do que foi feito.
- - Print dos tests no terminal e video de apresentação que pode ser feito via [loom](https://www.loom.com/).
+<h1 align="center">
+  <img src="https://user-images.githubusercontent.com/75874462/145101826-9244932f-7072-4727-9124-8c26620ad786.png" alt="Logo"/>
+  <br/>
+</h1>
+
+<div align="center">
+  <img src="https://img.shields.io/badge/React-v17.0.2-1DD195?style=for-the-badge&logo=react&link=http://google.com" />
+  <img src="https://img.shields.io/badge/Emotion-v11.3.0-1DD195?style=for-the-badge&logo=styled-components" />
+  <img src="https://img.shields.io/badge/Storybook-v6.3.7-1DD195?style=for-the-badge&logo=storybook" />
+  <img src="https://img.shields.io/badge/React Testing Library-v11.1.0-1DD195?style=for-the-badge&logo=testinglibrary" />
+  <img src="https://img.shields.io/badge/FrameMotion-v4.1.17-1DD195?style=for-the-badge&logo=framer" />
+  <img src="https://img.shields.io/badge/Typescript-v4.3.5-1DD195?style=for-the-badge&logo=typescript" />
+</div>
+
+<p align="center">
+  <a href="#iniciar-">Iniciar&nbsp;</a> | &nbsp;
+  <a href="#estrutura-de-codigo-">Estrutura de codigo&nbsp;</a> | &nbsp;
+  <a href="#roadmap-">Roadmap&nbsp;</a> | &nbsp;
+  <a href="#contribuir-">Contribuir&nbsp;</a> 
+</p>
+
+## Iniciar 🚀
+  
+  ### Requisitos:
+  - [Nodejs](https://github.com/nodejs/node)
+  - [Yarn](https://github.com/yarnpkg/yarn)
+
+  ### Instalação:
+
+  1. Clone o Repositorio
+  
+  ``` bash
+  git clone git@github.com:pedidopago/pedidopago-ui.git 
+  ```
+
+  2. Instalar as dependencias:
+  
+  ```bash 
+  yarn
+  ```
+
+  ### Executar o projeto localmente:
+  
+  Iniciar o projeto com o storybook:
+  
+  ```bash 
+  yarn storybook
+  ```
+
+  Para executar os testes use o script: 
+  
+  ```bash
+  yarn test
+  ```
+
+  > Para mais detalhes dos scripts considere consultar o package.json na raiz do projeto.
+
+  #### 📌 Ira precisar tambem das variaveis de ambiente `CHROMATIC_PROJECT_TOKEN` e `SKIP_PREFLIGHT_CHECK`.
+
+
+## Estrutura de codigo
+
+
+
+> Ao entrar no projeto sempre entre em `packages/pedidopago-ui` para trabalhar/executar os scripts
+
+## Roadmap 🌐
+
+- [ ] Mudar a estrutura de pastas
+
+- [ ] Sessão de novos componentes
+
+- [ ] Atualização de pacotes
+
+- [ ] Incrementação dos testes
+
+- [ ] Melhorias na documentação
+
+- [ ] Adicionar license
+
+## Contribuir 💡
+
+1. Crie uma branch apartir da **`dev`** com o prefixo **`lib`-[número da issue]-[nome da issue]**.
+exemplo:
+```bash
+ git checkout -b lib-99-buttom
+```
+2. Desenvolver
+
+3. Criar a pull request
+ - Número da issue no inicio da pr.
+ - Descritivo com pontos importantes do que foi feito.
+ - Print dos tests no terminal e video de apresentação que pode ser feito via [loom](https://www.loom.com/).

package/dist/components/Button/Button.test.js

@@ -12,10 +12,6 @@ var _jsxRuntime = require("react/jsx-runtime");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
-
-function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
-
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
@@ -69,29 +65,6 @@ describe('Button', function () {
 
     expect(handleClick).toHaveBeenCalledTimes(1);
   });
-  it('should render a loading button', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
-    var _setup2, getSkeleton;
-
-    return regeneratorRuntime.wrap(function _callee$(_context) {
-      while (1) {
-        switch (_context.prev = _context.next) {
-          case 0:
-            (0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_.default, {
-              variant: "solid",
-              children: "Click Me"
-            }));
-            _setup2 = setup({
-              isLoading: true
-            }), getSkeleton = _setup2.getSkeleton;
-            expect(getSkeleton()).toBeInTheDocument();
-
-          case 3:
-          case "end":
-            return _context.stop();
-        }
-      }
-    }, _callee);
-  })));
   it('should render a disabled button', function () {
     var handleClick = jest.fn();
     (0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_.default, {
@@ -168,10 +141,10 @@ describe('Button', function () {
       children: "Click Me"
     }));
 
-    var _setup3 = setup({
+    var _setup2 = setup({
       leftIcon: 'airplay'
     }),
-        getLeftIcon = _setup3.getLeftIcon;
+        getLeftIcon = _setup2.getLeftIcon;
 
     expect(getLeftIcon()).toBeInTheDocument();
   });
@@ -182,10 +155,10 @@ describe('Button', function () {
       children: "Click Me"
     }));
 
-    var _setup4 = setup({
+    var _setup3 = setup({
       rightIcon: 'airplay'
     }),
-        getRightIcon = _setup4.getRightIcon;
+        getRightIcon = _setup3.getRightIcon;
 
     expect(getRightIcon()).toBeInTheDocument();
   });

package/dist/components/Button/index.d.ts

@@ -1,4 +1,4 @@
 import { ButtonHTMLAttributes } from 'react';
 import { ButtonProps } from './types';
-export default function Button({ children, leftIcon, rightIcon, isLoading, variant, bgColor, size, fullWidth, textColor, type, iconColor, ...props }: ButtonProps & ButtonHTMLAttributes<HTMLButtonElement>): JSX.Element;
+export default function Button({ children, leftIcon, rightIcon, variant, bgColor, size, fullWidth, textColor, type, iconColor, ...props }: ButtonProps & ButtonHTMLAttributes<HTMLButtonElement>): JSX.Element;
 //# sourceMappingURL=index.d.ts.map

package/dist/components/Button/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Button/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAY,MAAM,OAAO,CAAC;AAMvD,OAAO,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAEtC,MAAM,CAAC,OAAO,UAAU,MAAM,CAAC,EAC7B,QAAQ,EACR,QAAQ,EACR,SAAS,EACT,SAAS,EACT,OAAiB,EACjB,OAAY,EACZ,IAAW,EACX,SAAS,EACT,SAAc,EACd,IAAe,EACf,SAAc,EACd,GAAG,KAAK,EACT,EAAE,WAAW,GAAG,oBAAoB,CAAC,iBAAiB,CAAC,eA8DvD"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Button/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,OAAO,CAAC;AAK7C,OAAO,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAEtC,MAAM,CAAC,OAAO,UAAU,MAAM,CAAC,EAC7B,QAAQ,EACR,QAAQ,EACR,SAAS,EACT,OAAiB,EACjB,OAAY,EACZ,IAAW,EACX,SAAS,EACT,SAAc,EACd,IAAe,EACf,SAAc,EACd,GAAG,KAAK,EACT,EAAE,WAAW,GAAG,oBAAoB,CAAC,iBAAiB,CAAC,eA0DvD"}

package/dist/components/Button/index.js

@@ -5,21 +5,17 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = Button;
 
-var _react = require("react");
-
 var _index = require("../../shared/theme/index");
 
 var _getColorValue = require("../../utils/getColorValue");
 
 var _Icon = _interopRequireDefault(require("../Icon"));
 
-var _Skeleton = _interopRequireDefault(require("../Skeleton"));
-
 var _styles = require("./styles");
 
 var _jsxRuntime = require("react/jsx-runtime");
 
-var _excluded = ["children", "leftIcon", "rightIcon", "isLoading", "variant", "bgColor", "size", "fullWidth", "textColor", "type", "iconColor"];
+var _excluded = ["children", "leftIcon", "rightIcon", "variant", "bgColor", "size", "fullWidth", "textColor", "type", "iconColor"];
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
@@ -37,7 +33,6 @@ function Button(_ref) {
   var children = _ref.children,
       leftIcon = _ref.leftIcon,
       rightIcon = _ref.rightIcon,
-      isLoading = _ref.isLoading,
       _ref$variant = _ref.variant,
       variant = _ref$variant === void 0 ? 'solid' : _ref$variant,
       _ref$bgColor = _ref.bgColor,
@@ -79,36 +74,30 @@ function Button(_ref) {
     parsedIconColor = (0, _getColorValue.getThemeHex)(parsedIconColor, theme);
   }
 
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_react.Fragment, {
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Skeleton.default, {
-      isLoaded: !isLoading,
-      "data-testid": "skeleton",
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.ButtonContainer, _objectSpread(_objectSpread({
-        bgColor: parsedBgColor,
-        textColor: parsedTextColor,
-        fullWidth: fullWidth,
-        variant: variant,
-        size: size,
-        type: type
-      }, props), {}, {
-        children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.IconContainer, {
-          children: [leftIcon && /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.IconWrapper, {
-            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.default, {
-              color: parsedIconColor,
-              name: leftIcon,
-              size: iconSize,
-              "data-testid": "leftIconId"
-            })
-          }), children, !leftIcon && rightIcon && /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.IconWrapper, {
-            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.default, {
-              name: rightIcon,
-              color: parsedIconColor,
-              size: iconSize,
-              "data-testid": "rightIconId"
-            })
-          })]
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.ButtonContainer, _objectSpread(_objectSpread({
+    bgColor: parsedBgColor,
+    textColor: parsedTextColor,
+    fullWidth: fullWidth,
+    variant: variant,
+    size: size,
+    type: type
+  }, props), {}, {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.IconContainer, {
+      children: [leftIcon && /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.IconWrapper, {
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.default, {
+          color: parsedIconColor,
+          name: leftIcon,
+          size: iconSize,
+          "data-testid": "leftIconId"
+        })
+      }), children, !leftIcon && rightIcon && /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.IconWrapper, {
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.default, {
+          name: rightIcon,
+          color: parsedIconColor,
+          size: iconSize,
+          "data-testid": "rightIconId"
         })
-      }))
+      })]
     })
-  });
+  }));
 }

package/dist/components/Button/types.d.ts

@@ -40,15 +40,6 @@ export interface ButtonProps {
      * @memberof ButtonProps
      */
     rightIcon?: IconName;
-    /**
-     * The button rendered changes to a LoadingButton component
-     *
-     * @default false
-     * @type boolean
-     * @memberof ButtonProps
-     * @example true
-     */
-    isLoading?: boolean;
     /**
      * The button height changes based on the string passed to this prop
      *

package/dist/components/Button/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/Button/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,OAAO,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAC;AAEvD,aAAK,aAAa,GAAG,SAAS,GAAG,OAAO,GAAG,OAAO,GAAG,MAAM,CAAC;AAC5D,aAAK,WAAW,GAAG,iBAAiB,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;AACrD,aAAK,iBAAiB,CAAC,CAAC,GAAG,GAAG,IAAI;IAChC,IAAI,CAAC,EAAE,CAAC,CAAC;IACT,EAAE,CAAC,EAAE,CAAC,CAAC;IACP,EAAE,CAAC,EAAE,CAAC,CAAC;IACP,EAAE,CAAC,EAAE,CAAC,CAAC;IACP,EAAE,CAAC,EAAE,CAAC,CAAC;IACP,GAAG,CAAC,EAAE,CAAC,CAAC;CACT,CAAC;AACF,aAAK,WAAW,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAEpD,MAAM,WAAW,WAAW;IAC1B;;;;;;;OAOG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;;;;;OAOG;IACH,QAAQ,CAAC,EAAE,QAAQ,CAAC;IAEpB;;;;;;;;OAQG;IACH,SAAS,CAAC,EAAE,QAAQ,CAAC;IAErB;;;;;;;OAOG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;;;;;;OAOG;IACH,IAAI,CAAC,EAAE,WAAW,CAAC;IAEnB;;;;;;;OAOG;IACH,OAAO,CAAC,EAAE,aAAa,CAAC;IAExB;;;;;;;OAOG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IACtB,SAAS,CAAC,EAAE,iBAAiB,GAAG,MAAM,CAAC;IAEvC;;;;;;;;;OASG;IACH,SAAS,CAAC,EAAE,OAAO,GAAG,iBAAiB,CAAC,OAAO,CAAC,CAAC;IAEjD;;;;;;;OAOG;IACH,SAAS,CAAC,EAAE,WAAW,CAAC;CACzB"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/Button/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,OAAO,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAC;AAEvD,aAAK,aAAa,GAAG,SAAS,GAAG,OAAO,GAAG,OAAO,GAAG,MAAM,CAAC;AAC5D,aAAK,WAAW,GAAG,iBAAiB,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;AACrD,aAAK,iBAAiB,CAAC,CAAC,GAAG,GAAG,IAAI;IAChC,IAAI,CAAC,EAAE,CAAC,CAAC;IACT,EAAE,CAAC,EAAE,CAAC,CAAC;IACP,EAAE,CAAC,EAAE,CAAC,CAAC;IACP,EAAE,CAAC,EAAE,CAAC,CAAC;IACP,EAAE,CAAC,EAAE,CAAC,CAAC;IACP,GAAG,CAAC,EAAE,CAAC,CAAC;CACT,CAAC;AACF,aAAK,WAAW,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAEpD,MAAM,WAAW,WAAW;IAC1B;;;;;;;OAOG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;;;;;OAOG;IACH,QAAQ,CAAC,EAAE,QAAQ,CAAC;IAEpB;;;;;;;;OAQG;IACH,SAAS,CAAC,EAAE,QAAQ,CAAC;IAErB;;;;;;;OAOG;IACH,IAAI,CAAC,EAAE,WAAW,CAAC;IAEnB;;;;;;;OAOG;IACH,OAAO,CAAC,EAAE,aAAa,CAAC;IAExB;;;;;;;OAOG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IACtB,SAAS,CAAC,EAAE,iBAAiB,GAAG,MAAM,CAAC;IAEvC;;;;;;;;;OASG;IACH,SAAS,CAAC,EAAE,OAAO,GAAG,iBAAiB,CAAC,OAAO,CAAC,CAAC;IAEjD;;;;;;;OAOG;IACH,SAAS,CAAC,EAAE,WAAW,CAAC;CACzB"}

package/dist/components/DateInput/components/ModalWrapper/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/DateInput/components/ModalWrapper/index.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAE5C,eAAO,MAAM,YAAY,8GAkBxB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/DateInput/components/ModalWrapper/index.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAE5C,eAAO,MAAM,YAAY,8GAmBxB,CAAC"}

package/dist/components/DateInput/components/ModalWrapper/index.js

@@ -13,13 +13,13 @@ var _jsxRuntime = require("react/jsx-runtime");
 
 var ModalWrapper = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
   var open = _ref.open,
-      _ref$left = _ref.left,
-      left = _ref$left === void 0 ? '50vw' : _ref$left,
+      left = _ref.left,
       _ref$top = _ref.top,
       top = _ref$top === void 0 ? '' : _ref$top,
       _ref$offsetX = _ref.offsetX,
       offsetX = _ref$offsetX === void 0 ? '0px' : _ref$offsetX,
       maxWidth = _ref.maxWidth,
+      right = _ref.right,
       children = _ref.children;
   var optionsContainerRef = (0, _react.useRef)(null);
   (0, _react.useImperativeHandle)(ref, function () {
@@ -29,7 +29,8 @@ var ModalWrapper = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
     ref: optionsContainerRef,
     open: open,
     maxWidth: typeof maxWidth === 'number' ? "".concat(maxWidth, "px") : maxWidth,
-    left: "calc(".concat(left, " + ").concat(offsetX, ")"),
+    left: left && "calc(".concat(left, " + ").concat(offsetX, ")"),
+    right: right && "calc(".concat(right, " + ").concat(offsetX, ")"),
     top: top,
     children: children
   });

package/dist/components/DateInput/components/ModalWrapper/styles.d.ts

@@ -3,7 +3,8 @@ interface ModalWrapperContainerProps {
     open: boolean;
     maxWidth?: string;
     maxHeight?: string;
-    left: string;
+    right?: string;
+    left?: string;
     top: string;
 }
 export declare const ModalWrapperContainer: import("@emotion/styled").StyledComponent<{

package/dist/components/DateInput/components/ModalWrapper/styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../../src/components/DateInput/components/ModalWrapper/styles.ts"],"names":[],"mappings":";AAIA,UAAU,0BAA0B;IAClC,IAAI,EAAE,OAAO,CAAC;IAEd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,IAAI,EAAE,MAAM,CAAC;IACb,GAAG,EAAE,MAAM,CAAC;CACb;AAED,eAAO,MAAM,qBAAqB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;uCAsBjC,CAAC"}
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../../src/components/DateInput/components/ModalWrapper/styles.ts"],"names":[],"mappings":";AAIA,UAAU,0BAA0B;IAClC,IAAI,EAAE,OAAO,CAAC;IAEd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,GAAG,EAAE,MAAM,CAAC;CACb;AAED,eAAO,MAAM,qBAAqB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;uCA6BjC,CAAC"}

package/dist/components/DateInput/components/ModalWrapper/styles.js

@@ -11,7 +11,7 @@ var _styled = _interopRequireDefault(require("@emotion/styled"));
 
 var _framerMotion = require("framer-motion");
 
-var _templateObject;
+var _templateObject, _templateObject2, _templateObject3;
 
 var _excluded = ["theme"];
 
@@ -27,6 +27,6 @@ var ModalWrapperContainer = (0, _styled.default)(_framerMotion.motion.div)(funct
   var theme = _ref.theme,
       props = _objectWithoutProperties(_ref, _excluded);
 
-  return (0, _react.css)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n      display: flex;\n      flex-direction: column;\n      width: auto;\n      position: fixed;\n      left: ", ";\n      top: ", ";\n      z-index: ", ";\n      opacity: ", ";\n      pointer-events: ", ";\n      transition: opacity ease ", ";\n      background: ", ";\n      border-radius: ", ";\n      box-shadow: ", ";\n\n      li {\n        list-style: none;\n      }\n    "])), props.left, props.top, theme.zIndex.level24, props.open ? 1 : 0, props.open ? 'auto' : 'none', theme.transition.speed, theme.colors.background.light, theme.borderRadius.default, theme.shadow.level3);
+  return (0, _react.css)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n      display: flex;\n      flex-direction: column;\n      width: auto;\n      position: fixed;\n      ", "\n      ", "\n      top: ", ";\n      z-index: ", ";\n      opacity: ", ";\n      pointer-events: ", ";\n      transition: opacity ease ", ";\n      background: ", ";\n      border-radius: ", ";\n      box-shadow: ", ";\n\n      li {\n        list-style: none;\n      }\n    "])), props.left && (0, _react.css)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n        left: ", ";\n      "])), props.left), props.right && (0, _react.css)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n        right: ", ";\n      "])), props.right), props.top, theme.zIndex.level24, props.open ? 1 : 0, props.open ? 'auto' : 'none', theme.transition.speed, theme.colors.background.light, theme.borderRadius.default, theme.shadow.level3);
 });
 exports.ModalWrapperContainer = ModalWrapperContainer;

package/dist/components/DateInput/components/ModalWrapper/types.d.ts

@@ -4,6 +4,8 @@ export interface ModalWrapperProps extends HTMLAttributes<HTMLDivElement> {
     open: boolean;
     /** Optional. Sets the left position where the modal will be shown. */
     left?: string;
+    /** Optional. Sets the right position where the modal will be shown. */
+    right?: string;
     /** Optional. Sets the top position where the modal will be shown. */
     top?: string;
     /** Optional. Offsets the Modal horizontally. */

package/dist/components/DateInput/components/ModalWrapper/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../src/components/DateInput/components/ModalWrapper/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAEvC,MAAM,WAAW,iBAAkB,SAAQ,cAAc,CAAC,cAAc,CAAC;IACvE,mCAAmC;IACnC,IAAI,EAAE,OAAO,CAAC;IAEd,sEAAsE;IACtE,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,qEAAqE;IACrE,GAAG,CAAC,EAAE,MAAM,CAAC;IAEb,gDAAgD;IAChD,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB,kCAAkC;IAClC,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CAC5B"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../src/components/DateInput/components/ModalWrapper/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAEvC,MAAM,WAAW,iBAAkB,SAAQ,cAAc,CAAC,cAAc,CAAC;IACvE,mCAAmC;IACnC,IAAI,EAAE,OAAO,CAAC;IAEd,sEAAsE;IACtE,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd,uEAAuE;IACvE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,qEAAqE;IACrE,GAAG,CAAC,EAAE,MAAM,CAAC;IAEb,gDAAgD;IAChD,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB,kCAAkC;IAClC,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CAC5B"}

package/dist/components/DateInput/index.d.ts

@@ -1,4 +1,4 @@
 /// <reference types="react" />
 import { DateInputProps } from './types';
-export declare function DateInput({ label, placeholder, alert, helperText, value, locales, localeOptions, minDate, maxDate, onChange, disabled, ...rest }: DateInputProps): JSX.Element;
+export declare function DateInput({ label, placeholder, alert, helperText, value, locales, localeOptions, minDate, maxDate, onChange, disabled, datePickerPosition, disableWeekendDays, ...rest }: DateInputProps): JSX.Element;
 //# sourceMappingURL=index.d.ts.map

package/dist/components/DateInput/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/DateInput/index.tsx"],"names":[],"mappings":";AAeA,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAEzC,wBAAgB,SAAS,CAAC,EACxB,KAAK,EACL,WAAW,EACX,KAAK,EACL,UAAU,EACV,KAAK,EACL,OAAO,EACP,aAAa,EACb,OAAO,EACP,OAAO,EACP,QAAQ,EACR,QAAgB,EAChB,GAAG,IAAI,EACR,EAAE,cAAc,eA0FhB"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/DateInput/index.tsx"],"names":[],"mappings":";AAeA,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAEzC,wBAAgB,SAAS,CAAC,EACxB,KAAK,EACL,WAAW,EACX,KAAK,EACL,UAAU,EACV,KAAK,EACL,OAAO,EACP,aAAa,EACb,OAAO,EACP,OAAO,EACP,QAAQ,EACR,QAAgB,EAChB,kBAA2B,EAC3B,kBAAkB,EAClB,GAAG,IAAI,EACR,EAAE,cAAc,eA0GhB"}

package/dist/components/DateInput/index.js

@@ -23,7 +23,7 @@ var _useDisableBodyScroll = require("../../shared/hooks/useDisableBodyScroll");
 
 var _jsxRuntime = require("react/jsx-runtime");
 
-var _excluded = ["label", "placeholder", "alert", "helperText", "value", "locales", "localeOptions", "minDate", "maxDate", "onChange", "disabled"];
+var _excluded = ["label", "placeholder", "alert", "helperText", "value", "locales", "localeOptions", "minDate", "maxDate", "onChange", "disabled", "datePickerPosition", "disableWeekendDays"];
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
@@ -50,7 +50,7 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 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; }
 
 function DateInput(_ref) {
-  var _containerRef$current, _containerRef$current3, _containerRef$current4, _containerRef$current5;
+  var _containerRef$current, _containerRef$current3, _containerRef$current4, _containerRef$current5, _containerRef$current6, _containerRef$current7;
 
   var label = _ref.label,
       placeholder = _ref.placeholder,
@@ -64,6 +64,9 @@ function DateInput(_ref) {
       onChange = _ref.onChange,
       _ref$disabled = _ref.disabled,
       disabled = _ref$disabled === void 0 ? false : _ref$disabled,
+      _ref$datePickerPositi = _ref.datePickerPosition,
+      datePickerPosition = _ref$datePickerPositi === void 0 ? 'left' : _ref$datePickerPositi,
+      disableWeekendDays = _ref.disableWeekendDays,
       rest = _objectWithoutProperties(_ref, _excluded);
 
   var containerRef = (0, _react.useRef)(null);
@@ -118,7 +121,7 @@ function DateInput(_ref) {
       }),
       disabled: disabled,
       tabIndex: disabled ? -1 : 0,
-      value: currentValue ? Array.isArray(currentValue) ? "".concat(currentValue[0].toLocaleDateString(locales, localeOptions), " - ").concat(currentValue[1].toLocaleDateString(locales, localeOptions)) : new Date(currentValue).toLocaleDateString() : '',
+      value: currentValue ? Array.isArray(currentValue) ? String(currentValue[0]) !== String(currentValue[1]) ? "".concat(currentValue[0].toLocaleDateString(locales, localeOptions), " - ").concat(currentValue[1].toLocaleDateString(locales, localeOptions)) : new Date(currentValue[0]).toLocaleDateString() : new Date(currentValue).toLocaleDateString() : '',
       onClick: toggleOptionsAreaView,
       onMouseOver: handleRepositionModal
     }), datePickerOpen && /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
@@ -130,15 +133,17 @@ function DateInput(_ref) {
           }
         }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ModalWrapper.ModalWrapper, {
           open: datePickerOpen,
-          left: "".concat((_containerRef$current3 = containerRef.current) === null || _containerRef$current3 === void 0 ? void 0 : _containerRef$current3.getBoundingClientRect().left, "px"),
-          top: Number(positionContainer) < 540 ? "calc(".concat(((_containerRef$current4 = containerRef.current) === null || _containerRef$current4 === void 0 ? void 0 : _containerRef$current4.getBoundingClientRect().bottom) || 0, "px + 10px)") : "calc(".concat(((_containerRef$current5 = containerRef.current) === null || _containerRef$current5 === void 0 ? void 0 : _containerRef$current5.getBoundingClientRect().top) || 0, "px - ", 360, "px)"),
+          left: datePickerPosition === 'left' ? "".concat((_containerRef$current3 = containerRef.current) === null || _containerRef$current3 === void 0 ? void 0 : _containerRef$current3.getBoundingClientRect().left, "px") : undefined,
+          right: datePickerPosition === 'right' ? "".concat(window.innerWidth - Number(containerRef === null || containerRef === void 0 ? void 0 : (_containerRef$current4 = containerRef.current) === null || _containerRef$current4 === void 0 ? void 0 : _containerRef$current4.offsetLeft) - Number(containerRef === null || containerRef === void 0 ? void 0 : (_containerRef$current5 = containerRef.current) === null || _containerRef$current5 === void 0 ? void 0 : _containerRef$current5.offsetWidth), "px") : undefined,
+          top: Number(positionContainer) < 540 ? "calc(".concat(((_containerRef$current6 = containerRef.current) === null || _containerRef$current6 === void 0 ? void 0 : _containerRef$current6.getBoundingClientRect().bottom) || 0, "px + 10px)") : "calc(".concat(((_containerRef$current7 = containerRef.current) === null || _containerRef$current7 === void 0 ? void 0 : _containerRef$current7.getBoundingClientRect().top) || 0, "px - ", 360, "px)"),
           ref: optionsModalRef,
           maxWidth: "auto",
           children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_DatePicker.default, _objectSpread({
             value: currentValue,
             onChange: selectDate,
             minDate: minDate,
-            maxDate: maxDate
+            maxDate: maxDate,
+            disableWeekendDays: disableWeekendDays
           }, rest))
         })]
       })

package/dist/components/DateInput/types.d.ts

@@ -13,5 +13,7 @@ export interface DateInputProps extends DatePickerProps {
     localeOptions?: Intl.DateTimeFormatOptions;
     minDate?: Date;
     maxDate?: Date;
+    datePickerPosition?: 'left' | 'right';
+    disableWeekendDays?: boolean;
 }
 //# sourceMappingURL=types.d.ts.map

package/dist/components/DateInput/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/DateInput/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AACtD,OAAO,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAEjD,oBAAY,wBAAwB,GAAG;IACrC,QAAQ,CAAC,EAAE,QAAQ,GAAG,KAAK,CAAC;CAC7B,CAAC;AAEF,MAAM,WAAW,cAAe,SAAQ,eAAe;IACrD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,KAAK,CAAC,EAAE,eAAe,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;IAC5B,aAAa,CAAC,EAAE,IAAI,CAAC,qBAAqB,CAAC;IAC3C,OAAO,CAAC,EAAE,IAAI,CAAC;IACf,OAAO,CAAC,EAAE,IAAI,CAAC;CAChB"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/DateInput/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AACtD,OAAO,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAEjD,oBAAY,wBAAwB,GAAG;IACrC,QAAQ,CAAC,EAAE,QAAQ,GAAG,KAAK,CAAC;CAC7B,CAAC;AAEF,MAAM,WAAW,cAAe,SAAQ,eAAe;IACrD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,KAAK,CAAC,EAAE,eAAe,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;IAC5B,aAAa,CAAC,EAAE,IAAI,CAAC,qBAAqB,CAAC;IAC3C,OAAO,CAAC,EAAE,IAAI,CAAC;IACf,OAAO,CAAC,EAAE,IAAI,CAAC;IACf,kBAAkB,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IACtC,kBAAkB,CAAC,EAAE,OAAO,CAAC;CAC9B"}

package/dist/components/DatePicker/components/DatePickerContent.d.ts

@@ -1,4 +1,4 @@
 /// <reference types="react" />
 import { DatePickerContentProps } from '../types';
-export declare const DatePickerContent: ({ type, date, startDate, endDate, isInTheRange, maxDate, minDate, handleChange, handleMouseOver, handleChangeDate, variant, enableYearPicker, handleToggleYearPicker, }: DatePickerContentProps) => JSX.Element;
+export declare const DatePickerContent: ({ type, date, startDate, endDate, isInTheRange, maxDate, minDate, handleChange, handleMouseOver, handleChangeDate, variant, enableYearPicker, handleToggleYearPicker, hideNextMonthButton, hidePrevMonthButton, disableWeekendDays, }: DatePickerContentProps) => JSX.Element;
 //# sourceMappingURL=DatePickerContent.d.ts.map

package/dist/components/DatePicker/components/DatePickerContent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DatePickerContent.d.ts","sourceRoot":"","sources":["../../../../src/components/DatePicker/components/DatePickerContent.tsx"],"names":[],"mappings":";AAkBA,OAAO,EAAE,sBAAsB,EAAE,MAAM,UAAU,CAAC;AAElD,eAAO,MAAM,iBAAiB,4KAc3B,sBAAsB,gBAiOxB,CAAC"}
+{"version":3,"file":"DatePickerContent.d.ts","sourceRoot":"","sources":["../../../../src/components/DatePicker/components/DatePickerContent.tsx"],"names":[],"mappings":";AAkBA,OAAO,EAAE,sBAAsB,EAAE,MAAM,UAAU,CAAC;AAElD,eAAO,MAAM,iBAAiB,0OAiB3B,sBAAsB,gBAyOxB,CAAC"}

package/dist/components/DatePicker/components/DatePickerContent.js

@@ -42,7 +42,10 @@ var DatePickerContent = function DatePickerContent(_ref) {
       handleChangeDate = _ref.handleChangeDate,
       variant = _ref.variant,
       enableYearPicker = _ref.enableYearPicker,
-      handleToggleYearPicker = _ref.handleToggleYearPicker;
+      handleToggleYearPicker = _ref.handleToggleYearPicker,
+      hideNextMonthButton = _ref.hideNextMonthButton,
+      hidePrevMonthButton = _ref.hidePrevMonthButton,
+      disableWeekendDays = _ref.disableWeekendDays;
 
   var handleChangeSelectDate = function handleChangeSelectDate(newDate) {
     handleChangeDate(newDate);
@@ -122,7 +125,7 @@ var DatePickerContent = function DatePickerContent(_ref) {
           onClick: function onClick() {
             return handleChangeMonth(date.getMonth(), 'down');
           },
-          isHidden: minDate && minDate.getMonth() === date.getMonth(),
+          isHidden: minDate && minDate.getMonth() === date.getMonth() || hidePrevMonthButton,
           children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.default, {
             name: "arrow-left"
           })
@@ -140,7 +143,7 @@ var DatePickerContent = function DatePickerContent(_ref) {
           onClick: function onClick() {
             return handleChangeMonth(date.getMonth(), 'up');
           },
-          isHidden: maxDate && maxDate.getMonth() === date.getMonth(),
+          isHidden: maxDate && maxDate.getMonth() === date.getMonth() || hideNextMonthButton,
           children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.default, {
             name: "arrow-right"
           })
@@ -178,11 +181,13 @@ var DatePickerContent = function DatePickerContent(_ref) {
                   var dateMonth = isPreviousMonth ? date.getMonth() - 1 : isNextMonth ? date.getMonth() + 1 : date.getMonth();
                   var cellDate = new Date(date.getFullYear(), dateMonth, day);
                   var cellTitle = cellDate.toLocaleDateString();
-                  var isToday = cellDate.toLocaleDateString() === new Date().toLocaleDateString();
-                  var isStartDateOfRange = cellDate.toLocaleDateString() === startDate.toLocaleDateString();
-                  var isEndDateOfRange = cellDate.toLocaleDateString() === endDate.toLocaleDateString();
+                  var isToday = cellDate.getTime() === Date.now();
+                  var isStartDateOfRange = // setHours(0, 0, 0, 0) set the time to midnight
+                  cellDate.getTime() === startDate.setHours(0, 0, 0, 0);
+                  var isEndDateOfRange = cellDate.getTime() === endDate.getTime();
                   var outOfCurrentMonthInRange = type === 'range' && (isPreviousMonth || isNextMonth);
-                  var isDisabled = day === 0 || minDate && cellDate.getTime() < minDate.getTime() || maxDate && cellDate.getTime() > maxDate.getTime() || outOfCurrentMonthInRange;
+                  var isWeekendDay = disableWeekendDays ? cellDate.getDay() === 0 || cellDate.getDay() === 6 : false;
+                  var isDisabled = day === 0 || minDate && cellDate.getTime() < minDate.getTime() || maxDate && cellDate.getTime() > maxDate.getTime() || outOfCurrentMonthInRange || isWeekendDay;
                   var isExtended = variant === 'extended';
                   var removeZeros = days.filter(function (day) {
                     return day !== 0;
@@ -191,6 +196,7 @@ var DatePickerContent = function DatePickerContent(_ref) {
                     role: "gridcell",
                     title: cellTitle,
                     "data-date": cellDate,
+                    isTheSameDate: cellDate.getTime() === endDate.getTime() && cellDate.getTime() === startDate.getTime(),
                     tabIndex: -1,
                     disabled: isDisabled,
                     "aria-label": cellDate.toLocaleDateString('pt-BR', {