@spectrum-web-components/tooltip 0.8.16 → 0.8.18-lit-next.24

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.
@@ -258,7 +258,7 @@
258
258
  {
259
259
  "kind": "variable",
260
260
  "name": "styles",
261
- "default": "css`\n:host{--spectrum-overlay-animation-distance:var(--spectrum-picker-m-popover-offset-y,var(--spectrum-global-dimension-size-75));visibility:hidden;opacity:0;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);pointer-events:none}:host([open]){visibility:visible;opacity:1;transition-delay:0ms;pointer-events:auto}: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-tooltip-target-offset:3px;--spectrum-tooltip-tip-width:var(--spectrum-tooltip-tip-height,var(--spectrum-global-dimension-size-50));position:relative;left:0;top:0;display:inline-flex;flex-direction:row;align-items:center;box-sizing:border-box;vertical-align:top;width:auto;padding:var(--spectrum-tooltip-padding-top,var(--spectrum-global-dimension-size-50)) var(--spectrum-tooltip-padding-x,var(--spectrum-global-dimension-size-125));border-radius:var(--spectrum-tooltip-border-radius,var(--spectrum-global-dimension-size-50));min-height:var(--spectrum-tooltip-min-height,var(--spectrum-global-dimension-size-300));max-width:var(--spectrum-tooltip-max-width,var(--spectrum-global-dimension-size-2000));font-size:var(--spectrum-tooltip-text-size,var(--spectrum-global-dimension-font-size-75));font-weight:var(--spectrum-tooltip-text-font-weight,var(--spectrum-global-font-weight-regular));line-height:var(--spectrum-tooltip-text-line-height,var(--spectrum-alias-component-text-line-height));word-break:break-word;-webkit-font-smoothing:antialiased;cursor:default;-webkit-user-select:none;user-select:none}p{margin:0}#tip{position:absolute;height:0;width:0;border-top-width:var(--spectrum-tooltip-tip-width,var(--spectrum-global-dimension-size-100));border-top-style:solid;border-left:var(--spectrum-tooltip-tip-width,var(--spectrum-global-dimension-size-100)) solid transparent;border-right:var(--spectrum-tooltip-tip-width,var(--spectrum-global-dimension-size-100)) solid transparent;border-bottom:var(--spectrum-tooltip-tip-width,var(--spectrum-global-dimension-size-100)) solid transparent}:host([placement*=left]) #tip,:host([placement*=right]) #tip{top:50%;margin-top:calc(-1*var(--spectrum-tooltip-tip-width, var(--spectrum-global-dimension-size-100)))}:host([placement*=right]){margin-left:var(--spectrum-tooltip-target-offset)}:host([placement*=right]) #tip{right:100%;transform:rotate(90deg)}:host([placement*=left]){margin-right:var(--spectrum-tooltip-target-offset)}:host([placement*=left]) #tip{left:100%;transform:rotate(-90deg)}:host([placement*=top]){margin-bottom:var(--spectrum-tooltip-target-offset)}:host([placement*=top]) #tip{top:100%}:host([placement*=bottom]){margin-top:var(--spectrum-tooltip-target-offset)}:host([placement*=bottom]) #tip{bottom:100%;transform:rotate(-180deg)}:host([placement*=bottom]) #tip,:host([placement*=top]) #tip{left:50%;margin-left:calc(-1*var(--spectrum-tooltip-tip-width, var(--spectrum-global-dimension-size-100)))}:host([dir=ltr]) ::slotted([slot=icon]){margin-left:calc(var(--spectrum-tooltip-icon-margin-x,\nvar(--spectrum-global-dimension-size-100)) - var(--spectrum-tooltip-padding-x,\nvar(--spectrum-global-dimension-size-125)))}:host([dir=rtl]) ::slotted([slot=icon]){margin-right:calc(var(--spectrum-tooltip-icon-margin-x,\nvar(--spectrum-global-dimension-size-100)) - var(--spectrum-tooltip-padding-x,\nvar(--spectrum-global-dimension-size-125)))}:host([dir=ltr]) ::slotted([slot=icon]){margin-right:var(--spectrum-tooltip-icon-margin-x,var(--spectrum-global-dimension-size-100))}:host([dir=rtl]) ::slotted([slot=icon]){margin-left:var(--spectrum-tooltip-icon-margin-x,var(--spectrum-global-dimension-size-100))}::slotted([slot=icon]){width:var(--spectrum-tooltip-icon-size,var(--spectrum-global-dimension-size-175));height:var(--spectrum-tooltip-icon-size,var(--spectrum-global-dimension-size-175));align-self:flex-start;flex-shrink:0;margin-top:1px}#label{line-height:var(--spectrum-tooltip-text-line-height,var(--spectrum-alias-component-text-line-height))}:host{background-color:var(--spectrum-tooltip-background-color,var(--spectrum-global-color-static-gray-700));color:var(--spectrum-tooltip-text-color,var(--spectrum-global-color-static-white))}#tip{border-top-color:var(--spectrum-tooltip-background-color,var(--spectrum-global-color-static-gray-700))}.spectrum-Tooltip--error,:host([variant=negative]){background-color:var(--spectrum-tooltip-negative-background-color,var(--spectrum-global-color-static-red-700))}.spectrum-Tooltip--error #tip,:host([variant=negative]) #tip{border-top-color:var(--spectrum-tooltip-negative-background-color,var(--spectrum-global-color-static-red-700))}.spectrum-Tooltip--help,:host([variant=info]){background-color:var(--spectrum-tooltip-info-background-color,var(--spectrum-global-color-static-blue-700))}.spectrum-Tooltip--help #tip,:host([variant=info]) #tip{border-top-color:var(--spectrum-tooltip-info-background-color,var(--spectrum-global-color-static-blue-700))}.spectrum-Tooltip--success,:host([variant=positive]){background-color:var(--spectrum-tooltip-positive-background-color,var(--spectrum-global-color-static-green-700))}.spectrum-Tooltip--success #tip,:host([variant=positive]) #tip{border-top-color:var(--spectrum-tooltip-positive-background-color,var(--spectrum-global-color-static-green-700))}\n`"
261
+ "default": "css`\n:host{--spectrum-overlay-animation-distance:var(\n--spectrum-picker-m-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-tooltip-target-offset:3px;--spectrum-tooltip-tip-width:var(\n--spectrum-tooltip-tip-height,var(--spectrum-global-dimension-size-50)\n)}:host{-webkit-font-smoothing:antialiased;align-items:center;border-radius:var(\n--spectrum-tooltip-border-radius,var(--spectrum-global-dimension-size-50)\n);box-sizing:border-box;display:inline-flex;flex-direction:row;font-size:var(\n--spectrum-tooltip-text-size,var(--spectrum-global-dimension-font-size-75)\n);font-weight:var(\n--spectrum-tooltip-text-font-weight,var(--spectrum-global-font-weight-regular)\n);left:0;line-height:var(\n--spectrum-tooltip-text-line-height,var(--spectrum-alias-component-text-line-height)\n);max-width:var(\n--spectrum-tooltip-max-width,var(--spectrum-global-dimension-size-2000)\n);min-height:var(\n--spectrum-tooltip-min-height,var(--spectrum-global-dimension-size-300)\n);padding:var(\n--spectrum-tooltip-padding-top,var(--spectrum-global-dimension-size-50)\n) var(\n--spectrum-tooltip-padding-x,var(--spectrum-global-dimension-size-125)\n);position:relative;top:0;vertical-align:top;width:auto;word-break:break-word}:host{cursor:default;-webkit-user-select:none;user-select:none}p{margin:0}#tip{border-bottom:var(\n--spectrum-tooltip-tip-width,var(--spectrum-global-dimension-size-100)\n) solid transparent;border-left:var(\n--spectrum-tooltip-tip-width,var(--spectrum-global-dimension-size-100)\n) solid transparent;border-right:var(\n--spectrum-tooltip-tip-width,var(--spectrum-global-dimension-size-100)\n) solid transparent;border-top-style:solid;border-top-width:var(\n--spectrum-tooltip-tip-width,var(--spectrum-global-dimension-size-100)\n);height:0;position:absolute;width:0}:host([placement*=left]) #tip,:host([placement*=right]) #tip{margin-top:calc(-1*var(--spectrum-tooltip-tip-width, var(--spectrum-global-dimension-size-100)));top:50%}:host([placement*=right]){margin-left:var(\n--spectrum-tooltip-target-offset\n)}:host([placement*=right]) #tip{right:100%;transform:rotate(90deg)}:host([placement*=left]){margin-right:var(\n--spectrum-tooltip-target-offset\n)}:host([placement*=left]) #tip{left:100%;transform:rotate(-90deg)}:host([placement*=top]){margin-bottom:var(\n--spectrum-tooltip-target-offset\n)}:host([placement*=top]) #tip{top:100%}:host([placement*=bottom]){margin-top:var(\n--spectrum-tooltip-target-offset\n)}:host([placement*=bottom]) #tip{bottom:100%;transform:rotate(-180deg)}:host([placement*=bottom]) #tip,:host([placement*=top]) #tip{left:50%;margin-left:calc(-1*var(--spectrum-tooltip-tip-width, var(--spectrum-global-dimension-size-100)))}:host([dir=ltr]) ::slotted([slot=icon]){margin-left:calc(var(\n--spectrum-tooltip-icon-margin-x,\nvar(--spectrum-global-dimension-size-100)\n) - var(\n--spectrum-tooltip-padding-x,\nvar(--spectrum-global-dimension-size-125)\n))}:host([dir=rtl]) ::slotted([slot=icon]){margin-right:calc(var(\n--spectrum-tooltip-icon-margin-x,\nvar(--spectrum-global-dimension-size-100)\n) - var(\n--spectrum-tooltip-padding-x,\nvar(--spectrum-global-dimension-size-125)\n))}:host([dir=ltr]) ::slotted([slot=icon]){margin-right:var(\n--spectrum-tooltip-icon-margin-x,var(--spectrum-global-dimension-size-100)\n)}:host([dir=rtl]) ::slotted([slot=icon]){margin-left:var(\n--spectrum-tooltip-icon-margin-x,var(--spectrum-global-dimension-size-100)\n)}::slotted([slot=icon]){align-self:flex-start;flex-shrink:0;height:var(\n--spectrum-tooltip-icon-size,var(--spectrum-global-dimension-size-175)\n);margin-top:1px;width:var(\n--spectrum-tooltip-icon-size,var(--spectrum-global-dimension-size-175)\n)}#label{line-height:var(\n--spectrum-tooltip-text-line-height,var(--spectrum-alias-component-text-line-height)\n)}:host{background-color:var(\n--spectrum-tooltip-background-color,var(--spectrum-global-color-static-gray-700)\n);color:var(\n--spectrum-tooltip-text-color,var(--spectrum-global-color-static-white)\n)}#tip{border-top-color:var(\n--spectrum-tooltip-background-color,var(--spectrum-global-color-static-gray-700)\n)}.spectrum-Tooltip--error,:host([variant=negative]){background-color:var(\n--spectrum-tooltip-negative-background-color,var(--spectrum-global-color-static-red-700)\n)}.spectrum-Tooltip--error #tip,:host([variant=negative]) #tip{border-top-color:var(\n--spectrum-tooltip-negative-background-color,var(--spectrum-global-color-static-red-700)\n)}.spectrum-Tooltip--help,:host([variant=info]){background-color:var(\n--spectrum-tooltip-info-background-color,var(--spectrum-global-color-static-blue-700)\n)}.spectrum-Tooltip--help #tip,:host([variant=info]) #tip{border-top-color:var(\n--spectrum-tooltip-info-background-color,var(--spectrum-global-color-static-blue-700)\n)}.spectrum-Tooltip--success,:host([variant=positive]){background-color:var(\n--spectrum-tooltip-positive-background-color,var(--spectrum-global-color-static-green-700)\n)}.spectrum-Tooltip--success #tip,:host([variant=positive]) #tip{border-top-color:var(\n--spectrum-tooltip-positive-background-color,var(--spectrum-global-color-static-green-700)\n)}\n`"
262
262
  }
