@procore/core-react 12.38.0 → 12.40.0

package/dist/ToolHeader/ToolHeader.js.map

@@ -1 +1 @@
-{"version":3,"file":"ToolHeader.js","names":["Cog","React","Tabs","TabsBase","useI18nContext","addSubcomponents","ActionIcon","StyledHeaderActions","StyledHeaderBadge","StyledHeaderTabs","StyledToolHeader","StyledToolHeaderIconContainer","StyledToolHeaderTitle","ToolHeader_","forwardRef","props","ref","createElement","_extends","Icon","_ref","className","icon_","icon","_objectWithoutProperties","_excluded","cloneElement","_objectSpread","size","SettingsActionInner","i18n","Comp","t","ToolHeader","SettingsAction","Title","_ref2","children","_excluded2","Actions","Badge","_ref3","variant","_excluded3","$variant","displayName"],"sources":["../../src/ToolHeader/ToolHeader.tsx"],"sourcesContent":["import { Cog } from '@procore/core-icons'\nimport React from 'react'\nimport { Tabs as TabsBase } from '../Tabs/Tabs'\nimport { useI18nContext } from '../_hooks/I18n'\nimport { addSubcomponents } from '../_utils/addSubcomponents'\nimport { ActionIcon } from './ActionIcon'\nimport {\n  StyledHeaderActions,\n  StyledHeaderBadge,\n  StyledHeaderTabs,\n  StyledToolHeader,\n  StyledToolHeaderIconContainer,\n  StyledToolHeaderTitle,\n} from './ToolHeader.styles'\nimport type {\n  ToolHeaderBadgeProps,\n  ToolHeaderIconProps,\n  ToolHeaderSettingsActionPolyType,\n  ToolHeaderSettingsActionProps,\n  ToolHeaderSettingsActionRef,\n} from './ToolHeader.types'\n\nconst ToolHeader_ = React.forwardRef<HTMLDivElement, any>((props, ref) => {\n  return <StyledToolHeader ref={ref} {...props} />\n})\n\nexport const Icon = React.forwardRef<\n  HTMLDivElement,\n  React.SVGAttributes<SVGElement> & ToolHeaderIconProps\n>(function Icon({ className, icon: icon_, ...props }, ref) {\n  const icon = icon_ ? (\n    React.cloneElement(icon_ as React.ReactElement, { ...props, size: 'sm' })\n  ) : (\n    <Cog {...props} size=\"sm\" />\n  )\n  return (\n    <StyledToolHeaderIconContainer className={className} ref={ref}>\n      {icon}\n    </StyledToolHeaderIconContainer>\n  )\n})\n\nfunction SettingsActionInner<Role extends ToolHeaderSettingsActionPolyType>(\n  props: ToolHeaderSettingsActionProps<Role>,\n  ref: ToolHeaderSettingsActionRef<Role>\n) {\n  const i18n = useI18nContext()\n\n  const Comp = ActionIcon as any\n\n  return (\n    <Comp\n      aria-label={i18n.t('core.toolHeader.settingsAction')}\n      ref={ref}\n      {...props}\n    >\n      <ToolHeader.Icon />\n    </Comp>\n  )\n}\n\nconst SettingsAction = React.forwardRef(SettingsActionInner) as <\n  Role extends ToolHeaderSettingsActionPolyType\n>(\n  props: ToolHeaderSettingsActionProps<Role>\n) => ReturnType<typeof SettingsActionInner>\n\nexport const Title = StyledToolHeaderTitle\n\nexport const Tabs = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(function Tabs({ children, className, ...props }, ref) {\n  return (\n    <StyledHeaderTabs className={className} ref={ref}>\n      <TabsBase {...props}>{children}</TabsBase>\n    </StyledHeaderTabs>\n  )\n})\n\nexport const Actions = StyledHeaderActions\n\n/**\n * @deprecated\n *\n * This `Badge` pattern is no longer supported and it is now recommended to use a `Pill` instead.\n *\n * @deprecatedSince 10.20.0\n *\n * @see https://core.procore.com/latest/web/components/pill/react/\n */\nexport const Badge = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement> & ToolHeaderBadgeProps\n>(function Badge({ children, variant, ...props }, ref) {\n  return (\n    <StyledHeaderBadge {...props} $variant={variant} ref={ref}>\n      {children}\n    </StyledHeaderBadge>\n  )\n})\n\nToolHeader_.displayName = 'ToolHeader'\n\nIcon.displayName = 'ToolHeader.Icon'\n\nTitle.displayName = 'ToolHeader.Title'\n\nTabs.displayName = 'ToolHeader.Tabs'\n\nActions.displayName = 'ToolHeader.Actions'\n\nBadge.displayName = 'ToolHeader.Badge'\n\n/**\n * @deprecated This `ToolHeader` component is no longer supported and it is now recommended\n * to use the layout `ToolLandingPage`, `ToolLandingPage.Title` (for the settings button),\n * `ToolLandingPage.Tabs`, or based on content a `DetailPage`.\n *\n * @deprecatedSince 12.9.0\n *\n * @see https://stories.core.procore.com/?path=/story/core-react_demos-toollandingpage--demo\n */\nexport const ToolHeader = addSubcomponents(\n  {\n    Icon,\n    Title,\n    Tabs,\n    Actions,\n    Badge,\n    SettingsAction,\n  },\n  ToolHeader_\n)\n"],"mappings":"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"}
+{"version":3,"file":"ToolHeader.js","names":["Cog","React","Tabs","TabsBase","useI18nContext","addSubcomponents","ActionIcon","StyledHeaderActions","StyledHeaderBadge","StyledHeaderTabs","StyledToolHeader","StyledToolHeaderIconContainer","StyledToolHeaderTitle","ToolHeader_","forwardRef","props","ref","createElement","_extends","Icon","_ref","className","icon_","icon","_objectWithoutProperties","_excluded","cloneElement","_objectSpread","size","SettingsActionInner","i18n","Comp","t","ToolHeader","SettingsAction","Title","_ref2","children","_excluded2","role","Actions","Badge","_ref3","variant","_excluded3","$variant","displayName"],"sources":["../../src/ToolHeader/ToolHeader.tsx"],"sourcesContent":["import { Cog } from '@procore/core-icons'\nimport React from 'react'\nimport { Tabs as TabsBase } from '../Tabs/Tabs'\nimport { useI18nContext } from '../_hooks/I18n'\nimport { addSubcomponents } from '../_utils/addSubcomponents'\nimport { ActionIcon } from './ActionIcon'\nimport {\n  StyledHeaderActions,\n  StyledHeaderBadge,\n  StyledHeaderTabs,\n  StyledToolHeader,\n  StyledToolHeaderIconContainer,\n  StyledToolHeaderTitle,\n} from './ToolHeader.styles'\nimport type {\n  ToolHeaderBadgeProps,\n  ToolHeaderIconProps,\n  ToolHeaderSettingsActionPolyType,\n  ToolHeaderSettingsActionProps,\n  ToolHeaderSettingsActionRef,\n} from './ToolHeader.types'\n\nconst ToolHeader_ = React.forwardRef<HTMLDivElement, any>((props, ref) => {\n  return <StyledToolHeader ref={ref} {...props} />\n})\n\nexport const Icon = React.forwardRef<\n  HTMLDivElement,\n  React.SVGAttributes<SVGElement> & ToolHeaderIconProps\n>(function Icon({ className, icon: icon_, ...props }, ref) {\n  const icon = icon_ ? (\n    React.cloneElement(icon_ as React.ReactElement, { ...props, size: 'sm' })\n  ) : (\n    <Cog {...props} size=\"sm\" />\n  )\n  return (\n    <StyledToolHeaderIconContainer className={className} ref={ref}>\n      {icon}\n    </StyledToolHeaderIconContainer>\n  )\n})\n\nfunction SettingsActionInner<Role extends ToolHeaderSettingsActionPolyType>(\n  props: ToolHeaderSettingsActionProps<Role>,\n  ref: ToolHeaderSettingsActionRef<Role>\n) {\n  const i18n = useI18nContext()\n\n  const Comp = ActionIcon as any\n\n  return (\n    <Comp\n      aria-label={i18n.t('core.toolHeader.settingsAction')}\n      ref={ref}\n      {...props}\n    >\n      <ToolHeader.Icon />\n    </Comp>\n  )\n}\n\nconst SettingsAction = React.forwardRef(SettingsActionInner) as <\n  Role extends ToolHeaderSettingsActionPolyType\n>(\n  props: ToolHeaderSettingsActionProps<Role>\n) => ReturnType<typeof SettingsActionInner>\n\nexport const Title = StyledToolHeaderTitle\n\nexport const Tabs = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(function Tabs({ children, className, ...props }, ref) {\n  return (\n    <StyledHeaderTabs className={className} ref={ref}>\n      <TabsBase {...props} role={props.role as 'navigation'}>\n        {children}\n      </TabsBase>\n    </StyledHeaderTabs>\n  )\n})\n\nexport const Actions = StyledHeaderActions\n\n/**\n * @deprecated\n *\n * This `Badge` pattern is no longer supported and it is now recommended to use a `Pill` instead.\n *\n * @deprecatedSince 10.20.0\n *\n * @see https://core.procore.com/latest/web/components/pill/react/\n */\nexport const Badge = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement> & ToolHeaderBadgeProps\n>(function Badge({ children, variant, ...props }, ref) {\n  return (\n    <StyledHeaderBadge {...props} $variant={variant} ref={ref}>\n      {children}\n    </StyledHeaderBadge>\n  )\n})\n\nToolHeader_.displayName = 'ToolHeader'\n\nIcon.displayName = 'ToolHeader.Icon'\n\nTitle.displayName = 'ToolHeader.Title'\n\nTabs.displayName = 'ToolHeader.Tabs'\n\nActions.displayName = 'ToolHeader.Actions'\n\nBadge.displayName = 'ToolHeader.Badge'\n\n/**\n * @deprecated This `ToolHeader` component is no longer supported and it is now recommended\n * to use the layout `ToolLandingPage`, `ToolLandingPage.Title` (for the settings button),\n * `ToolLandingPage.Tabs`, or based on content a `DetailPage`.\n *\n * @deprecatedSince 12.9.0\n *\n * @see https://stories.core.procore.com/?path=/story/core-react_demos-toollandingpage--demo\n */\nexport const ToolHeader = addSubcomponents(\n  {\n    Icon,\n    Title,\n    Tabs,\n    Actions,\n    Badge,\n    SettingsAction,\n  },\n  ToolHeader_\n)\n"],"mappings":"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"}

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-12_38_0__sc-1jpjx47-0"
+  componentId: "core-12_40_0__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-12_38_0__sc-1jpjx47-1"
+  componentId: "core-12_40_0__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-12_38_0__sc-1jpjx47-2"
+  componentId: "core-12_40_0__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-12_38_0__sc-1jpjx47-3"
+  componentId: "core-12_40_0__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-12_38_0__sc-1jpjx47-4"
+  componentId: "core-12_40_0__sc-1jpjx47-4"
 })(["margin-right:", "px;white-space:nowrap;"], spacing.xl);
 export var StyledToolHeader = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledToolHeader",
