From 72dc9ffd29103fbeaca71fcb64ec7daa883a7e23 Mon Sep 17 00:00:00 2001 From: Allan Oliveira Date: Mon, 27 Feb 2023 11:14:45 -0300 Subject: [PATCH] fix: input with x --- package.json | 4 -- src/components/atoms/Input/Input.ts | 4 +- src/utils/form-utils.stories.mdx | 61 ----------------------------- src/utils/form-utils.ts | 56 -------------------------- src/utils/index.ts | 1 - yarn.lock | 27 ------------- 6 files changed, 2 insertions(+), 151 deletions(-) delete mode 100644 src/utils/form-utils.stories.mdx delete mode 100644 src/utils/form-utils.ts diff --git a/package.json b/package.json index fb2646a..642851c 100644 --- a/package.json +++ b/package.json @@ -52,9 +52,7 @@ "@storybook/react": "^6.5.12", "@storybook/testing-library": "^0.0.13", "@storybook/theming": "^6.5.12", - "@types/inputmask": "^5.0.3", "@types/lodash": "^4.14.186", - "@types/lodash.flowright": "^3.5.7", "@types/node": "18.7.23", "@types/react": "^18.0.23", "@types/react-dom": "^18.0.7", @@ -111,9 +109,7 @@ "@nexpy/react-easy-context-api": "^1.0.2", "@xstyled/styled-components": "^3.7.0", "framer-motion": "^7.6.1", - "inputmask": "^5.0.7", "lodash": "^4.17.21", - "lodash.flowright": "^3.5.0", "react-hook-form": "^7.38.0", "react-select": "^5.5.6", "scheduler": "^0.23.0", diff --git a/src/components/atoms/Input/Input.ts b/src/components/atoms/Input/Input.ts index f0450b5..c81b518 100644 --- a/src/components/atoms/Input/Input.ts +++ b/src/components/atoms/Input/Input.ts @@ -1,10 +1,10 @@ -import styled from '@xstyled/styled-components' +import styled, { x } from '@xstyled/styled-components' import { System } from 'types' export type InputProps = System<'input'> -const Input = styled.inputBox` +const Input = styled(x.input)` height: 4.6rem; outline: none; border: none; diff --git a/src/utils/form-utils.stories.mdx b/src/utils/form-utils.stories.mdx deleted file mode 100644 index 9b5e36b..0000000 --- a/src/utils/form-utils.stories.mdx +++ /dev/null @@ -1,61 +0,0 @@ -import { Meta } from '@storybook/addon-docs' - - - -# Form Utils - -
- -## withHookFormMask - -Create a mask for React Hook Form based fields. - -Using the function with React Hook Form: - -```tsx -// Needs inputmask lib -// Import dynamically by the client if you are using Server Side Rendering -import Inputmask from 'inputmask' - -const foo = () => ( - -) -``` - -
- -## withMask - -Create a mask for generic inputs. - -Using the function without React Hook Form: - -```tsx -// Needs inputmask lib -// Import dynamically by the client if you are using Server Side Rendering -import Inputmask from 'inputmask' - -const foo = () => ( - -) -``` - -## Exported Types - -```ts -export type WithMaskPattern = Inputmask.Options['mask'] -export type WithMaskOptions = Inputmask.Options -``` diff --git a/src/utils/form-utils.ts b/src/utils/form-utils.ts deleted file mode 100644 index 0cbb374..0000000 --- a/src/utils/form-utils.ts +++ /dev/null @@ -1,56 +0,0 @@ -import type { UseFormRegisterReturn } from 'react-hook-form' - -import type Inputmask from 'inputmask' -import flowright from 'lodash.flowright' - -export const withHookFormMask = ( - InputmaskFunction: typeof Inputmask, - registerReturn: UseFormRegisterReturn, - mask: Inputmask.Options['mask'], - options?: Inputmask.Options -) => { - let newRef - - if (registerReturn) { - const { ref } = registerReturn - - const maskInput = InputmaskFunction({ - mask, - jitMasking: true, - ...options, - }) - - newRef = flowright(ref, _ref => { - if (_ref) maskInput.mask(_ref) - return _ref - }) - } - - return { - ...registerReturn, - ref: newRef, - } -} - -export const withMask = - ( - InputmaskFunction: typeof Inputmask, - mask: Inputmask.Options['mask'], - options?: Inputmask.Options - ) => - (input: HTMLElement | HTMLInputElement | null) => { - // - const maskInput = InputmaskFunction({ - mask, - ...options, - }) - - if (input) { - maskInput.mask(input) - } - - return input - } - -export type WithMaskPattern = Inputmask.Options['mask'] -export type WithMaskOptions = Inputmask.Options diff --git a/src/utils/index.ts b/src/utils/index.ts index 3ffb812..d5434ad 100644 --- a/src/utils/index.ts +++ b/src/utils/index.ts @@ -1,4 +1,3 @@ export * from './formatters' export * from './styled' export * from './theme' -export * from './form-utils' diff --git a/yarn.lock b/yarn.lock index cf4d9f8..9da2c8b 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3105,11 +3105,6 @@ resolved "https://registry.yarnpkg.com/@types/html-minifier-terser/-/html-minifier-terser-5.1.2.tgz#693b316ad323ea97eed6b38ed1a3cc02b1672b57" integrity sha512-h4lTMgMJctJybDp8CQrxTUiiYmedihHWkjnF/8Pxseu2S6Nlfcy8kwboQ8yejh456rP2yWoEVm1sS/FVsfM48w== -"@types/inputmask@^5.0.3": - version "5.0.3" - resolved "https://registry.yarnpkg.com/@types/inputmask/-/inputmask-5.0.3.tgz#f23492d5b5862c5737ae24bfe9fb8b2acf77b453" - integrity sha512-9aTXacRhf9D3+porVydLR28ll8/y3TQIrXEXv7ZWY0c3Lzl/1r4nHoaesZeh2Fd+UIefpWZrg2tkSnDn/dKUsw== - "@types/is-function@^1.0.0": version "1.0.1" resolved "https://registry.yarnpkg.com/@types/is-function/-/is-function-1.0.1.tgz#2d024eace950c836d9e3335a66b97960ae41d022" @@ -3144,18 +3139,6 @@ resolved "https://registry.yarnpkg.com/@types/json5/-/json5-0.0.29.tgz#ee28707ae94e11d2b827bcbe5270bcea7f3e71ee" integrity sha1-7ihweulOEdK4J7y+UnC86n8+ce4= -"@types/lodash.flowright@^3.5.7": - version "3.5.7" - resolved "https://registry.yarnpkg.com/@types/lodash.flowright/-/lodash.flowright-3.5.7.tgz#154144dab8ed6561e7317ea158a4f7556d24858b" - integrity sha512-stlmNXfnJr1yI7+xwMkU1IQxWS59JMw83MejH13y0STHv0iVBzOrw6KcxSAZQjSkAtoRGk3T0aWAt67vrF7V0Q== - dependencies: - "@types/lodash" "*" - -"@types/lodash@*": - version "4.14.191" - resolved "https://registry.yarnpkg.com/@types/lodash/-/lodash-4.14.191.tgz#09511e7f7cba275acd8b419ddac8da9a6a79e2fa" - integrity sha512-BdZ5BCCvho3EIXw6wUCXHe7rS53AIDPLE+JzwgT+OsJk53oBfbSmZZ7CX4VaRoN78N+TJpFi9QPlfIVNmJYWxQ== - "@types/lodash@^4.14.167", "@types/lodash@^4.14.186": version "4.14.186" resolved "https://registry.yarnpkg.com/@types/lodash/-/lodash-4.14.186.tgz#862e5514dd7bd66ada6c70ee5fce844b06c8ee97" @@ -8079,11 +8062,6 @@ inline-style-parser@0.1.1: resolved "https://registry.yarnpkg.com/inline-style-parser/-/inline-style-parser-0.1.1.tgz#ec8a3b429274e9c0a1f1c4ffa9453a7fef72cea1" integrity sha512-7NXolsK4CAS5+xvdj5OMMbI962hU/wvwoxk+LWR9Ek9bVtyuuYScDN6eS0rUm6TxApFpw7CX1o4uJzcd4AyD3Q== -inputmask@^5.0.7: - version "5.0.7" - resolved "https://registry.yarnpkg.com/inputmask/-/inputmask-5.0.7.tgz#b04d5d4e1c85018893c3c8edb1a9f074b051007f" - integrity sha512-rUxbRDS25KEib+c/Ow+K01oprU/+EK9t9SOPC8ov94/ftULGDqj1zOgRU/Hko6uzoKRMdwCfuhAafJ/Wk2wffQ== - inquirer@6.5.2: version "6.5.2" resolved "https://registry.yarnpkg.com/inquirer/-/inquirer-6.5.2.tgz#ad50942375d036d327ff528c08bd5fab089928ca" @@ -9043,11 +9021,6 @@ lodash.debounce@^4.0.8: resolved "https://registry.yarnpkg.com/lodash.debounce/-/lodash.debounce-4.0.8.tgz#82d79bff30a67c4005ffd5e2515300ad9ca4d7af" integrity sha1-gteb/zCmfEAF/9XiUVMArZyk168= -lodash.flowright@^3.5.0: - version "3.5.0" - resolved "https://registry.yarnpkg.com/lodash.flowright/-/lodash.flowright-3.5.0.tgz#2b5fff399716d7e7dc5724fe9349f67065184d67" - integrity sha512-YxTYuodkvyINbDInmFcGGvkQwoAuoGUYosqstRTr5eq63GQt7WQ2xFU0wG1UfdbKYPwevd3zWDd6ybEE2g6qvA== - lodash.map@^4.5.1: version "4.6.0" resolved "https://registry.yarnpkg.com/lodash.map/-/lodash.map-4.6.0.tgz#771ec7839e3473d9c4cde28b19394c3562f4f6d3"