@procore/core-react 12.53.4 → 12.54.0

package/dist/Panel/Panel.styles.js

@@ -1,5 +1,6 @@
 import styled, { css } from 'styled-components';
 import { Card } from '../Card';
+import { mediaBreakpointsDown } from '../PageLayout/PageLayout.utils';
 import { StyledRequiredContainer } from '../Required/Required.styles';
 import { StyledSection, StyledSectionInner } from '../Section/Section.styles';
 import { H2 } from '../Semantic';
@@ -9,18 +10,18 @@ import { spacing } from '../_styles/spacing';
 var headerActionSize = 36;
 var buttonShadowWidth = 2;
 var gutter = /*#__PURE__*/css(["> * + *{margin-left:", "px;}"], spacing.sm);
-var panel = /*#__PURE__*/css(["display:flex;padding:", "px;background:", ";"], spacing.lg, colors.white);
+var panel = /*#__PURE__*/css(["display:flex;padding:", "px;background:", ";@media ", "{flex-wrap:wrap;row-gap:", "px;}"], spacing.lg, colors.white, mediaBreakpointsDown.tabletMd, spacing.sm);
 export var StyledHeader = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledHeader",
-  componentId: "core-12_53_4__sc-lidix2-0"
-})(["border-bottom:1px solid ", ";", ""], colors.gray85, panel);
+  componentId: "core-12_54_0__sc-lidix2-0"
+})(["border-bottom:1px solid ", ";", " @media ", "{flex-wrap:nowrap;}@media ", "{flex-wrap:wrap;}"], colors.gray85, panel, mediaBreakpointsDown.tabletMd, mediaBreakpointsDown.tabletSm);
 export var StyledTitle = /*#__PURE__*/styled(H2).withConfig({
   displayName: "StyledTitle",
-  componentId: "core-12_53_4__sc-lidix2-1"
-})(["flex-grow:1;"]);
+  componentId: "core-12_54_0__sc-lidix2-1"
+})(["flex-grow:1;min-width:0;@media ", "{flex-basis:100%;order:1;}"], mediaBreakpointsDown.tabletSm);
 export var StyledHeaderBackAction = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledHeaderBackAction",
-  componentId: "core-12_53_4__sc-lidix2-2"
+  componentId: "core-12_54_0__sc-lidix2-2"
 })(["transition:all 300ms ease-out;flex-shrink:0;width:", "px;margin-right:", "px;opacity:", ";transform:translateX( ", "px );"], function (_ref) {
   var $active = _ref.$active;
   return $active ? headerActionSize : 0;
@@ -36,38 +37,38 @@ export var StyledHeaderBackAction = /*#__PURE__*/styled.div.withConfig({
 });
 export var StyledMoreMenu = /*#__PURE__*/styled(Card).withConfig({
   displayName: "StyledMoreMenu",
-  componentId: "core-12_53_4__sc-lidix2-3"
+  componentId: "core-12_54_0__sc-lidix2-3"
 })(["max-height:128px;"]);
 export var StyledHeaderActions = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledHeaderActions",
-  componentId: "core-12_53_4__sc-lidix2-4"
-})(["display:flex;margin-left:", "px;flex-shrink:0;", ""], spacing.lg, gutter);
+  componentId: "core-12_54_0__sc-lidix2-4"
+})(["display:flex;margin-left:", "px;flex-shrink:0;", " @media ", "{margin-left:auto;}"], spacing.lg, gutter, mediaBreakpointsDown.tabletSm);
 export var StyledCloseButton = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledCloseButton",
-  componentId: "core-12_53_4__sc-lidix2-5"
-})(["margin-left:", "px;"], spacing.sm);
+  componentId: "core-12_54_0__sc-lidix2-5"
+})(["margin-left:", "px;flex-shrink:0;@media ", "{", " + &{margin-left:auto;}}"], spacing.sm, mediaBreakpointsDown.tabletSm, StyledTitle);
 export var StyledBody = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledBody",
-  componentId: "core-12_53_4__sc-lidix2-6"
+  componentId: "core-12_54_0__sc-lidix2-6"
 })(["height:100%;background:", ";overflow-y:auto;> ", "{margin:", "px;}&:focus-visible{", "}> ", "{padding-left:", "px;padding-right:", "px;", "{padding-left:0;padding-right:0;}&:first-child > ", "{padding-top:", "px;}}"], function (_ref5) {
   var secondaryBgColor = _ref5.secondaryBgColor;
   return secondaryBgColor ? colors.gray96 : colors.white;
 }, StyledRequiredContainer, spacing.lg, getFocusInset(), StyledSection, spacing.lg, spacing.lg, StyledSection, StyledSectionInner, spacing.lg);
 export var StyledPanel = /*#__PURE__*/styled.aside.withConfig({
   displayName: "StyledPanel",
-  componentId: "core-12_53_4__sc-lidix2-7"
+  componentId: "core-12_54_0__sc-lidix2-7"
 })(["display:flex;flex-direction:column;width:100%;height:100%;background:", ";overflow:hidden;"], colors.white);
 export var StyledFooterNotation = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledFooterNotation",
-  componentId: "core-12_53_4__sc-lidix2-8"
+  componentId: "core-12_54_0__sc-lidix2-8"
 })(["flex-grow:1;"]);
 export var StyledFooterActions = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledFooterActions",
-  componentId: "core-12_53_4__sc-lidix2-9"
+  componentId: "core-12_54_0__sc-lidix2-9"
 })(["", ""], gutter);
 export var StyledFooter = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledFooter",
