@esri/hub-web-components 0.0.9 → 0.1.0

package/dist/components/arcgis-layout-column/customElement.js

@@ -0,0 +1,99 @@
+import { c as d } from "../../chunks/runtime.js";
+import { html as a } from "lit-html";
+import { keyed as $ } from "lit-html/directives/keyed.js";
+import { deferLoad as i, LitElement as b, createEvent as g, noShadowRoot as y } from "@arcgis/lumina";
+import { g as f, a as h, c as v, b as w } from "../../chunks/getResponsiveClasses.js";
+import { spreadProps as s } from "@open-wc/lit-helpers";
+import { Logger as n } from "@esri/hub-common";
+/*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
+See https://js.arcgis.com/0.1/esri/copyright.txt for details.
+v0.1.0 */
+function l({ tagName: c, props: t, children: e }) {
+  switch (c) {
+    case "arcgis-layout-row":
+      return a`<arcgis-layout-row ${s(t)}>${e}</arcgis-layout-row>`;
+    case "calcite-button":
+      return a`<calcite-button ${s(t)}>${e}</calcite-button>`;
+    case "calcite-chip":
+      return a`<calcite-chip .label=${t.label} ${s(t)}>${e}</calcite-chip>`;
+    case "calcite-avatar":
+      return a`<calcite-avatar ${s(t)}>${e}</calcite-avatar>`;
+    case "arcgis-text-element":
+      return a`<arcgis-text-element ${i} ${s(t)}>${e}</arcgis-text-element>`;
+    case "arcgis-hub-gallery-card":
+      return a`<arcgis-hub-gallery-card ${i} ${s(t)}>${e}</arcgis-hub-gallery-card>`;
+    // TODO: remove this case once the arcgis-hub-gallery-card
+    // supports items (Caleb should be merghing soon)
+    case "arcgis-hub-item-gallery-card":
+      return a`<arcgis-hub-item-gallery-card ${i} ${s(t)}>${e}</arcgis-hub-item-gallery-card>`;
+    case "arcgis-hub-image":
+      return a`<arcgis-hub-image ${i} ${s(t)}>${e}</arcgis-hub-image>`;
+    case "arcgis-hub-embed-card":
+      return a`<arcgis-hub-embed-card ${i} ${s(t)}>${e}</arcgis-hub-embed-card>`;
+    // Add more cases as needed
+    default:
+      return a`<div ${s(t)}>${e}</div>`;
+  }
+}
+class E extends b {
+  constructor() {
+    super(...arguments), this.isEditMode = !1, this.debug = !1, this.arcgisLayoutElementMouseOut = g(), this.arcgisLayoutElementMouseOver = g();
+  }
+  static {
+    this.properties = { node: 0, currentNode: 0, utils: 0, isEditMode: 5, debug: 5 };
+  }
+  static {
+    this.shadowRootOptions = y;
+  }
+  _onMouseOverCard(t) {
+    const e = t.target;
+    if (!(e instanceof HTMLElement))
+      return;
+    const u = this.node.children?.find((r) => r.id === e.dataset.nodeId);
+    u ? this.arcgisLayoutElementMouseOver.emit({
+      node: u,
+      referenceElement: e
+    }) : n.warn(`No node found for target with id ${e.dataset.nodeId}`);
+  }
+  _onMouseOutCard(t) {
+    const e = t.target;
+    e instanceof HTMLElement && this.arcgisLayoutElementMouseOut.emit({
+      referenceElement: e
+    });
+  }
+  getChildClasses(t) {
+    const e = t.classes?.length ? [...t.classes] : [];
+    return t.tag === "arcgis-layout-row" && e.push(...f(t.rowProps)), t.tag === "arcgis-layout-column" && e.push(...h(t.columnProps)), t.id === this.currentNode?.id && e.push("current-node"), e;
+  }
+  render() {
+    const { debug: t, isEditMode: e, utils: u } = this;
+    return this.node.children?.map((r) => {
+      const { id: m } = r;
+      if (v(r) || w(r)) {
+        n.warn(`Child with id ${m} in arcgis-layout-column is not a row or element.`);
+        return;
+      }
+      try {
+        return l({ tagName: r.tag, props: {
+          class: this.getChildClasses(r).join(" "),
+          currentNode: this.currentNode,
+          debug: t,
+          isEditMode: e,
+          key: r.id,
+          node: r,
+          onMouseOut: e ? this._onMouseOutCard.bind(this) : void 0,
+          onMouseOver: e ? this._onMouseOverCard.bind(this) : void 0,
+          utils: u,
+          ...r.properties,
+          ...r.styles ? { style: r.styles } : {}
+        }, children: Object.values(r.slots ?? {}).map((o) => typeof o == "string" ? o : l({ tagName: o.tag, props: o.properties ?? {} })) });
+      } catch (o) {
+        return n.error(`Error rendering block with id ${r.id} in arcgis-layout-column:`, o), t ? $(r.id, a`<div class="layout-error"></div>`) : null;
+      }
+    }) ?? [];
+  }
+}
+d("arcgis-layout-column", E);
+export {
+  E as ArcgisLayoutColumn
+};

