@uplynk/lynk-design 1.19.1 → 1.19.2

package/cdn/chunks/chunk.R2ZEY3CJ.js

@@ -1,580 +0,0 @@
-import{a as o}from"./chunk.PINNEFCM.js";var n=o`
-  :host {
-    display: inline-block;
-    vertical-align: middle;
-    position: relative;
-    cursor: pointer;
-    line-height: initial;
-
-    /* Workaround because Chrome doesn't like :host(:has()) below
-     * https://issues.chromium.org/issues/40062355
-     * Firefox doesn't like this nested rule, so both are needed */
-    &:has(lynk-badge) {
-      position: relative;
-    }
-
-    --gap: var(--lynk-spacing-x-small);
-  }
-
-  /* Apply relative positioning only when needed to position wa-badge
-   * This avoids creating a new stacking context for every button */
-  :host(:has(lynk-badge)) {
-    position: relative;
-  }
-
-  :host([block]) {
-    display: block;
-    width: auto;
-  }
-
-  :host([color='default']) {
-    --lynk-color-fill-loud: transparent;
-    --lynk-color-fill-normal: var(--lynk-color-neutral-100);
-    --lynk-color-fill-quiet: var(--lynk-color-neutral-100);
-    --lynk-color-border-loud: var(--lynk-color-neutral-400);
-    --lynk-color-border-normal: var(--lynk-color-neutral-400);
-    --lynk-color-border-quiet: var(--lynk-color-neutral-400);
-    --lynk-color-on-loud: var(--lynk-color-neutral-900);
-    --lynk-color-on-normal: var(--lynk-color-neutral-900);
-    --lynk-color-on-quiet: var(--lynk-color-neutral-900);
-  }
-
-  .button {
-    display: inline-flex;
-    align-items: stretch;
-    justify-content: center;
-    width: 100%;
-    border-style: solid;
-    border-width: var(--lynk-button-border-width);
-    font-family: var(--lynk-button-font-family);
-    font-weight: var(--lynk-font-weight-bold);
-    text-decoration: none;
-    user-select: none;
-    -webkit-user-select: none;
-    white-space: nowrap;
-    vertical-align: middle;
-    padding: 0 1em;
-    transition:
-      var(--lynk-transition-x-fast) background-color,
-      var(--lynk-transition-x-fast) color,
-      var(--lynk-transition-x-fast) border,
-      var(--lynk-transition-x-fast) box-shadow;
-    cursor: inherit;
-    gap: var(--gap);
-
-    background-color: var(--lynk-color-fill-quiet);
-    border-color: var(--lynk-color-border-neutral);
-    color: var(--lynk-color-on-quiet);
-  }
-
-  /* Appearance modifiers */
-
-  :host([appearance~='outlined']) {
-    .button {
-      color: var(--lynk-color-on-quiet, var(--lynk-color-neutral-on-quiet));
-      background-color: transparent;
-      border-color: var(--lynk-color-border-normal, var(--lynk-color-neutral-border-normal));
-    }
-    @media (hover: hover) {
-      .button:not(.is-disabled):not(.is-thinking):hover {
-        /* On hover the button gains a fill-quiet background, so the label switches from on-quiet
-           (tuned for text on the page) to on-normal (tuned for text on a quiet fill) to keep
-           WCAG 4.5:1 contrast against the new background. See color-token audit, finding 2. */
-        color: var(--lynk-color-on-normal, var(--lynk-color-neutral-on-normal));
-        background-color: var(--lynk-color-fill-quiet, var(--lynk-color-neutral-fill-quiet));
-      }
-    }
-    .button:not(.is-disabled):not(.is-thinking):active {
-      color: var(--lynk-color-on-normal, var(--lynk-color-neutral-on-normal));
-      background-color: color-mix(
-        in oklab,
-        var(--lynk-color-fill-quiet, var(--lynk-color-neutral-fill-quiet)),
-        var(--lynk-color-mix-active)
-      );
-    }
-  }
-
-  :host([appearance~='plain']) {
-    .button {
-      color: var(--lynk-color-on-quiet, var(--lynk-color-neutral-on-quiet));
-      background-color: transparent;
-      border-color: transparent;
-    }
-
-    @media (hover: hover) {
-      .button:not(.is-disabled):not(.is-thinking):hover {
-        /* Same as outlined: the hover fill-quiet background means the label switches to on-normal
-           to hold WCAG 4.5:1 against it. */
-        color: var(--lynk-color-on-normal, var(--lynk-color-neutral-on-normal));
-        background-color: var(--lynk-color-fill-quiet, var(--lynk-color-neutral-fill-quiet));
-      }
-    }
-    .button:not(.is-disabled):not(.is-thinking):active {
-      color: var(--lynk-color-on-normal, var(--lynk-color-neutral-on-normal));
-      background-color: color-mix(
-        in oklab,
-        var(--lynk-color-fill-quiet, var(--lynk-color-neutral-fill-quiet)),
-        var(--lynk-color-mix-active)
-      );
-    }
-  }
-
-  :host([appearance~='filled']) {
-    .button {
-      color: var(--lynk-color-on-normal, var(--lynk-color-neutral-on-normal));
-      background-color: var(--lynk-color-fill-quiet, var(--lynk-color-neutral-fill-quiet));
-      border-color: transparent;
-    }
-    @media (hover: hover) {
-      .button:not(.is-disabled):not(.is-thinking):hover {
-        /* Step up a whole fill token (quiet -> normal) rather than only mixing, so the hover is a
-           clearly visible background change. The quiet fill is a near-white/near-black tint, where
-           a small color-mix barely moves — see color-token audit, finding 2. */
-        color: var(--lynk-color-on-normal, var(--lynk-color-neutral-on-normal));
-        background-color: var(--lynk-color-fill-normal, var(--lynk-color-neutral-fill-normal));
-      }
-    }
-    .button:not(.is-disabled):not(.is-thinking):active {
-      color: var(--lynk-color-on-normal, var(--lynk-color-neutral-on-normal));
-      background-color: color-mix(
-        in oklab,
-        var(--lynk-color-fill-normal, var(--lynk-color-neutral-fill-normal)),
-        var(--lynk-color-mix-active)
-      );
-    }
-  }
-
-  :host([appearance~='filled'][appearance~='outlined']) .button {
-    border-color: var(--lynk-color-border-normal, var(--lynk-color-neutral-border-normal));
-  }
-
-  :host([appearance~='loud']) {
-    .button {
-      color: var(--lynk-color-on-loud, var(--lynk-color-neutral-on-loud));
-      background-color: var(--lynk-color-fill-loud, var(--lynk-color-neutral-fill-loud));
-      border-color: transparent;
-    }
-    @media (hover: hover) {
-      .button:not(.is-disabled):not(.is-thinking):hover {
-        background-color: color-mix(
-          in oklab,
-          var(--lynk-color-fill-loud, var(--lynk-color-neutral-fill-loud)),
-          var(--lynk-color-mix-hover)
-        );
-      }
-    }
-    .button:not(.is-disabled):not(.is-thinking):active {
-      background-color: color-mix(
-        in oklab,
-        var(--lynk-color-fill-loud, var(--lynk-color-neutral-fill-loud)),
-        var(--lynk-color-mix-active)
-      );
-    }
-  }
-
-  :host([color='default']) {
-    .button {
-      color: var(--lynk-color-on-loud);
-      background-color: var(--lynk-color-neutral-0);
-      border-color: var(--lynk-color-border-normal);
-    }
-    @media (hover: hover) {
-      .button:not(.is-disabled):not(.is-thinking):hover {
-        color: var(--lynk-color-primary-900);
-        border-color: var(--lynk-color-primary);
-        background-color: color-mix(in oklab, var(--lynk-color-primary), var(--lynk-color-mix-loud-hover));
-      }
-    }
-    .button:not(.is-disabled):not(.is-thinking):active {
-      color: var(--lynk-color-primary-900);
-      border-color: var(--lynk-color-primary);
-      background-color: color-mix(in oklab, var(--lynk-color-primary), var(--lynk-color-mix-loud-active));
-    }
-  }
-
-  :host([appearance~='text']) {
-    .button {
-      color: var(--lynk-color-on-quiet);
-      background-color: transparent;
-      border-color: transparent;
-      font-family: inherit;
-      font-weight: inherit;
-      line-height: inherit;
-      min-height: auto !important;
-      padding: 0 !important;
-    }
-
-    @media (hover: hover) {
-      .button:not(.is-disabled):not(.is-thinking):hover {
-        color: color-mix(in oklab, var(--lynk-color-on-quiet), var(--lynk-color-mix-hover));
-        background-color: transparent;
-        border-color: transparent;
-      }
-    }
-    .button:not(.is-disabled):not(.is-thinking):active {
-      color: color-mix(in oklab, var(--lynk-color-on-quiet), var(--lynk-color-mix-active));
-      background-color: transparent;
-      border-color: transparent;
-    }
-  }
-
-  .button::-moz-focus-inner {
-    border: 0;
-  }
-
-  .button:focus {
-    outline: none;
-  }
-
-  .button:focus-visible {
-    outline: var(--lynk-focus-ring);
-    outline-offset: var(--lynk-focus-ring-offset);
-  }
-
-  .is-disabled {
-    opacity: 0.4;
-    cursor: not-allowed;
-  }
-
-  /* When disabled, prevent mouse events from bubbling up from children */
-  .is-disabled * {
-    pointer-events: none;
-  }
-
-  .button__prefix,
-  .button__suffix {
-    flex: 0 0 auto;
-    display: flex;
-    align-items: center;
-    pointer-events: none;
-  }
-
-  .button__label {
-    display: inline-block;
-  }
-
-  .button__label::slotted(lynk-icon) {
-    vertical-align: -2px;
-  }
-
-  /*
-   * Size modifiers
-   */
-
-  :host([size='tiny']) {
-    .button {
-      font-size: var(--lynk-button-font-size-small);
-      height: auto;
-      min-height: var(--lynk-button-height-tiny);
-      line-height: calc(var(--lynk-button-height-tiny) - var(--lynk-button-border-width) * 2);
-      border-radius: var(--lynk-button-border-radius-small);
-    }
-    .button .button__label::slotted(lynk-icon) {
-      font-size: var(--lynk-font-size-small);
-    }
-  }
-
-  :host([size='small']) {
-    .button {
-      font-size: var(--lynk-button-font-size-small);
-      min-height: var(--lynk-button-height-small);
-      height: auto;
-      line-height: calc(var(--lynk-button-height-small) - var(--lynk-button-border-width) * 2);
-      border-radius: var(--lynk-button-border-radius-small);
-    }
-    .button .button__label::slotted(lynk-icon) {
-      font-size: var(--lynk-font-size-medium);
-      vertical-align: -3px;
-    }
-  }
-
-  :host([size='medium']) {
-    .button {
-      font-size: var(--lynk-button-font-size-medium);
-      min-height: var(--lynk-button-height-medium);
-      height: auto;
-      line-height: calc(var(--lynk-button-height-medium) - var(--lynk-button-border-width) * 2);
-      border-radius: var(--lynk-button-border-radius-medium);
-    }
-    .button .button__label::slotted(lynk-icon) {
-      font-size: var(--lynk-font-size-base);
-      vertical-align: -3px;
-    }
-  }
-
-  :host([size='large']) {
-    .button {
-      font-size: var(--lynk-button-font-size-large);
-      min-height: var(--lynk-button-height-large);
-      height: auto;
-      line-height: calc(var(--lynk-button-height-large) - var(--lynk-button-border-width) * 2);
-      border-radius: var(--lynk-button-border-radius-large);
-    }
-    .button .button__label::slotted(lynk-icon) {
-      font-size: var(--lynk-font-size-large);
-      vertical-align: -4px;
-    }
-  }
-
-  /*
-   * Pill modifier
-   */
-
-  :host([pill]),
-  :host([circle]) {
-    .button {
-      border-radius: 3em;
-    }
-  }
-
-  /*
-   * Circle & Square modifiers for icon only buttons
-   */
-
-  :host([circle]),
-  :host([square]) {
-    .button {
-      padding-left: 0;
-      padding-right: 0;
-    }
-    .button__prefix,
-    .button__suffix,
-    .button__caret {
-      display: none;
-    }
-  }
-
-  :host([circle][size='tiny']),
-  :host([square][size='tiny']) {
-    .button {
-      width: var(--lynk-button-height-tiny);
-    }
-  }
-
-  :host([circle][size='small']),
-  :host([square][size='small']) {
-    .button {
-      width: var(--lynk-button-height-small);
-    }
-  }
-
-  :host([circle][size='medium']),
-  :host([square][size='medium']) {
-    .button {
-      width: var(--lynk-button-height-medium);
-    }
-  }
-
-  :host([circle][size='large']),
-  :host([square][size='large']) {
-    .button {
-      width: var(--lynk-button-height-large);
-    }
-  }
-
-  /*
-   * Caret modifier
-   */
-
-  .has-caret .button__suffix {
-    display: none;
-  }
-
-  .has-caret .button__caret {
-    height: auto;
-  }
-
-  .has-caret:not(.has-label) {
-    gap: 0;
-  }
-
-  /*
-   * thinking modifier
-   */
-
-  .is-thinking {
-    position: relative;
-    cursor: wait;
-  }
-
-  .is-thinking .button__prefix,
-  .is-thinking .button__label,
-  .is-thinking .button__suffix,
-  .is-thinking .button__caret {
-    visibility: hidden;
-  }
-
-  .is-thinking lynk-spinner {
-    --indicator-color: currentColor;
-    position: absolute;
-    font-size: 1em;
-    height: 1em;
-    width: 1em;
-    top: calc(50% - 0.5em);
-    left: calc(50% - 0.5em);
-  }
-
-  /*
-   * Badges
-   */
-
-  .button ::slotted(lynk-badge) {
-    position: absolute;
-    top: 0;
-    right: 0;
-    transform: translateY(-50%) translateX(50%);
-    pointer-events: none;
-  }
-
-  .button.rtl ::slotted(lynk-badge) {
-    right: auto;
-    left: 0;
-    transform: translateY(-50%) translateX(-50%);
-  }
-
-  /*
-    * Button groups support a variety of button types (e.g. buttons with tooltips, buttons as dropdown triggers, etc.).
-    * This means buttons aren't always direct descendants of the button group, thus we can't target them with the
-    * ::slotted selector. To work around this, the button group component does some magic to add these special classes to
-    * buttons and we style them here instead.
-    */
-
-  :host([color='default'][data-lynk-button-group__button--radio]) {
-    .button {
-      color: var(--lynk-color-neutral-900);
-    }
-    .button:not(.is-disabled):not(.is-thinking):hover,
-    .button:not(.is-disabled):not(.is-thinking).is-checked {
-      color: var(--lynk-color-primary-950);
-      border-color: var(--lynk-color-primary);
-      background-color: color-mix(in oklab, var(--lynk-color-primary), var(--lynk-color-mix-loud-hover));
-    }
-  }
-
-  :host([appearance~='plain'][data-lynk-button-group__button--radio]) {
-    .button {
-      color: var(--lynk-color-neutral-900);
-      border-color: transparent;
-    }
-
-    .button:not(.is-disabled):not(.is-thinking):hover,
-    .button:not(.is-disabled):not(.is-thinking).is-checked {
-      color: var(--lynk-color-on-normal);
-      background-color: var(--lynk-color-fill-quiet);
-    }
-
-    button:not(.is-disabled):not(.is-thinking).is-checked {
-      border-color: var(--lynk-color-border-normal);
-    }
-  }
-
-  :host([appearance~='outlined'][data-lynk-button-group__button--radio]) {
-    .button {
-      color: var(--lynk-color-neutral-900);
-      border-color: var(--lynk-color-neutral-400);
-    }
-    .button:not(.is-disabled):not(.is-thinking):hover,
-    .button:not(.is-disabled):not(.is-thinking).is-checked {
-      color: var(--lynk-color-on-normal);
-      border-color: var(--lynk-color-border-normal);
-      background-color: var(--lynk-color-fill-quiet);
-    }
-  }
-
-  :host([appearance~='filled'][data-lynk-button-group__button--radio]) {
-    .button {
-      color: var(--lynk-color-neutral-900);
-      background-color: var(--lynk-color-neutral-100);
-    }
-    .button:not(.is-disabled):not(.is-thinking):hover,
-    .button:not(.is-disabled):not(.is-thinking).is-checked {
-      color: var(--lynk-color-on-normal);
-      border-color: var(--lynk-color-border-normal);
-      background-color: var(--lynk-color-fill-quiet);
-    }
-  }
-
-  :host([appearance~='filled'][color='neutral'][data-lynk-button-group__button--radio]) {
-    .button:not(.is-disabled):not(.is-thinking):hover,
-    .button:not(.is-disabled):not(.is-thinking).is-checked {
-      color: var(--lynk-color-on-normal);
-      border-color: var(--lynk-color-border-loud);
-      background-color: var(--lynk-color-fill-normal);
-    }
-  }
-
-  :host([appearance~='filled'][appearance~='outlined'][color='neutral'][data-lynk-button-group__button--radio]) {
-    .button {
-      color: var(--lynk-color-neutral-900);
-      border-color: var(--lynk-color-neutral-400);
-    }
-
-    .button:not(.is-disabled):not(.is-thinking):hover,
-    .button:not(.is-disabled):not(.is-thinking).is-checked {
-      color: var(--lynk-color-on-normal);
-      border-color: var(--lynk-color-border-loud);
-      background-color: var(--lynk-color-fill-normal);
-    }
-  }
-
-  :host([appearance~='loud'][data-lynk-button-group__button--radio]) {
-    .button {
-      color: var(--lynk-color-neutral-900);
-      background-color: var(--lynk-color-neutral-100);
-    }
-    .button:not(.is-disabled):not(.is-thinking):hover,
-    .button:not(.is-disabled):not(.is-thinking).is-checked {
-      color: var(--lynk-color-on-loud);
-      background-color: var(--lynk-color-fill-loud);
-    }
-  }
-
-  :host([data-lynk-button-group__button--first]:not([data-lynk-button-group__button--last])) .button {
-    border-start-end-radius: 0;
-    border-end-end-radius: 0;
-  }
-
-  :host([data-lynk-button-group__button--inner]) .button {
-    border-radius: 0;
-  }
-
-  :host([data-lynk-button-group__button--last]:not([data-lynk-button-group__button--first])) .button {
-    border-start-start-radius: 0;
-    border-end-start-radius: 0;
-  }
-
-  /* All except the first */
-  :host([data-lynk-button-group__button]:not([data-lynk-button-group__button--first])) {
-    margin-inline-start: calc(-1 * var(--lynk-input-border-width));
-  }
-
-  /* Add a visual separator between solid buttons */
-  :host(
-      [data-lynk-button-group__button]:not(
-          [data-lynk-button-group__button--first],
-          [data-lynk-button-group__button--radio],
-          [color='default']
-        ):not(:hover)
-    )
-    .button:after {
-    content: '';
-    position: absolute;
-    top: 0;
-    inset-inline-start: 0;
-    bottom: 0;
-    border-left: solid 1px rgb(128 128 128 / 33%);
-    mix-blend-mode: multiply;
-  }
-
-  /* Bump hovered, focused, and checked buttons up so their focus ring isn't clipped */
-  :host([data-lynk-button-group__button--hover]),
-  :host([data-lynk-button-group__button]) .button:hover {
-    z-index: 1;
-  }
-
-  /* Focus and checked are always on top */
-  :host([data-lynk-button-group__button--focus]),
-  :host([data-lynk-button-group__button][checked]) {
-    z-index: 2;
-  }
-`;export{n as a};

