@vitality-ds/components 5.7.0-alpha.1 → 5.7.0-alpha.3

package/dist/AuditTrail/components/AuditItem/index.spec.js

@@ -3,6 +3,7 @@
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _react = require("@testing-library/react");
+var _lucideReact = require("lucide-react");
 var _icons = require("@vitality-ds/icons");
 var _react2 = _interopRequireDefault(require("react"));
 var _test = require("../../../helpers/test");
@@ -26,7 +27,7 @@ describe("<AuditItem />", function () {
                 item: item
               })),
               container = _render.container;
-            expect((0, _test.findSVGs)(container, _icons.Add)).toHaveLength(1);
+            expect((0, _test.findSVGs)(container, _lucideReact.Plus)).toHaveLength(1);
           });
           it("renders the name and preposition", function () {
             (0, _react.render)(/*#__PURE__*/_react2["default"].createElement(_index["default"], {
@@ -66,7 +67,7 @@ describe("<AuditItem />", function () {
                   item: item
                 })),
                 container = _render2.container;
-              expect((0, _test.findSVGs)(container, _icons.Add)).toHaveLength(1);
+              expect((0, _test.findSVGs)(container, _lucideReact.Plus)).toHaveLength(1);
             });
             it("renders the name and preposition", function () {
               (0, _react.render)(/*#__PURE__*/_react2["default"].createElement(_index["default"], {
@@ -185,7 +186,7 @@ describe("<AuditItem />", function () {
             item: item
           })),
           container = _render5.container;
-        expect((0, _test.findSVGs)(container, _icons.Add)).toHaveLength(1);
+        expect((0, _test.findSVGs)(container, _lucideReact.Plus)).toHaveLength(1);
       });
       it("does not render the name or preposition", function () {
         (0, _react.render)(/*#__PURE__*/_react2["default"].createElement(_index["default"], {
@@ -275,7 +276,7 @@ describe("<AuditItem />", function () {
     var defaultActionProps = {
       actionName: "Actioned",
       preposition: "from",
-      fallbackIcon: _icons.Contact,
+      fallbackIcon: _lucideReact.CircleUser,
       forceIcon: false
     };
     var createItemProps = function createItemProps() {
@@ -304,14 +305,14 @@ describe("<AuditItem />", function () {
       describe("and when fallbackIcon is given", function () {
         var forceIconActionProps = (0, _extends2["default"])({}, defaultActionProps, {
           forceIcon: true,
-          fallbackIcon: _icons.Link
+          fallbackIcon: _lucideReact.Link2
         });
         it("renders the fallbackIcon", function () {
           var _render6 = (0, _react.render)(/*#__PURE__*/_react2["default"].createElement(_index["default"], {
               item: createItemProps(forceIconActionProps)
             })),
             container = _render6.container;
-          expect((0, _test.findSVGs)(container, _icons.Link)).toHaveLength(1);
+          expect((0, _test.findSVGs)(container, _lucideReact.Link2)).toHaveLength(1);
         });
       });
       describe("and fallbackIcon is not given", function () {
@@ -319,19 +320,19 @@ describe("<AuditItem />", function () {
           fallbackIcon: null,
           forceIcon: true
         });
-        it("renders the <Contact /> icon", function () {
+        it("renders the <CircleUser /> icon", function () {
           var _render7 = (0, _react.render)(/*#__PURE__*/_react2["default"].createElement(_index["default"], {
               item: createItemProps(forceIconActionProps)
             })),
             container = _render7.container;
-          expect((0, _test.findSVGs)(container, _icons.Contact)).toHaveLength(1);
+          expect((0, _test.findSVGs)(container, _lucideReact.CircleUser)).toHaveLength(1);
         });
       });
     });
     describe("and forceIcon is false", function () {
       var dontForceIconActionProps = (0, _extends2["default"])({}, defaultActionProps, {
         forceIcon: false,
-        fallbackIcon: _icons.Link
+        fallbackIcon: _lucideReact.Link2
       });
       describe("and initials can be generated", function () {
         var item = (0, _extends2["default"])({}, createItemProps(dontForceIconActionProps), {
@@ -347,7 +348,7 @@ describe("<AuditItem />", function () {
       describe("and initials cannot be generated", function () {
         describe("and fallbackIcon is given", function () {
           var item = (0, _extends2["default"])({}, createItemProps((0, _extends2["default"])({}, dontForceIconActionProps, {
-            fallbackIcon: _icons.Link
+            fallbackIcon: _lucideReact.Link2
           })), {
             name: "Joe shmo the third"
           });
@@ -356,7 +357,7 @@ describe("<AuditItem />", function () {
                 item: item
               })),
               container = _render8.container;
-            expect((0, _test.findSVGs)(container, _icons.Link)).toHaveLength(1);
+            expect((0, _test.findSVGs)(container, _lucideReact.Link2)).toHaveLength(1);
           });
         });
         describe("and fallbackIcon is not given", function () {
@@ -365,12 +366,12 @@ describe("<AuditItem />", function () {
           })), {
             name: "Joe shmo the third"
           });
-          it("renders the <Contact /> icon", function () {
+          it("renders the <CircleUser /> icon", function () {
             var _render9 = (0, _react.render)(/*#__PURE__*/_react2["default"].createElement(_index["default"], {
                 item: item
               })),
               container = _render9.container;
-            expect((0, _test.findSVGs)(container, _icons.Contact)).toHaveLength(1);
+            expect((0, _test.findSVGs)(container, _lucideReact.CircleUser)).toHaveLength(1);
           });
         });
       });

package/dist/AuditTrail/components/IconAvatar/index.js

@@ -5,15 +5,14 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
-var _icons = require("@vitality-ds/icons");
+var _lucideReact = require("lucide-react");
 var _react = _interopRequireDefault(require("react"));
 var _styled = require("./styled");
 function IconAvatar(_ref) {
   var icon = _ref.icon;
-  var IconComponent = icon || _icons.Contact;
+  var IconComponent = icon || _lucideReact.CircleUser;
   return /*#__PURE__*/_react["default"].createElement(_styled.IconAvatarContainer, null, /*#__PURE__*/_react["default"].createElement(IconComponent, {
-    color: "inherit",
-    size: "sm"
+    color: "currentColor"
   }));
 }
 var _default = exports["default"] = IconAvatar;

package/dist/AuditTrail/constants.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.TITLES_TO_IGNORE = exports.PREPOSITIONS = exports.BRAND_ICONS = exports.APPLICATION_ICON_TRIGGERS = exports.ACTIONS = void 0;
 var _icons = require("@vitality-ds/icons");
+var _lucideReact = require("lucide-react");
 var PREPOSITIONS = exports.PREPOSITIONS = {
   by: "by",
   to: "to",
@@ -17,121 +18,121 @@ var ACTIONS = exports.ACTIONS = {
   complete: {
     actionName: "Completed",
     preposition: PREPOSITIONS.by,
-    fallbackIcon: _icons.Completed,
+    fallbackIcon: _lucideReact.CircleCheck,
     forceIcon: false
   },
   create: {
     actionName: "Created",
     preposition: PREPOSITIONS.by,
-    fallbackIcon: _icons.Add,
+    fallbackIcon: _lucideReact.Plus,
     forceIcon: false
   },
   "delete": {
     actionName: "Deleted",
     preposition: PREPOSITIONS.by,
-    fallbackIcon: _icons.Delete,
+    fallbackIcon: _lucideReact.Trash2,
     forceIcon: false
   },
   edit: {
     actionName: "Edited",
     preposition: PREPOSITIONS.by,
-    fallbackIcon: _icons.Edit,
+    fallbackIcon: _lucideReact.Pencil,
     forceIcon: false
   },
   finalise: {
     actionName: "Finalised",
     preposition: PREPOSITIONS.by,
-    fallbackIcon: _icons.Completed,
+    fallbackIcon: _lucideReact.CircleCheck,
     forceIcon: false
   },
   linkBy: {
     actionName: "Linked",
     preposition: PREPOSITIONS.by,
-    fallbackIcon: _icons.Link,
+    fallbackIcon: _lucideReact.Link2,
     forceIcon: false
   },
   linkTo: {
     actionName: "Linked",
     preposition: PREPOSITIONS.to,
-    fallbackIcon: _icons.Link,
+    fallbackIcon: _lucideReact.Link2,
     forceIcon: true
   },
   print: {
     actionName: "Printed",
     preposition: PREPOSITIONS.by,
-    fallbackIcon: _icons.Print,
+    fallbackIcon: _lucideReact.Printer,
     forceIcon: true
   },
   receive: {
     actionName: "Received",
     preposition: PREPOSITIONS.by,
-    fallbackIcon: _icons.ResultsAndLetters,
+    fallbackIcon: _lucideReact.Inbox,
     forceIcon: false
   },
   remove: {
     actionName: "Removed",
     preposition: PREPOSITIONS.by,
-    fallbackIcon: _icons.Delete,
+    fallbackIcon: _lucideReact.Trash2,
     forceIcon: false
   },
   restrict: {
     actionName: "Restricted",
     preposition: PREPOSITIONS.by,
-    fallbackIcon: _icons.RestrictedOn,
+    fallbackIcon: _lucideReact.Lock,
     forceIcon: false
   },
   restore: {
     actionName: "Restored",
     preposition: PREPOSITIONS.by,
-    fallbackIcon: _icons.Restore,
+    fallbackIcon: _lucideReact.Undo2,
     forceIcon: false
   },
   review: {
     actionName: "Reviewed",
     preposition: PREPOSITIONS.by,
-    fallbackIcon: _icons.ReviewFiles,
+    fallbackIcon: _lucideReact.File,
     forceIcon: false
   },
   sendBy: {
     actionName: "Sent",
     preposition: PREPOSITIONS.by,
-    fallbackIcon: _icons.Send,
+    fallbackIcon: _lucideReact.SendHorizontal,
     forceIcon: false
   },
   sendTo: {
     actionName: "Sent",
     preposition: PREPOSITIONS.to,
-    fallbackIcon: _icons.Send,
+    fallbackIcon: _lucideReact.SendHorizontal,
     forceIcon: true
   },
   unlinkBy: {
     actionName: "Unlinked",
     preposition: PREPOSITIONS.by,
-    fallbackIcon: _icons.LinkOff,
+    fallbackIcon: _lucideReact.Link2Off,
     forceIcon: false
   },
   unlinkFrom: {
     actionName: "Unlinked",
     preposition: PREPOSITIONS.from,
-    fallbackIcon: _icons.LinkOff,
+    fallbackIcon: _lucideReact.Link2Off,
     forceIcon: true
   },
   unrestrict: {
     actionName: "Unrestricted",
     preposition: PREPOSITIONS.by,
-    fallbackIcon: _icons.RestrictedOff,
+    fallbackIcon: _lucideReact.LockOpen,
     forceIcon: false
   },
   update: {
     actionName: "Updated",
     preposition: PREPOSITIONS.by,
-    fallbackIcon: _icons.Edit,
+    fallbackIcon: _lucideReact.Pencil,
     forceIcon: false
   },
   "void": {
     actionName: "Voided",
     preposition: PREPOSITIONS.by,
-    fallbackIcon: _icons.Delete,
+    fallbackIcon: _lucideReact.Trash2,
     forceIcon: false
   }
 };

package/dist/Breadcrumbs/components/Breadcrumb/index.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
-var _icons = require("@vitality-ds/icons");
+var _lucideReact = require("lucide-react");
 var _react = _interopRequireDefault(require("react"));
 var _Tooltip = _interopRequireDefault(require("../../../Tooltip"));
 var _hooks = require("./hooks");
@@ -32,8 +32,8 @@ function Breadcrumb(_ref) {
   }, linkComponent) || /*#__PURE__*/_react["default"].createElement(_styled.BaseBreadcrumbLink, {
     href: href,
     target: target
-  }, text), isLastItem ? null : /*#__PURE__*/_react["default"].createElement(_icons.ChevronRight, {
-    size: "inherit"
+  }, text), isLastItem ? null : /*#__PURE__*/_react["default"].createElement(_lucideReact.ChevronRight, {
+    size: "1em"
   }));
 }
 var _default = exports["default"] = Breadcrumb;

package/dist/Button/components/ButtonIcon/styles/BaseButtonIcon.styles.js

@@ -1,41 +1,38 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _icons = require("@vitality-ds/icons");
 var _system = require("@vitality-ds/system");
-var _default = exports["default"] = (0, _system.css)((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])({
-  $$spacing: "$space$sm"
-}, "& > ".concat(_icons.BaseIcon), {
-  // Aligning Icons to text baseline = most Icons have 2px inner bottom spacing -> 2/24 * 2 = 0.2 rounded up
-  marginTop: "-.2em"
-}), "svg", {
-  $$size: "16px",
-  width: "$$size",
-  height: "$$size",
-  opacity: 0.8,
-  "altGlyph, circle, ellipse, path, polygon, polyline, rect, text, textPath, tref, tspan,": {
-    fill: "currentColor"
-  }
-}), "variants", {
-  spacing: {
-    end: {
-      marginInlineEnd: "$$spacing",
-      marginInlineStart: "-$sm"
-    },
-    start: {
-      marginInlineEnd: "-$sm",
-      marginInlineStart: "$$spacing"
+var _default = exports["default"] = (0, _system.css)({
+  $$spacing: "$space$sm",
+  svg: {
+    $$size: "1rem",
+    width: "$$size",
+    height: "$$size",
+    opacity: 0.8,
+    verticalAlign: "text-bottom",
+    "altGlyph, circle, ellipse, path, polygon, polyline, rect, text, textPath, tref, tspan,": {
+      stroke: "currentColor"
     }
   },
-  size: {
-    "default": {},
-    compact: {
-      $$spacing: "$space$xs"
+  variants: {
+    spacing: {
+      end: {
+        marginInlineEnd: "$$spacing",
+        marginInlineStart: "-$sm"
+      },
+      start: {
+        marginInlineEnd: "-$sm",
+        marginInlineStart: "$$spacing"
+      }
+    },
+    size: {
+      "default": {},
+      compact: {
+        $$spacing: "$space$xs"
+      }
     }
   }
-}));
+});

package/dist/Button/primitives/styles/BaseContentContainer.styles.js

@@ -10,7 +10,7 @@ var _default = exports["default"] = (0, _system.css)({
   opacity: 1,
   display: "flex",
   gap: "$sm",
-  alignItems: "anchor-center",
+  alignItems: "baseline",
   variants: {
     isLoading: {
       "true": {

package/dist/Callout/constants.js

@@ -4,63 +4,65 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.DEFAULT_CONTENT = void 0;
-var _icons = require("@vitality-ds/icons");
+var _lucideReact = require("lucide-react");
+// import { GentuLogo } from "@vitality-ds/icons";
+
 // eslint-disable-next-line import/prefer-default-export
 var DEFAULT_CONTENT = exports.DEFAULT_CONTENT = {
   success: {
-    icon: _icons.Completed,
+    icon: _lucideReact.CircleCheck,
     title: "Success",
     titleColor: "$colors$success10",
     spinnerColor: "success",
-    iconColor: "success"
+    iconColor: "$colors$success10"
   },
   info: {
-    icon: _icons.Info,
+    icon: _lucideReact.Info,
     title: "Information",
     titleColor: "$colors$info10",
     spinnerColor: "info",
-    iconColor: "info"
+    iconColor: "$colors$info10"
   },
   warning: {
-    icon: _icons.Alert,
+    icon: _lucideReact.TriangleAlert,
     title: "Warning",
     titleColor: "$colors$warning10",
     spinnerColor: "warning",
-    iconColor: "warning"
+    iconColor: "$colors$warning10"
   },
   critical: {
-    icon: _icons.Error,
+    icon: _lucideReact.CircleAlert,
     title: "Critical",
     titleColor: "$colors$critical10",
     spinnerColor: "critical",
-    iconColor: "critical"
+    iconColor: "$colors$critical10"
   },
   accent: {
-    icon: _icons.Info,
+    icon: _lucideReact.Info,
     title: "Information",
     titleColor: "$colors$accent10",
     spinnerColor: "accent",
-    iconColor: "accent"
+    iconColor: "$colors$accent10"
   },
   brand: {
-    icon: _icons.GentuLogo,
+    icon: _lucideReact.Info,
     title: "Brand",
     titleColor: "$colors$brand10",
     spinnerColor: "brand",
-    iconColor: "brand"
+    iconColor: "$colors$brand10"
   },
   primary: {
-    icon: _icons.Info,
+    icon: _lucideReact.Info,
     title: "Information",
     titleColor: "$colors$primary10",
     spinnerColor: "primary",
-    iconColor: "primary"
+    iconColor: "$colors$primary10"
   },
   neutral: {
-    icon: _icons.Info,
+    icon: _lucideReact.Info,
     title: "Information",
     titleColor: "$colors$neutral12",
     spinnerColor: "neutral",
-    iconColor: "lowContrast"
+    iconColor: "$colors$neutral12"
   }
 };

package/dist/Callout/hooks/useCalloutContent.js

@@ -17,7 +17,7 @@ var useCalloutContent = function useCalloutContent(_ref) {
     iconColor = _getDefaultContent.iconColor,
     spinnerColor = _getDefaultContent.spinnerColor;
   var isCompactLayout = size === "compact" || size === "blockCompact";
-  var iconSize = isCompactLayout ? "sm" : "md";
+  var iconSize = "1rem";
   var titleToDisplay = title || defaultTitle;
   var iconToDisplay = icon || defaultIcon;
   return {

package/dist/Callout/index.js

@@ -78,25 +78,21 @@ function Callout(_ref) {
       variant: "display300"
     }, titleToDisplay);
   };
-  var getIconContent = function getIconContent() {
-    if (size === "blockCompact") {
-      return /*#__PURE__*/_react["default"].createElement(_styled.BaseCalloutIconContainer, null, /*#__PURE__*/_react["default"].createElement(IconComponent, {
-        size: iconSize,
-        color: iconColor
-      }));
-    }
-    return /*#__PURE__*/_react["default"].createElement(IconComponent, {
-      size: iconSize,
-      color: iconColor
-    });
-  };
   return /*#__PURE__*/_react["default"].createElement(_styled.BaseCallout, {
     role: "alert",
     size: size,
     severity: severity
   }, /*#__PURE__*/_react["default"].createElement(_styled.BaseCalloutTitleContainer, {
-    size: size
-  }, getIconContent(), getTitleContent()), !isCompactLayout && !hideTitle && /*#__PURE__*/_react["default"].createElement(_CalloutDescription["default"], {
+    size: size,
+    css: {
+      color: iconColor
+    }
+  }, /*#__PURE__*/_react["default"].createElement(_styled.BaseCalloutIconContainer, {
+    topNudge: size
+  }, /*#__PURE__*/_react["default"].createElement(IconComponent, {
+    size: iconSize,
+    color: "currentColor"
+  })), getTitleContent()), !isCompactLayout && !hideTitle && /*#__PURE__*/_react["default"].createElement(_CalloutDescription["default"], {
     severity: severity,
     content: description
   }), actions && size !== "compact" && /*#__PURE__*/_react["default"].createElement(_styled.BaseCalloutActions, {

package/dist/Callout/styles/BaseCalloutIconContainer.styles.js

@@ -5,8 +5,18 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports["default"] = void 0;
 var _system = require("@vitality-ds/system");
-// Adjust alignment of inline text with the icon in blockCompact mode
+// Adjust alignment of inline text with the icon
 var _default = exports["default"] = (0, _system.css)({
   display: "flex",
-  marginTop: "0.15rem"
+  variants: {
+    topNudge: {
+      "default": {
+        marginTop: ".25rem"
+      },
+      blockCompact: {
+        marginTop: "0.15rem"
+      },
+      compact: {}
+    }
+  }
 });

package/dist/Chip/components/Checkbox/constants.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.COMPONENTS = void 0;
-var _icons = require("@vitality-ds/icons");
+var _lucideReact = require("lucide-react");
 var _react = _interopRequireDefault(require("react"));
 var _Spinner = _interopRequireDefault(require("../../../Spinner"));
 var _styled = require("./styled");
@@ -14,9 +14,9 @@ var COMPONENTS = exports.COMPONENTS = {
   LOADING: /*#__PURE__*/_react["default"].createElement(_Spinner["default"], {
     size: "xs"
   }),
-  CHECKED: /*#__PURE__*/_react["default"].createElement(_icons.Done, {
-    size: "sm",
-    color: "success"
+  CHECKED: /*#__PURE__*/_react["default"].createElement(_lucideReact.Check, {
+    size: "1rem",
+    color: "var(--vitality-colors-success11)"
   }),
   UNCHECKED: /*#__PURE__*/_react["default"].createElement(_styled.BaseChipCheckboxBox, null)
 };

package/dist/Chip/components/ChipIcon/index.js

@@ -17,7 +17,7 @@ function ChipIcon(_ref) {
   return /*#__PURE__*/_react["default"].createElement(_ConditionalTooltipWrapper["default"], {
     tooltipContent: tooltipContent
   }, /*#__PURE__*/_react["default"].createElement(Icon, {
-    size: "sm",
-    color: "lowContrast"
+    size: "1rem",
+    color: "currentColor"
   }));
 }

package/dist/Chip/components/RemoveButton/index.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.RemoveButtonContainer = RemoveButtonContainer;
 exports["default"] = void 0;
-var _icons = require("@vitality-ds/icons");
+var _lucideReact = require("lucide-react");
 var _react = _interopRequireDefault(require("react"));
 var _ConditionalTooltipWrapper = _interopRequireDefault(require("../../../helpers/components/ConditionalTooltipWrapper"));
 var _styled = require("./styled");
@@ -26,9 +26,9 @@ function RemoveButton(_ref2) {
   }, /*#__PURE__*/_react["default"].createElement(_styled.BaseRemoveButtonButton, {
     onClick: onClick,
     disabled: isDisabled
-  }, /*#__PURE__*/_react["default"].createElement(_icons.Close, {
-    color: "inherit",
-    size: "inherit"
+  }, /*#__PURE__*/_react["default"].createElement(_lucideReact.X, {
+    color: "currentColor",
+    size: "1em"
   })));
 }
 var _default = exports["default"] = RemoveButton;

package/dist/Chip/components/RemoveButton/styles/BaseRemoveButtonButton.styles.js

@@ -5,11 +5,14 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports["default"] = void 0;
 var _system = require("@vitality-ds/system");
+var _tokens = require("@vitality-ds/tokens");
+var text = _tokens.colorUseCases.text;
 var _default = exports["default"] = (0, _system.css)({
   border: 0,
   backgroundColor: "transparent",
   display: "flex",
   justifyContent: "center",
   alignItems: "center",
-  width: "100%"
+  width: "100%",
+  color: (0, _tokens.getColorScaleValueByUseCase)("neutral", text.lowContrast)
 });

package/dist/Chip/styles/BaseChip.styles.js

@@ -17,7 +17,7 @@ var _default = exports["default"] = (0, _system.css)({
   alignItems: "center",
   boxSizing: "border-box",
   gap: "$sm",
-  color: (0, _system.getColorScaleValueByUseCase)("neutral", text.hiContrast),
+  color: (0, _system.getColorScaleValueByUseCase)("neutral", text.lowContrast),
   backgroundColor: (0, _system.getColorScaleValueByUseCase)("neutral", backgrounds.uiElement),
   border: "1px solid",
   borderLeftWidth: "$$indentation",

package/dist/ComboButton/index.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports["default"] = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _icons = require("@vitality-ds/icons");
+var _lucideReact = require("lucide-react");
 var _react = _interopRequireDefault(require("react"));
 var _Button = _interopRequireDefault(require("../Button"));
 var _DropdownMenu = _interopRequireDefault(require("../DropdownMenu"));
@@ -28,7 +28,7 @@ function ComboButton(_ref) {
       props: {
         size: size,
         "data-vitality-component": "combo-button-dropdown",
-        iconLeft: /*#__PURE__*/_react["default"].createElement(_icons.Dropdown, null),
+        iconLeft: /*#__PURE__*/_react["default"].createElement(_lucideReact.ChevronDown, null),
         children: "",
         appearance: mainButtonProps === null || mainButtonProps === void 0 ? void 0 : mainButtonProps.appearance
       }