@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.
- package/CHANGELOG.md +24 -0
- package/dist/index.d.ts +47 -19
- package/dist/index.es.js +3609 -3516
- package/dist/index.es.js.map +1 -1
- package/dist/index.umd.js +43 -43
- package/dist/index.umd.js.map +1 -1
- package/dist/style.css +1 -1
- package/package.json +3 -4
- package/src/lib/components/atoms/badge/Badge.tsx +1 -1
- package/src/lib/components/atoms/button/button-variants/ButtonPill.tsx +1 -1
- package/src/lib/components/atoms/button/button-variants/ButtonUnstyled.tsx +1 -1
- package/src/lib/components/atoms/button/button-variants/buttonVariants.types.ts +1 -1
- package/src/lib/components/atoms/button-segment/ButtonSegment.tsx +15 -3
- package/src/lib/components/atoms/info-box/InfoBox.tsx +2 -1
- package/src/lib/components/atoms/key-value-info/KeyValueInfo.tsx +3 -2
- package/src/lib/components/atoms/label-text/LabelText.tsx +2 -1
- package/src/lib/components/atoms/list-item/ListItem.tsx +2 -2
- package/src/lib/components/atoms/snackbar/Snackbar.tsx +1 -1
- package/src/lib/components/atoms/tooltip/Tooltip.tsx +115 -14
- package/src/lib/components/molecules/account/Account.tsx +21 -3
- package/src/lib/components/molecules/address/Address.tsx +1 -1
- package/src/lib/components/molecules/card/CardAction.tsx +1 -1
- package/src/lib/components/molecules/card/CardBody.tsx +3 -3
- package/src/lib/components/molecules/chip/Chip.tsx +1 -1
- package/src/lib/components/molecules/display-stats/DisplayStats.tsx +41 -3
- package/src/lib/components/molecules/input/Input.tsx +5 -4
- package/src/lib/components/molecules/input/InputWrapper.tsx +1 -1
- package/src/lib/components/molecules/input/TextArea.tsx +3 -2
- package/src/lib/components/molecules/input/input.types.ts +3 -3
- package/src/lib/components/molecules/navbar-item/NavbarItemHorizontal.tsx +2 -2
- package/src/lib/components/molecules/navbar-item/NavbarItemVertical.tsx +2 -2
- package/src/lib/components/molecules/search/Search.tsx +2 -9
- package/src/lib/components/molecules/segmented-button/SegmentedButton.tsx +7 -3
- package/src/lib/components/molecules/select/Select.tsx +2 -3
- package/src/lib/components/molecules/table-cell/TableCell.tsx +2 -2
- package/src/lib/components/molecules/table-header-cell/TableHeaderCell.tsx +1 -1
- package/src/lib/components/molecules/title/Title.tsx +2 -1
- package/src/lib/components/organisms/accordion/Accordion.tsx +2 -2
- package/src/lib/components/organisms/dialog/Dialog.tsx +20 -1
- package/src/lib/components/organisms/navbar/Navbar.tsx +2 -1
- package/src/lib/components/organisms/navbar/NavbarSlideout.tsx +3 -2
- package/src/lib/components/organisms/table/Table.tsx +6 -12
- package/src/lib/components/organisms/table/TableContext.tsx +2 -1
- package/src/lib/tailwind/base.presets.ts +1 -1
- package/src/lib/tailwind/constants/fontSizes.constants.ts +1 -1
- package/src/lib/tailwind/helpers.ts +1 -1
- package/src/lib/tailwind/responsive.presets.ts +1 -1
- package/src/lib/tailwind/types.ts +1 -1
- package/src/storybook/blocks/TypeSet.tsx +1 -1
- package/src/storybook/stories/atoms/Snackbar.stories.tsx +2 -1
- package/src/storybook/stories/molecules/Card.stories.tsx +1 -4
- package/src/storybook/stories/molecules/Dropdown.stories.tsx +1 -1
- package/src/storybook/stories/molecules/Input.stories.tsx +2 -1
- package/src/storybook/stories/molecules/Search.stories.tsx +2 -1
- package/src/storybook/stories/molecules/SegmentedButton.stories.tsx +2 -1
- package/src/storybook/stories/molecules/Select.stories.tsx +2 -1
- 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 {
|
|
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?:
|
|
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?:
|
|
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?:
|
|
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.
|
|
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?:
|
|
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,
|
|
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?:
|
|
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?:
|
|
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<
|
|
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?:
|
|
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>):
|
|
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;
|