npm - @spectrum-web-components/action-group - Versions diffs - 0.4.17-lit-next.0 → 0.4.17 - Mend

@spectrum-web-components/action-group 0.4.17-lit-next.0 → 0.4.17

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.

Files changed (10) hide show

package/README.md +39 -4
package/custom-elements.json +19 -0
package/package.json +4 -4
package/src/ActionGroup.d.ts +1 -0
package/src/ActionGroup.js +14 -0
package/src/ActionGroup.js.map +1 -1
package/stories/action-group-tooltip.stories.js +1 -1
package/stories/action-group-tooltip.stories.js.map +1 -1
package/stories/action-group.stories.js +5 -5
package/stories/action-group.stories.js.map +1 -1

package/README.md CHANGED Viewed

@@ -24,16 +24,41 @@ When looking to leverage the `ActionGroup` base class as a type and/or for exten
 import { ActionGroup } from '@spectrum-web-components/action-group';
 ```
+## Example
+```html
+<sp-action-group>
+    <sp-action-button>
+        <sp-icon-magnify slot="icon"></sp-icon-magnify>
+        Button 1
+    </sp-action-button>
+    <sp-action-button>
+        <sp-icon-magnify slot="icon"></sp-icon-magnify>
+        Longer Button 2
+    </sp-action-button>
+    <sp-action-button>
+        <sp-icon-magnify slot="icon"></sp-icon-magnify>
+        Short 3
+    </sp-action-button>
+</sp-action-group>
+```
 ## Selects
 An `<sp-action-group selects="single|multiple">` will manage a `selected` property that consists on an array of the `<sp-action-button>` children that are currently selected. A `change` event is dispatched from the `<sp-action-group>` element when the value of `selected` is updated. This event can be canceled via `event.preventDefault()`, after which the value of `selected` will be returned to what it was previously.
+When a selection can be made, it is a good idea to supply the group of options with accessible text that names the group of buttons. This can be done in a non-visual way via the `label` attribute of the `<sp-action-group>` element. You can also associate the `<sp-action-group>` to a second, visible DOM element via the `aria-labelledby` attribute or, when available, via the `for` attribute on the second element to make the association in the other direction.
 ### Single
 An `<sp-action-group selects="single">` will manage its `<sp-action-button>` children as "radio buttons" allowing the user to select a _single_ one of the buttons presented. The `<sp-action-button>` children will only be able to turn their `selected` value on while maintaining a single selection after an intial selection is made.
 ```html
-<sp-action-group selects="single" emphasized>
+<sp-action-group
+    selects="single"
+    emphasized
+    label="Single Selection Demo Group"
+>
     <sp-action-button>
         <sp-icon-magnify slot="icon"></sp-icon-magnify>
         Button 1
@@ -54,7 +79,11 @@ An `<sp-action-group selects="single">` will manage its `<sp-action-button>` chi
 An `<sp-action-group selects="multiple">` will manage its `<sp-action-button>` children as "chekboxes" allowing the user to select a _multiple_ of the buttons presented. The `<sp-action-button>` children will toggle their `selected` value on and off when clicked sucessively.
 ```html
-<sp-action-group selects="multiple" emphasized>
+<sp-action-group
+    selects="multiple"
+    emphasized
+    label="Multiple Selection Demo Group"
+>
     <sp-action-button selected>
         <sp-icon-magnify slot="icon"></sp-icon-magnify>
         Button 1
@@ -70,7 +99,9 @@ An `<sp-action-group selects="multiple">` will manage its `<sp-action-button>` c
 </sp-action-group>
 ```
-## Default
+## Horizontal
+By default, an `<sp-action-group>` will organize its child buttons horizontally and the delivery of those buttons can be modified with the `compact`, `emphasized`, or `quiet` attributes.
 ```html
 <sp-action-group>
@@ -115,7 +146,7 @@ An `<sp-action-group selects="multiple">` will manage its `<sp-action-button>` c
     </sp-action-button>
 </sp-action-group>
 <br />
-<sp-action-group compact>
+<sp-action-group compact emphasized>
     <sp-action-button label="Zoom in">
         <sp-icon-magnify slot="icon"></sp-icon-magnify>
     </sp-action-button>
@@ -130,6 +161,8 @@ An `<sp-action-group selects="multiple">` will manage its `<sp-action-button>` c
 ## Vertical
+The use of the `vertical` attribute instructs the `<sp-action-group>` element to organize its child buttons vertically, while accepting the same `compact`, `emphasized`, and `quiet` attributes as modifiers.
 ```html
 <div style="display: flex; justify-content: space-around;">
     <sp-action-group vertical>
@@ -187,6 +220,8 @@ An `<sp-action-group selects="multiple">` will manage its `<sp-action-button>` c
 ## Justified
