UNPKG

@wix/design-system

Version:

@wix/design-system

www.wixdesignsystem.com

78 lines (73 loc) • 3.59 kB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
### ButtonHTMLAttributes - type: All props from ButtonHTMLAttributes that comes from @types/react/index.d.ts - description: No description ### HTMLAttributes - type: All props from HTMLAttributes that comes from @types/react/index.d.ts - description: No description ### AriaAttributes - type: All props from AriaAttributes that comes from @types/react/index.d.ts - description: No description ### DOMAttributes - type: All props from DOMAttributes that comes from @types/react/index.d.ts - description: No description ### skin - type: TextButtonSkin - description: Specifies the skin of a button ### underline - type: TextButtonUnderline - description: Specifies whether to display and when to display an underline below button label ### weight - type: TextButtonWeight - description: Controls the font weight of button label ### size - type: TextButtonSize - description: Controls the size of a button ### suffixIcon - type: IconElement - description: Pass an icon or a component to display at the end of a label (e.g., svg, image, etc.) ### prefixIcon - type: IconElement - description: Pass an icon or a component to display at the front of a label (e.g., svg, image, etc.) ### dataHook - type: string - description: Applies a data-hook HTML attribute that can be used in the tests ### fluid - type: boolean - description: Stretches button to fill a 100% of its parent container width ### ellipsis - type: boolean - description: Specifies whether component handles text overflow with ellipsis. If enabled, label that exceed available space will be displayed inside of a tooltip when user hover over a button. ### showTooltip - type: boolean - description: Specifies whether the full button label is displayed in a tooltip when label overflows available space. Behaviour is enabled by default. Set property value to false to show ellipsis without a tooltip. ### tooltipProps - type: TooltipCommonProps - description: Allows to pass all common tooltip props. Use it to customize a tooltip created from text ellipsis. ### ariaLabel - type: string - description: Defines a string value that labels the button element to screen reader users ### ariaLabelledBy - type: string - description: Identifies the element that labels the button element ### ariaHaspopup - type: string - description: Indicates to screen reader users whether an interactive popup element, such as menu or dialog, can be triggered by a button ### ariaExpanded - type: boolean - description: Indicates to screen reader users whether the collapsible content below is in the expanded or in the collapsed state ### ariaControls - type: string - description: Identifies the element whose contents or presence are controlled by the button ### ariaActiveDescendant - type: string - description: Identifies the element that represents the currently active descendant of the button ### as - type: "object" | "small" | "form" | "slot" | "style" | "title" | "button" | "search" | "article" | "dialog" | "figure" | "img" | "link" | "main" | "menu" | "option" | "table" | "time" | ... 94 more ... | ComponentType<...> - description: Renders component as any other component or a given HTML tag. ### wrap - type: boolean - description: Enables wrapping when text is longer than its parent container. Cannot be used with as="button" ### AnchorHTMLAttributes - type: All props from AnchorHTMLAttributes that comes from @types/react/index.d.ts - description: No description