This repository has been archived by the owner on Oct 7, 2020. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 86
disabled tabs #147
Comments
Hey @rapropos Good points. Since MD guidelines do not include specs for disabled tabs, lemme reach out to MCW team for guidance. |
Hey @rapropos, MCW team is gathering info from the teams. Will update soon as I hear back. |
I heard back from MCW team, and no other teams have design details for disabled tabs. So, we'll design a |
@rapropos Disabled tab will be available shortly; including the change with a few other Tab commits. |
All set. Once PR #369 is merged, I'll close issue. |
trimox
added a commit
that referenced
this issue
Nov 13, 2017
- [x] Add `disabled` tab - [x] Fix `[active]` property changes not propagating #349 - [x] Fix `mdc-tab-bar-scroller__indicator` misplaced issue #281 - [x] Remove `mdc-tab-bar-scroll-button` directive #### mdc-tab * Add `disabled: boolean` property to `mdc-tab` * Refactor `active` property * Add `changeDetection: ChangeDetectionStrategy.OnPush` * Add `preserveWhitespaces: false` * Add `getComputedWidth(): number`; return the computed width for tab. * Add `getComputedLeft(): number`; return the computed left offset for tab. * Add `isActive()` return true if tab is active. * Add `setActive(boolean)`; set tab active property to value passed. * Add `getPreventDefaultOnClick(): boolean`; return true if the tab prevents the default click action. * Add `setPreventDefaultOnClick(boolean)`; sets tabs `preventDefaultOnClick` property to the value passed. * Add `measureSelf()`; sets computedWidth and computedLeft for a tab. #### mdc-tab-bar * Add `getComputedWidth(): number` * Add `layout(): void` * Add `changeDetection: ChangeDetectionStrategy.OnPush` * Add `preserveWhitespaces: false` * Add `getActiveTabIndex(): number` * Add `switchToTabAtIndex(index: number, shouldNotify: boolean = true)` * Add `MdcTabBarIndicator` directive * Add `setPreventDefaultOnClickForTabAtIndex(index: number, preventDefaultOnClick: boolean)` * Add `isDefaultPreventedOnClickForTabAtIndex(index: number): boolean` #### mdc-tab-bar-scroller * Add `layout()` * Add `changeDetection: ChangeDetectionStrategy.OnPush` * Add `preserveWhitespaces: false` * Add `scrollBack(event?: Event)` * Add `scrollForward(event?: Event)` * Remove `mdc-tab-bar-scroll-button` directive BREAKING CHANGE: Removed `mdc-tab-bar-scroll-button` directive. Use `mdc-icon` instead. Please update your code accordingly. Example: ```html <mdc-tab-bar-scroll-back> <mdc-icon>navigate_before</mdc-icon> </mdc-tab-bar-scroll-back> ``` Closes #349 Closes #147 Closes #281
Closed
Sign up for free
to subscribe to this conversation on GitHub.
Already have an account?
Sign in.
I am not sure whether this needs to be proposed upstream at mdc-web, or could be handled here. Frankly, upstream's feature request policy is rather intimidating, and if their tab component has no disabled attribute, perhaps it is considered "out of guidelines". I couldn't find one.
In any event, I often find it useful for certain tabs to become unselectable due to certain conditions. For example, say we have a user management screen that ordinarily has a tab for deleting users. The system would become unusable if all users are deleted, so in the situation that there is only one user in the system, I would want this tab to become disabled. I don't want to nuke it out of the tab bar entirely due to users getting kinetically adjusted to the position of various tabs, just make it unresponsive and visually indicated that it is not available.
For reference, angular/material2 did it this way.
The text was updated successfully, but these errors were encountered: