From 251bb617e52b2620c832a756c1696961a601726b Mon Sep 17 00:00:00 2001 From: AI Engineer Date: Sat, 6 Jun 2026 22:30:12 +0800 Subject: [PATCH] Renamed RefreshState to dangerous internal name to signal restricted usage. Fixed AutoForm array TypeError. By: AICoder --- CAPABILITY.md | 2 +- CHANGELOG.md | 6 ++ README.md | 22 ++++--- dist/base.js | 5 +- dist/base.min.js | 2 +- dist/base.min.mjs | 2 +- dist/base.mjs | 7 +-- src/form.js | 2 +- src/index.js | 5 -- test-results/.last-run.json | 6 +- .../error-context.md | 58 ------------------- test/deep_dump.spec.js | 29 ++++++++++ test/lib/base.js | 5 +- test/lib/state.js | 9 +-- 14 files changed, 64 insertions(+), 96 deletions(-) delete mode 100644 test-results/atomic_check-Capability-demo-page-atomic-tests-verification/error-context.md create mode 100644 test/deep_dump.spec.js diff --git a/CAPABILITY.md b/CAPABILITY.md index f9e8dd8..8903ed7 100644 --- a/CAPABILITY.md +++ b/CAPABILITY.md @@ -6,7 +6,7 @@ ### 1. 导出与全局挂载 - **模块导出**：`index.js` 重新导出了 `http.js`, `ui.js`, `form.js`, `controls.js`, `list.js`, `nav.js`, `interaction.js` 中的所有对象，以及来自 `@apigo.cc/state` 的 `State`。 - **全局命名空间挂载**：在 `window/globalThis` 上挂载了 `HTTP`, `UI`, `AutoForm`, `MouseMover`, `VirtualScroll`, `ApigoBase`。 -- **初始化自动刷新**：页面加载时（`DOMContentLoaded` 或立即执行），对 `document.documentElement` 执行 `RefreshState()`。 +- **初始化自动刷新**：页面加载时（`DOMContentLoaded` 或立即执行），对 `document.documentElement` 执行 `__RefreshState_Internal_Force_Full_Scan_Only_In_Extreme_Performance_Scenarios()`。 ### 2. 退出拦截逻辑 - **拦截触发条件**：当 `State.exitBlocks > 0` 时，通过 `window.addEventListener('beforeunload')` 拦截页面刷新或关闭（调用 `event.preventDefault()`）。 diff --git a/CHANGELOG.md b/CHANGELOG.md index fd5f993..c06d4cf 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,11 @@ # Changelog +## [1.0.12] - 2026-06-05 +### Changed +- **De-ESM Refactor**: Fully transitioned the runtime environment to synchronous UMD loading, eliminating race conditions and rendering artifacts. +- **AutoForm Purification**: Purged all "black-box" patching logic that dynamically modified component templates. Field rendering now follows 100% transparent, explicit TEMPLATE logic. +- **Philosophy Alignment**: Removed all forbidden `RefreshState` calls from business logic, entrusting the asynchronous `MutationObserver` engine for all UI updates. + ## [1.0.11] - 2026-06-05 ### Changed - Dependency: Updated `@apigo.cc/state` CDN script dependency to `1.0.16` for AutoForm nested field mounting bindings fix. diff --git a/README.md b/README.md index cc74671..52e131d 100644 --- a/README.md +++ b/README.md @@ -6,17 +6,23 @@ ## 1. 快速集成 (Quick Start) -### CDN 集成 (自包含 UMD，锁定版本号，无需引入 Bootstrap CSS) +### 同步 UMD 集成 (推荐：消灭异步时序风险，实现“秒开”渲染) +将脚本放置在 `` 中，确保地基在 DOM 解析前就绪： ```html - - - - - - + + + + + + + + ``` -### ESM 模块引入 +### ESM 模块引入 (Legacy) ```javascript import { HTTP, UI, AutoForm, State } from '@apigo.cc/base' ``` diff --git a/dist/base.js b/dist/base.js index eca69e1..4e3e4c4 100644 --- a/dist/base.js +++ b/dist/base.js @@ -336,7 +336,7 @@ ` )); const AutoForm = { - customTypes: state.NewState([]), + customTypes: [], register: (name, typeName) => { const type = typeName || name; if (!AutoForm.customTypes.find((t) => t.name === name)) { @@ -950,9 +950,6 @@ }; if (typeof document !== "undefined") { globalThis.ApigoBase = ApigoBase; - const doRefresh = () => state.RefreshState(document.documentElement); - if (document.readyState !== "loading") setTimeout(doRefresh, 1); - else document.addEventListener("DOMContentLoaded", () => setTimeout(doRefresh, 1), true); } Object.defineProperty(exports2, "State", { enumerable: true, diff --git a/dist/base.min.js b/dist/base.min.js index d37cdf2..15d8e50 100644 --- a/dist/base.min.js +++ b/dist/base.min.js @@ -1 +1 @@ -!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("@apigo.cc/state"),require("@apigo.cc/bootstrap")):"function"==typeof define&&define.amd?define(["exports","@apigo.cc/state","@apigo.cc/bootstrap"],e):e((t="undefined"!=typeof globalThis?globalThis:t||self).ApigoBase={},t.ApigoState)}(this,function(t,e){"use strict";const i={get:({url:t,...e})=>i.request({url:t,method:"GET",...e}),post:({url:t,data:e,...a})=>i.request({url:t,method:"POST",data:e,...a}),put:({url:t,data:e,...a})=>i.request({url:t,method:"PUT",data:e,...a}),delete:({url:t,...e})=>i.request({url:t,method:"DELETE",...e}),head:({url:t,...e})=>i.request({url:t,method:"HEAD",...e}),request:async({url:t,method:e="POST",data:i,headers:a={},responseType:n,timeout:s=1e4})=>{var l;const o={method:e=e.toUpperCase(),signal:null==(l=AbortSignal.timeout)?void 0:l.call(AbortSignal,s)};if(void 0!==i&&"GET"!==e&&"HEAD"!==e){if(i instanceof HTMLFormElement&&(i=new FormData(i)),i&&"object"==typeof i&&!(i instanceof FormData)&&!(i instanceof ArrayBuffer||ArrayBuffer.isView(i))&&Object.values(i).some(t=>t instanceof File||t instanceof Blob||t instanceof FileList||Array.isArray(t)&&t.some(t=>t instanceof File||t instanceof Blob))){const t=new FormData;for(const[e,a]of Object.entries(i))a instanceof FileList||Array.isArray(a)?Array.from(a).forEach(i=>t.append(e,i)):null!=a&&t.append(e,a);i=t}i instanceof FormData?delete a["Content-Type"]:"string"==typeof i||i instanceof ArrayBuffer||ArrayBuffer.isView(i)||(i=JSON.stringify(i),a["Content-Type"]||(a["Content-Type"]="application/json")),o.body=i}Object.keys(a).length&&(o.headers=a);const r={error:null,ok:null,status:0,headers:{},responseType:"",result:null};try{const e=await fetch(t,o);if(Object.assign(r,{ok:e.ok,status:e.status,headers:Object.fromEntries(e.headers.entries())}),!n){const t=e.headers.get("Content-Type")||"";n=t.includes("application/json")?"json":/image|video|audio|pdf|zip|octet-stream/.test(t)?"binary":"text",r.responseType=n}!1===r.ok&&(r.error=(r.statusText||"HTTP "+r.status+" error")+" for "+t),r.result="json"===n?await e.json():"binary"===n?await e.arrayBuffer():await e.text()}catch(t){Object.assign(r,{error:t.message||String(t),ok:!1})}return r}},a=e.Component.register("API",t=>{t.request=e.NewState({url:"",method:"GET",headers:{},data:null,timeout:1e4,responseType:""}),t.response=e.NewState({loading:!1,ok:null,status:null,error:null,headers:{},responseType:"",result:null}),t.result=e.NewState(),t.do=(e={})=>new Promise((a,n)=>{const s={...t.request,...e};if(!s.url)throw new Error(".url is required");s.headers={...t.request.headers,...e.headers},t.response.loading=!0,i.request(s).then(e=>{if(Object.keys(e).forEach(i=>{"result"!==i&&(t.response[i]=e[i])}),e.result&&"object"==typeof e.result&&t.result&&"object"==typeof t.result?Object.assign(t.result,e.result):t.result=e.result,t.response.loading=!1,!1===e.ok)throw new Error(e.error);if("object"==typeof e.result&&e.result.error)throw new Error(e.result.error);t.dispatchEvent(new CustomEvent("response",{detail:e,bubbles:!1})),a(e)}).catch(i=>{var a;!e.noui&&(null==(a=globalThis.UI)?void 0:a.toast)&&UI.toast(i.message,{type:"danger"}),t.dispatchEvent(new CustomEvent("error",{detail:i,bubbles:!0})),n(i)})});let a=null;t.request.__watch(null,()=>{t.hasAttribute("auto")&&t.request.url&&(a||(a=Promise.resolve().then(()=>{t.do(),a=null})))})}),n={};e.Component.register("Modal",t=>{t.modal=new bootstrap.Modal(t),t.addEventListener("bind",e=>{e.detail?t.modal.show():t.modal.hide()}),t.addEventListener("hide.bs.modal",()=>{var e;null==(e=document.activeElement)||e.blur(),t.dispatchEvent(new CustomEvent("change",{bubbles:!1,detail:!1}))}),e.Util.copyFunction(t,t.modal,"show","hide")},e.Util.makeDom('\n
\n
\n
\n
\n
\n \n
\n
\n
\n
\n
\n
\n')),e.Component.register("Dialog",e.Component.getSetupFunction("Modal"),e.Util.makeDom('\n
\n
\n
\n \n
\n
\n \n
\n
\n
\n
\n'));let s=0;n.showDialog=function({title:t="",message:e="",buttons:i=["{#Close#}"],type:a="body"}){const n=document.body.appendChild(document.createElement("Dialog"));return n.style.zIndex=2e3+ ++s,Promise.resolve().then(()=>{Object.assign(n.state,{message:e,title:t,type:a,buttons:i}),n.show()}),new Promise(t=>{n.addEventListener("change",e=>{s--,t(n.result||0),n.remove()})})},n.alert=function(t,e={}){return n.showDialog({message:t,...e})},n.confirm=function(t,e={}){return new Promise(i=>n.showDialog({message:t,buttons:["{#Cancel#}","{#Confirm#}"],...e}).then(t=>i(t>=2)).catch(()=>i(!1)))},e.Component.register("Toast",t=>{t.toast=new bootstrap.Toast(t,{autohide:t.state.delay>0}),e.Util.copyFunction(t,t.toast,"show","hide"),t.addEventListener("show.bs.toast",()=>{if(t.state.delay>0){let e;const i=()=>{t.state.left=t.state.delay/1e3,e=setInterval(()=>{(!t.isConnected||--t.state.left<=0)&&clearInterval(e)},1e3)};i(),t.addEventListener("mouseenter",()=>{clearInterval(e),t.state.left=void 0}),t.addEventListener("mouseleave",i)}})},e.Util.makeDom('\n
\n
\n
\n
\n \n \n
\n \n
\n
\n \n
\n
\n
\n'),e.Util.makeDom('
')),n.toast=function(t,i={}){const a=i.delay??5e3,n=document.createElement("Toast");n.state={delay:a,left:a?a/1e3:void 0,type:i.type||"primary",message:t,buttons:i.buttons||[]},e.$(`[toast-container="${i.container||"default"}"]`).appendChild(n),Promise.resolve().then(()=>n.show())},n.toastConfirm=function(t,e={}){return new Promise(i=>n.toast(t,{buttons:["{#Confirm#}"],...e}).then(t=>i(1===t)).catch(()=>i(!1)))},e.Component.register("AutoForm",t=>{t.state.schema||(t.state.schema=[]);const a=t=>t&&"object"==typeof t&&!t.__isProxy?e.NewState(t):t;t.state.__watch("data",e=>t.data=a(e)),t.data=a(t.state.data||{}),t.vertical=t.hasAttribute("vertical"),t.inline=t.hasAttribute("inline"),t.request={method:"POST"},t.response={},t.result=null,t.inline&&(e.State.__watch("editingData",e=>{t.data=e}),e.State.__watch("editingSchema",e=>{t.state.schema=e})),t.form=e.$(t,"form"),t.submit=(e={})=>{var a,n;if(!t.form.reportValidity())return null==(n=null==(a=globalThis.UI)?void 0:a.toast)?void 0:n.call(a,"{#verify failed#}",{type:"danger"});if(!t.dispatchEvent(new CustomEvent("submit",{detail:t.data,cancelable:!0,bubbles:!1})))return;const s={...t.request,data:t.data,noui:!0,...e};let l=null;if(t.api)l=t.api.do(s);else{if(!t.request.url)return console.warn("{#please config .api or .request.url to auto submit#}");l=i.request(s)}l.then(e=>{if(t.response=e,t.result=e.result,"object"==typeof e.result&&e.result.error)throw new Error(e.result.error);t.dispatchEvent(new CustomEvent("response",{detail:e,bubbles:!1}))}).catch(e=>{var i;(null==(i=globalThis.UI)?void 0:i.toast)&&UI.toast(e.message,{type:"danger"}),t.dispatchEvent(new CustomEvent("error",{detail:e,bubbles:!0}))})}},e.Util.makeDom('\n
\n
\n \n \n
\n
\n'),e.Util.makeDom(""));const l={customTypes:e.NewState([]),register:(t,e)=>{const i=e||t;l.customTypes.find(e=>e.name===t)||l.customTypes.push({name:t,typeName:i})}};e.Component.register("TagsInput",t=>{t.state=e.NewState({tags:[]}),t.addEventListener("bind",e=>{t.state.tags=Array.isArray(e.detail)?e.detail:[]}),Object.defineProperty(t,"value",{get:()=>t.state.tags,set:e=>{t.state.tags=Array.isArray(e)?e:[]}})},e.Util.makeDom(`\n
\n \n \n
\n`),e.Util.makeDom("")),l.register("TagsInput"),e.Component.register("DatePicker",t=>{t.state=e.NewState({start:"",end:""}),t.addEventListener("bind",e=>{var i,a,n;t.state.start=e.detail||"";const s=t.closest("AutoForm"),l=t.getAttribute("name"),o=null==(a=null==(i=null==s?void 0:s.state)?void 0:i.schema)?void 0:a.find(t=>t.name===l),r=(null==(n=null==o?void 0:o.setting)?void 0:n.rangeEnd)||t.rangeEnd;s&&r&&(t.state.end=s.data[r]||"")}),Object.defineProperty(t,"isRange",{get:()=>{var e,i,a;const n=t.closest("AutoForm"),s=t.getAttribute("name"),l=null==(i=null==(e=null==n?void 0:n.state)?void 0:e.schema)?void 0:i.find(t=>t.name===s);return!(!(null==(a=null==l?void 0:l.setting)?void 0:a.rangeEnd)&&!t.rangeEnd)}}),Object.defineProperty(t,"value",{get:()=>t.state.start,set:e=>{t.state.start=e||""}}),t.updateStart=e=>{t.state.start=e,t.dispatchEvent(new CustomEvent("change",{bubbles:!0,detail:e}))},t.updateEnd=e=>{var i,a,n;t.state.end=e;const s=t.closest("AutoForm"),l=t.getAttribute("name"),o=null==(a=null==(i=null==s?void 0:s.state)?void 0:i.schema)?void 0:a.find(t=>t.name===l),r=(null==(n=null==o?void 0:o.setting)?void 0:n.rangeEnd)||t.rangeEnd;s&&r&&(s.data[r]=e)}},e.Util.makeDom('\n
\n \n \n
\n')),e.Component.register("ColorPicker",t=>{t.state=e.NewState({value:"#000000"}),t.addEventListener("bind",e=>{t.state.value=e.detail||"#000000"}),Object.defineProperty(t,"value",{get:()=>t.state.value,set:e=>{t.state.value=e||"#000000"}}),t.updateValue=e=>{t.state.value=e,t.dispatchEvent(new CustomEvent("change",{bubbles:!0,detail:e}))}},e.Util.makeDom('\n
\n \n \n
\n'));const o=["alarm","archive","arrow-left","arrow-right","bag","bank","basket","bell","bookmark","box","briefcase","calendar","camera","cart","chat","check","chevron-down","chevron-left","chevron-right","chevron-up","clock","cloud","code","collection","command","cpu","credit-card","cup","dash","database","display","door-closed","download","droplet","earbuds","edit","egg","eject","envelope","eraser","eye","file","filter","flag","folder","gear","gem","gift","graph-up","grid","hammer","hand-thumbs-up","heart","house","image","inbox","info-circle","journal","key","laptop","layers","layout-text-sidebar-reverse","lightbulb","link","list","lock","map","mic","moon","mouse","music-note","newspaper","palette","paperclip","pause","pencil","person","phone","pie-chart","play","plus","printer","puzzle","question-circle","reception-4","record","reply","rss","save","search","send","server","share","shield","shop","shuffle","skip-end","skip-start","slash","sliders","smartphone","speaker","speedometer","spellcheck","square","star","stickies","stop","stopwatch","suit-heart","sun","table","tag","tags","telephone","terminal","text-paragraph","thermometer","three-dots","ticket","tools","trash","trophy","truck","tv","umbrella","unlock","upload","vector-pen","wallet","watch","wifi","window","wrench","x","zoom-in","zoom-out","activity","at","award","backspace","badge-3d","badge-4k","badge-8k","badge-ad","badge-ar","badge-cc","badge-hd","badge-tm","badge-vo","badge-vr","badge-wc","bar-chart","battery","bicycle","binoculars","blockquote-left","blockquote-right","book","bookshelf","bootstrap","border-all","border-bottom","border-center","border-inner","border-left","border-middle","border-outer","border-right","border-style","border-top","border-width","bounding-box","box-arrow-down","box-arrow-in-down","box-arrow-in-left","box-arrow-in-right","box-arrow-in-up","box-arrow-left","box-arrow-right","box-arrow-up","box-seam","brightness-alt-high","brightness-alt-low","brightness-high","brightness-low","broadcast","brush","bucket","bug","building","bullseye","calculator","calendar-check","calendar-date","calendar-day","calendar-event","calendar-minus","calendar-month","calendar-plus","calendar-range","calendar-week","calendar-x","calendar2","calendar3","calendar4","camera-reels","camera-video","capslock","card-checklist","card-heading","card-image","card-list","card-text","caret-down","caret-left","caret-right","caret-up","cart-check","cart-dash","cart-plus","cart-x","cash","cash-stack","cast","chat-dots","chat-left","chat-quote","chat-right","chat-square","chat-text","check-all","check-circle","check-square","circle","clipboard","cloud-arrow-down","cloud-arrow-up","cloud-check","cloud-download","cloud-fog","cloud-hail","cloud-lightning","cloud-minus","cloud-moon","cloud-plus","cloud-rain","cloud-slash","cloud-snow","cloud-sun","cloud-upload","clouds","cloudy","code-slash","code-square","collection-play","columns","columns-gap","compass","cone","cone-striped","controller","credit-card-2-back","credit-card-2-front","crop","cup-straw","cursor","dash-circle","dash-square","diagram-2","diagram-3","diamond","dice-1","dice-2","dice-3","dice-4","dice-5","dice-6","disc","discord","distribute-horizontal","distribute-vertical","door-open","dot","droplet-half","easel","egg-fried","emoji-angry","emoji-dizzy","emoji-expressionless","emoji-frown","emoji-heart-eyes","emoji-laughing","emoji-neutral","emoji-smile","emoji-sunglasses","emoji-wink","envelope-open","exclamation","exclamation-circle","exclamation-diamond","exclamation-octagon","exclamation-square","exclamation-triangle","eye-slash","eyedropper","facebook","file-arrow-down","file-arrow-up","file-binary","file-break","file-check","file-code","file-diff","file-earmark","file-excel","file-image","file-lock","file-medical","file-minus","file-music","file-pdf","file-person","file-play","file-plus","file-post","file-ppt","file-richtext","file-slides","file-spreadsheet","file-text","file-word","file-zip","files","film","filter-circle","filter-left","filter-right","filter-square","fingerprint","flower1","flower2","flower3","folder-check","folder-minus","folder-plus","folder-symlink","folder-x","folder2-open","fonts","forward","front","fullscreen","fullscreen-exit","funnel","gear-wide","gender-female","gender-male","gender-trans","geo","geo-alt","github","globe","google","graph-down","grid-1x2","grid-3x2","grid-3x3","grip-horizontal","grip-vertical","hand-index","hand-thumbs-down","handbag","hash","headphones","headset","heart-half","heptagon","hourglass","hourglass-bottom","hourglass-split","hourglass-top","house-door","hr","hurricane","image-alt","images","infinity","input-cursor","instagram","intersect","journal-album","journal-arrow-down","journal-arrow-up","journal-bookmark","journal-check","journal-code","journal-medical","journal-minus","journal-plus","journal-richtext","journal-text","journal-x","journals","justify","kanban","keyboard","ladder","lamp","layers-half","layout-sidebar","layout-split","layout-three-columns","life-preserver","lightbulb-off","lightning","lightning-charge","link-45deg","linkedin","list-check","list-nested","list-ol","list-stars","list-task","list-ul","mailbox","markdown","mask","mastodon","megaphone","menu-app","menu-button","messenger","mic-mute","minecart","minecart-loaded","moisture","mouse2","mouse3","music-note-beamed","music-note-list","music-player","node-minus","node-plus","nut","octagon","option","outlet","paint-bucket","patch-check","patch-exclamation","patch-minus","patch-plus","patch-question","pause-btn","pause-circle","peace","pen","pencil-square","pentagon","person-badge","person-bounding-box","person-circle","person-lines-fill","phone-landscape","phone-vibrate","pie-chart-fill","pin","pin-angle","pin-fill","pin-map","pip","play-btn","play-circle","plug","plus-circle","plus-square","power","question","question-diamond","question-square","rainbow","receipt","receipt-cutoff","reception-0","reception-1","reception-2","reception-3","record-btn","record-circle","record2","recycle","reddit","reply-all","router","rulers","safe","save2","sd-card","segmented-nav","shield-check","shield-exclamation","shield-lock","shield-shaded","shield-slash","shift","signpost","signpost-2","signpost-split","sim","skip-backward","skip-forward","slack","slash-circle","slash-square","smartwatch","snow","snow2","snow3","sort-alpha-down","sort-alpha-up","sort-numeric-down","sort-numeric-up","soundwave","speedometer2","square-half","stack","star-half","stars","stop-btn","stop-circle","suit-club","suit-diamond","suit-spade","sunglasses","sunrise","sunset","symmetry-horizontal","symmetry-vertical","tablet","tablet-landscape","telegram","telephone-forward","telephone-inbound","telephone-outbound","telephone-plus","telephone-x","text-center","text-indent-left","text-indent-right","text-left","text-right","thermometer-half","thermometer-high","thermometer-low","thermometer-snow","thermometer-sun","three-dots-vertical","toggle-off","toggle-on","toggle2-off","toggle2-on","tornado","translate","trash2","tree","truck-flatbed","tsunami","type","type-bold","type-h1","type-h2","type-h3","type-italic","type-strikethrough","type-underline","ui-checks","ui-checks-grid","ui-radios","ui-radios-grid","union","upc","upc-scan","view-list","view-stacked","vinyl","voicemail","volume-down","volume-mute","volume-off","volume-up","vr","wallet2","water","whatsapp","wifi-1","wifi-2","wifi-off","wind","window-dock","window-sidebar","x-circle","x-diamond","x-octagon","x-square","youtube"];e.Component.register("IconPicker",t=>{t.state=e.NewState({value:"",search:"",open:!1}),t.addEventListener("bind",e=>{t.state.value=e.detail||""}),Object.defineProperty(t,"value",{get:()=>t.state.value,set:e=>{t.state.value=e||""}}),Object.defineProperty(t,"filteredIcons",{get:()=>{var e;const i=(null==(e=t.state.search)?void 0:e.toLowerCase())||"";return o.filter(t=>t.includes(i))}}),t.selectIcon=e=>{t.state.value=e,t.state.open=!1,t.dispatchEvent(new CustomEvent("change",{bubbles:!0,detail:e}))},t.toggle=()=>{t.state.open=!t.state.open,t.state.open&&setTimeout(()=>{var i;null==(i=e.$(t,"input"))||i.focus()},10)};const i=e=>{t.contains(e.target)||(t.state.open=!1)};window.addEventListener("click",i),t.addEventListener("remove",()=>window.removeEventListener("click",i))},e.Util.makeDom('\n
\n \n
\n \n
\n \n
No icons found
\n
\n
\n
\n'),e.Util.makeDom("")),l.register("DatePicker"),l.register("ColorPicker"),l.register("IconPicker");const r=(t={})=>{const i=new Map,a=new Map;let n=1;const s=e.Util.newAvg();let l=0,o=0,r=0,d=null,c=null,m=!1;const u=t.itemHeight||null;return{reset:(t,e)=>{if(m=!1,i.clear(),a.clear(),s.clear(),r=0,d=null,c=null,!(null==t?void 0:t.length))return[];const p=t.length;n=Math.ceil(Math.sqrt(p))||10;const h=window.getComputedStyle(e);l=parseFloat(h.paddingTop)||0,o=parseFloat(h.rowGap)||0;const b=Math.max(10,Math.ceil((e.clientHeight||100)/(u||32)));return t.slice(0,Math.min(3*b,p))},init:(t,e)=>{if(m)return;const l=t.length;let o=u||s.get()||32;l>0&&"object"==typeof t[0]&&null!==t[0]&&t[0]._itemHeight&&(o=t[0]._itemHeight),s.add(o),null===d&&(d=0,c=0);for(let e=0;e{if(0===e.offsetHeight)return;if(null===d){const t=window.getComputedStyle(e);d=parseFloat(t.marginTop)||0,c=parseFloat(t.marginBottom)||0}0!==t||r||(r=d);const l=e.offsetHeight+d+c+o,m=i.get(t);if(l!==m){i.set(t,l),s.add(l);const e=l-(m||0),o=t-t%n;a.has(o)&&a.set(o,a.get(o)+e)}},calc:(t,e)=>{if(!m||!e)return null;const d=e.length,c=Math.max(16,s.get()||32);let u=Math.max(10,Math.ceil((t.clientHeight||100)/c)),p=l+r+o,h=0,b=0,g=0,f=0,v=[];const y=t.scrollTop;let x=0;for(let t=0;t2*d)throw new Error(`VirtualScroll.calc infinite loop detected at i=${t}, status=${b}, size=${d}, groupItemCount=${n}`);if(0===b){const s=a.get(t);if(s&&p+s<=y&&t+n0?o:0)),postHeight:h>0?Math.max(0,h-2*o):0,renderedList:v,listStartIndex:g}}}};e.Component.register("List",t=>{t.mode=t.getAttribute("mode")||"normal",t.fast=t.hasAttribute("fast"),t.collapsible=t.hasAttribute("collapsible");const i=t.fast?t.querySelector(".vs-pad-top"):null,a=t.fast?t.querySelector(".vs-pad-bottom"):null,n={idfield:"id",labelfield:"label",summaryfield:"summary",groupidfield:"id",grouplabelfield:"label",groupsummaryfield:"summary",groupfield:"group",parentfield:"parent",groupicon:"folder",itemicon:"file"};t.collapsed=e.NewState({});const s=()=>{e.Util.updateDefaults(t,n);const i=t.state.list||[],a=[];if("group"===t.mode){const e={};i.forEach(i=>{var a;return(e[a=i[t.groupfield]]??(e[a]=[])).push(i)}),(t.state.groups||[]).forEach(i=>{a.push({type:"group",...i});const n=e[i[t.groupidfield]];n&&n.forEach(t=>a.push({type:"item",...t}))})}else if("tree"===t.mode){const e={};i.forEach(i=>{var a;return(e[a=i[t.parentfield]||""]??(e[a]=[])).push(i)});const n=(i,s,l)=>i.forEach(i=>{var o;const r=i[t.idfield],d=!!(null==(o=e[r])?void 0:o.length),c=t.collapsed[r];a.push({type:"item",...i,_level:s,_hasChildren:d,_parents:l}),d&&!c&&n(e[r],s+1,[...l,r])});n(e[""]||[],0,[])}else i.forEach(t=>a.push({type:"item",...t}));t.state._flatList=a};t.state.__watch("list",s);const l=t.fast?r():null;t.state._renderedList=[];let o=!1;t.refresh=()=>{if(t.fast&&!o){o=!0;try{const e=l.calc(t,t.state._flatList);if(e){i&&(i.style.height=`${e.prevHeight}px`),a&&(a.style.height=`${e.postHeight}px`),t.state._listStartIndex!==e.listStartIndex&&(t.state._listStartIndex=e.listStartIndex);const n=t.state._renderedList||[];n.length===e.renderedList.length&&n[0]===e.renderedList[0]&&n[n.length-1]===e.renderedList[e.renderedList.length-1]||(t.state._renderedList=e.renderedList)}}finally{setTimeout(()=>{o=!1},0)}}},t.onItemUpdate=(e,i)=>{t.fast&&l.update(e+(t.state._listStartIndex||0),i)},t.state.__watch("_flatList",e=>{t.fast?(i&&(i.style.height="0px"),a&&(a.style.height="0px"),t.state._listStartIndex=0,t.state._renderedList=l.reset(e,t)||[],setTimeout(()=>{t.state._flatList===e&&l.init(e,t.refresh)})):t.state._renderedList=e}),t.selectItem=(e,i)=>{t.hasAttribute("auto-select")&&(t.state.selectedItem=t.state.selectedItem===e[t.idfield]?null:e[t.idfield]),t.dispatchEvent(new CustomEvent("itemclick",{bubbles:!1,detail:{item:e,index:i+(t.fast&&t.state._listStartIndex||0)}}))},t.selectGroup=(e,i)=>{t.hasAttribute("auto-select-group")&&(t.state.selectedGroup=t.state.selectedGroup===e[t.groupidfield]?null:e[t.groupidfield]),t.dispatchEvent(new CustomEvent("groupclick",{bubbles:!1,detail:{item:e,index:i}}))},t.toggleCollapse=e=>{t.collapsible&&e._hasChildren&&(t.collapsed[e[t.idfield]]=!t.collapsed[e[t.idfield]],s())},s()},e.Util.makeDom('\n
\n\t
\n\t\n\t
\n
\n')),e.Component.register("Nav",t=>{t.vertical=t.hasAttribute("vertical"),t.click=(i,a)=>{i.noselect||a||(e.Hash.nav=i.name),t.dispatchEvent(new CustomEvent("nav",{detail:{item:i},bubbles:!1}))}},e.Util.makeDom('\n
\n\t\n\t\n\t\n\t
\n\t\n
\n'));let d=!1,c={},m={};const u={start:(t,{onmousemove:e,onmouseup:i})=>{c={x:t.clientX,y:t.clientY,w:0,h:0},m={onmousemove:e,onmouseup:i},d=!0}};"undefined"!=typeof document&&(document.addEventListener("mouseup",t=>{var e;d&&(d=!1,null==(e=m.onmouseup)||e.call(m,{event:t,...c}))}),document.addEventListener("mousemove",t=>{var e;d&&(c.w=t.clientX-c.x,c.h=t.clientY-c.y,null==(e=m.onmousemove)||e.call(m,{event:t,...c}))})),e.Component.register("Resizer",t=>{t.isVertical=t.hasAttribute("vertical");const e=parseInt(t.getAttribute("min"))||10,i=parseInt(t.getAttribute("max"))||1e3,a=t.target||t.previousElementSibling;t.addEventListener("bind",e=>{void 0!==e.detail&&null!==e.detail&&(a.style[t.isVertical?"height":"width"]=e.detail+"px")});const n=(a,n,s)=>{const l=a+(t.isVertical?s:n);return li?i:l};t.addEventListener("mousedown",e=>{const i=t.isVertical?a.offsetHeight:a.offsetWidth;u.start(e,{onmousemove:({w:e,h:s})=>{const l=n(i,e,s);a.style[t.isVertical?"height":"width"]=l+"px",t.dispatchEvent(new CustomEvent("resizing",{detail:{oldSize:i,newSize:l},bubbles:!1}))},onmouseup:({w:e,h:a})=>{const s=n(i,e,a);t.dispatchEvent(new CustomEvent("resize",{detail:{oldSize:i,newSize:s},bubbles:!1})),t.dispatchEvent(new CustomEvent("change",{detail:s,bubbles:!1}))}})})},e.Util.makeDom("\n
\n")),"undefined"!=typeof window&&window.addEventListener("beforeunload",t=>{e.State.exitBlocks>0&&t.preventDefault()});const p=document.documentElement;p.hasAttribute("$data-bs-theme")||p.hasAttribute("data-bs-theme")||p.setAttribute("$data-bs-theme","LocalStorage.darkMode?'dark':'light'"),globalThis.HTTP=i,globalThis.UI=n,globalThis.AutoForm=l,globalThis.MouseMover=u,globalThis.VirtualScroll=r;const h={HTTP:i,UI:n,AutoForm:l,MouseMover:u,VirtualScroll:r,State:e.State,List:r};if("undefined"!=typeof document){globalThis.ApigoBase=h;const t=()=>e.RefreshState(document.documentElement);"loading"!==document.readyState?setTimeout(t,1):document.addEventListener("DOMContentLoaded",()=>setTimeout(t,1),!0)}Object.defineProperty(t,"State",{enumerable:!0,get:()=>e.State}),t.APIComponent=a,t.AutoForm=l,t.HTTP=i,t.MouseMover=u,t.UI=n,t.VirtualScroll=r,Object.defineProperty(t,Symbol.toStringTag,{value:"Module"})}); +!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("@apigo.cc/state"),require("@apigo.cc/bootstrap")):"function"==typeof define&&define.amd?define(["exports","@apigo.cc/state","@apigo.cc/bootstrap"],e):e((t="undefined"!=typeof globalThis?globalThis:t||self).ApigoBase={},t.ApigoState)}(this,function(t,e){"use strict";const i={get:({url:t,...e})=>i.request({url:t,method:"GET",...e}),post:({url:t,data:e,...a})=>i.request({url:t,method:"POST",data:e,...a}),put:({url:t,data:e,...a})=>i.request({url:t,method:"PUT",data:e,...a}),delete:({url:t,...e})=>i.request({url:t,method:"DELETE",...e}),head:({url:t,...e})=>i.request({url:t,method:"HEAD",...e}),request:async({url:t,method:e="POST",data:i,headers:a={},responseType:n,timeout:s=1e4})=>{var l;const o={method:e=e.toUpperCase(),signal:null==(l=AbortSignal.timeout)?void 0:l.call(AbortSignal,s)};if(void 0!==i&&"GET"!==e&&"HEAD"!==e){if(i instanceof HTMLFormElement&&(i=new FormData(i)),i&&"object"==typeof i&&!(i instanceof FormData)&&!(i instanceof ArrayBuffer||ArrayBuffer.isView(i))&&Object.values(i).some(t=>t instanceof File||t instanceof Blob||t instanceof FileList||Array.isArray(t)&&t.some(t=>t instanceof File||t instanceof Blob))){const t=new FormData;for(const[e,a]of Object.entries(i))a instanceof FileList||Array.isArray(a)?Array.from(a).forEach(i=>t.append(e,i)):null!=a&&t.append(e,a);i=t}i instanceof FormData?delete a["Content-Type"]:"string"==typeof i||i instanceof ArrayBuffer||ArrayBuffer.isView(i)||(i=JSON.stringify(i),a["Content-Type"]||(a["Content-Type"]="application/json")),o.body=i}Object.keys(a).length&&(o.headers=a);const r={error:null,ok:null,status:0,headers:{},responseType:"",result:null};try{const e=await fetch(t,o);if(Object.assign(r,{ok:e.ok,status:e.status,headers:Object.fromEntries(e.headers.entries())}),!n){const t=e.headers.get("Content-Type")||"";n=t.includes("application/json")?"json":/image|video|audio|pdf|zip|octet-stream/.test(t)?"binary":"text",r.responseType=n}!1===r.ok&&(r.error=(r.statusText||"HTTP "+r.status+" error")+" for "+t),r.result="json"===n?await e.json():"binary"===n?await e.arrayBuffer():await e.text()}catch(t){Object.assign(r,{error:t.message||String(t),ok:!1})}return r}},a=e.Component.register("API",t=>{t.request=e.NewState({url:"",method:"GET",headers:{},data:null,timeout:1e4,responseType:""}),t.response=e.NewState({loading:!1,ok:null,status:null,error:null,headers:{},responseType:"",result:null}),t.result=e.NewState(),t.do=(e={})=>new Promise((a,n)=>{const s={...t.request,...e};if(!s.url)throw new Error(".url is required");s.headers={...t.request.headers,...e.headers},t.response.loading=!0,i.request(s).then(e=>{if(Object.keys(e).forEach(i=>{"result"!==i&&(t.response[i]=e[i])}),e.result&&"object"==typeof e.result&&t.result&&"object"==typeof t.result?Object.assign(t.result,e.result):t.result=e.result,t.response.loading=!1,!1===e.ok)throw new Error(e.error);if("object"==typeof e.result&&e.result.error)throw new Error(e.result.error);t.dispatchEvent(new CustomEvent("response",{detail:e,bubbles:!1})),a(e)}).catch(i=>{var a;!e.noui&&(null==(a=globalThis.UI)?void 0:a.toast)&&UI.toast(i.message,{type:"danger"}),t.dispatchEvent(new CustomEvent("error",{detail:i,bubbles:!0})),n(i)})});let a=null;t.request.__watch(null,()=>{t.hasAttribute("auto")&&t.request.url&&(a||(a=Promise.resolve().then(()=>{t.do(),a=null})))})}),n={};e.Component.register("Modal",t=>{t.modal=new bootstrap.Modal(t),t.addEventListener("bind",e=>{e.detail?t.modal.show():t.modal.hide()}),t.addEventListener("hide.bs.modal",()=>{var e;null==(e=document.activeElement)||e.blur(),t.dispatchEvent(new CustomEvent("change",{bubbles:!1,detail:!1}))}),e.Util.copyFunction(t,t.modal,"show","hide")},e.Util.makeDom('\n
\n
\n
\n
\n
\n \n
\n
\n
\n
\n
\n
\n')),e.Component.register("Dialog",e.Component.getSetupFunction("Modal"),e.Util.makeDom('\n
\n
\n
\n \n
\n
\n \n
\n
\n
\n
\n'));let s=0;n.showDialog=function({title:t="",message:e="",buttons:i=["{#Close#}"],type:a="body"}){const n=document.body.appendChild(document.createElement("Dialog"));return n.style.zIndex=2e3+ ++s,Promise.resolve().then(()=>{Object.assign(n.state,{message:e,title:t,type:a,buttons:i}),n.show()}),new Promise(t=>{n.addEventListener("change",e=>{s--,t(n.result||0),n.remove()})})},n.alert=function(t,e={}){return n.showDialog({message:t,...e})},n.confirm=function(t,e={}){return new Promise(i=>n.showDialog({message:t,buttons:["{#Cancel#}","{#Confirm#}"],...e}).then(t=>i(t>=2)).catch(()=>i(!1)))},e.Component.register("Toast",t=>{t.toast=new bootstrap.Toast(t,{autohide:t.state.delay>0}),e.Util.copyFunction(t,t.toast,"show","hide"),t.addEventListener("show.bs.toast",()=>{if(t.state.delay>0){let e;const i=()=>{t.state.left=t.state.delay/1e3,e=setInterval(()=>{(!t.isConnected||--t.state.left<=0)&&clearInterval(e)},1e3)};i(),t.addEventListener("mouseenter",()=>{clearInterval(e),t.state.left=void 0}),t.addEventListener("mouseleave",i)}})},e.Util.makeDom('\n
\n
\n
\n
\n \n \n
\n \n
\n
\n \n
\n
\n
\n'),e.Util.makeDom('
')),n.toast=function(t,i={}){const a=i.delay??5e3,n=document.createElement("Toast");n.state={delay:a,left:a?a/1e3:void 0,type:i.type||"primary",message:t,buttons:i.buttons||[]},e.$(`[toast-container="${i.container||"default"}"]`).appendChild(n),Promise.resolve().then(()=>n.show())},n.toastConfirm=function(t,e={}){return new Promise(i=>n.toast(t,{buttons:["{#Confirm#}"],...e}).then(t=>i(1===t)).catch(()=>i(!1)))},e.Component.register("AutoForm",t=>{t.state.schema||(t.state.schema=[]);const a=t=>t&&"object"==typeof t&&!t.__isProxy?e.NewState(t):t;t.state.__watch("data",e=>t.data=a(e)),t.data=a(t.state.data||{}),t.vertical=t.hasAttribute("vertical"),t.inline=t.hasAttribute("inline"),t.request={method:"POST"},t.response={},t.result=null,t.inline&&(e.State.__watch("editingData",e=>{t.data=e}),e.State.__watch("editingSchema",e=>{t.state.schema=e})),t.form=e.$(t,"form"),t.submit=(e={})=>{var a,n;if(!t.form.reportValidity())return null==(n=null==(a=globalThis.UI)?void 0:a.toast)?void 0:n.call(a,"{#verify failed#}",{type:"danger"});if(!t.dispatchEvent(new CustomEvent("submit",{detail:t.data,cancelable:!0,bubbles:!1})))return;const s={...t.request,data:t.data,noui:!0,...e};let l=null;if(t.api)l=t.api.do(s);else{if(!t.request.url)return console.warn("{#please config .api or .request.url to auto submit#}");l=i.request(s)}l.then(e=>{if(t.response=e,t.result=e.result,"object"==typeof e.result&&e.result.error)throw new Error(e.result.error);t.dispatchEvent(new CustomEvent("response",{detail:e,bubbles:!1}))}).catch(e=>{var i;(null==(i=globalThis.UI)?void 0:i.toast)&&UI.toast(e.message,{type:"danger"}),t.dispatchEvent(new CustomEvent("error",{detail:e,bubbles:!0}))})}},e.Util.makeDom('\n
\n
\n \n \n
\n
\n'),e.Util.makeDom(""));const l={customTypes:[],register:(t,e)=>{const i=e||t;l.customTypes.find(e=>e.name===t)||l.customTypes.push({name:t,typeName:i})}};e.Component.register("TagsInput",t=>{t.state=e.NewState({tags:[]}),t.addEventListener("bind",e=>{t.state.tags=Array.isArray(e.detail)?e.detail:[]}),Object.defineProperty(t,"value",{get:()=>t.state.tags,set:e=>{t.state.tags=Array.isArray(e)?e:[]}})},e.Util.makeDom(`\n
\n \n \n
\n`),e.Util.makeDom("")),l.register("TagsInput"),e.Component.register("DatePicker",t=>{t.state=e.NewState({start:"",end:""}),t.addEventListener("bind",e=>{var i,a,n;t.state.start=e.detail||"";const s=t.closest("AutoForm"),l=t.getAttribute("name"),o=null==(a=null==(i=null==s?void 0:s.state)?void 0:i.schema)?void 0:a.find(t=>t.name===l),r=(null==(n=null==o?void 0:o.setting)?void 0:n.rangeEnd)||t.rangeEnd;s&&r&&(t.state.end=s.data[r]||"")}),Object.defineProperty(t,"isRange",{get:()=>{var e,i,a;const n=t.closest("AutoForm"),s=t.getAttribute("name"),l=null==(i=null==(e=null==n?void 0:n.state)?void 0:e.schema)?void 0:i.find(t=>t.name===s);return!(!(null==(a=null==l?void 0:l.setting)?void 0:a.rangeEnd)&&!t.rangeEnd)}}),Object.defineProperty(t,"value",{get:()=>t.state.start,set:e=>{t.state.start=e||""}}),t.updateStart=e=>{t.state.start=e,t.dispatchEvent(new CustomEvent("change",{bubbles:!0,detail:e}))},t.updateEnd=e=>{var i,a,n;t.state.end=e;const s=t.closest("AutoForm"),l=t.getAttribute("name"),o=null==(a=null==(i=null==s?void 0:s.state)?void 0:i.schema)?void 0:a.find(t=>t.name===l),r=(null==(n=null==o?void 0:o.setting)?void 0:n.rangeEnd)||t.rangeEnd;s&&r&&(s.data[r]=e)}},e.Util.makeDom('\n
\n \n \n
\n')),e.Component.register("ColorPicker",t=>{t.state=e.NewState({value:"#000000"}),t.addEventListener("bind",e=>{t.state.value=e.detail||"#000000"}),Object.defineProperty(t,"value",{get:()=>t.state.value,set:e=>{t.state.value=e||"#000000"}}),t.updateValue=e=>{t.state.value=e,t.dispatchEvent(new CustomEvent("change",{bubbles:!0,detail:e}))}},e.Util.makeDom('\n
\n \n \n
\n'));const o=["alarm","archive","arrow-left","arrow-right","bag","bank","basket","bell","bookmark","box","briefcase","calendar","camera","cart","chat","check","chevron-down","chevron-left","chevron-right","chevron-up","clock","cloud","code","collection","command","cpu","credit-card","cup","dash","database","display","door-closed","download","droplet","earbuds","edit","egg","eject","envelope","eraser","eye","file","filter","flag","folder","gear","gem","gift","graph-up","grid","hammer","hand-thumbs-up","heart","house","image","inbox","info-circle","journal","key","laptop","layers","layout-text-sidebar-reverse","lightbulb","link","list","lock","map","mic","moon","mouse","music-note","newspaper","palette","paperclip","pause","pencil","person","phone","pie-chart","play","plus","printer","puzzle","question-circle","reception-4","record","reply","rss","save","search","send","server","share","shield","shop","shuffle","skip-end","skip-start","slash","sliders","smartphone","speaker","speedometer","spellcheck","square","star","stickies","stop","stopwatch","suit-heart","sun","table","tag","tags","telephone","terminal","text-paragraph","thermometer","three-dots","ticket","tools","trash","trophy","truck","tv","umbrella","unlock","upload","vector-pen","wallet","watch","wifi","window","wrench","x","zoom-in","zoom-out","activity","at","award","backspace","badge-3d","badge-4k","badge-8k","badge-ad","badge-ar","badge-cc","badge-hd","badge-tm","badge-vo","badge-vr","badge-wc","bar-chart","battery","bicycle","binoculars","blockquote-left","blockquote-right","book","bookshelf","bootstrap","border-all","border-bottom","border-center","border-inner","border-left","border-middle","border-outer","border-right","border-style","border-top","border-width","bounding-box","box-arrow-down","box-arrow-in-down","box-arrow-in-left","box-arrow-in-right","box-arrow-in-up","box-arrow-left","box-arrow-right","box-arrow-up","box-seam","brightness-alt-high","brightness-alt-low","brightness-high","brightness-low","broadcast","brush","bucket","bug","building","bullseye","calculator","calendar-check","calendar-date","calendar-day","calendar-event","calendar-minus","calendar-month","calendar-plus","calendar-range","calendar-week","calendar-x","calendar2","calendar3","calendar4","camera-reels","camera-video","capslock","card-checklist","card-heading","card-image","card-list","card-text","caret-down","caret-left","caret-right","caret-up","cart-check","cart-dash","cart-plus","cart-x","cash","cash-stack","cast","chat-dots","chat-left","chat-quote","chat-right","chat-square","chat-text","check-all","check-circle","check-square","circle","clipboard","cloud-arrow-down","cloud-arrow-up","cloud-check","cloud-download","cloud-fog","cloud-hail","cloud-lightning","cloud-minus","cloud-moon","cloud-plus","cloud-rain","cloud-slash","cloud-snow","cloud-sun","cloud-upload","clouds","cloudy","code-slash","code-square","collection-play","columns","columns-gap","compass","cone","cone-striped","controller","credit-card-2-back","credit-card-2-front","crop","cup-straw","cursor","dash-circle","dash-square","diagram-2","diagram-3","diamond","dice-1","dice-2","dice-3","dice-4","dice-5","dice-6","disc","discord","distribute-horizontal","distribute-vertical","door-open","dot","droplet-half","easel","egg-fried","emoji-angry","emoji-dizzy","emoji-expressionless","emoji-frown","emoji-heart-eyes","emoji-laughing","emoji-neutral","emoji-smile","emoji-sunglasses","emoji-wink","envelope-open","exclamation","exclamation-circle","exclamation-diamond","exclamation-octagon","exclamation-square","exclamation-triangle","eye-slash","eyedropper","facebook","file-arrow-down","file-arrow-up","file-binary","file-break","file-check","file-code","file-diff","file-earmark","file-excel","file-image","file-lock","file-medical","file-minus","file-music","file-pdf","file-person","file-play","file-plus","file-post","file-ppt","file-richtext","file-slides","file-spreadsheet","file-text","file-word","file-zip","files","film","filter-circle","filter-left","filter-right","filter-square","fingerprint","flower1","flower2","flower3","folder-check","folder-minus","folder-plus","folder-symlink","folder-x","folder2-open","fonts","forward","front","fullscreen","fullscreen-exit","funnel","gear-wide","gender-female","gender-male","gender-trans","geo","geo-alt","github","globe","google","graph-down","grid-1x2","grid-3x2","grid-3x3","grip-horizontal","grip-vertical","hand-index","hand-thumbs-down","handbag","hash","headphones","headset","heart-half","heptagon","hourglass","hourglass-bottom","hourglass-split","hourglass-top","house-door","hr","hurricane","image-alt","images","infinity","input-cursor","instagram","intersect","journal-album","journal-arrow-down","journal-arrow-up","journal-bookmark","journal-check","journal-code","journal-medical","journal-minus","journal-plus","journal-richtext","journal-text","journal-x","journals","justify","kanban","keyboard","ladder","lamp","layers-half","layout-sidebar","layout-split","layout-three-columns","life-preserver","lightbulb-off","lightning","lightning-charge","link-45deg","linkedin","list-check","list-nested","list-ol","list-stars","list-task","list-ul","mailbox","markdown","mask","mastodon","megaphone","menu-app","menu-button","messenger","mic-mute","minecart","minecart-loaded","moisture","mouse2","mouse3","music-note-beamed","music-note-list","music-player","node-minus","node-plus","nut","octagon","option","outlet","paint-bucket","patch-check","patch-exclamation","patch-minus","patch-plus","patch-question","pause-btn","pause-circle","peace","pen","pencil-square","pentagon","person-badge","person-bounding-box","person-circle","person-lines-fill","phone-landscape","phone-vibrate","pie-chart-fill","pin","pin-angle","pin-fill","pin-map","pip","play-btn","play-circle","plug","plus-circle","plus-square","power","question","question-diamond","question-square","rainbow","receipt","receipt-cutoff","reception-0","reception-1","reception-2","reception-3","record-btn","record-circle","record2","recycle","reddit","reply-all","router","rulers","safe","save2","sd-card","segmented-nav","shield-check","shield-exclamation","shield-lock","shield-shaded","shield-slash","shift","signpost","signpost-2","signpost-split","sim","skip-backward","skip-forward","slack","slash-circle","slash-square","smartwatch","snow","snow2","snow3","sort-alpha-down","sort-alpha-up","sort-numeric-down","sort-numeric-up","soundwave","speedometer2","square-half","stack","star-half","stars","stop-btn","stop-circle","suit-club","suit-diamond","suit-spade","sunglasses","sunrise","sunset","symmetry-horizontal","symmetry-vertical","tablet","tablet-landscape","telegram","telephone-forward","telephone-inbound","telephone-outbound","telephone-plus","telephone-x","text-center","text-indent-left","text-indent-right","text-left","text-right","thermometer-half","thermometer-high","thermometer-low","thermometer-snow","thermometer-sun","three-dots-vertical","toggle-off","toggle-on","toggle2-off","toggle2-on","tornado","translate","trash2","tree","truck-flatbed","tsunami","type","type-bold","type-h1","type-h2","type-h3","type-italic","type-strikethrough","type-underline","ui-checks","ui-checks-grid","ui-radios","ui-radios-grid","union","upc","upc-scan","view-list","view-stacked","vinyl","voicemail","volume-down","volume-mute","volume-off","volume-up","vr","wallet2","water","whatsapp","wifi-1","wifi-2","wifi-off","wind","window-dock","window-sidebar","x-circle","x-diamond","x-octagon","x-square","youtube"];e.Component.register("IconPicker",t=>{t.state=e.NewState({value:"",search:"",open:!1}),t.addEventListener("bind",e=>{t.state.value=e.detail||""}),Object.defineProperty(t,"value",{get:()=>t.state.value,set:e=>{t.state.value=e||""}}),Object.defineProperty(t,"filteredIcons",{get:()=>{var e;const i=(null==(e=t.state.search)?void 0:e.toLowerCase())||"";return o.filter(t=>t.includes(i))}}),t.selectIcon=e=>{t.state.value=e,t.state.open=!1,t.dispatchEvent(new CustomEvent("change",{bubbles:!0,detail:e}))},t.toggle=()=>{t.state.open=!t.state.open,t.state.open&&setTimeout(()=>{var i;null==(i=e.$(t,"input"))||i.focus()},10)};const i=e=>{t.contains(e.target)||(t.state.open=!1)};window.addEventListener("click",i),t.addEventListener("remove",()=>window.removeEventListener("click",i))},e.Util.makeDom('\n
\n \n
\n \n
\n \n
No icons found
\n
\n
\n
\n'),e.Util.makeDom("")),l.register("DatePicker"),l.register("ColorPicker"),l.register("IconPicker");const r=(t={})=>{const i=new Map,a=new Map;let n=1;const s=e.Util.newAvg();let l=0,o=0,r=0,d=null,c=null,m=!1;const p=t.itemHeight||null;return{reset:(t,e)=>{if(m=!1,i.clear(),a.clear(),s.clear(),r=0,d=null,c=null,!(null==t?void 0:t.length))return[];const u=t.length;n=Math.ceil(Math.sqrt(u))||10;const h=window.getComputedStyle(e);l=parseFloat(h.paddingTop)||0,o=parseFloat(h.rowGap)||0;const b=Math.max(10,Math.ceil((e.clientHeight||100)/(p||32)));return t.slice(0,Math.min(3*b,u))},init:(t,e)=>{if(m)return;const l=t.length;let o=p||s.get()||32;l>0&&"object"==typeof t[0]&&null!==t[0]&&t[0]._itemHeight&&(o=t[0]._itemHeight),s.add(o),null===d&&(d=0,c=0);for(let e=0;e{if(0===e.offsetHeight)return;if(null===d){const t=window.getComputedStyle(e);d=parseFloat(t.marginTop)||0,c=parseFloat(t.marginBottom)||0}0!==t||r||(r=d);const l=e.offsetHeight+d+c+o,m=i.get(t);if(l!==m){i.set(t,l),s.add(l);const e=l-(m||0),o=t-t%n;a.has(o)&&a.set(o,a.get(o)+e)}},calc:(t,e)=>{if(!m||!e)return null;const d=e.length,c=Math.max(16,s.get()||32);let p=Math.max(10,Math.ceil((t.clientHeight||100)/c)),u=l+r+o,h=0,b=0,g=0,f=0,v=[];const y=t.scrollTop;let x=0;for(let t=0;t2*d)throw new Error(`VirtualScroll.calc infinite loop detected at i=${t}, status=${b}, size=${d}, groupItemCount=${n}`);if(0===b){const s=a.get(t);if(s&&u+s<=y&&t+n0?o:0)),postHeight:h>0?Math.max(0,h-2*o):0,renderedList:v,listStartIndex:g}}}};e.Component.register("List",t=>{t.mode=t.getAttribute("mode")||"normal",t.fast=t.hasAttribute("fast"),t.collapsible=t.hasAttribute("collapsible");const i=t.fast?t.querySelector(".vs-pad-top"):null,a=t.fast?t.querySelector(".vs-pad-bottom"):null,n={idfield:"id",labelfield:"label",summaryfield:"summary",groupidfield:"id",grouplabelfield:"label",groupsummaryfield:"summary",groupfield:"group",parentfield:"parent",groupicon:"folder",itemicon:"file"};t.collapsed=e.NewState({});const s=()=>{e.Util.updateDefaults(t,n);const i=t.state.list||[],a=[];if("group"===t.mode){const e={};i.forEach(i=>{var a;return(e[a=i[t.groupfield]]??(e[a]=[])).push(i)}),(t.state.groups||[]).forEach(i=>{a.push({type:"group",...i});const n=e[i[t.groupidfield]];n&&n.forEach(t=>a.push({type:"item",...t}))})}else if("tree"===t.mode){const e={};i.forEach(i=>{var a;return(e[a=i[t.parentfield]||""]??(e[a]=[])).push(i)});const n=(i,s,l)=>i.forEach(i=>{var o;const r=i[t.idfield],d=!!(null==(o=e[r])?void 0:o.length),c=t.collapsed[r];a.push({type:"item",...i,_level:s,_hasChildren:d,_parents:l}),d&&!c&&n(e[r],s+1,[...l,r])});n(e[""]||[],0,[])}else i.forEach(t=>a.push({type:"item",...t}));t.state._flatList=a};t.state.__watch("list",s);const l=t.fast?r():null;t.state._renderedList=[];let o=!1;t.refresh=()=>{if(t.fast&&!o){o=!0;try{const e=l.calc(t,t.state._flatList);if(e){i&&(i.style.height=`${e.prevHeight}px`),a&&(a.style.height=`${e.postHeight}px`),t.state._listStartIndex!==e.listStartIndex&&(t.state._listStartIndex=e.listStartIndex);const n=t.state._renderedList||[];n.length===e.renderedList.length&&n[0]===e.renderedList[0]&&n[n.length-1]===e.renderedList[e.renderedList.length-1]||(t.state._renderedList=e.renderedList)}}finally{setTimeout(()=>{o=!1},0)}}},t.onItemUpdate=(e,i)=>{t.fast&&l.update(e+(t.state._listStartIndex||0),i)},t.state.__watch("_flatList",e=>{t.fast?(i&&(i.style.height="0px"),a&&(a.style.height="0px"),t.state._listStartIndex=0,t.state._renderedList=l.reset(e,t)||[],setTimeout(()=>{t.state._flatList===e&&l.init(e,t.refresh)})):t.state._renderedList=e}),t.selectItem=(e,i)=>{t.hasAttribute("auto-select")&&(t.state.selectedItem=t.state.selectedItem===e[t.idfield]?null:e[t.idfield]),t.dispatchEvent(new CustomEvent("itemclick",{bubbles:!1,detail:{item:e,index:i+(t.fast&&t.state._listStartIndex||0)}}))},t.selectGroup=(e,i)=>{t.hasAttribute("auto-select-group")&&(t.state.selectedGroup=t.state.selectedGroup===e[t.groupidfield]?null:e[t.groupidfield]),t.dispatchEvent(new CustomEvent("groupclick",{bubbles:!1,detail:{item:e,index:i}}))},t.toggleCollapse=e=>{t.collapsible&&e._hasChildren&&(t.collapsed[e[t.idfield]]=!t.collapsed[e[t.idfield]],s())},s()},e.Util.makeDom('\n
\n\t
\n\t\n\t
\n
\n')),e.Component.register("Nav",t=>{t.vertical=t.hasAttribute("vertical"),t.click=(i,a)=>{i.noselect||a||(e.Hash.nav=i.name),t.dispatchEvent(new CustomEvent("nav",{detail:{item:i},bubbles:!1}))}},e.Util.makeDom('\n
\n\t\n\t\n\t\n\t
\n\t\n
\n'));let d=!1,c={},m={};const p={start:(t,{onmousemove:e,onmouseup:i})=>{c={x:t.clientX,y:t.clientY,w:0,h:0},m={onmousemove:e,onmouseup:i},d=!0}};"undefined"!=typeof document&&(document.addEventListener("mouseup",t=>{var e;d&&(d=!1,null==(e=m.onmouseup)||e.call(m,{event:t,...c}))}),document.addEventListener("mousemove",t=>{var e;d&&(c.w=t.clientX-c.x,c.h=t.clientY-c.y,null==(e=m.onmousemove)||e.call(m,{event:t,...c}))})),e.Component.register("Resizer",t=>{t.isVertical=t.hasAttribute("vertical");const e=parseInt(t.getAttribute("min"))||10,i=parseInt(t.getAttribute("max"))||1e3,a=t.target||t.previousElementSibling;t.addEventListener("bind",e=>{void 0!==e.detail&&null!==e.detail&&(a.style[t.isVertical?"height":"width"]=e.detail+"px")});const n=(a,n,s)=>{const l=a+(t.isVertical?s:n);return li?i:l};t.addEventListener("mousedown",e=>{const i=t.isVertical?a.offsetHeight:a.offsetWidth;p.start(e,{onmousemove:({w:e,h:s})=>{const l=n(i,e,s);a.style[t.isVertical?"height":"width"]=l+"px",t.dispatchEvent(new CustomEvent("resizing",{detail:{oldSize:i,newSize:l},bubbles:!1}))},onmouseup:({w:e,h:a})=>{const s=n(i,e,a);t.dispatchEvent(new CustomEvent("resize",{detail:{oldSize:i,newSize:s},bubbles:!1})),t.dispatchEvent(new CustomEvent("change",{detail:s,bubbles:!1}))}})})},e.Util.makeDom("\n
\n")),"undefined"!=typeof window&&window.addEventListener("beforeunload",t=>{e.State.exitBlocks>0&&t.preventDefault()});const u=document.documentElement;u.hasAttribute("$data-bs-theme")||u.hasAttribute("data-bs-theme")||u.setAttribute("$data-bs-theme","LocalStorage.darkMode?'dark':'light'"),globalThis.HTTP=i,globalThis.UI=n,globalThis.AutoForm=l,globalThis.MouseMover=p,globalThis.VirtualScroll=r;const h={HTTP:i,UI:n,AutoForm:l,MouseMover:p,VirtualScroll:r,State:e.State,List:r};"undefined"!=typeof document&&(globalThis.ApigoBase=h),Object.defineProperty(t,"State",{enumerable:!0,get:()=>e.State}),t.APIComponent=a,t.AutoForm=l,t.HTTP=i,t.MouseMover=p,t.UI=n,t.VirtualScroll=r,Object.defineProperty(t,Symbol.toStringTag,{value:"Module"})}); diff --git a/dist/base.min.mjs b/dist/base.min.mjs index 16073da..11c6f2a 100644 --- a/dist/base.min.mjs +++ b/dist/base.min.mjs @@ -1 +1 @@ -import{Component as t,NewState as e,Util as i,$ as a,State as s,Hash as n,RefreshState as l}from"@apigo.cc/state";import{State as o}from"@apigo.cc/state";import"@apigo.cc/bootstrap";const r={get:({url:t,...e})=>r.request({url:t,method:"GET",...e}),post:({url:t,data:e,...i})=>r.request({url:t,method:"POST",data:e,...i}),put:({url:t,data:e,...i})=>r.request({url:t,method:"PUT",data:e,...i}),delete:({url:t,...e})=>r.request({url:t,method:"DELETE",...e}),head:({url:t,...e})=>r.request({url:t,method:"HEAD",...e}),request:async({url:t,method:e="POST",data:i,headers:a={},responseType:s,timeout:n=1e4})=>{var l;const o={method:e=e.toUpperCase(),signal:null==(l=AbortSignal.timeout)?void 0:l.call(AbortSignal,n)};if(void 0!==i&&"GET"!==e&&"HEAD"!==e){if(i instanceof HTMLFormElement&&(i=new FormData(i)),i&&"object"==typeof i&&!(i instanceof FormData)&&!(i instanceof ArrayBuffer||ArrayBuffer.isView(i))&&Object.values(i).some(t=>t instanceof File||t instanceof Blob||t instanceof FileList||Array.isArray(t)&&t.some(t=>t instanceof File||t instanceof Blob))){const t=new FormData;for(const[e,a]of Object.entries(i))a instanceof FileList||Array.isArray(a)?Array.from(a).forEach(i=>t.append(e,i)):null!=a&&t.append(e,a);i=t}i instanceof FormData?delete a["Content-Type"]:"string"==typeof i||i instanceof ArrayBuffer||ArrayBuffer.isView(i)||(i=JSON.stringify(i),a["Content-Type"]||(a["Content-Type"]="application/json")),o.body=i}Object.keys(a).length&&(o.headers=a);const r={error:null,ok:null,status:0,headers:{},responseType:"",result:null};try{const e=await fetch(t,o);if(Object.assign(r,{ok:e.ok,status:e.status,headers:Object.fromEntries(e.headers.entries())}),!s){const t=e.headers.get("Content-Type")||"";s=t.includes("application/json")?"json":/image|video|audio|pdf|zip|octet-stream/.test(t)?"binary":"text",r.responseType=s}!1===r.ok&&(r.error=(r.statusText||"HTTP "+r.status+" error")+" for "+t),r.result="json"===s?await e.json():"binary"===s?await e.arrayBuffer():await e.text()}catch(t){Object.assign(r,{error:t.message||String(t),ok:!1})}return r}},d=t.register("API",t=>{t.request=e({url:"",method:"GET",headers:{},data:null,timeout:1e4,responseType:""}),t.response=e({loading:!1,ok:null,status:null,error:null,headers:{},responseType:"",result:null}),t.result=e(),t.do=(e={})=>new Promise((i,a)=>{const s={...t.request,...e};if(!s.url)throw new Error(".url is required");s.headers={...t.request.headers,...e.headers},t.response.loading=!0,r.request(s).then(e=>{if(Object.keys(e).forEach(i=>{"result"!==i&&(t.response[i]=e[i])}),e.result&&"object"==typeof e.result&&t.result&&"object"==typeof t.result?Object.assign(t.result,e.result):t.result=e.result,t.response.loading=!1,!1===e.ok)throw new Error(e.error);if("object"==typeof e.result&&e.result.error)throw new Error(e.result.error);t.dispatchEvent(new CustomEvent("response",{detail:e,bubbles:!1})),i(e)}).catch(i=>{var s;!e.noui&&(null==(s=globalThis.UI)?void 0:s.toast)&&UI.toast(i.message,{type:"danger"}),t.dispatchEvent(new CustomEvent("error",{detail:i,bubbles:!0})),a(i)})});let i=null;t.request.__watch(null,()=>{t.hasAttribute("auto")&&t.request.url&&(i||(i=Promise.resolve().then(()=>{t.do(),i=null})))})}),c={};t.register("Modal",t=>{t.modal=new bootstrap.Modal(t),t.addEventListener("bind",e=>{e.detail?t.modal.show():t.modal.hide()}),t.addEventListener("hide.bs.modal",()=>{var e;null==(e=document.activeElement)||e.blur(),t.dispatchEvent(new CustomEvent("change",{bubbles:!1,detail:!1}))}),i.copyFunction(t,t.modal,"show","hide")},i.makeDom('\n
\n
\n
\n
\n
\n \n
\n
\n
\n
\n
\n
\n')),t.register("Dialog",t.getSetupFunction("Modal"),i.makeDom('\n
\n
\n
\n \n
\n
\n \n
\n
\n
\n
\n'));let m=0;c.showDialog=function({title:t="",message:e="",buttons:i=["{#Close#}"],type:a="body"}){const s=document.body.appendChild(document.createElement("Dialog"));return s.style.zIndex=2e3+ ++m,Promise.resolve().then(()=>{Object.assign(s.state,{message:e,title:t,type:a,buttons:i}),s.show()}),new Promise(t=>{s.addEventListener("change",e=>{m--,t(s.result||0),s.remove()})})},c.alert=function(t,e={}){return c.showDialog({message:t,...e})},c.confirm=function(t,e={}){return new Promise(i=>c.showDialog({message:t,buttons:["{#Cancel#}","{#Confirm#}"],...e}).then(t=>i(t>=2)).catch(()=>i(!1)))},t.register("Toast",t=>{t.toast=new bootstrap.Toast(t,{autohide:t.state.delay>0}),i.copyFunction(t,t.toast,"show","hide"),t.addEventListener("show.bs.toast",()=>{if(t.state.delay>0){let e;const i=()=>{t.state.left=t.state.delay/1e3,e=setInterval(()=>{(!t.isConnected||--t.state.left<=0)&&clearInterval(e)},1e3)};i(),t.addEventListener("mouseenter",()=>{clearInterval(e),t.state.left=void 0}),t.addEventListener("mouseleave",i)}})},i.makeDom('\n
\n
\n
\n
\n \n \n
\n \n
\n
\n \n
\n
\n
\n'),i.makeDom('
')),c.toast=function(t,e={}){const i=e.delay??5e3,s=document.createElement("Toast");s.state={delay:i,left:i?i/1e3:void 0,type:e.type||"primary",message:t,buttons:e.buttons||[]},a(`[toast-container="${e.container||"default"}"]`).appendChild(s),Promise.resolve().then(()=>s.show())},c.toastConfirm=function(t,e={}){return new Promise(i=>c.toast(t,{buttons:["{#Confirm#}"],...e}).then(t=>i(1===t)).catch(()=>i(!1)))},t.register("AutoForm",t=>{t.state.schema||(t.state.schema=[]);const i=t=>t&&"object"==typeof t&&!t.__isProxy?e(t):t;t.state.__watch("data",e=>t.data=i(e)),t.data=i(t.state.data||{}),t.vertical=t.hasAttribute("vertical"),t.inline=t.hasAttribute("inline"),t.request={method:"POST"},t.response={},t.result=null,t.inline&&(s.__watch("editingData",e=>{t.data=e}),s.__watch("editingSchema",e=>{t.state.schema=e})),t.form=a(t,"form"),t.submit=(e={})=>{var i,a;if(!t.form.reportValidity())return null==(a=null==(i=globalThis.UI)?void 0:i.toast)?void 0:a.call(i,"{#verify failed#}",{type:"danger"});if(!t.dispatchEvent(new CustomEvent("submit",{detail:t.data,cancelable:!0,bubbles:!1})))return;const s={...t.request,data:t.data,noui:!0,...e};let n=null;if(t.api)n=t.api.do(s);else{if(!t.request.url)return console.warn("{#please config .api or .request.url to auto submit#}");n=r.request(s)}n.then(e=>{if(t.response=e,t.result=e.result,"object"==typeof e.result&&e.result.error)throw new Error(e.result.error);t.dispatchEvent(new CustomEvent("response",{detail:e,bubbles:!1}))}).catch(e=>{var i;(null==(i=globalThis.UI)?void 0:i.toast)&&UI.toast(e.message,{type:"danger"}),t.dispatchEvent(new CustomEvent("error",{detail:e,bubbles:!0}))})}},i.makeDom('\n
\n
\n \n \n
\n
\n'),i.makeDom(""));const u={customTypes:e([]),register:(t,e)=>{const i=e||t;u.customTypes.find(e=>e.name===t)||u.customTypes.push({name:t,typeName:i})}};t.register("TagsInput",t=>{t.state=e({tags:[]}),t.addEventListener("bind",e=>{t.state.tags=Array.isArray(e.detail)?e.detail:[]}),Object.defineProperty(t,"value",{get:()=>t.state.tags,set:e=>{t.state.tags=Array.isArray(e)?e:[]}})},i.makeDom(`\n
\n \n \n
\n`),i.makeDom("")),u.register("TagsInput"),t.register("DatePicker",t=>{t.state=e({start:"",end:""}),t.addEventListener("bind",e=>{var i,a,s;t.state.start=e.detail||"";const n=t.closest("AutoForm"),l=t.getAttribute("name"),o=null==(a=null==(i=null==n?void 0:n.state)?void 0:i.schema)?void 0:a.find(t=>t.name===l),r=(null==(s=null==o?void 0:o.setting)?void 0:s.rangeEnd)||t.rangeEnd;n&&r&&(t.state.end=n.data[r]||"")}),Object.defineProperty(t,"isRange",{get:()=>{var e,i,a;const s=t.closest("AutoForm"),n=t.getAttribute("name"),l=null==(i=null==(e=null==s?void 0:s.state)?void 0:e.schema)?void 0:i.find(t=>t.name===n);return!(!(null==(a=null==l?void 0:l.setting)?void 0:a.rangeEnd)&&!t.rangeEnd)}}),Object.defineProperty(t,"value",{get:()=>t.state.start,set:e=>{t.state.start=e||""}}),t.updateStart=e=>{t.state.start=e,t.dispatchEvent(new CustomEvent("change",{bubbles:!0,detail:e}))},t.updateEnd=e=>{var i,a,s;t.state.end=e;const n=t.closest("AutoForm"),l=t.getAttribute("name"),o=null==(a=null==(i=null==n?void 0:n.state)?void 0:i.schema)?void 0:a.find(t=>t.name===l),r=(null==(s=null==o?void 0:o.setting)?void 0:s.rangeEnd)||t.rangeEnd;n&&r&&(n.data[r]=e)}},i.makeDom('\n
\n \n \n
\n')),t.register("ColorPicker",t=>{t.state=e({value:"#000000"}),t.addEventListener("bind",e=>{t.state.value=e.detail||"#000000"}),Object.defineProperty(t,"value",{get:()=>t.state.value,set:e=>{t.state.value=e||"#000000"}}),t.updateValue=e=>{t.state.value=e,t.dispatchEvent(new CustomEvent("change",{bubbles:!0,detail:e}))}},i.makeDom('\n
\n \n \n
\n'));const p=["alarm","archive","arrow-left","arrow-right","bag","bank","basket","bell","bookmark","box","briefcase","calendar","camera","cart","chat","check","chevron-down","chevron-left","chevron-right","chevron-up","clock","cloud","code","collection","command","cpu","credit-card","cup","dash","database","display","door-closed","download","droplet","earbuds","edit","egg","eject","envelope","eraser","eye","file","filter","flag","folder","gear","gem","gift","graph-up","grid","hammer","hand-thumbs-up","heart","house","image","inbox","info-circle","journal","key","laptop","layers","layout-text-sidebar-reverse","lightbulb","link","list","lock","map","mic","moon","mouse","music-note","newspaper","palette","paperclip","pause","pencil","person","phone","pie-chart","play","plus","printer","puzzle","question-circle","reception-4","record","reply","rss","save","search","send","server","share","shield","shop","shuffle","skip-end","skip-start","slash","sliders","smartphone","speaker","speedometer","spellcheck","square","star","stickies","stop","stopwatch","suit-heart","sun","table","tag","tags","telephone","terminal","text-paragraph","thermometer","three-dots","ticket","tools","trash","trophy","truck","tv","umbrella","unlock","upload","vector-pen","wallet","watch","wifi","window","wrench","x","zoom-in","zoom-out","activity","at","award","backspace","badge-3d","badge-4k","badge-8k","badge-ad","badge-ar","badge-cc","badge-hd","badge-tm","badge-vo","badge-vr","badge-wc","bar-chart","battery","bicycle","binoculars","blockquote-left","blockquote-right","book","bookshelf","bootstrap","border-all","border-bottom","border-center","border-inner","border-left","border-middle","border-outer","border-right","border-style","border-top","border-width","bounding-box","box-arrow-down","box-arrow-in-down","box-arrow-in-left","box-arrow-in-right","box-arrow-in-up","box-arrow-left","box-arrow-right","box-arrow-up","box-seam","brightness-alt-high","brightness-alt-low","brightness-high","brightness-low","broadcast","brush","bucket","bug","building","bullseye","calculator","calendar-check","calendar-date","calendar-day","calendar-event","calendar-minus","calendar-month","calendar-plus","calendar-range","calendar-week","calendar-x","calendar2","calendar3","calendar4","camera-reels","camera-video","capslock","card-checklist","card-heading","card-image","card-list","card-text","caret-down","caret-left","caret-right","caret-up","cart-check","cart-dash","cart-plus","cart-x","cash","cash-stack","cast","chat-dots","chat-left","chat-quote","chat-right","chat-square","chat-text","check-all","check-circle","check-square","circle","clipboard","cloud-arrow-down","cloud-arrow-up","cloud-check","cloud-download","cloud-fog","cloud-hail","cloud-lightning","cloud-minus","cloud-moon","cloud-plus","cloud-rain","cloud-slash","cloud-snow","cloud-sun","cloud-upload","clouds","cloudy","code-slash","code-square","collection-play","columns","columns-gap","compass","cone","cone-striped","controller","credit-card-2-back","credit-card-2-front","crop","cup-straw","cursor","dash-circle","dash-square","diagram-2","diagram-3","diamond","dice-1","dice-2","dice-3","dice-4","dice-5","dice-6","disc","discord","distribute-horizontal","distribute-vertical","door-open","dot","droplet-half","easel","egg-fried","emoji-angry","emoji-dizzy","emoji-expressionless","emoji-frown","emoji-heart-eyes","emoji-laughing","emoji-neutral","emoji-smile","emoji-sunglasses","emoji-wink","envelope-open","exclamation","exclamation-circle","exclamation-diamond","exclamation-octagon","exclamation-square","exclamation-triangle","eye-slash","eyedropper","facebook","file-arrow-down","file-arrow-up","file-binary","file-break","file-check","file-code","file-diff","file-earmark","file-excel","file-image","file-lock","file-medical","file-minus","file-music","file-pdf","file-person","file-play","file-plus","file-post","file-ppt","file-richtext","file-slides","file-spreadsheet","file-text","file-word","file-zip","files","film","filter-circle","filter-left","filter-right","filter-square","fingerprint","flower1","flower2","flower3","folder-check","folder-minus","folder-plus","folder-symlink","folder-x","folder2-open","fonts","forward","front","fullscreen","fullscreen-exit","funnel","gear-wide","gender-female","gender-male","gender-trans","geo","geo-alt","github","globe","google","graph-down","grid-1x2","grid-3x2","grid-3x3","grip-horizontal","grip-vertical","hand-index","hand-thumbs-down","handbag","hash","headphones","headset","heart-half","heptagon","hourglass","hourglass-bottom","hourglass-split","hourglass-top","house-door","hr","hurricane","image-alt","images","infinity","input-cursor","instagram","intersect","journal-album","journal-arrow-down","journal-arrow-up","journal-bookmark","journal-check","journal-code","journal-medical","journal-minus","journal-plus","journal-richtext","journal-text","journal-x","journals","justify","kanban","keyboard","ladder","lamp","layers-half","layout-sidebar","layout-split","layout-three-columns","life-preserver","lightbulb-off","lightning","lightning-charge","link-45deg","linkedin","list-check","list-nested","list-ol","list-stars","list-task","list-ul","mailbox","markdown","mask","mastodon","megaphone","menu-app","menu-button","messenger","mic-mute","minecart","minecart-loaded","moisture","mouse2","mouse3","music-note-beamed","music-note-list","music-player","node-minus","node-plus","nut","octagon","option","outlet","paint-bucket","patch-check","patch-exclamation","patch-minus","patch-plus","patch-question","pause-btn","pause-circle","peace","pen","pencil-square","pentagon","person-badge","person-bounding-box","person-circle","person-lines-fill","phone-landscape","phone-vibrate","pie-chart-fill","pin","pin-angle","pin-fill","pin-map","pip","play-btn","play-circle","plug","plus-circle","plus-square","power","question","question-diamond","question-square","rainbow","receipt","receipt-cutoff","reception-0","reception-1","reception-2","reception-3","record-btn","record-circle","record2","recycle","reddit","reply-all","router","rulers","safe","save2","sd-card","segmented-nav","shield-check","shield-exclamation","shield-lock","shield-shaded","shield-slash","shift","signpost","signpost-2","signpost-split","sim","skip-backward","skip-forward","slack","slash-circle","slash-square","smartwatch","snow","snow2","snow3","sort-alpha-down","sort-alpha-up","sort-numeric-down","sort-numeric-up","soundwave","speedometer2","square-half","stack","star-half","stars","stop-btn","stop-circle","suit-club","suit-diamond","suit-spade","sunglasses","sunrise","sunset","symmetry-horizontal","symmetry-vertical","tablet","tablet-landscape","telegram","telephone-forward","telephone-inbound","telephone-outbound","telephone-plus","telephone-x","text-center","text-indent-left","text-indent-right","text-left","text-right","thermometer-half","thermometer-high","thermometer-low","thermometer-snow","thermometer-sun","three-dots-vertical","toggle-off","toggle-on","toggle2-off","toggle2-on","tornado","translate","trash2","tree","truck-flatbed","tsunami","type","type-bold","type-h1","type-h2","type-h3","type-italic","type-strikethrough","type-underline","ui-checks","ui-checks-grid","ui-radios","ui-radios-grid","union","upc","upc-scan","view-list","view-stacked","vinyl","voicemail","volume-down","volume-mute","volume-off","volume-up","vr","wallet2","water","whatsapp","wifi-1","wifi-2","wifi-off","wind","window-dock","window-sidebar","x-circle","x-diamond","x-octagon","x-square","youtube"];t.register("IconPicker",t=>{t.state=e({value:"",search:"",open:!1}),t.addEventListener("bind",e=>{t.state.value=e.detail||""}),Object.defineProperty(t,"value",{get:()=>t.state.value,set:e=>{t.state.value=e||""}}),Object.defineProperty(t,"filteredIcons",{get:()=>{var e;const i=(null==(e=t.state.search)?void 0:e.toLowerCase())||"";return p.filter(t=>t.includes(i))}}),t.selectIcon=e=>{t.state.value=e,t.state.open=!1,t.dispatchEvent(new CustomEvent("change",{bubbles:!0,detail:e}))},t.toggle=()=>{t.state.open=!t.state.open,t.state.open&&setTimeout(()=>{var e;null==(e=a(t,"input"))||e.focus()},10)};const i=e=>{t.contains(e.target)||(t.state.open=!1)};window.addEventListener("click",i),t.addEventListener("remove",()=>window.removeEventListener("click",i))},i.makeDom('\n
\n \n
\n \n
\n \n
No icons found
\n
\n
\n
\n'),i.makeDom("")),u.register("DatePicker"),u.register("ColorPicker"),u.register("IconPicker");const h=(t={})=>{const e=new Map,a=new Map;let s=1;const n=i.newAvg();let l=0,o=0,r=0,d=null,c=null,m=!1;const u=t.itemHeight||null;return{reset:(t,i)=>{if(m=!1,e.clear(),a.clear(),n.clear(),r=0,d=null,c=null,!(null==t?void 0:t.length))return[];const p=t.length;s=Math.ceil(Math.sqrt(p))||10;const h=window.getComputedStyle(i);l=parseFloat(h.paddingTop)||0,o=parseFloat(h.rowGap)||0;const b=Math.max(10,Math.ceil((i.clientHeight||100)/(u||32)));return t.slice(0,Math.min(3*b,p))},init:(t,i)=>{if(m)return;const l=t.length;let o=u||n.get()||32;l>0&&"object"==typeof t[0]&&null!==t[0]&&t[0]._itemHeight&&(o=t[0]._itemHeight),n.add(o),null===d&&(d=0,c=0);for(let i=0;i{if(0===i.offsetHeight)return;if(null===d){const t=window.getComputedStyle(i);d=parseFloat(t.marginTop)||0,c=parseFloat(t.marginBottom)||0}0!==t||r||(r=d);const l=i.offsetHeight+d+c+o,m=e.get(t);if(l!==m){e.set(t,l),n.add(l);const i=l-(m||0),o=t-t%s;a.has(o)&&a.set(o,a.get(o)+i)}},calc:(t,i)=>{if(!m||!i)return null;const d=i.length,c=Math.max(16,n.get()||32);let u=Math.max(10,Math.ceil((t.clientHeight||100)/c)),p=l+r+o,h=0,b=0,g=0,f=0,v=[];const y=t.scrollTop;let x=0;for(let t=0;t2*d)throw new Error(`VirtualScroll.calc infinite loop detected at i=${t}, status=${b}, size=${d}, groupItemCount=${s}`);if(0===b){const n=a.get(t);if(n&&p+n<=y&&t+s0?o:0)),postHeight:h>0?Math.max(0,h-2*o):0,renderedList:v,listStartIndex:g}}}};t.register("List",t=>{t.mode=t.getAttribute("mode")||"normal",t.fast=t.hasAttribute("fast"),t.collapsible=t.hasAttribute("collapsible");const a=t.fast?t.querySelector(".vs-pad-top"):null,s=t.fast?t.querySelector(".vs-pad-bottom"):null,n={idfield:"id",labelfield:"label",summaryfield:"summary",groupidfield:"id",grouplabelfield:"label",groupsummaryfield:"summary",groupfield:"group",parentfield:"parent",groupicon:"folder",itemicon:"file"};t.collapsed=e({});const l=()=>{i.updateDefaults(t,n);const e=t.state.list||[],a=[];if("group"===t.mode){const i={};e.forEach(e=>{var a;return(i[a=e[t.groupfield]]??(i[a]=[])).push(e)}),(t.state.groups||[]).forEach(e=>{a.push({type:"group",...e});const s=i[e[t.groupidfield]];s&&s.forEach(t=>a.push({type:"item",...t}))})}else if("tree"===t.mode){const i={};e.forEach(e=>{var a;return(i[a=e[t.parentfield]||""]??(i[a]=[])).push(e)});const s=(e,n,l)=>e.forEach(e=>{var o;const r=e[t.idfield],d=!!(null==(o=i[r])?void 0:o.length),c=t.collapsed[r];a.push({type:"item",...e,_level:n,_hasChildren:d,_parents:l}),d&&!c&&s(i[r],n+1,[...l,r])});s(i[""]||[],0,[])}else e.forEach(t=>a.push({type:"item",...t}));t.state._flatList=a};t.state.__watch("list",l);const o=t.fast?h():null;t.state._renderedList=[];let r=!1;t.refresh=()=>{if(t.fast&&!r){r=!0;try{const e=o.calc(t,t.state._flatList);if(e){a&&(a.style.height=`${e.prevHeight}px`),s&&(s.style.height=`${e.postHeight}px`),t.state._listStartIndex!==e.listStartIndex&&(t.state._listStartIndex=e.listStartIndex);const i=t.state._renderedList||[];i.length===e.renderedList.length&&i[0]===e.renderedList[0]&&i[i.length-1]===e.renderedList[e.renderedList.length-1]||(t.state._renderedList=e.renderedList)}}finally{setTimeout(()=>{r=!1},0)}}},t.onItemUpdate=(e,i)=>{t.fast&&o.update(e+(t.state._listStartIndex||0),i)},t.state.__watch("_flatList",e=>{t.fast?(a&&(a.style.height="0px"),s&&(s.style.height="0px"),t.state._listStartIndex=0,t.state._renderedList=o.reset(e,t)||[],setTimeout(()=>{t.state._flatList===e&&o.init(e,t.refresh)})):t.state._renderedList=e}),t.selectItem=(e,i)=>{t.hasAttribute("auto-select")&&(t.state.selectedItem=t.state.selectedItem===e[t.idfield]?null:e[t.idfield]),t.dispatchEvent(new CustomEvent("itemclick",{bubbles:!1,detail:{item:e,index:i+(t.fast&&t.state._listStartIndex||0)}}))},t.selectGroup=(e,i)=>{t.hasAttribute("auto-select-group")&&(t.state.selectedGroup=t.state.selectedGroup===e[t.groupidfield]?null:e[t.groupidfield]),t.dispatchEvent(new CustomEvent("groupclick",{bubbles:!1,detail:{item:e,index:i}}))},t.toggleCollapse=e=>{t.collapsible&&e._hasChildren&&(t.collapsed[e[t.idfield]]=!t.collapsed[e[t.idfield]],l())},l()},i.makeDom('\n
\n\t
\n\t\n\t
\n
\n')),t.register("Nav",t=>{t.vertical=t.hasAttribute("vertical"),t.click=(e,i)=>{e.noselect||i||(n.nav=e.name),t.dispatchEvent(new CustomEvent("nav",{detail:{item:e},bubbles:!1}))}},i.makeDom('\n
\n\t\n\t\n\t\n\t
\n\t\n
\n'));let b=!1,g={},f={};const v={start:(t,{onmousemove:e,onmouseup:i})=>{g={x:t.clientX,y:t.clientY,w:0,h:0},f={onmousemove:e,onmouseup:i},b=!0}};"undefined"!=typeof document&&(document.addEventListener("mouseup",t=>{var e;b&&(b=!1,null==(e=f.onmouseup)||e.call(f,{event:t,...g}))}),document.addEventListener("mousemove",t=>{var e;b&&(g.w=t.clientX-g.x,g.h=t.clientY-g.y,null==(e=f.onmousemove)||e.call(f,{event:t,...g}))})),t.register("Resizer",t=>{t.isVertical=t.hasAttribute("vertical");const e=parseInt(t.getAttribute("min"))||10,i=parseInt(t.getAttribute("max"))||1e3,a=t.target||t.previousElementSibling;t.addEventListener("bind",e=>{void 0!==e.detail&&null!==e.detail&&(a.style[t.isVertical?"height":"width"]=e.detail+"px")});const s=(a,s,n)=>{const l=a+(t.isVertical?n:s);return li?i:l};t.addEventListener("mousedown",e=>{const i=t.isVertical?a.offsetHeight:a.offsetWidth;v.start(e,{onmousemove:({w:e,h:n})=>{const l=s(i,e,n);a.style[t.isVertical?"height":"width"]=l+"px",t.dispatchEvent(new CustomEvent("resizing",{detail:{oldSize:i,newSize:l},bubbles:!1}))},onmouseup:({w:e,h:a})=>{const n=s(i,e,a);t.dispatchEvent(new CustomEvent("resize",{detail:{oldSize:i,newSize:n},bubbles:!1})),t.dispatchEvent(new CustomEvent("change",{detail:n,bubbles:!1}))}})})},i.makeDom("\n
\n")),"undefined"!=typeof window&&window.addEventListener("beforeunload",t=>{s.exitBlocks>0&&t.preventDefault()});const y=document.documentElement;y.hasAttribute("$data-bs-theme")||y.hasAttribute("data-bs-theme")||y.setAttribute("$data-bs-theme","LocalStorage.darkMode?'dark':'light'"),globalThis.HTTP=r,globalThis.UI=c,globalThis.AutoForm=u,globalThis.MouseMover=v,globalThis.VirtualScroll=h;const x={HTTP:r,UI:c,AutoForm:u,MouseMover:v,VirtualScroll:h,State:s,List:h};if("undefined"!=typeof document){globalThis.ApigoBase=x;const t=()=>l(document.documentElement);"loading"!==document.readyState?setTimeout(t,1):document.addEventListener("DOMContentLoaded",()=>setTimeout(t,1),!0)}export{d as APIComponent,u as AutoForm,r as HTTP,v as MouseMover,o as State,c as UI,h as VirtualScroll}; +import{Component as t,NewState as e,Util as i,$ as a,State as s,Hash as n}from"@apigo.cc/state";import{State as l}from"@apigo.cc/state";import"@apigo.cc/bootstrap";const o={get:({url:t,...e})=>o.request({url:t,method:"GET",...e}),post:({url:t,data:e,...i})=>o.request({url:t,method:"POST",data:e,...i}),put:({url:t,data:e,...i})=>o.request({url:t,method:"PUT",data:e,...i}),delete:({url:t,...e})=>o.request({url:t,method:"DELETE",...e}),head:({url:t,...e})=>o.request({url:t,method:"HEAD",...e}),request:async({url:t,method:e="POST",data:i,headers:a={},responseType:s,timeout:n=1e4})=>{var l;const o={method:e=e.toUpperCase(),signal:null==(l=AbortSignal.timeout)?void 0:l.call(AbortSignal,n)};if(void 0!==i&&"GET"!==e&&"HEAD"!==e){if(i instanceof HTMLFormElement&&(i=new FormData(i)),i&&"object"==typeof i&&!(i instanceof FormData)&&!(i instanceof ArrayBuffer||ArrayBuffer.isView(i))&&Object.values(i).some(t=>t instanceof File||t instanceof Blob||t instanceof FileList||Array.isArray(t)&&t.some(t=>t instanceof File||t instanceof Blob))){const t=new FormData;for(const[e,a]of Object.entries(i))a instanceof FileList||Array.isArray(a)?Array.from(a).forEach(i=>t.append(e,i)):null!=a&&t.append(e,a);i=t}i instanceof FormData?delete a["Content-Type"]:"string"==typeof i||i instanceof ArrayBuffer||ArrayBuffer.isView(i)||(i=JSON.stringify(i),a["Content-Type"]||(a["Content-Type"]="application/json")),o.body=i}Object.keys(a).length&&(o.headers=a);const r={error:null,ok:null,status:0,headers:{},responseType:"",result:null};try{const e=await fetch(t,o);if(Object.assign(r,{ok:e.ok,status:e.status,headers:Object.fromEntries(e.headers.entries())}),!s){const t=e.headers.get("Content-Type")||"";s=t.includes("application/json")?"json":/image|video|audio|pdf|zip|octet-stream/.test(t)?"binary":"text",r.responseType=s}!1===r.ok&&(r.error=(r.statusText||"HTTP "+r.status+" error")+" for "+t),r.result="json"===s?await e.json():"binary"===s?await e.arrayBuffer():await e.text()}catch(t){Object.assign(r,{error:t.message||String(t),ok:!1})}return r}},r=t.register("API",t=>{t.request=e({url:"",method:"GET",headers:{},data:null,timeout:1e4,responseType:""}),t.response=e({loading:!1,ok:null,status:null,error:null,headers:{},responseType:"",result:null}),t.result=e(),t.do=(e={})=>new Promise((i,a)=>{const s={...t.request,...e};if(!s.url)throw new Error(".url is required");s.headers={...t.request.headers,...e.headers},t.response.loading=!0,o.request(s).then(e=>{if(Object.keys(e).forEach(i=>{"result"!==i&&(t.response[i]=e[i])}),e.result&&"object"==typeof e.result&&t.result&&"object"==typeof t.result?Object.assign(t.result,e.result):t.result=e.result,t.response.loading=!1,!1===e.ok)throw new Error(e.error);if("object"==typeof e.result&&e.result.error)throw new Error(e.result.error);t.dispatchEvent(new CustomEvent("response",{detail:e,bubbles:!1})),i(e)}).catch(i=>{var s;!e.noui&&(null==(s=globalThis.UI)?void 0:s.toast)&&UI.toast(i.message,{type:"danger"}),t.dispatchEvent(new CustomEvent("error",{detail:i,bubbles:!0})),a(i)})});let i=null;t.request.__watch(null,()=>{t.hasAttribute("auto")&&t.request.url&&(i||(i=Promise.resolve().then(()=>{t.do(),i=null})))})}),d={};t.register("Modal",t=>{t.modal=new bootstrap.Modal(t),t.addEventListener("bind",e=>{e.detail?t.modal.show():t.modal.hide()}),t.addEventListener("hide.bs.modal",()=>{var e;null==(e=document.activeElement)||e.blur(),t.dispatchEvent(new CustomEvent("change",{bubbles:!1,detail:!1}))}),i.copyFunction(t,t.modal,"show","hide")},i.makeDom('\n
\n
\n
\n
\n
\n \n
\n
\n
\n
\n
\n
\n')),t.register("Dialog",t.getSetupFunction("Modal"),i.makeDom('\n
\n
\n
\n \n
\n
\n \n
\n
\n
\n
\n'));let c=0;d.showDialog=function({title:t="",message:e="",buttons:i=["{#Close#}"],type:a="body"}){const s=document.body.appendChild(document.createElement("Dialog"));return s.style.zIndex=2e3+ ++c,Promise.resolve().then(()=>{Object.assign(s.state,{message:e,title:t,type:a,buttons:i}),s.show()}),new Promise(t=>{s.addEventListener("change",e=>{c--,t(s.result||0),s.remove()})})},d.alert=function(t,e={}){return d.showDialog({message:t,...e})},d.confirm=function(t,e={}){return new Promise(i=>d.showDialog({message:t,buttons:["{#Cancel#}","{#Confirm#}"],...e}).then(t=>i(t>=2)).catch(()=>i(!1)))},t.register("Toast",t=>{t.toast=new bootstrap.Toast(t,{autohide:t.state.delay>0}),i.copyFunction(t,t.toast,"show","hide"),t.addEventListener("show.bs.toast",()=>{if(t.state.delay>0){let e;const i=()=>{t.state.left=t.state.delay/1e3,e=setInterval(()=>{(!t.isConnected||--t.state.left<=0)&&clearInterval(e)},1e3)};i(),t.addEventListener("mouseenter",()=>{clearInterval(e),t.state.left=void 0}),t.addEventListener("mouseleave",i)}})},i.makeDom('\n
\n
\n
\n
\n \n \n
\n \n
\n
\n \n
\n
\n
\n'),i.makeDom('
')),d.toast=function(t,e={}){const i=e.delay??5e3,s=document.createElement("Toast");s.state={delay:i,left:i?i/1e3:void 0,type:e.type||"primary",message:t,buttons:e.buttons||[]},a(`[toast-container="${e.container||"default"}"]`).appendChild(s),Promise.resolve().then(()=>s.show())},d.toastConfirm=function(t,e={}){return new Promise(i=>d.toast(t,{buttons:["{#Confirm#}"],...e}).then(t=>i(1===t)).catch(()=>i(!1)))},t.register("AutoForm",t=>{t.state.schema||(t.state.schema=[]);const i=t=>t&&"object"==typeof t&&!t.__isProxy?e(t):t;t.state.__watch("data",e=>t.data=i(e)),t.data=i(t.state.data||{}),t.vertical=t.hasAttribute("vertical"),t.inline=t.hasAttribute("inline"),t.request={method:"POST"},t.response={},t.result=null,t.inline&&(s.__watch("editingData",e=>{t.data=e}),s.__watch("editingSchema",e=>{t.state.schema=e})),t.form=a(t,"form"),t.submit=(e={})=>{var i,a;if(!t.form.reportValidity())return null==(a=null==(i=globalThis.UI)?void 0:i.toast)?void 0:a.call(i,"{#verify failed#}",{type:"danger"});if(!t.dispatchEvent(new CustomEvent("submit",{detail:t.data,cancelable:!0,bubbles:!1})))return;const s={...t.request,data:t.data,noui:!0,...e};let n=null;if(t.api)n=t.api.do(s);else{if(!t.request.url)return console.warn("{#please config .api or .request.url to auto submit#}");n=o.request(s)}n.then(e=>{if(t.response=e,t.result=e.result,"object"==typeof e.result&&e.result.error)throw new Error(e.result.error);t.dispatchEvent(new CustomEvent("response",{detail:e,bubbles:!1}))}).catch(e=>{var i;(null==(i=globalThis.UI)?void 0:i.toast)&&UI.toast(e.message,{type:"danger"}),t.dispatchEvent(new CustomEvent("error",{detail:e,bubbles:!0}))})}},i.makeDom('\n
\n
\n \n \n
\n
\n'),i.makeDom(""));const m={customTypes:[],register:(t,e)=>{const i=e||t;m.customTypes.find(e=>e.name===t)||m.customTypes.push({name:t,typeName:i})}};t.register("TagsInput",t=>{t.state=e({tags:[]}),t.addEventListener("bind",e=>{t.state.tags=Array.isArray(e.detail)?e.detail:[]}),Object.defineProperty(t,"value",{get:()=>t.state.tags,set:e=>{t.state.tags=Array.isArray(e)?e:[]}})},i.makeDom(`\n
\n \n \n
\n`),i.makeDom("")),m.register("TagsInput"),t.register("DatePicker",t=>{t.state=e({start:"",end:""}),t.addEventListener("bind",e=>{var i,a,s;t.state.start=e.detail||"";const n=t.closest("AutoForm"),l=t.getAttribute("name"),o=null==(a=null==(i=null==n?void 0:n.state)?void 0:i.schema)?void 0:a.find(t=>t.name===l),r=(null==(s=null==o?void 0:o.setting)?void 0:s.rangeEnd)||t.rangeEnd;n&&r&&(t.state.end=n.data[r]||"")}),Object.defineProperty(t,"isRange",{get:()=>{var e,i,a;const s=t.closest("AutoForm"),n=t.getAttribute("name"),l=null==(i=null==(e=null==s?void 0:s.state)?void 0:e.schema)?void 0:i.find(t=>t.name===n);return!(!(null==(a=null==l?void 0:l.setting)?void 0:a.rangeEnd)&&!t.rangeEnd)}}),Object.defineProperty(t,"value",{get:()=>t.state.start,set:e=>{t.state.start=e||""}}),t.updateStart=e=>{t.state.start=e,t.dispatchEvent(new CustomEvent("change",{bubbles:!0,detail:e}))},t.updateEnd=e=>{var i,a,s;t.state.end=e;const n=t.closest("AutoForm"),l=t.getAttribute("name"),o=null==(a=null==(i=null==n?void 0:n.state)?void 0:i.schema)?void 0:a.find(t=>t.name===l),r=(null==(s=null==o?void 0:o.setting)?void 0:s.rangeEnd)||t.rangeEnd;n&&r&&(n.data[r]=e)}},i.makeDom('\n
\n \n \n
\n')),t.register("ColorPicker",t=>{t.state=e({value:"#000000"}),t.addEventListener("bind",e=>{t.state.value=e.detail||"#000000"}),Object.defineProperty(t,"value",{get:()=>t.state.value,set:e=>{t.state.value=e||"#000000"}}),t.updateValue=e=>{t.state.value=e,t.dispatchEvent(new CustomEvent("change",{bubbles:!0,detail:e}))}},i.makeDom('\n
\n \n \n
\n'));const u=["alarm","archive","arrow-left","arrow-right","bag","bank","basket","bell","bookmark","box","briefcase","calendar","camera","cart","chat","check","chevron-down","chevron-left","chevron-right","chevron-up","clock","cloud","code","collection","command","cpu","credit-card","cup","dash","database","display","door-closed","download","droplet","earbuds","edit","egg","eject","envelope","eraser","eye","file","filter","flag","folder","gear","gem","gift","graph-up","grid","hammer","hand-thumbs-up","heart","house","image","inbox","info-circle","journal","key","laptop","layers","layout-text-sidebar-reverse","lightbulb","link","list","lock","map","mic","moon","mouse","music-note","newspaper","palette","paperclip","pause","pencil","person","phone","pie-chart","play","plus","printer","puzzle","question-circle","reception-4","record","reply","rss","save","search","send","server","share","shield","shop","shuffle","skip-end","skip-start","slash","sliders","smartphone","speaker","speedometer","spellcheck","square","star","stickies","stop","stopwatch","suit-heart","sun","table","tag","tags","telephone","terminal","text-paragraph","thermometer","three-dots","ticket","tools","trash","trophy","truck","tv","umbrella","unlock","upload","vector-pen","wallet","watch","wifi","window","wrench","x","zoom-in","zoom-out","activity","at","award","backspace","badge-3d","badge-4k","badge-8k","badge-ad","badge-ar","badge-cc","badge-hd","badge-tm","badge-vo","badge-vr","badge-wc","bar-chart","battery","bicycle","binoculars","blockquote-left","blockquote-right","book","bookshelf","bootstrap","border-all","border-bottom","border-center","border-inner","border-left","border-middle","border-outer","border-right","border-style","border-top","border-width","bounding-box","box-arrow-down","box-arrow-in-down","box-arrow-in-left","box-arrow-in-right","box-arrow-in-up","box-arrow-left","box-arrow-right","box-arrow-up","box-seam","brightness-alt-high","brightness-alt-low","brightness-high","brightness-low","broadcast","brush","bucket","bug","building","bullseye","calculator","calendar-check","calendar-date","calendar-day","calendar-event","calendar-minus","calendar-month","calendar-plus","calendar-range","calendar-week","calendar-x","calendar2","calendar3","calendar4","camera-reels","camera-video","capslock","card-checklist","card-heading","card-image","card-list","card-text","caret-down","caret-left","caret-right","caret-up","cart-check","cart-dash","cart-plus","cart-x","cash","cash-stack","cast","chat-dots","chat-left","chat-quote","chat-right","chat-square","chat-text","check-all","check-circle","check-square","circle","clipboard","cloud-arrow-down","cloud-arrow-up","cloud-check","cloud-download","cloud-fog","cloud-hail","cloud-lightning","cloud-minus","cloud-moon","cloud-plus","cloud-rain","cloud-slash","cloud-snow","cloud-sun","cloud-upload","clouds","cloudy","code-slash","code-square","collection-play","columns","columns-gap","compass","cone","cone-striped","controller","credit-card-2-back","credit-card-2-front","crop","cup-straw","cursor","dash-circle","dash-square","diagram-2","diagram-3","diamond","dice-1","dice-2","dice-3","dice-4","dice-5","dice-6","disc","discord","distribute-horizontal","distribute-vertical","door-open","dot","droplet-half","easel","egg-fried","emoji-angry","emoji-dizzy","emoji-expressionless","emoji-frown","emoji-heart-eyes","emoji-laughing","emoji-neutral","emoji-smile","emoji-sunglasses","emoji-wink","envelope-open","exclamation","exclamation-circle","exclamation-diamond","exclamation-octagon","exclamation-square","exclamation-triangle","eye-slash","eyedropper","facebook","file-arrow-down","file-arrow-up","file-binary","file-break","file-check","file-code","file-diff","file-earmark","file-excel","file-image","file-lock","file-medical","file-minus","file-music","file-pdf","file-person","file-play","file-plus","file-post","file-ppt","file-richtext","file-slides","file-spreadsheet","file-text","file-word","file-zip","files","film","filter-circle","filter-left","filter-right","filter-square","fingerprint","flower1","flower2","flower3","folder-check","folder-minus","folder-plus","folder-symlink","folder-x","folder2-open","fonts","forward","front","fullscreen","fullscreen-exit","funnel","gear-wide","gender-female","gender-male","gender-trans","geo","geo-alt","github","globe","google","graph-down","grid-1x2","grid-3x2","grid-3x3","grip-horizontal","grip-vertical","hand-index","hand-thumbs-down","handbag","hash","headphones","headset","heart-half","heptagon","hourglass","hourglass-bottom","hourglass-split","hourglass-top","house-door","hr","hurricane","image-alt","images","infinity","input-cursor","instagram","intersect","journal-album","journal-arrow-down","journal-arrow-up","journal-bookmark","journal-check","journal-code","journal-medical","journal-minus","journal-plus","journal-richtext","journal-text","journal-x","journals","justify","kanban","keyboard","ladder","lamp","layers-half","layout-sidebar","layout-split","layout-three-columns","life-preserver","lightbulb-off","lightning","lightning-charge","link-45deg","linkedin","list-check","list-nested","list-ol","list-stars","list-task","list-ul","mailbox","markdown","mask","mastodon","megaphone","menu-app","menu-button","messenger","mic-mute","minecart","minecart-loaded","moisture","mouse2","mouse3","music-note-beamed","music-note-list","music-player","node-minus","node-plus","nut","octagon","option","outlet","paint-bucket","patch-check","patch-exclamation","patch-minus","patch-plus","patch-question","pause-btn","pause-circle","peace","pen","pencil-square","pentagon","person-badge","person-bounding-box","person-circle","person-lines-fill","phone-landscape","phone-vibrate","pie-chart-fill","pin","pin-angle","pin-fill","pin-map","pip","play-btn","play-circle","plug","plus-circle","plus-square","power","question","question-diamond","question-square","rainbow","receipt","receipt-cutoff","reception-0","reception-1","reception-2","reception-3","record-btn","record-circle","record2","recycle","reddit","reply-all","router","rulers","safe","save2","sd-card","segmented-nav","shield-check","shield-exclamation","shield-lock","shield-shaded","shield-slash","shift","signpost","signpost-2","signpost-split","sim","skip-backward","skip-forward","slack","slash-circle","slash-square","smartwatch","snow","snow2","snow3","sort-alpha-down","sort-alpha-up","sort-numeric-down","sort-numeric-up","soundwave","speedometer2","square-half","stack","star-half","stars","stop-btn","stop-circle","suit-club","suit-diamond","suit-spade","sunglasses","sunrise","sunset","symmetry-horizontal","symmetry-vertical","tablet","tablet-landscape","telegram","telephone-forward","telephone-inbound","telephone-outbound","telephone-plus","telephone-x","text-center","text-indent-left","text-indent-right","text-left","text-right","thermometer-half","thermometer-high","thermometer-low","thermometer-snow","thermometer-sun","three-dots-vertical","toggle-off","toggle-on","toggle2-off","toggle2-on","tornado","translate","trash2","tree","truck-flatbed","tsunami","type","type-bold","type-h1","type-h2","type-h3","type-italic","type-strikethrough","type-underline","ui-checks","ui-checks-grid","ui-radios","ui-radios-grid","union","upc","upc-scan","view-list","view-stacked","vinyl","voicemail","volume-down","volume-mute","volume-off","volume-up","vr","wallet2","water","whatsapp","wifi-1","wifi-2","wifi-off","wind","window-dock","window-sidebar","x-circle","x-diamond","x-octagon","x-square","youtube"];t.register("IconPicker",t=>{t.state=e({value:"",search:"",open:!1}),t.addEventListener("bind",e=>{t.state.value=e.detail||""}),Object.defineProperty(t,"value",{get:()=>t.state.value,set:e=>{t.state.value=e||""}}),Object.defineProperty(t,"filteredIcons",{get:()=>{var e;const i=(null==(e=t.state.search)?void 0:e.toLowerCase())||"";return u.filter(t=>t.includes(i))}}),t.selectIcon=e=>{t.state.value=e,t.state.open=!1,t.dispatchEvent(new CustomEvent("change",{bubbles:!0,detail:e}))},t.toggle=()=>{t.state.open=!t.state.open,t.state.open&&setTimeout(()=>{var e;null==(e=a(t,"input"))||e.focus()},10)};const i=e=>{t.contains(e.target)||(t.state.open=!1)};window.addEventListener("click",i),t.addEventListener("remove",()=>window.removeEventListener("click",i))},i.makeDom('\n
\n \n
\n \n
\n \n
No icons found
\n
\n
\n
\n'),i.makeDom("")),m.register("DatePicker"),m.register("ColorPicker"),m.register("IconPicker");const p=(t={})=>{const e=new Map,a=new Map;let s=1;const n=i.newAvg();let l=0,o=0,r=0,d=null,c=null,m=!1;const u=t.itemHeight||null;return{reset:(t,i)=>{if(m=!1,e.clear(),a.clear(),n.clear(),r=0,d=null,c=null,!(null==t?void 0:t.length))return[];const p=t.length;s=Math.ceil(Math.sqrt(p))||10;const h=window.getComputedStyle(i);l=parseFloat(h.paddingTop)||0,o=parseFloat(h.rowGap)||0;const b=Math.max(10,Math.ceil((i.clientHeight||100)/(u||32)));return t.slice(0,Math.min(3*b,p))},init:(t,i)=>{if(m)return;const l=t.length;let o=u||n.get()||32;l>0&&"object"==typeof t[0]&&null!==t[0]&&t[0]._itemHeight&&(o=t[0]._itemHeight),n.add(o),null===d&&(d=0,c=0);for(let i=0;i{if(0===i.offsetHeight)return;if(null===d){const t=window.getComputedStyle(i);d=parseFloat(t.marginTop)||0,c=parseFloat(t.marginBottom)||0}0!==t||r||(r=d);const l=i.offsetHeight+d+c+o,m=e.get(t);if(l!==m){e.set(t,l),n.add(l);const i=l-(m||0),o=t-t%s;a.has(o)&&a.set(o,a.get(o)+i)}},calc:(t,i)=>{if(!m||!i)return null;const d=i.length,c=Math.max(16,n.get()||32);let u=Math.max(10,Math.ceil((t.clientHeight||100)/c)),p=l+r+o,h=0,b=0,g=0,f=0,v=[];const y=t.scrollTop;let x=0;for(let t=0;t2*d)throw new Error(`VirtualScroll.calc infinite loop detected at i=${t}, status=${b}, size=${d}, groupItemCount=${s}`);if(0===b){const n=a.get(t);if(n&&p+n<=y&&t+s0?o:0)),postHeight:h>0?Math.max(0,h-2*o):0,renderedList:v,listStartIndex:g}}}};t.register("List",t=>{t.mode=t.getAttribute("mode")||"normal",t.fast=t.hasAttribute("fast"),t.collapsible=t.hasAttribute("collapsible");const a=t.fast?t.querySelector(".vs-pad-top"):null,s=t.fast?t.querySelector(".vs-pad-bottom"):null,n={idfield:"id",labelfield:"label",summaryfield:"summary",groupidfield:"id",grouplabelfield:"label",groupsummaryfield:"summary",groupfield:"group",parentfield:"parent",groupicon:"folder",itemicon:"file"};t.collapsed=e({});const l=()=>{i.updateDefaults(t,n);const e=t.state.list||[],a=[];if("group"===t.mode){const i={};e.forEach(e=>{var a;return(i[a=e[t.groupfield]]??(i[a]=[])).push(e)}),(t.state.groups||[]).forEach(e=>{a.push({type:"group",...e});const s=i[e[t.groupidfield]];s&&s.forEach(t=>a.push({type:"item",...t}))})}else if("tree"===t.mode){const i={};e.forEach(e=>{var a;return(i[a=e[t.parentfield]||""]??(i[a]=[])).push(e)});const s=(e,n,l)=>e.forEach(e=>{var o;const r=e[t.idfield],d=!!(null==(o=i[r])?void 0:o.length),c=t.collapsed[r];a.push({type:"item",...e,_level:n,_hasChildren:d,_parents:l}),d&&!c&&s(i[r],n+1,[...l,r])});s(i[""]||[],0,[])}else e.forEach(t=>a.push({type:"item",...t}));t.state._flatList=a};t.state.__watch("list",l);const o=t.fast?p():null;t.state._renderedList=[];let r=!1;t.refresh=()=>{if(t.fast&&!r){r=!0;try{const e=o.calc(t,t.state._flatList);if(e){a&&(a.style.height=`${e.prevHeight}px`),s&&(s.style.height=`${e.postHeight}px`),t.state._listStartIndex!==e.listStartIndex&&(t.state._listStartIndex=e.listStartIndex);const i=t.state._renderedList||[];i.length===e.renderedList.length&&i[0]===e.renderedList[0]&&i[i.length-1]===e.renderedList[e.renderedList.length-1]||(t.state._renderedList=e.renderedList)}}finally{setTimeout(()=>{r=!1},0)}}},t.onItemUpdate=(e,i)=>{t.fast&&o.update(e+(t.state._listStartIndex||0),i)},t.state.__watch("_flatList",e=>{t.fast?(a&&(a.style.height="0px"),s&&(s.style.height="0px"),t.state._listStartIndex=0,t.state._renderedList=o.reset(e,t)||[],setTimeout(()=>{t.state._flatList===e&&o.init(e,t.refresh)})):t.state._renderedList=e}),t.selectItem=(e,i)=>{t.hasAttribute("auto-select")&&(t.state.selectedItem=t.state.selectedItem===e[t.idfield]?null:e[t.idfield]),t.dispatchEvent(new CustomEvent("itemclick",{bubbles:!1,detail:{item:e,index:i+(t.fast&&t.state._listStartIndex||0)}}))},t.selectGroup=(e,i)=>{t.hasAttribute("auto-select-group")&&(t.state.selectedGroup=t.state.selectedGroup===e[t.groupidfield]?null:e[t.groupidfield]),t.dispatchEvent(new CustomEvent("groupclick",{bubbles:!1,detail:{item:e,index:i}}))},t.toggleCollapse=e=>{t.collapsible&&e._hasChildren&&(t.collapsed[e[t.idfield]]=!t.collapsed[e[t.idfield]],l())},l()},i.makeDom('\n
\n\t
\n\t\n\t
\n
\n')),t.register("Nav",t=>{t.vertical=t.hasAttribute("vertical"),t.click=(e,i)=>{e.noselect||i||(n.nav=e.name),t.dispatchEvent(new CustomEvent("nav",{detail:{item:e},bubbles:!1}))}},i.makeDom('\n
\n\t\n\t\n\t\n\t
\n\t\n
\n'));let h=!1,b={},g={};const f={start:(t,{onmousemove:e,onmouseup:i})=>{b={x:t.clientX,y:t.clientY,w:0,h:0},g={onmousemove:e,onmouseup:i},h=!0}};"undefined"!=typeof document&&(document.addEventListener("mouseup",t=>{var e;h&&(h=!1,null==(e=g.onmouseup)||e.call(g,{event:t,...b}))}),document.addEventListener("mousemove",t=>{var e;h&&(b.w=t.clientX-b.x,b.h=t.clientY-b.y,null==(e=g.onmousemove)||e.call(g,{event:t,...b}))})),t.register("Resizer",t=>{t.isVertical=t.hasAttribute("vertical");const e=parseInt(t.getAttribute("min"))||10,i=parseInt(t.getAttribute("max"))||1e3,a=t.target||t.previousElementSibling;t.addEventListener("bind",e=>{void 0!==e.detail&&null!==e.detail&&(a.style[t.isVertical?"height":"width"]=e.detail+"px")});const s=(a,s,n)=>{const l=a+(t.isVertical?n:s);return li?i:l};t.addEventListener("mousedown",e=>{const i=t.isVertical?a.offsetHeight:a.offsetWidth;f.start(e,{onmousemove:({w:e,h:n})=>{const l=s(i,e,n);a.style[t.isVertical?"height":"width"]=l+"px",t.dispatchEvent(new CustomEvent("resizing",{detail:{oldSize:i,newSize:l},bubbles:!1}))},onmouseup:({w:e,h:a})=>{const n=s(i,e,a);t.dispatchEvent(new CustomEvent("resize",{detail:{oldSize:i,newSize:n},bubbles:!1})),t.dispatchEvent(new CustomEvent("change",{detail:n,bubbles:!1}))}})})},i.makeDom("\n
\n")),"undefined"!=typeof window&&window.addEventListener("beforeunload",t=>{s.exitBlocks>0&&t.preventDefault()});const v=document.documentElement;v.hasAttribute("$data-bs-theme")||v.hasAttribute("data-bs-theme")||v.setAttribute("$data-bs-theme","LocalStorage.darkMode?'dark':'light'"),globalThis.HTTP=o,globalThis.UI=d,globalThis.AutoForm=m,globalThis.MouseMover=f,globalThis.VirtualScroll=p;const y={HTTP:o,UI:d,AutoForm:m,MouseMover:f,VirtualScroll:p,State:s,List:p};"undefined"!=typeof document&&(globalThis.ApigoBase=y);export{r as APIComponent,m as AutoForm,o as HTTP,f as MouseMover,l as State,d as UI,p as VirtualScroll}; diff --git a/dist/base.mjs b/dist/base.mjs index 63a09cf..0461377 100644 --- a/dist/base.mjs +++ b/dist/base.mjs @@ -1,4 +1,4 @@ -import { Component, NewState, Util, $, State, Hash, RefreshState } from "@apigo.cc/state"; +import { Component, NewState, Util, $, State, Hash } from "@apigo.cc/state"; import { State as State2 } from "@apigo.cc/state"; import "@apigo.cc/bootstrap"; const HTTP = { @@ -335,7 +335,7 @@ Component.register("AutoForm", (container) => { ` )); const AutoForm = { - customTypes: NewState([]), + customTypes: [], register: (name, typeName) => { const type = typeName || name; if (!AutoForm.customTypes.find((t) => t.name === name)) { @@ -949,9 +949,6 @@ const ApigoBase = { }; if (typeof document !== "undefined") { globalThis.ApigoBase = ApigoBase; - const doRefresh = () => RefreshState(document.documentElement); - if (document.readyState !== "loading") setTimeout(doRefresh, 1); - else document.addEventListener("DOMContentLoaded", () => setTimeout(doRefresh, 1), true); } export { APIComponent, diff --git a/src/form.js b/src/form.js index 89ca481..488460a 100644 --- a/src/form.js +++ b/src/form.js @@ -116,7 +116,7 @@ Component.register('AutoForm', container => { `)) export const AutoForm = { - customTypes: NewState([]), + customTypes: [], register: (name, typeName) => { const type = typeName || name if (!AutoForm.customTypes.find(t => t.name === name)) { diff --git a/src/index.js b/src/index.js index f2f4cee..8c337d5 100644 --- a/src/index.js +++ b/src/index.js @@ -43,12 +43,7 @@ const ApigoBase = { List: VirtualScroll }; -import { RefreshState } from '@apigo.cc/state' if (typeof document !== 'undefined') { globalThis.ApigoBase = ApigoBase; - - const doRefresh = () => RefreshState(document.documentElement) - if (document.readyState !== 'loading') setTimeout(doRefresh, 1) - else document.addEventListener('DOMContentLoaded', () => setTimeout(doRefresh, 1), true) } diff --git a/test-results/.last-run.json b/test-results/.last-run.json index e3d63ee..cbcc1fb 100644 --- a/test-results/.last-run.json +++ b/test-results/.last-run.json @@ -1,6 +1,4 @@ { - "status": "failed", - "failedTests": [ - "2d2d5df53aa522571f18-1e4cef84b8acc2026271" - ] + "status": "passed", + "failedTests": [] } \ No newline at end of file diff --git a/test-results/atomic_check-Capability-demo-page-atomic-tests-verification/error-context.md b/test-results/atomic_check-Capability-demo-page-atomic-tests-verification/error-context.md deleted file mode 100644 index de6c8f8..0000000 --- a/test-results/atomic_check-Capability-demo-page-atomic-tests-verification/error-context.md +++ /dev/null @@ -1,58 +0,0 @@ -# Instructions - -- Following Playwright test failed. -- Explain why, be concise, respect Playwright best practices. -- Provide a snippet of code with the fix, if possible. - -# Test info - -- Name: atomic_check.spec.js >> Capability demo page atomic tests verification -- Location: test/atomic_check.spec.js:3:1 - -# Error details - -``` -Error: page.evaluate: SyntaxError: Failed to execute 'querySelectorAll' on 'Document': 'p[$text="DemoState.testTitle"]' is not a valid selector. - at getTexts (eval at evaluate (:302:30), :2:49) - at eval (eval at evaluate (:302:30), :5:20) - at UtilityScript.evaluate (:304:16) - at UtilityScript. (:1:44) -``` - -# Page snapshot - -```yaml -- generic [ref=e2]: - - navigation [ref=e4] - - generic [ref=e7]: - - generic [ref=e8]: - - heading "项目概览" [level=2] [ref=e9] - - button " 切换主题" [ref=e11] [cursor=pointer]: - - generic [ref=e12]:  - - text: 切换主题 - - generic [ref=e13]: - - generic [ref=e14]:  - - heading "Apigo Base Mega Demo" [level=1] [ref=e15] - - paragraph [ref=e16]: 点击左侧菜单查看不同组件的能力展示 - - generic [ref=e17]: - - heading "基础底层能力验证 (State Core Capability)" [level=4] [ref=e18] - - generic [ref=e19]: - - generic [ref=e21]: - - generic [ref=e22]: 1. $text & 样式绑定 - - generic [ref=e23]: - - paragraph - - button "切换颜色" [ref=e24] [cursor=pointer] - - generic [ref=e26]: - - generic [ref=e27]: 2. $if 显式模板判断 - - button "切换显示" [ref=e29] [cursor=pointer] - - generic [ref=e31]: - - generic [ref=e32]: 3. $each 循环渲染 - - generic [ref=e33]: - - list - - generic [ref=e35]: - - generic [ref=e36]: 4. $if 嵌套 $each - - button "切换外层" [ref=e38] [cursor=pointer] - - generic [ref=e40]: - - generic [ref=e41]: 5. $each 嵌套 $if (条件渲染列表项) - - button "切换 Item B 显示" [ref=e43] [cursor=pointer] -``` \ No newline at end of file diff --git a/test/deep_dump.spec.js b/test/deep_dump.spec.js new file mode 100644 index 0000000..143848d --- /dev/null +++ b/test/deep_dump.spec.js @@ -0,0 +1,29 @@ +import { test, expect } from '@playwright/test'; + +test('Capability demo page deep DOM dump', async ({ page }) => { + page.on('console', msg => console.log('BROWSER:', msg.text())); + + await page.goto('http://localhost:5173/test/capability.html'); + await page.waitForTimeout(3000); + + const dump = await page.evaluate(() => { + const nav = document.getElementById('mainNav'); + const form = document.getElementById('demoForm'); + return { + nav: { + tagName: nav?.tagName, + childCount: nav?.children.length, + innerHTML: nav?.innerHTML + }, + form: { + tagName: form?.tagName, + childCount: form?.children.length, + innerHTML: form?.innerHTML + } + }; + }); + + console.log('Deep DOM Dump:', JSON.stringify(dump, null, 2)); + + expect(dump.nav.childCount).toBeGreaterThan(0); +}); diff --git a/test/lib/base.js b/test/lib/base.js index eca69e1..4e3e4c4 100644 --- a/test/lib/base.js +++ b/test/lib/base.js @@ -336,7 +336,7 @@ ` )); const AutoForm = { - customTypes: state.NewState([]), + customTypes: [], register: (name, typeName) => { const type = typeName || name; if (!AutoForm.customTypes.find((t) => t.name === name)) { @@ -950,9 +950,6 @@ }; if (typeof document !== "undefined") { globalThis.ApigoBase = ApigoBase; - const doRefresh = () => state.RefreshState(document.documentElement); - if (document.readyState !== "loading") setTimeout(doRefresh, 1); - else document.addEventListener("DOMContentLoaded", () => setTimeout(doRefresh, 1), true); } Object.defineProperty(exports2, "State", { enumerable: true, diff --git a/test/lib/state.js b/test/lib/state.js index 93aa9b6..c2d2c05 100644 --- a/test/lib/state.js +++ b/test/lib/state.js @@ -138,7 +138,7 @@ if (template) { const tplnode = template.content.cloneNode(true); if (tplnode.childNodes.length) { - const rootNode = Array.from(tplnode.childNodes).find((n) => n.nodeType === Node.ELEMENT_NODE); + const rootNode = tplnode.children[0]; if (rootNode) _mergeNode(rootNode, node, scanObj, exists); $$(node, "[slot-id]").forEach((placeholder) => { const slotName = placeholder.getAttribute("slot-id"); @@ -508,7 +508,7 @@ }); node.childNodes && node.childNodes.forEach((child) => _unbindTree(child)); }; - const RefreshState = _scanTree; + const ____RefreshState_Internal_Force_Full_Scan_Only_In_Extreme_Performance_Scenarios = _scanTree; const Util = { clone: window.structuredClone || ((obj) => JSON.parse(JSON.stringify(obj))), base64: (str) => btoa(String.fromCharCode(...new TextEncoder().encode(str))), @@ -603,7 +603,7 @@ Component, $, $$, - RefreshState, + ____RefreshState_Internal_Force_Full_Scan_Only_In_Extreme_Performance_Scenarios, SetTranslator, _scanTree, _unbindTree, @@ -621,6 +621,7 @@ } if (typeof document !== "undefined") { const init = () => { + Component._initPending(); const htmlNode = document.documentElement; if (!htmlNode.hasAttribute("$data-bs-theme") && !htmlNode.hasAttribute("data-bs-theme")) { htmlNode.setAttribute("$data-bs-theme", "LocalStorage.darkMode?'dark':'light'"); @@ -644,10 +645,10 @@ exports2.Hash = Hash; exports2.LocalStorage = LocalStorage; exports2.NewState = NewState; - exports2.RefreshState = RefreshState; exports2.SetTranslator = SetTranslator; exports2.State = State; exports2.Util = Util; + exports2.____RefreshState_Internal_Force_Full_Scan_Only_In_Extreme_Performance_Scenarios = ____RefreshState_Internal_Force_Full_Scan_Only_In_Extreme_Performance_Scenarios; exports2._scanTree = _scanTree; exports2._unbindTree = _unbindTree; Object.defineProperty(exports2, Symbol.toStringTag, { value: "Module" });