@lucca-front/ng 21.3.1-rc.2 → 21.3.1
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/fesm2022/lucca-front-ng-a11y.mjs +6 -0
- package/fesm2022/lucca-front-ng-a11y.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-activity-feed.mjs +3 -0
- package/fesm2022/lucca-front-ng-activity-feed.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-app-layout.mjs +2 -2
- package/fesm2022/lucca-front-ng-box.mjs +1 -1
- package/fesm2022/lucca-front-ng-box.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-breadcrumbs.mjs +3 -0
- package/fesm2022/lucca-front-ng-breadcrumbs.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-callout.mjs +3 -0
- package/fesm2022/lucca-front-ng-callout.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-chip.mjs +5 -0
- package/fesm2022/lucca-front-ng-chip.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-core-select-user.mjs +4 -0
- package/fesm2022/lucca-front-ng-core-select-user.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-core-select.mjs +9 -0
- package/fesm2022/lucca-front-ng-core-select.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-core.mjs +36 -1
- package/fesm2022/lucca-front-ng-core.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-data-table.mjs +16 -9
- package/fesm2022/lucca-front-ng-data-table.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-date.mjs +10 -0
- package/fesm2022/lucca-front-ng-date.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-date2.mjs +2 -2
- package/fesm2022/lucca-front-ng-date2.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-department.mjs +3 -0
- package/fesm2022/lucca-front-ng-department.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-dialog.mjs +4 -1
- package/fesm2022/lucca-front-ng-dialog.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-establishment.mjs +3 -0
- package/fesm2022/lucca-front-ng-establishment.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-file-upload.mjs +35 -9
- package/fesm2022/lucca-front-ng-file-upload.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-filter-pills.mjs +5 -0
- package/fesm2022/lucca-front-ng-filter-pills.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-form-field.mjs +3 -0
- package/fesm2022/lucca-front-ng-form-field.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-form-label.mjs +39 -30
- package/fesm2022/lucca-front-ng-form-label.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-forms-rich-text-input.mjs +60 -10
- package/fesm2022/lucca-front-ng-forms-rich-text-input.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-forms.mjs +22 -3
- package/fesm2022/lucca-front-ng-forms.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-highlight-data.mjs +2 -0
- package/fesm2022/lucca-front-ng-highlight-data.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-index-table.mjs +2 -2
- package/fesm2022/lucca-front-ng-index-table.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-input.mjs +4 -2
- package/fesm2022/lucca-front-ng-input.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-link.mjs +32 -13
- package/fesm2022/lucca-front-ng-link.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-mobile-push.mjs +9 -0
- package/fesm2022/lucca-front-ng-mobile-push.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-modal.mjs +6 -1
- package/fesm2022/lucca-front-ng-modal.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-multi-select.mjs +23 -2
- package/fesm2022/lucca-front-ng-multi-select.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-option.mjs +12 -0
- package/fesm2022/lucca-front-ng-option.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-pagination.mjs +7 -1
- package/fesm2022/lucca-front-ng-pagination.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-plg-push.mjs +4 -1
- package/fesm2022/lucca-front-ng-plg-push.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-popover.mjs +2 -1
- package/fesm2022/lucca-front-ng-popover.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-popover2.mjs +7 -3
- package/fesm2022/lucca-front-ng-popover2.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-read-more.mjs +4 -0
- package/fesm2022/lucca-front-ng-read-more.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-scroll.mjs +5 -2
- package/fesm2022/lucca-front-ng-scroll.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-simple-select.mjs +10 -2
- package/fesm2022/lucca-front-ng-simple-select.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-skeleton.mjs +2 -2
- package/fesm2022/lucca-front-ng-skeleton.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-sortable-list.mjs +4 -3
- package/fesm2022/lucca-front-ng-sortable-list.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-time.mjs +59 -43
- package/fesm2022/lucca-front-ng-time.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-title.mjs +7 -3
- package/fesm2022/lucca-front-ng-title.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-toast.mjs +3 -0
- package/fesm2022/lucca-front-ng-toast.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-tooltip.mjs +2 -1
- package/fesm2022/lucca-front-ng-tooltip.mjs.map +1 -1
- package/fesm2022/lucca-front-ng-user.mjs +7 -0
- package/fesm2022/lucca-front-ng-user.mjs.map +1 -1
- package/package.json +4 -4
- package/types/lucca-front-ng-core.d.ts +20 -1
- package/types/lucca-front-ng-file-upload.d.ts +3 -1
- package/types/lucca-front-ng-highlight-data.d.ts +1 -1
- package/types/lucca-front-ng-input.d.ts +2 -1
- package/types/lucca-front-ng-sortable-list.d.ts +2 -1
- package/types/lucca-front-ng-title.d.ts +1 -0
|
@@ -367,29 +367,29 @@ const DEFAULT_TIME_DECIMAL_PIPE_FORMAT$1 = '2.0-0';
|
|
|
367
367
|
|
|
368
368
|
const Translations$2 = {
|
|
369
369
|
pt: {
|
|
370
|
-
timePickerHours: '
|
|
370
|
+
timePickerHours: 'horas',
|
|
371
371
|
timePickerTimeSeparator: 'h',
|
|
372
|
-
timePickerMinutes: '
|
|
372
|
+
timePickerMinutes: 'minutos',
|
|
373
373
|
},
|
|
374
374
|
es: {
|
|
375
|
-
timePickerHours: '
|
|
375
|
+
timePickerHours: 'horas',
|
|
376
376
|
timePickerTimeSeparator: 'h',
|
|
377
|
-
timePickerMinutes: '
|
|
377
|
+
timePickerMinutes: 'minutos',
|
|
378
378
|
},
|
|
379
379
|
'nl-BE': {
|
|
380
|
-
timePickerHours: '
|
|
380
|
+
timePickerHours: 'uren',
|
|
381
381
|
timePickerTimeSeparator: 'h',
|
|
382
|
-
timePickerMinutes: '
|
|
382
|
+
timePickerMinutes: 'minuten',
|
|
383
383
|
},
|
|
384
384
|
nl: {
|
|
385
|
-
timePickerHours: '
|
|
385
|
+
timePickerHours: 'uren',
|
|
386
386
|
timePickerTimeSeparator: 'h',
|
|
387
|
-
timePickerMinutes: '
|
|
387
|
+
timePickerMinutes: 'minuten',
|
|
388
388
|
},
|
|
389
389
|
it: {
|
|
390
|
-
timePickerHours: '
|
|
390
|
+
timePickerHours: 'ore',
|
|
391
391
|
timePickerTimeSeparator: 'h',
|
|
392
|
-
timePickerMinutes: '
|
|
392
|
+
timePickerMinutes: 'minuti',
|
|
393
393
|
},
|
|
394
394
|
de: {
|
|
395
395
|
timePickerHours: 'Stunden',
|
|
@@ -397,14 +397,19 @@ const Translations$2 = {
|
|
|
397
397
|
timePickerMinutes: 'Minuten',
|
|
398
398
|
},
|
|
399
399
|
fr: {
|
|
400
|
-
timePickerHours: '
|
|
400
|
+
timePickerHours: 'heures',
|
|
401
401
|
timePickerTimeSeparator: 'h',
|
|
402
|
-
timePickerMinutes: '
|
|
402
|
+
timePickerMinutes: 'minutes',
|
|
403
403
|
},
|
|
404
404
|
en: {
|
|
405
|
-
timePickerHours: '
|
|
405
|
+
timePickerHours: 'hours',
|
|
406
|
+
timePickerTimeSeparator: 'h',
|
|
407
|
+
timePickerMinutes: 'minutes',
|
|
408
|
+
},
|
|
409
|
+
pl: {
|
|
410
|
+
timePickerHours: 'godziny',
|
|
406
411
|
timePickerTimeSeparator: 'h',
|
|
407
|
-
timePickerMinutes: '
|
|
412
|
+
timePickerMinutes: 'minuty',
|
|
408
413
|
},
|
|
409
414
|
};
|
|
410
415
|
|
|
@@ -599,7 +604,7 @@ class DurationPickerComponent extends BasePickerComponent {
|
|
|
599
604
|
useExisting: forwardRef(() => DurationPickerComponent),
|
|
600
605
|
multi: true,
|
|
601
606
|
},
|
|
602
|
-
], usesInheritance: true, ngImport: i0, template: "<div [class]=\"pickerClasses()\" (copy)=\"copyHandler($event)\" (paste)=\"pasteHandler($event)\" (animationend)=\"keyPressed.set(false)\">\n\t<fieldset class=\"timePicker-fieldset\" [disabled]=\"disabled()\">\n\t\t<legend>\n\t\t\t<span class=\"pr-u-mask\">{{ label() }}</span>\n\t\t</legend>\n\t\t<lu-time-picker-part\n\t\t\t#hoursPart\n\t\t\tclass=\"timePicker-fieldset-group\"\n\t\t\t[disabled]=\"disabled()\"\n\t\t\t[label]=\"intl().timePickerHours\"\n\t\t\t[value]=\"hours()\"\n\t\t\t[decimalConf]=\"hoursDecimalConf\"\n\t\t\t[hideValue]=\"shouldHideValue()\"\n\t\t\t[displayArrows]=\"displayArrows()\"\n\t\t\t[maxDigits]=\"maxDigits()\"\n\t\t\t(valueChange)=\"hoursInputHandler($event)\"\n\t\t\t(nextRequest)=\"focusPart('minutes')\"\n\t\t\t(inputControlClick)=\"inputControlClickHandler('hours', $event)\"\n\t\t\t(nonDigitKeyPressed)=\"keyPressed.set(true)\"\n\t\t/>\n\t\t<div aria-hidden=\"true\" [class]=\"fieldsetSuffixClasses()\" [attr.data-content-before]=\"separator()\"></div>\n\t\t<lu-time-picker-part\n\t\t\t#minutesPart\n\t\t\tclass=\"timePicker-fieldset-group\"\n\t\t\t[label]=\"intl().timePickerMinutes\"\n\t\t\t[value]=\"minutes()\"\n\t\t\t[max]=\"59\"\n\t\t\t[hideValue]=\"shouldHideValue()\"\n\t\t\t[displayArrows]=\"displayArrows()\"\n\t\t\t[disabled]=\"disabled() || !minutesIncrement()\"\n\t\t\tshowZero\n\t\t\t(valueChange)=\"minutesInputHandler($event)\"\n\t\t\t(prevRequest)=\"focusPart('hours')\"\n\t\t\t(inputControlClick)=\"inputControlClickHandler('minutes', $event)\"\n\t\t\t(nonDigitKeyPressed)=\"keyPressed.set(true)\"\n\t\t/>\n\t</fieldset>\n</div>\n", styles: ["@layer components{.timePicker{--components-timepicker-border: var(--pr-t-color-input-border);--components-timepicker-background: var(--pr-t-color-input-background);--components-timepicker-color: var(--pr-t-color-input-text);--components-timepicker-font: var(--pr-t-font-body-M);--components-timepicker-input-height: 2rem;--components-timepicker-input-minInlineSize: .5rem;--components-timepicker-input-padding-inline: var(--components-timepicker-start) var(--components-timepicker-end);--components-timepicker-input-padding-block: var(--pr-t-spacings-50);--components-timepicker-padding: 0;--components-timepicker-display-inset-inline: var(--components-timepicker-input-padding-inline);--components-timepicker-display-inset-block: var(--components-timepicker-input-padding-block);--components-timepicker-separator-left: 2.375rem;--components-timepicker-start: var(--pr-t-spacings-50);--components-timepicker-end: var(--pr-t-spacings-100);padding:var(--components-timepicker-padding);inline-size:fit-content}.timePicker-fieldset{display:flex;align-items:center;box-shadow:0 0 0 1px var(--components-timepicker-border);border-radius:var(--pr-t-border-radius-input);padding:0;border:0;margin:0;background-color:var(--components-timepicker-background);color:var(--components-timepicker-color);font:var(--components-timepicker-font);position:relative;cursor:text}.timePicker-fieldset:hover{--components-timepicker-border: var(--pr-t-color-input-border-hover)}.timePicker-fieldset:focus-within{outline:2px solid var(--palettes-700, var(--palettes-product-700));outline-offset:3px}.timePicker-fieldset .timePicker-fieldset{box-shadow:initial}.timePicker-fieldset .timePicker-fieldset:focus-within{outline:initial}.timePicker-arrow{align-self:stretch;display:flex;align-items:center;color:var(--pr-t-color-text-subtle)}.timePicker-arrow-icon .lucca-icon{--icon-size: 1.25rem}.timePicker-fieldset-groupSeparator{
|
|
607
|
+
], usesInheritance: true, ngImport: i0, template: "<div [class]=\"pickerClasses()\" (copy)=\"copyHandler($event)\" (paste)=\"pasteHandler($event)\" (animationend)=\"keyPressed.set(false)\">\n\t<fieldset class=\"timePicker-fieldset\" [disabled]=\"disabled()\">\n\t\t<legend>\n\t\t\t<span class=\"pr-u-mask\">{{ label() }}</span>\n\t\t</legend>\n\t\t<lu-time-picker-part\n\t\t\t#hoursPart\n\t\t\tclass=\"timePicker-fieldset-group\"\n\t\t\t[disabled]=\"disabled()\"\n\t\t\t[label]=\"intl().timePickerHours\"\n\t\t\t[value]=\"hours()\"\n\t\t\t[decimalConf]=\"hoursDecimalConf\"\n\t\t\t[hideValue]=\"shouldHideValue()\"\n\t\t\t[displayArrows]=\"displayArrows()\"\n\t\t\t[maxDigits]=\"maxDigits()\"\n\t\t\t(valueChange)=\"hoursInputHandler($event)\"\n\t\t\t(nextRequest)=\"focusPart('minutes')\"\n\t\t\t(inputControlClick)=\"inputControlClickHandler('hours', $event)\"\n\t\t\t(nonDigitKeyPressed)=\"keyPressed.set(true)\"\n\t\t/>\n\t\t<div aria-hidden=\"true\" [class]=\"fieldsetSuffixClasses()\" [attr.data-content-before]=\"separator()\" (click)=\"focusPart('hours')\"></div>\n\t\t<lu-time-picker-part\n\t\t\t#minutesPart\n\t\t\tclass=\"timePicker-fieldset-group\"\n\t\t\t[label]=\"intl().timePickerMinutes\"\n\t\t\t[value]=\"minutes()\"\n\t\t\t[max]=\"59\"\n\t\t\t[hideValue]=\"shouldHideValue()\"\n\t\t\t[displayArrows]=\"displayArrows()\"\n\t\t\t[disabled]=\"disabled() || !minutesIncrement()\"\n\t\t\tshowZero\n\t\t\t(valueChange)=\"minutesInputHandler($event)\"\n\t\t\t(prevRequest)=\"focusPart('hours')\"\n\t\t\t(inputControlClick)=\"inputControlClickHandler('minutes', $event)\"\n\t\t\t(nonDigitKeyPressed)=\"keyPressed.set(true)\"\n\t\t/>\n\t</fieldset>\n</div>\n", styles: ["@layer components{.timePicker{--components-timepicker-border: var(--pr-t-color-input-border);--components-timepicker-background: var(--pr-t-color-input-background);--components-timepicker-color: var(--pr-t-color-input-text);--components-timepicker-font: var(--pr-t-font-body-M);--components-timepicker-input-height: 2rem;--components-timepicker-input-minInlineSize: .5rem;--components-timepicker-input-padding-inline: var(--components-timepicker-start) var(--components-timepicker-end);--components-timepicker-input-padding-block: var(--pr-t-spacings-50);--components-timepicker-padding: 0;--components-timepicker-display-inset-inline: var(--components-timepicker-input-padding-inline);--components-timepicker-display-inset-block: var(--components-timepicker-input-padding-block);--components-timepicker-separator-left: 2.375rem;--components-timepicker-start: var(--pr-t-spacings-50);--components-timepicker-end: var(--pr-t-spacings-100);padding:var(--components-timepicker-padding);inline-size:fit-content}.timePicker-fieldset{display:flex;align-items:center;box-shadow:0 0 0 1px var(--components-timepicker-border);border-radius:var(--pr-t-border-radius-input);padding:0;border:0;margin:0;background-color:var(--components-timepicker-background);color:var(--components-timepicker-color);font:var(--components-timepicker-font);position:relative;cursor:text}.timePicker-fieldset:hover{--components-timepicker-border: var(--pr-t-color-input-border-hover)}.timePicker-fieldset:focus-within{outline:2px solid var(--palettes-700, var(--palettes-product-700));outline-offset:3px}.timePicker-fieldset .timePicker-fieldset{box-shadow:initial}.timePicker-fieldset .timePicker-fieldset:focus-within{outline:initial}.timePicker-arrow{align-self:stretch;display:flex;align-items:center;color:var(--pr-t-color-text-subtle)}.timePicker-arrow-icon .lucca-icon{--icon-size: 1.25rem}.timePicker-fieldset-groupSeparator{display:grid;place-items:center;text-align:center;inline-size:fit-content;block-size:calc(var(--components-timepicker-input-height) + var(--components-timepicker-input-padding-block) * 2);margin-inline:calc(var(--pr-t-spacings-25) * -1);position:relative;inset-inline-start:calc(var(--pr-t-spacings-25) * -1);z-index:1}.timePicker-fieldset-group{position:relative}.timePicker-fieldset-group~.timePicker-fieldset-group{margin-inline-start:calc(var(--pr-t-spacings-50) * -1);--components-timepicker-input-padding-inline: var(--components-timepicker-end) var(--components-timepicker-start);--components-timepicker-display-inset-inline: var(--components-timepicker-input-padding-inline)}.timePicker-fieldset-group-textfield{background-color:transparent}.timePicker-fieldset-group-textfield-input{display:flex;align-items:center;justify-content:center;border:0;block-size:var(--components-timepicker-input-height);inline-size:calc(var(--components-timepicker-input-minInlineSize) + var(--components-timepicker-input-digits, 2) * 1ch);outline:none;color:inherit;background-color:transparent;text-align:center;padding-block:var(--components-timepicker-input-padding-block);padding-inline:var(--components-timepicker-input-padding-inline);box-sizing:content-box;opacity:.0001}.timePicker-fieldset-group-textfield-input::placeholder{color:var(--component-textField-placeholder)}.timePicker-fieldset-group-textfield-input:focus-visible+.timePicker-fieldset-group-textfield-display{background-color:var(--palettes-product-100)}.timePicker-fieldset-group-textfield-display{position:absolute;inset-block:var(--components-timepicker-display-inset-block);inset-inline:var(--components-timepicker-display-inset-inline);border-radius:var(--pr-t-border-radius-50);pointer-events:none;display:grid;place-items:center}.timePicker-fieldset-group-stepper{position:absolute;inset-block-end:calc(var(--components-timepicker-input-height) + var(--pr-t-spacings-150) + 1px);border:0;padding:0;block-size:1rem;inline-size:1rem;inset-inline-start:50%;transform:translate(-50%);background-color:transparent;color:var(--palettes-neutral-600);display:inline-flex;justify-content:center;align-items:center;border-radius:var(--pr-t-border-radius-50);outline:none;opacity:1;transition-property:opacity;transition-duration:var(--commons-animations-durations-fast);cursor:pointer}.timePicker-fieldset-group-stepper:hover{background-color:var(--palettes-neutral-50);color:var(--palettes-neutral-800)}.timePicker-fieldset-group-stepper:disabled{cursor:default;color:var(--palettes-neutral-500);pointer-events:none}.timePicker-fieldset-group-stepper .lucca-icon{--icon-size: 1rem}.timePicker-fieldset-group-stepper+.timePicker-fieldset-group-stepper{inset-block-start:calc(var(--components-timepicker-input-height) + var(--pr-t-spacings-150) + 1px);inset-block-end:auto}.timePicker-fieldset-meridiem{box-sizing:content-box;inline-size:calc(var(--pr-t-spacings-100) + 2ch);padding-inline:var(--pr-t-spacings-50);position:relative;align-self:stretch;margin-inline-start:calc(var(--pr-t-spacings-50) * -1)}.timePicker-fieldset-meridiem:after{content:\"\";position:absolute;inset-block:var(--components-timepicker-display-inset-block);inset-inline:var(--pr-t-spacings-50);border-radius:var(--pr-t-border-radius-50);display:grid;place-items:center;text-align:end}.timePicker-fieldset-meridiem:has(input:focus):after{background-color:var(--palettes-product-100)}.timePicker-fieldset-meridiem:has(.timePicker-fieldset-meridiem-ante-input:checked):after{content:\"AM\"/\"\"}.timePicker-fieldset-meridiem:has(.timePicker-fieldset-meridiem-post-input:checked):after{content:\"PM\"/\"\"}.timePicker-fieldset-meridiem-ante,.timePicker-fieldset-meridiem-post{border:0;clip-path:rect(1px 1px 1px 1px);margin:-1px;overflow:hidden;padding:0;position:absolute;block-size:1px;inline-size:1px;white-space:nowrap;contain:paint}}@layer mods{.timePicker.mod-S{--components-timepicker-font: var(--pr-t-font-body-S);--components-timepicker-input-padding-block: var(--pr-t-spacings-25);--components-timepicker-input-height: 1.75rem;--components-timepicker-separator-left: 1.875rem;--components-timepicker-start: var(--pr-t-spacings-25);--components-timepicker-end: var(--pr-t-spacings-75)}.timePicker.mod-S .timePicker-arrow-icon .lucca-icon{--icon-size: 1rem}.timePicker.mod-S .timePicker-fieldset-group{--components-timepicker-input-padding-inline: var(--components-timepicker-start) var(--components-timepicker-end);--components-timepicker-display-inset-inline: var(--components-timepicker-input-padding-inline)}.timePicker.mod-S .timePicker-fieldset-group~.timePicker-fieldset-group{--components-timepicker-input-padding-inline: var(--components-timepicker-end) var(--components-timepicker-start)}.timePicker.mod-S .timePicker-fieldset-meridiem{inline-size:calc(var(--pr-t-spacings-50) + 2ch)}.timePicker.mod-S .timePicker-fieldset-meridiem:after{inset-inline:var(--pr-t-spacings-25)}.timePicker.mod-stepper{--components-timepicker-padding: var(--pr-t-spacings-300) 0}.timePicker.mod-stepperHover:not(:hover,:focus-within) .timePicker-fieldset-group-stepper{opacity:0}.timePicker:has([aria-invalid=true]){--components-timepicker-background: var(--pr-t-color-input-background-critical);--components-timepicker-border: var(--pr-t-color-input-border-critical)}.timePicker:has([aria-invalid=true]):hover{--components-timepicker-border: var(--pr-t-color-input-border-critical-hover)}.timePicker:has([disabled]){--components-timepicker-background: var(--pr-t-color-input-background-disabled);--components-timepicker-border: var(--commons-disabled-placeholder);--components-timepicker-color: var(--pr-t-color-input-text-disabled)}}@layer base{lu-duration-picker{display:inline-flex}}\n"], dependencies: [{ kind: "component", type: TimePickerPartComponent, selector: "lu-time-picker-part", inputs: ["label", "decimalConf", "value", "display", "max", "autoWidth", "displayArrows", "isReadonly", "hideValue", "disabled", "focused", "maxDigits", "showZero", "digitNumber", "isValueSet"], outputs: ["valueChange", "digitNumberChange", "isValueSetChange", "prevRequest", "nextRequest", "nonDigitKeyPressed", "inputControlClick", "touched"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
603
608
|
}
|
|
604
609
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: DurationPickerComponent, decorators: [{
|
|
605
610
|
type: Component,
|
|
@@ -609,7 +614,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
|
|
|
609
614
|
useExisting: forwardRef(() => DurationPickerComponent),
|
|
610
615
|
multi: true,
|
|
611
616
|
},
|
|
612
|
-
], template: "<div [class]=\"pickerClasses()\" (copy)=\"copyHandler($event)\" (paste)=\"pasteHandler($event)\" (animationend)=\"keyPressed.set(false)\">\n\t<fieldset class=\"timePicker-fieldset\" [disabled]=\"disabled()\">\n\t\t<legend>\n\t\t\t<span class=\"pr-u-mask\">{{ label() }}</span>\n\t\t</legend>\n\t\t<lu-time-picker-part\n\t\t\t#hoursPart\n\t\t\tclass=\"timePicker-fieldset-group\"\n\t\t\t[disabled]=\"disabled()\"\n\t\t\t[label]=\"intl().timePickerHours\"\n\t\t\t[value]=\"hours()\"\n\t\t\t[decimalConf]=\"hoursDecimalConf\"\n\t\t\t[hideValue]=\"shouldHideValue()\"\n\t\t\t[displayArrows]=\"displayArrows()\"\n\t\t\t[maxDigits]=\"maxDigits()\"\n\t\t\t(valueChange)=\"hoursInputHandler($event)\"\n\t\t\t(nextRequest)=\"focusPart('minutes')\"\n\t\t\t(inputControlClick)=\"inputControlClickHandler('hours', $event)\"\n\t\t\t(nonDigitKeyPressed)=\"keyPressed.set(true)\"\n\t\t/>\n\t\t<div aria-hidden=\"true\" [class]=\"fieldsetSuffixClasses()\" [attr.data-content-before]=\"separator()\"></div>\n\t\t<lu-time-picker-part\n\t\t\t#minutesPart\n\t\t\tclass=\"timePicker-fieldset-group\"\n\t\t\t[label]=\"intl().timePickerMinutes\"\n\t\t\t[value]=\"minutes()\"\n\t\t\t[max]=\"59\"\n\t\t\t[hideValue]=\"shouldHideValue()\"\n\t\t\t[displayArrows]=\"displayArrows()\"\n\t\t\t[disabled]=\"disabled() || !minutesIncrement()\"\n\t\t\tshowZero\n\t\t\t(valueChange)=\"minutesInputHandler($event)\"\n\t\t\t(prevRequest)=\"focusPart('hours')\"\n\t\t\t(inputControlClick)=\"inputControlClickHandler('minutes', $event)\"\n\t\t\t(nonDigitKeyPressed)=\"keyPressed.set(true)\"\n\t\t/>\n\t</fieldset>\n</div>\n", styles: ["@layer components{.timePicker{--components-timepicker-border: var(--pr-t-color-input-border);--components-timepicker-background: var(--pr-t-color-input-background);--components-timepicker-color: var(--pr-t-color-input-text);--components-timepicker-font: var(--pr-t-font-body-M);--components-timepicker-input-height: 2rem;--components-timepicker-input-minInlineSize: .5rem;--components-timepicker-input-padding-inline: var(--components-timepicker-start) var(--components-timepicker-end);--components-timepicker-input-padding-block: var(--pr-t-spacings-50);--components-timepicker-padding: 0;--components-timepicker-display-inset-inline: var(--components-timepicker-input-padding-inline);--components-timepicker-display-inset-block: var(--components-timepicker-input-padding-block);--components-timepicker-separator-left: 2.375rem;--components-timepicker-start: var(--pr-t-spacings-50);--components-timepicker-end: var(--pr-t-spacings-100);padding:var(--components-timepicker-padding);inline-size:fit-content}.timePicker-fieldset{display:flex;align-items:center;box-shadow:0 0 0 1px var(--components-timepicker-border);border-radius:var(--pr-t-border-radius-input);padding:0;border:0;margin:0;background-color:var(--components-timepicker-background);color:var(--components-timepicker-color);font:var(--components-timepicker-font);position:relative;cursor:text}.timePicker-fieldset:hover{--components-timepicker-border: var(--pr-t-color-input-border-hover)}.timePicker-fieldset:focus-within{outline:2px solid var(--palettes-700, var(--palettes-product-700));outline-offset:3px}.timePicker-fieldset .timePicker-fieldset{box-shadow:initial}.timePicker-fieldset .timePicker-fieldset:focus-within{outline:initial}.timePicker-arrow{align-self:stretch;display:flex;align-items:center;color:var(--pr-t-color-text-subtle)}.timePicker-arrow-icon .lucca-icon{--icon-size: 1.25rem}.timePicker-fieldset-groupSeparator{
|
|
617
|
+
], template: "<div [class]=\"pickerClasses()\" (copy)=\"copyHandler($event)\" (paste)=\"pasteHandler($event)\" (animationend)=\"keyPressed.set(false)\">\n\t<fieldset class=\"timePicker-fieldset\" [disabled]=\"disabled()\">\n\t\t<legend>\n\t\t\t<span class=\"pr-u-mask\">{{ label() }}</span>\n\t\t</legend>\n\t\t<lu-time-picker-part\n\t\t\t#hoursPart\n\t\t\tclass=\"timePicker-fieldset-group\"\n\t\t\t[disabled]=\"disabled()\"\n\t\t\t[label]=\"intl().timePickerHours\"\n\t\t\t[value]=\"hours()\"\n\t\t\t[decimalConf]=\"hoursDecimalConf\"\n\t\t\t[hideValue]=\"shouldHideValue()\"\n\t\t\t[displayArrows]=\"displayArrows()\"\n\t\t\t[maxDigits]=\"maxDigits()\"\n\t\t\t(valueChange)=\"hoursInputHandler($event)\"\n\t\t\t(nextRequest)=\"focusPart('minutes')\"\n\t\t\t(inputControlClick)=\"inputControlClickHandler('hours', $event)\"\n\t\t\t(nonDigitKeyPressed)=\"keyPressed.set(true)\"\n\t\t/>\n\t\t<div aria-hidden=\"true\" [class]=\"fieldsetSuffixClasses()\" [attr.data-content-before]=\"separator()\" (click)=\"focusPart('hours')\"></div>\n\t\t<lu-time-picker-part\n\t\t\t#minutesPart\n\t\t\tclass=\"timePicker-fieldset-group\"\n\t\t\t[label]=\"intl().timePickerMinutes\"\n\t\t\t[value]=\"minutes()\"\n\t\t\t[max]=\"59\"\n\t\t\t[hideValue]=\"shouldHideValue()\"\n\t\t\t[displayArrows]=\"displayArrows()\"\n\t\t\t[disabled]=\"disabled() || !minutesIncrement()\"\n\t\t\tshowZero\n\t\t\t(valueChange)=\"minutesInputHandler($event)\"\n\t\t\t(prevRequest)=\"focusPart('hours')\"\n\t\t\t(inputControlClick)=\"inputControlClickHandler('minutes', $event)\"\n\t\t\t(nonDigitKeyPressed)=\"keyPressed.set(true)\"\n\t\t/>\n\t</fieldset>\n</div>\n", styles: ["@layer components{.timePicker{--components-timepicker-border: var(--pr-t-color-input-border);--components-timepicker-background: var(--pr-t-color-input-background);--components-timepicker-color: var(--pr-t-color-input-text);--components-timepicker-font: var(--pr-t-font-body-M);--components-timepicker-input-height: 2rem;--components-timepicker-input-minInlineSize: .5rem;--components-timepicker-input-padding-inline: var(--components-timepicker-start) var(--components-timepicker-end);--components-timepicker-input-padding-block: var(--pr-t-spacings-50);--components-timepicker-padding: 0;--components-timepicker-display-inset-inline: var(--components-timepicker-input-padding-inline);--components-timepicker-display-inset-block: var(--components-timepicker-input-padding-block);--components-timepicker-separator-left: 2.375rem;--components-timepicker-start: var(--pr-t-spacings-50);--components-timepicker-end: var(--pr-t-spacings-100);padding:var(--components-timepicker-padding);inline-size:fit-content}.timePicker-fieldset{display:flex;align-items:center;box-shadow:0 0 0 1px var(--components-timepicker-border);border-radius:var(--pr-t-border-radius-input);padding:0;border:0;margin:0;background-color:var(--components-timepicker-background);color:var(--components-timepicker-color);font:var(--components-timepicker-font);position:relative;cursor:text}.timePicker-fieldset:hover{--components-timepicker-border: var(--pr-t-color-input-border-hover)}.timePicker-fieldset:focus-within{outline:2px solid var(--palettes-700, var(--palettes-product-700));outline-offset:3px}.timePicker-fieldset .timePicker-fieldset{box-shadow:initial}.timePicker-fieldset .timePicker-fieldset:focus-within{outline:initial}.timePicker-arrow{align-self:stretch;display:flex;align-items:center;color:var(--pr-t-color-text-subtle)}.timePicker-arrow-icon .lucca-icon{--icon-size: 1.25rem}.timePicker-fieldset-groupSeparator{display:grid;place-items:center;text-align:center;inline-size:fit-content;block-size:calc(var(--components-timepicker-input-height) + var(--components-timepicker-input-padding-block) * 2);margin-inline:calc(var(--pr-t-spacings-25) * -1);position:relative;inset-inline-start:calc(var(--pr-t-spacings-25) * -1);z-index:1}.timePicker-fieldset-group{position:relative}.timePicker-fieldset-group~.timePicker-fieldset-group{margin-inline-start:calc(var(--pr-t-spacings-50) * -1);--components-timepicker-input-padding-inline: var(--components-timepicker-end) var(--components-timepicker-start);--components-timepicker-display-inset-inline: var(--components-timepicker-input-padding-inline)}.timePicker-fieldset-group-textfield{background-color:transparent}.timePicker-fieldset-group-textfield-input{display:flex;align-items:center;justify-content:center;border:0;block-size:var(--components-timepicker-input-height);inline-size:calc(var(--components-timepicker-input-minInlineSize) + var(--components-timepicker-input-digits, 2) * 1ch);outline:none;color:inherit;background-color:transparent;text-align:center;padding-block:var(--components-timepicker-input-padding-block);padding-inline:var(--components-timepicker-input-padding-inline);box-sizing:content-box;opacity:.0001}.timePicker-fieldset-group-textfield-input::placeholder{color:var(--component-textField-placeholder)}.timePicker-fieldset-group-textfield-input:focus-visible+.timePicker-fieldset-group-textfield-display{background-color:var(--palettes-product-100)}.timePicker-fieldset-group-textfield-display{position:absolute;inset-block:var(--components-timepicker-display-inset-block);inset-inline:var(--components-timepicker-display-inset-inline);border-radius:var(--pr-t-border-radius-50);pointer-events:none;display:grid;place-items:center}.timePicker-fieldset-group-stepper{position:absolute;inset-block-end:calc(var(--components-timepicker-input-height) + var(--pr-t-spacings-150) + 1px);border:0;padding:0;block-size:1rem;inline-size:1rem;inset-inline-start:50%;transform:translate(-50%);background-color:transparent;color:var(--palettes-neutral-600);display:inline-flex;justify-content:center;align-items:center;border-radius:var(--pr-t-border-radius-50);outline:none;opacity:1;transition-property:opacity;transition-duration:var(--commons-animations-durations-fast);cursor:pointer}.timePicker-fieldset-group-stepper:hover{background-color:var(--palettes-neutral-50);color:var(--palettes-neutral-800)}.timePicker-fieldset-group-stepper:disabled{cursor:default;color:var(--palettes-neutral-500);pointer-events:none}.timePicker-fieldset-group-stepper .lucca-icon{--icon-size: 1rem}.timePicker-fieldset-group-stepper+.timePicker-fieldset-group-stepper{inset-block-start:calc(var(--components-timepicker-input-height) + var(--pr-t-spacings-150) + 1px);inset-block-end:auto}.timePicker-fieldset-meridiem{box-sizing:content-box;inline-size:calc(var(--pr-t-spacings-100) + 2ch);padding-inline:var(--pr-t-spacings-50);position:relative;align-self:stretch;margin-inline-start:calc(var(--pr-t-spacings-50) * -1)}.timePicker-fieldset-meridiem:after{content:\"\";position:absolute;inset-block:var(--components-timepicker-display-inset-block);inset-inline:var(--pr-t-spacings-50);border-radius:var(--pr-t-border-radius-50);display:grid;place-items:center;text-align:end}.timePicker-fieldset-meridiem:has(input:focus):after{background-color:var(--palettes-product-100)}.timePicker-fieldset-meridiem:has(.timePicker-fieldset-meridiem-ante-input:checked):after{content:\"AM\"/\"\"}.timePicker-fieldset-meridiem:has(.timePicker-fieldset-meridiem-post-input:checked):after{content:\"PM\"/\"\"}.timePicker-fieldset-meridiem-ante,.timePicker-fieldset-meridiem-post{border:0;clip-path:rect(1px 1px 1px 1px);margin:-1px;overflow:hidden;padding:0;position:absolute;block-size:1px;inline-size:1px;white-space:nowrap;contain:paint}}@layer mods{.timePicker.mod-S{--components-timepicker-font: var(--pr-t-font-body-S);--components-timepicker-input-padding-block: var(--pr-t-spacings-25);--components-timepicker-input-height: 1.75rem;--components-timepicker-separator-left: 1.875rem;--components-timepicker-start: var(--pr-t-spacings-25);--components-timepicker-end: var(--pr-t-spacings-75)}.timePicker.mod-S .timePicker-arrow-icon .lucca-icon{--icon-size: 1rem}.timePicker.mod-S .timePicker-fieldset-group{--components-timepicker-input-padding-inline: var(--components-timepicker-start) var(--components-timepicker-end);--components-timepicker-display-inset-inline: var(--components-timepicker-input-padding-inline)}.timePicker.mod-S .timePicker-fieldset-group~.timePicker-fieldset-group{--components-timepicker-input-padding-inline: var(--components-timepicker-end) var(--components-timepicker-start)}.timePicker.mod-S .timePicker-fieldset-meridiem{inline-size:calc(var(--pr-t-spacings-50) + 2ch)}.timePicker.mod-S .timePicker-fieldset-meridiem:after{inset-inline:var(--pr-t-spacings-25)}.timePicker.mod-stepper{--components-timepicker-padding: var(--pr-t-spacings-300) 0}.timePicker.mod-stepperHover:not(:hover,:focus-within) .timePicker-fieldset-group-stepper{opacity:0}.timePicker:has([aria-invalid=true]){--components-timepicker-background: var(--pr-t-color-input-background-critical);--components-timepicker-border: var(--pr-t-color-input-border-critical)}.timePicker:has([aria-invalid=true]):hover{--components-timepicker-border: var(--pr-t-color-input-border-critical-hover)}.timePicker:has([disabled]){--components-timepicker-background: var(--pr-t-color-input-background-disabled);--components-timepicker-border: var(--commons-disabled-placeholder);--components-timepicker-color: var(--pr-t-color-input-text-disabled)}}@layer base{lu-duration-picker{display:inline-flex}}\n"] }]
|
|
613
618
|
}], propDecorators: { intl: [{ type: i0.Input, args: [{ isSignal: true, alias: "intl", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], max: [{ type: i0.Input, args: [{ isSignal: true, alias: "max", required: false }] }], displayArrows: [{ type: i0.Input, args: [{ isSignal: true, alias: "displayArrows", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], hideZeroValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideZeroValue", required: false }] }], durationChange: [{ type: i0.Output, args: ["durationChange"] }] } });
|
|
614
619
|
|
|
615
620
|
const castToIsoTime = (str) => str;
|
|
@@ -673,29 +678,29 @@ const DEFAULT_TIME_DECIMAL_PIPE_FORMAT = '2.0-0';
|
|
|
673
678
|
|
|
674
679
|
const Translations$1 = {
|
|
675
680
|
pt: {
|
|
676
|
-
timePickerHours: '
|
|
681
|
+
timePickerHours: 'horas',
|
|
677
682
|
timePickerTimeSeparator: ':',
|
|
678
|
-
timePickerMinutes: '
|
|
683
|
+
timePickerMinutes: 'minutos',
|
|
679
684
|
},
|
|
680
685
|
es: {
|
|
681
|
-
timePickerHours: '
|
|
686
|
+
timePickerHours: 'horas',
|
|
682
687
|
timePickerTimeSeparator: ':',
|
|
683
|
-
timePickerMinutes: '
|
|
688
|
+
timePickerMinutes: 'minutos',
|
|
684
689
|
},
|
|
685
690
|
'nl-BE': {
|
|
686
|
-
timePickerHours: '
|
|
691
|
+
timePickerHours: 'uren',
|
|
687
692
|
timePickerTimeSeparator: ':',
|
|
688
|
-
timePickerMinutes: '
|
|
693
|
+
timePickerMinutes: 'minuten',
|
|
689
694
|
},
|
|
690
695
|
nl: {
|
|
691
|
-
timePickerHours: '
|
|
696
|
+
timePickerHours: 'uren',
|
|
692
697
|
timePickerTimeSeparator: ':',
|
|
693
|
-
timePickerMinutes: '
|
|
698
|
+
timePickerMinutes: 'minuten',
|
|
694
699
|
},
|
|
695
700
|
it: {
|
|
696
|
-
timePickerHours: '
|
|
701
|
+
timePickerHours: 'ore',
|
|
697
702
|
timePickerTimeSeparator: ':',
|
|
698
|
-
timePickerMinutes: '
|
|
703
|
+
timePickerMinutes: 'minuti',
|
|
699
704
|
},
|
|
700
705
|
de: {
|
|
701
706
|
timePickerHours: 'Stunden',
|
|
@@ -703,14 +708,19 @@ const Translations$1 = {
|
|
|
703
708
|
timePickerMinutes: 'Minuten',
|
|
704
709
|
},
|
|
705
710
|
fr: {
|
|
706
|
-
timePickerHours: '
|
|
711
|
+
timePickerHours: 'heures',
|
|
707
712
|
timePickerTimeSeparator: ':',
|
|
708
|
-
timePickerMinutes: '
|
|
713
|
+
timePickerMinutes: 'minutes',
|
|
709
714
|
},
|
|
710
715
|
en: {
|
|
711
|
-
timePickerHours: '
|
|
716
|
+
timePickerHours: 'hours',
|
|
712
717
|
timePickerTimeSeparator: ':',
|
|
713
|
-
timePickerMinutes: '
|
|
718
|
+
timePickerMinutes: 'minutes',
|
|
719
|
+
},
|
|
720
|
+
pl: {
|
|
721
|
+
timePickerHours: 'godziny',
|
|
722
|
+
timePickerTimeSeparator: ':',
|
|
723
|
+
timePickerMinutes: 'minuty',
|
|
714
724
|
},
|
|
715
725
|
};
|
|
716
726
|
|
|
@@ -950,7 +960,7 @@ class TimePickerComponent extends BasePickerComponent {
|
|
|
950
960
|
useExisting: forwardRef(() => TimePickerComponent),
|
|
951
961
|
multi: true,
|
|
952
962
|
},
|
|
953
|
-
], viewQueries: [{ propertyName: "anteMeridiemRef", first: true, predicate: ["anteMeridiemRef"], descendants: true, isSignal: true }, { propertyName: "postMeridiemRef", first: true, predicate: ["postMeridiemRef"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div [class]=\"pickerClasses()\" (copy)=\"copyHandler($event)\" (paste)=\"pasteHandler($event)\" (animationend)=\"keyPressed.set(false)\">\n\t<fieldset class=\"timePicker-fieldset\" [disabled]=\"disabled()\">\n\t\t<legend>\n\t\t\t<span class=\"pr-u-mask\">{{ label() }}</span>\n\t\t</legend>\n\t\t<lu-time-picker-part\n\t\t\t#hoursPart\n\t\t\tclass=\"timePicker-fieldset-group\"\n\t\t\t[disabled]=\"disabled()\"\n\t\t\t[label]=\"intl().timePickerHours\"\n\t\t\t[value]=\"hoursInputValue()\"\n\t\t\t[display]=\"hoursDisplay()\"\n\t\t\t[max]=\"maxHours()\"\n\t\t\t[decimalConf]=\"hoursDecimalConf\"\n\t\t\t[displayArrows]=\"displayArrows()\"\n\t\t\t(touched)=\"onTouched?.()\"\n\t\t\t(valueChange)=\"hoursInputHandler($event)\"\n\t\t\t(nextRequest)=\"focusPart('minutes')\"\n\t\t\t(keydown.arrowleft)=\"$event.preventDefault(); prevPicker.emit()\"\n\t\t\t(inputControlClick)=\"inputControlClickHandler('hours', $event)\"\n\t\t\t(nonDigitKeyPressed)=\"nonDigitKeyPressedHandler()\"\n\t\t/>\n\t\t<div aria-hidden=\"true\" class=\"timePicker-fieldset-groupSeparator\" [attr.data-content-before]=\"separator()\"></div>\n\t\t<lu-time-picker-part\n\t\t\t#minutesPart\n\t\t\tclass=\"timePicker-fieldset-group\"\n\t\t\t[label]=\"intl().timePickerMinutes\"\n\t\t\t[value]=\"minutesDisplay()\"\n\t\t\t[max]=\"59\"\n\t\t\t[displayArrows]=\"displayArrows()\"\n\t\t\t(touched)=\"onTouched?.()\"\n\t\t\t[disabled]=\"disabled() || !minutesIncrement()\"\n\t\t\tshowZero\n\t\t\t(valueChange)=\"minutesInputHandler($event)\"\n\t\t\t(prevRequest)=\"focusPart('hours')\"\n\t\t\t(nextRequest)=\"enableMeridiemDisplay() ? focusPart('meridiem') : nextPicker.emit()\"\n\t\t\t(inputControlClick)=\"inputControlClickHandler('minutes', $event)\"\n\t\t\t(nonDigitKeyPressed)=\"nonDigitKeyPressedHandler()\"\n\t\t/>\n\t\t@if (enableMeridiemDisplay()) {\n\t\t\t<div\n\t\t\t\tclass=\"timePicker-fieldset-meridiem\"\n\t\t\t\t(copy)=\"copyHandler($event)\"\n\t\t\t\t(paste)=\"pasteHandler($event)\"\n\t\t\t\t(keydown.A)=\"anteMeridiemRef.click()\"\n\t\t\t\t(keydown.P)=\"postMeridiemRef.click()\"\n\t\t\t\t(keydown.shift.A)=\"anteMeridiemRef.click()\"\n\t\t\t\t(keydown.shift.P)=\"postMeridiemRef.click()\"\n\t\t\t\t(click)=\"ampmDisplay() === 'AM' ? anteMeridiemRef.focus() : postMeridiemRef.focus()\"\n\t\t\t>\n\t\t\t\t<div class=\"timePicker-fieldset-meridiem-ante\">\n\t\t\t\t\t<label [attr.for]=\"'anteMeridiem-' + idSuffix\">AM</label>\n\t\t\t\t\t<input\n\t\t\t\t\t\t#anteMeridiemRef\n\t\t\t\t\t\ttype=\"radio\"\n\t\t\t\t\t\t[attr.name]=\"'meridiem-' + idSuffix\"\n\t\t\t\t\t\t[name]=\"'meridiem-' + idSuffix\"\n\t\t\t\t\t\t[attr.id]=\"'anteMeridiem-' + idSuffix\"\n\t\t\t\t\t\tclass=\"timePicker-fieldset-meridiem-ante-input\"\n\t\t\t\t\t\tvalue=\"AM\"\n\t\t\t\t\t\t[ngModel]=\"ampmDisplay()\"\n\t\t\t\t\t\t(ngModelChange)=\"switchMeridiem($event)\"\n\t\t\t\t\t\t(click)=\"$event.stopPropagation()\"\n\t\t\t\t\t\t(keydown.arrowleft)=\"$event.preventDefault(); focusPart('minutes')\"\n\t\t\t\t\t\t(keydown.arrowright)=\"$event.preventDefault(); nextPicker.emit()\"\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t\t<div class=\"timePicker-fieldset-meridiem-post\">\n\t\t\t\t\t<label [attr.for]=\"'postMeridiem-' + idSuffix\">PM</label>\n\t\t\t\t\t<input\n\t\t\t\t\t\t#postMeridiemRef\n\t\t\t\t\t\ttype=\"radio\"\n\t\t\t\t\t\t[attr.name]=\"'meridiem-' + idSuffix\"\n\t\t\t\t\t\t[name]=\"'meridiem-' + idSuffix\"\n\t\t\t\t\t\t[attr.id]=\"'postMeridiem-' + idSuffix\"\n\t\t\t\t\t\tclass=\"timePicker-fieldset-meridiem-post-input\"\n\t\t\t\t\t\tvalue=\"PM\"\n\t\t\t\t\t\t[ngModel]=\"ampmDisplay()\"\n\t\t\t\t\t\t(ngModelChange)=\"switchMeridiem($event)\"\n\t\t\t\t\t\t(click)=\"$event.stopPropagation()\"\n\t\t\t\t\t\t(keydown.arrowleft)=\"$event.preventDefault(); focusPart('minutes')\"\n\t\t\t\t\t\t(keydown.arrowright)=\"$event.preventDefault(); nextPicker.emit()\"\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t\t@if (displayArrows()) {\n\t\t\t\t\t<button\n\t\t\t\t\t\tclass=\"timePicker-fieldset-group-stepper\"\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\ttabindex=\"-1\"\n\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t(click)=\"switchMeridiem(ampmDisplay() === 'AM' ? 'PM' : 'AM')\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<span aria-hidden=\"true\" class=\"lucca-icon icon-northArrow\"></span>\n\t\t\t\t\t</button>\n\t\t\t\t\t<button\n\t\t\t\t\t\tclass=\"timePicker-fieldset-group-stepper\"\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\ttabindex=\"-1\"\n\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t(click)=\"switchMeridiem(ampmDisplay() === 'AM' ? 'PM' : 'AM')\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<span aria-hidden=\"true\" class=\"lucca-icon icon-southArrow\"></span>\n\t\t\t\t\t</button>\n\t\t\t\t}\n\t\t\t</div>\n\t\t}\n\t</fieldset>\n</div>\n", styles: ["@layer components{.timePicker{--components-timepicker-border: var(--pr-t-color-input-border);--components-timepicker-background: var(--pr-t-color-input-background);--components-timepicker-color: var(--pr-t-color-input-text);--components-timepicker-font: var(--pr-t-font-body-M);--components-timepicker-input-height: 2rem;--components-timepicker-input-minInlineSize: .5rem;--components-timepicker-input-padding-inline: var(--components-timepicker-start) var(--components-timepicker-end);--components-timepicker-input-padding-block: var(--pr-t-spacings-50);--components-timepicker-padding: 0;--components-timepicker-display-inset-inline: var(--components-timepicker-input-padding-inline);--components-timepicker-display-inset-block: var(--components-timepicker-input-padding-block);--components-timepicker-separator-left: 2.375rem;--components-timepicker-start: var(--pr-t-spacings-50);--components-timepicker-end: var(--pr-t-spacings-100);padding:var(--components-timepicker-padding);inline-size:fit-content}.timePicker-fieldset{display:flex;align-items:center;box-shadow:0 0 0 1px var(--components-timepicker-border);border-radius:var(--pr-t-border-radius-input);padding:0;border:0;margin:0;background-color:var(--components-timepicker-background);color:var(--components-timepicker-color);font:var(--components-timepicker-font);position:relative;cursor:text}.timePicker-fieldset:hover{--components-timepicker-border: var(--pr-t-color-input-border-hover)}.timePicker-fieldset:focus-within{outline:2px solid var(--palettes-700, var(--palettes-product-700));outline-offset:3px}.timePicker-fieldset .timePicker-fieldset{box-shadow:initial}.timePicker-fieldset .timePicker-fieldset:focus-within{outline:initial}.timePicker-arrow{align-self:stretch;display:flex;align-items:center;color:var(--pr-t-color-text-subtle)}.timePicker-arrow-icon .lucca-icon{--icon-size: 1.25rem}.timePicker-fieldset-groupSeparator{pointer-events:none;display:grid;place-items:center;text-align:center;inline-size:var(--pr-t-spacings-200);margin-block:0;margin-inline:calc(var(--pr-t-spacings-100) * -1);position:relative;inset-inline-start:calc(var(--pr-t-spacings-25) * -1)}.timePicker-fieldset-group{position:relative}.timePicker-fieldset-group~.timePicker-fieldset-group{margin-inline-start:calc(var(--pr-t-spacings-50) * -1);--components-timepicker-input-padding-inline: var(--components-timepicker-end) var(--components-timepicker-start);--components-timepicker-display-inset-inline: var(--components-timepicker-input-padding-inline)}.timePicker-fieldset-group-textfield{background-color:transparent}.timePicker-fieldset-group-textfield-input{display:flex;align-items:center;justify-content:center;border:0;block-size:var(--components-timepicker-input-height);inline-size:calc(var(--components-timepicker-input-minInlineSize) + var(--components-timepicker-input-digits, 2) * 1ch);outline:none;color:inherit;background-color:transparent;text-align:center;padding-block:var(--components-timepicker-input-padding-block);padding-inline:var(--components-timepicker-input-padding-inline);box-sizing:content-box;opacity:.0001}.timePicker-fieldset-group-textfield-input::placeholder{color:var(--component-textField-placeholder)}.timePicker-fieldset-group-textfield-input:focus-visible+.timePicker-fieldset-group-textfield-display{background-color:var(--palettes-product-100)}.timePicker-fieldset-group-textfield-display{position:absolute;inset-block:var(--components-timepicker-display-inset-block);inset-inline:var(--components-timepicker-display-inset-inline);border-radius:var(--pr-t-border-radius-50);pointer-events:none;display:grid;place-items:center}.timePicker-fieldset-group-stepper{position:absolute;inset-block-end:calc(var(--components-timepicker-input-height) + var(--pr-t-spacings-150) + 1px);border:0;padding:0;block-size:1rem;inline-size:1rem;inset-inline-start:50%;transform:translate(-50%);background-color:transparent;color:var(--palettes-neutral-600);display:inline-flex;justify-content:center;align-items:center;border-radius:var(--pr-t-border-radius-50);outline:none;opacity:1;transition-property:opacity;transition-duration:var(--commons-animations-durations-fast);cursor:pointer}.timePicker-fieldset-group-stepper:hover{background-color:var(--palettes-neutral-50);color:var(--palettes-neutral-800)}.timePicker-fieldset-group-stepper:disabled{cursor:default;color:var(--palettes-neutral-500);pointer-events:none}.timePicker-fieldset-group-stepper .lucca-icon{--icon-size: 1rem}.timePicker-fieldset-group-stepper+.timePicker-fieldset-group-stepper{inset-block-start:calc(var(--components-timepicker-input-height) + var(--pr-t-spacings-150) + 1px);inset-block-end:auto}.timePicker-fieldset-meridiem{box-sizing:content-box;inline-size:calc(var(--pr-t-spacings-100) + 2ch);padding-inline:var(--pr-t-spacings-50);position:relative;align-self:stretch;margin-inline-start:calc(var(--pr-t-spacings-50) * -1)}.timePicker-fieldset-meridiem:after{content:\"\";position:absolute;inset-block:var(--components-timepicker-display-inset-block);inset-inline:var(--pr-t-spacings-50);border-radius:var(--pr-t-border-radius-50);display:grid;place-items:center;text-align:end}.timePicker-fieldset-meridiem:has(input:focus):after{background-color:var(--palettes-product-100)}.timePicker-fieldset-meridiem:has(.timePicker-fieldset-meridiem-ante-input:checked):after{content:\"AM\"/\"\"}.timePicker-fieldset-meridiem:has(.timePicker-fieldset-meridiem-post-input:checked):after{content:\"PM\"/\"\"}.timePicker-fieldset-meridiem-ante,.timePicker-fieldset-meridiem-post{border:0;clip-path:rect(1px 1px 1px 1px);margin:-1px;overflow:hidden;padding:0;position:absolute;block-size:1px;inline-size:1px;white-space:nowrap;contain:paint}}@layer mods{.timePicker.mod-S{--components-timepicker-font: var(--pr-t-font-body-S);--components-timepicker-input-padding-block: var(--pr-t-spacings-25);--components-timepicker-input-height: 1.75rem;--components-timepicker-separator-left: 1.875rem;--components-timepicker-start: var(--pr-t-spacings-25);--components-timepicker-end: var(--pr-t-spacings-75)}.timePicker.mod-S .timePicker-arrow-icon .lucca-icon{--icon-size: 1rem}.timePicker.mod-S .timePicker-fieldset-group{--components-timepicker-input-padding-inline: var(--components-timepicker-start) var(--components-timepicker-end);--components-timepicker-display-inset-inline: var(--components-timepicker-input-padding-inline)}.timePicker.mod-S .timePicker-fieldset-group~.timePicker-fieldset-group{--components-timepicker-input-padding-inline: var(--components-timepicker-end) var(--components-timepicker-start)}.timePicker.mod-S .timePicker-fieldset-meridiem{inline-size:calc(var(--pr-t-spacings-50) + 2ch)}.timePicker.mod-S .timePicker-fieldset-meridiem:after{inset-inline:var(--pr-t-spacings-25)}.timePicker.mod-stepper{--components-timepicker-padding: var(--pr-t-spacings-300) 0}.timePicker.mod-stepperHover:not(:hover,:focus-within) .timePicker-fieldset-group-stepper{opacity:0}.timePicker:has([aria-invalid=true]){--components-timepicker-background: var(--pr-t-color-input-background-critical);--components-timepicker-border: var(--pr-t-color-input-border-critical)}.timePicker:has([aria-invalid=true]):hover{--components-timepicker-border: var(--pr-t-color-input-border-critical-hover)}.timePicker:has([disabled]){--components-timepicker-background: var(--pr-t-color-input-background-disabled);--components-timepicker-border: var(--commons-disabled-placeholder);--components-timepicker-color: var(--pr-t-color-input-text-disabled)}}@layer base{lu-time-picker{display:inline-flex}}\n"], dependencies: [{ kind: "component", type: TimePickerPartComponent, selector: "lu-time-picker-part", inputs: ["label", "decimalConf", "value", "display", "max", "autoWidth", "displayArrows", "isReadonly", "hideValue", "disabled", "focused", "maxDigits", "showZero", "digitNumber", "isValueSet"], outputs: ["valueChange", "digitNumberChange", "isValueSetChange", "prevRequest", "nextRequest", "nonDigitKeyPressed", "inputControlClick", "touched"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
963
|
+
], viewQueries: [{ propertyName: "anteMeridiemRef", first: true, predicate: ["anteMeridiemRef"], descendants: true, isSignal: true }, { propertyName: "postMeridiemRef", first: true, predicate: ["postMeridiemRef"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div [class]=\"pickerClasses()\" (copy)=\"copyHandler($event)\" (paste)=\"pasteHandler($event)\" (animationend)=\"keyPressed.set(false)\">\n\t<fieldset class=\"timePicker-fieldset\" [disabled]=\"disabled()\">\n\t\t<legend>\n\t\t\t<span class=\"pr-u-mask\">{{ label() }}</span>\n\t\t</legend>\n\t\t<lu-time-picker-part\n\t\t\t#hoursPart\n\t\t\tclass=\"timePicker-fieldset-group\"\n\t\t\t[disabled]=\"disabled()\"\n\t\t\t[label]=\"intl().timePickerHours\"\n\t\t\t[value]=\"hoursInputValue()\"\n\t\t\t[display]=\"hoursDisplay()\"\n\t\t\t[max]=\"maxHours()\"\n\t\t\t[decimalConf]=\"hoursDecimalConf\"\n\t\t\t[displayArrows]=\"displayArrows()\"\n\t\t\t(touched)=\"onTouched?.()\"\n\t\t\t(valueChange)=\"hoursInputHandler($event)\"\n\t\t\t(nextRequest)=\"focusPart('minutes')\"\n\t\t\t(keydown.arrowleft)=\"$event.preventDefault(); prevPicker.emit()\"\n\t\t\t(inputControlClick)=\"inputControlClickHandler('hours', $event)\"\n\t\t\t(nonDigitKeyPressed)=\"nonDigitKeyPressedHandler()\"\n\t\t/>\n\t\t<div\n\t\t\taria-hidden=\"true\"\n\t\t\tclass=\"timePicker-fieldset-groupSeparator\"\n\t\t\t[attr.data-content-before]=\"separator()\"\n\t\t\t(click)=\"focusPart('hours')\"\n\t\t></div>\n\t\t<lu-time-picker-part\n\t\t\t#minutesPart\n\t\t\tclass=\"timePicker-fieldset-group\"\n\t\t\t[label]=\"intl().timePickerMinutes\"\n\t\t\t[value]=\"minutesDisplay()\"\n\t\t\t[max]=\"59\"\n\t\t\t[displayArrows]=\"displayArrows()\"\n\t\t\t(touched)=\"onTouched?.()\"\n\t\t\t[disabled]=\"disabled() || !minutesIncrement()\"\n\t\t\tshowZero\n\t\t\t(valueChange)=\"minutesInputHandler($event)\"\n\t\t\t(prevRequest)=\"focusPart('hours')\"\n\t\t\t(nextRequest)=\"enableMeridiemDisplay() ? focusPart('meridiem') : nextPicker.emit()\"\n\t\t\t(inputControlClick)=\"inputControlClickHandler('minutes', $event)\"\n\t\t\t(nonDigitKeyPressed)=\"nonDigitKeyPressedHandler()\"\n\t\t/>\n\t\t@if (enableMeridiemDisplay()) {\n\t\t\t<div\n\t\t\t\tclass=\"timePicker-fieldset-meridiem\"\n\t\t\t\t(copy)=\"copyHandler($event)\"\n\t\t\t\t(paste)=\"pasteHandler($event)\"\n\t\t\t\t(keydown.A)=\"anteMeridiemRef.click()\"\n\t\t\t\t(keydown.P)=\"postMeridiemRef.click()\"\n\t\t\t\t(keydown.shift.A)=\"anteMeridiemRef.click()\"\n\t\t\t\t(keydown.shift.P)=\"postMeridiemRef.click()\"\n\t\t\t\t(click)=\"ampmDisplay() === 'AM' ? anteMeridiemRef.focus() : postMeridiemRef.focus()\"\n\t\t\t>\n\t\t\t\t<div class=\"timePicker-fieldset-meridiem-ante\">\n\t\t\t\t\t<label [attr.for]=\"'anteMeridiem-' + idSuffix\">AM</label>\n\t\t\t\t\t<input\n\t\t\t\t\t\t#anteMeridiemRef\n\t\t\t\t\t\ttype=\"radio\"\n\t\t\t\t\t\t[attr.name]=\"'meridiem-' + idSuffix\"\n\t\t\t\t\t\t[name]=\"'meridiem-' + idSuffix\"\n\t\t\t\t\t\t[attr.id]=\"'anteMeridiem-' + idSuffix\"\n\t\t\t\t\t\tclass=\"timePicker-fieldset-meridiem-ante-input\"\n\t\t\t\t\t\tvalue=\"AM\"\n\t\t\t\t\t\t[ngModel]=\"ampmDisplay()\"\n\t\t\t\t\t\t(ngModelChange)=\"switchMeridiem($event)\"\n\t\t\t\t\t\t(click)=\"$event.stopPropagation()\"\n\t\t\t\t\t\t(keydown.arrowleft)=\"$event.preventDefault(); focusPart('minutes')\"\n\t\t\t\t\t\t(keydown.arrowright)=\"$event.preventDefault(); nextPicker.emit()\"\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t\t<div class=\"timePicker-fieldset-meridiem-post\">\n\t\t\t\t\t<label [attr.for]=\"'postMeridiem-' + idSuffix\">PM</label>\n\t\t\t\t\t<input\n\t\t\t\t\t\t#postMeridiemRef\n\t\t\t\t\t\ttype=\"radio\"\n\t\t\t\t\t\t[attr.name]=\"'meridiem-' + idSuffix\"\n\t\t\t\t\t\t[name]=\"'meridiem-' + idSuffix\"\n\t\t\t\t\t\t[attr.id]=\"'postMeridiem-' + idSuffix\"\n\t\t\t\t\t\tclass=\"timePicker-fieldset-meridiem-post-input\"\n\t\t\t\t\t\tvalue=\"PM\"\n\t\t\t\t\t\t[ngModel]=\"ampmDisplay()\"\n\t\t\t\t\t\t(ngModelChange)=\"switchMeridiem($event)\"\n\t\t\t\t\t\t(click)=\"$event.stopPropagation()\"\n\t\t\t\t\t\t(keydown.arrowleft)=\"$event.preventDefault(); focusPart('minutes')\"\n\t\t\t\t\t\t(keydown.arrowright)=\"$event.preventDefault(); nextPicker.emit()\"\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t\t@if (displayArrows()) {\n\t\t\t\t\t<button\n\t\t\t\t\t\tclass=\"timePicker-fieldset-group-stepper\"\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\ttabindex=\"-1\"\n\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t(click)=\"switchMeridiem(ampmDisplay() === 'AM' ? 'PM' : 'AM')\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<span aria-hidden=\"true\" class=\"lucca-icon icon-northArrow\"></span>\n\t\t\t\t\t</button>\n\t\t\t\t\t<button\n\t\t\t\t\t\tclass=\"timePicker-fieldset-group-stepper\"\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\ttabindex=\"-1\"\n\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t(click)=\"switchMeridiem(ampmDisplay() === 'AM' ? 'PM' : 'AM')\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<span aria-hidden=\"true\" class=\"lucca-icon icon-southArrow\"></span>\n\t\t\t\t\t</button>\n\t\t\t\t}\n\t\t\t</div>\n\t\t}\n\t</fieldset>\n</div>\n", styles: ["@layer components{.timePicker{--components-timepicker-border: var(--pr-t-color-input-border);--components-timepicker-background: var(--pr-t-color-input-background);--components-timepicker-color: var(--pr-t-color-input-text);--components-timepicker-font: var(--pr-t-font-body-M);--components-timepicker-input-height: 2rem;--components-timepicker-input-minInlineSize: .5rem;--components-timepicker-input-padding-inline: var(--components-timepicker-start) var(--components-timepicker-end);--components-timepicker-input-padding-block: var(--pr-t-spacings-50);--components-timepicker-padding: 0;--components-timepicker-display-inset-inline: var(--components-timepicker-input-padding-inline);--components-timepicker-display-inset-block: var(--components-timepicker-input-padding-block);--components-timepicker-separator-left: 2.375rem;--components-timepicker-start: var(--pr-t-spacings-50);--components-timepicker-end: var(--pr-t-spacings-100);padding:var(--components-timepicker-padding);inline-size:fit-content}.timePicker-fieldset{display:flex;align-items:center;box-shadow:0 0 0 1px var(--components-timepicker-border);border-radius:var(--pr-t-border-radius-input);padding:0;border:0;margin:0;background-color:var(--components-timepicker-background);color:var(--components-timepicker-color);font:var(--components-timepicker-font);position:relative;cursor:text}.timePicker-fieldset:hover{--components-timepicker-border: var(--pr-t-color-input-border-hover)}.timePicker-fieldset:focus-within{outline:2px solid var(--palettes-700, var(--palettes-product-700));outline-offset:3px}.timePicker-fieldset .timePicker-fieldset{box-shadow:initial}.timePicker-fieldset .timePicker-fieldset:focus-within{outline:initial}.timePicker-arrow{align-self:stretch;display:flex;align-items:center;color:var(--pr-t-color-text-subtle)}.timePicker-arrow-icon .lucca-icon{--icon-size: 1.25rem}.timePicker-fieldset-groupSeparator{display:grid;place-items:center;text-align:center;inline-size:fit-content;block-size:calc(var(--components-timepicker-input-height) + var(--components-timepicker-input-padding-block) * 2);margin-inline:calc(var(--pr-t-spacings-25) * -1);position:relative;inset-inline-start:calc(var(--pr-t-spacings-25) * -1);z-index:1}.timePicker-fieldset-group{position:relative}.timePicker-fieldset-group~.timePicker-fieldset-group{margin-inline-start:calc(var(--pr-t-spacings-50) * -1);--components-timepicker-input-padding-inline: var(--components-timepicker-end) var(--components-timepicker-start);--components-timepicker-display-inset-inline: var(--components-timepicker-input-padding-inline)}.timePicker-fieldset-group-textfield{background-color:transparent}.timePicker-fieldset-group-textfield-input{display:flex;align-items:center;justify-content:center;border:0;block-size:var(--components-timepicker-input-height);inline-size:calc(var(--components-timepicker-input-minInlineSize) + var(--components-timepicker-input-digits, 2) * 1ch);outline:none;color:inherit;background-color:transparent;text-align:center;padding-block:var(--components-timepicker-input-padding-block);padding-inline:var(--components-timepicker-input-padding-inline);box-sizing:content-box;opacity:.0001}.timePicker-fieldset-group-textfield-input::placeholder{color:var(--component-textField-placeholder)}.timePicker-fieldset-group-textfield-input:focus-visible+.timePicker-fieldset-group-textfield-display{background-color:var(--palettes-product-100)}.timePicker-fieldset-group-textfield-display{position:absolute;inset-block:var(--components-timepicker-display-inset-block);inset-inline:var(--components-timepicker-display-inset-inline);border-radius:var(--pr-t-border-radius-50);pointer-events:none;display:grid;place-items:center}.timePicker-fieldset-group-stepper{position:absolute;inset-block-end:calc(var(--components-timepicker-input-height) + var(--pr-t-spacings-150) + 1px);border:0;padding:0;block-size:1rem;inline-size:1rem;inset-inline-start:50%;transform:translate(-50%);background-color:transparent;color:var(--palettes-neutral-600);display:inline-flex;justify-content:center;align-items:center;border-radius:var(--pr-t-border-radius-50);outline:none;opacity:1;transition-property:opacity;transition-duration:var(--commons-animations-durations-fast);cursor:pointer}.timePicker-fieldset-group-stepper:hover{background-color:var(--palettes-neutral-50);color:var(--palettes-neutral-800)}.timePicker-fieldset-group-stepper:disabled{cursor:default;color:var(--palettes-neutral-500);pointer-events:none}.timePicker-fieldset-group-stepper .lucca-icon{--icon-size: 1rem}.timePicker-fieldset-group-stepper+.timePicker-fieldset-group-stepper{inset-block-start:calc(var(--components-timepicker-input-height) + var(--pr-t-spacings-150) + 1px);inset-block-end:auto}.timePicker-fieldset-meridiem{box-sizing:content-box;inline-size:calc(var(--pr-t-spacings-100) + 2ch);padding-inline:var(--pr-t-spacings-50);position:relative;align-self:stretch;margin-inline-start:calc(var(--pr-t-spacings-50) * -1)}.timePicker-fieldset-meridiem:after{content:\"\";position:absolute;inset-block:var(--components-timepicker-display-inset-block);inset-inline:var(--pr-t-spacings-50);border-radius:var(--pr-t-border-radius-50);display:grid;place-items:center;text-align:end}.timePicker-fieldset-meridiem:has(input:focus):after{background-color:var(--palettes-product-100)}.timePicker-fieldset-meridiem:has(.timePicker-fieldset-meridiem-ante-input:checked):after{content:\"AM\"/\"\"}.timePicker-fieldset-meridiem:has(.timePicker-fieldset-meridiem-post-input:checked):after{content:\"PM\"/\"\"}.timePicker-fieldset-meridiem-ante,.timePicker-fieldset-meridiem-post{border:0;clip-path:rect(1px 1px 1px 1px);margin:-1px;overflow:hidden;padding:0;position:absolute;block-size:1px;inline-size:1px;white-space:nowrap;contain:paint}}@layer mods{.timePicker.mod-S{--components-timepicker-font: var(--pr-t-font-body-S);--components-timepicker-input-padding-block: var(--pr-t-spacings-25);--components-timepicker-input-height: 1.75rem;--components-timepicker-separator-left: 1.875rem;--components-timepicker-start: var(--pr-t-spacings-25);--components-timepicker-end: var(--pr-t-spacings-75)}.timePicker.mod-S .timePicker-arrow-icon .lucca-icon{--icon-size: 1rem}.timePicker.mod-S .timePicker-fieldset-group{--components-timepicker-input-padding-inline: var(--components-timepicker-start) var(--components-timepicker-end);--components-timepicker-display-inset-inline: var(--components-timepicker-input-padding-inline)}.timePicker.mod-S .timePicker-fieldset-group~.timePicker-fieldset-group{--components-timepicker-input-padding-inline: var(--components-timepicker-end) var(--components-timepicker-start)}.timePicker.mod-S .timePicker-fieldset-meridiem{inline-size:calc(var(--pr-t-spacings-50) + 2ch)}.timePicker.mod-S .timePicker-fieldset-meridiem:after{inset-inline:var(--pr-t-spacings-25)}.timePicker.mod-stepper{--components-timepicker-padding: var(--pr-t-spacings-300) 0}.timePicker.mod-stepperHover:not(:hover,:focus-within) .timePicker-fieldset-group-stepper{opacity:0}.timePicker:has([aria-invalid=true]){--components-timepicker-background: var(--pr-t-color-input-background-critical);--components-timepicker-border: var(--pr-t-color-input-border-critical)}.timePicker:has([aria-invalid=true]):hover{--components-timepicker-border: var(--pr-t-color-input-border-critical-hover)}.timePicker:has([disabled]){--components-timepicker-background: var(--pr-t-color-input-background-disabled);--components-timepicker-border: var(--commons-disabled-placeholder);--components-timepicker-color: var(--pr-t-color-input-text-disabled)}}@layer base{lu-time-picker{display:inline-flex}}\n"], dependencies: [{ kind: "component", type: TimePickerPartComponent, selector: "lu-time-picker-part", inputs: ["label", "decimalConf", "value", "display", "max", "autoWidth", "displayArrows", "isReadonly", "hideValue", "disabled", "focused", "maxDigits", "showZero", "digitNumber", "isValueSet"], outputs: ["valueChange", "digitNumberChange", "isValueSetChange", "prevRequest", "nextRequest", "nonDigitKeyPressed", "inputControlClick", "touched"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
954
964
|
}
|
|
955
965
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TimePickerComponent, decorators: [{
|
|
956
966
|
type: Component,
|
|
@@ -960,12 +970,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
|
|
|
960
970
|
useExisting: forwardRef(() => TimePickerComponent),
|
|
961
971
|
multi: true,
|
|
962
972
|
},
|
|
963
|
-
], template: "<div [class]=\"pickerClasses()\" (copy)=\"copyHandler($event)\" (paste)=\"pasteHandler($event)\" (animationend)=\"keyPressed.set(false)\">\n\t<fieldset class=\"timePicker-fieldset\" [disabled]=\"disabled()\">\n\t\t<legend>\n\t\t\t<span class=\"pr-u-mask\">{{ label() }}</span>\n\t\t</legend>\n\t\t<lu-time-picker-part\n\t\t\t#hoursPart\n\t\t\tclass=\"timePicker-fieldset-group\"\n\t\t\t[disabled]=\"disabled()\"\n\t\t\t[label]=\"intl().timePickerHours\"\n\t\t\t[value]=\"hoursInputValue()\"\n\t\t\t[display]=\"hoursDisplay()\"\n\t\t\t[max]=\"maxHours()\"\n\t\t\t[decimalConf]=\"hoursDecimalConf\"\n\t\t\t[displayArrows]=\"displayArrows()\"\n\t\t\t(touched)=\"onTouched?.()\"\n\t\t\t(valueChange)=\"hoursInputHandler($event)\"\n\t\t\t(nextRequest)=\"focusPart('minutes')\"\n\t\t\t(keydown.arrowleft)=\"$event.preventDefault(); prevPicker.emit()\"\n\t\t\t(inputControlClick)=\"inputControlClickHandler('hours', $event)\"\n\t\t\t(nonDigitKeyPressed)=\"nonDigitKeyPressedHandler()\"\n\t\t/>\n\t\t<div aria-hidden=\"true\" class=\"timePicker-fieldset-groupSeparator\" [attr.data-content-before]=\"separator()\"></div>\n\t\t<lu-time-picker-part\n\t\t\t#minutesPart\n\t\t\tclass=\"timePicker-fieldset-group\"\n\t\t\t[label]=\"intl().timePickerMinutes\"\n\t\t\t[value]=\"minutesDisplay()\"\n\t\t\t[max]=\"59\"\n\t\t\t[displayArrows]=\"displayArrows()\"\n\t\t\t(touched)=\"onTouched?.()\"\n\t\t\t[disabled]=\"disabled() || !minutesIncrement()\"\n\t\t\tshowZero\n\t\t\t(valueChange)=\"minutesInputHandler($event)\"\n\t\t\t(prevRequest)=\"focusPart('hours')\"\n\t\t\t(nextRequest)=\"enableMeridiemDisplay() ? focusPart('meridiem') : nextPicker.emit()\"\n\t\t\t(inputControlClick)=\"inputControlClickHandler('minutes', $event)\"\n\t\t\t(nonDigitKeyPressed)=\"nonDigitKeyPressedHandler()\"\n\t\t/>\n\t\t@if (enableMeridiemDisplay()) {\n\t\t\t<div\n\t\t\t\tclass=\"timePicker-fieldset-meridiem\"\n\t\t\t\t(copy)=\"copyHandler($event)\"\n\t\t\t\t(paste)=\"pasteHandler($event)\"\n\t\t\t\t(keydown.A)=\"anteMeridiemRef.click()\"\n\t\t\t\t(keydown.P)=\"postMeridiemRef.click()\"\n\t\t\t\t(keydown.shift.A)=\"anteMeridiemRef.click()\"\n\t\t\t\t(keydown.shift.P)=\"postMeridiemRef.click()\"\n\t\t\t\t(click)=\"ampmDisplay() === 'AM' ? anteMeridiemRef.focus() : postMeridiemRef.focus()\"\n\t\t\t>\n\t\t\t\t<div class=\"timePicker-fieldset-meridiem-ante\">\n\t\t\t\t\t<label [attr.for]=\"'anteMeridiem-' + idSuffix\">AM</label>\n\t\t\t\t\t<input\n\t\t\t\t\t\t#anteMeridiemRef\n\t\t\t\t\t\ttype=\"radio\"\n\t\t\t\t\t\t[attr.name]=\"'meridiem-' + idSuffix\"\n\t\t\t\t\t\t[name]=\"'meridiem-' + idSuffix\"\n\t\t\t\t\t\t[attr.id]=\"'anteMeridiem-' + idSuffix\"\n\t\t\t\t\t\tclass=\"timePicker-fieldset-meridiem-ante-input\"\n\t\t\t\t\t\tvalue=\"AM\"\n\t\t\t\t\t\t[ngModel]=\"ampmDisplay()\"\n\t\t\t\t\t\t(ngModelChange)=\"switchMeridiem($event)\"\n\t\t\t\t\t\t(click)=\"$event.stopPropagation()\"\n\t\t\t\t\t\t(keydown.arrowleft)=\"$event.preventDefault(); focusPart('minutes')\"\n\t\t\t\t\t\t(keydown.arrowright)=\"$event.preventDefault(); nextPicker.emit()\"\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t\t<div class=\"timePicker-fieldset-meridiem-post\">\n\t\t\t\t\t<label [attr.for]=\"'postMeridiem-' + idSuffix\">PM</label>\n\t\t\t\t\t<input\n\t\t\t\t\t\t#postMeridiemRef\n\t\t\t\t\t\ttype=\"radio\"\n\t\t\t\t\t\t[attr.name]=\"'meridiem-' + idSuffix\"\n\t\t\t\t\t\t[name]=\"'meridiem-' + idSuffix\"\n\t\t\t\t\t\t[attr.id]=\"'postMeridiem-' + idSuffix\"\n\t\t\t\t\t\tclass=\"timePicker-fieldset-meridiem-post-input\"\n\t\t\t\t\t\tvalue=\"PM\"\n\t\t\t\t\t\t[ngModel]=\"ampmDisplay()\"\n\t\t\t\t\t\t(ngModelChange)=\"switchMeridiem($event)\"\n\t\t\t\t\t\t(click)=\"$event.stopPropagation()\"\n\t\t\t\t\t\t(keydown.arrowleft)=\"$event.preventDefault(); focusPart('minutes')\"\n\t\t\t\t\t\t(keydown.arrowright)=\"$event.preventDefault(); nextPicker.emit()\"\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t\t@if (displayArrows()) {\n\t\t\t\t\t<button\n\t\t\t\t\t\tclass=\"timePicker-fieldset-group-stepper\"\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\ttabindex=\"-1\"\n\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t(click)=\"switchMeridiem(ampmDisplay() === 'AM' ? 'PM' : 'AM')\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<span aria-hidden=\"true\" class=\"lucca-icon icon-northArrow\"></span>\n\t\t\t\t\t</button>\n\t\t\t\t\t<button\n\t\t\t\t\t\tclass=\"timePicker-fieldset-group-stepper\"\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\ttabindex=\"-1\"\n\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t(click)=\"switchMeridiem(ampmDisplay() === 'AM' ? 'PM' : 'AM')\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<span aria-hidden=\"true\" class=\"lucca-icon icon-southArrow\"></span>\n\t\t\t\t\t</button>\n\t\t\t\t}\n\t\t\t</div>\n\t\t}\n\t</fieldset>\n</div>\n", styles: ["@layer components{.timePicker{--components-timepicker-border: var(--pr-t-color-input-border);--components-timepicker-background: var(--pr-t-color-input-background);--components-timepicker-color: var(--pr-t-color-input-text);--components-timepicker-font: var(--pr-t-font-body-M);--components-timepicker-input-height: 2rem;--components-timepicker-input-minInlineSize: .5rem;--components-timepicker-input-padding-inline: var(--components-timepicker-start) var(--components-timepicker-end);--components-timepicker-input-padding-block: var(--pr-t-spacings-50);--components-timepicker-padding: 0;--components-timepicker-display-inset-inline: var(--components-timepicker-input-padding-inline);--components-timepicker-display-inset-block: var(--components-timepicker-input-padding-block);--components-timepicker-separator-left: 2.375rem;--components-timepicker-start: var(--pr-t-spacings-50);--components-timepicker-end: var(--pr-t-spacings-100);padding:var(--components-timepicker-padding);inline-size:fit-content}.timePicker-fieldset{display:flex;align-items:center;box-shadow:0 0 0 1px var(--components-timepicker-border);border-radius:var(--pr-t-border-radius-input);padding:0;border:0;margin:0;background-color:var(--components-timepicker-background);color:var(--components-timepicker-color);font:var(--components-timepicker-font);position:relative;cursor:text}.timePicker-fieldset:hover{--components-timepicker-border: var(--pr-t-color-input-border-hover)}.timePicker-fieldset:focus-within{outline:2px solid var(--palettes-700, var(--palettes-product-700));outline-offset:3px}.timePicker-fieldset .timePicker-fieldset{box-shadow:initial}.timePicker-fieldset .timePicker-fieldset:focus-within{outline:initial}.timePicker-arrow{align-self:stretch;display:flex;align-items:center;color:var(--pr-t-color-text-subtle)}.timePicker-arrow-icon .lucca-icon{--icon-size: 1.25rem}.timePicker-fieldset-groupSeparator{pointer-events:none;display:grid;place-items:center;text-align:center;inline-size:var(--pr-t-spacings-200);margin-block:0;margin-inline:calc(var(--pr-t-spacings-100) * -1);position:relative;inset-inline-start:calc(var(--pr-t-spacings-25) * -1)}.timePicker-fieldset-group{position:relative}.timePicker-fieldset-group~.timePicker-fieldset-group{margin-inline-start:calc(var(--pr-t-spacings-50) * -1);--components-timepicker-input-padding-inline: var(--components-timepicker-end) var(--components-timepicker-start);--components-timepicker-display-inset-inline: var(--components-timepicker-input-padding-inline)}.timePicker-fieldset-group-textfield{background-color:transparent}.timePicker-fieldset-group-textfield-input{display:flex;align-items:center;justify-content:center;border:0;block-size:var(--components-timepicker-input-height);inline-size:calc(var(--components-timepicker-input-minInlineSize) + var(--components-timepicker-input-digits, 2) * 1ch);outline:none;color:inherit;background-color:transparent;text-align:center;padding-block:var(--components-timepicker-input-padding-block);padding-inline:var(--components-timepicker-input-padding-inline);box-sizing:content-box;opacity:.0001}.timePicker-fieldset-group-textfield-input::placeholder{color:var(--component-textField-placeholder)}.timePicker-fieldset-group-textfield-input:focus-visible+.timePicker-fieldset-group-textfield-display{background-color:var(--palettes-product-100)}.timePicker-fieldset-group-textfield-display{position:absolute;inset-block:var(--components-timepicker-display-inset-block);inset-inline:var(--components-timepicker-display-inset-inline);border-radius:var(--pr-t-border-radius-50);pointer-events:none;display:grid;place-items:center}.timePicker-fieldset-group-stepper{position:absolute;inset-block-end:calc(var(--components-timepicker-input-height) + var(--pr-t-spacings-150) + 1px);border:0;padding:0;block-size:1rem;inline-size:1rem;inset-inline-start:50%;transform:translate(-50%);background-color:transparent;color:var(--palettes-neutral-600);display:inline-flex;justify-content:center;align-items:center;border-radius:var(--pr-t-border-radius-50);outline:none;opacity:1;transition-property:opacity;transition-duration:var(--commons-animations-durations-fast);cursor:pointer}.timePicker-fieldset-group-stepper:hover{background-color:var(--palettes-neutral-50);color:var(--palettes-neutral-800)}.timePicker-fieldset-group-stepper:disabled{cursor:default;color:var(--palettes-neutral-500);pointer-events:none}.timePicker-fieldset-group-stepper .lucca-icon{--icon-size: 1rem}.timePicker-fieldset-group-stepper+.timePicker-fieldset-group-stepper{inset-block-start:calc(var(--components-timepicker-input-height) + var(--pr-t-spacings-150) + 1px);inset-block-end:auto}.timePicker-fieldset-meridiem{box-sizing:content-box;inline-size:calc(var(--pr-t-spacings-100) + 2ch);padding-inline:var(--pr-t-spacings-50);position:relative;align-self:stretch;margin-inline-start:calc(var(--pr-t-spacings-50) * -1)}.timePicker-fieldset-meridiem:after{content:\"\";position:absolute;inset-block:var(--components-timepicker-display-inset-block);inset-inline:var(--pr-t-spacings-50);border-radius:var(--pr-t-border-radius-50);display:grid;place-items:center;text-align:end}.timePicker-fieldset-meridiem:has(input:focus):after{background-color:var(--palettes-product-100)}.timePicker-fieldset-meridiem:has(.timePicker-fieldset-meridiem-ante-input:checked):after{content:\"AM\"/\"\"}.timePicker-fieldset-meridiem:has(.timePicker-fieldset-meridiem-post-input:checked):after{content:\"PM\"/\"\"}.timePicker-fieldset-meridiem-ante,.timePicker-fieldset-meridiem-post{border:0;clip-path:rect(1px 1px 1px 1px);margin:-1px;overflow:hidden;padding:0;position:absolute;block-size:1px;inline-size:1px;white-space:nowrap;contain:paint}}@layer mods{.timePicker.mod-S{--components-timepicker-font: var(--pr-t-font-body-S);--components-timepicker-input-padding-block: var(--pr-t-spacings-25);--components-timepicker-input-height: 1.75rem;--components-timepicker-separator-left: 1.875rem;--components-timepicker-start: var(--pr-t-spacings-25);--components-timepicker-end: var(--pr-t-spacings-75)}.timePicker.mod-S .timePicker-arrow-icon .lucca-icon{--icon-size: 1rem}.timePicker.mod-S .timePicker-fieldset-group{--components-timepicker-input-padding-inline: var(--components-timepicker-start) var(--components-timepicker-end);--components-timepicker-display-inset-inline: var(--components-timepicker-input-padding-inline)}.timePicker.mod-S .timePicker-fieldset-group~.timePicker-fieldset-group{--components-timepicker-input-padding-inline: var(--components-timepicker-end) var(--components-timepicker-start)}.timePicker.mod-S .timePicker-fieldset-meridiem{inline-size:calc(var(--pr-t-spacings-50) + 2ch)}.timePicker.mod-S .timePicker-fieldset-meridiem:after{inset-inline:var(--pr-t-spacings-25)}.timePicker.mod-stepper{--components-timepicker-padding: var(--pr-t-spacings-300) 0}.timePicker.mod-stepperHover:not(:hover,:focus-within) .timePicker-fieldset-group-stepper{opacity:0}.timePicker:has([aria-invalid=true]){--components-timepicker-background: var(--pr-t-color-input-background-critical);--components-timepicker-border: var(--pr-t-color-input-border-critical)}.timePicker:has([aria-invalid=true]):hover{--components-timepicker-border: var(--pr-t-color-input-border-critical-hover)}.timePicker:has([disabled]){--components-timepicker-background: var(--pr-t-color-input-background-disabled);--components-timepicker-border: var(--commons-disabled-placeholder);--components-timepicker-color: var(--pr-t-color-input-text-disabled)}}@layer base{lu-time-picker{display:inline-flex}}\n"] }]
|
|
973
|
+
], template: "<div [class]=\"pickerClasses()\" (copy)=\"copyHandler($event)\" (paste)=\"pasteHandler($event)\" (animationend)=\"keyPressed.set(false)\">\n\t<fieldset class=\"timePicker-fieldset\" [disabled]=\"disabled()\">\n\t\t<legend>\n\t\t\t<span class=\"pr-u-mask\">{{ label() }}</span>\n\t\t</legend>\n\t\t<lu-time-picker-part\n\t\t\t#hoursPart\n\t\t\tclass=\"timePicker-fieldset-group\"\n\t\t\t[disabled]=\"disabled()\"\n\t\t\t[label]=\"intl().timePickerHours\"\n\t\t\t[value]=\"hoursInputValue()\"\n\t\t\t[display]=\"hoursDisplay()\"\n\t\t\t[max]=\"maxHours()\"\n\t\t\t[decimalConf]=\"hoursDecimalConf\"\n\t\t\t[displayArrows]=\"displayArrows()\"\n\t\t\t(touched)=\"onTouched?.()\"\n\t\t\t(valueChange)=\"hoursInputHandler($event)\"\n\t\t\t(nextRequest)=\"focusPart('minutes')\"\n\t\t\t(keydown.arrowleft)=\"$event.preventDefault(); prevPicker.emit()\"\n\t\t\t(inputControlClick)=\"inputControlClickHandler('hours', $event)\"\n\t\t\t(nonDigitKeyPressed)=\"nonDigitKeyPressedHandler()\"\n\t\t/>\n\t\t<div\n\t\t\taria-hidden=\"true\"\n\t\t\tclass=\"timePicker-fieldset-groupSeparator\"\n\t\t\t[attr.data-content-before]=\"separator()\"\n\t\t\t(click)=\"focusPart('hours')\"\n\t\t></div>\n\t\t<lu-time-picker-part\n\t\t\t#minutesPart\n\t\t\tclass=\"timePicker-fieldset-group\"\n\t\t\t[label]=\"intl().timePickerMinutes\"\n\t\t\t[value]=\"minutesDisplay()\"\n\t\t\t[max]=\"59\"\n\t\t\t[displayArrows]=\"displayArrows()\"\n\t\t\t(touched)=\"onTouched?.()\"\n\t\t\t[disabled]=\"disabled() || !minutesIncrement()\"\n\t\t\tshowZero\n\t\t\t(valueChange)=\"minutesInputHandler($event)\"\n\t\t\t(prevRequest)=\"focusPart('hours')\"\n\t\t\t(nextRequest)=\"enableMeridiemDisplay() ? focusPart('meridiem') : nextPicker.emit()\"\n\t\t\t(inputControlClick)=\"inputControlClickHandler('minutes', $event)\"\n\t\t\t(nonDigitKeyPressed)=\"nonDigitKeyPressedHandler()\"\n\t\t/>\n\t\t@if (enableMeridiemDisplay()) {\n\t\t\t<div\n\t\t\t\tclass=\"timePicker-fieldset-meridiem\"\n\t\t\t\t(copy)=\"copyHandler($event)\"\n\t\t\t\t(paste)=\"pasteHandler($event)\"\n\t\t\t\t(keydown.A)=\"anteMeridiemRef.click()\"\n\t\t\t\t(keydown.P)=\"postMeridiemRef.click()\"\n\t\t\t\t(keydown.shift.A)=\"anteMeridiemRef.click()\"\n\t\t\t\t(keydown.shift.P)=\"postMeridiemRef.click()\"\n\t\t\t\t(click)=\"ampmDisplay() === 'AM' ? anteMeridiemRef.focus() : postMeridiemRef.focus()\"\n\t\t\t>\n\t\t\t\t<div class=\"timePicker-fieldset-meridiem-ante\">\n\t\t\t\t\t<label [attr.for]=\"'anteMeridiem-' + idSuffix\">AM</label>\n\t\t\t\t\t<input\n\t\t\t\t\t\t#anteMeridiemRef\n\t\t\t\t\t\ttype=\"radio\"\n\t\t\t\t\t\t[attr.name]=\"'meridiem-' + idSuffix\"\n\t\t\t\t\t\t[name]=\"'meridiem-' + idSuffix\"\n\t\t\t\t\t\t[attr.id]=\"'anteMeridiem-' + idSuffix\"\n\t\t\t\t\t\tclass=\"timePicker-fieldset-meridiem-ante-input\"\n\t\t\t\t\t\tvalue=\"AM\"\n\t\t\t\t\t\t[ngModel]=\"ampmDisplay()\"\n\t\t\t\t\t\t(ngModelChange)=\"switchMeridiem($event)\"\n\t\t\t\t\t\t(click)=\"$event.stopPropagation()\"\n\t\t\t\t\t\t(keydown.arrowleft)=\"$event.preventDefault(); focusPart('minutes')\"\n\t\t\t\t\t\t(keydown.arrowright)=\"$event.preventDefault(); nextPicker.emit()\"\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t\t<div class=\"timePicker-fieldset-meridiem-post\">\n\t\t\t\t\t<label [attr.for]=\"'postMeridiem-' + idSuffix\">PM</label>\n\t\t\t\t\t<input\n\t\t\t\t\t\t#postMeridiemRef\n\t\t\t\t\t\ttype=\"radio\"\n\t\t\t\t\t\t[attr.name]=\"'meridiem-' + idSuffix\"\n\t\t\t\t\t\t[name]=\"'meridiem-' + idSuffix\"\n\t\t\t\t\t\t[attr.id]=\"'postMeridiem-' + idSuffix\"\n\t\t\t\t\t\tclass=\"timePicker-fieldset-meridiem-post-input\"\n\t\t\t\t\t\tvalue=\"PM\"\n\t\t\t\t\t\t[ngModel]=\"ampmDisplay()\"\n\t\t\t\t\t\t(ngModelChange)=\"switchMeridiem($event)\"\n\t\t\t\t\t\t(click)=\"$event.stopPropagation()\"\n\t\t\t\t\t\t(keydown.arrowleft)=\"$event.preventDefault(); focusPart('minutes')\"\n\t\t\t\t\t\t(keydown.arrowright)=\"$event.preventDefault(); nextPicker.emit()\"\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t\t@if (displayArrows()) {\n\t\t\t\t\t<button\n\t\t\t\t\t\tclass=\"timePicker-fieldset-group-stepper\"\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\ttabindex=\"-1\"\n\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t(click)=\"switchMeridiem(ampmDisplay() === 'AM' ? 'PM' : 'AM')\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<span aria-hidden=\"true\" class=\"lucca-icon icon-northArrow\"></span>\n\t\t\t\t\t</button>\n\t\t\t\t\t<button\n\t\t\t\t\t\tclass=\"timePicker-fieldset-group-stepper\"\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\ttabindex=\"-1\"\n\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t(click)=\"switchMeridiem(ampmDisplay() === 'AM' ? 'PM' : 'AM')\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<span aria-hidden=\"true\" class=\"lucca-icon icon-southArrow\"></span>\n\t\t\t\t\t</button>\n\t\t\t\t}\n\t\t\t</div>\n\t\t}\n\t</fieldset>\n</div>\n", styles: ["@layer components{.timePicker{--components-timepicker-border: var(--pr-t-color-input-border);--components-timepicker-background: var(--pr-t-color-input-background);--components-timepicker-color: var(--pr-t-color-input-text);--components-timepicker-font: var(--pr-t-font-body-M);--components-timepicker-input-height: 2rem;--components-timepicker-input-minInlineSize: .5rem;--components-timepicker-input-padding-inline: var(--components-timepicker-start) var(--components-timepicker-end);--components-timepicker-input-padding-block: var(--pr-t-spacings-50);--components-timepicker-padding: 0;--components-timepicker-display-inset-inline: var(--components-timepicker-input-padding-inline);--components-timepicker-display-inset-block: var(--components-timepicker-input-padding-block);--components-timepicker-separator-left: 2.375rem;--components-timepicker-start: var(--pr-t-spacings-50);--components-timepicker-end: var(--pr-t-spacings-100);padding:var(--components-timepicker-padding);inline-size:fit-content}.timePicker-fieldset{display:flex;align-items:center;box-shadow:0 0 0 1px var(--components-timepicker-border);border-radius:var(--pr-t-border-radius-input);padding:0;border:0;margin:0;background-color:var(--components-timepicker-background);color:var(--components-timepicker-color);font:var(--components-timepicker-font);position:relative;cursor:text}.timePicker-fieldset:hover{--components-timepicker-border: var(--pr-t-color-input-border-hover)}.timePicker-fieldset:focus-within{outline:2px solid var(--palettes-700, var(--palettes-product-700));outline-offset:3px}.timePicker-fieldset .timePicker-fieldset{box-shadow:initial}.timePicker-fieldset .timePicker-fieldset:focus-within{outline:initial}.timePicker-arrow{align-self:stretch;display:flex;align-items:center;color:var(--pr-t-color-text-subtle)}.timePicker-arrow-icon .lucca-icon{--icon-size: 1.25rem}.timePicker-fieldset-groupSeparator{display:grid;place-items:center;text-align:center;inline-size:fit-content;block-size:calc(var(--components-timepicker-input-height) + var(--components-timepicker-input-padding-block) * 2);margin-inline:calc(var(--pr-t-spacings-25) * -1);position:relative;inset-inline-start:calc(var(--pr-t-spacings-25) * -1);z-index:1}.timePicker-fieldset-group{position:relative}.timePicker-fieldset-group~.timePicker-fieldset-group{margin-inline-start:calc(var(--pr-t-spacings-50) * -1);--components-timepicker-input-padding-inline: var(--components-timepicker-end) var(--components-timepicker-start);--components-timepicker-display-inset-inline: var(--components-timepicker-input-padding-inline)}.timePicker-fieldset-group-textfield{background-color:transparent}.timePicker-fieldset-group-textfield-input{display:flex;align-items:center;justify-content:center;border:0;block-size:var(--components-timepicker-input-height);inline-size:calc(var(--components-timepicker-input-minInlineSize) + var(--components-timepicker-input-digits, 2) * 1ch);outline:none;color:inherit;background-color:transparent;text-align:center;padding-block:var(--components-timepicker-input-padding-block);padding-inline:var(--components-timepicker-input-padding-inline);box-sizing:content-box;opacity:.0001}.timePicker-fieldset-group-textfield-input::placeholder{color:var(--component-textField-placeholder)}.timePicker-fieldset-group-textfield-input:focus-visible+.timePicker-fieldset-group-textfield-display{background-color:var(--palettes-product-100)}.timePicker-fieldset-group-textfield-display{position:absolute;inset-block:var(--components-timepicker-display-inset-block);inset-inline:var(--components-timepicker-display-inset-inline);border-radius:var(--pr-t-border-radius-50);pointer-events:none;display:grid;place-items:center}.timePicker-fieldset-group-stepper{position:absolute;inset-block-end:calc(var(--components-timepicker-input-height) + var(--pr-t-spacings-150) + 1px);border:0;padding:0;block-size:1rem;inline-size:1rem;inset-inline-start:50%;transform:translate(-50%);background-color:transparent;color:var(--palettes-neutral-600);display:inline-flex;justify-content:center;align-items:center;border-radius:var(--pr-t-border-radius-50);outline:none;opacity:1;transition-property:opacity;transition-duration:var(--commons-animations-durations-fast);cursor:pointer}.timePicker-fieldset-group-stepper:hover{background-color:var(--palettes-neutral-50);color:var(--palettes-neutral-800)}.timePicker-fieldset-group-stepper:disabled{cursor:default;color:var(--palettes-neutral-500);pointer-events:none}.timePicker-fieldset-group-stepper .lucca-icon{--icon-size: 1rem}.timePicker-fieldset-group-stepper+.timePicker-fieldset-group-stepper{inset-block-start:calc(var(--components-timepicker-input-height) + var(--pr-t-spacings-150) + 1px);inset-block-end:auto}.timePicker-fieldset-meridiem{box-sizing:content-box;inline-size:calc(var(--pr-t-spacings-100) + 2ch);padding-inline:var(--pr-t-spacings-50);position:relative;align-self:stretch;margin-inline-start:calc(var(--pr-t-spacings-50) * -1)}.timePicker-fieldset-meridiem:after{content:\"\";position:absolute;inset-block:var(--components-timepicker-display-inset-block);inset-inline:var(--pr-t-spacings-50);border-radius:var(--pr-t-border-radius-50);display:grid;place-items:center;text-align:end}.timePicker-fieldset-meridiem:has(input:focus):after{background-color:var(--palettes-product-100)}.timePicker-fieldset-meridiem:has(.timePicker-fieldset-meridiem-ante-input:checked):after{content:\"AM\"/\"\"}.timePicker-fieldset-meridiem:has(.timePicker-fieldset-meridiem-post-input:checked):after{content:\"PM\"/\"\"}.timePicker-fieldset-meridiem-ante,.timePicker-fieldset-meridiem-post{border:0;clip-path:rect(1px 1px 1px 1px);margin:-1px;overflow:hidden;padding:0;position:absolute;block-size:1px;inline-size:1px;white-space:nowrap;contain:paint}}@layer mods{.timePicker.mod-S{--components-timepicker-font: var(--pr-t-font-body-S);--components-timepicker-input-padding-block: var(--pr-t-spacings-25);--components-timepicker-input-height: 1.75rem;--components-timepicker-separator-left: 1.875rem;--components-timepicker-start: var(--pr-t-spacings-25);--components-timepicker-end: var(--pr-t-spacings-75)}.timePicker.mod-S .timePicker-arrow-icon .lucca-icon{--icon-size: 1rem}.timePicker.mod-S .timePicker-fieldset-group{--components-timepicker-input-padding-inline: var(--components-timepicker-start) var(--components-timepicker-end);--components-timepicker-display-inset-inline: var(--components-timepicker-input-padding-inline)}.timePicker.mod-S .timePicker-fieldset-group~.timePicker-fieldset-group{--components-timepicker-input-padding-inline: var(--components-timepicker-end) var(--components-timepicker-start)}.timePicker.mod-S .timePicker-fieldset-meridiem{inline-size:calc(var(--pr-t-spacings-50) + 2ch)}.timePicker.mod-S .timePicker-fieldset-meridiem:after{inset-inline:var(--pr-t-spacings-25)}.timePicker.mod-stepper{--components-timepicker-padding: var(--pr-t-spacings-300) 0}.timePicker.mod-stepperHover:not(:hover,:focus-within) .timePicker-fieldset-group-stepper{opacity:0}.timePicker:has([aria-invalid=true]){--components-timepicker-background: var(--pr-t-color-input-background-critical);--components-timepicker-border: var(--pr-t-color-input-border-critical)}.timePicker:has([aria-invalid=true]):hover{--components-timepicker-border: var(--pr-t-color-input-border-critical-hover)}.timePicker:has([disabled]){--components-timepicker-background: var(--pr-t-color-input-background-disabled);--components-timepicker-border: var(--commons-disabled-placeholder);--components-timepicker-color: var(--pr-t-color-input-text-disabled)}}@layer base{lu-time-picker{display:inline-flex}}\n"] }]
|
|
964
974
|
}], ctorParameters: () => [], propDecorators: { intl: [{ type: i0.Input, args: [{ isSignal: true, alias: "intl", required: false }] }], anteMeridiemRef: [{ type: i0.ViewChild, args: ['anteMeridiemRef', { isSignal: true }] }], postMeridiemRef: [{ type: i0.ViewChild, args: ['postMeridiemRef', { isSignal: true }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], max: [{ type: i0.Input, args: [{ isSignal: true, alias: "max", required: false }] }], displayArrows: [{ type: i0.Input, args: [{ isSignal: true, alias: "displayArrows", required: false }] }], forceMeridiemDisplay: [{ type: i0.Input, args: [{ isSignal: true, alias: "forceMeridiemDisplay", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], timeChange: [{ type: i0.Output, args: ["timeChange"] }], prevPicker: [{ type: i0.Output, args: ["prevPicker"] }], nextPicker: [{ type: i0.Output, args: ["nextPicker"] }], nonDigitKeyPressed: [{ type: i0.Output, args: ["nonDigitKeyPressed"] }], touched: [{ type: i0.Output, args: ["touched"] }] } });
|
|
965
975
|
|
|
966
976
|
const Translations = {
|
|
967
977
|
'nl-BE': {
|
|
968
|
-
timeRangePickerStart: '
|
|
978
|
+
timeRangePickerStart: 'begin',
|
|
969
979
|
timeRangePickerEnd: 'einde',
|
|
970
980
|
timeRangePickerFrom: 'Van',
|
|
971
981
|
timeRangePickerAt: 'tot',
|
|
@@ -977,8 +987,8 @@ const Translations = {
|
|
|
977
987
|
timeRangePickerAt: 'à',
|
|
978
988
|
},
|
|
979
989
|
de: {
|
|
980
|
-
timeRangePickerStart: '
|
|
981
|
-
timeRangePickerEnd: '
|
|
990
|
+
timeRangePickerStart: 'Anfang',
|
|
991
|
+
timeRangePickerEnd: 'Ende',
|
|
982
992
|
timeRangePickerFrom: 'Von',
|
|
983
993
|
timeRangePickerAt: 'an',
|
|
984
994
|
},
|
|
@@ -986,22 +996,22 @@ const Translations = {
|
|
|
986
996
|
timeRangePickerStart: 'start',
|
|
987
997
|
timeRangePickerEnd: 'end',
|
|
988
998
|
timeRangePickerFrom: 'From',
|
|
989
|
-
timeRangePickerAt: '
|
|
999
|
+
timeRangePickerAt: 'at',
|
|
990
1000
|
},
|
|
991
1001
|
es: {
|
|
992
|
-
timeRangePickerStart: '
|
|
1002
|
+
timeRangePickerStart: 'inicio',
|
|
993
1003
|
timeRangePickerEnd: 'fin',
|
|
994
1004
|
timeRangePickerFrom: 'De',
|
|
995
|
-
timeRangePickerAt: '
|
|
1005
|
+
timeRangePickerAt: 'a',
|
|
996
1006
|
},
|
|
997
1007
|
it: {
|
|
998
1008
|
timeRangePickerStart: 'inizio',
|
|
999
1009
|
timeRangePickerEnd: 'fine',
|
|
1000
|
-
timeRangePickerFrom: '
|
|
1001
|
-
timeRangePickerAt: '
|
|
1010
|
+
timeRangePickerFrom: 'Da',
|
|
1011
|
+
timeRangePickerAt: 'alle ore',
|
|
1002
1012
|
},
|
|
1003
1013
|
nl: {
|
|
1004
|
-
timeRangePickerStart: '
|
|
1014
|
+
timeRangePickerStart: 'begin',
|
|
1005
1015
|
timeRangePickerEnd: 'einde',
|
|
1006
1016
|
timeRangePickerFrom: 'Van',
|
|
1007
1017
|
timeRangePickerAt: 'tot',
|
|
@@ -1012,6 +1022,12 @@ const Translations = {
|
|
|
1012
1022
|
timeRangePickerFrom: 'De',
|
|
1013
1023
|
timeRangePickerAt: 'à',
|
|
1014
1024
|
},
|
|
1025
|
+
pl: {
|
|
1026
|
+
timeRangePickerStart: 'początek',
|
|
1027
|
+
timeRangePickerEnd: 'koniec',
|
|
1028
|
+
timeRangePickerFrom: 'Od',
|
|
1029
|
+
timeRangePickerAt: 'do',
|
|
1030
|
+
},
|
|
1015
1031
|
};
|
|
1016
1032
|
|
|
1017
1033
|
const LU_TIME_RANGE_PICKER_TRANSLATIONS = new InjectionToken('LuTimeRangePickerTranslations', {
|
|
@@ -1125,7 +1141,7 @@ class TimeRangePickerComponent {
|
|
|
1125
1141
|
provide: LU_TIME_RANGE_PICKER_INSTANCE,
|
|
1126
1142
|
useExisting: forwardRef(() => TimeRangePickerComponent),
|
|
1127
1143
|
},
|
|
1128
|
-
], ngImport: i0, template: "@let startLabel = `${formFieldLabel() && isLocaleFr() ? formFieldLabel() + \" \" : \"\"}(${intl().timeRangePickerStart})`;\n@let endLabel = `${formFieldLabel() && isLocaleFr() ? formFieldLabel() + \" \" : \"\"}(${intl().timeRangePickerEnd})`;\n\n<div\n\tclass=\"timePicker\"\n\t[class.mod-stepper]=\"displayArrows()\"\n\t[class.pr-u-animatedShake]=\"keyPressed()\"\n\t(animationend)=\"keyPressed.set(false)\"\n>\n\t<div class=\"timePicker-fieldset\">\n\t\t<lu-time-picker\n\t\t\t#timePickerStart\n\t\t\t[label]=\"startLabel\"\n\t\t\t[value]=\"startValue()\"\n\t\t\t(valueChange)=\"onStartChange($event)\"\n\t\t\t[disabled]=\"isDisabled()\"\n\t\t\t[max]=\"max()\"\n\t\t\t[step]=\"step()\"\n\t\t\t[size]=\"size()\"\n\t\t\t[displayArrows]=\"displayArrows()\"\n\t\t\t[forceMeridiemDisplay]=\"forceMeridiemDisplay()\"\n\t\t\t(nextPicker)=\"timePickerEnd.focusPart('hours')\"\n\t\t\t(nonDigitKeyPressed)=\"keyPressed.set(true)\"\n\t\t/>\n\t\t<label role=\"presentation\" [attr.for]=\"timePickerEnd?.firstTimePickerInputId\" class=\"timePicker-arrow\">\n\t\t\t<lu-icon class=\"timePicker-arrow-icon\" icon=\"arrowRight\" />\n\t\t</label>\n\t\t<lu-time-picker\n\t\t\t#timePickerEnd\n\t\t\t[label]=\"endLabel\"\n\t\t\t[value]=\"endValue()\"\n\t\t\t(valueChange)=\"onEndChange($event)\"\n\t\t\t[disabled]=\"isDisabled()\"\n\t\t\t[max]=\"max()\"\n\t\t\t[step]=\"step()\"\n\t\t\t[size]=\"size()\"\n\t\t\t[displayArrows]=\"displayArrows()\"\n\t\t\t[forceMeridiemDisplay]=\"forceMeridiemDisplay()\"\n\t\t\t(prevPicker)=\"timePickerStart.focusPart(partToFocus())\"\n\t\t\t(nonDigitKeyPressed)=\"keyPressed.set(true)\"\n\t\t/>\n\t</div>\n</div>\n\n<ng-container *luPresentationDisplayDefault>\n\t{{ intl().timeRangePickerFrom }}\n\t<span class=\"pr-u-mask\">{{ startLabel }}</span>\n\t@if (startValue() && startValue() !== DEFAULT_TIME_VALUE) {\n\t\t{{ startValue() }}\n\t} @else {\n\t\t<span aria-hidden=\"true\" data-content-before=\"\u2013\"></span>\n\t}\n\t{{ intl().timeRangePickerAt }}\n\t<span class=\"pr-u-mask\">{{ endLabel }}</span>\n\t@if (endValue() && endValue() !== DEFAULT_TIME_VALUE) {\n\t\t{{ endValue() }}\n\t} @else {\n\t\t<span aria-hidden=\"true\" data-content-before=\"\u2013\"></span>\n\t}\n</ng-container>\n", styles: ["@layer components{.timePicker{--components-timepicker-border: var(--pr-t-color-input-border);--components-timepicker-background: var(--pr-t-color-input-background);--components-timepicker-color: var(--pr-t-color-input-text);--components-timepicker-font: var(--pr-t-font-body-M);--components-timepicker-input-height: 2rem;--components-timepicker-input-minInlineSize: .5rem;--components-timepicker-input-padding-inline: var(--components-timepicker-start) var(--components-timepicker-end);--components-timepicker-input-padding-block: var(--pr-t-spacings-50);--components-timepicker-padding: 0;--components-timepicker-display-inset-inline: var(--components-timepicker-input-padding-inline);--components-timepicker-display-inset-block: var(--components-timepicker-input-padding-block);--components-timepicker-separator-left: 2.375rem;--components-timepicker-start: var(--pr-t-spacings-50);--components-timepicker-end: var(--pr-t-spacings-100);padding:var(--components-timepicker-padding);inline-size:fit-content}.timePicker-fieldset{display:flex;align-items:center;box-shadow:0 0 0 1px var(--components-timepicker-border);border-radius:var(--pr-t-border-radius-input);padding:0;border:0;margin:0;background-color:var(--components-timepicker-background);color:var(--components-timepicker-color);font:var(--components-timepicker-font);position:relative;cursor:text}.timePicker-fieldset:hover{--components-timepicker-border: var(--pr-t-color-input-border-hover)}.timePicker-fieldset:focus-within{outline:2px solid var(--palettes-700, var(--palettes-product-700));outline-offset:3px}.timePicker-fieldset .timePicker-fieldset{box-shadow:initial}.timePicker-fieldset .timePicker-fieldset:focus-within{outline:initial}.timePicker-arrow{align-self:stretch;display:flex;align-items:center;color:var(--pr-t-color-text-subtle)}.timePicker-arrow-icon .lucca-icon{--icon-size: 1.25rem}.timePicker-fieldset-groupSeparator{pointer-events:none;display:grid;place-items:center;text-align:center;inline-size:var(--pr-t-spacings-200);margin-block:0;margin-inline:calc(var(--pr-t-spacings-100) * -1);position:relative;inset-inline-start:calc(var(--pr-t-spacings-25) * -1)}.timePicker-fieldset-group{position:relative}.timePicker-fieldset-group~.timePicker-fieldset-group{margin-inline-start:calc(var(--pr-t-spacings-50) * -1);--components-timepicker-input-padding-inline: var(--components-timepicker-end) var(--components-timepicker-start);--components-timepicker-display-inset-inline: var(--components-timepicker-input-padding-inline)}.timePicker-fieldset-group-textfield{background-color:transparent}.timePicker-fieldset-group-textfield-input{display:flex;align-items:center;justify-content:center;border:0;block-size:var(--components-timepicker-input-height);inline-size:calc(var(--components-timepicker-input-minInlineSize) + var(--components-timepicker-input-digits, 2) * 1ch);outline:none;color:inherit;background-color:transparent;text-align:center;padding-block:var(--components-timepicker-input-padding-block);padding-inline:var(--components-timepicker-input-padding-inline);box-sizing:content-box;opacity:.0001}.timePicker-fieldset-group-textfield-input::placeholder{color:var(--component-textField-placeholder)}.timePicker-fieldset-group-textfield-input:focus-visible+.timePicker-fieldset-group-textfield-display{background-color:var(--palettes-product-100)}.timePicker-fieldset-group-textfield-display{position:absolute;inset-block:var(--components-timepicker-display-inset-block);inset-inline:var(--components-timepicker-display-inset-inline);border-radius:var(--pr-t-border-radius-50);pointer-events:none;display:grid;place-items:center}.timePicker-fieldset-group-stepper{position:absolute;inset-block-end:calc(var(--components-timepicker-input-height) + var(--pr-t-spacings-150) + 1px);border:0;padding:0;block-size:1rem;inline-size:1rem;inset-inline-start:50%;transform:translate(-50%);background-color:transparent;color:var(--palettes-neutral-600);display:inline-flex;justify-content:center;align-items:center;border-radius:var(--pr-t-border-radius-50);outline:none;opacity:1;transition-property:opacity;transition-duration:var(--commons-animations-durations-fast);cursor:pointer}.timePicker-fieldset-group-stepper:hover{background-color:var(--palettes-neutral-50);color:var(--palettes-neutral-800)}.timePicker-fieldset-group-stepper:disabled{cursor:default;color:var(--palettes-neutral-500);pointer-events:none}.timePicker-fieldset-group-stepper .lucca-icon{--icon-size: 1rem}.timePicker-fieldset-group-stepper+.timePicker-fieldset-group-stepper{inset-block-start:calc(var(--components-timepicker-input-height) + var(--pr-t-spacings-150) + 1px);inset-block-end:auto}.timePicker-fieldset-meridiem{box-sizing:content-box;inline-size:calc(var(--pr-t-spacings-100) + 2ch);padding-inline:var(--pr-t-spacings-50);position:relative;align-self:stretch;margin-inline-start:calc(var(--pr-t-spacings-50) * -1)}.timePicker-fieldset-meridiem:after{content:\"\";position:absolute;inset-block:var(--components-timepicker-display-inset-block);inset-inline:var(--pr-t-spacings-50);border-radius:var(--pr-t-border-radius-50);display:grid;place-items:center;text-align:end}.timePicker-fieldset-meridiem:has(input:focus):after{background-color:var(--palettes-product-100)}.timePicker-fieldset-meridiem:has(.timePicker-fieldset-meridiem-ante-input:checked):after{content:\"AM\"/\"\"}.timePicker-fieldset-meridiem:has(.timePicker-fieldset-meridiem-post-input:checked):after{content:\"PM\"/\"\"}.timePicker-fieldset-meridiem-ante,.timePicker-fieldset-meridiem-post{border:0;clip-path:rect(1px 1px 1px 1px);margin:-1px;overflow:hidden;padding:0;position:absolute;block-size:1px;inline-size:1px;white-space:nowrap;contain:paint}}@layer mods{.timePicker.mod-S{--components-timepicker-font: var(--pr-t-font-body-S);--components-timepicker-input-padding-block: var(--pr-t-spacings-25);--components-timepicker-input-height: 1.75rem;--components-timepicker-separator-left: 1.875rem;--components-timepicker-start: var(--pr-t-spacings-25);--components-timepicker-end: var(--pr-t-spacings-75)}.timePicker.mod-S .timePicker-arrow-icon .lucca-icon{--icon-size: 1rem}.timePicker.mod-S .timePicker-fieldset-group{--components-timepicker-input-padding-inline: var(--components-timepicker-start) var(--components-timepicker-end);--components-timepicker-display-inset-inline: var(--components-timepicker-input-padding-inline)}.timePicker.mod-S .timePicker-fieldset-group~.timePicker-fieldset-group{--components-timepicker-input-padding-inline: var(--components-timepicker-end) var(--components-timepicker-start)}.timePicker.mod-S .timePicker-fieldset-meridiem{inline-size:calc(var(--pr-t-spacings-50) + 2ch)}.timePicker.mod-S .timePicker-fieldset-meridiem:after{inset-inline:var(--pr-t-spacings-25)}.timePicker.mod-stepper{--components-timepicker-padding: var(--pr-t-spacings-300) 0}.timePicker.mod-stepperHover:not(:hover,:focus-within) .timePicker-fieldset-group-stepper{opacity:0}.timePicker:has([aria-invalid=true]){--components-timepicker-background: var(--pr-t-color-input-background-critical);--components-timepicker-border: var(--pr-t-color-input-border-critical)}.timePicker:has([aria-invalid=true]):hover{--components-timepicker-border: var(--pr-t-color-input-border-critical-hover)}.timePicker:has([disabled]){--components-timepicker-background: var(--pr-t-color-input-background-disabled);--components-timepicker-border: var(--commons-disabled-placeholder);--components-timepicker-color: var(--pr-t-color-input-text-disabled)}}@layer base{lu-time-range-picker{display:contents}}\n"], dependencies: [{ kind: "component", type: IconComponent, selector: "lu-icon, pr-icon", inputs: ["icon", "alt", "size", "color", "AI"] }, { kind: "component", type: TimePickerComponent, selector: "lu-time-picker", inputs: ["intl", "value", "max", "displayArrows", "forceMeridiemDisplay", "label"], outputs: ["valueChange", "timeChange", "prevPicker", "nextPicker", "nonDigitKeyPressed", "touched"] }, { kind: "directive", type: _PresentationDisplayDefaultDirective, selector: "[luPresentationDisplayDefault]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
1144
|
+
], ngImport: i0, template: "@let startLabel = `${formFieldLabel() && isLocaleFr() ? formFieldLabel() + \" \" : \"\"}(${intl().timeRangePickerStart})`;\n@let endLabel = `${formFieldLabel() && isLocaleFr() ? formFieldLabel() + \" \" : \"\"}(${intl().timeRangePickerEnd})`;\n\n<div\n\tclass=\"timePicker\"\n\t[class.mod-stepper]=\"displayArrows()\"\n\t[class.pr-u-animatedShake]=\"keyPressed()\"\n\t(animationend)=\"keyPressed.set(false)\"\n>\n\t<div class=\"timePicker-fieldset\">\n\t\t<lu-time-picker\n\t\t\t#timePickerStart\n\t\t\t[label]=\"startLabel\"\n\t\t\t[value]=\"startValue()\"\n\t\t\t(valueChange)=\"onStartChange($event)\"\n\t\t\t[disabled]=\"isDisabled()\"\n\t\t\t[max]=\"max()\"\n\t\t\t[step]=\"step()\"\n\t\t\t[size]=\"size()\"\n\t\t\t[displayArrows]=\"displayArrows()\"\n\t\t\t[forceMeridiemDisplay]=\"forceMeridiemDisplay()\"\n\t\t\t(nextPicker)=\"timePickerEnd.focusPart('hours')\"\n\t\t\t(nonDigitKeyPressed)=\"keyPressed.set(true)\"\n\t\t/>\n\t\t<label role=\"presentation\" [attr.for]=\"timePickerEnd?.firstTimePickerInputId\" class=\"timePicker-arrow\">\n\t\t\t<lu-icon class=\"timePicker-arrow-icon\" icon=\"arrowRight\" />\n\t\t</label>\n\t\t<lu-time-picker\n\t\t\t#timePickerEnd\n\t\t\t[label]=\"endLabel\"\n\t\t\t[value]=\"endValue()\"\n\t\t\t(valueChange)=\"onEndChange($event)\"\n\t\t\t[disabled]=\"isDisabled()\"\n\t\t\t[max]=\"max()\"\n\t\t\t[step]=\"step()\"\n\t\t\t[size]=\"size()\"\n\t\t\t[displayArrows]=\"displayArrows()\"\n\t\t\t[forceMeridiemDisplay]=\"forceMeridiemDisplay()\"\n\t\t\t(prevPicker)=\"timePickerStart.focusPart(partToFocus())\"\n\t\t\t(nonDigitKeyPressed)=\"keyPressed.set(true)\"\n\t\t/>\n\t</div>\n</div>\n\n<ng-container *luPresentationDisplayDefault>\n\t{{ intl().timeRangePickerFrom }}\n\t<span class=\"pr-u-mask\">{{ startLabel }}</span>\n\t@if (startValue() && startValue() !== DEFAULT_TIME_VALUE) {\n\t\t{{ startValue() }}\n\t} @else {\n\t\t<span aria-hidden=\"true\" data-content-before=\"\u2013\"></span>\n\t}\n\t{{ intl().timeRangePickerAt }}\n\t<span class=\"pr-u-mask\">{{ endLabel }}</span>\n\t@if (endValue() && endValue() !== DEFAULT_TIME_VALUE) {\n\t\t{{ endValue() }}\n\t} @else {\n\t\t<span aria-hidden=\"true\" data-content-before=\"\u2013\"></span>\n\t}\n</ng-container>\n", styles: ["@layer components{.timePicker{--components-timepicker-border: var(--pr-t-color-input-border);--components-timepicker-background: var(--pr-t-color-input-background);--components-timepicker-color: var(--pr-t-color-input-text);--components-timepicker-font: var(--pr-t-font-body-M);--components-timepicker-input-height: 2rem;--components-timepicker-input-minInlineSize: .5rem;--components-timepicker-input-padding-inline: var(--components-timepicker-start) var(--components-timepicker-end);--components-timepicker-input-padding-block: var(--pr-t-spacings-50);--components-timepicker-padding: 0;--components-timepicker-display-inset-inline: var(--components-timepicker-input-padding-inline);--components-timepicker-display-inset-block: var(--components-timepicker-input-padding-block);--components-timepicker-separator-left: 2.375rem;--components-timepicker-start: var(--pr-t-spacings-50);--components-timepicker-end: var(--pr-t-spacings-100);padding:var(--components-timepicker-padding);inline-size:fit-content}.timePicker-fieldset{display:flex;align-items:center;box-shadow:0 0 0 1px var(--components-timepicker-border);border-radius:var(--pr-t-border-radius-input);padding:0;border:0;margin:0;background-color:var(--components-timepicker-background);color:var(--components-timepicker-color);font:var(--components-timepicker-font);position:relative;cursor:text}.timePicker-fieldset:hover{--components-timepicker-border: var(--pr-t-color-input-border-hover)}.timePicker-fieldset:focus-within{outline:2px solid var(--palettes-700, var(--palettes-product-700));outline-offset:3px}.timePicker-fieldset .timePicker-fieldset{box-shadow:initial}.timePicker-fieldset .timePicker-fieldset:focus-within{outline:initial}.timePicker-arrow{align-self:stretch;display:flex;align-items:center;color:var(--pr-t-color-text-subtle)}.timePicker-arrow-icon .lucca-icon{--icon-size: 1.25rem}.timePicker-fieldset-groupSeparator{display:grid;place-items:center;text-align:center;inline-size:fit-content;block-size:calc(var(--components-timepicker-input-height) + var(--components-timepicker-input-padding-block) * 2);margin-inline:calc(var(--pr-t-spacings-25) * -1);position:relative;inset-inline-start:calc(var(--pr-t-spacings-25) * -1);z-index:1}.timePicker-fieldset-group{position:relative}.timePicker-fieldset-group~.timePicker-fieldset-group{margin-inline-start:calc(var(--pr-t-spacings-50) * -1);--components-timepicker-input-padding-inline: var(--components-timepicker-end) var(--components-timepicker-start);--components-timepicker-display-inset-inline: var(--components-timepicker-input-padding-inline)}.timePicker-fieldset-group-textfield{background-color:transparent}.timePicker-fieldset-group-textfield-input{display:flex;align-items:center;justify-content:center;border:0;block-size:var(--components-timepicker-input-height);inline-size:calc(var(--components-timepicker-input-minInlineSize) + var(--components-timepicker-input-digits, 2) * 1ch);outline:none;color:inherit;background-color:transparent;text-align:center;padding-block:var(--components-timepicker-input-padding-block);padding-inline:var(--components-timepicker-input-padding-inline);box-sizing:content-box;opacity:.0001}.timePicker-fieldset-group-textfield-input::placeholder{color:var(--component-textField-placeholder)}.timePicker-fieldset-group-textfield-input:focus-visible+.timePicker-fieldset-group-textfield-display{background-color:var(--palettes-product-100)}.timePicker-fieldset-group-textfield-display{position:absolute;inset-block:var(--components-timepicker-display-inset-block);inset-inline:var(--components-timepicker-display-inset-inline);border-radius:var(--pr-t-border-radius-50);pointer-events:none;display:grid;place-items:center}.timePicker-fieldset-group-stepper{position:absolute;inset-block-end:calc(var(--components-timepicker-input-height) + var(--pr-t-spacings-150) + 1px);border:0;padding:0;block-size:1rem;inline-size:1rem;inset-inline-start:50%;transform:translate(-50%);background-color:transparent;color:var(--palettes-neutral-600);display:inline-flex;justify-content:center;align-items:center;border-radius:var(--pr-t-border-radius-50);outline:none;opacity:1;transition-property:opacity;transition-duration:var(--commons-animations-durations-fast);cursor:pointer}.timePicker-fieldset-group-stepper:hover{background-color:var(--palettes-neutral-50);color:var(--palettes-neutral-800)}.timePicker-fieldset-group-stepper:disabled{cursor:default;color:var(--palettes-neutral-500);pointer-events:none}.timePicker-fieldset-group-stepper .lucca-icon{--icon-size: 1rem}.timePicker-fieldset-group-stepper+.timePicker-fieldset-group-stepper{inset-block-start:calc(var(--components-timepicker-input-height) + var(--pr-t-spacings-150) + 1px);inset-block-end:auto}.timePicker-fieldset-meridiem{box-sizing:content-box;inline-size:calc(var(--pr-t-spacings-100) + 2ch);padding-inline:var(--pr-t-spacings-50);position:relative;align-self:stretch;margin-inline-start:calc(var(--pr-t-spacings-50) * -1)}.timePicker-fieldset-meridiem:after{content:\"\";position:absolute;inset-block:var(--components-timepicker-display-inset-block);inset-inline:var(--pr-t-spacings-50);border-radius:var(--pr-t-border-radius-50);display:grid;place-items:center;text-align:end}.timePicker-fieldset-meridiem:has(input:focus):after{background-color:var(--palettes-product-100)}.timePicker-fieldset-meridiem:has(.timePicker-fieldset-meridiem-ante-input:checked):after{content:\"AM\"/\"\"}.timePicker-fieldset-meridiem:has(.timePicker-fieldset-meridiem-post-input:checked):after{content:\"PM\"/\"\"}.timePicker-fieldset-meridiem-ante,.timePicker-fieldset-meridiem-post{border:0;clip-path:rect(1px 1px 1px 1px);margin:-1px;overflow:hidden;padding:0;position:absolute;block-size:1px;inline-size:1px;white-space:nowrap;contain:paint}}@layer mods{.timePicker.mod-S{--components-timepicker-font: var(--pr-t-font-body-S);--components-timepicker-input-padding-block: var(--pr-t-spacings-25);--components-timepicker-input-height: 1.75rem;--components-timepicker-separator-left: 1.875rem;--components-timepicker-start: var(--pr-t-spacings-25);--components-timepicker-end: var(--pr-t-spacings-75)}.timePicker.mod-S .timePicker-arrow-icon .lucca-icon{--icon-size: 1rem}.timePicker.mod-S .timePicker-fieldset-group{--components-timepicker-input-padding-inline: var(--components-timepicker-start) var(--components-timepicker-end);--components-timepicker-display-inset-inline: var(--components-timepicker-input-padding-inline)}.timePicker.mod-S .timePicker-fieldset-group~.timePicker-fieldset-group{--components-timepicker-input-padding-inline: var(--components-timepicker-end) var(--components-timepicker-start)}.timePicker.mod-S .timePicker-fieldset-meridiem{inline-size:calc(var(--pr-t-spacings-50) + 2ch)}.timePicker.mod-S .timePicker-fieldset-meridiem:after{inset-inline:var(--pr-t-spacings-25)}.timePicker.mod-stepper{--components-timepicker-padding: var(--pr-t-spacings-300) 0}.timePicker.mod-stepperHover:not(:hover,:focus-within) .timePicker-fieldset-group-stepper{opacity:0}.timePicker:has([aria-invalid=true]){--components-timepicker-background: var(--pr-t-color-input-background-critical);--components-timepicker-border: var(--pr-t-color-input-border-critical)}.timePicker:has([aria-invalid=true]):hover{--components-timepicker-border: var(--pr-t-color-input-border-critical-hover)}.timePicker:has([disabled]){--components-timepicker-background: var(--pr-t-color-input-background-disabled);--components-timepicker-border: var(--commons-disabled-placeholder);--components-timepicker-color: var(--pr-t-color-input-text-disabled)}}@layer base{lu-time-range-picker{display:contents}}\n"], dependencies: [{ kind: "component", type: IconComponent, selector: "lu-icon, pr-icon", inputs: ["icon", "alt", "size", "color", "AI"] }, { kind: "component", type: TimePickerComponent, selector: "lu-time-picker", inputs: ["intl", "value", "max", "displayArrows", "forceMeridiemDisplay", "label"], outputs: ["valueChange", "timeChange", "prevPicker", "nextPicker", "nonDigitKeyPressed", "touched"] }, { kind: "directive", type: _PresentationDisplayDefaultDirective, selector: "[luPresentationDisplayDefault]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
1129
1145
|
}
|
|
1130
1146
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: TimeRangePickerComponent, decorators: [{
|
|
1131
1147
|
type: Component,
|
|
@@ -1147,7 +1163,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
|
|
|
1147
1163
|
provide: LU_TIME_RANGE_PICKER_INSTANCE,
|
|
1148
1164
|
useExisting: forwardRef(() => TimeRangePickerComponent),
|
|
1149
1165
|
},
|
|
1150
|
-
], template: "@let startLabel = `${formFieldLabel() && isLocaleFr() ? formFieldLabel() + \" \" : \"\"}(${intl().timeRangePickerStart})`;\n@let endLabel = `${formFieldLabel() && isLocaleFr() ? formFieldLabel() + \" \" : \"\"}(${intl().timeRangePickerEnd})`;\n\n<div\n\tclass=\"timePicker\"\n\t[class.mod-stepper]=\"displayArrows()\"\n\t[class.pr-u-animatedShake]=\"keyPressed()\"\n\t(animationend)=\"keyPressed.set(false)\"\n>\n\t<div class=\"timePicker-fieldset\">\n\t\t<lu-time-picker\n\t\t\t#timePickerStart\n\t\t\t[label]=\"startLabel\"\n\t\t\t[value]=\"startValue()\"\n\t\t\t(valueChange)=\"onStartChange($event)\"\n\t\t\t[disabled]=\"isDisabled()\"\n\t\t\t[max]=\"max()\"\n\t\t\t[step]=\"step()\"\n\t\t\t[size]=\"size()\"\n\t\t\t[displayArrows]=\"displayArrows()\"\n\t\t\t[forceMeridiemDisplay]=\"forceMeridiemDisplay()\"\n\t\t\t(nextPicker)=\"timePickerEnd.focusPart('hours')\"\n\t\t\t(nonDigitKeyPressed)=\"keyPressed.set(true)\"\n\t\t/>\n\t\t<label role=\"presentation\" [attr.for]=\"timePickerEnd?.firstTimePickerInputId\" class=\"timePicker-arrow\">\n\t\t\t<lu-icon class=\"timePicker-arrow-icon\" icon=\"arrowRight\" />\n\t\t</label>\n\t\t<lu-time-picker\n\t\t\t#timePickerEnd\n\t\t\t[label]=\"endLabel\"\n\t\t\t[value]=\"endValue()\"\n\t\t\t(valueChange)=\"onEndChange($event)\"\n\t\t\t[disabled]=\"isDisabled()\"\n\t\t\t[max]=\"max()\"\n\t\t\t[step]=\"step()\"\n\t\t\t[size]=\"size()\"\n\t\t\t[displayArrows]=\"displayArrows()\"\n\t\t\t[forceMeridiemDisplay]=\"forceMeridiemDisplay()\"\n\t\t\t(prevPicker)=\"timePickerStart.focusPart(partToFocus())\"\n\t\t\t(nonDigitKeyPressed)=\"keyPressed.set(true)\"\n\t\t/>\n\t</div>\n</div>\n\n<ng-container *luPresentationDisplayDefault>\n\t{{ intl().timeRangePickerFrom }}\n\t<span class=\"pr-u-mask\">{{ startLabel }}</span>\n\t@if (startValue() && startValue() !== DEFAULT_TIME_VALUE) {\n\t\t{{ startValue() }}\n\t} @else {\n\t\t<span aria-hidden=\"true\" data-content-before=\"\u2013\"></span>\n\t}\n\t{{ intl().timeRangePickerAt }}\n\t<span class=\"pr-u-mask\">{{ endLabel }}</span>\n\t@if (endValue() && endValue() !== DEFAULT_TIME_VALUE) {\n\t\t{{ endValue() }}\n\t} @else {\n\t\t<span aria-hidden=\"true\" data-content-before=\"\u2013\"></span>\n\t}\n</ng-container>\n", styles: ["@layer components{.timePicker{--components-timepicker-border: var(--pr-t-color-input-border);--components-timepicker-background: var(--pr-t-color-input-background);--components-timepicker-color: var(--pr-t-color-input-text);--components-timepicker-font: var(--pr-t-font-body-M);--components-timepicker-input-height: 2rem;--components-timepicker-input-minInlineSize: .5rem;--components-timepicker-input-padding-inline: var(--components-timepicker-start) var(--components-timepicker-end);--components-timepicker-input-padding-block: var(--pr-t-spacings-50);--components-timepicker-padding: 0;--components-timepicker-display-inset-inline: var(--components-timepicker-input-padding-inline);--components-timepicker-display-inset-block: var(--components-timepicker-input-padding-block);--components-timepicker-separator-left: 2.375rem;--components-timepicker-start: var(--pr-t-spacings-50);--components-timepicker-end: var(--pr-t-spacings-100);padding:var(--components-timepicker-padding);inline-size:fit-content}.timePicker-fieldset{display:flex;align-items:center;box-shadow:0 0 0 1px var(--components-timepicker-border);border-radius:var(--pr-t-border-radius-input);padding:0;border:0;margin:0;background-color:var(--components-timepicker-background);color:var(--components-timepicker-color);font:var(--components-timepicker-font);position:relative;cursor:text}.timePicker-fieldset:hover{--components-timepicker-border: var(--pr-t-color-input-border-hover)}.timePicker-fieldset:focus-within{outline:2px solid var(--palettes-700, var(--palettes-product-700));outline-offset:3px}.timePicker-fieldset .timePicker-fieldset{box-shadow:initial}.timePicker-fieldset .timePicker-fieldset:focus-within{outline:initial}.timePicker-arrow{align-self:stretch;display:flex;align-items:center;color:var(--pr-t-color-text-subtle)}.timePicker-arrow-icon .lucca-icon{--icon-size: 1.25rem}.timePicker-fieldset-groupSeparator{
|
|
1166
|
+
], template: "@let startLabel = `${formFieldLabel() && isLocaleFr() ? formFieldLabel() + \" \" : \"\"}(${intl().timeRangePickerStart})`;\n@let endLabel = `${formFieldLabel() && isLocaleFr() ? formFieldLabel() + \" \" : \"\"}(${intl().timeRangePickerEnd})`;\n\n<div\n\tclass=\"timePicker\"\n\t[class.mod-stepper]=\"displayArrows()\"\n\t[class.pr-u-animatedShake]=\"keyPressed()\"\n\t(animationend)=\"keyPressed.set(false)\"\n>\n\t<div class=\"timePicker-fieldset\">\n\t\t<lu-time-picker\n\t\t\t#timePickerStart\n\t\t\t[label]=\"startLabel\"\n\t\t\t[value]=\"startValue()\"\n\t\t\t(valueChange)=\"onStartChange($event)\"\n\t\t\t[disabled]=\"isDisabled()\"\n\t\t\t[max]=\"max()\"\n\t\t\t[step]=\"step()\"\n\t\t\t[size]=\"size()\"\n\t\t\t[displayArrows]=\"displayArrows()\"\n\t\t\t[forceMeridiemDisplay]=\"forceMeridiemDisplay()\"\n\t\t\t(nextPicker)=\"timePickerEnd.focusPart('hours')\"\n\t\t\t(nonDigitKeyPressed)=\"keyPressed.set(true)\"\n\t\t/>\n\t\t<label role=\"presentation\" [attr.for]=\"timePickerEnd?.firstTimePickerInputId\" class=\"timePicker-arrow\">\n\t\t\t<lu-icon class=\"timePicker-arrow-icon\" icon=\"arrowRight\" />\n\t\t</label>\n\t\t<lu-time-picker\n\t\t\t#timePickerEnd\n\t\t\t[label]=\"endLabel\"\n\t\t\t[value]=\"endValue()\"\n\t\t\t(valueChange)=\"onEndChange($event)\"\n\t\t\t[disabled]=\"isDisabled()\"\n\t\t\t[max]=\"max()\"\n\t\t\t[step]=\"step()\"\n\t\t\t[size]=\"size()\"\n\t\t\t[displayArrows]=\"displayArrows()\"\n\t\t\t[forceMeridiemDisplay]=\"forceMeridiemDisplay()\"\n\t\t\t(prevPicker)=\"timePickerStart.focusPart(partToFocus())\"\n\t\t\t(nonDigitKeyPressed)=\"keyPressed.set(true)\"\n\t\t/>\n\t</div>\n</div>\n\n<ng-container *luPresentationDisplayDefault>\n\t{{ intl().timeRangePickerFrom }}\n\t<span class=\"pr-u-mask\">{{ startLabel }}</span>\n\t@if (startValue() && startValue() !== DEFAULT_TIME_VALUE) {\n\t\t{{ startValue() }}\n\t} @else {\n\t\t<span aria-hidden=\"true\" data-content-before=\"\u2013\"></span>\n\t}\n\t{{ intl().timeRangePickerAt }}\n\t<span class=\"pr-u-mask\">{{ endLabel }}</span>\n\t@if (endValue() && endValue() !== DEFAULT_TIME_VALUE) {\n\t\t{{ endValue() }}\n\t} @else {\n\t\t<span aria-hidden=\"true\" data-content-before=\"\u2013\"></span>\n\t}\n</ng-container>\n", styles: ["@layer components{.timePicker{--components-timepicker-border: var(--pr-t-color-input-border);--components-timepicker-background: var(--pr-t-color-input-background);--components-timepicker-color: var(--pr-t-color-input-text);--components-timepicker-font: var(--pr-t-font-body-M);--components-timepicker-input-height: 2rem;--components-timepicker-input-minInlineSize: .5rem;--components-timepicker-input-padding-inline: var(--components-timepicker-start) var(--components-timepicker-end);--components-timepicker-input-padding-block: var(--pr-t-spacings-50);--components-timepicker-padding: 0;--components-timepicker-display-inset-inline: var(--components-timepicker-input-padding-inline);--components-timepicker-display-inset-block: var(--components-timepicker-input-padding-block);--components-timepicker-separator-left: 2.375rem;--components-timepicker-start: var(--pr-t-spacings-50);--components-timepicker-end: var(--pr-t-spacings-100);padding:var(--components-timepicker-padding);inline-size:fit-content}.timePicker-fieldset{display:flex;align-items:center;box-shadow:0 0 0 1px var(--components-timepicker-border);border-radius:var(--pr-t-border-radius-input);padding:0;border:0;margin:0;background-color:var(--components-timepicker-background);color:var(--components-timepicker-color);font:var(--components-timepicker-font);position:relative;cursor:text}.timePicker-fieldset:hover{--components-timepicker-border: var(--pr-t-color-input-border-hover)}.timePicker-fieldset:focus-within{outline:2px solid var(--palettes-700, var(--palettes-product-700));outline-offset:3px}.timePicker-fieldset .timePicker-fieldset{box-shadow:initial}.timePicker-fieldset .timePicker-fieldset:focus-within{outline:initial}.timePicker-arrow{align-self:stretch;display:flex;align-items:center;color:var(--pr-t-color-text-subtle)}.timePicker-arrow-icon .lucca-icon{--icon-size: 1.25rem}.timePicker-fieldset-groupSeparator{display:grid;place-items:center;text-align:center;inline-size:fit-content;block-size:calc(var(--components-timepicker-input-height) + var(--components-timepicker-input-padding-block) * 2);margin-inline:calc(var(--pr-t-spacings-25) * -1);position:relative;inset-inline-start:calc(var(--pr-t-spacings-25) * -1);z-index:1}.timePicker-fieldset-group{position:relative}.timePicker-fieldset-group~.timePicker-fieldset-group{margin-inline-start:calc(var(--pr-t-spacings-50) * -1);--components-timepicker-input-padding-inline: var(--components-timepicker-end) var(--components-timepicker-start);--components-timepicker-display-inset-inline: var(--components-timepicker-input-padding-inline)}.timePicker-fieldset-group-textfield{background-color:transparent}.timePicker-fieldset-group-textfield-input{display:flex;align-items:center;justify-content:center;border:0;block-size:var(--components-timepicker-input-height);inline-size:calc(var(--components-timepicker-input-minInlineSize) + var(--components-timepicker-input-digits, 2) * 1ch);outline:none;color:inherit;background-color:transparent;text-align:center;padding-block:var(--components-timepicker-input-padding-block);padding-inline:var(--components-timepicker-input-padding-inline);box-sizing:content-box;opacity:.0001}.timePicker-fieldset-group-textfield-input::placeholder{color:var(--component-textField-placeholder)}.timePicker-fieldset-group-textfield-input:focus-visible+.timePicker-fieldset-group-textfield-display{background-color:var(--palettes-product-100)}.timePicker-fieldset-group-textfield-display{position:absolute;inset-block:var(--components-timepicker-display-inset-block);inset-inline:var(--components-timepicker-display-inset-inline);border-radius:var(--pr-t-border-radius-50);pointer-events:none;display:grid;place-items:center}.timePicker-fieldset-group-stepper{position:absolute;inset-block-end:calc(var(--components-timepicker-input-height) + var(--pr-t-spacings-150) + 1px);border:0;padding:0;block-size:1rem;inline-size:1rem;inset-inline-start:50%;transform:translate(-50%);background-color:transparent;color:var(--palettes-neutral-600);display:inline-flex;justify-content:center;align-items:center;border-radius:var(--pr-t-border-radius-50);outline:none;opacity:1;transition-property:opacity;transition-duration:var(--commons-animations-durations-fast);cursor:pointer}.timePicker-fieldset-group-stepper:hover{background-color:var(--palettes-neutral-50);color:var(--palettes-neutral-800)}.timePicker-fieldset-group-stepper:disabled{cursor:default;color:var(--palettes-neutral-500);pointer-events:none}.timePicker-fieldset-group-stepper .lucca-icon{--icon-size: 1rem}.timePicker-fieldset-group-stepper+.timePicker-fieldset-group-stepper{inset-block-start:calc(var(--components-timepicker-input-height) + var(--pr-t-spacings-150) + 1px);inset-block-end:auto}.timePicker-fieldset-meridiem{box-sizing:content-box;inline-size:calc(var(--pr-t-spacings-100) + 2ch);padding-inline:var(--pr-t-spacings-50);position:relative;align-self:stretch;margin-inline-start:calc(var(--pr-t-spacings-50) * -1)}.timePicker-fieldset-meridiem:after{content:\"\";position:absolute;inset-block:var(--components-timepicker-display-inset-block);inset-inline:var(--pr-t-spacings-50);border-radius:var(--pr-t-border-radius-50);display:grid;place-items:center;text-align:end}.timePicker-fieldset-meridiem:has(input:focus):after{background-color:var(--palettes-product-100)}.timePicker-fieldset-meridiem:has(.timePicker-fieldset-meridiem-ante-input:checked):after{content:\"AM\"/\"\"}.timePicker-fieldset-meridiem:has(.timePicker-fieldset-meridiem-post-input:checked):after{content:\"PM\"/\"\"}.timePicker-fieldset-meridiem-ante,.timePicker-fieldset-meridiem-post{border:0;clip-path:rect(1px 1px 1px 1px);margin:-1px;overflow:hidden;padding:0;position:absolute;block-size:1px;inline-size:1px;white-space:nowrap;contain:paint}}@layer mods{.timePicker.mod-S{--components-timepicker-font: var(--pr-t-font-body-S);--components-timepicker-input-padding-block: var(--pr-t-spacings-25);--components-timepicker-input-height: 1.75rem;--components-timepicker-separator-left: 1.875rem;--components-timepicker-start: var(--pr-t-spacings-25);--components-timepicker-end: var(--pr-t-spacings-75)}.timePicker.mod-S .timePicker-arrow-icon .lucca-icon{--icon-size: 1rem}.timePicker.mod-S .timePicker-fieldset-group{--components-timepicker-input-padding-inline: var(--components-timepicker-start) var(--components-timepicker-end);--components-timepicker-display-inset-inline: var(--components-timepicker-input-padding-inline)}.timePicker.mod-S .timePicker-fieldset-group~.timePicker-fieldset-group{--components-timepicker-input-padding-inline: var(--components-timepicker-end) var(--components-timepicker-start)}.timePicker.mod-S .timePicker-fieldset-meridiem{inline-size:calc(var(--pr-t-spacings-50) + 2ch)}.timePicker.mod-S .timePicker-fieldset-meridiem:after{inset-inline:var(--pr-t-spacings-25)}.timePicker.mod-stepper{--components-timepicker-padding: var(--pr-t-spacings-300) 0}.timePicker.mod-stepperHover:not(:hover,:focus-within) .timePicker-fieldset-group-stepper{opacity:0}.timePicker:has([aria-invalid=true]){--components-timepicker-background: var(--pr-t-color-input-background-critical);--components-timepicker-border: var(--pr-t-color-input-border-critical)}.timePicker:has([aria-invalid=true]):hover{--components-timepicker-border: var(--pr-t-color-input-border-critical-hover)}.timePicker:has([disabled]){--components-timepicker-background: var(--pr-t-color-input-background-disabled);--components-timepicker-border: var(--commons-disabled-placeholder);--components-timepicker-color: var(--pr-t-color-input-text-disabled)}}@layer base{lu-time-range-picker{display:contents}}\n"] }]
|
|
1151
1167
|
}], ctorParameters: () => [], propDecorators: { intl: [{ type: i0.Input, args: [{ isSignal: true, alias: "intl", required: false }] }], displayArrows: [{ type: i0.Input, args: [{ isSignal: true, alias: "displayArrows", required: false }] }], forceMeridiemDisplay: [{ type: i0.Input, args: [{ isSignal: true, alias: "forceMeridiemDisplay", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], max: [{ type: i0.Input, args: [{ isSignal: true, alias: "max", required: false }] }], step: [{ type: i0.Input, args: [{ isSignal: true, alias: "step", required: false }] }] } });
|
|
1152
1168
|
|
|
1153
1169
|
/**
|