@qxs-bns/components 0.0.90 → 0.0.92

package/lib/file-upload.cjs

@@ -0,0 +1,164 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("lit"),r=require("lit/decorators.js"),d=require("lit/directives/class-map.js"),c=require("lit/directives/repeat.js"),u=require("lit/directives/style-map.js"),g=require("./base/define.cjs");var f=Object.defineProperty,_=Object.getOwnPropertyDescriptor,i=(l,e,s,t)=>{for(var a=t>1?void 0:t?_(e,s):e,o=l.length-1,p;o>=0;o--)(p=l[o])&&(a=(t?p(e,s,a):p(a))||a);return t&&a&&f(e,s,a),a};function h(l){return l.trim().replace(/^\./,"").split("/").pop()?.toLowerCase()??""}function m(l){try{return JSON.parse(l)}catch{return l}}exports.QxsFileUpload=class extends n.LitElement{constructor(){super(...arguments),this.action="",this.name="file",this.size=20,this.width=160,this.height=90,this.max=3,this.accept="zip,rar",this.files=[],this.notip=!1,this.ext=[],this._internalFiles=[],this._isDragging=!1,this._message="",this._messageType="info",this._pendingUploadCount=0}connectedCallback(){super.connectedCallback(),this._syncFilesFromProps()}updated(e){e.has("files")&&this._syncFilesFromProps()}get _exts(){return(this.ext.length?this.ext:this.accept.split(",")).map(h).filter(Boolean)}_syncFilesFromProps(){this._internalFiles=[...this.files]}_setMessage(e,s){this._messageType=e,this._message=s}_clearMessage(){this._message="",this._messageType="info"}_validateFile(e){const s=h(e.name.split(".").pop()??""),t=this._exts.includes(s),a=e.size/1024/1024<this.size;return t?a?this._internalFiles.length+this._pendingUploadCount>=this.max?(this._setMessage("warning","文件上传超过限制"),!1):!0:(this._setMessage("error",`上传文件大小不能超过 ${this.size}MB！`),!1):(this._setMessage("error",`上传文件只支持 ${this._exts.join(" / ")} 格式！`),!1)}_dispatchUploadSuccess(e){this.dispatchEvent(new CustomEvent("upload-success",{detail:e,bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("on-success",{detail:e,bubbles:!0,composed:!0})),typeof this.onSuccess=="function"&&this.onSuccess(e.response,e.file,e.files)}_dispatchFilesChange(){this.dispatchEvent(new CustomEvent("files-change",{detail:{items:this._internalFiles.slice()},bubbles:!0,composed:!0}))}_handleSelectedFiles(e){this._clearMessage(),e.forEach(s=>{this._validateFile(s)&&this._uploadFile(s)})}_handleDrop(e){e.preventDefault(),this._isDragging=!1;const s=e.dataTransfer?.files;s&&this._handleSelectedFiles(Array.from(s))}_handleDragOver(e){e.preventDefault(),this._isDragging=!0}_handleDragLeave(){this._isDragging=!1}_handleInputChange(e){const s=e.target,t=s.files;t&&(this._handleSelectedFiles(Array.from(t)),s.value="")}_uploadFile(e){if(!this.action){this._setMessage("warning","请先配置上传地址 action");return}const s=new FormData;s.append(this.name,e),this.data&&Object.entries(this.data).forEach(([a,o])=>{s.append(a,o)});const t=new XMLHttpRequest;t.open("POST",this.action),this._pendingUploadCount+=1,this.headers&&Object.entries(this.headers).forEach(([a,o])=>{t.setRequestHeader(a,o)}),t.onload=()=>{if(this._pendingUploadCount=Math.max(0,this._pendingUploadCount-1),t.status>=200&&t.status<300){const a=m(t.responseText),o={name:e.name,file:e};this._internalFiles=[...this._internalFiles,o],this._setMessage("info",`${e.name} 上传成功`),this._dispatchFilesChange(),this._dispatchUploadSuccess({response:a,file:e,files:this._internalFiles.map(p=>p.file).filter(Boolean),items:this._internalFiles.slice()})}else this._setMessage("error","上传失败")},t.onerror=()=>{this._pendingUploadCount=Math.max(0,this._pendingUploadCount-1),this._setMessage("error","上传失败")},t.send(s)}_handleRemove(e){this._internalFiles=this._internalFiles.filter((s,t)=>t!==e),this._dispatchFilesChange()}render(){const e={control:!0,"is-dragging":this._isDragging},s={"--upload-width":`${this.width}px`,"--upload-height":`${this.height}px`};return n.html`
+      <div class="upload" part="container">
+        <div
+          class=${d.classMap(e)}
+          part="control"
+          style=${u.styleMap(s)}
+          @click=${()=>this._input?.click()}
+          @drop=${this._handleDrop}
+          @dragover=${this._handleDragOver}
+          @dragleave=${this._handleDragLeave}
+        >
+          <input
+            type="file"
+            accept=${this.accept}
+            ?multiple=${this.max>1}
+            style="display:none"
+            @change=${this._handleInputChange}
+          >
+          <div class="icon" part="icon" aria-hidden="true">
+            <svg viewBox="0 0 24 24" fill="currentColor" width="100%" height="100%">
+              <path d="M19.35 10.04C18.67 6.59 15.64 4 12 4 9.11 4 6.6 5.64 5.35 8.04 2.34 8.36 0 10.91 0 14c0 3.31 2.69 6 6 6h13c2.76 0 5-2.24 5-5 0-2.64-2.05-4.78-4.65-4.96zM14 13v4h-4v-4H7l5-5 5 5h-3z"/>
+            </svg>
+          </div>
+          <div class="text" part="text">将文件拖到此处，或<em>点击上传</em></div>
+        </div>
+
+        ${this._internalFiles.length?n.html`
+              <div class="list" part="list">
+                ${c.repeat(this._internalFiles,t=>`${t.name}-${t.url??""}`,(t,a)=>n.html`
+                  <div class="item" part="item">
+                    <span class="item-name">${t.name}</span>
+                    <button
+                      class="remove"
+                      part="remove"
+                      type="button"
+                      @click=${o=>{o.stopPropagation(),this._handleRemove(a)}}
+                    >
+                      ×
+                    </button>
+                  </div>
+                `)}
+              </div>
+            `:n.nothing}
+
+        ${this._message?n.html`<div class="status ${this._messageType}" part="status">${this._message}</div>`:n.nothing}
+
+        ${this.notip?n.nothing:n.html`
+              <div class="status info" part="tip">
+                <slot name="tip">
+                  上传文件支持 ${this._exts.join(" / ")} 格式，单个文件大小不超过 ${this.size}MB，且文件数量不超过 ${this.max} 个
+                </slot>
+              </div>
+            `}
+      </div>
+    `}};exports.QxsFileUpload.styles=n.css`
+    :host {
+      display: block;
+      width: 100%;
+      --upload-width: 160px;
+      --upload-height: 90px;
+      color: #0f172a;
+      font-size: 14px;
+    }
+
+    .upload {
+      display: grid;
+      gap: 12px;
+      justify-items: start;
+    }
+
+    .control {
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+      justify-content: center;
+      box-sizing: border-box;
+      width: var(--upload-width);
+      min-height: var(--upload-height);
+      padding: 10px 12px;
+      cursor: pointer;
+      background: #f8fafc;
+      border: 1px dashed #cbd5e1;
+      border-radius: 16px;
+      transition: border-color 0.2s ease, background-color 0.2s ease;
+    }
+
+    .control.is-dragging {
+      background: #eef4ff;
+      border-color: #3d61e3;
+    }
+
+    .icon {
+      width: 28px;
+      height: 28px;
+      margin-bottom: 8px;
+      color: #3d61e3;
+    }
+
+    .text {
+      font-size: 12px;
+      line-height: 1.4;
+      color: #475569;
+      text-align: center;
+    }
+
+    .text em {
+      font-style: normal;
+      color: #3d61e3;
+    }
+
+    .list {
+      display: grid;
+      gap: 8px;
+    }
+
+    .item {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      gap: 12px;
+      padding: 10px 12px;
+      background: #fff;
+      border: 1px solid #e2e8f0;
+      border-radius: 12px;
+    }
+
+    .item-name {
+      flex: 1;
+      min-width: 0;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+    }
+
+    .remove {
+      padding: 0;
+      color: #94a3b8;
+      cursor: pointer;
+      background: transparent;
+      border: 0;
+    }
+
+    .status {
+      padding: 10px 12px;
+      line-height: 1.6;
+      border-radius: 12px;
+    }
+
+    .status.info {
+      color: #1d4ed8;
+      background: #eff6ff;
+    }
+
+    .status.warning {
+      color: #9a3412;
+      background: #fff7ed;
+    }
+
+    .status.error {
+      color: #b91c1c;
+      background: #fef2f2;
+    }
+  `;i([r.property({type:String})],exports.QxsFileUpload.prototype,"action",2);i([r.property({attribute:!1})],exports.QxsFileUpload.prototype,"headers",2);i([r.property({attribute:!1})],exports.QxsFileUpload.prototype,"data",2);i([r.property({type:String})],exports.QxsFileUpload.prototype,"name",2);i([r.property({type:Number})],exports.QxsFileUpload.prototype,"size",2);i([r.property({type:Number})],exports.QxsFileUpload.prototype,"width",2);i([r.property({type:Number})],exports.QxsFileUpload.prototype,"height",2);i([r.property({type:Number,attribute:"max"})],exports.QxsFileUpload.prototype,"max",2);i([r.property({type:String})],exports.QxsFileUpload.prototype,"accept",2);i([r.property({attribute:!1})],exports.QxsFileUpload.prototype,"files",2);i([r.property({type:Boolean})],exports.QxsFileUpload.prototype,"notip",2);i([r.property({attribute:!1})],exports.QxsFileUpload.prototype,"ext",2);i([r.state()],exports.QxsFileUpload.prototype,"_internalFiles",2);i([r.state()],exports.QxsFileUpload.prototype,"_isDragging",2);i([r.state()],exports.QxsFileUpload.prototype,"_message",2);i([r.state()],exports.QxsFileUpload.prototype,"_messageType",2);i([r.query('input[type="file"]')],exports.QxsFileUpload.prototype,"_input",2);exports.QxsFileUpload=i([g.safeCustomElement("qxs-file-upload")],exports.QxsFileUpload);
+//# sourceMappingURL=file-upload.cjs.map

package/lib/file-upload.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"file-upload.cjs","sources":["../../../packages/components/src/file-upload.ts"],"sourcesContent":["import { LitElement, css, html, nothing } from 'lit'\nimport { property, query, state } from 'lit/decorators.js'\nimport { classMap } from 'lit/directives/class-map.js'\nimport { repeat } from 'lit/directives/repeat.js'\nimport { styleMap } from 'lit/directives/style-map.js'\nimport { safeCustomElement } from './base/define'\n\ntype UploadItem = {\n  name: string\n  url?: string\n  file?: File\n}\n\ntype UploadSuccessDetail = {\n  response: any\n  file: File\n  files: File[]\n  items: UploadItem[]\n}\n\nfunction normalizeExt(value: string) {\n  return value.trim().replace(/^\\./, '').split('/').pop()?.toLowerCase() ?? ''\n}\n\nfunction parseJsonResponse(responseText: string) {\n  try {\n    return JSON.parse(responseText)\n  }\n  catch {\n    return responseText\n  }\n}\n\n@safeCustomElement('qxs-file-upload')\nexport class QxsFileUpload extends LitElement {\n  static styles = css`\n    :host {\n      display: block;\n      width: 100%;\n      --upload-width: 160px;\n      --upload-height: 90px;\n      color: #0f172a;\n      font-size: 14px;\n    }\n\n    .upload {\n      display: grid;\n      gap: 12px;\n      justify-items: start;\n    }\n\n    .control {\n      display: flex;\n      flex-direction: column;\n      align-items: center;\n      justify-content: center;\n      box-sizing: border-box;\n      width: var(--upload-width);\n      min-height: var(--upload-height);\n      padding: 10px 12px;\n      cursor: pointer;\n      background: #f8fafc;\n      border: 1px dashed #cbd5e1;\n      border-radius: 16px;\n      transition: border-color 0.2s ease, background-color 0.2s ease;\n    }\n\n    .control.is-dragging {\n      background: #eef4ff;\n      border-color: #3d61e3;\n    }\n\n    .icon {\n      width: 28px;\n      height: 28px;\n      margin-bottom: 8px;\n      color: #3d61e3;\n    }\n\n    .text {\n      font-size: 12px;\n      line-height: 1.4;\n      color: #475569;\n      text-align: center;\n    }\n\n    .text em {\n      font-style: normal;\n      color: #3d61e3;\n    }\n\n    .list {\n      display: grid;\n      gap: 8px;\n    }\n\n    .item {\n      display: flex;\n      align-items: center;\n      justify-content: space-between;\n      gap: 12px;\n      padding: 10px 12px;\n      background: #fff;\n      border: 1px solid #e2e8f0;\n      border-radius: 12px;\n    }\n\n    .item-name {\n      flex: 1;\n      min-width: 0;\n      overflow: hidden;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n    }\n\n    .remove {\n      padding: 0;\n      color: #94a3b8;\n      cursor: pointer;\n      background: transparent;\n      border: 0;\n    }\n\n    .status {\n      padding: 10px 12px;\n      line-height: 1.6;\n      border-radius: 12px;\n    }\n\n    .status.info {\n      color: #1d4ed8;\n      background: #eff6ff;\n    }\n\n    .status.warning {\n      color: #9a3412;\n      background: #fff7ed;\n    }\n\n    .status.error {\n      color: #b91c1c;\n      background: #fef2f2;\n    }\n  `\n\n  @property({ type: String }) action = ''\n  @property({ attribute: false }) headers?: Record<string, string>\n  @property({ attribute: false }) data?: Record<string, string | Blob>\n  @property({ type: String }) name = 'file'\n  @property({ type: Number }) size = 20\n  @property({ type: Number }) width = 160\n  @property({ type: Number }) height = 90\n  @property({ type: Number, attribute: 'max' }) max = 3\n  @property({ type: String }) accept = 'zip,rar'\n  @property({ attribute: false }) files: UploadItem[] = []\n  @property({ type: Boolean }) notip = false\n  @property({ attribute: false }) ext: string[] = []\n\n  @state() private _internalFiles: UploadItem[] = []\n  @state() private _isDragging = false\n  @state() private _message = ''\n  @state() private _messageType: 'info' | 'warning' | 'error' = 'info'\n\n  @query('input[type=\"file\"]') private _input?: HTMLInputElement\n  private _pendingUploadCount = 0\n\n  connectedCallback() {\n    super.connectedCallback()\n    this._syncFilesFromProps()\n  }\n\n  updated(changed: Map<string, unknown>) {\n    if (changed.has('files')) {\n      this._syncFilesFromProps()\n    }\n  }\n\n  private get _exts() {\n    const source = this.ext.length ? this.ext : this.accept.split(',')\n    return source.map(normalizeExt).filter(Boolean)\n  }\n\n  private _syncFilesFromProps() {\n    this._internalFiles = [...this.files]\n  }\n\n  private _setMessage(type: 'info' | 'warning' | 'error', message: string) {\n    this._messageType = type\n    this._message = message\n  }\n\n  private _clearMessage() {\n    this._message = ''\n    this._messageType = 'info'\n  }\n\n  private _validateFile(file: File) {\n    const fileExt = normalizeExt(file.name.split('.').pop() ?? '')\n    const isTypeOk = this._exts.includes(fileExt)\n    const isSizeOk = file.size / 1024 / 1024 < this.size\n\n    if (!isTypeOk) {\n      this._setMessage('error', `上传文件只支持 ${this._exts.join(' / ')} 格式！`)\n      return false\n    }\n\n    if (!isSizeOk) {\n      this._setMessage('error', `上传文件大小不能超过 ${this.size}MB！`)\n      return false\n    }\n\n    if (this._internalFiles.length + this._pendingUploadCount >= this.max) {\n      this._setMessage('warning', '文件上传超过限制')\n      return false\n    }\n\n    return true\n  }\n\n  private _dispatchUploadSuccess(detail: UploadSuccessDetail) {\n    this.dispatchEvent(new CustomEvent('upload-success', {\n      detail,\n      bubbles: true,\n      composed: true,\n    }))\n    this.dispatchEvent(new CustomEvent('on-success', {\n      detail,\n      bubbles: true,\n      composed: true,\n    }))\n\n    if (typeof (this as any).onSuccess === 'function') {\n      ;(this as any).onSuccess(detail.response, detail.file, detail.files)\n    }\n  }\n\n  private _dispatchFilesChange() {\n    this.dispatchEvent(new CustomEvent('files-change', {\n      detail: { items: this._internalFiles.slice() },\n      bubbles: true,\n      composed: true,\n    }))\n  }\n\n  private _handleSelectedFiles(files: File[]) {\n    this._clearMessage()\n    files.forEach((file) => {\n      if (this._validateFile(file)) {\n        this._uploadFile(file)\n      }\n    })\n  }\n\n  private _handleDrop(event: DragEvent) {\n    event.preventDefault()\n    this._isDragging = false\n    const files = event.dataTransfer?.files\n    if (!files) {\n      return\n    }\n    this._handleSelectedFiles(Array.from(files))\n  }\n\n  private _handleDragOver(event: DragEvent) {\n    event.preventDefault()\n    this._isDragging = true\n  }\n\n  private _handleDragLeave() {\n    this._isDragging = false\n  }\n\n  private _handleInputChange(event: Event) {\n    const target = event.target as HTMLInputElement\n    const files = target.files\n    if (!files) {\n      return\n    }\n\n    this._handleSelectedFiles(Array.from(files))\n    target.value = ''\n  }\n\n  private _uploadFile(file: File) {\n    if (!this.action) {\n      this._setMessage('warning', '请先配置上传地址 action')\n      return\n    }\n\n    const formData = new FormData()\n    formData.append(this.name, file)\n\n    if (this.data) {\n      Object.entries(this.data).forEach(([key, value]) => {\n        formData.append(key, value)\n      })\n    }\n\n    const xhr = new XMLHttpRequest()\n    xhr.open('POST', this.action)\n    this._pendingUploadCount += 1\n\n    if (this.headers) {\n      Object.entries(this.headers).forEach(([key, value]) => {\n        xhr.setRequestHeader(key, value)\n      })\n    }\n\n    xhr.onload = () => {\n      this._pendingUploadCount = Math.max(0, this._pendingUploadCount - 1)\n      if (xhr.status >= 200 && xhr.status < 300) {\n        const response = parseJsonResponse(xhr.responseText)\n        const nextItem: UploadItem = { name: file.name, file }\n        this._internalFiles = [...this._internalFiles, nextItem]\n        this._setMessage('info', `${file.name} 上传成功`)\n        this._dispatchFilesChange()\n        this._dispatchUploadSuccess({\n          response,\n          file,\n          files: this._internalFiles.map(item => item.file).filter(Boolean) as File[],\n          items: this._internalFiles.slice(),\n        })\n      }\n      else {\n        this._setMessage('error', '上传失败')\n      }\n    }\n\n    xhr.onerror = () => {\n      this._pendingUploadCount = Math.max(0, this._pendingUploadCount - 1)\n      this._setMessage('error', '上传失败')\n    }\n\n    xhr.send(formData)\n  }\n\n  private _handleRemove(index: number) {\n    this._internalFiles = this._internalFiles.filter((_, fileIndex) => fileIndex !== index)\n    this._dispatchFilesChange()\n  }\n\n  render() {\n    const controlClasses = {\n      control: true,\n      'is-dragging': this._isDragging,\n    }\n    const controlStyle = {\n      '--upload-width': `${this.width}px`,\n      '--upload-height': `${this.height}px`,\n    }\n\n    return html`\n      <div class=\"upload\" part=\"container\">\n        <div\n          class=${classMap(controlClasses)}\n          part=\"control\"\n          style=${styleMap(controlStyle)}\n          @click=${() => this._input?.click()}\n          @drop=${this._handleDrop}\n          @dragover=${this._handleDragOver}\n          @dragleave=${this._handleDragLeave}\n        >\n          <input\n            type=\"file\"\n            accept=${this.accept}\n            ?multiple=${this.max > 1}\n            style=\"display:none\"\n            @change=${this._handleInputChange}\n          >\n          <div class=\"icon\" part=\"icon\" aria-hidden=\"true\">\n            <svg viewBox=\"0 0 24 24\" fill=\"currentColor\" width=\"100%\" height=\"100%\">\n              <path d=\"M19.35 10.04C18.67 6.59 15.64 4 12 4 9.11 4 6.6 5.64 5.35 8.04 2.34 8.36 0 10.91 0 14c0 3.31 2.69 6 6 6h13c2.76 0 5-2.24 5-5 0-2.64-2.05-4.78-4.65-4.96zM14 13v4h-4v-4H7l5-5 5 5h-3z\"/>\n            </svg>\n          </div>\n          <div class=\"text\" part=\"text\">将文件拖到此处，或<em>点击上传</em></div>\n        </div>\n\n        ${this._internalFiles.length\n          ? html`\n              <div class=\"list\" part=\"list\">\n                ${repeat(this._internalFiles, item => `${item.name}-${item.url ?? ''}`, (item, index) => html`\n                  <div class=\"item\" part=\"item\">\n                    <span class=\"item-name\">${item.name}</span>\n                    <button\n                      class=\"remove\"\n                      part=\"remove\"\n                      type=\"button\"\n                      @click=${(event: Event) => {\n                        event.stopPropagation()\n                        this._handleRemove(index)\n                      }}\n                    >\n                      ×\n                    </button>\n                  </div>\n                `)}\n              </div>\n            `\n          : nothing}\n\n        ${this._message\n          ? html`<div class=\"status ${this._messageType}\" part=\"status\">${this._message}</div>`\n          : nothing}\n\n        ${this.notip\n          ? nothing\n          : html`\n              <div class=\"status info\" part=\"tip\">\n                <slot name=\"tip\">\n                  上传文件支持 ${this._exts.join(' / ')} 格式，单个文件大小不超过 ${this.size}MB，且文件数量不超过 ${this.max} 个\n                </slot>\n              </div>\n            `}\n      </div>\n    `\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'qxs-file-upload': QxsFileUpload\n  }\n}\n"],"names":["normalizeExt","value","parseJsonResponse","responseText","QxsFileUpload","LitElement","changed","type","message","file","fileExt","isTypeOk","isSizeOk","detail","files","event","target","formData","key","xhr","response","nextItem","item","index","_","fileIndex","controlClasses","controlStyle","html","classMap","styleMap","repeat","nothing","css","__decorateClass","property","state","query","safeCustomElement"],"mappings":"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"}

package/lib/fixed-action-bar.cjs

@@ -0,0 +1,39 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("lit"),i=require("lit/decorators.js"),h=require("lit/directives/style-map.js"),d=require("./base/define.cjs");var b=Object.defineProperty,_=Object.getOwnPropertyDescriptor,e=(a,t,r,o)=>{for(var s=o>1?void 0:o?_(t,r):t,n=a.length-1,c;n>=0;n--)(c=a[n])&&(s=(o?c(t,r,s):c(s))||s);return o&&s&&b(t,r,s),s};function p(){return typeof navigator>"u"?!1:/Android/i.test(navigator.userAgent)}exports.QxsFixedActionBar=class extends l.LitElement{constructor(){super(...arguments),this.padding=8,this.className="",this._barHeight=0,this._barLeft=0,this._barWidth=0,this._isBottom=!1,this._actionbarObserver=null,this._hostObserver=null,this._resizeHandler=()=>{this._syncGeometry(),this._syncScrollState()},this._scrollFrame=0,this._handleScroll=()=>{this._scrollFrame&&cancelAnimationFrame(this._scrollFrame),this._scrollFrame=requestAnimationFrame(()=>{this._scrollFrame=0,this._syncScrollState()})}}connectedCallback(){super.connectedCallback(),window.addEventListener("resize",this._resizeHandler,{passive:!0}),window.addEventListener("scroll",this._handleScroll,{passive:!0})}firstUpdated(){this._initObservers(),queueMicrotask(()=>{this.isConnected&&(this._syncGeometry(),this._syncScrollState())})}disconnectedCallback(){super.disconnectedCallback(),window.removeEventListener("resize",this._resizeHandler),window.removeEventListener("scroll",this._handleScroll),this._actionbarObserver?.disconnect(),this._hostObserver?.disconnect(),this._scrollFrame&&(cancelAnimationFrame(this._scrollFrame),this._scrollFrame=0)}_initObservers(){if(typeof ResizeObserver>"u")return;const t=this._getLayoutAnchor();this._actionbarObserver=new ResizeObserver(()=>{this._syncGeometry()}),this._hostObserver=new ResizeObserver(()=>{this._syncGeometry()}),this._actionbar&&this._actionbarObserver.observe(this._actionbar),this._hostObserver.observe(this),t!==this&&this._hostObserver.observe(t)}_getLayoutAnchor(){return this.parentElement??this}_syncGeometry(){const t=this._getLayoutAnchor().getBoundingClientRect();this._barWidth=Math.max(Math.round(t.width),0),this._barLeft=Math.round(t.left);const r=Math.ceil(this._actionbar?.getBoundingClientRect().height||0);this._barHeight=Math.max(r,0)}_syncScrollState(){const t=document.documentElement;this._isBottom=Math.ceil(window.scrollY+t.clientHeight)>=t.scrollHeight}_bottomPadding(){return p()?Math.max(this.padding,20):this.padding}render(){const t=["actionbar",this._isBottom?"":"is-shadow",this.className].filter(Boolean).join(" ");return l.html`
+      <div
+        part="placeholder"
+        class="placeholder"
+        style=${h.styleMap({height:`${this._barHeight}px`})}
+      >
+        <div
+          part="actionbar"
+          class=${t}
+          style=${h.styleMap({width:`${this._barWidth}px`,left:`${this._barLeft}px`,padding:`${this.padding}px`,paddingBottom:`calc(env(safe-area-inset-bottom) + ${this._bottomPadding()}px)`})}
+        >
+          <slot></slot>
+        </div>
+      </div>
+    `}};exports.QxsFixedActionBar.styles=l.css`
+    :host {
+      display: block;
+      width: 100%;
+    }
+
+    .placeholder {
+      width: 100%;
+    }
+
+    .actionbar {
+      position: fixed;
+      bottom: 0;
+      z-index: 10;
+      box-sizing: border-box;
+      text-align: center;
+      background-color: var(--qxs-bg-color, #fff);
+      transition: box-shadow 0.3s ease;
+    }
+
+    .actionbar.is-shadow {
+      box-shadow: 0 0 1px 0 var(--qxs-border-color, #f3f3f2);
+    }
+  `;e([i.property({type:Number})],exports.QxsFixedActionBar.prototype,"padding",2);e([i.property({type:String,attribute:"class-name"})],exports.QxsFixedActionBar.prototype,"className",2);e([i.state()],exports.QxsFixedActionBar.prototype,"_barHeight",2);e([i.state()],exports.QxsFixedActionBar.prototype,"_barLeft",2);e([i.state()],exports.QxsFixedActionBar.prototype,"_barWidth",2);e([i.state()],exports.QxsFixedActionBar.prototype,"_isBottom",2);e([i.query(".actionbar")],exports.QxsFixedActionBar.prototype,"_actionbar",2);exports.QxsFixedActionBar=e([d.safeCustomElement("qxs-fixed-action-bar")],exports.QxsFixedActionBar);
+//# sourceMappingURL=fixed-action-bar.cjs.map

package/lib/fixed-action-bar.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"fixed-action-bar.cjs","sources":["../../../packages/components/src/fixed-action-bar.ts"],"sourcesContent":["import { LitElement, css, html } from 'lit'\nimport { property, query, state } from 'lit/decorators.js'\nimport { styleMap } from 'lit/directives/style-map.js'\nimport { safeCustomElement } from './base/define'\n\nfunction isAndroidDevice() {\n  if (typeof navigator === 'undefined') {\n    return false\n  }\n\n  return /Android/i.test(navigator.userAgent)\n}\n\n@safeCustomElement('qxs-fixed-action-bar')\nexport class QxsFixedActionBar extends LitElement {\n  static styles = css`\n    :host {\n      display: block;\n      width: 100%;\n    }\n\n    .placeholder {\n      width: 100%;\n    }\n\n    .actionbar {\n      position: fixed;\n      bottom: 0;\n      z-index: 10;\n      box-sizing: border-box;\n      text-align: center;\n      background-color: var(--qxs-bg-color, #fff);\n      transition: box-shadow 0.3s ease;\n    }\n\n    .actionbar.is-shadow {\n      box-shadow: 0 0 1px 0 var(--qxs-border-color, #f3f3f2);\n    }\n  `\n\n  @property({ type: Number }) padding = 8\n  @property({ type: String, attribute: 'class-name' }) className = ''\n\n  @state() private _barHeight = 0\n  @state() private _barLeft = 0\n  @state() private _barWidth = 0\n  @state() private _isBottom = false\n\n  @query('.actionbar') private _actionbar?: HTMLDivElement\n\n  private _actionbarObserver: ResizeObserver | null = null\n  private _hostObserver: ResizeObserver | null = null\n  private _resizeHandler = () => {\n    this._syncGeometry()\n    this._syncScrollState()\n  }\n  private _scrollFrame = 0\n\n  connectedCallback() {\n    super.connectedCallback()\n    window.addEventListener('resize', this._resizeHandler, { passive: true })\n    window.addEventListener('scroll', this._handleScroll, { passive: true })\n  }\n\n  firstUpdated() {\n    this._initObservers()\n    queueMicrotask(() => {\n      if (!this.isConnected) {\n        return\n      }\n\n      this._syncGeometry()\n      this._syncScrollState()\n    })\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback()\n    window.removeEventListener('resize', this._resizeHandler)\n    window.removeEventListener('scroll', this._handleScroll)\n    this._actionbarObserver?.disconnect()\n    this._hostObserver?.disconnect()\n\n    if (this._scrollFrame) {\n      cancelAnimationFrame(this._scrollFrame)\n      this._scrollFrame = 0\n    }\n  }\n\n  private _handleScroll = () => {\n    if (this._scrollFrame) {\n      cancelAnimationFrame(this._scrollFrame)\n    }\n\n    this._scrollFrame = requestAnimationFrame(() => {\n      this._scrollFrame = 0\n      this._syncScrollState()\n    })\n  }\n\n  private _initObservers() {\n    if (typeof ResizeObserver === 'undefined') {\n      return\n    }\n\n    const layoutAnchor = this._getLayoutAnchor()\n\n    this._actionbarObserver = new ResizeObserver(() => {\n      this._syncGeometry()\n    })\n    this._hostObserver = new ResizeObserver(() => {\n      this._syncGeometry()\n    })\n\n    if (this._actionbar) {\n      this._actionbarObserver.observe(this._actionbar)\n    }\n    this._hostObserver.observe(this)\n    if (layoutAnchor !== this) {\n      this._hostObserver.observe(layoutAnchor)\n    }\n  }\n\n  private _getLayoutAnchor() {\n    return this.parentElement ?? this\n  }\n\n  private _syncGeometry() {\n    const hostRect = this._getLayoutAnchor().getBoundingClientRect()\n    this._barWidth = Math.max(Math.round(hostRect.width), 0)\n    this._barLeft = Math.round(hostRect.left)\n\n    const barHeight = Math.ceil(this._actionbar?.getBoundingClientRect().height || 0)\n    this._barHeight = Math.max(barHeight, 0)\n  }\n\n  private _syncScrollState() {\n    const doc = document.documentElement\n    this._isBottom = Math.ceil(window.scrollY + doc.clientHeight) >= doc.scrollHeight\n  }\n\n  private _bottomPadding() {\n    return isAndroidDevice()\n      ? Math.max(this.padding, 20)\n      : this.padding\n  }\n\n  render() {\n    const actionbarClassName = ['actionbar', !this._isBottom ? 'is-shadow' : '', this.className]\n      .filter(Boolean)\n      .join(' ')\n\n    return html`\n      <div\n        part=\"placeholder\"\n        class=\"placeholder\"\n        style=${styleMap({ height: `${this._barHeight}px` })}\n      >\n        <div\n          part=\"actionbar\"\n          class=${actionbarClassName}\n          style=${styleMap({\n            width: `${this._barWidth}px`,\n            left: `${this._barLeft}px`,\n            padding: `${this.padding}px`,\n            paddingBottom: `calc(env(safe-area-inset-bottom) + ${this._bottomPadding()}px)`,\n          })}\n        >\n          <slot></slot>\n        </div>\n      </div>\n    `\n  }\n}\n"],"names":["isAndroidDevice","QxsFixedActionBar","LitElement","layoutAnchor","hostRect","barHeight","doc","actionbarClassName","html","styleMap","css","__decorateClass","property","state","query","safeCustomElement"],"mappings":"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"}

package/lib/icon.cjs

@@ -0,0 +1,20 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("lit"),o=require("lit/decorators.js"),a=require("lit/directives/style-map.js"),p=require("./base/define.cjs");var g=Object.defineProperty,u=Object.getOwnPropertyDescriptor,s=(c,t,e,i)=>{for(var n=i>1?void 0:i?u(t,e):t,l=c.length-1,h;l>=0;l--)(h=c[l])&&(n=(i?h(t,e,n):h(n))||n);return i&&n&&g(t,e,n),n};exports.QxsIcon=class extends r.LitElement{constructor(){super(...arguments),this.icon="",this.flip="",this.rotate=0,this.color="",this.localIconPrefix="icon-",this.fallback="",this.loading="",this._imageLoading=!1,this._imageError=!1}createRenderRoot(){return this}connectedCallback(){super.connectedCallback(),this._resetImageState()}willUpdate(t){(t.has("icon")||t.has("color")&&this._outputType()==="iconify")&&this._resetImageState()}_outputType(){if(typeof this.icon!="string")return"empty";const t=this.icon.trim();if(!t)return"empty";const e=i=>/^\.{1,2}\//.test(i)||i.startsWith("/")||i.includes("/");return/^https?:\/\//.test(t)||e(t)?"img":/^i-[^:]+:[^:]+/.test(t)?"unocss":t.startsWith("i-")&&!t.includes(":")?"css":t.includes(":")&&!t.startsWith("i-")?"iconify":/^[\w-]+$/.test(t)&&!t.startsWith("i-")?"svg":"css"}_iconName(){return typeof this.icon=="string"?this.icon.trim():""}_resetImageState(){const t=this._outputType();if(t==="img"||t==="iconify"){this._imageLoading=!0,this._imageError=!1;return}this._imageLoading=!1,this._imageError=!1}_formatSize(t){return t==null||t===""?"":typeof t=="number"?`${t}px`:/^\d+(?:\.\d+)?$/.test(t)?`${t}px`:t}_transformStyle(){const t=[];switch(this.flip){case"horizontal":t.push("rotateY(180deg)");break;case"vertical":t.push("rotateX(180deg)");break;case"both":t.push("rotateX(180deg)","rotateY(180deg)");break}return this.rotate&&t.push(`rotate(${this.rotate%360}deg)`),t.join(" ")}_containerStyle(){const t=this._formatSize(this.size)||"1em",e=this._transformStyle();return{position:"relative",display:"inline-flex",alignItems:"center",justifyContent:"center",width:t,height:t,fontSize:t,lineHeight:"1",color:this.color||"currentColor",verticalAlign:"-2px",transform:e||void 0,transformOrigin:"center",fill:"currentColor"}}_glyphStyle(){return{display:"inline-flex",alignItems:"center",justifyContent:"center",width:"100%",height:"100%",lineHeight:"1",color:"inherit",fontSize:"inherit",flexShrink:"0"}}_imageStyle(t=!0){return{display:t?"block":"none",width:"100%",height:"100%",objectFit:"contain",flexShrink:"0"}}_imageSource(){if(this._outputType()==="iconify"){const t=new URL(`https://api.iconify.design/${this._iconName()}.svg`);return this.color&&t.searchParams.set("color",this.color),t.toString()}return this._iconName()}_renderClassGlyph(t){const e=t.split(/\s+/).filter(Boolean).join(" ");return e?r.html`<i class=${e} style=${a.styleMap(this._glyphStyle())} aria-hidden="true"></i>`:r.nothing}_renderSvgSprite(){const t=this._iconName();return t?r.html`
+      <svg
+        aria-hidden="true"
+        viewBox="0 0 1024 1024"
+        style=${a.styleMap({display:"block",width:"100%",height:"100%",fill:"currentColor",flexShrink:"0"})}
+      >
+        <use href=${`#${this.localIconPrefix}${t}`}></use>
+      </svg>
+    `:r.nothing}_renderImage(){const t=this._imageSource();if(!t)return r.nothing;const e=this._imageError&&!!this.fallback,i=!this._imageError&&this._imageLoading&&!!this.loading,n=!this._imageError&&!i;return r.html`
+      ${i?this._renderClassGlyph(this.loading):r.nothing}
+      ${e?this._renderClassGlyph(this.fallback):r.nothing}
+      <img
+        src=${t}
+        alt=""
+        style=${a.styleMap(this._imageStyle(n))}
+        @load=${()=>{this._imageLoading=!1,this._imageError=!1}}
+        @error=${()=>{this._imageLoading=!1,this._imageError=!0}}
+      />
+    `}render(){const t=this._outputType();if(t==="empty")return r.nothing;let e=r.nothing;switch(t){case"iconify":case"img":e=this._renderImage();break;case"unocss":case"css":e=this._renderClassGlyph(this._iconName());break;case"svg":e=this._renderSvgSprite();break;default:e=r.nothing}return r.html`<span class="qxs-icon-wc" style=${a.styleMap(this._containerStyle())}>${e}</span>`}};s([o.property({attribute:!1})],exports.QxsIcon.prototype,"icon",2);s([o.property({type:String})],exports.QxsIcon.prototype,"flip",2);s([o.property({type:Number})],exports.QxsIcon.prototype,"rotate",2);s([o.property({type:String})],exports.QxsIcon.prototype,"color",2);s([o.property({attribute:!1})],exports.QxsIcon.prototype,"size",2);s([o.property({type:String,attribute:"local-icon-prefix"})],exports.QxsIcon.prototype,"localIconPrefix",2);s([o.property({type:String})],exports.QxsIcon.prototype,"fallback",2);s([o.property({type:String})],exports.QxsIcon.prototype,"loading",2);s([o.state()],exports.QxsIcon.prototype,"_imageLoading",2);s([o.state()],exports.QxsIcon.prototype,"_imageError",2);exports.QxsIcon=s([p.safeCustomElement("qxs-icon")],exports.QxsIcon);
+//# sourceMappingURL=icon.cjs.map

package/lib/icon.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"icon.cjs","sources":["../../../packages/components/src/icon.ts"],"sourcesContent":["import { LitElement, html, nothing } from 'lit'\nimport { property, state } from 'lit/decorators.js'\nimport { styleMap } from 'lit/directives/style-map.js'\nimport { safeCustomElement } from './base/define'\n\ntype IconOutputType = 'iconify' | 'unocss' | 'css' | 'img' | 'svg' | 'empty'\n\n@safeCustomElement('qxs-icon')\nexport class QxsIcon extends LitElement {\n  @property({ attribute: false }) icon = ''\n  @property({ type: String }) flip: 'horizontal' | 'vertical' | 'both' | '' = ''\n  @property({ type: Number }) rotate = 0\n  @property({ type: String }) color = ''\n  @property({ attribute: false }) size: string | number | undefined\n  @property({ type: String, attribute: 'local-icon-prefix' }) localIconPrefix = 'icon-'\n  @property({ type: String }) fallback = ''\n  @property({ type: String }) loading = ''\n\n  @state() private _imageLoading = false\n  @state() private _imageError = false\n\n  createRenderRoot() {\n    return this\n  }\n\n  connectedCallback() {\n    super.connectedCallback()\n    this._resetImageState()\n  }\n\n  protected willUpdate(changed: Map<string, unknown>) {\n    if (changed.has('icon') || (changed.has('color') && this._outputType() === 'iconify')) {\n      this._resetImageState()\n    }\n  }\n\n  private _outputType(): IconOutputType {\n    if (typeof this.icon !== 'string') {\n      return 'empty'\n    }\n\n    const icon = this.icon.trim()\n    if (!icon) {\n      return 'empty'\n    }\n\n    const hasPathFeatures = (value: string) => /^\\.{1,2}\\//.test(value) || value.startsWith('/') || value.includes('/')\n    if (/^https?:\\/\\//.test(icon) || hasPathFeatures(icon)) {\n      return 'img'\n    }\n\n    if (/^i-[^:]+:[^:]+/.test(icon)) {\n      return 'unocss'\n    }\n\n    if (icon.startsWith('i-') && !icon.includes(':')) {\n      return 'css'\n    }\n\n    if (icon.includes(':') && !icon.startsWith('i-')) {\n      return 'iconify'\n    }\n\n    if (/^[\\w-]+$/.test(icon) && !icon.startsWith('i-')) {\n      return 'svg'\n    }\n\n    return 'css'\n  }\n\n  private _iconName() {\n    return typeof this.icon === 'string' ? this.icon.trim() : ''\n  }\n\n  private _resetImageState() {\n    const type = this._outputType()\n    if (type === 'img' || type === 'iconify') {\n      this._imageLoading = true\n      this._imageError = false\n      return\n    }\n\n    this._imageLoading = false\n    this._imageError = false\n  }\n\n  private _formatSize(size: string | number | undefined) {\n    if (size == null || size === '') {\n      return ''\n    }\n\n    if (typeof size === 'number') {\n      return `${size}px`\n    }\n\n    if (/^\\d+(?:\\.\\d+)?$/.test(size)) {\n      return `${size}px`\n    }\n\n    return size\n  }\n\n  private _transformStyle() {\n    const transforms: string[] = []\n\n    switch (this.flip) {\n      case 'horizontal':\n        transforms.push('rotateY(180deg)')\n        break\n      case 'vertical':\n        transforms.push('rotateX(180deg)')\n        break\n      case 'both':\n        transforms.push('rotateX(180deg)', 'rotateY(180deg)')\n        break\n    }\n\n    if (this.rotate) {\n      transforms.push(`rotate(${this.rotate % 360}deg)`)\n    }\n\n    return transforms.join(' ')\n  }\n\n  private _containerStyle() {\n    const formattedSize = this._formatSize(this.size) || '1em'\n    const transform = this._transformStyle()\n\n    return {\n      position: 'relative',\n      display: 'inline-flex',\n      alignItems: 'center',\n      justifyContent: 'center',\n      width: formattedSize,\n      height: formattedSize,\n      fontSize: formattedSize,\n      lineHeight: '1',\n      color: this.color || 'currentColor',\n      verticalAlign: '-2px',\n      transform: transform || undefined,\n      transformOrigin: 'center',\n      fill: 'currentColor',\n    }\n  }\n\n  private _glyphStyle() {\n    return {\n      display: 'inline-flex',\n      alignItems: 'center',\n      justifyContent: 'center',\n      width: '100%',\n      height: '100%',\n      lineHeight: '1',\n      color: 'inherit',\n      fontSize: 'inherit',\n      flexShrink: '0',\n    }\n  }\n\n  private _imageStyle(visible = true) {\n    return {\n      display: visible ? 'block' : 'none',\n      width: '100%',\n      height: '100%',\n      objectFit: 'contain',\n      flexShrink: '0',\n    }\n  }\n\n  private _imageSource() {\n    if (this._outputType() === 'iconify') {\n      const url = new URL(`https://api.iconify.design/${this._iconName()}.svg`)\n      if (this.color) {\n        url.searchParams.set('color', this.color)\n      }\n      return url.toString()\n    }\n    return this._iconName()\n  }\n\n  private _renderClassGlyph(iconClass: string) {\n    const classes = iconClass.split(/\\s+/).filter(Boolean).join(' ')\n    if (!classes) {\n      return nothing\n    }\n\n    return html`<i class=${classes} style=${styleMap(this._glyphStyle())} aria-hidden=\"true\"></i>`\n  }\n\n  private _renderSvgSprite() {\n    const iconName = this._iconName()\n    if (!iconName) {\n      return nothing\n    }\n\n    return html`\n      <svg\n        aria-hidden=\"true\"\n        viewBox=\"0 0 1024 1024\"\n        style=${styleMap({\n          display: 'block',\n          width: '100%',\n          height: '100%',\n          fill: 'currentColor',\n          flexShrink: '0',\n        })}\n      >\n        <use href=${`#${this.localIconPrefix}${iconName}`}></use>\n      </svg>\n    `\n  }\n\n  private _renderImage() {\n    const source = this._imageSource()\n    if (!source) {\n      return nothing\n    }\n\n    const showFallback = this._imageError && !!this.fallback\n    const showLoading = !this._imageError && this._imageLoading && !!this.loading\n    const showImage = !this._imageError && !showLoading\n\n    return html`\n      ${showLoading ? this._renderClassGlyph(this.loading) : nothing}\n      ${showFallback ? this._renderClassGlyph(this.fallback) : nothing}\n      <img\n        src=${source}\n        alt=\"\"\n        style=${styleMap(this._imageStyle(showImage))}\n        @load=${() => {\n          this._imageLoading = false\n          this._imageError = false\n        }}\n        @error=${() => {\n          this._imageLoading = false\n          this._imageError = true\n        }}\n      />\n    `\n  }\n\n  render() {\n    const type = this._outputType()\n    if (type === 'empty') {\n      return nothing\n    }\n\n    let content: ReturnType<typeof html> | typeof nothing = nothing\n\n    switch (type) {\n      case 'iconify':\n      case 'img':\n        content = this._renderImage()\n        break\n      case 'unocss':\n      case 'css':\n        content = this._renderClassGlyph(this._iconName())\n        break\n      case 'svg':\n        content = this._renderSvgSprite()\n        break\n      default:\n        content = nothing\n    }\n\n    return html`<span class=\"qxs-icon-wc\" style=${styleMap(this._containerStyle())}>${content}</span>`\n  }\n}\n\nexport function register() {\n  // auto-registered via @safeCustomElement\n}\n"],"names":["QxsIcon","LitElement","changed","icon","hasPathFeatures","value","type","size","transforms","formattedSize","transform","visible","url","iconClass","classes","html","styleMap","nothing","iconName","source","showFallback","showLoading","showImage","content","__decorateClass","property","state","safeCustomElement"],"mappings":"8YAQaA,QAAAA,QAAN,cAAsBC,EAAAA,UAAW,CAAjC,aAAA,CAAA,MAAA,GAAA,SAAA,EAC2B,KAAA,KAAO,GACX,KAAA,KAAgD,GAChD,KAAA,OAAS,EACT,KAAA,MAAQ,GAEwB,KAAA,gBAAkB,QAClD,KAAA,SAAW,GACX,KAAA,QAAU,GAE7B,KAAQ,cAAgB,GACxB,KAAQ,YAAc,EAAA,CAE/B,kBAAmB,CACjB,OAAO,IACT,CAEA,mBAAoB,CAClB,MAAM,kBAAA,EACN,KAAK,iBAAA,CACP,CAEU,WAAWC,EAA+B,EAC9CA,EAAQ,IAAI,MAAM,GAAMA,EAAQ,IAAI,OAAO,GAAK,KAAK,YAAA,IAAkB,YACzE,KAAK,iBAAA,CAET,CAEQ,aAA8B,CACpC,GAAI,OAAO,KAAK,MAAS,SACvB,MAAO,QAGT,MAAMC,EAAO,KAAK,KAAK,KAAA,EACvB,GAAI,CAACA,EACH,MAAO,QAGT,MAAMC,EAAmBC,GAAkB,aAAa,KAAKA,CAAK,GAAKA,EAAM,WAAW,GAAG,GAAKA,EAAM,SAAS,GAAG,EAClH,MAAI,eAAe,KAAKF,CAAI,GAAKC,EAAgBD,CAAI,EAC5C,MAGL,iBAAiB,KAAKA,CAAI,EACrB,SAGLA,EAAK,WAAW,IAAI,GAAK,CAACA,EAAK,SAAS,GAAG,EACtC,MAGLA,EAAK,SAAS,GAAG,GAAK,CAACA,EAAK,WAAW,IAAI,EACtC,UAGL,WAAW,KAAKA,CAAI,GAAK,CAACA,EAAK,WAAW,IAAI,EACzC,MAGF,KACT,CAEQ,WAAY,CAClB,OAAO,OAAO,KAAK,MAAS,SAAW,KAAK,KAAK,OAAS,EAC5D,CAEQ,kBAAmB,CACzB,MAAMG,EAAO,KAAK,YAAA,EAClB,GAAIA,IAAS,OAASA,IAAS,UAAW,CACxC,KAAK,cAAgB,GACrB,KAAK,YAAc,GACnB,MACF,CAEA,KAAK,cAAgB,GACrB,KAAK,YAAc,EACrB,CAEQ,YAAYC,EAAmC,CACrD,OAAIA,GAAQ,MAAQA,IAAS,GACpB,GAGL,OAAOA,GAAS,SACX,GAAGA,CAAI,KAGZ,kBAAkB,KAAKA,CAAI,EACtB,GAAGA,CAAI,KAGTA,CACT,CAEQ,iBAAkB,CACxB,MAAMC,EAAuB,CAAA,EAE7B,OAAQ,KAAK,KAAA,CACX,IAAK,aACHA,EAAW,KAAK,iBAAiB,EACjC,MACF,IAAK,WACHA,EAAW,KAAK,iBAAiB,EACjC,MACF,IAAK,OACHA,EAAW,KAAK,kBAAmB,iBAAiB,EACpD,KAAA,CAGJ,OAAI,KAAK,QACPA,EAAW,KAAK,UAAU,KAAK,OAAS,GAAG,MAAM,EAG5CA,EAAW,KAAK,GAAG,CAC5B,CAEQ,iBAAkB,CACxB,MAAMC,EAAgB,KAAK,YAAY,KAAK,IAAI,GAAK,MAC/CC,EAAY,KAAK,gBAAA,EAEvB,MAAO,CACL,SAAU,WACV,QAAS,cACT,WAAY,SACZ,eAAgB,SAChB,MAAOD,EACP,OAAQA,EACR,SAAUA,EACV,WAAY,IACZ,MAAO,KAAK,OAAS,eACrB,cAAe,OACf,UAAWC,GAAa,OACxB,gBAAiB,SACjB,KAAM,cAAA,CAEV,CAEQ,aAAc,CACpB,MAAO,CACL,QAAS,cACT,WAAY,SACZ,eAAgB,SAChB,MAAO,OACP,OAAQ,OACR,WAAY,IACZ,MAAO,UACP,SAAU,UACV,WAAY,GAAA,CAEhB,CAEQ,YAAYC,EAAU,GAAM,CAClC,MAAO,CACL,QAASA,EAAU,QAAU,OAC7B,MAAO,OACP,OAAQ,OACR,UAAW,UACX,WAAY,GAAA,CAEhB,CAEQ,cAAe,CACrB,GAAI,KAAK,YAAA,IAAkB,UAAW,CACpC,MAAMC,EAAM,IAAI,IAAI,8BAA8B,KAAK,UAAA,CAAW,MAAM,EACxE,OAAI,KAAK,OACPA,EAAI,aAAa,IAAI,QAAS,KAAK,KAAK,EAEnCA,EAAI,SAAA,CACb,CACA,OAAO,KAAK,UAAA,CACd,CAEQ,kBAAkBC,EAAmB,CAC3C,MAAMC,EAAUD,EAAU,MAAM,KAAK,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG,EAC/D,OAAKC,EAIEC,EAAAA,gBAAgBD,CAAO,UAAUE,EAAAA,SAAS,KAAK,aAAa,CAAC,2BAH3DC,EAAAA,OAIX,CAEQ,kBAAmB,CACzB,MAAMC,EAAW,KAAK,UAAA,EACtB,OAAKA,EAIEH,EAAAA;AAAAA;AAAAA;AAAAA;AAAAA,gBAIKC,WAAS,CACf,QAAS,QACT,MAAO,OACP,OAAQ,OACR,KAAM,eACN,WAAY,GAAA,CACb,CAAC;AAAA;AAAA,oBAEU,IAAI,KAAK,eAAe,GAAGE,CAAQ,EAAE;AAAA;AAAA,MAf5CD,EAAAA,OAkBX,CAEQ,cAAe,CACrB,MAAME,EAAS,KAAK,aAAA,EACpB,GAAI,CAACA,EACH,OAAOF,EAAAA,QAGT,MAAMG,EAAe,KAAK,aAAe,CAAC,CAAC,KAAK,SAC1CC,EAAc,CAAC,KAAK,aAAe,KAAK,eAAiB,CAAC,CAAC,KAAK,QAChEC,EAAY,CAAC,KAAK,aAAe,CAACD,EAExC,OAAON,EAAAA;AAAAA,QACHM,EAAc,KAAK,kBAAkB,KAAK,OAAO,EAAIJ,EAAAA,OAAO;AAAA,QAC5DG,EAAe,KAAK,kBAAkB,KAAK,QAAQ,EAAIH,EAAAA,OAAO;AAAA;AAAA,cAExDE,CAAM;AAAA;AAAA,gBAEJH,WAAS,KAAK,YAAYM,CAAS,CAAC,CAAC;AAAA,gBACrC,IAAM,CACZ,KAAK,cAAgB,GACrB,KAAK,YAAc,EACrB,CAAC;AAAA,iBACQ,IAAM,CACb,KAAK,cAAgB,GACrB,KAAK,YAAc,EACrB,CAAC;AAAA;AAAA,KAGP,CAEA,QAAS,CACP,MAAMhB,EAAO,KAAK,YAAA,EAClB,GAAIA,IAAS,QACX,OAAOW,EAAAA,QAGT,IAAIM,EAAoDN,EAAAA,QAExD,OAAQX,EAAA,CACN,IAAK,UACL,IAAK,MACHiB,EAAU,KAAK,aAAA,EACf,MACF,IAAK,SACL,IAAK,MACHA,EAAU,KAAK,kBAAkB,KAAK,UAAA,CAAW,EACjD,MACF,IAAK,MACHA,EAAU,KAAK,iBAAA,EACf,MACF,QACEA,EAAUN,EAAAA,OAAA,CAGd,OAAOF,EAAAA,uCAAuCC,EAAAA,SAAS,KAAK,iBAAiB,CAAC,IAAIO,CAAO,SAC3F,CACF,EAlQkCC,EAAA,CAA/BC,WAAS,CAAE,UAAW,EAAA,CAAO,CAAA,EADnBzB,gBACqB,UAAA,OAAA,CAAA,EACJwB,EAAA,CAA3BC,WAAS,CAAE,KAAM,MAAA,CAAQ,CAAA,EAFfzB,gBAEiB,UAAA,OAAA,CAAA,EACAwB,EAAA,CAA3BC,WAAS,CAAE,KAAM,MAAA,CAAQ,CAAA,EAHfzB,gBAGiB,UAAA,SAAA,CAAA,EACAwB,EAAA,CAA3BC,WAAS,CAAE,KAAM,MAAA,CAAQ,CAAA,EAJfzB,gBAIiB,UAAA,QAAA,CAAA,EACIwB,EAAA,CAA/BC,WAAS,CAAE,UAAW,EAAA,CAAO,CAAA,EALnBzB,gBAKqB,UAAA,OAAA,CAAA,EAC4BwB,EAAA,CAA3DC,EAAAA,SAAS,CAAE,KAAM,OAAQ,UAAW,oBAAqB,CAAA,EAN/CzB,gBAMiD,UAAA,kBAAA,CAAA,EAChCwB,EAAA,CAA3BC,WAAS,CAAE,KAAM,MAAA,CAAQ,CAAA,EAPfzB,gBAOiB,UAAA,WAAA,CAAA,EACAwB,EAAA,CAA3BC,WAAS,CAAE,KAAM,MAAA,CAAQ,CAAA,EARfzB,gBAQiB,UAAA,UAAA,CAAA,EAEXwB,EAAA,CAAhBE,EAAAA,MAAA,CAAM,EAVI1B,gBAUM,UAAA,gBAAA,CAAA,EACAwB,EAAA,CAAhBE,EAAAA,MAAA,CAAM,EAXI1B,gBAWM,UAAA,cAAA,CAAA,EAXNA,QAAAA,QAANwB,EAAA,CADNG,EAAAA,kBAAkB,UAAU,CAAA,EAChB3B,eAAA"}