@uplynk/lynk-design 1.14.0 → 1.16.0

package/cdn/chunks/chunk.36TNLKB5.js

@@ -0,0 +1,176 @@
+import{a as o}from"./chunk.OAB62Q2Y.js";var r=o`
+  :host {
+    --shadow-color: var(--lynk-color-black);
+    --shadow-size: 2rem;
+
+    /* private (defined dynamically) */
+    --start-shadow-opacity: 0;
+    --end-shadow-opacity: 0;
+
+    display: block;
+    position: relative;
+    max-width: 100%;
+    isolation: isolate;
+    overflow: hidden;
+  }
+
+  :host([orientation='vertical']) {
+    display: flex;
+    flex-direction: column;
+    height: 100%;
+  }
+
+  #content {
+    z-index: 1; /* below shadows */
+    border-radius: inherit;
+    scroll-behavior: smooth;
+    scrollbar-width: thin;
+    scrollbar-color: var(--lynk-color-neutral-400) transparent;
+    scrollbar-gutter: stable;
+
+    /* Prevent text in mobile Safari from being larger when the container width larger than the viewport */
+    -webkit-text-size-adjust: 100%;
+
+    /* Webkit scrollbar styles for overlay appearance */
+    &::-webkit-scrollbar {
+      width: 8px;
+      height: 8px;
+      background: transparent;
+    }
+
+    &::-webkit-scrollbar-track {
+      background: transparent;
+    }
+
+    &::-webkit-scrollbar-thumb {
+      background: var(--lynk-color-neutral-400);
+      border-radius: 4px;
+      border: 1px solid transparent;
+      background-clip: content-box;
+    }
+
+    &::-webkit-scrollbar-thumb:hover {
+      background: var(--lynk-color-neutral-500);
+      background-clip: content-box;
+    }
+
+    &::-webkit-scrollbar-corner {
+      background: transparent;
+    }
+
+    &:focus {
+      outline: none;
+    }
+
+    &:focus-visible {
+      outline: var(--lynk-focus-ring);
+      outline-offset: var(--lynk-focus-ring-offset);
+    }
+  }
+
+  :host([without-scrollbar]) #content {
+    scrollbar-width: none;
+
+    &::-webkit-scrollbar {
+      display: none;
+    }
+  }
+
+  :host([orientation='horizontal']) #content {
+    overflow-x: overlay;
+    overflow-y: hidden;
+  }
+
+  :host([orientation='vertical']) #content {
+    flex: 1 1 auto;
+    min-height: 0; /* This is crucial for flex children to respect overflow */
+    overflow-x: hidden;
+    overflow-y: overlay;
+  }
+
+  /* Fallback for browsers that don't support overlay */
+  @supports not (overflow: overlay) {
+    :host([orientation='horizontal']) #content {
+      overflow-x: auto;
+    }
+
+    :host([orientation='vertical']) #content {
+      overflow-y: auto;
+    }
+  }
+
+  /* Horizontal shadows */
+  :host([orientation='horizontal']) {
+    #start-shadow,
+    #end-shadow {
+      position: absolute;
+      top: 0;
+      bottom: 0;
+      width: var(--shadow-size);
+      pointer-events: none;
+    }
+
+    #start-shadow {
+      opacity: var(--start-shadow-opacity);
+    }
+
+    #end-shadow {
+      opacity: var(--end-shadow-opacity);
+    }
+
+    #start-shadow {
+      &:dir(ltr) {
+        left: 0;
+        background: linear-gradient(to right, var(--shadow-color), transparent 100%);
+      }
+
+      &:dir(rtl) {
+        right: 0;
+        background: linear-gradient(to left, var(--shadow-color), transparent 100%);
+      }
+    }
+
+    #end-shadow {
+      &:dir(ltr) {
+        right: 0;
+        background: linear-gradient(to left, var(--shadow-color), transparent 100%);
+      }
+
+      &:dir(rtl) {
+        left: 0;
+        background: linear-gradient(to right, var(--shadow-color), transparent 100%);
+      }
+    }
+  }
+
+  /* Vertical shadows */
+  :host([orientation='vertical']) {
+    #start-shadow,
+    #end-shadow {
+      position: absolute;
+      z-index: 2;
+      right: 0;
+      left: 0;
+      height: var(--shadow-size);
+      pointer-events: none;
+    }
+
+    #start-shadow {
+      opacity: var(--start-shadow-opacity);
+    }
+
+    #end-shadow {
+      opacity: var(--end-shadow-opacity);
+    }
+
+    #start-shadow {
+      top: 0;
+      background: linear-gradient(to bottom, var(--shadow-color), transparent 100%);
+    }
+
+    #end-shadow {
+      bottom: 0;
+      background: linear-gradient(to top, var(--shadow-color), transparent 100%);
+    }
+  }
+`;export{r as a};

package/cdn/chunks/chunk.3AOO2AKY.js

