@cargosense/cargo-design-system 1.0.8 → 1.0.10

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -114,7 +114,7 @@
114
114
  outline: none;
115
115
  }
116
116
 
117
- `;static properties={variant:{type:String,reflect:!0,converter:t=>["classic","secondary","primary"].includes(t)?t:"classic"},size:{type:String,reflect:!0,attribute:"size",converter:t=>["sm","md","lg"].includes(t)?t:"md"},disabled:{type:Boolean,reflect:!0,attribute:"disabled"},link:{type:String,reflect:!0,attribute:"link"},target:{type:String,reflect:!0,attribute:"target",converter:t=>["_blank","_self","_parent","_top"].includes(t)?t:"_self"},expand:{type:Boolean,reflect:!0,attribute:"full-width",converter:t=>t==""?"expand":""},value:{type:String,reflect:!0,attribute:"value",defaultValue:""},type:{type:String,reflect:!0,attribute:"type",converter:t=>["button","submit","reset"].includes(t)?t:"button"},square:{type:Boolean,reflect:!0,attribute:"square",converter:t=>t===""?"square":""},form:{type:String,reflect:!0,attribute:"form"}};firstUpdated(){const t=document.getElementById(this.form);this.shadowRoot.querySelector("button").addEventListener("click",()=>{t instanceof HTMLFormElement&&(console.log("Form found, submitting..."),t.requestSubmit())})}constructor(){super(),this.link=void 0,this.target=void 0,this.disabled=!1,this.size="md",this.expand="",this._variant="primary",this.name=void 0,this.button="button",this.form=void 0,this.square=""}render(){return e.x`
117
+ `;static properties={variant:{type:String,reflect:!0,converter:t=>["classic","secondary","primary"].includes(t)?t:"classic"},size:{type:String,reflect:!0,attribute:"size",converter:t=>["sm","md","lg"].includes(t)?t:"md"},disabled:{type:Boolean,reflect:!0,attribute:"disabled"},link:{type:String,reflect:!0,attribute:"link"},target:{type:String,reflect:!0,attribute:"target",converter:t=>["_blank","_self","_parent","_top"].includes(t)?t:"_self"},expand:{type:Boolean,reflect:!0,attribute:"full-width",converter:t=>t==""?"expand":""},value:{type:String,reflect:!0,attribute:"value",defaultValue:""},type:{type:String,reflect:!0,attribute:"type",converter:t=>["button","submit","reset"].includes(t)?t:"button"},square:{type:Boolean,reflect:!0,attribute:"square",converter:t=>t===""?"square":""},form:{type:String,reflect:!0,attribute:"form"}};firstUpdated(){const t=document.getElementById(this.form);this.shadowRoot.querySelector("button").addEventListener("click",()=>{t instanceof HTMLFormElement&&t.requestSubmit()})}constructor(){super(),this.link=void 0,this.target=void 0,this.disabled=!1,this.size="md",this.expand="",this._variant="primary",this.name=void 0,this.button="button",this.form=void 0,this.square=""}render(){return e.x`
118
118
  <a href='${e.o(this.link)}' target="${e.o(this.target)}" tabindex="-1" class="${this.expand}">
119
119
  <button form="${this.form}" type="${this.button}" class="button ${this.square} ${this.variant} ${this.size} ${this.expand} ${this.disabled?"disabled":""}" .name="${this.name}" tabindex="${this.disabled?"-1":0}" @click='${this.handleClick}'>
120
120
  <slot name='start'></slot> <slot></slot> <slot name='end'></slot>
