@clevercloud/components - npm Package Compare versions

Comparing version 14.1.1 to 15.0.0

dist/cc-button.js

@@ -1,2 +0,2 @@
-import"./cc-icon.js";import{LitElement as e,html as t,css as i}from"lit";import{classMap as o}from"lit/directives/class-map.js";import{ifDefined as r}from"lit/directives/if-defined.js";import{dispatchCustomEvent as n}from"./lib/events.js";import{i18n as s}from"./i18n.js";import{skeletonStyles as a}from"./styles/skeleton.js";import{linkStyles as l}from"./templates/cc-link/cc-link.js";class c extends e{static get properties(){return{a11yExpanded:{type:Boolean,attribute:"a11y-expanded",reflect:!0},a11yName:{type:String,attribute:"a11y-name"},a11yPressed:{type:Boolean,attribute:"a11y-pressed",reflect:!0},circle:{type:Boolean},danger:{type:Boolean},delay:{type:Number},disabled:{type:Boolean,reflect:!0},hideText:{type:Boolean,attribute:"hide-text"},icon:{type:Object},image:{type:String},link:{type:Boolean,reflect:!0},outlined:{type:Boolean},primary:{type:Boolean},skeleton:{type:Boolean},success:{type:Boolean},waiting:{type:Boolean,reflect:!0},warning:{type:Boolean},_cancelMode:{type:Boolean,state:!0}}}constructor(){super(),this.a11yExpanded=null,this.a11yName=null,this.a11yPressed=null,this.circle=!1,this.danger=!1,this.delay=null,this.disabled=!1,this.link=!1,this.hideText=!1,this.icon=null,this.image=null,this.outlined=!1,this.primary=!1,this.skeleton=!1,this.success=!1,this.waiting=!1,this.warning=!1,this._cancelMode=!1}focus(){this.shadowRoot.querySelector("button").focus()}_cancelClick(){clearTimeout(this._timeoutId),this._cancelMode=!1}_getAriaLabel(){return null!=this.a11yName?this.a11yName.trim()??"":!this.hideText||null==this.image&&null==this.icon?void 0:this.textContent?.trim()??""}_getTitle(){return null!=this.a11yName?this.a11yName.trim()??"":!this.hideText||null==this.image&&null==this.icon?void 0:this.textContent.trim()??""}_onClick(e){if(e.stopPropagation(),!(this.disabled||this.skeleton||this.waiting))return null==this.delay||0===this.delay||this.link?n(this,"click"):void(this._cancelMode?this._cancelClick():(this._cancelMode=!0,this._timeoutId=setTimeout((()=>{n(this,"click"),this._cancelMode=!1}),1e3*this.delay)))}willUpdate(e){e.has("disabled")&&!0===this.disabled&&this._cancelClick()}render(){const e={primary:this.primary&&!this.success&&!this.warning&&!this.danger&&!this.link,success:!this.primary&&this.success&&!this.warning&&!this.danger&&!this.link,warning:!this.primary&&!this.success&&this.warning&&!this.danger&&!this.link,danger:!this.primary&&!this.success&&!this.warning&&this.danger&&!this.link,skeleton:this.skeleton,"img-only":(null!=this.image||null!=this.icon)&&this.hideText,"txt-only":null==this.image&&null==this.icon,btn:!this.link,"cc-link":this.link},i=null==this.delay||this.link?null:this.delay,n=this.waiting;e.simple=!(e.primary||e.success||e.warning||e.danger||this.link),e.outlined=(this.outlined||e.simple)&&!this.link,e.circle=this.circle&&this.hideText&&(this.image||this.icon);const a=this.skeleton?-1:null;return t`<button type=button tabindex=${r(a)} class=${o(e)} aria-disabled=${this.disabled||this.skeleton||this.waiting} @click=${this._onClick} title=${r(this._getTitle())} aria-label=${r(this._getAriaLabel())} aria-expanded=${r(this.a11yExpanded??void 0)} aria-pressed=${r(this.a11yPressed??void 0)}><div class="${o({"cancel-mode":this._cancelMode})} text-wrapper">${null!=this.image?t`<img src=${this.image} alt="">`:""} ${null!=this.icon?t`<cc-icon .icon=${this.icon}></cc-icon>`:""}<div class=text-normal><slot></slot></div>${null!=i?t`<div class=text-cancel>${s("cc-button.cancel")}</div>`:""}</div>${null!=i?t`<progress class="${o({active:this._cancelMode})} delay" style=--delay:${i}s></progress>`:""} ${n&&!e.circle?t`<progress class=waiting></progress>`:""} ${n&&e.circle?t`<svg class=circle-loader viewBox="25 25 50 50" stroke-width=4 aria-hidden=true><circle fill=none cx=50 cy=50 r=15 /></svg>`:""}</button>`}static get styles(){return[a,l,i`:host{display:inline-block;box-sizing:border-box;vertical-align:middle}button{display:block;padding:0;border:none;margin:0;background:unset;font-family:inherit;font-size:unset}.btn{position:relative;overflow:hidden;width:100%;min-height:2em;padding:0 .5em;border:1px solid #000;background-color:var(--cc-color-bg-default,#fff);border-radius:var(--cc-button-border-radius,.15em);cursor:pointer;font-weight:var(--cc-button-font-weight,bold);text-transform:var(--cc-button-text-transform,uppercase);-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none;user-select:none;border-color:var(--btn-color);background-color:var(--btn-color);color:var(--cc-color-text-inverted);box-shadow:0 0 0 0 rgb(255 255 255 / 0%);transition:box-shadow 75ms ease-in-out}.primary{--btn-color:var(--cc-color-bg-primary)}.success{--btn-color:var(--cc-color-bg-success)}.warning{--btn-color:var(--cc-color-bg-warning)}.danger{--btn-color:var(--cc-color-bg-danger)}.outlined{background-color:var(--cc-color-bg-default,#fff);color:var(--btn-color)}.circle{border-radius:50%}.simple{--btn-color:var(--cc-color-text-primary-strongest);border-color:var(--color-grey-medium)}.img-only{width:1.75em;height:1.75em;min-height:0;padding:0}.btn:focus{outline:var(--cc-focus-outline,#000 solid 2px);outline-offset:var(--cc-focus-outline-offset,2px)}.btn:not([aria-disabled=true]):hover{box-shadow:0 1px 3px rgb(0 0 0 / 40%)}.btn:not([aria-disabled=true]):active{box-shadow:none;outline:0}button[aria-disabled=true]{cursor:inherit;opacity:.5}.skeleton{border-color:#777;background-color:#bbb;color:transparent}.skeleton cc-icon,.skeleton img{visibility:hidden}.text-wrapper{display:grid;width:100%;height:100%;align-items:center;justify-content:center;gap:.5em;grid-template-columns:min-content 1fr}.txt-only .text-wrapper{gap:0;grid-template-columns:auto}.img-only .text-wrapper{gap:0;grid-template-columns:min-content}img{display:block;width:1.25em;height:1.25em}.img-only .text-normal{display:none}.text-cancel,.text-normal,cc-icon,img{grid-row:1/2}.text-cancel,.text-normal{font-size:.85em}cc-icon,img{grid-column:1/2}.text-normal{grid-column:-1/-2}.text-cancel{grid-column:1/-1}.text-wrapper.cancel-mode .text-normal,.text-wrapper.cancel-mode cc-icon,.text-wrapper.cancel-mode img,.text-wrapper:not(.cancel-mode) .text-cancel{visibility:hidden}progress,progress::-webkit-progress-bar{background-color:#fff}.outlined progress,.outlined progress::-webkit-progress-bar{background-color:var(--btn-color)}.cc-link progress,.cc-link progress::-webkit-progress-bar{background-color:var(--cc-color-bg-strong)}progress::-moz-progress-bar,progress::-webkit-progress-value{background-color:transparent}progress.delay{position:absolute;bottom:0;left:0;width:0;height:.2em;border:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}progress.delay.active{width:100%;transition:width var(--delay) linear}@keyframes waiting{from{left:-52%}to{left:52%}}progress.waiting{--width:25%;position:absolute;bottom:0;width:var(--width);height:.2em;border:none;margin-left:calc(50% - calc(var(--width)/ 2));animation:1s ease-in-out infinite alternate waiting;-webkit-appearance:none;-moz-appearance:none;appearance:none}@keyframes rotate{100%{transform:rotate(360deg)}}@keyframes stretch{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:90,200;stroke-dashoffset:-35px}100%{stroke-dashoffset:-124px}}:host([waiting]) button.circle{opacity:1}:host([waiting]) button.circle .text-wrapper cc-icon,:host([waiting]) button.circle .text-wrapper img{opacity:.25}.circle-loader{--bcw-speed:2s;position:absolute;animation:rotate var(--bcw-speed) linear infinite;inset:0;transform-origin:center;vertical-align:middle}.circle-loader circle{animation:stretch calc(var(--bcw-speed) * .75) ease-in-out infinite;stroke:currentcolor;stroke-dasharray:1,200;stroke-dashoffset:0;stroke-linecap:round}button::-moz-focus-inner{border:0}.cc-link{--btn-color:var(--color-text-strong);position:relative;overflow:hidden;min-height:2em;cursor:pointer;text-decoration:underline}.cc-link .text-normal{font-size:1em}.cc-link.skeleton:hover{color:transparent}`]}}window.customElements.define("cc-button",c);export{c as CcButton};
+import"./cc-icon.js";import{LitElement as e,html as t,css as i}from"lit";import{classMap as r}from"lit/directives/class-map.js";import{ifDefined as o}from"lit/directives/if-defined.js";import{dispatchCustomEvent as n}from"./lib/events.js";import{i18n as s}from"./i18n.js";import{skeletonStyles as a}from"./styles/skeleton.js";import{linkStyles as l}from"./templates/cc-link/cc-link.js";class c extends e{static get properties(){return{a11yExpanded:{type:Boolean,attribute:"a11y-expanded",reflect:!0},a11yName:{type:String,attribute:"a11y-name"},a11yPressed:{type:Boolean,attribute:"a11y-pressed",reflect:!0},circle:{type:Boolean},danger:{type:Boolean},delay:{type:Number},disabled:{type:Boolean,reflect:!0},hideText:{type:Boolean,attribute:"hide-text"},icon:{type:Object},image:{type:String},link:{type:Boolean,reflect:!0},outlined:{type:Boolean},primary:{type:Boolean},skeleton:{type:Boolean},success:{type:Boolean},type:{type:String},waiting:{type:Boolean,reflect:!0},warning:{type:Boolean},_cancelMode:{type:Boolean,state:!0}}}static get formAssociated(){return!0}constructor(){super(),this.a11yExpanded=null,this.a11yName=null,this.a11yPressed=null,this.circle=!1,this.danger=!1,this.delay=null,this.disabled=!1,this.link=!1,this.hideText=!1,this.icon=null,this.image=null,this.outlined=!1,this.primary=!1,this.skeleton=!1,this.success=!1,this.type="button",this.waiting=!1,this.warning=!1,this._cancelMode=!1,this._internals=this.attachInternals()}focus(){this.shadowRoot.querySelector("button").focus()}_cancelClick(){clearTimeout(this._timeoutId),this._cancelMode=!1}_getAriaLabel(){return null!=this.a11yName?this.a11yName.trim()??"":!this.hideText||null==this.image&&null==this.icon?void 0:this.textContent?.trim()??""}_getTitle(){return null!=this.a11yName?this.a11yName.trim()??"":!this.hideText||null==this.image&&null==this.icon?void 0:this.textContent.trim()??""}_onClick(e){if(e.stopPropagation(),!(this.disabled||this.skeleton||this.waiting))return null==this.delay||0===this.delay||this.link?("submit"===this.type&&this._internals.form?.requestSubmit(),"reset"===this.type&&this._internals.form?.reset(),void n(this,"click")):void(this._cancelMode?this._cancelClick():(this._cancelMode=!0,this._timeoutId=setTimeout((()=>{"submit"===this.type&&this._internals.form?.requestSubmit(),"reset"===this.type&&this._internals.form?.reset(),n(this,"click"),this._cancelMode=!1}),1e3*this.delay)))}willUpdate(e){e.has("disabled")&&!0===this.disabled&&this._cancelClick()}render(){const e=null==this.delay||this.link?null:this.delay,i=this.waiting,n=this.primary&&!this.success&&!this.warning&&!this.danger&&!this.link,a=!this.primary&&this.success&&!this.warning&&!this.danger&&!this.link,l=!this.primary&&!this.success&&this.warning&&!this.danger&&!this.link,c=!this.primary&&!this.success&&!this.warning&&this.danger&&!this.link,d=!(n||a||l||c||this.link),h=null!=this.image||null!=this.icon,p={primary:n,success:a,warning:l,danger:c,simple:d,outlined:(this.outlined||d)&&!this.link,skeleton:this.skeleton,"img-only":h&&this.hideText,"txt-only":!h,btn:!this.link,"cc-link":this.link,circle:this.circle&&this.hideText&&h},m=this.skeleton?-1:null;return t`<button type=${this.type} tabindex=${o(m)} class=${r(p)} aria-disabled=${this.disabled||this.skeleton||this.waiting} @click=${this._onClick} title=${o(this._getTitle())} aria-label=${o(this._getAriaLabel())} aria-expanded=${o(this.a11yExpanded??void 0)} aria-pressed=${o(this.a11yPressed??void 0)}><div class="${r({"cancel-mode":this._cancelMode})} text-wrapper">${null!=this.image?t`<img src=${this.image} alt="">`:""} ${null!=this.icon?t`<cc-icon .icon=${this.icon}></cc-icon>`:""}<div class=text-normal><slot></slot></div>${null!=e?t`<div class=text-cancel>${s("cc-button.cancel")}</div>`:""}</div>${null!=e?t`<progress class="${r({active:this._cancelMode})} delay" style=--delay:${e}s></progress>`:""} ${i&&!p.circle?t`<progress class=waiting></progress>`:""} ${i&&p.circle?t`<svg class=circle-loader viewBox="25 25 50 50" stroke-width=4 aria-hidden=true><circle fill=none cx=50 cy=50 r=15 /></svg>`:""}</button>`}static get styles(){return[a,l,i`:host{display:inline-block;box-sizing:border-box;vertical-align:middle}button{display:block;padding:0;border:none;margin:0;background:unset;font-family:inherit;font-size:unset}.btn{position:relative;overflow:hidden;width:100%;min-height:2em;padding:0 .5em;border:1px solid #000;background-color:var(--cc-color-bg-default,#fff);border-radius:var(--cc-button-border-radius,.15em);cursor:pointer;font-weight:var(--cc-button-font-weight,bold);text-transform:var(--cc-button-text-transform,uppercase);-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none;user-select:none;border-color:var(--btn-color);background-color:var(--btn-color);color:var(--cc-color-text-inverted);box-shadow:0 0 0 0 rgb(255 255 255 / 0%);transition:box-shadow 75ms ease-in-out}.primary{--btn-color:var(--cc-color-bg-primary)}.success{--btn-color:var(--cc-color-bg-success)}.warning{--btn-color:var(--cc-color-bg-warning)}.danger{--btn-color:var(--cc-color-bg-danger)}.outlined{background-color:var(--cc-color-bg-default,#fff);color:var(--btn-color)}.circle{border-radius:50%}.simple{--btn-color:var(--cc-color-text-primary-strongest);border-color:var(--color-grey-medium)}.img-only{width:1.75em;height:1.75em;min-height:0;padding:0}.btn:focus{outline:var(--cc-focus-outline,#000 solid 2px);outline-offset:var(--cc-focus-outline-offset,2px)}.btn:not([aria-disabled=true]):hover{box-shadow:0 1px 3px rgb(0 0 0 / 40%)}.btn:not([aria-disabled=true]):active{box-shadow:none;outline:0}button[aria-disabled=true]{cursor:inherit;opacity:.5}.skeleton{border-color:#777;background-color:#bbb;color:transparent}.skeleton cc-icon,.skeleton img{visibility:hidden}.text-wrapper{display:grid;width:100%;height:100%;align-items:center;justify-content:center;gap:.5em;grid-template-columns:min-content 1fr}.txt-only .text-wrapper{gap:0;grid-template-columns:auto}.img-only .text-wrapper{gap:0;grid-template-columns:min-content}img{display:block;width:1.25em;height:1.25em}.img-only .text-normal{display:none}.text-cancel,.text-normal,cc-icon,img{grid-row:1/2}.text-cancel,.text-normal{font-size:.85em}cc-icon,img{grid-column:1/2}.text-normal{grid-column:-1/-2}.text-cancel{grid-column:1/-1}.text-wrapper.cancel-mode .text-normal,.text-wrapper.cancel-mode cc-icon,.text-wrapper.cancel-mode img,.text-wrapper:not(.cancel-mode) .text-cancel{visibility:hidden}progress,progress::-webkit-progress-bar{background-color:#fff}.outlined progress,.outlined progress::-webkit-progress-bar{background-color:var(--btn-color)}.cc-link progress,.cc-link progress::-webkit-progress-bar{background-color:var(--cc-color-bg-strong)}progress::-moz-progress-bar,progress::-webkit-progress-value{background-color:transparent}progress.delay{position:absolute;bottom:0;left:0;width:0;height:.2em;border:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}progress.delay.active{width:100%;transition:width var(--delay) linear}@keyframes waiting{from{left:-52%}to{left:52%}}progress.waiting{--width:25%;position:absolute;bottom:0;width:var(--width);height:.2em;border:none;margin-left:calc(50% - calc(var(--width)/ 2));animation:1s ease-in-out infinite alternate waiting;-webkit-appearance:none;-moz-appearance:none;appearance:none}@keyframes rotate{100%{transform:rotate(360deg)}}@keyframes stretch{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:90,200;stroke-dashoffset:-35px}100%{stroke-dashoffset:-124px}}:host([waiting]) button.circle{opacity:1}:host([waiting]) button.circle .text-wrapper cc-icon,:host([waiting]) button.circle .text-wrapper img{opacity:.25}.circle-loader{--bcw-speed:2s;position:absolute;animation:rotate var(--bcw-speed) linear infinite;inset:0;transform-origin:center;vertical-align:middle}.circle-loader circle{animation:stretch calc(var(--bcw-speed) * .75) ease-in-out infinite;stroke:currentcolor;stroke-dasharray:1,200;stroke-dashoffset:0;stroke-linecap:round}button::-moz-focus-inner{border:0}.cc-link{--btn-color:var(--color-text-strong);position:relative;overflow:hidden;min-height:2em;cursor:pointer;text-decoration:underline}.cc-link .text-normal{font-size:1em}.cc-link.skeleton:hover{color:transparent}`]}}window.customElements.define("cc-button",c);export{c as CcButton};
 //# sourceMappingURL=cc-button.js.map

dist/cc-email-list.js

@@ -1,2 +0,2 @@
-import{LitElement as e,html as s,css as i}from"lit";import{classMap as r}from"lit/directives/class-map.js";import{createRef as t,ref as a}from"lit/directives/ref.js";import{iconCleverMailStarLine as d,iconCleverMailLine as c}from"./assets/cc-clever.icons.js";import{iconRemixDeleteBinFill as o,iconRemixCheckboxCircleFill as n,iconRemixSpam_2Fill as l}from"./assets/cc-remix.icons.js";import{LostFocusController as m}from"./controllers/lost-focus-controller.js";import{validateEmailAddress as p}from"./lib/email.js";import{dispatchCustomEvent as u}from"./lib/events.js";import{fakeString as y}from"./lib/fake-strings.js";import{i18n as f}from"./i18n.js";import{sortBy as $}from"./lib/utils.js";import{skeletonStyles as b}from"./styles/skeleton.js";import"./cc-badge.js";import"./cc-block.js";import"./cc-block-section.js";import"./cc-button.js";import"./cc-icon.js";import"./cc-input-text.js";import"./cc-notice.js";const g={state:"idle",address:y(35),verified:!1},h=[];class v extends e{static get properties(){return{addEmailForm:{type:Object},emails:{type:Object}}}static get ADD_FORM_INIT_STATE(){return{state:"idle",address:{value:""}}}constructor(){super(),this.addEmailForm=v.ADD_FORM_INIT_STATE,this.emails={state:"loading"},this._addressInputRef=t(),new m(this,".secondary",(({suggestedElement:e})=>{null!=e?e.querySelector(".delete-button").focus():this._focusAddressInput()}))}_getVerifiedTagLabel(e){const i=f(e?"cc-email-list.primary.email.verified":"cc-email-list.primary.email.unverified");return s`<span>${i}</span>`}_focusAddressInput(){this._addressInputRef.value.focus()}_onSendConfirmationEmail(){u(this,"send-confirmation-email",this.emails.value.primaryAddress.address)}_onDelete(e){u(this,"delete",e)}_onMarkAsPrimary(e){u(this,"mark-as-primary",e)}_onAddressInput({detail:e}){this.addEmailForm={state:"idle",address:{value:e,error:this.addEmailForm.address.error}}}_onAdd(){const e=this.addEmailForm.address.value.trim();this.addEmailForm={state:"idle",address:{value:e,error:p(e)}},null==this.addEmailForm.address.error&&u(this,"add",e)}updated(e){e.has("addEmailForm")&&null!=this.addEmailForm?.address?.error&&setTimeout((()=>this._focusAddressInput()),0)}render(){const e=this.emails.state;return s`<cc-block><div slot=title>${f("cc-email-list.title")}</div>${"loading"===e?s`${this._renderPrimarySection(g,!0)} ${this._renderSecondarySection(h)}`:""} ${"loaded"===e?s`${this._renderPrimarySection(this.emails.value.primaryAddress)} ${this._renderSecondarySection(this.emails.value.secondaryAddresses)}`:""} ${"error"===e?s`<cc-notice intent=warning message=${f("cc-email-list.loading.error")}></cc-notice>`:""}</cc-block>`}_renderPrimarySection(e,i=!1){const t=e.address,a=e.verified,c=!i&&!a,o=a?"success":"danger",m=a?n:l;return s`<cc-block-section><div slot=title>${f("cc-email-list.primary.title")}</div><div slot=info>${f("cc-email-list.primary.description")}</div><div class="address-line primary"><div class=address><cc-icon class=icon--auto .icon=${d} size=lg></cc-icon><span class=${r({skeleton:i})}>${t}</span></div><cc-badge intent=${o} weight=outlined ?skeleton=${i} .icon=${m}>${this._getVerifiedTagLabel(e.verified)}</cc-badge></div>${c?s`<cc-button @cc-button:click=${this._onSendConfirmationEmail} ?waiting=${"sending-confirmation-email"===e.state} link>${f("cc-email-list.primary.action.resend-confirmation-email")}</cc-button>`:""}</cc-block-section>`}_renderSecondarySection(e){const i=[...e].sort($("address")),t=i.some((e=>"marking-as-primary"===e.state));return s`<cc-block-section><div slot=title>${f("cc-email-list.secondary.title")}</div><div slot=info>${f("cc-email-list.secondary.description")}</div><ul class=secondary-addresses>${i.map((e=>{const i="marking-as-primary"===e.state||"deleting"===e.state;return s`<li class="address-line secondary"><div class="address ${r({loading:i})}"><cc-icon class=icon--auto .icon=${c} size=lg></cc-icon><span>${e.address}</span></div><div class=buttons><cc-button @cc-button:click=${()=>this._onMarkAsPrimary(e.address)} ?waiting=${"marking-as-primary"===e.state} ?disabled=${t||i} a11y-name=${f("cc-email-list.secondary.action.mark-as-primary.accessible-name",{address:e.address})}>${f("cc-email-list.secondary.action.mark-as-primary.name")}</cc-button><cc-button class=delete-button danger outlined .icon=${o} @cc-button:click=${()=>this._onDelete(e.address)} ?waiting=${"deleting"===e.state} ?disabled=${i} a11y-name=${f("cc-email-list.secondary.action.delete.accessible-name",{address:e.address})}>${f("cc-email-list.secondary.action.delete.name")}</cc-button></div></li>`}))}</ul>${this._renderAddEmailForm()}</cc-block-section>`}_renderAddEmailForm(){const e="adding"===this.addEmailForm.state;return s`<form><cc-input-text label=${f("cc-email-list.secondary.address-input.label")} required .value=${this.addEmailForm.address.value} ?disabled=${e} @cc-input-text:requestimplicitsubmit=${this._onAdd} @cc-input-text:input=${this._onAddressInput} ${a(this._addressInputRef)}>${this._renderAddressError()}<p slot=help>${f("cc-email-list.secondary.address-input.format")}</p></cc-input-text><cc-button primary ?waiting=${e} @cc-button:click=${this._onAdd}>${f("cc-email-list.secondary.action.add")}</cc-button></form>`}_renderAddressError(){return"empty"===this.addEmailForm.address.error?s`<p slot=error>${f("cc-email-list.secondary.address-input.error.empty")}</p>`:"used"===this.addEmailForm.address.error?s`<p slot=error>${f("cc-email-list.secondary.address-input.error.used")}</p>`:"invalid"===this.addEmailForm.address.error?s`<p slot=error>${f("cc-email-list.secondary.address-input.error.invalid")}</p>`:"already-defined"===this.addEmailForm.address.error?s`<p slot=error>${f("cc-email-list.secondary.address-input.error.already-defined")}</p>`:s``}static get styles(){return[b,i`:host{display:block}.secondary-addresses{padding:0;margin:0}.address-line{display:flex;flex-wrap:wrap;align-items:center;gap:1em}.address-line.secondary{margin-bottom:.8em}.address{display:flex;align-items:center;gap:1em}.address.loading{opacity:var(--cc-opacity-when-disabled)}.address-line.secondary .address{flex:1 1 0}.address span{word-break:break-all}.address-line.secondary .address span{min-width:15em}.buttons{display:flex;flex-wrap:wrap;align-items:center;gap:1em}form{display:flex;flex-wrap:wrap;align-items:start;justify-content:flex-end;gap:0 1em}form>cc-input-text{flex:1 1 19em}form>cc-button{margin-top:var(--cc-margin-top-btn-horizontal-form)}.skeleton{background-color:#bbb;color:transparent!important}.icon--auto{flex:auto 0 0}`]}}window.customElements.define("cc-email-list",v);export{v as CcEmailList};
+import{LitElement as e,html as i,css as s}from"lit";import{classMap as t}from"lit/directives/class-map.js";import{createRef as r,ref as a}from"lit/directives/ref.js";import{iconCleverMailStarLine as c,iconCleverMailLine as o}from"./assets/cc-clever.icons.js";import{iconRemixDeleteBinFill as n,iconRemixCheckboxCircleFill as d,iconRemixSpam_2Fill as l}from"./assets/cc-remix.icons.js";import{LostFocusController as m}from"./controllers/lost-focus-controller.js";import{dispatchCustomEvent as p}from"./lib/events.js";import{fakeString as u}from"./lib/fake-strings.js";import{focusBySelector as f}from"./lib/focus-helper.js";import{FormErrorFocusController as b}from"./lib/form/form-error-focus-controller.js";import{formSubmit as y}from"./lib/form/form-submit-directive.js";import{i18n as g}from"./i18n.js";import{sortBy as $}from"./lib/utils.js";import{skeletonStyles as h}from"./styles/skeleton.js";import"./cc-badge.js";import"./cc-block.js";import"./cc-block-section.js";import"./cc-button.js";import"./cc-icon.js";import"./cc-input-text.js";import"./cc-notice.js";const v={state:"idle",address:u(35),verified:!1},k=[];class _ extends e{static get properties(){return{addEmailFormState:{type:Object,attribute:!1},emails:{type:Object}}}constructor(){super(),this.addEmailFormState={type:"idle"},this.emails={state:"loading"},this._addressInputRef=r(),this._formRef=r(),new m(this,".secondary",(({suggestedElement:e})=>{f(e,".delete-button",(()=>{this._addressInputRef.value.focus()}))})),new b(this,this._formRef,(()=>this.addEmailFormState.errors))}resetAddEmailForm(){this._formRef.value?.reset()}_getVerifiedTagLabel(e){const s=g(e?"cc-email-list.primary.email.verified":"cc-email-list.primary.email.unverified");return i`<span>${s}</span>`}_onSendConfirmationEmail(){"loaded"===this.emails.state&&p(this,"send-confirmation-email",this.emails.value.primaryAddress.address)}_onDelete(e){p(this,"delete",e)}_onMarkAsPrimary(e){p(this,"mark-as-primary",e)}_onAddFormSubmit(e){this.addEmailFormState={...this.addEmailFormState,errors:null},p(this,"add",e.address)}_getErrorMessage(e){switch(e){case"invalid":return g("cc-input-text.error.bad-email");case"already-defined":return g("cc-email-list.secondary.address-input.error.already-defined");case"used":return g("cc-email-list.secondary.address-input.error.used")}}render(){return i`<cc-block><div slot=title>${g("cc-email-list.title")}</div>${"loading"===this.emails.state?i`${this._renderPrimarySection(v,!0)} ${this._renderSecondarySection(k)}`:""} ${"loaded"===this.emails.state?i`${this._renderPrimarySection(this.emails.value.primaryAddress)} ${this._renderSecondarySection(this.emails.value.secondaryAddresses)}`:""} ${"error"===this.emails.state?i`<cc-notice intent=warning message=${g("cc-email-list.loading.error")}></cc-notice>`:""}</cc-block>`}_renderPrimarySection(e,s=!1){const r=e.address,a=e.verified,o=!s&&!a,n=a?"success":"danger",m=a?d:l;return i`<cc-block-section><div slot=title>${g("cc-email-list.primary.title")}</div><div slot=info>${g("cc-email-list.primary.description")}</div><div class="address-line primary"><div class=address><cc-icon class=icon--auto .icon=${c} size=lg></cc-icon><span class=${t({skeleton:s})}>${r}</span></div><cc-badge intent=${n} weight=outlined ?skeleton=${s} .icon=${m}>${this._getVerifiedTagLabel(e.verified)}</cc-badge></div>${o?i`<cc-button @cc-button:click=${this._onSendConfirmationEmail} ?waiting=${"sending-confirmation-email"===e.state} link>${g("cc-email-list.primary.action.resend-confirmation-email")}</cc-button>`:""}</cc-block-section>`}_renderSecondarySection(e){const s=[...e].sort($("address")),r=s.some((e=>"marking-as-primary"===e.state));return i`<cc-block-section><div slot=title>${g("cc-email-list.secondary.title")}</div><div slot=info>${g("cc-email-list.secondary.description")}</div><ul class=secondary-addresses>${s.map((e=>{const s="marking-as-primary"===e.state||"deleting"===e.state;return i`<li class="address-line secondary"><div class="address ${t({loading:s})}"><cc-icon class=icon--auto .icon=${o} size=lg></cc-icon><span>${e.address}</span></div><div class=buttons><cc-button @cc-button:click=${()=>this._onMarkAsPrimary(e.address)} ?waiting=${"marking-as-primary"===e.state} ?disabled=${r||s} a11y-name=${g("cc-email-list.secondary.action.mark-as-primary.accessible-name",{address:e.address})}>${g("cc-email-list.secondary.action.mark-as-primary.name")}</cc-button><cc-button class=delete-button danger outlined .icon=${n} @cc-button:click=${()=>this._onDelete(e.address)} ?waiting=${"deleting"===e.state} ?disabled=${s} a11y-name=${g("cc-email-list.secondary.action.delete.accessible-name",{address:e.address})}>${g("cc-email-list.secondary.action.delete.name")}</cc-button></div></li>`}))}</ul>${this._renderAddEmailForm()}</cc-block-section>`}_renderAddEmailForm(){const e="adding"===this.addEmailFormState.type;return i`<form ${a(this._formRef)} ${y(this._onAddFormSubmit.bind(this))}><cc-input-text label=${g("cc-email-list.secondary.address-input.label")} name=address type=email required ?disabled=${e} .errorMessage=${this._getErrorMessage(this.addEmailFormState.errors?.email)} ${a(this._addressInputRef)}><p slot=help>${g("cc-email-list.secondary.address-input.format")}</p></cc-input-text><cc-button primary ?waiting=${e} type=submit>${g("cc-email-list.secondary.action.add")}</cc-button></form>`}static get styles(){return[h,s`:host{display:block}.secondary-addresses{padding:0;margin:0}.address-line{display:flex;flex-wrap:wrap;align-items:center;gap:1em}.address-line.secondary{margin-bottom:.8em}.address{display:flex;align-items:center;gap:1em}.address.loading{opacity:var(--cc-opacity-when-disabled)}.address-line.secondary .address{flex:1 1 0}.address span{word-break:break-all}.address-line.secondary .address span{min-width:15em}.buttons{display:flex;flex-wrap:wrap;align-items:center;gap:1em}form{display:flex;flex-wrap:wrap;align-items:start;justify-content:flex-end;gap:0 1em}form>cc-input-text{flex:1 1 19em}form>cc-button{margin-top:var(--cc-margin-top-btn-horizontal-form)}.skeleton{background-color:#bbb;color:transparent!important}.icon--auto{flex:auto 0 0}`]}}window.customElements.define("cc-email-list",_);export{_ as CcEmailList};
 //# sourceMappingURL=cc-email-list.js.map

