@esri/calcite-components
Version:
Web Components for Esri's Calcite Design System.
91 lines (90 loc) • 3.12 kB
JavaScript
/*! All material copyright ESRI, All Rights Reserved, unless otherwise specified.
See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
v3.2.1 */
import { makeRuntime } from "@arcgis/lumina";
import { isServer } from "lit";
import "lit-html/is-server.js";
const autoMode = "calcite-mode-auto";
const darkMode = "calcite-mode-dark";
const lightMode = "calcite-mode-light";
const CSS_UTILITY = {
autoMode,
darkMode,
lightMode,
rtl: "calcite--rtl",
calciteAnimate: "calcite-animate",
calciteAnimateInUp: "calcite-animate__in-up",
calciteAnimateInDown: "calcite-animate__in-down",
calciteAnimateInRight: "calcite-animate__in-right",
calciteAnimateInLeft: "calcite-animate__in-left"
};
const DEBOUNCE = {
filter: 250,
nextTick: 0,
resize: 150,
reposition: 100
};
const resizeStep = 10;
const resizeShiftStep = 25;
function initModeChangeEvent() {
const { classList } = document.body;
const prefersDark = window.matchMedia("(prefers-color-scheme: dark)").matches;
const getMode = () => classList.contains(darkMode) || classList.contains(autoMode) && prefersDark ? "dark" : "light";
const emitModeChange = (mode) => document.body.dispatchEvent(new CustomEvent("calciteModeChange", { bubbles: true, detail: { mode } }));
const modeChangeHandler = (newMode) => {
if (currentMode !== newMode) {
emitModeChange(newMode);
}
currentMode = newMode;
};
let currentMode = getMode();
emitModeChange(currentMode);
window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change", (event) => modeChangeHandler(event.matches ? "dark" : "light"));
new MutationObserver(() => modeChangeHandler(getMode())).observe(document.body, {
attributes: true,
attributeFilter: ["class"]
});
}
const existingConfig = globalThis["calciteConfig"];
const focusTrapStack = existingConfig?.focusTrapStack || [];
const logLevel = existingConfig?.logLevel || "info";
const version = "3.2.1";
const buildDate = "2025-05-29";
const revision = "618973fec";
function stampVersion() {
if (existingConfig && existingConfig.version) {
return;
}
console.info(`Using Calcite Components ${version} [Date: ${buildDate}, Revision: ${revision}]`);
const target = existingConfig || globalThis["calciteConfig"] || {};
Object.defineProperty(target, "version", {
value: version,
writable: false
});
globalThis["calciteConfig"] = target;
}
function globalScript() {
if (!isServer) {
if (document.readyState === "interactive") {
initModeChangeEvent();
} else {
document.addEventListener("DOMContentLoaded", () => initModeChangeEvent(), { once: true });
}
}
stampVersion();
}
globalScript();
const runtime = makeRuntime({ defaultAssetPath: "https://js.arcgis.com/calcite-components/3.2.1/", hydratedAttribute: "calcite-hydrated" });
const { customElement, getAssetPath, setAssetPath } = runtime;
export {
CSS_UTILITY as C,
DEBOUNCE as D,
resizeShiftStep as a,
resizeStep as b,
customElement as c,
focusTrapStack as f,
getAssetPath as g,
logLevel as l,
runtime as r,
setAssetPath as s
};