package/dist/components/arcgis-layout-column/index.d.ts

@@ -0,0 +1,10 @@
+import "../arcgis-text-element/index.js";
+import "@esri/hub-components/dist/components/arcgis-hub-gallery-card.js";
+import "@esri/hub-components/dist/components/arcgis-hub-item-gallery-card.js";
+import "@esri/hub-components/dist/components/arcgis-hub-image.js";
+import "@esri/hub-components/dist/components/arcgis-hub-embed-card.js";
+import "../arcgis-layout-row/index.js";
+import "@esri/calcite-components/components/calcite-button";
+import "@esri/calcite-components/components/calcite-chip";
+import "@esri/calcite-components/components/calcite-avatar";
+export * from "./customElement.js";

package/dist/components/arcgis-layout-column/index.js

@@ -0,0 +1,12 @@
+import { deferredLoaders } from "@arcgis/lumina";
+import "../arcgis-layout-row/index.js";
+import "@esri/calcite-components/components/calcite-button";
+import "@esri/calcite-components/components/calcite-chip";
+import "@esri/calcite-components/components/calcite-avatar";
+export * from "./customElement.js";
+deferredLoaders.set("arcgis-text-element", () => import("../arcgis-text-element/index.js"))
+.set("arcgis-hub-gallery-card", () => import("@esri/hub-components/dist/components/arcgis-hub-gallery-card.js"))
+.set("arcgis-hub-item-gallery-card", () => import("@esri/hub-components/dist/components/arcgis-hub-item-gallery-card.js"))
+.set("arcgis-hub-image", () => import("@esri/hub-components/dist/components/arcgis-hub-image.js"))
+.set("arcgis-hub-embed-card", () => import("@esri/hub-components/dist/components/arcgis-hub-embed-card.js"))
+;

package/dist/components/arcgis-layout-container/customElement.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="../../index.d.ts" />
+import { JsxNode, PublicLitElement as LitElement, TargetedEvent } from '@arcgis/lumina';
+
+export declare class ArcgisLayoutContainer extends LitElement {
+}

package/dist/components/arcgis-layout-container/customElement.js

@@ -0,0 +1,20 @@
+import { c as t } from "../../chunks/runtime.js";
+import { html as r } from "lit-html";
+import { LitElement as s } from "@arcgis/lumina";
+import { css as o } from "@lit/reactive-element/css-tag.js";
+/*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
+See https://js.arcgis.com/0.1/esri/copyright.txt for details.
+v0.1.0 */
+const e = o``;
+class i extends s {
+  static {
+    this.styles = e;
+  }
+  render() {
+    return r`<div>PLACEHOLDER FOR LAYOUT CONTAINER</div>`;
+  }
+}
+t("arcgis-layout-container", i);
+export {
+  i as ArcgisLayoutContainer
+};

package/dist/components/arcgis-layout-container/index.d.ts

@@ -0,0 +1 @@
+export * from "./customElement.js";

package/dist/components/arcgis-layout-container/index.js

@@ -0,0 +1 @@
+export * from "./customElement.js";

package/dist/components/arcgis-layout-row/customElement.d.ts