dist/cc-email-list.smart.js

@@ -1,2 +0,2 @@
-import{todo_getEmailAddresses as e,todo_getConfirmationEmail as a,todo_addEmailAddress as s,todo_removeEmailAddress as i}from"@clevercloud/client/esm/api/v2/user.js";import{defineSmartComponent as r}from"./lib/define-smart-component.js";import{i18n as d}from"./i18n.js";import{notify as t,notifyError as l,notifySuccess as o}from"./lib/notifications.js";import{sendToApi as n}from"./lib/send-to-api.js";import{CcEmailList as c}from"./cc-email-list.js";import"./cc-smart-container.js";r({selector:"cc-email-list",params:{apiConfig:{type:Object}},onContextUpdate({component:r,context:m,onEvent:p,updateComponent:f,signal:y}){f("emails",{state:"loading"}),f("addEmailForm",c.ADD_FORM_INIT_STATE);const u=function(r,d){return{fetchEmailAddresses(){return Promise.all([this.fetchPrimaryEmailAddress(),this.fetchSecondaryEmailAddresses()]).then((([e,a])=>({self:e,secondary:a})))},fetchPrimaryEmailAddress:()=>Promise.resolve({method:"get",url:"/v2/self",headers:{Accept:"application/json"}}).then(n({apiConfig:r,signal:d})),fetchSecondaryEmailAddresses:()=>e().then(n({apiConfig:r,signal:d})),sendConfirmationEmail:()=>a().then(n({apiConfig:r})),addSecondaryEmailAddress:e=>s({email:e},{}).then(n({apiConfig:r})),deleteSecondaryEmailAddress:e=>i({email:e}).then(n({apiConfig:r})),markSecondaryEmailAddressAsPrimary:e=>s({email:e},{make_primary:!0}).then(n({apiConfig:r}))}}(m.apiConfig,y);function A(e,a){f("emails",(s=>{const i=s.value.secondaryAddresses.find((a=>a.address===e));null!=i&&a(i)}))}u.fetchEmailAddresses().then((({self:e,secondary:a})=>{f("emails",{state:"loaded",value:{primaryAddress:{state:"idle",address:e.email,verified:e.emailValidated},secondaryAddresses:a.map((e=>({state:"idle",address:e,verified:!0})))}})})).catch((e=>{console.error(e),f("emails",{state:"error"})})),p("cc-email-list:send-confirmation-email",(e=>{f("emails",(e=>{e.value.primaryAddress.state="sending-confirmation-email"})),u.sendConfirmationEmail(e).then((()=>{t({intent:"info",title:d("cc-email-list.primary.action.resend-confirmation-email.success.title"),message:d("cc-email-list.primary.action.resend-confirmation-email.success.message",{address:e}),options:{timeout:0,closeable:!0}})})).catch((a=>{console.error(a),l(d("cc-email-list.primary.action.resend-confirmation-email.error",{address:e}))})).finally((()=>{f("emails",(e=>{e.value.primaryAddress.state="idle"}))}))})),p("cc-email-list:add",(e=>{f("addEmailForm",{state:"adding",address:{value:e}}),u.addSecondaryEmailAddress(e).then((()=>{t({intent:"info",title:d("cc-email-list.secondary.action.add.success.title"),message:d("cc-email-list.secondary.action.add.success.message",{address:e}),options:{timeout:0,closeable:!0}}),f("addEmailForm",c.ADD_FORM_INIT_STATE)})).catch((a=>{let s;550===a.id?s="invalid":101===a.id?s="already-defined":1004===a.id&&(s="used"),null!=s?f("addEmailForm",(e=>{e.state="idle",e.address.error=s})):(console.error(a),l(d("cc-email-list.secondary.action.add.error",{address:e})),f("addEmailForm",(e=>{e.state="idle"})))}))})),p("cc-email-list:delete",(e=>{A(e,(e=>{e.state="deleting"})),u.deleteSecondaryEmailAddress(e).then((()=>{o(d("cc-email-list.secondary.action.delete.success",{address:e})),f("emails",(a=>{a.value.secondaryAddresses=a.value.secondaryAddresses.filter((a=>a.address!==e))}))})).catch((a=>{console.error(a),l(d("cc-email-list.secondary.action.delete.error",{address:e})),A(e,(e=>{e.state="idle"}))}))})),p("cc-email-list:mark-as-primary",(e=>{A(e,(e=>{e.state="marking-as-primary"})),u.markSecondaryEmailAddressAsPrimary(e).then((()=>{o(d("cc-email-list.secondary.action.mark-as-primary.success",{address:e}));const a=r.emails.value.primaryAddress.address;f("emails",(a=>{a.value.primaryAddress.address=e})),A(e,(e=>{e.state="idle",e.address=a}))})).catch((a=>{console.error(a),l(d("cc-email-list.secondary.action.mark-as-primary.error",{address:e})),A(e,(e=>{e.state="idle"}))}))}))}});
+import{todo_getEmailAddresses as e,todo_getConfirmationEmail as a,todo_addEmailAddress as s,todo_removeEmailAddress as i}from"@clevercloud/client/esm/api/v2/user.js";import{defineSmartComponent as r}from"./lib/define-smart-component.js";import{i18n as t}from"./i18n.js";import{notify as d,notifyError as l,notifySuccess as n}from"./lib/notifications.js";import{sendToApi as o}from"./lib/send-to-api.js";import"./cc-smart-container.js";import"./cc-email-list.js";r({selector:"cc-email-list",params:{apiConfig:{type:Object}},onContextUpdate({component:r,context:c,onEvent:m,updateComponent:f,signal:p}){f("emails",{state:"loading"}),f("addEmailFormState",{state:"idle"}),r.resetAddEmailForm();const y=function(r,t){return{fetchEmailAddresses(){return Promise.all([this.fetchPrimaryEmailAddress(),this.fetchSecondaryEmailAddresses()]).then((([e,a])=>({self:e,secondary:a})))},fetchPrimaryEmailAddress:()=>Promise.resolve({method:"get",url:"/v2/self",headers:{Accept:"application/json"}}).then(o({apiConfig:r,signal:t})),fetchSecondaryEmailAddresses:()=>e().then(o({apiConfig:r,signal:t})),sendConfirmationEmail:()=>a().then(o({apiConfig:r})),addSecondaryEmailAddress:e=>s({email:e},{}).then(o({apiConfig:r})),deleteSecondaryEmailAddress:e=>i({email:e}).then(o({apiConfig:r})),markSecondaryEmailAddressAsPrimary:e=>s({email:e},{make_primary:!0}).then(o({apiConfig:r}))}}(c.apiConfig,p);function u(e,a){f("emails",(s=>{const i=s.value.secondaryAddresses.find((a=>a.address===e));null!=i&&a(i)}))}y.fetchEmailAddresses().then((({self:e,secondary:a})=>{f("emails",{state:"loaded",value:{primaryAddress:{state:"idle",address:e.email,verified:e.emailValidated},secondaryAddresses:a.map((e=>({state:"idle",address:e,verified:!0})))}})})).catch((e=>{console.error(e),f("emails",{state:"error"})})),m("cc-email-list:send-confirmation-email",(e=>{f("emails",(e=>{e.value.primaryAddress.state="sending-confirmation-email"})),y.sendConfirmationEmail().then((()=>{d({intent:"info",title:t("cc-email-list.primary.action.resend-confirmation-email.success.title"),message:t("cc-email-list.primary.action.resend-confirmation-email.success.message",{address:e}),options:{timeout:0,closeable:!0}})})).catch((a=>{console.error(a),l(t("cc-email-list.primary.action.resend-confirmation-email.error",{address:e}))})).finally((()=>{f("emails",(e=>{e.value.primaryAddress.state="idle"}))}))})),m("cc-email-list:add",(e=>{f("addEmailFormState",(e=>{e.type="adding"})),y.addSecondaryEmailAddress(e).then((()=>{d({intent:"info",title:t("cc-email-list.secondary.action.add.success.title"),message:t("cc-email-list.secondary.action.add.success.message",{address:e}),options:{timeout:0,closeable:!0}}),r.resetAddEmailForm()})).catch((a=>{const s=function(e){if(550===e)return"invalid";if(101===e)return"already-defined";if(1004===e)return"used";return null}(a.id);null==s?(console.error(a),l(t("cc-email-list.secondary.action.add.error",{address:e}))):f("addEmailFormState",(e=>{e.errors={email:s}}))})).finally((()=>{f("addEmailFormState",(e=>{e.type="idle"}))}))})),m("cc-email-list:delete",(e=>{u(e,(e=>{e.state="deleting"})),y.deleteSecondaryEmailAddress(e).then((()=>{n(t("cc-email-list.secondary.action.delete.success",{address:e})),f("emails",(a=>{a.value.secondaryAddresses=a.value.secondaryAddresses.filter((a=>a.address!==e))}))})).catch((a=>{console.error(a),l(t("cc-email-list.secondary.action.delete.error",{address:e})),u(e,(e=>{e.state="idle"}))}))})),m("cc-email-list:mark-as-primary",(e=>{u(e,(e=>{e.state="marking-as-primary"})),y.markSecondaryEmailAddressAsPrimary(e).then((()=>{if(n(t("cc-email-list.secondary.action.mark-as-primary.success",{address:e})),"loaded"===r.emails.state){const a=r.emails.value.primaryAddress.address;f("emails",(a=>{a.value.primaryAddress.address=e})),u(e,(e=>{e.state="idle",e.address=a}))}})).catch((a=>{console.error(a),l(t("cc-email-list.secondary.action.mark-as-primary.error",{address:e})),u(e,(e=>{e.state="idle"}))}))}))}});
 //# sourceMappingURL=cc-email-list.smart.js.map

dist/cc-input-date.js

@@ -1,2 +0,2 @@
-import{LitElement as e,html as t,css as r}from"lit";import{classMap as a}from"lit/directives/class-map.js";import{live as i}from"lit/directives/live.js";import{createRef as o,ref as n}from"lit/directives/ref.js";import{DateFormatter as l}from"./lib/date/date-formatter.js";import{parseSimpleDateString as s,parseIsoDateString as d,isDateValid as u,shiftDateField as c,clampDate as h}from"./lib/date/date-utils.js";import{dispatchCustomEvent as p}from"./lib/events.js";import{i18n as m}from"./i18n.js";import{isStringEmpty as v}from"./lib/utils.js";import{accessibilityStyles as f}from"./styles/accessibility.js";import{skeletonStyles as b}from"./styles/skeleton.js";function g(e){return u(e)?e:d(e)}function y(e){return{state:"valid",value:e.toISOString(),date:e}}const _={valid:!0};function x(e){return{valid:!1,code:e}}class w extends e{static get properties(){return{disabled:{type:Boolean,reflect:!0},hiddenLabel:{type:Boolean,attribute:"hidden-label"},inline:{type:Boolean,reflect:!0},label:{type:String},max:{type:String},min:{type:String},name:{type:String,reflect:!0},readonly:{type:Boolean,reflect:!0},required:{type:Boolean},skeleton:{type:Boolean,reflect:!0},timezone:{type:String},value:{type:String},_valueState:{type:Object,state:!0},_hasError:{type:Boolean,state:!0}}}constructor(){super(),this.disabled=!1,this.hiddenLabel=!1,this.inline=!1,this.label=null,this.max=null,this.min=null,this.name=null,this.readonly=!1,this.required=!1,this.skeleton=!1,this.timezone="UTC",this.value=null,this._inputRef=o(),this._dateFormatter=this._resolveDateFormatter(),this._hasError=!1,this._maxDate=null,this._minDate=null,this._valueState={state:"empty"}}focus(e){this._inputRef.value.focus(e)}validate(){if("empty"===this._valueState.state)return this.required?x("empty"):_;if("NaD"===this._valueState.state)return x("badInput");const e=this._valueState.date;return null!=this._minDate&&e.getTime()<this._minDate.getTime()?x("rangeUnderflow"):null!=this._maxDate&&e.getTime()>this._maxDate.getTime()?x("rangeOverflow"):_}get valueAsDate(){return this._valueState.date||null}_resolveDateFormatter(){return new l("datetime-short",this.timezone)}_parseAsDate(e){if(v(e))return null;try{return s(e,this.timezone)}catch(t){return d(e)}}_formatValue(){return null!=this._valueState.date?this._dateFormatter.format(this._valueState.date):this._valueState.value??""}_setNewValueState(e,t=!0){const r=this._valueState.value;this._valueState=e,this.value=this._valueState.value,t&&r!==this._valueState.value&&p(this,"input",this._valueState.value)}_toValueState(e){if(e instanceof Date)return u(e)?y(e):{state:"empty"};try{const t=this._parseAsDate(e);return null==t?{state:"empty"}:y(t)}catch(t){return function(e){return{state:"NaD",value:e}}(e)}}_onInput(e){const t=e.target.value;this._setNewValueState(this._toValueState(t))}_onFocus(e){this.readonly&&e.target.select()}_onKeyEvent(e){if("keydown"!==e.type&&"keypress"!==e.type||e.stopPropagation(),"keydown"===e.type&&"Enter"===e.key&&(e.preventDefault(),p(this,"requestimplicitsubmit")),this.readonly||"keypress"!==e.type||"Enter"!==e.key||p(this,"requestimplicitsubmit"),!this.readonly&&null!=this._valueState.date&&"keydown"===e.type&&["ArrowDown","ArrowUp"].includes(e.key)){e.preventDefault();const t=e.target,r=t.selectionStart,a="ArrowDown"===e.key?-1:1,i=c(this._valueState.date,"YYYYYMMMDDDHHHmmmsss"[r],a),o=h(i,this._minDate,this._maxDate);this._setNewValueState(y(o)),this.getUpdateComplete().then((()=>{t.setSelectionRange(r,r)}))}}_onErrorSlotChanged(e){this._hasError=e.target.assignedNodes()?.length>0}willUpdate(e){if(e.has("timezone")&&(this._dateFormatter=this._resolveDateFormatter()),e.has("min"))try{this._minDate=g(this.min)}catch(e){this._minDate=null}if(e.has("max"))try{this._maxDate=g(this.max)}catch(e){this._maxDate=null}e.has("value")&&this._setNewValueState(this._toValueState(this.value),!1)}render(){return t`${null!=this.label?t`<label class=${a({"visually-hidden":this.hiddenLabel})} for=input-id><span class=label-text>${this.label}</span> ${this.required?t`<span class=required>${m("cc-input-date.required")}</span>`:""}</label>`:""}<div class=meta-input><div class="${a({skeleton:this.skeleton})} wrapper">${this._renderUnderlay()} <input id=input-id ${n(this._inputRef)} class="${a({error:this._hasError})} input" ?disabled=${this.disabled||this.skeleton} ?readonly=${this.readonly} .value=${i(this._formatValue())} name=${this.name??""} spellcheck=false aria-describedby="help error keyboard-hint" @focus=${this._onFocus} @input=${this._onInput} @keydown=${this._onKeyEvent} @keypress=${this._onKeyEvent}><div class=ring></div></div></div><div class=help-container id=help><slot name=help></slot></div><div class=error-container id=error><slot name=error @slotchange=${this._onErrorSlotChanged}></slot></div>${null!=this._valueState.date?t`<p id=keyboard-hint class=visually-hidden>${m("cc-input-date.keyboard-hint")}</p>`:""}`}_renderUnderlay(){return this.skeleton||null==this._valueState.date?null:t`<div class="input underlay" aria-hidden=true>${this._dateFormatter.mapParts(this._valueState.date,(({type:e,value:r})=>"separator"===e?r:t`<span>${r}</span>`))}</div>`}static get styles(){return[f,b,r`:host{display:inline-block}:host([inline]){display:inline-grid;align-items:baseline;gap:0 1em;grid-auto-rows:min-content;grid-template-areas:'label input' 'label help' 'label error';grid-template-columns:auto 1fr}.help-container{grid-area:help}.error-container{grid-area:error}label{display:flex;align-items:flex-end;justify-content:space-between;padding-bottom:.35em;cursor:pointer;gap:2em;line-height:1.25em}label .label-text{color:var(--cc-input-label-color,inherit);font-size:var(--cc-input-label-font-size,inherit);font-weight:var(--cc-input-label-font-weight,normal)}:host([inline]) label{flex-direction:column;padding:0;gap:0;grid-area:label;line-height:normal}.required{color:var(--cc-color-text-weak,#333);font-size:.9em;font-variant:small-caps}:host([inline]) .required{font-size:.8em}slot[name=help]::slotted(*){margin:.3em 0 0;color:var(--cc-color-text-weak,#333);font-size:.9em}slot[name=error],slot[name=error]::slotted(*){margin:.5em 0 0;color:var(--cc-color-text-danger)}.meta-input{position:relative;display:inline-flex;overflow:visible;width:100%;height:max-content;box-sizing:border-box;grid-area:input;vertical-align:top}.wrapper{display:grid;overflow:hidden;min-width:0;flex:1 1 0;padding:.15em .5em}.input{display:block;width:100%;box-sizing:border-box;border:1px solid #000;margin:0;-webkit-appearance:none;background:0 0;color:inherit;font-family:inherit;resize:none;z-index:2;overflow:hidden;border:none;font-family:var(--cc-input-font-family,var(--cc-ff-monospace,monospace));font-size:.85em;grid-area:1/1/2/2;line-height:2em}input:active,input:focus{outline:0}input[disabled]{color:var(--cc-color-text-weak,#333);opacity:1;pointer-events:none}.ring{position:absolute;z-index:0;top:0;right:0;bottom:0;left:0;overflow:hidden;border:1px solid var(--cc-color-border-neutral-strong,#aaa);background:var(--cc-color-bg-default,#fff);border-radius:var(--cc-border-radius-default,.25em);box-shadow:0 0 0 0 rgb(255 255 255 / 0%)}input:focus+.ring{border-color:var(--cc-color-border-neutral-focused,#777);outline:var(--cc-focus-outline,#000 solid 2px);outline-offset:var(--cc-focus-outline-offset,2px)}input.error+.ring{border-color:var(--cc-color-border-danger)!important}input.error:focus+.ring{outline:var(--cc-focus-outline-error,#000 solid 2px);outline-offset:var(--cc-focus-outline-offset,2px)}input:hover+.ring{border-color:var(--cc-color-border-neutral-hovered,#777)}:host([disabled]) .ring{border-color:var(--cc-color-border-neutral-disabled,#777);background:var(--cc-color-bg-neutral-disabled,#eee)}:host([readonly]) .ring{background:var(--cc-color-bg-neutral-readonly,#aaa)}.skeleton .ring,.skeleton input:hover+.ring,.skeleton:hover .ring{border-color:var(--cc-color-border-neutral-disabled,#777);background-color:var(--cc-color-bg-neutral-disabled,#eee);cursor:progress}.skeleton input{color:transparent}.input,.underlay{height:auto;padding:0 3px;font-family:var(--cc-input-font-family,var(--cc-ff-monospace,monospace))}.underlay{z-index:1;color:transparent;-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none;user-select:none;white-space:nowrap}.underlay span:not(:empty){--color:var(--cc-color-border-neutral, #aaa);padding:1px 0;border-bottom:2px solid var(--cc-color-border-neutral,#eee)}`]}}window.customElements.define("cc-input-date",w);export{w as CcInputDate};
+import{html as e,css as t}from"lit";import{classMap as r}from"lit/directives/class-map.js";import{live as i}from"lit/directives/live.js";import{createRef as a,ref as o}from"lit/directives/ref.js";import{DateFormatter as n}from"./lib/date/date-formatter.js";import{parseSimpleDateString as l,parseIsoDateString as s,isDateValid as u,shiftDateField as c,clampDate as d}from"./lib/date/date-utils.js";import{dispatchCustomEvent as p}from"./lib/events.js";import{C as h}from"./cc-form-control-element.abstract-195f103f.js";import{combineValidators as m,RequiredValidator as v,createValidator as f,Validation as b}from"./lib/form/validation.js";import{i18n as y}from"./i18n.js";import{isStringEmpty as g}from"./lib/utils.js";import{accessibilityStyles as _}from"./styles/accessibility.js";import{skeletonStyles as w}from"./styles/skeleton.js";const x=["Y","Y","Y","Y","Y","M","M","M","D","D","D","H","H","H","m","m","m","s","s","s"];function S(e){return u(e)?e:s(e)}function k(e){return{type:"valid",value:e.toISOString(),date:e}}class D extends h{static get properties(){return{...super.properties,disabled:{type:Boolean,reflect:!0},hiddenLabel:{type:Boolean,attribute:"hidden-label"},inline:{type:Boolean,reflect:!0},label:{type:String},max:{type:String},min:{type:String},readonly:{type:Boolean,reflect:!0},required:{type:Boolean},resetValue:{type:String,attribute:"reset-value"},skeleton:{type:Boolean,reflect:!0},timezone:{type:String},value:{type:String},_valueState:{type:Object,state:!0}}}static reactiveValidationProperties=["required","min","max","timezone"];constructor(){super(),this.disabled=!1,this.hiddenLabel=!1,this.inline=!1,this.label=null,this.max=null,this.min=null,this.readonly=!1,this.required=!1,this.resetValue="",this.skeleton=!1,this.timezone="UTC",this.value=null,this._errorRef=a(),this._inputRef=a(),this._dateFormatter=this._resolveDateFormatter(),this._maxDate=null,this._minDate=null,this._valueState={type:"empty"},this._errorMessages={empty:()=>y("cc-input-date.error.empty"),badInput:()=>y("cc-input-date.error.bad-input"),rangeUnderflow:()=>y("cc-input-date.error.range-underflow",{min:this.min}),rangeOverflow:()=>y("cc-input-date.error.range-overflow",{max:this.max})}}_getFormControlElement(){return this._inputRef.value}_getErrorElement(){return this._errorRef.value}_getErrorMessages(){return this._errorMessages}_getValidator(){return m([this.required?new v:null,f((()=>{if("empty"===this._valueState.type)return b.VALID;if("NaD"===this._valueState.type)return b.invalid("badInput");const e=this._valueState.date;return null!=this._minDate&&e.getTime()<this._minDate.getTime()?b.invalid("rangeUnderflow"):null!=this._maxDate&&e.getTime()>this._maxDate.getTime()?b.invalid("rangeOverflow"):b.VALID}))])}_getFormControlData(){return"empty"===this._valueState.type?"":this._valueState.value}_getReactiveValidationProperties(){return D.reactiveValidationProperties}focus(e){this._inputRef.value.focus(e)}get valueAsDate(){return"valid"===this._valueState.type?this._valueState.date??null:null}_resolveDateFormatter(){return new n("datetime-short",this.timezone)}_parseAsDate(e){if(g(e))return null;try{return l(e,this.timezone)}catch(t){return s(e)}}_formatValue(){switch(this._valueState.type){case"empty":return"";case"NaD":return this._valueState.value??"";case"valid":return this._dateFormatter.format(this._valueState.date)}}_setNewValueState(e,t=!0){const r="empty"===this._valueState.type?"":this._valueState.value;this._valueState=e,this.value="empty"===this._valueState.type?"":this._valueState.value,t&&r!==this.value&&p(this,"input",this.value)}_toValueState(e){if(e instanceof Date)return u(e)?k(e):{type:"empty"};try{const t=this._parseAsDate(e);return null==t?{type:"empty"}:k(t)}catch(t){return function(e){return{type:"NaD",value:e}}(e)}}_onInput(e){const t=e.target.value;this._setNewValueState(this._toValueState(t))}_onFocus(e){this.readonly&&e.target.select()}_onKeyEvent(e){if("keydown"!==e.type&&"keypress"!==e.type||e.stopPropagation(),"keydown"===e.type&&"Enter"===e.key&&(e.preventDefault(),this._internals.form.requestSubmit(),p(this,"requestimplicitsubmit")),this.readonly||"keypress"!==e.type||"Enter"!==e.key||(this._internals.form.requestSubmit(),p(this,"requestimplicitsubmit")),!this.readonly&&"valid"===this._valueState.type&&"keydown"===e.type&&["ArrowDown","ArrowUp"].includes(e.key)){e.preventDefault();const t=e.target,r=t.selectionStart,i="ArrowDown"===e.key?-1:1,a=c(this._valueState.date,x[r],i),o=d(a,this._minDate,this._maxDate);this._setNewValueState(k(o)),this.getUpdateComplete().then((()=>{t.setSelectionRange(r,r)}))}}willUpdate(e){if(e.has("timezone")&&(this._dateFormatter=this._resolveDateFormatter()),e.has("min"))try{this._minDate=S(this.min)}catch(e){this._minDate=null}if(e.has("max"))try{this._maxDate=S(this.max)}catch(e){this._maxDate=null}e.has("value")&&this._setNewValueState(this._toValueState(this.value),!1)}render(){const t=null!=this.errorMessage&&""!==this.errorMessage;return e`${null!=this.label?e`<label class=${r({"visually-hidden":this.hiddenLabel})} for=input><span class=label-text>${this.label}</span> ${this.required?e`<span class=required>${y("cc-input-date.required")}</span>`:""}</label>`:""}<div class=meta-input><div class="${r({skeleton:this.skeleton})} wrapper">${this._renderUnderlay()} <input id=input ${o(this._inputRef)} class="${r({error:t})} input" ?disabled=${this.disabled||this.skeleton} ?readonly=${this.readonly} .value=${i(this._formatValue())} spellcheck=false aria-describedby="help error keyboard-hint" @focus=${this._onFocus} @input=${this._onInput} @keydown=${this._onKeyEvent} @keypress=${this._onKeyEvent}><div class=ring></div></div></div><div class=help-container id=help><slot name=help></slot></div>${t?e`<p class=error-container id=error ${o(this._errorRef)}>${this.errorMessage}</p>`:""} ${"valid"===this._valueState.type?e`<p id=keyboard-hint class=visually-hidden>${y("cc-input-date.keyboard-hint")}</p>`:""}`}_renderUnderlay(){return this.skeleton||"valid"!==this._valueState.type?null:e`<div class="input underlay" aria-hidden=true>${this._dateFormatter.mapParts(this._valueState.date,(({type:t,value:r})=>"separator"===t?r:e`<span>${r}</span>`))}</div>`}static get styles(){return[_,w,t`:host{display:inline-block}:host([inline]){display:inline-grid;align-items:baseline;gap:0 1em;grid-auto-rows:min-content;grid-template-areas:'label input' 'label help' 'label error';grid-template-columns:auto 1fr}.help-container{grid-area:help}.error-container{grid-area:error}label{display:flex;align-items:flex-end;justify-content:space-between;padding-bottom:.35em;cursor:pointer;gap:2em;line-height:1.25em}label .label-text{color:var(--cc-input-label-color,inherit);font-size:var(--cc-input-label-font-size,inherit);font-weight:var(--cc-input-label-font-weight,normal)}:host([inline]) label{flex-direction:column;padding:0;gap:0;grid-area:label;line-height:normal}.required{color:var(--cc-color-text-weak,#333);font-size:.9em;font-variant:small-caps}:host([inline]) .required{font-size:.8em}slot[name=help]::slotted(*){margin:.3em 0 0;color:var(--cc-color-text-weak,#333);font-size:.9em}.error-container{margin:.5em 0 0;color:var(--cc-color-text-danger)}.meta-input{position:relative;display:inline-flex;overflow:visible;width:100%;height:max-content;box-sizing:border-box;grid-area:input;vertical-align:top}.wrapper{display:grid;overflow:hidden;min-width:0;flex:1 1 0;padding:.15em .5em}.input{display:block;width:100%;box-sizing:border-box;border:1px solid #000;margin:0;-webkit-appearance:none;background:0 0;color:inherit;font-family:inherit;resize:none;z-index:2;overflow:hidden;border:none;font-family:var(--cc-input-font-family,var(--cc-ff-monospace,monospace));font-size:.85em;grid-area:1/1/2/2;line-height:2em}input:active,input:focus{outline:0}input[disabled]{color:var(--cc-color-text-weak,#333);opacity:1;pointer-events:none}.ring{position:absolute;z-index:0;top:0;right:0;bottom:0;left:0;overflow:hidden;border:1px solid var(--cc-color-border-neutral-strong,#aaa);background:var(--cc-color-bg-default,#fff);border-radius:var(--cc-border-radius-default,.25em);box-shadow:0 0 0 0 rgb(255 255 255 / 0%)}input:focus+.ring{border-color:var(--cc-color-border-neutral-focused,#777);outline:var(--cc-focus-outline,#000 solid 2px);outline-offset:var(--cc-focus-outline-offset,2px)}input.error+.ring{border-color:var(--cc-color-border-danger)!important}input.error:focus+.ring{outline:var(--cc-focus-outline-error,#000 solid 2px);outline-offset:var(--cc-focus-outline-offset,2px)}input:hover+.ring{border-color:var(--cc-color-border-neutral-hovered,#777)}:host([disabled]) .ring{border-color:var(--cc-color-border-neutral-disabled,#777);background:var(--cc-color-bg-neutral-disabled,#eee)}:host([readonly]) .ring{background:var(--cc-color-bg-neutral-readonly,#aaa)}.skeleton .ring,.skeleton input:hover+.ring,.skeleton:hover .ring{border-color:var(--cc-color-border-neutral-disabled,#777);background-color:var(--cc-color-bg-neutral-disabled,#eee);cursor:progress}.skeleton input{color:transparent}.input,.underlay{height:auto;padding:0 3px;font-family:var(--cc-input-font-family,var(--cc-ff-monospace,monospace))}.underlay{z-index:1;color:transparent;-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none;user-select:none;white-space:nowrap}.underlay span:not(:empty){--color:var(--cc-color-border-neutral, #aaa);padding:1px 0;border-bottom:2px solid var(--cc-color-border-neutral,#eee)}`]}}window.customElements.define("cc-input-date",D);export{D as CcInputDate};
 //# sourceMappingURL=cc-input-date.js.map

