@popmenu/common-ui 0.19.4 → 0.21.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,3 +1,3 @@
1
1
  import React from 'react';
2
2
  import { AvatarProps } from './AvatarProps';
3
- export declare const Avatar: React.ForwardRefExoticComponent<Pick<AvatarProps, "className" | "style" | "classes" | "innerRef" | "slot" | "title" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "background" | "fit" | "silhouette" | "size" | "alt" | "imgProps" | "sizes" | "src" | "srcSet" | "variant"> & React.RefAttributes<HTMLDivElement>>;
3
+ export declare const Avatar: React.ForwardRefExoticComponent<Pick<AvatarProps, "className" | "style" | "classes" | "innerRef" | "slot" | "title" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "fallback" | "background" | "fit" | "size" | "alt" | "imgProps" | "sizes" | "src" | "srcSet" | "variant"> & React.RefAttributes<HTMLDivElement>>;
@@ -1,15 +1,22 @@
1
1
  import { AvatarProps as MuiAvatarProps } from '@material-ui/core/Avatar';
2
+ import { ReactNode } from 'react';
2
3
  import { LoadingStatus } from './util/useImageProps';
4
+ export declare const AvatarDefaultProps: {
5
+ size: string;
6
+ fit: string;
7
+ background: string;
8
+ };
3
9
  export interface AvatarProps extends MuiAvatarProps {
4
10
  /** Sets the background-color for an Avatar. Automatically adjusts text color for readable contrast. Accepts color codes only, no CSS colors. */
5
11
  background?: string;
6
12
  /** Sets the css object-fit property for the Avatar img. */
7
13
  fit?: 'cover' | 'contain';
8
- /** Sets the silhouette for an Avatar. Silhouette will only be displayed when no `src` or `children` are provided */
9
- silhouette?: 'male' | 'female' | 'neutral' | 'none';
10
14
  /** Sets the size for an Avatar. */
11
15
  size?: 'extra-small' | 'small' | 'medium' | 'large' | 'extra-large';
16
+ /** Disables the default fallback when set to 'none'. A component can be given to set a new fallback. */
17
+ fallback?: 'none' | ReactNode;
12
18
  }
13
- export interface AvatarStyleProps extends AvatarProps {
19
+ export declare type PracticalAvatarProps = AvatarProps & typeof AvatarDefaultProps;
20
+ export declare type StyledAvatarProps = PracticalAvatarProps & {
14
21
  loaded: LoadingStatus;
15
- }
22
+ };
@@ -1,2 +1,2 @@
1
- import { AvatarStyleProps } from './AvatarProps';
2
- export declare const useAvatarStyles: (props: AvatarStyleProps) => import("@material-ui/styles").ClassNameMap<string>;
1
+ import { StyledAvatarProps } from './AvatarProps';
2
+ export declare const useAvatarStyles: (props: StyledAvatarProps) => import("@material-ui/styles").ClassNameMap<string>;
@@ -4,11 +4,6 @@ export declare enum LoadingStatus {
4
4
  LOADED = "LOADED",
5
5
  PENDING = "PENDING"
6
6
  }
7
- /**
8
- * Hook returns [imgProps, loaded]
9
- * ref: Merged default and provided imgProp object. Includes load and error events for img tag. To be passed to MuiAvatar.
10
- * loaded: Indicates whether the src supplied to an img within Avatar results in loaded or error
11
- */
12
7
  export declare const useImgProps: (avatarProps: AvatarProps) => {
13
8
  imgProps: AvatarProps['imgProps'];
14
9
  loaded: LoadingStatus;
@@ -1,5 +1,6 @@
1
1
  import { ButtonProps as MuiButtonProps } from '@material-ui/core/Button';
2
2
  export interface ButtonProps extends MuiButtonProps {
3
+ /** Sets loading state for Button. */
3
4
  loading?: boolean;
4
5
  /** Sets the text transformation property of a button. */
5
6
  textTransform?: 'uppercase' | 'lowercase' | 'capitalize' | 'none';
@@ -1,12 +1,13 @@
1
- export interface CollapsibleTextProps {
1
+ import { BoxProps } from '../Box';
2
+ export interface CollapsibleTextProps extends Pick<BoxProps, 'onClick'> {
3
+ /** The content of the CollapsibleText component. */
2
4
  text: string;
5
+ /** Expands and collapses the component. */
3
6
  open: boolean;
7
+ /** The number of lines visible in the collapsed state. */
4
8
  previewLines?: number;
9
+ /** The variant of the typography. */
5
10
  typographyVariant?: 'body1' | 'body2';
6
- collapsible: boolean;
7
- setCollapsible: (collapsible: boolean) => void;
8
- }
9
- export interface DefaultCollapsibleTextProps extends CollapsibleTextProps {
10
- previewLines: number;
11
- typographyVariant: 'body1' | 'body2';
11
+ /** A React state tuple. */
12
+ collapseState?: [boolean, (collapsible: boolean) => void];
12
13
  }
@@ -1,4 +1,5 @@
1
- import { DefaultCollapsibleTextProps } from './CollapsibleTextProps';
2
- export declare const useCollapsibleTextStyles: (props: DefaultCollapsibleTextProps & {
1
+ import { CollapsibleTextProps } from './CollapsibleTextProps';
2
+ export declare const useCollapsibleTextStyles: (props: CollapsibleTextProps & {
3
3
  fadeStop?: string | number | undefined;
4
+ typographyVariant: 'body1' | 'body2';
4
5
  }) => import("@material-ui/styles").ClassNameMap<string>;
@@ -3,11 +3,11 @@ declare type Colors = 'primary.main' | 'primary.dark' | 'primary.light' | 'secon
3
3
  export interface DividerProps {
4
4
  /** Sets the styles for a divider. */
5
5
  className?: string;
6
- /** Sets the color of the divider line. */
6
+ /** Sets the color of the divider line. Accepts thematic color names and color codes. */
7
7
  dividerColor?: Colors | string;
8
8
  /** A message shown in the center of the divider */
9
9
  text?: string;
10
- /** Sets the color of the divider text */
10
+ /** Sets the color of the divider text. Accepts thematic color names and color codes. */
11
11
  textColor?: Colors | string;
12
12
  /** Sets the casing of the text */
13
13
  textTransform?: 'uppercase' | 'lowercase' | 'capitalize';
@@ -1,3 +1,3 @@
1
1
  import React from 'react';
2
- import { LinkProps } from './LinkProps';
3
- export declare const Link: React.ForwardRefExoticComponent<Pick<LinkProps, "className" | "style" | "classes" | "innerRef" | "slot" | "title" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "noWrap" | "gutterBottom" | "paragraph" | "align" | "display" | "variant" | "variantMapping" | "download" | "href" | "hrefLang" | "media" | "ping" | "rel" | "target" | "type" | "referrerPolicy" | "TypographyClasses" | "underline"> & React.RefAttributes<HTMLAnchorElement>>;
2
+ import { LinkProps } from '@material-ui/core';
3
+ export declare const Link: React.ForwardRefExoticComponent<Pick<LinkProps<"a", {}>, "className" | "style" | "classes" | "innerRef" | "slot" | "title" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "noWrap" | "gutterBottom" | "paragraph" | "align" | "display" | "variant" | "variantMapping" | "download" | "href" | "hrefLang" | "media" | "ping" | "rel" | "target" | "type" | "referrerPolicy" | "TypographyClasses" | "underline"> & React.RefAttributes<HTMLAnchorElement>>;
@@ -0,0 +1,2 @@
1
+ import { LinkProps } from '@material-ui/core';
2
+ export declare const useLinkStyles: (props: LinkProps<"a", {}>) => import("@material-ui/styles").ClassNameMap<string>;
@@ -1,2 +1,2 @@
1
1
  export { Link as default } from './Link';
2
- export { LinkProps } from './LinkProps';
2
+ export { LinkProps } from '@material-ui/core';
@@ -1,8 +1,7 @@
1
1
  interface CollapsibleTextHookResult {
2
2
  collapsibleText: {
3
3
  open: boolean;
4
- collapsible: boolean;
5
- setCollapsible: (collapsible: boolean) => void;
4
+ collapseState: [boolean, (collapsible: boolean) => void];
6
5
  };
7
6
  toggle: () => void;
8
7
  }
package/build/index.es.js CHANGED
@@ -1,9 +1,9 @@
1
1
  export { default as Alert } from '@material-ui/lab/Alert';
2
- import { makeStyles, Paper as Paper$1, useTheme, Box, Popper, Grow, Slider } from '@material-ui/core';
2
+ import { makeStyles, Paper as Paper$1, useTheme, Box, Popper, Grow, Slider, Link as Link$1 } from '@material-ui/core';
3
3
  export { Accordion, AccordionActions, AccordionDetails, AccordionSummary, Box, Breadcrumbs, ButtonBase, ClickAwayListener, Fab, GridList, Hidden, Modal, Popover, Popper, Step, StepButton, StepConnector, StepContent, StepIcon, StepLabel, Stepper, ThemeProvider, Toolbar, alpha, createTheme, darken, decomposeColor, getLuminance, hexToRgb, lighten, makeStyles, recomposeColor, rgbToHex } from '@material-ui/core';
4
4
  export { default as AppBar } from '@material-ui/core/AppBar';
5
5
  import * as React from 'react';
6
- import React__default, { createElement, forwardRef, useRef, useState, useReducer, useEffect, useMemo, Fragment } from 'react';
6
+ import React__default, { createElement, forwardRef, useRef, useState, useReducer, useEffect, useMemo } from 'react';
7
7
  import MuiIconButton from '@material-ui/core/IconButton';
8
8
  import MuiTypography from '@material-ui/core/Typography';
9
9
  import { makeStyles as makeStyles$1, useTheme as useTheme$1 } from '@material-ui/core/styles';
@@ -34,7 +34,6 @@ export { default as FormControl } from '@material-ui/core/FormControl';
34
34
  export { default as Grid } from '@material-ui/core/Grid';
35
35
  export { default as InputAdornment } from '@material-ui/core/InputAdornment';
36
36
  export { default as LinearProgress } from '@material-ui/core/LinearProgress';
37
- import MuiLink from '@material-ui/core/Link';
38
37
  export { default as List } from '@material-ui/core/List';
39
38
  export { default as ListItem } from '@material-ui/core/ListItem';
40
39
  export { default as ListItemIcon } from '@material-ui/core/ListItemIcon';
@@ -91,6 +90,24 @@ function __rest(s, e) {
91
90
  return t;
92
91
  }
93
92
 
93
+ var _path$3k;
94
+
95
+ function _extends$3B() { _extends$3B = Object.assign || 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$3B.apply(this, arguments); }
96
+
97
+ function SvgUser(props) {
98
+ return /*#__PURE__*/React.createElement("svg", _extends$3B({
99
+ viewBox: "0 0 16 16",
100
+ strokeLinecap: "round",
101
+ strokeLinejoin: "round",
102
+ stroke: "currentColor",
103
+ width: "1em",
104
+ height: "1em",
105
+ fill: "none"
106
+ }, props), _path$3k || (_path$3k = /*#__PURE__*/React.createElement("path", {
107
+ d: "M13.333 14v-1.333A2.667 2.667 0 0010.667 10H5.333a2.667 2.667 0 00-2.666 2.667V14M8 7.333A2.667 2.667 0 108 2a2.667 2.667 0 000 5.333z"
108
+ })));
109
+ }
110
+
94
111
  var _path$1f;
95
112
 
96
113
  function _extends$1p() { _extends$1p = Object.assign || 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$1p.apply(this, arguments); }
@@ -608,18 +625,9 @@ var LoadingStatus;
608
625
  LoadingStatus["LOADED"] = "LOADED";
609
626
  LoadingStatus["PENDING"] = "PENDING";
610
627
  })(LoadingStatus || (LoadingStatus = {}));
611
- /**
612
- * Hook returns [imgProps, loaded]
613
- * ref: Merged default and provided imgProp object. Includes load and error events for img tag. To be passed to MuiAvatar.
614
- * loaded: Indicates whether the src supplied to an img within Avatar results in loaded or error
615
- */
616
628
  var useImgProps = function (avatarProps) {
617
629
  var _a = React__default.useState(LoadingStatus.PENDING), loaded = _a[0], setLoaded = _a[1];
618
- var imgProps = __assign(__assign({}, avatarProps.imgProps), { onError: function (event) {
619
- var _a, _b;
620
- setLoaded(LoadingStatus.ERROR);
621
- (_b = (_a = avatarProps.imgProps) === null || _a === void 0 ? void 0 : _a.onError) === null || _b === void 0 ? void 0 : _b.call(_a, event);
622
- }, onLoad: function (event) {
630
+ var imgProps = __assign(__assign({}, avatarProps.imgProps), { onLoad: function (event) {
623
631
  var _a, _b;
624
632
  setLoaded(LoadingStatus.LOADED);
625
633
  (_b = (_a = avatarProps.imgProps) === null || _a === void 0 ? void 0 : _a.onLoad) === null || _b === void 0 ? void 0 : _b.call(_a, event);
@@ -646,97 +654,49 @@ var getAvatarFontSize = function (props) {
646
654
  large: '1.25rem',
647
655
  'extra-large': '3.5rem',
648
656
  };
649
- return fontSizes[props.size || 'medium'];
650
- };
651
- var getAvatarBackground = function (props) {
652
- var src = props.src, loaded = props.loaded;
653
- var background = props.background;
654
- if (src && loaded === LoadingStatus.LOADED) {
655
- background = 'transparent';
656
- }
657
- return background;
657
+ return fontSizes[props.size];
658
658
  };
659
659
  var useAvatarStyles = makeStyles$1(function (theme) { return ({
660
- root: {
661
- width: function (props) { return getAvatarDimensions(theme, props); },
662
- height: function (props) { return getAvatarDimensions(theme, props); },
663
- fontSize: function (props) { return getAvatarFontSize(props); },
664
- backgroundColor: function (props) { return getAvatarBackground(props); },
665
- color: function (props) { return theme.palette.getContrastText(props.background || '#E0E0E0'); },
666
- objectFit: function (props) { return props.fit; },
667
- },
668
- silhouette: {
669
- '& path': {
670
- fill: function (props) { return theme.palette.getContrastText(props.background || '#E0E0E0'); },
671
- },
672
- },
660
+ root: function (props) { return ({
661
+ width: getAvatarDimensions(theme, props),
662
+ height: getAvatarDimensions(theme, props),
663
+ fontSize: getAvatarFontSize(props),
664
+ backgroundColor: props.loaded === LoadingStatus.LOADED ? 'transparent' : props.background,
665
+ color: theme.palette.getContrastText(props.background),
666
+ objectFit: props.fit,
667
+ }); },
668
+ fallback: function (props) { return ({
669
+ fontSize: getAvatarDimensions(theme, props),
670
+ strokeWidth: 1,
671
+ }); },
673
672
  }); });
674
673
 
675
- var _path$2;
676
-
677
- function _extends$2() { _extends$2 = Object.assign || 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$2.apply(this, arguments); }
678
-
679
- function SvgSilhouetteFemale(props) {
680
- return /*#__PURE__*/React.createElement("svg", _extends$2({
681
- viewBox: "0 0 300 300",
682
- fill: "none",
683
- xmlns: "http://www.w3.org/2000/svg"
684
- }, props), _path$2 || (_path$2 = /*#__PURE__*/React.createElement("path", {
685
- d: "M179.417 182.917a3.362 3.362 0 00-2.951 1.076 3.461 3.461 0 00-.875 3.021c1.916 10.069 8.368 23.889 28.173 32.493 2.347 1.014 5.972 1.805 10.57 2.799 17.208 3.722 45.986 9.958 53.055 36.333a3.488 3.488 0 001.622 2.11 3.491 3.491 0 002.639.345 3.488 3.488 0 002.109-1.622 3.473 3.473 0 00.345-2.639c-8.173-30.465-40.777-37.527-58.298-41.319-4.056-.882-7.563-1.639-9.278-2.389-11.903-5.167-19.59-12.833-22.924-22.819 33.07 2.458 48.042-10.716 48.702-11.313a3.469 3.469 0 001.121-2.951 3.478 3.478 0 00-1.732-2.639c-19.084-10.903-19.084-48.577-19.084-62.764 0-39.674-26.722-71.125-60.979-71.618-.326-.011-.652-.018-.979-.021h-.007c-34.757.194-63.035 31.68-63.035 70.194 0 14.188 0 51.868-19.083 62.764a3.5 3.5 0 00-1.73 2.769 3.494 3.494 0 001.313 2.988c.959.743 22.14 16.952 48.202 12.028-3.486 9.569-11.07 16.931-22.625 21.951-1.674.73-5.007 1.528-8.868 2.445-17.64 4.194-50.48 12.007-58.702 42.687a3.481 3.481 0 00.348 2.638 3.475 3.475 0 006.368-.839c7.145-26.694 36.229-33.604 53.597-37.743 4.354-1.035 7.791-1.854 10.028-2.82 19.805-8.604 26.25-22.423 28.173-32.493a3.45 3.45 0 00-1.104-3.243 3.457 3.457 0 00-3.347-.722c-18.799 5.917-36.167-2.222-43.757-6.736 18.132-15.181 18.132-50.118 18.132-65.674 0-34.7 25.18-63.076 56.389-63.263l.736.041c30.778.438 53.986 28.236 53.986 64.667 0 15.562 0 50.576 18.208 65.757-6.271 3.583-20.569 9.382-44.458 6.521z",
686
- fill: "#2E3042"
687
- })));
688
- }
689
-
690
- var _path$1;
691
-
692
- function _extends$1() { _extends$1 = Object.assign || 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$1.apply(this, arguments); }
693
-
694
- function SvgSilhouetteMale(props) {
695
- return /*#__PURE__*/React.createElement("svg", _extends$1({
696
- viewBox: "0 0 300 300",
697
- fill: "none",
698
- xmlns: "http://www.w3.org/2000/svg"
699
- }, props), _path$1 || (_path$1 = /*#__PURE__*/React.createElement("path", {
700
- d: "M27.594 261.886a3.513 3.513 0 004.281-2.478c7.204-26.904 36.484-33.877 53.984-38.05 4.386-1.043 7.848-1.869 10.1-2.842 19.935-8.66 26.433-22.592 28.377-32.757a3.493 3.493 0 00-.133-1.81 3.492 3.492 0 00-1.021-1.501c-10.38-8.968-19.137-22.431-24.663-37.917a3.447 3.447 0 00-.72-1.197c-7.31-7.953-11.506-16.361-11.506-23.06 0-3.914 1.475-6.539 4.798-8.52a3.5 3.5 0 001.7-2.857c1.545-35.662 26.922-63.735 58.047-63.917l.749.049c31.279.434 56.495 29.11 57.397 65.275a3.487 3.487 0 001.245 2.584c2.189 1.855 3.211 4.207 3.211 7.4 0 5.607-2.987 12.503-8.401 19.406a3.633 3.633 0 00-.587 1.106c-5.596 17.754-15.64 33.429-27.545 43.02a3.517 3.517 0 00-1.245 3.381c1.945 10.159 8.442 24.083 28.377 32.757 2.357 1.022 6.015 1.821 10.653 2.822 17.325 3.752 46.318 10.046 53.431 36.628a3.503 3.503 0 002.926 2.562 3.494 3.494 0 003.922-3.019 3.52 3.52 0 00-.091-1.363c-8.219-30.713-41.065-37.833-58.705-41.655-4.092-.889-7.625-1.652-9.345-2.408-13.01-5.657-21.026-14.275-23.859-25.658 12.08-10.383 22.187-26.401 27.965-44.365 6.134-7.981 9.505-16.2 9.505-23.221 0-4.684-1.511-8.59-4.504-11.643-1.665-39.232-29.636-70.127-64.35-70.624L150.545 38c-34.085.182-62.175 30.264-64.63 68.818-4.379 3.22-6.603 7.736-6.603 13.47 0 8.282 4.68 18.188 12.87 27.275 5.659 15.563 14.43 29.235 24.873 38.805-2.819 11.426-10.842 20.072-23.88 25.735-1.685.735-5.043 1.541-8.932 2.465-17.773 4.228-50.843 12.104-59.125 43.034a3.501 3.501 0 002.476 4.284z",
701
- fill: "#2E3042"
702
- })));
703
- }
704
-
705
- var _path;
706
-
707
- function _extends() { _extends = Object.assign || 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); }
708
-
709
- function SvgSilhouetteNeutral(props) {
710
- return /*#__PURE__*/React.createElement("svg", _extends({
711
- viewBox: "0 0 300 300",
712
- fill: "none",
713
- xmlns: "http://www.w3.org/2000/svg"
714
- }, props), _path || (_path = /*#__PURE__*/React.createElement("path", {
715
- fillRule: "evenodd",
716
- clipRule: "evenodd",
717
- d: "M209 121c0 32.585-26.415 59-59 59s-59-26.415-59-59 26.415-59 59-59 59 26.415 59 59zm8 0c0 37.003-29.997 67-67 67s-67-29.997-67-67 29.997-67 67-67 67 29.997 67 67zm35 137.333V284h8v-25.667c0-13.614-5.821-26.671-16.182-36.298C233.456 212.408 219.403 207 204.75 207H94.25c-14.653 0-28.706 5.408-39.068 15.035C44.821 231.662 39 244.719 39 258.333V284h8v-25.667c0-11.295 4.824-22.257 13.628-30.437C69.45 219.698 81.537 215 94.25 215h110.5c12.714 0 24.799 4.698 33.622 12.896 8.804 8.18 13.628 19.142 13.628 30.437z",
718
- fill: "#2E3042"
719
- })));
720
- }
721
-
722
- var silhouettes = {
723
- female: SvgSilhouetteFemale,
724
- male: SvgSilhouetteMale,
725
- neutral: SvgSilhouetteNeutral,
726
- };
727
674
  var Avatar = forwardRef(function (props, ref) {
728
- var children = props.children, _a = props.silhouette, silhouette = _a === void 0 ? 'neutral' : _a, muiProps = __rest(props, ["children", "silhouette"]);
729
- var _b = useImgProps(props), imgProps = _b.imgProps, loaded = _b.loaded;
675
+ var children = props.children, src = props.src, alt = props.alt, fallback = props.fallback, muiProps = __rest(props, ["children", "src", "alt", "fallback"]);
676
+ var _a = useImgProps(props), imgProps = _a.imgProps, loaded = _a.loaded;
730
677
  var classes = useAvatarStyles(__assign(__assign({}, props), { loaded: loaded }));
731
- var Silhouette = silhouettes[silhouette];
732
- var fallback = muiProps.src || silhouette === 'none' ? '' : React__default.createElement(Silhouette, { className: classes.silhouette });
733
- return (React__default.createElement(MuiAvatar, __assign({ ref: ref, classes: { root: classes.root } }, muiProps, imgProps), children || fallback));
678
+ var displayAltTextFallback = src && alt;
679
+ var displayNoFallback = fallback === 'none';
680
+ var displayCustomFallback = fallback !== 'none' && typeof fallback !== 'undefined';
681
+ var Fallback;
682
+ if (displayAltTextFallback) {
683
+ Fallback = null;
684
+ }
685
+ else if (displayNoFallback) {
686
+ Fallback = ' ';
687
+ }
688
+ else if (displayCustomFallback) {
689
+ Fallback = fallback;
690
+ }
691
+ else {
692
+ Fallback = React__default.createElement(Icon, { icon: SvgUser, className: classes.fallback });
693
+ }
694
+ return (React__default.createElement(MuiAvatar, __assign({ ref: ref, classes: { root: classes.root }, src: src, alt: alt }, muiProps, { imgProps: imgProps }), children || Fallback));
734
695
  });
735
696
  Avatar.defaultProps = {
736
697
  size: 'medium',
737
698
  fit: 'cover',
738
699
  background: '#E0E0E0',
739
- silhouette: 'neutral',
740
700
  };
741
701
  Avatar.displayName = 'Avatar';
742
702
 
@@ -790,33 +750,35 @@ var useCollapsibleTextStyles = makeStyles(function (theme) { return ({
790
750
  }); });
791
751
 
792
752
  var CollapsibleText = function (props) {
793
- var _a = props, text = _a.text, open = _a.open, previewLines = _a.previewLines, _b = _a.typographyVariant, typographyVariant = _b === void 0 ? 'body1' : _b, collapsible = _a.collapsible, setCollapsible = _a.setCollapsible;
794
- var classes = useCollapsibleTextStyles(props);
753
+ var text = props.text, open = props.open, _a = props.previewLines, previewLines = _a === void 0 ? 2 : _a, _b = props.typographyVariant, typographyVariant = _b === void 0 ? 'body1' : _b; props.collapseState; var restProps = __rest(props, ["text", "open", "previewLines", "typographyVariant", "collapseState"]);
754
+ var collapseState = useState(false);
795
755
  var typographyRef = useRef(null);
796
- var typography = useTheme().typography;
797
- var collapsedSize = previewLines * parseFloat(typography[typographyVariant].lineHeight);
756
+ var classes = useCollapsibleTextStyles(__assign(__assign({}, props), { previewLines: previewLines, typographyVariant: typographyVariant }));
757
+ var theme = useTheme();
758
+ var _c = props.collapseState ? props.collapseState : collapseState, collapsible = _c[0], setCollapsible = _c[1];
759
+ var typographyEntryLineHeightRem = parseFloat(theme.typography[typographyVariant].lineHeight);
760
+ var collapsedSizeRem = previewLines * typographyEntryLineHeightRem;
761
+ var documentFontSize = parseFloat(getComputedStyle(document.documentElement).fontSize);
762
+ var collapsedSizePx = collapsedSizeRem * documentFontSize;
798
763
  useEffect(function () {
799
764
  var typographyNode = typographyRef.current;
800
765
  var observer = new ResizeObserver(function (entries) {
801
- var typographyHeight = entries[0].contentRect.height;
802
- var collapsedPxSize = collapsedSize * 16;
803
- var collapsible = typographyHeight > collapsedPxSize;
804
- setCollapsible(collapsible);
766
+ var typographyEntry = entries.find(function (entry) { return entry.target === typographyNode; });
767
+ if (typographyEntry) {
768
+ var typographyEntryHeight = typographyEntry.contentRect.height;
769
+ var isCollapsible = typographyEntryHeight > collapsedSizePx;
770
+ setCollapsible(isCollapsible);
771
+ }
805
772
  });
806
773
  observer.observe(typographyNode);
807
774
  return function () {
808
775
  observer.unobserve(typographyNode);
809
776
  };
810
777
  }, []);
811
- return (React__default.createElement(Fragment, null,
812
- React__default.createElement(Box, { position: "relative", overflow: "hidden" },
813
- React__default.createElement(Collapse, { in: open, collapsedSize: collapsedSize + 'rem' },
814
- React__default.createElement(Typography, { ref: typographyRef, variant: typographyVariant }, text)),
815
- collapsible && !open && React__default.createElement(Box, { className: classes.overlay }))));
816
- };
817
- CollapsibleText.defaultProps = {
818
- previewLines: 2,
819
- typographyVariant: 'body1',
778
+ return (React__default.createElement(Box, __assign({ position: "relative", overflow: "hidden" }, restProps),
779
+ React__default.createElement(Collapse, { in: open, collapsedSize: collapsedSizePx + 'px' },
780
+ React__default.createElement(Typography, { ref: typographyRef, variant: typographyVariant }, text)),
781
+ collapsible && !open && React__default.createElement(Box, { className: classes.overlay })));
820
782
  };
821
783
 
822
784
  var SemanticColors;
@@ -879,42 +841,21 @@ Divider.defaultProps = {
879
841
  textTransform: 'lowercase',
880
842
  };
881
843
 
882
- var getLinkColor = function (_a, _b) {
883
- var palette = _a.palette;
884
- var _c = _b.color, color = _c === void 0 ? 'info' : _c;
885
- var resolved;
886
- if (['primary', 'secondary', 'info', 'error'].includes(color)) {
887
- resolved = palette[color].main;
888
- }
889
- else if (['textPrimary', 'textSecondary'].includes(color)) {
890
- resolved = palette.text[color.substring(4).toLowerCase()];
891
- }
892
- else if (color === 'inherit') {
893
- resolved = color;
894
- }
895
- return resolved;
896
- };
897
- var useLinkStyles = makeStyles$1(function (theme) {
898
- var _a;
899
- return ({
900
- root: (_a = {
901
- display: 'flex',
902
- color: function (props) { return getLinkColor(theme, props); }
903
- },
904
- _a["& ." + iconStaticClassName] = {
905
- alignSelf: 'center',
906
- },
907
- _a),
908
- });
909
- });
844
+ var useLinkStyles = makeStyles$1(function (theme) { return ({
845
+ root: function (props) {
846
+ var _a;
847
+ return (__assign(__assign({ display: 'flex' }, (props.color === undefined && { color: theme.palette.info.main })), (_a = {}, _a["& ." + iconStaticClassName] = {
848
+ alignSelf: 'center',
849
+ }, _a)));
850
+ },
851
+ }); });
910
852
 
911
853
  var Link = forwardRef(function (props, ref) {
912
- var children = props.children; props.color; var muiProps = __rest(props, ["children", "color"]);
854
+ var children = props.children, muiProps = __rest(props, ["children"]);
913
855
  var classes = useLinkStyles(props);
914
- return (React__default.createElement(MuiLink, __assign({ ref: ref, classes: { root: classes.root } }, muiProps), children));
856
+ return (React__default.createElement(Link$1, __assign({ ref: ref, classes: { root: classes.root } }, muiProps), children));
915
857
  });
916
858
  Link.defaultProps = {
917
- color: 'info',
918
859
  variant: 'body1',
919
860
  };
920
861
  Link.displayName = 'Link';
@@ -1056,13 +997,12 @@ Tooltip.displayName = 'Tooltip';
1056
997
 
1057
998
  var useCollapsibleText = function () {
1058
999
  var _a = useState(false), open = _a[0], setOpen = _a[1];
1059
- var _b = useState(false), collapsible = _b[0], setCollapsible = _b[1];
1060
- var toggle = function () { return collapsible && setOpen(!open); };
1000
+ var collapseState = useState(false);
1001
+ var toggle = function () { return collapseState[0] && setOpen(!open); };
1061
1002
  return {
1062
1003
  collapsibleText: {
1063
1004
  open: open,
1064
- collapsible: collapsible,
1065
- setCollapsible: setCollapsible,
1005
+ collapseState: collapseState,
1066
1006
  },
1067
1007
  toggle: toggle,
1068
1008
  };