@arcgis/core/widgets/Feature/FeatureRelationship.js

ArcGIS Maps SDK for JavaScript: A complete 2D and 3D mapping and data visualization API

/*
All material copyright ESRI, All Rights Reserved, unless otherwise specified.
See https://js.arcgis.com/4.33/esri/copyright.txt for details.
*/
import{_ as e}from"../../chunks/tslib.es6.js";import"../../intl.js";import{destroyMaybe as t}from"../../core/maybe.js";import{after as s}from"../../core/promiseUtils.js";import{watch as i,on as r,initial as o}from"../../core/reactiveUtils.js";import{stripHTML as n}from"../../core/string.js";import{property as l}from"../../core/accessorSupport/decorators/property.js";import{cast as a}from"../../core/accessorSupport/decorators/cast.js";import"../../core/has.js";import"../../core/RandomLCG.js";import{subclass as d}from"../../core/accessorSupport/decorators/subclass.js";import c from"../Widget.js";import u from"./FeatureRelationship/FeatureRelationshipViewModel.js";import h from"./support/FeatureElementInfo.js";import{loadCalciteComponents as p}from"../support/componentsUtils.js";import{globalCss as m}from"../support/globalCss.js";import{isRTL as v}from"../support/widgetUtils.js";import{messageBundle as w}from"../support/decorators/messageBundle.js";import{tsx as _}from"../support/jsxFactory.js";import{substitute as f}from"../../intl/substitute.js";import{formatNumber as g}from"../../intl/number.js";var b;const y="esri-feature",I=`${y}-relationship`,F={base:I,listContainer:`${I}__list`,listItem:`${I}__list-item`,listItemHidden:`${I}__list-item--hidden`,listContainerQuerying:`${I}__list--querying`,featureObserver:`${y}__feature-observer`,stickySpinnerContainer:`${y}__sticky-loading-container`,loadingSpinnerContainer:`${y}__loading-container`},C={title:!0,description:!0};let M=b=class extends c{constructor(e,t){super(e,t),this._featureElementInfo=null,this._relatedFeatureIntersectionObserverNode=null,this._relatedFeatureIntersectionObserver=new IntersectionObserver((([e])=>{e?.isIntersecting&&this._increaseFeaturePage()}),{root:window.document}),this.flowItems=null,this.flowType="feature-relationship",this.headingLevel=2,this.viewModel=new u,this.messages=null,this.messagesCommon=null,this.visibleElements={...C},this._increaseFeaturePage=()=>{const{state:e,showAllEnabled:t,relatedFeatures:s,featuresPerPage:i,featurePage:r}=this.viewModel;"ready"===e&&t&&s.length>=i*r&&this.viewModel.featurePage++}}initialize(){this._featureElementInfo=new h,this.addHandles([i((()=>[this.viewModel.description,this.viewModel.title,this.headingLevel]),(()=>this._setupFeatureElementInfo()),o),i((()=>[this.viewModel.state,this.viewModel.showAllEnabled,this._relatedFeatureIntersectionObserverNode]),(()=>this._handleRelatedFeatureObserverChange())),r((()=>this.viewModel.relatedFeatureViewModels),"change",(()=>this._setupRelatedFeatureViewModels()))])}loadDependencies(){return p({chip:()=>import("@esri/calcite-components/dist/components/calcite-chip"),icon:()=>import("@esri/calcite-components/dist/components/calcite-icon"),list:()=>import("@esri/calcite-components/dist/components/calcite-list"),"list-item":()=>import("@esri/calcite-components/dist/components/calcite-list-item"),loader:()=>import("@esri/calcite-components/dist/components/calcite-loader"),notice:()=>import("@esri/calcite-components/dist/components/calcite-notice")})}destroy(){this._unobserveRelatedFeatureObserver(),this._featureElementInfo=t(this._featureElementInfo)}get displayShowAllButton(){const{showAllEnabled:e,featureCount:t,displayCount:s,state:i,allCategoriesCount:r}=this.viewModel;return!e&&"ready"===i&&(!!r&&(r>s||0===s)||!!t&&(t>s||0===s))}get displayListItems(){const{relatedFeatureViewModels:e,allCategoriesCount:t}=this.viewModel;return this.displayShowAllButton||!!e.length||!!t}get allItemsDescription(){const{messages:e}=this,{featureCount:t,allCategories:s,allCategoriesCount:i}=this.viewModel;return f(e?.numberRecords,{number:g(s?i:t)})}get description(){return this.viewModel.description}set description(e){this.viewModel.description=e}get title(){const{activeCategory:e,title:t}=this.viewModel;return e?.name??t}set title(e){this.viewModel.title=e}castVisibleElements(e){return{...C,...e}}render(){const{state:e}=this.viewModel;return _("div",{class:this.classes(F.base,m.widget)},this._featureElementInfo?.render(),"loading"===e?this._renderLoading():"disabled"===e?this._renderRelationshipNotFound():this._renderRelatedFeatures())}async _selectCategory(e){const{flowItems:t,featureVisibleElements:s,viewModel:i}=this;t&&(i.activeCategory=e,i.showAllEnabled=!0,t.push(new b({flowItems:t,featureVisibleElements:s,visibleElements:{title:!1,description:!1},viewModel:i})))}async _selectRecord(e){const{flowItems:t,featureVisibleElements:s}=this;if(!t)return;e.abilities={relationshipContent:!0};const{default:i}=await import("../Feature.js");t.push(new i({flowItems:t,flowType:this.flowType,viewModel:e,visibleElements:s}))}_showAllRecords(){const{flowItems:e}=this;if(!e)return;const{viewModel:t,featureVisibleElements:s}=this;t.showAllEnabled=!0;const i=new b({flowItems:e,featureVisibleElements:s,visibleElements:{title:!1,description:!1},viewModel:t});e.push(i)}_renderStickyLoading(){return"querying"===this.viewModel.state?_("div",{class:F.stickySpinnerContainer,key:"sticky-loader"},this._renderLoadingIcon()):null}_renderLoadingIcon(){return _("calcite-loader",{inline:!0,label:""})}_renderLoading(){return _("div",{class:F.loadingSpinnerContainer,key:"loading-container"},this._renderLoadingIcon())}_renderShowAllIconNode(){return _("calcite-icon",{icon:"list",scale:"s",slot:"content-end"})}_renderChevronIconNode(){const e=v(this.container)?"chevron-left":"chevron-right";return _("calcite-icon",{icon:e,scale:"s",slot:"content-end"})}_renderCategory(e){const{count:t,name:s,value:i}=e,r=g(t);return _("calcite-list-item",{class:F.listItem,disabled:!t,key:i,label:s,onCalciteListItemSelect:()=>this._selectCategory(e)},_("calcite-chip",{label:r,scale:"s",slot:"content-end"},r),this._renderChevronIconNode())}_renderRelatedFeature(e){const{itemDescriptionFieldName:t}=this.viewModel,s=e.title;e.description=t&&e.formattedAttributes?.global[t];const i="loading"===e.state;return _("calcite-list-item",{class:this.classes(F.listItem,{[F.listItemHidden]:i}),description:n(e.description??""),key:e.uid,label:n(s),onCalciteListItemSelect:()=>this._selectRecord(e)},this._renderChevronIconNode())}_renderShowAllListItem(){return this.displayShowAllButton?_("calcite-list-item",{description:this.allItemsDescription,key:"show-all-item",label:this.messages?.showAll,onCalciteListItemSelect:()=>this._showAllRecords()},this._renderShowAllIconNode()):null}_renderNoRelatedFeaturesMessage(){return _("calcite-notice",{icon:"information",key:"no-related-features-message",kind:"brand",open:!0,scale:"s",width:"full"},_("div",{slot:"message"},this.messages?.noRelatedFeatures))}_renderFeatureObserver(){return _("div",{afterCreate:this._relatedFeatureIntersectionObserverCreated,bind:this,class:F.featureObserver,key:"feature-observer"})}_renderList(){const{relatedFeatureViewModels:e,categories:t}=this.viewModel;return _("calcite-list",{displayMode:"flat",label:this.messages?.relatedFeaturesList},t?.map((e=>this._renderCategory(e)))??e.toArray().map((e=>this._renderRelatedFeature(e))),this._renderShowAllListItem())}_renderRelatedFeatures(){const{displayListItems:e}=this,{state:t}=this.viewModel;return _("div",{class:this.classes(F.listContainer,{[F.listContainerQuerying]:"querying"===t}),key:"list-container"},e?this._renderList():"ready"===t?this._renderNoRelatedFeaturesMessage():null,this._renderStickyLoading(),this._renderFeatureObserver())}_renderRelationshipNotFound(){return _("calcite-notice",{icon:"exclamation-mark-triangle",key:"relationship-not-found",kind:"danger",open:!0,scale:"s",width:"full"},_("div",{slot:"message"},this.messages?.relationshipNotFound))}_setupRelatedFeatureViewModels(){const{relatedFeatureViewModels:e}=this.viewModel,t="related-feature-viewmodels";this.removeHandles(t),e?.forEach((e=>{this.addHandles(i((()=>[e.title,e.state]),(()=>this.scheduleRender()),o),t)})),this.scheduleRender()}_setupFeatureElementInfo(){const{headingLevel:e,visibleElements:t}=this,s=t.description&&this.description,i=t.title&&this.title;this._featureElementInfo?.set({description:s,title:i,headingLevel:e})}async _handleRelatedFeatureObserverChange(){this._unobserveRelatedFeatureObserver();const{state:e,showAllEnabled:t}=this.viewModel;await s(0),this._relatedFeatureIntersectionObserverNode&&"ready"===e&&t&&this._relatedFeatureIntersectionObserver.observe(this._relatedFeatureIntersectionObserverNode)}_relatedFeatureIntersectionObserverCreated(e){this._relatedFeatureIntersectionObserverNode=e}_unobserveRelatedFeatureObserver(){this._relatedFeatureIntersectionObserverNode&&this._relatedFeatureIntersectionObserver.unobserve(this._relatedFeatureIntersectionObserverNode)}};e([l()],M.prototype,"_relatedFeatureIntersectionObserverNode",void 0),e([l({readOnly:!0})],M.prototype,"displayShowAllButton",null),e([l({readOnly:!0})],M.prototype,"displayListItems",null),e([l({readOnly:!0})],M.prototype,"allItemsDescription",null),e([l()],M.prototype,"description",null),e([l()],M.prototype,"featureVisibleElements",void 0),e([l()],M.prototype,"flowItems",void 0),e([l()],M.prototype,"flowType",void 0),e([l()],M.prototype,"headingLevel",void 0),e([l()],M.prototype,"title",null),e([l({type:u})],M.prototype,"viewModel",void 0),e([l(),w("esri/widgets/Feature/t9n/Feature")],M.prototype,"messages",void 0),e([l(),w("esri/t9n/common")],M.prototype,"messagesCommon",void 0),e([l()],M.prototype,"visibleElements",void 0),e([a("visibleElements")],M.prototype,"castVisibleElements",null),M=b=e([d("esri.widgets.Feature.FeatureRelationship")],M);export{M as default};