@procore/core-react 11.24.4 → 11.25.1

package/dist/Thumbnail/Thumbnail.styles.js

@@ -28,35 +28,35 @@ var captionBase = /*#__PURE__*/css(["color:", ";font-size:12px;line-height:16px;
 });
 export var StyledMultilineCaption = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledMultilineCaption",
-  componentId: "core-11_24_4__sc-195f70c-0"
+  componentId: "core-11_25_1__sc-195f70c-0"
 })(["", " display:flex;word-wrap:break-word;overflow-wrap:break-word;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;max-height:", "px;"], captionBase, multilineCaptionMaxHeight);
 export var StyledCaptionText = /*#__PURE__*/styled.span.withConfig({
   displayName: "StyledCaptionText",
-  componentId: "core-11_24_4__sc-195f70c-1"
+  componentId: "core-11_25_1__sc-195f70c-1"
 })(["width:100%;"]);
 export var StyledPlaceholderCaption = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledPlaceholderCaption",
-  componentId: "core-11_24_4__sc-195f70c-2"
+  componentId: "core-11_25_1__sc-195f70c-2"
 })(["", ""], captionBase);
 export var StyledSingleLineCaption = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledSingleLineCaption",
-  componentId: "core-11_24_4__sc-195f70c-3"
+  componentId: "core-11_25_1__sc-195f70c-3"
 })(["display:flex;", ""], captionBase);
 export var StyledSinglelineCaptionBody = /*#__PURE__*/styled.span.withConfig({
   displayName: "StyledSinglelineCaptionBody",
-  componentId: "core-11_24_4__sc-195f70c-4"
+  componentId: "core-11_25_1__sc-195f70c-4"
 })(["", ""], getEllipsis);
 export var StyledSinglelineCaptionEnding = /*#__PURE__*/styled.span.withConfig({
   displayName: "StyledSinglelineCaptionEnding",
-  componentId: "core-11_24_4__sc-195f70c-5"
+  componentId: "core-11_25_1__sc-195f70c-5"
 })(["max-width:50%;white-space:nowrap;flex-shrink:0;"]);
 export var StyledLabelText = /*#__PURE__*/styled(Typography).withConfig({
   displayName: "StyledLabelText",
-  componentId: "core-11_24_4__sc-195f70c-6"
+  componentId: "core-11_25_1__sc-195f70c-6"
 })(["", ""], getEllipsis());
 export var StyledThumbnailFigCaption = /*#__PURE__*/styled.figcaption.withConfig({
   displayName: "StyledThumbnailFigCaption",
-  componentId: "core-11_24_4__sc-195f70c-7"
+  componentId: "core-11_25_1__sc-195f70c-7"
 })(["", " ", " color:", ";font-weight:", ";text-align:center;width:100%;position:absolute;bottom:0;right:0;left:0;opacity:0.85;height:", "px;padding:", "px ", "px;background-color:", ";"], getTypographyIntent('small'), getEllipsis(), function (_ref5) {
   var _ref5$$color = _ref5.$color,
     $color = _ref5$$color === void 0 ? 'gray15' : _ref5$$color;
@@ -64,7 +64,7 @@ export var StyledThumbnailFigCaption = /*#__PURE__*/styled.figcaption.withConfig
 }, typographyWeights.bold, labelHeight, spacing.sm / 2, spacing.sm, colors.white);
 export var StyledLabel = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledLabel",
-  componentId: "core-11_24_4__sc-195f70c-8"
+  componentId: "core-11_25_1__sc-195f70c-8"
 })(["display:flex;justify-content:center;position:absolute;bottom:0;right:0;left:0;opacity:0.85;height:", "px;padding:", "px ", "px;font-size:", "px;background-color:", ";"], labelHeight, spacing.sm / 2, spacing.sm, labelFontSize, colors.white);
 var thumbnailBase = /*#__PURE__*/css(["display:flex;justify-content:center;align-items:center;position:relative;overflow:hidden;border:1px solid ", ";border-radius:", "px;margin:0;", " ", " &:focus{", ";}", " ", " ", ""], colors.gray85, borderRadius.md, function (_ref6) {
   var clickable = _ref6.clickable;
@@ -86,7 +86,7 @@ var thumbnailBase = /*#__PURE__*/css(["display:flex;justify-content:center;align
 });
 export var StyledTickIcon = /*#__PURE__*/styled.svg.withConfig({
   displayName: "StyledTickIcon",
-  componentId: "core-11_24_4__sc-195f70c-9"
+  componentId: "core-11_25_1__sc-195f70c-9"
 })(["position:absolute;top:", "px;right:", "px;width:", "px;height:", "px;opacity:0;transform:scale(0.75);transition:transform 250ms ease-out,opacity 100ms ease-out;", " ", ""], spacing.sm, spacing.sm, tickSize, tickSize, function (_ref11) {
   var selected = _ref11.selected;
   return selected ? "\n        opacity: 1;\n        transform: scale(1);\n      " : '';
@@ -96,28 +96,28 @@ export var StyledTickIcon = /*#__PURE__*/styled.svg.withConfig({
 });
 export var StyledFileIcon = /*#__PURE__*/styled(DocumentIcon).withConfig({
   displayName: "StyledFileIcon",
-  componentId: "core-11_24_4__sc-195f70c-10"
+  componentId: "core-11_25_1__sc-195f70c-10"
 })(["width:36.5%;height:auto;"]);
 export var StyledImageThumbnailPreview = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledImageThumbnailPreview",
-  componentId: "core-11_24_4__sc-195f70c-11"
+  componentId: "core-11_25_1__sc-195f70c-11"
 })(["width:100%;height:100%;background-size:cover;background-repeat:no-repeat;background-position:center;", ""], function (_ref13) {
   var $bgImage = _ref13.$bgImage;
   return css(["background-image:url(", ");"], $bgImage);
 });
 export var StyledImageThumbnailOverlay = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledImageThumbnailOverlay",
-  componentId: "core-11_24_4__sc-195f70c-12"
+  componentId: "core-11_25_1__sc-195f70c-12"
 })(["display:none;position:absolute;top:0;bottom:0;left:0;right:0;"]);
 var blackOverlay = "\n  background-color: ".concat(colors.black, ";\n  opacity: 0.2;\n");
 var whiteOverlay = "\n  background-color: ".concat(colors.white, ";\n  opacity: 0.5;\n");
 export var StyledImageThumbnailImage = /*#__PURE__*/styled.img.withConfig({
   displayName: "StyledImageThumbnailImage",
-  componentId: "core-11_24_4__sc-195f70c-13"
+  componentId: "core-11_25_1__sc-195f70c-13"
 })([""]);
 export var StyledImageThumbnail = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledImageThumbnail",
