@consumidor-positivo/aurora 0.0.151 → 0.0.152

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -24,9 +24,10 @@ const useEmailAutocomplete = (propsOnChange) => {
24
24
  setInputValue(value);
25
25
  if (propsOnChange) propsOnChange(value);
26
26
  const atIndex = value.indexOf("@");
27
+ let filteredDomains = [];
27
28
  if (atIndex > -1) {
28
29
  const domainPart = value.slice(atIndex + 1);
29
- const filteredDomains = emailDomains.filter(
30
+ filteredDomains = emailDomains.filter(
30
31
  (domain) => domain.startsWith(domainPart)
31
32
  );
32
33
  setSuggestions(filteredDomains);
@@ -35,6 +36,9 @@ const useEmailAutocomplete = (propsOnChange) => {
35
36
  setSuggestions([]);
36
37
  setIsDropdownOpen(false);
37
38
  }
39
+ if (filteredDomains.some((domain) => value.endsWith(domain))) {
40
+ setIsDropdownOpen(false);
41
+ }
38
42
  };
39
43
  const handleSuggestionClick = (suggestion) => {
40
44
  const atIndex = inputValue.indexOf("@");
@@ -1 +1 @@
1
- {"version":3,"file":"index.es.js","sources":["../../../lib/components/form/EmailField/hook.ts","../../../lib/components/form/EmailField/index.tsx"],"sourcesContent":["import { useState } from 'react'\n\nconst emailDomains = [\n 'gmail.com',\n 'hotmail.com',\n 'yahoo.com',\n 'outlook.com',\n 'yahoo.com.br',\n 'uol.com.br',\n 'ig.com.br',\n 'terra.com.br',\n 'aol.com',\n 'live.com',\n 'msn.com',\n]\n\nexport const useEmailAutocomplete = (propsOnChange?: (value: string) => void) => {\n const [inputValue, setInputValue] = useState('')\n const [suggestions, setSuggestions] = useState<string[]>([])\n const [isDropdownOpen, setIsDropdownOpen] = useState(false)\n\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const value = e.target.value\n \n setInputValue(value)\n\t\tif(propsOnChange) propsOnChange(value);\n\n const atIndex = value.indexOf('@')\n if (atIndex > -1) {\n const domainPart = value.slice(atIndex + 1)\n const filteredDomains = emailDomains.filter((domain) =>\n domain.startsWith(domainPart),\n )\n setSuggestions(filteredDomains)\n setIsDropdownOpen(filteredDomains.length > 0)\n } else {\n setSuggestions([])\n setIsDropdownOpen(false)\n }\n }\n\n const handleSuggestionClick = (suggestion: string) => {\n const atIndex = inputValue.indexOf('@')\n if (atIndex > -1) {\n\t\t\tconst completedEmailValue = inputValue.slice(0, atIndex + 1) + suggestion;\n setInputValue(completedEmailValue);\n\t\t\tif(propsOnChange) propsOnChange(completedEmailValue);\n }\n setSuggestions([])\n setIsDropdownOpen(false)\n }\n\n return {\n inputValue,\n setInputValue,\n suggestions,\n isDropdownOpen,\n handleChange,\n handleSuggestionClick,\n }\n}\n","import Field from '../Field'\nimport { useEmailAutocomplete } from './hook'\nimport classNames from 'classnames'\nimport './styles.scss'\n\nexport type InputProps = React.InputHTMLAttributes<HTMLInputElement> & {\n showOptionalLabel?: boolean\n requiredInput?: boolean\n success?: boolean\n error?: boolean\n errorMessage?: string\n helpMessage?: string\n rightSlot?: React.ReactNode\n label?: string\n inputStyle?: React.CSSProperties\n inputRef?: React.RefObject<HTMLInputElement>\n\tonChange?: (value: string) => void;\n}\n\nexport const EmailField = ({\n showOptionalLabel,\n requiredInput,\n success,\n error,\n errorMessage,\n helpMessage,\n label,\n id,\n disabled,\n style,\n className,\n inputStyle,\n rightSlot,\n inputRef,\n ...props\n}: InputProps) => {\n const {\n inputValue,\n suggestions,\n isDropdownOpen,\n handleChange,\n handleSuggestionClick,\n } = useEmailAutocomplete(props.onChange);\n\n return (\n <Field.Root\n style={style}\n customclass={className}\n success={success}\n error={error}\n disabled={disabled}>\n <Field.Label\n text={label}\n id={id}\n showOptionalLabel={showOptionalLabel}\n required={requiredInput}\n success={success}\n error={error}\n disabled={disabled}\n />\n <Field.InputHolder rightSideSlot={rightSlot}>\n <Field.Input\n id={id}\n type=\"email\"\n inputRef={inputRef}\n value={inputValue}\n disabled={disabled}\n style={inputStyle}\n {...props}\n\t\t\t\t\tonChange={handleChange}\n />\n <ul\n className={classNames('au-field__input-autocomplete', {\n 'au-field__input-autocomplete--open': isDropdownOpen,\n })}\n tabIndex={-1}\n role=\"listbox\"\n aria-expanded={isDropdownOpen}\n style={{\n overflowY: 'auto',\n }}>\n {suggestions.map((suggestion, index) => (\n <li\n className=\"au-field__input-option\"\n onClick={() => handleSuggestionClick(suggestion)}\n role=\"option\"\n key={index}>\n {suggestion}\n </li>\n ))}\n </ul>\n </Field.InputHolder>\n <Field.Message\n hasError={!!error}\n errorMessage={errorMessage}\n helpMessage={helpMessage}\n />\n </Field.Root>\n )\n}\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"index.es.js","sources":["../../../lib/components/form/EmailField/hook.ts","../../../lib/components/form/EmailField/index.tsx"],"sourcesContent":["import { useState } from 'react'\n\nconst emailDomains = [\n 'gmail.com',\n 'hotmail.com',\n 'yahoo.com',\n 'outlook.com',\n 'yahoo.com.br',\n 'uol.com.br',\n 'ig.com.br',\n 'terra.com.br',\n 'aol.com',\n 'live.com',\n 'msn.com',\n]\n\nexport const useEmailAutocomplete = (propsOnChange?: (value: string) => void) => {\n const [inputValue, setInputValue] = useState('')\n const [suggestions, setSuggestions] = useState<string[]>([])\n const [isDropdownOpen, setIsDropdownOpen] = useState(false)\n\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const value = e.target.value\n \n setInputValue(value)\n\t\tif(propsOnChange) propsOnChange(value);\n\n const atIndex = value.indexOf('@');\n\t\tlet filteredDomains: string[] = [];\n\n if (atIndex > -1) {\n const domainPart = value.slice(atIndex + 1)\n filteredDomains = emailDomains.filter((domain) =>\n domain.startsWith(domainPart),\n )\n setSuggestions(filteredDomains)\n setIsDropdownOpen(filteredDomains.length > 0)\n } else {\n setSuggestions([])\n setIsDropdownOpen(false)\n }\n\n if (filteredDomains.some(domain => value.endsWith(domain))) {\n setIsDropdownOpen(false)\n }\n }\n\n const handleSuggestionClick = (suggestion: string) => {\n const atIndex = inputValue.indexOf('@')\n if (atIndex > -1) {\n\t\t\tconst completedEmailValue = inputValue.slice(0, atIndex + 1) + suggestion;\n setInputValue(completedEmailValue);\n\t\t\tif(propsOnChange) propsOnChange(completedEmailValue);\n }\n setSuggestions([])\n setIsDropdownOpen(false)\n }\n\n return {\n inputValue,\n setInputValue,\n suggestions,\n isDropdownOpen,\n handleChange,\n handleSuggestionClick,\n }\n}\n","import Field from '../Field'\nimport { useEmailAutocomplete } from './hook'\nimport classNames from 'classnames'\nimport './styles.scss'\n\nexport type InputProps = React.InputHTMLAttributes<HTMLInputElement> & {\n showOptionalLabel?: boolean\n requiredInput?: boolean\n success?: boolean\n error?: boolean\n errorMessage?: string\n helpMessage?: string\n rightSlot?: React.ReactNode\n label?: string\n inputStyle?: React.CSSProperties\n inputRef?: React.RefObject<HTMLInputElement>\n\tonChange?: (value: string) => void;\n}\n\nexport const EmailField = ({\n showOptionalLabel,\n requiredInput,\n success,\n error,\n errorMessage,\n helpMessage,\n label,\n id,\n disabled,\n style,\n className,\n inputStyle,\n rightSlot,\n inputRef,\n ...props\n}: InputProps) => {\n const {\n inputValue,\n suggestions,\n isDropdownOpen,\n handleChange,\n handleSuggestionClick,\n } = useEmailAutocomplete(props.onChange);\n\n return (\n <Field.Root\n style={style}\n customclass={className}\n success={success}\n error={error}\n disabled={disabled}>\n <Field.Label\n text={label}\n id={id}\n showOptionalLabel={showOptionalLabel}\n required={requiredInput}\n success={success}\n error={error}\n disabled={disabled}\n />\n <Field.InputHolder rightSideSlot={rightSlot}>\n <Field.Input\n id={id}\n type=\"email\"\n inputRef={inputRef}\n value={inputValue}\n disabled={disabled}\n style={inputStyle}\n {...props}\n\t\t\t\t\tonChange={handleChange}\n />\n <ul\n className={classNames('au-field__input-autocomplete', {\n 'au-field__input-autocomplete--open': isDropdownOpen,\n })}\n tabIndex={-1}\n role=\"listbox\"\n aria-expanded={isDropdownOpen}\n style={{\n overflowY: 'auto',\n }}>\n {suggestions.map((suggestion, index) => (\n <li\n className=\"au-field__input-option\"\n onClick={() => handleSuggestionClick(suggestion)}\n role=\"option\"\n key={index}>\n {suggestion}\n </li>\n ))}\n </ul>\n </Field.InputHolder>\n <Field.Message\n hasError={!!error}\n errorMessage={errorMessage}\n helpMessage={helpMessage}\n />\n </Field.Root>\n )\n}\n"],"names":[],"mappings":"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"}
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@consumidor-positivo/aurora",
3
3
  "private": false,
4
- "version": "0.0.151",
4
+ "version": "0.0.152",
5
5
  "type": "module",
6
6
  "main": "./dist/main.es.js",
7
7
  "modules": "./dist/main.es.js",