How to use @synerise/ds-utils - 5 common examples

it('should render tabs container with 3 items', () => {
    // ARRANGE
    const content = <div style="{{width:"> {}} /&gt;</div>;
    const { rerender, queryAllByTestId } = renderWithProvider(content);

    // ACT
    setTimeout(() =&gt; {
      rerender(content);

      // ASSERT
      expect(queryAllByTestId('tab-container').length).toBe(3);
    }, WAIT_FOR_HOOKS)
  });

it('should render dropdown', () => {
    // ARRANGE
    const handleConfigurationAction = jest.fn();
    const content = <div style="{{width:"> {}} configuration={{label: 'Button label', action: handleConfigurationAction}} /&gt;</div>;
    const { baseElement } = renderWithProvider(content, { container: document.body});

    // ASSERT
    expect(baseElement.getElementsByClassName('ant-dropdown')).toBeTruthy();
  });

if (fontStyleWatcher) {
      attachWidthWatcher(fontStyleWatcher.current as HTMLDivElement, updateInputWidth);
    }
  }, [autoFocus, fontStyleWatcher, inputRef, updateInputWidth]);

  return (
    
      
      {!hideIcon && (

const setup = ({
    disabled = false, 
    maxLength,
    autoComplete,
    name = 'name-of-input',
    hideIcon,
  }: {
    disabled?: boolean,
    maxLength?: number,
    autoComplete?: string,
    name?: string
    hideIcon?: boolean
  }) => {
  const utils = renderWithProvider(
     onChange(e.target.value)}
      maxLength={maxLength}
      placeholder={PLACEHOLDER}
      size={'normal'}
      error={false}
      disabled={disabled}
      autoComplete={autoComplete}
      hideIcon={hideIcon}
    />
  )
  const input = utils.getByPlaceholderText(PLACEHOLDER) as HTMLInputElement

  box-shadow: 0 2px 6px ${(props): string => hexToRgba(props.theme.palette['grey-400'], 0.12)};
`;