-  componentId: "core-11_24_4__sc-195f70c-14"
+  componentId: "core-11_25_1__sc-195f70c-14"
 })(["", " flex-direction:column;", " ", " ", " ", " ", " ", ""], thumbnailBase, function (_ref14) {
   var disabled = _ref14.disabled;
   return disabled ? "\n        &,\n        &:hover {\n          ".concat(StyledImageThumbnailOverlay, " {\n            display: block;\n            ").concat(whiteOverlay, "\n          }\n        }\n        ").concat(StyledImageThumbnailPreview, ",\n        ").concat(StyledTickIcon, ",\n        ").concat(StyledImageThumbnailImage, " {\n          filter: saturate(0);\n        }\n        ").concat(StyledFileIcon, " {\n          filter: saturate(0);\n          z-index: -1;\n        }\n      ") : '';
@@ -146,7 +146,7 @@ export var StyledImageThumbnail = /*#__PURE__*/styled.div.withConfig({
 });
 export var StyledThumbnailWrapper = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledThumbnailWrapper",
-  componentId: "core-11_24_4__sc-195f70c-15"
+  componentId: "core-11_25_1__sc-195f70c-15"
 })(["display:flex;", " ", ""], function (_ref20) {
   var size = _ref20.size;
   return size === 'lg' ? "\n        width: ".concat(thumbnailSizeLg, "px;\n      ") : '';
@@ -157,7 +157,7 @@ export var StyledThumbnailWrapper = /*#__PURE__*/styled.div.withConfig({
 });
 export var StyledPlaceholderThumbnail = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledPlaceholderThumbnail",
-  componentId: "core-11_24_4__sc-195f70c-16"
+  componentId: "core-11_25_1__sc-195f70c-16"
 })(["", " ", " ", " ", " ", ""], thumbnailBase, function (_ref22) {
   var clickable = _ref22.clickable;
   return clickable ? "\n        &:hover {\n          background-color: ".concat(colors.gray96, ";\n        }\n\n      ") : '';

package/dist/Thumbnail/ThumbnailCaption.d.ts

@@ -1,3 +1,3 @@
-/// <reference types="react" />
+import React from 'react';
 import type { CaptionProps } from './Thumbnail.types';
-export declare function ThumbnailCaption({ layout, disabled, error, caption, hasCaptionPlaceholder, multiline, qa, ...props }: CaptionProps): JSX.Element | null;
+export declare function ThumbnailCaption({ layout, disabled, error, caption, hasCaptionPlaceholder, multiline, qa, ...props }: CaptionProps): React.JSX.Element | null;

package/dist/Thumbnail/ThumbnailDocumentIcon.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from 'react';
 export declare type ThumbnailDocumentIconVariant = 'image' | 'unknown' | 'zip' | 'drawing' | 'email' | 'excel' | 'gantt' | 'ini' | 'mov' | 'pdf' | 'powerpoint' | 'word' | 'xml' | '3d' | 'folder' | 'folderPeople' | 'folderLock';
 export interface DocumentIconProps {
     variant: ThumbnailDocumentIconVariant;
@@ -7,4 +7,4 @@ export interface DocumentIconProps {
     height?: string | number;
     focusable?: boolean;
 }
-export declare function DocumentIcon({ className, focusable, height, variant, width, }: DocumentIconProps): JSX.Element;
+export declare function DocumentIcon({ className, focusable, height, variant, width, }: DocumentIconProps): React.JSX.Element;

package/dist/Thumbnail/ThumbnailPreview.d.ts

@@ -1,3 +1,3 @@
-/// <reference types="react" />
+import React from 'react';
 import type { FilePreviewProps } from './Thumbnail.types';
-export declare function ThumbnailPreview({ file }: FilePreviewProps): JSX.Element | null;
+export declare function ThumbnailPreview({ file }: FilePreviewProps): React.JSX.Element | null;

package/dist/ThumbnailGrid/ThumbnailGrid.styles.d.ts

@@ -4,10 +4,10 @@ export declare const StyledCheckbox: import("styled-components").StyledComponent
 export declare const StyledGroupCell: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const StyledThumbnail: import("styled-components").StyledComponent<(<Role extends import("../Thumbnail/Thumbnail.types").ThumbnailRoles>(props: import("../Thumbnail").ThumbnailProps<Role> | (import("../Thumbnail/Thumbnail.types").BaseThumbnailProps & {
     ref?: import("../Thumbnail/Thumbnail.types").ThumbnailRef<Role> | undefined;
-})) => JSX.Element) & {
+})) => import("react").JSX.Element) & {
     Placeholder: <Role_1 extends import("../Thumbnail/Thumbnail.types").ThumbnailRoles>(props: import("../Thumbnail/Thumbnail.types").PlaceholderProps<Role_1> | (import("../Thumbnail/Thumbnail.types").BasePlaceholderProps & {
         ref?: import("../Thumbnail/Thumbnail.types").ThumbnailRef<Role_1> | undefined;
-    })) => JSX.Element;
+    })) => import("react").JSX.Element;
 }, any, {}, never>;
 export declare const StyledVariableSizeGrid: import("styled-components").StyledComponent<typeof VariableSizeGrid, any, {}, never>;
 export declare const StyledGroupTitle: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("../_utils/types").SpanAttributes & import("..").TypographyProps & import("react").RefAttributes<HTMLSpanElement>>, any, {}, never>;