dist/cc-input-number.js

@@ -1,2 +0,2 @@
-import{LitElement as e,html as t,css as i}from"lit";import{classMap as r}from"lit/directives/class-map.js";import{iconRemixSubtractLine as o,iconRemixAddLine as n}from"./assets/cc-remix.icons.js";import{dispatchCustomEvent as l}from"./lib/events.js";import{i18n as s}from"./i18n.js";import{accessibilityStyles as a}from"./styles/accessibility.js";import{skeletonStyles as c}from"./styles/skeleton.js";import"./cc-icon.js";class d extends e{static get properties(){return{controls:{type:Boolean},disabled:{type:Boolean,reflect:!0},inline:{type:Boolean,reflect:!0},label:{type:String},hiddenLabel:{type:Boolean,attribute:"hidden-label"},max:{type:Number},min:{type:Number},name:{type:String,reflect:!0},readonly:{type:Boolean,reflect:!0},required:{type:Boolean},skeleton:{type:Boolean,reflect:!0},step:{type:Number},value:{type:Number},_invalid:{type:Boolean,state:!0},_hasError:{type:Boolean,state:!0}}}constructor(){super(),this.controls=!1,this.disabled=!1,this.inline=!1,this.label=null,this.hiddenLabel=!1,this.max=null,this.min=null,this.name=null,this.readonly=!1,this.required=!1,this.skeleton=!1,this.step=null,this.value=null,this._invalid=!1,this._hasError=!1}focus(){this._input.focus()}_onInput(e){this.value=e.target.valueAsNumber,l(this,"input",this.value)}_onFocus(e){this.readonly&&e.target.select()}_onKeyEvent(e){"keydown"!==e.type&&"keypress"!==e.type||e.stopPropagation(),"keydown"===e.type&&13===e.keyCode&&(e.preventDefault(),l(this,"requestimplicitsubmit")),this.readonly||"keypress"!==e.type||13!==e.keyCode||l(this,"requestimplicitsubmit")}_onDecrement(){this._input.stepDown(),this.value=this._input.valueAsNumber,l(this,"input",this.value)}_onIncrement(){this._input.stepUp(),this.value=this._input.valueAsNumber,l(this,"input",this.value)}_onErrorSlotChanged(e){this._hasError=e.target.assignedNodes()?.length>0}firstUpdated(){this._input=this.shadowRoot.querySelector(".input"),this._invalid=!this._input.checkValidity()}updated(e){e.has("value")&&(this._invalid=!this._input.checkValidity())}render(){const e=null!=this.value?this.value:0,i=this.controls&&!this.skeleton,l=this.value<=this.min&&null!=this.min,a=this.value>=this.max&&null!=this.max;return t`${null!=this.label?t`<label class=${r({"visually-hidden":this.hiddenLabel})} for=input-id><span class=label-text>${this.label}</span> ${this.required?t`<span class=required>${s("cc-input-number.required")}</span>`:""}</label>`:""}<div class=meta-input>${i?t`<button class=btn @click=${this._onDecrement} ?disabled=${this.disabled||this.readonly||l}><cc-icon class=btn-img .icon=${o} a11y-name=${s("cc-input-number.decrease")} size=lg></cc-icon></button>`:""}<div class="${r({skeleton:this.skeleton})} wrapper"><input id=input-id type=number class="${r({error:this._invalid||this._hasError})} input" ?disabled=${this.disabled||this.skeleton} ?readonly=${this.readonly} min=${this.min??""} max=${this.max??""} step=${this.step??""} .value=${e} name=${this.name??""} spellcheck=false aria-describedby="help-id error-id" @focus=${this._onFocus} @input=${this._onInput} @keydown=${this._onKeyEvent} @keypress=${this._onKeyEvent}><div class=ring></div></div>${i?t`<button class=btn @click=${this._onIncrement} ?disabled=${this.disabled||this.readonly||a}><cc-icon class=btn-img .icon=${n} a11y-name=${s("cc-input-number.increase")} size=lg></cc-icon></button>`:""}</div><div class=help-container id=help-id><slot name=help></slot></div><div class=error-container id=error-id><slot name=error @slotchange=${this._onErrorSlotChanged}></slot></div>`}static get styles(){return[a,c,i`:host{display:inline-block}:host([inline]){display:inline-grid;align-items:baseline;gap:0 1em;grid-auto-rows:min-content;grid-template-areas:'label input' 'label help' 'label error';grid-template-columns:auto 1fr}.help-container{grid-area:help}.error-container{grid-area:error}label{display:flex;align-items:flex-end;justify-content:space-between;padding-bottom:.35em;cursor:pointer;gap:2em;line-height:1.25em}label .label-text{color:var(--cc-input-label-color,inherit);font-size:var(--cc-input-label-font-size,inherit);font-weight:var(--cc-input-label-font-weight,normal)}:host([inline]) label{flex-direction:column;padding:0;gap:0;grid-area:label;line-height:normal}.required{color:var(--cc-color-text-weak);font-size:.9em;font-variant:small-caps}:host([inline]) .required{font-size:.8em}slot[name=help]::slotted(*){margin:.3em 0 0;color:var(--cc-color-text-weak);font-size:.9em}slot[name=error]::slotted(*){margin:.5em 0 0;color:var(--cc-color-text-danger)}.meta-input{position:relative;display:inline-flex;overflow:visible;width:100%;height:max-content;box-sizing:border-box;grid-area:input;vertical-align:top}.wrapper{display:grid;overflow:hidden;min-width:0;flex:1 1 0;padding:.15em .5em}input{display:block;width:100%;box-sizing:border-box;padding:0;border:1px solid #000;margin:0;-webkit-appearance:none;background:0 0;color:inherit;font-family:inherit;resize:none;z-index:2;overflow:hidden;height:2em;border:none;font-family:var(--cc-input-font-family,inherit);font-size:.85em;grid-area:1/1/2/2;line-height:2em;text-align:var(--cc-input-number-align,left)}input[type=number]{-moz-appearance:textfield}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{margin:0;-webkit-appearance:none}input:active,input:focus{outline:0}input[disabled]{color:var(--cc-color-text-weak);opacity:1;pointer-events:none}button[disabled]{opacity:.5;pointer-events:none}.ring{position:absolute;z-index:0;top:0;right:0;bottom:0;left:0;overflow:hidden;border:1px solid var(--cc-color-border-neutral-strong,#aaa);background:var(--cc-color-bg-default,#fff);border-radius:var(--cc-border-radius-default,.25em);box-shadow:0 0 0 0 rgb(255 255 255 / 0%)}input:focus+.ring{border-color:var(--cc-color-border-neutral-focused,#777);outline:var(--cc-focus-outline,#000 solid 2px);outline-offset:var(--cc-focus-outline-offset,2px)}input.error+.ring{border-color:var(--cc-color-border-danger)!important}input.error:focus+.ring{outline:var(--cc-focus-outline-error,#000 solid 2px);outline-offset:var(--cc-focus-outline-offset,2px)}input:hover+.ring{border-color:var(--cc-color-border-neutral-hovered,#777)}:host([disabled]) .ring{border-color:var(--cc-color-border-neutral-disabled,#777);background:var(--cc-color-bg-neutral-disabled)}:host([readonly]) .ring{background:var(--cc-color-bg-neutral-readonly,#aaa)}.skeleton .ring,.skeleton input:hover+.ring,.skeleton:hover .ring{border-color:var(--cc-color-border-neutral-disabled,#777);background-color:var(--cc-color-bg-neutral-disabled);cursor:progress}.skeleton input{color:transparent}.btn{display:block;padding:0;border:none;margin:.2em;background:0 0;font-family:inherit;font-size:unset;z-index:2;width:1.6em;height:1.6em;flex-shrink:0;border-radius:var(--cc-border-radius-small,.15em);cursor:pointer}.btn:focus{outline:var(--cc-focus-outline,#000 solid 2px);outline-offset:var(--cc-focus-outline-offset,2px)}.btn:active,.btn:hover{box-shadow:none;outline:0}.btn:hover{background-color:var(--cc-color-bg-neutral-hovered)}.btn:active{background-color:var(--cc-color-bg-neutral-active)}.btn::-moz-focus-inner{border:0}.btn-img{--cc-icon-color:var(--cc-input-btn-icons-color, #595959);box-sizing:border-box;padding:15%}.btn-img:hover{--cc-icon-color:var(--cc-color-text-primary)}`]}}window.customElements.define("cc-input-number",d);export{d as CcInputNumber};
+import{html as e,css as t}from"lit";import{classMap as r}from"lit/directives/class-map.js";import{createRef as i,ref as o}from"lit/directives/ref.js";import{iconRemixSubtractLine as n,iconRemixAddLine as l}from"./assets/cc-remix.icons.js";import{dispatchCustomEvent as s}from"./lib/events.js";import{C as a}from"./cc-form-control-element.abstract-195f103f.js";import{combineValidators as c,RequiredValidator as u,NumberValidator as d}from"./lib/form/validation.js";import{i18n as p}from"./i18n.js";import{accessibilityStyles as b}from"./styles/accessibility.js";import{skeletonStyles as m}from"./styles/skeleton.js";import"./cc-icon.js";class h extends a{static get properties(){return{...super.properties,controls:{type:Boolean},disabled:{type:Boolean,reflect:!0},inline:{type:Boolean,reflect:!0},label:{type:String},hiddenLabel:{type:Boolean,attribute:"hidden-label"},max:{type:Number},min:{type:Number},readonly:{type:Boolean,reflect:!0},required:{type:Boolean},resetValue:{type:Number,attribute:"reset-value"},skeleton:{type:Boolean,reflect:!0},step:{type:Number},value:{type:Number}}}static reactiveValidationProperties=["required","min","max"];constructor(){super(),this.controls=!1,this.disabled=!1,this.inline=!1,this.label=null,this.hiddenLabel=!1,this.max=null,this.min=null,this.readonly=!1,this.required=!1,this.resetValue=null,this.skeleton=!1,this.step=null,this.value=null,this._errorRef=i(),this._inputRef=i(),this._errorMessages={empty:()=>p("cc-input-number.error.empty"),badType:()=>p("cc-input-number.error.bad-type"),rangeUnderflow:()=>p("cc-input-number.error.range-underflow",{min:this.min}),rangeOverflow:()=>p("cc-input-number.error.range-overflow",{max:this.max})}}focus(){this._inputRef.value.focus()}_getFormControlElement(){return this._inputRef.value}_getErrorElement(){return this._errorRef.value}_getErrorMessages(){return this._errorMessages}_getValidator(){return c([this.required?new u:null,new d({min:this.min,max:this.max})])}_getFormControlData(){return this._inputRef.value.value}_getReactiveValidationProperties(){return h.reactiveValidationProperties}_onInput(e){this.value=e.target.valueAsNumber,s(this,"input",this.value)}_onFocus(e){this.readonly&&e.target.select()}_onKeyEvent(e){"keydown"!==e.type&&"keypress"!==e.type||e.stopPropagation(),"keydown"===e.type&&13===e.keyCode&&(e.preventDefault(),this._internals.form.requestSubmit(),s(this,"requestimplicitsubmit")),this.readonly||"keypress"!==e.type||13!==e.keyCode||(this._internals.form.requestSubmit(),s(this,"requestimplicitsubmit"))}_onDecrement(){this._inputRef.value.stepDown(),this.value=this._inputRef.value.valueAsNumber,s(this,"input",this.value)}_onIncrement(){this._inputRef.value.stepUp(),this.value=this._inputRef.value.valueAsNumber,s(this,"input",this.value)}render(){const t=null!=this.value?this.value:0,i=this.controls&&!this.skeleton,s=this.value<=this.min&&null!=this.min,a=this.value>=this.max&&null!=this.max,c=null!=this.errorMessage&&""!==this.errorMessage;return e`${null!=this.label?e`<label class=${r({"visually-hidden":this.hiddenLabel})} for=input-id><span class=label-text>${this.label}</span> ${this.required?e`<span class=required>${p("cc-input-number.required")}</span>`:""}</label>`:""}<div class=meta-input>${i?e`<button class=btn @click=${this._onDecrement} ?disabled=${this.disabled||this.readonly||s}><cc-icon class=btn-img .icon=${n} a11y-name=${p("cc-input-number.decrease")} size=lg></cc-icon></button>`:""}<div class="${r({skeleton:this.skeleton})} wrapper"><input id=input-id type=number class="${r({error:c})} input" ?disabled=${this.disabled||this.skeleton} ?readonly=${this.readonly} min=${this.min??""} max=${this.max??""} step=${this.step??""} .value=${t} spellcheck=false aria-describedby="help-id error-id" @focus=${this._onFocus} @input=${this._onInput} @keydown=${this._onKeyEvent} @keypress=${this._onKeyEvent} ${o(this._inputRef)}><div class=ring></div></div>${i?e`<button class=btn @click=${this._onIncrement} ?disabled=${this.disabled||this.readonly||a}><cc-icon class=btn-img .icon=${l} a11y-name=${p("cc-input-number.increase")} size=lg></cc-icon></button>`:""}</div><div class=help-container id=help-id><slot name=help></slot></div>${c?e`<p class=error-container id=error-id ${o(this._errorRef)}>${this.errorMessage}</p>`:""}`}static get styles(){return[b,m,t`:host{display:inline-block}:host([inline]){display:inline-grid;align-items:baseline;gap:0 1em;grid-auto-rows:min-content;grid-template-areas:'label input' 'label help' 'label error';grid-template-columns:auto 1fr}.help-container{grid-area:help}.error-container{grid-area:error}label{display:flex;align-items:flex-end;justify-content:space-between;padding-bottom:.35em;cursor:pointer;gap:2em;line-height:1.25em}label .label-text{color:var(--cc-input-label-color,inherit);font-size:var(--cc-input-label-font-size,inherit);font-weight:var(--cc-input-label-font-weight,normal)}:host([inline]) label{flex-direction:column;padding:0;gap:0;grid-area:label;line-height:normal}.required{color:var(--cc-color-text-weak);font-size:.9em;font-variant:small-caps}:host([inline]) .required{font-size:.8em}slot[name=help]::slotted(*){margin:.3em 0 0;color:var(--cc-color-text-weak);font-size:.9em}.error-container{margin:.5em 0 0;color:var(--cc-color-text-danger)}.meta-input{position:relative;display:inline-flex;overflow:visible;width:100%;height:max-content;box-sizing:border-box;grid-area:input;vertical-align:top}.wrapper{display:grid;overflow:hidden;min-width:0;flex:1 1 0;padding:.15em .5em}input{display:block;width:100%;box-sizing:border-box;padding:0;border:1px solid #000;margin:0;-webkit-appearance:none;background:0 0;color:inherit;font-family:inherit;resize:none;z-index:2;overflow:hidden;height:2em;border:none;font-family:var(--cc-input-font-family,inherit);font-size:.85em;grid-area:1/1/2/2;line-height:2em;text-align:var(--cc-input-number-align,left)}input[type=number]{-moz-appearance:textfield}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{margin:0;-webkit-appearance:none}input:active,input:focus{outline:0}input[disabled]{color:var(--cc-color-text-weak);opacity:1;pointer-events:none}button[disabled]{opacity:.5;pointer-events:none}.ring{position:absolute;z-index:0;top:0;right:0;bottom:0;left:0;overflow:hidden;border:1px solid var(--cc-color-border-neutral-strong,#aaa);background:var(--cc-color-bg-default,#fff);border-radius:var(--cc-border-radius-default,.25em);box-shadow:0 0 0 0 rgb(255 255 255 / 0%)}input:focus+.ring{border-color:var(--cc-color-border-neutral-focused,#777);outline:var(--cc-focus-outline,#000 solid 2px);outline-offset:var(--cc-focus-outline-offset,2px)}input.error+.ring{border-color:var(--cc-color-border-danger)!important}input.error:focus+.ring{outline:var(--cc-focus-outline-error,#000 solid 2px);outline-offset:var(--cc-focus-outline-offset,2px)}input:hover+.ring{border-color:var(--cc-color-border-neutral-hovered,#777)}:host([disabled]) .ring{border-color:var(--cc-color-border-neutral-disabled,#777);background:var(--cc-color-bg-neutral-disabled)}:host([readonly]) .ring{background:var(--cc-color-bg-neutral-readonly,#aaa)}.skeleton .ring,.skeleton input:hover+.ring,.skeleton:hover .ring{border-color:var(--cc-color-border-neutral-disabled,#777);background-color:var(--cc-color-bg-neutral-disabled);cursor:progress}.skeleton input{color:transparent}.btn{display:block;padding:0;border:none;margin:.2em;background:0 0;font-family:inherit;font-size:unset;z-index:2;width:1.6em;height:1.6em;flex-shrink:0;border-radius:var(--cc-border-radius-small,.15em);cursor:pointer}.btn:focus{outline:var(--cc-focus-outline,#000 solid 2px);outline-offset:var(--cc-focus-outline-offset,2px)}.btn:active,.btn:hover{box-shadow:none;outline:0}.btn:hover{background-color:var(--cc-color-bg-neutral-hovered)}.btn:active{background-color:var(--cc-color-bg-neutral-active)}.btn::-moz-focus-inner{border:0}.btn-img{--cc-icon-color:var(--cc-input-btn-icons-color, #595959);box-sizing:border-box;padding:15%}.btn-img:hover{--cc-icon-color:var(--cc-color-text-primary)}`]}}window.customElements.define("cc-input-number",h);export{h as CcInputNumber};
 //# sourceMappingURL=cc-input-number.js.map

dist/cc-input-text.js

@@ -1,2 +0,2 @@
-import{LitElement as e,html as t,css as i}from"lit";import{classMap as r}from"lit/directives/class-map.js";import{ifDefined as o}from"lit/directives/if-defined.js";import{iconRemixEyeOffLine as s,iconRemixEyeLine as l,iconRemixCheckLine as n,iconRemixClipboardLine as a}from"./assets/cc-remix.icons.js";import{dispatchCustomEvent as c}from"./lib/events.js";import{i18n as d}from"./i18n.js";import{arrayEquals as p}from"./lib/utils.js";import{accessibilityStyles as h}from"./styles/accessibility.js";import{skeletonStyles as u}from"./styles/skeleton.js";import"./cc-icon.js";const b=" ";class g extends e{static get properties(){return{clipboard:{type:Boolean,reflect:!0},disabled:{type:Boolean,reflect:!0},label:{type:String},hiddenLabel:{type:Boolean,attribute:"hidden-label"},inline:{type:Boolean,reflect:!0},multi:{type:Boolean,reflect:!0},name:{type:String,reflect:!0},placeholder:{type:String},readonly:{type:Boolean,reflect:!0},required:{type:Boolean},secret:{type:Boolean,reflect:!0},skeleton:{type:Boolean,reflect:!0},tags:{type:Array},value:{type:String},_copyOk:{type:Boolean,state:!0},_showSecret:{type:Boolean,state:!0},_tagsEnabled:{type:Boolean,state:!0},_hasError:{type:Boolean,state:!0}}}constructor(){super(),this.clipboard=!1,this.disabled=!1,this.inline=!1,this.label=null,this.hiddenLabel=!1,this.multi=!1,this.name=null,this.placeholder="",this.readonly=!1,this.required=!1,this.secret=!1,this.skeleton=!1,this.tags=null,this.value="",this._copyOk=!1,this._showSecret=!1,this._tagsEnabled=!1,this._hasError=!1}get tags(){return this._tagsEnabled?this.value.split(b).filter((e=>""!==e)):null}set tags(e){if(this._tagsEnabled=null!=e,this._tagsEnabled){const t=this.tags;p(t,e)||(this.value=e.join(b),this.requestUpdate("tags",t))}}focus(){this.shadowRoot.querySelector(".input").focus()}_onInput(e){if(this._tagsEnabled&&e.target.value.includes("\n")){const{selectionStart:t,selectionEnd:i}=e.target,r=e.target.value,o=e.target.value.replace(/\n/g,""),s=r.length-o.length;e.target.value=o,e.target.setSelectionRange(t-s,i-s)}this.value=e.target.value,c(this,"input",this.value),this._tagsEnabled&&c(this,"tags",this.tags)}_onFocus(e){this.readonly&&e.target.select()}_onClickCopy(){navigator.clipboard.writeText(this.value).then((()=>{this._copyOk=!0,setTimeout((()=>this._copyOk=!1),1e3)}))}_onClickSecret(){this._showSecret=!this._showSecret}_onKeyEvent(e){"keydown"!==e.type&&"keypress"!==e.type||e.stopPropagation(),this._tagsEnabled&&"keydown"===e.type&&13===e.keyCode&&(e.preventDefault(),c(this,"requestimplicitsubmit")),this.readonly||"keypress"!==e.type||13!==e.keyCode||(!this.multi||this.multi&&e.ctrlKey)&&c(this,"requestimplicitsubmit")}_onErrorSlotChanged(e){this._hasError=e.target.assignedNodes()?.length>0}render(){const e=this.value??"",i=e.split("\n").length,c=this.clipboard&&!this.disabled&&!this.skeleton,p=this.secret&&!this.multi&&!this.disabled&&!this.skeleton,h=this.multi||this._tagsEnabled,u=e.split(b).map(((e,i,r)=>t`<span class=tag>${e}</span>${i!==r.length-1?b:""}`));return t`${null!=this.label?t`<label class=${r({"visually-hidden":this.hiddenLabel})} for=input-id><span class=label-text>${this.label}</span> ${this.required?t`<span class=required>${d("cc-input-text.required")}</span>`:""}</label>`:""}<div class=meta-input><div class="${r({skeleton:this.skeleton})} wrapper" @input=${this._onInput} @keydown=${this._onKeyEvent} @keypress=${this._onKeyEvent}>${h?t`${this._tagsEnabled&&!this.skeleton?t`<div class="input input-underlayer" style=--rows:${i}><div class=all-tags>${u}</div></div>`:""} <textarea id=input-id class="${r({"input-tags":this._tagsEnabled,error:this._hasError})} input" style=--rows:${i} rows=${i} ?disabled=${this.disabled||this.skeleton} ?readonly=${this.readonly} .value=${e} name=${o(this.name??void 0)} placeholder=${this.placeholder} spellcheck=false wrap=${o(this._tagsEnabled?"soft":void 0)} aria-describedby="help-id error-id" @focus=${this._onFocus}></textarea>`:""} ${h?"":t`${c&&this.readonly?t`<div class="input input-mirror">${e}</div>`:""} <input id=input-id type=${this.secret&&!this._showSecret?"password":"text"} class="${r({error:this._hasError})} input" ?disabled=${this.disabled||this.skeleton} ?readonly=${this.readonly} .value=${e} name=${o(this.name??void 0)} placeholder=${this.placeholder} spellcheck=false aria-describedby="help-id error-id" @focus=${this._onFocus}>`}<div class=ring></div></div>${p?t`<button class=btn @click=${this._onClickSecret} title=${this._showSecret?d("cc-input-text.secret.hide"):d("cc-input-text.secret.show")}><cc-icon class=btn-img .icon=${this._showSecret?s:l} a11y-name=${this._showSecret?d("cc-input-text.secret.hide"):d("cc-input-text.secret.show")} size=lg></cc-icon></button>`:""} ${c?t`<button class=btn @click=${this._onClickCopy} title=${d("cc-input-text.clipboard")}><cc-icon class=btn-img .icon=${this._copyOk?n:a} a11y-name=${d("cc-input-text.clipboard")} size=lg></cc-icon></button>`:""}</div><div class=help-container id=help-id><slot name=help></slot></div><div class=error-container id=error-id><slot name=error @slotchange=${this._onErrorSlotChanged}></slot></div>`}static get styles(){return[h,u,i`:host{display:inline-block}:host([multi]){display:block}:host([inline]){display:inline-grid;align-items:baseline;gap:0 1em;grid-auto-rows:min-content;grid-template-areas:'label input' 'label help' 'label error';grid-template-columns:auto 1fr}:host([inline][multi]){display:grid}.help-container{grid-area:help}.error-container{grid-area:error}label{display:flex;align-items:flex-end;justify-content:space-between;padding-bottom:.35em;cursor:pointer;gap:2em;line-height:1.25em}label .label-text{color:var(--cc-input-label-color,inherit);font-size:var(--cc-input-label-font-size,inherit);font-weight:var(--cc-input-label-font-weight,normal)}:host([inline]) label{flex-direction:column;padding:0;gap:0;grid-area:label;line-height:normal}.required{color:var(--cc-color-text-weak);font-size:.9em;font-variant:small-caps}:host([inline]) .required{font-size:.8em}slot[name=help]::slotted(*){margin:.3em 0 0;color:var(--cc-color-text-weak);font-size:.9em}slot[name=error]::slotted(*){margin:.5em 0 0;color:var(--cc-color-text-danger)}.meta-input{position:relative;display:inline-flex;width:100%;height:max-content;box-sizing:border-box;grid-area:input;vertical-align:top}:host([multi]) .meta-input{display:flex}.wrapper{display:grid;overflow:hidden;min-width:0;flex:1 1 0;padding:.15em .5em}.input{display:block;width:100%;box-sizing:border-box;padding:0;border:1px solid #000;margin:0;-webkit-appearance:none;background:0 0;color:inherit;font-family:inherit;resize:none;z-index:2;overflow:hidden;height:calc(var(--rows,1) * 2em);border:none;font-family:var(--cc-input-font-family,inherit);font-size:.85em;grid-area:1/1/2/2;line-height:2em}.input::placeholder{font-style:italic}textarea:not([wrap]){white-space:pre}.input:active,.input:focus{outline:0}.input[disabled]{color:var(--cc-color-text-weak);opacity:1;pointer-events:none}.input-mirror{height:0}.input-tags,.input-underlayer{height:auto;padding:0 3px;font-family:var(--cc-input-font-family,var(--cc-ff-monospace));word-break:break-all;word-spacing:.5ch}.input-underlayer{z-index:1;color:transparent;-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none;user-select:none;white-space:pre-wrap}.input-underlayer .tag:not(:empty){--color:var(--cc-color-bg-soft, #eee);padding:1px 0;background-color:var(--color);border-radius:3px;box-shadow:0 0 0 2px var(--color)}.ring{position:absolute;z-index:0;top:0;right:0;bottom:0;left:0;overflow:hidden;border:1px solid var(--cc-color-border-neutral-strong,#aaa);background:var(--cc-color-bg-default,#fff);border-radius:var(--cc-border-radius-default,.25em);box-shadow:0 0 0 0 rgb(255 255 255 / 0%)}.input.error+.ring{border-color:var(--cc-color-border-danger)!important}.input:focus+.ring{border-color:var(--cc-color-border-neutral-focused,#777);outline:var(--cc-focus-outline,#000 solid 2px);outline-offset:var(--cc-focus-outline-offset,2px)}input.error:focus+.ring{outline:var(--cc-focus-outline-error,#000 solid 2px);outline-offset:var(--cc-focus-outline-offset,2px)}.input:hover+.ring{border-color:var(--cc-color-border-neutral-hovered,#777)}:host([disabled]) .ring{border-color:var(--cc-color-border-neutral-disabled,#eee);background:var(--cc-color-bg-neutral-disabled)}:host([readonly]) .ring{background:var(--cc-color-bg-neutral-readonly,#aaa)}.skeleton .input:hover+.ring,.skeleton .ring,.skeleton:hover .ring{border-color:var(--cc-color-border-neutral-disabled,#eee);background-color:var(--cc-color-bg-neutral-disabled);cursor:progress}.skeleton .input,.skeleton .input::placeholder{color:transparent}.btn{display:block;padding:0;border:none;margin:.2em .2em .2em 0;background:0 0;font-family:inherit;font-size:unset;z-index:2;width:1.6em;height:1.6em;flex-shrink:0;border-radius:var(--cc-border-radius-small,.15em);cursor:pointer}.btn:focus{outline:var(--cc-focus-outline,#000 solid 2px);outline-offset:var(--cc-focus-outline-offset,2px)}.btn:active,.btn:hover{box-shadow:none;outline:0}.btn:hover{background-color:var(--cc-color-bg-neutral-hovered)}.btn:active{background-color:var(--cc-color-bg-neutral-active)}.btn::-moz-focus-inner{border:0}.btn-img{--cc-icon-color:var(--cc-input-btn-icons-color, #595959);box-sizing:border-box;padding:15%}.btn-img:hover{--cc-icon-color:var(--cc-color-text-primary)}`]}}window.customElements.define("cc-input-text",g);export{g as CcInputText};
+import{html as e,css as t}from"lit";import{classMap as r}from"lit/directives/class-map.js";import{ifDefined as i}from"lit/directives/if-defined.js";import{createRef as o,ref as s}from"lit/directives/ref.js";import{iconRemixEyeOffLine as n,iconRemixEyeLine as l,iconRemixCheckLine as a,iconRemixClipboardLine as c}from"./assets/cc-remix.icons.js";import{dispatchCustomEvent as d}from"./lib/events.js";import{C as p}from"./cc-form-control-element.abstract-195f103f.js";import{combineValidators as u,RequiredValidator as h,EmailValidator as b}from"./lib/form/validation.js";import{i18n as g}from"./i18n.js";import{arrayEquals as m}from"./lib/utils.js";import{accessibilityStyles as f}from"./styles/accessibility.js";import{skeletonStyles as v}from"./styles/skeleton.js";import"./cc-icon.js";const y=" ";class x extends p{static get properties(){return{...super.properties,clipboard:{type:Boolean,reflect:!0},disabled:{type:Boolean,reflect:!0},label:{type:String},hiddenLabel:{type:Boolean,attribute:"hidden-label"},inline:{type:Boolean,reflect:!0},multi:{type:Boolean,reflect:!0},placeholder:{type:String},readonly:{type:Boolean,reflect:!0},required:{type:Boolean},resetValue:{type:String,attribute:"reset-value"},secret:{type:Boolean,reflect:!0},skeleton:{type:Boolean,reflect:!0},tags:{type:Array},type:{type:String,reflect:!0},value:{type:String},_copyOk:{type:Boolean,state:!0},_showSecret:{type:Boolean,state:!0},_tagsEnabled:{type:Boolean,state:!0}}}static reactiveValidationProperties=["required","type"];constructor(){super(),this.clipboard=!1,this.disabled=!1,this.inline=!1,this.label=null,this.hiddenLabel=!1,this.multi=!1,this.placeholder="",this.readonly=!1,this.required=!1,this.resetValue="",this.secret=!1,this.skeleton=!1,this.tags=null,this.type="text",this.value="",this._copyOk=!1,this._errorRef=o(),this._inputRef=o(),this._showSecret=!1,this._tagsEnabled=!1,this._errorMessages={empty:()=>"email"===this.type?g("cc-input-text.error.empty.email"):g("cc-input-text.error.empty"),badEmail:()=>g("cc-input-text.error.bad-email")}}_getFormControlElement(){return this._inputRef.value}_getErrorElement(){return this._errorRef.value}_getErrorMessages(){return this._errorMessages}_getValidator(){return u([this.required?new h:null,"email"===this.type?new b:null])}_getFormControlData(){if(this._tagsEnabled){const e=new FormData;return this.tags.forEach((t=>{e.append(this.name,t)})),e}return this.value}_getReactiveValidationProperties(){return x.reactiveValidationProperties}get tags(){return this._tagsEnabled?this.value.split(y).filter((e=>""!==e)):null}set tags(e){if(this._tagsEnabled=null!=e,this._tagsEnabled){const t=this.tags;m(t,e)||(this.value=e.join(y),this.requestUpdate("tags",t))}}focus(){this._inputRef.value?.focus()}_onInput(e){if(this._tagsEnabled&&e.target.value.includes("\n")){const{selectionStart:t,selectionEnd:r}=e.target,i=e.target.value,o=e.target.value.replace(/\n/g,""),s=i.length-o.length;e.target.value=o,e.target.setSelectionRange(t-s,r-s)}this.value=e.target.value,d(this,"input",this.value),this._tagsEnabled&&d(this,"tags",this.tags)}_onFocus(e){this.readonly&&e.target.select()}_onClickCopy(){navigator.clipboard.writeText(this.value).then((()=>{this._copyOk=!0,setTimeout((()=>this._copyOk=!1),1e3)}))}_onClickSecret(){this._showSecret=!this._showSecret}_onKeyEvent(e){"keydown"!==e.type&&"keypress"!==e.type||e.stopPropagation(),this._tagsEnabled&&"keydown"===e.type&&13===e.keyCode&&(e.preventDefault(),this._internals.form.requestSubmit(),d(this,"requestimplicitsubmit")),this.readonly||"keypress"!==e.type||13!==e.keyCode||(!this.multi||this.multi&&e.ctrlKey)&&(this._internals.form.requestSubmit(),d(this,"requestimplicitsubmit"))}render(){const t=this.value??"",o=t.split("\n").length,d=this.clipboard&&!this.disabled&&!this.skeleton,p=this.secret&&!this.multi&&!this.disabled&&!this.skeleton,u=this.multi||this._tagsEnabled,h=null!=this.errorMessage&&""!==this.errorMessage,b=t.split(y).map(((t,r,i)=>e`<span class=tag>${t}</span>${r!==i.length-1?y:""}`));return e`${null!=this.label?e`<label class=${r({"visually-hidden":this.hiddenLabel})} for=input-id><span class=label-text>${this.label}</span> ${this.required?e`<span class=required>${g("cc-input-text.required")}</span>`:""}</label>`:""}<div class=meta-input><div class="${r({skeleton:this.skeleton})} wrapper" @input=${this._onInput} @keydown=${this._onKeyEvent} @keypress=${this._onKeyEvent}>${u?e`${this._tagsEnabled&&!this.skeleton?e`<div class="input input-underlayer" style=--rows:${o}><div class=all-tags>${b}</div></div>`:""} <textarea id=input-id class="${r({"input-tags":this._tagsEnabled,error:h})} input" style=--rows:${o} rows=${o} ?disabled=${this.disabled||this.skeleton} ?readonly=${this.readonly} .value=${t} placeholder=${this.placeholder} spellcheck=false wrap=${i(this._tagsEnabled?"soft":void 0)} aria-describedby="help-id error-id" @focus=${this._onFocus} ${s(this._inputRef)}></textarea>`:""} ${u?"":e`${d&&this.readonly?e`<div class="input input-mirror">${t}</div>`:""} <input id=input-id type=${this.secret&&!this._showSecret?"password":"text"} class="${r({error:h})} input" ?disabled=${this.disabled||this.skeleton} ?readonly=${this.readonly} .value=${t} placeholder=${this.placeholder} spellcheck=false aria-describedby="help-id error-id" @focus=${this._onFocus} ${s(this._inputRef)}>`}<div class=ring></div></div>${p?e`<button class=btn @click=${this._onClickSecret} title=${this._showSecret?g("cc-input-text.secret.hide"):g("cc-input-text.secret.show")}><cc-icon class=btn-img .icon=${this._showSecret?n:l} a11y-name=${this._showSecret?g("cc-input-text.secret.hide"):g("cc-input-text.secret.show")} size=lg></cc-icon></button>`:""} ${d?e`<button class=btn @click=${this._onClickCopy} title=${g("cc-input-text.clipboard")}><cc-icon class=btn-img .icon=${this._copyOk?a:c} a11y-name=${g("cc-input-text.clipboard")} size=lg></cc-icon></button>`:""}</div><div class=help-container id=help-id><slot name=help></slot></div>${h?e`<p class=error-container id=error-id ${s(this._errorRef)}>${this.errorMessage}</p>`:""}`}static get styles(){return[f,v,t`:host{display:inline-block}:host([multi]){display:block}:host([inline]){display:inline-grid;align-items:baseline;gap:0 1em;grid-auto-rows:min-content;grid-template-areas:'label input' 'label help' 'label error';grid-template-columns:auto 1fr}:host([inline][multi]){display:grid}.help-container{grid-area:help}.error-container{grid-area:error}label{display:flex;align-items:flex-end;justify-content:space-between;padding-bottom:.35em;cursor:pointer;gap:2em;line-height:1.25em}label .label-text{color:var(--cc-input-label-color,inherit);font-size:var(--cc-input-label-font-size,inherit);font-weight:var(--cc-input-label-font-weight,normal)}:host([inline]) label{flex-direction:column;padding:0;gap:0;grid-area:label;line-height:normal}.required{color:var(--cc-color-text-weak);font-size:.9em;font-variant:small-caps}:host([inline]) .required{font-size:.8em}slot[name=help]::slotted(*){margin:.3em 0 0;color:var(--cc-color-text-weak);font-size:.9em}.error-container{margin:.5em 0 0;color:var(--cc-color-text-danger)}.meta-input{position:relative;display:inline-flex;width:100%;height:max-content;box-sizing:border-box;grid-area:input;vertical-align:top}:host([multi]) .meta-input{display:flex}.wrapper{display:grid;overflow:hidden;min-width:0;flex:1 1 0;padding:.15em .5em}.input{display:block;width:100%;box-sizing:border-box;padding:0;border:1px solid #000;margin:0;-webkit-appearance:none;background:0 0;color:inherit;font-family:inherit;resize:none;z-index:2;overflow:hidden;height:calc(var(--rows,1) * 2em);border:none;font-family:var(--cc-input-font-family,inherit);font-size:.85em;grid-area:1/1/2/2;line-height:2em}.input::placeholder{font-style:italic}textarea:not([wrap]){white-space:pre}.input:active,.input:focus{outline:0}.input[disabled]{color:var(--cc-color-text-weak);opacity:1;pointer-events:none}.input-mirror{height:0}.input-tags,.input-underlayer{height:auto;padding:0 3px;font-family:var(--cc-input-font-family,var(--cc-ff-monospace));word-break:break-all;word-spacing:.5ch}.input-underlayer{z-index:1;color:transparent;-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none;user-select:none;white-space:pre-wrap}.input-underlayer .tag:not(:empty){--color:var(--cc-color-bg-soft, #eee);padding:1px 0;background-color:var(--color);border-radius:3px;box-shadow:0 0 0 2px var(--color)}.ring{position:absolute;z-index:0;top:0;right:0;bottom:0;left:0;overflow:hidden;border:1px solid var(--cc-color-border-neutral-strong,#aaa);background:var(--cc-color-bg-default,#fff);border-radius:var(--cc-border-radius-default,.25em);box-shadow:0 0 0 0 rgb(255 255 255 / 0%)}.input.error+.ring{border-color:var(--cc-color-border-danger)!important}.input:focus+.ring{border-color:var(--cc-color-border-neutral-focused,#777);outline:var(--cc-focus-outline,#000 solid 2px);outline-offset:var(--cc-focus-outline-offset,2px)}.input.error:focus+.ring{outline:var(--cc-focus-outline-error,#000 solid 2px);outline-offset:var(--cc-focus-outline-offset,2px)}.input:hover+.ring{border-color:var(--cc-color-border-neutral-hovered,#777)}:host([disabled]) .ring{border-color:var(--cc-color-border-neutral-disabled,#eee);background:var(--cc-color-bg-neutral-disabled)}:host([readonly]) .ring{background:var(--cc-color-bg-neutral-readonly,#aaa)}.skeleton .input:hover+.ring,.skeleton .ring,.skeleton:hover .ring{border-color:var(--cc-color-border-neutral-disabled,#eee);background-color:var(--cc-color-bg-neutral-disabled);cursor:progress}.skeleton .input,.skeleton .input::placeholder{color:transparent}.btn{display:block;padding:0;border:none;margin:.2em .2em .2em 0;background:0 0;font-family:inherit;font-size:unset;z-index:2;width:1.6em;height:1.6em;flex-shrink:0;border-radius:var(--cc-border-radius-small,.15em);cursor:pointer}.btn:focus{outline:var(--cc-focus-outline,#000 solid 2px);outline-offset:var(--cc-focus-outline-offset,2px)}.btn:active,.btn:hover{box-shadow:none;outline:0}.btn:hover{background-color:var(--cc-color-bg-neutral-hovered)}.btn:active{background-color:var(--cc-color-bg-neutral-active)}.btn::-moz-focus-inner{border:0}.btn-img{--cc-icon-color:var(--cc-input-btn-icons-color, #595959);box-sizing:border-box;padding:15%}.btn-img:hover{--cc-icon-color:var(--cc-color-text-primary)}`]}}window.customElements.define("cc-input-text",x);export{x as CcInputText};
 //# sourceMappingURL=cc-input-text.js.map

dist/cc-logs.js

