@creaditor/web-starterkit 1.0.0

package/dist/307.creaditor.bundle.js

@@ -0,0 +1,23 @@
+"use strict";(("undefined"!=typeof self?self:this).webpackChunkCreaditor=("undefined"!=typeof self?self:this).webpackChunkCreaditor||[]).push([[307],{307(t,i,e){e.r(i),e.d(i,{TimeIcon:()=>s});var h=e(59929);class s extends h.WF{constructor(){super(),this.iconStyle="",this.width="24",this.height="24"}render(){return h.qy`<svg
+      xmlns="http://www.w3.org/2000/svg"
+      viewBox="0 0 24 24"
+      style="${this.iconStyle}"
+      width="${this.width}"
+      height="${this.height}"
+    >
+      <path fill="none" d="M0 0h24v24H0z" />
+      <path
+        d="M12 22C6.477 22 2 17.523 2 12S6.477 2 12 2s10 4.477 10 10-4.477 10-10 10zm0-2a8 8 0 1 0 0-16 8 8 0 0 0 0 16zm1-8h4v2h-6V7h2v5z"
+      />
+    </svg>`}}s.styles=h.AH`
+    :host {
+      display: inherit;
+      --cdtr-icon-width: 20px;
+      --cdtr-icon-height: 20px;
+    }
+    svg {
+      width: var(--cdtr-icon-width);
+      height: var(--cdtr-icon-height);
+      color: var(--cdtr-icon-color);
+    }
+  `,s.properties={iconStyle:{type:String},width:{type:String},height:{type:String}},customElements.define("cdtr-time-icon",s)}}]);

package/dist/3095.creaditor.bundle.js

