@piying/view-angular 0.6.30 → 1.2.0

package/fesm2022/piying-view-angular.mjs

@@ -1 +1,1215 @@
-var SelectorRegexp,SelectorFlags,SelectorRegexp1,SelectorFlags1;import*as i0 from"@angular/core";import{input,Directive,ChangeDetectionStrategy,Component,InjectionToken,reflectComponentType,ɵɵelementStart as __elementStart,ɵɵlistener as __listener,ɵɵtwoWayBindingSet as __twoWayBindingSet,ɵɵprojection as __projection,ɵɵtext as __text,ɵɵtextInterpolate as __textInterpolate,ɵɵelementEnd as __elementEnd,ɵɵproperty as __property,ɵɵtwoWayProperty as __twoWayProperty,viewChild,TemplateRef,ElementRef,ɵɵdefineComponent as __defineComponent,ɵɵviewQuerySignal as __viewQuerySignal,ɵɵqueryAdvance as __queryAdvance,ɵɵprojectionDef as __projectionDef,ɵɵtemplate as __template,inject,computed,untracked,signal,EventEmitter,Injector,createComponent,EnvironmentInjector,ViewContainerRef,createNgModule,resource,effect,Injectable,Pipe,output,createEnvironmentInjector,DestroyRef,linkedSignal}from"@angular/core";import{NgTemplateOutlet}from"@angular/common";import{deepEqual}from"fast-equals";import{NgControl,Validators,NG_VALUE_ACCESSOR}from"@angular/forms";import{createViewControlLink,FormBuilder,PI_VIEW_CONFIG_TOKEN,CoreSchemaHandle,convert,rawConfig as rawConfig$1,mergeHooksFn,asyncInputMerge}from"@piying/view-angular-core";export{asControl,asVirtualGroup,condition,layout}from"@piying/view-angular-core";class PiyingViewGroupBase{fields=input.required();fieldTemplateRef=input.required();static ɵfac=i0.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"20.0.3",ngImport:i0,type:PiyingViewGroupBase,deps:[],target:i0.ɵɵFactoryTarget.Directive});static ɵdir=i0.ɵɵngDeclareDirective({minVersion:"17.1.0",version:"20.0.3",type:PiyingViewGroupBase,isStandalone:!0,inputs:{fields:{classPropertyName:"fields",publicName:"fields",isSignal:!0,isRequired:!0,transformFunction:null},fieldTemplateRef:{classPropertyName:"fieldTemplateRef",publicName:"fieldTemplateRef",isSignal:!0,isRequired:!0,transformFunction:null}},ngImport:i0})}i0.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"20.0.3",ngImport:i0,type:PiyingViewGroupBase,decorators:[{type:Directive}]});class PiyingViewGroup extends PiyingViewGroupBase{static ɵfac=i0.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"20.0.3",ngImport:i0,type:PiyingViewGroup,deps:null,target:i0.ɵɵFactoryTarget.Component});static ɵcmp=i0.ɵɵngDeclareComponent({minVersion:"17.0.0",version:"20.0.3",type:PiyingViewGroup,isStandalone:!0,selector:"piying-view-group",usesInheritance:!0,ngImport:i0,template:'@for (field of fields(); track field.id || $index) {\n  <ng-container\n    *ngTemplateOutlet="fieldTemplateRef(); context: { $implicit: field }"\n  ></ng-container>\n}\n',dependencies:[{kind:"directive",type:NgTemplateOutlet,selector:"[ngTemplateOutlet]",inputs:["ngTemplateOutletContext","ngTemplateOutlet","ngTemplateOutletInjector"]}],changeDetection:i0.ChangeDetectionStrategy.OnPush})}i0.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"20.0.3",ngImport:i0,type:PiyingViewGroup,decorators:[{type:Component,args:[{selector:"piying-view-group",imports:[NgTemplateOutlet],standalone:!0,changeDetection:ChangeDetectionStrategy.OnPush,template:'@for (field of fields(); track field.id || $index) {\n  <ng-container\n    *ngTemplateOutlet="fieldTemplateRef(); context: { $implicit: field }"\n  ></ng-container>\n}\n'}]}]});let PI_VIEW_FIELD_TOKEN=new InjectionToken("PI_VIEW_FIELD_TOKEN"),PI_COMPONENT_LIST=new InjectionToken("PI_COMPONENT_LIST"),PI_COMPONENT_INDEX=new InjectionToken("PI_COMPONENT_INDEX"),PI_COMPONENT_LIST_LISTEN=new InjectionToken("PI_COMPONENT_LIST_LISTEN"),EMPTY_ARRAY=[];function getComponentCheckConfig(a){return{...a,inputs:Object.keys(a.inputs()??{}).join(","),attributes:Object.entries(a.attributes()??{}).map((key,value)=>`${key}:${value}`).join(","),directives:a.directives?a.directives.map(config=>({...config,inputs:`${config.inputs?Object.keys(config.inputs()).join(","):""}`})):void 0,contents:a.contents?.map(item=>({...item,text:!!item.text}))}}let _SELECTOR_REGEXP=RegExp("(\\:not\\()|(([\\.\\#]?)[-\\w]+)|(?:\\[([-.\\w*\\\\$]+)(?:=([\"']?)([^\\]\"']*)\\5)?\\])|(\\))|(\\s*,\\s*)","g");(SelectorRegexp1=SelectorRegexp||(SelectorRegexp={}))[SelectorRegexp1.ALL=0]="ALL",SelectorRegexp1[SelectorRegexp1.NOT=1]="NOT",SelectorRegexp1[SelectorRegexp1.TAG=2]="TAG",SelectorRegexp1[SelectorRegexp1.PREFIX=3]="PREFIX",SelectorRegexp1[SelectorRegexp1.ATTRIBUTE=4]="ATTRIBUTE",SelectorRegexp1[SelectorRegexp1.ATTRIBUTE_STRING=5]="ATTRIBUTE_STRING",SelectorRegexp1[SelectorRegexp1.ATTRIBUTE_VALUE=6]="ATTRIBUTE_VALUE",SelectorRegexp1[SelectorRegexp1.NOT_END=7]="NOT_END",SelectorRegexp1[SelectorRegexp1.SEPARATOR=8]="SEPARATOR";class CssSelector{element=null;classNames=[];attrs=[];notSelectors=[];static parse(selector){let match,results=[],_addResult=(res,cssSel)=>{cssSel.notSelectors.length>0&&!cssSel.element&&0==cssSel.classNames.length&&0==cssSel.attrs.length&&(cssSel.element="*"),res.push(cssSel)},cssSelector=new CssSelector,current=cssSelector,inNot=!1;for(_SELECTOR_REGEXP.lastIndex=0;match=_SELECTOR_REGEXP.exec(selector);){if(match[SelectorRegexp.NOT]){if(inNot)throw Error("Nesting :not in a selector is not allowed");inNot=!0,current=new CssSelector,cssSelector.notSelectors.push(current)}let tag=match[SelectorRegexp.TAG];if(tag){let prefix=match[SelectorRegexp.PREFIX];"#"===prefix?current.addAttribute("id",tag.slice(1)):"."===prefix?current.addClassName(tag.slice(1)):current.setElement(tag)}let attribute=match[SelectorRegexp.ATTRIBUTE];if(attribute&&current.addAttribute(current.unescapeAttribute(attribute),match[SelectorRegexp.ATTRIBUTE_VALUE]),match[SelectorRegexp.NOT_END]&&(inNot=!1,current=cssSelector),match[SelectorRegexp.SEPARATOR]){if(inNot)throw Error("Multiple selectors in :not are not supported");_addResult(results,cssSelector),cssSelector=current=new CssSelector}}return _addResult(results,cssSelector),results}unescapeAttribute(attr){let result="",escaping=!1;for(let i=0;i<attr.length;i++){let char=attr.charAt(i);if("\\"===char){escaping=!0;continue}if("$"===char&&!escaping)throw Error(`Error in attribute selector "${attr}". Unescaped "$" is not supported. Please escape with "\\$".`);escaping=!1,result+=char}return result}escapeAttribute(attr){return attr.replace(/\\/g,"\\\\").replace(/\$/g,"\\$")}setElement(element=null){this.element=element}addAttribute(name,value=""){this.attrs.push(name,value&&value.toLowerCase()||"")}addClassName(name){this.classNames.push(name.toLowerCase())}toString(){let res=this.element||"";if(this.classNames&&this.classNames.forEach(klass=>res+=`.${klass}`),this.attrs)for(let i=0;i<this.attrs.length;i+=2){let name=this.escapeAttribute(this.attrs[i]),value=this.attrs[i+1];res+=`[${name}${value?"="+value:""}]`}return this.notSelectors.forEach(notSelector=>res+=`:not(${notSelector})`),res}}function parserSelectorToR3Selector(selector){let positive=function(selector){let classes=selector.classNames&&selector.classNames.length?[SelectorFlags.CLASS,...selector.classNames]:[];return[selector.element&&"*"!==selector.element?selector.element:"",...selector.attrs,...classes]}(selector),negative=selector.notSelectors&&selector.notSelectors.length?selector.notSelectors.map(notSelector=>(function(selector){let classes=selector.classNames&&selector.classNames.length?[SelectorFlags.CLASS,...selector.classNames]:[];return selector.element?[SelectorFlags.NOT|SelectorFlags.ELEMENT,selector.element,...selector.attrs,...classes]:selector.attrs.length?[SelectorFlags.NOT|SelectorFlags.ATTRIBUTE,...selector.attrs,...classes]:selector.classNames&&selector.classNames.length?[SelectorFlags.NOT|SelectorFlags.CLASS,...selector.classNames]:[]})(notSelector)):[];return positive.concat(...negative)}(SelectorFlags1=SelectorFlags||(SelectorFlags={}))[SelectorFlags1.NOT=1]="NOT",SelectorFlags1[SelectorFlags1.ATTRIBUTE=2]="ATTRIBUTE",SelectorFlags1[SelectorFlags1.ELEMENT=4]="ELEMENT",SelectorFlags1[SelectorFlags1.CLASS=8]="CLASS";let EL_QUERY=["el"],index=0,EmptyOBJ={};class BaseComponent{#index=inject(PI_COMPONENT_INDEX,{optional:!0});#eventEmitter;#componentConfig;#viewContainerRef;destroyComponentFn;fieldComponentInstance;fieldElementRef;fieldDirectiveRefList;#componentCheckConfig$$;#setComponentCheck(config){this.#componentCheckConfig$$=computed(()=>untracked(()=>getComponentCheckConfig(config)))}setFieldData(field,index){this.#index=index}#inputCache;#contentCache;#configUpdate$=signal(0);createComponent(list,viewContainerRef){this.destroyComponentFn?.(),this.#viewContainerRef=viewContainerRef,this.#eventEmitter=new EventEmitter;let componentConfig=list[this.#index];this.#componentConfig=componentConfig,this.#inputCache={inputs:computed(()=>(this.#configUpdate$(),this.#componentConfig.inputs()??EmptyOBJ)),attributes:computed(()=>(this.#configUpdate$(),this.#componentConfig.attributes()??EmptyOBJ)),directiveList:this.#componentConfig?.directives?.map((config,index)=>config.inputs?computed(()=>(this.#configUpdate$(),this.#componentConfig.directives[index].inputs())):void 0)},this.#contentCache=componentConfig.contents?.map((item,index)=>item.text?{...item,text:computed(()=>(this.#configUpdate$(),this.#componentConfig.contents[index].text()))}:item),this.#setComponentCheck(componentConfig);let SidecarComponent=function(component,directives){let contentArray,result=function(component,list){let elementTag,vars=0,consts=[],directiveList=[],propertyList=[],listenerList=[],modelList=[];if("string"==typeof component.type)elementTag=component.type;else{let componentDefine=reflectComponentType(component.type);elementTag=component.selector??componentDefine.selector,directiveList.push(component.type)}if(!elementTag)throw Error("未找到元素对应的选择器");let attributes=component.attributes?.();if(attributes)for(let key in attributes)consts.push(key,attributes[key]);let mergedList=[component,...list];for(let i=0;i<mergedList.length;i++){let item=mergedList[i];if(i>0){directiveList.push(item.type);let selectors=item.type["ɵdir"].selectors,selector=item.selector??selectors.find(selectorList=>3===selectorList.length&&""===selectorList[0]&&""===selectorList[2])[1];(!item.inputs||selector in item.inputs())&&item.inputs||(!item.model||selector in item.model)&&item.model||consts.push(selector,"")}if(item.inputs)for(let key in propertyList[i]={signal:item.inputs,keyList:[]},item.inputs())vars++,propertyList[i].keyList.push(key);for(let key in item.outputs)listenerList.push({eventName:key,listenerFn:item.outputs[key]});for(let key in item.model)vars++,modelList.push({key:key,eventName:`${key}Change`,signal:item.model[key]})}return consts.push(3),consts.push(...new Set([...listenerList.map(({eventName})=>eventName),...modelList.map(({eventName})=>eventName)])),consts.push(...new Set([...propertyList.flatMap(item=>item.keyList),...modelList.map(({key})=>key)])),{vars,consts:[["el",""],consts],directiveList,propertyList:propertyList,listenerList:listenerList,modelList,elementTag}}(component,directives);function templateFn(rf,ctx){1&rf&&(__elementStart(0,result.elementTag,1,0),result.listenerList.reduce((fn,item)=>fn(item.eventName,item.listenerFn),__listener),result.modelList.reduce((fn,item)=>fn(item.eventName,value=>{__twoWayBindingSet(item.signal,value)}),__listener),component.contents?.length&&component.contents.forEach((item,index)=>{if(item.select){var selector;__projection(index+2,index,["ngProjectAs",item.select,5,((selector=item.select)?CssSelector.parse(selector).map(parserSelectorToR3Selector):[])[0]],item.text?(rf,ctx)=>{1&rf&&__text(0),2&rf&&__textInterpolate(item.text())}:void 0,item.text?1:void 0,item.text?1:void 0)}else __projection(index+1,index)}),__elementEnd()),2&rf&&(result.propertyList.reduce((fn,{signal,keyList})=>{let value=signal();return keyList.reduce((fn,key)=>fn(key,value[key]),fn)},__property),result.modelList.reduce((fn,item)=>fn(item.key,item.signal),__twoWayProperty))}return component.contents?.length&&(contentArray=Array(component.contents.length).fill("*")),class D{templateRef=viewChild.required(TemplateRef);componentInstance=viewChild("el");elementRef=viewChild("el",{read:ElementRef});directiveRefList=directives.map(({type})=>viewChild("el",{read:type}));static ɵfac=_=>new(_||D);static ɵcmp=__defineComponent({type:D,selectors:[[`d-${index++}`]],ngContentSelectors:contentArray,decls:1,vars:0,consts:result.consts,template:(rf,ctx)=>{1&rf&&(contentArray&&__projectionDef(contentArray),__template(0,templateFn,2+(component.contents?.length??0),result.vars,"ng-template"))},viewQuery:(rf,ctx)=>{1&rf&&(__viewQuerySignal(ctx.templateRef,TemplateRef,5),__viewQuerySignal(ctx.componentInstance,EL_QUERY,5),__viewQuerySignal(ctx.elementRef,EL_QUERY,5,ElementRef),directives.forEach(({type},index)=>{__viewQuerySignal(ctx.directiveRefList[index],EL_QUERY,5,type)})),2&rf&&__queryAdvance(3+directives.length)},dependencies:result.directiveList,encapsulation:2,changeDetection:0})}}({...componentConfig,inputs:this.#inputCache.inputs,attributes:this.#inputCache.attributes,contents:this.#contentCache},componentConfig.directives?.map((config,index)=>({...config,inputs:this.#inputCache.directiveList[index]}))??[]),componentInjector=Injector.create({providers:[{provide:PI_COMPONENT_LIST,useValue:list},{provide:PI_COMPONENT_INDEX,useValue:this.#index+1},{provide:PI_COMPONENT_LIST_LISTEN,useValue:this.#eventEmitter}],parent:componentConfig.injector??viewContainerRef.injector}),componentRef=createComponent(SidecarComponent,{elementInjector:componentInjector,environmentInjector:componentInjector.get(EnvironmentInjector),projectableNodes:componentConfig.contents?.map(({nodes})=>nodes).filter(Boolean)});if(viewContainerRef.createEmbeddedView(componentRef.instance.templateRef()),this.fieldComponentInstance=componentRef.instance.componentInstance(),this.fieldElementRef=componentRef.instance.elementRef(),this.fieldDirectiveRefList=componentRef.instance.directiveRefList.map(item=>item()),this.destroyComponentFn=()=>{viewContainerRef.clear(),componentRef.destroy(),this.#eventEmitter.unsubscribe()},list.length===this.#index+1){let field=componentInjector.get(PI_VIEW_FIELD_TOKEN)();field.hooks?.afterCreateComponent?.(field)}}update(list){let item=list[this.#index];deepEqual(getComponentCheckConfig(item),this.#componentCheckConfig$$())?(this.#componentConfig=item,this.#configUpdate$.update(a=>a+1),this.#eventEmitter.next(list)):this.createComponent(list,this.#viewContainerRef)}static ɵfac=i0.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"20.0.3",ngImport:i0,type:BaseComponent,deps:[],target:i0.ɵɵFactoryTarget.Directive});static ɵdir=i0.ɵɵngDeclareDirective({minVersion:"14.0.0",version:"20.0.3",type:BaseComponent,isStandalone:!0,ngImport:i0})}i0.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"20.0.3",ngImport:i0,type:BaseComponent,decorators:[{type:Directive}]});class InteropNgControl extends NgControl{field;constructor(field){super(),this.field=field}control=this;get value(){return this.field().value}get valid(){return this.field().valid}get invalid(){return!this.field().valid}get pending(){return!1}get disabled(){return this.field().disabled}get enabled(){return!this.field().disabled}get errors(){return this.field().errors??null}get pristine(){return!0}get dirty(){return!1}get touched(){return this.field().touched}get untouched(){return!this.field().touched}get submitted(){return!1}viewToModelUpdate(newValue){}get valueChanges(){return this.field().valueChanges}get statusChanges(){return this.field().statusChanges}hasValidator(input){return Validators.required===input&&this.field().required$$()}}let formControlBinding={provide:NgControl,useFactory:()=>inject(FieldControlDirective).ngControl};class FieldControlDirective{fieldControl=input.required();cvaArray=inject(NG_VALUE_ACCESSOR);injector=inject(Injector);get cva(){return this.cvaArray[0]}#_ngControl;get ngControl(){return this.#_ngControl??=new InteropNgControl(()=>this.fieldControl())}ngOnInit(){this.disposeList.push(createViewControlLink(this.fieldControl,this.cva,this.injector))}disposeList=[];clear(){this.disposeList.forEach(fn=>fn()),this.disposeList=[]}ngOnDestroy(){this.clear()}static ɵfac=i0.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"20.0.3",ngImport:i0,type:FieldControlDirective,deps:[],target:i0.ɵɵFactoryTarget.Directive});static ɵdir=i0.ɵɵngDeclareDirective({minVersion:"17.1.0",version:"20.0.3",type:FieldControlDirective,isStandalone:!1,selector:"[fieldControl]",inputs:{fieldControl:{classPropertyName:"fieldControl",publicName:"fieldControl",isSignal:!0,isRequired:!0,transformFunction:null}},providers:[formControlBinding],ngImport:i0})}i0.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"20.0.3",ngImport:i0,type:FieldControlDirective,decorators:[{type:Directive,args:[{selector:"[fieldControl]",providers:[formControlBinding],standalone:!1}]}]});class NgComponentOutlet extends BaseComponent{ngComponentOutlet=input();ngComponentOutletInputs=input();ngComponentOutletOutputs=input();ngComponentOutletInjector=input();ngComponentOutletContent=input();ngComponentOutletFormControl=input();ngComponentOutletWrappers=input();ngComponentOutletTopDirectives=input();ngComponentOutletDirectives=input();ngComponentOutletField=input.required();#viewContainerRef=inject(ViewContainerRef);#wrappers=computed(()=>this.ngComponentOutletWrappers()?.map(item=>({...item,type:item.type.component,module:item.type.module})));#onputEqual$$=computed(()=>this.ngComponentOutletOutputs(),{equal:deepEqual});#moduleDestroy;#moduleRef$$=computed(()=>{this.#moduleDestroy?.();let injector=this.ngComponentOutletInjector()||this.#injector,module=this.ngComponentOutlet()?.type.module;if(!module)return;let moduleRef=createNgModule(module,injector);return this.#moduleDestroy=()=>{moduleRef.destroy(),this.#moduleDestroy=void 0},moduleRef});#usedEnvInjector$$=computed(()=>{let injector=this.#moduleRef$$()?.injector??(this.ngComponentOutletInjector()||this.#injector);return Injector.create({providers:[{provide:PI_VIEW_FIELD_TOKEN,useValue:this.ngComponentOutletField},{provide:PI_COMPONENT_INDEX,useValue:0}],parent:injector}).get(Injector)});#injector=inject(Injector);#formControlDirectiveConfig$$=computed(()=>{let fieldControl=this.ngComponentOutletFormControl();return fieldControl?{type:FieldControlDirective,inputs:computed(()=>({fieldControl:fieldControl}))}:void 0});#directiveConfigList$$=computed(()=>{let directivesInputs=this.ngComponentOutletDirectives(),formConfig=this.#formControlDirectiveConfig$$();return formConfig?[...directivesInputs?.()??[],formConfig]:directivesInputs?.()});#componentConfig$$=computed(()=>{let define=this.ngComponentOutlet();if(!define)return;let directives=this.#directiveConfigList$$();return{...define,type:define.type.component,module:define.type.module,inputs:this.ngComponentOutletInputs,directives:directives?directives.map(item=>{let outputs=item.outputs;return outputs?{...item,outputs:outputs}:item}):void 0,outputs:this.#onputEqual$$(),contents:this.ngComponentOutletContent()}});#componentList$$=computed(()=>{let componentConfig=this.#componentConfig$$();if(!componentConfig)return EMPTY_ARRAY;let injector=this.#usedEnvInjector$$(),list=[...this.#wrappers()??[],componentConfig];return list[0]={...list[0],injector},list});#lastList;ngOnChanges(){let list=this.#componentList$$();if(!list.length)return this.destroyComponentFn?.();if(this.#lastList)this.#lastList!==list&&this.update(list);else{let field=this.ngComponentOutletField();field.hooks?.beforeCreateComponent?.(field),this.setFieldData(this.ngComponentOutletField,0),this.createComponent(list,this.#viewContainerRef)}this.#lastList=list}ngOnDestroy(){this.#moduleDestroy?.(),this.destroyComponentFn?.()}static ɵfac=i0.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"20.0.3",ngImport:i0,type:NgComponentOutlet,deps:null,target:i0.ɵɵFactoryTarget.Directive});static ɵdir=i0.ɵɵngDeclareDirective({minVersion:"17.1.0",version:"20.0.3",type:NgComponentOutlet,isStandalone:!0,selector:"[ngComponentOutlet]",inputs:{ngComponentOutlet:{classPropertyName:"ngComponentOutlet",publicName:"ngComponentOutlet",isSignal:!0,isRequired:!1,transformFunction:null},ngComponentOutletInputs:{classPropertyName:"ngComponentOutletInputs",publicName:"ngComponentOutletInputs",isSignal:!0,isRequired:!1,transformFunction:null},ngComponentOutletOutputs:{classPropertyName:"ngComponentOutletOutputs",publicName:"ngComponentOutletOutputs",isSignal:!0,isRequired:!1,transformFunction:null},ngComponentOutletInjector:{classPropertyName:"ngComponentOutletInjector",publicName:"ngComponentOutletInjector",isSignal:!0,isRequired:!1,transformFunction:null},ngComponentOutletContent:{classPropertyName:"ngComponentOutletContent",publicName:"ngComponentOutletContent",isSignal:!0,isRequired:!1,transformFunction:null},ngComponentOutletFormControl:{classPropertyName:"ngComponentOutletFormControl",publicName:"ngComponentOutletFormControl",isSignal:!0,isRequired:!1,transformFunction:null},ngComponentOutletWrappers:{classPropertyName:"ngComponentOutletWrappers",publicName:"ngComponentOutletWrappers",isSignal:!0,isRequired:!1,transformFunction:null},ngComponentOutletTopDirectives:{classPropertyName:"ngComponentOutletTopDirectives",publicName:"ngComponentOutletTopDirectives",isSignal:!0,isRequired:!1,transformFunction:null},ngComponentOutletDirectives:{classPropertyName:"ngComponentOutletDirectives",publicName:"ngComponentOutletDirectives",isSignal:!0,isRequired:!1,transformFunction:null},ngComponentOutletField:{classPropertyName:"ngComponentOutletField",publicName:"ngComponentOutletField",isSignal:!0,isRequired:!0,transformFunction:null}},exportAs:["ngComponentOutlet"],usesInheritance:!0,usesOnChanges:!0,ngImport:i0})}function createAsyncCache(one,injector){let loading=new Map,cached=new Map;return list=>untracked(()=>{if(!list)return{value:computed(()=>void 0)};let hasPromise=!1,result=(one?[list]:list).map(item=>{if(cached.has(item))return cached.get(item);if(loading.has(item))return hasPromise=!0,loading.get(item);let type=item.type;if("string"!=typeof type&&!reflectComponentType(type))if("function"!=typeof type)return item;else{hasPromise=!0;let result$$=type().then(value=>{let result={...item,type:reflectComponentType(value)?{component:value}:value};return cached.set(item,result),loading.delete(item),result});return loading.set(item,result$$),result$$}{let result={...item,type:{component:type}};return cached.set(item,result),result}});return hasPromise?resource({loader:async()=>one?result[0]:Promise.all(result),injector:injector}):{value:computed(()=>one?result[0]:result)}})}i0.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"20.0.3",ngImport:i0,type:NgComponentOutlet,decorators:[{type:Directive,args:[{selector:"[ngComponentOutlet]",exportAs:"ngComponentOutlet",standalone:!0}]}]});class AngularFormBuilder extends FormBuilder{#globalConfig=inject(PI_VIEW_CONFIG_TOKEN,{optional:!0})??void 0;afterResolveConfig(rawConfig,config){let componentDefaultConfig,type=rawConfig.type,mergeStrategy=this.#globalConfig?.defaultConfigMergeStrategy;if(type){let result=this.#resolveComponent(type);result.define,componentDefaultConfig=result.defaultConfig}let directives=this.configMerge([componentDefaultConfig?.directives,rawConfig.directives],!0,"string"==typeof mergeStrategy?mergeStrategy:mergeStrategy?.directives??"merge");return{...config,contents:rawConfig.contents?.sort((a,b)=>a.nodes&&b.nodes?0:a.nodes?-1:1),directives:directives}}#resolveComponent(type){let define,defaultConfig;if("string"==typeof type){let config=this.#globalConfig?.types?.[type];if(!config)throw Error(`未注册${type}`);defaultConfig=config,Object.keys(config).length&&(define={...config})}else define={type};return{define,defaultConfig}}static ɵfac=i0.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"20.0.3",ngImport:i0,type:AngularFormBuilder,deps:null,target:i0.ɵɵFactoryTarget.Injectable});static ɵprov=i0.ɵɵngDeclareInjectable({minVersion:"12.0.0",version:"20.0.3",ngImport:i0,type:AngularFormBuilder})}i0.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"20.0.3",ngImport:i0,type:AngularFormBuilder,decorators:[{type:Injectable}]});class NgSchemaHandle extends CoreSchemaHandle{contents;directives}class PurePipe{transform(fn,...args){return fn(...args)}static ɵfac=i0.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"20.0.3",ngImport:i0,type:PurePipe,deps:[],target:i0.ɵɵFactoryTarget.Pipe});static ɵpipe=i0.ɵɵngDeclarePipe({minVersion:"14.0.0",version:"20.0.3",ngImport:i0,type:PurePipe,isStandalone:!0,name:"pure"})}i0.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"20.0.3",ngImport:i0,type:PurePipe,decorators:[{type:Pipe,args:[{name:"pure",standalone:!0}]}]});let DefaultConvertOptions={builder:AngularFormBuilder,handle:NgSchemaHandle};class PiyingView{schema=input.required();model=input(void 0);modelChange=output();options=input();form$$=computed(()=>this.resolvedField$()?.form.control);#lastRF;ngOnChanges(changes){let rFields=this.#resolvedFields$$();(this.#lastRF!==rFields||"model"in changes)&&this.#modelChange$$(),this.#lastRF=rFields}#modelChange$$=computed(()=>{let model=this.model();untracked(()=>this.#updateField(model))});#resolvedFields$$=computed(()=>(this.schema(),untracked(()=>this.#updateForm())));#injector=inject(Injector);#envInjector=inject(EnvironmentInjector);#builderEnvInjector;resolvedField$=signal(void 0);#disposeList=[];#updateForm(){this.#clean();let envInjector=createEnvironmentInjector([],this.#envInjector);this.#builderEnvInjector=envInjector;let result=convert(this.schema(),{...DefaultConvertOptions,...this.options(),injector:envInjector,registerOnDestroy:fn=>{envInjector.get(DestroyRef).onDestroy(()=>{fn()})}});if(this.resolvedField$.set(result),result.form.control){var input,control,injector,fn;let init,ref=(input=this.model(),control=result.form.control,injector=this.#injector,fn=value=>{untracked(()=>{result.form.control?.valueNoError$$()&&this.modelChange.emit(value)})},init=!0,effect(()=>{let modelValue=control.value$$();init?(deepEqual(modelValue,input)||fn(modelValue),init=!1):fn(modelValue)},{injector}));this.#disposeList.push(()=>ref.destroy())}return result}#clean(isDestoryed=!1){this.#disposeList.forEach(item=>item()),this.#disposeList=[],!isDestoryed&&this.#builderEnvInjector&&(this.#builderEnvInjector.destroy(),this.#builderEnvInjector=void 0)}#updateField(model){if(!this.resolvedField$())return;let field=this.resolvedField$();field.form.control?.updateValue(model)}groupInputsValue=(inputs,fields,fieldTemplateRef)=>computed(()=>({...inputs(),fields,fieldTemplateRef}));resolvedComponent=createAsyncCache(!0,this.#injector);resolvedWrapper=createAsyncCache(!1,this.#injector);groupHidden=field=>computed(()=>this.#groupHidden(field));#groupHidden(field){return field.fieldGroup?!field.fieldGroup().length||field.fieldGroup().every(field=>this.#groupHidden(field)):!field.define||!!field.renderConfig().hidden}ngOnDestroy(){this.#clean(!0)}static ɵfac=i0.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"20.0.3",ngImport:i0,type:PiyingView,deps:[],target:i0.ɵɵFactoryTarget.Component});static ɵcmp=i0.ɵɵngDeclareComponent({minVersion:"17.0.0",version:"20.0.3",type:PiyingView,isStandalone:!0,selector:"piying-view",inputs:{schema:{classPropertyName:"schema",publicName:"schema",isSignal:!0,isRequired:!0,transformFunction:null},model:{classPropertyName:"model",publicName:"model",isSignal:!0,isRequired:!1,transformFunction:null},options:{classPropertyName:"options",publicName:"options",isSignal:!0,isRequired:!1,transformFunction:null}},outputs:{modelChange:"modelChange"},usesOnChanges:!0,ngImport:i0,template:'<ng-template #dynamicComponent let-field>\n  @let renderConfig = field.renderConfig();\n  @if (!renderConfig?.hidden) {\n    @let typeResource = resolvedComponent | pure: field.define;\n    @let type = typeResource.value();\n    @let wrappersResource = resolvedWrapper | pure: field.wrappers();\n    @let wrappers = wrappersResource.value();\n    @if (type) {\n      @if (field.fieldGroup) {\n        @if (!(groupHidden | pure: field)()) {\n          \x3c!-- 自定义group --\x3e\n          <ng-container\n            [ngComponentOutlet]="type"\n            [ngComponentOutletInputs]="\n              (\n                groupInputsValue\n                | pure: field.inputs : field.fieldGroup() : dynamicComponent\n              )?.()\n            "\n            [ngComponentOutletOutputs]="field.outputs()"\n            [ngComponentOutletWrappers]="wrappers"\n            [ngComponentOutletField]="field"\n            [ngComponentOutletDirectives]="field.directives"\n          ></ng-container>\n        }\n      } @else if (field.fieldArray) {\n        \x3c!-- 自定义array --\x3e\n        <ng-container\n          [ngComponentOutlet]="type"\n          [ngComponentOutletInputs]="\n            (\n              groupInputsValue\n              | pure: field.inputs : field.fieldArray() : dynamicComponent\n            )?.()\n          "\n          [ngComponentOutletOutputs]="field.outputs()"\n          [ngComponentOutletWrappers]="wrappers"\n          [ngComponentOutletField]="field"\n          [ngComponentOutletDirectives]="field.directives"\n        ></ng-container>\n      } @else {\n        <ng-container\n          [ngComponentOutlet]="type"\n          [ngComponentOutletInputs]="field.inputs()"\n          [ngComponentOutletOutputs]="field.outputs()"\n          [ngComponentOutletFormControl]="$any(field.form.control)"\n          [ngComponentOutletWrappers]="wrappers"\n          [ngComponentOutletField]="field"\n          [ngComponentOutletDirectives]="field.directives"\n          [ngComponentOutletContent]="field.contents"\n        ></ng-container>\n      }\n    }\n  }\n</ng-template>\n\n@if (resolvedField$(); as field) {\n  <ng-container\n    *ngTemplateOutlet="dynamicComponent; context: { $implicit: field }"\n  ></ng-container>\n}\n',dependencies:[{kind:"directive",type:NgComponentOutlet,selector:"[ngComponentOutlet]",inputs:["ngComponentOutlet","ngComponentOutletInputs","ngComponentOutletOutputs","ngComponentOutletInjector","ngComponentOutletContent","ngComponentOutletFormControl","ngComponentOutletWrappers","ngComponentOutletTopDirectives","ngComponentOutletDirectives","ngComponentOutletField"],exportAs:["ngComponentOutlet"]},{kind:"pipe",type:PurePipe,name:"pure"},{kind:"directive",type:NgTemplateOutlet,selector:"[ngTemplateOutlet]",inputs:["ngTemplateOutletContext","ngTemplateOutlet","ngTemplateOutletInjector"]}],changeDetection:i0.ChangeDetectionStrategy.OnPush})}i0.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"20.0.3",ngImport:i0,type:PiyingView,decorators:[{type:Component,args:[{selector:"piying-view",imports:[NgComponentOutlet,PurePipe,NgTemplateOutlet],standalone:!0,changeDetection:ChangeDetectionStrategy.OnPush,template:'<ng-template #dynamicComponent let-field>\n  @let renderConfig = field.renderConfig();\n  @if (!renderConfig?.hidden) {\n    @let typeResource = resolvedComponent | pure: field.define;\n    @let type = typeResource.value();\n    @let wrappersResource = resolvedWrapper | pure: field.wrappers();\n    @let wrappers = wrappersResource.value();\n    @if (type) {\n      @if (field.fieldGroup) {\n        @if (!(groupHidden | pure: field)()) {\n          \x3c!-- 自定义group --\x3e\n          <ng-container\n            [ngComponentOutlet]="type"\n            [ngComponentOutletInputs]="\n              (\n                groupInputsValue\n                | pure: field.inputs : field.fieldGroup() : dynamicComponent\n              )?.()\n            "\n            [ngComponentOutletOutputs]="field.outputs()"\n            [ngComponentOutletWrappers]="wrappers"\n            [ngComponentOutletField]="field"\n            [ngComponentOutletDirectives]="field.directives"\n          ></ng-container>\n        }\n      } @else if (field.fieldArray) {\n        \x3c!-- 自定义array --\x3e\n        <ng-container\n          [ngComponentOutlet]="type"\n          [ngComponentOutletInputs]="\n            (\n              groupInputsValue\n              | pure: field.inputs : field.fieldArray() : dynamicComponent\n            )?.()\n          "\n          [ngComponentOutletOutputs]="field.outputs()"\n          [ngComponentOutletWrappers]="wrappers"\n          [ngComponentOutletField]="field"\n          [ngComponentOutletDirectives]="field.directives"\n        ></ng-container>\n      } @else {\n        <ng-container\n          [ngComponentOutlet]="type"\n          [ngComponentOutletInputs]="field.inputs()"\n          [ngComponentOutletOutputs]="field.outputs()"\n          [ngComponentOutletFormControl]="$any(field.form.control)"\n          [ngComponentOutletWrappers]="wrappers"\n          [ngComponentOutletField]="field"\n          [ngComponentOutletDirectives]="field.directives"\n          [ngComponentOutletContent]="field.contents"\n        ></ng-container>\n      }\n    }\n  }\n</ng-template>\n\n@if (resolvedField$(); as field) {\n  <ng-container\n    *ngTemplateOutlet="dynamicComponent; context: { $implicit: field }"\n  ></ng-container>\n}\n'}]}]});class PiWrapperBaseComponent extends BaseComponent{fieldComponentAnchor=viewChild("fieldComponent",{read:ViewContainerRef});field$$=inject(PI_VIEW_FIELD_TOKEN);props$$=computed(()=>this.field$$().props());#listen=inject(PI_COMPONENT_LIST_LISTEN);#list=inject(PI_COMPONENT_LIST);createComponent(){let result=super.createComponent(this.#list,this.fieldComponentAnchor());return this.#listen.subscribe(list=>{this.update(list)}),result}ngOnInit(){this.createComponent()}static ɵfac=i0.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"20.0.3",ngImport:i0,type:PiWrapperBaseComponent,deps:null,target:i0.ɵɵFactoryTarget.Directive});static ɵdir=i0.ɵɵngDeclareDirective({minVersion:"17.2.0",version:"20.0.3",type:PiWrapperBaseComponent,isStandalone:!0,viewQueries:[{propertyName:"fieldComponentAnchor",first:!0,predicate:["fieldComponent"],descendants:!0,read:ViewContainerRef,isSignal:!0}],usesInheritance:!0,ngImport:i0})}i0.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"20.0.3",ngImport:i0,type:PiWrapperBaseComponent,decorators:[{type:Directive}]});let rawConfig=rawConfig$1;function setDirectives(items){return rawConfig(field=>{field.directives=items})}function patchDirectives(items){return rawConfig(field=>{field.directives??=[],field.directives.push(...items)})}function patchAsyncDirective(fn){return rawConfig(field=>{mergeHooksFn({fieldResolved:field=>{field.directives??=signal([]);let directive=fn(field),inputs=directive.inputs,inputs$=signal({});inputs&&(inputs$.set(Object.keys(inputs).reduce((obj,key)=>(obj[key]=void 0,obj),{})),inputs$=asyncInputMerge(inputs,inputs$));let oldDirectives=field.directives;field.directives=linkedSignal(()=>[...oldDirectives(),{...directive,inputs:inputs$}])}},{position:"bottom"},field)})}class BaseControl{value$=signal(void 0);emitValue;registerOnChange(fn){this.emitValue=fn}valueChange(value){this.emitValue?.(value),this.value$.set(value)}writeValue(obj){this.value$.set(obj??void 0)}#touched;registerOnTouched(fn){this.#touched=fn}touchedChange(){this.#touched()}disabled$=signal(!1);setDisabledState(isDisabled){this.disabled$.set(isDisabled)}}export{AngularFormBuilder,BaseControl,NgSchemaHandle,PI_COMPONENT_INDEX,PI_COMPONENT_LIST,PI_COMPONENT_LIST_LISTEN,PI_VIEW_FIELD_TOKEN,PiWrapperBaseComponent,PiyingView,PiyingViewGroup,PiyingViewGroupBase,patchAsyncDirective,patchDirectives,rawConfig,setDirectives};
+import * as i0 from '@angular/core';
+import { input, Directive, ChangeDetectionStrategy, Component, InjectionToken, reflectComponentType, ɵɵelementStart as __elementStart, ɵɵlistener as __listener, ɵɵtwoWayBindingSet as __twoWayBindingSet, ɵɵprojection as __projection, ɵɵtext as __text, ɵɵtextInterpolate as __textInterpolate, ɵɵelementEnd as __elementEnd, ɵɵproperty as __property, ɵɵtwoWayProperty as __twoWayProperty, viewChild, TemplateRef, ElementRef, ɵɵdefineComponent as __defineComponent, ɵɵviewQuerySignal as __viewQuerySignal, ɵɵqueryAdvance as __queryAdvance, ɵɵprojectionDef as __projectionDef, ɵɵtemplate as __template, inject, computed, untracked, signal, EventEmitter, Injector, createComponent, EnvironmentInjector, ViewContainerRef, createNgModule, resource, effect, Injectable, Pipe, output, createEnvironmentInjector, DestroyRef, linkedSignal } from '@angular/core';
+import { NgTemplateOutlet } from '@angular/common';
+import { deepEqual } from 'fast-equals';
+import { NgControl, Validators, NG_VALUE_ACCESSOR } from '@angular/forms';
+import { createViewControlLink, FormBuilder, PI_VIEW_CONFIG_TOKEN, CoreSchemaHandle, convert, rawConfig as rawConfig$1, mergeHooksFn, asyncInputMerge } from '@piying/view-angular-core';
+export { asControl, asVirtualGroup, condition, layout } from '@piying/view-angular-core';
+
+class PiyingViewGroupBase {
+    fields = input.required();
+    fieldTemplateRef = input.required();
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PiyingViewGroupBase, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.0.3", type: PiyingViewGroupBase, isStandalone: true, inputs: { fields: { classPropertyName: "fields", publicName: "fields", isSignal: true, isRequired: true, transformFunction: null }, fieldTemplateRef: { classPropertyName: "fieldTemplateRef", publicName: "fieldTemplateRef", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PiyingViewGroupBase, decorators: [{
+            type: Directive
+        }] });
+
+class PiyingViewGroup extends PiyingViewGroupBase {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PiyingViewGroup, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", type: PiyingViewGroup, isStandalone: true, selector: "piying-view-group", usesInheritance: true, ngImport: i0, template: "@for (field of fields(); track field.id || $index) {\n  <ng-container\n    *ngTemplateOutlet=\"fieldTemplateRef(); context: { $implicit: field }\"\n  ></ng-container>\n}\n", dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PiyingViewGroup, decorators: [{
+            type: Component,
+            args: [{ selector: 'piying-view-group', imports: [NgTemplateOutlet], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "@for (field of fields(); track field.id || $index) {\n  <ng-container\n    *ngTemplateOutlet=\"fieldTemplateRef(); context: { $implicit: field }\"\n  ></ng-container>\n}\n" }]
+        }] });
+
+/** component */
+/** wrapper中可以使用,已解析的配置 */
+const PI_VIEW_FIELD_TOKEN = new InjectionToken('PI_VIEW_FIELD_TOKEN');
+/**
+ * @internal
+ * 内部传参用
+ */
+const PI_COMPONENT_LIST = new InjectionToken('PI_COMPONENT_LIST');
+const PI_COMPONENT_INDEX = new InjectionToken('PI_COMPONENT_INDEX');
+const PI_COMPONENT_LIST_LISTEN = new InjectionToken('PI_COMPONENT_LIST_LISTEN');
+
+const EMPTY_ARRAY = [];
+const NG_CONFIG_DEFAULT_MERGE_STRAGEGY = {
+    directives: 'merge',
+    formConfig: 'merge',
+    inputs: 'merge',
+    outputs: 'merge',
+    props: 'merge',
+    renderConfig: 'merge',
+    wrappers: 'replace',
+    attributes: 'merge',
+};
+
+function getComponentCheckConfig(a) {
+    return {
+        ...a,
+        inputs: Object.keys(a.inputs() ?? {}).join(','),
+        // todo 需要等修改为动态的再比较key
+        attributes: Object.entries(a.attributes() ?? {})
+            .map((key, value) => `${key}:${value}`)
+            .join(','),
+        directives: a.directives
+            ? a.directives.map((config) => ({
+                ...config,
+                inputs: `${config.inputs ? Object.keys(config.inputs()).join(',') : ''}`,
+            }))
+            : undefined,
+        contents: a.contents?.map((item) => ({ ...item, text: !!item.text })),
+    };
+}
+
+//packages/compiler/src/directive_matching.ts
+/**
+ * @license
+ * Copyright Google LLC All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.dev/license
+ */
+const _SELECTOR_REGEXP = new RegExp('(\\:not\\()|' + // 1: ":not("
+    '(([\\.\\#]?)[-\\w]+)|' + // 2: "tag"; 3: "."/"#";
+    // "-" should appear first in the regexp below as FF31 parses "[.-\w]" as a range
+    // 4: attribute; 5: attribute_string; 6: attribute_value
+    '(?:\\[([-.\\w*\\\\$]+)(?:=(["\']?)([^\\]"\']*)\\5)?\\])|' + // "[name]", "[name=value]",
+    // "[name="value"]",
+    // "[name='value']"
+    '(\\))|' + // 7: ")"
+    '(\\s*,\\s*)', // 8: ","
+'g');
+/**
+ * These offsets should match the match-groups in `_SELECTOR_REGEXP` offsets.
+ */
+var SelectorRegexp;
+(function (SelectorRegexp) {
+    SelectorRegexp[SelectorRegexp["ALL"] = 0] = "ALL";
+    SelectorRegexp[SelectorRegexp["NOT"] = 1] = "NOT";
+    SelectorRegexp[SelectorRegexp["TAG"] = 2] = "TAG";
+    SelectorRegexp[SelectorRegexp["PREFIX"] = 3] = "PREFIX";
+    SelectorRegexp[SelectorRegexp["ATTRIBUTE"] = 4] = "ATTRIBUTE";
+    SelectorRegexp[SelectorRegexp["ATTRIBUTE_STRING"] = 5] = "ATTRIBUTE_STRING";
+    SelectorRegexp[SelectorRegexp["ATTRIBUTE_VALUE"] = 6] = "ATTRIBUTE_VALUE";
+    SelectorRegexp[SelectorRegexp["NOT_END"] = 7] = "NOT_END";
+    SelectorRegexp[SelectorRegexp["SEPARATOR"] = 8] = "SEPARATOR";
+})(SelectorRegexp || (SelectorRegexp = {}));
+/**
+ * A css selector contains an element name,
+ * css classes and attribute/value pairs with the purpose
+ * of selecting subsets out of them.
+ */
+class CssSelector {
+    element = null;
+    classNames = [];
+    /**
+     * The selectors are encoded in pairs where:
+     * - even locations are attribute names
+     * - odd locations are attribute values.
+     *
+     * Example:
+     * Selector: `[key1=value1][key2]` would parse to:
+     * ```
+     * ['key1', 'value1', 'key2', '']
+     * ```
+     */
+    attrs = [];
+    notSelectors = [];
+    static parse(selector) {
+        const results = [];
+        const _addResult = (res, cssSel) => {
+            if (cssSel.notSelectors.length > 0 &&
+                !cssSel.element &&
+                cssSel.classNames.length == 0 &&
+                cssSel.attrs.length == 0) {
+                cssSel.element = '*';
+            }
+            res.push(cssSel);
+        };
+        let cssSelector = new CssSelector();
+        let match;
+        let current = cssSelector;
+        let inNot = false;
+        _SELECTOR_REGEXP.lastIndex = 0;
+        while ((match = _SELECTOR_REGEXP.exec(selector))) {
+            if (match[SelectorRegexp.NOT]) {
+                if (inNot) {
+                    throw new Error('Nesting :not in a selector is not allowed');
+                }
+                inNot = true;
+                current = new CssSelector();
+                cssSelector.notSelectors.push(current);
+            }
+            const tag = match[SelectorRegexp.TAG];
+            if (tag) {
+                const prefix = match[SelectorRegexp.PREFIX];
+                if (prefix === '#') {
+                    // #hash
+                    current.addAttribute('id', tag.slice(1));
+                }
+                else if (prefix === '.') {
+                    // Class
+                    current.addClassName(tag.slice(1));
+                }
+                else {
+                    // Element
+                    current.setElement(tag);
+                }
+            }
+            const attribute = match[SelectorRegexp.ATTRIBUTE];
+            if (attribute) {
+                current.addAttribute(current.unescapeAttribute(attribute), match[SelectorRegexp.ATTRIBUTE_VALUE]);
+            }
+            if (match[SelectorRegexp.NOT_END]) {
+                inNot = false;
+                current = cssSelector;
+            }
+            if (match[SelectorRegexp.SEPARATOR]) {
+                if (inNot) {
+                    throw new Error('Multiple selectors in :not are not supported');
+                }
+                _addResult(results, cssSelector);
+                cssSelector = current = new CssSelector();
+            }
+        }
+        _addResult(results, cssSelector);
+        return results;
+    }
+    /**
+     * Unescape `\$` sequences from the CSS attribute selector.
+     *
+     * This is needed because `$` can have a special meaning in CSS selectors,
+     * but we might want to match an attribute that contains `$`.
+     * [MDN web link for more
+     * info](https://developer.mozilla.org/en-US/docs/Web/CSS/Attribute_selectors).
+     * @param attr the attribute to unescape.
+     * @returns the unescaped string.
+     */
+    unescapeAttribute(attr) {
+        let result = '';
+        let escaping = false;
+        for (let i = 0; i < attr.length; i++) {
+            const char = attr.charAt(i);
+            if (char === '\\') {
+                escaping = true;
+                continue;
+            }
+            if (char === '$' && !escaping) {
+                throw new Error(`Error in attribute selector "${attr}". ` +
+                    `Unescaped "$" is not supported. Please escape with "\\$".`);
+            }
+            escaping = false;
+            result += char;
+        }
+        return result;
+    }
+    /**
+     * Escape `$` sequences from the CSS attribute selector.
+     *
+     * This is needed because `$` can have a special meaning in CSS selectors,
+     * with this method we are escaping `$` with `\$'.
+     * [MDN web link for more
+     * info](https://developer.mozilla.org/en-US/docs/Web/CSS/Attribute_selectors).
+     * @param attr the attribute to escape.
+     * @returns the escaped string.
+     */
+    escapeAttribute(attr) {
+        return attr.replace(/\\/g, '\\\\').replace(/\$/g, '\\$');
+    }
+    setElement(element = null) {
+        this.element = element;
+    }
+    addAttribute(name, value = '') {
+        this.attrs.push(name, (value && value.toLowerCase()) || '');
+    }
+    addClassName(name) {
+        this.classNames.push(name.toLowerCase());
+    }
+    toString() {
+        let res = this.element || '';
+        if (this.classNames) {
+            this.classNames.forEach((klass) => (res += `.${klass}`));
+        }
+        if (this.attrs) {
+            for (let i = 0; i < this.attrs.length; i += 2) {
+                const name = this.escapeAttribute(this.attrs[i]);
+                const value = this.attrs[i + 1];
+                res += `[${name}${value ? '=' + value : ''}]`;
+            }
+        }
+        this.notSelectors.forEach((notSelector) => (res += `:not(${notSelector})`));
+        return res;
+    }
+}
+
+// packages/compiler/src/core.ts
+/**
+ * Flags used to generate R3-style CSS Selectors. They are pasted from
+ * core/src/render3/projection.ts because they cannot be referenced directly.
+ */
+var SelectorFlags;
+(function (SelectorFlags) {
+    /** Indicates this is the beginning of a new negative selector */
+    SelectorFlags[SelectorFlags["NOT"] = 1] = "NOT";
+    /** Mode for matching attributes */
+    SelectorFlags[SelectorFlags["ATTRIBUTE"] = 2] = "ATTRIBUTE";
+    /** Mode for matching tag names */
+    SelectorFlags[SelectorFlags["ELEMENT"] = 4] = "ELEMENT";
+    /** Mode for matching class names */
+    SelectorFlags[SelectorFlags["CLASS"] = 8] = "CLASS";
+})(SelectorFlags || (SelectorFlags = {}));
+function parserSelectorToSimpleSelector(selector) {
+    const classes = selector.classNames && selector.classNames.length
+        ? [SelectorFlags.CLASS, ...selector.classNames]
+        : [];
+    const elementName = selector.element && selector.element !== '*' ? selector.element : '';
+    return [elementName, ...selector.attrs, ...classes];
+}
+function parserSelectorToNegativeSelector(selector) {
+    const classes = selector.classNames && selector.classNames.length
+        ? [SelectorFlags.CLASS, ...selector.classNames]
+        : [];
+    if (selector.element) {
+        return [
+            SelectorFlags.NOT | SelectorFlags.ELEMENT,
+            selector.element,
+            ...selector.attrs,
+            ...classes,
+        ];
+    }
+    else if (selector.attrs.length) {
+        return [
+            SelectorFlags.NOT | SelectorFlags.ATTRIBUTE,
+            ...selector.attrs,
+            ...classes,
+        ];
+    }
+    else {
+        return selector.classNames && selector.classNames.length
+            ? [SelectorFlags.NOT | SelectorFlags.CLASS, ...selector.classNames]
+            : [];
+    }
+}
+function parserSelectorToR3Selector(selector) {
+    const positive = parserSelectorToSimpleSelector(selector);
+    const negative = selector.notSelectors && selector.notSelectors.length
+        ? selector.notSelectors.map((notSelector) => parserSelectorToNegativeSelector(notSelector))
+        : [];
+    return positive.concat(...negative);
+}
+function parseSelectorToR3Selector(selector) {
+    return selector
+        ? CssSelector.parse(selector).map(parserSelectorToR3Selector)
+        : [];
+}
+
+function parseDirectives(component, list) {
+    let vars = 0;
+    const consts = [];
+    const directiveList = [];
+    const propertyList = [];
+    const listenerList = [];
+    const modelList = [];
+    let elementTag;
+    if (typeof component.type === 'string') {
+        elementTag = component.type;
+    }
+    else {
+        const componentDefine = reflectComponentType(component.type);
+        elementTag = component.selector ?? componentDefine.selector;
+        directiveList.push(component.type);
+    }
+    if (!elementTag) {
+        throw new Error('未找到元素对应的选择器');
+    }
+    // todo 静态attr应该改为动态的
+    const attributes = component.attributes?.();
+    if (attributes) {
+        for (const key in attributes) {
+            consts.push(key, attributes[key]);
+        }
+    }
+    const mergedList = [component, ...list];
+    for (let i = 0; i < mergedList.length; i++) {
+        const item = mergedList[i];
+        if (i > 0) {
+            directiveList.push(item.type);
+            const define = item.type['ɵdir'];
+            const selectors = define.selectors;
+            const selector = item.selector ??
+                selectors.find((selectorList) => selectorList.length === 3 &&
+                    selectorList[0] === '' &&
+                    selectorList[2] === '')[1];
+            if (((item.inputs && !(selector in item.inputs())) || !item.inputs) &&
+                ((item.model && !(selector in item.model)) || !item.model)) {
+                consts.push(selector, '');
+            }
+        }
+        if (item.inputs) {
+            propertyList[i] = { signal: item.inputs, keyList: [] };
+            for (const key in item.inputs()) {
+                vars++;
+                propertyList[i].keyList.push(key);
+            }
+        }
+        for (const key in item.outputs) {
+            listenerList.push({
+                eventName: key,
+                listenerFn: item.outputs[key],
+            });
+        }
+        for (const key in item.model) {
+            vars++;
+            modelList.push({
+                key: key,
+                eventName: `${key}Change`,
+                signal: item.model[key],
+            });
+        }
+    }
+    // packages/core/src/render3/interfaces/attribute_marker.ts
+    consts.push(3);
+    consts.push(...new Set([
+        ...listenerList.map(({ eventName }) => eventName),
+        ...modelList.map(({ eventName }) => eventName),
+    ]));
+    consts.push(...new Set([
+        ...propertyList.flatMap((item) => item.keyList),
+        ...modelList.map(({ key }) => key),
+    ]));
+    return {
+        vars,
+        consts: [['el', ''], consts],
+        directiveList,
+        propertyList: propertyList,
+        listenerList: listenerList,
+        modelList,
+        elementTag,
+    };
+}
+/** 常量不变 */
+const EL_QUERY = ['el'];
+let index = 0;
+function createDynamicComponentDefine(component, directives) {
+    const result = parseDirectives(component, directives);
+    let contentArray;
+    let contentData;
+    if (component.contents?.length) {
+        contentArray = new Array(component.contents.length).fill('*');
+        contentData;
+    }
+    function templateFn(rf, ctx) {
+        if (rf & 1) {
+            __elementStart(0, result.elementTag, 1, 0);
+            result.listenerList.reduce((fn, item) => fn(item.eventName, item.listenerFn), __listener);
+            result.modelList.reduce((fn, item) => fn(item.eventName, (value) => {
+                __twoWayBindingSet(item.signal, value);
+            }), __listener);
+            if (component.contents?.length) {
+                component.contents.forEach((item, index) => {
+                    if (item.select) {
+                        __projection(index + 2, index, [
+                            'ngProjectAs',
+                            item.select,
+                            5,
+                            parseSelectorToR3Selector(item.select)[0],
+                        ], item.text
+                            ? (rf, ctx) => {
+                                if (rf & 1) {
+                                    __text(0);
+                                }
+                                if (rf & 2) {
+                                    __textInterpolate(item.text());
+                                }
+                            }
+                            : undefined, item.text ? 1 : undefined, item.text ? 1 : undefined);
+                    }
+                    else {
+                        __projection(index + 1, index);
+                    }
+                });
+            }
+            __elementEnd();
+        }
+        if (rf & 2) {
+            result.propertyList.reduce((fn, { signal, keyList }) => {
+                const value = signal();
+                return keyList.reduce((fn, key) => fn(key, value[key]), fn);
+            }, __property);
+            result.modelList.reduce((fn, item) => fn(item.key, item.signal), __twoWayProperty);
+        }
+    }
+    return class D {
+        templateRef = viewChild.required(TemplateRef);
+        componentInstance = viewChild('el');
+        elementRef = viewChild('el', { read: ElementRef });
+        directiveRefList = directives.map(({ type }) => viewChild('el', { read: type }));
+        static ɵfac = (_) => new (_ || D)();
+        static ɵcmp = __defineComponent({
+            type: D,
+            selectors: [[`d-${index++}`]],
+            ngContentSelectors: contentArray,
+            decls: 1,
+            vars: 0,
+            consts: result.consts,
+            template: (rf, ctx) => {
+                if (rf & 1) {
+                    if (contentArray) {
+                        __projectionDef(contentArray);
+                    }
+                    __template(0, templateFn, 2 + (component.contents?.length ?? 0), result.vars, 'ng-template');
+                }
+            },
+            viewQuery: (rf, ctx) => {
+                if (rf & 1) {
+                    __viewQuerySignal(ctx.templateRef, TemplateRef, 5);
+                    __viewQuerySignal(ctx.componentInstance, EL_QUERY, 5);
+                    __viewQuerySignal(ctx.elementRef, EL_QUERY, 5, ElementRef);
+                    directives.forEach(({ type }, index) => {
+                        __viewQuerySignal(ctx.directiveRefList[index], EL_QUERY, 5, type);
+                    });
+                }
+                if (rf & 2) {
+                    __queryAdvance(3 + directives.length);
+                }
+            },
+            dependencies: result.directiveList,
+            encapsulation: 2,
+            changeDetection: 0,
+        });
+    };
+}
+
+const EmptyOBJ = {};
+class BaseComponent {
+    /** 第一次默认为空 */
+    #index = inject(PI_COMPONENT_INDEX, { optional: true });
+    /** 发射提供到下一级 */
+    #eventEmitter;
+    #componentConfig;
+    #viewContainerRef;
+    destroyComponentFn;
+    fieldComponentInstance;
+    fieldElementRef;
+    fieldDirectiveRefList;
+    /** 比较时使用 */
+    #componentCheckConfig$$;
+    #setComponentCheck(config) {
+        this.#componentCheckConfig$$ = computed(() => untracked(() => getComponentCheckConfig(config)));
+    }
+    setFieldData(field, index) {
+        this.#index = index;
+    }
+    /**
+     * 输入引用绑定
+     * 1. 上次传入的数据格式和当前一样,只触发更新
+     * 2. 上次传入的数据格式和当前不一样,直接重新创建
+     */
+    #inputCache;
+    #contentCache;
+    #configUpdate$ = signal(0);
+    createComponent(list, viewContainerRef) {
+        // 销毁
+        this.destroyComponentFn?.();
+        this.#viewContainerRef = viewContainerRef;
+        // 取消上一级的定义
+        this.#eventEmitter = new EventEmitter();
+        const componentConfig = list[this.#index];
+        this.#componentConfig = componentConfig;
+        this.#inputCache = {
+            inputs: computed(() => {
+                this.#configUpdate$();
+                return this.#componentConfig.inputs() ?? EmptyOBJ;
+            }),
+            attributes: computed(() => {
+                this.#configUpdate$();
+                return this.#componentConfig.attributes() ?? EmptyOBJ;
+            }),
+            directiveList: this.#componentConfig?.directives?.map((config, index) => config.inputs
+                ? computed(() => {
+                    this.#configUpdate$();
+                    return this.#componentConfig.directives[index].inputs();
+                })
+                : undefined),
+        };
+        this.#contentCache = componentConfig.contents?.map((item, index) => {
+            if (item.text) {
+                return {
+                    ...item,
+                    text: computed(() => {
+                        this.#configUpdate$();
+                        return this.#componentConfig.contents[index].text();
+                    }),
+                };
+            }
+            return item;
+        });
+        this.#setComponentCheck(componentConfig);
+        const SidecarComponent = createDynamicComponentDefine({
+            ...componentConfig,
+            inputs: this.#inputCache.inputs,
+            attributes: this.#inputCache.attributes,
+            contents: this.#contentCache,
+        }, componentConfig.directives?.map((config, index) => ({
+            ...config,
+            inputs: this.#inputCache.directiveList[index],
+        })) ?? []);
+        const componentInjector = Injector.create({
+            providers: [
+                { provide: PI_COMPONENT_LIST, useValue: list },
+                { provide: PI_COMPONENT_INDEX, useValue: this.#index + 1 },
+                { provide: PI_COMPONENT_LIST_LISTEN, useValue: this.#eventEmitter },
+            ],
+            parent: componentConfig.injector ?? viewContainerRef.injector,
+        });
+        const componentRef = createComponent(SidecarComponent, {
+            elementInjector: componentInjector,
+            environmentInjector: componentInjector.get(EnvironmentInjector),
+            projectableNodes: componentConfig.contents
+                ?.map(({ nodes }) => nodes)
+                .filter(Boolean),
+        });
+        // todo 这里需不需要加注入?
+        viewContainerRef.createEmbeddedView(componentRef.instance.templateRef());
+        this.fieldComponentInstance = componentRef.instance.componentInstance();
+        this.fieldElementRef = componentRef.instance.elementRef();
+        this.fieldDirectiveRefList = componentRef.instance.directiveRefList.map((item) => item());
+        this.destroyComponentFn = () => {
+            viewContainerRef.clear();
+            componentRef.destroy();
+            this.#eventEmitter.unsubscribe();
+        };
+        if (list.length === this.#index + 1) {
+            const field = componentInjector.get(PI_VIEW_FIELD_TOKEN)();
+            field.hooks?.afterCreateComponent?.(field);
+        }
+    }
+    update(list) {
+        const item = list[this.#index];
+        const currentCheckConfig = getComponentCheckConfig(item);
+        const isEqual = deepEqual(currentCheckConfig, this.#componentCheckConfig$$());
+        // this.#componentCheckConfig$$ = computed(() => currentCheckConfig);
+        if (isEqual) {
+            this.#componentConfig = item;
+            this.#configUpdate$.update((a) => a + 1);
+            // 相等不处理
+            this.#eventEmitter.next(list);
+        }
+        else {
+            this.createComponent(list, this.#viewContainerRef);
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: BaseComponent, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.0.3", type: BaseComponent, isStandalone: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: BaseComponent, decorators: [{
+            type: Directive
+        }] });
+
+class InteropNgControl extends NgControl {
+    field;
+    constructor(field) {
+        super();
+        this.field = field;
+    }
+    control = this;
+    get value() {
+        return this.field().value;
+    }
+    get valid() {
+        return this.field().valid;
+    }
+    get invalid() {
+        return !this.field().valid;
+    }
+    get pending() {
+        return false;
+    }
+    get disabled() {
+        return this.field().disabled;
+    }
+    get enabled() {
+        return !this.field().disabled;
+    }
+    get errors() {
+        const errors = this.field().errors;
+        return errors ?? null;
+    }
+    get pristine() {
+        return true;
+    }
+    get dirty() {
+        return false;
+    }
+    get touched() {
+        return this.field().touched;
+    }
+    get untouched() {
+        return !this.field().touched;
+    }
+    get submitted() {
+        return false;
+    }
+    viewToModelUpdate(newValue) { }
+    get valueChanges() {
+        return this.field().valueChanges;
+    }
+    get statusChanges() {
+        return this.field().statusChanges;
+    }
+    hasValidator(input) {
+        if (Validators.required === input) {
+            return this.field().required$$();
+        }
+        return false;
+    }
+}
+
+const formControlBinding = {
+    provide: NgControl,
+    useFactory: () => inject(FieldControlDirective).ngControl,
+};
+class FieldControlDirective {
+    fieldControl = input.required();
+    cvaArray = inject(NG_VALUE_ACCESSOR);
+    injector = inject(Injector);
+    get cva() {
+        return this.cvaArray[0];
+    }
+    #_ngControl;
+    get ngControl() {
+        return (this.#_ngControl ??= new InteropNgControl(() => this.fieldControl()));
+    }
+    ngOnInit() {
+        this.disposeList.push(createViewControlLink(this.fieldControl, this.cva, this.injector));
+    }
+    disposeList = [];
+    clear() {
+        this.disposeList.forEach((fn) => fn());
+        this.disposeList = [];
+    }
+    /** @docs-private */
+    ngOnDestroy() {
+        this.clear();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: FieldControlDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.0.3", type: FieldControlDirective, isStandalone: false, selector: "[fieldControl]", inputs: { fieldControl: { classPropertyName: "fieldControl", publicName: "fieldControl", isSignal: true, isRequired: true, transformFunction: null } }, providers: [formControlBinding], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: FieldControlDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[fieldControl]',
+                    providers: [formControlBinding],
+                    standalone: false,
+                }]
+        }] });
+
+class NgComponentOutlet extends BaseComponent {
+    /** 输入 */
+    ngComponentOutlet = input();
+    ngComponentOutletInputs = input();
+    ngComponentOutletOutputs = input();
+    ngComponentOutletInjector = input();
+    ngComponentOutletContent = input();
+    /** 控件用 */
+    ngComponentOutletFormControl = input();
+    /** 包裹用 */
+    ngComponentOutletWrappers = input();
+    ngComponentOutletTopDirectives = input();
+    ngComponentOutletDirectives = input();
+    ngComponentOutletField = input.required();
+    #viewContainerRef = inject(ViewContainerRef);
+    // 这里感觉会在非发射时出现多次输入?
+    #wrappers = computed(() => this.ngComponentOutletWrappers()?.map((item) => ({
+        ...item,
+        type: item.type.component,
+        module: item.type.module,
+    })));
+    #onputEqual$$ = computed(() => this.ngComponentOutletOutputs(), {
+        equal: deepEqual,
+    });
+    #moduleDestroy;
+    #moduleRef$$ = computed(() => {
+        this.#moduleDestroy?.();
+        const injector = this.ngComponentOutletInjector() || this.#injector;
+        const module = this.ngComponentOutlet()?.type.module;
+        if (!module) {
+            return;
+        }
+        const moduleRef = createNgModule(module, injector);
+        this.#moduleDestroy = () => {
+            moduleRef.destroy();
+            this.#moduleDestroy = undefined;
+        };
+        return moduleRef;
+    });
+    #usedEnvInjector$$ = computed(() => {
+        const injector = this.#moduleRef$$()?.injector ??
+            (this.ngComponentOutletInjector() || this.#injector);
+        return Injector.create({
+            providers: [
+                {
+                    provide: PI_VIEW_FIELD_TOKEN,
+                    useValue: this.ngComponentOutletField,
+                },
+                {
+                    provide: PI_COMPONENT_INDEX,
+                    useValue: 0,
+                },
+            ],
+            parent: injector,
+        }).get(Injector);
+    });
+    #injector = inject(Injector);
+    #formControlDirectiveConfig$$ = computed(() => {
+        const fieldControl = this.ngComponentOutletFormControl();
+        return fieldControl
+            ? {
+                type: FieldControlDirective,
+                inputs: computed(() => ({ fieldControl: fieldControl })),
+            }
+            : undefined;
+    });
+    #directiveConfigList$$ = computed(() => {
+        const directivesInputs = this.ngComponentOutletDirectives();
+        const formConfig = this.#formControlDirectiveConfig$$();
+        return formConfig
+            ? [...(directivesInputs?.() ?? []), formConfig]
+            : directivesInputs?.();
+    });
+    #componentConfig$$ = computed(() => {
+        const define = this.ngComponentOutlet();
+        if (!define) {
+            return;
+        }
+        const directives = this.#directiveConfigList$$();
+        return {
+            ...define,
+            type: define.type.component,
+            module: define.type.module,
+            inputs: this.ngComponentOutletInputs,
+            directives: directives
+                ? directives.map((item) => {
+                    const outputs = item.outputs;
+                    if (outputs) {
+                        return {
+                            ...item,
+                            outputs: outputs,
+                        };
+                    }
+                    return item;
+                })
+                : undefined,
+            outputs: this.#onputEqual$$(),
+            contents: this.ngComponentOutletContent(),
+        };
+    });
+    #componentList$$ = computed(() => {
+        const componentConfig = this.#componentConfig$$();
+        if (!componentConfig) {
+            return EMPTY_ARRAY;
+        }
+        const injector = this.#usedEnvInjector$$();
+        const list = [
+            ...(this.#wrappers() ?? []),
+            componentConfig,
+        ];
+        list[0] = { ...list[0], injector };
+        return list;
+    });
+    #lastList;
+    ngOnChanges() {
+        //todo 变更时的一些检测,相同时应该不处理
+        const list = this.#componentList$$();
+        if (!list.length) {
+            return this.destroyComponentFn?.();
+        }
+        if (!this.#lastList) {
+            const field = this.ngComponentOutletField();
+            field.hooks?.beforeCreateComponent?.(field);
+            this.setFieldData(this.ngComponentOutletField, 0);
+            this.createComponent(list, this.#viewContainerRef);
+        }
+        else if (this.#lastList !== list) {
+            this.update(list);
+        }
+        // 监听输入/输出变更,重新进行赋值
+        this.#lastList = list;
+    }
+    ngOnDestroy() {
+        this.#moduleDestroy?.();
+        this.destroyComponentFn?.();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: NgComponentOutlet, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.0.3", type: NgComponentOutlet, isStandalone: true, selector: "[ngComponentOutlet]", inputs: { ngComponentOutlet: { classPropertyName: "ngComponentOutlet", publicName: "ngComponentOutlet", isSignal: true, isRequired: false, transformFunction: null }, ngComponentOutletInputs: { classPropertyName: "ngComponentOutletInputs", publicName: "ngComponentOutletInputs", isSignal: true, isRequired: false, transformFunction: null }, ngComponentOutletOutputs: { classPropertyName: "ngComponentOutletOutputs", publicName: "ngComponentOutletOutputs", isSignal: true, isRequired: false, transformFunction: null }, ngComponentOutletInjector: { classPropertyName: "ngComponentOutletInjector", publicName: "ngComponentOutletInjector", isSignal: true, isRequired: false, transformFunction: null }, ngComponentOutletContent: { classPropertyName: "ngComponentOutletContent", publicName: "ngComponentOutletContent", isSignal: true, isRequired: false, transformFunction: null }, ngComponentOutletFormControl: { classPropertyName: "ngComponentOutletFormControl", publicName: "ngComponentOutletFormControl", isSignal: true, isRequired: false, transformFunction: null }, ngComponentOutletWrappers: { classPropertyName: "ngComponentOutletWrappers", publicName: "ngComponentOutletWrappers", isSignal: true, isRequired: false, transformFunction: null }, ngComponentOutletTopDirectives: { classPropertyName: "ngComponentOutletTopDirectives", publicName: "ngComponentOutletTopDirectives", isSignal: true, isRequired: false, transformFunction: null }, ngComponentOutletDirectives: { classPropertyName: "ngComponentOutletDirectives", publicName: "ngComponentOutletDirectives", isSignal: true, isRequired: false, transformFunction: null }, ngComponentOutletField: { classPropertyName: "ngComponentOutletField", publicName: "ngComponentOutletField", isSignal: true, isRequired: true, transformFunction: null } }, exportAs: ["ngComponentOutlet"], usesInheritance: true, usesOnChanges: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: NgComponentOutlet, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[ngComponentOutlet]',
+                    exportAs: 'ngComponentOutlet',
+                    standalone: true,
+                }]
+        }] });
+
+function isComponentType(input) {
+    return !!reflectComponentType(input);
+}
+function createAsyncCache(one, injector) {
+    const loading = new Map();
+    const cached = new Map();
+    return (list) => untracked(() => {
+        if (!list) {
+            return { value: computed(() => undefined) };
+        }
+        let hasPromise = false;
+        const result = (one ? [list] : list).map((item) => {
+            if (cached.has(item)) {
+                return cached.get(item);
+            }
+            else if (loading.has(item)) {
+                hasPromise = true;
+                return loading.get(item);
+            }
+            const resolved = item;
+            const type = resolved.type;
+            if (typeof type === 'string' || isComponentType(type)) {
+                const result = { ...resolved, type: { component: type } };
+                cached.set(item, result);
+                return result;
+            }
+            else if (typeof type === 'function') {
+                hasPromise = true;
+                const result$$ = type().then((value) => {
+                    const result = {
+                        ...resolved,
+                        type: isComponentType(value) ? { component: value } : value,
+                    };
+                    cached.set(item, result);
+                    loading.delete(item);
+                    return result;
+                });
+                loading.set(item, result$$);
+                return result$$;
+            }
+            else {
+                return resolved;
+            }
+        });
+        if (hasPromise) {
+            return resource({
+                loader: async () => (one ? result[0] : Promise.all(result)),
+                injector: injector,
+            });
+        }
+        else {
+            return {
+                value: computed(() => (one ? result[0] : result)),
+            };
+        }
+    });
+}
+
+function initListen(input, control, injector, fn) {
+    let init = true;
+    return effect(() => {
+        const modelValue = control.value$$();
+        if (init) {
+            if (!deepEqual(modelValue, input)) {
+                fn(modelValue);
+            }
+            init = false;
+        }
+        else {
+            fn(modelValue);
+        }
+    }, { injector });
+}
+
+class AngularFormBuilder extends FormBuilder {
+    #globalConfig = inject(PI_VIEW_CONFIG_TOKEN, { optional: true }) ?? undefined;
+    afterResolveConfig(rawConfig, config) {
+        const field = rawConfig;
+        const type = rawConfig.type;
+        let componentDefaultConfig;
+        let define;
+        const mergeStrategy = this.#globalConfig
+            ?.defaultConfigMergeStrategy;
+        if (type) {
+            const result = this.#resolveComponent(type);
+            define = result.define;
+            componentDefaultConfig = result.defaultConfig;
+        }
+        const directives = this.configMerge([componentDefaultConfig?.directives, field.directives], true, typeof mergeStrategy === 'string'
+            ? mergeStrategy
+            : (mergeStrategy?.directives ??
+                NG_CONFIG_DEFAULT_MERGE_STRAGEGY.directives));
+        return {
+            ...config,
+            contents: field.contents?.sort((a, b) => a.nodes && b.nodes ? 0 : a.nodes ? -1 : 1),
+            directives: directives,
+        };
+    }
+    #resolveComponent(type) {
+        let define;
+        let defaultConfig;
+        // 查引用
+        if (typeof type === 'string') {
+            const config = this.#globalConfig?.types?.[type];
+            if (!config) {
+                throw new Error(`未注册${type}`);
+            }
+            defaultConfig = config;
+            if (Object.keys(config).length) {
+                define = {
+                    ...config,
+                };
+            }
+        }
+        else {
+            // 直接使用视为独立组件,并且selector只有一个
+            define = { type };
+        }
+        return {
+            define,
+            defaultConfig,
+        };
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: AngularFormBuilder, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: AngularFormBuilder });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: AngularFormBuilder, decorators: [{
+            type: Injectable
+        }] });
+
+class NgSchemaHandle extends CoreSchemaHandle {
+    contents;
+    directives;
+}
+
+class PurePipe {
+    transform(fn, ...args) {
+        return fn(...args);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PurePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
+    static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.0.3", ngImport: i0, type: PurePipe, isStandalone: true, name: "pure" });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PurePipe, decorators: [{
+            type: Pipe,
+            args: [{
+                    name: 'pure',
+                    standalone: true,
+                }]
+        }] });
+
+const DefaultConvertOptions = {
+    builder: AngularFormBuilder,
+    handle: NgSchemaHandle,
+};
+class PiyingView {
+    schema = input.required();
+    model = input(undefined);
+    modelChange = output();
+    options = input();
+    form$$ = computed(() => this.resolvedField$()?.form.control);
+    #lastRF;
+    ngOnChanges(changes) {
+        const rFields = this.#resolvedFields$$();
+        if (this.#lastRF !== rFields || 'model' in changes) {
+            this.#modelChange$$();
+        }
+        this.#lastRF = rFields;
+    }
+    #modelChange$$ = computed(() => {
+        const model = this.model();
+        untracked(() => this.#updateField(model));
+    });
+    #resolvedFields$$ = computed(() => {
+        this.schema();
+        return untracked(() => this.#updateForm());
+    });
+    #injector = inject(Injector);
+    #envInjector = inject(EnvironmentInjector);
+    #builderEnvInjector;
+    resolvedField$ = signal(undefined);
+    #disposeList = [];
+    #updateForm() {
+        this.#clean();
+        // 临时销毁
+        const envInjector = createEnvironmentInjector([], this.#envInjector);
+        this.#builderEnvInjector = envInjector;
+        const result = convert(this.schema(), {
+            ...DefaultConvertOptions,
+            ...this.options(),
+            injector: envInjector,
+            registerOnDestroy: (fn) => {
+                envInjector.get(DestroyRef).onDestroy(() => {
+                    fn();
+                });
+            },
+        });
+        this.resolvedField$.set(result);
+        if (result.form.control) {
+            // 监听初始化,每次field变更会初始化
+            const ref = initListen(this.model(), result.form.control, 
+            // 使用envInjector会导致在测试中慢一次检查,生产上可能也会慢一点?
+            this.#injector, (value) => {
+                untracked(() => {
+                    if (result.form.control?.valueNoError$$()) {
+                        this.modelChange.emit(value);
+                    }
+                });
+            });
+            this.#disposeList.push(() => ref.destroy());
+        }
+        return result;
+    }
+    #clean(isDestoryed = false) {
+        this.#disposeList.forEach((item) => item());
+        this.#disposeList = [];
+        if (!isDestoryed && this.#builderEnvInjector) {
+            this.#builderEnvInjector.destroy();
+            this.#builderEnvInjector = undefined;
+        }
+    }
+    #updateField(model) {
+        if (!this.resolvedField$()) {
+            return;
+        }
+        const field = this.resolvedField$();
+        field.form.control?.updateValue(model);
+    }
+    groupInputsValue = (inputs, fields, fieldTemplateRef) => computed(() => ({
+        ...inputs(),
+        fields,
+        fieldTemplateRef,
+    }));
+    resolvedComponent = createAsyncCache(true, this.#injector);
+    // 这里的组件还是不准确,因为type已经改了,
+    resolvedWrapper = createAsyncCache(false, this.#injector);
+    groupHidden = (field) => computed(() => this.#groupHidden(field));
+    #groupHidden(field) {
+        if (field.fieldGroup) {
+            if (!field.fieldGroup().length) {
+                return true;
+            }
+            else {
+                return field.fieldGroup().every((field) => this.#groupHidden(field));
+            }
+        }
+        else {
+            return !field.define || !!field.renderConfig().hidden;
+        }
+    }
+    ngOnDestroy() {
+        this.#clean(true);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PiyingView, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.3", type: PiyingView, isStandalone: true, selector: "piying-view", inputs: { schema: { classPropertyName: "schema", publicName: "schema", isSignal: true, isRequired: true, transformFunction: null }, model: { classPropertyName: "model", publicName: "model", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { modelChange: "modelChange" }, usesOnChanges: true, ngImport: i0, template: "<ng-template #dynamicComponent let-field>\n  @let renderConfig = field.renderConfig();\n  @if (!renderConfig?.hidden) {\n    @let typeResource = resolvedComponent | pure: field.define;\n    @let type = typeResource.value();\n    @let wrappersResource = resolvedWrapper | pure: field.wrappers();\n    @let wrappers = wrappersResource.value();\n    @if (type) {\n      @if (field.fieldGroup) {\n        @if (!(groupHidden | pure: field)()) {\n          <!-- \u81EA\u5B9A\u4E49group -->\n          <ng-container\n            [ngComponentOutlet]=\"type\"\n            [ngComponentOutletInputs]=\"\n              (\n                groupInputsValue\n                | pure: field.inputs : field.fieldGroup() : dynamicComponent\n              )?.()\n            \"\n            [ngComponentOutletOutputs]=\"field.outputs()\"\n            [ngComponentOutletWrappers]=\"wrappers\"\n            [ngComponentOutletField]=\"field\"\n            [ngComponentOutletDirectives]=\"field.directives\"\n          ></ng-container>\n        }\n      } @else if (field.fieldArray) {\n        <!-- \u81EA\u5B9A\u4E49array -->\n        <ng-container\n          [ngComponentOutlet]=\"type\"\n          [ngComponentOutletInputs]=\"\n            (\n              groupInputsValue\n              | pure: field.inputs : field.fieldArray() : dynamicComponent\n            )?.()\n          \"\n          [ngComponentOutletOutputs]=\"field.outputs()\"\n          [ngComponentOutletWrappers]=\"wrappers\"\n          [ngComponentOutletField]=\"field\"\n          [ngComponentOutletDirectives]=\"field.directives\"\n        ></ng-container>\n      } @else {\n        <ng-container\n          [ngComponentOutlet]=\"type\"\n          [ngComponentOutletInputs]=\"field.inputs()\"\n          [ngComponentOutletOutputs]=\"field.outputs()\"\n          [ngComponentOutletFormControl]=\"$any(field.form.control)\"\n          [ngComponentOutletWrappers]=\"wrappers\"\n          [ngComponentOutletField]=\"field\"\n          [ngComponentOutletDirectives]=\"field.directives\"\n          [ngComponentOutletContent]=\"field.contents\"\n        ></ng-container>\n      }\n    }\n  }\n</ng-template>\n\n@if (resolvedField$(); as field) {\n  <ng-container\n    *ngTemplateOutlet=\"dynamicComponent; context: { $implicit: field }\"\n  ></ng-container>\n}\n", dependencies: [{ kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletOutputs", "ngComponentOutletInjector", "ngComponentOutletContent", "ngComponentOutletFormControl", "ngComponentOutletWrappers", "ngComponentOutletTopDirectives", "ngComponentOutletDirectives", "ngComponentOutletField"], exportAs: ["ngComponentOutlet"] }, { kind: "pipe", type: PurePipe, name: "pure" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PiyingView, decorators: [{
+            type: Component,
+            args: [{ selector: 'piying-view', imports: [NgComponentOutlet, PurePipe, NgTemplateOutlet], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-template #dynamicComponent let-field>\n  @let renderConfig = field.renderConfig();\n  @if (!renderConfig?.hidden) {\n    @let typeResource = resolvedComponent | pure: field.define;\n    @let type = typeResource.value();\n    @let wrappersResource = resolvedWrapper | pure: field.wrappers();\n    @let wrappers = wrappersResource.value();\n    @if (type) {\n      @if (field.fieldGroup) {\n        @if (!(groupHidden | pure: field)()) {\n          <!-- \u81EA\u5B9A\u4E49group -->\n          <ng-container\n            [ngComponentOutlet]=\"type\"\n            [ngComponentOutletInputs]=\"\n              (\n                groupInputsValue\n                | pure: field.inputs : field.fieldGroup() : dynamicComponent\n              )?.()\n            \"\n            [ngComponentOutletOutputs]=\"field.outputs()\"\n            [ngComponentOutletWrappers]=\"wrappers\"\n            [ngComponentOutletField]=\"field\"\n            [ngComponentOutletDirectives]=\"field.directives\"\n          ></ng-container>\n        }\n      } @else if (field.fieldArray) {\n        <!-- \u81EA\u5B9A\u4E49array -->\n        <ng-container\n          [ngComponentOutlet]=\"type\"\n          [ngComponentOutletInputs]=\"\n            (\n              groupInputsValue\n              | pure: field.inputs : field.fieldArray() : dynamicComponent\n            )?.()\n          \"\n          [ngComponentOutletOutputs]=\"field.outputs()\"\n          [ngComponentOutletWrappers]=\"wrappers\"\n          [ngComponentOutletField]=\"field\"\n          [ngComponentOutletDirectives]=\"field.directives\"\n        ></ng-container>\n      } @else {\n        <ng-container\n          [ngComponentOutlet]=\"type\"\n          [ngComponentOutletInputs]=\"field.inputs()\"\n          [ngComponentOutletOutputs]=\"field.outputs()\"\n          [ngComponentOutletFormControl]=\"$any(field.form.control)\"\n          [ngComponentOutletWrappers]=\"wrappers\"\n          [ngComponentOutletField]=\"field\"\n          [ngComponentOutletDirectives]=\"field.directives\"\n          [ngComponentOutletContent]=\"field.contents\"\n        ></ng-container>\n      }\n    }\n  }\n</ng-template>\n\n@if (resolvedField$(); as field) {\n  <ng-container\n    *ngTemplateOutlet=\"dynamicComponent; context: { $implicit: field }\"\n  ></ng-container>\n}\n" }]
+        }] });
+
+class PiWrapperBaseComponent extends BaseComponent {
+    fieldComponentAnchor = viewChild('fieldComponent', {
+        read: ViewContainerRef,
+    });
+    field$$ = inject(PI_VIEW_FIELD_TOKEN);
+    props$$ = computed(() => this.field$$().props());
+    #listen = inject(PI_COMPONENT_LIST_LISTEN);
+    #list = inject(PI_COMPONENT_LIST);
+    createComponent() {
+        const result = super.createComponent(this.#list, this.fieldComponentAnchor());
+        this.#listen.subscribe((list) => {
+            this.update(list);
+        });
+        return result;
+    }
+    ngOnInit() {
+        this.createComponent();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PiWrapperBaseComponent, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "20.0.3", type: PiWrapperBaseComponent, isStandalone: true, viewQueries: [{ propertyName: "fieldComponentAnchor", first: true, predicate: ["fieldComponent"], descendants: true, read: ViewContainerRef, isSignal: true }], usesInheritance: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.3", ngImport: i0, type: PiWrapperBaseComponent, decorators: [{
+            type: Directive
+        }] });
+
+const rawConfig = rawConfig$1;
+
+function setDirectives(items) {
+    return rawConfig((field) => {
+        field.directives = items;
+    });
+}
+function patchDirectives(items) {
+    return rawConfig((field) => {
+        field.directives ??= [];
+        field.directives.push(...items);
+    });
+}
+function patchAsyncDirective(fn) {
+    return rawConfig((field) => {
+        mergeHooksFn({
+            fieldResolved: (field) => {
+                field.directives ??= signal([]);
+                const directive = fn(field);
+                const inputs = directive.inputs;
+                let inputs$ = signal({});
+                if (inputs) {
+                    inputs$.set(Object.keys(inputs).reduce((obj, key) => {
+                        obj[key] = undefined;
+                        return obj;
+                    }, {}));
+                    inputs$ = asyncInputMerge(inputs, inputs$);
+                }
+                const oldDirectives = field.directives;
+                field.directives = linkedSignal(() => [
+                    ...oldDirectives(),
+                    { ...directive, inputs: inputs$ },
+                ]);
+            },
+        }, { position: 'bottom' }, field);
+    });
+}
+
+class BaseControl {
+    value$ = signal(undefined);
+    emitValue;
+    registerOnChange(fn) {
+        this.emitValue = fn;
+    }
+    /** 同时发射和value变更 */
+    valueChange(value) {
+        this.emitValue?.(value);
+        this.value$.set(value);
+    }
+    writeValue(obj) {
+        this.value$.set(obj ?? undefined);
+    }
+    #touched;
+    registerOnTouched(fn) {
+        this.#touched = fn;
+    }
+    touchedChange() {
+        this.#touched();
+    }
+    disabled$ = signal(false);
+    setDisabledState(isDisabled) {
+        this.disabled$.set(isDisabled);
+    }
+}
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { AngularFormBuilder, BaseControl, NgSchemaHandle, PI_COMPONENT_INDEX, PI_COMPONENT_LIST, PI_COMPONENT_LIST_LISTEN, PI_VIEW_FIELD_TOKEN, PiWrapperBaseComponent, PiyingView, PiyingViewGroup, PiyingViewGroupBase, patchAsyncDirective, patchDirectives, rawConfig, setDirectives };
+//# sourceMappingURL=piying-view-angular.mjs.map