@vendure/admin-ui 2.1.0-next.4 → 2.1.0-next.6

package/fesm2022/vendure-admin-ui-react.mjs

@@ -1,10 +1,11 @@
 import * as i0 from '@angular/core';
 import { Directive, Optional, Input, InjectionToken, inject, Component, ViewEncapsulation, APP_INITIALIZER } from '@angular/core';
-import React, { createContext, createElement, useContext, useState, useEffect, useCallback } from 'react';
+import React, { createContext, createElement, useEffect, useContext, useState, useCallback } from 'react';
 import { createRoot } from 'react-dom/client';
 import * as i1 from '@vendure/admin-ui/core';
 import { ROUTE_COMPONENT_OPTIONS, RouteComponent, SharedModule, DataService, CustomDetailComponentService, DataTableCustomComponentService, ComponentRegistryService, registerRouteComponent } from '@vendure/admin-ui/core';
-import { Router } from '@angular/router';
+import { ClarityIcons } from '@cds/core/icon';
+import { Router, ActivatedRoute } from '@angular/router';
 import { firstValueFrom } from 'rxjs';
 import { tap } from 'rxjs/operators';
 
@@ -70,11 +71,11 @@ class ReactCustomColumnComponent {
         };
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.2", ngImport: i0, type: ReactCustomColumnComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.2", type: ReactCustomColumnComponent, isStandalone: true, selector: "vdr-react-custom-column-component", inputs: { rowItem: "rowItem" }, ngImport: i0, template: ` <div [vdrReactComponentHost]="reactComponent" [props]="props"></div> `, isInline: true, styles: [":host,.vdr-card{display:block;--card-padding: calc(var(--space-unit) * 3);container-type:inline-size}.card-container{border:1px solid var(--color-card-border);background-color:var(--color-card-bg);border-radius:var(--border-radius);padding:var(--card-padding) 0;box-shadow:0 2px 4px #0000000d}@container (max-width: 400px){.card-container{--card-padding: calc(var(--space-unit) * 2)}}.card-container.padding-x{padding-inline-start:var(--card-padding);padding-inline-end:var(--card-padding)}.title-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--card-padding)}.title{font-size:var(--font-size-base);padding:0 var(--card-padding)}.padding-x .title{padding:0}::ng-deep vdr-card+vdr-card{margin-top:calc(var(--space-unit) * 2)}.vdr-card+.vdr-card{margin-top:calc(var(--space-unit) * 2)}\n"], dependencies: [{ kind: "directive", type: ReactComponentHostDirective, selector: "[vdrReactComponentHost]", inputs: ["vdrReactComponentHost", "props", "context"] }], encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.2", type: ReactCustomColumnComponent, isStandalone: true, selector: "vdr-react-custom-column-component", inputs: { rowItem: "rowItem" }, ngImport: i0, template: ` <div [vdrReactComponentHost]="reactComponent" [props]="props"></div> `, isInline: true, styles: [":host,.vdr-card{display:block;--card-padding: calc(var(--space-unit) * 3);container-type:inline-size}.card-container{border:1px solid var(--color-card-border);background-color:var(--color-card-bg);border-radius:var(--border-radius);padding:var(--card-padding) 0;box-shadow:0 2px 4px #0000000d}@container (max-width: 400px){.card-container{--card-padding: calc(var(--space-unit) * 2)}}.card-container.padding-x{padding-inline-start:var(--card-padding);padding-inline-end:var(--card-padding)}.title-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--card-padding)}.title{font-size:var(--font-size-base);padding:0 var(--card-padding)}.padding-x .title{padding:0}::ng-deep vdr-card+vdr-card{margin-top:calc(var(--space-unit) * 2)}.vdr-card+.vdr-card{margin-top:calc(var(--space-unit) * 2)}:host{display:block}.form-group label{font-size:var(--font-size-sm);color:var(--color-weight-800);margin-bottom:4px;display:inline-block}.tooltip-text{font-size:var(--font-size-xs);line-height:var(--font-size-sm);margin-bottom:4px}.input-row{display:flex}::ng-deep .input-row input:not([type=checkbox]),::ng-deep .input-row select,::ng-deep .input-row textarea,::ng-deep .input-row vdr-zone-selector,::ng-deep .input-row vdr-facet-value-selector,::ng-deep .input-row vdr-option-value-input,::ng-deep .input-row vdr-affixed-input,::ng-deep .input-row vdr-currency-input,::ng-deep .input-row vdr-rich-text-editor{width:100%}.input-row input:not([type=checkbox]),.input-row select,.input-row textarea{width:100%}:host,.vdr-action-bar{display:flex;justify-content:space-between;align-items:baseline;z-index:25;flex-direction:column-reverse}:host>.grow,.vdr-action-bar>.grow{flex:1}:host .right-content,.vdr-action-bar .right-content{width:100%;display:flex;justify-content:flex-end}:host ::ng-deep vdr-ab-right>*:last-child,.vdr-action-bar ::ng-deep vdr-ab-right>*:last-child{margin-inline-end:0px}@media screen and (min-width: 768px){:host,.vdr-action-bar{flex-direction:row}:host .right-content,.vdr-action-bar .right-content{width:initial}}:host,.vdr-page-detail-layout{display:grid;grid-template-columns:3fr 1fr}@media screen and (max-width: 992px){:host{grid-template-columns:1fr}}.sidebar{padding:var(--space-unit)}.form-group .input-row.invalid input:not([type=checkbox]):not([type=radio]),.form-group .input-row.invalid select,.form-group .input-row.invalid textarea{color:var(--color-error-700);border-color:var(--color-error-300)}\n"], dependencies: [{ kind: "directive", type: ReactComponentHostDirective, selector: "[vdrReactComponentHost]", inputs: ["vdrReactComponentHost", "props", "context"] }], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.2", ngImport: i0, type: ReactCustomColumnComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'vdr-react-custom-column-component', template: ` <div [vdrReactComponentHost]="reactComponent" [props]="props"></div> `, encapsulation: ViewEncapsulation.None, standalone: true, imports: [ReactComponentHostDirective], styles: [":host,.vdr-card{display:block;--card-padding: calc(var(--space-unit) * 3);container-type:inline-size}.card-container{border:1px solid var(--color-card-border);background-color:var(--color-card-bg);border-radius:var(--border-radius);padding:var(--card-padding) 0;box-shadow:0 2px 4px #0000000d}@container (max-width: 400px){.card-container{--card-padding: calc(var(--space-unit) * 2)}}.card-container.padding-x{padding-inline-start:var(--card-padding);padding-inline-end:var(--card-padding)}.title-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--card-padding)}.title{font-size:var(--font-size-base);padding:0 var(--card-padding)}.padding-x .title{padding:0}::ng-deep vdr-card+vdr-card{margin-top:calc(var(--space-unit) * 2)}.vdr-card+.vdr-card{margin-top:calc(var(--space-unit) * 2)}\n"] }]
+            args: [{ selector: 'vdr-react-custom-column-component', template: ` <div [vdrReactComponentHost]="reactComponent" [props]="props"></div> `, encapsulation: ViewEncapsulation.None, standalone: true, imports: [ReactComponentHostDirective], styles: [":host,.vdr-card{display:block;--card-padding: calc(var(--space-unit) * 3);container-type:inline-size}.card-container{border:1px solid var(--color-card-border);background-color:var(--color-card-bg);border-radius:var(--border-radius);padding:var(--card-padding) 0;box-shadow:0 2px 4px #0000000d}@container (max-width: 400px){.card-container{--card-padding: calc(var(--space-unit) * 2)}}.card-container.padding-x{padding-inline-start:var(--card-padding);padding-inline-end:var(--card-padding)}.title-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--card-padding)}.title{font-size:var(--font-size-base);padding:0 var(--card-padding)}.padding-x .title{padding:0}::ng-deep vdr-card+vdr-card{margin-top:calc(var(--space-unit) * 2)}.vdr-card+.vdr-card{margin-top:calc(var(--space-unit) * 2)}:host{display:block}.form-group label{font-size:var(--font-size-sm);color:var(--color-weight-800);margin-bottom:4px;display:inline-block}.tooltip-text{font-size:var(--font-size-xs);line-height:var(--font-size-sm);margin-bottom:4px}.input-row{display:flex}::ng-deep .input-row input:not([type=checkbox]),::ng-deep .input-row select,::ng-deep .input-row textarea,::ng-deep .input-row vdr-zone-selector,::ng-deep .input-row vdr-facet-value-selector,::ng-deep .input-row vdr-option-value-input,::ng-deep .input-row vdr-affixed-input,::ng-deep .input-row vdr-currency-input,::ng-deep .input-row vdr-rich-text-editor{width:100%}.input-row input:not([type=checkbox]),.input-row select,.input-row textarea{width:100%}:host,.vdr-action-bar{display:flex;justify-content:space-between;align-items:baseline;z-index:25;flex-direction:column-reverse}:host>.grow,.vdr-action-bar>.grow{flex:1}:host .right-content,.vdr-action-bar .right-content{width:100%;display:flex;justify-content:flex-end}:host ::ng-deep vdr-ab-right>*:last-child,.vdr-action-bar ::ng-deep vdr-ab-right>*:last-child{margin-inline-end:0px}@media screen and (min-width: 768px){:host,.vdr-action-bar{flex-direction:row}:host .right-content,.vdr-action-bar .right-content{width:initial}}:host,.vdr-page-detail-layout{display:grid;grid-template-columns:3fr 1fr}@media screen and (max-width: 992px){:host{grid-template-columns:1fr}}.sidebar{padding:var(--space-unit)}.form-group .input-row.invalid input:not([type=checkbox]):not([type=radio]),.form-group .input-row.invalid select,.form-group .input-row.invalid textarea{color:var(--color-error-700);border-color:var(--color-error-300)}\n"] }]
         }], propDecorators: { rowItem: [{
                 type: Input
             }] } });
@@ -92,11 +93,11 @@ class ReactCustomDetailComponent {
         };
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.2", ngImport: i0, type: ReactCustomDetailComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.2", type: ReactCustomDetailComponent, isStandalone: true, selector: "vdr-react-custom-detail-component", ngImport: i0, template: ` <div [vdrReactComponentHost]="reactComponent" [context]="context" [props]="props"></div> `, isInline: true, styles: [":host,.vdr-card{display:block;--card-padding: calc(var(--space-unit) * 3);container-type:inline-size}.card-container{border:1px solid var(--color-card-border);background-color:var(--color-card-bg);border-radius:var(--border-radius);padding:var(--card-padding) 0;box-shadow:0 2px 4px #0000000d}@container (max-width: 400px){.card-container{--card-padding: calc(var(--space-unit) * 2)}}.card-container.padding-x{padding-inline-start:var(--card-padding);padding-inline-end:var(--card-padding)}.title-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--card-padding)}.title{font-size:var(--font-size-base);padding:0 var(--card-padding)}.padding-x .title{padding:0}::ng-deep vdr-card+vdr-card{margin-top:calc(var(--space-unit) * 2)}.vdr-card+.vdr-card{margin-top:calc(var(--space-unit) * 2)}\n"], dependencies: [{ kind: "directive", type: ReactComponentHostDirective, selector: "[vdrReactComponentHost]", inputs: ["vdrReactComponentHost", "props", "context"] }], encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.2", type: ReactCustomDetailComponent, isStandalone: true, selector: "vdr-react-custom-detail-component", ngImport: i0, template: ` <div [vdrReactComponentHost]="reactComponent" [context]="context" [props]="props"></div> `, isInline: true, styles: [":host,.vdr-card{display:block;--card-padding: calc(var(--space-unit) * 3);container-type:inline-size}.card-container{border:1px solid var(--color-card-border);background-color:var(--color-card-bg);border-radius:var(--border-radius);padding:var(--card-padding) 0;box-shadow:0 2px 4px #0000000d}@container (max-width: 400px){.card-container{--card-padding: calc(var(--space-unit) * 2)}}.card-container.padding-x{padding-inline-start:var(--card-padding);padding-inline-end:var(--card-padding)}.title-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--card-padding)}.title{font-size:var(--font-size-base);padding:0 var(--card-padding)}.padding-x .title{padding:0}::ng-deep vdr-card+vdr-card{margin-top:calc(var(--space-unit) * 2)}.vdr-card+.vdr-card{margin-top:calc(var(--space-unit) * 2)}:host{display:block}.form-group label{font-size:var(--font-size-sm);color:var(--color-weight-800);margin-bottom:4px;display:inline-block}.tooltip-text{font-size:var(--font-size-xs);line-height:var(--font-size-sm);margin-bottom:4px}.input-row{display:flex}::ng-deep .input-row input:not([type=checkbox]),::ng-deep .input-row select,::ng-deep .input-row textarea,::ng-deep .input-row vdr-zone-selector,::ng-deep .input-row vdr-facet-value-selector,::ng-deep .input-row vdr-option-value-input,::ng-deep .input-row vdr-affixed-input,::ng-deep .input-row vdr-currency-input,::ng-deep .input-row vdr-rich-text-editor{width:100%}.input-row input:not([type=checkbox]),.input-row select,.input-row textarea{width:100%}:host,.vdr-action-bar{display:flex;justify-content:space-between;align-items:baseline;z-index:25;flex-direction:column-reverse}:host>.grow,.vdr-action-bar>.grow{flex:1}:host .right-content,.vdr-action-bar .right-content{width:100%;display:flex;justify-content:flex-end}:host ::ng-deep vdr-ab-right>*:last-child,.vdr-action-bar ::ng-deep vdr-ab-right>*:last-child{margin-inline-end:0px}@media screen and (min-width: 768px){:host,.vdr-action-bar{flex-direction:row}:host .right-content,.vdr-action-bar .right-content{width:initial}}:host,.vdr-page-detail-layout{display:grid;grid-template-columns:3fr 1fr}@media screen and (max-width: 992px){:host{grid-template-columns:1fr}}.sidebar{padding:var(--space-unit)}.form-group .input-row.invalid input:not([type=checkbox]):not([type=radio]),.form-group .input-row.invalid select,.form-group .input-row.invalid textarea{color:var(--color-error-700);border-color:var(--color-error-300)}\n"], dependencies: [{ kind: "directive", type: ReactComponentHostDirective, selector: "[vdrReactComponentHost]", inputs: ["vdrReactComponentHost", "props", "context"] }], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.2", ngImport: i0, type: ReactCustomDetailComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'vdr-react-custom-detail-component', template: ` <div [vdrReactComponentHost]="reactComponent" [context]="context" [props]="props"></div> `, encapsulation: ViewEncapsulation.None, standalone: true, imports: [ReactComponentHostDirective], styles: [":host,.vdr-card{display:block;--card-padding: calc(var(--space-unit) * 3);container-type:inline-size}.card-container{border:1px solid var(--color-card-border);background-color:var(--color-card-bg);border-radius:var(--border-radius);padding:var(--card-padding) 0;box-shadow:0 2px 4px #0000000d}@container (max-width: 400px){.card-container{--card-padding: calc(var(--space-unit) * 2)}}.card-container.padding-x{padding-inline-start:var(--card-padding);padding-inline-end:var(--card-padding)}.title-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--card-padding)}.title{font-size:var(--font-size-base);padding:0 var(--card-padding)}.padding-x .title{padding:0}::ng-deep vdr-card+vdr-card{margin-top:calc(var(--space-unit) * 2)}.vdr-card+.vdr-card{margin-top:calc(var(--space-unit) * 2)}\n"] }]
+            args: [{ selector: 'vdr-react-custom-detail-component', template: ` <div [vdrReactComponentHost]="reactComponent" [context]="context" [props]="props"></div> `, encapsulation: ViewEncapsulation.None, standalone: true, imports: [ReactComponentHostDirective], styles: [":host,.vdr-card{display:block;--card-padding: calc(var(--space-unit) * 3);container-type:inline-size}.card-container{border:1px solid var(--color-card-border);background-color:var(--color-card-bg);border-radius:var(--border-radius);padding:var(--card-padding) 0;box-shadow:0 2px 4px #0000000d}@container (max-width: 400px){.card-container{--card-padding: calc(var(--space-unit) * 2)}}.card-container.padding-x{padding-inline-start:var(--card-padding);padding-inline-end:var(--card-padding)}.title-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--card-padding)}.title{font-size:var(--font-size-base);padding:0 var(--card-padding)}.padding-x .title{padding:0}::ng-deep vdr-card+vdr-card{margin-top:calc(var(--space-unit) * 2)}.vdr-card+.vdr-card{margin-top:calc(var(--space-unit) * 2)}:host{display:block}.form-group label{font-size:var(--font-size-sm);color:var(--color-weight-800);margin-bottom:4px;display:inline-block}.tooltip-text{font-size:var(--font-size-xs);line-height:var(--font-size-sm);margin-bottom:4px}.input-row{display:flex}::ng-deep .input-row input:not([type=checkbox]),::ng-deep .input-row select,::ng-deep .input-row textarea,::ng-deep .input-row vdr-zone-selector,::ng-deep .input-row vdr-facet-value-selector,::ng-deep .input-row vdr-option-value-input,::ng-deep .input-row vdr-affixed-input,::ng-deep .input-row vdr-currency-input,::ng-deep .input-row vdr-rich-text-editor{width:100%}.input-row input:not([type=checkbox]),.input-row select,.input-row textarea{width:100%}:host,.vdr-action-bar{display:flex;justify-content:space-between;align-items:baseline;z-index:25;flex-direction:column-reverse}:host>.grow,.vdr-action-bar>.grow{flex:1}:host .right-content,.vdr-action-bar .right-content{width:100%;display:flex;justify-content:flex-end}:host ::ng-deep vdr-ab-right>*:last-child,.vdr-action-bar ::ng-deep vdr-ab-right>*:last-child{margin-inline-end:0px}@media screen and (min-width: 768px){:host,.vdr-action-bar{flex-direction:row}:host .right-content,.vdr-action-bar .right-content{width:initial}}:host,.vdr-page-detail-layout{display:grid;grid-template-columns:3fr 1fr}@media screen and (max-width: 992px){:host{grid-template-columns:1fr}}.sidebar{padding:var(--space-unit)}.form-group .input-row.invalid input:not([type=checkbox]):not([type=radio]),.form-group .input-row.invalid select,.form-group .input-row.invalid textarea{color:var(--color-error-700);border-color:var(--color-error-300)}\n"] }]
         }] });
 
 const REACT_INPUT_COMPONENT_OPTIONS = new InjectionToken('REACT_INPUT_COMPONENT_OPTIONS');