@@ -0,0 +1,161 @@
+"use strict";(("undefined"!=typeof self?self:this).webpackChunkCreaditor=("undefined"!=typeof self?self:this).webpackChunkCreaditor||[]).push([[3095],{73095(e,t,o){o.r(t),o.d(t,{default:()=>d});var i=o(59929),s=o(21421),n=o(69600);class d extends i.WF{constructor(){super(),this.contentRef=(0,s._)(),this.toggle=this.toggle.bind(this),this.onEnter=this.onEnter.bind(this),this.onKeydown=this.onKeydown.bind(this),this.overflow=!0,this.maxHeight=300,this.left=0,this.top=0,this.custom=!1,this.opened=!1}close(){this.toggle()}onBouncing(e){this.searchText=e.target.value;const t=new UIEvent("search",{view:window,bubbles:!0,cancelable:!0});this.dispatchEvent(t)}render(){return i.qy`
+      <slot @click=${()=>this.toggle()} tabindex="0" name="trigger"></slot>
+      ${this.opened?i.qy` <div
+            @mouseup=${this.onClickOutside}
+            class="backdrop"
+            style="z-index:${(0,n.A)()};"
+          >
+            <div
+              ${(0,s.K)(this.contentRef)}
+              @mouseup=${this.preventClosing}
+              style="z-index:${(0,n.A)()};left:${this.left}px;top:${this.top}px;"
+              class="dropdown-content fade-in ${this.custom?"":"dropdown-background"}"
+            >
+              ${this.search?i.qy`<cdtr-input
+                    @input=${this.onBouncing}
+                    type="search"
+                    value=${this.searchText}
+                  ></cdtr-input>`:null}
+              <slot name="content"></slot>
+            </div>
+          </div>`:null}
+    `}preventClosing(e){return e.stopPropagation(),setTimeout(()=>{this.calcRects()},0),!1}onClickOutside(){this.toggle(!1)}updated(){this.opened&&(setTimeout(()=>{this.calcRects()},0),this.contentRef.value?.classList.add("fade-in"),this.contentRef.value.style.maxHeight=`${this.maxHeight}px`)}calcRects(){let e=0,t=0;const o=this.getBoundingClientRect(),i=this.contentRef?.value?.getBoundingClientRect();i&&(e=o.left,t=o.top,e<0&&(e=0),t<0&&(t=0),e+i.width>window.innerWidth&&(e=window.innerWidth-i.width),t+i.height>window.innerHeight&&(t=window.innerHeight-i.height),this.left=e,this.top=t,this.contentRef.value.style.left=`${o.left}px`,this.contentRef.value.style.top=`${t+o.height}px`,this.contentRef.value.style.overflow=this.overflow?"hidden auto":"hidden")}toggle(){let e=arguments.length>0&&void 0!==arguments[0]&&arguments[0];const t=e||!this.opened;t?(window.removeEventListener("keydown",this.onKeydown),window.addEventListener("keydown",this.onKeydown),this.opened=t,setTimeout(()=>{const e=this.focusedItem=this.querySelector("cdtr-dropdown-item[focused]")||this.querySelector("cdtr-dropdown-item");e&&e.focus()},20)):(window.removeEventListener("keydown",this.onKeydown),this.contentRef.value?.classList.add("fade-out"),setTimeout(()=>{this.opened=t},150)),this.setAttribute("aria-expanded",t)}onEnter(e){e.target===this&&13===e.keyCode&&this.toggle()}onKeydown(e){this.focusedItem&&40===e.keyCode&&this.focusedItem.nextElementSibling&&"CDTR-DROPDOWN-ITEM"===this.focusedItem.nextElementSibling.nodeName?(this.focusedItem=this.focusedItem.nextElementSibling,this.focusedItem&&this.focusedItem.focus()):this.focusedItem&&38===e.keyCode&&this.focusedItem.previousElementSibling&&"CDTR-DROPDOWN-ITEM"===this.focusedItem.previousElementSibling.nodeName?(this.focusedItem=this.focusedItem.previousElementSibling,this.focusedItem&&this.focusedItem.focus()):27===e.keyCode&&this.toggle();const t=new UIEvent("keypress",{view:window,bubbles:!0,cancelable:!0});this.dispatchEvent(t)}connectedCallback(){super.connectedCallback(),this.setAttribute("role","button"),this.setAttribute("tabindex","0"),this.setAttribute("aria-disabled","false"),this.setAttribute("aria-haspopup","true"),this.setAttribute("aria-expanded",this.opened),this.addEventListener("keydown",this.onEnter),setTimeout(()=>{this.opened&&this.toggle(!0)},50)}disconnectedCallback(){super.disconnectedCallback(),window.removeEventListener("keydown",this.onKeydown)}patch(e){this.value=e,this.toggle(!1);const t=new UIEvent("change",{view:window,bubbles:!0,cancelable:!0});this.dispatchEvent(t),setTimeout(()=>{this.focus()},0)}}d.styles=i.AH`
+    :host {
+      display: inline-block;
+      overflow: hidden;
+      box-sizing: border-box;
+    }
+
+    .backdrop {
+      position: fixed;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      background: transparent;
+      overflow: hidden;
+    }
+    .dropdown-background {
+      background: #fff;
+    }
+    .dropdown-content {
+      box-sizing: border-box;
+      min-width: 50px;
+      min-height: 50;
+      position: fixed;
+      border-radius: 0.25rem;
+      /* padding: 3px; */
+      box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
+      transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+    }
+    .fade-in {
+      animation: fade-in 0.3s;
+    }
+    .fade-out {
+      animation: fade-out 0.3s;
+      opacity: 0;
+    }
+    @keyframes fade-in {
+      from {
+        opacity: 0;
+        margin-top: 5px;
+      }
+      to {
+        opacity: 1;
+      }
+    }
+    @keyframes fade-out {
+      from {
+        opacity: 1;
+      }
+      to {
+        margin-top: 5px;
+        opacity: 0;
+      }
+    }
+  `,d.properties={search:{type:Boolean},searchText:{type:String},left:{type:Number},top:{type:Number},opened:{type:Boolean},maxHeight:{type:Number},overflow:{type:Boolean},value:{type:String},custom:{type:String}};class r extends i.WF{constructor(){super(),this.minWidth=50}render(){return i.qy`<paper-button style="min-width:${this.minWidth}px"
+      ><slot></slot> <cdtr-dd-arrow-icon></cdtr-dd-arrow-icon
+    ></paper-button>`}}r.properties={minWidth:{type:Number}},r.styles=i.AH`
+    paper-button {
+      display: flex;
+      justify-content: space-between;
+      text-transform: capitalize;
+      width: 100%;
+      font-size: 14px;
+      font-weight: 400;
+      line-height: 1.5;
+      color: rgb(33, 37, 41);
+      background: rgb(255, 255, 255);
+      background-clip: padding-box;
+      border-width: 1px;
+      border-style: solid;
+      border-image: initial;
+      appearance: none;
+      border-radius: 0.25rem;
+      transition: border-color 0.15s ease-in-out 0s,
+        box-shadow 0.15s ease-in-out 0s;
+      margin: 0px;
+      font-family: var(--font-family);
+      border-color: var(--input-border-color);
+      box-sizing: border-box;
+      padding: 5px;
+      font-size: 12px;
+    }
+    paper-button:hover {
+      border-color: black;
+    }
+  `;class c extends i.WF{constructor(){super(),this.onFocus=this.onFocus.bind(this),this.onBlur=this.onBlur.bind(this)}focus(){this.shadowRoot.querySelector(".dropdown-item").focus()}onFocus(){this.focused=!0}onBlur(){this.focused=!1}onClick(e){if(this.notClickable)return;const t=this.closest("cdtr-dropdown");t&&t.patch(this.value,e,this)}onPress(e){if(13===e.keyCode){const t=new UIEvent("click",{view:window,bubbles:!0,cancelable:!0});this.dispatchEvent(t);const o=this.closest("cdtr-dropdown");o&&o.patch(this.value,e,this)}}connectedCallback(){super.connectedCallback(),this.selected&&this.scrollIntoView({behavior:"smooth",block:"start"})}render(){return i.qy`<div role="button"
+      @click=${this.onClick}
+      @keydown=${this.onPress}
+      @blur=${this.onBlur}
+      @focus=${this.onFocus}
+      class="dropdown-item"
+      tabindex="0"
+    >
+      ${this.selected?i.qy` <svg
+            class="selected-svg"
+            fill="var(--primary)"
+            xmlns="http://www.w3.org/2000/svg"
+            viewBox="0 0 24 24"
+            width="24"
+            height="24"
+          >
+            <path fill="none" d="M0 0h24v24H0z" />
+            <path
+              d="M10 15.172l9.192-9.193 1.415 1.414L10 18l-6.364-6.364 1.414-1.414z"
+            />
+          </svg>`:null}
+      <slot></slot>
+    </div>`}}c.properties={focused:{type:Boolean,reflect:!0},selected:{type:Boolean,reflect:!0},value:{type:String,reflect:!0},notClickable:{type:Boolean}},c.styles=i.AH`
+    .dropdown-item {
+      position: relative;
+      box-sizing: border-box;
+      display: flex;
+      font-family: Arial, Helvetica, sans-serif;
+      font-size: 12px;
+      cursor: pointer;
+      margin-bottom: 2px;
+      display: flex;
+      align-items: center;
+      user-select: none;
+      width: 100%;
+      justify-content: space-between;
+      box-sizing: border-box;
+      padding: 10px 20px;
+    }
+    .dropdown-item:hover {
+      background: #f3f3f396;
+    }
+    .dropdown-item:focus {
+      color: var(--primary-color);
+      outline: none;
+      background: #f3f3f3;
+    }
+    .selected-svg {
+      width: 16px;
+      position: absolute;
+      left: 95%;
+      transform: translate(-70%, -50%);
+      top: 50%;
+    }
+  `,customElements.get("cdtr-dropdown-item")||customElements.define("cdtr-dropdown-item",c),customElements.get("cdtr-dropdown-button")||customElements.define("cdtr-dropdown-button",r),customElements.get("cdtr-dropdown")||customElements.define("cdtr-dropdown",d)}}]);