package/dist/ThumbnailGrid/ThumbnailGrid.styles.js

@@ -7,31 +7,31 @@ import { getEllipsis } from '../_styles/mixins';
 import { spacing } from '../_styles/spacing';
 export var StyledCheckbox = /*#__PURE__*/styled(Checkbox).withConfig({
   displayName: "StyledCheckbox",
-  componentId: "core-11_24_4__sc-1inrbm9-0"
+  componentId: "core-11_25_1__sc-1inrbm9-0"
 })(["input{z-index:2;}"]);
 export var StyledGroupCell = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledGroupCell",
-  componentId: "core-11_24_4__sc-1inrbm9-1"
+  componentId: "core-11_25_1__sc-1inrbm9-1"
 })(["display:flex;align-items:flex-end;padding-bottom:", "px;"], spacing.md);
 export var StyledThumbnail = /*#__PURE__*/styled(Thumbnail).withConfig({
   displayName: "StyledThumbnail",
-  componentId: "core-11_24_4__sc-1inrbm9-2"
+  componentId: "core-11_25_1__sc-1inrbm9-2"
 })(["display:inline-flex;&:focus{outline:none;}"]);
 // VariableSizeGrid has provided width and height as inline style, so to make it flexible and support responsive !important was added
 export var StyledVariableSizeGrid = /*#__PURE__*/styled(VariableSizeGrid).withConfig({
   displayName: "StyledVariableSizeGrid",
-  componentId: "core-11_24_4__sc-1inrbm9-3"
+  componentId: "core-11_25_1__sc-1inrbm9-3"
 })(["height:100% !important;& > div{width:100% !important;}"]);
 export var StyledGroupTitle = /*#__PURE__*/styled(Typography).withConfig({
   displayName: "StyledGroupTitle",
-  componentId: "core-11_24_4__sc-1inrbm9-4"
+  componentId: "core-11_25_1__sc-1inrbm9-4"
 })(["", ""], getEllipsis);
 export var StyledSpinnerWrapper = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledSpinnerWrapper",
-  componentId: "core-11_24_4__sc-1inrbm9-5"
+  componentId: "core-11_25_1__sc-1inrbm9-5"
 })(["display:flex;justify-content:center;align-items:center;width:100%;height:100%;"]);
 export var StyledThumbnailGrid = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledThumbnailGrid",
-  componentId: "core-11_24_4__sc-1inrbm9-6"
+  componentId: "core-11_25_1__sc-1inrbm9-6"
 })(["display:flex;flex-wrap:wrap;outline:none;"]);
 //# sourceMappingURL=ThumbnailGrid.styles.js.map

package/dist/TieredSelect/TieredSelect.styles.d.ts

@@ -8,7 +8,7 @@ export declare const StyledTieredSelect: import("styled-components").StyledCompo
     Item: import("../_utils/polymorphic").PolymorphicAs.ComponentWithForwardedRef<import("../MenuImperative/MenuImperative.types").MenuItemProps, "div">;
     Options: import("react").ForwardRefExoticComponent<import("../MenuImperative/MenuImperative.types").OptionsProps & import("react").RefAttributes<HTMLDivElement>>;
     Search: {
-        ({ className, i18nScope, placeholder, onChange: _onChange, ...props }: import("../MenuImperative/MenuImperative.types").MenuSearchProps): JSX.Element;
+        ({ className, i18nScope, placeholder, onChange: _onChange, ...props }: import("../MenuImperative/MenuImperative.types").MenuSearchProps): import("react").JSX.Element;
         displayName: string;
     };
 }, any, {}, never>;

package/dist/TieredSelect/TieredSelect.styles.js