@@ -113,11 +114,11 @@ class ReactFormInputComponent {
         };
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.2", ngImport: i0, type: ReactFormInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.2", type: ReactFormInputComponent, isStandalone: true, selector: "vdr-react-form-input-component", ngImport: i0, template: ` <div [vdrReactComponentHost]="reactComponent" [context]="context" [props]="context"></div> `, isInline: true, styles: [":host,.vdr-card{display:block;--card-padding: calc(var(--space-unit) * 3);container-type:inline-size}.card-container{border:1px solid var(--color-card-border);background-color:var(--color-card-bg);border-radius:var(--border-radius);padding:var(--card-padding) 0;box-shadow:0 2px 4px #0000000d}@container (max-width: 400px){.card-container{--card-padding: calc(var(--space-unit) * 2)}}.card-container.padding-x{padding-inline-start:var(--card-padding);padding-inline-end:var(--card-padding)}.title-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--card-padding)}.title{font-size:var(--font-size-base);padding:0 var(--card-padding)}.padding-x .title{padding:0}::ng-deep vdr-card+vdr-card{margin-top:calc(var(--space-unit) * 2)}.vdr-card+.vdr-card{margin-top:calc(var(--space-unit) * 2)}\n"], dependencies: [{ kind: "directive", type: ReactComponentHostDirective, selector: "[vdrReactComponentHost]", inputs: ["vdrReactComponentHost", "props", "context"] }], encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.2", type: ReactFormInputComponent, isStandalone: true, selector: "vdr-react-form-input-component", ngImport: i0, template: ` <div [vdrReactComponentHost]="reactComponent" [context]="context" [props]="context"></div> `, isInline: true, styles: [":host,.vdr-card{display:block;--card-padding: calc(var(--space-unit) * 3);container-type:inline-size}.card-container{border:1px solid var(--color-card-border);background-color:var(--color-card-bg);border-radius:var(--border-radius);padding:var(--card-padding) 0;box-shadow:0 2px 4px #0000000d}@container (max-width: 400px){.card-container{--card-padding: calc(var(--space-unit) * 2)}}.card-container.padding-x{padding-inline-start:var(--card-padding);padding-inline-end:var(--card-padding)}.title-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--card-padding)}.title{font-size:var(--font-size-base);padding:0 var(--card-padding)}.padding-x .title{padding:0}::ng-deep vdr-card+vdr-card{margin-top:calc(var(--space-unit) * 2)}.vdr-card+.vdr-card{margin-top:calc(var(--space-unit) * 2)}:host{display:block}.form-group label{font-size:var(--font-size-sm);color:var(--color-weight-800);margin-bottom:4px;display:inline-block}.tooltip-text{font-size:var(--font-size-xs);line-height:var(--font-size-sm);margin-bottom:4px}.input-row{display:flex}::ng-deep .input-row input:not([type=checkbox]),::ng-deep .input-row select,::ng-deep .input-row textarea,::ng-deep .input-row vdr-zone-selector,::ng-deep .input-row vdr-facet-value-selector,::ng-deep .input-row vdr-option-value-input,::ng-deep .input-row vdr-affixed-input,::ng-deep .input-row vdr-currency-input,::ng-deep .input-row vdr-rich-text-editor{width:100%}.input-row input:not([type=checkbox]),.input-row select,.input-row textarea{width:100%}:host,.vdr-action-bar{display:flex;justify-content:space-between;align-items:baseline;z-index:25;flex-direction:column-reverse}:host>.grow,.vdr-action-bar>.grow{flex:1}:host .right-content,.vdr-action-bar .right-content{width:100%;display:flex;justify-content:flex-end}:host ::ng-deep vdr-ab-right>*:last-child,.vdr-action-bar ::ng-deep vdr-ab-right>*:last-child{margin-inline-end:0px}@media screen and (min-width: 768px){:host,.vdr-action-bar{flex-direction:row}:host .right-content,.vdr-action-bar .right-content{width:initial}}:host,.vdr-page-detail-layout{display:grid;grid-template-columns:3fr 1fr}@media screen and (max-width: 992px){:host{grid-template-columns:1fr}}.sidebar{padding:var(--space-unit)}.form-group .input-row.invalid input:not([type=checkbox]):not([type=radio]),.form-group .input-row.invalid select,.form-group .input-row.invalid textarea{color:var(--color-error-700);border-color:var(--color-error-300)}\n"], dependencies: [{ kind: "directive", type: ReactComponentHostDirective, selector: "[vdrReactComponentHost]", inputs: ["vdrReactComponentHost", "props", "context"] }], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.2", ngImport: i0, type: ReactFormInputComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'vdr-react-form-input-component', template: ` <div [vdrReactComponentHost]="reactComponent" [context]="context" [props]="context"></div> `, encapsulation: ViewEncapsulation.None, standalone: true, imports: [ReactComponentHostDirective], styles: [":host,.vdr-card{display:block;--card-padding: calc(var(--space-unit) * 3);container-type:inline-size}.card-container{border:1px solid var(--color-card-border);background-color:var(--color-card-bg);border-radius:var(--border-radius);padding:var(--card-padding) 0;box-shadow:0 2px 4px #0000000d}@container (max-width: 400px){.card-container{--card-padding: calc(var(--space-unit) * 2)}}.card-container.padding-x{padding-inline-start:var(--card-padding);padding-inline-end:var(--card-padding)}.title-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--card-padding)}.title{font-size:var(--font-size-base);padding:0 var(--card-padding)}.padding-x .title{padding:0}::ng-deep vdr-card+vdr-card{margin-top:calc(var(--space-unit) * 2)}.vdr-card+.vdr-card{margin-top:calc(var(--space-unit) * 2)}\n"] }]
+            args: [{ selector: 'vdr-react-form-input-component', template: ` <div [vdrReactComponentHost]="reactComponent" [context]="context" [props]="context"></div> `, encapsulation: ViewEncapsulation.None, standalone: true, imports: [ReactComponentHostDirective], styles: [":host,.vdr-card{display:block;--card-padding: calc(var(--space-unit) * 3);container-type:inline-size}.card-container{border:1px solid var(--color-card-border);background-color:var(--color-card-bg);border-radius:var(--border-radius);padding:var(--card-padding) 0;box-shadow:0 2px 4px #0000000d}@container (max-width: 400px){.card-container{--card-padding: calc(var(--space-unit) * 2)}}.card-container.padding-x{padding-inline-start:var(--card-padding);padding-inline-end:var(--card-padding)}.title-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--card-padding)}.title{font-size:var(--font-size-base);padding:0 var(--card-padding)}.padding-x .title{padding:0}::ng-deep vdr-card+vdr-card{margin-top:calc(var(--space-unit) * 2)}.vdr-card+.vdr-card{margin-top:calc(var(--space-unit) * 2)}:host{display:block}.form-group label{font-size:var(--font-size-sm);color:var(--color-weight-800);margin-bottom:4px;display:inline-block}.tooltip-text{font-size:var(--font-size-xs);line-height:var(--font-size-sm);margin-bottom:4px}.input-row{display:flex}::ng-deep .input-row input:not([type=checkbox]),::ng-deep .input-row select,::ng-deep .input-row textarea,::ng-deep .input-row vdr-zone-selector,::ng-deep .input-row vdr-facet-value-selector,::ng-deep .input-row vdr-option-value-input,::ng-deep .input-row vdr-affixed-input,::ng-deep .input-row vdr-currency-input,::ng-deep .input-row vdr-rich-text-editor{width:100%}.input-row input:not([type=checkbox]),.input-row select,.input-row textarea{width:100%}:host,.vdr-action-bar{display:flex;justify-content:space-between;align-items:baseline;z-index:25;flex-direction:column-reverse}:host>.grow,.vdr-action-bar>.grow{flex:1}:host .right-content,.vdr-action-bar .right-content{width:100%;display:flex;justify-content:flex-end}:host ::ng-deep vdr-ab-right>*:last-child,.vdr-action-bar ::ng-deep vdr-ab-right>*:last-child{margin-inline-end:0px}@media screen and (min-width: 768px){:host,.vdr-action-bar{flex-direction:row}:host .right-content,.vdr-action-bar .right-content{width:initial}}:host,.vdr-page-detail-layout{display:grid;grid-template-columns:3fr 1fr}@media screen and (max-width: 992px){:host{grid-template-columns:1fr}}.sidebar{padding:var(--space-unit)}.form-group .input-row.invalid input:not([type=checkbox]):not([type=radio]),.form-group .input-row.invalid select,.form-group .input-row.invalid textarea{color:var(--color-error-700);border-color:var(--color-error-300)}\n"] }]
         }] });
 
 const REACT_ROUTE_COMPONENT_OPTIONS = new InjectionToken('REACT_ROUTE_COMPONENT_OPTIONS');
@@ -131,7 +132,7 @@ class ReactRouteComponent {
         <vdr-route-component
             ><div [vdrReactComponentHost]="reactComponent" [props]="props"></div
         ></vdr-route-component>
-    `, isInline: true, styles: [":host,.vdr-card{display:block;--card-padding: calc(var(--space-unit) * 3);container-type:inline-size}.card-container{border:1px solid var(--color-card-border);background-color:var(--color-card-bg);border-radius:var(--border-radius);padding:var(--card-padding) 0;box-shadow:0 2px 4px #0000000d}@container (max-width: 400px){.card-container{--card-padding: calc(var(--space-unit) * 2)}}.card-container.padding-x{padding-inline-start:var(--card-padding);padding-inline-end:var(--card-padding)}.title-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--card-padding)}.title{font-size:var(--font-size-base);padding:0 var(--card-padding)}.padding-x .title{padding:0}::ng-deep vdr-card+vdr-card{margin-top:calc(var(--space-unit) * 2)}.vdr-card+.vdr-card{margin-top:calc(var(--space-unit) * 2)}\n"], dependencies: [{ kind: "directive", type: ReactComponentHostDirective, selector: "[vdrReactComponentHost]", inputs: ["vdrReactComponentHost", "props", "context"] }, { kind: "component", type: RouteComponent, selector: "vdr-route-component" }, { kind: "ngmodule", type: SharedModule }], encapsulation: i0.ViewEncapsulation.None }); }
+    `, isInline: true, styles: [":host,.vdr-card{display:block;--card-padding: calc(var(--space-unit) * 3);container-type:inline-size}.card-container{border:1px solid var(--color-card-border);background-color:var(--color-card-bg);border-radius:var(--border-radius);padding:var(--card-padding) 0;box-shadow:0 2px 4px #0000000d}@container (max-width: 400px){.card-container{--card-padding: calc(var(--space-unit) * 2)}}.card-container.padding-x{padding-inline-start:var(--card-padding);padding-inline-end:var(--card-padding)}.title-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--card-padding)}.title{font-size:var(--font-size-base);padding:0 var(--card-padding)}.padding-x .title{padding:0}::ng-deep vdr-card+vdr-card{margin-top:calc(var(--space-unit) * 2)}.vdr-card+.vdr-card{margin-top:calc(var(--space-unit) * 2)}:host{display:block}.form-group label{font-size:var(--font-size-sm);color:var(--color-weight-800);margin-bottom:4px;display:inline-block}.tooltip-text{font-size:var(--font-size-xs);line-height:var(--font-size-sm);margin-bottom:4px}.input-row{display:flex}::ng-deep .input-row input:not([type=checkbox]),::ng-deep .input-row select,::ng-deep .input-row textarea,::ng-deep .input-row vdr-zone-selector,::ng-deep .input-row vdr-facet-value-selector,::ng-deep .input-row vdr-option-value-input,::ng-deep .input-row vdr-affixed-input,::ng-deep .input-row vdr-currency-input,::ng-deep .input-row vdr-rich-text-editor{width:100%}.input-row input:not([type=checkbox]),.input-row select,.input-row textarea{width:100%}:host,.vdr-action-bar{display:flex;justify-content:space-between;align-items:baseline;z-index:25;flex-direction:column-reverse}:host>.grow,.vdr-action-bar>.grow{flex:1}:host .right-content,.vdr-action-bar .right-content{width:100%;display:flex;justify-content:flex-end}:host ::ng-deep vdr-ab-right>*:last-child,.vdr-action-bar ::ng-deep vdr-ab-right>*:last-child{margin-inline-end:0px}@media screen and (min-width: 768px){:host,.vdr-action-bar{flex-direction:row}:host .right-content,.vdr-action-bar .right-content{width:initial}}:host,.vdr-page-detail-layout{display:grid;grid-template-columns:3fr 1fr}@media screen and (max-width: 992px){:host{grid-template-columns:1fr}}.sidebar{padding:var(--space-unit)}.form-group .input-row.invalid input:not([type=checkbox]):not([type=radio]),.form-group .input-row.invalid select,.form-group .input-row.invalid textarea{color:var(--color-error-700);border-color:var(--color-error-300)}\n"], dependencies: [{ kind: "directive", type: ReactComponentHostDirective, selector: "[vdrReactComponentHost]", inputs: ["vdrReactComponentHost", "props", "context"] }, { kind: "component", type: RouteComponent, selector: "vdr-route-component" }, { kind: "ngmodule", type: SharedModule }], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.2", ngImport: i0, type: ReactRouteComponent, decorators: [{
             type: Component,
@@ -139,9 +140,34 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.2", ngImpor
         <vdr-route-component
             ><div [vdrReactComponentHost]="reactComponent" [props]="props"></div
         ></vdr-route-component>
-    `, encapsulation: ViewEncapsulation.None, standalone: true, imports: [ReactComponentHostDirective, RouteComponent, SharedModule], styles: [":host,.vdr-card{display:block;--card-padding: calc(var(--space-unit) * 3);container-type:inline-size}.card-container{border:1px solid var(--color-card-border);background-color:var(--color-card-bg);border-radius:var(--border-radius);padding:var(--card-padding) 0;box-shadow:0 2px 4px #0000000d}@container (max-width: 400px){.card-container{--card-padding: calc(var(--space-unit) * 2)}}.card-container.padding-x{padding-inline-start:var(--card-padding);padding-inline-end:var(--card-padding)}.title-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--card-padding)}.title{font-size:var(--font-size-base);padding:0 var(--card-padding)}.padding-x .title{padding:0}::ng-deep vdr-card+vdr-card{margin-top:calc(var(--space-unit) * 2)}.vdr-card+.vdr-card{margin-top:calc(var(--space-unit) * 2)}\n"] }]
+    `, encapsulation: ViewEncapsulation.None, standalone: true, imports: [ReactComponentHostDirective, RouteComponent, SharedModule], styles: [":host,.vdr-card{display:block;--card-padding: calc(var(--space-unit) * 3);container-type:inline-size}.card-container{border:1px solid var(--color-card-border);background-color:var(--color-card-bg);border-radius:var(--border-radius);padding:var(--card-padding) 0;box-shadow:0 2px 4px #0000000d}@container (max-width: 400px){.card-container{--card-padding: calc(var(--space-unit) * 2)}}.card-container.padding-x{padding-inline-start:var(--card-padding);padding-inline-end:var(--card-padding)}.title-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--card-padding)}.title{font-size:var(--font-size-base);padding:0 var(--card-padding)}.padding-x .title{padding:0}::ng-deep vdr-card+vdr-card{margin-top:calc(var(--space-unit) * 2)}.vdr-card+.vdr-card{margin-top:calc(var(--space-unit) * 2)}:host{display:block}.form-group label{font-size:var(--font-size-sm);color:var(--color-weight-800);margin-bottom:4px;display:inline-block}.tooltip-text{font-size:var(--font-size-xs);line-height:var(--font-size-sm);margin-bottom:4px}.input-row{display:flex}::ng-deep .input-row input:not([type=checkbox]),::ng-deep .input-row select,::ng-deep .input-row textarea,::ng-deep .input-row vdr-zone-selector,::ng-deep .input-row vdr-facet-value-selector,::ng-deep .input-row vdr-option-value-input,::ng-deep .input-row vdr-affixed-input,::ng-deep .input-row vdr-currency-input,::ng-deep .input-row vdr-rich-text-editor{width:100%}.input-row input:not([type=checkbox]),.input-row select,.input-row textarea{width:100%}:host,.vdr-action-bar{display:flex;justify-content:space-between;align-items:baseline;z-index:25;flex-direction:column-reverse}:host>.grow,.vdr-action-bar>.grow{flex:1}:host .right-content,.vdr-action-bar .right-content{width:100%;display:flex;justify-content:flex-end}:host ::ng-deep vdr-ab-right>*:last-child,.vdr-action-bar ::ng-deep vdr-ab-right>*:last-child{margin-inline-end:0px}@media screen and (min-width: 768px){:host,.vdr-action-bar{flex-direction:row}:host .right-content,.vdr-action-bar .right-content{width:initial}}:host,.vdr-page-detail-layout{display:grid;grid-template-columns:3fr 1fr}@media screen and (max-width: 992px){:host{grid-template-columns:1fr}}.sidebar{padding:var(--space-unit)}.form-group .input-row.invalid input:not([type=checkbox]):not([type=radio]),.form-group .input-row.invalid select,.form-group .input-row.invalid textarea{color:var(--color-error-700);border-color:var(--color-error-300)}\n"] }]
         }] });
 
+/**
+ * @description
+ * A container for the primary actions on a list or detail page
+ *
+ * @example
+ * ```ts
+ * import { ActionBar } from '@vendure/admin-ui/react';
+ *
+ * export function MyComponent() {
+ *   return (
+ *     <ActionBar leftContent={<div>Optional left content</div>}>
+ *       <button className='button primary'>Primary action</button>
+ *     </ActionBar>
+ *   );
+ * }
+ * ```
+ *
+ * @docsCategory react-components
+ */
+function ActionBar(props) {
+    return (React.createElement("div", { className: 'vdr-action-bar' },
+        React.createElement("div", { className: "left-content" }, props.leftContent),
+        React.createElement("div", { className: "right-content" }, props.children)));
+}
+
 /**
  * @description
  * A card component which can be used to group related content.
@@ -169,6 +195,61 @@ function Card(props) {
             React.createElement("div", { className: "contents" }, props.children))));
 }
 
+function registerCdsIcon(icon) {
+    ClarityIcons.addIcons(icon);
+}
+/**
+ * @description
+ * A React wrapper for the Clarity UI icon component.
+ *
+ * @example
+ * ```ts
+ * import { userIcon } from '@cds/core/icon';
+ * import { CdsIcon } from '@vendure/admin-ui/react';
+ *
+ * registerCdsIcon(userIcon);
+ * export function MyComponent() {
+ *    return <CdsIcon icon={userIcon} badge="warning" solid size="lg"></CdsIcon>;
+ * }
+ * ```
+ *
+ * @docsCategory react-components
+ */
+function CdsIcon(props) {
+    const { icon, ...rest } = props;
+    useEffect(() => {
+        ClarityIcons.addIcons(icon);
+    }, [icon]);
+    return React.createElement("cds-icon", { ...rest, shape: icon[0] });
+}
+
+/**
+ * @description
+ * A wrapper around form fields which provides a label, tooltip and error message.
+ *
+ * @example
+ * ```ts
+ * import { FormField } from '@vendure/admin-ui/react';
+ *
+ * export function MyReactComponent() {
+ *     return (
+ *        <FormField label="My field" tooltip="This is a tooltip" invalid errorMessage="This field is invalid">
+ *            <input type="text" />
+ *        </FormField>
+ *     );
+ * }
+ * ```
+ *
+ * @docsCategory react-components
+ */
+function FormField(props) {
+    return (React.createElement("div", { className: `form-group ` + (!props.label ? 'no-label' : '') + (props.invalid ? 'clr-error' : '') },
+        props.label && React.createElement("label", { htmlFor: props.for ?? '' }, props.label),
+        props.tooltip && React.createElement("div", { className: "tooltip-text" }, props.tooltip),
+        React.createElement("div", { className: `input-row ` + (props.invalid ? 'invalid' : '') }, props.children),
+        props.errorMessage && React.createElement("div", { className: "error-message" }, props.errorMessage)));
+}
+
 /**
  * @description
  * Exposes the Angular injector which allows the injection of services into React components.
@@ -227,6 +308,54 @@ function Link(props) {
     return (React.createElement("a", { href: href, onClick: onClick, ...rest }, props.children));
 }
 
+/**
+ * @description
+ * A container for page content which provides a consistent width and spacing.
+ *
+ * @example
+ * ```ts
+ * import { PageBlock } from '@vendure/admin-ui/react';
+ *
+ * export function MyComponent() {
+ *   return (
+ *     <PageBlock>
+ *       ...
+ *     </PageBlock>
+ *   );
+ * }
+ * ```
+ *
+ * @docsCategory react-components
+ */
+function PageBlock(props) {
+    return React.createElement("div", { className: "page-block" }, props.children);
+}
+
+/**
+ * @description
+ * A responsive container for detail views with a main content area and an optional sidebar.
+ *
+ * @example
+ * ```ts
+ * import { PageDetailLayout } from '@vendure/admin-ui/react';
+ *
+ * export function MyComponent() {
+ *   return (
+ *     <PageDetailLayout sidebar={<div>Sidebar content</div>}>
+ *       <div>Main content</div>
+ *     </PageDetailLayout>
+ *   );
+ * }
+ * ```
+ *
+ * @docsCategory react-components
+ */
+function PageDetailLayout(props) {
+    return (React.createElement("div", { className: 'vdr-page-detail-layout' },
+        React.createElement("div", { className: "main" }, props.children),
+        React.createElement("div", { className: "sidebar" }, props.sidebar)));
+}
+
 /**
  * @description
  * Provides the data available to React-based CustomDetailComponents.
@@ -495,6 +624,42 @@ function useDataService(operation) {
     return { data, loading, error, runQuery };
 }
 
+/**
+ * @description
+ * Provides access to the current route params and query params.
+ *
+ * @example
+ * ```ts
+ * import { useRouteParams } from '\@vendure/admin-ui/react';
+ * import React from 'react';
+ *
+ * export function MyComponent() {
+ *     const { params, queryParams } = useRouteParams();
+ *     // ...
+ *     return <div>{ params.id }</div>;
+ * }
+ * ```
+ *
+ * @docsCategory react-hooks
+ */
+function useRouteParams() {
+    const activatedRoute = useInjector(ActivatedRoute);
+    const [params, setParams] = useState(activatedRoute.snapshot.params);
+    const [queryParams, setQueryParams] = useState(activatedRoute.snapshot.queryParams);
+    useEffect(() => {
+        const subscription = activatedRoute.params.subscribe(value => {
+            setParams(value);
+        });
+        subscription.add(activatedRoute.queryParams.subscribe(value => setQueryParams(value)));
+        return () => subscription.unsubscribe();
+    }, []);
+    activatedRoute;
+    return {
+        params,
+        queryParams,
+    };
+}
+
 /**
  * @description
  * Registers a React component to be rendered in a detail page in the given location.
@@ -560,6 +725,8 @@ function registerReactCustomDetailComponent(config) {
  *     }),
  * ];
  * ```
+ *
+ * @docsCategory react-extensions
  */
 function registerReactDataTableComponent(config) {
     return {
@@ -637,5 +804,5 @@ function registerReactRouteComponent(options) {
  * Generated bundle index. Do not edit.
  */
 
-export { Card, HostedComponentContext, Link, REACT_CUSTOM_COLUMN_COMPONENT_OPTIONS, REACT_CUSTOM_DETAIL_COMPONENT_OPTIONS, REACT_INPUT_COMPONENT_OPTIONS, REACT_ROUTE_COMPONENT_OPTIONS, ReactComponentHostDirective, ReactCustomColumnComponent, ReactCustomDetailComponent, ReactFormInputComponent, ReactRouteComponent, registerReactCustomDetailComponent, registerReactDataTableComponent, registerReactFormInputComponent, registerReactRouteComponent, useDetailComponentData, useFormControl, useInjector, useMutation, usePageMetadata, useQuery };
+export { ActionBar, Card, CdsIcon, FormField, HostedComponentContext, Link, PageBlock, PageDetailLayout, REACT_CUSTOM_COLUMN_COMPONENT_OPTIONS, REACT_CUSTOM_DETAIL_COMPONENT_OPTIONS, REACT_INPUT_COMPONENT_OPTIONS, REACT_ROUTE_COMPONENT_OPTIONS, ReactComponentHostDirective, ReactCustomColumnComponent, ReactCustomDetailComponent, ReactFormInputComponent, ReactRouteComponent, registerCdsIcon, registerReactCustomDetailComponent, registerReactDataTableComponent, registerReactFormInputComponent, registerReactRouteComponent, useDetailComponentData, useFormControl, useInjector, useMutation, usePageMetadata, useQuery, useRouteParams };
 //# sourceMappingURL=vendure-admin-ui-react.mjs.map

package/fesm2022/vendure-admin-ui-react.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"vendure-admin-ui-react.mjs","sources":["../../src/lib/react/src/directives/react-component-host.directive.ts","../../src/lib/react/src/components/react-custom-column.component.ts","../../src/lib/react/src/components/react-custom-detail.component.ts","../../src/lib/react/src/components/react-form-input.component.ts","../../src/lib/react/src/components/react-route.component.ts","../../src/lib/react/src/react-components/Card.tsx","../../src/lib/react/src/react-hooks/use-injector.ts","../../src/lib/react/src/react-components/Link.tsx","../../src/lib/react/src/react-hooks/use-detail-component-data.ts","../../src/lib/react/src/react-hooks/use-form-control.ts","../../src/lib/react/src/react-hooks/use-page-metadata.ts","../../src/lib/react/src/react-hooks/use-query.ts","../../src/lib/react/src/register-react-custom-detail-component.ts","../../src/lib/react/src/register-react-data-table-component.ts","../../src/lib/react/src/register-react-form-input-component.ts","../../src/lib/react/src/register-react-route-component.ts","../../src/lib/react/src/public_api.ts","../../src/lib/react/src/vendure-admin-ui-react.ts"],"sourcesContent":["import { Directive, ElementRef, Injector, Input, Optional } from '@angular/core';\r\nimport { PageMetadataService } from '@vendure/admin-ui/core';\r\nimport { ComponentProps, createContext, createElement, ElementType } from 'react';\r\nimport { createRoot, Root } from 'react-dom/client';\r\nimport { HostedReactComponentContext } from '../types';\r\n\r\nexport const HostedComponentContext = createContext<HostedReactComponentContext | null>(null);\r\n\r\n/**\r\n * Based on https://netbasal.com/using-react-in-angular-applications-1bb907ecac91\r\n */\r\n@Directive({\r\n    selector: '[vdrReactComponentHost]',\r\n    standalone: true,\r\n})\r\nexport class ReactComponentHostDirective<Comp extends ElementType> {\r\n    @Input('vdrReactComponentHost') reactComponent: Comp;\r\n    @Input() props: ComponentProps<Comp>;\r\n    @Input() context: Record<string, any> = {};\r\n\r\n    private root: Root | null = null;\r\n\r\n    constructor(\r\n        private host: ElementRef,\r\n        private injector: Injector,\r\n        @Optional() private pageMetadataService?: PageMetadataService,\r\n    ) {}\r\n\r\n    async ngOnChanges() {\r\n        const Comp = this.reactComponent;\r\n\r\n        if (!this.root) {\r\n            this.root = createRoot(this.host.nativeElement);\r\n        }\r\n\r\n        this.root.render(\r\n            createElement(\r\n                HostedComponentContext.Provider,\r\n                {\r\n                    value: {\r\n                        ...this.props,\r\n                        ...this.context,\r\n                        injector: this.injector,\r\n                        pageMetadataService: this.pageMetadataService,\r\n                    },\r\n                },\r\n                createElement(Comp, this.props),\r\n            ),\r\n        );\r\n    }\r\n\r\n    ngOnDestroy() {\r\n        this.root?.unmount();\r\n    }\r\n}\r\n","import { Component, inject, InjectionToken, Input, OnInit, ViewEncapsulation } from '@angular/core';\r\nimport { CustomColumnComponent } from '@vendure/admin-ui/core';\r\nimport { ElementType } from 'react';\r\nimport { ReactComponentHostDirective } from '../directives/react-component-host.directive';\r\n\r\nexport const REACT_CUSTOM_COLUMN_COMPONENT_OPTIONS = new InjectionToken<{\r\n    component: ElementType;\r\n    props?: Record<string, any>;\r\n}>('REACT_CUSTOM_COLUMN_COMPONENT_OPTIONS');\r\n\r\n@Component({\r\n    selector: 'vdr-react-custom-column-component',\r\n    template: ` <div [vdrReactComponentHost]=\"reactComponent\" [props]=\"props\"></div> `,\r\n    styleUrls: ['./react-global-styles.scss'],\r\n    encapsulation: ViewEncapsulation.None,\r\n    standalone: true,\r\n    imports: [ReactComponentHostDirective],\r\n})\r\nexport class ReactCustomColumnComponent implements CustomColumnComponent, OnInit {\r\n    @Input() rowItem: any;\r\n\r\n    protected reactComponent = inject(REACT_CUSTOM_COLUMN_COMPONENT_OPTIONS).component;\r\n    private options = inject(REACT_CUSTOM_COLUMN_COMPONENT_OPTIONS);\r\n    protected props: Record<string, any>;\r\n\r\n    ngOnInit() {\r\n        this.props = {\r\n            rowItem: this.rowItem,\r\n            ...(this.options.props ?? {}),\r\n        };\r\n    }\r\n}\r\n","import { Component, inject, InjectionToken, OnInit, ViewEncapsulation } from '@angular/core';\r\nimport { FormGroup, UntypedFormGroup } from '@angular/forms';\r\nimport { CustomDetailComponent } from '@vendure/admin-ui/core';\r\nimport { ElementType } from 'react';\r\nimport { Observable } from 'rxjs';\r\nimport { ReactComponentHostDirective } from '../directives/react-component-host.directive';\r\n\r\nexport const REACT_CUSTOM_DETAIL_COMPONENT_OPTIONS = new InjectionToken<{\r\n    component: ElementType;\r\n    props?: Record<string, any>;\r\n}>('REACT_CUSTOM_DETAIL_COMPONENT_OPTIONS');\r\n\r\nexport interface ReactCustomDetailComponentContext {\r\n    detailForm: FormGroup;\r\n    entity$: Observable<any>;\r\n}\r\n\r\n@Component({\r\n    selector: 'vdr-react-custom-detail-component',\r\n    template: ` <div [vdrReactComponentHost]=\"reactComponent\" [context]=\"context\" [props]=\"props\"></div> `,\r\n    styleUrls: ['./react-global-styles.scss'],\r\n    encapsulation: ViewEncapsulation.None,\r\n    standalone: true,\r\n    imports: [ReactComponentHostDirective],\r\n})\r\nexport class ReactCustomDetailComponent implements CustomDetailComponent, OnInit {\r\n    detailForm: UntypedFormGroup;\r\n    entity$: Observable<any>;\r\n    protected props = inject(REACT_CUSTOM_DETAIL_COMPONENT_OPTIONS).props ?? {};\r\n    protected reactComponent = inject(REACT_CUSTOM_DETAIL_COMPONENT_OPTIONS).component;\r\n    protected context: ReactCustomDetailComponentContext;\r\n\r\n    ngOnInit() {\r\n        this.context = {\r\n            detailForm: this.detailForm,\r\n            entity$: this.entity$,\r\n        };\r\n    }\r\n}\r\n","import { Component, inject, InjectionToken, OnInit, ViewEncapsulation } from '@angular/core';\r\nimport { FormControl } from '@angular/forms';\r\nimport { CustomField, FormInputComponent } from '@vendure/admin-ui/core';\r\nimport { ElementType } from 'react';\r\nimport { ReactComponentHostDirective } from '../directives/react-component-host.directive';\r\nimport { ReactFormInputOptions } from '../types';\r\n\r\nexport const REACT_INPUT_COMPONENT_OPTIONS = new InjectionToken<{\r\n    component: ElementType;\r\n}>('REACT_INPUT_COMPONENT_OPTIONS');\r\n\r\n@Component({\r\n    selector: 'vdr-react-form-input-component',\r\n    template: ` <div [vdrReactComponentHost]=\"reactComponent\" [context]=\"context\" [props]=\"context\"></div> `,\r\n    styleUrls: ['./react-global-styles.scss'],\r\n    encapsulation: ViewEncapsulation.None,\r\n    standalone: true,\r\n    imports: [ReactComponentHostDirective],\r\n})\r\nexport class ReactFormInputComponent implements FormInputComponent, OnInit {\r\n    static readonly id: string = 'react-form-input-component';\r\n    readonly: boolean;\r\n    formControl: FormControl;\r\n    config: CustomField & Record<string, any>;\r\n\r\n    protected context: ReactFormInputOptions;\r\n\r\n    protected reactComponent = inject(REACT_INPUT_COMPONENT_OPTIONS).component;\r\n\r\n    ngOnInit() {\r\n        this.context = {\r\n            formControl: this.formControl,\r\n            readonly: this.readonly,\r\n            config: this.config,\r\n        };\r\n    }\r\n}\r\n","import { Component, inject, InjectionToken, ViewEncapsulation } from '@angular/core';\r\nimport { ROUTE_COMPONENT_OPTIONS, RouteComponent, SharedModule } from '@vendure/admin-ui/core';\r\nimport { ReactComponentHostDirective } from '../directives/react-component-host.directive';\r\nimport { ReactRouteComponentOptions } from '../types';\r\n\r\nexport const REACT_ROUTE_COMPONENT_OPTIONS = new InjectionToken<ReactRouteComponentOptions>(\r\n    'REACT_ROUTE_COMPONENT_OPTIONS',\r\n);\r\n\r\n@Component({\r\n    selector: 'vdr-react-route-component',\r\n    template: `\r\n        <vdr-route-component\r\n            ><div [vdrReactComponentHost]=\"reactComponent\" [props]=\"props\"></div\r\n        ></vdr-route-component>\r\n    `,\r\n    styleUrls: ['./react-global-styles.scss'],\r\n    encapsulation: ViewEncapsulation.None,\r\n    standalone: true,\r\n    imports: [ReactComponentHostDirective, RouteComponent, SharedModule],\r\n})\r\nexport class ReactRouteComponent {\r\n    protected props = inject(REACT_ROUTE_COMPONENT_OPTIONS).props;\r\n    protected reactComponent = inject(ROUTE_COMPONENT_OPTIONS).component;\r\n}\r\n","import React, { PropsWithChildren } from 'react';\r\n\r\n/**\r\n * @description\r\n * A card component which can be used to group related content.\r\n *\r\n * @example\r\n * ```ts\r\n * import { Card } from '@vendure/admin-ui/react';\r\n *\r\n * export function MyComponent() {\r\n *   return (\r\n *     <Card title='My Title'>\r\n *       <p>Some content</p>\r\n *     </Card>\r\n *   );\r\n * }\r\n * ```\r\n *\r\n * @docsCategory react-components\r\n */\r\nexport function Card(props: PropsWithChildren<{ title?: string; paddingX?: boolean }>) {\r\n    return (\r\n        <div className={'vdr-card'}>\r\n            <div className={`card-container ${props.paddingX !== false ? 'padding-x' : ''}`}>\r\n                {props.title && (\r\n                    <div className={'title-row'}>\r\n                        <div className=\"title\">{props.title}</div>\r\n                    </div>\r\n                )}\r\n                <div className=\"contents\">{props.children}</div>\r\n            </div>\r\n        </div>\r\n    );\r\n}\r\n","import { ProviderToken } from '@angular/core';\r\nimport { useContext } from 'react';\r\nimport { HostedComponentContext } from '../directives/react-component-host.directive';\r\n\r\n/**\r\n * @description\r\n * Exposes the Angular injector which allows the injection of services into React components.\r\n *\r\n * @example\r\n * ```ts\r\n * import { useInjector } from '\\@vendure/admin-ui/react';\r\n * import { NotificationService } from '\\@vendure/admin-ui/core';\r\n *\r\n * export const MyComponent = () => {\r\n *     const notificationService = useInjector(NotificationService);\r\n *\r\n *     const handleClick = () => {\r\n *         notificationService.success('Hello world!');\r\n *     };\r\n *     // ...\r\n *     return <div>...</div>;\r\n * }\r\n * ```\r\n *\r\n * @docsCategory react-hooks\r\n */\r\nexport function useInjector<T = any>(token: ProviderToken<T>): T {\r\n    const context = useContext(HostedComponentContext);\r\n    const instance = context?.injector.get(token);\r\n    if (!instance) {\r\n        throw new Error(`Could not inject ${(token as any).name ?? token.toString()}`);\r\n    }\r\n    return instance;\r\n}\r\n","import { Router } from '@angular/router';\r\nimport React, { PropsWithChildren } from 'react';\r\nimport { useInjector } from '../react-hooks/use-injector';\r\n\r\n/**\r\n * @description\r\n * A React component which renders an anchor tag and navigates to the specified route when clicked.\r\n * This is useful when you want to use a React component in a Vendure UI plugin which navigates to\r\n * a route in the admin-ui.\r\n *\r\n * @example\r\n * ```ts\r\n * import { Link } from '@vendure/admin-ui/react';\r\n *\r\n * export const MyReactComponent = () => {\r\n *     return <Link href=\"/extensions/my-extension\">Go to my extension</Link>;\r\n * }\r\n * ```\r\n *\r\n * @docsCategory react-components\r\n */\r\nexport function Link(props: PropsWithChildren<{ href: string; [props: string]: any }>) {\r\n    const router = useInjector(Router);\r\n    const { href, ...rest } = props;\r\n\r\n    function onClick(e: React.MouseEvent<HTMLAnchorElement, MouseEvent>) {\r\n        e.preventDefault();\r\n        void router.navigateByUrl(href);\r\n    }\r\n\r\n    return (\r\n        <a href={href} onClick={onClick} {...rest}>\r\n            {props.children}\r\n        </a>\r\n    );\r\n}\r\n","import { useContext, useEffect, useState } from 'react';\r\nimport { ReactCustomDetailComponentContext } from '../components/react-custom-detail.component';\r\nimport { HostedComponentContext } from '../directives/react-component-host.directive';\r\nimport { HostedReactComponentContext } from '../types';\r\n\r\n/**\r\n * @description\r\n * Provides the data available to React-based CustomDetailComponents.\r\n *\r\n * @example\r\n * ```ts\r\n * import { Card, useDetailComponentData } from '\\@vendure/admin-ui/react';\r\n * import React from 'react';\r\n *\r\n * export function CustomDetailComponent(props: any) {\r\n *     const { entity, detailForm } = useDetailComponentData();\r\n *     const updateName = () => {\r\n *         detailForm.get('name')?.setValue('New name');\r\n *         detailForm.markAsDirty();\r\n *     };\r\n *     return (\r\n *         <Card title={'Custom Detail Component'}>\r\n *             <button className=\"button\" onClick={updateName}>\r\n *                 Update name\r\n *             </button>\r\n *             <pre>{JSON.stringify(entity, null, 2)}</pre>\r\n *         </Card>\r\n *     );\r\n * }\r\n * ```\r\n *\r\n * @docsCategory react-hooks\r\n */\r\nexport function useDetailComponentData() {\r\n    const context = useContext(\r\n        HostedComponentContext,\r\n    ) as HostedReactComponentContext<ReactCustomDetailComponentContext>;\r\n\r\n    if (!context.detailForm || !context.entity$) {\r\n        throw new Error(`The useDetailComponentData hook can only be used within a CustomDetailComponent`);\r\n    }\r\n\r\n    const [entity, setEntity] = useState(null);\r\n\r\n    useEffect(() => {\r\n        const subscription = context.entity$.subscribe(value => {\r\n            setEntity(value);\r\n        });\r\n        return () => subscription.unsubscribe();\r\n    }, []);\r\n\r\n    return {\r\n        entity,\r\n        detailForm: context.detailForm,\r\n    };\r\n}\r\n","import { CustomFieldType } from '@vendure/common/lib/shared-types';\r\nimport { useContext, useEffect, useState } from 'react';\r\nimport { HostedComponentContext } from '../directives/react-component-host.directive';\r\nimport { HostedReactComponentContext, ReactFormInputOptions } from '../types';\r\n\r\n/**\r\n * @description\r\n * Provides access to the current FormControl value and a method to update the value.\r\n *\r\n * @example\r\n * ```ts\r\n * import { useFormControl, ReactFormInputProps } from '\\@vendure/admin-ui/react';\r\n * import React from 'react';\r\n *\r\n * export function ReactNumberInput({ readonly }: ReactFormInputProps) {\r\n *     const { value, setFormValue } = useFormControl();\r\n *\r\n *     const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\r\n *         setFormValue(val);\r\n *     };\r\n *     return (\r\n *         <div>\r\n *             <input readOnly={readonly} type=\"number\" onChange={handleChange} value={value} />\r\n *         </div>\r\n *     );\r\n * }\r\n * ```\r\n *\r\n * @docsCategory react-hooks\r\n */\r\nexport function useFormControl() {\r\n    const context = useContext(HostedComponentContext);\r\n    if (!context) {\r\n        throw new Error('No HostedComponentContext found');\r\n    }\r\n    if (!isFormInputContext(context)) {\r\n        throw new Error('useFormControl() can only be used in a form input component');\r\n    }\r\n    const { formControl, config } = context;\r\n    const [value, setValue] = useState(formControl.value ?? 0);\r\n\r\n    useEffect(() => {\r\n        const subscription = formControl.valueChanges.subscribe(v => {\r\n            setValue(v);\r\n        });\r\n        return () => {\r\n            subscription.unsubscribe();\r\n        };\r\n    }, []);\r\n\r\n    function setFormValue(newValue: any) {\r\n        formControl.setValue(coerceFormValue(newValue, config.type as CustomFieldType));\r\n        formControl.markAsDirty();\r\n    }\r\n\r\n    return { value, setFormValue };\r\n}\r\n\r\nfunction isFormInputContext(\r\n    context: HostedReactComponentContext,\r\n): context is HostedReactComponentContext<ReactFormInputOptions> {\r\n    return context.config && context.formControl;\r\n}\r\n\r\nfunction coerceFormValue(value: any, type: CustomFieldType) {\r\n    switch (type) {\r\n        case 'int':\r\n        case 'float':\r\n            return Number(value);\r\n        case 'boolean':\r\n            return Boolean(value);\r\n        default:\r\n            return value;\r\n    }\r\n}\r\n","import { BreadcrumbValue } from '@vendure/admin-ui/core';\r\nimport { useContext } from 'react';\r\nimport { HostedComponentContext } from '../directives/react-component-host.directive';\r\nimport { HostedReactComponentContext, ReactRouteComponentOptions } from '../types';\r\n\r\n/**\r\n * @description\r\n * Provides functions for setting the current page title and breadcrumb.\r\n *\r\n * @example\r\n * ```ts\r\n * import { usePageMetadata } from '\\@vendure/admin-ui/react';\r\n * import { useEffect } from 'react';\r\n *\r\n * export const MyComponent = () => {\r\n *     const { setTitle, setBreadcrumb } = usePageMetadata();\r\n *     useEffect(() => {\r\n *         setTitle('My Page');\r\n *         setBreadcrumb([\r\n *             { link: ['./parent'], label: 'Parent Page' },\r\n *             { link: ['./'], label: 'This Page' },\r\n *         ]);\r\n *     }, []);\r\n *     // ...\r\n *     return <div>...</div>;\r\n * }\r\n * ```\r\n *\r\n * @docsCategory react-hooks\r\n */\r\nexport function usePageMetadata() {\r\n    const context = useContext(\r\n        HostedComponentContext,\r\n    ) as HostedReactComponentContext<ReactRouteComponentOptions>;\r\n    const setBreadcrumb = (newValue: BreadcrumbValue) => {\r\n        context.pageMetadataService?.setBreadcrumbs(newValue);\r\n    };\r\n    const setTitle = (newTitle: string) => {\r\n        context.pageMetadataService?.setTitle(newTitle);\r\n    };\r\n\r\n    return {\r\n        setBreadcrumb,\r\n        setTitle,\r\n    };\r\n}\r\n","import { TypedDocumentNode } from '@graphql-typed-document-node/core';\r\nimport { DataService } from '@vendure/admin-ui/core';\r\nimport { DocumentNode } from 'graphql/index';\r\nimport { useCallback, useContext, useEffect, useState } from 'react';\r\nimport { firstValueFrom, Observable } from 'rxjs';\r\nimport { tap } from 'rxjs/operators';\r\nimport { HostedComponentContext } from '../directives/react-component-host.directive';\r\n\r\n/**\r\n * @description\r\n * A React hook which provides access to the results of a GraphQL query.\r\n *\r\n * @example\r\n * ```ts\r\n * import { useQuery } from '\\@vendure/admin-ui/react';\r\n * import { gql } from 'graphql-tag';\r\n *\r\n * const GET_PRODUCT = gql`\r\n *    query GetProduct($id: ID!) {\r\n *      product(id: $id) {\r\n *        id\r\n *        name\r\n *        description\r\n *      }\r\n *    }`;\r\n *\r\n * export const MyComponent = () => {\r\n *     const { data, loading, error } = useQuery(GET_PRODUCT, { id: '1' });\r\n *\r\n *     if (loading) return <div>Loading...</div>;\r\n *     if (error) return <div>Error! { error }</div>;\r\n *     return (\r\n *         <div>\r\n *             <h1>{data.product.name}</h1>\r\n *             <p>{data.product.description}</p>\r\n *         </div>\r\n *     );\r\n * };\r\n * ```\r\n *\r\n * @docsCategory react-hooks\r\n */\r\nexport function useQuery<T, V extends Record<string, any> = Record<string, any>>(\r\n    query: DocumentNode | TypedDocumentNode<T, V>,\r\n    variables?: V,\r\n) {\r\n    const { data, loading, error, runQuery } = useDataService<T, V>(\r\n        (dataService, vars) => dataService.query(query, vars).stream$,\r\n    );\r\n    useEffect(() => {\r\n        const subscription = runQuery(variables).subscribe();\r\n        return () => subscription.unsubscribe();\r\n    }, [runQuery]);\r\n\r\n    const refetch = (variables?: V) => firstValueFrom(runQuery(variables));\r\n    return { data, loading, error, refetch } as const;\r\n}\r\n\r\n/**\r\n * @description\r\n * A React hook which allows you to execute a GraphQL mutation.\r\n *\r\n * @example\r\n * ```ts\r\n * import { useMutation } from '\\@vendure/admin-ui/react';\r\n * import { gql } from 'graphql-tag';\r\n *\r\n * const UPDATE_PRODUCT = gql`\r\n *   mutation UpdateProduct($input: UpdateProductInput!) {\r\n *     updateProduct(input: $input) {\r\n *     id\r\n *     name\r\n *   }\r\n * }`;\r\n *\r\n * export const MyComponent = () => {\r\n *     const [updateProduct, { data, loading, error }] = useMutation(UPDATE_PRODUCT);\r\n *\r\n *     const handleClick = () => {\r\n *         updateProduct({\r\n *             input: {\r\n *                 id: '1',\r\n *                 name: 'New name',\r\n *             },\r\n *         }).then(result => {\r\n *             // do something with the result\r\n *         });\r\n *     };\r\n *\r\n *     if (loading) return <div>Loading...</div>;\r\n *     if (error) return <div>Error! { error }</div>;\r\n *\r\n *     return (\r\n *     <div>\r\n *         <button onClick={handleClick}>Update product</button>\r\n *         {data && <div>Product updated!</div>}\r\n *     </div>\r\n *     );\r\n * };\r\n * ```\r\n *\r\n * @docsCategory react-hooks\r\n */\r\nexport function useMutation<T, V extends Record<string, any> = Record<string, any>>(\r\n    mutation: DocumentNode | TypedDocumentNode<T, V>,\r\n) {\r\n    const { data, loading, error, runQuery } = useDataService<T, V>((dataService, variables) =>\r\n        dataService.mutate(mutation, variables),\r\n    );\r\n    const rest = { data, loading, error };\r\n    const execute = (variables?: V) => firstValueFrom(runQuery(variables));\r\n    return [execute, rest] as [typeof execute, typeof rest];\r\n}\r\n\r\nfunction useDataService<T, V extends Record<string, any> = Record<string, any>>(\r\n    operation: (dataService: DataService, variables?: V) => Observable<T>,\r\n) {\r\n    const context = useContext(HostedComponentContext);\r\n    const dataService = context?.injector.get(DataService);\r\n    if (!dataService) {\r\n        throw new Error('No DataService found in HostedComponentContext');\r\n    }\r\n\r\n    const [data, setData] = useState<T>();\r\n    const [error, setError] = useState<string>();\r\n    const [loading, setLoading] = useState(false);\r\n\r\n    const runQuery = useCallback((variables?: V) => {\r\n        setLoading(true);\r\n        return operation(dataService, variables).pipe(\r\n            tap({\r\n                next: res => {\r\n                    setData(res);\r\n                    setLoading(false);\r\n                },\r\n                error: err => {\r\n                    setError(err.message);\r\n                    setLoading(false);\r\n                },\r\n            }),\r\n        );\r\n    }, []);\r\n\r\n    return { data, loading, error, runQuery };\r\n}\r\n","import { APP_INITIALIZER } from '@angular/core';\r\nimport { CustomDetailComponentLocationId, CustomDetailComponentService } from '@vendure/admin-ui/core';\r\nimport { ElementType } from 'react';\r\nimport {\r\n    REACT_CUSTOM_DETAIL_COMPONENT_OPTIONS,\r\n    ReactCustomDetailComponent,\r\n} from './components/react-custom-detail.component';\r\n\r\n/**\r\n * @description\r\n * Configures a React-based component to be placed in a detail page in the given location.\r\n *\r\n * @docsCategory react-extensions\r\n */\r\nexport interface ReactCustomDetailComponentConfig {\r\n    /**\r\n     * @description\r\n     * The id of the detail page location in which to place the component.\r\n     */\r\n    locationId: CustomDetailComponentLocationId;\r\n    /**\r\n     * @description\r\n     * The React component to render.\r\n     */\r\n    component: ElementType;\r\n    /**\r\n     * @description\r\n     * Optional props to pass to the React component.\r\n     */\r\n    props?: Record<string, any>;\r\n}\r\n\r\n/**\r\n * @description\r\n * Registers a React component to be rendered in a detail page in the given location.\r\n * Components used as custom detail components can make use of the {@link useDetailComponentData} hook.\r\n *\r\n * @docsCategory react-extensions\r\n */\r\nexport function registerReactCustomDetailComponent(config: ReactCustomDetailComponentConfig) {\r\n    return {\r\n        provide: APP_INITIALIZER,\r\n        multi: true,\r\n        useFactory: (customDetailComponentService: CustomDetailComponentService) => () => {\r\n            customDetailComponentService.registerCustomDetailComponent({\r\n                component: ReactCustomDetailComponent,\r\n                locationId: config.locationId,\r\n                providers: [\r\n                    {\r\n                        provide: REACT_CUSTOM_DETAIL_COMPONENT_OPTIONS,\r\n                        useValue: {\r\n                            component: config.component,\r\n                            props: config.props,\r\n                        },\r\n                    },\r\n                ],\r\n            });\r\n        },\r\n        deps: [CustomDetailComponentService],\r\n    };\r\n}\r\n","import { APP_INITIALIZER } from '@angular/core';\r\nimport {\r\n    DataTableColumnId,\r\n    DataTableCustomComponentService,\r\n    DataTableLocationId,\r\n} from '@vendure/admin-ui/core';\r\nimport { ElementType } from 'react';\r\nimport {\r\n    REACT_CUSTOM_COLUMN_COMPONENT_OPTIONS,\r\n    ReactCustomColumnComponent,\r\n} from './components/react-custom-column.component';\r\n\r\n/**\r\n * @description\r\n * Configures a {@link CustomDetailComponent} to be placed in the given location.\r\n *\r\n * @docsCategory react-extensions\r\n */\r\nexport interface ReactDataTableComponentConfig {\r\n    /**\r\n     * @description\r\n     * The location in the UI where the custom component should be placed.\r\n     */\r\n    tableId: DataTableLocationId;\r\n    /**\r\n     * @description\r\n     * The column in the table where the custom component should be placed.\r\n     */\r\n    columnId: DataTableColumnId;\r\n    /**\r\n     * @description\r\n     * The component to render in the table cell. This component will receive the `rowItem` prop\r\n     * which is the data object for the row, e.g. the `Product` object if used in the `product-list` table.\r\n     */\r\n    component: ElementType;\r\n    /**\r\n     * @description\r\n     * Optional props to pass to the React component.\r\n     */\r\n    props?: Record<string, any>;\r\n}\r\n\r\n/**\r\n * @description\r\n * The props that will be passed to the React component registered via {@link registerReactDataTableComponent}.\r\n */\r\nexport interface ReactDataTableComponentProps {\r\n    rowItem: any;\r\n    [prop: string]: any;\r\n}\r\n\r\n/**\r\n * @description\r\n * Registers a React component to be rendered in a data table in the given location.\r\n * The component will receive the `rowItem` prop which is the data object for the row,\r\n * e.g. the `Product` object if used in the `product-list` table.\r\n *\r\n * @example\r\n * ```ts title=\"components/SlugWithLink.tsx\"\r\n * import { ReactDataTableComponentProps } from '\\@vendure/admin-ui/react';\r\n * import React from 'react';\r\n *\r\n * export function SlugWithLink({ rowItem }: ReactDataTableComponentProps) {\r\n *     return (\r\n *         <a href={`https://example.com/products/${rowItem.slug}`} target=\"_blank\">\r\n *             {rowItem.slug}\r\n *         </a>\r\n *     );\r\n * }\r\n * ```\r\n *\r\n * ```ts title=\"providers.ts\"\r\n * import { registerReactDataTableComponent } from '\\@vendure/admin-ui/react';\r\n * import { SlugWithLink } from './components/SlugWithLink';\r\n *\r\n * export default [\r\n *     registerReactDataTableComponent({\r\n *         component: SlugWithLink,\r\n *         tableId: 'product-list',\r\n *         columnId: 'slug',\r\n *         props: {\r\n *         foo: 'bar',\r\n *         },\r\n *     }),\r\n * ];\r\n * ```\r\n */\r\nexport function registerReactDataTableComponent(config: ReactDataTableComponentConfig) {\r\n    return {\r\n        provide: APP_INITIALIZER,\r\n        multi: true,\r\n        useFactory: (dataTableCustomComponentService: DataTableCustomComponentService) => () => {\r\n            dataTableCustomComponentService.registerCustomComponent({\r\n                ...config,\r\n                component: ReactCustomColumnComponent,\r\n                providers: [\r\n                    {\r\n                        provide: REACT_CUSTOM_COLUMN_COMPONENT_OPTIONS,\r\n                        useValue: {\r\n                            component: config.component,\r\n                            props: config.props,\r\n                        },\r\n                    },\r\n                ],\r\n            });\r\n        },\r\n        deps: [DataTableCustomComponentService],\r\n    };\r\n}\r\n","import { APP_INITIALIZER, FactoryProvider } from '@angular/core';\r\nimport { ComponentRegistryService } from '@vendure/admin-ui/core';\r\nimport { ElementType } from 'react';\r\nimport {\r\n    REACT_INPUT_COMPONENT_OPTIONS,\r\n    ReactFormInputComponent,\r\n} from './components/react-form-input.component';\r\n\r\n/**\r\n * @description\r\n * Registers a React component to be used as a {@link FormInputComponent}.\r\n *\r\n * @docsCategory react-extensions\r\n */\r\nexport function registerReactFormInputComponent(id: string, component: ElementType): FactoryProvider {\r\n    return {\r\n        provide: APP_INITIALIZER,\r\n        multi: true,\r\n        useFactory: (registry: ComponentRegistryService) => () => {\r\n            registry.registerInputComponent(id, ReactFormInputComponent, [\r\n                {\r\n                    provide: REACT_INPUT_COMPONENT_OPTIONS,\r\n                    useValue: {\r\n                        component,\r\n                    },\r\n                },\r\n            ]);\r\n        },\r\n        deps: [ComponentRegistryService],\r\n    };\r\n}\r\n","import { Route } from '@angular/router';\r\nimport { ResultOf, TypedDocumentNode } from '@graphql-typed-document-node/core';\r\nimport { registerRouteComponent, RegisterRouteComponentOptions } from '@vendure/admin-ui/core';\r\nimport { DocumentNode } from 'graphql/index';\r\nimport { ElementType } from 'react';\r\nimport { REACT_ROUTE_COMPONENT_OPTIONS, ReactRouteComponent } from './components/react-route.component';\r\nimport { ReactRouteComponentOptions } from './types';\r\n\r\ntype RegisterReactRouteComponentOptions<\r\n    Entity extends { id: string; updatedAt?: string },\r\n    T extends DocumentNode | TypedDocumentNode<any, { id: string }>,\r\n    Field extends keyof ResultOf<T>,\r\n    R extends Field,\r\n> = RegisterRouteComponentOptions<ElementType, Entity, T, Field, R> & {\r\n    props?: Record<string, any>;\r\n};\r\n\r\n/**\r\n * @description\r\n * Registers a React component to be used as a route component.\r\n *\r\n * @docsCategory react-extensions\r\n */\r\nexport function registerReactRouteComponent<\r\n    Entity extends { id: string; updatedAt?: string },\r\n    T extends DocumentNode | TypedDocumentNode<any, { id: string }>,\r\n    Field extends keyof ResultOf<T>,\r\n    R extends Field,\r\n>(options: RegisterReactRouteComponentOptions<Entity, T, Field, R>): Route {\r\n    const routeDef = registerRouteComponent(options);\r\n    return {\r\n        ...routeDef,\r\n        providers: [\r\n            {\r\n                provide: REACT_ROUTE_COMPONENT_OPTIONS,\r\n                useValue: {\r\n                    props: options.props,\r\n                } satisfies ReactRouteComponentOptions,\r\n            },\r\n            ...(routeDef.providers ?? []),\r\n        ],\r\n        component: ReactRouteComponent,\r\n    };\r\n}\r\n","// This file was generated by the build-public-api.ts script\nexport * from './components/react-custom-column.component';\nexport * from './components/react-custom-detail.component';\nexport * from './components/react-form-input.component';\nexport * from './components/react-route.component';\nexport * from './directives/react-component-host.directive';\nexport * from './react-components/Card';\nexport * from './react-components/Link';\nexport * from './react-hooks/use-detail-component-data';\nexport * from './react-hooks/use-form-control';\nexport * from './react-hooks/use-injector';\nexport * from './react-hooks/use-page-metadata';\nexport * from './react-hooks/use-query';\nexport * from './register-react-custom-detail-component';\nexport * from './register-react-data-table-component';\nexport * from './register-react-form-input-component';\nexport * from './register-react-route-component';\nexport * from './types';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"vendure-admin-ui-react.mjs","sources":["../../src/lib/react/src/directives/react-component-host.directive.ts","../../src/lib/react/src/components/react-custom-column.component.ts","../../src/lib/react/src/components/react-custom-detail.component.ts","../../src/lib/react/src/components/react-form-input.component.ts","../../src/lib/react/src/components/react-route.component.ts","../../src/lib/react/src/react-components/ActionBar.tsx","../../src/lib/react/src/react-components/Card.tsx","../../src/lib/react/src/react-components/CdsIcon.tsx","../../src/lib/react/src/react-components/FormField.tsx","../../src/lib/react/src/react-hooks/use-injector.ts","../../src/lib/react/src/react-components/Link.tsx","../../src/lib/react/src/react-components/PageBlock.tsx","../../src/lib/react/src/react-components/PageDetailLayout.tsx","../../src/lib/react/src/react-hooks/use-detail-component-data.ts","../../src/lib/react/src/react-hooks/use-form-control.ts","../../src/lib/react/src/react-hooks/use-page-metadata.ts","../../src/lib/react/src/react-hooks/use-query.ts","../../src/lib/react/src/react-hooks/use-route-params.ts","../../src/lib/react/src/register-react-custom-detail-component.ts","../../src/lib/react/src/register-react-data-table-component.ts","../../src/lib/react/src/register-react-form-input-component.ts","../../src/lib/react/src/register-react-route-component.ts","../../src/lib/react/src/public_api.ts","../../src/lib/react/src/vendure-admin-ui-react.ts"],"sourcesContent":["import { Directive, ElementRef, Injector, Input, Optional } from '@angular/core';\r\nimport { PageMetadataService } from '@vendure/admin-ui/core';\r\nimport { ComponentProps, createContext, createElement, ElementType } from 'react';\r\nimport { createRoot, Root } from 'react-dom/client';\r\nimport { HostedReactComponentContext } from '../types';\r\n\r\nexport const HostedComponentContext = createContext<HostedReactComponentContext | null>(null);\r\n\r\n/**\r\n * Based on https://netbasal.com/using-react-in-angular-applications-1bb907ecac91\r\n */\r\n@Directive({\r\n    selector: '[vdrReactComponentHost]',\r\n    standalone: true,\r\n})\r\nexport class ReactComponentHostDirective<Comp extends ElementType> {\r\n    @Input('vdrReactComponentHost') reactComponent: Comp;\r\n    @Input() props: ComponentProps<Comp>;\r\n    @Input() context: Record<string, any> = {};\r\n\r\n    private root: Root | null = null;\r\n\r\n    constructor(\r\n        private host: ElementRef,\r\n        private injector: Injector,\r\n        @Optional() private pageMetadataService?: PageMetadataService,\r\n    ) {}\r\n\r\n    async ngOnChanges() {\r\n        const Comp = this.reactComponent;\r\n\r\n        if (!this.root) {\r\n            this.root = createRoot(this.host.nativeElement);\r\n        }\r\n\r\n        this.root.render(\r\n            createElement(\r\n                HostedComponentContext.Provider,\r\n                {\r\n                    value: {\r\n                        ...this.props,\r\n                        ...this.context,\r\n                        injector: this.injector,\r\n                        pageMetadataService: this.pageMetadataService,\r\n                    },\r\n                },\r\n                createElement(Comp, this.props),\r\n            ),\r\n        );\r\n    }\r\n\r\n    ngOnDestroy() {\r\n        this.root?.unmount();\r\n    }\r\n}\r\n","import { Component, inject, InjectionToken, Input, OnInit, ViewEncapsulation } from '@angular/core';\r\nimport { CustomColumnComponent } from '@vendure/admin-ui/core';\r\nimport { ElementType } from 'react';\r\nimport { ReactComponentHostDirective } from '../directives/react-component-host.directive';\r\n\r\nexport const REACT_CUSTOM_COLUMN_COMPONENT_OPTIONS = new InjectionToken<{\r\n    component: ElementType;\r\n    props?: Record<string, any>;\r\n}>('REACT_CUSTOM_COLUMN_COMPONENT_OPTIONS');\r\n\r\n@Component({\r\n    selector: 'vdr-react-custom-column-component',\r\n    template: ` <div [vdrReactComponentHost]=\"reactComponent\" [props]=\"props\"></div> `,\r\n    styleUrls: ['./react-global-styles.scss'],\r\n    encapsulation: ViewEncapsulation.None,\r\n    standalone: true,\r\n    imports: [ReactComponentHostDirective],\r\n})\r\nexport class ReactCustomColumnComponent implements CustomColumnComponent, OnInit {\r\n    @Input() rowItem: any;\r\n\r\n    protected reactComponent = inject(REACT_CUSTOM_COLUMN_COMPONENT_OPTIONS).component;\r\n    private options = inject(REACT_CUSTOM_COLUMN_COMPONENT_OPTIONS);\r\n    protected props: Record<string, any>;\r\n\r\n    ngOnInit() {\r\n        this.props = {\r\n            rowItem: this.rowItem,\r\n            ...(this.options.props ?? {}),\r\n        };\r\n    }\r\n}\r\n","import { Component, inject, InjectionToken, OnInit, ViewEncapsulation } from '@angular/core';\r\nimport { FormGroup, UntypedFormGroup } from '@angular/forms';\r\nimport { CustomDetailComponent } from '@vendure/admin-ui/core';\r\nimport { ElementType } from 'react';\r\nimport { Observable } from 'rxjs';\r\nimport { ReactComponentHostDirective } from '../directives/react-component-host.directive';\r\n\r\nexport const REACT_CUSTOM_DETAIL_COMPONENT_OPTIONS = new InjectionToken<{\r\n    component: ElementType;\r\n    props?: Record<string, any>;\r\n}>('REACT_CUSTOM_DETAIL_COMPONENT_OPTIONS');\r\n\r\nexport interface ReactCustomDetailComponentContext {\r\n    detailForm: FormGroup;\r\n    entity$: Observable<any>;\r\n}\r\n\r\n@Component({\r\n    selector: 'vdr-react-custom-detail-component',\r\n    template: ` <div [vdrReactComponentHost]=\"reactComponent\" [context]=\"context\" [props]=\"props\"></div> `,\r\n    styleUrls: ['./react-global-styles.scss'],\r\n    encapsulation: ViewEncapsulation.None,\r\n    standalone: true,\r\n    imports: [ReactComponentHostDirective],\r\n})\r\nexport class ReactCustomDetailComponent implements CustomDetailComponent, OnInit {\r\n    detailForm: UntypedFormGroup;\r\n    entity$: Observable<any>;\r\n    protected props = inject(REACT_CUSTOM_DETAIL_COMPONENT_OPTIONS).props ?? {};\r\n    protected reactComponent = inject(REACT_CUSTOM_DETAIL_COMPONENT_OPTIONS).component;\r\n    protected context: ReactCustomDetailComponentContext;\r\n\r\n    ngOnInit() {\r\n        this.context = {\r\n            detailForm: this.detailForm,\r\n            entity$: this.entity$,\r\n        };\r\n    }\r\n}\r\n","import { Component, inject, InjectionToken, OnInit, ViewEncapsulation } from '@angular/core';\r\nimport { FormControl } from '@angular/forms';\r\nimport { CustomField, FormInputComponent } from '@vendure/admin-ui/core';\r\nimport { ElementType } from 'react';\r\nimport { ReactComponentHostDirective } from '../directives/react-component-host.directive';\r\nimport { ReactFormInputOptions } from '../types';\r\n\r\nexport const REACT_INPUT_COMPONENT_OPTIONS = new InjectionToken<{\r\n    component: ElementType;\r\n}>('REACT_INPUT_COMPONENT_OPTIONS');\r\n\r\n@Component({\r\n    selector: 'vdr-react-form-input-component',\r\n    template: ` <div [vdrReactComponentHost]=\"reactComponent\" [context]=\"context\" [props]=\"context\"></div> `,\r\n    styleUrls: ['./react-global-styles.scss'],\r\n    encapsulation: ViewEncapsulation.None,\r\n    standalone: true,\r\n    imports: [ReactComponentHostDirective],\r\n})\r\nexport class ReactFormInputComponent implements FormInputComponent, OnInit {\r\n    static readonly id: string = 'react-form-input-component';\r\n    readonly: boolean;\r\n    formControl: FormControl;\r\n    config: CustomField & Record<string, any>;\r\n\r\n    protected context: ReactFormInputOptions;\r\n\r\n    protected reactComponent = inject(REACT_INPUT_COMPONENT_OPTIONS).component;\r\n\r\n    ngOnInit() {\r\n        this.context = {\r\n            formControl: this.formControl,\r\n            readonly: this.readonly,\r\n            config: this.config,\r\n        };\r\n    }\r\n}\r\n","import { Component, inject, InjectionToken, ViewEncapsulation } from '@angular/core';\r\nimport { ROUTE_COMPONENT_OPTIONS, RouteComponent, SharedModule } from '@vendure/admin-ui/core';\r\nimport { ReactComponentHostDirective } from '../directives/react-component-host.directive';\r\nimport { ReactRouteComponentOptions } from '../types';\r\n\r\nexport const REACT_ROUTE_COMPONENT_OPTIONS = new InjectionToken<ReactRouteComponentOptions>(\r\n    'REACT_ROUTE_COMPONENT_OPTIONS',\r\n);\r\n\r\n@Component({\r\n    selector: 'vdr-react-route-component',\r\n    template: `\r\n        <vdr-route-component\r\n            ><div [vdrReactComponentHost]=\"reactComponent\" [props]=\"props\"></div\r\n        ></vdr-route-component>\r\n    `,\r\n    styleUrls: ['./react-global-styles.scss'],\r\n    encapsulation: ViewEncapsulation.None,\r\n    standalone: true,\r\n    imports: [ReactComponentHostDirective, RouteComponent, SharedModule],\r\n})\r\nexport class ReactRouteComponent {\r\n    protected props = inject(REACT_ROUTE_COMPONENT_OPTIONS).props;\r\n    protected reactComponent = inject(ROUTE_COMPONENT_OPTIONS).component;\r\n}\r\n","import React, { PropsWithChildren, ReactNode } from 'react';\r\n\r\n/**\r\n * @description\r\n * A container for the primary actions on a list or detail page\r\n *\r\n * @example\r\n * ```ts\r\n * import { ActionBar } from '@vendure/admin-ui/react';\r\n *\r\n * export function MyComponent() {\r\n *   return (\r\n *     <ActionBar leftContent={<div>Optional left content</div>}>\r\n *       <button className='button primary'>Primary action</button>\r\n *     </ActionBar>\r\n *   );\r\n * }\r\n * ```\r\n *\r\n * @docsCategory react-components\r\n */\r\nexport function ActionBar(props: PropsWithChildren<{ leftContent?: ReactNode }>) {\r\n    return (\r\n        <div className={'vdr-action-bar'}>\r\n            <div className=\"left-content\">{props.leftContent}</div>\r\n            <div className=\"right-content\">{props.children}</div>\r\n        </div>\r\n    );\r\n}\r\n","import React, { PropsWithChildren } from 'react';\r\n\r\n/**\r\n * @description\r\n * A card component which can be used to group related content.\r\n *\r\n * @example\r\n * ```ts\r\n * import { Card } from '@vendure/admin-ui/react';\r\n *\r\n * export function MyComponent() {\r\n *   return (\r\n *     <Card title='My Title'>\r\n *       <p>Some content</p>\r\n *     </Card>\r\n *   );\r\n * }\r\n * ```\r\n *\r\n * @docsCategory react-components\r\n */\r\nexport function Card(props: PropsWithChildren<{ title?: string; paddingX?: boolean }>) {\r\n    return (\r\n        <div className={'vdr-card'}>\r\n            <div className={`card-container ${props.paddingX !== false ? 'padding-x' : ''}`}>\r\n                {props.title && (\r\n                    <div className={'title-row'}>\r\n                        <div className=\"title\">{props.title}</div>\r\n                    </div>\r\n                )}\r\n                <div className=\"contents\">{props.children}</div>\r\n            </div>\r\n        </div>\r\n    );\r\n}\r\n","import { ClarityIcons } from '@cds/core/icon';\r\nimport { IconShapeTuple } from '@cds/core/icon/interfaces/icon.interfaces';\r\nimport React, { DOMAttributes, useEffect } from 'react';\r\n\r\ntype CustomElement<T> = Partial<T & DOMAttributes<T> & { children: any }>;\r\n\r\nexport interface CdsIconProps {\r\n    shape: string;\r\n    size: string | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl';\r\n    direction: 'up' | 'down' | 'left' | 'right';\r\n    flip: 'horizontal' | 'vertical';\r\n    solid: boolean;\r\n    status: 'info' | 'success' | 'warning' | 'danger';\r\n    inverse: boolean;\r\n    badge: 'info' | 'success' | 'warning' | 'danger';\r\n}\r\n\r\ndeclare global {\r\n    namespace JSX {\r\n        interface IntrinsicElements {\r\n            ['cds-icon']: CustomElement<CdsIconProps>;\r\n        }\r\n    }\r\n}\r\n\r\nexport function registerCdsIcon(icon: IconShapeTuple) {\r\n    ClarityIcons.addIcons(icon);\r\n}\r\n\r\n/**\r\n * @description\r\n * A React wrapper for the Clarity UI icon component.\r\n *\r\n * @example\r\n * ```ts\r\n * import { userIcon } from '@cds/core/icon';\r\n * import { CdsIcon } from '@vendure/admin-ui/react';\r\n *\r\n * registerCdsIcon(userIcon);\r\n * export function MyComponent() {\r\n *    return <CdsIcon icon={userIcon} badge=\"warning\" solid size=\"lg\"></CdsIcon>;\r\n * }\r\n * ```\r\n *\r\n * @docsCategory react-components\r\n */\r\nexport function CdsIcon(props: { icon: IconShapeTuple; className?: string } & Partial<CdsIconProps>) {\r\n    const { icon, ...rest } = props;\r\n    useEffect(() => {\r\n        ClarityIcons.addIcons(icon);\r\n    }, [icon]);\r\n    return <cds-icon {...rest} shape={icon[0]}></cds-icon>;\r\n}\r\n","import React, { PropsWithChildren } from 'react';\r\n\r\n/**\r\n * @description\r\n * A wrapper around form fields which provides a label, tooltip and error message.\r\n *\r\n * @example\r\n * ```ts\r\n * import { FormField } from '@vendure/admin-ui/react';\r\n *\r\n * export function MyReactComponent() {\r\n *     return (\r\n *        <FormField label=\"My field\" tooltip=\"This is a tooltip\" invalid errorMessage=\"This field is invalid\">\r\n *            <input type=\"text\" />\r\n *        </FormField>\r\n *     );\r\n * }\r\n * ```\r\n *\r\n * @docsCategory react-components\r\n */\r\nexport function FormField(\r\n    props: PropsWithChildren<{\r\n        for?: string;\r\n        label?: string;\r\n        tooltip?: string;\r\n        invalid?: boolean;\r\n        errorMessage?: string;\r\n    }>,\r\n) {\r\n    return (\r\n        <div\r\n            className={`form-group ` + (!props.label ? 'no-label' : '') + (props.invalid ? 'clr-error' : '')}\r\n        >\r\n            {props.label && <label htmlFor={props.for ?? ''}>{props.label}</label>}\r\n            {props.tooltip && <div className=\"tooltip-text\">{props.tooltip}</div>}\r\n            <div className={`input-row ` + (props.invalid ? 'invalid' : '')}>{props.children}</div>\r\n            {props.errorMessage && <div className=\"error-message\">{props.errorMessage}</div>}\r\n        </div>\r\n    );\r\n}\r\n","import { ProviderToken } from '@angular/core';\r\nimport { useContext } from 'react';\r\nimport { HostedComponentContext } from '../directives/react-component-host.directive';\r\n\r\n/**\r\n * @description\r\n * Exposes the Angular injector which allows the injection of services into React components.\r\n *\r\n * @example\r\n * ```ts\r\n * import { useInjector } from '\\@vendure/admin-ui/react';\r\n * import { NotificationService } from '\\@vendure/admin-ui/core';\r\n *\r\n * export const MyComponent = () => {\r\n *     const notificationService = useInjector(NotificationService);\r\n *\r\n *     const handleClick = () => {\r\n *         notificationService.success('Hello world!');\r\n *     };\r\n *     // ...\r\n *     return <div>...</div>;\r\n * }\r\n * ```\r\n *\r\n * @docsCategory react-hooks\r\n */\r\nexport function useInjector<T = any>(token: ProviderToken<T>): T {\r\n    const context = useContext(HostedComponentContext);\r\n    const instance = context?.injector.get(token);\r\n    if (!instance) {\r\n        throw new Error(`Could not inject ${(token as any).name ?? token.toString()}`);\r\n    }\r\n    return instance;\r\n}\r\n","import { Router } from '@angular/router';\r\nimport React, { PropsWithChildren } from 'react';\r\nimport { useInjector } from '../react-hooks/use-injector';\r\n\r\n/**\r\n * @description\r\n * A React component which renders an anchor tag and navigates to the specified route when clicked.\r\n * This is useful when you want to use a React component in a Vendure UI plugin which navigates to\r\n * a route in the admin-ui.\r\n *\r\n * @example\r\n * ```ts\r\n * import { Link } from '@vendure/admin-ui/react';\r\n *\r\n * export const MyReactComponent = () => {\r\n *     return <Link href=\"/extensions/my-extension\">Go to my extension</Link>;\r\n * }\r\n * ```\r\n *\r\n * @docsCategory react-components\r\n */\r\nexport function Link(props: PropsWithChildren<{ href: string; [props: string]: any }>) {\r\n    const router = useInjector(Router);\r\n    const { href, ...rest } = props;\r\n\r\n    function onClick(e: React.MouseEvent<HTMLAnchorElement, MouseEvent>) {\r\n        e.preventDefault();\r\n        void router.navigateByUrl(href);\r\n    }\r\n\r\n    return (\r\n        <a href={href} onClick={onClick} {...rest}>\r\n            {props.children}\r\n        </a>\r\n    );\r\n}\r\n","import React, { PropsWithChildren } from 'react';\r\n\r\n/**\r\n * @description\r\n * A container for page content which provides a consistent width and spacing.\r\n *\r\n * @example\r\n * ```ts\r\n * import { PageBlock } from '@vendure/admin-ui/react';\r\n *\r\n * export function MyComponent() {\r\n *   return (\r\n *     <PageBlock>\r\n *       ...\r\n *     </PageBlock>\r\n *   );\r\n * }\r\n * ```\r\n *\r\n * @docsCategory react-components\r\n */\r\nexport function PageBlock(props: PropsWithChildren) {\r\n    return <div className=\"page-block\">{props.children}</div>;\r\n}\r\n","import React, { PropsWithChildren, ReactNode } from 'react';\r\n\r\n/**\r\n * @description\r\n * A responsive container for detail views with a main content area and an optional sidebar.\r\n *\r\n * @example\r\n * ```ts\r\n * import { PageDetailLayout } from '@vendure/admin-ui/react';\r\n *\r\n * export function MyComponent() {\r\n *   return (\r\n *     <PageDetailLayout sidebar={<div>Sidebar content</div>}>\r\n *       <div>Main content</div>\r\n *     </PageDetailLayout>\r\n *   );\r\n * }\r\n * ```\r\n *\r\n * @docsCategory react-components\r\n */\r\nexport function PageDetailLayout(props: PropsWithChildren<{ sidebar?: ReactNode }>) {\r\n    return (\r\n        <div className={'vdr-page-detail-layout'}>\r\n            <div className=\"main\">{props.children}</div>\r\n            <div className=\"sidebar\">{props.sidebar}</div>\r\n        </div>\r\n    );\r\n}\r\n","import { useContext, useEffect, useState } from 'react';\r\nimport { ReactCustomDetailComponentContext } from '../components/react-custom-detail.component';\r\nimport { HostedComponentContext } from '../directives/react-component-host.directive';\r\nimport { HostedReactComponentContext } from '../types';\r\n\r\n/**\r\n * @description\r\n * Provides the data available to React-based CustomDetailComponents.\r\n *\r\n * @example\r\n * ```ts\r\n * import { Card, useDetailComponentData } from '\\@vendure/admin-ui/react';\r\n * import React from 'react';\r\n *\r\n * export function CustomDetailComponent(props: any) {\r\n *     const { entity, detailForm } = useDetailComponentData();\r\n *     const updateName = () => {\r\n *         detailForm.get('name')?.setValue('New name');\r\n *         detailForm.markAsDirty();\r\n *     };\r\n *     return (\r\n *         <Card title={'Custom Detail Component'}>\r\n *             <button className=\"button\" onClick={updateName}>\r\n *                 Update name\r\n *             </button>\r\n *             <pre>{JSON.stringify(entity, null, 2)}</pre>\r\n *         </Card>\r\n *     );\r\n * }\r\n * ```\r\n *\r\n * @docsCategory react-hooks\r\n */\r\nexport function useDetailComponentData<T = any>() {\r\n    const context = useContext(\r\n        HostedComponentContext,\r\n    ) as HostedReactComponentContext<ReactCustomDetailComponentContext>;\r\n\r\n    if (!context.detailForm || !context.entity$) {\r\n        throw new Error(`The useDetailComponentData hook can only be used within a CustomDetailComponent`);\r\n    }\r\n\r\n    const [entity, setEntity] = useState<T | null>(null);\r\n\r\n    useEffect(() => {\r\n        const subscription = context.entity$.subscribe(value => {\r\n            setEntity(value);\r\n        });\r\n        return () => subscription.unsubscribe();\r\n    }, []);\r\n\r\n    return {\r\n        entity,\r\n        detailForm: context.detailForm,\r\n    };\r\n}\r\n","import { CustomFieldType } from '@vendure/common/lib/shared-types';\r\nimport { useContext, useEffect, useState } from 'react';\r\nimport { HostedComponentContext } from '../directives/react-component-host.directive';\r\nimport { HostedReactComponentContext, ReactFormInputOptions } from '../types';\r\n\r\n/**\r\n * @description\r\n * Provides access to the current FormControl value and a method to update the value.\r\n *\r\n * @example\r\n * ```ts\r\n * import { useFormControl, ReactFormInputProps } from '\\@vendure/admin-ui/react';\r\n * import React from 'react';\r\n *\r\n * export function ReactNumberInput({ readonly }: ReactFormInputProps) {\r\n *     const { value, setFormValue } = useFormControl();\r\n *\r\n *     const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\r\n *         setFormValue(val);\r\n *     };\r\n *     return (\r\n *         <div>\r\n *             <input readOnly={readonly} type=\"number\" onChange={handleChange} value={value} />\r\n *         </div>\r\n *     );\r\n * }\r\n * ```\r\n *\r\n * @docsCategory react-hooks\r\n */\r\nexport function useFormControl() {\r\n    const context = useContext(HostedComponentContext);\r\n    if (!context) {\r\n        throw new Error('No HostedComponentContext found');\r\n    }\r\n    if (!isFormInputContext(context)) {\r\n        throw new Error('useFormControl() can only be used in a form input component');\r\n    }\r\n    const { formControl, config } = context;\r\n    const [value, setValue] = useState(formControl.value ?? 0);\r\n\r\n    useEffect(() => {\r\n        const subscription = formControl.valueChanges.subscribe(v => {\r\n            setValue(v);\r\n        });\r\n        return () => {\r\n            subscription.unsubscribe();\r\n        };\r\n    }, []);\r\n\r\n    function setFormValue(newValue: any) {\r\n        formControl.setValue(coerceFormValue(newValue, config.type as CustomFieldType));\r\n        formControl.markAsDirty();\r\n    }\r\n\r\n    return { value, setFormValue };\r\n}\r\n\r\nfunction isFormInputContext(\r\n    context: HostedReactComponentContext,\r\n): context is HostedReactComponentContext<ReactFormInputOptions> {\r\n    return context.config && context.formControl;\r\n}\r\n\r\nfunction coerceFormValue(value: any, type: CustomFieldType) {\r\n    switch (type) {\r\n        case 'int':\r\n        case 'float':\r\n            return Number(value);\r\n        case 'boolean':\r\n            return Boolean(value);\r\n        default:\r\n            return value;\r\n    }\r\n}\r\n","import { BreadcrumbValue } from '@vendure/admin-ui/core';\r\nimport { useContext } from 'react';\r\nimport { HostedComponentContext } from '../directives/react-component-host.directive';\r\nimport { HostedReactComponentContext, ReactRouteComponentOptions } from '../types';\r\n\r\n/**\r\n * @description\r\n * Provides functions for setting the current page title and breadcrumb.\r\n *\r\n * @example\r\n * ```ts\r\n * import { usePageMetadata } from '\\@vendure/admin-ui/react';\r\n * import { useEffect } from 'react';\r\n *\r\n * export const MyComponent = () => {\r\n *     const { setTitle, setBreadcrumb } = usePageMetadata();\r\n *     useEffect(() => {\r\n *         setTitle('My Page');\r\n *         setBreadcrumb([\r\n *             { link: ['./parent'], label: 'Parent Page' },\r\n *             { link: ['./'], label: 'This Page' },\r\n *         ]);\r\n *     }, []);\r\n *     // ...\r\n *     return <div>...</div>;\r\n * }\r\n * ```\r\n *\r\n * @docsCategory react-hooks\r\n */\r\nexport function usePageMetadata() {\r\n    const context = useContext(\r\n        HostedComponentContext,\r\n    ) as HostedReactComponentContext<ReactRouteComponentOptions>;\r\n    const setBreadcrumb = (newValue: BreadcrumbValue) => {\r\n        context.pageMetadataService?.setBreadcrumbs(newValue);\r\n    };\r\n    const setTitle = (newTitle: string) => {\r\n        context.pageMetadataService?.setTitle(newTitle);\r\n    };\r\n\r\n    return {\r\n        setBreadcrumb,\r\n        setTitle,\r\n    };\r\n}\r\n","import { TypedDocumentNode } from '@graphql-typed-document-node/core';\r\nimport { DataService } from '@vendure/admin-ui/core';\r\nimport { DocumentNode } from 'graphql/index';\r\nimport { useCallback, useContext, useEffect, useState } from 'react';\r\nimport { firstValueFrom, Observable } from 'rxjs';\r\nimport { tap } from 'rxjs/operators';\r\nimport { HostedComponentContext } from '../directives/react-component-host.directive';\r\n\r\n/**\r\n * @description\r\n * A React hook which provides access to the results of a GraphQL query.\r\n *\r\n * @example\r\n * ```ts\r\n * import { useQuery } from '\\@vendure/admin-ui/react';\r\n * import { gql } from 'graphql-tag';\r\n *\r\n * const GET_PRODUCT = gql`\r\n *    query GetProduct($id: ID!) {\r\n *      product(id: $id) {\r\n *        id\r\n *        name\r\n *        description\r\n *      }\r\n *    }`;\r\n *\r\n * export const MyComponent = () => {\r\n *     const { data, loading, error } = useQuery(GET_PRODUCT, { id: '1' });\r\n *\r\n *     if (loading) return <div>Loading...</div>;\r\n *     if (error) return <div>Error! { error }</div>;\r\n *     return (\r\n *         <div>\r\n *             <h1>{data.product.name}</h1>\r\n *             <p>{data.product.description}</p>\r\n *         </div>\r\n *     );\r\n * };\r\n * ```\r\n *\r\n * @docsCategory react-hooks\r\n */\r\nexport function useQuery<T, V extends Record<string, any> = Record<string, any>>(\r\n    query: DocumentNode | TypedDocumentNode<T, V>,\r\n    variables?: V,\r\n) {\r\n    const { data, loading, error, runQuery } = useDataService<T, V>(\r\n        (dataService, vars) => dataService.query(query, vars).stream$,\r\n    );\r\n    useEffect(() => {\r\n        const subscription = runQuery(variables).subscribe();\r\n        return () => subscription.unsubscribe();\r\n    }, [runQuery]);\r\n\r\n    const refetch = (variables?: V) => firstValueFrom(runQuery(variables));\r\n    return { data, loading, error, refetch } as const;\r\n}\r\n\r\n/**\r\n * @description\r\n * A React hook which allows you to execute a GraphQL mutation.\r\n *\r\n * @example\r\n * ```ts\r\n * import { useMutation } from '\\@vendure/admin-ui/react';\r\n * import { gql } from 'graphql-tag';\r\n *\r\n * const UPDATE_PRODUCT = gql`\r\n *   mutation UpdateProduct($input: UpdateProductInput!) {\r\n *     updateProduct(input: $input) {\r\n *     id\r\n *     name\r\n *   }\r\n * }`;\r\n *\r\n * export const MyComponent = () => {\r\n *     const [updateProduct, { data, loading, error }] = useMutation(UPDATE_PRODUCT);\r\n *\r\n *     const handleClick = () => {\r\n *         updateProduct({\r\n *             input: {\r\n *                 id: '1',\r\n *                 name: 'New name',\r\n *             },\r\n *         }).then(result => {\r\n *             // do something with the result\r\n *         });\r\n *     };\r\n *\r\n *     if (loading) return <div>Loading...</div>;\r\n *     if (error) return <div>Error! { error }</div>;\r\n *\r\n *     return (\r\n *     <div>\r\n *         <button onClick={handleClick}>Update product</button>\r\n *         {data && <div>Product updated!</div>}\r\n *     </div>\r\n *     );\r\n * };\r\n * ```\r\n *\r\n * @docsCategory react-hooks\r\n */\r\nexport function useMutation<T, V extends Record<string, any> = Record<string, any>>(\r\n    mutation: DocumentNode | TypedDocumentNode<T, V>,\r\n) {\r\n    const { data, loading, error, runQuery } = useDataService<T, V>((dataService, variables) =>\r\n        dataService.mutate(mutation, variables),\r\n    );\r\n    const rest = { data, loading, error };\r\n    const execute = (variables?: V) => firstValueFrom(runQuery(variables));\r\n    return [execute, rest] as [typeof execute, typeof rest];\r\n}\r\n\r\nfunction useDataService<T, V extends Record<string, any> = Record<string, any>>(\r\n    operation: (dataService: DataService, variables?: V) => Observable<T>,\r\n) {\r\n    const context = useContext(HostedComponentContext);\r\n    const dataService = context?.injector.get(DataService);\r\n    if (!dataService) {\r\n        throw new Error('No DataService found in HostedComponentContext');\r\n    }\r\n\r\n    const [data, setData] = useState<T>();\r\n    const [error, setError] = useState<string>();\r\n    const [loading, setLoading] = useState(false);\r\n\r\n    const runQuery = useCallback((variables?: V) => {\r\n        setLoading(true);\r\n        return operation(dataService, variables).pipe(\r\n            tap({\r\n                next: res => {\r\n                    setData(res);\r\n                    setLoading(false);\r\n                },\r\n                error: err => {\r\n                    setError(err.message);\r\n                    setLoading(false);\r\n                },\r\n            }),\r\n        );\r\n    }, []);\r\n\r\n    return { data, loading, error, runQuery };\r\n}\r\n","import { ActivatedRoute } from '@angular/router';\r\nimport { useEffect, useState } from 'react';\r\nimport { useInjector } from './use-injector';\r\n\r\n/**\r\n * @description\r\n * Provides access to the current route params and query params.\r\n *\r\n * @example\r\n * ```ts\r\n * import { useRouteParams } from '\\@vendure/admin-ui/react';\r\n * import React from 'react';\r\n *\r\n * export function MyComponent() {\r\n *     const { params, queryParams } = useRouteParams();\r\n *     // ...\r\n *     return <div>{ params.id }</div>;\r\n * }\r\n * ```\r\n *\r\n * @docsCategory react-hooks\r\n */\r\nexport function useRouteParams() {\r\n    const activatedRoute = useInjector(ActivatedRoute);\r\n    const [params, setParams] = useState(activatedRoute.snapshot.params);\r\n    const [queryParams, setQueryParams] = useState(activatedRoute.snapshot.queryParams);\r\n\r\n    useEffect(() => {\r\n        const subscription = activatedRoute.params.subscribe(value => {\r\n            setParams(value);\r\n        });\r\n        subscription.add(activatedRoute.queryParams.subscribe(value => setQueryParams(value)));\r\n        return () => subscription.unsubscribe();\r\n    }, []);\r\n\r\n    activatedRoute;\r\n\r\n    return {\r\n        params,\r\n        queryParams,\r\n    };\r\n}\r\n","import { APP_INITIALIZER } from '@angular/core';\r\nimport { CustomDetailComponentLocationId, CustomDetailComponentService } from '@vendure/admin-ui/core';\r\nimport { ElementType } from 'react';\r\nimport {\r\n    REACT_CUSTOM_DETAIL_COMPONENT_OPTIONS,\r\n    ReactCustomDetailComponent,\r\n} from './components/react-custom-detail.component';\r\n\r\n/**\r\n * @description\r\n * Configures a React-based component to be placed in a detail page in the given location.\r\n *\r\n * @docsCategory react-extensions\r\n */\r\nexport interface ReactCustomDetailComponentConfig {\r\n    /**\r\n     * @description\r\n     * The id of the detail page location in which to place the component.\r\n     */\r\n    locationId: CustomDetailComponentLocationId;\r\n    /**\r\n     * @description\r\n     * The React component to render.\r\n     */\r\n    component: ElementType;\r\n    /**\r\n     * @description\r\n     * Optional props to pass to the React component.\r\n     */\r\n    props?: Record<string, any>;\r\n}\r\n\r\n/**\r\n * @description\r\n * Registers a React component to be rendered in a detail page in the given location.\r\n * Components used as custom detail components can make use of the {@link useDetailComponentData} hook.\r\n *\r\n * @docsCategory react-extensions\r\n */\r\nexport function registerReactCustomDetailComponent(config: ReactCustomDetailComponentConfig) {\r\n    return {\r\n        provide: APP_INITIALIZER,\r\n        multi: true,\r\n        useFactory: (customDetailComponentService: CustomDetailComponentService) => () => {\r\n            customDetailComponentService.registerCustomDetailComponent({\r\n                component: ReactCustomDetailComponent,\r\n                locationId: config.locationId,\r\n                providers: [\r\n                    {\r\n                        provide: REACT_CUSTOM_DETAIL_COMPONENT_OPTIONS,\r\n                        useValue: {\r\n                            component: config.component,\r\n                            props: config.props,\r\n                        },\r\n                    },\r\n                ],\r\n            });\r\n        },\r\n        deps: [CustomDetailComponentService],\r\n    };\r\n}\r\n","import { APP_INITIALIZER } from '@angular/core';\r\nimport {\r\n    DataTableColumnId,\r\n    DataTableCustomComponentService,\r\n    DataTableLocationId,\r\n} from '@vendure/admin-ui/core';\r\nimport { ElementType } from 'react';\r\nimport {\r\n    REACT_CUSTOM_COLUMN_COMPONENT_OPTIONS,\r\n    ReactCustomColumnComponent,\r\n} from './components/react-custom-column.component';\r\n\r\n/**\r\n * @description\r\n * Configures a {@link CustomDetailComponent} to be placed in the given location.\r\n *\r\n * @docsCategory react-extensions\r\n */\r\nexport interface ReactDataTableComponentConfig {\r\n    /**\r\n     * @description\r\n     * The location in the UI where the custom component should be placed.\r\n     */\r\n    tableId: DataTableLocationId;\r\n    /**\r\n     * @description\r\n     * The column in the table where the custom component should be placed.\r\n     */\r\n    columnId: DataTableColumnId;\r\n    /**\r\n     * @description\r\n     * The component to render in the table cell. This component will receive the `rowItem` prop\r\n     * which is the data object for the row, e.g. the `Product` object if used in the `product-list` table.\r\n     */\r\n    component: ElementType;\r\n    /**\r\n     * @description\r\n     * Optional props to pass to the React component.\r\n     */\r\n    props?: Record<string, any>;\r\n}\r\n\r\n/**\r\n * @description\r\n * The props that will be passed to the React component registered via {@link registerReactDataTableComponent}.\r\n */\r\nexport interface ReactDataTableComponentProps {\r\n    rowItem: any;\r\n    [prop: string]: any;\r\n}\r\n\r\n/**\r\n * @description\r\n * Registers a React component to be rendered in a data table in the given location.\r\n * The component will receive the `rowItem` prop which is the data object for the row,\r\n * e.g. the `Product` object if used in the `product-list` table.\r\n *\r\n * @example\r\n * ```ts title=\"components/SlugWithLink.tsx\"\r\n * import { ReactDataTableComponentProps } from '\\@vendure/admin-ui/react';\r\n * import React from 'react';\r\n *\r\n * export function SlugWithLink({ rowItem }: ReactDataTableComponentProps) {\r\n *     return (\r\n *         <a href={`https://example.com/products/${rowItem.slug}`} target=\"_blank\">\r\n *             {rowItem.slug}\r\n *         </a>\r\n *     );\r\n * }\r\n * ```\r\n *\r\n * ```ts title=\"providers.ts\"\r\n * import { registerReactDataTableComponent } from '\\@vendure/admin-ui/react';\r\n * import { SlugWithLink } from './components/SlugWithLink';\r\n *\r\n * export default [\r\n *     registerReactDataTableComponent({\r\n *         component: SlugWithLink,\r\n *         tableId: 'product-list',\r\n *         columnId: 'slug',\r\n *         props: {\r\n *         foo: 'bar',\r\n *         },\r\n *     }),\r\n * ];\r\n * ```\r\n *\r\n * @docsCategory react-extensions\r\n */\r\nexport function registerReactDataTableComponent(config: ReactDataTableComponentConfig) {\r\n    return {\r\n        provide: APP_INITIALIZER,\r\n        multi: true,\r\n        useFactory: (dataTableCustomComponentService: DataTableCustomComponentService) => () => {\r\n            dataTableCustomComponentService.registerCustomComponent({\r\n                ...config,\r\n                component: ReactCustomColumnComponent,\r\n                providers: [\r\n                    {\r\n                        provide: REACT_CUSTOM_COLUMN_COMPONENT_OPTIONS,\r\n                        useValue: {\r\n                            component: config.component,\r\n                            props: config.props,\r\n                        },\r\n                    },\r\n                ],\r\n            });\r\n        },\r\n        deps: [DataTableCustomComponentService],\r\n    };\r\n}\r\n","import { APP_INITIALIZER, FactoryProvider } from '@angular/core';\r\nimport { ComponentRegistryService } from '@vendure/admin-ui/core';\r\nimport { ElementType } from 'react';\r\nimport {\r\n    REACT_INPUT_COMPONENT_OPTIONS,\r\n    ReactFormInputComponent,\r\n} from './components/react-form-input.component';\r\n\r\n/**\r\n * @description\r\n * Registers a React component to be used as a {@link FormInputComponent}.\r\n *\r\n * @docsCategory react-extensions\r\n */\r\nexport function registerReactFormInputComponent(id: string, component: ElementType): FactoryProvider {\r\n    return {\r\n        provide: APP_INITIALIZER,\r\n        multi: true,\r\n        useFactory: (registry: ComponentRegistryService) => () => {\r\n            registry.registerInputComponent(id, ReactFormInputComponent, [\r\n                {\r\n                    provide: REACT_INPUT_COMPONENT_OPTIONS,\r\n                    useValue: {\r\n                        component,\r\n                    },\r\n                },\r\n            ]);\r\n        },\r\n        deps: [ComponentRegistryService],\r\n    };\r\n}\r\n","import { Route } from '@angular/router';\r\nimport { ResultOf, TypedDocumentNode } from '@graphql-typed-document-node/core';\r\nimport { registerRouteComponent, RegisterRouteComponentOptions } from '@vendure/admin-ui/core';\r\nimport { DocumentNode } from 'graphql/index';\r\nimport { ElementType } from 'react';\r\nimport { REACT_ROUTE_COMPONENT_OPTIONS, ReactRouteComponent } from './components/react-route.component';\r\nimport { ReactRouteComponentOptions } from './types';\r\n\r\n/**\r\n * @description\r\n * Configuration for a React-based route component.\r\n *\r\n * @docsCategory react-extensions\r\n */\r\ntype RegisterReactRouteComponentOptions<\r\n    Entity extends { id: string; updatedAt?: string },\r\n    T extends DocumentNode | TypedDocumentNode<any, { id: string }>,\r\n    Field extends keyof ResultOf<T>,\r\n    R extends Field,\r\n> = RegisterRouteComponentOptions<ElementType, Entity, T, Field, R> & {\r\n    props?: Record<string, any>;\r\n};\r\n\r\n/**\r\n * @description\r\n * Registers a React component to be used as a route component.\r\n *\r\n * @docsCategory react-extensions\r\n */\r\nexport function registerReactRouteComponent<\r\n    Entity extends { id: string; updatedAt?: string },\r\n    T extends DocumentNode | TypedDocumentNode<any, { id: string }>,\r\n    Field extends keyof ResultOf<T>,\r\n    R extends Field,\r\n>(options: RegisterReactRouteComponentOptions<Entity, T, Field, R>): Route {\r\n    const routeDef = registerRouteComponent(options);\r\n    return {\r\n        ...routeDef,\r\n        providers: [\r\n            {\r\n                provide: REACT_ROUTE_COMPONENT_OPTIONS,\r\n                useValue: {\r\n                    props: options.props,\r\n                } satisfies ReactRouteComponentOptions,\r\n            },\r\n            ...(routeDef.providers ?? []),\r\n        ],\r\n        component: ReactRouteComponent,\r\n    };\r\n}\r\n","// This file was generated by the build-public-api.ts script\nexport * from './components/react-custom-column.component';\nexport * from './components/react-custom-detail.component';\nexport * from './components/react-form-input.component';\nexport * from './components/react-route.component';\nexport * from './directives/react-component-host.directive';\nexport * from './react-components/ActionBar';\nexport * from './react-components/Card';\nexport * from './react-components/CdsIcon';\nexport * from './react-components/FormField';\nexport * from './react-components/Link';\nexport * from './react-components/PageBlock';\nexport * from './react-components/PageDetailLayout';\nexport * from './react-hooks/use-detail-component-data';\nexport * from './react-hooks/use-form-control';\nexport * from './react-hooks/use-injector';\nexport * from './react-hooks/use-page-metadata';\nexport * from './react-hooks/use-query';\nexport * from './react-hooks/use-route-params';\nexport * from './register-react-custom-detail-component';\nexport * from './register-react-data-table-component';\nexport * from './register-react-form-input-component';\nexport * from './register-react-route-component';\nexport * from './types';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":";;;;;;;;;;;MAMa,sBAAsB,GAAG,aAAa,CAAqC,IAAI,EAAE;AAE9F;;AAEG;MAKU,2BAA2B,CAAA;AAOpC,IAAA,WAAA,CACY,IAAgB,EAChB,QAAkB,EACN,mBAAyC,EAAA;QAFrD,IAAI,CAAA,IAAA,GAAJ,IAAI,CAAY;QAChB,IAAQ,CAAA,QAAA,GAAR,QAAQ,CAAU;QACN,IAAmB,CAAA,mBAAA,GAAnB,mBAAmB,CAAsB;QAPxD,IAAO,CAAA,OAAA,GAAwB,EAAE,CAAC;QAEnC,IAAI,CAAA,IAAA,GAAgB,IAAI,CAAC;KAM7B;AAEJ,IAAA,MAAM,WAAW,GAAA;AACb,QAAA,MAAM,IAAI,GAAG,IAAI,CAAC,cAAc,CAAC;AAEjC,QAAA,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE;YACZ,IAAI,CAAC,IAAI,GAAG,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;AACnD,SAAA;QAED,IAAI,CAAC,IAAI,CAAC,MAAM,CACZ,aAAa,CACT,sBAAsB,CAAC,QAAQ,EAC/B;AACI,YAAA,KAAK,EAAE;gBACH,GAAG,IAAI,CAAC,KAAK;gBACb,GAAG,IAAI,CAAC,OAAO;gBACf,QAAQ,EAAE,IAAI,CAAC,QAAQ;gBACvB,mBAAmB,EAAE,IAAI,CAAC,mBAAmB;AAChD,aAAA;SACJ,EACD,aAAa,CAAC,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,CAClC,CACJ,CAAC;KACL;IAED,WAAW,GAAA;AACP,QAAA,IAAI,CAAC,IAAI,EAAE,OAAO,EAAE,CAAC;KACxB;8GAtCQ,2BAA2B,EAAA,IAAA,EAAA,CAAA,EAAA,KAAA,EAAA,EAAA,CAAA,UAAA,EAAA,EAAA,EAAA,KAAA,EAAA,EAAA,CAAA,QAAA,EAAA,EAAA,EAAA,KAAA,EAAA,EAAA,CAAA,mBAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;kGAA3B,2BAA2B,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,yBAAA,EAAA,MAAA,EAAA,EAAA,cAAA,EAAA,CAAA,uBAAA,EAAA,gBAAA,CAAA,EAAA,KAAA,EAAA,OAAA,EAAA,OAAA,EAAA,SAAA,EAAA,EAAA,aAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA,CAAA,EAAA;;2FAA3B,2BAA2B,EAAA,UAAA,EAAA,CAAA;kBAJvC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACP,oBAAA,QAAQ,EAAE,yBAAyB;AACnC,oBAAA,UAAU,EAAE,IAAI;AACnB,iBAAA,CAAA;;0BAWQ,QAAQ;4CATmB,cAAc,EAAA,CAAA;sBAA7C,KAAK;uBAAC,uBAAuB,CAAA;gBACrB,KAAK,EAAA,CAAA;sBAAb,KAAK;gBACG,OAAO,EAAA,CAAA;sBAAf,KAAK;;;MCbG,qCAAqC,GAAG,IAAI,cAAc,CAGpE,uCAAuC,EAAE;MAU/B,0BAA0B,CAAA;AARvC,IAAA,WAAA,GAAA;AAWc,QAAA,IAAA,CAAA,cAAc,GAAG,MAAM,CAAC,qCAAqC,CAAC,CAAC,SAAS,CAAC;AAC3E,QAAA,IAAA,CAAA,OAAO,GAAG,MAAM,CAAC,qCAAqC,CAAC,CAAC;AASnE,KAAA;IANG,QAAQ,GAAA;QACJ,IAAI,CAAC,KAAK,GAAG;YACT,OAAO,EAAE,IAAI,CAAC,OAAO;YACrB,IAAI,IAAI,CAAC,OAAO,CAAC,KAAK,IAAI,EAAE,CAAC;SAChC,CAAC;KACL;8GAZQ,0BAA0B,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;kGAA1B,0BAA0B,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,mCAAA,EAAA,MAAA,EAAA,EAAA,OAAA,EAAA,SAAA,EAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EANzB,CAAwE,sEAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,45EAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAIxE,2BAA2B,EAAA,QAAA,EAAA,yBAAA,EAAA,MAAA,EAAA,CAAA,uBAAA,EAAA,OAAA,EAAA,SAAA,CAAA,EAAA,CAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA,EAAA;;2FAE5B,0BAA0B,EAAA,UAAA,EAAA,CAAA;kBARtC,SAAS;+BACI,mCAAmC,EAAA,QAAA,EACnC,CAAwE,sEAAA,CAAA,EAAA,aAAA,EAEnE,iBAAiB,CAAC,IAAI,EAAA,UAAA,EACzB,IAAI,EAAA,OAAA,EACP,CAAC,2BAA2B,CAAC,EAAA,MAAA,EAAA,CAAA,45EAAA,CAAA,EAAA,CAAA;8BAG7B,OAAO,EAAA,CAAA;sBAAf,KAAK;;;MCZG,qCAAqC,GAAG,IAAI,cAAc,CAGpE,uCAAuC,EAAE;MAe/B,0BAA0B,CAAA;AARvC,IAAA,WAAA,GAAA;QAWc,IAAK,CAAA,KAAA,GAAG,MAAM,CAAC,qCAAqC,CAAC,CAAC,KAAK,IAAI,EAAE,CAAC;AAClE,QAAA,IAAA,CAAA,cAAc,GAAG,MAAM,CAAC,qCAAqC,CAAC,CAAC,SAAS,CAAC;AAStF,KAAA;IANG,QAAQ,GAAA;QACJ,IAAI,CAAC,OAAO,GAAG;YACX,UAAU,EAAE,IAAI,CAAC,UAAU;YAC3B,OAAO,EAAE,IAAI,CAAC,OAAO;SACxB,CAAC;KACL;8GAZQ,0BAA0B,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;kGAA1B,0BAA0B,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,mCAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EANzB,CAA4F,0FAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,45EAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAI5F,2BAA2B,EAAA,QAAA,EAAA,yBAAA,EAAA,MAAA,EAAA,CAAA,uBAAA,EAAA,OAAA,EAAA,SAAA,CAAA,EAAA,CAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA,EAAA;;2FAE5B,0BAA0B,EAAA,UAAA,EAAA,CAAA;kBARtC,SAAS;+BACI,mCAAmC,EAAA,QAAA,EACnC,CAA4F,0FAAA,CAAA,EAAA,aAAA,EAEvF,iBAAiB,CAAC,IAAI,EAAA,UAAA,EACzB,IAAI,EAAA,OAAA,EACP,CAAC,2BAA2B,CAAC,EAAA,MAAA,EAAA,CAAA,45EAAA,CAAA,EAAA,CAAA;;;MChB7B,6BAA6B,GAAG,IAAI,cAAc,CAE5D,+BAA+B,EAAE;MAUvB,uBAAuB,CAAA;AARpC,IAAA,WAAA,GAAA;AAgBc,QAAA,IAAA,CAAA,cAAc,GAAG,MAAM,CAAC,6BAA6B,CAAC,CAAC,SAAS,CAAC;AAS9E,KAAA;aAhBmB,IAAE,CAAA,EAAA,GAAW,4BAA4B,CAAC,EAAA;IAS1D,QAAQ,GAAA;QACJ,IAAI,CAAC,OAAO,GAAG;YACX,WAAW,EAAE,IAAI,CAAC,WAAW;YAC7B,QAAQ,EAAE,IAAI,CAAC,QAAQ;YACvB,MAAM,EAAE,IAAI,CAAC,MAAM;SACtB,CAAC;KACL;8GAhBQ,uBAAuB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;kGAAvB,uBAAuB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,gCAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EANtB,CAA8F,4FAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,45EAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAI9F,2BAA2B,EAAA,QAAA,EAAA,yBAAA,EAAA,MAAA,EAAA,CAAA,uBAAA,EAAA,OAAA,EAAA,SAAA,CAAA,EAAA,CAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA,EAAA;;2FAE5B,uBAAuB,EAAA,UAAA,EAAA,CAAA;kBARnC,SAAS;+BACI,gCAAgC,EAAA,QAAA,EAChC,CAA8F,4FAAA,CAAA,EAAA,aAAA,EAEzF,iBAAiB,CAAC,IAAI,EAAA,UAAA,EACzB,IAAI,EAAA,OAAA,EACP,CAAC,2BAA2B,CAAC,EAAA,MAAA,EAAA,CAAA,45EAAA,CAAA,EAAA,CAAA;;;MCZ7B,6BAA6B,GAAG,IAAI,cAAc,CAC3D,+BAA+B,EACjC;MAcW,mBAAmB,CAAA;AAZhC,IAAA,WAAA,GAAA;AAac,QAAA,IAAA,CAAA,KAAK,GAAG,MAAM,CAAC,6BAA6B,CAAC,CAAC,KAAK,CAAC;AACpD,QAAA,IAAA,CAAA,cAAc,GAAG,MAAM,CAAC,uBAAuB,CAAC,CAAC,SAAS,CAAC;AACxE,KAAA;8GAHY,mBAAmB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA,EAAA;AAAnB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,mBAAmB,EAVlB,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,2BAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAAA,CAAA;;;;AAIT,IAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,45EAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAIS,2BAA2B,EAAA,QAAA,EAAA,yBAAA,EAAA,MAAA,EAAA,CAAA,uBAAA,EAAA,OAAA,EAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAE,cAAc,EAAA,QAAA,EAAA,qBAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAE,YAAY,EAAA,CAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA,EAAA;;2FAE1D,mBAAmB,EAAA,UAAA,EAAA,CAAA;kBAZ/B,SAAS;AACI,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,2BAA2B,EAC3B,QAAA,EAAA,CAAA;;;;AAIT,IAAA,CAAA,EAAA,aAAA,EAEc,iBAAiB,CAAC,IAAI,EAAA,UAAA,EACzB,IAAI,EAAA,OAAA,EACP,CAAC,2BAA2B,EAAE,cAAc,EAAE,YAAY,CAAC,EAAA,MAAA,EAAA,CAAA,45EAAA,CAAA,EAAA,CAAA;;;ACjBxE;;;;;;;;;;;;;;;;;;AAkBG;AACG,SAAU,SAAS,CAAC,KAAqD,EAAA;AAC3E,IAAA,QACI,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,gBAAgB,EAAA;AAC5B,QAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,cAAc,IAAE,KAAK,CAAC,WAAW,CAAO;QACvD,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAC,eAAe,EAAE,EAAA,KAAK,CAAC,QAAQ,CAAO,CACnD,EACR;AACN;;AC1BA;;;;;;;;;;;;;;;;;;AAkBG;AACG,SAAU,IAAI,CAAC,KAAgE,EAAA;AACjF,IAAA,QACI,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,UAAU,EAAA;AACtB,QAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,CAAA,eAAA,EAAkB,KAAK,CAAC,QAAQ,KAAK,KAAK,GAAG,WAAW,GAAG,EAAE,CAAE,CAAA,EAAA;AAC1E,YAAA,KAAK,CAAC,KAAK,KACR,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,WAAW,EAAA;gBACvB,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAC,OAAO,EAAA,EAAE,KAAK,CAAC,KAAK,CAAO,CACxC,CACT;YACD,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAC,UAAU,EAAE,EAAA,KAAK,CAAC,QAAQ,CAAO,CAC9C,CACJ,EACR;AACN;;ACTM,SAAU,eAAe,CAAC,IAAoB,EAAA;AAChD,IAAA,YAAY,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;AAChC,CAAC;AAED;;;;;;;;;;;;;;;;AAgBG;AACG,SAAU,OAAO,CAAC,KAA2E,EAAA;IAC/F,MAAM,EAAE,IAAI,EAAE,GAAG,IAAI,EAAE,GAAG,KAAK,CAAC;IAChC,SAAS,CAAC,MAAK;AACX,QAAA,YAAY,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;AAChC,KAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;IACX,OAAO,KAAA,CAAA,aAAA,CAAA,UAAA,EAAA,EAAA,GAAc,IAAI,EAAE,KAAK,EAAE,IAAI,CAAC,CAAC,CAAC,EAAA,CAAa,CAAC;AAC3D;;AClDA;;;;;;;;;;;;;;;;;;AAkBG;AACG,SAAU,SAAS,CACrB,KAME,EAAA;AAEF,IAAA,QACI,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EACI,SAAS,EAAE,aAAa,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,UAAU,GAAG,EAAE,CAAC,IAAI,KAAK,CAAC,OAAO,GAAG,WAAW,GAAG,EAAE,CAAC,EAAA;AAE/F,QAAA,KAAK,CAAC,KAAK,IAAI,KAAA,CAAA,aAAA,CAAA,OAAA,EAAA,EAAO,OAAO,EAAE,KAAK,CAAC,GAAG,IAAI,EAAE,EAAA,EAAG,KAAK,CAAC,KAAK,CAAS;QACrE,KAAK,CAAC,OAAO,IAAI,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAC,cAAc,EAAE,EAAA,KAAK,CAAC,OAAO,CAAO;QACrE,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,CAAY,UAAA,CAAA,IAAI,KAAK,CAAC,OAAO,GAAG,SAAS,GAAG,EAAE,CAAC,EAAG,EAAA,KAAK,CAAC,QAAQ,CAAO;AACtF,QAAA,KAAK,CAAC,YAAY,IAAI,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,eAAe,EAAE,EAAA,KAAK,CAAC,YAAY,CAAO,CAC9E,EACR;AACN;;ACpCA;;;;;;;;;;;;;;;;;;;;;AAqBG;AACG,SAAU,WAAW,CAAU,KAAuB,EAAA;AACxD,IAAA,MAAM,OAAO,GAAG,UAAU,CAAC,sBAAsB,CAAC,CAAC;IACnD,MAAM,QAAQ,GAAG,OAAO,EAAE,QAAQ,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC;IAC9C,IAAI,CAAC,QAAQ,EAAE;AACX,QAAA,MAAM,IAAI,KAAK,CAAC,CAAA,iBAAA,EAAqB,KAAa,CAAC,IAAI,IAAI,KAAK,CAAC,QAAQ,EAAE,CAAA,CAAE,CAAC,CAAC;AAClF,KAAA;AACD,IAAA,OAAO,QAAQ,CAAC;AACpB;;AC7BA;;;;;;;;;;;;;;;;AAgBG;AACG,SAAU,IAAI,CAAC,KAAgE,EAAA;AACjF,IAAA,MAAM,MAAM,GAAG,WAAW,CAAC,MAAM,CAAC,CAAC;IACnC,MAAM,EAAE,IAAI,EAAE,GAAG,IAAI,EAAE,GAAG,KAAK,CAAC;IAEhC,SAAS,OAAO,CAAC,CAAkD,EAAA;QAC/D,CAAC,CAAC,cAAc,EAAE,CAAC;AACnB,QAAA,KAAK,MAAM,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC;KACnC;AAED,IAAA,QACI,KAAG,CAAA,aAAA,CAAA,GAAA,EAAA,EAAA,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAA,GAAM,IAAI,EACpC,EAAA,KAAK,CAAC,QAAQ,CACf,EACN;AACN;;ACjCA;;;;;;;;;;;;;;;;;;AAkBG;AACG,SAAU,SAAS,CAAC,KAAwB,EAAA;IAC9C,OAAO,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,YAAY,IAAE,KAAK,CAAC,QAAQ,CAAO,CAAC;AAC9D;;ACrBA;;;;;;;;;;;;;;;;;;AAkBG;AACG,SAAU,gBAAgB,CAAC,KAAiD,EAAA;AAC9E,IAAA,QACI,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,wBAAwB,EAAA;AACpC,QAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,MAAM,IAAE,KAAK,CAAC,QAAQ,CAAO;QAC5C,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAC,SAAS,EAAE,EAAA,KAAK,CAAC,OAAO,CAAO,CAC5C,EACR;AACN;;ACvBA;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2BG;SACa,sBAAsB,GAAA;AAClC,IAAA,MAAM,OAAO,GAAG,UAAU,CACtB,sBAAsB,CACyC,CAAC;IAEpE,IAAI,CAAC,OAAO,CAAC,UAAU,IAAI,CAAC,OAAO,CAAC,OAAO,EAAE;AACzC,QAAA,MAAM,IAAI,KAAK,CAAC,CAAA,+EAAA,CAAiF,CAAC,CAAC;AACtG,KAAA;IAED,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAW,IAAI,CAAC,CAAC;IAErD,SAAS,CAAC,MAAK;QACX,MAAM,YAAY,GAAG,OAAO,CAAC,OAAO,CAAC,SAAS,CAAC,KAAK,IAAG;YACnD,SAAS,CAAC,KAAK,CAAC,CAAC;AACrB,SAAC,CAAC,CAAC;AACH,QAAA,OAAO,MAAM,YAAY,CAAC,WAAW,EAAE,CAAC;KAC3C,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO;QACH,MAAM;QACN,UAAU,EAAE,OAAO,CAAC,UAAU;KACjC,CAAC;AACN;;AClDA;;;;;;;;;;;;;;;;;;;;;;;;AAwBG;SACa,cAAc,GAAA;AAC1B,IAAA,MAAM,OAAO,GAAG,UAAU,CAAC,sBAAsB,CAAC,CAAC;IACnD,IAAI,CAAC,OAAO,EAAE;AACV,QAAA,MAAM,IAAI,KAAK,CAAC,iCAAiC,CAAC,CAAC;AACtD,KAAA;AACD,IAAA,IAAI,CAAC,kBAAkB,CAAC,OAAO,CAAC,EAAE;AAC9B,QAAA,MAAM,IAAI,KAAK,CAAC,6DAA6D,CAAC,CAAC;AAClF,KAAA;AACD,IAAA,MAAM,EAAE,WAAW,EAAE,MAAM,EAAE,GAAG,OAAO,CAAC;AACxC,IAAA,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC,CAAC,CAAC;IAE3D,SAAS,CAAC,MAAK;QACX,MAAM,YAAY,GAAG,WAAW,CAAC,YAAY,CAAC,SAAS,CAAC,CAAC,IAAG;YACxD,QAAQ,CAAC,CAAC,CAAC,CAAC;AAChB,SAAC,CAAC,CAAC;AACH,QAAA,OAAO,MAAK;YACR,YAAY,CAAC,WAAW,EAAE,CAAC;AAC/B,SAAC,CAAC;KACL,EAAE,EAAE,CAAC,CAAC;IAEP,SAAS,YAAY,CAAC,QAAa,EAAA;AAC/B,QAAA,WAAW,CAAC,QAAQ,CAAC,eAAe,CAAC,QAAQ,EAAE,MAAM,CAAC,IAAuB,CAAC,CAAC,CAAC;QAChF,WAAW,CAAC,WAAW,EAAE,CAAC;KAC7B;AAED,IAAA,OAAO,EAAE,KAAK,EAAE,YAAY,EAAE,CAAC;AACnC,CAAC;AAED,SAAS,kBAAkB,CACvB,OAAoC,EAAA;AAEpC,IAAA,OAAO,OAAO,CAAC,MAAM,IAAI,OAAO,CAAC,WAAW,CAAC;AACjD,CAAC;AAED,SAAS,eAAe,CAAC,KAAU,EAAE,IAAqB,EAAA;AACtD,IAAA,QAAQ,IAAI;AACR,QAAA,KAAK,KAAK,CAAC;AACX,QAAA,KAAK,OAAO;AACR,YAAA,OAAO,MAAM,CAAC,KAAK,CAAC,CAAC;AACzB,QAAA,KAAK,SAAS;AACV,YAAA,OAAO,OAAO,CAAC,KAAK,CAAC,CAAC;AAC1B,QAAA;AACI,YAAA,OAAO,KAAK,CAAC;AACpB,KAAA;AACL;;ACrEA;;;;;;;;;;;;;;;;;;;;;;;;AAwBG;SACa,eAAe,GAAA;AAC3B,IAAA,MAAM,OAAO,GAAG,UAAU,CACtB,sBAAsB,CACkC,CAAC;AAC7D,IAAA,MAAM,aAAa,GAAG,CAAC,QAAyB,KAAI;AAChD,QAAA,OAAO,CAAC,mBAAmB,EAAE,cAAc,CAAC,QAAQ,CAAC,CAAC;AAC1D,KAAC,CAAC;AACF,IAAA,MAAM,QAAQ,GAAG,CAAC,QAAgB,KAAI;AAClC,QAAA,OAAO,CAAC,mBAAmB,EAAE,QAAQ,CAAC,QAAQ,CAAC,CAAC;AACpD,KAAC,CAAC;IAEF,OAAO;QACH,aAAa;QACb,QAAQ;KACX,CAAC;AACN;;ACrCA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiCG;AACa,SAAA,QAAQ,CACpB,KAA6C,EAC7C,SAAa,EAAA;AAEb,IAAA,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,cAAc,CACrD,CAAC,WAAW,EAAE,IAAI,KAAK,WAAW,CAAC,KAAK,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC,OAAO,CAChE,CAAC;IACF,SAAS,CAAC,MAAK;QACX,MAAM,YAAY,GAAG,QAAQ,CAAC,SAAS,CAAC,CAAC,SAAS,EAAE,CAAC;AACrD,QAAA,OAAO,MAAM,YAAY,CAAC,WAAW,EAAE,CAAC;AAC5C,KAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;AAEf,IAAA,MAAM,OAAO,GAAG,CAAC,SAAa,KAAK,cAAc,CAAC,QAAQ,CAAC,SAAS,CAAC,CAAC,CAAC;IACvE,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAW,CAAC;AACtD,CAAC;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4CG;AACG,SAAU,WAAW,CACvB,QAAgD,EAAA;AAEhD,IAAA,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,cAAc,CAAO,CAAC,WAAW,EAAE,SAAS,KACnF,WAAW,CAAC,MAAM,CAAC,QAAQ,EAAE,SAAS,CAAC,CAC1C,CAAC;IACF,MAAM,IAAI,GAAG,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC;AACtC,IAAA,MAAM,OAAO,GAAG,CAAC,SAAa,KAAK,cAAc,CAAC,QAAQ,CAAC,SAAS,CAAC,CAAC,CAAC;AACvE,IAAA,OAAO,CAAC,OAAO,EAAE,IAAI,CAAkC,CAAC;AAC5D,CAAC;AAED,SAAS,cAAc,CACnB,SAAqE,EAAA;AAErE,IAAA,MAAM,OAAO,GAAG,UAAU,CAAC,sBAAsB,CAAC,CAAC;IACnD,MAAM,WAAW,GAAG,OAAO,EAAE,QAAQ,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;IACvD,IAAI,CAAC,WAAW,EAAE;AACd,QAAA,MAAM,IAAI,KAAK,CAAC,gDAAgD,CAAC,CAAC;AACrE,KAAA;IAED,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,EAAK,CAAC;IACtC,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,EAAU,CAAC;IAC7C,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;AAE9C,IAAA,MAAM,QAAQ,GAAG,WAAW,CAAC,CAAC,SAAa,KAAI;QAC3C,UAAU,CAAC,IAAI,CAAC,CAAC;QACjB,OAAO,SAAS,CAAC,WAAW,EAAE,SAAS,CAAC,CAAC,IAAI,CACzC,GAAG,CAAC;YACA,IAAI,EAAE,GAAG,IAAG;gBACR,OAAO,CAAC,GAAG,CAAC,CAAC;gBACb,UAAU,CAAC,KAAK,CAAC,CAAC;aACrB;YACD,KAAK,EAAE,GAAG,IAAG;AACT,gBAAA,QAAQ,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;gBACtB,UAAU,CAAC,KAAK,CAAC,CAAC;aACrB;AACJ,SAAA,CAAC,CACL,CAAC;KACL,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,CAAC;AAC9C;;AC5IA;;;;;;;;;;;;;;;;;AAiBG;SACa,cAAc,GAAA;AAC1B,IAAA,MAAM,cAAc,GAAG,WAAW,CAAC,cAAc,CAAC,CAAC;AACnD,IAAA,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,cAAc,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC;AACrE,IAAA,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,cAAc,CAAC,QAAQ,CAAC,WAAW,CAAC,CAAC;IAEpF,SAAS,CAAC,MAAK;QACX,MAAM,YAAY,GAAG,cAAc,CAAC,MAAM,CAAC,SAAS,CAAC,KAAK,IAAG;YACzD,SAAS,CAAC,KAAK,CAAC,CAAC;AACrB,SAAC,CAAC,CAAC;AACH,QAAA,YAAY,CAAC,GAAG,CAAC,cAAc,CAAC,WAAW,CAAC,SAAS,CAAC,KAAK,IAAI,cAAc,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;AACvF,QAAA,OAAO,MAAM,YAAY,CAAC,WAAW,EAAE,CAAC;KAC3C,EAAE,EAAE,CAAC,CAAC;AAEP,IAAA,cAAc,CAAC;IAEf,OAAO;QACH,MAAM;QACN,WAAW;KACd,CAAC;AACN;;ACTA;;;;;;AAMG;AACG,SAAU,kCAAkC,CAAC,MAAwC,EAAA;IACvF,OAAO;AACH,QAAA,OAAO,EAAE,eAAe;AACxB,QAAA,KAAK,EAAE,IAAI;AACX,QAAA,UAAU,EAAE,CAAC,4BAA0D,KAAK,MAAK;YAC7E,4BAA4B,CAAC,6BAA6B,CAAC;AACvD,gBAAA,SAAS,EAAE,0BAA0B;gBACrC,UAAU,EAAE,MAAM,CAAC,UAAU;AAC7B,gBAAA,SAAS,EAAE;AACP,oBAAA;AACI,wBAAA,OAAO,EAAE,qCAAqC;AAC9C,wBAAA,QAAQ,EAAE;4BACN,SAAS,EAAE,MAAM,CAAC,SAAS;4BAC3B,KAAK,EAAE,MAAM,CAAC,KAAK;AACtB,yBAAA;AACJ,qBAAA;AACJ,iBAAA;AACJ,aAAA,CAAC,CAAC;SACN;QACD,IAAI,EAAE,CAAC,4BAA4B,CAAC;KACvC,CAAC;AACN;;ACTA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqCG;AACG,SAAU,+BAA+B,CAAC,MAAqC,EAAA;IACjF,OAAO;AACH,QAAA,OAAO,EAAE,eAAe;AACxB,QAAA,KAAK,EAAE,IAAI;AACX,QAAA,UAAU,EAAE,CAAC,+BAAgE,KAAK,MAAK;YACnF,+BAA+B,CAAC,uBAAuB,CAAC;AACpD,gBAAA,GAAG,MAAM;AACT,gBAAA,SAAS,EAAE,0BAA0B;AACrC,gBAAA,SAAS,EAAE;AACP,oBAAA;AACI,wBAAA,OAAO,EAAE,qCAAqC;AAC9C,wBAAA,QAAQ,EAAE;4BACN,SAAS,EAAE,MAAM,CAAC,SAAS;4BAC3B,KAAK,EAAE,MAAM,CAAC,KAAK;AACtB,yBAAA;AACJ,qBAAA;AACJ,iBAAA;AACJ,aAAA,CAAC,CAAC;SACN;QACD,IAAI,EAAE,CAAC,+BAA+B,CAAC;KAC1C,CAAC;AACN;;ACtGA;;;;;AAKG;AACa,SAAA,+BAA+B,CAAC,EAAU,EAAE,SAAsB,EAAA;IAC9E,OAAO;AACH,QAAA,OAAO,EAAE,eAAe;AACxB,QAAA,KAAK,EAAE,IAAI;AACX,QAAA,UAAU,EAAE,CAAC,QAAkC,KAAK,MAAK;AACrD,YAAA,QAAQ,CAAC,sBAAsB,CAAC,EAAE,EAAE,uBAAuB,EAAE;AACzD,gBAAA;AACI,oBAAA,OAAO,EAAE,6BAA6B;AACtC,oBAAA,QAAQ,EAAE;wBACN,SAAS;AACZ,qBAAA;AACJ,iBAAA;AACJ,aAAA,CAAC,CAAC;SACN;QACD,IAAI,EAAE,CAAC,wBAAwB,CAAC;KACnC,CAAC;AACN;;ACPA;;;;;AAKG;AACG,SAAU,2BAA2B,CAKzC,OAAgE,EAAA;AAC9D,IAAA,MAAM,QAAQ,GAAG,sBAAsB,CAAC,OAAO,CAAC,CAAC;IACjD,OAAO;AACH,QAAA,GAAG,QAAQ;AACX,QAAA,SAAS,EAAE;AACP,YAAA;AACI,gBAAA,OAAO,EAAE,6BAA6B;AACtC,gBAAA,QAAQ,EAAE;oBACN,KAAK,EAAE,OAAO,CAAC,KAAK;AACc,iBAAA;AACzC,aAAA;AACD,YAAA,IAAI,QAAQ,CAAC,SAAS,IAAI,EAAE,CAAC;AAChC,SAAA;AACD,QAAA,SAAS,EAAE,mBAAmB;KACjC,CAAC;AACN;;ACjDA;;ACAA;;AAEG;;;;"}