@@ -0,0 +1,9 @@
+import{a}from"./chunk.T6Q56ZGR.js";import{a as d}from"./chunk.KVURF5IX.js";import{d as h}from"./chunk.HUMDDNNQ.js";import{a as m}from"./chunk.YHSYTTFF.js";import{a as n}from"./chunk.LUIZCMPE.js";import{a as l,d as s,g as i}from"./chunk.ODSBDO47.js";import{a as p}from"./chunk.6UGEFC7C.js";import{d as o}from"./chunk.OAB62Q2Y.js";import{e as r}from"./chunk.FI4IKBIW.js";var t=class extends i{constructor(){super(...arguments);this.hasSlotController=new m(this,"header");this.width="fluid"}scrollToTop(){let e=this.hasParentLayout()?this.parentElement.renderRoot.querySelector(".page__main"):h(this.pageContent);e&&e.scrollTo({top:0,behavior:"smooth"})}hasParentLayout(){return this.parentElement instanceof a}render(){return o`
+      <div
+        part="base"
+        class=${n({"page-content":!0,"page-content--auto":this.width==="auto","page-content--sm":this.width==="small","page-content--md":this.width==="medium","page-content--lg":this.width==="large","page-content--xl":this.width==="x-large","page-content--xxl":this.width==="2x-large","page-content--fluid":this.width==="fluid","page-content--has-header":this.hasSlotController.test("header")})}
+      >
+        ${this.hasSlotController.test("header")?o`<slot name="header" part="header" class="page-content__header"></slot>`:""}
+        <slot part="main" class="page-content__main"></slot>
+      </div>
+    `}};t.styles=[p,d],t.dependencies={"lynk-page":a},r([l({reflect:!0})],t.prototype,"width",2),r([s(".page-content")],t.prototype,"pageContent",2);export{t as a};

package/cdn/chunks/chunk.3D6S4MMW.js

@@ -0,0 +1 @@
+import{a as e}from"./chunk.CQ2GELGZ.js";var r=e;e.define("lynk-alert");export{r as a};

package/cdn/chunks/chunk.3EHOQKRM.js

@@ -0,0 +1 @@
+import{a as o}from"./chunk.U55BA6ZK.js";var e=o;o.define("lynk-radio-button");export{e as a};

package/cdn/chunks/chunk.3IM6O2XE.js

@@ -0,0 +1,12 @@
+import{a as i}from"./chunk.T2L6774A.js";import{a as p}from"./chunk.3AOO2AKY.js";import{a as e}from"./chunk.T6Q56ZGR.js";import{a as s}from"./chunk.LUIZCMPE.js";import{a,g as n}from"./chunk.ODSBDO47.js";import{a as l}from"./chunk.6UGEFC7C.js";import{d as o}from"./chunk.OAB62Q2Y.js";import{e as r}from"./chunk.FI4IKBIW.js";var t=class extends n{constructor(){super(...arguments);this.width="fluid"}connectedCallback(){super.connectedCallback(),!this.slot&&this.hasParentLayout()&&(this.slot="footer")}hasParentLayout(){return this.parentElement instanceof e}render(){return o`
+      <lynk-page-content width="${this.width}" style="--padding-top: 0; --padding-bottom: 0;">
+        <footer
+          part="base"
+          class=${s({"page-footer":!0})}
+        >
+          <slot part="primary" class="page-footer__primary"></slot>
+          <slot part="center" name="center" class="page-footer__center"></slot>
+          <slot part="secondary" name="secondary" class="page-footer__secondary"></slot>
+        </footer>
+      </lynk-page-content>
+    `}};t.styles=[l,i],t.dependencies={"lynk-page-content":p,"lynk-page":e},r([a({reflect:!0})],t.prototype,"width",2);export{t as a};

package/cdn/chunks/chunk.3OFNBJYM.js

@@ -0,0 +1 @@
+import{a as e}from"./chunk.2RR5D7EA.js";var n=e;e.define("lynk-intersection-observer");export{n as a};

package/cdn/chunks/chunk.3T6PQER7.js

@@ -0,0 +1 @@
+import{a as m}from"./chunk.JTBUWYUM.js";import{g as r}from"./chunk.ODSBDO47.js";import{a as e}from"./chunk.6UGEFC7C.js";import{d as o}from"./chunk.OAB62Q2Y.js";var t=class extends r{render(){return o` <slot></slot> `}};t.styles=[e,m];export{t as a};

package/cdn/chunks/chunk.3TEFSBPF.js

