@esri/calcite-components 5.2.0-next.1 → 5.2.0-next.100

package/dist/chunks/utils.js

@@ -1,321 +1,111 @@
 /* COPYRIGHT Esri - https://js.arcgis.com/5.2/LICENSE.txt */
-import Color from "color";
-import { c as calciteSpacingFixedXl, a as calciteSpacingFixedMd, b as calciteSpacingFixedSm } from "./global.js";
-const CSS = {
-  channel: "channel",
-  channels: "channels",
-  colorField: "color-field",
-  colorFieldScope: "scope--color-field",
-  colorMode: "color-mode",
-  colorModeContainer: "color-mode-container",
-  container: "container",
-  control: "control",
-  controlAndScope: "control-and-scope",
-  controlSection: "control-section",
-  deleteColor: "delete-color",
-  header: "header",
-  hexAndChannelsGroup: "hex-and-channels-group",
-  hexOptions: "color-hex-options",
-  hueScope: "scope--hue",
-  hueSlider: "hue-slider",
-  opacityScope: "scope--opacity",
-  opacitySlider: "opacity-slider",
-  preview: "preview",
-  previewAndSliders: "preview-and-sliders",
-  saveColor: "save-color",
-  savedColor: "saved-color",
-  savedColorsButtons: "saved-colors-buttons",
-  savedColorsSection: "saved-colors-section",
-  scope: "scope",
-  section: "section",
-  slider: "slider",
-  sliders: "sliders",
-  splitSection: "section--split",
-  swatchGroup: "swatch-group"
-};
-const DEFAULT_COLOR = Color("#007AC2");
-const DEFAULT_STORAGE_KEY_PREFIX = "calcite-color-";
-const RGB_LIMITS = {
-  r: 255,
-  g: 255,
-  b: 255
-};
-const HSV_LIMITS = {
-  h: 360,
-  s: 100,
-  v: 100
-};
-const HUE_LIMIT_CONSTRAINED = HSV_LIMITS.h - 1;
-const OPACITY_LIMITS = {
-  min: 0,
-  max: 100
-};
-const STATIC_DIMENSIONS = {
-  s: {
-    gap: parseInt(calciteSpacingFixedSm),
-    slider: {
-      height: 12
-    },
-    thumb: {
-      radius: 7
-    },
-    preview: {
-      size: 20
-    },
-    minWidth: 200
-  },
-  m: {
-    gap: parseInt(calciteSpacingFixedMd),
-    slider: {
-      height: 12
-    },
-    thumb: {
-      radius: 7
-    },
-    preview: {
-      size: 24
-    },
-    minWidth: 240
-  },
-  l: {
-    gap: parseInt(calciteSpacingFixedXl),
-    slider: {
-      height: 12
-    },
-    thumb: {
-      radius: 7
-    },
-    preview: {
-      size: 32
-    },
-    minWidth: 304
+import { isServer } from "lit";
+import { n as nodeListToArray } from "./dom.js";
+import { A as AllComboboxChildrenSelector, C as ComboboxItemSelector, a as ComboboxItemGroupSelector } from "./resources10.js";
+function getAncestors(element) {
+  const parent = element.parentElement?.closest(AllComboboxChildrenSelector);
+  const grandparent = parent?.parentElement?.closest(AllComboboxChildrenSelector);
+  return [parent, grandparent].filter((el) => !!el);
+}
+function getItemAncestors(item) {
+  return item.ancestors?.filter((el) => el.nodeName === "CALCITE-COMBOBOX-ITEM") || [];
+}
+function getItemChildren(item) {
+  return nodeListToArray(item.querySelectorAll("calcite-combobox-item"));
+}
+function hasActiveChildren(node) {
+  const items = nodeListToArray(node.querySelectorAll("calcite-combobox-item"));
+  return items.filter((item) => item.selected).length > 0;
+}
+function getDepth(element) {
+  if (isServer) {
+    return 0;
   }
-};
-const SCOPE_SIZE = 1;
-const ICONS = {
-  minus: "minus",
-  plus: "plus"
-};
-const hexChar = /^[0-9A-F]$/i;
-const shorthandHex = /^#[0-9A-F]{3}$/i;
-const longhandHex = /^#[0-9A-F]{6}$/i;
-const shorthandHexWithAlpha = /^#[0-9A-F]{4}$/i;
-const longhandHexWithAlpha = /^#[0-9A-F]{8}$/i;
-function colorFromValue(value, clearable = false, mode) {
-  if (clearable && !value) {
-    return null;
-  }
-  return Color(
-    value != null && typeof value === "object" && alphaCompatible(mode) ? normalizeColor(value) : value
+  const result = document.evaluate(
+    "ancestor::calcite-combobox-item | ancestor::calcite-combobox-item-group",
+    element,
+    null,
+    XPathResult.UNORDERED_NODE_SNAPSHOT_TYPE,
+    null
   );
-}
-const alphaToOpacity = (alpha) => Number((alpha * 100).toFixed());
-const opacityToAlpha = (opacity) => Number((opacity / 100).toFixed(2));
-function isValidHex(hex, hasAlpha = false) {
-  return isShorthandHex(hex, hasAlpha) || isLonghandHex(hex, hasAlpha);
-}
-function evaluateHex(hex, length, pattern) {
-  if (!hex) {
-    return false;
+  const depth = result.snapshotLength;
+  if (depth > 0 && element.nodeName === ComboboxItemSelector) {
+    for (let i = 0; i < depth; i++) {
+      const parent = result.snapshotItem(i);
+      if (parent.nodeName === ComboboxItemGroupSelector) {
+        return depth;
+      }
+    }
+  } else if (element.nodeName === ComboboxItemGroupSelector) {
+    return depth;
   }
-  return hex.length === length && pattern.test(hex);
+  return depth + 1;
 }
-function isShorthandHex(hex, hasAlpha = false) {
-  const hexLength = hasAlpha ? 5 : 4;
-  const hexPattern = hasAlpha ? shorthandHexWithAlpha : shorthandHex;
-  return evaluateHex(hex, hexLength, hexPattern);
+function isSingleLike(selectionMode) {
+  return selectionMode.includes("single");
 }
-function isLonghandHex(hex, hasAlpha = false) {
-  const hexLength = hasAlpha ? 9 : 7;
-  const hexPattern = hasAlpha ? longhandHexWithAlpha : longhandHex;
-  return evaluateHex(hex, hexLength, hexPattern);
+function getLabel(item) {
+  return item.shortHeading || item.heading;
 }
-function normalizeHex(hex, hasAlpha = false, convertFromHexToHexa = false) {
-  hex = hex.toLowerCase();
-  if (!hex.startsWith("#")) {
-    hex = `#${hex}`;
-  }
-  if (isShorthandHex(hex, hasAlpha)) {
-    return rgbToHex(hexToRGB(hex, hasAlpha));
-  }
-  if (hasAlpha && convertFromHexToHexa && isValidHex(
-    hex,
-    false
-    /* we only care about RGB hex for conversion */
-  )) {
-    const isShorthand = isShorthandHex(hex, false);
-    return rgbToHex(hexToRGB(`${hex}${isShorthand ? "f" : "ff"}`, true));
+function orderByPrevious(items, previousItems) {
+  if (items.length < 2 || previousItems.length === 0) {
+    return items;
   }
-  return hex;
-}
-function hexify(color, hasAlpha = false) {
-  return hasAlpha ? color.hexa() : color.hex();
-}
-function rgbToHex(color) {
-  const { r, g, b } = color;
-  const rChars = numToHex(r);
-  const gChars = numToHex(g);
-  const bChars = numToHex(b);
-  const alphaChars = "a" in color ? numToHex(color.a * 255) : "";
-  return `#${rChars}${gChars}${bChars}${alphaChars}`.toLowerCase();
-}
-function numToHex(num) {
-  return num.toString(16).padStart(2, "0");
-}
-function normalizeAlpha(colorObject) {
-  const normalized = {
-    ...colorObject,
-    a: colorObject.alpha ?? 1
-    /* Color() will omit alpha if 1 */
-  };
-  delete normalized.alpha;
-  return normalized;
-}
-function normalizeColor(alphaColorObject) {
-  const normalized = { ...alphaColorObject, alpha: alphaColorObject.a ?? 1 };
-  delete normalized.a;
-  return normalized;
+  const previousItemOrder = new Map(previousItems.map((item, index) => [item, index]));
+  return [...items].sort((a, b) => {
+    const aOrder = previousItemOrder.get(a);
+    const bOrder = previousItemOrder.get(b);
+    if (aOrder !== void 0 && bOrder !== void 0) {
+      return aOrder - bOrder;
+    }
+    if (aOrder !== void 0) {
+      return -1;
+    }
+    if (bOrder !== void 0) {
+      return 1;
+    }
+    return 0;
+  });
 }
-function hexToRGB(hex, hasAlpha = false) {
-  if (!isValidHex(hex, hasAlpha)) {
-    return null;
+function consumeValue(counts, value) {
+  const count = counts.get(value) ?? 0;
+  if (count === 0) {
+    return false;
   }
-  hex = hex.replace("#", "");
-  let r;
-  let g;
-  let b;
-  let a;
-  const isShorthand = hex.length === 3 || hex.length === 4;
-  if (isShorthand) {
-    const [first, second, third, fourth] = hex.split("");
-    r = parseInt(`${first}${first}`, 16);
-    g = parseInt(`${second}${second}`, 16);
-    b = parseInt(`${third}${third}`, 16);
-    a = parseInt(`${fourth}${fourth}`, 16) / 255;
+  if (count === 1) {
+    counts.delete(value);
   } else {
-    r = parseInt(hex.slice(0, 2), 16);
-    g = parseInt(hex.slice(2, 4), 16);
-    b = parseInt(hex.slice(4, 6), 16);
-    a = parseInt(hex.slice(6, 8), 16) / 255;
+    counts.set(value, count - 1);
   }
-  return isNaN(a) ? { r, g, b } : { r, g, b, a };
+  return true;
 }
-const enumify = (x) => x;
-const CSSColorMode = enumify({
-  HEX: "hex",
-  HEXA: "hexa",
-  RGB_CSS: "rgb-css",
-  RGBA_CSS: "rgba-css",
-  HSL_CSS: "hsl-css",
-  HSLA_CSS: "hsla-css"
-});
-const ObjectColorMode = enumify({
-  RGB: "rgb",
-  RGBA: "rgba",
-  HSL: "hsl",
-  HSLA: "hsla",
-  HSV: "hsv",
-  HSVA: "hsva"
-});
-function parseMode(colorValue) {
-  if (typeof colorValue === "string") {
-    if (colorValue.startsWith("#")) {
-      const { length } = colorValue;
-      if (length === 4 || length === 7) {
-        return CSSColorMode.HEX;
-      }
-      if (length === 5 || length === 9) {
-        return CSSColorMode.HEXA;
-      }
-    }
-    if (colorValue.startsWith("rgba(")) {
-      return CSSColorMode.RGBA_CSS;
-    }
-    if (colorValue.startsWith("rgb(")) {
-      return CSSColorMode.RGB_CSS;
-    }
-    if (colorValue.startsWith("hsl(")) {
-      return CSSColorMode.HSL_CSS;
-    }
-    if (colorValue.startsWith("hsla(")) {
-      return CSSColorMode.HSLA_CSS;
-    }
+function orderValuesByPrevious(selectedValues, previousValues) {
+  if (selectedValues.length < 2 || previousValues.length === 0) {
+    return selectedValues;
   }
-  if (typeof colorValue === "object") {
-    if (hasChannels(colorValue, "r", "g", "b")) {
-      return hasChannels(colorValue, "a") ? ObjectColorMode.RGBA : ObjectColorMode.RGB;
-    }
-    if (hasChannels(colorValue, "h", "s", "l")) {
-      return hasChannels(colorValue, "a") ? ObjectColorMode.HSLA : ObjectColorMode.HSL;
-    }
-    if (hasChannels(colorValue, "h", "s", "v")) {
-      return hasChannels(colorValue, "a") ? ObjectColorMode.HSVA : ObjectColorMode.HSV;
-    }
+  const selectedValueCounts = /* @__PURE__ */ new Map();
+  selectedValues.forEach((value) => {
+    selectedValueCounts.set(value, (selectedValueCounts.get(value) ?? 0) + 1);
+  });
+  const orderedSelectedValues = previousValues.filter((value) => consumeValue(selectedValueCounts, value));
+  if (orderedSelectedValues.length === 0) {
+    return selectedValues;
   }
-  return null;
-}
-function hasChannels(colorObject, ...channels) {
-  return channels.every((channel) => channel && colorObject && `${channel}` in colorObject);
-}
-function colorEqual(value1, value2) {
-  return value1?.rgb().array().toString() === value2?.rgb().array().toString();
-}
-function alphaCompatible(mode) {
-  return mode === CSSColorMode.HEXA || mode === CSSColorMode.RGBA_CSS || mode === CSSColorMode.HSLA_CSS || mode === ObjectColorMode.RGBA || mode === ObjectColorMode.HSLA || mode === ObjectColorMode.HSVA;
-}
-function toAlphaMode(mode) {
-  const alphaMode = mode === CSSColorMode.HEX ? CSSColorMode.HEXA : mode === CSSColorMode.RGB_CSS ? CSSColorMode.RGBA_CSS : mode === CSSColorMode.HSL_CSS ? CSSColorMode.HSLA_CSS : mode === ObjectColorMode.RGB ? ObjectColorMode.RGBA : mode === ObjectColorMode.HSL ? ObjectColorMode.HSLA : mode === ObjectColorMode.HSV ? ObjectColorMode.HSVA : mode;
-  return alphaMode;
-}
-function toNonAlphaMode(mode) {
-  const nonAlphaMode = mode === CSSColorMode.HEXA ? CSSColorMode.HEX : mode === CSSColorMode.RGBA_CSS ? CSSColorMode.RGB_CSS : mode === CSSColorMode.HSLA_CSS ? CSSColorMode.HSL_CSS : mode === ObjectColorMode.RGBA ? ObjectColorMode.RGB : mode === ObjectColorMode.HSLA ? ObjectColorMode.HSL : mode === ObjectColorMode.HSVA ? ObjectColorMode.HSV : mode;
-  return nonAlphaMode;
-}
-const borderWidthInPx = 1;
-const inlineSizeBorderTotalWidth = borderWidthInPx * 2;
-function getSliderWidth(availableWidth, activeStaticDimensions, hasAlpha) {
-  const previewWidth = hasAlpha ? STATIC_DIMENSIONS["l"].preview.size : activeStaticDimensions.preview.size;
-  const effectiveWidth = availableWidth - inlineSizeBorderTotalWidth;
-  const inlineSpaceAroundElements = activeStaticDimensions.gap * 3;
-  return Math.max(effectiveWidth - inlineSpaceAroundElements - previewWidth, 0);
-}
-function getColorFieldDimensions(availableWidth) {
-  const colorFieldAspectRatio = 1.8;
-  const effectiveWidth = availableWidth - inlineSizeBorderTotalWidth;
-  return {
-    width: Math.max(effectiveWidth, 0),
-    height: Math.max(Math.floor(effectiveWidth / colorFieldAspectRatio), 0)
-  };
+  selectedValues.forEach((value) => {
+    if (consumeValue(selectedValueCounts, value)) {
+      orderedSelectedValues.push(value);
+    }
+  });
+  return orderedSelectedValues;
 }
 export {
-  CSSColorMode as C,
-  DEFAULT_COLOR as D,
-  HSV_LIMITS as H,
-  ICONS as I,
-  OPACITY_LIMITS as O,
-  RGB_LIMITS as R,
-  STATIC_DIMENSIONS as S,
-  getColorFieldDimensions as a,
-  hexify as b,
-  colorFromValue as c,
-  DEFAULT_STORAGE_KEY_PREFIX as d,
-  alphaCompatible as e,
-  colorEqual as f,
-  getSliderWidth as g,
-  hexToRGB as h,
-  isValidHex as i,
-  CSS as j,
-  HUE_LIMIT_CONSTRAINED as k,
-  normalizeAlpha as l,
-  alphaToOpacity as m,
-  normalizeHex as n,
-  opacityToAlpha as o,
-  parseMode as p,
-  SCOPE_SIZE as q,
-  toAlphaMode as r,
-  isLonghandHex as s,
-  toNonAlphaMode as t,
-  isShorthandHex as u,
-  rgbToHex as v,
-  hexChar as w
+  orderByPrevious as a,
+  getItemAncestors as b,
+  getItemChildren as c,
+  getAncestors as d,
+  getDepth as e,
+  getLabel as g,
+  hasActiveChildren as h,
+  isSingleLike as i,
+  orderValuesByPrevious as o
 };

package/dist/chunks/utils2.js

@@ -1,58 +1,75 @@
 /* COPYRIGHT Esri - https://js.arcgis.com/5.2/LICENSE.txt */
-import { isServer } from "lit";
-import { n as nodeListToArray } from "./dom.js";
-import { A as AllComboboxChildrenSelector, a as ComboboxItemSelector, b as ComboboxItemGroupSelector } from "./resources5.js";
-function getAncestors(element) {
-  const parent = element.parentElement?.closest(AllComboboxChildrenSelector);
-  const grandparent = parent?.parentElement?.closest(AllComboboxChildrenSelector);
-  return [parent, grandparent].filter((el) => !!el);
+import { supportedLocales, defaultLocale, normalizeLocale } from "@arcgis/toolkit/intl";
+import { d as dateFromISO } from "./date.js";
+import { g as getAssetPath, l as logger } from "./runtime.js";
+const translationCache = {};
+const requestCache = {};
+const extraNlsLocales = [
+  "de-AT",
+  "de-CH",
+  "en-AU",
+  "en-CA",
+  "en-GB",
+  "es-MX",
+  "fr-CA",
+  "fr-CH",
+  "hi",
+  "it-CH",
+  "mk",
+  "pt"
+];
+[...supportedLocales, ...extraNlsLocales];
+function normalizeNlsLocale(locale) {
+  if (!locale) {
+    return defaultLocale;
+  }
+  const localeParts = locale.split("-");
+  locale = `${localeParts[0].toLowerCase()}${localeParts.length >= 2 ? `-${localeParts[1].toUpperCase()}` : ""}`;
+  if (extraNlsLocales.includes(locale)) {
+    return locale;
+  }
+  return normalizeLocale(locale);
 }
-function getItemAncestors(item) {
-  return item.ancestors?.filter((el) => el.nodeName === "CALCITE-COMBOBOX-ITEM") || [];
+async function getLocaleData(locale) {
+  locale = normalizeNlsLocale(locale);
+  if (translationCache[locale]) {
+    return translationCache[locale];
+  }
+  if (!requestCache[locale]) {
+    requestCache[locale] = fetch(getAssetPath(`./assets/date-picker/nls/${locale}.json`)).then((resp) => resp.json()).catch(() => {
+      logger.error(`Native Language Support data for "${locale}" not found or invalid, falling back to english`);
+      return getLocaleData(defaultLocale);
+    });
+  }
+  return translationCache[locale] = await requestCache[locale];
 }
-function getItemChildren(item) {
-  return nodeListToArray(item.querySelectorAll("calcite-combobox-item"));
+function applyLocaleOverride(locale) {
+  const localeOverrideMap = {
+    "ar-SA": "ar"
+    // see https://github.com/Esri/calcite-design-system/issues/11399
+  };
+  return localeOverrideMap[locale] || locale;
 }
-function hasActiveChildren(node) {
-  const items = nodeListToArray(node.querySelectorAll("calcite-combobox-item"));
-  return items.filter((item) => item.selected).length > 0;
+function getValueAsDateRange(value) {
+  return value.map((v, index) => dateFromISO(v, index === 1));
 }
-function getDepth(element) {
-  if (isServer) {
-    return 0;
+function getSource(changes, stringProp, dateProp) {
+  const stringPropChanged = changes.has(stringProp);
+  const datePropChanged = changes.has(dateProp);
+  if (stringPropChanged && !datePropChanged) {
+    return stringProp;
   }
-  const result = document.evaluate(
-    "ancestor::calcite-combobox-item | ancestor::calcite-combobox-item-group",
-    element,
-    null,
-    XPathResult.UNORDERED_NODE_SNAPSHOT_TYPE,
-    null
-  );
-  const depth = result.snapshotLength;
-  if (depth > 0 && element.nodeName === ComboboxItemSelector) {
-    for (let i = 0; i < depth; i++) {
-      const parent = result.snapshotItem(i);
-      if (parent.nodeName === ComboboxItemGroupSelector) {
-        return depth;
-      }
-    }
-  } else if (element.nodeName === ComboboxItemGroupSelector) {
-    return depth;
+  if (datePropChanged && !stringPropChanged) {
+    return dateProp;
   }
-  return depth + 1;
-}
-function isSingleLike(selectionMode) {
-  return selectionMode.includes("single");
+  return void 0;
 }
-function getLabel(item) {
-  return item.shortHeading || item.heading;
+function getMinMaxSource(changes, type) {
+  return type === "min" ? getSource(changes, "min", "minAsDate") : getSource(changes, "max", "maxAsDate");
 }
 export {
-  getItemAncestors as a,
-  getItemChildren as b,
-  getAncestors as c,
-  getDepth as d,
-  getLabel as g,
-  hasActiveChildren as h,
-  isSingleLike as i
+  getValueAsDateRange as a,
+  applyLocaleOverride as b,
+  getLocaleData as c,
+  getMinMaxSource as g
 };