@getflip/swirl-components 0.403.0 → 0.405.0

package/vscode-data.json

@@ -18674,6 +18674,28 @@
           "name": "label-min-height",
           "description": ""
         },
+        {
+          "name": "label-tooltip",
+          "description": ""
+        },
+        {
+          "name": "label-tooltip-position",
+          "description": "",
+          "values": [
+            {
+              "name": "bottom"
+            },
+            {
+              "name": "left"
+            },
+            {
+              "name": "right"
+            },
+            {
+              "name": "top"
+            }
+          ]
+        },
         {
           "name": "label-weight",
           "description": "",
@@ -22502,8 +22524,16 @@
           "description": ""
         },
         {
-          "name": "is-promo",
-          "description": "If set to true, tooltip will be initially visible.\nIt will only be dismissible via a click and will not reappear.\nTooltip will have a blue background color."
+          "name": "intent",
+          "description": "",
+          "values": [
+            {
+              "name": "default"
+            },
+            {
+              "name": "info"
+            }
+          ]
         },
         {
           "name": "position",
@@ -22534,6 +22564,10 @@
               "name": "fixed"
             }
           ]
+        },
+        {
+          "name": "trigger",
+          "description": ""
         }
       ]
     },

package/dist/swirl-components/p-da93355a.entry.js

@@ -1 +0,0 @@
-import{r as s,h as t,H as a}from"./p-g4wOnHIT.js";import{c as e}from"./p-orsBiyT_.js";const i=class{constructor(t){s(this,t),this.padding="8"}render(){const s=e("tab",{"tab--active":this.active});return t(a,{key:"3e858f89f81b918c9f9a00c2ca891f68ca31fe2e","aria-labelledby":`tab-${this.tabId}`,id:this.tabId,role:"tabpanel",tabIndex:this.active?0:-1,class:s,style:{padding:`var(--s-space-${this.padding})`}},t("slot",{key:"9253c411cecb72a4414188c5fb9f0dd148b0fa1e"}))}};i.style=":host{display:none;width:100%}:host(.tab--active){display:block}:host *{box-sizing:border-box}";export{i as swirl_tab}

package/dist/swirl-components/p-fef8e82f.entry.js

