From f6adcc73e5cee54346136f1f7fc62b09f10230af Mon Sep 17 00:00:00 2001 From: Jannis Leifeld Date: Wed, 15 Apr 2026 09:25:34 +0200 Subject: [PATCH 1/7] feat(admin-sdk-tutorial): add interactive tutorial prototype --- .orchestrator/architecture-summary.md | 158 +++ .orchestrator/implementation-brief.md | 246 +++++ .orchestrator/implementation-plan.md | 720 ++++++++++++++ .../dist/assets/index-BsO6e4uL.js | 13 + .../dist/assets/index-DRQqKgZ3.css | 1 + packages/admin-sdk-tutorial/dist/favicon.svg | 5 + packages/admin-sdk-tutorial/dist/index.html | 14 + packages/admin-sdk-tutorial/env.d.ts | 1 + packages/admin-sdk-tutorial/index.html | 13 + packages/admin-sdk-tutorial/package.json | 28 + .../admin-sdk-tutorial/public/favicon.svg | 5 + packages/admin-sdk-tutorial/src/App.vue | 111 +++ .../src/components/.gitkeep | 0 .../src/components/CodeEditorPanel.vue | 157 +++ .../src/components/DummyAdminShell.vue | 209 ++++ .../src/components/PreviewPanel.vue | 124 +++ .../src/components/TutorialSidebar.vue | 188 ++++ .../src/components/TutorialWorkspace.vue | 137 +++ .../admin-sdk-tutorial/src/lessons/.gitkeep | 0 .../admin-sdk-tutorial/src/lessons/lessons.ts | 54 ++ packages/admin-sdk-tutorial/src/main.ts | 5 + .../admin-sdk-tutorial/src/runtime/.gitkeep | 0 .../src/runtime/createRuntimeState.ts | 57 ++ .../src/runtime/executeLessonCode.ts | 31 + .../src/runtime/sdkBridge.ts | 71 ++ .../admin-sdk-tutorial/src/types/.gitkeep | 0 .../admin-sdk-tutorial/src/types/lesson.ts | 11 + .../admin-sdk-tutorial/src/types/runtime.ts | 47 + packages/admin-sdk-tutorial/tsconfig.app.json | 11 + packages/admin-sdk-tutorial/tsconfig.json | 11 + .../admin-sdk-tutorial/tsconfig.node.json | 11 + packages/admin-sdk-tutorial/vite.config.ts | 13 + pnpm-lock.yaml | 905 +++++++++++++++--- 33 files changed, 3203 insertions(+), 154 deletions(-) create mode 100644 .orchestrator/architecture-summary.md create mode 100644 .orchestrator/implementation-brief.md create mode 100644 .orchestrator/implementation-plan.md create mode 100644 packages/admin-sdk-tutorial/dist/assets/index-BsO6e4uL.js create mode 100644 packages/admin-sdk-tutorial/dist/assets/index-DRQqKgZ3.css create mode 100644 packages/admin-sdk-tutorial/dist/favicon.svg create mode 100644 packages/admin-sdk-tutorial/dist/index.html create mode 100644 packages/admin-sdk-tutorial/env.d.ts create mode 100644 packages/admin-sdk-tutorial/index.html create mode 100644 packages/admin-sdk-tutorial/package.json create mode 100644 packages/admin-sdk-tutorial/public/favicon.svg create mode 100644 packages/admin-sdk-tutorial/src/App.vue create mode 100644 packages/admin-sdk-tutorial/src/components/.gitkeep create mode 100644 packages/admin-sdk-tutorial/src/components/CodeEditorPanel.vue create mode 100644 packages/admin-sdk-tutorial/src/components/DummyAdminShell.vue create mode 100644 packages/admin-sdk-tutorial/src/components/PreviewPanel.vue create mode 100644 packages/admin-sdk-tutorial/src/components/TutorialSidebar.vue create mode 100644 packages/admin-sdk-tutorial/src/components/TutorialWorkspace.vue create mode 100644 packages/admin-sdk-tutorial/src/lessons/.gitkeep create mode 100644 packages/admin-sdk-tutorial/src/lessons/lessons.ts create mode 100644 packages/admin-sdk-tutorial/src/main.ts create mode 100644 packages/admin-sdk-tutorial/src/runtime/.gitkeep create mode 100644 packages/admin-sdk-tutorial/src/runtime/createRuntimeState.ts create mode 100644 packages/admin-sdk-tutorial/src/runtime/executeLessonCode.ts create mode 100644 packages/admin-sdk-tutorial/src/runtime/sdkBridge.ts create mode 100644 packages/admin-sdk-tutorial/src/types/.gitkeep create mode 100644 packages/admin-sdk-tutorial/src/types/lesson.ts create mode 100644 packages/admin-sdk-tutorial/src/types/runtime.ts create mode 100644 packages/admin-sdk-tutorial/tsconfig.app.json create mode 100644 packages/admin-sdk-tutorial/tsconfig.json create mode 100644 packages/admin-sdk-tutorial/tsconfig.node.json create mode 100644 packages/admin-sdk-tutorial/vite.config.ts diff --git a/.orchestrator/architecture-summary.md b/.orchestrator/architecture-summary.md new file mode 100644 index 000000000..c040593cd --- /dev/null +++ b/.orchestrator/architecture-summary.md @@ -0,0 +1,158 @@ +# Admin SDK Tutorial Prototype — Architecture Summary + +## What we built + +We built a prototype package at `packages/admin-sdk-tutorial` that demonstrates an interactive, browser-based learning flow for the Meteor Admin SDK. + +The prototype includes: + +- a split tutorial layout with lesson content on the left +- an in-browser code editor on the right +- a dummy admin preview shell +- a small mocked Admin SDK bridge +- browser-side code execution for learner input +- three end-to-end lessons: + - notifications + - menu items + - locations / positions + +## Main architecture pieces + +### 1. Tutorial shell + +The app shell lives in `App.vue` and coordinates: + +- active lesson selection +- current editor code +- reset/run state +- runtime state for the preview +- execution feedback for the output panel + +### 2. Lesson model + +Lesson content is currently hardcoded in `src/lessons/lessons.ts` and typed in `src/types/lesson.ts`. + +Each lesson defines: + +- title and summary +- explanatory description +- learning objective +- starter code +- preview/output labels + +### 3. Editor layer + +The editor is intentionally lightweight: + +- `CodeEditorPanel.vue` +- single-file editing (`main.ts` affordance) +- textarea-based input +- reset and run controls + +This keeps the prototype simple while proving the interaction model. + +### 4. Dummy admin runtime + +The preview is rendered through: + +- `PreviewPanel.vue` +- `DummyAdminShell.vue` + +The dummy admin visualizes: + +- notifications +- navigation entries +- extension surfaces / positions + +It is not intended to mirror the real Shopware Administration UI exactly. It is designed to teach concepts with minimal visual noise. + +### 5. Runtime state model + +Preview state is represented as structured runtime data in `src/types/runtime.ts` and initialized through `src/runtime/createRuntimeState.ts`. + +This separates: + +- lesson content +- runtime/UI state +- execution behavior + +### 6. Mock Admin SDK bridge + +`src/runtime/sdkBridge.ts` provides a narrow bridge API for the prototype: + +- `sdk.notification.dispatch(...)` +- `sdk.menu.add(...)` +- `sdk.location.render(...)` + +Instead of talking to a real admin host, these methods mutate the dummy runtime state. + +### 7. Code execution flow + +`src/runtime/executeLessonCode.ts` executes learner code in the browser using a constrained runtime approach. + +The flow is: + +1. reset runtime state for the active lesson +2. execute learner code with access to the mock `sdk` +3. update preview from bridge mutations +4. show success/error feedback in the output panel + +## Why this structure works + +This prototype architecture is useful because it keeps responsibilities separate: + +- lessons define teaching content +- the editor manages learner input +- execution runs user code +- the bridge translates API calls into state changes +- the preview only renders runtime state + +That makes it easier to evolve the prototype without tightly coupling everything together. + +--- + +# What a second pass could look like + +## UX and visual polish + +- make the dummy admin feel more product-like while staying minimal +- improve typography, spacing, and hierarchy +- reduce duplicated information between toast, empty state, and output areas +- improve mobile ergonomics further + +## Editor improvements + +- replace textarea with a richer code editor +- support locked/editable regions +- add inline hints or lesson tasks +- add formatting or syntax highlighting + +## Better execution model + +- move from naive `Function(...)` execution to a safer constrained execution layer +- support more structured lesson scaffolds +- capture richer runtime diagnostics + +## Stronger lesson system + +- add validation rules per lesson +- define expected outcomes instead of only freeform execution +- move lesson content into markdown/MDX or another authoring format + +## More realistic SDK teaching + +- expand the bridge with more Admin SDK APIs +- add more realistic host events and state transitions +- simulate communication patterns more explicitly + +## Better preview fidelity + +- represent locations and positions with more accurate conceptual models +- add clearer UI states for registered menu items and notifications +- introduce optional “host frame vs extension frame” visualization if needed + +## Productization path + +- decide whether this should remain a package app or move into a dedicated docs/tutorial surface +- define how the tutorial would integrate with Admin SDK documentation +- add analytics/progress only if the concept is validated first diff --git a/.orchestrator/implementation-brief.md b/.orchestrator/implementation-brief.md new file mode 100644 index 000000000..0ffc22018 --- /dev/null +++ b/.orchestrator/implementation-brief.md @@ -0,0 +1,246 @@ +# Interactive Admin SDK Tutorial Prototype — Implementation Brief + +## Goal + +Build a first interactive prototype for learning the Meteor Admin SDK inside this monorepo. + +The prototype should: + +- be inspired by the Solid tutorial split layout +- not depend on TutorialKit or StackBlitz +- run entirely in the browser +- let the user edit code live +- execute that code against a minimal dummy admin runtime +- focus on understanding Admin SDK concepts, not replicating the full Shopware Administration UI + +## Confirmed Direction + +- **Deliverable:** clickable UI prototype +- **Monorepo placement preference:** additional package/app in the repo +- **Coding experience:** real editable code running in-browser +- **Initial lesson topics:** notifications, menu items, locations/positions +- **Layout direction:** Solid-like split layout +- **Dummy admin fidelity:** minimal wireframe / lightweight UI +- **Process:** implementation brief first, then approval before coding + +## Product Intent + +The user should learn Admin SDK concepts by writing code directly in the browser and immediately seeing how the dummy admin reacts. + +The dummy admin should be deliberately minimal. It only needs enough UI and behavior so learners understand concepts like: + +- triggering notifications +- adding navigation or menu items +- rendering content into locations / positions + +For locations and position IDs, a simplified visualization is sufficient, e.g. cards with clearly labeled iframe-like surfaces. + +## Monorepo Placement + +The user explicitly chose: + +`packages/admin-sdk-tutorial` + +Even though `examples/` would also fit a prototype app, all implementation work should now assume the tutorial lives under `packages/`. + +## Suggested Stack + +- Vue 3 +- Vite +- TypeScript +- optional reuse of `@shopware-ag/meteor-component-library` for selected UI pieces +- reuse/reference of `@shopware-ag/meteor-admin-sdk` where helpful, but mock runtime behavior locally for the prototype + +## Prototype Scope + +This first prototype should prove the overall learning experience, not solve the full long-term platform. + +### Included + +- split-screen tutorial shell +- lesson/navigation panel on the left +- in-browser code editor on the right +- live preview area on the right +- minimal dummy admin runtime +- mocked Admin SDK behavior for the first concepts +- three prototype lessons/steps + +### Excluded for now + +- full production authoring system +- persistent learner progress +- backend services or storage +- full Shopware Administration embedding +- full Admin SDK API coverage +- general-purpose WebContainer-like project sandbox +- production-grade assessment engine + +## Proposed UX Structure + +## Layout + +- **Left column** + - lesson title + - explanation/content + - step navigation + - hints / expected outcome +- **Right column** + - editor tabs or a compact single-file editor + - live preview of the dummy admin + - optional output/console panel + +## Lessons for the Prototype + +### 1. Notifications + +Learner writes code that triggers a notification. + +Preview behavior: + +- display a toast/message area in the dummy admin +- show notification type and text clearly + +### 2. Menu items + +Learner writes code that adds a menu item. + +Preview behavior: + +- update a fake navigation/sidebar area +- make the new item visible and understandable immediately + +### 3. Locations / positions + +Learner writes code that targets extension surfaces. + +Preview behavior: + +- show simplified location containers +- use cards/panels with labeled slots +- visually communicate which content lands in which location/position + +## Proposed Technical Architecture + +### 1. Tutorial Shell + +A dedicated app that renders: + +- lesson content +- active step metadata +- editor state +- preview state + +For the prototype, lesson content can be hardcoded in TypeScript/JSON rather than introducing a full content pipeline. + +### 2. Editor Layer + +For the prototype, keep the editing model intentionally small: + +- preferably a single editable file per lesson (e.g. `main.ts` or `lesson.ts`) +- support reset to initial state +- optionally support small locked/unlocked regions later + +### 3. Execution / Sandbox Layer + +Run learner code entirely in the browser. + +Recommended approach for the prototype: + +- sandbox the preview in an iframe +- inject a controlled runtime/mock bridge +- execute only the code needed for the lesson environment + +Avoid building a fully generic multi-file browser IDE at this stage. + +### 4. Dummy Admin Runtime + +Build a minimal fake admin shell that exposes only the UI surfaces needed by the lessons. + +Suggested UI primitives: + +- sidebar / navigation list +- header or toolbar area +- notification area +- content cards/panels +- labeled extension slots / pseudo-iframes + +The visual language should remain lightweight and instructional, not a copy of the real Shopware UI. + +### 5. Mock Admin SDK Bridge + +Provide a thin compatibility layer so learner code can call familiar APIs while the prototype runtime translates those calls into dummy admin UI updates. + +Core initial behaviors: + +- create/show notifications +- register/add menu items +- register/render content into named locations/positions + +## Architectural Principles + +- optimize for teaching clarity over visual realism +- keep the runtime deterministic and easy to inspect +- prefer a constrained lesson environment over a generic platform +- keep lessons small and focused +- make the relation between learner code and UI result obvious + +## Key Open Decisions / Risks + +### 1. Placement: `examples/` vs `packages/` + +The current repo structure suggests `examples/` is the best fit for a prototype app, even though the initial idea mentioned an additional package. + +### 2. Fidelity of the mock SDK + +We need to decide how closely the prototype runtime should mirror the real Admin SDK. + +Recommendation: + +- keep it minimal for now +- stay semantically close where easy +- avoid early overinvestment in API parity + +### 3. Editor scope + +Single-file editing is the fastest way to validate the tutorial concept. + +Recommendation: + +- start with single-file editing +- add multi-file support only if it becomes necessary for lesson clarity + +### 4. Browser execution complexity + +A fully general code execution environment can become expensive quickly. + +Recommendation: + +- use a narrowly scoped execution model for prototype lessons +- do not emulate a full project sandbox yet + +## Recommended Build Plan + +1. create the prototype app in the monorepo +2. implement the split tutorial shell +3. add a minimal browser editor +4. add sandboxed preview execution +5. build the dummy admin shell +6. implement mock Admin SDK actions for notifications, menu items, and locations/positions +7. create three prototype lessons +8. polish interaction and visual clarity + +## Working Assumptions for Subagents + +- This is a **prototype**, not a production tutorial system. +- The UI should be **minimal and instructional**. +- The result should feel close to the **Solid tutorial interaction model**. +- The learner must be able to **edit code directly in the browser**. +- Everything should happen **client-side in the browser**. +- Avoid introducing dependencies on StackBlitz/TutorialKit/WebContainer-style infrastructure. +- Prefer the existing monorepo conventions and lightweight reuse over building a large new framework. + +## Confirmed Package Target + +Proceed with implementation in: + +`packages/admin-sdk-tutorial` diff --git a/.orchestrator/implementation-plan.md b/.orchestrator/implementation-plan.md new file mode 100644 index 000000000..8acc75b71 --- /dev/null +++ b/.orchestrator/implementation-plan.md @@ -0,0 +1,720 @@ +# Interactive Admin SDK Tutorial Prototype — Implementation Plan + +## Plan Context + +- The prototype must live under `packages/` +- Recommended target package: `packages/admin-sdk-tutorial` +- The work is intentionally split into very small executable tasks +- Each task should be scoped to roughly **5 minutes or less** +- This plan is optimized for delegation to subagents + +## Execution Rules + +- Complete tasks in order unless explicitly marked parallelizable +- Keep each task narrowly scoped +- Prefer visible progress over early abstraction +- Do not expand scope beyond the prototype goals in `implementation-brief.md` + +--- + +## Phase 1 — Package Setup + +### 1.1 Create package folder structure +- Create `packages/admin-sdk-tutorial` +- Create initial `src/` folder +- Create placeholder folders for `components/`, `lessons/`, `runtime/`, and `types/` + +### 1.2 Add package manifest +- Create `packages/admin-sdk-tutorial/package.json` +- Set package name +- Mark package as private if appropriate for prototype stage +- Add initial scripts (`dev`, `build`, `preview`, `typecheck`) + +### 1.3 Add TypeScript config +- Create local `tsconfig.json` +- Align with repo conventions where possible + +### 1.4 Add Vite config +- Create `vite.config.ts` +- Enable Vue support + +### 1.5 Add app HTML entry +- Create `index.html` +- Add root mount element + +### 1.6 Add source entrypoint +- Create `src/main.ts` +- Mount the root Vue app + +### 1.7 Add root app component +- Create `src/App.vue` +- Render simple placeholder text to confirm bootstrapping + +### 1.8 Register workspace dependencies +- Add initial dependencies and devDependencies +- Use workspace references where needed + +### 1.9 Ensure package is included by workspace conventions +- Verify no extra workspace configuration is required +- Confirm package path matches monorepo patterns + +--- + +## Phase 2 — Prototype Shell + +### 2.1 Replace placeholder with split layout shell +- Create left and right column layout in `App.vue` +- Add semantic container sections + +### 2.2 Add base shell styling +- Add initial layout CSS +- Ensure full-height app shell works + +### 2.3 Create lesson sidebar component +- Add `src/components/TutorialSidebar.vue` +- Render title, description, and step list placeholders + +### 2.4 Create workspace panel component +- Add `src/components/TutorialWorkspace.vue` +- Render editor and preview placeholders + +### 2.5 Wire shell components into root app +- Replace inline layout with reusable components + +### 2.6 Add mobile-safe fallback layout behavior +- Add basic responsive stacking behavior +- Do not over-polish yet + +--- + +## Phase 3 — Lesson Data Model + +### 3.1 Create lesson type definitions +- Add `src/types/lesson.ts` +- Define minimal lesson and step interfaces + +### 3.2 Create prototype lesson data file +- Add `src/lessons/lessons.ts` +- Seed three lessons: notifications, menu items, locations/positions + +### 3.3 Add active lesson state in app shell +- Store selected lesson/step in root state + +### 3.4 Render lesson metadata in sidebar +- Show active title, summary, and step list + +### 3.5 Add lesson switching behavior +- Enable click-to-select lesson/step + +### 3.6 Add reset-on-lesson-change behavior +- Reset editor/preview state when changing lessons + +--- + +## Phase 4 — Editor Prototype + +### 4.1 Create editor component shell +- Add `src/components/CodeEditorPanel.vue` +- Render labeled editor area placeholder + +### 4.2 Add editable text area as first editor +- Use a textarea-based implementation first +- Do not introduce a heavy editor dependency yet + +### 4.3 Bind editor to lesson starter code +- Load starter code for active lesson + +### 4.4 Add local editor state updates +- Keep current code reactive + +### 4.5 Add reset button +- Reset editor content back to lesson starter code + +### 4.6 Add basic file/tab affordance +- Show a single file name like `main.ts` +- Keep actual editing single-file only + +--- + +## Phase 5 — Preview Shell + +### 5.1 Create preview container component +- Add `src/components/PreviewPanel.vue` +- Render preview header and placeholder body + +### 5.2 Add dummy admin shell component +- Add `src/components/DummyAdminShell.vue` +- Render simple nav, content area, and notification region + +### 5.3 Add preview composition +- Mount dummy admin shell inside preview panel + +### 5.4 Add output/status area +- Render a small status or output region below preview + +### 5.5 Add empty-state messaging +- Show friendly message before first successful run if needed + +--- + +## Phase 6 — Runtime State Model + +### 6.1 Create runtime type definitions +- Add `src/types/runtime.ts` +- Define notification, menu item, and location state types + +### 6.2 Create runtime state factory +- Add `src/runtime/createRuntimeState.ts` +- Return initial empty runtime state + +### 6.3 Add runtime state to root app +- Store active preview/runtime state at app level + +### 6.4 Pass runtime state into preview shell +- Bind reactive runtime state into dummy admin UI + +### 6.5 Add runtime reset helper +- Reset runtime to lesson defaults before each run + +--- + +## Phase 7 — Mock Admin SDK Bridge + +### 7.1 Create bridge module skeleton +- Add `src/runtime/sdkBridge.ts` +- Export minimal bridge factory + +### 7.2 Add notification API surface +- Implement method(s) for creating notifications + +### 7.3 Add menu item API surface +- Implement method(s) for registering menu items + +### 7.4 Add location registration API surface +- Implement method(s) for registering location content + +### 7.5 Connect bridge methods to runtime state +- Ensure bridge mutates preview state deterministically + +### 7.6 Add bridge reset behavior +- Ensure each execution starts cleanly + +--- + +## Phase 8 — In-Browser Execution + +### 8.1 Create execution module skeleton +- Add `src/runtime/executeLessonCode.ts` +- Define a narrow execution entrypoint + +### 8.2 Define execution input contract +- Pass current code and bridge/runtime context into executor + +### 8.3 Implement first naive evaluation flow +- Use a constrained prototype approach suitable for the current lesson code shape + +### 8.4 Capture runtime errors +- Return execution errors instead of crashing the app + +### 8.5 Trigger execution from UI +- Add a Run button or initial autorun behavior + +### 8.6 Reset runtime before execution +- Ensure each run starts from fresh lesson state + +### 8.7 Surface errors in output panel +- Show readable execution error messages + +--- + +## Phase 9 — Notifications Lesson + +### 9.1 Add notification lesson starter code +- Seed realistic starter code for notification concept + +### 9.2 Add notification lesson text +- Explain the concept and expected result + +### 9.3 Render notifications in dummy admin +- Show toast/message items in preview + +### 9.4 Verify notification code path +- Ensure starter code produces visible result + +### 9.5 Refine notification visuals +- Make the result easy to understand at a glance + +--- + +## Phase 10 — Menu Items Lesson + +### 10.1 Add menu item lesson starter code +- Seed realistic starter code for menu registration + +### 10.2 Add menu item lesson text +- Explain what the learner should observe + +### 10.3 Render menu items in dummy sidebar +- Show registered menu items in navigation area + +### 10.4 Verify menu registration code path +- Ensure the preview updates correctly + +### 10.5 Refine menu visuals +- Make added items visually distinct from static shell UI + +--- + +## Phase 11 — Locations / Positions Lesson + +### 11.1 Add locations lesson starter code +- Seed starter code for location/position behavior + +### 11.2 Add locations lesson text +- Explain named slots and why they matter + +### 11.3 Add labeled location containers to dummy admin +- Render two or more clear extension surfaces + +### 11.4 Render registered location content +- Show learner-defined content inside the correct surface + +### 11.5 Verify positions concept visually +- Make placement obvious without copying full Shopware UI + +### 11.6 Refine location card visuals +- Improve labels and boundaries for comprehension + +--- + +## Phase 12 — UX Polish + +### 12.1 Add lesson progress affordance +- Show current lesson/step state clearly + +### 12.2 Improve shell spacing and typography +- Make the tutorial easier to scan + +### 12.3 Improve button labels and helper text +- Reduce ambiguity in controls + +### 12.4 Improve preview empty/error states +- Make failure and reset flows understandable + +### 12.5 Add minimal branding alignment +- Keep visuals lightweight and consistent with repo context + +--- + +## Phase 13 — Verification + +### 13.1 Start dev app and verify boot +- Confirm the package runs locally + +### 13.2 Verify lesson switching +- Confirm editor and preview state update correctly + +### 13.3 Verify notifications lesson manually +- Confirm learner edits affect preview + +### 13.4 Verify menu items lesson manually +- Confirm learner edits affect preview + +### 13.5 Verify locations lesson manually +- Confirm learner edits affect preview + +### 13.6 Verify responsive layout manually +- Check desktop and narrow viewport behavior + +### 13.7 Fix any obvious prototype regressions +- Resolve blocking issues only + +--- + +## Optional Follow-Up Tasks + +These are intentionally out of current scope, but may be scheduled later. + +### O.1 Replace textarea with richer code editor +### O.2 Add locked/editable code regions +### O.3 Add inline task validation +### O.4 Move lesson content to markdown/MDX-like source +### O.5 Add browser-based visual review pass +### O.6 Expand supported Admin SDK concepts + +--- + +## Suggested First Delegation Batch + +If subagents are used, a good first sequence is: + +1. Phase 1 — Package Setup +2. Phase 2 — Prototype Shell +3. Phase 3 — Lesson Data Model +4. Phase 4 — Editor Prototype +5. Phase 5 — Preview Shell + +Then continue with runtime and lesson behavior. + +--- + +## Delegation Batches + +The tasks above are intentionally tiny. For actual execution, they should be grouped into small delegation batches that still preserve fast feedback and low merge risk. + +Each batch below is designed to be: + +- coherent enough for a subagent to complete independently +- small enough to review quickly +- low-risk to integrate before the next batch starts + +## Batch A — Scaffold the package + +### Goal +Create a bootable package under `packages/admin-sdk-tutorial` that renders a placeholder Vue app. + +### Includes +- 1.1 Create package folder structure +- 1.2 Add package manifest +- 1.3 Add TypeScript config +- 1.4 Add Vite config +- 1.5 Add app HTML entry +- 1.6 Add source entrypoint +- 1.7 Add root app component +- 1.8 Register workspace dependencies +- 1.9 Ensure package is included by workspace conventions + +### Suggested agent type +- `general` or direct implementation by parent session + +### Expected output +- package exists +- app boots locally +- placeholder UI renders + +### Validation +- install/build tooling resolves +- dev server starts +- root component mounts successfully + +## Batch B — Build the split tutorial shell + +### Goal +Establish the Solid-inspired split-screen experience with a stable left/right layout. + +### Includes +- 2.1 Replace placeholder with split layout shell +- 2.2 Add base shell styling +- 2.3 Create lesson sidebar component +- 2.4 Create workspace panel component +- 2.5 Wire shell components into root app +- 2.6 Add mobile-safe fallback layout behavior + +### Suggested agent type +- `general` + +### Expected output +- tutorial shell exists +- left panel shows lesson area placeholder +- right panel shows workspace area placeholder +- narrow viewport stacks acceptably + +### Validation +- desktop layout reads clearly +- responsive fallback does not break app shell + +## Batch C — Add lesson data and navigation + +### Goal +Make the shell data-driven with three prototype lessons and clickable switching. + +### Includes +- 3.1 Create lesson type definitions +- 3.2 Create prototype lesson data file +- 3.3 Add active lesson state in app shell +- 3.4 Render lesson metadata in sidebar +- 3.5 Add lesson switching behavior +- 3.6 Add reset-on-lesson-change behavior + +### Suggested agent type +- `general` + +### Expected output +- three lessons exist in structured data +- lesson list renders in sidebar +- active lesson can be changed +- shell state resets when lesson changes + +### Validation +- lesson titles and descriptions render correctly +- switching updates the active view without stale state + +## Batch D — Add the first editor experience + +### Goal +Give the learner a simple but working in-browser editing area. + +### Includes +- 4.1 Create editor component shell +- 4.2 Add editable text area as first editor +- 4.3 Bind editor to lesson starter code +- 4.4 Add local editor state updates +- 4.5 Add reset button +- 4.6 Add basic file/tab affordance + +### Suggested agent type +- `general` + +### Expected output +- active lesson starter code loads in editor +- learner can edit code +- reset restores starter content +- UI looks like a lightweight single-file editor + +### Validation +- edits are reactive +- lesson change reloads correct starter code +- reset behaves deterministically + +## Batch E — Add preview shell and dummy admin skeleton + +### Goal +Create the visual target area where Admin SDK behavior will appear. + +### Includes +- 5.1 Create preview container component +- 5.2 Add dummy admin shell component +- 5.3 Add preview composition +- 5.4 Add output/status area +- 5.5 Add empty-state messaging + +### Suggested agent type +- `general` + +### Expected output +- preview area is visible +- dummy admin shell renders with nav/content/notification regions +- output panel exists for status/errors + +### Validation +- shell is visually understandable without any execution yet +- preview and output areas remain stable during lesson switching + +## Batch F — Add runtime state plumbing + +### Goal +Introduce deterministic preview state that the mock SDK bridge can mutate. + +### Includes +- 6.1 Create runtime type definitions +- 6.2 Create runtime state factory +- 6.3 Add runtime state to root app +- 6.4 Pass runtime state into preview shell +- 6.5 Add runtime reset helper + +### Suggested agent type +- `general` + +### Expected output +- runtime state model exists +- preview consumes runtime state reactively +- runtime can be reset cleanly + +### Validation +- reset returns preview to baseline state +- no lesson data is hardcoded into preview rendering paths + +## Batch G — Implement the mock Admin SDK bridge + +### Goal +Create a narrow bridge API that converts learner actions into dummy admin state changes. + +### Includes +- 7.1 Create bridge module skeleton +- 7.2 Add notification API surface +- 7.3 Add menu item API surface +- 7.4 Add location registration API surface +- 7.5 Connect bridge methods to runtime state +- 7.6 Add bridge reset behavior + +### Suggested agent type +- `general` + +### Expected output +- bridge exposes minimal APIs for all three concepts +- bridge updates runtime state deterministically + +### Validation +- isolated smoke calls update runtime state as expected +- reset clears all prior bridge effects + +## Batch H — Add code execution flow + +### Goal +Execute learner code in-browser and connect it to the mock bridge. + +### Includes +- 8.1 Create execution module skeleton +- 8.2 Define execution input contract +- 8.3 Implement first naive evaluation flow +- 8.4 Capture runtime errors +- 8.5 Trigger execution from UI +- 8.6 Reset runtime before execution +- 8.7 Surface errors in output panel + +### Suggested agent type +- `general` + +### Expected output +- learner code can run from the UI +- bridge methods affect preview +- execution errors are visible but non-fatal + +### Validation +- success path updates preview +- error path updates output panel and preserves app stability + +## Batch I — Finish the notifications lesson + +### Goal +Deliver the first complete end-to-end teaching slice. + +### Includes +- 9.1 Add notification lesson starter code +- 9.2 Add notification lesson text +- 9.3 Render notifications in dummy admin +- 9.4 Verify notification code path +- 9.5 Refine notification visuals + +### Suggested agent type +- `general` + +### Expected output +- notification lesson is understandable and runnable +- learner edits visibly change notification behavior + +### Validation +- starter code produces a visible notification +- modified code changes message/type/behavior predictably + +## Batch J — Finish the menu items lesson + +### Goal +Deliver the second complete teaching slice. + +### Includes +- 10.1 Add menu item lesson starter code +- 10.2 Add menu item lesson text +- 10.3 Render menu items in dummy sidebar +- 10.4 Verify menu registration code path +- 10.5 Refine menu visuals + +### Suggested agent type +- `general` + +### Expected output +- menu lesson is understandable and runnable +- learner edits visibly change the sidebar result + +### Validation +- starter code adds menu content to preview +- modified code changes label/order/appearance predictably + +## Batch K — Finish the locations / positions lesson + +### Goal +Deliver the third complete teaching slice focused on comprehension of extension placement. + +### Includes +- 11.1 Add locations lesson starter code +- 11.2 Add locations lesson text +- 11.3 Add labeled location containers to dummy admin +- 11.4 Render registered location content +- 11.5 Verify positions concept visually +- 11.6 Refine location card visuals + +### Suggested agent type +- `general` + +### Expected output +- location lesson is understandable and runnable +- preview clearly explains placement/targeting + +### Validation +- starter code renders content in named surfaces +- content appears in the correct visual slot after edits + +## Batch L — Polish and verify + +### Goal +Improve readability and remove obvious prototype blockers. + +### Includes +- 12.1 Add lesson progress affordance +- 12.2 Improve shell spacing and typography +- 12.3 Improve button labels and helper text +- 12.4 Improve preview empty/error states +- 12.5 Add minimal branding alignment +- 13.1 Start dev app and verify boot +- 13.2 Verify lesson switching +- 13.3 Verify notifications lesson manually +- 13.4 Verify menu items lesson manually +- 13.5 Verify locations lesson manually +- 13.6 Verify responsive layout manually +- 13.7 Fix any obvious prototype regressions + +### Suggested agent type +- `general` for implementation and verification +- `browser-operator` later if a browser review pass is requested + +### Expected output +- prototype is coherent and demoable +- major teaching flows work without obvious breakage + +### Validation +- all three lessons work end-to-end +- layout is understandable on desktop and narrow screens + +--- + +## Recommended Execution Order + +Run batches in this order: + +1. Batch A — Scaffold the package +2. Batch B — Build the split tutorial shell +3. Batch C — Add lesson data and navigation +4. Batch D — Add the first editor experience +5. Batch E — Add preview shell and dummy admin skeleton +6. Batch F — Add runtime state plumbing +7. Batch G — Implement the mock Admin SDK bridge +8. Batch H — Add code execution flow +9. Batch I — Finish the notifications lesson +10. Batch J — Finish the menu items lesson +11. Batch K — Finish the locations / positions lesson +12. Batch L — Polish and verify + +## Parallelization Notes + +Most batches should remain sequential because they build on shared app structure. + +Limited safe parallelism: + +- Batch C can begin once Batch B has stable component boundaries +- Batch D and Batch E can partially proceed in parallel after Batch B if interfaces are agreed up front +- Lesson copy work inside Batches I/J/K can be parallelized after runtime and execution foundations are complete + +Avoid parallelizing: + +- runtime-state and bridge changes across multiple agents at the same time +- overlapping edits to `App.vue` and shared shell composition without explicit coordination + +## Handoff Guidance for Subagents + +Each delegated batch should include: + +- the brief in `.orchestrator/implementation-brief.md` +- this plan file +- the exact batch name and included tasks +- a reminder to stay within prototype scope +- a request to summarize changed files, assumptions, and follow-up risks diff --git a/packages/admin-sdk-tutorial/dist/assets/index-BsO6e4uL.js b/packages/admin-sdk-tutorial/dist/assets/index-BsO6e4uL.js new file mode 100644 index 000000000..6647b90f4 --- /dev/null +++ b/packages/admin-sdk-tutorial/dist/assets/index-BsO6e4uL.js @@ -0,0 +1,13 @@ +(function(){let e=document.createElement(`link`).relList;if(e&&e.supports&&e.supports(`modulepreload`))return;for(let e of document.querySelectorAll(`link[rel="modulepreload"]`))n(e);new MutationObserver(e=>{for(let t of e)if(t.type===`childList`)for(let e of t.addedNodes)e.tagName===`LINK`&&e.rel===`modulepreload`&&n(e)}).observe(document,{childList:!0,subtree:!0});function t(e){let t={};return e.integrity&&(t.integrity=e.integrity),e.referrerPolicy&&(t.referrerPolicy=e.referrerPolicy),e.crossOrigin===`use-credentials`?t.credentials=`include`:e.crossOrigin===`anonymous`?t.credentials=`omit`:t.credentials=`same-origin`,t}function n(e){if(e.ep)return;e.ep=!0;let n=t(e);fetch(e.href,n)}})();function e(e){let t=Object.create(null);for(let n of e.split(`,`))t[n]=1;return e=>e in t}var t={},n=[],r=()=>{},i=()=>!1,a=e=>e.charCodeAt(0)===111&&e.charCodeAt(1)===110&&(e.charCodeAt(2)>122||e.charCodeAt(2)<97),o=e=>e.startsWith(`onUpdate:`),s=Object.assign,c=(e,t)=>{let n=e.indexOf(t);n>-1&&e.splice(n,1)},l=Object.prototype.hasOwnProperty,u=(e,t)=>l.call(e,t),d=Array.isArray,f=e=>b(e)===`[object Map]`,p=e=>b(e)===`[object Set]`,m=e=>typeof e==`function`,h=e=>typeof e==`string`,g=e=>typeof e==`symbol`,_=e=>typeof e==`object`&&!!e,v=e=>(_(e)||m(e))&&m(e.then)&&m(e.catch),y=Object.prototype.toString,b=e=>y.call(e),ee=e=>b(e).slice(8,-1),x=e=>b(e)===`[object Object]`,S=e=>h(e)&&e!==`NaN`&&e[0]!==`-`&&``+parseInt(e,10)===e,C=e(`,key,ref,ref_for,ref_key,onVnodeBeforeMount,onVnodeMounted,onVnodeBeforeUpdate,onVnodeUpdated,onVnodeBeforeUnmount,onVnodeUnmounted`),te=e=>{let t=Object.create(null);return n=>t[n]||(t[n]=e(n))},ne=/-(\w)/g,w=te(e=>e.replace(ne,(e,t)=>t?t.toUpperCase():``)),re=/\B([A-Z])/g,T=te(e=>e.replace(re,`-$1`).toLowerCase()),ie=te(e=>e.charAt(0).toUpperCase()+e.slice(1)),ae=te(e=>e?`on${ie(e)}`:``),E=(e,t)=>!Object.is(e,t),oe=(e,...t)=>{for(let n=0;n{Object.defineProperty(e,t,{configurable:!0,enumerable:!1,writable:r,value:n})},D=e=>{let t=parseFloat(e);return isNaN(t)?e:t},ce,le=()=>ce||=typeof globalThis<`u`?globalThis:typeof self<`u`?self:typeof window<`u`?window:typeof global<`u`?global:{};function ue(e){if(d(e)){let t={};for(let n=0;n{if(e){let n=e.split(fe);n.length>1&&(t[n[0].trim()]=n[1].trim())}}),t}function O(e){let t=``;if(h(e))t=e;else if(d(e))for(let n=0;n!!(e&&e.__v_isRef===!0),A=e=>h(e)?e:e==null?``:d(e)||_(e)&&(e.toString===y||!m(e.toString))?_e(e)?A(e.value):JSON.stringify(e,ve,2):String(e),ve=(e,t)=>_e(t)?ve(e,t.value):f(t)?{[`Map(${t.size})`]:[...t.entries()].reduce((e,[t,n],r)=>(e[ye(t,r)+` =>`]=n,e),{})}:p(t)?{[`Set(${t.size})`]:[...t.values()].map(e=>ye(e))}:g(t)?ye(t):_(t)&&!d(t)&&!x(t)?String(t):t,ye=(e,t=``)=>g(e)?`Symbol(${e.description??t})`:e,j,be=class{constructor(e=!1){this.detached=e,this._active=!0,this.effects=[],this.cleanups=[],this._isPaused=!1,this.parent=j,!e&&j&&(this.index=(j.scopes||=[]).push(this)-1)}get active(){return this._active}pause(){if(this._active){this._isPaused=!0;let e,t;if(this.scopes)for(e=0,t=this.scopes.length;e0)return;if(Ee){let e=Ee;for(Ee=void 0;e;){let t=e.next;e.next=void 0,e.flags&=-9,e=t}}let e;for(;Te;){let t=Te;for(Te=void 0;t;){let n=t.next;if(t.next=void 0,t.flags&=-9,t.flags&1)try{t.trigger()}catch(t){e||=t}t=n}}if(e)throw e}function Ae(e){for(let t=e.deps;t;t=t.nextDep)t.version=-1,t.prevActiveLink=t.dep.activeLink,t.dep.activeLink=t}function je(e){let t,n=e.depsTail,r=n;for(;r;){let e=r.prevDep;r.version===-1?(r===n&&(n=e),Pe(r),Fe(r)):t=r,r.dep.activeLink=r.prevActiveLink,r.prevActiveLink=void 0,r=e}e.deps=t,e.depsTail=n}function Me(e){for(let t=e.deps;t;t=t.nextDep)if(t.dep.version!==t.version||t.dep.computed&&(Ne(t.dep.computed)||t.dep.version!==t.version))return!0;return!!e._dirty}function Ne(e){if(e.flags&4&&!(e.flags&16)||(e.flags&=-17,e.globalVersion===Be))return;e.globalVersion=Be;let t=e.dep;if(e.flags|=2,t.version>0&&!e.isSSR&&e.deps&&!Me(e)){e.flags&=-3;return}let n=M,r=N;M=e,N=!0;try{Ae(e);let n=e.fn(e._value);(t.version===0||E(n,e._value))&&(e._value=n,t.version++)}catch(e){throw t.version++,e}finally{M=n,N=r,je(e),e.flags&=-3}}function Pe(e,t=!1){let{dep:n,prevSub:r,nextSub:i}=e;if(r&&(r.nextSub=i,e.prevSub=void 0),i&&(i.prevSub=r,e.nextSub=void 0),n.subs===e&&(n.subs=r,!r&&n.computed)){n.computed.flags&=-5;for(let e=n.computed.deps;e;e=e.nextDep)Pe(e,!0)}!t&&!--n.sc&&n.map&&n.map.delete(n.key)}function Fe(e){let{prevDep:t,nextDep:n}=e;t&&(t.nextDep=n,e.prevDep=void 0),n&&(n.prevDep=t,e.nextDep=void 0)}var N=!0,Ie=[];function Le(){Ie.push(N),N=!1}function Re(){let e=Ie.pop();N=e===void 0?!0:e}function ze(e){let{cleanup:t}=e;if(e.cleanup=void 0,t){let e=M;M=void 0;try{t()}finally{M=e}}}var Be=0,Ve=class{constructor(e,t){this.sub=e,this.dep=t,this.version=t.version,this.nextDep=this.prevDep=this.nextSub=this.prevSub=this.prevActiveLink=void 0}},He=class{constructor(e){this.computed=e,this.version=0,this.activeLink=void 0,this.subs=void 0,this.map=void 0,this.key=void 0,this.sc=0}track(e){if(!M||!N||M===this.computed)return;let t=this.activeLink;if(t===void 0||t.sub!==M)t=this.activeLink=new Ve(M,this),M.deps?(t.prevDep=M.depsTail,M.depsTail.nextDep=t,M.depsTail=t):M.deps=M.depsTail=t,Ue(t);else if(t.version===-1&&(t.version=this.version,t.nextDep)){let e=t.nextDep;e.prevDep=t.prevDep,t.prevDep&&(t.prevDep.nextDep=e),t.prevDep=M.depsTail,t.nextDep=void 0,M.depsTail.nextDep=t,M.depsTail=t,M.deps===t&&(M.deps=e)}return t}trigger(e){this.version++,Be++,this.notify(e)}notify(e){Oe();try{for(let e=this.subs;e;e=e.prevSub)e.sub.notify()&&e.sub.dep.notify()}finally{ke()}}};function Ue(e){if(e.dep.sc++,e.sub.flags&4){let t=e.dep.computed;if(t&&!e.dep.subs){t.flags|=20;for(let e=t.deps;e;e=e.nextDep)Ue(e)}let n=e.dep.subs;n!==e&&(e.prevSub=n,n&&(n.nextSub=e)),e.dep.subs=e}}var We=new WeakMap,Ge=Symbol(``),Ke=Symbol(``),qe=Symbol(``);function P(e,t,n){if(N&&M){let t=We.get(e);t||We.set(e,t=new Map);let r=t.get(n);r||(t.set(n,r=new He),r.map=t,r.key=n),r.track()}}function Je(e,t,n,r,i,a){let o=We.get(e);if(!o){Be++;return}let s=e=>{e&&e.trigger()};if(Oe(),t===`clear`)o.forEach(s);else{let i=d(e),a=i&&S(n);if(i&&n===`length`){let e=Number(r);o.forEach((t,n)=>{(n===`length`||n===qe||!g(n)&&n>=e)&&s(t)})}else switch((n!==void 0||o.has(void 0))&&s(o.get(n)),a&&s(o.get(qe)),t){case`add`:i?a&&s(o.get(`length`)):(s(o.get(Ge)),f(e)&&s(o.get(Ke)));break;case`delete`:i||(s(o.get(Ge)),f(e)&&s(o.get(Ke)));break;case`set`:f(e)&&s(o.get(Ge));break}}ke()}function Ye(e){let t=I(e);return t===e?t:(P(t,`iterate`,qe),F(e)?t:t.map(L))}function Xe(e){return P(e=I(e),`iterate`,qe),e}var Ze={__proto__:null,[Symbol.iterator](){return Qe(this,Symbol.iterator,L)},concat(...e){return Ye(this).concat(...e.map(e=>d(e)?Ye(e):e))},entries(){return Qe(this,`entries`,e=>(e[1]=L(e[1]),e))},every(e,t){return et(this,`every`,e,t,void 0,arguments)},filter(e,t){return et(this,`filter`,e,t,e=>e.map(L),arguments)},find(e,t){return et(this,`find`,e,t,L,arguments)},findIndex(e,t){return et(this,`findIndex`,e,t,void 0,arguments)},findLast(e,t){return et(this,`findLast`,e,t,L,arguments)},findLastIndex(e,t){return et(this,`findLastIndex`,e,t,void 0,arguments)},forEach(e,t){return et(this,`forEach`,e,t,void 0,arguments)},includes(...e){return nt(this,`includes`,e)},indexOf(...e){return nt(this,`indexOf`,e)},join(e){return Ye(this).join(e)},lastIndexOf(...e){return nt(this,`lastIndexOf`,e)},map(e,t){return et(this,`map`,e,t,void 0,arguments)},pop(){return rt(this,`pop`)},push(...e){return rt(this,`push`,e)},reduce(e,...t){return tt(this,`reduce`,e,t)},reduceRight(e,...t){return tt(this,`reduceRight`,e,t)},shift(){return rt(this,`shift`)},some(e,t){return et(this,`some`,e,t,void 0,arguments)},splice(...e){return rt(this,`splice`,e)},toReversed(){return Ye(this).toReversed()},toSorted(e){return Ye(this).toSorted(e)},toSpliced(...e){return Ye(this).toSpliced(...e)},unshift(...e){return rt(this,`unshift`,e)},values(){return Qe(this,`values`,L)}};function Qe(e,t,n){let r=Xe(e),i=r[t]();return r!==e&&!F(e)&&(i._next=i.next,i.next=()=>{let e=i._next();return e.value&&=n(e.value),e}),i}var $e=Array.prototype;function et(e,t,n,r,i,a){let o=Xe(e),s=o!==e&&!F(e),c=o[t];if(c!==$e[t]){let t=c.apply(e,a);return s?L(t):t}let l=n;o!==e&&(s?l=function(t,r){return n.call(this,L(t),r,e)}:n.length>2&&(l=function(t,r){return n.call(this,t,r,e)}));let u=c.call(o,l,r);return s&&i?i(u):u}function tt(e,t,n,r){let i=Xe(e),a=n;return i!==e&&(F(e)?n.length>3&&(a=function(t,r,i){return n.call(this,t,r,i,e)}):a=function(t,r,i){return n.call(this,t,L(r),i,e)}),i[t](a,...r)}function nt(e,t,n){let r=I(e);P(r,`iterate`,qe);let i=r[t](...n);return(i===-1||i===!1)&&Pt(n[0])?(n[0]=I(n[0]),r[t](...n)):i}function rt(e,t,n=[]){Le(),Oe();let r=I(e)[t].apply(e,n);return ke(),Re(),r}var it=e(`__proto__,__v_isRef,__isVue`),at=new Set(Object.getOwnPropertyNames(Symbol).filter(e=>e!==`arguments`&&e!==`caller`).map(e=>Symbol[e]).filter(g));function ot(e){g(e)||(e=String(e));let t=I(this);return P(t,`has`,e),t.hasOwnProperty(e)}var st=class{constructor(e=!1,t=!1){this._isReadonly=e,this._isShallow=t}get(e,t,n){if(t===`__v_skip`)return e.__v_skip;let r=this._isReadonly,i=this._isShallow;if(t===`__v_isReactive`)return!r;if(t===`__v_isReadonly`)return r;if(t===`__v_isShallow`)return i;if(t===`__v_raw`)return n===(r?i?Tt:wt:i?Ct:St).get(e)||Object.getPrototypeOf(e)===Object.getPrototypeOf(n)?e:void 0;let a=d(e);if(!r){let e;if(a&&(e=Ze[t]))return e;if(t===`hasOwnProperty`)return ot}let o=Reflect.get(e,t,R(e)?e:n);return(g(t)?at.has(t):it(t))||(r||P(e,`get`,t),i)?o:R(o)?a&&S(t)?o:o.value:_(o)?r?At(o):Ot(o):o}},ct=class extends st{constructor(e=!1){super(!1,e)}set(e,t,n,r){let i=e[t];if(!this._isShallow){let t=Nt(i);if(!F(n)&&!Nt(n)&&(i=I(i),n=I(n)),!d(e)&&R(i)&&!R(n))return t?!1:(i.value=n,!0)}let a=d(e)&&S(t)?Number(t)e,mt=e=>Reflect.getPrototypeOf(e);function ht(e,t,n){return function(...r){let i=this.__v_raw,a=I(i),o=f(a),s=e===`entries`||e===Symbol.iterator&&o,c=e===`keys`&&o,l=i[e](...r),u=n?pt:t?It:L;return!t&&P(a,`iterate`,c?Ke:Ge),{next(){let{value:e,done:t}=l.next();return t?{value:e,done:t}:{value:s?[u(e[0]),u(e[1])]:u(e),done:t}},[Symbol.iterator](){return this}}}}function gt(e){return function(...t){return e===`delete`?!1:e===`clear`?void 0:this}}function _t(e,t){let n={get(n){let r=this.__v_raw,i=I(r),a=I(n);e||(E(n,a)&&P(i,`get`,n),P(i,`get`,a));let{has:o}=mt(i),s=t?pt:e?It:L;if(o.call(i,n))return s(r.get(n));if(o.call(i,a))return s(r.get(a));r!==i&&r.get(n)},get size(){let t=this.__v_raw;return!e&&P(I(t),`iterate`,Ge),Reflect.get(t,`size`,t)},has(t){let n=this.__v_raw,r=I(n),i=I(t);return e||(E(t,i)&&P(r,`has`,t),P(r,`has`,i)),t===i?n.has(t):n.has(t)||n.has(i)},forEach(n,r){let i=this,a=i.__v_raw,o=I(a),s=t?pt:e?It:L;return!e&&P(o,`iterate`,Ge),a.forEach((e,t)=>n.call(r,s(e),s(t),i))}};return s(n,e?{add:gt(`add`),set:gt(`set`),delete:gt(`delete`),clear:gt(`clear`)}:{add(e){!t&&!F(e)&&!Nt(e)&&(e=I(e));let n=I(this);return mt(n).has.call(n,e)||(n.add(e),Je(n,`add`,e,e)),this},set(e,n){!t&&!F(n)&&!Nt(n)&&(n=I(n));let r=I(this),{has:i,get:a}=mt(r),o=i.call(r,e);o||=(e=I(e),i.call(r,e));let s=a.call(r,e);return r.set(e,n),o?E(n,s)&&Je(r,`set`,e,n,s):Je(r,`add`,e,n),this},delete(e){let t=I(this),{has:n,get:r}=mt(t),i=n.call(t,e);i||=(e=I(e),n.call(t,e));let a=r?r.call(t,e):void 0,o=t.delete(e);return i&&Je(t,`delete`,e,void 0,a),o},clear(){let e=I(this),t=e.size!==0,n=e.clear();return t&&Je(e,`clear`,void 0,void 0,void 0),n}}),[`keys`,`values`,`entries`,Symbol.iterator].forEach(r=>{n[r]=ht(r,e,t)}),n}function vt(e,t){let n=_t(e,t);return(t,r,i)=>r===`__v_isReactive`?!e:r===`__v_isReadonly`?e:r===`__v_raw`?t:Reflect.get(u(n,r)&&r in t?n:t,r,i)}var yt={get:vt(!1,!1)},bt={get:vt(!1,!0)},xt={get:vt(!0,!1)},St=new WeakMap,Ct=new WeakMap,wt=new WeakMap,Tt=new WeakMap;function Et(e){switch(e){case`Object`:case`Array`:return 1;case`Map`:case`Set`:case`WeakMap`:case`WeakSet`:return 2;default:return 0}}function Dt(e){return e.__v_skip||!Object.isExtensible(e)?0:Et(ee(e))}function Ot(e){return Nt(e)?e:jt(e,!1,ut,yt,St)}function kt(e){return jt(e,!1,ft,bt,Ct)}function At(e){return jt(e,!0,dt,xt,wt)}function jt(e,t,n,r,i){if(!_(e)||e.__v_raw&&!(t&&e.__v_isReactive))return e;let a=i.get(e);if(a)return a;let o=Dt(e);if(o===0)return e;let s=new Proxy(e,o===2?r:n);return i.set(e,s),s}function Mt(e){return Nt(e)?Mt(e.__v_raw):!!(e&&e.__v_isReactive)}function Nt(e){return!!(e&&e.__v_isReadonly)}function F(e){return!!(e&&e.__v_isShallow)}function Pt(e){return e?!!e.__v_raw:!1}function I(e){let t=e&&e.__v_raw;return t?I(t):e}function Ft(e){return!u(e,`__v_skip`)&&Object.isExtensible(e)&&se(e,`__v_skip`,!0),e}var L=e=>_(e)?Ot(e):e,It=e=>_(e)?At(e):e;function R(e){return e?e.__v_isRef===!0:!1}function Lt(e){return Rt(e,!1)}function Rt(e,t){return R(e)?e:new zt(e,t)}var zt=class{constructor(e,t){this.dep=new He,this.__v_isRef=!0,this.__v_isShallow=!1,this._rawValue=t?e:I(e),this._value=t?e:L(e),this.__v_isShallow=t}get value(){return this.dep.track(),this._value}set value(e){let t=this._rawValue,n=this.__v_isShallow||F(e)||Nt(e);e=n?e:I(e),E(e,t)&&(this._rawValue=e,this._value=n?e:L(e),this.dep.trigger())}};function Bt(e){return R(e)?e.value:e}var Vt={get:(e,t,n)=>t===`__v_raw`?e:Bt(Reflect.get(e,t,n)),set:(e,t,n,r)=>{let i=e[t];return R(i)&&!R(n)?(i.value=n,!0):Reflect.set(e,t,n,r)}};function Ht(e){return Mt(e)?e:new Proxy(e,Vt)}var Ut=class{constructor(e,t,n){this.fn=e,this.setter=t,this._value=void 0,this.dep=new He(this),this.__v_isRef=!0,this.deps=void 0,this.depsTail=void 0,this.flags=16,this.globalVersion=Be-1,this.next=void 0,this.effect=this,this.__v_isReadonly=!t,this.isSSR=n}notify(){if(this.flags|=16,!(this.flags&8)&&M!==this)return De(this,!0),!0}get value(){let e=this.dep.track();return Ne(this),e&&(e.version=this.dep.version),this._value}set value(e){this.setter&&this.setter(e)}};function Wt(e,t,n=!1){let r,i;return m(e)?r=e:(r=e.get,i=e.set),new Ut(r,i,n)}var Gt={},Kt=new WeakMap,qt=void 0;function Jt(e,t=!1,n=qt){if(n){let t=Kt.get(n);t||Kt.set(n,t=[]),t.push(e)}}function Yt(e,n,i=t){let{immediate:a,deep:o,once:s,scheduler:l,augmentJob:u,call:f}=i,p=e=>o?e:F(e)||o===!1||o===0?Xt(e,1):Xt(e),h,g,_,v,y=!1,b=!1;if(R(e)?(g=()=>e.value,y=F(e)):Mt(e)?(g=()=>p(e),y=!0):d(e)?(b=!0,y=e.some(e=>Mt(e)||F(e)),g=()=>e.map(e=>{if(R(e))return e.value;if(Mt(e))return p(e);if(m(e))return f?f(e,2):e()})):g=m(e)?n?f?()=>f(e,2):e:()=>{if(_){Le();try{_()}finally{Re()}}let t=qt;qt=h;try{return f?f(e,3,[v]):e(v)}finally{qt=t}}:r,n&&o){let e=g,t=o===!0?1/0:o;g=()=>Xt(e(),t)}let ee=xe(),x=()=>{h.stop(),ee&&ee.active&&c(ee.effects,h)};if(s&&n){let e=n;n=(...t)=>{e(...t),x()}}let S=b?Array(e.length).fill(Gt):Gt,C=e=>{if(!(!(h.flags&1)||!h.dirty&&!e))if(n){let e=h.run();if(o||y||(b?e.some((e,t)=>E(e,S[t])):E(e,S))){_&&_();let t=qt;qt=h;try{let t=[e,S===Gt?void 0:b&&S[0]===Gt?[]:S,v];f?f(n,3,t):n(...t),S=e}finally{qt=t}}}else h.run()};return u&&u(C),h=new Ce(g),h.scheduler=l?()=>l(C,!1):C,v=e=>Jt(e,!1,h),_=h.onStop=()=>{let e=Kt.get(h);if(e){if(f)f(e,4);else for(let t of e)t();Kt.delete(h)}},n?a?C(!0):S=h.run():l?l(C.bind(null,!0),!0):h.run(),x.pause=h.pause.bind(h),x.resume=h.resume.bind(h),x.stop=x,x}function Xt(e,t=1/0,n){if(t<=0||!_(e)||e.__v_skip||(n||=new Set,n.has(e)))return e;if(n.add(e),t--,R(e))Xt(e.value,t,n);else if(d(e))for(let r=0;r{Xt(e,t,n)});else if(x(e)){for(let r in e)Xt(e[r],t,n);for(let r of Object.getOwnPropertySymbols(e))Object.prototype.propertyIsEnumerable.call(e,r)&&Xt(e[r],t,n)}return e}function Zt(e,t,n,r){try{return r?e(...r):e()}catch(e){Qt(e,t,n)}}function z(e,t,n,r){if(m(e)){let i=Zt(e,t,n,r);return i&&v(i)&&i.catch(e=>{Qt(e,t,n)}),i}if(d(e)){let i=[];for(let a=0;a>>1,i=B[r],a=pn(i);a=pn(n)?B.push(e):B.splice(sn(t),0,e),e.flags|=1,ln()}}function ln(){an||=rn.then(mn)}function un(e){d(e)?en.push(...e):tn&&e.id===-1?tn.splice(nn+1,0,e):e.flags&1||(en.push(e),e.flags|=1),ln()}function dn(e,t,n=V+1){for(;npn(e)-pn(t));if(en.length=0,tn){tn.push(...e);return}for(tn=e,nn=0;nne.id==null?e.flags&2?-1:1/0:e.id;function mn(e){try{for(V=0;V{r._d&&pi(-1);let i=gn(t),a;try{a=e(...n)}finally{gn(i),r._d&&pi(1)}return a};return r._n=!0,r._c=!0,r._d=!0,r}function vn(e,t,n,r){let i=e.dirs,a=t&&t.dirs;for(let o=0;oe.__isTeleport;function xn(e,t){e.shapeFlag&6&&e.component?(e.transition=t,xn(e.component.subTree,t)):e.shapeFlag&128?(e.ssContent.transition=t.clone(e.ssContent),e.ssFallback.transition=t.clone(e.ssFallback)):e.transition=t}function Sn(e,t){return m(e)?s({name:e.name},t,{setup:e}):e}function Cn(e){e.ids=[e.ids[0]+ e.ids[2]+++`-`,0,0]}function wn(e,n,r,i,a=!1){if(d(e)){e.forEach((e,t)=>wn(e,n&&(d(n)?n[t]:n),r,i,a));return}if(Tn(i)&&!a){i.shapeFlag&512&&i.type.__asyncResolved&&i.component.subTree.component&&wn(e,n,r,i.component.subTree);return}let o=i.shapeFlag&4?Gi(i.component):i.el,s=a?null:o,{i:l,r:f}=e,p=n&&n.r,g=l.refs===t?l.refs={}:l.refs,_=l.setupState,v=I(_),y=_===t?()=>!1:e=>u(v,e);if(p!=null&&p!==f&&(h(p)?(g[p]=null,y(p)&&(_[p]=null)):R(p)&&(p.value=null)),m(f))Zt(f,l,12,[s,g]);else{let t=h(f),n=R(f);if(t||n){let i=()=>{if(e.f){let n=t?y(f)?_[f]:g[f]:f.value;a?d(n)&&c(n,o):d(n)?n.includes(o)||n.push(o):t?(g[f]=[o],y(f)&&(_[f]=g[f])):(f.value=[o],e.k&&(g[e.k]=f.value))}else t?(g[f]=s,y(f)&&(_[f]=s)):n&&(f.value=s,e.k&&(g[e.k]=s))};s?(i.id=-1,W(i,r)):i()}}}le().requestIdleCallback,le().cancelIdleCallback;var Tn=e=>!!e.type.__asyncLoader,En=e=>e.type.__isKeepAlive;function Dn(e,t){kn(e,`a`,t)}function On(e,t){kn(e,`da`,t)}function kn(e,t,n=$){let r=e.__wdc||=()=>{let t=n;for(;t;){if(t.isDeactivated)return;t=t.parent}return e()};if(jn(t,r,n),n){let e=n.parent;for(;e&&e.parent;)En(e.parent.vnode)&&An(r,t,n,e),e=e.parent}}function An(e,t,n,r){let i=jn(t,e,r,!0);Rn(()=>{c(r[t],i)},n)}function jn(e,t,n=$,r=!1){if(n){let i=n[e]||(n[e]=[]),a=t.__weh||=(...r)=>{Le();let i=Ni(n),a=z(t,n,e,r);return i(),Re(),a};return r?i.unshift(a):i.push(a),a}}var Mn=e=>(t,n=$)=>{(!Ii||e===`sp`)&&jn(e,(...e)=>t(...e),n)},Nn=Mn(`bm`),Pn=Mn(`m`),Fn=Mn(`bu`),In=Mn(`u`),Ln=Mn(`bum`),Rn=Mn(`um`),zn=Mn(`sp`),Bn=Mn(`rtg`),Vn=Mn(`rtc`);function Hn(e,t=$){jn(`ec`,e,t)}var Un=Symbol.for(`v-ndc`);function Wn(e,t,n,r){let i,a=n&&n[r],o=d(e);if(o||h(e)){let n=o&&Mt(e),r=!1;n&&(r=!F(e),e=Xe(e)),i=Array(e.length);for(let n=0,o=e.length;nt(e,n,void 0,a&&a[n]));else{let n=Object.keys(e);i=Array(n.length);for(let r=0,o=n.length;re?Fi(e)?Gi(e):Gn(e.parent):null,Kn=s(Object.create(null),{$:e=>e,$el:e=>e.vnode.el,$data:e=>e.data,$props:e=>e.props,$attrs:e=>e.attrs,$slots:e=>e.slots,$refs:e=>e.refs,$parent:e=>Gn(e.parent),$root:e=>Gn(e.root),$host:e=>e.ce,$emit:e=>e.emit,$options:e=>tr(e),$forceUpdate:e=>e.f||=()=>{cn(e.update)},$nextTick:e=>e.n||=on.bind(e.proxy),$watch:e=>qr.bind(e)}),qn=(e,n)=>e!==t&&!e.__isScriptSetup&&u(e,n),Jn={get({_:e},n){if(n===`__v_skip`)return!0;let{ctx:r,setupState:i,data:a,props:o,accessCache:s,type:c,appContext:l}=e,d;if(n[0]!==`$`){let c=s[n];if(c!==void 0)switch(c){case 1:return i[n];case 2:return a[n];case 4:return r[n];case 3:return o[n]}else if(qn(i,n))return s[n]=1,i[n];else if(a!==t&&u(a,n))return s[n]=2,a[n];else if((d=e.propsOptions[0])&&u(d,n))return s[n]=3,o[n];else if(r!==t&&u(r,n))return s[n]=4,r[n];else Xn&&(s[n]=0)}let f=Kn[n],p,m;if(f)return n===`$attrs`&&P(e.attrs,`get`,``),f(e);if((p=c.__cssModules)&&(p=p[n]))return p;if(r!==t&&u(r,n))return s[n]=4,r[n];if(m=l.config.globalProperties,u(m,n))return m[n]},set({_:e},n,r){let{data:i,setupState:a,ctx:o}=e;return qn(a,n)?(a[n]=r,!0):i!==t&&u(i,n)?(i[n]=r,!0):u(e.props,n)||n[0]===`$`&&n.slice(1)in e?!1:(o[n]=r,!0)},has({_:{data:e,setupState:n,accessCache:r,ctx:i,appContext:a,propsOptions:o}},s){let c;return!!r[s]||e!==t&&u(e,s)||qn(n,s)||(c=o[0])&&u(c,s)||u(i,s)||u(Kn,s)||u(a.config.globalProperties,s)},defineProperty(e,t,n){return n.get==null?u(n,`value`)&&this.set(e,t,n.value,null):e._.accessCache[t]=0,Reflect.defineProperty(e,t,n)}};function Yn(e){return d(e)?e.reduce((e,t)=>(e[t]=null,e),{}):e}var Xn=!0;function Zn(e){let t=tr(e),n=e.proxy,i=e.ctx;Xn=!1,t.beforeCreate&&$n(t.beforeCreate,e,`bc`);let{data:a,computed:o,methods:s,watch:c,provide:l,inject:u,created:f,beforeMount:p,mounted:h,beforeUpdate:g,updated:v,activated:y,deactivated:b,beforeDestroy:ee,beforeUnmount:x,destroyed:S,unmounted:C,render:te,renderTracked:ne,renderTriggered:w,errorCaptured:re,serverPrefetch:T,expose:ie,inheritAttrs:ae,components:E,directives:oe,filters:se}=t;if(u&&Qn(u,i,null),s)for(let e in s){let t=s[e];m(t)&&(i[e]=t.bind(n))}if(a){let t=a.call(n,n);_(t)&&(e.data=Ot(t))}if(Xn=!0,o)for(let e in o){let t=o[e],a=qi({get:m(t)?t.bind(n,n):m(t.get)?t.get.bind(n,n):r,set:!m(t)&&m(t.set)?t.set.bind(n):r});Object.defineProperty(i,e,{enumerable:!0,configurable:!0,get:()=>a.value,set:e=>a.value=e})}if(c)for(let e in c)er(c[e],i,n,e);if(l){let e=m(l)?l.call(n):l;Reflect.ownKeys(e).forEach(t=>{mr(t,e[t])})}f&&$n(f,e,`c`);function D(e,t){d(t)?t.forEach(t=>e(t.bind(n))):t&&e(t.bind(n))}if(D(Nn,p),D(Pn,h),D(Fn,g),D(In,v),D(Dn,y),D(On,b),D(Hn,re),D(Vn,ne),D(Bn,w),D(Ln,x),D(Rn,C),D(zn,T),d(ie))if(ie.length){let t=e.exposed||={};ie.forEach(e=>{Object.defineProperty(t,e,{get:()=>n[e],set:t=>n[e]=t})})}else e.exposed||={};te&&e.render===r&&(e.render=te),ae!=null&&(e.inheritAttrs=ae),E&&(e.components=E),oe&&(e.directives=oe),T&&Cn(e)}function Qn(e,t,n=r){d(e)&&(e=or(e));for(let n in e){let r=e[n],i;i=_(r)?`default`in r?hr(r.from||n,r.default,!0):hr(r.from||n):hr(r),R(i)?Object.defineProperty(t,n,{enumerable:!0,configurable:!0,get:()=>i.value,set:e=>i.value=e}):t[n]=i}}function $n(e,t,n){z(d(e)?e.map(e=>e.bind(t.proxy)):e.bind(t.proxy),t,n)}function er(e,t,n,r){let i=r.includes(`.`)?Jr(n,r):()=>n[r];if(h(e)){let n=t[e];m(n)&&Gr(i,n)}else if(m(e))Gr(i,e.bind(n));else if(_(e))if(d(e))e.forEach(e=>er(e,t,n,r));else{let r=m(e.handler)?e.handler.bind(n):t[e.handler];m(r)&&Gr(i,r,e)}}function tr(e){let t=e.type,{mixins:n,extends:r}=t,{mixins:i,optionsCache:a,config:{optionMergeStrategies:o}}=e.appContext,s=a.get(t),c;return s?c=s:!i.length&&!n&&!r?c=t:(c={},i.length&&i.forEach(e=>nr(c,e,o,!0)),nr(c,t,o)),_(t)&&a.set(t,c),c}function nr(e,t,n,r=!1){let{mixins:i,extends:a}=t;a&&nr(e,a,n,!0),i&&i.forEach(t=>nr(e,t,n,!0));for(let i in t)if(!(r&&i===`expose`)){let r=rr[i]||n&&n[i];e[i]=r?r(e[i],t[i]):t[i]}return e}var rr={data:ir,props:cr,emits:cr,methods:sr,computed:sr,beforeCreate:U,created:U,beforeMount:U,mounted:U,beforeUpdate:U,updated:U,beforeDestroy:U,beforeUnmount:U,destroyed:U,unmounted:U,activated:U,deactivated:U,errorCaptured:U,serverPrefetch:U,components:sr,directives:sr,watch:lr,provide:ir,inject:ar};function ir(e,t){return t?e?function(){return s(m(e)?e.call(this,this):e,m(t)?t.call(this,this):t)}:t:e}function ar(e,t){return sr(or(e),or(t))}function or(e){if(d(e)){let t={};for(let n=0;n1)return n&&m(t)?t.call(r&&r.proxy):t}}var gr={},_r=()=>Object.create(gr),vr=e=>Object.getPrototypeOf(e)===gr;function yr(e,t,n,r=!1){let i={},a=_r();e.propsDefaults=Object.create(null),xr(e,t,i,a);for(let t in e.propsOptions[0])t in i||(i[t]=void 0);n?e.props=r?i:kt(i):e.type.props?e.props=i:e.props=a,e.attrs=a}function br(e,t,n,r){let{props:i,attrs:a,vnode:{patchFlag:o}}=e,s=I(i),[c]=e.propsOptions,l=!1;if((r||o>0)&&!(o&16)){if(o&8){let n=e.vnode.dynamicProps;for(let r=0;r{p=!0;let[t,n]=wr(e,r,!0);s(l,t),n&&f.push(...n)};!i&&r.mixins.length&&r.mixins.forEach(t),e.extends&&t(e.extends),e.mixins&&e.mixins.forEach(t)}if(!c&&!p)return _(e)&&a.set(e,n),n;if(d(c))for(let e=0;ee[0]===`_`||e===`$stable`,Dr=e=>d(e)?e.map(Z):[Z(e)],Or=(e,t,n)=>{if(t._n)return t;let r=_n((...e)=>Dr(t(...e)),n);return r._c=!1,r},kr=(e,t,n)=>{let r=e._ctx;for(let n in e){if(Er(n))continue;let i=e[n];if(m(i))t[n]=Or(n,i,r);else if(i!=null){let e=Dr(i);t[n]=()=>e}}},Ar=(e,t)=>{let n=Dr(t);e.slots.default=()=>n},jr=(e,t,n)=>{for(let r in t)(n||r!==`_`)&&(e[r]=t[r])},Mr=(e,t,n)=>{let r=e.slots=_r();if(e.vnode.shapeFlag&32){let e=t._;e?(jr(r,t,n),n&&se(r,`_`,e,!0)):kr(t,r)}else t&&Ar(e,t)},Nr=(e,n,r)=>{let{vnode:i,slots:a}=e,o=!0,s=t;if(i.shapeFlag&32){let e=n._;e?r&&e===1?o=!1:jr(a,n,r):(o=!n.$stable,kr(n,a)),s=n}else n&&(Ar(e,n),s={default:1});if(o)for(let e in a)!Er(e)&&s[e]==null&&delete a[e]},W=oi;function Pr(e){return Fr(e)}function Fr(e,i){let a=le();a.__VUE__=!0;let{insert:o,remove:s,patchProp:c,createElement:l,createText:u,createComment:d,setText:f,setElementText:p,parentNode:m,nextSibling:h,setScopeId:g=r,insertStaticContent:_}=e,v=(e,t,n,r=null,i=null,a=null,o=void 0,s=null,c=!!t.dynamicChildren)=>{if(e===t)return;e&&!_i(e,t)&&(r=ve(e),k(e,i,a,!0),e=null),t.patchFlag===-2&&(c=!1,t.dynamicChildren=null);let{type:l,ref:u,shapeFlag:d}=t;switch(l){case si:y(e,t,n,r);break;case ci:b(e,t,n,r);break;case li:e??ee(t,n,r,o);break;case G:E(e,t,n,r,i,a,o,s,c);break;default:d&1?te(e,t,n,r,i,a,o,s,c):d&6?se(e,t,n,r,i,a,o,s,c):(d&64||d&128)&&l.process(e,t,n,r,i,a,o,s,c,be)}u!=null&&i&&wn(u,e&&e.ref,a,t||e,!t)},y=(e,t,n,r)=>{if(e==null)o(t.el=u(t.children),n,r);else{let n=t.el=e.el;t.children!==e.children&&f(n,t.children)}},b=(e,t,n,r)=>{e==null?o(t.el=d(t.children||``),n,r):t.el=e.el},ee=(e,t,n,r)=>{[e.el,e.anchor]=_(e.children,t,n,r,e.el,e.anchor)},x=({el:e,anchor:t},n,r)=>{let i;for(;e&&e!==t;)i=h(e),o(e,n,r),e=i;o(t,n,r)},S=({el:e,anchor:t})=>{let n;for(;e&&e!==t;)n=h(e),s(e),e=n;s(t)},te=(e,t,n,r,i,a,o,s,c)=>{t.type===`svg`?o=`svg`:t.type===`math`&&(o=`mathml`),e==null?ne(t,n,r,i,a,o,s,c):T(e,t,i,a,o,s,c)},ne=(e,t,n,r,i,a,s,u)=>{let d,f,{props:m,shapeFlag:h,transition:g,dirs:_}=e;if(d=e.el=l(e.type,a,m&&m.is,m),h&8?p(d,e.children):h&16&&re(e.children,d,null,r,i,Ir(e,a),s,u),_&&vn(e,null,r,`created`),w(d,e,e.scopeId,s,r),m){for(let e in m)e!==`value`&&!C(e)&&c(d,e,null,m[e],a,r);`value`in m&&c(d,`value`,null,m.value,a),(f=m.onVnodeBeforeMount)&&Q(f,r,e)}_&&vn(e,null,r,`beforeMount`);let v=Rr(i,g);v&&g.beforeEnter(d),o(d,t,n),((f=m&&m.onVnodeMounted)||v||_)&&W(()=>{f&&Q(f,r,e),v&&g.enter(d),_&&vn(e,null,r,`mounted`)},i)},w=(e,t,n,r,i)=>{if(n&&g(e,n),r)for(let t=0;t{for(let l=c;l{let l=n.el=e.el,{patchFlag:u,dynamicChildren:d,dirs:f}=n;u|=e.patchFlag&16;let m=e.props||t,h=n.props||t,g;if(r&&Lr(r,!1),(g=h.onVnodeBeforeUpdate)&&Q(g,r,n,e),f&&vn(n,e,r,`beforeUpdate`),r&&Lr(r,!0),(m.innerHTML&&h.innerHTML==null||m.textContent&&h.textContent==null)&&p(l,``),d?ie(e.dynamicChildren,d,l,r,i,Ir(n,a),o):s||fe(e,n,l,null,r,i,Ir(n,a),o,!1),u>0){if(u&16)ae(l,m,h,r,a);else if(u&2&&m.class!==h.class&&c(l,`class`,null,h.class,a),u&4&&c(l,`style`,m.style,h.style,a),u&8){let e=n.dynamicProps;for(let t=0;t{g&&Q(g,r,n,e),f&&vn(n,e,r,`updated`)},i)},ie=(e,t,n,r,i,a,o)=>{for(let s=0;s{if(n!==r){if(n!==t)for(let t in n)!C(t)&&!(t in r)&&c(e,t,n[t],null,a,i);for(let t in r){if(C(t))continue;let o=r[t],s=n[t];o!==s&&t!==`value`&&c(e,t,s,o,a,i)}`value`in r&&c(e,`value`,n.value,r.value,a)}},E=(e,t,n,r,i,a,s,c,l)=>{let d=t.el=e?e.el:u(``),f=t.anchor=e?e.anchor:u(``),{patchFlag:p,dynamicChildren:m,slotScopeIds:h}=t;h&&(c=c?c.concat(h):h),e==null?(o(d,n,r),o(f,n,r),re(t.children||[],n,f,i,a,s,c,l)):p>0&&p&64&&m&&e.dynamicChildren?(ie(e.dynamicChildren,m,n,i,a,s,c),(t.key!=null||i&&t===i.subTree)&&zr(e,t,!0)):fe(e,t,n,f,i,a,s,c,l)},se=(e,t,n,r,i,a,o,s,c)=>{t.slotScopeIds=s,e==null?t.shapeFlag&512?i.ctx.activate(t,n,r,o,c):D(t,n,r,i,a,o,c):ce(e,t,c)},D=(e,t,n,r,i,a,o)=>{let s=e.component=Ai(e,r,i);En(e)&&(s.ctx.renderer=be),Li(s,!1,o),s.asyncDep?(i&&i.registerDep(s,ue,o),e.el||b(null,s.subTree=X(ci),t,n)):ue(s,e,t,n,i,a,o)},ce=(e,t,n)=>{let r=t.component=e.component;if(ni(e,t,n))if(r.asyncDep&&!r.asyncResolved){de(r,t,n);return}else r.next=t,r.update();else t.el=e.el,r.vnode=t},ue=(e,t,n,r,i,a,o)=>{let s=()=>{if(e.isMounted){let{next:t,bu:n,u:r,parent:c,vnode:l}=e;{let n=Vr(e);if(n){t&&(t.el=l.el,de(e,t,o)),n.asyncDep.then(()=>{e.isUnmounted||s()});return}}let u=t,d;Lr(e,!1),t?(t.el=l.el,de(e,t,o)):t=l,n&&oe(n),(d=t.props&&t.props.onVnodeBeforeUpdate)&&Q(d,c,t,l),Lr(e,!0);let f=$r(e),p=e.subTree;e.subTree=f,v(p,f,m(p.el),ve(p),e,i,a),t.el=f.el,u===null&&ii(e,f.el),r&&W(r,i),(d=t.props&&t.props.onVnodeUpdated)&&W(()=>Q(d,c,t,l),i)}else{let o,{el:s,props:c}=t,{bm:l,m:u,parent:d,root:f,type:p}=e,m=Tn(t);if(Lr(e,!1),l&&oe(l),!m&&(o=c&&c.onVnodeBeforeMount)&&Q(o,d,t),Lr(e,!0),s&&M){let t=()=>{e.subTree=$r(e),M(s,e.subTree,e,i,null)};m&&p.__asyncHydrate?p.__asyncHydrate(s,e,t):t()}else{f.ce&&f.ce._injectChildStyle(p);let o=e.subTree=$r(e);v(null,o,n,r,e,i,a),t.el=o.el}if(u&&W(u,i),!m&&(o=c&&c.onVnodeMounted)){let e=t;W(()=>Q(o,d,e),i)}(t.shapeFlag&256||d&&Tn(d.vnode)&&d.vnode.shapeFlag&256)&&e.a&&W(e.a,i),e.isMounted=!0,t=n=r=null}};e.scope.on();let c=e.effect=new Ce(s);e.scope.off();let l=e.update=c.run.bind(c),u=e.job=c.runIfDirty.bind(c);u.i=e,u.id=e.uid,c.scheduler=()=>cn(u),Lr(e,!0),l()},de=(e,t,n)=>{t.component=e;let r=e.vnode.props;e.vnode=t,e.next=null,br(e,t.props,r,n),Nr(e,t.children,n),Le(),dn(e),Re()},fe=(e,t,n,r,i,a,o,s,c=!1)=>{let l=e&&e.children,u=e?e.shapeFlag:0,d=t.children,{patchFlag:f,shapeFlag:m}=t;if(f>0){if(f&128){me(l,d,n,r,i,a,o,s,c);return}else if(f&256){pe(l,d,n,r,i,a,o,s,c);return}}m&8?(u&16&&A(l,i,a),d!==l&&p(n,d)):u&16?m&16?me(l,d,n,r,i,a,o,s,c):A(l,i,a,!0):(u&8&&p(n,``),m&16&&re(d,n,r,i,a,o,s,c))},pe=(e,t,r,i,a,o,s,c,l)=>{e||=n,t||=n;let u=e.length,d=t.length,f=Math.min(u,d),p;for(p=0;pd?A(e,a,o,!0,!1,f):re(t,r,i,a,o,s,c,l,f)},me=(e,t,r,i,a,o,s,c,l)=>{let u=0,d=t.length,f=e.length-1,p=d-1;for(;u<=f&&u<=p;){let n=e[u],i=t[u]=l?Ti(t[u]):Z(t[u]);if(_i(n,i))v(n,i,r,null,a,o,s,c,l);else break;u++}for(;u<=f&&u<=p;){let n=e[f],i=t[p]=l?Ti(t[p]):Z(t[p]);if(_i(n,i))v(n,i,r,null,a,o,s,c,l);else break;f--,p--}if(u>f){if(u<=p){let e=p+1,n=ep)for(;u<=f;)k(e[u],a,o,!0),u++;else{let m=u,h=u,g=new Map;for(u=h;u<=p;u++){let e=t[u]=l?Ti(t[u]):Z(t[u]);e.key!=null&&g.set(e.key,u)}let _,y=0,b=p-h+1,ee=!1,x=0,S=Array(b);for(u=0;u=b){k(n,a,o,!0);continue}let i;if(n.key!=null)i=g.get(n.key);else for(_=h;_<=p;_++)if(S[_-h]===0&&_i(n,t[_])){i=_;break}i===void 0?k(n,a,o,!0):(S[i-h]=u+1,i>=x?x=i:ee=!0,v(n,t[i],r,null,a,o,s,c,l),y++)}let C=ee?Br(S):n;for(_=C.length-1,u=b-1;u>=0;u--){let e=h+u,n=t[e],f=e+1{let{el:a,type:s,transition:c,children:l,shapeFlag:u}=e;if(u&6){O(e.component.subTree,t,n,r);return}if(u&128){e.suspense.move(t,n,r);return}if(u&64){s.move(e,t,n,be);return}if(s===G){o(a,t,n);for(let e=0;ec.enter(a),i);else{let{leave:e,delayLeave:r,afterLeave:i}=c,s=()=>o(a,t,n),l=()=>{e(a,()=>{s(),i&&i()})};r?r(a,s,l):l()}else o(a,t,n)},k=(e,t,n,r=!1,i=!1)=>{let{type:a,props:o,ref:s,children:c,dynamicChildren:l,shapeFlag:u,patchFlag:d,dirs:f,cacheIndex:p}=e;if(d===-2&&(i=!1),s!=null&&wn(s,null,n,e,!0),p!=null&&(t.renderCache[p]=void 0),u&256){t.ctx.deactivate(e);return}let m=u&1&&f,h=!Tn(e),g;if(h&&(g=o&&o.onVnodeBeforeUnmount)&&Q(g,t,e),u&6)_e(e.component,n,r);else{if(u&128){e.suspense.unmount(n,r);return}m&&vn(e,null,t,`beforeUnmount`),u&64?e.type.remove(e,t,n,be,r):l&&!l.hasOnce&&(a!==G||d>0&&d&64)?A(l,t,n,!1,!0):(a===G&&d&384||!i&&u&16)&&A(c,t,n),r&&he(e)}(h&&(g=o&&o.onVnodeUnmounted)||m)&&W(()=>{g&&Q(g,t,e),m&&vn(e,null,t,`unmounted`)},n)},he=e=>{let{type:t,el:n,anchor:r,transition:i}=e;if(t===G){ge(n,r);return}if(t===li){S(e);return}let a=()=>{s(n),i&&!i.persisted&&i.afterLeave&&i.afterLeave()};if(e.shapeFlag&1&&i&&!i.persisted){let{leave:t,delayLeave:r}=i,o=()=>t(n,a);r?r(e.el,a,o):o()}else a()},ge=(e,t)=>{let n;for(;e!==t;)n=h(e),s(e),e=n;s(t)},_e=(e,t,n)=>{let{bum:r,scope:i,job:a,subTree:o,um:s,m:c,a:l}=e;Hr(c),Hr(l),r&&oe(r),i.stop(),a&&(a.flags|=8,k(o,e,t,n)),s&&W(s,t),W(()=>{e.isUnmounted=!0},t),t&&t.pendingBranch&&!t.isUnmounted&&e.asyncDep&&!e.asyncResolved&&e.suspenseId===t.pendingId&&(t.deps--,t.deps===0&&t.resolve())},A=(e,t,n,r=!1,i=!1,a=0)=>{for(let o=a;o{if(e.shapeFlag&6)return ve(e.component.subTree);if(e.shapeFlag&128)return e.suspense.next();let t=h(e.anchor||e.el),n=t&&t[yn];return n?h(n):t},ye=!1,j=(e,t,n)=>{e==null?t._vnode&&k(t._vnode,null,null,!0):v(t._vnode||null,e,t,null,null,null,n),t._vnode=e,ye||=(ye=!0,dn(),fn(),!1)},be={p:v,um:k,m:O,r:he,mt:D,mc:re,pc:fe,pbc:ie,n:ve,o:e},xe,M;return i&&([xe,M]=i(be)),{render:j,hydrate:xe,createApp:fr(j,xe)}}function Ir({type:e,props:t},n){return n===`svg`&&e===`foreignObject`||n===`mathml`&&e===`annotation-xml`&&t&&t.encoding&&t.encoding.includes(`html`)?void 0:n}function Lr({effect:e,job:t},n){n?(e.flags|=32,t.flags|=4):(e.flags&=-33,t.flags&=-5)}function Rr(e,t){return(!e||e&&!e.pendingBranch)&&t&&!t.persisted}function zr(e,t,n=!1){let r=e.children,i=t.children;if(d(r)&&d(i))for(let e=0;e>1,e[n[s]]0&&(t[r]=n[a-1]),n[a]=r)}}for(a=n.length,o=n[a-1];a-- >0;)n[a]=o,o=t[o];return n}function Vr(e){let t=e.subTree.component;if(t)return t.asyncDep&&!t.asyncResolved?t:Vr(t)}function Hr(e){if(e)for(let t=0;thr(Ur);function Gr(e,t,n){return Kr(e,t,n)}function Kr(e,n,i=t){let{immediate:a,deep:o,flush:c,once:l}=i,u=s({},i),d=n&&a||!n&&c!==`post`,f;if(Ii){if(c===`sync`){let e=Wr();f=e.__watcherHandles||=[]}else if(!d){let e=()=>{};return e.stop=r,e.resume=r,e.pause=r,e}}let p=$;u.call=(e,t,n)=>z(e,p,t,n);let m=!1;c===`post`?u.scheduler=e=>{W(e,p&&p.suspense)}:c!==`sync`&&(m=!0,u.scheduler=(e,t)=>{t?e():cn(e)}),u.augmentJob=e=>{n&&(e.flags|=4),m&&(e.flags|=2,p&&(e.id=p.uid,e.i=p))};let h=Yt(e,n,u);return Ii&&(f?f.push(h):d&&h()),h}function qr(e,t,n){let r=this.proxy,i=h(e)?e.includes(`.`)?Jr(r,e):()=>r[e]:e.bind(r,r),a;m(t)?a=t:(a=t.handler,n=t);let o=Ni(this),s=Kr(i,a.bind(r),n);return o(),s}function Jr(e,t){let n=t.split(`.`);return()=>{let t=e;for(let e=0;et===`modelValue`||t===`model-value`?e.modelModifiers:e[`${t}Modifiers`]||e[`${w(t)}Modifiers`]||e[`${T(t)}Modifiers`];function Xr(e,n,...r){if(e.isUnmounted)return;let i=e.vnode.props||t,a=r,o=n.startsWith(`update:`),s=o&&Yr(i,n.slice(7));s&&(s.trim&&(a=r.map(e=>h(e)?e.trim():e)),s.number&&(a=r.map(D)));let c,l=i[c=ae(n)]||i[c=ae(w(n))];!l&&o&&(l=i[c=ae(T(n))]),l&&z(l,e,6,a);let u=i[c+`Once`];if(u){if(!e.emitted)e.emitted={};else if(e.emitted[c])return;e.emitted[c]=!0,z(u,e,6,a)}}function Zr(e,t,n=!1){let r=t.emitsCache,i=r.get(e);if(i!==void 0)return i;let a=e.emits,o={},c=!1;if(!m(e)){let r=e=>{let n=Zr(e,t,!0);n&&(c=!0,s(o,n))};!n&&t.mixins.length&&t.mixins.forEach(r),e.extends&&r(e.extends),e.mixins&&e.mixins.forEach(r)}return!a&&!c?(_(e)&&r.set(e,null),null):(d(a)?a.forEach(e=>o[e]=null):s(o,a),_(e)&&r.set(e,o),o)}function Qr(e,t){return!e||!a(t)?!1:(t=t.slice(2).replace(/Once$/,``),u(e,t[0].toLowerCase()+t.slice(1))||u(e,T(t))||u(e,t))}function $r(e){let{type:t,vnode:n,proxy:r,withProxy:i,propsOptions:[a],slots:s,attrs:c,emit:l,render:u,renderCache:d,props:f,data:p,setupState:m,ctx:h,inheritAttrs:g}=e,_=gn(e),v,y;try{if(n.shapeFlag&4){let e=i||r,t=e;v=Z(u.call(t,e,d,f,m,p,h)),y=c}else{let e=t;v=Z(e.length>1?e(f,{attrs:c,slots:s,emit:l}):e(f,null)),y=t.props?c:ei(c)}}catch(t){ui.length=0,Qt(t,e,1),v=X(ci)}let b=v;if(y&&g!==!1){let e=Object.keys(y),{shapeFlag:t}=b;e.length&&t&7&&(a&&e.some(o)&&(y=ti(y,a)),b=Si(b,y,!1,!0))}return n.dirs&&(b=Si(b,null,!1,!0),b.dirs=b.dirs?b.dirs.concat(n.dirs):n.dirs),n.transition&&xn(b,n.transition),v=b,gn(_),v}var ei=e=>{let t;for(let n in e)(n===`class`||n===`style`||a(n))&&((t||={})[n]=e[n]);return t},ti=(e,t)=>{let n={};for(let r in e)(!o(r)||!(r.slice(9)in t))&&(n[r]=e[r]);return n};function ni(e,t,n){let{props:r,children:i,component:a}=e,{props:o,children:s,patchFlag:c}=t,l=a.emitsOptions;if(t.dirs||t.transition)return!0;if(n&&c>=0){if(c&1024)return!0;if(c&16)return r?ri(r,o,l):!!o;if(c&8){let e=t.dynamicProps;for(let t=0;te.__isSuspense;function oi(e,t){t&&t.pendingBranch?d(e)?t.effects.push(...e):t.effects.push(e):un(e)}var G=Symbol.for(`v-fgt`),si=Symbol.for(`v-txt`),ci=Symbol.for(`v-cmt`),li=Symbol.for(`v-stc`),ui=[],K=null;function q(e=!1){ui.push(K=e?null:[])}function di(){ui.pop(),K=ui[ui.length-1]||null}var fi=1;function pi(e,t=!1){fi+=e,e<0&&K&&t&&(K.hasOnce=!0)}function mi(e){return e.dynamicChildren=fi>0?K||n:null,di(),fi>0&&K&&K.push(e),e}function J(e,t,n,r,i,a){return mi(Y(e,t,n,r,i,a,!0))}function hi(e,t,n,r,i){return mi(X(e,t,n,r,i,!0))}function gi(e){return e?e.__v_isVNode===!0:!1}function _i(e,t){return e.type===t.type&&e.key===t.key}var vi=({key:e})=>e??null,yi=({ref:e,ref_key:t,ref_for:n})=>(typeof e==`number`&&(e=``+e),e==null?null:h(e)||R(e)||m(e)?{i:H,r:e,k:t,f:!!n}:e);function Y(e,t=null,n=null,r=0,i=null,a=e===G?0:1,o=!1,s=!1){let c={__v_isVNode:!0,__v_skip:!0,type:e,props:t,key:t&&vi(t),ref:t&&yi(t),scopeId:hn,slotScopeIds:null,children:n,component:null,suspense:null,ssContent:null,ssFallback:null,dirs:null,transition:null,el:null,anchor:null,target:null,targetStart:null,targetAnchor:null,staticCount:0,shapeFlag:a,patchFlag:r,dynamicProps:i,dynamicChildren:null,appContext:null,ctx:H};return s?(Ei(c,n),a&128&&e.normalize(c)):n&&(c.shapeFlag|=h(n)?8:16),fi>0&&!o&&K&&(c.patchFlag>0||a&6)&&c.patchFlag!==32&&K.push(c),c}var X=bi;function bi(e,t=null,n=null,r=0,i=null,a=!1){if((!e||e===Un)&&(e=ci),gi(e)){let r=Si(e,t,!0);return n&&Ei(r,n),fi>0&&!a&&K&&(r.shapeFlag&6?K[K.indexOf(e)]=r:K.push(r)),r.patchFlag=-2,r}if(Ki(e)&&(e=e.__vccOpts),t){t=xi(t);let{class:e,style:n}=t;e&&!h(e)&&(t.class=O(e)),_(n)&&(Pt(n)&&!d(n)&&(n=s({},n)),t.style=ue(n))}let o=h(e)?1:ai(e)?128:bn(e)?64:_(e)?4:m(e)?2:0;return Y(e,t,n,r,i,o,a,!0)}function xi(e){return e?Pt(e)||vr(e)?s({},e):e:null}function Si(e,t,n=!1,r=!1){let{props:i,ref:a,patchFlag:o,children:s,transition:c}=e,l=t?Di(i||{},t):i,u={__v_isVNode:!0,__v_skip:!0,type:e.type,props:l,key:l&&vi(l),ref:t&&t.ref?n&&a?d(a)?a.concat(yi(t)):[a,yi(t)]:yi(t):a,scopeId:e.scopeId,slotScopeIds:e.slotScopeIds,children:s,target:e.target,targetStart:e.targetStart,targetAnchor:e.targetAnchor,staticCount:e.staticCount,shapeFlag:e.shapeFlag,patchFlag:t&&e.type!==G?o===-1?16:o|16:o,dynamicProps:e.dynamicProps,dynamicChildren:e.dynamicChildren,appContext:e.appContext,dirs:e.dirs,transition:c,component:e.component,suspense:e.suspense,ssContent:e.ssContent&&Si(e.ssContent),ssFallback:e.ssFallback&&Si(e.ssFallback),el:e.el,anchor:e.anchor,ctx:e.ctx,ce:e.ce};return c&&r&&xn(u,c.clone(u)),u}function Ci(e=` `,t=0){return X(si,null,e,t)}function wi(e=``,t=!1){return t?(q(),hi(ci,null,e)):X(ci,null,e)}function Z(e){return e==null||typeof e==`boolean`?X(ci):d(e)?X(G,null,e.slice()):gi(e)?Ti(e):X(si,null,String(e))}function Ti(e){return e.el===null&&e.patchFlag!==-1||e.memo?e:Si(e)}function Ei(e,t){let n=0,{shapeFlag:r}=e;if(t==null)t=null;else if(d(t))n=16;else if(typeof t==`object`)if(r&65){let n=t.default;n&&(n._c&&(n._d=!1),Ei(e,n()),n._c&&(n._d=!0));return}else{n=32;let r=t._;!r&&!vr(t)?t._ctx=H:r===3&&H&&(H.slots._===1?t._=1:(t._=2,e.patchFlag|=1024))}else m(t)?(t={default:t,_ctx:H},n=32):(t=String(t),r&64?(n=16,t=[Ci(t)]):n=8);e.children=t,e.shapeFlag|=n}function Di(...e){let t={};for(let n=0;n{let r;return(r=e[t])||(r=e[t]=[]),r.push(n),e=>{r.length>1?r.forEach(t=>t(e)):r[0](e)}};ji=t(`__VUE_INSTANCE_SETTERS__`,e=>$=e),Mi=t(`__VUE_SSR_SETTERS__`,e=>Ii=e)}var Ni=e=>{let t=$;return ji(e),e.scope.on(),()=>{e.scope.off(),ji(t)}},Pi=()=>{$&&$.scope.off(),ji(null)};function Fi(e){return e.vnode.shapeFlag&4}var Ii=!1;function Li(e,t=!1,n=!1){t&&Mi(t);let{props:r,children:i}=e.vnode,a=Fi(e);yr(e,r,a,t),Mr(e,i,n);let o=a?Ri(e,t):void 0;return t&&Mi(!1),o}function Ri(e,t){let n=e.type;e.accessCache=Object.create(null),e.proxy=new Proxy(e.ctx,Jn);let{setup:r}=n;if(r){Le();let n=e.setupContext=r.length>1?Wi(e):null,i=Ni(e),a=Zt(r,e,0,[e.props,n]),o=v(a);if(Re(),i(),(o||e.sp)&&!Tn(e)&&Cn(e),o){if(a.then(Pi,Pi),t)return a.then(n=>{zi(e,n,t)}).catch(t=>{Qt(t,e,0)});e.asyncDep=a}else zi(e,a,t)}else Hi(e,t)}function zi(e,t,n){m(t)?e.type.__ssrInlineRender?e.ssrRender=t:e.render=t:_(t)&&(e.setupState=Ht(t)),Hi(e,n)}var Bi,Vi;function Hi(e,t,n){let i=e.type;if(!e.render){if(!t&&Bi&&!i.render){let t=i.template||tr(e).template;if(t){let{isCustomElement:n,compilerOptions:r}=e.appContext.config,{delimiters:a,compilerOptions:o}=i;i.render=Bi(t,s(s({isCustomElement:n,delimiters:a},r),o))}}e.render=i.render||r,Vi&&Vi(e)}{let t=Ni(e);Le();try{Zn(e)}finally{Re(),t()}}}var Ui={get(e,t){return P(e,`get`,``),e[t]}};function Wi(e){return{attrs:new Proxy(e.attrs,Ui),slots:e.slots,emit:e.emit,expose:t=>{e.exposed=t||{}}}}function Gi(e){return e.exposed?e.exposeProxy||=new Proxy(Ht(Ft(e.exposed)),{get(t,n){if(n in t)return t[n];if(n in Kn)return Kn[n](e)},has(e,t){return t in e||t in Kn}}):e.proxy}function Ki(e){return m(e)&&`__vccOpts`in e}var qi=(e,t)=>Wt(e,t,Ii),Ji=`3.5.13`,Yi=void 0,Xi=typeof window<`u`&&window.trustedTypes;if(Xi)try{Yi=Xi.createPolicy(`vue`,{createHTML:e=>e})}catch{}var Zi=Yi?e=>Yi.createHTML(e):e=>e,Qi=`http://www.w3.org/2000/svg`,$i=`http://www.w3.org/1998/Math/MathML`,ea=typeof document<`u`?document:null,ta=ea&&ea.createElement(`template`),na={insert:(e,t,n)=>{t.insertBefore(e,n||null)},remove:e=>{let t=e.parentNode;t&&t.removeChild(e)},createElement:(e,t,n,r)=>{let i=t===`svg`?ea.createElementNS(Qi,e):t===`mathml`?ea.createElementNS($i,e):n?ea.createElement(e,{is:n}):ea.createElement(e);return e===`select`&&r&&r.multiple!=null&&i.setAttribute(`multiple`,r.multiple),i},createText:e=>ea.createTextNode(e),createComment:e=>ea.createComment(e),setText:(e,t)=>{e.nodeValue=t},setElementText:(e,t)=>{e.textContent=t},parentNode:e=>e.parentNode,nextSibling:e=>e.nextSibling,querySelector:e=>ea.querySelector(e),setScopeId(e,t){e.setAttribute(t,``)},insertStaticContent(e,t,n,r,i,a){let o=n?n.previousSibling:t.lastChild;if(i&&(i===a||i.nextSibling))for(;t.insertBefore(i.cloneNode(!0),n),!(i===a||!(i=i.nextSibling)););else{ta.innerHTML=Zi(r===`svg`?`${e}`:r===`mathml`?`${e}`:e);let i=ta.content;if(r===`svg`||r===`mathml`){let e=i.firstChild;for(;e.firstChild;)i.appendChild(e.firstChild);i.removeChild(e)}t.insertBefore(i,n)}return[o?o.nextSibling:t.firstChild,n?n.previousSibling:t.lastChild]}},ra=Symbol(`_vtc`);function ia(e,t,n){let r=e[ra];r&&(t=(t?[t,...r]:[...r]).join(` `)),t==null?e.removeAttribute(`class`):n?e.setAttribute(`class`,t):e.className=t}var aa=Symbol(`_vod`),oa=Symbol(`_vsh`),sa=Symbol(``),ca=/(^|;)\s*display\s*:/;function la(e,t,n){let r=e.style,i=h(n),a=!1;if(n&&!i){if(t)if(h(t))for(let e of t.split(`;`)){let t=e.slice(0,e.indexOf(`:`)).trim();n[t]??da(r,t,``)}else for(let e in t)n[e]??da(r,e,``);for(let e in n)e===`display`&&(a=!0),da(r,e,n[e])}else if(i){if(t!==n){let e=r[sa];e&&(n+=`;`+e),r.cssText=n,a=ca.test(n)}}else t&&e.removeAttribute(`style`);aa in e&&(e[aa]=a?r.display:``,e[oa]&&(r.display=`none`))}var ua=/\s*!important$/;function da(e,t,n){if(d(n))n.forEach(n=>da(e,t,n));else if(n??=``,t.startsWith(`--`))e.setProperty(t,n);else{let r=ma(e,t);ua.test(n)?e.setProperty(T(r),n.replace(ua,``),`important`):e[r]=n}}var fa=[`Webkit`,`Moz`,`ms`],pa={};function ma(e,t){let n=pa[t];if(n)return n;let r=w(t);if(r!==`filter`&&r in e)return pa[t]=r;r=ie(r);for(let n=0;nwa||=(Ta.then(()=>wa=0),Date.now());function Da(e,t){let n=e=>{if(!e._vts)e._vts=Date.now();else if(e._vts<=n.attached)return;z(Oa(e,n.value),t,5,[e])};return n.value=e,n.attached=Ea(),n}function Oa(e,t){if(d(t)){let n=e.stopImmediatePropagation;return e.stopImmediatePropagation=()=>{n.call(e),e._stopped=!0},t.map(e=>t=>!t._stopped&&e&&e(t))}else return t}var ka=e=>e.charCodeAt(0)===111&&e.charCodeAt(1)===110&&e.charCodeAt(2)>96&&e.charCodeAt(2)<123,Aa=(e,t,n,r,i,s)=>{let c=i===`svg`;t===`class`?ia(e,r,c):t===`style`?la(e,n,r):a(t)?o(t)||xa(e,t,n,r,s):(t[0]===`.`?(t=t.slice(1),!0):t[0]===`^`?(t=t.slice(1),!1):ja(e,t,r,c))?(_a(e,t,r),!e.tagName.includes(`-`)&&(t===`value`||t===`checked`||t===`selected`)&&ga(e,t,r,c,s,t!==`value`)):e._isVueCE&&(/[A-Z]/.test(t)||!h(r))?_a(e,w(t),r,s,t):(t===`true-value`?e._trueValue=r:t===`false-value`&&(e._falseValue=r),ga(e,t,r,c))};function ja(e,t,n,r){if(r)return!!(t===`innerHTML`||t===`textContent`||t in e&&ka(t)&&m(n));if(t===`spellcheck`||t===`draggable`||t===`translate`||t===`form`||t===`list`&&e.tagName===`INPUT`||t===`type`&&e.tagName===`TEXTAREA`)return!1;if(t===`width`||t===`height`){let t=e.tagName;if(t===`IMG`||t===`VIDEO`||t===`CANVAS`||t===`SOURCE`)return!1}return ka(t)&&h(n)?!1:t in e}var Ma=s({patchProp:Aa},na),Na;function Pa(){return Na||=Pr(Ma)}var Fa=(...e)=>{let t=Pa().createApp(...e),{mount:n}=t;return t.mount=e=>{let r=La(e);if(!r)return;let i=t._component;!m(i)&&!i.render&&!i.template&&(i.template=r.innerHTML),r.nodeType===1&&(r.textContent=``);let a=n(r,!1,Ia(r));return r instanceof Element&&(r.removeAttribute(`v-cloak`),r.setAttribute(`data-v-app`,``)),a},t};function Ia(e){if(e instanceof SVGElement)return`svg`;if(typeof MathMLElement==`function`&&e instanceof MathMLElement)return`mathml`}function La(e){return h(e)?document.querySelector(e):e}var Ra={class:`sidebar`},za={class:`panel`},Ba={class:`panel__header`},Va={class:`step-list`},Ha=[`onClick`],Ua={class:`step-list__index`},Wa={class:`panel panel--muted`},Ga=Sn({__name:`TutorialSidebar`,props:{lessons:{},activeLessonId:{}},emits:[`selectLesson`],setup(e,{emit:t}){let n=e,r=t;function i(e){r(`selectLesson`,e)}function a(){return n.lessons.find(e=>e.id===n.activeLessonId)??n.lessons[0]}return(e,t)=>(q(),J(`aside`,Ra,[t[2]||=Y(`div`,{class:`sidebar__header`},[Y(`p`,{class:`sidebar__eyebrow`},`Meteor Admin SDK`),Y(`h1`,{class:`sidebar__title`},`Interactive tutorial prototype`),Y(`p`,{class:`sidebar__description`},` A browser-based learning experience with editable code and a minimal dummy admin. `)],-1),Y(`section`,za,[Y(`div`,Ba,[t[0]||=Y(`h2`,null,`Prototype steps`,-1),Y(`span`,null,A(a().order)+` / `+A(e.lessons.length),1)]),Y(`ol`,Va,[(q(!0),J(G,null,Wn(e.lessons,t=>(q(),J(`li`,{key:t.id},[Y(`button`,{type:`button`,class:O([`step-list__item`,{"step-list__item--active":t.id===e.activeLessonId}]),onClick:e=>i(t.id)},[Y(`span`,Ua,A(String(t.order).padStart(2,`0`)),1),Y(`div`,null,[Y(`strong`,null,A(t.title),1),Y(`p`,null,A(t.summary),1)])],10,Ha)]))),128))])]),Y(`section`,Wa,[t[1]||=Y(`h2`,null,`Current objective`,-1),Y(`p`,null,A(a().objective),1)]),t[3]||=Y(`section`,{class:`panel panel--subtle`},[Y(`h2`,null,`How to use this prototype`),Y(`p`,null,`Edit the code, click Run, and inspect how the dummy admin reacts.`)],-1)]))}}),Ka=(e,t)=>{let n=e.__vccOpts||e;for(let[e,r]of t)n[e]=r;return n},qa=Ka(Ga,[[`__scopeId`,`data-v-3afbe203`]]),Ja={class:`editor-panel`},Ya={class:`editor-panel__header`},Xa={class:`editor-panel__description`},Za={class:`editor-panel__surface`},Qa={class:`editor-panel__gutter`},$a=[`value`],eo=Ka(Sn({__name:`CodeEditorPanel`,props:{title:{},description:{},code:{},resetVersion:{}},emits:[`updateCode`],setup(e,{emit:t}){let n=e,r=t,i=Lt(n.code);Gr(()=>n.code,e=>{i.value=e}),Gr(()=>n.resetVersion,()=>{i.value=n.code});let a=qi(()=>{let e=i.value.split(` +`).length;return Array.from({length:e},(e,t)=>t+1)});function o(e){let t=e.target.value;i.value=t,r(`updateCode`,t)}return(e,t)=>(q(),J(`div`,Ja,[Y(`div`,Ya,[Y(`div`,null,[t[0]||=Y(`p`,{class:`editor-panel__label`},`Editor`,-1),Y(`h2`,null,A(e.title),1)]),t[1]||=Y(`div`,{class:`editor-panel__tab`},`main.ts`,-1)]),Y(`p`,Xa,A(e.description),1),Y(`div`,Za,[Y(`div`,Qa,[(q(!0),J(G,null,Wn(a.value,e=>(q(),J(`span`,{key:e},A(e),1))),128))]),Y(`textarea`,{class:`editor-panel__input`,value:i.value,spellcheck:`false`,autocapitalize:`off`,autocomplete:`off`,autocorrect:`off`,onInput:o},null,40,$a)])]))}}),[[`__scopeId`,`data-v-680a50e0`]]),to={class:`dummy-admin`},no={class:`dummy-admin__sidebar`},ro={key:0},io={class:`dummy-admin__content`},ao={class:`dummy-admin__empty-state`},oo={class:`dummy-admin__canvas`},so={key:0,class:`dummy-admin__card-label`},co={class:`dummy-admin__card-title`},lo={key:1,class:`dummy-admin__card-injected`},uo=Ka(Sn({__name:`DummyAdminShell`,props:{runtimeState:{}},setup(e){return(e,t)=>(q(),J(`div`,to,[Y(`aside`,no,[t[0]||=Y(`strong`,null,`Admin`,-1),(q(!0),J(G,null,Wn(e.runtimeState.menuItems,e=>(q(),J(`div`,{key:e.id,class:`dummy-admin__menu-item`},[Y(`span`,null,A(e.label),1),e.kind===`dynamic`?(q(),J(`small`,ro,`New`)):wi(``,!0)]))),128))]),Y(`div`,io,[Y(`div`,{class:O([`dummy-admin__notification`,`dummy-admin__notification--${e.runtimeState.notificationTone}`])},[Y(`strong`,null,A(e.runtimeState.notificationTitle),1),Y(`p`,null,A(e.runtimeState.notificationMessage),1)],2),Y(`div`,ao,[Y(`strong`,null,A(e.runtimeState.emptyStateTitle),1),Y(`p`,null,A(e.runtimeState.emptyStateMessage),1)]),Y(`div`,oo,[(q(!0),J(G,null,Wn(e.runtimeState.surfaces,e=>(q(),J(`div`,{key:e.id,class:O([`dummy-admin__card`,{"dummy-admin__card--ghost":e.variant===`ghost`}])},[e.slotLabel?(q(),J(`span`,so,A(e.slotLabel),1)):wi(``,!0),Y(`strong`,co,A(e.title),1),Y(`p`,null,A(e.description),1),e.injectedContent?(q(),J(`div`,lo,A(e.injectedContent),1)):wi(``,!0)],2))),128))])])]))}}),[[`__scopeId`,`data-v-0ec55409`]]),fo={class:`preview-stack`},po={class:`preview-panel`},mo={class:`preview-panel__header`},ho={class:`preview-panel__status`},go={class:`preview-panel preview-panel--output`},_o={class:`preview-panel__output-message`},vo={class:`preview-panel__output-empty`},yo={key:0,class:`preview-panel__output-error`},bo=Ka(Sn({__name:`PreviewPanel`,props:{runtimeState:{},previewResetVersion:{},outputMessage:{},executionMessage:{},executionError:{}},setup(e){return(e,t)=>(q(),J(`div`,fo,[Y(`section`,po,[Y(`div`,mo,[t[0]||=Y(`div`,null,[Y(`p`,{class:`preview-panel__label`},`Preview`),Y(`h2`,null,`Dummy admin shell`)],-1),Y(`span`,ho,A(e.runtimeState.statusLabel),1)]),X(uo,{"runtime-state":e.runtimeState},null,8,[`runtime-state`])]),Y(`section`,go,[t[1]||=Y(`div`,{class:`preview-panel__header`},[Y(`div`,null,[Y(`p`,{class:`preview-panel__label`},`Output`),Y(`h2`,null,`Status`)])],-1),Y(`p`,_o,A(e.outputMessage),1),Y(`p`,vo,A(e.executionMessage),1),e.executionError?(q(),J(`p`,yo,A(e.executionError),1)):wi(``,!0)])]))}}),[[`__scopeId`,`data-v-b1c79e15`]]),xo={class:`workspace`},So={class:`workspace__panel workspace__panel--editor`},Co=Ka(Sn({__name:`TutorialWorkspace`,props:{lesson:{},code:{},editorResetVersion:{},previewResetVersion:{},runtimeState:{},executionMessage:{},executionError:{}},emits:[`updateCode`,`resetCode`,`runCode`],setup(e,{emit:t}){let n=t;function r(e){n(`updateCode`,e)}function i(){n(`resetCode`)}function a(){n(`runCode`)}return(e,t)=>(q(),J(`section`,xo,[Y(`div`,So,[Y(`div`,{class:`workspace__panel-header`},[Y(`div`,{class:`workspace__actions`},[Y(`button`,{type:`button`,onClick:i},`Reset`),Y(`button`,{type:`button`,class:`workspace__button--primary`,onClick:a},`Run`)])]),X(eo,{title:e.lesson.title,description:e.lesson.description,code:e.code,"reset-version":e.editorResetVersion,onUpdateCode:r},null,8,[`title`,`description`,`code`,`reset-version`])]),X(bo,{"runtime-state":e.runtimeState,"preview-reset-version":e.previewResetVersion,"output-message":e.lesson.outputMessage,"execution-message":e.executionMessage,"execution-error":e.executionError},null,8,[`runtime-state`,`preview-reset-version`,`output-message`,`execution-message`,`execution-error`])]))}}),[[`__scopeId`,`data-v-bf65792a`]]),wo=[{id:`notifications`,order:1,title:`Notifications`,summary:`Trigger feedback in the dummy admin shell.`,description:`Start with a simple action that shows how Admin SDK calls can create visible UI feedback for the user. Edit the notification text and re-run to see the toast update.`,objective:`Edit the code to change the notification title, message, or tone.`,starterCode:`sdk.notification.dispatch({ + title: 'Hello Meteor', + message: 'Welcome to the interactive Admin SDK tutorial.', + tone: 'success', +});`,previewLabel:`Notification concept`,outputMessage:`This lesson teaches the notification flow. Change the title, message, or tone and run the code to update the toast preview.`},{id:`menu-items`,order:2,title:`Menu items`,summary:`See how navigation registration could feel.`,description:`Use a lightweight dummy sidebar to explain how extension points can add new entry points into the admin navigation. Re-run the lesson after changing the label or position.`,objective:`Edit the code to add, rename, or reposition a custom navigation entry.`,starterCode:`sdk.menu.add({ + label: 'My Extension', + position: 20, +});`,previewLabel:`Navigation concept`,outputMessage:`This lesson focuses on navigation. Change the label or position and run the code to see the sidebar update.`},{id:`locations-positions`,order:3,title:`Locations & positions`,summary:`Understand placement using simplified extension surfaces.`,description:`Visualize named extension surfaces with simple cards so learners can understand where content appears without needing a full Shopware Administration shell. Change the target position and re-run to move the injected content.`,objective:`Edit the code to move content into the intended location or position.`,starterCode:`sdk.location.render({ + locationId: 'sw-product-detail-actions', + positionId: 'after-primary-action', + content: 'Injected action card', +});`,previewLabel:`Extension surfaces concept`,outputMessage:`This lesson explains location IDs and position IDs. Change the target position and run the code to move the injected content between the labeled slots.`}];function To(e){let t=e.id===`locations-positions`?[{id:`before-primary-action`,title:`sw-product-detail-actions`,description:`Position: before-primary-action`,variant:`ghost`,slotLabel:`Empty slot`},{id:`after-primary-action`,title:`sw-product-detail-actions`,description:`Position: after-primary-action`,variant:`ghost`,slotLabel:`Empty slot`}]:[{id:`primary`,title:e.title,description:e.summary,variant:`default`},{id:`secondary`,title:`Try this next`,description:e.objective,variant:`ghost`}];return{statusLabel:e.previewLabel,notificationTitle:`Preview ready`,notificationMessage:`Preview ready`,notificationTone:`info`,emptyStateTitle:`Preview ready`,emptyStateMessage:`This dummy admin is intentionally minimal. Later batches will connect the learner code so this area reacts in real time.`,menuItems:[{id:`dashboard`,label:`Dashboard`,kind:`static`,position:10},{id:`extensions`,label:`Extensions`,kind:`static`,position:20},{id:`settings`,label:`Settings`,kind:`static`,position:30}],surfaces:t}}function Eo(e){return To(e)}function Do(e,t){try{return Function(`sdk`,`'use strict';\n${e}`)(t),{ok:!0,message:`Code executed successfully in the dummy admin runtime.`}}catch(e){return{ok:!1,message:`Code execution failed.`,error:e instanceof Error?e.message:`Unknown execution error`}}}function Oo(e){return e.toLowerCase().replace(/[^a-z0-9]+/g,`-`).replace(/(^-|-$)/g,``)}function ko(e){return{notification:{dispatch(t){e.value.notificationTitle=t.title,e.value.notificationMessage=t.message,e.value.notificationTone=t.tone??`info`,e.value.emptyStateTitle=t.title,e.value.emptyStateMessage=t.message}},menu:{add(t){let n={id:`dynamic-${Oo(t.label)}`,label:t.label,kind:`dynamic`,position:t.position};e.value.menuItems=[...e.value.menuItems.filter(e=>e.id!==n.id),n].sort((e,t)=>(e.position??999)-(t.position??999)),e.value.statusLabel=`Navigation concept`,e.value.notificationTitle=`Menu item added`,e.value.notificationMessage=`“${t.label}” is now visible in the dummy admin navigation.`,e.value.notificationTone=`success`,e.value.emptyStateTitle=`Menu item registered`,e.value.emptyStateMessage=`Added “${t.label}” to the dummy admin navigation.`}},location:{render(t){e.value.surfaces=e.value.surfaces.map(e=>e.id===t.positionId?{...e,title:t.locationId,description:`Position: ${t.positionId??`default`}`,slotLabel:`Injected content`,injectedContent:t.content,variant:`default`}:e),e.value.statusLabel=`Extension surfaces concept`,e.value.notificationTitle=`Location content rendered`,e.value.notificationMessage=`Injected content into ${t.locationId}${t.positionId?` at ${t.positionId}`:``}.`,e.value.notificationTone=`success`,e.value.emptyStateTitle=`Location content rendered`,e.value.emptyStateMessage=`Rendered content into ${t.locationId}${t.positionId?` at ${t.positionId}`:``}.`}},reset(t){e.value=structuredClone(t)}}}var Ao={class:`app-shell`};Fa(Ka(Sn({__name:`App`,setup(e){let t=Lt(wo[0]?.id??``),n=Lt(wo[0]?.starterCode??``),r=Lt(0),i=Lt(0),a=Lt(`Ready to execute starter code.`),o=Lt(null),s=qi(()=>wo.find(e=>e.id===t.value)??wo[0]),c=Lt(To(s.value)),l=ko(c);function u(){i.value+=1,l.reset(Eo(s.value));let e=Do(n.value,l);a.value=e.message,o.value=e.error??null}Gr(t,()=>{n.value=s.value.starterCode,r.value+=1,u()});function d(e){t.value=e}function f(e){n.value=e}function p(){n.value=s.value.starterCode,r.value+=1,a.value=`Starter code restored. Run the lesson again to refresh the preview.`,o.value=null}return u(),(e,l)=>(q(),J(`main`,Ao,[X(qa,{lessons:Bt(wo),"active-lesson-id":t.value,onSelectLesson:d},null,8,[`lessons`,`active-lesson-id`]),X(Co,{lesson:s.value,code:n.value,"editor-reset-version":r.value,"preview-reset-version":i.value,"runtime-state":c.value,"execution-message":a.value,"execution-error":o.value,onUpdateCode:f,onResetCode:p,onRunCode:u},null,8,[`lesson`,`code`,`editor-reset-version`,`preview-reset-version`,`runtime-state`,`execution-message`,`execution-error`])]))}}),[[`__scopeId`,`data-v-f33a8faa`]])).mount(`#app`); \ No newline at end of file diff --git a/packages/admin-sdk-tutorial/dist/assets/index-DRQqKgZ3.css b/packages/admin-sdk-tutorial/dist/assets/index-DRQqKgZ3.css new file mode 100644 index 000000000..55cb77348 --- /dev/null +++ b/packages/admin-sdk-tutorial/dist/assets/index-DRQqKgZ3.css @@ -0,0 +1 @@ +.sidebar[data-v-3afbe203]{align-content:start;gap:16px;display:grid}.sidebar__header[data-v-3afbe203],.panel[data-v-3afbe203]{background:#fff;border:1px solid #d8e0eb;border-radius:20px;padding:24px;box-shadow:0 16px 40px #0f172a0f}.sidebar__eyebrow[data-v-3afbe203]{color:#4f46e5;letter-spacing:.08em;text-transform:uppercase;margin:0 0 10px;font-size:12px;font-weight:700}.sidebar__title[data-v-3afbe203]{margin:0 0 12px;font-size:36px;line-height:1.05}.sidebar__description[data-v-3afbe203],.panel p[data-v-3afbe203]{color:#526072;margin:0;font-size:15px;line-height:1.6}.panel[data-v-3afbe203]{gap:18px;display:grid}.panel h2[data-v-3afbe203]{margin:0;font-size:18px}.panel__header[data-v-3afbe203]{justify-content:space-between;align-items:center;gap:16px;display:flex}.panel__header span[data-v-3afbe203]{color:#66758a;font-size:13px;font-weight:600}.step-list[data-v-3afbe203]{gap:12px;margin:0;padding:0;list-style:none;display:grid}.step-list__item[data-v-3afbe203]{text-align:left;cursor:pointer;width:100%;font:inherit;background:#f9fbfd;border:1px solid #e4eaf3;border-radius:16px;grid-template-columns:auto 1fr;gap:14px;padding:14px;display:grid}.step-list__item--active[data-v-3afbe203]{background:linear-gradient(#eef2ff 0%,#f8fbff 100%);border-color:#c7d2fe}.step-list__item strong[data-v-3afbe203]{margin-bottom:4px;font-size:15px;display:block}.step-list__item p[data-v-3afbe203]{font-size:14px}.step-list__index[data-v-3afbe203]{color:#fff;background:#111827;border-radius:12px;place-items:center;width:40px;height:40px;font-size:12px;font-weight:700;display:inline-grid}.panel--muted[data-v-3afbe203]{background:#f8fafc}.panel--subtle[data-v-3afbe203]{background:#fdfefe}.editor-panel[data-v-680a50e0]{gap:18px;min-height:0;display:grid}.editor-panel__header[data-v-680a50e0]{justify-content:space-between;align-items:center;gap:16px;display:flex}.editor-panel__label[data-v-680a50e0]{color:#64748b;letter-spacing:.08em;text-transform:uppercase;margin:0;font-size:12px;font-weight:700}.editor-panel__header h2[data-v-680a50e0]{margin:4px 0 0;font-size:20px}.editor-panel__tab[data-v-680a50e0]{color:#334155;background:#f8fafc;border:1px solid #d7dfeb;border-radius:12px;padding:8px 12px;font-family:SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace;font-size:13px;font-weight:600}.editor-panel__description[data-v-680a50e0]{color:#526072;margin:0;line-height:1.6}.editor-panel__surface[data-v-680a50e0]{color:#e2e8f0;background:#0f172a;border:1px solid #dbe2ec;border-radius:16px;grid-template-columns:auto minmax(0,1fr);min-height:0;display:grid;overflow:hidden}.editor-panel__gutter[data-v-680a50e0]{color:#64748b;background:#111b31;align-content:start;gap:4px;padding:20px 14px;font-family:SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace;font-size:13px;display:grid}.editor-panel__input[data-v-680a50e0]{resize:none;min-height:100%;color:inherit;white-space:pre;tab-size:2;background:0 0;border:0;outline:none;padding:20px;font-family:SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace;font-size:14px;line-height:1.7}.dummy-admin[data-v-0ec55409]{background:#f8fafc;border:1px solid #dbe2ec;border-radius:18px;grid-template-columns:132px minmax(0,1fr);min-height:360px;display:grid;overflow:hidden}.dummy-admin__sidebar[data-v-0ec55409]{color:#e5eefb;background:#111827;align-content:start;gap:12px;padding:18px 16px;display:grid}.dummy-admin__menu-item[data-v-0ec55409]{justify-content:space-between;align-items:center;gap:8px;display:flex}.dummy-admin__sidebar span[data-v-0ec55409]{color:#b8c3d4;font-size:14px}.dummy-admin__menu-item small[data-v-0ec55409]{color:#c7d2fe;text-transform:uppercase;background:#312e81;border-radius:999px;padding:2px 6px;font-size:11px;font-weight:700}.dummy-admin__content[data-v-0ec55409]{align-content:start;gap:16px;padding:16px;display:grid}.dummy-admin__notification[data-v-0ec55409]{border-radius:14px;gap:4px;padding:12px 14px;font-size:14px;display:grid}.dummy-admin__notification strong[data-v-0ec55409]{font-size:14px}.dummy-admin__notification p[data-v-0ec55409]{margin:0}.dummy-admin__notification--info[data-v-0ec55409]{color:#4338ca;background:#eef2ff;border:1px dashed #c7d2fe}.dummy-admin__notification--success[data-v-0ec55409]{color:#166534;background:#f0fdf4;border:1px dashed #86efac}.dummy-admin__empty-state[data-v-0ec55409]{background:#fff;border:1px solid #d8e0eb;border-radius:14px;padding:14px 16px}.dummy-admin__empty-state strong[data-v-0ec55409]{margin-bottom:6px;font-size:14px;display:block}.dummy-admin__card-title[data-v-0ec55409]{margin-bottom:8px;font-size:14px;display:block}.dummy-admin__card-label[data-v-0ec55409]{color:#334155;text-transform:uppercase;background:#e2e8f0;border-radius:999px;margin-bottom:10px;padding:4px 8px;font-size:11px;font-weight:700;display:inline-block}.dummy-admin__empty-state p[data-v-0ec55409],.dummy-admin__card p[data-v-0ec55409]{color:#526072;margin:0;line-height:1.6}.dummy-admin__card-injected[data-v-0ec55409]{color:#1d4ed8;background:#eff6ff;border:1px dashed #93c5fd;border-radius:12px;margin-top:12px;padding:12px 14px;font-weight:600}.dummy-admin__canvas[data-v-0ec55409]{gap:14px;display:grid}.dummy-admin__card[data-v-0ec55409]{background:#fff;border:1px solid #d8e0eb;border-radius:16px;min-height:120px;padding:16px}.dummy-admin__card--ghost[data-v-0ec55409]{background:#f8fafc;border-style:dashed}@media (width<=720px){.dummy-admin[data-v-0ec55409]{grid-template-columns:1fr}.dummy-admin__sidebar[data-v-0ec55409]{grid-auto-columns:max-content;grid-auto-flow:column;align-items:center;overflow:auto}}.preview-stack[data-v-b1c79e15]{grid-template-rows:minmax(0,1fr) auto;gap:16px;min-width:0;display:grid}.preview-panel[data-v-b1c79e15]{background:#fff;border:1px solid #d8e0eb;border-radius:20px;gap:18px;min-width:0;padding:20px;display:grid;box-shadow:0 16px 40px #0f172a0f}.preview-panel__header[data-v-b1c79e15]{justify-content:space-between;align-items:center;gap:16px;display:flex}.preview-panel__header h2[data-v-b1c79e15]{margin:4px 0 0;font-size:20px}.preview-panel__label[data-v-b1c79e15]{color:#64748b;letter-spacing:.08em;text-transform:uppercase;margin:0;font-size:12px;font-weight:700}.preview-panel__status[data-v-b1c79e15]{color:#4338ca;background:#eef2ff;border-radius:999px;padding:8px 12px;font-size:13px;font-weight:700}.preview-panel__output-message[data-v-b1c79e15],.preview-panel__output-empty[data-v-b1c79e15]{color:#526072;margin:0;line-height:1.6}.preview-panel__output-empty[data-v-b1c79e15]{background:#f8fafc;border:1px dashed #d8e0eb;border-radius:14px;padding:12px 14px}.preview-panel__output-error[data-v-b1c79e15]{color:#b91c1c;background:#fef2f2;border:1px solid #fecaca;border-radius:14px;margin:0;padding:12px 14px;line-height:1.6}@media (width<=720px){.preview-panel__header[data-v-b1c79e15]{flex-direction:column;align-items:flex-start}}.workspace[data-v-bf65792a]{grid-template-columns:minmax(0,1.1fr) minmax(360px,.9fr);gap:16px;min-width:0;display:grid}.workspace__panel[data-v-bf65792a]{background:#fff;border:1px solid #d8e0eb;border-radius:20px;gap:18px;min-width:0;padding:20px;display:grid;box-shadow:0 16px 40px #0f172a0f}.workspace__panel--editor[data-v-bf65792a]{min-height:calc(100vh - 40px)}.workspace__panel-header[data-v-bf65792a]{justify-content:space-between;align-items:center;gap:16px;display:flex}.workspace__panel-header h2[data-v-bf65792a]{margin:4px 0 0;font-size:20px}.workspace__actions[data-v-bf65792a]{gap:10px;display:flex}.workspace__actions button[data-v-bf65792a]{color:#1f2937;font:inherit;cursor:pointer;background:#fff;border:1px solid #d7dfeb;border-radius:12px;padding:10px 14px}.workspace__button--primary[data-v-bf65792a]{color:#fff!important;background:#4f46e5!important;border-color:#4f46e5!important}@media (width<=1200px){.workspace[data-v-bf65792a]{grid-template-columns:1fr}.workspace__panel--editor[data-v-bf65792a]{min-height:520px}}@media (width<=720px){.workspace__panel-header[data-v-bf65792a]{flex-direction:column;align-items:flex-start}}*{box-sizing:border-box}html{min-height:100%;margin:0}body{color:#1f2937;background:#eef2f7;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}.app-shell[data-v-f33a8faa]{grid-template-columns:minmax(320px,420px) minmax(0,1fr);gap:20px;min-height:100vh;padding:20px;display:grid}@media (width<=960px){.app-shell[data-v-f33a8faa]{grid-template-rows:auto 1fr;grid-template-columns:1fr}} diff --git a/packages/admin-sdk-tutorial/dist/favicon.svg b/packages/admin-sdk-tutorial/dist/favicon.svg new file mode 100644 index 000000000..d96eee733 --- /dev/null +++ b/packages/admin-sdk-tutorial/dist/favicon.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/packages/admin-sdk-tutorial/dist/index.html b/packages/admin-sdk-tutorial/dist/index.html new file mode 100644 index 000000000..786af5e4a --- /dev/null +++ b/packages/admin-sdk-tutorial/dist/index.html @@ -0,0 +1,14 @@ + + + + + + + Meteor Admin SDK Tutorial Prototype + + + + +
+ + diff --git a/packages/admin-sdk-tutorial/env.d.ts b/packages/admin-sdk-tutorial/env.d.ts new file mode 100644 index 000000000..11f02fe2a --- /dev/null +++ b/packages/admin-sdk-tutorial/env.d.ts @@ -0,0 +1 @@ +/// diff --git a/packages/admin-sdk-tutorial/index.html b/packages/admin-sdk-tutorial/index.html new file mode 100644 index 000000000..1b153bf42 --- /dev/null +++ b/packages/admin-sdk-tutorial/index.html @@ -0,0 +1,13 @@ + + + + + + + Meteor Admin SDK Tutorial Prototype + + +
+ + + diff --git a/packages/admin-sdk-tutorial/package.json b/packages/admin-sdk-tutorial/package.json new file mode 100644 index 000000000..6a549c5ad --- /dev/null +++ b/packages/admin-sdk-tutorial/package.json @@ -0,0 +1,28 @@ +{ + "name": "@shopware-ag/meteor-admin-sdk-tutorial", + "version": "0.0.0", + "private": true, + "type": "module", + "scripts": { + "dev": "vite", + "build": "run-p type-check \"build-only {@}\" --", + "build-only": "vite build", + "preview": "vite preview", + "type-check": "vue-tsc --build" + }, + "dependencies": { + "@shopware-ag/meteor-admin-sdk": "workspace:*", + "@shopware-ag/meteor-component-library": "workspace:*", + "vue": "^3.5.13" + }, + "devDependencies": { + "@tsconfig/node22": "^22.0.1", + "@types/node": "^25.5.0", + "@vitejs/plugin-vue": "^6.0.5", + "@vue/tsconfig": "^0.7.0", + "npm-run-all2": "^8.0.4", + "typescript": "~5.8.0", + "vite": "^8.0.0", + "vue-tsc": "^3.2.5" + } +} diff --git a/packages/admin-sdk-tutorial/public/favicon.svg b/packages/admin-sdk-tutorial/public/favicon.svg new file mode 100644 index 000000000..d96eee733 --- /dev/null +++ b/packages/admin-sdk-tutorial/public/favicon.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/packages/admin-sdk-tutorial/src/App.vue b/packages/admin-sdk-tutorial/src/App.vue new file mode 100644 index 000000000..0b9c6297c --- /dev/null +++ b/packages/admin-sdk-tutorial/src/App.vue @@ -0,0 +1,111 @@ + + + + + diff --git a/packages/admin-sdk-tutorial/src/components/.gitkeep b/packages/admin-sdk-tutorial/src/components/.gitkeep new file mode 100644 index 000000000..e69de29bb diff --git a/packages/admin-sdk-tutorial/src/components/CodeEditorPanel.vue b/packages/admin-sdk-tutorial/src/components/CodeEditorPanel.vue new file mode 100644 index 000000000..e1bda4139 --- /dev/null +++ b/packages/admin-sdk-tutorial/src/components/CodeEditorPanel.vue @@ -0,0 +1,157 @@ + + +