Create <Text /> component about orbit

[fallion]

The issue is that it gets pretty long and it's extra typing that will not be necessary half the time.

Example:
import { OrbitButton, OrbitTypography, OrbitInput, OrbitTable } from '@kiwicom/orbit-components'

[fallion]

I would check with the devs whether they run into this issue or not, because if they are then the team leads should solve this knowledge issue.

[FilipMessa]

I don't like this prefix, always when I I need to know which component is from where I can just look on the import. It is unnecessary verbose

[git-toni]

We've got Typography, should we rename it to Text?

[honzatmn]

Yes, if it's possible. It will be synced not only with Orbit UI for Sketch but mostly with names of design tokens (colorTextPrimary, colorTextSecondary, etc.) If I am not mistaken, now Typography covers all texts from body texts and headlines to any other text you can imagine.

I explained why we should have this separated in the original Dropbox Paper document, I am copying it here too:

Why have a specific component for text and a second one for the heading?
Because in the design system, they both have a totally different purpose (and as you can see in specifications, also very different possibilities of configuration).

Also, in the code, reading will be much easier, for example:

<Heading Element=”h1” Size=”Size 1”>Very important heading</Heading>
​​<Text>Loooong paragraphs of text</Text>
​​<Text>Another loooong paragraphs of text</Text>
​​<Heading Element=”h2” Size=”Size 2”>Not so important header</Heading>
​​<Text>Just another paragraph of text</Text>

Hope it make sense :)

[honzatmn]

Actually, I was thinking if we shouldn't have all the Orbit components prefixed with "Orbit", e.g. <OrbitText />, <OrbitHeadline />, <OrbitTable />, <OrbitWhatever />. If we do it, it will be totally clear which components in the code are from design system and which are specific for every project. It also probably solve the issue with component from old Kiwi repo and new from Orbit repo (not sure if that's even issue though).

What do you think about it? @jaroslav-kubicek @michalsanger @fallion @infi-pc

[michalsanger]

Does other component libraries have naming like this?

[fallion]

Developers know (or should know/ can ask their team leads) how to rename imports when using them in code.

I don't think it's a good practice to prefix stuff like this. You can already see it on the import level where the components are coming from.

Example:
import { Input } from 'frontendcomponents'
import { Input as OrbitInput } from '@kiwicom/orbit-components'

What the alternative would look like for everything else:
import { OrbitInput } from '@kiwicom/orbit-components'

I can't think of any library that does this.

[honzatmn]

Not majority but there are few, yes. For example Skyscanner with "Bpk" (Backpack) or Hubsport prefixes UI for every component. Others, that have component libraries based on SASS, prefix their classes with something (Salesforce with "slds", etc.)

My idea behind it was to make clear what's from Orbit and what's not. @fallion's example is solving this issue too, we just need to tell devs to rename imports when importing something. I believe that this can really help to have better clarity.

[git-toni]

@jaroslav-kubicek Any final decision on this?