@spectrum-web-components/popover 0.11.1 → 0.11.3

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.
@@ -185,7 +185,7 @@
185
185
  {
186
186
  "kind": "variable",
187
187
  "name": "styles",
188
- "default": "css`\n:host{--spectrum-overlay-animation-distance:var(\n--spectrum-picker-m-texticon-popover-offset-y,var(--spectrum-global-dimension-size-75)\n);opacity:0;pointer-events:none;transition:transform var(--spectrum-global-animation-duration-100,.13s) ease-in-out,opacity var(--spectrum-global-animation-duration-100,.13s) ease-in-out,visibility 0ms linear var(--spectrum-global-animation-duration-100,.13s);visibility:hidden}:host([open]){opacity:1;pointer-events:auto;transition-delay:0ms;visibility:visible}:host([placement*=bottom][open]){transform:translateY(var(--spectrum-overlay-animation-distance))}:host([placement*=top][open]){transform:translateY(calc(-1*var(--spectrum-overlay-animation-distance)))}:host([placement*=right][open]){transform:translateX(var(--spectrum-overlay-animation-distance))}:host([placement*=left][open]){transform:translateX(calc(-1*var(--spectrum-overlay-animation-distance)))}:host{--spectrum-popover-target-offset:13px;--spectrum-popover-dialog-padding:30px 29px;--spectrum-popover-dialog-min-width:270px;--spectrum-popover-min-width:var(--spectrum-global-dimension-size-400);--spectrum-popover-min-height:var(--spectrum-global-dimension-size-400)}:host{border-radius:var(\n--spectrum-popover-border-radius,var(--spectrum-alias-border-radius-regular)\n);border-style:solid;border-width:var(\n--spectrum-popover-border-size,var(--spectrum-alias-border-size-thin)\n);box-sizing:border-box;display:inline-flex;flex-direction:column;min-height:var(\n--spectrum-popover-min-height,var(--spectrum-global-dimension-size-400)\n);min-width:var(\n--spectrum-popover-min-width,var(--spectrum-global-dimension-size-400)\n);outline:none;position:absolute}#tip{position:absolute;-webkit-transform:translate(0)}#tip .triangle{stroke-linecap:square;stroke-linejoin:miter;stroke-width:var(\n--spectrum-popover-border-size,var(--spectrum-alias-border-size-thin)\n)}:host([dialog]){min-width:var(\n--spectrum-popover-dialog-min-width\n);padding:var(--spectrum-popover-dialog-padding)}:host([placement*=left][tip]){margin-right:var(\n--spectrum-popover-target-offset\n)}:host([placement*=left]) #tip{left:100%}:host([placement*=right][tip]){margin-left:var(\n--spectrum-popover-target-offset\n)}:host([placement*=right]) #tip{right:100%;transform:scaleX(-1)}:host([placement*=left]) #tip,:host([placement*=right]) #tip{margin-top:calc(var(--spectrum-global-dimension-size-150)*-1);top:50%}:host([placement*=bottom][tip]){margin-top:var(\n--spectrum-popover-target-offset\n)}:host([placement*=bottom]) #tip{bottom:100%;transform:scaleY(-1)}:host([placement*=top][tip]){margin-bottom:var(\n--spectrum-popover-target-offset\n)}:host([placement*=top]) #tip{top:100%}:host([placement*=bottom]) #tip,:host([placement*=top]) #tip{left:50%;margin-left:calc(var(--spectrum-global-dimension-size-150)*-1)}:host{background-color:var(\n--spectrum-popover-background-color,var(--spectrum-global-color-gray-50)\n);border-color:var(\n--spectrum-popover-border-color,var(--spectrum-alias-border-color-dark)\n);-webkit-clip-path:inset(-30px -30px);clip-path:inset(-30px -30px);filter:drop-shadow(0 1px 4px var(\n--spectrum-popover-shadow-color,var(--spectrum-alias-dropshadow-color)\n));-webkit-filter:drop-shadow(0 1px 4px var(\n--spectrum-popover-shadow-color,var(--spectrum-alias-dropshadow-color)\n));will-change:filter}#tip .triangle{fill:var(\n--spectrum-popover-background-color,var(--spectrum-global-color-gray-50)\n);stroke:var(\n--spectrum-popover-border-color,var(--spectrum-alias-border-color-dark)\n)}:host{--sp-popover-tip-size:24px}:host([placement*=bottom]),:host([placement*=top]){max-height:calc(100% - var(--spectrum-overlay-animation-distance))}:host([placement*=left]),:host([placement*=right]){max-width:calc(100% - var(--spectrum-overlay-animation-distance))}::slotted(*){overscroll-behavior:contain}.tip{height:calc(var(--sp-popover-tip-size)/2);left:0;position:absolute;width:var(--sp-popover-tip-size)}:host([placement*=right]) #tip{transform:none}:host([placement*=bottom]) #tip{transform:none}:host([placement*=top]) .tip{top:100%}:host([placement*=bottom]) .tip{bottom:100%;transform:scaleY(-1)}:host([placement*=left]) .tip{transform:rotate(-90deg) translateY(-200%);transform-origin:100% 0}:host([placement*=right]) .tip{transform:rotate(90deg);transform-origin:0 0}::slotted(.visually-hidden){clip:rect(0,0,0,0);border:0;-webkit-clip-path:inset(50%);clip-path:inset(50%);height:1px;margin:0 -1px -1px 0;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}\n`"
188
+ "default": "css`\n:host{--spectrum-overlay-animation-distance:var(\n--spectrum-picker-m-texticon-popover-offset-y,var(--spectrum-global-dimension-size-75)\n);opacity:0;pointer-events:none;transition:transform var(--spectrum-global-animation-duration-100,.13s) ease-in-out,opacity var(--spectrum-global-animation-duration-100,.13s) ease-in-out,visibility 0ms linear var(--spectrum-global-animation-duration-100,.13s);visibility:hidden}:host([open]){opacity:1;pointer-events:auto;transition-delay:0ms;visibility:visible}:host([placement*=bottom][open]){transform:translateY(var(--spectrum-overlay-animation-distance))}:host([placement*=top][open]){transform:translateY(calc(var(--spectrum-overlay-animation-distance)*-1))}:host([placement*=right][open]){transform:translateX(var(--spectrum-overlay-animation-distance))}:host([placement*=left][open]){transform:translateX(calc(var(--spectrum-overlay-animation-distance)*-1))}:host{--spectrum-popover-target-offset:13px;--spectrum-popover-dialog-padding:30px 29px;--spectrum-popover-dialog-min-width:270px;--spectrum-popover-min-width:var(--spectrum-global-dimension-size-400);--spectrum-popover-min-height:var(--spectrum-global-dimension-size-400)}:host{border-radius:var(\n--spectrum-popover-border-radius,var(--spectrum-alias-border-radius-regular)\n);border-style:solid;border-width:var(\n--spectrum-popover-border-size,var(--spectrum-alias-border-size-thin)\n);box-sizing:border-box;display:inline-flex;flex-direction:column;min-height:var(\n--spectrum-popover-min-height,var(--spectrum-global-dimension-size-400)\n);min-width:var(\n--spectrum-popover-min-width,var(--spectrum-global-dimension-size-400)\n);outline:none;position:absolute}#tip{position:absolute;-webkit-transform:translate(0)}#tip .triangle{stroke-linecap:square;stroke-linejoin:miter;stroke-width:var(\n--spectrum-popover-border-size,var(--spectrum-alias-border-size-thin)\n)}:host([dialog]){min-width:var(\n--spectrum-popover-dialog-min-width\n);padding:var(--spectrum-popover-dialog-padding)}:host([placement*=left][tip]){margin-right:var(\n--spectrum-popover-target-offset\n)}:host([placement*=left]) #tip{left:100%}:host([placement*=right][tip]){margin-left:var(\n--spectrum-popover-target-offset\n)}:host([placement*=right]) #tip{right:100%;transform:scaleX(-1)}:host([placement*=left]) #tip,:host([placement*=right]) #tip{margin-top:calc(var(--spectrum-global-dimension-size-150)*-1);top:50%}:host([placement*=bottom][tip]){margin-top:var(\n--spectrum-popover-target-offset\n)}:host([placement*=bottom]) #tip{bottom:100%;transform:scaleY(-1)}:host([placement*=top][tip]){margin-bottom:var(\n--spectrum-popover-target-offset\n)}:host([placement*=top]) #tip{top:100%}:host([placement*=bottom]) #tip,:host([placement*=top]) #tip{left:50%;margin-left:calc(var(--spectrum-global-dimension-size-150)*-1)}:host{background-color:var(\n--spectrum-popover-background-color,var(--spectrum-global-color-gray-50)\n);border-color:var(\n--spectrum-popover-border-color,var(--spectrum-alias-border-color-dark)\n);-webkit-clip-path:inset(-30px -30px);clip-path:inset(-30px -30px);filter:drop-shadow(0 1px 4px var(\n--spectrum-popover-shadow-color,var(--spectrum-alias-dropshadow-color)\n));-webkit-filter:drop-shadow(0 1px 4px var(\n--spectrum-popover-shadow-color,var(--spectrum-alias-dropshadow-color)\n));will-change:filter}#tip .triangle{fill:var(\n--spectrum-popover-background-color,var(--spectrum-global-color-gray-50)\n);stroke:var(\n--spectrum-popover-border-color,var(--spectrum-alias-border-color-dark)\n)}:host{--sp-popover-tip-size:24px}:host([placement*=bottom]),:host([placement*=top]){max-height:calc(100% - var(--spectrum-overlay-animation-distance))}:host([placement*=left]),:host([placement*=right]){max-width:calc(100% - var(--spectrum-overlay-animation-distance))}::slotted(*){overscroll-behavior:contain}.tip{height:calc(var(--sp-popover-tip-size)/2);left:0;position:absolute;width:var(--sp-popover-tip-size)}:host([placement*=right]) #tip{transform:none}:host([placement*=bottom]) #tip{transform:none}:host([placement*=top]) .tip{top:100%}:host([placement*=bottom]) .tip{bottom:100%;transform:scaleY(-1)}:host([placement*=left]) .tip{transform:rotate(-90deg) translateY(-200%);transform-origin:100% 0}:host([placement*=right]) .tip{transform:rotate(90deg);transform-origin:0 0}::slotted(.visually-hidden){clip:rect(0,0,0,0);border:0;-webkit-clip-path:inset(50%);clip-path:inset(50%);height:1px;margin:0 -1px -1px 0;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}\n`"
189
189
  }
