@conveyorhq/arrow-ds 1.148.0 → 1.150.0

package/package.json

@@ -2,7 +2,7 @@
   "name": "@conveyorhq/arrow-ds",
   "author": "Conveyor",
   "license": "MIT",
-  "version": "1.148.0",
+  "version": "1.150.0",
   "description": "Arrow Design System",
   "repository": "https://github.com/conveyor/arrow-ds",
   "publishConfig": {

package/public/components/Drawer/Drawer.d.ts

@@ -8,16 +8,22 @@ type ScrollableSlotRenderFunction = (props: {
 }) => React.ReactNode;
 export interface WithDrawerProps {
     drawerSlot: React.ReactNode;
+    drawerSlotClassName?: string;
     onClose: () => void;
     isOpen?: boolean;
     fixedSlotTop?: React.ReactNode;
+    fixedSlotTopClassName?: string;
     fixedSlotBottom?: React.ReactNode;
+    fixedSlotBottomClassName?: string;
     scrollableSlot?: ScrollableSlotRenderFunction | React.ReactNode;
+    scrollableSlotClassName?: string;
     drawerSide?: "left" | "right";
     noAnimation?: boolean;
     drawerWidth?: number;
+    className?: string;
+    contentClassName?: string;
 }
-export declare const WithDrawer: ({ drawerSlot, onClose, isOpen, fixedSlotTop, fixedSlotBottom, scrollableSlot, drawerSide, noAnimation, drawerWidth, }: WithDrawerProps) => React.JSX.Element;
+export declare const WithDrawer: ({ drawerSlot, drawerSlotClassName, onClose, isOpen, fixedSlotTop, fixedSlotTopClassName, fixedSlotBottom, fixedSlotBottomClassName, scrollableSlot, scrollableSlotClassName, drawerSide, noAnimation, drawerWidth, className, contentClassName, }: WithDrawerProps) => React.JSX.Element;
 export interface DrawerProps extends BoxProps {
     headingSlot: React.ReactNode;
     footerSlot?: React.ReactNode;

package/public/components/Drawer/Drawer.js

@@ -47,7 +47,7 @@ const calculateTransformValue = (isOpen, drawerOnRight, drawerWidth) => {
     }
     return drawerOnRight ? translateZero : translateNegWidth;
 };
-const WithDrawer = ({ drawerSlot, onClose, isOpen = false, fixedSlotTop, fixedSlotBottom, scrollableSlot, drawerSide = "left", noAnimation = false, drawerWidth = DEFAULT_DRAWER_WIDTH, }) => {
+const WithDrawer = ({ drawerSlot, drawerSlotClassName, onClose, isOpen = false, fixedSlotTop, fixedSlotTopClassName, fixedSlotBottom, fixedSlotBottomClassName, scrollableSlot, scrollableSlotClassName, drawerSide = "left", noAnimation = false, drawerWidth = DEFAULT_DRAWER_WIDTH, className, contentClassName, }) => {
     const drawerOnRight = drawerSide === "right";
     const [isClosedAtRest, setIsClosedAtRest] = (0, react_1.useState)(false);
     const [isAnimationComplete, setIsAnimationComplete] = (0, react_1.useState)(false);
@@ -96,22 +96,22 @@ const WithDrawer = ({ drawerSlot, onClose, isOpen = false, fixedSlotTop, fixedSl
         } },
         react_1.default.createElement(Box_1.Box, { className: (0, classnames_1.default)(cn(), {
                 [cn({ m: "isOpen" })]: isOpen,
-            }) },
-            react_1.default.createElement(web_1.animated.div, { className: (0, classnames_1.default)(cn({ e: "wrapper" }), { drawerOnRight }), style: wrapperCombinedStyle }, drawerSlot),
+            }, className) },
+            react_1.default.createElement(web_1.animated.div, { className: (0, classnames_1.default)(cn({ e: "wrapper" }), { drawerOnRight }, drawerSlotClassName), style: wrapperCombinedStyle }, drawerSlot),
             react_1.default.createElement(Flex_1.Flex, { className: (0, classnames_1.default)(cn({ e: "onScreenContent" }), {
                     drawerOnRight,
-                }) },
-                fixedSlotTop && (react_1.default.createElement(web_1.animated.div, { style: { paddingLeft, paddingRight }, className: cn({ e: "fixedSlot" }) }, fixedSlotTop)),
+                }, contentClassName) },
+                fixedSlotTop && (react_1.default.createElement(web_1.animated.div, { style: { paddingLeft, paddingRight }, className: (0, classnames_1.default)(cn({ e: "fixedSlot" }), fixedSlotTopClassName) }, fixedSlotTop)),
                 scrollableSlot && (react_1.default.createElement(web_1.animated.div, { style: {
                         transform: transformReverse,
                         width: scrollableSlotPaddingToInterpolate.interpolate((w) => `calc(100% - ${w}px)`),
-                    }, className: cn({ e: "scrollableSlot" }) }, typeof scrollableSlot === "function"
+                    }, className: (0, classnames_1.default)(cn({ e: "scrollableSlot" }), scrollableSlotClassName) }, typeof scrollableSlot === "function"
                     ? scrollableSlot({
                         isOpen,
                         isAnimationComplete,
                     })
                     : scrollableSlot)),