@@ -1,2 +0,2 @@
-import"./cc-badge.js";import"./cc-button.js";import"./cc-icon.js";import"./cc-loader.js";import"./cc-notice.js";import"@lit-labs/virtualizer";import{LitElement as t,html as e,unsafeCSS as s,css as o}from"lit";import{classMap as i}from"lit/directives/class-map.js";import{join as l}from"lit/directives/join.js";import{createRef as a,ref as r}from"lit/directives/ref.js";import{iconRemixFileCopy_2Line as n,iconRemixCheckboxBlankCircleFill as c}from"./assets/cc-remix.icons.js";import{ansiPaletteStyle as g}from"./lib/ansi/ansi-palette-style.js";import{stripAnsi as h,ansiToLit as d,ansiStyles as p}from"./lib/ansi/ansi.js";import u from"./lib/ansi/palettes/default.js";import{prepareLinesOfCodeForClipboard as m,copyToClipboard as _}from"./lib/clipboard.js";import{hasClass as f}from"./lib/dom.js";import{dispatchCustomEvent as b}from"./lib/events.js";import{i18n as y}from"./i18n.js";import{notifySuccess as w}from"./lib/notifications.js";import{isStringEmpty as v}from"./lib/utils.js";import{DateDisplayer as C}from"./date-displayer.js";import{LogsController as x}from"./logs-controller.js";import{LogsInputController as $}from"./logs-input-controller.js";const L={hidden:!1,intent:"neutral",showName:!1,size:"auto",strong:!1},D=g(Object.fromEntries(Object.entries(u).map((([t,e])=>[t,`var(--cc-color-ansi-default-${t}, ${e})`]))));class S{constructor(t,e){this._callback=t,this._timeout=e,this._timestamp=0}disable(){this._timestamp=(new Date).getTime()}call(){if((new Date).getTime()-this._timestamp>this._timeout)return this._callback()}}class F extends t{static get properties(){return{follow:{type:Boolean},limit:{type:Number},logs:{type:Array},messageFilter:{type:String,attribute:"message-filter"},messageFilterMode:{type:String,attribute:"message-filter-mode"},metadataFilter:{type:Array,attribute:"metadata-filter"},metadataRenderers:{type:Object},stripAnsi:{type:Boolean,attribute:"strip-ansi"},dateDisplay:{type:String,attribute:"date-display"},timezone:{type:String},wrapLines:{type:Boolean,attribute:"wrap-lines"},_horizontalScrollbarHeight:{type:Number,state:!0}}}constructor(){super(),this.follow=!1,this.limit=null,this.logs=[],this.messageFilter=null,this.messageFilterMode="loose",this.metadataFilter=[],this.metadataRenderers=null,this.stripAnsi=!1,this.dateDisplay="datetime-iso",this.timezone="UTC",this.wrapLines=!1,this._draggedLogIndex=null,this._focusedIndexIsInDom=!1,this._followSynchronizer=new S((()=>this._synchronizeFollow()),150),this._inputCtrl=new $(this),this._logsCtrl=new x(this),this._logsRef=a(),this._dateDisplayer=this._resolveDateDisplayer(),this._visibleRange={first:-1,last:-1},this._horizontalScrollbarHeight=0,this._onMouseDownGutter=this._onMouseDownGutter.bind(this),this._onFocusLog=this._onFocusLog.bind(this)}appendLogs(t){this._followSynchronizer.disable(),this._logsCtrl.append(t)}clear(){this._logsCtrl.clear()}scrollToBottom(){this._setFollow(!0)}_resolveDateDisplayer(){return new C(this.dateDisplay,this.timezone)}_onFocusLogsContainer(){this._focusedIndexIsInDom&&this._logsCtrl.clearFocus(!1)}_onFocusLog(t){const e=t.target,s=Number(e.closest(".log").dataset.index);this._logsCtrl.focus(s,!1)}_onFocusedLogChange(t){if(null==t)this._logsRef.value.focus();else{this._logsRef.value.element(t)?.scrollIntoView({block:"nearest"});const e=()=>{const e=this._logsRef.value.querySelector(`.log[data-index="${t}"] .select_button`);return null!=e&&(e.focus(),!0)};e()||this._logsRef.value.layoutComplete.then(e)}}_onArrow(t){this._logsCtrl.moveFocus(t,this._visibleRange)}_onRangeChanged(t){this._focusedIndexIsInDom=this._logsCtrl.isFocusedIndexInRange({first:t.first,last:t.last}),this._focusedIndexIsInDom||null==this.shadowRoot.activeElement||this._logsRef.value.focus()}_onMouseDownGutter(t){t.composedPath().some((t=>f(t,"select_button")))||t.preventDefault(),this._inputCtrl.onMouseDownGutter(t),this._draggedLogIndex=null}_onDrag({logIndex:t,direction:e,offset:s},o){o&&document.getSelection().empty();const i=null!=t?t:this._getNewDraggedLogIndex(e,s??1);i!==this._draggedLogIndex&&(o?this._logsCtrl.select(i):this._logsCtrl.extendSelection(i,"replace"),"up"!==e&&"down"!==e||this._logsRef.value.element(i)?.scrollIntoView({block:"nearest"}),this._draggedLogIndex=i)}_getNewDraggedLogIndex(t,e){if("up"===t)return Math.max(0,this._draggedLogIndex-e);if("down"===t)return Math.min(this._draggedLogIndex+e,this._logsCtrl.listLength-1);throw new Error(`Illegal argument. direction ${t} is not valid`)}_onClickLog(t,{ctrl:e,shift:s}){e&&!s?this._logsCtrl.toggleSelection(t):s?this._logsCtrl.extendSelection(t,e?"append":"replace"):!this._logsCtrl.isSelected(t)||this._logsCtrl.selectionLength>1?this._logsCtrl.select(t):this._logsCtrl.clearSelection(),this._logsCtrl.isSelectionEmpty()||document.getSelection().empty()}_onEscape(){this._logsCtrl.clearSelection()}_onClick(){this._logsCtrl.clearSelection()}_onSelectionChanged(){this._followSynchronizer.disable(),this._setFollow(!1)}_onCopy(t){const e=document.getSelection().toString().split(/[\r\n]+/gm),s=m(e);t.clipboardData.setData("text/plain",s.text),t.clipboardData.setData("text/html",s.html),t.preventDefault()}_onCopySelectionToClipboard(){if(this._logsCtrl.isSelectionEmpty())return;const t=this._logsCtrl.getSelectedLogs().map((t=>[this._dateDisplayer.format(t.date),...t.metadata?.map((t=>({metadata:t,metadataRendering:this._getMetadataRendering(t)}))).filter((({metadataRendering:t})=>!t.hidden)).map((({metadata:t,metadataRendering:e})=>this._getMetadataText(t,e)))??[],h(t.message)].filter((t=>t?.length>0)).join(" "))),e=m(t);_(e.text,e.html).then((()=>{w(y("cc-logs.copied",{count:t.length}))}))}_onWheel(t){t.deltaY<0&&(this._followSynchronizer.disable(),this._setFollow(!1))}_onVisibilityChanged(t){this._visibleRange={first:t.first,last:t.last},this._followSynchronizer.call()}_synchronizeFollow(){this._setFollow(this._visibleRange.last===Math.max(0,this._logsCtrl.listLength-1))}_setFollow(t){const e=this.follow;this.follow=t,e!==this.follow&&b(this,"followChange",this.follow)}_getMetadataRendering(t){const e=this.metadataRenderers?.[t.name];if(null==e)return L;const s="function"==typeof e?e(t):e;return{...L,...s}}_getMetadataText(t,e){return null!=e.text?e.text:`${e.showName?`${t.name}: `:""}${t.value}`}willUpdate(t){(t.has("dateDisplay")||t.has("timezone"))&&(this._dateDisplayer=this._resolveDateDisplayer()),t.has("logs")&&(this.clear(),this.appendLogs(this.logs)),t.has("limit")&&(this._logsCtrl.limit=this.limit),(t.has("messageFilter")||t.has("messageFilterMode")||t.has("metadataFilter"))&&(this._logsCtrl.filter={message:v(this.messageFilter)?null:{value:this.messageFilter,type:this.messageFilterMode},metadata:this.metadataFilter})}updated(t){this._horizontalScrollbarHeight=this.wrapLines?0:this._logsRef.value.offsetHeight-this._logsRef.value.clientHeight}render(){const t=this.follow&&this._logsCtrl.listLength>0?{pin:{index:this._logsCtrl.listLength-1,block:"start"}}:null;return e`<div class=wrapper style=--last-log-margin:${this._horizontalScrollbarHeight}px><lit-virtualizer ${r(this._logsRef)} class=logs_container tabindex=0 .items=${this._logsCtrl.getList().slice()} ?scroller=${!0} .keyFunction=${t=>t.id} .renderItem=${(t,e)=>this._renderLog(t,e)} .layout=${t} @click=${this._inputCtrl.onClick} @keydown=${this._inputCtrl.onKeyDown} @keyup=${this._inputCtrl.onKeyUp} @copy=${this._onCopy} @focus=${this._onFocusLogsContainer} @visibilityChanged=${this._onVisibilityChanged} @rangeChanged=${this._onRangeChanged} @wheel=${this._onWheel}></lit-virtualizer>${this._logsCtrl.isSelectionEmpty()?null:e`<cc-button class=copy_button .icon=${n} @cc-button:click=${this._onCopySelectionToClipboard} hide-text>${y("cc-logs.copy")}</cc-button>`}</div>`}_renderLog(t,s){const o=this.wrapLines,l=this._dateDisplayer,a=this._logsCtrl.isSelected(s),r=y(a?"cc-logs.unselect-button.label":"cc-logs.select-button.label",{index:s+1});return e`<p class="${i({selected:a})} log" data-index=${s}><span class=gutter @mousedown=${this._onMouseDownGutter} @click=${this._inputCtrl.onClickLog}><button class=select_button title=${r} aria-label=${r} aria-pressed=${a} tabindex=-1 @click=${this._inputCtrl.onClickLog} @focus=${this._onFocusLog}><cc-icon .icon=${c} size=xs></cc-icon></button> </span>${this._renderLogTimestamp(t,l)} <span class="${i({wrap:o})} log--right">${this._renderLogMetadata(t)}${this._renderLogMessage(t)}</span></p>`}_renderLogTimestamp(t,s){return"none"===s.display?null:e`<span class=date>${s.formatAndMapParts(t.date,((t,s)=>e`<span class=${t}>${s}</span>`))}</span>`}_renderLogMetadata(t){if(null==t.metadata||0===t.metadata.length)return null;const s=t.metadata.map((t=>this._renderMetadata(t))).filter((t=>null!=t));return 0===s.length?null:e`<span class=metadata--wrapper>${l(s,e`&nbsp;`)}</span>`}_renderMetadata(t){const s=this._getMetadataRendering(t);if(s.hidden)return null;const o=this._getMetadataText(t,s),l=s.size??0,a={metadata:!0,strong:s.strong,[s.intent]:!0};return e`<span class=${i(a)} style=min-width:${l}ch>${o}</span>`}_renderLogMessage(t){return e`<span class=message>${this.stripAnsi?h(t.message):d(t.message)}</span>`}static get styles(){return[...p,s(`:host {${D}}`),o`:host{display:block;overflow:hidden;border:1px solid var(--cc-color-border-neutral,#aaa);background-color:var(--cc-color-bg-default,#fff);border-radius:var(--cc-border-radius-default,.25em);--font-size:0.875em}:focus{outline:var(--cc-focus-outline,#000 solid 2px);outline-offset:var(--cc-focus-outline-offset,2px)}.wrapper{position:relative;display:flex;height:100%;flex-direction:column}.logs_container{flex:1;font-family:var(--cc-ff-monospace,monospace);font-size:var(--font-size)}.log{display:flex;width:100%;align-items:center;margin:0;gap:.5em;--spacing:2px;--gutter-size:1.5em}.log:hover{background-color:var(--cc-color-ansi-background-hover)}.log.selected{background-color:var(--cc-color-ansi-background-selected)}.log:last-of-type{margin-bottom:var(--last-log-margin)}.date,.log--right{padding:var(--spacing) 0;line-height:var(--gutter-size)}.log--right{white-space:pre}.log--right.wrap{white-space:pre-wrap}.gutter{flex:0 0 auto;align-self:stretch;border-right:1px solid var(--cc-color-ansi-foreground);cursor:pointer}.select_button{display:flex;width:var(--gutter-size);height:var(--gutter-size);align-items:center;justify-content:center;padding:0;border:0;margin:var(--spacing);background:0 0;color:var(--cc-color-ansi-foreground);cursor:pointer;outline-offset:0}.select_button cc-icon{color:#737373;opacity:0}.log:hover cc-icon,.select_button:focus cc-icon{opacity:1}.select_button[aria-pressed=true] cc-icon{color:var(--cc-color-text-primary,#000);opacity:1}.copy_button{position:absolute;top:.5em;right:1em}.metadata{display:inline-block}.metadata--wrapper{margin-right:var(--font-size)}.strong{font-weight:700}.neutral{color:var(--cc-color-ansi-foreground)}.info{color:var(--cc-color-ansi-blue)}.success{color:var(--cc-color-ansi-green)}.warning{color:var(--cc-color-ansi-yellow)}.danger{color:var(--cc-color-ansi-red)}.date{align-self:start;white-space:nowrap}.milliseconds,.separator,.timezone{opacity:.7}`]}}window.customElements.define("cc-logs-beta",F);export{F as CcLogs};
+import"./cc-badge.js";import"./cc-button.js";import"./cc-icon.js";import"./cc-loader.js";import"./cc-notice.js";import"@lit-labs/virtualizer";import{LitElement as t,html as e,unsafeCSS as s,css as o}from"lit";import{classMap as i}from"lit/directives/class-map.js";import{join as l}from"lit/directives/join.js";import{createRef as a,ref as r}from"lit/directives/ref.js";import{iconRemixFileCopy_2Line as n,iconRemixCheckboxBlankCircleFill as c}from"./assets/cc-remix.icons.js";import{ansiPaletteStyle as g}from"./lib/ansi/ansi-palette-style.js";import{stripAnsi as h,ansiToLit as d,ansiStyles as p}from"./lib/ansi/ansi.js";import u from"./lib/ansi/palettes/default.js";import{prepareLinesOfCodeForClipboard as m,copyToClipboard as _}from"./lib/clipboard.js";import{hasClass as f}from"./lib/dom.js";import{dispatchCustomEvent as b}from"./lib/events.js";import{i18n as y}from"./i18n.js";import{notifySuccess as w}from"./lib/notifications.js";import{isStringEmpty as C}from"./lib/utils.js";import{DateDisplayer as v}from"./date-displayer.js";import{LogsController as x}from"./logs-controller.js";import{LogsInputController as $}from"./logs-input-controller.js";const L={hidden:!1,intent:"neutral",showName:!1,size:"auto",strong:!1},S=g(Object.fromEntries(Object.entries(u).map((([t,e])=>[t,`var(--cc-color-ansi-default-${t}, ${e})`]))));class D{constructor(t,e){this._callback=t,this._timeout=e,this._timestamp=0}disable(){this._timestamp=(new Date).getTime()}call(){if((new Date).getTime()-this._timestamp>this._timeout)return this._callback()}}class F extends t{static get properties(){return{follow:{type:Boolean},limit:{type:Number},logs:{type:Array},messageFilter:{type:String,attribute:"message-filter"},messageFilterMode:{type:String,attribute:"message-filter-mode"},metadataFilter:{type:Array,attribute:"metadata-filter"},metadataRenderers:{type:Object},stripAnsi:{type:Boolean,attribute:"strip-ansi"},dateDisplay:{type:String,attribute:"date-display"},timezone:{type:String},wrapLines:{type:Boolean,attribute:"wrap-lines"},_horizontalScrollbarHeight:{type:Number,state:!0}}}constructor(){super(),this.follow=!1,this.limit=null,this.logs=[],this.messageFilter=null,this.messageFilterMode="loose",this.metadataFilter=[],this.metadataRenderers=null,this.stripAnsi=!1,this.dateDisplay="datetime-iso",this.timezone="UTC",this.wrapLines=!1,this._draggedLogIndex=null,this._focusedIndexIsInDom=!1,this._followSynchronizer=new D((()=>this._synchronizeFollow()),150),this._inputCtrl=new $(this),this._logsCtrl=new x(this),this._logsRef=a(),this._dateDisplayer=this._resolveDateDisplayer(),this._visibleRange={first:-1,last:-1},this._horizontalScrollbarHeight=0,this._onMouseDownGutter=this._onMouseDownGutter.bind(this),this._onFocusLog=this._onFocusLog.bind(this)}appendLogs(t){this._followSynchronizer.disable(),this._logsCtrl.append(t)}clear(){this._logsCtrl.clear()}scrollToBottom(){this._setFollow(!0)}_resolveDateDisplayer(){return new v(this.dateDisplay,this.timezone)}_onFocusLogsContainer(){this._focusedIndexIsInDom&&this._logsCtrl.clearFocus(!1)}_onFocusLog(t){const e=t.target,s=Number(e.closest(".log").dataset.index);this._logsCtrl.focus(s,!1)}_onFocusedLogChange(t){if(null==t)this._logsRef.value.focus();else{this._logsRef.value.element(t)?.scrollIntoView({block:"nearest"});const e=()=>{const e=this._logsRef.value.querySelector(`.log[data-index="${t}"] .select_button`);return null!=e&&(e.focus(),!0)};e()||this._logsRef.value.layoutComplete.then(e)}}_onArrow(t){this._logsCtrl.moveFocus(t,this._visibleRange)}_onHome(t){t?this._logsCtrl.extendSelection(0,"replace"):this._logsCtrl.focus(0)}_onEnd(t){t?this._logsCtrl.extendSelection(this._logsCtrl.listLength-1,"replace"):this._logsCtrl.focus(this._logsCtrl.listLength-1)}_onRangeChanged(t){this._focusedIndexIsInDom=this._logsCtrl.isFocusedIndexInRange({first:t.first,last:t.last}),this._focusedIndexIsInDom||null==this.shadowRoot.activeElement||this._logsRef.value.focus()}_onMouseDownGutter(t){t.composedPath().some((t=>f(t,"select_button")))||t.preventDefault(),this._inputCtrl.onMouseDownGutter(t),this._draggedLogIndex=null}_onDrag({logIndex:t,direction:e,offset:s},o){o&&document.getSelection().empty();const i=null!=t?t:this._getNewDraggedLogIndex(e,s??1);i!==this._draggedLogIndex&&(o?this._logsCtrl.select(i):this._logsCtrl.extendSelection(i,"replace"),"up"!==e&&"down"!==e||this._logsRef.value.element(i)?.scrollIntoView({block:"nearest"}),this._draggedLogIndex=i)}_getNewDraggedLogIndex(t,e){if("up"===t)return Math.max(0,this._draggedLogIndex-e);if("down"===t)return Math.min(this._draggedLogIndex+e,this._logsCtrl.listLength-1);throw new Error(`Illegal argument. direction ${t} is not valid`)}_onClickLog(t,{ctrl:e,shift:s}){e&&!s?this._logsCtrl.toggleSelection(t):s?this._logsCtrl.extendSelection(t,e?"append":"replace"):!this._logsCtrl.isSelected(t)||this._logsCtrl.selectionLength>1?this._logsCtrl.select(t):this._logsCtrl.clearSelection(),this._logsCtrl.isSelectionEmpty()||document.getSelection().empty()}_onEscape(){this._logsCtrl.clearSelection()}_onClick(t){if(3===t.detail){const e=t.target.closest(".log");if(null!=e){window.getSelection().empty();const t=document.createRange();t.selectNode(e),window.getSelection().addRange(t)}}else this._logsCtrl.clearSelection()}_onSelectionChanged(){this._followSynchronizer.disable(),this._setFollow(!1)}_onSelectAll(){this._logsCtrl.selectAll()}_onCopy(t){const e=document.getSelection().toString().split(/[\r\n]+/gm),s=m(e);t.clipboardData.setData("text/plain",s.text),t.clipboardData.setData("text/html",s.html),t.preventDefault()}_onCopySelectionToClipboard(){if(this._logsCtrl.isSelectionEmpty())return;const t=this._logsCtrl.getSelectedLogs().map((t=>[this._dateDisplayer.format(t.date),...t.metadata?.map((t=>({metadata:t,metadataRendering:this._getMetadataRendering(t)}))).filter((({metadataRendering:t})=>!t.hidden)).map((({metadata:t,metadataRendering:e})=>this._getMetadataText(t,e)))??[],h(t.message)].filter((t=>t?.length>0)).join(" "))),e=m(t);_(e.text,e.html).then((()=>{w(y("cc-logs.copied",{count:t.length}))}))}_onWheel(t){t.deltaY<0&&(this._followSynchronizer.disable(),this._setFollow(!1))}_onVisibilityChanged(t){this._visibleRange={first:t.first,last:t.last},this._followSynchronizer.call()}_synchronizeFollow(){this._setFollow(this._visibleRange.last===Math.max(0,this._logsCtrl.listLength-1))}_setFollow(t){const e=this.follow;this.follow=t,e!==this.follow&&b(this,"followChange",this.follow)}_getMetadataRendering(t){const e=this.metadataRenderers?.[t.name];if(null==e)return L;const s="function"==typeof e?e(t):e;return{...L,...s}}_getMetadataText(t,e){return null!=e.text?e.text:`${e.showName?`${t.name}: `:""}${t.value}`}willUpdate(t){(t.has("dateDisplay")||t.has("timezone"))&&(this._dateDisplayer=this._resolveDateDisplayer()),t.has("logs")&&(this.clear(),this.appendLogs(this.logs)),t.has("limit")&&(this._logsCtrl.limit=this.limit),(t.has("messageFilter")||t.has("messageFilterMode")||t.has("metadataFilter"))&&(this._logsCtrl.filter={message:C(this.messageFilter)?null:{value:this.messageFilter,type:this.messageFilterMode},metadata:this.metadataFilter})}updated(t){this._horizontalScrollbarHeight=this.wrapLines?0:this._logsRef.value.offsetHeight-this._logsRef.value.clientHeight}render(){const t=this.follow&&this._logsCtrl.listLength>0?{pin:{index:this._logsCtrl.listLength-1,block:"start"}}:null;return e`<div class=wrapper style=--last-log-margin:${this._horizontalScrollbarHeight}px><lit-virtualizer ${r(this._logsRef)} class=logs_container tabindex=0 .items=${this._logsCtrl.getList().slice()} ?scroller=${!0} .keyFunction=${function(t){return t.id}} .renderItem=${(t,e)=>this._renderLog(t,e)} .layout=${t} @click=${this._inputCtrl.onClick} @keydown=${this._inputCtrl.onKeyDown} @keyup=${this._inputCtrl.onKeyUp} @copy=${this._onCopy} @focus=${this._onFocusLogsContainer} @visibilityChanged=${this._onVisibilityChanged} @rangeChanged=${this._onRangeChanged} @wheel=${this._onWheel}></lit-virtualizer>${this._logsCtrl.isSelectionEmpty()?null:e`<cc-button class=copy_button .icon=${n} @cc-button:click=${this._onCopySelectionToClipboard}>${y("cc-logs.copy")}</cc-button>`}</div>`}_renderLog(t,s){const o=this.wrapLines,l=this._dateDisplayer,a=this._logsCtrl.isSelected(s),r=y(a?"cc-logs.unselect-button.label":"cc-logs.select-button.label",{index:s+1});return e`<p class="${i({selected:a})} log" data-index=${s}><span class=gutter @mousedown=${this._onMouseDownGutter} @click=${this._inputCtrl.onClickLog}><button class=select_button title=${r} aria-label=${r} aria-pressed=${a} tabindex=-1 @click=${this._inputCtrl.onClickLog} @focus=${this._onFocusLog}><cc-icon .icon=${c} size=xs></cc-icon></button> </span>${this._renderLogTimestamp(t,l)} <span class="${i({wrap:o})} log--right">${this._renderLogMetadata(t)}${this._renderLogMessage(t)}</span></p>`}_renderLogTimestamp(t,s){return"none"===s.display?null:e`<span class=date>${s.formatAndMapParts(t.date,((t,s)=>e`<span class=${t}>${s}</span>`))}</span>`}_renderLogMetadata(t){if(null==t.metadata||0===t.metadata.length)return null;const s=t.metadata.map((t=>this._renderMetadata(t))).filter((t=>null!=t));return 0===s.length?null:e`<span class=metadata--wrapper>${l(s,e`&nbsp;`)}</span>`}_renderMetadata(t){const s=this._getMetadataRendering(t);if(s.hidden)return null;const o=this._getMetadataText(t,s),l=s.size??0,a={metadata:!0,strong:s.strong,[s.intent]:!0};return e`<span class=${i(a)} style=min-width:${l}ch>${o}</span>`}_renderLogMessage(t){return e`<span class=message>${this.stripAnsi?h(t.message):d(t.message)}</span>`}static get styles(){return[...p,s(`:host {${S}}`),o`:host{display:block;overflow:hidden;border:1px solid var(--cc-color-border-neutral,#aaa);background-color:var(--cc-color-bg-default,#fff);border-radius:var(--cc-border-radius-default,.25em);--font-size:0.875em}:focus{outline:var(--cc-focus-outline,#000 solid 2px);outline-offset:var(--cc-focus-outline-offset,2px)}.wrapper{position:relative;display:flex;height:100%;flex-direction:column}.logs_container{flex:1;font-family:var(--cc-ff-monospace,monospace);font-size:var(--font-size)}.log{display:flex;width:100%;align-items:center;margin:0;gap:.5em;--spacing:2px;--gutter-size:1.5em}.log:hover{background-color:var(--cc-color-ansi-background-hover)}.log.selected{background-color:var(--cc-color-ansi-background-selected)}.log:last-of-type{margin-bottom:var(--last-log-margin)}.date,.log--right{padding:var(--spacing) 0;line-height:var(--gutter-size)}.log--right{white-space:pre}.log--right.wrap{white-space:pre-wrap}.gutter{flex:0 0 auto;align-self:stretch;border-right:1px solid var(--cc-color-ansi-foreground);cursor:pointer}.select_button{display:flex;width:var(--gutter-size);height:var(--gutter-size);align-items:center;justify-content:center;padding:0;border:0;margin:var(--spacing);background:0 0;color:var(--cc-color-ansi-foreground);cursor:pointer;outline-offset:0}.select_button cc-icon{color:#737373;opacity:0}.log:hover cc-icon,.select_button:focus cc-icon{opacity:1}.select_button[aria-pressed=true] cc-icon{color:var(--cc-color-text-primary,#000);opacity:1}.copy_button{position:absolute;top:.5em;right:1em}.metadata{display:inline-block}.metadata--wrapper{margin-right:var(--font-size)}.strong{font-weight:700}.neutral{color:var(--cc-color-ansi-foreground)}.info{color:var(--cc-color-ansi-blue)}.success{color:var(--cc-color-ansi-green)}.warning{color:var(--cc-color-ansi-yellow)}.danger{color:var(--cc-color-ansi-red)}.date{align-self:start;white-space:nowrap}.milliseconds,.separator,.timezone{opacity:.7}`]}}window.customElements.define("cc-logs-beta",F);export{F as CcLogs};
 //# sourceMappingURL=cc-logs.js.map

dist/cc-orga-member-list.js

@@ -1,2 +0,2 @@
-import{LitElement as e,html as t,css as i}from"lit";import{classMap as r}from"lit/directives/class-map.js";import{createRef as s,ref as a}from"lit/directives/ref.js";import{repeat as l}from"lit/directives/repeat.js";import{LostFocusController as m}from"./controllers/lost-focus-controller.js";import{validateEmailAddress as n}from"./lib/email.js";import{dispatchCustomEvent as o}from"./lib/events.js";import{i18n as c}from"./i18n.js";import"./cc-block.js";import"./cc-block-section.js";import"./cc-orga-member-card.js";import"./cc-notice.js";import"./cc-input-text.js";import"./cc-loader.js";import"./cc-button.js";import"./cc-badge.js";import"./cc-select.js";import{linkStyles as d}from"./templates/cc-link/cc-link.js";class b extends e{static get properties(){return{authorisations:{type:Object},inviteMemberForm:{type:Object},members:{type:Object}}}static get INIT_INVITE_FORM_STATE(){return{state:"idle",email:{value:""},role:{value:"DEVELOPER"}}}static get INIT_AUTHORISATIONS(){return{invite:!1,edit:!1,delete:!1}}constructor(){super(),this.authorisations=b.INIT_AUTHORISATIONS,this.inviteMemberForm=b.INIT_INVITE_FORM_STATE,this.members={state:"loading"},this._inviteMemberEmailRef=s(),this._inviteMemberRoleRef=s(),this._memberListHeadingRef=s(),this._noResultMessageRef=s(),new m(this,"cc-orga-member-card",(({suggestedElement:e})=>{null==e&&null!=this._noResultMessageRef.value?this._noResultMessageRef.value.focus():null==e?this._memberListHeadingRef.value.focus():e.focusDeleteBtn()}))}isLastAdmin(e){const t="ADMIN"===e.role;return 1===this._getAdminList().length&&t}_getAdminList(){return this.members.value.filter((e=>"ADMIN"===e.role))}_getRoleOptions(){return[{value:"ADMIN",label:c("cc-orga-member-list.invite.role.admin")},{value:"DEVELOPER",label:c("cc-orga-member-list.invite.role.developer")},{value:"ACCOUNTING",label:c("cc-orga-member-list.invite.role.accounting")},{value:"MANAGER",label:c("cc-orga-member-list.invite.role.manager")}]}_getSortedFilteredMemberList(e,t,i){const r=t?.trim().toLowerCase();return e.filter((e=>{const t=""===r||e.name?.toLowerCase().includes(r)||e.email.toLowerCase().includes(r),s=!i||!e.isMfaEnabled;return t&&s})).sort(((e,t)=>e.isCurrentUser?-1:t.isCurrentUser?1:e.email.localeCompare(t.email,{sensitivity:"base"})))}_onEmailInput({detail:e}){this.inviteMemberForm={...this.inviteMemberForm,email:{...this.inviteMemberForm.email,value:e}}}_onFilterIdentity({detail:e}){this.members={...this.members,identityFilter:e}}_onFilterMfaDisabledOnly(){this.members={...this.members,mfaDisabledOnlyFilter:!this.members.mfaDisabledOnlyFilter}}_onInviteMember(){const e=this.members.value.map((e=>e.email)),t=this.inviteMemberForm.email.value.trim(),i=this._inviteMemberRoleRef.value.value,r=e.includes(t)?"duplicate":null,s=n(t)??r;this.inviteMemberForm={...this.inviteMemberForm,email:{value:t,error:s},role:{value:i}},null==s?o(this,"invite",{email:t,role:i}):this._inviteMemberEmailRef.value.focus()}_onLeaveFromCard({detail:e}){this.isLastAdmin(e)?this.members={...this.members,value:this.members.value.map((t=>t.id===e.id?{...t,error:!0}:{...t}))}:o(this,"leave",e)}_onLeaveFromDangerZone(){const e=this.members.value.find((e=>e.isCurrentUser));this.isLastAdmin(e)?this.members={...this.members,dangerZoneState:"error"}:o(this,"leave",e)}_onRoleInput({detail:e}){this.inviteMemberForm={...this.inviteMemberForm,role:{...this.inviteMemberForm.role,value:e}}}_onUpdateFromCard({detail:e}){e.isCurrentUser&&this.isLastAdmin(e)?this.members={...this.members,value:this.members.value.map((t=>t.id===e.id?{...t,error:!0}:{...t}))}:o(this,"update",e)}_onToggleCardEditing({detail:{memberId:e,newState:t}}){this.members={...this.members,value:this.members.value.map((i=>i.id===e?{...i,state:t}:{...i,state:"loaded"}))}}willUpdate(e){const t="loaded"!==this.members.state;if(!e.has("members")||t)return;const i=this._getAdminList(),r="error"===this.members.dangerZoneState;i.length>1&&(this.members={...this.members,value:this.members.value.map((e=>({...e,error:!1})))}),i.length>1&&r&&(this.members={...this.members,dangerZoneState:"idle"})}render(){return t`<cc-block><div slot=title>${c("cc-orga-member-list.main-heading")}</div>${this.authorisations.invite?this._renderInviteForm():""}<cc-block-section><div slot=title ${a(this._memberListHeadingRef)} tabindex=-1>${c("cc-orga-member-list.list.heading")} ${"loaded"===this.members.state?t`<cc-badge class=member-count weight=dimmed intent=neutral circle>${this.members.value.length}</cc-badge>`:""}</div>${"loading"===this.members.state?t`<cc-loader></cc-loader>`:""} ${"loaded"===this.members.state?this._renderMemberList(this.members.value,this.members.identityFilter,this.members.mfaDisabledOnlyFilter):""} ${"error"===this.members.state?t`<cc-notice intent=warning message=${c("cc-orga-member-list.error")}></cc-notice>`:""}</cc-block-section>${"loaded"===this.members.state?this._renderDangerZone():""}</cc-block>`}_renderInviteForm(){const e="inviting"===this.inviteMemberForm.state;return t`<cc-block-section><div slot=title>${c("cc-orga-member-list.invite.heading")}</div><p class=info>${c("cc-orga-member-list.invite.info")}</p><form class=invite-form><cc-input-text label=${c("cc-orga-member-list.invite.email.label")} .value=${this.inviteMemberForm.email.value} required ?disabled=${e} @cc-input-text:requestimplicitsubmit=${this._onInviteMember} @cc-input-text:input=${this._onEmailInput} ${a(this._inviteMemberEmailRef)}><p slot=help>${c("cc-orga-member-list.invite.email.format")}</p>${this._renderFormEmailError()}</cc-input-text><cc-select label=${c("cc-orga-member-list.invite.role.label")} .options=${this._getRoleOptions()} .value=${this.inviteMemberForm.role.value} required ?disabled=${e} @cc-select:input=${this._onRoleInput} ${a(this._inviteMemberRoleRef)}></cc-select><div class=submit><cc-button primary ?waiting=${e} @cc-button:click=${this._onInviteMember}>${c("cc-orga-member-list.invite.submit")}</cc-button></div></form></cc-block-section>`}_renderFormEmailError(){switch(this.inviteMemberForm.email.error){case"empty":return t`<p slot=error>${c("cc-orga-member-list.invite.email.error-empty")}</p>`;case"invalid":return t`<p slot=error>${c("cc-orga-member-list.invite.email.error-format")}</p>`;case"duplicate":return t`<p slot=error>${c("cc-orga-member-list.invite.email.error-duplicate")}</p>`}return t``}_renderMemberList(e,i,s){const m=this._getSortedFilteredMemberList(e,i,s),n=0===m.length;return t`<div class=filters><cc-input-text label=${c("cc-orga-member-list.filter.name")} .value=${i} @cc-input-text:input=${this._onFilterIdentity}></cc-input-text><label class=filters__mfa for=filter-mfa><input id=filter-mfa type=checkbox @change=${this._onFilterMfaDisabledOnly} .checked=${s}> ${c("cc-orga-member-list.filter.mfa")}</label></div><div class=member-list>${l(m,(e=>e.id),(e=>t`<cc-orga-member-card class=${r({editing:"editing"===e.state})} .authorisations=${{edit:this.authorisations.edit,delete:this.authorisations.delete}} .member=${e} @cc-orga-member-card:leave=${this._onLeaveFromCard} @cc-orga-member-card:toggle-editing=${this._onToggleCardEditing} @cc-orga-member-card:update=${this._onUpdateFromCard}></cc-orga-member-card>`))} ${n?t`<p class=no-result-error ${a(this._noResultMessageRef)} tabindex=-1>${c("cc-orga-member-list.no-result")}</p>`:""}</div>`}_renderDangerZone(){return t`<cc-block-section><div slot=title class=danger>${c("cc-orga-member-list.leave.heading")}</div><div class=leave><p class=leave__text>${c("cc-orga-member-list.leave.text")}</p><cc-button danger outlined @cc-button:click=${this._onLeaveFromDangerZone} ?disabled=${"error"===this.members.dangerZoneState} ?waiting=${"leaving"===this.members.dangerZoneState}>${c("cc-orga-member-list.leave.btn")}</cc-button></div><div class=wrapper-leave-error aria-live=polite aria-atomic=true>${"error"===this.members.dangerZoneState?t`<div><cc-notice intent=danger heading=${c("cc-orga-member-list.leave.error-last-admin.heading")} message=${c("cc-orga-member-list.leave.error-last-admin.text")} no-icon></cc-notice></div>`:""}</div></cc-block-section>`}static get styles(){return[d,i`:host{display:block}.invite-form{display:flex;flex-wrap:wrap;align-items:flex-start;gap:1em 1.5em}.info{margin:.5em 0;font-style:italic}.invite-form cc-input-text{flex:100 1 18em}.invite-form cc-select{flex:1 1 max-content}.submit{display:flex;width:100%;justify-content:flex-end}.member-count{margin-left:.2em;font-size:.9em}.member-list{display:flex;flex-direction:column;gap:1.5em}.filters{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;margin-bottom:1em;gap:1em 2.5em}.filters cc-input-text{flex:0 1 25em}.filters__mfa{display:flex;align-items:center;gap:.35em}.filters__mfa input{width:1.1em;height:1.1em;margin:0}.no-result-error{font-style:italic}cc-orga-member-card.editing{background-color:var(--cc-color-bg-neutral);box-shadow:0 0 0 1em var(--cc-color-bg-neutral)}.leave{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1.5em}.leave p{margin:0}.leave__text{display:flex;flex:1 1 21em;flex-direction:column;gap:.5em}.leave cc-button{margin-left:auto}.wrapper-leave-error{display:flex;justify-content:end}`]}}window.customElements.define("cc-orga-member-list",b);export{b as CcOrgaMemberList};
+import{LitElement as e,html as t,css as i}from"lit";import{classMap as r}from"lit/directives/class-map.js";import{createRef as s,ref as a}from"lit/directives/ref.js";import{repeat as m}from"lit/directives/repeat.js";import{LostFocusController as l}from"./controllers/lost-focus-controller.js";import{dispatchCustomEvent as o}from"./lib/events.js";import{formSubmit as n}from"./lib/form/form-submit-directive.js";import{Validation as c}from"./lib/form/validation.js";import{i18n as d}from"./i18n.js";import{linkStyles as b}from"./templates/cc-link/cc-link.js";import"./cc-block.js";import"./cc-block-section.js";import{CcOrgaMemberCard as g}from"./cc-orga-member-card.js";import"./cc-notice.js";import"./cc-input-text.js";import"./cc-loader.js";import"./cc-button.js";import"./cc-badge.js";import"./cc-select.js";class h extends e{static get properties(){return{authorisations:{type:Object},inviteMemberFormState:{type:Object,attribute:!1},members:{type:Object}}}static get INIT_AUTHORISATIONS(){return{invite:!1,edit:!1,delete:!1}}constructor(){super(),this.authorisations=h.INIT_AUTHORISATIONS,this.inviteMemberFormState={type:"idle"},this.members={state:"loading"},this._inviteMemberFormRef=s(),this._memberListHeadingRef=s(),this._noResultMessageRef=s(),new l(this,"cc-orga-member-card",(({suggestedElement:e})=>{null==e&&null!=this._noResultMessageRef.value?this._noResultMessageRef.value.focus():null==e?this._memberListHeadingRef.value.focus():e instanceof g&&e.focusDeleteBtn()})),this._memberEmailValidator={validate:(e,t)=>("loaded"===this.members.state?this.members.value.map((e=>e.email)):[]).includes(e)?c.invalid("duplicate"):c.VALID},this._memberEmailErrorMessages={duplicate:d("cc-orga-member-list.invite.email.error-duplicate")}}resetInviteMemberForm(){this._inviteMemberFormRef.value?.reset()}isLastAdmin(e){const t="ADMIN"===e.role;return 1===this._getAdminList().length&&t}_getAdminList(){return"loaded"===this.members.state?this.members.value.filter((e=>"ADMIN"===e.role)):[]}_getRoleOptions(){return[{value:"ADMIN",label:d("cc-orga-member-list.invite.role.admin")},{value:"DEVELOPER",label:d("cc-orga-member-list.invite.role.developer")},{value:"ACCOUNTING",label:d("cc-orga-member-list.invite.role.accounting")},{value:"MANAGER",label:d("cc-orga-member-list.invite.role.manager")}]}_getSortedFilteredMemberList(e,t,i){const r=t?.trim().toLowerCase();return e.filter((e=>{const t=""===r||e.name?.toLowerCase().includes(r)||e.email.toLowerCase().includes(r),s=!i||!e.isMfaEnabled;return t&&s})).sort(((e,t)=>e.isCurrentUser?-1:t.isCurrentUser?1:e.email.localeCompare(t.email,[],{sensitivity:"base"})))}_onFilterIdentity({detail:e}){"loaded"===this.members.state&&(this.members={...this.members,identityFilter:e})}_onFilterMfaDisabledOnly(){"loaded"===this.members.state&&(this.members={...this.members,mfaDisabledOnlyFilter:!this.members.mfaDisabledOnlyFilter})}_onInviteMember(e){"string"==typeof e.email&&"string"==typeof e.role&&o(this,"invite",{email:e.email,role:e.role})}_onLeaveFromCard({detail:e}){"loaded"===this.members.state&&this.isLastAdmin(e)?this.members={...this.members,value:this.members.value.map((t=>t.id===e.id?{...t,error:!0}:{...t}))}:o(this,"leave",e)}_onLeaveFromDangerZone(){if("loaded"===this.members.state){const e=this.members.value.find((e=>e.isCurrentUser));this.isLastAdmin(e)?this.members={...this.members,dangerZoneState:"error"}:o(this,"leave",e)}}_onUpdateFromCard({detail:e}){const t=e.isCurrentUser&&this.isLastAdmin(e);"loaded"===this.members.state&&t?this.members={...this.members,value:this.members.value.map((t=>t.id===e.id?{...t,error:!0}:{...t}))}:o(this,"update",e)}_onToggleCardEditing({detail:{memberId:e,newState:t}}){"loaded"===this.members.state&&(this.members={...this.members,value:this.members.value.map((i=>i.id===e?{...i,state:t}:{...i,state:"loaded"}))})}willUpdate(e){if(!e.has("members")||"loaded"!==this.members.state)return;const t=this._getAdminList(),i="error"===this.members.dangerZoneState;t.length>1&&(this.members={...this.members,value:this.members.value.map((e=>({...e,error:!1})))}),t.length>1&&i&&(this.members={...this.members,dangerZoneState:"idle"})}render(){return t`<cc-block><div slot=title>${d("cc-orga-member-list.main-heading")}</div>${this.authorisations.invite?this._renderInviteForm():""}<cc-block-section><div slot=title ${a(this._memberListHeadingRef)} tabindex=-1>${d("cc-orga-member-list.list.heading")} ${"loaded"===this.members.state?t`<cc-badge class=member-count weight=dimmed intent=neutral circle>${this.members.value.length}</cc-badge>`:""}</div>${"loading"===this.members.state?t`<cc-loader></cc-loader>`:""} ${"loaded"===this.members.state?this._renderMemberList(this.members.value,this.members.identityFilter,this.members.mfaDisabledOnlyFilter):""} ${"error"===this.members.state?t`<cc-notice intent=warning message=${d("cc-orga-member-list.error")}></cc-notice>`:""}</cc-block-section>${"loaded"===this.members.state?this._renderDangerZone(this.members):""}</cc-block>`}_renderInviteForm(){const e="inviting"===this.inviteMemberFormState.type;return t`<cc-block-section><div slot=title>${d("cc-orga-member-list.invite.heading")}</div><p class=info>${d("cc-orga-member-list.invite.info")}</p><form class=invite-form ${a(this._inviteMemberFormRef)} ${n(this._onInviteMember.bind(this))}><cc-input-text name=email label=${d("cc-orga-member-list.invite.email.label")} required type=email .customValidator=${this._memberEmailValidator} .customErrorMessages=${this._memberEmailErrorMessages} ?disabled=${e}><p slot=help>${d("cc-orga-member-list.invite.email.format")}</p></cc-input-text><cc-select name=role label=${d("cc-orga-member-list.invite.role.label")} .options=${this._getRoleOptions()} reset-value=DEVELOPER value=DEVELOPER required ?disabled=${e}></cc-select><div class=submit><cc-button primary ?waiting=${e} type=submit>${d("cc-orga-member-list.invite.submit")}</cc-button></div></form></cc-block-section>`}_renderMemberList(e,i,s){const l=this._getSortedFilteredMemberList(e,i,s),o=0===l.length;return t`<div class=filters><cc-input-text label=${d("cc-orga-member-list.filter.name")} .value=${i} @cc-input-text:input=${this._onFilterIdentity}></cc-input-text><label class=filters__mfa for=filter-mfa><input id=filter-mfa type=checkbox @change=${this._onFilterMfaDisabledOnly} .checked=${s}> ${d("cc-orga-member-list.filter.mfa")}</label></div><div class=member-list>${m(l,(e=>e.id),(e=>t`<cc-orga-member-card class=${r({editing:"editing"===e.state})} .authorisations=${{edit:this.authorisations.edit,delete:this.authorisations.delete}} .member=${e} @cc-orga-member-card:leave=${this._onLeaveFromCard} @cc-orga-member-card:toggle-editing=${this._onToggleCardEditing} @cc-orga-member-card:update=${this._onUpdateFromCard}></cc-orga-member-card>`))} ${o?t`<p class=no-result-error ${a(this._noResultMessageRef)} tabindex=-1>${d("cc-orga-member-list.no-result")}</p>`:""}</div>`}_renderDangerZone(e){return t`<cc-block-section><div slot=title class=danger>${d("cc-orga-member-list.leave.heading")}</div><div class=leave><p class=leave__text>${d("cc-orga-member-list.leave.text")}</p><cc-button danger outlined @cc-button:click=${this._onLeaveFromDangerZone} ?disabled=${"error"===e.dangerZoneState} ?waiting=${"leaving"===e.dangerZoneState}>${d("cc-orga-member-list.leave.btn")}</cc-button></div><div class=wrapper-leave-error aria-live=polite aria-atomic=true>${"error"===e.dangerZoneState?t`<div><cc-notice intent=danger heading=${d("cc-orga-member-list.leave.error-last-admin.heading")} message=${d("cc-orga-member-list.leave.error-last-admin.text")} no-icon></cc-notice></div>`:""}</div></cc-block-section>`}static get styles(){return[b,i`:host{display:block}.invite-form{display:flex;flex-wrap:wrap;align-items:flex-start;gap:1em 1.5em}.info{margin:.5em 0;font-style:italic}.invite-form cc-input-text{flex:100 1 18em}.invite-form cc-select{flex:1 1 max-content}.submit{display:flex;width:100%;justify-content:flex-end}.member-count{margin-left:.2em;font-size:.9em}.member-list{display:flex;flex-direction:column;gap:1.5em}.filters{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;margin-bottom:1em;gap:1em 2.5em}.filters cc-input-text{flex:0 1 25em}.filters__mfa{display:flex;align-items:center;gap:.35em}.filters__mfa input{width:1.1em;height:1.1em;margin:0}.no-result-error{font-style:italic}cc-orga-member-card.editing{background-color:var(--cc-color-bg-neutral);box-shadow:0 0 0 1em var(--cc-color-bg-neutral)}.leave{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1.5em}.leave p{margin:0}.leave__text{display:flex;flex:1 1 21em;flex-direction:column;gap:.5em}.leave cc-button{margin-left:auto}.wrapper-leave-error{display:flex;justify-content:end}`]}}window.customElements.define("cc-orga-member-list",h);export{h as CcOrgaMemberList};
 //# sourceMappingURL=cc-orga-member-list.js.map