@@ -9,19 +9,19 @@ import { colors } from '../_styles/colors';
 import { spacing } from '../_styles/spacing';
 export var StyledTieredSelect = /*#__PURE__*/styled(MenuImperative).withConfig({
   displayName: "StyledTieredSelect",
-  componentId: "core-11_24_4__sc-e1ql06-0"
+  componentId: "core-11_25_1__sc-e1ql06-0"
 })(["align-items:stretch;max-height:40vh;"]);
 export var StyledTieredSelectIcon = /*#__PURE__*/styled(Flex).withConfig({
   displayName: "StyledTieredSelectIcon",
-  componentId: "core-11_24_4__sc-e1ql06-1"
+  componentId: "core-11_25_1__sc-e1ql06-1"
 })(["height:24px;width:24px;"]);
 export var StyledTieredSelectArrowButton = /*#__PURE__*/styled(Button).withConfig({
   displayName: "StyledTieredSelectArrowButton",
-  componentId: "core-11_24_4__sc-e1ql06-2"
+  componentId: "core-11_25_1__sc-e1ql06-2"
 })(["border:1px solid transparent;"]);
 export var StyledTieredSelectBreadcrumbs = /*#__PURE__*/styled(Breadcrumbs).withConfig({
   displayName: "StyledTieredSelectBreadcrumbs",
-  componentId: "core-11_24_4__sc-e1ql06-3"
+  componentId: "core-11_25_1__sc-e1ql06-3"
 })(["background-color:", ";flex-wrap:wrap;margin-top:", "px;max-height:68px;overflow-y:auto;padding:", "px ", "px;", ""], colors.gray96, spacing.sm, spacing.xs, spacing.md, function (_ref) {
   var $nonInteractive = _ref.$nonInteractive;
   if ($nonInteractive) {
@@ -30,22 +30,22 @@ export var StyledTieredSelectBreadcrumbs = /*#__PURE__*/styled(Breadcrumbs).with
 });
 export var StyledTieredSelectHome = /*#__PURE__*/styled(Flex).withConfig({
   displayName: "StyledTieredSelectHome",
-  componentId: "core-11_24_4__sc-e1ql06-4"
+  componentId: "core-11_25_1__sc-e1ql06-4"
 })(["height:20px;"]);
 export var StyledTieredSelectOption = /*#__PURE__*/styled(MenuImperative.Item).withConfig({
   displayName: "StyledTieredSelectOption",
-  componentId: "core-11_24_4__sc-e1ql06-5"
+  componentId: "core-11_25_1__sc-e1ql06-5"
 })(["align-items:center;display:flex;justify-content:space-between;padding:2px ", "px;"], spacing.lg);
 export var StyledTieredSelectLoadingMore = /*#__PURE__*/styled(Flex).withConfig({
   displayName: "StyledTieredSelectLoadingMore",
-  componentId: "core-11_24_4__sc-e1ql06-6"
+  componentId: "core-11_25_1__sc-e1ql06-6"
 })(["align-items:center;justify-content:center;padding:", "px ", "px 0px ", "px;"], spacing.xs, spacing.lg, spacing.lg);
 export var StyledTieredSelectOverlay = /*#__PURE__*/styled(Card).withConfig({
   displayName: "StyledTieredSelectOverlay",
-  componentId: "core-11_24_4__sc-e1ql06-7"
+  componentId: "core-11_25_1__sc-e1ql06-7"
 })(["max-width:248px;min-width:inherit;"]);
 export var StyledTieredSelectSpinnerOverlay = /*#__PURE__*/styled(Spinner).withConfig({
   displayName: "StyledTieredSelectSpinnerOverlay",
-  componentId: "core-11_24_4__sc-e1ql06-8"
+  componentId: "core-11_25_1__sc-e1ql06-8"
 })(["min-height:auto;"]);
 //# sourceMappingURL=TieredSelect.styles.js.map

package/dist/Tile/Tile.styles.js

@@ -39,7 +39,7 @@ var getTileStyles = function getTileStyles(_ref) {
 };
 export var StyledLinkTile = /*#__PURE__*/styled.a.withConfig({
   displayName: "StyledLinkTile",
-  componentId: "core-11_24_4__sc-8q9p0n-0"
+  componentId: "core-11_25_1__sc-8q9p0n-0"
 })(["", " text-decoration:none;color:inherit;"], function (_ref2) {
   var $orientation = _ref2.$orientation;
   return getTileStyles({
@@ -49,7 +49,7 @@ export var StyledLinkTile = /*#__PURE__*/styled.a.withConfig({
 });
 export var StyledSelectableTile = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledSelectableTile",
-  componentId: "core-11_24_4__sc-8q9p0n-1"
+  componentId: "core-11_25_1__sc-8q9p0n-1"
 })(["", ""], function (_ref3) {
   var $orientation = _ref3.$orientation,
     $selected = _ref3.$selected,
@@ -65,7 +65,7 @@ export var StyledSelectableTile = /*#__PURE__*/styled.div.withConfig({
 });
 export var StyledInteractableTile = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledInteractableTile",
-  componentId: "core-11_24_4__sc-8q9p0n-2"
+  componentId: "core-11_25_1__sc-8q9p0n-2"
 })(["", ""], function (_ref4) {
   var $orientation = _ref4.$orientation;
   return getTileStyles({
@@ -74,26 +74,26 @@ export var StyledInteractableTile = /*#__PURE__*/styled.div.withConfig({
 });
 export var StyledFooter = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledFooter",
-  componentId: "core-11_24_4__sc-8q9p0n-3"
+  componentId: "core-11_25_1__sc-8q9p0n-3"
 })(["grid-area:footer;padding:", "px;> ", "{flex-wrap:wrap-reverse;}"], spacing.lg, StyledActions);
 export var StyledTileContent = /*#__PURE__*/styled(StyledContent).withConfig({
   displayName: "StyledTileContent",
-  componentId: "core-11_24_4__sc-8q9p0n-4"
+  componentId: "core-11_25_1__sc-8q9p0n-4"
 })(["grid-column-start:hero-start;grid-column-end:body-end;padding:", "px;+ ", "{padding-top:0;}> ", ",> ", " > ", ",> ", " > ", "{grid-column-gap:", "px;}"], spacing.lg, StyledFooter, SFormRow, SForm, SFormRow, SFormikForm, SFormRow, spacing.md);
 export var StyledHeroMedia = /*#__PURE__*/styled.figure.withConfig({
   displayName: "StyledHeroMedia",
-  componentId: "core-11_24_4__sc-8q9p0n-5"
+  componentId: "core-11_25_1__sc-8q9p0n-5"
 })(["grid-area:hero;margin:0;position:relative;overflow:hidden;font-size:0;> *{font-size:initial;}+ ", "{grid-area:body;}> video{background-color:", ";}> img,> picture > img{object-fit:cover;}", ""], StyledTileContent, colors.black, function (_ref5) {
   var $orientation = _ref5.$orientation;
   return $orientation === 'landscape' && !isIE11() ? css(["border-top-left-radius:inherit;border-bottom-left-radius:inherit;> *,> picture > img{height:100%;width:100%;position:absolute;}@media ", "{> picture > img,> img{width:auto;left:50%;transform:translate(-50%,0);}}"], mediaIE11Hack) : css(["min-height:156px;max-height:567px;border-top-left-radius:inherit;border-top-right-radius:inherit;> *,> picture > img{min-height:inherit;max-height:inherit;height:auto;width:100%;}"]);
 });
 export var StyledHeroOverlay = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledHeroOverlay",
-  componentId: "core-11_24_4__sc-8q9p0n-6"
+  componentId: "core-11_25_1__sc-8q9p0n-6"
 })(["position:absolute;width:100%;height:100%;top:0;left:0;z-index:1;"]);
 export var StyledHeroText = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledHeroText",
-  componentId: "core-11_24_4__sc-8q9p0n-7"
+  componentId: "core-11_25_1__sc-8q9p0n-7"
 })(["grid-area:hero;+ ", "{grid-area:body;}padding:", "px;border-radius:inherit;", ""], StyledTileContent, spacing.lg, function (_ref6) {
   var $orientation = _ref6.$orientation;
   return $orientation === 'landscape' ? css(["display:flex;flex-direction:column;justify-content:center;padding-right:0;"]) : css(["padding-bottom:0;"]);

package/dist/Title/Title.styles.js

@@ -5,33 +5,33 @@ import { Typography } from '../Typography/Typography';
 import { spacing } from '../_styles/spacing';
 export var StyledTitle = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledTitle",
-  componentId: "core-11_24_4__sc-1t2ye1d-0"
+  componentId: "core-11_25_1__sc-1t2ye1d-0"
 })(["display:flex;align-items:flex-start;"]);
 export var StyledAssets = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledAssets",
-  componentId: "core-11_24_4__sc-1t2ye1d-1"
+  componentId: "core-11_25_1__sc-1t2ye1d-1"
 })(["margin-right:", "px;"], spacing.md);
 export var StyledTitleContent = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledTitleContent",
