From 657c9897d08828aff843f5d39ce278e91a234b41 Mon Sep 17 00:00:00 2001 From: Jamie Henson Date: Tue, 19 Mar 2024 15:07:59 +0000 Subject: [PATCH] chore: update imports to reference TSX directly --- README.md | 4 ++-- src/core/Code/Code.stories.tsx | 2 +- .../ContactFooter/ContactFooter.stories.tsx | 2 +- src/core/ContactFooter/component.tsx | 2 +- .../CookieMessage/CookieMessage.stories.tsx | 2 +- src/core/CookieMessage/component.css | 22 +++++++++---------- .../CustomerLogos/CustomerLogos.stories.tsx | 2 +- .../DropdownMenu/DropdownMenu.stories.tsx | 4 ++-- src/core/DropdownMenu/component.tsx | 2 +- .../FeaturedLink/FeaturedLink.stories.tsx | 2 +- src/core/FeaturedLink/component.tsx | 2 +- src/core/Flash/Flash.stories.tsx | 2 +- src/core/Flash/component.tsx | 2 +- src/core/Footer/Footer.stories.tsx | 2 +- src/core/Footer/component.tsx | 2 +- src/core/Icon/Icon.stories.tsx | 2 +- src/core/Loader/Loader.stories.tsx | 2 +- src/core/Logo/Logo.stories.tsx | 2 +- src/core/Meganav/Meganav.stories.tsx | 2 +- src/core/Meganav/component.js | 12 +++++----- src/core/Meganav/component.tsx | 18 +++++++-------- src/core/MeganavBlogPostsList/component.tsx | 4 ++-- src/core/MeganavContentCompany/component.tsx | 6 ++--- .../MeganavContentDevelopers/component.tsx | 4 ++-- src/core/MeganavContentProducts/component.tsx | 4 ++-- src/core/MeganavContentUseCases/component.tsx | 4 ++-- src/core/MeganavControl/component.tsx | 4 ++-- .../component.tsx | 4 ++-- .../component.tsx | 2 +- .../component.tsx | 2 +- src/core/MeganavItemsDesktop/component.tsx | 4 ++-- src/core/MeganavItemsMobile/component.tsx | 16 +++++++------- src/core/MeganavItemsSignedIn/component.tsx | 8 +++---- src/core/MeganavSearch/component.tsx | 6 ++--- src/core/MeganavSearchPanel/component.tsx | 8 +++---- .../MeganavSearchSuggestions/component.tsx | 4 ++-- src/core/Notice/component.js | 2 +- src/core/Notice/component.tsx | 2 +- src/core/SignOutLink/component.tsx | 2 +- src/core/Slider/Slider.stories.tsx | 2 +- src/core/Slider/component.tsx | 2 +- src/pages/Buttons.mdx | 2 +- src/pages/Chips.mdx | 2 +- src/pages/Forms.mdx | 4 ++-- tailwind.extend.js | 2 +- webpack.common.js | 6 ++--- 46 files changed, 98 insertions(+), 100 deletions(-) diff --git a/README.md b/README.md index 17376324..87809032 100644 --- a/README.md +++ b/README.md @@ -233,7 +233,7 @@ All components live in `src` and follow a directory and filename convention: - component directory (TitleCase) - `component.js` - this is the entry file for a component and is the only required file - `components.css` - additional CSS - - for react, `components.jsx` + - for react, `components.tsx` For example: @@ -244,7 +244,7 @@ For example: - Accordion - component.js - component.css - - component.jsx + - component.tsx ``` #### CSS diff --git a/src/core/Code/Code.stories.tsx b/src/core/Code/Code.stories.tsx index 0a6454b6..484828a6 100644 --- a/src/core/Code/Code.stories.tsx +++ b/src/core/Code/Code.stories.tsx @@ -1,4 +1,4 @@ -import Code from "./component.jsx"; +import Code from "./component.tsx"; export default { title: "Components/Code", diff --git a/src/core/ContactFooter/ContactFooter.stories.tsx b/src/core/ContactFooter/ContactFooter.stories.tsx index 233f7f56..ee83a608 100644 --- a/src/core/ContactFooter/ContactFooter.stories.tsx +++ b/src/core/ContactFooter/ContactFooter.stories.tsx @@ -1,4 +1,4 @@ -import ContactFooter from "./component.jsx"; +import ContactFooter from "./component.tsx"; export default { title: "Components/Contact Footer", diff --git a/src/core/ContactFooter/component.tsx b/src/core/ContactFooter/component.tsx index e963589c..1c3f5a12 100644 --- a/src/core/ContactFooter/component.tsx +++ b/src/core/ContactFooter/component.tsx @@ -1,6 +1,6 @@ import React, { useEffect } from "react"; -import Icon from "../Icon/component.jsx"; +import Icon from "../Icon/component.tsx"; import _absUrl from "../url-base.js"; import toggleChatWidget from "../hubspot-chat-toggle"; diff --git a/src/core/CookieMessage/CookieMessage.stories.tsx b/src/core/CookieMessage/CookieMessage.stories.tsx index 72b14141..d43e5729 100644 --- a/src/core/CookieMessage/CookieMessage.stories.tsx +++ b/src/core/CookieMessage/CookieMessage.stories.tsx @@ -1,4 +1,4 @@ -import CookieMessage from "./component.jsx"; +import CookieMessage from "./component.tsx"; export default { title: "Components/Cookie Message", diff --git a/src/core/CookieMessage/component.css b/src/core/CookieMessage/component.css index 6d6844b0..41bbae25 100644 --- a/src/core/CookieMessage/component.css +++ b/src/core/CookieMessage/component.css @@ -1,13 +1,11 @@ -@layer components { - .ui-cookie-message { - @apply rounded-lg bg-white font-sans; - @apply justify-between items-center; - @apply opacity-100 z-50 bottom-0 fixed sm:flex; - @apply p-16 mb-16 ml-16; - max-width: 70vw; - box-shadow: 0px 24px 32px 0px #0000000d; - border: 1px solid var(--color-mid-grey); - border-left: 0.5rem solid var(--color-electric-cyan); - transition: bottom 250ms ease-out, opacity 150ms ease-out; - } +.ui-cookie-message { + @apply rounded-lg bg-white font-sans; + @apply justify-between items-center; + @apply opacity-100 z-50 bottom-0 fixed sm:flex; + @apply p-16 mb-16 ml-16; + max-width: 70vw; + box-shadow: 0px 24px 32px 0px #0000000d; + border: 1px solid var(--color-mid-grey); + border-left: 0.5rem solid var(--color-electric-cyan); + transition: bottom 250ms ease-out, opacity 150ms ease-out; } diff --git a/src/core/CustomerLogos/CustomerLogos.stories.tsx b/src/core/CustomerLogos/CustomerLogos.stories.tsx index 190d72d4..3f5b4993 100644 --- a/src/core/CustomerLogos/CustomerLogos.stories.tsx +++ b/src/core/CustomerLogos/CustomerLogos.stories.tsx @@ -1,4 +1,4 @@ -import CustomerLogos from "./component.jsx"; +import CustomerLogos from "./component.tsx"; import hubspot from "../images/cust-logo-hubspot-mono-pos.svg"; import webflow from "../images/cust-logo-webflow-col-pos.svg"; diff --git a/src/core/DropdownMenu/DropdownMenu.stories.tsx b/src/core/DropdownMenu/DropdownMenu.stories.tsx index 48d768c0..25530139 100644 --- a/src/core/DropdownMenu/DropdownMenu.stories.tsx +++ b/src/core/DropdownMenu/DropdownMenu.stories.tsx @@ -1,6 +1,6 @@ import React from "react"; -import Icon from "../Icon/component.jsx"; -import DropdownMenu from "./component.jsx"; +import Icon from "../Icon/component.tsx"; +import DropdownMenu from "./component.tsx"; export default { title: "Components/Dropdown Menu", diff --git a/src/core/DropdownMenu/component.tsx b/src/core/DropdownMenu/component.tsx index 7390b279..69d4429d 100644 --- a/src/core/DropdownMenu/component.tsx +++ b/src/core/DropdownMenu/component.tsx @@ -7,7 +7,7 @@ import React, { ReactNode, Dispatch, } from "react"; -import Icon from "../Icon/component.jsx"; +import Icon from "../Icon/component.tsx"; const DropdownMenuContext = createContext<{ isOpen: boolean; diff --git a/src/core/FeaturedLink/FeaturedLink.stories.tsx b/src/core/FeaturedLink/FeaturedLink.stories.tsx index db75f0b9..1b6ff6c7 100644 --- a/src/core/FeaturedLink/FeaturedLink.stories.tsx +++ b/src/core/FeaturedLink/FeaturedLink.stories.tsx @@ -1,4 +1,4 @@ -import FeaturedLink from "./component.jsx"; +import FeaturedLink from "./component.tsx"; export default { title: "Components/Featured Link", diff --git a/src/core/FeaturedLink/component.tsx b/src/core/FeaturedLink/component.tsx index 8431029b..39d02259 100644 --- a/src/core/FeaturedLink/component.tsx +++ b/src/core/FeaturedLink/component.tsx @@ -1,6 +1,6 @@ import React, { CSSProperties, ReactNode } from "react"; -import Icon from "../Icon/component.jsx"; +import Icon from "../Icon/component.tsx"; type FeaturedLinkProps = { url: string; diff --git a/src/core/Flash/Flash.stories.tsx b/src/core/Flash/Flash.stories.tsx index 7e331112..e571a0e2 100644 --- a/src/core/Flash/Flash.stories.tsx +++ b/src/core/Flash/Flash.stories.tsx @@ -1,5 +1,5 @@ import React from "react"; -import Flash, { reducerFlashes } from "./component.jsx"; +import Flash, { reducerFlashes } from "./component.tsx"; import { attachStoreToWindow, diff --git a/src/core/Flash/component.tsx b/src/core/Flash/component.tsx index 16e8c263..fe845ba1 100644 --- a/src/core/Flash/component.tsx +++ b/src/core/Flash/component.tsx @@ -4,7 +4,7 @@ import { nanoid } from "nanoid/non-secure"; import { getRemoteDataStore } from "../remote-data-store.js"; import ConnectStateWrapper from "../ConnectStateWrapper/component.js"; -import Icon from "../Icon/component.jsx"; +import Icon from "../Icon/component.tsx"; import "./component.css"; type FlashProps = { diff --git a/src/core/Footer/Footer.stories.tsx b/src/core/Footer/Footer.stories.tsx index 8de0e823..c1e091a3 100644 --- a/src/core/Footer/Footer.stories.tsx +++ b/src/core/Footer/Footer.stories.tsx @@ -1,4 +1,4 @@ -import Footer from "./component.jsx"; +import Footer from "./component.tsx"; import ablyStack from "../images/ably-stack.svg"; import highestPerformer from "../images/high-performer-2023.svg"; diff --git a/src/core/Footer/component.tsx b/src/core/Footer/component.tsx index 49a02696..13e4d2bf 100644 --- a/src/core/Footer/component.tsx +++ b/src/core/Footer/component.tsx @@ -1,6 +1,6 @@ import React from "react"; -import Icon from "../Icon/component.jsx"; +import Icon from "../Icon/component.tsx"; import _absUrl from "../url-base.js"; import "./component.css"; diff --git a/src/core/Icon/Icon.stories.tsx b/src/core/Icon/Icon.stories.tsx index 01be6bf9..a39f100d 100644 --- a/src/core/Icon/Icon.stories.tsx +++ b/src/core/Icon/Icon.stories.tsx @@ -1,5 +1,5 @@ import React from "react"; -import Icon from "./component.jsx"; +import Icon from "./component.tsx"; export default { title: "Components/Icon", diff --git a/src/core/Loader/Loader.stories.tsx b/src/core/Loader/Loader.stories.tsx index 7e18e213..0c78656d 100644 --- a/src/core/Loader/Loader.stories.tsx +++ b/src/core/Loader/Loader.stories.tsx @@ -1,4 +1,4 @@ -import Loader from "./component.jsx"; +import Loader from "./component.tsx"; export default { title: "Components/Loader", diff --git a/src/core/Logo/Logo.stories.tsx b/src/core/Logo/Logo.stories.tsx index 4dc30e5e..7d73a5b4 100644 --- a/src/core/Logo/Logo.stories.tsx +++ b/src/core/Logo/Logo.stories.tsx @@ -1,4 +1,4 @@ -import Logo from "./component.jsx"; +import Logo from "./component.tsx"; import logoUrl from "../images/ably-logo.png"; export default { diff --git a/src/core/Meganav/Meganav.stories.tsx b/src/core/Meganav/Meganav.stories.tsx index 2c2f702e..55517b9d 100644 --- a/src/core/Meganav/Meganav.stories.tsx +++ b/src/core/Meganav/Meganav.stories.tsx @@ -1,7 +1,7 @@ import React, { useEffect } from "react"; import { rest } from "msw"; -import Meganav from "./component.jsx"; +import Meganav from "./component.tsx"; import loadIcons from "../icons.js"; import logo from "../images/ably-logo.png"; import ablyStack from "../images/ably-stack.svg"; diff --git a/src/core/Meganav/component.js b/src/core/Meganav/component.js index 608426ad..704e625a 100644 --- a/src/core/Meganav/component.js +++ b/src/core/Meganav/component.js @@ -12,13 +12,13 @@ import "./component.css"; import { queryId, queryIdAll } from "../dom-query"; -import MeganavControl from "../MeganavControl/component"; +import MeganavControl from "../MeganavControl/component.tsx"; -import MeganavControlMobileDropdown from "../MeganavControlMobileDropdown/component"; -import MobilePanelOpenClick from "../MeganavControlMobilePanelOpen/component"; -import MobilePanelCloseClick from "../MeganavControlMobilePanelClose/component"; -import MeganavSearchAutocomplete from "../MeganavSearchAutocomplete/component"; -import MeganavSearchSuggestions from "../MeganavSearchSuggestions/component"; +import MeganavControlMobileDropdown from "../MeganavControlMobileDropdown/component.tsx"; +import MobilePanelOpenClick from "../MeganavControlMobilePanelOpen/component.tsx"; +import MobilePanelCloseClick from "../MeganavControlMobilePanelClose/component.tsx"; +import MeganavSearchAutocomplete from "../MeganavSearchAutocomplete/component.tsx"; +import MeganavSearchSuggestions from "../MeganavSearchSuggestions/component.tsx"; // Close menu when user clicks outside of viewport const windowOnBlur = (closeAll) => { diff --git a/src/core/Meganav/component.tsx b/src/core/Meganav/component.tsx index d6b19334..d148d61b 100644 --- a/src/core/Meganav/component.tsx +++ b/src/core/Meganav/component.tsx @@ -6,18 +6,18 @@ import { selectSessionData } from "../remote-session-data.js"; import Logo from "../Logo/component.js"; import MeganavScripts from "./component.js"; -import MeganavItemsDesktop from "../MeganavItemsDesktop/component.jsx"; -import MeganavItemsSignedIn from "../MeganavItemsSignedIn/component.jsx"; -import MeganavItemsMobile from "../MeganavItemsMobile/component.jsx"; -import Notice from "../Notice/component"; +import MeganavItemsDesktop from "../MeganavItemsDesktop/component.tsx"; +import MeganavItemsSignedIn from "../MeganavItemsSignedIn/component.tsx"; +import MeganavItemsMobile from "../MeganavItemsMobile/component.tsx"; +import Notice from "../Notice/component.tsx"; import MeganavData from "./component.json"; import _absUrl from "../url-base.js"; -import MeganavContentProducts from "../MeganavContentProducts/component.jsx"; -import MeganavContentUseCases from "../MeganavContentUseCases/component.jsx"; -import MeganavContentCompany from "../MeganavContentCompany/component.jsx"; -import MeganavContentDevelopers from "../MeganavContentDevelopers/component.jsx"; -import MeganavSearch from "../MeganavSearch/component.jsx"; +import MeganavContentProducts from "../MeganavContentProducts/component.tsx"; +import MeganavContentUseCases from "../MeganavContentUseCases/component.tsx"; +import MeganavContentCompany from "../MeganavContentCompany/component.tsx"; +import MeganavContentDevelopers from "../MeganavContentDevelopers/component.tsx"; +import MeganavSearch from "../MeganavSearch/component.tsx"; export type MeganavTheme = { backgroundColor?: string; diff --git a/src/core/MeganavBlogPostsList/component.tsx b/src/core/MeganavBlogPostsList/component.tsx index 740e426a..d6eddddd 100644 --- a/src/core/MeganavBlogPostsList/component.tsx +++ b/src/core/MeganavBlogPostsList/component.tsx @@ -1,7 +1,7 @@ import React from "react"; -import FeaturedLink from "../FeaturedLink/component"; -import { AbsUrl } from "../Meganav/component"; +import FeaturedLink from "../FeaturedLink/component.tsx"; +import { AbsUrl } from "../Meganav/component.tsx"; type MeganavBlogPostsListProps = { recentBlogPosts: { diff --git a/src/core/MeganavContentCompany/component.tsx b/src/core/MeganavContentCompany/component.tsx index e8218be5..ba18cbd0 100644 --- a/src/core/MeganavContentCompany/component.tsx +++ b/src/core/MeganavContentCompany/component.tsx @@ -1,9 +1,9 @@ import React from "react"; -import MeganavBlogPostsList from "../MeganavBlogPostsList/component"; -import ConnectStateWrapper from "../ConnectStateWrapper/component"; +import MeganavBlogPostsList from "../MeganavBlogPostsList/component.tsx"; +import ConnectStateWrapper from "../ConnectStateWrapper/component.tsx"; import { selectRecentBlogPosts } from "../remote-blogs-posts.js"; -import Icon from "../Icon/component"; +import Icon from "../Icon/component.tsx"; import { AbsUrl } from "../Meganav/component.js"; type MeganavContentCompanyProps = { diff --git a/src/core/MeganavContentDevelopers/component.tsx b/src/core/MeganavContentDevelopers/component.tsx index 1cb56488..776bb541 100644 --- a/src/core/MeganavContentDevelopers/component.tsx +++ b/src/core/MeganavContentDevelopers/component.tsx @@ -1,7 +1,7 @@ import React from "react"; -import Icon from "../Icon/component"; -import { AbsUrl } from "../Meganav/component"; +import Icon from "../Icon/component.tsx"; +import { AbsUrl } from "../Meganav/component.tsx"; const MeganavContentDevelopers = ({ absUrl }: { absUrl: AbsUrl }) => (
diff --git a/src/core/MeganavContentProducts/component.tsx b/src/core/MeganavContentProducts/component.tsx index 3a869758..37d52646 100644 --- a/src/core/MeganavContentProducts/component.tsx +++ b/src/core/MeganavContentProducts/component.tsx @@ -1,7 +1,7 @@ import React from "react"; -import FeaturedLink from "../FeaturedLink/component"; -import { AbsUrl } from "../Meganav/component"; +import FeaturedLink from "../FeaturedLink/component.tsx"; +import { AbsUrl } from "../Meganav/component.tsx"; type MeganavContentProductsProps = { paths: { diff --git a/src/core/MeganavContentUseCases/component.tsx b/src/core/MeganavContentUseCases/component.tsx index a3783dc3..36a5c4b1 100644 --- a/src/core/MeganavContentUseCases/component.tsx +++ b/src/core/MeganavContentUseCases/component.tsx @@ -1,7 +1,7 @@ import React from "react"; -import Icon from "../Icon/component"; -import { AbsUrl } from "../Meganav/component"; +import Icon from "../Icon/component.tsx"; +import { AbsUrl } from "../Meganav/component.tsx"; const MeganavContentUseCases = ({ absUrl }: { absUrl: AbsUrl }) => (
diff --git a/src/core/MeganavControl/component.tsx b/src/core/MeganavControl/component.tsx index 0cd84d76..ba08cb31 100644 --- a/src/core/MeganavControl/component.tsx +++ b/src/core/MeganavControl/component.tsx @@ -1,7 +1,7 @@ import React, { ReactNode } from "react"; -import Icon from "../Icon/component"; -import { MeganavTheme } from "../Meganav/component"; +import Icon from "../Icon/component.tsx"; +import { MeganavTheme } from "../Meganav/component.tsx"; type MeganavControlProps = { ariaControls: string; diff --git a/src/core/MeganavControlMobileDropdown/component.tsx b/src/core/MeganavControlMobileDropdown/component.tsx index 7771f13f..8939eb40 100644 --- a/src/core/MeganavControlMobileDropdown/component.tsx +++ b/src/core/MeganavControlMobileDropdown/component.tsx @@ -1,7 +1,7 @@ import React from "react"; -import Icon from "../Icon/component"; -import { MeganavTheme } from "../Meganav/component"; +import Icon from "../Icon/component.tsx"; +import { MeganavTheme } from "../Meganav/component.tsx"; const MeganavControlMobileDropdown = ({ theme }: { theme: MeganavTheme }) => (