@xlabs-store/core 0.0.1 → 0.0.3

package/dist/esm/x-range-picker-dropdown-content.entry.js

@@ -1,819 +0,0 @@
-import { r as registerInstance, c as createEvent, a as getElement, h } from './index-ig_mFsVk.js';
-import { g as getIcon } from './config-BPeosvTA.js';
-import { t as translate } from './locale.service-D66tF8_2.js';
-
-const rangePickerDropdownContentCss = () => `:root{--x-color-primary:#1677ff;--x-color-primary-rgb:22, 119, 255;--x-color-primary-contrast:#ffffff;--x-color-primary-contrast-rgb:255, 255, 255;--x-color-primary-shade:#0958d9;--x-color-primary-tint:#4096ff;--x-color-primary-bg:#e6f4ff;--x-color-primary-bg-hover:#bae0ff;--x-color-primary-border:#91caff;--x-color-primary-border-hover:#69b1ff;--x-color-primary-hover:#4096ff;--x-color-primary-active:#0958d9;--x-color-primary-text:#1677ff;--x-color-primary-text-hover:#4096ff;--x-color-primary-text-active:#0958d9;--x-color-secondary:#3dc2ff;--x-color-secondary-rgb:61, 194, 255;--x-color-secondary-contrast:#ffffff;--x-color-secondary-contrast-rgb:255, 255, 255;--x-color-secondary-shade:#36abe0;--x-color-secondary-tint:#50c8ff;--x-color-success:#52c41a;--x-color-success-rgb:82, 196, 26;--x-color-success-contrast:#ffffff;--x-color-success-contrast-rgb:255, 255, 255;--x-color-success-shade:#389e0d;--x-color-success-tint:#73d13d;--x-color-success-bg:#f6ffed;--x-color-success-bg-hover:#d9f7be;--x-color-success-border:#b7eb8f;--x-color-success-border-hover:#95de64;--x-color-success-hover:#73d13d;--x-color-success-active:#389e0d;--x-color-success-text:#52c41a;--x-color-success-text-hover:#73d13d;--x-color-success-text-active:#389e0d;--x-color-warning:#faad14;--x-color-warning-rgb:250, 173, 20;--x-color-warning-contrast:#000000;--x-color-warning-contrast-rgb:0, 0, 0;--x-color-warning-shade:#d48806;--x-color-warning-tint:#ffc53d;--x-color-warning-bg:#fffbe6;--x-color-warning-bg-hover:#fff1b8;--x-color-warning-border:#ffe58f;--x-color-warning-border-hover:#ffd666;--x-color-warning-hover:#ffc53d;--x-color-warning-active:#d48806;--x-color-warning-text:#faad14;--x-color-warning-text-hover:#ffc53d;--x-color-warning-text-active:#d48806;--x-color-danger:#ff4d4f;--x-color-danger-rgb:255, 77, 79;--x-color-danger-contrast:#ffffff;--x-color-danger-contrast-rgb:255, 255, 255;--x-color-danger-shade:#cf1322;--x-color-danger-tint:#ff7875;--x-color-error:#ff4d4f;--x-color-error-rgb:255, 77, 79;--x-color-error-bg:#fff2f0;--x-color-error-bg-hover:#ffccc7;--x-color-error-border:#ffa39e;--x-color-error-border-hover:#ff7875;--x-color-error-hover:#ff7875;--x-color-error-active:#d9363e;--x-color-error-text:#ff4d4f;--x-color-error-text-hover:#ff7875;--x-color-error-text-active:#d9363e;--x-color-info:#1677ff;--x-color-info-rgb:22, 119, 255;--x-color-info-bg:#e6f4ff;--x-color-info-bg-hover:#bae0ff;--x-color-info-border:#91caff;--x-color-info-border-hover:#69b1ff;--x-color-info-hover:#69b1ff;--x-color-info-active:#0958d9;--x-color-info-text:#1677ff;--x-color-info-text-hover:#69b1ff;--x-color-info-text-active:#0958d9;--x-color-text:rgba(0, 0, 0, 0.88);--x-color-text-secondary:rgba(0, 0, 0, 0.65);--x-color-text-tertiary:rgba(0, 0, 0, 0.45);--x-color-text-quaternary:rgba(0, 0, 0, 0.25);--x-color-text-disabled:rgba(0, 0, 0, 0.25);--x-color-text-placeholder:rgba(0, 0, 0, 0.25);--x-color-text-heading:rgba(0, 0, 0, 0.88);--x-color-text-label:rgba(0, 0, 0, 0.65);--x-color-text-description:rgba(0, 0, 0, 0.45);--x-color-text-light-solid:#ffffff;--x-color-bg-container:#ffffff;--x-color-bg-elevated:#ffffff;--x-color-bg-layout:#f5f5f5;--x-color-bg-spotlight:rgba(0, 0, 0, 0.85);--x-color-bg-mask:rgba(0, 0, 0, 0.45);--x-color-bg-base:#ffffff;--x-color-bg-container-disabled:#f5f5f5;--x-color-bg-container-loading:rgba(255, 255, 255, 0.65);--x-color-white:#ffffff;--x-color-fill:rgba(0, 0, 0, 0.15);--x-color-fill-secondary:rgba(0, 0, 0, 0.06);--x-color-fill-tertiary:rgba(0, 0, 0, 0.04);--x-color-fill-quaternary:rgba(0, 0, 0, 0.02);--x-color-border:#d9d9d9;--x-color-border-secondary:#f0f0f0;--x-color-border-bg:#ffffff;--x-color-split:rgba(5, 5, 5, 0.06);--x-color-dark:#222428;--x-color-dark-rgb:34, 36, 40;--x-color-dark-contrast:#ffffff;--x-color-dark-contrast-rgb:255, 255, 255;--x-color-dark-shade:#1e2023;--x-color-dark-tint:#383a3e;--x-color-medium:#92949c;--x-color-medium-rgb:146, 148, 156;--x-color-medium-contrast:#ffffff;--x-color-medium-contrast-rgb:255, 255, 255;--x-color-medium-shade:#808289;--x-color-medium-tint:#9d9fa6;--x-color-light:#f4f5f8;--x-color-light-rgb:244, 245, 248;--x-color-light-contrast:#000000;--x-color-light-contrast-rgb:0, 0, 0;--x-color-light-shade:#d7d8da;--x-color-light-tint:#f5f6f9;--x-font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--x-font-family-code:"SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace;--x-font-size:14px;--x-font-size-sm:12px;--x-font-size-lg:16px;--x-font-size-xl:20px;--x-font-size-heading-1:38px;--x-font-size-heading-2:30px;--x-font-size-heading-3:24px;--x-font-size-heading-4:20px;--x-font-size-heading-5:16px;--x-line-height:1.5714285714285714;--x-line-height-lg:1.5;--x-line-height-sm:1.6666666666666667;--x-line-height-heading-1:1.2105263157894737;--x-line-height-heading-2:1.2666666666666666;--x-line-height-heading-3:1.3333333333333333;--x-line-height-heading-4:1.4;--x-line-height-heading-5:1.5;--x-font-weight-normal:400;--x-font-weight-medium:500;--x-font-weight-semibold:600;--x-font-weight-strong:600;--x-font-size-base:14px;--x-font-size-xxl:24px;--x-line-height-base:1.5714285714285714;--x-spacing-xxs:4px;--x-spacing-xs:8px;--x-spacing-sm:12px;--x-spacing-md:16px;--x-spacing-lg:20px;--x-spacing-xl:24px;--x-spacing-xxl:32px;--x-spacing-xxxl:48px;--x-margin-xxs:4px;--x-margin-xs:8px;--x-margin-sm:12px;--x-margin-md:16px;--x-margin-lg:24px;--x-margin-xl:32px;--x-margin-xxl:48px;--x-padding-xxs:4px;--x-padding-xs:8px;--x-padding-sm:12px;--x-padding-md:16px;--x-padding-lg:24px;--x-padding-content-horizontal-lg:24px;--x-padding-content-vertical-lg:12px;--x-padding-content-horizontal:16px;--x-padding-content-vertical:12px;--x-padding-content-horizontal-sm:16px;--x-padding-content-vertical-sm:8px;--x-border-radius:6px;--x-border-radius-xs:2px;--x-border-radius-sm:4px;--x-border-radius-lg:8px;--x-border-radius-xl:12px;--x-border-radius-outer:4px;--x-border-radius-base:6px;--x-border-width:1px;--x-border-width-base:1px;--x-shadow:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-shadow-secondary:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-shadow-tertiary:0 1px 2px 0 rgba(0, 0, 0, 0.03), 0 1px 6px -1px rgba(0, 0, 0, 0.02), 0 2px 4px 0 rgba(0, 0, 0, 0.02);--x-shadow-lg:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-secondary:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-tertiary:0 1px 2px 0 rgba(0, 0, 0, 0.03), 0 1px 6px -1px rgba(0, 0, 0, 0.02), 0 2px 4px 0 rgba(0, 0, 0, 0.02);--x-box-shadow-popover-arrow:2px 2px 5px rgba(0, 0, 0, 0.05);--x-box-shadow-card:0 1px 2px -2px rgba(0, 0, 0, 0.16), 0 3px 6px 0 rgba(0, 0, 0, 0.12), 0 5px 12px 4px rgba(0, 0, 0, 0.09);--x-box-shadow-drawer-right:-6px 0 16px 0 rgba(0, 0, 0, 0.08), -3px 0 6px -4px rgba(0, 0, 0, 0.12), -9px 0 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-drawer-left:6px 0 16px 0 rgba(0, 0, 0, 0.08), 3px 0 6px -4px rgba(0, 0, 0, 0.12), 9px 0 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-drawer-up:0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-drawer-down:0 -6px 16px 0 rgba(0, 0, 0, 0.08), 0 -3px 6px -4px rgba(0, 0, 0, 0.12), 0 -9px 28px 8px rgba(0, 0, 0, 0.05);--x-box-shadow-tabs-overflow-left:inset 10px 0 8px -8px rgba(0, 0, 0, 0.08);--x-box-shadow-tabs-overflow-right:inset -10px 0 8px -8px rgba(0, 0, 0, 0.08);--x-box-shadow-tabs-overflow-top:inset 0 10px 8px -8px rgba(0, 0, 0, 0.08);--x-box-shadow-tabs-overflow-bottom:inset 0 -10px 8px -8px rgba(0, 0, 0, 0.08);--x-motion-duration-fast:0.1s;--x-motion-duration-mid:0.2s;--x-motion-duration-slow:0.3s;--x-motion-ease-in-out:cubic-bezier(0.645, 0.045, 0.355, 1);--x-motion-ease-out:cubic-bezier(0.215, 0.61, 0.355, 1);--x-motion-ease-in:cubic-bezier(0.55, 0.055, 0.675, 0.19);--x-motion-ease-out-back:cubic-bezier(0.12, 0.4, 0.29, 1.46);--x-motion-ease-in-back:cubic-bezier(0.71, -0.46, 0.88, 0.6);--x-motion-ease-in-out-circle:cubic-bezier(0.78, 0.14, 0.15, 0.86);--x-motion-ease-out-circle:cubic-bezier(0.08, 0.82, 0.17, 1);--x-motion-ease-in-circle:cubic-bezier(0.6, 0.04, 0.98, 0.34);--x-motion-ease-in-quint:cubic-bezier(0.755, 0.05, 0.855, 0.06);--x-motion-ease-out-quint:cubic-bezier(0.23, 1, 0.32, 1);--x-z-index-base:0;--x-z-index-popup-base:1000;--x-z-index-popup:1030;--x-z-index-affix:10;--x-z-index-modal:1000;--x-z-index-modal-mask:1000;--x-z-index-drawer:1000;--x-z-index-popover:1030;--x-z-index-dropdown:1050;--x-z-index-tooltip:1070;--x-z-index-notification:1080;--x-z-index-message:1090;--x-z-index-popconfirm:1060;--x-z-index-table-fixed:10;--x-opacity-loading:0.65;--x-opacity-image:1;--x-opacity-disabled:0.5;--x-control-height:32px;--x-control-height-xs:24px;--x-control-height-sm:24px;--x-control-height-lg:40px;--x-control-radio-size:16px;--x-control-checkbox-size:16px;--x-control-padding-horizontal:12px;--x-control-padding-horizontal-sm:8px;--x-control-outline-width:2px;--x-control-outline:rgba(5, 145, 255, 0.1);--x-control-item-bg-hover:rgba(0, 0, 0, 0.04);--x-control-item-bg-active:#e6f4ff;--x-control-item-bg-active-hover:#bae0ff;--x-control-item-bg-active-disabled:rgba(0, 0, 0, 0.15);--x-control-tmp-outline:rgba(0, 0, 0, 0.02);--x-color-yellow:#fadb14;--x-color-yellow-rgb:250, 219, 20;--x-font-family-base:var(--x-font-family);--x-color-link:#1677ff;--x-color-link-hover:#69b1ff;--x-color-link-active:#0958d9;--x-color-icon:rgba(0, 0, 0, 0.45);--x-color-icon-hover:rgba(0, 0, 0, 0.88);--x-color-highlight:#ff4d4f;--x-color-bg-text-hover:rgba(0, 0, 0, 0.06);--x-color-bg-text-active:rgba(0, 0, 0, 0.15);--x-screen-xs:480px;--x-screen-xs-min:480px;--x-screen-xs-max:575px;--x-screen-sm:576px;--x-screen-sm-min:576px;--x-screen-sm-max:767px;--x-screen-md:768px;--x-screen-md-min:768px;--x-screen-md-max:991px;--x-screen-lg:992px;--x-screen-lg-min:992px;--x-screen-lg-max:1199px;--x-screen-xl:1200px;--x-screen-xl-min:1200px;--x-screen-xl-max:1599px;--x-screen-xxl:1600px;--x-screen-xxl-min:1600px;--x-color-fill-content:rgba(0, 0, 0, 0.06);--x-color-fill-content-hover:rgba(0, 0, 0, 0.15);--x-color-fill-alter:rgba(0, 0, 0, 0.02);--x-scrollbar-width:12px;--x-scrollbar-track-bg:rgba(0, 0, 0, 0.04);--x-scrollbar-thumb-bg:rgba(0, 0, 0, 0.25);--x-scrollbar-thumb-bg-hover:rgba(0, 0, 0, 0.35);--x-menu-dark-bg:#001529;--x-menu-dark-item-bg:#001529;--x-menu-dark-popup-bg:#001529;--x-menu-dark-submenu-item-bg:#000c17}.x-range-picker-dropdown{-webkit-box-sizing:border-box;box-sizing:border-box;margin:0;padding:0;color:var(--x-picker-color, var(--x-color-text, rgba(0, 0, 0, 0.88)));font-size:var(--x-picker-font-size, var(--x-font-size, 14px));line-height:var(--x-picker-line-height, var(--x-line-height, 1.5714285714));list-style:none;font-family:var(--x-picker-font-family, var(--x-font-family, inherit));background:var(--x-picker-bg, var(--x-color-bg-container, #ffffff));border-radius:var(--x-picker-border-radius, var(--x-border-radius-lg, 8px));-webkit-box-shadow:var(--x-picker-box-shadow, var(--x-box-shadow, 0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05)));box-shadow:var(--x-picker-box-shadow, var(--x-box-shadow, 0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05)))}.x-range-picker-dropdown-hidden{display:none}.x-range-picker-panel-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row}.x-range-picker-panels-wrapper{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}.x-range-picker-panels{display:-ms-inline-flexbox;display:inline-flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap}.x-range-picker-panel{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;width:var(--x-picker-panel-width, 260px);vertical-align:top}.x-range-picker-panel:not(:first-child){border-left:1px solid var(--x-picker-border-color, var(--x-color-split, rgba(5, 5, 5, 0.06)))}.x-range-picker-presets{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;min-width:120px;border-right:1px solid var(--x-picker-border-color, var(--x-color-split, rgba(5, 5, 5, 0.06)));padding:8px 0}.x-range-picker-presets-list{list-style:none;margin:0;padding:0}.x-range-picker-preset-item{padding:8px 12px;cursor:pointer;-webkit-transition:all 0.3s;transition:all 0.3s}.x-range-picker-preset-item:hover{background:var(--x-picker-cell-hover-bg, var(--x-control-item-bg-hover, rgba(0, 0, 0, 0.04)))}.x-range-picker-header{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;border-bottom:var(--x-picker-header-border-width, 1px) solid var(--x-picker-border-color, var(--x-color-split, rgba(5, 5, 5, 0.06)));padding:var(--x-picker-header-padding, 0 var(--x-padding-xs, 8px));height:var(--x-picker-header-height, 40px);background:var(--x-picker-header-bg, transparent)}.x-range-picker-header-view{display:-ms-flexbox;display:flex;gap:var(--x-padding-xs, 8px);-ms-flex:1;flex:1;text-align:center;font-weight:var(--x-picker-header-font-weight, var(--x-font-weight-strong, 600));color:var(--x-picker-header-color, var(--x-color-text, rgba(0, 0, 0, 0.88)));-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}.x-range-picker-header-view button{font-weight:var(--x-picker-header-font-weight, var(--x-font-weight-strong, 600));color:var(--x-picker-header-color, var(--x-color-text, rgba(0, 0, 0, 0.88)));background:transparent;border:0;cursor:pointer;padding:0;line-height:inherit}.x-range-picker-header-view button:hover{color:var(--x-color-primary, #1677ff)}.x-range-picker-header button{min-width:32px;font-size:14px;background:transparent;border:0;padding:0;cursor:pointer;color:var(--x-picker-header-btn-color, var(--x-color-icon, rgba(0, 0, 0, 0.45)));-webkit-transition:color 0.3s;transition:color 0.3s;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}.x-range-picker-header button:hover{color:var(--x-picker-header-btn-hover-color, var(--x-color-text, rgba(0, 0, 0, 0.88)))}.x-range-picker-header{-ms-flex-pack:center;justify-content:center;position:relative}.x-range-picker-body{padding:var(--x-picker-body-padding, var(--x-padding-xxs, 4px) var(--x-padding-xs, 8px))}.x-range-picker-content{width:100%;border-collapse:collapse;table-layout:fixed}.x-range-picker-content th,.x-range-picker-content td{position:relative;min-width:var(--x-picker-cell-size, 24px);font-weight:400;-webkit-transition:background 0.3s;transition:background 0.3s}.x-range-picker-content th{height:var(--x-picker-content-th-height, 30px);color:var(--x-picker-content-th-color, var(--x-color-text, rgba(0, 0, 0, 0.88)));line-height:var(--x-picker-content-th-height, 30px);text-align:center}.x-range-picker-content td{height:var(--x-picker-cell-height, 24px);padding:var(--x-picker-cell-padding, 3px 0)}.x-range-picker-cell{cursor:pointer;position:relative;z-index:1}.x-range-picker-cell-inner{display:block;min-width:var(--x-picker-cell-size, 24px);min-height:var(--x-picker-cell-height, 24px);line-height:var(--x-picker-cell-height, 24px);margin:0 auto;border-radius:var(--x-picker-cell-border-radius, var(--x-border-radius-xs, 2px));-webkit-transition:background 0.3s, border 0.3s;transition:background 0.3s, border 0.3s;text-align:center;-webkit-box-sizing:border-box;box-sizing:border-box;z-index:2;position:relative}.x-range-picker-cell:hover .x-range-picker-cell-inner{background:var(--x-picker-cell-hover-bg, var(--x-control-item-bg-hover, rgba(0, 0, 0, 0.04)))}.x-range-picker-cell-today .x-range-picker-cell-inner{border:1px solid var(--x-picker-cell-today-border-color, var(--x-color-primary, #1677ff))}.x-range-picker-cell-selected .x-range-picker-cell-inner,.x-range-picker-cell-range-start .x-range-picker-cell-inner,.x-range-picker-cell-range-end .x-range-picker-cell-inner{background:var(--x-picker-cell-selected-color, var(--x-color-primary, #1677ff));color:#fff}.x-range-picker-cell-in-range{position:relative}.x-range-picker-cell-in-range::before{content:"";position:absolute;top:50%;left:0;right:0;height:24px;margin-top:-12px;background:var(--x-picker-cell-selected-bg, var(--x-color-primary-bg, #e6f4ff));z-index:0}.x-range-picker-cell-in-range:first-child::before{border-top-left-radius:2px;border-bottom-left-radius:2px}.x-range-picker-cell-in-range:last-child::before{border-top-right-radius:2px;border-bottom-right-radius:2px}.x-range-picker-cell-range-start::before{left:50%}.x-range-picker-cell-range-end::before{right:50%}.x-range-picker-cell-disabled{cursor:not-allowed;color:rgba(0, 0, 0, 0.25)}.x-range-picker-cell-disabled-inner{background:rgba(0, 0, 0, 0.04)}.x-range-picker-cell-disabled::before{background:rgba(0, 0, 0, 0.04)}.x-range-picker-cell-disabled:hover .x-range-picker-cell-disabled-inner{background:rgba(0, 0, 0, 0.04)}.x-range-picker-time-panel{display:block;height:auto}.x-range-picker-time-content{display:-ms-flexbox;display:flex;height:224px;border-top:1px solid var(--x-picker-border-color, var(--x-color-split, rgba(5, 5, 5, 0.06)))}.x-range-picker-time-column{-ms-flex:1;flex:1;overflow-y:auto;border-right:1px solid var(--x-picker-border-color, var(--x-color-split, rgba(5, 5, 5, 0.06)));position:relative}.x-range-picker-time-column:last-child{border-right:0}.x-range-picker-time-column::-webkit-scrollbar{width:6px;height:6px}.x-range-picker-time-column::-webkit-scrollbar-thumb{background:rgba(0, 0, 0, 0.35);border-radius:3px}.x-range-picker-time-column::-webkit-scrollbar-track{background:rgba(0, 0, 0, 0.02)}.x-range-picker-time-list{list-style:none;margin:0;padding:0;padding-bottom:196px}.x-range-picker-time-cell{height:28px;line-height:28px;padding-left:12px;cursor:pointer;-webkit-transition:background 0.3s;transition:background 0.3s}.x-range-picker-time-cell:hover{background:var(--x-picker-cell-hover-bg, var(--x-control-item-bg-hover, rgba(0, 0, 0, 0.04)))}.x-range-picker-time-cell-selected{background:var(--x-picker-cell-selected-bg, var(--x-color-primary-bg, #e6f4ff));font-weight:600;color:var(--x-picker-cell-selected-color, var(--x-color-primary, #1677ff))}.x-range-picker-footer{border-top:var(--x-picker-footer-border-top, 1px solid var(--x-picker-border-color, var(--x-color-split, rgba(5, 5, 5, 0.06))));padding:var(--x-picker-footer-padding, 0 var(--x-padding-xs, 8px));line-height:var(--x-picker-footer-line-height, 38px);text-align:center;background:var(--x-picker-footer-bg, transparent);display:-ms-flexbox;display:flex;-ms-flex-pack:end;justify-content:flex-end}.x-range-picker-ok-btn{background:var(--x-color-primary, #1677ff);color:#fff;border:0;padding:0 16px;height:24px;line-height:24px;border-radius:2px;cursor:pointer;font-size:12px}.x-range-picker-ok-btn:hover{background:var(--x-color-primary-hover, #4096ff)}.x-range-picker-ok-btn-disabled{cursor:not-allowed;background:rgba(0, 0, 0, 0.04);color:rgba(0, 0, 0, 0.25)}.x-range-picker-ok-btn-disabled:hover{background:rgba(0, 0, 0, 0.04)}`;
-
-const DEFAULT_WEEK_DAYS = ['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa'];
-const DEFAULT_MONTHS_FULL = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];
-const DEFAULT_MONTHS_SHORT = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
-const DEFAULT_QUARTERS = [
-    { label: 'Q1', value: 1, months: 'Jan - Mar' },
-    { label: 'Q2', value: 2, months: 'Apr - Jun' },
-    { label: 'Q3', value: 3, months: 'Jul - Sep' },
-    { label: 'Q4', value: 4, months: 'Oct - Dec' },
-];
-const XRangePickerDropdownContent = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.xDateClick = createEvent(this, "xDateClick", 7);
-        this.xDateHover = createEvent(this, "xDateHover", 7);
-        this.xHeaderAction = createEvent(this, "xHeaderAction", 7);
-        this.xPresetClick = createEvent(this, "xPresetClick", 7);
-        this.xOkClick = createEvent(this, "xOkClick", 7);
-        this.xMonthClick = createEvent(this, "xMonthClick", 7);
-        this.xYearClick = createEvent(this, "xYearClick", 7);
-        this.xQuarterClick = createEvent(this, "xQuarterClick", 7);
-        this.xPanelModeChange = createEvent(this, "xPanelModeChange", 7);
-        this.xTimeChange = createEvent(this, "xTimeChange", 7);
-    }
-    get el() { return getElement(this); }
-    // ==================== Props ====================
-    /**
-     * Class map for dropdown wrapper.
-     * @example
-     * <x-range-picker-dropdown-content dropdownClasses={{ 'x-range-dropdown': true }}></x-range-picker-dropdown-content>
-     */
-    dropdownClasses = {};
-    /**
-     * Inline style map for dropdown wrapper.
-     * @example
-     * <x-range-picker-dropdown-content dropdownStyle={{ width: '480px' }}></x-range-picker-dropdown-content>
-     */
-    dropdownStyle = {};
-    /**
-     * Callback to pass dropdown element ref.
-     * @example
-     * <x-range-picker-dropdown-content setDropdownRef={(el) => console.log(el)}></x-range-picker-dropdown-content>
-     */
-    setDropdownRef;
-    /**
-     * View date for left panel.
-     * @example
-     * <x-range-picker-dropdown-content leftViewDate={new Date()}></x-range-picker-dropdown-content>
-     */
-    leftViewDate = new Date();
-    /**
-     * View date for right panel.
-     * @example
-     * <x-range-picker-dropdown-content rightViewDate={new Date()}></x-range-picker-dropdown-content>
-     */
-    rightViewDate = new Date();
-    /**
-     * Panel mode for left panel.
-     * @example
-     * <x-range-picker-dropdown-content leftPanelMode="month"></x-range-picker-dropdown-content>
-     */
-    leftPanelMode = 'date';
-    /**
-     * Panel mode for right panel.
-     * @example
-     * <x-range-picker-dropdown-content rightPanelMode="year"></x-range-picker-dropdown-content>
-     */
-    rightPanelMode = 'date';
-    /**
-     * Picker mode.
-     * @example
-     * <x-range-picker-dropdown-content picker="date"></x-range-picker-dropdown-content>
-     */
-    picker = 'date';
-    /**
-     * Selected start date.
-     * @example
-     * <x-range-picker-dropdown-content rangeStart={new Date()}></x-range-picker-dropdown-content>
-     */
-    rangeStart = null;
-    /**
-     * Selected end date.
-     * @example
-     * <x-range-picker-dropdown-content rangeEnd={new Date()}></x-range-picker-dropdown-content>
-     */
-    rangeEnd = null;
-    /**
-     * Date being hovered during selection.
-     * @example
-     * <x-range-picker-dropdown-content hoveringDate={new Date()}></x-range-picker-dropdown-content>
-     */
-    hoveringDate = null;
-    /**
-     * Which panel is currently active.
-     * @example
-     * <x-range-picker-dropdown-content activePanel="right"></x-range-picker-dropdown-content>
-     */
-    activePanel = 'left';
-    /**
-     * Preset ranges.
-     * @example
-     * <x-range-picker-dropdown-content presets={[{ label: 'Today', value: [new Date(), new Date()] }]}></x-range-picker-dropdown-content>
-     */
-    presets = [];
-    /**
-     * Whether to show time picker.
-     * @example
-     * <x-range-picker-dropdown-content showTime></x-range-picker-dropdown-content>
-     */
-    showTime = false;
-    /**
-     * Function to determine if a date is disabled.
-     * @example
-     * <x-range-picker-dropdown-content disabledDateFn={(d) => d.getDay() === 0}></x-range-picker-dropdown-content>
-     */
-    disabledDateFn;
-    /**
-     * Minimum selectable date (ISO string).
-     * @example
-     * <x-range-picker-dropdown-content minDate="2026-01-01"></x-range-picker-dropdown-content>
-     */
-    minDate;
-    /**
-     * Maximum selectable date (ISO string).
-     * @example
-     * <x-range-picker-dropdown-content maxDate="2026-12-31"></x-range-picker-dropdown-content>
-     */
-    maxDate;
-    /**
-     * Week start day (0 = Sunday, 1 = Monday, etc.).
-     * @example
-     * <x-range-picker-dropdown-content weekStartDay={1}></x-range-picker-dropdown-content>
-     */
-    weekStartDay = 0;
-    // ==================== Events ====================
-    /**
-     * Emitted when a date cell is clicked.
-     * @example
-     * <x-range-picker-dropdown-content onXDateClick={(ev) => console.log(ev.detail)}></x-range-picker-dropdown-content>
-     */
-    xDateClick;
-    /**
-     * Emitted when a date cell is hovered.
-     * @example
-     * <x-range-picker-dropdown-content onXDateHover={(ev) => console.log(ev.detail)}></x-range-picker-dropdown-content>
-     */
-    xDateHover;
-    /**
-     * Emitted when header navigation action occurs.
-     * @example
-     * <x-range-picker-dropdown-content onXHeaderAction={(ev) => console.log(ev.detail)}></x-range-picker-dropdown-content>
-     */
-    xHeaderAction;
-    /**
-     * Emitted when a preset is clicked.
-     * @example
-     * <x-range-picker-dropdown-content onXPresetClick={(ev) => console.log(ev.detail)}></x-range-picker-dropdown-content>
-     */
-    xPresetClick;
-    /**
-     * Emitted when OK button is clicked.
-     * @example
-     * <x-range-picker-dropdown-content onXOkClick={() => {}}></x-range-picker-dropdown-content>
-     */
-    xOkClick;
-    /**
-     * Emitted when month cell is clicked.
-     * @example
-     * <x-range-picker-dropdown-content onXMonthClick={(ev) => console.log(ev.detail)}></x-range-picker-dropdown-content>
-     */
-    xMonthClick;
-    /**
-     * Emitted when year cell is clicked.
-     * @example
-     * <x-range-picker-dropdown-content onXYearClick={(ev) => console.log(ev.detail)}></x-range-picker-dropdown-content>
-     */
-    xYearClick;
-    /**
-     * Emitted when quarter cell is clicked.
-     * @example
-     * <x-range-picker-dropdown-content onXQuarterClick={(ev) => console.log(ev.detail)}></x-range-picker-dropdown-content>
-     */
-    xQuarterClick;
-    /**
-     * Emitted when panel mode changes.
-     * @example
-     * <x-range-picker-dropdown-content onXPanelModeChange={(ev) => console.log(ev.detail)}></x-range-picker-dropdown-content>
-     */
-    xPanelModeChange;
-    /**
-     * Emitted when time selection changes.
-     * @example
-     * <x-range-picker-dropdown-content onXTimeChange={(ev) => console.log(ev.detail)}></x-range-picker-dropdown-content>
-     */
-    xTimeChange;
-    // ==================== Refs ====================
-    /**
-     * Dropdown element reference.
-     */
-    dropdownEl = null;
-    // ==================== Lifecycle ====================
-    componentDidLoad() {
-        this.setDropdownRef?.(this.dropdownEl);
-    }
-    disconnectedCallback() {
-        this.setDropdownRef?.(null);
-    }
-    // ==================== Private Methods ====================
-    /**
-     * Capture dropdown ref and forward to callback.
-     * @param el - Dropdown element.
-     * @returns void
-     */
-    setRef = (el) => {
-        this.dropdownEl = el;
-        this.setDropdownRef?.(el);
-    };
-    /**
-     * Convert date to yyyy-mm-dd.
-     * @param date - Date to format.
-     * @returns string
-     */
-    toDateString(date) {
-        const year = date.getFullYear();
-        const month = String(date.getMonth() + 1).padStart(2, '0');
-        const day = String(date.getDate()).padStart(2, '0');
-        return `${year}-${month}-${day}`;
-    }
-    /**
-     * Parse date from ISO string.
-     * @param dateStr - Date string.
-     * @returns Date | null
-     */
-    parseDate(dateStr) {
-        if (!dateStr)
-            return null;
-        const date = new Date(dateStr);
-        return isNaN(date.getTime()) ? null : date;
-    }
-    /**
-     * Get week day labels based on weekStartDay.
-     * @returns string[]
-     */
-    getWeekDays() {
-        const localeWeekDays = translate('DatePicker.lang.weekDays', undefined, DEFAULT_WEEK_DAYS);
-        const days = [...localeWeekDays];
-        for (let i = 0; i < this.weekStartDay; i++) {
-            const first = days.shift();
-            if (first !== undefined) {
-                days.push(first);
-            }
-        }
-        return days;
-    }
-    /**
-     * Format number as two digits.
-     * @param n - Number to format.
-     * @returns string
-     */
-    formatNumber(n) {
-        return String(n).padStart(2, '0');
-    }
-    /**
-     * Get all hour values.
-     * @returns number[]
-     */
-    getHours() {
-        const hours = [];
-        for (let i = 0; i < 24; i++) {
-            hours.push(i);
-        }
-        return hours;
-    }
-    /**
-     * Get all minute values.
-     * @returns number[]
-     */
-    getMinutes() {
-        const minutes = [];
-        for (let i = 0; i < 60; i++) {
-            minutes.push(i);
-        }
-        return minutes;
-    }
-    /**
-     * Get all second values.
-     * @returns number[]
-     */
-    getSeconds() {
-        const seconds = [];
-        for (let i = 0; i < 60; i++) {
-            seconds.push(i);
-        }
-        return seconds;
-    }
-    /**
-     * Determine whether a date is disabled.
-     * @param date - Date to check.
-     * @returns boolean
-     */
-    isDateDisabled(date) {
-        const dateStr = this.toDateString(date);
-        // Check minDate
-        if (this.minDate) {
-            const min = this.parseDate(this.minDate);
-            if (min && date < min)
-                return true;
-        }
-        // Check maxDate
-        if (this.maxDate) {
-            const max = this.parseDate(this.maxDate);
-            if (max && date > max)
-                return true;
-        }
-        // Check custom disabledDate function
-        if (this.disabledDateFn) {
-            return this.disabledDateFn(dateStr);
-        }
-        return false;
-    }
-    /**
-     * Check if date is today.
-     * @param date - Date to check.
-     * @returns boolean
-     */
-    isToday(date) {
-        const today = new Date();
-        return date.toDateString() === today.toDateString();
-    }
-    /**
-     * Check if date equals range start.
-     * @param date - Date to check.
-     * @returns boolean
-     */
-    isRangeStart(date) {
-        if (!this.rangeStart)
-            return false;
-        return date.toDateString() === this.rangeStart.toDateString();
-    }
-    /**
-     * Check if date equals range end.
-     * @param date - Date to check.
-     * @returns boolean
-     */
-    isRangeEnd(date) {
-        if (!this.rangeEnd)
-            return false;
-        return date.toDateString() === this.rangeEnd.toDateString();
-    }
-    /**
-     * Check if date is between start and end.
-     * @param date - Date to check.
-     * @returns boolean
-     */
-    isInRange(date) {
-        const start = this.rangeStart;
-        const end = this.rangeEnd || this.hoveringDate;
-        if (!start || !end)
-            return false;
-        const dateTime = date.getTime();
-        const startTime = start.getTime();
-        const endTime = end.getTime();
-        if (startTime <= endTime) {
-            return dateTime > startTime && dateTime < endTime;
-        }
-        else {
-            return dateTime > endTime && dateTime < startTime;
-        }
-    }
-    /**
-     * Check if date is within hover range.
-     * @param date - Date to check.
-     * @returns boolean
-     */
-    isInHoverRange(date) {
-        if (!this.rangeStart || !this.hoveringDate || this.rangeEnd)
-            return false;
-        const dateTime = date.getTime();
-        const startTime = this.rangeStart.getTime();
-        const hoverTime = this.hoveringDate.getTime();
-        if (startTime <= hoverTime) {
-            return dateTime > startTime && dateTime <= hoverTime;
-        }
-        else {
-            return dateTime >= hoverTime && dateTime < startTime;
-        }
-    }
-    /**
-     * Build calendar grid for a view month.
-     * @param viewDate - View month date.
-     * @returns RangeCalendarDayData[][]
-     */
-    getCalendarDays(viewDate) {
-        const year = viewDate.getFullYear();
-        const month = viewDate.getMonth();
-        const firstDayOfMonth = new Date(year, month, 1);
-        const lastDayOfMonth = new Date(year, month + 1, 0);
-        let startDay = firstDayOfMonth.getDay() - this.weekStartDay;
-        if (startDay < 0)
-            startDay += 7;
-        const daysInMonth = lastDayOfMonth.getDate();
-        const weeks = [];
-        let days = [];
-        // Previous month days
-        const prevMonth = new Date(year, month, 0);
-        const prevMonthDays = prevMonth.getDate();
-        for (let i = startDay - 1; i >= 0; i--) {
-            const date = new Date(year, month - 1, prevMonthDays - i);
-            days.push({
-                date,
-                isCurrentMonth: false,
-                isToday: this.isToday(date),
-                isDisabled: this.isDateDisabled(date),
-                isRangeStart: this.isRangeStart(date),
-                isRangeEnd: this.isRangeEnd(date),
-                isInRange: this.isInRange(date),
-            });
-        }
-        // Current month days
-        for (let d = 1; d <= daysInMonth; d++) {
-            const date = new Date(year, month, d);
-            days.push({
-                date,
-                isCurrentMonth: true,
-                isToday: this.isToday(date),
-                isDisabled: this.isDateDisabled(date),
-                isRangeStart: this.isRangeStart(date),
-                isRangeEnd: this.isRangeEnd(date),
-                isInRange: this.isInRange(date),
-            });
-            if (days.length === 7) {
-                weeks.push(days);
-                days = [];
-            }
-        }
-        // Next month days
-        if (days.length > 0) {
-            let nextDay = 1;
-            while (days.length < 7) {
-                const date = new Date(year, month + 1, nextDay++);
-                days.push({
-                    date,
-                    isCurrentMonth: false,
-                    isToday: this.isToday(date),
-                    isDisabled: this.isDateDisabled(date),
-                    isRangeStart: this.isRangeStart(date),
-                    isRangeEnd: this.isRangeEnd(date),
-                    isInRange: this.isInRange(date),
-                });
-            }
-            weeks.push(days);
-        }
-        // Ensure 6 weeks for consistent height
-        while (weeks.length < 6) {
-            days = [];
-            const lastDate = weeks[weeks.length - 1][6].date;
-            for (let i = 1; i <= 7; i++) {
-                const date = new Date(lastDate);
-                date.setDate(lastDate.getDate() + i);
-                days.push({
-                    date,
-                    isCurrentMonth: false,
-                    isToday: this.isToday(date),
-                    isDisabled: this.isDateDisabled(date),
-                    isRangeStart: this.isRangeStart(date),
-                    isRangeEnd: this.isRangeEnd(date),
-                    isInRange: this.isInRange(date),
-                });
-            }
-            weeks.push(days);
-        }
-        return weeks;
-    }
-    // ==================== Event Handlers ====================
-    /**
-     * Handle date cell click and emit selection.
-     * @param e - Mouse event.
-     * @param day - Calendar day data.
-     * @param side - Panel side.
-     * @returns void
-     */
-    handleDateClick = (e, day, side) => {
-        console.log('handleDateClick', day, e);
-        e.stopPropagation();
-        if (day.isDisabled)
-            return;
-        this.xDateClick.emit({
-            date: day.date,
-            side,
-        });
-    };
-    /**
-     * Handle date cell hover and emit event.
-     * @param e - Mouse event.
-     * @param day - Calendar day data.
-     * @param side - Panel side.
-     * @returns void
-     */
-    handleDateHover = (e, day, side) => {
-        // console.log('handleDateHover', day, e);
-        e.stopPropagation();
-        if (day.isDisabled)
-            return;
-        this.xDateHover.emit({
-            date: day.date,
-            side,
-        });
-    };
-    /**
-     * Handle header navigation actions.
-     * @param e - Mouse event.
-     * @param action - Header action type.
-     * @param side - Panel side.
-     * @returns void
-     */
-    handleHeaderAction = (e, action, side) => {
-        e.stopPropagation();
-        this.xHeaderAction.emit({ action, side });
-    };
-    /**
-     * Handle preset range click.
-     * @param e - Mouse event.
-     * @param preset - Preset range.
-     * @returns void
-     */
-    handlePresetClick = (e, preset) => {
-        e.stopPropagation();
-        this.xPresetClick.emit({ preset });
-    };
-    /**
-     * Handle OK button click.
-     * @param e - Mouse event.
-     * @returns void
-     */
-    handleOkClick = (e) => {
-        e.stopPropagation();
-        this.xOkClick.emit();
-    };
-    /**
-     * Handle month cell click.
-     * @param e - Mouse event.
-     * @param month - Month index.
-     * @param side - Panel side.
-     * @returns void
-     */
-    handleMonthCellClick = (e, month, side) => {
-        e.stopPropagation();
-        this.xMonthClick.emit({
-            month,
-            year: side === 'left' ? this.leftViewDate.getFullYear() : this.rightViewDate.getFullYear(),
-            side,
-        });
-    };
-    /**
-     * Handle year cell click.
-     * @param e - Mouse event.
-     * @param year - Year value.
-     * @param side - Panel side.
-     * @returns void
-     */
-    handleYearCellClick = (e, year, side) => {
-        e.stopPropagation();
-        this.xYearClick.emit({ year, side });
-    };
-    /**
-     * Handle quarter cell click.
-     * @param e - Mouse event.
-     * @param quarter - Quarter index.
-     * @param side - Panel side.
-     * @returns void
-     */
-    handleQuarterCellClick = (e, quarter, side) => {
-        e.stopPropagation();
-        this.xQuarterClick.emit({
-            quarter,
-            year: side === 'left' ? this.leftViewDate.getFullYear() : this.rightViewDate.getFullYear(),
-            side,
-        });
-    };
-    /**
-     * Handle panel mode change.
-     * @param e - Mouse event.
-     * @param mode - New panel mode.
-     * @param side - Panel side.
-     * @returns void
-     */
-    handlePanelModeChange = (e, mode, side) => {
-        e.stopPropagation();
-        this.xPanelModeChange.emit({ mode, side });
-    };
-    /**
-     * Handle time cell click.
-     * @param e - Mouse event.
-     * @param type - Time unit type.
-     * @param value - Selected value.
-     * @param side - Panel side.
-     * @returns void
-     */
-    handleTimeClick = (e, type, value, side) => {
-        e.stopPropagation();
-        // Calculate new date
-        const currentViewDate = side === 'left' ? this.leftViewDate : this.rightViewDate;
-        const newDate = new Date(currentViewDate);
-        if (type === 'hour')
-            newDate.setHours(value);
-        if (type === 'minute')
-            newDate.setMinutes(value);
-        if (type === 'second')
-            newDate.setSeconds(value);
-        this.xTimeChange.emit({
-            date: newDate,
-            side,
-            type,
-            value
-        });
-    };
-    // ==================== Render Methods ====================
-    /**
-     * Render preset ranges list.
-     * @returns JSX.Element | null
-     */
-    renderPresets() {
-        if (!this.presets || this.presets.length === 0)
-            return null;
-        return (h("div", { class: "x-range-picker-presets" }, h("ul", { class: "x-range-picker-presets-list" }, this.presets.map(preset => (h("li", { class: "x-range-picker-preset-item", onClick: (e) => this.handlePresetClick(e, preset) }, preset.label))))));
-    }
-    /**
-     * Render header for a panel.
-     * @param side - Panel side.
-     * @param viewDate - Current view date.
-     * @returns JSX.Element
-     */
-    renderHeader(side, viewDate) {
-        const mode = side === 'left' ? this.leftPanelMode : this.rightPanelMode;
-        const year = viewDate.getFullYear();
-        const month = viewDate.getMonth();
-        const startYear = Math.floor(year / 10) * 10 - 1;
-        const showMonthNav = mode === 'date' || mode === 'week';
-        const showDecadeNav = mode === 'year';
-        return (h("div", { class: "x-range-picker-header" }, h("button", { type: "button", class: "x-range-picker-header-btn super-prev-btn", tabIndex: -1, onClick: (e) => this.handleHeaderAction(e, showDecadeNav ? 'prevDecade' : 'prevYear', side) }, h("x-icon", { slot: "icon", name: getIcon('doubleArrowLeft') })), showMonthNav && (h("button", { type: "button", class: "x-range-picker-header-btn prev-btn", tabIndex: -1, onClick: (e) => this.handleHeaderAction(e, 'prevMonth', side) }, h("x-icon", { slot: "icon", name: getIcon('arrowLeft') }))), h("div", { class: "x-range-picker-header-view" }, mode === 'year' ? (h("span", { class: "x-range-picker-header-year-range" }, startYear + 1, "-", startYear + 10)) : ([
-            mode === 'date' && (h("button", { type: "button", class: "x-range-picker-header-month-btn", onClick: (e) => this.handlePanelModeChange(e, 'month', side) }, translate('DatePicker.lang.monthsFull', undefined, DEFAULT_MONTHS_FULL)[month])),
-            (mode === 'date' || mode === 'month' || mode === 'quarter') && (h("button", { type: "button", class: "x-range-picker-header-year-btn", onClick: (e) => this.handlePanelModeChange(e, 'year', side) }, year))
-        ])), showMonthNav && (h("button", { type: "button", class: "x-range-picker-header-btn next-btn", tabIndex: -1, onClick: (e) => this.handleHeaderAction(e, 'nextMonth', side) }, h("x-icon", { slot: "icon", name: getIcon('arrowRight') }))), h("button", { type: "button", class: "x-range-picker-header-btn super-next-btn", tabIndex: -1, onClick: (e) => this.handleHeaderAction(e, showDecadeNav ? 'nextDecade' : 'nextYear', side) }, h("x-icon", { slot: "icon", name: getIcon('doubleArrowRight') }))));
-    }
-    /**
-     * Render month selection body.
-     * @param _side - Panel side.
-     * @param viewDate - Current view date.
-     * @returns JSX.Element
-     */
-    renderMonthBody(_side, viewDate) {
-        const year = viewDate.getFullYear();
-        const currentMonth = new Date().getMonth();
-        const currentYear = new Date().getFullYear();
-        const month_short = translate('DatePicker.lang.monthsShort', undefined, DEFAULT_MONTHS_SHORT);
-        // We need logic to determine if a month is in range etc.
-        // For now simple rendering.
-        return (h("div", { class: "x-range-picker-body" }, h("table", { class: "x-range-picker-content x-range-picker-month-panel" }, h("tbody", null, [0, 1, 2, 3].map(row => (h("tr", null, [0, 1, 2].map(col => {
-            const month = row * 3 + col;
-            const isCurrentMonth = month === currentMonth && year === currentYear;
-            return (h("td", { class: {
-                    'x-range-picker-cell': true,
-                    'x-range-picker-cell-in-view': true,
-                    'x-range-picker-cell-today': isCurrentMonth,
-                }, onClick: (e) => this.handleMonthCellClick(e, month, _side) }, h("div", { class: "x-range-picker-cell-inner" }, month_short[month] || DEFAULT_MONTHS_SHORT[month])));
-        }))))))));
-    }
-    /**
-     * Render year selection body.
-     * @param _side - Panel side.
-     * @param viewDate - Current view date.
-     * @returns JSX.Element
-     */
-    renderYearBody(_side, viewDate) {
-        const startYear = Math.floor(viewDate.getFullYear() / 10) * 10 - 1;
-        const currentYear = new Date().getFullYear();
-        return (h("div", { class: "x-range-picker-body" }, h("table", { class: "x-range-picker-content x-range-picker-year-panel" }, h("tbody", null, [0, 1, 2, 3].map(row => (h("tr", null, [0, 1, 2].map(col => {
-            const yearIndex = row * 3 + col;
-            const year = startYear + yearIndex;
-            const isCurrentYear = year === currentYear;
-            const isInView = yearIndex > 0 && yearIndex < 11;
-            return (h("td", { class: {
-                    'x-range-picker-cell': true,
-                    'x-range-picker-cell-in-view': isInView,
-                    'x-range-picker-cell-today': isCurrentYear,
-                }, onClick: (e) => this.handleYearCellClick(e, year, _side) }, h("div", { class: "x-range-picker-cell-inner" }, year)));
-        }))))))));
-    }
-    /**
-     * Render quarter selection body.
-     * @param _side - Panel side.
-     * @param _viewDate - Current view date.
-     * @returns JSX.Element
-     */
-    renderQuarterBody(_side, _viewDate) {
-        const quarters = translate('DatePicker.lang.quarters', undefined, DEFAULT_QUARTERS);
-        // Quarter Logic
-        return (h("div", { class: "x-range-picker-body" }, h("table", { class: "x-range-picker-content x-range-picker-quarter-panel" }, h("tbody", null, h("tr", null, [1, 2, 3, 4].map(q => (h("td", { class: "x-range-picker-cell x-range-picker-cell-in-view", onClick: (e) => this.handleQuarterCellClick(e, q, _side) }, h("div", { class: "x-range-picker-cell-inner" }, quarters[q - 1]?.label ?? DEFAULT_QUARTERS[q - 1] ?? `Q${q}`)))))))));
-    }
-    /**
-     * Render a time column for hours/minutes/seconds.
-     * @param title - Column title.
-     * @param values - Values to render.
-     * @param selected - Selected value.
-     * @param type - Time unit type.
-     * @param side - Panel side.
-     * @returns JSX.Element
-     */
-    renderTimeColumn(side, items, selectedValue, type) {
-        return (h("div", { class: "x-range-picker-time-column" }, h("ul", { class: "x-range-picker-time-list" }, items.map(item => (h("li", { class: {
-                'x-range-picker-time-cell': true,
-                'x-range-picker-time-cell-selected': item === selectedValue,
-            }, onClick: (e) => this.handleTimeClick(e, type, item, side) }, h("div", { class: "x-range-picker-time-cell-inner" }, this.formatNumber(item))))))));
-    }
-    /**
-     * Render time selection body.
-     * @param side - Panel side.
-     * @param viewDate - Current view date.
-     * @returns JSX.Element
-     */
-    renderTimeBody(side, viewDate) {
-        const hour = viewDate.getHours();
-        const minute = viewDate.getMinutes();
-        const second = viewDate.getSeconds();
-        return (h("div", { class: "x-range-picker-body x-range-picker-time-panel" }, h("div", { class: "x-range-picker-time-content" }, this.renderTimeColumn(side, this.getHours(), hour, 'hour'), this.renderTimeColumn(side, this.getMinutes(), minute, 'minute'), this.renderTimeColumn(side, this.getSeconds(), second, 'second'))));
-    }
-    /**
-     * Render calendar body for date panel.
-     * @param side - Panel side.
-     * @param viewDate - Current view date.
-     * @returns JSX.Element
-     */
-    renderCalendarBody(side, viewDate) {
-        const weekDays = this.getWeekDays();
-        const weeks = this.getCalendarDays(viewDate);
-        return (h("div", { class: "x-range-picker-body" }, h("table", { class: "x-range-picker-content" }, h("thead", null, h("tr", null, weekDays.map(day => (h("th", null, day))))), h("tbody", null, weeks.map(week => (h("tr", null, week.map(day => {
-            const isHovered = this.isInHoverRange(day.date);
-            return (h("td", { class: {
-                    'x-range-picker-cell': true,
-                    'x-range-picker-cell-in-view': day.isCurrentMonth,
-                    'x-range-picker-cell-today': day.isToday,
-                    'x-range-picker-cell-selected': day.isRangeStart || day.isRangeEnd,
-                    'x-range-picker-cell-in-range': day.isInRange,
-                    'x-range-picker-cell-range-start': day.isRangeStart,
-                    'x-range-picker-cell-range-end': day.isRangeEnd,
-                    'x-range-picker-cell-disabled': day.isDisabled,
-                    'x-range-picker-cell-hover': isHovered,
-                }, onClick: (e) => this.handleDateClick(e, day, side), onMouseEnter: (e) => this.handleDateHover(e, day, side) }, h("div", { class: "x-range-picker-cell-inner" }, day.date.getDate())));
-        }))))))));
-    }
-    /**
-     * Render a panel based on mode.
-     * @param side - Panel side.
-     * @param viewDate - Current view date.
-     * @returns JSX.Element
-     */
-    renderPanel(side, viewDate) {
-        const mode = side === 'left' ? this.leftPanelMode : this.rightPanelMode;
-        let body;
-        switch (mode) {
-            case 'month':
-                body = this.renderMonthBody(side, viewDate);
-                break;
-            case 'year':
-                body = this.renderYearBody(side, viewDate);
-                break;
-            case 'quarter':
-                body = this.renderQuarterBody(side, viewDate);
-                break;
-            case 'time':
-                body = this.renderTimeBody(side, viewDate);
-                break;
-            case 'week':
-            case 'date':
-            default:
-                body = this.renderCalendarBody(side, viewDate);
-                break;
-        }
-        return (h("div", { class: {
-                'x-range-picker-panel': true,
-                'x-range-picker-panel-left': side === 'left',
-                'x-range-picker-panel-right': side === 'right',
-            } }, this.renderHeader(side, viewDate), body));
-    }
-    /**
-     * Render footer with presets and OK button.
-     * @returns JSX.Element | null
-     */
-    renderFooter() {
-        if (!this.showTime)
-            return null;
-        const isDisabled = !this.rangeStart || !this.rangeEnd;
-        return (h("div", { class: "x-range-picker-footer" }, h("div", { class: "x-range-picker-footer-ranges" }, h("button", { type: "button", class: {
-                'x-range-picker-ok-btn': true,
-                'x-range-picker-ok-btn-disabled': isDisabled,
-            }, disabled: isDisabled, onClick: (e) => this.handleOkClick(e) }, translate('DatePicker.lang.ok', {}, 'OK')))));
-    }
-    /**
-     * Render range picker dropdown content.
-     * @returns JSX.Element
-     * @example
-     * <x-range-picker-dropdown-content></x-range-picker-dropdown-content>
-     */
-    render() {
-        const dropdownClasses = {
-            'x-range-picker-dropdown': true,
-            ...this.dropdownClasses,
-        };
-        return (h("div", { key: '74f75fdac43cec3caed69138bb48e7a0e1e2ec7b', class: dropdownClasses, style: this.dropdownStyle, ref: this.setRef }, h("div", { key: 'b19c57889d00a313ca4ea8f0deb4a4dc5692c438', class: "x-range-picker-panel-container" }, this.renderPresets(), h("div", { key: '39a5880d6e990224ed9267c593384fa694864385', class: "x-range-picker-panels-wrapper" }, h("div", { key: '6099062ff9fbf819b778357e753efe42bc90858e', class: "x-range-picker-panels" }, this.renderPanel('left', this.leftViewDate), this.renderPanel('right', this.rightViewDate)), this.renderFooter()))));
-    }
-};
-XRangePickerDropdownContent.style = rangePickerDropdownContentCss();
-
-export { XRangePickerDropdownContent as x_range_picker_dropdown_content };