@procore/core-react 12.25.0 → 12.25.2

package/dist/Token/Token.d.ts

@@ -1,5 +1,6 @@
 import React from 'react';
-import type { DivAttributes, Props, SpanAttributes, SVGAttributes } from '../_utils/types';
+import type { ButtonProps } from '../Button';
+import type { Props } from '../_utils/types';
 import type { TokenProps } from './Token.types';
 /**
 
@@ -13,7 +14,7 @@ import type { TokenProps } from './Token.types';
  @see [Design Guidelines](https://design.procore.com/tokens)
 
  */
-export declare const Token: React.ForwardRefExoticComponent<DivAttributes & TokenProps & React.RefAttributes<HTMLDivElement>> & {
-    Label: React.ForwardRefExoticComponent<SpanAttributes & Props & React.RefAttributes<HTMLSpanElement>>;
-    Remove: React.ForwardRefExoticComponent<SVGAttributes & Props & React.RefAttributes<SVGSVGElement>>;
+export declare const Token: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & TokenProps & React.RefAttributes<HTMLDivElement>> & {
+    Label: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLSpanElement> & Props & React.RefAttributes<HTMLSpanElement>>;
+    Remove: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
 };

package/dist/Token/Token.js

@@ -1,13 +1,18 @@
 var _excluded = ["children", "disabled", "focused", "error", "variant"],
   _excluded2 = ["children"];
-function _objectDestructuringEmpty(t) { if (null == t) throw new TypeError("Cannot destructure " + 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); }
 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; }
+import { Clear } from '@procore/core-icons';
+import { useId } from '@react-aria/utils';
 import React from 'react';
 import { useI18nContext } from '../_hooks/I18n';
 import { addSubcomponents } from '../_utils/addSubcomponents';
 import { StyledLabel, StyledRemove, StyledToken } from './Token.styles';
+var TokenContext = /*#__PURE__*/React.createContext({
+  labelId: '',
+  removeId: ''
+});
 var Parent = /*#__PURE__*/React.forwardRef(function Token(_ref, ref) {
   var children = _ref.children,
     _ref$disabled = _ref.disabled,
@@ -18,26 +23,48 @@ var Parent = /*#__PURE__*/React.forwardRef(function Token(_ref, ref) {
     error = _ref$error === void 0 ? false : _ref$error,
     variant = _ref.variant,
     props = _objectWithoutProperties(_ref, _excluded);
-  return /*#__PURE__*/React.createElement(StyledToken, _extends({}, props, {
+  var labelId = useId();
+  var removeId = useId();
+  return /*#__PURE__*/React.createElement(TokenContext.Provider, {
+    value: {
+      labelId: labelId,
+      removeId: removeId
+    }
+  }, /*#__PURE__*/React.createElement(StyledToken, _extends({
     ref: ref,
+    tabIndex: 0
+  }, props, {
     $disabled: disabled || variant === 'disabled',
     $focused: focused || variant === 'focused',
     $error: error
-  }), children);
+  }), children));
 });
-var Remove = /*#__PURE__*/React.forwardRef(function TokenRemove(_ref2, ref) {
-  var props = _extends({}, (_objectDestructuringEmpty(_ref2), _ref2));
+var Remove = /*#__PURE__*/React.forwardRef(function TokenRemove(props, ref) {
   var i18n = useI18nContext();
+  var _React$useContext = React.useContext(TokenContext),
+    labelId = _React$useContext.labelId,
+    removeId = _React$useContext.removeId;
   return /*#__PURE__*/React.createElement(StyledRemove, _extends({
     ref: ref,
     "aria-hidden": "false",
-    "aria-label": i18n.t('core.token.remove')
-  }, props));
+    "aria-label": i18n.t('core.token.remove'),
+    "aria-labelledby": "".concat(removeId, " ").concat(labelId),
+    id: removeId
+  }, props, {
+    icon: /*#__PURE__*/React.createElement(Clear, {
+      role: "img"
+    }),
+    size: "sm",
+    variant: "tertiary"
+  }));
 });
-var Label = /*#__PURE__*/React.forwardRef(function Label(_ref3, ref) {
-  var children = _ref3.children,
-    props = _objectWithoutProperties(_ref3, _excluded2);
+var Label = /*#__PURE__*/React.forwardRef(function Label(_ref2, ref) {
+  var children = _ref2.children,
+    props = _objectWithoutProperties(_ref2, _excluded2);
+  var _React$useContext2 = React.useContext(TokenContext),
+    labelId = _React$useContext2.labelId;
   return /*#__PURE__*/React.createElement(StyledLabel, _extends({
+    id: labelId,
     ref: ref
   }, props), children);
 });

package/dist/Token/Token.js.map

@@ -1 +1 @@
-{"version":3,"file":"Token.js","names":["React","useI18nContext","addSubcomponents","StyledLabel","StyledRemove","StyledToken","Parent","forwardRef","Token","_ref","ref","children","_ref$disabled","disabled","_ref$focused","focused","_ref$error","error","variant","props","_objectWithoutProperties","_excluded","createElement","_extends","$disabled","$focused","$error","Remove","TokenRemove","_ref2","_objectDestructuringEmpty","i18n","t","Label","_ref3","_excluded2","displayName"],"sources":["../../src/Token/Token.tsx"],"sourcesContent":["import React from 'react'\nimport { useI18nContext } from '../_hooks/I18n'\nimport { addSubcomponents } from '../_utils/addSubcomponents'\nimport type {\n  DivAttributes,\n  Props,\n  SpanAttributes,\n  SVGAttributes,\n} from '../_utils/types'\nimport { StyledLabel, StyledRemove, StyledToken } from './Token.styles'\nimport type { TokenProps } from './Token.types'\n\nconst Parent = React.forwardRef<HTMLDivElement, DivAttributes & TokenProps>(\n  function Token(\n    {\n      children,\n      disabled = false,\n      focused = false,\n      error = false,\n      variant,\n      ...props\n    },\n    ref\n  ) {\n    return (\n      <StyledToken\n        {...props}\n        ref={ref}\n        $disabled={disabled || variant === 'disabled'}\n        $focused={focused || variant === 'focused'}\n        $error={error}\n      >\n        {children}\n      </StyledToken>\n    )\n  }\n)\n\nconst Remove = React.forwardRef<SVGSVGElement, SVGAttributes & Props>(\n  function TokenRemove({ ...props }, ref) {\n    const i18n = useI18nContext()\n    return (\n      <StyledRemove\n        ref={ref}\n        aria-hidden=\"false\"\n        aria-label={i18n.t('core.token.remove')}\n        {...props}\n      />\n    )\n  }\n)\n\nconst Label = React.forwardRef<HTMLSpanElement, SpanAttributes & Props>(\n  function Label({ children, ...props }, ref) {\n    return (\n      <StyledLabel ref={ref} {...props}>\n        {children}\n      </StyledLabel>\n    )\n  }\n)\n\nParent.displayName = 'Token'\n\nRemove.displayName = 'Token.Remove'\n\nLabel.displayName = 'Token.Label'\n\n/**\n\n We use tokens in our multi select dropdowns and file attachers to indicate what\n has been selected or attached. Tokens in these components are removable.\n\n @since 10.19.0\n\n @see [Storybook](https://stories.core.procore.com/?path=/story/core-react_demos-token--demo)\n\n @see [Design Guidelines](https://design.procore.com/tokens)\n\n */\nexport const Token = addSubcomponents(\n  {\n    Label,\n    Remove,\n  },\n  Parent\n)\n"],"mappings":";;;;;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,cAAc,QAAQ,gBAAgB;AAC/C,SAASC,gBAAgB,QAAQ,4BAA4B;AAO7D,SAASC,WAAW,EAAEC,YAAY,EAAEC,WAAW,QAAQ,gBAAgB;AAGvE,IAAMC,MAAM,gBAAGN,KAAK,CAACO,UAAU,CAC7B,SAASC,KAAKA,CAAAC,IAAA,EASZC,GAAG,EACH;EAAA,IAREC,QAAQ,GAAAF,IAAA,CAARE,QAAQ;IAAAC,aAAA,GAAAH,IAAA,CACRI,QAAQ;IAARA,QAAQ,GAAAD,aAAA,cAAG,KAAK,GAAAA,aAAA;IAAAE,YAAA,GAAAL,IAAA,CAChBM,OAAO;IAAPA,OAAO,GAAAD,YAAA,cAAG,KAAK,GAAAA,YAAA;IAAAE,UAAA,GAAAP,IAAA,CACfQ,KAAK;IAALA,KAAK,GAAAD,UAAA,cAAG,KAAK,GAAAA,UAAA;IACbE,OAAO,GAAAT,IAAA,CAAPS,OAAO;IACJC,KAAK,GAAAC,wBAAA,CAAAX,IAAA,EAAAY,SAAA;EAIV,oBACErB,KAAA,CAAAsB,aAAA,CAACjB,WAAW,EAAAkB,QAAA,KACNJ,KAAK;IACTT,GAAG,EAAEA,GAAI;IACTc,SAAS,EAAEX,QAAQ,IAAIK,OAAO,KAAK,UAAW;IAC9CO,QAAQ,EAAEV,OAAO,IAAIG,OAAO,KAAK,SAAU;IAC3CQ,MAAM,EAAET;EAAM,IAEbN,QACU,CAAC;AAElB,CACF,CAAC;AAED,IAAMgB,MAAM,gBAAG3B,KAAK,CAACO,UAAU,CAC7B,SAASqB,WAAWA,CAAAC,KAAA,EAAenB,GAAG,EAAE;EAAA,IAAdS,KAAK,GAAAI,QAAA,MAAAO,yBAAA,CAAAD,KAAA,GAAAA,KAAA;EAC7B,IAAME,IAAI,GAAG9B,cAAc,CAAC,CAAC;EAC7B,oBACED,KAAA,CAAAsB,aAAA,CAAClB,YAAY,EAAAmB,QAAA;IACXb,GAAG,EAAEA,GAAI;IACT,eAAY,OAAO;IACnB,cAAYqB,IAAI,CAACC,CAAC,CAAC,mBAAmB;EAAE,GACpCb,KAAK,CACV,CAAC;AAEN,CACF,CAAC;AAED,IAAMc,KAAK,gBAAGjC,KAAK,CAACO,UAAU,CAC5B,SAAS0B,KAAKA,CAAAC,KAAA,EAAyBxB,GAAG,EAAE;EAAA,IAA3BC,QAAQ,GAAAuB,KAAA,CAARvB,QAAQ;IAAKQ,KAAK,GAAAC,wBAAA,CAAAc,KAAA,EAAAC,UAAA;EACjC,oBACEnC,KAAA,CAAAsB,aAAA,CAACnB,WAAW,EAAAoB,QAAA;IAACb,GAAG,EAAEA;EAAI,GAAKS,KAAK,GAC7BR,QACU,CAAC;AAElB,CACF,CAAC;AAEDL,MAAM,CAAC8B,WAAW,GAAG,OAAO;AAE5BT,MAAM,CAACS,WAAW,GAAG,cAAc;AAEnCH,KAAK,CAACG,WAAW,GAAG,aAAa;;AAEjC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,IAAM5B,KAAK,GAAGN,gBAAgB,CACnC;EACE+B,KAAK,EAALA,KAAK;EACLN,MAAM,EAANA;AACF,CAAC,EACDrB,MACF,CAAC"}
+{"version":3,"file":"Token.js","names":["Clear","useId","React","useI18nContext","addSubcomponents","StyledLabel","StyledRemove","StyledToken","TokenContext","createContext","labelId","removeId","Parent","forwardRef","Token","_ref","ref","children","_ref$disabled","disabled","_ref$focused","focused","_ref$error","error","variant","props","_objectWithoutProperties","_excluded","createElement","Provider","value","_extends","tabIndex","$disabled","$focused","$error","Remove","TokenRemove","i18n","_React$useContext","useContext","t","concat","id","icon","role","size","Label","_ref2","_excluded2","_React$useContext2","displayName"],"sources":["../../src/Token/Token.tsx"],"sourcesContent":["import { Clear } from '@procore/core-icons'\nimport { useId } from '@react-aria/utils'\nimport React from 'react'\nimport type { ButtonProps } from '../Button'\nimport { useI18nContext } from '../_hooks/I18n'\nimport { addSubcomponents } from '../_utils/addSubcomponents'\nimport type { Props } from '../_utils/types'\nimport { StyledLabel, StyledRemove, StyledToken } from './Token.styles'\nimport type { TokenContextApi, TokenProps } from './Token.types'\n\nconst TokenContext = React.createContext<TokenContextApi>({\n  labelId: '',\n  removeId: '',\n})\n\nconst Parent = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement> & TokenProps\n>(function Token(\n  {\n    children,\n    disabled = false,\n    focused = false,\n    error = false,\n    variant,\n    ...props\n  },\n  ref\n) {\n  const labelId = useId()\n  const removeId = useId()\n\n  return (\n    <TokenContext.Provider value={{ labelId, removeId }}>\n      <StyledToken\n        ref={ref}\n        tabIndex={0}\n        {...props}\n        $disabled={disabled || variant === 'disabled'}\n        $focused={focused || variant === 'focused'}\n        $error={error}\n      >\n        {children}\n      </StyledToken>\n    </TokenContext.Provider>\n  )\n})\n\nconst Remove = React.forwardRef<HTMLButtonElement, ButtonProps>(\n  function TokenRemove(props, ref) {\n    const i18n = useI18nContext()\n    const { labelId, removeId } = React.useContext(TokenContext)\n\n    return (\n      <StyledRemove\n        ref={ref}\n        aria-hidden=\"false\"\n        aria-label={i18n.t('core.token.remove')}\n        aria-labelledby={`${removeId} ${labelId}`}\n        id={removeId}\n        {...props}\n        icon={<Clear role=\"img\" />}\n        size=\"sm\"\n        variant=\"tertiary\"\n      />\n    )\n  }\n)\n\nconst Label = React.forwardRef<\n  HTMLSpanElement,\n  React.HTMLAttributes<HTMLSpanElement> & Props\n>(function Label({ children, ...props }, ref) {\n  const { labelId } = React.useContext(TokenContext)\n\n  return (\n    <StyledLabel id={labelId} ref={ref} {...props}>\n      {children}\n    </StyledLabel>\n  )\n})\n\nParent.displayName = 'Token'\nRemove.displayName = 'Token.Remove'\nLabel.displayName = 'Token.Label'\n\n/**\n\n We use tokens in our multi select dropdowns and file attachers to indicate what\n has been selected or attached. Tokens in these components are removable.\n\n @since 10.19.0\n\n @see [Storybook](https://stories.core.procore.com/?path=/story/core-react_demos-token--demo)\n\n @see [Design Guidelines](https://design.procore.com/tokens)\n\n */\nexport const Token = addSubcomponents(\n  {\n    Label,\n    Remove,\n  },\n  Parent\n)\n"],"mappings":";;;;;AAAA,SAASA,KAAK,QAAQ,qBAAqB;AAC3C,SAASC,KAAK,QAAQ,mBAAmB;AACzC,OAAOC,KAAK,MAAM,OAAO;AAEzB,SAASC,cAAc,QAAQ,gBAAgB;AAC/C,SAASC,gBAAgB,QAAQ,4BAA4B;AAE7D,SAASC,WAAW,EAAEC,YAAY,EAAEC,WAAW,QAAQ,gBAAgB;AAGvE,IAAMC,YAAY,gBAAGN,KAAK,CAACO,aAAa,CAAkB;EACxDC,OAAO,EAAE,EAAE;EACXC,QAAQ,EAAE;AACZ,CAAC,CAAC;AAEF,IAAMC,MAAM,gBAAGV,KAAK,CAACW,UAAU,CAG7B,SAASC,KAAKA,CAAAC,IAAA,EASdC,GAAG,EACH;EAAA,IAREC,QAAQ,GAAAF,IAAA,CAARE,QAAQ;IAAAC,aAAA,GAAAH,IAAA,CACRI,QAAQ;IAARA,QAAQ,GAAAD,aAAA,cAAG,KAAK,GAAAA,aAAA;IAAAE,YAAA,GAAAL,IAAA,CAChBM,OAAO;IAAPA,OAAO,GAAAD,YAAA,cAAG,KAAK,GAAAA,YAAA;IAAAE,UAAA,GAAAP,IAAA,CACfQ,KAAK;IAALA,KAAK,GAAAD,UAAA,cAAG,KAAK,GAAAA,UAAA;IACbE,OAAO,GAAAT,IAAA,CAAPS,OAAO;IACJC,KAAK,GAAAC,wBAAA,CAAAX,IAAA,EAAAY,SAAA;EAIV,IAAMjB,OAAO,GAAGT,KAAK,CAAC,CAAC;EACvB,IAAMU,QAAQ,GAAGV,KAAK,CAAC,CAAC;EAExB,oBACEC,KAAA,CAAA0B,aAAA,CAACpB,YAAY,CAACqB,QAAQ;IAACC,KAAK,EAAE;MAAEpB,OAAO,EAAPA,OAAO;MAAEC,QAAQ,EAARA;IAAS;EAAE,gBAClDT,KAAA,CAAA0B,aAAA,CAACrB,WAAW,EAAAwB,QAAA;IACVf,GAAG,EAAEA,GAAI;IACTgB,QAAQ,EAAE;EAAE,GACRP,KAAK;IACTQ,SAAS,EAAEd,QAAQ,IAAIK,OAAO,KAAK,UAAW;IAC9CU,QAAQ,EAAEb,OAAO,IAAIG,OAAO,KAAK,SAAU;IAC3CW,MAAM,EAAEZ;EAAM,IAEbN,QACU,CACQ,CAAC;AAE5B,CAAC,CAAC;AAEF,IAAMmB,MAAM,gBAAGlC,KAAK,CAACW,UAAU,CAC7B,SAASwB,WAAWA,CAACZ,KAAK,EAAET,GAAG,EAAE;EAC/B,IAAMsB,IAAI,GAAGnC,cAAc,CAAC,CAAC;EAC7B,IAAAoC,iBAAA,GAA8BrC,KAAK,CAACsC,UAAU,CAAChC,YAAY,CAAC;IAApDE,OAAO,GAAA6B,iBAAA,CAAP7B,OAAO;IAAEC,QAAQ,GAAA4B,iBAAA,CAAR5B,QAAQ;EAEzB,oBACET,KAAA,CAAA0B,aAAA,CAACtB,YAAY,EAAAyB,QAAA;IACXf,GAAG,EAAEA,GAAI;IACT,eAAY,OAAO;IACnB,cAAYsB,IAAI,CAACG,CAAC,CAAC,mBAAmB,CAAE;IACxC,sBAAAC,MAAA,CAAoB/B,QAAQ,OAAA+B,MAAA,CAAIhC,OAAO,CAAG;IAC1CiC,EAAE,EAAEhC;EAAS,GACTc,KAAK;IACTmB,IAAI,eAAE1C,KAAA,CAAA0B,aAAA,CAAC5B,KAAK;MAAC6C,IAAI,EAAC;IAAK,CAAE,CAAE;IAC3BC,IAAI,EAAC,IAAI;IACTtB,OAAO,EAAC;EAAU,EACnB,CAAC;AAEN,CACF,CAAC;AAED,IAAMuB,KAAK,gBAAG7C,KAAK,CAACW,UAAU,CAG5B,SAASkC,KAAKA,CAAAC,KAAA,EAAyBhC,GAAG,EAAE;EAAA,IAA3BC,QAAQ,GAAA+B,KAAA,CAAR/B,QAAQ;IAAKQ,KAAK,GAAAC,wBAAA,CAAAsB,KAAA,EAAAC,UAAA;EACnC,IAAAC,kBAAA,GAAoBhD,KAAK,CAACsC,UAAU,CAAChC,YAAY,CAAC;IAA1CE,OAAO,GAAAwC,kBAAA,CAAPxC,OAAO;EAEf,oBACER,KAAA,CAAA0B,aAAA,CAACvB,WAAW,EAAA0B,QAAA;IAACY,EAAE,EAAEjC,OAAQ;IAACM,GAAG,EAAEA;EAAI,GAAKS,KAAK,GAC1CR,QACU,CAAC;AAElB,CAAC,CAAC;AAEFL,MAAM,CAACuC,WAAW,GAAG,OAAO;AAC5Bf,MAAM,CAACe,WAAW,GAAG,cAAc;AACnCJ,KAAK,CAACI,WAAW,GAAG,aAAa;;AAEjC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,IAAMrC,KAAK,GAAGV,gBAAgB,CACnC;EACE2C,KAAK,EAALA,KAAK;EACLX,MAAM,EAANA;AACF,CAAC,EACDxB,MACF,CAAC"}

package/dist/Token/Token.styles.d.ts

@@ -1,12 +1,8 @@
 /// <reference types="react" />
 export declare const StyledLabel: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>> & string;
-export declare const StyledRemove: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<{
-    size?: import("@procore/core-icons/dist/Icon").IconSize | undefined;
-} & import("react").SVGAttributes<SVGElement> & import("react").RefAttributes<SVGSVGElement>, "ref"> & {
-    ref?: ((instance: SVGSVGElement | null) => void) | import("react").RefObject<SVGSVGElement> | null | undefined;
-}, never>> & string & Omit<import("react").ForwardRefExoticComponent<{
-    size?: import("@procore/core-icons/dist/Icon").IconSize | undefined;
-} & import("react").SVGAttributes<SVGElement> & import("react").RefAttributes<SVGSVGElement>>, keyof import("react").Component<any, {}, any>>;
+export declare const StyledRemove: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<import("../Button").ButtonProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & {
+    ref?: ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
+}, never>> & string & Omit<import("react").ForwardRefExoticComponent<import("../Button").ButtonProps & import("react").RefAttributes<HTMLButtonElement>>, keyof import("react").Component<any, {}, any>>;
 export declare const StyledToken: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
     $disabled: boolean;
     $focused: boolean;

package/dist/Token/Token.styles.js

@@ -1,26 +1,26 @@
-import { Clear } from '@procore/core-icons/dist';
 import styled, { css } from 'styled-components';
-import { getTypographyIntent } from '../Typography/Typography.styles';
+import { Button } from '../Button';
+import { getTypographyIntent } from '../Typography';
 import { colors } from '../_styles/colors';
 import { getEllipsis, getFocus } from '../_styles/mixins';
 import { spacing } from '../_styles/spacing';
 export var StyledLabel = /*#__PURE__*/styled.span.withConfig({
   displayName: "StyledLabel",
-  componentId: "core-12_25_0__sc-zqi94b-0"
+  componentId: "core-12_25_2__sc-zqi94b-0"
 })(["", " ", " flex:0 1 auto;"], getTypographyIntent('body'), getEllipsis);
-export var StyledRemove = /*#__PURE__*/styled(Clear).withConfig({
+export var StyledRemove = /*#__PURE__*/styled(Button).withConfig({
   displayName: "StyledRemove",
-  componentId: "core-12_25_0__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);
+  componentId: "core-12_25_2__sc-zqi94b-1"
+})(["border-radius:100%;color:", ";flex:0 0 auto;height:16px;margin:0 -", "px 0 ", "px;padding:0;width:16px;&:hover{background:", ";color:", ";}"], colors.white, spacing.sm, spacing.sm, colors.white, colors.blue40);
 export var StyledToken = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledToken",
-  componentId: "core-12_25_0__sc-zqi94b-2"
+  componentId: "core-12_25_2__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,
     _ref$$disabled = _ref.$disabled,
     $disabled = _ref$$disabled === void 0 ? false : _ref$$disabled;
-  return $focused && css(["", " background-color:", ";", "}"], getFocus(), colors.blue45, !$disabled && css(["", "{background-color:", ";color:", ";}"], StyledRemove, colors.white, colors.blue45));
+  return $focused && css(["", " background-color:", ";", ""], getFocus(), colors.blue45, !$disabled && css(["", "{background-color:", ";color:", ";}"], StyledRemove, colors.white, colors.blue45));
 }, function (_ref2) {
   var _ref2$$disabled = _ref2.$disabled,
     $disabled = _ref2$$disabled === void 0 ? false : _ref2$$disabled;

package/dist/Token/Token.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Token.styles.js","names":["Clear","styled","css","getTypographyIntent","colors","getEllipsis","getFocus","spacing","StyledLabel","span","withConfig","displayName","componentId","StyledRemove","sm","white","blue40","StyledToken","div","blue50","xs","md","blue45","_ref","_ref$$focused","$focused","_ref$$disabled","$disabled","_ref2","_ref2$$disabled","gray70","_ref3","_ref3$$error","$error","red50"],"sources":["../../src/Token/Token.styles.tsx"],"sourcesContent":["import { Clear } from '@procore/core-icons/dist'\nimport styled, { css } from 'styled-components'\nimport { getTypographyIntent } from '../Typography/Typography.styles'\nimport { colors } from '../_styles/colors'\nimport { getEllipsis, getFocus } from '../_styles/mixins'\nimport { spacing } from '../_styles/spacing'\n\nexport const StyledLabel = styled.span`\n  ${getTypographyIntent('body')}\n\n  ${getEllipsis}\n\n  flex: 0 1 auto;\n`\n\nexport const StyledRemove = styled(Clear)`\n  border-radius: 100%;\n  cursor: pointer;\n  flex: 0 0 auto;\n  height: 16px;\n  margin: 0 -${spacing.sm}px 0 ${spacing.sm}px;\n  width: 16px;\n\n  &:hover {\n    background: ${colors.white};\n    color: ${colors.blue40};\n  }\n`\n\nexport const StyledToken = styled.div<{\n  $disabled: boolean\n  $focused: boolean\n  $error: boolean\n}>`\n  align-items: center;\n  background-color: ${colors.blue50};\n  border-radius: 200px; // TODO investigate this magic number\n  border: 1px solid transparent;\n  color: ${colors.white};\n  cursor: default;\n  display: inline-flex;\n  height: 24px;\n  line-height: 1; // TODO investigate this magic number\n  max-width: 360px; // TODO investigate this magic number\n  min-width: 48px; // TODO investigate this magic number\n  padding: ${spacing.xs}px ${spacing.md}px;\n\n  &:hover,\n  &.hover {\n    background-color: ${colors.blue45};\n  }\n\n  ${({ $focused = false, $disabled = false }) =>\n    $focused &&\n    css`\n      ${getFocus()}\n\n      background-color: ${colors.blue45};\n\n      ${\n        !$disabled &&\n        css`\n          ${StyledRemove} {\n            background-color: ${colors.white};\n            color: ${colors.blue45};\n          }\n        `\n      }}\n    `}\n\n  ${({ $disabled = false }) =>\n    $disabled &&\n    css`\n      background-color: ${colors.gray70};\n      border-color: transparent;\n      box-shadow: none;\n      pointer-events: none;\n    `}\n\n  ${({ $error = false }) =>\n    $error &&\n    css`\n      &,\n      &:hover {\n        background-color: ${colors.red50};\n      }\n    `}\n`\n"],"mappings":"AAAA,SAASA,KAAK,QAAQ,0BAA0B;AAChD,OAAOC,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAC/C,SAASC,mBAAmB,QAAQ,iCAAiC;AACrE,SAASC,MAAM,QAAQ,mBAAmB;AAC1C,SAASC,WAAW,EAAEC,QAAQ,QAAQ,mBAAmB;AACzD,SAASC,OAAO,QAAQ,oBAAoB;AAE5C,OAAO,IAAMC,WAAW,gBAAGP,MAAM,CAACQ,IAAI,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,iCAClCT,mBAAmB,CAAC,MAAM,CAAC,EAE3BE,WAAW,CAGd;AAED,OAAO,IAAMQ,YAAY,gBAAGZ,MAAM,CAACD,KAAK,CAAC,CAAAU,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,8IAK1BL,OAAO,CAACO,EAAE,EAAQP,OAAO,CAACO,EAAE,EAIzBV,MAAM,CAACW,KAAK,EACjBX,MAAM,CAACY,MAAM,CAEzB;AAED,OAAO,IAAMC,WAAW,gBAAGhB,MAAM,CAACiB,GAAG,CAAAR,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,qRAMfR,MAAM,CAACe,MAAM,EAGxBf,MAAM,CAACW,KAAK,EAOVR,OAAO,CAACa,EAAE,EAAMb,OAAO,CAACc,EAAE,EAIfjB,MAAM,CAACkB,MAAM,EAGjC,UAAAC,IAAA;EAAA,IAAAC,aAAA,GAAAD,IAAA,CAAGE,QAAQ;IAARA,QAAQ,GAAAD,aAAA,cAAG,KAAK,GAAAA,aAAA;IAAAE,cAAA,GAAAH,IAAA,CAAEI,SAAS;IAATA,SAAS,GAAAD,cAAA,cAAG,KAAK,GAAAA,cAAA;EAAA,OACtCD,QAAQ,IACRvB,GAAG,uCACCI,QAAQ,CAAC,CAAC,EAEQF,MAAM,CAACkB,MAAM,EAG/B,CAACK,SAAS,IACVzB,GAAG,8CACCW,YAAY,EACQT,MAAM,CAACW,KAAK,EACvBX,MAAM,CAACkB,MAAM,CAEzB,CAEJ;AAAA,GAED,UAAAM,KAAA;EAAA,IAAAC,eAAA,GAAAD,KAAA,CAAGD,SAAS;IAATA,SAAS,GAAAE,eAAA,cAAG,KAAK,GAAAA,eAAA;EAAA,OACpBF,SAAS,IACTzB,GAAG,0FACmBE,MAAM,CAAC0B,MAAM,CAIlC;AAAA,GAED,UAAAC,KAAA;EAAA,IAAAC,YAAA,GAAAD,KAAA,CAAGE,MAAM;IAANA,MAAM,GAAAD,YAAA,cAAG,KAAK,GAAAA,YAAA;EAAA,OACjBC,MAAM,IACN/B,GAAG,wCAGqBE,MAAM,CAAC8B,KAAK,CAEnC;AAAA,EACJ"}
+{"version":3,"file":"Token.styles.js","names":["styled","css","Button","getTypographyIntent","colors","getEllipsis","getFocus","spacing","StyledLabel","span","withConfig","displayName","componentId","StyledRemove","white","sm","blue40","StyledToken","div","blue50","xs","md","blue45","_ref","_ref$$focused","$focused","_ref$$disabled","$disabled","_ref2","_ref2$$disabled","gray70","_ref3","_ref3$$error","$error","red50"],"sources":["../../src/Token/Token.styles.tsx"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport { Button } from '../Button'\nimport { getTypographyIntent } from '../Typography'\nimport { colors } from '../_styles/colors'\nimport { getEllipsis, getFocus } from '../_styles/mixins'\nimport { spacing } from '../_styles/spacing'\n\nexport const StyledLabel = styled.span`\n  ${getTypographyIntent('body')}\n\n  ${getEllipsis}\n\n  flex: 0 1 auto;\n`\n\nexport const StyledRemove = styled(Button)`\n  border-radius: 100%;\n  color: ${colors.white};\n  flex: 0 0 auto;\n  height: 16px;\n  margin: 0 -${spacing.sm}px 0 ${spacing.sm}px;\n  padding: 0;\n  width: 16px;\n\n  &:hover {\n    background: ${colors.white};\n    color: ${colors.blue40};\n  }\n`\n\nexport const StyledToken = styled.div<{\n  $disabled: boolean\n  $focused: boolean\n  $error: boolean\n}>`\n  align-items: center;\n  background-color: ${colors.blue50};\n  border-radius: 200px; // TODO investigate this magic number\n  border: 1px solid transparent;\n  color: ${colors.white};\n  cursor: default;\n  display: inline-flex;\n  height: 24px;\n  line-height: 1; // TODO investigate this magic number\n  max-width: 360px; // TODO investigate this magic number\n  min-width: 48px; // TODO investigate this magic number\n  padding: ${spacing.xs}px ${spacing.md}px;\n\n  &:hover,\n  &.hover {\n    background-color: ${colors.blue45};\n  }\n\n  ${({ $focused = false, $disabled = false }) =>\n    $focused &&\n    css`\n      ${getFocus()}\n\n      background-color: ${colors.blue45};\n\n      ${!$disabled &&\n      css`\n        ${StyledRemove} {\n          background-color: ${colors.white};\n          color: ${colors.blue45};\n        }\n      `}\n    `}\n\n  ${({ $disabled = false }) =>\n    $disabled &&\n    css`\n      background-color: ${colors.gray70};\n      border-color: transparent;\n      box-shadow: none;\n      pointer-events: none;\n    `}\n\n  ${({ $error = false }) =>\n    $error &&\n    css`\n      &,\n      &:hover {\n        background-color: ${colors.red50};\n      }\n    `}\n`\n"],"mappings":"AAAA,OAAOA,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAC/C,SAASC,MAAM,QAAQ,WAAW;AAClC,SAASC,mBAAmB,QAAQ,eAAe;AACnD,SAASC,MAAM,QAAQ,mBAAmB;AAC1C,SAASC,WAAW,EAAEC,QAAQ,QAAQ,mBAAmB;AACzD,SAASC,OAAO,QAAQ,oBAAoB;AAE5C,OAAO,IAAMC,WAAW,gBAAGR,MAAM,CAACS,IAAI,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,iCAClCT,mBAAmB,CAAC,MAAM,CAAC,EAE3BE,WAAW,CAGd;AAED,OAAO,IAAMQ,YAAY,gBAAGb,MAAM,CAACE,MAAM,CAAC,CAAAQ,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,oJAE/BR,MAAM,CAACU,KAAK,EAGRP,OAAO,CAACQ,EAAE,EAAQR,OAAO,CAACQ,EAAE,EAKzBX,MAAM,CAACU,KAAK,EACjBV,MAAM,CAACY,MAAM,CAEzB;AAED,OAAO,IAAMC,WAAW,gBAAGjB,MAAM,CAACkB,GAAG,CAAAR,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,qRAMfR,MAAM,CAACe,MAAM,EAGxBf,MAAM,CAACU,KAAK,EAOVP,OAAO,CAACa,EAAE,EAAMb,OAAO,CAACc,EAAE,EAIfjB,MAAM,CAACkB,MAAM,EAGjC,UAAAC,IAAA;EAAA,IAAAC,aAAA,GAAAD,IAAA,CAAGE,QAAQ;IAARA,QAAQ,GAAAD,aAAA,cAAG,KAAK,GAAAA,aAAA;IAAAE,cAAA,GAAAH,IAAA,CAAEI,SAAS;IAATA,SAAS,GAAAD,cAAA,cAAG,KAAK,GAAAA,cAAA;EAAA,OACtCD,QAAQ,IACRxB,GAAG,sCACCK,QAAQ,CAAC,CAAC,EAEQF,MAAM,CAACkB,MAAM,EAE/B,CAACK,SAAS,IACZ1B,GAAG,8CACCY,YAAY,EACQT,MAAM,CAACU,KAAK,EACvBV,MAAM,CAACkB,MAAM,CAEzB,CACF;AAAA,GAED,UAAAM,KAAA;EAAA,IAAAC,eAAA,GAAAD,KAAA,CAAGD,SAAS;IAATA,SAAS,GAAAE,eAAA,cAAG,KAAK,GAAAA,eAAA;EAAA,OACpBF,SAAS,IACT1B,GAAG,0FACmBG,MAAM,CAAC0B,MAAM,CAIlC;AAAA,GAED,UAAAC,KAAA;EAAA,IAAAC,YAAA,GAAAD,KAAA,CAAGE,MAAM;IAANA,MAAM,GAAAD,YAAA,cAAG,KAAK,GAAAA,YAAA;EAAA,OACjBC,MAAM,IACNhC,GAAG,wCAGqBG,MAAM,CAAC8B,KAAK,CAEnC;AAAA,EACJ"}

package/dist/Token/Token.types.d.ts

@@ -34,3 +34,7 @@ export interface TokenProps {
      */
     variant?: 'disabled' | 'focused' | 'icon' | 'standard';
 }
+export interface TokenContextApi {
+    labelId: string;
+    removeId: string;
+}

package/dist/Token/Token.types.js.map

@@ -1 +1 @@
-{"version":3,"file":"Token.types.js","names":[],"sources":["../../src/Token/Token.types.ts"],"sourcesContent":["export interface TokenProps {\n  /**\n   * Disables the token\n   * @since 10.19.0\n   */\n  disabled?: boolean\n  /**\n   * @since 10.19.0\n   */\n  focused?: boolean\n  /**\n   * @since 10.19.0\n   */\n  error?: boolean\n  /**\n   * @deprecated\n   *\n   * All variants have been deprecated and will be removed in a future version.\n   * Please use `Token.Remove` component or `disabled` boolean prop instead.\n   *\n   * **Before**\n   *\n   * `<Token variant='icon'>\n   *    <Token.Icon icon=\"x\" />\n   * </Token>`\n   *\n   * **After**\n   *\n   * `<Token>\n   *    <Token.Remove />\n   * </Token>`\n   *\n   * @deprecatedSince 10.27.0\n   */\n  variant?: 'disabled' | 'focused' | 'icon' | 'standard'\n}\n"],"mappings":""}
+{"version":3,"file":"Token.types.js","names":[],"sources":["../../src/Token/Token.types.ts"],"sourcesContent":["export interface TokenProps {\n  /**\n   * Disables the token\n   * @since 10.19.0\n   */\n  disabled?: boolean\n  /**\n   * @since 10.19.0\n   */\n  focused?: boolean\n  /**\n   * @since 10.19.0\n   */\n  error?: boolean\n  /**\n   * @deprecated\n   *\n   * All variants have been deprecated and will be removed in a future version.\n   * Please use `Token.Remove` component or `disabled` boolean prop instead.\n   *\n   * **Before**\n   *\n   * `<Token variant='icon'>\n   *    <Token.Icon icon=\"x\" />\n   * </Token>`\n   *\n   * **After**\n   *\n   * `<Token>\n   *    <Token.Remove />\n   * </Token>`\n   *\n   * @deprecatedSince 10.27.0\n   */\n  variant?: 'disabled' | 'focused' | 'icon' | 'standard'\n}\n\nexport interface TokenContextApi {\n  labelId: string\n  removeId: string\n}\n"],"mappings":""}

package/dist/ToolHeader/ToolHeader.d.ts

@@ -1,12 +1,11 @@
 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>>;
+export declare const Icon: React.ForwardRefExoticComponent<React.SVGAttributes<SVGElement> & ToolHeaderIconProps & React.RefAttributes<HTMLDivElement>>;
 declare function SettingsActionInner<Role extends ToolHeaderSettingsActionPolyType>(props: ToolHeaderSettingsActionProps<Role>, ref: ToolHeaderSettingsActionRef<Role>): React.JSX.Element;
 export declare const Title: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<import("../Semantic/Semantic.types").HeadingProps & React.RefAttributes<HTMLHeadingElement>, "ref"> & {
     ref?: ((instance: HTMLHeadingElement | null) => void) | React.RefObject<HTMLHeadingElement> | null | undefined;
 }, never>> & string & Omit<React.ForwardRefExoticComponent<import("../Semantic/Semantic.types").HeadingProps & React.RefAttributes<HTMLHeadingElement>>, keyof React.Component<any, {}, any>>;
-export declare const Tabs: React.ForwardRefExoticComponent<DivAttributes & Props & React.RefAttributes<HTMLDivElement>>;
+export declare const Tabs: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
 export declare const Actions: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
 /**
  * @deprecated
@@ -17,7 +16,7 @@ export declare const Actions: import("styled-components/dist/types").IStyledComp
  *
  * @see https://core.procore.com/latest/web/components/pill/react/
  */
-export declare const Badge: React.ForwardRefExoticComponent<DivAttributes & ToolHeaderBadgeProps & React.RefAttributes<HTMLDivElement>>;
+export declare const Badge: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & ToolHeaderBadgeProps & React.RefAttributes<HTMLDivElement>>;
 /**
  * @deprecated This `ToolHeader` component is no longer supported and it is now recommended
  * to use the layout `ToolLandingPage`, `ToolLandingPage.Title` (for the settings button),
@@ -28,13 +27,13 @@ export declare const Badge: React.ForwardRefExoticComponent<DivAttributes & Tool
  * @see https://stories.core.procore.com/?path=/story/core-react_demos-toollandingpage--demo
  */
 export declare const ToolHeader: React.ForwardRefExoticComponent<Omit<any, "ref"> & React.RefAttributes<HTMLDivElement>> & {
-    Icon: React.ForwardRefExoticComponent<SVGAttributes & ToolHeaderIconProps & React.RefAttributes<HTMLDivElement>>;
+    Icon: React.ForwardRefExoticComponent<React.SVGAttributes<SVGElement> & ToolHeaderIconProps & React.RefAttributes<HTMLDivElement>>;
     Title: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<import("../Semantic/Semantic.types").HeadingProps & React.RefAttributes<HTMLHeadingElement>, "ref"> & {
         ref?: ((instance: HTMLHeadingElement | null) => void) | React.RefObject<HTMLHeadingElement> | null | undefined;
     }, never>> & string & Omit<React.ForwardRefExoticComponent<import("../Semantic/Semantic.types").HeadingProps & React.RefAttributes<HTMLHeadingElement>>, keyof React.Component<any, {}, any>>;
-    Tabs: React.ForwardRefExoticComponent<DivAttributes & Props & React.RefAttributes<HTMLDivElement>>;
+    Tabs: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
     Actions: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-    Badge: React.ForwardRefExoticComponent<DivAttributes & ToolHeaderBadgeProps & React.RefAttributes<HTMLDivElement>>;
+    Badge: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & ToolHeaderBadgeProps & React.RefAttributes<HTMLDivElement>>;
     SettingsAction: <Role extends ToolHeaderSettingsActionPolyType>(props: ToolHeaderSettingsActionProps<Role>) => ReturnType<typeof SettingsActionInner>;
 };
 export {};

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 type { DivAttributes, Props, SVGAttributes } from '../_utils/types'\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  SVGAttributes & 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<HTMLDivElement, DivAttributes & Props>(\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)\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  DivAttributes & 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","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":";;;;;;;;;;;;AAAA,SAASA,GAAG,QAAQ,qBAAqB;AACzC,OAAOC,KAAK,MAAM,OAAO;AACzB,SAASC,IAAI,IAAIC,QAAQ,QAAQ,cAAc;AAC/C,SAASC,cAAc,QAAQ,gBAAgB;AAC/C,SAASC,gBAAgB,QAAQ,4BAA4B;AAC7D,SAASC,UAAU,QAAQ,cAAc;AACzC,SACEC,mBAAmB,EACnBC,iBAAiB,EACjBC,gBAAgB,EAChBC,gBAAgB,EAChBC,6BAA6B,EAC7BC,qBAAqB,QAChB,qBAAqB;AAS5B,IAAMC,WAAW,gBAAGZ,KAAK,CAACa,UAAU,CAAsB,UAACC,KAAK,EAAEC,GAAG,EAAK;EACxE,oBAAOf,KAAA,CAAAgB,aAAA,CAACP,gBAAgB,EAAAQ,QAAA;IAACF,GAAG,EAAEA;EAAI,GAAKD,KAAK,CAAG,CAAC;AAClD,CAAC,CAAC;AAEF,OAAO,IAAMI,IAAI,gBAAGlB,KAAK,CAACa,UAAU,CAGlC,SAASK,IAAIA,CAAAC,IAAA,EAAuCJ,GAAG,EAAE;EAAA,IAAzCK,SAAS,GAAAD,IAAA,CAATC,SAAS;IAAQC,KAAK,GAAAF,IAAA,CAAXG,IAAI;IAAYR,KAAK,GAAAS,wBAAA,CAAAJ,IAAA,EAAAK,SAAA;EAChD,IAAMF,IAAI,GAAGD,KAAK,gBAChBrB,KAAK,CAACyB,YAAY,CAACJ,KAAK,EAAAK,aAAA,CAAAA,aAAA,KAA6BZ,KAAK;IAAEa,IAAI,EAAE;EAAI,EAAE,CAAC,gBAEzE3B,KAAA,CAAAgB,aAAA,CAACjB,GAAG,EAAAkB,QAAA,KAAKH,KAAK;IAAEa,IAAI,EAAC;EAAI,EAAE,CAC5B;EACD,oBACE3B,KAAA,CAAAgB,aAAA,CAACN,6BAA6B;IAACU,SAAS,EAAEA,SAAU;IAACL,GAAG,EAAEA;EAAI,GAC3DO,IAC4B,CAAC;AAEpC,CAAC,CAAC;AAEF,SAASM,mBAAmBA,CAC1Bd,KAA0C,EAC1CC,GAAsC,EACtC;EACA,IAAMc,IAAI,GAAG1B,cAAc,CAAC,CAAC;EAE7B,IAAM2B,IAAI,GAAGzB,UAAiB;EAE9B,oBACEL,KAAA,CAAAgB,aAAA,CAACc,IAAI,EAAAb,QAAA;IACH,cAAYY,IAAI,CAACE,CAAC,CAAC,gCAAgC,CAAE;IACrDhB,GAAG,EAAEA;EAAI,GACLD,KAAK,gBAETd,KAAA,CAAAgB,aAAA,CAACgB,UAAU,CAACd,IAAI,MAAE,CACd,CAAC;AAEX;AAEA,IAAMe,cAAc,gBAAGjC,KAAK,CAACa,UAAU,CAACe,mBAAmB,CAIhB;AAE3C,OAAO,IAAMM,KAAK,GAAGvB,qBAAqB;AAE1C,OAAO,IAAMV,IAAI,gBAAGD,KAAK,CAACa,UAAU,CAGlC,SAASZ,IAAIA,CAAAkC,KAAA,EAAoCpB,GAAG,EAAE;EAAA,IAAtCqB,QAAQ,GAAAD,KAAA,CAARC,QAAQ;IAAEhB,SAAS,GAAAe,KAAA,CAATf,SAAS;IAAKN,KAAK,GAAAS,wBAAA,CAAAY,KAAA,EAAAE,UAAA;EAC7C,oBACErC,KAAA,CAAAgB,aAAA,CAACR,gBAAgB;IAACY,SAAS,EAAEA,SAAU;IAACL,GAAG,EAAEA;EAAI,gBAC/Cf,KAAA,CAAAgB,aAAA,CAACd,QAAQ,EAAKY,KAAK,EAAGsB,QAAmB,CACzB,CAAC;AAEvB,CAAC,CAAC;AAEF,OAAO,IAAME,OAAO,GAAGhC,mBAAmB;;AAE1C;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,IAAMiC,KAAK,gBAAGvC,KAAK,CAACa,UAAU,CAGnC,SAAS0B,KAAKA,CAAAC,KAAA,EAAkCzB,GAAG,EAAE;EAAA,IAApCqB,QAAQ,GAAAI,KAAA,CAARJ,QAAQ;IAAEK,OAAO,GAAAD,KAAA,CAAPC,OAAO;IAAK3B,KAAK,GAAAS,wBAAA,CAAAiB,KAAA,EAAAE,UAAA;EAC5C,oBACE1C,KAAA,CAAAgB,aAAA,CAACT,iBAAiB,EAAAU,QAAA,KAAKH,KAAK;IAAE6B,QAAQ,EAAEF,OAAQ;IAAC1B,GAAG,EAAEA;EAAI,IACvDqB,QACgB,CAAC;AAExB,CAAC,CAAC;AAEFxB,WAAW,CAACgC,WAAW,GAAG,YAAY;AAEtC1B,IAAI,CAAC0B,WAAW,GAAG,iBAAiB;AAEpCV,KAAK,CAACU,WAAW,GAAG,kBAAkB;AAEtC3C,IAAI,CAAC2C,WAAW,GAAG,iBAAiB;AAEpCN,OAAO,CAACM,WAAW,GAAG,oBAAoB;AAE1CL,KAAK,CAACK,WAAW,GAAG,kBAAkB;;AAEtC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,IAAMZ,UAAU,GAAG5B,gBAAgB,CACxC;EACEc,IAAI,EAAJA,IAAI;EACJgB,KAAK,EAALA,KAAK;EACLjC,IAAI,EAAJA,IAAI;EACJqC,OAAO,EAAPA,OAAO;EACPC,KAAK,EAALA,KAAK;EACLN,cAAc,EAAdA;AACF,CAAC,EACDrB,WACF,CAAC"}

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_25_0__sc-1jpjx47-0"
+  componentId: "core-12_25_2__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_25_0__sc-1jpjx47-1"
+  componentId: "core-12_25_2__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_25_0__sc-1jpjx47-2"
+  componentId: "core-12_25_2__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_25_0__sc-1jpjx47-3"
+  componentId: "core-12_25_2__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_25_0__sc-1jpjx47-4"
+  componentId: "core-12_25_2__sc-1jpjx47-4"
 })(["margin-right:", "px;white-space:nowrap;"], spacing.xl);
 export var StyledToolHeader = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledToolHeader",
-  componentId: "core-12_25_0__sc-1jpjx47-5"
+  componentId: "core-12_25_2__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_25_0__sc-wa8j06-0"
+  componentId: "core-12_25_2__sc-wa8j06-0"
 })(["align-items:center;display:flex;gap:", "px;"], spacing.md);
 export var StyledTitleInner = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledTitleInner",
-  componentId: "core-12_25_0__sc-wa8j06-1"
+  componentId: "core-12_25_2__sc-wa8j06-1"
 })(["width:100%;"]);
 export var StyledToolLandingPageBodyContent = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledToolLandingPageBodyContent",
-  componentId: "core-12_25_0__sc-wa8j06-2"
+  componentId: "core-12_25_2__sc-wa8j06-2"
 })(["> * + *{margin-top:", "px;}"], spacing.sm);
 //# sourceMappingURL=ToolLandingPage.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-12_25_0__sc-1fawsi4-0"
+  componentId: "core-12_25_2__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-12_25_0__sc-1fawsi4-1"
+  componentId: "core-12_25_2__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.styles.d.ts

@@ -1,9 +1,9 @@
 /// <reference types="react" />
-export declare const StyledFilenameCaption: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<import("..").SpanAttributes & import("..").TypographyProps & import("react").RefAttributes<HTMLSpanElement>, "ref"> & {
+export declare const StyledFilenameCaption: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<import("react").HTMLAttributes<HTMLSpanElement> & import("..").TypographyProps & import("react").RefAttributes<HTMLSpanElement>, "ref"> & {
     ref?: ((instance: HTMLSpanElement | null) => void) | import("react").RefObject<HTMLSpanElement> | null | undefined;
-}, never>> & string & Omit<import("react").ForwardRefExoticComponent<import("..").SpanAttributes & import("..").TypographyProps & import("react").RefAttributes<HTMLSpanElement>>, keyof import("react").Component<any, {}, any>>;
+}, never>> & string & Omit<import("react").ForwardRefExoticComponent<import("react").HTMLAttributes<HTMLSpanElement> & import("..").TypographyProps & import("react").RefAttributes<HTMLSpanElement>>, keyof import("react").Component<any, {}, any>>;
 export declare const StyledTree: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const StyledTreeRowContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<Omit<import("..").SpanAttributes & import("..").TypographyProps & import("react").RefAttributes<HTMLSpanElement>, "ref"> & {
+export declare const StyledTreeRowContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<Omit<import("react").HTMLAttributes<HTMLSpanElement> & import("..").TypographyProps & import("react").RefAttributes<HTMLSpanElement>, "ref"> & {
     ref?: ((instance: HTMLSpanElement | null) => void) | import("react").RefObject<HTMLSpanElement> | null | undefined;
 }, {
     /** @deprecated Use $isHighlighted instead */
@@ -15,13 +15,13 @@ export declare const StyledTreeRowContainer: import("styled-components/dist/type
     /** @deprecated Use $isSelected instead */
     isSelected?: boolean | undefined;
     $isSelected?: boolean | undefined;
-}>> & string & Omit<import("react").ForwardRefExoticComponent<import("..").SpanAttributes & import("..").TypographyProps & import("react").RefAttributes<HTMLSpanElement>>, keyof import("react").Component<any, {}, any>>;
+}>> & string & Omit<import("react").ForwardRefExoticComponent<import("react").HTMLAttributes<HTMLSpanElement> & import("..").TypographyProps & import("react").RefAttributes<HTMLSpanElement>>, keyof import("react").Component<any, {}, any>>;
 export declare const StyledTreeRowContent: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
 export declare const StyledTreeRowWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const StyledChevronContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<Omit<import("..").DivAttributes & import("..").BoxProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & {
+export declare const StyledChevronContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<Omit<import("react").HTMLAttributes<HTMLDivElement> & import("..").BoxProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & {
     ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
 }, never>, never>> & string;
-export declare const StyledIconContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<Omit<import("..").DivAttributes & import("..").BoxProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & {
+export declare const StyledIconContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<Omit<import("react").HTMLAttributes<HTMLDivElement> & import("..").BoxProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & {
     ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
 }, never>, {
     $isSelected?: boolean | undefined;

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_25_0__sc-2d45b5-0"
+  componentId: "core-12_25_2__sc-2d45b5-0"
 })(["display:flex;width:100%;"]);
 export var StyledTree = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledTree",
-  componentId: "core-12_25_0__sc-2d45b5-1"
+  componentId: "core-12_25_2__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_25_0__sc-2d45b5-2"
+  componentId: "core-12_25_2__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,30 +35,30 @@ export var StyledTreeRowContainer = /*#__PURE__*/styled(Typography).withConfig({
 });
 export var StyledTreeRowContent = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledTreeRowContent",
-  componentId: "core-12_25_0__sc-2d45b5-3"
+  componentId: "core-12_25_2__sc-2d45b5-3"
 })(["display:flex;align-items:center;"]);
 export var StyledTreeRowWrapper = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledTreeRowWrapper",
-  componentId: "core-12_25_0__sc-2d45b5-4"
+  componentId: "core-12_25_2__sc-2d45b5-4"
 })(["outline:none;"]);
 var StyledIconBase = /*#__PURE__*/styled(Box).withConfig({
   displayName: "StyledIconBase",
-  componentId: "core-12_25_0__sc-2d45b5-5"
+  componentId: "core-12_25_2__sc-2d45b5-5"
 })(["display:flex;justify-content:center;align-items:center;width:24px;height:24px;min-width:24px;min-height:24px;"]);
 export var StyledChevronContainer = /*#__PURE__*/styled(StyledIconBase).withConfig({
   displayName: "StyledChevronContainer",
-  componentId: "core-12_25_0__sc-2d45b5-6"
+  componentId: "core-12_25_2__sc-2d45b5-6"
 })([""]);
 export var StyledIconContainer = /*#__PURE__*/styled(StyledIconBase).withConfig({
   displayName: "StyledIconContainer",
-  componentId: "core-12_25_0__sc-2d45b5-7"
+  componentId: "core-12_25_2__sc-2d45b5-7"
 })(["color:", ";"], function (_ref4) {
   var $isSelected = _ref4.$isSelected;
   return $isSelected ? colors.blue45 : colors.gray40;
 });
 export var StyledChevron = /*#__PURE__*/styled(ChevronRight).withConfig({
   displayName: "StyledChevron",
-  componentId: "core-12_25_0__sc-2d45b5-8"
+  componentId: "core-12_25_2__sc-2d45b5-8"
 })(["transform:rotate(", "deg);transition:transform 150ms ease-out;"], function (_ref5) {
   var $isExpanded = _ref5.$isExpanded;
   return $isExpanded ? 90 : 0;

package/dist/Tree/Tree.types.d.ts

@@ -2,7 +2,6 @@ import type React from 'react';
 import type { FixedSizeListProps, ListChildComponentProps } from 'react-window';
 import type { BoxProps } from '../Box/Box.types';
 import type { OverlayProps } from '../Overlay/Overlay';
-import type { DivAttributes } from '../_utils/types';
 import type { UNSAFE_treeRootNodeId } from './Tree';
 declare type NodeType = 'branch' | 'leaf';
 export declare type TreeNodeId = number | string | null | undefined | typeof UNSAFE_treeRootNodeId;
@@ -218,7 +217,7 @@ export interface TreeRowProps<T extends Node = Node> extends Omit<TreeNodeAPI, '
      */
     treeContainer: HTMLDivElement;
 }
-export interface TreeProps<T extends Node = Node, P extends CustomDataType<T> = Array<T>> extends Omit<DivAttributes, 'onSelect'>, Partial<Pick<FixedSizeListProps, 'innerElementType' | 'outerElementType'>> {
+export interface TreeProps<T extends Node = Node, P extends CustomDataType<T> = Array<T>> extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onSelect'>, Partial<Pick<FixedSizeListProps, 'innerElementType' | 'outerElementType'>> {
     /**
      * @since 10.19.0
      */
@@ -413,7 +412,7 @@ export interface TreeRowTooltipProps {
      */
     treeContainer: HTMLDivElement;
 }
-export interface TreeRowContainerProps extends Omit<DivAttributes, 'color'> {
+export interface TreeRowContainerProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'color'> {
     /**
      * @since 10.19.0
      */

package/dist/Tree/Tree.types.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tree.types.js","names":[],"sources":["../../src/Tree/Tree.types.ts"],"sourcesContent":["import type React from 'react'\nimport type { FixedSizeListProps, ListChildComponentProps } from 'react-window'\nimport type { BoxProps } from '../Box/Box.types'\nimport type { OverlayProps } from '../Overlay/Overlay'\nimport type { DivAttributes } from '../_utils/types'\nimport type { UNSAFE_treeRootNodeId } from './Tree'\n\ntype NodeType = 'branch' | 'leaf'\n\nexport type TreeNodeId =\n  | number\n  | string\n  | null\n  | undefined\n  | typeof UNSAFE_treeRootNodeId\n\nexport interface Node {\n  /**\n   * @since 10.19.0\n   */\n  id: TreeNodeId\n}\nexport interface TreeDefaultNode extends Node {\n  /**\n   * @since 10.19.0\n   */\n  name: string\n  /**\n   * @since 10.19.0\n   */\n  parentId: TreeNodeId\n  /**\n   * @since 10.19.0\n   */\n  type: NodeType\n}\n\nexport interface LevelWise {\n  /**\n   * @since 10.19.0\n   */\n  level: number\n}\n\nexport interface UseTreeProps<T extends Node = Node> {\n  rootNodes: T[]\n  /**\n   * @since 10.19.0\n   */\n  expanded: T['id'][]\n  /**\n   * @since 10.19.0\n   */\n  selected: T['id'][]\n  /**\n   * @since 10.19.0\n   */\n  selectionLimit: number\n  /**\n   * @since 10.19.0\n   */\n  getChildren(node: T): T[]\n  /**\n   * @since 10.19.0\n   */\n  getParentId(node: T): TreeNodeId\n  /**\n   * @since 10.19.0\n   */\n  autoExpandParent: boolean\n  /**\n   * @since 10.19.0\n   */\n  multiple: boolean\n  /**\n   * @since 10.19.0\n   */\n  onSelect(nodes: T[]): void\n  /**\n   * @since 10.19.0\n   */\n  onCollapse(node: T): void\n  /**\n   * @since 10.19.0\n   */\n  onExpand(node: T): Promise<any>\n}\n\nexport interface TreeNodeAPI<T extends Node = Node> {\n  /**\n   * @since 10.19.0\n   */\n  nodes: (T & LevelWise)[]\n  /**\n   * @since 10.19.0\n   */\n  getIcon(props: T): React.ReactNode\n  /**\n   * @since 10.19.0\n   */\n  getLabel(props: T): string\n  /**\n   * @since 10.19.0\n   */\n  getType(node: T): NodeType\n  /**\n   * @since 10.19.0\n   */\n  isExpandable(node: T): boolean\n  /**\n   * @since 10.19.0\n   */\n  isSelectable(node: T): boolean\n  /**\n   * @since 10.19.0\n   */\n  isSelected(node: T): boolean\n  /**\n   * @since 10.19.0\n   */\n  isLoading(node: T): boolean\n  /**\n   * @since 10.19.0\n   */\n  isExpanded(node: T): boolean\n  /**\n   * @since 10.19.0\n   */\n  highlight(node: T): void\n  /**\n   * @since 10.19.0\n   */\n  isHighlighted(node: T): boolean\n  /**\n   * @since 10.19.0\n   */\n  handleSelection(node: T): void\n  /**\n   * @since 10.19.0\n   */\n  handleExpansion(node: T): void\n  /**\n   * @since 10.19.0\n   */\n  rowRenderer(props: TreeRowProps<T>): React.ReactNode\n  /**\n   * @since 10.19.0\n   */\n  selectionLimit: number\n  /**\n   * @since 10.19.0\n   */\n  isFileLimitReached: boolean\n  /**\n   * @since 10.19.0\n   */\n  isTreeFocused: boolean\n  /**\n   * @since 10.19.0\n   */\n  treeContainer: HTMLDivElement\n}\n\nexport interface CustomDataType<T> {\n  /**\n   * @since 10.19.0\n   */\n  [key: string]: any\n}\n\nexport interface TreeRef<T extends Node = Node> {\n  /**\n   * @since 10.19.0\n   */\n  setSelected: (selected: T | T[]) => void\n  /**\n   * @since 10.19.0\n   */\n  setExpanded: (expanded: T | T[]) => void\n  /**\n   * @since 10.19.0\n   */\n  toggleSelected: (node: T) => void\n  /**\n   * @since 10.19.0\n   */\n  toggleExpanded: (node: T) => void\n  /**\n   * @since 10.19.0\n   */\n  rootEl: HTMLElement | null\n}\n\nexport interface TreeNodeProps extends ListChildComponentProps {\n  /**\n   * @since 10.19.0\n   */\n  data: TreeNodeAPI\n}\n\nexport interface TreeRowOverlayProps {\n  /**\n   * @since 10.19.0\n   */\n  overlayRef: OverlayProps['overlayRef']\n  /**\n   * @since 10.19.0\n   */\n  targetRef: OverlayProps['targetRef']\n  /**\n   * @since 10.19.0\n   */\n  message: { key: string; options?: object }\n}\n\nexport interface TreeRowProps<T extends Node = Node>\n  extends Omit<\n    TreeNodeAPI,\n    'rowRenderer' | 'nodes' | 'highlight' | 'isTreeFocused'\n  > {\n  /**\n   * @since 10.19.0\n   */\n  node: T & LevelWise\n  /**\n   * @since 10.19.0\n   */\n  shouldShowTooltip: boolean\n  /**\n   * @since 10.19.0\n   */\n  isMouseOver: boolean\n  /**\n   * @since 10.19.0\n   */\n  treeContainer: HTMLDivElement\n}\n\nexport interface TreeProps<\n  T extends Node = Node,\n  P extends CustomDataType<T> = Array<T>\n> extends Omit<DivAttributes, 'onSelect'>,\n    Partial<Pick<FixedSizeListProps, 'innerElementType' | 'outerElementType'>> {\n  /**\n   * @since 10.19.0\n   */\n  options: P\n  /**\n   * Array of keys of the expanded nodes\n   * @since 10.19.0\n   */\n  expanded?: T['id'][]\n\n  /**\n   * Array of keys of the selected nodes\n   * @since 10.19.0\n   */\n  selected?: T['id'][]\n\n  /**\n   * Number of nodes that can be selected\n   * @default Infinity\n   * @since 10.19.0\n   */\n  selectionLimit?: number\n\n  /**\n   * Function should return a single root node or an array of root nodes\n   * ```\n   * (): Node | Node[]\n   * ```\n   * @since 10.19.0\n   * @deprecated To be removed in future release. `getParentId` should be used to determine root nodes instead.\n   * @deprecatedSince 11.9.0\n   */\n  getRoot?(data: P): T | T[]\n\n  /**\n   * Should return an array of children nodes.\n   * ```\n   * (node: Node): Node[]\n   * ```\n   * @since 10.19.0\n   */\n  getChildren?(node: T): T[]\n\n  /**\n   * This function will be executed on each node. Should return `Icon` component\n   * ```\n   * (node: Node): React.ReactNode\n   * ```\n   * @since 10.19.0\n   */\n  getIcon?(node: T): React.ReactNode\n\n  /**\n   * This function will be executed on each node. Should return `label` for row\n   * ```\n   * (node: Node): string\n   * ```\n   * @since 10.19.0\n   */\n  getLabel?(node: T): string\n\n  /**\n   * This function can be used to override the default parent detection mechanism.\n   * If not defined, `Node['parentId']` is used to get a given node's parent.\n   * ```\n   * (node: Node): TreeNodeId\n   * ```\n   * @since 10.19.0\n   * @deprecated Returning `UNSAFE_treeRootNodeId` to determine a root node is deprecated.\n   *   Return `null` or `undefined` intead.\n   * @deprecatedSince 11.9.0\n   */\n  getParentId?(node: T): TreeNodeId\n\n  /**\n   * This function will be executed on each node. Should return `'branch'` or `'leaf'`\n   * ```\n   * (node: Node): NodeType\n   * ```\n   * @since 10.19.0\n   */\n  getType?(node: T): NodeType\n\n  /**\n   * Function of whether to enable tree node expansion/collapsing.\n   * ```\n   * (node: Node): boolean\n   * ```\n   * @since 10.19.0\n   */\n  isExpandable?(node: T): boolean\n\n  /**\n   * Function of whether to enable tree node selection.\n   * ```\n   * (node: Node): boolean\n   * ```\n   * @since 10.19.0\n   */\n  isSelectable?(node: T): boolean\n\n  /**\n   * Allows selection of multiple nodes\n   * @default true\n   * @since 10.19.0\n   */\n  multiple?: boolean\n\n  /**\n   * Number of visible nodes. Helps fix performance bottlenecks in large dataset\n   * @default Infinity\n   * @since 10.19.0\n   */\n  maxVisibleNodes?: number\n\n  /**\n   * Height of the list. Helps fix performance bottlenecks in large dataset.\n   * @since 10.19.0\n   */\n  visibleHeight?: number\n\n  /**\n   * Whether to expand parent node when a child node is expanded or selected\n   * @default true\n   * @since 10.19.0\n   */\n  autoExpandParent?: boolean\n\n  /**\n   * Callback return currently selected array of nodes.\n   * ```\n   * (nodes: Node[]): void\n   * ```\n   * @since 10.19.0\n   */\n  onSelect?(nodes: T[]): void\n\n  /**\n   * Triggers when current node collapse\n   * ```\n   * (node: Node): void\n   * ```\n   * @since 10.19.0\n   */\n  onCollapse?(node: T): void\n\n  /**\n   * Triggers when current node expand\n   * ```\n   * (node: Node): Promise<void>\n   * ```\n   * @since 10.19.0\n   */\n  onExpand?(node: T): Promise<any>\n\n  /**\n   * Callback for rendering tree nodes\n   * ```\n   * (props: TreeRowProps): React.ReactNode\n   * ```\n   * @since 10.19.0\n   */\n  rowRenderer?(props: TreeRowProps<T>): React.ReactNode\n}\n\nexport interface IconContainerProps extends BoxProps {\n  /**\n   * @since 10.19.0\n   */\n  isSelected?: boolean\n}\n\nexport interface TreeRowTooltipProps {\n  /**\n   * @since 10.19.0\n   */\n  isHighlighted: boolean\n  /**\n   * @since 10.19.0\n   */\n  isSelected: boolean\n  /**\n   * @since 10.19.0\n   */\n  isSelectable: boolean\n  /**\n   * @since 10.19.0\n   */\n  selectionLimit: number\n  /**\n   * @since 10.19.0\n   */\n  isFileLimitReached: boolean\n  /**\n   * @since 10.19.0\n   */\n  shouldShowTooltip: boolean\n  /**\n   * @since 10.19.0\n   */\n  isMouseOver: boolean\n  /**\n   * @since 10.19.0\n   */\n  fileName: string\n  /**\n   * @since 10.19.0\n   */\n  nodeType: NodeType\n  /**\n   * @since 10.19.0\n   */\n  treeContainer: HTMLDivElement\n}\n\nexport interface TreeRowContainerProps extends Omit<DivAttributes, 'color'> {\n  /**\n   * @since 10.19.0\n   */\n  isHighlighted: boolean\n  /**\n   * @since 10.19.0\n   */\n  isSelected: boolean\n  /**\n   * @since 10.19.0\n   */\n  isSelectable: boolean\n  /**\n   * @since 10.19.0\n   */\n  isExpandable: boolean\n  /**\n   * @since 10.19.0\n   */\n  isFileLimitReached: boolean\n  /**\n   * @since 10.19.0\n   */\n  level: number\n}\n"],"mappings":""}
+{"version":3,"file":"Tree.types.js","names":[],"sources":["../../src/Tree/Tree.types.ts"],"sourcesContent":["import type React from 'react'\nimport type { FixedSizeListProps, ListChildComponentProps } from 'react-window'\nimport type { BoxProps } from '../Box/Box.types'\nimport type { OverlayProps } from '../Overlay/Overlay'\nimport type { UNSAFE_treeRootNodeId } from './Tree'\n\ntype NodeType = 'branch' | 'leaf'\n\nexport type TreeNodeId =\n  | number\n  | string\n  | null\n  | undefined\n  | typeof UNSAFE_treeRootNodeId\n\nexport interface Node {\n  /**\n   * @since 10.19.0\n   */\n  id: TreeNodeId\n}\nexport interface TreeDefaultNode extends Node {\n  /**\n   * @since 10.19.0\n   */\n  name: string\n  /**\n   * @since 10.19.0\n   */\n  parentId: TreeNodeId\n  /**\n   * @since 10.19.0\n   */\n  type: NodeType\n}\n\nexport interface LevelWise {\n  /**\n   * @since 10.19.0\n   */\n  level: number\n}\n\nexport interface UseTreeProps<T extends Node = Node> {\n  rootNodes: T[]\n  /**\n   * @since 10.19.0\n   */\n  expanded: T['id'][]\n  /**\n   * @since 10.19.0\n   */\n  selected: T['id'][]\n  /**\n   * @since 10.19.0\n   */\n  selectionLimit: number\n  /**\n   * @since 10.19.0\n   */\n  getChildren(node: T): T[]\n  /**\n   * @since 10.19.0\n   */\n  getParentId(node: T): TreeNodeId\n  /**\n   * @since 10.19.0\n   */\n  autoExpandParent: boolean\n  /**\n   * @since 10.19.0\n   */\n  multiple: boolean\n  /**\n   * @since 10.19.0\n   */\n  onSelect(nodes: T[]): void\n  /**\n   * @since 10.19.0\n   */\n  onCollapse(node: T): void\n  /**\n   * @since 10.19.0\n   */\n  onExpand(node: T): Promise<any>\n}\n\nexport interface TreeNodeAPI<T extends Node = Node> {\n  /**\n   * @since 10.19.0\n   */\n  nodes: (T & LevelWise)[]\n  /**\n   * @since 10.19.0\n   */\n  getIcon(props: T): React.ReactNode\n  /**\n   * @since 10.19.0\n   */\n  getLabel(props: T): string\n  /**\n   * @since 10.19.0\n   */\n  getType(node: T): NodeType\n  /**\n   * @since 10.19.0\n   */\n  isExpandable(node: T): boolean\n  /**\n   * @since 10.19.0\n   */\n  isSelectable(node: T): boolean\n  /**\n   * @since 10.19.0\n   */\n  isSelected(node: T): boolean\n  /**\n   * @since 10.19.0\n   */\n  isLoading(node: T): boolean\n  /**\n   * @since 10.19.0\n   */\n  isExpanded(node: T): boolean\n  /**\n   * @since 10.19.0\n   */\n  highlight(node: T): void\n  /**\n   * @since 10.19.0\n   */\n  isHighlighted(node: T): boolean\n  /**\n   * @since 10.19.0\n   */\n  handleSelection(node: T): void\n  /**\n   * @since 10.19.0\n   */\n  handleExpansion(node: T): void\n  /**\n   * @since 10.19.0\n   */\n  rowRenderer(props: TreeRowProps<T>): React.ReactNode\n  /**\n   * @since 10.19.0\n   */\n  selectionLimit: number\n  /**\n   * @since 10.19.0\n   */\n  isFileLimitReached: boolean\n  /**\n   * @since 10.19.0\n   */\n  isTreeFocused: boolean\n  /**\n   * @since 10.19.0\n   */\n  treeContainer: HTMLDivElement\n}\n\nexport interface CustomDataType<T> {\n  /**\n   * @since 10.19.0\n   */\n  [key: string]: any\n}\n\nexport interface TreeRef<T extends Node = Node> {\n  /**\n   * @since 10.19.0\n   */\n  setSelected: (selected: T | T[]) => void\n  /**\n   * @since 10.19.0\n   */\n  setExpanded: (expanded: T | T[]) => void\n  /**\n   * @since 10.19.0\n   */\n  toggleSelected: (node: T) => void\n  /**\n   * @since 10.19.0\n   */\n  toggleExpanded: (node: T) => void\n  /**\n   * @since 10.19.0\n   */\n  rootEl: HTMLElement | null\n}\n\nexport interface TreeNodeProps extends ListChildComponentProps {\n  /**\n   * @since 10.19.0\n   */\n  data: TreeNodeAPI\n}\n\nexport interface TreeRowOverlayProps {\n  /**\n   * @since 10.19.0\n   */\n  overlayRef: OverlayProps['overlayRef']\n  /**\n   * @since 10.19.0\n   */\n  targetRef: OverlayProps['targetRef']\n  /**\n   * @since 10.19.0\n   */\n  message: { key: string; options?: object }\n}\n\nexport interface TreeRowProps<T extends Node = Node>\n  extends Omit<\n    TreeNodeAPI,\n    'rowRenderer' | 'nodes' | 'highlight' | 'isTreeFocused'\n  > {\n  /**\n   * @since 10.19.0\n   */\n  node: T & LevelWise\n  /**\n   * @since 10.19.0\n   */\n  shouldShowTooltip: boolean\n  /**\n   * @since 10.19.0\n   */\n  isMouseOver: boolean\n  /**\n   * @since 10.19.0\n   */\n  treeContainer: HTMLDivElement\n}\n\nexport interface TreeProps<\n  T extends Node = Node,\n  P extends CustomDataType<T> = Array<T>\n> extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onSelect'>,\n    Partial<Pick<FixedSizeListProps, 'innerElementType' | 'outerElementType'>> {\n  /**\n   * @since 10.19.0\n   */\n  options: P\n  /**\n   * Array of keys of the expanded nodes\n   * @since 10.19.0\n   */\n  expanded?: T['id'][]\n\n  /**\n   * Array of keys of the selected nodes\n   * @since 10.19.0\n   */\n  selected?: T['id'][]\n\n  /**\n   * Number of nodes that can be selected\n   * @default Infinity\n   * @since 10.19.0\n   */\n  selectionLimit?: number\n\n  /**\n   * Function should return a single root node or an array of root nodes\n   * ```\n   * (): Node | Node[]\n   * ```\n   * @since 10.19.0\n   * @deprecated To be removed in future release. `getParentId` should be used to determine root nodes instead.\n   * @deprecatedSince 11.9.0\n   */\n  getRoot?(data: P): T | T[]\n\n  /**\n   * Should return an array of children nodes.\n   * ```\n   * (node: Node): Node[]\n   * ```\n   * @since 10.19.0\n   */\n  getChildren?(node: T): T[]\n\n  /**\n   * This function will be executed on each node. Should return `Icon` component\n   * ```\n   * (node: Node): React.ReactNode\n   * ```\n   * @since 10.19.0\n   */\n  getIcon?(node: T): React.ReactNode\n\n  /**\n   * This function will be executed on each node. Should return `label` for row\n   * ```\n   * (node: Node): string\n   * ```\n   * @since 10.19.0\n   */\n  getLabel?(node: T): string\n\n  /**\n   * This function can be used to override the default parent detection mechanism.\n   * If not defined, `Node['parentId']` is used to get a given node's parent.\n   * ```\n   * (node: Node): TreeNodeId\n   * ```\n   * @since 10.19.0\n   * @deprecated Returning `UNSAFE_treeRootNodeId` to determine a root node is deprecated.\n   *   Return `null` or `undefined` intead.\n   * @deprecatedSince 11.9.0\n   */\n  getParentId?(node: T): TreeNodeId\n\n  /**\n   * This function will be executed on each node. Should return `'branch'` or `'leaf'`\n   * ```\n   * (node: Node): NodeType\n   * ```\n   * @since 10.19.0\n   */\n  getType?(node: T): NodeType\n\n  /**\n   * Function of whether to enable tree node expansion/collapsing.\n   * ```\n   * (node: Node): boolean\n   * ```\n   * @since 10.19.0\n   */\n  isExpandable?(node: T): boolean\n\n  /**\n   * Function of whether to enable tree node selection.\n   * ```\n   * (node: Node): boolean\n   * ```\n   * @since 10.19.0\n   */\n  isSelectable?(node: T): boolean\n\n  /**\n   * Allows selection of multiple nodes\n   * @default true\n   * @since 10.19.0\n   */\n  multiple?: boolean\n\n  /**\n   * Number of visible nodes. Helps fix performance bottlenecks in large dataset\n   * @default Infinity\n   * @since 10.19.0\n   */\n  maxVisibleNodes?: number\n\n  /**\n   * Height of the list. Helps fix performance bottlenecks in large dataset.\n   * @since 10.19.0\n   */\n  visibleHeight?: number\n\n  /**\n   * Whether to expand parent node when a child node is expanded or selected\n   * @default true\n   * @since 10.19.0\n   */\n  autoExpandParent?: boolean\n\n  /**\n   * Callback return currently selected array of nodes.\n   * ```\n   * (nodes: Node[]): void\n   * ```\n   * @since 10.19.0\n   */\n  onSelect?(nodes: T[]): void\n\n  /**\n   * Triggers when current node collapse\n   * ```\n   * (node: Node): void\n   * ```\n   * @since 10.19.0\n   */\n  onCollapse?(node: T): void\n\n  /**\n   * Triggers when current node expand\n   * ```\n   * (node: Node): Promise<void>\n   * ```\n   * @since 10.19.0\n   */\n  onExpand?(node: T): Promise<any>\n\n  /**\n   * Callback for rendering tree nodes\n   * ```\n   * (props: TreeRowProps): React.ReactNode\n   * ```\n   * @since 10.19.0\n   */\n  rowRenderer?(props: TreeRowProps<T>): React.ReactNode\n}\n\nexport interface IconContainerProps extends BoxProps {\n  /**\n   * @since 10.19.0\n   */\n  isSelected?: boolean\n}\n\nexport interface TreeRowTooltipProps {\n  /**\n   * @since 10.19.0\n   */\n  isHighlighted: boolean\n  /**\n   * @since 10.19.0\n   */\n  isSelected: boolean\n  /**\n   * @since 10.19.0\n   */\n  isSelectable: boolean\n  /**\n   * @since 10.19.0\n   */\n  selectionLimit: number\n  /**\n   * @since 10.19.0\n   */\n  isFileLimitReached: boolean\n  /**\n   * @since 10.19.0\n   */\n  shouldShowTooltip: boolean\n  /**\n   * @since 10.19.0\n   */\n  isMouseOver: boolean\n  /**\n   * @since 10.19.0\n   */\n  fileName: string\n  /**\n   * @since 10.19.0\n   */\n  nodeType: NodeType\n  /**\n   * @since 10.19.0\n   */\n  treeContainer: HTMLDivElement\n}\n\nexport interface TreeRowContainerProps\n  extends Omit<React.HTMLAttributes<HTMLDivElement>, 'color'> {\n  /**\n   * @since 10.19.0\n   */\n  isHighlighted: boolean\n  /**\n   * @since 10.19.0\n   */\n  isSelected: boolean\n  /**\n   * @since 10.19.0\n   */\n  isSelectable: boolean\n  /**\n   * @since 10.19.0\n   */\n  isExpandable: boolean\n  /**\n   * @since 10.19.0\n   */\n  isFileLimitReached: boolean\n  /**\n   * @since 10.19.0\n   */\n  level: number\n}\n"],"mappings":""}

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_25_0__sc-gpc39h-0"
+  componentId: "core-12_25_2__sc-gpc39h-0"
 })(["", " padding-right:", "px;"], getSearchInputStyles(), spacing.xxl);
 export var StyledIcon = /*#__PURE__*/styled.div.withConfig({
   displayName: "StyledIcon",
-  componentId: "core-12_25_0__sc-gpc39h-1"
+  componentId: "core-12_25_2__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_25_0__sc-gpc39h-2"
+  componentId: "core-12_25_2__sc-gpc39h-2"
 })(["position:relative;width:100%;"]);
 //# sourceMappingURL=Typeahead.styles.js.map