@arcgis/map-components 4.34.0-next.50 → 4.34.0-next.51

package/dist/components/arcgis-feature/customElement.d.ts

@@ -1,154 +1,238 @@
 /// <reference types="@arcgis/core/interfaces.d.ts" />
 /// <reference types="../../index.d.ts" />
-import { Use } from '@arcgis/lumina/controllers';
-import { default as Feature } from '@arcgis/core/widgets/Feature.js';
-import { PublicLitElement as LitElement, TargetedEvent } from '@arcgis/lumina';
+import { default as FeatureViewModel } from '@arcgis/core/widgets/Feature/FeatureViewModel.js';
 import { ArcgisReferenceElement } from '../../utils/component-utils';
+import { HeadingLevel } from '../../support/heading';
+import { Nil } from '@arcgis/components-utils';
+import { Use } from '@arcgis/lumina/controllers';
+import { JsxNode, PublicLitElement as LitElement, TargetedEvent } from '@arcgis/lumina';
+import { ArcgisFeatureContent } from '../arcgis-feature-content/customElement.js';
+import { ArcgisFeatureAttachments } from '../arcgis-feature-attachments/customElement.js';
+import { ArcgisFeatureExpression } from '../arcgis-feature-expression/customElement.js';
+import { ArcgisFeatureFields } from '../arcgis-feature-fields/customElement.js';
+import { ArcgisFeatureMedia } from '../arcgis-feature-media/customElement.js';
+export type FlowItemType = "feature-association" | "feature-relationship" | "feature-utility-network-association-type" | "feature-utility-network-associations" | "feature";
+export type FlowItemComponent = ArcgisFeature | ArcgisFeatureAttachments | ArcgisFeatureContent | ArcgisFeatureExpression | ArcgisFeatureFields | ArcgisFeatureMedia;
 
