@arcgis/lumina 4.31.0-next.84

package/dist/lazyLoad.d.ts

@@ -0,0 +1,154 @@
+import { Deferred } from "@arcgis/components-utils";
+import type { LitElement } from "./LitElement";
+import type { Runtime } from "./runtime";
+import type { ControllerManager } from "@arcgis/components-controllers";
+/**
+ * Defines lazy-loading proxy components for all web components in this package.
+ *
+ * As soon as a proxied web component is created (e.g. by adding it to the DOM),
+ * it will start loading the actual web component source code.
+ */
+export interface DefineCustomElements {
+    (_window?: Window, options?: LazyLoadOptions): void;
+    (options?: LazyLoadOptions): void;
+}
+export type LazyLoadOptions = {
+    readonly resourcesUrl?: string;
+};
+export declare const makeDefineCustomElements: (runtime: Runtime, structure: Readonly<Record<string, CompactMeta>>) => DefineCustomElements;
+/**
+ * Use compact meta to reduce bundle size (otherwise, it would be ~65kb for
+ * map-components). Also, the meta is a string to speed-up parsing
+ * (browsers parse strings much faster).
+ * See https://twitter.com/mathias/status/1143551692732030979
+ */
+type CompactMeta = readonly [load: () => Promise<Record<string, typeof LitElement>>, compact?: string];
+/**
+ * If this file is run from a Node.js environment, HTMLElement won't be defined.
+ * Falling back to uselessly extending parseCondensedProp in that case
+ * (that particular function chosen just because it already exists, rather than
+ * needlessly creating mock class/function)
+ * That will error if you try to instantiate a ProxyComponent in Node.js, but
+ * that is expected - if you need to instantiate ProxyComponent, HTMLElement
+ * must be defined
+ */
+declare const HtmlElement: {
+    new (): HTMLElement;
+    prototype: HTMLElement;
+};
+/**
+ * A web-component that, once connected to the page, starts loading the actual
+ * component, and set's up two-way forwarding of attributes and methods.
+ *
+ * It also makes the actual component render it's content in this 'proxy'
+ * component, so as to have identical DOM structure for lazy vs non-lazy builds
+ * (otherwise, css selectors may break)
+ *
+ * @internal
+ */
+export declare abstract class ProxyComponent extends HtmlElement {
+    static observedAttributes?: readonly string[];
+    /** @internal */
+    static _loadPromise: Promise<Record<string, typeof LitElement>> | undefined;
+    /** @internal */
+    static _LitConstructor?: typeof LitElement;
+    /**
+     * A list of instances of this component. This allows hot module replacement
+     * to update all proxy component to use a new LitElement instance.
+     *
+     * @internal
+     */
+    static _hmrInstances: WeakRef<ProxyComponent>[] | undefined;
+    /** @internal */
+    static _hmrIndex: number | undefined;
+    /** @internal */
+    static _properties?: readonly string[];
+    /** @internal */
+    static _asyncMethods?: readonly string[];
+    /** @internal */
+    static _syncMethods?: readonly string[];
+    protected static _name: string;
+    static readonly lumina = true;
+    /** @internal */
+    static _initializePrototype(): void;
+    private static _bindProp;
+    private static _bindAsync;
+    private static _bindSync;
+    /**
+     * On HMR, preserve the values of all properties that at least once were set
+     * by someone other than component itself.
+     *
+     * @internal
+     */
+    _hmrSetProps: Set<PropertyKey>;
+    /** @internal */
+    _hmrSetAttributes: Set<string>;
+    /** @internal */
+    _litElement: LitElement | undefined;
+    /** @internal */
+    _store: LitElement | Record<string, unknown>;
+    /**
+     * If attributeChangedCallback() is called before the LitElement is loaded,
+     * store the attributes here, and replay later
+     */
+    private _pendingAttributes;
+    /**
+     * Resolved once LitElement's load() is complete.
+     * Not read inside of this class, but needed for LitElement to determine if
+     * it's closest ancestor finished load()
+     */
+    _postLoad: Deferred<void>;
+    /**
+     * Resolved once LitElement's loaded() is complete
+     */
+    _postLoaded: Deferred<void>;
+    /**
+     * Direct offspring that should be awaited before loaded() is emitted
+     */
+    _offspring: (Partial<Pick<LitElement, "manager">> & Pick<LitElement, "componentOnReady">)[];
+    /**
+     * Promise that resolves once parent's load() completed. False if there is no
+     * parent
+     */
+    _ancestorLoad?: Promise<void> | false;
+    get manager(): ControllerManager | undefined;
+    constructor();
+    /**
+     * Until the custom element is registered on the page, an instance of that
+     * element can be constructed and some properties on that instance set.
+     *
+     * These properties are set before the element prototype is set to this proxy
+     * class and thus none of our getters/setters are yet registered - such
+     * properties will be set by JavaScript on the instance directly.
+     *
+     * Once element is registered, the properties set in the meanwhile will shadow
+     * the getter/setters, and thus break reactivity. The fix is to delete these
+     * properties from the instance, and re-apply them once accessors are set.
+     *
+     * @example
+     * ```ts
+     * import { defineCustomElements } from '@arcgis/map-components';
+     * const map = document.createElement('arcgis-map');
+     * // This will shadow the getter/setters
+     * map.itemId = '...';
+     * // This finally defines the custom elements and sets the property accessors
+     * defineCustomElements();
+     * ```
+     *
+     * @remarks
+     * This is an equivalent of the __saveInstanceProperties method in Lit's
+     * ReactiveElement. Lit takes care of this on LitElement, but we have to take
+     * care of this on the lazy proxy
+     */
+    protected _saveInstanceProperties(): void;
+    attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null): void;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    /**
+     * Create a promise that resolves once component is fully loaded
+     */
+    componentOnReady(): Promise<LitElement>;
+    /** @internal */
+    _initializeComponent(module: Record<string, typeof LitElement>): void;
+}
+export {};

