@speakapbv/dough-component-library 9.21.1 → 9.21.2

package/dist/index.es.js

@@ -4240,7 +4240,7 @@ var Dialog = function (props) {
 };
 Dialog.displayName = "Dialog";
 
-var css_248z$t = "/* COLORS */\n/* Typography*/\n/*Dennis should provide medium font size*/\n.dough-tooltip {\n  display: inline;\n  position: relative;\n  pointer-events: all;\n}\n.dough-tooltip.dough-tooltip-full-width {\n  width: 100%;\n  box-sizing: border-box;\n}\n.dough-tooltip.disabled {\n  pointer-events: none;\n}\n\n.dough-tooltip-wrapper {\n  position: fixed;\n  background-color: rgba(0, 0, 0, 0);\n  position: absolute;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  z-index: 10;\n  width: auto;\n  height: auto;\n  transform: translate3d(0, 4px, 0);\n  overflow: hidden;\n  pointer-events: none;\n  font-family: \"Roboto\", sans-serif;\n  opacity: 0;\n  transform-origin: center center;\n}\nbody:not(.no-transition) .dough-tooltip-wrapper {\n  transition: all 450ms cubic-bezier(0.25, 1, 0, 1);\n}\nbody.no-transition .dough-tooltip-wrapper {\n  transition: none 0ms linear !important;\n  transition-delay: 0ms !important;\n}\n.dough-tooltip-wrapper > .dough-tooltip-container {\n  overflow: visible;\n  display: block;\n  padding: 0;\n  box-sizing: border-box;\n  pointer-events: none;\n  position: relative;\n}\n.dough-tooltip-wrapper > .dough-tooltip-container > .dough-tooltip-content {\n  position: absolute;\n  z-index: 10;\n  background-color: rgb(0, 0, 0);\n  padding: 8px;\n  border-radius: 12px;\n  font-size: 0.8125rem;\n  box-sizing: border-box;\n  color: rgb(255, 255, 255);\n  color: var(--dough-color-white);\n  max-width: 60vw;\n  display: inline-block;\n  overflow: hidden;\n  transform: translate3d(-50%, 0, 0);\n}\n.dough-tooltip-wrapper > .dough-tooltip-container > .dough-tooltip-arrow {\n  display: flex;\n  flex-flow: row nowrap;\n  justify-content: center;\n  align-items: flex-start;\n  overflow: hidden;\n  transform: translate3d(0, 0, 0);\n  position: absolute;\n  z-index: 20;\n  width: 12px;\n  height: 6px;\n}\n.dough-tooltip-wrapper > .dough-tooltip-container > .dough-tooltip-arrow > svg {\n  transform: translate3d(0, 0, 0) rotateZ(180deg);\n  width: 100%;\n  height: 100%;\n}\n.dough-tooltip-wrapper > .dough-tooltip-container > .dough-tooltip-arrow > svg > polygon {\n  fill: rgba(0, 0, 0, 0.75);\n}\n.dough-tooltip-wrapper > .dough-tooltip-container.light > .dough-tooltip-content {\n  background-color: rgb(255, 255, 255);\n  background-color: var(--dough-color-white);\n  box-shadow: 0 1px 15px 0 rgba(0, 0, 0, 0.2);\n  color: rgb(110, 111, 117);\n  color: var(--dough-color-text-default);\n}\n.dough-tooltip-wrapper > .dough-tooltip-container.light > .dough-tooltip-arrow > svg > polygon {\n  fill: rgb(255, 255, 255);\n  fill: var(--dough-color-white);\n}\n.dough-tooltip-wrapper.up > .dough-tooltip-container > .dough-tooltip-content, .dough-tooltip-wrapper.up-left > .dough-tooltip-container > .dough-tooltip-content {\n  bottom: -7px;\n}\n.dough-tooltip-wrapper.up > .dough-tooltip-container > .dough-tooltip-arrow, .dough-tooltip-wrapper.up-left > .dough-tooltip-container > .dough-tooltip-arrow {\n  top: -1.5px;\n  transform: translate3d(-50%, 7.75px, 0) rotateZ(0deg);\n}\n.dough-tooltip-wrapper.down > .dough-tooltip-container > .dough-tooltip-content {\n  top: 2px;\n}\n.dough-tooltip-wrapper.down > .dough-tooltip-container > .dough-tooltip-arrow {\n  top: 4.5px;\n  transform: translate3d(-50%, -8px, 0) rotateZ(180deg);\n}\n.dough-tooltip-wrapper.right > .dough-tooltip-container > .dough-tooltip-content {\n  transform: translate3d(0, -50%, 0);\n  top: 2px;\n}\n.dough-tooltip-wrapper.right > .dough-tooltip-container > .dough-tooltip-arrow {\n  left: 3.25px;\n  transform: translate3d(-12px, -1px, 0) rotateZ(90deg);\n}\n.dough-tooltip-wrapper.left > .dough-tooltip-container > .dough-tooltip-content {\n  transform: translate3d(-100%, -50%, 0);\n  top: 2px;\n}\n.dough-tooltip-wrapper.left > .dough-tooltip-container > .dough-tooltip-arrow {\n  left: -15px;\n  transform: translate3d(12px, -1px, 0) rotateZ(-90deg);\n}\n.dough-tooltip-wrapper.visible:not(:empty) {\n  opacity: 1;\n}\n.dough-tooltip-wrapper.visible:not(:empty).up, .dough-tooltip-wrapper.visible:not(:empty).up-left {\n  transform: translate3d(0, -12px, 0);\n}\n.dough-tooltip-wrapper.visible:not(:empty).down {\n  transform: translate3d(0, 12px, 0);\n}\n.dough-tooltip-wrapper.visible:not(:empty).right {\n  transform: translate3d(8px, 4px, 0);\n}\n.dough-tooltip-wrapper.visible:not(:empty).left {\n  transform: translate3d(-8px, 4px, 0);\n}";
+var css_248z$t = "/* COLORS */\n/* Typography*/\n/*Dennis should provide medium font size*/\n.dough-tooltip {\n  display: inline;\n  position: relative;\n  pointer-events: all;\n}\n.dough-tooltip.dough-tooltip-full-width {\n  width: 100%;\n  box-sizing: border-box;\n}\n.dough-tooltip.disabled {\n  pointer-events: none;\n}\n\n.dough-tooltip-wrapper {\n  position: fixed;\n  background-color: rgba(0, 0, 0, 0);\n  position: absolute;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  z-index: 10;\n  width: auto;\n  height: auto;\n  transform: translate3d(0, 4px, 0);\n  overflow: hidden;\n  pointer-events: none;\n  font-family: \"Roboto\", sans-serif;\n  opacity: 0;\n  transform-origin: center center;\n}\nbody:not(.no-transition) .dough-tooltip-wrapper {\n  transition: all 450ms cubic-bezier(0.25, 1, 0, 1);\n}\nbody.no-transition .dough-tooltip-wrapper {\n  transition: none 0ms linear !important;\n  transition-delay: 0ms !important;\n}\n.dough-tooltip-wrapper > .dough-tooltip-container {\n  overflow: visible;\n  display: block;\n  padding: 0;\n  box-sizing: border-box;\n  pointer-events: none;\n  position: relative;\n}\n.dough-tooltip-wrapper > .dough-tooltip-container > .dough-tooltip-content {\n  position: absolute;\n  z-index: 10;\n  background-color: rgb(0, 0, 0);\n  padding: 8px 16px;\n  border-radius: 12px;\n  font-size: 0.8125rem;\n  box-sizing: border-box;\n  color: rgb(255, 255, 255);\n  color: var(--dough-color-white);\n  max-width: 60vw;\n  display: inline-block;\n  overflow: hidden;\n  transform: translate3d(-50%, 0, 0);\n}\n.dough-tooltip-wrapper > .dough-tooltip-container > .dough-tooltip-arrow {\n  display: flex;\n  flex-flow: row nowrap;\n  justify-content: center;\n  align-items: flex-start;\n  overflow: hidden;\n  transform: translate3d(0, 0, 0);\n  position: absolute;\n  z-index: 20;\n  width: 12px;\n  height: 6px;\n}\n.dough-tooltip-wrapper > .dough-tooltip-container > .dough-tooltip-arrow > svg {\n  transform: translate3d(0, 0, 0) rotateZ(180deg);\n  width: 100%;\n  height: 100%;\n}\n.dough-tooltip-wrapper > .dough-tooltip-container > .dough-tooltip-arrow > svg > polygon {\n  fill: rgba(0, 0, 0, 0.75);\n}\n.dough-tooltip-wrapper > .dough-tooltip-container.light > .dough-tooltip-content {\n  background-color: rgb(255, 255, 255);\n  background-color: var(--dough-color-white);\n  box-shadow: 0 1px 15px 0 rgba(0, 0, 0, 0.2);\n  color: rgb(110, 111, 117);\n  color: var(--dough-color-text-default);\n}\n.dough-tooltip-wrapper > .dough-tooltip-container.light > .dough-tooltip-arrow > svg > polygon {\n  fill: rgb(255, 255, 255);\n  fill: var(--dough-color-white);\n}\n.dough-tooltip-wrapper.up > .dough-tooltip-container > .dough-tooltip-content, .dough-tooltip-wrapper.up-left > .dough-tooltip-container > .dough-tooltip-content {\n  bottom: -7px;\n}\n.dough-tooltip-wrapper.up > .dough-tooltip-container > .dough-tooltip-arrow, .dough-tooltip-wrapper.up-left > .dough-tooltip-container > .dough-tooltip-arrow {\n  top: -1.5px;\n  transform: translate3d(-50%, 7.75px, 0) rotateZ(0deg);\n}\n.dough-tooltip-wrapper.down > .dough-tooltip-container > .dough-tooltip-content {\n  top: 2px;\n}\n.dough-tooltip-wrapper.down > .dough-tooltip-container > .dough-tooltip-arrow {\n  top: 4.5px;\n  transform: translate3d(-50%, -8px, 0) rotateZ(180deg);\n}\n.dough-tooltip-wrapper.right > .dough-tooltip-container > .dough-tooltip-content {\n  transform: translate3d(0, -50%, 0);\n  top: 2px;\n}\n.dough-tooltip-wrapper.right > .dough-tooltip-container > .dough-tooltip-arrow {\n  left: 3.25px;\n  transform: translate3d(-12px, -1px, 0) rotateZ(90deg);\n}\n.dough-tooltip-wrapper.left > .dough-tooltip-container > .dough-tooltip-content {\n  transform: translate3d(-100%, -50%, 0);\n  top: 2px;\n}\n.dough-tooltip-wrapper.left > .dough-tooltip-container > .dough-tooltip-arrow {\n  left: -15px;\n  transform: translate3d(12px, -1px, 0) rotateZ(-90deg);\n}\n.dough-tooltip-wrapper.visible:not(:empty) {\n  opacity: 1;\n}\n.dough-tooltip-wrapper.visible:not(:empty).up, .dough-tooltip-wrapper.visible:not(:empty).up-left {\n  transform: translate3d(0, -12px, 0);\n}\n.dough-tooltip-wrapper.visible:not(:empty).down {\n  transform: translate3d(0, 12px, 0);\n}\n.dough-tooltip-wrapper.visible:not(:empty).right {\n  transform: translate3d(8px, 4px, 0);\n}\n.dough-tooltip-wrapper.visible:not(:empty).left {\n  transform: translate3d(-8px, 4px, 0);\n}";
 styleInject(css_248z$t);
 
 var TooltipDirection;