@@ -298,7 +298,7 @@
298
298
  `;static properties={name:{type:String,reflect:!0},type:{type:String,reflect:!0,converter:t=>["text","date","time","number","tel","url","phone","email","password"].includes(t)?t:"text"},disabled:{type:Boolean,reflect:!0},placeholder:{type:String,reflect:!0},readOnly:{type:Boolean,reflect:!0,attribute:"read-only"},required:{type:Boolean,reflect:!0},pattern:{type:String},error:{type:Boolean,reflect:!0},value:{type:String,reflect:!0},fullWidth:{type:Boolean,reflect:!0,attribute:"full-width"},variant:{type:String,reflect:!0},size:{type:String,reflect:!0,converter:t=>["sm","md","lg"].includes(t)?t:"md"},iconLeft:{type:String,reflect:!0,attribute:"icon-left"},iconRight:{type:String,reflect:!0,attribute:"icon-right"}};handleKeyPress(t){return this.dispatchEvent(new CustomEvent("keypress",{detail:{value:t.target.value,key:t.keyCode}})),t.key==="Enter"&&this.dispatchEvent(new CustomEvent("onenter",{detail:{value:t.target.value}})),this.dispatchEvent(new CustomEvent("onkeyup",{detail:{value:t.target.value,key:t.keyCode}})),this._internals.setFormValue(t.target.value),this.value=t.target.value,t.target.value}handleInput(t){return this.dispatchEvent(new CustomEvent("input",{detail:{value:t.target.value}})),this._internals.setFormValue(t.target.value),this.value=t.target.value,t.target.value}handleChange(t){return this.dispatchEvent(new CustomEvent("onchange",{detail:{value:t.target.value}})),this._internals.setFormValue(t.target.value),this.value=t.target.value,t.target.value}handleFocus(t){return this.dispatchEvent(new CustomEvent("onblur",{detail:{value:t.target.value}})),this._internals.setFormValue(t.target.value),this.value=t.target.value,t.target}constructor(){super(),this.value="",this.placeholder="",this.pattern="",this.variant="solid",this.size="md",this._internals=this.attachInternals()}render(){return e.x`
299
299
  ${this.iconLeft?e.x`<span class="icon-left-container"><cd-icon name="${this.iconLeft}" size="sm" class="icon-left"></cd-icon></span>`:""}
300
300
  <input id='${this.name}' class="${this.iconLeft?"icon-spacing-left":""} ${this.iconRight?" icon-spacing-right":""} ${this.disabled?" disabled":""} ${this.error?" input-error":""} ${this.fullWidth?" full-width":""} ${this.variant==="dashed"?" dashed":this.variant=="dotted"?" dotted":""} ${this.size}" type="${this.type}" placeholder="${this.placeholder}" ?required=${this.required} .value="${this.value}" ?readonly=${this.readOnly} ?disabled=${this.disabled} .pattern="${this.pattern}" @input="${this.handleInput}" @change="${this.handleChange}" @blur="${this.handleFocus}" @keypress=${this.handleKeyPress}/>
301
- ${this.iconRight?e.x`<span class="icon-right-container"><cd-icon name="${this.iconRight}" size="sm" class="icon-right" color='${ifDefined(this.error?"var(--input-error-border-color)":void 0)}'></cd-icon></span>`:""}
301
+ ${this.iconRight?e.x`<span class="icon-right-container"><cd-icon name="${this.iconRight}" size="sm" class="icon-right" color='${e.o(this.error?"var(--input-error-border-color)":void 0)}'></cd-icon></span>`:""}
302
302
  `}focus(){if(!this.shadowRoot){console.warn("Input element is not yet connected to the DOM.");return}if(!this.shadowRoot.querySelector("input")){console.warn("Input element is not found in the shadow DOM.");return}this.shadowRoot.querySelector("input").focus()}}function k(){typeof window<"u"&&!customElements.get("cd-input")&&customElements.define("cd-input",s)}e.registerNavImage();class l extends e.i{static styles=e.i$1`
