@npm_leadtech/legal-lib-components 7.45.1 → 7.46.0

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.
Files changed (23) hide show
  1. package/dist/css/styles.css +0 -3
  2. package/dist/src/components/atoms/MenuItemsDeprecated/MenuItemsDeprecated.js +3 -2
  3. package/dist/src/components/atoms/MenuItemsDeprecated/MenuItemsDeprecated.styled.js +11 -0
  4. package/dist/src/components/atoms/MenuItemsDeprecated/MenuItemsDeprecated.styled.ts +11 -0
  5. package/dist/src/components/atoms/MenuItemsDeprecated/MenuItemsDeprecated.tsx +3 -1
  6. package/dist/src/components/atoms/MenuItemsDeprecated/MenuItemsDeprecatedProps.types.d.ts +1 -0
  7. package/dist/src/components/atoms/MenuItemsDeprecated/MenuItemsDeprecatedProps.types.ts +1 -0
  8. package/dist/src/components/atoms/TextArea/TextArea.js +2 -2
  9. package/dist/src/components/atoms/TextArea/TextArea.tsx +1 -3
  10. package/dist/src/components/atoms/TextArea/TextAreaProps.types.d.ts +0 -1
  11. package/dist/src/components/atoms/TextArea/TextAreaProps.types.ts +0 -1
  12. package/dist/src/components/molecules/NavBarDropDown/NavBarDropDown.js +2 -2
  13. package/dist/src/components/molecules/NavBarDropDown/NavBarDropDown.tsx +8 -2
  14. package/dist/src/components/molecules/NavBarDropDown/NavBarDropDownProps.types.d.ts +1 -0
  15. package/dist/src/components/molecules/NavBarDropDown/NavBarDropDownProps.types.ts +1 -0
  16. package/dist/src/components/molecules/TextInput/Input.d.ts +1 -1
  17. package/dist/src/components/molecules/TextInput/Input.js +1 -2
  18. package/dist/src/components/molecules/TextInput/Input.tsx +2 -3
  19. package/dist/src/components/molecules/TextInput/TextInput.scss +0 -4
  20. package/dist/src/components/molecules/TextInput/TextInputProps.types.d.ts +1 -1
  21. package/dist/src/components/molecules/TextInput/TextInputProps.types.ts +1 -1
  22. package/dist/src/components/molecules/TextInput/stories/TextInput.stories.tsx +0 -10
  23. package/package.json +1 -1
@@ -2032,9 +2032,6 @@ h2.react-datepicker__current-month {
2032
2032
  margin-bottom: 1rem;
2033
2033
  position: relative;
2034
2034
  }
2035
- .e-text .e-text-input__short {
2036
- width: 50%;
2037
- }
2038
2035
  .e-text input {
2039
2036
  -webkit-appearance: none;
2040
2037
  -moz-appearance: none;
@@ -7,7 +7,7 @@ import classNames from 'classnames';
7
7
  import { MenuItemsDeprecatedStyled } from './MenuItemsDeprecated.styled';
8
8
  import { stringSlugify } from '../../../utils/stringSlugify';
9
9
  // import './MenuItems.scss'
10
- const MenuItemsDeprecated = ({ spacing, list, hasBullets = false, initialActiveContent = '', ...rest }) => {
10
+ const MenuItemsDeprecated = ({ spacing, list, hasBullets = false, initialActiveContent = '', isTestAB21644 = false, ...rest }) => {
11
11
  const [contentListElement, setContentListElement] = useState(initialActiveContent);
12
12
  const filteredList = list?.filter((item) => item.content);
13
13
  if (filteredList.length === 0 || !filteredList[0].content) {
@@ -31,7 +31,8 @@ const MenuItemsDeprecated = ({ spacing, list, hasBullets = false, initialActiveC
31
31
  // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions
32
32
  _jsx("li", { title: content, className: `menu-items__item ${className ?? ''}
33
33
  ${!href && onClick == null ? 'disabled' : ''}
34
- ${contentListElement === content ? 'active' : 'inactive'}`, onClick: () => {
34
+ ${contentListElement === content ? 'active' : 'inactive'}
35
+ ${isTestAB21644 ? 'menu-items__testab21644' : ''}`, onClick: () => {
35
36
  if (onClick !== undefined) {
36
37
  onClick();
37
38
  }
@@ -8,6 +8,17 @@ export const MenuItemsDeprecatedStyled = styled.ul `
8
8
  }
9
9
  }
10
10
 
11
+ &__testab21644 {
12
+ &::before {
13
+ content: '•';
14
+ font-size: 1.2em;
15
+ margin-right: 0.5rem;
16
+ }
17
+ &:hover::before {
18
+ color: var(--primary-main-light-1);
19
+ }
20
+ }
21
+
11
22
  &__bullets {
12
23
  list-style-position: inside;
13
24
  list-style-type: disc;
@@ -9,6 +9,17 @@ export const MenuItemsDeprecatedStyled = styled.ul`
9
9
  }
10
10
  }
11
11
 
12
+ &__testab21644 {
13
+ &::before {
14
+ content: '•';
15
+ font-size: 1.2em;
16
+ margin-right: 0.5rem;
17
+ }
18
+ &:hover::before {
19
+ color: var(--primary-main-light-1);
20
+ }
21
+ }
22
+
12
23
  &__bullets {
13
24
  list-style-position: inside;
14
25
  list-style-type: disc;
@@ -14,6 +14,7 @@ const MenuItemsDeprecated: FC<MenuItemsDeprecatedProps> = ({
14
14
  list,
15
15
  hasBullets = false,
16
16
  initialActiveContent = '',
17
+ isTestAB21644 = false,
17
18
  ...rest
18
19
  }) => {
19
20
  const [contentListElement, setContentListElement] = useState(initialActiveContent)
@@ -45,7 +46,8 @@ const MenuItemsDeprecated: FC<MenuItemsDeprecatedProps> = ({
45
46
  title={content}
46
47
  className={`menu-items__item ${className ?? ''}
47
48
  ${!href && onClick == null ? 'disabled' : ''}
48
- ${contentListElement === content ? 'active' : 'inactive'}`}
49
+ ${contentListElement === content ? 'active' : 'inactive'}
50
+ ${isTestAB21644 ? 'menu-items__testab21644' : ''}`}
49
51
  onClick={() => {
50
52
  if (onClick !== undefined) {
51
53
  onClick()
@@ -4,6 +4,7 @@ export interface MenuItemsDeprecatedProps {
4
4
  hasBullets?: boolean;
5
5
  initialActiveContent?: string;
6
6
  list: MenuListItem[];
7
+ isTestAB21644?: boolean;
7
8
  }
8
9
  export interface MenuListItem {
9
10
  className?: string;
@@ -5,6 +5,7 @@ export interface MenuItemsDeprecatedProps {
5
5
  hasBullets?: boolean
6
6
  initialActiveContent?: string
7
7
  list: MenuListItem[]
8
+ isTestAB21644?: boolean
8
9
  }
9
10
 
10
11
  export interface MenuListItem {
@@ -1,9 +1,9 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import { TextAreaStyled } from './TextArea.styled';
3
3
  import error from '../../../../images/svg/info-error_24px_outlined.svg';
4
- const TextArea = ({ customClass = '', disabled, errorMessage, label, name, onChange, placeholder, tooltip, validate = false, value, dataQa, maxLength }) => {
4
+ const TextArea = ({ customClass = '', disabled, errorMessage, label, name, onChange, placeholder, tooltip, validate = false, value, dataQa }) => {
5
5
  const classNames = `${validate ? 'e-textarea' : 'e-textarea --is-invalid'}
6
6
  ${customClass}`;
7
- return (_jsxs(TextAreaStyled, { className: classNames, children: [Boolean(tooltip) && _jsx("p", { className: 'tooltip-form sans-serif --small', children: tooltip }), Boolean(errorMessage) && !validate && (_jsxs("span", { className: 'e-text--error sans-serif --small', children: [_jsx("img", { src: error, alt: errorMessage }), errorMessage] })), _jsx("textarea", { id: name, name: name, placeholder: placeholder, onChange: onChange, value: value, disabled: disabled, "data-qa": dataQa, maxLength: maxLength }), Boolean(label) && (_jsx("div", { className: 'e-textarea__inner', children: _jsx("div", { className: 'inputLabel', children: label }) }))] }));
7
+ return (_jsxs(TextAreaStyled, { className: classNames, children: [Boolean(tooltip) && _jsx("p", { className: 'tooltip-form sans-serif --small', children: tooltip }), Boolean(errorMessage) && !validate && (_jsxs("span", { className: 'e-text--error sans-serif --small', children: [_jsx("img", { src: error, alt: errorMessage }), errorMessage] })), _jsx("textarea", { id: name, name: name, placeholder: placeholder, onChange: onChange, value: value, disabled: disabled, "data-qa": dataQa }), Boolean(label) && (_jsx("div", { className: 'e-textarea__inner', children: _jsx("div", { className: 'inputLabel', children: label }) }))] }));
8
8
  };
9
9
  export default TextArea;
@@ -15,8 +15,7 @@ const TextArea: FC<TextAreaProps> = ({
15
15
  tooltip,
16
16
  validate = false,
17
17
  value,
18
- dataQa,
19
- maxLength
18
+ dataQa
20
19
  }) => {
21
20
  const classNames = `${validate ? 'e-textarea' : 'e-textarea --is-invalid'}
22
21
  ${customClass}`
@@ -38,7 +37,6 @@ const TextArea: FC<TextAreaProps> = ({
38
37
  value={value}
39
38
  disabled={disabled}
40
39
  data-qa={dataQa}
41
- maxLength={maxLength}
42
40
  />
43
41
  {Boolean(label) && (
44
42
  <div className={'e-textarea__inner'}>
@@ -10,5 +10,4 @@ export interface TextAreaProps {
10
10
  validate?: boolean;
11
11
  disabled?: boolean;
12
12
  onChange?: (e: React.ChangeEvent<HTMLTextAreaElement>) => void;
13
- maxLength?: number;
14
13
  }
@@ -10,5 +10,4 @@ export interface TextAreaProps {
10
10
  validate?: boolean
11
11
  disabled?: boolean
12
12
  onChange?: (e: React.ChangeEvent<HTMLTextAreaElement>) => void
13
- maxLength?: number
14
13
  }
@@ -8,7 +8,7 @@ import { useIntersectionObserver } from '../../../hooks';
8
8
  let scrollPosition = 0;
9
9
  let touchStartPosY;
10
10
  let isDisabledScroll = false;
11
- export const NavBarDropDown = ({ isOpen, list, hasBullets = true, initialActiveContent, setEnableScrollbarOnClose, setIsOpen }) => {
11
+ export const NavBarDropDown = ({ isOpen, list, hasBullets = true, initialActiveContent, setEnableScrollbarOnClose, setIsOpen, isTestAB21644 = false }) => {
12
12
  const [ref, isIntersectingWithElement] = useIntersectionObserver({
13
13
  options: { threshold: 0.15 }
14
14
  });
@@ -63,5 +63,5 @@ export const NavBarDropDown = ({ isOpen, list, hasBullets = true, initialActiveC
63
63
  useEffect(() => {
64
64
  setEnableScrollbarOnClose(() => enableScrollbarOnClose);
65
65
  }, []);
66
- return (_jsx(_Fragment, { children: isOpen ? (_jsxs(NavBarDropDownStyled, { className: 'navbar-drop-down__container', children: [_jsx("div", { className: 'navbar-drop-down__container__menu_items', children: _jsx(MenuItemsDeprecated, { list: list, hasBullets: hasBullets, initialActiveContent: initialActiveContent }) }), _jsx("div", { ref: ref, className: 'navbar-drop-down__container__shadow', onClick: closeMenu })] })) : null }));
66
+ return (_jsx(_Fragment, { children: isOpen ? (_jsxs(NavBarDropDownStyled, { className: 'navbar-drop-down__container', children: [_jsx("div", { className: 'navbar-drop-down__container__menu_items', children: _jsx(MenuItemsDeprecated, { isTestAB21644: isTestAB21644, list: list, hasBullets: hasBullets, initialActiveContent: initialActiveContent }) }), _jsx("div", { ref: ref, className: 'navbar-drop-down__container__shadow', onClick: closeMenu })] })) : null }));
67
67
  };
@@ -16,7 +16,8 @@ export const NavBarDropDown: FC<NavBarDropDownProps> = ({
16
16
  hasBullets = true,
17
17
  initialActiveContent,
18
18
  setEnableScrollbarOnClose,
19
- setIsOpen
19
+ setIsOpen,
20
+ isTestAB21644 = false
20
21
  }): React.ReactElement | null => {
21
22
  const [ref, isIntersectingWithElement] = useIntersectionObserver<HTMLDivElement>({
22
23
  options: { threshold: 0.15 }
@@ -87,7 +88,12 @@ export const NavBarDropDown: FC<NavBarDropDownProps> = ({
87
88
  {isOpen ? (
88
89
  <NavBarDropDownStyled className='navbar-drop-down__container'>
89
90
  <div className='navbar-drop-down__container__menu_items'>
90
- <MenuItemsDeprecated list={list} hasBullets={hasBullets} initialActiveContent={initialActiveContent} />
91
+ <MenuItemsDeprecated
92
+ isTestAB21644={isTestAB21644}
93
+ list={list}
94
+ hasBullets={hasBullets}
95
+ initialActiveContent={initialActiveContent}
96
+ />
91
97
  </div>
92
98
  <div ref={ref} className='navbar-drop-down__container__shadow' onClick={closeMenu}></div>
93
99
  </NavBarDropDownStyled>
@@ -10,5 +10,6 @@ export interface NavBarDropDownProps {
10
10
  setEnableScrollbarOnClose: React.Dispatch<React.SetStateAction<(() => void) | undefined>>;
11
11
  setIsOpen: (open: boolean) => void;
12
12
  list: List[];
13
+ isTestAB21644?: boolean;
13
14
  }
14
15
  export {};
@@ -10,4 +10,5 @@ export interface NavBarDropDownProps {
10
10
  setEnableScrollbarOnClose: React.Dispatch<React.SetStateAction<(() => void) | undefined>>
11
11
  setIsOpen: (open: boolean) => void
12
12
  list: List[]
13
+ isTestAB21644?: boolean
13
14
  }
@@ -3,7 +3,7 @@ interface InputProps {
3
3
  name: string;
4
4
  placeholder: string;
5
5
  prefix: string;
6
- maxLength?: number;
6
+ maxLength: number;
7
7
  value: string;
8
8
  type: 'password' | 'text' | 'number' | 'tel';
9
9
  disabled: boolean;
@@ -4,7 +4,6 @@ import eyeCloseIcon from '../../../../images/svg/eye-close.svg';
4
4
  import eyeIcon from '../../../../images/svg/eye-24-px.svg';
5
5
  import percent from '../../../../images/svg/percent.svg';
6
6
  export const Input = React.forwardRef(({ value, name, placeholder, className, onChange, onClick, onBlur, onKeyDown, onKeyUp, disabled, type = 'text', maxLength, country, prefix, currrencySymbol }, ref) => {
7
- const isShortInput = Boolean(maxLength && maxLength <= 5);
8
7
  const [hidden, setHidden] = useState(true);
9
8
  const showPassword = () => {
10
9
  if (value !== null)
@@ -24,7 +23,7 @@ export const Input = React.forwardRef(({ value, name, placeholder, className, on
24
23
  else if (isPercent) {
25
24
  finalClassName += ' has-percent-suffix';
26
25
  }
27
- return (_jsxs(_Fragment, { children: [isCurrency && !!prefix && otherCurrency && currrencySymbol && (_jsx("div", { className: 'input-icon-currency-prefix', children: _jsx("span", { children: currrencySymbol }) })), _jsx("input", { type: !hidden && type === 'password' ? 'text' : type, name: name, id: name, className: `${finalClassName} ${isShortInput ? 'e-text-input__short' : ''}`, maxLength: maxLength, placeholder: placeholder, onChange: onChange, onClick: onClick, onKeyDown: onKeyDown, onKeyUp: onKeyUp, onBlur: onBlur, value: value, "data-qa": name, disabled: disabled, ref: ref }), type === 'password' && (_jsx("button", { type: 'button', className: 'input-icon-password-button', onClick: showPassword, onKeyDown: (e) => {
26
+ return (_jsxs(_Fragment, { children: [isCurrency && !!prefix && otherCurrency && currrencySymbol && (_jsx("div", { className: 'input-icon-currency-prefix', children: _jsx("span", { children: currrencySymbol }) })), _jsx("input", { type: !hidden && type === 'password' ? 'text' : type, name: name, id: name, className: finalClassName, maxLength: maxLength, placeholder: placeholder, onChange: onChange, onClick: onClick, onKeyDown: onKeyDown, onKeyUp: onKeyUp, onBlur: onBlur, value: value, "data-qa": name, disabled: disabled, ref: ref }), type === 'password' && (_jsx("button", { type: 'button', className: 'input-icon-password-button', onClick: showPassword, onKeyDown: (e) => {
28
27
  if (e.key === 'Enter')
29
28
  showPassword();
30
29
  }, children: _jsx("img", { src: hidden ? eyeIcon : eyeCloseIcon, alt: '' }) })), isCurrency
@@ -8,7 +8,7 @@ interface InputProps {
8
8
  name: string
9
9
  placeholder: string
10
10
  prefix: string
11
- maxLength?: number
11
+ maxLength: number
12
12
  value: string
13
13
  type: 'password' | 'text' | 'number' | 'tel'
14
14
  disabled: boolean
@@ -43,7 +43,6 @@ export const Input = React.forwardRef<HTMLInputElement, InputProps>(
43
43
  }: InputProps,
44
44
  ref
45
45
  ) => {
46
- const isShortInput = Boolean(maxLength && maxLength <= 5)
47
46
  const [hidden, setHidden] = useState(true)
48
47
 
49
48
  const showPassword = (): void => {
@@ -76,7 +75,7 @@ export const Input = React.forwardRef<HTMLInputElement, InputProps>(
76
75
  type={!hidden && type === 'password' ? 'text' : type}
77
76
  name={name}
78
77
  id={name}
79
- className={`${finalClassName} ${isShortInput ? 'e-text-input__short' : ''}`}
78
+ className={finalClassName}
80
79
  maxLength={maxLength}
81
80
  placeholder={placeholder}
82
81
  onChange={onChange}
@@ -10,10 +10,6 @@
10
10
  margin-bottom: 1rem;
11
11
  position: relative;
12
12
 
13
- .e-text-input__short {
14
- width: 50%;
15
- }
16
-
17
13
  input {
18
14
  -webkit-appearance: none;
19
15
  -moz-appearance: none;
@@ -9,7 +9,7 @@ export interface TextInputProps {
9
9
  mask?: string;
10
10
  format?: string;
11
11
  notes?: string;
12
- maxLength?: number;
12
+ maxLength?: any;
13
13
  value?: any;
14
14
  type?: 'password' | 'text' | 'number' | 'tel';
15
15
  validate?: boolean;
@@ -10,7 +10,7 @@ export interface TextInputProps {
10
10
  mask?: string
11
11
  format?: string
12
12
  notes?: string
13
- maxLength?: number
13
+ maxLength?: any
14
14
  value?: any
15
15
  type?: 'password' | 'text' | 'number' | 'tel'
16
16
  validate?: boolean
@@ -167,13 +167,3 @@ export const WithPrefixPercent: Story = {
167
167
  country: 'CA'
168
168
  }
169
169
  }
170
-
171
- export const SmallMaxLength: Story = {
172
- args: {
173
- value: '',
174
- name: 'Type of property',
175
- label: 'Type of property',
176
- type: 'text',
177
- maxLength: 5
178
- }
179
- }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@npm_leadtech/legal-lib-components",
3
- "version": "7.45.1",
3
+ "version": "7.46.0",
4
4
  "license": "ISC",
5
5
  "main": "dist/index.js",
6
6
  "types": "dist/index.d.ts",