package/dist/lifecycleSupport.d.ts

@@ -0,0 +1,8 @@
+import type { ProxyComponent } from "./lazyLoad";
+/**
+ * If there is a parent component, tell it to await it's loaded() until we
+ * completed load().
+ * Also, return a promise that will delay our load() until parent's load()
+ * is completed.
+ */
+export declare function attachToAncestor(child: ProxyComponent["_offspring"][number], el: HTMLElement): Promise<void> | false;

package/dist/runtime.d.ts

@@ -0,0 +1,105 @@
+import type { CSSResult } from "lit";
+import type { LitElement } from "./LitElement";
+/**
+ * `@arcgis/lumina` package may be bundled once but used by multiple packages with
+ * different configuration options. For that reason, the configuration options
+ * can not be a global object, but has to be an object that you pass around.
+ */
+export type Runtime = {
+    /**
+     * Get the base path to where the package assets can be found.
+     * By default, the package asset path is set to "https://js.arcgis.com/<simplified-package-name>/<released-verion>/".
+     * We are hosting our assets on a CDN (Content Delivery Network) to ensure fast and reliable access.
+     * It is CORS-enabled, so you can load the assets from any domain.
+     * Use "setAssetPath(path)" if the path needs to be customized.
+     */
+    readonly getAssetPath: (suffix: string) => string;
+    /**
+     * Used to manually set the base path where package assets (like localization
+     * and icons) can be found.
+     *
+     * By default, the package asset path is set to "https://js.arcgis.com/<simplified-package-name>/<released-verion>/".
+     * For example, "https://js.arcgis.com/map-components/4.30/".
+     * We are hosting our assets on a CDN (Content Delivery Network) to ensure fast and reliable access.
+     * It is CORS-enabled, so you can load the assets from any domain.
+     * This is the recommended way to load the assets and avoid bundling them with your application.
+     * It means that by default, you don't need to use "setAssetPath" since the path is already set.
+     *
+     * However, if you need to host the assets locally, you can use "setAssetPath" to set the base path.
+     * If the script is used as "module", it's recommended to use "import.meta.url",
+     * such as "setAssetPath(import.meta.url)". Other options include
+     * "setAssetPath(document.currentScript.src)", or using a bundler's replace plugin to
+     * dynamically set the path at build time, such as "setAssetPath(process.env.ASSET_PATH)".
+     * But do note that this configuration depends on how your script is bundled, or lack of
+     * bundling, and where your assets can be loaded from. Additionally custom bundling
+     * will have to ensure the static assets are copied to its build directory.
+     */
+    readonly setAssetPath: (path: URL | string) => void;
+    /**
+     * The customElement decorator. Unlike default Lit's decorator this one
+     * provides runtime instance to the LitElement class
+     *
+     * @remarks
+     * You do not need to call this decorator in your component.
+     * It will be added automatically at build time.
+     *
+     * Instead, make sure your component file has the following:
+     * ```ts
+     * declare global {
+     *  interface DeclareElements {
+     *      "arcgis-your-component": ArcgisYourComponent;
+     *   }
+     * }
+     * ```
+     */
+    readonly customElement: (tagName: string, component: typeof LitElement) => void;
+    readonly defaultAssetsUrl: RuntimeOptions["defaultAssetsUrl"];
+    readonly hydratedAttribute: NonNullable<RuntimeOptions["hydratedAttribute"]>;
+    readonly commonStyles: readonly NonNullable<RuntimeOptions["commonStyles"]>[];
+    readonly globalStyles: RuntimeOptions["globalStyles"];
+};
+export type RuntimeOptions = {
+    /**
+     * The default base URL to use for loading assets.
+     * Set this to `import.meta.env.BASE_URL`, which would be resolved by Vite
+     * based on the value you provided to the useLumina() plugin
+     */
+    readonly defaultAssetsUrl: URL | string;
+    /**
+     * The attribute that indicates a component has been fully loaded and ready to
+     * use. Defaults to "hydrated"
+     */
+    readonly hydratedAttribute?: string;
+    /**
+     * Styles that you wish to make available in each component's shadow root, but
+     * to not apply outside the shadow root
+     *
+     * @example
+     * import { styles } from "./styles/index.css";
+     * export const runtime = makeRuntime({
+     *  defaultAssetsUrl: import.meta.env.BASE_URL,
+     *  commonStyles: styles,
+     * });
+     */
+    readonly commonStyles?: CSSResult;
+    /**
+     * Styles that you wish to applied to the entire page, even outside the shadow
+     * dom. Useful for declaring CSS variables.
+     */
+    readonly globalStyles?: CSSResult;
+};
+export declare function makeRuntime({ defaultAssetsUrl, hydratedAttribute, commonStyles, globalStyles, }: RuntimeOptions): Runtime;
+/**
+ * Exposing the reference to the runtime globally when in tests or development.
+ * This is primarily for usage by dynamically created components in tests
+ */
+export type DevOnlyGlobalRuntime = typeof globalThis & {
+    devOnly$luminaRuntime?: Runtime;
+};
+/**
+ * Called from the component constructor when in development or test mode.
+ * Used primarily by renderElement to get a reference to the rendered component.
+ */
+export type DevOnlyGlobalComponentRefCallback = typeof globalThis & {
+    devOnly$luminaComponentRefCallback?: (component: LitElement) => void;
+};

