@ds-mo/ui 15.4.0 → 15.5.0

package/dist/lib/components/Icon/icon-cache.d.ts

@@ -45,6 +45,12 @@ export declare function iconCache(): IconCacheMap;
  * name IcoMo does not ship — an app's own marker artwork, say — register as
  * system and resolve the same way.
  *
+ * Custom glyphs must be static and self-contained. Shapes, local gradients,
+ * clipping and narrow inline paint styles are supported; scripts, embedded
+ * stylesheets, animation, images and external resources are rejected. Validation
+ * happens when rendering, including for pre-registered strings. Unsupported
+ * markup preserves the icon's empty fixed-size box.
+ *
  * There is deliberately no category override. ds-icon has no such override when
  * it reads, so forcing a different category on write could only produce an
  * entry nothing ever reads.

package/dist/lib/utils/clock-time.d.ts

@@ -8,6 +8,7 @@ export declare const CLOCK_HOURS: readonly [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 1
 export declare const CLOCK_PERIODS: readonly ClockPeriod[];
 export declare function isClockTime(value: string): boolean;
 export declare function clockMinuteStep(step?: string | number): number;
+/** Minute choices for a positive whole-minute stride; sub-minute strides fall back to one. */
 export declare function clockMinutes(step?: number, baseMinute?: number): number[];
 export declare function splitClockTime(value: string): ClockTimeParts | null;
 export declare function joinClockTime(parts: ClockTimeParts): string;

package/dist/lib/utils/date-filter-value.d.ts

@@ -48,11 +48,13 @@ export type ParsedDateFilterValue = {
 } | ({
     kind: 'range';
 } & DateFilterRange);
+/** Validate a timezone-free Gregorian day with a four-digit year from 0001 through 9999. */
 export declare function isIsoCalendarDate(value: string): boolean;
 /** Readable calendar date for filled ISO values such as `2026-09-10` → `Sep 10, 2026`. */
 export declare function formatIsoCalendarDateLabel(value: string): string;
 /** Parse a typed calendar date: ISO, `M/D/YYYY`, or a short-month label such as `Sep 10, 2026`. */
 export declare function parseLooseCalendarDate(value: string): string;
+/** Shift whole calendar days in UTC; return an empty value for invalid input or year overflow. */
 export declare function shiftIsoCalendarDate(value: string, days: number): string;
 export declare function dateFilterRelativeValue(preset: DateFilterRelativePreset): DateFilterRelativeValue;
 export declare function dateFilterRangeValue(start: string, end?: string): DateFilterRangeValue;

package/dist/lib/utils/form-association.d.ts

@@ -9,7 +9,8 @@ export interface SetRepeatedFormControlValueOptions {
 }
 /**
  * Set one form-associated value while consistently omitting inactive controls.
- * Pass `state` only when restoration differs from the submitted value.
+ * Inactive controls retain their restoration state even when submission is
+ * omitted. Pass `state` when restoration differs from the control's value.
  */
 export declare function setFormControlValue(internals: ElementInternals, value: File | string | null, options?: SetFormControlValueOptions): void;
 /**

package/dist/lib/utils/format-percentage.d.ts

@@ -1,3 +1,3 @@
 export type PercentageDecimals = 1 | 2;
-/** Format a ratio as a locale-aware percentage with an exact, supported precision. */
+/** Format a ratio as a percentage (English by default) with an exact, supported precision. */
 export declare function formatPercentage(ratio: number, decimals?: PercentageDecimals, locale?: string): string;

package/dist/lib/utils/index.js

@@ -80,87 +80,103 @@ function registerIcons(icons) {
 
 // src/wc/utils/resolve-css-length-px.ts
 var lengthPxCache = /* @__PURE__ */ new Map();
-var probeEl = null;
-function getProbeElement() {
-  if (typeof document === "undefined") return null;
-  if (!probeEl) {
-    probeEl = document.createElement("div");
-    probeEl.setAttribute("aria-hidden", "true");
-    probeEl.style.cssText = "position:absolute;visibility:hidden;pointer-events:none;top:0;left:0;width:0;height:0;overflow:hidden;";
-    document.documentElement.appendChild(probeEl);
-  }
-  return probeEl;
-}
-function applyContextVariables(probe, cssLength, context) {
-  const contextStyle = getComputedStyle(context);
-  const pending = [...cssLength.matchAll(/var\(\s*(--[\w-]+)/g)].map((match) => match[1]);
-  const visited = /* @__PURE__ */ new Set();
-  const previous = [];
-  while (pending.length > 0) {
-    const name = pending.shift();
-    if (!name || visited.has(name)) continue;
-    visited.add(name);
-    const value = contextStyle.getPropertyValue(name).trim();
-    if (!value) continue;
-    previous.push({
-      name,
-      value: probe.style.getPropertyValue(name),
-      priority: probe.style.getPropertyPriority(name)
-    });
-    probe.style.setProperty(name, value);
-    for (const match of value.matchAll(/var\(\s*(--[\w-]+)/g)) pending.push(match[1]);
-  }
-  return previous;
-}
-function restoreProbeVariables(probe, previous) {
-  for (const { name, value, priority } of previous) {
-    if (value) probe.style.setProperty(name, value, priority);
-    else probe.style.removeProperty(name);
+var probes = /* @__PURE__ */ new WeakMap();
+var CACHE_LIMIT = 256;
+function literalPixels(value) {
+  const cached = lengthPxCache.get(value);
+  if (cached !== void 0) return cached;
+  if (!/^[+-]?(?:\d+\.?\d*|\.\d+)(?:e[+-]?\d+)?(?:px)?$/i.test(value)) return void 0;
+  const pixels = Number(value.replace(/px$/i, ""));
+  if (!Number.isFinite(pixels)) return void 0;
+  if (lengthPxCache.size >= CACHE_LIMIT) lengthPxCache.clear();
+  lengthPxCache.set(value, pixels);
+  return pixels;
+}
+function getProbeElement(ownerDocument) {
+  let probe = probes.get(ownerDocument);
+  if (!probe) {
+    probe = ownerDocument.createElement("div");
+    probe.setAttribute("aria-hidden", "true");
+    probe.style.cssText = "all:initial;position:fixed;visibility:hidden;pointer-events:none;top:0;left:0;width:0;height:0;margin:0;padding:0;border:0;overflow:hidden;";
+    probes.set(ownerDocument, probe);
   }
+  if (!probe.isConnected) ownerDocument.documentElement.appendChild(probe);
+  return probe;
 }
 function clearCssLengthPxCache() {
   lengthPxCache.clear();
 }
 function resolveCssLengthPx(value, fallback, context) {
   const resolved = value === void 0 || value === null || value === "" ? fallback : value;
-  if (typeof resolved === "number") return resolved;
+  if (typeof resolved === "number") return Number.isFinite(resolved) ? resolved : 0;
   const trimmed = resolved.trim();
   if (!trimmed) return resolveCssLengthPx(fallback, 0, context);
-  const scopedProperty = context ? trimmed.match(/^var\(\s*(--[\w-]+)/)?.[1] : void 0;
-  if (context && scopedProperty) {
-    const scopedValue = getComputedStyle(context).getPropertyValue(scopedProperty).trim();
-    if (scopedValue && scopedValue !== trimmed) {
-      return resolveCssLengthPx(scopedValue, fallback, context);
-    }
-  }
-  const contextDependent = !!context && trimmed.includes("var(");
-  const cached = contextDependent ? void 0 : lengthPxCache.get(trimmed);
-  if (cached !== void 0) return cached;
-  if (/^-?\d+(\.\d+)?$/.test(trimmed)) {
-    const n = Number(trimmed);
-    lengthPxCache.set(trimmed, n);
-    return n;
+  const literal = literalPixels(trimmed);
+  if (literal !== void 0) return literal;
+  const fallbackPixels = typeof fallback === "number" ? fallback : literalPixels(fallback.trim());
+  const safeFallback = Number.isFinite(fallbackPixels) ? fallbackPixels : 0;
+  const ownerDocument = context?.ownerDocument ?? (typeof document === "undefined" ? null : document);
+  const view = ownerDocument?.defaultView;
+  if (!ownerDocument?.documentElement || !view) return safeFallback;
+  const cssLength = /^--[\w-]+$/.test(trimmed) ? `var(${trimmed})` : trimmed;
+  if (!view.CSS.supports("left", cssLength)) return safeFallback;
+  const scopeStyle = view.getComputedStyle(context ?? ownerDocument.documentElement);
+  const directProperty = cssLength.match(/^var\(\s*(--[\w-]+)\s*\)$/)?.[1];
+  if (directProperty) {
+    const scopedValue = scopeStyle.getPropertyValue(directProperty).trim();
+    if (!scopedValue) return safeFallback;
+    const scopedPixels = literalPixels(scopedValue);
+    if (scopedPixels !== void 0) return scopedPixels;
   }
-  const pxMatch = trimmed.match(/^(-?\d+(\.\d+)?)px$/);
-  if (pxMatch) {
-    const px2 = parseFloat(pxMatch[1]);
-    lengthPxCache.set(trimmed, px2);
-    return px2;
+  const probe = getProbeElement(ownerDocument);
+  const variables = new Set([...cssLength.matchAll(/var\(\s*(--[\w-]+)/g)].map((match) => match[1]));
+  for (const name of variables) {
+    probe.style.setProperty(name, scopeStyle.getPropertyValue(name).trim() || "initial");
   }
-  const cssLength = /^--[\w-]+$/.test(trimmed) ? `var(${trimmed})` : trimmed;
-  const probe = getProbeElement();
-  if (!probe) {
-    return typeof fallback === "number" ? fallback : 0;
+  probe.style.font = scopeStyle.font;
+  probe.style.fontSize = scopeStyle.fontSize;
+  probe.style.lineHeight = scopeStyle.lineHeight;
+  probe.style.left = "";
+  probe.style.left = cssLength;
+  try {
+    if (!probe.style.left) return safeFallback;
+    const pixels = parseFloat(view.getComputedStyle(probe).left);
+    return Number.isFinite(pixels) ? pixels : safeFallback;
+  } finally {
+    probe.style.left = "0px";
+    for (const name of variables) probe.style.removeProperty(name);
   }
-  const previousVariables = context ? applyContextVariables(probe, cssLength, context) : [];
-  probe.style.width = cssLength;
-  const px = probe.getBoundingClientRect().width;
-  probe.style.width = "";
-  restoreProbeVariables(probe, previousVariables);
-  if (!contextDependent && (px !== 0 || !cssLength.includes("var("))) {
-    lengthPxCache.set(trimmed, px);
+}
+
+// src/wc/utils/intl-formatters.ts
+var DEFAULT_LOCALE = "en-US";
+var CACHE_LIMIT2 = 32;
+var locales = /* @__PURE__ */ new Map();
+var numbers = /* @__PURE__ */ new Map();
+function remember(cache, key, value) {
+  if (cache.size >= CACHE_LIMIT2) cache.delete(cache.keys().next().value);
+  cache.set(key, value);
+  return value;
+}
+function resolveFormatLocale(locale) {
+  if (typeof locale !== "string" || !locale.trim()) return DEFAULT_LOCALE;
+  const key = locale.trim();
+  const cached = locales.get(key);
+  if (cached) return cached;
+  let resolved = DEFAULT_LOCALE;
+  try {
+    resolved = Intl.NumberFormat.supportedLocalesOf(key)[0] ?? DEFAULT_LOCALE;
+  } catch {
   }
-  return px;
+  return remember(locales, key, resolved);
+}
+function keyFor(locale, options) {
+  return JSON.stringify([locale, Object.entries(options).sort(([a], [b]) => a.localeCompare(b))]);
+}
+function numberFormatter(locale, options = {}) {
+  const resolved = resolveFormatLocale(locale);
+  const key = keyFor(resolved, options);
+  return numbers.get(key) ?? remember(numbers, key, new Intl.NumberFormat(resolved, options));
 }
 
 // src/wc/utils/format-compact-number.ts
@@ -171,7 +187,7 @@ var COMPACT_UNITS = [
 ];
 function formatCompactNumber(value, locale) {
   if (locale) {
-    return new Intl.NumberFormat(locale, {
+    return numberFormatter(locale, {
       notation: "compact",
       compactDisplay: "short",
       maximumFractionDigits: 1
@@ -198,7 +214,7 @@ function formatCompactNumber(value, locale) {
 function formatPercentage(ratio, decimals = 1, locale) {
   const precision = decimals === 2 ? 2 : 1;
   const value = Number.isFinite(ratio) ? ratio : 0;
-  return new Intl.NumberFormat(locale, {
+  return numberFormatter(locale, {
     style: "percent",
     minimumFractionDigits: precision,
     maximumFractionDigits: precision
@@ -224,9 +240,7 @@ function resolveMetricTrend(current, previous, options = {}) {
   if (!change.direction) return null;
   const rose = change.direction === "up";
   const tone = neutral ? "neutral" : rose !== inverted ? "positive" : "negative";
-  const value = display === "percentage" ? new Intl.NumberFormat(locale, { style: "percent", maximumFractionDigits: 0 }).format(
-    change.ratio
-  ) : formatCompactNumber(change.absolute, locale);
+  const value = display === "percentage" ? numberFormatter(locale, { style: "percent", maximumFractionDigits: 0 }).format(change.ratio) : formatCompactNumber(change.absolute, locale);
   return { direction: change.direction, value, tone };
 }
 
@@ -478,20 +492,17 @@ function setRequiredValidity(internals, missing, message) {
 // src/wc/utils/form-association.ts
 function setFormControlValue(internals, value, options = {}) {
   const submission = options.inactive ? null : value;
-  if (options.state === void 0) {
-    internals.setFormValue(submission);
-    return;
-  }
-  internals.setFormValue(submission, options.state);
+  internals.setFormValue(submission, options.state === void 0 ? value : options.state);
 }
 function setRepeatedFormControlValue(internals, name, values, options = {}) {
+  const state = options.state === void 0 ? JSON.stringify(values) : options.state;
   if (options.inactive || !name || values.length === 0) {
-    internals.setFormValue(null);
+    internals.setFormValue(null, state);
     return;
   }
   const data = new FormData();
   values.forEach((value) => data.append(name, String(value)));
-  internals.setFormValue(data, options.state ?? JSON.stringify(values));
+  internals.setFormValue(data, state);
 }
 function restoreStringFormState(state, fallback = "") {
   return typeof state === "string" ? state : fallback;
@@ -510,7 +521,9 @@ function restoreNumberArrayFormState(state, maximumValues) {
   try {
     const restored = JSON.parse(state);
     if (!Array.isArray(restored)) return [];
-    const values = restored.map((value) => typeof value === "number" ? value : Number(value)).filter((value) => Number.isFinite(value));
+    const values = restored.filter(
+      (value) => typeof value === "number" || typeof value === "string" && value.trim().length > 0
+    ).map(Number).filter((value) => Number.isFinite(value));
     return maximumValues === void 0 ? values : values.slice(0, maximumValues);
   } catch {
     return [];
@@ -520,7 +533,7 @@ function restoreNumberArrayFormState(state, maximumValues) {
 // src/wc/utils/safe-url.ts
 var DEFAULT_PROTOCOLS = ["http:", "https:"];
 function resolveSafeUrl(value, options = {}) {
-  const candidate = value?.trim();
+  const candidate = typeof value === "string" ? value.trim() : "";
   if (!candidate) return void 0;
   const baseUrl = options.baseUrl ?? (typeof document === "undefined" ? void 0 : document.baseURI);
   try {
@@ -1126,7 +1139,7 @@ var CLOCK_HOURS = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12];
 var CLOCK_PERIODS = ["AM", "PM"];
 var CLOCK_TIME_PATTERN = /^\d{2}:\d{2}$/;
 function isClockTime(value) {
-  if (!CLOCK_TIME_PATTERN.test(value)) return false;
+  if (typeof value !== "string" || !CLOCK_TIME_PATTERN.test(value)) return false;
   const [hour, minute] = value.split(":").map(Number);
   return hour >= 0 && hour <= 23 && minute >= 0 && minute <= 59;
 }
@@ -1137,8 +1150,8 @@ function clockMinuteStep(step = 60) {
   return Math.max(1, Math.round(seconds / 60));
 }
 function clockMinutes(step = 1, baseMinute = 0) {
-  const stride = Number.isFinite(step) && step > 0 ? Math.floor(step) : 1;
-  const normalizedBase = (Math.floor(baseMinute) % 60 + 60) % 60;
+  const stride = Number.isFinite(step) ? Math.max(1, Math.floor(step)) : 1;
+  const normalizedBase = Number.isFinite(baseMinute) ? (Math.floor(baseMinute) % 60 + 60) % 60 : 0;
   const values = /* @__PURE__ */ new Set();
   for (let offset = 0; offset < 1440; offset += stride) {
     values.add((normalizedBase + offset) % 60);
@@ -1153,6 +1166,8 @@ function splitClockTime(value) {
   return { hour12, minute, period };
 }
 function joinClockTime(parts) {
+  if (!parts || !Number.isInteger(parts.hour12) || parts.hour12 < 1 || parts.hour12 > 12 || !Number.isInteger(parts.minute) || parts.minute < 0 || parts.minute > 59 || parts.period !== "AM" && parts.period !== "PM")
+    return "";
   const hour24 = parts.period === "AM" ? parts.hour12 === 12 ? 0 : parts.hour12 : parts.hour12 === 12 ? 12 : parts.hour12 + 12;
   return `${String(hour24).padStart(2, "0")}:${String(parts.minute).padStart(2, "0")}`;
 }
@@ -1162,6 +1177,7 @@ function formatClockTimeLabel(value) {
   return `${parts.hour12}:${String(parts.minute).padStart(2, "0")} ${parts.period}`;
 }
 function parseLooseClockTime(value) {
+  if (typeof value !== "string") return "";
   const trimmed = value.trim();
   if (!trimmed) return "";
   if (isClockTime(trimmed)) return trimmed;
@@ -1218,14 +1234,15 @@ var ISO_CALENDAR_DATE_LABEL = new Intl.DateTimeFormat("en-US", {
   timeZone: "UTC"
 });
 function isIsoCalendarDate(value) {
-  if (!ISO_DATE_PATTERN.test(value)) return false;
+  if (typeof value !== "string" || !ISO_DATE_PATTERN.test(value)) return false;
   const [year, month, day] = value.split("-").map(Number);
-  const date = new Date(Date.UTC(year, month - 1, day));
+  if (year < 1) return false;
+  const date = /* @__PURE__ */ new Date(`${value}T00:00:00Z`);
   return date.getUTCFullYear() === year && date.getUTCMonth() === month - 1 && date.getUTCDate() === day;
 }
 function formatIsoCalendarDateLabel(value) {
   if (!isIsoCalendarDate(value)) return "";
-  return ISO_CALENDAR_DATE_LABEL.format(/* @__PURE__ */ new Date(`${value}T00:00:00Z`));
+  return ISO_CALENDAR_DATE_LABEL.formatToParts(/* @__PURE__ */ new Date(`${value}T00:00:00Z`)).map((part) => part.type === "year" ? part.value.padStart(4, "0") : part.value).join("");
 }
 var MONTH_LABELS = [
   "jan",
@@ -1242,6 +1259,7 @@ var MONTH_LABELS = [
   "dec"
 ];
 function parseLooseCalendarDate(value) {
+  if (typeof value !== "string") return "";
   const trimmed = value.trim();
   if (!trimmed) return "";
   if (isIsoCalendarDate(trimmed)) return trimmed;
@@ -1258,10 +1276,11 @@ function parseLooseCalendarDate(value) {
   return isIsoCalendarDate(iso) ? iso : "";
 }
 function shiftIsoCalendarDate(value, days) {
-  if (!isIsoCalendarDate(value)) return "";
-  const [year, month, day] = value.split("-").map(Number);
-  const date = new Date(Date.UTC(year, month - 1, day + days));
-  return date.toISOString().slice(0, 10);
+  if (!isIsoCalendarDate(value) || !Number.isSafeInteger(days)) return "";
+  const date = /* @__PURE__ */ new Date(`${value}T00:00:00Z`);
+  date.setUTCDate(date.getUTCDate() + days);
+  const year = date.getUTCFullYear();
+  return year >= 1 && year <= 9999 ? date.toISOString().slice(0, 10) : "";
 }
 function dateFilterRelativeValue(preset) {
   return `relative:${preset}`;
@@ -1296,7 +1315,8 @@ function resolveDateFilterRange(value, referenceDate) {
   const preset = DATE_FILTER_RELATIVE_PRESETS.find((candidate) => candidate.value === parsed.preset);
   if (!preset) return null;
   const end = shiftIsoCalendarDate(referenceDate, preset.offset);
-  return { start: shiftIsoCalendarDate(end, -(preset.days - 1)), end };
+  const start = shiftIsoCalendarDate(end, -(preset.days - 1));
+  return start && end ? { start, end } : null;
 }
 export {
   CLOCK_HOURS,