@iota/apps-ui-kit 0.5.0 → 0.6.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.
Files changed (57) hide show
  1. package/CHANGELOG.md +24 -0
  2. package/dist/index.d.ts +47 -19
  3. package/dist/index.es.js +3609 -3516
  4. package/dist/index.es.js.map +1 -1
  5. package/dist/index.umd.js +43 -43
  6. package/dist/index.umd.js.map +1 -1
  7. package/dist/style.css +1 -1
  8. package/package.json +3 -4
  9. package/src/lib/components/atoms/badge/Badge.tsx +1 -1
  10. package/src/lib/components/atoms/button/button-variants/ButtonPill.tsx +1 -1
  11. package/src/lib/components/atoms/button/button-variants/ButtonUnstyled.tsx +1 -1
  12. package/src/lib/components/atoms/button/button-variants/buttonVariants.types.ts +1 -1
  13. package/src/lib/components/atoms/button-segment/ButtonSegment.tsx +15 -3
  14. package/src/lib/components/atoms/info-box/InfoBox.tsx +2 -1
  15. package/src/lib/components/atoms/key-value-info/KeyValueInfo.tsx +3 -2
  16. package/src/lib/components/atoms/label-text/LabelText.tsx +2 -1
  17. package/src/lib/components/atoms/list-item/ListItem.tsx +2 -2
  18. package/src/lib/components/atoms/snackbar/Snackbar.tsx +1 -1
  19. package/src/lib/components/atoms/tooltip/Tooltip.tsx +115 -14
  20. package/src/lib/components/molecules/account/Account.tsx +21 -3
  21. package/src/lib/components/molecules/address/Address.tsx +1 -1
  22. package/src/lib/components/molecules/card/CardAction.tsx +1 -1
  23. package/src/lib/components/molecules/card/CardBody.tsx +3 -3
  24. package/src/lib/components/molecules/chip/Chip.tsx +1 -1
  25. package/src/lib/components/molecules/display-stats/DisplayStats.tsx +41 -3
  26. package/src/lib/components/molecules/input/Input.tsx +5 -4
  27. package/src/lib/components/molecules/input/InputWrapper.tsx +1 -1
  28. package/src/lib/components/molecules/input/TextArea.tsx +3 -2
  29. package/src/lib/components/molecules/input/input.types.ts +3 -3
  30. package/src/lib/components/molecules/navbar-item/NavbarItemHorizontal.tsx +2 -2
  31. package/src/lib/components/molecules/navbar-item/NavbarItemVertical.tsx +2 -2
  32. package/src/lib/components/molecules/search/Search.tsx +2 -9
  33. package/src/lib/components/molecules/segmented-button/SegmentedButton.tsx +7 -3
  34. package/src/lib/components/molecules/select/Select.tsx +2 -3
  35. package/src/lib/components/molecules/table-cell/TableCell.tsx +2 -2
  36. package/src/lib/components/molecules/table-header-cell/TableHeaderCell.tsx +1 -1
  37. package/src/lib/components/molecules/title/Title.tsx +2 -1
  38. package/src/lib/components/organisms/accordion/Accordion.tsx +2 -2
  39. package/src/lib/components/organisms/dialog/Dialog.tsx +20 -1
  40. package/src/lib/components/organisms/navbar/Navbar.tsx +2 -1
  41. package/src/lib/components/organisms/navbar/NavbarSlideout.tsx +3 -2
  42. package/src/lib/components/organisms/table/Table.tsx +6 -12
  43. package/src/lib/components/organisms/table/TableContext.tsx +2 -1
  44. package/src/lib/tailwind/base.presets.ts +1 -1
  45. package/src/lib/tailwind/constants/fontSizes.constants.ts +1 -1
  46. package/src/lib/tailwind/helpers.ts +1 -1
  47. package/src/lib/tailwind/responsive.presets.ts +1 -1
  48. package/src/lib/tailwind/types.ts +1 -1
  49. package/src/storybook/blocks/TypeSet.tsx +1 -1
  50. package/src/storybook/stories/atoms/Snackbar.stories.tsx +2 -1
  51. package/src/storybook/stories/molecules/Card.stories.tsx +1 -4
  52. package/src/storybook/stories/molecules/Dropdown.stories.tsx +1 -1
  53. package/src/storybook/stories/molecules/Input.stories.tsx +2 -1
  54. package/src/storybook/stories/molecules/Search.stories.tsx +2 -1
  55. package/src/storybook/stories/molecules/SegmentedButton.stories.tsx +2 -1
  56. package/src/storybook/stories/molecules/Select.stories.tsx +2 -1
  57. package/src/storybook/stories/organisms/Navbar.stories.tsx +2 -1