package/dist/typings/importMeta.d.ts

@@ -0,0 +1,14 @@
+interface ImportMetaEnv {
+    [key: string]: any;
+    BASE_URL: string;
+    MODE: string;
+    DEV: boolean;
+    PROD: boolean;
+    SSR: boolean;
+}
+interface ImportMeta {
+    url: string;
+    readonly hot?: import("vite/types/hot.d.ts").ViteHotContext;
+    readonly env: ImportMetaEnv;
+    glob: import("vite/types/importGlob.d.ts").ImportGlobFunction;
+}

package/dist/typings/index.d.ts

@@ -0,0 +1,4 @@
+/// <reference path="jsxGlobals.d.ts" />
+/// <reference path="loadLitCss.d.ts" />
+/// <reference path="viteEnv.d.ts" />
+/// <reference path="importMeta.d.ts" />

package/dist/typings/jsxGlobals.d.ts

@@ -0,0 +1,38 @@
+export {};
+declare global {
+    /**
+     * This interface will be extended in each source file that defines a LitElement.
+     *
+     * @example
+     * ```ts
+     * declare global {
+     *   interface DeclareElements {
+     *     "arcgis-root": ArcgisRoot;
+     *   }
+     * }
+     * ```
+     */
+    export interface DeclareElements {
+    }
+    interface HTMLElementTagNameMap extends DeclareElements {
+    }
+    /**
+     * Extend this interface with Stencil web components that you wish to use
+     * in Lit
+     *
+     * @example
+     * ```ts
+     * import type { JSX as CalciteJSX } from "@esri/calcite-components/dist/types/components";
+     * import type { JSX as CommonComponentsJsx } from "@arcgis/common-components/dist/types/components";
+     *
+     * declare global {
+     *   interface ImportStencilElements
+     *     extends CalciteJSX.IntrinsicElements,
+     *     CommonComponentsJsx.IntrinsicElements {
+     *   }
+     * }
+     * ```
+     */
+    export interface ImportStencilElements {
+    }
+}

package/dist/typings/loadLitCss.d.ts

@@ -0,0 +1,62 @@
+/**
+ * Tell TypeScript that .css imports will be replaced by Lit's CSSResult at
+ * build-time.
+ *
+ * @see `@arcgis/lumina-compiler/plugins/loadLitCss.ts`
+ */
+declare module "*.css" {
+    import type { CSSResult } from "lit";
+    export const styles: CSSResult & {
+        get styleSheet(): CSSStyleSheet;
+    };
+    export default styles;
+}
+declare module "*.scss" {
+    import type { CSSResult } from "lit";
+    export const styles: CSSResult & {
+        get styleSheet(): CSSStyleSheet;
+    };
+    export default styles;
+}
+declare module "*.sass" {
+    import type { CSSResult } from "lit";
+    export const styles: CSSResult & {
+        get styleSheet(): CSSStyleSheet;
+    };
+    export default styles;
+}
+declare module "*.less" {
+    import type { CSSResult } from "lit";
+    export const styles: CSSResult & {
+        get styleSheet(): CSSStyleSheet;
+    };
+    export default styles;
+}
+declare module "*.styl" {
+    import type { CSSResult } from "lit";
+    export const styles: CSSResult & {
+        get styleSheet(): CSSStyleSheet;
+    };
+    export default styles;
+}
+declare module "*.stylus" {
+    import type { CSSResult } from "lit";
+    export const styles: CSSResult & {
+        get styleSheet(): CSSStyleSheet;
+    };
+    export default styles;
+}
+declare module "*.pcss" {
+    import type { CSSResult } from "lit";
+    export const styles: CSSResult & {
+        get styleSheet(): CSSStyleSheet;
+    };
+    export default styles;
+}
+declare module "*.sss" {
+    import type { CSSResult } from "lit";
+    export const styles: CSSResult & {
+        get styleSheet(): CSSStyleSheet;
+    };
+    export default styles;
+}

