@pantograph/styles 0.0.24 → 0.0.26

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.
Files changed (13) hide show
  1. package/dist/coach_mark.css +1 -1
  2. package/dist/coach_mark.js +1 -1
  3. package/dist/coach_mark.umd.cjs +1 -1
  4. package/dist/index.css +1 -1
  5. package/dist/index.js +1 -1
  6. package/dist/index.umd.cjs +1 -1
  7. package/dist/tcell.css +1 -1
  8. package/dist/tcell.js +1 -1
  9. package/dist/tcell.umd.cjs +1 -1
  10. package/dist/tr.css +1 -1
  11. package/dist/tr.js +1 -1
  12. package/dist/tr.umd.cjs +1 -1
  13. package/package.json +1 -1
package/dist/coach_mark.css CHANGED
@@ -1 +1 @@
1
- .pc_coach_mark{position:relative;border-radius:var(--pt-roundness-lg, 8px);padding:var(--pt-dimension-600, 12px);width:var(--ptc-coachmark-w)}.pc_coach_mark:before{content:"";position:absolute;width:8px;height:8px;--ptu-skew-x:6deg;--ptu-skew-y:6deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));--ptu-border-opacity:1;border-color:rgba(var(--pt-br),var(--ptu-border-opacity));border-style:solid;--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg),var(--ptu-bg-opacity));border-top-right-radius:3px;border-bottom-left-radius:3px}.pc_coach_mark[data-side=bottom]:before{--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:-45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-top-width:1px;border-right-width:1px;top:-4.5px}.pc_coach_mark[data-side=bottom][data-align=center]:before{left:50%;--ptu-translate-x:-50%;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z))}.pc_coach_mark[data-side=bottom][data-align=start]:before{inset-inline-start:12px}.pc_coach_mark[data-side=bottom][data-align=end]:before{inset-inline-end:12px}.pc_coach_mark[data-side=top]:before{--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:-45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-bottom-width:1px;border-left-width:1px;bottom:-4.5px}.pc_coach_mark[data-side=top][data-align=center]:before{left:50%;--ptu-translate-x:-50%;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z))}.pc_coach_mark[data-side=top][data-align=start]:before{inset-inline-start:12px}.pc_coach_mark[data-side=top][data-align=end]:before{inset-inline-end:12px}.pc_coach_mark[data-side=right]:before{--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-bottom-width:1px;border-left-width:1px;left:-4.5px}.pc_coach_mark[data-side=right][data-align=center]:before{top:50%;--ptu-translate-y:-50%;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z))}.pc_coach_mark[data-side=right][data-align=start]:before{top:12px}.pc_coach_mark[data-side=right][data-align=end]:before{bottom:12px}.pc_coach_mark[data-side=left]:before{--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-top-width:1px;border-right-width:1px;right:-4.5px}.pc_coach_mark[data-side=left][data-align=center]:before{top:50%;--ptu-translate-y:-50%;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z))}.pc_coach_mark[data-side=left][data-align=start]:before{top:12px}.pc_coach_mark[data-side=left][data-align=end]:before{bottom:12px}.pc_coach_mark__content{position:relative;display:flex;flex-direction:column;gap:var(--pt-dimension-600, 12px);overflow:hidden;padding:var(--pt-dimension-600, 12px);--ptu-text-opacity:1;color:rgba(var(--pt-fg),var(--ptu-text-opacity))}.pc_coach_mark__content .pc_coach_mark__close{position:absolute;top:var(--pt-dimension-800, 16px);z-index:10;display:flex}.pc_coach_mark__content .pc_coach_mark__close.pc_coach_mark__close--show-on-hover{inset-inline-end:calc(var(--pt-dimension-1200, 24px) * -1);transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;transition-property:all}.pc_coach_mark__content .pc_coach_mark__close:not(.pc_coach_mark__close--show-on-hover){inset-inline-end:var(--pt-dimension-800, 16px)}.pc_coach_mark__content:hover .pc_coach_mark__close--show-on-hover{inset-inline-end:var(--pt-dimension-800, 16px)}.pc_coach_mark__leading{width:100%;display:flex;flex-direction:column;overflow:hidden;border-radius:var(--pt-roundness-md, 6px)}.pc_coach_mark__leading>*{width:100%}.pc_coach_mark__wrapper{display:flex;flex-direction:column;gap:var(--pt-dimension-400, 8px)}.pc_coach_mark__footer{display:flex;align-items:center;justify-content:space-between;gap:var(--pt-dimension-200, 4px)}.pc_coach_mark__body{display:flex;flex-direction:column;gap:var(--pt-dimension-100, 2px)}.pc_coach_mark__title{--ptu-text-opacity:1;color:rgba(var(--pt-fg),var(--ptu-text-opacity));font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-medium, medium);font-size:var(--pt-dimension-800, 16px);line-height:var(--pt-lineheight-5, 18px);letter-spacing:0}.pc_coach_mark__description{--ptu-text-opacity:1;color:rgba(var(--pt-fg-subtle),var(--ptu-text-opacity));font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-700, 14px);line-height:var(--pt-lineheight-6, 16px);letter-spacing:0}.pc_coach_mark__steps{width:fit-content}
1
+ .pc_coach_mark{position:relative;border-radius:var(--pt-roundness-lg, 8px);padding:var(--pt-dimension-600, 12px);width:var(--ptc-coachmark-w);min-width:var(--ptc-coachmark-min-w)}.pc_coach_mark:before{content:"";position:absolute;width:8px;height:8px;--ptu-skew-x:6deg;--ptu-skew-y:6deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));--ptu-border-opacity:1;border-color:rgba(var(--pt-br),var(--ptu-border-opacity));border-style:solid;--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg),var(--ptu-bg-opacity));border-top-right-radius:3px;border-bottom-left-radius:3px}.pc_coach_mark[data-side=bottom]:before{--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:-45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-top-width:1px;border-right-width:1px;top:-4.5px}.pc_coach_mark[data-side=bottom][data-align=center]:before{left:50%;--ptu-translate-x:-50%;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z))}.pc_coach_mark[data-side=bottom][data-align=start]:before{inset-inline-start:12px}.pc_coach_mark[data-side=bottom][data-align=end]:before{inset-inline-end:12px}.pc_coach_mark[data-side=top]:before{--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:-45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-bottom-width:1px;border-left-width:1px;bottom:-4.5px}.pc_coach_mark[data-side=top][data-align=center]:before{left:50%;--ptu-translate-x:-50%;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z))}.pc_coach_mark[data-side=top][data-align=start]:before{inset-inline-start:12px}.pc_coach_mark[data-side=top][data-align=end]:before{inset-inline-end:12px}.pc_coach_mark[data-side=right]:before{--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-bottom-width:1px;border-left-width:1px;left:-4.5px}.pc_coach_mark[data-side=right][data-align=center]:before{top:50%;--ptu-translate-y:-50%;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z))}.pc_coach_mark[data-side=right][data-align=start]:before{top:12px}.pc_coach_mark[data-side=right][data-align=end]:before{bottom:12px}.pc_coach_mark[data-side=left]:before{--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-top-width:1px;border-right-width:1px;right:-4.5px}.pc_coach_mark[data-side=left][data-align=center]:before{top:50%;--ptu-translate-y:-50%;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z))}.pc_coach_mark[data-side=left][data-align=start]:before{top:12px}.pc_coach_mark[data-side=left][data-align=end]:before{bottom:12px}.pc_coach_mark__content{position:relative;display:flex;flex-direction:column;gap:var(--pt-dimension-600, 12px);overflow:hidden;padding:var(--pt-dimension-600, 12px);--ptu-text-opacity:1;color:rgba(var(--pt-fg),var(--ptu-text-opacity))}.pc_coach_mark__content .pc_coach_mark__close{position:absolute;top:var(--pt-dimension-800, 16px);z-index:10;display:flex}.pc_coach_mark__content .pc_coach_mark__close.pc_coach_mark__close--show-on-hover{inset-inline-end:calc(var(--pt-dimension-1200, 24px) * -1);transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;transition-property:all}.pc_coach_mark__content .pc_coach_mark__close:not(.pc_coach_mark__close--show-on-hover){inset-inline-end:var(--pt-dimension-800, 16px)}.pc_coach_mark__content:hover .pc_coach_mark__close--show-on-hover{inset-inline-end:var(--pt-dimension-800, 16px)}.pc_coach_mark__leading{width:100%;display:flex;flex-direction:column;overflow:hidden;border-radius:var(--pt-roundness-md, 6px)}.pc_coach_mark__leading>*{width:100%}.pc_coach_mark__wrapper{display:flex;flex-direction:column;gap:var(--pt-dimension-400, 8px)}.pc_coach_mark__footer{display:flex;align-items:center;justify-content:flex-end;gap:var(--pt-dimension-200, 4px)}.pc_coach_mark__body{display:flex;flex-direction:column;gap:var(--pt-dimension-100, 2px)}.pc_coach_mark__title{--ptu-text-opacity:1;color:rgba(var(--pt-fg),var(--ptu-text-opacity));font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-medium, medium);font-size:var(--pt-dimension-800, 16px);line-height:var(--pt-lineheight-5, 18px);letter-spacing:0}.pc_coach_mark__description{--ptu-text-opacity:1;color:rgba(var(--pt-fg-subtle),var(--ptu-text-opacity));font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-700, 14px);line-height:var(--pt-lineheight-6, 16px);letter-spacing:0}.pc_coach_mark__steps{flex:1 1 0%}
package/dist/coach_mark.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import { addCssToHead, removeCssFromHead, prefix } from "@pantograph/tokens";
2
- const cssText = ".pc_coach_mark{position:relative;border-radius:var(--pt-roundness-lg, 8px);padding:var(--pt-dimension-600, 12px);width:var(--ptc-coachmark-w)}.pc_coach_mark:before{content:\"\";position:absolute;width:8px;height:8px;--ptu-skew-x:6deg;--ptu-skew-y:6deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));--ptu-border-opacity:1;border-color:rgba(var(--pt-br),var(--ptu-border-opacity));border-style:solid;--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg),var(--ptu-bg-opacity));border-top-right-radius:3px;border-bottom-left-radius:3px}.pc_coach_mark[data-side=bottom]:before{--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:-45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-top-width:1px;border-right-width:1px;top:-4.5px}.pc_coach_mark[data-side=bottom][data-align=center]:before{left:50%;--ptu-translate-x:-50%;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z))}.pc_coach_mark[data-side=bottom][data-align=start]:before{inset-inline-start:12px}.pc_coach_mark[data-side=bottom][data-align=end]:before{inset-inline-end:12px}.pc_coach_mark[data-side=top]:before{--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:-45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-bottom-width:1px;border-left-width:1px;bottom:-4.5px}.pc_coach_mark[data-side=top][data-align=center]:before{left:50%;--ptu-translate-x:-50%;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z))}.pc_coach_mark[data-side=top][data-align=start]:before{inset-inline-start:12px}.pc_coach_mark[data-side=top][data-align=end]:before{inset-inline-end:12px}.pc_coach_mark[data-side=right]:before{--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-bottom-width:1px;border-left-width:1px;left:-4.5px}.pc_coach_mark[data-side=right][data-align=center]:before{top:50%;--ptu-translate-y:-50%;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z))}.pc_coach_mark[data-side=right][data-align=start]:before{top:12px}.pc_coach_mark[data-side=right][data-align=end]:before{bottom:12px}.pc_coach_mark[data-side=left]:before{--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-top-width:1px;border-right-width:1px;right:-4.5px}.pc_coach_mark[data-side=left][data-align=center]:before{top:50%;--ptu-translate-y:-50%;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z))}.pc_coach_mark[data-side=left][data-align=start]:before{top:12px}.pc_coach_mark[data-side=left][data-align=end]:before{bottom:12px}.pc_coach_mark__content{position:relative;display:flex;flex-direction:column;gap:var(--pt-dimension-600, 12px);overflow:hidden;padding:var(--pt-dimension-600, 12px);--ptu-text-opacity:1;color:rgba(var(--pt-fg),var(--ptu-text-opacity))}.pc_coach_mark__content .pc_coach_mark__close{position:absolute;top:var(--pt-dimension-800, 16px);z-index:10;display:flex}.pc_coach_mark__content .pc_coach_mark__close.pc_coach_mark__close--show-on-hover{inset-inline-end:calc(var(--pt-dimension-1200, 24px) * -1);transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;transition-property:all}.pc_coach_mark__content .pc_coach_mark__close:not(.pc_coach_mark__close--show-on-hover){inset-inline-end:var(--pt-dimension-800, 16px)}.pc_coach_mark__content:hover .pc_coach_mark__close--show-on-hover{inset-inline-end:var(--pt-dimension-800, 16px)}.pc_coach_mark__leading{width:100%;display:flex;flex-direction:column;overflow:hidden;border-radius:var(--pt-roundness-md, 6px)}.pc_coach_mark__leading>*{width:100%}.pc_coach_mark__wrapper{display:flex;flex-direction:column;gap:var(--pt-dimension-400, 8px)}.pc_coach_mark__footer{display:flex;align-items:center;justify-content:space-between;gap:var(--pt-dimension-200, 4px)}.pc_coach_mark__body{display:flex;flex-direction:column;gap:var(--pt-dimension-100, 2px)}.pc_coach_mark__title{--ptu-text-opacity:1;color:rgba(var(--pt-fg),var(--ptu-text-opacity));font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-medium, medium);font-size:var(--pt-dimension-800, 16px);line-height:var(--pt-lineheight-5, 18px);letter-spacing:0}.pc_coach_mark__description{--ptu-text-opacity:1;color:rgba(var(--pt-fg-subtle),var(--ptu-text-opacity));font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-700, 14px);line-height:var(--pt-lineheight-6, 16px);letter-spacing:0}.pc_coach_mark__steps{width:fit-content}\n";
2
+ const cssText = ".pc_coach_mark{position:relative;border-radius:var(--pt-roundness-lg, 8px);padding:var(--pt-dimension-600, 12px);width:var(--ptc-coachmark-w);min-width:var(--ptc-coachmark-min-w)}.pc_coach_mark:before{content:\"\";position:absolute;width:8px;height:8px;--ptu-skew-x:6deg;--ptu-skew-y:6deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));--ptu-border-opacity:1;border-color:rgba(var(--pt-br),var(--ptu-border-opacity));border-style:solid;--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg),var(--ptu-bg-opacity));border-top-right-radius:3px;border-bottom-left-radius:3px}.pc_coach_mark[data-side=bottom]:before{--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:-45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-top-width:1px;border-right-width:1px;top:-4.5px}.pc_coach_mark[data-side=bottom][data-align=center]:before{left:50%;--ptu-translate-x:-50%;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z))}.pc_coach_mark[data-side=bottom][data-align=start]:before{inset-inline-start:12px}.pc_coach_mark[data-side=bottom][data-align=end]:before{inset-inline-end:12px}.pc_coach_mark[data-side=top]:before{--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:-45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-bottom-width:1px;border-left-width:1px;bottom:-4.5px}.pc_coach_mark[data-side=top][data-align=center]:before{left:50%;--ptu-translate-x:-50%;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z))}.pc_coach_mark[data-side=top][data-align=start]:before{inset-inline-start:12px}.pc_coach_mark[data-side=top][data-align=end]:before{inset-inline-end:12px}.pc_coach_mark[data-side=right]:before{--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-bottom-width:1px;border-left-width:1px;left:-4.5px}.pc_coach_mark[data-side=right][data-align=center]:before{top:50%;--ptu-translate-y:-50%;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z))}.pc_coach_mark[data-side=right][data-align=start]:before{top:12px}.pc_coach_mark[data-side=right][data-align=end]:before{bottom:12px}.pc_coach_mark[data-side=left]:before{--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-top-width:1px;border-right-width:1px;right:-4.5px}.pc_coach_mark[data-side=left][data-align=center]:before{top:50%;--ptu-translate-y:-50%;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z))}.pc_coach_mark[data-side=left][data-align=start]:before{top:12px}.pc_coach_mark[data-side=left][data-align=end]:before{bottom:12px}.pc_coach_mark__content{position:relative;display:flex;flex-direction:column;gap:var(--pt-dimension-600, 12px);overflow:hidden;padding:var(--pt-dimension-600, 12px);--ptu-text-opacity:1;color:rgba(var(--pt-fg),var(--ptu-text-opacity))}.pc_coach_mark__content .pc_coach_mark__close{position:absolute;top:var(--pt-dimension-800, 16px);z-index:10;display:flex}.pc_coach_mark__content .pc_coach_mark__close.pc_coach_mark__close--show-on-hover{inset-inline-end:calc(var(--pt-dimension-1200, 24px) * -1);transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;transition-property:all}.pc_coach_mark__content .pc_coach_mark__close:not(.pc_coach_mark__close--show-on-hover){inset-inline-end:var(--pt-dimension-800, 16px)}.pc_coach_mark__content:hover .pc_coach_mark__close--show-on-hover{inset-inline-end:var(--pt-dimension-800, 16px)}.pc_coach_mark__leading{width:100%;display:flex;flex-direction:column;overflow:hidden;border-radius:var(--pt-roundness-md, 6px)}.pc_coach_mark__leading>*{width:100%}.pc_coach_mark__wrapper{display:flex;flex-direction:column;gap:var(--pt-dimension-400, 8px)}.pc_coach_mark__footer{display:flex;align-items:center;justify-content:flex-end;gap:var(--pt-dimension-200, 4px)}.pc_coach_mark__body{display:flex;flex-direction:column;gap:var(--pt-dimension-100, 2px)}.pc_coach_mark__title{--ptu-text-opacity:1;color:rgba(var(--pt-fg),var(--ptu-text-opacity));font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-medium, medium);font-size:var(--pt-dimension-800, 16px);line-height:var(--pt-lineheight-5, 18px);letter-spacing:0}.pc_coach_mark__description{--ptu-text-opacity:1;color:rgba(var(--pt-fg-subtle),var(--ptu-text-opacity));font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-700, 14px);line-height:var(--pt-lineheight-6, 16px);letter-spacing:0}.pc_coach_mark__steps{flex:1 1 0%}\n";
3
3
  const coachMarkId = `${prefix}s-coach_mark`;
