change formatting back to single quotes

Zuehlke · Jul 15, 2024 · b71866a · b71866a
1 parent d2a213e
commit b71866a
Show file tree

Hide file tree

Showing 4 changed files with 37 additions and 37 deletions.
diff --git a/web-components/.storybook/main.ts b/web-components/.storybook/main.ts
@@ -1,23 +1,23 @@
-import { dirname, join } from "path";
-import { mergeConfig } from "vite";
-import turbosnap from "vite-plugin-turbosnap";
-import { StorybookConfig } from "@storybook/web-components-vite";
+import { dirname, join } from 'path';
+import { mergeConfig } from 'vite';
+import turbosnap from 'vite-plugin-turbosnap';
+import { StorybookConfig } from '@storybook/web-components-vite';
 
 const config: StorybookConfig = {
-  stories: ["../src/**/*.mdx", "../src/**/*.stories.@(js|jsx|ts|tsx)"],
+  stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|jsx|ts|tsx)'],
   addons: [
-    getAbsolutePath("@storybook/addon-links"),
-    getAbsolutePath("@storybook/addon-essentials"),
-    getAbsolutePath("@storybook/addon-themes"),
+    getAbsolutePath('@storybook/addon-links'),
+    getAbsolutePath('@storybook/addon-essentials'),
+    getAbsolutePath('@storybook/addon-themes'),
   ],
   framework: {
-    name: "@storybook/web-components-vite",
+    name: '@storybook/web-components-vite',
     options: {},
   },
   async viteFinal(config, { configType }) {
     return mergeConfig(config, {
       plugins:
-        configType === "PRODUCTION"
+        configType === 'PRODUCTION'
           ? [turbosnap({ rootDir: config.root ?? process.cwd() })]
           : [],
     });
@@ -27,5 +27,5 @@ const config: StorybookConfig = {
 export default config;
 
 function getAbsolutePath(value: string) {
-  return dirname(require.resolve(join(value, "package.json")));
+  return dirname(require.resolve(join(value, 'package.json')));
 }
diff --git a/web-components/.storybook/preview.ts b/web-components/.storybook/preview.ts
@@ -1,16 +1,16 @@
-import "element-internals-polyfill";
-import { setCustomElementsManifest } from "@storybook/web-components";
-import { withThemeByClassName } from "@storybook/addon-themes";
-import customElements from "../dist/custom-elements.json";
-import designTokens from "../src/rootStyles/design-tokens.json";
-import "../src/rootStyles/style.css";
+import 'element-internals-polyfill';
+import { setCustomElementsManifest } from '@storybook/web-components';
+import { withThemeByClassName } from '@storybook/addon-themes';
+import customElements from '../dist/custom-elements.json';
+import designTokens from '../src/rootStyles/design-tokens.json';
+import '../src/rootStyles/style.css';
 
 customElements?.modules?.forEach((module) => {
   module?.declarations?.forEach((declaration) => {
     Object.keys(declaration).forEach((key) => {
       if (Array.isArray(declaration[key])) {
         declaration[key] = declaration[key].filter(
-          (member) => !member.privacy?.includes("private")
+          (member) => !member.privacy?.includes('private'),
         );
       }
     });
@@ -31,12 +31,12 @@ export const parameters = {
   },
   options: {
     storySort: {
-      order: ["Intro", "Design Guidelines", "Design Tokens", "*"],
+      order: ['Intro', 'Design Guidelines', 'Design Tokens', '*'],
     },
   },
 };
 
-const themes = Object.keys(designTokens["semantic-tokens"]);
+const themes = Object.keys(designTokens['semantic-tokens']);
 const themesObject = Object.fromEntries(themes.map((theme) => [theme, theme]));
 
 export const decorators = [
@@ -46,4 +46,4 @@ export const decorators = [
   }),
 ];
 
-export const tags = ["autodocs"];
+export const tags = ['autodocs'];
diff --git a/web-components/tokens/formatters/cssFigmaVariables.cjs b/web-components/tokens/formatters/cssFigmaVariables.cjs
@@ -1,12 +1,12 @@
 const PATHS = {
-  themes: "semantic-tokens",
-  viewPorts: "constraints",
+  themes: 'semantic-tokens',
+  viewPorts: 'constraints',
 };
 
 // TODO: extract the break points from figma
 const MEDIA_QUERIES = {
-  desktop: "@media (min-width: 481px)",
-  mobile: "@media (max-width: 480px)",
+  desktop: '@media (min-width: 481px)',
+  mobile: '@media (max-width: 480px)',
 };
 
 function extractThemesFrom(dictionary) {
@@ -25,13 +25,13 @@ function toCssVariable(property, { availableCategories = [] } = {}) {
   const category =
     availableCategories.find(
       (category) => category === property.attributes.type
-    ) ?? "default";
+    ) ?? 'default';
 
   let name = property.name;
-  if (category !== "default") {
-    name = property.name.replace(`${category}-`, "");
+  if (category !== 'default') {
+    name = property.name.replace(`${category}-`, '');
     Object.values(PATHS).forEach(
-      (path) => (name = name.replace(`${path}-`, ""))
+      (path) => (name = name.replace(`${path}-`, ''))
     );
   }
 
@@ -55,7 +55,7 @@ class CssVariables {
     category,
     { cssSelector = `.${category}`, mediaQuery = null } = {}
   ) {
-    const categoryVariables = this.#variables[category].join("\n");
+    const categoryVariables = this.#variables[category].join('\n');
 
     let result = `${cssSelector} {\n${categoryVariables}\n}`;
     if (mediaQuery) result = `${mediaQuery} {\n${result}\n}`;
@@ -79,16 +79,16 @@ module.exports = {
       .forEach((cssVariable) => cssVariables.add(cssVariable));
 
     return [
-      cssVariables.getFormatted("default", { cssSelector: ":root" }),
+      cssVariables.getFormatted('default', { cssSelector: ':root' }),
       ...themes.map((theme) =>
-        cssVariables.getFormatted(theme, { cssSelector: `.${theme}` })
+        cssVariables.getFormatted(theme, { cssSelector: `.${theme}` }),
       ),
       ...viewPorts.map((viewport) =>
         cssVariables.getFormatted(viewport, {
           mediaQuery: MEDIA_QUERIES[viewport],
-          cssSelector: ":root",
-        })
+          cssSelector: ':root',
+        }),
       ),
-    ].join("\n");
+    ].join('\n');
   },
 };
diff --git a/web-components/tokens/style-dictionary.cjs b/web-components/tokens/style-dictionary.cjs
@@ -59,8 +59,8 @@ StyleDictionary.registerTransform({
 });
 
 StyleDictionary.registerFormat({
-  name: "css/figma-variables",
-  ...require("./formatters/cssFigmaVariables.cjs"),
+  name: 'css/figma-variables',
+  ...require('./formatters/cssFigmaVariables.cjs'),
 });
 
 StyleDictionary.registerTransformGroup({