feat(Datatable): make multivalue pills round

securityscorecard · Oct 13, 2023 · 3183c86 · 3183c86
1 parent bf185b2
commit 3183c86
Show file tree

Hide file tree

Showing 52 changed files with 4 additions and 4 deletions.
diff --git a/...s/expected/components_Datatable_internalComponents_Datatable_Minimal Config.png b/...s/expected/components_Datatable_internalComponents_Datatable_Minimal Config.png
diff --git a/...cted/components_Datatable_internalComponents_Datatable_With Applied Columns.png b/...cted/components_Datatable_internalComponents_Datatable_With Applied Columns.png
diff --git a/...ed/components_Datatable_internalComponents_Datatable_With Applied Filtering.png b/...ed/components_Datatable_internalComponents_Datatable_With Applied Filtering.png
diff --git a/...pected/components_Datatable_internalComponents_Datatable_With Batch Actions.png b/...pected/components_Datatable_internalComponents_Datatable_With Batch Actions.png
diff --git a/...s_Datatable_internalComponents_Datatable_With Custom Placeholder For Search.png b/...s_Datatable_internalComponents_Datatable_With Custom Placeholder For Search.png
diff --git a/...omponents_Datatable_internalComponents_Datatable_With Disabled Batch Module.png b/...omponents_Datatable_internalComponents_Datatable_With Disabled Batch Module.png
diff --git a/...ted/components_Datatable_internalComponents_Datatable_With Disabled Columns.png b/...ted/components_Datatable_internalComponents_Datatable_With Disabled Columns.png
diff --git a/...able_internalComponents_Datatable_With Disabled Controls And Active Columns.png b/...able_internalComponents_Datatable_With Disabled Controls And Active Columns.png
diff --git a/...ble_internalComponents_Datatable_With Disabled Controls And Applied Columns.png b/...ble_internalComponents_Datatable_With Disabled Controls And Applied Columns.png
diff --git a/...s_Datatable_internalComponents_Datatable_With Disabled Controls And Columns.png b/...s_Datatable_internalComponents_Datatable_With Disabled Controls And Columns.png
diff --git a/...ed/components_Datatable_internalComponents_Datatable_With Disabled Controls.png b/...ed/components_Datatable_internalComponents_Datatable_With Disabled Controls.png
diff --git a/...d/components_Datatable_internalComponents_Datatable_With Disabled Filtering.png b/...d/components_Datatable_internalComponents_Datatable_With Disabled Filtering.png
diff --git a/...cted/components_Datatable_internalComponents_Datatable_With Disabled Search.png b/...cted/components_Datatable_internalComponents_Datatable_With Disabled Search.png
diff --git a/...d/components_Datatable_internalComponents_Datatable_With Disabled Selection.png b/...d/components_Datatable_internalComponents_Datatable_With Disabled Selection.png
diff --git a/...onents_Datatable_internalComponents_Datatable_With Open And Applied Columns.png b/...onents_Datatable_internalComponents_Datatable_With Open And Applied Columns.png
diff --git a/...ents_Datatable_internalComponents_Datatable_With Open And Applied Filtering.png b/...ents_Datatable_internalComponents_Datatable_With Open And Applied Filtering.png
diff --git a/...xpected/components_Datatable_internalComponents_Datatable_With Open Columns.png b/...xpected/components_Datatable_internalComponents_Datatable_With Open Columns.png
diff --git a/...ected/components_Datatable_internalComponents_Datatable_With Open Filtering.png b/...ected/components_Datatable_internalComponents_Datatable_With Open Filtering.png
diff --git a/...tatable_internalComponents_Datatable_With Selected Rows And Exclusion Logic.png b/...tatable_internalComponents_Datatable_With Selected Rows And Exclusion Logic.png
diff --git a/...pected/components_Datatable_internalComponents_Datatable_With Selected Rows.png b/...pected/components_Datatable_internalComponents_Datatable_With Selected Rows.png
diff --git a/...expected/components_Datatable_internalComponents_Datatable_With Single Page.png b/...expected/components_Datatable_internalComponents_Datatable_With Single Page.png
diff --git a/...tatable_internalComponents_Datatable_With Single Selection And Selected Row.png b/...tatable_internalComponents_Datatable_With Single Selection And Selected Row.png
diff --git a/...ted/components_Datatable_internalComponents_Datatable_With Single Selection.png b/...ted/components_Datatable_internalComponents_Datatable_With Single Selection.png
diff --git a/...ternalComponents_Table_Data Is Loading With Previous Data And Is Cancelable.png b/...ternalComponents_Table_Data Is Loading With Previous Data And Is Cancelable.png
diff --git a/...nents_Datatable_internalComponents_Table_Data Is Loading With Previous Data.png b/...nents_Datatable_internalComponents_Table_Data Is Loading With Previous Data.png
diff --git a/...shots/expected/components_Datatable_internalComponents_Table_Minimal Config.png b/...shots/expected/components_Datatable_internalComponents_Table_Minimal Config.png
diff --git a/...snapshots/expected/components_Datatable_internalComponents_Table_Playground.png b/...snapshots/expected/components_Datatable_internalComponents_Table_Playground.png
diff --git a/...xpected/components_Datatable_internalComponents_Table_With Custom Page Size.png b/...xpected/components_Datatable_internalComponents_Table_With Custom Page Size.png
diff --git a/...ected/components_Datatable_internalComponents_Table_With Disabled Selection.png b/...ected/components_Datatable_internalComponents_Table_With Disabled Selection.png
diff --git a/...cted/components_Datatable_internalComponents_Table_With Exclusive Selection.png b/...cted/components_Datatable_internalComponents_Table_With Exclusive Selection.png
diff --git a/...ots/expected/components_Datatable_internalComponents_Table_With Row Actions.png b/...ots/expected/components_Datatable_internalComponents_Table_With Row Actions.png
diff --git a/...s/expected/components_Datatable_internalComponents_Table_With Selected Rows.png b/...s/expected/components_Datatable_internalComponents_Table_With Selected Rows.png
diff --git a/...ots/expected/components_Datatable_internalComponents_Table_With Single Page.png b/...ots/expected/components_Datatable_internalComponents_Table_With Single Page.png
diff --git a/...s_Datatable_internalComponents_Table_With Single Selection And Selected Row.png b/...s_Datatable_internalComponents_Table_With Single Selection And Selected Row.png
diff --git a/...xpected/components_Datatable_internalComponents_Table_With Single Selection.png b/...xpected/components_Datatable_internalComponents_Table_With Single Selection.png
diff --git a/...s/expected/components_Datatable_internalComponents_Table_With Sorted Column.png b/...s/expected/components_Datatable_internalComponents_Table_With Sorted Column.png
diff --git a/...hots/expected/components_Datatable_internalComponents_Table_Without Sorting.png b/...hots/expected/components_Datatable_internalComponents_Table_Without Sorting.png
diff --git a/...Datatable_internalComponents_Table_renderers_Multi Value With Absolute Link.png b/...Datatable_internalComponents_Table_renderers_Multi Value With Absolute Link.png
diff --git a/...atable_internalComponents_Table_renderers_Multi Value With Custom Formatter.png b/...atable_internalComponents_Table_renderers_Multi Value With Custom Formatter.png
diff --git a/..._internalComponents_Table_renderers_Multi Value With Disabled Display Limit.png b/..._internalComponents_Table_renderers_Multi Value With Disabled Display Limit.png
diff --git a/...ents_Datatable_internalComponents_Table_renderers_Multi Value With On Click.png b/...ents_Datatable_internalComponents_Table_renderers_Multi Value With On Click.png
diff --git a/...Datatable_internalComponents_Table_renderers_Multi Value With Relative Link.png b/...Datatable_internalComponents_Table_renderers_Multi Value With Relative Link.png
diff --git a/...nents_Datatable_internalComponents_Table_renderers_Multi Value With Tooltip.png b/...nents_Datatable_internalComponents_Table_renderers_Multi Value With Tooltip.png
diff --git a/...xpected/components_Datatable_internalComponents_Table_renderers_Multi Value.png b/...xpected/components_Datatable_internalComponents_Table_renderers_Multi Value.png
diff --git a/.storybook/image-snapshots/expected/components_Table_Minimal Config.png b/.storybook/image-snapshots/expected/components_Table_Minimal Config.png
diff --git a/.storybook/image-snapshots/expected/components_Table_With Custom Page Size.png b/.storybook/image-snapshots/expected/components_Table_With Custom Page Size.png
diff --git a/.storybook/image-snapshots/expected/components_Table_With Row Actions.png b/.storybook/image-snapshots/expected/components_Table_With Row Actions.png
diff --git a/.storybook/image-snapshots/expected/components_Table_With Single Page.png b/.storybook/image-snapshots/expected/components_Table_With Single Page.png
diff --git a/.storybook/image-snapshots/expected/components_Table_With Sorted Column.png b/.storybook/image-snapshots/expected/components_Table_With Sorted Column.png
diff --git a/.storybook/image-snapshots/expected/components_Table_Without Sorting.png b/.storybook/image-snapshots/expected/components_Table_Without Sorting.png
diff --git a/src/components/Pill/PillWrapper.tsx b/src/components/Pill/PillWrapper.tsx
@@ -3,7 +3,7 @@ import styled, { css } from 'styled-components';
 import PropTypes from 'prop-types';
 
 import { SpaceSizes } from '../../theme';
-import { getRadii, pxToRem } from '../../utils';
+import { getRadii, getSpace } from '../../utils';
 import { Inline, Padbox } from '../layout';
 import { PaddingTypes } from '../layout/Padbox/Padbox.enums';
 import { PillColors, PillColorsEnums } from './Pill.enums';
@@ -28,8 +28,8 @@ const StyledPillWrapper = styled(Padbox)<StyledPillWrapperProps>`
         outline: none;
       }
     `}
-  padding-right: ${pxToRem(8)};
-  padding-left: ${pxToRem(8)};
+  padding-right: ${getSpace('sm')};
+  padding-left: ${getSpace('sm')};
 `;
 
 const PillWrapper: React.FC<PillWrapperProps> = ({

diff --git a/src/components/_internal/BaseTable/BaseTable.styles.tsx b/src/components/_internal/BaseTable/BaseTable.styles.tsx
@@ -138,7 +138,7 @@ export const StyledBaseTable = styled.table.attrs({ $color: 'primary' })`
         align-items: center;
         padding: ${pxToRem(0, 8)};
         background: ${getColor('neutral.200')};
-        border-radius: ${getRadii('default')};
+        border-radius: ${getRadii('round')};
         white-space: nowrap;
         margin: ${pxToRem(2)};