-  componentId: "core-11_24_4__sc-1t2ye1d-2"
+  componentId: "core-11_25_1__sc-1t2ye1d-2"
 })(["align-self:center;", ""], function (_ref) {
   var $hasActions = _ref.$hasActions;
   return $hasActions && css(["margin-right:", "px;"], spacing.lg);
 });
 export var StyledText = /*#__PURE__*/styled.span.withConfig({
   displayName: "StyledText",
-  componentId: "core-11_24_4__sc-1t2ye1d-3"
+  componentId: "core-11_25_1__sc-1t2ye1d-3"
 })(["> h1,> h2,> h3{display:inline;}"]);
 export var StyledTitlePill = /*#__PURE__*/styled.span.withConfig({
   displayName: "StyledTitlePill",
-  componentId: "core-11_24_4__sc-1t2ye1d-4"
+  componentId: "core-11_25_1__sc-1t2ye1d-4"
 })(["margin-left:", "px;", "{vertical-align:text-top;}"], spacing.sm, StyledPill);
 export var StyledTitleActions = /*#__PURE__*/styled(StyledActions).withConfig({
   displayName: "StyledTitleActions",
-  componentId: "core-11_24_4__sc-1t2ye1d-5"
+  componentId: "core-11_25_1__sc-1t2ye1d-5"
 })(["margin-left:auto;"]);
 export var StyledSubtext = /*#__PURE__*/styled(Typography).withConfig({
   displayName: "StyledSubtext",
-  componentId: "core-11_24_4__sc-1t2ye1d-6"
+  componentId: "core-11_25_1__sc-1t2ye1d-6"
 })(["display:block;"]);
 //# sourceMappingURL=Title.styles.js.map

package/dist/Toast/Toast.styles.js

@@ -7,7 +7,7 @@ import { getShadow } from '../_styles/shadows';
 import { spacing } from '../_styles/spacing';
 export var StyledToast = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledToast",