-  componentId: "core-12_38_0__sc-1jpjx47-5"
+  componentId: "core-12_40_0__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/ToolLandingPage/ToolLandingPage.styles.js

@@ -3,14 +3,14 @@ import { Page } from '../PageLayout';
 import { spacing } from '../_styles/spacing';
 export var StyledTitleOuter = /*#__PURE__*/styled(Page.Title).withConfig({
   displayName: "StyledTitleOuter",
-  componentId: "core-12_38_0__sc-wa8j06-0"
+  componentId: "core-12_40_0__sc-wa8j06-0"
 })(["align-items:center;display:flex;gap:", "px;"], spacing.md);
 export var StyledTitleInner = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledTitleInner",
-  componentId: "core-12_38_0__sc-wa8j06-1"
+  componentId: "core-12_40_0__sc-wa8j06-1"
 })(["width:100%;"]);
 export var StyledToolLandingPageBodyContent = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledToolLandingPageBodyContent",
-  componentId: "core-12_38_0__sc-wa8j06-2"
+  componentId: "core-12_40_0__sc-wa8j06-2"
 })(["> * + *{margin-top:", "px;}"], spacing.sm);
 //# sourceMappingURL=ToolLandingPage.styles.js.map

package/dist/Tooltip/Tooltip.d.ts