@@ -0,0 +1,25 @@
+/// <reference types="../../index.d.ts" />
+import { PublicLitElement as LitElement, JsxNode, TargetedEvent } from '@arcgis/lumina';
+import { ILayoutNode, IRow, LayoutUtils } from '../layouts/types';
+
+/** @private */
+export declare class ArcgisLayoutRow extends LitElement {
+    /** The row node to render */
+    node: IRow;
+    /** The currently selected node */
+    currentNode?: ILayoutNode;
+    /** Layout utility functions */
+    utils?: LayoutUtils;
+    /**
+     * Whether the layout is in edit mode
+     *
+     * @default false
+     */
+    isEditMode: boolean;
+    /**
+     * Enable debug mode
+     *
+     * @default false
+     */
+    debug: boolean;
+}

package/dist/components/arcgis-layout-row/customElement.js

@@ -0,0 +1,44 @@
+import { c as m } from "../../chunks/runtime.js";
+import { html as t } from "lit-html";
+import { keyed as e } from "lit-html/directives/keyed.js";
+import { LitElement as d, noShadowRoot as c, safeClassMap as i, safeStyleMap as p } from "@arcgis/lumina";
+import { a as g, b as y } from "../../chunks/getResponsiveClasses.js";
+import { Logger as a } from "@esri/hub-common";
+import { spreadProps as $ } from "@open-wc/lit-helpers";
+/*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
+See https://js.arcgis.com/0.1/esri/copyright.txt for details.
+v0.1.0 */
+class f extends d {
+  constructor() {
+    super(...arguments), this.isEditMode = !1, this.debug = !1;
+  }
+  static {
+    this.properties = { node: 0, currentNode: 0, utils: 0, isEditMode: 5, debug: 5 };
+  }
+  static {
+    this.shadowRootOptions = c;
+  }
+  getChildClasses(r) {
+    const s = g(r.columnProps);
+    return r.classes?.length && s.push(...r.classes), r.id === this.currentNode?.id && s.push("current-node"), s;
+  }
+  render() {
+    const { debug: r, isEditMode: s, utils: n } = this;
+    return (this.node.children ?? []).map((o) => {
+      const { id: u } = o;
+      if (!y(o)) {
+        a.warn(`Child with id ${u} in arcgis-layout-row is not a column.`);
+        return;
+      }
+      try {
+        return e(o.id, t`<arcgis-layout-column class=${i(this.getChildClasses(o).join(" "))} .currentNode=${this.currentNode} .debug=${r} .isEditMode=${s} .node=${o} .utils=${n} style=${p(o.styles)} .role=${o.columnProps?.role} .ariaLabel=${o.columnProps?.ariaLabel} ${$(o.properties ?? {})}></arcgis-layout-column>`);
+      } catch (l) {
+        return a.error(`Error rendering column with id ${o.id} in arcgis-hub-layout-row:`, l), e(o.id, t`<arcgis-layout-column class=${i({ "layout-error": r })} .debug=${r} .node=${{ id: o.id, tag: "arcgis-layout-column" }}></arcgis-layout-column>`);
+      }
+    });
+  }
+}
+m("arcgis-layout-row", f);
+export {
+  f as ArcgisLayoutRow
+};

package/dist/components/arcgis-layout-row/index.d.ts

@@ -0,0 +1,2 @@
+import "../arcgis-layout-column/index.js";
+export * from "./customElement.js";

package/dist/components/arcgis-layout-row/index.js

@@ -0,0 +1,2 @@
+import "../arcgis-layout-column/index.js";
+export * from "./customElement.js";

package/dist/components/arcgis-layout-section/customElement.d.ts

@@ -0,0 +1,25 @@
+/// <reference types="../../index.d.ts" />
+import { PublicLitElement as LitElement, JsxNode, TargetedEvent } from '@arcgis/lumina';
+import { ILayoutNode, ISection, LayoutUtils } from '../layouts/types';
+
+/** @private */
+export declare class ArcgisLayoutSection extends LitElement {
+    /** The section node to render */
+    node: ISection;
+    /** The currently selected node */
+    currentNode?: ILayoutNode;
+    /** Layout utility functions */
+    utils?: LayoutUtils;
+    /**
+     * Whether the layout is in edit mode
+     *
+     * @default false
+     */
+    isEditMode: boolean;
+    /**
+     * Enable debug mode
+     *
+     * @default false
+     */
+    debug: boolean;
+}