package/CHANGELOG.md CHANGED
@@ -1,5 +1,29 @@
1
1
  # @iota/apps-ui-kit
2
2
 
3
+ ## 0.6.0
4
+
5
+ ### Minor Changes
6
+
7
+ - 53d5058: Added iota names rpc methods to IotaClient and also GraphQL queries.
8
+
9
+ ### Patch Changes
10
+
11
+ - 6e45a2a: Fix tooltip being cut by other boxes
12
+ - b80df15: show horizontal scroll in underlined segmented buttons
13
+ - Updated dependencies [7f0803f]
14
+ - @iota/apps-ui-icons@0.3.1
15
+
16
+ ## 0.5.1
17
+
18
+ ### Patch Changes
19
+
20
+ - 0524b61: add Tooltip to Badge in Account component
21
+ - a6d0c82: Add eslint config. Resolve eslint errors/warnings.
22
+ - a756bbc: add copy button to DisplayStats component
23
+ - 9d01a25: Fix dialog to prevent closing popup when closing a toast
24
+ - 0edfd4e: Update dependencies.
25
+ - be15d98: Update imports to avoid cycle dependencies
26
+
3
27
  ## 0.5.0
4
28
 
5
29
  ### Minor Changes
package/dist/index.d.ts CHANGED
@@ -1,3 +1,7 @@
1
+ import { BadgeType as BadgeType_2 } from '../../../../components/atoms';
2
+ import { ButtonProps as ButtonProps_2 } from '../../../../components/atoms';
3
+ import { ButtonSegmentType as ButtonSegmentType_2 } from '../../../../components/atoms';
4
+ import { ButtonType as ButtonType_2 } from '../../../../components/atoms/button';
1
5
  import { ComponentProps } from 'react';
2
6
  import { Config } from 'tailwindcss';
3
7
  import { ForwardRefExoticComponent } from 'react';
@@ -9,7 +13,8 @@ import * as RadixDialog from '@radix-ui/react-dialog';
9
13
  import * as React_2 from 'react';
10
14
  import { ReactNode } from 'react';
11
15
  import { RefAttributes } from 'react';
12
- import { SearchBarType as SearchBarType_2 } from '../../../../components';
16
+ import { TooltipPosition as TooltipPosition_2 } from '../../../../components/atoms';
17
+ import { TooltipPosition as TooltipPosition_3 } from '../../../../components/atoms/tooltip';
13
18
 
