How to use the botframework-webchat.createStyleSet function in botframework-webchat

const {
      botId,
      currentUser,
      conversationId,
      directLine,
      locale,
      mode,
      webchatStore,
      webSpeechPonyfillFactory,
    } = this.props;

    const isDisabled = mode === 'transcript' || mode === 'debug';

    // Due to needing to make idiosyncratic style changes, Emulator is using `createStyleSet` instead of `createStyleOptions`. The object below: {...webChatStyleOptions, hideSendBox...} was formerly passed into the `styleOptions` parameter of React Web Chat. If further styling modifications are desired using styleOptions, simply pass it into the same object in createStyleSet below.

    const styleSet = createStyleSet({ ...webChatStyleOptions, hideSendBox: isDisabled });

    styleSet.uploadButton = {
      ...styleSet.uploadButton,
      padding: '1px',
    };

    if (this.props.pendingSpeechTokenRetrieval) {
      return <div>Connecting...</div>;
    }

    if (directLine) {
      const bot = {
        id: botId || 'bot',
        name: 'Bot',
      };

runRpcCommand(rpcCommand);
            // stop webchat redux action propagation
            return;
          }
        }
      }

      return next(action);
    });

    this.state = {
      minimized: true,
      newMessage: false,
      side: 'right',
      store,
      styleSet: createStyleSet({
        backgroundColor: 'Transparent',
      }),
      token: props.token,
    };
  }

it('renders the WebChat component with correct props', () => {
      const webChat = wrapper.find(ReactWebChat);
      const styleSet = createStyleSet({ ...webChatStyleOptions });

      styleSet.uploadButton = {
        ...styleSet.uploadButton,
        padding: '1px',
      };

      expect(webChat.exists()).toBe(true);
      expect(webChat.props()).toMatchObject({
        activityMiddleware: expect.any(Function),
        bot: { id: defaultDocument.botId, name: 'Bot' },
        directLine: defaultDocument.directLine,
        locale: 'en-US',
        styleSet: styleSet,
        userID: '123',
        username: 'Current User',
      });

}, 1000);
      } else if (action.type === 'DIRECT_LINE/INCOMING_ACTIVITY') {
        if (action.payload.activity.from.role === 'bot') {
          this.setState(() => ({ newMessage: true }));
        }
      }

      return next(action);
    });

    this.state = {
      minimized: true,
      newMessage: false,
      side: 'right',
      store,
      styleSet: createStyleSet({
        backgroundColor: 'Transparent'
      }),
      token: null
    };
  }

constructor(props) {
    super(props);

    this.createDirectLine = memoize(token => createDirectLine({ token }));

    this.state = {
      styleSet: createStyleSet({
        backgroundColor: 'Transparent'
      })
    };
  }

constructor(props) {
    super(props);

    this.createDirectLine = memoize(token => createDirectLine({ token }));

    this.state = {
      styleSet: createStyleSet({
        backgroundColor: 'Transparent',
      }),
    };
  }