@esri/calcite-components
Version:
Web Components for Esri's Calcite Design System.
5 lines (4 loc) • 4.33 kB
JavaScript
/*! All material copyright ESRI, All Rights Reserved, unless otherwise specified.
See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
v3.2.1 */
import{b as o,c as y}from"./VAHSXLFS.js";import{a as g,b as k}from"./BVJFCLMH.js";import{b as u}from"./5RDOSP2E.js";import{e as f,l as m}from"./3ADX47DD.js";import{d as b}from"./HPN2C7M6.js";import"./JOSABGK6.js";import"./NNVH7JUI.js";import{E as c,F as r,H as e,J as d,K as h,R as p,c as l,d as n}from"./BJZTU5BQ.js";var R=l`:host([disabled]){cursor:default;-webkit-user-select:none;user-select:none;opacity:var(--calcite-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}:host{display:inline}:host a,:host span{position:relative;display:flex;cursor:pointer;align-items:center;justify-content:center;border-radius:0;border-style:none;font-family:inherit;text-decoration:none;line-height:inherit;font-size:inherit;-webkit-appearance:none;transition-property:background-color,block-size,border-color,box-shadow,color,inset-block-end,inset-block-start,inset-inline-end,inset-inline-start,inset-size,opacity,outline-color,transform,background-size;transition-duration:var(--calcite-animation-timing);transition-timing-function:ease-in-out}:host a:hover,:host span:hover{text-decoration:none}:host a,:host span{outline-color:transparent}:host a:focus,:host span:focus{outline:2px solid var(--calcite-color-focus, var(--calcite-ui-focus-color, var(--calcite-color-brand)));outline-offset:calc(2px*(1 - (2*clamp(0,var(--calcite-offset-invert-focus),1))))}calcite-icon{inline-size:1em;block-size:1em;min-inline-size:unset;min-block-size:unset}.calcite-link--icon{vertical-align:middle;margin-block-start:-.25em}:host .calcite-link--icon.icon-start{margin-inline-end:.5rem}:host .calcite-link--icon.icon-end{margin-inline-start:.5rem}:host span,:host a{position:relative;display:inline;border-style:none;background-color:transparent;padding:0;color:var(--calcite-link-text-color, var(--calcite-color-text-link));line-height:inherit;white-space:initial;background-image:linear-gradient(currentColor,currentColor),linear-gradient(var(--calcite-color-brand-underline),var(--calcite-color-brand-underline));background-position-x:0%,100%;background-position-y:min(1.5em,100%);background-repeat:no-repeat,no-repeat;background-size:0% 1px,100% 1px}:host span:hover,:host span:focus,:host a:hover,:host a:focus{background-size:100% 1px,100% 1px}:host span:active,:host a:active{background-size:100% 2px,100% 2px}:host span.calcite--rtl,:host a.calcite--rtl{background-position:100% 100%,100% 100%}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.interaction-container{display:contents}:host([hidden]){display:none}[hidden]{display:none}`,s=class extends c{constructor(){super(),this.disabled=!1,this.download=!1,this.listen("click",this.clickHandler)}static{this.properties={disabled:[7,{},{reflect:!0,type:Boolean}],download:[3,{converter:d},{reflect:!0}],href:[3,{},{reflect:!0}],iconEnd:[3,{},{reflect:!0}],iconFlipRtl:[3,{},{reflect:!0}],iconStart:[3,{},{reflect:!0}],rel:1,target:1}}static{this.styles=R}async setFocus(){await b(this),m(this.childEl)}updated(){g(this)}clickHandler(t){this.disabled||t.isTrusted||this.childEl.click()}childElClickHandler(t){t.isTrusted||t.stopPropagation()}storeTagRef(t){this.childEl=t}render(){let{download:t,el:v}=this,x=f(v),i=this.href?"a":"span",$=n`<calcite-icon class="calcite-link--icon icon-start" .flipRtl=${this.iconFlipRtl==="start"||this.iconFlipRtl==="both"} .icon=${this.iconStart} scale=s></calcite-icon>`,E=n`<calcite-icon class="calcite-link--icon icon-end" .flipRtl=${this.iconFlipRtl==="end"||this.iconFlipRtl==="both"} .icon=${this.iconEnd} scale=s></calcite-icon>`,a=i==="span"?o`span`:o`a`,z=i==="span"?"link":null,w=i==="span"?0:null;return this.el.role="presentation",k({disabled:this.disabled,children:y`<${a} class=${r({[h.rtl]:x==="rtl"})} download=${(i==="a"?t===!0||t===""?"":t||null:null)??e} href=${(i==="a"&&this.href)??e} =${this.childElClickHandler} rel=${(i==="a"&&this.rel)??e} .role=${z} tabindex=${w??e} target=${(i==="a"&&this.target)??e} ${u(this.storeTagRef)}>${n`${this.iconStart?$:null}<slot></slot>${this.iconEnd?E:null}`}</${a}>`})}};p("calcite-link",s);export{s as Link};