@uplynk/lynk-design 1.18.0 → 1.18.1

package/cdn/chunks/chunk.CI6VFPH4.js

@@ -0,0 +1,357 @@
+import{a as n}from"./chunk.PINNEFCM.js";var t=n`
+  :host {
+    display: block;
+    --width: 100%;
+    --border-color: initial;
+    width: var(--width);
+  }
+
+  :host([data-user-invalid]:not([disabled])),
+  :host([state='error']:not([disabled])) {
+    --border-color: var(--lynk-color-danger);
+    --focus-color: color-mix(in oklab, var(--lynk-color-danger) 50%, transparent);
+  }
+
+  :host([state='warning']) {
+    --border-color: var(--lynk-color-warning);
+    --focus-color: color-mix(in oklab, var(--lynk-color-warning) 50%, transparent);
+  }
+
+  :host([state='success']) {
+    --border-color: var(--lynk-color-success);
+    --focus-color: color-mix(in oklab, var(--lynk-color-success) 50%, transparent);
+  }
+
+  :host([readonly]) {
+    --border-color: var(--lynk-color-neutral-200);
+    --focus-color: transparent;
+  }
+
+  :host([readonly]) .input--standard.input--focused {
+    --border-color: var(--lynk-color-neutral-400);
+  }
+
+  .input {
+    flex: 1 1 auto;
+    display: inline-flex;
+    align-items: stretch;
+    justify-content: start;
+    position: relative;
+    font-family: var(--lynk-input-font-family);
+    font-weight: var(--lynk-input-font-weight);
+    text-align: left;
+    letter-spacing: var(--lynk-input-letter-spacing);
+    vertical-align: middle;
+    overflow: hidden;
+    cursor: text;
+    min-width: 0;
+    width: 100%;
+    transition:
+      var(--lynk-transition-fast) color,
+      var(--lynk-transition-fast) border,
+      var(--lynk-transition-fast) box-shadow,
+      var(--lynk-transition-fast) background-color;
+  }
+
+  /* Standard inputs */
+  .input--standard {
+    background-color: var(--lynk-input-background-color);
+    border: solid var(--lynk-input-border-width) var(--border-color, var(--lynk-input-border-color));
+  }
+
+  .input--standard:hover:not(.input--disabled) {
+    background-color: var(--lynk-input-background-color-hover);
+    border-color: var(--border-color, var(--lynk-input-border-color-hover));
+  }
+
+  .input--standard.input--focused:not(.input--disabled) {
+    background-color: var(--lynk-input-background-color-focus);
+    border-color: var(--border-color, var(--lynk-input-border-color-focus));
+    box-shadow: 0 0 0 var(--lynk-focus-ring-width) var(--focus-color, var(--lynk-input-focus-ring-color));
+  }
+
+  .input--standard.input--focused:not(.input--disabled) .input__control {
+    color: var(--lynk-input-color-focus);
+  }
+
+  .input--standard.input--disabled {
+    background-color: var(--lynk-input-background-color-disabled);
+    border-color: var(--lynk-input-border-color-disabled);
+    opacity: 0.9;
+    cursor: not-allowed;
+  }
+
+  .input--standard.input--disabled .input__control {
+    color: var(--lynk-input-color-disabled);
+  }
+
+  .input--standard.input--disabled .input__control::placeholder {
+    color: var(--lynk-input-placeholder-color-disabled);
+  }
+
+  /* Filled inputs */
+  .input--filled {
+    border: none;
+    background-color: var(--lynk-input-filled-background-color);
+    color: var(--lynk-input-color);
+  }
+
+  .input--filled:hover:not(.input--disabled) {
+    background-color: var(--lynk-input-filled-background-color-hover);
+  }
+
+  .input--filled.input--focused:not(.input--disabled) {
+    background-color: var(--lynk-input-filled-background-color-focus);
+    outline: var(--lynk-focus-ring);
+    outline-offset: var(--lynk-focus-ring-offset);
+  }
+
+  .input--filled.input--disabled {
+    background-color: var(--lynk-input-filled-background-color-disabled);
+    opacity: 0.9;
+    cursor: not-allowed;
+  }
+
+  /* Restricted Inputs */
+  .input--restricted,
+  .input--restricted:hover {
+    border: none !important;
+    background-color: transparent !important;
+    cursor: default;
+    color: var(--lynk-input-color);
+  }
+
+  .input--restricted .input__control-preview {
+    padding: 0 !important;
+    cursor: text;
+    display: inline-flex;
+    flex: 0 0 auto;
+    align-items: center;
+  }
+
+  .input--restricted .input__control {
+    display: none;
+  }
+
+  /* Input Defaults */
+  .input__control {
+    flex: 1 1 auto;
+    font-family: inherit;
+    font-size: inherit;
+    font-weight: inherit;
+    min-width: 0;
+    height: 100%;
+    color: var(--lynk-input-color);
+    border: none;
+    background: inherit;
+    box-shadow: none;
+    padding: 0;
+    margin: 0;
+    cursor: inherit;
+    width: inherit;
+    -webkit-appearance: none;
+  }
+
+  .input__control::-webkit-search-decoration,
+  .input__control::-webkit-search-cancel-button,
+  .input__control::-webkit-search-results-button,
+  .input__control::-webkit-search-results-decoration {
+    -webkit-appearance: none;
+  }
+
+  .input__control:-webkit-autofill,
+  .input__control:-webkit-autofill:hover,
+  .input__control:-webkit-autofill:focus,
+  .input__control:-webkit-autofill:active {
+    box-shadow: 0 0 0 var(--lynk-input-height-large) var(--lynk-input-background-color-hover) inset !important;
+    -webkit-text-fill-color: var(--lynk-input-color);
+    caret-color: var(--lynk-input-color);
+  }
+
+  .input--filled .input__control:-webkit-autofill,
+  .input--filled .input__control:-webkit-autofill:hover,
+  .input--filled .input__control:-webkit-autofill:focus,
+  .input--filled .input__control:-webkit-autofill:active {
+    box-shadow: 0 0 0 var(--lynk-input-height-large) var(--lynk-input-filled-background-color) inset !important;
+  }
+
+  .input__control::placeholder {
+    color: var(--lynk-input-placeholder-color);
+    user-select: none;
+  }
+
+  .input:hover:not(.input--disabled) .input__control {
+    color: var(--lynk-input-color-hover);
+  }
+
+  .input__control:focus {
+    outline: none;
+  }
+
+  .input__prefix,
+  .input__suffix {
+    display: inline-flex;
+    flex: 0 0 auto;
+    align-items: center;
+    cursor: default;
+  }
+
+  .input__prefix ::slotted(lynk-icon),
+  .input__suffix ::slotted(lynk-icon) {
+    color: var(--lynk-input-icon-color);
+  }
+
+  /*
+   * Size modifiers
+   */
+
+  .input--small {
+    border-radius: var(--lynk-input-border-radius-small);
+    font-size: var(--lynk-input-font-size-small);
+    height: var(--lynk-input-height-small);
+  }
+
+  .input--small .input__control {
+    height: calc(var(--lynk-input-height-small) - var(--lynk-input-border-width) * 2);
+    padding: 0 var(--lynk-input-spacing-small);
+  }
+
+  .input--small .input__clear,
+  .input--small .input__password-toggle {
+    width: calc(1em + var(--lynk-input-spacing-small) * 1.5);
+  }
+
+  .input--small .input__prefix ::slotted(*) {
+    padding-inline-start: var(--lynk-input-spacing-small);
+  }
+
+  .input--small .input__suffix ::slotted(*) {
+    padding-inline-end: var(--lynk-input-spacing-small);
+  }
+
+  .input--medium {
+    border-radius: var(--lynk-input-border-radius-medium);
+    font-size: var(--lynk-input-font-size-medium);
+    height: var(--lynk-input-height-medium);
+  }
+
+  .input--medium .input__control {
+    height: calc(var(--lynk-input-height-medium) - var(--lynk-input-border-width) * 2);
+    padding: 0 var(--lynk-input-spacing-medium);
+  }
+
+  .input--medium .input__clear,
+  .input--medium .input__password-toggle {
+    width: calc(1em + var(--lynk-input-spacing-medium) * 2);
+  }
+
+  .input--medium .input__prefix ::slotted(*) {
+    padding-inline-start: var(--lynk-input-spacing-medium);
+  }
+
+  .input--medium .input__suffix ::slotted(*) {
+    padding-inline-end: var(--lynk-input-spacing-medium);
+  }
+
+  .input--large {
+    border-radius: var(--lynk-input-border-radius-large);
+    font-size: var(--lynk-input-font-size-large);
+    height: var(--lynk-input-height-large);
+  }
+
+  .input--large .input__control {
+    height: calc(var(--lynk-input-height-large) - var(--lynk-input-border-width) * 2);
+    padding: 0 var(--lynk-input-spacing-large);
+  }
+
+  .input--large .input__clear,
+  .input--large .input__password-toggle {
+    width: calc(1em + var(--lynk-input-spacing-large) * 2);
+  }
+
+  .input--large .input__prefix ::slotted(*) {
+    padding-inline-start: var(--lynk-input-spacing-large);
+  }
+
+  .input--large .input__suffix ::slotted(*) {
+    padding-inline-end: var(--lynk-input-spacing-large);
+  }
+
+  /*
+   * Pill modifier
+   */
+
+  .input--pill.input--small {
+    border-radius: var(--lynk-input-height-small);
+  }
+
+  .input--pill.input--medium {
+    border-radius: var(--lynk-input-height-medium);
+  }
+
+  .input--pill.input--large {
+    border-radius: var(--lynk-input-height-large);
+  }
+
+  /*
+   * Clearable + Password Toggle
+   */
+
+  .input__clear,
+  .input__password-toggle {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    font-size: inherit;
+    color: var(--lynk-input-icon-color);
+    border: none;
+    background: none;
+    padding: 0;
+    transition: var(--lynk-transition-fast) color;
+    cursor: pointer;
+  }
+
+  .input__clear:hover,
+  .input__password-toggle:hover {
+    color: var(--lynk-input-icon-color-hover);
+  }
+
+  .input__clear:focus,
+  .input__password-toggle:focus {
+    outline: none;
+  }
+
+  .input--empty .input__clear {
+    visibility: hidden;
+  }
+
+  /* Don't show the browser's password toggle in Edge */
+  ::-ms-reveal {
+    display: none;
+  }
+
+  /* Hide the built-in number spinner */
+  .input--no-spin-buttons input[type='number']::-webkit-outer-spin-button,
+  .input--no-spin-buttons input[type='number']::-webkit-inner-spin-button {
+    -webkit-appearance: none;
+    display: none;
+  }
+
+  .input--no-spin-buttons input[type='number'] {
+    -moz-appearance: textfield;
+  }
+
+  /*
+   * Date, Time, & DateTime-Local custom styling
+  */
+
+  .input__control::-webkit-calendar-picker-indicator {
+    cursor: pointer;
+    opacity: 0.65;
+    transition: var(--lynk-transition-fast) color;
+  }
+
+  .input__control::-webkit-calendar-picker-indicator:hover {
+    opacity: 1;
+  }
+`;export{t as a};

package/cdn/chunks/chunk.CLCLCXAI.js

@@ -0,0 +1,8 @@
+import{a as m}from"./chunk.RFON4UGU.js";import{a as r}from"./chunk.7TAXE2HP.js";import{a as n,g as p}from"./chunk.OGCRBJYC.js";import{a as i}from"./chunk.MXDME6T6.js";import{d as o}from"./chunk.PINNEFCM.js";import{e as a}from"./chunk.FI4IKBIW.js";var t=class extends p{constructor(){super(...arguments);this.panels=[];this.multiple=!1}syncPanels(){var l;let e=(l=this.shadowRoot)==null?void 0:l.querySelector("slot");e&&(this.panels=e.assignedElements({flatten:!0}).filter(s=>s.tagName.toLowerCase()==="lynk-panel"))}handleSlotChange(){this.syncPanels()}handlePanelToggle(e){if(this.multiple)return;let l=e.target.closest("lynk-panel");l.disabled||this.panels.forEach(s=>s.expanded=s===l)}expandAll(){this.panels.forEach(e=>e.expanded=!0)}collapseAll(){this.panels.forEach(e=>e.expanded=!1)}render(){return o`
+      <slot
+        part="base"
+        class=${r({accordion:!0,"accordion--square":this.shape==="square","accordion--flush":this.density==="flush","accordion--compact":this.density==="compact","accordion--comfy":this.density==="comfy"})}
+        @ev-expand=${this.handlePanelToggle}
+        @slotchange=${this.handleSlotChange}
+      ></slot>
+    `}};t.styles=[i,m],a([n({type:Boolean})],t.prototype,"multiple",2),a([n({reflect:!0})],t.prototype,"density",2),a([n({reflect:!0})],t.prototype,"shape",2);export{t as a};

package/cdn/chunks/chunk.CMH4T3CX.js

@@ -0,0 +1 @@
+import{i as A}from"./chunk.PINNEFCM.js";var{I:d}=A,m=t=>t;var f=(t,i)=>i===void 0?(t==null?void 0:t._$litType$)!==void 0:(t==null?void 0:t._$litType$)===i;var T=t=>t.strings===void 0,c=()=>document.createComment(""),P=(t,i,e)=>{var n;let a=t._$AA.parentNode,l=i===void 0?t._$AB:i._$AA;if(e===void 0){let r=a.insertBefore(c(),l),$=a.insertBefore(c(),l);e=new d(r,$,t,t.options)}else{let r=e._$AB.nextSibling,$=e._$AM,_=$!==t;if(_){let s;(n=e._$AQ)==null||n.call(e,t),e._$AM=t,e._$AP!==void 0&&(s=t._$AU)!==$._$AU&&e._$AP(s)}if(r!==l||_){let s=e._$AA;for(;s!==r;){let p=m(s).nextSibling;m(a).insertBefore(s,l),s=p}}}return e},g=(t,i,e=t)=>(t._$AI(i,e),t),v={},y=(t,i=v)=>t._$AH=i,C=t=>t._$AH,M=t=>{t._$AR(),t._$AA.remove()};export{f as a,T as b,P as c,g as d,y as e,C as f,M as g};

package/cdn/chunks/chunk.CY33KN2K.js

@@ -0,0 +1,14 @@
+import{a as d}from"./chunk.AS5H5OFO.js";import{a as h}from"./chunk.MEKW2OXH.js";import{a as c}from"./chunk.NEUNERXI.js";import{a as n,d as s,g as p}from"./chunk.OGCRBJYC.js";import{a as m}from"./chunk.MXDME6T6.js";import{d as i}from"./chunk.PINNEFCM.js";import{e as r}from"./chunk.FI4IKBIW.js";var e=class extends p{constructor(){super(...arguments);this.localize=new h(this);this.separatorDir=this.localize.dir();this.label=""}getSeparator(){let t=this.separatorSlot.assignedElements({flatten:!0})[0].cloneNode(!0);return[t,...t.querySelectorAll("[id]")].forEach(o=>o.removeAttribute("id")),t.setAttribute("data-default",""),t.slot="separator",t}handleSlotChange(){let a=[...this.defaultSlot.assignedElements({flatten:!0})].filter(t=>t.tagName.toLowerCase()==="lynk-breadcrumb-item");a.forEach((t,o)=>{let l=t.querySelector('[slot="separator"]');l===null?t.append(this.getSeparator()):l.hasAttribute("data-default")&&l.replaceWith(this.getSeparator()),o===a.length-1?t.setAttribute("aria-current","page"):t.removeAttribute("aria-current")})}render(){return this.separatorDir!==this.localize.dir()&&(this.separatorDir=this.localize.dir(),this.updateComplete.then(()=>this.handleSlotChange())),i`
+      <nav part="base" class="breadcrumb" aria-label=${this.label}>
+        <slot @slotchange=${this.handleSlotChange}></slot>
+      </nav>
+
+      <span hidden aria-hidden="true">
+        <slot name="separator">
+          <lynk-icon
+            name=${this.localize.dir()==="rtl"?"chevron-left":"chevron-right"}
+            library="system"
+          ></lynk-icon>
+        </slot>
+      </span>
+    `}};e.styles=[m,d],e.dependencies={"lynk-icon":c},r([s("slot")],e.prototype,"defaultSlot",2),r([s('slot[name="separator"]')],e.prototype,"separatorSlot",2),r([n()],e.prototype,"label",2);export{e as a};

package/cdn/chunks/chunk.CYEIM4KM.js

@@ -0,0 +1,52 @@
+import{a as e}from"./chunk.PINNEFCM.js";var i=e`
+  :host {
+    display: contents;
+  }
+
+  .page {
+    width: 100%;
+    height: 100%;
+    display: grid;
+    grid-template:
+      'left-sidebar left-inset-sidebar header right-inset-sidebar right-sidebar' min-content
+      'left-sidebar left-inset-sidebar main right-inset-sidebar right-sidebar' 1fr
+      'left-sidebar footer footer footer right-sidebar' min-content
+      / auto auto 1fr auto auto;
+  }
+
+  .page__main {
+    grid-area: main;
+    display: block;
+    overflow: auto;
+  }
+
+  .page__header {
+    grid-area: header;
+    display: block;
+  }
+
+  .page__footer {
+    grid-area: footer;
+    display: block;
+  }
+
+  .page__left-sidebar {
+    grid-area: left-sidebar;
+    display: block;
+  }
+
+  .page__right-sidebar {
+    grid-area: right-sidebar;
+    display: block;
+  }
+
+  .page__left-inset-sidebar {
+    grid-area: left-inset-sidebar;
+    display: block;
+  }
+
+  .page__right-inset-sidebar {
+    grid-area: right-inset-sidebar;
+    display: block;
+  }
+`;export{i as a};

package/cdn/chunks/chunk.CZTW2WL3.js

@@ -0,0 +1,15 @@
+import{a as n}from"./chunk.2I363DWM.js";import{a as h}from"./chunk.YHSYTTFF.js";import{a as d}from"./chunk.YZSIY5HS.js";import{a as s}from"./chunk.7TAXE2HP.js";import{a as r,b as o,g as l}from"./chunk.OGCRBJYC.js";import{a}from"./chunk.MXDME6T6.js";import{d as i}from"./chunk.PINNEFCM.js";import{e}from"./chunk.FI4IKBIW.js";var t=class extends l{constructor(){super(...arguments);this.hasSlotController=new h(this,"heading");this.squished=!1;this.heading=""}connectedCallback(){super.connectedCallback(),this.setAttribute("role","group")}firstUpdated(){this.handleSquished()}handleSquished(){this.squished?this.setAttribute("squished",this.squished?"true":"false"):this.removeAttribute("squished")}render(){let u=this.hasSlotController.test("heading"),m=this.heading?!0:!!u;return i`
+      <div
+        id="heading"
+        part="base"
+        class=${s({"nav-group__heading":!0})}
+        aria-hidden=${m?"false":"true"}
+      >
+        <slot name="heading">${this.heading}</slot>
+      </div>
+
+      <slot
+        part="children"
+        class=${s({"nav-group":!0,"nav-group--squished":this.squished})}
+      ></slot>
+    `}};t.styles=[a,n],e([o()],t.prototype,"squished",2),e([r({reflect:!0})],t.prototype,"heading",2),e([d("squished",{waitUntilFirstUpdate:!0})],t.prototype,"handleSquished",1);export{t as a};

package/cdn/chunks/chunk.DDFV2WJ4.js

@@ -0,0 +1 @@
+import{a as e}from"./chunk.QDXWOTHF.js";import*as o from"react";import{createComponent as t}from"@lit/react";var a="lynk-box";e.define("lynk-box");var n=t({tagName:a,elementClass:e,react:o,events:{},displayName:"LynkBox"}),p=n;export{p as a};

package/cdn/chunks/chunk.DHOYZMI2.js

@@ -0,0 +1 @@
+import{a as e}from"./chunk.EM22DDSU.js";import*as t from"react";import{createComponent as a}from"@lit/react";var n="lynk-truncate";e.define("lynk-truncate");var r=a({tagName:n,elementClass:e,react:t,events:{},displayName:"LynkTruncate"}),c=r;export{c as a};

package/cdn/chunks/chunk.DMVQS5IA.js

@@ -0,0 +1,18 @@
+import{a as h}from"./chunk.ZYUF4UGA.js";import{a as m}from"./chunk.YZSIY5HS.js";import{a as t,b as s,g as a}from"./chunk.OGCRBJYC.js";import{a as o}from"./chunk.MXDME6T6.js";import{d as r}from"./chunk.PINNEFCM.js";import{e}from"./chunk.FI4IKBIW.js";var i=class extends a{constructor(){super(...arguments);this.hasError=!1;this.image="";this.label="";this.initials="";this.loading="eager";this.shape="circle"}handleImageChange(){this.hasError=!1}handleImageLoadError(){this.hasError=!0,this.emit("ev-error")}render(){let n=r`
+      <img
+        part="image"
+        class="image"
+        src="${this.image}"
+        loading="${this.loading}"
+        alt=${this.label}
+        @error="${this.handleImageLoadError}"
+      />
+    `,l=r``;return this.initials?l=r`<div part="initials" class="initials" role="img" aria-label=${this.label}>
+        ${this.initials}
+      </div>`:l=r`
+        <div part="icon" class="icon" role="img" aria-label=${this.label}>
+          <slot name="icon">
+            <lynk-icon name="person-fill" library="system"></lynk-icon>
+          </slot>
+        </div>
+      `,r` ${this.image&&!this.hasError?n:l} `}};i.styles=[o,h],e([s()],i.prototype,"hasError",2),e([t()],i.prototype,"image",2),e([t()],i.prototype,"label",2),e([t()],i.prototype,"initials",2),e([t()],i.prototype,"loading",2),e([t({reflect:!0})],i.prototype,"shape",2),e([m("image")],i.prototype,"handleImageChange",1);export{i as a};

package/cdn/chunks/chunk.DONZJPWU.js

@@ -0,0 +1,15 @@
+import{a as i}from"./chunk.PINNEFCM.js";var o=i`
+  :host {
+    display: inline-block;
+    width: 1em;
+    height: 1em;
+    box-sizing: content-box !important;
+  }
+
+  .icon,
+  svg {
+    display: block;
+    height: 100%;
+    width: 100%;
+  }
+`;export{o as a};

package/cdn/chunks/chunk.DOUKLFI3.js

@@ -0,0 +1 @@
+import{a as h}from"./chunk.MEKW2OXH.js";import{a as n,b as s,g as d}from"./chunk.OGCRBJYC.js";import{d as c}from"./chunk.PINNEFCM.js";import{e as i}from"./chunk.FI4IKBIW.js";var v=[{max:276e4,value:6e4,unit:"minute"},{max:72e6,value:36e5,unit:"hour"},{max:5184e5,value:864e5,unit:"day"},{max:24192e5,value:6048e5,unit:"week"},{max:28512e6,value:2592e6,unit:"month"},{max:1/0,value:31536e6,unit:"year"}],t=class extends d{constructor(){super(...arguments);this.localize=new h(this);this.isoTime="";this.relativeTime="";this.date=new Date;this.format="long";this.numeric="auto";this.sync=!1}disconnectedCallback(){super.disconnectedCallback(),clearTimeout(this.updateTimeout)}render(){let a=new Date,u=new Date(this.date);if(isNaN(u.getMilliseconds()))return this.relativeTime="",this.isoTime="","";let l=u.getTime()-a.getTime(),{unit:o,value:p}=v.find(e=>Math.abs(l)<e.max);if(this.isoTime=u.toISOString(),this.relativeTime=this.localize.relativeTime(Math.round(l/p),o,{numeric:this.numeric,style:this.format}),clearTimeout(this.updateTimeout),this.sync){let e;o==="minute"?e=r("second"):o==="hour"?e=r("minute"):o==="day"?e=r("hour"):e=r("day"),this.updateTimeout=window.setTimeout(()=>this.requestUpdate(),e)}return c` <time datetime=${this.isoTime}>${this.relativeTime}</time> `}};i([s()],t.prototype,"isoTime",2),i([s()],t.prototype,"relativeTime",2),i([n()],t.prototype,"date",2),i([n()],t.prototype,"format",2),i([n()],t.prototype,"numeric",2),i([n({type:Boolean})],t.prototype,"sync",2);function r(m){let a={second:1e3,minute:6e4,hour:36e5,day:864e5}[m];return a-Date.now()%a}export{t as a};

package/cdn/chunks/chunk.DTYCROSU.js

