Support in rtl?

[yossimal95]

Hi,

There is any support in right to left? (or maybe a way to insert costume css in order to do so..?)

Tanks!

[yossimal95]

I've been manage to solve it using the form's class name attribute. I added my own class and changed the style of the default class via my new class.

Tanks anyway..!

[firflant]

@yossimal95 Can you give the example? Development of react-form-component package has been reinitiated this month and i may consider adding new functions.

[yossimal95]

Hi, Sure :-)

I added this CSS:

  direction: rtl;
}

.rtl input {
  direction: rtl;
  text-align: right;
}

.rtl label {
  direction: rtl;
  text-align: right;
}

Then, I added this JSX

const BasicExampleForm = ({ rtl }) => // rtl param..
  <Form fields={['name', 'email', 'type']} className={rtl && 'rtl'}> {/* using the rtl param */}
    <Input
      name='name'
      label='שלום?'
    />
    <Input
      name='email'
      type='email'
      label='E-mail'
    />
    <FormButton
      onClick={fields => console.log(fields)}
    >Save</FormButton>
  </Form>

Basically, it's okay, but I still need an option to change the Help notice to Hebrew..

[firflant]

@yossimal95 RTL support added to version 2.8.0. Activated by a dedicated theme typography setting:

<FormThemeProvider theme={{ typography: { direction: 'rtl' } }}>

[firflant]

For error text labels, see textLabels part of the customizable theme object https://firflant.github.io/react-form-component/?path=/story/docs-theming--page

[yossimal95]

@yossimal95 RTL support added to version 2.8.0. Activated by a dedicated theme typography setting:

<FormThemeProvider theme={{ typography: { direction: 'rtl' } }}>

Cool! Tnks..! I'll check it out🙏👍