package/dist/components/arcgis-layout-section/customElement.js

@@ -0,0 +1,44 @@
+import { c as l } from "../../chunks/runtime.js";
+import { html as e } from "lit-html";
+import { keyed as i } from "lit-html/directives/keyed.js";
+import { LitElement as g, noShadowRoot as p, safeClassMap as a, safeStyleMap as c } from "@arcgis/lumina";
+import { g as m, i as w } from "../../chunks/getResponsiveClasses.js";
+import { Logger as n } from "@esri/hub-common";
+import { spreadProps as y } from "@open-wc/lit-helpers";
+/*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
+See https://js.arcgis.com/0.1/esri/copyright.txt for details.
+v0.1.0 */
+class $ extends g {
+  constructor() {
+    super(...arguments), this.isEditMode = !1, this.debug = !1;
+  }
+  static {
+    this.properties = { node: 0, currentNode: 0, utils: 0, isEditMode: 5, debug: 5 };
+  }
+  static {
+    this.shadowRootOptions = p;
+  }
+  getChildClasses(s) {
+    const o = m(s.rowProps);
+    return s.classes?.length && o.push(...s.classes), s.id === this.currentNode?.id && o.push("current-node"), o;
+  }
+  render() {
+    const { debug: s, isEditMode: o, utils: u } = this;
+    return (this.node.children ?? []).map((r) => {
+      const { id: t } = r;
+      if (!w(r)) {
+        n.warn(`Child with id ${t} in arcgis-layout-section is not a row.`);
+        return;
+      }
+      try {
+        return i(r.id, e`<arcgis-layout-row class=${a(this.getChildClasses(r).join(" "))} .currentNode=${this.currentNode} .debug=${s} .isEditMode=${o} .node=${r} .utils=${u} style=${c(r.styles)} .role=${r.rowProps?.role} .ariaLabel=${r.rowProps?.ariaLabel} ${y(r.properties ?? {})}></arcgis-layout-row>`);
+      } catch (d) {
+        return n.error(`Error rendering row with id ${t} in arcgis-hub-layout-row:`, d), i(r.id, e`<arcgis-layout-row class=${a({ "layout-error": s })} .debug=${s} .node=${{ id: r.id, tag: "arcgis-layout-row" }}></arcgis-layout-row>`);
+      }
+    });
+  }
+}
+l("arcgis-layout-section", $);
+export {
+  $ as ArcgisLayoutSection
+};

package/dist/components/arcgis-layout-section/index.d.ts

@@ -0,0 +1,2 @@
+import "../arcgis-layout-row/index.js";
+export * from "./customElement.js";

package/dist/components/arcgis-layout-section/index.js

@@ -0,0 +1,2 @@
+import "../arcgis-layout-row/index.js";
+export * from "./customElement.js";

package/dist/components/arcgis-text-element/customElement.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="../../index.d.ts" />
+import { JsxNode, PublicLitElement as LitElement, TargetedEvent } from '@arcgis/lumina';
+
+export declare class ArcgisTextElement extends LitElement {
+    /** @default "" */
+    html: string;
+}

package/dist/components/arcgis-text-element/customElement.js

@@ -0,0 +1,30 @@
+import { c as t } from "../../chunks/runtime.js";
+import { html as i } from "lit-html";
+import { LitElement as s } from "@arcgis/lumina";
+import { css as r } from "@lit/reactive-element/css-tag.js";
+import { sanitizeHtml as e } from "@esri/hub-components";
+/*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
+See https://js.arcgis.com/0.1/esri/copyright.txt for details.
+v0.1.0 */
+const h = r`:host>div>h1:first-child,:host>div>h2:first-child,:host>div>h3:first-child,:host>div>h4:first-child,:host>div>h5:first-child,:host>div>h6:first-child,:host>div>p:first-child{margin-top:0}`;
+class o extends s {
+  constructor() {
+    super(...arguments), this.html = "";
+  }
+  static {
+    this.properties = { html: 1 };
+  }
+  static {
+    this.styles = h;
+  }
+  get _content() {
+    return e(this.html);
+  }
+  render() {
+    return i`<div .innerHTML=${this._content ?? ""}></div>`;
+  }
+}
+t("arcgis-text-element", o);
+export {
+  o as ArcgisTextElement
+};

