Remove the arrow on option selected ?

[npalbrecht]

Hello there,

Thanks for this amazing plug-in, it's very useful in my app and I'm enjoying playing with it ! 😄
I've a simple question : is there a way to remove the arrow when an option is selected ?
I can't find a way to do it and my aim is to have something like this when the option is selected :

Thanks guys !

[azeezat]

@npalbrecht Thanks for the feedback! We are glad you found it useful.

There us a property called dropdownIcon. You can replace this with anything of choice and style it with dropdownIconStyle

I have put together an example for you below. you can find it in the sandbox (When you select the third Dropdown)

      <DropdownSelect
            label="Border has been removed"
            placeholder="Select users"
            options={[
              { label: 'John Doe', value: '12' },
              { label: 'James Bond', value: '13' },
            ]}
            selectedValue={users}
            onValueChange={(itemValue: any) => setUsers(itemValue)}
            isSearchable
            primaryColor={'purple'}
            dropdownStyle={{
              borderWidth: 0, // To remove border, set borderWidth to 0
            }}
            dropdownIcon={
              users && (
                <View style={styles.outerCircle}>
                  <View style={styles.innerCircle} />
                </View>
              )
            }
            dropdownIconStyle={users && { top: 20, right: 15 }}
          />

[npalbrecht]

Thanks for you reply but I'm sorry for the missunderstood.
What I want to edit is this arrow and set it with the example in the OP :

[azeezat]

I see, that functionality is currently unavailable. But we can add that in the coming releases

[azeezat]

@npalbrecht I just published a new release 1.1.3 on NPM to address your issue! Please let me know if this helps.

[azeezat]

Dropdowns 4 and 5 in the sandbox contains some examples

[azeezat]

[npalbrecht]

Oh wow, that's perfect ! Thank you very much for your speed ! :)