190
190
  ],
191
191
  "exports": [
@@ -206,7 +206,7 @@
206
206
  {
207
207
  "kind": "variable",
208
208
  "name": "styles",
209
- "default": "css`\n:host{--spectrum-overlay-animation-distance:var(\n--spectrum-picker-m-texticon-popover-offset-y,var(--spectrum-global-dimension-size-75)\n);opacity:0;pointer-events:none;transition:transform var(--spectrum-global-animation-duration-100,.13s) ease-in-out,opacity var(--spectrum-global-animation-duration-100,.13s) ease-in-out,visibility 0ms linear var(--spectrum-global-animation-duration-100,.13s);visibility:hidden}:host([open]){opacity:1;pointer-events:auto;transition-delay:0ms;visibility:visible}:host([placement*=bottom][open]){transform:translateY(var(--spectrum-overlay-animation-distance))}:host([placement*=top][open]){transform:translateY(calc(-1*var(--spectrum-overlay-animation-distance)))}:host([placement*=right][open]){transform:translateX(var(--spectrum-overlay-animation-distance))}:host([placement*=left][open]){transform:translateX(calc(-1*var(--spectrum-overlay-animation-distance)))}:host{--spectrum-popover-target-offset:13px;--spectrum-popover-dialog-padding:30px 29px;--spectrum-popover-dialog-min-width:270px;--spectrum-popover-min-width:var(--spectrum-global-dimension-size-400);--spectrum-popover-min-height:var(--spectrum-global-dimension-size-400)}:host{border-radius:var(\n--spectrum-popover-border-radius,var(--spectrum-alias-border-radius-regular)\n);border-style:solid;border-width:var(\n--spectrum-popover-border-size,var(--spectrum-alias-border-size-thin)\n);box-sizing:border-box;display:inline-flex;flex-direction:column;min-height:var(\n--spectrum-popover-min-height,var(--spectrum-global-dimension-size-400)\n);min-width:var(\n--spectrum-popover-min-width,var(--spectrum-global-dimension-size-400)\n);outline:none;position:absolute}#tip{position:absolute;-webkit-transform:translate(0)}#tip .triangle{stroke-linecap:square;stroke-linejoin:miter;stroke-width:var(\n--spectrum-popover-border-size,var(--spectrum-alias-border-size-thin)\n)}:host([dialog]){min-width:var(\n--spectrum-popover-dialog-min-width\n);padding:var(--spectrum-popover-dialog-padding)}:host([placement*=left][tip]){margin-right:var(\n--spectrum-popover-target-offset\n)}:host([placement*=left]) #tip{left:100%}:host([placement*=right][tip]){margin-left:var(\n--spectrum-popover-target-offset\n)}:host([placement*=right]) #tip{right:100%;transform:scaleX(-1)}:host([placement*=left]) #tip,:host([placement*=right]) #tip{margin-top:calc(var(--spectrum-global-dimension-size-150)*-1);top:50%}:host([placement*=bottom][tip]){margin-top:var(\n--spectrum-popover-target-offset\n)}:host([placement*=bottom]) #tip{bottom:100%;transform:scaleY(-1)}:host([placement*=top][tip]){margin-bottom:var(\n--spectrum-popover-target-offset\n)}:host([placement*=top]) #tip{top:100%}:host([placement*=bottom]) #tip,:host([placement*=top]) #tip{left:50%;margin-left:calc(var(--spectrum-global-dimension-size-150)*-1)}:host{background-color:var(\n--spectrum-popover-background-color,var(--spectrum-global-color-gray-50)\n);border-color:var(\n--spectrum-popover-border-color,var(--spectrum-alias-border-color-dark)\n);-webkit-clip-path:inset(-30px -30px);clip-path:inset(-30px -30px);filter:drop-shadow(0 1px 4px var(\n--spectrum-popover-shadow-color,var(--spectrum-alias-dropshadow-color)\n));-webkit-filter:drop-shadow(0 1px 4px var(\n--spectrum-popover-shadow-color,var(--spectrum-alias-dropshadow-color)\n));will-change:filter}#tip .triangle{fill:var(\n--spectrum-popover-background-color,var(--spectrum-global-color-gray-50)\n);stroke:var(\n--spectrum-popover-border-color,var(--spectrum-alias-border-color-dark)\n)}\n`"
209
+ "default": "css`\n:host{--spectrum-overlay-animation-distance:var(\n--spectrum-picker-m-texticon-popover-offset-y,var(--spectrum-global-dimension-size-75)\n);opacity:0;pointer-events:none;transition:transform var(--spectrum-global-animation-duration-100,.13s) ease-in-out,opacity var(--spectrum-global-animation-duration-100,.13s) ease-in-out,visibility 0ms linear var(--spectrum-global-animation-duration-100,.13s);visibility:hidden}:host([open]){opacity:1;pointer-events:auto;transition-delay:0ms;visibility:visible}:host([placement*=bottom][open]){transform:translateY(var(--spectrum-overlay-animation-distance))}:host([placement*=top][open]){transform:translateY(calc(var(--spectrum-overlay-animation-distance)*-1))}:host([placement*=right][open]){transform:translateX(var(--spectrum-overlay-animation-distance))}:host([placement*=left][open]){transform:translateX(calc(var(--spectrum-overlay-animation-distance)*-1))}:host{--spectrum-popover-target-offset:13px;--spectrum-popover-dialog-padding:30px 29px;--spectrum-popover-dialog-min-width:270px;--spectrum-popover-min-width:var(--spectrum-global-dimension-size-400);--spectrum-popover-min-height:var(--spectrum-global-dimension-size-400)}:host{border-radius:var(\n--spectrum-popover-border-radius,var(--spectrum-alias-border-radius-regular)\n);border-style:solid;border-width:var(\n--spectrum-popover-border-size,var(--spectrum-alias-border-size-thin)\n);box-sizing:border-box;display:inline-flex;flex-direction:column;min-height:var(\n--spectrum-popover-min-height,var(--spectrum-global-dimension-size-400)\n);min-width:var(\n--spectrum-popover-min-width,var(--spectrum-global-dimension-size-400)\n);outline:none;position:absolute}#tip{position:absolute;-webkit-transform:translate(0)}#tip .triangle{stroke-linecap:square;stroke-linejoin:miter;stroke-width:var(\n--spectrum-popover-border-size,var(--spectrum-alias-border-size-thin)\n)}:host([dialog]){min-width:var(\n--spectrum-popover-dialog-min-width\n);padding:var(--spectrum-popover-dialog-padding)}:host([placement*=left][tip]){margin-right:var(\n--spectrum-popover-target-offset\n)}:host([placement*=left]) #tip{left:100%}:host([placement*=right][tip]){margin-left:var(\n--spectrum-popover-target-offset\n)}:host([placement*=right]) #tip{right:100%;transform:scaleX(-1)}:host([placement*=left]) #tip,:host([placement*=right]) #tip{margin-top:calc(var(--spectrum-global-dimension-size-150)*-1);top:50%}:host([placement*=bottom][tip]){margin-top:var(\n--spectrum-popover-target-offset\n)}:host([placement*=bottom]) #tip{bottom:100%;transform:scaleY(-1)}:host([placement*=top][tip]){margin-bottom:var(\n--spectrum-popover-target-offset\n)}:host([placement*=top]) #tip{top:100%}:host([placement*=bottom]) #tip,:host([placement*=top]) #tip{left:50%;margin-left:calc(var(--spectrum-global-dimension-size-150)*-1)}:host{background-color:var(\n--spectrum-popover-background-color,var(--spectrum-global-color-gray-50)\n);border-color:var(\n--spectrum-popover-border-color,var(--spectrum-alias-border-color-dark)\n);-webkit-clip-path:inset(-30px -30px);clip-path:inset(-30px -30px);filter:drop-shadow(0 1px 4px var(\n--spectrum-popover-shadow-color,var(--spectrum-alias-dropshadow-color)\n));-webkit-filter:drop-shadow(0 1px 4px var(\n--spectrum-popover-shadow-color,var(--spectrum-alias-dropshadow-color)\n));will-change:filter}#tip .triangle{fill:var(\n--spectrum-popover-background-color,var(--spectrum-global-color-gray-50)\n);stroke:var(\n--spectrum-popover-border-color,var(--spectrum-alias-border-color-dark)\n)}\n`"
210
210
  }
211
211
  ],
212
212
  "exports": [
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@spectrum-web-components/popover",
3
- "version": "0.11.1",
3
+ "version": "0.11.3",
4
4
  "publishConfig": {
5
5
  "access": "public"
6
6
  },
@@ -45,16 +45,16 @@
45
45
  ],
46
46
  "dependencies": {
47
47
  "@spectrum-web-components/base": "^0.5.1",
48
- "@spectrum-web-components/overlay": "^0.13.1",
48
+ "@spectrum-web-components/overlay": "^0.13.3",
49
49
  "tslib": "^2.0.0"
50
50
  },
51
51
  "devDependencies": {
52
- "@spectrum-css/popover": "^3.0.11"
52
+ "@spectrum-css/popover": "^5.0.0"
53
53
  },
54
54
  "types": "./src/index.d.ts",
55
55
  "customElements": "custom-elements.json",
56
56
  "sideEffects": [
57
57
  "./sp-*.js"
58
58
  ],
59
- "gitHead": "df3f333ee26a45f9fc247716b6e8ef051dca630b"
59
+ "gitHead": "279380c6d72c0819fe224b405844af9ddcb87f8a"
60
60
  }
@@ -13,7 +13,7 @@ import { css } from '@spectrum-web-components/base';
13
13
  const styles = css `
14
14
  :host{--spectrum-overlay-animation-distance:var(
15
15
  --spectrum-picker-m-texticon-popover-offset-y,var(--spectrum-global-dimension-size-75)
16
- );opacity:0;pointer-events:none;transition:transform var(--spectrum-global-animation-duration-100,.13s) ease-in-out,opacity var(--spectrum-global-animation-duration-100,.13s) ease-in-out,visibility 0ms linear var(--spectrum-global-animation-duration-100,.13s);visibility:hidden}:host([open]){opacity:1;pointer-events:auto;transition-delay:0ms;visibility:visible}:host([placement*=bottom][open]){transform:translateY(var(--spectrum-overlay-animation-distance))}:host([placement*=top][open]){transform:translateY(calc(-1*var(--spectrum-overlay-animation-distance)))}:host([placement*=right][open]){transform:translateX(var(--spectrum-overlay-animation-distance))}:host([placement*=left][open]){transform:translateX(calc(-1*var(--spectrum-overlay-animation-distance)))}:host{--spectrum-popover-target-offset:13px;--spectrum-popover-dialog-padding:30px 29px;--spectrum-popover-dialog-min-width:270px;--spectrum-popover-min-width:var(--spectrum-global-dimension-size-400);--spectrum-popover-min-height:var(--spectrum-global-dimension-size-400)}:host{border-radius:var(
16
+ );opacity:0;pointer-events:none;transition:transform var(--spectrum-global-animation-duration-100,.13s) ease-in-out,opacity var(--spectrum-global-animation-duration-100,.13s) ease-in-out,visibility 0ms linear var(--spectrum-global-animation-duration-100,.13s);visibility:hidden}:host([open]){opacity:1;pointer-events:auto;transition-delay:0ms;visibility:visible}:host([placement*=bottom][open]){transform:translateY(var(--spectrum-overlay-animation-distance))}:host([placement*=top][open]){transform:translateY(calc(var(--spectrum-overlay-animation-distance)*-1))}:host([placement*=right][open]){transform:translateX(var(--spectrum-overlay-animation-distance))}:host([placement*=left][open]){transform:translateX(calc(var(--spectrum-overlay-animation-distance)*-1))}:host{--spectrum-popover-target-offset:13px;--spectrum-popover-dialog-padding:30px 29px;--spectrum-popover-dialog-min-width:270px;--spectrum-popover-min-width:var(--spectrum-global-dimension-size-400);--spectrum-popover-min-height:var(--spectrum-global-dimension-size-400)}:host{border-radius:var(
17
17
  --spectrum-popover-border-radius,var(--spectrum-alias-border-radius-regular)
18
18
  );border-style:solid;border-width:var(
19
19
  --spectrum-popover-border-size,var(--spectrum-alias-border-size-thin)
@@ -1 +1 @@
1
- {"version":3,"file":"popover.css.js","sourceRoot":"","sources":["popover.css.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;EAUE;AACF,OAAO,EAAE,GAAG,EAAE,MAAM,+BAA+B,CAAC;AACpD,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoCjB,CAAC;AACF,eAAe,MAAM,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*/\nimport { css } from '@spectrum-web-components/base';\nconst styles = css`\n:host{--spectrum-overlay-animation-distance:var(\n--spectrum-picker-m-texticon-popover-offset-y,var(--spectrum-global-dimension-size-75)\n);opacity:0;pointer-events:none;transition:transform var(--spectrum-global-animation-duration-100,.13s) ease-in-out,opacity var(--spectrum-global-animation-duration-100,.13s) ease-in-out,visibility 0ms linear var(--spectrum-global-animation-duration-100,.13s);visibility:hidden}:host([open]){opacity:1;pointer-events:auto;transition-delay:0ms;visibility:visible}:host([placement*=bottom][open]){transform:translateY(var(--spectrum-overlay-animation-distance))}:host([placement*=top][open]){transform:translateY(calc(-1*var(--spectrum-overlay-animation-distance)))}:host([placement*=right][open]){transform:translateX(var(--spectrum-overlay-animation-distance))}:host([placement*=left][open]){transform:translateX(calc(-1*var(--spectrum-overlay-animation-distance)))}:host{--spectrum-popover-target-offset:13px;--spectrum-popover-dialog-padding:30px 29px;--spectrum-popover-dialog-min-width:270px;--spectrum-popover-min-width:var(--spectrum-global-dimension-size-400);--spectrum-popover-min-height:var(--spectrum-global-dimension-size-400)}:host{border-radius:var(\n--spectrum-popover-border-radius,var(--spectrum-alias-border-radius-regular)\n);border-style:solid;border-width:var(\n--spectrum-popover-border-size,var(--spectrum-alias-border-size-thin)\n);box-sizing:border-box;display:inline-flex;flex-direction:column;min-height:var(\n--spectrum-popover-min-height,var(--spectrum-global-dimension-size-400)\n);min-width:var(\n--spectrum-popover-min-width,var(--spectrum-global-dimension-size-400)\n);outline:none;position:absolute}#tip{position:absolute;-webkit-transform:translate(0)}#tip .triangle{stroke-linecap:square;stroke-linejoin:miter;stroke-width:var(\n--spectrum-popover-border-size,var(--spectrum-alias-border-size-thin)\n)}:host([dialog]){min-width:var(\n--spectrum-popover-dialog-min-width\n);padding:var(--spectrum-popover-dialog-padding)}:host([placement*=left][tip]){margin-right:var(\n--spectrum-popover-target-offset\n)}:host([placement*=left]) #tip{left:100%}:host([placement*=right][tip]){margin-left:var(\n--spectrum-popover-target-offset\n)}:host([placement*=right]) #tip{right:100%;transform:scaleX(-1)}:host([placement*=left]) #tip,:host([placement*=right]) #tip{margin-top:calc(var(--spectrum-global-dimension-size-150)*-1);top:50%}:host([placement*=bottom][tip]){margin-top:var(\n--spectrum-popover-target-offset\n)}:host([placement*=bottom]) #tip{bottom:100%;transform:scaleY(-1)}:host([placement*=top][tip]){margin-bottom:var(\n--spectrum-popover-target-offset\n)}:host([placement*=top]) #tip{top:100%}:host([placement*=bottom]) #tip,:host([placement*=top]) #tip{left:50%;margin-left:calc(var(--spectrum-global-dimension-size-150)*-1)}:host{background-color:var(\n--spectrum-popover-background-color,var(--spectrum-global-color-gray-50)\n);border-color:var(\n--spectrum-popover-border-color,var(--spectrum-alias-border-color-dark)\n);-webkit-clip-path:inset(-30px -30px);clip-path:inset(-30px -30px);filter:drop-shadow(0 1px 4px var(\n--spectrum-popover-shadow-color,var(--spectrum-alias-dropshadow-color)\n));-webkit-filter:drop-shadow(0 1px 4px var(\n--spectrum-popover-shadow-color,var(--spectrum-alias-dropshadow-color)\n));will-change:filter}#tip .triangle{fill:var(\n--spectrum-popover-background-color,var(--spectrum-global-color-gray-50)\n);stroke:var(\n--spectrum-popover-border-color,var(--spectrum-alias-border-color-dark)\n)}:host{--sp-popover-tip-size:24px}:host([placement*=bottom]),:host([placement*=top]){max-height:calc(100% - var(--spectrum-overlay-animation-distance))}:host([placement*=left]),:host([placement*=right]){max-width:calc(100% - var(--spectrum-overlay-animation-distance))}::slotted(*){overscroll-behavior:contain}.tip{height:calc(var(--sp-popover-tip-size)/2);left:0;position:absolute;width:var(--sp-popover-tip-size)}:host([placement*=right]) #tip{transform:none}:host([placement*=bottom]) #tip{transform:none}:host([placement*=top]) .tip{top:100%}:host([placement*=bottom]) .tip{bottom:100%;transform:scaleY(-1)}:host([placement*=left]) .tip{transform:rotate(-90deg) translateY(-200%);transform-origin:100% 0}:host([placement*=right]) .tip{transform:rotate(90deg);transform-origin:0 0}::slotted(.visually-hidden){clip:rect(0,0,0,0);border:0;-webkit-clip-path:inset(50%);clip-path:inset(50%);height:1px;margin:0 -1px -1px 0;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}\n`;\nexport default styles;"]}
1
+ {"version":3,"file":"popover.css.js","sourceRoot":"","sources":["popover.css.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;EAUE;AACF,OAAO,EAAE,GAAG,EAAE,MAAM,+BAA+B,CAAC;AACpD,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoCjB,CAAC;AACF,eAAe,MAAM,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*/\nimport { css } from '@spectrum-web-components/base';\nconst styles = css`\n:host{--spectrum-overlay-animation-distance:var(\n--spectrum-picker-m-texticon-popover-offset-y,var(--spectrum-global-dimension-size-75)\n);opacity:0;pointer-events:none;transition:transform var(--spectrum-global-animation-duration-100,.13s) ease-in-out,opacity var(--spectrum-global-animation-duration-100,.13s) ease-in-out,visibility 0ms linear var(--spectrum-global-animation-duration-100,.13s);visibility:hidden}:host([open]){opacity:1;pointer-events:auto;transition-delay:0ms;visibility:visible}:host([placement*=bottom][open]){transform:translateY(var(--spectrum-overlay-animation-distance))}:host([placement*=top][open]){transform:translateY(calc(var(--spectrum-overlay-animation-distance)*-1))}:host([placement*=right][open]){transform:translateX(var(--spectrum-overlay-animation-distance))}:host([placement*=left][open]){transform:translateX(calc(var(--spectrum-overlay-animation-distance)*-1))}:host{--spectrum-popover-target-offset:13px;--spectrum-popover-dialog-padding:30px 29px;--spectrum-popover-dialog-min-width:270px;--spectrum-popover-min-width:var(--spectrum-global-dimension-size-400);--spectrum-popover-min-height:var(--spectrum-global-dimension-size-400)}:host{border-radius:var(\n--spectrum-popover-border-radius,var(--spectrum-alias-border-radius-regular)\n);border-style:solid;border-width:var(\n--spectrum-popover-border-size,var(--spectrum-alias-border-size-thin)\n);box-sizing:border-box;display:inline-flex;flex-direction:column;min-height:var(\n--spectrum-popover-min-height,var(--spectrum-global-dimension-size-400)\n);min-width:var(\n--spectrum-popover-min-width,var(--spectrum-global-dimension-size-400)\n);outline:none;position:absolute}#tip{position:absolute;-webkit-transform:translate(0)}#tip .triangle{stroke-linecap:square;stroke-linejoin:miter;stroke-width:var(\n--spectrum-popover-border-size,var(--spectrum-alias-border-size-thin)\n)}:host([dialog]){min-width:var(\n--spectrum-popover-dialog-min-width\n);padding:var(--spectrum-popover-dialog-padding)}:host([placement*=left][tip]){margin-right:var(\n--spectrum-popover-target-offset\n)}:host([placement*=left]) #tip{left:100%}:host([placement*=right][tip]){margin-left:var(\n--spectrum-popover-target-offset\n)}:host([placement*=right]) #tip{right:100%;transform:scaleX(-1)}:host([placement*=left]) #tip,:host([placement*=right]) #tip{margin-top:calc(var(--spectrum-global-dimension-size-150)*-1);top:50%}:host([placement*=bottom][tip]){margin-top:var(\n--spectrum-popover-target-offset\n)}:host([placement*=bottom]) #tip{bottom:100%;transform:scaleY(-1)}:host([placement*=top][tip]){margin-bottom:var(\n--spectrum-popover-target-offset\n)}:host([placement*=top]) #tip{top:100%}:host([placement*=bottom]) #tip,:host([placement*=top]) #tip{left:50%;margin-left:calc(var(--spectrum-global-dimension-size-150)*-1)}:host{background-color:var(\n--spectrum-popover-background-color,var(--spectrum-global-color-gray-50)\n);border-color:var(\n--spectrum-popover-border-color,var(--spectrum-alias-border-color-dark)\n);-webkit-clip-path:inset(-30px -30px);clip-path:inset(-30px -30px);filter:drop-shadow(0 1px 4px var(\n--spectrum-popover-shadow-color,var(--spectrum-alias-dropshadow-color)\n));-webkit-filter:drop-shadow(0 1px 4px var(\n--spectrum-popover-shadow-color,var(--spectrum-alias-dropshadow-color)\n));will-change:filter}#tip .triangle{fill:var(\n--spectrum-popover-background-color,var(--spectrum-global-color-gray-50)\n);stroke:var(\n--spectrum-popover-border-color,var(--spectrum-alias-border-color-dark)\n)}:host{--sp-popover-tip-size:24px}:host([placement*=bottom]),:host([placement*=top]){max-height:calc(100% - var(--spectrum-overlay-animation-distance))}:host([placement*=left]),:host([placement*=right]){max-width:calc(100% - var(--spectrum-overlay-animation-distance))}::slotted(*){overscroll-behavior:contain}.tip{height:calc(var(--sp-popover-tip-size)/2);left:0;position:absolute;width:var(--sp-popover-tip-size)}:host([placement*=right]) #tip{transform:none}:host([placement*=bottom]) #tip{transform:none}:host([placement*=top]) .tip{top:100%}:host([placement*=bottom]) .tip{bottom:100%;transform:scaleY(-1)}:host([placement*=left]) .tip{transform:rotate(-90deg) translateY(-200%);transform-origin:100% 0}:host([placement*=right]) .tip{transform:rotate(90deg);transform-origin:0 0}::slotted(.visually-hidden){clip:rect(0,0,0,0);border:0;-webkit-clip-path:inset(50%);clip-path:inset(50%);height:1px;margin:0 -1px -1px 0;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}\n`;\nexport default styles;"]}
@@ -13,7 +13,7 @@ import { css } from '@spectrum-web-components/base';
13
13
  const styles = css `
14
14
  :host{--spectrum-overlay-animation-distance:var(
15
15
  --spectrum-picker-m-texticon-popover-offset-y,var(--spectrum-global-dimension-size-75)
16
- );opacity:0;pointer-events:none;transition:transform var(--spectrum-global-animation-duration-100,.13s) ease-in-out,opacity var(--spectrum-global-animation-duration-100,.13s) ease-in-out,visibility 0ms linear var(--spectrum-global-animation-duration-100,.13s);visibility:hidden}:host([open]){opacity:1;pointer-events:auto;transition-delay:0ms;visibility:visible}:host([placement*=bottom][open]){transform:translateY(var(--spectrum-overlay-animation-distance))}:host([placement*=top][open]){transform:translateY(calc(-1*var(--spectrum-overlay-animation-distance)))}:host([placement*=right][open]){transform:translateX(var(--spectrum-overlay-animation-distance))}:host([placement*=left][open]){transform:translateX(calc(-1*var(--spectrum-overlay-animation-distance)))}:host{--spectrum-popover-target-offset:13px;--spectrum-popover-dialog-padding:30px 29px;--spectrum-popover-dialog-min-width:270px;--spectrum-popover-min-width:var(--spectrum-global-dimension-size-400);--spectrum-popover-min-height:var(--spectrum-global-dimension-size-400)}:host{border-radius:var(
16
+ );opacity:0;pointer-events:none;transition:transform var(--spectrum-global-animation-duration-100,.13s) ease-in-out,opacity var(--spectrum-global-animation-duration-100,.13s) ease-in-out,visibility 0ms linear var(--spectrum-global-animation-duration-100,.13s);visibility:hidden}:host([open]){opacity:1;pointer-events:auto;transition-delay:0ms;visibility:visible}:host([placement*=bottom][open]){transform:translateY(var(--spectrum-overlay-animation-distance))}:host([placement*=top][open]){transform:translateY(calc(var(--spectrum-overlay-animation-distance)*-1))}:host([placement*=right][open]){transform:translateX(var(--spectrum-overlay-animation-distance))}:host([placement*=left][open]){transform:translateX(calc(var(--spectrum-overlay-animation-distance)*-1))}:host{--spectrum-popover-target-offset:13px;--spectrum-popover-dialog-padding:30px 29px;--spectrum-popover-dialog-min-width:270px;--spectrum-popover-min-width:var(--spectrum-global-dimension-size-400);--spectrum-popover-min-height:var(--spectrum-global-dimension-size-400)}:host{border-radius:var(
17
17
  --spectrum-popover-border-radius,var(--spectrum-alias-border-radius-regular)
18
18
  );border-style:solid;border-width:var(
19
19
  --spectrum-popover-border-size,var(--spectrum-alias-border-size-thin)
@@ -1 +1 @@
1
- {"version":3,"file":"spectrum-popover.css.js","sourceRoot":"","sources":["spectrum-popover.css.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;EAUE;AACF,OAAO,EAAE,GAAG,EAAE,MAAM,+BAA+B,CAAC;AACpD,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoCjB,CAAC;AACF,eAAe,MAAM,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*/\nimport { css } from '@spectrum-web-components/base';\nconst styles = css`\n:host{--spectrum-overlay-animation-distance:var(\n--spectrum-picker-m-texticon-popover-offset-y,var(--spectrum-global-dimension-size-75)\n);opacity:0;pointer-events:none;transition:transform var(--spectrum-global-animation-duration-100,.13s) ease-in-out,opacity var(--spectrum-global-animation-duration-100,.13s) ease-in-out,visibility 0ms linear var(--spectrum-global-animation-duration-100,.13s);visibility:hidden}:host([open]){opacity:1;pointer-events:auto;transition-delay:0ms;visibility:visible}:host([placement*=bottom][open]){transform:translateY(var(--spectrum-overlay-animation-distance))}:host([placement*=top][open]){transform:translateY(calc(-1*var(--spectrum-overlay-animation-distance)))}:host([placement*=right][open]){transform:translateX(var(--spectrum-overlay-animation-distance))}:host([placement*=left][open]){transform:translateX(calc(-1*var(--spectrum-overlay-animation-distance)))}:host{--spectrum-popover-target-offset:13px;--spectrum-popover-dialog-padding:30px 29px;--spectrum-popover-dialog-min-width:270px;--spectrum-popover-min-width:var(--spectrum-global-dimension-size-400);--spectrum-popover-min-height:var(--spectrum-global-dimension-size-400)}:host{border-radius:var(\n--spectrum-popover-border-radius,var(--spectrum-alias-border-radius-regular)\n);border-style:solid;border-width:var(\n--spectrum-popover-border-size,var(--spectrum-alias-border-size-thin)\n);box-sizing:border-box;display:inline-flex;flex-direction:column;min-height:var(\n--spectrum-popover-min-height,var(--spectrum-global-dimension-size-400)\n);min-width:var(\n--spectrum-popover-min-width,var(--spectrum-global-dimension-size-400)\n);outline:none;position:absolute}#tip{position:absolute;-webkit-transform:translate(0)}#tip .triangle{stroke-linecap:square;stroke-linejoin:miter;stroke-width:var(\n--spectrum-popover-border-size,var(--spectrum-alias-border-size-thin)\n)}:host([dialog]){min-width:var(\n--spectrum-popover-dialog-min-width\n);padding:var(--spectrum-popover-dialog-padding)}:host([placement*=left][tip]){margin-right:var(\n--spectrum-popover-target-offset\n)}:host([placement*=left]) #tip{left:100%}:host([placement*=right][tip]){margin-left:var(\n--spectrum-popover-target-offset\n)}:host([placement*=right]) #tip{right:100%;transform:scaleX(-1)}:host([placement*=left]) #tip,:host([placement*=right]) #tip{margin-top:calc(var(--spectrum-global-dimension-size-150)*-1);top:50%}:host([placement*=bottom][tip]){margin-top:var(\n--spectrum-popover-target-offset\n)}:host([placement*=bottom]) #tip{bottom:100%;transform:scaleY(-1)}:host([placement*=top][tip]){margin-bottom:var(\n--spectrum-popover-target-offset\n)}:host([placement*=top]) #tip{top:100%}:host([placement*=bottom]) #tip,:host([placement*=top]) #tip{left:50%;margin-left:calc(var(--spectrum-global-dimension-size-150)*-1)}:host{background-color:var(\n--spectrum-popover-background-color,var(--spectrum-global-color-gray-50)\n);border-color:var(\n--spectrum-popover-border-color,var(--spectrum-alias-border-color-dark)\n);-webkit-clip-path:inset(-30px -30px);clip-path:inset(-30px -30px);filter:drop-shadow(0 1px 4px var(\n--spectrum-popover-shadow-color,var(--spectrum-alias-dropshadow-color)\n));-webkit-filter:drop-shadow(0 1px 4px var(\n--spectrum-popover-shadow-color,var(--spectrum-alias-dropshadow-color)\n));will-change:filter}#tip .triangle{fill:var(\n--spectrum-popover-background-color,var(--spectrum-global-color-gray-50)\n);stroke:var(\n--spectrum-popover-border-color,var(--spectrum-alias-border-color-dark)\n)}\n`;\nexport default styles;"]}
1
+ {"version":3,"file":"spectrum-popover.css.js","sourceRoot":"","sources":["spectrum-popover.css.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;EAUE;AACF,OAAO,EAAE,GAAG,EAAE,MAAM,+BAA+B,CAAC;AACpD,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoCjB,CAAC;AACF,eAAe,MAAM,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*/\nimport { css } from '@spectrum-web-components/base';\nconst styles = css`\n:host{--spectrum-overlay-animation-distance:var(\n--spectrum-picker-m-texticon-popover-offset-y,var(--spectrum-global-dimension-size-75)\n);opacity:0;pointer-events:none;transition:transform var(--spectrum-global-animation-duration-100,.13s) ease-in-out,opacity var(--spectrum-global-animation-duration-100,.13s) ease-in-out,visibility 0ms linear var(--spectrum-global-animation-duration-100,.13s);visibility:hidden}:host([open]){opacity:1;pointer-events:auto;transition-delay:0ms;visibility:visible}:host([placement*=bottom][open]){transform:translateY(var(--spectrum-overlay-animation-distance))}:host([placement*=top][open]){transform:translateY(calc(var(--spectrum-overlay-animation-distance)*-1))}:host([placement*=right][open]){transform:translateX(var(--spectrum-overlay-animation-distance))}:host([placement*=left][open]){transform:translateX(calc(var(--spectrum-overlay-animation-distance)*-1))}:host{--spectrum-popover-target-offset:13px;--spectrum-popover-dialog-padding:30px 29px;--spectrum-popover-dialog-min-width:270px;--spectrum-popover-min-width:var(--spectrum-global-dimension-size-400);--spectrum-popover-min-height:var(--spectrum-global-dimension-size-400)}:host{border-radius:var(\n--spectrum-popover-border-radius,var(--spectrum-alias-border-radius-regular)\n);border-style:solid;border-width:var(\n--spectrum-popover-border-size,var(--spectrum-alias-border-size-thin)\n);box-sizing:border-box;display:inline-flex;flex-direction:column;min-height:var(\n--spectrum-popover-min-height,var(--spectrum-global-dimension-size-400)\n);min-width:var(\n--spectrum-popover-min-width,var(--spectrum-global-dimension-size-400)\n);outline:none;position:absolute}#tip{position:absolute;-webkit-transform:translate(0)}#tip .triangle{stroke-linecap:square;stroke-linejoin:miter;stroke-width:var(\n--spectrum-popover-border-size,var(--spectrum-alias-border-size-thin)\n)}:host([dialog]){min-width:var(\n--spectrum-popover-dialog-min-width\n);padding:var(--spectrum-popover-dialog-padding)}:host([placement*=left][tip]){margin-right:var(\n--spectrum-popover-target-offset\n)}:host([placement*=left]) #tip{left:100%}:host([placement*=right][tip]){margin-left:var(\n--spectrum-popover-target-offset\n)}:host([placement*=right]) #tip{right:100%;transform:scaleX(-1)}:host([placement*=left]) #tip,:host([placement*=right]) #tip{margin-top:calc(var(--spectrum-global-dimension-size-150)*-1);top:50%}:host([placement*=bottom][tip]){margin-top:var(\n--spectrum-popover-target-offset\n)}:host([placement*=bottom]) #tip{bottom:100%;transform:scaleY(-1)}:host([placement*=top][tip]){margin-bottom:var(\n--spectrum-popover-target-offset\n)}:host([placement*=top]) #tip{top:100%}:host([placement*=bottom]) #tip,:host([placement*=top]) #tip{left:50%;margin-left:calc(var(--spectrum-global-dimension-size-150)*-1)}:host{background-color:var(\n--spectrum-popover-background-color,var(--spectrum-global-color-gray-50)\n);border-color:var(\n--spectrum-popover-border-color,var(--spectrum-alias-border-color-dark)\n);-webkit-clip-path:inset(-30px -30px);clip-path:inset(-30px -30px);filter:drop-shadow(0 1px 4px var(\n--spectrum-popover-shadow-color,var(--spectrum-alias-dropshadow-color)\n));-webkit-filter:drop-shadow(0 1px 4px var(\n--spectrum-popover-shadow-color,var(--spectrum-alias-dropshadow-color)\n));will-change:filter}#tip .triangle{fill:var(\n--spectrum-popover-background-color,var(--spectrum-global-color-gray-50)\n);stroke:var(\n--spectrum-popover-border-color,var(--spectrum-alias-border-color-dark)\n)}\n`;\nexport default styles;"]}