commonscomputer/cal.diy
4
0
Fork 0
Code Issues Pull Requests Actions 2.2k Packages Projects Releases Wiki Activity

#4306: Added darkmode support for select by styling via tailwind (#4824)

Browse Source 
Co-authored-by: Peer Richelsen <peeroke@gmail.com>
Co-authored-by: Hariom Balhara <hariombalhara@gmail.com>
Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>
This commit is contained in:
Jeroen Reumkens
2022-10-10 18:50:43 +00:00
committed by GitHub
co-authored by Peer Richelsen Hariom Balhara kodiakhq[bot]
parent 4fcdc7bf5c
commit 7ed21b692e
20 changed files with 273 additions and 181 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/web/components/booking/TimeOptions.tsx
+1 -1
View File
@@ -1,8 +1,8 @@
import { FC, useEffect, useState } from "react";
import { useLocale } from "@calcom/lib/hooks/useLocale";
import TimezoneSelect, { ITimezoneOption } from "@calcom/ui/form/TimezoneSelect";
import { Switch } from "@calcom/ui/v2";
import TimezoneSelect, { ITimezoneOption } from "@calcom/ui/v2/core/TimezoneSelect";
import { is24h, timeZone } from "../../lib/clock";
apps/web/components/v2/apps/AdditionalCalendarSelector.tsx
+1 -17
View File
@@ -1,5 +1,4 @@
import React from "react";
import Select from "react-select";
import { OptionProps } from "react-select";
import { InstallAppButton } from "@calcom/app-store/components";
@@ -8,6 +7,7 @@ import { trpc } from "@calcom/trpc/react";
import type { App } from "@calcom/types/App";
import { Button } from "@calcom/ui";
import { Icon } from "@calcom/ui/Icon";
import { Select } from "@calcom/ui/v2";
import { QueryCell } from "@lib/QueryCell";
@@ -65,23 +65,7 @@ const AdditionalCalendarSelector = ({ isLoading }: AdditionalCalendarSelectorPro
name="additionalCalendar"
placeholder={t("install_another")}
options={options}
styles={{
placeholder: (defaultStyles) => {
return {
...defaultStyles,
color: "#3E3E3E",
marginLeft: "3px",
};
},
control: (defaultStyles) => {
return {
...defaultStyles,
borderRadius: "6px",
};
},
}}
isSearchable={false}
className="min-w-52 block w-full flex-1 rounded-none rounded-r-sm border-gray-300 text-sm font-medium text-gray-700"
isLoading={isLoading}
components={{ Option: ImageOption }}
/>
apps/web/components/v2/eventtype/AvailabilityTab.tsx
+1 -1
View File
@@ -8,7 +8,7 @@ import { weekdayNames } from "@calcom/lib/weekday";
import { trpc } from "@calcom/trpc/react";
import { Icon } from "@calcom/ui";
import Button from "@calcom/ui/v2/core/Button";
import Select from "@calcom/ui/v2/core/form/Select";
import Select from "@calcom/ui/v2/core/form/select";
import { SkeletonText } from "@calcom/ui/v2/core/skeleton";
import { SelectSkeletonLoader } from "@components/v2/availability/SkeletonLoader";
apps/web/pages/v2/availability/[schedule].tsx
+1 -1
View File
@@ -12,10 +12,10 @@ import { trpc } from "@calcom/trpc/react";
import useMeQuery from "@calcom/trpc/react/hooks/useMeQuery";
import type { Schedule as ScheduleType } from "@calcom/types/schedule";
import { Icon } from "@calcom/ui";
import TimezoneSelect from "@calcom/ui/form/TimezoneSelect";
import Button from "@calcom/ui/v2/core/Button";
import Shell from "@calcom/ui/v2/core/Shell";
import Switch from "@calcom/ui/v2/core/Switch";
import TimezoneSelect from "@calcom/ui/v2/core/TimezoneSelect";
import VerticalDivider from "@calcom/ui/v2/core/VerticalDivider";
import { Form, Label } from "@calcom/ui/v2/core/form/fields";
import showToast from "@calcom/ui/v2/core/notifications";
apps/web/pages/v2/settings/my-account/general.tsx
+1 -1
View File
@@ -8,8 +8,8 @@ import { inferQueryOutput, trpc } from "@calcom/trpc/react";
import { Button } from "@calcom/ui/v2/core/Button";
import Meta from "@calcom/ui/v2/core/Meta";
import TimezoneSelect from "@calcom/ui/v2/core/TimezoneSelect";
import Select from "@calcom/ui/v2/core/form/Select";
import { Form, Label } from "@calcom/ui/v2/core/form/fields";
import Select from "@calcom/ui/v2/core/form/select";
import { getLayout } from "@calcom/ui/v2/core/layouts/SettingsLayout";
import showToast from "@calcom/ui/v2/core/notifications";
import { SkeletonContainer, SkeletonText, SkeletonButton } from "@calcom/ui/v2/core/skeleton";
apps/web/styles/globals.css
-5
View File
@@ -197,11 +197,6 @@ button[role="switch"][data-state="checked"] {
box-shadow: 0 0 0 4px rgba(0, 0, 0, 0.2);
}
/* React Select V2 */
.cal-react-select-container .cal-react-select__control {
@apply bg-white min-h-[36px] h-[36px] text-sm leading-4 border-gray-300 hover:border-neutral-400 focus-within:ring-2 focus-within:ring-neutral-800 focus-within:border-0 placeholder:text-gray-400 placeholder:text-sm placeholder:font-normal;
}
}
/* !important to style multi-email input */
packages/app-store/ee/routing-forms/pages/routing-link/[...appPages].tsx
+5 -1
View File
@@ -170,7 +170,11 @@ function RoutingForm({ form, profile }: inferSSRProps<typeof getServerSideProps>
);
})}
<div className="mt-4 flex justify-end space-x-2 rtl:space-x-reverse">
<Button loading={responseMutation.isLoading} type="submit" color="primary">
<Button
className="dark:bg-darkmodebrand dark:text-darkmodebrandcontrast dark:hover:border-darkmodebrandcontrast dark:border-transparent"
loading={responseMutation.isLoading}
type="submit"
color="primary">
{t("submit")}
</Button>
</div>
packages/config/package.json
+1
View File
@@ -26,6 +26,7 @@
"eslint": "^8.22.0",
"prettier": "^2.7.1",
"prettier-plugin-tailwindcss": "^0.1.13",
"tailwind-scrollbar": "^2.0.1",
"tailwindcss": "^3.1.8",
"typescript": "^4.7.4"
}
packages/config/tailwind-preset.js
+4
View File
@@ -209,6 +209,7 @@ module.exports = {
require("@tailwindcss/forms"),
require("@tailwindcss/typography"),
require("@tailwindcss/line-clamp"),
require("tailwind-scrollbar"),
require("tailwindcss-radix")(),
plugin(({ addVariant }) => {
addVariant("mac", ".mac &");
@@ -216,4 +217,7 @@ module.exports = {
addVariant("ios", ".ios &");
}),
],
variants: {
scrollbar: ["rounded", "dark"],
},
};
packages/features/ee/workflows/components/v2/WorkflowStepContainer.tsx
+1 -1
View File
@@ -19,8 +19,8 @@ import { Icon } from "@calcom/ui/Icon";
import PhoneInput from "@calcom/ui/form/PhoneInputLazy";
import { Button, DialogClose, DialogContent } from "@calcom/ui/v2";
import ConfirmationDialogContent from "@calcom/ui/v2/core/ConfirmationDialogContent";
import Select from "@calcom/ui/v2/core/form/Select";
import { EmailField, Label, TextArea } from "@calcom/ui/v2/core/form/fields";
import Select from "@calcom/ui/v2/core/form/select";
import { AddVariablesDropdown } from "../../components/v2/AddVariablesDropdown";
import {
packages/features/webhooks/components/WebhookForm.tsx
+1 -1
View File
@@ -8,8 +8,8 @@ import { useLocale } from "@calcom/lib/hooks/useLocale";
import { inferQueryOutput } from "@calcom/trpc/react";
import Button from "@calcom/ui/v2/core/Button";
import Switch from "@calcom/ui/v2/core/Switch";
import Select from "@calcom/ui/v2/core/form/Select";
import { Form, Label, TextArea, TextField } from "@calcom/ui/v2/core/form/fields";
import Select from "@calcom/ui/v2/core/form/select";
import customTemplate, { hasTemplateIntegration } from "../utils/integrationTemplate";
import WebhookTestDisclosure from "./WebhookTestDisclosure";
packages/ui/form/TimezoneSelect.tsx
+1 -1
View File
@@ -7,7 +7,7 @@ import BaseSelect, {
Props as SelectProps,
} from "react-timezone-select";
import { InputComponent } from "@calcom/ui/v2/core/form/Select";
import { InputComponent } from "@calcom/ui/v2/core/form/select/components";
function TimezoneSelect({ className, ...props }: SelectProps) {
// @TODO: remove borderRadius and haveRoundedClassName logic from theme so we use only new style
packages/ui/v2/core/TimezoneSelect.tsx
+8 -31
View File
@@ -1,5 +1,4 @@
import classNames from "classnames";
import { components } from "react-select";
import { useMemo } from "react";
import BaseSelect, {
allTimezones,
ITimezoneOption,
@@ -7,42 +6,20 @@ import BaseSelect, {
Props as SelectProps,
} from "react-timezone-select";
import { InputComponent } from "./form/Select";
import { getReactSelectProps } from "@calcom/ui/v2/core/form/select";
function TimezoneSelect({ className, components, ...props }: SelectProps) {
const reactSelectProps = useMemo(() => {
return getReactSelectProps({ className, components: components || {} });
}, [className, components]);
function TimezoneSelect({ className, ...props }: SelectProps) {
return (
<BaseSelect
theme={(theme) => ({
...theme,
borderRadius: 6,
colors: {
...theme.colors,
primary: "var(--brand-color)",
primary50: "rgba(209 , 213, 219, var(--tw-bg-opacity))",
primary25: "rgba(244, 245, 246, var(--tw-bg-opacity))",
},
})}
styles={{
option: (provided, state) => ({
...provided,
color: state.isSelected ? "var(--brand-text-color)" : "black",
":active": {
backgroundColor: state.isSelected ? "" : "var(--brand-color)",
color: "var(--brand-text-color)",
},
}),
}}
{...reactSelectProps}
timezones={{
...allTimezones,
"America/Asuncion": "Asuncion",
}}
components={{
...components,
IndicatorSeparator: () => null,
Input: InputComponent,
}}
className={classNames("text-sm", className)}
{...props}
/>
);
packages/ui/v2/core/form/MultiSelectCheckboxes.tsx
+8 -20
View File
@@ -5,7 +5,7 @@ import { Props } from "react-select";
import { classNames } from "@calcom/lib";
import { useLocale } from "@calcom/lib/hooks/useLocale";
import Select from "./Select";
import Select from "./select";
export type Option = {
value: string;
@@ -18,22 +18,21 @@ const InputOption: React.FC<OptionProps<any, boolean, GroupBase<any>>> = ({
isSelected,
children,
innerProps,
className,
...rest
}) => {
const style = {
alignItems: "center",
backgroundColor: isFocused ? "rgba(244, 245, 246, var(--tw-bg-opacity))" : "transparent",
color: "inherit",
display: "flex ",
};
const props = {
...innerProps,
style,
};
return (
<components.Option
className={classNames(
className,
"dark:bg-darkgray-100 text-[inherit] !flex !cursor-pointer !py-3",
isFocused && "dark:!bg-darkgray-200 !bg-gray-100",
isSelected && "dark:!bg-darkgray-300 !bg-neutral-900"
)}
{...rest}
isDisabled={isDisabled}
isFocused={isFocused}
@@ -75,17 +74,6 @@ export default function MultiSelectCheckboxes({
return (
<Select
theme={(theme) => ({
...theme,
borderRadius: 6,
colors: {
...theme.colors,
primary: "var(--brand-color)",
primary50: "rgba(209 , 213, 219, var(--tw-bg-opacity))",
primary25: "rgba(244, 245, 246, var(--tw-bg-opacity))",
},
})}
value={selected}
onChange={(s: any) => {
setSelected(s);
packages/ui/v2/core/form/index.ts
+1 -1
View File
@@ -2,6 +2,6 @@ export * from "./radio-area";
export * from "./fields";
export { default as Checkbox } from "./Checkbox";
export { default as DatePicker } from "./DatePicker";
export { default as Select, SelectWithValidation, SelectField } from "./Select";
export { default as Select, SelectWithValidation, SelectField, getReactSelectProps } from "./select";
export { default as FormStep } from "./FormStep";
packages/ui/v2/core/form/Select.tsx → packages/ui/v2/core/form/select/Select.tsx
+57 -81
View File
@@ -1,20 +1,28 @@
import { useId } from "@radix-ui/react-id";
import * as React from "react";
import ReactSelect, {
components,
components as reactSelectComponents,
GroupBase,
InputProps,
Props,
SingleValue,
MultiValue,
OptionProps,
SelectComponentsConfig,
} from "react-select";
import classNames from "@calcom/lib/classNames";
import { useLocale } from "@calcom/lib/hooks/useLocale";
import { Icon } from "@calcom/ui/Icon";
import { Label } from "./fields";
import { Label } from "../fields";
import {
ControlComponent,
InputComponent,
MenuComponent,
MenuListComponent,
OptionComponent,
SingleValueComponent,
ValueContainerComponent,
MultiValueComponent,
} from "./components";
export type SelectProps<
Option,
@@ -22,85 +30,53 @@ export type SelectProps<
Group extends GroupBase<Option> = GroupBase<Option>
> = Props<Option, IsMulti, Group>;
export const InputComponent = <Option, IsMulti extends boolean, Group extends GroupBase<Option>>({
inputClassName,
...props
}: InputProps<Option, IsMulti, Group>) => {
return (
<components.Input
// disables our default form focus hightlight on the react-select input element
inputClassName={classNames("focus:ring-0 focus:ring-offset-0", inputClassName)}
{...props}
/>
);
};
const OptionComponent = <Option, IsMulti extends boolean, Group extends GroupBase<Option>>({
className,
...props
}: OptionProps<Option, IsMulti, Group>) => {
return (
<components.Option className={classNames("!flex justify-between", className)} {...props}>
<span>{props.label}</span> {props.isSelected && <Icon.FiCheck className="h-5 w-5" />}
</components.Option>
);
};
function Select<
export const getReactSelectProps = <
Option,
IsMulti extends boolean = false,
Group extends GroupBase<Option> = GroupBase<Option>
>({ className, ...props }: SelectProps<Option, IsMulti, Group>) {
return (
<ReactSelect
className={classNames(
"cal-react-select-container block h-[36px] w-full min-w-0 flex-1 rounded-md text-sm",
className
)}
classNamePrefix="cal-react-select"
theme={(theme) => ({
...theme,
borderRadius: 6,
colors: {
...theme.colors,
primary: "rgba(229, 231, 235, var(--tw-bg-opacity))",
primary50: "rgba(209 , 213, 219, var(--tw-bg-opacity))",
primary25: "rgba(244, 245, 246, var(--tw-bg-opacity))",
},
})}
styles={{
control: (base) => ({
...base,
// Brute force to remove focus outline of input
"& .react-select__input": {
borderWidth: 0,
boxShadow: "none",
},
}),
option: (provided, state) => ({
...provided,
color: "black",
":active": {
backgroundColor: state.isSelected ? "" : "rgba(229, 231, 235, var(--tw-bg-opacity))",
color: "rgba(51, 15, 51, var(--tw-bg-opacity))",
},
}),
}}
components={{
...components,
IndicatorSeparator: () => null,
Input: InputComponent,
Option: OptionComponent,
...props.components,
}}
{...props}
/>
);
}
>({
className,
components,
}: {
className?: string;
components: SelectComponentsConfig<Option, IsMulti, Group>;
}) => ({
className: classNames("block h-[36px] w-full min-w-0 flex-1 rounded-md", className),
classNamePrefix: "cal-react-select",
components: {
...reactSelectComponents,
IndicatorSeparator: () => null,
Input: InputComponent,
Option: OptionComponent,
Control: ControlComponent,
SingleValue: SingleValueComponent,
Menu: MenuComponent,
MenuList: MenuListComponent,
ValueContainer: ValueContainerComponent,
MultiValue: MultiValueComponent,
...components,
},
});
const Select = <
Option,
IsMulti extends boolean = false,
Group extends GroupBase<Option> = GroupBase<Option>
>({
className,
components,
...props
}: SelectProps<Option, IsMulti, Group>) => {
const reactSelectProps = React.useMemo(() => {
return getReactSelectProps<Option, IsMulti, Group>({ className, components: components || {} });
}, [className, components]);
return <ReactSelect {...reactSelectProps} {...props} />;
};
export const SelectField = function SelectField<
Option,
isMulti extends boolean = false,
IsMulti extends boolean = false,
Group extends GroupBase<Option> = GroupBase<Option>
>(
props: {
@@ -110,7 +86,7 @@ export const SelectField = function SelectField<
labelProps?: React.ComponentProps<typeof Label>;
className?: string;
error?: string;
} & SelectProps<Option, isMulti, Group>
} & SelectProps<Option, IsMulti, Group>
) {
const { t } = useLocale();
const { label = t(props.name || ""), containerClassName, labelProps, className, ...passThrough } = props;
@@ -134,14 +110,14 @@ export const SelectField = function SelectField<
*/
export function SelectWithValidation<
Option extends { label: string; value: string },
isMulti extends boolean = false,
IsMulti extends boolean = false,
Group extends GroupBase<Option> = GroupBase<Option>
>({
required = false,
onChange,
value,
...remainingProps
}: SelectProps<Option, isMulti, Group> & { required?: boolean }) {
}: SelectProps<Option, IsMulti, Group> & { required?: boolean }) {
const [hiddenInputValue, _setHiddenInputValue] = React.useState(() => {
if (value instanceof Array || !value) {
return;
packages/ui/v2/core/form/select/components.tsx
+159
View File
@@ -0,0 +1,159 @@
import {
components as reactSelectComponents,
ControlProps,
GroupBase,
InputProps,
MenuListProps,
MenuProps,
MultiValueProps,
OptionProps,
SingleValueProps,
ValueContainerProps,
} from "react-select";
import { classNames } from "@calcom/lib";
import { Icon } from "@calcom/ui/Icon";
export const InputComponent = <
Option,
IsMulti extends boolean = false,
Group extends GroupBase<Option> = GroupBase<Option>
>({
inputClassName,
...props
}: InputProps<Option, IsMulti, Group>) => {
return (
<reactSelectComponents.Input
// disables our default form focus hightlight on the react-select input element
inputClassName={classNames(
"focus:ring-0 focus:ring-offset-0 dark:!text-darkgray-900 !text-black",
inputClassName
)}
{...props}
/>
);
};
export const OptionComponent = <
Option,
IsMulti extends boolean = false,
Group extends GroupBase<Option> = GroupBase<Option>
>({
className,
...props
}: OptionProps<Option, IsMulti, Group>) => {
return (
<reactSelectComponents.Option
{...props}
className={classNames(
className,
"dark:bg-darkgray-100 !flex !cursor-pointer justify-between !py-3",
props.isFocused && "dark:!bg-darkgray-200 !bg-gray-100",
props.isSelected && "dark:!bg-darkgray-300 !bg-neutral-900"
)}>
<span>{props.label}</span> {props.isSelected && <Icon.FiCheck className="h-4 w-4" />}
</reactSelectComponents.Option>
);
};
export const ControlComponent = <
Option,
IsMulti extends boolean = false,
Group extends GroupBase<Option> = GroupBase<Option>
>({
className,
...props
}: ControlProps<Option, IsMulti, Group>) => (
<reactSelectComponents.Control
{...props}
className={classNames(
className,
"dark:bg-darkgray-100 dark:border-darkgray-300 border-gray-300 bg-white text-sm leading-4 placeholder:text-sm placeholder:font-normal focus-within:border-0 focus-within:ring-2 focus-within:ring-neutral-800 hover:border-neutral-400 dark:focus-within:ring-white"
)}
/>
);
export const SingleValueComponent = <
Option,
IsMulti extends boolean = false,
Group extends GroupBase<Option> = GroupBase<Option>
>({
className,
...props
}: SingleValueProps<Option, IsMulti, Group>) => (
<reactSelectComponents.SingleValue
{...props}
className={classNames(
className,
"dark:text-darkgray-900 dark:placeholder:text-darkgray-500 text-black placeholder:text-gray-400"
)}
/>
);
export const ValueContainerComponent = <
Option,
IsMulti extends boolean = false,
Group extends GroupBase<Option> = GroupBase<Option>
>({
className,
...props
}: ValueContainerProps<Option, IsMulti, Group>) => (
<reactSelectComponents.ValueContainer
{...props}
className={classNames(
"dark:text-darkgray-900 dark:placeholder:text-darkgray-500 text-black placeholder:text-gray-400",
className
)}
/>
);
export const MultiValueComponent = <
Option,
IsMulti extends boolean = false,
Group extends GroupBase<Option> = GroupBase<Option>
>({
className,
...props
}: MultiValueProps<Option, IsMulti, Group>) => (
<reactSelectComponents.MultiValue
{...props}
className={classNames(
"dark:bg-darkgray-200 dark:text-darkgray-900 !rounded-md bg-gray-100 text-gray-700",
className
)}
/>
);
export const MenuComponent = <
Option,
IsMulti extends boolean = false,
Group extends GroupBase<Option> = GroupBase<Option>
>({
className,
...props
}: MenuProps<Option, IsMulti, Group>) => (
<reactSelectComponents.Menu
{...props}
className={classNames(
"dark:bg-darkgray-100 dark:border-darkgray-300 border-1 !rounded-md border-gray-900 bg-white text-sm leading-4 dark:text-white",
className
)}
/>
);
export const MenuListComponent = <
Option,
IsMulti extends boolean = false,
Group extends GroupBase<Option> = GroupBase<Option>
>({
className,
...props
}: MenuListProps<Option, IsMulti, Group>) => (
<reactSelectComponents.MenuList
{...props}
className={classNames(
"scrollbar-thin scrollbar-thumb-rounded-md dark:scrollbar-thumb-darkgray-300 scrollbar-thumb-gray-300 scrollbar-track-transparent scrollbar-track-w-[80px] rounded-md",
className
)}
/>
);
packages/ui/v2/core/form/select/index.ts
+4
View File
@@ -0,0 +1,4 @@
import Select from "./Select";
export default Select;
export { SelectWithValidation, SelectField, getReactSelectProps } from "./Select";
packages/ui/v2/modules/event-types/DestinationCalendarSelector.tsx
+1 -1
View File
@@ -4,7 +4,7 @@ import React, { useEffect, useState } from "react";
import { useLocale } from "@calcom/lib/hooks/useLocale";
import { DestinationCalendar } from "@calcom/prisma/client";
import { trpc } from "@calcom/trpc/react";
import Select from "@calcom/ui/v2/core/form/Select";
import Select from "@calcom/ui/v2/core/form/select";
interface Props {
onChange: (value: { externalId: string; integration: string }) => void;
yarn.lock
+17 -17
View File
@@ -2803,9 +2803,9 @@
integrity sha512-7jGciNJ2bQ4eZLSNlSZ+VAyW63kALf420CvkEpK4lEsUfWJq9odqimci0YCiyNyMUFB+pWHwLYyNc57dijYsCg==
"@headlessui/react@^1.5.0":
version "1.7.2"
resolved "https://registry.yarnpkg.com/@headlessui/react/-/react-1.7.2.tgz#e6a6a8d38342064a53182f1eb2bf6d9c1e53ba6a"
integrity sha512-snLv2lxwsf2HNTOBNgHYdvoYZ3ChJE8QszPi1d/hl9js8KrFrUulTaQBfSyPbJP5BybVreWh9DxCgz9S0Z6hKQ==
version "1.7.3"
resolved "https://registry.yarnpkg.com/@headlessui/react/-/react-1.7.3.tgz#853c598ff47b37cdd192c5cbee890d9b610c3ec0"
integrity sha512-LGp06SrGv7BMaIQlTs8s2G06moqkI0cb0b8stgq7KZ3xcHdH3qMP+cRyV7qe5x4XEW/IGY48BW4fLesD6NQLng==
"@heroicons/react@^1.0.6":
version "1.0.6"
@@ -6285,10 +6285,10 @@
resolved "https://registry.yarnpkg.com/@tanstack/query-core/-/query-core-4.3.8.tgz#d5f07c1d9d4f83f16f0bed7f3b245fa0e557b037"
integrity sha512-AEUWtCNBIImFZ9tMt/P8V86kIhMHpfoJqAI1auGOLR8Wzeq7Ymiue789PJG0rKYcyViUicBZeHjggMqyEQVMfQ==
"@tanstack/query-core@4.7.2":
version "4.7.2"
resolved "https://registry.yarnpkg.com/@tanstack/query-core/-/query-core-4.7.2.tgz#5e8f0bc632b9c5423e5c5ca6d147c386b64dfec7"
integrity sha512-1zQuFsKShMhLY6rQYBEmkYiK9Zcb3lQcCVOTIgQcvliKIxPyZFaE/8LMtaITEEfgGF5qwYqHdm61+BUtpyNsrg==
"@tanstack/query-core@4.9.0":
version "4.9.0"
resolved "https://registry.yarnpkg.com/@tanstack/query-core/-/query-core-4.9.0.tgz#ffc057b664f952bf3d4925fd924a12403646f6a2"
integrity sha512-Vl0jAWJR3A1md0PoPMoEd6+H1dlRB5NqXDBNF+MZEgjQsR0Nly2kJgJj0Zh6eRDndnn7VlspxTWoOpt+dwDdAA==
"@tanstack/query-sync-storage-persister@^4.0.10":
version "4.2.3"
@@ -6310,11 +6310,11 @@
use-sync-external-store "^1.2.0"
"@tanstack/react-query@^4.2.3":
version "4.7.2"
resolved "https://registry.yarnpkg.com/@tanstack/react-query/-/react-query-4.7.2.tgz#ce020c4e0261e16b99d24322d1598ffc28974472"
integrity sha512-4nJ0HxU2kxkaHZ/swJw39io3Bb3liiggJBsCCdFOydZOl8AJDRCor1E3GsOBrtn53HT01R9EIP4PY/6fyYdKsw==
version "4.9.0"
resolved "https://registry.yarnpkg.com/@tanstack/react-query/-/react-query-4.9.0.tgz#e0e8894b9b7415608c488d68793826113d61224d"
integrity sha512-M4utYjk9BRDUYbbprSsa0eExdC9NjqQ0deuHXYxQkT8l8BIVyw6yv02LQUGBdOnn/6w5xXFyQRG2slo+JhqeBg==
dependencies:
"@tanstack/query-core" "4.7.2"
"@tanstack/query-core" "4.9.0"
use-sync-external-store "^1.2.0"
"@tanstack/react-query@^4.3.9":
@@ -6889,16 +6889,11 @@
dependencies:
"@types/node" "*"
"@types/node@*", "@types/node@16.9.1", "@types/node@>=12.0.0", "@types/node@>=8.1.0", "@types/node@^14.0.10 || ^16.0.0", "@types/node@^14.14.20 || ^16.0.0":
"@types/node@*", "@types/node@16.9.1", "@types/node@>=12.0.0", "@types/node@>=8.1.0", "@types/node@^12.12.54", "@types/node@^12.12.6", "@types/node@^14.0.10 || ^16.0.0", "@types/node@^14.14.20 || ^16.0.0":
version "16.9.1"
resolved "https://registry.yarnpkg.com/@types/node/-/node-16.9.1.tgz#0611b37db4246c937feef529ddcc018cf8e35708"
integrity sha512-QpLcX9ZSsq3YYUUnD3nFDY8H7wctAhQj/TFKL8Ya8v5fMm3CFXxo8zStsLAl780ltoYoo1WvKUVGBQK+1ifr7g==
"@types/node@^12.12.54", "@types/node@^12.12.6":
version "12.20.55"
resolved "https://registry.yarnpkg.com/@types/node/-/node-12.20.55.tgz#c329cbd434c42164f846b909bd6f85b5537f6240"
integrity sha512-J8xLz7q2OFulZ2cyGTLE1TbbZcjpno7FaN6zdJNrgAdrJ+DZzh/uFR6YrTb4C+nXakvud8Q4+rbhoIWlYQbUFQ==
"@types/nodemailer@^6.4.5":
version "6.4.5"
resolved "https://registry.yarnpkg.com/@types/nodemailer/-/nodemailer-6.4.5.tgz#09011ac73259245475d1688e4ba101860567dc39"
@@ -23326,6 +23321,11 @@ synchronous-promise@^2.0.15:
resolved "https://registry.yarnpkg.com/synchronous-promise/-/synchronous-promise-2.0.15.tgz#07ca1822b9de0001f5ff73595f3d08c4f720eb8e"
integrity sha512-k8uzYIkIVwmT+TcglpdN50pS2y1BDcUnBPK9iJeGu0Pl1lOI8pD6wtzgw91Pjpe+RxtTncw32tLxs/R0yNL2Mg==
tailwind-scrollbar@^2.0.1:
version "2.0.1"
resolved "https://registry.yarnpkg.com/tailwind-scrollbar/-/tailwind-scrollbar-2.0.1.tgz#f08721173d513f1406a44601640b79726e3f9728"
integrity sha512-OcR7qHBbux4k+k6bWqnEQFYFooLK/F4dhkBz6nvswIoaA9ancZ5h20e0tyV7ifSWLDCUBtpG+1NHRA8HMRH/wg==
tailwindcss-radix@^2.6.0:
version "2.6.0"
resolved "https://registry.yarnpkg.com/tailwindcss-radix/-/tailwindcss-radix-2.6.0.tgz#4948f477454b4441b4411c436f897c3f305c915b"