@triptease/tt-date-range-picker 6.5.11 → 6.5.13
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/src/TtDateRangePicker.js +1 -1
- package/dist/cjs/src/TtDateRangePicker.js.map +1 -1
- package/dist/esm/src/DateRangeInput/DateRangeInput.d.ts +2 -0
- package/dist/esm/src/SidePanel/SidePanel.d.ts +2 -0
- package/dist/esm/src/TtDateRangePicker.d.ts +2 -0
- package/dist/esm/src/TtDateRangePicker.js +1 -1
- package/dist/esm/src/TtDateRangePicker.js.map +1 -1
- package/package.json +8 -5
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TtDateRangePicker.js","sourceRoot":"","sources":["../../../src/TtDateRangePicker.ts"],"names":[],"mappings":"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","sourcesContent":["import { property, query, state } from 'lit/decorators.js';\nimport { css, html, LitElement, nothing, PropertyValues } from 'lit';\nimport { unsafeSVG } from 'lit/directives/unsafe-svg.js';\nimport { DateTime } from 'luxon';\nimport { TtDialog } from '@triptease/tt-dialog';\nimport { Calendar } from '@triptease/tt-calendar';\nimport { DateRange, DateRangeSelectionEvent } from '@triptease/tt-calendar/date-selection-context.js';\nimport { calendarIcon } from '@triptease/icons';\nimport { DateRangeInput } from './DateRangeInput/DateRangeInput.js';\nimport { styles } from './styles.js';\n\nexport class TtDateRangePicker extends LitElement {\n public internals: ReturnType<typeof this.attachInternals>;\n\n constructor() {\n super();\n this.internals = this.attachInternals();\n }\n\n connectedCallback() {\n super.connectedCallback();\n this.addEventListener('date-range-selection', this.onChange);\n this.addEventListener('dialog-open', this._onDialogOpen);\n this.addEventListener('dialog-close', this._onDialogClose);\n this.addEventListener('focusout', this.onFocusOut);\n this.addEventListener('focus', this._onFocus);\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n this.removeEventListener('date-range-selection', this.onChange);\n this.removeEventListener('dialog-open', this._onDialogOpen);\n this.removeEventListener('dialog-close', this._onDialogClose);\n this.removeEventListener('focusout', this.onFocusOut);\n this.removeEventListener('focus', this._onFocus);\n }\n\n static formAssociated = true;\n\n static shadowRootOptions = {\n ...LitElement.shadowRootOptions,\n delegatesFocus: true,\n };\n\n static styles = [\n styles,\n css`\n [part='controls'] {\n min-width: 30ch;\n }\n `,\n ];\n\n @query('tt-calendar')\n calendar!: Calendar;\n\n @query('tt-dialog')\n dialog!: TtDialog;\n\n @property({\n type: String,\n })\n public start?: string;\n\n @property({\n type: String,\n })\n public end?: string;\n\n @property({ type: Number })\n public minDays?: number;\n\n @property({ type: Number })\n public maxDays?: number;\n\n @property({\n type: String,\n })\n public minDate?: string;\n\n @property({\n type: String,\n })\n public maxDate?: string;\n\n @property({ type: Boolean, attribute: 'open-left' })\n public openLeft = false;\n\n @property({ type: Boolean })\n public disabled = false;\n\n // Internal DateTime properties for calculations\n private get _startDateTime(): DateTime | undefined {\n return this.start ? DateTime.fromISO(this.start) : undefined;\n }\n\n private get _endDateTime(): DateTime | undefined {\n return this.end ? DateTime.fromISO(this.end) : undefined;\n }\n\n private get _minDateTime(): DateTime | undefined {\n return this.minDate ? DateTime.fromISO(this.minDate) : undefined;\n }\n\n private get _maxDateTime(): DateTime | undefined {\n return this.maxDate ? DateTime.fromISO(this.maxDate) : undefined;\n }\n\n @state()\n private _open: boolean = false;\n\n @query('tt-date-range-input')\n dateRangeInput!: DateRangeInput;\n\n get form(): HTMLFormElement | null {\n return this.internals.form;\n }\n\n private get _formValue(): string | null {\n return JSON.stringify({\n startDate: this._startDateTime?.toISODate(),\n endDate: this._endDateTime?.toISODate(),\n });\n }\n\n public get value(): DateRange | undefined {\n return this.end || this.start ? { startDate: this.start, endDate: this.end } : undefined;\n }\n\n showCalendar() {\n if (!this._open) {\n const rect = this.getBoundingClientRect();\n if (!this.openLeft && rect.top > window.innerHeight - rect.bottom) {\n this.internals.states.add('open-above');\n } else {\n this.internals.states.delete('open-above');\n }\n\n this.dialog.show();\n\n if (this.openLeft) {\n this.style.setProperty('--calendar-left-distance', '-146px');\n }\n } else {\n this.dialog.hide();\n }\n }\n\n private _onDialogOpen = () => {\n this._open = true;\n };\n\n private _onDialogClose = () => {\n this._open = false;\n this.internals.states.delete('open-above');\n };\n\n public onFocusOut = (event: FocusEvent) => {\n if (!this._open) return;\n\n const target = (event.relatedTarget ?? event.explicitOriginalTarget) as HTMLElement | null;\n\n if (!this.contains(target)) {\n this.dialog.hide();\n }\n };\n\n protected updated(changedProperties: PropertyValues) {\n super.updated(changedProperties);\n if (changedProperties.has('start') || changedProperties.has('end')) {\n this.internals.setFormValue(this._formValue);\n }\n\n if (changedProperties.has('start') || changedProperties.has('end')) {\n this.validate();\n }\n\n if (changedProperties.has('disabled')) {\n if (this.disabled) {\n this.internals.setFormValue(null);\n this.internals.states.add('disabled');\n this.inert = true;\n } else {\n this.internals.states.delete('disabled');\n this.internals.setFormValue(this._formValue);\n this.inert = false;\n }\n }\n }\n\n private onChange(e: Event) {\n if (!DateRangeSelectionEvent.is(e) && e.type !== 'change') return;\n\n if (DateRangeSelectionEvent.is(e)) {\n this.start = e.detail.startDate!;\n this.end = e.detail.endDate!;\n } else if (e.type === 'change') {\n const { value } = e.target as DateRangeInput;\n this.start = value!.startDate ? value!.startDate : undefined;\n this.end = value!.endDate ? value!.endDate : undefined;\n }\n\n this.dispatchEvent(new InputEvent('change'));\n this.dialog.hide();\n }\n\n private _onFocus = () => {\n this.dateRangeInput.focus();\n };\n\n private validate() {\n const wasValid = this.internals.validity.valid;\n const oldMessage = this.internals.validationMessage;\n this.internals.setValidity({});\n\n if (this._endDateTime && this._startDateTime) {\n if (this._endDateTime < this._startDateTime) {\n this.internals.setValidity({ customError: true }, 'End date must be after start date');\n return;\n }\n\n const differenceInDays = this._endDateTime.diff(this._startDateTime!).as('days');\n const minDaysAreValid = !this.minDays || differenceInDays >= this.minDays;\n if (!minDaysAreValid) {\n this.internals.setValidity({ rangeUnderflow: true }, `Date range must be at least ${this.minDays} days`);\n return;\n }\n const maxDaysAreValid = !this.maxDays || differenceInDays <= this.maxDays;\n if (!maxDaysAreValid) {\n this.internals.setValidity({ rangeOverflow: true }, `Date range must be at most ${this.maxDays} days`);\n return;\n }\n const minDateIsValid =\n !this._minDateTime || this._startDateTime > this._minDateTime || this._startDateTime.equals(this._minDateTime);\n if (!minDateIsValid) {\n this.internals.setValidity(\n { rangeUnderflow: true },\n `Start date should be equal or after ${this._minDateTime?.toLocaleString({ month: 'short', day: 'numeric', year: 'numeric' })}`\n );\n return;\n }\n const maxDateIsValid =\n !this._maxDateTime || this._endDateTime.equals(this._maxDateTime) || this._endDateTime < this._maxDateTime;\n if (!maxDateIsValid) {\n this.internals.setValidity(\n { rangeOverflow: true },\n `End date should be before or equal to ${this._maxDateTime?.toLocaleString({ month: 'short', day: 'numeric', year: 'numeric' })}`\n );\n return;\n }\n }\n if (wasValid !== this.internals.validity.valid || oldMessage !== this.internals.validationMessage) {\n this.requestUpdate();\n }\n }\n\n render() {\n return html`\n <div part=\"controls\" aria-invalid=${!this.internals.validity.valid}>\n <tt-date-range-input @change=${this.onChange} .value=\"${this.value}\"></tt-date-range-input>\n <button name=\"show calendar\" @click=${this.showCalendar} class=\"show-calendar\">\n ${unsafeSVG(calendarIcon)}\n </button>\n </div>\n <tt-dialog name=\"calendar\" aria-label=\"Choose date range\" part=\"dialog\">\n <tt-calendar\n max-date=${this.maxDate}\n min-date=${this.minDate}\n max-days=${this.maxDays}\n @date-range-selection=${this.onChange}\n .value=\"${this.value}\"\n range\n part=\"calendar\"\n ></tt-calendar>\n <tt-side-panel>\n <slot name=\"preset\" slot=\"side-preset\"></slot>\n </tt-side-panel>\n </tt-dialog>\n <div class=\"errormessage\" id=\"error-msg-${this.id}\" role=\"alert\" aria-atomic=\"true\" part=\"error\">\n ${this.internals.validity.valid ? nothing : this.internals.validationMessage}\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'tt-date-range-picker': TtDateRangePicker;\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"TtDateRangePicker.js","sourceRoot":"","sources":["../../../src/TtDateRangePicker.ts"],"names":[],"mappings":"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","sourcesContent":["import { property, query, state } from 'lit/decorators.js';\nimport { css, html, LitElement, nothing, PropertyValues } from 'lit';\nimport { unsafeSVG } from 'lit/directives/unsafe-svg.js';\nimport { DateTime } from 'luxon';\nimport { TtDialog } from '@triptease/tt-dialog';\nimport { Calendar } from '@triptease/tt-calendar';\nimport { DateRange, DateRangeSelectionEvent } from '@triptease/tt-calendar/date-selection-context.js';\nimport { calendarIcon } from '@triptease/icons';\nimport { DateRangeInput } from './DateRangeInput/DateRangeInput.js';\nimport { styles } from './styles.js';\n\nexport class TtDateRangePicker extends LitElement {\n public internals: ReturnType<typeof this.attachInternals>;\n\n constructor() {\n super();\n this.internals = this.attachInternals();\n }\n\n connectedCallback() {\n super.connectedCallback();\n this.addEventListener('date-range-selection', this.onChange);\n this.addEventListener('dialog-open', this._onDialogOpen);\n this.addEventListener('dialog-close', this._onDialogClose);\n this.addEventListener('focusout', this.onFocusOut);\n this.addEventListener('focus', this._onFocus);\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n this.removeEventListener('date-range-selection', this.onChange);\n this.removeEventListener('dialog-open', this._onDialogOpen);\n this.removeEventListener('dialog-close', this._onDialogClose);\n this.removeEventListener('focusout', this.onFocusOut);\n this.removeEventListener('focus', this._onFocus);\n }\n\n static formAssociated = true;\n\n static shadowRootOptions = {\n ...LitElement.shadowRootOptions,\n delegatesFocus: true,\n };\n\n static styles = [\n styles,\n css`\n [part='controls'] {\n min-width: 33ch;\n }\n `,\n ];\n\n @query('tt-calendar')\n calendar!: Calendar;\n\n @query('tt-dialog')\n dialog!: TtDialog;\n\n @property({\n type: String,\n })\n public start?: string;\n\n @property({\n type: String,\n })\n public end?: string;\n\n @property({ type: Number })\n public minDays?: number;\n\n @property({ type: Number })\n public maxDays?: number;\n\n @property({\n type: String,\n })\n public minDate?: string;\n\n @property({\n type: String,\n })\n public maxDate?: string;\n\n @property({ type: Boolean, attribute: 'open-left' })\n public openLeft = false;\n\n @property({ type: Boolean })\n public disabled = false;\n\n // Internal DateTime properties for calculations\n private get _startDateTime(): DateTime | undefined {\n return this.start ? DateTime.fromISO(this.start) : undefined;\n }\n\n private get _endDateTime(): DateTime | undefined {\n return this.end ? DateTime.fromISO(this.end) : undefined;\n }\n\n private get _minDateTime(): DateTime | undefined {\n return this.minDate ? DateTime.fromISO(this.minDate) : undefined;\n }\n\n private get _maxDateTime(): DateTime | undefined {\n return this.maxDate ? DateTime.fromISO(this.maxDate) : undefined;\n }\n\n @state()\n private _open: boolean = false;\n\n @query('tt-date-range-input')\n dateRangeInput!: DateRangeInput;\n\n get form(): HTMLFormElement | null {\n return this.internals.form;\n }\n\n private get _formValue(): string | null {\n return JSON.stringify({\n startDate: this._startDateTime?.toISODate(),\n endDate: this._endDateTime?.toISODate(),\n });\n }\n\n public get value(): DateRange | undefined {\n return this.end || this.start ? { startDate: this.start, endDate: this.end } : undefined;\n }\n\n showCalendar() {\n if (!this._open) {\n const rect = this.getBoundingClientRect();\n if (!this.openLeft && rect.top > window.innerHeight - rect.bottom) {\n this.internals.states.add('open-above');\n } else {\n this.internals.states.delete('open-above');\n }\n\n this.dialog.show();\n\n if (this.openLeft) {\n this.style.setProperty('--calendar-left-distance', '-146px');\n }\n } else {\n this.dialog.hide();\n }\n }\n\n private _onDialogOpen = () => {\n this._open = true;\n };\n\n private _onDialogClose = () => {\n this._open = false;\n this.internals.states.delete('open-above');\n };\n\n public onFocusOut = (event: FocusEvent) => {\n if (!this._open) return;\n\n const target = (event.relatedTarget ?? event.explicitOriginalTarget) as HTMLElement | null;\n\n if (!this.contains(target)) {\n this.dialog.hide();\n }\n };\n\n protected updated(changedProperties: PropertyValues) {\n super.updated(changedProperties);\n if (changedProperties.has('start') || changedProperties.has('end')) {\n this.internals.setFormValue(this._formValue);\n }\n\n if (changedProperties.has('start') || changedProperties.has('end')) {\n this.validate();\n }\n\n if (changedProperties.has('disabled')) {\n if (this.disabled) {\n this.internals.setFormValue(null);\n this.internals.states.add('disabled');\n this.inert = true;\n } else {\n this.internals.states.delete('disabled');\n this.internals.setFormValue(this._formValue);\n this.inert = false;\n }\n }\n }\n\n private onChange(e: Event) {\n if (!DateRangeSelectionEvent.is(e) && e.type !== 'change') return;\n\n if (DateRangeSelectionEvent.is(e)) {\n this.start = e.detail.startDate!;\n this.end = e.detail.endDate!;\n } else if (e.type === 'change') {\n const { value } = e.target as DateRangeInput;\n this.start = value!.startDate ? value!.startDate : undefined;\n this.end = value!.endDate ? value!.endDate : undefined;\n }\n\n this.dispatchEvent(new InputEvent('change'));\n this.dialog.hide();\n }\n\n private _onFocus = () => {\n this.dateRangeInput.focus();\n };\n\n private validate() {\n const wasValid = this.internals.validity.valid;\n const oldMessage = this.internals.validationMessage;\n this.internals.setValidity({});\n\n if (this._endDateTime && this._startDateTime) {\n if (this._endDateTime < this._startDateTime) {\n this.internals.setValidity({ customError: true }, 'End date must be after start date');\n return;\n }\n\n const differenceInDays = this._endDateTime.diff(this._startDateTime!).as('days');\n const minDaysAreValid = !this.minDays || differenceInDays >= this.minDays;\n if (!minDaysAreValid) {\n this.internals.setValidity({ rangeUnderflow: true }, `Date range must be at least ${this.minDays} days`);\n return;\n }\n const maxDaysAreValid = !this.maxDays || differenceInDays <= this.maxDays;\n if (!maxDaysAreValid) {\n this.internals.setValidity({ rangeOverflow: true }, `Date range must be at most ${this.maxDays} days`);\n return;\n }\n const minDateIsValid =\n !this._minDateTime || this._startDateTime > this._minDateTime || this._startDateTime.equals(this._minDateTime);\n if (!minDateIsValid) {\n this.internals.setValidity(\n { rangeUnderflow: true },\n `Start date should be equal or after ${this._minDateTime?.toLocaleString({ month: 'short', day: 'numeric', year: 'numeric' })}`\n );\n return;\n }\n const maxDateIsValid =\n !this._maxDateTime || this._endDateTime.equals(this._maxDateTime) || this._endDateTime < this._maxDateTime;\n if (!maxDateIsValid) {\n this.internals.setValidity(\n { rangeOverflow: true },\n `End date should be before or equal to ${this._maxDateTime?.toLocaleString({ month: 'short', day: 'numeric', year: 'numeric' })}`\n );\n return;\n }\n }\n if (wasValid !== this.internals.validity.valid || oldMessage !== this.internals.validationMessage) {\n this.requestUpdate();\n }\n }\n\n render() {\n return html`\n <div part=\"controls\" aria-invalid=${!this.internals.validity.valid}>\n <tt-date-range-input @change=${this.onChange} .value=\"${this.value}\"></tt-date-range-input>\n <button name=\"show calendar\" @click=${this.showCalendar} class=\"show-calendar\">\n ${unsafeSVG(calendarIcon)}\n </button>\n </div>\n <tt-dialog name=\"calendar\" aria-label=\"Choose date range\" part=\"dialog\">\n <tt-calendar\n max-date=${this.maxDate}\n min-date=${this.minDate}\n max-days=${this.maxDays}\n @date-range-selection=${this.onChange}\n .value=\"${this.value}\"\n range\n part=\"calendar\"\n ></tt-calendar>\n <tt-side-panel>\n <slot name=\"preset\" slot=\"side-preset\"></slot>\n </tt-side-panel>\n </tt-dialog>\n <div class=\"errormessage\" id=\"error-msg-${this.id}\" role=\"alert\" aria-atomic=\"true\" part=\"error\">\n ${this.internals.validity.valid ? nothing : this.internals.validationMessage}\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'tt-date-range-picker': TtDateRangePicker;\n }\n}\n"]}
|
|
@@ -7,6 +7,8 @@ export declare class DateRangeInput extends LitElement {
|
|
|
7
7
|
dateInputs: Array<DateInput>;
|
|
8
8
|
static shadowRootOptions: {
|
|
9
9
|
delegatesFocus: boolean;
|
|
10
|
+
clonable?: boolean;
|
|
11
|
+
customElementRegistry?: CustomElementRegistry;
|
|
10
12
|
mode: ShadowRootMode;
|
|
11
13
|
serializable?: boolean;
|
|
12
14
|
slotAssignment?: SlotAssignmentMode;
|
|
@@ -4,6 +4,8 @@ export declare class SidePanel extends LitElement {
|
|
|
4
4
|
private slottedElements;
|
|
5
5
|
static shadowRootOptions: {
|
|
6
6
|
delegatesFocus: boolean;
|
|
7
|
+
clonable?: boolean;
|
|
8
|
+
customElementRegistry?: CustomElementRegistry;
|
|
7
9
|
mode: ShadowRootMode;
|
|
8
10
|
serializable?: boolean;
|
|
9
11
|
slotAssignment?: SlotAssignmentMode;
|
|
@@ -11,6 +11,8 @@ export declare class TtDateRangePicker extends LitElement {
|
|
|
11
11
|
static formAssociated: boolean;
|
|
12
12
|
static shadowRootOptions: {
|
|
13
13
|
delegatesFocus: boolean;
|
|
14
|
+
clonable?: boolean;
|
|
15
|
+
customElementRegistry?: CustomElementRegistry;
|
|
14
16
|
mode: ShadowRootMode;
|
|
15
17
|
serializable?: boolean;
|
|
16
18
|
slotAssignment?: SlotAssignmentMode;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TtDateRangePicker.js","sourceRoot":"","sources":["../../../src/TtDateRangePicker.ts"],"names":[],"mappings":"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","sourcesContent":["import { property, query, state } from 'lit/decorators.js';\nimport { css, html, LitElement, nothing, PropertyValues } from 'lit';\nimport { unsafeSVG } from 'lit/directives/unsafe-svg.js';\nimport { DateTime } from 'luxon';\nimport { TtDialog } from '@triptease/tt-dialog';\nimport { Calendar } from '@triptease/tt-calendar';\nimport { DateRange, DateRangeSelectionEvent } from '@triptease/tt-calendar/date-selection-context.js';\nimport { calendarIcon } from '@triptease/icons';\nimport { DateRangeInput } from './DateRangeInput/DateRangeInput.js';\nimport { styles } from './styles.js';\n\nexport class TtDateRangePicker extends LitElement {\n public internals: ReturnType<typeof this.attachInternals>;\n\n constructor() {\n super();\n this.internals = this.attachInternals();\n }\n\n connectedCallback() {\n super.connectedCallback();\n this.addEventListener('date-range-selection', this.onChange);\n this.addEventListener('dialog-open', this._onDialogOpen);\n this.addEventListener('dialog-close', this._onDialogClose);\n this.addEventListener('focusout', this.onFocusOut);\n this.addEventListener('focus', this._onFocus);\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n this.removeEventListener('date-range-selection', this.onChange);\n this.removeEventListener('dialog-open', this._onDialogOpen);\n this.removeEventListener('dialog-close', this._onDialogClose);\n this.removeEventListener('focusout', this.onFocusOut);\n this.removeEventListener('focus', this._onFocus);\n }\n\n static formAssociated = true;\n\n static shadowRootOptions = {\n ...LitElement.shadowRootOptions,\n delegatesFocus: true,\n };\n\n static styles = [\n styles,\n css`\n [part='controls'] {\n min-width: 30ch;\n }\n `,\n ];\n\n @query('tt-calendar')\n calendar!: Calendar;\n\n @query('tt-dialog')\n dialog!: TtDialog;\n\n @property({\n type: String,\n })\n public start?: string;\n\n @property({\n type: String,\n })\n public end?: string;\n\n @property({ type: Number })\n public minDays?: number;\n\n @property({ type: Number })\n public maxDays?: number;\n\n @property({\n type: String,\n })\n public minDate?: string;\n\n @property({\n type: String,\n })\n public maxDate?: string;\n\n @property({ type: Boolean, attribute: 'open-left' })\n public openLeft = false;\n\n @property({ type: Boolean })\n public disabled = false;\n\n // Internal DateTime properties for calculations\n private get _startDateTime(): DateTime | undefined {\n return this.start ? DateTime.fromISO(this.start) : undefined;\n }\n\n private get _endDateTime(): DateTime | undefined {\n return this.end ? DateTime.fromISO(this.end) : undefined;\n }\n\n private get _minDateTime(): DateTime | undefined {\n return this.minDate ? DateTime.fromISO(this.minDate) : undefined;\n }\n\n private get _maxDateTime(): DateTime | undefined {\n return this.maxDate ? DateTime.fromISO(this.maxDate) : undefined;\n }\n\n @state()\n private _open: boolean = false;\n\n @query('tt-date-range-input')\n dateRangeInput!: DateRangeInput;\n\n get form(): HTMLFormElement | null {\n return this.internals.form;\n }\n\n private get _formValue(): string | null {\n return JSON.stringify({\n startDate: this._startDateTime?.toISODate(),\n endDate: this._endDateTime?.toISODate(),\n });\n }\n\n public get value(): DateRange | undefined {\n return this.end || this.start ? { startDate: this.start, endDate: this.end } : undefined;\n }\n\n showCalendar() {\n if (!this._open) {\n const rect = this.getBoundingClientRect();\n if (!this.openLeft && rect.top > window.innerHeight - rect.bottom) {\n this.internals.states.add('open-above');\n } else {\n this.internals.states.delete('open-above');\n }\n\n this.dialog.show();\n\n if (this.openLeft) {\n this.style.setProperty('--calendar-left-distance', '-146px');\n }\n } else {\n this.dialog.hide();\n }\n }\n\n private _onDialogOpen = () => {\n this._open = true;\n };\n\n private _onDialogClose = () => {\n this._open = false;\n this.internals.states.delete('open-above');\n };\n\n public onFocusOut = (event: FocusEvent) => {\n if (!this._open) return;\n\n const target = (event.relatedTarget ?? event.explicitOriginalTarget) as HTMLElement | null;\n\n if (!this.contains(target)) {\n this.dialog.hide();\n }\n };\n\n protected updated(changedProperties: PropertyValues) {\n super.updated(changedProperties);\n if (changedProperties.has('start') || changedProperties.has('end')) {\n this.internals.setFormValue(this._formValue);\n }\n\n if (changedProperties.has('start') || changedProperties.has('end')) {\n this.validate();\n }\n\n if (changedProperties.has('disabled')) {\n if (this.disabled) {\n this.internals.setFormValue(null);\n this.internals.states.add('disabled');\n this.inert = true;\n } else {\n this.internals.states.delete('disabled');\n this.internals.setFormValue(this._formValue);\n this.inert = false;\n }\n }\n }\n\n private onChange(e: Event) {\n if (!DateRangeSelectionEvent.is(e) && e.type !== 'change') return;\n\n if (DateRangeSelectionEvent.is(e)) {\n this.start = e.detail.startDate!;\n this.end = e.detail.endDate!;\n } else if (e.type === 'change') {\n const { value } = e.target as DateRangeInput;\n this.start = value!.startDate ? value!.startDate : undefined;\n this.end = value!.endDate ? value!.endDate : undefined;\n }\n\n this.dispatchEvent(new InputEvent('change'));\n this.dialog.hide();\n }\n\n private _onFocus = () => {\n this.dateRangeInput.focus();\n };\n\n private validate() {\n const wasValid = this.internals.validity.valid;\n const oldMessage = this.internals.validationMessage;\n this.internals.setValidity({});\n\n if (this._endDateTime && this._startDateTime) {\n if (this._endDateTime < this._startDateTime) {\n this.internals.setValidity({ customError: true }, 'End date must be after start date');\n return;\n }\n\n const differenceInDays = this._endDateTime.diff(this._startDateTime!).as('days');\n const minDaysAreValid = !this.minDays || differenceInDays >= this.minDays;\n if (!minDaysAreValid) {\n this.internals.setValidity({ rangeUnderflow: true }, `Date range must be at least ${this.minDays} days`);\n return;\n }\n const maxDaysAreValid = !this.maxDays || differenceInDays <= this.maxDays;\n if (!maxDaysAreValid) {\n this.internals.setValidity({ rangeOverflow: true }, `Date range must be at most ${this.maxDays} days`);\n return;\n }\n const minDateIsValid =\n !this._minDateTime || this._startDateTime > this._minDateTime || this._startDateTime.equals(this._minDateTime);\n if (!minDateIsValid) {\n this.internals.setValidity(\n { rangeUnderflow: true },\n `Start date should be equal or after ${this._minDateTime?.toLocaleString({ month: 'short', day: 'numeric', year: 'numeric' })}`\n );\n return;\n }\n const maxDateIsValid =\n !this._maxDateTime || this._endDateTime.equals(this._maxDateTime) || this._endDateTime < this._maxDateTime;\n if (!maxDateIsValid) {\n this.internals.setValidity(\n { rangeOverflow: true },\n `End date should be before or equal to ${this._maxDateTime?.toLocaleString({ month: 'short', day: 'numeric', year: 'numeric' })}`\n );\n return;\n }\n }\n if (wasValid !== this.internals.validity.valid || oldMessage !== this.internals.validationMessage) {\n this.requestUpdate();\n }\n }\n\n render() {\n return html`\n <div part=\"controls\" aria-invalid=${!this.internals.validity.valid}>\n <tt-date-range-input @change=${this.onChange} .value=\"${this.value}\"></tt-date-range-input>\n <button name=\"show calendar\" @click=${this.showCalendar} class=\"show-calendar\">\n ${unsafeSVG(calendarIcon)}\n </button>\n </div>\n <tt-dialog name=\"calendar\" aria-label=\"Choose date range\" part=\"dialog\">\n <tt-calendar\n max-date=${this.maxDate}\n min-date=${this.minDate}\n max-days=${this.maxDays}\n @date-range-selection=${this.onChange}\n .value=\"${this.value}\"\n range\n part=\"calendar\"\n ></tt-calendar>\n <tt-side-panel>\n <slot name=\"preset\" slot=\"side-preset\"></slot>\n </tt-side-panel>\n </tt-dialog>\n <div class=\"errormessage\" id=\"error-msg-${this.id}\" role=\"alert\" aria-atomic=\"true\" part=\"error\">\n ${this.internals.validity.valid ? nothing : this.internals.validationMessage}\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'tt-date-range-picker': TtDateRangePicker;\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"TtDateRangePicker.js","sourceRoot":"","sources":["../../../src/TtDateRangePicker.ts"],"names":[],"mappings":"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","sourcesContent":["import { property, query, state } from 'lit/decorators.js';\nimport { css, html, LitElement, nothing, PropertyValues } from 'lit';\nimport { unsafeSVG } from 'lit/directives/unsafe-svg.js';\nimport { DateTime } from 'luxon';\nimport { TtDialog } from '@triptease/tt-dialog';\nimport { Calendar } from '@triptease/tt-calendar';\nimport { DateRange, DateRangeSelectionEvent } from '@triptease/tt-calendar/date-selection-context.js';\nimport { calendarIcon } from '@triptease/icons';\nimport { DateRangeInput } from './DateRangeInput/DateRangeInput.js';\nimport { styles } from './styles.js';\n\nexport class TtDateRangePicker extends LitElement {\n public internals: ReturnType<typeof this.attachInternals>;\n\n constructor() {\n super();\n this.internals = this.attachInternals();\n }\n\n connectedCallback() {\n super.connectedCallback();\n this.addEventListener('date-range-selection', this.onChange);\n this.addEventListener('dialog-open', this._onDialogOpen);\n this.addEventListener('dialog-close', this._onDialogClose);\n this.addEventListener('focusout', this.onFocusOut);\n this.addEventListener('focus', this._onFocus);\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n this.removeEventListener('date-range-selection', this.onChange);\n this.removeEventListener('dialog-open', this._onDialogOpen);\n this.removeEventListener('dialog-close', this._onDialogClose);\n this.removeEventListener('focusout', this.onFocusOut);\n this.removeEventListener('focus', this._onFocus);\n }\n\n static formAssociated = true;\n\n static shadowRootOptions = {\n ...LitElement.shadowRootOptions,\n delegatesFocus: true,\n };\n\n static styles = [\n styles,\n css`\n [part='controls'] {\n min-width: 33ch;\n }\n `,\n ];\n\n @query('tt-calendar')\n calendar!: Calendar;\n\n @query('tt-dialog')\n dialog!: TtDialog;\n\n @property({\n type: String,\n })\n public start?: string;\n\n @property({\n type: String,\n })\n public end?: string;\n\n @property({ type: Number })\n public minDays?: number;\n\n @property({ type: Number })\n public maxDays?: number;\n\n @property({\n type: String,\n })\n public minDate?: string;\n\n @property({\n type: String,\n })\n public maxDate?: string;\n\n @property({ type: Boolean, attribute: 'open-left' })\n public openLeft = false;\n\n @property({ type: Boolean })\n public disabled = false;\n\n // Internal DateTime properties for calculations\n private get _startDateTime(): DateTime | undefined {\n return this.start ? DateTime.fromISO(this.start) : undefined;\n }\n\n private get _endDateTime(): DateTime | undefined {\n return this.end ? DateTime.fromISO(this.end) : undefined;\n }\n\n private get _minDateTime(): DateTime | undefined {\n return this.minDate ? DateTime.fromISO(this.minDate) : undefined;\n }\n\n private get _maxDateTime(): DateTime | undefined {\n return this.maxDate ? DateTime.fromISO(this.maxDate) : undefined;\n }\n\n @state()\n private _open: boolean = false;\n\n @query('tt-date-range-input')\n dateRangeInput!: DateRangeInput;\n\n get form(): HTMLFormElement | null {\n return this.internals.form;\n }\n\n private get _formValue(): string | null {\n return JSON.stringify({\n startDate: this._startDateTime?.toISODate(),\n endDate: this._endDateTime?.toISODate(),\n });\n }\n\n public get value(): DateRange | undefined {\n return this.end || this.start ? { startDate: this.start, endDate: this.end } : undefined;\n }\n\n showCalendar() {\n if (!this._open) {\n const rect = this.getBoundingClientRect();\n if (!this.openLeft && rect.top > window.innerHeight - rect.bottom) {\n this.internals.states.add('open-above');\n } else {\n this.internals.states.delete('open-above');\n }\n\n this.dialog.show();\n\n if (this.openLeft) {\n this.style.setProperty('--calendar-left-distance', '-146px');\n }\n } else {\n this.dialog.hide();\n }\n }\n\n private _onDialogOpen = () => {\n this._open = true;\n };\n\n private _onDialogClose = () => {\n this._open = false;\n this.internals.states.delete('open-above');\n };\n\n public onFocusOut = (event: FocusEvent) => {\n if (!this._open) return;\n\n const target = (event.relatedTarget ?? event.explicitOriginalTarget) as HTMLElement | null;\n\n if (!this.contains(target)) {\n this.dialog.hide();\n }\n };\n\n protected updated(changedProperties: PropertyValues) {\n super.updated(changedProperties);\n if (changedProperties.has('start') || changedProperties.has('end')) {\n this.internals.setFormValue(this._formValue);\n }\n\n if (changedProperties.has('start') || changedProperties.has('end')) {\n this.validate();\n }\n\n if (changedProperties.has('disabled')) {\n if (this.disabled) {\n this.internals.setFormValue(null);\n this.internals.states.add('disabled');\n this.inert = true;\n } else {\n this.internals.states.delete('disabled');\n this.internals.setFormValue(this._formValue);\n this.inert = false;\n }\n }\n }\n\n private onChange(e: Event) {\n if (!DateRangeSelectionEvent.is(e) && e.type !== 'change') return;\n\n if (DateRangeSelectionEvent.is(e)) {\n this.start = e.detail.startDate!;\n this.end = e.detail.endDate!;\n } else if (e.type === 'change') {\n const { value } = e.target as DateRangeInput;\n this.start = value!.startDate ? value!.startDate : undefined;\n this.end = value!.endDate ? value!.endDate : undefined;\n }\n\n this.dispatchEvent(new InputEvent('change'));\n this.dialog.hide();\n }\n\n private _onFocus = () => {\n this.dateRangeInput.focus();\n };\n\n private validate() {\n const wasValid = this.internals.validity.valid;\n const oldMessage = this.internals.validationMessage;\n this.internals.setValidity({});\n\n if (this._endDateTime && this._startDateTime) {\n if (this._endDateTime < this._startDateTime) {\n this.internals.setValidity({ customError: true }, 'End date must be after start date');\n return;\n }\n\n const differenceInDays = this._endDateTime.diff(this._startDateTime!).as('days');\n const minDaysAreValid = !this.minDays || differenceInDays >= this.minDays;\n if (!minDaysAreValid) {\n this.internals.setValidity({ rangeUnderflow: true }, `Date range must be at least ${this.minDays} days`);\n return;\n }\n const maxDaysAreValid = !this.maxDays || differenceInDays <= this.maxDays;\n if (!maxDaysAreValid) {\n this.internals.setValidity({ rangeOverflow: true }, `Date range must be at most ${this.maxDays} days`);\n return;\n }\n const minDateIsValid =\n !this._minDateTime || this._startDateTime > this._minDateTime || this._startDateTime.equals(this._minDateTime);\n if (!minDateIsValid) {\n this.internals.setValidity(\n { rangeUnderflow: true },\n `Start date should be equal or after ${this._minDateTime?.toLocaleString({ month: 'short', day: 'numeric', year: 'numeric' })}`\n );\n return;\n }\n const maxDateIsValid =\n !this._maxDateTime || this._endDateTime.equals(this._maxDateTime) || this._endDateTime < this._maxDateTime;\n if (!maxDateIsValid) {\n this.internals.setValidity(\n { rangeOverflow: true },\n `End date should be before or equal to ${this._maxDateTime?.toLocaleString({ month: 'short', day: 'numeric', year: 'numeric' })}`\n );\n return;\n }\n }\n if (wasValid !== this.internals.validity.valid || oldMessage !== this.internals.validationMessage) {\n this.requestUpdate();\n }\n }\n\n render() {\n return html`\n <div part=\"controls\" aria-invalid=${!this.internals.validity.valid}>\n <tt-date-range-input @change=${this.onChange} .value=\"${this.value}\"></tt-date-range-input>\n <button name=\"show calendar\" @click=${this.showCalendar} class=\"show-calendar\">\n ${unsafeSVG(calendarIcon)}\n </button>\n </div>\n <tt-dialog name=\"calendar\" aria-label=\"Choose date range\" part=\"dialog\">\n <tt-calendar\n max-date=${this.maxDate}\n min-date=${this.minDate}\n max-days=${this.maxDays}\n @date-range-selection=${this.onChange}\n .value=\"${this.value}\"\n range\n part=\"calendar\"\n ></tt-calendar>\n <tt-side-panel>\n <slot name=\"preset\" slot=\"side-preset\"></slot>\n </tt-side-panel>\n </tt-dialog>\n <div class=\"errormessage\" id=\"error-msg-${this.id}\" role=\"alert\" aria-atomic=\"true\" part=\"error\">\n ${this.internals.validity.valid ? nothing : this.internals.validationMessage}\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'tt-date-range-picker': TtDateRangePicker;\n }\n}\n"]}
|
package/package.json
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
"description": "Webcomponent tt-date-range-picker following open-wc recommendations",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"author": "@triptease",
|
|
6
|
-
"version": "6.5.
|
|
6
|
+
"version": "6.5.13",
|
|
7
7
|
"type": "module",
|
|
8
8
|
"files": [
|
|
9
9
|
"dist/esm",
|
|
@@ -13,16 +13,19 @@
|
|
|
13
13
|
"module": "dist/esm/src/index.js",
|
|
14
14
|
"exports": {
|
|
15
15
|
".": {
|
|
16
|
+
"source": "./src/index.ts",
|
|
16
17
|
"types": "./dist/esm/src/index.d.ts",
|
|
17
18
|
"import": "./dist/esm/src/index.js",
|
|
18
19
|
"require": "./dist/cjs/src/index.js"
|
|
19
20
|
},
|
|
20
21
|
"./tt-date-range-picker.js": {
|
|
22
|
+
"source": "./src/tt-date-range-picker.ts",
|
|
21
23
|
"types": "./dist/esm/src/tt-date-range-picker.d.ts",
|
|
22
24
|
"import": "./dist/esm/src/tt-date-range-picker.js",
|
|
23
25
|
"require": "./dist/cjs/src/tt-date-range-picker.js"
|
|
24
26
|
},
|
|
25
27
|
"./tt-side-panel.js": {
|
|
28
|
+
"source": "./src/SidePanel/tt-side-panel.ts",
|
|
26
29
|
"types": "./dist/esm/src/SidePanel/tt-side-panel.d.ts",
|
|
27
30
|
"import": "./dist/esm/src/SidePanel/tt-side-panel.js",
|
|
28
31
|
"require": "./dist/cjs/src/SidePanel/tt-side-panel.js"
|
|
@@ -42,12 +45,12 @@
|
|
|
42
45
|
"test:watch": "tsc && concurrently -k -r \"tsc --watch --preserveWatchOutput\" \"wtr --watch\""
|
|
43
46
|
},
|
|
44
47
|
"dependencies": {
|
|
45
|
-
"@triptease/icons": "1.5.
|
|
46
|
-
"@triptease/tt-calendar": "6.4.
|
|
48
|
+
"@triptease/icons": "1.5.3",
|
|
49
|
+
"@triptease/tt-calendar": "6.4.7",
|
|
47
50
|
"@triptease/tt-date-input": "6.1.2",
|
|
48
51
|
"@triptease/tt-dialog": "5.2.2",
|
|
49
52
|
"@types/luxon": "^3.6.2",
|
|
50
|
-
"lit": "^3.
|
|
53
|
+
"lit": "^3.3.0",
|
|
51
54
|
"luxon": "^3.6.1"
|
|
52
55
|
},
|
|
53
56
|
"devDependencies": {
|
|
@@ -61,7 +64,7 @@
|
|
|
61
64
|
"@web/test-runner": "^0.18.2",
|
|
62
65
|
"concurrently": "^8.2.2",
|
|
63
66
|
"tslib": "^2.6.3",
|
|
64
|
-
"typescript": "^5.
|
|
67
|
+
"typescript": "^5.7.2"
|
|
65
68
|
},
|
|
66
69
|
"customElements": "custom-elements.json",
|
|
67
70
|
"publishConfig": {
|