@@ -0,0 +1,33 @@
+import{a as g}from"./chunk.6KT6T467.js";import{a as S}from"./chunk.5TIRFYB3.js";import{a as h,c as d}from"./chunk.DCN42ZX4.js";import{a as _}from"./chunk.Q3J7P2MZ.js";import{a as w}from"./chunk.5FCGOT5T.js";import{a as b}from"./chunk.LUIZCMPE.js";import{a as o,b as m,d as l,g as f}from"./chunk.ODSBDO47.js";import{a as y}from"./chunk.6UGEFC7C.js";import{d as u}from"./chunk.OAB62Q2Y.js";import{e}from"./chunk.FI4IKBIW.js";var t=class extends f{constructor(){super(...arguments);this.localize=new _(this);this.isCopying=!1;this.status="rest";this.value="";this.from="";this.disabled=!1;this.copyLabel="";this.successLabel="";this.errorLabel="";this.feedbackDuration=1500;this.tooltipPlacement="top";this.hoist=!1}async handleCopy(){if(this.disabled||this.isCopying)return;this.isCopying=!0;let s=this.value;if(this.from){let c=this.getRootNode(),n=this.from.includes("."),p=this.from.includes("[")&&this.from.includes("]"),a=this.from,i="";n?[a,i]=this.from.trim().split("."):p&&([a,i]=this.from.trim().replace(/\]$/,"").split("["));let r="getElementById"in c?c.getElementById(a):null;r?p?s=r.getAttribute(i)||"":n?s=r[i]||"":s=r.textContent||"":(this.showStatus("error"),this.emit("ev-error"))}if(!s)this.showStatus("error"),this.emit("ev-error");else try{await navigator.clipboard.writeText(s),this.showStatus("success"),this.emit("ev-copy",{detail:{value:s}})}catch(c){this.showStatus("error"),this.emit("ev-error")}}async showStatus(s){let c=this.copyLabel||this.localize.term("copy"),n=this.successLabel||this.localize.term("copied"),p=this.errorLabel||this.localize.term("error"),a=s==="success"?this.successIcon:this.errorIcon,i=d(this,"copy.in",{dir:"ltr"}),r=d(this,"copy.out",{dir:"ltr"});this.tooltip.content=s==="success"?n:p,await this.copyIcon.animate(r.keyframes,r.options).finished,this.copyIcon.hidden=!0,this.status=s,a.hidden=!1,await a.animate(i.keyframes,i.options).finished,setTimeout(async()=>{await a.animate(r.keyframes,r.options).finished,a.hidden=!0,this.status="rest",this.copyIcon.hidden=!1,await this.copyIcon.animate(i.keyframes,i.options).finished,this.tooltip.content=c,this.isCopying=!1},this.feedbackDuration)}render(){let s=this.copyLabel||this.localize.term("copy");return u`
+      <lynk-tooltip
+        class=${b({"copy-button":!0,"copy-button--success":this.status==="success","copy-button--error":this.status==="error"})}
+        content=${s}
+        placement=${this.tooltipPlacement}
+        ?disabled=${this.disabled}
+        ?hoist=${this.hoist}
+        exportparts="
+          base:tooltip__base,
+          base__popup:tooltip__base__popup,
+          base__arrow:tooltip__base__arrow,
+          body:tooltip__body
+        "
+      >
+        <button
+          class="copy-button__button"
+          part="button"
+          type="button"
+          ?disabled=${this.disabled}
+          @click=${this.handleCopy}
+        >
+          <slot part="copy-icon" name="copy-icon">
+            <lynk-icon library="system" name="copy"></lynk-icon>
+          </slot>
+          <slot part="success-icon" name="success-icon" hidden>
+            <lynk-icon library="system" name="check"></lynk-icon>
+          </slot>
+          <slot part="error-icon" name="error-icon" hidden>
+            <lynk-icon library="system" name="x-lg"></lynk-icon>
+          </slot>
+        </button>
+      </lynk-tooltip>
+    `}};t.styles=[y,g],t.dependencies={"lynk-icon":w,"lynk-tooltip":S},e([l('slot[name="copy-icon"]')],t.prototype,"copyIcon",2),e([l('slot[name="success-icon"]')],t.prototype,"successIcon",2),e([l('slot[name="error-icon"]')],t.prototype,"errorIcon",2),e([l("lynk-tooltip")],t.prototype,"tooltip",2),e([m()],t.prototype,"isCopying",2),e([m()],t.prototype,"status",2),e([o()],t.prototype,"value",2),e([o()],t.prototype,"from",2),e([o({type:Boolean,reflect:!0})],t.prototype,"disabled",2),e([o({attribute:"copy-label"})],t.prototype,"copyLabel",2),e([o({attribute:"success-label"})],t.prototype,"successLabel",2),e([o({attribute:"error-label"})],t.prototype,"errorLabel",2),e([o({attribute:"feedback-duration",type:Number})],t.prototype,"feedbackDuration",2),e([o({attribute:"tooltip-placement"})],t.prototype,"tooltipPlacement",2),e([o({type:Boolean})],t.prototype,"hoist",2);h("copy.in",{keyframes:[{scale:".25",opacity:".25"},{scale:"1",opacity:"1"}],options:{duration:100}});h("copy.out",{keyframes:[{scale:"1",opacity:"1"},{scale:".25",opacity:"0"}],options:{duration:100}});export{t as a};

package/cdn/chunks/chunk.3UQBRIIH.js