263
263
  ],
264
264
  "exports": [
@@ -279,7 +279,7 @@
279
279
  {
280
280
  "kind": "variable",
281
281
  "name": "styles",
282
- "default": "css`\n:host{--spectrum-overlay-animation-distance:var(--spectrum-picker-m-popover-offset-y,var(--spectrum-global-dimension-size-75));visibility:hidden;opacity:0;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);pointer-events:none}:host([open]){visibility:visible;opacity:1;transition-delay:0ms;pointer-events:auto}: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-tooltip-target-offset:3px;--spectrum-tooltip-tip-width:var(--spectrum-tooltip-tip-height,var(--spectrum-global-dimension-size-50));position:relative;left:0;top:0;display:inline-flex;flex-direction:row;align-items:center;box-sizing:border-box;vertical-align:top;width:auto;padding:var(--spectrum-tooltip-padding-top,var(--spectrum-global-dimension-size-50)) var(--spectrum-tooltip-padding-x,var(--spectrum-global-dimension-size-125));border-radius:var(--spectrum-tooltip-border-radius,var(--spectrum-global-dimension-size-50));min-height:var(--spectrum-tooltip-min-height,var(--spectrum-global-dimension-size-300));max-width:var(--spectrum-tooltip-max-width,var(--spectrum-global-dimension-size-2000));font-size:var(--spectrum-tooltip-text-size,var(--spectrum-global-dimension-font-size-75));font-weight:var(--spectrum-tooltip-text-font-weight,var(--spectrum-global-font-weight-regular));line-height:var(--spectrum-tooltip-text-line-height,var(--spectrum-alias-component-text-line-height));word-break:break-word;-webkit-font-smoothing:antialiased;cursor:default;-webkit-user-select:none;user-select:none}p{margin:0}#tip{position:absolute;height:0;width:0;border-top-width:var(--spectrum-tooltip-tip-width,var(--spectrum-global-dimension-size-100));border-top-style:solid;border-left:var(--spectrum-tooltip-tip-width,var(--spectrum-global-dimension-size-100)) solid transparent;border-right:var(--spectrum-tooltip-tip-width,var(--spectrum-global-dimension-size-100)) solid transparent;border-bottom:var(--spectrum-tooltip-tip-width,var(--spectrum-global-dimension-size-100)) solid transparent}:host([placement*=left]) #tip,:host([placement*=right]) #tip{top:50%;margin-top:calc(-1*var(--spectrum-tooltip-tip-width, var(--spectrum-global-dimension-size-100)))}:host([placement*=right]){margin-left:var(--spectrum-tooltip-target-offset)}:host([placement*=right]) #tip{right:100%;transform:rotate(90deg)}:host([placement*=left]){margin-right:var(--spectrum-tooltip-target-offset)}:host([placement*=left]) #tip{left:100%;transform:rotate(-90deg)}:host([placement*=top]){margin-bottom:var(--spectrum-tooltip-target-offset)}:host([placement*=top]) #tip{top:100%}:host([placement*=bottom]){margin-top:var(--spectrum-tooltip-target-offset)}:host([placement*=bottom]) #tip{bottom:100%;transform:rotate(-180deg)}:host([placement*=bottom]) #tip,:host([placement*=top]) #tip{left:50%;margin-left:calc(-1*var(--spectrum-tooltip-tip-width, var(--spectrum-global-dimension-size-100)))}:host([dir=ltr]) ::slotted([slot=icon]){margin-left:calc(var(--spectrum-tooltip-icon-margin-x,\nvar(--spectrum-global-dimension-size-100)) - var(--spectrum-tooltip-padding-x,\nvar(--spectrum-global-dimension-size-125)))}:host([dir=rtl]) ::slotted([slot=icon]){margin-right:calc(var(--spectrum-tooltip-icon-margin-x,\nvar(--spectrum-global-dimension-size-100)) - var(--spectrum-tooltip-padding-x,\nvar(--spectrum-global-dimension-size-125)))}:host([dir=ltr]) ::slotted([slot=icon]){margin-right:var(--spectrum-tooltip-icon-margin-x,var(--spectrum-global-dimension-size-100))}:host([dir=rtl]) ::slotted([slot=icon]){margin-left:var(--spectrum-tooltip-icon-margin-x,var(--spectrum-global-dimension-size-100))}::slotted([slot=icon]){width:var(--spectrum-tooltip-icon-size,var(--spectrum-global-dimension-size-175));height:var(--spectrum-tooltip-icon-size,var(--spectrum-global-dimension-size-175));align-self:flex-start;flex-shrink:0;margin-top:1px}#label{line-height:var(--spectrum-tooltip-text-line-height,var(--spectrum-alias-component-text-line-height))}:host{background-color:var(--spectrum-tooltip-background-color,var(--spectrum-global-color-static-gray-700));color:var(--spectrum-tooltip-text-color,var(--spectrum-global-color-static-white))}#tip{border-top-color:var(--spectrum-tooltip-background-color,var(--spectrum-global-color-static-gray-700))}.spectrum-Tooltip--error,:host([variant=negative]){background-color:var(--spectrum-tooltip-negative-background-color,var(--spectrum-global-color-static-red-700))}.spectrum-Tooltip--error #tip,:host([variant=negative]) #tip{border-top-color:var(--spectrum-tooltip-negative-background-color,var(--spectrum-global-color-static-red-700))}.spectrum-Tooltip--help,:host([variant=info]){background-color:var(--spectrum-tooltip-info-background-color,var(--spectrum-global-color-static-blue-700))}.spectrum-Tooltip--help #tip,:host([variant=info]) #tip{border-top-color:var(--spectrum-tooltip-info-background-color,var(--spectrum-global-color-static-blue-700))}.spectrum-Tooltip--success,:host([variant=positive]){background-color:var(--spectrum-tooltip-positive-background-color,var(--spectrum-global-color-static-green-700))}.spectrum-Tooltip--success #tip,:host([variant=positive]) #tip{border-top-color:var(--spectrum-tooltip-positive-background-color,var(--spectrum-global-color-static-green-700))}#tip{border:none}:host([placement*=bottom]) #tip,:host([placement*=left]) #tip,:host([placement*=right]) #tip{transform:none}#tip:after{content:\"\";position:absolute;left:0;width:0;height:0;border-top-color:transparent;border:var(--spectrum-tooltip-tip-height,var(--spectrum-global-dimension-size-50)) solid transparent;border-top:var(--spectrum-tooltip-tip-height,var(--spectrum-global-dimension-size-50)) solid var(--spectrum-tooltip-background-color,var(--spectrum-global-color-static-gray-700))}:host([placement*=bottom]) #tip:after{bottom:100%;transform:scaleY(-1)}:host([placement*=left]) #tip:after{left:100%;transform:rotate(-90deg)}:host([placement*=right]) #tip:after{right:100%;left:auto;transform:rotate(90deg)}:host([variant=negative]) #tip:after{border-top-color:var(--spectrum-tooltip-negative-background-color,var(--spectrum-global-color-static-red-700))}:host([variant=info]) #tip:after{border-top-color:var(--spectrum-tooltip-info-background-color,var(--spectrum-global-color-static-blue-700))}:host([variant=positive]) #tip:after{border-top-color:var(--spectrum-tooltip-positive-background-color,var(--spectrum-global-color-static-green-700))}\n`"
282
+ "default": "css`\n:host{--spectrum-overlay-animation-distance:var(\n--spectrum-picker-m-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-tooltip-target-offset:3px;--spectrum-tooltip-tip-width:var(\n--spectrum-tooltip-tip-height,var(--spectrum-global-dimension-size-50)\n)}:host{-webkit-font-smoothing:antialiased;align-items:center;border-radius:var(\n--spectrum-tooltip-border-radius,var(--spectrum-global-dimension-size-50)\n);box-sizing:border-box;display:inline-flex;flex-direction:row;font-size:var(\n--spectrum-tooltip-text-size,var(--spectrum-global-dimension-font-size-75)\n);font-weight:var(\n--spectrum-tooltip-text-font-weight,var(--spectrum-global-font-weight-regular)\n);left:0;line-height:var(\n--spectrum-tooltip-text-line-height,var(--spectrum-alias-component-text-line-height)\n);max-width:var(\n--spectrum-tooltip-max-width,var(--spectrum-global-dimension-size-2000)\n);min-height:var(\n--spectrum-tooltip-min-height,var(--spectrum-global-dimension-size-300)\n);padding:var(\n--spectrum-tooltip-padding-top,var(--spectrum-global-dimension-size-50)\n) var(\n--spectrum-tooltip-padding-x,var(--spectrum-global-dimension-size-125)\n);position:relative;top:0;vertical-align:top;width:auto;word-break:break-word}:host{cursor:default;-webkit-user-select:none;user-select:none}p{margin:0}#tip{border-bottom:var(\n--spectrum-tooltip-tip-width,var(--spectrum-global-dimension-size-100)\n) solid transparent;border-left:var(\n--spectrum-tooltip-tip-width,var(--spectrum-global-dimension-size-100)\n) solid transparent;border-right:var(\n--spectrum-tooltip-tip-width,var(--spectrum-global-dimension-size-100)\n) solid transparent;border-top-style:solid;border-top-width:var(\n--spectrum-tooltip-tip-width,var(--spectrum-global-dimension-size-100)\n);height:0;position:absolute;width:0}:host([placement*=left]) #tip,:host([placement*=right]) #tip{margin-top:calc(-1*var(--spectrum-tooltip-tip-width, var(--spectrum-global-dimension-size-100)));top:50%}:host([placement*=right]){margin-left:var(\n--spectrum-tooltip-target-offset\n)}:host([placement*=right]) #tip{right:100%;transform:rotate(90deg)}:host([placement*=left]){margin-right:var(\n--spectrum-tooltip-target-offset\n)}:host([placement*=left]) #tip{left:100%;transform:rotate(-90deg)}:host([placement*=top]){margin-bottom:var(\n--spectrum-tooltip-target-offset\n)}:host([placement*=top]) #tip{top:100%}:host([placement*=bottom]){margin-top:var(\n--spectrum-tooltip-target-offset\n)}:host([placement*=bottom]) #tip{bottom:100%;transform:rotate(-180deg)}:host([placement*=bottom]) #tip,:host([placement*=top]) #tip{left:50%;margin-left:calc(-1*var(--spectrum-tooltip-tip-width, var(--spectrum-global-dimension-size-100)))}:host([dir=ltr]) ::slotted([slot=icon]){margin-left:calc(var(\n--spectrum-tooltip-icon-margin-x,\nvar(--spectrum-global-dimension-size-100)\n) - var(\n--spectrum-tooltip-padding-x,\nvar(--spectrum-global-dimension-size-125)\n))}:host([dir=rtl]) ::slotted([slot=icon]){margin-right:calc(var(\n--spectrum-tooltip-icon-margin-x,\nvar(--spectrum-global-dimension-size-100)\n) - var(\n--spectrum-tooltip-padding-x,\nvar(--spectrum-global-dimension-size-125)\n))}:host([dir=ltr]) ::slotted([slot=icon]){margin-right:var(\n--spectrum-tooltip-icon-margin-x,var(--spectrum-global-dimension-size-100)\n)}:host([dir=rtl]) ::slotted([slot=icon]){margin-left:var(\n--spectrum-tooltip-icon-margin-x,var(--spectrum-global-dimension-size-100)\n)}::slotted([slot=icon]){align-self:flex-start;flex-shrink:0;height:var(\n--spectrum-tooltip-icon-size,var(--spectrum-global-dimension-size-175)\n);margin-top:1px;width:var(\n--spectrum-tooltip-icon-size,var(--spectrum-global-dimension-size-175)\n)}#label{line-height:var(\n--spectrum-tooltip-text-line-height,var(--spectrum-alias-component-text-line-height)\n)}:host{background-color:var(\n--spectrum-tooltip-background-color,var(--spectrum-global-color-static-gray-700)\n);color:var(\n--spectrum-tooltip-text-color,var(--spectrum-global-color-static-white)\n)}#tip{border-top-color:var(\n--spectrum-tooltip-background-color,var(--spectrum-global-color-static-gray-700)\n)}.spectrum-Tooltip--error,:host([variant=negative]){background-color:var(\n--spectrum-tooltip-negative-background-color,var(--spectrum-global-color-static-red-700)\n)}.spectrum-Tooltip--error #tip,:host([variant=negative]) #tip{border-top-color:var(\n--spectrum-tooltip-negative-background-color,var(--spectrum-global-color-static-red-700)\n)}.spectrum-Tooltip--help,:host([variant=info]){background-color:var(\n--spectrum-tooltip-info-background-color,var(--spectrum-global-color-static-blue-700)\n)}.spectrum-Tooltip--help #tip,:host([variant=info]) #tip{border-top-color:var(\n--spectrum-tooltip-info-background-color,var(--spectrum-global-color-static-blue-700)\n)}.spectrum-Tooltip--success,:host([variant=positive]){background-color:var(\n--spectrum-tooltip-positive-background-color,var(--spectrum-global-color-static-green-700)\n)}.spectrum-Tooltip--success #tip,:host([variant=positive]) #tip{border-top-color:var(\n--spectrum-tooltip-positive-background-color,var(--spectrum-global-color-static-green-700)\n)}#tip{border:none}:host([placement*=bottom]) #tip,:host([placement*=left]) #tip,:host([placement*=right]) #tip{transform:none}#tip:after{border:var(\n--spectrum-tooltip-tip-height,var(--spectrum-global-dimension-size-50)\n) solid transparent;content:\"\";height:0;left:0;position:absolute;width:0}:host([placement*=bottom]) #tip:after{bottom:100%;transform:scaleY(-1)}:host([placement*=left]) #tip:after{left:100%;transform:rotate(-90deg)}:host([placement*=right]) #tip:after{left:auto;right:100%;transform:rotate(90deg)}:host([placement]) #tip:after{border-top-color:var(\n--spectrum-tooltip-background-color,var(--spectrum-global-color-static-gray-700)\n)}:host([variant=negative]) #tip:after{border-top-color:var(\n--spectrum-tooltip-negative-background-color,var(--spectrum-global-color-static-red-700)\n)}:host([variant=info]) #tip:after{border-top-color:var(\n--spectrum-tooltip-info-background-color,var(--spectrum-global-color-static-blue-700)\n)}:host([variant=positive]) #tip:after{border-top-color:var(\n--spectrum-tooltip-positive-background-color,var(--spectrum-global-color-static-green-700)\n)}\n`"
283
283
  }
284
284
  ],