-  componentId: "core-11_24_4__sc-1l6lk2n-0"
+  componentId: "core-11_25_1__sc-1l6lk2n-0"
 })(["", " align-items:center;background-color:", ";border-radius:", "px;color:", ";display:flex;min-height:48px;padding:", "px ", "px;width:550px;"], getShadow(4, 'bottom'), function (_ref) {
   var $variant = _ref.$variant;
   return $variant === 'success' ? colors.green30 : colors.red50;
@@ -16,13 +16,13 @@ export var StyledToast = /*#__PURE__*/styled.div.withConfig({
 // $legacy is direct string inside Toast. Next is with subcomponents
 export var StyledToastText = /*#__PURE__*/styled.span.withConfig({
   displayName: "StyledToastText",
-  componentId: "core-11_24_4__sc-1l6lk2n-1"
+  componentId: "core-11_25_1__sc-1l6lk2n-1"
 })(["", " font-weight:", ";overflow:hidden;", ""], getTypographyIntent('body'), typographyWeights.semibold, function (_ref2) {
   var $legacy = _ref2.$legacy;
   return $legacy ? "margin-left: ".concat(spacing.lg, "px;") : "padding: 0 ".concat(spacing.lg, "px;");
 });
 export var StyledToastButton = /*#__PURE__*/styled(Button).withConfig({
   displayName: "StyledToastButton",
-  componentId: "core-11_24_4__sc-1l6lk2n-2"
+  componentId: "core-11_25_1__sc-1l6lk2n-2"
 })(["line-height:0;color:", ";padding:0;margin-left:auto;"], colors.white);
 //# sourceMappingURL=Toast.styles.js.map

package/dist/ToggleButton/ToggleButton.styles.js

@@ -3,7 +3,7 @@ import { Button } from '../Button/Button';
 import { colors } from '../_styles/colors';
 export var StyledToggleButton = /*#__PURE__*/styled(Button).withConfig({
   displayName: "StyledToggleButton",
-  componentId: "core-11_24_4__sc-1x59fxi-0"
+  componentId: "core-11_25_1__sc-1x59fxi-0"
 })(["", "}"], function (_ref) {
   var $selected = _ref.$selected;
   return $selected && css(["background-color:", ";color:", ";&:hover{background-color:", ";color:", ";}&:focus{background-color:", ";color:", ";}&:disabled{background-color:", ";color:", ";}"], colors.blue50, colors.white, colors.blue40, colors.white, colors.blue50, colors.white, colors.blue85, colors.white);

package/dist/Token/Token.styles.js

@@ -6,15 +6,15 @@ import { getEllipsis, getFocus } from '../_styles/mixins';
 import { spacing } from '../_styles/spacing';
 export var StyledLabel = /*#__PURE__*/styled.span.withConfig({
   displayName: "StyledLabel",
-  componentId: "core-11_24_4__sc-zqi94b-0"
+  componentId: "core-11_25_1__sc-zqi94b-0"
 })(["", " ", " flex:0 1 auto;"], getTypographyIntent('body'), getEllipsis);
 export var StyledRemove = /*#__PURE__*/styled(Clear).withConfig({
   displayName: "StyledRemove",
-  componentId: "core-11_24_4__sc-zqi94b-1"
+  componentId: "core-11_25_1__sc-zqi94b-1"
 })(["border-radius:100%;cursor:pointer;flex:0 0 auto;height:16px;margin:0 -", "px 0 ", "px;width:16px;&:hover{background:", ";color:", ";}"], spacing.sm, spacing.sm, colors.white, colors.blue40);
 export var StyledToken = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledToken",
-  componentId: "core-11_24_4__sc-zqi94b-2"
+  componentId: "core-11_25_1__sc-zqi94b-2"
 })(["align-items:center;background-color:", ";border-radius:200px;border:1px solid transparent;color:", ";cursor:default;display:inline-flex;height:24px;line-height:1;max-width:360px;min-width:48px;padding:", "px ", "px;&:hover,&.hover{background-color:", ";}", " ", " ", ""], colors.blue50, colors.white, spacing.xs, spacing.md, colors.blue45, function (_ref) {
   var _ref$$focused = _ref.$focused,
     $focused = _ref$$focused === void 0 ? false : _ref$$focused,

package/dist/ToolHeader/ActionIcon.d.ts

@@ -1,5 +1,5 @@
-/// <reference types="react" />
+import React from 'react';
 import type { ActionIconPolyType, ActionIconProps, ActionIconRef } from './ActionIcon.types';
-declare function ActionIconInner<T extends ActionIconPolyType>(props: ActionIconProps<T>, ref: ActionIconRef<T>): JSX.Element;
+declare function ActionIconInner<T extends ActionIconPolyType>(props: ActionIconProps<T>, ref: ActionIconRef<T>): React.JSX.Element;
 export declare const ActionIcon: <Role extends ActionIconPolyType>(props: ActionIconProps<Role>) => ReturnType<typeof ActionIconInner>;
 export {};

package/dist/ToolHeader/ToolHeader.d.ts

@@ -2,7 +2,7 @@ import React from 'react';
 import type { DivAttributes, Props, SVGAttributes } from '../_utils/types';
 import type { ToolHeaderBadgeProps, ToolHeaderIconProps, ToolHeaderSettingsActionPolyType, ToolHeaderSettingsActionProps, ToolHeaderSettingsActionRef } from './ToolHeader.types';
 export declare const Icon: React.ForwardRefExoticComponent<SVGAttributes & ToolHeaderIconProps & React.RefAttributes<HTMLDivElement>>;
-declare function SettingsActionInner<Role extends ToolHeaderSettingsActionPolyType>(props: ToolHeaderSettingsActionProps<Role>, ref: ToolHeaderSettingsActionRef<Role>): JSX.Element;
+declare function SettingsActionInner<Role extends ToolHeaderSettingsActionPolyType>(props: ToolHeaderSettingsActionProps<Role>, ref: ToolHeaderSettingsActionRef<Role>): React.JSX.Element;
 export declare const Title: import("styled-components").StyledComponent<React.ForwardRefExoticComponent<import("../Semantic/Semantic.types").HeadingProps & React.RefAttributes<HTMLHeadingElement>>, any, {}, never>;
 export declare const Tabs: React.ForwardRefExoticComponent<DivAttributes & Props & React.RefAttributes<HTMLDivElement>>;
 export declare const Actions: import("styled-components").StyledComponent<"div", any, {}, never>;
@@ -16,7 +16,7 @@ export declare const Actions: import("styled-components").StyledComponent<"div",
  * @see https://core.procore.com/latest/web/components/pill/react/
  */
 export declare const Badge: React.ForwardRefExoticComponent<DivAttributes & ToolHeaderBadgeProps & React.RefAttributes<HTMLDivElement>>;
-export declare const ToolHeader: React.ForwardRefExoticComponent<Pick<any, string | number | symbol> & React.RefAttributes<HTMLDivElement>> & {
+export declare const ToolHeader: React.ForwardRefExoticComponent<Omit<any, "ref"> & React.RefAttributes<HTMLDivElement>> & {
     Icon: React.ForwardRefExoticComponent<SVGAttributes & ToolHeaderIconProps & React.RefAttributes<HTMLDivElement>>;
     Title: import("styled-components").StyledComponent<React.ForwardRefExoticComponent<import("../Semantic/Semantic.types").HeadingProps & React.RefAttributes<HTMLHeadingElement>>, any, {}, never>;
     Tabs: React.ForwardRefExoticComponent<DivAttributes & Props & React.RefAttributes<HTMLDivElement>>;

package/dist/ToolHeader/ToolHeader.styles.js

@@ -5,7 +5,7 @@ import { colors } from '../_styles/colors';
 import { spacing } from '../_styles/spacing';
 export var StyledHeaderBadge = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledHeaderBadge",
-  componentId: "core-11_24_4__sc-1jpjx47-0"
+  componentId: "core-11_25_1__sc-1jpjx47-0"
 })(["", " border-radius:10px;border-style:solid;border-width:1px;display:inline-block;margin-bottom:", "px;padding:1px ", "px;", ""], getTypographyIntent('small'), spacing.sm, spacing.sm, function (_ref) {
   var $variant = _ref.$variant;
   if ($variant) {
@@ -18,22 +18,22 @@ export var StyledHeaderBadge = /*#__PURE__*/styled.div.withConfig({
 // TODO in v12 remove cursor: pointer;
 export var StyledToolHeaderIconContainer = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledToolHeaderIconContainer",
-  componentId: "core-11_24_4__sc-1jpjx47-1"
+  componentId: "core-11_25_1__sc-1jpjx47-1"
 })(["color:", ";cursor:pointer;display:inline-flex;flex:0 0 auto;"], colors.orange50);
 export var StyledHeaderTabs = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledHeaderTabs",
-  componentId: "core-11_24_4__sc-1jpjx47-2"
+  componentId: "core-11_25_1__sc-1jpjx47-2"
 })(["align-self:flex-end;flex:1 1 auto;min-width:100px;overflow:hidden;"]);
 export var StyledHeaderActions = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledHeaderActions",
-  componentId: "core-11_24_4__sc-1jpjx47-3"
+  componentId: "core-11_25_1__sc-1jpjx47-3"
 })(["flex:0 0 auto;margin-left:auto;padding-left:", "px;"], spacing.lg);
 export var StyledToolHeaderTitle = /*#__PURE__*/styled(H1).withConfig({
   displayName: "StyledToolHeaderTitle",
-  componentId: "core-11_24_4__sc-1jpjx47-4"
+  componentId: "core-11_25_1__sc-1jpjx47-4"
 })(["margin-right:", "px;white-space:nowrap;"], spacing.xl);
 export var StyledToolHeader = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledToolHeader",
-  componentId: "core-11_24_4__sc-1jpjx47-5"
+  componentId: "core-11_25_1__sc-1jpjx47-5"
 })(["align-items:center;display:flex;min-height:36px;width:100%;", " + ", ",a + ", ",button + ", "{margin-left:", "px;}"], StyledToolHeaderIconContainer, StyledToolHeaderTitle, StyledToolHeaderTitle, StyledToolHeaderTitle, spacing.lg);
 //# sourceMappingURL=ToolHeader.styles.js.map

package/dist/Tooltip/Tooltip.styles.js

@@ -6,10 +6,10 @@ import { getShadow } from '../_styles/shadows';
 import { spacing } from '../_styles/spacing';
 export var StyledTooltip = /*#__PURE__*/styled.span.withConfig({
   displayName: "StyledTooltip",
-  componentId: "core-11_24_4__sc-1fawsi4-0"
+  componentId: "core-11_25_1__sc-1fawsi4-0"
 })(["", " color:", ";max-width:200px;padding:", "px ", "px;position:relative;word-wrap:break-word;overflow-wrap:break-word;white-space:normal;"], getTypographyIntent('small'), colors.white, spacing.sm, spacing.md);
 export var StyledContainer = /*#__PURE__*/styled.span.withConfig({
   displayName: "StyledContainer",
-  componentId: "core-11_24_4__sc-1fawsi4-1"
+  componentId: "core-11_25_1__sc-1fawsi4-1"
 })(["display:inline-flex;background-color:", ";border-radius:", "px;", " & + [data-overlay-arrow]{background:", ";}"], colors.gray15, borderRadius.md, getShadow(3, 'bottom'), colors.gray15);
 //# sourceMappingURL=Tooltip.styles.js.map

package/dist/Tree/Tree.hooks.js

@@ -46,6 +46,48 @@ export function useTree(_ref) {
     isLoading = _useSet.has,
     startLoading = _useSet.add,
     stopLoading = _useSet.remove;
+  var handleChange = React.useCallback(function (selectedNodes) {
+    return onSelect(Array.from(selectedNodes).map(getNodeById));
+  }, [getNodeById, onSelect]);
+  var _useSet2 = useSet({
+      initialValue: new Set(selected),
+      onChange: handleChange
+    }),
+    selectedIds = _useSet2.collection,
+    isSelected = _useSet2.has,
+    addSelected = _useSet2.add,
+    removeSelected = _useSet2.remove,
+    setSelected = _useSet2.setCollection;
+  var toggleSingleSelected = React.useCallback(function (nodeId) {
+    setSelected(new Set([nodeId]));
+  }, [setSelected]);
+  var toggleSelected = React.useCallback(function (nodeId) {
+    if (!isSelected(nodeId)) {
+      if (selectedIds.size < selectionLimit) {
+        addSelected(nodeId);
+      }
+    } else {
+      removeSelected(nodeId);
+    }
+  }, [addSelected, isSelected, removeSelected, selectedIds.size, selectionLimit]);
+  var toggleSelection = React.useMemo(function () {
+    return multiple ? toggleSelected : toggleSingleSelected;
+  }, [multiple, toggleSelected, toggleSingleSelected]);
+  var handleSelection = React.useCallback(function (node) {
+    return toggleSelection(node.id);
+  }, [toggleSelection]);
+
+  /* eslint-disable react-hooks/exhaustive-deps */
+  React.useEffect(function () {
+    Array.from(selectedIds).filter(function (id) {
+      return !selected.includes(id);
+    }).forEach(removeSelected);
+    selected.filter(function (id) {
+      return !isSelected(id);
+    }).forEach(addSelected);
+  }, [selected]);
+  /* eslint-enable react-hooks/exhaustive-deps */
+
   var handleExpand = React.useCallback( /*#__PURE__*/function () {
     var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(nodeId) {
       return _regeneratorRuntime().wrap(function _callee$(_context) {
@@ -85,49 +127,29 @@ export function useTree(_ref) {
   var expandedIds = React.useMemo(function () {
     if (autoExpandParent) {
       return nodes.filter(function (node) {
-        return expanded.concat(selected).includes(node.id);
+        return expanded.concat(Array.from(selectedIds)).includes(node.id);
       }).reduce(getExpandedIds, []);
     }
     return expanded;
-  }, [autoExpandParent, expanded, getExpandedIds, nodes, selected]);
-  var _useSet2 = useSet({
+  }, [autoExpandParent, expanded, getExpandedIds, nodes, selectedIds]);
+  var _useSet3 = useSet({
       initialValue: new Set(expandedIds),
       onAdd: handleExpand,
       onRemove: handleCollapse
     }),
-    isExpanded = _useSet2.has,
-    toggleExpanded = _useSet2.toggle,
-    setExpanded = _useSet2.setCollection;
-  var handleChange = React.useCallback(function (selectedNodes) {
-    return onSelect(Array.from(selectedNodes).map(getNodeById));
-  }, [getNodeById, onSelect]);
-  var _useSet3 = useSet({
-      initialValue: new Set(selected),
-      onChange: handleChange
-    }),
-    selectedIds = _useSet3.collection,
-    isSelected = _useSet3.has,
-    addSelected = _useSet3.add,
-    removeSelected = _useSet3.remove,
-    setSelected = _useSet3.setCollection;
-  var toggleSingleSelected = React.useCallback(function (nodeId) {
-    setSelected(new Set([nodeId]));
-  }, [setSelected]);
-  var toggleSelected = React.useCallback(function (nodeId) {
-    if (!isSelected(nodeId)) {
-      if (selectedIds.size < selectionLimit) {
-        addSelected(nodeId);
-      }
-    } else {
-      removeSelected(nodeId);
-    }
-  }, [addSelected, isSelected, removeSelected, selectedIds.size, selectionLimit]);
-  var toggleSelection = React.useMemo(function () {
-    return multiple ? toggleSelected : toggleSingleSelected;
-  }, [multiple, toggleSelected, toggleSingleSelected]);
-  var handleSelection = React.useCallback(function (node) {
-    return toggleSelection(node.id);
-  }, [toggleSelection]);
+    addExpanded = _useSet3.add,
+    isExpanded = _useSet3.has,
+    toggleExpanded = _useSet3.toggle,
+    setExpanded = _useSet3.setCollection;
+
+  /* eslint-disable react-hooks/exhaustive-deps */
+  React.useEffect(function () {
+    expandedIds.filter(function (id) {
+      return !isExpanded(id);
+    }).forEach(addExpanded);
+  }, [expandedIds]);
+  /* eslint-enable react-hooks/exhaustive-deps */
+
   var listNavigation = useListNavigation({
     circular: false,
     initialIndex: 0,