@spectrum-web-components/tooltip 0.10.12 → 0.10.13
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.
package/custom-elements.json
CHANGED
|
@@ -369,63 +369,6 @@
|
|
|
369
369
|
}
|
|
370
370
|
}
|
|
371
371
|
]
|
|
372
|
-
},
|
|
373
|
-
{
|
|
374
|
-
"kind": "javascript-module",
|
|
375
|
-
"path": "src/index.ts",
|
|
376
|
-
"declarations": [],
|
|
377
|
-
"exports": [
|
|
378
|
-
{
|
|
379
|
-
"kind": "js",
|
|
380
|
-
"name": "*",
|
|
381
|
-
"declaration": {
|
|
382
|
-
"name": "*",
|
|
383
|
-
"package": "./Tooltip.js"
|
|
384
|
-
}
|
|
385
|
-
}
|
|
386
|
-
]
|
|
387
|
-
},
|
|
388
|
-
{
|
|
389
|
-
"kind": "javascript-module",
|
|
390
|
-
"path": "src/spectrum-tooltip.css.ts",
|
|
391
|
-
"declarations": [
|
|
392
|
-
{
|
|
393
|
-
"kind": "variable",
|
|
394
|
-
"name": "styles",
|
|
395
|
-
"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-tooltip-neutral-target-offset:3px;--spectrum-tooltip-neutral-tip-width:var(\n--spectrum-tooltip-neutral-tip-height,var(--spectrum-global-dimension-size-50)\n)}:host{-webkit-font-smoothing:antialiased;align-items:center;border-radius:var(\n--spectrum-tooltip-neutral-border-radius,var(--spectrum-alias-component-border-radius)\n);box-sizing:border-box;display:inline-flex;flex-direction:row;font-size:var(\n--spectrum-tooltip-neutral-text-size,var(--spectrum-global-dimension-font-size-75)\n);font-weight:var(\n--spectrum-tooltip-neutral-text-font-weight,var(--spectrum-alias-body-text-font-weight)\n);left:0;line-height:var(\n--spectrum-tooltip-neutral-text-line-height,var(--spectrum-alias-component-text-line-height)\n);max-width:var(\n--spectrum-tooltip-neutral-max-width,var(--spectrum-global-dimension-size-2000)\n);min-height:var(\n--spectrum-tooltip-neutral-min-height,var(--spectrum-global-dimension-size-300)\n);padding:0 var(\n--spectrum-tooltip-neutral-padding-x,var(--spectrum-global-dimension-size-85)\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-neutral-tip-width,var(--spectrum-global-dimension-size-100)\n) solid transparent;border-left:var(\n--spectrum-tooltip-neutral-tip-width,var(--spectrum-global-dimension-size-100)\n) solid transparent;border-right:var(\n--spectrum-tooltip-neutral-tip-width,var(--spectrum-global-dimension-size-100)\n) solid transparent;border-top-style:solid;border-top-width:var(\n--spectrum-tooltip-neutral-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(var(\n--spectrum-tooltip-neutral-tip-width,\nvar(--spectrum-global-dimension-size-100)\n)*-1);top:50%}:host([placement*=right]){margin-left:var(\n--spectrum-tooltip-neutral-target-offset\n)}:host([placement*=right]) #tip{right:100%;transform:rotate(90deg)}:host([placement*=left]){margin-right:var(\n--spectrum-tooltip-neutral-target-offset\n)}:host([placement*=left]) #tip{left:100%;transform:rotate(-90deg)}:host([placement*=top]){margin-bottom:var(\n--spectrum-tooltip-neutral-target-offset\n)}:host([placement*=top]) #tip{top:100%}:host([placement*=bottom]){margin-top:var(\n--spectrum-tooltip-neutral-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(var(\n--spectrum-tooltip-neutral-tip-width,\nvar(--spectrum-global-dimension-size-100)\n)*-1)}:host([dir=ltr]) ::slotted([slot=icon]){margin-left:calc(var(\n--spectrum-tooltip-neutral-icon-margin-x,\nvar(--spectrum-global-dimension-size-85)\n) - var(\n--spectrum-tooltip-neutral-padding-x,\nvar(--spectrum-global-dimension-size-85)\n))}:host([dir=rtl]) ::slotted([slot=icon]){margin-right:calc(var(\n--spectrum-tooltip-neutral-icon-margin-x,\nvar(--spectrum-global-dimension-size-85)\n) - var(\n--spectrum-tooltip-neutral-padding-x,\nvar(--spectrum-global-dimension-size-85)\n))}:host([dir=ltr]) ::slotted([slot=icon]){margin-right:var(\n--spectrum-tooltip-neutral-icon-margin-x,var(--spectrum-global-dimension-size-85)\n)}:host([dir=rtl]) ::slotted([slot=icon]){margin-left:var(\n--spectrum-tooltip-neutral-icon-margin-x,var(--spectrum-global-dimension-size-85)\n)}::slotted([slot=icon]){align-self:flex-start;flex-shrink:0;height:var(\n--spectrum-tooltip-neutral-icon-size,var(--spectrum-global-dimension-size-200)\n);margin-bottom:var(\n--spectrum-tooltip-neutral-icon-margin-y,var(--spectrum-global-dimension-size-50)\n);margin-top:var(\n--spectrum-tooltip-neutral-icon-margin-y,var(--spectrum-global-dimension-size-50)\n);width:var(\n--spectrum-tooltip-neutral-icon-size,var(--spectrum-global-dimension-size-200)\n)}#label{line-height:var(\n--spectrum-tooltip-neutral-text-line-height,var(--spectrum-alias-component-text-line-height)\n);margin-bottom:var(--spectrum-tooltip-neutral-text-margin-bottom);margin-top:var(\n--spectrum-tooltip-neutral-text-margin-top,var(--spectrum-global-dimension-static-size-50)\n)}:host{background-color:var(\n--spectrum-tooltip-neutral-background-color,var(--spectrum-semantic-neutral-background-color-default)\n);color:var(\n--spectrum-tooltip-neutral-text-color,var(--spectrum-global-color-static-white)\n)}#tip{border-top-color:var(\n--spectrum-tooltip-neutral-background-color,var(--spectrum-semantic-neutral-background-color-default)\n)}.spectrum-Tooltip--error,:host([variant=negative]){background-color:var(\n--spectrum-tooltip-negative-background-color,var(--spectrum-semantic-negative-background-color)\n)}.spectrum-Tooltip--error #tip,:host([variant=negative]) #tip{border-top-color:var(\n--spectrum-tooltip-negative-background-color,var(--spectrum-semantic-negative-background-color)\n)}.spectrum-Tooltip--help,:host([variant=info]){background-color:var(\n--spectrum-tooltip-info-background-color,var(--spectrum-semantic-informative-background-color)\n)}.spectrum-Tooltip--help #tip,:host([variant=info]) #tip{border-top-color:var(\n--spectrum-tooltip-info-background-color,var(--spectrum-semantic-informative-background-color)\n)}.spectrum-Tooltip--success,:host([variant=positive]){background-color:var(\n--spectrum-tooltip-positive-background-color,var(--spectrum-semantic-positive-background-color)\n)}.spectrum-Tooltip--success #tip,:host([variant=positive]) #tip{border-top-color:var(\n--spectrum-tooltip-positive-background-color,var(--spectrum-semantic-positive-background-color)\n)}\n`"
|
|
396
|
-
}
|
|
397
|
-
],
|
|
398
|
-
"exports": [
|
|
399
|
-
{
|
|
400
|
-
"kind": "js",
|
|
401
|
-
"name": "default",
|
|
402
|
-
"declaration": {
|
|
403
|
-
"name": "styles",
|
|
404
|
-
"module": "src/spectrum-tooltip.css.ts"
|
|
405
|
-
}
|
|
406
|
-
}
|
|
407
|
-
]
|
|
408
|
-
},
|
|
409
|
-
{
|
|
410
|
-
"kind": "javascript-module",
|
|
411
|
-
"path": "src/tooltip.css.ts",
|
|
412
|
-
"declarations": [
|
|
413
|
-
{
|
|
414
|
-
"kind": "variable",
|
|
415
|
-
"name": "styles",
|
|
416
|
-
"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-tooltip-neutral-target-offset:3px;--spectrum-tooltip-neutral-tip-width:var(\n--spectrum-tooltip-neutral-tip-height,var(--spectrum-global-dimension-size-50)\n)}:host{-webkit-font-smoothing:antialiased;align-items:center;border-radius:var(\n--spectrum-tooltip-neutral-border-radius,var(--spectrum-alias-component-border-radius)\n);box-sizing:border-box;display:inline-flex;flex-direction:row;font-size:var(\n--spectrum-tooltip-neutral-text-size,var(--spectrum-global-dimension-font-size-75)\n);font-weight:var(\n--spectrum-tooltip-neutral-text-font-weight,var(--spectrum-alias-body-text-font-weight)\n);left:0;line-height:var(\n--spectrum-tooltip-neutral-text-line-height,var(--spectrum-alias-component-text-line-height)\n);max-width:var(\n--spectrum-tooltip-neutral-max-width,var(--spectrum-global-dimension-size-2000)\n);min-height:var(\n--spectrum-tooltip-neutral-min-height,var(--spectrum-global-dimension-size-300)\n);padding:0 var(\n--spectrum-tooltip-neutral-padding-x,var(--spectrum-global-dimension-size-85)\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-neutral-tip-width,var(--spectrum-global-dimension-size-100)\n) solid transparent;border-left:var(\n--spectrum-tooltip-neutral-tip-width,var(--spectrum-global-dimension-size-100)\n) solid transparent;border-right:var(\n--spectrum-tooltip-neutral-tip-width,var(--spectrum-global-dimension-size-100)\n) solid transparent;border-top-style:solid;border-top-width:var(\n--spectrum-tooltip-neutral-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(var(\n--spectrum-tooltip-neutral-tip-width,\nvar(--spectrum-global-dimension-size-100)\n)*-1);top:50%}:host([placement*=right]){margin-left:var(\n--spectrum-tooltip-neutral-target-offset\n)}:host([placement*=right]) #tip{right:100%;transform:rotate(90deg)}:host([placement*=left]){margin-right:var(\n--spectrum-tooltip-neutral-target-offset\n)}:host([placement*=left]) #tip{left:100%;transform:rotate(-90deg)}:host([placement*=top]){margin-bottom:var(\n--spectrum-tooltip-neutral-target-offset\n)}:host([placement*=top]) #tip{top:100%}:host([placement*=bottom]){margin-top:var(\n--spectrum-tooltip-neutral-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(var(\n--spectrum-tooltip-neutral-tip-width,\nvar(--spectrum-global-dimension-size-100)\n)*-1)}:host([dir=ltr]) ::slotted([slot=icon]){margin-left:calc(var(\n--spectrum-tooltip-neutral-icon-margin-x,\nvar(--spectrum-global-dimension-size-85)\n) - var(\n--spectrum-tooltip-neutral-padding-x,\nvar(--spectrum-global-dimension-size-85)\n))}:host([dir=rtl]) ::slotted([slot=icon]){margin-right:calc(var(\n--spectrum-tooltip-neutral-icon-margin-x,\nvar(--spectrum-global-dimension-size-85)\n) - var(\n--spectrum-tooltip-neutral-padding-x,\nvar(--spectrum-global-dimension-size-85)\n))}:host([dir=ltr]) ::slotted([slot=icon]){margin-right:var(\n--spectrum-tooltip-neutral-icon-margin-x,var(--spectrum-global-dimension-size-85)\n)}:host([dir=rtl]) ::slotted([slot=icon]){margin-left:var(\n--spectrum-tooltip-neutral-icon-margin-x,var(--spectrum-global-dimension-size-85)\n)}::slotted([slot=icon]){align-self:flex-start;flex-shrink:0;height:var(\n--spectrum-tooltip-neutral-icon-size,var(--spectrum-global-dimension-size-200)\n);margin-bottom:var(\n--spectrum-tooltip-neutral-icon-margin-y,var(--spectrum-global-dimension-size-50)\n);margin-top:var(\n--spectrum-tooltip-neutral-icon-margin-y,var(--spectrum-global-dimension-size-50)\n);width:var(\n--spectrum-tooltip-neutral-icon-size,var(--spectrum-global-dimension-size-200)\n)}#label{line-height:var(\n--spectrum-tooltip-neutral-text-line-height,var(--spectrum-alias-component-text-line-height)\n);margin-bottom:var(--spectrum-tooltip-neutral-text-margin-bottom);margin-top:var(\n--spectrum-tooltip-neutral-text-margin-top,var(--spectrum-global-dimension-static-size-50)\n)}:host{background-color:var(\n--spectrum-tooltip-neutral-background-color,var(--spectrum-semantic-neutral-background-color-default)\n);color:var(\n--spectrum-tooltip-neutral-text-color,var(--spectrum-global-color-static-white)\n)}#tip{border-top-color:var(\n--spectrum-tooltip-neutral-background-color,var(--spectrum-semantic-neutral-background-color-default)\n)}.spectrum-Tooltip--error,:host([variant=negative]){background-color:var(\n--spectrum-tooltip-negative-background-color,var(--spectrum-semantic-negative-background-color)\n)}.spectrum-Tooltip--error #tip,:host([variant=negative]) #tip{border-top-color:var(\n--spectrum-tooltip-negative-background-color,var(--spectrum-semantic-negative-background-color)\n)}.spectrum-Tooltip--help,:host([variant=info]){background-color:var(\n--spectrum-tooltip-info-background-color,var(--spectrum-semantic-informative-background-color)\n)}.spectrum-Tooltip--help #tip,:host([variant=info]) #tip{border-top-color:var(\n--spectrum-tooltip-info-background-color,var(--spectrum-semantic-informative-background-color)\n)}.spectrum-Tooltip--success,:host([variant=positive]){background-color:var(\n--spectrum-tooltip-positive-background-color,var(--spectrum-semantic-positive-background-color)\n)}.spectrum-Tooltip--success #tip,:host([variant=positive]) #tip{border-top-color:var(\n--spectrum-tooltip-positive-background-color,var(--spectrum-semantic-positive-background-color)\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`"
|
|
417
|
-
}
|
|
418
|
-
],
|
|
419
|
-
"exports": [
|
|
420
|
-
{
|
|
421
|
-
"kind": "js",
|
|
422
|
-
"name": "default",
|
|
423
|
-
"declaration": {
|
|
424
|
-
"name": "styles",
|
|
425
|
-
"module": "src/tooltip.css.ts"
|
|
426
|
-
}
|
|
427
|
-
}
|
|
428
|
-
]
|
|
429
372
|
}
|
|
430
373
|
]
|
|
431
374
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@spectrum-web-components/tooltip",
|
|
3
|
-
"version": "0.10.
|
|
3
|
+
"version": "0.10.13",
|
|
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.6",
|
|
48
|
-
"@spectrum-web-components/overlay": "^0.16.
|
|
48
|
+
"@spectrum-web-components/overlay": "^0.16.2",
|
|
49
49
|
"tslib": "^2.0.0"
|
|
50
50
|
},
|
|
51
51
|
"devDependencies": {
|
|
52
|
-
"@spectrum-css/tooltip": "^3.1.
|
|
52
|
+
"@spectrum-css/tooltip": "^3.1.16"
|
|
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": "
|
|
59
|
+
"gitHead": "8f5ea3556e160b6e30815edb2414dc5a5999a925"
|
|
60
60
|
}
|
|
@@ -97,7 +97,7 @@ var(--spectrum-global-dimension-size-85)
|
|
|
97
97
|
--spectrum-tooltip-positive-background-color,var(--spectrum-semantic-positive-background-color)
|
|
98
98
|
)}.spectrum-Tooltip--success #tip,:host([variant=positive]) #tip{border-top-color:var(
|
|
99
99
|
--spectrum-tooltip-positive-background-color,var(--spectrum-semantic-positive-background-color)
|
|
100
|
-
)}
|
|
100
|
+
)}@media (forced-colors:active){:host{border:1px solid transparent}#tip{--spectrum-tooltip-neutral-background-color:CanvasText;--spectrum-tooltip-negative-background-color:CanvasText;--spectrum-tooltip-info-background-color:CanvasText;--spectrum-tooltip-positive-background-color:CanvasText;forced-color-adjust:none}}
|
|
101
101
|
`;
|
|
102
102
|
export default styles;
|
|
103
103
|
//# 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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAwFjB,CAAC;AACF,eAAe,MAAM,CAAC","sourcesContent":["/*\nCopyright 2022 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-tooltip-neutral-target-offset:3px;--spectrum-tooltip-neutral-tip-width:var(\n--spectrum-tooltip-neutral-tip-height,var(--spectrum-global-dimension-size-50)\n)}:host{-webkit-font-smoothing:antialiased;align-items:center;border-radius:var(\n--spectrum-tooltip-neutral-border-radius,var(--spectrum-alias-component-border-radius)\n);box-sizing:border-box;display:inline-flex;flex-direction:row;font-size:var(\n--spectrum-tooltip-neutral-text-size,var(--spectrum-global-dimension-font-size-75)\n);font-weight:var(\n--spectrum-tooltip-neutral-text-font-weight,var(--spectrum-alias-body-text-font-weight)\n);left:0;line-height:var(\n--spectrum-tooltip-neutral-text-line-height,var(--spectrum-alias-component-text-line-height)\n);max-width:var(\n--spectrum-tooltip-neutral-max-width,var(--spectrum-global-dimension-size-2000)\n);min-height:var(\n--spectrum-tooltip-neutral-min-height,var(--spectrum-global-dimension-size-300)\n);padding:0 var(\n--spectrum-tooltip-neutral-padding-x,var(--spectrum-global-dimension-size-85)\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-neutral-tip-width,var(--spectrum-global-dimension-size-100)\n) solid transparent;border-left:var(\n--spectrum-tooltip-neutral-tip-width,var(--spectrum-global-dimension-size-100)\n) solid transparent;border-right:var(\n--spectrum-tooltip-neutral-tip-width,var(--spectrum-global-dimension-size-100)\n) solid transparent;border-top-style:solid;border-top-width:var(\n--spectrum-tooltip-neutral-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(var(\n--spectrum-tooltip-neutral-tip-width,\nvar(--spectrum-global-dimension-size-100)\n)*-1);top:50%}:host([placement*=right]){margin-left:var(\n--spectrum-tooltip-neutral-target-offset\n)}:host([placement*=right]) #tip{right:100%;transform:rotate(90deg)}:host([placement*=left]){margin-right:var(\n--spectrum-tooltip-neutral-target-offset\n)}:host([placement*=left]) #tip{left:100%;transform:rotate(-90deg)}:host([placement*=top]){margin-bottom:var(\n--spectrum-tooltip-neutral-target-offset\n)}:host([placement*=top]) #tip{top:100%}:host([placement*=bottom]){margin-top:var(\n--spectrum-tooltip-neutral-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(var(\n--spectrum-tooltip-neutral-tip-width,\nvar(--spectrum-global-dimension-size-100)\n)*-1)}:host([dir=ltr]) ::slotted([slot=icon]){margin-left:calc(var(\n--spectrum-tooltip-neutral-icon-margin-x,\nvar(--spectrum-global-dimension-size-85)\n) - var(\n--spectrum-tooltip-neutral-padding-x,\nvar(--spectrum-global-dimension-size-85)\n))}:host([dir=rtl]) ::slotted([slot=icon]){margin-right:calc(var(\n--spectrum-tooltip-neutral-icon-margin-x,\nvar(--spectrum-global-dimension-size-85)\n) - var(\n--spectrum-tooltip-neutral-padding-x,\nvar(--spectrum-global-dimension-size-85)\n))}:host([dir=ltr]) ::slotted([slot=icon]){margin-right:var(\n--spectrum-tooltip-neutral-icon-margin-x,var(--spectrum-global-dimension-size-85)\n)}:host([dir=rtl]) ::slotted([slot=icon]){margin-left:var(\n--spectrum-tooltip-neutral-icon-margin-x,var(--spectrum-global-dimension-size-85)\n)}::slotted([slot=icon]){align-self:flex-start;flex-shrink:0;height:var(\n--spectrum-tooltip-neutral-icon-size,var(--spectrum-global-dimension-size-200)\n);margin-bottom:var(\n--spectrum-tooltip-neutral-icon-margin-y,var(--spectrum-global-dimension-size-50)\n);margin-top:var(\n--spectrum-tooltip-neutral-icon-margin-y,var(--spectrum-global-dimension-size-50)\n);width:var(\n--spectrum-tooltip-neutral-icon-size,var(--spectrum-global-dimension-size-200)\n)}#label{line-height:var(\n--spectrum-tooltip-neutral-text-line-height,var(--spectrum-alias-component-text-line-height)\n);margin-bottom:var(--spectrum-tooltip-neutral-text-margin-bottom);margin-top:var(\n--spectrum-tooltip-neutral-text-margin-top,var(--spectrum-global-dimension-static-size-50)\n)}:host{background-color:var(\n--spectrum-tooltip-neutral-background-color,var(--spectrum-semantic-neutral-background-color-default)\n);color:var(\n--spectrum-tooltip-neutral-text-color,var(--spectrum-global-color-static-white)\n)}#tip{border-top-color:var(\n--spectrum-tooltip-neutral-background-color,var(--spectrum-semantic-neutral-background-color-default)\n)}.spectrum-Tooltip--error,:host([variant=negative]){background-color:var(\n--spectrum-tooltip-negative-background-color,var(--spectrum-semantic-negative-background-color)\n)}.spectrum-Tooltip--error #tip,:host([variant=negative]) #tip{border-top-color:var(\n--spectrum-tooltip-negative-background-color,var(--spectrum-semantic-negative-background-color)\n)}.spectrum-Tooltip--help,:host([variant=info]){background-color:var(\n--spectrum-tooltip-info-background-color,var(--spectrum-semantic-informative-background-color)\n)}.spectrum-Tooltip--help #tip,:host([variant=info]) #tip{border-top-color:var(\n--spectrum-tooltip-info-background-color,var(--spectrum-semantic-informative-background-color)\n)}.spectrum-Tooltip--success,:host([variant=positive]){background-color:var(\n--spectrum-tooltip-positive-background-color,var(--spectrum-semantic-positive-background-color)\n)}.spectrum-Tooltip--success #tip,:host([variant=positive]) #tip{border-top-color:var(\n--spectrum-tooltip-positive-background-color,var(--spectrum-semantic-positive-background-color)\n)}\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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAwFjB,CAAC;AACF,eAAe,MAAM,CAAC","sourcesContent":["/*\nCopyright 2022 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-tooltip-neutral-target-offset:3px;--spectrum-tooltip-neutral-tip-width:var(\n--spectrum-tooltip-neutral-tip-height,var(--spectrum-global-dimension-size-50)\n)}:host{-webkit-font-smoothing:antialiased;align-items:center;border-radius:var(\n--spectrum-tooltip-neutral-border-radius,var(--spectrum-alias-component-border-radius)\n);box-sizing:border-box;display:inline-flex;flex-direction:row;font-size:var(\n--spectrum-tooltip-neutral-text-size,var(--spectrum-global-dimension-font-size-75)\n);font-weight:var(\n--spectrum-tooltip-neutral-text-font-weight,var(--spectrum-alias-body-text-font-weight)\n);left:0;line-height:var(\n--spectrum-tooltip-neutral-text-line-height,var(--spectrum-alias-component-text-line-height)\n);max-width:var(\n--spectrum-tooltip-neutral-max-width,var(--spectrum-global-dimension-size-2000)\n);min-height:var(\n--spectrum-tooltip-neutral-min-height,var(--spectrum-global-dimension-size-300)\n);padding:0 var(\n--spectrum-tooltip-neutral-padding-x,var(--spectrum-global-dimension-size-85)\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-neutral-tip-width,var(--spectrum-global-dimension-size-100)\n) solid transparent;border-left:var(\n--spectrum-tooltip-neutral-tip-width,var(--spectrum-global-dimension-size-100)\n) solid transparent;border-right:var(\n--spectrum-tooltip-neutral-tip-width,var(--spectrum-global-dimension-size-100)\n) solid transparent;border-top-style:solid;border-top-width:var(\n--spectrum-tooltip-neutral-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(var(\n--spectrum-tooltip-neutral-tip-width,\nvar(--spectrum-global-dimension-size-100)\n)*-1);top:50%}:host([placement*=right]){margin-left:var(\n--spectrum-tooltip-neutral-target-offset\n)}:host([placement*=right]) #tip{right:100%;transform:rotate(90deg)}:host([placement*=left]){margin-right:var(\n--spectrum-tooltip-neutral-target-offset\n)}:host([placement*=left]) #tip{left:100%;transform:rotate(-90deg)}:host([placement*=top]){margin-bottom:var(\n--spectrum-tooltip-neutral-target-offset\n)}:host([placement*=top]) #tip{top:100%}:host([placement*=bottom]){margin-top:var(\n--spectrum-tooltip-neutral-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(var(\n--spectrum-tooltip-neutral-tip-width,\nvar(--spectrum-global-dimension-size-100)\n)*-1)}:host([dir=ltr]) ::slotted([slot=icon]){margin-left:calc(var(\n--spectrum-tooltip-neutral-icon-margin-x,\nvar(--spectrum-global-dimension-size-85)\n) - var(\n--spectrum-tooltip-neutral-padding-x,\nvar(--spectrum-global-dimension-size-85)\n))}:host([dir=rtl]) ::slotted([slot=icon]){margin-right:calc(var(\n--spectrum-tooltip-neutral-icon-margin-x,\nvar(--spectrum-global-dimension-size-85)\n) - var(\n--spectrum-tooltip-neutral-padding-x,\nvar(--spectrum-global-dimension-size-85)\n))}:host([dir=ltr]) ::slotted([slot=icon]){margin-right:var(\n--spectrum-tooltip-neutral-icon-margin-x,var(--spectrum-global-dimension-size-85)\n)}:host([dir=rtl]) ::slotted([slot=icon]){margin-left:var(\n--spectrum-tooltip-neutral-icon-margin-x,var(--spectrum-global-dimension-size-85)\n)}::slotted([slot=icon]){align-self:flex-start;flex-shrink:0;height:var(\n--spectrum-tooltip-neutral-icon-size,var(--spectrum-global-dimension-size-200)\n);margin-bottom:var(\n--spectrum-tooltip-neutral-icon-margin-y,var(--spectrum-global-dimension-size-50)\n);margin-top:var(\n--spectrum-tooltip-neutral-icon-margin-y,var(--spectrum-global-dimension-size-50)\n);width:var(\n--spectrum-tooltip-neutral-icon-size,var(--spectrum-global-dimension-size-200)\n)}#label{line-height:var(\n--spectrum-tooltip-neutral-text-line-height,var(--spectrum-alias-component-text-line-height)\n);margin-bottom:var(--spectrum-tooltip-neutral-text-margin-bottom);margin-top:var(\n--spectrum-tooltip-neutral-text-margin-top,var(--spectrum-global-dimension-static-size-50)\n)}:host{background-color:var(\n--spectrum-tooltip-neutral-background-color,var(--spectrum-semantic-neutral-background-color-default)\n);color:var(\n--spectrum-tooltip-neutral-text-color,var(--spectrum-global-color-static-white)\n)}#tip{border-top-color:var(\n--spectrum-tooltip-neutral-background-color,var(--spectrum-semantic-neutral-background-color-default)\n)}.spectrum-Tooltip--error,:host([variant=negative]){background-color:var(\n--spectrum-tooltip-negative-background-color,var(--spectrum-semantic-negative-background-color)\n)}.spectrum-Tooltip--error #tip,:host([variant=negative]) #tip{border-top-color:var(\n--spectrum-tooltip-negative-background-color,var(--spectrum-semantic-negative-background-color)\n)}.spectrum-Tooltip--help,:host([variant=info]){background-color:var(\n--spectrum-tooltip-info-background-color,var(--spectrum-semantic-informative-background-color)\n)}.spectrum-Tooltip--help #tip,:host([variant=info]) #tip{border-top-color:var(\n--spectrum-tooltip-info-background-color,var(--spectrum-semantic-informative-background-color)\n)}.spectrum-Tooltip--success,:host([variant=positive]){background-color:var(\n--spectrum-tooltip-positive-background-color,var(--spectrum-semantic-positive-background-color)\n)}.spectrum-Tooltip--success #tip,:host([variant=positive]) #tip{border-top-color:var(\n--spectrum-tooltip-positive-background-color,var(--spectrum-semantic-positive-background-color)\n)}@media (forced-colors:active){:host{border:1px solid transparent}#tip{--spectrum-tooltip-neutral-background-color:CanvasText;--spectrum-tooltip-negative-background-color:CanvasText;--spectrum-tooltip-info-background-color:CanvasText;--spectrum-tooltip-positive-background-color:CanvasText;forced-color-adjust:none}}\n`;\nexport default styles;"]}
|
package/src/tooltip.css.js
CHANGED
|
@@ -97,7 +97,7 @@ var(--spectrum-global-dimension-size-85)
|
|
|
97
97
|
--spectrum-tooltip-positive-background-color,var(--spectrum-semantic-positive-background-color)
|
|
98
98
|
)}.spectrum-Tooltip--success #tip,:host([variant=positive]) #tip{border-top-color:var(
|
|
99
99
|
--spectrum-tooltip-positive-background-color,var(--spectrum-semantic-positive-background-color)
|
|
100
|
-
)}#tip{border:none}:host([placement*=bottom]) #tip,:host([placement*=left]) #tip,:host([placement*=right]) #tip{transform:none}#tip:after{border:var(
|
|
100
|
+
)}@media (forced-colors:active){:host{border:1px solid transparent}#tip{--spectrum-tooltip-neutral-background-color:CanvasText;--spectrum-tooltip-negative-background-color:CanvasText;--spectrum-tooltip-info-background-color:CanvasText;--spectrum-tooltip-positive-background-color:CanvasText;forced-color-adjust:none}}#tip{border:none}:host([placement*=bottom]) #tip,:host([placement*=left]) #tip,:host([placement*=right]) #tip{transform:none}#tip:after{border:var(
|
|
101
101
|
--spectrum-tooltip-tip-height,var(--spectrum-global-dimension-size-50)
|
|
102
102
|
) 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(
|
|
103
103
|
--spectrum-tooltip-background-color,var(--spectrum-global-color-static-gray-700)
|
|
@@ -107,7 +107,7 @@ var(--spectrum-global-dimension-size-85)
|
|
|
107
107
|
--spectrum-tooltip-info-background-color,var(--spectrum-global-color-static-blue-700)
|
|
108
108
|
)}:host([variant=positive]) #tip:after{border-top-color:var(
|
|
109
109
|
--spectrum-tooltip-positive-background-color,var(--spectrum-global-color-static-green-700)
|
|
110
|
-
)}
|
|
110
|
+
)}@media (forced-colors:active){#tip:after{--spectrum-tooltip-background-color:canvastext;--spectrum-tooltip-neutral-background-color:canvastext;--spectrum-tooltip-negative-background-color:canvastext;--spectrum-tooltip-info-background-color:canvastext;--spectrum-tooltip-positive-background-color:canvastext;forced-color-adjust:none}}
|
|
111
111
|
`;
|
|
112
112
|
export default styles;
|
|
113
113
|
//# sourceMappingURL=tooltip.css.js.map
|
package/src/tooltip.css.js.map
CHANGED
|
@@ -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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkGjB,CAAC;AACF,eAAe,MAAM,CAAC","sourcesContent":["/*\nCopyright 2022 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-tooltip-neutral-target-offset:3px;--spectrum-tooltip-neutral-tip-width:var(\n--spectrum-tooltip-neutral-tip-height,var(--spectrum-global-dimension-size-50)\n)}:host{-webkit-font-smoothing:antialiased;align-items:center;border-radius:var(\n--spectrum-tooltip-neutral-border-radius,var(--spectrum-alias-component-border-radius)\n);box-sizing:border-box;display:inline-flex;flex-direction:row;font-size:var(\n--spectrum-tooltip-neutral-text-size,var(--spectrum-global-dimension-font-size-75)\n);font-weight:var(\n--spectrum-tooltip-neutral-text-font-weight,var(--spectrum-alias-body-text-font-weight)\n);left:0;line-height:var(\n--spectrum-tooltip-neutral-text-line-height,var(--spectrum-alias-component-text-line-height)\n);max-width:var(\n--spectrum-tooltip-neutral-max-width,var(--spectrum-global-dimension-size-2000)\n);min-height:var(\n--spectrum-tooltip-neutral-min-height,var(--spectrum-global-dimension-size-300)\n);padding:0 var(\n--spectrum-tooltip-neutral-padding-x,var(--spectrum-global-dimension-size-85)\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-neutral-tip-width,var(--spectrum-global-dimension-size-100)\n) solid transparent;border-left:var(\n--spectrum-tooltip-neutral-tip-width,var(--spectrum-global-dimension-size-100)\n) solid transparent;border-right:var(\n--spectrum-tooltip-neutral-tip-width,var(--spectrum-global-dimension-size-100)\n) solid transparent;border-top-style:solid;border-top-width:var(\n--spectrum-tooltip-neutral-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(var(\n--spectrum-tooltip-neutral-tip-width,\nvar(--spectrum-global-dimension-size-100)\n)*-1);top:50%}:host([placement*=right]){margin-left:var(\n--spectrum-tooltip-neutral-target-offset\n)}:host([placement*=right]) #tip{right:100%;transform:rotate(90deg)}:host([placement*=left]){margin-right:var(\n--spectrum-tooltip-neutral-target-offset\n)}:host([placement*=left]) #tip{left:100%;transform:rotate(-90deg)}:host([placement*=top]){margin-bottom:var(\n--spectrum-tooltip-neutral-target-offset\n)}:host([placement*=top]) #tip{top:100%}:host([placement*=bottom]){margin-top:var(\n--spectrum-tooltip-neutral-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(var(\n--spectrum-tooltip-neutral-tip-width,\nvar(--spectrum-global-dimension-size-100)\n)*-1)}:host([dir=ltr]) ::slotted([slot=icon]){margin-left:calc(var(\n--spectrum-tooltip-neutral-icon-margin-x,\nvar(--spectrum-global-dimension-size-85)\n) - var(\n--spectrum-tooltip-neutral-padding-x,\nvar(--spectrum-global-dimension-size-85)\n))}:host([dir=rtl]) ::slotted([slot=icon]){margin-right:calc(var(\n--spectrum-tooltip-neutral-icon-margin-x,\nvar(--spectrum-global-dimension-size-85)\n) - var(\n--spectrum-tooltip-neutral-padding-x,\nvar(--spectrum-global-dimension-size-85)\n))}:host([dir=ltr]) ::slotted([slot=icon]){margin-right:var(\n--spectrum-tooltip-neutral-icon-margin-x,var(--spectrum-global-dimension-size-85)\n)}:host([dir=rtl]) ::slotted([slot=icon]){margin-left:var(\n--spectrum-tooltip-neutral-icon-margin-x,var(--spectrum-global-dimension-size-85)\n)}::slotted([slot=icon]){align-self:flex-start;flex-shrink:0;height:var(\n--spectrum-tooltip-neutral-icon-size,var(--spectrum-global-dimension-size-200)\n);margin-bottom:var(\n--spectrum-tooltip-neutral-icon-margin-y,var(--spectrum-global-dimension-size-50)\n);margin-top:var(\n--spectrum-tooltip-neutral-icon-margin-y,var(--spectrum-global-dimension-size-50)\n);width:var(\n--spectrum-tooltip-neutral-icon-size,var(--spectrum-global-dimension-size-200)\n)}#label{line-height:var(\n--spectrum-tooltip-neutral-text-line-height,var(--spectrum-alias-component-text-line-height)\n);margin-bottom:var(--spectrum-tooltip-neutral-text-margin-bottom);margin-top:var(\n--spectrum-tooltip-neutral-text-margin-top,var(--spectrum-global-dimension-static-size-50)\n)}:host{background-color:var(\n--spectrum-tooltip-neutral-background-color,var(--spectrum-semantic-neutral-background-color-default)\n);color:var(\n--spectrum-tooltip-neutral-text-color,var(--spectrum-global-color-static-white)\n)}#tip{border-top-color:var(\n--spectrum-tooltip-neutral-background-color,var(--spectrum-semantic-neutral-background-color-default)\n)}.spectrum-Tooltip--error,:host([variant=negative]){background-color:var(\n--spectrum-tooltip-negative-background-color,var(--spectrum-semantic-negative-background-color)\n)}.spectrum-Tooltip--error #tip,:host([variant=negative]) #tip{border-top-color:var(\n--spectrum-tooltip-negative-background-color,var(--spectrum-semantic-negative-background-color)\n)}.spectrum-Tooltip--help,:host([variant=info]){background-color:var(\n--spectrum-tooltip-info-background-color,var(--spectrum-semantic-informative-background-color)\n)}.spectrum-Tooltip--help #tip,:host([variant=info]) #tip{border-top-color:var(\n--spectrum-tooltip-info-background-color,var(--spectrum-semantic-informative-background-color)\n)}.spectrum-Tooltip--success,:host([variant=positive]){background-color:var(\n--spectrum-tooltip-positive-background-color,var(--spectrum-semantic-positive-background-color)\n)}.spectrum-Tooltip--success #tip,:host([variant=positive]) #tip{border-top-color:var(\n--spectrum-tooltip-positive-background-color,var(--spectrum-semantic-positive-background-color)\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;"]}
|
|
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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkGjB,CAAC;AACF,eAAe,MAAM,CAAC","sourcesContent":["/*\nCopyright 2022 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-tooltip-neutral-target-offset:3px;--spectrum-tooltip-neutral-tip-width:var(\n--spectrum-tooltip-neutral-tip-height,var(--spectrum-global-dimension-size-50)\n)}:host{-webkit-font-smoothing:antialiased;align-items:center;border-radius:var(\n--spectrum-tooltip-neutral-border-radius,var(--spectrum-alias-component-border-radius)\n);box-sizing:border-box;display:inline-flex;flex-direction:row;font-size:var(\n--spectrum-tooltip-neutral-text-size,var(--spectrum-global-dimension-font-size-75)\n);font-weight:var(\n--spectrum-tooltip-neutral-text-font-weight,var(--spectrum-alias-body-text-font-weight)\n);left:0;line-height:var(\n--spectrum-tooltip-neutral-text-line-height,var(--spectrum-alias-component-text-line-height)\n);max-width:var(\n--spectrum-tooltip-neutral-max-width,var(--spectrum-global-dimension-size-2000)\n);min-height:var(\n--spectrum-tooltip-neutral-min-height,var(--spectrum-global-dimension-size-300)\n);padding:0 var(\n--spectrum-tooltip-neutral-padding-x,var(--spectrum-global-dimension-size-85)\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-neutral-tip-width,var(--spectrum-global-dimension-size-100)\n) solid transparent;border-left:var(\n--spectrum-tooltip-neutral-tip-width,var(--spectrum-global-dimension-size-100)\n) solid transparent;border-right:var(\n--spectrum-tooltip-neutral-tip-width,var(--spectrum-global-dimension-size-100)\n) solid transparent;border-top-style:solid;border-top-width:var(\n--spectrum-tooltip-neutral-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(var(\n--spectrum-tooltip-neutral-tip-width,\nvar(--spectrum-global-dimension-size-100)\n)*-1);top:50%}:host([placement*=right]){margin-left:var(\n--spectrum-tooltip-neutral-target-offset\n)}:host([placement*=right]) #tip{right:100%;transform:rotate(90deg)}:host([placement*=left]){margin-right:var(\n--spectrum-tooltip-neutral-target-offset\n)}:host([placement*=left]) #tip{left:100%;transform:rotate(-90deg)}:host([placement*=top]){margin-bottom:var(\n--spectrum-tooltip-neutral-target-offset\n)}:host([placement*=top]) #tip{top:100%}:host([placement*=bottom]){margin-top:var(\n--spectrum-tooltip-neutral-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(var(\n--spectrum-tooltip-neutral-tip-width,\nvar(--spectrum-global-dimension-size-100)\n)*-1)}:host([dir=ltr]) ::slotted([slot=icon]){margin-left:calc(var(\n--spectrum-tooltip-neutral-icon-margin-x,\nvar(--spectrum-global-dimension-size-85)\n) - var(\n--spectrum-tooltip-neutral-padding-x,\nvar(--spectrum-global-dimension-size-85)\n))}:host([dir=rtl]) ::slotted([slot=icon]){margin-right:calc(var(\n--spectrum-tooltip-neutral-icon-margin-x,\nvar(--spectrum-global-dimension-size-85)\n) - var(\n--spectrum-tooltip-neutral-padding-x,\nvar(--spectrum-global-dimension-size-85)\n))}:host([dir=ltr]) ::slotted([slot=icon]){margin-right:var(\n--spectrum-tooltip-neutral-icon-margin-x,var(--spectrum-global-dimension-size-85)\n)}:host([dir=rtl]) ::slotted([slot=icon]){margin-left:var(\n--spectrum-tooltip-neutral-icon-margin-x,var(--spectrum-global-dimension-size-85)\n)}::slotted([slot=icon]){align-self:flex-start;flex-shrink:0;height:var(\n--spectrum-tooltip-neutral-icon-size,var(--spectrum-global-dimension-size-200)\n);margin-bottom:var(\n--spectrum-tooltip-neutral-icon-margin-y,var(--spectrum-global-dimension-size-50)\n);margin-top:var(\n--spectrum-tooltip-neutral-icon-margin-y,var(--spectrum-global-dimension-size-50)\n);width:var(\n--spectrum-tooltip-neutral-icon-size,var(--spectrum-global-dimension-size-200)\n)}#label{line-height:var(\n--spectrum-tooltip-neutral-text-line-height,var(--spectrum-alias-component-text-line-height)\n);margin-bottom:var(--spectrum-tooltip-neutral-text-margin-bottom);margin-top:var(\n--spectrum-tooltip-neutral-text-margin-top,var(--spectrum-global-dimension-static-size-50)\n)}:host{background-color:var(\n--spectrum-tooltip-neutral-background-color,var(--spectrum-semantic-neutral-background-color-default)\n);color:var(\n--spectrum-tooltip-neutral-text-color,var(--spectrum-global-color-static-white)\n)}#tip{border-top-color:var(\n--spectrum-tooltip-neutral-background-color,var(--spectrum-semantic-neutral-background-color-default)\n)}.spectrum-Tooltip--error,:host([variant=negative]){background-color:var(\n--spectrum-tooltip-negative-background-color,var(--spectrum-semantic-negative-background-color)\n)}.spectrum-Tooltip--error #tip,:host([variant=negative]) #tip{border-top-color:var(\n--spectrum-tooltip-negative-background-color,var(--spectrum-semantic-negative-background-color)\n)}.spectrum-Tooltip--help,:host([variant=info]){background-color:var(\n--spectrum-tooltip-info-background-color,var(--spectrum-semantic-informative-background-color)\n)}.spectrum-Tooltip--help #tip,:host([variant=info]) #tip{border-top-color:var(\n--spectrum-tooltip-info-background-color,var(--spectrum-semantic-informative-background-color)\n)}.spectrum-Tooltip--success,:host([variant=positive]){background-color:var(\n--spectrum-tooltip-positive-background-color,var(--spectrum-semantic-positive-background-color)\n)}.spectrum-Tooltip--success #tip,:host([variant=positive]) #tip{border-top-color:var(\n--spectrum-tooltip-positive-background-color,var(--spectrum-semantic-positive-background-color)\n)}@media (forced-colors:active){:host{border:1px solid transparent}#tip{--spectrum-tooltip-neutral-background-color:CanvasText;--spectrum-tooltip-negative-background-color:CanvasText;--spectrum-tooltip-info-background-color:CanvasText;--spectrum-tooltip-positive-background-color:CanvasText;forced-color-adjust:none}}#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)}@media (forced-colors:active){#tip:after{--spectrum-tooltip-background-color:canvastext;--spectrum-tooltip-neutral-background-color:canvastext;--spectrum-tooltip-negative-background-color:canvastext;--spectrum-tooltip-info-background-color:canvastext;--spectrum-tooltip-positive-background-color:canvastext;forced-color-adjust:none}}\n`;\nexport default styles;"]}
|