@@ -0,0 +1,109 @@
+import{a as A}from"./chunk.HNHDLBPG.js";import{a as E}from"./chunk.MWCK56XI.js";import{a as F}from"./chunk.5TIRFYB3.js";import{a as V}from"./chunk.LT2ADERP.js";import{b as T}from"./chunk.V7E6ITFP.js";import{a as S}from"./chunk.Q3J7P2MZ.js";import{a as M}from"./chunk.PGNVXJKR.js";import{a as k}from"./chunk.YHSYTTFF.js";import{a as v}from"./chunk.YZSIY5HS.js";import{a as x}from"./chunk.LUIZCMPE.js";import{a as r,b,d,g as w}from"./chunk.ODSBDO47.js";import{a as _}from"./chunk.6UGEFC7C.js";import{d as a}from"./chunk.OAB62Q2Y.js";import{e as i}from"./chunk.FI4IKBIW.js";var e=class extends w{constructor(){super(...arguments);this.formControlController=new T(this);this.hasSlotController=new k(this,"help-text","help-tip","label","prefix","suffix","reference");this.localize=new S(this);this.isDragging=!1;this.valueHasChanged=!1;this.hasFocus=!1;this.hasTooltip=!1;this.name="";this.label="";this.minValue=0;this.maxValue=50;this.defaultValue=this.getAttribute("value")===null?this.minValue:Number(this.getAttribute("value"));this._value=this.defaultValue;this.range=!1;this.helpText="";this.helpTip="";this.size="medium";this.state="default";this.disabled=!1;this.readonly=!1;this.dirty=!1;this.orientation="horizontal";this.min=0;this.max=100;this.step=1;this.ticks=[];this.withMarkers=!1;this.tooltip="top";this.tooltipFormatter=t=>t.toString();this.form=""}get value(){var t;return this.valueHasChanged?this._value:(t=this._value)!=null?t:this.defaultValue}set value(t){let s=Number(t);t=isNaN(s)?this.minValue:s,this._value!==t&&(this.valueHasChanged=!0,this._value=t)}get isRange(){return this.range}get validity(){return this.input.validity}get validationMessage(){return this.input.validationMessage}connectedCallback(){super.connectedCallback(),this.resizeObserver=new ResizeObserver(()=>this.syncRange()),this.value<this.min&&(this.value=this.min),this.value>this.max&&(this.value=this.max),this.updateComplete.then(()=>{this.syncRange(),this.resizeObserver.observe(this.wrapper)})}disconnectedCallback(){var t;super.disconnectedCallback(),(t=this.resizeObserver)==null||t.unobserve(this.wrapper)}handleWrapperPointerDown(t){var n,p;if(this.disabled||this.readonly||t.button!==0)return;t.preventDefault(),this.trackRect=this.wrapper.getBoundingClientRect(),this.valueOnDragStart=this.value,this.internalValue=this.value,this.isDragging=!0,this.hasTooltip=!0,(n=this.tooltipElement)==null||n.show(),(p=this.thumb)==null||p.focus(),this.setValueFromClientCoordinates(t.clientX,t.clientY);let s=h=>{this.setValueFromClientCoordinates(h.clientX,h.clientY)},l=()=>{var h;document.removeEventListener("pointermove",s),document.removeEventListener("pointerup",l),this.isDragging=!1,this.internalValue!==this.value&&(this.value=this.internalValue,this.input&&(this.input.value=this.internalValue.toString()),this.emit("ev-input")),this.hasTooltip=!1,(h=this.tooltipElement)==null||h.hide(),this.value!==this.valueOnDragStart&&this.emit("ev-change")};document.addEventListener("pointermove",s,{passive:!0}),document.addEventListener("pointerup",l)}handleBlur(){this.hasFocus=!1,this.hasTooltip=!1,this.emit("ev-blur")}handleFocus(){this.hasFocus=!0,this.emit("ev-focus")}handleKeyDown(t){if(this.disabled)return;let s=this.orientation==="vertical",l=this.localize.dir()==="rtl",n=this.step||1;["ArrowLeft","ArrowRight","ArrowUp","ArrowDown","Home","End"].includes(t.key)&&(t.preventDefault(),t.key==="Home"?this.value=this.min:t.key==="End"?this.value=this.max:t.key==="ArrowLeft"&&!l&&!s||t.key==="ArrowRight"&&l&&!s||t.key==="ArrowDown"&&s?this.value=Math.max(this.min,this.value-n):(t.key==="ArrowRight"&&!l&&!s||t.key==="ArrowLeft"&&l&&!s||t.key==="ArrowUp"&&s)&&(this.value=Math.min(this.max,this.value+n)),this.emit("ev-input"),this.emit("ev-change"))}clampAndRoundToStep(t){let s=(String(this.step).split(".")[1]||"").replace(/0+$/g,"").length;return t=Math.round(t/this.step)*this.step,t=Math.max(this.min,Math.min(this.max,t)),parseFloat(t.toFixed(s))}setValueFromClientCoordinates(t,s){var C;let l=this.orientation==="vertical",n=this.localize.dir()==="rtl",{top:p,bottom:h,left:g,right:o,height:f,width:u}=this.trackRect,c=l?s:t,D=l?p:g,$=l?h:o,z=l?f:u,P=l||n?$-c:c-D,O=Math.max(0,Math.min(1,P/z)),m=this.clampAndRoundToStep(this.min+(this.max-this.min)*O);if(this.internalValue!==m)if(this.internalValue=m,this.isDragging){let y=this.max-this.min,U=y>0?Math.max(0,Math.min(1,(m-this.min)/y)):0;this.wrapper.style.setProperty("--percent",`${U*100}%`),(C=this.thumb)==null||C.setAttribute("aria-valuenow",m.toString()),this.tooltipElement&&(this.tooltipElement.content=typeof this.tooltipFormatter=="function"?this.tooltipFormatter(m):m.toString())}else this.value=m,this.emit("ev-input")}handleTickClick(t,s){this.disabled||this.readonly||(t.stopPropagation(),this.value=s.value,this.emit("ev-input"),this.emit("ev-change"))}syncProgress(t){var s;(s=this.wrapper)==null||s.style.setProperty("--percent",`${t*100}%`)}valueToPercent(t){return(t-this.min)*100/(this.max-this.min)}handleValueChange(){this.isDragging||(this.formControlController.updateValidity(),this.input&&(this.input.value=this.value.toString()),this.syncRange())}handleDisabledChange(){this.formControlController.setValidity(this.disabled)}handleRangePropertiesChange(){this.syncRange()}syncRange(){let t=this.max-this.min,s=t>0?Math.max(0,Math.min(1,(this.value-this.min)/t)):0;this.syncProgress(s)}focus(t){var s;(s=this.thumb)==null||s.focus(t)}blur(){var t;(t=this.thumb)==null||t.blur()}stepUp(){let t=this.step||1;this.value=Math.min(this.max,this.value+t),this.emit("ev-input"),this.emit("ev-change")}stepDown(){let t=this.step||1;this.value=Math.max(this.min,this.value-t),this.emit("ev-input"),this.emit("ev-change")}checkValidity(){return this.input.checkValidity()}getForm(){return this.formControlController.getForm()}reportValidity(){return this.input.reportValidity()}setCustomValidity(t){this.input.setCustomValidity(t),this.formControlController.updateValidity()}render(){let t=this.hasSlotController.test("ticks"),s=this.ticks.length?!0:!!t,l=this.hasSlotController.test("prefix"),n=this.hasSlotController.test("suffix"),p=a`
+      <div
+        part="thumb"
+        class="range__thumb"
+        role="slider"
+        tabindex=${this.disabled?"-1":"0"}
+        aria-label=${this.label||"Range"}
+        aria-valuemin=${this.min}
+        aria-valuemax=${this.max}
+        aria-valuenow=${this.value}
+        aria-disabled=${this.disabled?"true":"false"}
+        aria-orientation=${this.orientation}
+        @keydown=${this.handleKeyDown}
+        @focus=${this.handleFocus}
+        @blur=${this.handleBlur}
+      ></div>
+    `,h=[];if(this.withMarkers&&this.step>0&&Math.floor((this.max-this.min)/this.step)+1<=1e3)for(let u=this.min;u<=this.max;u+=this.step)h.push(this.valueToPercent(u));let g=this.withMarkers?a`
+          <div class="range__markers" part="markers">
+            ${h.map(o=>a`<span part="marker" class="range__marker" style="--position: ${o}%"></span>`)}
+          </div>
+        `:"";return a`
+      <lynk-form-field
+        .size=${this.size}
+        .state=${this.state}
+        .label=${this.hasSlotController.test("label")?"":this.label}
+        .helpText=${this.hasSlotController.test("help-text")?"":this.helpText}
+        .helpTip=${this.hasSlotController.test("help-tip")?"":this.helpTip}
+        .focused=${this.hasFocus}
+        ?data-user-invalid=${this.hasAttribute("data-user-invalid")}
+        ?data-user-valid=${this.hasAttribute("data-user-valid")}
+        ?data-invalid=${this.hasAttribute("data-invalid")}
+        ?data-valid=${this.hasAttribute("data-valid")}
+      >
+        ${this.hasSlotController.test("label")?a`<slot name="label" slot="label"></slot>`:""}
+        ${this.hasSlotController.test("help-text")?a`<slot name="help-text" slot="help-text"></slot>`:""}
+        ${this.hasSlotController.test("help-tip")?a`<slot name="help-tip" slot="help-tip"></slot>`:""}
+
+        <div
+          part="base"
+          class=${x({range:!0,"range--disabled":this.disabled,"range--readonly":this.readonly,"range--focused":this.hasFocus,"range--vertical":this.orientation==="vertical","range--rtl":this.localize.dir()==="rtl","range--tooltip-visible":this.hasTooltip,"range--tooltip-top":this.tooltip==="top","range--tooltip-bottom":this.tooltip==="bottom","range--has-prefix":l,"range--has-suffix":n})}
+        >
+          <input
+            type="range"
+            class="range__native-input"
+            name=${M(this.name)}
+            min=${this.min}
+            max=${this.max}
+            step=${this.step}
+            ?disabled=${this.disabled}
+            .value=${V(this.value.toString())}
+            tabindex="-1"
+            aria-hidden="true"
+          />
+
+          ${l?a`
+                <span part="prefix" class="range__prefix">
+                  <slot name="prefix"></slot>
+                </span>
+              `:""}
+
+          <div part="wrapper" class="range__wrapper" @pointerdown=${this.handleWrapperPointerDown}>
+            <div part="track" class="range__track">
+              <div part="track-active" class="range__track-active"></div>
+              ${g}
+            </div>
+            ${this.tooltip!=="none"&&!this.disabled?a`
+                  <lynk-tooltip
+                    .content=${typeof this.tooltipFormatter=="function"?this.tooltipFormatter(this.value):this.value.toString()}
+                    .placement=${this.orientation==="vertical"?this.tooltip==="top"?"right":"left":this.tooltip}
+                    .distance=${8}
+                    trigger="manual"
+                    ?open=${this.hasTooltip}
+                    hoist
+                  >
+                    ${p}
+                  </lynk-tooltip>
+                `:a` ${p} `}
+          </div>
+
+          ${n?a`
+                <span part="suffix" class="range__suffix">
+                  <slot name="suffix"></slot>
+                </span>
+              `:""}
+          ${s?a`
+                <div part="ticks" class="range__ticks" aria-hidden=${this.ticks.length?"false":"true"}>
+                  <slot name="ticks">
+                    ${this.ticks.length?a`
+                          ${this.ticks.filter(o=>o.value>=this.min&&o.value<=this.max).map(o=>{let f=this.valueToPercent(o.value),u=o.selected&&typeof o.selected=="boolean"?o.selected:!1;return a`
+                                <div
+                                  class=${x({range__tick:!0,"range__tick--selected":u})}
+                                  style="--offset: ${f}%"
+                                  @click=${c=>this.handleTickClick(c,o)}
+                                >
+                                  ${o.label?a` <span class="range__tick-label"> ${o.label} </span> `:""}
+                                </div>
+                              `})}
+                        `:""}
+                  </slot>
+                </div>
+              `:""}
+          ${this.hasSlotController.test("reference")?a`
+                <div part="references" class="range__references">
+                  <slot name="reference"></slot>
+                </div>
+              `:""}
+        </div>
+      </lynk-form-field>
+    `}};e.styles=[_,A],e.dependencies={"lynk-form-field":E,"lynk-tooltip":F},i([d(".range__wrapper")],e.prototype,"wrapper",2),i([d(".range__thumb")],e.prototype,"thumb",2),i([d("lynk-tooltip")],e.prototype,"tooltipElement",2),i([d(".range__native-input")],e.prototype,"input",2),i([b()],e.prototype,"hasFocus",2),i([b()],e.prototype,"hasTooltip",2),i([r()],e.prototype,"name",2),i([r()],e.prototype,"label",2),i([r({type:Number,attribute:"min-value"})],e.prototype,"minValue",2),i([r({type:Number,attribute:"max-value"})],e.prototype,"maxValue",2),i([r({attribute:"value",reflect:!0,type:Number})],e.prototype,"defaultValue",2),i([b()],e.prototype,"value",1),i([r({type:Boolean,reflect:!0})],e.prototype,"range",2),i([r({attribute:"help-text"})],e.prototype,"helpText",2),i([r({attribute:"help-tip"})],e.prototype,"helpTip",2),i([r({reflect:!0})],e.prototype,"size",2),i([r({reflect:!0})],e.prototype,"state",2),i([r({type:Boolean,reflect:!0})],e.prototype,"disabled",2),i([r({type:Boolean,reflect:!0})],e.prototype,"readonly",2),i([r({type:Boolean,reflect:!0})],e.prototype,"dirty",2),i([r({reflect:!0})],e.prototype,"orientation",2),i([r({type:Number})],e.prototype,"min",2),i([r({type:Number})],e.prototype,"max",2),i([r({type:Number})],e.prototype,"step",2),i([r({type:Array})],e.prototype,"ticks",2),i([r({attribute:"with-markers",type:Boolean})],e.prototype,"withMarkers",2),i([r()],e.prototype,"tooltip",2),i([r({attribute:!1})],e.prototype,"tooltipFormatter",2),i([r({reflect:!0})],e.prototype,"form",2),i([v("value",{waitUntilFirstUpdate:!0})],e.prototype,"handleValueChange",1),i([v("disabled",{waitUntilFirstUpdate:!0})],e.prototype,"handleDisabledChange",1),i([v(["min","max","step"],{waitUntilFirstUpdate:!0})],e.prototype,"handleRangePropertiesChange",1),i([v("hasTooltip",{waitUntilFirstUpdate:!0})],e.prototype,"syncRange",1);export{e as a};