4
4
  const addCoachMarkCss = () => addCssToHead(coachMarkId, cssText);
5
5
  const removeCoachMarkCss = () => removeCssFromHead(coachMarkId);
package/dist/coach_mark.umd.cjs CHANGED
@@ -1,7 +1,7 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
3
  const { addCssToHead, removeCssFromHead, prefix } = require("@pantograph/tokens");
4
- const cssText = ".pc_coach_mark{position:relative;border-radius:var(--pt-roundness-lg, 8px);padding:var(--pt-dimension-600, 12px);width:var(--ptc-coachmark-w)}.pc_coach_mark:before{content:\"\";position:absolute;width:8px;height:8px;--ptu-skew-x:6deg;--ptu-skew-y:6deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));--ptu-border-opacity:1;border-color:rgba(var(--pt-br),var(--ptu-border-opacity));border-style:solid;--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg),var(--ptu-bg-opacity));border-top-right-radius:3px;border-bottom-left-radius:3px}.pc_coach_mark[data-side=bottom]:before{--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:-45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-top-width:1px;border-right-width:1px;top:-4.5px}.pc_coach_mark[data-side=bottom][data-align=center]:before{left:50%;--ptu-translate-x:-50%;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z))}.pc_coach_mark[data-side=bottom][data-align=start]:before{inset-inline-start:12px}.pc_coach_mark[data-side=bottom][data-align=end]:before{inset-inline-end:12px}.pc_coach_mark[data-side=top]:before{--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:-45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-bottom-width:1px;border-left-width:1px;bottom:-4.5px}.pc_coach_mark[data-side=top][data-align=center]:before{left:50%;--ptu-translate-x:-50%;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z))}.pc_coach_mark[data-side=top][data-align=start]:before{inset-inline-start:12px}.pc_coach_mark[data-side=top][data-align=end]:before{inset-inline-end:12px}.pc_coach_mark[data-side=right]:before{--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-bottom-width:1px;border-left-width:1px;left:-4.5px}.pc_coach_mark[data-side=right][data-align=center]:before{top:50%;--ptu-translate-y:-50%;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z))}.pc_coach_mark[data-side=right][data-align=start]:before{top:12px}.pc_coach_mark[data-side=right][data-align=end]:before{bottom:12px}.pc_coach_mark[data-side=left]:before{--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-top-width:1px;border-right-width:1px;right:-4.5px}.pc_coach_mark[data-side=left][data-align=center]:before{top:50%;--ptu-translate-y:-50%;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z))}.pc_coach_mark[data-side=left][data-align=start]:before{top:12px}.pc_coach_mark[data-side=left][data-align=end]:before{bottom:12px}.pc_coach_mark__content{position:relative;display:flex;flex-direction:column;gap:var(--pt-dimension-600, 12px);overflow:hidden;padding:var(--pt-dimension-600, 12px);--ptu-text-opacity:1;color:rgba(var(--pt-fg),var(--ptu-text-opacity))}.pc_coach_mark__content .pc_coach_mark__close{position:absolute;top:var(--pt-dimension-800, 16px);z-index:10;display:flex}.pc_coach_mark__content .pc_coach_mark__close.pc_coach_mark__close--show-on-hover{inset-inline-end:calc(var(--pt-dimension-1200, 24px) * -1);transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;transition-property:all}.pc_coach_mark__content .pc_coach_mark__close:not(.pc_coach_mark__close--show-on-hover){inset-inline-end:var(--pt-dimension-800, 16px)}.pc_coach_mark__content:hover .pc_coach_mark__close--show-on-hover{inset-inline-end:var(--pt-dimension-800, 16px)}.pc_coach_mark__leading{width:100%;display:flex;flex-direction:column;overflow:hidden;border-radius:var(--pt-roundness-md, 6px)}.pc_coach_mark__leading>*{width:100%}.pc_coach_mark__wrapper{display:flex;flex-direction:column;gap:var(--pt-dimension-400, 8px)}.pc_coach_mark__footer{display:flex;align-items:center;justify-content:space-between;gap:var(--pt-dimension-200, 4px)}.pc_coach_mark__body{display:flex;flex-direction:column;gap:var(--pt-dimension-100, 2px)}.pc_coach_mark__title{--ptu-text-opacity:1;color:rgba(var(--pt-fg),var(--ptu-text-opacity));font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-medium, medium);font-size:var(--pt-dimension-800, 16px);line-height:var(--pt-lineheight-5, 18px);letter-spacing:0}.pc_coach_mark__description{--ptu-text-opacity:1;color:rgba(var(--pt-fg-subtle),var(--ptu-text-opacity));font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-700, 14px);line-height:var(--pt-lineheight-6, 16px);letter-spacing:0}.pc_coach_mark__steps{width:fit-content}\n";
4
+ const cssText = ".pc_coach_mark{position:relative;border-radius:var(--pt-roundness-lg, 8px);padding:var(--pt-dimension-600, 12px);width:var(--ptc-coachmark-w);min-width:var(--ptc-coachmark-min-w)}.pc_coach_mark:before{content:\"\";position:absolute;width:8px;height:8px;--ptu-skew-x:6deg;--ptu-skew-y:6deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));--ptu-border-opacity:1;border-color:rgba(var(--pt-br),var(--ptu-border-opacity));border-style:solid;--ptu-bg-opacity:1;background-color:rgba(var(--pt-bg),var(--ptu-bg-opacity));border-top-right-radius:3px;border-bottom-left-radius:3px}.pc_coach_mark[data-side=bottom]:before{--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:-45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-top-width:1px;border-right-width:1px;top:-4.5px}.pc_coach_mark[data-side=bottom][data-align=center]:before{left:50%;--ptu-translate-x:-50%;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z))}.pc_coach_mark[data-side=bottom][data-align=start]:before{inset-inline-start:12px}.pc_coach_mark[data-side=bottom][data-align=end]:before{inset-inline-end:12px}.pc_coach_mark[data-side=top]:before{--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:-45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-bottom-width:1px;border-left-width:1px;bottom:-4.5px}.pc_coach_mark[data-side=top][data-align=center]:before{left:50%;--ptu-translate-x:-50%;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z))}.pc_coach_mark[data-side=top][data-align=start]:before{inset-inline-start:12px}.pc_coach_mark[data-side=top][data-align=end]:before{inset-inline-end:12px}.pc_coach_mark[data-side=right]:before{--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-bottom-width:1px;border-left-width:1px;left:-4.5px}.pc_coach_mark[data-side=right][data-align=center]:before{top:50%;--ptu-translate-y:-50%;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z))}.pc_coach_mark[data-side=right][data-align=start]:before{top:12px}.pc_coach_mark[data-side=right][data-align=end]:before{bottom:12px}.pc_coach_mark[data-side=left]:before{--ptu-rotate-x:0;--ptu-rotate-y:0;--ptu-rotate-z:0;--ptu-rotate:45deg;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z));border-top-width:1px;border-right-width:1px;right:-4.5px}.pc_coach_mark[data-side=left][data-align=center]:before{top:50%;--ptu-translate-y:-50%;transform:translate(var(--ptu-translate-x)) translateY(var(--ptu-translate-y)) translateZ(var(--ptu-translate-z)) rotate(var(--ptu-rotate)) rotateX(var(--ptu-rotate-x)) rotateY(var(--ptu-rotate-y)) rotate(var(--ptu-rotate-z)) skew(var(--ptu-skew-x)) skewY(var(--ptu-skew-y)) scaleX(var(--ptu-scale-x)) scaleY(var(--ptu-scale-y)) scaleZ(var(--ptu-scale-z))}.pc_coach_mark[data-side=left][data-align=start]:before{top:12px}.pc_coach_mark[data-side=left][data-align=end]:before{bottom:12px}.pc_coach_mark__content{position:relative;display:flex;flex-direction:column;gap:var(--pt-dimension-600, 12px);overflow:hidden;padding:var(--pt-dimension-600, 12px);--ptu-text-opacity:1;color:rgba(var(--pt-fg),var(--ptu-text-opacity))}.pc_coach_mark__content .pc_coach_mark__close{position:absolute;top:var(--pt-dimension-800, 16px);z-index:10;display:flex}.pc_coach_mark__content .pc_coach_mark__close.pc_coach_mark__close--show-on-hover{inset-inline-end:calc(var(--pt-dimension-1200, 24px) * -1);transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;transition-property:all}.pc_coach_mark__content .pc_coach_mark__close:not(.pc_coach_mark__close--show-on-hover){inset-inline-end:var(--pt-dimension-800, 16px)}.pc_coach_mark__content:hover .pc_coach_mark__close--show-on-hover{inset-inline-end:var(--pt-dimension-800, 16px)}.pc_coach_mark__leading{width:100%;display:flex;flex-direction:column;overflow:hidden;border-radius:var(--pt-roundness-md, 6px)}.pc_coach_mark__leading>*{width:100%}.pc_coach_mark__wrapper{display:flex;flex-direction:column;gap:var(--pt-dimension-400, 8px)}.pc_coach_mark__footer{display:flex;align-items:center;justify-content:flex-end;gap:var(--pt-dimension-200, 4px)}.pc_coach_mark__body{display:flex;flex-direction:column;gap:var(--pt-dimension-100, 2px)}.pc_coach_mark__title{--ptu-text-opacity:1;color:rgba(var(--pt-fg),var(--ptu-text-opacity));font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-medium, medium);font-size:var(--pt-dimension-800, 16px);line-height:var(--pt-lineheight-5, 18px);letter-spacing:0}.pc_coach_mark__description{--ptu-text-opacity:1;color:rgba(var(--pt-fg-subtle),var(--ptu-text-opacity));font-family:var(--pt-font-family);font-weight:var(--pt-font-weight-regular, regular);font-size:var(--pt-dimension-700, 14px);line-height:var(--pt-lineheight-6, 16px);letter-spacing:0}.pc_coach_mark__steps{flex:1 1 0%}\n";
5
5
  const coachMarkId = `${prefix}s-coach_mark`;
6
6
  const addCoachMarkCss = () => addCssToHead(coachMarkId, cssText);
7
7
  const removeCoachMarkCss = () => removeCssFromHead(coachMarkId);