303
303
  @font-face {
304
304
  font-family: 'Geist';
@@ -901,7 +901,7 @@
901
901
  ${this.iconRight||this.collapsed?e.x`<span @click="${this.expandInput}" class="${this.collapsed?"icon-collapsed-container":"icon-right-container"}"><cd-icon name="search" class="${this.collapsed?"icon-collapsed "+this.size:"icon-right"}" variant="light-slate"></cd-icon></span>`:""}
902
902
  ${this.closeIcon?e.x`<span class="${this.collapsed?"hidden":"active"}" id='closeIcon' tabindex='0'><cd-icon name="exit" id="close-icon" class="icon close ${this.collapsed?"hidden-icon":"active-icon"}" @click="${this.collapseInput}"></cd-icon></span>`:""}
903
903
  </div>
904
- `}firstUpdated(){if(!this.shadowRoot){console.warn("Shadow DOM is not available.");return}this.shadowRoot.querySelector(".active")&&(console.log("Adding event listener to active element"),this.shadowRoot.querySelector(".active").addEventListener("keydown",t=>{console.log("test"),t.keyCode===13&&this.collapseInput()}))}focus(){if(!this.shadowRoot){console.warn("Input element is not yet connected to the DOM.");return}if(!this.shadowRoot.querySelector("input")){console.warn("Input element is not found in the shadow DOM.");return}this.shadowRoot.querySelector("#search-input").focus()}expandInput(){this.collapsed&&(this.collapsed=!1,this.shadowRoot.querySelector("#search-input").focus(),this.shadowRoot.querySelector("#close-icon").classList.remove("hidden-icon"),this.shadowRoot.querySelector("#close-icon").classList.remove("hidden"),this.shadowRoot.querySelector("#close-icon").classList.add("active-icon"),this.shadowRoot.querySelector("#close-icon").classList.add("active"),this.requestUpdate(),this.shadowRoot.querySelector("#closeIcon").addEventListener("keydown",t=>{t.key==="Enter"&&this.collapseInput()}))}collapseInput(){this.collapsed||(this.collapsed=!0,this.value="",this.shadowRoot.querySelector("#close-icon").classList.add("hidden-icon"),this.shadowRoot.querySelector("#close-icon").classList.add("hidden"),this.shadowRoot.querySelector("#close-icon").classList.remove("active"),this.shadowRoot.querySelector("#close-icon").classList.remove("active-icon"),this.dispatchEvent(new CustomEvent("collapsed",{detail:{closed:!0},bubbles:!0,composed:!0})),this.requestUpdate())}}function T(){typeof window<"u"&&!customElements.get("cd-search")&&customElements.define("cd-search",v)}e.registerIcon();class b extends e.i{static styles=e.i$1`
904
+ `}firstUpdated(){if(!this.shadowRoot){console.warn("Shadow DOM is not available.");return}this.shadowRoot.querySelector(".active")&&this.shadowRoot.querySelector(".active").addEventListener("keydown",t=>{t.keyCode===13&&this.collapseInput()})}focus(){if(!this.shadowRoot){console.warn("Input element is not yet connected to the DOM.");return}if(!this.shadowRoot.querySelector("input")){console.warn("Input element is not found in the shadow DOM.");return}this.shadowRoot.querySelector("#search-input").focus()}expandInput(){this.collapsed&&(this.collapsed=!1,this.shadowRoot.querySelector("#search-input").focus(),this.shadowRoot.querySelector("#close-icon").classList.remove("hidden-icon"),this.shadowRoot.querySelector("#close-icon").classList.remove("hidden"),this.shadowRoot.querySelector("#close-icon").classList.add("active-icon"),this.shadowRoot.querySelector("#close-icon").classList.add("active"),this.requestUpdate(),this.shadowRoot.querySelector("#closeIcon").addEventListener("keydown",t=>{t.key==="Enter"&&this.collapseInput()}))}collapseInput(){this.collapsed||(this.collapsed=!0,this.value="",this.shadowRoot.querySelector("#close-icon").classList.add("hidden-icon"),this.shadowRoot.querySelector("#close-icon").classList.add("hidden"),this.shadowRoot.querySelector("#close-icon").classList.remove("active"),this.shadowRoot.querySelector("#close-icon").classList.remove("active-icon"),this.dispatchEvent(new CustomEvent("collapsed",{detail:{closed:!0},bubbles:!0,composed:!0})),this.requestUpdate())}}function T(){typeof window<"u"&&!customElements.get("cd-search")&&customElements.define("cd-search",v)}e.registerIcon();class b extends e.i{static styles=e.i$1`
905
905
  @font-face {
906
906
  font-family: 'Geist';
907
907
  src: url(${e.r(e.fontURL)}) format('woff');
@@ -1246,7 +1246,7 @@
1246
1246
  <input class='${this.error?"input-error":""} ${this.disabled?"disabled":""} ${this.fullWidth?"full-width":""} ${this.variant} ${this.size}' type='time' id='${this.name|"time"}' name='${this.name|"time"}' .value='${this.value}' @change='${this.handleChange}' @focus='${this.handleFocus}' @blur='${this.handleBlur}' @input='${this.handleInput}' ?disabled='${this.disabled}' />
1247
1247
  ${this.shortcut?e.x`<cd-button variant='primary' ?disabled='${this.disabled}'>${this.shortcut}</cd-button>`:""}
1248
1248
  </div>
1249
- `}firstUpdated(){if(!this.shadowRoot){console.warn("Shadow DOM not available, TimeComponent may not render correctly.");return}this.shadowRoot.querySelector("cd-button")&&this.shadowRoot.querySelector("cd-button").addEventListener("button-click",()=>{this.setValue(this.timeNow()),this.dispatchEvent(new CustomEvent("change",{detail:{value:this.value},bubbles:!0,composed:!0}))})}timeNow(){console.log(this.timezone);let t=new Date().toLocaleString("en-US",{timeZone:this.timezone||"America/New_York"});if(console.log(t),console.log(t.split(" ")[2]),t.split(" ")[2]==="PM"){let o=t.split(" ");console.log(o),t=Number(o[1].split(":")[0])+12+":"+o[1].split(":")[1]+":"+o[1].split(":")[2]}else t=t.split(" ")[1];return t}setValue(t){this.value=t,this._internals.setFormValue(t),this.requestUpdate()}setError(t){if(typeof t!="error"){console.warn("Error text must be a string");return}this.error=t,this._internals.setValidity({customError:t}),this.requestUpdate()}setDisabled(t){this.disabled=t,this._internals.setValidity({customError:t}),this.requestUpdate()}}function L(){typeof window<"u"&&!customElements.get("cd-time")&&customElements.define("cd-time",m)}e.registerIcon();class x extends e.i{static styles=e.i$1`
1249
+ `}firstUpdated(){if(!this.shadowRoot){console.warn("Shadow DOM not available, TimeComponent may not render correctly.");return}this.shadowRoot.querySelector("cd-button")&&this.shadowRoot.querySelector("cd-button").addEventListener("button-click",()=>{this.setValue(this.timeNow()),this.dispatchEvent(new CustomEvent("change",{detail:{value:this.value},bubbles:!0,composed:!0}))})}timeNow(){let t=new Date().toLocaleString("en-US",{timeZone:this.timezone||"America/New_York"});if(t.split(" ")[2]==="PM"){let o=t.split(" ");t=Number(o[1].split(":")[0])+12+":"+o[1].split(":")[1]+":"+o[1].split(":")[2]}else t=t.split(" ")[1];return t}setValue(t){this.value=t,this._internals.setFormValue(t),this.requestUpdate()}setError(t){if(typeof t!="error"){console.warn("Error text must be a string");return}this.error=t,this._internals.setValidity({customError:t}),this.requestUpdate()}setDisabled(t){this.disabled=t,this._internals.setValidity({customError:t}),this.requestUpdate()}}function L(){typeof window<"u"&&!customElements.get("cd-time")&&customElements.define("cd-time",m)}e.registerIcon();class x extends e.i{static styles=e.i$1`
1250
1250
  @font-face {
1251
1251
  font-family: 'GeistMono';
1252
1252
  src: url(${e.r(e.fontURL$1)}) format('woff');