@videojs/html 10.0.0-beta.28 → 10.0.0-beta.29

package/docs/reference/menu.md

@@ -494,22 +494,6 @@ Description
 
 Initial open state (uncontrolled).
 
-`isSubmenu`
-
-`boolean`
-
-`false`
-
-▸
-
-Attribute
-
-`is-submenu`
-
-Description
-
-True when this menu instance is nested inside a parent menu's content.
-
 `open`
 
 `boolean`
@@ -626,7 +610,7 @@ Present when the menu is open.
 
 `data-side`
 
-`undefined | 'top' | 'bottom' | 'left'...`
+`undefined | 'left' | 'right' | 'top' ...`
 
 ▸
 
@@ -636,11 +620,11 @@ Rendered positioning side after collision handling. Absent on submenus.
 
 Type
 
-`undefined | 'top' | 'bottom' | 'left' | 'right'`
+`undefined | 'left' | 'right' | 'top' | 'bottom'`
 
 `data-align`
 
-`undefined | 'start' | 'center' | 'end'`
+`undefined | 'center' | 'start' | 'end'`
 
 ▸
 

package/docs/reference/popover.md

@@ -392,7 +392,7 @@ Present when the popover is open.
 
 `data-side`
 
-`'top' | 'bottom' | 'left' | 'right'`
+`'left' | 'right' | 'top' | 'bottom'`
 
 ▸
 
@@ -402,7 +402,7 @@ Indicates the rendered side of the popover after collision handling.
 
 `data-align`
 
-`'start' | 'center' | 'end'`
+`'center' | 'start' | 'end'`
 
 ▸
 

package/docs/reference/poster.md

@@ -4,43 +4,138 @@ Poster image component that displays a thumbnail until video playback starts
 
 ## Anatomy
 
-Import the component:
-
 html
 
 ```
 <media-poster>
-  <img src="poster.jpg" alt="Video preview" />
+  <img alt="" />
 </media-poster>
 ```
 
 ## Behavior
 
-The poster is visible before playback starts. Once the user plays or seeks, the poster hides permanently — pausing does not bring it back. The poster reappears when a new source is loaded.
+The poster shows before playback starts. Once the user plays or seeks, it hides; pausing does not bring it back. Loading a new source shows it again.
+
+You can set the poster URL on the player. This is useful when you want to change the poster from inside a skin, or keep all your media metadata in one place:
+
+html
+
+```
+<video-player poster="poster.jpg"></video-player>
+```
+
+## Supply your own image
+
+The component fills in a source only when you leave one out. `srcset`, `sizes`, `loading`, `<picture>`, and framework image components all stay available.
+
+`<media-poster>` renders no image of its own. It fills in the `src` of the image you put inside it:
+
+html
+
+```
+<media-poster>
+  <img alt="" />
+</media-poster>
+```
+
+Give that image a `src`, a `srcset`, or `<source>` candidates and it is yours; the component leaves it alone:
+
+html
+
+```
+<media-poster>
+  <img src="poster.jpg" srcset="poster-480.jpg 480w, poster-1080.jpg 1080w" alt="Keynote speaker" />
+</media-poster>
+```
+
+Inside a skin, slot your image instead. The skin carries a plain one that yours replaces:
+
+html
+
+```
+<video-skin>
+  <video src="video.mp4" playsinline></video>
+  <img slot="poster" src="poster.jpg" alt="Keynote speaker" />
+</video-skin>
+```
+
+A skin can only style an `<img>` you slot directly. Wrap one in a `<picture>` or a framework component and its sizing is yours.
 
 ## Styling
 
-Style the poster with the `[data-visible]` attribute:
+Attribute
+
+Values
+
+Description
+
+`data-visible`
+
+Present / absent
+
+Present before playback starts
+
+`data-loading`
+
+Present / absent
+
+Present while the image is fetching
+
+`data-loaded`
+
+Present / absent
+
+Present once the image has loaded
+
+`data-error`
+
+Present / absent
+
+Present when the image failed
+
+The three load attributes track the image on screen, including one you supplied yourself.
 
 css
 
 ```
 media-poster:not([data-visible]) {
-  display: none;
+  opacity: 0;
 }
 ```
 
-You control the child `<img>` — this means `srcset`, `sizes`, `loading="lazy"`, and framework image components all work naturally.
+The image is an ordinary child, so style it as a descendant:
+
+css
+
+```
+media-poster img {
+  object-fit: cover;
+}
+```
+
+From inside a skin’s shadow root, an image slotted from outside needs `::slotted(img)` as well.
 
 ## Accessibility
 