package/cdn/chunks/chunk.3XR57SDQ.js

@@ -0,0 +1,292 @@
+import{a as r}from"./chunk.OAB62Q2Y.js";var o=r`
+  :host {
+    --border-color: var(--lynk-color-neutral-200);
+    --border-radius: var(--lynk-border-radius-large);
+    --border-width: 1px;
+    --padding: var(--lynk-spacing-base);
+    --pulse-speed: 1.5s;
+    --state-color: var(--lynk-color-primary);
+    --background-color: var(--lynk-color-neutral-50);
+
+    display: inline-block;
+  }
+
+  /* Appearance modifiers */
+  :host([appearance~='plain']) .card {
+    background-color: transparent;
+    border-color: transparent;
+    box-shadow: none;
+  }
+
+  :host([appearance~='outlined']) .card {
+    border-color: var(--border-color);
+  }
+
+  :host([appearance~='filled']) .card {
+    background-color: var(--background-color);
+    border-color: transparent;
+  }
+
+  :host([appearance~='filled'][appearance~='outlined']) .card {
+    border-color: var(--border-color);
+    background-color: var(--background-color);
+  }
+
+  :host([appearance~='accent']) .card {
+    color: var(--lynk-color-black);
+    background-color: var(--lynk-color-white);
+    border-color: transparent;
+  }
+
+  .card {
+    display: flex;
+    flex-direction: column;
+    font-size: inherit;
+    line-height: var(--lynk-line-height-dense);
+    background-color: transparent;
+    box-shadow: var(--lynk-shadow-x-small);
+    border: solid var(--border-width) var(--border-color);
+    border-radius: var(--border-radius);
+    line-height: var(--lynk-line-height-dense);
+    transition:
+      var(--lynk-transition-fast) border,
+      var(--lynk-transition-fast) box-shadow,
+      var(--lynk-transition-fast) transform,
+      var(--lynk-transition-fast) background;
+  }
+
+  .card--stealth {
+    --border-color: transparent;
+  }
+
+  .card--small {
+    --padding: var(--lynk-spacing-x-small);
+    font-size: var(--lynk-font-size-small);
+  }
+
+  .card--medium {
+    font-size: var(--lynk-font-size-medium);
+  }
+
+  .card--large {
+    --padding: var(--lynk-spacing-large);
+    font-size: var(--lynk-font-size-large);
+  }
+
+  /* Primary State */
+  .card--primary {
+    --state-color: var(--lynk-color-primary);
+    border: solid var(--border-width) var(--state-color) !important;
+  }
+
+  /* Accent State */
+  .card--accent {
+    --state-color: var(--lynk-color-accent);
+    border: solid var(--border-width) var(--state-color) !important;
+  }
+
+  /* Danger State */
+  .card--danger {
+    --state-color: var(--lynk-color-danger);
+    border: solid var(--border-width) var(--state-color) !important;
+  }
+
+  /* Warning State */
+  .card--warning {
+    --state-color: var(--lynk-color-warning);
+    border: solid var(--border-width) var(--state-color) !important;
+  }
+
+  /* Success State */
+  .card--success {
+    --state-color: var(--lynk-color-success);
+    border: solid var(--border-width) var(--state-color) !important;
+  }
+
+  /* Info State */
+  .card--info {
+    --state-color: var(--lynk-color-info);
+    border: solid var(--border-width) var(--state-color) !important;
+  }
+
+  /* Neutral State */
+  .card--neutral {
+    --state-color: var(--lynk-color-neutral);
+    border: solid var(--border-width) var(--state-color) !important;
+  }
+
+  .card--pulse {
+    animation: pulse var(--pulse-speed) infinite;
+  }
+
+  .card--pulse.card--interactive:hover {
+    animation: none;
+  }
+
+  .card--interactive:hover {
+    cursor: pointer;
+    border: solid var(--border-width) var(--state-color) !important;
+    box-shadow: var(--lynk-shadow-medium);
+  }
+  .card--interactive:active {
+    transform: translateY(-4px);
+    box-shadow: var(--lynk-shadow-large);
+  }
+
+  .card--active {
+    border: solid var(--border-width) var(--state-color) !important;
+    box-shadow: var(--lynk-shadow-large);
+  }
+
+  .card--image-only .card__image {
+    border-radius: var(--border-radius);
+  }
+
+  .card__image-block {
+    position: relative;
+    border: 1px solid transparent;
+  }
+
+  .card__image {
+    display: flex;
+    border-top-left-radius: var(--border-radius);
+    border-top-right-radius: var(--border-radius);
+    margin: calc(-1 * var(--border-width));
+    background-color: var(--lynk-color-black);
+    overflow: hidden;
+  }
+
+  .card__image-block.aspect--1-1 .card__image {
+    aspect-ratio: 1 / 1;
+  }
+
+  .card__image-block.aspect--16-9 .card__image {
+    aspect-ratio: 16 / 9;
+  }
+
+  .card__image-block.aspect--21-9 .card__image {
+    aspect-ratio: 21 / 9;
+  }
+
+  .card__image-block.aspect--4-3 .card__image {
+    aspect-ratio: 4 / 3;
+  }
+
+  .card__image-block.aspect--3-4 .card__image {
+    aspect-ratio: 3 / 4;
+  }
+
+  .card__image-block.aspect--9-16 .card__image {
+    aspect-ratio: 9 / 16;
+  }
+
+  .card__image ::slotted(img) {
+    display: block;
+    object-fit: cover;
+    width: 100%;
+  }
+
+  .card:not(.card--has-image) .card__image {
+    display: none;
+  }
+
+  .card__image-top-start,
+  .card__image-top-end,
+  .card__image-bottom-start,
+  .card__image-bottom-end {
+    position: absolute;
+    display: inline-flex;
+  }
+
+  .card__image-top-start {
+    top: var(--padding);
+    left: var(--padding);
+  }
+
+  .card__image-top-end {
+    top: var(--padding);
+    right: var(--padding);
+  }
+
+  .card__image-bottom-start {
+    bottom: var(--padding);
+    left: var(--padding);
+  }
+
+  .card__image-bottom-end {
+    bottom: var(--padding);
+    right: var(--padding);
+  }
+
+  .card__header {
+    display: block;
+    border-bottom: solid var(--border-width) var(--border-color);
+    padding: calc(var(--padding) / 2) var(--padding);
+  }
+
+  .card:not(.card--has-header) .card__header {
+    display: none;
+  }
+
+  .card:not(.card--has-image) .card__header {
+    border-top-left-radius: var(--border-radius);
+    border-top-right-radius: var(--border-radius);
+  }
+
+  .card__body {
+    display: block;
+    padding: var(--padding);
+  }
+
+  .card--has-footer .card__footer {
+    display: block;
+    border-top: solid var(--border-width) var(--border-color);
+    padding: var(--padding);
+  }
+
+  .card:not(.card--has-footer) .card__footer {
+    display: none;
+  }
+
+  .card--stealth {
+    background-color: transparent;
+    border-color: transparent;
+    gap: var(--padding);
+  }
+
+  .card--stealth.card--interactive {
+    padding: var(--padding);
+  }
+
+  .card--stealth .card__image {
+    border-radius: var(--border-radius);
+  }
+
+  .card--stealth .card__footer,
+  .card--stealth .card__header,
+  .card--stealth .card__body {
+    padding: 0;
+  }
+
+  .card--stealth.card--interactive:hover {
+    background-color: var(--lynk-panel-background-color) !important;
+    border-color: var(--border-color) !important;
+  }
+
+  .card--stealth.card--active,
+  .card--stealth.card--active:hover {
+    border-color: var(--state-color) !important;
+  }
+
+  @keyframes pulse {
+    0% {
+      box-shadow: 0 0 0 0 var(--state-color);
+    }
+    70% {
+      box-shadow: 0 0 0 0.5rem transparent;
+    }
+    100% {
+      box-shadow: 0 0 0 0 transparent;
+    }
+  }
+`;export{o as a};

