fix(Chip)!: rename prop 'label' to 'tile'

rotki · Dec 14, 2023 · 8fb4d94 · 8fb4d94
1 parent cda5438
commit 8fb4d94
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 19 deletions.
diff --git a/example/src/views/ChipView.vue b/example/src/views/ChipView.vue
@@ -119,90 +119,90 @@ const chips = ref<ChipProps[]>([
     color: 'primary',
     variant: 'filled',
     closeable: false,
-    label: true,
+    tile: true,
   },
   {
     disabled: false,
     color: 'secondary',
     variant: 'filled',
     closeable: false,
-    label: true,
+    tile: true,
   },
   {
     disabled: false,
     color: 'error',
     variant: 'filled',
     closeable: false,
-    label: true,
+    tile: true,
   },
   {
     disabled: false,
     color: 'warning',
     variant: 'filled',
     closeable: false,
-    label: true,
+    tile: true,
   },
   {
     disabled: false,
     color: 'info',
     variant: 'filled',
     closeable: false,
-    label: true,
+    tile: true,
   },
   {
     disabled: false,
     color: 'success',
     variant: 'filled',
     closeable: false,
-    label: true,
+    tile: true,
   },
 
   {
     disabled: false,
     color: 'primary',
     variant: 'filled',
     closeable: false,
-    label: true,
+    tile: true,
     clickable: true,
   },
   {
     disabled: false,
     color: 'secondary',
     variant: 'filled',
     closeable: false,
-    label: true,
+    tile: true,
     clickable: true,
   },
   {
     disabled: false,
     color: 'error',
     variant: 'filled',
     closeable: false,
-    label: true,
+    tile: true,
     clickable: true,
   },
   {
     disabled: false,
     color: 'warning',
     variant: 'filled',
     closeable: false,
-    label: true,
+    tile: true,
     clickable: true,
   },
   {
     disabled: false,
     color: 'info',
     variant: 'filled',
     closeable: false,
-    label: true,
+    tile: true,
     clickable: true,
   },
   {
     disabled: false,
     color: 'success',
     variant: 'filled',
     closeable: false,
-    label: true,
+    tile: true,
     clickable: true,
   },
   {

diff --git a/src/components/chips/Chip.stories.ts b/src/components/chips/Chip.stories.ts
@@ -31,7 +31,7 @@ const meta: Meta<Props> = {
   tags: ['autodocs'],
   render,
   argTypes: {
-    label: { control: 'boolean' },
+    tile: { control: 'boolean' },
     children: { control: 'string' },
     prepend: { control: 'text' },
     clickable: { control: 'boolean' },
@@ -72,10 +72,10 @@ export const Default: Story = {
   },
 };
 
-export const Label: Story = {
+export const Tile: Story = {
   args: {
     children: 'Chip',
-    label: true,
+    tile: true,
     variant: 'filled',
     closeable: false,
     disabled: false,

diff --git a/src/components/chips/Chip.vue b/src/components/chips/Chip.vue
@@ -6,7 +6,7 @@ import Icon from '@/components/icons/Icon.vue';
 import { type RuiIcons } from '~/src';
 
 export interface Props {
-  label?: boolean;
+  tile?: boolean;
   clickable?: boolean;
   closeable?: boolean;
   disabled?: boolean;
@@ -23,7 +23,7 @@ defineOptions({
 });
 
 const props = withDefaults(defineProps<Props>(), {
-  label: false,
+  tile: false,
   size: 'md',
   color: 'grey',
   clickable: false,
@@ -76,7 +76,7 @@ const style: ComputedRef<Partial<CSSStyleDeclaration>> = computed(() => {
       css[variant ?? ''],
       {
         [css.disabled]: disabled,
-        [css.label]: label,
+        [css.tile]: tile,
         [css.readonly]: !clickable,
       },
     ]"
@@ -119,7 +119,7 @@ const style: ComputedRef<Partial<CSSStyleDeclaration>> = computed(() => {
   @apply inline-flex items-center justify-between rounded-full px-1.5 py-[0.25rem] transition-all cursor-default;
   @apply max-w-full truncate;
 
-  &.label {
+  &.tile {
     @apply rounded-sm;
   }