285
285
  "exports": [
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@spectrum-web-components/tooltip",
3
- "version": "0.8.16",
3
+ "version": "0.8.18-lit-next.24+c727331cf",
4
4
  "publishConfig": {
5
5
  "access": "public"
6
6
  },
@@ -44,8 +44,8 @@
44
44
  "lit-html"
45
45
  ],
46
46
  "dependencies": {
47
- "@spectrum-web-components/base": "^0.4.5",
48
- "@spectrum-web-components/overlay": "^0.11.14",
47
+ "@spectrum-web-components/base": "^0.4.6-lit-next.161+c727331cf",
48
+ "@spectrum-web-components/overlay": "^0.11.16-lit-next.24+c727331cf",
49
49
  "tslib": "^2.0.0"
50
50
  },
51
51
  "devDependencies": {
@@ -56,5 +56,5 @@
56
56
  "sideEffects": [
57
57
  "./sp-*.js"
58
58
  ],
59
- "gitHead": "de3151b9e940121f518f1d94d2601cb87ba95ddb"
59
+ "gitHead": "c727331cf98a963e16917d9a47d9df4608fff366"
60
60
  }
@@ -11,11 +11,83 @@ governing permissions and limitations under the License.
11
11
  */
12
12
  import { css } from '@spectrum-web-components/base';