14
19
  export declare function Accordion({ children, hideBorder, }: {
15
20
  children: React.ReactNode;
@@ -50,7 +55,7 @@ export declare interface AccordionHeaderProps {
50
55
  hideBorder?: boolean;
51
56
  }
52
57
 
53
- export declare function Account({ title, subtitle, badgeType, badgeText, isLocked, avatarContent, onOptionsClick, onLockAccountClick, onUnlockAccountClick, onCopy, copyText, onOpen, isCopyable, isExternal, isSelected, isActive, showSelected, }: AccountProps): React.JSX.Element;
58
+ export declare function Account({ title, subtitle, badgeType, badgeText, isLocked, avatarContent, onOptionsClick, onLockAccountClick, onUnlockAccountClick, onCopy, copyText, onOpen, isCopyable, isExternal, isSelected, isActive, showSelected, badgeTooltipText, badgeTooltipPosition, }: AccountProps): React.JSX.Element;
54
59
 
55
60
  declare interface AccountProps {
56
61
  /**
@@ -118,11 +123,19 @@ declare interface AccountProps {
118
123
  /**
119
124
  * The type of the badge.
120
125
  */
121
- badgeType?: BadgeType;
126
+ badgeType?: BadgeType_2;
122
127
  /**
123
128
  * The text of the badge.
124
129
  */
125
130
  badgeText?: string;
131
+ /**
132
+ * The tooltip text of the badge.
133
+ */
134
+ badgeTooltipText?: string;
135
+ /**
136
+ * The tooltip position of the badge.
137
+ */
138
+ badgeTooltipPosition?: TooltipPosition_2;
126
139
  }
127
140
 
128
141
  export declare function Address({ text, isCopyable, isExternal, externalLink, copyText, onCopySuccess, onCopyError, onOpen, }: AddressProps): React.JSX.Element;
@@ -282,7 +295,7 @@ export declare interface ButtonProps {
282
295
  testId?: string;
283
296
  }
284
297
 
285
- export declare function ButtonSegment({ icon, label, selected, disabled, onClick, type, }: ButtonSegmentProps): React.JSX.Element;
298
+ export declare function ButtonSegment({ icon, label, selected, disabled, onClick, type, isNested, }: ButtonSegmentProps): React.JSX.Element;
286
299
 
287
300
  declare interface ButtonSegmentProps {
288
301
  /**
@@ -309,6 +322,10 @@ declare interface ButtonSegmentProps {
309
322
  * The type of the button.
310
323
  */
311
324
  type?: ButtonSegmentType;
325
+ /**
326
+ * If the button is nested inside a parent button.
327
+ */
328
+ isNested?: boolean;
312
329
  }
313
330
 
314
331
  export declare enum ButtonSegmentType {
@@ -346,7 +363,7 @@ export declare type CardActionProps = {
346
363
  onClick?: () => void;
347
364
  icon?: React.ReactNode;
348
365
  iconAfterText?: boolean;
349
- buttonType?: ButtonType;
366
+ buttonType?: ButtonType_2;
350
367
  buttonDisabled?: boolean;
351
368
  };
352
369
 
@@ -365,7 +382,7 @@ export declare type CardBodyProps = {
365
382
  icon?: React.ReactNode;
366
383
  isTextTruncated?: boolean;
367
384
  tooltipText?: string;
368
- tooltipPosition?: TooltipPosition;
385
+ tooltipPosition?: TooltipPosition_3;
369
386
  };
370
387
 
371
388
  export declare function CardImage({ type, shape, url, children, }: CardImageProps): JSX_2.Element;
@@ -485,7 +502,7 @@ declare interface ChipProps {
485
502
  disabled?: boolean;
486
503
  }
487
504
 
488
- export declare const Dialog: React_2.FC<RadixDialog.DialogProps>;
505
+ export declare const Dialog: ({ open, onOpenChange, children, ...props }: React_2.ComponentPropsWithoutRef<typeof RadixDialog.Root>) => JSX_2.Element;
489
506
 
490
507
  export declare const DialogBody: React_2.ForwardRefExoticComponent<Omit<React_2.DetailedHTMLProps<React_2.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React_2.RefAttributes<HTMLDivElement>>;
491
508
 
@@ -507,7 +524,7 @@ export declare const DialogTitle: React_2.ForwardRefExoticComponent<Omit<RadixDi
507
524
 
508
525
  export declare const DialogTrigger: React_2.ForwardRefExoticComponent<RadixDialog.DialogTriggerProps & React_2.RefAttributes<HTMLButtonElement>>;
509
526
 
510
- export declare function DisplayStats({ label, tooltipPosition, tooltipText, value, supportingLabel, type, size, icon, }: DisplayStatsProps): React.JSX.Element;
527
+ export declare function DisplayStats({ label, tooltipPosition, tooltipText, value, supportingLabel, type, size, icon, copyText, onCopySuccess, onCopyError, }: DisplayStatsProps): React.JSX.Element;
511
528
 
512
529
  declare interface DisplayStatsProps {
513
530
  /**
@@ -517,7 +534,7 @@ declare interface DisplayStatsProps {
517
534
  /**
518
535
  * The tooltip position.
519
536
  */
520
- tooltipPosition?: TooltipPosition;
537
+ tooltipPosition?: TooltipPosition_2;
521
538
  /**
522
539
  * The tooltip text.
523
540
  */
@@ -542,6 +559,18 @@ declare interface DisplayStatsProps {
542
559
  * Add icon to the right of the label.
543
560
  */
544
561
  icon?: React.ReactNode;
562
+ /**
563
+ * Text that need to be copied (optional).
564
+ */
565
+ copyText?: string;
566
+ /**
567
+ * The onCopySuccess event of the KeyValue (optional).
568
+ */
569
+ onCopySuccess?: (e: React.MouseEvent<HTMLButtonElement>, text: string) => void;
570
+ /**
571
+ * The onCopyError event of the KeyValue (optional).
572
+ */
573
+ onCopyError?: (e: unknown, text: string) => void;
545
574
  }
546
575
 
547
576
  export declare enum DisplayStatsSize {
@@ -1087,7 +1116,7 @@ export declare enum ScreenSize {
1087
1116
  Xl = "xl"
1088
1117
  }
1089
1118
 
1090
- export declare function Search({ searchValue, suggestions, onSearchValueChange, onSuggestionClick, placeholder, isLoading, onKeyDown, type, renderSuggestion, }: SearchProps): React.JSX.Element;
1119
+ export declare function Search({ searchValue, suggestions, onSearchValueChange, onSuggestionClick, placeholder, isLoading, type, renderSuggestion, }: SearchProps): React.JSX.Element;
1091
1120
 
1092
1121
  export declare enum SearchBarType {
1093
1122
  Outlined = "outlined",
@@ -1119,14 +1148,10 @@ export declare interface SearchProps {
1119
1148
  * Are the suggestions loading.
1120
1149
  */
1121
1150
  isLoading: boolean;
1122
- /**
1123
- * Callback when a key is pressed.
1124
- */
1125
- onKeyDown?: (event: React.KeyboardEvent<HTMLInputElement>) => void;
1126
1151
  /**
1127
1152
  * The type of the search bar. Can be 'outlined' or 'filled'.
1128
1153
  */
1129
- type?: SearchBarType_2;
1154
+ type?: SearchBarType;
1130
1155
  /**
1131
1156
  * Render suggestion.
1132
1157
  */
@@ -1143,7 +1168,7 @@ declare interface SegmentedButtonProps {
1143
1168
  /**
1144
1169
  * The shape of the button
1145
1170
  */
1146
- shape?: ButtonSegmentType;
1171
+ shape?: ButtonSegmentType_2;
1147
1172
  }
1148
1173
 
1149
1174
  export declare enum SegmentedButtonType {
@@ -1331,7 +1356,7 @@ export declare interface Suggestion {
1331
1356
 
1332
1357
  export declare function Table({ paginationOptions, action, supportingLabel, selectedRowIndexes, rowIndexes, children, pageSizeSelector, heightFull, }: PropsWithChildren<TableProps>): JSX.Element;
1333
1358
 
1334
- export declare function TableActionButton(props: PropsWithChildren<ButtonProps>): JSX_2.Element;
1359
+ export declare function TableActionButton(props: PropsWithChildren<ButtonProps_2>): JSX_2.Element;
1335
1360
 
1336
1361
  export declare function TableBody({ children }: PropsWithChildren): JSX.Element;
1337
1362
 
@@ -1556,7 +1581,7 @@ declare interface TitleProps {
1556
1581
  /**
1557
1582
  * The tooltip position.
1558
1583
  */
1559
- tooltipPosition?: TooltipPosition;
1584
+ tooltipPosition?: TooltipPosition_2;
1560
1585
  /**
1561
1586
  * The tooltip text.
1562
1587
  */
@@ -1627,7 +1652,7 @@ export declare enum ToggleSize {
1627
1652
  Default = "default"
1628
1653
  }
1629
1654
 
1630
- export declare function Tooltip({ text, position, maxWidth, children, }: PropsWithChildren<TooltipProps>): React.JSX.Element;
1655
+ export declare function Tooltip({ text, position, maxWidth, offset, openDelay, closeDelay, children, }: PropsWithChildren<TooltipProps>): JSX_2.Element;
1631
1656
 
1632
1657
  export declare enum TooltipPosition {
1633
1658
  Top = "top",
@@ -1640,6 +1665,9 @@ declare interface TooltipProps {
1640
1665
  text: string;
1641
1666
  position?: TooltipPosition;
1642
1667
  maxWidth?: string;
1668
+ offset?: number;
1669
+ openDelay?: number;
1670
+ closeDelay?: number;
1643
1671
  }
1644
1672
 
1645
1673
  export declare function truncate(value: string, startLength?: number, endLength?: number): string;