fix yaml indentation (#22)

Co-authored-by: autofix-ci[bot] <114827586+autofix-ci[bot]@users.noreply.github.com>
DigitecGalaxus · Oct 27, 2023 · 8c839ca · 8c839ca
1 parent 4c7deba
commit 8c839ca
Show file tree

Hide file tree

Showing 13 changed files with 99 additions and 97 deletions.
diff --git a/.github/workflows/autofix.yml b/.github/workflows/autofix.yml
@@ -10,7 +10,7 @@ jobs:
   autofix:
     runs-on: ubuntu-latest
     steps:
-     - name: Checkout
+      - name: Checkout
         uses: actions/checkout@v3
 
       - name: Install Node.js
@@ -41,9 +41,9 @@ jobs:
         run: pnpm install
 
       - name: Prettier Yak Runtime
-        run: npx prettier --write packages/next-yak/runtime/**/*.{ts,tsx,js,jsx}
+        run: npx prettier --write "packages/next-yak/runtime/**/*.{ts,tsx,js,jsx}"
 
       - name: Prettier Examples
-        run: npx prettier --write packages/example/app/**/*.{ts,tsx,js,jsx}
+        run: npx prettier --write "packages/example/app/**/*.{ts,tsx,js,jsx}"
 
       - uses: autofix-ci/action@d3e591514b99d0fca6779455ff8338516663f7cc
diff --git a/packages/example/app/ClockHands.tsx b/packages/example/app/ClockHands.tsx
@@ -6,12 +6,12 @@ export const ClockHands = () => {
   const currentTime = useCurrentTime();
   if (currentTime === null) return null;
   return (
-          <>
-            <SecondHand $angle={currentTime.secondsAngle} />
-            <MinuteHand $angle={currentTime.minutesAngle} />
-            <HourHand $angle={currentTime.hoursAngle} />
-          </>
-        )
+    <>
+      <SecondHand $angle={currentTime.secondsAngle} />
+      <MinuteHand $angle={currentTime.minutesAngle} />
+      <HourHand $angle={currentTime.hoursAngle} />
+    </>
+  );
 };
 
 const useCurrentTime = () => {
@@ -67,4 +67,4 @@ const HourHand = styled(ClockHand)`
   height: 30%;
   background: black;
   translate: 0 0 40px;
-`;
+`;
diff --git a/packages/example/app/HighContrastToggle.tsx b/packages/example/app/HighContrastToggle.tsx
@@ -29,20 +29,26 @@ const Button = styled.button<{ $primary?: boolean }>`
 `;
 
 export const HighContrastToggle = () => {
-    const router = useRouter();
-    const theme = useTheme();
-    return <Button onClick={() => {
+  const router = useRouter();
+  const theme = useTheme();
+  return (
+    <Button
+      onClick={() => {
         setCookie("highContrast", theme.highContrast ? "false" : "true");
         router.refresh();
-    }}>Toggle High Contrast</Button>;
-}
+      }}
+    >
+      Toggle High Contrast
+    </Button>
+  );
+};
 
-function setCookie(name: string,value: string,days: number = 365) {
-    var expires = "";
-    if (days) {
-        var date = new Date();
-        date.setTime(date.getTime() + (days*24*60*60*1000));
-        expires = "; expires=" + date.toUTCString();
-    }
-    document.cookie = name + "=" + (value || "")  + expires + "; path=/";
-}
+function setCookie(name: string, value: string, days: number = 365) {
+  var expires = "";
+  if (days) {
+    var date = new Date();
+    date.setTime(date.getTime() + days * 24 * 60 * 60 * 1000);
+    expires = "; expires=" + date.toUTCString();
+  }
+  document.cookie = name + "=" + (value || "") + expires + "; path=/";
+}
diff --git a/packages/example/app/keyframes/page.tsx b/packages/example/app/keyframes/page.tsx
@@ -1,7 +1,6 @@
 import { styled, keyframes } from "next-yak";
 import styles from "../page.module.css";
 
-
 const rotate = keyframes`
   from {
     transform: rotate(0deg);

diff --git a/packages/example/app/layout.tsx b/packages/example/app/layout.tsx
@@ -1,22 +1,22 @@
-import './globals.css'
-import type { Metadata } from 'next'
-import { Inter } from 'next/font/google'
+import "./globals.css";
+import type { Metadata } from "next";
+import { Inter } from "next/font/google";
 
-const inter = Inter({ subsets: ['latin'] })
+const inter = Inter({ subsets: ["latin"] });
 
 export const metadata: Metadata = {
-  title: 'CSS in JS POC',
-  description: 'Styled Components API with ReactServerComponents',
-}
+  title: "CSS in JS POC",
+  description: "Styled Components API with ReactServerComponents",
+};
 
 export default function RootLayout({
   children,
 }: {
-  children: React.ReactNode
+  children: React.ReactNode;
 }) {
   return (
     <html lang="en">
       <body className={inter.className}>{children}</body>
     </html>
-  )
+  );
 }
diff --git a/packages/next-yak/runtime/__tests__/attrs.test.tsx b/packages/next-yak/runtime/__tests__/attrs.test.tsx
@@ -131,7 +131,7 @@ it("pass props to the attr function", () => {
       style={{}}
       type="submit"
     />
-  `
+  `,
   );
 });
 
@@ -224,8 +224,8 @@ it("should merge style", () => {
 
   expect(
     TestRenderer.create(
-      <Comp style={{ color: "green", borderStyle: "dotted" }} />
-    ).toJSON()
+      <Comp style={{ color: "green", borderStyle: "dotted" }} />,
+    ).toJSON(),
   ).toMatchInlineSnapshot(`
     <div
       className=""
@@ -440,7 +440,7 @@ it("should remap props", () => {
     (p) => ({
       type: p.$submit ? "submit" : "button",
       $primary: p.primary,
-    })
+    }),
   )<{ $primary?: boolean }>``;
 
   expect(TestRenderer.create(<Comp />).toJSON()).toMatchInlineSnapshot(`

diff --git a/packages/next-yak/runtime/__tests__/styled.test.tsx b/packages/next-yak/runtime/__tests__/styled.test.tsx
@@ -58,7 +58,7 @@ it("should forward children", () => {
   const { container } = render(
     <Component>
       <button>Click me!</button>
-    </Component>
+    </Component>,
   );
 
   expect(container).toMatchInlineSnapshot(`
@@ -153,7 +153,7 @@ it("should allow falsy values", () => {
       <Component $testProp={null} />
       <Component $testProp={false} />
       <Component $testProp={undefined} />
-    </>
+    </>,
   );
 
   expect(container).toMatchInlineSnapshot(`
@@ -178,8 +178,8 @@ it("should execute runtime styles recursively", () => {
       css(
         ({ $testProp }) =>
           $testProp &&
-          css(({ $testProp }) => $testProp && css("recursive-test-class"))
-      )
+          css(({ $testProp }) => $testProp && css("recursive-test-class")),
+      ),
   );
 
   const { container } = render(<Component $testProp />);
@@ -202,7 +202,7 @@ it("should allow using refs", () => {
       ref={(element) => {
         elementFromRef = element;
       }}
-    />
+    />,
   );
 
   expect(elementFromRef).toBeInstanceOf(HTMLInputElement);
@@ -218,7 +218,7 @@ it("should allow using nested refs", () => {
       ref={(element) => {
         elementFromRef = element;
       }}
-    />
+    />,
   );
 
   expect(elementFromRef).toBeInstanceOf(HTMLInputElement);

diff --git a/packages/next-yak/runtime/atoms.tsx b/packages/next-yak/runtime/atoms.tsx
@@ -1,18 +1,18 @@
 /**
  * Allows to use atomic CSS classes in a styled or css block
- * 
+ *
  * @usage
- * 
+ *
  * ```tsx
  * import { styled, atoms } from "next-yak";
- * 
+ *
  * const Button = styled.button<{ $primary?: boolean }>`
  *  ${atoms("text-teal-600", "text-base", "rounded-md")}
  *  ${props => props.$primary && atoms("shadow-md")}
  * `;
  * ```
  */
 export const atoms = (...atoms: string[]) => {
-    const className = atoms.join(" ");
-    return () => ({ className });
-};
+  const className = atoms.join(" ");
+  return () => ({ className });
+};
diff --git a/packages/next-yak/runtime/context/index.tsx b/packages/next-yak/runtime/context/index.tsx
@@ -2,30 +2,26 @@
 //
 // This file is the client component (browser & ssr) version of index.server.tsx
 //
-import React, {
-  ReactNode,
-  createContext,
-  useContext,
-} from "react";
+import React, { ReactNode, createContext, useContext } from "react";
 
-export interface YakTheme { }
+export interface YakTheme {}
 
-/** 
+/**
  * The yak theme context
  * @see https://github.com/jantimon/next-yak/blob/main/packages/next-yak/runtime/context/README.md
  */
 const YakContext = createContext<YakTheme>({});
 
-/** 
+/**
  * Returns the current yak theme context
- * 
+ *
  * @see https://github.com/jantimon/next-yak/blob/main/packages/next-yak/runtime/context/README.md
  */
 export const useTheme = (): YakTheme => useContext(YakContext);
 
-/** 
+/**
  * Yak theme context provider
- * 
+ *
  * @see https://github.com/jantimon/next-yak/blob/main/packages/next-yak/runtime/context/README.md
  */
 export const YakThemeProvider = ({

diff --git a/packages/next-yak/runtime/cssLiteral.tsx b/packages/next-yak/runtime/cssLiteral.tsx
@@ -27,14 +27,14 @@ type CSSFunction = <TProps = {}>(
 
 /**
  * css() runtime factory of css``
- * 
+ *
  * /!\ next-yak transpiles css`` and styled``
- * 
+ *
  * This changes the typings of the css`` and styled`` functions.
  * During development the user of next-yak wants to work with the
  * typings BEFORE compilation.
- * 
- * Therefore this is only an internal function only and it must be cast to any 
+ *
+ * Therefore this is only an internal function only and it must be cast to any
  * before exported to the user.
  */
 const internalCssFactory = (
@@ -78,7 +78,7 @@ const internalCssFactory = (
     props: unknown,
     fn: PropsToClassNameFn,
     classNames: string[],
-    style: Record<string, string>
+    style: Record<string, string>,
   ) => {
     const result = fn(props);
     if (typeof result === "function") {
@@ -111,7 +111,7 @@ const internalCssFactory = (
 
 const recursivePropExecution = (
   props: unknown,
-  fn: (props: unknown) => any
+  fn: (props: unknown) => any,
 ): string | number => {
   const result = fn(props);
   if (typeof result === "function") {
@@ -125,8 +125,8 @@ const recursivePropExecution = (
     ) {
       throw new Error(
         `Dynamic CSS functions must return a string or number but returned ${JSON.stringify(
-          result
-        )}`
+          result,
+        )}`,
       );
     }
   }

diff --git a/packages/next-yak/runtime/index.ts b/packages/next-yak/runtime/index.ts
@@ -6,6 +6,6 @@ export { keyframes } from "./keyframes.js";
 // the following export is not relative as "next-yak/context"
 // links to one file for react server components and
 // to another file for classic react components
-export { useTheme, YakThemeProvider} from "next-yak/context"
+export { useTheme, YakThemeProvider } from "next-yak/context";
 
-export type { YakTheme } from "./context/index.d.ts";
+export type { YakTheme } from "./context/index.d.ts";
diff --git a/packages/next-yak/runtime/keyframes.tsx b/packages/next-yak/runtime/keyframes.tsx
@@ -1,11 +1,11 @@
 /**
  * Allows to use CSS keyframe animations in a styled or css block
- * 
+ *
  * @usage
- * 
+ *
  * ```tsx
  * import { styled, keyframes } from "next-yak";
- * 
+ *
  * const rotate = keyframes`
  *  from {
  *   transform: rotate(0deg);
@@ -14,16 +14,17 @@
  *   transform: rotate(360deg);
  *  }
  * `;
- * 
+ *
  * const Spinner = styled.div`
  *   animation: ${rotate} 1s linear infinite;
  * `;
  * ```
  */
-export const keyframes = (styles: TemplateStringsArray, 
-    ...dynamic: never[]
-    ): string => {
-    // during compilation all args of keyframe are compiled
-    // to a string which references the animation name  
-    return styles as any as string;
-};
+export const keyframes = (
+  styles: TemplateStringsArray,
+  ...dynamic: never[]
+): string => {
+  // during compilation all args of keyframe are compiled
+  // to a string which references the animation name
+  return styles as any as string;
+};