Skip to content

Commit a86bfc7

Browse files
lazdlazd
committed
feat: update to new ActionButton markup
BREAKING CHANGE: .spectrum-ActionButton--sizeM now required for all uses
1 parent f535f4b commit a86bfc7

13 files changed

Lines changed: 93 additions & 93 deletions

File tree

‎components/actionbar/metadata/actionbar.yml‎

Lines changed: 14 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -28,13 +28,13 @@ examples:
2828
<span class="spectrum-Checkbox-label">2 selected</span>
2929
</label>
3030
<div class="spectrum-ActionGroup">
31-
<button class="spectrum-ActionButton spectrum-ActionButton--quiet spectrum-ActionGroup-item">
31+
<button class="spectrum-ActionButton spectrum-ActionButton--sizeM spectrum-ActionButton--quiet spectrum-ActionGroup-item">
3232
<span class="spectrum-ActionButton-label">Edit</span>
3333
</button>
34-
<button class="spectrum-ActionButton spectrum-ActionButton--quiet spectrum-ActionGroup-item">
34+
<button class="spectrum-ActionButton spectrum-ActionButton--sizeM spectrum-ActionButton--quiet spectrum-ActionGroup-item">
3535
<span class="spectrum-ActionButton-label">Copy</span>
3636
</button>
37-
<button class="spectrum-ActionButton spectrum-ActionButton--quiet spectrum-ActionGroup-item">
37+
<button class="spectrum-ActionButton spectrum-ActionButton--sizeM spectrum-ActionButton--quiet spectrum-ActionGroup-item">
3838
<span class="spectrum-ActionButton-label">Delete</span>
3939
</button>
4040
</div>
@@ -56,19 +56,19 @@ examples:
5656
<span class="spectrum-Checkbox-label">4 selected</span>
5757
</label>
5858
<div class="spectrum-ActionGroup">
59-
<button class="spectrum-ActionButton spectrum-ActionButton--quiet spectrum-ActionGroup-item">
59+
<button class="spectrum-ActionButton spectrum-ActionButton--sizeM spectrum-ActionButton--quiet spectrum-ActionGroup-item">
6060
<svg class="spectrum-Icon spectrum-Icon--sizeM" focusable="false" aria-hidden="true" aria-label="Edit">
6161
<use xlink:href="#spectrum-icon-18-Edit"></use>
6262
</svg>
6363
<span class="spectrum-ActionButton-label">Edit</span>
6464
</button>
65-
<button class="spectrum-ActionButton spectrum-ActionButton--quiet spectrum-ActionGroup-item">
65+
<button class="spectrum-ActionButton spectrum-ActionButton--sizeM spectrum-ActionButton--quiet spectrum-ActionGroup-item">
6666
<svg class="spectrum-Icon spectrum-Icon--sizeM" focusable="false" aria-hidden="true" aria-label="Copy">
6767
<use xlink:href="#spectrum-icon-18-Copy"></use>
6868
</svg>
6969
<span class="spectrum-ActionButton-label">Copy</span>
7070
</button>
71-
<button class="spectrum-ActionButton spectrum-ActionButton--quiet spectrum-ActionGroup-item">
71+
<button class="spectrum-ActionButton spectrum-ActionButton--sizeM spectrum-ActionButton--quiet spectrum-ActionGroup-item">
7272
<svg class="spectrum-Icon spectrum-Icon--sizeM" focusable="false" aria-hidden="true" aria-label="Delete">
7373
<use xlink:href="#spectrum-icon-18-Delete"></use>
7474
</svg>
@@ -93,17 +93,17 @@ examples:
9393
<span class="spectrum-Checkbox-label">6 selected</span>
9494
</label>
9595
<div class="spectrum-ActionGroup">
96-
<button class="spectrum-ActionButton spectrum-ActionButton--quiet spectrum-ActionGroup-item">
96+
<button class="spectrum-ActionButton spectrum-ActionButton--sizeM spectrum-ActionButton--quiet spectrum-ActionGroup-item">
9797
<svg class="spectrum-Icon spectrum-Icon--sizeM" focusable="false" aria-hidden="true" aria-label="Edit">
9898
<use xlink:href="#spectrum-icon-18-Edit"></use>
9999
</svg>
100100
</button>
101-
<button class="spectrum-ActionButton spectrum-ActionButton--quiet spectrum-ActionGroup-item">
101+
<button class="spectrum-ActionButton spectrum-ActionButton--sizeM spectrum-ActionButton--quiet spectrum-ActionGroup-item">
102102
<svg class="spectrum-Icon spectrum-Icon--sizeM" focusable="false" aria-hidden="true" aria-label="Copy">
103103
<use xlink:href="#spectrum-icon-18-Copy"></use>
104104
</svg>
105105
</button>
106-
<button class="spectrum-ActionButton spectrum-ActionButton--quiet spectrum-ActionGroup-item">
106+
<button class="spectrum-ActionButton spectrum-ActionButton--sizeM spectrum-ActionButton--quiet spectrum-ActionGroup-item">
107107
<svg class="spectrum-Icon spectrum-Icon--sizeM" focusable="false" aria-hidden="true" aria-label="Delete">
108108
<use xlink:href="#spectrum-icon-18-Delete"></use>
109109
</svg>
@@ -130,12 +130,12 @@ examples:
130130
<span class="spectrum-Checkbox-label">228 selected</span>
131131
</label>
132132
<div class="spectrum-ActionGroup">
133-
<button class="spectrum-ActionButton spectrum-ActionButton--quiet spectrum-ActionGroup-item">
133+
<button class="spectrum-ActionButton spectrum-ActionButton--sizeM spectrum-ActionButton--quiet spectrum-ActionGroup-item">
134134
<svg class="spectrum-Icon spectrum-Icon--sizeM" focusable="false" aria-hidden="true" aria-label="Edit">
135135
<use xlink:href="#spectrum-icon-18-Edit"></use>
136136
</svg>
137137
</button>
138-
<button class="spectrum-ActionButton spectrum-ActionButton--quiet spectrum-ActionGroup-item">
138+
<button class="spectrum-ActionButton spectrum-ActionButton--sizeM spectrum-ActionButton--quiet spectrum-ActionGroup-item">
139139
<svg class="spectrum-Icon spectrum-Icon--sizeM" focusable="false" aria-hidden="true" aria-label="More">
140140
<use xlink:href="#spectrum-icon-18-More"></use>
141141
</svg>
@@ -327,19 +327,19 @@ examples:
327327
<span class="spectrum-Checkbox-label">4 selected</span>
328328
</label>
329329
<div class="spectrum-ActionGroup">
330-
<button class="spectrum-ActionButton spectrum-ActionButton--quiet spectrum-ActionGroup-item">
330+
<button class="spectrum-ActionButton spectrum-ActionButton--sizeM spectrum-ActionButton--quiet spectrum-ActionGroup-item">
331331
<svg class="spectrum-Icon spectrum-Icon--sizeM" focusable="false" aria-hidden="true" aria-label="Edit">
332332
<use xlink:href="#spectrum-icon-18-Edit"></use>
333333
</svg>
334334
<span class="spectrum-ActionButton-label">Edit</span>
335335
</button>
336-
<button class="spectrum-ActionButton spectrum-ActionButton--quiet spectrum-ActionGroup-item">
336+
<button class="spectrum-ActionButton spectrum-ActionButton--sizeM spectrum-ActionButton--quiet spectrum-ActionGroup-item">
337337
<svg class="spectrum-Icon spectrum-Icon--sizeM" focusable="false" aria-hidden="true" aria-label="Copy">
338338
<use xlink:href="#spectrum-icon-18-Copy"></use>
339339
</svg>
340340
<span class="spectrum-ActionButton-label">Copy</span>
341341
</button>
342-
<button class="spectrum-ActionButton spectrum-ActionButton--quiet spectrum-ActionGroup-item">
342+
<button class="spectrum-ActionButton spectrum-ActionButton--sizeM spectrum-ActionButton--quiet spectrum-ActionGroup-item">
343343
<svg class="spectrum-Icon spectrum-Icon--sizeM" focusable="false" aria-hidden="true" aria-label="Delete">
344344
<use xlink:href="#spectrum-icon-18-Delete"></use>
345345
</svg>

‎components/actionbar/package.json‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -17,15 +17,15 @@
1717
},
1818
"peerDependencies": {
1919
"@spectrum-css/actiongroup": "^1.0.0-beta.3",
20-
"@spectrum-css/button": "^3.0.0-beta.0",
20+
"@spectrum-css/actionbutton": "^1.0.0-beta.0",
2121
"@spectrum-css/checkbox": "^3.0.0-beta.0",
2222
"@spectrum-css/icon": "^3.0.0-beta.0",
2323
"@spectrum-css/popover": "^3.0.0-beta.0",
2424
"@spectrum-css/vars": "^2.3.0"
2525
},
2626
"devDependencies": {
2727
"@spectrum-css/actiongroup": "^1.0.0-beta.3",
28-
"@spectrum-css/button": "^3.0.0-beta.4",
28+
"@spectrum-css/actionbutton": "^1.0.0-beta.0",
2929
"@spectrum-css/checkbox": "^3.0.0-beta.4",
3030
"@spectrum-css/component-builder": "^1.2.1-beta.0",
3131
"@spectrum-css/icon": "^3.0.0-beta.0",

0 commit comments

Comments
 (0)