@editora/ui-core 0.1.8 → 0.1.10

package/dist/date-range-picker.esm.js

@@ -0,0 +1,973 @@
+import { E as tt } from "./ElementBase-909688f3.mjs";
+import { r as et, c as N } from "./calendar-2c11b824.mjs";
+import { r as it, i as m, s as nt, b as rt, p as K, f as j, a as Y, l as W, c as st, d as w, e as at, g as ot, n as D } from "./date-time-utils-bdceb7af.mjs";
+import "./scroll-lock-9de6d328.mjs";
+let lt = 0;
+const dt = `
+  <svg viewBox="0 0 20 20" class="icon-svg" aria-hidden="true" focusable="false">
+    <path d="M6 2a1 1 0 0 1 1 1v1h6V3a1 1 0 1 1 2 0v1h.5A2.5 2.5 0 0 1 18 6.5v9A2.5 2.5 0 0 1 15.5 18h-11A2.5 2.5 0 0 1 2 15.5v-9A2.5 2.5 0 0 1 4.5 4H5V3a1 1 0 0 1 1-1Zm10 7H4v6.5c0 .276.224.5.5.5h11a.5.5 0 0 0 .5-.5V9ZM4.5 6a.5.5 0 0 0-.5.5V7h12v-.5a.5.5 0 0 0-.5-.5h-11Z" fill="currentColor"/>
+  </svg>
+`, ut = `
+  <svg viewBox="0 0 20 20" class="icon-svg" aria-hidden="true" focusable="false">
+    <path d="M5.23 7.21a.75.75 0 0 1 1.06.02L10 11.12l3.71-3.9a.75.75 0 1 1 1.08 1.04l-4.25 4.47a.75.75 0 0 1-1.08 0L5.2 8.27a.75.75 0 0 1 .02-1.06Z" fill="currentColor"/>
+  </svg>
+`, ct = `
+  <svg viewBox="0 0 20 20" class="icon-svg" aria-hidden="true" focusable="false">
+    <path d="M5.22 5.22a.75.75 0 0 1 1.06 0L10 8.94l3.72-3.72a.75.75 0 1 1 1.06 1.06L11.06 10l3.72 3.72a.75.75 0 1 1-1.06 1.06L10 11.06l-3.72 3.72a.75.75 0 1 1-1.06-1.06L8.94 10 5.22 6.28a.75.75 0 0 1 0-1.06Z" fill="currentColor"/>
+  </svg>
+`, pt = `
+  :host {
+    --ui-dp-bg: color-mix(in srgb, var(--ui-color-surface, #ffffff) 96%, transparent);
+    --ui-dp-surface: linear-gradient(
+      180deg,
+      color-mix(in srgb, var(--ui-color-surface, #ffffff) 98%, transparent),
+      color-mix(in srgb, var(--ui-color-surface, #ffffff) 92%, var(--ui-color-surface-alt, #f8fafc))
+    );
+    --ui-dp-border: color-mix(in srgb, var(--ui-color-border, #cbd5e1) 76%, transparent);
+    --ui-dp-text: var(--ui-color-text, #0f172a);
+    --ui-dp-muted: var(--ui-color-muted, #64748b);
+    --ui-dp-accent: var(--ui-color-primary, #2563eb);
+    --ui-dp-success: var(--ui-color-success, #15803d);
+    --ui-dp-radius: 12px;
+    --ui-dp-panel-radius: calc(var(--ui-dp-radius) + 2px);
+    --ui-dp-field-error: var(--ui-color-danger, #dc2626);
+    --ui-dp-focus-ring: color-mix(in srgb, var(--ui-dp-accent) 26%, transparent);
+    --ui-dp-z: 1600;
+    --ui-dp-duration: 160ms;
+    --ui-dp-ease: cubic-bezier(0.2, 0.9, 0.24, 1);
+    color-scheme: light dark;
+    display: inline-grid;
+    inline-size: min(100%, var(--ui-width, 420px));
+    min-inline-size: min(240px, 100%);
+    color: var(--ui-dp-text);
+    font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
+  }
+
+  :host([shape="square"]) {
+    --ui-dp-radius: 6px;
+  }
+
+  :host([shape="soft"]) {
+    --ui-dp-radius: 16px;
+  }
+
+  .root {
+    display: grid;
+    gap: 8px;
+  }
+
+  .label {
+    font: 600 13px/1.35 Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
+    color: var(--ui-dp-text);
+    display: inline-flex;
+    align-items: center;
+    gap: 6px;
+  }
+
+  .label[hidden] { display: none; }
+
+  .required { color: var(--ui-dp-field-error); font-size: 11px; }
+
+  .fields {
+    display: grid;
+    grid-template-columns: auto minmax(0, 1fr) auto minmax(0, 1fr) auto auto;
+    align-items: center;
+    gap: 8px;
+    min-block-size: 42px;
+    border: 1px solid var(--ui-dp-border);
+    border-radius: var(--ui-dp-radius);
+    padding: 0 10px 0 11px;
+    background: var(--ui-dp-surface);
+    box-shadow: 0 1px 2px rgba(2, 6, 23, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.75);
+    transition: border-color var(--ui-dp-duration) var(--ui-dp-ease), box-shadow var(--ui-dp-duration) var(--ui-dp-ease);
+  }
+
+  .fields[data-single="true"] {
+    grid-template-columns: auto 1fr auto auto;
+  }
+
+  .fields:focus-within {
+    border-color: color-mix(in srgb, var(--ui-dp-accent) 72%, transparent);
+    box-shadow: 0 0 0 3px var(--ui-dp-focus-ring), 0 4px 14px rgba(2, 6, 23, 0.09);
+  }
+
+  .fields[data-open="true"] {
+    border-color: color-mix(in srgb, var(--ui-dp-accent) 72%, transparent);
+    box-shadow: 0 0 0 3px var(--ui-dp-focus-ring), 0 10px 24px rgba(2, 6, 23, 0.12);
+  }
+
+  .fields[data-invalid="true"] {
+    border-color: color-mix(in srgb, var(--ui-dp-field-error) 68%, transparent);
+    box-shadow: 0 0 0 3px color-mix(in srgb, var(--ui-dp-field-error) 20%, transparent);
+  }
+
+  .fields[data-state="success"]:not([data-invalid="true"]) {
+    border-color: color-mix(in srgb, var(--ui-dp-success) 56%, var(--ui-dp-border));
+    box-shadow: 0 0 0 3px color-mix(in srgb, var(--ui-dp-success) 20%, transparent);
+  }
+
+  .fields[data-state="loading"] {
+    pointer-events: none;
+    opacity: 0.92;
+  }
+
+  .icon {
+    display: inline-grid;
+    place-items: center;
+    color: color-mix(in srgb, var(--ui-dp-text) 68%, transparent);
+    inline-size: 20px;
+    block-size: 20px;
+  }
+
+  .icon-svg {
+    inline-size: 16px;
+    block-size: 16px;
+    pointer-events: none;
+  }
+
+  .input {
+    border: 0;
+    background: transparent;
+    color: var(--ui-dp-text);
+    min-inline-size: 0;
+    inline-size: 100%;
+    padding: 8px 0;
+    font: 500 14px/1.4 Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
+    letter-spacing: 0.005em;
+    outline: none;
+  }
+
+  .input::placeholder {
+    color: color-mix(in srgb, var(--ui-dp-text) 44%, transparent);
+  }
+
+  .sep {
+    color: var(--ui-dp-muted);
+    font-size: 12px;
+    user-select: none;
+  }
+
+  .btn {
+    border: 0;
+    background: transparent;
+    inline-size: 28px;
+    block-size: 28px;
+    border-radius: 8px;
+    color: color-mix(in srgb, var(--ui-dp-text) 72%, transparent);
+    cursor: pointer;
+    display: inline-grid;
+    place-items: center;
+    transition: background-color var(--ui-dp-duration) var(--ui-dp-ease), color var(--ui-dp-duration) var(--ui-dp-ease), transform var(--ui-dp-duration) var(--ui-dp-ease);
+  }
+
+  .btn:hover { background: color-mix(in srgb, var(--ui-dp-text) 10%, transparent); color: var(--ui-dp-text); }
+  .btn:active { transform: translateY(1px); }
+  .btn:focus-visible { outline: 2px solid color-mix(in srgb, var(--ui-dp-accent) 64%, transparent); outline-offset: 1px; }
+  .btn:disabled { cursor: not-allowed; opacity: 0.55; }
+  .toggle-icon { display: inline-grid; place-items: center; }
+  .spinner {
+    display: none;
+    inline-size: 14px;
+    block-size: 14px;
+    border-radius: 999px;
+    border: 2px solid color-mix(in srgb, var(--ui-dp-text) 20%, transparent);
+    border-top-color: color-mix(in srgb, var(--ui-dp-accent) 72%, transparent);
+    animation: ui-drp-spin 780ms linear infinite;
+  }
+  :host([state="loading"]) .toggle-icon { display: none; }
+  :host([state="loading"]) .spinner { display: inline-block; }
+  .btn[hidden] { display: none; }
+
+  .hint { color: var(--ui-dp-muted); font-size: 12px; line-height: 1.4; }
+  .error { color: var(--ui-dp-field-error); font-size: 12px; line-height: 1.4; }
+  .hint[hidden], .error[hidden] { display: none; }
+
+  .inline-panel {
+    border: 1px solid var(--ui-dp-border);
+    border-radius: var(--ui-dp-panel-radius);
+    background: var(--ui-dp-surface);
+    box-shadow: 0 18px 30px rgba(2, 6, 23, 0.12);
+    inline-size: fit-content;
+    max-inline-size: 100%;
+    justify-self: start;
+    padding: 10px;
+    display: grid;
+    gap: 10px;
+  }
+
+  .inline-panel[data-bare="true"] {
+    border: 0;
+    border-radius: 0;
+    background: var(--ui-dp-bare-bg, var(--ui-dp-bg));
+    box-shadow: none;
+    padding: 0;
+  }
+
+  .inline-panel[hidden] {
+    display: none !important;
+  }
+
+  .presets, .footer {
+    display: flex;
+    gap: 8px;
+    flex-wrap: wrap;
+    justify-content: flex-end;
+  }
+
+  .inline-panel .presets,
+  .inline-panel .footer {
+    gap: 6px;
+  }
+
+  .presets[hidden], .footer[hidden] {
+    display: none !important;
+  }
+
+  .action {
+    border: 1px solid color-mix(in srgb, var(--ui-dp-border) 85%, transparent);
+    background: color-mix(in srgb, var(--ui-dp-bg) 95%, transparent);
+    color: var(--ui-dp-text);
+    min-block-size: 32px;
+    border-radius: 8px;
+    padding: 0 12px;
+    font: 600 12px/1 Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
+    cursor: pointer;
+    transition: border-color var(--ui-dp-duration) var(--ui-dp-ease), background-color var(--ui-dp-duration) var(--ui-dp-ease), transform var(--ui-dp-duration) var(--ui-dp-ease);
+  }
+
+  .inline-panel .action {
+    min-block-size: 30px;
+    padding: 0 10px;
+  }
+
+  .action:hover {
+    border-color: color-mix(in srgb, var(--ui-dp-accent) 38%, var(--ui-dp-border));
+    background: color-mix(in srgb, var(--ui-dp-accent) 10%, transparent);
+  }
+
+  .action:active {
+    transform: translateY(1px);
+  }
+
+  .action:focus-visible {
+    outline: 2px solid color-mix(in srgb, var(--ui-dp-accent) 64%, transparent);
+    outline-offset: 1px;
+  }
+
+  .action[data-tone="primary"] {
+    border-color: color-mix(in srgb, var(--ui-dp-accent) 60%, transparent);
+    background: color-mix(in srgb, var(--ui-dp-accent) 20%, transparent);
+    color: color-mix(in srgb, var(--ui-dp-text) 94%, transparent);
+  }
+
+  .action:disabled {
+    cursor: not-allowed;
+    opacity: 0.55;
+  }
+
+  :host([disabled]) .fields { opacity: 0.62; pointer-events: none; }
+  :host([readonly]) .fields { background: color-mix(in srgb, var(--ui-dp-bg) 92%, var(--ui-color-surface-alt, #f8fafc)); }
+
+  :host([variant="contrast"]) {
+    --ui-dp-bg: #0f172a;
+    --ui-dp-border: #334155;
+    --ui-dp-text: #e2e8f0;
+    --ui-dp-muted: #93a4bd;
+    --ui-dp-accent: #93c5fd;
+    --ui-dp-surface: linear-gradient(180deg, color-mix(in srgb, #0f172a 86%, #1e293b), #0f172a);
+  }
+
+  :host([state="success"]) {
+    --ui-dp-focus-ring: color-mix(in srgb, var(--ui-dp-success) 26%, transparent);
+  }
+
+  @media (max-width: 640px) {
+    :host { inline-size: min(100%, var(--ui-width, 100%)); }
+    .fields { min-block-size: 40px; }
+  }
+
+  @media (prefers-reduced-motion: reduce) {
+    .fields,
+    .btn,
+    .action,
+    .spinner {
+      transition: none !important;
+      animation: none !important;
+    }
+  }
+
+  @media (forced-colors: active) {
+    .fields,
+    .inline-panel,
+    .action {
+      forced-color-adjust: none;
+      background: Canvas;
+      color: CanvasText;
+      border-color: CanvasText;
+    }
+    .fields:focus-within,
+    .btn:focus-visible,
+    .action:focus-visible {
+      outline-color: Highlight;
+    }
+    .spinner {
+      border-color: CanvasText;
+      border-top-color: CanvasText;
+    }
+  }
+
+  @keyframes ui-drp-spin {
+    to {
+      transform: rotate(360deg);
+    }
+  }
+`, ht = `
+  .overlay { position: fixed; z-index: var(--ui-dp-z, 1600); pointer-events: none; }
+  .panel {
+    pointer-events: auto;
+    inline-size: min(var(--ui-drp-panel-width, 26rem), calc(100vw - 16px));
+    max-inline-size: calc(100vw - 16px);
+    border: 1px solid var(--ui-dp-border, #cbd5e1);
+    border-radius: var(--ui-dp-panel-radius, 14px);
+    background: var(--ui-dp-surface, #fff);
+    color: var(--ui-dp-text, #0f172a);
+    box-shadow: 0 20px 34px rgba(2, 6, 23, 0.16);
+    padding: 10px;
+    display: grid;
+    gap: 10px;
+    transform-origin: top;
+    animation: ui-drp-pop-in var(--ui-dp-duration, 160ms) var(--ui-dp-ease, cubic-bezier(0.2, 0.9, 0.24, 1));
+  }
+  .panel[data-bare="true"], .sheet[data-bare="true"] {
+    border: 0;
+    border-radius: 0;
+    background: var(--ui-dp-bare-bg, var(--ui-dp-bg));
+    box-shadow: none;
+    padding: 0;
+  }
+  .sheet-wrap { position: fixed; inset: 0; display: grid; align-items: end; z-index: var(--ui-dp-z, 1600); }
+  .sheet-backdrop { position: absolute; inset: 0; background: rgba(15, 23, 42, 0.52); }
+  .sheet {
+    position: relative;
+    pointer-events: auto;
+    background: var(--ui-dp-bg, #fff);
+    color: var(--ui-dp-text, #0f172a);
+    border-radius: 16px 16px 0 0;
+    border: 1px solid color-mix(in srgb, var(--ui-dp-border, #cbd5e1) 84%, transparent);
+    box-shadow: 0 -12px 30px rgba(2, 6, 23, 0.2);
+    padding: 12px;
+    display: grid;
+    gap: 10px;
+    max-block-size: min(82vh, 640px);
+    overflow: auto;
+    animation: ui-drp-sheet-up var(--ui-dp-duration, 160ms) var(--ui-dp-ease, cubic-bezier(0.2, 0.9, 0.24, 1));
+  }
+  .header {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: 8px;
+  }
+  .title {
+    margin: 0;
+    font: 700 14px/1.3 Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
+    color: var(--ui-dp-text, #0f172a);
+  }
+  .presets, .footer { display: flex; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
+  .presets[hidden], .footer[hidden] { display: none !important; }
+  .action {
+    border: 1px solid color-mix(in srgb, var(--ui-dp-border, #cbd5e1) 85%, transparent);
+    background: color-mix(in srgb, var(--ui-dp-bg, #fff) 95%, transparent);
+    color: var(--ui-dp-text, #0f172a);
+    min-block-size: 32px;
+    border-radius: 8px;
+    padding: 0 12px;
+    font: 600 12px/1 Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
+    cursor: pointer;
+    transition: border-color var(--ui-dp-duration, 160ms) var(--ui-dp-ease, cubic-bezier(0.2, 0.9, 0.24, 1)), background-color var(--ui-dp-duration, 160ms) var(--ui-dp-ease, cubic-bezier(0.2, 0.9, 0.24, 1));
+  }
+  .action:hover { border-color: color-mix(in srgb, var(--ui-dp-accent, #2563eb) 38%, var(--ui-dp-border, #cbd5e1)); background: color-mix(in srgb, var(--ui-dp-accent, #2563eb) 10%, transparent); }
+  .action:focus-visible { outline: 2px solid color-mix(in srgb, var(--ui-dp-accent, #2563eb) 64%, transparent); outline-offset: 1px; }
+  .action[data-tone="primary"] { border-color: color-mix(in srgb, var(--ui-dp-accent, #2563eb) 60%, transparent); background: color-mix(in srgb, var(--ui-dp-accent, #2563eb) 18%, transparent); }
+  @media (prefers-reduced-motion: reduce) {
+    .panel, .sheet, .action { animation: none !important; transition: none !important; }
+  }
+  @keyframes ui-drp-pop-in {
+    from { opacity: 0; transform: translateY(6px) scale(0.985); }
+    to { opacity: 1; transform: translateY(0) scale(1); }
+  }
+  @keyframes ui-drp-sheet-up {
+    from { opacity: 0.82; transform: translateY(12px); }
+    to { opacity: 1; transform: translateY(0); }
+  }
+`;
+function Z(u) {
+  if (!u)
+    return { start: null, end: null };
+  try {
+    const t = JSON.parse(u), e = D((t == null ? void 0 : t.start) || null), i = D((t == null ? void 0 : t.end) || null);
+    return { start: e, end: i };
+  } catch {
+    return { start: null, end: null };
+  }
+}
+function J(u) {
+  return !u.start && !u.end ? null : JSON.stringify({
+    ...u.start ? { start: u.start } : {},
+    ...u.end ? { end: u.end } : {}
+  });
+}
+function _(u) {
+  return u.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#39;");
+}
+function ft(u, t) {
+  const e = u.trim();
+  if (!e)
+    return { start: null, end: null };
+  const i = e.split(/\s(?:—|–|to)\s/i).map((r) => r.trim()).filter(Boolean);
+  if (i.length > 1) {
+    const r = w(i[0] || "", t), c = w(i[1] || "", t);
+    return { start: r, end: c };
+  }
+  return { start: w(e, t), end: null };
+}
+class _t extends tt {
+  constructor() {
+    super(...arguments), this._value = { start: null, end: null }, this._pending = { start: null, end: null }, this._draftStart = "", this._draftEnd = "", this._draftSingle = "", this._inlineError = "", this._open = !1, this._syncing = !1, this._overlay = null, this._releaseScrollLock = null, this._isInitialized = !1, this._hasView = !1, this._restoreFocusEl = null, this._overlayMode = null, this._uid = `ui-drp-${++lt}`, this._singleId = `${this._uid}-single`, this._startId = `${this._uid}-start`, this._endId = `${this._uid}-end`, this._labelId = `${this._uid}-label`, this._hintId = `${this._uid}-hint`, this._errorId = `${this._uid}-error`, this._panelId = `${this._uid}-panel`, this._panelTitleId = `${this._uid}-panel-title`, this._overlayFocusedOnOpen = !1, this._inlineCalendarFramePending = !1, this._inlineCalendarUpgradePending = !1, this._schedulePosition = it(() => this._positionOverlay()), this._onRootClickBound = (t) => this._onRootClick(t), this._onRootInputBound = (t) => this._onRootInput(t), this._onRootBlurBound = (t) => this._onRootBlur(t), this._onRootKeyDownBound = (t) => this._onRootKeyDown(t), this._onDocumentPointerDownBound = (t) => this._onDocumentPointerDown(t), this._onDocumentKeyDownBound = (t) => this._onDocumentKeyDown(t), this._onWindowResizeBound = () => this._schedulePosition.run(), this._onWindowScrollBound = () => this._schedulePosition.run(), this._onOverlayClickBound = (t) => this._onOverlayClick(t), this._onOverlayCalendarBound = (t) => this._onOverlayCalendarChange(t);
+  }
+  static get observedAttributes() {
+    return [
+      "open",
+      "default-open",
+      "value",
+      "default-value",
+      "min",
+      "max",
+      "locale",
+      "translations",
+      "week-start",
+      "size",
+      "shape",
+      "bare",
+      "variant",
+      "state",
+      "range-variant",
+      "label",
+      "hint",
+      "error",
+      "allow-same-day",
+      "allow-partial",
+      "close-on-select",
+      "clearable",
+      "disabled",
+      "readonly",
+      "required",
+      "name",
+      "name-start",
+      "name-end",
+      "mode",
+      "show-footer"
+    ];
+  }
+  connectedCallback() {
+    if (super.connectedCallback(), this.root.addEventListener("click", this._onRootClickBound), this.root.addEventListener("input", this._onRootInputBound), this.root.addEventListener("focusout", this._onRootBlurBound), this.root.addEventListener("keydown", this._onRootKeyDownBound), !this._isInitialized) {
+      const t = Z(this.getAttribute("value") || this.getAttribute("default-value")), e = this._normalizePending(t);
+      this._value = e, this._pending = { ...e }, this._refreshDraftFromValue(), this._open = this.hasAttribute("open") || m(this.getAttribute("default-open")), this._isInitialized = !0;
+    }
+    this._open && !this._isInlineMode() && this._ensureOverlay(), this._isInlineMode() && this._scheduleInlineCalendarSync();
+  }
+  disconnectedCallback() {
+    this.root.removeEventListener("click", this._onRootClickBound), this.root.removeEventListener("input", this._onRootInputBound), this.root.removeEventListener("focusout", this._onRootBlurBound), this.root.removeEventListener("keydown", this._onRootKeyDownBound), this._destroyOverlay(), super.disconnectedCallback();
+  }
+  attributeChangedCallback(t, e, i) {
+    if (e !== i && (t === "value" && !this._syncing && (this._value = this._normalizePending(Z(i)), this._pending = { ...this._value }, this._refreshDraftFromValue(), this._inlineError = "", this._syncValueAttribute(this._value)), t === "open" && !this._syncing && (this._open = this.hasAttribute("open"), this._syncOverlay("attribute")), t === "mode" && this._syncOverlay("attribute"), t === "disabled" && this.hasAttribute("disabled") && this._setOpen(!1, "outside"), (t === "min" || t === "max") && !this._syncing && (this._value = this._normalizePending(this._value), this._pending = this._normalizePending(this._pending), this._syncValueAttribute(this._value), this._refreshDraftFromValue()), t === "state" && this._state() === "loading" && this._setOpen(!1, "outside"), !!this.isConnected)) {
+      if (!this._hasView) {
+        this.requestRender();
+        return;
+      }
+      this._updateHostState();
+    }
+  }
+  _isInlineMode() {
+    return (this.getAttribute("mode") || "popover") === "inline";
+  }
+  _isMobileSheet() {
+    return nt(this.getAttribute("mode"));
+  }
+  _isDisabled() {
+    return this.hasAttribute("disabled");
+  }
+  _state() {
+    const t = (this.getAttribute("state") || "").trim().toLowerCase();
+    return t === "loading" || t === "error" || t === "success" ? t : "idle";
+  }
+  _isInteractionBlocked() {
+    return this._isDisabled() || this._state() === "loading";
+  }
+  _isReadonly() {
+    return this.hasAttribute("readonly");
+  }
+  _clearable() {
+    return m(this.getAttribute("clearable"), !0);
+  }
+  _closeOnSelect() {
+    return m(this.getAttribute("close-on-select"), !1);
+  }
+  _shouldAutoCommit() {
+    return this._closeOnSelect() || !this._showFooter();
+  }
+  _showFooter() {
+    return m(this.getAttribute("show-footer"), !0);
+  }
+  _isBare() {
+    return m(this.getAttribute("bare"), !1);
+  }
+  _allowPartial() {
+    return m(this.getAttribute("allow-partial"), !0);
+  }
+  _allowSameDay() {
+    return m(this.getAttribute("allow-same-day"), !0);
+  }
+  _locale() {
+    return rt(this.getAttribute("locale"));
+  }
+  _translations() {
+    return et(
+      this.getAttribute("locale"),
+      this.getAttribute("translations")
+    );
+  }
+  _rangeVariant() {
+    return (this.getAttribute("range-variant") || "two-fields") === "single-field" ? "single-field" : "two-fields";
+  }
+  _minIso() {
+    return K(this.getAttribute("min"));
+  }
+  _maxIso() {
+    return K(this.getAttribute("max"));
+  }
+  _todayIso() {
+    const t = /* @__PURE__ */ new Date(), e = String(t.getMonth() + 1).padStart(2, "0"), i = String(t.getDate()).padStart(2, "0");
+    return `${t.getFullYear()}-${e}-${i}`;
+  }
+  _resolvedBounds() {
+    let t = this._minIso(), e = this._maxIso();
+    if (t && e && N(t, e) > 0) {
+      const i = t;
+      t = e, e = i;
+    }
+    return { min: t, max: e };
+  }
+  _refreshDraftFromValue() {
+    const t = j(this._value.start, this._locale(), "locale", null), e = j(this._value.end, this._locale(), "locale", null);
+    this._draftStart = t, this._draftEnd = e, this._draftSingle = [t, e].filter(Boolean).join(" — ");
+  }
+  _syncOpenAttribute(t) {
+    this._syncing = !0;
+    try {
+      t ? this.hasAttribute("open") || this.setAttribute("open", "") : this.hasAttribute("open") && this.removeAttribute("open");
+    } finally {
+      this._syncing = !1;
+    }
+  }
+  _syncValueAttribute(t) {
+    const e = J(t);
+    this._syncing = !0;
+    try {
+      e ? this.getAttribute("value") !== e && this.setAttribute("value", e) : this.hasAttribute("value") && this.removeAttribute("value");
+    } finally {
+      this._syncing = !1;
+    }
+  }
+  _emitInput(t) {
+    const e = {
+      mode: "range",
+      start: this._pending.start,
+      end: this._pending.end,
+      value: this._pending.start && this._pending.end ? { start: this._pending.start, end: this._pending.end } : null,
+      source: t
+    };
+    this.dispatchEvent(new CustomEvent("input", { detail: e, bubbles: !0, composed: !0 }));
+  }
+  _emitChange(t) {
+    const e = {
+      mode: "range",
+      start: this._value.start,
+      end: this._value.end,
+      value: this._value.start && this._value.end ? { start: this._value.start, end: this._value.end } : null,
+      source: t
+    };
+    this.dispatchEvent(new CustomEvent("change", { detail: e, bubbles: !0, composed: !0 }));
+  }
+  _emitInvalid(t, e) {
+    this.dispatchEvent(new CustomEvent("invalid", { detail: { raw: t, reason: e }, bubbles: !0, composed: !0 }));
+  }
+  _normalizePending(t) {
+    const { min: e, max: i } = this._resolvedBounds(), n = t.start ? Y(t.start, e, i) : null, r = t.end ? Y(t.end, e, i) : null;
+    return !n || !r ? { start: n, end: r } : N(n, r) > 0 ? { start: r, end: n } : { start: n, end: r };
+  }
+  _canCommit(t) {
+    return !t.start && !t.end ? !0 : !(!this._allowPartial() && (!t.start || !t.end) || t.start && t.end && !this._allowSameDay() && t.start === t.end);
+  }
+  _commit(t, e) {
+    if (this._isInteractionBlocked() || this._isReadonly())
+      return;
+    const i = this._normalizePending(t);
+    if (!this._canCommit(i)) {
+      this._inlineError = this.getAttribute("error") || this._translations().invalidRange, this._emitInvalid(JSON.stringify(t), "range"), this._updateHostState();
+      return;
+    }
+    this._value = i, this._pending = { ...i }, this._inlineError = "", this._refreshDraftFromValue(), this._syncValueAttribute(this._value), this._emitInput(e), this._emitChange(e), this._updateHostState();
+  }
+  _setOpen(t, e) {
+    t && this._isInteractionBlocked() || this._open !== t && (this._open = t, this._overlayFocusedOnOpen = !1, this._syncOpenAttribute(t), this._syncOverlay(e), this._updateHostState(), this.dispatchEvent(new CustomEvent(t ? "open" : "close", { bubbles: !0, composed: !0 })));
+  }
+  _syncOverlay(t) {
+    if (this._isInlineMode()) {
+      this._destroyOverlay();
+      return;
+    }
+    if (this._open) {
+      this._ensureOverlay(), this._syncOverlayState();
+      return;
+    }
+    this._destroyOverlay();
+    const e = this._restoreFocusEl || this.root.querySelector(".single, .start, .end");
+    if (this._restoreFocusEl = null, e && e.isConnected)
+      try {
+        e.focus();
+      } catch {
+      }
+  }
+  _ensureOverlay() {
+    if (this._overlay || typeof document > "u")
+      return;
+    const t = document.createElement("div");
+    t.className = "ui-date-range-picker-overlay-host", t.style.position = "fixed", t.style.left = "0", t.style.top = "0", t.style.zIndex = "1100", t.style.pointerEvents = "none", t.addEventListener("click", this._onOverlayClickBound), t.addEventListener("select", this._onOverlayCalendarBound), t.addEventListener("change", this._onOverlayCalendarBound), document.body.appendChild(t), this._overlay = t, document.addEventListener("pointerdown", this._onDocumentPointerDownBound, !0), document.addEventListener("keydown", this._onDocumentKeyDownBound), window.addEventListener("resize", this._onWindowResizeBound), window.addEventListener("scroll", this._onWindowScrollBound, !0), this._isMobileSheet() && (this._releaseScrollLock = W());
+  }
+  _destroyOverlay() {
+    this._overlay && (this._schedulePosition.cancel(), document.removeEventListener("pointerdown", this._onDocumentPointerDownBound, !0), document.removeEventListener("keydown", this._onDocumentKeyDownBound), window.removeEventListener("resize", this._onWindowResizeBound), window.removeEventListener("scroll", this._onWindowScrollBound, !0), this._overlay.removeEventListener("click", this._onOverlayClickBound), this._overlay.removeEventListener("select", this._onOverlayCalendarBound), this._overlay.removeEventListener("change", this._onOverlayCalendarBound), this._overlay.parentElement && this._overlay.parentElement.removeChild(this._overlay), this._overlay = null, this._overlayMode = null, this._releaseScrollLock && (this._releaseScrollLock(), this._releaseScrollLock = null));
+  }
+  _positionOverlay() {
+    if (!this._overlay || !this._open || this._isMobileSheet())
+      return;
+    const t = this.root.querySelector(".fields"), e = this._overlay.querySelector(".panel");
+    if (!t || !e)
+      return;
+    const i = t.getBoundingClientRect();
+    e.style.setProperty("--ui-drp-panel-width", `${Math.round(i.width)}px`);
+    const n = e.getBoundingClientRect(), r = st(i, n);
+    e.style.position = "absolute", e.style.top = `${Math.round(r.top)}px`, e.style.left = `${Math.round(r.left)}px`;
+  }
+  _renderPanelInner(t) {
+    const e = this._translations(), i = (this.getAttribute("label") || "").trim(), n = !!i || t, r = t ? "true" : "false", c = `
+      <header class="header" part="header" ${n ? "" : "hidden"}>
+        <p class="title" id="${this._panelTitleId}" ${i ? "" : "hidden"}>${_(i)}</p>
+        ${t ? `<button type="button" class="action" data-action="cancel">${_(e.cancel)}</button>` : ""}
+      </header>
+      <ui-calendar class="drp-calendar" part="calendar"></ui-calendar>
+      <div class="presets" part="presets">
+        <button type="button" class="action" data-action="preset-today">${_(e.today)}</button>
+        <button type="button" class="action" data-action="preset-last7">${_(e.last7Days)}</button>
+        <button type="button" class="action" data-action="preset-month">${_(e.thisMonth)}</button>
+      </div>
+      <footer class="footer" part="footer">
+        <button type="button" class="action" data-action="clear" part="clear">${_(e.clear)}</button>
+        <button type="button" class="action" data-action="cancel" part="cancel">${_(e.cancel)}</button>
+        <button type="button" class="action" data-action="apply" data-tone="primary" part="apply">${_(e.apply)}</button>
+      </footer>
+    `;
+    return `
+      <style>${ht}</style>
+      ${t ? '<div class="sheet-backdrop" data-action="backdrop"></div>' : ""}
+      <section class="${t ? "sheet" : "panel"}" id="${this._panelId}" role="dialog" aria-modal="${r}" aria-labelledby="${this._panelTitleId}" part="${t ? "sheet" : "popover"}">${c}</section>
+    `;
+  }
+  _syncCalendar(t) {
+    const e = (h, d) => {
+      if (d == null || d === "") {
+        t.hasAttribute(h) && t.removeAttribute(h);
+        return;
+      }
+      t.getAttribute(h) !== d && t.setAttribute(h, d);
+    }, i = J(this._pending), { min: n, max: r } = this._resolvedBounds();
+    e("selection", "range"), e("value", i), e("min", n), e("max", r), e("locale", this.getAttribute("locale")), e("translations", this.getAttribute("translations")), e("week-start", this.getAttribute("week-start"));
+    const l = this.getAttribute("size") || "sm";
+    e("size", l === "lg" ? "md" : "sm"), e("variant", this.getAttribute("variant")), e("outside-click", this.getAttribute("outside-click"));
+    const p = t.classList.contains("inline-calendar");
+    l === "lg" ? (t.style.setProperty("--ui-calendar-day-height", "1.95em"), t.style.setProperty("--ui-calendar-day-padding-block", "0.2em"), t.style.setProperty("--ui-calendar-day-padding-inline", "0.26em"), t.style.setProperty("--ui-calendar-gap", "0.42em"), t.style.setProperty("--ui-calendar-day-font-size", "0.78em"), t.style.setProperty("--ui-calendar-weekday-font-size", "0.7em"), t.style.setProperty("--ui-calendar-title-font-size", "0.88em")) : (t.style.setProperty("--ui-calendar-day-height", "2.4em"), t.style.setProperty("--ui-calendar-day-padding-block", "0.14em"), t.style.setProperty("--ui-calendar-day-padding-inline", "0.22em"), t.style.setProperty("--ui-calendar-gap", "0.34em"), t.style.setProperty("--ui-calendar-day-font-size", "0.72em"), t.style.setProperty("--ui-calendar-weekday-font-size", "0.64em"), t.style.setProperty("--ui-calendar-title-font-size", "0.8em")), p ? (t.style.setProperty("--ui-calendar-day-height", l === "lg" ? "2.1em" : "1.92em"), t.style.setProperty("--ui-calendar-day-padding-block", "0.08em"), t.style.setProperty("--ui-calendar-day-padding-inline", "0.14em"), t.style.setProperty("--ui-calendar-frame-padding", "0.28em"), t.style.setProperty("--ui-calendar-week-gap", "0.16em"), t.style.setProperty("--ui-calendar-control-height", "1.64em"), t.style.setProperty("--ui-calendar-gap", "0.2em"), t.style.setProperty("--ui-calendar-day-font-size", l === "lg" ? "0.76em" : "0.68em"), t.style.setProperty("--ui-calendar-weekday-font-size", l === "lg" ? "0.66em" : "0.58em"), t.style.setProperty("--ui-calendar-title-font-size", l === "lg" ? "0.84em" : "0.76em")) : (t.style.removeProperty("--ui-calendar-frame-padding"), t.style.removeProperty("--ui-calendar-week-gap"), t.style.removeProperty("--ui-calendar-control-height")), this._isReadonly() ? e("readonly", "") : e("readonly", null), this._isInteractionBlocked() ? e("disabled", "") : e("disabled", null), this._isBare() ? e("bare", "") : e("bare", null), e("tabindex", "-1"), e("aria-label", this.getAttribute("label") || this._translations().selectDateRange);
+  }
+  _ensureOverlayContent(t) {
+    if (!this._overlay)
+      return;
+    const e = t ? "sheet" : "popover";
+    this._overlayMode === e && this._overlay.querySelector(".drp-calendar") || (this._overlayMode = e, this._overlay.innerHTML = t ? `<div class="sheet-wrap">${this._renderPanelInner(!0)}</div>` : `<div class="overlay">${this._renderPanelInner(!1)}</div>`);
+  }
+  _syncOverlayState() {
+    if (!this._overlay)
+      return;
+    const t = this._isMobileSheet();
+    t && !this._releaseScrollLock ? this._releaseScrollLock = W() : !t && this._releaseScrollLock && (this._releaseScrollLock(), this._releaseScrollLock = null), this._ensureOverlayContent(t);
+    const e = this._overlay.querySelector(".title"), i = this._overlay.querySelector(".panel, .sheet"), n = this._overlay.querySelector(".header"), r = this._overlay.querySelector(".presets"), c = this._overlay.querySelector(".footer"), l = this._translations();
+    i && (i.dataset.bare = this._isBare() ? "true" : "false"), n && (n.hidden = !(this.getAttribute("label") || "").trim() && !t);
+    const p = this._showFooter();
+    if (r && (r.hidden = !p), c && (c.hidden = !p), e) {
+      const y = (this.getAttribute("label") || "").trim();
+      e.textContent = y, e.hidden = !y;
+    }
+    const h = this._overlay.querySelector('[data-action="preset-today"]');
+    h && (h.textContent = l.today);
+    const d = this._overlay.querySelector('[data-action="preset-last7"]');
+    d && (d.textContent = l.last7Days);
+    const b = this._overlay.querySelector('[data-action="preset-month"]');
+    b && (b.textContent = l.thisMonth);
+    const A = this._overlay.querySelector('[data-action="clear"]');
+    A && (A.textContent = l.clear);
+    const I = this._overlay.querySelector('[data-action="cancel"]');
+    I && (I.textContent = l.cancel);
+    const f = this._overlay.querySelector('[data-action="apply"]');
+    f && (f.textContent = l.apply);
+    const a = this._overlay.querySelectorAll(".action"), o = this._isInteractionBlocked() || this._isReadonly();
+    a.forEach((y) => {
+      y.disabled = o;
+    });
+    const s = this._overlay.querySelector(".drp-calendar");
+    s && (this._syncCalendar(s), this._open && !this._overlayFocusedOnOpen && (this._overlayFocusedOnOpen = !0, requestAnimationFrame(() => {
+      if (!(!this._open || !this._overlay))
+        try {
+          s.focus({ preventScroll: !0 });
+        } catch {
+        }
+    }))), t || this._schedulePosition.run();
+  }
+  _renderOverlay() {
+    this._syncOverlayState();
+  }
+  _renderInlineCalendar() {
+    const t = this.root.querySelector(".inline-calendar");
+    t && this._syncCalendar(t);
+  }
+  _scheduleInlineCalendarSync() {
+    const t = () => {
+      !this.isConnected || !this._hasView || !this._isInlineMode() || this._renderInlineCalendar();
+    };
+    t(), this._inlineCalendarFramePending || (this._inlineCalendarFramePending = !0, requestAnimationFrame(() => {
+      this._inlineCalendarFramePending = !1, t();
+    })), !this._inlineCalendarUpgradePending && typeof customElements < "u" && !customElements.get("ui-calendar") && (this._inlineCalendarUpgradePending = !0, customElements.whenDefined("ui-calendar").then(() => {
+      this._inlineCalendarUpgradePending = !1, requestAnimationFrame(() => {
+        t();
+      });
+    }));
+  }
+  _updateHostState() {
+    if (!this._hasView)
+      return;
+    const t = this.getAttribute("label") || "", e = this.getAttribute("hint") || "", i = this.getAttribute("error") || "", n = this._inlineError || i, r = this._translations(), c = n ? "error" : this._state(), l = this._rangeVariant(), p = this._isInlineMode(), h = !!(this._value.start || this._value.end || this._pending.start || this._pending.end), d = this._isInteractionBlocked(), b = this.root.querySelector(".label"), A = this.root.querySelector(".label-text"), I = this.root.querySelector(".required"), f = this.root.querySelector(".fields"), a = this.root.querySelector(".single"), o = this.root.querySelector(".start"), s = this.root.querySelector(".end"), y = this.root.querySelector(".sep"), k = this.root.querySelector('.btn[data-action="clear"]'), v = this.root.querySelector('.btn[data-action="toggle"]'), x = this.root.querySelector(".hint"), C = this.root.querySelector(".error"), g = this.root.querySelector(".inline-panel"), q = this.root.querySelector(".inline-panel .presets"), R = this.root.querySelector(".inline-panel .footer"), z = this.root.querySelector(".hidden-range"), O = this.root.querySelector(".hidden-start"), B = this.root.querySelector(".hidden-end"), G = this.root.querySelectorAll(".inline-panel .action");
+    b && (b.hidden = !t, b.id = this._labelId, b.setAttribute("for", l === "single-field" ? this._singleId : this._startId)), A && (A.textContent = t), I && (I.hidden = !this.hasAttribute("required")), f && (f.dataset.single = l === "single-field" ? "true" : "false", f.dataset.invalid = n ? "true" : "false", f.dataset.open = this._open && !p ? "true" : "false", f.dataset.state = c, f.setAttribute("aria-disabled", d ? "true" : "false")), a && (a.value !== this._draftSingle && (a.value = this._draftSingle), a.id = this._singleId, a.hidden = l !== "single-field", a.readOnly = this._isReadonly() || d, a.disabled = d, a.required = this.hasAttribute("required"), a.placeholder = r.startEnd, a.autocomplete = "off", a.setAttribute("role", "combobox"), a.setAttribute("aria-haspopup", "dialog"), a.setAttribute("aria-controls", this._panelId), a.setAttribute("aria-expanded", p ? "false" : String(this._open)), a.setAttribute("aria-invalid", n ? "true" : "false"), t ? a.setAttribute("aria-labelledby", this._labelId) : a.removeAttribute("aria-labelledby")), o && (o.value !== this._draftStart && (o.value = this._draftStart), o.id = this._startId, o.hidden = l === "single-field", o.readOnly = this._isReadonly() || d, o.disabled = d, o.required = this.hasAttribute("required"), o.placeholder = r.startDate, o.autocomplete = "off", o.setAttribute("role", "combobox"), o.setAttribute("aria-haspopup", "dialog"), o.setAttribute("aria-controls", this._panelId), o.setAttribute("aria-expanded", p ? "false" : String(this._open)), o.setAttribute("aria-invalid", n ? "true" : "false"), t ? o.setAttribute("aria-labelledby", this._labelId) : o.removeAttribute("aria-labelledby")), s && (s.value !== this._draftEnd && (s.value = this._draftEnd), s.id = this._endId, s.hidden = l === "single-field", s.readOnly = this._isReadonly() || d, s.disabled = d, s.required = this.hasAttribute("required"), s.placeholder = r.endDate, s.autocomplete = "off", s.setAttribute("role", "combobox"), s.setAttribute("aria-haspopup", "dialog"), s.setAttribute("aria-controls", this._panelId), s.setAttribute("aria-expanded", p ? "false" : String(this._open)), s.setAttribute("aria-invalid", n ? "true" : "false"), t ? s.setAttribute("aria-labelledby", this._labelId) : s.removeAttribute("aria-labelledby")), y && (y.hidden = l === "single-field"), k && (k.hidden = !(this._clearable() && h), k.disabled = d, k.setAttribute("aria-label", r.clearDateRange)), v && (v.hidden = p, v.disabled = d, v.setAttribute("aria-expanded", p ? "false" : String(this._open)), v.setAttribute("aria-controls", this._panelId), v.setAttribute("aria-label", r.toggleCalendar)), x && (x.id = this._hintId, x.hidden = !e, x.textContent = e), C && (C.id = this._errorId, C.hidden = !n, C.textContent = n);
+    const L = [];
+    e && x && !x.hidden && L.push(this._hintId), n && L.push(this._errorId);
+    const S = L.join(" ");
+    a && (S ? a.setAttribute("aria-describedby", S) : a.removeAttribute("aria-describedby")), o && (S ? o.setAttribute("aria-describedby", S) : o.removeAttribute("aria-describedby")), s && (S ? s.setAttribute("aria-describedby", S) : s.removeAttribute("aria-describedby")), g && (g.hidden = !p, g.id = this._panelId, g.dataset.bare = this._isBare() ? "true" : "false", g.setAttribute("role", "dialog"), g.setAttribute("aria-modal", "false"), g.setAttribute("aria-label", t || r.selectDateRange));
+    const E = this._showFooter();
+    q && (q.hidden = !E), R && (R.hidden = !E), G.forEach((X) => {
+      X.disabled = d || this._isReadonly();
+    });
+    const $ = this.root.querySelector('.inline-panel [data-action="preset-today"]');
+    $ && ($.textContent = r.today);
+    const M = this.root.querySelector('.inline-panel [data-action="preset-last7"]');
+    M && (M.textContent = r.last7Days);
+    const F = this.root.querySelector('.inline-panel [data-action="preset-month"]');
+    F && (F.textContent = r.thisMonth);
+    const V = this.root.querySelector('.inline-panel [data-action="clear"]');
+    V && (V.textContent = r.clear);
+    const H = this.root.querySelector('.inline-panel [data-action="apply"]');
+    H && (H.textContent = r.apply);
+    const P = this.getAttribute("name") || "", T = this.getAttribute("name-start") || "", U = this.getAttribute("name-end") || "", Q = this._value.start && this._value.end ? `${this._value.start}..${this._value.end}` : "";
+    if (z && (z.disabled = !P, z.name = P, z.value = Q), O && (O.disabled = !!P || !T, O.name = T, O.value = this._value.start || ""), B && (B.disabled = !!P || !U, B.name = U, B.value = this._value.end || ""), p) {
+      this._scheduleInlineCalendarSync(), this._destroyOverlay();
+      return;
+    }
+    this._open && this._syncOverlayState();
+  }
+  _onRootClick(t) {
+    const e = t.target;
+    if (!e)
+      return;
+    const i = e.closest("[data-action]"), n = i == null ? void 0 : i.getAttribute("data-action");
+    if (n && !this._isInteractionBlocked()) {
+      if (n === "toggle") {
+        this._restoreFocusEl = i, this._setOpen(!this._open, "toggle");
+        return;
+      }
+      if (n === "clear") {
+        this._commit({ start: null, end: null }, "clear");
+        return;
+      }
+      if (n === "apply") {
+        this._commit(this._pending, "apply"), this._isInlineMode() || this._setOpen(!1, "apply");
+        return;
+      }
+      n === "cancel" && (this._pending = { ...this._value }, this._isInlineMode() || this._setOpen(!1, "cancel"), this._updateHostState());
+    }
+  }
+  _onRootInput(t) {
+    const e = t.target;
+    if (!(e instanceof HTMLInputElement) || this._isInteractionBlocked() || this._isReadonly())
+      return;
+    if (this._rangeVariant() === "single-field" && e.classList.contains("single")) {
+      this._draftSingle = e.value, this._inlineError = "";
+      return;
+    }
+    e.classList.contains("start") && (this._draftStart = e.value, this._inlineError = ""), e.classList.contains("end") && (this._draftEnd = e.value, this._inlineError = "");
+  }
+  _commitFromDraft(t) {
+    if (this._rangeVariant() === "single-field") {
+      const r = this._draftSingle.trim();
+      if (!r)
+        return this._pending = { start: null, end: null }, this._commit(this._pending, t), !0;
+      const c = ft(r, this._locale());
+      return !c.start || !c.end && !this._allowPartial() ? (this._inlineError = this.getAttribute("error") || this._translations().invalidRange, this._emitInvalid(r, "parse"), this._updateHostState(), !1) : (this._pending = this._normalizePending({ start: c.start, end: c.end || null }), this._commit(this._pending, t), !0);
+    }
+    const i = this._draftStart ? w(this._draftStart, this._locale()) : null, n = this._draftEnd ? w(this._draftEnd, this._locale()) : null;
+    return this._draftStart && !i || this._draftEnd && !n ? (this._inlineError = this.getAttribute("error") || this._translations().invalidRange, this._emitInvalid(`${this._draftStart} ${this._draftEnd}`.trim(), "parse"), this._updateHostState(), !1) : (this._pending = this._normalizePending({ start: i, end: n }), this._commit(this._pending, t), !0);
+  }
+  _onRootBlur(t) {
+    var r;
+    if (this._isInteractionBlocked() || this._isReadonly())
+      return;
+    const e = t, i = e.target;
+    if (!(i instanceof HTMLInputElement))
+      return;
+    const n = e.relatedTarget;
+    n && ((r = this._overlay) != null && r.contains(n)) || this._open && !this._isInlineMode() || (i.classList.contains("single") || i.classList.contains("start") || i.classList.contains("end")) && (i.classList.contains("single") && (this._draftSingle = i.value), i.classList.contains("start") && (this._draftStart = i.value), i.classList.contains("end") && (this._draftEnd = i.value), this._commitFromDraft("blur"));
+  }
+  _onRootKeyDown(t) {
+    const e = t;
+    if (!this._isInteractionBlocked()) {
+      if (e.key === "Enter") {
+        const i = e.target;
+        if (!this._isReadonly() && i instanceof HTMLInputElement && (i.classList.contains("single") || i.classList.contains("start") || i.classList.contains("end"))) {
+          e.preventDefault(), i.classList.contains("single") && (this._draftSingle = i.value), i.classList.contains("start") && (this._draftStart = i.value), i.classList.contains("end") && (this._draftEnd = i.value), this._commitFromDraft("enter") && !this._isInlineMode() && this._setOpen(!1, "enter");
+          return;
+        }
+      }
+      if (e.key === "Escape" && this._open && !this._isInlineMode()) {
+        e.preventDefault(), this._setOpen(!1, "escape");
+        return;
+      }
+      e.key === "ArrowDown" && !this._open && !this._isInlineMode() && (e.preventDefault(), this._setOpen(!0, "keyboard"));
+    }
+  }
+  _onDocumentPointerDown(t) {
+    if (!this._open || !this._overlay)
+      return;
+    const e = t.composedPath();
+    e.includes(this) || e.includes(this._overlay) || this._setOpen(!1, "outside");
+  }
+  _onDocumentKeyDown(t) {
+    this._open && t.key === "Escape" && (t.preventDefault(), this._setOpen(!1, "escape"));
+  }
+  _onOverlayClick(t) {
+    const e = t.target;
+    if (!e)
+      return;
+    const i = e.closest("[data-action]"), n = i == null ? void 0 : i.getAttribute("data-action");
+    if (n && !(this._isInteractionBlocked() || this._isReadonly())) {
+      if (n === "backdrop") {
+        this._setOpen(!1, "outside");
+        return;
+      }
+      if (n === "clear") {
+        this._pending = { start: null, end: null }, this._emitInput("clear"), this._renderOverlay();
+        return;
+      }
+      if (n === "cancel") {
+        this._pending = { ...this._value }, this._setOpen(!1, "cancel");
+        return;
+      }
+      if (n === "apply") {
+        this._commit(this._pending, "apply"), this._setOpen(!1, "apply");
+        return;
+      }
+      if (n === "preset-today") {
+        const r = this._todayIso();
+        this._pending = this._normalizePending({ start: r, end: r }), this._emitInput("preset-today"), this._renderOverlay();
+        return;
+      }
+      if (n === "preset-last7") {
+        const r = this._todayIso();
+        this._pending = this._normalizePending(at(r, 7)), this._emitInput("preset-last7"), this._renderOverlay();
+        return;
+      }
+      if (n === "preset-month") {
+        const r = this._todayIso();
+        this._pending = this._normalizePending(ot(r)), this._emitInput("preset-month"), this._renderOverlay();
+      }
+    }
+  }
+  _onOverlayCalendarChange(t) {
+    if (this._isInteractionBlocked() || this._isReadonly())
+      return;
+    const e = t.target;
+    if (!e || e.tagName.toLowerCase() !== "ui-calendar")
+      return;
+    const i = t.detail;
+    if (!(!i || i.mode !== "range")) {
+      if (this._pending = this._normalizePending({
+        start: D(i.start || null),
+        end: D(i.end || null)
+      }), this._emitInput("calendar"), this._shouldAutoCommit() && this._pending.start && this._pending.end) {
+        this._commit(this._pending, "calendar"), this._isInlineMode() || this._setOpen(!1, "calendar");
+        return;
+      }
+      this._updateHostState();
+    }
+  }
+  render() {
+    this._hasView || (this.setContent(`
+        <style>${pt}</style>
+        <div class="root">
+          <label class="label" part="label" id="${this._labelId}">
+            <span class="label-text"></span>
+            <span class="required">*</span>
+          </label>
+          <div class="fields" part="field input" data-single="false">
+            <span class="icon" part="icon" aria-hidden="true">${dt}</span>
+            <input class="input single" id="${this._singleId}" part="input" />
+            <input class="input start" id="${this._startId}" part="input" />
+            <span class="sep">—</span>
+            <input class="input end" id="${this._endId}" part="input" />
+            <button type="button" class="btn" part="clear" data-action="clear">${ct}</button>
+            <button type="button" class="btn" part="toggle" data-action="toggle">
+              <span class="toggle-icon">${ut}</span>
+              <span class="spinner" aria-hidden="true"></span>
+            </button>
+          </div>
+          <div class="hint" id="${this._hintId}" part="hint"></div>
+          <div class="error" id="${this._errorId}" part="error" role="alert"></div>
+          <input class="hidden-range" type="hidden" disabled />
+          <input class="hidden-start" type="hidden" disabled />
+          <input class="hidden-end" type="hidden" disabled />
+          <section class="inline-panel" id="${this._panelId}" part="popover" hidden>
+            <ui-calendar class="inline-calendar" part="calendar"></ui-calendar>
+            <div class="presets" part="presets">
+              <button type="button" class="action" data-action="preset-today"></button>
+              <button type="button" class="action" data-action="preset-last7"></button>
+              <button type="button" class="action" data-action="preset-month"></button>
+            </div>
+            <footer class="footer" part="footer">
+              <button type="button" class="action" data-action="clear"></button>
+              <button type="button" class="action" data-action="apply" data-tone="primary"></button>
+            </footer>
+          </section>
+        </div>
+      `, { force: !0 }), this._hasView = !0), this._updateHostState();
+  }
+  shouldRenderOnAttributeChange(t, e, i) {
+    return !1;
+  }
+}
+typeof customElements < "u" && !customElements.get("ui-date-range-picker") && customElements.define("ui-date-range-picker", _t);
+export {
+  _t as UIDateRangePicker
+};