+The `justified` attribute will cause the `<sp-action-group>` element to fill the available horizontal space and evenly distribute that space across its child button elements.
 ```html
 <sp-action-group justified>
     <sp-action-button>

package/custom-elements.json CHANGED Viewed

@@ -142,6 +142,25 @@
               "privacy": "private",
               "default": "[]"
             },
+            {
+              "kind": "method",
+              "name": "focus",
+              "privacy": "public",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "options",
+                  "optional": true,
+                  "type": {
+                    "text": "FocusOptions"
+                  }
+                }
+              ]
+            },
             {
               "kind": "method",
               "name": "handleClick",

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/action-group",
-    "version": "0.4.17-lit-next.0+297042cb5",
+    "version": "0.4.17",
     "publishConfig": {
         "access": "public"
     },
@@ -44,8 +44,8 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/action-button": "^0.5.9-lit-next.0+297042cb5",
-        "@spectrum-web-components/base": "^0.4.6-lit-next.137+297042cb5",
+        "@spectrum-web-components/action-button": "^0.5.8",
+        "@spectrum-web-components/base": "^0.4.5",
         "tslib": "^2.0.0"
     },
     "devDependencies": {
@@ -56,5 +56,5 @@
     "sideEffects": [
         "./sp-*.js"
     ],
-    "gitHead": "297042cb5770314e9a5181c1fd97d722622f091c"
+    "gitHead": "3d9d540b4cc99ea64586a66a287c0aa51245db8e"
 }

package/src/ActionGroup.d.ts CHANGED Viewed

@@ -18,6 +18,7 @@ export declare class ActionGroup extends SpectrumElement {
     get selected(): string[];
     set selected(selected: string[]);
     private _selected;
+    focus(options?: FocusOptions): void;
     private handleClick;
     private handleFocusin;
     private handleKeydown;

package/src/ActionGroup.js CHANGED Viewed

@@ -153,6 +153,20 @@ export class ActionGroup extends SpectrumElement {
             });
         }
     }
+    focus(options) {
+        if (!this.buttons.length) {
+            return;
+        }
+        const firstButtonNonDisabled = this.buttons.find((button) => {
+            if (this.selected) {
+                return button.selected;
+            }
+            return !button.disabled;
+        });
+        if (firstButtonNonDisabled) {
+            firstButtonNonDisabled.focus(options);
+        }
+    }
     handleClick(event) {
         const target = event.target;
         if (typeof target.value === 'undefined') {

package/src/ActionGroup.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ActionGroup.js","sourceRoot":"","sources":["ActionGroup.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;EAUE;;AAEF,OAAO,EACH,IAAI,EACJ,eAAe,EAGf,QAAQ,GAEX,MAAM,+BAA+B,CAAC;AAGvC,OAAO,MAAM,MAAM,uBAAuB,CAAC;AAE3C,MAAM,eAAe,GAAa,EAAE,CAAC;AAErC;;;GAGG;AACH,MAAM,OAAO,WAAY,SAAQ,eAAe;IAAhD;;QAKW,YAAO,GAAmB,EAAE,CAAC;QAC1B,oBAAe,GAAG,kBAAkB,CAAC;QAGxC,YAAO,GAAG,KAAK,CAAC;QAGhB,eAAU,GAAG,KAAK,CAAC;QAGnB,cAAS,GAAG,KAAK,CAAC;QAGlB,UAAK,GAAG,EAAE,CAAC;QAGX,UAAK,GAAG,KAAK,CAAC;QAMd,aAAQ,GAAG,KAAK,CAAC;QAwBhB,cAAS,GAAa,eAAe,CAAC;QA6CtC,kBAAa,GAAG,GAAS,EAAE;YAC/B,IAAI,CAAC,gBAAgB,CAAC,UAAU,EAAE,IAAI,CAAC,cAAc,CAAC,CAAC;YACvD,IAAI,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;QACzD,CAAC,CAAC;QAEM,kBAAa,GAAG,CAAC,KAAoB,EAAQ,EAAE;YACnD,MAAM,EAAE,IAAI,EAAE,GAAG,KAAK,CAAC;YACvB,IACI,CAAC;gBACG,SAAS;gBACT,WAAW;gBACX,YAAY;gBACZ,WAAW;gBACX,KAAK;gBACL,MAAM;gBACN,QAAQ;gBACR,UAAU;aACb,CAAC,QAAQ,CAAC,IAAI,CAAC,EAClB;gBACE,OAAO;aACV;YACD,MAAM,aAAa,GAAI,IAAI,CAAC,WAAW,EAAe;iBACjD,aAA6B,CAAC;YACnC,sBAAsB;YACtB,IAAI,CAAC,aAAa,EAAE;gBAChB,OAAO;aACV;YACD,IAAI,SAAS,GAAG,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC;YACpD,sBAAsB;YACtB,IAAI,SAAS,KAAK,CAAC,CAAC,EAAE;gBAClB,OAAO;aACV;YACD,MAAM,sBAAsB,GAAG,CAC3B,IAAS,EACT,KAAa,EACZ,EAAE,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC,GAAG,IAAI,CAAC,MAAM,CAAC,CAAC;YAClD,MAAM,eAAe,GAAG,CAAC,KAAa,EAAQ,EAAE;gBAC5C,SAAS,IAAI,KAAK,CAAC;gBACnB,OAAO,sBAAsB,CAAC,IAAI,CAAC,OAAO,EAAE,SAAS,CAAC,CAAC,QAAQ,EAAE;oBAC7D,SAAS,IAAI,KAAK,CAAC;iBACtB;YACL,CAAC,CAAC;YACF,QAAQ,IAAI,EAAE;gBACV,KAAK,SAAS;oBACV,eAAe,CAAC,CAAC,CAAC,CAAC,CAAC;oBACpB,MAAM;gBACV,KAAK,WAAW;oBACZ,eAAe,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;oBACrC,MAAM;gBACV,KAAK,YAAY;oBACb,eAAe,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;oBACrC,MAAM;gBACV,KAAK,WAAW;oBACZ,eAAe,CAAC,CAAC,CAAC,CAAC;oBACnB,MAAM;gBACV,KAAK,KAAK;oBACN,SAAS,GAAG,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC;oBAChC,eAAe,CAAC,CAAC,CAAC,CAAC,CAAC;oBACpB,MAAM;gBACV,KAAK,MAAM;oBACP,SAAS,GAAG,CAAC,CAAC,CAAC;oBACf,eAAe,CAAC,CAAC,CAAC,CAAC;oBACnB,MAAM;gBACV,KAAK,QAAQ,CAAC;gBACd,KAAK,UAAU,CAAC;gBAChB;oBACI,MAAM,YAAY,GAAG;wBACjB,GAAI,IAAI,CAAC,WAAW,EAAe,CAAC,gBAAgB,CAChD,iBAAiB,CACpB;qBACJ,CAAC;oBACF,IAAI,YAAY,CAAC,MAAM,GAAG,CAAC,EAAE;wBACzB,OAAO;qBACV;oBACD,KAAK,CAAC,cAAc,EAAE,CAAC;oBACvB,MAAM,YAAY,GAAG,YAAY,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC;oBAChD,MAAM,MAAM,GAAG,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;oBAC1C,IAAI,mBAAmB,GAAG,YAAY,GAAG,MAAM,CAAC;oBAChD,IAAI,cAAc,GAAG,sBAAsB,CACvC,YAAY,EACZ,mBAAmB,CACtB,CAAC;oBACF,OAAO,CAAC,cAAc,CAAC,OAAO,CAAC,MAAM,EAAE;wBACnC,mBAAmB,IAAI,MAAM,CAAC;wBAC9B,cAAc,GAAG,sBAAsB,CACnC,YAAY,EACZ,mBAAmB,CACtB,CAAC;qBACL;oBACD,cAAc,CAAC,KAAK,EAAE,CAAC;oBACvB,OAAO;aACd;YACD,KAAK,CAAC,cAAc,EAAE,CAAC;YACvB,MAAM,SAAS,GAAG,sBAAsB,CAAC,IAAI,CAAC,OAAO,EAAE,SAAS,CAAC,CAAC;YAClE,aAAa,CAAC,QAAQ,GAAG,CAAC,CAAC,CAAC;YAC5B,SAAS,CAAC,QAAQ,GAAG,CAAC,CAAC;YACvB,SAAS,CAAC,KAAK,EAAE,CAAC;QACtB,CAAC,CAAC;QAEM,mBAAc,GAAG,CAAC,KAAiB,EAAQ,EAAE;YACjD,MAAM,EAAE,aAAa,EAAE,GAAG,KAAK,CAAC;YAChC,IAAI,CAAC,aAAa,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,aAA4B,CAAC,EAAE;gBAChE,MAAM,sBAAsB,GAAG,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,MAAM,EAAE,EAAE;oBACxD,IAAI,IAAI,CAAC,QAAQ,CAAC,MAAM,EAAE;wBACtB,OAAO,MAAM,CAAC,QAAQ,CAAC;qBAC1B;oBACD,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC;gBAC5B,CAAC,CAAC,CAAC;gBACH,IAAI,sBAAsB,EAAE;oBACxB,sBAAsB,CAAC,QAAQ,GAAG,CAAC,CAAC;iBACvC;aACJ;YACD,IAAI,CAAC,mBAAmB,CAAC,SAAS,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;YACxD,IAAI,CAAC,mBAAmB,CAAC,UAAU,EAAE,IAAI,CAAC,cAAc,CAAC,CAAC;QAC9D,CAAC,CAAC;IAyIN,CAAC;IA1VU,MAAM,KAAK,MAAM;QACpB,OAAO,CAAC,MAAM,CAAC,CAAC;IACpB,CAAC;IA2BD,IAAW,QAAQ;QACf,OAAO,IAAI,CAAC,SAAS,CAAC;IAC1B,CAAC;IACD,IAAW,QAAQ,CAAC,QAAkB;QAClC,IAAI,QAAQ,KAAK,IAAI,CAAC,QAAQ;YAAE,OAAO;QACvC,MAAM,GAAG,GAAG,IAAI,CAAC,QAAQ,CAAC;QAC1B,IAAI,CAAC,SAAS,GAAG,QAAQ,CAAC;QAC1B,MAAM,YAAY,GAAG,IAAI,CAAC,aAAa,CACnC,IAAI,KAAK,CAAC,QAAQ,EAAE;YAChB,OAAO,EAAE,IAAI;YACb,QAAQ,EAAE,IAAI;YACd,UAAU,EAAE,IAAI;SACnB,CAAC,CACL,CAAC;QACF,IAAI,CAAC,YAAY,EAAE;YACf,IAAI,CAAC,SAAS,GAAG,GAAG,CAAC;YACrB,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE;gBACxB,MAAM,CAAC,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;YAC3D,CAAC,CAAC,CAAC;SACN;IACL,CAAC;IAGO,WAAW,CAAC,KAAY;QAC5B,MAAM,MAAM,GAAG,KAAK,CAAC,MAAsB,CAAC;QAC5C,IAAI,OAAO,MAAM,CAAC,KAAK,KAAK,WAAW,EAAE;YACrC,OAAO;SACV;QACD,QAAQ,IAAI,CAAC,OAAO,EAAE;YAClB,KAAK,QAAQ,CAAC,CAAC;gBACX,MAAM,QAAQ,GAAG;oBACb,GAAG,IAAI,CAAC,gBAAgB,CAAC,YAAY,CAAC;iBACvB,CAAC;gBACpB,QAAQ,CAAC,OAAO,CAAC,CAAC,EAAE,EAAE,EAAE;oBACpB,EAAE,CAAC,QAAQ,GAAG,KAAK,CAAC;oBACpB,EAAE,CAAC,QAAQ,GAAG,CAAC,CAAC,CAAC;oBACjB,EAAE,CAAC,YAAY,CAAC,cAAc,EAAE,OAAO,CAAC,CAAC;gBAC7C,CAAC,CAAC,CAAC;gBACH,MAAM,CAAC,QAAQ,GAAG,IAAI,CAAC;gBACvB,MAAM,CAAC,QAAQ,GAAG,CAAC,CAAC;gBACpB,MAAM,CAAC,YAAY,CAAC,cAAc,EAAE,MAAM,CAAC,CAAC;gBAC5C,IAAI,CAAC,QAAQ,GAAG,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;gBAC/B,MAAM,CAAC,KAAK,EAAE,CAAC;gBACf,MAAM;aACT;YACD,KAAK,UAAU,CAAC,CAAC;gBACb,MAAM,QAAQ,GAAG,CAAC,GAAG,IAAI,CAAC,QAAQ,CAAC,CAAC;gBACpC,MAAM,CAAC,QAAQ,GAAG,CAAC,MAAM,CAAC,QAAQ,CAAC;gBACnC,MAAM,CAAC,YAAY,CACf,cAAc,EACd,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,CACrC,CAAC;gBACF,IAAI,MAAM,CAAC,QAAQ,EAAE;oBACjB,QAAQ,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;iBAC/B;qBAAM;oBACH,QAAQ,CAAC,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,MAAM,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,CAAC;iBAC3D;gBACD,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC;gBACzB,MAAM;aACT;YACD;gBACI,IAAI,CAAC,QAAQ,GAAG,eAAe,CAAC;gBAChC,MAAM;SACb;IACL,CAAC;IAsHO,KAAK,CAAC,aAAa;QACvB,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,MAAM,EAAE;YACtB,OAAO;SACV;QACD,QAAQ,IAAI,CAAC,OAAO,EAAE;YAClB,KAAK,QAAQ,CAAC,CAAC;gBACX,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,YAAY,CAAC,CAAC;gBACxC,IAAI,SAAmC,CAAC;gBACxC,IAAI,YAAsC,CAAC;gBAC3C,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC;gBAC7B,MAAM,OAAO,GAAG,OAAO,CAAC,GAAG,CAAC,KAAK,EAAE,MAAM,EAAE,EAAE;oBACzC,MAAM,MAAM,CAAC,cAAc,CAAC;oBAC5B,MAAM,CAAC,YAAY,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;oBACrC,MAAM,CAAC,YAAY,CACf,cAAc,EACd,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,CACrC,CAAC;oBACF,MAAM,CAAC,QAAQ,GAAG,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;oBAC3C,IAAI,MAAM,CAAC,QAAQ,EAAE;wBACjB,SAAS,GAAG,MAAM,CAAC;qBACtB;oBACD,IAAI,CAAC,YAAY,IAAI,CAAC,MAAM,CAAC,QAAQ,EAAE;wBACnC,YAAY,GAAG,MAAM,CAAC;qBACzB;gBACL,CAAC,CAAC,CAAC;gBACH,MAAM,OAAO,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;gBAC3B,IAAI,SAAS,IAAI,YAAY,EAAE;oBAC1B,CAAC,SAAS,IAAI,YAAY,CAAkB,CAAC,QAAQ,GAAG,CAAC,CAAC;iBAC9D;gBACD,IAAI,CAAC,QAAQ,GAAG,SAAS,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,eAAe,CAAC;gBAChE,MAAM;aACT;YACD,KAAK,UAAU,CAAC,CAAC;gBACb,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;gBACnC,MAAM,SAAS,GAAa,EAAE,CAAC;gBAC/B,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC;gBAC7B,MAAM,OAAO,GAAG,OAAO,CAAC,GAAG,CAAC,KAAK,EAAE,MAAM,EAAE,EAAE;oBACzC,MAAM,MAAM,CAAC,cAAc,CAAC;oBAC5B,MAAM,CAAC,YAAY,CAAC,MAAM,EAAE,UAAU,CAAC,CAAC;oBACxC,MAAM,CAAC,YAAY,CACf,cAAc,EACd,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,CACrC,CAAC;oBACF,MAAM,CAAC,QAAQ,GAAG,CAAC,CAAC;oBACpB,IAAI,MAAM,CAAC,QAAQ,EAAE;wBACjB,SAAS,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;qBAChC;gBACL,CAAC,CAAC,CAAC;gBACH,MAAM,OAAO,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;gBAC3B,IAAI,CAAC,QAAQ,GAAG,CAAC,CAAC,SAAS,CAAC,MAAM;oBAC9B,CAAC,CAAC,SAAS;oBACX,CAAC,CAAC,eAAe,CAAC;gBACtB,MAAM;aACT;YACD;gBACI,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,MAAM,EAAE,EAAE;oBAC5B,MAAM,CAAC,YAAY,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAC;oBACtC,MAAM,CAAC,QAAQ,GAAG,CAAC,CAAC;gBACxB,CAAC,CAAC,CAAC;gBACH,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,CAAC;gBAC7B,IAAI,CAAC,QAAQ,GAAG,eAAe,CAAC;gBAChC,MAAM;SACb;IACL,CAAC;IAES,MAAM;QACZ,OAAO,IAAI,CAAA;;SAEV,CAAC;IACN,CAAC;IAES,YAAY,CAAC,OAAuB;QAC1C,KAAK,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC;QAC5B,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC;QACjD,IAAI,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;IACzD,CAAC;IAES,OAAO,CAAC,OAAuB;QACrC,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC;QACvB,IAAI,OAAO,CAAC,GAAG,CAAC,SAAS,CAAC,EAAE;YACxB,IAAI,CAAC,aAAa,EAAE,CAAC;SACxB;QACD,IACI,CAAC,OAAO,CAAC,GAAG,CAAC,OAAO,CAAC,IAAI,IAAI,CAAC,KAAK,CAAC;YACpC,CAAC,OAAO,CAAC,GAAG,CAAC,YAAY,CAAC,IAAI,IAAI,CAAC,UAAU,CAAC,EAChD;YACE,IAAI,CAAC,cAAc,EAAE,CAAC;SACzB;QACD,oEAAoE;QACpE,IACI,OAAO,CAAC,GAAG,CAAC,OAAO,CAAC;YACpB,CAAC,IAAI,CAAC,KAAK,IAAI,OAAO,OAAO,CAAC,GAAG,CAAC,OAAO,CAAC,KAAK,WAAW,CAAC,EAC7D;YACE,IAAI,IAAI,CAAC,KAAK,CAAC,MAAM,EAAE;gBACnB,IAAI,CAAC,YAAY,CAAC,YAAY,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;aAC/C;iBAAM;gBACH,IAAI,CAAC,eAAe,CAAC,YAAY,CAAC,CAAC;aACtC;SACJ;IACL,CAAC;IAEO,cAAc;QAClB,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,MAAM,EAAE,EAAE;YAC5B,MAAM,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC;YAC1B,MAAM,CAAC,UAAU,GAAG,IAAI,CAAC,UAAU,CAAC;QACxC,CAAC,CAAC,CAAC;IACP,CAAC;IAEM,iBAAiB;QACpB,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;YAChB,MAAM,WAAW,GAAG,GAAS,EAAE;gBAC3B,MAAM,OAAO,GAAG;oBACZ,GAAG,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,eAAe,CAAC;iBAC/B,CAAC;gBACpB,OAAO,CAAC,MAAM,CAAC,CAAC,MAAM,EAAE,EAAE;oBACtB,MAAM,YAAY,GAAG,MAAM,CAAC,aAAa,CAAC;oBAC1C,OAAO,CAAC,CAAA,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,OAAO,CAAC,IAAI,CAAC,eAAe,CAAC,CAAA,CAAC;gBACxD,CAAC,CAAC,CAAC;gBACH,IAAI,CAAC,OAAO,GAAG,OAAO,CAAC;gBACvB,IAAI,CAAC,cAAc,EAAE,CAAC;gBACtB,IAAI,CAAC,aAAa,EAAE,CAAC;YACzB,CAAC,CAAC;YACF,IAAI,CAAC,QAAQ,GAAG,IAAI,gBAAgB,CAAC,WAAW,CAAC,CAAC;YAClD,WAAW,EAAE,CAAC;SACjB;QACD,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,IAAI,EAAE,EAAE,SAAS,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;IACpE,CAAC;IAEM,oBAAoB;QACvB,IAAI,CAAC,QAAQ,CAAC,UAAU,EAAE,CAAC;QAC3B,KAAK,CAAC,oBAAoB,EAAE,CAAC;IACjC,CAAC;CAGJ;AAlVG;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;4CACpB;AAGvB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;+CACjB;AAG1B;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;8CAClB;AAGzB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;0CACT;AAGlB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;0CACtB;AAGrB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;4CACuB;AAGlD;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;6CACnB;AAGxB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;2CAGzB","sourcesContent":["/\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n/\n\nimport {\n html,\n SpectrumElement,\n CSSResultArray,\n TemplateResult,\n property,\n PropertyValues,\n} from '@spectrum-web-components/base';\nimport type { ActionButton } from '@spectrum-web-components/action-button';\n\nimport styles from './action-group.css.js';\n\nconst EMPTY_SELECTION: string[] = [];\n\n/*\n @element sp-action-group\n * @slot - the sp-action-button elements that make up the group\n /\nexport class ActionGroup extends SpectrumElement {\n public static get styles(): CSSResultArray {\n return [styles];\n }\n\n public buttons: ActionButton[] = [];\n protected _buttonSelector = 'sp-action-button';\n\n @property({ type: Boolean, reflect: true })\n public compact = false;\n\n @property({ type: Boolean, reflect: true })\n public emphasized = false;\n\n @property({ type: Boolean, reflect: true })\n public justified = false;\n\n @property({ type: String })\n public label = '';\n\n @property({ type: Boolean, reflect: true })\n public quiet = false;\n\n @property({ type: String })\n public selects: undefined \| 'single' \| 'multiple';\n\n @property({ type: Boolean, reflect: true })\n public vertical = false;\n\n @property({ type: Array })\n public get selected(): string[] {\n return this._selected;\n }\n public set selected(selected: string[]) {\n if (selected === this.selected) return;\n const old = this.selected;\n this._selected = selected;\n const applyDefault = this.dispatchEvent(\n new Event('change', {\n bubbles: true,\n composed: true,\n cancelable: true,\n })\n );\n if (!applyDefault) {\n this._selected = old;\n this.buttons.map((button) => {\n button.selected = this.selected.includes(button.value);\n });\n }\n }\n private _selected: string[] = EMPTY_SELECTION;\n\n private handleClick(event: Event): void {\n const target = event.target as ActionButton;\n if (typeof target.value === 'undefined') {\n return;\n }\n switch (this.selects) {\n case 'single': {\n const selected = [\n ...this.querySelectorAll('[selected]'),\n ] as ActionButton[];\n selected.forEach((el) => {\n el.selected = false;\n el.tabIndex = -1;\n el.setAttribute('aria-checked', 'false');\n });\n target.selected = true;\n target.tabIndex = 0;\n target.setAttribute('aria-checked', 'true');\n this.selected = [target.value];\n target.focus();\n break;\n }\n case 'multiple': {\n const selected = [...this.selected];\n target.selected = !target.selected;\n target.setAttribute(\n 'aria-checked',\n target.selected ? 'true' : 'false'\n );\n if (target.selected) {\n selected.push(target.value);\n } else {\n selected.splice(this.selected.indexOf(target.value), 1);\n }\n this.selected = selected;\n break;\n }\n default:\n this.selected = EMPTY_SELECTION;\n break;\n }\n }\n\n private handleFocusin = (): void => {\n this.addEventListener('focusout', this.handleFocusout);\n this.addEventListener('keydown', this.handleKeydown);\n };\n\n private handleKeydown = (event: KeyboardEvent): void => {\n const { code } = event;\n if (\n ![\n 'ArrowUp',\n 'ArrowLeft',\n 'ArrowRight',\n 'ArrowDown',\n 'End',\n 'Home',\n 'PageUp',\n 'PageDown',\n ].includes(code)\n ) {\n return;\n }\n const activeElement = (this.getRootNode() as Document)\n .activeElement as ActionButton;\n / c8 ignore next 3 /\n if (!activeElement) {\n return;\n }\n let nextIndex = this.buttons.indexOf(activeElement);\n / c8 ignore next 3 */\n if (nextIndex === -1) {\n return;\n }\n const circularIndexedElement = <T extends HTMLElement>(\n list: T[],\n index: number\n ): T => list[(list.length + index) % list.length];\n const buttonFromDelta = (delta: number): void => {\n nextIndex += delta;\n while (circularIndexedElement(this.buttons, nextIndex).disabled) {\n nextIndex += delta;\n }\n };\n switch (code) {\n case 'ArrowUp':\n buttonFromDelta(-1);\n break;\n case 'ArrowLeft':\n buttonFromDelta(this.isLTR ? -1 : 1);\n break;\n case 'ArrowRight':\n buttonFromDelta(this.isLTR ? 1 : -1);\n break;\n case 'ArrowDown':\n buttonFromDelta(1);\n break;\n case 'End':\n nextIndex = this.buttons.length;\n buttonFromDelta(-1);\n break;\n case 'Home':\n nextIndex = -1;\n buttonFromDelta(1);\n break;\n case 'PageUp':\n case 'PageDown':\n default:\n const tagsSiblings = [\n ...(this.getRootNode() as Document).querySelectorAll<ActionGroup>(\n 'sp-action-group'\n ),\n ];\n if (tagsSiblings.length < 2) {\n return;\n }\n event.preventDefault();\n const currentIndex = tagsSiblings.indexOf(this);\n const offset = code === 'PageUp' ? -1 : 1;\n let nextRadioGroupIndex = currentIndex + offset;\n let nextRadioGroup = circularIndexedElement(\n tagsSiblings,\n nextRadioGroupIndex\n );\n while (!nextRadioGroup.buttons.length) {\n nextRadioGroupIndex += offset;\n nextRadioGroup = circularIndexedElement(\n tagsSiblings,\n nextRadioGroupIndex\n );\n }\n nextRadioGroup.focus();\n return;\n }\n event.preventDefault();\n const nextRadio = circularIndexedElement(this.buttons, nextIndex);\n activeElement.tabIndex = -1;\n nextRadio.tabIndex = 0;\n nextRadio.focus();\n };\n\n private handleFocusout = (event: FocusEvent): void => {\n const { relatedTarget } = event;\n if (!relatedTarget \|\| !this.contains(relatedTarget as HTMLElement)) {\n const firstButtonNonDisabled = this.buttons.find((button) => {\n if (this.selected.length) {\n return button.selected;\n }\n return !button.disabled;\n });\n if (firstButtonNonDisabled) {\n firstButtonNonDisabled.tabIndex = 0;\n }\n }\n this.removeEventListener('keydown', this.handleKeydown);\n this.removeEventListener('focusout', this.handleFocusout);\n };\n\n private async manageSelects(): Promise<void> {\n if (!this.buttons.length) {\n return;\n }\n switch (this.selects) {\n case 'single': {\n this.setAttribute('role', 'radiogroup');\n let selection: ActionButton \| undefined;\n let firstEnabled: ActionButton \| undefined;\n const options = this.buttons;\n const updates = options.map(async (option) => {\n await option.updateComplete;\n option.setAttribute('role', 'radio');\n option.setAttribute(\n 'aria-checked',\n option.selected ? 'true' : 'false'\n );\n option.tabIndex = option.selected ? 0 : -1;\n if (option.selected) {\n selection = option;\n }\n if (!firstEnabled && !option.disabled) {\n firstEnabled = option;\n }\n });\n await Promise.all(updates);\n if (selection \|\| firstEnabled) {\n ((selection \|\| firstEnabled) as ActionButton).tabIndex = 0;\n }\n this.selected = selection ? [selection.value] : EMPTY_SELECTION;\n break;\n }\n case 'multiple': {\n this.setAttribute('role', 'group');\n const selection: string[] = [];\n const options = this.buttons;\n const updates = options.map(async (option) => {\n await option.updateComplete;\n option.setAttribute('role', 'checkbox');\n option.setAttribute(\n 'aria-checked',\n option.selected ? 'true' : 'false'\n );\n option.tabIndex = 0;\n if (option.selected) {\n selection.push(option.value);\n }\n });\n await Promise.all(updates);\n this.selected = !!selection.length\n ? selection\n : EMPTY_SELECTION;\n break;\n }\n default:\n this.buttons.forEach((option) => {\n option.setAttribute('role', 'button');\n option.tabIndex = 0;\n });\n this.removeAttribute('role');\n this.selected = EMPTY_SELECTION;\n break;\n }\n }\n\n protected render(): TemplateResult {\n return html`\n <slot role=\"presentation\"></slot>\n `;\n }\n\n protected firstUpdated(changes: PropertyValues): void {\n super.firstUpdated(changes);\n this.addEventListener('click', this.handleClick);\n this.addEventListener('focusin', this.handleFocusin);\n }\n\n protected updated(changes: PropertyValues): void {\n super.updated(changes);\n if (changes.has('selects')) {\n this.manageSelects();\n }\n if (\n (changes.has('quiet') && this.quiet) \|\|\n (changes.has('emphasized') && this.emphasized)\n ) {\n this.manageChildren();\n }\n // Update `aria-label` when `label` available or not first `updated`\n if (\n changes.has('label') &&\n (this.label \|\| typeof changes.get('label') !== 'undefined')\n ) {\n if (this.label.length) {\n this.setAttribute('aria-label', this.label);\n } else {\n this.removeAttribute('aria-label');\n }\n }\n }\n\n private manageChildren(): void {\n this.buttons.forEach((button) => {\n button.quiet = this.quiet;\n button.emphasized = this.emphasized;\n });\n }\n\n public connectedCallback(): void {\n super.connectedCallback();\n if (!this.observer) {\n const findButtons = (): void => {\n const buttons = [\n ...this.querySelectorAll(this._buttonSelector),\n ] as ActionButton[];\n buttons.filter((button) => {\n const buttonParent = button.parentElement;\n return !buttonParent?.closest(this._buttonSelector);\n });\n this.buttons = buttons;\n this.manageChildren();\n this.manageSelects();\n };\n this.observer = new MutationObserver(findButtons);\n findButtons();\n }\n this.observer.observe(this, { childList: true, subtree: true });\n }\n\n public disconnectedCallback(): void {\n this.observer.disconnect();\n super.disconnectedCallback();\n }\n\n private observer!: MutationObserver;\n}\n"]}
1	+ {"version":3,"file":"ActionGroup.js","sourceRoot":"","sources":["ActionGroup.ts"],"names":[],"mappings":"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","sourcesContent":["/\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n/\n\nimport {\n html,\n SpectrumElement,\n CSSResultArray,\n TemplateResult,\n property,\n PropertyValues,\n} from '@spectrum-web-components/base';\nimport type { ActionButton } from '@spectrum-web-components/action-button';\n\nimport styles from './action-group.css.js';\n\nconst EMPTY_SELECTION: string[] = [];\n\n/*\n @element sp-action-group\n * @slot - the sp-action-button elements that make up the group\n /\nexport class ActionGroup extends SpectrumElement {\n public static get styles(): CSSResultArray {\n return [styles];\n }\n\n public buttons: ActionButton[] = [];\n protected _buttonSelector = 'sp-action-button';\n\n @property({ type: Boolean, reflect: true })\n public compact = false;\n\n @property({ type: Boolean, reflect: true })\n public emphasized = false;\n\n @property({ type: Boolean, reflect: true })\n public justified = false;\n\n @property({ type: String })\n public label = '';\n\n @property({ type: Boolean, reflect: true })\n public quiet = false;\n\n @property({ type: String })\n public selects: undefined \| 'single' \| 'multiple';\n\n @property({ type: Boolean, reflect: true })\n public vertical = false;\n\n @property({ type: Array })\n public get selected(): string[] {\n return this._selected;\n }\n public set selected(selected: string[]) {\n if (selected === this.selected) return;\n const old = this.selected;\n this._selected = selected;\n const applyDefault = this.dispatchEvent(\n new Event('change', {\n bubbles: true,\n composed: true,\n cancelable: true,\n })\n );\n if (!applyDefault) {\n this._selected = old;\n this.buttons.map((button) => {\n button.selected = this.selected.includes(button.value);\n });\n }\n }\n private _selected: string[] = EMPTY_SELECTION;\n\n public focus(options?: FocusOptions): void {\n if (!this.buttons.length) {\n return;\n }\n const firstButtonNonDisabled = this.buttons.find((button) => {\n if (this.selected) {\n return button.selected;\n }\n return !button.disabled;\n });\n if (firstButtonNonDisabled) {\n firstButtonNonDisabled.focus(options);\n }\n }\n\n private handleClick(event: Event): void {\n const target = event.target as ActionButton;\n if (typeof target.value === 'undefined') {\n return;\n }\n switch (this.selects) {\n case 'single': {\n const selected = [\n ...this.querySelectorAll('[selected]'),\n ] as ActionButton[];\n selected.forEach((el) => {\n el.selected = false;\n el.tabIndex = -1;\n el.setAttribute('aria-checked', 'false');\n });\n target.selected = true;\n target.tabIndex = 0;\n target.setAttribute('aria-checked', 'true');\n this.selected = [target.value];\n target.focus();\n break;\n }\n case 'multiple': {\n const selected = [...this.selected];\n target.selected = !target.selected;\n target.setAttribute(\n 'aria-checked',\n target.selected ? 'true' : 'false'\n );\n if (target.selected) {\n selected.push(target.value);\n } else {\n selected.splice(this.selected.indexOf(target.value), 1);\n }\n this.selected = selected;\n break;\n }\n default:\n this.selected = EMPTY_SELECTION;\n break;\n }\n }\n\n private handleFocusin = (): void => {\n this.addEventListener('focusout', this.handleFocusout);\n this.addEventListener('keydown', this.handleKeydown);\n };\n\n private handleKeydown = (event: KeyboardEvent): void => {\n const { code } = event;\n if (\n ![\n 'ArrowUp',\n 'ArrowLeft',\n 'ArrowRight',\n 'ArrowDown',\n 'End',\n 'Home',\n 'PageUp',\n 'PageDown',\n ].includes(code)\n ) {\n return;\n }\n const activeElement = (this.getRootNode() as Document)\n .activeElement as ActionButton;\n / c8 ignore next 3 /\n if (!activeElement) {\n return;\n }\n let nextIndex = this.buttons.indexOf(activeElement);\n / c8 ignore next 3 */\n if (nextIndex === -1) {\n return;\n }\n const circularIndexedElement = <T extends HTMLElement>(\n list: T[],\n index: number\n ): T => list[(list.length + index) % list.length];\n const buttonFromDelta = (delta: number): void => {\n nextIndex += delta;\n while (circularIndexedElement(this.buttons, nextIndex).disabled) {\n nextIndex += delta;\n }\n };\n switch (code) {\n case 'ArrowUp':\n buttonFromDelta(-1);\n break;\n case 'ArrowLeft':\n buttonFromDelta(this.isLTR ? -1 : 1);\n break;\n case 'ArrowRight':\n buttonFromDelta(this.isLTR ? 1 : -1);\n break;\n case 'ArrowDown':\n buttonFromDelta(1);\n break;\n case 'End':\n nextIndex = this.buttons.length;\n buttonFromDelta(-1);\n break;\n case 'Home':\n nextIndex = -1;\n buttonFromDelta(1);\n break;\n case 'PageUp':\n case 'PageDown':\n default:\n const tagsSiblings = [\n ...(\n this.getRootNode() as Document\n ).querySelectorAll<ActionGroup>('sp-action-group'),\n ];\n if (tagsSiblings.length < 2) {\n return;\n }\n event.preventDefault();\n const currentIndex = tagsSiblings.indexOf(this);\n const offset = code === 'PageUp' ? -1 : 1;\n let nextRadioGroupIndex = currentIndex + offset;\n let nextRadioGroup = circularIndexedElement(\n tagsSiblings,\n nextRadioGroupIndex\n );\n while (!nextRadioGroup.buttons.length) {\n nextRadioGroupIndex += offset;\n nextRadioGroup = circularIndexedElement(\n tagsSiblings,\n nextRadioGroupIndex\n );\n }\n nextRadioGroup.focus();\n return;\n }\n event.preventDefault();\n const nextRadio = circularIndexedElement(this.buttons, nextIndex);\n activeElement.tabIndex = -1;\n nextRadio.tabIndex = 0;\n nextRadio.focus();\n };\n\n private handleFocusout = (event: FocusEvent): void => {\n const { relatedTarget } = event;\n if (!relatedTarget \|\| !this.contains(relatedTarget as HTMLElement)) {\n const firstButtonNonDisabled = this.buttons.find((button) => {\n if (this.selected.length) {\n return button.selected;\n }\n return !button.disabled;\n });\n if (firstButtonNonDisabled) {\n firstButtonNonDisabled.tabIndex = 0;\n }\n }\n this.removeEventListener('keydown', this.handleKeydown);\n this.removeEventListener('focusout', this.handleFocusout);\n };\n\n private async manageSelects(): Promise<void> {\n if (!this.buttons.length) {\n return;\n }\n switch (this.selects) {\n case 'single': {\n this.setAttribute('role', 'radiogroup');\n let selection: ActionButton \| undefined;\n let firstEnabled: ActionButton \| undefined;\n const options = this.buttons;\n const updates = options.map(async (option) => {\n await option.updateComplete;\n option.setAttribute('role', 'radio');\n option.setAttribute(\n 'aria-checked',\n option.selected ? 'true' : 'false'\n );\n option.tabIndex = option.selected ? 0 : -1;\n if (option.selected) {\n selection = option;\n }\n if (!firstEnabled && !option.disabled) {\n firstEnabled = option;\n }\n });\n await Promise.all(updates);\n if (selection \|\| firstEnabled) {\n ((selection \|\| firstEnabled) as ActionButton).tabIndex = 0;\n }\n this.selected = selection ? [selection.value] : EMPTY_SELECTION;\n break;\n }\n case 'multiple': {\n this.setAttribute('role', 'group');\n const selection: string[] = [];\n const options = this.buttons;\n const updates = options.map(async (option) => {\n await option.updateComplete;\n option.setAttribute('role', 'checkbox');\n option.setAttribute(\n 'aria-checked',\n option.selected ? 'true' : 'false'\n );\n option.tabIndex = 0;\n if (option.selected) {\n selection.push(option.value);\n }\n });\n await Promise.all(updates);\n this.selected = !!selection.length\n ? selection\n : EMPTY_SELECTION;\n break;\n }\n default:\n this.buttons.forEach((option) => {\n option.setAttribute('role', 'button');\n option.tabIndex = 0;\n });\n this.removeAttribute('role');\n this.selected = EMPTY_SELECTION;\n break;\n }\n }\n\n protected render(): TemplateResult {\n return html`\n <slot role=\"presentation\"></slot>\n `;\n }\n\n protected firstUpdated(changes: PropertyValues): void {\n super.firstUpdated(changes);\n this.addEventListener('click', this.handleClick);\n this.addEventListener('focusin', this.handleFocusin);\n }\n\n protected updated(changes: PropertyValues): void {\n super.updated(changes);\n if (changes.has('selects')) {\n this.manageSelects();\n }\n if (\n (changes.has('quiet') && this.quiet) \|\|\n (changes.has('emphasized') && this.emphasized)\n ) {\n this.manageChildren();\n }\n // Update `aria-label` when `label` available or not first `updated`\n if (\n changes.has('label') &&\n (this.label \|\| typeof changes.get('label') !== 'undefined')\n ) {\n if (this.label.length) {\n this.setAttribute('aria-label', this.label);\n } else {\n this.removeAttribute('aria-label');\n }\n }\n }\n\n private manageChildren(): void {\n this.buttons.forEach((button) => {\n button.quiet = this.quiet;\n button.emphasized = this.emphasized;\n });\n }\n\n public connectedCallback(): void {\n super.connectedCallback();\n if (!this.observer) {\n const findButtons = (): void => {\n const buttons = [\n ...this.querySelectorAll(this._buttonSelector),\n ] as ActionButton[];\n buttons.filter((button) => {\n const buttonParent = button.parentElement;\n return !buttonParent?.closest(this._buttonSelector);\n });\n this.buttons = buttons;\n this.manageChildren();\n this.manageSelects();\n };\n this.observer = new MutationObserver(findButtons);\n findButtons();\n }\n this.observer.observe(this, { childList: true, subtree: true });\n }\n\n public disconnectedCallback(): void {\n this.observer.disconnect();\n super.disconnectedCallback();\n }\n\n private observer!: MutationObserver;\n}\n"]}