@@ -0,0 +1,34 @@
+import{a as T}from"./chunk.IZVUUAEO.js";import{a as S}from"./chunk.6S67HV2F.js";import{a as f}from"./chunk.FC4RDJJF.js";import{a as C}from"./chunk.MEKW2OXH.js";import{a as I}from"./chunk.TETFNMKN.js";import{a as m}from"./chunk.YZSIY5HS.js";import{a,d as x,g as w}from"./chunk.OGCRBJYC.js";import{a as E}from"./chunk.MXDME6T6.js";import{d as b}from"./chunk.PINNEFCM.js";import{e as r}from"./chunk.FI4IKBIW.js";var z=()=>null,n=class extends w{constructor(){super(...arguments);this.isCollapsed=!1;this.localize=new C(this);this.positionBeforeCollapsing=0;this.savedPosition=null;this.position=50;this.vertical=!1;this.disabled=!1;this.snapValue="";this.snapFunction=z;this.snapThreshold=12}toSnapFunction(t){let e=t.split(" ");return({pos:i,size:s,snapThreshold:o,isRtl:h,vertical:u})=>{let d=i,p=Number.POSITIVE_INFINITY;return e.forEach(l=>{let c;if(l.startsWith("repeat(")){let g=t.substring(7,t.length-1),N=g.endsWith("%"),y=Number.parseFloat(g),P=N?s*(y/100):y;c=Math.round((h&&!u?s-i:i)/P)*P}else l.endsWith("%")?c=s*(Number.parseFloat(l)/100):c=Number.parseFloat(l);h&&!u&&(c=s-c);let v=Math.abs(i-c);v<=o&&v<p&&(d=c,p=v)}),d}}set snap(t){this.snapValue=t!=null?t:"",t?this.snapFunction=typeof t=="string"?this.toSnapFunction(t):t:this.snapFunction=z}get snap(){return this.snapValue}connectedCallback(){super.connectedCallback(),this.loadPosition(),this.resizeObserver=new ResizeObserver(t=>this.handleResize(t)),this.mutationObserver=new MutationObserver(()=>this.handleVisibilityChange()),this.updateComplete.then(()=>{this.resizeObserver.observe(this),this.detectSize(),this.cachedPositionInPixels=this.percentageToPixels(this.position),this.setupAutoObservation(),setTimeout(()=>this.handleVisibilityChange(),0)})}disconnectedCallback(){var t,e;super.disconnectedCallback(),(t=this.resizeObserver)==null||t.unobserve(this),(e=this.mutationObserver)==null||e.disconnect()}detectSize(){let{width:t,height:e}=this.getBoundingClientRect();this.size=this.vertical?e:t}percentageToPixels(t){return this.size*(t/100)}pixelsToPercentage(t){return t/this.size*100}loadPosition(){if(this.autoSaveId&&typeof localStorage!="undefined")try{let t=localStorage.getItem(`lynk-split-panel-${this.autoSaveId}`);t&&!isNaN(Number(t))&&(this.position=Number(t))}catch(t){}}savePosition(){if(this.autoSaveId&&typeof localStorage!="undefined")try{localStorage.setItem(`lynk-split-panel-${this.autoSaveId}`,this.position.toString())}catch(t){}}setupAutoObservation(){var i,s;this.mutationObserver.observe(this,{childList:!0,subtree:!0,attributes:!0,attributeFilter:["hidden","style"]});let t=(i=this.shadowRoot)==null?void 0:i.querySelector('slot[name="start"]'),e=(s=this.shadowRoot)==null?void 0:s.querySelector('slot[name="end"]');t&&t.addEventListener("slotchange",()=>this.handleVisibilityChange()),e&&e.addEventListener("slotchange",()=>this.handleVisibilityChange())}handleVisibilityChange(){let t=this.getSlottedElements("start"),e=this.getSlottedElements("end"),i=t.some(o=>this.isElementVisible(o)),s=e.some(o=>this.isElementVisible(o));i&&s?this.savedPosition!==null&&(this.position=this.savedPosition,this.savedPosition=null):(i||s)&&this.savedPosition===null&&(this.savedPosition=this.position),this.requestUpdate()}getSlottedElements(t){var i;let e=(i=this.shadowRoot)==null?void 0:i.querySelector(`slot[name="${t}"]`);return e?e.assignedElements():[]}isElementVisible(t){if(t.hasAttribute("hidden"))return!1;let e=getComputedStyle(t);return e.display!=="none"&&e.visibility!=="hidden"}handleDrag(t){let e=this.localize.dir()==="rtl";this.disabled||(t.cancelable&&t.preventDefault(),S(this,{onMove:(i,s)=>{var h;let o=this.vertical?s:i;this.primary==="end"&&(o=this.size-o),o=(h=this.snapFunction({pos:o,size:this.size,snapThreshold:this.snapThreshold,isRtl:e,vertical:this.vertical}))!=null?h:o,this.position=f(this.pixelsToPercentage(o),0,100)},initialEvent:t}))}handleKeyDown(t){if(!this.disabled&&["ArrowLeft","ArrowRight","ArrowUp","ArrowDown","Home","End","Enter"].includes(t.key)){let e=this.position,i=(t.shiftKey?10:1)*(this.primary==="end"?-1:1);if(t.preventDefault(),(t.key==="ArrowLeft"&&!this.vertical||t.key==="ArrowUp"&&this.vertical)&&(e-=i),(t.key==="ArrowRight"&&!this.vertical||t.key==="ArrowDown"&&this.vertical)&&(e+=i),t.key==="Home"&&(e=this.primary==="end"?100:0),t.key==="End"&&(e=this.primary==="end"?0:100),t.key==="Enter")if(this.isCollapsed)e=this.positionBeforeCollapsing,this.isCollapsed=!1;else{let s=this.position;e=0,requestAnimationFrame(()=>{this.isCollapsed=!0,this.positionBeforeCollapsing=s})}this.position=f(e,0,100)}}handleResize(t){let{width:e,height:i}=t[0].contentRect;if(this.size=this.vertical?i:e,this.cachedPositionInPixels!==void 0&&(isNaN(this.cachedPositionInPixels)||this.position===1/0)){let s=this.getAttribute("position-in-pixels");s&&(this.cachedPositionInPixels=Number(s),this.positionInPixels=Number(s),this.position=this.pixelsToPercentage(this.positionInPixels))}this.primary&&this.cachedPositionInPixels!==void 0&&(this.position=this.pixelsToPercentage(this.cachedPositionInPixels))}handlePositionChange(){this.cachedPositionInPixels=this.percentageToPixels(this.position),this.isCollapsed=!1,this.positionBeforeCollapsing=0,this.positionInPixels=this.percentageToPixels(this.position),this.savePosition(),this.emit("ev-reposition")}handlePositionInPixelsChange(){this.position=this.pixelsToPercentage(this.positionInPixels)}handleVerticalChange(){this.detectSize()}render(){let t=this.getSlottedElements("start"),e=this.getSlottedElements("end"),i=t.some(l=>this.isElementVisible(l)),s=e.some(l=>this.isElementVisible(l));if(i&&!s||!i&&s)return this.style.display="block",this.style.gridTemplateColumns="",this.style.gridTemplateRows="",b`
+        <slot name="start" part="panel start" class="start" style="${i?"":"display: none"}"></slot>
+        <slot name="end" part="panel end" class="end" style="${s?"":"display: none"}"></slot>
+      `;this.style.display="grid";let o=this.vertical?"gridTemplateRows":"gridTemplateColumns",h=this.vertical?"gridTemplateColumns":"gridTemplateRows",u=this.localize.dir()==="rtl",d=`
+      clamp(
+        0%,
+        clamp(
+          var(--min),
+          ${this.position}% - var(--divider-width) / 2,
+          var(--max)
+        ),
+        calc(100% - var(--divider-width))
+      )
+    `,p="auto";return this.primary==="end"?u&&!this.vertical?this.style[o]=`${d} var(--divider-width) ${p}`:this.style[o]=`${p} var(--divider-width) ${d}`:u&&!this.vertical?this.style[o]=`${p} var(--divider-width) ${d}`:this.style[o]=`${d} var(--divider-width) ${p}`,this.style[h]="",b`
+      <slot name="start" part="panel start" class="start"></slot>
+
+      <div
+        part="divider"
+        class="divider"
+        tabindex=${I(this.disabled?void 0:"0")}
+        role="separator"
+        aria-valuenow=${this.position}
+        aria-valuemin="0"
+        aria-valuemax="100"
+        aria-label=${this.localize.term("resize")}
+        @keydown=${this.handleKeyDown}
+        @mousedown=${this.handleDrag}
+        @touchstart=${this.handleDrag}
+      >
+        <slot name="divider"></slot>
+      </div>
+
+      <slot name="end" part="panel end" class="end"></slot>
+    `}};n.styles=[E,T],r([x(".divider")],n.prototype,"divider",2),r([a({type:Number,reflect:!0})],n.prototype,"position",2),r([a({attribute:"position-in-pixels",type:Number})],n.prototype,"positionInPixels",2),r([a({type:Boolean,reflect:!0})],n.prototype,"vertical",2),r([a({type:Boolean,reflect:!0})],n.prototype,"disabled",2),r([a({attribute:"auto-save-id"})],n.prototype,"autoSaveId",2),r([a()],n.prototype,"primary",2),r([a({reflect:!0})],n.prototype,"snap",1),r([a({type:Number,attribute:"snap-threshold"})],n.prototype,"snapThreshold",2),r([m("position")],n.prototype,"handlePositionChange",1),r([m("positionInPixels")],n.prototype,"handlePositionInPixelsChange",1),r([m("vertical")],n.prototype,"handleVerticalChange",1);export{z as a,n as b};