@symbo.ls/button 2.11.160 → 2.11.164
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/index.js +84 -44
- package/package.json +2 -2
package/index.js
CHANGED
|
@@ -37,12 +37,6 @@ export const SquareButton = {
|
|
|
37
37
|
}
|
|
38
38
|
}
|
|
39
39
|
|
|
40
|
-
export const ButtonSet = {
|
|
41
|
-
tag: 'nav',
|
|
42
|
-
extend: Flex,
|
|
43
|
-
childExtend: SquareButton
|
|
44
|
-
}
|
|
45
|
-
|
|
46
40
|
export const CircleButton = {
|
|
47
41
|
extend: SquareButton,
|
|
48
42
|
props: { round: 'C' }
|
|
@@ -53,62 +47,108 @@ export const KangorooButton = {
|
|
|
53
47
|
childExtend: IconText
|
|
54
48
|
}
|
|
55
49
|
|
|
56
|
-
export const
|
|
57
|
-
extend:
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
50
|
+
export const CommonButton = {
|
|
51
|
+
extend: Button,
|
|
52
|
+
props: {
|
|
53
|
+
color: 'white',
|
|
54
|
+
background: 'blue',
|
|
55
|
+
boxSize: 'fit-content',
|
|
56
|
+
padding: 'A A2',
|
|
57
|
+
round: 'Z2',
|
|
58
|
+
gap: 'Y2',
|
|
59
|
+
position: 'relative'
|
|
60
|
+
},
|
|
61
|
+
icon: {
|
|
62
|
+
props: { fontSize: 'C' }
|
|
63
|
+
},
|
|
64
|
+
Caption: { props: { text: 'Button', line_height: '1em' } }
|
|
65
|
+
}
|
|
63
66
|
|
|
67
|
+
export const IconButton = {
|
|
68
|
+
extend: CommonButton,
|
|
64
69
|
props: {
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
70
|
+
icon: { name: 'smile' },
|
|
71
|
+
boxSize: 'fit-content fit-content',
|
|
72
|
+
padding: 'A',
|
|
73
|
+
background: 'gray3'
|
|
74
|
+
},
|
|
75
|
+
Caption: null
|
|
76
|
+
}
|
|
77
|
+
|
|
78
|
+
export const ButtonSet = {
|
|
79
|
+
tag: 'nav',
|
|
80
|
+
extend: Flex,
|
|
81
|
+
childExtend: IconButton
|
|
82
|
+
}
|
|
83
|
+
|
|
84
|
+
export const CancelConfirmButtons = {
|
|
85
|
+
extend: Flex,
|
|
86
|
+
childExtend: {
|
|
87
|
+
extend: CommonButton,
|
|
88
|
+
props: {
|
|
89
|
+
minWidth: 'D2',
|
|
72
90
|
':first-child': {
|
|
73
|
-
background: 'transparent'
|
|
91
|
+
background: 'transparent',
|
|
92
|
+
border: '1px solid #20202B'
|
|
74
93
|
},
|
|
75
94
|
':last-child': {
|
|
76
|
-
background: '#0474F2'
|
|
77
95
|
}
|
|
78
96
|
}
|
|
97
|
+
},
|
|
98
|
+
...[
|
|
99
|
+
{ Caption: { text: 'No' } },
|
|
100
|
+
{ Caption: { text: 'Yes' } }
|
|
101
|
+
],
|
|
102
|
+
|
|
103
|
+
props: {
|
|
104
|
+
gap: 'Z',
|
|
105
|
+
maxWidth: 'fit-content'
|
|
79
106
|
}
|
|
80
107
|
}
|
|
81
108
|
|
|
82
|
-
export const
|
|
83
|
-
extend:
|
|
109
|
+
export const IcontextButton = {
|
|
110
|
+
extend: CommonButton,
|
|
84
111
|
props: {
|
|
85
|
-
icon: { name: 'circle' },
|
|
86
|
-
boxSize: 'fit-content fit-content',
|
|
87
112
|
padding: 'A',
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
113
|
+
position: 'relative',
|
|
114
|
+
background: 'gray3',
|
|
115
|
+
icon: { name: 'smile' }
|
|
91
116
|
}
|
|
92
117
|
}
|
|
93
118
|
|
|
94
|
-
export const
|
|
95
|
-
extend:
|
|
96
|
-
icon: null,
|
|
97
|
-
props: { text: 'Button' }
|
|
98
|
-
}
|
|
99
|
-
|
|
100
|
-
export const ButtonTemplate3 = {
|
|
101
|
-
extend: ButtonTemplate1,
|
|
119
|
+
export const DropDownButton = {
|
|
120
|
+
extend: CommonButton,
|
|
102
121
|
props: {
|
|
103
|
-
|
|
104
|
-
|
|
122
|
+
gap: 'Y',
|
|
123
|
+
boxSize: 'fit-content fit-content',
|
|
124
|
+
padding: 'A B A A+X',
|
|
125
|
+
round: 'Z',
|
|
126
|
+
background: '#141416',
|
|
127
|
+
color: 'white',
|
|
128
|
+
icon: {
|
|
129
|
+
name: 'chevronDown',
|
|
130
|
+
fontSize: 'D'
|
|
131
|
+
},
|
|
132
|
+
Caption: { text: 'all' }
|
|
105
133
|
}
|
|
106
134
|
}
|
|
107
135
|
|
|
108
|
-
export const
|
|
109
|
-
extend:
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
136
|
+
export const DropDownButtonWithAvatar = {
|
|
137
|
+
extend: DropDownButton,
|
|
138
|
+
props: {
|
|
139
|
+
gap: 'Z',
|
|
140
|
+
padding: 'Y1 Z',
|
|
141
|
+
round: 'Y2',
|
|
142
|
+
background: 'gray3'
|
|
143
|
+
},
|
|
113
144
|
|
|
145
|
+
Avatar: {
|
|
146
|
+
boxSize: 'A1 A1'
|
|
147
|
+
},
|
|
148
|
+
Caption: {
|
|
149
|
+
text: 'ETH',
|
|
150
|
+
props: {
|
|
151
|
+
fontSize: 'Z1'
|
|
152
|
+
}
|
|
153
|
+
}
|
|
114
154
|
}
|
package/package.json
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@symbo.ls/button",
|
|
3
|
-
"version": "2.11.
|
|
3
|
+
"version": "2.11.164",
|
|
4
4
|
"main": "index.js",
|
|
5
5
|
"license": "MIT",
|
|
6
|
-
"gitHead": "
|
|
6
|
+
"gitHead": "943a48800e5959b8c1f15d5d8d49224565038c23",
|
|
7
7
|
"dependencies": {
|
|
8
8
|
"@symbo.ls/atoms": "latest",
|
|
9
9
|
"@symbo.ls/icon": "latest"
|