@procore/core-react 11.22.1 → 11.23.0

package/babel.config.js

@@ -1,20 +1,37 @@
 const packageJson = require('./package.json')
 const version = packageJson.version.split('.').join('_')
+const namespace = `core-${version}`
 
-module.exports = {
-  presets: [
-    '@babel/preset-env',
-    '@babel/preset-react',
-    '@babel/preset-typescript',
-  ],
-  plugins: [
-    '@babel/plugin-proposal-object-rest-spread',
-    [
-      'babel-plugin-styled-components',
-      {
-        fileName: false,
-        namespace: `core-${version}`,
-      },
+if (process.env.BUNDLING) {
+  module.exports = {
+    ignore: [/(.*)\.(coverage|stories|test|snap)\.?(.*)?/],
+    presets: [
+      ['@babel/preset-env', { modules: false }],
+      '@babel/preset-react',
+      '@babel/preset-typescript',
     ],
-  ],
+    plugins: [
+      '@babel/plugin-proposal-object-rest-spread',
+      [
+        'babel-plugin-styled-components',
+        {
+          displayName: true,
+          fileName: false,
+          minify: true,
+          namespace,
+          pure: true,
+          transpileTemplateLiterals: true,
+        },
+      ],
+    ],
+  }
+} else {
+  module.exports = {
+    presets: [
+      '@babel/preset-env',
+      '@babel/preset-react',
+      '@babel/preset-typescript',
+    ],
+    plugins: ['@babel/plugin-proposal-object-rest-spread'],
+  }
 }

package/dist/@types/files.d.js

@@ -0,0 +1,2 @@
+
+//# sourceMappingURL=files.d.js.map

package/dist/@types/files.d.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"files.d.js","names":[],"sources":["../../src/@types/files.d.ts"],"sourcesContent":["declare module '*.css' {\n  const styles: Record<string, string>\n\n  export = styles\n}\n\ndeclare module '*.scss' {\n  const styles: Record<string, string>\n\n  export = styles\n}\n\ndeclare module '*.png' {\n  const value: any\n\n  export = value\n}\n\ndeclare module '*.svg' {\n  const value: any\n  export default value\n}\n\ndeclare module '*.jpeg' {\n  const value: any\n\n  export = value\n}\n\ndeclare module '*.mp4' {\n  const value: any\n\n  export = value\n}\n\ndeclare module '*.json' {\n  const value: any\n\n  export = value\n}\n"],"mappings":""}

package/dist/@types/global.d.js

@@ -0,0 +1,2 @@
+
+//# sourceMappingURL=global.d.js.map

package/dist/@types/global.d.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"global.d.js","names":[],"sources":["../../src/@types/global.d.ts"],"sourcesContent":["declare module '*.css' {\n  const styles: Record<string, string>\n\n  export = styles\n}\n\ndeclare module '*.scss' {\n  const styles: Record<string, string>\n\n  export = styles\n}\n\ndeclare module '*.png' {\n  const value: any\n\n  export = value\n}\n"],"mappings":""}

package/dist/Avatar/Avatar.js

@@ -1,29 +1,20 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+var _excluded = ["as", "clickable", "disabled", "href", "size", "children", "onBlur", "onFocus", "rel", "role", "target"],
+  _excluded2 = ["icon"],
+  _excluded3 = ["children"],
+  _excluded4 = ["imageUrl"];
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 import { useButton } from '@react-aria/button';
 import React from 'react';
 import { addSubcomponents } from '../_utils/addSubcomponents';
-import { StyledAvatarContainer, StyledAvatarOverlay, StyledIconContainer, StyledLabelContainer, StyledPortraitContainer, } from './Avatar.styles';
+import { StyledAvatarContainer, StyledAvatarOverlay, StyledIconContainer, StyledLabelContainer, StyledPortraitContainer } from './Avatar.styles';
 /**
 
  We use avatars to visually represent our users, places, and things in the app.
@@ -38,76 +29,96 @@ import { StyledAvatarContainer, StyledAvatarOverlay, StyledIconContainer, Styled
  @a11y Avatar's need a `aria-label` and can be enhanced with `role` for interaction. If decorative only, add `aria-hidden`. The inaccessible `clickable` prop is for UI only
 
  */
-function AvatarInner(_a, ref) {
-    var _b, _c;
-    var as = _a.as, clickable = _a.clickable, disabled = _a.disabled, 
-    // @ts-ignore link only
-    href = _a.href, size = _a.size, children = _a.children, onBlur = _a.onBlur, onFocus = _a.onFocus, 
-    // @ts-ignore link only
-    rel = _a.rel, 
-    // @ts-ignore not on legacy
-    role = _a.role, 
-    // @ts-ignore link only
-    target = _a.target, props = __rest(_a, ["as", "clickable", "disabled", "href", "size", "children", "onBlur", "onFocus", "rel", "role", "target"]);
-    var onPress = props.onPress;
-    var buttonProps = useButton(__assign(__assign({}, props), { onBlur: onBlur, onFocus: onFocus, elementType: as === 'a' ? 'a' : 'div', href: href, isDisabled: disabled, onPress: onPress, rel: rel, target: target, type: 'button' }), ref // TODO fix
-    ).buttonProps;
-    var linkDisabled = disabled || (role === 'link' && !href);
-    var a11yProps = role === 'button'
-        ? __assign(__assign({}, buttonProps), { as: as || 'div', $clickable: !disabled }) : role === 'link'
-        ? (_b = {},
-            _b['aria-disabled'] = linkDisabled ? true : undefined,
-            _b.as = as || 'a',
-            _b.$clickable = !linkDisabled,
-            _b.href = linkDisabled ? undefined : href,
-            _b.onBlur = onBlur,
-            _b.onFocus = onFocus,
-            _b.rel = rel,
-            _b.role = 'link',
-            _b.target = target,
-            _b) : role === 'img'
-        ? (_c = {},
-            _c['aria-disabled'] = disabled ? true : undefined,
-            _c.role = 'img',
-            _c.onBlur = onBlur,
-            _c.onFocus = onFocus,
-            _c) : { onBlur: onBlur, onFocus: onFocus };
-    return (React.createElement(StyledAvatarContainer, __assign({ ref: ref, "$clickable": clickable, "$disabled": disabled, "$size": size, "data-qa": "core-avatar" }, a11yProps, props),
-        React.Children.only(children),
-        React.createElement(StyledAvatarOverlay, { "aria-hidden": true })));
+function AvatarInner(_ref, ref) {
+  var _ref3, _ref4;
+  var as = _ref.as,
+    clickable = _ref.clickable,
+    disabled = _ref.disabled,
+    href = _ref.href,
+    size = _ref.size,
+    children = _ref.children,
+    onBlur = _ref.onBlur,
+    onFocus = _ref.onFocus,
+    rel = _ref.rel,
+    role = _ref.role,
+    target = _ref.target,
+    props = _objectWithoutProperties(_ref, _excluded);
+  var _ref2 = props,
+    onPress = _ref2.onPress;
+  var _useButton = useButton(_objectSpread(_objectSpread({}, props), {}, {
+      onBlur: onBlur,
+      onFocus: onFocus,
+      elementType: as === 'a' ? 'a' : 'div',
+      href: href,
+      isDisabled: disabled,
+      onPress: onPress,
+      rel: rel,
+      target: target,
+      type: 'button'
+    }), ref // TODO fix
+    ),
+    buttonProps = _useButton.buttonProps;
+  var linkDisabled = disabled || role === 'link' && !href;
+  var a11yProps = role === 'button' ? _objectSpread(_objectSpread({}, buttonProps), {}, {
+    as: as || 'div',
+    $clickable: !disabled
+  }) : role === 'link' ? (_ref3 = {}, _defineProperty(_ref3, 'aria-disabled', linkDisabled ? true : undefined), _defineProperty(_ref3, "as", as || 'a'), _defineProperty(_ref3, "$clickable", !linkDisabled), _defineProperty(_ref3, "href", linkDisabled ? undefined : href), _defineProperty(_ref3, "onBlur", onBlur), _defineProperty(_ref3, "onFocus", onFocus), _defineProperty(_ref3, "rel", rel), _defineProperty(_ref3, "role", 'link'), _defineProperty(_ref3, "target", target), _ref3) : role === 'img' ? (_ref4 = {}, _defineProperty(_ref4, 'aria-disabled', disabled ? true : undefined), _defineProperty(_ref4, "role", 'img'), _defineProperty(_ref4, "onBlur", onBlur), _defineProperty(_ref4, "onFocus", onFocus), _ref4) : {
+    onBlur: onBlur,
+    onFocus: onFocus
+  };
+  return /*#__PURE__*/React.createElement(StyledAvatarContainer, _extends({
+    ref: ref,
+    $clickable: clickable,
+    $disabled: disabled,
+    $size: size,
+    "data-qa": "core-avatar"
+  }, a11yProps, props), React.Children.only(children), /*#__PURE__*/React.createElement(StyledAvatarOverlay, {
+    "aria-hidden": true
+  }));
 }
-var Avatar_ = React.forwardRef(AvatarInner);
-var NextAvatar_ = React.forwardRef(AvatarInner);
-export var Icon = React.forwardRef(function Icon(_a, ref) {
-    var icon = _a.icon, props = __rest(_a, ["icon"]);
-    return (React.createElement(StyledIconContainer, __assign({ ref: ref }, props), icon));
+var Avatar_ = /*#__PURE__*/React.forwardRef(AvatarInner);
+var NextAvatar_ = /*#__PURE__*/React.forwardRef(AvatarInner);
+export var Icon = /*#__PURE__*/React.forwardRef(function Icon(_ref5, ref) {
+  var icon = _ref5.icon,
+    props = _objectWithoutProperties(_ref5, _excluded2);
+  return /*#__PURE__*/React.createElement(StyledIconContainer, _extends({
+    ref: ref
+  }, props), icon);
 });
-export var Label = React.forwardRef(function Label(_a, ref) {
-    var children = _a.children, props = __rest(_a, ["children"]);
-    // Breaking change: Option to make aria-hidden since parent requires a label.
-    // Can add in major once labelling is enforced
-    return (React.createElement(StyledLabelContainer, __assign({ ref: ref }, props), children));
+export var Label = /*#__PURE__*/React.forwardRef(function Label(_ref6, ref) {
+  var children = _ref6.children,
+    props = _objectWithoutProperties(_ref6, _excluded3);
+  // Breaking change: Option to make aria-hidden since parent requires a label.
+  // Can add in major once labelling is enforced
+  return /*#__PURE__*/React.createElement(StyledLabelContainer, _extends({
+    ref: ref
+  }, props), children);
 });
-export var Portrait = React.forwardRef(function Portrait(_a, ref) {
-    var imageUrl = _a.imageUrl, props = __rest(_a, ["imageUrl"]);
-    return (React.createElement(StyledPortraitContainer, __assign({ ref: ref, "$imageUrl": imageUrl }, props),
-        React.createElement(StyledAvatarOverlay, null)));
+export var Portrait = /*#__PURE__*/React.forwardRef(function Portrait(_ref7, ref) {
+  var imageUrl = _ref7.imageUrl,
+    props = _objectWithoutProperties(_ref7, _excluded4);
+  return /*#__PURE__*/React.createElement(StyledPortraitContainer, _extends({
+    ref: ref,
+    $imageUrl: imageUrl
+  }, props), /*#__PURE__*/React.createElement(StyledAvatarOverlay, null));
 });
+
 // @ts-ignore
 Avatar_.displayName = 'Avatar';
 Icon.displayName = 'Avatar.Icon';
 Label.displayName = 'Avatar.Label';
 Portrait.displayName = 'Avatar.Portrait';
+
 // @ts-ignore
 NextAvatar_.displayName = 'Avatar';
 export var NextAvatar = addSubcomponents({
-    Icon: Icon,
-    Label: Label,
-    Portrait: Portrait,
+  Icon: Icon,
+  Label: Label,
+  Portrait: Portrait
 }, NextAvatar_);
 export var Avatar = addSubcomponents({
-    Icon: Icon,
-    Label: Label,
-    Portrait: Portrait,
+  Icon: Icon,
+  Label: Label,
+  Portrait: Portrait
 }, Avatar_);
 //# sourceMappingURL=Avatar.js.map

package/dist/Avatar/Avatar.js.map

@@ -1 +1 @@
-{"version":3,"file":"Avatar.js","sourceRoot":"","sources":["../../src/Avatar/Avatar.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Avatar.js","names":["useButton","React","addSubcomponents","StyledAvatarContainer","StyledAvatarOverlay","StyledIconContainer","StyledLabelContainer","StyledPortraitContainer","AvatarInner","_ref","ref","_ref3","_ref4","as","clickable","disabled","href","size","children","onBlur","onFocus","rel","role","target","props","_objectWithoutProperties","_excluded","_ref2","onPress","_useButton","_objectSpread","elementType","isDisabled","type","buttonProps","linkDisabled","a11yProps","$clickable","_defineProperty","undefined","createElement","_extends","$disabled","$size","Children","only","Avatar_","forwardRef","NextAvatar_","Icon","_ref5","icon","_excluded2","Label","_ref6","_excluded3","Portrait","_ref7","imageUrl","_excluded4","$imageUrl","displayName","NextAvatar","Avatar"],"sources":["../../src/Avatar/Avatar.tsx"],"sourcesContent":["import { useButton } from '@react-aria/button'\nimport React from 'react'\nimport { addSubcomponents } from '../_utils/addSubcomponents'\nimport { DivAttributes } from '../_utils/types'\nimport {\n  StyledAvatarContainer,\n  StyledAvatarOverlay,\n  StyledIconContainer,\n  StyledLabelContainer,\n  StyledPortraitContainer,\n} from './Avatar.styles'\nimport {\n  AvatarIconProps,\n  AvatarLabelProps,\n  AvatarPortraitProps,\n  AvatarProps,\n  AvatarRef,\n  AvatarRoles,\n  AvatarRoleType,\n  BaseAvatarProps,\n} from './Avatar.types'\n\n/**\n\n We use avatars to visually represent our users, places, and things in the app.\n These can be in the form of rich media or representative illustrations.\n\n @since 10.19.0\n\n @see [Storybook](https://procore.github.io/core/core-react/latest/?path=/story/demos-avatar--demo)\n\n @see [Design Guidelines](https://design.procore.com/avatar)\n\n @a11y Avatar's need a `aria-label` and can be enhanced with `role` for interaction. If decorative only, add `aria-hidden`. The inaccessible `clickable` prop is for UI only\n\n */\nfunction AvatarInner(\n  {\n    as,\n    clickable,\n    disabled,\n    // @ts-ignore link only\n    href,\n    size,\n    children,\n    onBlur,\n    onFocus,\n    // @ts-ignore link only\n    rel,\n    // @ts-ignore not on legacy\n    role,\n    // @ts-ignore link only\n    target,\n    ...props\n  }: AvatarProps<AvatarRoleType>,\n  ref: AvatarRef<AvatarRoleType>\n) {\n  const { onPress } = props as AvatarProps<'button'>\n\n  let { buttonProps } = useButton(\n    {\n      ...props,\n      onBlur: onBlur as (e: React.FocusEvent) => void,\n      onFocus: onFocus as (e: React.FocusEvent) => void,\n      elementType: (as as any as string) === 'a' ? 'a' : 'div',\n      href,\n      isDisabled: disabled,\n      onPress,\n      rel,\n      target,\n      type: 'button',\n    },\n    ref as any // TODO fix\n  )\n\n  const linkDisabled = disabled || (role === 'link' && !href)\n\n  const a11yProps =\n    role === 'button'\n      ? { ...buttonProps, as: as || 'div', $clickable: !disabled }\n      : role === 'link'\n      ? {\n          ['aria-disabled']: linkDisabled ? true : undefined,\n          as: as || 'a',\n          $clickable: !linkDisabled,\n          href: linkDisabled ? undefined : href,\n          onBlur,\n          onFocus,\n          rel,\n          role: 'link',\n          target,\n        }\n      : role === 'img'\n      ? {\n          ['aria-disabled']: disabled ? true : undefined,\n          role: 'img',\n          onBlur,\n          onFocus,\n        }\n      : { onBlur, onFocus }\n\n  return (\n    <StyledAvatarContainer\n      ref={ref as any}\n      $clickable={clickable}\n      $disabled={disabled}\n      $size={size}\n      data-qa=\"core-avatar\"\n      {...a11yProps}\n      {...(props as any)} // TODO fix\n    >\n      {React.Children.only(children)}\n      <StyledAvatarOverlay aria-hidden />\n    </StyledAvatarContainer>\n  )\n}\n\nconst Avatar_ = React.forwardRef(AvatarInner) as <Role extends AvatarRoles>(\n  props:\n    | AvatarProps<Role>\n    // Legacy\n    | (BaseAvatarProps & { ref?: React.ComponentPropsWithRef<'div'>['ref'] })\n) => ReturnType<typeof AvatarInner>\n\nconst NextAvatar_ = React.forwardRef(AvatarInner) as <Role extends AvatarRoles>(\n  props: AvatarProps<Role>\n) => ReturnType<typeof AvatarInner>\n\nexport const Icon = React.forwardRef<\n  HTMLDivElement,\n  DivAttributes & AvatarIconProps\n>(function Icon({ icon, ...props }, ref) {\n  return (\n    <StyledIconContainer ref={ref} {...props}>\n      {icon}\n    </StyledIconContainer>\n  )\n})\n\nexport const Label = React.forwardRef<\n  HTMLDivElement,\n  DivAttributes & AvatarLabelProps\n>(function Label({ children, ...props }, ref) {\n  // Breaking change: Option to make aria-hidden since parent requires a label.\n  // Can add in major once labelling is enforced\n  return (\n    <StyledLabelContainer ref={ref} {...props}>\n      {children}\n    </StyledLabelContainer>\n  )\n})\n\nexport const Portrait = React.forwardRef<\n  HTMLDivElement,\n  DivAttributes & AvatarPortraitProps\n>(function Portrait({ imageUrl, ...props }, ref) {\n  return (\n    <StyledPortraitContainer ref={ref} $imageUrl={imageUrl} {...props}>\n      <StyledAvatarOverlay />\n    </StyledPortraitContainer>\n  )\n})\n\n// @ts-ignore\nAvatar_.displayName = 'Avatar'\n\nIcon.displayName = 'Avatar.Icon'\n\nLabel.displayName = 'Avatar.Label'\n\nPortrait.displayName = 'Avatar.Portrait'\n\n// @ts-ignore\nNextAvatar_.displayName = 'Avatar'\n\nexport const NextAvatar = addSubcomponents(\n  {\n    Icon,\n    Label,\n    Portrait,\n  },\n  NextAvatar_\n)\n\nexport const Avatar = addSubcomponents(\n  {\n    Icon,\n    Label,\n    Portrait,\n  },\n  Avatar_\n)\n"],"mappings":";;;;;;;;;;;;;AAAA,SAASA,SAAS,QAAQ,oBAAoB;AAC9C,OAAOC,KAAK,MAAM,OAAO;AACzB,SAASC,gBAAgB,QAAQ,4BAA4B;AAE7D,SACEC,qBAAqB,EACrBC,mBAAmB,EACnBC,mBAAmB,EACnBC,oBAAoB,EACpBC,uBAAuB,QAClB,iBAAiB;AAYxB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAASC,WAAWA,CAAAC,IAAA,EAmBlBC,GAA8B,EAC9B;EAAA,IAAAC,KAAA,EAAAC,KAAA;EAAA,IAlBEC,EAAE,GAAAJ,IAAA,CAAFI,EAAE;IACFC,SAAS,GAAAL,IAAA,CAATK,SAAS;IACTC,QAAQ,GAAAN,IAAA,CAARM,QAAQ;IAERC,IAAI,GAAAP,IAAA,CAAJO,IAAI;IACJC,IAAI,GAAAR,IAAA,CAAJQ,IAAI;IACJC,QAAQ,GAAAT,IAAA,CAARS,QAAQ;IACRC,MAAM,GAAAV,IAAA,CAANU,MAAM;IACNC,OAAO,GAAAX,IAAA,CAAPW,OAAO;IAEPC,GAAG,GAAAZ,IAAA,CAAHY,GAAG;IAEHC,IAAI,GAAAb,IAAA,CAAJa,IAAI;IAEJC,MAAM,GAAAd,IAAA,CAANc,MAAM;IACHC,KAAK,GAAAC,wBAAA,CAAAhB,IAAA,EAAAiB,SAAA;EAIV,IAAAC,KAAA,GAAoBH,KAAK;IAAjBI,OAAO,GAAAD,KAAA,CAAPC,OAAO;EAEf,IAAAC,UAAA,GAAsB7B,SAAS,CAAA8B,aAAA,CAAAA,aAAA,KAExBN,KAAK;MACRL,MAAM,EAAEA,MAAuC;MAC/CC,OAAO,EAAEA,OAAwC;MACjDW,WAAW,EAAGlB,EAAE,KAAuB,GAAG,GAAG,GAAG,GAAG,KAAK;MACxDG,IAAI,EAAJA,IAAI;MACJgB,UAAU,EAAEjB,QAAQ;MACpBa,OAAO,EAAPA,OAAO;MACPP,GAAG,EAAHA,GAAG;MACHE,MAAM,EAANA,MAAM;MACNU,IAAI,EAAE;IAAQ,IAEhBvB,GAAG,CAAQ;IACb,CAAC;IAdKwB,WAAW,GAAAL,UAAA,CAAXK,WAAW;EAgBjB,IAAMC,YAAY,GAAGpB,QAAQ,IAAKO,IAAI,KAAK,MAAM,IAAI,CAACN,IAAK;EAE3D,IAAMoB,SAAS,GACbd,IAAI,KAAK,QAAQ,GAAAQ,aAAA,CAAAA,aAAA,KACRI,WAAW;IAAErB,EAAE,EAAEA,EAAE,IAAI,KAAK;IAAEwB,UAAU,EAAE,CAACtB;EAAQ,KACxDO,IAAI,KAAK,MAAM,IAAAX,KAAA,OAAA2B,eAAA,CAAA3B,KAAA,EAEZ,eAAe,EAAGwB,YAAY,GAAG,IAAI,GAAGI,SAAS,GAAAD,eAAA,CAAA3B,KAAA,QAC9CE,EAAE,IAAI,GAAG,GAAAyB,eAAA,CAAA3B,KAAA,gBACD,CAACwB,YAAY,GAAAG,eAAA,CAAA3B,KAAA,UACnBwB,YAAY,GAAGI,SAAS,GAAGvB,IAAI,GAAAsB,eAAA,CAAA3B,KAAA,YACrCQ,MAAM,GAAAmB,eAAA,CAAA3B,KAAA,aACNS,OAAO,GAAAkB,eAAA,CAAA3B,KAAA,SACPU,GAAG,GAAAiB,eAAA,CAAA3B,KAAA,UACG,MAAM,GAAA2B,eAAA,CAAA3B,KAAA,YACZY,MAAM,GAAAZ,KAAA,IAERW,IAAI,KAAK,KAAK,IAAAV,KAAA,OAAA0B,eAAA,CAAA1B,KAAA,EAEX,eAAe,EAAGG,QAAQ,GAAG,IAAI,GAAGwB,SAAS,GAAAD,eAAA,CAAA1B,KAAA,UACxC,KAAK,GAAA0B,eAAA,CAAA1B,KAAA,YACXO,MAAM,GAAAmB,eAAA,CAAA1B,KAAA,aACNQ,OAAO,GAAAR,KAAA,IAET;IAAEO,MAAM,EAANA,MAAM;IAAEC,OAAO,EAAPA;EAAQ,CAAC;EAEzB,oBACEnB,KAAA,CAAAuC,aAAA,CAACrC,qBAAqB,EAAAsC,QAAA;IACpB/B,GAAG,EAAEA,GAAW;IAChB2B,UAAU,EAAEvB,SAAU;IACtB4B,SAAS,EAAE3B,QAAS;IACpB4B,KAAK,EAAE1B,IAAK;IACZ,WAAQ;EAAa,GACjBmB,SAAS,EACRZ,KAAK,GAETvB,KAAK,CAAC2C,QAAQ,CAACC,IAAI,CAAC3B,QAAQ,CAAC,eAC9BjB,KAAA,CAAAuC,aAAA,CAACpC,mBAAmB;IAAC;EAAW,CAAE,CACb,CAAC;AAE5B;AAEA,IAAM0C,OAAO,gBAAG7C,KAAK,CAAC8C,UAAU,CAACvC,WAAW,CAKT;AAEnC,IAAMwC,WAAW,gBAAG/C,KAAK,CAAC8C,UAAU,CAACvC,WAAW,CAEb;AAEnC,OAAO,IAAMyC,IAAI,gBAAGhD,KAAK,CAAC8C,UAAU,CAGlC,SAASE,IAAIA,CAAAC,KAAA,EAAqBxC,GAAG,EAAE;EAAA,IAAvByC,IAAI,GAAAD,KAAA,CAAJC,IAAI;IAAK3B,KAAK,GAAAC,wBAAA,CAAAyB,KAAA,EAAAE,UAAA;EAC9B,oBACEnD,KAAA,CAAAuC,aAAA,CAACnC,mBAAmB,EAAAoC,QAAA;IAAC/B,GAAG,EAAEA;EAAI,GAAKc,KAAK,GACrC2B,IACkB,CAAC;AAE1B,CAAC,CAAC;AAEF,OAAO,IAAME,KAAK,gBAAGpD,KAAK,CAAC8C,UAAU,CAGnC,SAASM,KAAKA,CAAAC,KAAA,EAAyB5C,GAAG,EAAE;EAAA,IAA3BQ,QAAQ,GAAAoC,KAAA,CAARpC,QAAQ;IAAKM,KAAK,GAAAC,wBAAA,CAAA6B,KAAA,EAAAC,UAAA;EACnC;EACA;EACA,oBACEtD,KAAA,CAAAuC,aAAA,CAAClC,oBAAoB,EAAAmC,QAAA;IAAC/B,GAAG,EAAEA;EAAI,GAAKc,KAAK,GACtCN,QACmB,CAAC;AAE3B,CAAC,CAAC;AAEF,OAAO,IAAMsC,QAAQ,gBAAGvD,KAAK,CAAC8C,UAAU,CAGtC,SAASS,QAAQA,CAAAC,KAAA,EAAyB/C,GAAG,EAAE;EAAA,IAA3BgD,QAAQ,GAAAD,KAAA,CAARC,QAAQ;IAAKlC,KAAK,GAAAC,wBAAA,CAAAgC,KAAA,EAAAE,UAAA;EACtC,oBACE1D,KAAA,CAAAuC,aAAA,CAACjC,uBAAuB,EAAAkC,QAAA;IAAC/B,GAAG,EAAEA,GAAI;IAACkD,SAAS,EAAEF;EAAS,GAAKlC,KAAK,gBAC/DvB,KAAA,CAAAuC,aAAA,CAACpC,mBAAmB,MAAE,CACC,CAAC;AAE9B,CAAC,CAAC;;AAEF;AACA0C,OAAO,CAACe,WAAW,GAAG,QAAQ;AAE9BZ,IAAI,CAACY,WAAW,GAAG,aAAa;AAEhCR,KAAK,CAACQ,WAAW,GAAG,cAAc;AAElCL,QAAQ,CAACK,WAAW,GAAG,iBAAiB;;AAExC;AACAb,WAAW,CAACa,WAAW,GAAG,QAAQ;AAElC,OAAO,IAAMC,UAAU,GAAG5D,gBAAgB,CACxC;EACE+C,IAAI,EAAJA,IAAI;EACJI,KAAK,EAALA,KAAK;EACLG,QAAQ,EAARA;AACF,CAAC,EACDR,WACF,CAAC;AAED,OAAO,IAAMe,MAAM,GAAG7D,gBAAgB,CACpC;EACE+C,IAAI,EAAJA,IAAI;EACJI,KAAK,EAALA,KAAK;EACLG,QAAQ,EAARA;AACF,CAAC,EACDV,OACF,CAAC"}

package/dist/Avatar/Avatar.styles.js

@@ -1,36 +1,64 @@
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
 import styled, { css } from 'styled-components';
 import { colors } from '../_styles/colors';
 import { getGapOutlineFocus } from '../_styles/mixins';
 var activeOverlayOpacity = 0.3;
-var containerSize = { xl: 96, lg: 40, md: 32 };
-var fontSize = { xl: 40, lg: 14, md: 14 };
-var fontWeights = { xl: 700, lg: 600, md: 600 };
-var iconSize = { xl: 48, lg: 24, md: 16 };
-export var StyledAvatarOverlay = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  width: 100%;\n  height: 100%;\n  position: absolute;\n  top: 0;\n  left: 0;\n  border-radius: 100%;\n  opacity: 0;\n"], ["\n  width: 100%;\n  height: 100%;\n  position: absolute;\n  top: 0;\n  left: 0;\n  border-radius: 100%;\n  opacity: 0;\n"])));
-export var StyledIconContainer = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  display: inline-flex;\n"], ["\n  display: inline-flex;\n"])));
-export var StyledLabelContainer = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  text-transform: uppercase;\n"], ["\n  text-transform: uppercase;\n"])));
-export var StyledPortraitContainer = styled.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  background-color: ", ";\n  background-position: center;\n  background-repeat: no-repeat;\n  background-size: cover;\n  height: 100%;\n  width: 100%;\n  ", "\n"], ["\n  background-color: ", ";\n  background-position: center;\n  background-repeat: no-repeat;\n  background-size: cover;\n  height: 100%;\n  width: 100%;\n  ", "\n"])), colors.white, function (_a) {
-    var $imageUrl = _a.$imageUrl;
-    return css(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n      background-image: url(", ");\n    "], ["\n      background-image: url(", ");\n    "])), $imageUrl);
+var containerSize = {
+  xl: 96,
+  lg: 40,
+  md: 32
+};
+var fontSize = {
+  xl: 40,
+  lg: 14,
+  md: 14
+};
+var fontWeights = {
+  xl: 700,
+  lg: 600,
+  md: 600
+};
+var iconSize = {
+  xl: 48,
+  lg: 24,
+  md: 16
+};
+export var StyledAvatarOverlay = /*#__PURE__*/styled.div.withConfig({
+  displayName: "StyledAvatarOverlay",
+  componentId: "core-11_23_0__sc-7q2ydl-0"
+})(["width:100%;height:100%;position:absolute;top:0;left:0;border-radius:100%;opacity:0;"]);
+export var StyledIconContainer = /*#__PURE__*/styled.div.withConfig({
+  displayName: "StyledIconContainer",
+  componentId: "core-11_23_0__sc-7q2ydl-1"
+})(["display:inline-flex;"]);
+export var StyledLabelContainer = /*#__PURE__*/styled.div.withConfig({
+  displayName: "StyledLabelContainer",
+  componentId: "core-11_23_0__sc-7q2ydl-2"
+})(["text-transform:uppercase;"]);
+export var StyledPortraitContainer = /*#__PURE__*/styled.div.withConfig({
+  displayName: "StyledPortraitContainer",
+  componentId: "core-11_23_0__sc-7q2ydl-3"
+})(["background-color:", ";background-position:center;background-repeat:no-repeat;background-size:cover;height:100%;width:100%;", ""], colors.white, function (_ref) {
+  var $imageUrl = _ref.$imageUrl;
+  return css(["background-image:url(", ");"], $imageUrl);
 });
-export var StyledAvatarContainer = styled.div(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n  display: inline-flex;\n  justify-content: center;\n  align-items: center;\n  border-radius: 100%;\n  overflow: hidden;\n  position: relative;\n  cursor: default;\n  color: ", ";\n  background-color: ", ";\n  text-decoration: none;\n\n  a:has(> &) {\n    text-decoration: none;\n  }\n\n  &:focus {\n    ", "\n  }\n  // For safety, separate rule block with 'has' for supported browsers\n  // this supports any anchor directly wrapping an Avatar.\n  // 'outline' works better on display inline-block and inline-flex,\n  // elements, unfortunately anchors and inline by default.\n  a:focus:has(> &) {\n    ", "\n    border-radius: 100%;\n  }\n\n  ", "\n\n  ", ";\n"], ["\n  display: inline-flex;\n  justify-content: center;\n  align-items: center;\n  border-radius: 100%;\n  overflow: hidden;\n  position: relative;\n  cursor: default;\n  color: ", ";\n  background-color: ", ";\n  text-decoration: none;\n\n  a:has(> &) {\n    text-decoration: none;\n  }\n\n  &:focus {\n    ", "\n  }\n  // For safety, separate rule block with 'has' for supported browsers\n  // this supports any anchor directly wrapping an Avatar.\n  // 'outline' works better on display inline-block and inline-flex,\n  // elements, unfortunately anchors and inline by default.\n  a:focus:has(> &) {\n    ", "\n    border-radius: 100%;\n  }\n\n  ", "\n\n  ", ";\n"])), colors.white, colors.gray30, getGapOutlineFocus, getGapOutlineFocus, function (_a) {
-    var _b = _a.$size, $size = _b === void 0 ? 'md' : _b;
-    return css(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n    font-size: ", "px;\n    font-weight: ", ";\n    height: ", "px;\n    width: ", "px;\n    min-height: ", "px;\n    min-width: ", "px;\n\n    ", " {\n      svg {\n        height: ", "px;\n        width: ", "px;\n      }\n    }\n  "], ["\n    font-size: ", "px;\n    font-weight: ", ";\n    height: ", "px;\n    width: ", "px;\n    min-height: ", "px;\n    min-width: ", "px;\n\n    ", " {\n      svg {\n        height: ", "px;\n        width: ", "px;\n      }\n    }\n  "])), fontSize[$size], fontWeights[$size], containerSize[$size], containerSize[$size], containerSize[$size], containerSize[$size], StyledIconContainer, iconSize[$size], iconSize[$size]);
-}, function (_a) {
-    var $disabled = _a.$disabled, $clickable = _a.$clickable;
-    if (!$disabled && $clickable) {
-        return css(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n        cursor: pointer;\n\n        &:hover {\n          ", " {\n            opacity: ", ";\n          }\n        }\n\n        ", " {\n          background-color: ", ";\n        }\n      "], ["\n        cursor: pointer;\n\n        &:hover {\n          ", " {\n            opacity: ", ";\n          }\n        }\n\n        ", " {\n          background-color: ", ";\n        }\n      "])), StyledAvatarOverlay, activeOverlayOpacity, StyledAvatarOverlay, colors.black);
-    }
-    if ($disabled && !$clickable) {
-        return css(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n        background-color: ", ";\n\n        ", " {\n          background-color: ", ";\n          opacity: ", ";\n        }\n      "], ["\n        background-color: ", ";\n\n        ", " {\n          background-color: ", ";\n          opacity: ", ";\n        }\n      "])), colors.gray85, StyledAvatarOverlay, colors.white, activeOverlayOpacity);
-    }
-    if ($disabled && $clickable) {
-        return css(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n        cursor: pointer;\n        background-color: ", ";\n\n        &:hover {\n          ", " {\n            background-color: ", ";\n            opacity: ", ";\n          }\n        }\n\n        ", " {\n          background-color: ", ";\n          opacity: ", ";\n        }\n      "], ["\n        cursor: pointer;\n        background-color: ", ";\n\n        &:hover {\n          ", " {\n            background-color: ", ";\n            opacity: ", ";\n          }\n        }\n\n        ", " {\n          background-color: ", ";\n          opacity: ", ";\n        }\n      "])), colors.gray85, StyledAvatarOverlay, colors.black, activeOverlayOpacity, StyledAvatarOverlay, colors.white, activeOverlayOpacity);
-    }
+export var StyledAvatarContainer = /*#__PURE__*/styled.div.withConfig({
+  displayName: "StyledAvatarContainer",
+  componentId: "core-11_23_0__sc-7q2ydl-4"
+})(["display:inline-flex;justify-content:center;align-items:center;border-radius:100%;overflow:hidden;position:relative;cursor:default;color:", ";background-color:", ";text-decoration:none;a:has(> &){text-decoration:none;}&:focus{", "}a:focus:has(> &){", " border-radius:100%;}", " ", ";"], colors.white, colors.gray30, getGapOutlineFocus, getGapOutlineFocus, function (_ref2) {
+  var _ref2$$size = _ref2.$size,
+    $size = _ref2$$size === void 0 ? 'md' : _ref2$$size;
+  return css(["font-size:", "px;font-weight:", ";height:", "px;width:", "px;min-height:", "px;min-width:", "px;", "{svg{height:", "px;width:", "px;}}"], fontSize[$size], fontWeights[$size], containerSize[$size], containerSize[$size], containerSize[$size], containerSize[$size], StyledIconContainer, iconSize[$size], iconSize[$size]);
+}, function (_ref3) {
+  var $disabled = _ref3.$disabled,
+    $clickable = _ref3.$clickable;
+  if (!$disabled && $clickable) {
+    return css(["cursor:pointer;&:hover{", "{opacity:", ";}}", "{background-color:", ";}"], StyledAvatarOverlay, activeOverlayOpacity, StyledAvatarOverlay, colors.black);
+  }
+  if ($disabled && !$clickable) {
+    return css(["background-color:", ";", "{background-color:", ";opacity:", ";}"], colors.gray85, StyledAvatarOverlay, colors.white, activeOverlayOpacity);
+  }
+  if ($disabled && $clickable) {
+    return css(["cursor:pointer;background-color:", ";&:hover{", "{background-color:", ";opacity:", ";}}", "{background-color:", ";opacity:", ";}"], colors.gray85, StyledAvatarOverlay, colors.black, activeOverlayOpacity, StyledAvatarOverlay, colors.white, activeOverlayOpacity);
+  }
 });
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10;
 //# sourceMappingURL=Avatar.styles.js.map

package/dist/Avatar/Avatar.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Avatar.styles.js","sourceRoot":"","sources":["../../src/Avatar/Avatar.styles.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"Avatar.styles.js","names":["styled","css","colors","getGapOutlineFocus","activeOverlayOpacity","containerSize","xl","lg","md","fontSize","fontWeights","iconSize","StyledAvatarOverlay","div","withConfig","displayName","componentId","StyledIconContainer","StyledLabelContainer","StyledPortraitContainer","white","_ref","$imageUrl","StyledAvatarContainer","gray30","_ref2","_ref2$$size","$size","_ref3","$disabled","$clickable","black","gray85"],"sources":["../../src/Avatar/Avatar.styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport { colors } from '../_styles/colors'\nimport { getGapOutlineFocus } from '../_styles/mixins'\nimport { BaseAvatarProps } from './Avatar.types'\n\ninterface StyledAvatarProps {\n  $clickable: BaseAvatarProps['clickable']\n  $disabled: BaseAvatarProps['disabled']\n  $size: BaseAvatarProps['size']\n}\n\nconst activeOverlayOpacity = 0.3\n\nconst containerSize = { xl: 96, lg: 40, md: 32 } as const\n\nconst fontSize = { xl: 40, lg: 14, md: 14 } as const\n\nconst fontWeights = { xl: 700, lg: 600, md: 600 } as const\n\nconst iconSize = { xl: 48, lg: 24, md: 16 } as const\n\nexport const StyledAvatarOverlay = styled.div`\n  width: 100%;\n  height: 100%;\n  position: absolute;\n  top: 0;\n  left: 0;\n  border-radius: 100%;\n  opacity: 0;\n`\n\nexport const StyledIconContainer = styled.div`\n  display: inline-flex;\n`\n\nexport const StyledLabelContainer = styled.div`\n  text-transform: uppercase;\n`\n\nexport const StyledPortraitContainer = styled.div<{ $imageUrl: string }>`\n  background-color: ${colors.white};\n  background-position: center;\n  background-repeat: no-repeat;\n  background-size: cover;\n  height: 100%;\n  width: 100%;\n  ${({ $imageUrl }) =>\n    css`\n      background-image: url(${$imageUrl});\n    `}\n`\n\nexport const StyledAvatarContainer = styled.div<StyledAvatarProps>`\n  display: inline-flex;\n  justify-content: center;\n  align-items: center;\n  border-radius: 100%;\n  overflow: hidden;\n  position: relative;\n  cursor: default;\n  color: ${colors.white};\n  background-color: ${colors.gray30};\n  text-decoration: none;\n\n  a:has(> &) {\n    text-decoration: none;\n  }\n\n  &:focus {\n    ${getGapOutlineFocus}\n  }\n  // For safety, separate rule block with 'has' for supported browsers\n  // this supports any anchor directly wrapping an Avatar.\n  // 'outline' works better on display inline-block and inline-flex,\n  // elements, unfortunately anchors and inline by default.\n  a:focus:has(> &) {\n    ${getGapOutlineFocus}\n    border-radius: 100%;\n  }\n\n  ${({ $size = 'md' }) => css`\n    font-size: ${fontSize[$size]}px;\n    font-weight: ${fontWeights[$size]};\n    height: ${containerSize[$size]}px;\n    width: ${containerSize[$size]}px;\n    min-height: ${containerSize[$size]}px;\n    min-width: ${containerSize[$size]}px;\n\n    ${StyledIconContainer} {\n      svg {\n        height: ${iconSize[$size]}px;\n        width: ${iconSize[$size]}px;\n      }\n    }\n  `}\n\n  ${({ $disabled, $clickable }) => {\n    if (!$disabled && $clickable) {\n      return css`\n        cursor: pointer;\n\n        &:hover {\n          ${StyledAvatarOverlay} {\n            opacity: ${activeOverlayOpacity};\n          }\n        }\n\n        ${StyledAvatarOverlay} {\n          background-color: ${colors.black};\n        }\n      `\n    }\n\n    if ($disabled && !$clickable) {\n      return css`\n        background-color: ${colors.gray85};\n\n        ${StyledAvatarOverlay} {\n          background-color: ${colors.white};\n          opacity: ${activeOverlayOpacity};\n        }\n      `\n    }\n\n    if ($disabled && $clickable) {\n      return css`\n        cursor: pointer;\n        background-color: ${colors.gray85};\n\n        &:hover {\n          ${StyledAvatarOverlay} {\n            background-color: ${colors.black};\n            opacity: ${activeOverlayOpacity};\n          }\n        }\n\n        ${StyledAvatarOverlay} {\n          background-color: ${colors.white};\n          opacity: ${activeOverlayOpacity};\n        }\n      `\n    }\n  }};\n`\n"],"mappings":"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"}

package/dist/Avatar/Avatar.types.js.map

@@ -1 +1 @@
-{"version":3,"file":"Avatar.types.js","sourceRoot":"","sources":["../../src/Avatar/Avatar.types.ts"],"names":[],"mappings":""}
+{"version":3,"file":"Avatar.types.js","names":[],"sources":["../../src/Avatar/Avatar.types.ts"],"sourcesContent":["import { AriaButtonProps } from '@react-aria/button'\nimport React from 'react'\nimport { Polymorphic } from '../_utils/polymorphic'\nimport { AriaLabelled, Props, Size } from '../_utils/types'\n\nexport type AvatarSize = Extract<Size, 'md' | 'lg' | 'xl'>\n\nexport type AvatarRoleType = 'link' | 'button' | 'img'\n\nexport interface AvatarPolyMap\n  extends Record<AvatarRoleType, React.ElementType> {\n  button: 'div'\n  img: 'div'\n  link: 'a'\n}\n\n// Add undefined for aria-hidden\nexport type AvatarRoles = AvatarRoleType | undefined\n\nexport type AvatarRef<Role extends AvatarRoles = undefined> =\n  Role extends AvatarRoleType\n    ? Polymorphic.Ref<AvatarPolyMap, Role>\n    : React.ComponentPropsWithRef<'div'>['ref']\n\nexport interface BaseAvatarProps extends Props {\n  /**\n   * Sets the Avatar's clickable UI state. For accessibility, see `role`\n   * @ally This prop is around UI and has 0 UX or JS for interaction, try `role` instead.\n   * @defaultValue false\n   * @deprecated Reviewing for removal from system, prefer accessible `role` for interactive UI.\n   * @deprecatedSince TBD\n   * @since 10.19.0\n   */\n  clickable?: boolean\n  /**\n   * Sets the Avatar's disabled state\n   *\n   * @defaultValue false\n   */\n  disabled?: boolean\n  /**\n   * Sets the Avatar's size\n   *\n   * @defaultValue md\n   *\n   * @deprecated\n   *\n   * Size \"xl\" has been deprecated and will be removed in a future version.\n   * Please use \"lg\" instead of \"xl\".\n   *\n   * **Before**\n   *\n   * `<Avatar size=\"xl\" />`\n   *\n   * **After**\n   *\n   * `<Avatar size=\"lg\" />`\n   *\n   * @deprecatedSince 10.20.0\n   * @since 10.19.0\n   */\n  size?: AvatarSize\n}\n\ntype DecorativeAvatarProps<Role extends AvatarRoles = undefined> = {\n  'aria-hidden': true\n  role?: Role\n} & BaseAvatarProps\n\nexport type AvatarProps<Role extends AvatarRoles = undefined> =\n  Role extends 'link'\n    ? Polymorphic.ComponentPropsWithRef<\n        AvatarPolyMap,\n        'link',\n        'href',\n        AriaLabelled<BaseAvatarProps>\n      >\n    : Role extends 'button'\n    ? Polymorphic.ComponentPropsWithRef<\n        AvatarPolyMap,\n        'button',\n        never,\n        AriaLabelled<{ onPress: AriaButtonProps['onPress'] } & BaseAvatarProps>\n      >\n    : Role extends 'img'\n    ? Polymorphic.ComponentPropsWithRef<\n        AvatarPolyMap,\n        'img',\n        never,\n        AriaLabelled<BaseAvatarProps>\n      >\n    : DecorativeAvatarProps & { ref?: AvatarRef<undefined> }\n\nexport interface AvatarIconProps extends Props {\n  /**\n   * The icon to display\n   *\n   * @since 10.19.0\n   */\n  icon: React.ReactNode\n}\n\nexport interface AvatarPortraitProps extends Props {\n  /**\n   * The Avatar rich media url\n   * @since 10.19.0\n   */\n  imageUrl: string\n}\n\nexport interface AvatarLabelProps extends Props {}\n"],"mappings":""}

package/dist/Avatar/index.js

@@ -1,2 +1,3 @@
 export { Avatar } from './Avatar';
+export { AvatarIconProps, AvatarPortraitProps, AvatarProps } from './Avatar.types';
 //# sourceMappingURL=index.js.map

package/dist/Avatar/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/Avatar/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAA"}
+{"version":3,"file":"index.js","names":["Avatar","AvatarIconProps","AvatarPortraitProps","AvatarProps"],"sources":["../../src/Avatar/index.ts"],"sourcesContent":["export { Avatar } from './Avatar'\nexport {\n  AvatarIconProps,\n  AvatarPortraitProps,\n  AvatarProps,\n} from './Avatar.types'\n"],"mappings":"AAAA,SAASA,MAAM,QAAQ,UAAU;AACjC,SACEC,eAAe,EACfC,mBAAmB,EACnBC,WAAW,QACN,gBAAgB"}

package/dist/AvatarStack/AvatarStack.constants.js.map

@@ -1 +1 @@
-{"version":3,"file":"AvatarStack.constants.js","sourceRoot":"","sources":["../../src/AvatarStack/AvatarStack.constants.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,IAAM,eAAe,GAAG,CAAC,CAAA;AAEhC,MAAM,CAAC,IAAM,cAAc,GAAG,CAAC,CAAA;AAE/B,MAAM,CAAC,IAAM,kBAAkB,GAAG,EAAE,CAAA;AAEpC,MAAM,CAAC,IAAM,WAAW,GAAY,CAAC,QAAQ,EAAE,UAAU,EAAE,UAAU,EAAE,QAAQ,CAAC,CAAA"}
+{"version":3,"file":"AvatarStack.constants.js","names":["visibleItemsCap","foldedItemsCap","restCountThreshold","colorsOrder"],"sources":["../../src/AvatarStack/AvatarStack.constants.ts"],"sourcesContent":["import { Color } from '../_styles/colors'\n\nexport const visibleItemsCap = 5\n\nexport const foldedItemsCap = 4\n\nexport const restCountThreshold = 99\n\nexport const colorsOrder: Color[] = ['blue40', 'purple40', 'orange40', 'gray40']\n"],"mappings":"AAEA,OAAO,IAAMA,eAAe,GAAG,CAAC;AAEhC,OAAO,IAAMC,cAAc,GAAG,CAAC;AAE/B,OAAO,IAAMC,kBAAkB,GAAG,EAAE;AAEpC,OAAO,IAAMC,WAAoB,GAAG,CAAC,QAAQ,EAAE,UAAU,EAAE,UAAU,EAAE,QAAQ,CAAC"}