inviton-powerduck 0.0.182 → 0.0.183

package/components/input/daterange-picker.tsx

@@ -1,3 +1,5 @@
+/* eslint-disable no-useless-call */
+/* eslint-disable ts/no-this-alias */
 import type { DropdownButtonItemArgs } from '../dropdown-button/dropdown-button-item';
 import type { FormItemWrapperArgs, MarginType } from '../form/form-item-wrapper';
 import { Temporal } from '@js-temporal/polyfill';
@@ -47,6 +49,7 @@ interface DaterangePickerArgs extends FormItemWrapperArgs {
 	minDate?: Temporal.PlainDateTime;
 	alwaysOpen?: boolean;
 	singleDate?: boolean;
+	pickerRootCssClass?: string
 	maxDate?: Temporal.PlainDateTime;
 	prevIcon?: string;
 	nextIcon?: string;
@@ -71,6 +74,7 @@ export interface DaterangeChangedArgs {
 }
 
 const DATE_FORMAT_FOR_RANGE_PICKER = (() => {
+	// eslint-disable-next-line no-restricted-syntax
 	const dummyDate = new Date(Date.UTC(
 		2022,
 		11,
@@ -101,6 +105,7 @@ class DaterangePickerComponent extends TsxComponent<DaterangePickerArgs> impleme
 	@Prop() inputReadOnly?: boolean;
 	@Prop() alwaysOpen!: boolean;
 	@Prop() singleDate!: boolean;
+	@Prop() pickerRootCssClass!: string
 	@Prop() wrap!: boolean;
 	@Prop() hint: string;
 	@Prop() appendIcon: string;
@@ -239,6 +244,7 @@ class DaterangePickerComponent extends TsxComponent<DaterangePickerArgs> impleme
 			singleMonth: singleMonth == true,
 			alwaysOpen: alwaysOpen == true,
 			singleDate: this.singleDate == true,
+			rootCssClass: this.pickerRootCssClass,
 			startOfWeek: DateInputHelper.getStartOfWeek() == 0 ? 'sunday' : 'monday',
 			separator: self.getSeparator(),
 			hideYearInMonthName: this.hideYearInMonthName == true,
@@ -253,9 +259,7 @@ class DaterangePickerComponent extends TsxComponent<DaterangePickerArgs> impleme
 			maxDaysTooltip: this.maxDaysTooltip,
 			calendarPlacement,
 			container,
-			displayMode: () => {
-				return 'below-input';
-			},
+			displayMode: () => 'below-input',
 			leftOffset: () => {
 				if (this.prependIcon == null) {
 					return 0;

package/components/input/plugins/daterangepicker/daterangepicker.css

@@ -169,7 +169,7 @@
 	height: 20px;
 }
 
-.date-range-picker-wrapper .month-wrapper > table {
+.date-range-picker-wrapper .month-wrapper>table {
 	padding-top: 15px;
 }
 
@@ -557,7 +557,7 @@
 	border-right: 0.667px solid #dfe3f1;
 }
 
-.date-range-picker-wrapper .month-wrapper table td > div {
+.date-range-picker-wrapper .month-wrapper table td>div {
 	background-color: inherit !important;
 	line-height: 1.9;
 	margin-left: 5px;
@@ -626,21 +626,8 @@
 }
 
 .date-range-picker-wrapper table .caption,
-.daterangepicker-modal
-	.date-range-picker-root.inline-wrapper.drpc-inline
-	.month-wrapper
-	.month-wrapper-inner-common
-	table
-	th
-	> span.select-wrapper,
-.daterangepicker-modal
-	.date-range-picker-root.inline-wrapper.drpc-inline
-	.month-wrapper
-	.month-wrapper-inner-common
-	table
-	th
-	> span.select-wrapper
-	select {
+.daterangepicker-modal .date-range-picker-root.inline-wrapper.drpc-inline .month-wrapper .month-wrapper-inner-common table th>span.select-wrapper,
+.daterangepicker-modal .date-range-picker-root.inline-wrapper.drpc-inline .month-wrapper .month-wrapper-inner-common table th>span.select-wrapper select {
 	height: 40px;
 	color: #393562;
 	height: 36px;
@@ -667,65 +654,25 @@
 
 .daterangepicker-dummy-row-item {
 	visibility: hidden;
-	pointer-events: none;
 }
 
-.daterangepicker-modal .date-range-picker-root.inline-wrapper.drpc-inline .month-wrapper .month-wrapper-inner-common {
-}
+.daterangepicker-modal .date-range-picker-root.inline-wrapper.drpc-inline .month-wrapper .month-wrapper-inner-common {}
 
-.daterangepicker-modal
-	.date-range-picker-root.inline-wrapper.drpc-inline
-	.month-wrapper
-	.month-wrapper-inner-common
-	table {
+.daterangepicker-modal .date-range-picker-root.inline-wrapper.drpc-inline .month-wrapper .month-wrapper-inner-common table {
 	width: 100%;
 }
 
-.daterangepicker-modal
-	.date-range-picker-root.inline-wrapper.drpc-inline
-	.month-wrapper
-	.month-wrapper-inner-common
-	table
-	td,
-.daterangepicker-modal
-	.date-range-picker-root.inline-wrapper.drpc-inline
-	.month-wrapper
-	.month-wrapper-inner-common
-	table
-	th {
+.daterangepicker-modal .date-range-picker-root.inline-wrapper.drpc-inline .month-wrapper .month-wrapper-inner-common table td,
+.daterangepicker-modal .date-range-picker-root.inline-wrapper.drpc-inline .month-wrapper .month-wrapper-inner-common table th {
 	width: 99999px;
 	text-align: center;
 	font-weight: 400;
 }
 
-.daterangepicker-modal
-	.date-range-picker-root.inline-wrapper.drpc-inline
-	.month-wrapper
-	.month-wrapper-inner-common
-	table
-	td
-	> div,
-.daterangepicker-modal
-	.date-range-picker-root.inline-wrapper.drpc-inline
-	.month-wrapper
-	.month-wrapper-inner-common
-	table
-	th
-	> div,
-.daterangepicker-modal
-	.date-range-picker-root.inline-wrapper.drpc-inline
-	.month-wrapper
-	.month-wrapper-inner-common
-	table
-	td
-	> span,
-.daterangepicker-modal
-	.date-range-picker-root.inline-wrapper.drpc-inline
-	.month-wrapper
-	.month-wrapper-inner-common
-	table
-	th
-	> span {
+.daterangepicker-modal .date-range-picker-root.inline-wrapper.drpc-inline .month-wrapper .month-wrapper-inner-common table td>div,
+.daterangepicker-modal .date-range-picker-root.inline-wrapper.drpc-inline .month-wrapper .month-wrapper-inner-common table th>div,
+.daterangepicker-modal .date-range-picker-root.inline-wrapper.drpc-inline .month-wrapper .month-wrapper-inner-common table td>span,
+.daterangepicker-modal .date-range-picker-root.inline-wrapper.drpc-inline .month-wrapper .month-wrapper-inner-common table th>span {
 	margin: 0;
 	margin: auto;
 	font-size: 14px;
@@ -748,4 +695,4 @@
 	bottom: 0;
 	height: auto !important;
 	opacity: 0.001;
-}
+}

package/components/input/plugins/daterangepicker/jquery.daterangepicker.ts

@@ -386,6 +386,7 @@ import { globalState } from '../../../../app/global-state';
 		// attribute bags for day cells are unknown
 		dayDivAttrs: any[];
 		dayTdAttrs: any[];
+		rootCssClass: string
 
 		selectForward: boolean;
 		selectBackward: boolean;
@@ -2551,7 +2552,7 @@ import { globalState } from '../../../../app/global-state';
 		}
 
 		function createDom() {
-			let html = '<div class="date-range-picker-root"><div class="drpc-modal-close-button">x</div><div class="date-range-picker-wrapper';
+			let html = '<div class="date-range-picker-root ' + (opt.rootCssClass || '') + '"><div class="drpc-modal-close-button">x</div><div class="date-range-picker-wrapper';
 			if (opt.extraClass) { html += ` ${opt.extraClass} `; }
 
 			if (opt.singleDate) { html += ' single-date '; }

package/package.json

@@ -1,7 +1,7 @@
 {
 	"name": "inviton-powerduck",
 	"type": "module",
-	"version": "0.0.182",
+	"version": "0.0.183",
 	"files": [
 		"app/",
 		"common/",