package/dist/typings/viteEnv.d.ts

@@ -0,0 +1,48 @@
+/**
+ * The following are a subset of types from vite/client.d.ts
+ * Removed the types related to static assets since we handle assets differently
+ */
+declare module "*.wasm?init" {
+    const initWasm: (options?: WebAssembly.Imports) => Promise<WebAssembly.Instance>;
+    export default initWasm;
+}
+declare module "*?worker" {
+    const workerConstructor: new (options?: {
+        name?: string;
+    }) => Worker;
+    export default workerConstructor;
+}
+declare module "*?worker&inline" {
+    const workerConstructor: new (options?: {
+        name?: string;
+    }) => Worker;
+    export default workerConstructor;
+}
+declare module "*?worker&url" {
+    const src: string;
+    export default src;
+}
+declare module "*?sharedworker" {
+    const sharedWorkerConstructor: new (options?: {
+        name?: string;
+    }) => SharedWorker;
+    export default sharedWorkerConstructor;
+}
+declare module "*?sharedworker&inline" {
+    const sharedWorkerConstructor: new (options?: {
+        name?: string;
+    }) => SharedWorker;
+    export default sharedWorkerConstructor;
+}
+declare module "*?sharedworker&url" {
+    const src: string;
+    export default src;
+}
+declare module "*?raw" {
+    const src: string;
+    export default src;
+}
+declare module "*?inline" {
+    const src: string;
+    export default src;
+}

package/dist/utils.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Add this static property to your component to disable shadow root.
+ *
+ * @remarks
+ * Without shadow root, any styles added using the `styles` property will
+ * be applied to the entire DOM that the component is attached to, not just to
+ * the insides of this component.
+ *
+ * @example
+ * ```ts
+ *   static override shadowRootOptions = noShadowRoot;
+ * ```
+ */
+export declare const noShadowRoot: ShadowRootInit;

package/dist/wrappersUtils.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Returns a proxy object for a custom element prototype.
+ * The function that creates a React wrapper component for a custom element,
+ * if rendered, will need the custom element prototype to define the React component properties.
+ * Because the custom element may not yet be defined in global scope when
+ * `createPrototypeProxy()` is called, this small proxy delays retrieving the custom
+ * element prototype until it is actually needed, and caches the result for future calls.
+ */
+export declare function createPrototypeProxy<T extends HTMLElement>(tagName: string): new () => T;

package/package.json

@@ -0,0 +1,45 @@
+{
+  "name": "@arcgis/lumina",
+  "version": "4.31.0-next.84",
+  "type": "module",
+  "main": "dist/index.cjs",
+  "module": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "exports": {
+    ".": "./dist/index.js",
+    "./config": "./dist/config.js",
+    "./typings": {
+      "types": "./dist/typings/index.d.ts"
+    },
+    "./package.json": "./package.json"
+  },
+  "files": [
+    "dist/"
+  ],
+  "publishConfig": {
+    "registry": "https://registry.npmjs.org/",
+    "access": "public"
+  },
+  "license": "SEE LICENSE IN LICENSE.md",
+  "scripts": {
+    "build": "tsup",
+    "build:dev": "tsup --sourcemap",
+    "watch": "yarn build:dev --watch",
+    "clean": "rimraf ./dist ./build ./turbo ./node_modules"
+  },
+  "dependencies": {
+    "@arcgis/components-controllers": "4.31.0-next.84",
+    "@arcgis/components-utils": "4.31.0-next.84",
+    "csstype": "^3.1.3",
+    "lit": "^3.1.2"
+  },
+  "devDependencies": {
+    "@arcgis/typescript-config": "4.31.0-next.84",
+    "@types/node": "^20.2.5",
+    "eslint": "^8.55.0",
+    "rimraf": "^5.0.0",
+    "tsup": "^8.1.0",
+    "typescript": "~5.4.0"
+  },
+  "gitHead": "283c379920730793219fcd5c4e69616e92d691dd"
+}