Igniteui-angular: igxTabs Component

[Eralmidia]

Description

It may be that this just isn't documented yet, but I can't find a property to display the tab at the "normal" position, at the top of the content. If this is not implemented, I would like to see this, as we are currently looking towards moving from other angular components to yours, without changing the looks and functionality.

[kdinev]

The TabBar component that we currently have corresponds to Bottom navigation from material.

https://material.io/guidelines/components/bottom-navigation.html

We currently don't have material Tabs, but this is an important component and we can include it on the roadmap. @SlavUI

https://material.io/guidelines/components/tabs.html

[Eralmidia]

Ah, right. I guess I was confused by the naming, as the component is called a tab bar.

But then the implementation makes more sense as well. I was a bit puzzled as to why the bar was using fixed positioning, as the tab bar is broken when using the old ignite-ui splitter for instance. But I do understand that the material bottom navigation isn't designed to address a scenario like a splitter.

Of course, this really calls for an actual tab implementation then.

[kdinev]

@Eralmidia We had actually started a Tabs specification last year and we still have it internally (not in the public wiki), but we temporarily deprioritized it because of the Grid.

@SlavUI Will look at the current priorities and we will let you know how soon we can get this component in the product!

[Eralmidia]

Sounds good. Looking forward to an update on this.

[Eralmidia]

Btw, when implementing the tabs, please take into consideration #539.

[zdrawku]

@Eralmidia , we will consider #539 as well.

[kdinev]

@Eralmidia I remembered why we called the Bottom navigation a "tabbar". At the time that we were developing this component, the material design guideline didn't define the tab-bar as a "bottom navigation". The actual "tab" was defined as something else, which was confusing for us as well. Now they are clearly separated, but I prefer to not rename our TabBar component, since this will introduce more breaking changes.

[Eralmidia]

That's understandable. Guess we should blame Google then ;) Will you be going for Tab and TabBar, or will you call tabs something else?

[kdinev]

It's probably going to be Tabs and TabBar.

@sbozalieva any comments?

[kdinev]

@Eralmidia Btw, unrelated to this issue, I suggest you take a look at #541 #536

Let me know if this will cause too much trouble for migration.

[Eralmidia]

Our goal is to get rid of both the old ignite-ui and material2 library, in favour of igx, but we have barely started the migration process, so a few renames won't bother us much at all. Shooting for consistency is always a plus.

[kdinev]

@Eralmidia Are you currently using the Angular wrappers for the classic Ignite UI?

[Eralmidia]

Well, our software is fairly large, so we have both old school jquery ignite, the semi new angular wrappers, and now the igx components. It will most likely take years before all is migrated, but getting the ability to template in the grid is a huge plus compared to the old components, so we are really looking forward to a more pure angular approach.

[kdinev]

@Eralmidia Thank you for choosing us :) We're heavily focused on the new components and our CLI at the moment. Btw, if you haven't tried the CLI, please check it out. Any feedback there is appreciated as well!

[Eralmidia]

We have been happy with ignite-ui for quite a few years now, and seeing how fast you seems to implement our suggestions in these new components, it's not a hard choice to continue using Infragistcs ;)

I haven't looked into the CLI yet no. Is this like an alternative to using the "regular" Angular-CLI project? Are there any advantages compared to that?

[kdinev]

It really isn't an alternative, as both can be used side-by-side in angular projects. Ours is aimed at producing projects and views with our components embedded, which saves the time to get everything set up. It can be used for jquery, react and angular projects. The angular portion is also available both for the wrappers and for this product. Check it out:

https://github.com/IgniteUI/igniteui-cli
https://twitter.com/KonstantinDinev/status/948917030564098048

[Eralmidia]

From the roadmap:

Does this mean that tabs will be included by mid april? I'm currently using tabs (from another package) in the module I'm currently working on. I would like to know if I have to make do with that for our next release (may), or if I can hold out for the igx tabs instead.

[kdinev]

@Eralmidia This is for the igniteui-cli and is about adding bottom navigation view support in the CLI. The Tabs would be put in development by the end of February/beginning of March, so they will make it into the product by April, potentially even March.

@SlavUI Please consider updating the wording, so we refer to the bottom navigation as TabBar and Tabs would be reserved for the new component.

[SlavUI]

@Eralmidia Also to add to what Konstantin said Tabs as a component is already in research phase so we deferentially want to release is as soon as possible :)

[kdinev]

@simeonoff suggests that to avoid confusion with the naming and to make the top tabs a configuration of the Tabbar and to not create a new component, which was indeed the initial suggestion.

[kdinev]

@Eralmidia The final decision is to create a new component - igxTabs. Specification will be put inside the wiki in the next few days.

[Eralmidia]

Sounds good. ETA still within a few weeks?

[kdinev]

@Eralmidia Yes, the item is in initial stage of development. Unless we hit a major roadblock, we should be putting the tabs out in April.

[sboykova]

https://github.com/IgniteUI/igniteui-angular/wiki/Tabs-Specification

[SlavUI]

• [x] Specification
• [x] Design
• [x] Implementation
• [x] Testing
• [x] Documentation
• [x] Sample

[kdinev]

Related #954