diff --git a/src/components/Breakdown.jsx b/src/components/Breakdown.jsx index dd476c32e..2f4b94ecf 100644 --- a/src/components/Breakdown.jsx +++ b/src/components/Breakdown.jsx @@ -1,7 +1,7 @@ +import clsx from "clsx"; +import { isNumber } from "lodash"; import PropTypes from "prop-types"; import React, { createContext, useContext, useMemo } from "react"; -import { isNumber } from "lodash"; -import clsx from "clsx"; import { Currency } from "./Utilities/Currency"; const colors = { diff --git a/src/components/Buttons/SubmitButton.jsx b/src/components/Buttons/SubmitButton.jsx index f1876e269..c8b8e5d6a 100644 --- a/src/components/Buttons/SubmitButton.jsx +++ b/src/components/Buttons/SubmitButton.jsx @@ -1,9 +1,9 @@ import { Transition } from "@headlessui/react"; import clsx from "clsx"; import PropTypes from "prop-types"; -import React, { useState, useEffect } from "react"; -import { Spinner } from "../Spinner"; +import React, { useEffect, useState } from "react"; import { CheckIcon } from "../../icons"; +import { Spinner } from "../Spinner"; import { Button, colors } from "./Button"; const loadingColors = { diff --git a/src/components/DatePicker/DatePicker.css b/src/components/DatePicker/DatePicker.css index 39053460f..605de79d9 100644 --- a/src/components/DatePicker/DatePicker.css +++ b/src/components/DatePicker/DatePicker.css @@ -29,7 +29,7 @@ * This does not include the today button */ .DayPicker-Month { - @apply my-0 mx-0 p-0 pt-0.5 ring-0 focus:outline-none focus:ring-0; + @apply mx-0 my-0 p-0 pt-0.5 ring-0 focus:outline-none focus:ring-0; min-width: 400px; /* Odd width given from Figma */ border-collapse: inherit; border-spacing: 0 8px; /* 8px between each week (row) */ @@ -52,7 +52,7 @@ /* The "Today" button. A lot of specific vaules which I normally wouldn't use. But this is a third party lib where I cannot change the markup */ .DayPicker-TodayButton { - @apply absolute top-0 right-24 h-10 px-3.5 py-2.5 leading-4; + @apply absolute right-24 top-0 h-10 px-3.5 py-2.5 leading-4; @apply rounded border border-solid border-gray bg-white text-base font-semibold tracking-tightest text-black hover:border-blue hover:bg-blue-lighter; } diff --git a/src/components/DatePicker/RangeDatePicker.jsx b/src/components/DatePicker/RangeDatePicker.jsx index 06d83994f..b6a367af5 100644 --- a/src/components/DatePicker/RangeDatePicker.jsx +++ b/src/components/DatePicker/RangeDatePicker.jsx @@ -1,13 +1,13 @@ -import React from "react"; -import PropTypes from "prop-types"; -import DayPicker from "react-day-picker"; import clsx from "clsx"; import { isArray, isFunction } from "lodash"; -import { Tooltip } from "../Tooltip"; +import PropTypes from "prop-types"; +import React from "react"; +import DayPicker from "react-day-picker"; import { now } from "../../helpers/date"; -import { NavbarElement } from "./NavbarElement"; -import { MonthYearSelector } from "./MonthYearSelector"; +import { Tooltip } from "../Tooltip"; import { Day } from "./Day"; +import { MonthYearSelector } from "./MonthYearSelector"; +import { NavbarElement } from "./NavbarElement"; const RangeDatePicker = ({ getTooltip, diff --git a/src/components/DatePicker/RelativeDateRange.jsx b/src/components/DatePicker/RelativeDateRange.jsx index 6e0d83e7a..882fc7516 100644 --- a/src/components/DatePicker/RelativeDateRange.jsx +++ b/src/components/DatePicker/RelativeDateRange.jsx @@ -1,7 +1,7 @@ import PropTypes from "prop-types"; import React from "react"; -import { now, toDate } from "../../helpers/date"; import { Button, Select } from "../.."; +import { now, toDate } from "../../helpers/date"; const options = { YESTERDAY: "P1D,yesterday", diff --git a/src/components/DatePicker/UpcomingDatePicker.jsx b/src/components/DatePicker/UpcomingDatePicker.jsx index a6b509731..e6dfbde09 100644 --- a/src/components/DatePicker/UpcomingDatePicker.jsx +++ b/src/components/DatePicker/UpcomingDatePicker.jsx @@ -1,7 +1,7 @@ -import React from "react"; -import dayjs from "dayjs"; import clsx from "clsx"; +import dayjs from "dayjs"; import PropTypes from "prop-types"; +import React from "react"; export const UpcomingDatePicker = ({ value, upcomingDates, onChange, onMonthChange }) => { return ( diff --git a/src/components/Drawer.jsx b/src/components/Drawer.jsx index 5f225db5a..f010461f7 100644 --- a/src/components/Drawer.jsx +++ b/src/components/Drawer.jsx @@ -1,7 +1,7 @@ import { Dialog, Transition } from "@headlessui/react"; import clsx from "clsx"; import PropTypes from "prop-types"; -import React, { Fragment, forwardRef } from "react"; +import React, { forwardRef, Fragment } from "react"; import { CloseIcon } from "../icons"; import { Button } from "./Buttons/Button"; @@ -92,8 +92,7 @@ const CloseButton = ({ onClose }) => { size="small" variant="link" className={clsx( - "m-2.5 inline-flex !h-10 !w-10 items-center justify-center !rounded-full bg-white !px-1.5", - "!text-black focus:hidden", + "m-2.5 inline-flex !h-10 !w-10 items-center justify-center !rounded-full bg-white !px-1.5 !text-black", )} onClick={onClose} > diff --git a/src/components/Forms/BaseInput.jsx b/src/components/Forms/BaseInput.jsx index 890178ab9..4b7601c77 100644 --- a/src/components/Forms/BaseInput.jsx +++ b/src/components/Forms/BaseInput.jsx @@ -1,7 +1,7 @@ import clsx from "clsx"; +import { isEmpty, isString } from "lodash"; import PropTypes from "prop-types"; import React, { forwardRef } from "react"; -import { isEmpty, isString } from "lodash"; import { Dot } from "../Dot/Dot"; const sizes = { diff --git a/src/components/Forms/Label.jsx b/src/components/Forms/Label.jsx index b9833e362..f13b2be55 100644 --- a/src/components/Forms/Label.jsx +++ b/src/components/Forms/Label.jsx @@ -1,6 +1,6 @@ import clsx from "clsx"; -import React from "react"; import PropTypes from "prop-types"; +import React from "react"; export const Label = ({ isDisabled = false, isError = false, className, ...rest }) => { return ( diff --git a/src/components/Forms/RangeSlider.jsx b/src/components/Forms/RangeSlider.jsx index f4022508c..0f78bd100 100644 --- a/src/components/Forms/RangeSlider.jsx +++ b/src/components/Forms/RangeSlider.jsx @@ -1,7 +1,7 @@ import clsx from "clsx"; -import React from "react"; -import PropTypes from "prop-types"; import Nouislider from "nouislider-react"; +import PropTypes from "prop-types"; +import React from "react"; import "nouislider/distribute/nouislider.css"; import "./RangeSlider.css"; diff --git a/src/components/Forms/ValuePopoverText.jsx b/src/components/Forms/ValuePopoverText.jsx index 0c257088f..7d2cf5a4a 100644 --- a/src/components/Forms/ValuePopoverText.jsx +++ b/src/components/Forms/ValuePopoverText.jsx @@ -1,5 +1,5 @@ import React from "react"; -import { WarningDiamondIcon, Tooltip } from "../.."; +import { Tooltip, WarningDiamondIcon } from "../.."; export const ValuePopoverText = ({ value, error }) => { return ( diff --git a/src/components/HeaderToolbar.jsx b/src/components/HeaderToolbar.jsx index 92b282adb..c7a6076a1 100644 --- a/src/components/HeaderToolbar.jsx +++ b/src/components/HeaderToolbar.jsx @@ -1,6 +1,6 @@ import clsx from "clsx"; -import React from "react"; import PropTypes from "prop-types"; +import React from "react"; import { Breadcrumb, Search } from ".."; export const HeaderToolbar = ({ classNames, children }) => { diff --git a/src/components/Key.jsx b/src/components/Key.jsx index 0039c137d..98bd74861 100644 --- a/src/components/Key.jsx +++ b/src/components/Key.jsx @@ -1,6 +1,6 @@ import clsx from "clsx"; -import React from "react"; import PropTypes from "prop-types"; +import React from "react"; import { isOSX } from "../helpers/browser"; export const Key = ({ char, className, ...rest }) => { diff --git a/src/components/Logo.jsx b/src/components/Logo.jsx index b35f72bb4..953cc8e80 100644 --- a/src/components/Logo.jsx +++ b/src/components/Logo.jsx @@ -1,6 +1,6 @@ -import React from "react"; import clsx from "clsx"; import PropTypes from "prop-types"; +import React from "react"; const sizes = { small: "w-10 h-10", diff --git a/src/components/Sidebar/Sidebar.Heading.jsx b/src/components/Sidebar/Sidebar.Heading.jsx index 5f93cfbac..f914bdc63 100644 --- a/src/components/Sidebar/Sidebar.Heading.jsx +++ b/src/components/Sidebar/Sidebar.Heading.jsx @@ -1,5 +1,5 @@ -import PropTypes from "prop-types"; import clsx from "clsx"; +import PropTypes from "prop-types"; import React from "react"; export const SidebarHeading = ({ icon: Icon, label, className }) => { diff --git a/src/components/Spinner.jsx b/src/components/Spinner.jsx index e76739551..3e72c7c9a 100644 --- a/src/components/Spinner.jsx +++ b/src/components/Spinner.jsx @@ -1,6 +1,6 @@ -import React from "react"; import clsx from "clsx"; import PropTypes from "prop-types"; +import React from "react"; import { CircleNotch } from "../icons"; const colors = { diff --git a/src/components/Tooltip.jsx b/src/components/Tooltip.jsx index d307cfc07..5ae1108a4 100644 --- a/src/components/Tooltip.jsx +++ b/src/components/Tooltip.jsx @@ -1,6 +1,6 @@ -import React from "react"; import Tippy from "@tippyjs/react"; import PropTypes from "prop-types"; +import React from "react"; import { followCursor } from "tippy.js"; // Dont remove this even if unused. It is required for one prop import "tippy.js/dist/tippy.css"; // If we customize the style, the change this and import our own style diff --git a/src/components/Utilities/Number.jsx b/src/components/Utilities/Number.jsx index 01afdc487..7597be0c7 100644 --- a/src/components/Utilities/Number.jsx +++ b/src/components/Utilities/Number.jsx @@ -1,6 +1,6 @@ import getUserLocale from "get-user-locale"; -import React from "react"; import PropTypes from "prop-types"; +import React from "react"; import { numberFormat } from "../../helpers/numbers"; const userLocale = getUserLocale(); diff --git a/src/helpers/date.js b/src/helpers/date.js index 1cf1fe063..8ec12435e 100644 --- a/src/helpers/date.js +++ b/src/helpers/date.js @@ -1,9 +1,9 @@ import dayjs, { isDayjs } from "dayjs"; -import LocalizedFormat from "dayjs/plugin/localizedFormat"; import customParseFormat from "dayjs/plugin/customParseFormat"; +import LocalizedFormat from "dayjs/plugin/localizedFormat"; import quarterOfYear from "dayjs/plugin/quarterOfYear"; -import utc from "dayjs/plugin/utc"; import timezone from "dayjs/plugin/timezone"; +import utc from "dayjs/plugin/utc"; dayjs.extend(customParseFormat); dayjs.extend(LocalizedFormat); diff --git a/src/icons/src/Tutorials/TutorialsButtonIcon.jsx b/src/icons/src/Tutorials/TutorialsButtonIcon.jsx index e0baef78a..896115dba 100644 --- a/src/icons/src/Tutorials/TutorialsButtonIcon.jsx +++ b/src/icons/src/Tutorials/TutorialsButtonIcon.jsx @@ -1,5 +1,5 @@ -import React from "react"; import clsx from "clsx"; +import React from "react"; export const TutorialsButtonIcon = (props) => { const className = clsx("relative -top-0.25 inline-block", props.className); diff --git a/src/stories/DataDisplay/DateRangePicker.stories.js b/src/stories/DataDisplay/DateRangePicker.stories.js index f77a1e8f3..243c3eb5f 100644 --- a/src/stories/DataDisplay/DateRangePicker.stories.js +++ b/src/stories/DataDisplay/DateRangePicker.stories.js @@ -38,7 +38,7 @@ const DateRangePickerStories = { const today = dayjs.tz("2022-10-10").toDate(); const handleSubmitDateRange = (e) => { console.log("handleSubmitDateRange", { event: e }); -} +}; export const Default = () => { const [value, setValue] = useState({ from: new Date("2022-02-03"), to: new Date("2022-03-08") }); diff --git a/src/stories/Forms/ComboBox.stories.js b/src/stories/Forms/ComboBox.stories.js index 62ac38583..ff5b4dc0b 100644 --- a/src/stories/Forms/ComboBox.stories.js +++ b/src/stories/Forms/ComboBox.stories.js @@ -1,5 +1,5 @@ -import React from "react"; import clsx from "clsx"; +import React from "react"; import { ComboBox, Currency, FormGroup, Label } from "../.."; const ComboBoxStories = { diff --git a/src/stories/Forms/Switch.stories.js b/src/stories/Forms/Switch.stories.js index dc0b70f5a..5be264de4 100644 --- a/src/stories/Forms/Switch.stories.js +++ b/src/stories/Forms/Switch.stories.js @@ -1,5 +1,4 @@ import React, { useState } from "react"; - import { Switch } from "../.."; const SwitchStories = { diff --git a/src/stories/Forms/Textarea.stories.js b/src/stories/Forms/Textarea.stories.js index aa3dfe010..7bde22095 100644 --- a/src/stories/Forms/Textarea.stories.js +++ b/src/stories/Forms/Textarea.stories.js @@ -74,7 +74,7 @@ export const AutoSize = () => { return ( -