package/dist/components/arcgis-text-element/index.d.ts

@@ -0,0 +1 @@
+export * from "./customElement.js";

package/dist/components/arcgis-text-element/index.js

@@ -0,0 +1 @@
+export * from "./customElement.js";

package/dist/components/functional/arcgis-layout-node.d.ts

@@ -0,0 +1,16 @@
+import { JsxNode } from '@arcgis/lumina';
+import { LayoutTag } from '../layouts/types';
+interface ArcgisLayoutNodeProps {
+    tagName: Exclude<LayoutTag, "arcgis-layout-column" | "arcgis-layout-section">;
+    props: Record<string, unknown>;
+    children?: JsxNode | JsxNode[];
+}
+/**
+ * Functional component to dynamically render a layout
+ * node based on the tagName provided. This allows us
+ * to get around inherent limitations of Lumina:
+ * https://qawebgis.esri.com/components/lumina/jsx#dynamic-tag-name
+ * https://qawebgis.esri.com/components/lumina/jsx#spread-attributes
+ */
+export declare function ArcgisLayoutNode({ tagName, props, children }: ArcgisLayoutNodeProps): JsxNode;
+export {};

package/dist/components/layouts/types.d.ts

@@ -0,0 +1,273 @@
+import { HubEntity, IEntityPermissionPolicy, IHubSite } from '@esri/hub-common';
+/** Type representing supported responsive breakpoints.  */
+export type Breakpoint = "xs" | "sm" | "md" | "lg" | "xl" | "xxl";
+/** Map of breakpoint names to their minimum pixel widths.  */
+export declare const BREAKPOINTS: Record<Breakpoint, number>;
+/** Defines a union type for valid ARIA roles */
+export type AriaRole = "application" | "article" | "button" | "cell" | "checkbox" | "columnheader" | "combobox" | "complementary" | "contentinfo" | "definition" | "directory" | "document" | "feed" | "figure" | "form" | "group" | "heading" | "img" | "link" | "list" | "listbox" | "listitem" | "main" | "math" | "menu" | "menubar" | "menuitem" | "navigation" | "none" | "note" | "option" | "presentation" | "progressbar" | "radio" | "radiogroup" | "region" | "row" | "rowgroup" | "rowheader" | "scrollbar" | "searchbox" | "separator" | "slider" | "spinbutton" | "status" | "switch" | "tab" | "table" | "tabpanel" | "term" | "textbox" | "timer" | "toolbar" | "tooltip" | "tree" | "treegrid" | "treeitem";
+/**
+ * Type for a value that can be either a single value or a map of
+ * breakpoint-specific values.
+ */
+export type ResponsiveValue<T> = Partial<Record<Breakpoint, T>> | T;
+/** Type representing valid column widths (1-12). */
+export type ColumnWidth = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;
+/**
+ * Interface representing a translation map for layout strings.
+ * Each key is a language code, and the value is a map of
+ * translation keys to translated strings:
+ * ```
+ * {
+ *   "en": {
+ *     "welcome": "Welcome to our site",
+ *     "goodbye": "Thank you for visiting"
+ *   },
+ *   "fr": {
+ *     "welcome": "Bienvenue sur notre site",
+ *     "goodbye": "Merci de votre visite"
+ *   }
+ * }
+ * ```
+ */
+export interface ITranslationMap {
+    /**
+     * A key-value pair where the key is a language
+     * code and the value is a map of translation
+     * keys to translated text.
+     */
+    [language: string]: Record<string, unknown>;
+}
+/**
+ * Type representing a map of CSS property names to values:
+ * {
+ *  "color": "red",
+ *  "font-size": "16px"
+ * }
+ */
+export type StyleMap = Record<string, string>;
+/**
+ * Type representing a reference or a value.
+ * References are resolved before variable interpolation.
+ */
+export type RefOrValue = Date | number | string | {
+    $ref: string;
+};
+export type Ref = {
+    $ref: string;
+};
+export type SectionOrRef = ISection | Ref;
+/**
+ * Interface representing a layout variable. These can be used
+ * anywhere in the layout, and the values will be interpolated
+ * into the layout before rendering. All `$ref` values will be
+ * resolved before interpolation.
+ */
+export interface ILayoutVariable {
+    /**
+     * The type of the variable. Used to generate a json & ui
+     * schemas allowing values to be provided by the user,
+     * during a "Create from..." operation.
+     */
+    type: "boolean" | "color" | "date" | "datetime" | "number" | "string" | "time" | "url";
+    /**
+     * A description of the variable. This is used to provide
+     * a hint to the user when they are entering a value for
+     * the variable.
+     */
+    description?: string;
+    /**
+     * The value of the variable. This can be a string, number,
+     * boolean, date, datetime, time, color, or url. If the value
+     * is a reference, it will be resolved before interpolation
+     */
+    value: RefOrValue;
+}
+/** Union type of all layout schema versions.  */
+export type LayoutSchema = ILayout;
+/** The latest supported layout schema.  */
+export type CurrentLayoutSchema = ILayout;
+/** Interface representing a layout object. */
+export interface ILayout {
+    /** Schema version for the layout. */
+    schemaVersion: number;
+    /** If true, the entire layout is read-only. */
+    readOnly?: boolean;
+    /** Array of sections in the layout. */
+    sections: SectionOrRef[];
+    /** Array of history entries for the layout. */
+    history: IHistoryEntry[];
+    /** Optional translations for the layout. */
+    translations?: ITranslationMap;
+    /** Optional overrides for layout nodes. */
+    overrides?: INodeOverrides;
+}
+/** Interface representing overrides for layout nodes. */
+export interface INodeOverrides {
+    /** Overrides for the node's properties */
+    [nodeId: string]: Partial<LayoutNode>;
+}
+/** Type representing any node in the layout tree.  */
+export type LayoutNode = IColumn | ILayoutNode | IRow | ISection;
+/** Interface representing a generic layout node. */
+export interface ILayoutNode {
+    /** Unique identifier for the node. */
+    id: string;
+    /** Tag name to render for this node. */
+    tag: LayoutTag;
+    /** Optional properties for the node. */
+    properties?: Record<string, unknown>;
+    /** Optional array of child nodes. */
+    children?: LayoutNode[];
+    /** Optional slotted content for the node */
+    slots?: Record<string, ILayoutNode | string>;
+    /** Optional schema version for the settings of this specific component. */
+    schemaVersion?: number;
+    /** Optional map of CSS styles for the node. */
+    styles?: StyleMap;
+    /** Optional array of CSS classes for the node. */
+    classes?: string[];
+    /** If true, the node is only rendered in the editor */
+    hidden?: boolean;
+    /** Optional array of permission policies for access control. */
+    permissions?: IEntityPermissionPolicy[];
+    /** Optional: when true the node can not be editied, regardless of the component rules.
+     * This is a means to control the edit access to sections of the layout, but  */
+    readOnly?: boolean;
+    /** Optional translations for the layout. */
+    translations?: ITranslationMap;
+}
+/** Interface representing a layout section node.  */
+export interface ISection extends ILayoutNode {
+    /** Tag for a section node (always 'arcgis-layout-section'). */
+    tag: "arcgis-layout-section";
+    /** Array of row children for the section. */
+    children?: IRow[];
+    /** Optional section-specific properties. */
+    sectionProps?: ISectionProps;
+    /** Optional section label */
+    label?: string;
+}
+/** Interface representing a layout row node.  */
+export interface IRow extends ILayoutNode {
+    /** Tag for a row node (always 'arcgis-layout-row'). */
+    tag: "arcgis-layout-row";
+    /** Array of column children for the row. */
+    children?: IColumn[];
+    /** Optional row-specific properties. */
+    rowProps?: IRowProps;
+}
+/**
+ * type for column children - a column can contain
+ * rows, or elements
+ */
+export type LayoutColumnChild = ILayoutNode | IRow;
+/**
+ * Interface representing a layout column node.
+ */
+export interface IColumn extends ILayoutNode {
+    /** Tag for a column node (always 'arcgis-hub-layout-column'). */
+    tag: "arcgis-layout-column";
+    /** Array of child nodes for the column (excluding sections). */
+    children?: LayoutColumnChild[];
+    /** Optional column-specific properties. */
+    columnProps?: IColumnProps;
+    /** Optional properties for the column node. */
+    properties?: Record<string, unknown>;
+}
+/** Interface for common accessible properties.  */
+export interface IAccessibleProps {
+    /** Optional ARIA role for accessibility. */
+    role?: AriaRole;
+    /** Optional ARIA label for accessibility. */
+    ariaLabel?: string;
+}
+/**
+ * Interface for section-specific properties, including
+ * accessibility and layout options.
+ */
+export interface ISectionProps extends IAccessibleProps {
+    /** If true, the section is fluid (full width). */
+    fluid?: boolean;
+    /** Remove horizontal gutters (column padding) from the section. */
+    noGutters?: boolean;
+    /**
+     * Responsive maxWidth for the section. Accepts a number
+     * (pixels) or string (e.g. '80%'), or a ResponsiveValue
+     * of those. Example: maxWidth: { sm: 540, md: 720, lg: '80%' }
+     */
+    maxWidth?: ResponsiveValue<number | string>;
+}
+/**
+ * Interface for row-specific properties, including accessibility
+ * and layout options.
+ */
+export interface IRowProps extends IAccessibleProps {
+    /** Remove horizontal gutters (column padding) from the row. */
+    noGutters?: boolean;
+    /** How to align columns vertically (cross axis). */
+    alignItems?: "around" | "between" | "center" | "end" | "start" | "stretch";
+    /** Space between columns (in pixels). Not implemented yet. */
+    gap?: ResponsiveValue<number | string>;
+    /** How to justify columns horizontally (main axis). Not implemented yet. */
+    justifyContent?: ResponsiveValue<"around" | "between" | "center" | "end" | "evenly" | "start">;
+}
+/**
+ * Interface for column-specific properties, including
+ * accessibility and layout options.
+ */
+export interface IColumnProps extends IAccessibleProps {
+    /** Responsive width for the column (1-12). */
+    width?: ResponsiveValue<ColumnWidth>;
+    /** Responsive offset (left margin) for the column. */
+    offset?: ResponsiveValue<0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12>;
+    /** Responsive order for the column. */
+    order?: ResponsiveValue<number>;
+    /** Responsive self-alignment for the column. */
+    alignSelf?: "auto" | "baseline" | "center" | "end" | "start" | "stretch";
+}
+/** Interface representing a history entry for a layout node.  */
+interface IHistoryEntry {
+    /** Node id for the history entry. */
+    nodeId: string;
+    /** UTC timestamp for the change. */
+    timestamp: number;
+    /** Username of the user who made the change. */
+    username: string;
+    /** Action performed (e.g., 'add:node', 'update:node', 'remove:block'). */
+    action: string;
+}
+/** Interface representing the configuration for a layout card. */
+export interface ILayoutCardConfig {
+    /** Tag for the layout card. */
+    tag: LayoutTag;
+    /** i18n key for the card. */
+    i18nKey: string;
+    /** Property name for the card's configuration. */
+    configProp: string;
+    /** Default values for the card's configuration. */
+    defaults: Record<string, unknown>;
+    /** Optional editor configuration for the card. */
+    editor?: {
+        /** Tag for the editor component. */
+        tag: LayoutEditorTag;
+        /** Optional callback to transform values before passing to the editor. */
+        valuesCallback?: (val: unknown) => unknown;
+        /** Additional properties to pass to the editor. */
+        properties?: Record<string, unknown>;
+    };
+}
+/** Type representing layout utility functions. */
+export type LayoutUtils = {
+    processLayout: (layout: ILayout) => Promise<ILayout>;
+};
+/** interfrace representing the options for processing a layout. */
+export interface IProcessLayoutOptions {
+    entity?: HubEntity;
+    site?: IHubSite;
+    variables?: Record<string, unknown>;
+}
+export declare const layoutTags: readonly ["arcgis-layout-section", "arcgis-layout-row", "arcgis-layout-column", "calcite-button", "calcite-chip", "calcite-avatar", "arcgis-text-element", "arcgis-hub-gallery-card", "arcgis-hub-item-gallery-card", "arcgis-hub-image", "arcgis-hub-embed-card"];
+export declare const layoutEditorTags: readonly [];
+export type LayoutTag = (typeof layoutTags)[number];
+export type LayoutEditorTag = (typeof layoutEditorTags)[number];
+export {};