-                fixedSlotBottom && (react_1.default.createElement(web_1.animated.div, { style: { paddingLeft, paddingRight }, className: cn({ e: "fixedSlot" }) }, fixedSlotBottom))))));
+                fixedSlotBottom && (react_1.default.createElement(web_1.animated.div, { style: { paddingLeft, paddingRight }, className: (0, classnames_1.default)(cn({ e: "fixedSlot" }), fixedSlotBottomClassName) }, fixedSlotBottom))))));
 };
 exports.WithDrawer = WithDrawer;
 const DrawerContent = ({ children, className, ...rest }) => {

package/public/components/Icon/Icon.d.ts

@@ -40,6 +40,7 @@ export declare enum ICON_TYPE {
     BIRTHDAY_CAKE = "birthday-cake",
     BOLT = "bolt",
     BOOK = "book",
+    BROOM = "broom",
     BUG = "bug",
     BULLHORN = "bullhorn",
     CALENDAR = "calendar",
@@ -161,6 +162,7 @@ export declare enum ICON_TYPE {
     SIGNAL = "signal",
     SIGNATURE = "signature",
     SITEMAP = "sitemap",
+    SKULL = "skull",
     SLIDERS_H = "sliders-h",
     SORT = "sort",
     SORT_DOWN = "sort-down",

package/public/components/Icon/Icon.js

@@ -64,6 +64,7 @@ const faBiohazard_1 = require("@fortawesome/free-solid-svg-icons/faBiohazard");
 const faBirthdayCake_1 = require("@fortawesome/free-solid-svg-icons/faBirthdayCake");
 const faBolt_1 = require("@fortawesome/free-solid-svg-icons/faBolt");
 const faBook_1 = require("@fortawesome/free-solid-svg-icons/faBook");
+const faBroom_1 = require("@fortawesome/free-solid-svg-icons/faBroom");
 const faBug_1 = require("@fortawesome/free-solid-svg-icons/faBug");
 const faBullhorn_1 = require("@fortawesome/free-solid-svg-icons/faBullhorn");
 const faCalculator_1 = require("@fortawesome/free-solid-svg-icons/faCalculator");
@@ -186,6 +187,7 @@ const faSignal_1 = require("@fortawesome/free-solid-svg-icons/faSignal");
 const faSignature_1 = require("@fortawesome/free-solid-svg-icons/faSignature");
 const faSignOutAlt_1 = require("@fortawesome/free-solid-svg-icons/faSignOutAlt");
 const faSitemap_1 = require("@fortawesome/free-solid-svg-icons/faSitemap");
+const faSkull_1 = require("@fortawesome/free-solid-svg-icons/faSkull");
 const faSlidersH_1 = require("@fortawesome/free-solid-svg-icons/faSlidersH");
 const faSort_1 = require("@fortawesome/free-solid-svg-icons/faSort");
 const faSortDown_1 = require("@fortawesome/free-solid-svg-icons/faSortDown");
@@ -226,7 +228,7 @@ const types_1 = require("../../types");
 const utilities_1 = require("../../utilities");
 const ShieldCheck_1 = require("./svg/ShieldCheck");
 const cn = (0, utilities_1.bemHOF)("Icon");
-fontawesome_svg_core_1.library.add(faArchive_1.faArchive, faArrowDown_1.faArrowDown, faArrowLeft_1.faArrowLeft, faArrowRight_1.faArrowRight, faArrowsAlt_1.faArrowsAlt, faArrowUp_1.faArrowUp, faBackward_1.faBackward, faBalanceScale_1.faBalanceScale, faBan_1.faBan, faBandAid_1.faBandAid, faBars_1.faBars, faBatteryHalf_1.faBatteryHalf, faBed_1.faBed, faBell_1.faBell, faBell_2.faBell, faBellSlash_1.faBellSlash, faBellSlash_2.faBellSlash, faBiohazard_1.faBiohazard, faBirthdayCake_1.faBirthdayCake, faBolt_1.faBolt, faBook_1.faBook, faBug_1.faBug, faBullhorn_1.faBullhorn, faCalculator_1.faCalculator, faCalendar_1.faCalendar, faCamera_1.faCamera, faCaretDown_1.faCaretDown, faCaretLeft_1.faCaretLeft, faCaretRight_1.faCaretRight, faCaretUp_1.faCaretUp, faChartBar_1.faChartBar, faChartLine_1.faChartLine, faCheck_1.faCheck, faCheckCircle_2.faCheckCircle, faCheckCircle_1.faCheckCircle, faCheckSquare_1.faCheckSquare, faChevronDown_1.faChevronDown, faChevronLeft_1.faChevronLeft, faChevronRight_1.faChevronRight, faChevronUp_1.faChevronUp, faCircle_2.faCircle, faCircleNotch_1.faCircleNotch, faCircle_1.faCircle, faClipboard_1.faClipboard, faClock_1.faClock, faClock_2.faClock, faCloudDownloadAlt_1.faCloudDownloadAlt, faCloudShowersHeavy_1.faCloudShowersHeavy, faCloudUploadAlt_1.faCloudUploadAlt, faCog_1.faCog, faCoins_1.faCoins, faColumns_1.faColumns, faCommentAlt_1.faCommentAlt, faCompass_1.faCompass, faCompress_1.faCompress, faCompressArrowsAlt_1.faCompressArrowsAlt, faCopy_1.faCopy, faCrosshairs_1.faCrosshairs, faCrown_1.faCrown, faDoorClosed_1.faDoorClosed, faEdit_1.faEdit, faEllipsisH_1.faEllipsisH, faEllipsisV_1.faEllipsisV, faEnvelope_2.faEnvelope, faEnvelope_1.faEnvelope, faEraser_1.faEraser, faExchangeAlt_1.faExchangeAlt, faExclamation_1.faExclamation, faExclamationCircle_1.faExclamationCircle, faExclamationTriangle_1.faExclamationTriangle, faExpand_1.faExpand, faExpandArrowsAlt_1.faExpandArrowsAlt, faExternalLinkAlt_1.faExternalLinkAlt, faExternalLinkSquareAlt_1.faExternalLinkSquareAlt, faEye_1.faEye, faEyeSlash_1.faEyeSlash, faFastBackward_1.faFastBackward, faFastForward_1.faFastForward, faFile_1.faFile, faFileAlt_1.faFileAlt, faFileAlt_2.faFileAlt, faFileImport_1.faFileImport, faFileSignature_1.faFileSignature, faFillDrip_1.faFillDrip, faFilter_1.faFilter, faFlag_1.faFlag, faFolder_1.faFolder, faForward_1.faForward, faGlobeEurope_1.faGlobeEurope, faGripLines_1.faGripLines, faGripLinesVertical_1.faGripLinesVertical, faHandshake_1.faHandshake, faHashtag_1.faHashtag, faHeartBroken_1.faHeartBroken, faHighlighter_1.faHighlighter, faHistory_1.faHistory, faIdBadge_1.faIdBadge, faImage_1.faImage, faInfoCircle_1.faInfoCircle, faKey_1.faKey, faKeyboard_1.faKeyboard, faLaptop_1.faLaptop, faLayerGroup_1.faLayerGroup, faLevelUpAlt_1.faLevelUpAlt, faLifeRing_1.faLifeRing, faLink_1.faLink, faListOl_1.faListOl, faListUl_1.faListUl, faLock_1.faLock, faLongArrowAltRight_1.faLongArrowAltRight, faMagic_1.faMagic, faMapMarkerAlt_1.faMapMarkerAlt, faMapSigns_1.faMapSigns, faMeteor_1.faMeteor, faMinus_1.faMinus, faMoneyCheckAlt_1.faMoneyCheckAlt, faMousePointer_1.faMousePointer, faPalette_1.faPalette, faPaperclip_1.faPaperclip, faPaperPlane_1.faPaperPlane, faPaste_1.faPaste, faPause_1.faPause, faPen_1.faPen, faPencilRuler_1.faPencilRuler, faPlay_1.faPlay, faPlug_1.faPlug, faPlus_1.faPlus, faPlusCircle_1.faPlusCircle, faPooStorm_1.faPooStorm, faQuestion_1.faQuestion, faQuestionCircle_2.faQuestionCircle, faQuestionCircle_1.faQuestionCircle, faRandom_1.faRandom, faRedo_1.faRedo, faReply_1.faReply, faRobot_1.faRobot, faRocket_1.faRocket, faSave_1.faSave, faScroll_1.faScroll, faSearch_1.faSearch, faSearchPlus_1.faSearchPlus, faSeedling_1.faSeedling, faServer_1.faServer, faShare_1.faShare, faShareAlt_1.faShareAlt, faShieldAlt_1.faShieldAlt, faSignal_1.faSignal, faSignature_1.faSignature, faSignOutAlt_1.faSignOutAlt, faSitemap_1.faSitemap, faSlidersH_1.faSlidersH, faSort_1.faSort, faSortDown_1.faSortDown, faSortUp_1.faSortUp, faSpinner_1.faSpinner, faSquare_1.faSquare, faStamp_1.faStamp, faStar_1.faStar, faStar_2.faStar, faSuitcaseRolling_1.faSuitcaseRolling, faSync_1.faSync, faTable_1.faTable, faTasks_1.faTasks, faThLarge_1.faThLarge, faThumbsDown_1.faThumbsDown, faThumbsDown_2.faThumbsDown, faThumbsUp_1.faThumbsUp, faThumbsUp_2.faThumbsUp, faTicketAlt_1.faTicketAlt, faTimes_1.faTimes, faTimesCircle_1.faTimesCircle, faTimesCircle_2.faTimesCircle, faTools_1.faTools, faTrash_1.faTrash, faUndo_1.faUndo, faUnlink_1.faUnlink, faUnlock_1.faUnlock, faUser_2.faUser, faUserAstronaut_1.faUserAstronaut, faUserFriends_1.faUserFriends, faUserLock_1.faUserLock, faUserPlus_1.faUserPlus, faUser_1.faUser, faUsers_1.faUsers, faUserSecret_1.faUserSecret, faUserShield_1.faUserShield, faVial_1.faVial, faWrench_1.faWrench, faAward_1.faAward);
+fontawesome_svg_core_1.library.add(faArchive_1.faArchive, faArrowDown_1.faArrowDown, faArrowLeft_1.faArrowLeft, faArrowRight_1.faArrowRight, faArrowsAlt_1.faArrowsAlt, faArrowUp_1.faArrowUp, faBackward_1.faBackward, faBalanceScale_1.faBalanceScale, faBan_1.faBan, faBandAid_1.faBandAid, faBars_1.faBars, faBatteryHalf_1.faBatteryHalf, faBed_1.faBed, faBell_1.faBell, faBell_2.faBell, faBellSlash_1.faBellSlash, faBellSlash_2.faBellSlash, faBiohazard_1.faBiohazard, faBirthdayCake_1.faBirthdayCake, faBolt_1.faBolt, faBook_1.faBook, faBroom_1.faBroom, faBug_1.faBug, faBullhorn_1.faBullhorn, faCalculator_1.faCalculator, faCalendar_1.faCalendar, faCamera_1.faCamera, faCaretDown_1.faCaretDown, faCaretLeft_1.faCaretLeft, faCaretRight_1.faCaretRight, faCaretUp_1.faCaretUp, faChartBar_1.faChartBar, faChartLine_1.faChartLine, faCheck_1.faCheck, faCheckCircle_2.faCheckCircle, faCheckCircle_1.faCheckCircle, faCheckSquare_1.faCheckSquare, faChevronDown_1.faChevronDown, faChevronLeft_1.faChevronLeft, faChevronRight_1.faChevronRight, faChevronUp_1.faChevronUp, faCircle_2.faCircle, faCircleNotch_1.faCircleNotch, faCircle_1.faCircle, faClipboard_1.faClipboard, faClock_1.faClock, faClock_2.faClock, faCloudDownloadAlt_1.faCloudDownloadAlt, faCloudShowersHeavy_1.faCloudShowersHeavy, faCloudUploadAlt_1.faCloudUploadAlt, faCog_1.faCog, faCoins_1.faCoins, faColumns_1.faColumns, faCommentAlt_1.faCommentAlt, faCompass_1.faCompass, faCompress_1.faCompress, faCompressArrowsAlt_1.faCompressArrowsAlt, faCopy_1.faCopy, faCrosshairs_1.faCrosshairs, faCrown_1.faCrown, faDoorClosed_1.faDoorClosed, faEdit_1.faEdit, faEllipsisH_1.faEllipsisH, faEllipsisV_1.faEllipsisV, faEnvelope_2.faEnvelope, faEnvelope_1.faEnvelope, faEraser_1.faEraser, faExchangeAlt_1.faExchangeAlt, faExclamation_1.faExclamation, faExclamationCircle_1.faExclamationCircle, faExclamationTriangle_1.faExclamationTriangle, faExpand_1.faExpand, faExpandArrowsAlt_1.faExpandArrowsAlt, faExternalLinkAlt_1.faExternalLinkAlt, faExternalLinkSquareAlt_1.faExternalLinkSquareAlt, faEye_1.faEye, faEyeSlash_1.faEyeSlash, faFastBackward_1.faFastBackward, faFastForward_1.faFastForward, faFile_1.faFile, faFileAlt_1.faFileAlt, faFileAlt_2.faFileAlt, faFileImport_1.faFileImport, faFileSignature_1.faFileSignature, faFillDrip_1.faFillDrip, faFilter_1.faFilter, faFlag_1.faFlag, faFolder_1.faFolder, faForward_1.faForward, faGlobeEurope_1.faGlobeEurope, faGripLines_1.faGripLines, faGripLinesVertical_1.faGripLinesVertical, faHandshake_1.faHandshake, faHashtag_1.faHashtag, faHeartBroken_1.faHeartBroken, faHighlighter_1.faHighlighter, faHistory_1.faHistory, faIdBadge_1.faIdBadge, faImage_1.faImage, faInfoCircle_1.faInfoCircle, faKey_1.faKey, faKeyboard_1.faKeyboard, faLaptop_1.faLaptop, faLayerGroup_1.faLayerGroup, faLevelUpAlt_1.faLevelUpAlt, faLifeRing_1.faLifeRing, faLink_1.faLink, faListOl_1.faListOl, faListUl_1.faListUl, faLock_1.faLock, faLongArrowAltRight_1.faLongArrowAltRight, faMagic_1.faMagic, faMapMarkerAlt_1.faMapMarkerAlt, faMapSigns_1.faMapSigns, faMeteor_1.faMeteor, faMinus_1.faMinus, faMoneyCheckAlt_1.faMoneyCheckAlt, faMousePointer_1.faMousePointer, faPalette_1.faPalette, faPaperclip_1.faPaperclip, faPaperPlane_1.faPaperPlane, faPaste_1.faPaste, faPause_1.faPause, faPen_1.faPen, faPencilRuler_1.faPencilRuler, faPlay_1.faPlay, faPlug_1.faPlug, faPlus_1.faPlus, faPlusCircle_1.faPlusCircle, faPooStorm_1.faPooStorm, faQuestion_1.faQuestion, faQuestionCircle_2.faQuestionCircle, faQuestionCircle_1.faQuestionCircle, faRandom_1.faRandom, faRedo_1.faRedo, faReply_1.faReply, faRobot_1.faRobot, faRocket_1.faRocket, faSave_1.faSave, faScroll_1.faScroll, faSearch_1.faSearch, faSearchPlus_1.faSearchPlus, faSeedling_1.faSeedling, faServer_1.faServer, faShare_1.faShare, faShareAlt_1.faShareAlt, faShieldAlt_1.faShieldAlt, faSignal_1.faSignal, faSignature_1.faSignature, faSignOutAlt_1.faSignOutAlt, faSitemap_1.faSitemap, faSkull_1.faSkull, faSlidersH_1.faSlidersH, faSort_1.faSort, faSortDown_1.faSortDown, faSortUp_1.faSortUp, faSpinner_1.faSpinner, faSquare_1.faSquare, faStamp_1.faStamp, faStar_1.faStar, faStar_2.faStar, faSuitcaseRolling_1.faSuitcaseRolling, faSync_1.faSync, faTable_1.faTable, faTasks_1.faTasks, faThLarge_1.faThLarge, faThumbsDown_1.faThumbsDown, faThumbsDown_2.faThumbsDown, faThumbsUp_1.faThumbsUp, faThumbsUp_2.faThumbsUp, faTicketAlt_1.faTicketAlt, faTimes_1.faTimes, faTimesCircle_1.faTimesCircle, faTimesCircle_2.faTimesCircle, faTools_1.faTools, faTrash_1.faTrash, faUndo_1.faUndo, faUnlink_1.faUnlink, faUnlock_1.faUnlock, faUser_2.faUser, faUserAstronaut_1.faUserAstronaut, faUserFriends_1.faUserFriends, faUserLock_1.faUserLock, faUserPlus_1.faUserPlus, faUser_1.faUser, faUsers_1.faUsers, faUserSecret_1.faUserSecret, faUserShield_1.faUserShield, faVial_1.faVial, faWrench_1.faWrench, faAward_1.faAward);
 var CUSTOM_ICON_TYPE;
 (function (CUSTOM_ICON_TYPE) {
     CUSTOM_ICON_TYPE["ARROW_TO_BOTTOM"] = "arrow-to-bottom";
@@ -287,6 +289,7 @@ var ICON_TYPE;
     ICON_TYPE["BIRTHDAY_CAKE"] = "birthday-cake";
     ICON_TYPE["BOLT"] = "bolt";
     ICON_TYPE["BOOK"] = "book";
+    ICON_TYPE["BROOM"] = "broom";
     ICON_TYPE["BUG"] = "bug";
     ICON_TYPE["BULLHORN"] = "bullhorn";
     ICON_TYPE["CALENDAR"] = "calendar";
@@ -408,6 +411,7 @@ var ICON_TYPE;
     ICON_TYPE["SIGNAL"] = "signal";
     ICON_TYPE["SIGNATURE"] = "signature";
     ICON_TYPE["SITEMAP"] = "sitemap";
+    ICON_TYPE["SKULL"] = "skull";
     ICON_TYPE["SLIDERS_H"] = "sliders-h";
     ICON_TYPE["SORT"] = "sort";
     ICON_TYPE["SORT_DOWN"] = "sort-down";

package/public/components/Table/Table.d.ts

@@ -13,11 +13,12 @@ interface TableProps extends React.HTMLProps<HTMLTableElement> {
     stickyColumn?: boolean;
     hasBatchActions?: boolean;
     spaceRows?: boolean;
+    shrinkFirstColumnPadding?: boolean;
     enableGridSizing?: boolean;
     gridSizing?: string | string[];
 }
 declare const Table: {
-    ({ children, className, onSort, outerBorder, sortColumnId, sortDirection, affixHeader, removeSpacerColumn, noResults, renderInModal, enableHorizontalScroll, stickyColumn, hasBatchActions, spaceRows, style, enableGridSizing, gridSizing, ...rest }: TableProps): React.JSX.Element;
+    ({ children, className, onSort, outerBorder, sortColumnId, sortDirection, affixHeader, removeSpacerColumn, noResults, renderInModal, enableHorizontalScroll, stickyColumn, hasBatchActions, spaceRows, shrinkFirstColumnPadding, style, enableGridSizing, gridSizing, ...rest }: TableProps): React.JSX.Element;
     Body: ({ className, children, ...rest }: React.HTMLProps<HTMLTableSectionElement>) => React.JSX.Element;
     Row: ({ className, children, selected, ...rest }: import("./TableRow").TableRowProps) => React.JSX.Element;
     Cell: React.FunctionComponent<import("./TableCell").TableCellProps>;

package/public/components/Table/Table.js

@@ -39,9 +39,9 @@ Object.defineProperty(exports, "SORT_DIRECTION", { enumerable: true, get: functi
 const bem_1 = require("../../utilities/bem");
 const cn = "Table";
 const wrapperCn = "TableWrapper";
-const Table = ({ children, className, onSort = () => { }, outerBorder = false, sortColumnId, sortDirection, affixHeader = false, removeSpacerColumn = false, noResults = false, renderInModal = false, enableHorizontalScroll = false, stickyColumn = false, hasBatchActions = false, spaceRows = false, style, enableGridSizing = false, gridSizing, ...rest }) => {
+const Table = ({ children, className, onSort = () => { }, outerBorder = false, sortColumnId, sortDirection, affixHeader = false, removeSpacerColumn = false, noResults = false, renderInModal = false, enableHorizontalScroll = false, stickyColumn = false, hasBatchActions = false, spaceRows = false, shrinkFirstColumnPadding = false, style, enableGridSizing = false, gridSizing, ...rest }) => {
     const wrapperClasses = (0, classnames_1.default)((0, bem_1.bem)(wrapperCn), enableHorizontalScroll && (0, bem_1.bem)(wrapperCn, { m: "enable-hscroll" }), spaceRows && (0, bem_1.bem)(wrapperCn, { m: "space-rows" }));
-    const classes = (0, classnames_1.default)((0, bem_1.bem)(cn), removeSpacerColumn && (0, bem_1.bem)(cn, { m: "remove-spacer" }), outerBorder && (0, bem_1.bem)(cn, { m: "outer-border" }), affixHeader && (0, bem_1.bem)(cn, { m: "affix-header" }), noResults && (0, bem_1.bem)(cn, { m: "no-results" }), stickyColumn && (0, bem_1.bem)(cn, { m: "sticky-column" }), hasBatchActions && (0, bem_1.bem)(cn, { m: "batch-actions" }), spaceRows && (0, bem_1.bem)(cn, { m: "space-rows" }), enableGridSizing && gridSizing && (0, bem_1.bem)(cn, { m: "grid-sizing" }), className);
+    const classes = (0, classnames_1.default)((0, bem_1.bem)(cn), removeSpacerColumn && (0, bem_1.bem)(cn, { m: "remove-spacer" }), outerBorder && (0, bem_1.bem)(cn, { m: "outer-border" }), affixHeader && (0, bem_1.bem)(cn, { m: "affix-header" }), noResults && (0, bem_1.bem)(cn, { m: "no-results" }), stickyColumn && (0, bem_1.bem)(cn, { m: "sticky-column" }), hasBatchActions && (0, bem_1.bem)(cn, { m: "batch-actions" }), spaceRows && (0, bem_1.bem)(cn, { m: "space-rows" }), enableGridSizing && gridSizing && (0, bem_1.bem)(cn, { m: "grid-sizing" }), shrinkFirstColumnPadding && (0, bem_1.bem)(cn, { m: "shrink-first-column" }), className);
     return (react_1.default.createElement(TableContext_1.default.Provider, { value: {
             handleSort: onSort,
             sortDirection,

package/public/components/TopBar/TopBar.d.ts

@@ -4,9 +4,10 @@ export interface TopBarProps extends BoxProps {
     leftSlot: ReactNode;
     middleSlot?: ReactNode;
     rightSlot?: ReactNode;
+    removePadding?: boolean;
 }
 declare const TopBar: {
-    ({ leftSlot, middleSlot, rightSlot, className, ...rest }: TopBarProps): React.JSX.Element;
+    ({ leftSlot, middleSlot, rightSlot, removePadding, className, ...rest }: TopBarProps): React.JSX.Element;
     SubNav: (props: BoxProps) => React.JSX.Element;
     SubNavItem: (props: import("./TopBarSubNavItem").SubNavItemProps) => React.JSX.Element;
     Breadcrumbs: (props: import("./TopBarBreadcrumbs").BreadcrumbsProps) => React.JSX.Element;

package/public/components/TopBar/TopBar.js

@@ -12,11 +12,11 @@ const TopBarSubNavItem_1 = require("./TopBarSubNavItem");
 const TopBarSubNav_1 = require("./TopBarSubNav");
 const TopBarBreadcrumbs_1 = require("./TopBarBreadcrumbs");
 const b = (0, bem_1.bemHOF)("TopBar");
-const TopBar = ({ leftSlot, middleSlot, rightSlot, className, ...rest }) => {
+const TopBar = ({ leftSlot, middleSlot, rightSlot, removePadding = false, className, ...rest }) => {
     return (react_1.default.createElement(Flex_1.Flex, { className: (0, classnames_1.default)(b(), className), ...rest },
-        react_1.default.createElement(Flex_1.Flex, { className: b({ e: "left-slot" }) }, leftSlot),
+        react_1.default.createElement(Flex_1.Flex, { className: (0, classnames_1.default)(b({ e: "left-slot" }), !removePadding && "pl-8") }, leftSlot),
         middleSlot && (react_1.default.createElement(Flex_1.Flex, { className: b({ e: "middle-slot" }) }, middleSlot)),
-        rightSlot && react_1.default.createElement(Flex_1.Flex, { className: b({ e: "right-slot" }) }, rightSlot)));
+        rightSlot && (react_1.default.createElement(Flex_1.Flex, { className: (0, classnames_1.default)(b({ e: "right-slot" }), !removePadding && "pr-8") }, rightSlot))));
 };
 exports.TopBar = TopBar;
 TopBar.SubNav = TopBarSubNav_1.TopBarSubNav;

package/public/css/styles.css

@@ -7260,10 +7260,16 @@ override built-in Image component classes */
   position: -webkit-sticky;
   position: sticky;
   z-index: 10;
-
   left: 56px;
 }
 
+.ads-Table.ads-Table--sticky-column.ads-Table--batch-actions.ads-Table--shrink-first-column
+  .ads-TableCell:nth-of-type(2),
+.ads-Table.ads-Table--sticky-column.ads-Table--batch-actions.ads-Table--shrink-first-column
+  .ads-TableHeaderCell:nth-of-type(2) {
+  left: 32px;
+}
+
 .ads-TableCell:first-of-type:not(:only-child), 
 .ads-TableHeaderCell:first-of-type, 
 .ads-Table.ads-Table--batch-actions .ads-TableCell:first-of-type, 
@@ -7271,6 +7277,15 @@ override built-in Image component classes */
   padding-left: 32px;
 }
 
+.ads-Table--shrink-first-column .ads-TableCell:first-of-type:not(:only-child), 
+.ads-Table--shrink-first-column .ads-TableHeaderCell:first-of-type, 
+.ads-Table.ads-Table--batch-actions.ads-Table--shrink-first-column
+  .ads-TableCell:first-of-type, 
+.ads-Table.ads-Table--batch-actions.ads-Table--shrink-first-column
+  .ads-TableHeaderCell:first-of-type {
+  padding-left: 8px;
+}
+
 .ads-Table.ads-Table--sticky-column .ads-TableCell:first-of-type,
 .ads-Table.ads-Table--sticky-column.ads-Table--batch-actions
   .ads-TableCell:nth-of-type(2) {
@@ -7281,6 +7296,13 @@ override built-in Image component classes */
 .ads-Table.ads-Table--sticky-column.ads-Table--batch-actions
   .ads-TableHeaderCell:nth-of-type(2) {
   box-shadow: 1px 0 0 #dee7ee, 3px -1px 0 rgb(234, 237, 239);
+}
+
+.ads-Table.ads-Table--sticky-column .ads-TableHeaderCell:first-of-type, 
+.ads-Table.ads-Table--sticky-column.ads-Table--batch-actions
+  .ads-TableHeaderCell:nth-of-type(2), 
+.ads-Table.ads-Table--sticky-column.ads-Table--batch-actions.ads-Table--shrink-first-column
+  .ads-TableHeaderCell:nth-of-type(2) {
   z-index: 20;
 }
 
@@ -7954,14 +7976,6 @@ override built-in Image component classes */
   align-items: center;
 }
 
-.ads-TopBar-left-slot {
-  padding-left: 32px;
-}
-
-.ads-TopBar-right-slot {
-  padding-right: 32px;
-}
-
 .ads-TopBar-subnav {
   height: 100%;
   align-items: flex-end;
@@ -8631,6 +8645,14 @@ override built-in Image component classes */
   padding-top: 12px;
 }
 
+.pl-8 {
+  padding-left: 32px;
+}
+
+.pr-8 {
+  padding-right: 32px;
+}
+
 .pb-1 {
   padding-bottom: 4px;
 }