UNPKG

@esri/calcite-components

Version:

Web Components for Esri's Calcite Design System.

90 lines (89 loc) 3.15 kB
/*! 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.3.0-next.10 */ 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.3.0-next.10"; const buildDate = "2025-05-28"; const revision = "2edd6cabb"; 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; } if (!isServer) { if (document.readyState === "interactive") { initModeChangeEvent(); } else { document.addEventListener("DOMContentLoaded", initModeChangeEvent, { once: true }); } } if (process.env.NODE_ENV !== "test") { queueMicrotask(stampVersion); } const runtime = makeRuntime({ defaultAssetPath: "https://cdn.jsdelivr.net/npm/@esri/calcite-components@3.3.0-next.10/dist/calcite/", 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 };