@procore/core-react 11.8.0-rc.6 → 11.8.0-rc.9

package/dist/SuperSelect/SuperSelect.styles.js

@@ -4,40 +4,142 @@ var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cook
 };
 import { Virtuoso } from 'react-virtuoso';
 import styled, { css } from 'styled-components';
-import { Avatar } from '../Avatar/Avatar';
+import { Box } from '../Box/Box';
+import { Button } from '../Button';
+import { StyledButton } from '../Button/Button.styles';
 import { Card } from '../Card/Card';
-import { StyledGrip, StyledGroup as StyledGroupBase, StyledItem as StyledItemBase, StyledOptions as StyledOptionsBase, } from '../MenuImperative/MenuImperative.styles';
-import { Typography } from '../Typography/Typography';
-import { typographyWeights } from '../Typography/Typography.styles';
-import { getEllipsis } from '../_styles/mixins';
+import { StyledCheckboxLabel } from '../Checkbox/Checkbox.styles';
+import { Pill } from '../Pill/Pill';
+import { StyledCircle } from '../Spinner/Spinner.styles';
+import { getTypographyIntent, typographyWeights, } from '../Typography/Typography.styles';
+import { borderRadius } from '../_styles/borderRadius';
+import { colors } from '../_styles/colors';
+import { getEllipsis, getFocus } from '../_styles/mixins';
 import { spacing } from '../_styles/spacing';
-export var StyledOverlay = styled(Card)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n"], ["\n  display: flex;\n  flex-direction: column;\n"])));
-export var StyledVirtuoso = styled(Virtuoso)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  flex: 1 1 auto;\n"], ["\n  flex: 1 1 auto;\n"])));
-export var StyledEllipses = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  ", "\n  display: inline-flex;\n\n  > div {\n    display: inline-flex;\n    width: 100%;\n  }\n"], ["\n  ", "\n  display: inline-flex;\n\n  > div {\n    display: inline-flex;\n    width: 100%;\n  }\n"])), getEllipsis());
-export var StyledItemContent = styled.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n"], ["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n"])));
-export var StyledItemAvatarWrapper = styled.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  display: inline-flex;\n  align-self: flex-start;\n"], ["\n  display: inline-flex;\n  align-self: flex-start;\n"])));
-export var StyledItemAvatar = styled(Avatar)(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  cursor: inherit;\n  font-weight: ", ";\n"], ["\n  cursor: inherit;\n  font-weight: ", ";\n"])), typographyWeights.bold);
-export var StyledItemLabelWrapper = styled.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  margin-left: ", "px;\n"], ["\n  margin-left: ", "px;\n"])), spacing.sm);
-export var StyledItemTitle = styled(Typography)(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n  display: flex;\n"], ["\n  display: flex;\n"])));
-export var StyledItemLabel = styled(Typography)(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n  display: flex;\n"], ["\n  display: flex;\n"])));
-export var StyledLabel = styled.div(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), function (_a) {
+export var dataQa = {
+    focused: 'core-select-focused',
+    hovered: 'core-select-hovered',
+};
+var optionMinHeight = 32;
+var checkedIconPlaceholderWidth = 32;
+var styledSelectButtonDefaultWidth = 248;
+export var PillSelectOptionWrapper = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: ", "px ", "px;\n"], ["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: ", "px ", "px;\n"])), spacing.xs, spacing.lg);
+export var PillSelectLabel = styled(Pill)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), getEllipsis);
+export var PillSelectLabelWrapper = styled.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  display: flex;\n  max-width: 100%;\n  pointer-events: auto;\n\n  ", "\n"], ["\n  display: flex;\n  max-width: 100%;\n  pointer-events: auto;\n\n  ", "\n"])), function (_a) {
+    var disabled = _a.disabled;
+    return disabled && css(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n      pointer-events: none;\n    "], ["\n      pointer-events: none;\n    "])));
+});
+export var StyledCheckboxContainer = styled.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  padding-left: ", "px;\n"], ["\n  padding-left: ", "px;\n"])), spacing.lg);
+export var StyledCheckmarkContainer = styled.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  align-items: center;\n  color: ", ";\n  display: inline-flex;\n  flex-shrink: 0;\n  padding: 0 ", "px 0 ", "px;\n"], ["\n  align-items: center;\n  color: ", ";\n  display: inline-flex;\n  flex-shrink: 0;\n  padding: 0 ", "px 0 ", "px;\n"
+    // Do not merge with StyledMenu, needed for max-height working in IE
+])), colors.blue50, spacing.lg, spacing.sm);
+// Do not merge with StyledMenu, needed for max-height working in IE
+export var StyledWrapper = styled.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  display: flex;\n  max-height: inherit;\n  min-width: inherit;\n  outline: none;\n  width: inherit;\n"], ["\n  display: flex;\n  max-height: inherit;\n  min-width: inherit;\n  outline: none;\n  width: inherit;\n"])));
+export var StyledMenu = styled.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n  outline: 0;\n  width: 100%;\n"], ["\n  display: flex;\n  flex-direction: column;\n  outline: 0;\n  width: 100%;\n"])));
+export var StyledOptions = styled.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n  flex-basis: auto;\n  flex-grow: 1;\n  flex-shrink: 1;\n  min-height: ", "px;\n  ", ";\n  padding: ", "px 0;\n  position: relative;\n  overflow: hidden;\n\n  &:focus {\n    ", "\n    margin: -1px;\n  }\n"], ["\n  flex-basis: auto;\n  flex-grow: 1;\n  flex-shrink: 1;\n  min-height: ", "px;\n  ", ";\n  padding: ", "px 0;\n  position: relative;\n  overflow: hidden;\n\n  &:focus {\n    ", "\n    margin: -1px;\n  }\n"])), optionMinHeight, function (_a) {
+    var _b = _a.$scrollable, $scrollable = _b === void 0 ? true : _b;
+    return $scrollable && "overflow-y: auto";
+}, spacing.sm, getFocus());
+export var StyledItemContent = styled.div(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n"], ["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n"])));
+export var StyledOptionGroupLabel = styled.div(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n  padding: ", "px 0 ", "px ", "px;\n"], ["\n  padding: ", "px 0 ", "px ", "px;\n"])), spacing.md, spacing.xs, spacing.lg);
+export var StyledItemLabel = styled.div(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), function (_a) {
     var $draggable = _a.$draggable;
-    return css(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n      padding: ", "px 0 ", "px\n        ", "px;\n    "], ["\n      padding: ", "px 0 ", "px\n        ", "px;\n    "])), spacing.xs, spacing.xs, $draggable ? 0 : spacing.lg);
+    return css(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n      padding: ", "px ", "px;\n    "], ["\n      padding: ", "px ", "px;\n    "])), spacing.xs, $draggable ? 0 : spacing.lg);
 });
-export var StyledDraggableWrapper = styled.div(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n  display: flex;\n  width: 100%;\n  align-items: center;\n"], ["\n  display: flex;\n  width: 100%;\n  align-items: center;\n"])));
-export var StyledItem = styled(StyledItemBase)(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n  padding: 0;\n\n  ", "\n\n  ", "\n\n  ", "\n"], ["\n  padding: 0;\n\n  ", "\n\n  ", "\n\n  ", "\n"])), function (_a) {
+export var StyledDraggableWrapper = styled.div(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n  display: flex;\n  width: 100%;\n  align-items: center;\n"], ["\n  display: flex;\n  width: 100%;\n  align-items: center;\n"])));
+export var StyledGrip = styled.div(templateObject_15 || (templateObject_15 = __makeTemplateObject(["\n  padding: 0 2px;\n  height: 24px;\n  visibility: hidden;\n"], ["\n  padding: 0 2px;\n  height: 24px;\n  visibility: hidden;\n"])));
+export var StyledFooter = styled(Box)(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n  border-top: 1px solid ", ";\n"], ["\n  border-top: 1px solid ", ";\n"])), colors.gray85);
+export var StyledHeader = styled.div(templateObject_17 || (templateObject_17 = __makeTemplateObject([""], [""])));
+export var StyledEmptyMessage = styled.div(templateObject_18 || (templateObject_18 = __makeTemplateObject(["\n  ", ";\n\n  padding: ", "px ", "px;\n  color: ", ";\n"], ["\n  ", ";\n\n  padding: ", "px ", "px;\n  color: ", ";\n"])), getTypographyIntent('body'), spacing.md, spacing.lg, colors.gray45);
+export var StyledSearchContainer = styled.div(templateObject_19 || (templateObject_19 = __makeTemplateObject(["\n  padding: ", "px ", "px ", "px;\n\n  ", " > * {\n    pointer-events: none;\n  }\n"], ["\n  padding: ", "px ", "px ", "px;\n\n  ", " > * {\n    pointer-events: none;\n  }\n"])), spacing.lg, spacing.lg, spacing.sm, StyledButton);
+export var StyledGroup = styled.div(templateObject_20 || (templateObject_20 = __makeTemplateObject(["\n  ", "\n\n  color: ", ";\n  cursor: ", ";\n  font-weight: ", ";\n  padding: ", "px ", "px;\n\n  &:not(:first-child) {\n    padding-top: ", "px;\n  }\n\n  && {\n    padding: 0;\n  }\n\n  ", " {\n    padding: ", "px ", " px;\n  }\n\n  &:not(:first-child) {\n    ", " {\n      padding-top: ", " px;\n    }\n  }\n"], ["\n  ", "\n\n  color: ", ";\n  cursor: ", ";\n  font-weight: ", ";\n  padding: ", "px ", "px;\n\n  &:not(:first-child) {\n    padding-top: ", "px;\n  }\n\n  && {\n    padding: 0;\n  }\n\n  ", " {\n    padding: ", "px ", " px;\n  }\n\n  &:not(:first-child) {\n    ", " {\n      padding-top: ", " px;\n    }\n  }\n"])), getTypographyIntent('body'), colors.gray15, function (_a) {
+    var $clickable = _a.$clickable;
+    return ($clickable ? 'pointer' : 'default');
+}, typographyWeights.semibold, spacing.xs, spacing.lg, spacing.md + spacing.xs, StyledOptionGroupLabel, spacing.xs, spacing.lg, StyledOptionGroupLabel, spacing.md + spacing.xs);
+export var StyledItem = styled.div(templateObject_29 || (templateObject_29 = __makeTemplateObject(["\n  ", ";\n\n  align-items: center;\n  cursor: pointer;\n  list-style-type: none;\n  display: flex;\n  padding: 0;\n\n  ", "\n\n  ", "\n\n  ", "\n\n  a {\n    // We decided to use a negative margin trick here to allow us to continue\n    // to use listNavigation without having to rewrite a bunch of code in js\n    color: ", ";\n    display: block;\n    margin: -", "px -", "px;\n    padding: ", "px ", "px;\n    text-decoration: none;\n\n    &:hover {\n      color: ", ";\n      text-decoration: none;\n    }\n  }\n\n  &[data-highlighted='true'] {\n    background-color: ", ";\n  }\n\n  ", "\n\n  &:hover,\n  &:active {\n    ", " {\n      visibility: visible;\n    }\n  }\n\n  ", " {\n    color: inherit;\n    cursor: pointer;\n  }\n\n  ", "\n\n  ", "\n\n  ", "\n"], ["\n  ", ";\n\n  align-items: center;\n  cursor: pointer;\n  list-style-type: none;\n  display: flex;\n  padding: 0;\n\n  ", "\n\n  ", "\n\n  ", "\n\n  a {\n    // We decided to use a negative margin trick here to allow us to continue\n    // to use listNavigation without having to rewrite a bunch of code in js\n    color: ", ";\n    display: block;\n    margin: -", "px -", "px;\n    padding: ", "px ", "px;\n    text-decoration: none;\n\n    &:hover {\n      color: ", ";\n      text-decoration: none;\n    }\n  }\n\n  &[data-highlighted='true'] {\n    background-color: ", ";\n  }\n\n  ", "\n\n  &:hover,\n  &:active {\n    ", " {\n      visibility: visible;\n    }\n  }\n\n  ", " {\n    color: inherit;\n    cursor: pointer;\n  }\n\n  ", "\n\n  ", "\n\n  ", "\n"])), getTypographyIntent('body'), function (_a) {
     var $emptyMinHeight = _a.$emptyMinHeight;
-    return css(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n      &:empty {\n        min-height: ", "px;\n      }\n    "], ["\n      &:empty {\n        min-height: ", "px;\n      }\n    "])), $emptyMinHeight);
+    return css(templateObject_21 || (templateObject_21 = __makeTemplateObject(["\n      &:empty {\n        min-height: ", "px;\n      }\n    "], ["\n      &:empty {\n        min-height: ", "px;\n      }\n    "])), $emptyMinHeight);
 }, function (_a) {
     var $isDraggingOver = _a.$isDraggingOver, $highlighted = _a.$highlighted;
     return ($isDraggingOver &&
-        $highlighted && css(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n        background-color: initial;\n      "], ["\n        background-color: initial;\n      "]))));
+        $highlighted && css(templateObject_22 || (templateObject_22 = __makeTemplateObject(["\n        background-color: initial;\n      "], ["\n        background-color: initial;\n      "]))));
 }, function (_a) {
     var $isDraggingOver = _a.$isDraggingOver, $disabled = _a.$disabled, $isDraggingDisabled = _a.$isDraggingDisabled;
-    return (($isDraggingOver || $disabled || $isDraggingDisabled) && css(templateObject_15 || (templateObject_15 = __makeTemplateObject(["\n        &:hover {\n          ", " {\n            visibility: hidden;\n          }\n        }\n      "], ["\n        &:hover {\n          ", " {\n            visibility: hidden;\n          }\n        }\n      "])), StyledGrip));
+    return (($isDraggingOver || $disabled || $isDraggingDisabled) && css(templateObject_23 || (templateObject_23 = __makeTemplateObject(["\n        &:hover {\n          ", " {\n            visibility: hidden;\n          }\n        }\n      "], ["\n        &:hover {\n          ", " {\n            visibility: hidden;\n          }\n        }\n      "])), StyledGrip));
+}, colors.gray15, spacing.xs, spacing.lg, spacing.xs, spacing.lg, colors.gray15, colors.gray96, function (_a) {
+    var $highlighted = _a.$highlighted;
+    return $highlighted && "background-color: ".concat(colors.gray96, ";");
+}, StyledGrip, StyledCheckboxLabel, function (_a) {
+    var $disabled = _a.$disabled, $selected = _a.$selected;
+    if ($disabled) {
+        return css(templateObject_24 || (templateObject_24 = __makeTemplateObject(["\n        &,\n        ", " {\n          color: ", ";\n          cursor: default;\n        }\n      "], ["\n        &,\n        ", " {\n          color: ", ";\n          cursor: default;\n        }\n      "])), StyledCheckboxLabel, colors.gray85);
+    }
+    else if ($selected) {
+        return css(templateObject_25 || (templateObject_25 = __makeTemplateObject(["\n        color: ", ";\n        font-weight: 700;\n\n        a,\n        a:hover {\n          color: ", ";\n          text-decoration: none;\n        }\n\n        &[data-highlighted='true'] {\n          background-color: ", ";\n        }\n      "], ["\n        color: ", ";\n        font-weight: 700;\n\n        a,\n        a:hover {\n          color: ", ";\n          text-decoration: none;\n        }\n\n        &[data-highlighted='true'] {\n          background-color: ", ";\n        }\n      "])), colors.blue50, colors.blue50, colors.gray96);
+    }
+    return css(templateObject_26 || (templateObject_26 = __makeTemplateObject(["\n      color: ", ";\n\n      &[data-highlighted='true'] {\n        background-color: ", ";\n      }\n    "], ["\n      color: ", ";\n\n      &[data-highlighted='true'] {\n        background-color: ", ";\n      }\n    "])), colors.gray15, colors.gray96);
+}, function (_a) {
+    var $isDraggable = _a.$isDraggable;
+    if ($isDraggable) {
+        return css(templateObject_27 || (templateObject_27 = __makeTemplateObject(["\n        ", " {\n          cursor: grab;\n\n          // The unchecked and checked icons\n          &:before,\n          &:after {\n            cursor: pointer;\n          }\n        }\n\n        &&& {\n          padding-left: 0;\n        }\n      "], ["\n        ", " {\n          cursor: grab;\n\n          // The unchecked and checked icons\n          &:before,\n          &:after {\n            cursor: pointer;\n          }\n        }\n\n        &&& {\n          padding-left: 0;\n        }\n      "])), StyledCheckboxLabel);
+    }
+}, function (_a) {
+    var $isDragging = _a.$isDragging;
+    if ($isDragging) {
+        return css(templateObject_28 || (templateObject_28 = __makeTemplateObject(["\n        background-color: ", ";\n\n        ", " {\n          visibility: visible;\n        }\n      "], ["\n        background-color: ", ";\n\n        ", " {\n          visibility: visible;\n        }\n      "])), colors.gray96, StyledGrip);
+    }
+});
+export var StyledDroppable = styled.div(templateObject_30 || (templateObject_30 = __makeTemplateObject(["\n  ", ", ", " {\n    padding-left: 28px;\n  }\n"], ["\n  ", ", ", " {\n    padding-left: 28px;\n  }\n"])), StyledGroup, StyledItem);
+export var StyledSelectMenu = styled(Card)(templateObject_31 || (templateObject_31 = __makeTemplateObject(["\n  display: flex;\n  max-height: 40vh;\n  max-width: ", "px;\n  min-width: inherit;\n"], ["\n  display: flex;\n  max-height: 40vh;\n  max-width: ", "px;\n  min-width: inherit;\n"])), styledSelectButtonDefaultWidth);
+export var StyledLabel = styled.div(templateObject_32 || (templateObject_32 = __makeTemplateObject(["\n  ", "\n  flex-grow: 1;\n  margin-right: ", "px;\n  outline: none;\n  pointer-events: ", ";\n  user-select: none;\n"], ["\n  ", "\n  flex-grow: 1;\n  margin-right: ", "px;\n  outline: none;\n  pointer-events: ", ";\n  user-select: none;\n"])), getEllipsis(), spacing.sm, function (_a) {
+    var $hoverable = _a.$hoverable;
+    return ($hoverable ? 'initial' : 'none');
+});
+export var StyledIndicators = styled.div(templateObject_33 || (templateObject_33 = __makeTemplateObject(["\n  align-items: center;\n  align-self: flex-start;\n  display: flex;\n  height: 34px;\n  justify-content: flex-end;\n  margin-left: ", "px;\n  min-width: 40px;\n  width: 40px;\n"], ["\n  align-items: center;\n  align-self: flex-start;\n  display: flex;\n  height: 34px;\n  justify-content: flex-end;\n  margin-left: ", "px;\n  min-width: 40px;\n  width: 40px;\n"])), spacing.xs);
+export var StyledClearIcon = styled(Button)(templateObject_34 || (templateObject_34 = __makeTemplateObject([""], [""])));
+export var StyledSpinner = styled.div(templateObject_35 || (templateObject_35 = __makeTemplateObject(["\n  align-items: center;\n  display: flex;\n  flex: 0 0 auto;\n  justify-content: center;\n  line-height: 0;\n"], ["\n  align-items: center;\n  display: flex;\n  flex: 0 0 auto;\n  justify-content: center;\n  line-height: 0;\n"])));
+export var StyledArrowContainer = styled.div(templateObject_36 || (templateObject_36 = __makeTemplateObject(["\n  align-items: center;\n  display: inline-flex;\n  height: 16px;\n  justify-content: flex-end;\n  margin-left: ", "px;\n  width: 8px;\n"], ["\n  align-items: center;\n  display: inline-flex;\n  height: 16px;\n  justify-content: flex-end;\n  margin-left: ", "px;\n  width: 8px;\n"])), spacing.sm);
+export var StyledArrow = styled.span(templateObject_37 || (templateObject_37 = __makeTemplateObject(["\n  display: inline-flex;\n\n  svg {\n    fill: ", ";\n  }\n"], ["\n  display: inline-flex;\n\n  svg {\n    fill: ", ";\n  }\n"])), colors.gray45);
+export var StyledArrowOutline = styled.polygon(templateObject_38 || (templateObject_38 = __makeTemplateObject([""], [""])));
+export var StyledArrowFill = styled.polygon(templateObject_39 || (templateObject_39 = __makeTemplateObject([""], [""])));
+export var StyledTrigger = styled.div(templateObject_47 || (templateObject_47 = __makeTemplateObject(["\n  ", "\n\n  align-items: center;\n  background-color: ", ";\n  border-color: ", ";\n  border-radius: ", "px;\n  border-style: solid;\n  border-width: 1px;\n  color: ", ";\n  cursor: pointer;\n  display: inline-flex;\n  height: 36px;\n  min-height: 36px;\n  outline: none;\n  padding: 0 ", "px;\n  position: relative;\n  white-space: nowrap;\n  width: ", ";\n\n  &::placeholder {\n    border-color: ", ";\n  }\n\n  &:hover,\n  &:active,\n  &[data-qa=", "] {\n    background-color: ", ";\n    border-color: ", ";\n    color: ", ";\n  }\n\n  &:focus,\n  &[data-qa=", "] {\n    ", "\n\n    ", " {\n      stroke: ", ";\n    }\n  }\n\n  ", "\n\n  ", "\n\n  ", "\n\n  ", "\n\n  ", "\n\n    ", "\n  \n    ", "\n  }\n"], ["\n  ", "\n\n  align-items: center;\n  background-color: ", ";\n  border-color: ", ";\n  border-radius: ", "px;\n  border-style: solid;\n  border-width: 1px;\n  color: ", ";\n  cursor: pointer;\n  display: inline-flex;\n  height: 36px;\n  min-height: 36px;\n  outline: none;\n  padding: 0 ", "px;\n  position: relative;\n  white-space: nowrap;\n  width: ", ";\n\n  &::placeholder {\n    border-color: ", ";\n  }\n\n  &:hover,\n  &:active,\n  &[data-qa=", "] {\n    background-color: ", ";\n    border-color: ", ";\n    color: ", ";\n  }\n\n  &:focus,\n  &[data-qa=", "] {\n    ", "\n\n    ", " {\n      stroke: ", ";\n    }\n  }\n\n  ", "\n\n  ", "\n\n  ", "\n\n  ", "\n\n  ", "\n\n    ", "\n  \n    ", "\n  }\n"])), getTypographyIntent('body'), colors.white, colors.gray70, borderRadius.md, colors.gray15, spacing.md, function (_a) {
+    var $block = _a.$block;
+    return $block ? '100%' : "".concat(styledSelectButtonDefaultWidth, "px");
+}, colors.gray45, dataQa.hovered, colors.white, colors.gray45, colors.gray15, dataQa.focused, getFocus(), StyledCircle, colors.blue50, function (_a) {
+    var _b = _a.$placeholder, $placeholder = _b === void 0 ? false : _b;
+    return $placeholder && css(templateObject_40 || (templateObject_40 = __makeTemplateObject(["\n      ", " {\n        color: ", ";\n      }\n    "], ["\n      ", " {\n        color: ", ";\n      }\n    "])), StyledLabel, colors.gray45);
+}, function (_a) {
+    var $disabled = _a.$disabled;
+    return $disabled && css(templateObject_41 || (templateObject_41 = __makeTemplateObject(["\n      background-color: ", ";\n      border-color: ", ";\n      color: ", ";\n      cursor: default;\n      pointer-events: none;\n\n      ", " {\n        color: ", ";\n      }\n\n      ", " {\n        svg {\n          fill: ", ";\n        }\n      }\n    "], ["\n      background-color: ", ";\n      border-color: ", ";\n      color: ", ";\n      cursor: default;\n      pointer-events: none;\n\n      ", " {\n        color: ", ";\n      }\n\n      ", " {\n        svg {\n          fill: ", ";\n        }\n      }\n    "])), colors.gray94, colors.gray70, colors.gray45, StyledLabel, colors.gray70, StyledArrow, colors.gray70);
+}, function (_a) {
+    var $error = _a.$error, $disabled = _a.$disabled, $loading = _a.$loading;
+    if ($error && !$disabled) {
+        return css(templateObject_42 || (templateObject_42 = __makeTemplateObject(["\n        &,\n        &:hover {\n          border-color: ", ";\n          border-color: var(--core-input-error-border-color, ", ");\n        }\n        &:hover:focus {\n          ", "\n        }\n      "], ["\n        &,\n        &:hover {\n          border-color: ", ";\n          border-color: var(--core-input-error-border-color, ", ");\n        }\n        &:hover:focus {\n          ", "\n        }\n      "])), colors.red50, colors.red50, getFocus());
+    }
+}, function (_a) {
+    var $hasClearIcon = _a.$hasClearIcon;
+    return css(templateObject_43 || (templateObject_43 = __makeTemplateObject(["\n    ", " {\n      opacity: ", ";\n    }\n  "], ["\n    ", " {\n      opacity: ", ";\n    }\n  "])), StyledClearIcon, $hasClearIcon ? 1 : 0);
+}, function (_a) {
+    var $multiple = _a.$multiple;
+    return $multiple && css(templateObject_44 || (templateObject_44 = __makeTemplateObject(["\n      height: auto;\n\n      &:focus-within {\n        ", "\n      }\n    "], ["\n      height: auto;\n\n      &:focus-within {\n        ", "\n      }\n    "])), getFocus());
+}, function (_a) {
+    var $open = _a.$open, $hasClearIcon = _a.$hasClearIcon;
+    return $open &&
+        $hasClearIcon && css(templateObject_45 || (templateObject_45 = __makeTemplateObject(["\n        ", " {\n          opacity: 1;\n          pointer-events: all;\n        }\n      "], ["\n        ", " {\n          opacity: 1;\n          pointer-events: all;\n        }\n      "])), StyledClearIcon);
+}, function (_a) {
+    var $open = _a.$open, _b = _a.$placeholder, $placeholder = _b === void 0 ? false : _b;
+    return $open &&
+        $placeholder && css(templateObject_46 || (templateObject_46 = __makeTemplateObject(["\n        ", " {\n          opacity: 1;\n          pointer-events: all;\n        }\n      "], ["\n        ", " {\n          opacity: 1;\n          pointer-events: all;\n        }\n      "])), StyledLabel);
 });
-export var StyledGroupHeaderLabel = styled.div(templateObject_17 || (templateObject_17 = __makeTemplateObject(["\n  padding: ", "px 0 ", "px ", "px;\n"], ["\n  padding: ", "px 0 ", "px ", "px;\n"])), spacing.md, spacing.xs, spacing.lg);
-export var StyledGroup = styled(StyledGroupBase)(templateObject_18 || (templateObject_18 = __makeTemplateObject(["\n  && {\n    padding: 0;\n  }\n\n  ", " {\n    padding: ", "px ", " px;\n  }\n\n  &:not(:first - child) {\n    ", " {\n      padding-top: ", " px;\n    }\n  }\n"], ["\n  && {\n    padding: 0;\n  }\n\n  ", " {\n    padding: ", "px ", " px;\n  }\n\n  &:not(:first - child) {\n    ", " {\n      padding-top: ", " px;\n    }\n  }\n"])), StyledGroupHeaderLabel, spacing.xs, spacing.lg, StyledGroupHeaderLabel, spacing.md + spacing.xs);
-export var StyledOptions = styled(StyledOptionsBase)(templateObject_19 || (templateObject_19 = __makeTemplateObject(["\n  overflow: hidden;\n"], ["\n  overflow: hidden;\n"])));
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16, templateObject_17, templateObject_18, templateObject_19;
+export var StyledOverlay = styled(Card)(templateObject_48 || (templateObject_48 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n"], ["\n  display: flex;\n  flex-direction: column;\n"])));
+export var StyledVirtuoso = styled(Virtuoso)(templateObject_49 || (templateObject_49 = __makeTemplateObject(["\n  flex: 1 1 auto;\n"], ["\n  flex: 1 1 auto;\n"])));
+export var StyledEllipses = styled.div(templateObject_50 || (templateObject_50 = __makeTemplateObject(["\n  ", "\n  display: inline-flex;\n\n  > div {\n    display: inline-flex;\n    width: 100%;\n  }\n"], ["\n  ", "\n  display: inline-flex;\n\n  > div {\n    display: inline-flex;\n    width: 100%;\n  }\n"])), getEllipsis());
+export var StyledMultiValueContainer = styled.div(templateObject_51 || (templateObject_51 = __makeTemplateObject(["\n  display: flex;\n  flex-wrap: wrap;\n  margin-bottom: 2px;\n  margin-right: ", "px;\n  margin-top: 2px;\n  min-width: 0;\n  width: 100%;\n"], ["\n  display: flex;\n  flex-wrap: wrap;\n  margin-bottom: 2px;\n  margin-right: ", "px;\n  margin-top: 2px;\n  min-width: 0;\n  width: 100%;\n"])), spacing.xs);
+export var StyledMultiValue = styled.div(templateObject_52 || (templateObject_52 = __makeTemplateObject(["\n  margin-bottom: 2px;\n  margin-right: ", "px;\n  margin-top: 2px;\n  flex: 0 1 auto;\n\n  > div {\n    max-width: 178px;\n    width: 100%;\n  }\n"], ["\n  margin-bottom: 2px;\n  margin-right: ", "px;\n  margin-top: 2px;\n  flex: 0 1 auto;\n\n  > div {\n    max-width: 178px;\n    width: 100%;\n  }\n"])), spacing.xs);
+export var StyledMultiInputContainer = styled.div(templateObject_53 || (templateObject_53 = __makeTemplateObject(["\n  margin-bottom: 2px;\n  margin-right: ", "px;\n  margin-top: 2px;\n  flex: 1;\n  max-width: 100%;\n  min-width: 24px;\n"], ["\n  margin-bottom: 2px;\n  margin-right: ", "px;\n  margin-top: 2px;\n  flex: 1;\n  max-width: 100%;\n  min-width: 24px;\n"])), spacing.xs);
+export var StyledMultiInput = styled.input(templateObject_55 || (templateObject_55 = __makeTemplateObject(["\n  background-color: transparent;\n  border-width: 0;\n  font-family: inherit;\n  padding: 0;\n  height: 24px;\n  width: 100%;\n\n  ", "\n\n  ", "\n\n  &::-ms-clear {\n    display: none;\n  }\n\n  &:focus {\n    box-shadow: none;\n    outline: none;\n  }\n\n  &::placeholder {\n    color: ", ";\n  }\n"], ["\n  background-color: transparent;\n  border-width: 0;\n  font-family: inherit;\n  padding: 0;\n  height: 24px;\n  width: 100%;\n\n  ", "\n\n  ", "\n\n  &::-ms-clear {\n    display: none;\n  }\n\n  &:focus {\n    box-shadow: none;\n    outline: none;\n  }\n\n  &::placeholder {\n    color: ", ";\n  }\n"])), getTypographyIntent('body'), function (_a) {
+    var $isNavigatingTokens = _a.$isNavigatingTokens;
+    return $isNavigatingTokens && css(templateObject_54 || (templateObject_54 = __makeTemplateObject(["\n      color: transparent;\n    "], ["\n      color: transparent;\n    "])));
+}, colors.gray45);
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16, templateObject_17, templateObject_18, templateObject_19, templateObject_20, templateObject_21, templateObject_22, templateObject_23, templateObject_24, templateObject_25, templateObject_26, templateObject_27, templateObject_28, templateObject_29, templateObject_30, templateObject_31, templateObject_32, templateObject_33, templateObject_34, templateObject_35, templateObject_36, templateObject_37, templateObject_38, templateObject_39, templateObject_40, templateObject_41, templateObject_42, templateObject_43, templateObject_44, templateObject_45, templateObject_46, templateObject_47, templateObject_48, templateObject_49, templateObject_50, templateObject_51, templateObject_52, templateObject_53, templateObject_54, templateObject_55;
 //# sourceMappingURL=SuperSelect.styles.js.map

package/dist/SuperSelect/SuperSelect.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"SuperSelect.styles.js","sourceRoot":"","sources":["../../src/SuperSelect/SuperSelect.styles.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"SuperSelect.styles.js","sourceRoot":"","sources":["../../src/SuperSelect/SuperSelect.styles.ts"],"names":[],"mappings":"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"}

package/dist/SuperSelect/SuperSelect.types.d.ts

@@ -1,57 +1,8 @@
 import React from 'react';
 import { DivAttributes } from '../_utils/types';
+import * as defaultComponents from './SuperSelect.components';
 import { isOptgroupSymbol } from './SuperSelect.constants';
 import { useSuperSelect } from './useSuperSelect';
-export interface SuperSelectComponents {
-    Label?: React.FC<{
-        selectApi: SuperSelectApi;
-    }>;
-    MenuItemLabel?: React.FC<{
-        selectApi: SuperSelectApi;
-        option: SuperSelectOption;
-    }>;
-    MenuGroupHeader?: React.FC<{
-        selectApi: SuperSelectApi;
-        optgroup: SuperSelectOptgroup;
-    }>;
-    Token?: React.FC<{
-        selectApi: SuperSelectApi;
-        option: SuperSelectOption;
-        index: number;
-        focused: boolean;
-    }>;
-}
-export interface SuperSelectProps {
-    block?: boolean;
-    draggable?: boolean;
-    sort?: boolean;
-    components?: SuperSelectComponents;
-    defaultValue?: SuperSelectValue;
-    disabled?: boolean;
-    emptyMessage?: string;
-    error?: boolean;
-    footer?: React.ReactElement;
-    getOptionAvatar?: (option: SuperSelectOption) => string;
-    getOptionIsBatch?: (option: SuperSelectOption) => boolean;
-    getOptionIsDisabled?: (option: SuperSelectOption) => boolean;
-    getOptionLabel?: (option: SuperSelectOption) => string;
-    getOptionIcon?: (option: SuperSelectOption) => string;
-    getOptionTitle?: (option: SuperSelectOption) => string;
-    getOptionTooltip?: (option: SuperSelectOption) => string;
-    getOptionValue?: (option: SuperSelectOption) => SuperSelectValuePrimitive;
-    getOptionGroup?: (option: SuperSelectOption) => string;
-    setOptionGroup?: (option: SuperSelectOption, group: string) => SuperSelectOption;
-    onManualSort?: (options: SuperSelectOption[]) => void;
-    header?: React.ReactElement;
-    loading?: boolean;
-    multiple?: boolean;
-    onChange?: (value: SuperSelectValue) => void;
-    options: SuperSelectOption[];
-    placeholder?: string;
-    search?: boolean;
-    tabIndex?: number;
-    value?: SuperSelectValue;
-}
 export interface TokenNavigationProps {
     activeIndex?: number | null;
     enabled?: boolean;
@@ -66,32 +17,39 @@ export interface KeyboardSelectionProps {
 export declare type SuperSelectValuePrimitive = boolean | string | number;
 export declare type SuperSelectValue = SuperSelectValuePrimitive | Array<SuperSelectValuePrimitive> | null;
 export declare type SuperSelectOption = any;
+export declare type SuperSelectPreset = '' | 'pill' | 'filter' | 'contacts';
 export interface SuperSelectConfig {
-    components?: SuperSelectComponents;
-    draggable?: boolean;
-    sort?: boolean;
+    block?: boolean;
+    components?: Partial<typeof defaultComponents>;
     defaultValue?: SuperSelectValue;
     disabled?: boolean;
-    getOptionAvatar?: (option: SuperSelectOption) => string;
+    draggable?: boolean;
+    emptyMessage?: string;
+    error?: boolean;
+    footer?: React.ReactElement;
     getOptionGroup?: (option: SuperSelectOption) => string;
-    getOptionIcon?: (option: SuperSelectOption) => string;
-    setOptionGroup?: (option: SuperSelectOption, group: string) => SuperSelectOption;
     getOptionIsBatch?: (option: SuperSelectOption) => boolean;
     getOptionIsDisabled?: (option: SuperSelectOption) => boolean;
     getOptionLabel?: (option: SuperSelectOption) => string;
-    getOptionTitle?: (option: SuperSelectOption) => string;
-    getOptionTooltip?: (option: SuperSelectOption) => string;
     getOptionValue?: (option: SuperSelectOption) => SuperSelectValuePrimitive;
-    onManualSort?: (options: SuperSelectOption[]) => void;
+    header?: React.ReactElement;
+    loading?: boolean;
     multiple?: boolean;
     onChange?: (value: SuperSelectValue) => void;
+    onManualSort?: (options: SuperSelectOption[]) => void;
     options?: SuperSelectOption[];
+    placeholder?: string;
+    preset?: SuperSelectPreset;
     search?: boolean;
+    selectionStyle?: 'highlight' | 'checkbox' | 'checkmark';
+    setOptionGroup?: (option: SuperSelectOption, group: string) => SuperSelectOption;
+    sort?: boolean;
+    tabIndex?: number;
     value?: SuperSelectValue;
 }
+export declare type SuperSelectProps = SuperSelectConfig;
 export declare type SuperSelectApi = ReturnType<typeof useSuperSelect>;
-export interface SuperSelectReferenceProps {
-    selectApi: SuperSelectApi;
+export interface SuperSelectTriggerProps {
     block?: boolean;
     disabled?: boolean;
     error?: boolean;

package/dist/SuperSelect/SuperSelect.types.js.map

@@ -1 +1 @@
-{"version":3,"file":"SuperSelect.types.js","sourceRoot":"","sources":["../../src/SuperSelect/SuperSelect.types.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAA"}
+{"version":3,"file":"SuperSelect.types.js","sourceRoot":"","sources":["../../src/SuperSelect/SuperSelect.types.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAA"}