@@ -1,6 +1,8 @@
 import React from 'react';
 import type { OverlayTriggerProps } from '../OverlayTrigger';
 import type { TooltipContentProps, TooltipProps } from './Tooltip.types';
+/** For the inline typography without all those button styles */
+export declare const TooltipIconOnlyButton: React.ForwardRefExoticComponent<React.ButtonHTMLAttributes<HTMLButtonElement> & React.RefAttributes<HTMLButtonElement>>;
 /**
 
  We use tooltips to display additional descriptive information about an element
@@ -8,8 +10,8 @@ import type { TooltipContentProps, TooltipProps } from './Tooltip.types';
  or phrase, to denote the specific format required (e.g. mm/dd/yyy), or to
  clarify certain information (e.g. why a button is disabled).
 
- They can be displayed either by hovering over an element in the product or by
- hovering over an icon next to an element.
+ They can be displayed by hover or focus of an focusable element in the product or by
+ hovering or focusing an icon button next to an element. Provide a focusable child.
 
  @since 10.19.0
 

package/dist/Tooltip/Tooltip.js

@@ -8,15 +8,37 @@ function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol"
 function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
 function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+import { Help } from '@procore/core-icons';
 import React from 'react';
 import { OverlayTrigger } from '../OverlayTrigger';
+import { useI18nContext } from '../_hooks/I18n';
 import { addSubcomponents } from '../_utils/addSubcomponents';
-import { StyledContainer, StyledTooltip } from './Tooltip.styles';
+import { StyledContainer, StyledTooltip, StyledTooltipButton } from './Tooltip.styles';
+/** For the inline typography without all those button styles */
+export var TooltipIconOnlyButton = /*#__PURE__*/React.forwardRef(function TooltipDefaultTrigger(props, ref) {
+  var I18n = useI18nContext();
+  return /*#__PURE__*/React.createElement(StyledTooltipButton, _extends({
+    "aria-label": I18n.t('core.form.field.tooltipHelp')
+  }, props, {
+    ref: ref
+  }), /*#__PURE__*/React.createElement(Help, {
+    size: "sm"
+  }));
+});
 var Content = /*#__PURE__*/React.forwardRef(function Content(_ref, ref) {
   var children = _ref.children,
     placement = _ref.placement,
     props = _objectWithoutProperties(_ref, _excluded);
+  // For most consistent results: First render an empty aria-live container, then add content.
+  // const [showContent, setShowContent] = React.useState(false)
+  // React.useEffect(() => {
+  //   const id = window.setTimeout(() => setShowContent(true), 10)
+  //   return () => window.clearTimeout(id)
+  // }, [])
+
   return /*#__PURE__*/React.createElement(StyledContainer, {
+    "aria-live": "polite",
     ref: ref
   }, /*#__PURE__*/React.createElement(StyledTooltip, props, children));
 });
@@ -28,12 +50,15 @@ var Tooltip_ = /*#__PURE__*/React.forwardRef(function Tooltip(_ref2, ref) {
     _ref2$placement = _ref2.placement,
     placement = _ref2$placement === void 0 ? 'top' : _ref2$placement,
     _ref2$trigger = _ref2.trigger,
-    trigger = _ref2$trigger === void 0 ? 'hover' : _ref2$trigger,
+    trigger = _ref2$trigger === void 0 ? ['hover', 'focus'] : _ref2$trigger,
     props = _objectWithoutProperties(_ref2, _excluded2);
   var overlayNode = /*#__PURE__*/React.isValidElement(overlay) ? /*#__PURE__*/React.cloneElement(overlay, {
     placement: placement
   }) : /*#__PURE__*/React.createElement(Content, null, overlay);
-  return /*#__PURE__*/React.createElement(OverlayTrigger, _objectSpread(_objectSpread({}, props), {}, {
+  return /*#__PURE__*/React.createElement(OverlayTrigger, _objectSpread(_objectSpread({
+    role: 'tooltip',
+    passA11yPropsToOverlay: true
+  }, props), {}, {
     initialIsVisible: initialIsVisible,
     overlay: overlayNode,
     placement: placement,
@@ -54,8 +79,8 @@ Content.displayName = 'Tooltip.Content';
  or phrase, to denote the specific format required (e.g. mm/dd/yyy), or to
  clarify certain information (e.g. why a button is disabled).
 
- They can be displayed either by hovering over an element in the product or by
- hovering over an icon next to an element.
+ They can be displayed by hover or focus of an focusable element in the product or by
+ hovering or focusing an icon button next to an element. Provide a focusable child.
 
  @since 10.19.0
 

package/dist/Tooltip/Tooltip.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.js","names":["React","OverlayTrigger","addSubcomponents","StyledContainer","StyledTooltip","Content","forwardRef","_ref","ref","children","placement","props","_objectWithoutProperties","_excluded","createElement","Tooltip_","Tooltip","_ref2","_ref2$initialIsVisibl","initialIsVisible","overlay","_ref2$placement","_ref2$trigger","trigger","_excluded2","overlayNode","isValidElement","cloneElement","_objectSpread","restoreFocusOnHide","shrinkOverlay","arrow","displayName"],"sources":["../../src/Tooltip/Tooltip.tsx"],"sourcesContent":["import React from 'react'\nimport type { OverlayTriggerProps } from '../OverlayTrigger'\nimport { OverlayTrigger } from '../OverlayTrigger'\nimport { addSubcomponents } from '../_utils/addSubcomponents'\nimport { StyledContainer, StyledTooltip } from './Tooltip.styles'\nimport type { TooltipContentProps, TooltipProps } from './Tooltip.types'\n\nconst Content = React.forwardRef<HTMLSpanElement, TooltipContentProps>(\n  function Content({ children, placement, ...props }, ref) {\n    return (\n      <StyledContainer ref={ref}>\n        <StyledTooltip {...props}>{children}</StyledTooltip>\n      </StyledContainer>\n    )\n  }\n)\n\nconst Tooltip_ = React.forwardRef<\n  HTMLElement,\n  OverlayTriggerProps & TooltipProps\n>(function Tooltip(\n  {\n    children,\n    initialIsVisible = false,\n    overlay,\n    placement = 'top',\n    trigger = 'hover',\n    ...props\n  },\n  ref\n) {\n  const overlayNode = React.isValidElement(overlay) ? (\n    React.cloneElement(overlay as React.ReactElement, { placement })\n  ) : (\n    <Content>{overlay}</Content>\n  )\n\n  return (\n    <OverlayTrigger\n      {...{\n        ...props,\n        initialIsVisible,\n        overlay: overlayNode,\n        placement,\n        ref,\n        restoreFocusOnHide: false,\n        trigger,\n        shrinkOverlay: true,\n        arrow: true,\n      }}\n    >\n      {children}\n    </OverlayTrigger>\n  )\n})\n\nTooltip_.displayName = 'Tooltip'\n\nContent.displayName = 'Tooltip.Content'\n\n/**\n\n We use tooltips to display additional descriptive information about an element\n or item to the user. For example, we could use them to explain a specific term\n or phrase, to denote the specific format required (e.g. mm/dd/yyy), or to\n clarify certain information (e.g. why a button is disabled).\n\n They can be displayed either by hovering over an element in the product or by\n hovering over an icon next to an element.\n\n @since 10.19.0\n\n @see [Storybook](https://stories.core.procore.com/?path=/story/core-react_demos-tooltip--demo)\n\n @see [Design Guidelines](https://design.procore.com/tooltip)\n\n */\nexport const Tooltip = addSubcomponents(\n  {\n    Content,\n  },\n  Tooltip_\n)\n"],"mappings":";;;;;;;;;;AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,cAAc,QAAQ,mBAAmB;AAClD,SAASC,gBAAgB,QAAQ,4BAA4B;AAC7D,SAASC,eAAe,EAAEC,aAAa,QAAQ,kBAAkB;AAGjE,IAAMC,OAAO,gBAAGL,KAAK,CAACM,UAAU,CAC9B,SAASD,OAAOA,CAAAE,IAAA,EAAoCC,GAAG,EAAE;EAAA,IAAtCC,QAAQ,GAAAF,IAAA,CAARE,QAAQ;IAAEC,SAAS,GAAAH,IAAA,CAATG,SAAS;IAAKC,KAAK,GAAAC,wBAAA,CAAAL,IAAA,EAAAM,SAAA;EAC9C,oBACEb,KAAA,CAAAc,aAAA,CAACX,eAAe;IAACK,GAAG,EAAEA;EAAI,gBACxBR,KAAA,CAAAc,aAAA,CAACV,aAAa,EAAKO,KAAK,EAAGF,QAAwB,CACpC,CAAC;AAEtB,CACF,CAAC;AAED,IAAMM,QAAQ,gBAAGf,KAAK,CAACM,UAAU,CAG/B,SAASU,OAAOA,CAAAC,KAAA,EAShBT,GAAG,EACH;EAAA,IAREC,QAAQ,GAAAQ,KAAA,CAARR,QAAQ;IAAAS,qBAAA,GAAAD,KAAA,CACRE,gBAAgB;IAAhBA,gBAAgB,GAAAD,qBAAA,cAAG,KAAK,GAAAA,qBAAA;IACxBE,OAAO,GAAAH,KAAA,CAAPG,OAAO;IAAAC,eAAA,GAAAJ,KAAA,CACPP,SAAS;IAATA,SAAS,GAAAW,eAAA,cAAG,KAAK,GAAAA,eAAA;IAAAC,aAAA,GAAAL,KAAA,CACjBM,OAAO;IAAPA,OAAO,GAAAD,aAAA,cAAG,OAAO,GAAAA,aAAA;IACdX,KAAK,GAAAC,wBAAA,CAAAK,KAAA,EAAAO,UAAA;EAIV,IAAMC,WAAW,GAAG,aAAAzB,KAAK,CAAC0B,cAAc,CAACN,OAAO,CAAC,gBAC/CpB,KAAK,CAAC2B,YAAY,CAACP,OAAO,EAAwB;IAAEV,SAAS,EAATA;EAAU,CAAC,CAAC,gBAEhEV,KAAA,CAAAc,aAAA,CAACT,OAAO,QAAEe,OAAiB,CAC5B;EAED,oBACEpB,KAAA,CAAAc,aAAA,CAACb,cAAc,EAAA2B,aAAA,CAAAA,aAAA,KAERjB,KAAK;IACRQ,gBAAgB,EAAhBA,gBAAgB;IAChBC,OAAO,EAAEK,WAAW;IACpBf,SAAS,EAATA,SAAS;IACTF,GAAG,EAAHA,GAAG;IACHqB,kBAAkB,EAAE,KAAK;IACzBN,OAAO,EAAPA,OAAO;IACPO,aAAa,EAAE,IAAI;IACnBC,KAAK,EAAE;EAAI,IAGZtB,QACa,CAAC;AAErB,CAAC,CAAC;AAEFM,QAAQ,CAACiB,WAAW,GAAG,SAAS;AAEhC3B,OAAO,CAAC2B,WAAW,GAAG,iBAAiB;;AAEvC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,IAAMhB,OAAO,GAAGd,gBAAgB,CACrC;EACEG,OAAO,EAAPA;AACF,CAAC,EACDU,QACF,CAAC"}
+{"version":3,"file":"Tooltip.js","names":["Help","React","OverlayTrigger","useI18nContext","addSubcomponents","StyledContainer","StyledTooltip","StyledTooltipButton","TooltipIconOnlyButton","forwardRef","TooltipDefaultTrigger","props","ref","I18n","createElement","_extends","t","size","Content","_ref","children","placement","_objectWithoutProperties","_excluded","Tooltip_","Tooltip","_ref2","_ref2$initialIsVisibl","initialIsVisible","overlay","_ref2$placement","_ref2$trigger","trigger","_excluded2","overlayNode","isValidElement","cloneElement","_objectSpread","role","passA11yPropsToOverlay","restoreFocusOnHide","shrinkOverlay","arrow","displayName"],"sources":["../../src/Tooltip/Tooltip.tsx"],"sourcesContent":["import { Help } from '@procore/core-icons'\nimport React from 'react'\nimport type { OverlayTriggerProps } from '../OverlayTrigger'\nimport { OverlayTrigger } from '../OverlayTrigger'\nimport { useI18nContext } from '../_hooks/I18n'\nimport { addSubcomponents } from '../_utils/addSubcomponents'\nimport {\n  StyledContainer,\n  StyledTooltip,\n  StyledTooltipButton,\n} from './Tooltip.styles'\nimport type { TooltipContentProps, TooltipProps } from './Tooltip.types'\n\n/** For the inline typography without all those button styles */\nexport const TooltipIconOnlyButton = React.forwardRef<\n  HTMLButtonElement,\n  React.ButtonHTMLAttributes<HTMLButtonElement>\n>(function TooltipDefaultTrigger(props, ref) {\n  const I18n = useI18nContext()\n\n  return (\n    <StyledTooltipButton\n      aria-label={I18n.t('core.form.field.tooltipHelp')}\n      {...props}\n      ref={ref}\n    >\n      <Help size=\"sm\" />\n    </StyledTooltipButton>\n  )\n})\n\nconst Content = React.forwardRef<HTMLSpanElement, TooltipContentProps>(\n  function Content({ children, placement, ...props }, ref) {\n    // For most consistent results: First render an empty aria-live container, then add content.\n    // const [showContent, setShowContent] = React.useState(false)\n    // React.useEffect(() => {\n    //   const id = window.setTimeout(() => setShowContent(true), 10)\n    //   return () => window.clearTimeout(id)\n    // }, [])\n\n    return (\n      <StyledContainer aria-live=\"polite\" ref={ref}>\n        <StyledTooltip {...props}>\n          {children}\n          {/* {showContent ? children : null} */}\n        </StyledTooltip>\n      </StyledContainer>\n    )\n  }\n)\n\nconst Tooltip_ = React.forwardRef<\n  HTMLElement,\n  OverlayTriggerProps & TooltipProps\n>(function Tooltip(\n  {\n    children,\n    initialIsVisible = false,\n    overlay,\n    placement = 'top',\n    trigger = ['hover', 'focus'],\n    ...props\n  },\n  ref\n) {\n  const overlayNode = React.isValidElement(overlay) ? (\n    React.cloneElement(overlay as React.ReactElement, { placement })\n  ) : (\n    <Content>{overlay}</Content>\n  )\n\n  return (\n    <OverlayTrigger\n      {...{\n        role: 'tooltip',\n        passA11yPropsToOverlay: true,\n        // TODO element this, it can cause failures for invalid use on some triggers.\n        // OverlayTrigger should provide open state somehow, but that seems overkill for 80%? case of tooltip buttons\n        // trackAriaExpanded: true,\n        ...props,\n        initialIsVisible,\n        overlay: overlayNode,\n        placement,\n        ref,\n        restoreFocusOnHide: false,\n        trigger,\n        shrinkOverlay: true,\n        arrow: true,\n      }}\n    >\n      {children}\n    </OverlayTrigger>\n  )\n})\n\nTooltip_.displayName = 'Tooltip'\n\nContent.displayName = 'Tooltip.Content'\n\n/**\n\n We use tooltips to display additional descriptive information about an element\n or item to the user. For example, we could use them to explain a specific term\n or phrase, to denote the specific format required (e.g. mm/dd/yyy), or to\n clarify certain information (e.g. why a button is disabled).\n\n They can be displayed by hover or focus of an focusable element in the product or by\n hovering or focusing an icon button next to an element. Provide a focusable child.\n\n @since 10.19.0\n\n @see [Storybook](https://stories.core.procore.com/?path=/story/core-react_demos-tooltip--demo)\n\n @see [Design Guidelines](https://design.procore.com/tooltip)\n\n */\nexport const Tooltip = addSubcomponents(\n  {\n    Content,\n  },\n  Tooltip_\n)\n"],"mappings":"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"}

package/dist/Tooltip/Tooltip.styles.d.ts

@@ -1,3 +1,4 @@
 /// <reference types="react" />
 export declare const StyledTooltip: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>> & string;
 export declare const StyledContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>> & string;
+export declare const StyledTooltipButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, never>> & string;

package/dist/Tooltip/Tooltip.styles.js

@@ -1,15 +1,23 @@
 import styled from 'styled-components';
+import { getUnstyledButton } from '../Semantic/Semantic.styles';
 import { getTypographyIntent } from '../Typography';
 import { borderRadius } from '../_styles/borderRadius';
 import { colors } from '../_styles/colors';
+import { getGapOutlineFocus } from '../_styles/mixins';
 import { getShadow } from '../_styles/shadows';
 import { spacing } from '../_styles/spacing';
 export var StyledTooltip = /*#__PURE__*/styled.span.withConfig({
   displayName: "StyledTooltip",
-  componentId: "core-12_38_0__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);
+  componentId: "core-12_40_0__sc-1fawsi4-0"
+})(["", " color:", ";max-width:200px;padding:", "px ", "px;position:relative;word-wrap:break-word;overflow-wrap:break-word;white-space:normal;&:empty{display:none;}"], getTypographyIntent('small'), colors.white, spacing.sm, spacing.md);
 export var StyledContainer = /*#__PURE__*/styled.span.withConfig({
   displayName: "StyledContainer",
-  componentId: "core-12_38_0__sc-1fawsi4-1"
-})(["display:inline-flex;background-color:", ";border-radius:", "px;", " & + [data-overlay-arrow]{background:", ";}"], colors.gray15, borderRadius.md, getShadow(3, 'bottom'), colors.gray15);
+  componentId: "core-12_40_0__sc-1fawsi4-1"
+})(["display:inline-flex;background-color:", ";border-radius:", "px;", " & + [data-overlay-arrow]{background:", ";}&:has(> span:empty) + [data-overlay-arrow]{display:none;}"], colors.gray15, borderRadius.md, getShadow(3, 'bottom'), colors.gray15);
+
+// This is for the inline typography icon button. Note: not `Button` styles
+export var StyledTooltipButton = /*#__PURE__*/styled.button.withConfig({
+  displayName: "StyledTooltipButton",
+  componentId: "core-12_40_0__sc-1fawsi4-2"
+})(["", " border-radius:50%;color:", ";display:inline-flex;vertical-align:middle;&:focus-visible{", "}* + &{margin-left:", "px;}"], getUnstyledButton, colors.gray45, getGapOutlineFocus('ontop'), spacing.sm);
 //# sourceMappingURL=Tooltip.styles.js.map

package/dist/Tooltip/Tooltip.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.styles.js","names":["styled","getTypographyIntent","borderRadius","colors","getShadow","spacing","StyledTooltip","span","withConfig","displayName","componentId","white","sm","md","StyledContainer","gray15"],"sources":["../../src/Tooltip/Tooltip.styles.ts"],"sourcesContent":["import styled from 'styled-components'\nimport { getTypographyIntent } from '../Typography'\nimport { borderRadius } from '../_styles/borderRadius'\nimport { colors } from '../_styles/colors'\nimport { getShadow } from '../_styles/shadows'\nimport { spacing } from '../_styles/spacing'\n\nexport const StyledTooltip = styled.span`\n  ${getTypographyIntent('small')}\n  color: ${colors.white};\n  max-width: 200px;\n  padding: ${spacing.sm}px ${spacing.md}px;\n  position: relative;\n\n  // for IE11, use word-wrap property\n  word-wrap: break-word;\n  overflow-wrap: break-word;\n  white-space: normal;\n`\n\nexport const StyledContainer = styled.span`\n  display: inline-flex;\n  background-color: ${colors.gray15};\n  border-radius: ${borderRadius.md}px;\n  ${getShadow(3, 'bottom')}\n\n  & + [data-overlay-arrow] {\n    background: ${colors.gray15};\n  }\n`\n"],"mappings":"AAAA,OAAOA,MAAM,MAAM,mBAAmB;AACtC,SAASC,mBAAmB,QAAQ,eAAe;AACnD,SAASC,YAAY,QAAQ,yBAAyB;AACtD,SAASC,MAAM,QAAQ,mBAAmB;AAC1C,SAASC,SAAS,QAAQ,oBAAoB;AAC9C,SAASC,OAAO,QAAQ,oBAAoB;AAE5C,OAAO,IAAMC,aAAa,gBAAGN,MAAM,CAACO,IAAI,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,kJACpCT,mBAAmB,CAAC,OAAO,CAAC,EACrBE,MAAM,CAACQ,KAAK,EAEVN,OAAO,CAACO,EAAE,EAAMP,OAAO,CAACQ,EAAE,CAOtC;AAED,OAAO,IAAMC,eAAe,gBAAGd,MAAM,CAACO,IAAI,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,uHAEpBP,MAAM,CAACY,MAAM,EAChBb,YAAY,CAACW,EAAE,EAC9BT,SAAS,CAAC,CAAC,EAAE,QAAQ,CAAC,EAGRD,MAAM,CAACY,MAAM,CAE9B"}
+{"version":3,"file":"Tooltip.styles.js","names":["styled","getUnstyledButton","getTypographyIntent","borderRadius","colors","getGapOutlineFocus","getShadow","spacing","StyledTooltip","span","withConfig","displayName","componentId","white","sm","md","StyledContainer","gray15","StyledTooltipButton","button","gray45"],"sources":["../../src/Tooltip/Tooltip.styles.ts"],"sourcesContent":["import styled from 'styled-components'\nimport { getUnstyledButton } from '../Semantic/Semantic.styles'\nimport { getTypographyIntent } from '../Typography'\nimport { borderRadius } from '../_styles/borderRadius'\nimport { colors } from '../_styles/colors'\nimport { getGapOutlineFocus } from '../_styles/mixins'\nimport { getShadow } from '../_styles/shadows'\nimport { spacing } from '../_styles/spacing'\n\nexport const StyledTooltip = styled.span`\n  ${getTypographyIntent('small')}\n  color: ${colors.white};\n  max-width: 200px;\n  padding: ${spacing.sm}px ${spacing.md}px;\n  position: relative;\n\n  // for IE11, use word-wrap property\n  word-wrap: break-word;\n  overflow-wrap: break-word;\n  white-space: normal;\n\n  &:empty {\n    display: none;\n  }\n`\n\nexport const StyledContainer = styled.span`\n  display: inline-flex;\n  background-color: ${colors.gray15};\n  border-radius: ${borderRadius.md}px;\n  ${getShadow(3, 'bottom')}\n\n  & + [data-overlay-arrow] {\n    background: ${colors.gray15};\n  }\n\n  &:has(> span:empty) + [data-overlay-arrow] {\n    display: none;\n  }\n`\n\n// This is for the inline typography icon button. Note: not `Button` styles\nexport const StyledTooltipButton = styled.button`\n  ${getUnstyledButton}\n  // Create a circle around the icon for focus outline\n  border-radius: 50%;\n  color: ${colors.gray45};\n  display: inline-flex;\n  vertical-align: middle;\n\n  &:focus-visible {\n    // Icon does not touch viewBox borders. Already has 1px gap\n    ${getGapOutlineFocus('ontop')}\n  }\n\n  // if there is a sibling before, then add a leading space.\n  // can make the Tooltip a single child to opt-out\n  * + & {\n    margin-left: ${spacing.sm}px;\n  }\n`\n"],"mappings":"AAAA,OAAOA,MAAM,MAAM,mBAAmB;AACtC,SAASC,iBAAiB,QAAQ,6BAA6B;AAC/D,SAASC,mBAAmB,QAAQ,eAAe;AACnD,SAASC,YAAY,QAAQ,yBAAyB;AACtD,SAASC,MAAM,QAAQ,mBAAmB;AAC1C,SAASC,kBAAkB,QAAQ,mBAAmB;AACtD,SAASC,SAAS,QAAQ,oBAAoB;AAC9C,SAASC,OAAO,QAAQ,oBAAoB;AAE5C,OAAO,IAAMC,aAAa,gBAAGR,MAAM,CAACS,IAAI,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,wKACpCV,mBAAmB,CAAC,OAAO,CAAC,EACrBE,MAAM,CAACS,KAAK,EAEVN,OAAO,CAACO,EAAE,EAAMP,OAAO,CAACQ,EAAE,CAWtC;AAED,OAAO,IAAMC,eAAe,gBAAGhB,MAAM,CAACS,IAAI,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,gLAEpBR,MAAM,CAACa,MAAM,EAChBd,YAAY,CAACY,EAAE,EAC9BT,SAAS,CAAC,CAAC,EAAE,QAAQ,CAAC,EAGRF,MAAM,CAACa,MAAM,CAM9B;;AAED;AACA,OAAO,IAAMC,mBAAmB,gBAAGlB,MAAM,CAACmB,MAAM,CAAAT,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,oIAC5CX,iBAAiB,EAGVG,MAAM,CAACgB,MAAM,EAMlBf,kBAAkB,CAAC,OAAO,CAAC,EAMdE,OAAO,CAACO,EAAE,CAE5B"}

package/dist/Tooltip/Tooltip.types.d.ts

@@ -35,6 +35,14 @@ export interface TooltipProps extends Props {
      * @since 10.19.0
      */
     showDelay?: number;
+    /**
+     * @a11y Preference `true`, with it makes sense for Buttons and other controls
+     * that support `aria-expanded`. This will pass the open state to the element.
+     * @default false
+     * @see [MDN aria-expanded associated roles](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-expanded#associated_roles)
+     * @since 12.37.0
+     */
+    trackAriaExpanded?: OverlayTriggerProps['trackAriaExpanded'];
     /**
      * The event to trigger the overlay
      * @since 10.19.0

package/dist/Tooltip/Tooltip.types.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.types.js","names":[],"sources":["../../src/Tooltip/Tooltip.types.ts"],"sourcesContent":["import type { OverlayTriggerProps } from '../OverlayTrigger/OverlayTrigger.types'\nimport type { Placement } from '../_utils/placement'\nimport type { Props } from '../_utils/types'\n\nexport interface TooltipContentProps extends Props {\n  /**\n   * @since 10.19.0\n   */\n  placement?: Placement\n  /**\n   * @since 12.33.0\n   */\n  id?: string\n}\n\nexport interface TooltipProps extends Props {\n  /**\n   * @since 10.19.0\n   */\n  hideDelay?: number\n\n  /**\n   * Whether to show the overlay on initial render\n   * @since 10.19.0\n   */\n  initialIsVisible?: boolean\n\n  /**\n   * The tip we want to display\n   * @since 10.19.0\n   */\n  overlay?: any\n\n  /**\n   * Determines the position of the arrow\n   * @since 10.19.0\n   */\n  placement?: Placement\n  /**\n   * @since 10.19.0\n   */\n  showDelay?: number\n\n  /**\n   * The event to trigger the overlay\n   * @since 10.19.0\n   */\n  trigger?: OverlayTriggerProps['trigger']\n}\n"],"mappings":""}
+{"version":3,"file":"Tooltip.types.js","names":[],"sources":["../../src/Tooltip/Tooltip.types.ts"],"sourcesContent":["import type { OverlayTriggerProps } from '../OverlayTrigger/OverlayTrigger.types'\nimport type { Placement } from '../_utils/placement'\nimport type { Props } from '../_utils/types'\n\nexport interface TooltipContentProps extends Props {\n  /**\n   * @since 10.19.0\n   */\n  placement?: Placement\n  /**\n   * @since 12.33.0\n   */\n  id?: string\n}\n\nexport interface TooltipProps extends Props {\n  /**\n   * @since 10.19.0\n   */\n  hideDelay?: number\n\n  /**\n   * Whether to show the overlay on initial render\n   * @since 10.19.0\n   */\n  initialIsVisible?: boolean\n\n  /**\n   * The tip we want to display\n   * @since 10.19.0\n   */\n  overlay?: any\n\n  /**\n   * Determines the position of the arrow\n   * @since 10.19.0\n   */\n  placement?: Placement\n  /**\n   * @since 10.19.0\n   */\n  showDelay?: number\n  /**\n   * @a11y Preference `true`, with it makes sense for Buttons and other controls\n   * that support `aria-expanded`. This will pass the open state to the element.\n   * @default false\n   * @see [MDN aria-expanded associated roles](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-expanded#associated_roles)\n   * @since 12.37.0\n   */\n  trackAriaExpanded?: OverlayTriggerProps['trackAriaExpanded']\n  /**\n   * The event to trigger the overlay\n   * @since 10.19.0\n   */\n  trigger?: OverlayTriggerProps['trigger']\n}\n"],"mappings":""}

package/dist/Tree/Tree.js

@@ -565,7 +565,7 @@ var IconContainer = function IconContainer(_ref5) {
 };
 var StyledChevronIcon = /*#__PURE__*/styled(ChevronRight).withConfig({
   displayName: "StyledChevronIcon",
-  componentId: "core-12_38_0__sc-f25ekl-0"
+  componentId: "core-12_40_0__sc-f25ekl-0"
 })(["transform:rotate(", "deg);transition:transform 150ms ease-out;"], function (_ref6) {
   var $isExpanded = _ref6.$isExpanded;
   return $isExpanded ? 90 : 0;

package/dist/Tree/Tree.styles.js

@@ -5,11 +5,11 @@ import { Typography } from '../Typography/Typography';
 import { colors } from '../_styles/colors';
 export var StyledFilenameCaption = /*#__PURE__*/styled(Typography).withConfig({
   displayName: "StyledFilenameCaption",
-  componentId: "core-12_38_0__sc-2d45b5-0"
+  componentId: "core-12_40_0__sc-2d45b5-0"
 })(["display:flex;width:100%;"]);
 export var StyledTree = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledTree",
-  componentId: "core-12_38_0__sc-2d45b5-1"
+  componentId: "core-12_40_0__sc-2d45b5-1"
 })(["width:100%;height:100%;min-height:36px;outline:none;overflow:auto;"]);
 export var StyledTreeRowContainer = /*#__PURE__*/styled(Typography).withConfig({
   shouldForwardProp: function shouldForwardProp(prop) {
@@ -17,7 +17,7 @@ export var StyledTreeRowContainer = /*#__PURE__*/styled(Typography).withConfig({
   }
 }).withConfig({
   displayName: "StyledTreeRowContainer",
-  componentId: "core-12_38_0__sc-2d45b5-2"
+  componentId: "core-12_40_0__sc-2d45b5-2"
 })(["display:flex;align-items:center;height:36px;background:transparent;box-shadow:inset 4px 0px 0px transparent;cursor:default;outline:none;", " &:hover{background:", ";}", " ", ""], function (_ref) {
   var isSelectable = _ref.isSelectable,
     $isSelectable = _ref.$isSelectable;
@@ -35,29 +35,29 @@ export var StyledTreeRowContainer = /*#__PURE__*/styled(Typography).withConfig({
 });
 export var StyledTreeRowContent = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledTreeRowContent",
-  componentId: "core-12_38_0__sc-2d45b5-3"
+  componentId: "core-12_40_0__sc-2d45b5-3"
 })(["display:flex;align-items:center;"]);
 export var StyledTreeRowWrapper = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledTreeRowWrapper",
-  componentId: "core-12_38_0__sc-2d45b5-4"
+  componentId: "core-12_40_0__sc-2d45b5-4"
 })(["outline:none;"]);
 var StyledIconBase = /*#__PURE__*/styled(Box).withConfig({
   displayName: "StyledIconBase",
-  componentId: "core-12_38_0__sc-2d45b5-5"
+  componentId: "core-12_40_0__sc-2d45b5-5"
 })(["display:flex;justify-content:center;align-items:center;width:24px;height:24px;min-width:24px;min-height:24px;"]);
 
 /** @deprecated Use StyledChevronPlaceholder instead */
 export var StyledChevronContainer = /*#__PURE__*/styled(StyledIconBase).withConfig({
   displayName: "StyledChevronContainer",
-  componentId: "core-12_38_0__sc-2d45b5-6"
+  componentId: "core-12_40_0__sc-2d45b5-6"
 })([""]);
 export var StyledChevronPlaceholder = /*#__PURE__*/styled(StyledIconBase).withConfig({
   displayName: "StyledChevronPlaceholder",
-  componentId: "core-12_38_0__sc-2d45b5-7"
+  componentId: "core-12_40_0__sc-2d45b5-7"
 })([""]);
 export var StyledIconContainer = /*#__PURE__*/styled(StyledIconBase).withConfig({
   displayName: "StyledIconContainer",
-  componentId: "core-12_38_0__sc-2d45b5-8"
+  componentId: "core-12_40_0__sc-2d45b5-8"
 })(["color:", ";"], function (_ref4) {
   var $isSelected = _ref4.$isSelected;
   return $isSelected ? colors.blue45 : colors.gray40;
@@ -66,7 +66,7 @@ export var StyledIconContainer = /*#__PURE__*/styled(StyledIconBase).withConfig(
 /** @deprecated TreeRowChevron now uses Button with inline styled icon */
 export var StyledChevron = /*#__PURE__*/styled(ChevronRight).withConfig({
   displayName: "StyledChevron",
-  componentId: "core-12_38_0__sc-2d45b5-9"
+  componentId: "core-12_40_0__sc-2d45b5-9"
 })(["transform:rotate(", "deg);transition:transform 150ms ease-out;"], function (_ref5) {
   var $isExpanded = _ref5.$isExpanded;
   return $isExpanded ? 90 : 0;

package/dist/Typeahead/Typeahead.styles.js

@@ -5,11 +5,11 @@ import { spacing } from '../_styles/spacing';
 var inputHeight = 36;
 export var StyledInput = /*#__PURE__*/styled.input.withConfig({
   displayName: "StyledInput",
-  componentId: "core-12_38_0__sc-gpc39h-0"
+  componentId: "core-12_40_0__sc-gpc39h-0"
 })(["", " padding-right:", "px;"], getSearchInputStyles(), spacing.xxl);
 export var StyledIcon = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledIcon",
-  componentId: "core-12_38_0__sc-gpc39h-1"
+  componentId: "core-12_40_0__sc-gpc39h-1"
 })(["align-items:center;color:", ";display:flex;height:", "px;justify-content:center;pointer-events:", ";position:absolute;right:0;top:0;width:", "px;"], function (p) {
   return p.disabled ? colors.gray70 : colors.gray45;
 }, inputHeight, function (p) {
@@ -17,6 +17,6 @@ export var StyledIcon = /*#__PURE__*/styled.div.withConfig({
 }, inputHeight);
 export var StyledTypeahead = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledTypeahead",
-  componentId: "core-12_38_0__sc-gpc39h-2"
+  componentId: "core-12_40_0__sc-gpc39h-2"
 })(["position:relative;width:100%;"]);
 //# sourceMappingURL=Typeahead.styles.js.map

package/dist/Typography/Typography.styles.js

@@ -35,7 +35,7 @@ export var semiboldRules = function semiboldRules() {
 };
 export var StyledTypography = /*#__PURE__*/styled.span.withConfig({
   displayName: "StyledTypography",
-  componentId: "core-12_38_0__sc-1c4583t-0"
+  componentId: "core-12_40_0__sc-1c4583t-0"
 })(["", " color:", ";font-style:", ";font-weight:", ";", " ", " em,i{font-style:italic;}"], function (_ref) {
   var _ref$$intent = _ref.$intent,
     $intent = _ref$$intent === void 0 ? 'body' : _ref$$intent;

package/dist/Typography/Typography.table.story.js

@@ -5,11 +5,11 @@ import { colors } from '../_styles/colors';
 import { getTypographyIntent } from './Typography.styles';
 var StyledBodyCell = /*#__PURE__*/styled(Table.BodyCell).withConfig({
   displayName: "StyledBodyCell",
-  componentId: "core-12_38_0__sc-p4v7d-0"
+  componentId: "core-12_40_0__sc-p4v7d-0"
 })([""]);
 var StyledTextCell = /*#__PURE__*/styled(Table.TextCell).withConfig({
   displayName: "StyledTextCell",
-  componentId: "core-12_38_0__sc-p4v7d-1"
+  componentId: "core-12_40_0__sc-p4v7d-1"
 })(["", " color:", ";"], getTypographyIntent('body'), colors.blue50);
 function BodyCell() {
   return /*#__PURE__*/React.createElement(StyledBodyCell, {