Skip to content

Commit

Permalink
feat: tag cell in data-grid extended
Browse files Browse the repository at this point in the history
  • Loading branch information
tshimber committed Aug 27, 2024
1 parent c8ba489 commit f10ad35
Show file tree
Hide file tree
Showing 3 changed files with 12 additions and 4 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -33,7 +33,11 @@ export const TagsCell: Cell = {
<ul class={`tbody__tag-list`}>
{tags.map((tag) => (
<li>
<scale-tag size="small" type="strong" color={tag.color}>
<scale-tag
size={tag.size || 'small'}
type={tag.type || 'strong'}
color={tag.color || 'standard'}
>
{tag.content}
</scale-tag>
</li>
Expand Down
6 changes: 5 additions & 1 deletion packages/components/src/html/data-grid.html
Original file line number Diff line number Diff line change
Expand Up @@ -212,7 +212,11 @@
'One',
'Lorem ipsum dolor sit amet sime',
'http://example.com',
'Simple, Short',
[
{ content: 'Apple', color: 'red', size: 'standard' },
{ content: 'Pear', color: 'green', type: 'strong' },
{ content: 'Bug' },
],
'00:00:20',
102045.0,
false,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -42,7 +42,7 @@ import ScaleDataGrid from './ScaleDataGrid.vue';
},
description: `(optional) Title for sortable columns`,
control: { type: null },
},
},
height: {
table: {
type: { summary: 'string' },
Expand Down Expand Up @@ -669,7 +669,7 @@ Expected format: string

## Tags Cell

Expected format: comma delimited `string`, eg `'one, two, three'` or array of objects with content and color keys, e.g. `{content: 'Apple', color: 'red'}`
Expected format: comma delimited `string`, eg `'one, two, three'` or array of objects with required content key and optional color, type, size keys, e.g. `{content: 'Apple', color: 'red'}`. Acceptable values for color, type, size are same as for Tag component.

<Canvas withSource="close">
<Story name="Tags Cell">
Expand Down

0 comments on commit f10ad35

Please sign in to comment.