package/dist/index.js

@@ -4224,7 +4224,7 @@ var Dialog = function (props) {
 };
 Dialog.displayName = "Dialog";
 
-var css_248z$t = "/* COLORS */\n/* Typography*/\n/*Dennis should provide medium font size*/\n.dough-tooltip {\n  display: inline;\n  position: relative;\n  pointer-events: all;\n}\n.dough-tooltip.dough-tooltip-full-width {\n  width: 100%;\n  box-sizing: border-box;\n}\n.dough-tooltip.disabled {\n  pointer-events: none;\n}\n\n.dough-tooltip-wrapper {\n  position: fixed;\n  background-color: rgba(0, 0, 0, 0);\n  position: absolute;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  z-index: 10;\n  width: auto;\n  height: auto;\n  transform: translate3d(0, 4px, 0);\n  overflow: hidden;\n  pointer-events: none;\n  font-family: \"Roboto\", sans-serif;\n  opacity: 0;\n  transform-origin: center center;\n}\nbody:not(.no-transition) .dough-tooltip-wrapper {\n  transition: all 450ms cubic-bezier(0.25, 1, 0, 1);\n}\nbody.no-transition .dough-tooltip-wrapper {\n  transition: none 0ms linear !important;\n  transition-delay: 0ms !important;\n}\n.dough-tooltip-wrapper > .dough-tooltip-container {\n  overflow: visible;\n  display: block;\n  padding: 0;\n  box-sizing: border-box;\n  pointer-events: none;\n  position: relative;\n}\n.dough-tooltip-wrapper > .dough-tooltip-container > .dough-tooltip-content {\n  position: absolute;\n  z-index: 10;\n  background-color: rgb(0, 0, 0);\n  padding: 8px;\n  border-radius: 12px;\n  font-size: 0.8125rem;\n  box-sizing: border-box;\n  color: rgb(255, 255, 255);\n  color: var(--dough-color-white);\n  max-width: 60vw;\n  display: inline-block;\n  overflow: hidden;\n  transform: translate3d(-50%, 0, 0);\n}\n.dough-tooltip-wrapper > .dough-tooltip-container > .dough-tooltip-arrow {\n  display: flex;\n  flex-flow: row nowrap;\n  justify-content: center;\n  align-items: flex-start;\n  overflow: hidden;\n  transform: translate3d(0, 0, 0);\n  position: absolute;\n  z-index: 20;\n  width: 12px;\n  height: 6px;\n}\n.dough-tooltip-wrapper > .dough-tooltip-container > .dough-tooltip-arrow > svg {\n  transform: translate3d(0, 0, 0) rotateZ(180deg);\n  width: 100%;\n  height: 100%;\n}\n.dough-tooltip-wrapper > .dough-tooltip-container > .dough-tooltip-arrow > svg > polygon {\n  fill: rgba(0, 0, 0, 0.75);\n}\n.dough-tooltip-wrapper > .dough-tooltip-container.light > .dough-tooltip-content {\n  background-color: rgb(255, 255, 255);\n  background-color: var(--dough-color-white);\n  box-shadow: 0 1px 15px 0 rgba(0, 0, 0, 0.2);\n  color: rgb(110, 111, 117);\n  color: var(--dough-color-text-default);\n}\n.dough-tooltip-wrapper > .dough-tooltip-container.light > .dough-tooltip-arrow > svg > polygon {\n  fill: rgb(255, 255, 255);\n  fill: var(--dough-color-white);\n}\n.dough-tooltip-wrapper.up > .dough-tooltip-container > .dough-tooltip-content, .dough-tooltip-wrapper.up-left > .dough-tooltip-container > .dough-tooltip-content {\n  bottom: -7px;\n}\n.dough-tooltip-wrapper.up > .dough-tooltip-container > .dough-tooltip-arrow, .dough-tooltip-wrapper.up-left > .dough-tooltip-container > .dough-tooltip-arrow {\n  top: -1.5px;\n  transform: translate3d(-50%, 7.75px, 0) rotateZ(0deg);\n}\n.dough-tooltip-wrapper.down > .dough-tooltip-container > .dough-tooltip-content {\n  top: 2px;\n}\n.dough-tooltip-wrapper.down > .dough-tooltip-container > .dough-tooltip-arrow {\n  top: 4.5px;\n  transform: translate3d(-50%, -8px, 0) rotateZ(180deg);\n}\n.dough-tooltip-wrapper.right > .dough-tooltip-container > .dough-tooltip-content {\n  transform: translate3d(0, -50%, 0);\n  top: 2px;\n}\n.dough-tooltip-wrapper.right > .dough-tooltip-container > .dough-tooltip-arrow {\n  left: 3.25px;\n  transform: translate3d(-12px, -1px, 0) rotateZ(90deg);\n}\n.dough-tooltip-wrapper.left > .dough-tooltip-container > .dough-tooltip-content {\n  transform: translate3d(-100%, -50%, 0);\n  top: 2px;\n}\n.dough-tooltip-wrapper.left > .dough-tooltip-container > .dough-tooltip-arrow {\n  left: -15px;\n  transform: translate3d(12px, -1px, 0) rotateZ(-90deg);\n}\n.dough-tooltip-wrapper.visible:not(:empty) {\n  opacity: 1;\n}\n.dough-tooltip-wrapper.visible:not(:empty).up, .dough-tooltip-wrapper.visible:not(:empty).up-left {\n  transform: translate3d(0, -12px, 0);\n}\n.dough-tooltip-wrapper.visible:not(:empty).down {\n  transform: translate3d(0, 12px, 0);\n}\n.dough-tooltip-wrapper.visible:not(:empty).right {\n  transform: translate3d(8px, 4px, 0);\n}\n.dough-tooltip-wrapper.visible:not(:empty).left {\n  transform: translate3d(-8px, 4px, 0);\n}";
+var css_248z$t = "/* COLORS */\n/* Typography*/\n/*Dennis should provide medium font size*/\n.dough-tooltip {\n  display: inline;\n  position: relative;\n  pointer-events: all;\n}\n.dough-tooltip.dough-tooltip-full-width {\n  width: 100%;\n  box-sizing: border-box;\n}\n.dough-tooltip.disabled {\n  pointer-events: none;\n}\n\n.dough-tooltip-wrapper {\n  position: fixed;\n  background-color: rgba(0, 0, 0, 0);\n  position: absolute;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  z-index: 10;\n  width: auto;\n  height: auto;\n  transform: translate3d(0, 4px, 0);\n  overflow: hidden;\n  pointer-events: none;\n  font-family: \"Roboto\", sans-serif;\n  opacity: 0;\n  transform-origin: center center;\n}\nbody:not(.no-transition) .dough-tooltip-wrapper {\n  transition: all 450ms cubic-bezier(0.25, 1, 0, 1);\n}\nbody.no-transition .dough-tooltip-wrapper {\n  transition: none 0ms linear !important;\n  transition-delay: 0ms !important;\n}\n.dough-tooltip-wrapper > .dough-tooltip-container {\n  overflow: visible;\n  display: block;\n  padding: 0;\n  box-sizing: border-box;\n  pointer-events: none;\n  position: relative;\n}\n.dough-tooltip-wrapper > .dough-tooltip-container > .dough-tooltip-content {\n  position: absolute;\n  z-index: 10;\n  background-color: rgb(0, 0, 0);\n  padding: 8px 16px;\n  border-radius: 12px;\n  font-size: 0.8125rem;\n  box-sizing: border-box;\n  color: rgb(255, 255, 255);\n  color: var(--dough-color-white);\n  max-width: 60vw;\n  display: inline-block;\n  overflow: hidden;\n  transform: translate3d(-50%, 0, 0);\n}\n.dough-tooltip-wrapper > .dough-tooltip-container > .dough-tooltip-arrow {\n  display: flex;\n  flex-flow: row nowrap;\n  justify-content: center;\n  align-items: flex-start;\n  overflow: hidden;\n  transform: translate3d(0, 0, 0);\n  position: absolute;\n  z-index: 20;\n  width: 12px;\n  height: 6px;\n}\n.dough-tooltip-wrapper > .dough-tooltip-container > .dough-tooltip-arrow > svg {\n  transform: translate3d(0, 0, 0) rotateZ(180deg);\n  width: 100%;\n  height: 100%;\n}\n.dough-tooltip-wrapper > .dough-tooltip-container > .dough-tooltip-arrow > svg > polygon {\n  fill: rgba(0, 0, 0, 0.75);\n}\n.dough-tooltip-wrapper > .dough-tooltip-container.light > .dough-tooltip-content {\n  background-color: rgb(255, 255, 255);\n  background-color: var(--dough-color-white);\n  box-shadow: 0 1px 15px 0 rgba(0, 0, 0, 0.2);\n  color: rgb(110, 111, 117);\n  color: var(--dough-color-text-default);\n}\n.dough-tooltip-wrapper > .dough-tooltip-container.light > .dough-tooltip-arrow > svg > polygon {\n  fill: rgb(255, 255, 255);\n  fill: var(--dough-color-white);\n}\n.dough-tooltip-wrapper.up > .dough-tooltip-container > .dough-tooltip-content, .dough-tooltip-wrapper.up-left > .dough-tooltip-container > .dough-tooltip-content {\n  bottom: -7px;\n}\n.dough-tooltip-wrapper.up > .dough-tooltip-container > .dough-tooltip-arrow, .dough-tooltip-wrapper.up-left > .dough-tooltip-container > .dough-tooltip-arrow {\n  top: -1.5px;\n  transform: translate3d(-50%, 7.75px, 0) rotateZ(0deg);\n}\n.dough-tooltip-wrapper.down > .dough-tooltip-container > .dough-tooltip-content {\n  top: 2px;\n}\n.dough-tooltip-wrapper.down > .dough-tooltip-container > .dough-tooltip-arrow {\n  top: 4.5px;\n  transform: translate3d(-50%, -8px, 0) rotateZ(180deg);\n}\n.dough-tooltip-wrapper.right > .dough-tooltip-container > .dough-tooltip-content {\n  transform: translate3d(0, -50%, 0);\n  top: 2px;\n}\n.dough-tooltip-wrapper.right > .dough-tooltip-container > .dough-tooltip-arrow {\n  left: 3.25px;\n  transform: translate3d(-12px, -1px, 0) rotateZ(90deg);\n}\n.dough-tooltip-wrapper.left > .dough-tooltip-container > .dough-tooltip-content {\n  transform: translate3d(-100%, -50%, 0);\n  top: 2px;\n}\n.dough-tooltip-wrapper.left > .dough-tooltip-container > .dough-tooltip-arrow {\n  left: -15px;\n  transform: translate3d(12px, -1px, 0) rotateZ(-90deg);\n}\n.dough-tooltip-wrapper.visible:not(:empty) {\n  opacity: 1;\n}\n.dough-tooltip-wrapper.visible:not(:empty).up, .dough-tooltip-wrapper.visible:not(:empty).up-left {\n  transform: translate3d(0, -12px, 0);\n}\n.dough-tooltip-wrapper.visible:not(:empty).down {\n  transform: translate3d(0, 12px, 0);\n}\n.dough-tooltip-wrapper.visible:not(:empty).right {\n  transform: translate3d(8px, 4px, 0);\n}\n.dough-tooltip-wrapper.visible:not(:empty).left {\n  transform: translate3d(-8px, 4px, 0);\n}";
 styleInject(css_248z$t);
 
 (function (TooltipDirection) {

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@speakapbv/dough-component-library",
-    "version": "9.21.1",
+    "version": "9.21.2",
     "description": "DOUGH: Speakap React Component Library",
     "author": "Speakap",
     "license": "MIT",