@expressivecss/expressive 0.10.0 → 0.10.1
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/CHANGELOG.md +28 -1
- package/README.md +1 -1
- package/dist/css/expressive.css +63 -0
- package/dist/css/expressive.css.map +1 -1
- package/dist/css/expressive.min.css +1 -1
- package/dist/css/expressive.min.css.map +1 -1
- package/dist/js/chunks/chunk-ZAOYQ6SY.mjs +7 -0
- package/dist/js/chunks/{chunk-PB5L3EXF.mjs.map → chunk-ZAOYQ6SY.mjs.map} +1 -1
- package/dist/js/expressive.cjs +1 -1
- package/dist/js/expressive.cjs.map +1 -1
- package/dist/js/expressive.js +1 -1
- package/dist/js/expressive.js.map +1 -1
- package/dist/js/expressive.min.js +1 -1
- package/dist/js/expressive.min.js.map +1 -1
- package/dist/js/expressive.mjs +1 -1
- package/dist/js/modular.mjs +1 -1
- package/dist/types/modular.d.ts +1 -1
- package/package.json +1 -1
- package/src/sass/utilities/_helpers.scss +18 -0
- package/src/sass/utilities/_spacing.scss +8 -1
- package/dist/js/chunks/chunk-PB5L3EXF.mjs +0 -7
|
@@ -58,5 +58,5 @@ var Expressive=(()=>{var dt=Object.defineProperty;var Nt=Object.getOwnPropertyDe
|
|
|
58
58
|
opacity ${this.options.inDuration}ms ease
|
|
59
59
|
`,setTimeout(()=>{this.el.style.transform="",this.el.style.opacity="1"},1)}_setTimer(){this.timeRemaining!==1/0&&(this._deadline=Date.now()+this.timeRemaining,this.counterTimeout=setTimeout(()=>this.dismiss(),this.timeRemaining))}_pauseTimer(){this.counterTimeout!=null&&(clearTimeout(this.counterTimeout),this.counterTimeout=null,this.timeRemaining=Math.max(0,this._deadline-Date.now()))}_resumeTimer(){this._dismissed||this.panning||this.el.matches(":hover, :focus-within")||this.counterTimeout!=null||this._setTimer()}_restoreFocus(){let n=this.el.getRootNode().activeElement;n&&this.el.contains(n)&&this._returnFocus?.isConnected&&this._returnFocus.focus({preventScroll:!0}),this.el.inert=!0}dismiss(){if(this._dismissed)return;this._dismissed=!0,clearTimeout(this.counterTimeout),this.counterTimeout=null,this._restoreFocus();let n=this.el.offsetWidth*this.options.activationPercent;this.wasSwiped&&(this.el.style.transition="transform .05s, opacity .05s",this.el.style.transform=`translateX(${n}px)`,this.el.style.opacity="0"),this.el.style.transition=`
|
|
60
60
|
margin ${this.options.outDuration}ms ease,
|
|
61
|
-
opacity ${this.options.outDuration}ms ease`,setTimeout(()=>{this.el.style.opacity="0",this.el.style.marginTop="-40px"},1),setTimeout(()=>{if(typeof this.options.completeCallback=="function"&&this.options.completeCallback(),this.el.id!=this.options.snackbarId){this.el.remove();let t=E._snackbars.indexOf(this);t>=0&&E._snackbars.splice(t,1),E._snackbars.length===0&&E._container&&E._container.childElementCount===0&&E._removeContainer()}},this.options.outDuration)}};E._dragPointerId=null,E._snackbars=[],E._container=null,E._draggedSnackbar=null;var lt=E;var Ee={exitDelay:200,enterDelay:0,text:"",margin:4,inDuration:250,outDuration:200,position:"bottom",transitionMovement:10,opacity:1},st=class d extends _{constructor(t,e){super(t,e,d);this.open=t=>{this.isOpen||(t=t===void 0?!0:void 0,clearTimeout(this._exitDelayTimeout),clearTimeout(this._animationTimeout),this.isOpen=!0,this.options={...this.options,...this._getAttributeOptions()},this._updateTooltipContent(),this._setEnterDelayTimeout(t))};this.close=()=>{this.isOpen&&(this.isHovered=!1,this.isFocused=!1,this.isOpen=!1,clearTimeout(this._enterDelayTimeout),this._setExitDelayTimeout())};this._handleMouseEnter=()=>{this.isHovered=!0,this.open(!1)};this._handleMouseLeave=t=>{let e=t.relatedTarget;e&&(this.el.contains(e)||this.tooltipEl.contains(e))||(this.isHovered=!1,this.isFocused||this.close())};this._handleKeydown=t=>{t.key!=="Escape"||!this.isOpen||(t.preventDefault(),t.stopPropagation(),this.close(),clearTimeout(this._exitDelayTimeout),this._animateOut())};this._handleFocus=t=>{t.target.matches(":focus-visible")&&(this.isFocused=!0,this.open(!1))};this._handleBlur=t=>{let e=t.relatedTarget;e&&(this.el.contains(e)||this.tooltipEl.contains(e))||(this.isFocused=!1,this.isHovered||this.close())};this.el.Expressive_Tooltip=this,this.options={...d.defaults,...this._getAttributeOptions(),...e},this.isOpen=!1,this.isHovered=!1,this.isFocused=!1,this._appendTooltipEl(),this._setupEventHandlers()}static get defaults(){return Ee}static init(t,e={}){return super.init(t,e,d)}static getInstance(t){return t.Expressive_Tooltip}destroy(){clearTimeout(this._enterDelayTimeout),clearTimeout(this._exitDelayTimeout),clearTimeout(this._animationTimeout),this.isOpen=!1,this.isHovered=!1,this.isFocused=!1,this.el.getAttribute("aria-describedby")===this.tooltipEl.id&&this.el.removeAttribute("aria-describedby"),this.tooltipEl.remove(),this._removeEventHandlers(),this.el.Expressive_Tooltip=void 0}_appendTooltipEl(){this.tooltipEl=document.createElement("div"),this.tooltipEl.classList.add("tooltip"),this.tooltipEl.id=`tooltip-${u.guid()}`,this.tooltipEl.setAttribute("role","tooltip"),this.el.setAttribute("aria-describedby",this.tooltipEl.id);let t=this.options.tooltipId?u.getElementById(this.el,this.options.tooltipId):document.createElement("div");this.options.tooltipId&&this.tooltipEl.classList.add("rich"),t.style.display="",t.classList.add("tooltip-content"),this._setTooltipContent(t),this.tooltipEl.appendChild(t),u.portalRoot(this.el).appendChild(this.tooltipEl)}_setTooltipContent(t){this.options.tooltipId||(t.innerText=this.options.text)}_updateTooltipContent(){this._setTooltipContent(this.tooltipEl.querySelector(".tooltip-content"))}_setupEventHandlers(){for(let t of[this.el,this.tooltipEl])t.addEventListener("mouseenter",this._handleMouseEnter),t.addEventListener("mouseleave",this._handleMouseLeave),t.addEventListener("focus",this._handleFocus,!0),t.addEventListener("blur",this._handleBlur,!0);this.el.ownerDocument.addEventListener("keydown",this._handleKeydown,!0)}_removeEventHandlers(){for(let t of[this.el,this.tooltipEl])t.removeEventListener("mouseenter",this._handleMouseEnter),t.removeEventListener("mouseleave",this._handleMouseLeave),t.removeEventListener("focus",this._handleFocus,!0),t.removeEventListener("blur",this._handleBlur,!0);this.el.ownerDocument.removeEventListener("keydown",this._handleKeydown,!0)}_setExitDelayTimeout(){clearTimeout(this._exitDelayTimeout),this._exitDelayTimeout=setTimeout(()=>{this.isHovered||this.isFocused||this._animateOut()},this.options.exitDelay)}_setEnterDelayTimeout(t){clearTimeout(this._enterDelayTimeout),this._enterDelayTimeout=setTimeout(()=>{!this.isHovered&&!this.isFocused&&!t||this._animateIn()},this.options.enterDelay)}_positionTooltip(){let t=this.tooltipEl,e=this.el,i=e.offsetHeight,s=e.offsetWidth,o=t.offsetHeight,r=t.offsetWidth,c=this.options.margin;this.xMovement=0,this.yMovement=0;let h=e.getBoundingClientRect(),l=h.top+u.getDocumentScrollTop(),a=h.left+u.getDocumentScrollLeft();this.options.position==="top"?(l+=-o-c,a+=s/2-r/2,this.yMovement=-this.options.transitionMovement):this.options.position==="right"?(l+=i/2-o/2,a+=s+c,this.xMovement=this.options.transitionMovement):this.options.position==="left"?(l+=i/2-o/2,a+=-r-c,this.xMovement=-this.options.transitionMovement):(l+=i+c,a+=s/2-r/2,this.yMovement=this.options.transitionMovement);let m=this._repositionWithinScreen(a,l,r,o);t.style.setProperty("--md-comp-tooltip-anchor-gap",`${Math.max(0,c)+Math.abs(this.options.transitionMovement)}px`),t.style.top=m.y+"px",t.style.left=m.x+"px"}_repositionWithinScreen(t,e,i,s){return u._repositionWithinScreen(t,e,i,s,this.options.margin,this.options.transitionMovement,"center")}_animateIn(){this._animate(!0)}_animateOut(){this._animate(!1)}_animate(t){let e=this.tooltipEl.style,i=this.el.ownerDocument.defaultView.matchMedia("(prefers-reduced-motion: reduce)").matches,s=i?0:t?this.options.inDuration:this.options.outDuration;t&&(this._positionTooltip(),e.visibility="visible",e.overflow="visible"),e.transition=`transform ${s}ms ease-out, opacity ${s}ms ease-out`,clearTimeout(this._animationTimeout),this._animationTimeout=setTimeout(()=>{e.transform=t&&!i?`translateX(${this.xMovement}px) translateY(${this.yMovement}px)`:"none",e.opacity=t?(this.options.opacity||1).toString():"0",t||(this._animationTimeout=setTimeout(()=>{e.visibility="hidden",e.overflow=""},s))},1)}_getAttributeOptions(){let t={},e=this.el.getAttribute("data-tooltip"),i=this.el.getAttribute("data-tooltip-id"),s=this.el.getAttribute("data-position");return e&&(t.text=e),s&&(t.position=s),i&&(t.tooltipId=i),t}};var Ct={AppBar:{component:Y,selector:"header.medium, header.large, header:has(> :is(nav:not(.tabs, .navigation-bar, .navigation-rail), .bar) > :is(.search-bar, .searchbar))"},Autocomplete:{component:B,selector:".autocomplete"},ButtonGroup:{component:X,selector:".button-group"},Cards:{component:R,selector:pt,filter:mt},ExpandingCard:{component:P,selector:ft},Carousel:{component:N,selector:".carousel"},Chips:{component:W,selector:".chips"},Datepicker:{component:Z,selector:".datepicker, .date-picker"},Menu:{component:O,selector:".menu-trigger"},Lightbox:{component:Q,selector:".lightboxed"},ScrollSpy:{component:J,selector:".scrollspy"},FormSelect:{component:k,selector:"select"},NavigationRail:{component:tt,selector:".navigation-rail"},Tabs:{component:et,selector:".tabs"},Timepicker:{component:it,selector:".timepicker, .time-picker"},Tooltip:{component:st,selector:".tooltipped"},FloatingActionButton:{component:G,selector:".fab-menu"}};function wt(d=document.body,n){for(let t of Object.keys(Ct)){let{component:e,selector:i,filter:s}=Ct[t],o=d.querySelectorAll(`:is(${i}):not(.no-autoinit)`);s?o.forEach(r=>{s(r)&&e.init(r,n?.[t]??{})}):e.init(o,n?.[t]??{})}}var ye="0.10.
|
|
61
|
+
opacity ${this.options.outDuration}ms ease`,setTimeout(()=>{this.el.style.opacity="0",this.el.style.marginTop="-40px"},1),setTimeout(()=>{if(typeof this.options.completeCallback=="function"&&this.options.completeCallback(),this.el.id!=this.options.snackbarId){this.el.remove();let t=E._snackbars.indexOf(this);t>=0&&E._snackbars.splice(t,1),E._snackbars.length===0&&E._container&&E._container.childElementCount===0&&E._removeContainer()}},this.options.outDuration)}};E._dragPointerId=null,E._snackbars=[],E._container=null,E._draggedSnackbar=null;var lt=E;var Ee={exitDelay:200,enterDelay:0,text:"",margin:4,inDuration:250,outDuration:200,position:"bottom",transitionMovement:10,opacity:1},st=class d extends _{constructor(t,e){super(t,e,d);this.open=t=>{this.isOpen||(t=t===void 0?!0:void 0,clearTimeout(this._exitDelayTimeout),clearTimeout(this._animationTimeout),this.isOpen=!0,this.options={...this.options,...this._getAttributeOptions()},this._updateTooltipContent(),this._setEnterDelayTimeout(t))};this.close=()=>{this.isOpen&&(this.isHovered=!1,this.isFocused=!1,this.isOpen=!1,clearTimeout(this._enterDelayTimeout),this._setExitDelayTimeout())};this._handleMouseEnter=()=>{this.isHovered=!0,this.open(!1)};this._handleMouseLeave=t=>{let e=t.relatedTarget;e&&(this.el.contains(e)||this.tooltipEl.contains(e))||(this.isHovered=!1,this.isFocused||this.close())};this._handleKeydown=t=>{t.key!=="Escape"||!this.isOpen||(t.preventDefault(),t.stopPropagation(),this.close(),clearTimeout(this._exitDelayTimeout),this._animateOut())};this._handleFocus=t=>{t.target.matches(":focus-visible")&&(this.isFocused=!0,this.open(!1))};this._handleBlur=t=>{let e=t.relatedTarget;e&&(this.el.contains(e)||this.tooltipEl.contains(e))||(this.isFocused=!1,this.isHovered||this.close())};this.el.Expressive_Tooltip=this,this.options={...d.defaults,...this._getAttributeOptions(),...e},this.isOpen=!1,this.isHovered=!1,this.isFocused=!1,this._appendTooltipEl(),this._setupEventHandlers()}static get defaults(){return Ee}static init(t,e={}){return super.init(t,e,d)}static getInstance(t){return t.Expressive_Tooltip}destroy(){clearTimeout(this._enterDelayTimeout),clearTimeout(this._exitDelayTimeout),clearTimeout(this._animationTimeout),this.isOpen=!1,this.isHovered=!1,this.isFocused=!1,this.el.getAttribute("aria-describedby")===this.tooltipEl.id&&this.el.removeAttribute("aria-describedby"),this.tooltipEl.remove(),this._removeEventHandlers(),this.el.Expressive_Tooltip=void 0}_appendTooltipEl(){this.tooltipEl=document.createElement("div"),this.tooltipEl.classList.add("tooltip"),this.tooltipEl.id=`tooltip-${u.guid()}`,this.tooltipEl.setAttribute("role","tooltip"),this.el.setAttribute("aria-describedby",this.tooltipEl.id);let t=this.options.tooltipId?u.getElementById(this.el,this.options.tooltipId):document.createElement("div");this.options.tooltipId&&this.tooltipEl.classList.add("rich"),t.style.display="",t.classList.add("tooltip-content"),this._setTooltipContent(t),this.tooltipEl.appendChild(t),u.portalRoot(this.el).appendChild(this.tooltipEl)}_setTooltipContent(t){this.options.tooltipId||(t.innerText=this.options.text)}_updateTooltipContent(){this._setTooltipContent(this.tooltipEl.querySelector(".tooltip-content"))}_setupEventHandlers(){for(let t of[this.el,this.tooltipEl])t.addEventListener("mouseenter",this._handleMouseEnter),t.addEventListener("mouseleave",this._handleMouseLeave),t.addEventListener("focus",this._handleFocus,!0),t.addEventListener("blur",this._handleBlur,!0);this.el.ownerDocument.addEventListener("keydown",this._handleKeydown,!0)}_removeEventHandlers(){for(let t of[this.el,this.tooltipEl])t.removeEventListener("mouseenter",this._handleMouseEnter),t.removeEventListener("mouseleave",this._handleMouseLeave),t.removeEventListener("focus",this._handleFocus,!0),t.removeEventListener("blur",this._handleBlur,!0);this.el.ownerDocument.removeEventListener("keydown",this._handleKeydown,!0)}_setExitDelayTimeout(){clearTimeout(this._exitDelayTimeout),this._exitDelayTimeout=setTimeout(()=>{this.isHovered||this.isFocused||this._animateOut()},this.options.exitDelay)}_setEnterDelayTimeout(t){clearTimeout(this._enterDelayTimeout),this._enterDelayTimeout=setTimeout(()=>{!this.isHovered&&!this.isFocused&&!t||this._animateIn()},this.options.enterDelay)}_positionTooltip(){let t=this.tooltipEl,e=this.el,i=e.offsetHeight,s=e.offsetWidth,o=t.offsetHeight,r=t.offsetWidth,c=this.options.margin;this.xMovement=0,this.yMovement=0;let h=e.getBoundingClientRect(),l=h.top+u.getDocumentScrollTop(),a=h.left+u.getDocumentScrollLeft();this.options.position==="top"?(l+=-o-c,a+=s/2-r/2,this.yMovement=-this.options.transitionMovement):this.options.position==="right"?(l+=i/2-o/2,a+=s+c,this.xMovement=this.options.transitionMovement):this.options.position==="left"?(l+=i/2-o/2,a+=-r-c,this.xMovement=-this.options.transitionMovement):(l+=i+c,a+=s/2-r/2,this.yMovement=this.options.transitionMovement);let m=this._repositionWithinScreen(a,l,r,o);t.style.setProperty("--md-comp-tooltip-anchor-gap",`${Math.max(0,c)+Math.abs(this.options.transitionMovement)}px`),t.style.top=m.y+"px",t.style.left=m.x+"px"}_repositionWithinScreen(t,e,i,s){return u._repositionWithinScreen(t,e,i,s,this.options.margin,this.options.transitionMovement,"center")}_animateIn(){this._animate(!0)}_animateOut(){this._animate(!1)}_animate(t){let e=this.tooltipEl.style,i=this.el.ownerDocument.defaultView.matchMedia("(prefers-reduced-motion: reduce)").matches,s=i?0:t?this.options.inDuration:this.options.outDuration;t&&(this._positionTooltip(),e.visibility="visible",e.overflow="visible"),e.transition=`transform ${s}ms ease-out, opacity ${s}ms ease-out`,clearTimeout(this._animationTimeout),this._animationTimeout=setTimeout(()=>{e.transform=t&&!i?`translateX(${this.xMovement}px) translateY(${this.yMovement}px)`:"none",e.opacity=t?(this.options.opacity||1).toString():"0",t||(this._animationTimeout=setTimeout(()=>{e.visibility="hidden",e.overflow=""},s))},1)}_getAttributeOptions(){let t={},e=this.el.getAttribute("data-tooltip"),i=this.el.getAttribute("data-tooltip-id"),s=this.el.getAttribute("data-position");return e&&(t.text=e),s&&(t.position=s),i&&(t.tooltipId=i),t}};var Ct={AppBar:{component:Y,selector:"header.medium, header.large, header:has(> :is(nav:not(.tabs, .navigation-bar, .navigation-rail), .bar) > :is(.search-bar, .searchbar))"},Autocomplete:{component:B,selector:".autocomplete"},ButtonGroup:{component:X,selector:".button-group"},Cards:{component:R,selector:pt,filter:mt},ExpandingCard:{component:P,selector:ft},Carousel:{component:N,selector:".carousel"},Chips:{component:W,selector:".chips"},Datepicker:{component:Z,selector:".datepicker, .date-picker"},Menu:{component:O,selector:".menu-trigger"},Lightbox:{component:Q,selector:".lightboxed"},ScrollSpy:{component:J,selector:".scrollspy"},FormSelect:{component:k,selector:"select"},NavigationRail:{component:tt,selector:".navigation-rail"},Tabs:{component:et,selector:".tabs"},Timepicker:{component:it,selector:".timepicker, .time-picker"},Tooltip:{component:st,selector:".tooltipped"},FloatingActionButton:{component:G,selector:".fab-menu"}};function wt(d=document.body,n){for(let t of Object.keys(Ct)){let{component:e,selector:i,filter:s}=Ct[t],o=d.querySelectorAll(`:is(${i}):not(.no-autoinit)`);s?o.forEach(r=>{s(r)&&e.init(r,n?.[t]??{})}):e.init(o,n?.[t]??{})}}var ye="0.10.1";U.Init();W.Init();V.Init();R.Init();P.Init();$.Init();K.Init();z.Init();return Kt(be);})();
|
|
62
62
|
//# sourceMappingURL=expressive.min.js.map
|