feat(split-button): update spectrum css input

adobe · Jan 6, 2021 · 7d83331 · 7d83331
1 parent e10fd45
commit 7d83331
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 9 deletions.
diff --git a/packages/split-button/package.json b/packages/split-button/package.json
@@ -41,7 +41,7 @@
     "author": "",
     "license": "Apache-2.0",
     "devDependencies": {
-        "@spectrum-css/splitbutton": "^3.0.0-beta.5",
+        "@spectrum-css/splitbutton": "^3.0.0-beta.6",
         "@spectrum-web-components/menu": "^0.4.4"
     },
     "dependencies": {
@@ -50,6 +50,7 @@
         "@spectrum-web-components/dropdown": "^0.8.5",
         "@spectrum-web-components/icon": "^0.6.3",
         "@spectrum-web-components/icons-ui": "^0.3.3",
+        "@spectrum-web-components/icons-workflow": "^0.3.6",
         "@spectrum-web-components/overlay": "^0.6.4",
         "tslib": "^2.0.0"
     }

diff --git a/packages/split-button/src/SplitButton.ts b/packages/split-button/src/SplitButton.ts
@@ -23,19 +23,17 @@ import {
 import '@spectrum-web-components/button/sp-button.js';
 import { ButtonVariants } from '@spectrum-web-components/button';
 import { DropdownBase } from '@spectrum-web-components/dropdown';
-import {
-    ChevronDownMediumIcon,
-    MoreIcon,
-} from '@spectrum-web-components/icons-ui';
-import ChevronDownMediumStyle from '@spectrum-web-components/icon/src/spectrum-icon-chevron-down-medium.css.js';
+import { Chevron100Icon } from '@spectrum-web-components/icons-ui';
+import { MoreIcon } from '@spectrum-web-components/icons-workflow';
+import chevronStyles from '@spectrum-web-components/icon/src/spectrum-icon-chevron.css.js';
 import styles from './split-button.css.js';
 
 /**
  * @slot options - The menu with options that will display when the dropdown is open
  */
 export class SplitButton extends DropdownBase {
     public static get styles(): CSSResultArray {
-        return [styles, ChevronDownMediumStyle];
+        return [styles, chevronStyles];
     }
 
     @property({ type: Boolean, reflect: true })
@@ -47,6 +45,9 @@ export class SplitButton extends DropdownBase {
     @property({ reflect: true })
     public variant: ButtonVariants = 'cta';
 
+    @property({ type: String, reflect: true })
+    public size = 'm';
+
     public get target(): HTMLButtonElement | this {
         return this;
     }
@@ -132,11 +133,11 @@ export class SplitButton extends DropdownBase {
                 >
                     <sp-icon
                         class="icon ${this.type === 'field'
-                            ? 'chevron-down-medium'
+                            ? 'spectrum-UIIcon-ChevronDown100'
                             : 'more-medium'}"
                     >
                         ${this.type === 'field'
-                            ? ChevronDownMediumIcon({ hidden: true })
+                            ? Chevron100Icon()
                             : MoreIcon({ hidden: true })}
                     </sp-icon>
                 </sp-button>

diff --git a/packages/split-button/tsconfig.json b/packages/split-button/tsconfig.json
@@ -10,6 +10,7 @@
         { "path": "../button" },
         { "path": "../icon" },
         { "path": "../icons-ui" },
+        { "path": "../icons-workflow" },
         { "path": "../overlay" }
     ]
 }