@@ -1 +0,0 @@
-import{r as t,h as o,H as i,d as s}from"./p-g4wOnHIT.js";import{u as e,P as a,N as r,D as l,k as n,b as p}from"./p-BtsCuEVE.js";import{c as h}from"./p-orsBiyT_.js";import{o as c}from"./p-wi_3Z3FQ.js";const d=class{constructor(o){t(this,o),this.active=!0,this.delay=200,this.position="top",this.positioning="absolute",this.isPromo=!1,this.visible=!1,this.isPromoShown=!1,this.onKeydown=t=>{"Escape"!==t.code||this.isPromo||this.hide()},this.reposition=async()=>{const t=this.el.children[0];if(!Boolean(t)||!Boolean(this.popperEl))return;const o=[...this.options.middleware.filter((t=>"arrow"!==t.name)),e({element:this.arrowElement,padding:12})];this.actualPosition=await a(t,this.popperEl,{...this.options,middleware:o});const i=this.actualPosition.middlewareData.arrow?.x,s=this.actualPosition.middlewareData.arrow?.y;this.arrowStyles={left:Boolean(i)?i+"px":void 0,top:Boolean(s)?s+"px":void 0}},this.show=()=>{!this.active||this.isPromo&&this.isPromoShown||(this.visible=!0,requestAnimationFrame((()=>{const t=this.el.children[0];Boolean(t)&&(this.reposition(),this.disableAutoUpdate=r(t,this.popperEl,this.reposition.bind(this)))})))},this.showWithDelay=()=>{this.active&&(Boolean(this.showTimeout)&&(clearTimeout(this.showTimeout),this.showTimeout=void 0),this.showTimeout=setTimeout((()=>{this.show()}),this.delay))},this.hide=()=>{Boolean(this.showTimeout)&&(clearTimeout(this.showTimeout),this.showTimeout=void 0),this.visible=!1,this.disableAutoUpdate?.()},this.updateOptions=()=>{const t=c("--s-space-12"),o=c("--s-space-8"),i=c("--s-space-16");this.options={middleware:[l(t),n({padding:{top:o,bottom:o,left:i,right:i}}),p()],placement:this.position,strategy:this.positioning}}}watchPosition(){this.updateOptions()}onMouseEnter(){this.showWithDelay()}onMouseLeave(){this.isPromo||this.hide()}onWindowResize(){this.active&&this.reposition()}onWindowScroll(){this.active&&this.visible&&this.reposition()}componentWillLoad(){this.reposition()}componentDidLoad(){this.updateOptions(),this.isPromo&&(this.show(),this.isPromoShown=!0)}render(){const t=h("tooltip",`tooltip--actual-placement-${this.actualPosition?.placement}`,{"tooltip--active":this.active,"tooltip--visible":this.visible,"tooltip--promo":this.isPromo});return o(i,{key:"eb98693ca0f89f2d87d77345a7a40094ad2127b0",onKeydown:this.onKeydown},o("span",{key:"a9136430b03542b564d5ac0e7a607c15626ebf7b",class:t},o("span",{key:"fb3360a98a1dbbc2882dd476ce1bece24262e5a4",class:"tooltip__reference","aria-describedby":"tooltip",onFocusout:!this.isPromo&&this.hide,onClick:this.hide,onFocusin:this.show},o("slot",{key:"66284a39104223a52ef2c7c4b7eae3989e427c14"})),o("span",{key:"83a41911fdd3b4b71613758de21a9a82b77ee32b",class:"tooltip__popper",ref:t=>this.popperEl=t,style:{top:Boolean(this.actualPosition)?`${this.actualPosition?.y}px`:"",left:Boolean(this.actualPosition)?`${this.actualPosition?.x}px`:"",position:this.positioning}},this.visible&&o("span",{key:"9b1d1f18199fd58c71151f18230a8d9372ea6dcf",class:"tooltip__bubble",id:"tooltip",part:"tooltip__bubble",role:"tooltip"},o("span",{key:"e9e0c0d96cd1fdb70c43b9f45aa9e5f8c04056ac",class:"tooltip__content",innerHTML:this.content})),o("span",{key:"15abfa4fee4eec0ceed79bada17ddea2fcb5a189",class:"tooltip__arrow",ref:t=>this.arrowElement=t,style:{...this.arrowStyles,visibility:this.visible?"visible":"hidden"}}))))}get el(){return s(this)}static get watchers(){return{position:["watchPosition"]}}};d.style=":host{display:contents;font-weight:var(--s-font-weight-normal)}:host *{box-sizing:border-box}.tooltip{display:contents}.tooltip--active .tooltip__popper{display:block}.tooltip--visible .tooltip__popper{animation:tooltip-fade-in 0.15s;animation-delay:0.1s;animation-fill-mode:forwards;opacity:0}.tooltip--actual-placement-top .tooltip__arrow{top:calc(100% - 0.0625rem);transform:translate3d(0, -50%, 0) rotate(45deg)}.tooltip--actual-placement-bottom .tooltip__arrow{bottom:calc(100% - 0.0625rem);transform:translate3d(0, 50%, 0) rotate(45deg)}.tooltip--actual-placement-left .tooltip__arrow{left:calc(100% - 0.0625rem);transform:translate3d(-50%, 0, 0) rotate(45deg)}.tooltip--actual-placement-right .tooltip__arrow{right:calc(100% - 0.0625rem);transform:translate3d(50%, 0, 0) rotate(45deg)}.tooltip .tooltip__reference{display:contents}.tooltip__popper{position:absolute;z-index:var(--s-z-40);display:none;max-width:17.5rem;opacity:0}.tooltip__bubble{position:relative;display:block;padding-top:var(--s-space-8);padding-right:var(--s-space-12);padding-bottom:calc(var(--s-space-8) + 0.0625rem);padding-left:var(--s-space-12);border-radius:var(--s-border-radius-sm);color:var(--s-text-on-status);background-color:var(--s-surface-neutral-default);line-height:var(--s-line-height-base);box-shadow:var(--s-shadow-level-2)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.tooltip__bubble{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.tooltip__content{white-space:normal}.tooltip__arrow{position:absolute;width:0.6875rem;height:0.6875rem;border-radius:0.125rem;background-color:var(--s-surface-neutral-default)}.tooltip--promo .tooltip__bubble,.tooltip--promo .tooltip__arrow{background-color:var(--s-surface-info-default)}@keyframes tooltip-fade-in{from{opacity:0}to{opacity:1}}";export{d as swirl_tooltip}