dist/cc-orga-member-list.smart.js

@@ -1,2 +0,2 @@
-import"./cc-smart-container.js";import{getAllMembers as e,addMember as r,removeMemeber as i,updateMember as t}from"@clevercloud/client/esm/api/v2/organisation.js";import{getId as o}from"@clevercloud/client/esm/api/v2/user.js";import{defineSmartComponent as n}from"./lib/define-smart-component.js";import{i18n as a}from"./i18n.js";import{notifySuccess as m,notifyError as s}from"./lib/notifications.js";import{sendToApi as l}from"./lib/send-to-api.js";import{CcOrgaMemberList as c}from"./cc-orga-member-list.js";function d({apiConfig:e,ownerId:r,id:t}){return i({id:r,userId:t}).then(l({apiConfig:e}))}function g({apiConfig:e,ownerId:r,id:i,newRole:o}){return t({id:r,userId:i},{role:o}).then(l({apiConfig:e}))}n({selector:"cc-orga-member-list",params:{apiConfig:{type:Object},ownerId:{type:String}},onContextUpdate({component:i,context:t,onEvent:n,updateComponent:u,signal:b}){const{apiConfig:f,ownerId:p}=t;function h(e){const r="ADMIN"===e||"MANAGER"===e;u("authorisations",{invite:r,edit:r,delete:r})}function I(e,r){u("members",(i=>{const t=i.value.find((r=>r.id===e));null!=t&&r(t)}))}n("cc-orga-member-list:invite",(({email:e,role:i})=>{u("inviteMemberForm",(e=>{e.state="inviting"})),function({apiConfig:e,ownerId:i,email:t,role:o}){return r({id:i},{email:t,role:o,job:null}).then(l({apiConfig:e}))}({apiConfig:f,ownerId:p,email:e,role:i}).then((()=>{m(a("cc-orga-member-list.invite.submit.success",{userEmail:e})),u("inviteMemberForm",c.INIT_INVITE_FORM_STATE)})).catch((r=>{console.error(r),6451===r.id?s(a("cc-orga-member-list.error.unauthorised.text"),a("cc-orga-member-list.error.unauthorised.heading")):"You have performed that request too much."===r.message?s(a("cc-orga-member-list.invite.submit.error-rate-limit.message"),a("cc-orga-member-list.invite.submit.error-rate-limit.title")):s(a("cc-orga-member-list.invite.submit.error",{userEmail:e})),u("inviteMemberForm",(e=>{e.state="idle"}))}))})),n("cc-orga-member-list:update",(({id:e,role:r,newRole:t,name:o,email:n,isCurrentUser:l})=>{!function(e){return"ADMIN"===e&&"MANAGER"===i.members.value.find((e=>e.isCurrentUser)).role}(r)?(I(e,(e=>{e.state="updating"})),g({apiConfig:f,ownerId:p,id:e,newRole:t,name:o,email:n,isCurrentUser:l}).then((()=>{m(a("cc-orga-member-list.edit.success",{memberIdentity:o??n})),I(e,(e=>{e.state="loaded",e.role=t})),l&&h(t)})).catch((r=>{console.error(r),6451===r.id||6452===r.id?s(a("cc-orga-member-list.error.unauthorised.text"),a("cc-orga-member-list.error.unauthorised.heading")):6501===r.id?s(a("cc-orga-member-list.error-member-not-found.text"),a("cc-orga-member-list.error-member-not-found.heading")):s(a("cc-orga-member-list.edit.error",{memberIdentity:o??n})),I(e,(e=>{e.state="editing"}))}))):s(a("cc-orga-member-list.error.unauthorised.text"),a("cc-orga-member-list.error.unauthorised.heading"))})),n("cc-orga-member-card:delete",(({id:e,name:r,email:i})=>{I(e,(e=>{e.state="deleting"})),d({apiConfig:f,ownerId:p,id:e}).then((()=>{m(a("cc-orga-member-list.delete.success",{memberIdentity:r??i})),u("members",(r=>{r.value=r.value.filter((r=>r.id!==e))}))})).catch((t=>{console.error(t),6452===t.id?s(a("cc-orga-member-list.error.unauthorised.text"),a("cc-orga-member-list.error.unauthorised.heading")):6501===t.id?s(a("cc-orga-member-list.error-member-not-found.text"),a("cc-orga-member-list.error-member-not-found.heading")):s(a("cc-orga-member-list.delete.error",{memberIdentity:r??i})),I(e,(e=>{e.state="loaded"}))}))})),n("cc-orga-member-list:leave",(({id:e})=>{I(e,(e=>{e.state="deleting"})),u("members",(e=>{e.dangerZoneState="leaving"})),d({apiConfig:f,ownerId:p,id:e}).then((()=>{m(a("cc-orga-member-list.leave.success")),h(),u("members",{state:"error"}),window.dispatchEvent(new Event("orga-member-leave-success"))})).catch((r=>{console.error(r),s(a("cc-orga-member-list.leave.error")),I(e,(e=>{e.state="loaded"})),u("members",(e=>{e.dangerZoneState="idle"}))}))})),u("authorisations",c.INIT_AUTHORISATIONS),u("inviteMemberForm",c.INIT_INVITE_FORM_STATE),u("members",{state:"loading"}),function({apiConfig:r,ownerId:i,signal:t}){return Promise.all([o().then(l({apiConfig:r,signal:t})),e({id:i}).then(l({apiConfig:r,signal:t}))]).then((([{ownerId:e},r])=>r.map((({member:r,role:i,job:t})=>({id:r.id,avatar:r.avatar,name:r.name,jobTitle:t,role:i,newRole:i,email:r.email,isMfaEnabled:"TOTP"===r.preferredMFA,isCurrentUser:r.id===e})))))}({apiConfig:f,ownerId:p,signal:b}).then((e=>{h(e.find((e=>e.isCurrentUser)).role),u("members",{state:"loaded",value:e.map((e=>({state:"loaded",...e}))),identityFilter:"",mfaDisabledOnlyFilter:!1})})).catch((e=>{console.error(e),u("members",{state:"error"})}))}});
+import"./cc-smart-container.js";import{getAllMembers as e,addMember as r,removeMemeber as t,updateMember as i}from"@clevercloud/client/esm/api/v2/organisation.js";import{getId as o}from"@clevercloud/client/esm/api/v2/user.js";import{defineSmartComponent as n}from"./lib/define-smart-component.js";import{i18n as a}from"./i18n.js";import{notifySuccess as m,notifyError as s}from"./lib/notifications.js";import{sendToApi as l}from"./lib/send-to-api.js";import{CcOrgaMemberList as c}from"./cc-orga-member-list.js";function d({apiConfig:e,ownerId:r,id:i}){return t({id:r,userId:i}).then(l({apiConfig:e}))}function g({apiConfig:e,ownerId:r,id:t,newRole:o}){return i({id:r,userId:t},{role:o}).then(l({apiConfig:e}))}n({selector:"cc-orga-member-list",params:{apiConfig:{type:Object},ownerId:{type:String}},onContextUpdate({component:t,context:i,onEvent:n,updateComponent:u,signal:b}){const{apiConfig:f,ownerId:p}=i;function h(e){const r="ADMIN"===e||"MANAGER"===e;u("authorisations",{invite:r,edit:r,delete:r})}function v(e,r){u("members",(t=>{const i=t.value.find((r=>r.id===e));null!=i&&r(i)}))}n("cc-orga-member-list:invite",(({email:e,role:i})=>{t.inviteMemberFormState={type:"inviting"},function({apiConfig:e,ownerId:t,email:i,role:o}){return r({id:t},{email:i,role:o,job:null}).then(l({apiConfig:e}))}({apiConfig:f,ownerId:p,email:e.trim(),role:i}).then((()=>{m(a("cc-orga-member-list.invite.submit.success",{userEmail:e})),t.resetInviteMemberForm()})).catch((r=>{console.error(r),6451===r.id?s(a("cc-orga-member-list.error.unauthorised.text"),a("cc-orga-member-list.error.unauthorised.heading")):"You have performed that request too much."===r.message?s(a("cc-orga-member-list.invite.submit.error-rate-limit.message"),a("cc-orga-member-list.invite.submit.error-rate-limit.title")):s(a("cc-orga-member-list.invite.submit.error",{userEmail:e}))})).finally((()=>{t.inviteMemberFormState={type:"idle"}}))})),n("cc-orga-member-list:update",(({id:e,role:r,newRole:i,name:o,email:n,isCurrentUser:l})=>{"loaded"===t.members.state&&(!function(e,r){return"ADMIN"===e&&"MANAGER"===r.find((e=>e.isCurrentUser)).role}(r,t.members.value)?(v(e,(e=>{e.state="updating"})),g({apiConfig:f,ownerId:p,id:e,newRole:i}).then((()=>{m(a("cc-orga-member-list.edit.success",{memberIdentity:o??n})),v(e,(e=>{e.state="loaded",e.role=i})),l&&h(i)})).catch((r=>{console.error(r),6451===r.id||6452===r.id?s(a("cc-orga-member-list.error.unauthorised.text"),a("cc-orga-member-list.error.unauthorised.heading")):6501===r.id?s(a("cc-orga-member-list.error-member-not-found.text"),a("cc-orga-member-list.error-member-not-found.heading")):s(a("cc-orga-member-list.edit.error",{memberIdentity:o??n})),v(e,(e=>{e.state="editing"}))}))):s(a("cc-orga-member-list.error.unauthorised.text"),a("cc-orga-member-list.error.unauthorised.heading")))})),n("cc-orga-member-card:delete",(({id:e,name:r,email:t})=>{v(e,(e=>{e.state="deleting"})),d({apiConfig:f,ownerId:p,id:e}).then((()=>{m(a("cc-orga-member-list.delete.success",{memberIdentity:r??t})),u("members",(r=>{r.value=r.value.filter((r=>r.id!==e))}))})).catch((i=>{console.error(i),6452===i.id?s(a("cc-orga-member-list.error.unauthorised.text"),a("cc-orga-member-list.error.unauthorised.heading")):6501===i.id?s(a("cc-orga-member-list.error-member-not-found.text"),a("cc-orga-member-list.error-member-not-found.heading")):s(a("cc-orga-member-list.delete.error",{memberIdentity:r??t})),v(e,(e=>{e.state="loaded"}))}))})),n("cc-orga-member-list:leave",(({id:e})=>{v(e,(e=>{e.state="deleting"})),u("members",(e=>{e.dangerZoneState="leaving"})),d({apiConfig:f,ownerId:p,id:e}).then((()=>{m(a("cc-orga-member-list.leave.success")),h(),u("members",{state:"error"}),window.dispatchEvent(new Event("orga-member-leave-success"))})).catch((r=>{console.error(r),s(a("cc-orga-member-list.leave.error")),v(e,(e=>{e.state="loaded"})),u("members",(e=>{e.dangerZoneState="idle"}))}))})),u("authorisations",c.INIT_AUTHORISATIONS),t.resetInviteMemberForm(),t.inviteMemberFormState={type:"idle"},u("members",{state:"loading"}),function({apiConfig:r,ownerId:t,signal:i}){return Promise.all([o().then(l({apiConfig:r,signal:i})),e({id:t}).then(l({apiConfig:r,signal:i}))]).then((([{ownerId:e},r])=>r.map((({member:r,role:t,job:i})=>({id:r.id,avatar:r.avatar,name:r.name,jobTitle:i,role:t,email:r.email,isMfaEnabled:"TOTP"===r.preferredMFA,isCurrentUser:r.id===e})))))}({apiConfig:f,ownerId:p,signal:b}).then((e=>{h(e.find((e=>e.isCurrentUser)).role),u("members",{state:"loaded",value:e.map((e=>({state:"loaded",...e}))),identityFilter:"",mfaDisabledOnlyFilter:!1})})).catch((e=>{console.error(e),u("members",{state:"error"})}))}});
 //# sourceMappingURL=cc-orga-member-list.smart.js.map

dist/cc-select.js

@@ -1,2 +0,2 @@
-import{LitElement as e,html as r,css as o}from"lit";import{classMap as t}from"lit/directives/class-map.js";import{ifDefined as l}from"lit/directives/if-defined.js";import{dispatchCustomEvent as i}from"./lib/events.js";import{i18n as a}from"./i18n.js";class n extends e{static get properties(){return{disabled:{type:Boolean,reflect:!0},inline:{type:Boolean,reflect:!0},label:{type:String},name:{type:String,reflect:!0},options:{type:Array},placeholder:{type:String},required:{type:Boolean},value:{type:String},_hasError:{type:Boolean,state:!0}}}constructor(){super(),this.disabled=!1,this.inline=!1,this.name=null,this.label=null,this.options=[],this.placeholder=null,this.required=!1,this.value=null,this._hasError=!1}updated(e){(e.has("value")||e.has("options"))&&(this.shadowRoot.querySelector("select").value=this.value)}focus(){this.shadowRoot.querySelector("select").focus()}_onSelectInput(e){this.value=e.target.value,i(this,"input",this.value)}_onErrorSlotChanged(e){this._hasError=e.target.assignedNodes()?.length>0}render(){return r`<label for=input-id><span class=label-text>${this.label}</span> ${this.required?r`<span class=required>${a("cc-select.required")}</span>`:""}</label><div class="${t({disabled:this.disabled})} select-wrapper"><select id=input-id class=${t({error:this._hasError})} ?disabled=${this.disabled} aria-describedby="help-id error-id" @input=${this._onSelectInput} .value=${this.value} name=${l(this.name??void 0)}>${null!=this.placeholder&&""!==this.placeholder?r`<option value="" ?disabled=${this.required}>${this.placeholder}</option>`:""} ${this.options.map((e=>r`<option value=${e.value}>${e.label}</option>`))}</select></div><div class=help-container id=help-id><slot name=help></slot></div><div class=error-container id=error-id><slot name=error @slotchange=${this._onErrorSlotChanged}></slot></div>`}static get styles(){return[o`:host{display:inline-block}:host([inline]){display:inline-grid;align-items:baseline;gap:0 1em;grid-auto-rows:min-content;grid-template-areas:'label input' 'label help' 'label error';grid-template-columns:auto 1fr}.help-container{grid-area:help}.error-container{grid-area:error}label{display:flex;align-items:flex-end;justify-content:space-between;padding-bottom:.35em;cursor:pointer;gap:2em;line-height:1.25em}label .label-text{color:var(--cc-select-label-color,inherit);font-size:var(--cc-select-label-font-size,inherit);font-weight:var(--cc-select-label-font-weight,normal)}:host([inline]) label{flex-direction:column;padding:0;gap:0;grid-area:label;line-height:normal}.required{color:var(--cc-color-text-weak);font-size:.9em;font-variant:small-caps}:host([inline]) .required{font-size:.8em}slot[name=help]::slotted(*){margin:.3em 0 0;color:var(--cc-color-text-weak);font-size:.9em}slot[name=error]::slotted(*){margin:.5em 0 0;color:var(--cc-color-text-danger)}select{width:100%;padding:0 3em 0 .5em;border:none;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:0 0;color:inherit;cursor:inherit;font-family:inherit;font-size:inherit;line-height:inherit;height:2em;box-sizing:border-box;border:1px solid var(--cc-color-border-neutral-strong,#aaa);background-color:var(--cc-color-bg-default,#fff);border-radius:var(--cc-border-radius-default,.25em);grid-area:input}select:hover{border-color:var(--cc-color-border-neutral-hovered,#777);cursor:pointer}select:focus{border-color:var(--cc-color-border-neutral-focused,#777);outline:var(--cc-focus-outline,#000 solid 2px);outline-offset:var(--cc-focus-outline-offset,2px)}select.error{border-color:var(--cc-color-border-danger)!important}select.error:focus{outline:var(--cc-focus-outline-error,#000 solid 2px);outline-offset:var(--cc-focus-outline-offset,2px)}.select-wrapper{position:relative;display:inline-flex;width:100%;vertical-align:top}.select-wrapper::after{position:absolute;top:50%;right:.5em;width:.8em;height:.5em;background-color:var(--cc-color-bg-primary,#000);clip-path:polygon(100% 0,0 0,50% 100%);content:'';pointer-events:none;transform:translateY(-50%)}.disabled::after{background-color:hsl(0deg 0% 62%)}select[disabled]{border-color:var(--cc-color-border-neutral-disabled,#777);background:var(--cc-color-bg-neutral-disabled);color:var(--cc-color-text-weak);opacity:1;pointer-events:none}`]}}window.customElements.define("cc-select",n);export{n as CcSelect};
+import{html as e,css as r}from"lit";import{classMap as t}from"lit/directives/class-map.js";import{createRef as o,ref as i}from"lit/directives/ref.js";import{dispatchCustomEvent as l}from"./lib/events.js";import{C as a}from"./cc-form-control-element.abstract-195f103f.js";import{RequiredValidator as s}from"./lib/form/validation.js";import{i18n as n}from"./i18n.js";const c={get empty(){return n("cc-select.error.empty")}};class d extends a{static get properties(){return{...super.properties,disabled:{type:Boolean,reflect:!0},inline:{type:Boolean,reflect:!0},label:{type:String},options:{type:Array},placeholder:{type:String},required:{type:Boolean},resetValue:{type:String,attribute:"reset-value"},value:{type:String}}}static reactiveValidationProperties=["required","options"];constructor(){super(),this.disabled=!1,this.inline=!1,this.label=null,this.options=[],this.placeholder=null,this.required=!1,this.resetValue="",this.value=null,this._errorRef=o(),this._selectRef=o()}_getFormControlElement(){return this._selectRef.value}_getErrorElement(){return this._errorRef.value}_getErrorMessages(){return c}_getValidator(){return this.required?new s:null}_getReactiveValidationProperties(){return d.reactiveValidationProperties}focus(){this._selectRef.value?.focus()}_onSelectInput(e){this.value=e.target.value,l(this,"input",this.value)}updated(e){(e.has("value")||e.has("options"))&&(this.shadowRoot.querySelector("select").value=this.value),super.updated(e)}render(){const r=null!=this.errorMessage&&""!==this.errorMessage;return e`<label for=input-id><span class=label-text>${this.label}</span> ${this.required?e`<span class=required>${n("cc-select.required")}</span>`:""}</label><div class="${t({disabled:this.disabled})} select-wrapper"><select id=input-id class=${t({error:r})} ?disabled=${this.disabled} aria-describedby="help-id error-id" @input=${this._onSelectInput} .value=${this.value} ${i(this._selectRef)}>${null!=this.placeholder&&""!==this.placeholder?e`<option value="" ?disabled=${this.required}>${this.placeholder}</option>`:""} ${this.options.map((r=>e`<option value=${r.value}>${r.label}</option>`))}</select></div><div class=help-container id=help-id><slot name=help></slot></div>${r?e`<p class=error-container id=error-id ${i(this._errorRef)}>${this.errorMessage}</p>`:""}`}static get styles(){return[r`:host{display:inline-block}:host([inline]){display:inline-grid;align-items:baseline;gap:0 1em;grid-auto-rows:min-content;grid-template-areas:'label input' 'label help' 'label error';grid-template-columns:auto 1fr}.help-container{grid-area:help}.error-container{grid-area:error}label{display:flex;align-items:flex-end;justify-content:space-between;padding-bottom:.35em;cursor:pointer;gap:2em;line-height:1.25em}label .label-text{color:var(--cc-select-label-color,inherit);font-size:var(--cc-select-label-font-size,inherit);font-weight:var(--cc-select-label-font-weight,normal)}:host([inline]) label{flex-direction:column;padding:0;gap:0;grid-area:label;line-height:normal}.required{color:var(--cc-color-text-weak);font-size:.9em;font-variant:small-caps}:host([inline]) .required{font-size:.8em}slot[name=help]::slotted(*){margin:.3em 0 0;color:var(--cc-color-text-weak);font-size:.9em}.error-container{margin:.5em 0 0;color:var(--cc-color-text-danger)}select{width:100%;padding:0 3em 0 .5em;border:none;margin:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;background:0 0;color:inherit;cursor:inherit;font-family:inherit;font-size:inherit;line-height:inherit;height:2em;box-sizing:border-box;border:1px solid var(--cc-color-border-neutral-strong,#aaa);background-color:var(--cc-color-bg-default,#fff);border-radius:var(--cc-border-radius-default,.25em);grid-area:input}select:hover{border-color:var(--cc-color-border-neutral-hovered,#777);cursor:pointer}select:focus{border-color:var(--cc-color-border-neutral-focused,#777);outline:var(--cc-focus-outline,#000 solid 2px);outline-offset:var(--cc-focus-outline-offset,2px)}select.error{border-color:var(--cc-color-border-danger)!important}select.error:focus{outline:var(--cc-focus-outline-error,#000 solid 2px);outline-offset:var(--cc-focus-outline-offset,2px)}.select-wrapper{position:relative;display:inline-flex;width:100%;vertical-align:top}.select-wrapper::after{position:absolute;top:50%;right:.5em;width:.8em;height:.5em;background-color:var(--cc-color-bg-primary,#000);clip-path:polygon(100% 0,0 0,50% 100%);content:'';pointer-events:none;transform:translateY(-50%)}.disabled::after{background-color:hsl(0deg 0% 62%)}select[disabled]{border-color:var(--cc-color-border-neutral-disabled,#777);background:var(--cc-color-bg-neutral-disabled);color:var(--cc-color-text-weak);opacity:1;pointer-events:none}`]}}window.customElements.define("cc-select",d);export{d as CcSelect};
 //# sourceMappingURL=cc-select.js.map

dist/cc-ssh-key-list.js

@@ -1,2 +0,2 @@
-import"./cc-button.js";import"./cc-badge.js";import"./cc-icon.js";import"./cc-img.js";import"./cc-input-text.js";import"./cc-notice.js";import"./cc-block.js";import"./cc-block-section.js";import{LitElement as e,html as t,css as i}from"lit";import{classMap as s}from"lit/directives/class-map.js";import{createRef as r,ref as c}from"lit/directives/ref.js";import{repeat as o}from"lit/directives/repeat.js";import{iconRemixKey_2Fill as a,iconRemixDeleteBin_5Fill as n,iconRemixAddCircleFill as l}from"./assets/cc-remix.icons.js";import{LostFocusController as y}from"./controllers/lost-focus-controller.js";import{dispatchCustomEvent as m}from"./lib/events.js";import{fakeString as d}from"./lib/fake-strings.js";import{i18n as u}from"./i18n.js";import{sortBy as h}from"./lib/utils.js";import{skeletonStyles as p}from"./styles/skeleton.js";const k=[{state:"idle",name:d(15),fingerprint:d(32)}];class b extends e{static get properties(){return{createSshKeyForm:{type:Object,attribute:"create-ssh-key-form"},keyData:{type:Object,attribute:"key-data"}}}static get CREATE_FORM_INIT_STATE(){return{state:"idle",name:{value:""},publicKey:{value:""}}}constructor(){super(),this.createSshKeyForm=b.CREATE_FORM_INIT_STATE,this.keyData={state:"loading"},this._createFormNameRef=r(),this._createFormPublicKeyRef=r(),new y(this,".key--personal",(({suggestedElement:e})=>{null==e?this.shadowRoot.querySelector("#personal-keys-empty-msg")?.focus():e?.querySelector("cc-button").focus()})),new y(this,".key--github",(({removedElement:e,suggestedElement:t})=>{null==t?this.shadowRoot.querySelector("#github-keys-empty-msg")?.focus():t?.querySelector("cc-button").focus()}))}_onCreateKey(){const e=this._createFormNameRef.value.value,t=this._createFormPublicKeyRef.value.value,i=e.trim(),s=t.trim(),r=i?.length>0,c=s?.length>0,o=r?null:"required";let a=c?null:"required";const n=c&&t.toLowerCase().match(" private ");n&&(a="private-key"),this.createSshKeyForm={state:"idle",name:{value:i,error:o},publicKey:{value:s,error:a}};if(!r||!c||n)null!=this.createSshKeyForm.name.error?this._createFormNameRef.value.focus():null!=this.createSshKeyForm.publicKey.error&&this._createFormPublicKeyRef.value.focus();else{m(this,"create",{name:i,publicKey:s})}}_onDeleteKey(e){const{state:t,...i}=e;m(this,"delete",i)}_onImportKey(e){const{state:t,...i}=e;m(this,"import",i)}_onNameInput({detail:e}){this.createSshKeyForm={...this.createSshKeyForm,name:{...this.createSshKeyForm.name,value:e}}}_onPublicKeyInput({detail:e}){this.createSshKeyForm={...this.createSshKeyForm,publicKey:{...this.createSshKeyForm.publicKey,value:e}}}render(){const e=this.keyData.state;return t`<cc-block><div slot=title>${u("cc-ssh-key-list.title")}</div><cc-block-section><div slot=title>${u("cc-ssh-key-list.add.title")}</div><div slot=info>${u("cc-ssh-key-list.add.info")}</div>${this._renderCreateSshKeyForm()}</cc-block-section><cc-block-section><div slot=title><span>${u("cc-ssh-key-list.personal.title")}</span> ${"loaded"===e&&this.keyData.personalKeys.length>2?t`<cc-badge circle>${this.keyData.personalKeys.length}</cc-badge>`:""}</div><div slot=info>${u("cc-ssh-key-list.personal.info")}</div>${"loading"===e?t`${this._renderKeyList("skeleton",k)}`:""} ${"loaded"===e?t`${0===this.keyData.personalKeys.length?t`<p class=info-msg id=personal-keys-empty-msg tabindex=-1>${u("cc-ssh-key-list.personal.empty")}</p>`:""} ${this._renderKeyList("personal",this.keyData.personalKeys)}`:""} ${"error"===e?t`<cc-notice intent=warning message=${u("cc-ssh-key-list.error.loading")}></cc-notice>`:""}</cc-block-section><cc-block-section><div slot=title><span>${u("cc-ssh-key-list.github.title")}</span> ${"loaded"===e&&this.keyData.isGithubLinked&&this.keyData.githubKeys.length>2?t`<cc-badge circle>${this.keyData.githubKeys.length}</cc-badge>`:""}</div><div slot=info>${u("cc-ssh-key-list.github.info")}</div>${"loading"===e?t`${this._renderKeyList("skeleton",k)}`:""} ${"loaded"!==e||this.keyData.isGithubLinked?"":t`<p class=info-msg>${u("cc-ssh-key-list.github.unlinked")}</p>`} ${"loaded"===e&&this.keyData.isGithubLinked?t`${0===this.keyData.githubKeys.length?t`<p class=info-msg id=github-keys-empty-msg tabindex=-1>${u("cc-ssh-key-list.github.empty")}</p>`:""} ${this._renderKeyList("github",this.keyData.githubKeys)}`:""} ${"error"===e?t`<cc-notice intent=warning message=${u("cc-ssh-key-list.error.loading")}></cc-notice>`:""}</cc-block-section><cc-block-section><div class=align-end>${u("cc-ssh-key-list.doc.info")}</div></cc-block-section></cc-block>`}_renderCreateSshKeyForm(){return t`<div class=create-form><cc-input-text ?disabled=${"creating"===this.createSshKeyForm.state} @cc-input-text:input=${this._onNameInput} @cc-input-text:requestimplicitsubmit=${this._onCreateKey} .value=${this.createSshKeyForm.name?.value} class=create-form__name label=${u("cc-ssh-key-list.add.name")} required ${c(this._createFormNameRef)}>${"required"===this.createSshKeyForm.name.error?t`<p slot=error>${u("cc-ssh-key-list.error.required.name")}</p>`:""}</cc-input-text><cc-input-text ?disabled=${"creating"===this.createSshKeyForm.state} @cc-input-text:input=${this._onPublicKeyInput} @cc-input-text:requestimplicitsubmit=${this._onCreateKey} .value=${this.createSshKeyForm.publicKey?.value} class=create-form__public-key label=${u("cc-ssh-key-list.add.public-key")} required ${c(this._createFormPublicKeyRef)}>${"required"===this.createSshKeyForm.publicKey.error?t`<p slot=error>${u("cc-ssh-key-list.error.required.public-key")}</p>`:""} ${"private-key"===this.createSshKeyForm.publicKey.error?t`<p slot=error>${u("cc-ssh-key-list.error.private-key")}</p>`:""}</cc-input-text><div class=create-form__footer><cc-button @cc-button:click=${this._onCreateKey} class=create-form__add-btn primary ?waiting=${"creating"===this.createSshKeyForm.state}>${u("cc-ssh-key-list.add.btn")}</cc-button></div></div>`}_renderKeyList(e,i){const r=[...i].sort(h("name")),c="skeleton"===e;return t`<div class=key-list>${o(r,(e=>e.name),(i=>{const r=i.name,o=!c&&"idle"!==i.state;return t`<div class="${s({"key--personal":"personal"===e,"key--github":"github"===e,"key--skeleton":c,"is-disabled":o})} key"><div class=key__icon><cc-icon .icon=${a} size=lg ?skeleton=${c}></cc-icon></div><div class=key__name><span class=${s({skeleton:c})}>${r}</span></div><div class=key__form><div class="${s({skeleton:c})} key__fingerprint">${i.fingerprint}</div>${"personal"===e?t`<cc-button @cc-button:click=${()=>this._onDeleteKey(i)} a11y-name=${u("cc-ssh-key-list.personal.delete.a11y",{name:r})} class="key__button key__button--personal" .icon=${n} ?disabled=${o} danger outlined ?waiting=${o}>${u("cc-ssh-key-list.personal.delete")}</cc-button>`:""} ${"github"===e?t`<cc-button @cc-button:click=${()=>this._onImportKey(i)} a11y-name=${u("cc-ssh-key-list.github.import.a11y",{name:r})} class="key__button key__button--github" .icon=${l} ?disabled=${o} ?waiting=${o}>${u("cc-ssh-key-list.github.import")}</cc-button>`:""} ${"skeleton"===e?t`<cc-button class="key__button key__button--skeleton" .icon=${l} skeleton>${d(10)}</cc-button>`:""}</div></div>`}))}</div>`}static get styles(){return[p,i`:host{--skeleton-color:#bbb;display:block}.create-form{display:flex;flex-direction:column;gap:1em}.create-form__public-key{--cc-input-font-family:var(--cc-ff-monospace)}.create-form__footer{margin-inline-start:auto}.key-list{display:flex;flex-direction:column;gap:2.5em}.key{display:grid;gap:.5em .75em;grid-template-areas:'key-icon key-name' '. key-form';grid-template-columns:min-content 1fr}.key.is-disabled{cursor:default;opacity:var(--cc-opacity-when-disabled)}.key__icon{grid-area:key-icon}.key__name{align-self:flex-end;font-size:1.125em;font-weight:700;grid-area:key-name;word-break:break-word}.key__form{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:1em;grid-area:key-form}.key__fingerprint{flex-basis:min(100%,21.25em);flex-grow:1;padding:.5em .75em;background-color:var(--cc-color-bg-neutral);border-inline-start:5px solid #a6a6a6;border-radius:.125em;font-family:var(--cc-ff-monospace);line-height:1.5;word-break:break-word}.key__button--personal{--cc-icon-size:18px}.key__button--github,.key__button--skeleton{--cc-icon-size:20px}[slot=info] code{display:inline-block;padding:.25em .75em;border:1px solid var(--cc-color-border-neutral-weak,#eee);background-color:var(--cc-color-bg-neutral);border-radius:var(--cc-border-radius-default,.25em);font-family:var(--cc-ff-monospace);font-size:.9em;line-height:2;white-space:pre-wrap;word-break:break-all}.key--skeleton .skeleton{background-color:var(--skeleton-color)}.info-msg{margin-top:1em;margin-bottom:0;color:var(--cc-color-text-weak);font-style:italic;line-height:1.5}.align-end{text-align:end}`]}}window.customElements.define("cc-ssh-key-list",b);export{b as CcSshKeyList};
+import"./cc-button.js";import"./cc-badge.js";import"./cc-icon.js";import"./cc-img.js";import"./cc-input-text.js";import"./cc-notice.js";import"./cc-block.js";import"./cc-block-section.js";import{LitElement as e,html as t,css as s}from"lit";import{classMap as i}from"lit/directives/class-map.js";import{createRef as o,ref as c}from"lit/directives/ref.js";import{repeat as a}from"lit/directives/repeat.js";import{iconRemixKey_2Fill as r,iconRemixDeleteBin_5Fill as n,iconRemixAddCircleFill as l}from"./assets/cc-remix.icons.js";import{LostFocusController as d}from"./controllers/lost-focus-controller.js";import{dispatchCustomEvent as y}from"./lib/events.js";import{fakeString as m}from"./lib/fake-strings.js";import{focusBySelector as k}from"./lib/focus-helper.js";import{formSubmit as p}from"./lib/form/form-submit-directive.js";import{Validation as b}from"./lib/form/validation.js";import{i18n as h}from"./i18n.js";import{sortBy as u}from"./lib/utils.js";import{skeletonStyles as g}from"./styles/skeleton.js";const f=[{state:"idle",name:m(15),fingerprint:m(32)}];class _{validate(e,t){return e.toLowerCase().match(" private ")?b.invalid("private-key"):b.VALID}}class $ extends e{static get properties(){return{createKeyFormState:{type:Object,attribute:!1},keyData:{type:Object,attribute:"key-data"}}}constructor(){super(),this.createKeyFormState={type:"idle"},this.keyData={state:"loading"},this._createFormRef=o(),new d(this,".key--personal",(({suggestedElement:e})=>{k(this.shadowRoot,null==e?"#personal-keys-empty-msg":"cc-button")})),new d(this,".key--github",(({suggestedElement:e})=>{k(this.shadowRoot,null==e?"#github-keys-empty-msg":"cc-button")})),this._nameErrorMessages={empty:()=>h("cc-ssh-key-list.error.required.name")},this._keyValidator=new _,this._keyErrorMessages={empty:()=>h("cc-ssh-key-list.error.required.public-key"),"private-key":()=>h("cc-ssh-key-list.error.private-key")}}resetCreateKeyForm(){this._createFormRef.value?.reset()}_onCreateKey(e){if("string"==typeof e.name&&"string"==typeof e.publicKey){const t={name:e.name,publicKey:e.publicKey};y(this,"create",t)}}_onDeleteKey(e){const{state:t,...s}=e;y(this,"delete",s)}_onImportKey(e){const{state:t,...s}=e;y(this,"import",s)}render(){return t`<cc-block><div slot=title>${h("cc-ssh-key-list.title")}</div><cc-block-section><div slot=title>${h("cc-ssh-key-list.add.title")}</div><div slot=info>${h("cc-ssh-key-list.add.info")}</div>${this._renderCreateSshKeyForm()}</cc-block-section><cc-block-section><div slot=title><span>${h("cc-ssh-key-list.personal.title")}</span> ${"loaded"===this.keyData.state&&this.keyData.personalKeys.length>2?t`<cc-badge circle>${this.keyData.personalKeys.length}</cc-badge>`:""}</div><div slot=info>${h("cc-ssh-key-list.personal.info")}</div>${"loading"===this.keyData.state?t`${this._renderKeyList("skeleton",f)}`:""} ${"loaded"===this.keyData.state?t`${0===this.keyData.personalKeys.length?t`<p class=info-msg id=personal-keys-empty-msg tabindex=-1>${h("cc-ssh-key-list.personal.empty")}</p>`:""} ${this._renderKeyList("personal",this.keyData.personalKeys)}`:""} ${"error"===this.keyData.state?t`<cc-notice intent=warning message=${h("cc-ssh-key-list.error.loading")}></cc-notice>`:""}</cc-block-section><cc-block-section><div slot=title><span>${h("cc-ssh-key-list.github.title")}</span> ${"loaded"===this.keyData.state&&this.keyData.isGithubLinked&&this.keyData.githubKeys.length>2?t`<cc-badge circle>${this.keyData.githubKeys.length}</cc-badge>`:""}</div><div slot=info>${h("cc-ssh-key-list.github.info")}</div>${"loading"===this.keyData.state?t`${this._renderKeyList("skeleton",f)}`:""} ${"loaded"!==this.keyData.state||this.keyData.isGithubLinked?"":t`<p class=info-msg>${h("cc-ssh-key-list.github.unlinked")}</p>`} ${"loaded"===this.keyData.state&&this.keyData.isGithubLinked?t`${0===this.keyData.githubKeys.length?t`<p class=info-msg id=github-keys-empty-msg tabindex=-1>${h("cc-ssh-key-list.github.empty")}</p>`:""} ${this._renderKeyList("github",this.keyData.githubKeys)}`:""} ${"error"===this.keyData.state?t`<cc-notice intent=warning message=${h("cc-ssh-key-list.error.loading")}></cc-notice>`:""}</cc-block-section><cc-block-section><div class=align-end>${h("cc-ssh-key-list.doc.info")}</div></cc-block-section></cc-block>`}_renderCreateSshKeyForm(){const e="creating"===this.createKeyFormState.type;return t`<form class=create-form ${c(this._createFormRef)} ${p(this._onCreateKey.bind(this))}><cc-input-text name=name ?disabled=${e} class=create-form__name label=${h("cc-ssh-key-list.add.name")} required .customErrorMessages=${this._nameErrorMessages}></cc-input-text><cc-input-text name=publicKey ?disabled=${e} class=create-form__public-key label=${h("cc-ssh-key-list.add.public-key")} required .customErrorMessages=${this._keyErrorMessages} .customValidator=${this._keyValidator}></cc-input-text><div class=create-form__footer><cc-button class=create-form__add-btn primary type=submit ?waiting=${e}>${h("cc-ssh-key-list.add.btn")}</cc-button></div></form>`}_renderKeyList(e,s){const o=[...s].sort(u("name")),c="skeleton"===e;return t`<div class=key-list>${a(o,(e=>e.name),(s=>{const o=s.name,a=!c&&"idle"!==s.state;return t`<div class="${i({"key--personal":"personal"===e,"key--github":"github"===e,"key--skeleton":c,"is-disabled":a})} key"><div class=key__icon><cc-icon .icon=${r} size=lg ?skeleton=${c}></cc-icon></div><div class=key__name><span class=${i({skeleton:c})}>${o}</span></div><div class=key__form><div class="${i({skeleton:c})} key__fingerprint">${s.fingerprint}</div>${"personal"===e?t`<cc-button @cc-button:click=${()=>this._onDeleteKey(s)} a11y-name=${h("cc-ssh-key-list.personal.delete.a11y",{name:o})} class="key__button key__button--personal" .icon=${n} ?disabled=${a} danger outlined ?waiting=${a}>${h("cc-ssh-key-list.personal.delete")}</cc-button>`:""} ${"github"===e?t`<cc-button @cc-button:click=${()=>this._onImportKey(s)} a11y-name=${h("cc-ssh-key-list.github.import.a11y",{name:o})} class="key__button key__button--github" .icon=${l} ?disabled=${a} ?waiting=${a}>${h("cc-ssh-key-list.github.import")}</cc-button>`:""} ${"skeleton"===e?t`<cc-button class="key__button key__button--skeleton" .icon=${l} skeleton>${m(10)}</cc-button>`:""}</div></div>`}))}</div>`}static get styles(){return[g,s`:host{--skeleton-color:#bbb;display:block}.create-form{display:flex;flex-direction:column;gap:1em}.create-form__public-key{--cc-input-font-family:var(--cc-ff-monospace)}.create-form__footer{margin-inline-start:auto}.key-list{display:flex;flex-direction:column;gap:2.5em}.key{display:grid;gap:.5em .75em;grid-template-areas:'key-icon key-name' '. key-form';grid-template-columns:min-content 1fr}.key.is-disabled{cursor:default;opacity:var(--cc-opacity-when-disabled)}.key__icon{grid-area:key-icon}.key__name{align-self:flex-end;font-size:1.125em;font-weight:700;grid-area:key-name;word-break:break-word}.key__form{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:1em;grid-area:key-form}.key__fingerprint{flex-basis:min(100%,21.25em);flex-grow:1;padding:.5em .75em;background-color:var(--cc-color-bg-neutral);border-inline-start:5px solid #a6a6a6;border-radius:.125em;font-family:var(--cc-ff-monospace);line-height:1.5;word-break:break-word}.key__button--personal{--cc-icon-size:18px}.key__button--github,.key__button--skeleton{--cc-icon-size:20px}[slot=info] code{display:inline-block;padding:.25em .75em;border:1px solid var(--cc-color-border-neutral-weak,#eee);background-color:var(--cc-color-bg-neutral);border-radius:var(--cc-border-radius-default,.25em);font-family:var(--cc-ff-monospace);font-size:.9em;line-height:2;white-space:pre-wrap;word-break:break-all}.key--skeleton .skeleton{background-color:var(--skeleton-color)}.info-msg{margin-top:1em;margin-bottom:0;color:var(--cc-color-text-weak);font-style:italic;line-height:1.5}.align-end{text-align:end}`]}}window.customElements.define("cc-ssh-key-list",$);export{$ as CcSshKeyList};
 //# sourceMappingURL=cc-ssh-key-list.js.map

dist/cc-ssh-key-list.smart.js

@@ -1,2 +0,2 @@
-import"./cc-smart-container.js";import{getKeys as e}from"@clevercloud/client/esm/api/v2/github.js";import{get as t}from"@clevercloud/client/esm/api/v2/organisation.js";import{todo_addSshKey as n,todo_removeSshKey as i,todo_getSshKeys as s}from"@clevercloud/client/esm/api/v2/user.js";import{ONE_DAY as a}from"@clevercloud/client/esm/with-cache.js";import{defineSmartComponent as o}from"./lib/define-smart-component.js";import{i18n as c}from"./i18n.js";import{notifySuccess as r,notifyError as l}from"./lib/notifications.js";import{sendToApi as m}from"./lib/send-to-api.js";import{CcSshKeyList as y}from"./cc-ssh-key-list.js";async function p({apiConfig:e,key:t}){const i=encodeURIComponent(t.name),s=t.key;return n({key:i},JSON.stringify(s)).then(m({apiConfig:e}))}o({selector:"cc-ssh-key-list",params:{apiConfig:{type:Object}},onContextUpdate({component:n,context:o,onEvent:f,updateComponent:g,signal:d}){const{apiConfig:k}=o;function u(){return async function({apiConfig:n,signal:i,cacheDelay:o}){const[c,r]=await Promise.all([t({}).then(m({apiConfig:n,signal:i,cacheDelay:a})),s().then(m({apiConfig:n,signal:i,cacheDelay:o}))]),l=c.oauthApps.includes("github");let y;l&&(y=await e().then(m({apiConfig:n,signal:i,cacheDelay:o})));return{isGithubLinked:l,personalKeys:r,githubKeys:y}}({apiConfig:k,signal:d,cacheDelay:0}).then((({isGithubLinked:e,personalKeys:t,githubKeys:n})=>{g("keyData",{state:"loaded",isGithubLinked:e,personalKeys:t.map((e=>({...e,state:"idle"}))),githubKeys:n?.map((e=>({...e,state:"idle"})))})})).catch((e=>{console.error(e),g("keyData",{state:"error"})}))}f("cc-ssh-key-list:create",(({name:e,publicKey:t})=>{g("createSshKeyForm",(e=>{e.state="creating"})),p({apiConfig:k,key:{name:e,key:t}}).then((()=>{u().then((()=>{r(c("cc-ssh-key-list.success.add",{name:e})),g("createSshKeyForm",y.CREATE_FORM_INIT_STATE)}))})).catch((t=>{console.error(t),l(t,c("cc-ssh-key-list.error.add",{name:e})),g("createSshKeyForm",(e=>{e.state="idle"}))}))})),f("cc-ssh-key-list:delete",(({name:e})=>{g("keyData",(t=>{t.personalKeys.find((t=>t.name===e)).state="deleting"})),async function({apiConfig:e,key:t}){const n=encodeURIComponent(t.name);return i({key:n}).then(m({apiConfig:e}))}({apiConfig:k,key:{name:e}}).then((()=>{u().then((()=>r(c("cc-ssh-key-list.success.delete",{name:e}))))})).catch((t=>{console.error(t),l(t,c("cc-ssh-key-list.error.delete",{name:e})),g("keyData",(t=>{t.personalKeys.find((t=>t.name===e)).state="idle"}))}))})),f("cc-ssh-key-list:import",(({name:e,key:t,fingerprint:n})=>{g("keyData",(t=>{t.githubKeys.find((t=>t.name===e)).state="importing"})),h({apiConfig:k,key:{name:e,key:t}}).then((()=>{r(c("cc-ssh-key-list.success.import",{name:e})),g("keyData",(t=>{t.personalKeys.push({state:"idle",name:e,fingerprint:n}),t.githubKeys=t.githubKeys.filter((t=>t.name!==e))}))})).catch((t=>{console.error(t),l(t,c("cc-ssh-key-list.error.import",{name:e})),g("keyData",(t=>{t.githubKeys.find((t=>t.name===e)).state="idle"}))}))})),g("createSshKeyForm",y.CREATE_FORM_INIT_STATE),g("keyData",{state:"loading"}),u()}});const h=p;
+import"./cc-smart-container.js";import{getKeys as e}from"@clevercloud/client/esm/api/v2/github.js";import{get as t}from"@clevercloud/client/esm/api/v2/organisation.js";import{todo_addSshKey as i,todo_removeSshKey as n,todo_getSshKeys as a}from"@clevercloud/client/esm/api/v2/user.js";import{ONE_DAY as s}from"@clevercloud/client/esm/with-cache.js";import{defineSmartComponent as o}from"./lib/define-smart-component.js";import{i18n as c}from"./i18n.js";import{notifySuccess as r,notifyError as l}from"./lib/notifications.js";import{sendToApi as m}from"./lib/send-to-api.js";import"./cc-ssh-key-list.js";async function y({apiConfig:e,key:t}){const n=encodeURIComponent(t.name),a=t.key;return i({key:n},JSON.stringify(a)).then(m({apiConfig:e}))}o({selector:"cc-ssh-key-list",params:{apiConfig:{type:Object}},onContextUpdate({component:i,context:o,onEvent:h,updateComponent:f,signal:g}){const{apiConfig:d}=o;function k(){return async function({apiConfig:i,signal:n,cacheDelay:o}){const[c,r]=await Promise.all([t({}).then(m({apiConfig:i,signal:n,cacheDelay:s})),a().then(m({apiConfig:i,signal:n,cacheDelay:o}))]),l=c.oauthApps.includes("github");let y;l&&(y=await e().then(m({apiConfig:i,signal:n,cacheDelay:o})));return{isGithubLinked:l,personalKeys:r,githubKeys:y}}({apiConfig:d,signal:g,cacheDelay:0}).then((({isGithubLinked:e,personalKeys:t,githubKeys:i})=>{f("keyData",{state:"loaded",isGithubLinked:e,personalKeys:t.map((e=>({...e,state:"idle"}))),githubKeys:i?.map((e=>({...e,state:"idle"})))})})).catch((e=>{console.error(e),f("keyData",{state:"error"})}))}h("cc-ssh-key-list:create",(({name:e,publicKey:t})=>{i.createKeyFormState={type:"creating"},y({apiConfig:d,key:{name:e.trim(),key:t.trim()}}).then((()=>{k().then((()=>{r(c("cc-ssh-key-list.success.add",{name:e})),i.resetCreateKeyForm()}))})).catch((t=>{console.error(t),l(t,c("cc-ssh-key-list.error.add",{name:e}))})).finally((()=>{i.createKeyFormState={type:"idle"}}))})),h("cc-ssh-key-list:delete",(({name:e})=>{f("keyData",(t=>{t.personalKeys.find((t=>t.name===e)).state="deleting"})),async function({apiConfig:e,key:t}){const i=encodeURIComponent(t.name);return n({key:i}).then(m({apiConfig:e}))}({apiConfig:d,key:{name:e}}).then((()=>{k().then((()=>r(c("cc-ssh-key-list.success.delete",{name:e}))))})).catch((t=>{console.error(t),l(t,c("cc-ssh-key-list.error.delete",{name:e})),f("keyData",(t=>{t.personalKeys.find((t=>t.name===e)).state="idle"}))}))})),h("cc-ssh-key-list:import",(({name:e,key:t,fingerprint:i})=>{f("keyData",(t=>{t.githubKeys.find((t=>t.name===e)).state="importing"})),p({apiConfig:d,key:{name:e,key:t}}).then((()=>{r(c("cc-ssh-key-list.success.import",{name:e})),f("keyData",(t=>{t.personalKeys.push({state:"idle",name:e,fingerprint:i}),t.githubKeys=t.githubKeys.filter((t=>t.name!==e))}))})).catch((t=>{console.error(t),l(t,c("cc-ssh-key-list.error.import",{name:e})),f("keyData",(t=>{t.githubKeys.find((t=>t.name===e)).state="idle"}))}))})),f("keyData",{state:"loading"}),i.createKeyFormState={type:"idle"},i.resetCreateKeyForm(),k()}});const p=y;
 //# sourceMappingURL=cc-ssh-key-list.smart.js.map

dist/cc-tile-status-codes.smart.js

@@ -1,2 +0,2 @@
-import"./cc-tile-status-codes.js";import"./cc-smart-container.js";import{getStatusCodesFromWarp10 as e}from"@clevercloud/client/esm/access-logs.js";import{getWarp10AccessLogsToken as t}from"@clevercloud/client/esm/api/v2/warp-10.js";import{THIRTY_SECONDS as o}from"@clevercloud/client/esm/request.fetch-with-timeout.js";import{ONE_DAY as i}from"@clevercloud/client/esm/with-cache.js";import{defineSmartComponent as n}from"./lib/define-smart-component.js";import{sendToApi as a,sendToWarp as r}from"./lib/send-to-api.js";n({selector:"cc-tile-status-codes",params:{apiConfig:{type:Object},ownerId:{type:String},appId:{type:String,required:!1}},onContextUpdate({context:n,updateComponent:s,signal:c}){const{apiConfig:p,ownerId:l,appId:d}=n;s("state",{type:"loading"}),async function({apiConfig:n,signal:s,ownerId:c,appId:p}){const l=await t({orgaId:c}).then(a({apiConfig:n,signal:s,cacheDelay:i}));return e({warpToken:l,ownerId:c,appId:p}).then(r({warpConfig:n,signal:s,timeout:o}))}({apiConfig:p,signal:c,ownerId:l,appId:d}).then((e=>{s("state",{type:"loaded",statusCodes:e})})).catch((e=>{console.log(e),s("state",{type:"error"})}))}});
+import"./cc-tile-status-codes.js";import"./cc-smart-container.js";import{getStatusCodesFromWarp10 as t}from"@clevercloud/client/esm/access-logs.js";import{getWarp10AccessLogsToken as e}from"@clevercloud/client/esm/api/v2/warp-10.js";import{THIRTY_SECONDS as o}from"@clevercloud/client/esm/request.fetch-with-timeout.js";import{ONE_DAY as i}from"@clevercloud/client/esm/with-cache.js";import{defineSmartComponent as n}from"./lib/define-smart-component.js";import{sendToApi as a,sendToWarp as s}from"./lib/send-to-api.js";n({selector:"cc-tile-status-codes",params:{apiConfig:{type:Object},ownerId:{type:String},appId:{type:String,optional:!0}},onContextUpdate({context:n,updateComponent:p,signal:c}){const{apiConfig:r,ownerId:l,appId:d}=n;p("state",{type:"loading"}),async function({apiConfig:n,signal:p,ownerId:c,appId:r}){const l=await e({orgaId:c}).then(a({apiConfig:n,signal:p,cacheDelay:i}));return t({warpToken:l,ownerId:c,appId:r}).then(s({apiConfig:n,signal:p,timeout:o}))}({apiConfig:r,signal:c,ownerId:l,appId:d}).then((t=>{p("state",{type:"loaded",statusCodes:t})})).catch((t=>{console.log(t),p("state",{type:"error"})}))}});
 //# sourceMappingURL=cc-tile-status-codes.smart.js.map

dist/lib/date/date-utils.js

@@ -1,2 +0,2 @@
-import{clampNumber as t}from"../utils.js";const n=1e3,e=6e4,r=36e5,i=864e5;function o(t){return new Date(t.getTime())}function u(t){return t instanceof Date&&!isNaN(t)}function f(n,e,r){return new Date(t(n.getTime(),e?.getTime(),r?.getTime()))}function c(t,n){return new Date(t,n+1,0).getDate()}const a={Y:function(t,n){const e=o(t),r=t.getUTCFullYear()+n;let i=t.getUTCDate();return i>28&&(i=Math.min(i,c(r,t.getUTCMonth())),e.setUTCDate(i)),e.setUTCFullYear(r),e},M:function(t,n){const e=o(t),r=Math.floor(n/12),i=n-12*r,u=t.getUTCFullYear()+r,f=t.getUTCMonth()+i;let a=t.getUTCDate();return a>28&&(a=Math.min(a,c(u,f)),e.setUTCDate(a)),e.setUTCFullYear(u),e.setUTCMonth(f),e},D:function(t,n){return a._shift(t,n*i)},H:function(t,n){return a._shift(t,n*r)},m:function(t,n){return a._shift(t,6e4*n)},s:function(t,n){return a._shift(t,1e3*n)},S:function(t,n){return a._shift(t,n)},_shift:function(t,n){return new Date(t.getTime()+n)}};function s(t,n,e){const r=a[n];if(null==r)throw new Error(`Cannot shift field "${n}".`);return r(t,e)}const d=/^\d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}\.\d{3}(Z|[+-]\d{2}:\d{2})$/;function T(t){return C(t,d,(()=>new Date(t)))}const h=/^\d{4}-\d{2}-\d{2} \d{2}:\d{2}:\d{2}$/;function l(t,n){return C(t,h,(()=>new Date(`${t}${"UTC"===n?"Z":""}`)))}function C(t,n,e){if(t.match(n)){const t=e();if(u(t))return t}throw new Error(`Invalid date "${t}"`)}export{i as DAY,r as HOUR,e as MINUTE,n as SECOND,f as clampDate,o as cloneDate,c as getNumberOfDaysInMonth,u as isDateValid,T as parseIsoDateString,l as parseSimpleDateString,s as shiftDateField};
+import{clampNumber as t}from"../utils.js";const e=1e3,n=6e4,r=36e5,i=864e5;function o(t){return new Date(t.getTime())}function u(t){return t instanceof Date&&!isNaN(t.getTime())}function f(e,n,r){return new Date(t(e.getTime(),n?.getTime(),r?.getTime()))}function c(t,e){return new Date(t,e+1,0).getDate()}const a={Y:function(t,e){const n=o(t),r=t.getUTCFullYear()+e;let i=t.getUTCDate();return i>28&&(i=Math.min(i,c(r,t.getUTCMonth())),n.setUTCDate(i)),n.setUTCFullYear(r),n},M:function(t,e){const n=o(t),r=Math.floor(e/12),i=e-12*r,u=t.getUTCFullYear()+r,f=t.getUTCMonth()+i;let a=t.getUTCDate();return a>28&&(a=Math.min(a,c(u,f)),n.setUTCDate(a)),n.setUTCFullYear(u),n.setUTCMonth(f),n},D:function(t,e){return a._shift(t,e*i)},H:function(t,e){return a._shift(t,e*r)},m:function(t,e){return a._shift(t,6e4*e)},s:function(t,e){return a._shift(t,1e3*e)},S:function(t,e){return a._shift(t,e)},_shift:function(t,e){return new Date(t.getTime()+e)}};function s(t,e,n){const r=a[e];if(null==r)throw new Error(`Cannot shift field "${e}".`);return r(t,n)}const T=/^\d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}\.\d{3}(Z|[+-]\d{2}:\d{2})$/;function d(t){return g(t,T,(()=>new Date(t)))}const h=/^\d{4}-\d{2}-\d{2} \d{2}:\d{2}:\d{2}$/;function l(t,e){return g(t,h,(()=>new Date(`${t}${"UTC"===e?"Z":""}`)))}function g(t,e,n){if(t.match(e)){const t=n();if(u(t))return t}throw new Error(`Invalid date "${t}"`)}export{i as DAY,r as HOUR,n as MINUTE,e as SECOND,f as clampDate,o as cloneDate,c as getNumberOfDaysInMonth,u as isDateValid,d as parseIsoDateString,l as parseSimpleDateString,s as shiftDateField};
 //# sourceMappingURL=date-utils.js.map

dist/lib/events.js

@@ -1,2 +0,2 @@
-function e(e,n,c){const s=function(e,n){if(n.includes(":"))return n;const c=e.nodeName?.toLocaleLowerCase(),s=c.match(t);return`${null!=s?s[1]:c}:${n}`}(e,n),i=new CustomEvent(s,{detail:c,bubbles:!0,composed:!0});return e.dispatchEvent(i),i}const t=/^(cc-.+?)-beta$/;class n{constructor(e,t,n){this._element=e,this._event=t,this._handler=n,this._connected=!1}connect(){this._connected||(this._element.addEventListener(this._event,this._handler),this._connected=!0)}disconnect(){this._connected&&(this._element.removeEventListener(this._event,this._handler),this._connected=!1)}}export{n as EventHandler,e as dispatchCustomEvent};
+function e(e,n,s){const c=function(e,n){if(n.includes(":"))return n;if(e instanceof Window)return n;const s=e.nodeName.toLocaleLowerCase(),c=s.match(t);return`${null!=c?c[1]:s}:${n}`}(e,n),i=new CustomEvent(c,{detail:s,bubbles:!0,composed:!0});return e.dispatchEvent(i),i}const t=/^(cc-.+?)-beta$/;class n{constructor(e,t,n){this._element=e,this._event=t,this._handler=n,this._connected=!1}connect(){!this._connected&&this._castHandler(this._handler)&&(this._element.addEventListener(this._event,this._handler),this._connected=!0)}disconnect(){this._connected&&this._castHandler(this._handler)&&(this._element.removeEventListener(this._event,this._handler),this._connected=!1)}_castHandler(e){return!0}}export{n as EventHandler,e as dispatchCustomEvent};
 //# sourceMappingURL=events.js.map

dist/lib/send-to-api.js

@@ -1,2 +0,2 @@
-import{addOauthHeader as e}from"@clevercloud/client/esm/oauth.js";import{prefixUrl as t}from"@clevercloud/client/esm/prefix-url.js";import{execWarpscript as r}from"@clevercloud/client/esm/request-warp10.fetch.js";import{request as o}from"@clevercloud/client/esm/request.fetch.js";import{withCache as c}from"@clevercloud/client/esm/with-cache.js";import{withOptions as n}from"@clevercloud/client/esm/with-options.js";import{dispatchCustomEvent as i}from"./events.js";function s({apiConfig:r,signal:s,cacheDelay:l,timeout:m}){return u=>{const h={...r,...u};return c(h,l,(()=>{const{API_HOST:c="https://api.clever-cloud.com",...l}=r;return Promise.resolve(u).then(t(c)).then(e(l)).then(n({signal:s,timeout:m})).then(o).catch((e=>{throw i(window,"cc-api:error",e),e}))}))}}function l({warpConfig:e,signal:o,cacheDelay:i,timeout:s}){return l=>{const m={...e,...l};return c(m,i,(()=>{const{WARP_10_HOST:c}=e;return Promise.resolve(l).then(t(c)).then(n({signal:o,timeout:s})).then(r)}))}}export{s as sendToApi,l as sendToWarp};
+import{addOauthHeader as e}from"@clevercloud/client/esm/oauth.js";import{prefixUrl as t}from"@clevercloud/client/esm/prefix-url.js";import{execWarpscript as r}from"@clevercloud/client/esm/request-warp10.fetch.js";import{request as o}from"@clevercloud/client/esm/request.fetch.js";import{withCache as c}from"@clevercloud/client/esm/with-cache.js";import{withOptions as i}from"@clevercloud/client/esm/with-options.js";import{dispatchCustomEvent as n}from"./events.js";function s({apiConfig:r,signal:s,cacheDelay:l,timeout:m}){return u=>{const h={...r,...u};return c(h,l,(()=>{const{API_HOST:c="https://api.clever-cloud.com",...l}=r;return Promise.resolve(u).then(t(c)).then(e(l)).then(i({signal:s,timeout:m})).then(o).catch((e=>{throw n(window,"cc-api:error",e),e}))}))}}function l({apiConfig:e,signal:o,cacheDelay:n,timeout:s}){return l=>{const m={...e,...l};return c(m,n,(()=>{const{WARP_10_HOST:c}=e;return Promise.resolve(l).then(t(c)).then(i({signal:o,timeout:s})).then(r)}))}}export{s as sendToApi,l as sendToWarp};
 //# sourceMappingURL=send-to-api.js.map

dist/logs-controller.js

@@ -1,2 +0,2 @@
-import{parseRegex as t}from"./lib/regex-parse.js";import{isStringEmpty as e}from"./lib/utils.js";const s=()=>!0,i=()=>!1;class l{constructor(t){this._host=t,this._logs=[],this._logsFiltered=[],this._limit=1/0,this._filterCallback=s,this._selection=new Set,this._selectionLast=null,this._focusedIndex=null}set limit(t){const e="number"==typeof t&&!Number.isNaN(t);(e?t:1/0)!==this._limit&&(this._limit=e?t:1/0,this._updateList())}set filter(t){if(null==t)this._filterCallback=s;else{const e=this._getMessageFilterCallback(t.message),s=this._getMetadataFilterCallback(t.metadata);this._filterCallback=t=>e(t)&&s(t)}this._updateList({forceFilter:!0})}getList(){return this._logsFiltered}get listLength(){return this._logsFiltered.length}append(t){this._updateList({newLogs:t})}clear(){this._logs=[],this._logsFiltered=[],this._selection.clear(),this._updateList(),this.clearFocus()}select(t){const e=this._getLogByFilteredIndex(t);this._selection=null!=e?new Set([e]):new Set,this._selectionLast=e,this._host.requestUpdate(),this._host._onSelectionChanged()}toggleSelection(t){const e=this._getLogByFilteredIndex(t);null!=e&&(this._selection.has(e)?(this._selection.delete(e),this._selectionLast=Array.from(this._selection).pop()):(this._selection.add(e),this._selectionLast=this._logsFiltered[t]),this._host.requestUpdate(),this._host._onSelectionChanged())}extendSelection(t,e){if(0===this._selection.size)return void this.select(t);const s=this._selectionLast??Array.from(this._selection).pop(),i=this._logsFiltered.indexOf(s),l=t,o=Math.min(i,l),n=Math.max(i,l),h=this._logsFiltered.slice(Math.max(0,o),n+1);"replace"===e&&this._selection.clear(),h.forEach((t=>this._selection.add(t))),this._host.requestUpdate(),this._host._onSelectionChanged()}clearSelection(){this._selection.clear(),this._selectionLast=null,this._host.requestUpdate(),this._host._onSelectionChanged()}get selectionLength(){return this._selection.size}isSelected(t){const e=this._getLogByFilteredIndex(t);return this._selection.has(e)}isSelectionEmpty(){return 0===this._selection.size}getSelectedLogs(){return this._logs.filter((t=>this._selection.has(t)))}focus(t,e=!0){this._focusedIndex!==t&&(this._focusedIndex=t,e&&this._host._onFocusedLogChange(t))}moveFocus(t,e){null!=this._focusedIndex?("up"===t&&this._focusedIndex>0&&this.focus(this._focusedIndex-1),"down"===t&&this._focusedIndex<this._logsFiltered.length-1&&this.focus(this._focusedIndex+1)):null!=e&&("up"===t&&this.focus(e.last),"down"===t&&this.focus(e.first))}clearFocus(t=!0){this.focus(null,t)}isFocusedIndexInRange({first:t,last:e}){return null!=this._focusedIndex&&this._focusedIndex>=t&&this._focusedIndex<=e}_getLogByFilteredIndex(t){return this._logsFiltered[t]}_updateList(t={}){const e=t.newLogs??[],s=t.forceFilter??!1;let i=!1;const l=t=>{i=this._selection.delete(t)||i},o=e.length>this._limit?e.slice(e.length-this._limit):e.slice(),n=this._logs.length+o.length,h=n>=this._limit?n-this._limit:0,c=this._logs.splice(0,h);if(this._logs.push(...o),s)this._logsFiltered=[],this._logs.forEach((t=>{this._filterCallback(t)?this._logsFiltered.push(t):l(t)})),this.clearFocus();else{const t=c.filter(this._filterCallback);this._logsFiltered.splice(0,t.length);const e=o.filter(this._filterCallback);this._logsFiltered.push(...e),null!=this._focusedIndex&&t.length>0&&(this._focusedIndex>t.length?this.focus(this._focusedIndex-t.length):this.clearFocus())}c.forEach(l),this._selection.has(this._selectionLast)||(this._selectionLast=null),this._host.requestUpdate(),i&&this._host._onSelectionChanged()}_getMetadataFilterCallback(t){if(null==t||0===t.length)return s;const e={};if(Array.isArray(t))for(const s of t)null==e[s.metadata]&&(e[s.metadata]=[]),e[s.metadata].push(s.value);const i=Object.entries(e);return t=>i.every((([e,s])=>{const i=t.metadata.find((t=>t.name===e));return s.includes(i?.value)}))}_getMessageFilterCallback(l){if(null==l||e(l.value))return s;if("strict"===l.type)return t=>t.message.includes(l.value);if("regex"===l.type)try{const e=t(l.value);return t=>null!=t.message.match(e)}catch(t){return i}const o=l.value.trim().toLowerCase().split(" ").filter((t=>t.length>0));return t=>{const e=t.message.toLowerCase();return o.every((t=>e.includes(t)))}}}export{l as LogsController};
+import{parseRegex as t}from"./lib/regex-parse.js";import{isStringEmpty as e}from"./lib/utils.js";const s=()=>!0,i=()=>!1;class l{constructor(t){this._host=t,this._logs=[],this._logsFiltered=[],this._limit=1/0,this._filterCallback=s,this._selection=new Set,this._selectionLast=null,this._focusedIndex=null}set limit(t){const e="number"==typeof t&&!Number.isNaN(t);(e?t:1/0)!==this._limit&&(this._limit=e?t:1/0,this._updateList())}set filter(t){if(null==t)this._filterCallback=s;else{const e=this._getMessageFilterCallback(t.message),s=this._getMetadataFilterCallback(t.metadata);this._filterCallback=t=>e(t)&&s(t)}this._updateList({forceFilter:!0})}getList(){return this._logsFiltered}get listLength(){return this._logsFiltered.length}append(t){this._updateList({newLogs:t})}clear(){this._logs=[],this._logsFiltered=[],this._selection.clear(),this._updateList(),this.clearFocus()}select(t){const e=this._getLogByFilteredIndex(t);this._selection=null!=e?new Set([e]):new Set,this._selectionLast=e,this._host.requestUpdate(),this._host._onSelectionChanged()}toggleSelection(t){const e=this._getLogByFilteredIndex(t);null!=e&&(this._selection.has(e)?(this._selection.delete(e),this._selectionLast=Array.from(this._selection).pop()):(this._selection.add(e),this._selectionLast=this._logsFiltered[t]),this._host.requestUpdate(),this._host._onSelectionChanged())}extendSelection(t,e){if(0===this._selection.size)return void this.select(t);const s=this._selectionLast??Array.from(this._selection).pop(),i=this._logsFiltered.indexOf(s),l=t,h=Math.min(i,l),o=Math.max(i,l),n=this._logsFiltered.slice(Math.max(0,h),o+1);"replace"===e&&this._selection.clear(),n.forEach((t=>this._selection.add(t))),this._host.requestUpdate(),this._host._onSelectionChanged()}clearSelection(){this._selection.clear(),this._selectionLast=null,this._host.requestUpdate(),this._host._onSelectionChanged()}selectAll(){this._logsFiltered.length>0&&(this._selection=new Set(this._logsFiltered),this._selectionLast=this._logsFiltered[this._logsFiltered.length-1],this._host.requestUpdate(),this._host._onSelectionChanged())}get selectionLength(){return this._selection.size}isSelected(t){const e=this._getLogByFilteredIndex(t);return this._selection.has(e)}isSelectionEmpty(){return 0===this._selection.size}getSelectedLogs(){return this._logs.filter((t=>this._selection.has(t)))}focus(t,e=!0){null!=t&&(t<0||t>this._logsFiltered.length-1)||this._focusedIndex!==t&&(this._focusedIndex=t,e&&this._host._onFocusedLogChange(t))}moveFocus(t,e){null!=this._focusedIndex?("up"===t&&this._focusedIndex>0&&this.focus(this._focusedIndex-1),"down"===t&&this._focusedIndex<this._logsFiltered.length-1&&this.focus(this._focusedIndex+1)):null!=e&&("up"===t&&this.focus(e.last),"down"===t&&this.focus(e.first))}clearFocus(t=!0){this.focus(null,t)}isFocusedIndexInRange({first:t,last:e}){return null!=this._focusedIndex&&this._focusedIndex>=t&&this._focusedIndex<=e}_getLogByFilteredIndex(t){return this._logsFiltered[t]}_updateList(t={}){const e=t.newLogs??[],s=t.forceFilter??!1;let i=!1;const l=t=>{i=this._selection.delete(t)||i},h=e.length>this._limit?e.slice(e.length-this._limit):e.slice(),o=this._logs.length+h.length,n=o>=this._limit?o-this._limit:0,c=this._logs.splice(0,n);if(this._logs.push(...h),s)this._logsFiltered=[],this._logs.forEach((t=>{this._filterCallback(t)?this._logsFiltered.push(t):l(t)})),this.clearFocus();else{const t=c.filter(this._filterCallback);this._logsFiltered.splice(0,t.length);const e=h.filter(this._filterCallback);this._logsFiltered.push(...e),null!=this._focusedIndex&&t.length>0&&(this._focusedIndex>t.length?this.focus(this._focusedIndex-t.length):this.clearFocus())}c.forEach(l),this._selection.has(this._selectionLast)||(this._selectionLast=null),this._host.requestUpdate(),i&&this._host._onSelectionChanged()}_getMetadataFilterCallback(t){if(null==t||0===t.length)return s;const e={};if(Array.isArray(t))for(const s of t)null==e[s.metadata]&&(e[s.metadata]=[]),e[s.metadata].push(s.value);const i=Object.entries(e);return t=>i.every((([e,s])=>{const i=t.metadata.find((t=>t.name===e));return s.includes(i?.value)}))}_getMessageFilterCallback(l){if(null==l||e(l.value))return s;if("strict"===l.type)return t=>t.message.includes(l.value);if("regex"===l.type)try{const e=t(l.value);return t=>null!=t.message.match(e)}catch(t){return i}const h=l.value.trim().toLowerCase().split(" ").filter((t=>t.length>0));return t=>{const e=t.message.toLowerCase();return h.every((t=>e.includes(t)))}}}export{l as LogsController};
 //# sourceMappingURL=logs-controller.js.map

dist/logs-input-controller.js

@@ -1,2 +0,2 @@
-import{hasClass as t}from"./lib/dom.js";import{EventHandler as i}from"./lib/events.js";import{elementsFromPoint as o}from"./lib/shadow-dom-utils.js";import{clampNumber as e}from"./lib/utils.js";import{AnimationRunner as s}from"./animation-runner.js";class n{constructor(t){this._host=t,this.onClick=this.onClick.bind(this),this.onClickLog=this.onClickLog.bind(this),this.onKeyDown=this.onKeyDown.bind(this),this.onKeyUp=this.onKeyUp.bind(this),this.onMouseDownGutter=this.onMouseDownGutter.bind(this),this._windowMouseMoveHandler=new i(window,"mousemove",(t=>this._onDrag(t))),this._windowMouseUpHandler=new i(window,"mouseup",(t=>this._onDragStop(t))),this._arrowKeysAnimationRunner=new s,this._dragAnimationRunner=new s,this._keyModifiers={ctrl:!1,shift:!1}}onKeyDown(t){if("Escape"===t.key&&this._host._onEscape(),"Control"===t.key||"Meta"===t.key)this._keyModifiers.ctrl=!0;else if("Shift"===t.key)this._keyModifiers.shift=!0;else if("ArrowDown"===t.key||"ArrowUp"===t.key){t.preventDefault();const i="ArrowDown"===t.key?"down":"up";if(this._arrowKeysAnimationRunner.isStopped()){let t=!1;this._arrowKeysAnimationRunner.start(((o,e,s)=>{const n=o===e;t||=o-e>100;return!!(n||t&&o-s>25)&&(this._host._onArrow(i),!0)}))}}else if("c"===t.key&&this._keyModifiers.ctrl)this._host._onCopySelectionToClipboard();else if("Enter"===t.key||" "===t.key){t.preventDefault();const i=Number(t.target.closest(".log").dataset.index);this._host._onClickLog(i,this._keyModifiers)}}onKeyUp(t){"Control"===t.key||"Meta"===t.key?this._keyModifiers.ctrl=!1:"Shift"===t.key?this._keyModifiers.shift=!1:"ArrowDown"!==t.key&&"ArrowUp"!==t.key||this._arrowKeysAnimationRunner.stop()}onClick(t){"stopping"!==this._dragState&&this._host._onClick()}onClickLog(t){t.stopPropagation();const i=Number(t.target.closest(".log").dataset.index);this._host._onClickLog(i,this._keyModifiers)}onMouseDownGutter(t){this._windowMouseMoveHandler.connect(),this._windowMouseUpHandler.connect(),this._dragState="init"}_onDrag(i){if(i.ctrlKey||i.shiftKey)return;const o="init"===this._dragState;this._dragState="dragging";const{position:s,distance:n}=this._getCursorPosition(i,this._host);if("inside"===s||"left"===s||"right"===s){this._dragAnimationRunner.stop();const e=this._getElementsFromPoint(i,s,n).find((i=>t(i,"log"))),r=Number(e.dataset.index);this.dragIndex!==r&&(this._host._onDrag({logIndex:r},o),this.dragIndex=r)}if("above"===s||"below"===s){const t="above"===s?"up":"down",i=e(n,1,50);this._dragAnimationPeriodMs=Math.ceil(300-280*i/49),this._dragAnimationLogOffset=Math.ceil(9*i/49),this._dragAnimationRunner.isStopped()&&this._dragAnimationRunner.start(((i,e,s)=>!!(i-s>this._dragAnimationPeriodMs)&&(this._host._onDrag({direction:t,offset:this._dragAnimationLogOffset},o),!0)))}}_onDragStop(t){this._windowMouseMoveHandler.disconnect(),this._windowMouseUpHandler.disconnect(),this._dragAnimationRunner.stop(),this._dragState="stopping",setTimeout((()=>{this._dragState="stopped"}),0)}_getElementsFromPoint(t,i,e){if("inside"===i)return t.composedPath();if("left"===i||"right"===i){const s=t.clientX+("left"===i?1:-1)*(e+this._host.offsetWidth/2),n=t.clientY;return o(s,n)}return[]}_getCursorPosition(t,i){const o=i.offsetWidth,e=i.offsetHeight,s=this._getRelativeCoordinates(t,i);return s.y<0?{position:"above",distance:-s.y}:s.y>e?{position:"below",distance:s.y-e}:s.x<0?{position:"left",distance:-s.x}:s.x>o?{position:"right",distance:s.x-o}:{position:"inside"}}_getRelativeCoordinates(t,i){const o=t.pageX,e=t.pageY,s={left:i.offsetLeft,top:i.offsetTop};let n=i.offsetParent;for(;null!=n;)s.left+=n.offsetLeft,s.top+=n.offsetTop,n=n.offsetParent;return{x:o-s.left,y:e-s.top}}}export{n as LogsInputController};
+import{hasClass as t}from"./lib/dom.js";import{EventHandler as i}from"./lib/events.js";import{elementsFromPoint as o}from"./lib/shadow-dom-utils.js";import{clampNumber as e}from"./lib/utils.js";import{AnimationRunner as s}from"./animation-runner.js";class n{constructor(t){this._host=t,this.onClick=this.onClick.bind(this),this.onClickLog=this.onClickLog.bind(this),this.onKeyDown=this.onKeyDown.bind(this),this.onKeyUp=this.onKeyUp.bind(this),this.onMouseDownGutter=this.onMouseDownGutter.bind(this),this._windowMouseMoveHandler=new i(window,"mousemove",(t=>this._onDrag(t))),this._windowMouseUpHandler=new i(window,"mouseup",(t=>this._onDragStop(t))),this._arrowKeysAnimationRunner=new s,this._dragAnimationRunner=new s,this._keyModifiers={ctrl:!1,shift:!1}}onKeyDown(t){if("Escape"===t.key&&this._host._onEscape(),"Control"===t.key||"Meta"===t.key)this._keyModifiers.ctrl=!0;else if("Shift"===t.key)this._keyModifiers.shift=!0;else if("ArrowDown"===t.key||"ArrowUp"===t.key){t.preventDefault();const i="ArrowDown"===t.key?"down":"up";if(this._arrowKeysAnimationRunner.isStopped()){let t=!1;this._arrowKeysAnimationRunner.start(((o,e,s)=>{const n=o===e;t||=o-e>100;return!!(n||t&&o-s>25)&&(this._host._onArrow(i),!0)}))}}else if("c"===t.key&&this._keyModifiers.ctrl)this._host._onCopySelectionToClipboard();else if("Enter"===t.key||" "===t.key){t.preventDefault();const i=Number(t.target.closest(".log").dataset.index);this._host._onClickLog(i,this._keyModifiers)}else"a"===t.key&&this._keyModifiers.ctrl?(t.preventDefault(),this._host._onSelectAll()):"Home"===t.key?this._host._onHome(this._keyModifiers.ctrl&&this._keyModifiers.shift):"End"===t.key&&this._host._onEnd(this._keyModifiers.ctrl&&this._keyModifiers.shift)}onKeyUp(t){"Control"===t.key||"Meta"===t.key?this._keyModifiers.ctrl=!1:"Shift"===t.key?this._keyModifiers.shift=!1:"ArrowDown"!==t.key&&"ArrowUp"!==t.key||this._arrowKeysAnimationRunner.stop()}onClick(t){"stopping"!==this._dragState&&this._host._onClick(t)}onClickLog(t){t.stopPropagation();const i=Number(t.target.closest(".log").dataset.index);this._host._onClickLog(i,this._keyModifiers)}onMouseDownGutter(t){this._windowMouseMoveHandler.connect(),this._windowMouseUpHandler.connect(),this._dragState="init"}_onDrag(i){if(i.ctrlKey||i.shiftKey)return;const o="init"===this._dragState;this._dragState="dragging";const{position:s,distance:n}=this._getCursorPosition(i,this._host);if("inside"===s||"left"===s||"right"===s){this._dragAnimationRunner.stop();const e=this._getElementsFromPoint(i,s,n).find((i=>t(i,"log"))),r=Number(e.dataset.index);this.dragIndex!==r&&(this._host._onDrag({logIndex:r},o),this.dragIndex=r)}if("above"===s||"below"===s){const t="above"===s?"up":"down",i=e(n,1,50);this._dragAnimationPeriodMs=Math.ceil(300-280*i/49),this._dragAnimationLogOffset=Math.ceil(9*i/49),this._dragAnimationRunner.isStopped()&&this._dragAnimationRunner.start(((i,e,s)=>!!(i-s>this._dragAnimationPeriodMs)&&(this._host._onDrag({direction:t,offset:this._dragAnimationLogOffset},o),!0)))}}_onDragStop(t){this._windowMouseMoveHandler.disconnect(),this._windowMouseUpHandler.disconnect(),this._dragAnimationRunner.stop(),this._dragState="stopping",setTimeout((()=>{this._dragState="stopped"}),0)}_getElementsFromPoint(t,i,e){if("inside"===i)return t.composedPath();if("left"===i||"right"===i){const s=t.clientX+("left"===i?1:-1)*(e+this._host.offsetWidth/2),n=t.clientY;return o(s,n)}return[]}_getCursorPosition(t,i){const o=i.offsetWidth,e=i.offsetHeight,s=this._getRelativeCoordinates(t,i);return s.y<0?{position:"above",distance:-s.y}:s.y>e?{position:"below",distance:s.y-e}:s.x<0?{position:"left",distance:-s.x}:s.x>o?{position:"right",distance:s.x-o}:{position:"inside"}}_getRelativeCoordinates(t,i){const o=t.pageX,e=t.pageY,s={left:i.offsetLeft,top:i.offsetTop};let n=i.offsetParent;for(;null!=n;)s.left+=n.offsetLeft,s.top+=n.offsetTop,n=n.offsetParent;return{x:o-s.left,y:e-s.top}}}export{n as LogsInputController};
 //# sourceMappingURL=logs-input-controller.js.map

package.json

 {
   "name": "@clevercloud/components",
-  "version": "14.1.1",
+  "version": "15.0.0",
   "description": "Collection of Web Components by Clever Cloud",
@@ -5,0 +5,0 @@ "license": "Apache-2.0",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

6078287

increased by2.45%

Number of package files

378

increased by3.85%

Lines of code

20937

increased by8.56%

No dependency changes