-Unlike the native `<video poster>` attribute, this component allows you to provide accessible text alternatives for screen readers via the `alt` attribute on your child `<img>`. This means you can describe the poster image (e.g., `alt="Keynote speaker at a conference"`) or mark it as decorative with `alt=""` if it doesn’t convey meaningful information.
+Unlike the native `<video poster>` attribute, this component lets you describe the poster for screen readers.
+
+The image is decorative by default (`alt=""`), since a URL says nothing about what the image shows. When the poster carries meaning, say so:
+
+html
+
+```
+<media-poster>
+  <img src="poster.jpg" alt="Keynote speaker at a conference" />
+</media-poster>
+```
+
+Whether a poster is informative or decorative is your judgment, per the [WAI guidelines](https://www.w3.org/WAI/tutorials/images/decorative/).
 
 ## Examples
 
 ### Basic Usage
 
- ![Video thumbnail](https://image.mux.com/BV3YZtogl89mg9VcNBhhnHm02Y34zI1nlMuMQfAbl3dM/thumbnail.jpg)Play Pause
+ Play Pause
 
 index.html
 
@@ -50,7 +145,7 @@ index.ts
 
 ```
 <!-- biome-ignore-all lint/a11y/useMediaCaption: TODO -->
-<video-player class="video-player">
+<video-player class="video-player" poster="https://image.mux.com/BV3YZtogl89mg9VcNBhhnHm02Y34zI1nlMuMQfAbl3dM/thumbnail.jpg">
     <media-container>
         <video
             src="https://stream.mux.com/BV3YZtogl89mg9VcNBhhnHm02Y34zI1nlMuMQfAbl3dM/highest.mp4"
@@ -58,16 +153,13 @@ index.ts
         ></video>
 
         <media-poster class="media-poster">
-            <img
-                src="https://image.mux.com/BV3YZtogl89mg9VcNBhhnHm02Y34zI1nlMuMQfAbl3dM/thumbnail.jpg"
-                alt="Video thumbnail"
-                />
-            </media-poster>
-
-            <media-play-button class="media-play-button">
-                <span class="paused">Play</span>
-                <span class="playing">Pause</span>
-            </media-play-button>
+            <img alt="" />
+        </media-poster>
+
+        <media-play-button class="media-play-button">
+            <span class="paused">Play</span>
+            <span class="playing">Pause</span>
+        </media-play-button>
     </media-container>
 </video-player>
 ```
@@ -133,6 +225,28 @@ import '@videojs/html/ui/poster';
 
 ## API Reference
 
+### Props
+
+Prop
+
+Type
+
+Default
+
+Details
+
+`src`
+
+`string`
+
+`—`
+
+▸
+
+Attribute
+
+`src`
+
 ### State
 
 State is reflected as data attributes for CSS styling.
@@ -147,6 +261,52 @@ Details
 
 `boolean`
 
+▸
+
+Description
+
+Whether the poster should be shown, which it is until playback starts.
+
+`src`
+
+`string`
+
+▸
+
+Description
+
+Resolved poster URL, empty when nothing supplied one.
+
+`loading`
+
+`boolean`
+
+▸
+
+Description
+
+Whether the poster image is fetching.
+
+`loaded`
+
+`boolean`
+
+▸
+
+Description
+
+Whether the poster image has decoded.
+
+`error`
+
+`boolean`
+
+▸
+
+Description
+
+Whether the poster image failed.
+
 ### Data attributes
 
 Attribute
@@ -155,4 +315,34 @@ Type
 
 Details
 
-`data-visible`
+`data-visible`
+
+▸
+
+Description
+
+Present until playback starts.
+
+`data-loading`
+
+▸
+
+Description
+
+Present while the poster image is fetching.
+
+`data-loaded`
+
+▸
+
+Description
+
+Present once the poster image has decoded.
+
+`data-error`
+
+▸
+
+Description
+
+Present when the poster image failed.

package/docs/reference/slider.md

@@ -645,7 +645,7 @@ Attribute
 
 Description
 
-How the preview handles the slider boundaries. `'clamp'` keeps the preview within bounds, `'visible'` allows it to extend beyond the edges.
+Whether the preview is clamped to the slider bounds.
 
 #### Data attributes
 

package/docs/reference/time-slider.md

@@ -832,7 +832,7 @@ Attribute
 
 Description
 
-How the preview handles the slider boundaries. `'clamp'` keeps the preview within bounds, `'visible'` allows it to extend beyond the edges.
+Whether the preview is clamped to the slider bounds.
 
 #### Data attributes
 

package/docs/reference/tooltip.md

@@ -470,7 +470,7 @@ Present when the tooltip is open.
 
 `data-side`
 
-`'top' | 'bottom' | 'left' | 'right'`
+`'left' | 'right' | 'top' | 'bottom'`
 
 ▸
 
@@ -480,7 +480,7 @@ Indicates the rendered side of the tooltip after collision handling.
 
 `data-align`
 
-`'start' | 'center' | 'end'`
+`'center' | 'start' | 'end'`
 
 ▸
 
@@ -574,7 +574,7 @@ Present when the tooltip is open.
 
 `data-side`
 
-`'top' | 'bottom' | 'left' | 'right'`
+`'left' | 'right' | 'top' | 'bottom'`
 
 ▸
 
@@ -584,7 +584,7 @@ Indicates the rendered side of the tooltip after collision handling.
 
 `data-align`
 
-`'start' | 'center' | 'end'`
+`'center' | 'start' | 'end'`
 
 ▸
 
@@ -616,7 +616,7 @@ Present when the tooltip is open.
 
 `data-side`
 
-`'top' | 'bottom' | 'left' | 'right'`
+`'left' | 'right' | 'top' | 'bottom'`
 
 ▸
 
@@ -626,7 +626,7 @@ Indicates the rendered side of the tooltip after collision handling.
 
 `data-align`
 
-`'start' | 'center' | 'end'`
+`'center' | 'start' | 'end'`
 
 ▸
 

package/docs/reference/volume-slider.md

@@ -576,7 +576,7 @@ Attribute
 
 Description
 
-How the preview handles the slider boundaries. `'clamp'` keeps the preview within bounds, `'visible'` allows it to extend beyond the edges.
+Whether the preview is clamped to the slider bounds.
 
 #### Data attributes
 

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@videojs/html",
   "type": "module",
-  "version": "10.0.0-beta.28",
+  "version": "10.0.0-beta.29",
   "description": "HTML library for building media players",
   "license": "Apache-2.0",
   "repository": {
@@ -165,21 +165,23 @@
     }
   },
   "dependencies": {
-    "@videojs/core": "10.0.0-beta.28",
-    "@videojs/element": "10.0.0-beta.28",
-    "@videojs/media": "10.0.0-beta.28",
-    "@videojs/store": "10.0.0-beta.28",
-    "@videojs/utils": "10.0.0-beta.28",
-    "@videojs/spf": "10.0.0-beta.28"
+    "@videojs/core": "10.0.0-beta.29",
+    "@videojs/element": "10.0.0-beta.29",
+    "@videojs/media": "10.0.0-beta.29",
+    "@videojs/store": "10.0.0-beta.29",
+    "@videojs/utils": "10.0.0-beta.29",
+    "@videojs/spf": "10.0.0-beta.29"
   },
   "devDependencies": {
     "@testing-library/dom": "^10.4.1",
     "happy-dom": "^20.11.1",
     "tsdown": "^0.22.14",
+    "tsx": "^4.23.1",
     "typescript": "^6.0.2",
     "vitest": "^4.1.10",
-    "@videojs/icons": "10.0.0-beta.28",
-    "@videojs/skins": "10.0.0-beta.28"
+    "vjsc": "0.0.0",
+    "@videojs/skins": "10.0.0-beta.29",
+    "@videojs/icons": "10.0.0-beta.29"
   },
   "publishConfig": {
     "access": "public"
@@ -193,6 +195,9 @@
     "videojs"
   ],
   "scripts": {
+    "generate:vjsc": "vjsc generate",
+    "check:vjsc": "vjsc generate --check",
+    "prebuild": "pnpm run generate:vjsc",
     "build": "tsdown",
     "build:cdn": "node --import tsx ./scripts/build-cdn-locales.ts && tsdown --config tsdown.cdn.config.ts",
     "check:cdn": "node --import tsx ./scripts/check-cdn-self-contained.ts",

package/cdn/adapter-Bk03SAxn.js

@@ -1,2 +0,0 @@
-import{a as e,i as t,n,o as r}from"./source-BjtVLlkW.js";const i={src:``,source:null};function a(a){class o extends a{static get alternativeMediaSuggestion(){return"Try the hls.js-backed Mux media instead: import the `hls-js` flavor in place of the `spf` one."}#e=i.source;get src(){return super.src}set src(e){super.src!==e&&(this.source=r(e)??(e?{src:e}:null))}get source(){return this.#e}set source(t){let n=t??null;n!==this.#e&&(this.#e=n,super.src=n&&(e(n)??n.src)||``,this.dispatchEvent?.(new Event(`sourcechange`)))}get contentData(){let e=n(this.#e),r=t(this.#e);return{...e&&{poster:e},...r&&{storyboard:r}}}}return o}export{a as t};
-//# sourceMappingURL=adapter-Bk03SAxn.js.map

package/cdn/adapter-Bk03SAxn.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"adapter-Bk03SAxn.js","names":["#source"],"sources":["../../spf/dist/default/playback/adapters/mux-video/adapter.js"],"sourcesContent":["import { createMuxPosterURL, createMuxStoryboardURL, createMuxVideoURL, parseMuxVideoURL } from \"@videojs/media/dom/mux/source\";\n//#region src/playback/adapters/mux-video/adapter.ts\nconst muxMediaDefaultProps = {\n\tsrc: \"\",\n\tsource: null\n};\n/**\n* Mux identity over any SPF Media: the structured `source`, the `src` derived\n* from it, and the image URLs it describes.\n*\n* Everything here is Mux identity, so it carries no engine and both flavors get\n* it unchanged — the video Media over the full HLS engine, the audio-only Media\n* over the subtractive one. A mixin rather than a shared base class because each\n* flavor extends a different SPF Media, so there is no common class to put this\n* on, only a common `src` accessor to write through.\n*\n* Unlike the hls.js-backed `MuxMedia`, there is no inherited `source` to\n* delegate to — the SPF Medias know only `src` — so this owns the structured\n* source and dispatches `sourcechange` itself.\n*\n* @fires sourcechange - Fired when `source` changes, either directly or by parsing a new `src`. Read `source` for the new value.\n*/\nfunction MuxMediaMixin(BaseClass) {\n\tclass MuxMediaImpl extends BaseClass {\n\t\t/**\n\t\t* Named on the error copy when this engine can't play a source: the\n\t\t* hls.js-backed Mux Media plays the MPEG-TS and DRM-protected sources that\n\t\t* SPF does not, and it backs both `<mux-video>` and `<mux-audio>`.\n\t\t*\n\t\t* Names the flavor rather than an import path, because one Media is reached\n\t\t* through three of them — `@videojs/html`, `@videojs/react`, and this package\n\t\t* — and each has a different counterpart. The flavor suffix is the one thing\n\t\t* common to the layers a consumer imports elements and components from.\n\t\t*/\n\t\tstatic get alternativeMediaSuggestion() {\n\t\t\treturn \"Try the hls.js-backed Mux media instead: import the `hls-js` flavor in place of the `spf` one.\";\n\t\t}\n\t\t#source = muxMediaDefaultProps.source;\n\t\t/**\n\t\t* Media source URL. Setting a Mux stream URL\n\t\t* (`https://stream.mux.com/<playback-id>.m3u8?...`) extracts the playback ID\n\t\t* and query params into `source`; other URLs are kept as a plain `source.src`.\n\t\t*\n\t\t* Only playback options carry over. Mux identity comes from the URL, and the\n\t\t* signed `poster`, `storyboard`, and `drm` tokens are scoped to a playback ID,\n\t\t* so carrying them onto a different source would build rejected URLs.\n\t\t*/\n\t\tget src() {\n\t\t\treturn super.src;\n\t\t}\n\t\tset src(value) {\n\t\t\tif (super.src === value) return;\n\t\t\tthis.source = parseMuxVideoURL(value) ?? (value ? { src: value } : null);\n\t\t}\n\t\t/**\n\t\t* Structured Mux source. Setting it derives `src` from the playback ID, custom\n\t\t* domain, and `playback` params (appended as `snake_case` query params). A\n\t\t* `playback.token` replaces all other params — signed URLs bake them into the\n\t\t* token.\n\t\t*/\n\t\tget source() {\n\t\t\treturn this.#source;\n\t\t}\n\t\tset source(value) {\n\t\t\tconst source = value ?? null;\n\t\t\tif (source === this.#source) return;\n\t\t\tthis.#source = source;\n\t\t\tsuper.src = source && (createMuxVideoURL(source) ?? source.src) || \"\";\n\t\t\tthis.dispatchEvent?.(new Event(\"sourcechange\"));\n\t\t}\n\t\t/**\n\t\t* Image URLs `source` describes rather than plays: `poster` from its `poster`\n\t\t* params, `storyboard` from its `storyboard` params.\n\t\t*\n\t\t* Read-only and re-derived on read, so read it again after `sourcechange`.\n\t\t* Nothing here is applied for you.\n\t\t*/\n\t\tget contentData() {\n\t\t\tconst poster = createMuxPosterURL(this.#source);\n\t\t\tconst storyboard = createMuxStoryboardURL(this.#source);\n\t\t\treturn {\n\t\t\t\t...poster && { poster },\n\t\t\t\t...storyboard && { storyboard }\n\t\t\t};\n\t\t}\n\t}\n\treturn MuxMediaImpl;\n}\n//#endregion\nexport { MuxMediaMixin, muxMediaDefaultProps };\n\n//# sourceMappingURL=adapter.js.map"],"mappings":"yDAEA,MAAM,EAAuB,CAC5B,IAAK,GACL,OAAQ,IACT,EAiBA,SAAS,EAAc,EAAW,CACjC,MAAM,UAAqB,CAAU,CAWpC,WAAW,4BAA6B,CACvC,MAAO,gGACR,CACA,GAAU,EAAqB,OAU/B,IAAI,KAAM,CACT,OAAO,MAAM,GACd,CACA,IAAI,IAAI,EAAO,CACV,MAAM,MAAQ,IAClB,KAAK,OAAS,EAAiB,CAAK,IAAM,EAAQ,CAAE,IAAK,CAAM,EAAI,MACpE,CAOA,IAAI,QAAS,CACZ,OAAO,KAAKA,EACb,CACA,IAAI,OAAO,EAAO,CACjB,IAAM,EAAS,GAAS,KACpB,IAAW,KAAKA,KACpB,KAAKA,GAAU,EACf,MAAM,IAAM,IAAW,EAAkB,CAAM,GAAK,EAAO,MAAQ,GACnE,KAAK,gBAAgB,IAAI,MAAM,cAAc,CAAC,EAC/C,CAQA,IAAI,aAAc,CACjB,IAAM,EAAS,EAAmB,KAAKA,EAAO,EACxC,EAAa,EAAuB,KAAKA,EAAO,EACtD,MAAO,CACN,GAAG,GAAU,CAAE,QAAO,EACtB,GAAG,GAAc,CAAE,YAAW,CAC/B,CACD,CACD,CACA,OAAO,CACR"}

package/cdn/adapter-XTen-YVQ.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"adapter-XTen-YVQ.js","names":["#source"],"sources":["../../spf/dist/dev/playback/adapters/mux-video/adapter.js"],"sourcesContent":["import { createMuxPosterURL, createMuxStoryboardURL, createMuxVideoURL, parseMuxVideoURL } from \"@videojs/media/dom/mux/source\";\n//#region src/playback/adapters/mux-video/adapter.ts\nconst muxMediaDefaultProps = {\n\tsrc: \"\",\n\tsource: null\n};\n/**\n* Mux identity over any SPF Media: the structured `source`, the `src` derived\n* from it, and the image URLs it describes.\n*\n* Everything here is Mux identity, so it carries no engine and both flavors get\n* it unchanged — the video Media over the full HLS engine, the audio-only Media\n* over the subtractive one. A mixin rather than a shared base class because each\n* flavor extends a different SPF Media, so there is no common class to put this\n* on, only a common `src` accessor to write through.\n*\n* Unlike the hls.js-backed `MuxMedia`, there is no inherited `source` to\n* delegate to — the SPF Medias know only `src` — so this owns the structured\n* source and dispatches `sourcechange` itself.\n*\n* @fires sourcechange - Fired when `source` changes, either directly or by parsing a new `src`. Read `source` for the new value.\n*/\nfunction MuxMediaMixin(BaseClass) {\n\tclass MuxMediaImpl extends BaseClass {\n\t\t/**\n\t\t* Named on the error copy when this engine can't play a source: the\n\t\t* hls.js-backed Mux Media plays the MPEG-TS and DRM-protected sources that\n\t\t* SPF does not, and it backs both `<mux-video>` and `<mux-audio>`.\n\t\t*\n\t\t* Names the flavor rather than an import path, because one Media is reached\n\t\t* through three of them — `@videojs/html`, `@videojs/react`, and this package\n\t\t* — and each has a different counterpart. The flavor suffix is the one thing\n\t\t* common to the layers a consumer imports elements and components from.\n\t\t*/\n\t\tstatic get alternativeMediaSuggestion() {\n\t\t\treturn \"Try the hls.js-backed Mux media instead: import the `hls-js` flavor in place of the `spf` one.\";\n\t\t}\n\t\t#source = muxMediaDefaultProps.source;\n\t\t/**\n\t\t* Media source URL. Setting a Mux stream URL\n\t\t* (`https://stream.mux.com/<playback-id>.m3u8?...`) extracts the playback ID\n\t\t* and query params into `source`; other URLs are kept as a plain `source.src`.\n\t\t*\n\t\t* Only playback options carry over. Mux identity comes from the URL, and the\n\t\t* signed `poster`, `storyboard`, and `drm` tokens are scoped to a playback ID,\n\t\t* so carrying them onto a different source would build rejected URLs.\n\t\t*/\n\t\tget src() {\n\t\t\treturn super.src;\n\t\t}\n\t\tset src(value) {\n\t\t\tif (super.src === value) return;\n\t\t\tthis.source = parseMuxVideoURL(value) ?? (value ? { src: value } : null);\n\t\t}\n\t\t/**\n\t\t* Structured Mux source. Setting it derives `src` from the playback ID, custom\n\t\t* domain, and `playback` params (appended as `snake_case` query params). A\n\t\t* `playback.token` replaces all other params — signed URLs bake them into the\n\t\t* token.\n\t\t*/\n\t\tget source() {\n\t\t\treturn this.#source;\n\t\t}\n\t\tset source(value) {\n\t\t\tconst source = value ?? null;\n\t\t\tif (source === this.#source) return;\n\t\t\tthis.#source = source;\n\t\t\tsuper.src = source && (createMuxVideoURL(source) ?? source.src) || \"\";\n\t\t\tthis.dispatchEvent?.(new Event(\"sourcechange\"));\n\t\t}\n\t\t/**\n\t\t* Image URLs `source` describes rather than plays: `poster` from its `poster`\n\t\t* params, `storyboard` from its `storyboard` params.\n\t\t*\n\t\t* Read-only and re-derived on read, so read it again after `sourcechange`.\n\t\t* Nothing here is applied for you.\n\t\t*/\n\t\tget contentData() {\n\t\t\tconst poster = createMuxPosterURL(this.#source);\n\t\t\tconst storyboard = createMuxStoryboardURL(this.#source);\n\t\t\treturn {\n\t\t\t\t...poster && { poster },\n\t\t\t\t...storyboard && { storyboard }\n\t\t\t};\n\t\t}\n\t}\n\treturn MuxMediaImpl;\n}\n//#endregion\nexport { MuxMediaMixin, muxMediaDefaultProps };\n\n//# sourceMappingURL=adapter.js.map"],"mappings":";;;AAEA,MAAM,uBAAuB;CAC5B,KAAK;CACL,QAAQ;AACT;;;;;;;;;;;;;;;;;AAiBA,SAAS,cAAc,WAAW;CACjC,MAAM,qBAAqB,UAAU;;;;;;;;;;;EAWpC,WAAW,6BAA6B;GACvC,OAAO;EACR;EACA,UAAU,qBAAqB;;;;;;;;;;EAU/B,IAAI,MAAM;GACT,OAAO,MAAM;EACd;EACA,IAAI,IAAI,OAAO;GACd,IAAI,MAAM,QAAQ,OAAO;GACzB,KAAK,SAAS,iBAAiB,KAAK,MAAM,QAAQ,EAAE,KAAK,MAAM,IAAI;EACpE;;;;;;;EAOA,IAAI,SAAS;GACZ,OAAO,KAAKA;EACb;EACA,IAAI,OAAO,OAAO;GACjB,MAAM,SAAS,SAAS;GACxB,IAAI,WAAW,KAAKA,SAAS;GAC7B,KAAKA,UAAU;GACf,MAAM,MAAM,WAAW,kBAAkB,MAAM,KAAK,OAAO,QAAQ;GACnE,KAAK,gBAAgB,IAAI,MAAM,cAAc,CAAC;EAC/C;;;;;;;;EAQA,IAAI,cAAc;GACjB,MAAM,SAAS,mBAAmB,KAAKA,OAAO;GAC9C,MAAM,aAAa,uBAAuB,KAAKA,OAAO;GACtD,OAAO;IACN,GAAG,UAAU,EAAE,OAAO;IACtB,GAAG,cAAc,EAAE,WAAW;GAC/B;EACD;CACD;CACA,OAAO;AACR"}