13
13
  const styles = css `
14
- :host{--spectrum-overlay-animation-distance:var(--spectrum-picker-m-popover-offset-y,var(--spectrum-global-dimension-size-75));visibility:hidden;opacity:0;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);pointer-events:none}:host([open]){visibility:visible;opacity:1;transition-delay:0ms;pointer-events:auto}: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-tooltip-target-offset:3px;--spectrum-tooltip-tip-width:var(--spectrum-tooltip-tip-height,var(--spectrum-global-dimension-size-50));position:relative;left:0;top:0;display:inline-flex;flex-direction:row;align-items:center;box-sizing:border-box;vertical-align:top;width:auto;padding:var(--spectrum-tooltip-padding-top,var(--spectrum-global-dimension-size-50)) var(--spectrum-tooltip-padding-x,var(--spectrum-global-dimension-size-125));border-radius:var(--spectrum-tooltip-border-radius,var(--spectrum-global-dimension-size-50));min-height:var(--spectrum-tooltip-min-height,var(--spectrum-global-dimension-size-300));max-width:var(--spectrum-tooltip-max-width,var(--spectrum-global-dimension-size-2000));font-size:var(--spectrum-tooltip-text-size,var(--spectrum-global-dimension-font-size-75));font-weight:var(--spectrum-tooltip-text-font-weight,var(--spectrum-global-font-weight-regular));line-height:var(--spectrum-tooltip-text-line-height,var(--spectrum-alias-component-text-line-height));word-break:break-word;-webkit-font-smoothing:antialiased;cursor:default;-webkit-user-select:none;user-select:none}p{margin:0}#tip{position:absolute;height:0;width:0;border-top-width:var(--spectrum-tooltip-tip-width,var(--spectrum-global-dimension-size-100));border-top-style:solid;border-left:var(--spectrum-tooltip-tip-width,var(--spectrum-global-dimension-size-100)) solid transparent;border-right:var(--spectrum-tooltip-tip-width,var(--spectrum-global-dimension-size-100)) solid transparent;border-bottom:var(--spectrum-tooltip-tip-width,var(--spectrum-global-dimension-size-100)) solid transparent}:host([placement*=left]) #tip,:host([placement*=right]) #tip{top:50%;margin-top:calc(-1*var(--spectrum-tooltip-tip-width, var(--spectrum-global-dimension-size-100)))}:host([placement*=right]){margin-left:var(--spectrum-tooltip-target-offset)}:host([placement*=right]) #tip{right:100%;transform:rotate(90deg)}:host([placement*=left]){margin-right:var(--spectrum-tooltip-target-offset)}:host([placement*=left]) #tip{left:100%;transform:rotate(-90deg)}:host([placement*=top]){margin-bottom:var(--spectrum-tooltip-target-offset)}:host([placement*=top]) #tip{top:100%}:host([placement*=bottom]){margin-top:var(--spectrum-tooltip-target-offset)}:host([placement*=bottom]) #tip{bottom:100%;transform:rotate(-180deg)}:host([placement*=bottom]) #tip,:host([placement*=top]) #tip{left:50%;margin-left:calc(-1*var(--spectrum-tooltip-tip-width, var(--spectrum-global-dimension-size-100)))}:host([dir=ltr]) ::slotted([slot=icon]){margin-left:calc(var(--spectrum-tooltip-icon-margin-x,
15
- var(--spectrum-global-dimension-size-100)) - var(--spectrum-tooltip-padding-x,
16
- var(--spectrum-global-dimension-size-125)))}:host([dir=rtl]) ::slotted([slot=icon]){margin-right:calc(var(--spectrum-tooltip-icon-margin-x,
17
- var(--spectrum-global-dimension-size-100)) - var(--spectrum-tooltip-padding-x,
18
- var(--spectrum-global-dimension-size-125)))}:host([dir=ltr]) ::slotted([slot=icon]){margin-right:var(--spectrum-tooltip-icon-margin-x,var(--spectrum-global-dimension-size-100))}:host([dir=rtl]) ::slotted([slot=icon]){margin-left:var(--spectrum-tooltip-icon-margin-x,var(--spectrum-global-dimension-size-100))}::slotted([slot=icon]){width:var(--spectrum-tooltip-icon-size,var(--spectrum-global-dimension-size-175));height:var(--spectrum-tooltip-icon-size,var(--spectrum-global-dimension-size-175));align-self:flex-start;flex-shrink:0;margin-top:1px}#label{line-height:var(--spectrum-tooltip-text-line-height,var(--spectrum-alias-component-text-line-height))}:host{background-color:var(--spectrum-tooltip-background-color,var(--spectrum-global-color-static-gray-700));color:var(--spectrum-tooltip-text-color,var(--spectrum-global-color-static-white))}#tip{border-top-color:var(--spectrum-tooltip-background-color,var(--spectrum-global-color-static-gray-700))}.spectrum-Tooltip--error,:host([variant=negative]){background-color:var(--spectrum-tooltip-negative-background-color,var(--spectrum-global-color-static-red-700))}.spectrum-Tooltip--error #tip,:host([variant=negative]) #tip{border-top-color:var(--spectrum-tooltip-negative-background-color,var(--spectrum-global-color-static-red-700))}.spectrum-Tooltip--help,:host([variant=info]){background-color:var(--spectrum-tooltip-info-background-color,var(--spectrum-global-color-static-blue-700))}.spectrum-Tooltip--help #tip,:host([variant=info]) #tip{border-top-color:var(--spectrum-tooltip-info-background-color,var(--spectrum-global-color-static-blue-700))}.spectrum-Tooltip--success,:host([variant=positive]){background-color:var(--spectrum-tooltip-positive-background-color,var(--spectrum-global-color-static-green-700))}.spectrum-Tooltip--success #tip,:host([variant=positive]) #tip{border-top-color:var(--spectrum-tooltip-positive-background-color,var(--spectrum-global-color-static-green-700))}
14
+ :host{--spectrum-overlay-animation-distance:var(
15
+ --spectrum-picker-m-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-tooltip-target-offset:3px;--spectrum-tooltip-tip-width:var(
17
+ --spectrum-tooltip-tip-height,var(--spectrum-global-dimension-size-50)
18
+ )}:host{-webkit-font-smoothing:antialiased;align-items:center;border-radius:var(
19
+ --spectrum-tooltip-border-radius,var(--spectrum-global-dimension-size-50)
20
+ );box-sizing:border-box;display:inline-flex;flex-direction:row;font-size:var(
21
+ --spectrum-tooltip-text-size,var(--spectrum-global-dimension-font-size-75)
22
+ );font-weight:var(
23
+ --spectrum-tooltip-text-font-weight,var(--spectrum-global-font-weight-regular)
24
+ );left:0;line-height:var(
25
+ --spectrum-tooltip-text-line-height,var(--spectrum-alias-component-text-line-height)
26
+ );max-width:var(
27
+ --spectrum-tooltip-max-width,var(--spectrum-global-dimension-size-2000)
28
+ );min-height:var(
29
+ --spectrum-tooltip-min-height,var(--spectrum-global-dimension-size-300)
30
+ );padding:var(
31
+ --spectrum-tooltip-padding-top,var(--spectrum-global-dimension-size-50)
32
+ ) var(
33
+ --spectrum-tooltip-padding-x,var(--spectrum-global-dimension-size-125)
34
+ );position:relative;top:0;vertical-align:top;width:auto;word-break:break-word}:host{cursor:default;-webkit-user-select:none;user-select:none}p{margin:0}#tip{border-bottom:var(
35
+ --spectrum-tooltip-tip-width,var(--spectrum-global-dimension-size-100)
36
+ ) solid transparent;border-left:var(
37
+ --spectrum-tooltip-tip-width,var(--spectrum-global-dimension-size-100)
38
+ ) solid transparent;border-right:var(
39
+ --spectrum-tooltip-tip-width,var(--spectrum-global-dimension-size-100)
40
+ ) solid transparent;border-top-style:solid;border-top-width:var(
41
+ --spectrum-tooltip-tip-width,var(--spectrum-global-dimension-size-100)
42
+ );height:0;position:absolute;width:0}:host([placement*=left]) #tip,:host([placement*=right]) #tip{margin-top:calc(-1*var(--spectrum-tooltip-tip-width, var(--spectrum-global-dimension-size-100)));top:50%}:host([placement*=right]){margin-left:var(
43
+ --spectrum-tooltip-target-offset
44
+ )}:host([placement*=right]) #tip{right:100%;transform:rotate(90deg)}:host([placement*=left]){margin-right:var(
45
+ --spectrum-tooltip-target-offset
46
+ )}:host([placement*=left]) #tip{left:100%;transform:rotate(-90deg)}:host([placement*=top]){margin-bottom:var(
47
+ --spectrum-tooltip-target-offset
48
+ )}:host([placement*=top]) #tip{top:100%}:host([placement*=bottom]){margin-top:var(
49
+ --spectrum-tooltip-target-offset
50
+ )}:host([placement*=bottom]) #tip{bottom:100%;transform:rotate(-180deg)}:host([placement*=bottom]) #tip,:host([placement*=top]) #tip{left:50%;margin-left:calc(-1*var(--spectrum-tooltip-tip-width, var(--spectrum-global-dimension-size-100)))}:host([dir=ltr]) ::slotted([slot=icon]){margin-left:calc(var(
51
+ --spectrum-tooltip-icon-margin-x,
52
+ var(--spectrum-global-dimension-size-100)
53
+ ) - var(
54
+ --spectrum-tooltip-padding-x,
55
+ var(--spectrum-global-dimension-size-125)
56
+ ))}:host([dir=rtl]) ::slotted([slot=icon]){margin-right:calc(var(
57
+ --spectrum-tooltip-icon-margin-x,
58
+ var(--spectrum-global-dimension-size-100)
59
+ ) - var(
60
+ --spectrum-tooltip-padding-x,
61
+ var(--spectrum-global-dimension-size-125)
62
+ ))}:host([dir=ltr]) ::slotted([slot=icon]){margin-right:var(
63
+ --spectrum-tooltip-icon-margin-x,var(--spectrum-global-dimension-size-100)
64
+ )}:host([dir=rtl]) ::slotted([slot=icon]){margin-left:var(
65
+ --spectrum-tooltip-icon-margin-x,var(--spectrum-global-dimension-size-100)
66
+ )}::slotted([slot=icon]){align-self:flex-start;flex-shrink:0;height:var(
67
+ --spectrum-tooltip-icon-size,var(--spectrum-global-dimension-size-175)
68
+ );margin-top:1px;width:var(
69
+ --spectrum-tooltip-icon-size,var(--spectrum-global-dimension-size-175)
70
+ )}#label{line-height:var(
71
+ --spectrum-tooltip-text-line-height,var(--spectrum-alias-component-text-line-height)
72
+ )}:host{background-color:var(
73
+ --spectrum-tooltip-background-color,var(--spectrum-global-color-static-gray-700)
74
+ );color:var(
75
+ --spectrum-tooltip-text-color,var(--spectrum-global-color-static-white)
76
+ )}#tip{border-top-color:var(
77
+ --spectrum-tooltip-background-color,var(--spectrum-global-color-static-gray-700)
78
+ )}.spectrum-Tooltip--error,:host([variant=negative]){background-color:var(
79
+ --spectrum-tooltip-negative-background-color,var(--spectrum-global-color-static-red-700)
80
+ )}.spectrum-Tooltip--error #tip,:host([variant=negative]) #tip{border-top-color:var(
81
+ --spectrum-tooltip-negative-background-color,var(--spectrum-global-color-static-red-700)
82
+ )}.spectrum-Tooltip--help,:host([variant=info]){background-color:var(
83
+ --spectrum-tooltip-info-background-color,var(--spectrum-global-color-static-blue-700)
84
+ )}.spectrum-Tooltip--help #tip,:host([variant=info]) #tip{border-top-color:var(
85
+ --spectrum-tooltip-info-background-color,var(--spectrum-global-color-static-blue-700)
86
+ )}.spectrum-Tooltip--success,:host([variant=positive]){background-color:var(
87
+ --spectrum-tooltip-positive-background-color,var(--spectrum-global-color-static-green-700)
88
+ )}.spectrum-Tooltip--success #tip,:host([variant=positive]) #tip{border-top-color:var(
89
+ --spectrum-tooltip-positive-background-color,var(--spectrum-global-color-static-green-700)
90
+ )}
19
91
  `;
20
92
  export default styles;
21
93
  //# sourceMappingURL=spectrum-tooltip.css.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"spectrum-tooltip.css.js","sourceRoot":"","sources":["spectrum-tooltip.css.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;EAUE;AACF,OAAO,EAAE,GAAG,EAAE,MAAM,+BAA+B,CAAC;AACpD,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;CAMjB,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(--spectrum-picker-m-popover-offset-y,var(--spectrum-global-dimension-size-75));visibility:hidden;opacity:0;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);pointer-events:none}:host([open]){visibility:visible;opacity:1;transition-delay:0ms;pointer-events:auto}: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-tooltip-target-offset:3px;--spectrum-tooltip-tip-width:var(--spectrum-tooltip-tip-height,var(--spectrum-global-dimension-size-50));position:relative;left:0;top:0;display:inline-flex;flex-direction:row;align-items:center;box-sizing:border-box;vertical-align:top;width:auto;padding:var(--spectrum-tooltip-padding-top,var(--spectrum-global-dimension-size-50)) var(--spectrum-tooltip-padding-x,var(--spectrum-global-dimension-size-125));border-radius:var(--spectrum-tooltip-border-radius,var(--spectrum-global-dimension-size-50));min-height:var(--spectrum-tooltip-min-height,var(--spectrum-global-dimension-size-300));max-width:var(--spectrum-tooltip-max-width,var(--spectrum-global-dimension-size-2000));font-size:var(--spectrum-tooltip-text-size,var(--spectrum-global-dimension-font-size-75));font-weight:var(--spectrum-tooltip-text-font-weight,var(--spectrum-global-font-weight-regular));line-height:var(--spectrum-tooltip-text-line-height,var(--spectrum-alias-component-text-line-height));word-break:break-word;-webkit-font-smoothing:antialiased;cursor:default;-webkit-user-select:none;user-select:none}p{margin:0}#tip{position:absolute;height:0;width:0;border-top-width:var(--spectrum-tooltip-tip-width,var(--spectrum-global-dimension-size-100));border-top-style:solid;border-left:var(--spectrum-tooltip-tip-width,var(--spectrum-global-dimension-size-100)) solid transparent;border-right:var(--spectrum-tooltip-tip-width,var(--spectrum-global-dimension-size-100)) solid transparent;border-bottom:var(--spectrum-tooltip-tip-width,var(--spectrum-global-dimension-size-100)) solid transparent}:host([placement*=left]) #tip,:host([placement*=right]) #tip{top:50%;margin-top:calc(-1*var(--spectrum-tooltip-tip-width, var(--spectrum-global-dimension-size-100)))}:host([placement*=right]){margin-left:var(--spectrum-tooltip-target-offset)}:host([placement*=right]) #tip{right:100%;transform:rotate(90deg)}:host([placement*=left]){margin-right:var(--spectrum-tooltip-target-offset)}:host([placement*=left]) #tip{left:100%;transform:rotate(-90deg)}:host([placement*=top]){margin-bottom:var(--spectrum-tooltip-target-offset)}:host([placement*=top]) #tip{top:100%}:host([placement*=bottom]){margin-top:var(--spectrum-tooltip-target-offset)}:host([placement*=bottom]) #tip{bottom:100%;transform:rotate(-180deg)}:host([placement*=bottom]) #tip,:host([placement*=top]) #tip{left:50%;margin-left:calc(-1*var(--spectrum-tooltip-tip-width, var(--spectrum-global-dimension-size-100)))}:host([dir=ltr]) ::slotted([slot=icon]){margin-left:calc(var(--spectrum-tooltip-icon-margin-x,\nvar(--spectrum-global-dimension-size-100)) - var(--spectrum-tooltip-padding-x,\nvar(--spectrum-global-dimension-size-125)))}:host([dir=rtl]) ::slotted([slot=icon]){margin-right:calc(var(--spectrum-tooltip-icon-margin-x,\nvar(--spectrum-global-dimension-size-100)) - var(--spectrum-tooltip-padding-x,\nvar(--spectrum-global-dimension-size-125)))}:host([dir=ltr]) ::slotted([slot=icon]){margin-right:var(--spectrum-tooltip-icon-margin-x,var(--spectrum-global-dimension-size-100))}:host([dir=rtl]) ::slotted([slot=icon]){margin-left:var(--spectrum-tooltip-icon-margin-x,var(--spectrum-global-dimension-size-100))}::slotted([slot=icon]){width:var(--spectrum-tooltip-icon-size,var(--spectrum-global-dimension-size-175));height:var(--spectrum-tooltip-icon-size,var(--spectrum-global-dimension-size-175));align-self:flex-start;flex-shrink:0;margin-top:1px}#label{line-height:var(--spectrum-tooltip-text-line-height,var(--spectrum-alias-component-text-line-height))}:host{background-color:var(--spectrum-tooltip-background-color,var(--spectrum-global-color-static-gray-700));color:var(--spectrum-tooltip-text-color,var(--spectrum-global-color-static-white))}#tip{border-top-color:var(--spectrum-tooltip-background-color,var(--spectrum-global-color-static-gray-700))}.spectrum-Tooltip--error,:host([variant=negative]){background-color:var(--spectrum-tooltip-negative-background-color,var(--spectrum-global-color-static-red-700))}.spectrum-Tooltip--error #tip,:host([variant=negative]) #tip{border-top-color:var(--spectrum-tooltip-negative-background-color,var(--spectrum-global-color-static-red-700))}.spectrum-Tooltip--help,:host([variant=info]){background-color:var(--spectrum-tooltip-info-background-color,var(--spectrum-global-color-static-blue-700))}.spectrum-Tooltip--help #tip,:host([variant=info]) #tip{border-top-color:var(--spectrum-tooltip-info-background-color,var(--spectrum-global-color-static-blue-700))}.spectrum-Tooltip--success,:host([variant=positive]){background-color:var(--spectrum-tooltip-positive-background-color,var(--spectrum-global-color-static-green-700))}.spectrum-Tooltip--success #tip,:host([variant=positive]) #tip{border-top-color:var(--spectrum-tooltip-positive-background-color,var(--spectrum-global-color-static-green-700))}\n`;\nexport default styles;"]}
1
+ {"version":3,"file":"spectrum-tooltip.css.js","sourceRoot":"","sources":["spectrum-tooltip.css.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;EAUE;AACF,OAAO,EAAE,GAAG,EAAE,MAAM,+BAA+B,CAAC;AACpD,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA8EjB,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-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-tooltip-target-offset:3px;--spectrum-tooltip-tip-width:var(\n--spectrum-tooltip-tip-height,var(--spectrum-global-dimension-size-50)\n)}:host{-webkit-font-smoothing:antialiased;align-items:center;border-radius:var(\n--spectrum-tooltip-border-radius,var(--spectrum-global-dimension-size-50)\n);box-sizing:border-box;display:inline-flex;flex-direction:row;font-size:var(\n--spectrum-tooltip-text-size,var(--spectrum-global-dimension-font-size-75)\n);font-weight:var(\n--spectrum-tooltip-text-font-weight,var(--spectrum-global-font-weight-regular)\n);left:0;line-height:var(\n--spectrum-tooltip-text-line-height,var(--spectrum-alias-component-text-line-height)\n);max-width:var(\n--spectrum-tooltip-max-width,var(--spectrum-global-dimension-size-2000)\n);min-height:var(\n--spectrum-tooltip-min-height,var(--spectrum-global-dimension-size-300)\n);padding:var(\n--spectrum-tooltip-padding-top,var(--spectrum-global-dimension-size-50)\n) var(\n--spectrum-tooltip-padding-x,var(--spectrum-global-dimension-size-125)\n);position:relative;top:0;vertical-align:top;width:auto;word-break:break-word}:host{cursor:default;-webkit-user-select:none;user-select:none}p{margin:0}#tip{border-bottom:var(\n--spectrum-tooltip-tip-width,var(--spectrum-global-dimension-size-100)\n) solid transparent;border-left:var(\n--spectrum-tooltip-tip-width,var(--spectrum-global-dimension-size-100)\n) solid transparent;border-right:var(\n--spectrum-tooltip-tip-width,var(--spectrum-global-dimension-size-100)\n) solid transparent;border-top-style:solid;border-top-width:var(\n--spectrum-tooltip-tip-width,var(--spectrum-global-dimension-size-100)\n);height:0;position:absolute;width:0}:host([placement*=left]) #tip,:host([placement*=right]) #tip{margin-top:calc(-1*var(--spectrum-tooltip-tip-width, var(--spectrum-global-dimension-size-100)));top:50%}:host([placement*=right]){margin-left:var(\n--spectrum-tooltip-target-offset\n)}:host([placement*=right]) #tip{right:100%;transform:rotate(90deg)}:host([placement*=left]){margin-right:var(\n--spectrum-tooltip-target-offset\n)}:host([placement*=left]) #tip{left:100%;transform:rotate(-90deg)}:host([placement*=top]){margin-bottom:var(\n--spectrum-tooltip-target-offset\n)}:host([placement*=top]) #tip{top:100%}:host([placement*=bottom]){margin-top:var(\n--spectrum-tooltip-target-offset\n)}:host([placement*=bottom]) #tip{bottom:100%;transform:rotate(-180deg)}:host([placement*=bottom]) #tip,:host([placement*=top]) #tip{left:50%;margin-left:calc(-1*var(--spectrum-tooltip-tip-width, var(--spectrum-global-dimension-size-100)))}:host([dir=ltr]) ::slotted([slot=icon]){margin-left:calc(var(\n--spectrum-tooltip-icon-margin-x,\nvar(--spectrum-global-dimension-size-100)\n) - var(\n--spectrum-tooltip-padding-x,\nvar(--spectrum-global-dimension-size-125)\n))}:host([dir=rtl]) ::slotted([slot=icon]){margin-right:calc(var(\n--spectrum-tooltip-icon-margin-x,\nvar(--spectrum-global-dimension-size-100)\n) - var(\n--spectrum-tooltip-padding-x,\nvar(--spectrum-global-dimension-size-125)\n))}:host([dir=ltr]) ::slotted([slot=icon]){margin-right:var(\n--spectrum-tooltip-icon-margin-x,var(--spectrum-global-dimension-size-100)\n)}:host([dir=rtl]) ::slotted([slot=icon]){margin-left:var(\n--spectrum-tooltip-icon-margin-x,var(--spectrum-global-dimension-size-100)\n)}::slotted([slot=icon]){align-self:flex-start;flex-shrink:0;height:var(\n--spectrum-tooltip-icon-size,var(--spectrum-global-dimension-size-175)\n);margin-top:1px;width:var(\n--spectrum-tooltip-icon-size,var(--spectrum-global-dimension-size-175)\n)}#label{line-height:var(\n--spectrum-tooltip-text-line-height,var(--spectrum-alias-component-text-line-height)\n)}:host{background-color:var(\n--spectrum-tooltip-background-color,var(--spectrum-global-color-static-gray-700)\n);color:var(\n--spectrum-tooltip-text-color,var(--spectrum-global-color-static-white)\n)}#tip{border-top-color:var(\n--spectrum-tooltip-background-color,var(--spectrum-global-color-static-gray-700)\n)}.spectrum-Tooltip--error,:host([variant=negative]){background-color:var(\n--spectrum-tooltip-negative-background-color,var(--spectrum-global-color-static-red-700)\n)}.spectrum-Tooltip--error #tip,:host([variant=negative]) #tip{border-top-color:var(\n--spectrum-tooltip-negative-background-color,var(--spectrum-global-color-static-red-700)\n)}.spectrum-Tooltip--help,:host([variant=info]){background-color:var(\n--spectrum-tooltip-info-background-color,var(--spectrum-global-color-static-blue-700)\n)}.spectrum-Tooltip--help #tip,:host([variant=info]) #tip{border-top-color:var(\n--spectrum-tooltip-info-background-color,var(--spectrum-global-color-static-blue-700)\n)}.spectrum-Tooltip--success,:host([variant=positive]){background-color:var(\n--spectrum-tooltip-positive-background-color,var(--spectrum-global-color-static-green-700)\n)}.spectrum-Tooltip--success #tip,:host([variant=positive]) #tip{border-top-color:var(\n--spectrum-tooltip-positive-background-color,var(--spectrum-global-color-static-green-700)\n)}\n`;\nexport default styles;"]}
@@ -11,11 +11,93 @@ governing permissions and limitations under the License.
11
11
  */
12
12
  import { css } from '@spectrum-web-components/base';
13
13
  const styles = css `
14
- :host{--spectrum-overlay-animation-distance:var(--spectrum-picker-m-popover-offset-y,var(--spectrum-global-dimension-size-75));visibility:hidden;opacity:0;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);pointer-events:none}:host([open]){visibility:visible;opacity:1;transition-delay:0ms;pointer-events:auto}: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-tooltip-target-offset:3px;--spectrum-tooltip-tip-width:var(--spectrum-tooltip-tip-height,var(--spectrum-global-dimension-size-50));position:relative;left:0;top:0;display:inline-flex;flex-direction:row;align-items:center;box-sizing:border-box;vertical-align:top;width:auto;padding:var(--spectrum-tooltip-padding-top,var(--spectrum-global-dimension-size-50)) var(--spectrum-tooltip-padding-x,var(--spectrum-global-dimension-size-125));border-radius:var(--spectrum-tooltip-border-radius,var(--spectrum-global-dimension-size-50));min-height:var(--spectrum-tooltip-min-height,var(--spectrum-global-dimension-size-300));max-width:var(--spectrum-tooltip-max-width,var(--spectrum-global-dimension-size-2000));font-size:var(--spectrum-tooltip-text-size,var(--spectrum-global-dimension-font-size-75));font-weight:var(--spectrum-tooltip-text-font-weight,var(--spectrum-global-font-weight-regular));line-height:var(--spectrum-tooltip-text-line-height,var(--spectrum-alias-component-text-line-height));word-break:break-word;-webkit-font-smoothing:antialiased;cursor:default;-webkit-user-select:none;user-select:none}p{margin:0}#tip{position:absolute;height:0;width:0;border-top-width:var(--spectrum-tooltip-tip-width,var(--spectrum-global-dimension-size-100));border-top-style:solid;border-left:var(--spectrum-tooltip-tip-width,var(--spectrum-global-dimension-size-100)) solid transparent;border-right:var(--spectrum-tooltip-tip-width,var(--spectrum-global-dimension-size-100)) solid transparent;border-bottom:var(--spectrum-tooltip-tip-width,var(--spectrum-global-dimension-size-100)) solid transparent}:host([placement*=left]) #tip,:host([placement*=right]) #tip{top:50%;margin-top:calc(-1*var(--spectrum-tooltip-tip-width, var(--spectrum-global-dimension-size-100)))}:host([placement*=right]){margin-left:var(--spectrum-tooltip-target-offset)}:host([placement*=right]) #tip{right:100%;transform:rotate(90deg)}:host([placement*=left]){margin-right:var(--spectrum-tooltip-target-offset)}:host([placement*=left]) #tip{left:100%;transform:rotate(-90deg)}:host([placement*=top]){margin-bottom:var(--spectrum-tooltip-target-offset)}:host([placement*=top]) #tip{top:100%}:host([placement*=bottom]){margin-top:var(--spectrum-tooltip-target-offset)}:host([placement*=bottom]) #tip{bottom:100%;transform:rotate(-180deg)}:host([placement*=bottom]) #tip,:host([placement*=top]) #tip{left:50%;margin-left:calc(-1*var(--spectrum-tooltip-tip-width, var(--spectrum-global-dimension-size-100)))}:host([dir=ltr]) ::slotted([slot=icon]){margin-left:calc(var(--spectrum-tooltip-icon-margin-x,
15
- var(--spectrum-global-dimension-size-100)) - var(--spectrum-tooltip-padding-x,
16
- var(--spectrum-global-dimension-size-125)))}:host([dir=rtl]) ::slotted([slot=icon]){margin-right:calc(var(--spectrum-tooltip-icon-margin-x,
17
- var(--spectrum-global-dimension-size-100)) - var(--spectrum-tooltip-padding-x,
18
- var(--spectrum-global-dimension-size-125)))}:host([dir=ltr]) ::slotted([slot=icon]){margin-right:var(--spectrum-tooltip-icon-margin-x,var(--spectrum-global-dimension-size-100))}:host([dir=rtl]) ::slotted([slot=icon]){margin-left:var(--spectrum-tooltip-icon-margin-x,var(--spectrum-global-dimension-size-100))}::slotted([slot=icon]){width:var(--spectrum-tooltip-icon-size,var(--spectrum-global-dimension-size-175));height:var(--spectrum-tooltip-icon-size,var(--spectrum-global-dimension-size-175));align-self:flex-start;flex-shrink:0;margin-top:1px}#label{line-height:var(--spectrum-tooltip-text-line-height,var(--spectrum-alias-component-text-line-height))}:host{background-color:var(--spectrum-tooltip-background-color,var(--spectrum-global-color-static-gray-700));color:var(--spectrum-tooltip-text-color,var(--spectrum-global-color-static-white))}#tip{border-top-color:var(--spectrum-tooltip-background-color,var(--spectrum-global-color-static-gray-700))}.spectrum-Tooltip--error,:host([variant=negative]){background-color:var(--spectrum-tooltip-negative-background-color,var(--spectrum-global-color-static-red-700))}.spectrum-Tooltip--error #tip,:host([variant=negative]) #tip{border-top-color:var(--spectrum-tooltip-negative-background-color,var(--spectrum-global-color-static-red-700))}.spectrum-Tooltip--help,:host([variant=info]){background-color:var(--spectrum-tooltip-info-background-color,var(--spectrum-global-color-static-blue-700))}.spectrum-Tooltip--help #tip,:host([variant=info]) #tip{border-top-color:var(--spectrum-tooltip-info-background-color,var(--spectrum-global-color-static-blue-700))}.spectrum-Tooltip--success,:host([variant=positive]){background-color:var(--spectrum-tooltip-positive-background-color,var(--spectrum-global-color-static-green-700))}.spectrum-Tooltip--success #tip,:host([variant=positive]) #tip{border-top-color:var(--spectrum-tooltip-positive-background-color,var(--spectrum-global-color-static-green-700))}#tip{border:none}:host([placement*=bottom]) #tip,:host([placement*=left]) #tip,:host([placement*=right]) #tip{transform:none}#tip:after{content:"";position:absolute;left:0;width:0;height:0;border-top-color:transparent;border:var(--spectrum-tooltip-tip-height,var(--spectrum-global-dimension-size-50)) solid transparent;border-top:var(--spectrum-tooltip-tip-height,var(--spectrum-global-dimension-size-50)) solid var(--spectrum-tooltip-background-color,var(--spectrum-global-color-static-gray-700))}:host([placement*=bottom]) #tip:after{bottom:100%;transform:scaleY(-1)}:host([placement*=left]) #tip:after{left:100%;transform:rotate(-90deg)}:host([placement*=right]) #tip:after{right:100%;left:auto;transform:rotate(90deg)}:host([variant=negative]) #tip:after{border-top-color:var(--spectrum-tooltip-negative-background-color,var(--spectrum-global-color-static-red-700))}:host([variant=info]) #tip:after{border-top-color:var(--spectrum-tooltip-info-background-color,var(--spectrum-global-color-static-blue-700))}:host([variant=positive]) #tip:after{border-top-color:var(--spectrum-tooltip-positive-background-color,var(--spectrum-global-color-static-green-700))}
14
+ :host{--spectrum-overlay-animation-distance:var(
15
+ --spectrum-picker-m-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-tooltip-target-offset:3px;--spectrum-tooltip-tip-width:var(
17
+ --spectrum-tooltip-tip-height,var(--spectrum-global-dimension-size-50)
18
+ )}:host{-webkit-font-smoothing:antialiased;align-items:center;border-radius:var(
19
+ --spectrum-tooltip-border-radius,var(--spectrum-global-dimension-size-50)
20
+ );box-sizing:border-box;display:inline-flex;flex-direction:row;font-size:var(
21
+ --spectrum-tooltip-text-size,var(--spectrum-global-dimension-font-size-75)
22
+ );font-weight:var(
23
+ --spectrum-tooltip-text-font-weight,var(--spectrum-global-font-weight-regular)
24
+ );left:0;line-height:var(
25
+ --spectrum-tooltip-text-line-height,var(--spectrum-alias-component-text-line-height)
26
+ );max-width:var(
27
+ --spectrum-tooltip-max-width,var(--spectrum-global-dimension-size-2000)
28
+ );min-height:var(
29
+ --spectrum-tooltip-min-height,var(--spectrum-global-dimension-size-300)
30
+ );padding:var(
31
+ --spectrum-tooltip-padding-top,var(--spectrum-global-dimension-size-50)
32
+ ) var(
33
+ --spectrum-tooltip-padding-x,var(--spectrum-global-dimension-size-125)
34
+ );position:relative;top:0;vertical-align:top;width:auto;word-break:break-word}:host{cursor:default;-webkit-user-select:none;user-select:none}p{margin:0}#tip{border-bottom:var(
35
+ --spectrum-tooltip-tip-width,var(--spectrum-global-dimension-size-100)
36
+ ) solid transparent;border-left:var(
37
+ --spectrum-tooltip-tip-width,var(--spectrum-global-dimension-size-100)
38
+ ) solid transparent;border-right:var(
39
+ --spectrum-tooltip-tip-width,var(--spectrum-global-dimension-size-100)
40
+ ) solid transparent;border-top-style:solid;border-top-width:var(
41
+ --spectrum-tooltip-tip-width,var(--spectrum-global-dimension-size-100)
42
+ );height:0;position:absolute;width:0}:host([placement*=left]) #tip,:host([placement*=right]) #tip{margin-top:calc(-1*var(--spectrum-tooltip-tip-width, var(--spectrum-global-dimension-size-100)));top:50%}:host([placement*=right]){margin-left:var(
43
+ --spectrum-tooltip-target-offset
44
+ )}:host([placement*=right]) #tip{right:100%;transform:rotate(90deg)}:host([placement*=left]){margin-right:var(
45
+ --spectrum-tooltip-target-offset
46
+ )}:host([placement*=left]) #tip{left:100%;transform:rotate(-90deg)}:host([placement*=top]){margin-bottom:var(
47
+ --spectrum-tooltip-target-offset
48
+ )}:host([placement*=top]) #tip{top:100%}:host([placement*=bottom]){margin-top:var(
49
+ --spectrum-tooltip-target-offset
50
+ )}:host([placement*=bottom]) #tip{bottom:100%;transform:rotate(-180deg)}:host([placement*=bottom]) #tip,:host([placement*=top]) #tip{left:50%;margin-left:calc(-1*var(--spectrum-tooltip-tip-width, var(--spectrum-global-dimension-size-100)))}:host([dir=ltr]) ::slotted([slot=icon]){margin-left:calc(var(
51
+ --spectrum-tooltip-icon-margin-x,
52
+ var(--spectrum-global-dimension-size-100)
53
+ ) - var(
54
+ --spectrum-tooltip-padding-x,
55
+ var(--spectrum-global-dimension-size-125)
56
+ ))}:host([dir=rtl]) ::slotted([slot=icon]){margin-right:calc(var(
57
+ --spectrum-tooltip-icon-margin-x,
58
+ var(--spectrum-global-dimension-size-100)
59
+ ) - var(
60
+ --spectrum-tooltip-padding-x,
61
+ var(--spectrum-global-dimension-size-125)
62
+ ))}:host([dir=ltr]) ::slotted([slot=icon]){margin-right:var(
63
+ --spectrum-tooltip-icon-margin-x,var(--spectrum-global-dimension-size-100)
64
+ )}:host([dir=rtl]) ::slotted([slot=icon]){margin-left:var(
65
+ --spectrum-tooltip-icon-margin-x,var(--spectrum-global-dimension-size-100)
66
+ )}::slotted([slot=icon]){align-self:flex-start;flex-shrink:0;height:var(
67
+ --spectrum-tooltip-icon-size,var(--spectrum-global-dimension-size-175)
68
+ );margin-top:1px;width:var(
69
+ --spectrum-tooltip-icon-size,var(--spectrum-global-dimension-size-175)
70
+ )}#label{line-height:var(
71
+ --spectrum-tooltip-text-line-height,var(--spectrum-alias-component-text-line-height)
72
+ )}:host{background-color:var(
73
+ --spectrum-tooltip-background-color,var(--spectrum-global-color-static-gray-700)
74
+ );color:var(
75
+ --spectrum-tooltip-text-color,var(--spectrum-global-color-static-white)
76
+ )}#tip{border-top-color:var(
77
+ --spectrum-tooltip-background-color,var(--spectrum-global-color-static-gray-700)
78
+ )}.spectrum-Tooltip--error,:host([variant=negative]){background-color:var(
79
+ --spectrum-tooltip-negative-background-color,var(--spectrum-global-color-static-red-700)
80
+ )}.spectrum-Tooltip--error #tip,:host([variant=negative]) #tip{border-top-color:var(
81
+ --spectrum-tooltip-negative-background-color,var(--spectrum-global-color-static-red-700)
82
+ )}.spectrum-Tooltip--help,:host([variant=info]){background-color:var(
83
+ --spectrum-tooltip-info-background-color,var(--spectrum-global-color-static-blue-700)
84
+ )}.spectrum-Tooltip--help #tip,:host([variant=info]) #tip{border-top-color:var(
85
+ --spectrum-tooltip-info-background-color,var(--spectrum-global-color-static-blue-700)
86
+ )}.spectrum-Tooltip--success,:host([variant=positive]){background-color:var(
87
+ --spectrum-tooltip-positive-background-color,var(--spectrum-global-color-static-green-700)
88
+ )}.spectrum-Tooltip--success #tip,:host([variant=positive]) #tip{border-top-color:var(
89
+ --spectrum-tooltip-positive-background-color,var(--spectrum-global-color-static-green-700)
90
+ )}#tip{border:none}:host([placement*=bottom]) #tip,:host([placement*=left]) #tip,:host([placement*=right]) #tip{transform:none}#tip:after{border:var(
91
+ --spectrum-tooltip-tip-height,var(--spectrum-global-dimension-size-50)
92
+ ) solid transparent;content:"";height:0;left:0;position:absolute;width:0}:host([placement*=bottom]) #tip:after{bottom:100%;transform:scaleY(-1)}:host([placement*=left]) #tip:after{left:100%;transform:rotate(-90deg)}:host([placement*=right]) #tip:after{left:auto;right:100%;transform:rotate(90deg)}:host([placement]) #tip:after{border-top-color:var(
93
+ --spectrum-tooltip-background-color,var(--spectrum-global-color-static-gray-700)
94
+ )}:host([variant=negative]) #tip:after{border-top-color:var(
95
+ --spectrum-tooltip-negative-background-color,var(--spectrum-global-color-static-red-700)
96
+ )}:host([variant=info]) #tip:after{border-top-color:var(
97
+ --spectrum-tooltip-info-background-color,var(--spectrum-global-color-static-blue-700)
98
+ )}:host([variant=positive]) #tip:after{border-top-color:var(
99
+ --spectrum-tooltip-positive-background-color,var(--spectrum-global-color-static-green-700)
100
+ )}
19
101
  `;
20
102
  export default styles;
21
103
  //# sourceMappingURL=tooltip.css.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"tooltip.css.js","sourceRoot":"","sources":["tooltip.css.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;EAUE;AACF,OAAO,EAAE,GAAG,EAAE,MAAM,+BAA+B,CAAC;AACpD,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;CAMjB,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(--spectrum-picker-m-popover-offset-y,var(--spectrum-global-dimension-size-75));visibility:hidden;opacity:0;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);pointer-events:none}:host([open]){visibility:visible;opacity:1;transition-delay:0ms;pointer-events:auto}: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-tooltip-target-offset:3px;--spectrum-tooltip-tip-width:var(--spectrum-tooltip-tip-height,var(--spectrum-global-dimension-size-50));position:relative;left:0;top:0;display:inline-flex;flex-direction:row;align-items:center;box-sizing:border-box;vertical-align:top;width:auto;padding:var(--spectrum-tooltip-padding-top,var(--spectrum-global-dimension-size-50)) var(--spectrum-tooltip-padding-x,var(--spectrum-global-dimension-size-125));border-radius:var(--spectrum-tooltip-border-radius,var(--spectrum-global-dimension-size-50));min-height:var(--spectrum-tooltip-min-height,var(--spectrum-global-dimension-size-300));max-width:var(--spectrum-tooltip-max-width,var(--spectrum-global-dimension-size-2000));font-size:var(--spectrum-tooltip-text-size,var(--spectrum-global-dimension-font-size-75));font-weight:var(--spectrum-tooltip-text-font-weight,var(--spectrum-global-font-weight-regular));line-height:var(--spectrum-tooltip-text-line-height,var(--spectrum-alias-component-text-line-height));word-break:break-word;-webkit-font-smoothing:antialiased;cursor:default;-webkit-user-select:none;user-select:none}p{margin:0}#tip{position:absolute;height:0;width:0;border-top-width:var(--spectrum-tooltip-tip-width,var(--spectrum-global-dimension-size-100));border-top-style:solid;border-left:var(--spectrum-tooltip-tip-width,var(--spectrum-global-dimension-size-100)) solid transparent;border-right:var(--spectrum-tooltip-tip-width,var(--spectrum-global-dimension-size-100)) solid transparent;border-bottom:var(--spectrum-tooltip-tip-width,var(--spectrum-global-dimension-size-100)) solid transparent}:host([placement*=left]) #tip,:host([placement*=right]) #tip{top:50%;margin-top:calc(-1*var(--spectrum-tooltip-tip-width, var(--spectrum-global-dimension-size-100)))}:host([placement*=right]){margin-left:var(--spectrum-tooltip-target-offset)}:host([placement*=right]) #tip{right:100%;transform:rotate(90deg)}:host([placement*=left]){margin-right:var(--spectrum-tooltip-target-offset)}:host([placement*=left]) #tip{left:100%;transform:rotate(-90deg)}:host([placement*=top]){margin-bottom:var(--spectrum-tooltip-target-offset)}:host([placement*=top]) #tip{top:100%}:host([placement*=bottom]){margin-top:var(--spectrum-tooltip-target-offset)}:host([placement*=bottom]) #tip{bottom:100%;transform:rotate(-180deg)}:host([placement*=bottom]) #tip,:host([placement*=top]) #tip{left:50%;margin-left:calc(-1*var(--spectrum-tooltip-tip-width, var(--spectrum-global-dimension-size-100)))}:host([dir=ltr]) ::slotted([slot=icon]){margin-left:calc(var(--spectrum-tooltip-icon-margin-x,\nvar(--spectrum-global-dimension-size-100)) - var(--spectrum-tooltip-padding-x,\nvar(--spectrum-global-dimension-size-125)))}:host([dir=rtl]) ::slotted([slot=icon]){margin-right:calc(var(--spectrum-tooltip-icon-margin-x,\nvar(--spectrum-global-dimension-size-100)) - var(--spectrum-tooltip-padding-x,\nvar(--spectrum-global-dimension-size-125)))}:host([dir=ltr]) ::slotted([slot=icon]){margin-right:var(--spectrum-tooltip-icon-margin-x,var(--spectrum-global-dimension-size-100))}:host([dir=rtl]) ::slotted([slot=icon]){margin-left:var(--spectrum-tooltip-icon-margin-x,var(--spectrum-global-dimension-size-100))}::slotted([slot=icon]){width:var(--spectrum-tooltip-icon-size,var(--spectrum-global-dimension-size-175));height:var(--spectrum-tooltip-icon-size,var(--spectrum-global-dimension-size-175));align-self:flex-start;flex-shrink:0;margin-top:1px}#label{line-height:var(--spectrum-tooltip-text-line-height,var(--spectrum-alias-component-text-line-height))}:host{background-color:var(--spectrum-tooltip-background-color,var(--spectrum-global-color-static-gray-700));color:var(--spectrum-tooltip-text-color,var(--spectrum-global-color-static-white))}#tip{border-top-color:var(--spectrum-tooltip-background-color,var(--spectrum-global-color-static-gray-700))}.spectrum-Tooltip--error,:host([variant=negative]){background-color:var(--spectrum-tooltip-negative-background-color,var(--spectrum-global-color-static-red-700))}.spectrum-Tooltip--error #tip,:host([variant=negative]) #tip{border-top-color:var(--spectrum-tooltip-negative-background-color,var(--spectrum-global-color-static-red-700))}.spectrum-Tooltip--help,:host([variant=info]){background-color:var(--spectrum-tooltip-info-background-color,var(--spectrum-global-color-static-blue-700))}.spectrum-Tooltip--help #tip,:host([variant=info]) #tip{border-top-color:var(--spectrum-tooltip-info-background-color,var(--spectrum-global-color-static-blue-700))}.spectrum-Tooltip--success,:host([variant=positive]){background-color:var(--spectrum-tooltip-positive-background-color,var(--spectrum-global-color-static-green-700))}.spectrum-Tooltip--success #tip,:host([variant=positive]) #tip{border-top-color:var(--spectrum-tooltip-positive-background-color,var(--spectrum-global-color-static-green-700))}#tip{border:none}:host([placement*=bottom]) #tip,:host([placement*=left]) #tip,:host([placement*=right]) #tip{transform:none}#tip:after{content:\"\";position:absolute;left:0;width:0;height:0;border-top-color:transparent;border:var(--spectrum-tooltip-tip-height,var(--spectrum-global-dimension-size-50)) solid transparent;border-top:var(--spectrum-tooltip-tip-height,var(--spectrum-global-dimension-size-50)) solid var(--spectrum-tooltip-background-color,var(--spectrum-global-color-static-gray-700))}:host([placement*=bottom]) #tip:after{bottom:100%;transform:scaleY(-1)}:host([placement*=left]) #tip:after{left:100%;transform:rotate(-90deg)}:host([placement*=right]) #tip:after{right:100%;left:auto;transform:rotate(90deg)}:host([variant=negative]) #tip:after{border-top-color:var(--spectrum-tooltip-negative-background-color,var(--spectrum-global-color-static-red-700))}:host([variant=info]) #tip:after{border-top-color:var(--spectrum-tooltip-info-background-color,var(--spectrum-global-color-static-blue-700))}:host([variant=positive]) #tip:after{border-top-color:var(--spectrum-tooltip-positive-background-color,var(--spectrum-global-color-static-green-700))}\n`;\nexport default styles;"]}
1
+ {"version":3,"file":"tooltip.css.js","sourceRoot":"","sources":["tooltip.css.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;EAUE;AACF,OAAO,EAAE,GAAG,EAAE,MAAM,+BAA+B,CAAC;AACpD,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAwFjB,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-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-tooltip-target-offset:3px;--spectrum-tooltip-tip-width:var(\n--spectrum-tooltip-tip-height,var(--spectrum-global-dimension-size-50)\n)}:host{-webkit-font-smoothing:antialiased;align-items:center;border-radius:var(\n--spectrum-tooltip-border-radius,var(--spectrum-global-dimension-size-50)\n);box-sizing:border-box;display:inline-flex;flex-direction:row;font-size:var(\n--spectrum-tooltip-text-size,var(--spectrum-global-dimension-font-size-75)\n);font-weight:var(\n--spectrum-tooltip-text-font-weight,var(--spectrum-global-font-weight-regular)\n);left:0;line-height:var(\n--spectrum-tooltip-text-line-height,var(--spectrum-alias-component-text-line-height)\n);max-width:var(\n--spectrum-tooltip-max-width,var(--spectrum-global-dimension-size-2000)\n);min-height:var(\n--spectrum-tooltip-min-height,var(--spectrum-global-dimension-size-300)\n);padding:var(\n--spectrum-tooltip-padding-top,var(--spectrum-global-dimension-size-50)\n) var(\n--spectrum-tooltip-padding-x,var(--spectrum-global-dimension-size-125)\n);position:relative;top:0;vertical-align:top;width:auto;word-break:break-word}:host{cursor:default;-webkit-user-select:none;user-select:none}p{margin:0}#tip{border-bottom:var(\n--spectrum-tooltip-tip-width,var(--spectrum-global-dimension-size-100)\n) solid transparent;border-left:var(\n--spectrum-tooltip-tip-width,var(--spectrum-global-dimension-size-100)\n) solid transparent;border-right:var(\n--spectrum-tooltip-tip-width,var(--spectrum-global-dimension-size-100)\n) solid transparent;border-top-style:solid;border-top-width:var(\n--spectrum-tooltip-tip-width,var(--spectrum-global-dimension-size-100)\n);height:0;position:absolute;width:0}:host([placement*=left]) #tip,:host([placement*=right]) #tip{margin-top:calc(-1*var(--spectrum-tooltip-tip-width, var(--spectrum-global-dimension-size-100)));top:50%}:host([placement*=right]){margin-left:var(\n--spectrum-tooltip-target-offset\n)}:host([placement*=right]) #tip{right:100%;transform:rotate(90deg)}:host([placement*=left]){margin-right:var(\n--spectrum-tooltip-target-offset\n)}:host([placement*=left]) #tip{left:100%;transform:rotate(-90deg)}:host([placement*=top]){margin-bottom:var(\n--spectrum-tooltip-target-offset\n)}:host([placement*=top]) #tip{top:100%}:host([placement*=bottom]){margin-top:var(\n--spectrum-tooltip-target-offset\n)}:host([placement*=bottom]) #tip{bottom:100%;transform:rotate(-180deg)}:host([placement*=bottom]) #tip,:host([placement*=top]) #tip{left:50%;margin-left:calc(-1*var(--spectrum-tooltip-tip-width, var(--spectrum-global-dimension-size-100)))}:host([dir=ltr]) ::slotted([slot=icon]){margin-left:calc(var(\n--spectrum-tooltip-icon-margin-x,\nvar(--spectrum-global-dimension-size-100)\n) - var(\n--spectrum-tooltip-padding-x,\nvar(--spectrum-global-dimension-size-125)\n))}:host([dir=rtl]) ::slotted([slot=icon]){margin-right:calc(var(\n--spectrum-tooltip-icon-margin-x,\nvar(--spectrum-global-dimension-size-100)\n) - var(\n--spectrum-tooltip-padding-x,\nvar(--spectrum-global-dimension-size-125)\n))}:host([dir=ltr]) ::slotted([slot=icon]){margin-right:var(\n--spectrum-tooltip-icon-margin-x,var(--spectrum-global-dimension-size-100)\n)}:host([dir=rtl]) ::slotted([slot=icon]){margin-left:var(\n--spectrum-tooltip-icon-margin-x,var(--spectrum-global-dimension-size-100)\n)}::slotted([slot=icon]){align-self:flex-start;flex-shrink:0;height:var(\n--spectrum-tooltip-icon-size,var(--spectrum-global-dimension-size-175)\n);margin-top:1px;width:var(\n--spectrum-tooltip-icon-size,var(--spectrum-global-dimension-size-175)\n)}#label{line-height:var(\n--spectrum-tooltip-text-line-height,var(--spectrum-alias-component-text-line-height)\n)}:host{background-color:var(\n--spectrum-tooltip-background-color,var(--spectrum-global-color-static-gray-700)\n);color:var(\n--spectrum-tooltip-text-color,var(--spectrum-global-color-static-white)\n)}#tip{border-top-color:var(\n--spectrum-tooltip-background-color,var(--spectrum-global-color-static-gray-700)\n)}.spectrum-Tooltip--error,:host([variant=negative]){background-color:var(\n--spectrum-tooltip-negative-background-color,var(--spectrum-global-color-static-red-700)\n)}.spectrum-Tooltip--error #tip,:host([variant=negative]) #tip{border-top-color:var(\n--spectrum-tooltip-negative-background-color,var(--spectrum-global-color-static-red-700)\n)}.spectrum-Tooltip--help,:host([variant=info]){background-color:var(\n--spectrum-tooltip-info-background-color,var(--spectrum-global-color-static-blue-700)\n)}.spectrum-Tooltip--help #tip,:host([variant=info]) #tip{border-top-color:var(\n--spectrum-tooltip-info-background-color,var(--spectrum-global-color-static-blue-700)\n)}.spectrum-Tooltip--success,:host([variant=positive]){background-color:var(\n--spectrum-tooltip-positive-background-color,var(--spectrum-global-color-static-green-700)\n)}.spectrum-Tooltip--success #tip,:host([variant=positive]) #tip{border-top-color:var(\n--spectrum-tooltip-positive-background-color,var(--spectrum-global-color-static-green-700)\n)}#tip{border:none}:host([placement*=bottom]) #tip,:host([placement*=left]) #tip,:host([placement*=right]) #tip{transform:none}#tip:after{border:var(\n--spectrum-tooltip-tip-height,var(--spectrum-global-dimension-size-50)\n) solid transparent;content:\"\";height:0;left:0;position:absolute;width:0}:host([placement*=bottom]) #tip:after{bottom:100%;transform:scaleY(-1)}:host([placement*=left]) #tip:after{left:100%;transform:rotate(-90deg)}:host([placement*=right]) #tip:after{left:auto;right:100%;transform:rotate(90deg)}:host([placement]) #tip:after{border-top-color:var(\n--spectrum-tooltip-background-color,var(--spectrum-global-color-static-gray-700)\n)}:host([variant=negative]) #tip:after{border-top-color:var(\n--spectrum-tooltip-negative-background-color,var(--spectrum-global-color-static-red-700)\n)}:host([variant=info]) #tip:after{border-top-color:var(\n--spectrum-tooltip-info-background-color,var(--spectrum-global-color-static-blue-700)\n)}:host([variant=positive]) #tip:after{border-top-color:var(\n--spectrum-tooltip-positive-background-color,var(--spectrum-global-color-static-green-700)\n)}\n`;\nexport default styles;"]}