-declare const useFeatureWidget: (component: LitElement & Pick<Feature, "icon" | "label" | "viewModel" | "map" | "spatialReference" | "timeZone" | "headingLevel" | "graphic" | "defaultPopupTemplateEnabled" | "location"> & {
-    state?: unknown;
-    viewModel?: __esri.FeatureViewModel | undefined;
-    closed?: boolean;
-    icon: import('@arcgis/components-utils').Nil | string;
-    label: import('@arcgis/components-utils').Nil | string;
+declare const useFeatureViewModel: (component: LitElement & Pick<FeatureViewModel, never> & import('../../controllers/useViewModel').ViewModelControllerUses<FeatureViewModel>) => FeatureViewModel;
+/** [Read more...](https://developers.arcgis.com/javascript/latest/references/map-components/arcgis-feature/) */
+export declare class ArcgisFeature extends LitElement {
     referenceElement?: ArcgisReferenceElement | string;
+    /** @default "top-left" */
     position: __esri.UIPosition;
-    arcgisReady: import('@arcgis/lumina').EventEmitter;
-    arcgisPropertyChange: import('@arcgis/lumina').EventEmitter<{
-        name: string;
-    }> | undefined;
-    el: HTMLElement & {
-        childElem?: HTMLElement & {
-            ownedBy?: HTMLElement;
-        };
-        view?: __esri.LinkChartView | __esri.MapView | __esri.SceneView;
-    };
-    autoDestroyDisabled: boolean;
-    destroy: () => Promise<void>;
-}) => Feature;
-/**
- * The Feature component displays a graphic according to its [PopupTemplate](https://developers.arcgis.com/javascript/latest/api-reference/esri-PopupTemplate.html). This component is useful in instances where you want to display information about a feature but without the use of a [Popup](https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-Popup.html).
- *
- * [Read more...](https://developers.arcgis.com/javascript/latest/references/map-components/arcgis-feature/)
- */
-export declare class ArcgisFeature extends LitElement {
     /**
-     * If true, the component will not be destroyed automatically when it is
-     * disconnected from the document. This is useful when you want to move the
-     * component to a different place on the page, or temporarily hide it. If this
-     * is set, make sure to call the [destroy](https://developers.arcgis.com/javascript/latest/references/map-components/arcgis-feature/#destroy) method when you are done to
-     * prevent memory leaks.
+     * Icon which represents the component.
+     * Typically used when the component is controlled by another component (e.g. by the Expand component).
      *
-     * @default false
+     * @see [Calcite Icons](https://developers.arcgis.com/calcite-design-system/icons/)
+     * @default "icon"
      */
-    autoDestroyDisabled: boolean;
+    icon?: string;
+    /**
+     * The [Graphic](https://developers.arcgis.com/javascript/latest/api-reference/esri-Graphic.html) used to represent the feature.
+     *
+     * @autocast
+     * @see [PopupTemplate.content](esri-PopupTemplate.html#content)
+     * @example
+     * let graphic = new Graphic({
+     *   geometry: view.center,
+     *   attributes: {
+     *     "name": "Spruce",
+     *     "family": "Pinaceae",
+     *     "count": 126
+     *   },
+     *   symbol: new SimpleMarkerSymbol({
+     *     style: "square",
+     *     color: "blue",
+     *     size: "8px"
+     *   }),
+     *   popupTemplate: {
+     *     content: [
+     *       {
+     *         // Set popup template content
+     *       }
+     *     ]
+     *   }
+     * });
+     * @default null
+     */
+    graphic: nullish | __esri.Graphic;
     /**
      * Enables automatic creation of a popup template for layers that have popups enabled but no
-     * popupTemplate defined.
+     * popupTemplate defined. Automatic popup templates are supported for layers that
+     * support the `createPopupTemplate` method. (Supported for
+     * [FeatureLayer](https://developers.arcgis.com/javascript/latest/api-reference/esri-layers-FeatureLayer.html),
+     * [GeoJSONLayer](https://developers.arcgis.com/javascript/latest/api-reference/esri-layers-GeoJSONLayer.html),
+     * [SceneLayer](https://developers.arcgis.com/javascript/latest/api-reference/esri-layers-SceneLayer.html),
+     * [CSVLayer](https://developers.arcgis.com/javascript/latest/api-reference/esri-layers-CSVLayer.html),
+     * [OGCFeatureLayer](https://developers.arcgis.com/javascript/latest/api-reference/esri-layers-OGCFeatureLayer.html)
+     * [PointCloudLayer](https://developers.arcgis.com/javascript/latest/api-reference/esri-layers-PointCloudLayer.html),
+     * [StreamLayer](https://developers.arcgis.com/javascript/latest/api-reference/esri-layers-StreamLayer.html), and
+     * [ImageryLayer](https://developers.arcgis.com/javascript/latest/api-reference/esri-layers-ImageryLayer.html)).
+     *
+     * ::: esri-md class="warning"
+     * Starting with version 4.28, `date` fields are formatted using the `short-date-short-time` preset [dateFormat](https://developers.arcgis.com/javascript/latest/api-reference/esri-popup-support-FieldInfoFormat.html#dateFormat)
+     * rather than `long-month-day-year` in default [popup](https://developers.arcgis.com/javascript/latest/api-reference/esri-PopupTemplate.html) created by setting the `defaultPopupTemplateEnabled` property to `true`.
+     * For example, previously a date that may have appeared as `"December 30, 1997"` will now appear as `"12/30/1997 6:00 PM"`.
+     * :::
      *
      * @default false
      */
     defaultPopupTemplateEnabled: boolean;
     /**
-     * The [Graphic](https://developers.arcgis.com/javascript/latest/api-reference/esri-Graphic.html) used to represent the feature.
+     * Indicates the heading level to use for the [title](#title) of the feature widget.
+     * By default, the title is rendered
+     * as a level 2 heading (e.g. `<h2>Title of content</h2>`). Depending on the widget's placement
+     * in your app, you may need to adjust this heading for proper semantics. This is
+     * important for meeting accessibility standards.
      *
+     * @see [Heading Elements](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/Heading_Elements)
+     * @example
+     * // feature title will render as an <h3>
+     * feature.headingLevel = 3;
+     * @default 2
+     */
+    headingLevel: HeadingLevel;
+    /**
+     * The spatial reference used for [Arcade](https://developers.arcgis.com/arcade) operations.
+     * This property should be set if the Feature widget executes Arcade expressions that contain [geometry functions](https://developers.arcgis.com/arcade/function-reference/geometry_functions/).
+     *
+     * @autocast
+     * @see [Type system](https://developers.arcgis.com/arcade/guide/types/#featuresetcollection)
+     * @see [Arcade Profiles: Popup](https://developers.arcgis.com/arcade/profiles/popup/)
      * @default null
      */
-    graphic: nullish | __esri.Graphic;
+    spatialReference: nullish | __esri.SpatialReference;
     /**
-     * Indicates the heading level to use for the [title](https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-Feature.html#title) of the feature widget.
+     * Dates and times displayed in the widget will be displayed in this time zone. By default this time zone is
+     * inherited from [MapView.timeZone](https://developers.arcgis.com/javascript/latest/api-reference/esri-views-MapView.html#timeZone). When a MapView is not associated with the widget
+     * then the property will fallback to the `system` time zone.
      *
-     * @default 2
+     * **Possible Values**
+     *
+     * Value | Description |
+     * ----- | ----------- |
+     * system  | Dates and times will be displayed in the timezone of the device or browser.
+     * unknown | Dates and time are not adjusted for any timezone.
+     * Specified IANA timezone | Dates and times will be displayed in the specified IANA time zone. See [wikipedia - List of tz database time zones](https://en.wikipedia.org/wiki/List_of_tz_database_time_zones).
      */
-    headingLevel: number;
+    timeZone: string;
     /**
-     * Indicates whether to hide all [AttachmentsContent](https://developers.arcgis.com/javascript/latest/api-reference/esri-popup-content-AttachmentsContent.html).
+     * The title for the feature. You can disable this via the [visibleElements](#visibleElements) property.
      *
-     * @default false
+     * @see [headingLevel](#headingLevel)
+     * @default null
+     */
+    readonly heading: string;
+    /**
+     * A map is required when the input [graphic](#graphic) has a popupTemplate that contains [Arcade](https://developers.arcgis.com/arcade) expressions in [ExpressionInfo](https://developers.arcgis.com/javascript/latest/api-reference/esri-popup-ExpressionInfo.html) or [ExpressionContent](https://developers.arcgis.com/javascript/latest/api-reference/esri-popup-content-ExpressionContent.html) that may use the `$map` profile variable to access data from layers within a map. Without a map, expressions that use `$map` will throw an error.
+     *
+     * Alternatively, the [view](#view) property can be used to provide the map instance for this property.
+     *
+     * @noautocast
+     * @see [Type system](https://developers.arcgis.com/arcade/guide/types/#featuresetcollection)
+     * @see [Arcade Profiles: Popup](https://developers.arcgis.com/arcade/profiles/popup/)
+     * @example
+     * // The building footprints represent the buildings that intersect a clicked parcel
+     * let buildingFootprints = Intersects($feature, FeatureSetByName($map, "Building Footprints"));
+     * @default null
      */
-    hideContentAttachments: boolean | undefined;
+    map: __esri.Map | nullish;
     /**
-     * Indicates whether to hide all [ExpressionContent](https://developers.arcgis.com/javascript/latest/api-reference/esri-popup-content-ExpressionContent.html).
+     * Disables chart animation
      *
      * @default false
      */
-    hideContentExpression: boolean | undefined;
+    chartAnimationDisabled: boolean | undefined;
     /**
-     * Indicates whether to hide all [FieldsContent](https://developers.arcgis.com/javascript/latest/api-reference/esri-popup-content-FieldsContent.html).
+     * This property provides the ability to turn individual elements of the component's display on/off.
      *
      * @default false
      */
-    hideContentFields: boolean | undefined;
+    hideHeading: boolean;
     /**
-     * Indicates whether to hide all [MediaContent](https://developers.arcgis.com/javascript/latest/api-reference/esri-popup-content-MediaContent.html).
+     * This property provides the ability to turn individual elements of the component's display on/off.
      *
      * @default false
      */
-    hideContentMedia: boolean | undefined;
+    hideContent: boolean;
     /**
-     * Indicates whether to hide all [TextContent](https://developers.arcgis.com/javascript/latest/api-reference/esri-popup-content-TextContent.html).
+     * This property provides the ability to turn individual elements of the component's display on/off.
      *
      * @default false
      */
-    hideContentText: boolean | undefined;
+    hideAttachmentsContent: boolean;
     /**
-     * @deprecated since 4.33, use [hideLastEditedInfo](#hideLastEditedInfo) instead.
+     * This property provides the ability to turn individual elements of the component's display on/off.
+     *
      * @default false
      */
-    hideLastEditInfo: boolean | undefined;
+    hideCustomContent: boolean;
     /**
-     * Indicates whether to hide the [lastEditInfo](https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-Feature-FeatureViewModel.html#lastEditInfo).
+     * This property provides the ability to turn individual elements of the component's display on/off.
      *
      * @default false
      */
-    hideLastEditedInfo: boolean | undefined;
+    hideExpressionContent: boolean;
     /**
-     * Indicates whether to hide the title associated with the feature.
+     * This property provides the ability to turn individual elements of the component's display on/off.
      *
      * @default false
      */
-    hideTitle: boolean | undefined;
+    hideFieldsContent: boolean;
     /**
-     * Icon which represents the widget.
+     * This property provides the ability to turn individual elements of the component's display on/off.
      *
-     * @see [Calcite Icons](https://developers.arcgis.com/calcite-design-system/icons/)
-     * @default "polygon"
+     * @default false
      */
-    icon: string;
+    hideMediaContent: boolean;
     /**
-     * The widget's default label.
+     * This property provides the ability to turn individual elements of the component's display on/off.
      *
-     * [Read more...](https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-Feature.html#label)
+     * @default false
      */
-    label: string;
+    showRelationshipContent: boolean;
     /**
-     * The location of the graphic to be displayed.
+     * This property provides the ability to turn individual elements of the component's display on/off.
      *
-     * [Read more...](https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-Feature.html#location)
+     * @default false
+     */
+    hideTextContent: boolean;
+    /**
+     * This property provides the ability to turn individual elements of the component's display on/off.
      *
-     * @default null
+     * @default false
      */
-    location: nullish | __esri.Point;
+    showUtilityNetworkContent: boolean;
     /**
-     * A map is required when the input [graphic](https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-Feature.html#graphic) has a popupTemplate that contains [Arcade](https://developers.arcgis.com/arcade) expressions in [ExpressionInfo](https://developers.arcgis.com/javascript/latest/api-reference/esri-popup-ExpressionInfo.html) or [ExpressionContent](https://developers.arcgis.com/javascript/latest/api-reference/esri-popup-content-ExpressionContent.html) that may use the `$map` profile variable to access data from layers within a map.
+     * This property provides the ability to turn individual elements of the component's display on/off.
      *
-     * @default null
+     * @default false
      */
-    map: __esri.Map | nullish;
-    /** @default "bottom-left" */
-    position: __esri.UIPosition;
+    hideLastEditedInfo: boolean;
     /**
-     * By assigning the `id` attribute of the Map or Scene component to this property, you can position a child component anywhere in the DOM while still maintaining a connection to the Map or Scene.
+     * If true, the component will not be destroyed automatically when it is
+     * disconnected from the document. This is useful when you want to move the
+     * component to a different place on the page, or temporarily hide it. If this
+     * is set, make sure to call the [destroy](https://developers.arcgis.com/javascript/latest/references/map-components/arcgis-feature/#destroy) method when you are done to
+     * prevent memory leaks.
      *
-     * @see [Associate components with a Map or Scene component](https://developers.arcgis.com/javascript/latest/programming-patterns/#associate-components-with-a-map-or-scene-component)
+     * @default false
      */
-    referenceElement?: ArcgisReferenceElement | string;
+    autoDestroyDisabled: boolean;
+    /** Overwrite localized strings for this component */
+    messageOverrides?: typeof this.messages._overrides;
+    /** The component's default label. */
+    label?: string;
     /**
-     * The spatial reference used for [Arcade](https://developers.arcgis.com/arcade) operations.
+     * The [Point](https://developers.arcgis.com/javascript/latest/api-reference/esri-geometry-Point.html) representing the location of the
+     * [MapView](https://developers.arcgis.com/javascript/latest/api-reference/esri-views-MapView.html) interaction used to trigger the opening of the widget.
+     *
+     * [Read more...](https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-Feature-FeatureViewModel.html#location)
      *
      * @default null
      */
-    spatialReference: nullish | __esri.SpatialReference;
+    location: nullish | __esri.Point;
     /**
      * The view model's state.
      *
@@ -157,22 +241,24 @@ export declare class ArcgisFeature extends LitElement {
      * @default "disabled"
      */
     readonly state: "ready" | "loading" | "disabled" | "error";
-    /**
-     * Dates and times displayed in the widget will be displayed in this time zone.
-     *
-     * [Read more...](https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-Feature.html#timeZone)
-     */
-    timeZone: string;
     /** Permanently destroy the component. */
     destroy(): Promise<void>;
-    /** Paginates to the next [media info](https://developers.arcgis.com/javascript/latest/api-reference/esri-popup-content-MediaContent.html#mediaInfos). */
+    /** Paginates to the next [media](esri-popup-content-MediaContent.html) info. */
     nextMedia(contentElementIndex: number): Promise<void>;
-    /** Paginates to the previous [media info](https://developers.arcgis.com/javascript/latest/api-reference/esri-popup-content-MediaContent.html#mediaInfos). */
+    /**
+     * Paginates to the previous [media](esri-popup-content-MediaContent.html) info in the specified
+     * [media](esri-popup-content-MediaContent.html) content element.
+     */
     previousMedia(contentElementIndex: number): Promise<void>;
     /**
-     * Paginates to a specified [media info](https://developers.arcgis.com/javascript/latest/api-reference/esri-popup-content-MediaContent.html#mediaInfos) object.
-     * For example, you may have [media content](https://developers.arcgis.com/javascript/latest/api-reference/esri-popup-content-MediaContent.html#mediaInfos) which contains multiple mediaInfos.
-     * This method allows you to specify the index of the mediaInfos you wish to display.
+     * Paginates to a specified [media](esri-popup-content-MediaContent.html) info object. For example,
+     * you may have [media](esri-popup-content-MediaContent.html) content which contains
+     * multiple `mediaInfos`. This method allows you to specify the index of the `mediaInfos`
+     * you wish to display.
+     *
+     * ::: esri-md class="warning"
+     * Prior to   version 4.17, this method was named `goToMedia`.
+     * :::
      */
     setActiveMedia(contentElementIndex: number, mediaInfoIndex: number): Promise<void>;
     /** Emitted when the value of a property is changed. Use this to listen to changes to properties. */
@@ -181,5 +267,6 @@ export declare class ArcgisFeature extends LitElement {
     }>;
     /** Emitted when the component associated with a map or scene view is is ready to be interacted with. */
     readonly arcgisReady: TargetedEvent<this, void>;
+    private messages;
 }
 export {};

package/dist/components/arcgis-feature/customElement.js

@@ -1,41 +1,211 @@
-import { c as i } from "../../chunks/runtime.js";
-import { usePropertyChange as s } from "@arcgis/lumina/controllers";
-import a from "@arcgis/core/widgets/Feature.js";
-import { LitElement as n, createEvent as o, noShadowRoot as d } from "@arcgis/lumina";
-import { m as h } from "../../chunks/useWidget.js";
-import { css as l } from "lit";
-import { u as r } from "../../chunks/useT9n.js";
+import { c as w } from "../../chunks/runtime.js";
+import { css as M, html as a } from "lit";
+import _ from "@arcgis/core/widgets/Feature/FeatureViewModel.js";
+import { g as C } from "../../chunks/globalCss.js";
+import { u as b } from "../../chunks/useT9n.js";
+import { H as x } from "../../chunks/heading.js";
+import { classes as y } from "@arcgis/components-utils";
+import { usePropertyChange as I } from "@arcgis/lumina/controllers";
+import { m as L } from "../../chunks/useViewModel.js";
+import { LitElement as T, createEvent as A, noShadowRoot as E, safeClassMap as l } from "@arcgis/lumina";
+import { substitute as k } from "@arcgis/core/intl.js";
+import { renderingSanitizer as F } from "@arcgis/core/applications/Components/sanitizerUtils.js";
+import { k as R, l as V, m as z, n as D, s as c, c as H, i as P } from "../../chunks/feature-utils.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.34/esri/copyright.txt for details.
-v4.34.0-next.50 */
-const c = l`@layer{arcgis-feature{display:block}}`, m = h(a);
-class p extends n {
+v4.34.0-next.51 */
+const S = M`@layer{arcgis-feature{display:block}.arcgis-feature{--calcite-color-background: var(--calcite-color-background);width:100%}.arcgis-feature__title{display:block;word-break:break-word;word-wrap:break-word;font-size:var(--calcite-font-size)}.arcgis-feature calcite-icon{box-sizing:content-box}.arcgis-feature__loading-container{display:flex;justify-content:center;padding:var(--calcite-spacing-md) 0;width:100%}.arcgis-feature__content-element{margin-bottom:var(--calcite-spacing-xxl);padding:0 var(--calcite-spacing-sm);display:flex;flex-direction:column}.arcgis-feature__content-element:only-child{margin-bottom:var(--calcite-spacing-xxs)}.arcgis-feature__last-edited-info{padding-top:var(--calcite-spacing-xs);font-size:var(--calcite-font-size-sm)}}`, h = "arcgis-feature", r = {
+  // popup renderer
+  base: h,
+  // containers and content
+  container: `${h}__size-container`,
+  title: `${h}__title`,
+  main: `${h}__main-container`,
+  contentElement: `${h}__content-element`,
+  lastEditedInfo: `${h}__last-edited-info`,
+  // loading
+  loadingSpinnerContainer: `${h}__loading-container`
+}, U = L(_);
+class Z extends T {
   constructor() {
-    super(...arguments), this.messages = r(), this.widget = m(this), this.viewModel = this.widget.viewModel, this.autoDestroyDisabled = !1, this.defaultPopupTemplateEnabled = this.widget.defaultPopupTemplateEnabled, this.graphic = this.widget.graphic, this.headingLevel = this.widget.headingLevel, this.hideContentAttachments = this.widget.visibleElements.content.attachments, this.hideContentExpression = this.widget.visibleElements.content.expression, this.hideContentFields = this.widget.visibleElements.content.fields, this.hideContentMedia = this.widget.visibleElements.content.media, this.hideContentText = this.widget.visibleElements.content.text, this.hideLastEditInfo = this.widget.visibleElements.lastEditedInfo, this.hideLastEditedInfo = this.widget.visibleElements.lastEditedInfo, this.hideTitle = this.widget.visibleElements.title, this.icon = this.widget.icon, this.label = this.widget.label, this.location = this.viewModel.location, this.map = this.widget.map, this.position = "bottom-left", this.spatialReference = this.widget.spatialReference, this.state = this.viewModel.state, this.timeZone = this.widget.timeZone, this.arcgisPropertyChange = s()("state"), this.arcgisReady = o();
+    super(...arguments), this.messages = b({}), this.viewModel = U(this), this.flowType = "feature", this.flowItems = null, this.position = "top-left", this.icon = "icon", this.graphic = this.viewModel.graphic, this.defaultPopupTemplateEnabled = this.viewModel.defaultPopupTemplateEnabled, this.headingLevel = 2, this.spatialReference = this.viewModel.spatialReference, this.timeZone = this.viewModel.timeZone, this.heading = this.viewModel.title, this.map = this.viewModel.map, this.chartAnimationDisabled = this.viewModel.abilities.chartAnimation, this.hideHeading = !1, this.hideContent = !1, this.hideAttachmentsContent = !1, this.hideCustomContent = !1, this.hideExpressionContent = !1, this.hideFieldsContent = !1, this.hideMediaContent = !1, this.showRelationshipContent = !1, this.hideTextContent = !1, this.showUtilityNetworkContent = !1, this.hideLastEditedInfo = !1, this.autoDestroyDisabled = !1, this.location = this.viewModel.location, this.state = this.viewModel.state, this.arcgisPropertyChange = I()("state"), this.arcgisReady = A();
   }
   static {
-    this.properties = { autoDestroyDisabled: 5, defaultPopupTemplateEnabled: 5, graphic: 0, headingLevel: 9, hideContentAttachments: 5, hideContentExpression: 5, hideContentFields: 5, hideContentMedia: 5, hideContentText: 5, hideLastEditInfo: 5, hideLastEditedInfo: 5, hideTitle: 5, icon: 1, label: 1, location: 0, map: 0, position: 1, referenceElement: 1, spatialReference: 0, state: 3, timeZone: 1 };
+    this.properties = { flowType: 16, flowItems: 16, isTable: 16, popupTemplate: 16, sourceLayer: 16, fieldInfoMap: 16, values: 16, globalValues: 16, referenceElement: 1, position: 3, icon: 1, graphic: 0, defaultPopupTemplateEnabled: 5, headingLevel: 9, spatialReference: 0, timeZone: 1, heading: 0, map: 0, chartAnimationDisabled: 5, hideHeading: 5, hideContent: 5, hideAttachmentsContent: 5, hideCustomContent: 5, hideExpressionContent: 5, hideFieldsContent: 5, hideMediaContent: 5, showRelationshipContent: 5, hideTextContent: 5, showUtilityNetworkContent: 5, hideLastEditedInfo: 5, autoDestroyDisabled: 5, messageOverrides: 0, label: 1, location: 0, state: 3 };
   }
   static {
-    this.shadowRootOptions = d;
+    this.styles = S;
   }
   static {
-    this.styles = c;
+    this.shadowRootOptions = E;
+  }
+  get isTable() {
+    return this.viewModel.isFeatureFromTable;
+  }
+  get popupTemplate() {
+    return R(this.graphic, this.defaultPopupTemplateEnabled) ?? void 0;
+  }
+  get sourceLayer() {
+    return V(this.graphic);
+  }
+  get fieldInfoMap() {
+    return z(D(this.popupTemplate), this.sourceLayer);
+  }
+  get values() {
+    return this.graphic?.attributes ?? {};
+  }
+  get globalValues() {
+    return this.viewModel.formattedAttributes?.global ?? {};
   }
   async destroy() {
     await this.manager.destroy();
   }
-  async nextMedia(t) {
-    this.widget?.nextMedia(t);
+  async nextMedia(e) {
+    return this.viewModel.nextMedia(e);
+  }
+  async previousMedia(e) {
+    return this.viewModel.previousMedia(e);
+  }
+  async setActiveMedia(e, t) {
+    return this.viewModel.setActiveMedia(e, t);
+  }
+  render() {
+    const { state: e } = this.viewModel, t = a`<div class=${l(r.container)}>${this._renderTitle()}${e === "error" ? this._renderError() : e === "loading" ? this._renderLoading() : this._renderContentContainer()}</div>`;
+    return a`<div class=${l(y(r.base, C.widget))}>${t}</div>`;
+  }
+  _renderError() {
+    const { messages: e, hideHeading: t } = this;
+    return a`<calcite-notice icon=exclamation-mark-circle kind=danger open scale=s>${t ? null : a`<div slot=title>${e.error}</div>`}<div slot=message>${e.loadingError}</div></calcite-notice>`;
+  }
+  _renderLoading() {
+    return a`<div class=${l(r.loadingSpinnerContainer)}><calcite-loader inline label></calcite-loader></div>`;
+  }
+  _renderAttachments(e) {
+    const { values: t, fieldInfoMap: i, sourceLayer: n, globalValues: s } = this, o = c({
+      values: t,
+      fieldInfoMap: i,
+      globalValues: s,
+      layer: n,
+      text: e.title
+    }), d = c({
+      values: t,
+      fieldInfoMap: i,
+      globalValues: s,
+      layer: n,
+      text: e.description
+    });
+    return a`<arcgis-feature-attachments .headingLevel=${this.headingLevel} .heading=${o} .displayType=${e.displayType} .graphic=${this.graphic ?? void 0} .description=${d} .messages=${this.messages}></arcgis-feature-attachments>`;
+  }
+  _renderCustom(e) {
+    return a`<arcgis-feature-content .creator=${e.creator} .destroyer=${e.destroyer ?? void 0} .graphic=${this.graphic ?? void 0} class=${l(r.contentElement)}></arcgis-feature-content>`;
+  }
+  _renderFields(e, t) {
+    const i = this.viewModel.formattedAttributes, { values: n, fieldInfoMap: s, sourceLayer: o, popupTemplate: d, globalValues: u } = this, g = (e.fieldInfos ?? d?.fieldInfos ?? [])?.filter(({ fieldName: p }) => !!p && (H(p) || P(p) || p in n)), m = d?.expressionInfos, v = c({
+      values: n,
+      fieldInfoMap: s,
+      globalValues: u,
+      layer: o,
+      text: e.title
+    }), $ = c({
+      values: n,
+      fieldInfoMap: s,
+      globalValues: u,
+      layer: o,
+      text: e.description
+    });
+    return a`<arcgis-feature-fields .headingLevel=${this.headingLevel} .heading=${v} class=${l(r.contentElement)} .messages=${this.messages} .description=${$} .values=${{
+      ...i?.global,
+      ...i?.content?.[t]
+    }} .fieldInfos=${g} .expressionInfos=${m ?? void 0}></arcgis-feature-fields>`;
+  }
+  _renderMedia(e, t) {
+    const { values: i, graphic: n, fieldInfoMap: s, sourceLayer: o, popupTemplate: d, globalValues: u } = this, { formattedAttributes: f, relatedInfos: g } = this.viewModel, m = {
+      ...f?.global,
+      ...f?.content?.[t]
+    }, v = c({
+      values: i,
+      fieldInfoMap: s,
+      globalValues: u,
+      layer: o,
+      text: e.title
+    }), $ = c({
+      values: i,
+      fieldInfoMap: s,
+      globalValues: u,
+      layer: o,
+      text: e.description
+    });
+    return a`<arcgis-feature-media .activeMediaInfoIndex=${e.activeMediaInfoIndex ?? 0} .chartAnimationDisabled=${this.chartAnimationDisabled} .headingLevel=${this.headingLevel} .heading=${v} class=${l(r.contentElement)} .description=${$} .values=${i} .layer=${o} .isAggregate=${n?.isAggregate} .messages=${this.messages} .fieldInfoMap=${s} .mediaInfos=${e.mediaInfos ?? []} .popupTemplate=${d ?? void 0} .relatedInfos=${g} .formattedValues=${m}></arcgis-feature-media>`;
+  }
+  _renderText(e) {
+    const { values: t, fieldInfoMap: i, sourceLayer: n, globalValues: s } = this, o = c({
+      values: t,
+      fieldInfoMap: i,
+      globalValues: s,
+      layer: n,
+      text: e.text
+    });
+    return a`<arcgis-feature-content .creator=${o} .graphic=${this.graphic ?? void 0} class=${l(r.contentElement)}></arcgis-feature-content>`;
+  }
+  _renderExpression(e, t) {
+    const i = this.viewModel.formattedAttributes, { fieldInfoMap: n } = this;
+    return a`<arcgis-feature-expression .expressionInfo=${e.expressionInfo} .map=${this.map ?? void 0} .spatialReference=${this.spatialReference ?? void 0} .view=${this.viewModel.view ?? void 0} .graphic=${this.graphic ?? void 0} .location=${this.location ?? void 0} .headingLevel=${this.headingLevel} class=${l(r.contentElement)} .interceptor=${this.viewModel.interceptor} .messages=${this.messages} .fieldInfoMap=${n} .values=${{
+      ...i?.global,
+      ...i?.content?.[t]
+    }}></arcgis-feature-expression>`;
+  }
+  _renderRelationship() {
+    return null;
+  }
+  _renderAssociation() {
+    return null;
+  }
+  _renderContentElement(e, t) {
+    switch (e.type) {
+      case "attachments":
+        return this.hideAttachmentsContent ? null : this._renderAttachments(e);
+      case "custom":
+        return this.hideCustomContent ? null : this._renderCustom(e);
+      case "fields":
+        return this.hideFieldsContent ? null : this._renderFields(e, t);
+      case "media":
+        return this.hideMediaContent ? null : this._renderMedia(e, t);
+      case "text":
+        return this.hideTextContent ? null : this._renderText(e);
+      case "expression":
+        return this.hideExpressionContent ? null : this._renderExpression(e, t);
+      case "relationship":
+        return this.showRelationshipContent ? this._renderRelationship() : null;
+      case "utility-network-associations":
+        return this.showUtilityNetworkContent ? this._renderAssociation() : null;
+      default:
+        return null;
+    }
+  }
+  _renderContent() {
+    const { content: e, graphic: t } = this.viewModel;
+    return e ? Array.isArray(e) && e.length ? e.length ? e.map(this._renderContentElement, this) : null : typeof e == "string" ? a`<arcgis-feature-content .creator=${e} .graphic=${t ?? void 0} class=${l(r.contentElement)}></arcgis-feature-content>` : e instanceof HTMLElement ? e : null : null;
+  }
+  _renderContentContainer() {
+    const { hideContent: e } = this;
+    return e ? null : a`<div class=${l(r.main)}>${[this._renderContent(), this._renderLastEditInfo()]}</div>`;
   }
-  async previousMedia(t) {
-    this.widget?.previousMedia(t);
+  _renderTitle() {
+    const { hideHeading: e, heading: t } = this;
+    return e ? null : x({ class: r.title, level: this.headingLevel, children: a`<div .innerHTML=${F.sanitize(t) ?? ""}></div>` });
   }
-  async setActiveMedia(t, e) {
-    this.widget?.setActiveMedia(t, e);
+  _renderLastEditInfo() {
+    const { hideLastEditedInfo: e, messages: t } = this, { lastEditInfo: i } = this.viewModel;
+    if (!i || e)
+      return null;
+    const { date: n, user: s } = i, o = i.type === "edit" ? s ? t.lastEditedByUser : t.lastEdited : s ? t.lastCreatedByUser : t.lastCreated, d = k(o ?? "", {
+      date: n,
+      user: s
+    });
+    return a`<div class=${l(y(r.lastEditedInfo, r.contentElement))}>${d}</div>`;
   }
 }
-i("arcgis-feature", p);
+w("arcgis-feature", Z);
 export {
-  p as ArcgisFeature
+  Z as ArcgisFeature
 };

package/dist/components/arcgis-feature/index.d.ts

@@ -1 +1,8 @@
+import "@esri/calcite-components/components/calcite-notice";
+import "@esri/calcite-components/components/calcite-loader";
+import "../arcgis-feature-attachments/index.js";
+import "../arcgis-feature-content/index.js";
+import "../arcgis-feature-fields/index.js";
+import "../arcgis-feature-media/index.js";
+import "../arcgis-feature-expression/index.js";
 export * from "./customElement.js";

package/dist/components/arcgis-feature/index.js

@@ -1 +1,8 @@
+import "@esri/calcite-components/components/calcite-notice";
+import "@esri/calcite-components/components/calcite-loader";
+import "../arcgis-feature-attachments/index.js";
+import "../arcgis-feature-content/index.js";
+import "../arcgis-feature-fields/index.js";
+import "../arcgis-feature-media/index.js";
+import "../arcgis-feature-expression/index.js";
 export * from "./customElement.js";

package/dist/components/arcgis-feature-attachments/customElement.d.ts

@@ -3,6 +3,7 @@
 import { HeadingLevel } from '../../support/heading';
 import { JsxNode, PublicLitElement as LitElement, TargetedEvent } from '@arcgis/lumina';
 import { ArcgisFeature } from '../arcgis-feature/customElement.js';
+import { ArcgisAttachments } from '../arcgis-attachments/customElement.js';
 
 /** @private */
 export declare class ArcgisFeatureAttachments extends LitElement {