-  componentId: "core-12_53_4__sc-lidix2-10"
+  componentId: "core-12_54_0__sc-lidix2-10"
 })(["border-top:1px solid ", ";justify-content:flex-end;", " ", ""], colors.gray85, panel, function (_ref6) {
   var $hasShadow = _ref6.$hasShadow;
   return $hasShadow && css(["box-shadow:0 -4px 6px 0 #0000001a;z-index:1;"]);

package/dist/Panel/Panel.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Panel.styles.js","names":["styled","css","Card","StyledRequiredContainer","StyledSection","StyledSectionInner","H2","colors","getFocusInset","spacing","headerActionSize","buttonShadowWidth","gutter","sm","panel","lg","white","StyledHeader","div","withConfig","displayName","componentId","gray85","StyledTitle","StyledHeaderBackAction","_ref","$active","_ref2","_ref3","_ref4","StyledMoreMenu","StyledHeaderActions","StyledCloseButton","StyledBody","_ref5","secondaryBgColor","gray96","StyledPanel","aside","StyledFooterNotation","StyledFooterActions","StyledFooter","_ref6","$hasShadow"],"sources":["../../src/Panel/Panel.styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport { Card } from '../Card'\nimport { StyledRequiredContainer } from '../Required/Required.styles'\nimport { StyledSection, StyledSectionInner } from '../Section/Section.styles'\nimport { H2 } from '../Semantic'\nimport { colors } from '../_styles/colors'\nimport { getFocusInset } from '../_styles/mixins'\nimport { spacing } from '../_styles/spacing'\n\nconst headerActionSize = 36\nconst buttonShadowWidth = 2\n\nconst gutter = css`\n  > * + * {\n    margin-left: ${spacing.sm}px;\n  }\n`\n\nconst panel = css`\n  display: flex;\n  padding: ${spacing.lg}px;\n  background: ${colors.white};\n`\n\nexport const StyledHeader = styled.div`\n  border-bottom: 1px solid ${colors.gray85};\n\n  ${panel}\n`\n\nexport const StyledTitle = styled(H2)`\n  flex-grow: 1;\n`\n\nexport const StyledHeaderBackAction = styled.div<{ $active: boolean }>`\n  transition: all 300ms ease-out;\n  flex-shrink: 0;\n\n  width: ${({ $active }) => ($active ? headerActionSize : 0)}px;\n  margin-right: ${({ $active }) => ($active ? spacing.lg : 0)}px;\n  opacity: ${({ $active }) => ($active ? 1 : 0)};\n  transform: translateX(\n    ${({ $active }) =>\n      $active ? 0 : -(spacing.lg + headerActionSize + buttonShadowWidth)}px\n  );\n`\n\nexport const StyledMoreMenu = styled(Card)`\n  max-height: 128px;\n`\n\nexport const StyledHeaderActions = styled.div`\n  display: flex;\n  margin-left: ${spacing.lg}px;\n  flex-shrink: 0;\n\n  ${gutter}\n`\n\nexport const StyledCloseButton = styled.div`\n  margin-left: ${spacing.sm}px;\n`\n\nexport const StyledBody = styled.div<{ secondaryBgColor?: boolean }>`\n  height: 100%;\n  background: ${({ secondaryBgColor }) =>\n    secondaryBgColor ? colors.gray96 : colors.white};\n  overflow-y: auto;\n\n  > ${StyledRequiredContainer} {\n    margin: ${spacing.lg}px;\n  }\n\n  &:focus-visible {\n    ${getFocusInset()}\n  }\n\n  > ${StyledSection} {\n    padding-left: ${spacing.lg}px;\n    padding-right: ${spacing.lg}px;\n\n    ${StyledSection} {\n      padding-left: 0;\n      padding-right: 0;\n    }\n\n    &:first-child > ${StyledSectionInner} {\n      padding-top: ${spacing.lg}px;\n    }\n  }\n`\n\nexport const StyledPanel = styled.aside`\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n  height: 100%;\n  background: ${colors.white};\n  overflow: hidden;\n`\n\nexport const StyledFooterNotation = styled.div`\n  flex-grow: 1;\n`\n\nexport const StyledFooterActions = styled.div`\n  ${gutter}\n`\n\nexport const StyledFooter = styled.div<{ $hasShadow: boolean }>`\n  border-top: 1px solid ${colors.gray85};\n  justify-content: flex-end;\n\n  ${panel}\n\n  ${({ $hasShadow }) =>\n    $hasShadow &&\n    css`\n      box-shadow: 0 -4px 6px 0 #0000001a;\n      z-index: 1;\n    `}\n`\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"Panel.styles.js","names":["styled","css","Card","mediaBreakpointsDown","StyledRequiredContainer","StyledSection","StyledSectionInner","H2","colors","getFocusInset","spacing","headerActionSize","buttonShadowWidth","gutter","sm","panel","lg","white","tabletMd","StyledHeader","div","withConfig","displayName","componentId","gray85","tabletSm","StyledTitle","StyledHeaderBackAction","_ref","$active","_ref2","_ref3","_ref4","StyledMoreMenu","StyledHeaderActions","StyledCloseButton","StyledBody","_ref5","secondaryBgColor","gray96","StyledPanel","aside","StyledFooterNotation","StyledFooterActions","StyledFooter","_ref6","$hasShadow"],"sources":["../../src/Panel/Panel.styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport { Card } from '../Card'\nimport { mediaBreakpointsDown } from '../PageLayout/PageLayout.utils'\nimport { StyledRequiredContainer } from '../Required/Required.styles'\nimport { StyledSection, StyledSectionInner } from '../Section/Section.styles'\nimport { H2 } from '../Semantic'\nimport { colors } from '../_styles/colors'\nimport { getFocusInset } from '../_styles/mixins'\nimport { spacing } from '../_styles/spacing'\n\nconst headerActionSize = 36\nconst buttonShadowWidth = 2\n\nconst gutter = css`\n  > * + * {\n    margin-left: ${spacing.sm}px;\n  }\n`\n\nconst panel = css`\n  display: flex;\n  padding: ${spacing.lg}px;\n  background: ${colors.white};\n\n  @media ${mediaBreakpointsDown.tabletMd} {\n    flex-wrap: wrap;\n    row-gap: ${spacing.sm}px;\n  }\n`\n\nexport const StyledHeader = styled.div`\n  border-bottom: 1px solid ${colors.gray85};\n\n  ${panel}\n\n  @media ${mediaBreakpointsDown.tabletMd} {\n    flex-wrap: nowrap;\n  }\n\n  @media ${mediaBreakpointsDown.tabletSm} {\n    flex-wrap: wrap;\n  }\n`\n\nexport const StyledTitle = styled(H2)`\n  flex-grow: 1;\n  min-width: 0;\n\n  @media ${mediaBreakpointsDown.tabletSm} {\n    /* Own row, under the back, actions and close controls */\n    flex-basis: 100%;\n    order: 1;\n  }\n`\n\nexport const StyledHeaderBackAction = styled.div<{ $active: boolean }>`\n  transition: all 300ms ease-out;\n  flex-shrink: 0;\n\n  width: ${({ $active }) => ($active ? headerActionSize : 0)}px;\n  margin-right: ${({ $active }) => ($active ? spacing.lg : 0)}px;\n  opacity: ${({ $active }) => ($active ? 1 : 0)};\n  transform: translateX(\n    ${({ $active }) =>\n      $active ? 0 : -(spacing.lg + headerActionSize + buttonShadowWidth)}px\n  );\n`\n\nexport const StyledMoreMenu = styled(Card)`\n  max-height: 128px;\n`\n\nexport const StyledHeaderActions = styled.div`\n  display: flex;\n  margin-left: ${spacing.lg}px;\n  flex-shrink: 0;\n\n  ${gutter}\n\n  @media ${mediaBreakpointsDown.tabletSm} {\n    /* Right end of the controls row */\n    margin-left: auto;\n  }\n`\n\nexport const StyledCloseButton = styled.div`\n  margin-left: ${spacing.sm}px;\n  flex-shrink: 0;\n\n  @media ${mediaBreakpointsDown.tabletSm} {\n    ${StyledTitle} + & {\n      margin-left: auto;\n    }\n  }\n`\n\nexport const StyledBody = styled.div<{ secondaryBgColor?: boolean }>`\n  height: 100%;\n  background: ${({ secondaryBgColor }) =>\n    secondaryBgColor ? colors.gray96 : colors.white};\n  overflow-y: auto;\n\n  > ${StyledRequiredContainer} {\n    margin: ${spacing.lg}px;\n  }\n\n  &:focus-visible {\n    ${getFocusInset()}\n  }\n\n  > ${StyledSection} {\n    padding-left: ${spacing.lg}px;\n    padding-right: ${spacing.lg}px;\n\n    ${StyledSection} {\n      padding-left: 0;\n      padding-right: 0;\n    }\n\n    &:first-child > ${StyledSectionInner} {\n      padding-top: ${spacing.lg}px;\n    }\n  }\n`\n\nexport const StyledPanel = styled.aside`\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n  height: 100%;\n  background: ${colors.white};\n  overflow: hidden;\n`\n\nexport const StyledFooterNotation = styled.div`\n  flex-grow: 1;\n`\n\nexport const StyledFooterActions = styled.div`\n  ${gutter}\n`\n\nexport const StyledFooter = styled.div<{ $hasShadow: boolean }>`\n  border-top: 1px solid ${colors.gray85};\n  justify-content: flex-end;\n\n  ${panel}\n\n  ${({ $hasShadow }) =>\n    $hasShadow &&\n    css`\n      box-shadow: 0 -4px 6px 0 #0000001a;\n      z-index: 1;\n    `}\n`\n"],"mappings":"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","ignoreList":[]}

package/dist/Pill/Pill.styles.js

@@ -6,18 +6,18 @@ import { PillColorPalets } from './Pill.colorPalette';
 var pillButtonSize = 16;
 export var StyledPill = /*#__PURE__*/styled.span.withConfig({
   displayName: "StyledPill",
-  componentId: "core-12_53_4__sc-99e1t5-0"
+  componentId: "core-12_54_0__sc-99e1t5-0"
 })(["", " display:inline-block;padding:1px ", "px;border:1px solid;border-radius:10px;font-weight:600;& + &{margin-left:", "px;}", ""], getTypographyIntent('small'), spacing.sm, spacing.xs, function (_ref) {
   var $color = _ref.$color;
   return css(["background-color:", ";border-color:", ";color:", ";"], PillColorPalets[$color].backgroundColor, PillColorPalets[$color].borderColor, PillColorPalets[$color].color);
 });
 export var StyledRemove = /*#__PURE__*/styled(Clear).withConfig({
   displayName: "StyledRemove",
-  componentId: "core-12_53_4__sc-99e1t5-1"
+  componentId: "core-12_54_0__sc-99e1t5-1"
 })(["border-radius:100%;cursor:pointer;flex:0 0 auto;height:", "px;width:", "px;vertical-align:top;"], pillButtonSize, pillButtonSize);
 export var StyledRemoveButton = /*#__PURE__*/styled.button.withConfig({
   displayName: "StyledRemoveButton",
-  componentId: "core-12_53_4__sc-99e1t5-2"
+  componentId: "core-12_54_0__sc-99e1t5-2"
 })(["border:0;padding:0;border-radius:100%;margin:0 -", "px 0 ", "px;color:inherit;", ""], pillButtonSize / 2 - spacing.xxs, spacing.xxs, function (_ref2) {
   var $color = _ref2.$color;
   return css(["&:hover{background:", ";color:", ";}"], PillColorPalets[$color].color, PillColorPalets[$color].backgroundColor);

package/dist/PillSelect/PillSelect.styles.js

@@ -6,23 +6,23 @@ import { spacing } from '../_styles/spacing';
 var checkedIconPlaceholderWidth = 32;
 export var PillSelectOptionWrapper = /*#__PURE__*/styled.div.withConfig({
   displayName: "PillSelectOptionWrapper",
-  componentId: "core-12_53_4__sc-1ai2ze0-0"
+  componentId: "core-12_54_0__sc-1ai2ze0-0"
 })(["display:flex;align-items:center;justify-content:space-between;"]);
 export var PillSelectCheckedContainer = /*#__PURE__*/styled.div.withConfig({
   displayName: "PillSelectCheckedContainer",
-  componentId: "core-12_53_4__sc-1ai2ze0-1"
+  componentId: "core-12_54_0__sc-1ai2ze0-1"
 })(["align-items:center;color:", ";display:inline-flex;padding-left:", "px;width:", "px;"], colors.blue50, spacing.sm, checkedIconPlaceholderWidth);
 export var PillSelectLabel = /*#__PURE__*/styled(Pill).withConfig({
   displayName: "PillSelectLabel",
-  componentId: "core-12_53_4__sc-1ai2ze0-2"
+  componentId: "core-12_54_0__sc-1ai2ze0-2"
 })(["", ""], getEllipsis);
 export var PillSelectOptionLabel = /*#__PURE__*/styled(Pill).withConfig({
   displayName: "PillSelectOptionLabel",
-  componentId: "core-12_53_4__sc-1ai2ze0-3"
+  componentId: "core-12_54_0__sc-1ai2ze0-3"
 })(["min-width:0;overflow-wrap:break-word;word-break:normal;"]);
 export var PillSelectLabelWrapper = /*#__PURE__*/styled.div.withConfig({
   displayName: "PillSelectLabelWrapper",
-  componentId: "core-12_53_4__sc-1ai2ze0-4"
+  componentId: "core-12_54_0__sc-1ai2ze0-4"
 })(["display:flex;max-width:100%;pointer-events:auto;", ""], function (_ref) {
   var disabled = _ref.disabled;
   return disabled && css(["pointer-events:none;"]);

package/dist/Popover/Popover.js

@@ -45,7 +45,12 @@ function PopoverInner(_ref2, ref) {
   var overlayNode = isReactElement(overlay) ? (/*#__PURE__*/React.cloneElement(overlay, {
     placement: placement
   })) : /*#__PURE__*/React.createElement(React.Fragment, null);
-  return /*#__PURE__*/React.createElement(OverlayTrigger, _objectSpread(_objectSpread({}, props), {}, {
+  return /*#__PURE__*/React.createElement(OverlayTrigger, _objectSpread(_objectSpread({
+    // Popovers are typically hover/focus-triggered, not dropdown-like,
+    // so background scroll should not be locked by default. Can be
+    // overridden for the rare click-triggered, dropdown-like popover.
+    scrollLock: false
+  }, props), {}, {
     initialIsVisible: initialIsVisible,
     overlay: overlayNode,
     placement: placement,

package/dist/Popover/Popover.js.map

@@ -1 +1 @@
-{"version":3,"file":"Popover.js","names":["React","OverlayTrigger","addSubcomponents","isReactElement","StyledPopover","StyledPopoverContent","Content","forwardRef","_ref","ref","children","_ref$block","block","_ref$fluid","fluid","_ref$placement","placement","props","_objectWithoutProperties","_excluded","createElement","_extends","$block","$fluid","$placement","PopoverInner","_ref2","_ref2$initialIsVisibl","initialIsVisible","restoreFocusOnHide","_ref2$placement","overlay","overlayRef","role","_excluded2","overlayNode","cloneElement","Fragment","_objectSpread","shrinkOverlay","arrow","trackAriaExpanded","Popover_","displayName","Popover"],"sources":["../../src/Popover/Popover.tsx"],"sourcesContent":["import React from 'react'\nimport { OverlayTrigger } from '../OverlayTrigger/OverlayTrigger'\nimport { addSubcomponents } from '../_utils/addSubcomponents'\nimport { isReactElement } from '../_utils/isReactElement'\nimport { StyledPopover, StyledPopoverContent } from './Popover.styles'\nimport type {\n  PopoverContentProps,\n  PopoverProps,\n  PopoverRole,\n} from './Popover.types'\n\nconst Content = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement> & PopoverContentProps\n>(function Content(\n  { children, block = false, fluid = false, placement = 'top', ...props },\n  ref\n) {\n  return (\n    <StyledPopover ref={ref}>\n      <StyledPopoverContent\n        {...props}\n        $block={block}\n        $fluid={fluid}\n        $placement={placement}\n      >\n        {children}\n      </StyledPopoverContent>\n    </StyledPopover>\n  )\n})\n\nfunction PopoverInner<Role extends PopoverRole>(\n  {\n    children,\n    initialIsVisible = false,\n    restoreFocusOnHide,\n    placement = 'top',\n    overlay,\n    overlayRef,\n    role,\n    ...props\n  }: PopoverProps<Role>,\n  ref: React.ForwardedRef<HTMLElement>\n) {\n  const overlayNode = isReactElement(overlay) ? (\n    React.cloneElement(overlay, { placement })\n  ) : (\n    <React.Fragment />\n  )\n\n  return (\n    <OverlayTrigger\n      {...{\n        ...props,\n        initialIsVisible,\n        overlay: overlayNode,\n        placement,\n        role,\n        ref,\n        restoreFocusOnHide: restoreFocusOnHide ?? role === 'dialog',\n        shrinkOverlay: true,\n        arrow: true,\n        overlayRef,\n        trackAriaExpanded: true,\n      }}\n    >\n      {children}\n    </OverlayTrigger>\n  )\n}\n\nconst Popover_ = React.forwardRef(PopoverInner) as <Role extends PopoverRole>(\n  props: PopoverProps<Role>\n) => ReturnType<typeof PopoverInner>\n\n// @ts-expect-error\nPopover_.displayName = 'Popover'\n\nContent.displayName = 'Popover.Content'\n\n/**\n\n We use popovers to display more of an item’s information or details on hover.\n This may be used to show additional fields in an item’s form that aren’t shown\n by default in the UI. Oftentimes, there will be a visual queue to indicate that\n more information is available.\n\n Do not use popovers to display large amounts of information, perform data\n entry, or use as a replacement for an overflow, menu, or modal.\n\n If you want to show descriptive / educational information about an item,\n use a tooltip.\n\n @since 10.19.0\n\n @see [Storybook](https://stories.core.procore.com/?path=/story/core-react_demos-popover--demo)\n\n @see [Design Guidelines](https://design.procore.com/popover)\n\n*/\nexport const Popover = addSubcomponents({ Content }, Popover_)\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"Popover.js","names":["React","OverlayTrigger","addSubcomponents","isReactElement","StyledPopover","StyledPopoverContent","Content","forwardRef","_ref","ref","children","_ref$block","block","_ref$fluid","fluid","_ref$placement","placement","props","_objectWithoutProperties","_excluded","createElement","_extends","$block","$fluid","$placement","PopoverInner","_ref2","_ref2$initialIsVisibl","initialIsVisible","restoreFocusOnHide","_ref2$placement","overlay","overlayRef","role","_excluded2","overlayNode","cloneElement","Fragment","_objectSpread","scrollLock","shrinkOverlay","arrow","trackAriaExpanded","Popover_","displayName","Popover"],"sources":["../../src/Popover/Popover.tsx"],"sourcesContent":["import React from 'react'\nimport { OverlayTrigger } from '../OverlayTrigger/OverlayTrigger'\nimport { addSubcomponents } from '../_utils/addSubcomponents'\nimport { isReactElement } from '../_utils/isReactElement'\nimport { StyledPopover, StyledPopoverContent } from './Popover.styles'\nimport type {\n  PopoverContentProps,\n  PopoverProps,\n  PopoverRole,\n} from './Popover.types'\n\nconst Content = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement> & PopoverContentProps\n>(function Content(\n  { children, block = false, fluid = false, placement = 'top', ...props },\n  ref\n) {\n  return (\n    <StyledPopover ref={ref}>\n      <StyledPopoverContent\n        {...props}\n        $block={block}\n        $fluid={fluid}\n        $placement={placement}\n      >\n        {children}\n      </StyledPopoverContent>\n    </StyledPopover>\n  )\n})\n\nfunction PopoverInner<Role extends PopoverRole>(\n  {\n    children,\n    initialIsVisible = false,\n    restoreFocusOnHide,\n    placement = 'top',\n    overlay,\n    overlayRef,\n    role,\n    ...props\n  }: PopoverProps<Role>,\n  ref: React.ForwardedRef<HTMLElement>\n) {\n  const overlayNode = isReactElement(overlay) ? (\n    React.cloneElement(overlay, { placement })\n  ) : (\n    <React.Fragment />\n  )\n\n  return (\n    <OverlayTrigger\n      {...{\n        // Popovers are typically hover/focus-triggered, not dropdown-like,\n        // so background scroll should not be locked by default. Can be\n        // overridden for the rare click-triggered, dropdown-like popover.\n        scrollLock: false,\n        ...props,\n        initialIsVisible,\n        overlay: overlayNode,\n        placement,\n        role,\n        ref,\n        restoreFocusOnHide: restoreFocusOnHide ?? role === 'dialog',\n        shrinkOverlay: true,\n        arrow: true,\n        overlayRef,\n        trackAriaExpanded: true,\n      }}\n    >\n      {children}\n    </OverlayTrigger>\n  )\n}\n\nconst Popover_ = React.forwardRef(PopoverInner) as <Role extends PopoverRole>(\n  props: PopoverProps<Role>\n) => ReturnType<typeof PopoverInner>\n\n// @ts-expect-error\nPopover_.displayName = 'Popover'\n\nContent.displayName = 'Popover.Content'\n\n/**\n\n We use popovers to display more of an item’s information or details on hover.\n This may be used to show additional fields in an item’s form that aren’t shown\n by default in the UI. Oftentimes, there will be a visual queue to indicate that\n more information is available.\n\n Do not use popovers to display large amounts of information, perform data\n entry, or use as a replacement for an overflow, menu, or modal.\n\n If you want to show descriptive / educational information about an item,\n use a tooltip.\n\n @since 10.19.0\n\n @see [Storybook](https://stories.core.procore.com/?path=/story/core-react_demos-popover--demo)\n\n @see [Design Guidelines](https://design.procore.com/popover)\n\n*/\nexport const Popover = addSubcomponents({ Content }, Popover_)\n"],"mappings":"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","ignoreList":[]}

package/dist/Popover/Popover.styles.js

@@ -5,7 +5,7 @@ import { getShadow } from '../_styles/shadows';
 export var popoverArrowSize = 6;
 export var StyledPopoverContent = /*#__PURE__*/styled.span.withConfig({
   displayName: "StyledPopoverContent",
-  componentId: "core-12_53_4__sc-1cd0ihn-0"
+  componentId: "core-12_54_0__sc-1cd0ihn-0"
 })(["background-color:", ";border-radius:inherit;color:", ";display:inline-block;max-width:250px;position:relative;", ""], colors.white, colors.gray15, function (_ref) {
   var $block = _ref.$block,
     $fluid = _ref.$fluid;
@@ -15,6 +15,6 @@ export var StyledPopoverContent = /*#__PURE__*/styled.span.withConfig({
 });
 export var StyledPopover = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledPopover",
-  componentId: "core-12_53_4__sc-1cd0ihn-1"
+  componentId: "core-12_54_0__sc-1cd0ihn-1"
 })(["display:inline-block;border-radius:", "px;", " & + [data-overlay-arrow]{background:", ";}"], borderRadius.md, getShadow(3), colors.white);
 //# sourceMappingURL=Popover.styles.js.map

package/dist/Portal/Portal.styles.js

@@ -1,6 +1,6 @@
 import styled from 'styled-components';
 export var StyledPortal = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledPortal",
-  componentId: "core-12_53_4__sc-15o1h2-0"
+  componentId: "core-12_54_0__sc-15o1h2-0"
 })(["left:0;pointer-events:none;position:fixed;top:0;> *{pointer-events:all;}"]);
 //# sourceMappingURL=Portal.styles.js.map

package/dist/ProgressBar/ProgressBar.styles.js

@@ -7,11 +7,11 @@ var animationDelay = '300ms';
 var fadeIn = /*#__PURE__*/keyframes(["from{opacity:1;}to{opacity:0;}"]);
 export var StyledProgressBarLoader = /*#__PURE__*/styled(Loader).withConfig({
   displayName: "StyledProgressBarLoader",
-  componentId: "core-12_53_4__sc-vdy2wl-0"
+  componentId: "core-12_54_0__sc-vdy2wl-0"
 })([""]);
 export var StyledProgressBar = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledProgressBar",
-  componentId: "core-12_53_4__sc-vdy2wl-1"
+  componentId: "core-12_54_0__sc-vdy2wl-1"
 })(["background-color:", ";border-radius:", "px;border:1px solid ", ";display:block;height:", "px;margin:", "px 0;overflow:hidden;position:relative;transition:background-color 0s linear;", " ", ";"], function (_ref) {
   var $complete = _ref.$complete;
   return $complete ? colors.blue50 : colors.gray94;

package/dist/RadioButton/RadioButton.styles.js

@@ -9,7 +9,7 @@ export var dataQa = {
 var radioButtonSize = 20;
 export var StyledRadioButton = /*#__PURE__*/styled.label.withConfig({
   displayName: "StyledRadioButton",
-  componentId: "core-12_53_4__sc-nd95zs-0"
+  componentId: "core-12_54_0__sc-nd95zs-0"
 })(["color:", ";display:flex;position:relative;vertical-align:middle;& + &{margin-top:", "px;}", " ", ""], colors.gray15, spacing.md, function (_ref) {
   var $error = _ref.$error;
   return $error && css(["", ":before,", ":checked:not(:disabled) + ", ":before{border-color:", ";}", ":checked:disabled + ", ":before{border-color:", ";}"], StyledRadioButtonLabel, StyledRadioButtonInput, StyledRadioButtonLabel, colors.red50, StyledRadioButtonInput, StyledRadioButtonLabel, colors.gray85);
@@ -19,10 +19,10 @@ export var StyledRadioButton = /*#__PURE__*/styled.label.withConfig({
 });
 export var StyledRadioButtonLabel = /*#__PURE__*/styled.span.withConfig({
   displayName: "StyledRadioButtonLabel",
-  componentId: "core-12_53_4__sc-nd95zs-1"
+  componentId: "core-12_54_0__sc-nd95zs-1"
 })(["", ";cursor:default;display:flex;&:before{background:", ";border-radius:100%;border:2px solid ", ";content:'';display:inline-block;flex:0;height:", "px;min-width:", "px;width:", "px;}"], getTypographyIntent('body'), colors.white, colors.gray50, radioButtonSize, radioButtonSize, radioButtonSize);
 export var StyledRadioButtonInput = /*#__PURE__*/styled.input.withConfig({
   displayName: "StyledRadioButtonInput",
-  componentId: "core-12_53_4__sc-nd95zs-2"
+  componentId: "core-12_54_0__sc-nd95zs-2"
 })(["left:0;margin:0;opacity:0;padding:0;position:absolute;top:0;&:focus:not(:checked),&[data-qa=", "]:not(:checked){&:not(:disabled) + ", ":before{", "}}&:focus:checked:not(:disabled),&[data-qa=", "]:checked:not(:disabled){+ ", ":before{box-shadow:0 0 0 2px ", ";}}&:checked + ", ":before{border:6px solid ", ";}&:disabled + ", ":before{border-color:", ";}&:disabled:checked + ", ":before{border-color:", ";}"], dataQa.focused, StyledRadioButtonLabel, getFocus(), dataQa.focused, StyledRadioButtonLabel, colors.blue40, StyledRadioButtonLabel, colors.blue50, StyledRadioButtonLabel, colors.gray85, StyledRadioButtonLabel, colors.blue85);
 //# sourceMappingURL=RadioButton.styles.js.map

package/dist/Required/Required.styles.js

@@ -5,7 +5,7 @@ import { colors } from '../_styles/colors';
 import { spacing } from '../_styles/spacing';
 export var StyledRequiredMark = /*#__PURE__*/styled.span.withConfig({
   displayName: "StyledRequiredMark",
-  componentId: "core-12_53_4__sc-bja1ql-0"
+  componentId: "core-12_54_0__sc-bja1ql-0"
 })(["color:", ";font-weight:bold;", ""], colors.red50, function (_ref) {
   var $showLabel = _ref.$showLabel;
   if ($showLabel) {
@@ -15,10 +15,10 @@ export var StyledRequiredMark = /*#__PURE__*/styled.span.withConfig({
 });
 export var StyledRequiredContainer = /*#__PURE__*/styled.span.withConfig({
   displayName: "StyledRequiredContainer",
-  componentId: "core-12_53_4__sc-bja1ql-1"
+  componentId: "core-12_54_0__sc-bja1ql-1"
 })(["display:inline-flex;", " ", " > &{margin-left:", "px;}"], getTypographyIntent('small'), StyledCheckboxLabel, spacing.xs);
 export var StyledRequiredText = /*#__PURE__*/styled.span.withConfig({
   displayName: "StyledRequiredText",
-  componentId: "core-12_53_4__sc-bja1ql-2"
+  componentId: "core-12_54_0__sc-bja1ql-2"
 })(["font-style:italic;color:", ";margin-left:4px;"], colors.gray45);
 //# sourceMappingURL=Required.styles.js.map

package/dist/Search/Search.styles.js

@@ -33,22 +33,22 @@ export function getSearchInputStyles() {
 }
 export var StyledInput = /*#__PURE__*/styled.input.withConfig({
   displayName: "StyledInput",
-  componentId: "core-12_53_4__sc-3j8khv-0"
+  componentId: "core-12_54_0__sc-3j8khv-0"
 })(["", ""], getSearchInputStyles);
 var StyledButton = /*#__PURE__*/styled(Button).withConfig({
   displayName: "StyledButton",
-  componentId: "core-12_53_4__sc-3j8khv-1"
+  componentId: "core-12_54_0__sc-3j8khv-1"
 })(["position:absolute;top:", "px;"], buttonTop);
 export var StyledSearchButton = /*#__PURE__*/styled(StyledButton).withConfig({
   displayName: "StyledSearchButton",
-  componentId: "core-12_53_4__sc-3j8khv-2"
+  componentId: "core-12_54_0__sc-3j8khv-2"
 })([""]);
 export var StyledClearButton = /*#__PURE__*/styled(StyledButton).withConfig({
   displayName: "StyledClearButton",
-  componentId: "core-12_53_4__sc-3j8khv-3"
+  componentId: "core-12_54_0__sc-3j8khv-3"
 })([""]);
 export var StyledSearch = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledSearch",
-  componentId: "core-12_53_4__sc-3j8khv-4"
+  componentId: "core-12_54_0__sc-3j8khv-4"
 })(["position:relative;width:100%;", "{padding-right:", "px;}", "{right:", "px;}", "{right:", "px;}"], StyledInput, inputRight, StyledSearchButton, searchRight, StyledClearButton, clearRight);
 //# sourceMappingURL=Search.styles.js.map

package/dist/Section/Section.styles.js

@@ -6,15 +6,15 @@ import { getGapOutlineFocus } from '../_styles/mixins';
 import { spacing } from '../_styles/spacing';
 export var StyledSectionBanner = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledSectionBanner",
-  componentId: "core-12_53_4__sc-1lxbrwv-0"
+  componentId: "core-12_54_0__sc-1lxbrwv-0"
 })(["margin-bottom:", "px;> * + *{margin-top:", "px;}"], spacing.sm, spacing.sm);
 export var StyledSectionInner = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledSectionInner",
-  componentId: "core-12_53_4__sc-1lxbrwv-1"
+  componentId: "core-12_54_0__sc-1lxbrwv-1"
 })([""]);
 export var StyledSectionCollapseHeading = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledSectionCollapseHeading",
-  componentId: "core-12_53_4__sc-1lxbrwv-2"
+  componentId: "core-12_54_0__sc-1lxbrwv-2"
 })(["align-self:flex-start;margin-right:", "px;"], spacing.sm);
 export var sectionClassnames = {
   divide: 'section--divide',
@@ -25,11 +25,11 @@ export var sectionClassnames = {
 };
 export var StyledSection = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledSection",
-  componentId: "core-12_53_4__sc-1lxbrwv-3"
+  componentId: "core-12_54_0__sc-1lxbrwv-3"
 })(["padding-left:", "px;padding-right:", "px;padding-bottom:", "px;& > ", "{padding-top:", "px;}&.", "{& > ", "{border-top:1px solid ", ";}}&:first-child > ", "{border-top:0;}& &{padding-left:0;padding-right:0;&:first-child > ", "{border-top:1px solid ", ";}&:last-child{padding-bottom:0;}}", ":last-of-type{margin-bottom:", "px;}", " + &&&{padding-top:", "px;}"], spacing.lg, spacing.lg, spacing.lg, StyledSectionInner, spacing.lg, sectionClassnames.divide, StyledSectionInner, colors.gray85, StyledSectionInner, StyledSectionInner, colors.gray85, StyledFormRow, spacing.lg * -1, StyledFormRow, spacing.xs);
 export var StyledSectionContentRegion = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledSectionContentRegion",
-  componentId: "core-12_53_4__sc-1lxbrwv-4"
+  componentId: "core-12_54_0__sc-1lxbrwv-4"
 })(["padding-top:", "px;&:focus-visible{", "}", " ", " & > :not(", ") + ", "{padding-top:", "px;}", " ", " &:last-of-type{padding-bottom:0;}"], spacing.sm, getGapOutlineFocus('inside'), function (_ref) {
   var $closed = _ref.$closed;
   return $closed && css(["padding-top:0;"]);
@@ -39,10 +39,10 @@ export var StyledSectionContentRegion = /*#__PURE__*/styled.div.withConfig({
 }, StyledSection, StyledSection, spacing.xl, StyledSection, StyledSection);
 export var StyledSectionHeader = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledSectionHeader",
-  componentId: "core-12_53_4__sc-1lxbrwv-5"
+  componentId: "core-12_54_0__sc-1lxbrwv-5"
 })(["align-items:center;display:flex;min-height:36px;word-break:break-word;"]);
 export var StyledTitle = /*#__PURE__*/styled(Title).withConfig({
   displayName: "StyledTitle",
-  componentId: "core-12_53_4__sc-1lxbrwv-6"
+  componentId: "core-12_54_0__sc-1lxbrwv-6"
 })(["width:100%;"]);
 //# sourceMappingURL=Section.styles.js.map

package/dist/SegmentedController/SegmentedController.styles.js

@@ -7,7 +7,7 @@ import { spacing } from '../_styles/spacing';
 export var segmentedControllerStackBreakpoint = 320;
 export var StyledContainer = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledContainer",
-  componentId: "core-12_53_4__sc-ocai3-0"
+  componentId: "core-12_54_0__sc-ocai3-0"
 })(["align-items:center;display:", ";height:36px;justify-content:center;width:", ";@media (max-width:", "px){align-items:stretch;flex-direction:column;height:auto;}"], function (_ref) {
   var $block = _ref.$block;
   return $block ? 'flex' : 'inline-flex';
@@ -17,7 +17,7 @@ export var StyledContainer = /*#__PURE__*/styled.div.withConfig({
 }, segmentedControllerStackBreakpoint);
 export var StyledSegment = /*#__PURE__*/styled.label.withConfig({
   displayName: "StyledSegment",
-  componentId: "core-12_53_4__sc-ocai3-1"
+  componentId: "core-12_54_0__sc-ocai3-1"
 })(["align-items:center;border-radius:0;border:1px solid ", ";cursor:pointer;display:flex;flex:1 1 auto;height:100%;justify-content:center;min-width:0;outline:0;padding:0 ", "px;@media (width <= ", "px){padding:0 ", "px;}position:relative;background-color:", ";color:", ";&:hover{background-color:", ";border-color:", ";color:", ";}", " ", ";"], colors.gray85, spacing.md, breakpointRawMinWidthValues.tabletMd, spacing.sm, colors.white, colors.gray45, colors.gray94, colors.gray85, colors.gray45, function (_ref3) {
   var _ref3$$focused = _ref3.$focused,
     $focused = _ref3$$focused === void 0 ? false : _ref3$$focused;
@@ -39,10 +39,10 @@ export var StyledSegment = /*#__PURE__*/styled.label.withConfig({
 });
 export var StyledSegmentDisabledInteractiveWrapper = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledSegmentDisabledInteractiveWrapper",
-  componentId: "core-12_53_4__sc-ocai3-2"
+  componentId: "core-12_54_0__sc-ocai3-2"
 })(["align-self:stretch;display:flex;flex:1 1 auto;min-height:36px;min-width:0;margin-right:-1px;&:first-child ", "{border-bottom-left-radius:", "px;border-top-left-radius:", "px;}&:last-child ", "{border-bottom-right-radius:", "px;border-top-right-radius:", "px;}@media (max-width:", "px){margin-bottom:-1px;margin-right:0;&:first-child ", "{border-bottom-left-radius:0;border-top-right-radius:", "px;}&:last-child{margin-bottom:0;", "{border-bottom-left-radius:", "px;border-top-right-radius:0;}}}"], StyledSegment, borderRadius.md, borderRadius.md, StyledSegment, borderRadius.md, borderRadius.md, segmentedControllerStackBreakpoint, StyledSegment, borderRadius.md, StyledSegment, borderRadius.md);
 export var StyledLabel = /*#__PURE__*/styled.span.withConfig({
   displayName: "StyledLabel",
-  componentId: "core-12_53_4__sc-ocai3-3"
+  componentId: "core-12_54_0__sc-ocai3-3"
 })(["", ";display:-webkit-box;text-align:center;max-width:100%;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:normal;-webkit-box-orient:vertical;-webkit-line-clamp:2;"], getTypographyIntent('body'));
 //# sourceMappingURL=SegmentedController.styles.js.map

package/dist/Select/Select.js

@@ -115,7 +115,7 @@ export var Button = /*#__PURE__*/React.forwardRef(function Button(_ref3, ref) {
     "aria-disabled": disabled,
     tabIndex: disabled ? -1 : tabIndex,
     "aria-expanded": ariaExpanded,
-    "aria-controls": menuId,
+    "aria-controls": ariaExpanded ? menuId : undefined,
     "aria-haspopup": "listbox",
     "aria-invalid": error,
     "aria-labelledby": ariaLabelledBy,
@@ -141,7 +141,10 @@ export var Button = /*#__PURE__*/React.forwardRef(function Button(_ref3, ref) {
   }, /*#__PURE__*/React.createElement(OverflowObserver, null, function (_ref5) {
     var isOverflowingX = _ref5.isOverflowingX,
       overflowRef = _ref5.ref;
-    var showTooltip = !disabled && isOverflowingX && !isMenuOpened;
+    // `open` is checked alongside `isMenuOpened` because the latter
+    // is only set in `afterShow()`, leaving a window where the menu
+    // is on screen but the tooltip still thinks it is closed.
+    var showTooltip = !disabled && isOverflowingX && !isMenuOpened && !open;
     var trigger = /*#__PURE__*/React.createElement(StyledSelectButtonLabel, {
       id: labelId,
       "data-qa": qa === null || qa === void 0 ? void 0 : qa.label,