diff --git a/apps/nextjs/next.config.mjs b/apps/nextjs/next.config.mjs index 2bc72a90f0..a17d97fe67 100644 --- a/apps/nextjs/next.config.mjs +++ b/apps/nextjs/next.config.mjs @@ -1,61 +1,13 @@ -// import path from 'path'; +import { withPlone } from '@plone/nextjs/plugin'; /** @type {import('next').NextConfig} */ -const nextConfig = { +const nextConfig = withPlone({ typescript: { ignoreBuildErrors: true, }, // sassOptions: { // includePaths: [path.join(__dirname, 'src/lib/components/src/styles')], // }, - - // webpack(config) { - // config.resolve.alias = { - // ...config.resolve.alias, - // '../fonts': path.resolve(__dirname, 'src/lib/components/src/fonts'), - // }; - - // return config; - // }, - - // Rewrite to the backend to avoid CORS - async rewrites() { - let apiServerURL, vhmRewriteRule; - if ( - process.env.API_SERVER_URL && - (process.env.NEXT_PRODUCTION_URL || process.env.NEXT_PUBLIC_VERCEL_URL) - ) { - // We are in Vercel - apiServerURL = process.env.API_SERVER_URL; - vhmRewriteRule = `/VirtualHostBase/https/${ - process.env.NEXT_PRODUCTION_URL - ? // We are in the production deployment - process.env.NEXT_PRODUCTION_URL - : // We are in the preview deployment - process.env.NEXT_PUBLIC_VERCEL_URL - }%3A443/Plone/%2B%2Bapi%2B%2B/VirtualHostRoot`; - } else if (process.env.API_SERVER_URL) { - // We are in development - apiServerURL = process.env.API_SERVER_URL; - vhmRewriteRule = - '/VirtualHostBase/http/localhost%3A3000/Plone/%2B%2Bapi%2B%2B/VirtualHostRoot'; - } else { - // We are in development and the API_SERVER_URL is not set, so we use a local backend - apiServerURL = 'http://localhost:8080'; - vhmRewriteRule = - '/VirtualHostBase/http/localhost%3A3000/Plone/%2B%2Bapi%2B%2B/VirtualHostRoot'; - } - - return [ - { - source: '/\\+\\+api\\+\\+/:slug*', - destination: - // 'https://static.197.123.88.23.clients.your-server.de/api/:slug*', - // `${apiServerURL}/:slug*`, - `${apiServerURL}${vhmRewriteRule}/:slug*`, - }, - ]; - }, -}; +}); export default nextConfig; diff --git a/apps/nextjs/package.json b/apps/nextjs/package.json index 8b935ff8bb..a7e12a73fc 100644 --- a/apps/nextjs/package.json +++ b/apps/nextjs/package.json @@ -9,13 +9,22 @@ "start:prod": "next start", "lint": "next lint" }, + "addons": [ + "@plone/blocks", + "@plone/slots", + "@plone/quanta" + ], "dependencies": { "@plone/blocks": "workspace: *", "@plone/client": "workspace: *", "@plone/components": "workspace: *", + "@plone/nextjs": "workspace: *", "@plone/providers": "workspace: *", + "@plone/quanta": "workspace:^", "@plone/registry": "workspace: *", + "@plone/slots": "workspace: *", "@tanstack/react-query": "^5.59.0", + "clsx": "^2.1.1", "next": "14.2.14", "react": "^18", "react-aria-components": "^1.4.0", diff --git a/apps/nextjs/src/app/Providers.tsx b/apps/nextjs/src/app/Providers.tsx deleted file mode 100644 index e1c0fa9295..0000000000 --- a/apps/nextjs/src/app/Providers.tsx +++ /dev/null @@ -1,78 +0,0 @@ -'use client'; -import React from 'react'; -import { - useRouter, - usePathname, - useSearchParams, - useParams, -} from 'next/navigation'; -import { QueryClient } from '@tanstack/react-query'; -import { PloneProvider } from '@plone/providers'; -import PloneClient from '@plone/client'; -import { ReactQueryDevtools } from '@tanstack/react-query-devtools'; -import { flattenToAppURL } from './utils'; -import config from './config'; - -// Custom hook to unify the location object between NextJS and Plone -function useLocation() { - const pathname = usePathname(); - const search = useSearchParams(); - - return { - pathname, - search, - searchStr: '', - hash: (typeof window !== 'undefined' && window.location.hash) || '', - href: (typeof window !== 'undefined' && window.location.href) || '', - }; -} - -const Providers: React.FC<{ - children?: React.ReactNode; -}> = ({ children }) => { - // Creating the clients at the file root level makes the cache shared - // between all requests and means _all_ data gets passed to _all_ users. - // Besides being bad for performance, this also leaks any sensitive data. - // We use this pattern to ensure that every client gets its own clients - const [queryClient] = React.useState( - () => - new QueryClient({ - defaultOptions: { - queries: { - // With SSR, we usually want to set some default staleTime - // above 0 to avoid refetching immediately on the client - staleTime: 60 * 1000, - }, - }, - }), - ); - - const [ploneClient] = React.useState(() => - PloneClient.initialize({ - apiPath: config.settings.apiPath, - }), - ); - - const router = useRouter(); - - return ( - { - router.push(to); - }} - useParams={useParams} - useHref={(to) => flattenToAppURL(to)} - flattenToAppURL={flattenToAppURL} - > - {children} - - - ); -}; - -export default Providers; diff --git a/apps/nextjs/src/app/[...slug]/page.tsx b/apps/nextjs/src/app/[...slug]/page.tsx deleted file mode 100644 index bfd9dccfd2..0000000000 --- a/apps/nextjs/src/app/[...slug]/page.tsx +++ /dev/null @@ -1,3 +0,0 @@ -import Main from '../main'; - -export default Main; diff --git a/apps/nextjs/src/app/[[...slug]]/page.tsx b/apps/nextjs/src/app/[[...slug]]/page.tsx new file mode 100644 index 0000000000..55e91842dc --- /dev/null +++ b/apps/nextjs/src/app/[[...slug]]/page.tsx @@ -0,0 +1,74 @@ +import App from '@plone/slots/components/App'; +import Providers from '@/components/providers/Providers'; +import { getServerQueryClient, client as ploneClient } from '@/helpers/client'; +import cx from 'clsx'; +import { Inter } from 'next/font/google'; + +const expand = ['navroot', 'breadcrumbs', 'navigation', 'site']; + +const inter = Inter({ subsets: ['latin'] }); + +export async function generateMetadata({ + params, +}: { + params: { slug?: string[] }; +}) { + const { slug = [] } = params; + const path = '/' + slug.join('/'); + const queryClient = getServerQueryClient(); + const { getContentQuery } = ploneClient; + const data = await queryClient.fetchQuery(getContentQuery({ path, expand })); + + return { + title: `${data.title || ''} - Next.js app powered by Plone`, + description: data.description, + }; +} + +export default async function Main({ + params, + searchParams, +}: { + params: { slug?: string[] }; + searchParams: { [key: string]: string | string[] | undefined }; +}) { + const { slug = [] } = params; + const path = '/' + slug.join('/'); + const queryClient = getServerQueryClient(); + const { getContentQuery } = ploneClient; + const content = await queryClient.fetchQuery( + getContentQuery({ path, expand }), + ); + const search = new URLSearchParams(); + Object.entries(searchParams).forEach(([key, value]) => { + if (Array.isArray(value)) { + value.forEach((v) => search.append(key, v)); + } else if (value) { + search.append(key, value); + } + }); + const location = { + pathname: path, + search: search.toString(), + hash: '', + state: null, + key: '', + }; + + const className = cx( + inter.className, + `view-${content.layout ?? 'view'}`, + `contenttype-${content['@type'].replace(' ', '').toLowerCase()}`, + `section-${slug[slug.length - 1] || 'home'}`, + ); + + return ( + + + + ; + + + + ); +} diff --git a/apps/nextjs/src/app/config.ts b/apps/nextjs/src/app/config.ts deleted file mode 100644 index 8d0b440630..0000000000 --- a/apps/nextjs/src/app/config.ts +++ /dev/null @@ -1,30 +0,0 @@ -import config from '@plone/registry'; -import type { ConfigType } from '@plone/registry'; -import { slate } from '@plone/blocks'; -import { blocksConfig } from '@plone/blocks'; - -const settings: Partial = { - slate, -}; - -if (process.env.NEXT_PUBLIC_VERCEL_URL) { - // This app is at Vercel - if (process.env.NEXT_PRODUCTION_URL) { - // This app is in a production deployment, so set the apiPath to the production URL - settings.apiPath = process.env.NEXT_PRODUCTION_URL; - } else { - // This app is in a preview deployment, so set the apiPath to the Vercel URL - settings.apiPath = `https://${process.env.NEXT_PUBLIC_VERCEL_URL}`; - } -} else { - // This app is in development, so set the apiPath to localhost - settings.apiPath = 'http://localhost:3000/'; -} - -// @ts-expect-error Improve typings -config.set('settings', settings); - -// @ts-expect-error Improve typings -config.set('blocks', { blocksConfig }); - -export default config; diff --git a/apps/nextjs/src/app/content.tsx b/apps/nextjs/src/app/content.tsx deleted file mode 100644 index 84e2b244b7..0000000000 --- a/apps/nextjs/src/app/content.tsx +++ /dev/null @@ -1,33 +0,0 @@ -'use client'; -import { useQuery } from '@tanstack/react-query'; -import { usePathname } from 'next/navigation'; -import { usePloneClient } from '@plone/providers'; -import { Breadcrumbs, RenderBlocks } from '@plone/components'; -import config from '@plone/registry'; - -import '@plone/components/dist/basic.css'; - -export default function Content() { - const { getContentQuery } = usePloneClient(); - const pathname = usePathname(); - const { data } = useQuery(getContentQuery({ path: pathname })); - - if (data) { - return ( -
- - -
- ); - } - - return ''; -} diff --git a/apps/nextjs/src/app/favicon.ico b/apps/nextjs/src/app/favicon.ico index 718d6fea48..b9c0d0c0a6 100644 Binary files a/apps/nextjs/src/app/favicon.ico and b/apps/nextjs/src/app/favicon.ico differ diff --git a/apps/nextjs/src/app/getQueryClient.tsx b/apps/nextjs/src/app/getQueryClient.tsx deleted file mode 100644 index 6489c92efa..0000000000 --- a/apps/nextjs/src/app/getQueryClient.tsx +++ /dev/null @@ -1,15 +0,0 @@ -import { QueryClient } from '@tanstack/react-query'; -import { cache } from 'react'; - -const getQueryClient = cache( - () => - new QueryClient({ - defaultOptions: { - queries: { - staleTime: Infinity, - }, - }, - }), -); - -export default getQueryClient; diff --git a/apps/nextjs/src/app/layout.tsx b/apps/nextjs/src/app/layout.tsx index 8d254759a2..ef6da372ef 100644 --- a/apps/nextjs/src/app/layout.tsx +++ b/apps/nextjs/src/app/layout.tsx @@ -1,24 +1,19 @@ -import type { Metadata } from 'next'; -import { Inter } from 'next/font/google'; -import Providers from './Providers'; +import type { Viewport } from 'next'; +import '@plone/theming/styles/main.css'; +import '@plone/slots/main.css'; -const inter = Inter({ subsets: ['latin'] }); - -export const metadata: Metadata = { - title: 'Next.js app powered by Plone', - description: '', +export const viewport: Viewport = { + themeColor: '#fff', + minimumScale: 1, + initialScale: 1, + width: 'device-width', + viewportFit: 'cover', }; -export default function RootLayout({ +export default async function RootLayout({ children, -}: { +}: Readonly<{ children: React.ReactNode; -}) { - return ( - - - {children} - - - ); +}>) { + return children; } diff --git a/apps/nextjs/src/app/main.tsx b/apps/nextjs/src/app/main.tsx deleted file mode 100644 index f0d5c302a3..0000000000 --- a/apps/nextjs/src/app/main.tsx +++ /dev/null @@ -1,32 +0,0 @@ -import ploneClient from '@plone/client'; -import { dehydrate, HydrationBoundary } from '@tanstack/react-query'; -import { headers } from 'next/headers'; -import getQueryClient from './getQueryClient'; -import Content from './content'; -import config from './config'; - -const cli = ploneClient.initialize({ - apiPath: config.settings.apiPath, -}); - -const expand = ['breadcrumbs', 'navigation']; - -export default async function Main() { - const { getContentQuery } = cli; - const queryClient = getQueryClient(); - const headersList = headers(); - const path = headersList.get('x-pathname') || '/'; - console.log(`Visiting: ${path}`); - await queryClient.prefetchQuery(getContentQuery({ path, expand })); - const dehydratedState = dehydrate(queryClient); - - return ( - -
- apiPath in main RSC: {cli.config.apiPath} -
the content path in main RSC: {path} - -
-
- ); -} diff --git a/apps/nextjs/src/app/page.tsx b/apps/nextjs/src/app/page.tsx deleted file mode 100644 index 9a28e1dd09..0000000000 --- a/apps/nextjs/src/app/page.tsx +++ /dev/null @@ -1,3 +0,0 @@ -import Main from './main'; - -export default Main; diff --git a/apps/nextjs/src/components/providers/Providers.tsx b/apps/nextjs/src/components/providers/Providers.tsx new file mode 100644 index 0000000000..d709fd6dd6 --- /dev/null +++ b/apps/nextjs/src/components/providers/Providers.tsx @@ -0,0 +1,97 @@ +'use client'; + +import React from 'react'; +import { + useRouter, + usePathname, + useSearchParams, + useParams, +} from 'next/navigation'; +import { isServer, QueryClient } from '@tanstack/react-query'; +import { PloneProvider } from '@plone/providers'; +import { ReactQueryDevtools } from '@tanstack/react-query-devtools'; +import { client } from '@/helpers/client'; +import { flattenToAppURL } from '@/helpers/url'; + +// Custom hook to unify the location object between NextJS and Plone +function useLocation() { + const pathname = usePathname(); + const search = useSearchParams(); + + return { + pathname, + search, + searchStr: '', + hash: (typeof window !== 'undefined' && window.location.hash) || '', + href: (typeof window !== 'undefined' && window.location.href) || '', + }; +} + +// Fix for infinite useSuspenseQuery loop +// https://github.com/TanStack/query/issues/6116 +// https://tanstack.com/query/latest/docs/framework/react/guides/suspense +function makeQueryClient() { + return new QueryClient({ + defaultOptions: { + queries: { + // With SSR, we usually want to set some default staleTime + // above 0 to avoid refetching immediately on the client + staleTime: 60 * 1000, + }, + }, + }); +} + +let browserQueryClient: QueryClient | undefined = undefined; + +function getQueryClient() { + if (isServer) { + // Server: always make a new query client + return makeQueryClient(); + } else { + // Browser: make a new query client if we don't already have one + // This is very important, so we don't re-make a new client if React + // suspends during the initial render. This may not be needed if we + // have a suspense boundary BELOW the creation of the query client + if (!browserQueryClient) browserQueryClient = makeQueryClient(); + return browserQueryClient; + } +} + +export default function Providers({ children }: React.PropsWithChildren) { + const [ploneClient] = React.useState(() => client); + // NOTE: Avoid useState when initializing the query client if you don't + // have a suspense boundary between this and the code that may + // suspend because React will throw away the client on the initial + // render if it suspends and there is no boundary + const queryClient = getQueryClient(); + + const router = useRouter(); + + return ( + { + router.push(to); + }} + useParams={useParams} + useHref={(to) => flattenToAppURL(to)} + flattenToAppURL={flattenToAppURL} + > + {children} + + + ); +} + +declare module 'react-aria-components' { + interface RouterConfig { + routerOptions: NonNullable< + Parameters['push']>[1] + >; + } +} diff --git a/apps/nextjs/src/config/index.ts b/apps/nextjs/src/config/index.ts new file mode 100644 index 0000000000..08f58ebc5a --- /dev/null +++ b/apps/nextjs/src/config/index.ts @@ -0,0 +1,4 @@ +import installPlone from '@plone/nextjs'; +import config from '@plone/registry'; + +export default installPlone(config); diff --git a/apps/nextjs/src/helpers/client.ts b/apps/nextjs/src/helpers/client.ts new file mode 100644 index 0000000000..79d23cdfee --- /dev/null +++ b/apps/nextjs/src/helpers/client.ts @@ -0,0 +1,39 @@ +import { + defaultShouldDehydrateQuery, + QueryClient, +} from '@tanstack/react-query'; +import { cache } from 'react'; +import PloneClient from '@plone/client'; +import config from '@/config'; + +export const client = PloneClient.initialize({ + apiPath: config.settings.apiPath, +}); + +export const getServerQueryClient = cache( + () => + new QueryClient({ + defaultOptions: { + queries: { + staleTime: Infinity, + }, + dehydrate: { + // per default, only successful Queries are included, + // this includes pending Queries as well + shouldDehydrateQuery: (query) => + defaultShouldDehydrateQuery(query) || + query.state.status === 'pending', + }, + }, + }), +); + +// export function flattenToAppURL(url: string | undefined) { +// const { apiPath } = config; +// if (!url) return '/'; +// let flattenedUrl = url; +// for (const locale of locales) { +// flattenedUrl = flattenedUrl.replace(`${apiPath}/${locale}`, ''); +// } +// return flattenedUrl.replace(apiPath, '') || '/'; +// } diff --git a/apps/nextjs/src/app/utils.ts b/apps/nextjs/src/helpers/url.ts similarity index 93% rename from apps/nextjs/src/app/utils.ts rename to apps/nextjs/src/helpers/url.ts index 2f8aab3cec..d6c0cb7db0 100644 --- a/apps/nextjs/src/app/utils.ts +++ b/apps/nextjs/src/helpers/url.ts @@ -1,4 +1,4 @@ -import config from './config'; +import config from '@/config'; /** * Flatten to app server URL - Given a URL if it starts with the API server URL diff --git a/apps/nextjs/tsconfig.json b/apps/nextjs/tsconfig.json index 4b7888fa43..92f99a6960 100644 --- a/apps/nextjs/tsconfig.json +++ b/apps/nextjs/tsconfig.json @@ -19,7 +19,8 @@ } ], "paths": { - "@/*": ["./src/*"] + "@/*": ["./src/*"], + "@root/*": ["./src/*"] } }, "include": [ diff --git a/package.json b/package.json index 1cf8ebd0e3..0c7217fdaa 100644 --- a/package.json +++ b/package.json @@ -5,8 +5,8 @@ "preinstall": "npx only-allow pnpm", "watch": "pnpm --filter @plone/registry --filter @plone/client --filter @plone/components --filter @plone/providers watch", "build:deps": "pnpm --filter @plone/registry build", - "build:all": "pnpm --filter @plone/registry --filter @plone/client --filter @plone/components --filter @plone/providers build", - "build:all:force": "pnpm --filter @plone/registry --filter @plone/client --filter @plone/components --filter @plone/providers build:force", + "build:all": "pnpm --filter @plone/registry --filter @plone/client --filter @plone/components --filter @plone/providers --filter @plone/nextjs build", + "build:all:force": "pnpm --filter @plone/registry --filter @plone/client --filter @plone/components --filter @plone/providers --filter @plone/nextjs build:force", "build:registry": "pnpm --filter @plone/registry run build", "build:components": "pnpm --filter @plone/components run build", "build": "pnpm --filter @plone/volto build", diff --git a/packages/blocks/Image/index.tsx b/packages/blocks/Image/index.tsx new file mode 100644 index 0000000000..256b23df66 --- /dev/null +++ b/packages/blocks/Image/index.tsx @@ -0,0 +1,24 @@ +'use client'; + +import { BlockViewProps } from '@plone/types'; +import { usePloneProvider } from '@plone/providers'; + +const ImageBlockView = (props: BlockViewProps) => { + // console.log(props); + const flattenToAppURL = usePloneProvider().flattenToAppURL; + const { data } = props; + if (!data.url) return null; + const url = data.image_scales + ? `/++api++${flattenToAppURL(data.url)}/${data.image_scales[data.image_field][0].download}` + : data.url; + // data.preview_image?.[0]?.['@id'] || + // `/++api++${data.href[0]?.image_scales[data.href[0].image_field][0].base_path}/${data.href[0]?.image_scales[data.href[0].image_field][0].download}`; + + return ( +
+ {data.alt} +
+ ); +}; + +export default ImageBlockView; diff --git a/packages/blocks/RenderBlocks/BlockWrapper.tsx b/packages/blocks/RenderBlocks/BlockWrapper.tsx new file mode 100644 index 0000000000..e4a387004a --- /dev/null +++ b/packages/blocks/RenderBlocks/BlockWrapper.tsx @@ -0,0 +1,31 @@ +import { ReactNode } from 'react'; +import cx from 'clsx'; +import type { RenderBlocksProps } from './RenderBlocks'; + +type BlockWrapperProps = RenderBlocksProps & { + block: string; + children: ReactNode; +}; +const BlockWrapper = (props: BlockWrapperProps) => { + const { block, blocksConfig, children, content } = props; + const data = content.blocks?.[block]; + const category = blocksConfig?.[data['@type']]?.category; + // TODO: Bring in the StyleWrapper helpers for calculating styles and classes + const classNames = null; + const style = null; + + return ( +
+ {children} +
+ ); +}; + +export default BlockWrapper; diff --git a/packages/blocks/RenderBlocks/DefaultBlockView.tsx b/packages/blocks/RenderBlocks/DefaultBlockView.tsx new file mode 100644 index 0000000000..667fbd500d --- /dev/null +++ b/packages/blocks/RenderBlocks/DefaultBlockView.tsx @@ -0,0 +1,3 @@ +export const DefaultBlockView = () => { + return <>This block has no view assigned; +}; diff --git a/packages/blocks/RenderBlocks/RenderBlocks.tsx b/packages/blocks/RenderBlocks/RenderBlocks.tsx new file mode 100644 index 0000000000..d2f5370f9d --- /dev/null +++ b/packages/blocks/RenderBlocks/RenderBlocks.tsx @@ -0,0 +1,72 @@ +import { Fragment } from 'react'; +import { hasBlocksData } from '../helpers/blocks'; +import { DefaultBlockView } from './DefaultBlockView'; +import type { Content } from '@plone/types'; +import type { BlocksConfigData } from '@plone/types'; +import BlockWrapper from './BlockWrapper'; + +export type RenderBlocksProps = { + /** + * Plone content object + */ + content: Content; + /** + * Current blocks configuration object + * From the registry or local to this instance (eg. in a blocks in block container) + */ + blocksConfig: BlocksConfigData; + /** + * Wrap the blocks in an enclosing tag + * From the registry or local to this instance (eg. in a blocks in block container) + */ + as?: React.ElementType; + /** + * Router location object + */ + pathname: string; + /** + * Metadata object + * In case of the blocks in block container use case, it's the metadata (content data) + * from the parent container, passed down to the contained blocks + */ + metadata?: Content; +}; + +const RenderBlocks = (props: RenderBlocksProps) => { + const { blocksConfig, content, pathname, metadata } = props; + const CustomTag = props.as || Fragment; + + return hasBlocksData(content) ? ( + + {content.blocks_layout.items.map((block) => { + const blockData = content.blocks?.[block]; + const blockType = blockData?.['@type']; + // @ts-ignore + const Block = blocksConfig[blockType]?.view || DefaultBlockView; + + return Block ? ( + + {/* @ts-ignore It's ok to pass the blockData as is */} + + + ) : blockData ? ( +
Unknown block found: {blockType}
+ ) : ( +
Invalid Block
+ ); + })} +
+ ) : ( + '' + ); +}; + +export default RenderBlocks; diff --git a/packages/blocks/Teaser/index.tsx b/packages/blocks/Teaser/index.tsx new file mode 100644 index 0000000000..14248625fe --- /dev/null +++ b/packages/blocks/Teaser/index.tsx @@ -0,0 +1,33 @@ +'use client'; + +import { BlockViewProps } from '@plone/types'; +import { Link } from '@plone/components'; + +const TeaserBlockView = (props: BlockViewProps) => { + const { data } = props; + const href = Array.isArray(data.href) ? data.href?.[0]?.['@id'] : data.href; + const image = data.preview_image?.[0]; + // TODO: Improve the images download path including the ++api++ to avoid having to setup a redirect + // for @@images and @@download + const url = + data.preview_image?.[0]?.['@id'] || + `/++api++${data.href[0]?.image_scales[data.href[0].image_field][0].base_path}/${data.href[0]?.image_scales[data.href[0].image_field][0].download}`; + + return ( +
+ +
+
+ +
+
+

{data.title}

+

{data?.description}

+
+
+ +
+ ); +}; + +export default TeaserBlockView; diff --git a/packages/blocks/Text/View.tsx b/packages/blocks/Text/View.tsx new file mode 100644 index 0000000000..f206ea9aa2 --- /dev/null +++ b/packages/blocks/Text/View.tsx @@ -0,0 +1,23 @@ +import type { BlockViewProps } from '@plone/types'; +import { renderSlate } from './slate'; +import config from '@plone/registry'; + +const TextBlockView = (props: BlockViewProps) => { + const { id, data } = props; + const metadata = props.metadata || props.properties; + + return data?.value ? ( + <> + {renderSlate( + id, + config.settings.slate.elements, + config.settings.slate.topLevelTargetElements, + data.value, + data?.override_toc, + metadata, + )} + + ) : null; +}; + +export default TextBlockView; diff --git a/packages/blocks/Text/slate.tsx b/packages/blocks/Text/slate.tsx new file mode 100644 index 0000000000..49213678e1 --- /dev/null +++ b/packages/blocks/Text/slate.tsx @@ -0,0 +1,138 @@ +import { Fragment } from 'react'; +import type { Content } from '@plone/types'; + +export type SlateElementData = { + title: string; + url?: string; + link: { + external?: { + external_link: string; + target?: string; + }; + internal?: { + internal_link: Content[]; + target?: string; + }; + email?: { + email_address: string; + email_subject?: string; + }; + }; +}; + +export type SlateNode = { + type?: string; + children?: SlateNode[]; + text?: string; + data?: SlateElementData; +}; + +/** + * Simple Slate renderer, inherited from the awesome work @nzambello coded in + * https://github.com/nzambello/plone-remix-demo-pages + * + * For now it's ok, until we port the (more complex) one present in Volto core + * + * @param {string} id + * @param {Record>} elements + * @param {string[]} topLevelTargetElements + * @param {SlateNode[]} [nodes] + * @param {boolean} [override_toc] + * @param {*} [metadata] + * @return {*} + */ +export const renderSlate = ( + id: string, + elements: Record>, + topLevelTargetElements: string[], + nodes?: SlateNode[], + override_toc?: boolean, + metadata?: any, +) => { + const renderedNodes = (nodes ?? []).map((node: SlateNode, i) => { + if (node.text) { + return ( + + {node.text.split('\n').map((t, x) => + (node.text?.indexOf('\n') ?? -1) > -1 ? ( + + {t} +
+
+ ) : ( + {t} + ), + )} +
+ ); + } + + if (!node.type) { + return ; + } + + const shouldHaveID = + topLevelTargetElements.includes(node.type!) || override_toc; + + if (!elements[node.type]) { + console.warn(`Unknown slate element type ${node.type}`); + } + + const Element = elements[node.type] || elements['default']; + + return ( + + {renderSlate( + id, + elements, + topLevelTargetElements, + node.children, + undefined, + metadata, + )} + + ); + }); + + return renderedNodes.flat(); +}; + +export const LinkElement = ({ + attributes, + data, + children, +}: { + attributes?: { [key: string]: any }; + data?: SlateElementData; + children: JSX.Element[]; +}) => { + const internal_link = data?.link?.internal?.internal_link?.[0]?.['@id']; + const external_link = data?.link?.external?.external_link; + const email = data?.link?.email; + + const target = data?.link?.internal?.target ?? data?.link?.external?.target; + + const href = email + ? `mailto:${email.email_address}${ + email.email_subject ? `?subject=${email.email_subject}` : '' + }` + : external_link || internal_link || data?.url; + + return ( + + {children} + + ); +}; diff --git a/packages/blocks/Title/View.tsx b/packages/blocks/Title/View.tsx new file mode 100644 index 0000000000..6f29450ff5 --- /dev/null +++ b/packages/blocks/Title/View.tsx @@ -0,0 +1,16 @@ +import type { BlockViewProps } from '@plone/types'; + +/** + * View title block component. + * @class View + * @extends Component + */ +const TitleBlockView = ({ properties, metadata }: BlockViewProps) => { + return ( +

+ {(metadata || properties)['title'] || ''} +

+ ); +}; + +export default TitleBlockView; diff --git a/packages/blocks/config/index.ts b/packages/blocks/config/index.ts new file mode 100644 index 0000000000..ab397e56a2 --- /dev/null +++ b/packages/blocks/config/index.ts @@ -0,0 +1,32 @@ +import TitleBlockView from '../Title/View'; +import TextBlockView from '../Text/View'; +import ImageBlockView from '../Image'; +import TeaserBlockView from '../Teaser'; + +export * from './slate'; + +export const blocksConfig = { + title: { + id: 'title', + title: 'Title', + view: TitleBlockView, + }, + + slate: { + id: 'slate', + title: 'Rich text', + view: TextBlockView, + }, + + image: { + id: 'image', + title: 'Image', + view: ImageBlockView, + }, + + teaser: { + id: 'teaser', + title: 'Teaser', + view: TeaserBlockView, + }, +}; diff --git a/packages/blocks/config/slate.tsx b/packages/blocks/config/slate.tsx new file mode 100644 index 0000000000..b92dcb9914 --- /dev/null +++ b/packages/blocks/config/slate.tsx @@ -0,0 +1,49 @@ +//@ts-nocheck +import { LinkElement } from '../Text/slate'; + +export const slate = { + topLevelTargetElements: ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'], + + // Default rendered elements + elements: { + default: ({ attributes, children }) =>

{children}

, + + h1: ({ attributes, children }) =>

{children}

, + h2: ({ attributes, children }) =>

{children}

, + h3: ({ attributes, children }) =>

{children}

, + h4: ({ attributes, children }) =>

{children}

, + + li: ({ attributes, children }) =>
  • {children}
  • , + ol: ({ attributes, children }) =>
      {children}
    , + ul: ({ attributes, children }) => { + return
      {children}
    ; + }, + + div: ({ attributes, children }) =>
    {children}
    , + p: ({ attributes, children }) => { + return

    {children}

    ; + }, + + // While usual slate editor consider these to be Leafs, we treat them as + // inline elements because they can sometimes contain elements (ex: + // + em: ({ children }) => {children}, + i: ({ children }) => {children}, + b: ({ children }) => { + return {children}; + }, + strong: ({ children }) => { + return {children}; + }, + u: ({ children }) => {children}, + s: ({ children }) => {children}, + del: ({ children }) => {children}, + sub: ({ children }) => {children}, + sup: ({ children }) => {children}, + code: ({ children }) => {children}, + + blockquote: ({ children }) =>
    {children}
    , + link: LinkElement, + a: LinkElement, + }, +}; diff --git a/packages/blocks/helpers/blocks.ts b/packages/blocks/helpers/blocks.ts new file mode 100644 index 0000000000..34a10f4ba2 --- /dev/null +++ b/packages/blocks/helpers/blocks.ts @@ -0,0 +1,9 @@ +import type { Content } from '@plone/types'; + +export function hasBlocksData(content: Content) { + return ( + Object.keys(content).find( + (key) => key !== 'volto.blocks' && key.endsWith('blocks'), + ) !== undefined + ); +} diff --git a/packages/blocks/index.ts b/packages/blocks/index.ts new file mode 100644 index 0000000000..033e17a0a9 --- /dev/null +++ b/packages/blocks/index.ts @@ -0,0 +1,10 @@ +import { ConfigType } from '@plone/registry'; +import { slate } from './config/slate'; +import { blocksConfig } from './config'; + +export default function install(config: ConfigType) { + config.settings.slate = slate; + config.blocks.blocksConfig = blocksConfig; + + return config; +} diff --git a/packages/blocks/package.json b/packages/blocks/package.json index 05d801297d..6f7dd4028c 100644 --- a/packages/blocks/package.json +++ b/packages/blocks/package.json @@ -28,7 +28,7 @@ "publishConfig": { "access": "public" }, - "main": "src/index.ts", + "main": "index.ts", "scripts": { "test": "vitest", "dry-release": "release-it --dry-run", @@ -45,7 +45,12 @@ "optional": true } }, - "dependencies": {}, + "dependencies": { + "@plone/components": "workspace:*", + "@plone/registry": "workspace:*", + "@plone/providers": "workspace:*", + "clsx": "^2.1.1" + }, "devDependencies": { "@plone/registry": "workspace:*", "@plone/types": "workspace:*", diff --git a/packages/blocks/tsconfig.json b/packages/blocks/tsconfig.json index 86da1e79f4..2965402840 100644 --- a/packages/blocks/tsconfig.json +++ b/packages/blocks/tsconfig.json @@ -1,6 +1,6 @@ { "extends": "tsconfig/react-library.json", - "include": ["src", "src/**/*.js"], + "include": ["**/*.ts", "**/*.tsx"], "exclude": [ "node_modules", "build", diff --git a/packages/components/news/6409.breaking b/packages/components/news/6409.breaking new file mode 100644 index 0000000000..e4fcab28bf --- /dev/null +++ b/packages/components/news/6409.breaking @@ -0,0 +1 @@ +The `RenderBlocks` have been moved to `@plone/blocks`. @sneridagh diff --git a/packages/components/src/index.ts b/packages/components/src/index.ts index a7e2df464f..7b74bd6cc3 100644 --- a/packages/components/src/index.ts +++ b/packages/components/src/index.ts @@ -52,9 +52,6 @@ export { ToggleButton } from './components/ToggleButton/ToggleButton'; export { Toolbar } from './components/Toolbar/Toolbar'; export { Tooltip } from './components/Tooltip/Tooltip'; -export { RenderBlocks } from './views/RenderBlocks/RenderBlocks'; -export { DefaultBlockView } from './views/RenderBlocks/DefaultBlockView'; - // Quanta components export { QuantaTextField } from './components/quanta/TextField/TextField'; export { QuantaTextAreaField } from './components/quanta/TextAreaField/TextAreaField'; diff --git a/packages/components/src/styles/basic/BlockToolbar.css b/packages/components/src/styles/basic/BlockToolbar.css index e29d2c04bc..19c101a290 100644 --- a/packages/components/src/styles/basic/BlockToolbar.css +++ b/packages/components/src/styles/basic/BlockToolbar.css @@ -4,49 +4,51 @@ @import './Menu.css'; @import './theme.css'; -.blocks-toolbar { - display: flex; - flex-wrap: wrap; - - padding: 6px; - border-radius: 6px; - box-shadow: - 0px 6px 12px 0px rgba(2, 19, 34, 0.06), - 0px 9px 18px 0px rgba(2, 19, 34, 0.18); - gap: 5px; - - &[data-orientation='horizontal'] { - flex-direction: row; +@layer plone-components { + .blocks-toolbar { + display: flex; + flex-wrap: wrap; + + padding: 6px; + border-radius: 6px; + box-shadow: + 0px 6px 12px 0px rgba(2, 19, 34, 0.06), + 0px 9px 18px 0px rgba(2, 19, 34, 0.18); + gap: 5px; + + &[data-orientation='horizontal'] { + flex-direction: row; + } + .react-aria-Group { + display: contents; + } } - .react-aria-Group { - display: contents; - } -} -.react-aria-Separator { - align-self: stretch; - background-color: var(--border-color); + .react-aria-Separator { + align-self: stretch; + background-color: var(--border-color); - &[aria-orientation='vertical'] { - width: 1px; - margin: 0px 10px; + &[aria-orientation='vertical'] { + width: 1px; + margin: 0px 10px; + } } -} -.blocks-toolbar { - width: fit-content; + .blocks-toolbar { + width: fit-content; - &[data-orientation='vertical'] { - flex-direction: column; - align-items: flex-start; + &[data-orientation='vertical'] { + flex-direction: column; + align-items: flex-start; + } } -} -.react-aria-Separator { - &:not([aria-orientation='vertical']) { - width: 100%; - height: 1px; - border: none; - margin: 10px 0; + .react-aria-Separator { + &:not([aria-orientation='vertical']) { + width: 100%; + height: 1px; + border: none; + margin: 10px 0; + } } } diff --git a/packages/components/src/styles/basic/Breadcrumbs.css b/packages/components/src/styles/basic/Breadcrumbs.css index 6d62bb8609..0aaa86cac1 100644 --- a/packages/components/src/styles/basic/Breadcrumbs.css +++ b/packages/components/src/styles/basic/Breadcrumbs.css @@ -1,58 +1,60 @@ @import './theme.css'; -.react-aria-Breadcrumbs { - display: flex; - align-items: center; - padding: 0; - margin: 0; - color: var(--text-color); - font-size: 18px; - list-style: none; - - svg.home-icon { - margin-top: -5px; - margin-right: 5px; - vertical-align: middle; - } +@layer plone-components { + .react-aria-Breadcrumbs { + display: flex; + align-items: center; + padding: 0; + margin: 0; + color: var(--text-color); + font-size: 18px; + list-style: none; + + svg.home-icon { + margin-top: -5px; + margin-right: 5px; + vertical-align: middle; + } - .react-aria-Breadcrumb:not(:last-child)::after { - padding: 0 5px; - alt: ' '; - content: '›'; - content: '›' / ''; - } + .react-aria-Breadcrumb:not(:last-child)::after { + padding: 0 5px; + alt: ' '; + content: '›'; + content: '›' / ''; + } - .react-aria-Link { - position: relative; - color: var(--link-color-secondary); - cursor: pointer; - outline: none; - text-decoration: none; + .react-aria-Link { + position: relative; + color: var(--link-color-secondary); + cursor: pointer; + outline: none; + text-decoration: none; - &[data-hovered] { - text-decoration: underline; - } + &[data-hovered] { + text-decoration: underline; + } - &[data-current] { - color: var(--text-color); - font-weight: bold; - } + &[data-current] { + color: var(--text-color); + font-weight: bold; + } - &[data-focus-visible]:after { - position: absolute; - border: 2px solid var(--focus-ring-color); - border-radius: 6px; - content: ''; - inset: -2px -4px; + &[data-focus-visible]:after { + position: absolute; + border: 2px solid var(--focus-ring-color); + border-radius: 6px; + content: ''; + inset: -2px -4px; + } } - } - .react-aria-Link { - &[data-disabled] { - cursor: default; + .react-aria-Link { + &[data-disabled] { + cursor: default; - &:not([data-current]) { - color: var(--text-color-disabled); + &:not([data-current]) { + color: var(--text-color-disabled); + } } } } diff --git a/packages/components/src/styles/basic/Calendar.css b/packages/components/src/styles/basic/Calendar.css index 88676235d4..ec81b10c4d 100644 --- a/packages/components/src/styles/basic/Calendar.css +++ b/packages/components/src/styles/basic/Calendar.css @@ -1,81 +1,83 @@ @import './Button.css'; @import './theme.css'; -.react-aria-Calendar { - width: fit-content; - max-width: 100%; - color: var(--text-color); +@layer plone-components { + .react-aria-Calendar { + width: fit-content; + max-width: 100%; + color: var(--text-color); - header { - display: flex; - align-items: center; - margin: 0 4px 0.5rem 4px; + header { + display: flex; + align-items: center; + margin: 0 4px 0.5rem 4px; - .react-aria-Heading { - flex: 1; - margin: 0; - font-size: 1.375rem; - text-align: center; + .react-aria-Heading { + flex: 1; + margin: 0; + font-size: 1.375rem; + text-align: center; + } } - } - .react-aria-Button { - width: 2rem; - height: 2rem; - padding: 0; - } + .react-aria-Button { + width: 2rem; + height: 2rem; + padding: 0; + } - .react-aria-CalendarCell { - width: 2rem; - border-radius: 6px; - margin: 1px; - cursor: default; - forced-color-adjust: none; - line-height: 2rem; - outline: none; - text-align: center; + .react-aria-CalendarCell { + width: 2rem; + border-radius: 6px; + margin: 1px; + cursor: default; + forced-color-adjust: none; + line-height: 2rem; + outline: none; + text-align: center; - &[data-outside-month] { - display: none; - } + &[data-outside-month] { + display: none; + } - &[data-pressed] { - background: var(--gray-100); - } + &[data-pressed] { + background: var(--gray-100); + } - &[data-focus-visible] { - outline: 2px solid var(--focus-ring-color); - outline-offset: 2px; - } + &[data-focus-visible] { + outline: 2px solid var(--focus-ring-color); + outline-offset: 2px; + } - &[data-selected] { - background: var(--highlight-background); - color: var(--highlight-foreground); + &[data-selected] { + background: var(--highlight-background); + color: var(--highlight-foreground); + } } - } - .react-aria-CalendarCell { - &[data-disabled] { - color: var(--text-color-disabled); + .react-aria-CalendarCell { + &[data-disabled] { + color: var(--text-color-disabled); + } } - } - .react-aria-CalendarCell { - &[data-unavailable] { - color: var(--color-invalid); - text-decoration: line-through; + .react-aria-CalendarCell { + &[data-unavailable] { + color: var(--color-invalid); + text-decoration: line-through; + } } - } - .react-aria-CalendarCell { - &[data-invalid] { - background: var(--color-invalid); - color: var(--highlight-foreground); + .react-aria-CalendarCell { + &[data-invalid] { + background: var(--color-invalid); + color: var(--highlight-foreground); + } } - } - [slot='errorMessage'] { - color: var(--color-invalid); - font-size: 12px; + [slot='errorMessage'] { + color: var(--color-invalid); + font-size: 12px; + } } } diff --git a/packages/components/src/styles/basic/Checkbox.css b/packages/components/src/styles/basic/Checkbox.css index 57d475fd1d..46f856ac1d 100644 --- a/packages/components/src/styles/basic/Checkbox.css +++ b/packages/components/src/styles/basic/Checkbox.css @@ -1,123 +1,125 @@ @import './theme.css'; -.react-aria-Checkbox { - --selected-color: var(--highlight-background); - --selected-color-pressed: var(--highlight-background-pressed); - --checkmark-color: var(--highlight-foreground); - - display: flex; - align-items: center; - color: var(--text-color); - font-size: 1.143rem; - forced-color-adjust: none; - gap: 0.571rem; - - .checkbox { +@layer plone-components { + .react-aria-Checkbox { + --selected-color: var(--highlight-background); + --selected-color-pressed: var(--highlight-background-pressed); + --checkmark-color: var(--highlight-foreground); + display: flex; - width: 1.143rem; - height: 1.143rem; align-items: center; - justify-content: center; - border: 2px solid var(--border-color); - border-radius: 4px; - transition: all 200ms; - } - - svg { - width: 1rem; - height: 1rem; - fill: none; - stroke: var(--checkmark-color); - stroke-dasharray: 22px; - stroke-dashoffset: 66; - stroke-width: 3px; - transition: all 200ms; - } - - &[data-pressed] .checkbox { - border-color: var(--border-color-pressed); - } + color: var(--text-color); + font-size: 1.143rem; + forced-color-adjust: none; + gap: 0.571rem; - &[data-focus-visible] .checkbox { - outline: 2px solid var(--focus-ring-color); - outline-offset: 2px; - } - - &[data-selected], - &[data-indeterminate] { .checkbox { - border-color: var(--selected-color); - background: var(--selected-color); + display: flex; + width: 1.143rem; + height: 1.143rem; + align-items: center; + justify-content: center; + border: 2px solid var(--border-color); + border-radius: 4px; + transition: all 200ms; } - &[data-pressed] .checkbox { - border-color: var(--selected-color-pressed); - background: var(--selected-color-pressed); + svg { + width: 1rem; + height: 1rem; + fill: none; + stroke: var(--checkmark-color); + stroke-dasharray: 22px; + stroke-dashoffset: 66; + stroke-width: 3px; + transition: all 200ms; } - svg { - stroke-dashoffset: 44; + &[data-pressed] .checkbox { + border-color: var(--border-color-pressed); } - } - &[data-indeterminate] { - & svg { - fill: var(--checkmark-color); - stroke: none; + &[data-focus-visible] .checkbox { + outline: 2px solid var(--focus-ring-color); + outline-offset: 2px; } - } - &[data-invalid] { - color: var(--color-invalid); + &[data-selected], + &[data-indeterminate] { + .checkbox { + border-color: var(--selected-color); + background: var(--selected-color); + } - .checkbox { - --checkmark-color: var(--gray-50); - border-color: var(--color-invalid); - } + &[data-pressed] .checkbox { + border-color: var(--selected-color-pressed); + background: var(--selected-color-pressed); + } - &[data-pressed] .checkbox { - border-color: var(--color-pressed-invalid); + svg { + stroke-dashoffset: 44; + } } - &[data-selected], &[data-indeterminate] { + & svg { + fill: var(--checkmark-color); + stroke: none; + } + } + + &[data-invalid] { + color: var(--color-invalid); + .checkbox { - background: var(--color-invalid); + --checkmark-color: var(--gray-50); + border-color: var(--color-invalid); } &[data-pressed] .checkbox { - background: var(--color-pressed-invalid); + border-color: var(--color-pressed-invalid); } - } - } - &[data-disabled] { - color: var(--text-color-disabled); + &[data-selected], + &[data-indeterminate] { + .checkbox { + background: var(--color-invalid); + } - .checkbox { - border-color: var(--border-color-disabled); + &[data-pressed] .checkbox { + background: var(--color-pressed-invalid); + } + } } - & + [slot='description'] { + &[data-disabled] { color: var(--text-color-disabled); + + .checkbox { + border-color: var(--border-color-disabled); + } + + & + [slot='description'] { + color: var(--text-color-disabled); + } } - } - &[data-required]::after { - content: url('data:image/svg+xml; utf8, '); + &[data-required]::after { + content: url('data:image/svg+xml; utf8, '); + } } -} -.react-aria-CheckboxField { - [slot='description'] { - /* For now, we want the error in under the description */ - display: block; - padding-top: 3px; - font-size: 12px; - } + .react-aria-CheckboxField { + [slot='description'] { + /* For now, we want the error in under the description */ + display: block; + padding-top: 3px; + font-size: 12px; + } - [slot='errorMessage'] { - color: var(--color-invalid); - font-size: 12px; + [slot='errorMessage'] { + color: var(--color-invalid); + font-size: 12px; + } } } diff --git a/packages/components/src/styles/basic/CheckboxGroup.css b/packages/components/src/styles/basic/CheckboxGroup.css index d2a6801dd9..1939115950 100644 --- a/packages/components/src/styles/basic/CheckboxGroup.css +++ b/packages/components/src/styles/basic/CheckboxGroup.css @@ -3,18 +3,20 @@ @import './Button.css'; @import './theme.css'; -.react-aria-CheckboxGroup { - display: flex; - flex-direction: column; - color: var(--text-color); - gap: 0.571rem; +@layer plone-components { + .react-aria-CheckboxGroup { + display: flex; + flex-direction: column; + color: var(--text-color); + gap: 0.571rem; - .react-aria-FieldError { - color: var(--color-invalid); - font-size: 12px; - } + .react-aria-FieldError { + color: var(--color-invalid); + font-size: 12px; + } - [slot='description'] { - font-size: 12px; + [slot='description'] { + font-size: 12px; + } } } diff --git a/packages/components/src/styles/basic/ColorArea.css b/packages/components/src/styles/basic/ColorArea.css index a241aee10f..e5a81b7512 100644 --- a/packages/components/src/styles/basic/ColorArea.css +++ b/packages/components/src/styles/basic/ColorArea.css @@ -1,34 +1,36 @@ @import './ColorSlider.css'; -.react-aria-ColorArea { - width: 192px; - height: 192px; - flex-shrink: 0; - border-radius: 4px; -} +@layer plone-components { + .react-aria-ColorArea { + width: 192px; + height: 192px; + flex-shrink: 0; + border-radius: 4px; + } -.react-aria-ColorThumb { - width: 20px; - height: 20px; - box-sizing: border-box; - border: 2px solid white; - border-radius: 50%; - box-shadow: - 0 0 0 1px black, - inset 0 0 0 1px black; + .react-aria-ColorThumb { + width: 20px; + height: 20px; + box-sizing: border-box; + border: 2px solid white; + border-radius: 50%; + box-shadow: + 0 0 0 1px black, + inset 0 0 0 1px black; - &[data-focus-visible] { - width: 24px; - height: 24px; + &[data-focus-visible] { + width: 24px; + height: 24px; + } } -} - -.react-aria-ColorArea { - &[data-disabled] { - background: gray !important; - .react-aria-ColorThumb { + .react-aria-ColorArea { + &[data-disabled] { background: gray !important; + + .react-aria-ColorThumb { + background: gray !important; + } } } } diff --git a/packages/components/src/styles/basic/ColorField.css b/packages/components/src/styles/basic/ColorField.css index bcb29a5273..41442cbbe8 100644 --- a/packages/components/src/styles/basic/ColorField.css +++ b/packages/components/src/styles/basic/ColorField.css @@ -2,48 +2,50 @@ @import './Form.css'; @import './theme.css'; -.react-aria-ColorField { - display: flex; - flex-direction: column; - color: var(--text-color); +@layer plone-components { + .react-aria-ColorField { + display: flex; + flex-direction: column; + color: var(--text-color); - .react-aria-Input { - width: 100%; - max-width: 12ch; - box-sizing: border-box; - padding: 0.286rem; - border: 1px solid var(--border-color); - border-radius: 6px; - margin: 0; - background: var(--field-background); - color: var(--field-text-color); - font-size: 1.143rem; + .react-aria-Input { + width: 100%; + max-width: 12ch; + box-sizing: border-box; + padding: 0.286rem; + border: 1px solid var(--border-color); + border-radius: 6px; + margin: 0; + background: var(--field-background); + color: var(--field-text-color); + font-size: 1.143rem; - &[data-focused] { - outline: 2px solid var(--focus-ring-color); - outline-offset: -1px; + &[data-focused] { + outline: 2px solid var(--focus-ring-color); + outline-offset: -1px; + } } - } - &[data-invalid] { - .react-aria-Input { - border-color: var(--color-invalid); + &[data-invalid] { + .react-aria-Input { + border-color: var(--color-invalid); + } } - } - .react-aria-FieldError { - color: var(--color-invalid); - font-size: 12px; - } + .react-aria-FieldError { + color: var(--color-invalid); + font-size: 12px; + } - [slot='description'] { - font-size: 12px; - } + [slot='description'] { + font-size: 12px; + } - .react-aria-Input { - &[data-disabled] { - border-color: var(--border-color-disabled); - color: var(--text-color-disabled); + .react-aria-Input { + &[data-disabled] { + border-color: var(--border-color-disabled); + color: var(--text-color-disabled); + } } } } diff --git a/packages/components/src/styles/basic/ColorPicker.css b/packages/components/src/styles/basic/ColorPicker.css index e8ccca99b8..9bfd25e9cb 100644 --- a/packages/components/src/styles/basic/ColorPicker.css +++ b/packages/components/src/styles/basic/ColorPicker.css @@ -10,34 +10,36 @@ @import './Select.css'; @import './theme.css'; -.color-picker { - display: flex; - align-items: center; - padding: 0; - border: none; - border-radius: 4px; - appearance: none; - background: none; - color: var(--text-color); - font-size: 1rem; - gap: 8px; - outline: none; - vertical-align: middle; +@layer plone-components { + .color-picker { + display: flex; + align-items: center; + padding: 0; + border: none; + border-radius: 4px; + appearance: none; + background: none; + color: var(--text-color); + font-size: 1rem; + gap: 8px; + outline: none; + vertical-align: middle; - &[data-focus-visible] { - outline: 2px solid var(--focus-ring-color); - outline-offset: 2px; + &[data-focus-visible] { + outline: 2px solid var(--focus-ring-color); + outline-offset: 2px; + } } -} -.color-picker-dialog { - display: flex; - overflow: auto; - min-width: 192px; - max-height: inherit; - box-sizing: border-box; - flex-direction: column; - padding: 15px; - gap: 8px; - outline: none; + .color-picker-dialog { + display: flex; + overflow: auto; + min-width: 192px; + max-height: inherit; + box-sizing: border-box; + flex-direction: column; + padding: 15px; + gap: 8px; + outline: none; + } } diff --git a/packages/components/src/styles/basic/ColorSlider.css b/packages/components/src/styles/basic/ColorSlider.css index 63f3d432a1..f61f4b0d5e 100644 --- a/packages/components/src/styles/basic/ColorSlider.css +++ b/packages/components/src/styles/basic/ColorSlider.css @@ -1,80 +1,82 @@ -.react-aria-ColorSlider { - display: grid; - max-width: 300px; - gap: 4px; - grid-template-areas: - 'label output' - 'track track'; - grid-template-columns: 1fr auto; +@layer plone-components { + .react-aria-ColorSlider { + display: grid; + max-width: 300px; + gap: 4px; + grid-template-areas: + 'label output' + 'track track'; + grid-template-columns: 1fr auto; - .react-aria-Label { - grid-area: label; - } - - .react-aria-SliderOutput { - grid-area: output; - } + .react-aria-Label { + grid-area: label; + } - .react-aria-SliderTrack { - border-radius: 4px; - grid-area: track; - } + .react-aria-SliderOutput { + grid-area: output; + } - &[data-orientation='horizontal'] { .react-aria-SliderTrack { - height: 28px; + border-radius: 4px; + grid-area: track; } - .react-aria-ColorThumb { - top: 50%; + &[data-orientation='horizontal'] { + .react-aria-SliderTrack { + height: 28px; + } + + .react-aria-ColorThumb { + top: 50%; + } } } -} -.react-aria-ColorThumb { - width: 20px; - height: 20px; - box-sizing: border-box; - border: 2px solid white; - border-radius: 50%; - box-shadow: - 0 0 0 1px black, - inset 0 0 0 1px black; + .react-aria-ColorThumb { + width: 20px; + height: 20px; + box-sizing: border-box; + border: 2px solid white; + border-radius: 50%; + box-shadow: + 0 0 0 1px black, + inset 0 0 0 1px black; - &[data-focus-visible] { - width: 24px; - height: 24px; + &[data-focus-visible] { + width: 24px; + height: 24px; + } } -} -.react-aria-ColorSlider { - &[data-orientation='vertical'] { - display: block; - height: 150px; + .react-aria-ColorSlider { + &[data-orientation='vertical'] { + display: block; + height: 150px; - .react-aria-Label, - .react-aria-SliderOutput { - display: none; - } + .react-aria-Label, + .react-aria-SliderOutput { + display: none; + } - .react-aria-SliderTrack { - width: 28px; - height: 100%; - } + .react-aria-SliderTrack { + width: 28px; + height: 100%; + } - .react-aria-ColorThumb { - left: 50%; + .react-aria-ColorThumb { + left: 50%; + } } - } - &[data-disabled] { - .react-aria-SliderTrack { - background: gray !important; - } + &[data-disabled] { + .react-aria-SliderTrack { + background: gray !important; + } - .react-aria-ColorThumb { - background: gray !important; - opacity: 0.5; + .react-aria-ColorThumb { + background: gray !important; + opacity: 0.5; + } } } } diff --git a/packages/components/src/styles/basic/ColorSwatch.css b/packages/components/src/styles/basic/ColorSwatch.css index 3713b3807b..f617ec5341 100644 --- a/packages/components/src/styles/basic/ColorSwatch.css +++ b/packages/components/src/styles/basic/ColorSwatch.css @@ -1,8 +1,10 @@ @import './ColorSlider.css'; -.react-aria-ColorSwatch { - width: 32px; - height: 32px; - border-radius: 4px; - box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.1); +@layer plone-components { + .react-aria-ColorSwatch { + width: 32px; + height: 32px; + border-radius: 4px; + box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.1); + } } diff --git a/packages/components/src/styles/basic/ColorSwatchPicker.css b/packages/components/src/styles/basic/ColorSwatchPicker.css index 657d836443..5a82e24a96 100644 --- a/packages/components/src/styles/basic/ColorSwatchPicker.css +++ b/packages/components/src/styles/basic/ColorSwatchPicker.css @@ -2,41 +2,43 @@ @import './ColorField.css'; @import './theme.css'; -.react-aria-ColorSwatchPicker { - display: flex; - flex-wrap: wrap; - gap: 8px; -} +@layer plone-components { + .react-aria-ColorSwatchPicker { + display: flex; + flex-wrap: wrap; + gap: 8px; + } -.react-aria-ColorSwatchPickerItem { - position: relative; - width: fit-content; - border-radius: 4px; - forced-color-adjust: none; - outline: none; + .react-aria-ColorSwatchPickerItem { + position: relative; + width: fit-content; + border-radius: 4px; + forced-color-adjust: none; + outline: none; - &[data-focus-visible] { - outline: 2px solid var(--focus-ring-color); - outline-offset: 2px; - } + &[data-focus-visible] { + outline: 2px solid var(--focus-ring-color); + outline-offset: 2px; + } - &[data-selected]::after { - position: absolute; - border: 2px solid black; - border-radius: inherit; - content: ''; - inset: 0; - outline: 2px solid white; - outline-offset: -4px; - } + &[data-selected]::after { + position: absolute; + border: 2px solid black; + border-radius: inherit; + content: ''; + inset: 0; + outline: 2px solid white; + outline-offset: -4px; + } - &[data-disabled] { - opacity: 0.2; + &[data-disabled] { + opacity: 0.2; + } } -} -.react-aria-ColorSwatchPicker { - &[data-layout='stack'] { - flex-direction: column; + .react-aria-ColorSwatchPicker { + &[data-layout='stack'] { + flex-direction: column; + } } } diff --git a/packages/components/src/styles/basic/ColorWheel.css b/packages/components/src/styles/basic/ColorWheel.css index 429e59dc9c..c7a953896d 100644 --- a/packages/components/src/styles/basic/ColorWheel.css +++ b/packages/components/src/styles/basic/ColorWheel.css @@ -1,28 +1,30 @@ -.react-aria-ColorThumb { - width: 20px; - height: 20px; - box-sizing: border-box; - border: 2px solid white; - border-radius: 50%; - box-shadow: - 0 0 0 1px black, - inset 0 0 0 1px black; +@layer plone-components { + .react-aria-ColorThumb { + width: 20px; + height: 20px; + box-sizing: border-box; + border: 2px solid white; + border-radius: 50%; + box-shadow: + 0 0 0 1px black, + inset 0 0 0 1px black; - &[data-focus-visible] { - width: 24px; - height: 24px; + &[data-focus-visible] { + width: 24px; + height: 24px; + } } -} -.react-aria-ColorWheel { - &[data-disabled] { - .react-aria-ColorWheelTrack { - background: gray !important; - } + .react-aria-ColorWheel { + &[data-disabled] { + .react-aria-ColorWheelTrack { + background: gray !important; + } - .react-aria-ColorThumb { - background: gray !important; - opacity: 0.5; + .react-aria-ColorThumb { + background: gray !important; + opacity: 0.5; + } } } } diff --git a/packages/components/src/styles/basic/ComboBox.css b/packages/components/src/styles/basic/ComboBox.css index 770dbbfc57..fc597eb7ee 100644 --- a/packages/components/src/styles/basic/ComboBox.css +++ b/packages/components/src/styles/basic/ComboBox.css @@ -5,121 +5,123 @@ @import './Button.css'; @import './theme.css'; -.react-aria-ComboBox { - color: var(--text-color); - - .react-aria-Input { - padding: 0.286rem 2rem 0.286rem 0.571rem; - border: 1px solid var(--border-color); - border-radius: 6px; - margin: 0; - background: var(--field-background); - color: var(--field-text-color); - font-size: 1.072rem; - vertical-align: middle; - - &[data-focused] { - outline: none; - outline: 2px solid var(--focus-ring-color); - outline-offset: -1px; +@layer plone-components { + .react-aria-ComboBox { + color: var(--text-color); + + .react-aria-Input { + padding: 0.286rem 2rem 0.286rem 0.571rem; + border: 1px solid var(--border-color); + border-radius: 6px; + margin: 0; + background: var(--field-background); + color: var(--field-text-color); + font-size: 1.072rem; + vertical-align: middle; + + &[data-focused] { + outline: none; + outline: 2px solid var(--focus-ring-color); + outline-offset: -1px; + } } - } - .react-aria-Button { - width: 1.429rem; - height: 1.429rem; - padding: 0; - border: none; - border-radius: 4px; - margin-left: -1.714rem; - background: var(--highlight-background); - color: var(--highlight-foreground); - cursor: default; - font-size: 0.857rem; - forced-color-adjust: none; - - &[data-pressed] { + .react-aria-Button { + width: 1.429rem; + height: 1.429rem; + padding: 0; + border: none; + border-radius: 4px; + margin-left: -1.714rem; background: var(--highlight-background); - box-shadow: none; + color: var(--highlight-foreground); + cursor: default; + font-size: 0.857rem; + forced-color-adjust: none; + + &[data-pressed] { + background: var(--highlight-background); + box-shadow: none; + } } } -} -.react-aria-Popover[data-trigger='ComboBox'] { - width: var(--trigger-width); + .react-aria-Popover[data-trigger='ComboBox'] { + width: var(--trigger-width); - .react-aria-ListBox { - display: block; - width: unset; - min-height: unset; - max-height: inherit; - border: none; + .react-aria-ListBox { + display: block; + width: unset; + min-height: unset; + max-height: inherit; + border: none; - .react-aria-Header { - padding-left: 1.571rem; + .react-aria-Header { + padding-left: 1.571rem; + } } - } - .react-aria-ListBoxItem { - padding: 0.286rem 0.571rem 0.286rem 1.571rem; + .react-aria-ListBoxItem { + padding: 0.286rem 0.571rem 0.286rem 1.571rem; - &[data-focus-visible] { - outline: none; - } + &[data-focus-visible] { + outline: none; + } - &[data-selected] { - background: unset; - color: var(--text-color); - font-weight: 600; - - &::before { - position: absolute; - top: 4px; - left: 4px; - alt: ' '; - content: '✓'; - content: '✓' / ''; + &[data-selected] { + background: unset; + color: var(--text-color); + font-weight: 600; + + &::before { + position: absolute; + top: 4px; + left: 4px; + alt: ' '; + content: '✓'; + content: '✓' / ''; + } } - } - &[data-focused], - &[data-pressed] { - background: var(--highlight-background); - color: var(--highlight-foreground); + &[data-focused], + &[data-pressed] { + background: var(--highlight-background); + color: var(--highlight-foreground); + } } } -} -.react-aria-ListBoxItem[href] { - cursor: pointer; - text-decoration: none; -} + .react-aria-ListBoxItem[href] { + cursor: pointer; + text-decoration: none; + } -.react-aria-ComboBox { - .react-aria-Input { - &[data-disabled] { - border-color: var(--border-color-disabled); + .react-aria-ComboBox { + .react-aria-Input { + &[data-disabled] { + border-color: var(--border-color-disabled); + } } - } - .react-aria-Button { - &[data-disabled] { - background: var(--border-color-disabled); + .react-aria-Button { + &[data-disabled] { + background: var(--border-color-disabled); + } } - } - .react-aria-Input { - &[data-invalid]:not([data-focused]) { - border-color: var(--color-invalid); + .react-aria-Input { + &[data-invalid]:not([data-focused]) { + border-color: var(--color-invalid); + } } - } - .react-aria-FieldError { - color: var(--color-invalid); - font-size: 12px; - } + .react-aria-FieldError { + color: var(--color-invalid); + font-size: 12px; + } - [slot='description'] { - font-size: 12px; + [slot='description'] { + font-size: 12px; + } } } diff --git a/packages/components/src/styles/basic/Container.css b/packages/components/src/styles/basic/Container.css index 4d18f27309..f7448a20b2 100644 --- a/packages/components/src/styles/basic/Container.css +++ b/packages/components/src/styles/basic/Container.css @@ -1,15 +1,17 @@ -.q.container { - container-type: inline-size; +@layer plone-components { + .q.container { + container-type: inline-size; - &.layout { - max-width: var(--layout-container-width); - margin-right: auto; - margin-left: auto; - } + &.layout { + max-width: var(--layout-container-width); + margin-right: auto; + margin-left: auto; + } - &.narrow { - max-width: var(--narrow-container-width); - margin-right: auto; - margin-left: auto; + &.narrow { + max-width: var(--narrow-container-width); + margin-right: auto; + margin-left: auto; + } } } diff --git a/packages/components/src/styles/basic/DateField.css b/packages/components/src/styles/basic/DateField.css index 606c6e5450..d0220e4999 100644 --- a/packages/components/src/styles/basic/DateField.css +++ b/packages/components/src/styles/basic/DateField.css @@ -2,67 +2,69 @@ @import './Button.css'; @import './theme.css'; -.react-aria-DateField { - color: var(--text-color); -} - -.react-aria-DateInput { - display: flex; - width: fit-content; - min-width: 150px; - padding: 4px; - border: 1px solid var(--border-color); - border-radius: 6px; - background: var(--field-background); - forced-color-adjust: none; - white-space: nowrap; - - &[data-focus-within] { - outline: 2px solid var(--focus-ring-color); - outline-offset: -1px; +@layer plone-components { + .react-aria-DateField { + color: var(--text-color); } -} -.react-aria-DateSegment { - padding: 0 2px; - color: var(--text-color); - font-variant-numeric: tabular-nums; - text-align: end; + .react-aria-DateInput { + display: flex; + width: fit-content; + min-width: 150px; + padding: 4px; + border: 1px solid var(--border-color); + border-radius: 6px; + background: var(--field-background); + forced-color-adjust: none; + white-space: nowrap; - &[data-type='literal'] { - padding: 0; + &[data-focus-within] { + outline: 2px solid var(--focus-ring-color); + outline-offset: -1px; + } } - &[data-placeholder] { - color: var(--text-color-placeholder); - font-style: italic; - } + .react-aria-DateSegment { + padding: 0 2px; + color: var(--text-color); + font-variant-numeric: tabular-nums; + text-align: end; - &:focus { - border-radius: 4px; - background: var(--highlight-background); - caret-color: transparent; - color: var(--highlight-foreground); - outline: none; - } + &[data-type='literal'] { + padding: 0; + } - &[data-invalid] { - color: var(--color-invalid); + &[data-placeholder] { + color: var(--text-color-placeholder); + font-style: italic; + } &:focus { - background: var(--highlight-background-invalid); + border-radius: 4px; + background: var(--highlight-background); + caret-color: transparent; color: var(--highlight-foreground); + outline: none; } - } -} -.react-aria-DateField { - .react-aria-FieldError { - color: var(--color-invalid); - font-size: 12px; + &[data-invalid] { + color: var(--color-invalid); + + &:focus { + background: var(--highlight-background-invalid); + color: var(--highlight-foreground); + } + } } - [slot='description'] { - font-size: 12px; + .react-aria-DateField { + .react-aria-FieldError { + color: var(--color-invalid); + font-size: 12px; + } + + [slot='description'] { + font-size: 12px; + } } } diff --git a/packages/components/src/styles/basic/DatePicker.css b/packages/components/src/styles/basic/DatePicker.css index 667472632e..dcfd458c83 100644 --- a/packages/components/src/styles/basic/DatePicker.css +++ b/packages/components/src/styles/basic/DatePicker.css @@ -6,66 +6,68 @@ @import './Form.css'; @import './theme.css'; -.react-aria-DatePicker { - color: var(--text-color); +@layer plone-components { + .react-aria-DatePicker { + color: var(--text-color); - .react-aria-Group { - display: flex; - width: fit-content; - align-items: center; - } - - .react-aria-Button { - width: 1.429rem; - height: 1.429rem; - box-sizing: content-box; - padding: 0; - border: 2px solid var(--field-background); - border: none; - border-radius: 4px; - margin-left: -1.929rem; - background: var(--highlight-background); - color: var(--highlight-foreground); - font-size: 0.857rem; - forced-color-adjust: none; + .react-aria-Group { + display: flex; + width: fit-content; + align-items: center; + } - &[data-pressed] { + .react-aria-Button { + width: 1.429rem; + height: 1.429rem; + box-sizing: content-box; + padding: 0; + border: 2px solid var(--field-background); + border: none; + border-radius: 4px; + margin-left: -1.929rem; background: var(--highlight-background); - box-shadow: none; + color: var(--highlight-foreground); + font-size: 0.857rem; + forced-color-adjust: none; + + &[data-pressed] { + background: var(--highlight-background); + box-shadow: none; + } + + &[data-focus-visible] { + outline: 2px solid var(--focus-ring-color); + outline-offset: 2px; + } } - &[data-focus-visible] { - outline: 2px solid var(--focus-ring-color); - outline-offset: 2px; + .react-aria-DateInput { + padding: 4px 2.5rem 4px 8px; } } - .react-aria-DateInput { - padding: 4px 2.5rem 4px 8px; + .react-aria-Popover[data-trigger='DatePicker'] { + max-width: unset; } -} -.react-aria-Popover[data-trigger='DatePicker'] { - max-width: unset; -} - -.react-aria-DatePicker { - &[data-invalid] { - .react-aria-DateInput:after { - flex: 1; - alt: ' '; - content: '🚫' / ''; - content: '🚫'; - text-align: end; + .react-aria-DatePicker { + &[data-invalid] { + .react-aria-DateInput:after { + flex: 1; + alt: ' '; + content: '🚫' / ''; + content: '🚫'; + text-align: end; + } } - } - .react-aria-FieldError { - color: var(--color-invalid); - font-size: 12px; - } + .react-aria-FieldError { + color: var(--color-invalid); + font-size: 12px; + } - [slot='description'] { - font-size: 12px; + [slot='description'] { + font-size: 12px; + } } } diff --git a/packages/components/src/styles/basic/DateRangePicker.css b/packages/components/src/styles/basic/DateRangePicker.css index cee0dd8fe6..bb44b073c1 100644 --- a/packages/components/src/styles/basic/DateRangePicker.css +++ b/packages/components/src/styles/basic/DateRangePicker.css @@ -6,99 +6,101 @@ @import './Form.css'; @import './theme.css'; -.react-aria-DateRangePicker { - color: var(--text-color); +@layer plone-components { + .react-aria-DateRangePicker { + color: var(--text-color); - .react-aria-Group { - position: relative; - display: flex; - overflow: auto; - width: fit-content; - min-width: 220px; - max-width: 100%; - box-sizing: border-box; - align-items: center; - padding: 4px 4px 4px 8px; - border: 1px solid var(--border-color); - border-radius: 6px; - background: var(--field-background); - white-space: nowrap; + .react-aria-Group { + position: relative; + display: flex; + overflow: auto; + width: fit-content; + min-width: 220px; + max-width: 100%; + box-sizing: border-box; + align-items: center; + padding: 4px 4px 4px 8px; + border: 1px solid var(--border-color); + border-radius: 6px; + background: var(--field-background); + white-space: nowrap; - &[data-pressed] { - background: var(--highlight-background); - box-shadow: none; + &[data-pressed] { + background: var(--highlight-background); + box-shadow: none; + } + + &[data-focus-within] { + outline: 2px solid var(--focus-ring-color); + outline-offset: -1px; + } } - &[data-focus-within] { - outline: 2px solid var(--focus-ring-color); - outline-offset: -1px; + [slot='start'] + span { + padding: 0 4px; } - } - [slot='start'] + span { - padding: 0 4px; - } + [slot='end'] { + flex: 1; + margin-right: 2rem; + } - [slot='end'] { - flex: 1; - margin-right: 2rem; - } + .react-aria-Button { + position: sticky; + right: 0; + width: 1.429rem; + height: 1.429rem; + box-sizing: content-box; + flex-shrink: 0; + padding: 0; + border: 2px solid var(--field-background); + border: none; + border-radius: 4px; + margin-left: auto; + background: var(--highlight-background); + color: var(--highlight-foreground); + font-size: 0.857rem; + forced-color-adjust: none; - .react-aria-Button { - position: sticky; - right: 0; - width: 1.429rem; - height: 1.429rem; - box-sizing: content-box; - flex-shrink: 0; - padding: 0; - border: 2px solid var(--field-background); - border: none; - border-radius: 4px; - margin-left: auto; - background: var(--highlight-background); - color: var(--highlight-foreground); - font-size: 0.857rem; - forced-color-adjust: none; + &[data-focus-visible] { + outline: 2px solid var(--focus-ring-color); + outline-offset: 2px; + } + } - &[data-focus-visible] { - outline: 2px solid var(--focus-ring-color); - outline-offset: 2px; + .react-aria-DateInput { + width: unset; + min-width: unset; + padding: unset; + border: unset; + outline: unset; } } - .react-aria-DateInput { - width: unset; - min-width: unset; - padding: unset; - border: unset; - outline: unset; + .react-aria-Popover[data-trigger='DateRangePicker'] { + max-width: unset; } -} - -.react-aria-Popover[data-trigger='DateRangePicker'] { - max-width: unset; -} -.react-aria-DateRangePicker { - &[data-invalid] { - [slot='end']:after { - flex: 1; - margin-right: -1.5rem; - margin-left: 1.5rem; - alt: ' '; - content: '🚫' / ''; - content: '🚫'; - text-align: end; + .react-aria-DateRangePicker { + &[data-invalid] { + [slot='end']:after { + flex: 1; + margin-right: -1.5rem; + margin-left: 1.5rem; + alt: ' '; + content: '🚫' / ''; + content: '🚫'; + text-align: end; + } } - } - .react-aria-FieldError { - color: var(--color-invalid); - font-size: 12px; - } + .react-aria-FieldError { + color: var(--color-invalid); + font-size: 12px; + } - [slot='description'] { - font-size: 12px; + [slot='description'] { + font-size: 12px; + } } } diff --git a/packages/components/src/styles/basic/Dialog.css b/packages/components/src/styles/basic/Dialog.css index 29ba60e55d..45ca2210c8 100644 --- a/packages/components/src/styles/basic/Dialog.css +++ b/packages/components/src/styles/basic/Dialog.css @@ -3,12 +3,14 @@ @import './Modal.css'; @import './theme.css'; -.react-aria-Dialog { - padding: 30px; - outline: none; +@layer plone-components { + .react-aria-Dialog { + padding: 30px; + outline: none; - .react-aria-Heading[slot='title'] { - margin-top: 0; - line-height: 1em; + .react-aria-Heading[slot='title'] { + margin-top: 0; + line-height: 1em; + } } } diff --git a/packages/components/src/styles/basic/Disclosure.css b/packages/components/src/styles/basic/Disclosure.css index 809a49816e..5704d093c1 100644 --- a/packages/components/src/styles/basic/Disclosure.css +++ b/packages/components/src/styles/basic/Disclosure.css @@ -1,33 +1,35 @@ @import './theme.css'; @import './Button.css'; -.react-aria-Disclosure { - .react-aria-Button[slot='trigger'] { - display: flex; - align-items: center; - border: none; - background: none; - box-shadow: none; - font-size: 16px; - font-weight: bold; - gap: 8px; +@layer plone-components { + .react-aria-Disclosure { + .react-aria-Button[slot='trigger'] { + display: flex; + align-items: center; + border: none; + background: none; + box-shadow: none; + font-size: 16px; + font-weight: bold; + gap: 8px; - svg { - width: 12px; - height: 12px; - fill: none; - rotate: 0deg; - stroke: currentColor; - stroke-width: 3px; - transition: rotate 200ms; + svg { + width: 12px; + height: 12px; + fill: none; + rotate: 0deg; + stroke: currentColor; + stroke-width: 3px; + transition: rotate 200ms; + } } - } - &[data-expanded] .react-aria-Button[slot='trigger'] svg { - rotate: 90deg; + &[data-expanded] .react-aria-Button[slot='trigger'] svg { + rotate: 90deg; + } } -} -.react-aria-DisclosurePanel { - margin-left: 32px; + .react-aria-DisclosurePanel { + margin-left: 32px; + } } diff --git a/packages/components/src/styles/basic/Form.css b/packages/components/src/styles/basic/Form.css index fc425bffff..cebcb43466 100644 --- a/packages/components/src/styles/basic/Form.css +++ b/packages/components/src/styles/basic/Form.css @@ -2,31 +2,33 @@ @import './Button.css'; @import './theme.css'; -.react-aria-Form { - display: flex; - flex-direction: column; - align-items: flex-start; - gap: 8px; -} +@layer plone-components { + .react-aria-Form { + display: flex; + flex-direction: column; + align-items: flex-start; + gap: 8px; + } -.react-aria-Form [role='alert'] { - max-width: 250px; - padding: 12px; - border: 2px solid var(--color-invalid); - border-radius: 6px; - background: var(--overlay-background); - outline: none; + .react-aria-Form [role='alert'] { + max-width: 250px; + padding: 12px; + border: 2px solid var(--color-invalid); + border-radius: 6px; + background: var(--overlay-background); + outline: none; - &:focus-visible { - outline: 2px solid var(--focus-ring-color); - outline-offset: 2px; - } + &:focus-visible { + outline: 2px solid var(--focus-ring-color); + outline-offset: 2px; + } - h3 { - margin-top: 0; - } + h3 { + margin-top: 0; + } - p { - margin-bottom: 0; + p { + margin-bottom: 0; + } } } diff --git a/packages/components/src/styles/basic/GridList.css b/packages/components/src/styles/basic/GridList.css index ebb5518a7c..22ab490bcf 100644 --- a/packages/components/src/styles/basic/GridList.css +++ b/packages/components/src/styles/basic/GridList.css @@ -3,186 +3,188 @@ @import './ToggleButton.css'; @import './theme.css'; -.react-aria-GridList { - display: flex; - overflow: auto; - width: 250px; - min-height: 100px; - max-height: inherit; - max-height: 300px; - box-sizing: border-box; - flex-direction: column; - padding: 4px; - border: 1px solid var(--border-color); - border-radius: 6px; - background: var(--overlay-background); - forced-color-adjust: none; - gap: 2px; - outline: none; - - &[data-focus-visible] { - outline: 2px solid var(--focus-ring-color); - outline-offset: -1px; - } - - .react-aria-GridListItem { - position: relative; +@layer plone-components { + .react-aria-GridList { display: flex; - min-height: 28px; - align-items: center; - padding: 0.286rem 0.286rem 0.286rem 0.571rem; + overflow: auto; + width: 250px; + min-height: 100px; + max-height: inherit; + max-height: 300px; + box-sizing: border-box; + flex-direction: column; + padding: 4px; + border: 1px solid var(--border-color); border-radius: 6px; - color: var(--text-color); - cursor: default; - font-size: 1.072rem; - gap: 0.571rem; + background: var(--overlay-background); + forced-color-adjust: none; + gap: 2px; outline: none; - transform: translateZ(0); &[data-focus-visible] { outline: 2px solid var(--focus-ring-color); - outline-offset: -2px; - } - - &[data-pressed] { - background: var(---basic-300); + outline-offset: -1px; } - &[data-selected] { - background: var(--highlight-background); - color: var(--highlight-foreground); - --focus-ring-color: var(--highlight-foreground); + .react-aria-GridListItem { + position: relative; + display: flex; + min-height: 28px; + align-items: center; + padding: 0.286rem 0.286rem 0.286rem 0.571rem; + border-radius: 6px; + color: var(--text-color); + cursor: default; + font-size: 1.072rem; + gap: 0.571rem; + outline: none; + transform: translateZ(0); &[data-focus-visible] { - outline-color: var(--highlight-foreground); - outline-offset: -4px; + outline: 2px solid var(--focus-ring-color); + outline-offset: -2px; } - .react-aria-Button { + &[data-pressed] { + background: var(---basic-300); + } + + &[data-selected] { + background: var(--highlight-background); color: var(--highlight-foreground); - --highlight-hover: rgb(255 255 255 / 0.1); - --highlight-pressed: rgb(255 255 255 / 0.2); + --focus-ring-color: var(--highlight-foreground); + + &[data-focus-visible] { + outline-color: var(--highlight-foreground); + outline-offset: -4px; + } + + .react-aria-Button { + color: var(--highlight-foreground); + --highlight-hover: rgb(255 255 255 / 0.1); + --highlight-pressed: rgb(255 255 255 / 0.2); + } } - } - &[data-disabled] { - color: var(--text-color-disabled); - } + &[data-disabled] { + color: var(--text-color-disabled); + } + + .react-aria-Button:not([slot]) { + margin-left: auto; + } - .react-aria-Button:not([slot]) { - margin-left: auto; + .react-aria-Button { + padding: 0.286rem 0.429rem; + border: none; + background: transparent; + font-size: 1.2rem; + line-height: 1.2em; + transition: background 200ms; + + &[data-hovered] { + background: var(--highlight-hover); + } + + &[data-pressed] { + background: var(--highlight-pressed); + box-shadow: none; + } + } } - .react-aria-Button { - padding: 0.286rem 0.429rem; - border: none; - background: transparent; - font-size: 1.2rem; - line-height: 1.2em; - transition: background 200ms; + /* join selected items if :has selector is supported */ + @supports selector(:has(.foo)) { + gap: 0; - &[data-hovered] { - background: var(--highlight-hover); + .react-aria-GridListItem[data-selected]:has(+ [data-selected]), + .react-aria-GridListItem[data-selected]:has( + + .react-aria-DropIndicator + [data-selected] + ) { + border-end-end-radius: 0; + border-end-start-radius: 0; } - &[data-pressed] { - background: var(--highlight-pressed); - box-shadow: none; + .react-aria-GridListItem[data-selected] + [data-selected], + .react-aria-GridListItem[data-selected] + + .react-aria-DropIndicator + + [data-selected] { + border-start-end-radius: 0; + border-start-start-radius: 0; } } - } - - /* join selected items if :has selector is supported */ - @supports selector(:has(.foo)) { - gap: 0; - .react-aria-GridListItem[data-selected]:has(+ [data-selected]), - .react-aria-GridListItem[data-selected]:has( - + .react-aria-DropIndicator + [data-selected] - ) { - border-end-end-radius: 0; - border-end-start-radius: 0; + :where(.react-aria-GridListItem) .react-aria-Checkbox { + --selected-color: var(--highlight-foreground); + --selected-color-pressed: var(--highlight-foreground-pressed); + --checkmark-color: var(--highlight-background); + --background-color: var(--highlight-background); } + } - .react-aria-GridListItem[data-selected] + [data-selected], - .react-aria-GridListItem[data-selected] - + .react-aria-DropIndicator - + [data-selected] { - border-start-end-radius: 0; - border-start-start-radius: 0; - } + .react-aria-GridListItem[data-href] { + cursor: pointer; } - :where(.react-aria-GridListItem) .react-aria-Checkbox { - --selected-color: var(--highlight-foreground); - --selected-color-pressed: var(--highlight-foreground-pressed); - --checkmark-color: var(--highlight-background); - --background-color: var(--highlight-background); + .react-aria-GridList { + &[data-empty] { + align-items: center; + justify-content: center; + font-style: italic; + } } -} -.react-aria-GridListItem[data-href] { - cursor: pointer; -} + .react-aria-GridListItem { + &[data-allows-dragging] { + padding-left: 4px; + } -.react-aria-GridList { - &[data-empty] { - align-items: center; - justify-content: center; - font-style: italic; - } -} + &[data-dragging] { + opacity: 0.6; + } -.react-aria-GridListItem { - &[data-allows-dragging] { - padding-left: 4px; - } + [slot='drag'] { + all: unset; + width: 15px; + text-align: center; - &[data-dragging] { - opacity: 0.6; + &[data-focus-visible] { + border-radius: 4px; + outline: 2px solid var(--focus-ring-color); + } + } } - [slot='drag'] { - all: unset; - width: 15px; - text-align: center; + .react-aria-DropIndicator { + &[data-drop-target] { + outline: 1px solid var(--highlight-background); + } - &[data-focus-visible] { - border-radius: 4px; - outline: 2px solid var(--focus-ring-color); + @supports not selector(:has(.foo)) { + /* Undo gap in browsers that don't support :has */ + margin-bottom: -2px; } } -} -.react-aria-DropIndicator { - &[data-drop-target] { - outline: 1px solid var(--highlight-background); + .react-aria-GridList[data-drop-target] { + background: var(--highlight-overlay); + outline: 2px solid var(--highlight-background); + outline-offset: -1px; } - @supports not selector(:has(.foo)) { - /* Undo gap in browsers that don't support :has */ - margin-bottom: -2px; + .react-aria-GridListItem[data-drop-target] { + background: var(--highlight-overlay); + outline: 2px solid var(--highlight-background); } -} - -.react-aria-GridList[data-drop-target] { - background: var(--highlight-overlay); - outline: 2px solid var(--highlight-background); - outline-offset: -1px; -} -.react-aria-GridListItem[data-drop-target] { - background: var(--highlight-overlay); - outline: 2px solid var(--highlight-background); -} - -.react-aria-DropIndicator { - &[data-drop-target] { - outline: 1px solid var(--highlight-background); - } + .react-aria-DropIndicator { + &[data-drop-target] { + outline: 1px solid var(--highlight-background); + } - @supports not selector(:has(.foo)) { - /* Undo gap in browsers that don't support :has */ - margin-bottom: -2px; + @supports not selector(:has(.foo)) { + /* Undo gap in browsers that don't support :has */ + margin-bottom: -2px; + } } } diff --git a/packages/components/src/styles/basic/Label.css b/packages/components/src/styles/basic/Label.css index 48348caece..f3755f1ddc 100644 --- a/packages/components/src/styles/basic/Label.css +++ b/packages/components/src/styles/basic/Label.css @@ -1,18 +1,20 @@ @import './theme.css'; -.react-aria-Label { - /* TODO: Review since taken from default quanta */ - font-size: 0.9rem; - font-weight: 500; - letter-spacing: 0.012em; - line-height: 1.714285714285; +@layer plone-components { + .react-aria-Label { + /* TODO: Review since taken from default quanta */ + font-size: 0.9rem; + font-weight: 500; + letter-spacing: 0.012em; + line-height: 1.714285714285; - &::after { - /* Marks after Label (Required, etc) */ - display: inline-block; - margin-left: 3px; - color: var(--basic-600); - line-height: 0; - vertical-align: middle; + &::after { + /* Marks after Label (Required, etc) */ + display: inline-block; + margin-left: 3px; + color: var(--basic-600); + line-height: 0; + vertical-align: middle; + } } } diff --git a/packages/components/src/styles/basic/Link.css b/packages/components/src/styles/basic/Link.css index e626ff4c10..8f91a261ed 100644 --- a/packages/components/src/styles/basic/Link.css +++ b/packages/components/src/styles/basic/Link.css @@ -1,41 +1,43 @@ @import './theme.css'; -.react-aria-Link { - position: relative; - color: var(--link-color); - cursor: pointer; - font-size: 18px; - outline: none; - text-decoration: underline; - transition: all 200ms; +@layer plone-components { + .react-aria-Link { + position: relative; + color: var(--link-color); + cursor: pointer; + font-size: 18px; + outline: none; + text-decoration: underline; + transition: all 200ms; - /* TODO: review, but removing the fancyness for now */ - /* &[data-hovered] { + /* TODO: review, but removing the fancyness for now */ + /* &[data-hovered] { text-decoration-style: wavy; } */ - &[data-pressed] { - color: var(--link-color-pressed); - } + &[data-pressed] { + color: var(--link-color-pressed); + } - &[data-hovered] { - color: var(--link-color-secondary); - } + &[data-hovered] { + color: var(--link-color-secondary); + } - &[data-focused] { - color: var(--link-color-secondary); - } + &[data-focused] { + color: var(--link-color-secondary); + } - &[data-focus-visible]:after { - position: absolute; - border: 2px solid var(--focus-ring-color); - border-radius: 6px; - content: ''; - inset: -3px -6px; - } + &[data-focus-visible]:after { + position: absolute; + border: 2px solid var(--focus-ring-color); + border-radius: 6px; + content: ''; + inset: -3px -6px; + } - &[data-disabled] { - color: var(--text-color-disabled); - cursor: default; + &[data-disabled] { + color: var(--text-color-disabled); + cursor: default; + } } } diff --git a/packages/components/src/styles/basic/ListBox.css b/packages/components/src/styles/basic/ListBox.css index 869a29ca34..9cec61d80a 100644 --- a/packages/components/src/styles/basic/ListBox.css +++ b/packages/components/src/styles/basic/ListBox.css @@ -1,228 +1,230 @@ @import './Checkbox.css'; @import './theme.css'; -.react-aria-ListBox { - display: flex; - overflow: auto; - width: 250px; - min-height: 100px; - max-height: inherit; - max-height: 300px; - box-sizing: border-box; - flex-direction: column; - padding: 2px; - border: 1px solid var(--border-color); - border-radius: 6px; - background: var(--overlay-background); - forced-color-adjust: none; - outline: none; - - &[data-focus-visible] { - outline: 2px solid var(--focus-ring-color); - outline-offset: -1px; - } -} +@layer plone-components { + .react-aria-ListBox { + display: flex; + overflow: auto; + width: 250px; + min-height: 100px; + max-height: inherit; + max-height: 300px; + box-sizing: border-box; + flex-direction: column; + padding: 2px; + border: 1px solid var(--border-color); + border-radius: 6px; + background: var(--overlay-background); + forced-color-adjust: none; + outline: none; -.react-aria-ListBoxItem { - position: relative; - display: flex; - flex-direction: column; - padding: 0.286rem 0.571rem; - border-radius: 6px; - margin: 2px; - color: var(--text-color); - cursor: default; - font-size: 1.072rem; - outline: none; - - &[data-focus-visible] { - outline: 2px solid var(--focus-ring-color); - outline-offset: -2px; + &[data-focus-visible] { + outline: 2px solid var(--focus-ring-color); + outline-offset: -1px; + } } - &[data-selected] { - background: var(--highlight-background); - color: var(--highlight-foreground); + .react-aria-ListBoxItem { + position: relative; + display: flex; + flex-direction: column; + padding: 0.286rem 0.571rem; + border-radius: 6px; + margin: 2px; + color: var(--text-color); + cursor: default; + font-size: 1.072rem; + outline: none; &[data-focus-visible] { - outline-color: var(--highlight-foreground); - outline-offset: -4px; + outline: 2px solid var(--focus-ring-color); + outline-offset: -2px; } - } -} -.react-aria-ListBoxItem[href] { - cursor: pointer; - text-decoration: none; - -webkit-touch-callout: none; -} + &[data-selected] { + background: var(--highlight-background); + color: var(--highlight-foreground); -.react-aria-ListBox { - .react-aria-Section:not(:first-child) { - margin-top: 12px; + &[data-focus-visible] { + outline-color: var(--highlight-foreground); + outline-offset: -4px; + } + } } - .react-aria-Header { - padding: 0 0.714rem; - font-size: 1.143rem; - font-weight: bold; + .react-aria-ListBoxItem[href] { + cursor: pointer; + text-decoration: none; + -webkit-touch-callout: none; } -} -.react-aria-ListBoxItem { - [slot='label'] { - font-weight: bold; - } + .react-aria-ListBox { + .react-aria-Section:not(:first-child) { + margin-top: 12px; + } - [slot='description'] { - font-size: small; + .react-aria-Header { + padding: 0 0.714rem; + font-size: 1.143rem; + font-weight: bold; + } } -} - -.react-aria-ListBox[data-orientation='horizontal'], -.react-aria-ListBox[data-layout='grid'] { - width: fit-content; - max-width: 100%; - flex-direction: row; - padding: 4px; .react-aria-ListBoxItem { - position: relative; - padding: 4px; - margin: 0; - - & img { - max-width: 150px; - border-radius: 4px; - margin-bottom: 4px; - aspect-ratio: 1/1; - object-fit: cover; - transition: box-shadow 200ms; + [slot='label'] { + font-weight: bold; } - &[data-hovered] { - & img { - /* TODO: review */ - /* box-shadow: 0 0 8px rgb(from slateblue r g b / 0.5); */ - box-shadow: 0 0 8px var(--highlight-background-hover); - } + [slot='description'] { + font-size: small; } + } - &[data-selected] { - background: none; - color: inherit; + .react-aria-ListBox[data-orientation='horizontal'], + .react-aria-ListBox[data-layout='grid'] { + width: fit-content; + max-width: 100%; + flex-direction: row; + padding: 4px; + + .react-aria-ListBoxItem { + position: relative; + padding: 4px; + margin: 0; & img { - /* TODO: review */ - /* box-shadow: 0 0 12px rgb(from slateblue r g b / 0.8); */ - box-shadow: 0 0 12px var(--highlight-background-hover); + max-width: 150px; + border-radius: 4px; + margin-bottom: 4px; + aspect-ratio: 1/1; + object-fit: cover; + transition: box-shadow 200ms; + } + + &[data-hovered] { + & img { + /* TODO: review */ + /* box-shadow: 0 0 8px rgb(from slateblue r g b / 0.5); */ + box-shadow: 0 0 8px var(--highlight-background-hover); + } } - &:after { - position: absolute; - top: 8px; - right: 8px; - display: flex; - width: 22px; - height: 22px; - box-sizing: border-box; - align-items: center; - justify-content: center; - border: 2px solid var(--highlight-foreground); - border-radius: 22px; - alt: ' '; - background: var(--highlight-background); - box-shadow: 0 0 8px rgb(0 0 0 / 0.5); - color: var(--highlight-foreground); - content: '✓'; - content: '✓' / ''; - font-size: 14px; - line-height: 1em; + &[data-selected] { + background: none; + color: inherit; + + & img { + /* TODO: review */ + /* box-shadow: 0 0 12px rgb(from slateblue r g b / 0.8); */ + box-shadow: 0 0 12px var(--highlight-background-hover); + } + + &:after { + position: absolute; + top: 8px; + right: 8px; + display: flex; + width: 22px; + height: 22px; + box-sizing: border-box; + align-items: center; + justify-content: center; + border: 2px solid var(--highlight-foreground); + border-radius: 22px; + alt: ' '; + background: var(--highlight-background); + box-shadow: 0 0 8px rgb(0 0 0 / 0.5); + color: var(--highlight-foreground); + content: '✓'; + content: '✓' / ''; + font-size: 14px; + line-height: 1em; + } } } } -} -.react-aria-ListBox[data-layout='grid'] { - display: grid; - grid-template-columns: 1fr 1fr; - scrollbar-gutter: stable; -} - -.react-aria-ListBox[data-layout='grid'][data-orientation='horizontal'] { - display: grid; - width: 100%; - max-width: none; - max-height: 200px; - gap: 8px; - grid-auto-columns: 250px; - grid-auto-flow: column; - grid-template-columns: none; - grid-template-rows: 58px 58px; + .react-aria-ListBox[data-layout='grid'] { + display: grid; + grid-template-columns: 1fr 1fr; + scrollbar-gutter: stable; + } - .react-aria-ListBoxItem { + .react-aria-ListBox[data-layout='grid'][data-orientation='horizontal'] { display: grid; - column-gap: 8px; - grid-template-areas: - 'image .' - 'image title' - 'image description' - 'image .'; - grid-template-columns: auto 1fr; - grid-template-rows: 1fr auto auto 1fr; - - & img { - width: 50px; - height: 50px; - margin-bottom: 0; - grid-area: image; - } + width: 100%; + max-width: none; + max-height: 200px; + gap: 8px; + grid-auto-columns: 250px; + grid-auto-flow: column; + grid-template-columns: none; + grid-template-rows: 58px 58px; + + .react-aria-ListBoxItem { + display: grid; + column-gap: 8px; + grid-template-areas: + 'image .' + 'image title' + 'image description' + 'image .'; + grid-template-columns: auto 1fr; + grid-template-rows: 1fr auto auto 1fr; - [slot='label'] { - grid-area: title; - } + & img { + width: 50px; + height: 50px; + margin-bottom: 0; + grid-area: image; + } - [slot='description'] { - grid-area: description; + [slot='label'] { + grid-area: title; + } + + [slot='description'] { + grid-area: description; + } } } -} -.react-aria-ListBoxItem { - &[data-disabled] { - color: var(--text-color-disabled); + .react-aria-ListBoxItem { + &[data-disabled] { + color: var(--text-color-disabled); + } } -} -.react-aria-ListBox { - &[data-empty] { - align-items: center; - justify-content: center; - font-style: italic; + .react-aria-ListBox { + &[data-empty] { + align-items: center; + justify-content: center; + font-style: italic; + } } -} -.react-aria-ListBoxItem { - &[data-dragging] { - opacity: 0.6; + .react-aria-ListBoxItem { + &[data-dragging] { + opacity: 0.6; + } } -} -.react-aria-DropIndicator[data-drop-target] { - outline: 1px solid var(--highlight-background); -} + .react-aria-DropIndicator[data-drop-target] { + outline: 1px solid var(--highlight-background); + } -.react-aria-ListBox[data-drop-target] { - background: var(--highlight-overlay); - outline: 2px solid var(--highlight-background); - outline-offset: -1px; -} + .react-aria-ListBox[data-drop-target] { + background: var(--highlight-overlay); + outline: 2px solid var(--highlight-background); + outline-offset: -1px; + } -.react-aria-ListBoxItem[data-drop-target] { - background: var(--highlight-overlay); - outline: 2px solid var(--highlight-background); -} + .react-aria-ListBoxItem[data-drop-target] { + background: var(--highlight-overlay); + outline: 2px solid var(--highlight-background); + } -.react-aria-DropIndicator[data-drop-target] { - outline: 1px solid var(--highlight-background); + .react-aria-DropIndicator[data-drop-target] { + outline: 1px solid var(--highlight-background); + } } diff --git a/packages/components/src/styles/basic/Menu.css b/packages/components/src/styles/basic/Menu.css index 75f6399f03..594f7b7ea1 100644 --- a/packages/components/src/styles/basic/Menu.css +++ b/packages/components/src/styles/basic/Menu.css @@ -2,106 +2,108 @@ @import './Popover.css'; @import './theme.css'; -.react-aria-Menu { - overflow: auto; - min-width: 150px; - max-height: inherit; - box-sizing: border-box; - box-sizing: border-box; - padding: 2px; - outline: none; -} +@layer plone-components { + .react-aria-Menu { + overflow: auto; + min-width: 150px; + max-height: inherit; + box-sizing: border-box; + box-sizing: border-box; + padding: 2px; + outline: none; + } -.react-aria-MenuItem { - position: relative; - display: grid; - align-items: center; - justify-content: start; - padding: 0.286rem 0.571rem; - border-radius: 6px; - margin: 2px; - color: var(--text-color); - column-gap: 20px; - cursor: default; - font-size: 1.072rem; - forced-color-adjust: none; - grid-template-areas: 'icon label kbd' 'icon desc kbd'; - outline: none; + .react-aria-MenuItem { + position: relative; + display: grid; + align-items: center; + justify-content: start; + padding: 0.286rem 0.571rem; + border-radius: 6px; + margin: 2px; + color: var(--text-color); + column-gap: 20px; + cursor: default; + font-size: 1.072rem; + forced-color-adjust: none; + grid-template-areas: 'icon label kbd' 'icon desc kbd'; + outline: none; - &[data-focused] { - background: var(--highlight-background); - color: var(--highlight-foreground); + &[data-focused] { + background: var(--highlight-background); + color: var(--highlight-foreground); + } } -} -.react-aria-MenuItem { - &[data-selection-mode] { - padding-left: 24px; + .react-aria-MenuItem { + &[data-selection-mode] { + padding-left: 24px; - &::before { - position: absolute; - left: 4px; - font-weight: 600; - } + &::before { + position: absolute; + left: 4px; + font-weight: 600; + } - &[data-selection-mode='multiple'][data-selected]::before { - position: absolute; - left: 4px; - alt: ' '; - content: '✓'; - content: '✓' / ''; - font-weight: 600; - } + &[data-selection-mode='multiple'][data-selected]::before { + position: absolute; + left: 4px; + alt: ' '; + content: '✓'; + content: '✓' / ''; + font-weight: 600; + } - &[data-selection-mode='single'][data-selected]::before { - content: '●'; - content: '●' / ''; - transform: scale(0.7); + &[data-selection-mode='single'][data-selected]::before { + content: '●'; + content: '●' / ''; + transform: scale(0.7); + } } } -} - -.react-aria-MenuItem[href] { - cursor: pointer; - text-decoration: none; -} -.react-aria-Menu { - .react-aria-Section:not(:first-child) { - margin-top: 12px; + .react-aria-MenuItem[href] { + cursor: pointer; + text-decoration: none; } - .react-aria-Header { - padding: 0 0.714rem; - font-size: 1.143rem; - font-weight: bold; - } + .react-aria-Menu { + .react-aria-Section:not(:first-child) { + margin-top: 12px; + } - .react-aria-Separator { - height: 1px; - margin: 2px 4px; - background: var(--border-color); - } -} + .react-aria-Header { + padding: 0 0.714rem; + font-size: 1.143rem; + font-weight: bold; + } -.react-aria-MenuItem { - [slot='label'] { - /* font-weight: bold; */ - grid-area: label; + .react-aria-Separator { + height: 1px; + margin: 2px 4px; + background: var(--border-color); + } } - [slot='description'] { - font-size: small; - grid-area: desc; - } + .react-aria-MenuItem { + [slot='label'] { + /* font-weight: bold; */ + grid-area: label; + } - kbd { - font-family: monospace; - grid-area: kbd; - text-align: end; - } + [slot='description'] { + font-size: small; + grid-area: desc; + } - &[data-disabled] { - color: var(--text-color-disabled); + kbd { + font-family: monospace; + grid-area: kbd; + text-align: end; + } + + &[data-disabled] { + color: var(--text-color-disabled); + } } } diff --git a/packages/components/src/styles/basic/Meter.css b/packages/components/src/styles/basic/Meter.css index 9e7a7bcceb..2ab6709510 100644 --- a/packages/components/src/styles/basic/Meter.css +++ b/packages/components/src/styles/basic/Meter.css @@ -1,38 +1,40 @@ @import './theme.css'; -.react-aria-Meter { - --fill-color: forestgreen; +@layer plone-components { + .react-aria-Meter { + --fill-color: forestgreen; - display: grid; - width: 250px; - color: var(--text-color); - gap: 4px; - grid-template-areas: - 'label value' - 'bar bar'; - grid-template-columns: 1fr auto; + display: grid; + width: 250px; + color: var(--text-color); + gap: 4px; + grid-template-areas: + 'label value' + 'bar bar'; + grid-template-columns: 1fr auto; - .value { - grid-area: value; - } + .value { + grid-area: value; + } - .bar { - overflow: hidden; - height: 10px; - border-radius: 5px; - box-shadow: inset 0px 0px 0px 1px var(--border-color); - forced-color-adjust: none; - grid-area: bar; - } + .bar { + overflow: hidden; + height: 10px; + border-radius: 5px; + box-shadow: inset 0px 0px 0px 1px var(--border-color); + forced-color-adjust: none; + grid-area: bar; + } - .fill { - height: 100%; - background: var(--fill-color); + .fill { + height: 100%; + background: var(--fill-color); + } } -} -@media (forced-colors: active) { - .react-aria-Meter { - --fill-color: Highlight; + @media (forced-colors: active) { + .react-aria-Meter { + --fill-color: Highlight; + } } } diff --git a/packages/components/src/styles/basic/Modal.css b/packages/components/src/styles/basic/Modal.css index dc0b75f39d..544e1c224d 100644 --- a/packages/components/src/styles/basic/Modal.css +++ b/packages/components/src/styles/basic/Modal.css @@ -2,83 +2,85 @@ @import './TextField.css'; @import './theme.css'; -.react-aria-ModalOverlay { - position: fixed; - z-index: 100; - top: 0; - left: 0; - display: flex; - width: 100vw; - height: var(--visual-viewport-height); - align-items: center; - justify-content: center; - background: rgba(0 0 0 / 0.5); +@layer plone-components { + .react-aria-ModalOverlay { + position: fixed; + z-index: 100; + top: 0; + left: 0; + display: flex; + width: 100vw; + height: var(--visual-viewport-height); + align-items: center; + justify-content: center; + background: rgba(0 0 0 / 0.5); - &[data-entering] { - animation: modal-fade 200ms; - } + &[data-entering] { + animation: modal-fade 200ms; + } - &[data-exiting] { - animation: modal-fade 150ms reverse ease-in; + &[data-exiting] { + animation: modal-fade 150ms reverse ease-in; + } } -} -.react-aria-Modal { - max-width: 300px; - border: 1px solid var(--border-color); - border-radius: 6px; - background: var(--overlay-background); - box-shadow: 0 8px 20px rgba(0 0 0 / 0.1); - color: var(--text-color); - outline: none; + .react-aria-Modal { + max-width: 300px; + border: 1px solid var(--border-color); + border-radius: 6px; + background: var(--overlay-background); + box-shadow: 0 8px 20px rgba(0 0 0 / 0.1); + color: var(--text-color); + outline: none; - &[data-entering] { - animation: modal-zoom 300ms cubic-bezier(0.175, 0.885, 0.32, 1.275); - } + &[data-entering] { + animation: modal-zoom 300ms cubic-bezier(0.175, 0.885, 0.32, 1.275); + } - .react-aria-TextField { - margin-bottom: 8px; + .react-aria-TextField { + margin-bottom: 8px; + } } -} -@keyframes modal-fade { - from { - opacity: 0; - } + @keyframes modal-fade { + from { + opacity: 0; + } - to { - opacity: 1; + to { + opacity: 1; + } } -} -@keyframes modal-zoom { - from { - transform: scale(0.8); - } + @keyframes modal-zoom { + from { + transform: scale(0.8); + } - to { - transform: scale(1); + to { + transform: scale(1); + } } -} -@keyframes mymodal-blur { - from { - backdrop-filter: blur(0); - background: rgba(45 0 0 / 0); - } + @keyframes mymodal-blur { + from { + backdrop-filter: blur(0); + background: rgba(45 0 0 / 0); + } - to { - backdrop-filter: blur(10px); - background: rgba(45 0 0 / 0.3); + to { + backdrop-filter: blur(10px); + background: rgba(45 0 0 / 0.3); + } } -} -@keyframes mymodal-slide { - from { - transform: translateX(100%); - } + @keyframes mymodal-slide { + from { + transform: translateX(100%); + } - to { - transform: translateX(0); + to { + transform: translateX(0); + } } } diff --git a/packages/components/src/styles/basic/NumberField.css b/packages/components/src/styles/basic/NumberField.css index 4ae0d0f18a..a5ed24c70a 100644 --- a/packages/components/src/styles/basic/NumberField.css +++ b/packages/components/src/styles/basic/NumberField.css @@ -2,87 +2,89 @@ @import './Form.css'; @import './theme.css'; -.react-aria-NumberField { - margin-bottom: 8px; - color: var(--text-color); +@layer plone-components { + .react-aria-NumberField { + margin-bottom: 8px; + color: var(--text-color); - .react-aria-Group { - display: flex; - width: fit-content; - border-radius: 6px; + .react-aria-Group { + display: flex; + width: fit-content; + border-radius: 6px; - &[data-focus-within] { - outline: 1px solid var(--focus-ring-color); - .react-aria-Input, - .react-aria-Button { - border-color: var(--focus-ring-color); + &[data-focus-within] { + outline: 1px solid var(--focus-ring-color); + .react-aria-Input, + .react-aria-Button { + border-color: var(--focus-ring-color); + } } } - } - .react-aria-Button { - width: 2.3rem; - font-size: 1.4rem; + .react-aria-Button { + width: 2.3rem; + font-size: 1.4rem; - &[slot='decrement'] { - border-end-end-radius: 0; - border-start-end-radius: 0; - } + &[slot='decrement'] { + border-end-end-radius: 0; + border-start-end-radius: 0; + } - &[slot='increment'] { - border-end-start-radius: 0; - border-start-start-radius: 0; + &[slot='increment'] { + border-end-start-radius: 0; + border-start-start-radius: 0; + } } - } - .react-aria-Input { - z-index: 1; - width: 6rem; - flex: 1; - padding: 0.429rem 0.571rem; - border: 1px solid var(--border-color); - border-radius: 0; - margin: 0 -1px; - background: var(--field-background); - color: var(--field-text-color); - font-size: 1rem; - outline: none; - } - - &[data-invalid] { - .react-aria-Input, - .react-aria-Button { - border-color: var(--color-invalid); + .react-aria-Input { + z-index: 1; + width: 6rem; + flex: 1; + padding: 0.429rem 0.571rem; + border: 1px solid var(--border-color); + border-radius: 0; + margin: 0 -1px; + background: var(--field-background); + color: var(--field-text-color); + font-size: 1rem; + outline: none; } - &:focus-within { + &[data-invalid] { .react-aria-Input, .react-aria-Button { - border-color: var(--focus-ring-color); + border-color: var(--color-invalid); + } + + &:focus-within { + .react-aria-Input, + .react-aria-Button { + border-color: var(--focus-ring-color); + } } } - } - .react-aria-FieldError { - color: var(--color-invalid); - font-size: 12px; - } + .react-aria-FieldError { + color: var(--color-invalid); + font-size: 12px; + } - [slot='description'] { - font-size: 12px; - } + [slot='description'] { + font-size: 12px; + } - .react-aria-Button { - &[data-disabled] { - border-color: var(--border-color-disabled); - color: var(--text-color-disabled); + .react-aria-Button { + &[data-disabled] { + border-color: var(--border-color-disabled); + color: var(--text-color-disabled); + } } - } - .react-aria-Input { - &[data-disabled] { - border-color: var(--border-color-disabled); - color: var(--text-color-disabled); + .react-aria-Input { + &[data-disabled] { + border-color: var(--border-color-disabled); + color: var(--text-color-disabled); + } } } } diff --git a/packages/components/src/styles/basic/Popover.css b/packages/components/src/styles/basic/Popover.css index 66d00e48b9..89e8f419e5 100644 --- a/packages/components/src/styles/basic/Popover.css +++ b/packages/components/src/styles/basic/Popover.css @@ -3,86 +3,88 @@ @import './Switch.css'; @import './theme.css'; -.react-aria-Popover { - --background-color: var(--overlay-background); - max-width: 250px; - box-sizing: border-box; - - border: 1px solid var(--border-color); - border-radius: 6px; - background: var(--background-color); - box-shadow: 0 8px 20px rgba(0 0 0 / 0.1); - color: var(--text-color); - outline: none; - - .react-aria-OverlayArrow svg { - display: block; - fill: var(--background-color); - stroke: var(--border-color); - stroke-width: 1px; - } - - &[data-placement='top'] { - --origin: translateY(8px); +@layer plone-components { + .react-aria-Popover { + --background-color: var(--overlay-background); + max-width: 250px; + box-sizing: border-box; + + border: 1px solid var(--border-color); + border-radius: 6px; + background: var(--background-color); + box-shadow: 0 8px 20px rgba(0 0 0 / 0.1); + color: var(--text-color); + outline: none; - &:has(.react-aria-OverlayArrow) { - margin-bottom: 6px; + .react-aria-OverlayArrow svg { + display: block; + fill: var(--background-color); + stroke: var(--border-color); + stroke-width: 1px; } - } - &[data-placement='bottom'] { - --origin: translateY(-8px); + &[data-placement='top'] { + --origin: translateY(8px); - &:has(.react-aria-OverlayArrow) { - margin-top: 6px; + &:has(.react-aria-OverlayArrow) { + margin-bottom: 6px; + } } - .react-aria-OverlayArrow svg { - transform: rotate(180deg); - } - } + &[data-placement='bottom'] { + --origin: translateY(-8px); - &[data-placement='right'] { - --origin: translateX(-8px); + &:has(.react-aria-OverlayArrow) { + margin-top: 6px; + } - &:has(.react-aria-OverlayArrow) { - margin-left: 6px; + .react-aria-OverlayArrow svg { + transform: rotate(180deg); + } } - .react-aria-OverlayArrow svg { - transform: rotate(90deg); - } - } + &[data-placement='right'] { + --origin: translateX(-8px); - &[data-placement='left'] { - --origin: translateX(8px); + &:has(.react-aria-OverlayArrow) { + margin-left: 6px; + } - &:has(.react-aria-OverlayArrow) { - margin-right: 6px; + .react-aria-OverlayArrow svg { + transform: rotate(90deg); + } } - .react-aria-OverlayArrow svg { - transform: rotate(-90deg); + &[data-placement='left'] { + --origin: translateX(8px); + + &:has(.react-aria-OverlayArrow) { + margin-right: 6px; + } + + .react-aria-OverlayArrow svg { + transform: rotate(-90deg); + } } - } - &[data-entering] { - animation: popover-slide 200ms; - } + &[data-entering] { + animation: popover-slide 200ms; + } - &[data-exiting] { - animation: popover-slide 200ms reverse ease-in; + &[data-exiting] { + animation: popover-slide 200ms reverse ease-in; + } } -} -@keyframes popover-slide { - from { - opacity: 0; - transform: var(--origin); - } + @keyframes popover-slide { + from { + opacity: 0; + transform: var(--origin); + } - to { - opacity: 1; - transform: translateY(0); + to { + opacity: 1; + transform: translateY(0); + } } } diff --git a/packages/components/src/styles/basic/ProgressBar.css b/packages/components/src/styles/basic/ProgressBar.css index 0ad1762e0f..2a171ea53b 100644 --- a/packages/components/src/styles/basic/ProgressBar.css +++ b/packages/components/src/styles/basic/ProgressBar.css @@ -1,50 +1,52 @@ @import './theme.css'; -.react-aria-ProgressBar { - display: grid; - width: 250px; - color: var(--text-color); - gap: 4px; - grid-template-areas: - 'label value' - 'bar bar'; - grid-template-columns: 1fr auto; +@layer plone-components { + .react-aria-ProgressBar { + display: grid; + width: 250px; + color: var(--text-color); + gap: 4px; + grid-template-areas: + 'label value' + 'bar bar'; + grid-template-columns: 1fr auto; - .value { - grid-area: value; - } - - .bar { - overflow: hidden; - height: 10px; - border-radius: 5px; - box-shadow: inset 0px 0px 0px 1px var(--border-color); - forced-color-adjust: none; - grid-area: bar; - will-change: transform; - } + .value { + grid-area: value; + } - .fill { - height: 100%; - background: var(--highlight-background); - } + .bar { + overflow: hidden; + height: 10px; + border-radius: 5px; + box-shadow: inset 0px 0px 0px 1px var(--border-color); + forced-color-adjust: none; + grid-area: bar; + will-change: transform; + } - &:not([aria-valuenow]) { .fill { - width: 120px; - border-radius: inherit; - animation: indeterminate 1.5s infinite ease-in-out; - will-change: transform; + height: 100%; + background: var(--highlight-background); } - } -} -@keyframes indeterminate { - from { - transform: translateX(-100%); + &:not([aria-valuenow]) { + .fill { + width: 120px; + border-radius: inherit; + animation: indeterminate 1.5s infinite ease-in-out; + will-change: transform; + } + } } - to { - transform: translateX(250px); + @keyframes indeterminate { + from { + transform: translateX(-100%); + } + + to { + transform: translateX(250px); + } } } diff --git a/packages/components/src/styles/basic/RadioGroup.css b/packages/components/src/styles/basic/RadioGroup.css index 60fe722492..2a05774dcc 100644 --- a/packages/components/src/styles/basic/RadioGroup.css +++ b/packages/components/src/styles/basic/RadioGroup.css @@ -2,86 +2,88 @@ @import './Form.css'; @import './theme.css'; -.react-aria-RadioGroup { - display: flex; - flex-direction: column; - color: var(--text-color); - gap: 8px; -} - -.react-aria-Radio { - display: flex; - align-items: center; - color: var(--text-color); - font-size: 1.143rem; - forced-color-adjust: none; - gap: 0.571rem; - - &:before { - display: block; - width: 1.286rem; - height: 1.286rem; - box-sizing: border-box; - border: 0.143rem solid var(--border-color); - border-radius: 1.286rem; - background: var(--field-background); - content: ''; - transition: all 200ms; +@layer plone-components { + .react-aria-RadioGroup { + display: flex; + flex-direction: column; + color: var(--text-color); + gap: 8px; } - &[data-pressed]:before { - border-color: var(--border-color-pressed); - } + .react-aria-Radio { + display: flex; + align-items: center; + color: var(--text-color); + font-size: 1.143rem; + forced-color-adjust: none; + gap: 0.571rem; - &[data-selected] { &:before { - border-width: 0.429rem; - border-color: var(--highlight-background); + display: block; + width: 1.286rem; + height: 1.286rem; + box-sizing: border-box; + border: 0.143rem solid var(--border-color); + border-radius: 1.286rem; + background: var(--field-background); + content: ''; + transition: all 200ms; } &[data-pressed]:before { - border-color: var(--highlight-background-pressed); + border-color: var(--border-color-pressed); } - } - &[data-focus-visible]:before { - outline: 2px solid var(--focus-ring-color); - outline-offset: 2px; - } + &[data-selected] { + &:before { + border-width: 0.429rem; + border-color: var(--highlight-background); + } - &[data-invalid] { - &:before { - border-color: var(--color-invalid); + &[data-pressed]:before { + border-color: var(--highlight-background-pressed); + } } - &[data-pressed]:before { - border-color: var(--color-pressed-invalid); + &[data-focus-visible]:before { + outline: 2px solid var(--focus-ring-color); + outline-offset: 2px; } - } -} -.react-aria-RadioGroup { - .react-aria-FieldError { - color: var(--color-invalid); - font-size: 12px; - } + &[data-invalid] { + &:before { + border-color: var(--color-invalid); + } - [slot='description'] { - font-size: 12px; + &[data-pressed]:before { + border-color: var(--color-pressed-invalid); + } + } } - &[data-orientation='horizontal'] { - flex-direction: row; - align-items: center; + .react-aria-RadioGroup { + .react-aria-FieldError { + color: var(--color-invalid); + font-size: 12px; + } + + [slot='description'] { + font-size: 12px; + } + + &[data-orientation='horizontal'] { + flex-direction: row; + align-items: center; + } } -} -.react-aria-Radio { - &[data-disabled] { - color: var(--text-color-disabled); + .react-aria-Radio { + &[data-disabled] { + color: var(--text-color-disabled); - &:before { - border-color: var(--border-color-disabled); + &:before { + border-color: var(--border-color-disabled); + } } } } diff --git a/packages/components/src/styles/basic/RangeCalendar.css b/packages/components/src/styles/basic/RangeCalendar.css index ec9f4fe05a..025c9ee54d 100644 --- a/packages/components/src/styles/basic/RangeCalendar.css +++ b/packages/components/src/styles/basic/RangeCalendar.css @@ -1,102 +1,104 @@ @import './Button.css'; @import './theme.css'; -.react-aria-RangeCalendar { - width: fit-content; - max-width: 100%; - color: var(--text-color); - - & header { - display: flex; - align-items: center; - margin: 0 4px 0.5rem 4px; - - .react-aria-Heading { - flex: 1; - margin: 0; - font-size: 1.375rem; - text-align: center; +@layer plone-components { + .react-aria-RangeCalendar { + width: fit-content; + max-width: 100%; + color: var(--text-color); + + & header { + display: flex; + align-items: center; + margin: 0 4px 0.5rem 4px; + + .react-aria-Heading { + flex: 1; + margin: 0; + font-size: 1.375rem; + text-align: center; + } } - } - - .react-aria-Button { - width: 2rem; - height: 2rem; - padding: 0; - } - - & table { - border-collapse: collapse; - & td { - padding: 2px 0; + .react-aria-Button { + width: 2rem; + height: 2rem; + padding: 0; } - } - .react-aria-CalendarCell { - width: 2.286rem; - border-radius: 6px; - cursor: default; - forced-color-adjust: none; - line-height: 2.286rem; - outline: none; - text-align: center; - - &[data-outside-month] { - display: none; - } + & table { + border-collapse: collapse; - &[data-pressed] { - background: var(--gray-100); + & td { + padding: 2px 0; + } } - &[data-focus-visible] { - outline: 2px solid var(--highlight-background); - outline-offset: -2px; - } + .react-aria-CalendarCell { + width: 2.286rem; + border-radius: 6px; + cursor: default; + forced-color-adjust: none; + line-height: 2.286rem; + outline: none; + text-align: center; + + &[data-outside-month] { + display: none; + } - &[data-selected] { - border-radius: 0; - background: var(--highlight-background); - color: var(--highlight-foreground); + &[data-pressed] { + background: var(--gray-100); + } &[data-focus-visible] { - outline-color: var(--highlight-foreground); - outline-offset: -3px; + outline: 2px solid var(--highlight-background); + outline-offset: -2px; } - } - &[data-selection-start] { - border-end-start-radius: 6px; - border-start-start-radius: 6px; - } + &[data-selected] { + border-radius: 0; + background: var(--highlight-background); + color: var(--highlight-foreground); - &[data-selection-end] { - border-end-end-radius: 6px; - border-start-end-radius: 6px; - } - } + &[data-focus-visible] { + outline-color: var(--highlight-foreground); + outline-offset: -3px; + } + } + + &[data-selection-start] { + border-end-start-radius: 6px; + border-start-start-radius: 6px; + } - .react-aria-CalendarCell { - &[data-disabled] { - color: var(--text-color-disabled); + &[data-selection-end] { + border-end-end-radius: 6px; + border-start-end-radius: 6px; + } } - } - .react-aria-CalendarCell { - &[data-unavailable] { - color: var(--color-invalid); - text-decoration: line-through; + .react-aria-CalendarCell { + &[data-disabled] { + color: var(--text-color-disabled); + } } - &[data-invalid] { - background: var(--color-invalid); - color: var(--highlight-foreground); + .react-aria-CalendarCell { + &[data-unavailable] { + color: var(--color-invalid); + text-decoration: line-through; + } + + &[data-invalid] { + background: var(--color-invalid); + color: var(--highlight-foreground); + } } - } - [slot='errorMessage'] { - color: var(--color-invalid); - font-size: 12px; + [slot='errorMessage'] { + color: var(--color-invalid); + font-size: 12px; + } } } diff --git a/packages/components/src/styles/basic/SearchField.css b/packages/components/src/styles/basic/SearchField.css index 7163ebd0af..ef23082851 100644 --- a/packages/components/src/styles/basic/SearchField.css +++ b/packages/components/src/styles/basic/SearchField.css @@ -2,83 +2,85 @@ @import './Form.css'; @import './theme.css'; -.react-aria-SearchField { - display: grid; - width: fit-content; - align-items: center; - color: var(--text-color); - grid-template-areas: - 'label label' - 'input button' - 'help help'; - grid-template-columns: 1fr auto; +@layer plone-components { + .react-aria-SearchField { + display: grid; + width: fit-content; + align-items: center; + color: var(--text-color); + grid-template-areas: + 'label label' + 'input button' + 'help help'; + grid-template-columns: 1fr auto; - .react-aria-Input { - padding: 0.286rem 1.714rem 0.286rem 0.286rem; - border: 1px solid var(--border-color); - border-radius: 6px; - margin: 0; - background: var(--field-background); - color: var(--field-text-color); - font-size: 1.143rem; - grid-area: input; + .react-aria-Input { + padding: 0.286rem 1.714rem 0.286rem 0.286rem; + border: 1px solid var(--border-color); + border-radius: 6px; + margin: 0; + background: var(--field-background); + color: var(--field-text-color); + font-size: 1.143rem; + grid-area: input; - &::-webkit-search-cancel-button, - &::-webkit-search-decoration { - -webkit-appearance: none; - } + &::-webkit-search-cancel-button, + &::-webkit-search-decoration { + -webkit-appearance: none; + } - &[data-focused] { - outline: 2px solid var(--focus-ring-color); - outline-offset: -1px; + &[data-focused] { + outline: 2px solid var(--focus-ring-color); + outline-offset: -1px; + } } - } - .react-aria-Button { - width: 1.143rem; - height: 1.143rem; - padding: 0; - border: none; - border-radius: 1.143rem; - margin-left: -1.429rem; - background: var(--gray-500); - color: var(--gray-50); - font-size: 0.857rem; - grid-area: button; - line-height: 0.857rem; - text-align: center; - vertical-align: middle; + .react-aria-Button { + width: 1.143rem; + height: 1.143rem; + padding: 0; + border: none; + border-radius: 1.143rem; + margin-left: -1.429rem; + background: var(--gray-500); + color: var(--gray-50); + font-size: 0.857rem; + grid-area: button; + line-height: 0.857rem; + text-align: center; + vertical-align: middle; - &[data-pressed] { - background: var(--gray-600); + &[data-pressed] { + background: var(--gray-600); + } } - } - &[data-empty] button { - display: none; - } + &[data-empty] button { + display: none; + } - .react-aria-Input { - &[data-invalid] { - border-color: var(--color-invalid); + .react-aria-Input { + &[data-invalid] { + border-color: var(--color-invalid); + } } - } - .react-aria-FieldError { - color: var(--color-invalid); - font-size: 12px; - grid-area: help; - } + .react-aria-FieldError { + color: var(--color-invalid); + font-size: 12px; + grid-area: help; + } - [slot='description'] { - font-size: 12px; - grid-area: help; - } + [slot='description'] { + font-size: 12px; + grid-area: help; + } - .react-aria-Input { - &[data-disabled] { - border-color: var(--border-color-disabled); - color: var(--text-color-disabled); + .react-aria-Input { + &[data-disabled] { + border-color: var(--border-color-disabled); + color: var(--text-color-disabled); + } } } } diff --git a/packages/components/src/styles/basic/Select.css b/packages/components/src/styles/basic/Select.css index bea2939c69..bcffcaedf1 100644 --- a/packages/components/src/styles/basic/Select.css +++ b/packages/components/src/styles/basic/Select.css @@ -4,164 +4,166 @@ @import './Form.css'; @import './theme.css'; -.react-aria-Select { - color: var(--text-color); - - .react-aria-Button { - display: flex; - max-width: 250px; - align-items: center; - padding: 0.286rem 0.286rem 0.286rem 0.571rem; - border-radius: 6px; - box-shadow: 0 1px 2px rgba(0 0 0 / 0.1); - font-size: 1.072rem; - - &[data-focus-visible] { - outline: 2px solid var(--focus-ring-color); - outline-offset: -1px; - } - } +@layer plone-components { + .react-aria-Select { + color: var(--text-color); - &[data-invalid] { .react-aria-Button { - border: 1px solid var(--color-invalid); + display: flex; + max-width: 250px; + align-items: center; + padding: 0.286rem 0.286rem 0.286rem 0.571rem; + border-radius: 6px; + box-shadow: 0 1px 2px rgba(0 0 0 / 0.1); + font-size: 1.072rem; + + &[data-focus-visible] { + outline: 2px solid var(--focus-ring-color); + outline-offset: -1px; + } } - .react-aria-Label { - color: var(--color-invalid); - } - } + &[data-invalid] { + .react-aria-Button { + border: 1px solid var(--color-invalid); + } - &[data-disabled] { - .react-aria-Label { - color: var(--basic-400); + .react-aria-Label { + color: var(--color-invalid); + } } - [slot='description'] { - color: var(--basic-400); + &[data-disabled] { + .react-aria-Label { + color: var(--basic-400); + } + + [slot='description'] { + color: var(--basic-400); + } } - } - .react-aria-SelectValue { - &[data-placeholder] { - color: var(--text-color-placeholder); - font-style: italic; + .react-aria-SelectValue { + &[data-placeholder] { + color: var(--text-color-placeholder); + font-style: italic; + } } - } - span[aria-hidden] { - width: 1.5rem; - padding: 1px; - border-radius: 4px; - margin-left: 1rem; - background: var(--highlight-background); - color: var(--highlight-foreground); - font-size: 0.857rem; - forced-color-adjust: none; - line-height: 1.375rem; - } + span[aria-hidden] { + width: 1.5rem; + padding: 1px; + border-radius: 4px; + margin-left: 1rem; + background: var(--highlight-background); + color: var(--highlight-foreground); + font-size: 0.857rem; + forced-color-adjust: none; + line-height: 1.375rem; + } - &[data-required] .react-aria-Label::after { - /* https://yoksel.github.io/url-encoder/ */ - content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24'%3E%3Cpath fill='hsl(7, 90%25, 59%25)' d='M12 18a6 6 0 100-12 6 6 0 000 12z'/%3E%3C/svg%3E"); + &[data-required] .react-aria-Label::after { + /* https://yoksel.github.io/url-encoder/ */ + content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24'%3E%3Cpath fill='hsl(7, 90%25, 59%25)' d='M12 18a6 6 0 100-12 6 6 0 000 12z'/%3E%3C/svg%3E"); + } } -} -.react-aria-Popover[data-trigger='Select'] { - min-width: var(--trigger-width); + .react-aria-Popover[data-trigger='Select'] { + min-width: var(--trigger-width); - .react-aria-ListBox { - display: block; - width: unset; - min-height: unset; - max-height: inherit; - border: none; + .react-aria-ListBox { + display: block; + width: unset; + min-height: unset; + max-height: inherit; + border: none; - .react-aria-Header { - padding-left: 1.571rem; + .react-aria-Header { + padding-left: 1.571rem; + } } - } - .react-aria-ListBoxItem { - padding: 0.286rem 0.571rem 0.286rem 1.571rem; + .react-aria-ListBoxItem { + padding: 0.286rem 0.571rem 0.286rem 1.571rem; - &[data-focus-visible] { - outline: none; - } + &[data-focus-visible] { + outline: none; + } - &[data-selected] { - background: unset; - color: var(--text-color); - font-weight: 600; - - &::before { - position: absolute; - top: 4px; - left: 4px; - alt: ' '; - content: '✓'; - content: '✓' / ''; + &[data-selected] { + background: unset; + color: var(--text-color); + font-weight: 600; + + &::before { + position: absolute; + top: 4px; + left: 4px; + alt: ' '; + content: '✓'; + content: '✓' / ''; + } } - } - &[data-focused], - &[data-pressed] { - background: var(--highlight-background); - color: var(--highlight-foreground); + &[data-focused], + &[data-pressed] { + background: var(--highlight-background); + color: var(--highlight-foreground); + } } } -} - -.react-aria-ListBoxItem[href] { - cursor: pointer; - text-decoration: none; -} -.react-aria-Select { - .react-aria-SelectValue { - [slot='description'] { - display: none; - } + .react-aria-ListBoxItem[href] { + cursor: pointer; + text-decoration: none; } - .react-aria-Button { - &[data-disabled] { - border-color: var(--border-color-disabled); - color: var(--text-color-disabled); - span[aria-hidden] { - background: var(--border-color-disabled); - color: var(--text-color-disabled); + .react-aria-Select { + .react-aria-SelectValue { + [slot='description'] { + display: none; } + } - .react-aria-SelectValue { - &[data-placeholder] { + .react-aria-Button { + &[data-disabled] { + border-color: var(--border-color-disabled); + color: var(--text-color-disabled); + span[aria-hidden] { + background: var(--border-color-disabled); color: var(--text-color-disabled); } + + .react-aria-SelectValue { + &[data-placeholder] { + color: var(--text-color-disabled); + } + } } } } -} -@media (forced-colors: active) { - .react-aria-Select { - .react-aria-Button { - &[data-disabled] span[aria-hidden] { - background: 0 0; + @media (forced-colors: active) { + .react-aria-Select { + .react-aria-Button { + &[data-disabled] span[aria-hidden] { + background: 0 0; + } } } } -} -.react-aria-Select { - .react-aria-FieldError { - color: var(--color-invalid); - font-size: 12px; - } + .react-aria-Select { + .react-aria-FieldError { + color: var(--color-invalid); + font-size: 12px; + } - [slot='description'] { - /* For now, we want the error in under the description */ - display: block; - padding-top: 3px; - font-size: 12px; + [slot='description'] { + /* For now, we want the error in under the description */ + display: block; + padding-top: 3px; + font-size: 12px; + } } } diff --git a/packages/components/src/styles/basic/Slider.css b/packages/components/src/styles/basic/Slider.css index 857708de9d..00f6a8bb76 100644 --- a/packages/components/src/styles/basic/Slider.css +++ b/packages/components/src/styles/basic/Slider.css @@ -1,107 +1,109 @@ @import './NumberField.css'; @import './theme.css'; -.react-aria-Slider { - display: grid; - max-width: 300px; - color: var(--text-color); - grid-template-areas: - 'label output' - 'track track'; - grid-template-columns: 1fr auto; - - .react-aria-Label { - grid-area: label; - } - - .react-aria-SliderOutput { - grid-area: output; - } - - .react-aria-SliderTrack { - position: relative; - grid-area: track; - - /* track line */ - &:before { - position: absolute; - display: block; - background: var(--border-color); - content: ''; +@layer plone-components { + .react-aria-Slider { + display: grid; + max-width: 300px; + color: var(--text-color); + grid-template-areas: + 'label output' + 'track track'; + grid-template-columns: 1fr auto; + + .react-aria-Label { + grid-area: label; } - } - - .react-aria-SliderThumb { - width: 1.429rem; - height: 1.429rem; - border: 2px solid var(--background-color); - border-radius: 50%; - background: var(--highlight-background); - forced-color-adjust: none; - &[data-dragging] { - background: var(--highlight-background-pressed); + .react-aria-SliderOutput { + grid-area: output; } - &[data-focus-visible] { - outline: 2px solid var(--focus-ring-color); - } - } - - &[data-orientation='horizontal'] { - width: 300px; - flex-direction: column; - .react-aria-SliderTrack { - width: 100%; - height: 30px; + position: relative; + grid-area: track; + /* track line */ &:before { - top: 50%; - width: 100%; - height: 3px; - transform: translateY(-50%); + position: absolute; + display: block; + background: var(--border-color); + content: ''; } } .react-aria-SliderThumb { - top: 50%; + width: 1.429rem; + height: 1.429rem; + border: 2px solid var(--background-color); + border-radius: 50%; + background: var(--highlight-background); + forced-color-adjust: none; + + &[data-dragging] { + background: var(--highlight-background-pressed); + } + + &[data-focus-visible] { + outline: 2px solid var(--focus-ring-color); + } } - } - &[data-orientation='vertical'] { - display: block; - height: 150px; + &[data-orientation='horizontal'] { + width: 300px; + flex-direction: column; - .react-aria-Label, - .react-aria-SliderOutput { - display: none; + .react-aria-SliderTrack { + width: 100%; + height: 30px; + + &:before { + top: 50%; + width: 100%; + height: 3px; + transform: translateY(-50%); + } + } + + .react-aria-SliderThumb { + top: 50%; + } } - .react-aria-SliderTrack { - width: 30px; - height: 100%; + &[data-orientation='vertical'] { + display: block; + height: 150px; - &:before { - left: 50%; - width: 3px; + .react-aria-Label, + .react-aria-SliderOutput { + display: none; + } + + .react-aria-SliderTrack { + width: 30px; height: 100%; - transform: translateX(-50%); + + &:before { + left: 50%; + width: 3px; + height: 100%; + transform: translateX(-50%); + } } - } - .react-aria-SliderThumb { - left: 50%; + .react-aria-SliderThumb { + left: 50%; + } } - } - &[data-disabled] { - .react-aria-SliderTrack:before { - background: var(--border-color-disabled); - } + &[data-disabled] { + .react-aria-SliderTrack:before { + background: var(--border-color-disabled); + } - .react-aria-SliderThumb { - background: var(--border-color-disabled); + .react-aria-SliderThumb { + background: var(--border-color-disabled); + } } } } diff --git a/packages/components/src/styles/basic/Switch.css b/packages/components/src/styles/basic/Switch.css index 97065a1abd..85b4e44b9f 100644 --- a/packages/components/src/styles/basic/Switch.css +++ b/packages/components/src/styles/basic/Switch.css @@ -1,73 +1,75 @@ @import './theme.css'; -.react-aria-Switch { - display: flex; - align-items: center; - color: var(--text-color); - font-size: 1.143rem; - forced-color-adjust: none; - gap: 0.571rem; +@layer plone-components { + .react-aria-Switch { + display: flex; + align-items: center; + color: var(--text-color); + font-size: 1.143rem; + forced-color-adjust: none; + gap: 0.571rem; - .indicator { - width: 2rem; - height: 1.143rem; - border: 2px solid var(--border-color); - border-radius: 1.143rem; - background: var(--background-color); - transition: all 200ms; - - &:before { - display: block; - width: 0.857rem; - height: 0.857rem; - border-radius: 16px; - margin: 0.143rem; - background: var(--highlight-background); - content: ''; + .indicator { + width: 2rem; + height: 1.143rem; + border: 2px solid var(--border-color); + border-radius: 1.143rem; + background: var(--background-color); transition: all 200ms; - } - } - - &[data-pressed] .indicator { - border-color: var(--border-color-pressed); - &:before { - background: var(--highlight-background-pressed); + &:before { + display: block; + width: 0.857rem; + height: 0.857rem; + border-radius: 16px; + margin: 0.143rem; + background: var(--highlight-background); + content: ''; + transition: all 200ms; + } } - } - &[data-selected] { - .indicator { - border-color: var(--highlight-background); - background: var(--highlight-background); + &[data-pressed] .indicator { + border-color: var(--border-color-pressed); &:before { - background: var(--field-background); - transform: translateX(100%); + background: var(--highlight-background-pressed); } } - &[data-pressed] { + &[data-selected] { .indicator { - border-color: var(--highlight-background-pressed); - background: var(--highlight-background-pressed); + border-color: var(--highlight-background); + background: var(--highlight-background); + + &:before { + background: var(--field-background); + transform: translateX(100%); + } + } + + &[data-pressed] { + .indicator { + border-color: var(--highlight-background-pressed); + background: var(--highlight-background-pressed); + } } } - } - &[data-focus-visible] .indicator { - outline: 2px solid var(--focus-ring-color); - outline-offset: 2px; - } + &[data-focus-visible] .indicator { + outline: 2px solid var(--focus-ring-color); + outline-offset: 2px; + } - &[data-disabled] { - color: var(--text-color-disabled); + &[data-disabled] { + color: var(--text-color-disabled); - .indicator { - border-color: var(--border-color-disabled); + .indicator { + border-color: var(--border-color-disabled); - &:before { - background: var(--border-color-disabled); + &:before { + background: var(--border-color-disabled); + } } } } diff --git a/packages/components/src/styles/basic/Table.css b/packages/components/src/styles/basic/Table.css index a876bf2501..5ac6d90256 100644 --- a/packages/components/src/styles/basic/Table.css +++ b/packages/components/src/styles/basic/Table.css @@ -5,279 +5,281 @@ @import './Menu.css'; @import './theme.css'; -:root { - --plone-table-border: 0 none; - --plone-table-border-radius: 0; - --plone-table-padding: 0.286rem; - --plone-table-width: initial; - --plone-table-max-width: 100%; - --plone-table-background: var(--overlay-background); - - --plone-table-header-color: var(--text-color); - --plone-table-header-font-size: 1rem; - --plone-table-header-border-bottom: 1px solid var(--border-color); - - --plone-table-row-color: var(--text-color); - --plone-table-row-font-size: 1rem; - --plone-table-row-pressed: var(--highlight-pressed); - --plone-table-row-border-radius: 0; - - --plone-table-column-font-weight: 500; - - --plone-table-cell-padding: 18px 12px; - --plone-table-cell-border-bottom: 1px solid var(--smoke); -} - -.react-aria-Table { - width: var(--plone-table-width); - max-width: 100%; - min-height: 100px; - align-self: start; - padding: var(--plone-table-padding); - border: var(--plone-table-border); - border-radius: var(--plone-table-border-radius); - background: var(--plone-table-background); - border-spacing: 0; - forced-color-adjust: none; - outline: none; - word-break: break-word; - - &[data-focus-visible] { - outline: 2px solid var(--focus-ring-color); - outline-offset: -1px; +@layer plone-components { + :root { + --plone-table-border: 0 none; + --plone-table-border-radius: 0; + --plone-table-padding: 0.286rem; + --plone-table-width: initial; + --plone-table-max-width: 100%; + --plone-table-background: var(--overlay-background); + + --plone-table-header-color: var(--text-color); + --plone-table-header-font-size: 1rem; + --plone-table-header-border-bottom: 1px solid var(--border-color); + + --plone-table-row-color: var(--text-color); + --plone-table-row-font-size: 1rem; + --plone-table-row-pressed: var(--highlight-pressed); + --plone-table-row-border-radius: 0; + + --plone-table-column-font-weight: 500; + + --plone-table-cell-padding: 18px 12px; + --plone-table-cell-border-bottom: 1px solid var(--smoke); } - .react-aria-TableHeader { - color: var(--plone-table-header-color); - font-size: var(--plone-table-header-font-size); - - & tr:last-child .react-aria-Column { - border-bottom: var(--plone-table-header-border-bottom); - cursor: default; - } - } - - .react-aria-Row { - --radius-top: 6px; - --radius-bottom: 6px; - --radius: var(--radius-top) var(--radius-top) var(--radius-bottom) - var(--radius-bottom); - position: relative; - border-radius: var(--plone-table-row-border-radius); - clip-path: inset(0 round var(--radius)); /* firefox */ - color: var(--plone-table-row-color); - cursor: default; - font-size: var(--plone-table-row-font-size); + .react-aria-Table { + width: var(--plone-table-width); + max-width: 100%; + min-height: 100px; + align-self: start; + padding: var(--plone-table-padding); + border: var(--plone-table-border); + border-radius: var(--plone-table-border-radius); + background: var(--plone-table-background); + border-spacing: 0; + forced-color-adjust: none; outline: none; - transform: scale(1); + word-break: break-word; &[data-focus-visible] { outline: 2px solid var(--focus-ring-color); - outline-offset: -2px; + outline-offset: -1px; } - &[data-pressed] { - background: var(--plone-table-row-pressed); - } + .react-aria-TableHeader { + color: var(--plone-table-header-color); + font-size: var(--plone-table-header-font-size); - &[data-selected] { - background: var(--highlight-background); - color: var(--highlight-foreground); - --text-color: var(--highlight-foreground); - --focus-ring-color: var(--highlight-foreground); - --link-color: var(--highlight-foreground); - --link-color-secondary: var(--highlight-foreground); - --button-background: var(--highlight-background); - - &[data-focus-visible], - .react-aria-Cell[data-focus-visible] { - outline-offset: -4px; + & tr:last-child .react-aria-Column { + border-bottom: var(--plone-table-header-border-bottom); + cursor: default; } } - &[data-disabled] { - color: var(--text-color-disabled); - } - - &[data-dragging] { - opacity: 0.6; - transform: translateZ(0); - } - - [slot='drag'] { - all: unset; - width: 1em; - text-align: center; + .react-aria-Row { + --radius-top: 6px; + --radius-bottom: 6px; + --radius: var(--radius-top) var(--radius-top) var(--radius-bottom) + var(--radius-bottom); + position: relative; + border-radius: var(--plone-table-row-border-radius); + clip-path: inset(0 round var(--radius)); /* firefox */ + color: var(--plone-table-row-color); + cursor: default; + font-size: var(--plone-table-row-font-size); + outline: none; + transform: scale(1); &[data-focus-visible] { - border-radius: 4px; outline: 2px solid var(--focus-ring-color); + outline-offset: -2px; } - } - &[data-href] { - cursor: pointer; - } - } + &[data-pressed] { + background: var(--plone-table-row-pressed); + } - .react-aria-Cell, - .react-aria-Column { - padding: var(--plone-table-cell-padding); - outline: none; - text-align: left; + &[data-selected] { + background: var(--highlight-background); + color: var(--highlight-foreground); + --text-color: var(--highlight-foreground); + --focus-ring-color: var(--highlight-foreground); + --link-color: var(--highlight-foreground); + --link-color-secondary: var(--highlight-foreground); + --button-background: var(--highlight-background); + + &[data-focus-visible], + .react-aria-Cell[data-focus-visible] { + outline-offset: -4px; + } + } - &[data-focus-visible] { - outline: 2px solid var(--focus-ring-color); - outline-offset: -2px; - } - } + &[data-disabled] { + color: var(--text-color-disabled); + } - .react-aria-Cell { - border-bottom: var(--plone-table-cell-border-bottom); - transform: translateZ(0); + &[data-dragging] { + opacity: 0.6; + transform: translateZ(0); + } - &:first-child { - border-radius: var(--radius-top) 0 0 var(--radius-bottom); - } + [slot='drag'] { + all: unset; + width: 1em; + text-align: center; - &:last-child { - border-radius: 0 var(--radius-top) var(--radius-bottom) 0; - } - } + &[data-focus-visible] { + border-radius: 4px; + outline: 2px solid var(--focus-ring-color); + } + } - /* join selected items if :has selector is supported */ - @supports selector(:has(.foo)) { - .react-aria-Row[data-selected]:has(+ [data-selected]), - .react-aria-Row[data-selected]:has( - + .react-aria-DropIndicator + [data-selected] - ) { - --radius-bottom: 0px; + &[data-href] { + cursor: pointer; + } } - .react-aria-Row[data-selected] + [data-selected], - .react-aria-Row[data-selected] - + .react-aria-DropIndicator - + [data-selected] { - --radius-top: 0px; - } - } -} + .react-aria-Cell, + .react-aria-Column { + padding: var(--plone-table-cell-padding); + outline: none; + text-align: left; -:where(.react-aria-Row) .react-aria-Checkbox { - --selected-color: var(--highlight-foreground); - --selected-color-pressed: var(--highlight-foreground-pressed); - --checkmark-color: var(--highlight-background); - --background-color: var(--highlight-background); -} + &[data-focus-visible] { + outline: 2px solid var(--focus-ring-color); + outline-offset: -2px; + } + } -.react-aria-Column { - font-weight: var(--plone-table-column-font-weight); + .react-aria-Cell { + border-bottom: var(--plone-table-cell-border-bottom); + transform: translateZ(0); - .sort-indicator { - padding: 0 2px; - } + &:first-child { + border-radius: var(--radius-top) 0 0 var(--radius-bottom); + } - &:not([data-sort-direction]) .sort-indicator { - visibility: hidden; - } -} + &:last-child { + border-radius: 0 var(--radius-top) var(--radius-bottom) 0; + } + } -.react-aria-ResizableTableContainer { - position: relative; - overflow: auto; - max-width: var(--plone-table-max-width); - border: var(--plone-table-border); - border-radius: var(--plone-table-border-radius); - background: var(--plone-table-background); + /* join selected items if :has selector is supported */ + @supports selector(:has(.foo)) { + .react-aria-Row[data-selected]:has(+ [data-selected]), + .react-aria-Row[data-selected]:has( + + .react-aria-DropIndicator + [data-selected] + ) { + --radius-bottom: 0px; + } - .react-aria-Table { - border: none; + .react-aria-Row[data-selected] + [data-selected], + .react-aria-Row[data-selected] + + .react-aria-DropIndicator + + [data-selected] { + --radius-top: 0px; + } + } } - .flex-wrapper { - display: flex; - align-items: center; + :where(.react-aria-Row) .react-aria-Checkbox { + --selected-color: var(--highlight-foreground); + --selected-color-pressed: var(--highlight-foreground-pressed); + --checkmark-color: var(--highlight-background); + --background-color: var(--highlight-background); } - .column-name, - .react-aria-Button { - --background-color: var(--overlay-background); - overflow: hidden; - flex: 1; - border-color: transparent; - color: inherit; - font: inherit; - text-align: start; - text-overflow: ellipsis; - transition: background 200ms; - &[data-hovered] { - background: var(--highlight-hover); - } + .react-aria-Column { + font-weight: var(--plone-table-column-font-weight); - &[data-pressed] { - background: var(--highlight-pressed); - box-shadow: none; + .sort-indicator { + padding: 0 2px; } - &:focus-visible { - outline: 2px solid var(--focus-ring-color); + &:not([data-sort-direction]) .sort-indicator { + visibility: hidden; } } - .react-aria-ColumnResizer { - width: 15px; - height: 25px; - box-sizing: border-box; - flex: 0 0 auto; - border: 5px; - border-style: none solid; - border-color: transparent; - background-clip: content-box; - background-color: grey; - touch-action: none; - - &[data-resizable-direction='both'] { - cursor: ew-resize; + .react-aria-ResizableTableContainer { + position: relative; + overflow: auto; + max-width: var(--plone-table-max-width); + border: var(--plone-table-border); + border-radius: var(--plone-table-border-radius); + background: var(--plone-table-background); + + .react-aria-Table { + border: none; } - &[data-resizable-direction='left'] { - cursor: e-resize; + .flex-wrapper { + display: flex; + align-items: center; } - &[data-resizable-direction='right'] { - cursor: w-resize; + .column-name, + .react-aria-Button { + --background-color: var(--overlay-background); + overflow: hidden; + flex: 1; + border-color: transparent; + color: inherit; + font: inherit; + text-align: start; + text-overflow: ellipsis; + transition: background 200ms; + &[data-hovered] { + background: var(--highlight-hover); + } + + &[data-pressed] { + background: var(--highlight-pressed); + box-shadow: none; + } + + &:focus-visible { + outline: 2px solid var(--focus-ring-color); + } } - &[data-focus-visible] { - background-color: var(--focus-ring-color); + .react-aria-ColumnResizer { + width: 15px; + height: 25px; + box-sizing: border-box; + flex: 0 0 auto; + border: 5px; + border-style: none solid; + border-color: transparent; + background-clip: content-box; + background-color: grey; + touch-action: none; + + &[data-resizable-direction='both'] { + cursor: ew-resize; + } + + &[data-resizable-direction='left'] { + cursor: e-resize; + } + + &[data-resizable-direction='right'] { + cursor: w-resize; + } + + &[data-focus-visible] { + background-color: var(--focus-ring-color); + } + + &[data-resizing] { + border-color: var(--focus-ring-color); + background-color: transparent; + } } - &[data-resizing] { - border-color: var(--focus-ring-color); - background-color: transparent; + .react-aria-Column, + .react-aria-Cell { + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; } } - .react-aria-Column, - .react-aria-Cell { - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; + .react-aria-DropIndicator[data-drop-target] { + outline: 1px solid var(--highlight-background); + transform: translateZ(0); } -} - -.react-aria-DropIndicator[data-drop-target] { - outline: 1px solid var(--highlight-background); - transform: translateZ(0); -} -.react-aria-Table[data-drop-target] { - background: var(--highlight-overlay); - outline: 2px solid var(--highlight-background); - outline-offset: -1px; -} + .react-aria-Table[data-drop-target] { + background: var(--highlight-overlay); + outline: 2px solid var(--highlight-background); + outline-offset: -1px; + } -.react-aria-Row[data-drop-target] { - background: var(--highlight-overlay); - outline: 2px solid var(--highlight-background); + .react-aria-Row[data-drop-target] { + background: var(--highlight-overlay); + outline: 2px solid var(--highlight-background); + } } diff --git a/packages/components/src/styles/basic/Tabs.css b/packages/components/src/styles/basic/Tabs.css index 54bb15d501..9662ecd6a4 100644 --- a/packages/components/src/styles/basic/Tabs.css +++ b/packages/components/src/styles/basic/Tabs.css @@ -2,101 +2,103 @@ @import './Link.css'; @import './theme.css'; -.react-aria-Tabs { - display: flex; - color: var(--text-color); +@layer plone-components { + .react-aria-Tabs { + display: flex; + color: var(--text-color); - &[data-orientation='horizontal'] { - flex-direction: column; + &[data-orientation='horizontal'] { + flex-direction: column; + } } -} -.react-aria-TabList { - display: flex; + .react-aria-TabList { + display: flex; - &[data-orientation='horizontal'] { - border-bottom: 1px solid var(--border-color); + &[data-orientation='horizontal'] { + border-bottom: 1px solid var(--border-color); - .react-aria-Tab { - border-bottom: 3px solid var(--border-color); + .react-aria-Tab { + border-bottom: 3px solid var(--border-color); + } } } -} - -.react-aria-Tab { - position: relative; - padding: 10px; - color: var(--text-color-base); - cursor: default; - forced-color-adjust: none; - outline: none; - transition: color 200ms; - --border-color: transparent; - - &[data-hovered], - &[data-focused] { - color: var(--text-color-hover); - } - &[data-selected] { - --border-color: var(--highlight-background); - color: var(--text-color); - } + .react-aria-Tab { + position: relative; + padding: 10px; + color: var(--text-color-base); + cursor: default; + forced-color-adjust: none; + outline: none; + transition: color 200ms; + --border-color: transparent; + + &[data-hovered], + &[data-focused] { + color: var(--text-color-hover); + } - &[data-disabled] { - color: var(--text-color-disabled); &[data-selected] { - --border-color: var(--text-color-disabled); + --border-color: var(--highlight-background); + color: var(--text-color); } - } - &[data-focus-visible]:after { - position: absolute; - border: 2px solid var(--focus-ring-color); - border-radius: 4px; - content: ''; - inset: 4px; + &[data-disabled] { + color: var(--text-color-disabled); + &[data-selected] { + --border-color: var(--text-color-disabled); + } + } + + &[data-focus-visible]:after { + position: absolute; + border: 2px solid var(--focus-ring-color); + border-radius: 4px; + content: ''; + inset: 4px; + } } -} -.react-aria-TabPanel { - padding: 10px; - border-radius: 4px; - margin-top: 4px; - outline: none; + .react-aria-TabPanel { + padding: 10px; + border-radius: 4px; + margin-top: 4px; + outline: none; - &[data-focus-visible] { - outline: 2px solid var(--focus-ring-color); + &[data-focus-visible] { + outline: 2px solid var(--focus-ring-color); + } } -} -.react-aria-Tabs { - &[data-orientation='vertical'] { - flex-direction: row; + .react-aria-Tabs { + &[data-orientation='vertical'] { + flex-direction: row; + } } -} -.react-aria-TabList { - &[data-orientation='vertical'] { - flex-direction: column; - border-inline-end: 1px solid gray; + .react-aria-TabList { + &[data-orientation='vertical'] { + flex-direction: column; + border-inline-end: 1px solid gray; - .react-aria-Tab { - border-inline-end: 3px solid var(--border-color, transparent); + .react-aria-Tab { + border-inline-end: 3px solid var(--border-color, transparent); + } } } -} -.react-aria-Tab { - &[data-disabled] { - color: var(--text-color-disabled); - &[data-selected] { - --border-color: var(--border-color-disabled); + .react-aria-Tab { + &[data-disabled] { + color: var(--text-color-disabled); + &[data-selected] { + --border-color: var(--border-color-disabled); + } } } -} -.react-aria-Tab[href] { - cursor: pointer; - text-decoration: none; + .react-aria-Tab[href] { + cursor: pointer; + text-decoration: none; + } } diff --git a/packages/components/src/styles/basic/TagGroup.css b/packages/components/src/styles/basic/TagGroup.css index eab45234c1..d50abf9140 100644 --- a/packages/components/src/styles/basic/TagGroup.css +++ b/packages/components/src/styles/basic/TagGroup.css @@ -1,91 +1,93 @@ @import './ToggleButton.css'; @import './theme.css'; -.react-aria-TagGroup { - display: flex; - flex-direction: column; - color: var(--text-color); - font-size: small; - gap: 2px; -} - -.react-aria-TagList { - display: flex; - flex-wrap: wrap; - gap: 4px; -} - -.react-aria-Tag { - display: flex; - align-items: center; - padding: 2px 8px; - border: 1px solid var(--border-color); - border-radius: 4px; - color: var(--text-color); - cursor: default; - font-size: 0.929rem; - forced-color-adjust: none; - outline: none; - transition: border-color 200ms; - - &[data-hovered] { - border-color: var(--border-color-hover); - } - - &[data-focus-visible] { - outline: 2px solid var(--focus-ring-color); - outline-offset: 2px; +@layer plone-components { + .react-aria-TagGroup { + display: flex; + flex-direction: column; + color: var(--text-color); + font-size: small; + gap: 2px; } - &[data-selected] { - border-color: var(--highlight-background); - background: var(--highlight-background); - color: var(--highlight-foreground); + .react-aria-TagList { + display: flex; + flex-wrap: wrap; + gap: 4px; } - [slot='remove'] { - padding: 0; - border: none; - margin-left: 8px; - background: none; - color: var(--text-color-base); - font-size: 0.95em; + .react-aria-Tag { + display: flex; + align-items: center; + padding: 2px 8px; + border: 1px solid var(--border-color); + border-radius: 4px; + color: var(--text-color); + cursor: default; + font-size: 0.929rem; + forced-color-adjust: none; outline: none; - transition: color 200ms; + transition: border-color 200ms; &[data-hovered] { - color: var(--text-color-hover); + border-color: var(--border-color-hover); + } + + &[data-focus-visible] { + outline: 2px solid var(--focus-ring-color); + outline-offset: 2px; + } + + &[data-selected] { + border-color: var(--highlight-background); + background: var(--highlight-background); + color: var(--highlight-foreground); } - } - &[data-selected] { [slot='remove'] { - color: inherit; + padding: 0; + border: none; + margin-left: 8px; + background: none; + color: var(--text-color-base); + font-size: 0.95em; + outline: none; + transition: color 200ms; + + &[data-hovered] { + color: var(--text-color-hover); + } + } + + &[data-selected] { + [slot='remove'] { + color: inherit; + } } } -} -.react-aria-Tag[data-href] { - cursor: pointer; - text-decoration: none; -} + .react-aria-Tag[data-href] { + cursor: pointer; + text-decoration: none; + } -.react-aria-TagList { - .react-aria-Tag { - &[data-disabled] { - border-color: var(--border-color-disabled); - color: var(--text-color-disabled); + .react-aria-TagList { + .react-aria-Tag { + &[data-disabled] { + border-color: var(--border-color-disabled); + color: var(--text-color-disabled); + } } } -} -.react-aria-TagGroup { - [slot='description'] { - font-size: 12px; - } + .react-aria-TagGroup { + [slot='description'] { + font-size: 12px; + } - [slot='errorMessage'] { - color: var(--color-invalid); - font-size: 12px; + [slot='errorMessage'] { + color: var(--color-invalid); + font-size: 12px; + } } } diff --git a/packages/components/src/styles/basic/TextField.css b/packages/components/src/styles/basic/TextField.css index 78abe9f375..f99b9178df 100644 --- a/packages/components/src/styles/basic/TextField.css +++ b/packages/components/src/styles/basic/TextField.css @@ -2,49 +2,51 @@ @import './Label.css'; @import './theme.css'; -.react-aria-TextField { - display: flex; - width: fit-content; - flex-direction: column; - color: var(--text-color); +@layer plone-components { + .react-aria-TextField { + display: flex; + width: fit-content; + flex-direction: column; + color: var(--text-color); - .react-aria-Input, - .react-aria-TextArea { - padding: 0.286rem; - border: 1px solid var(--border-color); - border-radius: 6px; - margin: 0; - background: var(--field-background); - color: var(--field-text-color); - font-size: 1.143rem; + .react-aria-Input, + .react-aria-TextArea { + padding: 0.286rem; + border: 1px solid var(--border-color); + border-radius: 6px; + margin: 0; + background: var(--field-background); + color: var(--field-text-color); + font-size: 1.143rem; - &[data-focused] { - outline: 2px solid var(--focus-ring-color); - outline-offset: -1px; + &[data-focused] { + outline: 2px solid var(--focus-ring-color); + outline-offset: -1px; + } } - } - .react-aria-Input, - .react-aria-TextArea { - &[data-invalid] { - border-color: var(--color-invalid); + .react-aria-Input, + .react-aria-TextArea { + &[data-invalid] { + border-color: var(--color-invalid); + } } - } - .react-aria-FieldError { - color: var(--color-invalid); - font-size: 12px; - } + .react-aria-FieldError { + color: var(--color-invalid); + font-size: 12px; + } - [slot='description'] { - font-size: 12px; - } + [slot='description'] { + font-size: 12px; + } - .react-aria-Input, - .react-aria-TextArea { - &[data-disabled] { - border-color: var(--border-color-disabled); - color: var(--text-color-disabled); + .react-aria-Input, + .react-aria-TextArea { + &[data-disabled] { + border-color: var(--border-color-disabled); + color: var(--text-color-disabled); + } } } } diff --git a/packages/components/src/styles/basic/TimeField.css b/packages/components/src/styles/basic/TimeField.css index 3248814609..4fb876a93b 100644 --- a/packages/components/src/styles/basic/TimeField.css +++ b/packages/components/src/styles/basic/TimeField.css @@ -2,67 +2,69 @@ @import './Button.css'; @import './theme.css'; -.react-aria-TimeField { - color: var(--text-color); -} - -.react-aria-DateInput { - display: flex; - width: fit-content; - min-width: 150px; - padding: 4px; - border: 1px solid var(--border-color); - border-radius: 6px; - background: var(--field-background); - forced-color-adjust: none; - white-space: nowrap; - - &[data-focus-within] { - outline: 2px solid var(--focus-ring-color); - outline-offset: -1px; +@layer plone-components { + .react-aria-TimeField { + color: var(--text-color); } -} -.react-aria-DateSegment { - padding: 0 2px; - color: var(--text-color); - font-variant-numeric: tabular-nums; - text-align: end; + .react-aria-DateInput { + display: flex; + width: fit-content; + min-width: 150px; + padding: 4px; + border: 1px solid var(--border-color); + border-radius: 6px; + background: var(--field-background); + forced-color-adjust: none; + white-space: nowrap; - &[data-type='literal'] { - padding: 0; + &[data-focus-within] { + outline: 2px solid var(--focus-ring-color); + outline-offset: -1px; + } } - &[data-placeholder] { - color: var(--text-color-placeholder); - font-style: italic; - } + .react-aria-DateSegment { + padding: 0 2px; + color: var(--text-color); + font-variant-numeric: tabular-nums; + text-align: end; - &:focus { - border-radius: 4px; - background: var(--highlight-background); - caret-color: transparent; - color: var(--highlight-foreground); - outline: none; - } + &[data-type='literal'] { + padding: 0; + } - &[data-invalid] { - color: var(--color-invalid); + &[data-placeholder] { + color: var(--text-color-placeholder); + font-style: italic; + } &:focus { - background: var(--highlight-background-invalid); + border-radius: 4px; + background: var(--highlight-background); + caret-color: transparent; color: var(--highlight-foreground); + outline: none; } - } -} -.react-aria-TimeField { - .react-aria-FieldError { - color: var(--color-invalid); - font-size: 12px; + &[data-invalid] { + color: var(--color-invalid); + + &:focus { + background: var(--highlight-background-invalid); + color: var(--highlight-foreground); + } + } } - [slot='description'] { - font-size: 12px; + .react-aria-TimeField { + .react-aria-FieldError { + color: var(--color-invalid); + font-size: 12px; + } + + [slot='description'] { + font-size: 12px; + } } } diff --git a/packages/components/src/styles/basic/ToggleButton.css b/packages/components/src/styles/basic/ToggleButton.css index 944a343d69..6e7ad2bb39 100644 --- a/packages/components/src/styles/basic/ToggleButton.css +++ b/packages/components/src/styles/basic/ToggleButton.css @@ -1,54 +1,56 @@ @import './theme.css'; -.react-aria-ToggleButton { - padding: 8px 8px; - border: 1px solid var(--border-color); - border-radius: 6px; - margin: 0; - appearance: none; - background: var(--button-background); - color: var(--text-color); - font-size: 1rem; - forced-color-adjust: none; - outline: none; - text-align: center; - vertical-align: middle; - - &[data-pressed] { - border-color: var(--border-color-pressed); - background: var(--button-background-pressed); - box-shadow: inset 0 1px 2px rgb(0 0 0 / 0.1); - } - - &[data-selected] { - border-color: var(--highlight-background); - background: var(--highlight-background); - color: var(--highlight-foreground); +@layer plone-components { + .react-aria-ToggleButton { + padding: 8px 8px; + border: 1px solid var(--border-color); + border-radius: 6px; + margin: 0; + appearance: none; + background: var(--button-background); + color: var(--text-color); + font-size: 1rem; + forced-color-adjust: none; + outline: none; + text-align: center; + vertical-align: middle; &[data-pressed] { - border-color: var(--highlight-background-pressed); - background: var(--highlight-background-pressed); + border-color: var(--border-color-pressed); + background: var(--button-background-pressed); + box-shadow: inset 0 1px 2px rgb(0 0 0 / 0.1); } - } - &[data-focus-visible] { - outline: 2px solid var(--focus-ring-color); - outline-offset: 2px; - } + &[data-selected] { + border-color: var(--highlight-background); + background: var(--highlight-background); + color: var(--highlight-foreground); - &[data-disabled] { - border-color: var(--border-color-disabled); - background: var(--button-background); - color: var(--text-color-disabled); - } + &[data-pressed] { + border-color: var(--highlight-background-pressed); + background: var(--highlight-background-pressed); + } + } - .icon:not(:last-child) { - margin-right: 6px; - } + &[data-focus-visible] { + outline: 2px solid var(--focus-ring-color); + outline-offset: 2px; + } + + &[data-disabled] { + border-color: var(--border-color-disabled); + background: var(--button-background); + color: var(--text-color-disabled); + } - &:has(.icon) { - display: inline-flex; - align-items: center; - line-height: 0; + .icon:not(:last-child) { + margin-right: 6px; + } + + &:has(.icon) { + display: inline-flex; + align-items: center; + line-height: 0; + } } } diff --git a/packages/components/src/styles/basic/Toolbar.css b/packages/components/src/styles/basic/Toolbar.css index 2d025f561d..306f570fc7 100644 --- a/packages/components/src/styles/basic/Toolbar.css +++ b/packages/components/src/styles/basic/Toolbar.css @@ -4,44 +4,46 @@ @import './Menu.css'; @import './theme.css'; -.react-aria-Toolbar { - display: flex; - flex-wrap: wrap; - gap: 5px; - - &[data-orientation='horizontal'] { - flex-direction: row; - } - - .react-aria-Group { - display: contents; +@layer plone-components { + .react-aria-Toolbar { + display: flex; + flex-wrap: wrap; + gap: 5px; + + &[data-orientation='horizontal'] { + flex-direction: row; + } + + .react-aria-Group { + display: contents; + } } -} -.react-aria-Separator { - align-self: stretch; - background-color: var(--border-color); + .react-aria-Separator { + align-self: stretch; + background-color: var(--border-color); - &[aria-orientation='vertical'] { - width: 1px; - margin: 0px 10px; + &[aria-orientation='vertical'] { + width: 1px; + margin: 0px 10px; + } } -} -.react-aria-Toolbar { - width: fit-content; + .react-aria-Toolbar { + width: fit-content; - &[data-orientation='vertical'] { - flex-direction: column; - align-items: flex-start; + &[data-orientation='vertical'] { + flex-direction: column; + align-items: flex-start; + } } -} -.react-aria-Separator { - &:not([aria-orientation='vertical']) { - width: 100%; - height: 1px; - border: none; - margin: 10px 0; + .react-aria-Separator { + &:not([aria-orientation='vertical']) { + width: 100%; + height: 1px; + border: none; + margin: 10px 0; + } } } diff --git a/packages/components/src/styles/basic/Tooltip.css b/packages/components/src/styles/basic/Tooltip.css index b8294360f0..8965f2bd7e 100644 --- a/packages/components/src/styles/basic/Tooltip.css +++ b/packages/components/src/styles/basic/Tooltip.css @@ -1,69 +1,71 @@ @import './Button.css'; @import './theme.css'; -.react-aria-Tooltip { - max-width: 150px; - padding: 2px 8px; - border-radius: 4px; - background: var(--highlight-background); - box-shadow: 0 8px 20px rgba(0 0 0 / 0.1); - color: var(--highlight-foreground); - forced-color-adjust: none; - outline: none; - /* fixes FF gap */ - transform: translate3d(0, 0, 0); +@layer plone-components { + .react-aria-Tooltip { + max-width: 150px; + padding: 2px 8px; + border-radius: 4px; + background: var(--highlight-background); + box-shadow: 0 8px 20px rgba(0 0 0 / 0.1); + color: var(--highlight-foreground); + forced-color-adjust: none; + outline: none; + /* fixes FF gap */ + transform: translate3d(0, 0, 0); - &[data-placement='top'] { - margin-bottom: 8px; - --origin: translateY(4px); - } + &[data-placement='top'] { + margin-bottom: 8px; + --origin: translateY(4px); + } - &[data-placement='bottom'] { - margin-top: 8px; - --origin: translateY(-4px); - & .react-aria-OverlayArrow svg { - transform: rotate(180deg); + &[data-placement='bottom'] { + margin-top: 8px; + --origin: translateY(-4px); + & .react-aria-OverlayArrow svg { + transform: rotate(180deg); + } } - } - &[data-placement='right'] { - margin-left: 8px; - --origin: translateX(-4px); - & .react-aria-OverlayArrow svg { - transform: rotate(90deg); + &[data-placement='right'] { + margin-left: 8px; + --origin: translateX(-4px); + & .react-aria-OverlayArrow svg { + transform: rotate(90deg); + } } - } - &[data-placement='left'] { - margin-right: 8px; - --origin: translateX(4px); - & .react-aria-OverlayArrow svg { - transform: rotate(-90deg); + &[data-placement='left'] { + margin-right: 8px; + --origin: translateX(4px); + & .react-aria-OverlayArrow svg { + transform: rotate(-90deg); + } } - } - & .react-aria-OverlayArrow svg { - display: block; - fill: var(--highlight-background); - } + & .react-aria-OverlayArrow svg { + display: block; + fill: var(--highlight-background); + } - &[data-entering] { - animation: slide 200ms; - } + &[data-entering] { + animation: slide 200ms; + } - &[data-exiting] { - animation: slide 200ms reverse ease-in; + &[data-exiting] { + animation: slide 200ms reverse ease-in; + } } -} -@keyframes slide { - from { - opacity: 0; - transform: var(--origin); - } + @keyframes slide { + from { + opacity: 0; + transform: var(--origin); + } - to { - opacity: 1; - transform: translateY(0); + to { + opacity: 1; + transform: translateY(0); + } } } diff --git a/packages/components/src/styles/basic/icons.css b/packages/components/src/styles/basic/icons.css index 2174fefb9f..ec69303237 100644 --- a/packages/components/src/styles/basic/icons.css +++ b/packages/components/src/styles/basic/icons.css @@ -1,108 +1,110 @@ @import './theme.css'; -:root { - /* These has to be mapped to global css custom properties based on the SG scales */ - --quanta-icon-default-size-s: 18px; - --quanta-icon-default-size-m: 24px; - --quanta-icon-size-s: var(--quanta-icon-default-size-s); - --quanta-icon-size-m: var(--quanta-icon-default-size-m); - --quanta-icon-size-xxs: calc(var(--quanta-icon-size-s) / 2); - --quanta-icon-size-xs: calc(var(--quanta-icon-size-m) / 2); - --quanta-icon-size-l: calc(var(--quanta-icon-size-s) * 2); - --quanta-icon-size-xl: calc(var(--quanta-icon-size-m) * 2); - --quanta-icon-size-xxl: calc(var(--quanta-icon-size-m) * 3); +@layer plone-components { + :root { + /* These has to be mapped to global css custom properties based on the SG scales */ + --quanta-icon-default-size-s: 18px; + --quanta-icon-default-size-m: 24px; + --quanta-icon-size-s: var(--quanta-icon-default-size-s); + --quanta-icon-size-m: var(--quanta-icon-default-size-m); + --quanta-icon-size-xxs: calc(var(--quanta-icon-size-s) / 2); + --quanta-icon-size-xs: calc(var(--quanta-icon-size-m) / 2); + --quanta-icon-size-l: calc(var(--quanta-icon-size-s) * 2); + --quanta-icon-size-xl: calc(var(--quanta-icon-size-m) * 2); + --quanta-icon-size-xxl: calc(var(--quanta-icon-size-m) * 3); - --quanta-color-icon-informative: var(--quanta-sapphire); - --quanta-color-icon-negative: var(--quanta-candy); - --quanta-color-icon-positive: var(--quanta-neon); - --quanta-color-icon-notice: var(--quanta-lemmon); -} + --quanta-color-icon-informative: var(--quanta-sapphire); + --quanta-color-icon-negative: var(--quanta-candy); + --quanta-color-icon-positive: var(--quanta-neon); + --quanta-color-icon-notice: var(--quanta-lemmon); + } -.q.icon { - display: inline-block; + .q.icon { + display: inline-block; - /* Inherit the text color */ - color: inherit; + /* Inherit the text color */ + color: inherit; - /* Fill should match the current text color */ - fill: currentColor; + /* Fill should match the current text color */ + fill: currentColor; - /* Hide the svg overflow in IE. */ - &:not(:root) { - overflow: hidden; - } + /* Hide the svg overflow in IE. */ + &:not(:root) { + overflow: hidden; + } - /* Don't catch clicks or hover, otherwise they may not escape the SVG */ - pointer-events: none; -} -@media (forced-colors: active) { - .q.icon { - /* Automatically adjust the SVG to pick up the text color for High Contrast mode */ - forced-color-adjust: auto; + /* Don't catch clicks or hover, otherwise they may not escape the SVG */ + pointer-events: none; } -} - -.q { - &.icon--sizeXXS { - &, - img, - svg { - block-size: var(--quanta-icon-size-xxs); - inline-size: var(--quanta-icon-size-xxs); + @media (forced-colors: active) { + .q.icon { + /* Automatically adjust the SVG to pick up the text color for High Contrast mode */ + forced-color-adjust: auto; } } - &.icon--sizeXS { - &, - img, - svg { - block-size: var(--quanta-icon-size-xs); - inline-size: var(--quanta-icon-size-xs); + .q { + &.icon--sizeXXS { + &, + img, + svg { + block-size: var(--quanta-icon-size-xxs); + inline-size: var(--quanta-icon-size-xxs); + } } - } - &.icon--sizeS { - &, - img, - svg { - block-size: var(--quanta-icon-size-s); - inline-size: var(--quanta-icon-size-s); + &.icon--sizeXS { + &, + img, + svg { + block-size: var(--quanta-icon-size-xs); + inline-size: var(--quanta-icon-size-xs); + } } - } - &.icon--sizeM { - &, - img, - svg { - block-size: var(--quanta-icon-size-m); - inline-size: var(--quanta-icon-size-m); + &.icon--sizeS { + &, + img, + svg { + block-size: var(--quanta-icon-size-s); + inline-size: var(--quanta-icon-size-s); + } } - } - &.icon--sizeL { - &, - img, - svg { - block-size: var(--quanta-icon-size-l); - inline-size: var(--quanta-icon-size-l); + &.icon--sizeM { + &, + img, + svg { + block-size: var(--quanta-icon-size-m); + inline-size: var(--quanta-icon-size-m); + } } - } - &.icon--sizeXL { - &, - img, - svg { - block-size: var(--quanta-icon-size-xl); - inline-size: var(--quanta-icon-size-xl); + &.icon--sizeL { + &, + img, + svg { + block-size: var(--quanta-icon-size-l); + inline-size: var(--quanta-icon-size-l); + } + } + + &.icon--sizeXL { + &, + img, + svg { + block-size: var(--quanta-icon-size-xl); + inline-size: var(--quanta-icon-size-xl); + } } - } - &.icon--sizeXXL { - &, - img, - svg { - block-size: var(--quanta-icon-size-xxl); - inline-size: var(--quanta-icon-size-xxl); + &.icon--sizeXXL { + &, + img, + svg { + block-size: var(--quanta-icon-size-xxl); + inline-size: var(--quanta-icon-size-xxl); + } } } } diff --git a/packages/components/src/styles/quanta/Popover.css b/packages/components/src/styles/quanta/Popover.css index caf9cee464..3fe7b88232 100644 --- a/packages/components/src/styles/quanta/Popover.css +++ b/packages/components/src/styles/quanta/Popover.css @@ -1,3 +1,5 @@ -.q.react-aria-Popover { - --border-color: transparent; +@layer plone-components.quanta { + .q.react-aria-Popover { + --border-color: transparent; + } } diff --git a/packages/components/src/styles/quanta/Select.css b/packages/components/src/styles/quanta/Select.css index dda92780e5..46aaf53aec 100644 --- a/packages/components/src/styles/quanta/Select.css +++ b/packages/components/src/styles/quanta/Select.css @@ -1,38 +1,40 @@ -/* Quanta does not have to redefine colors, but it has to override the original ones coming +@layer plone-components.quanta { + /* Quanta does not have to redefine colors, but it has to override the original ones coming from the basic styles. Then, if people override the basic ones, then they won't get overridden in Quanta. */ -.q.react-aria-Select { - .react-aria-Label { - color: var(--quanta-sapphire); - } + .q.react-aria-Select { + .react-aria-Label { + color: var(--quanta-sapphire); + } - .react-aria-Button { - padding: 12px; - border: 0; - background-color: var(--basic-200); - box-shadow: 0 0 0 rgba(2, 19, 34, 0); - caret-color: var(--quanta-cobalt); + .react-aria-Button { + padding: 12px; + border: 0; + background-color: var(--basic-200); + box-shadow: 0 0 0 rgba(2, 19, 34, 0); + caret-color: var(--quanta-cobalt); - span[aria-hidden] { - background: transparent; - color: var(--text-color); - } + span[aria-hidden] { + background: transparent; + color: var(--text-color); + } - &[data-hovered] { - background-color: var(--basic-300); - } + &[data-hovered] { + background-color: var(--basic-300); + } - &[data-focused], - &[data-pressed] { - background-color: var(--basic-50); - box-shadow: inset 0 0 0 2px var(--quanta-cobalt); - outline: 0; + &[data-focused], + &[data-pressed] { + background-color: var(--basic-50); + box-shadow: inset 0 0 0 2px var(--quanta-cobalt); + outline: 0; + } } } -} -.q.react-aria-Popover[data-trigger='Select'] { - .react-aria-ListBoxItem { - --highlight-background: var(--basic-300); - --highlight-foreground: var(--text-color); + .q.react-aria-Popover[data-trigger='Select'] { + .react-aria-ListBoxItem { + --highlight-background: var(--basic-300); + --highlight-foreground: var(--text-color); + } } } diff --git a/packages/components/src/styles/quanta/Table.css b/packages/components/src/styles/quanta/Table.css index 64bf060907..f498a41c9f 100644 --- a/packages/components/src/styles/quanta/Table.css +++ b/packages/components/src/styles/quanta/Table.css @@ -1,4 +1,6 @@ -.react-aria-Table { - --plone-table-header-color: var(--quanta-sapphire); - --plone-table-cell-border-bottom: 1px solid var(--quanta-smoke); +@layer plone-components.quanta { + .react-aria-Table { + --plone-table-header-color: var(--quanta-sapphire); + --plone-table-cell-border-bottom: 1px solid var(--quanta-smoke); + } } diff --git a/packages/components/src/styles/quanta/TextField.css b/packages/components/src/styles/quanta/TextField.css index 2ef292e85a..70d383d157 100644 --- a/packages/components/src/styles/quanta/TextField.css +++ b/packages/components/src/styles/quanta/TextField.css @@ -1,167 +1,169 @@ -.q.react-aria-TextField, -.q.react-aria-TextAreaField { - position: relative; - - .react-aria-Label { - color: var(--quanta-sapphire); - pointer-events: none; - touch-action: none; - transition: - margin-top 0.15s ease-in-out, - margin-left 0.15s ease-in-out, - transform 0.15s ease-in-out; - user-select: none; - } - - .react-aria-Label:has(+ .react-aria-Input, + .react-aria-TextArea) { - position: absolute; - top: 10px; - left: 12px; - } +@layer plone-components.quanta { + .q.react-aria-TextField, + .q.react-aria-TextAreaField { + position: relative; - .react-aria-Label:has( - + .react-aria-Input[data-focused], - + .react-aria-TextArea[data-focused] - ), - .react-aria-Label:has( - + .react-aria-Input:not(:placeholder-shown), - + .react-aria-TextArea:not(:placeholder-shown) - ) { - margin-top: -30px; - margin-left: -12px; - transform: scale(0.8571428571, 0.8571428571); - transform-origin: 0 0; - } + .react-aria-Label { + color: var(--quanta-sapphire); + pointer-events: none; + touch-action: none; + transition: + margin-top 0.15s ease-in-out, + margin-left 0.15s ease-in-out, + transform 0.15s ease-in-out; + user-select: none; + } - .react-aria-Label:has( - + .react-aria-Input:not(:placeholder-shown):not(:hover):not(:active):not( - :focus - ), - + .react-aria-TextArea:not(:placeholder-shown):not(:hover):not( - :active - ):not(:focus) - ) { - color: var(--basic-500); - } + .react-aria-Label:has(+ .react-aria-Input, + .react-aria-TextArea) { + position: absolute; + top: 10px; + left: 12px; + } - .react-aria-Label:has( - + .react-aria-Input[required], - + .react-aria-TextArea[required] - )::after { - /* https://yoksel.github.io/url-encoder/ */ - content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24'%3E%3Cpath fill='hsl(7, 90%25, 59%25)' d='M12 18a6 6 0 100-12 6 6 0 000 12z'/%3E%3C/svg%3E"); - } + .react-aria-Label:has( + + .react-aria-Input[data-focused], + + .react-aria-TextArea[data-focused] + ), + .react-aria-Label:has( + + .react-aria-Input:not(:placeholder-shown), + + .react-aria-TextArea:not(:placeholder-shown) + ) { + margin-top: -30px; + margin-left: -12px; + transform: scale(0.8571428571, 0.8571428571); + transform-origin: 0 0; + } - .react-aria-Label:has( - + .react-aria-Input[required]:not(:placeholder-shown):not(:hover):not( - :active - ):not(:focus), - + .react-aria-TextArea[required]:not(:placeholder-shown):not(:hover):not( - :active - ):not(:focus) - )::after { - filter: grayscale(1); - } + .react-aria-Label:has( + + .react-aria-Input:not(:placeholder-shown):not(:hover):not( + :active + ):not(:focus), + + .react-aria-TextArea:not(:placeholder-shown):not(:hover):not( + :active + ):not(:focus) + ) { + color: var(--basic-500); + } - .react-aria-Label:has( - + .react-aria-Input[data-invalid], - + .react-aria-TextArea[data-invalid] - ) { - color: var(--quanta-candy) !important; + .react-aria-Label:has( + + .react-aria-Input[required], + + .react-aria-TextArea[required] + )::after { + /* https://yoksel.github.io/url-encoder/ */ + content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24'%3E%3Cpath fill='hsl(7, 90%25, 59%25)' d='M12 18a6 6 0 100-12 6 6 0 000 12z'/%3E%3C/svg%3E"); + } - &::after { - filter: none !important; + .react-aria-Label:has( + + .react-aria-Input[required]:not(:placeholder-shown):not(:hover):not( + :active + ):not(:focus), + + .react-aria-TextArea[required]:not(:placeholder-shown):not( + :hover + ):not(:active):not(:focus) + )::after { + filter: grayscale(1); } - } - .react-aria-Label:has( - + .react-aria-Input[data-disabled], - + .react-aria-TextArea[data-disabled] - ) { - color: var(--basic-400) !important; - } + .react-aria-Label:has( + + .react-aria-Input[data-invalid], + + .react-aria-TextArea[data-invalid] + ) { + color: var(--quanta-candy) !important; - .react-aria-Label:has( - + .react-aria-Input[readonly], - + .react-aria-TextArea[readonly] - ) { - color: var(--basic-500); - } -} + &::after { + filter: none !important; + } + } -.q.react-aria-TextField, -.q.react-aria-TextAreaField { - .react-aria-Input, - .react-aria-TextArea { - width: 100%; - padding: 12px; - border: 0; - border-radius: 6px; - background-color: var(--basic-200); - box-shadow: 0 0 0 rgba(2, 19, 34, 0); - caret-color: var(--quanta-cobalt); - color: var(--text-color); - cursor: text; - text-overflow: ellipsis; - transition: - background-color 0.15s ease-in-out, - box-shadow 0.15s ease-in-out; - - &[data-hovered] { - background-color: var(--basic-300); + .react-aria-Label:has( + + .react-aria-Input[data-disabled], + + .react-aria-TextArea[data-disabled] + ) { + color: var(--basic-400) !important; } - &[data-focused] { - background-color: var(--basic-50); - box-shadow: inset 0 0 0 2px var(--quanta-cobalt); - outline: 0; + .react-aria-Label:has( + + .react-aria-Input[readonly], + + .react-aria-TextArea[readonly] + ) { + color: var(--basic-500); } + } - &[data-invalid] { - background-color: var(--quanta-ballet); - outline: 0; + .q.react-aria-TextField, + .q.react-aria-TextAreaField { + .react-aria-Input, + .react-aria-TextArea { + width: 100%; + padding: 12px; + border: 0; + border-radius: 6px; + background-color: var(--basic-200); + box-shadow: 0 0 0 rgba(2, 19, 34, 0); + caret-color: var(--quanta-cobalt); + color: var(--text-color); + cursor: text; + text-overflow: ellipsis; + transition: + background-color 0.15s ease-in-out, + box-shadow 0.15s ease-in-out; + + &[data-hovered] { + background-color: var(--basic-300); + } &[data-focused] { background-color: var(--basic-50); - box-shadow: inset 0 0 0 2px var(--quanta-rose); + box-shadow: inset 0 0 0 2px var(--quanta-cobalt); + outline: 0; } - } - &[data-disabled] { - background-color: var(--basic-50); - box-shadow: inset 0 0 0 1px var(--basic-300); - color: var(--basic-300); - pointer-events: none; + &[data-invalid] { + background-color: var(--quanta-ballet); + outline: 0; - & + .react-aria-Text { + &[data-focused] { + background-color: var(--basic-50); + box-shadow: inset 0 0 0 2px var(--quanta-rose); + } + } + + &[data-disabled] { + background-color: var(--basic-50); + box-shadow: inset 0 0 0 1px var(--basic-300); color: var(--basic-300); + pointer-events: none; + + & + .react-aria-Text { + color: var(--basic-300); + } } - } - &[readonly] { - border: 1px dashed var(--basic-400); - background-color: var(--basic-50); - box-shadow: none; - } + &[readonly] { + border: 1px dashed var(--basic-400); + background-color: var(--basic-50); + box-shadow: none; + } - &::placeholder { - color: var(--basic-400); - opacity: 0; - transition: opacity $time-tiny ease-in-out; - } + &::placeholder { + color: var(--basic-400); + opacity: 0; + transition: opacity $time-tiny ease-in-out; + } - &:active::placeholder, - &:focus::placeholder { - opacity: 1; + &:active::placeholder, + &:focus::placeholder { + opacity: 1; + } } - } - .react-aria-Text { - padding-top: 3px; - color: var(--basic-500); - font-size: 0.9rem; - font-weight: 500; - letter-spacing: 0.012em; - line-height: 1.714285714285; + .react-aria-Text { + padding-top: 3px; + color: var(--basic-500); + font-size: 0.9rem; + font-weight: 500; + letter-spacing: 0.012em; + line-height: 1.714285714285; + } } } diff --git a/packages/nextjs/.eslintrc.cjs b/packages/nextjs/.eslintrc.cjs new file mode 100644 index 0000000000..3e9c6e899d --- /dev/null +++ b/packages/nextjs/.eslintrc.cjs @@ -0,0 +1,76 @@ +/** @type {import('eslint').Linter.Config} */ +module.exports = { + parserOptions: { + ecmaVersion: 'latest', + sourceType: 'module', + ecmaFeatures: { + jsx: true, + }, + }, + env: { + browser: true, + commonjs: true, + es6: true, + }, + + // Base config + extends: ['eslint:recommended'], + + // ignorePatterns: ['docs/_static/searchtools.js'], + + overrides: [ + // React + { + files: ['**/*.{ts,tsx}'], + plugins: ['react', 'jsx-a11y'], + extends: [ + 'plugin:react/recommended', + 'plugin:react/jsx-runtime', + 'plugin:react-hooks/recommended', + 'plugin:jsx-a11y/recommended', + ], + settings: { + react: { + version: 'detect', + }, + }, + }, + + // Typescript + { + files: ['**/*.{ts,tsx}'], + plugins: ['@typescript-eslint', 'import'], + parser: '@typescript-eslint/parser', + settings: { + 'import/resolver': { + node: { + extensions: ['.ts', '.tsx'], + }, + typescript: { + alwaysTryTypes: true, + }, + }, + }, + extends: [ + 'plugin:@typescript-eslint/recommended', + 'plugin:import/recommended', + 'plugin:import/typescript', + ], + rules: { + '@typescript-eslint/no-explicit-any': 0, + }, + }, + + // Node + { + files: ['.eslintrc.cjs', 'src/plugin.ts', '__tests__/**/*.{js,ts}'], + env: { + node: true, + es6: true, + }, + rules: { + 'no-prototype-builtins': 0, + }, + }, + ], +}; diff --git a/packages/nextjs/.gitignore b/packages/nextjs/.gitignore new file mode 100644 index 0000000000..1457d4760d --- /dev/null +++ b/packages/nextjs/.gitignore @@ -0,0 +1,4 @@ +dist +/bin +/lib +/include diff --git a/packages/nextjs/.npmignore b/packages/nextjs/.npmignore new file mode 100644 index 0000000000..a6d10baa1e --- /dev/null +++ b/packages/nextjs/.npmignore @@ -0,0 +1,6 @@ +news +towncrier.toml +.changelog.draft +node_modules/ +.release-it.json +.eslintrc.js diff --git a/packages/nextjs/.release-it.json b/packages/nextjs/.release-it.json new file mode 100644 index 0000000000..1697f3c8b6 --- /dev/null +++ b/packages/nextjs/.release-it.json @@ -0,0 +1,30 @@ +{ + "plugins": { + "../scripts/prepublish.js": {} + }, + "hooks": { + "after:bump": [ + "pipx run towncrier build --draft --yes --version ${version} > .changelog.draft", + "pipx run towncrier build --yes --version ${version}", + "pnpm build:force" + ], + "after:release": "rm .changelog.draft" + }, + "npm": { + "publish": false + }, + "git": { + "commitArgs": ["--no-verify"], + "changelog": "pipx run towncrier build --draft --yes --version 0.0.0", + "requireUpstream": false, + "requireCleanWorkingDir": false, + "commitMessage": "Release @plone/nextjs ${version}", + "tagName": "plone-nextjs-${version}", + "tagAnnotation": "Release @plone/nextjs ${version}" + }, + "github": { + "release": true, + "releaseName": "@plone/nextjs ${version}", + "releaseNotes": "cat .changelog.draft" + } +} diff --git a/packages/nextjs/CHANGELOG.md b/packages/nextjs/CHANGELOG.md new file mode 100644 index 0000000000..c378ba8e26 --- /dev/null +++ b/packages/nextjs/CHANGELOG.md @@ -0,0 +1,9 @@ +# @plone/nextjs Release Notes + + + + diff --git a/packages/nextjs/Makefile b/packages/nextjs/Makefile new file mode 100644 index 0000000000..e2c534281e --- /dev/null +++ b/packages/nextjs/Makefile @@ -0,0 +1,32 @@ +### Defensive settings for make: +# https://tech.davis-hansson.com/p/make/ +SHELL:=bash +.ONESHELL: +.SHELLFLAGS:=-eu -o pipefail -c +.SILENT: +.DELETE_ON_ERROR: +MAKEFLAGS+=--warn-undefined-variables +MAKEFLAGS+=--no-builtin-rules + +# Sphinx variables +# You can set these variables from the command line. +SPHINXOPTS ?= +VALEOPTS ?= +# Internal variables. +SPHINXBUILD = "$(realpath bin/sphinx-build)" +SPHINXAUTOBUILD = "$(realpath bin/sphinx-autobuild)" +DOCS_DIR = ./docs/ +BUILDDIR = ./_build/ +ALLSPHINXOPTS = -d $(BUILDDIR)/doctrees $(SPHINXOPTS) . +VALEFILES := $(shell find $(DOCS_DIR) -type f -name "*.md" -print) + +# We like colors +# From: https://coderwall.com/p/izxssa/colored-makefile-for-golang-projects +RED=`tput setaf 1` +GREEN=`tput setaf 2` +RESET=`tput sgr0` +YELLOW=`tput setaf 3` + +## Docs + +## Build diff --git a/packages/nextjs/README.md b/packages/nextjs/README.md new file mode 100644 index 0000000000..955ea394e3 --- /dev/null +++ b/packages/nextjs/README.md @@ -0,0 +1,9 @@ +# Next.js configuration for Plone + +This package provides support for building a Plone website with Next.js. + +## Documentation + +You can find the detailed documentation of this package by visiting the following link. + +TBD diff --git a/packages/nextjs/news/.gitkeep b/packages/nextjs/news/.gitkeep new file mode 100644 index 0000000000..e69de29bb2 diff --git a/packages/nextjs/package.json b/packages/nextjs/package.json new file mode 100644 index 0000000000..9e8a440088 --- /dev/null +++ b/packages/nextjs/package.json @@ -0,0 +1,91 @@ +{ + "name": "@plone/nextjs", + "description": "Next.js configuration for Plone", + "maintainers": [ + { + "name": "Plone Foundation", + "url": "https://plone.org" + } + ], + "funding": "https://github.com/sponsors/plone", + "license": "MIT", + "version": "0.1.0", + "repository": { + "type": "git", + "url": "https://github.com/plone/volto.git" + }, + "bugs": { + "url": "https://github.com/plone/volto/issues" + }, + "homepage": "https://plone.org", + "keywords": [ + "volto", + "plone", + "plone6", + "react", + "add-ons", + "nextjs", + "configuration", + "config" + ], + "publishConfig": { + "access": "public" + }, + "type": "module", + "files:": [ + "dist", + "README.md" + ], + "main": "dist/index.js", + "exports": { + "./package.json": "./package.json", + ".": { + "import": "./dist/index.js", + "default": "./dist/index.cjs" + }, + "./plugin": { + "import": "./dist/plugin.js", + "default": "./dist/plugin.cjs" + } + }, + "scripts": { + "build": "tsup", + "build:force": "rm -rf dist && tsup", + "check:exports": "attw --pack .", + "test": "vitest", + "test:debug": "vitest --inspect-brk --no-file-parallelism nextjs", + "dry-release": "release-it --dry-run", + "release": "release-it", + "release-major-alpha": "release-it major --preRelease=alpha", + "release-alpha": "release-it --preRelease=alpha" + }, + "peerDependencies": { + "@plone/blocks": "workspace:1.0.0-alpha.1", + "@plone/registry": "^2.1.2", + "next": "14.2.14", + "react": "^16.8.0 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0" + }, + "peerDependenciesMeta": { + "react-dom": { + "optional": true + } + }, + "devDependencies": { + "@arethetypeswrong/cli": "^0.16.4", + "@plone/blocks": "workspace:*", + "@plone/registry": "workspace:*", + "@plone/types": "workspace:*", + "@types/node": "^20", + "@types/react": "^18", + "@types/react-dom": "^18", + "next": "14.2.14", + "react": "^18.2.0", + "react-dom": "^18.2.0", + "release-it": "16.2.1", + "tsconfig": "workspace:*", + "tsup": "^8.3.5", + "typescript": "^5.6.3", + "vitest": "^2.1.3" + } +} diff --git a/packages/nextjs/src/index.ts b/packages/nextjs/src/index.ts new file mode 100644 index 0000000000..ada321a286 --- /dev/null +++ b/packages/nextjs/src/index.ts @@ -0,0 +1,32 @@ +import { type ConfigType } from '@plone/registry'; +import applyAddonConfiguration, { + addonsInfo, + // @ts-expect-error Improve typings +} from '@plone/registry/addons-loader'; // eslint-disable-line import/no-unresolved + +export default function install(config: ConfigType): ConfigType { + const settings: Partial = { + addonsInfo, + }; + + if (process.env.NEXT_PUBLIC_VERCEL_URL) { + // This app is at Vercel + if (process.env.NEXT_PRODUCTION_URL) { + // This app is in a production deployment, so set the apiPath to the production URL + settings.apiPath = process.env.NEXT_PRODUCTION_URL; + } else { + // This app is in a preview deployment, so set the apiPath to the Vercel URL + settings.apiPath = `https://${process.env.NEXT_PUBLIC_VERCEL_URL}`; + } + } else { + // This app is in development, so set the apiPath to localhost + settings.apiPath = 'http://localhost:3000/'; + } + + // @ts-expect-error Improve typings + config.set('settings', settings); + + applyAddonConfiguration(config); + + return config; +} diff --git a/packages/nextjs/src/plugin.ts b/packages/nextjs/src/plugin.ts new file mode 100644 index 0000000000..cb3fec5e8e --- /dev/null +++ b/packages/nextjs/src/plugin.ts @@ -0,0 +1,53 @@ +import { withRegistry } from '@plone/registry/next-plugin'; +import { type NextConfig } from 'next'; + +export function withPlone(prevConfig: NextConfig): NextConfig { + const config = withRegistry(prevConfig); + + const { rewrites: previousRewriteFn } = config; + + // Rewrite to the backend to avoid CORS + config.rewrites = async function () { + const previousRewrites = previousRewriteFn ? await previousRewriteFn() : []; + + let apiServerURL, vhmRewriteRule; + if ( + process.env.API_SERVER_URL && + (process.env.NEXT_PRODUCTION_URL || process.env.NEXT_PUBLIC_VERCEL_URL) + ) { + // We are in Vercel + apiServerURL = process.env.API_SERVER_URL; + vhmRewriteRule = `/VirtualHostBase/https/${ + process.env.NEXT_PRODUCTION_URL + ? // We are in the production deployment + process.env.NEXT_PRODUCTION_URL + : // We are in the preview deployment + process.env.NEXT_PUBLIC_VERCEL_URL + }%3A443/Plone/%2B%2Bapi%2B%2B/VirtualHostRoot`; + } else if (process.env.API_SERVER_URL) { + // We are in development + apiServerURL = process.env.API_SERVER_URL; + vhmRewriteRule = + '/VirtualHostBase/http/localhost%3A3000/Plone/%2B%2Bapi%2B%2B/VirtualHostRoot'; + } else { + // We are in development and the API_SERVER_URL is not set, so we use a local backend + apiServerURL = 'http://localhost:8080'; + vhmRewriteRule = + '/VirtualHostBase/http/localhost%3A3000/Plone/%2B%2Bapi%2B%2B/VirtualHostRoot'; + } + + return [ + // TODO support the object notation for rewrites as well + ...(Array.isArray(previousRewrites) ? previousRewrites : []), + { + source: '/\\+\\+api\\+\\+/:slug*', + destination: + // 'https://static.197.123.88.23.clients.your-server.de/api/:slug*', + // `${apiServerURL}/:slug*`, + `${apiServerURL}${vhmRewriteRule}/:slug*`, + }, + ]; + }; + + return config; +} diff --git a/packages/nextjs/towncrier.toml b/packages/nextjs/towncrier.toml new file mode 100644 index 0000000000..3ef721f378 --- /dev/null +++ b/packages/nextjs/towncrier.toml @@ -0,0 +1,33 @@ +[tool.towncrier] +filename = "CHANGELOG.md" +directory = "news/" +title_format = "## {version} ({project_date})" +underlines = ["", "", ""] +template = "../scripts/templates/towncrier_template.jinja" +start_string = "\n" +issue_format = "[#{issue}](https://github.com/plone/volto/issues/{issue})" + +[[tool.towncrier.type]] +directory = "breaking" +name = "Breaking" +showcontent = true + +[[tool.towncrier.type]] +directory = "feature" +name = "Feature" +showcontent = true + +[[tool.towncrier.type]] +directory = "bugfix" +name = "Bugfix" +showcontent = true + +[[tool.towncrier.type]] +directory = "internal" +name = "Internal" +showcontent = true + +[[tool.towncrier.type]] +directory = "documentation" +name = "Documentation" +showcontent = true diff --git a/packages/nextjs/tsconfig.json b/packages/nextjs/tsconfig.json new file mode 100644 index 0000000000..5ab3185eba --- /dev/null +++ b/packages/nextjs/tsconfig.json @@ -0,0 +1,38 @@ +{ + "compilerOptions": { + "esModuleInterop": true, + "skipLibCheck": true, + "target": "es2022", + "allowJs": true, + "resolveJsonModule": true, + "moduleDetection": "force", + "isolatedModules": true, + "verbatimModuleSyntax": true, + + "strict": true, + "noImplicitOverride": true, + + "lib": ["es2022", "dom", "dom.iterable"], + "module": "preserve", + "noEmit": true, + + "jsx": "react-jsx", + + "allowSyntheticDefaultImports": true, + "forceConsistentCasingInFileNames": true, + "strictPropertyInitialization": false, + + "paths": {} + }, + "include": ["src/index.ts"], + "exclude": [ + "node_modules", + "build", + "public", + "coverage", + "src/**/*.test.{js,jsx,ts,tsx}", + "src/**/*.spec.{js,jsx,ts,tsx}", + "src/**/*.stories.{js,jsx,ts,tsx}" + ], + "references": [{ "path": "./tsconfig.node.json" }] +} diff --git a/packages/nextjs/tsconfig.node.json b/packages/nextjs/tsconfig.node.json new file mode 100644 index 0000000000..65f7c87589 --- /dev/null +++ b/packages/nextjs/tsconfig.node.json @@ -0,0 +1,24 @@ +{ + "compilerOptions": { + "composite": true, + /* Base Options: */ + "esModuleInterop": true, + "skipLibCheck": true, + "target": "es2022", + "allowJs": true, + "resolveJsonModule": true, + "moduleDetection": "force", + "isolatedModules": true, + /* Strictness */ + "strict": true, + "noImplicitOverride": true, + /* If transpiling with TypeScript: */ + "module": "Preserve", + "outDir": "dist", + "sourceMap": true, + /* If your code doesn't run in the DOM: */ + "lib": ["es2022"], + "declaration": true + }, + "include": ["src"] +} diff --git a/packages/nextjs/tsup.config.ts b/packages/nextjs/tsup.config.ts new file mode 100644 index 0000000000..ef68d79fa1 --- /dev/null +++ b/packages/nextjs/tsup.config.ts @@ -0,0 +1,10 @@ +import { defineConfig } from 'tsup'; + +export default defineConfig({ + entryPoints: ['src/index.ts', 'src/plugin.ts'], + format: ['cjs', 'esm'], + dts: true, + outDir: 'dist', + clean: true, + external: ['load-registry-addons'], +}); diff --git a/packages/nextjs/vitest.config.ts b/packages/nextjs/vitest.config.ts new file mode 100644 index 0000000000..25d5f37515 --- /dev/null +++ b/packages/nextjs/vitest.config.ts @@ -0,0 +1,10 @@ +import { defineConfig } from 'vitest/config'; + +export default defineConfig({ + test: { + globals: true, + environment: 'jsdom', + // setupFiles: './setupTesting.ts', + exclude: ['**/node_modules/**', '**/lib/**'], + }, +}); diff --git a/packages/quanta/.eslintrc.cjs b/packages/quanta/.eslintrc.cjs new file mode 100644 index 0000000000..c2b021d0bd --- /dev/null +++ b/packages/quanta/.eslintrc.cjs @@ -0,0 +1,76 @@ +/** @type {import('eslint').Linter.Config} */ +module.exports = { + parserOptions: { + ecmaVersion: 'latest', + sourceType: 'module', + ecmaFeatures: { + jsx: true, + }, + }, + env: { + browser: true, + commonjs: true, + es6: true, + }, + + // Base config + extends: ['eslint:recommended'], + + // ignorePatterns: ['docs/_static/searchtools.js'], + + overrides: [ + // React + { + files: ['**/*.{ts,tsx}'], + plugins: ['react', 'jsx-a11y'], + extends: [ + 'plugin:react/recommended', + 'plugin:react/jsx-runtime', + 'plugin:react-hooks/recommended', + 'plugin:jsx-a11y/recommended', + ], + settings: { + react: { + version: 'detect', + }, + }, + }, + + // Typescript + { + files: ['**/*.{ts,tsx}'], + plugins: ['@typescript-eslint', 'import'], + parser: '@typescript-eslint/parser', + settings: { + 'import/resolver': { + node: { + extensions: ['.ts', '.tsx'], + }, + typescript: { + alwaysTryTypes: true, + }, + }, + }, + extends: [ + 'plugin:@typescript-eslint/recommended', + 'plugin:import/recommended', + 'plugin:import/typescript', + ], + rules: { + '@typescript-eslint/no-explicit-any': 0, + }, + }, + + // Node + { + files: ['.eslintrc.cjs', '__tests__/**/*.{js,ts}'], + env: { + node: true, + es6: true, + }, + rules: { + 'no-prototype-builtins': 0, + }, + }, + ], +}; diff --git a/packages/quanta/.gitignore b/packages/quanta/.gitignore new file mode 100644 index 0000000000..1457d4760d --- /dev/null +++ b/packages/quanta/.gitignore @@ -0,0 +1,4 @@ +dist +/bin +/lib +/include diff --git a/packages/quanta/.npmignore b/packages/quanta/.npmignore new file mode 100644 index 0000000000..a6d10baa1e --- /dev/null +++ b/packages/quanta/.npmignore @@ -0,0 +1,6 @@ +news +towncrier.toml +.changelog.draft +node_modules/ +.release-it.json +.eslintrc.js diff --git a/packages/quanta/.release-it.json b/packages/quanta/.release-it.json new file mode 100644 index 0000000000..df7edacad0 --- /dev/null +++ b/packages/quanta/.release-it.json @@ -0,0 +1,30 @@ +{ + "plugins": { + "../scripts/prepublish.js": {} + }, + "hooks": { + "after:bump": [ + "pipx run towncrier build --draft --yes --version ${version} > .changelog.draft", + "pipx run towncrier build --yes --version ${version}", + "pnpm build:force" + ], + "after:release": "rm .changelog.draft" + }, + "npm": { + "publish": false + }, + "git": { + "commitArgs": ["--no-verify"], + "changelog": "pipx run towncrier build --draft --yes --version 0.0.0", + "requireUpstream": false, + "requireCleanWorkingDir": false, + "commitMessage": "Release @plone/quanta ${version}", + "tagName": "plone-quanta-${version}", + "tagAnnotation": "Release @plone/quanta ${version}" + }, + "github": { + "release": true, + "releaseName": "@plone/quanta ${version}", + "releaseNotes": "cat .changelog.draft" + } +} diff --git a/packages/quanta/CHANGELOG.md b/packages/quanta/CHANGELOG.md new file mode 100644 index 0000000000..f0efdbc22d --- /dev/null +++ b/packages/quanta/CHANGELOG.md @@ -0,0 +1,9 @@ +# @plone/quanta Release Notes + + + + diff --git a/packages/quanta/Makefile b/packages/quanta/Makefile new file mode 100644 index 0000000000..e2c534281e --- /dev/null +++ b/packages/quanta/Makefile @@ -0,0 +1,32 @@ +### Defensive settings for make: +# https://tech.davis-hansson.com/p/make/ +SHELL:=bash +.ONESHELL: +.SHELLFLAGS:=-eu -o pipefail -c +.SILENT: +.DELETE_ON_ERROR: +MAKEFLAGS+=--warn-undefined-variables +MAKEFLAGS+=--no-builtin-rules + +# Sphinx variables +# You can set these variables from the command line. +SPHINXOPTS ?= +VALEOPTS ?= +# Internal variables. +SPHINXBUILD = "$(realpath bin/sphinx-build)" +SPHINXAUTOBUILD = "$(realpath bin/sphinx-autobuild)" +DOCS_DIR = ./docs/ +BUILDDIR = ./_build/ +ALLSPHINXOPTS = -d $(BUILDDIR)/doctrees $(SPHINXOPTS) . +VALEFILES := $(shell find $(DOCS_DIR) -type f -name "*.md" -print) + +# We like colors +# From: https://coderwall.com/p/izxssa/colored-makefile-for-golang-projects +RED=`tput setaf 1` +GREEN=`tput setaf 2` +RESET=`tput sgr0` +YELLOW=`tput setaf 3` + +## Docs + +## Build diff --git a/packages/quanta/README.md b/packages/quanta/README.md new file mode 100644 index 0000000000..06a78b8c91 --- /dev/null +++ b/packages/quanta/README.md @@ -0,0 +1,7 @@ +# Quanta theme for Plone + +This package provides a basic theme for Plone 7. + +## Documentation + +TBD diff --git a/packages/quanta/components/Logo/Logo.tsx b/packages/quanta/components/Logo/Logo.tsx new file mode 100644 index 0000000000..9cf9c0f910 --- /dev/null +++ b/packages/quanta/components/Logo/Logo.tsx @@ -0,0 +1,18 @@ +'use client'; + +import { type SlotComponentProps } from '@plone/slots/SlotRenderer'; +import { Link } from '@plone/components'; +import LogoImage from './logo.png'; + +const Logo = (props: SlotComponentProps) => { + const { content } = props; + const navRootPath = content['@components'].navroot?.navroot?.['@id'] || '/'; + + return ( + + {'Site + + ); +}; + +export default Logo; diff --git a/packages/quanta/components/Logo/logo.png b/packages/quanta/components/Logo/logo.png new file mode 100644 index 0000000000..1462554cbc Binary files /dev/null and b/packages/quanta/components/Logo/logo.png differ diff --git a/packages/quanta/index.ts b/packages/quanta/index.ts new file mode 100644 index 0000000000..eb0d7c81ad --- /dev/null +++ b/packages/quanta/index.ts @@ -0,0 +1,5 @@ +import { type ConfigType } from '@plone/registry'; + +export default function install(config: ConfigType): ConfigType { + return config; +} diff --git a/packages/quanta/news/.gitkeep b/packages/quanta/news/.gitkeep new file mode 100644 index 0000000000..e69de29bb2 diff --git a/packages/quanta/package.json b/packages/quanta/package.json new file mode 100644 index 0000000000..7cd01a5deb --- /dev/null +++ b/packages/quanta/package.json @@ -0,0 +1,75 @@ +{ + "name": "@plone/quanta", + "description": "Next.js configuration for Plone", + "maintainers": [ + { + "name": "Plone Foundation", + "url": "https://plone.org" + } + ], + "funding": "https://github.com/sponsors/plone", + "license": "MIT", + "version": "0.1.0", + "repository": { + "type": "git", + "url": "https://github.com/plone/volto.git" + }, + "bugs": { + "url": "https://github.com/plone/volto/issues" + }, + "homepage": "https://plone.org", + "keywords": [ + "volto", + "plone", + "plone6", + "react", + "add-ons", + "quanta", + "theme" + ], + "publishConfig": { + "access": "public" + }, + "type": "module", + "files:": [ + "components", + "views", + "index.ts", + "README.md" + ], + "main": "index.ts", + "scripts": { + "test": "vitest", + "test:debug": "vitest --inspect-brk --no-file-parallelism quanta", + "dry-release": "release-it --dry-run", + "release": "release-it", + "release-major-alpha": "release-it major --preRelease=alpha", + "release-alpha": "release-it --preRelease=alpha" + }, + "peerDependencies": { + "react": "^16.8.0 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0" + }, + "peerDependenciesMeta": { + "react-dom": { + "optional": true + } + }, + "devDependencies": { + "@plone/registry": "workspace:^", + "@plone/types": "workspace:*", + "@types/node": "^20", + "@types/react": "^18", + "@types/react-dom": "^18", + "react": "^18.2.0", + "react-dom": "^18.2.0", + "release-it": "16.2.1", + "tsconfig": "workspace:*", + "typescript": "^5.6.3", + "vitest": "^2.1.3" + }, + "dependencies": { + "@plone/components": "workspace:^", + "@plone/slots": "workspace:^" + } +} diff --git a/packages/quanta/towncrier.toml b/packages/quanta/towncrier.toml new file mode 100644 index 0000000000..3ef721f378 --- /dev/null +++ b/packages/quanta/towncrier.toml @@ -0,0 +1,33 @@ +[tool.towncrier] +filename = "CHANGELOG.md" +directory = "news/" +title_format = "## {version} ({project_date})" +underlines = ["", "", ""] +template = "../scripts/templates/towncrier_template.jinja" +start_string = "\n" +issue_format = "[#{issue}](https://github.com/plone/volto/issues/{issue})" + +[[tool.towncrier.type]] +directory = "breaking" +name = "Breaking" +showcontent = true + +[[tool.towncrier.type]] +directory = "feature" +name = "Feature" +showcontent = true + +[[tool.towncrier.type]] +directory = "bugfix" +name = "Bugfix" +showcontent = true + +[[tool.towncrier.type]] +directory = "internal" +name = "Internal" +showcontent = true + +[[tool.towncrier.type]] +directory = "documentation" +name = "Documentation" +showcontent = true diff --git a/packages/quanta/tsconfig.json b/packages/quanta/tsconfig.json new file mode 100644 index 0000000000..2965402840 --- /dev/null +++ b/packages/quanta/tsconfig.json @@ -0,0 +1,13 @@ +{ + "extends": "tsconfig/react-library.json", + "include": ["**/*.ts", "**/*.tsx"], + "exclude": [ + "node_modules", + "build", + "public", + "coverage", + "src/**/*.test.{js,jsx,ts,tsx}", + "src/**/*.spec.{js,jsx,ts,tsx}", + "src/**/*.stories.{js,jsx,ts,tsx}" + ] +} diff --git a/packages/quanta/vitest.config.ts b/packages/quanta/vitest.config.ts new file mode 100644 index 0000000000..25d5f37515 --- /dev/null +++ b/packages/quanta/vitest.config.ts @@ -0,0 +1,10 @@ +import { defineConfig } from 'vitest/config'; + +export default defineConfig({ + test: { + globals: true, + environment: 'jsdom', + // setupFiles: './setupTesting.ts', + exclude: ['**/node_modules/**', '**/lib/**'], + }, +}); diff --git a/packages/registry/.eslintrc.cjs b/packages/registry/.eslintrc.cjs index f7665b4d37..c844f31a8d 100644 --- a/packages/registry/.eslintrc.cjs +++ b/packages/registry/.eslintrc.cjs @@ -65,6 +65,7 @@ module.exports = { { files: [ '.eslintrc.cjs', + 'next-plugin.js', 'src/addon-registry/**/*.{js,ts}', '__tests__/**/*.{js,ts}', ], diff --git a/packages/registry/next-plugin.d.ts b/packages/registry/next-plugin.d.ts new file mode 100644 index 0000000000..bac5a24de2 --- /dev/null +++ b/packages/registry/next-plugin.d.ts @@ -0,0 +1,11 @@ +import { type ConfigType } from '@plone/registry'; +import { type NextConfig } from 'next'; + +declare function withRegistry(config?: NextConfig): NextConfig; + +export { withRegistry }; + +declare module '@plone/registry/addons-loader' { + export default function applyAddonConfiguration(config: ConfigType): void; + export const addonsInfo: ConfigType['settings']['addonsInfo']; +} diff --git a/packages/registry/next-plugin.js b/packages/registry/next-plugin.js new file mode 100644 index 0000000000..8e43f58549 --- /dev/null +++ b/packages/registry/next-plugin.js @@ -0,0 +1,56 @@ +import path from 'path'; +import { AddonRegistry } from '@plone/registry/addon-registry'; +import { createAddonsLoader } from '@plone/registry/create-addons-loader'; +import { createThemeAddonsLoader } from '@plone/registry/create-theme-loader'; + +/** @type {(config: import('next').NextConfig) => import('next').NextConfig} */ +export function withRegistry(config) { + const projectRootPath = path.resolve('.'); + const { registry, shadowAliases } = AddonRegistry.init(projectRootPath); + + const addonsLoaderPath = createAddonsLoader( + registry.getAddonDependencies(), + registry.getAddons(), + ); + + const [addonsThemeLoaderVariablesPath, addonsThemeLoaderMainPath] = + createThemeAddonsLoader(registry.getCustomThemeAddons()); + + const addOns = Object.keys(registry.packages); + + config.transpilePackages = [...(config.transpilePackages || []), ...addOns]; + config.experimental = { + ...(config.experimental || {}), + optimizePackageImports: [ + ...(config.experimental?.optimizePackageImports || []), + 'react-aria-components', + '@plone/components', + ], + }; + + const { webpack: previousWebpackFn } = config; + + config.webpack = function (webpackConfig, context) { + let newWebpackConfig = webpackConfig; + if (previousWebpackFn) { + newWebpackConfig = previousWebpackFn(webpackConfig, context); + } + newWebpackConfig.resolve.alias = { + ...newWebpackConfig.resolve.alias, + ...shadowAliases, + // Remove in case that we have addons aliases (Volto add-ons which need the `src` path hack) + // ...addonAliases, + ...(registry.theme + ? // Load the theme aliases from the theme config + { + addonsThemeCustomizationsVariables: addonsThemeLoaderVariablesPath, + addonsThemeCustomizationsMain: addonsThemeLoaderMainPath, + } + : {}), + '@plone/registry/addons-loader': addonsLoaderPath, + }; + return newWebpackConfig; + }; + + return config; +} diff --git a/packages/registry/package.json b/packages/registry/package.json index ee487c8bf8..4e88900dd5 100644 --- a/packages/registry/package.json +++ b/packages/registry/package.json @@ -56,6 +56,10 @@ "import": "./vite-plugin.js", "types": "./vite-plugin.d.ts" }, + "./next-plugin": { + "import": "./next-plugin.js", + "types": "./next-plugin.d.ts" + }, ".": { "import": "./dist/index.js", "default": "./dist/index.cjs" @@ -98,6 +102,7 @@ "@types/react": "^18", "@types/react-dom": "^18", "@types/tmp": "^0.2.6", + "next": "14.2.14", "react": "^18.2.0", "react-dom": "^18.2.0", "release-it": "16.2.1", diff --git a/packages/registry/vite-plugin.js b/packages/registry/vite-plugin.js index acfe5a906a..4326b1a88f 100644 --- a/packages/registry/vite-plugin.js +++ b/packages/registry/vite-plugin.js @@ -53,7 +53,10 @@ export const PloneRegistryVitePlugin = () => { }, ] : []), - { find: 'load-plone-registry-addons', replacement: addonsLoaderPath }, + { + find: '@plone/registry/addons-loader', + replacement: addonsLoaderPath, + }, ], }, }), diff --git a/packages/slots/.eslintrc.cjs b/packages/slots/.eslintrc.cjs new file mode 100644 index 0000000000..b3a71fc44c --- /dev/null +++ b/packages/slots/.eslintrc.cjs @@ -0,0 +1,11 @@ +/** @type {import('eslint').Linter.Config} */ +module.exports = { + overrides: [ + { + files: ['**/*.ts', '**/*.tsx'], + extends: [ + 'plugin:react/jsx-runtime', // We only want this for non-library code (eg. volto add-ons) + ], + }, + ], +}; diff --git a/packages/slots/.storybook/Logo.svg b/packages/slots/.storybook/Logo.svg new file mode 100644 index 0000000000..5a7ba56902 --- /dev/null +++ b/packages/slots/.storybook/Logo.svg @@ -0,0 +1,21 @@ + + + + + + + + + + + + + + + + + + + + + diff --git a/packages/slots/.storybook/main.ts b/packages/slots/.storybook/main.ts new file mode 100644 index 0000000000..cf9f4ddec3 --- /dev/null +++ b/packages/slots/.storybook/main.ts @@ -0,0 +1,41 @@ +import type { StorybookConfig } from '@storybook/react-vite'; +import { mergeConfig } from 'vite'; + +const config: StorybookConfig = { + // For some reason the property does not allow negation + // https://github.com/storybookjs/storybook/issues/11181#issuecomment-1535288804 + stories: [ + '../components/**/*.mdx', + '../components/**/*.stories.@(js|jsx|ts|tsx)', + ], + addons: [ + '@storybook/addon-links', + '@storybook/addon-essentials', + '@storybook/addon-interactions', + ], + framework: { + name: '@storybook/react-vite', + options: {}, + }, + docs: { + autodocs: 'tag', + }, + typescript: { + reactDocgen: 'react-docgen-typescript', + reactDocgenTypescriptOptions: { + compilerOptions: { + allowSyntheticDefaultImports: false, + esModuleInterop: false, + }, + propFilter: () => true, + }, + }, + async viteFinal(config) { + return mergeConfig(config, { + build: { + minify: false, + }, + }); + }, +}; +export default config; diff --git a/packages/slots/.storybook/manager.js b/packages/slots/.storybook/manager.js new file mode 100644 index 0000000000..2e62084432 --- /dev/null +++ b/packages/slots/.storybook/manager.js @@ -0,0 +1,6 @@ +import { addons } from '@storybook/manager-api'; +import theme from './theme'; + +addons.setConfig({ + theme, +}); diff --git a/packages/slots/.storybook/preview-head.html b/packages/slots/.storybook/preview-head.html new file mode 100644 index 0000000000..05da1e9dfb --- /dev/null +++ b/packages/slots/.storybook/preview-head.html @@ -0,0 +1,3 @@ + \ No newline at end of file diff --git a/packages/slots/.storybook/preview.ts b/packages/slots/.storybook/preview.ts new file mode 100644 index 0000000000..362843c9bc --- /dev/null +++ b/packages/slots/.storybook/preview.ts @@ -0,0 +1,24 @@ +import './storybook-base.css'; +import '@plone/components/dist/basic.css'; +import '../main.css'; +import config from '@plone/registry'; +import installSlots from '../config'; +import installBlocks from '@plone/blocks'; + +config.set('slots', {}); +config.set('utilities', {}); +installSlots(config); +installBlocks(config); + +export const parameters = { + backgrounds: { + default: 'light', + }, + actions: { argTypesRegex: '^on[A-Z].*' }, + controls: { + matchers: { + color: /(background|color)$/i, + date: /Date$/, + }, + }, +}; diff --git a/packages/slots/.storybook/storybook-base.css b/packages/slots/.storybook/storybook-base.css new file mode 100644 index 0000000000..f55ba4bf27 --- /dev/null +++ b/packages/slots/.storybook/storybook-base.css @@ -0,0 +1,19 @@ +/* Base styles */ +:root { + --basic-font-family: system-ui; + --basic-font-size: 16px; + background: var(--background-color); + font-family: var(--basic-font-family); + font-size: var(--basic-font-size); + line-height: 1.5; +} + +.sbdocs.sbdocs-content { + p { + font-size: 16px; + } +} + +#storybook-root { + width: 100vw; +} diff --git a/packages/slots/.storybook/theme.ts b/packages/slots/.storybook/theme.ts new file mode 100644 index 0000000000..3262e1f700 --- /dev/null +++ b/packages/slots/.storybook/theme.ts @@ -0,0 +1,10 @@ +import { create } from '@storybook/theming/create'; +import logo from './Logo.svg'; + +export default create({ + base: 'light', + brandTitle: '@plone/components StoryBook', + brandUrl: 'https://plone-components.netlify.app/', + brandImage: logo, + brandTarget: '_self', +}); diff --git a/packages/slots/.stylelintrc b/packages/slots/.stylelintrc new file mode 100644 index 0000000000..8ac62f8d0f --- /dev/null +++ b/packages/slots/.stylelintrc @@ -0,0 +1,14 @@ +{ + "extends": ["stylelint-config-idiomatic-order"], + "plugins": ["stylelint-prettier"], + "overrides": [ + { + "files": ["**/*.scss"], + "customSyntax": "postcss-scss" + } + ], + "rules": { + "prettier/prettier": true, + "order/properties-alphabetical-order": null + } +} diff --git a/packages/slots/README.md b/packages/slots/README.md index c77e2bb2de..14e264f164 100644 --- a/packages/slots/README.md +++ b/packages/slots/README.md @@ -1,6 +1,6 @@ -# `@plone/blocks` +# `@plone/slots` -This package contains the default blocks provided by Plone. +This package contains the default slots provided by Plone. > [!WARNING] > This package or app is experimental. diff --git a/packages/slots/SlotRenderer.tsx b/packages/slots/SlotRenderer.tsx new file mode 100644 index 0000000000..df2501d721 --- /dev/null +++ b/packages/slots/SlotRenderer.tsx @@ -0,0 +1,58 @@ +import config from '@plone/registry'; +import type { GetSlotArgs } from '@plone/types'; + +export type SlotComponentProps = { + content: GetSlotArgs['content']; + location: GetSlotArgs['location']; + navRoot?: GetSlotArgs['navRoot']; +}; + +/* + * The SlotRenderer component is used to render the components registered for a + * given slot. + * + * Usage: + * + */ +const SlotRenderer = ({ + name, + content, + location, + navRoot, +}: { + name: string; + content: GetSlotArgs['content']; + location: GetSlotArgs['location']; + navRoot?: GetSlotArgs['navRoot']; +}) => { + let slots = config.getSlot(name, { + content, + location, + // This is to cover the use case while adding a new content and we don't have + // the navRoot information in the initial content. This will be + // useful for SlotRenderers rendered in the `Add` route. + navRoot: content?.['@components']?.navroot?.navroot || navRoot, + }); + + if (!slots) { + return null; + } + + return ( + <> + {slots.map(({ component, name }) => { + const SlotComponent = component; + return ( + + ); + })} + + ); +}; + +export default SlotRenderer; diff --git a/packages/slots/components/App.stories.tsx b/packages/slots/components/App.stories.tsx new file mode 100644 index 0000000000..c6afb4b0f6 --- /dev/null +++ b/packages/slots/components/App.stories.tsx @@ -0,0 +1,62 @@ +import App from './App'; + +import type { Meta, StoryObj } from '@storybook/react'; +import { storyData } from '../stories'; + +const meta = { + title: 'App', + component: App, + parameters: { + layout: 'centered', + }, +} satisfies Meta; + +export default meta; +type Story = StoryObj; + +export const Default: Story = { + render: (args: any) => , + args: { + content: { + '@id': 'http://localhost:3000/Plone', + title: 'Plone site', + description: 'Welcome to Plone', + items: [], + blocks: { + ...storyData.blocks, + }, + blocks_layout: { + ...storyData.blocks_layout, + }, + '@components': { + navigation: { + items: [ + { + '@id': 'http://localhost:3000/Plone', + title: 'Home', + }, + { + '@id': 'http://localhost:3000/Plone/news', + title: 'News', + }, + { + '@id': 'http://localhost:3000/Plone/about', + title: 'About', + }, + ], + }, + navroot: { + // @ts-expect-error This is a test object, missing all content properties + navroot: { + '@id': 'http://localhost:3000/Plone', + title: 'Plone site', + }, + }, + site: { + 'plone.site_title': 'Plone site', + // 'plone.site_logo': 'https://sneridagh.dev/', + }, + }, + }, + }, +}; diff --git a/packages/slots/components/App.tsx b/packages/slots/components/App.tsx new file mode 100644 index 0000000000..01de26c86e --- /dev/null +++ b/packages/slots/components/App.tsx @@ -0,0 +1,27 @@ +'use client'; + +import type { GetSlotArgs } from '@plone/types'; +import SlotRenderer from '../SlotRenderer'; + +type AppProps = { + content: GetSlotArgs['content']; + location: GetSlotArgs['location']; +}; + +const App = (props: AppProps) => { + const { content, location } = props; + + return ( +
    +
    + +
    + +
    + +
    +
    + ); +}; + +export default App; diff --git a/packages/slots/components/ContentArea.tsx b/packages/slots/components/ContentArea.tsx new file mode 100644 index 0000000000..b4cd5dfc4a --- /dev/null +++ b/packages/slots/components/ContentArea.tsx @@ -0,0 +1,19 @@ +import RenderBlocks from '@plone/blocks/RenderBlocks/RenderBlocks'; +import { SlotComponentProps } from '../SlotRenderer'; +import config from '@plone/registry'; + +const ContentArea = (props: SlotComponentProps) => { + const { content } = props; + + return ( + <> + + + ); +}; + +export default ContentArea; diff --git a/packages/slots/components/Footer.tsx b/packages/slots/components/Footer.tsx new file mode 100644 index 0000000000..626340a642 --- /dev/null +++ b/packages/slots/components/Footer.tsx @@ -0,0 +1,21 @@ +import type { GetSlotArgs } from '@plone/types'; +import SlotRenderer from '../SlotRenderer'; + +type FooterProps = { + content: GetSlotArgs['content']; + location: GetSlotArgs['location']; +}; + +const Footer = (props: FooterProps) => { + const { content, location } = props; + + return ( + <> + + + + + ); +}; + +export default Footer; diff --git a/packages/slots/components/Header.stories.tsx b/packages/slots/components/Header.stories.tsx new file mode 100644 index 0000000000..934ac2dbff --- /dev/null +++ b/packages/slots/components/Header.stories.tsx @@ -0,0 +1,56 @@ +import Header from './Header'; + +import type { Meta, StoryObj } from '@storybook/react'; + +const meta = { + title: 'Header', + component: Header, + parameters: { + layout: 'centered', + }, + tags: ['autodocs'], +} satisfies Meta; + +export default meta; +type Story = StoryObj; + +export const Default: Story = { + render: (args: any) =>
    , + args: { + content: { + '@id': 'http://localhost:3000/Plone', + title: 'Plone site', + description: 'Welcome to Plone', + items: [], + '@components': { + navigation: { + items: [ + { + '@id': 'http://localhost:3000/Plone', + title: 'Home', + }, + { + '@id': 'http://localhost:3000/Plone/news', + title: 'News', + }, + { + '@id': 'http://localhost:3000/Plone/about', + title: 'About', + }, + ], + }, + navroot: { + // @ts-expect-error This is a test object, missing all content properties + navroot: { + '@id': 'http://localhost:3000/Plone', + title: 'Plone site', + }, + }, + site: { + 'plone.site_title': 'Plone site', + // 'plone.site_logo': 'https://sneridagh.dev/', + }, + }, + }, + }, +}; diff --git a/packages/slots/components/Header.tsx b/packages/slots/components/Header.tsx new file mode 100644 index 0000000000..626b554f33 --- /dev/null +++ b/packages/slots/components/Header.tsx @@ -0,0 +1,30 @@ +'use client'; + +import type { GetSlotArgs } from '@plone/types'; +import SlotRenderer from '../SlotRenderer'; +import { Container } from '@plone/components'; + +type HeaderProps = { + content: GetSlotArgs['content']; + location: GetSlotArgs['location']; +}; + +const Header = (props: HeaderProps) => { + const { content, location } = props; + + return ( + + + +
    + +
    +
    + ); +}; + +export default Header; diff --git a/packages/slots/components/Logo.stories.tsx b/packages/slots/components/Logo.stories.tsx new file mode 100644 index 0000000000..8d338f2c40 --- /dev/null +++ b/packages/slots/components/Logo.stories.tsx @@ -0,0 +1,41 @@ +import React from 'react'; +import Logo from './Logo'; + +import type { Meta, StoryObj } from '@storybook/react'; + +const meta = { + title: 'Logo', + component: Logo, + parameters: { + layout: 'centered', + }, + tags: ['autodocs'], +} satisfies Meta; + +export default meta; +type Story = StoryObj; + +export const Default: Story = { + render: (args: any) => , + args: { + content: { + '@id': 'http://localhost:3000/Plone', + title: 'Plone site', + description: 'Welcome to Plone', + items: [], + '@components': { + navroot: { + // @ts-expect-error This is a test object, missing all content properties + navroot: { + '@id': 'http://localhost:3000/Plone', + title: 'Plone site', + }, + }, + site: { + 'plone.site_title': 'Plone site', + // 'plone.site_logo': 'https://sneridagh.dev/', + }, + }, + }, + }, +}; diff --git a/packages/slots/components/Logo.svg b/packages/slots/components/Logo.svg new file mode 100644 index 0000000000..5a7ba56902 --- /dev/null +++ b/packages/slots/components/Logo.svg @@ -0,0 +1,21 @@ + + + + + + + + + + + + + + + + + + + + + diff --git a/packages/slots/components/Logo.tsx b/packages/slots/components/Logo.tsx new file mode 100644 index 0000000000..f283825d37 --- /dev/null +++ b/packages/slots/components/Logo.tsx @@ -0,0 +1,29 @@ +'use client'; + +import { SlotComponentProps } from '../SlotRenderer'; +import { Link } from '@plone/components'; +import LogoImage from './Logo.svg'; +import config from '@plone/registry'; +import { messages } from './messages'; + +const Logo = (props: SlotComponentProps) => { + const { content } = props; + const intl: (id: string) => string = config.getUtility({ + name: 'translation', + type: 'factory', + }).method; + const navRootPath = content['@components'].navroot?.navroot?.['@id'] || '/'; + const site = content['@components'].site; + const siteTitle = site?.['plone.site_title'] || ''; + const logoUrl = site?.['plone.site_logo'] + ? site['plone.site_logo'] + : LogoImage; + + return ( + + {intl(messages.logoOf) + + ); +}; + +export default Logo; diff --git a/packages/slots/components/Main.tsx b/packages/slots/components/Main.tsx new file mode 100644 index 0000000000..b9cbcba009 --- /dev/null +++ b/packages/slots/components/Main.tsx @@ -0,0 +1,24 @@ +'use client'; + +import type { GetSlotArgs } from '@plone/types'; +import SlotRenderer from '../SlotRenderer'; +import { Container } from '@plone/components'; + +type MainProps = { + content: GetSlotArgs['content']; + location: GetSlotArgs['location']; +}; + +const Main = (props: MainProps) => { + const { content, location } = props; + + return ( + + + + + + ); +}; + +export default Main; diff --git a/packages/slots/components/MainFooter.tsx b/packages/slots/components/MainFooter.tsx new file mode 100644 index 0000000000..dde570a81b --- /dev/null +++ b/packages/slots/components/MainFooter.tsx @@ -0,0 +1,40 @@ +'use client'; + +import { SlotComponentProps } from '../SlotRenderer'; +import { Container, Link } from '@plone/components'; +import Logo from './Logo'; + +const Footer = (props: SlotComponentProps) => { + const { content, location } = props; + const siteActions = content?.['@components']?.actions?.site_actions || []; + + return ( + + {/* TODO: i18n properly */} +
    + The Plone® Open Source CMS/WCM is © 2000-2024 by the Plone Foundation + and friends.
    + Distributed under the GNU GPL license. +
    +
      + {siteActions?.length + ? siteActions.map((item) => ( +
    • + + {item?.title} + +
    • + )) + : null} +
    + + + +
    + Powered by Plone & Python + + + ); +}; + +export default Footer; diff --git a/packages/slots/components/Navigation.stories.tsx b/packages/slots/components/Navigation.stories.tsx new file mode 100644 index 0000000000..3aee92ac77 --- /dev/null +++ b/packages/slots/components/Navigation.stories.tsx @@ -0,0 +1,46 @@ +import React from 'react'; +import Navigation from './Navigation'; + +import type { Meta, StoryObj } from '@storybook/react'; + +const meta = { + title: 'Navigation', + component: Navigation, + parameters: { + layout: 'centered', + }, + tags: ['autodocs'], +} satisfies Meta; + +export default meta; +type Story = StoryObj; + +export const Default: Story = { + render: (args: any) => , + args: { + content: { + '@id': 'http://localhost:3000/Plone', + title: 'Plone site', + description: 'Welcome to Plone', + items: [], + '@components': { + navigation: { + items: [ + { + '@id': 'http://localhost:3000/Plone', + title: 'Plone site', + }, + { + '@id': 'http://localhost:3000/Plone/news', + title: 'News', + }, + { + '@id': 'http://localhost:3000/Plone/about', + title: 'About', + }, + ], + }, + }, + }, + }, +}; diff --git a/packages/slots/components/Navigation.tsx b/packages/slots/components/Navigation.tsx new file mode 100644 index 0000000000..61c9c59652 --- /dev/null +++ b/packages/slots/components/Navigation.tsx @@ -0,0 +1,28 @@ +'use client'; + +import type { SlotComponentProps } from '../SlotRenderer'; +import { Link } from '@plone/components'; + +type NavItem = { + '@id': string; + title: string; +}; + +const Navigation = (props: SlotComponentProps) => { + const { content } = props; + const navItems = content['@components'].navigation?.items || []; + + return ( + + ); +}; + +export default Navigation; diff --git a/packages/slots/components/Tools.tsx b/packages/slots/components/Tools.tsx new file mode 100644 index 0000000000..6718f028e1 --- /dev/null +++ b/packages/slots/components/Tools.tsx @@ -0,0 +1,6 @@ +const HeaderTools = (props) => { + const { content, location } = props; + return 'The tools'; +}; + +export default HeaderTools; diff --git a/packages/slots/components/messages.ts b/packages/slots/components/messages.ts new file mode 100644 index 0000000000..2e2e95fd7d --- /dev/null +++ b/packages/slots/components/messages.ts @@ -0,0 +1,5 @@ +export const messages = { + home: 'Home', + siteLogo: 'Site logo', + logoOf: 'Logo of', +}; diff --git a/packages/slots/index.ts b/packages/slots/index.ts new file mode 100644 index 0000000000..885e8d2778 --- /dev/null +++ b/packages/slots/index.ts @@ -0,0 +1,78 @@ +import type { ConfigType } from '@plone/registry'; +import App from './components/App'; +import Header from './components/Header'; +import Main from './components/Main'; +import Footer from './components/Footer'; +import Logo from './components/Logo'; +import Navigation from './components/Navigation'; +import HeaderTools from './components/Tools'; +import ContentArea from './components/ContentArea'; +import MainFooter from './components/MainFooter'; + +export default function install(config: ConfigType) { + // Translation factory + config.registerUtility({ + name: 'translation', + type: 'factory', + method: (id: string) => id, + }); + + // Main App Slot + config.registerSlotComponent({ name: 'App', slot: 'App', component: App }); + + // Header Slot + config.registerSlotComponent({ + name: 'Header', + slot: 'header', + component: Header, + }); + + // Logo + config.registerSlotComponent({ + name: 'Logo', + slot: 'logo', + component: Logo, + }); + + // Navigation + config.registerSlotComponent({ + name: 'Navigation', + slot: 'navigation', + component: Navigation, + }); + + // Tools + config.registerSlotComponent({ + name: 'Tools', + slot: 'headertools', + component: HeaderTools, + }); + + // Main Slot + config.registerSlotComponent({ + name: 'Main', + slot: 'main', + component: Main, + }); + + config.registerSlotComponent({ + name: 'contentArea', + slot: 'contentArea', + component: ContentArea, + }); + + // Footer Slot + config.registerSlotComponent({ + name: 'Footer', + slot: 'footer', + component: Footer, + }); + + config.registerSlotComponent({ + name: 'mainFooter', + slot: 'mainFooter', + component: MainFooter, + }); + + return config; +} diff --git a/packages/slots/main.css b/packages/slots/main.css new file mode 100644 index 0000000000..32062cf557 --- /dev/null +++ b/packages/slots/main.css @@ -0,0 +1,100 @@ +:root { + /* These should come from @plone/components by default */ + --layout-container-width: 1440px; + --default-container-width: 940px; + --narrow-container-width: 620px; + + --align-right: end; + --align-left: start; + --align-center: center; +} + +body { + /* This needs a proper reset */ + margin: 0; +} + +.app-slot { + display: grid; + height: 100vh; + margin: 0; + grid-template-areas: + 'header' + 'content' + 'footer'; + grid-template-columns: 1fr; + grid-template-rows: auto 1fr auto; +} + +.header-logo-nav-tools-wrapper { + display: flex; + flex-direction: row; + align-items: baseline; + justify-content: space-between; + padding-top: 25px; + padding-bottom: 35px; +} + +.logo { + flex: 1 1 0; + align-self: center; +} + +.navigation { + display: flex; + flex: 3.5 1 0; + align-self: center; + justify-content: center; + + ul { + display: flex; + padding: 0; + margin: 0; + list-style: none; + + li a { + padding: 1rem 0; + margin-left: 1rem; + } + + li:first-child a { + margin-left: 0; + } + } +} + +.header-tools { + display: flex; + flex: 1 1 0; + flex-direction: row-reverse; +} + +main { + grid-area: 'content'; +} + +.content-area > * { + max-width: var(--default-container-width); + margin-right: auto; + margin-left: auto; +} + +figure img { + width: 100%; +} + +footer { + margin-top: 100px; +} + +.footer { + display: flex; + flex-direction: column; + padding: 2rem 0; + text-align: center; + + .logo { + margin: 20px 0; + place-self: center; + } +} diff --git a/packages/slots/package.json b/packages/slots/package.json index 9766de2823..e6a8658cc0 100644 --- a/packages/slots/package.json +++ b/packages/slots/package.json @@ -28,13 +28,15 @@ "publishConfig": { "access": "public" }, - "main": "src/index.ts", + "main": "index.ts", "scripts": { "test": "vitest", "dry-release": "release-it --dry-run", "release": "release-it", "release-major-alpha": "release-it major --preRelease=alpha", - "release-alpha": "release-it --preRelease=alpha" + "release-alpha": "release-it --preRelease=alpha", + "storybook": "storybook dev -p 6006", + "build-storybook": "storybook build" }, "peerDependencies": { "react": "^16.8.0 || ^17.0.0 || ^18.0.0", @@ -46,16 +48,33 @@ } }, "dependencies": { - "@plone/providers": "workspace:*", - "@plone/registry": "workspace:*" + "@plone/blocks": "workspace:*", + "@plone/client": "workspace:*", + "@plone/components": "workspace:*", + "@plone/registry": "workspace:*", + "react-aria-components": "^1.4.0" }, "devDependencies": { "@plone/types": "workspace:*", + "@storybook/addon-essentials": "^8.0.4", + "@storybook/addon-interactions": "^8.0.4", + "@storybook/addon-links": "^8.0.4", + "@storybook/addon-mdx-gfm": "^8.0.4", + "@storybook/blocks": "^8.0.4", + "@storybook/manager-api": "^8.0.4", + "@storybook/react": "^8.0.4", + "@storybook/react-vite": "^8.0.4", + "@storybook/theming": "^8.0.4", "@types/react": "^18", "@types/react-dom": "^18", + "eslint-plugin-storybook": "^0.8.0", + "jest-axe": "^8.0.0", "release-it": "17.1.1", + "storybook": "^8.0.4", "tsconfig": "workspace:*", "typescript": "^5.6.3", - "vitest": "^2.1.3" + "vite": "^5.4.8", + "vitest": "^2.1.3", + "vitest-axe": "^0.1.0" } } diff --git a/packages/slots/setupTesting.ts b/packages/slots/setupTesting.ts new file mode 100644 index 0000000000..8bc87fa36e --- /dev/null +++ b/packages/slots/setupTesting.ts @@ -0,0 +1,3 @@ +import '@testing-library/jest-dom'; +import { toHaveNoViolations } from 'jest-axe'; +expect.extend(toHaveNoViolations); diff --git a/packages/slots/src/SlotRenderer.tsx b/packages/slots/src/SlotRenderer.tsx index a2567dee6f..390d8a5c12 100644 --- a/packages/slots/src/SlotRenderer.tsx +++ b/packages/slots/src/SlotRenderer.tsx @@ -1,8 +1,7 @@ import React from 'react'; -import { useRouterLocation } from '@plone/providers'; import config from '@plone/registry'; -import type { Content } from '@plone/types'; +import type { GetSlotArgs } from '@plone/types'; /* Usage: @@ -12,17 +11,17 @@ Usage: const SlotRenderer = ({ name, content, + location, navRoot, }: { name: string; - content: Content; - navRoot?: Content; + content: GetSlotArgs['content']; + location: GetSlotArgs['location']; + navRoot?: GetSlotArgs['navRoot']; }) => { - const pathname = useRouterLocation().pathname; - - let slots = config.getSlot(name, { + const slots = config.getSlot(name, { content, - pathname, + location, // This is to cover the use case while adding a new content and we don't have // have the navRoot information in the initial content. This will be // useful for SlotRenderers rendered in the `Add` route. @@ -49,7 +48,7 @@ const SlotRenderer = ({ ); diff --git a/packages/slots/src/helpers.ts b/packages/slots/src/helpers.ts new file mode 100644 index 0000000000..c0130d25ac --- /dev/null +++ b/packages/slots/src/helpers.ts @@ -0,0 +1,12 @@ +import { type Content } from '@plone/types'; + +export function ContentTypeCondition(contentType: string[]) { + return ({ content, location }: { content: Content; location: Location }) => { + return ( + contentType.includes(content?.['@type']) || + contentType.some((type) => { + return location.search.includes(`type=${encodeURIComponent(type)}`); + }) + ); + }; +} diff --git a/packages/slots/stories.ts b/packages/slots/stories.ts new file mode 100644 index 0000000000..6a668df163 --- /dev/null +++ b/packages/slots/stories.ts @@ -0,0 +1,22 @@ +export const storyData = { + blocks: { + '7ab29abe-b38c-406b-94d7-b270e544a998': { + '@type': 'slate', + value: [ + { + type: 'p', + children: [ + { + text: 'Lorem ipsum dolor sit amet eu tempus ornare elit. Curabitur egestas quisque molestie pellentesque nunc imperdiet posuere morbi nunc eleifend. Volutpat enim augue blandit aliquam interdum pulvinar eu mattis congue. Eleifend mauris ut fermentum egestas mi faucibus adipiscing arcu nibh scelerisque justo habitasse. Mi consectetur hac maecenas leo dictumst vitae phasellus quam praesent vivamus nullam imperdiet integer mauris.', + }, + ], + }, + ], + plaintext: + 'Lorem ipsum dolor sit amet eu tempus ornare elit. Curabitur egestas quisque molestie pellentesque nunc imperdiet posuere morbi nunc eleifend. Volutpat enim augue blandit aliquam interdum pulvinar eu mattis congue. Eleifend mauris ut fermentum egestas mi faucibus adipiscing arcu nibh scelerisque justo habitasse. Mi consectetur hac maecenas leo dictumst vitae phasellus quam praesent vivamus nullam imperdiet integer mauris.', + }, + }, + blocks_layout: { + items: ['7ab29abe-b38c-406b-94d7-b270e544a998'], + }, +}; diff --git a/packages/slots/tsconfig.json b/packages/slots/tsconfig.json index 27e48db56e..2965402840 100644 --- a/packages/slots/tsconfig.json +++ b/packages/slots/tsconfig.json @@ -1,6 +1,6 @@ { "extends": "tsconfig/react-library.json", - "include": ["src", "src/**/*.js", "../providers/src/RouterLocation.tsx"], + "include": ["**/*.ts", "**/*.tsx"], "exclude": [ "node_modules", "build", diff --git a/packages/slots/vitest.config.ts b/packages/slots/vitest.config.ts new file mode 100644 index 0000000000..fddf5f61f7 --- /dev/null +++ b/packages/slots/vitest.config.ts @@ -0,0 +1,14 @@ +import { defineConfig } from 'vitest/config'; + +// https://vitejs.dev/config/ +export default defineConfig({ + test: { + globals: true, + environment: 'jsdom', + setupFiles: './setupTesting.ts', + // you might want to disable it, if you don't have tests that rely on CSS + // since parsing CSS is slow + css: true, + exclude: ['**/node_modules/**', '**/lib/**'], + }, +}); diff --git a/packages/theming/.stylelintrc b/packages/theming/.stylelintrc new file mode 100644 index 0000000000..8ac62f8d0f --- /dev/null +++ b/packages/theming/.stylelintrc @@ -0,0 +1,14 @@ +{ + "extends": ["stylelint-config-idiomatic-order"], + "plugins": ["stylelint-prettier"], + "overrides": [ + { + "files": ["**/*.scss"], + "customSyntax": "postcss-scss" + } + ], + "rules": { + "prettier/prettier": true, + "order/properties-alphabetical-order": null + } +} diff --git a/packages/theming/index.ts b/packages/theming/index.ts new file mode 100644 index 0000000000..7258290153 --- /dev/null +++ b/packages/theming/index.ts @@ -0,0 +1,5 @@ +import type { ConfigType } from '@plone/registry'; + +export default function install(config: ConfigType) { + return config; +} diff --git a/packages/theming/package.json b/packages/theming/package.json new file mode 100644 index 0000000000..98449fb250 --- /dev/null +++ b/packages/theming/package.json @@ -0,0 +1,79 @@ +{ + "name": "@plone/theming", + "description": "Plone base theming", + "maintainers": [ + { + "name": "Plone Foundation", + "url": "https://plone.org" + } + ], + "funding": "https://github.com/sponsors/plone", + "license": "MIT", + "version": "1.0.0", + "repository": { + "type": "git", + "url": "https://github.com/plone/volto.git" + }, + "bugs": { + "url": "https://github.com/plone/volto/issues" + }, + "homepage": "https://plone.org", + "keywords": [ + "volto", + "plone", + "plone6", + "react", + "helpers" + ], + "publishConfig": { + "access": "public" + }, + "main": "index.ts", + "scripts": { + "test": "vitest", + "dry-release": "release-it --dry-run", + "release": "release-it", + "release-major-alpha": "release-it major --preRelease=alpha", + "release-alpha": "release-it --preRelease=alpha", + "storybook": "storybook dev -p 6006", + "build-storybook": "storybook build" + }, + "peerDependencies": { + "react": "^16.8.0 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0" + }, + "peerDependenciesMeta": { + "react-dom": { + "optional": true + } + }, + "dependencies": { + "@plone/components": "workspace:*", + "@plone/registry": "workspace:*", + "lightningcss": "1.28.1", + "lightningcss-cli": "1.28.1" + }, + "devDependencies": { + "@plone/types": "workspace:*", + "@storybook/addon-essentials": "^8.0.4", + "@storybook/addon-interactions": "^8.0.4", + "@storybook/addon-links": "^8.0.4", + "@storybook/addon-mdx-gfm": "^8.0.4", + "@storybook/blocks": "^8.0.4", + "@storybook/manager-api": "^8.0.4", + "@storybook/react": "^8.0.4", + "@storybook/react-vite": "^8.0.4", + "@storybook/theming": "^8.0.4", + "@types/react": "^18", + "@types/react-dom": "^18", + "eslint-plugin-storybook": "^0.8.0", + "jest-axe": "^8.0.0", + "release-it": "17.1.1", + "storybook": "^8.0.4", + "tsconfig": "workspace:*", + "typescript": "^5.6.3", + "vite": "^5.4.8", + "vitest": "^2.1.3", + "vitest-axe": "^0.1.0" + } +} diff --git a/packages/theming/styles/base.css b/packages/theming/styles/base.css new file mode 100644 index 0000000000..66bee507e3 --- /dev/null +++ b/packages/theming/styles/base.css @@ -0,0 +1,8 @@ +body { + font-family: var(--basic-font-family, system-ui); + font-size: var(--basic-font-size, 16px); +} + +figure { + margin: 0; +} diff --git a/packages/theming/styles/layout.css b/packages/theming/styles/layout.css new file mode 100644 index 0000000000..630985a3f3 --- /dev/null +++ b/packages/theming/styles/layout.css @@ -0,0 +1,3 @@ +/* body { + background-color: red; +} */ diff --git a/packages/theming/styles/main.css b/packages/theming/styles/main.css new file mode 100644 index 0000000000..c3db9e90b1 --- /dev/null +++ b/packages/theming/styles/main.css @@ -0,0 +1,5 @@ +@layer reset, plone-components, layout, addons, theme; +@import 'reset.css'; +@import 'base.css'; +@import '@plone/components/dist/basic.css'; +@import 'layout.css'; diff --git a/packages/theming/styles/reset.css b/packages/theming/styles/reset.css new file mode 100644 index 0000000000..31cdac9449 --- /dev/null +++ b/packages/theming/styles/reset.css @@ -0,0 +1,224 @@ +/* Borrowed from https://www.miriamsuzanne.com */ +@layer reset { + /* @docs + label: Core Remedies + version: 0.1.0-beta.2 + + note: | + These remedies are recommended + as a starter for any project. + + category: file + */ + /* @docs + label: Box Sizing + + note: | + Use border-box by default, globally. + + category: global + */ + *, + ::before, + ::after { + box-sizing: border-box; + } + /* @docs + label: Line Sizing + + note: | + Consistent line-spacing, + even when inline elements have different line-heights. + + links: + - https://drafts.csswg.org/css-inline-3/#line-sizing-property + + category: global + */ + html { + line-sizing: normal; + } + /* @docs + label: Body Margins + + note: | + Remove the tiny space around the edge of the page. + + category: global + */ + body { + margin: 0; + } + /* @docs + label: Heading Sizes + + note: | + Switch to rem units for headings + + category: typography + */ + h1 { + font-size: 2rem; + } + h2 { + font-size: 1.5rem; + } + h3 { + font-size: 1.17rem; + } + h4 { + font-size: 1rem; + } + h5 { + font-size: 0.83rem; + } + h6 { + font-size: 0.67rem; + } + /* @docs + label: H1 Margins + + note: | + Keep h1 margins consistent, even when nested. + + category: typography + */ + h1 { + margin: 0.67em 0; + } + /* @docs + label: Pre Wrapping + + note: | + Overflow by default is bad... + + category: typography + */ + pre { + white-space: pre-wrap; + } + /* @docs + label: Horizontal Rule + + note: | + 1. Solid, thin horizontal rules + 2. Remove Firefox `color: gray` + 3. Remove default `1px` height, and common `overflow: hidden` + + category: typography + */ + hr { + overflow: visible; + height: 0; + border-width: 1px 0 0; + border-style: solid; + color: inherit; + } + /* @docs + label: Responsive Embeds + + note: | + 1. Block display is usually what we want + 2. Remove strange space-below when inline + 3. Responsive by default + + category: embedded elements + */ + img, + svg, + video, + canvas, + audio, + iframe, + embed, + object { + display: block; + max-width: 100%; + vertical-align: middle; + } + /* @docs + label: Aspect Ratios + + note: | + Maintain intrinsic aspect ratios when `max-width` is applied. + `iframe`, `embed`, and `object` are also embedded, + but have no intrinsic ratio, + so their `height` needs to be set explicitly. + + category: embedded elements + */ + img, + svg, + video, + canvas { + height: auto; + } + /* @docs + label: Audio Width + + note: | + There is no good reason elements default to 300px, + and audio files are unlikely to come with a width attribute. + + category: embedded elements + */ + audio { + width: 100%; + } + /* @docs + label: Image Borders + + note: | + Remove the border on images inside links in IE 10 and earlier. + + category: legacy browsers + */ + img { + border-style: none; + } + /* @docs + label: SVG Overflow + + note: | + Hide the overflow in IE 10 and earlier. + + category: legacy browsers + */ + svg { + overflow: hidden; + } + /* @docs + label: HTML5 Elements + + note: | + Default block display on HTML5 elements + + category: legacy browsers + */ + article, + aside, + figcaption, + figure, + footer, + header, + hgroup, + main, + nav, + section { + display: block; + } + /* @docs + label: Checkbox & Radio Inputs + + note: | + 1. Add the correct box sizing in IE 10 + 2. Remove the padding in IE 10 + + category: legacy browsers + */ + [type='checkbox'], + [type='radio'] { + box-sizing: border-box; + padding: 0; + } +} diff --git a/packages/theming/tsconfig.json b/packages/theming/tsconfig.json new file mode 100644 index 0000000000..4df9070106 --- /dev/null +++ b/packages/theming/tsconfig.json @@ -0,0 +1,36 @@ +{ + "compilerOptions": { + "esModuleInterop": true, + "skipLibCheck": true, + "target": "es2022", + "allowJs": true, + "resolveJsonModule": true, + "moduleDetection": "force", + "isolatedModules": true, + "verbatimModuleSyntax": true, + + "strict": true, + "noImplicitOverride": true, + + "lib": ["es2022", "dom", "dom.iterable"], + "module": "preserve", + "noEmit": true, + + "jsx": "react-jsx", + + "allowSyntheticDefaultImports": true, + "forceConsistentCasingInFileNames": true, + + "paths": {} + }, + "include": ["src/index.ts"], + "exclude": [ + "node_modules", + "build", + "public", + "coverage", + "src/**/*.test.{js,jsx,ts,tsx}", + "src/**/*.spec.{js,jsx,ts,tsx}", + "src/**/*.stories.{js,jsx,ts,tsx}" + ] +} diff --git a/packages/types/src/config/Blocks.d.ts b/packages/types/src/config/Blocks.d.ts index 70bf61c5cf..ae5f50fc83 100644 --- a/packages/types/src/config/Blocks.d.ts +++ b/packages/types/src/config/Blocks.d.ts @@ -51,6 +51,10 @@ export interface BlockConfigBase { * The group of the block */ group: string; + /** + * The category of the block + */ + category: string; /** * The view mode component */ diff --git a/packages/types/src/config/Views.d.ts b/packages/types/src/config/Views.d.ts index db7e9a5ac1..5e2831d0d4 100644 --- a/packages/types/src/config/Views.d.ts +++ b/packages/types/src/config/Views.d.ts @@ -1,13 +1,19 @@ +import { Content } from '../content'; + +export interface ViewProps { + content: Content; +} + export interface ViewsConfig { layoutViews: { - [key: string]: React.ComponentType; + [key: string]: React.ComponentType; }; contentTypesViews: { - [key: string]: React.ComponentType; + [key: string]: React.ComponentType; }; - defaultView: React.ComponentType; + defaultView: React.ComponentType; errorViews: { - [key: string]: React.ComponentType; + [key: string]: React.ComponentType; }; layoutViewsNamesMapping: { [key: string]: string; diff --git a/packages/volto-slate/src/editor/less/editor.less b/packages/volto-slate/src/editor/less/editor.less index e6006e3c19..9fb0538eef 100644 --- a/packages/volto-slate/src/editor/less/editor.less +++ b/packages/volto-slate/src/editor/less/editor.less @@ -27,9 +27,9 @@ } .link-form-container { - margin-left: 2px; display: flex; align-items: center; + margin-left: 2px; } } @@ -44,6 +44,7 @@ .slate-toolbar { display: flex; + min-width: 300px; // needed for image widget slate toolbar box-sizing: border-box; padding: 3px; border: none; @@ -53,7 +54,6 @@ font-family: 'Poppins', 'Helvetica Neue', Arial, Helvetica, sans-serif; font-size: 1rem; font-weight: normal; - min-width: 300px; // needed for image widget slate toolbar .expando { flex-grow: 1; diff --git a/packages/volto/src/components/theme/SlotRenderer/SlotRenderer.tsx b/packages/volto/src/components/theme/SlotRenderer/SlotRenderer.tsx index ea4c804f38..c4129b582b 100644 --- a/packages/volto/src/components/theme/SlotRenderer/SlotRenderer.tsx +++ b/packages/volto/src/components/theme/SlotRenderer/SlotRenderer.tsx @@ -4,7 +4,7 @@ import type { Content } from '@plone/types'; /* Usage: - + */ const SlotRenderer = ({ diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index cb14ba6eb6..69f634d5f1 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -34,7 +34,7 @@ importers: version: 5.6.3 vitest: specifier: ^2.1.3 - version: 2.1.3(@types/node@20.12.7)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + version: 2.1.3(@types/node@22.7.4)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) apps/nextjs: dependencies: @@ -47,15 +47,27 @@ importers: '@plone/components': specifier: 'workspace: *' version: link:../../packages/components + '@plone/nextjs': + specifier: 'workspace: *' + version: link:../../packages/nextjs '@plone/providers': specifier: 'workspace: *' version: link:../../packages/providers + '@plone/quanta': + specifier: workspace:^ + version: link:../../packages/quanta '@plone/registry': specifier: 'workspace: *' version: link:../../packages/registry + '@plone/slots': + specifier: 'workspace: *' + version: link:../../packages/slots '@tanstack/react-query': specifier: ^5.59.0 version: 5.59.15(react@18.2.0) + clsx: + specifier: ^2.1.1 + version: 2.1.1 next: specifier: 14.2.14 version: 14.2.14(react-dom@18.2.0(react@18.2.0))(react@18.2.0)(sass@1.75.0) @@ -77,19 +89,19 @@ importers: version: 5.59.15(@tanstack/react-query@5.59.15(react@18.2.0))(react@18.2.0) '@types/node': specifier: ^20 - version: 20.12.7 + version: 20.16.10 '@types/react': specifier: ^18 - version: 18.2.79 + version: 18.3.12 '@types/react-dom': specifier: ^18 - version: 18.2.25 + version: 18.3.0 eslint: specifier: ^8 - version: 8.57.0 + version: 8.57.1 eslint-config-next: specifier: 14.2.14 - version: 14.2.14(eslint@8.57.0)(typescript@5.6.3) + version: 14.2.14(eslint@8.57.1)(typescript@5.6.3) typescript: specifier: ^5.6.3 version: 5.6.3 @@ -138,7 +150,7 @@ importers: devDependencies: '@remix-run/dev': specifier: ^2.13.1 - version: 2.13.1(@remix-run/react@2.13.1(react-dom@18.2.0(react@18.2.0))(react@18.2.0)(typescript@5.6.3))(@remix-run/serve@2.13.1(typescript@5.6.3))(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)(typescript@5.6.3)(vite@5.4.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)) + version: 2.13.1(@remix-run/react@2.13.1(react-dom@18.2.0(react@18.2.0))(react@18.2.0)(typescript@5.6.3))(@remix-run/serve@2.13.1(typescript@5.6.3))(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3)(typescript@5.6.3)(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3)) '@tanstack/react-query-devtools': specifier: ^5.59.0 version: 5.59.15(@tanstack/react-query@5.59.15(react@18.2.0))(react@18.2.0) @@ -153,10 +165,10 @@ importers: version: 5.6.3 vite: specifier: ^5.4.9 - version: 5.4.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + version: 5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) vite-tsconfig-paths: specifier: ^4.2.1 - version: 4.3.2(typescript@5.6.3)(vite@5.4.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)) + version: 4.3.2(typescript@5.6.3)(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3)) apps/rr7: dependencies: @@ -202,7 +214,7 @@ importers: version: link:../../packages/registry '@react-router/dev': specifier: 7.0.0-pre.4 - version: 7.0.0-pre.4(@react-router/serve@7.0.0-pre.4(react-router@7.0.0-pre.4(react-dom@18.2.0(react@18.2.0))(react@18.2.0))(typescript@5.6.3))(@types/node@20.12.7)(babel-plugin-macros@3.1.0)(less@3.11.1)(lightningcss@1.24.1)(react-router@7.0.0-pre.4(react-dom@18.2.0(react@18.2.0))(react@18.2.0))(sass@1.75.0)(terser@5.30.3)(typescript@5.6.3)(vite@5.4.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)) + version: 7.0.0-pre.4(@react-router/serve@7.0.0-pre.4(react-router@7.0.0-pre.4(react-dom@18.2.0(react@18.2.0))(react@18.2.0))(typescript@5.6.3))(@types/node@22.7.4)(babel-plugin-macros@3.1.0)(less@3.11.1)(lightningcss@1.28.1)(react-router@7.0.0-pre.4(react-dom@18.2.0(react@18.2.0))(react@18.2.0))(sass@1.75.0)(terser@5.30.3)(typescript@5.6.3)(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3)) '@types/react': specifier: ^18.3.9 version: 18.3.12 @@ -214,10 +226,10 @@ importers: version: 5.6.3 vite: specifier: ^5.4.9 - version: 5.4.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + version: 5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) vite-tsconfig-paths: specifier: ^5.0.1 - version: 5.1.0(typescript@5.6.3)(vite@5.4.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)) + version: 5.1.0(typescript@5.6.3)(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3)) apps/vite: dependencies: @@ -263,7 +275,7 @@ importers: version: 5.37.1(@tanstack/react-query@5.37.1(react@18.2.0))(react@18.2.0) '@tanstack/router-plugin': specifier: ^1.66.1 - version: 1.69.1(vite@5.4.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3))(webpack-sources@3.2.3) + version: 1.69.1(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3))(webpack-sources@3.2.3) '@types/react': specifier: ^18.2.47 version: 18.2.79 @@ -272,10 +284,10 @@ importers: version: 18.2.25 '@vitejs/plugin-react': specifier: ^4.3.2 - version: 4.3.2(vite@5.4.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)) + version: 4.3.2(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3)) vite: specifier: ^5.4.9 - version: 5.4.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + version: 5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) apps/vite-ssr: dependencies: @@ -302,10 +314,10 @@ importers: version: 1.70.1(@tanstack/router-generator@1.69.1)(react-dom@18.2.0(react@18.2.0))(react@18.2.0) '@tanstack/router-vite-plugin': specifier: ^1.34.8 - version: 1.69.1(vite@5.2.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3))(webpack-sources@3.2.3) + version: 1.69.1(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3))(webpack-sources@3.2.3) '@tanstack/start': specifier: ^1.34.9 - version: 1.70.1(@types/node@20.12.7)(encoding@0.1.13)(ioredis@5.4.1)(less@3.11.1)(lightningcss@1.24.1)(magicast@0.3.4)(react-dom@18.2.0(react@18.2.0))(react@18.2.0)(sass@1.75.0)(terser@5.30.3)(vite@5.2.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3))(webpack-sources@3.2.3) + version: 1.70.1(@types/node@22.7.4)(encoding@0.1.13)(ioredis@5.4.1)(less@3.11.1)(lightningcss@1.28.1)(magicast@0.3.4)(react-dom@18.2.0(react@18.2.0))(react@18.2.0)(sass@1.75.0)(terser@5.30.3)(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3))(webpack-sources@3.2.3) axios: specifier: ^1.6.5 version: 1.6.8 @@ -354,7 +366,7 @@ importers: version: 18.2.25 '@vitejs/plugin-react': specifier: ^4 - version: 4.2.1(vite@5.2.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)) + version: 4.2.1(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3)) compression: specifier: ^1.7.4 version: 1.7.4 @@ -375,13 +387,25 @@ importers: version: 5.6.3 vite: specifier: ^5.2.9 - version: 5.2.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + version: 5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) vite-plugin-babel: specifier: ^1.2.0 - version: 1.2.0(@babel/core@7.24.4)(vite@5.2.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)) + version: 1.2.0(@babel/core@7.24.4)(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3)) packages/blocks: dependencies: + '@plone/components': + specifier: workspace:* + version: link:../components + '@plone/providers': + specifier: workspace:* + version: link:../providers + '@plone/registry': + specifier: workspace:* + version: link:../registry + clsx: + specifier: ^2.1.1 + version: 2.1.1 react: specifier: ^16.8.0 || ^17.0.0 || ^18.0.0 version: 18.2.0 @@ -389,9 +413,6 @@ importers: specifier: ^16.8.0 || ^17.0.0 || ^18.0.0 version: 18.2.0(react@18.2.0) devDependencies: - '@plone/registry': - specifier: workspace:* - version: link:../registry '@plone/types': specifier: workspace:* version: link:../types @@ -412,7 +433,7 @@ importers: version: 5.6.3 vitest: specifier: ^2.1.3 - version: 2.1.3(@types/node@20.12.7)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + version: 2.1.3(@types/node@22.7.4)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) packages/client: dependencies: @@ -458,10 +479,10 @@ importers: version: 9.0.8 '@vitejs/plugin-react': specifier: ^4.1.0 - version: 4.2.1(vite@5.4.8(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)) + version: 4.2.1(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3)) '@vitest/coverage-v8': specifier: ^1.3.1 - version: 1.5.0(vitest@2.1.3(@types/node@20.12.7)(jsdom@21.1.2)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)) + version: 1.5.0(vitest@2.1.3(@types/node@22.7.4)(jsdom@21.1.2)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3)) glob: specifier: 7.1.6 version: 7.1.6 @@ -479,7 +500,7 @@ importers: version: 17.1.1(typescript@5.6.3) tsup: specifier: ^8.3.5 - version: 8.3.5(@microsoft/api-extractor@7.43.0(@types/node@20.12.7))(@swc/core@1.4.16)(jiti@1.21.6)(postcss@8.4.47)(tsx@4.19.1)(typescript@5.6.3) + version: 8.3.5(@microsoft/api-extractor@7.43.0(@types/node@22.7.4))(@swc/core@1.4.16)(jiti@1.21.6)(postcss@8.4.47)(tsx@4.19.1)(typescript@5.6.3) typescript: specifier: ^5.6.3 version: 5.6.3 @@ -488,13 +509,13 @@ importers: version: 9.0.1 vite: specifier: ^5.4.8 - version: 5.4.8(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + version: 5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) vite-plugin-dts: specifier: ^3.7.3 - version: 3.8.3(@types/node@20.12.7)(rollup@4.24.0)(typescript@5.6.3)(vite@5.4.8(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)) + version: 3.8.3(@types/node@22.7.4)(rollup@4.24.0)(typescript@5.6.3)(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3)) vitest: specifier: ^2.1.3 - version: 2.1.3(@types/node@20.12.7)(jsdom@21.1.2)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + version: 2.1.3(@types/node@22.7.4)(jsdom@21.1.2)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) wait-on: specifier: ^7.2.0 version: 7.2.0(debug@4.3.4) @@ -509,7 +530,7 @@ importers: version: 3.12.0(react@18.2.0) '@storybook/test': specifier: ^8.0.4 - version: 8.0.8(@jest/globals@29.7.0)(@types/jest@29.5.12)(jest@29.7.0(@types/node@20.12.7))(vitest@2.1.3(@types/node@20.12.7)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)) + version: 8.0.8(@jest/globals@29.7.0)(@types/jest@29.5.12)(jest@29.7.0(@types/node@22.7.4))(vitest@2.1.3(@types/node@22.7.4)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)) clsx: specifier: ^2.1.1 version: 2.1.1 @@ -537,7 +558,7 @@ importers: version: 8.0.8(@types/react@18.2.79)(encoding@0.1.13)(react-dom@18.2.0(react@18.2.0))(react@18.2.0) '@storybook/addon-interactions': specifier: ^8.0.4 - version: 8.0.8(@jest/globals@29.7.0)(@types/jest@29.5.12)(jest@29.7.0(@types/node@20.12.7))(vitest@2.1.3(@types/node@20.12.7)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)) + version: 8.0.8(@jest/globals@29.7.0)(@types/jest@29.5.12)(jest@29.7.0(@types/node@22.7.4))(vitest@2.1.3(@types/node@22.7.4)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)) '@storybook/addon-links': specifier: ^8.0.4 version: 8.0.8(react@18.2.0) @@ -555,13 +576,13 @@ importers: version: 8.0.8(encoding@0.1.13)(react-dom@18.2.0(react@18.2.0))(react@18.2.0)(typescript@5.6.3) '@storybook/react-vite': specifier: ^8.0.4 - version: 8.0.8(@preact/preset-vite@2.8.2(@babel/core@7.25.8)(vite@5.4.8(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)))(encoding@0.1.13)(react-dom@18.2.0(react@18.2.0))(react@18.2.0)(rollup@4.24.0)(typescript@5.6.3)(vite@5.4.8(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)) + version: 8.0.8(@preact/preset-vite@2.8.2(@babel/core@7.25.8)(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)))(encoding@0.1.13)(react-dom@18.2.0(react@18.2.0))(react@18.2.0)(rollup@4.24.0)(typescript@5.6.3)(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)) '@storybook/theming': specifier: ^8.0.4 version: 8.0.8(react-dom@18.2.0(react@18.2.0))(react@18.2.0) '@testing-library/jest-dom': specifier: 6.4.2 - version: 6.4.2(@jest/globals@29.7.0)(@types/jest@29.5.12)(jest@29.7.0(@types/node@20.12.7))(vitest@2.1.3(@types/node@20.12.7)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)) + version: 6.4.2(@jest/globals@29.7.0)(@types/jest@29.5.12)(jest@29.7.0(@types/node@22.7.4))(vitest@2.1.3(@types/node@22.7.4)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)) '@testing-library/react': specifier: 14.2.1 version: 14.2.1(react-dom@18.2.0(react@18.2.0))(react@18.2.0) @@ -576,16 +597,16 @@ importers: version: 18.2.25 '@vitejs/plugin-react': specifier: ^4.1.0 - version: 4.2.1(vite@5.4.8(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)) + version: 4.2.1(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)) '@vitest/coverage-v8': specifier: ^1.3.1 - version: 1.5.0(vitest@2.1.3(@types/node@20.12.7)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)) + version: 1.5.0(vitest@2.1.3(@types/node@22.7.4)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)) browserslist: specifier: ^4.23.0 version: 4.23.0 eslint-plugin-storybook: specifier: ^0.8.0 - version: 0.8.0(eslint@8.57.0)(typescript@5.6.3) + version: 0.8.0(eslint@8.57.1)(typescript@5.6.3) jest-axe: specifier: ^8.0.0 version: 8.0.0 @@ -606,19 +627,19 @@ importers: version: 8.0.8(@babel/preset-env@7.24.4(@babel/core@7.25.8))(encoding@0.1.13)(react-dom@18.2.0(react@18.2.0))(react@18.2.0) tsup: specifier: ^8.3.5 - version: 8.3.5(@microsoft/api-extractor@7.43.0(@types/node@20.12.7))(@swc/core@1.4.16)(jiti@1.21.6)(postcss@8.4.47)(tsx@4.19.1)(typescript@5.6.3) + version: 8.3.5(@microsoft/api-extractor@7.43.0(@types/node@22.7.4))(@swc/core@1.4.16)(jiti@1.21.6)(postcss@8.4.47)(tsx@4.19.1)(typescript@5.6.3) typescript: specifier: ^5.6.3 version: 5.6.3 vite: specifier: ^5.4.8 - version: 5.4.8(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + version: 5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) vitest: specifier: ^2.1.3 - version: 2.1.3(@types/node@20.12.7)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + version: 2.1.3(@types/node@22.7.4)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) vitest-axe: specifier: ^0.1.0 - version: 0.1.0(vitest@2.1.3(@types/node@20.12.7)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)) + version: 0.1.0(vitest@2.1.3(@types/node@22.7.4)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)) packages/coresandbox: dependencies: @@ -744,13 +765,61 @@ importers: version: link:../tsconfig tsup: specifier: ^8.3.5 - version: 8.3.5(@microsoft/api-extractor@7.43.0(@types/node@20.12.7))(@swc/core@1.4.16)(jiti@1.21.6)(postcss@8.4.47)(tsx@4.19.1)(typescript@5.6.3) + version: 8.3.5(@microsoft/api-extractor@7.43.0(@types/node@22.7.4))(@swc/core@1.4.16)(jiti@1.21.6)(postcss@8.4.47)(tsx@4.19.1)(typescript@5.6.3) + typescript: + specifier: ^5.6.3 + version: 5.6.3 + vitest: + specifier: ^2.1.3 + version: 2.1.3(@types/node@22.7.4)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) + + packages/nextjs: + devDependencies: + '@arethetypeswrong/cli': + specifier: ^0.16.4 + version: 0.16.4 + '@plone/blocks': + specifier: workspace:* + version: link:../blocks + '@plone/registry': + specifier: workspace:* + version: link:../registry + '@plone/types': + specifier: workspace:* + version: link:../types + '@types/node': + specifier: ^20 + version: 20.16.10 + '@types/react': + specifier: ^18 + version: 18.3.12 + '@types/react-dom': + specifier: ^18 + version: 18.3.0 + next: + specifier: 14.2.14 + version: 14.2.14(react-dom@18.2.0(react@18.2.0))(react@18.2.0)(sass@1.75.0) + react: + specifier: ^18.2.0 + version: 18.2.0 + react-dom: + specifier: ^18.2.0 + version: 18.2.0(react@18.2.0) + release-it: + specifier: 16.2.1 + version: 16.2.1(encoding@0.1.13)(typescript@5.6.3) + tsconfig: + specifier: workspace:* + version: link:../tsconfig + tsup: + specifier: ^8.3.5 + version: 8.3.5(@microsoft/api-extractor@7.43.0(@types/node@20.16.10))(@swc/core@1.4.16)(jiti@1.21.6)(postcss@8.4.47)(tsx@4.19.1)(typescript@5.6.3) typescript: specifier: ^5.6.3 version: 5.6.3 vitest: specifier: ^2.1.3 - version: 2.1.3(@types/node@20.12.7)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + version: 2.1.3(@types/node@20.16.10)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) packages/providers: dependencies: @@ -796,13 +865,56 @@ importers: version: link:../tsconfig tsup: specifier: ^8.3.5 - version: 8.3.5(@microsoft/api-extractor@7.43.0(@types/node@20.12.7))(@swc/core@1.4.16)(jiti@1.21.6)(postcss@8.4.47)(tsx@4.19.1)(typescript@5.6.3) + version: 8.3.5(@microsoft/api-extractor@7.43.0(@types/node@22.7.4))(@swc/core@1.4.16)(jiti@1.21.6)(postcss@8.4.47)(tsx@4.19.1)(typescript@5.6.3) + typescript: + specifier: ^5.6.3 + version: 5.6.3 + vitest: + specifier: ^2.1.3 + version: 2.1.3(@types/node@22.7.4)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) + + packages/quanta: + dependencies: + '@plone/components': + specifier: workspace:^ + version: link:../components + '@plone/slots': + specifier: workspace:^ + version: link:../slots + devDependencies: + '@plone/registry': + specifier: workspace:^ + version: link:../registry + '@plone/types': + specifier: workspace:* + version: link:../types + '@types/node': + specifier: ^20 + version: 20.16.10 + '@types/react': + specifier: ^18 + version: 18.3.12 + '@types/react-dom': + specifier: ^18 + version: 18.3.1 + react: + specifier: ^18.2.0 + version: 18.2.0 + react-dom: + specifier: ^18.2.0 + version: 18.2.0(react@18.2.0) + release-it: + specifier: 16.2.1 + version: 16.2.1(encoding@0.1.13)(typescript@5.6.3) + tsconfig: + specifier: workspace:* + version: link:../tsconfig typescript: specifier: ^5.6.3 version: 5.6.3 vitest: specifier: ^2.1.3 - version: 2.1.3(@types/node@20.12.7)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + version: 2.1.3(@types/node@20.16.10)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) packages/registry: dependencies: @@ -839,7 +951,7 @@ importers: version: 8.1.0 '@types/node': specifier: ^20 - version: 20.12.7 + version: 20.16.10 '@types/react': specifier: ^18 version: 18.2.79 @@ -849,6 +961,9 @@ importers: '@types/tmp': specifier: ^0.2.6 version: 0.2.6 + next: + specifier: 14.2.14 + version: 14.2.14(react-dom@18.2.0(react@18.2.0))(react@18.2.0)(sass@1.75.0) react: specifier: ^18.2.0 version: 18.2.0 @@ -863,16 +978,16 @@ importers: version: link:../tsconfig tsup: specifier: ^8.3.5 - version: 8.3.5(@microsoft/api-extractor@7.43.0(@types/node@20.12.7))(@swc/core@1.4.16)(jiti@1.21.6)(postcss@8.4.47)(tsx@4.19.1)(typescript@5.6.3) + version: 8.3.5(@microsoft/api-extractor@7.43.0(@types/node@20.16.10))(@swc/core@1.4.16)(jiti@1.21.6)(postcss@8.4.47)(tsx@4.19.1)(typescript@5.6.3) typescript: specifier: ^5.6.3 version: 5.6.3 vite: specifier: ^5.4.8 - version: 5.4.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + version: 5.4.9(@types/node@20.16.10)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) vitest: specifier: ^2.1.3 - version: 2.1.3(@types/node@20.12.7)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + version: 2.1.3(@types/node@20.16.10)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) packages/scripts: dependencies: @@ -928,15 +1043,24 @@ importers: packages/slots: dependencies: - '@plone/providers': + '@plone/blocks': specifier: workspace:* - version: link:../providers + version: link:../blocks + '@plone/client': + specifier: workspace:* + version: link:../client + '@plone/components': + specifier: workspace:* + version: link:../components '@plone/registry': specifier: workspace:* version: link:../registry react: specifier: ^16.8.0 || ^17.0.0 || ^18.0.0 version: 18.2.0 + react-aria-components: + specifier: ^1.4.0 + version: 1.5.0(react-dom@18.2.0(react@18.2.0))(react@18.2.0) react-dom: specifier: ^16.8.0 || ^17.0.0 || ^18.0.0 version: 18.2.0(react@18.2.0) @@ -944,24 +1068,151 @@ importers: '@plone/types': specifier: workspace:* version: link:../types + '@storybook/addon-essentials': + specifier: ^8.0.4 + version: 8.0.8(@types/react@18.2.79)(encoding@0.1.13)(react-dom@18.2.0(react@18.2.0))(react@18.2.0) + '@storybook/addon-interactions': + specifier: ^8.0.4 + version: 8.0.8(@jest/globals@29.7.0)(@types/jest@29.5.12)(jest@29.7.0(@types/node@22.7.4))(vitest@2.1.3(@types/node@22.7.4)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3)) + '@storybook/addon-links': + specifier: ^8.0.4 + version: 8.0.8(react@18.2.0) + '@storybook/addon-mdx-gfm': + specifier: ^8.0.4 + version: 8.0.8 + '@storybook/blocks': + specifier: ^8.0.4 + version: 8.0.8(@types/react@18.2.79)(encoding@0.1.13)(react-dom@18.2.0(react@18.2.0))(react@18.2.0) + '@storybook/manager-api': + specifier: ^8.0.4 + version: 8.0.8(react-dom@18.2.0(react@18.2.0))(react@18.2.0) + '@storybook/react': + specifier: ^8.0.4 + version: 8.0.8(encoding@0.1.13)(react-dom@18.2.0(react@18.2.0))(react@18.2.0)(typescript@5.6.3) + '@storybook/react-vite': + specifier: ^8.0.4 + version: 8.0.8(@preact/preset-vite@2.8.2(@babel/core@7.25.8)(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3)))(encoding@0.1.13)(react-dom@18.2.0(react@18.2.0))(react@18.2.0)(rollup@4.24.0)(typescript@5.6.3)(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3)) + '@storybook/theming': + specifier: ^8.0.4 + version: 8.0.8(react-dom@18.2.0(react@18.2.0))(react@18.2.0) '@types/react': specifier: ^18 version: 18.2.79 '@types/react-dom': specifier: ^18 version: 18.2.25 + eslint-plugin-storybook: + specifier: ^0.8.0 + version: 0.8.0(eslint@8.57.1)(typescript@5.6.3) + jest-axe: + specifier: ^8.0.0 + version: 8.0.0 release-it: specifier: 17.1.1 version: 17.1.1(typescript@5.6.3) + storybook: + specifier: ^8.0.4 + version: 8.0.8(@babel/preset-env@7.24.4(@babel/core@7.25.8))(encoding@0.1.13)(react-dom@18.2.0(react@18.2.0))(react@18.2.0) tsconfig: specifier: workspace:* version: link:../tsconfig typescript: specifier: ^5.6.3 version: 5.6.3 + vite: + specifier: ^5.4.8 + version: 5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) vitest: specifier: ^2.1.3 - version: 2.1.3(@types/node@20.12.7)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + version: 2.1.3(@types/node@22.7.4)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) + vitest-axe: + specifier: ^0.1.0 + version: 0.1.0(vitest@2.1.3(@types/node@22.7.4)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3)) + + packages/theming: + dependencies: + '@plone/components': + specifier: workspace:* + version: link:../components + '@plone/registry': + specifier: workspace:* + version: link:../registry + lightningcss: + specifier: 1.28.1 + version: 1.28.1 + lightningcss-cli: + specifier: 1.28.1 + version: 1.28.1 + react: + specifier: ^16.8.0 || ^17.0.0 || ^18.0.0 + version: 18.2.0 + react-dom: + specifier: ^16.8.0 || ^17.0.0 || ^18.0.0 + version: 18.2.0(react@18.2.0) + devDependencies: + '@plone/types': + specifier: workspace:* + version: link:../types + '@storybook/addon-essentials': + specifier: ^8.0.4 + version: 8.0.8(@types/react@18.3.12)(encoding@0.1.13)(react-dom@18.2.0(react@18.2.0))(react@18.2.0) + '@storybook/addon-interactions': + specifier: ^8.0.4 + version: 8.0.8(@jest/globals@29.7.0)(@types/jest@29.5.12)(jest@29.7.0(@types/node@22.7.4))(vitest@2.1.3(@types/node@22.7.4)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3)) + '@storybook/addon-links': + specifier: ^8.0.4 + version: 8.0.8(react@18.2.0) + '@storybook/addon-mdx-gfm': + specifier: ^8.0.4 + version: 8.0.8 + '@storybook/blocks': + specifier: ^8.0.4 + version: 8.0.8(@types/react@18.3.12)(encoding@0.1.13)(react-dom@18.2.0(react@18.2.0))(react@18.2.0) + '@storybook/manager-api': + specifier: ^8.0.4 + version: 8.0.8(react-dom@18.2.0(react@18.2.0))(react@18.2.0) + '@storybook/react': + specifier: ^8.0.4 + version: 8.0.8(encoding@0.1.13)(react-dom@18.2.0(react@18.2.0))(react@18.2.0)(typescript@5.6.3) + '@storybook/react-vite': + specifier: ^8.0.4 + version: 8.0.8(@preact/preset-vite@2.8.2(@babel/core@7.25.8)(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3)))(encoding@0.1.13)(react-dom@18.2.0(react@18.2.0))(react@18.2.0)(rollup@4.24.0)(typescript@5.6.3)(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3)) + '@storybook/theming': + specifier: ^8.0.4 + version: 8.0.8(react-dom@18.2.0(react@18.2.0))(react@18.2.0) + '@types/react': + specifier: ^18 + version: 18.3.12 + '@types/react-dom': + specifier: ^18 + version: 18.3.1 + eslint-plugin-storybook: + specifier: ^0.8.0 + version: 0.8.0(eslint@8.57.1)(typescript@5.6.3) + jest-axe: + specifier: ^8.0.0 + version: 8.0.0 + release-it: + specifier: 17.1.1 + version: 17.1.1(typescript@5.6.3) + storybook: + specifier: ^8.0.4 + version: 8.0.8(@babel/preset-env@7.24.4(@babel/core@7.25.8))(encoding@0.1.13)(react-dom@18.2.0(react@18.2.0))(react@18.2.0) + tsconfig: + specifier: workspace:* + version: link:../tsconfig + typescript: + specifier: ^5.6.3 + version: 5.6.3 + vite: + specifier: ^5.4.8 + version: 5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) + vitest: + specifier: ^2.1.3 + version: 2.1.3(@types/node@22.7.4)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) + vitest-axe: + specifier: ^0.1.0 + version: 0.1.0(vitest@2.1.3(@types/node@22.7.4)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3)) packages/tsconfig: {} @@ -1366,7 +1617,7 @@ importers: version: 10.0.1(cypress@13.13.2) '@testing-library/jest-dom': specifier: 6.4.2 - version: 6.4.2(@jest/globals@29.7.0)(@types/jest@29.5.12)(jest@26.6.3)(vitest@2.1.3(@types/node@20.12.7)(jsdom@16.7.0)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)) + version: 6.4.2(@jest/globals@29.7.0)(@types/jest@29.5.12)(jest@26.6.3)(vitest@2.1.3(@types/node@22.7.4)(jsdom@16.7.0)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3)) '@testing-library/react': specifier: 14.2.0 version: 14.2.0(react-dom@18.2.0(react@18.2.0))(react@18.2.0) @@ -1718,7 +1969,7 @@ importers: version: 10.0.1(cypress@13.13.2) '@testing-library/jest-dom': specifier: 6.4.2 - version: 6.4.2(@jest/globals@29.7.0)(@types/jest@29.5.12)(jest@29.7.0(@types/node@20.12.7))(vitest@2.1.3(@types/node@20.12.7)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)) + version: 6.4.2(@jest/globals@29.7.0)(@types/jest@29.5.12)(jest@29.7.0(@types/node@22.7.4))(vitest@2.1.3(@types/node@22.7.4)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3)) '@testing-library/react': specifier: 12.1.5 version: 12.1.5(react-dom@18.3.1(react@18.3.1))(react@18.3.1) @@ -3634,6 +3885,10 @@ packages: resolution: {integrity: sha512-Cu96Sd2By9mCNTx2iyKOmq10v22jUVQv0lQnlGNy16oE9589yE+QADPbrMGCkA51cKZSg3Pu/aTJVTGfL/qjUA==} engines: {node: ^12.0.0 || ^14.0.0 || >=16.0.0} + '@eslint-community/regexpp@4.11.1': + resolution: {integrity: sha512-m4DVN9ZqskZoLU5GlWZadwDnYo3vAEydiUayB9widCl9ffWx2IvPnp6n3on5rJmziJSw9Bv+Z3ChDVdMwXCY8Q==} + engines: {node: ^12.0.0 || ^14.0.0 || >=16.0.0} + '@eslint/eslintrc@2.1.4': resolution: {integrity: sha512-269Z39MS6wVJtsoUl10L60WdkhJVdPG24Q4eZTH3nnF6lpvSShEK3wQjDX9JRWAUPvPh7COouPpU9IrqaZFvtQ==} engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0} @@ -3642,6 +3897,10 @@ packages: resolution: {integrity: sha512-Ys+3g2TaW7gADOJzPt83SJtCDhMjndcDMFVQ/Tj9iA1BfJzFKD9mAUXT3OenpuPHbI6P/myECxRJrofUsDx/5g==} engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0} + '@eslint/js@8.57.1': + resolution: {integrity: sha512-d9zaMRSTIKDLhctzH12MtXvJKSSUhaHcjV+2Z+GK+EEY7XKpP5yR4x+N3TAcHTcu963nIr+TMcCb4DBCYX1z6Q==} + engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0} + '@fal-works/esbuild-plugin-global-externals@2.1.2': resolution: {integrity: sha512-cEee/Z+I12mZcFJshKcCqC8tuX5hG3s+d+9nZ3LabqKF1vKdF41B92pJVCBggjAGORAeOzyyDDKrZwIkLffeOQ==} @@ -3710,6 +3969,11 @@ packages: resolution: {integrity: sha512-3T8LkOmg45BV5FICb15QQMsyUSWrQ8AygVfC7ZG32zOalnqrilm018ZVCw0eapXux8FtA33q8PSRSstjee3jSg==} engines: {node: '>=10.10.0'} + '@humanwhocodes/config-array@0.13.0': + resolution: {integrity: sha512-DZLEEqFWQFiyK6h5YIeynKx7JlvCYWL0cImfSRXZ9l4Sg2efkFGTuFf6vzXjK1cq6IYkU+Eg/JizXw+TD2vRNw==} + engines: {node: '>=10.10.0'} + deprecated: Use @eslint/config-array instead + '@humanwhocodes/module-importer@1.0.1': resolution: {integrity: sha512-bxveV4V8v5Yb4ncFTT3rPSgZBOpCkjfK0y4oVVVJwIuDVBRMDXrPyXRL988i5ap9m9bnyEEjWfm5WkBmtffLfA==} engines: {node: '>=12.22'} @@ -5804,161 +6068,81 @@ packages: rollup: optional: true - '@rollup/rollup-android-arm-eabi@4.14.3': - resolution: {integrity: sha512-X9alQ3XM6I9IlSlmC8ddAvMSyG1WuHk5oUnXGw+yUBs3BFoTizmG1La/Gr8fVJvDWAq+zlYTZ9DBgrlKRVY06g==} - cpu: [arm] - os: [android] - '@rollup/rollup-android-arm-eabi@4.24.0': resolution: {integrity: sha512-Q6HJd7Y6xdB48x8ZNVDOqsbh2uByBhgK8PiQgPhwkIw/HC/YX5Ghq2mQY5sRMZWHb3VsFkWooUVOZHKr7DmDIA==} cpu: [arm] os: [android] - '@rollup/rollup-android-arm64@4.14.3': - resolution: {integrity: sha512-eQK5JIi+POhFpzk+LnjKIy4Ks+pwJ+NXmPxOCSvOKSNRPONzKuUvWE+P9JxGZVxrtzm6BAYMaL50FFuPe0oWMQ==} - cpu: [arm64] - os: [android] - '@rollup/rollup-android-arm64@4.24.0': resolution: {integrity: sha512-ijLnS1qFId8xhKjT81uBHuuJp2lU4x2yxa4ctFPtG+MqEE6+C5f/+X/bStmxapgmwLwiL3ih122xv8kVARNAZA==} cpu: [arm64] os: [android] - '@rollup/rollup-darwin-arm64@4.14.3': - resolution: {integrity: sha512-Od4vE6f6CTT53yM1jgcLqNfItTsLt5zE46fdPaEmeFHvPs5SjZYlLpHrSiHEKR1+HdRfxuzXHjDOIxQyC3ptBA==} - cpu: [arm64] - os: [darwin] - '@rollup/rollup-darwin-arm64@4.24.0': resolution: {integrity: sha512-bIv+X9xeSs1XCk6DVvkO+S/z8/2AMt/2lMqdQbMrmVpgFvXlmde9mLcbQpztXm1tajC3raFDqegsH18HQPMYtA==} cpu: [arm64] os: [darwin] - '@rollup/rollup-darwin-x64@4.14.3': - resolution: {integrity: sha512-0IMAO21axJeNIrvS9lSe/PGthc8ZUS+zC53O0VhF5gMxfmcKAP4ESkKOCwEi6u2asUrt4mQv2rjY8QseIEb1aw==} - cpu: [x64] - os: [darwin] - '@rollup/rollup-darwin-x64@4.24.0': resolution: {integrity: sha512-X6/nOwoFN7RT2svEQWUsW/5C/fYMBe4fnLK9DQk4SX4mgVBiTA9h64kjUYPvGQ0F/9xwJ5U5UfTbl6BEjaQdBQ==} cpu: [x64] os: [darwin] - '@rollup/rollup-linux-arm-gnueabihf@4.14.3': - resolution: {integrity: sha512-ge2DC7tHRHa3caVEoSbPRJpq7azhG+xYsd6u2MEnJ6XzPSzQsTKyXvh6iWjXRf7Rt9ykIUWHtl0Uz3T6yXPpKw==} - cpu: [arm] - os: [linux] - '@rollup/rollup-linux-arm-gnueabihf@4.24.0': resolution: {integrity: sha512-0KXvIJQMOImLCVCz9uvvdPgfyWo93aHHp8ui3FrtOP57svqrF/roSSR5pjqL2hcMp0ljeGlU4q9o/rQaAQ3AYA==} cpu: [arm] os: [linux] - '@rollup/rollup-linux-arm-musleabihf@4.14.3': - resolution: {integrity: sha512-ljcuiDI4V3ySuc7eSk4lQ9wU8J8r8KrOUvB2U+TtK0TiW6OFDmJ+DdIjjwZHIw9CNxzbmXY39wwpzYuFDwNXuw==} - cpu: [arm] - os: [linux] - '@rollup/rollup-linux-arm-musleabihf@4.24.0': resolution: {integrity: sha512-it2BW6kKFVh8xk/BnHfakEeoLPv8STIISekpoF+nBgWM4d55CZKc7T4Dx1pEbTnYm/xEKMgy1MNtYuoA8RFIWw==} cpu: [arm] os: [linux] - '@rollup/rollup-linux-arm64-gnu@4.14.3': - resolution: {integrity: sha512-Eci2us9VTHm1eSyn5/eEpaC7eP/mp5n46gTRB3Aar3BgSvDQGJZuicyq6TsH4HngNBgVqC5sDYxOzTExSU+NjA==} - cpu: [arm64] - os: [linux] - '@rollup/rollup-linux-arm64-gnu@4.24.0': resolution: {integrity: sha512-i0xTLXjqap2eRfulFVlSnM5dEbTVque/3Pi4g2y7cxrs7+a9De42z4XxKLYJ7+OhE3IgxvfQM7vQc43bwTgPwA==} cpu: [arm64] os: [linux] - '@rollup/rollup-linux-arm64-musl@4.14.3': - resolution: {integrity: sha512-UrBoMLCq4E92/LCqlh+blpqMz5h1tJttPIniwUgOFJyjWI1qrtrDhhpHPuFxULlUmjFHfloWdixtDhSxJt5iKw==} - cpu: [arm64] - os: [linux] - '@rollup/rollup-linux-arm64-musl@4.24.0': resolution: {integrity: sha512-9E6MKUJhDuDh604Qco5yP/3qn3y7SLXYuiC0Rpr89aMScS2UAmK1wHP2b7KAa1nSjWJc/f/Lc0Wl1L47qjiyQw==} cpu: [arm64] os: [linux] - '@rollup/rollup-linux-powerpc64le-gnu@4.14.3': - resolution: {integrity: sha512-5aRjvsS8q1nWN8AoRfrq5+9IflC3P1leMoy4r2WjXyFqf3qcqsxRCfxtZIV58tCxd+Yv7WELPcO9mY9aeQyAmw==} - cpu: [ppc64] - os: [linux] - '@rollup/rollup-linux-powerpc64le-gnu@4.24.0': resolution: {integrity: sha512-2XFFPJ2XMEiF5Zi2EBf4h73oR1V/lycirxZxHZNc93SqDN/IWhYYSYj8I9381ikUFXZrz2v7r2tOVk2NBwxrWw==} cpu: [ppc64] os: [linux] - '@rollup/rollup-linux-riscv64-gnu@4.14.3': - resolution: {integrity: sha512-sk/Qh1j2/RJSX7FhEpJn8n0ndxy/uf0kI/9Zc4b1ELhqULVdTfN6HL31CDaTChiBAOgLcsJ1sgVZjWv8XNEsAQ==} - cpu: [riscv64] - os: [linux] - '@rollup/rollup-linux-riscv64-gnu@4.24.0': resolution: {integrity: sha512-M3Dg4hlwuntUCdzU7KjYqbbd+BLq3JMAOhCKdBE3TcMGMZbKkDdJ5ivNdehOssMCIokNHFOsv7DO4rlEOfyKpg==} cpu: [riscv64] os: [linux] - '@rollup/rollup-linux-s390x-gnu@4.14.3': - resolution: {integrity: sha512-jOO/PEaDitOmY9TgkxF/TQIjXySQe5KVYB57H/8LRP/ux0ZoO8cSHCX17asMSv3ruwslXW/TLBcxyaUzGRHcqg==} - cpu: [s390x] - os: [linux] - '@rollup/rollup-linux-s390x-gnu@4.24.0': resolution: {integrity: sha512-mjBaoo4ocxJppTorZVKWFpy1bfFj9FeCMJqzlMQGjpNPY9JwQi7OuS1axzNIk0nMX6jSgy6ZURDZ2w0QW6D56g==} cpu: [s390x] os: [linux] - '@rollup/rollup-linux-x64-gnu@4.14.3': - resolution: {integrity: sha512-8ybV4Xjy59xLMyWo3GCfEGqtKV5M5gCSrZlxkPGvEPCGDLNla7v48S662HSGwRd6/2cSneMQWiv+QzcttLrrOA==} - cpu: [x64] - os: [linux] - '@rollup/rollup-linux-x64-gnu@4.24.0': resolution: {integrity: sha512-ZXFk7M72R0YYFN5q13niV0B7G8/5dcQ9JDp8keJSfr3GoZeXEoMHP/HlvqROA3OMbMdfr19IjCeNAnPUG93b6A==} cpu: [x64] os: [linux] - '@rollup/rollup-linux-x64-musl@4.14.3': - resolution: {integrity: sha512-s+xf1I46trOY10OqAtZ5Rm6lzHre/UiLA1J2uOhCFXWkbZrJRkYBPO6FhvGfHmdtQ3Bx793MNa7LvoWFAm93bg==} - cpu: [x64] - os: [linux] - '@rollup/rollup-linux-x64-musl@4.24.0': resolution: {integrity: sha512-w1i+L7kAXZNdYl+vFvzSZy8Y1arS7vMgIy8wusXJzRrPyof5LAb02KGr1PD2EkRcl73kHulIID0M501lN+vobQ==} cpu: [x64] os: [linux] - '@rollup/rollup-win32-arm64-msvc@4.14.3': - resolution: {integrity: sha512-+4h2WrGOYsOumDQ5S2sYNyhVfrue+9tc9XcLWLh+Kw3UOxAvrfOrSMFon60KspcDdytkNDh7K2Vs6eMaYImAZg==} - cpu: [arm64] - os: [win32] - '@rollup/rollup-win32-arm64-msvc@4.24.0': resolution: {integrity: sha512-VXBrnPWgBpVDCVY6XF3LEW0pOU51KbaHhccHw6AS6vBWIC60eqsH19DAeeObl+g8nKAz04QFdl/Cefta0xQtUQ==} cpu: [arm64] os: [win32] - '@rollup/rollup-win32-ia32-msvc@4.14.3': - resolution: {integrity: sha512-T1l7y/bCeL/kUwh9OD4PQT4aM7Bq43vX05htPJJ46RTI4r5KNt6qJRzAfNfM+OYMNEVBWQzR2Gyk+FXLZfogGw==} - cpu: [ia32] - os: [win32] - '@rollup/rollup-win32-ia32-msvc@4.24.0': resolution: {integrity: sha512-xrNcGDU0OxVcPTH/8n/ShH4UevZxKIO6HJFK0e15XItZP2UcaiLFd5kiX7hJnqCbSztUF8Qot+JWBC/QXRPYWQ==} cpu: [ia32] os: [win32] - '@rollup/rollup-win32-x64-msvc@4.14.3': - resolution: {integrity: sha512-/BypzV0H1y1HzgYpxqRaXGBRqfodgoBBCcsrujT6QRcakDQdfU+Lq9PENPh5jB4I44YWq+0C2eHsHya+nZY1sA==} - cpu: [x64] - os: [win32] - '@rollup/rollup-win32-x64-msvc@4.24.0': resolution: {integrity: sha512-fbMkAF7fufku0N2dE5TBXcNlg0pt0cJue4xBRE2Qc5Vqikxr4VCgKj/ht6SMdFcOacVA9rqF70APJ8RN/4vMJw==} cpu: [x64] @@ -6382,6 +6566,9 @@ packages: '@swc/helpers@0.5.10': resolution: {integrity: sha512-CU+RF9FySljn7HVSkkjiB84hWkvTaI3rtLvF433+jRSBL2hMu3zX5bGhHS8C80SM++h4xy8hBSnUHFQHmRXSBw==} + '@swc/helpers@0.5.13': + resolution: {integrity: sha512-UoKGxQ3r5kYI9dALKJapMmuK+1zWM/H17Z1+iwnNmzcJRnfFuevZs375TA5rW31pu4BS4NoSy1fRsexDXfWn5w==} + '@swc/helpers@0.5.5': resolution: {integrity: sha512-KGYxvIOXcceOAbEk4bi/dVLEK9z8sZ0uBB3Il5b1rhfClSpcX0yfRO0KmTkqR2cnQDymwLB+25ZyMzICg/cm/A==} @@ -6833,8 +7020,11 @@ packages: '@types/node@18.19.31': resolution: {integrity: sha512-ArgCD39YpyyrtFKIqMDvjz79jto5fcI/SVUs2HwB+f0dAzq68yqOdyaSivLiLugSziTpNXLQrVb7RZFmdZzbhA==} - '@types/node@20.12.7': - resolution: {integrity: sha512-wq0cICSkRLVaf3UGLMGItu/PtdY7oaXaI/RVU+xliKVOtRna3PRY57ZDfztpDL0n11vfymMUnXv8QwYCO7L1wg==} + '@types/node@20.16.10': + resolution: {integrity: sha512-vQUKgWTjEIRFCvK6CyriPH3MZYiYlNy0fKiEYHWbcoWLEgs4opurGGKlebrTLqdSMIbXImH6XExNiIyNUv3WpA==} + + '@types/node@22.7.4': + resolution: {integrity: sha512-y+NPi1rFzDs1NdQHHToqeiX2TIS79SWEAw9GYhkkx8bD0ChpfqC+n2j5OXOCpzfojBEBt6DnEnnG9MY0zk1XLg==} '@types/normalize-package-data@2.4.4': resolution: {integrity: sha512-37i+OaWTh9qeK4LSHPsyRC7NahnGotNuZvjLSgcPzblpHB3rrCJxAOgI5gCdKm7coonsaX1Of0ILiTcnZjbfxA==} @@ -6851,6 +7041,9 @@ packages: '@types/prop-types@15.7.12': resolution: {integrity: sha512-5zvhXYtRNRluoE/jAp4GVsSduVUzNWKkOZrCDBWYtE7biZywwdC2AcEzg+cSMLFRfVgeAFqpfNabiPjxFddV1Q==} + '@types/prop-types@15.7.13': + resolution: {integrity: sha512-hCZTSvwbzWGvhqxp/RqVqwU999pBf2vp7hzIjiYOsl8wqOmUxkQ6ddw1cV3l8811+kdUFus/q4d1Y3E3SyEifA==} + '@types/q@1.5.8': resolution: {integrity: sha512-hroOstUScF6zhIi+5+x0dzqrHA1EJi+Irri6b1fxolMTqqHIV/Cg77EtnQcZqZCu8hR3mX2BzIxN4/GzI68Kfw==} @@ -6869,6 +7062,9 @@ packages: '@types/react-dom@18.2.25': resolution: {integrity: sha512-o/V48vf4MQh7juIKZU2QGDfli6p1+OOi5oXx36Hffpc9adsHeXjVp8rHuPkjd8VT8sOJ2Zp05HR7CdpGTIUFUA==} + '@types/react-dom@18.3.0': + resolution: {integrity: sha512-EhwApuTmMBmXuFOikhQLIBUn6uFg81SwLMOAUgodJF14SOBOCMdU04gDoYi0WOJJHD144TL32z4yDqCW3dnkQg==} + '@types/react-dom@18.3.1': resolution: {integrity: sha512-qW1Mfv8taImTthu4KoXgDfLuk4bydU6Q/TkADnDWWHwi4NX4BR+LWfTp2sVmTqRrsHvyDDTelgelxJ+SsejKKQ==} @@ -6884,8 +7080,8 @@ packages: '@types/react-test-renderer@18.0.7': resolution: {integrity: sha512-1+ANPOWc6rB3IkSnElhjv6VLlKg2dSv/OWClUyZimbLsQyBn8Js9Vtdsi3UICJ2rIQ3k2la06dkB+C92QfhKmg==} - '@types/react@17.0.80': - resolution: {integrity: sha512-LrgHIu2lEtIo8M7d1FcI3BdwXWoRQwMoXOZ7+dPTW0lYREjmlHl3P0U1VD0i/9tppOuv8/sam7sOjx34TxSFbA==} + '@types/react@17.0.83': + resolution: {integrity: sha512-l0m4ArKJvmFtR4e8UmKrj1pB4tUgOhJITf+mADyF/p69Ts1YAR/E+G9XEM0mHXKVRa1dQNHseyyDNzeuAXfXQw==} '@types/react@18.2.27': resolution: {integrity: sha512-Wfv7B7FZiR2r3MIqbAlXoY1+tXm4bOqfz4oRr+nyXdBqapDBZ0l/IGcSlAfvxIHEEJjkPU0MYAc/BlFPOcrgLw==} @@ -9946,6 +10142,12 @@ packages: engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0} hasBin: true + eslint@8.57.1: + resolution: {integrity: sha512-ypowyDxpVSYpkXr9WPv2PAZCtNip1Mv5KTW0SCurXv/9iOpcrH9PaqUElksqEB6pChqHGDRCFTyrZlGhnLNGiA==} + engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0} + deprecated: This version is no longer supported. Please see https://eslint.org/version-support for other options. + hasBin: true + esniff@2.0.1: resolution: {integrity: sha512-kTUIGKQ/mDPFoJ0oVfcmyJn4iBDRptjNVIzwIFR7tqWXdVI9xfA2RMwY/gbSpJG3lkdWNEjLap/NqVHZiJsdfg==} engines: {node: '>=0.10'} @@ -9963,6 +10165,10 @@ packages: resolution: {integrity: sha512-YQLXUplAwJgCydQ78IMJywZCceoqk1oH01OERdSAJc/7U2AylwjhSCLDEtqwg811idIS/9fIU5GjG73IgjKMVg==} engines: {node: '>=0.10'} + esquery@1.6.0: + resolution: {integrity: sha512-ca9pw9fomFcKPvFLXhBKUK90ZvGibiGOvRJNbjljY7s7uq/5YO4BOzcYtJqExdx99rF6aAcnRxHmcUHcz6sQsg==} + engines: {node: '>=0.10'} + esrecurse@4.3.0: resolution: {integrity: sha512-KmfKL3b6G+RXvP8N1vr3Tq1kL/oCFgn2NYXEtqP8/L3pKapUA4G8cFVaoF3SU323CD4XypR/ffioHmkti6/Tag==} engines: {node: '>=4.0'} @@ -10351,6 +10557,10 @@ packages: resolution: {integrity: sha512-TMKDUnIte6bfb5nWv7V/caI169OHgvwjb7V4WkeUvbQQdjr5rWKqHFiKWb/fcOwB+CzBT+qbWjvj+DVwRskpIg==} engines: {node: '>=14'} + foreground-child@3.3.0: + resolution: {integrity: sha512-Ld2g8rrAyMYFXBhEqMz8ZAHBi4J4uS1i/CxGMDnjyFWddMXLVcDp051DZfu+t7+ab7Wv6SMqpWmyFIj5UbfFvg==} + engines: {node: '>=14'} + forever-agent@0.6.1: resolution: {integrity: sha512-j0KLYPhm6zeac4lz3oJ3o65qvgQCcPubiyotZrXqEaG4hNagNYO8qdlUrX5vwqv9ohqeT/Z3j6+yW067yWWdUw==} @@ -11080,6 +11290,10 @@ packages: resolution: {integrity: sha512-5Fytz/IraMjqpwfd34ke28PTVMjZjJG2MPn5t7OE4eUCUNf8BAa7b5WUS9/Qvr6mwOQS7Mk6vdsMno5he+T8Xw==} engines: {node: '>= 4'} + ignore@5.3.2: + resolution: {integrity: sha512-hsBTNUqQTDwkWtcdYI2i06Y/nUBEsNEDJKjWdigLvegy8kDuJAS8uRlpkkcQpyEXL0Z/pjDy5HBmMjRCJ2gq+g==} + engines: {node: '>= 4'} + image-extensions@1.1.0: resolution: {integrity: sha512-P0t7ByhK8Jk9TU05ct/7+f7h8dNuXq5OY4m0IO/T+1aga/qHkpC0Wf472x3FLdq/zFDG17pgapCM3JDTxwZzow==} engines: {node: '>=0.10.0'} @@ -11304,6 +11518,10 @@ packages: is-core-module@2.13.1: resolution: {integrity: sha512-hHrIjvZsftOsvKSn2TRYl63zvxsgE0K+0mYMoH6gD4omR5IWB2KynivBQczo3+wF1cCkjzvptnI9Q0sPU66ilw==} + is-core-module@2.15.1: + resolution: {integrity: sha512-z0vtXSwucUJtANQWldhbtbt7BnL0vxiFjIdDLAatwhDYty2bad6s+rijD6Ri4YuYJubLzIJLUidCh09e1djEVQ==} + engines: {node: '>= 0.4'} + is-data-descriptor@1.0.1: resolution: {integrity: sha512-bc4NlCDiCr28U4aEsQ3Qs2491gVq4V8G7MQyws968ImqjKuYtTJXrl7Vq7jsN7Ly/C3xj5KWFrY7sHNeDkAzXw==} engines: {node: '>= 0.4'} @@ -12279,117 +12497,246 @@ packages: cpu: [arm64] os: [darwin] + lightningcss-cli-darwin-arm64@1.28.1: + resolution: {integrity: sha512-qPA7fgtt6spmhqqZY9Gji6TCfV51sUu2n52KLTVydaAf0QVD/iFMF92iwLMhF37Rzn8dB6BHYFew9Jq/kkM9sQ==} + engines: {node: '>= 12.0.0'} + cpu: [arm64] + os: [darwin] + lightningcss-cli-darwin-x64@1.24.1: resolution: {integrity: sha512-CzGxqMibHSH3mFHJBkBp/zip3jmNPY7J3deF5FyL0ibjjfrmdifdwcx7thxcSqrSgWnBUDJ4pLt9vbYykMaDrg==} engines: {node: '>= 12.0.0'} cpu: [x64] os: [darwin] + lightningcss-cli-darwin-x64@1.28.1: + resolution: {integrity: sha512-MjVnQJTZgozVIi2PdyOmYojfgzaUxZ1LBoWvFEDhYy0z7u6sBOf9Of4I0N7mfWEBtdg8dvAnPd11h+/NN4sUFg==} + engines: {node: '>= 12.0.0'} + cpu: [x64] + os: [darwin] + lightningcss-cli-freebsd-x64@1.24.1: resolution: {integrity: sha512-0v2MLwNShwff1qZNWvbxDYN5E0Zy4r+YAHTaG2Q5eThWEcO+1KnokSYFd+sxKFapghyzelYtByvdHUP/r5T4Tw==} engines: {node: '>= 12.0.0'} cpu: [x64] os: [freebsd] + lightningcss-cli-freebsd-x64@1.28.1: + resolution: {integrity: sha512-BQvQPc6FTb2531zaYww6F/gIU+61+PV13sPWP+DofZUuo8biO7KT74WFuggrqVoVtFRJPnMD2WfLGc8rUGdjwA==} + engines: {node: '>= 12.0.0'} + cpu: [x64] + os: [freebsd] + lightningcss-cli-linux-arm-gnueabihf@1.24.1: resolution: {integrity: sha512-BZOYEFKhBk4C9tgLTvA9XP/K9eOzMebhFHROJ/4bCucRgO4ylOTRZk9ik8BMJJrAB7aeZakzt3/FWLbPL3522g==} engines: {node: '>= 12.0.0'} cpu: [arm] os: [linux] + lightningcss-cli-linux-arm-gnueabihf@1.28.1: + resolution: {integrity: sha512-rEJ5ZqEK2iXZhGTeBgNHHfSqSny1wi1zYWKnbanW1IaJ/4JFhxWkgz/bqZi0+kfhzJDs5JrXKu+G4TL35E0U0Q==} + engines: {node: '>= 12.0.0'} + cpu: [arm] + os: [linux] + lightningcss-cli-linux-arm64-gnu@1.24.1: resolution: {integrity: sha512-TRRqgFzLTvO6hJMDIYtSliLfNaZLf2SXatHUmxP0a1Td8O1LUNILyiUzdjRHxBJ4u0fD93QTWHdNPMmYhZBv+A==} engines: {node: '>= 12.0.0'} cpu: [arm64] os: [linux] + lightningcss-cli-linux-arm64-gnu@1.28.1: + resolution: {integrity: sha512-+NGCcOCF7HK2fKqHN2gQ0a9AQ4HYvQ5IsqvRQQzgHwD+sjv+kzV8+NTQxs9cCKf2ST1fqD1j36r/YInzs4QDJw==} + engines: {node: '>= 12.0.0'} + cpu: [arm64] + os: [linux] + lightningcss-cli-linux-arm64-musl@1.24.1: resolution: {integrity: sha512-5ymGVRskVcddBwSsOfzMZUVy2mpO+fvU21rPCAVITnxui6B2jwLlwB+b4oQRJWSgfPZuwG8eb/csqKefeftpKg==} engines: {node: '>= 12.0.0'} cpu: [arm64] os: [linux] + lightningcss-cli-linux-arm64-musl@1.28.1: + resolution: {integrity: sha512-aZOt7bcJjjE9hFsqmG93z26kvl+Ffq/065ibEgNJ8etHnHWOwhiLH3j9ANd1YBXwRunMU583n0UzXVSx6ip6pQ==} + engines: {node: '>= 12.0.0'} + cpu: [arm64] + os: [linux] + lightningcss-cli-linux-x64-gnu@1.24.1: resolution: {integrity: sha512-vuZbkCb36UuoDVuO+TYDov40Rhw4pWgcJXh/4KKOes0pFlSlBCtL+oTQ2DQopLDkA8BEUoSEhUC2fBB1tmNxsg==} engines: {node: '>= 12.0.0'} cpu: [x64] os: [linux] + lightningcss-cli-linux-x64-gnu@1.28.1: + resolution: {integrity: sha512-5zwczYYPJqAYv7Moealc5qRwjFwWzTydX/eReOZdZecn3VJg1yhkR3T5DYSmiDIPrRWliNVk0p64xovntPL01w==} + engines: {node: '>= 12.0.0'} + cpu: [x64] + os: [linux] + lightningcss-cli-linux-x64-musl@1.24.1: resolution: {integrity: sha512-gSHaMnq8M2JX8vOU7r0AywWtzQ4abwnHl7hKgu/zqXnX2Vw5TOUJYWILMeJy+G82TsoobNuiWH7Bak58hxdRZA==} engines: {node: '>= 12.0.0'} cpu: [x64] os: [linux] + lightningcss-cli-linux-x64-musl@1.28.1: + resolution: {integrity: sha512-bCpq4VdvRlnTl3ZMazEmwSDmQJb54JgNDa0WCI8hreWywYaPNsrtWXFB/W5MGypEQGKIzquoTyy/Z3/oYM0tUg==} + engines: {node: '>= 12.0.0'} + cpu: [x64] + os: [linux] + + lightningcss-cli-win32-arm64-msvc@1.28.1: + resolution: {integrity: sha512-lyxajMp7bChXqy0TqD+AYyxykZ6oV6GKNMVOi6XLRkm84Y2EhD44ExMmW9pu/0AFw8l9zJilCIa7aKKfNu8Atg==} + engines: {node: '>= 12.0.0'} + cpu: [arm64] + os: [win32] + lightningcss-cli-win32-x64-msvc@1.24.1: resolution: {integrity: sha512-8hW4PZ9bNfM/UY1eQqAla1jRvUzcESCbhT4381d+N4g+ul2JrRi0FC4QctgAje5kl1udUt1zUMyhARJowvySVw==} engines: {node: '>= 12.0.0'} cpu: [x64] os: [win32] + lightningcss-cli-win32-x64-msvc@1.28.1: + resolution: {integrity: sha512-Kkp1uy9CoBx7lCSeoNLvNBKxpksz3ySoBdvKbId3QFW1I9BomN3hoZdg1/SQvEsTKC2IeW7ctX+98o0IoDRkvA==} + engines: {node: '>= 12.0.0'} + cpu: [x64] + os: [win32] + lightningcss-cli@1.24.1: resolution: {integrity: sha512-6HBXVWoHUNmOOoYeZzikGfWJT79NiuNgsztjEBLpen8V57VTG5/CFI/ekRDsHZRyJleUSsFjpqy7PzhtOBJhrQ==} engines: {node: '>= 12.0.0'} hasBin: true + lightningcss-cli@1.28.1: + resolution: {integrity: sha512-+9EIi1Sg+6Pzivx3k+x/SJVk/8hep8JDWmu5xn972rtbugHlanN9kVeEHyJY8PtGTGE4WRZVkm4nyGCivI8KvA==} + engines: {node: '>= 12.0.0'} + hasBin: true + lightningcss-darwin-arm64@1.24.1: resolution: {integrity: sha512-1jQ12jBy+AE/73uGQWGSafK5GoWgmSiIQOGhSEXiFJSZxzV+OXIx+a9h2EYHxdJfX864M+2TAxWPWb0Vv+8y4w==} engines: {node: '>= 12.0.0'} cpu: [arm64] os: [darwin] + lightningcss-darwin-arm64@1.28.1: + resolution: {integrity: sha512-VG3vvzM0m/rguCdm76DdobNeNJnHK+jWcdkNLFWHLh9YCotRvbRIt45JxwcHlIF8TDqWStVLTdghq5NaigVCBQ==} + engines: {node: '>= 12.0.0'} + cpu: [arm64] + os: [darwin] + lightningcss-darwin-x64@1.24.1: resolution: {integrity: sha512-R4R1d7VVdq2mG4igMU+Di8GPf0b64ZLnYVkubYnGG0Qxq1KaXQtAzcLI43EkpnoWvB/kUg8JKCWH4S13NfiLcQ==} engines: {node: '>= 12.0.0'} cpu: [x64] os: [darwin] + lightningcss-darwin-x64@1.28.1: + resolution: {integrity: sha512-O7ORdislvKfMohFl4Iq7fxKqdJOuuxArcglVI3amuFO5DJ0wfV3Gxgi1JRo49slfr7OVzJQEHLG4muTWYM5cTQ==} + engines: {node: '>= 12.0.0'} + cpu: [x64] + os: [darwin] + lightningcss-freebsd-x64@1.24.1: resolution: {integrity: sha512-z6NberUUw5ALES6Ixn2shmjRRrM1cmEn1ZQPiM5IrZ6xHHL5a1lPin9pRv+w6eWfcrEo+qGG6R9XfJrpuY3e4g==} engines: {node: '>= 12.0.0'} cpu: [x64] os: [freebsd] + lightningcss-freebsd-x64@1.28.1: + resolution: {integrity: sha512-b7sF89B31kYYijxVcFO7l5u6UNA862YstNu+3YbLl/IQKzveL4a5cwR5cdpG+OOhErg/c2u9WCmzZoX2I5GBvw==} + engines: {node: '>= 12.0.0'} + cpu: [x64] + os: [freebsd] + lightningcss-linux-arm-gnueabihf@1.24.1: resolution: {integrity: sha512-NLQLnBQW/0sSg74qLNI8F8QKQXkNg4/ukSTa+XhtkO7v3BnK19TS1MfCbDHt+TTdSgNEBv0tubRuapcKho2EWw==} engines: {node: '>= 12.0.0'} cpu: [arm] os: [linux] + lightningcss-linux-arm-gnueabihf@1.28.1: + resolution: {integrity: sha512-p61kXwvhUDLLzkWHjzSFfUBW/F0iy3jr3CWi3k8SKULtJEsJXTI9DqRm9EixxMSe2AMBQBt4auTYiQL4B1N51A==} + engines: {node: '>= 12.0.0'} + cpu: [arm] + os: [linux] + lightningcss-linux-arm64-gnu@1.24.1: resolution: {integrity: sha512-AQxWU8c9E9JAjAi4Qw9CvX2tDIPjgzCTrZCSXKELfs4mCwzxRkHh2RCxX8sFK19RyJoJAjA/Kw8+LMNRHS5qEg==} engines: {node: '>= 12.0.0'} cpu: [arm64] os: [linux] + lightningcss-linux-arm64-gnu@1.28.1: + resolution: {integrity: sha512-iO+fN9hOMmzfwqcG2/BgUtMKD48H2JO/SXU44fyIwpY2veb65QF5xiRrQ9l1FwIxbGK3231KBYCtAqv+xf+NsQ==} + engines: {node: '>= 12.0.0'} + cpu: [arm64] + os: [linux] + lightningcss-linux-arm64-musl@1.24.1: resolution: {integrity: sha512-JCgH/SrNrhqsguUA0uJUM1PvN5+dVuzPIlXcoWDHSv2OU/BWlj2dUYr3XNzEw748SmNZPfl2NjQrAdzaPOn1lA==} engines: {node: '>= 12.0.0'} cpu: [arm64] os: [linux] + lightningcss-linux-arm64-musl@1.28.1: + resolution: {integrity: sha512-dnMHeXEmCUzHHZjaDpQBYuBKcN9nPC3nPFKl70bcj5Bkn5EmkcgEqm5p035LKOgvAwk1XwLpQCML6pXmCwz0NQ==} + engines: {node: '>= 12.0.0'} + cpu: [arm64] + os: [linux] + lightningcss-linux-x64-gnu@1.24.1: resolution: {integrity: sha512-TYdEsC63bHV0h47aNRGN3RiK7aIeco3/keN4NkoSQ5T8xk09KHuBdySltWAvKLgT8JvR+ayzq8ZHnL1wKWY0rw==} engines: {node: '>= 12.0.0'} cpu: [x64] os: [linux] + lightningcss-linux-x64-gnu@1.28.1: + resolution: {integrity: sha512-7vWDISaMUn+oo2TwRdf2hl/BLdPxvywv9JKEqNZB/0K7bXwV4XE9wN/C2sAp1gGuh6QBA8lpjF4JIPt3HNlCHA==} + engines: {node: '>= 12.0.0'} + cpu: [x64] + os: [linux] + lightningcss-linux-x64-musl@1.24.1: resolution: {integrity: sha512-HLfzVik3RToot6pQ2Rgc3JhfZkGi01hFetHt40HrUMoeKitLoqUUT5owM6yTZPTytTUW9ukLBJ1pc3XNMSvlLw==} engines: {node: '>= 12.0.0'} cpu: [x64] os: [linux] + lightningcss-linux-x64-musl@1.28.1: + resolution: {integrity: sha512-IHCu9tVGP+x5BCpA2rF3D04DBokcBza/a8AuHQU+1AiMKubuMegPwcL7RatBgK4ztFHeYnnD5NdhwhRfYMAtNA==} + engines: {node: '>= 12.0.0'} + cpu: [x64] + os: [linux] + + lightningcss-win32-arm64-msvc@1.28.1: + resolution: {integrity: sha512-Erm72kHmMg/3h350PTseskz+eEGBM17Fuu79WW2Qqt0BfWSF1jHHc12lkJCWMYl5jcBHPs5yZdgNHtJ7IJS3Uw==} + engines: {node: '>= 12.0.0'} + cpu: [arm64] + os: [win32] + lightningcss-win32-x64-msvc@1.24.1: resolution: {integrity: sha512-joEupPjYJ7PjZtDsS5lzALtlAudAbgIBMGJPNeFe5HfdmJXFd13ECmEM+5rXNxYVMRHua2w8132R6ab5Z6K9Ow==} engines: {node: '>= 12.0.0'} cpu: [x64] os: [win32] + lightningcss-win32-x64-msvc@1.28.1: + resolution: {integrity: sha512-ZPQtvx+uQBzrSdHH8p4H3M9Alue+x369TPZAA3b4K3d92FPhpZCuBG04+HQzspam9sVeID9mI6f3VRAs2ezaEA==} + engines: {node: '>= 12.0.0'} + cpu: [x64] + os: [win32] + lightningcss@1.24.1: resolution: {integrity: sha512-kUpHOLiH5GB0ERSv4pxqlL0RYKnOXtgGtVe7shDGfhS0AZ4D1ouKFYAcLcZhql8aMspDNzaUCumGHZ78tb2fTg==} engines: {node: '>= 12.0.0'} + lightningcss@1.28.1: + resolution: {integrity: sha512-KRDkHlLlNj3DWh79CDt93fPlRJh2W1AuHV0ZSZAMMuN7lqlsZTV5842idfS1urWG8q9tc17velp1gCXhY7sLnQ==} + engines: {node: '>= 12.0.0'} + lilconfig@2.1.0: resolution: {integrity: sha512-utWOt/GHzuUxnLKxB6dk81RoOeoNeHgbrXiuGk4yyF5qlRz+iIVWu56E2fqGHFrXz0QNUhLB/8nKqvRH66JKGQ==} engines: {node: '>=10'} @@ -13691,6 +14038,10 @@ packages: resolution: {integrity: sha512-JjCoypp+jKn1ttEFExxhetCKeJt9zhAgAve5FXHixTvFDW/5aEktX9bufBKLRRMdU7bNtpLfcGu94B3cdEJgjg==} engines: {node: '>= 0.8.0'} + optionator@0.9.4: + resolution: {integrity: sha512-6IpQ7mKUxRcZNLIObR0hz7lxsapSSIYNZJwXPGeF0mTVqGKFIXj1DQcMoT22S3ROcLyY/rz0PWaWZ9ayWmad9g==} + engines: {node: '>= 0.8.0'} + ora@1.2.0: resolution: {integrity: sha512-q9OviUsoaDpwCKPnLXBKijNePrJm7dcrlYK4SIFmVdRyMpD1ACc2O46StenWIpdhp4doKRMYrOEJmwzcHfgboA==} engines: {node: '>=4'} @@ -15432,11 +15783,6 @@ packages: rollup: optional: true - rollup@4.14.3: - resolution: {integrity: sha512-ag5tTQKYsj1bhrFC9+OEWqb5O6VYgtQDO9hPDBMmIbePwhfSr+ExlcU741t8Dhw5DkPCQf6noz0jb36D6W9/hw==} - engines: {node: '>=18.0.0', npm: '>=8.0.0'} - hasBin: true - rollup@4.24.0: resolution: {integrity: sha512-DOmrlGSXNk1DM0ljiQA+i+o0rSLhtii1je5wgk60j49d1jHT5YYttBv1iWOnYSTG+fZZESUOSNiAl89SIet+Cg==} engines: {node: '>=18.0.0', npm: '>=8.0.0'} @@ -16812,6 +17158,9 @@ packages: undici-types@5.26.5: resolution: {integrity: sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA==} + undici-types@6.19.8: + resolution: {integrity: sha512-ve2KP6f/JnbPBFyobGHuerC9g1FYGn/F8n1LWTwNxCEzd6IfqTwUQcNXgEtmmQ6DlRrC1hrSrBnCZPokRrDHjw==} + undici@5.28.4: resolution: {integrity: sha512-72RFADWFqKmUb2hmmvNODKL3p9hcB6Gt2DOQMis1SEBaV6a4MH8soBvzg+95CYhCKPFedut2JY9bMfrDl9D23g==} engines: {node: '>=14.0'} @@ -17276,65 +17625,6 @@ packages: vite: optional: true - vite@5.2.9: - resolution: {integrity: sha512-uOQWfuZBlc6Y3W/DTuQ1Sr+oIXWvqljLvS881SVmAj00d5RdgShLcuXWxseWPd4HXwiYBFW/vXHfKFeqj9uQnw==} - engines: {node: ^18.0.0 || >=20.0.0} - hasBin: true - peerDependencies: - '@types/node': ^18.0.0 || >=20.0.0 - less: '*' - lightningcss: ^1.21.0 - sass: '*' - stylus: '*' - sugarss: '*' - terser: ^5.4.0 - peerDependenciesMeta: - '@types/node': - optional: true - less: - optional: true - lightningcss: - optional: true - sass: - optional: true - stylus: - optional: true - sugarss: - optional: true - terser: - optional: true - - vite@5.4.8: - resolution: {integrity: sha512-FqrItQ4DT1NC4zCUqMB4c4AZORMKIa0m8/URVCZ77OZ/QSNeJ54bU1vrFADbDsuwfIPcgknRkmqakQcgnL4GiQ==} - engines: {node: ^18.0.0 || >=20.0.0} - hasBin: true - peerDependencies: - '@types/node': ^18.0.0 || >=20.0.0 - less: '*' - lightningcss: ^1.21.0 - sass: '*' - sass-embedded: '*' - stylus: '*' - sugarss: '*' - terser: ^5.4.0 - peerDependenciesMeta: - '@types/node': - optional: true - less: - optional: true - lightningcss: - optional: true - sass: - optional: true - sass-embedded: - optional: true - stylus: - optional: true - sugarss: - optional: true - terser: - optional: true - vite@5.4.9: resolution: {integrity: sha512-20OVpJHh0PAM0oSOELa5GaZNWeDjcAvQjGXy2Uyr+Tp+/D2/Hdz6NLgpJLsarPTA2QJ6v8mX2P1ZfbsSKvdMkg==} engines: {node: ^18.0.0 || >=20.0.0} @@ -17664,6 +17954,10 @@ packages: resolution: {integrity: sha512-NMD00arvqcq2nwqc5Q6KtrSRHK+fVD31erE5FEMahAw5PmVCgD7MUXodq3pdZSUkqA9Cda2iWx6s1XYwiJWRmw==} engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0} + word-wrap@1.2.5: + resolution: {integrity: sha512-BN22B5eaMMI9UMtjrGd5g5eCYPpCPDUy0FJXbYsaT5zYxjFOckS53SQDE3pWkVoWpHXVb3BrYcEN4Twa55B5cA==} + engines: {node: '>=0.10.0'} + wordwrap@1.0.0: resolution: {integrity: sha512-gvVzJFlPycKc5dZN4yPkP8w7Dc37BtP1yczEneOb4uq34pXZcvrtRTmWV8W+Ume+XCxKgbjM+nevkyFPMybd4Q==} @@ -18221,7 +18515,7 @@ snapshots: '@babel/helper-validator-identifier': 7.25.7 chalk: 2.4.2 js-tokens: 4.0.0 - picocolors: 1.1.0 + picocolors: 1.1.1 '@babel/highlight@7.25.7': dependencies: @@ -18672,7 +18966,7 @@ snapshots: dependencies: '@babel/core': 7.25.8 '@babel/helper-environment-visitor': 7.22.20 - '@babel/helper-plugin-utils': 7.25.7 + '@babel/helper-plugin-utils': 7.24.0 '@babel/helper-remap-async-to-generator': 7.22.20(@babel/core@7.25.8) '@babel/plugin-syntax-async-generators': 7.8.4(@babel/core@7.25.8) @@ -18720,7 +19014,7 @@ snapshots: dependencies: '@babel/core': 7.25.8 '@babel/helper-create-class-features-plugin': 7.24.4(@babel/core@7.25.8) - '@babel/helper-plugin-utils': 7.25.7 + '@babel/helper-plugin-utils': 7.24.0 '@babel/plugin-transform-class-static-block@7.24.4(@babel/core@7.24.4)': dependencies: @@ -18752,10 +19046,10 @@ snapshots: dependencies: '@babel/core': 7.25.8 '@babel/helper-annotate-as-pure': 7.22.5 - '@babel/helper-compilation-targets': 7.25.7 + '@babel/helper-compilation-targets': 7.23.6 '@babel/helper-environment-visitor': 7.22.20 '@babel/helper-function-name': 7.23.0 - '@babel/helper-plugin-utils': 7.25.7 + '@babel/helper-plugin-utils': 7.24.0 '@babel/helper-replace-supers': 7.24.1(@babel/core@7.25.8) '@babel/helper-split-export-declaration': 7.22.6 globals: 11.12.0 @@ -18826,7 +19120,7 @@ snapshots: dependencies: '@babel/core': 7.25.8 '@babel/helper-builder-binary-assignment-operator-visitor': 7.22.15 - '@babel/helper-plugin-utils': 7.25.7 + '@babel/helper-plugin-utils': 7.24.0 '@babel/plugin-transform-export-namespace-from@7.24.1(@babel/core@7.24.4)': dependencies: @@ -19003,7 +19297,7 @@ snapshots: '@babel/plugin-transform-nullish-coalescing-operator@7.24.1(@babel/core@7.25.8)': dependencies: '@babel/core': 7.25.8 - '@babel/helper-plugin-utils': 7.25.7 + '@babel/helper-plugin-utils': 7.24.0 '@babel/plugin-syntax-nullish-coalescing-operator': 7.8.3(@babel/core@7.25.8) '@babel/plugin-transform-numeric-separator@7.24.1(@babel/core@7.24.4)': @@ -19092,7 +19386,7 @@ snapshots: dependencies: '@babel/core': 7.25.8 '@babel/helper-create-class-features-plugin': 7.24.4(@babel/core@7.25.8) - '@babel/helper-plugin-utils': 7.25.7 + '@babel/helper-plugin-utils': 7.24.0 '@babel/plugin-transform-private-property-in-object@7.24.1(@babel/core@7.24.4)': dependencies: @@ -19439,11 +19733,11 @@ snapshots: '@babel/preset-env@7.24.4(@babel/core@7.25.8)': dependencies: - '@babel/compat-data': 7.24.4 + '@babel/compat-data': 7.25.8 '@babel/core': 7.25.8 - '@babel/helper-compilation-targets': 7.23.6 - '@babel/helper-plugin-utils': 7.24.0 - '@babel/helper-validator-option': 7.23.5 + '@babel/helper-compilation-targets': 7.25.7 + '@babel/helper-plugin-utils': 7.25.7 + '@babel/helper-validator-option': 7.25.7 '@babel/plugin-bugfix-firefox-class-in-computed-class-key': 7.24.4(@babel/core@7.25.8) '@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression': 7.24.1(@babel/core@7.25.8) '@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining': 7.24.1(@babel/core@7.25.8) @@ -20245,15 +20539,22 @@ snapshots: eslint: 8.57.0 eslint-visitor-keys: 3.4.3 + '@eslint-community/eslint-utils@4.4.0(eslint@8.57.1)': + dependencies: + eslint: 8.57.1 + eslint-visitor-keys: 3.4.3 + '@eslint-community/regexpp@4.10.0': {} + '@eslint-community/regexpp@4.11.1': {} + '@eslint/eslintrc@2.1.4': dependencies: ajv: 6.12.6 debug: 4.3.4(supports-color@8.1.1) espree: 9.6.1 globals: 13.24.0 - ignore: 5.3.1 + ignore: 5.3.2 import-fresh: 3.3.0 js-yaml: 4.1.0 minimatch: 3.1.2 @@ -20263,6 +20564,8 @@ snapshots: '@eslint/js@8.57.0': {} + '@eslint/js@8.57.1': {} + '@fal-works/esbuild-plugin-global-externals@2.1.2': {} '@fastify/busboy@2.1.1': {} @@ -20340,6 +20643,14 @@ snapshots: transitivePeerDependencies: - supports-color + '@humanwhocodes/config-array@0.13.0': + dependencies: + '@humanwhocodes/object-schema': 2.0.3 + debug: 4.3.4(supports-color@8.1.1) + minimatch: 3.1.2 + transitivePeerDependencies: + - supports-color + '@humanwhocodes/module-importer@1.0.1': {} '@humanwhocodes/object-schema@2.0.3': {} @@ -20356,7 +20667,7 @@ snapshots: '@internationalized/message@3.1.5': dependencies: - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 intl-messageformat: 10.5.11 '@internationalized/message@3.1.6': @@ -20366,7 +20677,7 @@ snapshots: '@internationalized/number@3.5.4': dependencies: - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 '@internationalized/number@3.6.0': dependencies: @@ -20406,7 +20717,7 @@ snapshots: '@jest/console@26.6.2': dependencies: '@jest/types': 26.6.2 - '@types/node': 20.12.7 + '@types/node': 20.16.10 chalk: 4.1.2 jest-message-util: 26.6.2 jest-util: 26.6.2 @@ -20415,7 +20726,7 @@ snapshots: '@jest/console@29.7.0': dependencies: '@jest/types': 29.6.3 - '@types/node': 20.12.7 + '@types/node': 20.16.10 chalk: 4.1.2 jest-message-util: 29.7.0 jest-util: 29.7.0 @@ -20429,7 +20740,7 @@ snapshots: '@jest/test-result': 26.6.2 '@jest/transform': 26.6.2 '@jest/types': 26.6.2 - '@types/node': 20.12.7 + '@types/node': 20.16.10 ansi-escapes: 4.3.2 chalk: 4.1.2 exit: 0.1.2 @@ -20466,14 +20777,14 @@ snapshots: '@jest/test-result': 29.7.0 '@jest/transform': 29.7.0 '@jest/types': 29.6.3 - '@types/node': 20.12.7 + '@types/node': 20.16.10 ansi-escapes: 4.3.2 chalk: 4.1.2 ci-info: 3.9.0 exit: 0.1.2 graceful-fs: 4.2.11 jest-changed-files: 29.7.0 - jest-config: 29.7.0(@types/node@20.12.7) + jest-config: 29.7.0(@types/node@20.16.10) jest-haste-map: 29.7.0 jest-message-util: 29.7.0 jest-regex-util: 29.6.3 @@ -20499,14 +20810,14 @@ snapshots: dependencies: '@jest/fake-timers': 26.6.2 '@jest/types': 26.6.2 - '@types/node': 20.12.7 + '@types/node': 20.16.10 jest-mock: 26.6.2 '@jest/environment@29.7.0': dependencies: '@jest/fake-timers': 29.7.0 '@jest/types': 29.6.3 - '@types/node': 20.12.7 + '@types/node': 20.16.10 jest-mock: 29.7.0 '@jest/expect-utils@29.7.0': @@ -20524,7 +20835,7 @@ snapshots: dependencies: '@jest/types': 26.6.2 '@sinonjs/fake-timers': 6.0.1 - '@types/node': 20.12.7 + '@types/node': 20.16.10 jest-message-util: 26.6.2 jest-mock: 26.6.2 jest-util: 26.6.2 @@ -20533,7 +20844,7 @@ snapshots: dependencies: '@jest/types': 29.6.3 '@sinonjs/fake-timers': 10.3.0 - '@types/node': 20.12.7 + '@types/node': 20.16.10 jest-message-util: 29.7.0 jest-mock: 29.7.0 jest-util: 29.7.0 @@ -20592,7 +20903,7 @@ snapshots: '@jest/transform': 29.7.0 '@jest/types': 29.6.3 '@jridgewell/trace-mapping': 0.3.25 - '@types/node': 20.12.7 + '@types/node': 20.16.10 chalk: 4.1.2 collect-v8-coverage: 1.0.2 exit: 0.1.2 @@ -20725,7 +21036,7 @@ snapshots: dependencies: '@types/istanbul-lib-coverage': 2.0.6 '@types/istanbul-reports': 3.0.4 - '@types/node': 20.12.7 + '@types/node': 20.16.10 '@types/yargs': 15.0.19 chalk: 4.1.2 @@ -20734,17 +21045,27 @@ snapshots: '@jest/schemas': 29.6.3 '@types/istanbul-lib-coverage': 2.0.6 '@types/istanbul-reports': 3.0.4 - '@types/node': 20.12.7 + '@types/node': 20.16.10 '@types/yargs': 17.0.32 chalk: 4.1.2 - '@joshwooding/vite-plugin-react-docgen-typescript@0.3.0(typescript@5.6.3)(vite@5.4.8(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3))': + '@joshwooding/vite-plugin-react-docgen-typescript@0.3.0(typescript@5.6.3)(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3))': + dependencies: + glob: 7.2.3 + glob-promise: 4.2.2(glob@7.2.3) + magic-string: 0.27.0 + react-docgen-typescript: 2.2.2(typescript@5.6.3) + vite: 5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + optionalDependencies: + typescript: 5.6.3 + + '@joshwooding/vite-plugin-react-docgen-typescript@0.3.0(typescript@5.6.3)(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3))': dependencies: glob: 7.2.3 glob-promise: 4.2.2(glob@7.2.3) magic-string: 0.27.0 react-docgen-typescript: 2.2.2(typescript@5.6.3) - vite: 5.4.8(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + vite: 5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) optionalDependencies: typescript: 5.6.3 @@ -20856,23 +21177,51 @@ snapshots: '@types/react': 18.3.12 react: 18.2.0 - '@microsoft/api-extractor-model@7.28.13(@types/node@20.12.7)': + '@microsoft/api-extractor-model@7.28.13(@types/node@20.16.10)': + dependencies: + '@microsoft/tsdoc': 0.14.2 + '@microsoft/tsdoc-config': 0.16.2 + '@rushstack/node-core-library': 4.0.2(@types/node@20.16.10) + transitivePeerDependencies: + - '@types/node' + optional: true + + '@microsoft/api-extractor-model@7.28.13(@types/node@22.7.4)': + dependencies: + '@microsoft/tsdoc': 0.14.2 + '@microsoft/tsdoc-config': 0.16.2 + '@rushstack/node-core-library': 4.0.2(@types/node@22.7.4) + transitivePeerDependencies: + - '@types/node' + + '@microsoft/api-extractor@7.43.0(@types/node@20.16.10)': dependencies: + '@microsoft/api-extractor-model': 7.28.13(@types/node@20.16.10) '@microsoft/tsdoc': 0.14.2 '@microsoft/tsdoc-config': 0.16.2 - '@rushstack/node-core-library': 4.0.2(@types/node@20.12.7) + '@rushstack/node-core-library': 4.0.2(@types/node@20.16.10) + '@rushstack/rig-package': 0.5.2 + '@rushstack/terminal': 0.10.0(@types/node@20.16.10) + '@rushstack/ts-command-line': 4.19.1(@types/node@20.16.10) + lodash: 4.17.21 + minimatch: 3.0.8 + resolve: 1.22.8 + semver: 7.5.4 + source-map: 0.6.1 + typescript: 5.4.2 transitivePeerDependencies: - '@types/node' + optional: true - '@microsoft/api-extractor@7.43.0(@types/node@20.12.7)': + '@microsoft/api-extractor@7.43.0(@types/node@22.7.4)': dependencies: - '@microsoft/api-extractor-model': 7.28.13(@types/node@20.12.7) + '@microsoft/api-extractor-model': 7.28.13(@types/node@22.7.4) '@microsoft/tsdoc': 0.14.2 '@microsoft/tsdoc-config': 0.16.2 - '@rushstack/node-core-library': 4.0.2(@types/node@20.12.7) + '@rushstack/node-core-library': 4.0.2(@types/node@22.7.4) '@rushstack/rig-package': 0.5.2 - '@rushstack/terminal': 0.10.0(@types/node@20.12.7) - '@rushstack/ts-command-line': 4.19.1(@types/node@20.12.7) + '@rushstack/terminal': 0.10.0(@types/node@22.7.4) + '@rushstack/ts-command-line': 4.19.1(@types/node@22.7.4) lodash: 4.17.21 minimatch: 3.0.8 resolve: 1.22.8 @@ -21456,12 +21805,33 @@ snapshots: '@popperjs/core@2.11.8': {} - '@preact/preset-vite@2.8.2(@babel/core@7.25.8)(vite@5.4.8(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3))': + '@preact/preset-vite@2.8.2(@babel/core@7.25.8)(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3))': + dependencies: + '@babel/core': 7.25.8 + '@babel/plugin-transform-react-jsx': 7.23.4(@babel/core@7.25.8) + '@babel/plugin-transform-react-jsx-development': 7.22.5(@babel/core@7.25.8) + '@prefresh/vite': 2.4.5(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)) + '@rollup/pluginutils': 4.2.1 + babel-plugin-transform-hook-names: 1.0.2(@babel/core@7.25.8) + debug: 4.3.4(supports-color@8.1.1) + kolorist: 1.8.0 + magic-string: 0.30.5 + node-html-parser: 6.1.13 + resolve: 1.22.8 + source-map: 0.7.4 + stack-trace: 1.0.0-pre2 + vite: 5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + transitivePeerDependencies: + - preact + - supports-color + optional: true + + '@preact/preset-vite@2.8.2(@babel/core@7.25.8)(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3))': dependencies: '@babel/core': 7.25.8 '@babel/plugin-transform-react-jsx': 7.23.4(@babel/core@7.25.8) '@babel/plugin-transform-react-jsx-development': 7.22.5(@babel/core@7.25.8) - '@prefresh/vite': 2.4.5(vite@5.4.8(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)) + '@prefresh/vite': 2.4.5(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3)) '@rollup/pluginutils': 4.2.1 babel-plugin-transform-hook-names: 1.0.2(@babel/core@7.25.8) debug: 4.3.4(supports-color@8.1.1) @@ -21471,7 +21841,7 @@ snapshots: resolve: 1.22.8 source-map: 0.7.4 stack-trace: 1.0.0-pre2 - vite: 5.4.8(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + vite: 5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) transitivePeerDependencies: - preact - supports-color @@ -21486,14 +21856,26 @@ snapshots: '@prefresh/utils@1.2.0': optional: true - '@prefresh/vite@2.4.5(vite@5.4.8(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3))': + '@prefresh/vite@2.4.5(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3))': + dependencies: + '@babel/core': 7.25.8 + '@prefresh/babel-plugin': 0.5.1 + '@prefresh/core': 1.5.2 + '@prefresh/utils': 1.2.0 + '@rollup/pluginutils': 4.2.1 + vite: 5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + transitivePeerDependencies: + - supports-color + optional: true + + '@prefresh/vite@2.4.5(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3))': dependencies: '@babel/core': 7.25.8 '@prefresh/babel-plugin': 0.5.1 '@prefresh/core': 1.5.2 '@prefresh/utils': 1.2.0 '@rollup/pluginutils': 4.2.1 - vite: 5.4.8(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + vite: 5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) transitivePeerDependencies: - supports-color optional: true @@ -21536,7 +21918,7 @@ snapshots: '@react-stately/tree': 3.8.5(react@18.2.0) '@react-types/accordion': 3.0.0-alpha.24(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 react-dom: 18.2.0(react@18.2.0) @@ -21547,7 +21929,7 @@ snapshots: '@react-aria/utils': 3.26.0(react@18.2.0) '@react-types/breadcrumbs': 3.7.8(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 '@react-aria/breadcrumbs@3.5.19(react@18.2.0)': @@ -21568,7 +21950,7 @@ snapshots: '@react-stately/toggle': 3.7.8(react@18.2.0) '@react-types/button': 3.10.0(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 '@react-aria/button@3.11.0(react@18.2.0)': @@ -21594,7 +21976,7 @@ snapshots: '@react-types/button': 3.10.0(react@18.2.0) '@react-types/calendar': 3.4.10(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 react-dom: 18.2.0(react@18.2.0) @@ -21625,7 +22007,7 @@ snapshots: '@react-stately/toggle': 3.7.8(react@18.2.0) '@react-types/checkbox': 3.8.4(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 '@react-aria/checkbox@3.15.0(react@18.2.0)': @@ -21677,7 +22059,7 @@ snapshots: '@react-stately/form': 3.0.6(react@18.2.0) '@react-types/color': 3.0.0(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 react-dom: 18.2.0(react@18.2.0) @@ -21715,7 +22097,7 @@ snapshots: '@react-types/button': 3.10.0(react@18.2.0) '@react-types/combobox': 3.13.0(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 react-dom: 18.2.0(react@18.2.0) @@ -21758,7 +22140,7 @@ snapshots: '@react-types/datepicker': 3.8.3(react@18.2.0) '@react-types/dialog': 3.5.13(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 react-dom: 18.2.0(react@18.2.0) @@ -21792,7 +22174,7 @@ snapshots: '@react-aria/utils': 3.26.0(react@18.2.0) '@react-types/dialog': 3.5.13(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 react-dom: 18.2.0(react@18.2.0) @@ -21828,7 +22210,7 @@ snapshots: '@react-stately/tree': 3.8.5(react@18.2.0) '@react-types/button': 3.10.0(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 react-dom: 18.2.0(react@18.2.0) @@ -21867,7 +22249,7 @@ snapshots: '@react-aria/interactions': 3.22.3(react@18.2.0) '@react-aria/utils': 3.26.0(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 clsx: 2.1.1 react: 18.2.0 @@ -21876,7 +22258,7 @@ snapshots: '@react-aria/interactions': 3.22.5(react@18.2.0) '@react-aria/utils': 3.26.0(react@18.2.0) '@react-types/shared': 3.26.0(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 clsx: 2.1.1 react: 18.2.0 @@ -21895,7 +22277,7 @@ snapshots: '@react-aria/utils': 3.26.0(react@18.2.0) '@react-stately/form': 3.0.6(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 '@react-aria/grid@3.10.4(react-dom@18.2.0(react@18.2.0))(react@18.2.0)': @@ -21912,7 +22294,7 @@ snapshots: '@react-types/checkbox': 3.8.4(react@18.2.0) '@react-types/grid': 3.2.9(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 react-dom: 18.2.0(react@18.2.0) @@ -21962,7 +22344,7 @@ snapshots: '@react-stately/list': 3.11.0(react@18.2.0) '@react-stately/tree': 3.8.5(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 react-dom: 18.2.0(react@18.2.0) @@ -21975,7 +22357,7 @@ snapshots: '@react-aria/ssr': 3.9.6(react@18.2.0) '@react-aria/utils': 3.26.0(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 '@react-aria/i18n@3.12.4(react@18.2.0)': @@ -22010,7 +22392,7 @@ snapshots: dependencies: '@react-aria/utils': 3.26.0(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 '@react-aria/label@3.7.13(react@18.2.0)': @@ -22027,7 +22409,7 @@ snapshots: '@react-aria/utils': 3.26.0(react@18.2.0) '@react-types/link': 3.5.8(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 '@react-aria/link@3.7.7(react@18.2.0)': @@ -22050,7 +22432,7 @@ snapshots: '@react-stately/list': 3.11.0(react@18.2.0) '@react-types/listbox': 3.5.2(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 react-dom: 18.2.0(react@18.2.0) @@ -22118,7 +22500,7 @@ snapshots: '@react-aria/progress': 3.4.17(react@18.2.0) '@react-types/meter': 3.4.4(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 '@react-aria/meter@3.4.18(react@18.2.0)': @@ -22141,7 +22523,7 @@ snapshots: '@react-types/button': 3.10.0(react@18.2.0) '@react-types/numberfield': 3.8.6(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 react-dom: 18.2.0(react@18.2.0) @@ -22173,7 +22555,7 @@ snapshots: '@react-types/button': 3.10.0(react@18.2.0) '@react-types/overlays': 3.8.10(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 react-dom: 18.2.0(react@18.2.0) @@ -22200,7 +22582,7 @@ snapshots: '@react-aria/utils': 3.26.0(react@18.2.0) '@react-types/progress': 3.5.7(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 '@react-aria/progress@3.4.18(react@18.2.0)': @@ -22238,7 +22620,7 @@ snapshots: '@react-stately/radio': 3.10.8(react@18.2.0) '@react-types/radio': 3.8.4(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 '@react-aria/searchfield@3.7.11(react@18.2.0)': @@ -22262,7 +22644,7 @@ snapshots: '@react-types/button': 3.10.0(react@18.2.0) '@react-types/searchfield': 3.5.9(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 '@react-aria/select@3.14.10(react-dom@18.2.0(react@18.2.0))(react@18.2.0)': @@ -22280,7 +22662,7 @@ snapshots: '@react-types/button': 3.10.0(react@18.2.0) '@react-types/select': 3.9.7(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 react-dom: 18.2.0(react@18.2.0) @@ -22311,7 +22693,7 @@ snapshots: '@react-aria/utils': 3.26.0(react@18.2.0) '@react-stately/selection': 3.17.0(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 react-dom: 18.2.0(react@18.2.0) @@ -22331,7 +22713,7 @@ snapshots: dependencies: '@react-aria/utils': 3.26.0(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 '@react-aria/separator@3.4.4(react@18.2.0)': @@ -22351,7 +22733,7 @@ snapshots: '@react-stately/slider': 3.5.8(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) '@react-types/slider': 3.7.6(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 '@react-aria/slider@3.7.14(react@18.2.0)': @@ -22385,13 +22767,13 @@ snapshots: '@react-aria/utils': 3.26.0(react@18.2.0) '@react-types/button': 3.10.0(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 react-dom: 18.2.0(react@18.2.0) '@react-aria/ssr@3.9.6(react@18.2.0)': dependencies: - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 '@react-aria/ssr@3.9.7(react@18.2.0)': @@ -22414,7 +22796,7 @@ snapshots: '@react-stately/toggle': 3.7.8(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) '@react-types/switch': 3.5.6(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 '@react-aria/table@3.15.4(react-dom@18.2.0(react@18.2.0))(react@18.2.0)': @@ -22433,7 +22815,7 @@ snapshots: '@react-types/grid': 3.2.9(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) '@react-types/table': 3.10.2(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 react-dom: 18.2.0(react@18.2.0) @@ -22466,7 +22848,7 @@ snapshots: '@react-stately/tabs': 3.6.10(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) '@react-types/tabs': 3.3.10(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 react-dom: 18.2.0(react@18.2.0) @@ -22494,7 +22876,7 @@ snapshots: '@react-stately/list': 3.11.0(react@18.2.0) '@react-types/button': 3.10.0(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 react-dom: 18.2.0(react@18.2.0) @@ -22523,7 +22905,7 @@ snapshots: '@react-stately/utils': 3.10.4(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) '@react-types/textfield': 3.9.7(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 '@react-aria/textfield@3.15.0(react@18.2.0)': @@ -22558,7 +22940,7 @@ snapshots: '@react-stately/toggle': 3.7.8(react@18.2.0) '@react-types/checkbox': 3.8.4(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 '@react-aria/toolbar@3.0.0-beta.11(react@18.2.0)': @@ -22576,7 +22958,7 @@ snapshots: '@react-aria/i18n': 3.12.3(react@18.2.0) '@react-aria/utils': 3.26.0(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 '@react-aria/tooltip@3.7.10(react@18.2.0)': @@ -22598,7 +22980,7 @@ snapshots: '@react-stately/tooltip': 3.4.13(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) '@react-types/tooltip': 3.4.12(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 '@react-aria/tree@3.0.0-beta.0(react-dom@18.2.0(react@18.2.0))(react@18.2.0)': @@ -22610,7 +22992,7 @@ snapshots: '@react-stately/tree': 3.8.5(react@18.2.0) '@react-types/button': 3.10.0(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 react-dom: 18.2.0(react@18.2.0) @@ -22672,7 +23054,7 @@ snapshots: '@react-aria/interactions': 3.22.3(react@18.2.0) '@react-aria/utils': 3.26.0(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 '@react-aria/visually-hidden@3.8.18(react@18.2.0)': @@ -22683,7 +23065,7 @@ snapshots: '@swc/helpers': 0.5.10 react: 18.2.0 - '@react-router/dev@7.0.0-pre.4(@react-router/serve@7.0.0-pre.4(react-router@7.0.0-pre.4(react-dom@18.2.0(react@18.2.0))(react@18.2.0))(typescript@5.6.3))(@types/node@20.12.7)(babel-plugin-macros@3.1.0)(less@3.11.1)(lightningcss@1.24.1)(react-router@7.0.0-pre.4(react-dom@18.2.0(react@18.2.0))(react@18.2.0))(sass@1.75.0)(terser@5.30.3)(typescript@5.6.3)(vite@5.4.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3))': + '@react-router/dev@7.0.0-pre.4(@react-router/serve@7.0.0-pre.4(react-router@7.0.0-pre.4(react-dom@18.2.0(react@18.2.0))(react@18.2.0))(typescript@5.6.3))(@types/node@22.7.4)(babel-plugin-macros@3.1.0)(less@3.11.1)(lightningcss@1.28.1)(react-router@7.0.0-pre.4(react-dom@18.2.0(react@18.2.0))(react@18.2.0))(sass@1.75.0)(terser@5.30.3)(typescript@5.6.3)(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3))': dependencies: '@babel/core': 7.25.8 '@babel/generator': 7.25.7 @@ -22715,8 +23097,8 @@ snapshots: semver: 7.6.3 set-cookie-parser: 2.6.0 valibot: 0.41.0(typescript@5.6.3) - vite: 5.4.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) - vite-node: 1.6.0(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + vite: 5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) + vite-node: 1.6.0(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) optionalDependencies: '@react-router/serve': 7.0.0-pre.4(react-router@7.0.0-pre.4(react-dom@18.2.0(react@18.2.0))(react@18.2.0))(typescript@5.6.3) typescript: 5.6.3 @@ -22781,7 +23163,7 @@ snapshots: '@react-stately/utils': 3.10.4(react@18.2.0) '@react-types/calendar': 3.4.10(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 '@react-stately/calendar@3.6.0(react@18.2.0)': @@ -22808,13 +23190,13 @@ snapshots: '@react-stately/utils': 3.10.4(react@18.2.0) '@react-types/checkbox': 3.8.4(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 '@react-stately/collections@3.11.0(react@18.2.0)': dependencies: '@react-types/shared': 3.25.0(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 '@react-stately/collections@3.12.0(react@18.2.0)': @@ -22861,7 +23243,7 @@ snapshots: '@react-stately/utils': 3.10.4(react@18.2.0) '@react-types/combobox': 3.13.0(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 '@react-stately/combobox@3.10.1(react@18.2.0)': @@ -22880,7 +23262,7 @@ snapshots: '@react-stately/data@3.11.7(react@18.2.0)': dependencies: '@react-types/shared': 3.25.0(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 '@react-stately/data@3.12.0(react@18.2.0)': @@ -22898,7 +23280,7 @@ snapshots: '@react-stately/utils': 3.10.4(react@18.2.0) '@react-types/datepicker': 3.8.3(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 '@react-stately/datepicker@3.11.0(react@18.2.0)': @@ -22931,7 +23313,7 @@ snapshots: dependencies: '@react-stately/selection': 3.17.0(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 '@react-stately/dnd@3.5.0(react@18.2.0)': @@ -22943,7 +23325,7 @@ snapshots: '@react-stately/flags@3.0.4': dependencies: - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 '@react-stately/flags@3.0.5': dependencies: @@ -22952,7 +23334,7 @@ snapshots: '@react-stately/form@3.0.6(react@18.2.0)': dependencies: '@react-types/shared': 3.25.0(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 '@react-stately/form@3.1.0(react@18.2.0)': @@ -22976,7 +23358,7 @@ snapshots: '@react-stately/selection': 3.17.0(react@18.2.0) '@react-types/grid': 3.2.9(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 '@react-stately/layout@4.0.3(react@18.2.0)': @@ -23007,7 +23389,7 @@ snapshots: '@react-stately/selection': 3.17.0(react@18.2.0) '@react-stately/utils': 3.10.4(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 '@react-stately/list@3.11.1(react@18.2.0)': @@ -23024,7 +23406,7 @@ snapshots: '@react-stately/overlays': 3.6.11(react@18.2.0) '@react-types/menu': 3.9.12(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 '@react-stately/menu@3.9.0(react@18.2.0)': @@ -23041,7 +23423,7 @@ snapshots: '@react-stately/form': 3.0.6(react@18.2.0) '@react-stately/utils': 3.10.4(react@18.2.0) '@react-types/numberfield': 3.8.6(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 '@react-stately/numberfield@3.9.8(react@18.2.0)': @@ -23057,7 +23439,7 @@ snapshots: dependencies: '@react-stately/utils': 3.10.4(react@18.2.0) '@react-types/overlays': 3.8.10(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 '@react-stately/overlays@3.6.12(react@18.2.0)': @@ -23073,7 +23455,7 @@ snapshots: '@react-stately/utils': 3.10.4(react@18.2.0) '@react-types/radio': 3.8.4(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 '@react-stately/radio@3.10.9(react@18.2.0)': @@ -23089,7 +23471,7 @@ snapshots: dependencies: '@react-stately/utils': 3.10.4(react@18.2.0) '@react-types/searchfield': 3.5.9(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 '@react-stately/searchfield@3.5.8(react@18.2.0)': @@ -23106,7 +23488,7 @@ snapshots: '@react-stately/overlays': 3.6.11(react@18.2.0) '@react-types/select': 3.9.7(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 '@react-stately/select@3.6.9(react@18.2.0)': @@ -23124,7 +23506,7 @@ snapshots: '@react-stately/collections': 3.11.0(react@18.2.0) '@react-stately/utils': 3.10.4(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 '@react-stately/selection@3.18.0(react@18.2.0)': @@ -23140,7 +23522,7 @@ snapshots: '@react-stately/utils': 3.10.4(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) '@react-types/slider': 3.7.6(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 '@react-stately/slider@3.6.0(react@18.2.0)': @@ -23182,7 +23564,7 @@ snapshots: '@react-stately/list': 3.11.0(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) '@react-types/tabs': 3.3.10(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 '@react-stately/tabs@3.7.0(react@18.2.0)': @@ -23197,7 +23579,7 @@ snapshots: dependencies: '@react-stately/utils': 3.10.4(react@18.2.0) '@react-types/checkbox': 3.8.4(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 '@react-stately/toggle@3.8.0(react@18.2.0)': @@ -23212,7 +23594,7 @@ snapshots: dependencies: '@react-stately/overlays': 3.6.11(react@18.2.0) '@react-types/tooltip': 3.4.12(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 '@react-stately/tooltip@3.5.0(react@18.2.0)': @@ -23228,7 +23610,7 @@ snapshots: '@react-stately/selection': 3.17.0(react@18.2.0) '@react-stately/utils': 3.10.4(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 '@react-stately/tree@3.8.6(react@18.2.0)': @@ -23242,7 +23624,7 @@ snapshots: '@react-stately/utils@3.10.4(react@18.2.0)': dependencies: - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 react: 18.2.0 '@react-stately/utils@3.10.5(react@18.2.0)': @@ -23571,7 +23953,7 @@ snapshots: '@remix-run/css-bundle@2.13.1': {} - '@remix-run/dev@2.13.1(@remix-run/react@2.13.1(react-dom@18.2.0(react@18.2.0))(react@18.2.0)(typescript@5.6.3))(@remix-run/serve@2.13.1(typescript@5.6.3))(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)(typescript@5.6.3)(vite@5.4.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3))': + '@remix-run/dev@2.13.1(@remix-run/react@2.13.1(react-dom@18.2.0(react@18.2.0))(react@18.2.0)(typescript@5.6.3))(@remix-run/serve@2.13.1(typescript@5.6.3))(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3)(typescript@5.6.3)(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3))': dependencies: '@babel/core': 7.24.4 '@babel/generator': 7.24.4 @@ -23588,7 +23970,7 @@ snapshots: '@remix-run/router': 1.20.0 '@remix-run/server-runtime': 2.13.1(typescript@5.6.3) '@types/mdx': 2.0.13 - '@vanilla-extract/integration': 6.5.0(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + '@vanilla-extract/integration': 6.5.0(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) arg: 5.0.2 cacache: 17.1.4 chalk: 4.1.2 @@ -23630,7 +24012,7 @@ snapshots: optionalDependencies: '@remix-run/serve': 2.13.1(typescript@5.6.3) typescript: 5.6.3 - vite: 5.4.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + vite: 5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) transitivePeerDependencies: - '@types/node' - bluebird @@ -23750,7 +24132,7 @@ snapshots: '@rollup/plugin-commonjs@25.0.8(rollup@4.24.0)': dependencies: - '@rollup/pluginutils': 5.1.0(rollup@4.24.0) + '@rollup/pluginutils': 5.1.2(rollup@4.24.0) commondir: 1.0.1 estree-walker: 2.0.2 glob: 8.1.0 @@ -23761,7 +24143,7 @@ snapshots: '@rollup/plugin-inject@5.0.5(rollup@4.24.0)': dependencies: - '@rollup/pluginutils': 5.1.0(rollup@4.24.0) + '@rollup/pluginutils': 5.1.2(rollup@4.24.0) estree-walker: 2.0.2 magic-string: 0.30.11 optionalDependencies: @@ -23769,13 +24151,13 @@ snapshots: '@rollup/plugin-json@6.1.0(rollup@4.24.0)': dependencies: - '@rollup/pluginutils': 5.1.0(rollup@4.24.0) + '@rollup/pluginutils': 5.1.2(rollup@4.24.0) optionalDependencies: rollup: 4.24.0 '@rollup/plugin-node-resolve@15.2.3(rollup@4.24.0)': dependencies: - '@rollup/pluginutils': 5.1.0(rollup@4.24.0) + '@rollup/pluginutils': 5.1.2(rollup@4.24.0) '@types/resolve': 1.20.2 deepmerge: 4.3.1 is-builtin-module: 3.2.1 @@ -23786,7 +24168,7 @@ snapshots: '@rollup/plugin-replace@5.0.7(rollup@4.24.0)': dependencies: - '@rollup/pluginutils': 5.1.0(rollup@4.24.0) + '@rollup/pluginutils': 5.1.2(rollup@4.24.0) magic-string: 0.30.11 optionalDependencies: rollup: 4.24.0 @@ -23820,105 +24202,57 @@ snapshots: optionalDependencies: rollup: 4.24.0 - '@rollup/rollup-android-arm-eabi@4.14.3': - optional: true - '@rollup/rollup-android-arm-eabi@4.24.0': optional: true - '@rollup/rollup-android-arm64@4.14.3': - optional: true - '@rollup/rollup-android-arm64@4.24.0': optional: true - '@rollup/rollup-darwin-arm64@4.14.3': - optional: true - '@rollup/rollup-darwin-arm64@4.24.0': optional: true - '@rollup/rollup-darwin-x64@4.14.3': - optional: true - '@rollup/rollup-darwin-x64@4.24.0': optional: true - '@rollup/rollup-linux-arm-gnueabihf@4.14.3': - optional: true - '@rollup/rollup-linux-arm-gnueabihf@4.24.0': optional: true - '@rollup/rollup-linux-arm-musleabihf@4.14.3': - optional: true - '@rollup/rollup-linux-arm-musleabihf@4.24.0': optional: true - '@rollup/rollup-linux-arm64-gnu@4.14.3': - optional: true - '@rollup/rollup-linux-arm64-gnu@4.24.0': optional: true - '@rollup/rollup-linux-arm64-musl@4.14.3': - optional: true - '@rollup/rollup-linux-arm64-musl@4.24.0': optional: true - '@rollup/rollup-linux-powerpc64le-gnu@4.14.3': - optional: true - '@rollup/rollup-linux-powerpc64le-gnu@4.24.0': optional: true - '@rollup/rollup-linux-riscv64-gnu@4.14.3': - optional: true - '@rollup/rollup-linux-riscv64-gnu@4.24.0': optional: true - '@rollup/rollup-linux-s390x-gnu@4.14.3': - optional: true - '@rollup/rollup-linux-s390x-gnu@4.24.0': optional: true - '@rollup/rollup-linux-x64-gnu@4.14.3': - optional: true - '@rollup/rollup-linux-x64-gnu@4.24.0': optional: true - '@rollup/rollup-linux-x64-musl@4.14.3': - optional: true - '@rollup/rollup-linux-x64-musl@4.24.0': optional: true - '@rollup/rollup-win32-arm64-msvc@4.14.3': - optional: true - '@rollup/rollup-win32-arm64-msvc@4.24.0': optional: true - '@rollup/rollup-win32-ia32-msvc@4.14.3': - optional: true - '@rollup/rollup-win32-ia32-msvc@4.24.0': optional: true - '@rollup/rollup-win32-x64-msvc@4.14.3': - optional: true - '@rollup/rollup-win32-x64-msvc@4.24.0': optional: true '@rushstack/eslint-patch@1.10.2': {} - '@rushstack/node-core-library@4.0.2(@types/node@20.12.7)': + '@rushstack/node-core-library@4.0.2(@types/node@20.16.10)': dependencies: fs-extra: 7.0.1 import-lazy: 4.0.0 @@ -23927,23 +24261,53 @@ snapshots: semver: 7.5.4 z-schema: 5.0.5 optionalDependencies: - '@types/node': 20.12.7 + '@types/node': 20.16.10 + optional: true + + '@rushstack/node-core-library@4.0.2(@types/node@22.7.4)': + dependencies: + fs-extra: 7.0.1 + import-lazy: 4.0.0 + jju: 1.4.0 + resolve: 1.22.8 + semver: 7.5.4 + z-schema: 5.0.5 + optionalDependencies: + '@types/node': 22.7.4 '@rushstack/rig-package@0.5.2': dependencies: resolve: 1.22.8 strip-json-comments: 3.1.1 - '@rushstack/terminal@0.10.0(@types/node@20.12.7)': + '@rushstack/terminal@0.10.0(@types/node@20.16.10)': + dependencies: + '@rushstack/node-core-library': 4.0.2(@types/node@20.16.10) + supports-color: 8.1.1 + optionalDependencies: + '@types/node': 20.16.10 + optional: true + + '@rushstack/terminal@0.10.0(@types/node@22.7.4)': dependencies: - '@rushstack/node-core-library': 4.0.2(@types/node@20.12.7) + '@rushstack/node-core-library': 4.0.2(@types/node@22.7.4) supports-color: 8.1.1 optionalDependencies: - '@types/node': 20.12.7 + '@types/node': 22.7.4 + + '@rushstack/ts-command-line@4.19.1(@types/node@20.16.10)': + dependencies: + '@rushstack/terminal': 0.10.0(@types/node@20.16.10) + '@types/argparse': 1.0.38 + argparse: 1.0.10 + string-argv: 0.3.2 + transitivePeerDependencies: + - '@types/node' + optional: true - '@rushstack/ts-command-line@4.19.1(@types/node@20.12.7)': + '@rushstack/ts-command-line@4.19.1(@types/node@22.7.4)': dependencies: - '@rushstack/terminal': 0.10.0(@types/node@20.12.7) + '@rushstack/terminal': 0.10.0(@types/node@22.7.4) '@types/argparse': 1.0.38 argparse: 1.0.10 string-argv: 0.3.2 @@ -24059,6 +24423,18 @@ snapshots: - react-dom - supports-color + '@storybook/addon-controls@8.0.8(@types/react@18.3.12)(encoding@0.1.13)(react-dom@18.2.0(react@18.2.0))(react@18.2.0)': + dependencies: + '@storybook/blocks': 8.0.8(@types/react@18.3.12)(encoding@0.1.13)(react-dom@18.2.0(react@18.2.0))(react@18.2.0) + lodash: 4.17.21 + ts-dedent: 2.2.0 + transitivePeerDependencies: + - '@types/react' + - encoding + - react + - react-dom + - supports-color + '@storybook/addon-docs@8.0.8(encoding@0.1.13)': dependencies: '@babel/core': 7.24.4 @@ -24108,15 +24484,53 @@ snapshots: - react-dom - supports-color + '@storybook/addon-essentials@8.0.8(@types/react@18.3.12)(encoding@0.1.13)(react-dom@18.2.0(react@18.2.0))(react@18.2.0)': + dependencies: + '@storybook/addon-actions': 8.0.8 + '@storybook/addon-backgrounds': 8.0.8 + '@storybook/addon-controls': 8.0.8(@types/react@18.3.12)(encoding@0.1.13)(react-dom@18.2.0(react@18.2.0))(react@18.2.0) + '@storybook/addon-docs': 8.0.8(encoding@0.1.13) + '@storybook/addon-highlight': 8.0.8 + '@storybook/addon-measure': 8.0.8 + '@storybook/addon-outline': 8.0.8 + '@storybook/addon-toolbars': 8.0.8 + '@storybook/addon-viewport': 8.0.8 + '@storybook/core-common': 8.0.8(encoding@0.1.13) + '@storybook/manager-api': 8.0.8(react-dom@18.2.0(react@18.2.0))(react@18.2.0) + '@storybook/node-logger': 8.0.8 + '@storybook/preview-api': 8.0.8 + ts-dedent: 2.2.0 + transitivePeerDependencies: + - '@types/react' + - encoding + - react + - react-dom + - supports-color + '@storybook/addon-highlight@8.0.8': dependencies: '@storybook/global': 5.0.0 - '@storybook/addon-interactions@8.0.8(@jest/globals@29.7.0)(@types/jest@29.5.12)(jest@29.7.0(@types/node@20.12.7))(vitest@2.1.3(@types/node@20.12.7)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3))': + '@storybook/addon-interactions@8.0.8(@jest/globals@29.7.0)(@types/jest@29.5.12)(jest@29.7.0(@types/node@22.7.4))(vitest@2.1.3(@types/node@22.7.4)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3))': dependencies: '@storybook/global': 5.0.0 '@storybook/instrumenter': 8.0.8 - '@storybook/test': 8.0.8(@jest/globals@29.7.0)(@types/jest@29.5.12)(jest@29.7.0(@types/node@20.12.7))(vitest@2.1.3(@types/node@20.12.7)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)) + '@storybook/test': 8.0.8(@jest/globals@29.7.0)(@types/jest@29.5.12)(jest@29.7.0(@types/node@22.7.4))(vitest@2.1.3(@types/node@22.7.4)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)) + '@storybook/types': 8.0.8 + polished: 4.3.1 + ts-dedent: 2.2.0 + transitivePeerDependencies: + - '@jest/globals' + - '@types/bun' + - '@types/jest' + - jest + - vitest + + '@storybook/addon-interactions@8.0.8(@jest/globals@29.7.0)(@types/jest@29.5.12)(jest@29.7.0(@types/node@22.7.4))(vitest@2.1.3(@types/node@22.7.4)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3))': + dependencies: + '@storybook/global': 5.0.0 + '@storybook/instrumenter': 8.0.8 + '@storybook/test': 8.0.8(@jest/globals@29.7.0)(@types/jest@29.5.12)(jest@29.7.0(@types/node@22.7.4))(vitest@2.1.3(@types/node@22.7.4)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3)) '@storybook/types': 8.0.8 polished: 4.3.1 ts-dedent: 2.2.0 @@ -24255,7 +24669,34 @@ snapshots: - encoding - supports-color - '@storybook/builder-vite@8.0.8(@preact/preset-vite@2.8.2(@babel/core@7.25.8)(vite@5.4.8(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)))(encoding@0.1.13)(typescript@5.6.3)(vite@5.4.8(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3))': + '@storybook/builder-vite@8.0.8(@preact/preset-vite@2.8.2(@babel/core@7.25.8)(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)))(encoding@0.1.13)(typescript@5.6.3)(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3))': + dependencies: + '@storybook/channels': 8.0.8 + '@storybook/client-logger': 8.0.8 + '@storybook/core-common': 8.0.8(encoding@0.1.13) + '@storybook/core-events': 8.0.8 + '@storybook/csf-plugin': 8.0.8 + '@storybook/node-logger': 8.0.8 + '@storybook/preview': 8.0.8 + '@storybook/preview-api': 8.0.8 + '@storybook/types': 8.0.8 + '@types/find-cache-dir': 3.2.1 + browser-assert: 1.2.1 + es-module-lexer: 0.9.3 + express: 4.19.2 + find-cache-dir: 3.3.2 + fs-extra: 11.2.0 + magic-string: 0.30.11 + ts-dedent: 2.2.0 + vite: 5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + optionalDependencies: + '@preact/preset-vite': 2.8.2(@babel/core@7.25.8)(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)) + typescript: 5.6.3 + transitivePeerDependencies: + - encoding + - supports-color + + '@storybook/builder-vite@8.0.8(@preact/preset-vite@2.8.2(@babel/core@7.25.8)(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3)))(encoding@0.1.13)(typescript@5.6.3)(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3))': dependencies: '@storybook/channels': 8.0.8 '@storybook/client-logger': 8.0.8 @@ -24274,9 +24715,9 @@ snapshots: fs-extra: 11.2.0 magic-string: 0.30.11 ts-dedent: 2.2.0 - vite: 5.4.8(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + vite: 5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) optionalDependencies: - '@preact/preset-vite': 2.8.2(@babel/core@7.25.8)(vite@5.4.8(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)) + '@preact/preset-vite': 2.8.2(@babel/core@7.25.8)(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3)) typescript: 5.6.3 transitivePeerDependencies: - encoding @@ -24304,7 +24745,7 @@ snapshots: fork-ts-checker-webpack-plugin: 8.0.0(typescript@5.6.3)(webpack@5.90.1(esbuild@0.20.2)) fs-extra: 11.2.0 html-webpack-plugin: 5.5.0(webpack@5.90.1(esbuild@0.20.2)) - magic-string: 0.30.10 + magic-string: 0.30.11 path-browserify: 1.0.1 process: 0.11.10 semver: 7.6.3 @@ -24465,7 +24906,7 @@ snapshots: pkg-dir: 5.0.0 pretty-hrtime: 1.0.3 resolve-from: 5.0.0 - semver: 7.6.0 + semver: 7.6.3 tempy: 1.0.1 tiny-invariant: 1.3.3 ts-dedent: 2.2.0 @@ -24639,7 +25080,7 @@ snapshots: '@types/semver': 7.5.8 find-up: 5.0.0 fs-extra: 11.2.0 - magic-string: 0.30.10 + magic-string: 0.30.11 react: 18.2.0 react-docgen: 7.0.3 react-dom: 18.2.0(react@18.2.0) @@ -24695,21 +25136,44 @@ snapshots: react: 18.2.0 react-dom: 18.2.0(react@18.2.0) - '@storybook/react-vite@8.0.8(@preact/preset-vite@2.8.2(@babel/core@7.25.8)(vite@5.4.8(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)))(encoding@0.1.13)(react-dom@18.2.0(react@18.2.0))(react@18.2.0)(rollup@4.24.0)(typescript@5.6.3)(vite@5.4.8(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3))': + '@storybook/react-vite@8.0.8(@preact/preset-vite@2.8.2(@babel/core@7.25.8)(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)))(encoding@0.1.13)(react-dom@18.2.0(react@18.2.0))(react@18.2.0)(rollup@4.24.0)(typescript@5.6.3)(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3))': dependencies: - '@joshwooding/vite-plugin-react-docgen-typescript': 0.3.0(typescript@5.6.3)(vite@5.4.8(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)) - '@rollup/pluginutils': 5.1.0(rollup@4.24.0) - '@storybook/builder-vite': 8.0.8(@preact/preset-vite@2.8.2(@babel/core@7.25.8)(vite@5.4.8(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)))(encoding@0.1.13)(typescript@5.6.3)(vite@5.4.8(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)) + '@joshwooding/vite-plugin-react-docgen-typescript': 0.3.0(typescript@5.6.3)(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)) + '@rollup/pluginutils': 5.1.2(rollup@4.24.0) + '@storybook/builder-vite': 8.0.8(@preact/preset-vite@2.8.2(@babel/core@7.25.8)(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)))(encoding@0.1.13)(typescript@5.6.3)(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)) '@storybook/node-logger': 8.0.8 '@storybook/react': 8.0.8(encoding@0.1.13)(react-dom@18.2.0(react@18.2.0))(react@18.2.0)(typescript@5.6.3) find-up: 5.0.0 - magic-string: 0.30.10 + magic-string: 0.30.11 + react: 18.2.0 + react-docgen: 7.0.3 + react-dom: 18.2.0(react@18.2.0) + resolve: 1.22.8 + tsconfig-paths: 4.2.0 + vite: 5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + transitivePeerDependencies: + - '@preact/preset-vite' + - encoding + - rollup + - supports-color + - typescript + - vite-plugin-glimmerx + + '@storybook/react-vite@8.0.8(@preact/preset-vite@2.8.2(@babel/core@7.25.8)(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3)))(encoding@0.1.13)(react-dom@18.2.0(react@18.2.0))(react@18.2.0)(rollup@4.24.0)(typescript@5.6.3)(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3))': + dependencies: + '@joshwooding/vite-plugin-react-docgen-typescript': 0.3.0(typescript@5.6.3)(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3)) + '@rollup/pluginutils': 5.1.2(rollup@4.24.0) + '@storybook/builder-vite': 8.0.8(@preact/preset-vite@2.8.2(@babel/core@7.25.8)(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3)))(encoding@0.1.13)(typescript@5.6.3)(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3)) + '@storybook/node-logger': 8.0.8 + '@storybook/react': 8.0.8(encoding@0.1.13)(react-dom@18.2.0(react@18.2.0))(react@18.2.0)(typescript@5.6.3) + find-up: 5.0.0 + magic-string: 0.30.11 react: 18.2.0 react-docgen: 7.0.3 react-dom: 18.2.0(react@18.2.0) resolve: 1.22.8 tsconfig-paths: 4.2.0 - vite: 5.4.8(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + vite: 5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) transitivePeerDependencies: - '@preact/preset-vite' - encoding @@ -24772,7 +25236,7 @@ snapshots: dependencies: '@storybook/client-logger': 8.0.8 memoizerific: 1.11.3 - qs: 6.12.1 + qs: 6.13.0 '@storybook/telemetry@8.0.8(encoding@0.1.13)': dependencies: @@ -24788,14 +25252,34 @@ snapshots: - encoding - supports-color - '@storybook/test@8.0.8(@jest/globals@29.7.0)(@types/jest@29.5.12)(jest@29.7.0(@types/node@20.12.7))(vitest@2.1.3(@types/node@20.12.7)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3))': + '@storybook/test@8.0.8(@jest/globals@29.7.0)(@types/jest@29.5.12)(jest@29.7.0(@types/node@22.7.4))(vitest@2.1.3(@types/node@22.7.4)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3))': + dependencies: + '@storybook/client-logger': 8.0.8 + '@storybook/core-events': 8.0.8 + '@storybook/instrumenter': 8.0.8 + '@storybook/preview-api': 8.0.8 + '@testing-library/dom': 9.3.4 + '@testing-library/jest-dom': 6.4.2(@jest/globals@29.7.0)(@types/jest@29.5.12)(jest@29.7.0(@types/node@22.7.4))(vitest@2.1.3(@types/node@22.7.4)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)) + '@testing-library/user-event': 14.5.2(@testing-library/dom@9.3.4) + '@vitest/expect': 1.3.1 + '@vitest/spy': 1.5.0 + chai: 4.4.1 + util: 0.12.5 + transitivePeerDependencies: + - '@jest/globals' + - '@types/bun' + - '@types/jest' + - jest + - vitest + + '@storybook/test@8.0.8(@jest/globals@29.7.0)(@types/jest@29.5.12)(jest@29.7.0(@types/node@22.7.4))(vitest@2.1.3(@types/node@22.7.4)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3))': dependencies: '@storybook/client-logger': 8.0.8 '@storybook/core-events': 8.0.8 '@storybook/instrumenter': 8.0.8 '@storybook/preview-api': 8.0.8 '@testing-library/dom': 9.3.4 - '@testing-library/jest-dom': 6.4.2(@jest/globals@29.7.0)(@types/jest@29.5.12)(jest@29.7.0(@types/node@20.12.7))(vitest@2.1.3(@types/node@20.12.7)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)) + '@testing-library/jest-dom': 6.4.2(@jest/globals@29.7.0)(@types/jest@29.5.12)(jest@29.7.0(@types/node@22.7.4))(vitest@2.1.3(@types/node@22.7.4)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3)) '@testing-library/user-event': 14.5.2(@testing-library/dom@9.3.4) '@vitest/expect': 1.3.1 '@vitest/spy': 1.5.0 @@ -24877,6 +25361,10 @@ snapshots: dependencies: tslib: 2.6.2 + '@swc/helpers@0.5.13': + dependencies: + tslib: 2.6.2 + '@swc/helpers@0.5.5': dependencies: '@swc/counter': 0.1.3 @@ -24967,33 +25455,7 @@ snapshots: tsx: 4.19.1 zod: 3.23.8 - '@tanstack/router-plugin@1.69.1(vite@5.2.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3))(webpack-sources@3.2.3)': - dependencies: - '@babel/core': 7.25.8 - '@babel/generator': 7.25.7 - '@babel/parser': 7.25.8 - '@babel/plugin-syntax-jsx': 7.25.7(@babel/core@7.25.8) - '@babel/plugin-syntax-typescript': 7.25.7(@babel/core@7.25.8) - '@babel/template': 7.25.7 - '@babel/traverse': 7.25.7 - '@babel/types': 7.25.8 - '@tanstack/router-generator': 1.69.1 - '@tanstack/virtual-file-routes': 1.64.0 - '@types/babel__core': 7.20.5 - '@types/babel__generator': 7.6.8 - '@types/babel__template': 7.4.4 - '@types/babel__traverse': 7.20.6 - babel-dead-code-elimination: 1.0.6 - chokidar: 3.6.0 - unplugin: 1.14.1(webpack-sources@3.2.3) - zod: 3.23.8 - optionalDependencies: - vite: 5.2.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) - transitivePeerDependencies: - - supports-color - - webpack-sources - - '@tanstack/router-plugin@1.69.1(vite@5.4.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3))(webpack-sources@3.2.3)': + '@tanstack/router-plugin@1.69.1(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3))(webpack-sources@3.2.3)': dependencies: '@babel/core': 7.25.8 '@babel/generator': 7.25.7 @@ -25014,14 +25476,14 @@ snapshots: unplugin: 1.14.1(webpack-sources@3.2.3) zod: 3.23.8 optionalDependencies: - vite: 5.4.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + vite: 5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) transitivePeerDependencies: - supports-color - webpack-sources - '@tanstack/router-vite-plugin@1.69.1(vite@5.2.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3))(webpack-sources@3.2.3)': + '@tanstack/router-vite-plugin@1.69.1(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3))(webpack-sources@3.2.3)': dependencies: - '@tanstack/router-plugin': 1.69.1(vite@5.2.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3))(webpack-sources@3.2.3) + '@tanstack/router-plugin': 1.69.1(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3))(webpack-sources@3.2.3) transitivePeerDependencies: - '@rsbuild/core' - supports-color @@ -25047,24 +25509,24 @@ snapshots: transitivePeerDependencies: - supports-color - '@tanstack/start@1.70.1(@types/node@20.12.7)(encoding@0.1.13)(ioredis@5.4.1)(less@3.11.1)(lightningcss@1.24.1)(magicast@0.3.4)(react-dom@18.2.0(react@18.2.0))(react@18.2.0)(sass@1.75.0)(terser@5.30.3)(vite@5.2.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3))(webpack-sources@3.2.3)': + '@tanstack/start@1.70.1(@types/node@22.7.4)(encoding@0.1.13)(ioredis@5.4.1)(less@3.11.1)(lightningcss@1.28.1)(magicast@0.3.4)(react-dom@18.2.0(react@18.2.0))(react@18.2.0)(sass@1.75.0)(terser@5.30.3)(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3))(webpack-sources@3.2.3)': dependencies: '@tanstack/react-cross-context': 1.60.0(react-dom@18.2.0(react@18.2.0))(react@18.2.0) '@tanstack/react-router': 1.70.1(@tanstack/router-generator@1.69.1)(react-dom@18.2.0(react@18.2.0))(react@18.2.0) '@tanstack/router-generator': 1.69.1 - '@tanstack/router-plugin': 1.69.1(vite@5.2.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3))(webpack-sources@3.2.3) + '@tanstack/router-plugin': 1.69.1(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3))(webpack-sources@3.2.3) '@tanstack/start-vite-plugin': 1.66.1 '@vinxi/react': 0.2.5 - '@vinxi/react-server-dom': 0.0.3(react-dom@18.2.0(react@18.2.0))(react@18.2.0)(vite@5.2.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)) - '@vinxi/server-components': 0.4.3(vinxi@0.4.3(@types/node@20.12.7)(encoding@0.1.13)(ioredis@5.4.1)(less@3.11.1)(lightningcss@1.24.1)(magicast@0.3.4)(sass@1.75.0)(terser@5.30.3)(webpack-sources@3.2.3)) - '@vinxi/server-functions': 0.4.3(vinxi@0.4.3(@types/node@20.12.7)(encoding@0.1.13)(ioredis@5.4.1)(less@3.11.1)(lightningcss@1.24.1)(magicast@0.3.4)(sass@1.75.0)(terser@5.30.3)(webpack-sources@3.2.3)) + '@vinxi/react-server-dom': 0.0.3(react-dom@18.2.0(react@18.2.0))(react@18.2.0)(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3)) + '@vinxi/server-components': 0.4.3(vinxi@0.4.3(@types/node@22.7.4)(encoding@0.1.13)(ioredis@5.4.1)(less@3.11.1)(lightningcss@1.28.1)(magicast@0.3.4)(sass@1.75.0)(terser@5.30.3)(webpack-sources@3.2.3)) + '@vinxi/server-functions': 0.4.3(vinxi@0.4.3(@types/node@22.7.4)(encoding@0.1.13)(ioredis@5.4.1)(less@3.11.1)(lightningcss@1.28.1)(magicast@0.3.4)(sass@1.75.0)(terser@5.30.3)(webpack-sources@3.2.3)) import-meta-resolve: 4.1.0 isbot: 5.1.17 jsesc: 3.0.2 react: 18.2.0 react-dom: 18.2.0(react@18.2.0) tiny-invariant: 1.3.3 - vinxi: 0.4.3(@types/node@20.12.7)(encoding@0.1.13)(ioredis@5.4.1)(less@3.11.1)(lightningcss@1.24.1)(magicast@0.3.4)(sass@1.75.0)(terser@5.30.3)(webpack-sources@3.2.3) + vinxi: 0.4.3(@types/node@22.7.4)(encoding@0.1.13)(ioredis@5.4.1)(less@3.11.1)(lightningcss@1.28.1)(magicast@0.3.4)(sass@1.75.0)(terser@5.30.3)(webpack-sources@3.2.3) zod: 3.23.8 transitivePeerDependencies: - '@azure/app-configuration' @@ -25156,7 +25618,7 @@ snapshots: lodash: 4.17.21 redent: 3.0.0 - '@testing-library/jest-dom@6.4.2(@jest/globals@29.7.0)(@types/jest@29.5.12)(jest@26.6.3)(vitest@2.1.3(@types/node@20.12.7)(jsdom@16.7.0)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3))': + '@testing-library/jest-dom@6.4.2(@jest/globals@29.7.0)(@types/jest@29.5.12)(jest@26.6.3)(vitest@2.1.3(@types/node@22.7.4)(jsdom@16.7.0)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3))': dependencies: '@adobe/css-tools': 4.3.3 '@babel/runtime': 7.20.6 @@ -25170,9 +25632,9 @@ snapshots: '@jest/globals': 29.7.0 '@types/jest': 29.5.12 jest: 26.6.3 - vitest: 2.1.3(@types/node@20.12.7)(jsdom@16.7.0)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + vitest: 2.1.3(@types/node@22.7.4)(jsdom@16.7.0)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) - '@testing-library/jest-dom@6.4.2(@jest/globals@29.7.0)(@types/jest@29.5.12)(jest@29.7.0(@types/node@20.12.7))(vitest@2.1.3(@types/node@20.12.7)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3))': + '@testing-library/jest-dom@6.4.2(@jest/globals@29.7.0)(@types/jest@29.5.12)(jest@29.7.0(@types/node@22.7.4))(vitest@2.1.3(@types/node@22.7.4)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3))': dependencies: '@adobe/css-tools': 4.3.3 '@babel/runtime': 7.20.6 @@ -25185,8 +25647,24 @@ snapshots: optionalDependencies: '@jest/globals': 29.7.0 '@types/jest': 29.5.12 - jest: 29.7.0(@types/node@20.12.7) - vitest: 2.1.3(@types/node@20.12.7)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + jest: 29.7.0(@types/node@22.7.4) + vitest: 2.1.3(@types/node@22.7.4)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + + '@testing-library/jest-dom@6.4.2(@jest/globals@29.7.0)(@types/jest@29.5.12)(jest@29.7.0(@types/node@22.7.4))(vitest@2.1.3(@types/node@22.7.4)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3))': + dependencies: + '@adobe/css-tools': 4.3.3 + '@babel/runtime': 7.20.6 + aria-query: 5.3.0 + chalk: 3.0.0 + css.escape: 1.5.1 + dom-accessibility-api: 0.6.3 + lodash: 4.17.21 + redent: 3.0.0 + optionalDependencies: + '@jest/globals': 29.7.0 + '@types/jest': 29.5.12 + jest: 29.7.0(@types/node@22.7.4) + vitest: 2.1.3(@types/node@22.7.4)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) '@testing-library/react-hooks@8.0.1(@types/react@18.2.79)(react-dom@18.2.0(react@18.2.0))(react-test-renderer@18.2.0(react@18.2.0))(react@18.2.0)': dependencies: @@ -25293,22 +25771,22 @@ snapshots: '@types/body-parser@1.19.5': dependencies: '@types/connect': 3.4.38 - '@types/node': 20.12.7 + '@types/node': 20.16.10 '@types/bonjour@3.5.13': dependencies: - '@types/node': 20.12.7 + '@types/node': 20.16.10 '@types/braces@3.0.4': {} '@types/connect-history-api-fallback@1.5.4': dependencies: '@types/express-serve-static-core': 4.19.0 - '@types/node': 20.12.7 + '@types/node': 20.16.10 '@types/connect@3.4.38': dependencies: - '@types/node': 20.12.7 + '@types/node': 20.16.10 '@types/cookie@0.3.3': {} @@ -25316,7 +25794,7 @@ snapshots: '@types/cross-spawn@6.0.6': dependencies: - '@types/node': 20.12.7 + '@types/node': 20.16.10 '@types/debug@4.1.12': dependencies: @@ -25358,7 +25836,7 @@ snapshots: '@types/express-serve-static-core@4.19.0': dependencies: - '@types/node': 20.12.7 + '@types/node': 20.16.10 '@types/qs': 6.9.15 '@types/range-parser': 1.2.7 '@types/send': 0.17.4 @@ -25375,16 +25853,16 @@ snapshots: '@types/glob@7.2.0': dependencies: '@types/minimatch': 5.1.2 - '@types/node': 20.12.7 + '@types/node': 20.16.10 '@types/glob@8.1.0': dependencies: '@types/minimatch': 5.1.2 - '@types/node': 20.12.7 + '@types/node': 20.16.10 '@types/graceful-fs@4.1.9': dependencies: - '@types/node': 20.12.7 + '@types/node': 20.16.10 '@types/hast@2.3.10': dependencies: @@ -25409,7 +25887,7 @@ snapshots: '@types/http-proxy@1.17.14': dependencies: - '@types/node': 20.12.7 + '@types/node': 20.16.10 '@types/invariant@2.2.37': {} @@ -25446,7 +25924,7 @@ snapshots: '@types/keyv@3.1.4': dependencies: - '@types/node': 20.12.7 + '@types/node': 20.16.10 '@types/loadable__component@5.13.9': dependencies: @@ -25478,7 +25956,7 @@ snapshots: '@types/node-forge@1.3.11': dependencies: - '@types/node': 20.12.7 + '@types/node': 20.16.10 '@types/node@15.14.9': {} @@ -25486,9 +25964,14 @@ snapshots: dependencies: undici-types: 5.26.5 - '@types/node@20.12.7': + '@types/node@20.16.10': dependencies: - undici-types: 5.26.5 + undici-types: 6.19.8 + + '@types/node@22.7.4': + dependencies: + undici-types: 6.19.8 + optional: true '@types/normalize-package-data@2.4.4': {} @@ -25500,6 +25983,8 @@ snapshots: '@types/prop-types@15.7.12': {} + '@types/prop-types@15.7.13': {} + '@types/q@1.5.8': {} '@types/qs@6.9.15': {} @@ -25508,7 +25993,7 @@ snapshots: '@types/react-dom@17.0.25': dependencies: - '@types/react': 17.0.80 + '@types/react': 17.0.83 '@types/react-dom@18.2.12': dependencies: @@ -25516,7 +26001,11 @@ snapshots: '@types/react-dom@18.2.25': dependencies: - '@types/react': 18.2.79 + '@types/react': 18.3.12 + + '@types/react-dom@18.3.0': + dependencies: + '@types/react': 18.3.12 '@types/react-dom@18.3.1': dependencies: @@ -25544,9 +26033,9 @@ snapshots: dependencies: '@types/react': 18.3.12 - '@types/react@17.0.80': + '@types/react@17.0.83': dependencies: - '@types/prop-types': 15.7.12 + '@types/prop-types': 15.7.13 '@types/scheduler': 0.16.8 csstype: 3.1.3 @@ -25563,7 +26052,7 @@ snapshots: '@types/react@18.3.12': dependencies: - '@types/prop-types': 15.7.12 + '@types/prop-types': 15.7.13 csstype: 3.1.3 '@types/resolve@1.20.2': {} @@ -25572,7 +26061,7 @@ snapshots: '@types/responselike@1.0.3': dependencies: - '@types/node': 20.12.7 + '@types/node': 20.16.10 '@types/retry@0.12.0': {} @@ -25587,7 +26076,7 @@ snapshots: '@types/send@0.17.4': dependencies: '@types/mime': 1.3.5 - '@types/node': 20.12.7 + '@types/node': 20.16.10 '@types/serve-index@1.9.4': dependencies: @@ -25596,7 +26085,7 @@ snapshots: '@types/serve-static@1.15.7': dependencies: '@types/http-errors': 2.0.4 - '@types/node': 20.12.7 + '@types/node': 20.16.10 '@types/send': 0.17.4 '@types/sinonjs__fake-timers@8.1.1': {} @@ -25605,7 +26094,7 @@ snapshots: '@types/sockjs@0.3.36': dependencies: - '@types/node': 20.12.7 + '@types/node': 20.16.10 '@types/stack-utils@2.0.3': {} @@ -25640,11 +26129,11 @@ snapshots: '@types/vinyl@2.0.12': dependencies: '@types/expect': 1.20.4 - '@types/node': 20.12.7 + '@types/node': 20.16.10 '@types/ws@8.5.10': dependencies: - '@types/node': 20.12.7 + '@types/node': 20.16.10 '@types/yargs-parser@21.0.3': {} @@ -25662,7 +26151,7 @@ snapshots: '@types/yauzl@2.10.3': dependencies: - '@types/node': 20.12.7 + '@types/node': 20.16.10 optional: true '@typescript-eslint/eslint-plugin@5.62.0(@typescript-eslint/parser@5.62.0(eslint@8.57.0)(typescript@5.6.3))(eslint@8.57.0)(typescript@5.6.3)': @@ -25704,6 +26193,26 @@ snapshots: transitivePeerDependencies: - supports-color + '@typescript-eslint/eslint-plugin@7.7.0(@typescript-eslint/parser@7.7.0(eslint@8.57.1)(typescript@5.6.3))(eslint@8.57.1)(typescript@5.6.3)': + dependencies: + '@eslint-community/regexpp': 4.10.0 + '@typescript-eslint/parser': 7.7.0(eslint@8.57.1)(typescript@5.6.3) + '@typescript-eslint/scope-manager': 7.7.0 + '@typescript-eslint/type-utils': 7.7.0(eslint@8.57.1)(typescript@5.6.3) + '@typescript-eslint/utils': 7.7.0(eslint@8.57.1)(typescript@5.6.3) + '@typescript-eslint/visitor-keys': 7.7.0 + debug: 4.3.4(supports-color@8.1.1) + eslint: 8.57.1 + graphemer: 1.4.0 + ignore: 5.3.1 + natural-compare: 1.4.0 + semver: 7.6.0 + ts-api-utils: 1.3.0(typescript@5.6.3) + optionalDependencies: + typescript: 5.6.3 + transitivePeerDependencies: + - supports-color + '@typescript-eslint/experimental-utils@5.62.0(eslint@8.57.0)(typescript@5.6.3)': dependencies: '@typescript-eslint/utils': 5.62.0(eslint@8.57.0)(typescript@5.6.3) @@ -25737,6 +26246,19 @@ snapshots: transitivePeerDependencies: - supports-color + '@typescript-eslint/parser@7.7.0(eslint@8.57.1)(typescript@5.6.3)': + dependencies: + '@typescript-eslint/scope-manager': 7.7.0 + '@typescript-eslint/types': 7.7.0 + '@typescript-eslint/typescript-estree': 7.7.0(typescript@5.6.3) + '@typescript-eslint/visitor-keys': 7.7.0 + debug: 4.3.4(supports-color@8.1.1) + eslint: 8.57.1 + optionalDependencies: + typescript: 5.6.3 + transitivePeerDependencies: + - supports-color + '@typescript-eslint/scope-manager@5.62.0': dependencies: '@typescript-eslint/types': 5.62.0 @@ -25771,6 +26293,18 @@ snapshots: transitivePeerDependencies: - supports-color + '@typescript-eslint/type-utils@7.7.0(eslint@8.57.1)(typescript@5.6.3)': + dependencies: + '@typescript-eslint/typescript-estree': 7.7.0(typescript@5.6.3) + '@typescript-eslint/utils': 7.7.0(eslint@8.57.1)(typescript@5.6.3) + debug: 4.3.4(supports-color@8.1.1) + eslint: 8.57.1 + ts-api-utils: 1.3.0(typescript@5.6.3) + optionalDependencies: + typescript: 5.6.3 + transitivePeerDependencies: + - supports-color + '@typescript-eslint/types@5.62.0': {} '@typescript-eslint/types@7.7.0': {} @@ -25819,6 +26353,21 @@ snapshots: - supports-color - typescript + '@typescript-eslint/utils@5.62.0(eslint@8.57.1)(typescript@5.6.3)': + dependencies: + '@eslint-community/eslint-utils': 4.4.0(eslint@8.57.1) + '@types/json-schema': 7.0.15 + '@types/semver': 7.5.8 + '@typescript-eslint/scope-manager': 5.62.0 + '@typescript-eslint/types': 5.62.0 + '@typescript-eslint/typescript-estree': 5.62.0(typescript@5.6.3) + eslint: 8.57.1 + eslint-scope: 5.1.1 + semver: 7.6.3 + transitivePeerDependencies: + - supports-color + - typescript + '@typescript-eslint/utils@7.7.0(eslint@8.57.0)(typescript@5.6.3)': dependencies: '@eslint-community/eslint-utils': 4.4.0(eslint@8.57.0) @@ -25833,6 +26382,20 @@ snapshots: - supports-color - typescript + '@typescript-eslint/utils@7.7.0(eslint@8.57.1)(typescript@5.6.3)': + dependencies: + '@eslint-community/eslint-utils': 4.4.0(eslint@8.57.1) + '@types/json-schema': 7.0.15 + '@types/semver': 7.5.8 + '@typescript-eslint/scope-manager': 7.7.0 + '@typescript-eslint/types': 7.7.0 + '@typescript-eslint/typescript-estree': 7.7.0(typescript@5.6.3) + eslint: 8.57.1 + semver: 7.6.3 + transitivePeerDependencies: + - supports-color + - typescript + '@typescript-eslint/visitor-keys@5.62.0': dependencies: '@typescript-eslint/types': 5.62.0 @@ -25865,7 +26428,7 @@ snapshots: modern-ahocorasick: 1.0.1 outdent: 0.8.0 - '@vanilla-extract/integration@6.5.0(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)': + '@vanilla-extract/integration@6.5.0(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3)': dependencies: '@babel/core': 7.24.4 '@babel/plugin-syntax-typescript': 7.24.1(@babel/core@7.24.4) @@ -25878,8 +26441,8 @@ snapshots: lodash: 4.17.21 mlly: 1.6.1 outdent: 0.8.0 - vite: 5.4.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) - vite-node: 1.5.0(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + vite: 5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) + vite-node: 1.5.0(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) transitivePeerDependencies: - '@types/node' - less @@ -25933,7 +26496,7 @@ snapshots: transitivePeerDependencies: - uWebSockets.js - '@vinxi/plugin-directives@0.4.3(vinxi@0.4.3(@types/node@20.12.7)(encoding@0.1.13)(ioredis@5.4.1)(less@3.11.1)(lightningcss@1.24.1)(magicast@0.3.4)(sass@1.75.0)(terser@5.30.3)(webpack-sources@3.2.3))': + '@vinxi/plugin-directives@0.4.3(vinxi@0.4.3(@types/node@22.7.4)(encoding@0.1.13)(ioredis@5.4.1)(less@3.11.1)(lightningcss@1.28.1)(magicast@0.3.4)(sass@1.75.0)(terser@5.30.3)(webpack-sources@3.2.3))': dependencies: '@babel/parser': 7.25.8 acorn: 8.13.0 @@ -25944,73 +26507,73 @@ snapshots: magicast: 0.2.11 recast: 0.23.6 tslib: 2.6.2 - vinxi: 0.4.3(@types/node@20.12.7)(encoding@0.1.13)(ioredis@5.4.1)(less@3.11.1)(lightningcss@1.24.1)(magicast@0.3.4)(sass@1.75.0)(terser@5.30.3)(webpack-sources@3.2.3) + vinxi: 0.4.3(@types/node@22.7.4)(encoding@0.1.13)(ioredis@5.4.1)(less@3.11.1)(lightningcss@1.28.1)(magicast@0.3.4)(sass@1.75.0)(terser@5.30.3)(webpack-sources@3.2.3) - '@vinxi/react-server-dom@0.0.3(react-dom@18.2.0(react@18.2.0))(react@18.2.0)(vite@5.2.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3))': + '@vinxi/react-server-dom@0.0.3(react-dom@18.2.0(react@18.2.0))(react@18.2.0)(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3))': dependencies: acorn-loose: 8.4.0 react: 18.2.0 react-dom: 18.2.0(react@18.2.0) - vite: 5.2.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + vite: 5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) '@vinxi/react@0.2.5': {} - '@vinxi/server-components@0.4.3(vinxi@0.4.3(@types/node@20.12.7)(encoding@0.1.13)(ioredis@5.4.1)(less@3.11.1)(lightningcss@1.24.1)(magicast@0.3.4)(sass@1.75.0)(terser@5.30.3)(webpack-sources@3.2.3))': + '@vinxi/server-components@0.4.3(vinxi@0.4.3(@types/node@22.7.4)(encoding@0.1.13)(ioredis@5.4.1)(less@3.11.1)(lightningcss@1.28.1)(magicast@0.3.4)(sass@1.75.0)(terser@5.30.3)(webpack-sources@3.2.3))': dependencies: - '@vinxi/plugin-directives': 0.4.3(vinxi@0.4.3(@types/node@20.12.7)(encoding@0.1.13)(ioredis@5.4.1)(less@3.11.1)(lightningcss@1.24.1)(magicast@0.3.4)(sass@1.75.0)(terser@5.30.3)(webpack-sources@3.2.3)) + '@vinxi/plugin-directives': 0.4.3(vinxi@0.4.3(@types/node@22.7.4)(encoding@0.1.13)(ioredis@5.4.1)(less@3.11.1)(lightningcss@1.28.1)(magicast@0.3.4)(sass@1.75.0)(terser@5.30.3)(webpack-sources@3.2.3)) acorn: 8.11.3 acorn-loose: 8.4.0 acorn-typescript: 1.4.13(acorn@8.11.3) astring: 1.8.6 magicast: 0.2.11 recast: 0.23.6 - vinxi: 0.4.3(@types/node@20.12.7)(encoding@0.1.13)(ioredis@5.4.1)(less@3.11.1)(lightningcss@1.24.1)(magicast@0.3.4)(sass@1.75.0)(terser@5.30.3)(webpack-sources@3.2.3) + vinxi: 0.4.3(@types/node@22.7.4)(encoding@0.1.13)(ioredis@5.4.1)(less@3.11.1)(lightningcss@1.28.1)(magicast@0.3.4)(sass@1.75.0)(terser@5.30.3)(webpack-sources@3.2.3) - '@vinxi/server-functions@0.4.3(vinxi@0.4.3(@types/node@20.12.7)(encoding@0.1.13)(ioredis@5.4.1)(less@3.11.1)(lightningcss@1.24.1)(magicast@0.3.4)(sass@1.75.0)(terser@5.30.3)(webpack-sources@3.2.3))': + '@vinxi/server-functions@0.4.3(vinxi@0.4.3(@types/node@22.7.4)(encoding@0.1.13)(ioredis@5.4.1)(less@3.11.1)(lightningcss@1.28.1)(magicast@0.3.4)(sass@1.75.0)(terser@5.30.3)(webpack-sources@3.2.3))': dependencies: - '@vinxi/plugin-directives': 0.4.3(vinxi@0.4.3(@types/node@20.12.7)(encoding@0.1.13)(ioredis@5.4.1)(less@3.11.1)(lightningcss@1.24.1)(magicast@0.3.4)(sass@1.75.0)(terser@5.30.3)(webpack-sources@3.2.3)) + '@vinxi/plugin-directives': 0.4.3(vinxi@0.4.3(@types/node@22.7.4)(encoding@0.1.13)(ioredis@5.4.1)(less@3.11.1)(lightningcss@1.28.1)(magicast@0.3.4)(sass@1.75.0)(terser@5.30.3)(webpack-sources@3.2.3)) acorn: 8.11.3 acorn-loose: 8.4.0 acorn-typescript: 1.4.13(acorn@8.11.3) astring: 1.8.6 magicast: 0.2.11 recast: 0.23.6 - vinxi: 0.4.3(@types/node@20.12.7)(encoding@0.1.13)(ioredis@5.4.1)(less@3.11.1)(lightningcss@1.24.1)(magicast@0.3.4)(sass@1.75.0)(terser@5.30.3)(webpack-sources@3.2.3) + vinxi: 0.4.3(@types/node@22.7.4)(encoding@0.1.13)(ioredis@5.4.1)(less@3.11.1)(lightningcss@1.28.1)(magicast@0.3.4)(sass@1.75.0)(terser@5.30.3)(webpack-sources@3.2.3) - '@vitejs/plugin-react@4.2.1(vite@5.2.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3))': + '@vitejs/plugin-react@4.2.1(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3))': dependencies: '@babel/core': 7.24.4 '@babel/plugin-transform-react-jsx-self': 7.24.1(@babel/core@7.24.4) '@babel/plugin-transform-react-jsx-source': 7.24.1(@babel/core@7.24.4) '@types/babel__core': 7.20.5 react-refresh: 0.14.0 - vite: 5.2.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + vite: 5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) transitivePeerDependencies: - supports-color - '@vitejs/plugin-react@4.2.1(vite@5.4.8(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3))': + '@vitejs/plugin-react@4.2.1(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3))': dependencies: '@babel/core': 7.24.4 '@babel/plugin-transform-react-jsx-self': 7.24.1(@babel/core@7.24.4) '@babel/plugin-transform-react-jsx-source': 7.24.1(@babel/core@7.24.4) '@types/babel__core': 7.20.5 react-refresh: 0.14.0 - vite: 5.4.8(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + vite: 5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) transitivePeerDependencies: - supports-color - '@vitejs/plugin-react@4.3.2(vite@5.4.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3))': + '@vitejs/plugin-react@4.3.2(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3))': dependencies: '@babel/core': 7.25.8 '@babel/plugin-transform-react-jsx-self': 7.25.7(@babel/core@7.25.8) '@babel/plugin-transform-react-jsx-source': 7.25.7(@babel/core@7.25.8) '@types/babel__core': 7.20.5 react-refresh: 0.14.0 - vite: 5.4.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + vite: 5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) transitivePeerDependencies: - supports-color - '@vitest/coverage-v8@1.5.0(vitest@2.1.3(@types/node@20.12.7)(jsdom@21.1.2)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3))': + '@vitest/coverage-v8@1.5.0(vitest@2.1.3(@types/node@22.7.4)(jsdom@21.1.2)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3))': dependencies: '@ampproject/remapping': 2.3.0 '@bcoe/v8-coverage': 0.2.3 @@ -26019,17 +26582,17 @@ snapshots: istanbul-lib-report: 3.0.1 istanbul-lib-source-maps: 5.0.4 istanbul-reports: 3.1.7 - magic-string: 0.30.10 + magic-string: 0.30.11 magicast: 0.3.4 - picocolors: 1.0.0 + picocolors: 1.1.0 std-env: 3.7.0 strip-literal: 2.1.0 test-exclude: 6.0.0 - vitest: 2.1.3(@types/node@20.12.7)(jsdom@21.1.2)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + vitest: 2.1.3(@types/node@22.7.4)(jsdom@21.1.2)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) transitivePeerDependencies: - supports-color - '@vitest/coverage-v8@1.5.0(vitest@2.1.3(@types/node@20.12.7)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3))': + '@vitest/coverage-v8@1.5.0(vitest@2.1.3(@types/node@22.7.4)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3))': dependencies: '@ampproject/remapping': 2.3.0 '@bcoe/v8-coverage': 0.2.3 @@ -26044,7 +26607,7 @@ snapshots: std-env: 3.7.0 strip-literal: 2.1.0 test-exclude: 6.0.0 - vitest: 2.1.3(@types/node@20.12.7)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + vitest: 2.1.3(@types/node@22.7.4)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) transitivePeerDependencies: - supports-color @@ -26061,13 +26624,29 @@ snapshots: chai: 5.1.1 tinyrainbow: 1.2.0 - '@vitest/mocker@2.1.3(@vitest/spy@2.1.3)(vite@5.4.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3))': + '@vitest/mocker@2.1.3(@vitest/spy@2.1.3)(vite@5.4.9(@types/node@20.16.10)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3))': dependencies: '@vitest/spy': 2.1.3 estree-walker: 3.0.3 magic-string: 0.30.11 optionalDependencies: - vite: 5.4.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + vite: 5.4.9(@types/node@20.16.10)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) + + '@vitest/mocker@2.1.3(@vitest/spy@2.1.3)(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3))': + dependencies: + '@vitest/spy': 2.1.3 + estree-walker: 3.0.3 + magic-string: 0.30.11 + optionalDependencies: + vite: 5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + + '@vitest/mocker@2.1.3(@vitest/spy@2.1.3)(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3))': + dependencies: + '@vitest/spy': 2.1.3 + estree-walker: 3.0.3 + magic-string: 0.30.11 + optionalDependencies: + vite: 5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) '@vitest/pretty-format@2.1.3': dependencies: @@ -26934,7 +27513,7 @@ snapshots: babel-plugin-polyfill-corejs2@0.4.10(@babel/core@7.25.8): dependencies: - '@babel/compat-data': 7.25.8 + '@babel/compat-data': 7.24.4 '@babel/core': 7.25.8 '@babel/helper-define-polyfill-provider': 0.6.1(@babel/core@7.25.8) semver: 6.3.1 @@ -28197,13 +28776,13 @@ snapshots: crc-32: 1.2.2 readable-stream: 4.5.2 - create-jest@29.7.0(@types/node@20.12.7): + create-jest@29.7.0(@types/node@22.7.4): dependencies: '@jest/types': 29.6.3 chalk: 4.1.2 exit: 0.1.2 graceful-fs: 4.2.11 - jest-config: 29.7.0(@types/node@20.12.7) + jest-config: 29.7.0(@types/node@22.7.4) jest-util: 29.7.0 prompts: 2.4.2 transitivePeerDependencies: @@ -29369,19 +29948,19 @@ snapshots: optionalDependencies: source-map: 0.6.1 - eslint-config-next@14.2.14(eslint@8.57.0)(typescript@5.6.3): + eslint-config-next@14.2.14(eslint@8.57.1)(typescript@5.6.3): dependencies: '@next/eslint-plugin-next': 14.2.14 '@rushstack/eslint-patch': 1.10.2 - '@typescript-eslint/eslint-plugin': 7.7.0(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.6.3))(eslint@8.57.0)(typescript@5.6.3) - '@typescript-eslint/parser': 7.7.0(eslint@8.57.0)(typescript@5.6.3) - eslint: 8.57.0 + '@typescript-eslint/eslint-plugin': 7.7.0(@typescript-eslint/parser@7.7.0(eslint@8.57.1)(typescript@5.6.3))(eslint@8.57.1)(typescript@5.6.3) + '@typescript-eslint/parser': 7.7.0(eslint@8.57.1)(typescript@5.6.3) + eslint: 8.57.1 eslint-import-resolver-node: 0.3.9 - eslint-import-resolver-typescript: 3.6.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.6.3))(eslint-import-resolver-node@0.3.9)(eslint-plugin-import@2.29.1)(eslint@8.57.0) - eslint-plugin-import: 2.29.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.6.3))(eslint-import-resolver-typescript@3.6.1)(eslint@8.57.0) - eslint-plugin-jsx-a11y: 6.7.1(eslint@8.57.0) - eslint-plugin-react: 7.34.1(eslint@8.57.0) - eslint-plugin-react-hooks: 4.6.0(eslint@8.57.0) + eslint-import-resolver-typescript: 3.6.1(@typescript-eslint/parser@7.7.0(eslint@8.57.1)(typescript@5.6.3))(eslint-import-resolver-node@0.3.9)(eslint-plugin-import@2.29.1)(eslint@8.57.1) + eslint-plugin-import: 2.29.1(@typescript-eslint/parser@7.7.0(eslint@8.57.1)(typescript@5.6.3))(eslint-import-resolver-typescript@3.6.1)(eslint@8.57.1) + eslint-plugin-jsx-a11y: 6.7.1(eslint@8.57.1) + eslint-plugin-react: 7.34.1(eslint@8.57.1) + eslint-plugin-react-hooks: 4.6.0(eslint@8.57.1) optionalDependencies: typescript: 5.6.3 transitivePeerDependencies: @@ -29448,12 +30027,12 @@ snapshots: transitivePeerDependencies: - supports-color - eslint-import-resolver-typescript@3.6.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.6.3))(eslint-import-resolver-node@0.3.9)(eslint-plugin-import@2.29.1)(eslint@8.57.0): + eslint-import-resolver-typescript@3.6.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.6.3))(eslint-plugin-import@2.29.1)(eslint@8.57.0): dependencies: debug: 4.3.4(supports-color@8.1.1) enhanced-resolve: 5.16.0 eslint: 8.57.0 - eslint-module-utils: 2.8.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.6.3))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.6.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.6.3))(eslint-import-resolver-node@0.3.9)(eslint-plugin-import@2.29.1)(eslint@8.57.0))(eslint@8.57.0) + eslint-module-utils: 2.8.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.6.3))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.6.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.6.3))(eslint-plugin-import@2.29.1)(eslint@8.57.0))(eslint@8.57.0) eslint-plugin-import: 2.29.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.6.3))(eslint-import-resolver-typescript@3.6.1)(eslint@8.57.0) fast-glob: 3.3.2 get-tsconfig: 4.7.3 @@ -29465,16 +30044,16 @@ snapshots: - eslint-import-resolver-webpack - supports-color - eslint-import-resolver-typescript@3.6.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.6.3))(eslint-plugin-import@2.29.1)(eslint@8.57.0): + eslint-import-resolver-typescript@3.6.1(@typescript-eslint/parser@7.7.0(eslint@8.57.1)(typescript@5.6.3))(eslint-import-resolver-node@0.3.9)(eslint-plugin-import@2.29.1)(eslint@8.57.1): dependencies: debug: 4.3.4(supports-color@8.1.1) enhanced-resolve: 5.16.0 - eslint: 8.57.0 - eslint-module-utils: 2.8.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.6.3))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.6.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.6.3))(eslint-plugin-import@2.29.1)(eslint@8.57.0))(eslint@8.57.0) - eslint-plugin-import: 2.29.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.6.3))(eslint-import-resolver-typescript@3.6.1)(eslint@8.57.0) + eslint: 8.57.1 + eslint-module-utils: 2.8.1(@typescript-eslint/parser@7.7.0(eslint@8.57.1)(typescript@5.6.3))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.6.1(@typescript-eslint/parser@7.7.0(eslint@8.57.1)(typescript@5.6.3))(eslint-import-resolver-node@0.3.9)(eslint-plugin-import@2.29.1)(eslint@8.57.1))(eslint@8.57.1) + eslint-plugin-import: 2.29.1(@typescript-eslint/parser@7.7.0(eslint@8.57.1)(typescript@5.6.3))(eslint-import-resolver-typescript@3.6.1)(eslint@8.57.1) fast-glob: 3.3.2 - get-tsconfig: 4.7.3 - is-core-module: 2.13.1 + get-tsconfig: 4.8.1 + is-core-module: 2.15.1 is-glob: 4.0.3 transitivePeerDependencies: - '@typescript-eslint/parser' @@ -29493,25 +30072,25 @@ snapshots: transitivePeerDependencies: - supports-color - eslint-module-utils@2.8.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.6.3))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.6.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.6.3))(eslint-import-resolver-node@0.3.9)(eslint-plugin-import@2.29.1)(eslint@8.57.0))(eslint@8.57.0): + eslint-module-utils@2.8.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.6.3))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.6.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.6.3))(eslint-plugin-import@2.29.1)(eslint@8.57.0))(eslint@8.57.0): dependencies: debug: 3.2.7(supports-color@8.1.1) optionalDependencies: '@typescript-eslint/parser': 7.7.0(eslint@8.57.0)(typescript@5.6.3) eslint: 8.57.0 eslint-import-resolver-node: 0.3.9 - eslint-import-resolver-typescript: 3.6.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.6.3))(eslint-import-resolver-node@0.3.9)(eslint-plugin-import@2.29.1)(eslint@8.57.0) + eslint-import-resolver-typescript: 3.6.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.6.3))(eslint-plugin-import@2.29.1)(eslint@8.57.0) transitivePeerDependencies: - supports-color - eslint-module-utils@2.8.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.6.3))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.6.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.6.3))(eslint-plugin-import@2.29.1)(eslint@8.57.0))(eslint@8.57.0): + eslint-module-utils@2.8.1(@typescript-eslint/parser@7.7.0(eslint@8.57.1)(typescript@5.6.3))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.6.1(@typescript-eslint/parser@7.7.0(eslint@8.57.1)(typescript@5.6.3))(eslint-import-resolver-node@0.3.9)(eslint-plugin-import@2.29.1)(eslint@8.57.1))(eslint@8.57.1): dependencies: debug: 3.2.7(supports-color@8.1.1) optionalDependencies: - '@typescript-eslint/parser': 7.7.0(eslint@8.57.0)(typescript@5.6.3) - eslint: 8.57.0 + '@typescript-eslint/parser': 7.7.0(eslint@8.57.1)(typescript@5.6.3) + eslint: 8.57.1 eslint-import-resolver-node: 0.3.9 - eslint-import-resolver-typescript: 3.6.1(@typescript-eslint/parser@7.7.0(eslint@8.57.0)(typescript@5.6.3))(eslint-plugin-import@2.29.1)(eslint@8.57.0) + eslint-import-resolver-typescript: 3.6.1(@typescript-eslint/parser@7.7.0(eslint@8.57.1)(typescript@5.6.3))(eslint-import-resolver-node@0.3.9)(eslint-plugin-import@2.29.1)(eslint@8.57.1) transitivePeerDependencies: - supports-color @@ -29577,6 +30156,33 @@ snapshots: - eslint-import-resolver-webpack - supports-color + eslint-plugin-import@2.29.1(@typescript-eslint/parser@7.7.0(eslint@8.57.1)(typescript@5.6.3))(eslint-import-resolver-typescript@3.6.1)(eslint@8.57.1): + dependencies: + array-includes: 3.1.8 + array.prototype.findlastindex: 1.2.5 + array.prototype.flat: 1.3.2 + array.prototype.flatmap: 1.3.2 + debug: 3.2.7(supports-color@8.1.1) + doctrine: 2.1.0 + eslint: 8.57.1 + eslint-import-resolver-node: 0.3.9 + eslint-module-utils: 2.8.1(@typescript-eslint/parser@7.7.0(eslint@8.57.1)(typescript@5.6.3))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.6.1(@typescript-eslint/parser@7.7.0(eslint@8.57.1)(typescript@5.6.3))(eslint-import-resolver-node@0.3.9)(eslint-plugin-import@2.29.1)(eslint@8.57.1))(eslint@8.57.1) + hasown: 2.0.2 + is-core-module: 2.13.1 + is-glob: 4.0.3 + minimatch: 3.1.2 + object.fromentries: 2.0.8 + object.groupby: 1.0.3 + object.values: 1.2.0 + semver: 6.3.1 + tsconfig-paths: 3.15.0 + optionalDependencies: + '@typescript-eslint/parser': 7.7.0(eslint@8.57.1)(typescript@5.6.3) + transitivePeerDependencies: + - eslint-import-resolver-typescript + - eslint-import-resolver-webpack + - supports-color + eslint-plugin-jest@25.7.0(@typescript-eslint/eslint-plugin@5.62.0(@typescript-eslint/parser@5.62.0(eslint@8.57.0)(typescript@5.6.3))(eslint@8.57.0)(typescript@5.6.3))(eslint@8.57.0)(jest@26.6.3)(typescript@5.6.3): dependencies: '@typescript-eslint/experimental-utils': 5.62.0(eslint@8.57.0)(typescript@5.6.3) @@ -29608,6 +30214,26 @@ snapshots: object.fromentries: 2.0.8 semver: 6.3.1 + eslint-plugin-jsx-a11y@6.7.1(eslint@8.57.1): + dependencies: + '@babel/runtime': 7.24.4 + aria-query: 5.3.0 + array-includes: 3.1.8 + array.prototype.flatmap: 1.3.2 + ast-types-flow: 0.0.7 + axe-core: 4.8.4 + axobject-query: 3.2.1 + damerau-levenshtein: 1.0.8 + emoji-regex: 9.2.2 + eslint: 8.57.1 + has: 1.0.4 + jsx-ast-utils: 3.3.5 + language-tags: 1.0.5 + minimatch: 3.1.2 + object.entries: 1.1.8 + object.fromentries: 2.0.8 + semver: 6.3.1 + eslint-plugin-prettier@5.1.3(@types/eslint@8.56.10)(eslint-config-prettier@9.1.0(eslint@8.57.0))(eslint@8.57.0)(prettier@3.2.5): dependencies: eslint: 8.57.0 @@ -29622,6 +30248,10 @@ snapshots: dependencies: eslint: 8.57.0 + eslint-plugin-react-hooks@4.6.0(eslint@8.57.1): + dependencies: + eslint: 8.57.1 + eslint-plugin-react@7.34.1(eslint@8.57.0): dependencies: array-includes: 3.1.8 @@ -29644,11 +30274,33 @@ snapshots: semver: 6.3.1 string.prototype.matchall: 4.0.11 - eslint-plugin-storybook@0.8.0(eslint@8.57.0)(typescript@5.6.3): + eslint-plugin-react@7.34.1(eslint@8.57.1): + dependencies: + array-includes: 3.1.8 + array.prototype.findlast: 1.2.5 + array.prototype.flatmap: 1.3.2 + array.prototype.toreversed: 1.1.2 + array.prototype.tosorted: 1.1.3 + doctrine: 2.1.0 + es-iterator-helpers: 1.0.18 + eslint: 8.57.1 + estraverse: 5.3.0 + jsx-ast-utils: 3.3.5 + minimatch: 3.1.2 + object.entries: 1.1.8 + object.fromentries: 2.0.8 + object.hasown: 1.1.4 + object.values: 1.2.0 + prop-types: 15.8.1 + resolve: 2.0.0-next.5 + semver: 6.3.1 + string.prototype.matchall: 4.0.11 + + eslint-plugin-storybook@0.8.0(eslint@8.57.1)(typescript@5.6.3): dependencies: '@storybook/csf': 0.0.1 - '@typescript-eslint/utils': 5.62.0(eslint@8.57.0)(typescript@5.6.3) - eslint: 8.57.0 + '@typescript-eslint/utils': 5.62.0(eslint@8.57.1)(typescript@5.6.3) + eslint: 8.57.1 requireindex: 1.2.0 ts-dedent: 2.2.0 transitivePeerDependencies: @@ -29720,6 +30372,49 @@ snapshots: transitivePeerDependencies: - supports-color + eslint@8.57.1: + dependencies: + '@eslint-community/eslint-utils': 4.4.0(eslint@8.57.1) + '@eslint-community/regexpp': 4.11.1 + '@eslint/eslintrc': 2.1.4 + '@eslint/js': 8.57.1 + '@humanwhocodes/config-array': 0.13.0 + '@humanwhocodes/module-importer': 1.0.1 + '@nodelib/fs.walk': 1.2.8 + '@ungap/structured-clone': 1.2.0 + ajv: 6.12.6 + chalk: 4.1.2 + cross-spawn: 7.0.3 + debug: 4.3.4(supports-color@8.1.1) + doctrine: 3.0.0 + escape-string-regexp: 4.0.0 + eslint-scope: 7.2.2 + eslint-visitor-keys: 3.4.3 + espree: 9.6.1 + esquery: 1.6.0 + esutils: 2.0.3 + fast-deep-equal: 3.1.3 + file-entry-cache: 6.0.1 + find-up: 5.0.0 + glob-parent: 6.0.2 + globals: 13.24.0 + graphemer: 1.4.0 + ignore: 5.3.2 + imurmurhash: 0.1.4 + is-glob: 4.0.3 + is-path-inside: 3.0.3 + js-yaml: 4.1.0 + json-stable-stringify-without-jsonify: 1.0.1 + levn: 0.4.1 + lodash.merge: 4.6.2 + minimatch: 3.1.2 + natural-compare: 1.4.0 + optionator: 0.9.4 + strip-ansi: 6.0.1 + text-table: 0.2.0 + transitivePeerDependencies: + - supports-color + esniff@2.0.1: dependencies: d: 1.0.2 @@ -29739,6 +30434,10 @@ snapshots: dependencies: estraverse: 5.3.0 + esquery@1.6.0: + dependencies: + estraverse: 5.3.0 + esrecurse@4.3.0: dependencies: estraverse: 5.3.0 @@ -29788,7 +30487,7 @@ snapshots: eval@0.1.8: dependencies: - '@types/node': 20.12.7 + '@types/node': 20.16.10 require-like: 0.1.2 event-emitter@0.3.5: @@ -30280,6 +30979,11 @@ snapshots: cross-spawn: 7.0.3 signal-exit: 4.1.0 + foreground-child@3.3.0: + dependencies: + cross-spawn: 7.0.3 + signal-exit: 4.1.0 + forever-agent@0.6.1: {} fork-ts-checker-webpack-plugin@4.1.6(eslint@8.57.0)(typescript@5.6.3)(vue-template-compiler@2.7.16)(webpack@5.90.1(esbuild@0.20.2)): @@ -30606,7 +31310,7 @@ snapshots: glob@10.3.10: dependencies: - foreground-child: 3.1.1 + foreground-child: 3.3.0 jackspeak: 2.3.6 minimatch: 9.0.4 minipass: 7.1.2 @@ -30683,7 +31387,7 @@ snapshots: array-union: 2.1.0 dir-glob: 3.0.1 fast-glob: 3.3.2 - ignore: 5.3.1 + ignore: 5.3.2 merge2: 1.4.1 slash: 3.0.0 @@ -30700,7 +31404,7 @@ snapshots: dependencies: dir-glob: 3.0.1 fast-glob: 3.3.2 - ignore: 5.3.1 + ignore: 5.3.2 merge2: 1.4.1 slash: 4.0.0 @@ -31188,6 +31892,8 @@ snapshots: ignore@5.3.1: {} + ignore@5.3.2: {} + image-extensions@1.1.0: {} image-size@0.5.5: @@ -31453,6 +32159,10 @@ snapshots: dependencies: hasown: 2.0.2 + is-core-module@2.15.1: + dependencies: + hasown: 2.0.2 + is-data-descriptor@1.0.1: dependencies: hasown: 2.0.2 @@ -31837,7 +32547,7 @@ snapshots: '@jest/expect': 29.7.0 '@jest/test-result': 29.7.0 '@jest/types': 29.6.3 - '@types/node': 20.12.7 + '@types/node': 20.16.10 chalk: 4.1.2 co: 4.6.0 dedent: 1.5.3(babel-plugin-macros@3.1.0) @@ -31880,16 +32590,16 @@ snapshots: - ts-node - utf-8-validate - jest-cli@29.7.0(@types/node@20.12.7): + jest-cli@29.7.0(@types/node@22.7.4): dependencies: '@jest/core': 29.7.0 '@jest/test-result': 29.7.0 '@jest/types': 29.6.3 chalk: 4.1.2 - create-jest: 29.7.0(@types/node@20.12.7) + create-jest: 29.7.0(@types/node@22.7.4) exit: 0.1.2 import-local: 3.1.0 - jest-config: 29.7.0(@types/node@20.12.7) + jest-config: 29.7.0(@types/node@22.7.4) jest-util: 29.7.0 jest-validate: 29.7.0 yargs: 17.7.2 @@ -31926,7 +32636,7 @@ snapshots: - supports-color - utf-8-validate - jest-config@29.7.0(@types/node@20.12.7): + jest-config@29.7.0(@types/node@20.16.10): dependencies: '@babel/core': 7.25.8 '@jest/test-sequencer': 29.7.0 @@ -31951,7 +32661,38 @@ snapshots: slash: 3.0.0 strip-json-comments: 3.1.1 optionalDependencies: - '@types/node': 20.12.7 + '@types/node': 20.16.10 + transitivePeerDependencies: + - babel-plugin-macros + - supports-color + optional: true + + jest-config@29.7.0(@types/node@22.7.4): + dependencies: + '@babel/core': 7.25.8 + '@jest/test-sequencer': 29.7.0 + '@jest/types': 29.6.3 + babel-jest: 29.7.0(@babel/core@7.25.8) + chalk: 4.1.2 + ci-info: 3.9.0 + deepmerge: 4.3.1 + glob: 7.1.6 + graceful-fs: 4.2.11 + jest-circus: 29.7.0 + jest-environment-node: 29.7.0 + jest-get-type: 29.6.3 + jest-regex-util: 29.6.3 + jest-resolve: 29.7.0 + jest-runner: 29.7.0 + jest-util: 29.7.0 + jest-validate: 29.7.0 + micromatch: 4.0.8 + parse-json: 5.2.0 + pretty-format: 29.7.0 + slash: 3.0.0 + strip-json-comments: 3.1.1 + optionalDependencies: + '@types/node': 22.7.4 transitivePeerDependencies: - babel-plugin-macros - supports-color @@ -32002,7 +32743,7 @@ snapshots: '@jest/environment': 26.6.2 '@jest/fake-timers': 26.6.2 '@jest/types': 26.6.2 - '@types/node': 20.12.7 + '@types/node': 20.16.10 jest-mock: 26.6.2 jest-util: 26.6.2 jsdom: 16.7.0 @@ -32017,7 +32758,7 @@ snapshots: '@jest/environment': 26.6.2 '@jest/fake-timers': 26.6.2 '@jest/types': 26.6.2 - '@types/node': 20.12.7 + '@types/node': 20.16.10 jest-mock: 26.6.2 jest-util: 26.6.2 @@ -32026,7 +32767,7 @@ snapshots: '@jest/environment': 29.7.0 '@jest/fake-timers': 29.7.0 '@jest/types': 29.6.3 - '@types/node': 20.12.7 + '@types/node': 20.16.10 jest-mock: 29.7.0 jest-util: 29.7.0 optional: true @@ -32041,7 +32782,7 @@ snapshots: dependencies: '@jest/types': 26.6.2 '@types/graceful-fs': 4.1.9 - '@types/node': 20.12.7 + '@types/node': 20.16.10 anymatch: 3.1.3 fb-watchman: 2.0.2 graceful-fs: 4.2.11 @@ -32061,7 +32802,7 @@ snapshots: dependencies: '@jest/types': 29.6.3 '@types/graceful-fs': 4.1.9 - '@types/node': 20.12.7 + '@types/node': 20.16.10 anymatch: 3.1.3 fb-watchman: 2.0.2 graceful-fs: 4.2.11 @@ -32080,7 +32821,7 @@ snapshots: '@jest/source-map': 26.6.2 '@jest/test-result': 26.6.2 '@jest/types': 26.6.2 - '@types/node': 20.12.7 + '@types/node': 20.16.10 chalk: 4.1.2 co: 4.6.0 expect: 26.6.2 @@ -32159,12 +32900,12 @@ snapshots: jest-mock@26.6.2: dependencies: '@jest/types': 26.6.2 - '@types/node': 20.12.7 + '@types/node': 20.16.10 jest-mock@29.7.0: dependencies: '@jest/types': 29.6.3 - '@types/node': 20.12.7 + '@types/node': 20.16.10 jest-util: 29.7.0 jest-pnp-resolver@1.2.3(jest-resolve@26.6.2(patch_hash=tmr5fnfjpir3crfu6ze44v7tue)): @@ -32226,7 +32967,7 @@ snapshots: '@jest/environment': 26.6.2 '@jest/test-result': 26.6.2 '@jest/types': 26.6.2 - '@types/node': 20.12.7 + '@types/node': 20.16.10 chalk: 4.1.2 emittery: 0.7.2 exit: 0.1.2 @@ -32256,7 +32997,7 @@ snapshots: '@jest/test-result': 29.7.0 '@jest/transform': 29.7.0 '@jest/types': 29.6.3 - '@types/node': 20.12.7 + '@types/node': 20.16.10 chalk: 4.1.2 emittery: 0.13.1 graceful-fs: 4.2.11 @@ -32321,7 +33062,7 @@ snapshots: '@jest/test-result': 29.7.0 '@jest/transform': 29.7.0 '@jest/types': 29.6.3 - '@types/node': 20.12.7 + '@types/node': 20.16.10 chalk: 4.1.2 cjs-module-lexer: 1.2.3 collect-v8-coverage: 1.0.2 @@ -32342,7 +33083,7 @@ snapshots: jest-serializer@26.6.2: dependencies: - '@types/node': 20.12.7 + '@types/node': 20.16.10 graceful-fs: 4.2.11 jest-snapshot@26.6.2: @@ -32394,7 +33135,7 @@ snapshots: jest-util@26.6.2: dependencies: '@jest/types': 26.6.2 - '@types/node': 20.12.7 + '@types/node': 20.16.10 chalk: 4.1.2 graceful-fs: 4.2.11 is-ci: 2.0.0 @@ -32403,7 +33144,7 @@ snapshots: jest-util@29.7.0: dependencies: '@jest/types': 29.6.3 - '@types/node': 20.12.7 + '@types/node': 20.16.10 chalk: 4.1.2 ci-info: 3.9.0 graceful-fs: 4.2.11 @@ -32432,7 +33173,7 @@ snapshots: dependencies: '@jest/test-result': 26.6.2 '@jest/types': 26.6.2 - '@types/node': 20.12.7 + '@types/node': 20.16.10 ansi-escapes: 4.3.2 chalk: 4.1.2 jest-util: 26.6.2 @@ -32442,7 +33183,7 @@ snapshots: dependencies: '@jest/test-result': 29.7.0 '@jest/types': 29.6.3 - '@types/node': 20.12.7 + '@types/node': 20.16.10 ansi-escapes: 4.3.2 chalk: 4.1.2 emittery: 0.13.1 @@ -32457,19 +33198,19 @@ snapshots: jest-worker@26.6.2: dependencies: - '@types/node': 20.12.7 + '@types/node': 20.16.10 merge-stream: 2.0.0 supports-color: 7.2.0 jest-worker@27.5.1: dependencies: - '@types/node': 20.12.7 + '@types/node': 20.16.10 merge-stream: 2.0.0 supports-color: 8.1.1 jest-worker@29.7.0: dependencies: - '@types/node': 20.12.7 + '@types/node': 20.16.10 jest-util: 29.7.0 merge-stream: 2.0.0 supports-color: 8.1.1 @@ -32486,12 +33227,12 @@ snapshots: - ts-node - utf-8-validate - jest@29.7.0(@types/node@20.12.7): + jest@29.7.0(@types/node@22.7.4): dependencies: '@jest/core': 29.7.0 '@jest/types': 29.6.3 import-local: 3.1.0 - jest-cli: 29.7.0(@types/node@20.12.7) + jest-cli: 29.7.0(@types/node@22.7.4) transitivePeerDependencies: - '@types/node' - babel-plugin-macros @@ -32864,30 +33605,60 @@ snapshots: lightningcss-cli-darwin-arm64@1.24.1: optional: true + lightningcss-cli-darwin-arm64@1.28.1: + optional: true + lightningcss-cli-darwin-x64@1.24.1: optional: true + lightningcss-cli-darwin-x64@1.28.1: + optional: true + lightningcss-cli-freebsd-x64@1.24.1: optional: true + lightningcss-cli-freebsd-x64@1.28.1: + optional: true + lightningcss-cli-linux-arm-gnueabihf@1.24.1: optional: true + lightningcss-cli-linux-arm-gnueabihf@1.28.1: + optional: true + lightningcss-cli-linux-arm64-gnu@1.24.1: optional: true + lightningcss-cli-linux-arm64-gnu@1.28.1: + optional: true + lightningcss-cli-linux-arm64-musl@1.24.1: optional: true + lightningcss-cli-linux-arm64-musl@1.28.1: + optional: true + lightningcss-cli-linux-x64-gnu@1.24.1: optional: true + lightningcss-cli-linux-x64-gnu@1.28.1: + optional: true + lightningcss-cli-linux-x64-musl@1.24.1: optional: true + lightningcss-cli-linux-x64-musl@1.28.1: + optional: true + + lightningcss-cli-win32-arm64-msvc@1.28.1: + optional: true + lightningcss-cli-win32-x64-msvc@1.24.1: optional: true + lightningcss-cli-win32-x64-msvc@1.28.1: + optional: true + lightningcss-cli@1.24.1: dependencies: detect-libc: 1.0.3 @@ -32902,33 +33673,78 @@ snapshots: lightningcss-cli-linux-x64-musl: 1.24.1 lightningcss-cli-win32-x64-msvc: 1.24.1 + lightningcss-cli@1.28.1: + dependencies: + detect-libc: 1.0.3 + optionalDependencies: + lightningcss-cli-darwin-arm64: 1.28.1 + lightningcss-cli-darwin-x64: 1.28.1 + lightningcss-cli-freebsd-x64: 1.28.1 + lightningcss-cli-linux-arm-gnueabihf: 1.28.1 + lightningcss-cli-linux-arm64-gnu: 1.28.1 + lightningcss-cli-linux-arm64-musl: 1.28.1 + lightningcss-cli-linux-x64-gnu: 1.28.1 + lightningcss-cli-linux-x64-musl: 1.28.1 + lightningcss-cli-win32-arm64-msvc: 1.28.1 + lightningcss-cli-win32-x64-msvc: 1.28.1 + lightningcss-darwin-arm64@1.24.1: optional: true + lightningcss-darwin-arm64@1.28.1: + optional: true + lightningcss-darwin-x64@1.24.1: optional: true + lightningcss-darwin-x64@1.28.1: + optional: true + lightningcss-freebsd-x64@1.24.1: optional: true + lightningcss-freebsd-x64@1.28.1: + optional: true + lightningcss-linux-arm-gnueabihf@1.24.1: optional: true + lightningcss-linux-arm-gnueabihf@1.28.1: + optional: true + lightningcss-linux-arm64-gnu@1.24.1: optional: true + lightningcss-linux-arm64-gnu@1.28.1: + optional: true + lightningcss-linux-arm64-musl@1.24.1: optional: true + lightningcss-linux-arm64-musl@1.28.1: + optional: true + lightningcss-linux-x64-gnu@1.24.1: optional: true + lightningcss-linux-x64-gnu@1.28.1: + optional: true + lightningcss-linux-x64-musl@1.24.1: optional: true + lightningcss-linux-x64-musl@1.28.1: + optional: true + + lightningcss-win32-arm64-msvc@1.28.1: + optional: true + lightningcss-win32-x64-msvc@1.24.1: optional: true + lightningcss-win32-x64-msvc@1.28.1: + optional: true + lightningcss@1.24.1: dependencies: detect-libc: 1.0.3 @@ -32943,6 +33759,21 @@ snapshots: lightningcss-linux-x64-musl: 1.24.1 lightningcss-win32-x64-msvc: 1.24.1 + lightningcss@1.28.1: + dependencies: + detect-libc: 1.0.3 + optionalDependencies: + lightningcss-darwin-arm64: 1.28.1 + lightningcss-darwin-x64: 1.28.1 + lightningcss-freebsd-x64: 1.28.1 + lightningcss-linux-arm-gnueabihf: 1.28.1 + lightningcss-linux-arm64-gnu: 1.28.1 + lightningcss-linux-arm64-musl: 1.28.1 + lightningcss-linux-x64-gnu: 1.28.1 + lightningcss-linux-x64-musl: 1.28.1 + lightningcss-win32-arm64-msvc: 1.28.1 + lightningcss-win32-x64-msvc: 1.28.1 + lilconfig@2.1.0: {} lilconfig@3.0.0: {} @@ -34330,7 +35161,7 @@ snapshots: '@next/env': 14.2.14 '@swc/helpers': 0.5.5 busboy: 1.6.0 - caniuse-lite: 1.0.30001669 + caniuse-lite: 1.0.30001676 graceful-fs: 4.2.11 postcss: 8.4.31 react: 18.2.0 @@ -34372,7 +35203,7 @@ snapshots: '@rollup/plugin-node-resolve': 15.2.3(rollup@4.24.0) '@rollup/plugin-replace': 5.0.7(rollup@4.24.0) '@rollup/plugin-terser': 0.4.4(rollup@4.24.0) - '@rollup/pluginutils': 5.1.0(rollup@4.24.0) + '@rollup/pluginutils': 5.1.2(rollup@4.24.0) '@types/http-proxy': 1.17.14 '@vercel/nft': 0.26.5(encoding@0.1.13) archiver: 7.0.1 @@ -34571,7 +35402,7 @@ snapshots: normalize-package-data@5.0.0: dependencies: hosted-git-info: 6.1.1 - is-core-module: 2.13.1 + is-core-module: 2.15.1 semver: 7.6.3 validate-npm-package-license: 3.0.4 @@ -34883,6 +35714,15 @@ snapshots: prelude-ls: 1.2.1 type-check: 0.4.0 + optionator@0.9.4: + dependencies: + deep-is: 0.1.4 + fast-levenshtein: 2.0.6 + levn: 0.4.1 + prelude-ls: 1.2.1 + type-check: 0.4.0 + word-wrap: 1.2.5 + ora@1.2.0: dependencies: chalk: 1.1.3 @@ -35122,7 +35962,7 @@ snapshots: parse-json@5.2.0: dependencies: - '@babel/code-frame': 7.24.2 + '@babel/code-frame': 7.25.7 error-ex: 1.3.2 json-parse-even-better-errors: 2.3.1 lines-and-columns: 1.2.4 @@ -36136,13 +36976,13 @@ snapshots: '@react-types/grid': 3.2.9(react@18.2.0) '@react-types/shared': 3.25.0(react@18.2.0) '@react-types/table': 3.10.2(react@18.2.0) - '@swc/helpers': 0.5.10 + '@swc/helpers': 0.5.13 client-only: 0.0.1 react: 18.2.0 react-aria: 3.35.0(react-dom@18.2.0(react@18.2.0))(react@18.2.0) react-dom: 18.2.0(react@18.2.0) react-stately: 3.33.0(react@18.2.0) - use-sync-external-store: 1.2.0(react@18.2.0) + use-sync-external-store: 1.2.2(react@18.2.0) react-aria-components@1.5.0(react-dom@18.2.0(react@18.2.0))(react@18.2.0): dependencies: @@ -37271,7 +38111,7 @@ snapshots: resolve@1.19.0: dependencies: - is-core-module: 2.13.1 + is-core-module: 2.15.1 path-parse: 1.0.7 resolve@1.22.8: @@ -37282,7 +38122,7 @@ snapshots: resolve@2.0.0-next.5: dependencies: - is-core-module: 2.13.1 + is-core-module: 2.15.1 path-parse: 1.0.7 supports-preserve-symlinks-flag: 1.0.0 @@ -37351,28 +38191,6 @@ snapshots: optionalDependencies: rollup: 4.24.0 - rollup@4.14.3: - dependencies: - '@types/estree': 1.0.5 - optionalDependencies: - '@rollup/rollup-android-arm-eabi': 4.14.3 - '@rollup/rollup-android-arm64': 4.14.3 - '@rollup/rollup-darwin-arm64': 4.14.3 - '@rollup/rollup-darwin-x64': 4.14.3 - '@rollup/rollup-linux-arm-gnueabihf': 4.14.3 - '@rollup/rollup-linux-arm-musleabihf': 4.14.3 - '@rollup/rollup-linux-arm64-gnu': 4.14.3 - '@rollup/rollup-linux-arm64-musl': 4.14.3 - '@rollup/rollup-linux-powerpc64le-gnu': 4.14.3 - '@rollup/rollup-linux-riscv64-gnu': 4.14.3 - '@rollup/rollup-linux-s390x-gnu': 4.14.3 - '@rollup/rollup-linux-x64-gnu': 4.14.3 - '@rollup/rollup-linux-x64-musl': 4.14.3 - '@rollup/rollup-win32-arm64-msvc': 4.14.3 - '@rollup/rollup-win32-ia32-msvc': 4.14.3 - '@rollup/rollup-win32-x64-msvc': 4.14.3 - fsevents: 2.3.3 - rollup@4.24.0: dependencies: '@types/estree': 1.0.6 @@ -38802,7 +39620,7 @@ snapshots: tslib@2.6.2: {} - tsup@8.3.5(@microsoft/api-extractor@7.43.0(@types/node@20.12.7))(@swc/core@1.4.16)(jiti@1.21.6)(postcss@8.4.47)(tsx@4.19.1)(typescript@5.6.3): + tsup@8.3.5(@microsoft/api-extractor@7.43.0(@types/node@20.16.10))(@swc/core@1.4.16)(jiti@1.21.6)(postcss@8.4.47)(tsx@4.19.1)(typescript@5.6.3): dependencies: bundle-require: 5.0.0(esbuild@0.24.0) cac: 6.7.14 @@ -38821,7 +39639,36 @@ snapshots: tinyglobby: 0.2.10 tree-kill: 1.2.2 optionalDependencies: - '@microsoft/api-extractor': 7.43.0(@types/node@20.12.7) + '@microsoft/api-extractor': 7.43.0(@types/node@20.16.10) + '@swc/core': 1.4.16 + postcss: 8.4.47 + typescript: 5.6.3 + transitivePeerDependencies: + - jiti + - supports-color + - tsx + - yaml + + tsup@8.3.5(@microsoft/api-extractor@7.43.0(@types/node@22.7.4))(@swc/core@1.4.16)(jiti@1.21.6)(postcss@8.4.47)(tsx@4.19.1)(typescript@5.6.3): + dependencies: + bundle-require: 5.0.0(esbuild@0.24.0) + cac: 6.7.14 + chokidar: 4.0.1 + consola: 3.2.3 + debug: 4.3.7 + esbuild: 0.24.0 + joycon: 3.1.1 + picocolors: 1.1.1 + postcss-load-config: 6.0.1(jiti@1.21.6)(postcss@8.4.47)(tsx@4.19.1) + resolve-from: 5.0.0 + rollup: 4.24.0 + source-map: 0.8.0-beta.0 + sucrase: 3.35.0 + tinyexec: 0.3.1 + tinyglobby: 0.2.10 + tree-kill: 1.2.2 + optionalDependencies: + '@microsoft/api-extractor': 7.43.0(@types/node@22.7.4) '@swc/core': 1.4.16 postcss: 8.4.47 typescript: 5.6.3 @@ -38959,6 +39806,8 @@ snapshots: undici-types@5.26.5: {} + undici-types@6.19.8: {} + undici@5.28.4: dependencies: '@fastify/busboy': 2.1.1 @@ -39214,7 +40063,7 @@ snapshots: dependencies: browserslist: 4.23.0 escalade: 3.1.2 - picocolors: 1.1.0 + picocolors: 1.1.1 update-browserslist-db@1.1.1(browserslist@4.24.0): dependencies: @@ -39267,7 +40116,7 @@ snapshots: is-npm: 6.0.0 latest-version: 7.0.0 pupa: 3.1.0 - semver: 7.6.0 + semver: 7.6.3 semver-diff: 4.0.0 xdg-basedir: 5.1.0 @@ -39429,7 +40278,7 @@ snapshots: unist-util-stringify-position: 4.0.0 vfile-message: 4.0.2 - vinxi@0.4.3(@types/node@20.12.7)(encoding@0.1.13)(ioredis@5.4.1)(less@3.11.1)(lightningcss@1.24.1)(magicast@0.3.4)(sass@1.75.0)(terser@5.30.3)(webpack-sources@3.2.3): + vinxi@0.4.3(@types/node@22.7.4)(encoding@0.1.13)(ioredis@5.4.1)(less@3.11.1)(lightningcss@1.28.1)(magicast@0.3.4)(sass@1.75.0)(terser@5.30.3)(webpack-sources@3.2.3): dependencies: '@babel/core': 7.25.8 '@babel/plugin-syntax-jsx': 7.25.7(@babel/core@7.25.8) @@ -39463,7 +40312,7 @@ snapshots: unctx: 2.3.1 unenv: 1.9.0 unstorage: 1.10.2(ioredis@5.4.1) - vite: 5.4.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + vite: 5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) zod: 3.23.8 transitivePeerDependencies: - '@azure/app-configuration' @@ -39515,13 +40364,13 @@ snapshots: remove-trailing-separator: 1.1.0 replace-ext: 1.0.1 - vite-node@1.5.0(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3): + vite-node@1.5.0(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3): dependencies: cac: 6.7.14 debug: 4.3.4(supports-color@8.1.1) pathe: 1.1.2 picocolors: 1.1.0 - vite: 5.4.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + vite: 5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) transitivePeerDependencies: - '@types/node' - less @@ -39533,13 +40382,30 @@ snapshots: - supports-color - terser - vite-node@1.6.0(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3): + vite-node@1.6.0(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3): dependencies: cac: 6.7.14 debug: 4.3.4(supports-color@8.1.1) pathe: 1.1.2 picocolors: 1.1.1 - vite: 5.4.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + vite: 5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) + transitivePeerDependencies: + - '@types/node' + - less + - lightningcss + - sass + - sass-embedded + - stylus + - sugarss + - supports-color + - terser + + vite-node@2.1.3(@types/node@20.16.10)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3): + dependencies: + cac: 6.7.14 + debug: 4.3.7 + pathe: 1.1.2 + vite: 5.4.9(@types/node@20.16.10)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) transitivePeerDependencies: - '@types/node' - less @@ -39551,12 +40417,12 @@ snapshots: - supports-color - terser - vite-node@2.1.3(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3): + vite-node@2.1.3(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3): dependencies: cac: 6.7.14 debug: 4.3.7 pathe: 1.1.2 - vite: 5.4.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + vite: 5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) transitivePeerDependencies: - '@types/node' - less @@ -39568,14 +40434,31 @@ snapshots: - supports-color - terser - vite-plugin-babel@1.2.0(@babel/core@7.24.4)(vite@5.2.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)): + vite-node@2.1.3(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3): + dependencies: + cac: 6.7.14 + debug: 4.3.7 + pathe: 1.1.2 + vite: 5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) + transitivePeerDependencies: + - '@types/node' + - less + - lightningcss + - sass + - sass-embedded + - stylus + - sugarss + - supports-color + - terser + + vite-plugin-babel@1.2.0(@babel/core@7.24.4)(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3)): dependencies: '@babel/core': 7.24.4 - vite: 5.2.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + vite: 5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) - vite-plugin-dts@3.8.3(@types/node@20.12.7)(rollup@4.24.0)(typescript@5.6.3)(vite@5.4.8(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)): + vite-plugin-dts@3.8.3(@types/node@22.7.4)(rollup@4.24.0)(typescript@5.6.3)(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3)): dependencies: - '@microsoft/api-extractor': 7.43.0(@types/node@20.12.7) + '@microsoft/api-extractor': 7.43.0(@types/node@22.7.4) '@rollup/pluginutils': 5.1.0(rollup@4.24.0) '@vue/language-core': 1.8.27(typescript@5.6.3) debug: 4.3.4(supports-color@8.1.1) @@ -39584,74 +40467,84 @@ snapshots: typescript: 5.6.3 vue-tsc: 1.8.27(typescript@5.6.3) optionalDependencies: - vite: 5.4.8(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + vite: 5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) transitivePeerDependencies: - '@types/node' - rollup - supports-color - vite-tsconfig-paths@4.3.2(typescript@5.6.3)(vite@5.4.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)): + vite-tsconfig-paths@4.3.2(typescript@5.6.3)(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3)): dependencies: debug: 4.3.4(supports-color@8.1.1) globrex: 0.1.2 tsconfck: 3.0.3(typescript@5.6.3) optionalDependencies: - vite: 5.4.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + vite: 5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) transitivePeerDependencies: - supports-color - typescript - vite-tsconfig-paths@5.1.0(typescript@5.6.3)(vite@5.4.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)): + vite-tsconfig-paths@5.1.0(typescript@5.6.3)(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3)): dependencies: debug: 4.3.4(supports-color@8.1.1) globrex: 0.1.2 tsconfck: 3.0.3(typescript@5.6.3) optionalDependencies: - vite: 5.4.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + vite: 5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) transitivePeerDependencies: - supports-color - typescript - vite@5.2.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3): + vite@5.4.9(@types/node@20.16.10)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3): dependencies: - esbuild: 0.20.2 + esbuild: 0.21.5 postcss: 8.4.47 - rollup: 4.14.3 + rollup: 4.24.0 optionalDependencies: - '@types/node': 20.12.7 + '@types/node': 20.16.10 fsevents: 2.3.3 less: 3.11.1 - lightningcss: 1.24.1 + lightningcss: 1.28.1 sass: 1.75.0 terser: 5.30.3 - vite@5.4.8(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3): + vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3): dependencies: esbuild: 0.21.5 postcss: 8.4.47 rollup: 4.24.0 optionalDependencies: - '@types/node': 20.12.7 + '@types/node': 22.7.4 fsevents: 2.3.3 less: 3.11.1 lightningcss: 1.24.1 sass: 1.75.0 terser: 5.30.3 - vite@5.4.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3): + vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3): dependencies: esbuild: 0.21.5 postcss: 8.4.47 rollup: 4.24.0 optionalDependencies: - '@types/node': 20.12.7 + '@types/node': 22.7.4 fsevents: 2.3.3 less: 3.11.1 - lightningcss: 1.24.1 + lightningcss: 1.28.1 sass: 1.75.0 terser: 5.30.3 - vitest-axe@0.1.0(vitest@2.1.3(@types/node@20.12.7)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)): + vitest-axe@0.1.0(vitest@2.1.3(@types/node@22.7.4)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)): + dependencies: + aria-query: 5.3.0 + axe-core: 4.8.4 + chalk: 5.3.0 + dom-accessibility-api: 0.5.16 + lodash-es: 4.17.21 + redent: 3.0.0 + vitest: 2.1.3(@types/node@22.7.4)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + + vitest-axe@0.1.0(vitest@2.1.3(@types/node@22.7.4)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3)): dependencies: aria-query: 5.3.0 axe-core: 4.8.4 @@ -39659,12 +40552,47 @@ snapshots: dom-accessibility-api: 0.5.16 lodash-es: 4.17.21 redent: 3.0.0 - vitest: 2.1.3(@types/node@20.12.7)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + vitest: 2.1.3(@types/node@22.7.4)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) + + vitest@2.1.3(@types/node@20.16.10)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3): + dependencies: + '@vitest/expect': 2.1.3 + '@vitest/mocker': 2.1.3(@vitest/spy@2.1.3)(vite@5.4.9(@types/node@20.16.10)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3)) + '@vitest/pretty-format': 2.1.3 + '@vitest/runner': 2.1.3 + '@vitest/snapshot': 2.1.3 + '@vitest/spy': 2.1.3 + '@vitest/utils': 2.1.3 + chai: 5.1.1 + debug: 4.3.7 + magic-string: 0.30.11 + pathe: 1.1.2 + std-env: 3.7.0 + tinybench: 2.9.0 + tinyexec: 0.3.0 + tinypool: 1.0.1 + tinyrainbow: 1.2.0 + vite: 5.4.9(@types/node@20.16.10)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) + vite-node: 2.1.3(@types/node@20.16.10)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) + why-is-node-running: 2.3.0 + optionalDependencies: + '@types/node': 20.16.10 + jsdom: 22.1.0 + transitivePeerDependencies: + - less + - lightningcss + - msw + - sass + - sass-embedded + - stylus + - sugarss + - supports-color + - terser - vitest@2.1.3(@types/node@20.12.7)(jsdom@16.7.0)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3): + vitest@2.1.3(@types/node@22.7.4)(jsdom@16.7.0)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3): dependencies: '@vitest/expect': 2.1.3 - '@vitest/mocker': 2.1.3(@vitest/spy@2.1.3)(vite@5.4.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)) + '@vitest/mocker': 2.1.3(@vitest/spy@2.1.3)(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3)) '@vitest/pretty-format': 2.1.3 '@vitest/runner': 2.1.3 '@vitest/snapshot': 2.1.3 @@ -39679,11 +40607,11 @@ snapshots: tinyexec: 0.3.0 tinypool: 1.0.1 tinyrainbow: 1.2.0 - vite: 5.4.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) - vite-node: 2.1.3(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + vite: 5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) + vite-node: 2.1.3(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) why-is-node-running: 2.3.0 optionalDependencies: - '@types/node': 20.12.7 + '@types/node': 22.7.4 jsdom: 16.7.0 transitivePeerDependencies: - less @@ -39697,10 +40625,10 @@ snapshots: - terser optional: true - vitest@2.1.3(@types/node@20.12.7)(jsdom@21.1.2)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3): + vitest@2.1.3(@types/node@22.7.4)(jsdom@21.1.2)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3): dependencies: '@vitest/expect': 2.1.3 - '@vitest/mocker': 2.1.3(@vitest/spy@2.1.3)(vite@5.4.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)) + '@vitest/mocker': 2.1.3(@vitest/spy@2.1.3)(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3)) '@vitest/pretty-format': 2.1.3 '@vitest/runner': 2.1.3 '@vitest/snapshot': 2.1.3 @@ -39715,11 +40643,11 @@ snapshots: tinyexec: 0.3.0 tinypool: 1.0.1 tinyrainbow: 1.2.0 - vite: 5.4.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) - vite-node: 2.1.3(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + vite: 5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) + vite-node: 2.1.3(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) why-is-node-running: 2.3.0 optionalDependencies: - '@types/node': 20.12.7 + '@types/node': 22.7.4 jsdom: 21.1.2 transitivePeerDependencies: - less @@ -39732,10 +40660,10 @@ snapshots: - supports-color - terser - vitest@2.1.3(@types/node@20.12.7)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3): + vitest@2.1.3(@types/node@22.7.4)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3): dependencies: '@vitest/expect': 2.1.3 - '@vitest/mocker': 2.1.3(@vitest/spy@2.1.3)(vite@5.4.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)) + '@vitest/mocker': 2.1.3(@vitest/spy@2.1.3)(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3)) '@vitest/pretty-format': 2.1.3 '@vitest/runner': 2.1.3 '@vitest/snapshot': 2.1.3 @@ -39750,11 +40678,46 @@ snapshots: tinyexec: 0.3.0 tinypool: 1.0.1 tinyrainbow: 1.2.0 - vite: 5.4.9(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) - vite-node: 2.1.3(@types/node@20.12.7)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + vite: 5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) + vite-node: 2.1.3(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.24.1)(sass@1.75.0)(terser@5.30.3) why-is-node-running: 2.3.0 optionalDependencies: - '@types/node': 20.12.7 + '@types/node': 22.7.4 + jsdom: 22.1.0 + transitivePeerDependencies: + - less + - lightningcss + - msw + - sass + - sass-embedded + - stylus + - sugarss + - supports-color + - terser + + vitest@2.1.3(@types/node@22.7.4)(jsdom@22.1.0)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3): + dependencies: + '@vitest/expect': 2.1.3 + '@vitest/mocker': 2.1.3(@vitest/spy@2.1.3)(vite@5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3)) + '@vitest/pretty-format': 2.1.3 + '@vitest/runner': 2.1.3 + '@vitest/snapshot': 2.1.3 + '@vitest/spy': 2.1.3 + '@vitest/utils': 2.1.3 + chai: 5.1.1 + debug: 4.3.7 + magic-string: 0.30.11 + pathe: 1.1.2 + std-env: 3.7.0 + tinybench: 2.9.0 + tinyexec: 0.3.0 + tinypool: 1.0.1 + tinyrainbow: 1.2.0 + vite: 5.4.9(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) + vite-node: 2.1.3(@types/node@22.7.4)(less@3.11.1)(lightningcss@1.28.1)(sass@1.75.0)(terser@5.30.3) + why-is-node-running: 2.3.0 + optionalDependencies: + '@types/node': 22.7.4 jsdom: 22.1.0 transitivePeerDependencies: - less @@ -39776,7 +40739,7 @@ snapshots: dependencies: '@volar/typescript': 1.11.1 '@vue/language-core': 1.8.27(typescript@5.6.3) - semver: 7.6.0 + semver: 7.6.3 typescript: 5.6.3 w3c-hr-time@1.0.2: @@ -40143,6 +41106,8 @@ snapshots: dependencies: execa: 5.1.1 + word-wrap@1.2.5: {} + wordwrap@1.0.0: {} worker-rpc@0.1.1: