md-chips #120

Open
jelbourn opened this Issue Feb 27, 2016 · 6 comments

Projects

None yet

6 participants

@jelbourn
Member

Blocked on #117

@jelbourn jelbourn added the feature label Feb 27, 2016
@jelbourn jelbourn added this to the before beta milestone Feb 27, 2016
@jelbourn jelbourn changed the title from mdChips to md-chips Feb 27, 2016
@jelbourn jelbourn added the blocked label Mar 9, 2016
@bastienJS

@jelbourn Does that mean this component will still be released in the alpha version (before beta)?

@ollwenjones

Chips seem sort of general purpose. It's not clear to me why their implementation would be blocked by autocomplete? Seems like it could be the other way around.

@topherfangio
Collaborator

@ollwenjones Still need to discuss with the team, but my goal is indeed to create a very basic version of the chips before we introduce the autocomplete functionality.

@ollwenjones

I'm not even sure understood what was meant by "Blocked on" - "Blocks" or "Blocked by" ? 😜

@topherfangio topherfangio added a commit to profoundry-us/material2 that referenced this issue Nov 14, 2016
@topherfangio topherfangio feat(chips): Initial skeleton/demo.
Create the initial Chips skeleton with a very basic working demo
of static, styled chips.

References #120.
82f73ec
@topherfangio topherfangio added a commit to profoundry-us/material2 that referenced this issue Nov 14, 2016
@topherfangio topherfangio feat(chips): Initial skeleton/demo.
Create the initial Chips skeleton with a very basic working demo
of static, styled chips.

References #120.
fac7cc8
@topherfangio topherfangio added a commit to profoundry-us/material2 that referenced this issue Nov 14, 2016
@topherfangio topherfangio feat(chips): Initial skeleton/demo.
Create the initial Chips skeleton with a very basic working demo
of static, styled chips.

References #120.
e553b8a
@topherfangio topherfangio added a commit to profoundry-us/material2 that referenced this issue Nov 15, 2016
@topherfangio topherfangio feat(chips): Initial skeleton/demo.
Create the initial Chips skeleton with a very basic working demo
of static, styled chips.

References #120.
6c4d602
@topherfangio topherfangio added a commit to profoundry-us/material2 that referenced this issue Nov 17, 2016
@topherfangio topherfangio feat(chips): Initial skeleton/demo.
Create the initial Chips skeleton with a very basic working demo
of static, styled chips.

References #120.
df01963
@topherfangio topherfangio added a commit to profoundry-us/material2 that referenced this issue Nov 17, 2016
@topherfangio topherfangio feat(chips): Initial skeleton/demo.
Create the initial Chips skeleton with a very basic working demo
of static, styled chips.

References #120.
fb22bbe
@jelbourn jelbourn removed the blocked label Nov 22, 2016
@topherfangio topherfangio added a commit to profoundry-us/material2 that referenced this issue Nov 28, 2016
@topherfangio topherfangio Add chip keyboard support.
 - Up/down arrows navigate chips.
 - Clicking a chip properly focuses it for subsequent keyboard
   navigation.
 - More demos.

References #120.
55f770d
@topherfangio topherfangio added a commit to profoundry-us/material2 that referenced this issue Nov 28, 2016
@topherfangio topherfangio Add chips keyboard support.
Add basic focus/keyboard support for chips.

 - Up/down arrows navigate chips.
 - Clicking a chip properly focuses it for subsequent keyboard
   navigation.
 - More demos.

References #120.
1333718
@tinayuangao tinayuangao added a commit that referenced this issue Nov 29, 2016
@topherfangio @tinayuangao topherfangio + tinayuangao feat(chips): Initial skeleton/demo. (#1855)
Create the initial Chips skeleton with a very basic working demo
of static, styled chips.

References #120.
edf5cdf
@topherfangio topherfangio added a commit to profoundry-us/material2 that referenced this issue Nov 29, 2016
@topherfangio topherfangio Add chips keyboard support.
Add basic focus/keyboard support for chips.

 - Up/down arrows navigate chips.
 - Clicking a chip properly focuses it for subsequent keyboard
   navigation.
 - More demos.

References #120.
7a50b35
@topherfangio topherfangio added a commit to profoundry-us/material2 that referenced this issue Nov 30, 2016
@topherfangio topherfangio Add chips keyboard support.
Add basic focus/keyboard support for chips.

 - Up/down arrows navigate chips.
 - Clicking a chip properly focuses it for subsequent keyboard
   navigation.
 - More demos.

References #120.
09d2033
@topherfangio topherfangio added a commit to profoundry-us/material2 that referenced this issue Dec 1, 2016
@topherfangio topherfangio Add chips keyboard support.
Add basic focus/keyboard support for chips.

 - Up/down arrows navigate chips.
 - Clicking a chip properly focuses it for subsequent keyboard
   navigation.
 - More demos.

References #120.
3ced447
@topherfangio topherfangio added a commit to profoundry-us/material2 that referenced this issue Dec 1, 2016
@topherfangio topherfangio Add chips keyboard support.
Add basic focus/keyboard support for chips.

 - Up/down arrows navigate chips.
 - Clicking a chip properly focuses it for subsequent keyboard
   navigation.
 - More demos.

Additionally, update ListKeyManager to prevent default for
key presses so page does not scroll with up/down keys.

References #120.
ededb73
@topherfangio topherfangio added a commit to profoundry-us/material2 that referenced this issue Dec 1, 2016
@topherfangio topherfangio Add chips keyboard support.
Add basic focus/keyboard support for chips.

 - Up/down arrows navigate chips.
 - Clicking a chip properly focuses it for subsequent keyboard
   navigation.
 - More demos.

Additionally, update ListKeyManager to prevent default for
key presses so page does not scroll with up/down keys.

Confirmed AoT compatibility.

References #120.
196b86c
@topherfangio topherfangio referenced this issue Dec 1, 2016
Merged

Add chips keyboard support. #2046

3 of 3 tasks complete
@topherfangio topherfangio added a commit to profoundry-us/material2 that referenced this issue Dec 1, 2016
@topherfangio topherfangio Add chips keyboard support.
Add basic focus/keyboard support for chips.

 - Up/down arrows navigate chips.
 - Clicking a chip properly focuses it for subsequent keyboard
   navigation.
 - More demos.

Confirmed AoT compatibility.

References #120.
1d96636
@topherfangio topherfangio added a commit to profoundry-us/material2 that referenced this issue Dec 1, 2016
@topherfangio topherfangio Add chips keyboard support.
Add basic focus/keyboard support for chips.

 - Up/down arrows navigate chips.
 - Clicking a chip properly focuses it for subsequent keyboard
   navigation.
 - More demos.

Confirmed AoT compatibility.

References #120.
9183484
@topherfangio topherfangio added a commit to profoundry-us/material2 that referenced this issue Dec 8, 2016
@topherfangio @topherfangio topherfangio + topherfangio Add chips keyboard support.
Add basic focus/keyboard support for chips.

 - Up/down arrows navigate chips.
 - Clicking a chip properly focuses it for subsequent keyboard
   navigation.
 - More demos.

Confirmed AoT compatibility.

References #120.
5e304d1
@topherfangio topherfangio added a commit to profoundry-us/material2 that referenced this issue Dec 9, 2016
@topherfangio topherfangio Add chips keyboard support.
Add basic focus/keyboard support for chips.

 - Up/down arrows navigate chips.
 - Clicking a chip properly focuses it for subsequent keyboard
   navigation.
 - More demos.

Confirmed AoT compatibility.

References #120.
4041670
@topherfangio topherfangio added a commit to profoundry-us/material2 that referenced this issue Dec 9, 2016
@topherfangio topherfangio Add chips keyboard support.
Add basic focus/keyboard support for chips.

 - Up/down arrows navigate chips.
 - Clicking a chip properly focuses it for subsequent keyboard
   navigation.
 - More demos.

Confirmed AoT compatibility.

References #120.
b551fa8
@topherfangio topherfangio added a commit to profoundry-us/material2 that referenced this issue Dec 12, 2016
@topherfangio topherfangio feat(chips): Add select and color to chips.
Add new functionality to chips to allow:

 - `[color]` - Programmatically control the selected color of the
   chip.
 - `[selected]` - Programmatically control whether or not the chip
   is selected.
 - `(select)` - Event emitted when the chip is selected.
 - `(deselect)` - Event emitted when the chip is deselected.

Additionally, the SPACE key now selects the currently focused chip.

References #120.
13bd74b
@topherfangio topherfangio added a commit to profoundry-us/material2 that referenced this issue Dec 13, 2016
@topherfangio topherfangio Add chips keyboard support.
Add basic focus/keyboard support for chips.

 - Up/down arrows navigate chips.
 - Clicking a chip properly focuses it for subsequent keyboard
   navigation.
 - More demos.

Confirmed AoT compatibility.

References #120.
7ee819c
@topherfangio topherfangio added a commit to profoundry-us/material2 that referenced this issue Dec 13, 2016
@topherfangio topherfangio Add chips keyboard support.
Add basic focus/keyboard support for chips.

 - Up/down arrows navigate chips.
 - Clicking a chip properly focuses it for subsequent keyboard
   navigation.
 - More demos.

Confirmed AoT compatibility.

References #120.
6ed7552
@topherfangio topherfangio added a commit to profoundry-us/material2 that referenced this issue Dec 13, 2016
@topherfangio topherfangio Add chips keyboard support.
Add basic focus/keyboard support for chips.

 - Up/down arrows navigate chips.
 - Clicking a chip properly focuses it for subsequent keyboard
   navigation.
 - More demos.

Confirmed AoT compatibility.

References #120.
3a58643
@topherfangio topherfangio added a commit to profoundry-us/material2 that referenced this issue Dec 13, 2016
@topherfangio topherfangio Add chips keyboard support.
Add basic focus/keyboard support for chips.

 - Up/down arrows navigate chips.
 - Clicking a chip properly focuses it for subsequent keyboard
   navigation.
 - More demos.

Confirmed AoT compatibility.

References #120.
d0c0d65
@topherfangio topherfangio added a commit to profoundry-us/material2 that referenced this issue Dec 13, 2016
@topherfangio topherfangio Add chips keyboard support.
Add basic focus/keyboard support for chips.

 - Up/down arrows navigate chips.
 - Clicking a chip properly focuses it for subsequent keyboard
   navigation.
 - More demos.

Confirmed AoT compatibility.

References #120.
b138e66
@jelbourn jelbourn added a commit that referenced this issue Dec 14, 2016
@topherfangio @jelbourn topherfangio + jelbourn feat(chips): add keyboard interaction. (#2046)
Add basic focus/keyboard support for chips.

 - Up/down arrows navigate chips.
 - Clicking a chip properly focuses it for subsequent keyboard
   navigation.
 - More demos.

Confirmed AoT compatibility.

References #120.
ba85883
@topherfangio topherfangio added a commit to profoundry-us/material2 that referenced this issue Dec 14, 2016
@topherfangio topherfangio feat(chips): Add (select), [color] and dark theme to chips.
Add new functionality to chips to allow:

 - `[color]` - Programmatically control the selected color of the
   chip.
 - `[selected]` - Programmatically control whether or not the chip
   is selected.
 - `[selectable]` - Programmatically control whether or not the chip
   is capable of being selected.
 - `(select)` - Event emitted when the chip is selected.
 - `(deselect)` - Event emitted when the chip is deselected.
 - The SPACE key will automatically select the currently focused chip
   in a MdChipList.

Additionally, adds basic support for a dark theme using existing colors
from other components in the spec.

References #120.
8b6dc0d
@topherfangio topherfangio added a commit to profoundry-us/material2 that referenced this issue Dec 15, 2016
@topherfangio topherfangio feat(chips): Add (select), [color] and dark theme to chips.
Add new functionality/options to chips for managing selection/color.

*MdChipList Options*

 - `[selectable]` - Programmatically control whether or not the chips
   in the list are capable of being selected.
 - The SPACE key will automatically select the currently focused chip.

*MdChip Options*

 - `[color]` - Programmatically control the selected color of the
   chip.
 - `[selected]` - Programmatically control whether or not the chip
   is selected.
 - `(select)` - Event emitted when the chip is selected.
 - `(deselect)` - Event emitted when the chip is deselected.

Additionally, adds basic support for dark themeed chips using existing
colors from other components in the spec and cleanup demos by using
cards and toolbars like other demos.

References #120.
3561768
@topherfangio topherfangio added a commit to profoundry-us/material2 that referenced this issue Dec 15, 2016
@topherfangio topherfangio feat(chips): Add (select), [color] and dark theme to chips.
Add new functionality/options to chips for managing selection/color.

*MdChipList Options*

 - `[selectable]` - Programmatically control whether or not the chips
   in the list are capable of being selected.
 - The SPACE key will automatically select the currently focused chip.

*MdChip Options*

 - `[color]` - Programmatically control the selected color of the
   chip.
 - `[selected]` - Programmatically control whether or not the chip
   is selected.
 - `(select)` - Event emitted when the chip is selected.
 - `(deselect)` - Event emitted when the chip is deselected.

Additionally, adds basic support for dark themeed chips using existing
colors from other components in the spec and cleanup demos by using
cards and toolbars like other demos.

References #120.
d00d5d9
@topherfangio topherfangio added a commit to profoundry-us/material2 that referenced this issue Dec 18, 2016
@topherfangio topherfangio feat(chips): Add (select), [color] and dark theme to chips.
Add new functionality/options to chips for managing selection/color.

*MdChipList Options*

 - `[selectable]` - Programmatically control whether or not the chips
   in the list are capable of being selected.
 - The SPACE key will automatically select the currently focused chip.

*MdChip Options*

 - `[color]` - Programmatically control the selected color of the
   chip.
 - `[selected]` - Programmatically control whether or not the chip
   is selected.
 - `(select)` - Event emitted when the chip is selected.
 - `(deselect)` - Event emitted when the chip is deselected.

Additionally, adds basic support for dark themeed chips using existing
colors from other components in the spec and cleanup demos by using
cards and toolbars like other demos.

References #120.
994f00d
@topherfangio topherfangio added a commit to profoundry-us/material2 that referenced this issue Dec 18, 2016
@topherfangio topherfangio feat(chips): Add (select), [color] and dark theme to chips.
Add new functionality/options to chips for managing selection/color.

*MdChipList Options*

 - `[selectable]` - Programmatically control whether or not the chips
   in the list are capable of being selected.
 - The SPACE key will automatically select the currently focused chip.

*MdChip Options*

 - `[color]` - Programmatically control the selected color of the
   chip.
 - `[selected]` - Programmatically control whether or not the chip
   is selected.
 - `(select)` - Event emitted when the chip is selected.
 - `(deselect)` - Event emitted when the chip is deselected.

Additionally, adds basic support for dark themeed chips using existing
colors from other components in the spec and cleanup demos by using
cards and toolbars like other demos.

References #120.
7b61ffe
@jelbourn jelbourn added a commit that referenced this issue Dec 20, 2016
@topherfangio @jelbourn topherfangio + jelbourn feat(chips): add (select), [color] and dark theme to chips. (#2242)
Add new functionality/options to chips for managing selection/color.

*MdChipList Options*

 - `[selectable]` - Programmatically control whether or not the chips
   in the list are capable of being selected.
 - The SPACE key will automatically select the currently focused chip.

*MdChip Options*

 - `[color]` - Programmatically control the selected color of the
   chip.
 - `[selected]` - Programmatically control whether or not the chip
   is selected.
 - `(select)` - Event emitted when the chip is selected.
 - `(deselect)` - Event emitted when the chip is deselected.

Additionally, adds basic support for dark themeed chips using existing
colors from other components in the spec and cleanup demos by using
cards and toolbars like other demos.

References #120.
f45c315
@topherfangio topherfangio added a commit to profoundry-us/material2 that referenced this issue Dec 21, 2016
@topherfangio topherfangio feat(chips): Add left/right arrow functionality.
In order to maintain consistentcy with the md1 chips, add the ability
to use the left/right arrow keys to navigate chips.

References #120.
e5ed55d
@jelbourn jelbourn added a commit that referenced this issue Dec 22, 2016
@topherfangio @jelbourn topherfangio + jelbourn feat(chips): Add left/right arrow functionality. (#2332)
In order to maintain consistentcy with the md1 chips, add the ability
to use the left/right arrow keys to navigate chips.

References #120.
3f2db27
@topherfangio topherfangio added a commit to profoundry-us/material2 that referenced this issue Dec 30, 2016
@topherfangio topherfangio feat(chips): Add remove functionality/styling.
Add events, styling and keyboard controls to allow removable chips.

 - Add basic styling for a user-provided remove icon.
 - Add keyboard controls for backspace/delete.
 - Add `(remove)` event which is emitted when the remove icon or
   one of the delete keys is pressed.
 - Add `md-chip-remove` directive which can be applied to `<md-icon>`
   to inform the chip of the remove request.

Additionally, fix some issues with dark theme.

BREAKING CHANGE - The `selectable` property of the `md-chip-list` has
now been moved to `md-chip` to maintain consistency with the new
`removable` option.

If you used the following code,

```html
<md-chip-list [selectable]="selectable">
  <md-chip>My Chip</md-chip>
</md-chip-list>
```

you should switch it to

```html
<md-chip-list>
  <md-chip [selectable]="selectable">My Chip</md-chip>
</md-chip-list>
```

References #120.
8292ac8
@topherfangio topherfangio added a commit to profoundry-us/material2 that referenced this issue Dec 30, 2016
@topherfangio topherfangio feat(chips): Add remove functionality/styling.
Add events, styling and keyboard controls to allow removable chips.

 - Add basic styling for a user-provided remove icon.
 - Add keyboard controls for backspace/delete.
 - Add `(remove)` event which is emitted when the remove icon or
   one of the delete keys is pressed.
 - Add `md-chip-remove` directive which can be applied to `<md-icon>`
   to inform the chip of the remove request.

Additionally, fix some issues with dark theme and add styling/support
for usage inside the `md-input-container`.

BREAKING CHANGE - The `selectable` property of the `md-chip-list` has
now been moved to `md-chip` to maintain consistency with the new
`removable` option.

If you used the following code,

```html
<md-chip-list [selectable]="selectable">
  <md-chip>My Chip</md-chip>
</md-chip-list>
```

you should switch it to

```html
<md-chip-list>
  <md-chip [selectable]="selectable">My Chip</md-chip>
</md-chip-list>
```

References #120.
cb0c355
@topherfangio topherfangio added a commit to profoundry-us/material2 that referenced this issue Dec 30, 2016
@topherfangio topherfangio feat(chips): Add remove functionality/styling.
Add events, styling and keyboard controls to allow removable chips.

 - Add basic styling for a user-provided remove icon.
 - Add keyboard controls for backspace/delete.
 - Add `(remove)` event which is emitted when the remove icon or
   one of the delete keys is pressed.
 - Add `md-chip-remove` directive which can be applied to `<md-icon>`
   (or others) to inform the chip of the remove request.

Additionally, fix some issues with dark theme and add styling/support
for usage inside the `md-input-container`.

BREAKING CHANGE - The `selectable` property of the `md-chip-list` has
now been moved to `md-chip` to maintain consistency with the new
`removable` option.

If you used the following code,

```html
<md-chip-list [selectable]="selectable">
  <md-chip>My Chip</md-chip>
</md-chip-list>
```

you should switch it to

```html
<md-chip-list>
  <md-chip [selectable]="selectable">My Chip</md-chip>
</md-chip-list>
```

References #120.
40ff7d9
@pankajparkar

Any estimates? when this feature is going to roll-out?

@topherfangio topherfangio added a commit to profoundry-us/material2 that referenced this issue Jan 1, 2017
@topherfangio topherfangio feat(chips): Add remove functionality/styling.
Add events, styling and keyboard controls to allow removable chips.

 - Add basic styling for a user-provided remove icon.
 - Add keyboard controls for backspace/delete.
 - Add `(remove)` event which is emitted when the remove icon or
   one of the delete keys is pressed.
 - Add `md-chip-remove` directive which can be applied to `<md-icon>`
   (or others) to inform the chip of the remove request.

Additionally, fix some issues with dark theme and add styling/support
for usage inside the `md-input-container` and add styling for focused
chips.

BREAKING CHANGE - The `selectable` property of the `md-chip-list` has
now been moved to `md-chip` to maintain consistency with the new
`removable` option.

If you used the following code,

```html
<md-chip-list [selectable]="selectable">
  <md-chip>My Chip</md-chip>
</md-chip-list>
```

you should switch it to

```html
<md-chip-list>
  <md-chip [selectable]="selectable">My Chip</md-chip>
</md-chip-list>
```

References #120.

Add basic focus support.
95316e9
@topherfangio
Collaborator

@pankajparkar A basic version of the chips has already launched: https://material.angular.io/components/component/chips

We are continuing to add functionality.

@topherfangio topherfangio added a commit to profoundry-us/material2 that referenced this issue Jan 10, 2017
@topherfangio topherfangio feat(chips): Add remove functionality/styling.
Add events, styling and keyboard controls to allow removable chips.

 - Add basic styling for a user-provided remove icon.
 - Add keyboard controls for backspace/delete.
 - Add `(remove)` event which is emitted when the remove icon or
   one of the delete keys is pressed.
 - Add `md-chip-remove` directive which can be applied to `<md-icon>`
   (or others) to inform the chip of the remove request.

Additionally, fix some issues with dark theme and add styling/support
for usage inside the `md-input-container` and add styling for focused
chips.

BREAKING CHANGE - The `selectable` property of the `md-chip-list` has
now been moved to `md-chip` to maintain consistency with the new
`removable` option.

If you used the following code,

```html
<md-chip-list [selectable]="selectable">
  <md-chip>My Chip</md-chip>
</md-chip-list>
```

you should switch it to

```html
<md-chip-list>
  <md-chip [selectable]="selectable">My Chip</md-chip>
</md-chip-list>
```

References #120.
47f528e
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment