@uniformdev/design-system 17.1.0 → 17.1.1-alpha.231

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.
package/dist/index.d.ts CHANGED
@@ -10,7 +10,6 @@ import { StateManagerProps } from 'react-select/dist/declarations/src/useStateMa
10
10
  import InternalSelect from 'react-select/dist/declarations/src/Select';
11
11
  import { MenuHTMLProps, MenuProps as MenuProps$1, MenuStateReturn } from 'reakit/Menu';
12
12
  import { MenuItemHTMLProps, MenuProps as MenuProps$2 } from 'reakit';
13
- import * as url from 'url';
14
13
 
15
14
  /** @todo: line 144 onwards will be brought into a title, paragraph, list and link components */
16
15
  declare type ThemeProps = {
@@ -78,6 +77,7 @@ declare const fadeIn: _emotion_react.Keyframes;
78
77
  declare const ripple: _emotion_react.Keyframes;
79
78
  declare const skeletonLoading: _emotion_react.Keyframes;
80
79
  declare const fadeInLtr: _emotion_react.Keyframes;
80
+ declare const fadeInRtl: _emotion_react.Keyframes;
81
81
 
82
82
  declare type UniformLogoProps = {
83
83
  /** sets a light or dark theme for the uniform badge or logo component
@@ -170,7 +170,7 @@ declare function IconsProvider({ children }: {
170
170
  children: ReactNode;
171
171
  }): _emotion_react_types_jsx_namespace.EmotionJSX.Element;
172
172
 
173
- declare type CaptionProps = {
173
+ declare type CaptionProps = React$1.HTMLAttributes<HTMLElement> & {
174
174
  /** allows users to add child elements */
175
175
  children: React$1.ReactNode;
176
176
  /** sets data-test-id attribute for test automation*/
@@ -180,7 +180,7 @@ declare type CaptionProps = {
180
180
  * Component that provides caption text to input fields
181
181
  * @example <Caption>some help text here</Caption>
182
182
  */
183
- declare const Caption: ({ children, testId }: CaptionProps) => _emotion_react_types_jsx_namespace.EmotionJSX.Element;
183
+ declare const Caption: ({ children, testId, ...props }: CaptionProps) => _emotion_react_types_jsx_namespace.EmotionJSX.Element;
184
184
 
185
185
  declare type ErrorMessageProps = {
186
186
  /** sets the error message value */
@@ -246,7 +246,7 @@ declare type ComboBoxGroupBase<TOption> = GroupBase<TOption>;
246
246
  /**
247
247
  * InputComboBox
248
248
  * @component
249
- * @example <InputComboBox name="name" id="combo-box" options=[{ value: 'chocolate', label: 'Chocolate' }, { value: 'strawberry', label: 'Strawberry' }, { value: 'vanilla', label: 'Vanilla' }] /> */
249
+ * @example <InputComboBox name="name" id="combo-box" options={[{ value: 'chocolate', label: 'Chocolate' }, { value: 'strawberry', label: 'Strawberry' }, { value: 'vanilla', label: 'Vanilla' }]} isMulti /> */
250
250
  declare function InputComboBox<TOption = InputComboBoxOption, IsMulti extends boolean = false, TGroup extends ComboBoxGroupBase<TOption> = ComboBoxGroupBase<TOption>>(props: InputComboBoxProps<TOption, IsMulti, TGroup>): _emotion_react_types_jsx_namespace.EmotionJSX.Element;
251
251
 
252
252
  declare type InputInlineSelectOption = {
@@ -453,7 +453,7 @@ interface CalloutProps {
453
453
  /** (optional) sets the title of the callout */
454
454
  title?: React$1.ReactNode;
455
455
  /** add child elements to the callout */
456
- children: React$1.ReactNode;
456
+ children?: React$1.ReactNode;
457
457
  /** sets additional css classes or emotion styles on the callout */
458
458
  className?: SerializedStyles | string;
459
459
  }
@@ -526,20 +526,6 @@ declare type ParagraphProps = {
526
526
  */
527
527
  declare const Paragraph: ({ className, htmlContent, children, ...pAttributes }: ParagraphProps) => _emotion_react_types_jsx_namespace.EmotionJSX.Element;
528
528
 
529
- interface RouteProps {
530
- as: string;
531
- href: string;
532
- }
533
- declare type PageHeaderSectionProps = React$1.HTMLAttributes<HTMLElement> & {
534
- title: string | undefined;
535
- desc?: React$1.ReactNode;
536
- children?: React$1.ReactNode;
537
- linkProps?: RouteProps;
538
- linkText?: string;
539
- level?: LevelProps;
540
- };
541
- declare const PageHeaderSection: ({ title, desc, children, linkText, level, linkProps, ...htmlProps }: PageHeaderSectionProps) => _emotion_react_types_jsx_namespace.EmotionJSX.Element;
542
-
543
529
  declare type LinkColorProps = 'currentColor' | 'red' | 'green';
544
530
  declare type LinkProps = React$1.AnchorHTMLAttributes<HTMLAnchorElement> & {
545
531
  /** sets the link text and title text */
@@ -559,25 +545,16 @@ declare type LinkProps = React$1.AnchorHTMLAttributes<HTMLAnchorElement> & {
559
545
  * @example <Link text="my link" href="#" />
560
546
  */
561
547
  declare const Link: ({ external, text, linkColor, children, ...props }: LinkProps) => _emotion_react_types_jsx_namespace.EmotionJSX.Element;
548
+ declare type LinkManagerWithRefType = (props: Partial<LinkProps> & {
549
+ as?: string;
550
+ href: string;
551
+ passHref: true;
552
+ } & React$1.RefAttributes<HTMLAnchorElement>) => JSX.Element | null;
562
553
  /** Uniform LinkWithRef Component
563
554
  * We recommend using this link `next/link`
564
- * @example <NextLink {...someProps} passHref><LinkWithRef text="my link" /></NextLink>
555
+ * @example <LinkWithRef linkManagerComponent={NextLink} href="some-url" text="my link" />
565
556
  */
566
- declare const LinkWithRef: React$1.ForwardRefExoticComponent<Pick<{
567
- href: string | url.UrlObject;
568
- as?: (string | url.UrlObject) | undefined;
569
- replace?: boolean | undefined;
570
- soft?: boolean | undefined;
571
- scroll?: boolean | undefined;
572
- shallow?: boolean | undefined;
573
- passHref?: boolean | undefined;
574
- prefetch?: boolean | undefined;
575
- locale?: string | false | undefined;
576
- legacyBehavior?: boolean | undefined;
577
- onMouseEnter?: ((e: any) => void) | undefined;
578
- onTouchStart?: ((e: any) => void) | undefined;
579
- onClick?: ((e: any) => void) | undefined;
580
- } & React$1.AnchorHTMLAttributes<HTMLAnchorElement> & {
557
+ declare const LinkWithRef: React$1.ForwardRefExoticComponent<Pick<React$1.AnchorHTMLAttributes<HTMLAnchorElement> & {
581
558
  /** sets the link text and title text */
582
559
  text: string;
583
560
  /** (optional) sets the link color
@@ -590,7 +567,26 @@ declare const LinkWithRef: React$1.ForwardRefExoticComponent<Pick<{
590
567
  ref?: React$1.ForwardedRef<HTMLAnchorElement> | undefined;
591
568
  /** (optional) sets react child elements */
592
569
  children?: React$1.ReactNode;
593
- }, "slot" | "style" | "title" | "text" | "className" | "as" | "href" | "hrefLang" | "media" | "referrerPolicy" | "rel" | "type" | "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" | "replace" | "target" | "external" | "scroll" | "soft" | "shallow" | "passHref" | "prefetch" | "locale" | "legacyBehavior" | "download" | "ping" | "linkColor"> & React$1.RefAttributes<HTMLAnchorElement>>;
570
+ } & {
571
+ href: string;
572
+ as?: string | undefined;
573
+ linkManagerComponent: LinkManagerWithRefType;
574
+ }, "text" | "as" | "external" | "linkColor" | "linkManagerComponent" | keyof React$1.AnchorHTMLAttributes<HTMLAnchorElement>> & React$1.RefAttributes<HTMLAnchorElement>>;
575
+
576
+ interface RouteProps {
577
+ as: string;
578
+ href: string;
579
+ }
580
+ declare type PageHeaderSectionProps = React$1.HTMLAttributes<HTMLElement> & {
581
+ title: string | undefined;
582
+ desc?: React$1.ReactNode;
583
+ children?: React$1.ReactNode;
584
+ linkProps?: RouteProps;
585
+ linkText?: string;
586
+ level?: LevelProps;
587
+ linkManagerComponent: LinkManagerWithRefType;
588
+ };
589
+ declare const PageHeaderSection: ({ title, desc, children, linkText, level, linkProps, linkManagerComponent, ...htmlProps }: PageHeaderSectionProps) => _emotion_react_types_jsx_namespace.EmotionJSX.Element;
594
590
 
595
591
  declare type IntegrationHeaderSectionProps = React$1.HtmlHTMLAttributes<HTMLDivElement> & {
596
592
  /** sets the title text of the integration */
@@ -1048,4 +1044,4 @@ declare type LinkListProps = React$1.HTMLAttributes<HTMLDivElement> & {
1048
1044
  };
1049
1045
  declare const LinkList: ({ title, children, ...props }: LinkListProps) => _emotion_react_types_jsx_namespace.EmotionJSX.Element;
1050
1046
 
1051
- export { ActionButtonsProps, AddButton, AddButtonProps, AddListButton, AddListButtonProps, ArrowPositionProps, Badge, BadgeProps, BoxHeightProps, Button, ButtonProps, ButtonSizeProps, ButtonThemeProps$1 as ButtonThemeProps, ButtonWithMenu, ButtonWithMenuProps, Callout, CalloutProps, CalloutType, Caption, CaptionProps, Card, CardContainer, CardContainerBgColorProps, CardContainerProps, CardProps, ChildFunction, ComboBoxGroupBase, CreateTeamIntegrationTile, CreateTeamIntegrationTileProps, DashedBox, DashedBoxProps, EditTeamIntegrationTile, EditTeamIntegrationTileProps, ErrorMessage, ErrorMessageProps, Heading, HeadingProps, HexModalBackground, Icon, IconColor, IconName, IconProps, IconType, IconsProvider, InlineAlert, InlineAlertProps, Input, InputComboBox, InputComboBoxOption, InputComboBoxProps, InputInlineSelect, InputInlineSelectOption, InputInlineSelectProps, InputKeywordSearch, InputKeywordSearchProps, InputProps, InputSelect, InputSelectProps, InputToggle, InputToggleProps, IntegrationComingSoon, IntegrationComingSoonProps, IntegrationHeaderSection, IntegrationHeaderSectionProps, IntegrationLoadingTile, IntegrationLoadingTileProps, IntegrationModalHeader, IntegrationModalHeaderProps, IntegrationModalIcon, IntegrationModalIconProps, IntegrationTile, IntegrationTileProps, Label, LabelProps, LevelProps, LimitsBar, LimitsBarProps, Link, LinkColorProps, LinkList, LinkListProps, LinkProps, LinkWithRef, LoadingIcon, LoadingIconProps, LoadingIndicator, LoadingOverlay, LoadingOverlayProps, Menu, MenuContext, MenuItem, MenuItemProps, MenuItemTextThemeProps, MenuProps, PageHeaderSection, PageHeaderSectionProps, Paragraph, ParagraphProps, ResolveIcon, ResolveIconProps, ScrollableList, ScrollableListItem, ScrollableListItemProps, ScrollableListProps, ShortcutContext, ShortcutRevealer, Switch, SwitchProps, Table, TableBody, TableBodyProps, TableCellData, TableCellDataProps, TableCellHead, TableCellHeadProps, TableFoot, TableFootProps, TableHead, TableHeadProps, TableProps, TableRow, TableRowProps, TextAlignProps, Textarea, TextareaProps, Theme, ThemeProps, TileContainer, TileContainerProps, UniformBadge, UniformLogo, UniformLogoProps, breakpointSizeProps, breakpoints, breakpointsProps, button, buttonGhost, buttonPrimary, buttonRippleEffect, buttonSecondary, buttonTertiary, buttonUnimportant, fadeIn, fadeInBottom, fadeInLtr, fadeOutBottom, growSubtle, input, inputError, inputSelect, labelText, mq, ripple, scrollbarStyles, skeletonLoading, supports, useIconContext, useMenuContext };
1047
+ export { ActionButtonsProps, AddButton, AddButtonProps, AddListButton, AddListButtonProps, ArrowPositionProps, Badge, BadgeProps, BoxHeightProps, Button, ButtonProps, ButtonSizeProps, ButtonThemeProps$1 as ButtonThemeProps, ButtonWithMenu, ButtonWithMenuProps, Callout, CalloutProps, CalloutType, Caption, CaptionProps, Card, CardContainer, CardContainerBgColorProps, CardContainerProps, CardProps, ChildFunction, ComboBoxGroupBase, CreateTeamIntegrationTile, CreateTeamIntegrationTileProps, DashedBox, DashedBoxProps, EditTeamIntegrationTile, EditTeamIntegrationTileProps, ErrorMessage, ErrorMessageProps, Heading, HeadingProps, HexModalBackground, Icon, IconColor, IconName, IconProps, IconType, IconsProvider, InlineAlert, InlineAlertProps, Input, InputComboBox, InputComboBoxOption, InputComboBoxProps, InputInlineSelect, InputInlineSelectOption, InputInlineSelectProps, InputKeywordSearch, InputKeywordSearchProps, InputProps, InputSelect, InputSelectProps, InputToggle, InputToggleProps, IntegrationComingSoon, IntegrationComingSoonProps, IntegrationHeaderSection, IntegrationHeaderSectionProps, IntegrationLoadingTile, IntegrationLoadingTileProps, IntegrationModalHeader, IntegrationModalHeaderProps, IntegrationModalIcon, IntegrationModalIconProps, IntegrationTile, IntegrationTileProps, Label, LabelProps, LevelProps, LimitsBar, LimitsBarProps, Link, LinkColorProps, LinkList, LinkListProps, LinkManagerWithRefType, LinkProps, LinkWithRef, LoadingIcon, LoadingIconProps, LoadingIndicator, LoadingOverlay, LoadingOverlayProps, Menu, MenuContext, MenuItem, MenuItemProps, MenuItemTextThemeProps, MenuProps, PageHeaderSection, PageHeaderSectionProps, Paragraph, ParagraphProps, ResolveIcon, ResolveIconProps, ScrollableList, ScrollableListItem, ScrollableListItemProps, ScrollableListProps, ShortcutContext, ShortcutRevealer, Switch, SwitchProps, Table, TableBody, TableBodyProps, TableCellData, TableCellDataProps, TableCellHead, TableCellHeadProps, TableFoot, TableFootProps, TableHead, TableHeadProps, TableProps, TableRow, TableRowProps, TextAlignProps, Textarea, TextareaProps, Theme, ThemeProps, TileContainer, TileContainerProps, UniformBadge, UniformLogo, UniformLogoProps, breakpointSizeProps, breakpoints, breakpointsProps, button, buttonGhost, buttonPrimary, buttonRippleEffect, buttonSecondary, buttonTertiary, buttonUnimportant, fadeIn, fadeInBottom, fadeInLtr, fadeInRtl, fadeOutBottom, growSubtle, input, inputError, inputSelect, labelText, mq, ripple, scrollbarStyles, skeletonLoading, supports, useIconContext, useMenuContext };