@swisspost/design-system-components 1.5.0 → 1.5.1

package/dist/cjs/post-tooltip.cjs.entry.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-12cc37c9.js');
-const _package = require('./package-67091813.js');
+const _package = require('./package-112e1698.js');
 const checkOneOf = require('./check-one-of-4c2e8b2e.js');
 
 const min = Math.min;
@@ -4915,7 +4915,7 @@ var isFocusable = isFocusableRules.except({});
 
 const BACKGROUND_COLOR = ['primary', 'yellow'];
 
-const postTooltipCss = "/**\n * Colors used by the post style guide\n */\n/**\n * Maps. Allow maps to have custom colors from the project\n * by always merging into a default empty map\n */\n:host, .bg-yellow {\n  --post-bg-opacity: 1;\n  background-color: rgba(var(--post-bg-rgb), var(--post-bg-opacity)) !important;\n  color: var(--post-contrast-color) !important;\n}\n\n.bg-yellow {\n  --post-contrast-color: #000;\n  --post-contrast-color-inverted: #fff;\n  --post-gray-10: hsl(0, 0%, 90%);\n  --post-gray-20: hsl(0, 0%, 80%);\n  --post-gray-40: hsl(0, 0%, 60%);\n  --post-gray-60: hsl(0, 0%, 40%);\n  --post-gray-80: hsl(0, 0%, 20%);\n  --post-yellow: #fc0;\n  --post-light: #faf9f8;\n  --post-gray: #f4f3f1;\n  --post-dark: hsl(0, 0%, 20%);\n  --post-primary: hsl(0, 0%, 20%);\n  --post-white: #fff;\n  --post-black: #000;\n  --post-success: #2c911c;\n  --post-info: #cce4ee;\n  --post-warning: #f49e00;\n  --post-danger: #a51728;\n  --post-nightblue: #004976;\n  --post-nightblue-bright: #0076a8;\n  --post-petrol: #006d68;\n  --post-petrol-bright: #00968f;\n  --post-coral: #9e2a2f;\n  --post-coral-bright: #e03c31;\n  --post-olive: #716135;\n  --post-olive-bright: #aa9d2e;\n  --post-purple: #80276c;\n  --post-purple-bright: #c5299b;\n  --post-aubergine: #523178;\n  --post-aubergine-bright: #7566a0;\n  --post-contrast-color-rgb: 0, 0, 0;\n  --post-contrast-color-inverted-rgb: 255, 255, 255;\n  --post-gray-10-rgb: 230, 230, 230;\n  --post-gray-20-rgb: 204, 204, 204;\n  --post-gray-40-rgb: 153, 153, 153;\n  --post-gray-60-rgb: 102, 102, 102;\n  --post-gray-80-rgb: 51, 51, 51;\n  --post-yellow-rgb: 255, 204, 0;\n  --post-light-rgb: 250, 249, 248;\n  --post-gray-rgb: 244, 243, 241;\n  --post-dark-rgb: 51, 51, 51;\n  --post-primary-rgb: 51, 51, 51;\n  --post-white-rgb: 255, 255, 255;\n  --post-black-rgb: 0, 0, 0;\n  --post-success-rgb: 44, 145, 28;\n  --post-info-rgb: 204, 228, 238;\n  --post-warning-rgb: 244, 158, 0;\n  --post-danger-rgb: 165, 23, 40;\n  --post-nightblue-rgb: 0, 73, 118;\n  --post-nightblue-bright-rgb: 0, 118, 168;\n  --post-petrol-rgb: 0, 109, 104;\n  --post-petrol-bright-rgb: 0, 150, 143;\n  --post-coral-rgb: 158, 42, 47;\n  --post-coral-bright-rgb: 224, 60, 49;\n  --post-olive-rgb: 113, 97, 53;\n  --post-olive-bright-rgb: 170, 157, 46;\n  --post-purple-rgb: 128, 39, 108;\n  --post-purple-bright-rgb: 197, 41, 155;\n  --post-aubergine-rgb: 82, 49, 120;\n  --post-aubergine-bright-rgb: 117, 102, 160;\n}\n\n:host {\n  --post-contrast-color: #fff;\n  --post-contrast-color-inverted: #000;\n  --post-dark: #faf9f8;\n  --post-light: hsl(0, 0%, 20%);\n  --post-gray-80: hsl(0, 0%, 90%);\n  --post-gray-60: hsl(0, 0%, 80%);\n  --post-gray-40: hsl(0, 0%, 60%);\n  --post-gray-20: hsl(0, 0%, 40%);\n  --post-gray-10: hsl(0, 0%, 20%);\n  --post-contrast-color-rgb: 255, 255, 255;\n  --post-contrast-color-inverted-rgb: 0, 0, 0;\n  --post-dark-rgb: 250, 249, 248;\n  --post-light-rgb: 51, 51, 51;\n  --post-gray-80-rgb: 230, 230, 230;\n  --post-gray-60-rgb: 204, 204, 204;\n  --post-gray-40-rgb: 153, 153, 153;\n  --post-gray-20-rgb: 102, 102, 102;\n  --post-gray-10-rgb: 51, 51, 51;\n}\n\n@layer polyfill {\n  [popover] {\n    position: fixed;\n    z-index: 2147483647;\n    inset: 0;\n    padding: 0.25em;\n    width: fit-content;\n    height: fit-content;\n    border-width: initial;\n    border-color: initial;\n    border-image: initial;\n    border-style: solid;\n    background-color: canvas;\n    color: canvastext;\n    overflow: auto;\n    margin: auto;\n  }\n  [popover]:not(.\\:popover-open) {\n    display: none;\n  }\n  [popover]:is(dialog[open]) {\n    display: revert;\n  }\n  [anchor].\\:popover-open {\n    inset: auto;\n  }\n  @supports selector([popover]:open) {\n    [popover]:not(.\\:popover-open, dialog[open]) {\n      display: revert;\n    }\n    [anchor]:is(:open) {\n      inset: auto;\n    }\n  }\n  @supports selector([popover]:popover-open) {\n    [popover]:not(.\\:popover-open, dialog[open]) {\n      display: revert;\n    }\n    [anchor]:is(:popover-open) {\n      inset: auto;\n    }\n  }\n  @supports not (background-color: canvas) {\n    [popover] {\n      background-color: white;\n      color: black;\n    }\n  }\n  @supports (width: -moz-fit-content) {\n    [popover] {\n      width: -moz-fit-content;\n      height: -moz-fit-content;\n    }\n  }\n  @supports not (inset: 0) {\n    [popover] {\n      top: 0;\n      left: 0;\n      right: 0;\n      bottom: 0;\n    }\n  }\n}\n:host {\n  --post-bg-rgb: 51, 51, 51;\n}\n\ndiv {\n  position: absolute;\n  z-index: 1070;\n  width: max-content;\n  max-width: 30ch;\n  margin: 0;\n  padding: 0.25rem 0.5rem;\n  color: inherit;\n  background-color: inherit;\n  border-color: transparent;\n  border-radius: 4px;\n  overflow: visible;\n  pointer-events: none;\n}\n\n.arrow {\n  position: absolute;\n  width: 0.7071067812rem;\n  aspect-ratio: 1/1;\n  background-color: inherit;\n  rotate: 45deg;\n  pointer-events: none;\n  z-index: -1;\n  border-right: 2px solid transparent;\n  border-bottom: 2px solid transparent;\n}\n\n.bg-yellow {\n  --post-bg-rgb: 255, 204, 0;\n}";
+const postTooltipCss = ":host,.bg-yellow{--post-bg-opacity: 1;background-color:rgba(var(--post-bg-rgb), var(--post-bg-opacity)) !important;color:var(--post-contrast-color) !important}.bg-yellow{--post-contrast-color: #000;--post-contrast-color-inverted: #fff;--post-gray-10: hsl(0, 0%, 90%);--post-gray-20: hsl(0, 0%, 80%);--post-gray-40: hsl(0, 0%, 60%);--post-gray-60: hsl(0, 0%, 40%);--post-gray-80: hsl(0, 0%, 20%);--post-yellow: #fc0;--post-light: #faf9f8;--post-gray: #f4f3f1;--post-dark: hsl(0, 0%, 20%);--post-primary: hsl(0, 0%, 20%);--post-white: #fff;--post-black: #000;--post-success: #2c911c;--post-info: #cce4ee;--post-warning: #f49e00;--post-danger: #a51728;--post-nightblue: #004976;--post-nightblue-bright: #0076a8;--post-petrol: #006d68;--post-petrol-bright: #00968f;--post-coral: #9e2a2f;--post-coral-bright: #e03c31;--post-olive: #716135;--post-olive-bright: #aa9d2e;--post-purple: #80276c;--post-purple-bright: #c5299b;--post-aubergine: #523178;--post-aubergine-bright: #7566a0;--post-contrast-color-rgb: 0, 0, 0;--post-contrast-color-inverted-rgb: 255, 255, 255;--post-gray-10-rgb: 230, 230, 230;--post-gray-20-rgb: 204, 204, 204;--post-gray-40-rgb: 153, 153, 153;--post-gray-60-rgb: 102, 102, 102;--post-gray-80-rgb: 51, 51, 51;--post-yellow-rgb: 255, 204, 0;--post-light-rgb: 250, 249, 248;--post-gray-rgb: 244, 243, 241;--post-dark-rgb: 51, 51, 51;--post-primary-rgb: 51, 51, 51;--post-white-rgb: 255, 255, 255;--post-black-rgb: 0, 0, 0;--post-success-rgb: 44, 145, 28;--post-info-rgb: 204, 228, 238;--post-warning-rgb: 244, 158, 0;--post-danger-rgb: 165, 23, 40;--post-nightblue-rgb: 0, 73, 118;--post-nightblue-bright-rgb: 0, 118, 168;--post-petrol-rgb: 0, 109, 104;--post-petrol-bright-rgb: 0, 150, 143;--post-coral-rgb: 158, 42, 47;--post-coral-bright-rgb: 224, 60, 49;--post-olive-rgb: 113, 97, 53;--post-olive-bright-rgb: 170, 157, 46;--post-purple-rgb: 128, 39, 108;--post-purple-bright-rgb: 197, 41, 155;--post-aubergine-rgb: 82, 49, 120;--post-aubergine-bright-rgb: 117, 102, 160}:host{--post-contrast-color: #fff;--post-contrast-color-inverted: #000;--post-dark: #faf9f8;--post-light: hsl(0, 0%, 20%);--post-gray-80: hsl(0, 0%, 90%);--post-gray-60: hsl(0, 0%, 80%);--post-gray-40: hsl(0, 0%, 60%);--post-gray-20: hsl(0, 0%, 40%);--post-gray-10: hsl(0, 0%, 20%);--post-contrast-color-rgb: 255, 255, 255;--post-contrast-color-inverted-rgb: 0, 0, 0;--post-dark-rgb: 250, 249, 248;--post-light-rgb: 51, 51, 51;--post-gray-80-rgb: 230, 230, 230;--post-gray-60-rgb: 204, 204, 204;--post-gray-40-rgb: 153, 153, 153;--post-gray-20-rgb: 102, 102, 102;--post-gray-10-rgb: 51, 51, 51}@layer polyfill{[popover]{position:fixed;z-index:2147483647;inset:0;padding:.25em;width:fit-content;height:fit-content;border-width:initial;border-color:initial;border-image:initial;border-style:solid;background-color:canvas;color:canvastext;overflow:auto;margin:auto}[popover]:not(.\\:popover-open){display:none}[popover]:is(dialog[open]){display:revert}[anchor].\\:popover-open{inset:auto}@supports selector([popover]:open){[popover]:not(.\\:popover-open,dialog[open]){display:revert}[anchor]:is(:open){inset:auto}}@supports selector([popover]:popover-open){[popover]:not(.\\:popover-open,dialog[open]){display:revert}[anchor]:is(:popover-open){inset:auto}}@supports not (background-color: canvas){[popover]{background-color:white;color:black}}@supports(width: -moz-fit-content){[popover]{width:-moz-fit-content;height:-moz-fit-content}}@supports not (inset: 0){[popover]{top:0;left:0;right:0;bottom:0}}}:host{--post-bg-rgb: 51, 51, 51}div{position:absolute;z-index:1070;width:max-content;max-width:30ch;margin:0;padding:.25rem .5rem;color:inherit;background-color:inherit;border-color:rgba(0,0,0,0);border-radius:4px;overflow:visible;pointer-events:none}.arrow{position:absolute;width:.7071067812rem;aspect-ratio:1/1;background-color:inherit;rotate:45deg;pointer-events:none;z-index:-1;border-right:2px solid rgba(0,0,0,0);border-bottom:2px solid rgba(0,0,0,0)}.bg-yellow{--post-bg-rgb: 255, 204, 0}";
 
 const SIDE_MAP = {
   top: 'bottom',