package/stories/action-group-tooltip.stories.js CHANGED Viewed

@@ -10,7 +10,7 @@ OF ANY KIND, either express or implied. See the License for the specific languag
 governing permissions and limitations under the License.
 */
 import { html } from '@spectrum-web-components/base';
-import { spreadProps } from '../../../test/lit-helpers.js';
+import { spreadProps } from '@open-wc/lit-helpers';
 import '../sp-action-group.js';
 import '@spectrum-web-components/action-button/sp-action-button.js';
 import '@spectrum-web-components/overlay/overlay-trigger.js';

package/stories/action-group-tooltip.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"action-group-tooltip.stories.js","sourceRoot":"","sources":["action-group-tooltip.stories.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;EAUE;AAEF,OAAO,EAAE,IAAI,EAAkB,MAAM,+BAA+B,CAAC;AACrE,OAAO,EAAE,WAAW,EAAE,MAAM,~~8BAA8B~~,CAAC;~~AAE3D~~,OAAO,uBAAuB,CAAC;AAC/B,OAAO,4DAA4D,CAAC;AACpE,OAAO,qDAAqD,CAAC;AAC7D,OAAO,gDAAgD,CAAC;AACxD,OAAO,qEAAqE,CAAC;AAC7E,OAAO,+DAA+D,CAAC;AACvE,OAAO,wEAAwE,CAAC;AAGhF,eAAe;IACX,KAAK,EAAE,uBAAuB;IAC9B,SAAS,EAAE,iBAAiB;IAC5B,IAAI,EAAE;QACF,OAAO,EAAE,KAAK;QACd,UAAU,EAAE,KAAK;QACjB,SAAS,EAAE,KAAK;QAChB,KAAK,EAAE,KAAK;QACZ,QAAQ,EAAE,KAAK;QACf,OAAO,EAAE,MAAM;KAClB;IACD,QAAQ,EAAE;QACN,OAAO,EAAE;YACL,IAAI,EAAE,SAAS;YACf,WAAW,EACP,mFAAmF;YACvF,IAAI,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,QAAQ,EAAE,KAAK,EAAE;YAC1C,KAAK,EAAE;gBACH,IAAI,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE;gBAC5B,YAAY,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE;aACnC;YACD,OAAO,EAAE;gBACL,IAAI,EAAE,SAAS;aAClB;SACJ;QACD,UAAU,EAAE;YACR,IAAI,EAAE,YAAY;YAClB,IAAI,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,QAAQ,EAAE,KAAK,EAAE;YAC1C,KAAK,EAAE;gBACH,IAAI,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE;gBAC5B,YAAY,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE;aACnC;YACD,OAAO,EAAE;gBACL,IAAI,EAAE,SAAS;aAClB;SACJ;QACD,SAAS,EAAE;YACP,IAAI,EAAE,WAAW;YACjB,WAAW,EACP,4EAA4E;YAChF,IAAI,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,QAAQ,EAAE,KAAK,EAAE;YAC1C,KAAK,EAAE;gBACH,IAAI,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE;gBAC5B,YAAY,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE;aACnC;YACD,OAAO,EAAE;gBACL,IAAI,EAAE,SAAS;aAClB;SACJ;QACD,KAAK,EAAE;YACH,IAAI,EAAE,OAAO;YACb,IAAI,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,QAAQ,EAAE,KAAK,EAAE;YAC1C,KAAK,EAAE;gBACH,IAAI,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE;gBAC5B,YAAY,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE;aACnC;YACD,OAAO,EAAE;gBACL,IAAI,EAAE,SAAS;aAClB;SACJ;QACD,QAAQ,EAAE;YACN,IAAI,EAAE,UAAU;YAChB,WAAW,EAAE,8CAA8C;YAC3D,IAAI,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,QAAQ,EAAE,KAAK,EAAE;YAC1C,KAAK,EAAE;gBACH,IAAI,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE;gBAC5B,YAAY,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE;aACnC;YACD,OAAO,EAAE;gBACL,IAAI,EAAE,SAAS;aAClB;SACJ;QACD,OAAO,EAAE;YACL,IAAI,EAAE,SAAS;YACf,WAAW,EACP,iFAAiF;YACrF,KAAK,EAAE;gBACH,YAAY,EAAE,EAAE,OAAO,EAAE,EAAE,EAAE;aAChC;YACD,OAAO,EAAE;gBACL,IAAI,EAAE,cAAc;gBACpB,OAAO,EAAE,CAAC,MAAM,EAAE,QAAQ,EAAE,UAAU,CAAC;aAC1C;SACJ;KACJ;CACJ,CAAC;~~AAYF~~,MAAM,QAAQ,GAAG,CAAC,IAAgB,EAAkB,EAAE;IAClD,OAAO,IAAI,CAAA;;;kBAGG,WAAW,CAAC,IAAI,CAAC;sBACb,CAAC,EAAE,MAAM,EAAmC,EAAE,EAAE;QACtD,MAAM,IAAI,GAAG,MAAM,CAAC,kBAAoC,CAAC;QACzD,IAAI,CAAC,WAAW,GAAG,aAAa,IAAI,CAAC,SAAS,CAC1C,MAAM,CAAC,QAAQ,CAClB,EAAE,CAAC;IACR,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;UAyBH,IAAI,CAAC,OAAO,IAAI,MAAM;QACpB,CAAC,CAAC,IAAI,CAAA,EAAE;QACR,CAAC,CAAC,IAAI,CAAA;;eAEH;KACV,CAAC;AACN,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,IAAgB,EAAkB,EAAE,CAC9D,QAAQ,CAAC,IAAI,CAAC,CAAC;AACnB,aAAa,CAAC,IAAI,GAAG;IACjB,OAAO,EAAE,IAAI;IACb,UAAU,EAAE,IAAI;IAChB,OAAO,EAAE,QAAQ;CACpB,CAAC;AAEF,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC,IAAgB,EAAkB,EAAE,CAChE,QAAQ,CAAC,IAAI,CAAC,CAAC;AACnB,eAAe,CAAC,IAAI,GAAG;IACnB,OAAO,EAAE,IAAI;IACb,UAAU,EAAE,IAAI;IAChB,OAAO,EAAE,UAAU;CACtB,CAAC;AAEF,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,IAAgB,EAAkB,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;AAC9E,SAAS,CAAC,IAAI,GAAG;IACb,OAAO,EAAE,IAAI;IACb,UAAU,EAAE,IAAI;IAChB,SAAS,EAAE,IAAI;CAClB,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,IAAgB,EAAkB,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;AAC7E,QAAQ,CAAC,IAAI,GAAG;IACZ,OAAO,EAAE,IAAI;IACb,UAAU,EAAE,IAAI;IAChB,QAAQ,EAAE,IAAI;CACjB,CAAC","sourcesContent":["/\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n/\n\nimport { html, TemplateResult } from '@spectrum-web-components/base';\nimport { spreadProps } from '~~../../../test~~/lit-helpers~~.js~~';\n\nimport '../sp-action-group.js';\nimport '@spectrum-web-components/action-button/sp-action-button.js';\nimport '@spectrum-web-components/overlay/overlay-trigger.js';\nimport '@spectrum-web-components/tooltip/sp-tooltip.js';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-properties.js';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-info.js';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-view-all-tags.js';\nimport { ActionGroup } from '../src/ActionGroup.js';\n\nexport default {\n title: 'Action Group/Tooltips',\n component: 'sp-action-group',\n args: {\n compact: false,\n emphasized: false,\n justified: false,\n quiet: false,\n vertical: false,\n selects: 'none',\n },\n argTypes: {\n compact: {\n name: 'compact',\n description:\n 'Visually joins the buttons together to clarify their relationship to one another.',\n type: { name: 'boolean', required: false },\n table: {\n type: { summary: 'boolean' },\n defaultValue: { summary: false },\n },\n control: {\n type: 'boolean',\n },\n },\n emphasized: {\n name: 'emphasized',\n type: { name: 'boolean', required: false },\n table: {\n type: { summary: 'boolean' },\n defaultValue: { summary: false },\n },\n control: {\n type: 'boolean',\n },\n },\n justified: {\n name: 'justified',\n description:\n 'Aligns the action group items to use all the available space on that line.',\n type: { name: 'boolean', required: false },\n table: {\n type: { summary: 'boolean' },\n defaultValue: { summary: false },\n },\n control: {\n type: 'boolean',\n },\n },\n quiet: {\n name: 'quiet',\n type: { name: 'boolean', required: false },\n table: {\n type: { summary: 'boolean' },\n defaultValue: { summary: false },\n },\n control: {\n type: 'boolean',\n },\n },\n vertical: {\n name: 'vertical',\n description: 'Changes the orientation of the action group.',\n type: { name: 'boolean', required: false },\n table: {\n type: { summary: 'boolean' },\n defaultValue: { summary: false },\n },\n control: {\n type: 'boolean',\n },\n },\n selects: {\n name: 'selects',\n description:\n 'Whether the elements selects its children and how many it can select at a time.',\n table: {\n defaultValue: { summary: '' },\n },\n control: {\n type: 'inline-radio',\n options: ['none', 'single', 'multiple'],\n },\n },\n },\n};\n\ninterface Properties {\n compact?: boolean;\n emphasized?: boolean;\n justified?: boolean;\n quiet?: boolean;\n vertical?: boolean;\n selects?: 'none' \| 'single' \| 'multiple';\n ~~[prop: string]: any;\n~~}\n\nconst template = (args: Properties): TemplateResult => {\n return html`\n <sp-action-group\n label=\"Favorite Color\"\n ...=${spreadProps(args)}\n @change=${({ target }: Event & { target: ActionGroup }) => {\n const next = target.nextElementSibling as HTMLDivElement;\n next.textContent = `Selected: ${JSON.stringify(\n target.selected\n )}`;\n }}\n >\n <overlay-trigger>\n <sp-action-button slot=\"trigger\">Red</sp-action-button>\n <sp-tooltip slot=\"hover-content\">\n This is a cool color.\n </sp-tooltip>\n </overlay-trigger>\n <overlay-trigger>\n <sp-action-button slot=\"trigger\">Green</sp-action-button>\n <sp-tooltip slot=\"hover-content\">\n You wouldn't be wrong.\n </sp-tooltip>\n </overlay-trigger>\n <overlay-trigger>\n <sp-action-button slot=\"trigger\" value=\"blue\" selected>\n Blue\n </sp-action-button>\n <sp-tooltip slot=\"hover-content\">The sky in spring.</sp-tooltip>\n </overlay-trigger>\n <overlay-trigger>\n <sp-action-button slot=\"trigger\">Yellow</sp-action-button>\n <sp-tooltip slot=\"hover-content\">The sun at noon.</sp-tooltip>\n </overlay-trigger>\n </sp-action-group>\n ${args.selects == 'none'\n ? html``\n : html`\n <div>Selected:</div>\n `}\n `;\n};\n\nexport const selectsSingle = (args: Properties): TemplateResult =>\n template(args);\nselectsSingle.args = {\n compact: true,\n emphasized: true,\n selects: 'single',\n};\n\nexport const selectsMultiple = (args: Properties): TemplateResult =>\n template(args);\nselectsMultiple.args = {\n compact: true,\n emphasized: true,\n selects: 'multiple',\n};\n\nexport const justified = (args: Properties): TemplateResult => template(args);\njustified.args = {\n compact: true,\n emphasized: true,\n justified: true,\n};\n\nexport const vertical = (args: Properties): TemplateResult => template(args);\nvertical.args = {\n compact: true,\n emphasized: true,\n vertical: true,\n};\n"]}
1	+ {"version":3,"file":"action-group-tooltip.stories.js","sourceRoot":"","sources":["action-group-tooltip.stories.ts"],"names":[],"mappings":"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","sourcesContent":["/\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n/\n\nimport { html, TemplateResult } from '@spectrum-web-components/base';\nimport { spreadProps } from '@open-wc/lit-helpers';\n\nimport '../sp-action-group.js';\nimport '@spectrum-web-components/action-button/sp-action-button.js';\nimport '@spectrum-web-components/overlay/overlay-trigger.js';\nimport '@spectrum-web-components/tooltip/sp-tooltip.js';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-properties.js';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-info.js';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-view-all-tags.js';\nimport { ActionGroup } from '../src/ActionGroup.js';\n\nexport default {\n title: 'Action Group/Tooltips',\n component: 'sp-action-group',\n args: {\n compact: false,\n emphasized: false,\n justified: false,\n quiet: false,\n vertical: false,\n selects: 'none',\n },\n argTypes: {\n compact: {\n name: 'compact',\n description:\n 'Visually joins the buttons together to clarify their relationship to one another.',\n type: { name: 'boolean', required: false },\n table: {\n type: { summary: 'boolean' },\n defaultValue: { summary: false },\n },\n control: {\n type: 'boolean',\n },\n },\n emphasized: {\n name: 'emphasized',\n type: { name: 'boolean', required: false },\n table: {\n type: { summary: 'boolean' },\n defaultValue: { summary: false },\n },\n control: {\n type: 'boolean',\n },\n },\n justified: {\n name: 'justified',\n description:\n 'Aligns the action group items to use all the available space on that line.',\n type: { name: 'boolean', required: false },\n table: {\n type: { summary: 'boolean' },\n defaultValue: { summary: false },\n },\n control: {\n type: 'boolean',\n },\n },\n quiet: {\n name: 'quiet',\n type: { name: 'boolean', required: false },\n table: {\n type: { summary: 'boolean' },\n defaultValue: { summary: false },\n },\n control: {\n type: 'boolean',\n },\n },\n vertical: {\n name: 'vertical',\n description: 'Changes the orientation of the action group.',\n type: { name: 'boolean', required: false },\n table: {\n type: { summary: 'boolean' },\n defaultValue: { summary: false },\n },\n control: {\n type: 'boolean',\n },\n },\n selects: {\n name: 'selects',\n description:\n 'Whether the elements selects its children and how many it can select at a time.',\n table: {\n defaultValue: { summary: '' },\n },\n control: {\n type: 'inline-radio',\n options: ['none', 'single', 'multiple'],\n },\n },\n },\n};\n\ninterface Properties {\n compact?: boolean;\n emphasized?: boolean;\n justified?: boolean;\n quiet?: boolean;\n vertical?: boolean;\n selects?: 'none' \| 'single' \| 'multiple';\n}\n\nconst template = (args: Properties): TemplateResult => {\n return html`\n <sp-action-group\n label=\"Favorite Color\"\n ...=${spreadProps(args)}\n @change=${({ target }: Event & { target: ActionGroup }) => {\n const next = target.nextElementSibling as HTMLDivElement;\n next.textContent = `Selected: ${JSON.stringify(\n target.selected\n )}`;\n }}\n >\n <overlay-trigger>\n <sp-action-button slot=\"trigger\">Red</sp-action-button>\n <sp-tooltip slot=\"hover-content\">\n This is a cool color.\n </sp-tooltip>\n </overlay-trigger>\n <overlay-trigger>\n <sp-action-button slot=\"trigger\">Green</sp-action-button>\n <sp-tooltip slot=\"hover-content\">\n You wouldn't be wrong.\n </sp-tooltip>\n </overlay-trigger>\n <overlay-trigger>\n <sp-action-button slot=\"trigger\" value=\"blue\" selected>\n Blue\n </sp-action-button>\n <sp-tooltip slot=\"hover-content\">The sky in spring.</sp-tooltip>\n </overlay-trigger>\n <overlay-trigger>\n <sp-action-button slot=\"trigger\">Yellow</sp-action-button>\n <sp-tooltip slot=\"hover-content\">The sun at noon.</sp-tooltip>\n </overlay-trigger>\n </sp-action-group>\n ${args.selects == 'none'\n ? html``\n : html`\n <div>Selected:</div>\n `}\n `;\n};\n\nexport const selectsSingle = (args: Properties): TemplateResult =>\n template(args);\nselectsSingle.args = {\n compact: true,\n emphasized: true,\n selects: 'single',\n};\n\nexport const selectsMultiple = (args: Properties): TemplateResult =>\n template(args);\nselectsMultiple.args = {\n compact: true,\n emphasized: true,\n selects: 'multiple',\n};\n\nexport const justified = (args: Properties): TemplateResult => template(args);\njustified.args = {\n compact: true,\n emphasized: true,\n justified: true,\n};\n\nexport const vertical = (args: Properties): TemplateResult => template(args);\nvertical.args = {\n compact: true,\n emphasized: true,\n vertical: true,\n};\n"]}

