xv-webcomponents 1.24.6 → 1.24.8-staging.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/{xv-accordion-v2_49.cjs.entry.js → xv-accordion-v2_50.cjs.entry.js} +704 -45
- package/dist/cjs/xv-header-next.cjs.entry.js +1 -1
- package/dist/cjs/xv-mega-menu-next.cjs.entry.js +2 -2
- package/dist/cjs/xv-webcomponents.cjs.js +1 -1
- package/dist/collection/collection-manifest.json +1 -0
- package/dist/collection/components/xv-date-picker/xv-date-picker.css +386 -0
- package/dist/collection/components/xv-date-picker/xv-date-picker.js +1210 -0
- package/dist/collection/components/xv-date-picker/xv-date-picker.model.js +1 -0
- package/dist/collection/components/xv-date-picker/xv-date-picker.utils.js +120 -0
- package/dist/collection/components/xv-datepicker/xv-datepicker.js +2 -2
- package/dist/collection/components/xv-dropdown/xv-dropdown-item/xv-dropdown-item.js +1 -1
- package/dist/collection/components/xv-dropdown/xv-dropdown.js +1 -1
- package/dist/collection/components/xv-file-uploader/xv-file-uploader.js +2 -2
- package/dist/collection/components/xv-footer/xv-footer.js +1 -1
- package/dist/collection/components/xv-header/xv-header.js +1 -1
- package/dist/collection/components/xv-header-next/xv-header-next.js +1 -1
- package/dist/collection/components/xv-image-viewer/xv-image-viewer.js +1 -1
- package/dist/collection/components/xv-link/xv-link.js +1 -1
- package/dist/collection/components/xv-mega-menu/xv-mega-menu.js +2 -2
- package/dist/collection/components/xv-mega-menu-next/xv-mega-menu-next.js +2 -2
- package/dist/collection/components/xv-modal/xv-modal.js +1 -1
- package/dist/collection/components/xv-notification/xv-notification.js +1 -1
- package/dist/collection/components/xv-number-input/xv-number-input.js +2 -2
- package/dist/collection/components/xv-pagination/xv-pagination.js +1 -1
- package/dist/collection/components/xv-progress-indicator/xv-progress-indicator-item/xv-progress-indicator-item.js +1 -1
- package/dist/collection/components/xv-progress-indicator/xv-progress-indicator.js +1 -1
- package/dist/collection/components/xv-radio/xv-radio.js +2 -2
- package/dist/collection/components/xv-slider/xv-slider.js +1 -1
- package/dist/collection/components/xv-table/xv-table-cell/xv-table-cell.js +1 -1
- package/dist/collection/components/xv-table/xv-table-expand/xv-table-expand.js +1 -1
- package/dist/collection/components/xv-table/xv-table-row/xv-table-row.js +1 -1
- package/dist/collection/components/xv-table/xv-table.js +1 -1
- package/dist/collection/components/xv-tabs/xv-tab/xv-tab.js +1 -1
- package/dist/collection/components/xv-tag/xv-tag.js +1 -1
- package/dist/collection/components/xv-tag-combobox/xv-tag-combobox.js +2 -2
- package/dist/collection/components/xv-text-input/xv-text-input.js +2 -2
- package/dist/collection/components/xv-textarea/xv-textarea.js +2 -2
- package/dist/collection/components/xv-tile/xv-tile.js +2 -2
- package/dist/collection/components/xv-toggle/xv-toggle.js +1 -1
- package/dist/collection/components/xv-toggle-tip/xv-toggle-tip.js +1 -1
- package/dist/collection/components/xv-tooltip/xv-tooltip.js +2 -2
- package/dist/esm/loader.js +1 -1
- package/dist/esm/{xv-accordion-v2_49.entry.js → xv-accordion-v2_50.entry.js} +704 -46
- package/dist/esm/xv-header-next.entry.js +1 -1
- package/dist/esm/xv-mega-menu-next.entry.js +2 -2
- package/dist/esm/xv-webcomponents.js +1 -1
- package/dist/types/components/xv-date-picker/xv-date-picker.d.ts +101 -0
- package/dist/types/components/xv-date-picker/xv-date-picker.model.d.ts +45 -0
- package/dist/types/components/xv-date-picker/xv-date-picker.utils.d.ts +16 -0
- package/dist/types/components.d.ts +187 -0
- package/dist/xv-webcomponents/{p-9bd6edd0.entry.js → p-51664dbf.entry.js} +1 -1
- package/dist/xv-webcomponents/p-b6eb6373.entry.js +8 -0
- package/dist/xv-webcomponents/{p-71205fad.entry.js → p-fe9b38f8.entry.js} +1 -1
- package/dist/xv-webcomponents/xv-webcomponents.esm.js +1 -1
- package/package.json +1 -1
- package/dist/xv-webcomponents/p-01c5eb8d.entry.js +0 -8
|
@@ -3794,14 +3794,14 @@ function requireConstructFrom () {
|
|
|
3794
3794
|
return constructFrom;
|
|
3795
3795
|
}
|
|
3796
3796
|
|
|
3797
|
-
var toDate = {};
|
|
3797
|
+
var toDate$1 = {};
|
|
3798
3798
|
|
|
3799
3799
|
var hasRequiredToDate;
|
|
3800
3800
|
|
|
3801
3801
|
function requireToDate () {
|
|
3802
|
-
if (hasRequiredToDate) return toDate;
|
|
3802
|
+
if (hasRequiredToDate) return toDate$1;
|
|
3803
3803
|
hasRequiredToDate = 1;
|
|
3804
|
-
toDate.toDate = toDate
|
|
3804
|
+
toDate$1.toDate = toDate;
|
|
3805
3805
|
var _index = /*@__PURE__*/ requireConstructFrom();
|
|
3806
3806
|
|
|
3807
3807
|
/**
|
|
@@ -3842,11 +3842,11 @@ function requireToDate () {
|
|
|
3842
3842
|
* const result = toDate(1392098430000)
|
|
3843
3843
|
* //=> Tue Feb 11 2014 11:30:30
|
|
3844
3844
|
*/
|
|
3845
|
-
function toDate
|
|
3845
|
+
function toDate(argument, context) {
|
|
3846
3846
|
// [TODO] Get rid of `toDate` or `constructFrom`?
|
|
3847
3847
|
return (0, _index.constructFrom)(context || argument, argument);
|
|
3848
3848
|
}
|
|
3849
|
-
return toDate;
|
|
3849
|
+
return toDate$1;
|
|
3850
3850
|
}
|
|
3851
3851
|
|
|
3852
3852
|
var hasRequiredAddDays;
|
|
@@ -80382,6 +80382,664 @@ var createPopper = /*#__PURE__*/popperGenerator({
|
|
|
80382
80382
|
defaultModifiers: defaultModifiers
|
|
80383
80383
|
}); // eslint-disable-next-line import/no-unused-modules
|
|
80384
80384
|
|
|
80385
|
+
const DAY_ROWS = 6;
|
|
80386
|
+
const DAY_COLS = 7;
|
|
80387
|
+
const YEAR_PAGE = 12;
|
|
80388
|
+
const toDate = (value) => {
|
|
80389
|
+
if (!value)
|
|
80390
|
+
return undefined;
|
|
80391
|
+
if (value instanceof Date)
|
|
80392
|
+
return dateFnsExports.isValid(value) ? value : undefined;
|
|
80393
|
+
const parsed = dateFnsExports.parseISO(value);
|
|
80394
|
+
return dateFnsExports.isValid(parsed) ? parsed : undefined;
|
|
80395
|
+
};
|
|
80396
|
+
const toValue = (input) => [
|
|
80397
|
+
toDate(input === null || input === void 0 ? void 0 : input[0]),
|
|
80398
|
+
toDate(input === null || input === void 0 ? void 0 : input[1]),
|
|
80399
|
+
];
|
|
80400
|
+
const toKey = (date, precision) => {
|
|
80401
|
+
const year = date.getFullYear();
|
|
80402
|
+
if (precision === 'year')
|
|
80403
|
+
return year;
|
|
80404
|
+
const month = date.getMonth() + 1;
|
|
80405
|
+
if (precision === 'month')
|
|
80406
|
+
return year * 100 + month;
|
|
80407
|
+
return year * 10000 + month * 100 + date.getDate();
|
|
80408
|
+
};
|
|
80409
|
+
const startOfUnit = (date, precision) => {
|
|
80410
|
+
if (precision === 'year')
|
|
80411
|
+
return new Date(date.getFullYear(), 0, 1);
|
|
80412
|
+
if (precision === 'month')
|
|
80413
|
+
return new Date(date.getFullYear(), date.getMonth(), 1);
|
|
80414
|
+
return new Date(date.getFullYear(), date.getMonth(), date.getDate());
|
|
80415
|
+
};
|
|
80416
|
+
const carryTime = (from, to) => {
|
|
80417
|
+
if (!from)
|
|
80418
|
+
return to;
|
|
80419
|
+
const next = new Date(to);
|
|
80420
|
+
next.setHours(from.getHours(), from.getMinutes(), 0, 0);
|
|
80421
|
+
return next;
|
|
80422
|
+
};
|
|
80423
|
+
const toBounds = (args) => {
|
|
80424
|
+
const { precision, min, max, disabledDates, disabledWeekdays } = args;
|
|
80425
|
+
const minDate = toDate(min);
|
|
80426
|
+
const maxDate = toDate(max);
|
|
80427
|
+
const keys = (disabledDates !== null && disabledDates !== void 0 ? disabledDates : [])
|
|
80428
|
+
.map(entry => toDate(entry))
|
|
80429
|
+
.filter((entry) => !!entry)
|
|
80430
|
+
.map(entry => toKey(entry, precision));
|
|
80431
|
+
return {
|
|
80432
|
+
minKey: minDate && toKey(minDate, precision),
|
|
80433
|
+
maxKey: maxDate && toKey(maxDate, precision),
|
|
80434
|
+
disabledKeys: keys.length ? new Set(keys) : undefined,
|
|
80435
|
+
disabledWeekdays: (disabledWeekdays === null || disabledWeekdays === void 0 ? void 0 : disabledWeekdays.length) ? disabledWeekdays : undefined,
|
|
80436
|
+
};
|
|
80437
|
+
};
|
|
80438
|
+
const isUnitDisabled = (date, precision, bounds) => {
|
|
80439
|
+
var _a;
|
|
80440
|
+
const key = toKey(date, precision);
|
|
80441
|
+
if (bounds.minKey !== undefined && key < bounds.minKey)
|
|
80442
|
+
return true;
|
|
80443
|
+
if (bounds.maxKey !== undefined && key > bounds.maxKey)
|
|
80444
|
+
return true;
|
|
80445
|
+
if ((_a = bounds.disabledKeys) === null || _a === void 0 ? void 0 : _a.has(key))
|
|
80446
|
+
return true;
|
|
80447
|
+
if (precision === 'day' && bounds.disabledWeekdays)
|
|
80448
|
+
return bounds.disabledWeekdays.includes(date.getDay());
|
|
80449
|
+
return false;
|
|
80450
|
+
};
|
|
80451
|
+
const toCell = (date, precision, bounds, todayKey, outside) => {
|
|
80452
|
+
const key = toKey(date, precision);
|
|
80453
|
+
return { key, date, disabled: isUnitDisabled(date, precision, bounds), outside, today: key === todayKey };
|
|
80454
|
+
};
|
|
80455
|
+
const buildDayRows = (month, weekStartsOn, bounds) => {
|
|
80456
|
+
const gridStart = dateFnsExports.startOfWeek(dateFnsExports.startOfMonth(month), { weekStartsOn });
|
|
80457
|
+
const todayKey = toKey(new Date(), 'day');
|
|
80458
|
+
return Array.from({ length: DAY_ROWS }, (_, row) => {
|
|
80459
|
+
const cells = Array.from({ length: DAY_COLS }, (_, col) => {
|
|
80460
|
+
const date = dateFnsExports.addDays(gridStart, row * DAY_COLS + col);
|
|
80461
|
+
return toCell(date, 'day', bounds, todayKey, !dateFnsExports.isSameMonth(date, month));
|
|
80462
|
+
});
|
|
80463
|
+
return { number: dateFnsExports.getISOWeek(cells[0].date), cells };
|
|
80464
|
+
});
|
|
80465
|
+
};
|
|
80466
|
+
const buildMonthCells = (anchor, bounds) => {
|
|
80467
|
+
const todayKey = toKey(new Date(), 'month');
|
|
80468
|
+
return Array.from({ length: 12 }, (_, month) => toCell(new Date(anchor.getFullYear(), month, 1), 'month', bounds, todayKey, false));
|
|
80469
|
+
};
|
|
80470
|
+
const yearPageStart = (anchor) => Math.floor(anchor.getFullYear() / YEAR_PAGE) * YEAR_PAGE;
|
|
80471
|
+
const buildYearCells = (anchor, bounds) => {
|
|
80472
|
+
const first = yearPageStart(anchor);
|
|
80473
|
+
const todayKey = toKey(new Date(), 'year');
|
|
80474
|
+
return Array.from({ length: YEAR_PAGE }, (_, offset) => toCell(new Date(first + offset, 0, 1), 'year', bounds, todayKey, false));
|
|
80475
|
+
};
|
|
80476
|
+
const selectUnit = (args) => {
|
|
80477
|
+
const { value, picked, active, selection, precision, withTime } = args;
|
|
80478
|
+
const [start, end] = value;
|
|
80479
|
+
const unit = startOfUnit(picked, precision);
|
|
80480
|
+
const applied = (current) => (withTime ? carryTime(current, unit) : unit);
|
|
80481
|
+
const cmp = (a, b) => withTime ? a.getTime() - b.getTime() : toKey(a, precision) - toKey(b, precision);
|
|
80482
|
+
const collapse = (date) => [date, new Date(date)];
|
|
80483
|
+
if (selection === 'single') {
|
|
80484
|
+
return { value: [applied(start), undefined], active: 'start', complete: true };
|
|
80485
|
+
}
|
|
80486
|
+
if (active === 'end' && start) {
|
|
80487
|
+
const next = applied(end);
|
|
80488
|
+
return {
|
|
80489
|
+
value: cmp(next, start) < 0 ? collapse(next) : [start, next],
|
|
80490
|
+
active: 'end',
|
|
80491
|
+
complete: true,
|
|
80492
|
+
};
|
|
80493
|
+
}
|
|
80494
|
+
if (active === 'start' && end) {
|
|
80495
|
+
const next = applied(start);
|
|
80496
|
+
return {
|
|
80497
|
+
value: cmp(next, end) > 0 ? collapse(next) : [next, end],
|
|
80498
|
+
active: 'start',
|
|
80499
|
+
complete: true,
|
|
80500
|
+
};
|
|
80501
|
+
}
|
|
80502
|
+
return { value: [applied(start), undefined], active: 'end', complete: false };
|
|
80503
|
+
};
|
|
80504
|
+
|
|
80505
|
+
const xvDatePickerCss = () => `:host{--xv-date-picker-height:40px;--xv-date-picker-cell-size:40px;--xv-date-picker-panel-width:auto;--xv-date-picker-fields-direction:row;display:inline-block;font-family:var(--ff-body), sans-serif;font-size:var(--fz-md, 14px)}:host([block]){display:block}:host([block]) .field_item{flex:1 1 0;min-width:0}.control{display:flex;flex-direction:column;row-gap:var(--spacing-02, 4px);text-align:left}.field{display:flex;align-items:flex-end;flex-direction:var(--xv-date-picker-fields-direction, row);gap:var(--spacing-03, 8px)}.field_item{display:flex;flex-direction:column;row-gap:var(--spacing-03, 8px);min-width:0}.field_label{color:var(--text-secondary, #515151);font-size:var(--fz-sm, 12px);font-weight:400;letter-spacing:0.32px}.field_control{position:relative;display:flex;align-items:center;box-sizing:border-box;height:var(--xv-date-picker-height);border:1px solid var(--border-subtle-01, #D1D1D1);border-radius:3px;outline:2px solid transparent;background-color:transparent;transition:250ms ease-in-out border-color, 250ms ease-in-out outline-color}.field_control:hover{border-color:var(--border-subtle-selected-01, #8B8B8B)}.field_control:focus-within,.field_control.active{border-color:var(--border-subtle-selected-01, #8B8B8B);outline-color:var(--focus, #273435)}.field_input{flex:1 1 0;min-width:0;height:100%;box-sizing:border-box;padding:0 var(--spacing-05, 16px);border:none;outline:none;background-color:transparent;color:var(--text-primary, #131313);font-family:inherit;font-size:1em;letter-spacing:0.16px;cursor:pointer;text-overflow:ellipsis}.field_input::placeholder{color:var(--text-placeholder, #ACACAC)}.field_icon,.field_clear{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;margin-right:var(--spacing-05, 16px);color:var(--icon-primary, #131313)}.field_icon{background-color:currentColor;mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M19 4h-1V2h-2v2H8V2H6v2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 16H5V9h14v11zm0-13H5V6h14v1z'/%3E%3C/svg%3E");mask-size:cover}.field_clear{padding:0;border:none;border-radius:50%;background:none;font-size:16px;line-height:1;cursor:pointer}.field_clear:hover{background-color:var(--layer-hover-01, #E9E9E9)}.field.error .field_control{border-color:var(--support-error, #F1290E);outline-color:var(--support-error, #F1290E)}.field.warning .field_control{border-color:var(--support-warning, #FF7F04)}.control_message{margin:0;color:var(--text-helper, #646464);font-size:var(--fz-sm, 12px);letter-spacing:0.32px}.control_message.error{color:var(--text-error, #D62512)}.control_message.warning{color:var(--support-warning, #FF7F04)}:host(.readonly) .field_control{background-color:var(--field-01, #F7F7F7)}:host(.readonly) .field_control:hover{border-color:var(--border-subtle-01, #D1D1D1)}:host(.readonly) .field_input{color:var(--text-secondary, #515151);cursor:default}:host(.disabled) .field_label,:host(.disabled) .field_input,:host(.disabled) .control_message:not(.error){color:var(--text-disabled, rgba(19, 19, 19, 0.25))}:host(.disabled) .field_control{cursor:not-allowed}:host(.disabled) .field_control:hover{border-color:var(--border-subtle-01, #D1D1D1)}:host(.disabled) .field_icon{opacity:0.4}:host(.loading) .field_control{border-color:transparent;background-color:var(--field-01, #F7F7F7);background-image:linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.7), transparent);background-size:200% 100%;background-repeat:no-repeat;animation:xv-date-picker-shimmer 1.2s ease-in-out infinite}:host(.loading) .field_input,:host(.loading) .field_icon{visibility:hidden}@keyframes xv-date-picker-shimmer{from{background-position:-100% 0}to{background-position:100% 0}}.panel{display:none;z-index:12;box-sizing:border-box;width:var(--xv-date-picker-panel-width);padding:var(--spacing-03, 8px);border-radius:3px;background-color:var(--layer-02, #fff);box-shadow:0 4px 8px 3px rgba(39, 52, 53, 0.15), 0 1px 3px 0 rgba(39, 52, 53, 0.3)}.panel.open{display:block}.panel_header{display:grid;grid-template-columns:auto 1fr auto;align-items:center;column-gap:var(--spacing-03, 8px)}.panel_title{padding:var(--spacing-02, 4px);border:none;border-radius:3px;background:none;color:var(--text-primary, #131313);font-family:inherit;font-size:1em;font-weight:700;letter-spacing:0.16px;text-transform:capitalize;cursor:pointer}.panel_title:hover:not(:disabled){background-color:var(--layer-hover-01, #E9E9E9)}.panel_title:disabled{cursor:default}.panel_chevron{display:inline-block;padding:4px;border:solid currentColor;border-width:0 2px 2px 0}.panel_chevron.prev{transform:translate(2px) rotate(135deg)}.panel_chevron.next{transform:translate(-2px) rotate(-45deg)}.panel_row{display:grid;grid-template-columns:repeat(7, var(--xv-date-picker-cell-size))}.panel_row.numbered{grid-template-columns:repeat(8, var(--xv-date-picker-cell-size))}.panel_week,.panel_weekday{display:inline-flex;align-items:center;justify-content:center;height:var(--xv-date-picker-cell-size);color:var(--text-secondary, #515151);font-size:var(--fz-sm, 12px)}.panel_grid.month,.panel_grid.year{display:grid;grid-template-columns:repeat(3, 1fr);gap:var(--spacing-02, 4px);min-width:calc(var(--xv-date-picker-cell-size) * 6)}.panel_time{display:flex;gap:var(--spacing-03, 8px);margin-top:var(--spacing-03, 8px);padding-top:var(--spacing-03, 8px);border-top:1px solid var(--border-subtle-01, #D1D1D1)}.panel_time-item{display:flex;flex:1 1 0;flex-direction:column;row-gap:var(--spacing-02, 4px);min-width:0}.panel_time-label{color:var(--text-secondary, #515151);font-size:var(--fz-sm, 12px)}.panel_time input[type=time]{box-sizing:border-box;width:100%;height:32px;padding:0 var(--spacing-03, 8px);border:1px solid var(--border-subtle-01, #D1D1D1);border-radius:3px;outline:2px solid transparent;background-color:transparent;color:var(--text-primary, #131313);font-family:inherit;font-size:var(--fz-sm, 12px)}.panel_time input[type=time]:hover:not(:disabled){border-color:var(--border-subtle-selected-01, #8B8B8B)}.panel_time input[type=time]:focus{outline-color:var(--focus, #273435)}.panel_time input[type=time]:disabled{color:var(--text-disabled, rgba(19, 19, 19, 0.25));background-color:var(--field-01, #F7F7F7)}.panel_time input[type=time]::-webkit-datetime-edit-hour-field,.panel_time input[type=time]::-webkit-datetime-edit-minute-field,.panel_time input[type=time]::-webkit-datetime-edit-ampm-field{padding:0 2px;border-radius:2px}.panel_time input[type=time]:focus::-webkit-datetime-edit-hour-field,.panel_time input[type=time]:focus::-webkit-datetime-edit-minute-field,.panel_time input[type=time]:focus::-webkit-datetime-edit-ampm-field{background-color:var(--highlight-01, #CEDE94) !important;color:var(--text-primary, #131313) !important}.panel_time input[type=time]::-webkit-calendar-picker-indicator{cursor:pointer;opacity:0.5;transition:150ms ease-in-out opacity}.panel_time input[type=time]::-webkit-calendar-picker-indicator:hover{opacity:1}.panel_cell{display:inline-flex;align-items:center;justify-content:center;position:relative;box-sizing:border-box;height:var(--xv-date-picker-cell-size);padding:0;border:none;outline:none;background-color:transparent;color:var(--text-primary, #131313);font-family:inherit;font-size:1em;letter-spacing:0.16px;cursor:pointer;transition:150ms ease-in-out background-color, 150ms ease-in-out color}.panel_cell:hover:not(:disabled){background-color:var(--layer-hover-01, #E9E9E9)}.panel_cell:focus-visible:not(:disabled){outline:1px solid var(--focus, #273435)}.panel_cell.inRange:not(:disabled){background-color:var(--highlight-01, #CEDE94)}.panel_cell.selected{background-color:var(--button-primary, #273435);color:var(--text-on-color, #fff)}.panel_cell.selected:hover{background-color:var(--button-primary-hover, #303F40)}.panel_cell.today{font-weight:700}.panel_cell.today:after{content:"";position:absolute;bottom:4px;left:calc(50% - 2px);width:4px;height:4px;border-radius:2px;background-color:currentColor}.panel_cell.outside:not(.selected){color:var(--text-placeholder, #ACACAC)}.panel_cell:disabled{color:var(--text-disabled, rgba(19, 19, 19, 0.25));cursor:not-allowed}:host([size=xs]){--xv-date-picker-height:16px;font-size:var(--fz-sm, 12px)}:host([size=xs]) .field_input{padding-inline:var(--spacing-03, 8px)}:host([size=xs]) .field_icon,:host([size=xs]) .field_clear{margin-right:var(--spacing-03, 8px)}:host([size=sm]){--xv-date-picker-height:32px}:host([size=md]){--xv-date-picker-height:40px}:host([size=lg]){--xv-date-picker-height:48px}:host([size=xl]){--xv-date-picker-height:60px;font-size:var(--fz-lg, 16px)}`;
|
|
80506
|
+
|
|
80507
|
+
const LOCALES = { de: localeExports.de, en: localeExports.enUS };
|
|
80508
|
+
const DRILL_DOWN = { year: 'month', month: 'day', day: 'day' };
|
|
80509
|
+
const DRILL_UP = { day: 'month', month: 'year', year: 'year' };
|
|
80510
|
+
const UNIT_COLS = 3;
|
|
80511
|
+
const XvDatePicker = class {
|
|
80512
|
+
constructor(hostRef) {
|
|
80513
|
+
registerInstance(this, hostRef);
|
|
80514
|
+
this.valueChange = createEvent(this, "valueChange", 7);
|
|
80515
|
+
this.xvBlur = createEvent(this, "xvBlur", 7);
|
|
80516
|
+
this.openChange = createEvent(this, "openChange", 7);
|
|
80517
|
+
if (hostRef.$hostElement$["s-ei"]) {
|
|
80518
|
+
this.internals = hostRef.$hostElement$["s-ei"];
|
|
80519
|
+
}
|
|
80520
|
+
else {
|
|
80521
|
+
this.internals = hostRef.$hostElement$.attachInternals();
|
|
80522
|
+
hostRef.$hostElement$["s-ei"] = this.internals;
|
|
80523
|
+
}
|
|
80524
|
+
this.value = [undefined, undefined];
|
|
80525
|
+
this.selection = 'single';
|
|
80526
|
+
this.precision = 'day';
|
|
80527
|
+
this.withTime = false;
|
|
80528
|
+
this.minuteStep = 5;
|
|
80529
|
+
this.weekStartsOn = 1;
|
|
80530
|
+
this.showWeekNumbers = true;
|
|
80531
|
+
this.required = false;
|
|
80532
|
+
this.readonly = false;
|
|
80533
|
+
this.disabled = false;
|
|
80534
|
+
this.loading = false;
|
|
80535
|
+
this.clearable = false;
|
|
80536
|
+
this.size = SIZE_VAR.MD;
|
|
80537
|
+
this.block = false;
|
|
80538
|
+
this.placement = 'bottom-start';
|
|
80539
|
+
this.offset = 8;
|
|
80540
|
+
this.dates = [undefined, undefined];
|
|
80541
|
+
this.open = false;
|
|
80542
|
+
this.view = 'day';
|
|
80543
|
+
this.anchor = new Date();
|
|
80544
|
+
this.active = 'start';
|
|
80545
|
+
this.dayRows = [];
|
|
80546
|
+
this.unitCells = [];
|
|
80547
|
+
this.weekdays = [];
|
|
80548
|
+
this.focusedDate = new Date();
|
|
80549
|
+
this.bounds = {};
|
|
80550
|
+
this.inputs = {};
|
|
80551
|
+
this.pendingCellFocus = false;
|
|
80552
|
+
this.handleFieldClick = (event) => {
|
|
80553
|
+
if (!this.isInteractive)
|
|
80554
|
+
return;
|
|
80555
|
+
const endpoint = this.endpointOf(event.target);
|
|
80556
|
+
this.active = endpoint !== null && endpoint !== void 0 ? endpoint : (this.dates[0] && this.selection === 'range' ? 'end' : 'start');
|
|
80557
|
+
if (!this.open)
|
|
80558
|
+
this.open = true;
|
|
80559
|
+
if (!endpoint)
|
|
80560
|
+
this.focusEndpoint(this.active);
|
|
80561
|
+
};
|
|
80562
|
+
this.handleFieldKeydown = (event) => {
|
|
80563
|
+
if (!this.isInteractive)
|
|
80564
|
+
return;
|
|
80565
|
+
if (event.key === 'Enter' || event.key === ' ' || event.key === 'ArrowDown') {
|
|
80566
|
+
event.preventDefault();
|
|
80567
|
+
const endpoint = this.endpointOf(event.target);
|
|
80568
|
+
if (endpoint)
|
|
80569
|
+
this.active = endpoint;
|
|
80570
|
+
this.open = true;
|
|
80571
|
+
// ArrowDown is the keyboard way into the grid
|
|
80572
|
+
if (event.key === 'ArrowDown')
|
|
80573
|
+
this.pendingCellFocus = true;
|
|
80574
|
+
return;
|
|
80575
|
+
}
|
|
80576
|
+
if (event.key === 'Escape' && this.open)
|
|
80577
|
+
this.open = false;
|
|
80578
|
+
};
|
|
80579
|
+
this.handlePanelKeydown = (event) => {
|
|
80580
|
+
if (event.key !== 'Escape')
|
|
80581
|
+
return;
|
|
80582
|
+
event.stopPropagation();
|
|
80583
|
+
this.open = false;
|
|
80584
|
+
this.focusEndpoint(this.active);
|
|
80585
|
+
};
|
|
80586
|
+
this.handleGridKeydown = (event) => {
|
|
80587
|
+
const columns = this.view === 'day' ? DAY_COLS : UNIT_COLS;
|
|
80588
|
+
switch (event.key) {
|
|
80589
|
+
case 'ArrowLeft':
|
|
80590
|
+
this.moveFocus(-1);
|
|
80591
|
+
break;
|
|
80592
|
+
case 'ArrowRight':
|
|
80593
|
+
this.moveFocus(1);
|
|
80594
|
+
break;
|
|
80595
|
+
case 'ArrowUp':
|
|
80596
|
+
this.moveFocus(-columns);
|
|
80597
|
+
break;
|
|
80598
|
+
case 'ArrowDown':
|
|
80599
|
+
this.moveFocus(columns);
|
|
80600
|
+
break;
|
|
80601
|
+
case 'Home':
|
|
80602
|
+
this.setFocusedDate(this.edgeOfRow('start'), 1);
|
|
80603
|
+
break;
|
|
80604
|
+
case 'End':
|
|
80605
|
+
this.setFocusedDate(this.edgeOfRow('end'), -1);
|
|
80606
|
+
break;
|
|
80607
|
+
case 'PageUp':
|
|
80608
|
+
this.stepFocus(-1);
|
|
80609
|
+
break;
|
|
80610
|
+
case 'PageDown':
|
|
80611
|
+
this.stepFocus(1);
|
|
80612
|
+
break;
|
|
80613
|
+
default: return;
|
|
80614
|
+
}
|
|
80615
|
+
event.preventDefault();
|
|
80616
|
+
};
|
|
80617
|
+
this.handleTimeChange = (event, endpoint) => {
|
|
80618
|
+
const [hours, minutes] = event.target.value.split(':').map(Number);
|
|
80619
|
+
if (!Number.isFinite(hours) || !Number.isFinite(minutes))
|
|
80620
|
+
return;
|
|
80621
|
+
const index = endpoint === 'end' ? 1 : 0;
|
|
80622
|
+
const current = this.dates[index];
|
|
80623
|
+
if (!current)
|
|
80624
|
+
return;
|
|
80625
|
+
const updated = new Date(current);
|
|
80626
|
+
updated.setHours(hours, minutes, 0, 0);
|
|
80627
|
+
const next = [this.dates[0], this.dates[1]];
|
|
80628
|
+
next[index] = updated;
|
|
80629
|
+
// a time edit must not invert the range — pull the other endpoint along
|
|
80630
|
+
if (next[0] && next[1] && next[0].getTime() > next[1].getTime()) {
|
|
80631
|
+
next[index === 0 ? 1 : 0] = new Date(updated);
|
|
80632
|
+
}
|
|
80633
|
+
this.commit(next);
|
|
80634
|
+
};
|
|
80635
|
+
this.handleClear = (event) => {
|
|
80636
|
+
event.stopPropagation();
|
|
80637
|
+
this.commit([undefined, undefined]);
|
|
80638
|
+
this.active = 'start';
|
|
80639
|
+
};
|
|
80640
|
+
}
|
|
80641
|
+
get dateLocale() {
|
|
80642
|
+
var _a;
|
|
80643
|
+
const tag = this.locale || ((_a = this.el.closest('[lang]')) === null || _a === void 0 ? void 0 : _a.getAttribute('lang')) || 'de';
|
|
80644
|
+
return LOCALES[tag] || LOCALES[tag.split('-')[0]] || localeExports.de;
|
|
80645
|
+
}
|
|
80646
|
+
get isInteractive() {
|
|
80647
|
+
return !this.disabled && !this.readonly && !this.loading;
|
|
80648
|
+
}
|
|
80649
|
+
componentWillLoad() {
|
|
80650
|
+
this.syncValue();
|
|
80651
|
+
this.view = this.precision;
|
|
80652
|
+
this.anchor = this.dates[0] || new Date();
|
|
80653
|
+
this.rebuildWeekdays();
|
|
80654
|
+
this.rebuild();
|
|
80655
|
+
}
|
|
80656
|
+
componentDidRender() {
|
|
80657
|
+
if (!this.pendingCellFocus)
|
|
80658
|
+
return;
|
|
80659
|
+
this.pendingCellFocus = false;
|
|
80660
|
+
this.focusCell();
|
|
80661
|
+
}
|
|
80662
|
+
disconnectedCallback() {
|
|
80663
|
+
this.destroyPopper();
|
|
80664
|
+
this.unbindDismiss();
|
|
80665
|
+
}
|
|
80666
|
+
syncValue() {
|
|
80667
|
+
const next = toValue(this.value);
|
|
80668
|
+
const [start, end] = next;
|
|
80669
|
+
const [prevStart, prevEnd] = this.dates;
|
|
80670
|
+
if ((start === null || start === void 0 ? void 0 : start.getTime()) === (prevStart === null || prevStart === void 0 ? void 0 : prevStart.getTime()) && (end === null || end === void 0 ? void 0 : end.getTime()) === (prevEnd === null || prevEnd === void 0 ? void 0 : prevEnd.getTime()))
|
|
80671
|
+
return;
|
|
80672
|
+
this.dates = next;
|
|
80673
|
+
this.syncFormValue();
|
|
80674
|
+
// the tuple keeps its slots — consumers read detail[0] / detail[1] positionally
|
|
80675
|
+
this.valueChange.emit(next);
|
|
80676
|
+
}
|
|
80677
|
+
rebuildWeekdays() {
|
|
80678
|
+
const first = dateFnsExports.startOfWeek(new Date(), { weekStartsOn: this.weekStartsOn });
|
|
80679
|
+
this.weekdays = Array.from({ length: 7 }, (_, index) => dateFnsExports.format(dateFnsExports.addDays(first, index), 'EEEEEE', { locale: this.dateLocale }));
|
|
80680
|
+
}
|
|
80681
|
+
resetView() {
|
|
80682
|
+
this.view = this.precision;
|
|
80683
|
+
}
|
|
80684
|
+
rebuild() {
|
|
80685
|
+
this.bounds = toBounds({
|
|
80686
|
+
precision: this.view,
|
|
80687
|
+
min: this.min,
|
|
80688
|
+
max: this.max,
|
|
80689
|
+
disabledDates: this.disabledDates,
|
|
80690
|
+
disabledWeekdays: this.disabledWeekdays,
|
|
80691
|
+
});
|
|
80692
|
+
if (this.view === 'day') {
|
|
80693
|
+
this.dayRows = buildDayRows(this.anchor, this.weekStartsOn, this.bounds);
|
|
80694
|
+
this.unitCells = [];
|
|
80695
|
+
return;
|
|
80696
|
+
}
|
|
80697
|
+
this.dayRows = [];
|
|
80698
|
+
this.unitCells = this.view === 'month'
|
|
80699
|
+
? buildMonthCells(this.anchor, this.bounds)
|
|
80700
|
+
: buildYearCells(this.anchor, this.bounds);
|
|
80701
|
+
}
|
|
80702
|
+
openWatcher() {
|
|
80703
|
+
this.openChange.emit(this.open);
|
|
80704
|
+
if (this.open) {
|
|
80705
|
+
this.view = this.precision;
|
|
80706
|
+
this.anchor = this.dates[this.active === 'end' ? 1 : 0] || this.dates[0] || new Date();
|
|
80707
|
+
this.focusedDate = this.anchor;
|
|
80708
|
+
requestAnimationFrame(() => this.createPopper());
|
|
80709
|
+
this.bindDismiss();
|
|
80710
|
+
return;
|
|
80711
|
+
}
|
|
80712
|
+
this.destroyPopper();
|
|
80713
|
+
this.unbindDismiss();
|
|
80714
|
+
this.xvBlur.emit(this.dates);
|
|
80715
|
+
}
|
|
80716
|
+
syncFormValue() {
|
|
80717
|
+
var _a;
|
|
80718
|
+
// form association is optional — the element also works outside a form
|
|
80719
|
+
if (typeof ((_a = this.internals) === null || _a === void 0 ? void 0 : _a.setFormValue) !== 'function')
|
|
80720
|
+
return;
|
|
80721
|
+
const [start, end] = this.dates;
|
|
80722
|
+
if (!start && !end) {
|
|
80723
|
+
this.internals.setFormValue(null);
|
|
80724
|
+
return;
|
|
80725
|
+
}
|
|
80726
|
+
if (this.selection === 'single') {
|
|
80727
|
+
this.internals.setFormValue((start !== null && start !== void 0 ? start : end).toISOString());
|
|
80728
|
+
return;
|
|
80729
|
+
}
|
|
80730
|
+
const data = new FormData();
|
|
80731
|
+
start && data.append('start', start.toISOString());
|
|
80732
|
+
end && data.append('end', end.toISOString());
|
|
80733
|
+
this.internals.setFormValue(data);
|
|
80734
|
+
}
|
|
80735
|
+
commit(next) {
|
|
80736
|
+
this.value = next;
|
|
80737
|
+
}
|
|
80738
|
+
handleCellClick(cell) {
|
|
80739
|
+
if (cell.disabled)
|
|
80740
|
+
return;
|
|
80741
|
+
if (this.view !== this.precision) {
|
|
80742
|
+
this.anchor = cell.date;
|
|
80743
|
+
this.view = DRILL_DOWN[this.view];
|
|
80744
|
+
return;
|
|
80745
|
+
}
|
|
80746
|
+
const result = selectUnit({
|
|
80747
|
+
value: this.dates,
|
|
80748
|
+
picked: cell.date,
|
|
80749
|
+
active: this.active,
|
|
80750
|
+
selection: this.selection,
|
|
80751
|
+
precision: this.precision,
|
|
80752
|
+
withTime: this.withTime,
|
|
80753
|
+
});
|
|
80754
|
+
if (cell.outside)
|
|
80755
|
+
this.anchor = cell.date;
|
|
80756
|
+
this.commit(result.value);
|
|
80757
|
+
this.active = result.active;
|
|
80758
|
+
// with a time section the panel stays open so the time can still be set
|
|
80759
|
+
if (result.complete && !(this.withTime && this.precision === 'day')) {
|
|
80760
|
+
this.open = false;
|
|
80761
|
+
// the picked cell is gone with the panel — never leave focus on the body
|
|
80762
|
+
this.focusEndpoint(this.active);
|
|
80763
|
+
return;
|
|
80764
|
+
}
|
|
80765
|
+
if (!result.complete)
|
|
80766
|
+
this.focusEndpoint(result.active);
|
|
80767
|
+
}
|
|
80768
|
+
addUnits(date, amount) {
|
|
80769
|
+
if (this.view === 'day')
|
|
80770
|
+
return dateFnsExports.addDays(date, amount);
|
|
80771
|
+
if (this.view === 'month')
|
|
80772
|
+
return dateFnsExports.addMonths(date, amount);
|
|
80773
|
+
return dateFnsExports.addYears(date, amount);
|
|
80774
|
+
}
|
|
80775
|
+
moveFocus(amount) {
|
|
80776
|
+
this.setFocusedDate(this.addUnits(this.focusedDate, amount), amount > 0 ? 1 : -1);
|
|
80777
|
+
}
|
|
80778
|
+
stepFocus(direction) {
|
|
80779
|
+
if (direction < 0 ? !this.canStepBack : !this.canStepForward)
|
|
80780
|
+
return;
|
|
80781
|
+
const next = this.view === 'day'
|
|
80782
|
+
? dateFnsExports.addMonths(this.focusedDate, direction)
|
|
80783
|
+
: this.view === 'month'
|
|
80784
|
+
? dateFnsExports.addYears(this.focusedDate, direction)
|
|
80785
|
+
: dateFnsExports.addYears(this.focusedDate, direction * YEAR_PAGE);
|
|
80786
|
+
this.step(direction);
|
|
80787
|
+
this.focusedDate = next;
|
|
80788
|
+
this.pendingCellFocus = true;
|
|
80789
|
+
}
|
|
80790
|
+
edgeOfRow(edge) {
|
|
80791
|
+
if (this.view === 'day') {
|
|
80792
|
+
return edge === 'start'
|
|
80793
|
+
? dateFnsExports.startOfWeek(this.focusedDate, { weekStartsOn: this.weekStartsOn })
|
|
80794
|
+
: dateFnsExports.endOfWeek(this.focusedDate, { weekStartsOn: this.weekStartsOn });
|
|
80795
|
+
}
|
|
80796
|
+
const cells = this.unitCells;
|
|
80797
|
+
const cell = edge === 'start' ? cells[0] : cells[cells.length - 1];
|
|
80798
|
+
return cell ? cell.date : this.focusedDate;
|
|
80799
|
+
}
|
|
80800
|
+
// skipDirection steps over unavailable units so a move never lands on something unselectable
|
|
80801
|
+
setFocusedDate(date, skipDirection) {
|
|
80802
|
+
let next = date;
|
|
80803
|
+
if (skipDirection) {
|
|
80804
|
+
for (let guard = 0; guard < 60 && isUnitDisabled(next, this.view, this.bounds); guard++) {
|
|
80805
|
+
next = this.addUnits(next, skipDirection);
|
|
80806
|
+
}
|
|
80807
|
+
if (isUnitDisabled(next, this.view, this.bounds))
|
|
80808
|
+
return;
|
|
80809
|
+
}
|
|
80810
|
+
this.focusedDate = next;
|
|
80811
|
+
this.pendingCellFocus = true;
|
|
80812
|
+
if (!this.hasCell(next))
|
|
80813
|
+
this.anchor = next;
|
|
80814
|
+
}
|
|
80815
|
+
hasCell(date) {
|
|
80816
|
+
const key = toKey(date, this.view);
|
|
80817
|
+
return this.view === 'day'
|
|
80818
|
+
? this.dayRows.some(row => row.cells.some(cell => cell.key === key))
|
|
80819
|
+
: this.unitCells.some(cell => cell.key === key);
|
|
80820
|
+
}
|
|
80821
|
+
focusCell() {
|
|
80822
|
+
var _a;
|
|
80823
|
+
const key = toKey(this.focusedDate, this.view);
|
|
80824
|
+
const cell = (_a = this.el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector(`[data-key="${key}"]`);
|
|
80825
|
+
if (typeof (cell === null || cell === void 0 ? void 0 : cell.focus) === 'function')
|
|
80826
|
+
cell.focus();
|
|
80827
|
+
}
|
|
80828
|
+
endpointOf(target) {
|
|
80829
|
+
if (this.inputs.start && target === this.inputs.start)
|
|
80830
|
+
return 'start';
|
|
80831
|
+
if (this.inputs.end && target === this.inputs.end)
|
|
80832
|
+
return 'end';
|
|
80833
|
+
return undefined;
|
|
80834
|
+
}
|
|
80835
|
+
focusEndpoint(endpoint) {
|
|
80836
|
+
this.active = this.selection === 'range' ? endpoint : 'start';
|
|
80837
|
+
const input = this.inputs[this.active];
|
|
80838
|
+
if (typeof (input === null || input === void 0 ? void 0 : input.focus) === 'function')
|
|
80839
|
+
input.focus();
|
|
80840
|
+
}
|
|
80841
|
+
step(direction) {
|
|
80842
|
+
if (this.view === 'day')
|
|
80843
|
+
this.anchor = dateFnsExports.addMonths(this.anchor, direction);
|
|
80844
|
+
else if (this.view === 'month')
|
|
80845
|
+
this.anchor = dateFnsExports.addYears(this.anchor, direction);
|
|
80846
|
+
else
|
|
80847
|
+
this.anchor = dateFnsExports.addYears(this.anchor, direction * YEAR_PAGE);
|
|
80848
|
+
}
|
|
80849
|
+
get canStepBack() {
|
|
80850
|
+
if (this.bounds.minKey === undefined)
|
|
80851
|
+
return true;
|
|
80852
|
+
if (this.view === 'day')
|
|
80853
|
+
return toKey(dateFnsExports.endOfMonth(dateFnsExports.addMonths(this.anchor, -1)), 'day') >= this.bounds.minKey;
|
|
80854
|
+
if (this.view === 'month')
|
|
80855
|
+
return toKey(dateFnsExports.endOfYear(dateFnsExports.addYears(this.anchor, -1)), 'month') >= this.bounds.minKey;
|
|
80856
|
+
return yearPageStart(this.anchor) - 1 >= this.bounds.minKey;
|
|
80857
|
+
}
|
|
80858
|
+
get canStepForward() {
|
|
80859
|
+
if (this.bounds.maxKey === undefined)
|
|
80860
|
+
return true;
|
|
80861
|
+
if (this.view === 'day')
|
|
80862
|
+
return toKey(dateFnsExports.addMonths(this.anchor, 1), 'day') <= this.bounds.maxKey;
|
|
80863
|
+
if (this.view === 'month')
|
|
80864
|
+
return toKey(dateFnsExports.addYears(this.anchor, 1), 'month') <= this.bounds.maxKey;
|
|
80865
|
+
return yearPageStart(this.anchor) + YEAR_PAGE <= this.bounds.maxKey;
|
|
80866
|
+
}
|
|
80867
|
+
bindDismiss() {
|
|
80868
|
+
if (this.dismiss)
|
|
80869
|
+
return;
|
|
80870
|
+
this.dismiss = (event) => {
|
|
80871
|
+
// composedPath is the only check that survives shadow-DOM retargeting
|
|
80872
|
+
if (!this.containsTarget(event))
|
|
80873
|
+
this.open = false;
|
|
80874
|
+
};
|
|
80875
|
+
document.addEventListener('click', this.dismiss, true);
|
|
80876
|
+
}
|
|
80877
|
+
containsTarget(event) {
|
|
80878
|
+
var _a;
|
|
80879
|
+
if (typeof event.composedPath === 'function' && event.composedPath().includes(this.el))
|
|
80880
|
+
return true;
|
|
80881
|
+
const target = event.target;
|
|
80882
|
+
return !!target && (this.el.contains(target) || !!((_a = this.el.shadowRoot) === null || _a === void 0 ? void 0 : _a.contains(target)));
|
|
80883
|
+
}
|
|
80884
|
+
unbindDismiss() {
|
|
80885
|
+
if (!this.dismiss)
|
|
80886
|
+
return;
|
|
80887
|
+
document.removeEventListener('click', this.dismiss, true);
|
|
80888
|
+
this.dismiss = undefined;
|
|
80889
|
+
}
|
|
80890
|
+
createPopper() {
|
|
80891
|
+
if (!this.fieldEl || !this.panelEl)
|
|
80892
|
+
return;
|
|
80893
|
+
this.popper = createPopper(this.fieldEl, this.panelEl, {
|
|
80894
|
+
strategy: 'fixed',
|
|
80895
|
+
placement: this.placement,
|
|
80896
|
+
modifiers: [{ name: 'offset', options: { offset: [0, this.offset] } }],
|
|
80897
|
+
});
|
|
80898
|
+
}
|
|
80899
|
+
destroyPopper() {
|
|
80900
|
+
var _a;
|
|
80901
|
+
(_a = this.popper) === null || _a === void 0 ? void 0 : _a.destroy();
|
|
80902
|
+
this.popper = undefined;
|
|
80903
|
+
}
|
|
80904
|
+
formatValue(date) {
|
|
80905
|
+
if (!date)
|
|
80906
|
+
return '';
|
|
80907
|
+
const locale = this.dateLocale;
|
|
80908
|
+
if (this.precision === 'year')
|
|
80909
|
+
return dateFnsExports.format(date, 'yyyy', { locale });
|
|
80910
|
+
if (this.precision === 'month')
|
|
80911
|
+
return dateFnsExports.format(date, 'LLLL yyyy', { locale });
|
|
80912
|
+
return this.withTime ? dateFnsExports.format(date, 'P p', { locale }) : dateFnsExports.format(date, 'P', { locale });
|
|
80913
|
+
}
|
|
80914
|
+
headerLabel() {
|
|
80915
|
+
const locale = this.dateLocale;
|
|
80916
|
+
if (this.view === 'day')
|
|
80917
|
+
return dateFnsExports.format(this.anchor, 'LLLL yyyy', { locale });
|
|
80918
|
+
if (this.view === 'month')
|
|
80919
|
+
return dateFnsExports.format(this.anchor, 'yyyy', { locale });
|
|
80920
|
+
const first = yearPageStart(this.anchor);
|
|
80921
|
+
return `${first} – ${first + YEAR_PAGE - 1}`;
|
|
80922
|
+
}
|
|
80923
|
+
cellLabel(cell) {
|
|
80924
|
+
if (this.view === 'day')
|
|
80925
|
+
return `${cell.date.getDate()}`;
|
|
80926
|
+
if (this.view === 'month')
|
|
80927
|
+
return dateFnsExports.format(cell.date, 'LLL', { locale: this.dateLocale });
|
|
80928
|
+
return `${cell.date.getFullYear()}`;
|
|
80929
|
+
}
|
|
80930
|
+
cellState(cell) {
|
|
80931
|
+
const [start, end] = this.dates;
|
|
80932
|
+
const startKey = start && toKey(start, this.view);
|
|
80933
|
+
const endKey = end && toKey(end, this.view);
|
|
80934
|
+
const selected = cell.key === startKey || cell.key === endKey;
|
|
80935
|
+
return {
|
|
80936
|
+
selected,
|
|
80937
|
+
inRange: !selected &&
|
|
80938
|
+
this.selection === 'range' &&
|
|
80939
|
+
startKey !== undefined &&
|
|
80940
|
+
endKey !== undefined &&
|
|
80941
|
+
cell.key > startKey &&
|
|
80942
|
+
cell.key < endKey,
|
|
80943
|
+
};
|
|
80944
|
+
}
|
|
80945
|
+
renderField(endpoint) {
|
|
80946
|
+
const isEnd = endpoint === 'end';
|
|
80947
|
+
const label = isEnd ? this.labelEnd : this.labelStart || this.label;
|
|
80948
|
+
const date = this.dates[isEnd ? 1 : 0];
|
|
80949
|
+
const isLast = isEnd || this.selection === 'single';
|
|
80950
|
+
const showClear = this.clearable && isLast && !!(this.dates[0] || this.dates[1]);
|
|
80951
|
+
return (h("label", { class: "field_item", part: "field-item" }, label && (h("span", { class: "field_label", part: "label" }, label, this.required && ' *')), h("span", { class: {
|
|
80952
|
+
field_control: true,
|
|
80953
|
+
active: this.open && this.selection === 'range' && this.active === endpoint,
|
|
80954
|
+
}, part: "input-wrapper" }, h("input", { type: "text", readonly: true, part: "input", class: "field_input", role: "combobox", "aria-expanded": `${this.open}`, "aria-haspopup": "dialog", disabled: this.disabled || this.loading, placeholder: this.placeholder, value: this.formatValue(date), ref: el => (this.inputs[endpoint] = el) }), showClear ? (h("button", { type: "button", class: "field_clear", part: "clear", tabindex: "-1", onClick: this.handleClear }, "\u00D7")) : (h("span", { class: "field_icon", part: "icon", "aria-hidden": "true" })))));
|
|
80955
|
+
}
|
|
80956
|
+
renderHeader() {
|
|
80957
|
+
return (h("div", { class: "panel_header", part: "header" }, h("xv-button-v2", { variant: "ghost", size: SIZE_VAR.SM, disabled: !this.canStepBack, onClick: () => this.step(-1) }, h("span", { slot: "icon-left", class: "panel_chevron prev" })), h("button", { type: "button", class: "panel_title", part: "header-title", disabled: this.view === 'year', onClick: () => (this.view = DRILL_UP[this.view]) }, this.headerLabel()), h("xv-button-v2", { variant: "ghost", size: SIZE_VAR.SM, disabled: !this.canStepForward, onClick: () => this.step(1) }, h("span", { slot: "icon-left", class: "panel_chevron next" }))));
|
|
80958
|
+
}
|
|
80959
|
+
renderCell(cell, focusedKey) {
|
|
80960
|
+
const state = this.cellState(cell);
|
|
80961
|
+
return (h("button", { type: "button", part: "cell", role: "gridcell", "data-key": cell.key, "aria-selected": `${state.selected}`, "aria-label": this.cellAriaLabel(cell), tabindex: this.open && cell.key === focusedKey ? '0' : '-1', disabled: cell.disabled, class: {
|
|
80962
|
+
panel_cell: true,
|
|
80963
|
+
selected: state.selected,
|
|
80964
|
+
inRange: state.inRange,
|
|
80965
|
+
today: cell.today,
|
|
80966
|
+
outside: cell.outside,
|
|
80967
|
+
}, onClick: () => this.handleCellClick(cell) }, this.cellLabel(cell)));
|
|
80968
|
+
}
|
|
80969
|
+
cellAriaLabel(cell) {
|
|
80970
|
+
const locale = this.dateLocale;
|
|
80971
|
+
if (this.view === 'year')
|
|
80972
|
+
return dateFnsExports.format(cell.date, 'yyyy', { locale });
|
|
80973
|
+
if (this.view === 'month')
|
|
80974
|
+
return dateFnsExports.format(cell.date, 'LLLL yyyy', { locale });
|
|
80975
|
+
return dateFnsExports.format(cell.date, 'PPPP', { locale });
|
|
80976
|
+
}
|
|
80977
|
+
renderDayGrid(focusedKey) {
|
|
80978
|
+
return (h(Fragment, null, h("div", { class: { panel_row: true, weekdays: true, numbered: this.showWeekNumbers }, part: "weekdays", role: "row" }, this.showWeekNumbers && h("span", { class: "panel_week", role: "columnheader" }), this.weekdays.map(day => (h("span", { class: "panel_weekday", role: "columnheader" }, day)))), this.dayRows.map(row => (h("div", { class: { panel_row: true, numbered: this.showWeekNumbers }, role: "row" }, this.showWeekNumbers && (h("span", { class: "panel_week", role: "rowheader" }, row.number)), row.cells.map(cell => this.renderCell(cell, focusedKey)))))));
|
|
80979
|
+
}
|
|
80980
|
+
renderTime() {
|
|
80981
|
+
const endpoints = this.selection === 'range' ? ['start', 'end'] : ['start'];
|
|
80982
|
+
return (h("div", { class: "panel_time", part: "time" }, endpoints.map(endpoint => {
|
|
80983
|
+
const label = endpoint === 'end' ? this.labelEnd : this.labelStart || this.label;
|
|
80984
|
+
const date = this.dates[endpoint === 'end' ? 1 : 0];
|
|
80985
|
+
return (h("label", { class: "panel_time-item" }, label && h("span", { class: "panel_time-label" }, label), h("input", { type: "time", part: "time-input", step: this.minuteStep * 60, disabled: !date, value: date ? dateFnsExports.format(date, 'HH:mm') : '', onChange: event => this.handleTimeChange(event, endpoint) })));
|
|
80986
|
+
})));
|
|
80987
|
+
}
|
|
80988
|
+
render() {
|
|
80989
|
+
const message = resolveFieldMessage({ error: this.error, warning: this.warning, helper: this.helper });
|
|
80990
|
+
const showTime = this.withTime && this.precision === 'day';
|
|
80991
|
+
const focusedKey = toKey(this.focusedDate, this.view);
|
|
80992
|
+
return (h(Host, { key: '37bccd82d64c236ee180bffe73fafc243dd8aad8', class: { disabled: this.disabled, loading: this.loading, readonly: this.readonly } }, h("div", { key: 'a9b1ab7fa33a81bcbf691e8ee1f835b23c930f2a', class: "control", part: "control" }, h("div", { key: '41a0e21d63569785e1c482619d1ed6d63118a2d5', class: {
|
|
80993
|
+
field: true,
|
|
80994
|
+
range: this.selection === 'range',
|
|
80995
|
+
error: !!this.error,
|
|
80996
|
+
warning: !!this.warning,
|
|
80997
|
+
}, part: "field", ref: el => (this.fieldEl = el), onClick: this.handleFieldClick, onKeyDown: this.handleFieldKeydown }, this.renderField('start'), this.selection === 'range' && this.renderField('end')), message && (h("p", { key: '2c85920edc6707b2fba8be39b89f6ed0191de481', class: { control_message: true, [message.level]: true }, part: "message" }, message.text))), h("div", { key: 'e7e807b22608683cc48c97c493000bc1fcf65559', class: { panel: true, open: this.open }, part: "panel", role: "dialog", ref: el => (this.panelEl = el), onKeyDown: this.handlePanelKeydown }, this.renderHeader(), h("div", { key: '6d467a8b1ec52981b71e69942f1d6a6b4928c930', class: { panel_grid: true, [this.view]: true }, part: "grid", role: "grid", onKeyDown: this.handleGridKeydown }, this.view === 'day'
|
|
80998
|
+
? this.renderDayGrid(focusedKey)
|
|
80999
|
+
: this.unitCells.map(cell => this.renderCell(cell, focusedKey))), showTime && this.renderTime(), h("slot", { key: '83818b65fff9f51ef3dd559c3d7b97e7511ecc03', name: "footer" }))));
|
|
81000
|
+
}
|
|
81001
|
+
static get formAssociated() { return true; }
|
|
81002
|
+
get el() { return getElement(this); }
|
|
81003
|
+
static get watchers() { return {
|
|
81004
|
+
"value": [{
|
|
81005
|
+
"syncValue": 0
|
|
81006
|
+
}],
|
|
81007
|
+
"locale": [{
|
|
81008
|
+
"rebuildWeekdays": 0
|
|
81009
|
+
}],
|
|
81010
|
+
"weekStartsOn": [{
|
|
81011
|
+
"rebuildWeekdays": 0
|
|
81012
|
+
}, {
|
|
81013
|
+
"rebuild": 0
|
|
81014
|
+
}],
|
|
81015
|
+
"precision": [{
|
|
81016
|
+
"resetView": 0
|
|
81017
|
+
}],
|
|
81018
|
+
"anchor": [{
|
|
81019
|
+
"rebuild": 0
|
|
81020
|
+
}],
|
|
81021
|
+
"view": [{
|
|
81022
|
+
"rebuild": 0
|
|
81023
|
+
}],
|
|
81024
|
+
"min": [{
|
|
81025
|
+
"rebuild": 0
|
|
81026
|
+
}],
|
|
81027
|
+
"max": [{
|
|
81028
|
+
"rebuild": 0
|
|
81029
|
+
}],
|
|
81030
|
+
"disabledDates": [{
|
|
81031
|
+
"rebuild": 0
|
|
81032
|
+
}],
|
|
81033
|
+
"disabledWeekdays": [{
|
|
81034
|
+
"rebuild": 0
|
|
81035
|
+
}],
|
|
81036
|
+
"open": [{
|
|
81037
|
+
"openWatcher": 0
|
|
81038
|
+
}]
|
|
81039
|
+
}; }
|
|
81040
|
+
};
|
|
81041
|
+
XvDatePicker.style = xvDatePickerCss();
|
|
81042
|
+
|
|
80385
81043
|
const xvDatepickerCss = () => `@charset "UTF-8";:host{--xv-datepicker-padding:var(--spacing-04);--xv-datepicker-fields-direction:row;display:inline-block;font-size:var(--fz-md, 14px)}:host .control{display:flex;flex-direction:column;row-gap:var(--spacing-03);text-align:left;letter-spacing:0.32px}:host .control_label{color:var(--text-secondary, #515151);font-size:0.8571428571em;font-weight:400}:host .control_field{position:relative;display:flex;gap:var(--spacing-03);flex-direction:var(--xv-datepicker-fields-direction, row)}:host .control_field input[type=date]{flex:1 1 0;border-radius:3px;color:var(--text-primary, #333);font-family:var(--ff-body), sans-serif;font-size:1em;background-color:transparent;font-style:normal;font-weight:400;line-height:20px;letter-spacing:0.32px;padding:var(--xv-datepicker-padding) calc(var(--spacing-05) + 20px) var(--xv-datepicker-padding) var(--spacing-05);border:1px solid var(--border-subtle-01);box-shadow:none;outline:2px solid transparent;transition:0.25s ease-in-out outline-color;appearance:none}:host .control_field input[type=date]:empty{color:var(--text-helper, #646464)}:host .control_field input[type=date]:focus{outline-color:var(--focus)}:host .control_field input[type=date]::-webkit-calendar-picker-indicator{visibility:hidden;opacity:0;appearance:none;pointer-events:none;display:none}:host .control_field:before{font-size:16px;width:16px;height:16px;top:calc(var(--xv-datepicker-padding) + 4px);right:var(--spacing-04);position:absolute;content:"";box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 24 24'%3E%3Cpath d='M19 4h-1V2h-2v2H8V2H6v2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 16H5V9h14v11zm0-13H5V6h14v1z'/%3E%3C/svg%3E")}@supports not selector(::-webkit-calendar-picker-indicator){:host .control_field:before{background-image:none}}:host .control_field.warning,:host .control_field.error,:host .control_field.loading{position:relative}:host .control_field.warning:before,:host .control_field.error:before,:host .control_field.loading:before{background-image:none}:host .control_field.warning:before{content:"⚠";color:var(--support-warning)}:host .control_field.error:before{font-size:12px;border-radius:50%;content:"!";color:#fff;background-color:var(--support-error)}:host .control_field.error input[type=date]{outline-color:var(--support-error);border:1px solid var(--support-error)}:host .control_field.loading{}@keyframes spin{to{transform:rotate(360deg)}}:host .control_field.loading:before{content:"";background-color:transparent;border-radius:50%;border:3px solid rgba(0, 0, 0, 0.1);border-top-color:var(--highlight-01, #CEDE94);animation:spin 0.8s linear infinite}:host .control_message{font-size:0.8571428571em;color:var(--text-primary, #333);margin:0;padding:0}:host .control_message.error{color:var(--text-error, #D62512)}:host .control_message.warning{color:var(--support-warning)}:host .control_message.helper{color:var(--text-secondary, #515151)}:host .popover{opacity:1;z-index:12;position:absolute;max-width:fit-content;box-sizing:border-box;display:inline-flex;flex-direction:column;background-color:var(--layer-02, #fff);border-radius:3px;box-shadow:0 4px 8px 3px rgba(39, 52, 53, 0.15), 0 1px 3px 0 rgba(39, 52, 53, 0.3);padding:var(--spacing-02) var(--spacing-03);row-gap:var(--spacing-02, 4px)}:host .popover:not(.open){opacity:0;z-index:-1;user-select:none;pointer-events:none;top:0;left:0;transform:translateY(-9999px)}:host .popover .header{display:grid;width:100%;grid-template-columns:auto 1fr auto;column-gap:var(--spacing-03)}:host .popover .header_date{margin:0;padding:0;display:flex;align-items:center;justify-content:center;text-transform:capitalize;color:var(--text-primary, #333);text-align:center;font-family:var(--ff-body), sans-serif;font-size:1em;font-weight:700;letter-spacing:0.16px}:host .popover .header_date input[type=number]{display:inline-block;padding:0.25rem;border:none;margin:0 0 0 var(--spacing-02);cursor:default;font-family:inherit;font-size:inherit;font-weight:600;inline-size:3.75em;border-radius:3px}:host .popover .header_date input[type=number]:focus{outline:1px solid var(--focus)}:host .popover .header_icon{display:inline-block;position:relative;border:solid currentColor;padding:5px;border-width:0 2px 2px 0}:host .popover .header_icon.prev{transform:translate(4px) rotate(135deg)}:host .popover .header_icon.next{transform:translate(-4px) rotate(-45deg)}:host .popover .week{display:grid;width:100%;grid-template-columns:repeat(8, 1fr)}:host .popover .week_day{width:40px;line-height:40px;margin:0;padding:0;box-sizing:border-box;color:var(--text-primary, #333);font-family:var(--ff-body), sans-serif;font-size:1em;letter-spacing:0.16px;user-select:none}:host .popover .week_day:is(button){background-color:transparent;border:none;outline:none;transition:250ms ease-in-out background-color, 250ms ease-in-out color}:host .popover .week_day:is(button):hover:not(:disabled){cursor:pointer;background-color:var(--layer-hover-01, #E9E9E9)}:host .popover .week_day:is(button):focus:not(:disabled){cursor:pointer;outline:1px solid var(--focus, #273435);background-blend-mode:multiply}:host .popover .week_day:is(button):active:not(:disabled){background-color:rgba(139, 139, 139, 0.5)}:host .popover .week_day:is(button).inRange:not(.disabled):not(.active){background-color:var(--highlight-01, #CEDE94)}:host .popover .week_day:is(button).active{background-color:var(--button-primary, #273435);color:var(--text-on-color, #fff);z-index:1}:host .popover .week_day:is(button).active:hover{background-color:var(--button-primary-hover, #303F40)}:host .popover .week_day:is(button).active:active{background-color:var(--button-primary-active, #455D5E)}:host .popover .week_day.isToday{position:relative;font-weight:bold}:host .popover .week_day.isToday:before{content:"";position:absolute;bottom:2px;left:calc(50% - 2px);display:inline-block;width:4px;height:4px;border-radius:2px;background-color:currentColor}:host .popover .week_day.disabled{color:var(--text-placeholder, #ACACAC)}:host .popover .week_day__mobile{display:none}@media screen and (max-width: 920px){:host .popover .week_day__mobile{display:inline-block}}:host .popover .week_day__desktop{display:inline-block}@media screen and (max-width: 920px){:host .popover .week_day__desktop{display:none}}:host([block]){display:block;max-width:unset}:host(.disabled) .control_message,:host(.disabled) .control_field input[type=date],:host(.disabled) .control_label{color:var(--text-disabled, rgba(19, 19, 19, 0.25))}:host(.disabled) .control_field:before{opacity:0.4}:host([size=xs]){--xv-datepicker-padding:var(--spacing-02, 4px);font-size:var(--fz-sm)}:host([size=sm]){--xv-datepicker-padding:var(--spacing-03, 8px)}:host([size=md]){--xv-datepicker-padding:var(--spacing-04, 12px)}:host([size=lg]){--xv-datepicker-padding:var(--spacing-05, 16px)}:host([size=xl]){--xv-datepicker-padding:var(--spacing-06, 24px);font-size:var(--fz-lg)}`;
|
|
80386
81044
|
|
|
80387
81045
|
const WEEK = Array
|
|
@@ -80651,12 +81309,12 @@ const XvDatepicker = class {
|
|
|
80651
81309
|
warning: this.warning,
|
|
80652
81310
|
helper: this.helper,
|
|
80653
81311
|
});
|
|
80654
|
-
return (h(Host, { key: '
|
|
81312
|
+
return (h(Host, { key: '2942ba3eed34a03d701e8244a82fc17e4323081d', class: { disabled: !!this.disabled }, tabindex: this.disabled ? '-1' : undefined }, h("div", { key: '507eaf161ff01d5d076562ed12d10e907ab262a4', "aria-controls": "popover", class: "control" }, this.label && h("label", { key: '0408965907c9f0953431d5de9cc3ca21f8e6f359', class: "control_label" }, this.label), h("div", { key: 'bb94ae56836fd08d662513d600aa33923aae339d', class: {
|
|
80655
81313
|
'control_field': true,
|
|
80656
81314
|
loading: this.loading,
|
|
80657
81315
|
error: !!this.error || !!this.localError,
|
|
80658
81316
|
warning: this.warning !== undefined,
|
|
80659
|
-
}, onClick: this.handleOpen, ref: (el) => (this.controlEl = el) }, h("input", { key: '
|
|
81317
|
+
}, onClick: this.handleOpen, ref: (el) => (this.controlEl = el) }, h("input", { key: '19652588965c7701ae33c0e6f8acb4a1af908066', lang: "de", type: "date", name: "start", disabled: this.loading || this.disabled, readonly: this.readonly || this.variant === 'range', min: this.min, max: this.max, value: start ? dateFns.format(start, DEF_FORMAT) : '', onChange: (e) => this.handleChange(e, 'start'), onBlur: (e) => this.handleBlur(e, 'start'), onKeyDown: (e) => this.handleKeydown(e, 'start') }), this.variant === 'range' && (h("input", { key: '7a7bff4d073b3523b3b85d19421ee32732f8ef01', lang: "de", type: "date", name: "end", disabled: this.loading || this.disabled, readonly: this.readonly || this.variant === 'range', min: this.min, max: this.max, value: end ? dateFns.format(end, DEF_FORMAT) : '', onChange: (e) => this.handleChange(e, 'end'), onBlur: (e) => this.handleBlur(e, 'end'), onKeyDown: (e) => this.handleKeydown(e, 'end') }))), message && (h("p", { key: 'f70e16601c2082126484a2acaf200fd3e36c48b2', class: { control_message: true, [message.level]: true } }, message.text))), h("div", { key: 'fa1be0cf3724b57f181bff0d3be9f472d4a3839f', role: "dialog", class: { popover: true, open: this.open }, ref: (el) => (this.popoverEl = el) }, h("div", { key: '8f15ec77dedc57bdce21a75eaf6a4507551a3103', class: "header" }, h("xv-button-v2", { key: 'f98f10bf76ed568cfd3f59f87add10a0457a2b9c', tabindex: this.open ? undefined : '-1', disabled: this.isPrevDisabled, variant: "ghost", onClick: this.prevMonth }, h("span", { key: '487532ab9ff3088be8462b6faf2acee8dc8d618b', slot: "icon-left", class: "header_icon prev" })), h("p", { key: '354f2aab92d6d52385914e4a000880dca3e00135', class: "header_date" }, dateFns.format(this.month, 'LLLL', { locale: localeExports.de }), h("input", { key: '399a36306245bcaf173c2824e2cdad0000e5ab2d', tabindex: this.open ? undefined : '-1', type: "number", value: this.month.getFullYear(), onInput: this.handleYearChange, onBlur: this.handleYearBlur })), h("xv-button-v2", { key: 'df6cc7252ccfe5344f0bdfb7bf78055d060cad15', tabindex: this.open ? undefined : '-1', disabled: this.isNextDisabled, variant: "ghost", onClick: this.nextMonth }, h("span", { key: 'a65be37f6448d8072f77215cffafd5f3010355e3', slot: "icon-left", class: "header_icon next" }))), h("div", { key: '16ea670e99e28d22316c802d7a18236d3d2ca6f6', class: "week" }, h("p", { key: '495b4e38981a6923eff2ab5356bd5a39a825e575', class: "week_day" }), WEEK.map((day) => h("p", { class: "week_day" }, day, "."))), h("div", { key: 'd1590363dd39db36cd77084c4700584848352eaf', class: "week" }, this.days.map((day, idx) => (h(Fragment, null, idx % 7 === 0 && (h("button", { tabindex: this.open ? undefined : '-1', disabled: true, class: "week_day disabled" }, day.week)), h("button", { tabindex: this.open ? undefined : '-1', onClick: () => this.handleSetDate(day), disabled: day.disabled, class: {
|
|
80660
81318
|
'week_day': true,
|
|
80661
81319
|
inRange: this.variant === 'range' && dateFns.isWithinInterval(day.date, { start, end }),
|
|
80662
81320
|
isToday: day.isToday,
|
|
@@ -80976,7 +81634,7 @@ const XvDropdown = class {
|
|
|
80976
81634
|
/* endregion Search methods */
|
|
80977
81635
|
render() {
|
|
80978
81636
|
const message = resolveFieldMessage({ error: this.error, warning: this.warning, helper: this.helper });
|
|
80979
|
-
return (h(Host, { key: '
|
|
81637
|
+
return (h(Host, { key: 'c4875590add76758f12a0bf03b91e487bcc08aee', class: { 'xv-dropdown': true, [this.variant]: !!this.variant }, role: "combobox", "aria-haspopup": "listbox", "aria-expanded": this.open ? 'true' : 'false', "aria-controls": this.open ? this.listboxId : null, size: this.size, open: this.open, error: !!this.error, disabled: this.disabled, tabindex: (this.disabled || this.readonly) ? -1 : 0 }, (this.label || this.info) && (h("label", { key: '99806b06efd4fb191f00b814fe2c546fd0704f42', class: "label" }, h("slot", { key: 'fd3ce47fb8e56e1d03d9f9490143b8555141e8e1', name: "label" }, this.label), this.info && h("xv-tooltip-v2", { key: '6a719ee752574cd21e8b4e7729aa70cd3ab9b377', class: "label_info", message: this.info }))), h("div", { key: '17f756444692acafa1a2ff098e00bdf8a575ff7c', class: { "xv-dropdown-control control": true, readonly: !!this.readonly }, onClick: this.handleOpen }, (this.multiple && this.selectedMap.size > 0) && (h("xv-tag-v2", { key: '7a623f101fb425da575cac6b86e85855efee06dc', class: "control_count", onClick: (e) => e.stopPropagation(), onCloseClick: this.clearHandle, closeable: !this.required, bg: "var(--background-inverse)", color: "var(--icon-inverse)" }, this.selectedMap.size)), this.selected.length ? (h("p", { class: "control_value" }, this.selected.join(', '))) : (h("p", { class: "control_placeholder" }, this.placeholder || '')), this._renderIcon(), h("svg", { key: '73aef3c897cca6a2c0bbd9e56a0306906bf8c5d9', class: "control_arrow", focusable: "false", preserveAspectRatio: "xMidYMid meet", xmlns: "http://www.w3.org/2000/svg", fill: "currentColor", "aria-hidden": "true", width: "16", height: "16", viewBox: "0 0 448 512" }, h("path", { key: '5266c5de26438e2baaeb5b8e128fe5d42057a641', d: "M441.9 167.3l-19.8-19.8c-4.7-4.7-12.3-4.7-17 0L224 328.2 42.9 147.5c-4.7-4.7-12.3-4.7-17 0L6.1 167.3c-4.7 4.7-4.7 12.3 0 17l209.4 209.4c4.7 4.7 12.3 4.7 17 0l209.4-209.4c4.7-4.7 4.7-12.3 0-17z" }))), this.open && h("div", { key: '5f43030a685adb47292a079337887222d6411059', ref: (el) => (this.optionsEl = el), id: this.listboxId, role: "listbox", "aria-multiselectable": this.multiple ? 'true' : null, class: { options: true, right: this._appliedPosition() === 'right', search: !!this.search } }, this.search && (h("div", { key: '5c848fec64830e97ccb28f4cbe996def0911b48f', class: "options_search" }, h("xv-text-input-v2", { key: '3f2d78605b72ef82ef9e422727bdb2550c574fc9', type: "search", ref: (el) => (this.searchInputEl = el), block: true, autocomplete: "off", size: this.size, value: this.searchQuery, placeholder: this.searchPlaceholder, onValueChange: this.handleSearchInput }))), h("slot", { key: "xv-dropdown-options" })), message && h("p", { key: 'e091f2dfcd2a8d5722c7c3cf9b54d67c84f813ef', class: "helper" }, message.text)));
|
|
80980
81638
|
}
|
|
80981
81639
|
componentDidLoad() {
|
|
80982
81640
|
this.syncOpenState();
|
|
@@ -81079,7 +81737,7 @@ const XvDropdownItem = class {
|
|
|
81079
81737
|
});
|
|
81080
81738
|
}
|
|
81081
81739
|
render() {
|
|
81082
|
-
return (h(Host, { key: '
|
|
81740
|
+
return (h(Host, { key: 'b58b292e92eddd6f75ba64ab2f42f79f3413bb90', class: "xv-dropdown-item", value: this.value, role: "option", tabindex: this.disabled ? -1 : false }, this.multiple && (h("xv-checkbox-v2", { key: '7197c37dfdac9b6d28b4a00b9e2a379dc07d18b8', class: "multiple-check", size: this.size, checked: this.selected, disabled: this.disabled })), h("slot", { key: '6fd8ba15103762ab31d881fa065ceef5b47c4228' }), (!this.multiple && this.selected) && h("span", { key: '271c7de2acb35c2e2c00037436a42f421f1eb94b', class: "checkmark far fa-check" })));
|
|
81083
81741
|
}
|
|
81084
81742
|
componentWillLoad() {
|
|
81085
81743
|
if (!this.value)
|
|
@@ -81187,13 +81845,13 @@ const XvFileUploader = class {
|
|
|
81187
81845
|
render() {
|
|
81188
81846
|
const error = this.error || this.internalError;
|
|
81189
81847
|
const message = resolveFieldMessage({ error, warning: this.warning, helper: this.helper });
|
|
81190
|
-
return (h(Host, { key: '
|
|
81848
|
+
return (h(Host, { key: '7cbd2adb79b18c2cd197fa57f13bebbe0365b6db', class: {
|
|
81191
81849
|
'upload-wrapper': true,
|
|
81192
81850
|
[`uploader-${this.size}`]: true,
|
|
81193
81851
|
disabled: !!this.disabled,
|
|
81194
81852
|
error: !!error,
|
|
81195
81853
|
warning: !!this.warning && !error,
|
|
81196
|
-
} }, this.label && h("label", { key: '
|
|
81854
|
+
} }, this.label && h("label", { key: 'b79562eb8a65ffed250d1345f0fc6c8668366cc6', class: "label" }, this.label), this.description && h("p", { key: '61ebf2a0f77649b0dc0639380bdfc0a8f00bd2ee', class: "description" }, this.description), this.variant === 'button' ? (h("xv-button-v2", { class: "uploadBtn", variant: this.buttonVariant, disabled: this.disabled, onClick: () => this.fileInput.click() }, this.addText || 'Dateien auswählen')) : (h("div", { class: { 'drop-zone': true, active: this.dragActive }, onDrop: this.onDrop, onDragOver: this.onDragOver, onDragLeave: this.onDragLeave, onClick: () => this.fileInput.click() }, this.addText || 'Dateien hierher ziehen oder darauf klicken, um eine Datei auszuwählen.')), h("input", { key: 'e949d7fb60b134a322a63429e73fbbaa2e8799d5', ref: el => (this.fileInput = el), type: "file", hidden: true, onChange: this.onFileSelect, multiple: this.multiple, accept: this.accept.join(',') }), message && (h("p", { key: '7410de0af3757b5ef90b7dfb91626fabf95ee294', class: { message: true, [message.level]: true } }, message.level === 'error' && h("span", { key: '1dd37548da645680d7bd1162bbb50f0e671a5d7d', class: "status-icon error", "aria-hidden": "true" }, "!"), message.level === 'warning' && h("span", { key: '7e22121b8bff0ffb4e49c9c74c1ecb87ce84675e', class: "status-icon warning", "aria-hidden": "true" }, "\u26A0"), message.text)), h("ul", { key: '70a4e1228949cbc2c921945c876d142b946f506d', class: "file-list" }, this.files.map((file, index) => {
|
|
81197
81855
|
var _a, _b;
|
|
81198
81856
|
return (h("li", { class: { file: true, withError: !!(((_a = this.errors) === null || _a === void 0 ? void 0 : _a[index]) || ((_b = this.errorMessages) === null || _b === void 0 ? void 0 : _b[index])) } }, h("div", { class: "file_container" }, h("span", { class: "file_container_name" }, file.name), this._renderLoaderState(index)), this._renderError(index)));
|
|
81199
81857
|
}))));
|
|
@@ -81265,7 +81923,7 @@ const Xvfooter = class {
|
|
|
81265
81923
|
render() {
|
|
81266
81924
|
const { categories, socials, logo, legalLinks, payments, partners, advantages } = this.data || {};
|
|
81267
81925
|
const hasDataLength = ((categories === null || categories === void 0 ? void 0 : categories.length) || (partners === null || partners === void 0 ? void 0 : partners.length) || (payments === null || payments === void 0 ? void 0 : payments.length) || (socials === null || socials === void 0 ? void 0 : socials.length));
|
|
81268
|
-
return (h("footer", { key: '
|
|
81926
|
+
return (h("footer", { key: '91486e462a602a350ccb5cf0529b839df0b97ee3', class: "xv-footer" }, (advantages === null || advantages === void 0 ? void 0 : advantages.length) > 0 && (h("div", { key: '4483a303bb8ced75017bf80de1a780b5478a6bac', class: "xv-footer-advantages" }, h("div", { key: 'a0f64f5f29ad419db9f60c2b81bb5fcbe42ca8bd', class: "xv-container" }, this._renderFooterList(advantages, { itemWithLabel: true })))), hasDataLength && (h("div", { key: '8a843c600adbfa7d0c02b64d49152ee650baa827', class: "xv-container" }, h("div", { key: '1eb7318f0adf78d2d514527ec9357f2925e50509', class: "xv-footer__grid xv-footer-y-spacing" }, h("div", { key: '088de9aa62a39d459fca68fa7acabfeb6f0f36da', class: "xv-footer__col-main" }, h("ul", { key: '915bd774c5e02eae2ce967ea320a7c05177709b5', class: "xv-footer-categories" }, categories === null || categories === void 0 ? void 0 : categories.map((category) => (h("li", null, h("p", { class: "xv-label-02" }, category.label), h("ul", { class: "xv-footer-routes" }, category.routes.map((item) => (h("li", null, h("a", { class: "xv-body-compact-02", href: item.href, target: item.target }, item.label)))))))))), h("div", { key: '735a5bf08d9553c769b19a1de2f662e8fb1f16dc', class: "xv-footer__col-sidebar" }, this._renderFooterList(partners, { label: 'crossvertise Partner' }), this._renderFooterList(payments, { label: 'Bequem und sicher bezahlen' }), this._renderFooterList(socials, { label: 'Folgen Sie uns', isRow: true }))))), (legalLinks === null || legalLinks === void 0 ? void 0 : legalLinks.length) > 0 && (h("div", { key: 'bea6265263b779969bcd37e09c923f59641baf25', class: "xv-footer-legal" }, h("div", { key: 'a63bc486bf581841b4b96113b3834e2646d12b7f', class: "xv-container" }, h("div", { key: '72f3d713602970cc5c4bf271aaee28caf1432c8e', class: "xv-footer-legal-row" }, logo && (h("a", { key: '2b12fe4726fa26fbeac3210c04bf9459fc157b6a', class: "xv-footer-logo", href: logo.href, target: logo.target }, logo.label && h("span", { key: 'cd348306c044f908ace8dcb620ecf5e4758148a5', class: "xv-label-02" }, logo.label), h("img", { key: 'bd0944451ff97b8dbe8b76055ebfe635b0c3da1a', loading: "lazy", src: logo.image, alt: logo.label }))), h("ul", { key: 'edf94f50d8a7e53827023727256820fbb0e5676c' }, legalLinks.map((item) => {
|
|
81269
81927
|
if (item.label === 'Cookie Einstellungen') {
|
|
81270
81928
|
return h("li", null, h("a", { class: "xv-helper-text-02", onClick: this.openCookieSettings }, item.label));
|
|
81271
81929
|
}
|
|
@@ -82040,7 +82698,7 @@ const XvHeader = class {
|
|
|
82040
82698
|
render() {
|
|
82041
82699
|
var _a, _b, _c, _d, _e;
|
|
82042
82700
|
const isXvBrand = (((_a = this.metaNav) === null || _a === void 0 ? void 0 : _a['WhitelabelName']) || 'Xv') === 'Xv';
|
|
82043
|
-
return (h("header", { key: '
|
|
82701
|
+
return (h("header", { key: '9477fea03faf7b1eee3a59be46a6b6efffabe7ae', class: "header" }, h("div", { key: '974c597e788966d68bbc0af46ef1c56e5d49c291', class: "header-wrapper" }, h("div", { key: 'c4efe27850b74ccaf75864abbee66e04fdd39aba', class: "xv-container" }, h("div", { key: '0dc3df2ffc4dbae8caeb996cbd6bd1293c51126f', class: "header-top" }, h("div", { key: 'fc2ba21ef07a79bf88aa94049222f7ad31842509', class: "header-top--left" }, h("xv-button-v2", { key: '13fc5ad1a0b7587ee223a55c5a6f5b5490935c76', class: "menu-btn", variant: "ghost", onClick: this.toggleMobMenu }, h("i", { key: 'f8baece2d445514f1e30083d109e9a547d84aa9a', slot: "icon-left", class: { 'fa': true, 'fa-times': this.mobMenuOpen, 'fa-bars': !this.mobMenuOpen } })), this.metaNav && (h("a", { key: '506f618928c24e1a8d804e1b362fdc8fdd6662e7', href: `${window.location.origin}/` }, h("picture", { key: '4c0ddbce5bac9bdb282bbff733e9bb781dd47645' }, h("source", { key: '3083b3d605b1c2d30f5dc1935cf1e298b93c5c19', srcSet: ((_b = this.metaNav) === null || _b === void 0 ? void 0 : _b.LogoUrl) || 'https://www.crossvertise.com/ResourcePackages/Bootstrap/assets/dist/images/logo.svg', media: "(min-width: 990px)" }), h("img", { key: '96f2386509b36fd81954819936154751f042fce0', src: ((_c = this.metaNav) === null || _c === void 0 ? void 0 : _c.LogoSmallUrl) || 'https://www.crossvertise.com/ResourcePackages/Bootstrap/assets/dist/images/logo-small.svg', onError: this.logoFallback, loading: "lazy", alt: "Crossvertise" })))), this.orgUnit && (h("xv-link-v2", { key: '3bb46d9af623db9e54c2c51630a83ce4e384b479', class: "header-top--orgUnit", variant: "standalone", href: "/de-de/mycrossvertise" }, this.orgUnit))), h("ul", { key: '36e14a1481748def91b5e76f82631e76d35ae49c', class: "header-top--right" }, this._renderSearch(), this._renderImpersonationInfo(), !((_d = this.metaNav) === null || _d === void 0 ? void 0 : _d.IsManager) && isXvBrand && (h("li", { key: '07c00dae34dfd6f177ff3803f88755339422eec4' }, h("xv-link-v2", { key: '573110e4de76b5a9aab3bb5c21519b68a4236de7', variant: "ghost", href: "https://www.crossvertise.com/ueber-uns/kontakt" }, h("xv-button-v2", { key: '318e47e08a44e34bf10a38d8c2901a2d64bfcf2b', variant: "ghost", size: SIZE_VAR.MD }, h("i", { key: 'd44b57c9ccd07db75c19dae59123c0320241cb3e', class: "header-icon far fa-envelope" }), h("span", { key: 'c9e66d1395ab5b690a2e673994a137807232a084', class: "header-label xv-body-02" }, "Kontakt"))))), this._renderNotifications(), this._renderAccount(), !((_e = this.metaNav) === null || _e === void 0 ? void 0 : _e.IsManager) && isXvBrand && (h("li", { key: 'ca2f1556456c788b78c4929f2d64e7c7f239c4fe' }, h("xv-link-v2", { key: '47f0a74790fb2331a404d515e5fbe8369458146c', variant: "ghost", href: "https://help.crossvertise.com" }, h("xv-button-v2", { key: 'ae850b8f6d7c1da9ea3ba704adb1d670720dff7c', variant: "ghost", size: SIZE_VAR.MD }, h("i", { key: '8c8a857e172f937d8eba8083a63e2ff8662e06cb', class: "header-icon far fa-question-circle" }), h("span", { key: 'bb86a87d43293d313654440a126c4e8ea5d228c9', class: "header-label xv-body-02" }, "Hilfe"))))), this._renderShoppingCart()))), h("div", { key: '4b0386ef89ed643cd42b6232b10064d6bc73beab', class: "header-wrapper--bg" }, h("div", { key: '83ef95df9b7820eae211b958f6f1bf57d046905b', class: "xv-container" }, h("xv-mega-menu", { key: '763117fc0da850b8b1bbea389dcaa3cfacef4847', open: this.mobMenuOpen, onOpenChange: this.closeMobMenu })))), h("xv-login-modal", { key: 'b7252b1eb7527f6dbab4a1cca972d47b75a66b14', visible: this.showLoginModal, onClose: () => this.showLoginModal = false })));
|
|
82044
82702
|
}
|
|
82045
82703
|
get el() { return getElement(this); }
|
|
82046
82704
|
};
|
|
@@ -82108,7 +82766,7 @@ const XvImageViewer = class {
|
|
|
82108
82766
|
}
|
|
82109
82767
|
}
|
|
82110
82768
|
render() {
|
|
82111
|
-
return (h(Host, { key: '
|
|
82769
|
+
return (h(Host, { key: '96e6a18361c53fc6aaa53dee2b9da462e5b06ad6', class: { 'image-wrapper': true, errored: this.errored } }, !this.loaded && h("xv-loader-v2", { key: 'a8176f282bcbbde31fe11f0a2024f1d7319fe54c', class: "loading" }, this.placeholder), this.loaded && this.errored && h("slot", { key: 'aacf047f96435441011e7654b226b2e8c60a2ee7', name: "fallback" }), this.loaded && !this.errored && (h("img", { key: '1a138d2ffd93980d3801cf7a74b6de5a50392365', src: this.src, alt: this.alt, class: "image", onClick: this.handleClick, onError: this.handleError })), this.isFullscreen && (h("dialog", { key: '98a01adac9bf6e6cf872119b6f9f79103f3115f9', class: "fullscreen-dialog", ref: el => (this.dialogEl = el), onClick: this.handleDialogClick, onClose: this.closeFullscreen }, !this.fullscreenLoaded && h("xv-loader-v2", { key: '2e79d4b22d2e82cb05fe6a05d4fa6e10a0cba52c', class: "loading", size: SIZE_VAR.LG }, this.placeholder), h("img", { key: '0ee0411c7ff141af7acb2a87320bd54877854fc3', src: this.fullscreenSrc || this.src, alt: this.alt, class: {
|
|
82112
82770
|
'fullscreen-image': true,
|
|
82113
82771
|
loaded: this.fullscreenLoaded,
|
|
82114
82772
|
} })))));
|
|
@@ -82133,7 +82791,7 @@ const XvLink = class {
|
|
|
82133
82791
|
e.stopPropagation();
|
|
82134
82792
|
}
|
|
82135
82793
|
render() {
|
|
82136
|
-
return (h(Host, { key: '
|
|
82794
|
+
return (h(Host, { key: '12d93e8d7056f2c5df893730735aff2f4b44e43a', class: { [`xv-link_${this.variant}`]: true, disabled: !!this.disabled } }, h("a", { key: '4f8b30c3f01d925b1ee5b7f797eff71ce328c165', href: this.href, onClick: this.preventLinkHandler.bind(this), class: { 'xv-link': true, 'xv-link_disabled': !!this.disabled, [this.size]: !!this.size }, target: this.target }, h("slot", { key: 'd297881f1b9dd41328b374f4dd941f563c2f8743', name: "icon-left" }), h("slot", { key: '4f6281fa48f6ad31352bd9613eb9a31a2489829a' }), h("slot", { key: 'f703d8ab7d41d3b49f35d3c0279f5fee1e6dcee6', name: "icon-right" }))));
|
|
82137
82795
|
}
|
|
82138
82796
|
};
|
|
82139
82797
|
XvLink.style = xvLinkCss();
|
|
@@ -82301,7 +82959,7 @@ const XvMegaMenu = class {
|
|
|
82301
82959
|
void this.fetchMenuData();
|
|
82302
82960
|
}
|
|
82303
82961
|
render() {
|
|
82304
|
-
return (h(Host, { key: '
|
|
82962
|
+
return (h(Host, { key: '03959b6ee112648b107b7ba1f2d82497d4db2aa3' }, h("nav", { key: '9905aa3bdb84f6637a63e23d21b844cc443d0d58', class: { 'xv-menu': true, open: this.open } }, this.menuLoading && (h("div", { key: '75b636e9a29a1f3546c37d71447237170e854a16', class: { 'xv-menu-loader': true, open: this.open } }, h("xv-loader-v2", { key: '48a49a91c2f24c2d6afc7cd285206f124ce3d354' }))), h("ul", { key: 'd16f5495116854df804a20c015257d257c574a1f', class: { menu: true, open: this.open } }, this.menuItems.map((menuItem) => {
|
|
82305
82963
|
var _a, _b;
|
|
82306
82964
|
return (h("li", { class: { 'menu-item': true, active: menuItem.id === ((_a = this.activeItem) === null || _a === void 0 ? void 0 : _a.id) } }, menuItem.route ? (h("xv-link-v2", { variant: "ghost", href: menuItem.route.route }, h("p", { class: "menu-item-label" }, (_b = menuItem.route) === null || _b === void 0 ? void 0 : _b.label))) : (h(Fragment, null, h("p", { class: "menu-item-label", onClick: () => this.setActiveItem(menuItem) }, menuItem === null || menuItem === void 0 ? void 0 : menuItem.label), h("ul", { class: "menu-item-groups" }, menuItem.groups.map((group) => {
|
|
82307
82965
|
var _a;
|
|
@@ -82311,7 +82969,7 @@ const XvMegaMenu = class {
|
|
|
82311
82969
|
} }, h("div", { class: "group-menus" }, h("ul", { class: { 'group-menus-categories': true, inline: group.layout === 'inline' } }, group.categories.map((category) => (h("li", { class: "category" }, h("p", { class: "category-label" }, category.label), h("ul", { class: "category-routes" }, category.routes.map((route) => (h("li", { class: "route" }, h("xv-link-v2", { size: "lg", variant: "ghost", href: route.route || '#' }, route.label), route.tag && (h("xv-tag-v2", { class: "route-tag", size: "sm", color: "#161616", bg: "#E0E0E0" }, route.tag)))))))))), h("ul", { class: "group-menus-actions" }, group.actions.map((action) => (h("li", { class: "action" }, action.type === 'link' && (h("xv-link-v2", { variant: "standalone", href: action === null || action === void 0 ? void 0 : action.url }, action.label, h("span", { class: "link-chevron", slot: "icon-right" }, "\u2192"))), action.type === 'button' &&
|
|
82312
82970
|
h("xv-button-v2", { onClick: () => this.navActionClick(action), block: true, variant: "tertiary" }, action.label)))))), (group === null || group === void 0 ? void 0 : group.card) && (h("div", { class: "group-card" }, h("xv-card-v2", { media: this.applicationContext !== 'Komsa' ? group.card.image : undefined, variant: this.isMobile ? 'horizontal' : 'vertical' }, h("h5", { slot: "header", class: "group-card-title" }, group.card.title), h("p", { slot: "body", class: "group-card-desc" }, group.card.description), group.card.linkLabel && (h("xv-link-v2", { slot: "footer", variant: "standalone", href: group.card.linkUrl || '#' }, group.card.linkLabel, h("span", { class: "link-chevron", slot: "icon-right" }, "\u2192"))))))))));
|
|
82313
82971
|
}))))));
|
|
82314
|
-
}), h("li", { key: '
|
|
82972
|
+
}), h("li", { key: 'e93432e028b8d54815a44823bcd5c463e4c8ac7e', class: "menu--right" }, h("slot", { key: 'a3454e1fbbb0dcd0a6a98c78569c760314f47355', name: "menu-right" })), this.open && (h("li", { key: '6ac8f06d13ab13963bee53e21db3f7bbeccc06bd', class: "menu--backdrop", onClick: () => this.handleClose() }))))));
|
|
82315
82973
|
}
|
|
82316
82974
|
get el() { return getElement(this); }
|
|
82317
82975
|
};
|
|
@@ -82379,7 +83037,7 @@ const XvModal = class {
|
|
|
82379
83037
|
}
|
|
82380
83038
|
render() {
|
|
82381
83039
|
var _a;
|
|
82382
|
-
return (h(Host, { key: '
|
|
83040
|
+
return (h(Host, { key: '51307647bf74a2fecb427e90555c72221fcc2f0b', role: "dialog", size: this.size, id: this.el.id }, h("slot", { key: 'e2be1b75257cc12dcd419b8ddbd5165a967c3bf7', name: "trigger", onSlotchange: this.setupTrigger }), h("div", { key: '219a9da9623faccac909871aae0f06b11b1d4603', class: { backdrop: true }, onClick: this.onBackdropClick }, h("div", { key: 'f9b2716b83f0b1a8bd7db183913405494c00e8c2', class: "modal" }, h("button", { key: 'cefea768d7de47028b282e73ca2c41bd1bf4ee3e', class: "modal_close", onClick: this.closeModal.bind(this) }, "\u00D7"), h("div", { key: '9b79e29a3da547b1361f1aab2bfbef9eebd6bf2a', class: "modal_header" }, h("slot", { key: '3b674d72cf30bf9fb2c195c4c21aa17d8a80d022', name: "header" }, ((_a = this.el) === null || _a === void 0 ? void 0 : _a.title) && h("h5", { key: 'afb6034eed3d5ecddd57b3fc6dade6005cf6687a', class: "modal_header__title" }, this.el.title))), h("div", { key: 'd0cd36f7fe4821db54547ecdea5462206a33ee01', class: { 'modal_content': true, overflow: this.overflow } }, h("slot", { key: '8c6e2adf73d99588042fc5ff1f5845f81c22107e' })), h("div", { key: '406e6ee06f3e99f8cc989bc17be057c94ddea227', class: "modal_footer" }, h("slot", { key: '207c4975d3314fea5d2249d783ed11e1dc213a0c', name: "footer" })), !!this.loading && (h("div", { key: '25d672ddcf45cc71f36edd380f9d8441c2708750', class: "loading" }, h("xv-loader-v2", { key: 'af81b4f6523adf05b7c7547fbcee9cdea9c894d1', size: SIZE_VAR.LG })))))));
|
|
82383
83041
|
}
|
|
82384
83042
|
disconnectedCallback() {
|
|
82385
83043
|
this.removeTriggerListener();
|
|
@@ -82417,7 +83075,7 @@ const XvNotification = class {
|
|
|
82417
83075
|
};
|
|
82418
83076
|
}
|
|
82419
83077
|
render() {
|
|
82420
|
-
return (h(Host, { key: '
|
|
83078
|
+
return (h(Host, { key: '9b5d0f226cff3059ac305ac7911d4403a3e61532', class: "xv-notification", type: this.variant }, this.renderIcon(this.variant), h("div", { key: '2c66b43b47030f8f60eddb04fcd289bb2a70be4d', class: "content" }, h("div", { key: '185f9db9d563f6fc6dc7aea725639c884ed1633a', class: "content_wrapper" }, this.el.title && h("h5", { key: 'd7e0af8fc7e88dc9e4893cb1267a0d18a1a4f9c7', class: "content_title" }, this.el.title), h("slot", { key: 'c8b5f9d3963eb918a94167adc588e49e07c77c4a' })), h("slot", { key: 'b5f27fcba6151ae94489d5e3aefb38d036a89eb1', name: "footer" })), this.dismissible && h("button", { key: '73ed9d9754f012e9c0bac958d6fd88359df753db', class: "close", onClick: this.closeHandle })));
|
|
82421
83079
|
}
|
|
82422
83080
|
static get assetsDirs() { return ["xv-notification/icons"]; }
|
|
82423
83081
|
get el() { return getElement(this); }
|
|
@@ -82468,12 +83126,12 @@ const XvNumberInput = class {
|
|
|
82468
83126
|
}
|
|
82469
83127
|
render() {
|
|
82470
83128
|
const message = resolveFieldMessage({ error: this.error, warning: this.warning, helper: this.helper });
|
|
82471
|
-
return (h(Host, { key: '
|
|
83129
|
+
return (h(Host, { key: 'f38ba33135269ebb1f42b09f0632183723e216d3', class: { disabled: !!this.disabled } }, h("label", { key: 'da0b638442125c176889d98df343b3084a015b08', class: "control" }, this.label && h("span", { key: '317e7b66636becf0e7fc620d9f131396a8e6d223', class: "control_label" }, this.label), h("div", { key: 'fda02350022b9bb24e221bb2055d29b6926a7065', class: {
|
|
82472
83130
|
'control_input': true,
|
|
82473
83131
|
readonly: !!this.readonly,
|
|
82474
83132
|
error: !!this.error,
|
|
82475
83133
|
warning: !!this.warning
|
|
82476
|
-
} }, h("input", { key: '
|
|
83134
|
+
} }, h("input", { key: '3fda092a38b7998ea0c55814ed6188acb97865b5', type: "number", placeholder: this.placeholder, disabled: this.disabled, readonly: this.readonly, onInput: this.handleInput, name: this.name, min: this.min, max: this.max, step: this.step, value: this.value }), h("div", { key: '64bbba5f9d3bd029c244f9ab7f6a0121a4aedd58', class: "control_input__icons" }, this.loading ? (h("xv-loader-v2", { size: SIZE_VAR.XS })) : !!this.error ? (h("span", { class: "status-icon error", "aria-hidden": "true" }, "!")) : !!this.warning ? (h("span", { class: "status-icon warning", "aria-hidden": "true" }, "\u26A0")) : null, h("xv-button-v2", { key: 'aa9e83de581f19b936b68b0981888ecaf945bc71', size: this.size, variant: "ghost", disabled: this.disabled || this.readonly, onClick: this.decrement, "aria-label": "Decrease" }, h("span", { key: 'f6d854836f44bd40c37279015308276b147f6b30', slot: "icon-left", class: "status-icon" }, "\u2212")), h("hr", { key: '512d0208bb7bad48f2df1271dd3d2439301abb50' }), h("xv-button-v2", { key: '5e288267dd454d6368ec773aca888bb071fd00fd', size: this.size, variant: "ghost", disabled: this.disabled || this.readonly, onClick: this.increment, "aria-label": "Increase" }, h("span", { key: 'd9e9304ef6ace291bfea30d08057ba48facb9de7', slot: "icon-left", class: "status-icon" }, "+"))))), message && (h("p", { key: 'eb24260824a30ea3b3888fbf7d532d97544152de', class: { message: true, [message.level]: true } }, message.text))));
|
|
82477
83135
|
}
|
|
82478
83136
|
static get formAssociated() { return true; }
|
|
82479
83137
|
};
|
|
@@ -82930,7 +83588,7 @@ const XvPagination = class {
|
|
|
82930
83588
|
this.observer.disconnect();
|
|
82931
83589
|
}
|
|
82932
83590
|
render() {
|
|
82933
|
-
return (h(Host, { key: '
|
|
83591
|
+
return (h(Host, { key: '458da62296b23b8faa2b9180e74c900df5787bad', class: { block: this.block, [this.currentVariant]: true, [this.size]: !!this.size } }, this.currentVariant === 'full' && (h("div", { key: 'caefc70a44e777307d3f00e54b687bf67a401880', class: "block" }, h("select", { key: '2f3bacc6134e4480f064c8f7298e77988fcd2721', class: "options-select", name: "options", onChange: this.handleItemsPerPageChange }, this.pageSizeOptions.map((v) => h("option", { selected: v === this.itemsPerPage, value: v }, v))))), this.currentVariant === 'full' && (h("span", { key: 'e4292a652ee9fcc4df2b6794558b1a0b3e827973', class: "block block_full" }, `${(this.page - 1) * this.itemsPerPage + 1} – ${Math.min(this.page * this.itemsPerPage, this.totalItems)} von ${this.totalItems} Einträgen`)), this.currentVariant === 'full' && (h("div", { key: '3037e4cffe04ed21817cc6a6a359db4142bfa526', class: "block" }, h("select", { key: '827486ab4cc29ce903c3c94a391dc960eee5a34c', class: "options-select", name: "pages", onChange: this.handlePageSelectChange }, Array.from({ length: this.total }, (_, i) => (h("option", { selected: this.page === i + 1, value: i + 1 }, i + 1)))), h("span", { key: 'a2459bb11735308e8eb9f32cd84719f3efdec7ea' }, "von ", this.total, " Seiten"))), this.currentVariant === 'compact' && h("span", { key: 'd5e47168f6f69e72f3dafd07894b398bc5c8be89', class: "block" }, "Seite ", this.page), h("xv-button-v2", { key: '646e9405571a7dccaa9cbeb68713593441018c40', variant: "ghost", size: this.size, onClick: () => this.handlePageChange(this.page - 1), disabled: this.page <= 1 }, h("span", { key: '6da11047987e235f440cfc1cd39ba4d5f2b017af', slot: "icon-left", class: "icon icon_prev" })), this.currentVariant === 'regular' && (h("ul", { key: 'bc306c51b9eedbb3a702ce4255ecce63694d6621', class: "list" }, this.visiblePagesWithDots.map((page) => (h("li", { class: { active: this.page === page } }, page === 'dots-start' ? (h("div", { class: "list_dots" }, h("xv-button-v2", { variant: "ghost", size: this.size, tabindex: -1 }, h("span", { slot: "icon-left", class: "list_dots__icon" }, "...")), h("select", { name: "start", onChange: this.handlePageSelectChange }, Array.from({ length: this.page - 3 }, (_, i) => (h("option", { value: i + 2 }, i + 2)))))) : page === 'dots-end' ? (h("div", { class: "list_dots" }, h("xv-button-v2", { variant: "ghost", size: this.size, tabindex: -1 }, h("span", { slot: "icon-left", class: "list_dots__icon" }, "...")), h("select", { name: "end", onChange: this.handlePageSelectChange }, Array.from({ length: this.total - (this.page + 2) }, (_, i) => (h("option", { value: i + this.page + 2 }, i + this.page + 2)))))) : (h("xv-button-v2", { variant: "ghost", size: this.size, disabled: this.page === page, onClick: () => this.handlePageChange(page) }, h("span", { class: "list_page", slot: "icon-left" }, page)))))))), h("xv-button-v2", { key: 'c9eb42df2f4d8d019ed75db2f4c344f7f81d96c3', variant: "ghost", size: this.size, onClick: () => this.handlePageChange(this.page + 1), disabled: this.page >= this.total }, h("span", { key: '80be70526a9d788752e025708096b3cfdf57c3c9', slot: "icon-left", class: "icon icon_next" }))));
|
|
82934
83592
|
}
|
|
82935
83593
|
get el() { return getElement(this); }
|
|
82936
83594
|
};
|
|
@@ -82999,7 +83657,7 @@ const XvProgressIndicator = class {
|
|
|
82999
83657
|
this.updateChildItems();
|
|
83000
83658
|
}
|
|
83001
83659
|
render() {
|
|
83002
|
-
return (h(Host, { key: '
|
|
83660
|
+
return (h(Host, { key: 'ff5c1024d3a111514491a3a12fe20066f6af045a', variant: this.variant, size: this.size, class: { 'xv-progress-indicator': true } }, h("slot", { key: '5f7383500e4d73b1f3859b7ee9ae1a8a80e3be85' })));
|
|
83003
83661
|
}
|
|
83004
83662
|
get el() { return getElement(this); }
|
|
83005
83663
|
static get watchers() { return {
|
|
@@ -83018,7 +83676,7 @@ const XvProgressIndicatorItem = class {
|
|
|
83018
83676
|
this.status = PROGRESS_ITEM_STATUS.NO_STARTED;
|
|
83019
83677
|
}
|
|
83020
83678
|
render() {
|
|
83021
|
-
return (h(Host, { key: '
|
|
83679
|
+
return (h(Host, { key: '70a066ed39b26ced1901dcc6cb8869f351042611', status: this.status, class: { 'xv-progress-indicator-item': true } }, h("span", { key: '34ceb1063b044e65c5e21515ff8f72e8efe460cc', class: "line" }), h("span", { key: 'a3aa41c5682ce5b044e87a3452654dc98c16c83c', class: "icon" }, h("svg", { key: '7a35559ad68b93105d28efd94bcd8eb148cd7fa1', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 448 512" }, h("path", { key: 'acbfc059d9bc93cbb62c545eb0946b4c4052416f', fill: "currentColor", d: "M438.6 105.4c12.5 12.5 12.5 32.8 0 45.3l-256 256c-12.5 12.5-32.8 12.5-45.3 0l-128-128c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0L160 338.7 393.4 105.4c12.5-12.5 32.8-12.5 45.3 0z" }))), h("p", { key: '1400da29249e2fe61d9c261d10f99567a2b85304', class: "label" }, h("slot", { key: 'e7dc90f2f28c6c4262fbab374d6aee19804a47f8' }))));
|
|
83022
83680
|
}
|
|
83023
83681
|
get el() { return getElement(this); }
|
|
83024
83682
|
};
|
|
@@ -83051,12 +83709,12 @@ const XvRadio = class {
|
|
|
83051
83709
|
}
|
|
83052
83710
|
render() {
|
|
83053
83711
|
const message = resolveFieldMessage({ error: this.error, warning: this.warning, helper: this.helper });
|
|
83054
|
-
return (h("div", { key: '
|
|
83712
|
+
return (h("div", { key: '3ae31a4819b53d18d2bf91e8ed3d9b86c8c1a4af', class: {
|
|
83055
83713
|
'xv-radio': true,
|
|
83056
83714
|
'xv-radio--reverse': this.reverse,
|
|
83057
83715
|
'xv-radio--block': this.block,
|
|
83058
83716
|
[`xv-radio--size-${this.size}`]: !!this.size,
|
|
83059
|
-
} }, this.label && h("p", { key: '
|
|
83717
|
+
} }, this.label && h("p", { key: '32b78dba6a4a7852f7ccebf762c5378cb223794c', class: "xv-radio_label" }, this.label), h("label", { key: 'bfbd3de534dc8aafd1226b2fc9bd0d3ab7e696a8', class: { 'xv-radio_container': true, disabled: this.disabled } }, h("div", { key: '12b31d0be2bc7e0353fbdcc5e3b91b44d2612a8e', class: { 'xv-radio_input': true, 'xv-radio_input--error': !!this.error || this.error === '' } }, h("input", { key: 'e2f8d6d7550ba06ae31e4b81516bbbc6c6f38614', ref: el => (this.inputEl = el), type: "radio", name: this.name, value: this.value, checked: this.checked, readonly: this.readonly, disabled: this.disabled }), h("span", { key: '1354ee35781fa030b465b78f4421901c536b5080', class: "xv-radio_input__mark" })), h("span", { key: 'c70b218bfdf1a28d87eb4b86f0a701d734878683', class: "xv-radio_container__label" }, h("slot", { key: '0a14170ef488242d42e24146fff6e139aca38b23' }))), message && (h("span", { key: '4ad2280080995ae826611023015a7953221f8cea', class: `xv-radio_msg xv-radio_msg--${message.level}` }, message.level !== 'helper' && (h("span", { key: 'd22113045df97429450183e54e5616dfe996984b', class: "xv-radio_msg__status", "aria-hidden": "true" }, message.level === 'error' ? '!' : '⚠')), message.text)), h("slot", { key: '770306d1e7aa1a380b90813e94319b6257921536', name: "info" })));
|
|
83060
83718
|
}
|
|
83061
83719
|
connectedCallback() {
|
|
83062
83720
|
var _a;
|
|
@@ -83140,7 +83798,7 @@ const XvSlider = class {
|
|
|
83140
83798
|
this.setValue(this.min);
|
|
83141
83799
|
}
|
|
83142
83800
|
render() {
|
|
83143
|
-
return (h(Host, { key: '
|
|
83801
|
+
return (h(Host, { key: 'f7cf8d660b5ee4b8cdc577d06ddeba3dec2b8b81', class: { disabled: this.disabled, readonly: this.readonly } }, this.label && h("label", { key: '0cb07355af35c598699f71e52c04efc8ee8444d6', class: "label" }, this.label), h("div", { key: 'ecd2a38a628a673750dd445de887b81e4bb44ba6', class: "control" }, h("span", { key: 'af4c82b1e1eb8f10cd7a9f1b6525a4378f8f4b88', class: "control_label" }, this.min), h("input", { key: '98448e2ee6c948361151e0fa5afbb3c3b649971b', type: "range", disabled: this.disabled || this.readonly, readonly: this.readonly, name: this.name, min: this.min, max: this.max, step: this.step, value: this.value, onInput: this.handleInput, style: { backgroundSize: `${((this.value - this.min) * 100) / (this.max - this.min)}% 100%` } }), h("span", { key: 'a522155c7ed3a483a94b0c91f125aac888733f19', class: "control_label" }, this.max), !this.notEditable && (h("input", { key: 'b3b2a7284df92d9b8d6b09ed80203804693e3662', type: "number", disabled: this.disabled, readonly: this.readonly, name: `${this.name}-number-input`, step: this.step, min: this.min, max: this.max, value: this.value, onInput: this.handleNumberInput, onBlur: this.handleNumberBlur })))));
|
|
83144
83802
|
}
|
|
83145
83803
|
static get formAssociated() { return true; }
|
|
83146
83804
|
};
|
|
@@ -83155,7 +83813,7 @@ const XvTab = class {
|
|
|
83155
83813
|
this.loading = false;
|
|
83156
83814
|
}
|
|
83157
83815
|
render() {
|
|
83158
|
-
return (h(Host, { key: '
|
|
83816
|
+
return (h(Host, { key: '8dcdf7d006b2e187067bf598828007175d15cae8', disabled: this.disabled, name: this.name }, this.loading ? h("xv-loader-v2", { size: SIZE_VAR.LG }) : h("slot", null)));
|
|
83159
83817
|
}
|
|
83160
83818
|
};
|
|
83161
83819
|
XvTab.style = xvTabCss();
|
|
@@ -83195,7 +83853,7 @@ const XvTable = class {
|
|
|
83195
83853
|
.join(' ') + ' repeat(auto-fit, minmax(0, 1fr))');
|
|
83196
83854
|
}
|
|
83197
83855
|
render() {
|
|
83198
|
-
return (h(Host, { key: '
|
|
83856
|
+
return (h(Host, { key: '9e63c1f7a17abc361feb7653e4f5402d3d95334b', class: { batchVisible: !!this.selectedCount } }, h("slot", { key: '0e4e80ad1419aa111a08f966f9627122cad4ac9a', name: "title" }, !!this.el.title && h("h2", { key: '9027fcbabde7c4ed5eb1ba0decef8e42045ea645', class: "xv-table-title" }, this.el.title)), h("slot", { key: '843a033b11a93d418af533cb795a987f8ba58227', name: "toolbar" }), h("div", { key: '82b13508a6a29bdd24562a77c90116450318136b', class: "xv-table" }, h("div", { key: '547f8d32334af4436003f3dc9c5dd138406cc32c', class: "batch-actions" }, h(Fragment, { key: '44b9eca78485599fedc5e8924b5d39cb7bf4f340' }, h("div", { key: 'c327a6d32db27f53bd4f4a3588e8c1ec24ed5993', class: "batch-actions_content" }, h("slot", { key: 'ce0b3c3dc1a6a3a6c8a8565a92d23cf8b61d4314', name: "batch" })), h("p", { key: '36a74c84144ea8bb685493d5b3e518c8c94e964a', class: "batch-actions_count" }, !!this.selectedCount && `${this.selectedCount} ${this.selectedCount === 1 ? 'Position ausgewählt' : 'Positionen ausgewählt'}`))), h("div", { key: 'a4cf2de4655c5a6d9517c55dbdc2a9c6671b68ad', class: "xv-table_wrapper" }, h("slot", { key: '7e333891bf52df0982fb530c79d1063e0b6da498' }), h("slot", { key: '1b6adcce466197e76a131b6e1544ebb8bdd6bd1e', name: "footer" })), !!this.loading && (h("div", { key: '956cf79dd0e81e8df74be4541ac4013191b07fce', class: "xv-table_loading" }, h("xv-loader-v2", { key: '8505396816e2874a6a463faea14fd8e03b1b8cce', size: SIZE_VAR.LG }))))));
|
|
83199
83857
|
}
|
|
83200
83858
|
componentWillLoad() {
|
|
83201
83859
|
this.setColsSizeTemplate();
|
|
@@ -83236,7 +83894,7 @@ const XvTableCell = class {
|
|
|
83236
83894
|
}
|
|
83237
83895
|
;
|
|
83238
83896
|
render() {
|
|
83239
|
-
return (h(Host, { key: '
|
|
83897
|
+
return (h(Host, { key: 'f1ae644f52064308240bda543eb23999a9a6eb8a' }, h("slot", { key: '7ce7b7c7f36cdaa8cf5e31ec5ed028af1c0db625' })));
|
|
83240
83898
|
}
|
|
83241
83899
|
get el() { return getElement(this); }
|
|
83242
83900
|
};
|
|
@@ -83257,7 +83915,7 @@ const XvTableExpand = class {
|
|
|
83257
83915
|
};
|
|
83258
83916
|
}
|
|
83259
83917
|
render() {
|
|
83260
|
-
return (h(Host, { key: '
|
|
83918
|
+
return (h(Host, { key: '8fe9adf5fd39b640b89bddf303fcc4fb97f03cbd' }, h("button", { key: '1df684103a777e3a54ac94fa8f3c570d4ecbbe41', class: { 'expand-btn': true, open: this.open }, disabled: this.disabled, onClick: this.handleExpand }), h("slot", { key: 'e092ff357605223aa974a8f5061c7a0667c3917f', name: XV_EXPANDABLE_KEY }), h("div", { key: 'e4313af9e98ac24f25c5fc9c8250aff052f7c19b', class: { expandableContent: true, open: this.open } }, h("slot", { key: 'f5cb16c98a69917b6679eb620b2bfc1856a48501' }))));
|
|
83261
83919
|
}
|
|
83262
83920
|
componentDidLoad() {
|
|
83263
83921
|
setAttr(this.el.parentElement, XV_EXPANDABLE_KEY, true);
|
|
@@ -83312,7 +83970,7 @@ const XvTableRow = class {
|
|
|
83312
83970
|
}
|
|
83313
83971
|
}
|
|
83314
83972
|
render() {
|
|
83315
|
-
return (h(Host, { key: '
|
|
83973
|
+
return (h(Host, { key: '96836583a7db08fbbe974a6ece55d5a909a7e415' }, this.variant !== undefined && (h("xv-table-v2-cell", { key: '0783aad6e26302d3430333cad806fc1747e26e39', class: "cell-control" }, this.variant === 'checkbox' && (h("xv-checkbox-v2", { key: 'bd4e052458eeda60f79e22507ac25d5914f39c0c', name: this.name, partial: this.partial, checked: this.checked || this.partial, disabled: this.disabled, required: this.required, readonly: this.readonly, onEventChange: this.checkHandle })), this.variant === 'radio' && (h("input", { key: '1cda8e32f1e8d6ad47fc93e63ee3c879651faa2a', type: "radio", name: this.name, checked: this.checked || this.partial, disabled: this.disabled, required: this.required, readonly: this.readonly })))), h("slot", { key: '2a74a7a6ab1c5d997bf71fe99b6cd98b61a70219' })));
|
|
83316
83974
|
}
|
|
83317
83975
|
componentWillLoad() {
|
|
83318
83976
|
this.setInitialAttrs();
|
|
@@ -83679,12 +84337,12 @@ const XvTagCombobox = class {
|
|
|
83679
84337
|
const ariaOwns = suggestionsVisible ? `${this.uid}-listbox` : undefined;
|
|
83680
84338
|
const activedesc = this.highlighted >= 0 ? this.optionId(this.highlighted) : undefined;
|
|
83681
84339
|
const message = resolveFieldMessage({ error: this.error, warning: this.warning, helper: this.helper });
|
|
83682
|
-
return (h(Host, { key: '
|
|
84340
|
+
return (h(Host, { key: 'e60929011a37dadc02b6c97074b9ea3597efc69e', class: "xv-combobox", part: "root", size: this.size }, this.label && h("label", { key: '7b50d4e03f1f710d47a331f8a34955f1286c18e2', class: "label" }, this.label), h("div", { key: '496e2f93831c245ff07bfd091df93464a02700e6', class: {
|
|
83683
84341
|
'control': true,
|
|
83684
84342
|
'control--disabled': this.disabled,
|
|
83685
84343
|
'control--error': !!this.error,
|
|
83686
84344
|
'control--readonly': !!this.readonly,
|
|
83687
|
-
}, onClick: () => this.blockClick() }, h("div", { key: '
|
|
84345
|
+
}, onClick: () => this.blockClick() }, h("div", { key: 'd9d48a15bef226f8fd1b9560033bc2ffe0488ea4', class: "control-chips", role: "list" }, this.selected.map((s, i) => (h("xv-tag-v2", { role: "listitem", part: "chip", "data-value": s.value, size: this.COMPARE_TAG_SIZE[this.size], disabled: this.disabled, bg: (s === null || s === void 0 ? void 0 : s.bg) || 'var(--layer-accent-01, #F7F7F7)', color: (s === null || s === void 0 ? void 0 : s.color) || 'var(--text-primary, #333)', closeable: !this.readonly, onCloseClick: ({ detail }) => this.removeTag(i, detail) }, s.label))), h("input", { key: 'e691b87972ab0ed01b0241b30d34e381d4011d35', ref: (el) => (this.inputEl = el), class: "control-input", readonly: this.readonly, placeholder: this.selected.length ? '' : this.placeholder, value: this.inputValue, onInput: (e) => this.onInput(e), onKeyDown: (e) => this.onKeyDown(e), onFocus: () => { this.onOpen(); this.recomputeFiltered(); }, "aria-autocomplete": "list", "aria-expanded": this.open ? 'true' : 'false', "aria-controls": ariaOwns, "aria-activedescendant": activedesc, disabled: this.disabled })), this.loading && (h("span", { key: '85e296aea064e3a4704d1e436049cd0f17870613', class: "control-loader", part: "loader", "aria-hidden": "true" }, h("xv-loader-v2", { key: '11b47534c6bd60066e996c8554013a04f8bc4a74', size: "sm", variant: "horizontal" })))), message && (h("p", { key: '9cb3dc1d6be3a0bf501a0c4b5138a286057be343', class: { message: true, [message.level]: true } }, message.text)), suggestionsVisible && (h("ul", { key: '48aa3682898fe62d0228f43c4fb11de0b9494710', id: `${this.uid}-listbox`, class: "suggestions", role: "listbox", part: "listbox" }, this.filtered.map((opt, idx) => (h("li", { id: this.optionId(idx), class: { 'suggestions-opt': true, 'suggestions-opt--highlight': idx === this.highlighted }, role: "option", "aria-selected": idx === this.highlighted, onMouseEnter: () => this.onOptionMouseEnter(idx), onMouseDown: (ev) => ev.preventDefault(), onClick: () => this.selectOption(opt) }, h("div", { class: "suggestions-opt-content" }, opt.bg ? h("span", { class: "suggestions-opt-content--color", style: { background: opt.bg } }) : null, h("span", { class: "suggestions-opt-content--label" }, this.highlightLabel(opt.label).map((seg, i) => typeof seg === 'string' ? h("span", { key: i }, seg) : h("strong", { key: i }, seg.match)))))))))));
|
|
83688
84346
|
}
|
|
83689
84347
|
get host() { return getElement(this); }
|
|
83690
84348
|
static get watchers() { return {
|
|
@@ -83716,7 +84374,7 @@ const XvTag = class {
|
|
|
83716
84374
|
this.closeClick.emit(e);
|
|
83717
84375
|
}
|
|
83718
84376
|
render() {
|
|
83719
|
-
return (h(Host, { key: '
|
|
84377
|
+
return (h(Host, { key: '77385d3b4d4d91c3a10b874542a84d8cc0387053', style: { color: this.color, background: this.bg }, class: `xv-tag ${this.disabled ? 'disabled' : ''} ${this.size}` }, h("div", { key: 'aaf0387d916f0956ce14b55157da88c9e395a78b', class: "xv-tag_content", part: "details-content" }, h("slot", { key: '16103821bce77aa4bc9349171e993992063c7b28' })), this.closeable && (h("button", { key: '50b594b2751c2c331bb8eed3c92059318c018290', onClick: this.closeHandler.bind(this), class: "xv-tag_close" }))));
|
|
83720
84378
|
}
|
|
83721
84379
|
};
|
|
83722
84380
|
XvTag.style = xvTagCss();
|
|
@@ -83756,13 +84414,13 @@ const XvTextInput = class {
|
|
|
83756
84414
|
}
|
|
83757
84415
|
render() {
|
|
83758
84416
|
const message = resolveFieldMessage({ error: this.error, warning: this.warning, helper: this.helper });
|
|
83759
|
-
return (h(Host, { key: '
|
|
84417
|
+
return (h(Host, { key: '43b395b4ae2d9b12b0b6e8c205832b01b444eff9', class: { disabled: !!this.disabled } }, h("label", { key: 'a5a026fc3effb39012c6915b01e4440e89496c13', class: "control" }, this.label && h("span", { key: '9289ff9d91d277e003257766d5bc828d4c0f5998', class: "control_label" }, this.label), h("div", { key: 'ad3217dc73fbddc134fb823a8b66a605bca4c2e7', class: {
|
|
83760
84418
|
'control_input': true,
|
|
83761
84419
|
readonly: !!this.readonly,
|
|
83762
84420
|
[this.size]: true,
|
|
83763
84421
|
error: !!this.error,
|
|
83764
84422
|
warning: !!this.warning,
|
|
83765
|
-
} }, h("input", { key: '
|
|
84423
|
+
} }, h("input", { key: 'a4aa380c75e08596012b32915b5801bb31c6af79', autocomplete: this.autocomplete, type: (this.type === 'password' && this.isPasswordVisible && 'text') || this.type, placeholder: this.placeholder, disabled: this.disabled, readonly: this.readonly, onInput: this.handleInput, name: this.name, value: this.value }), h("div", { key: '35c161e73e8618702d901fb526a5aec4d3bf02d0', class: "control_input__icons" }, this.loading && h("xv-loader-v2", { key: '43592e719837a391dd0b48465146884739d77a6c', size: SIZE_VAR.XS }), this.clearable && this.value && !this.loading && !this.disabled && !this.readonly && (h("button", { key: 'fb8027d93f562377d70252d07cab8440c0554e35', type: "button", class: "status-icon clear", "aria-label": "Clear", onClick: this.handleClear }, "\u00D7")), !!this.error ? (h("span", { class: "status-icon error", "aria-hidden": "true" }, "!")) : !!this.warning ? (h("span", { class: "status-icon warning", "aria-hidden": "true" }, "\u26A0")) : null, this.type === 'password' && (h("button", { key: '620ed023d03e5e8583fdfeb028d49806094f08de', onClick: this.togglePassword, disabled: this.disabled, class: "status-icon" }, h("svg", { key: '77421524e6041b62fe5675daec3dc9e11c5a49e1', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 640 512", width: 16, height: 16 }, this.isPasswordVisible ? (h("path", { fill: "currentColor", d: "M38.8 5.1C28.4-3.1 13.3-1.2 5.1 9.2S-1.2 34.7 9.2 42.9l592 464c10.4 8.2 25.5 6.3 33.7-4.1s6.3-25.5-4.1-33.7L525.6 386.7c39.6-40.6 66.4-86.1 79.9-118.4c3.3-7.9 3.3-16.7 0-24.6c-14.9-35.7-46.2-87.7-93-131.1C465.5 68.8 400.8 32 320 32c-68.2 0-125 26.3-169.3 60.8L38.8 5.1zm151 118.3C226 97.7 269.5 80 320 80c65.2 0 118.8 29.6 159.9 67.7C518.4 183.5 545 226 558.6 256c-12.6 28-36.6 66.8-70.9 100.9l-53.8-42.2c9.1-17.6 14.2-37.5 14.2-58.7c0-70.7-57.3-128-128-128c-32.2 0-61.7 11.9-84.2 31.5l-46.1-36.1zM394.9 284.2l-81.5-63.9c4.2-8.5 6.6-18.2 6.6-28.3c0-5.5-.7-10.9-2-16c.7 0 1.3 0 2 0c44.2 0 80 35.8 80 80c0 9.9-1.8 19.4-5.1 28.2zm9.4 130.3C378.8 425.4 350.7 432 320 432c-65.2 0-118.8-29.6-159.9-67.7C121.6 328.5 95 286 81.4 256c8.3-18.4 21.5-41.5 39.4-64.8L83.1 161.5C60.3 191.2 44 220.8 34.5 243.7c-3.3 7.9-3.3 16.7 0 24.6c14.9 35.7 46.2 87.7 93 131.1C174.5 443.2 239.2 480 320 480c47.8 0 89.9-12.9 126.2-32.5l-41.9-33zM192 256c0 70.7 57.3 128 128 128c13.3 0 26.1-2 38.2-5.8L302 334c-23.5-5.4-43.1-21.2-53.7-42.3l-56.1-44.2c-.2 2.8-.3 5.6-.3 8.5z" })) : (h("path", { fill: "currentColor", d: "M288 80c-65.2 0-118.8 29.6-159.9 67.7C89.6 183.5 63 226 49.4 256c13.6 30 40.2 72.5 78.6 108.3C169.2 402.4 222.8 432 288 432s118.8-29.6 159.9-67.7C486.4 328.5 513 286 526.6 256c-13.6-30-40.2-72.5-78.6-108.3C406.8 109.6 353.2 80 288 80zM95.4 112.6C142.5 68.8 207.2 32 288 32s145.5 36.8 192.6 80.6c46.8 43.5 78.1 95.4 93 131.1c3.3 7.9 3.3 16.7 0 24.6c-14.9 35.7-46.2 87.7-93 131.1C433.5 443.2 368.8 480 288 480s-145.5-36.8-192.6-80.6C48.6 356 17.3 304 2.5 268.3c-3.3-7.9-3.3-16.7 0-24.6C17.3 208 48.6 156 95.4 112.6zM288 336c44.2 0 80-35.8 80-80s-35.8-80-80-80c-.7 0-1.3 0-2 0c1.3 5.1 2 10.5 2 16c0 35.3-28.7 64-64 64c-5.5 0-10.9-.7-16-2c0 .7 0 1.3 0 2c0 44.2 35.8 80 80 80zm0-208a128 128 0 1 1 0 256 128 128 0 1 1 0-256z" })))))))), message && (h("p", { key: '6365962d7a21f79f1d705deed078f352ec311b99', class: { message: true, [message.level]: true } }, message.text))));
|
|
83766
84424
|
}
|
|
83767
84425
|
static get formAssociated() { return true; }
|
|
83768
84426
|
};
|
|
@@ -83800,12 +84458,12 @@ const XvTextarea = class {
|
|
|
83800
84458
|
}
|
|
83801
84459
|
render() {
|
|
83802
84460
|
const message = resolveFieldMessage({ error: this.error, warning: this.warning, helper: this.helper });
|
|
83803
|
-
return (h(Host, { key: '
|
|
84461
|
+
return (h(Host, { key: '32cde85fad74f49fc14a928eb652a59c07e909d0', class: { disabled: !!this.disabled } }, h("label", { key: '3ecb0591842d2ca2ba3099e4cf273a85b96c0339', class: "control" }, (this.label || this.max) && (h("p", { key: '1a624bff259ecc4854da70bf784178165f204d8e', class: "control_label" }, h("span", { key: 'c615f9d6b36a782592619421598650594b5983d0' }, this.label, this.info && h("xv-tooltip-v2", { key: '469dd76f58eeb7c7b4664dd8b5c577597bd308ed', message: this.info })), this.max !== undefined && !this.counterHide && (h("span", { key: 'b35c81ea8ced8f91fb1f2c572bb57ddaa111b434', class: "control_label__count" }, this.value.length || 0, "/", this.max)))), h("div", { key: '3176748cbf9379b92bd1b8cfdae87a860545c326', class: {
|
|
83804
84462
|
'control_input': true,
|
|
83805
84463
|
readonly: !!this.readonly,
|
|
83806
84464
|
error: !!this.error,
|
|
83807
84465
|
warning: this.warning !== undefined,
|
|
83808
|
-
} }, h("textarea", { key: '
|
|
84466
|
+
} }, h("textarea", { key: 'ff8584218a0d3702cb2047560404e90d28fd1812', class: { 'no-resize': !!this.noResize }, name: this.name, rows: this.rows, value: this.value, maxLength: this.max, disabled: this.disabled, readOnly: this.readonly, placeholder: this.placeholder, onInput: this.onInput }), h("div", { key: '464cdd3d774d99e3362b7b3c68f7e69f32d51687', class: "control_input__icons" }, this._renderIcon()))), message && (h("p", { key: '832b54de9b533b8f0e39540e27c2e49e27b5556e', class: { message: true, [message.level]: true } }, message.text))));
|
|
83809
84467
|
}
|
|
83810
84468
|
_renderIcon() {
|
|
83811
84469
|
if (this.loading)
|
|
@@ -83856,7 +84514,7 @@ const XvTile = class {
|
|
|
83856
84514
|
this.checked = !this.checked;
|
|
83857
84515
|
}
|
|
83858
84516
|
render() {
|
|
83859
|
-
return (h(Host, { key: '
|
|
84517
|
+
return (h(Host, { key: '3db56124d26e5331321aaa2d44ced2db9d4f25e2', class: "xv-tile--host" }, h("label", { key: '4f60c98b1d81496beb2fe393cce26c59a02145c6', class: {
|
|
83860
84518
|
[this.el.className]: !!this.el.className,
|
|
83861
84519
|
'xv-tile': true,
|
|
83862
84520
|
[`xv-tile--variant-${this.variant}`]: !!this.variant,
|
|
@@ -83864,7 +84522,7 @@ const XvTile = class {
|
|
|
83864
84522
|
'xv-tile--disabled': !!this.disabled,
|
|
83865
84523
|
'selected': !!this.checked,
|
|
83866
84524
|
'xv-tile--error': !!this.error,
|
|
83867
|
-
} }, h("div", { key: '
|
|
84525
|
+
} }, h("div", { key: '052af1d2271a3c1ab8e054283bd607d451a7907c', class: "xv-tile_content" }, this.label && h("p", { key: 'd8352f828901347e56fd6dabe4dfd4cbff243437', class: "xv-tile_content__title" }, this.label), h("slot", { key: '292b5129abdcdf19267f9f8affa7ae69b3fc3c5e' })), this.variant === 'selectable' && (h("div", { key: '6e80e294fb9b317c395672511db2aceb04a55d95', class: "xv-tile_control" }, this.multiple ? (h("input", { type: "checkbox", disabled: this.disabled || this.readonly, readonly: this.readonly, onChange: this.handleChange, name: this.name, value: this.value, checked: this.checked })) : (h("input", { type: "radio", disabled: this.disabled || this.readonly, readonly: this.readonly, onChange: this.handleChange, name: this.name, value: this.value, checked: this.checked })))), (this.variant === 'clickable' || this.variant === 'expandable') && (h("div", { key: 'c863ad11287f0287b648a90d5bd511febf9298dc', class: "xv-tile_footer" }, h("button", { key: 'f85a61b433ec3e78c7b2b4037ac4afb8084dae80', class: { 'xv-tile_footer__icon': true, [`icon--${this.variant}`]: true, open: this.checked } }))), h("div", { key: '4c77d1362b02c683f57f38cae820a0795e64f0ea', class: { 'xv-tile_expandable': true, open: this.checked } }, h("slot", { key: '3d83e120b16f1cdfb9dd0bcf3158648f3e70df32', name: "expandable" })))));
|
|
83868
84526
|
}
|
|
83869
84527
|
get el() { return getElement(this); }
|
|
83870
84528
|
};
|
|
@@ -83896,7 +84554,7 @@ const XvToggle = class {
|
|
|
83896
84554
|
};
|
|
83897
84555
|
}
|
|
83898
84556
|
render() {
|
|
83899
|
-
return (h(Host, { key: '
|
|
84557
|
+
return (h(Host, { key: '2b31ae2defc4f7d8e1c210b20f4a3fb8af931866', class: { 'xv-toggle': true, disabled: this.disabled, readonly: !!this.readonly, block: !!this.block } }, this.label && h("span", { key: '2f5d7411afbee3f46952075cd89665266504572d', class: "label" }, this.label), h("label", { key: '529a49324f6b2ee05752427ddf1b2018c1282347', class: "control" }, h("slot", { key: 'cebd95dded17d65d550a8fbbc31e4a59f150a9c8', name: "before" }), h("div", { key: '6ae44e937e46f20e3e4b9666bf4ab47c30e26565', class: "control_input" }, h("input", { key: '4bc5cb456d92ebb6c69be10d8811f77a8e683e7d', type: "checkbox", readonly: this.readonly, name: this.name, value: this.value, checked: this.checked, disabled: this.disabled || this.readonly, onChange: this.onChange }), h("span", { key: '67570ef5b308bdfde75de2f2edc5b06ae56a55dd', class: "toggle" })), h("slot", { key: 'adaf4b0186e737b9f3432a6d89eb3cb6062e84ec', name: "after" }))));
|
|
83900
84558
|
}
|
|
83901
84559
|
static get formAssociated() { return true; }
|
|
83902
84560
|
};
|
|
@@ -83973,7 +84631,7 @@ const XvToggleTip = class {
|
|
|
83973
84631
|
}
|
|
83974
84632
|
;
|
|
83975
84633
|
render() {
|
|
83976
|
-
return (h(Host, { key: '
|
|
84634
|
+
return (h(Host, { key: 'e7954243635bd7420feb8a40d130341ae8849bba', class: "xv-toggle-tip" }, h("div", { key: 'd1fc4e4f61880ab219f4ba1b0f908077a58e5134', class: { 'trigger': true, 'trigger--block': this.block }, role: "button", tabindex: "0", "aria-expanded": this.open ? 'true' : 'false', "aria-controls": "popover", onClick: () => this.setPopover(!this.open), ref: (el) => (this.triggerEl = el) }, h("slot", { key: '1ab4b9c5f21dacd8b82f8e60585076367567216f', name: "trigger" }, h("svg", { key: '72dcf0c9dada11b0c58ecde78a3b0081d6a2d255', class: "trigger_icon", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 512 512", width: 16, height: 16 }, h("path", { key: '610419726f4fca0f6b8793272c7b1f460663e7c1', fill: "currentColor", d: "M256 48a208 208 0 1 1 0 416 208 208 0 1 1 0-416zm0 464A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM216 336c-13.3 0-24 10.7-24 24s10.7 24 24 24l80 0c13.3 0 24-10.7 24-24s-10.7-24-24-24l-8 0 0-88c0-13.3-10.7-24-24-24l-48 0c-13.3 0-24 10.7-24 24s10.7 24 24 24l24 0 0 64-24 0zm40-144a32 32 0 1 0 0-64 32 32 0 1 0 0 64z" })))), h("div", { key: 'ac59c68e89edf7aafa9b3dd2576486a70fcbd4e2', class: { popover: true, autoSize: !!this.autoSize }, role: "tooltip", tabindex: "-1", ref: (el) => (this.popoverEl = el) }, h("div", { key: '9d49318793bf61bfbb64bb4f985ab868bdaf2545', class: "popover-tip", part: "tip", "data-popper-arrow": "" }), h("div", { key: '8c165fbef50d7f2adb8a07d16a01e4346083831a', class: "popover-content" }, h("slot", { key: 'ed871e524e5a0b8c3a2e0d230f8d66b7ab99ccc4', name: "header" }), h("slot", { key: '34824d18b0cd7135fc6cc0e7596c315ee60da19a', name: "body" }), h("slot", { key: '1d1ddfc3c731f54fc1d75214839530f95f0f712d', name: "footer" })))));
|
|
83977
84635
|
}
|
|
83978
84636
|
disconnectedCallback() {
|
|
83979
84637
|
this.destroyPopper();
|
|
@@ -84028,14 +84686,14 @@ const XvTooltip = class {
|
|
|
84028
84686
|
this.destroyTooltip();
|
|
84029
84687
|
}
|
|
84030
84688
|
render() {
|
|
84031
|
-
return (h(Host, { key: '
|
|
84689
|
+
return (h(Host, { key: 'b97a316c17b604ddf3a58d28a6b2ce49f0f3af48', role: "tooltip", class: {
|
|
84032
84690
|
'xv-tooltip-wrapper': true,
|
|
84033
84691
|
[`xv-tooltip-wrapper__block`]: !!this.block,
|
|
84034
84692
|
[`xv-tooltip-wrapper__dashed`]: !!this.dashed,
|
|
84035
|
-
} }, h("slot", { key: '
|
|
84693
|
+
} }, h("slot", { key: '5120e6069ff93fd43302833401679c94e3577823' }, h("svg", { key: 'a37d0c7930cf87e1c3c4d67cd8ba74c52f061587', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 512 512", width: 16, height: 16 }, h("path", { key: '8b762af654ad54e41816fa28e155fb09a3534867', fill: "currentColor", d: "M256 48a208 208 0 1 1 0 416 208 208 0 1 1 0-416zm0 464A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM216 336c-13.3 0-24 10.7-24 24s10.7 24 24 24l80 0c13.3 0 24-10.7 24-24s-10.7-24-24-24l-8 0 0-88c0-13.3-10.7-24-24-24l-48 0c-13.3 0-24 10.7-24 24s10.7 24 24 24l24 0 0 64-24 0zm40-144a32 32 0 1 0 0-64 32 32 0 1 0 0 64z" })))));
|
|
84036
84694
|
}
|
|
84037
84695
|
get el() { return getElement(this); }
|
|
84038
84696
|
};
|
|
84039
84697
|
XvTooltip.style = xvTooltipCss();
|
|
84040
84698
|
|
|
84041
|
-
export { XvAccordion as xv_accordion_v2, XvAccordionItem as xv_accordion_v2_item, XvBreadcrumbs as xv_breadcrumbs_v2, XvButtonGroup as xv_button_group_v2, XvButton as xv_button_v2, XvCard as xv_card_v2, XvCheckbox as xv_checkbox_v2, XvContentSwitcherItem as xv_content_switcher_item_v2, XvContentSwitcher as xv_content_switcher_v2, XvDataTable as xv_data_table, XvDataTableCell as xv_data_table_cell, XvDataTableCollapse as xv_data_table_collapse, XvDataTableRow as xv_data_table_row, XvDatepicker as xv_datepicker, XvDropdown as xv_dropdown_v2, XvDropdownItem as xv_dropdown_v2_item, XvFileUploader as xv_file_uploader, Xvfooter as xv_footer, XvGeoMap as xv_geo_map_v2, XvHeader as xv_header, XvImageViewer as xv_image_viewer, XvLink as xv_link_v2, XvLoader as xv_loader_v2, XvLoginModal as xv_login_modal, XvMegaMenu as xv_mega_menu, XvModal as xv_modal_v2, XvNotification as xv_notification_v2, XvNumberInput as xv_number_input_v2, XvOverflowMenu as xv_overflow_menu_v2, XvOverflowMenuItem as xv_overflow_menu_v2_item, XvPagination as xv_pagination, XvProgressIndicator as xv_progress_indicator_v2, XvProgressIndicatorItem as xv_progress_indicator_v2_item, XvRadio as xv_radio_v2, XvSlider as xv_slider_v2, XvTab as xv_tab_v2, XvTable as xv_table_v2, XvTableCell as xv_table_v2_cell, XvTableExpand as xv_table_v2_expand, XvTableRow as xv_table_v2_row, XvTabs as xv_tabs_v2, XvTagCombobox as xv_tag_combobox, XvTag as xv_tag_v2, XvTextInput as xv_text_input_v2, XvTextarea as xv_textarea, XvTile as xv_tile, XvToggle as xv_toggle, XvToggleTip as xv_toggle_tip, XvTooltip as xv_tooltip_v2 };
|
|
84699
|
+
export { XvAccordion as xv_accordion_v2, XvAccordionItem as xv_accordion_v2_item, XvBreadcrumbs as xv_breadcrumbs_v2, XvButtonGroup as xv_button_group_v2, XvButton as xv_button_v2, XvCard as xv_card_v2, XvCheckbox as xv_checkbox_v2, XvContentSwitcherItem as xv_content_switcher_item_v2, XvContentSwitcher as xv_content_switcher_v2, XvDataTable as xv_data_table, XvDataTableCell as xv_data_table_cell, XvDataTableCollapse as xv_data_table_collapse, XvDataTableRow as xv_data_table_row, XvDatePicker as xv_date_picker, XvDatepicker as xv_datepicker, XvDropdown as xv_dropdown_v2, XvDropdownItem as xv_dropdown_v2_item, XvFileUploader as xv_file_uploader, Xvfooter as xv_footer, XvGeoMap as xv_geo_map_v2, XvHeader as xv_header, XvImageViewer as xv_image_viewer, XvLink as xv_link_v2, XvLoader as xv_loader_v2, XvLoginModal as xv_login_modal, XvMegaMenu as xv_mega_menu, XvModal as xv_modal_v2, XvNotification as xv_notification_v2, XvNumberInput as xv_number_input_v2, XvOverflowMenu as xv_overflow_menu_v2, XvOverflowMenuItem as xv_overflow_menu_v2_item, XvPagination as xv_pagination, XvProgressIndicator as xv_progress_indicator_v2, XvProgressIndicatorItem as xv_progress_indicator_v2_item, XvRadio as xv_radio_v2, XvSlider as xv_slider_v2, XvTab as xv_tab_v2, XvTable as xv_table_v2, XvTableCell as xv_table_v2_cell, XvTableExpand as xv_table_v2_expand, XvTableRow as xv_table_v2_row, XvTabs as xv_tabs_v2, XvTagCombobox as xv_tag_combobox, XvTag as xv_tag_v2, XvTextInput as xv_text_input_v2, XvTextarea as xv_textarea, XvTile as xv_tile, XvToggle as xv_toggle, XvToggleTip as xv_toggle_tip, XvTooltip as xv_tooltip_v2 };
|