From 04f9d3ba3b4458a0461ecc3b532b182884abbefd Mon Sep 17 00:00:00 2001 From: Ivan Date: Sat, 10 Aug 2024 01:12:11 +0200 Subject: [PATCH 1/4] fix: Calendar passthrough type definition --- components/doc/common/apidoc/index.json | 2 +- components/lib/calendar/calendar.d.ts | 6 ++---- 2 files changed, 3 insertions(+), 5 deletions(-) diff --git a/components/doc/common/apidoc/index.json b/components/doc/common/apidoc/index.json index 91e47b2d6b..15dfcc9214 100644 --- a/components/doc/common/apidoc/index.json +++ b/components/doc/common/apidoc/index.json @@ -7120,7 +7120,7 @@ "name": "input", "optional": true, "readonly": false, - "type": "InputTextPassThroughOptions", + "type": "CalendarPassThroughType>", "description": "Uses to pass attributes to the InputText component." }, { diff --git a/components/lib/calendar/calendar.d.ts b/components/lib/calendar/calendar.d.ts index ba6c06be0a..bdc34efcfb 100644 --- a/components/lib/calendar/calendar.d.ts +++ b/components/lib/calendar/calendar.d.ts @@ -11,7 +11,7 @@ import * as React from 'react'; import { CSSTransitionProps as ReactCSSTransitionProps } from 'react-transition-group/CSSTransition'; import { ComponentHooks } from '../componentbase/componentbase'; import { CSSTransitionProps } from '../csstransition'; -import { InputText, InputTextPassThroughOptions } from '../inputtext/inputtext'; +import { InputText } from '../inputtext/inputtext'; import { PassThroughOptions } from '../passthrough'; import { TooltipOptions } from '../tooltip/tooltipoptions'; import { FormEvent, Nullable } from '../ts-helpers'; @@ -40,12 +40,10 @@ export interface CalendarPassThroughOptions { root?: CalendarPassThroughType>; /** * Uses to pass attributes to the InputText component. - * @see {@link CalendarPassThroughType} */ - input?: InputTextPassThroughOptions; + input?: CalendarPassThroughType>; /** * Uses to pass attributes to the Button component. - * @see {@link CalendarPassThroughType} */ dropdownButton?: CalendarPassThroughType>; /** From ef17d308dbdf46303b1d64dacd3a0ef332e0965b Mon Sep 17 00:00:00 2001 From: Ivan Date: Sat, 10 Aug 2024 01:13:13 +0200 Subject: [PATCH 2/4] fix: Calendar unstyled theme doc --- components/doc/calendar/theming/tailwinddoc.js | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/components/doc/calendar/theming/tailwinddoc.js b/components/doc/calendar/theming/tailwinddoc.js index 2b8cbf948a..b4929d68d0 100644 --- a/components/doc/calendar/theming/tailwinddoc.js +++ b/components/doc/calendar/theming/tailwinddoc.js @@ -24,14 +24,14 @@ const Tailwind = { 'opacity-60 select-none pointer-events-none cursor-default': props.disabled }) }), - input: { - root: ({ parent }) => ({ + input: ({ props }) => ({ + root: { className: classNames('font-sans text-base text-gray-600 dark:text-white/80 bg-white dark:bg-gray-900 p-3 border border-gray-300 dark:border-blue-900/40 transition-colors duration-200 appearance-none', 'hover:border-blue-500', { - 'rounded-lg': !parent.props.showIcon, - 'border-r-0 rounded-l-lg': parent.props.showIcon + 'rounded-lg': !props.showIcon, + 'border-r-0 rounded-l-lg': props.showIcon }) - }) - }, + } + }), dropdownButton: { root: ({ props }) => ({ className: classNames({ 'rounded-l-none': props.icon }) From 792f983fbf9da69386aa357c9e09f7370331edf3 Mon Sep 17 00:00:00 2001 From: Ivan Date: Sat, 10 Aug 2024 01:38:57 +0200 Subject: [PATCH 3/4] fix: Calendar passthrough type definition --- components/lib/calendar/calendar.d.ts | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/components/lib/calendar/calendar.d.ts b/components/lib/calendar/calendar.d.ts index bdc34efcfb..b2debf0f9f 100644 --- a/components/lib/calendar/calendar.d.ts +++ b/components/lib/calendar/calendar.d.ts @@ -11,7 +11,6 @@ import * as React from 'react'; import { CSSTransitionProps as ReactCSSTransitionProps } from 'react-transition-group/CSSTransition'; import { ComponentHooks } from '../componentbase/componentbase'; import { CSSTransitionProps } from '../csstransition'; -import { InputText } from '../inputtext/inputtext'; import { PassThroughOptions } from '../passthrough'; import { TooltipOptions } from '../tooltip/tooltipoptions'; import { FormEvent, Nullable } from '../ts-helpers'; @@ -1078,9 +1077,9 @@ export declare class Calendar extends React.Component { public getElement(): HTMLSpanElement; /** * Used to get input element. - * @return {InputText} Input element + * @return {HTMLInputElement} Input element */ - public getInput(): typeof InputText; + public getInput(): HTMLInputElement; /** * Used to get overlay element. * @return {HTMLElement} Overlay element From bb8e235f50f0e797bde9feebaba038482cfd716b Mon Sep 17 00:00:00 2001 From: Ivan Date: Sat, 10 Aug 2024 01:48:22 +0200 Subject: [PATCH 4/4] fix: Calendar unstyled theme doc --- .../doc/calendar/theming/tailwinddoc.js | 22 +++++++++---------- 1 file changed, 11 insertions(+), 11 deletions(-) diff --git a/components/doc/calendar/theming/tailwinddoc.js b/components/doc/calendar/theming/tailwinddoc.js index b4929d68d0..907058522a 100644 --- a/components/doc/calendar/theming/tailwinddoc.js +++ b/components/doc/calendar/theming/tailwinddoc.js @@ -53,7 +53,7 @@ const Tailwind = { 'hover:text-gray-700 dark:hover:text-white/80 hover:border-transparent hover:bg-gray-200 dark:hover:bg-gray-800/80 ' ) }, - title: 'leading-8 mx-auto', + title: { className: 'leading-8 mx-auto' }, monthTitle: { className: classNames('text-gray-700 dark:text-white/80 transition duration-200 font-semibold p-2', 'mr-2', 'hover:text-blue-500') }, @@ -70,9 +70,9 @@ const Tailwind = { table: { className: classNames('border-collapse w-full', 'my-2') }, - tableHeaderCell: 'p-2', - weekday: 'text-gray-600 dark:text-white/70', - day: 'p-2', + tableHeaderCell: { className: 'p-2' }, + weekday: { className: 'text-gray-600 dark:text-white/70' }, + day: { className: 'p-2' }, dayLabel: ({ context }) => ({ className: classNames( 'w-10 h-10 rounded-full transition-shadow duration-200 border-transparent border', @@ -88,7 +88,7 @@ const Tailwind = { } ) }), - monthPicker: 'my-2', + monthPicker: { className: 'my-2' }, month: ({ context }) => ({ className: classNames( 'w-1/3 inline-flex items-center justify-center cursor-pointer overflow-hidden relative', @@ -114,11 +114,11 @@ const Tailwind = { timePicker: { className: classNames('flex justify-center items-center', 'border-t-1 border-solid border-gray-300 p-2') }, - separatorContainer: 'flex items-center flex-col px-2', - separator: 'text-xl', - hourPicker: 'flex items-center flex-col px-2', - minutePicker: 'flex items-center flex-col px-2', - ampmPicker: 'flex items-center flex-col px-2', + separatorContainer: { className: 'flex items-center flex-col px-2' }, + separator: { className: 'text-xl' }, + hourPicker: { className: 'flex items-center flex-col px-2' }, + minutePicker: { className: 'flex items-center flex-col px-2' }, + ampmPicker: { className: 'flex items-center flex-col px-2' }, incrementButton: { className: classNames( 'flex items-center justify-center cursor-pointer overflow-hidden relative', @@ -133,7 +133,7 @@ const Tailwind = { 'hover:text-gray-700 dark:hover:text-white/80 hover:border-transparent hover:bg-gray-200 dark:hover:bg-gray-800/80 ' ) }, - groupContainer: 'flex', + groupContainer: { className: 'flex' }, group: { className: classNames('flex-1', 'border-l border-gray-300 pr-0.5 pl-0.5 pt-0 pb-0', 'first:pl-0 first:border-l-0') },