package/stories/action-group.stories.js CHANGED Viewed

@@ -10,7 +10,7 @@ OF ANY KIND, either express or implied. See the License for the specific languag
 governing permissions and limitations under the License.
 */
 import { html } from '@spectrum-web-components/base';
-import { spreadProps } from '../../../test/lit-helpers.js';
+import { spreadProps } from '@open-wc/lit-helpers';
 import '../sp-action-group.js';
 import '@spectrum-web-components/action-button/sp-action-button.js';
 import '@spectrum-web-components/overlay/overlay-trigger.js';
@@ -91,7 +91,7 @@ export default {
 };
 function renderIconButtons(args) {
     return html `
-        <sp-action-group ${spreadProps(args)}>
+        <sp-action-group ...=${spreadProps(args)}>
             <sp-action-button label="Properties">
                 <sp-icon-properties slot="icon"></sp-icon-properties>
             </sp-action-button>
@@ -106,7 +106,7 @@ function renderIconButtons(args) {
 }
 function renderButtons(args) {
     return html `
-        <sp-action-group ${spreadProps(args)}>
+        <sp-action-group ...=${spreadProps(args)}>
             <sp-action-button>Button 1</sp-action-button>
             <sp-action-button>Longer Button 2</sp-action-button>
             <sp-action-button>Short 3</sp-action-button>
@@ -140,7 +140,7 @@ export const selectsSingle = (args) => {
 export const selectsMultiple = (args) => {
     return html `
         <sp-action-group
-            ${spreadProps(args)}
+            ...=${spreadProps(args)}
             label="Favorite Colors"
             selects="multiple"
             @change=${({ target }) => {
@@ -159,7 +159,7 @@ export const selectsMultiple = (args) => {
 export const selectsMultipleWithTooltips = (args) => {
     return html `
         <sp-action-group
-            ${spreadProps(args)}
+            ...=${spreadProps(args)}
             label="Favorite Color"
             selects="multiple"
             @change=${({ target }) => {

package/stories/action-group.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"action-group.stories.js","sourceRoot":"","sources":["action-group.stories.ts"],"names":[],"mappings":"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","sourcesContent":["/\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n/\n\nimport { html, TemplateResult } from '@spectrum-web-components/base';\nimport { spreadProps } from '../../../test/lit-helpers.js';\n\nimport '../sp-action-group.js';\nimport '@spectrum-web-components/action-button/sp-action-button.js';\nimport '@spectrum-web-components/overlay/overlay-trigger.js';\nimport '@spectrum-web-components/tooltip/sp-tooltip.js';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-properties.js';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-info.js';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-view-all-tags.js';\nimport { ActionGroup } from '../src/ActionGroup.js';\n\nexport default {\n title: 'Action Group',\n component: 'sp-action-group',\n args: {\n compact: false,\n emphasized: false,\n justified: false,\n quiet: false,\n vertical: false,\n },\n argTypes: {\n compact: {\n name: 'compact',\n description:\n 'Visually joins the buttons together to clarify their relationship to one another.',\n type: { name: 'boolean', required: false },\n table: {\n type: { summary: 'boolean' },\n defaultValue: { summary: false },\n },\n control: {\n type: 'boolean',\n },\n },\n emphasized: {\n name: 'emphasized',\n type: { name: 'boolean', required: false },\n table: {\n type: { summary: 'boolean' },\n defaultValue: { summary: false },\n },\n control: {\n type: 'boolean',\n },\n },\n justified: {\n name: 'justified',\n description:\n 'Aligns the action group items to use all the available space on that line.',\n type: { name: 'boolean', required: false },\n table: {\n type: { summary: 'boolean' },\n defaultValue: { summary: false },\n },\n control: {\n type: 'boolean',\n },\n },\n quiet: {\n name: 'quiet',\n type: { name: 'boolean', required: false },\n table: {\n type: { summary: 'boolean' },\n defaultValue: { summary: false },\n },\n control: {\n type: 'boolean',\n },\n },\n vertical: {\n name: 'vertical',\n description: 'Changes the orientation of the action group.',\n type: { name: 'boolean', required: false },\n table: {\n type: { summary: 'boolean' },\n defaultValue: { summary: false },\n },\n control: {\n type: 'boolean',\n },\n },\n },\n};\n\ninterface Properties {\n compact?: boolean;\n emphasized?: boolean;\n justified?: boolean;\n quiet?: boolean;\n vertical?: boolean;\n [prop: string]: any;\n}\n\nfunction renderIconButtons(args: Properties): TemplateResult {\n return html`\n <sp-action-group ${spreadProps(args)}>\n <sp-action-button label=\"Properties\">\n <sp-icon-properties slot=\"icon\"></sp-icon-properties>\n </sp-action-button>\n <sp-action-button label=\"Info\">\n <sp-icon-info slot=\"icon\"></sp-icon-info>\n </sp-action-button>\n <sp-action-button label=\"View All Tags\">\n <sp-icon-view-all-tags slot=\"icon\"></sp-icon-view-all-tags>\n </sp-action-button>\n </sp-action-group>\n `;\n}\n\nfunction renderButtons(args: Properties): TemplateResult {\n return html`\n <sp-action-group ${spreadProps(args)}>\n <sp-action-button>Button 1</sp-action-button>\n <sp-action-button>Longer Button 2</sp-action-button>\n <sp-action-button>Short 3</sp-action-button>\n </sp-action-group>\n `;\n}\n\nexport const Default = (args: Properties): TemplateResult =>\n renderButtons(args);\n\nexport const selectsSingle = (args: Properties): TemplateResult => {\n return html`\n <sp-action-group\n ?compact=${args.compact}\n ?emphasized=${args.emphasized}\n ?quiet=${args.quiet}\n ?justified=${args.justified}\n ?vertical=${args.vertical}\n label=\"Favorite Color\"\n selects=\"single\"\n @change=${({ target }: Event & { target: ActionGroup }) => {\n const next = target.nextElementSibling as HTMLDivElement;\n next.textContent = `Selected: ${JSON.stringify(\n target.selected\n )}`;\n }}\n >\n <sp-action-button>Red</sp-action-button>\n <sp-action-button>Green</sp-action-button>\n <sp-action-button>Blue</sp-action-button>\n <sp-action-button selected>Yellow</sp-action-button>\n </sp-action-group>\n <div>Selected:</div>\n `;\n};\n\nexport const selectsMultiple = (args: Properties): TemplateResult => {\n return html`\n <sp-action-group\n ${spreadProps(args)}\n label=\"Favorite Colors\"\n selects=\"multiple\"\n @change=${({ target }: Event & { target: ActionGroup }) => {\n const next = target.nextElementSibling as HTMLDivElement;\n next.textContent = `Selected: ${JSON.stringify(\n target.selected\n )}`;\n }}\n >\n <sp-action-button>Red</sp-action-button>\n <sp-action-button selected>Green</sp-action-button>\n <sp-action-button selected>Blue</sp-action-button>\n <sp-action-button>Yellow</sp-action-button>\n </sp-action-group>\n <div>Selected:</div>\n `;\n};\n\nexport const selectsMultipleWithTooltips = (\n args: Properties\n): TemplateResult => {\n return html`\n <sp-action-group\n ${spreadProps(args)}\n label=\"Favorite Color\"\n selects=\"multiple\"\n @change=${({ target }: Event & { target: ActionGroup }) => {\n const next = target.nextElementSibling as HTMLDivElement;\n next.textContent = `Selected: ${JSON.stringify(\n target.selected\n )}`;\n }}\n >\n <overlay-trigger>\n <sp-action-button slot=\"trigger\">Red</sp-action-button>\n <sp-tooltip slot=\"hover-content\">\n This is a cool color.\n </sp-tooltip>\n </overlay-trigger>\n <overlay-trigger>\n <sp-action-button slot=\"trigger\">Green</sp-action-button>\n <sp-tooltip slot=\"hover-content\">\n You wouldn't be wrong.\n </sp-tooltip>\n </overlay-trigger>\n <overlay-trigger>\n <sp-action-button slot=\"trigger\">Blue</sp-action-button>\n <sp-tooltip slot=\"hover-content\">The sky in spring.</sp-tooltip>\n </overlay-trigger>\n <overlay-trigger>\n <sp-action-button slot=\"trigger\">Yellow</sp-action-button>\n <sp-tooltip slot=\"hover-content\">The sun at noon.</sp-tooltip>\n </overlay-trigger>\n </sp-action-group>\n <div>Selected:</div>\n `;\n};\n\nexport const iconsOnly = (args: Properties): TemplateResult =>\n renderIconButtons(args);\n\nexport const quietIconsOnly = (args: Properties): TemplateResult =>\n renderIconButtons(args);\nquietIconsOnly.args = {\n quiet: true,\n};\n\nexport const compact = (args: Properties): TemplateResult =>\n renderButtons(args);\ncompact.args = {\n compact: true,\n};\n\nexport const compactIconsOnly = (args: Properties): TemplateResult =>\n renderIconButtons(args);\ncompactIconsOnly.args = {\n compact: true,\n};\n\nexport const compactQuietIconsOnly = (args: Properties): TemplateResult =>\n renderIconButtons(args);\ncompactQuietIconsOnly.args = {\n compact: true,\n quiet: true,\n};\n\nexport const vertical = (args: Properties): TemplateResult =>\n renderButtons(args);\nvertical.args = {\n vertical: true,\n};\n\nexport const verticalIconsOnly = (args: Properties): TemplateResult =>\n renderIconButtons(args);\nverticalIconsOnly.args = {\n vertical: true,\n};\n\nexport const verticalQuietIconsOnly = (args: Properties): TemplateResult =>\n renderIconButtons(args);\nverticalQuietIconsOnly.args = {\n quiet: true,\n vertical: true,\n};\n\nexport const compactVertical = (args: Properties): TemplateResult =>\n renderButtons(args);\ncompactVertical.args = {\n compact: true,\n vertical: true,\n};\n\nexport const compactVerticalIconsOnly = (args: Properties): TemplateResult =>\n renderIconButtons(args);\ncompactVerticalIconsOnly.args = {\n compact: true,\n vertical: true,\n};\n\nexport const compactQuietVerticalIconsOnly = (\n args: Properties\n): TemplateResult => renderIconButtons(args);\ncompactQuietVerticalIconsOnly.args = {\n compact: true,\n quiet: true,\n vertical: true,\n};\n\nexport const justified = (args: Properties): TemplateResult =>\n renderButtons(args);\njustified.args = {\n justified: true,\n};\n\nexport const justifiedIconsOnly = (args: Properties): TemplateResult =>\n renderIconButtons(args);\njustifiedIconsOnly.args = {\n justified: true,\n};\n\nexport const compactJustifiedIconsOnly = (args: Properties): TemplateResult =>\n renderIconButtons(args);\ncompactJustifiedIconsOnly.args = {\n compact: true,\n justified: true,\n};\n"]}
1	+ {"version":3,"file":"action-group.stories.js","sourceRoot":"","sources":["action-group.stories.ts"],"names":[],"mappings":"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","sourcesContent":["/\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n/\n\nimport { html, TemplateResult } from '@spectrum-web-components/base';\nimport { spreadProps } from '@open-wc/lit-helpers';\n\nimport '../sp-action-group.js';\nimport '@spectrum-web-components/action-button/sp-action-button.js';\nimport '@spectrum-web-components/overlay/overlay-trigger.js';\nimport '@spectrum-web-components/tooltip/sp-tooltip.js';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-properties.js';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-info.js';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-view-all-tags.js';\nimport { ActionGroup } from '../src/ActionGroup.js';\n\nexport default {\n title: 'Action Group',\n component: 'sp-action-group',\n args: {\n compact: false,\n emphasized: false,\n justified: false,\n quiet: false,\n vertical: false,\n },\n argTypes: {\n compact: {\n name: 'compact',\n description:\n 'Visually joins the buttons together to clarify their relationship to one another.',\n type: { name: 'boolean', required: false },\n table: {\n type: { summary: 'boolean' },\n defaultValue: { summary: false },\n },\n control: {\n type: 'boolean',\n },\n },\n emphasized: {\n name: 'emphasized',\n type: { name: 'boolean', required: false },\n table: {\n type: { summary: 'boolean' },\n defaultValue: { summary: false },\n },\n control: {\n type: 'boolean',\n },\n },\n justified: {\n name: 'justified',\n description:\n 'Aligns the action group items to use all the available space on that line.',\n type: { name: 'boolean', required: false },\n table: {\n type: { summary: 'boolean' },\n defaultValue: { summary: false },\n },\n control: {\n type: 'boolean',\n },\n },\n quiet: {\n name: 'quiet',\n type: { name: 'boolean', required: false },\n table: {\n type: { summary: 'boolean' },\n defaultValue: { summary: false },\n },\n control: {\n type: 'boolean',\n },\n },\n vertical: {\n name: 'vertical',\n description: 'Changes the orientation of the action group.',\n type: { name: 'boolean', required: false },\n table: {\n type: { summary: 'boolean' },\n defaultValue: { summary: false },\n },\n control: {\n type: 'boolean',\n },\n },\n },\n};\n\ninterface Properties {\n compact?: boolean;\n emphasized?: boolean;\n justified?: boolean;\n quiet?: boolean;\n vertical?: boolean;\n}\n\nfunction renderIconButtons(args: Properties): TemplateResult {\n return html`\n <sp-action-group ...=${spreadProps(args)}>\n <sp-action-button label=\"Properties\">\n <sp-icon-properties slot=\"icon\"></sp-icon-properties>\n </sp-action-button>\n <sp-action-button label=\"Info\">\n <sp-icon-info slot=\"icon\"></sp-icon-info>\n </sp-action-button>\n <sp-action-button label=\"View All Tags\">\n <sp-icon-view-all-tags slot=\"icon\"></sp-icon-view-all-tags>\n </sp-action-button>\n </sp-action-group>\n `;\n}\n\nfunction renderButtons(args: Properties): TemplateResult {\n return html`\n <sp-action-group ...=${spreadProps(args)}>\n <sp-action-button>Button 1</sp-action-button>\n <sp-action-button>Longer Button 2</sp-action-button>\n <sp-action-button>Short 3</sp-action-button>\n </sp-action-group>\n `;\n}\n\nexport const Default = (args: Properties): TemplateResult =>\n renderButtons(args);\n\nexport const selectsSingle = (args: Properties): TemplateResult => {\n return html`\n <sp-action-group\n ?compact=${args.compact}\n ?emphasized=${args.emphasized}\n ?quiet=${args.quiet}\n ?justified=${args.justified}\n ?vertical=${args.vertical}\n label=\"Favorite Color\"\n selects=\"single\"\n @change=${({ target }: Event & { target: ActionGroup }) => {\n const next = target.nextElementSibling as HTMLDivElement;\n next.textContent = `Selected: ${JSON.stringify(\n target.selected\n )}`;\n }}\n >\n <sp-action-button>Red</sp-action-button>\n <sp-action-button>Green</sp-action-button>\n <sp-action-button>Blue</sp-action-button>\n <sp-action-button selected>Yellow</sp-action-button>\n </sp-action-group>\n <div>Selected:</div>\n `;\n};\n\nexport const selectsMultiple = (args: Properties): TemplateResult => {\n return html`\n <sp-action-group\n ...=${spreadProps(args)}\n label=\"Favorite Colors\"\n selects=\"multiple\"\n @change=${({ target }: Event & { target: ActionGroup }) => {\n const next = target.nextElementSibling as HTMLDivElement;\n next.textContent = `Selected: ${JSON.stringify(\n target.selected\n )}`;\n }}\n >\n <sp-action-button>Red</sp-action-button>\n <sp-action-button selected>Green</sp-action-button>\n <sp-action-button selected>Blue</sp-action-button>\n <sp-action-button>Yellow</sp-action-button>\n </sp-action-group>\n <div>Selected:</div>\n `;\n};\n\nexport const selectsMultipleWithTooltips = (\n args: Properties\n): TemplateResult => {\n return html`\n <sp-action-group\n ...=${spreadProps(args)}\n label=\"Favorite Color\"\n selects=\"multiple\"\n @change=${({ target }: Event & { target: ActionGroup }) => {\n const next = target.nextElementSibling as HTMLDivElement;\n next.textContent = `Selected: ${JSON.stringify(\n target.selected\n )}`;\n }}\n >\n <overlay-trigger>\n <sp-action-button slot=\"trigger\">Red</sp-action-button>\n <sp-tooltip slot=\"hover-content\">\n This is a cool color.\n </sp-tooltip>\n </overlay-trigger>\n <overlay-trigger>\n <sp-action-button slot=\"trigger\">Green</sp-action-button>\n <sp-tooltip slot=\"hover-content\">\n You wouldn't be wrong.\n </sp-tooltip>\n </overlay-trigger>\n <overlay-trigger>\n <sp-action-button slot=\"trigger\">Blue</sp-action-button>\n <sp-tooltip slot=\"hover-content\">The sky in spring.</sp-tooltip>\n </overlay-trigger>\n <overlay-trigger>\n <sp-action-button slot=\"trigger\">Yellow</sp-action-button>\n <sp-tooltip slot=\"hover-content\">The sun at noon.</sp-tooltip>\n </overlay-trigger>\n </sp-action-group>\n <div>Selected:</div>\n `;\n};\n\nexport const iconsOnly = (args: Properties): TemplateResult =>\n renderIconButtons(args);\n\nexport const quietIconsOnly = (args: Properties): TemplateResult =>\n renderIconButtons(args);\nquietIconsOnly.args = {\n quiet: true,\n};\n\nexport const compact = (args: Properties): TemplateResult =>\n renderButtons(args);\ncompact.args = {\n compact: true,\n};\n\nexport const compactIconsOnly = (args: Properties): TemplateResult =>\n renderIconButtons(args);\ncompactIconsOnly.args = {\n compact: true,\n};\n\nexport const compactQuietIconsOnly = (args: Properties): TemplateResult =>\n renderIconButtons(args);\ncompactQuietIconsOnly.args = {\n compact: true,\n quiet: true,\n};\n\nexport const vertical = (args: Properties): TemplateResult =>\n renderButtons(args);\nvertical.args = {\n vertical: true,\n};\n\nexport const verticalIconsOnly = (args: Properties): TemplateResult =>\n renderIconButtons(args);\nverticalIconsOnly.args = {\n vertical: true,\n};\n\nexport const verticalQuietIconsOnly = (args: Properties): TemplateResult =>\n renderIconButtons(args);\nverticalQuietIconsOnly.args = {\n quiet: true,\n vertical: true,\n};\n\nexport const compactVertical = (args: Properties): TemplateResult =>\n renderButtons(args);\ncompactVertical.args = {\n compact: true,\n vertical: true,\n};\n\nexport const compactVerticalIconsOnly = (args: Properties): TemplateResult =>\n renderIconButtons(args);\ncompactVerticalIconsOnly.args = {\n compact: true,\n vertical: true,\n};\n\nexport const compactQuietVerticalIconsOnly = (\n args: Properties\n): TemplateResult => renderIconButtons(args);\ncompactQuietVerticalIconsOnly.args = {\n compact: true,\n quiet: true,\n vertical: true,\n};\n\nexport const justified = (args: Properties): TemplateResult =>\n renderButtons(args);\njustified.args = {\n justified: true,\n};\n\nexport const justifiedIconsOnly = (args: Properties): TemplateResult =>\n renderIconButtons(args);\njustifiedIconsOnly.args = {\n justified: true,\n};\n\nexport const compactJustifiedIconsOnly = (args: Properties): TemplateResult =>\n renderIconButtons(args);\ncompactJustifiedIconsOnly.args = {\n compact: true,\n justified: true,\n};\n"]}