package/cdn/chunks/chunk.RF6OU47D.js

@@ -1,75 +0,0 @@
-import{a as T}from"./chunk.PINBO3CI.js";import{e as b,f as M,g as A,h as $,m as P}from"./chunk.3TWYPRSH.js";import{a as v}from"./chunk.YZSIY5HS.js";import{a as d}from"./chunk.7TAXE2HP.js";import{a as c,b as g,d as S,g as f}from"./chunk.IIPZ6YZ6.js";import{a as _}from"./chunk.MXDME6T6.js";import{d as n}from"./chunk.PINNEFCM.js";import{a as h,b as u,e as o}from"./chunk.FI4IKBIW.js";var r=class extends f{constructor(){super(...arguments);this.timeSegment=null;this.value="";this.disabled=!1;this.format="locale";this.seconds=!1;this.minuteInterval=1;this.size="medium"}get showAmPm(){return this.format==="12h"?!0:this.format==="24h"?!1:this.isLocale12Hour()}get hour12(){if(!this.timeSegment)return 12;let e=this.timeSegment.hours;return e===0?12:e>12?e-12:e}get period(){return this.timeSegment?this.timeSegment.hours<12?"AM":"PM":null}connectedCallback(){super.connectedCallback(),this.parseValue()}isLocale12Hour(){var e;try{return(e=P.fromOptions({hour:"numeric"}).options.hour12)!=null?e:!1}catch(m){let s=new Date(2e3,0,1,13,0,0).toLocaleTimeString();return s.includes("PM")||s.includes("AM")}}parseValue(){var e;if(!this.value){this.timeSegment=null;return}if(b(this.value))this.timeSegment=M($(this.value));else{let m=this.value.match(/^(\d{1,2}):(\d{2})(?::(\d{2}))?\s*(AM|PM)?$/i);if(m){let i=parseInt(m[1]),s=parseInt(m[2]),t=parseInt(m[3])||0,l=(e=m[4])==null?void 0:e.toUpperCase();l&&(l==="AM"&&i===12?i=0:l==="PM"&&i!==12&&(i+=12)),this.timeSegment={hours:i,minutes:s,seconds:t,milliseconds:0}}}}formatValue(){if(!this.timeSegment)return"";let e=this.seconds?"HH:mm:ss":"HH:mm";return A(this.timeSegment,e)}updateValue(){this.timeSegment&&(this.value=this.formatValue(),this.emit("ev-change"))}handleHourClick(e){if(this.disabled)return;let m=this.timeSegment||{hours:0,minutes:0,seconds:0,milliseconds:0};if(this.showAmPm){let i=this.period,s=e;i==="AM"&&e===12?s=0:i==="PM"&&e!==12&&(s=e+12),this.timeSegment=u(h({},m),{hours:s})}else this.timeSegment=u(h({},m),{hours:e});this.updateValue(),this.scrollToSelected("hours")}handleMinuteClick(e){if(this.disabled)return;let m=this.timeSegment||{hours:0,minutes:0,seconds:0,milliseconds:0};this.timeSegment=u(h({},m),{minutes:e}),this.updateValue(),this.scrollToSelected("minutes")}handleSecondClick(e){if(this.disabled)return;let m=this.timeSegment||{hours:0,minutes:0,seconds:0,milliseconds:0};this.timeSegment=u(h({},m),{seconds:e}),this.updateValue(),this.scrollToSelected("seconds")}handlePeriodClick(e){if(this.disabled||!this.showAmPm)return;let m=this.timeSegment||{hours:0,minutes:0,seconds:0,milliseconds:0},i=this.timeSegment?this.hour12:12,s=i;e==="AM"&&i===12?s=0:e==="PM"&&i!==12&&(s=i+12),this.timeSegment=u(h({},m),{hours:s}),this.updateValue(),this.scrollToSelected("ampm")}scrollToSelected(e,m=!1){requestAnimationFrame(()=>{var t;let i,s;switch(e){case"hours":if(!this.timeSegment)return;i=this.showAmPm?this.hour12===12?0:this.hour12:this.timeSegment.hours,s=this.hoursColumn;break;case"minutes":if(!this.timeSegment)return;i=Math.floor(this.timeSegment.minutes/this.minuteInterval),s=this.minutesColumn;break;case"seconds":if(!this.timeSegment)return;i=this.timeSegment.seconds,s=this.secondsColumn;break;case"ampm":{if(!this.timeSegment)return;i=this.period==="PM"?1:0;let l=(t=this.shadowRoot)==null?void 0:t.querySelector(".clock__ampm-toggle");if(!l)return;s=l;break}}if(s){let a=i*38;s.scrollTo({top:a,behavior:m?"auto":"smooth"})}})}firstUpdated(){this.value&&this.scrollAllToSelected(!0)}scrollAllToSelected(e=!1){this.scrollToSelected("hours",e),this.scrollToSelected("minutes",e),this.seconds&&this.scrollToSelected("seconds",e),this.showAmPm&&this.scrollToSelected("ampm",e)}scrollToCurrentTime(e=!0){this.scrollAllToSelected(e)}handleValueChange(){this.parseValue()}render(){let e=this.showAmPm?[12,...Array.from({length:11},(t,l)=>l+1)]:Array.from({length:24},(t,l)=>l),m=Array.from({length:Math.ceil(60/this.minuteInterval)},(t,l)=>l*this.minuteInterval),i=Array.from({length:60},(t,l)=>l),s=["AM","PM"];return n`
-      <div
-        part="base"
-        class=${d({clock:!0,"clock--small":this.size==="small","clock--medium":this.size==="medium","clock--large":this.size==="large","clock--disabled":this.disabled})}
-      >
-        <div part="picker" class="clock__picker">
-          <div part="column" class="clock__column">
-            <ol class="clock__hours" role="listbox" tabindex="0" aria-label="Hours">
-              ${e.map(t=>n`
-                  <li
-                    part="time-item ${this.timeSegment&&(this.showAmPm?this.hour12===t:this.timeSegment.hours===t)?"time-item--selected":""}"
-                    class=${d({"clock__time-item":!0,"clock__time-item--selected":!!(this.timeSegment&&(this.showAmPm?this.hour12===t:this.timeSegment.hours===t))})}
-                    role="option"
-                    aria-selected=${this.timeSegment&&(this.showAmPm?this.hour12===t:this.timeSegment.hours===t)?"true":"false"}
-                    @click=${()=>this.handleHourClick(t)}
-                  >
-                    ${this.showAmPm?t:t.toString().padStart(2,"0")}
-                  </li>
-                `)}
-            </ol>
-          </div>
-
-          <div part="column" class="clock__column">
-            <ol class="clock__minutes" role="listbox" tabindex="0" aria-label="Minutes">
-              ${m.map(t=>{var l,a,p;return n`
-                  <li
-                    part="time-item ${((l=this.timeSegment)==null?void 0:l.minutes)===t?"time-item--selected":""}"
-                    class=${d({"clock__time-item":!0,"clock__time-item--selected":((a=this.timeSegment)==null?void 0:a.minutes)===t})}
-                    role="option"
-                    aria-selected=${((p=this.timeSegment)==null?void 0:p.minutes)===t?"true":"false"}
-                    @click=${()=>this.handleMinuteClick(t)}
-                  >
-                    ${t.toString().padStart(2,"0")}
-                  </li>
-                `})}
-            </ol>
-          </div>
-
-          ${this.seconds?n`
-                  <div part="column" class="clock__column">
-                    <ol class="clock__seconds" role="listbox" tabindex="0" aria-label="Seconds">
-                      ${i.map(t=>{var l,a,p;return n`
-                          <li
-                            part="time-item ${((l=this.timeSegment)==null?void 0:l.seconds)===t?"time-item--selected":""}"
-                            class=${d({"clock__time-item":!0,"clock__time-item--selected":((a=this.timeSegment)==null?void 0:a.seconds)===t})}
-                            role="option"
-                            aria-selected=${((p=this.timeSegment)==null?void 0:p.seconds)===t?"true":"false"}
-                            @click=${()=>this.handleSecondClick(t)}
-                          >
-                            ${t.toString().padStart(2,"0")}
-                          </li>
-                        `})}
-                    </ol>
-                  </div>
-                `:""}
-          ${this.showAmPm?n`
-                  <div part="column" class="clock__column clock__column--ampm">
-                    <ol part="ampm-toggle" class="clock__ampm-toggle" role="listbox" tabindex="0" aria-label="AM/PM">
-                      ${s.map(t=>n`
-                          <li
-                            class=${d({"clock__time-item":!0,"clock__time-item--selected":!!(this.timeSegment&&this.period===t)})}
-                            role="option"
-                            aria-selected=${this.timeSegment&&this.period===t?"true":"false"}
-                            @click=${()=>this.handlePeriodClick(t)}
-                            ?disabled=${this.disabled}
-                          >
-                            ${t}
-                          </li>
-                        `)}
-                    </ol>
-                  </div>
-                `:""}
-        </div>
-      </div>
-    `}};r.styles=[_,T],o([g()],r.prototype,"timeSegment",2),o([S(".clock__hours")],r.prototype,"hoursColumn",2),o([S(".clock__minutes")],r.prototype,"minutesColumn",2),o([S(".clock__seconds")],r.prototype,"secondsColumn",2),o([c()],r.prototype,"value",2),o([c({type:Boolean,reflect:!0})],r.prototype,"disabled",2),o([c({reflect:!0})],r.prototype,"format",2),o([c({type:Boolean})],r.prototype,"seconds",2),o([c({type:Number,attribute:"minute-interval"})],r.prototype,"minuteInterval",2),o([c({reflect:!0})],r.prototype,"size",2),o([v("value",{waitUntilFirstUpdate:!0})],r.prototype,"handleValueChange",1);export{r as a};

package/cdn/chunks/chunk.RFM6R5VH.js

@@ -1 +0,0 @@
-import{a as e}from"./chunk.DU3U4WZU.js";import*as n from"react";import{createComponent as t}from"@lit/react";import"@lit/react";var v="lynk-range";e.define("lynk-range");var s=t({tagName:v,elementClass:e,react:n,events:{EvBlur:"ev-blur",EvChange:"ev-change",EvFocus:"ev-focus",EvInput:"ev-input",EvInvalid:"ev-invalid"},displayName:"LynkRange"}),p=s;export{p as a};

package/cdn/chunks/chunk.RHZFUVBQ.js

@@ -1 +0,0 @@
-import{a as e}from"./chunk.6UNLFEBC.js";import*as t from"react";import{createComponent as n}from"@lit/react";import"@lit/react";var a="lynk-animation";e.define("lynk-animation");var s=n({tagName:a,elementClass:e,react:t,events:{EvCancel:"ev-cancel",EvFinish:"ev-finish",EvStart:"ev-start"},displayName:"LynkAnimation"}),m=s;export{m as a};

package/cdn/chunks/chunk.RL3L2577.js

@@ -1 +0,0 @@
-import{a as e}from"./chunk.LUJRD4U3.js";import*as t from"react";import{createComponent as n}from"@lit/react";import"@lit/react";var m="lynk-menu-item";e.define("lynk-menu-item");var o=n({tagName:m,elementClass:e,react:t,events:{EvClick:"ev-click"},displayName:"LynkMenuItem"}),i=o;export{i as a};

package/cdn/chunks/chunk.RNFNKLGW.js

@@ -1 +0,0 @@
-import{a as e}from"./chunk.N4LCO4BK.js";import*as t from"react";import{createComponent as n}from"@lit/react";import"@lit/react";var o="lynk-icon-button";e.define("lynk-icon-button");var s=n({tagName:o,elementClass:e,react:t,events:{EvBlur:"ev-blur",EvClick:"ev-click",EvFocus:"ev-focus"},displayName:"LynkIconButton"}),p=s;export{p as a};

package/cdn/chunks/chunk.RONCI56O.js

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