package/cdn/chunks/chunk.4352QCNJ.js

@@ -0,0 +1 @@
+import{c as m,d as h,e as D,f as b,g as y}from"./chunk.HAL4HZQO.js";import{a as w,b as V,c as A}from"./chunk.N5VZIW5Z.js";import{g as k}from"./chunk.OAB62Q2Y.js";var j=(s,f,c)=>{let p=new Map;for(let e=f;e<=c;e++)p.set(s[e],e);return p},L=V(class extends A{constructor(s){if(super(s),s.type!==w.CHILD)throw Error("repeat() can only be used in text expressions")}dt(s,f,c){let p;c===void 0?c=f:f!==void 0&&(p=f);let e=[],n=[],o=0;for(let a of s)e[o]=p?p(a,o):o,n[o]=c(a,o),o++;return{values:n,keys:e}}render(s,f,c){return this.dt(s,f,c).values}update(s,[f,c,p]){var C;let e=b(s),{values:n,keys:o}=this.dt(f,c,p);if(!Array.isArray(e))return this.ut=o,n;let a=(C=this.ut)!=null?C:this.ut=[],u=[],v,g,t=0,l=e.length-1,r=0,i=n.length-1;for(;t<=l&&r<=i;)if(e[t]===null)t++;else if(e[l]===null)l--;else if(a[t]===o[r])u[r]=h(e[t],n[r]),t++,r++;else if(a[l]===o[i])u[i]=h(e[l],n[i]),l--,i--;else if(a[t]===o[i])u[i]=h(e[t],n[i]),m(s,u[i+1],e[t]),t++,i--;else if(a[l]===o[r])u[r]=h(e[l],n[r]),m(s,e[t],e[l]),l--,r++;else if(v===void 0&&(v=j(o,r,i),g=j(a,t,l)),v.has(a[t]))if(v.has(a[l])){let d=g.get(o[r]),x=d!==void 0?e[d]:null;if(x===null){let P=m(s,e[t]);h(P,n[r]),u[r]=P}else u[r]=h(x,n[r]),m(s,e[t],x),e[d]=null;r++}else y(e[l]),l--;else y(e[t]),t++;for(;r<=i;){let d=m(s,u[i+1]);h(d,n[r]),u[r++]=d}for(;t<=l;){let d=e[t++];d!==null&&y(d)}return this.ut=o,D(s,u),k}});export{L as a};