(
- "london"
+ "london",
);
return (
@@ -754,7 +754,7 @@ describe("", () => {
await user.click(
screen.getByRole("option", {
name: "New York",
- })
+ }),
);
// Make sure value is selected.
@@ -795,7 +795,7 @@ describe("", () => {
]}
disabled={true}
/>
-
+ ,
);
const input = screen.getByRole("combobox", {
name: "City",
@@ -803,7 +803,7 @@ describe("", () => {
expect(input).toHaveAttribute("disabled");
const button: HTMLButtonElement = document.querySelector(
- ".c__select__inner__actions__open"
+ ".c__select__inner__actions__open",
)!;
expect(button).toBeDisabled();
@@ -849,7 +849,7 @@ describe("", () => {
]}
text="This is a text"
/>
-
+ ,
);
screen.getByText("This is a text");
});
@@ -879,10 +879,10 @@ describe("", () => {
text="This is a text"
state="error"
/>
-
+ ,
);
expect(
- document.querySelector(".c__select.c__select--error")
+ document.querySelector(".c__select.c__select--error"),
).toBeInTheDocument();
});
it("renders with state=success", async () => {
@@ -911,10 +911,10 @@ describe("", () => {
text="This is a text"
state="success"
/>
-
+ ,
);
expect(
- document.querySelector(".c__select.c__select--success")
+ document.querySelector(".c__select.c__select--success"),
).toBeInTheDocument();
});
it("submits form data", async () => {
@@ -986,7 +986,7 @@ describe("", () => {
await user.click(
screen.getByRole("option", {
name: "New York",
- })
+ }),
);
// Submit the form being fulfilled.
@@ -1030,7 +1030,7 @@ describe("", () => {
clearable={false}
defaultValue="Paris"
/>
-
+ ,
);
screen.getByRole("combobox", {
name: "City",
@@ -1043,7 +1043,7 @@ describe("", () => {
expect(
screen.queryByRole("button", {
name: "Clear selection",
- })
+ }),
).not.toBeInTheDocument();
});
it("is not possible to select disabled options", async () => {
@@ -1067,7 +1067,7 @@ describe("", () => {
},
]}
/>
-
+ ,
);
const input = screen.getByRole("combobox", {
name: "City",
@@ -1129,7 +1129,7 @@ describe("", () => {
]}
hideLabel={true}
/>
-
+ ,
);
// Make sure the input is accessible.
screen.getByRole("combobox", {
diff --git a/packages/react/src/components/Forms/Select/mono.tsx b/packages/react/src/components/Forms/Select/mono.tsx
index 7e43392..7d7d9d2 100644
--- a/packages/react/src/components/Forms/Select/mono.tsx
+++ b/packages/react/src/components/Forms/Select/mono.tsx
@@ -31,7 +31,7 @@ export type SelectProps = PropsWithChildren &
export const SelectMono = (props: SelectProps) => {
const defaultSelectedItem = props.defaultValue
? props.options.find(
- (option) => optionToValue(option) === props.defaultValue
+ (option) => optionToValue(option) === props.defaultValue,
)
: undefined;
diff --git a/packages/react/src/components/Forms/Select/multi-common.tsx b/packages/react/src/components/Forms/Select/multi-common.tsx
index 5b2e792..ecebdae 100644
--- a/packages/react/src/components/Forms/Select/multi-common.tsx
+++ b/packages/react/src/components/Forms/Select/multi-common.tsx
@@ -23,14 +23,14 @@ import {
*/
export function getMultiOptionsFilter(
selectedOptions: Option[],
- inputValue?: string
+ inputValue?: string,
) {
const optionsFilter = getOptionsFilter(inputValue);
return (option: Option) => {
return (
!selectedOptions.find(
(selectedOption) =>
- optionToValue(selectedOption) === optionToValue(option)
+ optionToValue(selectedOption) === optionToValue(option),
) && optionsFilter(option)
);
};
@@ -85,7 +85,7 @@ export const SelectMultiAux = ({
{
"c__select--disabled": disabled,
"c__select--populated": selectedItems.length > 0,
- }
+ },
)}
>
{
@@ -164,13 +164,13 @@ export const SelectMultiAux = ({
disabled={disabled}
size="small"
aria-label={t(
- "components.forms.select.clear_button_aria_label"
+ "components.forms.select.clear_button_aria_label",
)}
className="c__select__inner__value__pill__clear"
onClick={(e) => {
e.stopPropagation();
useMultipleSelectionReturn.removeSelectedItem(
- selectedItemForRender
+ selectedItemForRender,
);
}}
icon={close}
diff --git a/packages/react/src/components/Forms/Select/multi-searchable.tsx b/packages/react/src/components/Forms/Select/multi-searchable.tsx
index 3bcba51..b836b3f 100644
--- a/packages/react/src/components/Forms/Select/multi-searchable.tsx
+++ b/packages/react/src/components/Forms/Select/multi-searchable.tsx
@@ -13,9 +13,9 @@ export const SelectMultiSearchable = (props: SubProps) => {
const options = React.useMemo(
() =>
props.options.filter(
- getMultiOptionsFilter(props.selectedItems, inputValue)
+ getMultiOptionsFilter(props.selectedItems, inputValue),
),
- [props.selectedItems, inputValue]
+ [props.selectedItems, inputValue],
);
const [hasInputFocused, setHasInputFocused] = useState(false);
const useMultipleSelectionReturn = useMultipleSelection({
diff --git a/packages/react/src/components/Forms/Select/multi-simple.tsx b/packages/react/src/components/Forms/Select/multi-simple.tsx
index 7300326..825ea31 100644
--- a/packages/react/src/components/Forms/Select/multi-simple.tsx
+++ b/packages/react/src/components/Forms/Select/multi-simple.tsx
@@ -10,7 +10,7 @@ import { optionToString } from ":/components/Forms/Select/mono-common";
export const SelectMultiSimple = (props: SubProps) => {
const options = React.useMemo(
() => props.options.filter(getMultiOptionsFilter(props.selectedItems, "")),
- [props.selectedItems]
+ [props.selectedItems],
);
const useMultipleSelectionReturn = useMultipleSelection({
diff --git a/packages/react/src/components/Forms/Select/multi.spec.tsx b/packages/react/src/components/Forms/Select/multi.spec.tsx
index d6ba3ec..ffe11d4 100644
--- a/packages/react/src/components/Forms/Select/multi.spec.tsx
+++ b/packages/react/src/components/Forms/Select/multi.spec.tsx
@@ -42,7 +42,7 @@ describe("", () => {
]}
multi={true}
/>
-
+ ,
);
const input = screen.getByRole("combobox", {
name: "Cities",
@@ -63,7 +63,7 @@ describe("", () => {
// Make sure the menu is opened and options are rendered.
expectMenuToBeOpen(menu);
expect(
- screen.queryByRole("option", { name: "Paris" })
+ screen.queryByRole("option", { name: "Paris" }),
).toBeInTheDocument();
// Make sure the option is not selected.
@@ -83,19 +83,19 @@ describe("", () => {
// Make sure the option is removed from the menu.
expect(
- screen.queryByRole("option", { name: "London" })
+ screen.queryByRole("option", { name: "London" }),
).not.toBeInTheDocument();
// Select other options.
await user.click(
screen.getByRole("option", {
name: "Tokyo",
- })
+ }),
);
await user.click(
screen.getByRole("option", {
name: "Panama",
- })
+ }),
);
await waitFor(() => expectSelectedOptions(["London", "Tokyo", "Panama"]));
@@ -103,30 +103,30 @@ describe("", () => {
// Clear one option.
await user.click(
within(
- screen.getByText("Panama").parentNode as HTMLDivElement
+ screen.getByText("Panama").parentNode as HTMLDivElement,
).getByRole("button", {
name: "Clear selection",
- })
+ }),
);
await waitFor(() => expectSelectedOptions(["London", "Tokyo"]));
// Clear one option.
await user.click(
within(
- screen.getByText("London").parentNode as HTMLDivElement
+ screen.getByText("London").parentNode as HTMLDivElement,
).getByRole("button", {
name: "Clear selection",
- })
+ }),
);
await waitFor(() => expectSelectedOptions(["Tokyo"]));
// Clear one option.
await user.click(
within(
- screen.getByText("Tokyo").parentNode as HTMLDivElement
+ screen.getByText("Tokyo").parentNode as HTMLDivElement,
).getByRole("button", {
name: "Clear selection",
- })
+ }),
);
expectSelectedOptions([]);
});
@@ -156,7 +156,7 @@ describe("", () => {
]}
multi={true}
/>
-
+ ,
);
const input = screen.getByRole("combobox", {
name: "Cities",
@@ -167,17 +167,17 @@ describe("", () => {
await user.click(
screen.getByRole("option", {
name: "London",
- })
+ }),
);
await user.click(
screen.getByRole("option", {
name: "Tokyo",
- })
+ }),
);
await user.click(
screen.getByRole("option", {
name: "Panama",
- })
+ }),
);
expectSelectedOptions(["London", "Tokyo", "Panama"]);
@@ -211,7 +211,7 @@ describe("", () => {
defaultValue={["Tokyo", "New York"]}
multi={true}
/>
-
+ ,
);
expectSelectedOptions(["New York", "Tokyo"]);
});
@@ -242,7 +242,7 @@ describe("", () => {
defaultValue={["tokyo", "new_york"]}
multi={true}
/>
-
+ ,
);
expectSelectedOptions(["New York", "Tokyo"]);
});
@@ -298,14 +298,14 @@ describe("", () => {
// Make sure the option is removed from the menu.
expect(
- screen.queryByRole("option", { name: "London" })
+ screen.queryByRole("option", { name: "London" }),
).not.toBeInTheDocument();
// Select an option.
await user.click(
screen.getByRole("option", {
name: "New York",
- })
+ }),
);
// Make sure value is selected.
@@ -347,7 +347,7 @@ describe("", () => {
disabled={true}
multi={true}
/>
-
+ ,
);
const input = screen.getByRole("combobox", {
name: "Cities",
@@ -355,7 +355,7 @@ describe("", () => {
expect(input).toHaveAttribute("disabled");
const button: HTMLButtonElement = document.querySelector(
- ".c__select__inner__actions__open"
+ ".c__select__inner__actions__open",
)!;
expect(button).toBeDisabled();
@@ -402,7 +402,7 @@ describe("", () => {
text="This is a text"
multi={true}
/>
-
+ ,
);
screen.getByText("This is a text");
});
@@ -434,10 +434,10 @@ describe("", () => {
state="error"
multi={true}
/>
-
+ ,
);
expect(
- document.querySelector(".c__select.c__select--error")
+ document.querySelector(".c__select.c__select--error"),
).toBeInTheDocument();
});
@@ -468,10 +468,10 @@ describe("", () => {
state="success"
multi={true}
/>
-
+ ,
);
expect(
- document.querySelector(".c__select.c__select--success")
+ document.querySelector(".c__select.c__select--success"),
).toBeInTheDocument();
});
@@ -546,7 +546,7 @@ describe("", () => {
await user.click(
screen.getByRole("option", {
name: "New York",
- })
+ }),
);
expectSelectedOptions(["New York"]);
@@ -566,7 +566,7 @@ describe("", () => {
await user.click(
await screen.findByRole("option", {
name: "Paris",
- })
+ }),
);
expectSelectedOptions(["New York", "Paris"]);
@@ -616,7 +616,7 @@ describe("", () => {
defaultValue={["Paris"]}
multi={true}
/>
-
+ ,
);
screen.getByRole("combobox", {
name: "Cities",
@@ -628,7 +628,7 @@ describe("", () => {
expect(
screen.queryByRole("button", {
name: "Clear all selections",
- })
+ }),
).not.toBeInTheDocument();
});
@@ -654,7 +654,7 @@ describe("", () => {
},
]}
/>
-
+ ,
);
const input = screen.getByRole("combobox", {
name: "Cities",
@@ -715,7 +715,7 @@ describe("", () => {
hideLabel={true}
multi={true}
/>
-
+ ,
);
// Make sure the input is accessible.
screen.getByRole("combobox", {
@@ -753,7 +753,7 @@ describe("", () => {
searchable={true}
multi={true}
/>
-
+ ,
);
const input = screen.getByRole("combobox", {
@@ -815,7 +815,7 @@ describe("", () => {
searchable={true}
multi={true}
/>
-
+ ,
);
const input = screen.getByRole("combobox", {
@@ -875,7 +875,7 @@ describe("", () => {
searchable={true}
multi={true}
/>
-
+ ,
);
const input = screen.getByRole("combobox", {
@@ -936,7 +936,7 @@ describe("", () => {
multi={true}
defaultValue={["panama", "tokyo", "new_york"]}
/>
-
+ ,
);
expectSelectedOptions(["Panama", "New York", "Tokyo"]);
@@ -996,7 +996,7 @@ describe("", () => {
searchable={true}
defaultValue={["London", "Tokyo", "Panama"]}
/>
-
+ ,
);
expectSelectedOptions(["Panama", "London", "Tokyo"]);
@@ -1035,7 +1035,7 @@ describe("", () => {
searchable={true}
defaultValue={["London", "Tokyo", "Panama"]}
/>
-
+ ,
);
expectSelectedOptions(["Panama", "London", "Tokyo"]);
@@ -1068,7 +1068,7 @@ describe("", () => {
searchable={true}
multi={true}
/>
-
+ ,
);
expectSelectedOptions(["New York", "Tokyo"]);
});
@@ -1100,7 +1100,7 @@ describe("", () => {
searchable={true}
multi={true}
/>
-
+ ,
);
expectSelectedOptions(["New York"]);
});
@@ -1199,7 +1199,7 @@ describe("", () => {
searchable={true}
multi={true}
/>
-
+ ,
);
const input = screen.getByRole("combobox", {
name: "Cities",
@@ -1207,7 +1207,7 @@ describe("", () => {
expect(input).toHaveAttribute("disabled");
const button: HTMLButtonElement = document.querySelector(
- ".c__select__inner__actions__open"
+ ".c__select__inner__actions__open",
)!;
expect(button).toBeDisabled();
diff --git a/packages/react/src/components/Forms/Select/multi.tsx b/packages/react/src/components/Forms/Select/multi.tsx
index 09b81e7..cf90673 100644
--- a/packages/react/src/components/Forms/Select/multi.tsx
+++ b/packages/react/src/components/Forms/Select/multi.tsx
@@ -13,12 +13,12 @@ export const SelectMulti = (props: SelectMultiProps) => {
const getSelectedItemsFromProps = () => {
const valueToUse = props.defaultValue ?? props.value ?? [];
return props.options.filter((option) =>
- (valueToUse as string[]).includes(optionToValue(option))
+ (valueToUse as string[]).includes(optionToValue(option)),
);
};
const [selectedItems, setSelectedItems] = React.useState(
- getSelectedItemsFromProps()
+ getSelectedItemsFromProps(),
);
// If the component is used as a controlled component, we need to update the local value when the value prop changes.
@@ -36,7 +36,7 @@ export const SelectMulti = (props: SelectMultiProps) => {
}, [JSON.stringify(selectedItems)]);
const onSelectedItemsChange: SubProps["onSelectedItemsChange"] = (
- newSelectedItems
+ newSelectedItems,
) => {
setSelectedItems(newSelectedItems);
// props.onSelectedItemsChange?.(newSelectedItems);
diff --git a/packages/react/src/components/Forms/Select/test-utils.tsx b/packages/react/src/components/Forms/Select/test-utils.tsx
index e3cc23e..2667a6a 100644
--- a/packages/react/src/components/Forms/Select/test-utils.tsx
+++ b/packages/react/src/components/Forms/Select/test-utils.tsx
@@ -17,22 +17,22 @@ export const expectMenuToBeClosed = (menu: HTMLDivElement) => {
export const expectOptionToBeSelected = (option: HTMLLIElement) => {
expect(option).toHaveAttribute("aria-selected", "true");
expect(Array.from(option.classList)).contains(
- "c__select__menu__item--selected"
+ "c__select__menu__item--selected",
);
expect(Array.from(option.classList)).contains(
- "c__select__menu__item--highlight"
+ "c__select__menu__item--highlight",
);
};
export const expectOptionToBeUnselected = (option: HTMLLIElement) => {
expect(option).toHaveAttribute("aria-selected", "false");
expect(Array.from(option.classList)).not.contains(
- "c__select__menu__item--selected"
+ "c__select__menu__item--selected",
);
};
export const expectOptionToBeDisabled = (option: HTMLLIElement) => {
expect(option).toHaveAttribute("disabled");
expect(Array.from(option.classList)).contains(
- "c__select__menu__item--disabled"
+ "c__select__menu__item--disabled",
);
};
diff --git a/packages/react/src/components/Forms/Switch/index.spec.tsx b/packages/react/src/components/Forms/Switch/index.spec.tsx
index 8470bba..f16dea9 100644
--- a/packages/react/src/components/Forms/Switch/index.spec.tsx
+++ b/packages/react/src/components/Forms/Switch/index.spec.tsx
@@ -48,7 +48,7 @@ describe("", () => {
render();
screen.getByText("Success text");
expect(
- document.querySelector(".c__field.c__field--success")
+ document.querySelector(".c__field.c__field--success"),
).toBeInTheDocument();
});
@@ -56,7 +56,7 @@ describe("", () => {
render();
screen.getByText("Error text");
expect(
- document.querySelector(".c__field.c__field--error")
+ document.querySelector(".c__field.c__field--error"),
).toBeInTheDocument();
});
@@ -68,7 +68,7 @@ describe("", () => {
-
+ ,
);
// expect all checkboxes to be unchecked
const newsletter: HTMLInputElement = screen.getByRole("checkbox", {
diff --git a/packages/react/src/components/Forms/Switch/index.tsx b/packages/react/src/components/Forms/Switch/index.tsx
index 0a0202a..76e3b5a 100644
--- a/packages/react/src/components/Forms/Switch/index.tsx
+++ b/packages/react/src/components/Forms/Switch/index.tsx
@@ -26,7 +26,7 @@ export const Switch = ({
{
"c__checkbox--disabled": props.disabled,
"c__switch--full-width": fullWidth,
- }
+ },
)}
>
diff --git a/packages/react/src/components/Pagination/index.spec.tsx b/packages/react/src/components/Pagination/index.spec.tsx
index 8fd1085..6ab0e5d 100644
--- a/packages/react/src/components/Pagination/index.spec.tsx
+++ b/packages/react/src/components/Pagination/index.spec.tsx
@@ -103,7 +103,7 @@ describe("", () => {
{ text: "2", name: "You are currently on page 2" },
{ text: "3", name: "Go to page 3" },
{ text: "navigate_next", name: "Go to next page", disabled: false },
- ])
+ ]),
);
// Go to page 3.
@@ -120,7 +120,7 @@ describe("", () => {
{ text: "2", name: "Go to page 2" },
{ text: "3", name: "You are currently on page 3" },
{ text: "navigate_next", name: "Go to next page", disabled: true },
- ])
+ ]),
);
const previousButton = screen.getByRole("button", {
@@ -141,7 +141,7 @@ describe("", () => {
{ text: "2", name: "You are currently on page 2" },
{ text: "3", name: "Go to page 3" },
{ text: "navigate_next", name: "Go to next page", disabled: false },
- ])
+ ]),
);
// Go to page 1.
@@ -158,7 +158,7 @@ describe("", () => {
{ text: "2", name: "Go to page 2" },
{ text: "3", name: "Go to page 3" },
{ text: "navigate_next", name: "Go to next page", disabled: false },
- ])
+ ]),
);
});
it("can goto page", async () => {
@@ -176,7 +176,7 @@ describe("", () => {
});
await waitFor(() =>
- screen.getByRole("button", { name: "You are currently on page 60" })
+ screen.getByRole("button", { name: "You are currently on page 60" }),
);
// Try to go to page > 100 and verify that it goes to 100.
@@ -187,7 +187,7 @@ describe("", () => {
});
await waitFor(() =>
- screen.getByRole("button", { name: "You are currently on page 100" })
+ screen.getByRole("button", { name: "You are currently on page 100" }),
);
// Try to go to page < 1 and verify that it goes to 1.
@@ -198,7 +198,7 @@ describe("", () => {
});
await waitFor(() =>
- screen.getByRole("button", { name: "You are currently on page 1" })
+ screen.getByRole("button", { name: "You are currently on page 1" }),
);
});
});
diff --git a/packages/react/src/components/Pagination/index.stories.tsx b/packages/react/src/components/Pagination/index.stories.tsx
index 43f61e3..e27c856 100644
--- a/packages/react/src/components/Pagination/index.stories.tsx
+++ b/packages/react/src/components/Pagination/index.stories.tsx
@@ -33,14 +33,14 @@ export const List = () => {
const timeout = setTimeout(() => {
// Sets the number of pages based on the number of items in the database.
pagination.setPagesCount(
- Math.ceil(database.length / pagination.pageSize)
+ Math.ceil(database.length / pagination.pageSize),
);
// Sets the items to display on the current page.
setItems(
database.slice(
(pagination.page - 1) * pagination.pageSize,
- pagination.page * pagination.pageSize
- )
+ pagination.page * pagination.pageSize,
+ ),
);
}, 500);
return () => {
diff --git a/packages/react/src/components/Pagination/utils.tsx b/packages/react/src/components/Pagination/utils.tsx
index d3bc640..1f3a981 100644
--- a/packages/react/src/components/Pagination/utils.tsx
+++ b/packages/react/src/components/Pagination/utils.tsx
@@ -1,5 +1,5 @@
export const expectPaginationList = (
- expectations: { text: string; name?: string; disabled?: boolean }[]
+ expectations: { text: string; name?: string; disabled?: boolean }[],
) => {
const buttons = document.querySelectorAll(".c__pagination__list > *");
expect(buttons.length).toEqual(expectations.length);
diff --git a/packages/react/src/components/Provider/index.spec.tsx b/packages/react/src/components/Provider/index.spec.tsx
index e15ed68..75fcd73 100644
--- a/packages/react/src/components/Provider/index.spec.tsx
+++ b/packages/react/src/components/Provider/index.spec.tsx
@@ -15,7 +15,7 @@ describe("", () => {
render(
Hi
-
+ ,
);
screen.getByRole("heading", { level: 1, name: "Hi" });
});
diff --git a/packages/react/src/components/Provider/index.tsx b/packages/react/src/components/Provider/index.tsx
index f1f6474..5a8d924 100644
--- a/packages/react/src/components/Provider/index.tsx
+++ b/packages/react/src/components/Provider/index.tsx
@@ -37,7 +37,7 @@ export const SUPPORTED_LOCALES = Object.values(Locales);
const findTranslation = (
key: string,
- locale: TranslationSet
+ locale: TranslationSet,
): string | undefined => {
const [namespace, ...keys] = key.split(".");
return keys.reduce((acc, subKey) => acc[subKey], (locale as any)[namespace]);
@@ -54,7 +54,7 @@ export const CunninghamProvider = ({
"fr-FR": frFR,
...customLocales,
}),
- [customLocales]
+ [customLocales],
);
const locale = useMemo(() => {
@@ -80,7 +80,7 @@ export const CunninghamProvider = ({
},
currentLocale: locale,
}),
- [currentLocale, locales]
+ [currentLocale, locales],
);
return (
diff --git a/packages/react/src/hooks/useHandleClickOutside.ts b/packages/react/src/hooks/useHandleClickOutside.ts
index e095be8..8cc4c37 100644
--- a/packages/react/src/hooks/useHandleClickOutside.ts
+++ b/packages/react/src/hooks/useHandleClickOutside.ts
@@ -2,7 +2,7 @@ import { RefObject, useEffect } from "react";
export const useHandleClickOutside = (
ref: RefObject,
- onClickOutside: any
+ onClickOutside: any,
) => {
useEffect(() => {
const outsideListenerEvent = (event: MouseEvent) => {
diff --git a/packages/react/src/tests/Theme.ts b/packages/react/src/tests/Theme.ts
index be297f7..cc1300a 100644
--- a/packages/react/src/tests/Theme.ts
+++ b/packages/react/src/tests/Theme.ts
@@ -8,7 +8,7 @@ import path from "path";
*/
export const buildTheme = (debug?: boolean) => {
const child = child_process.exec(
- "cd " + path.join(__dirname, "..", "..") + " && yarn build-theme"
+ "cd " + path.join(__dirname, "..", "..") + " && yarn build-theme",
);
return new Promise((resolve) => {
child.stdout?.on("data", (data) => {
diff --git a/packages/react/src/utils/index.spec.tsx b/packages/react/src/utils/index.spec.tsx
index 063fb5f..34d3c61 100644
--- a/packages/react/src/utils/index.spec.tsx
+++ b/packages/react/src/utils/index.spec.tsx
@@ -21,7 +21,7 @@ describe("range", () => {
// Check step between values.
output.forEach(
(item, index) =>
- index < output.length - 1 && expect(output[index + 1] - item).eq(1)
+ index < output.length - 1 && expect(output[index + 1] - item).eq(1),
);
});
@@ -31,7 +31,7 @@ describe("range", () => {
[10, 0],
])("raises error if max is inferior to min", async (min, max) => {
expect(() => range(min, max)).toThrow(
- "`min` arg must be inferior to `max` arg."
+ "`min` arg must be inferior to `max` arg.",
);
});
});
diff --git a/packages/tokens/src/bin/Generators/CssGenerator.spec.ts b/packages/tokens/src/bin/Generators/CssGenerator.spec.ts
index 944ed91..b5dc3a4 100644
--- a/packages/tokens/src/bin/Generators/CssGenerator.spec.ts
+++ b/packages/tokens/src/bin/Generators/CssGenerator.spec.ts
@@ -31,11 +31,11 @@ describe("CssGenerator", () => {
"..",
"tests",
"assets",
- "expected-default-" + Config.tokenFilename + ".css"
- )
+ "expected-default-" + Config.tokenFilename + ".css",
+ ),
)
.toString()
- .replace(":root", "html")
+ .replace(":root", "html"),
);
};
@@ -58,11 +58,11 @@ describe("CssGenerator", () => {
"..",
"tests",
"assets",
- "expected-with-utility-classes-" + Config.tokenFilename + ".css"
- )
+ "expected-with-utility-classes-" + Config.tokenFilename + ".css",
+ ),
)
.toString()
- .replace(":root", "html")
+ .replace(":root", "html"),
);
});
});
diff --git a/packages/tokens/src/bin/Generators/CssGenerator.ts b/packages/tokens/src/bin/Generators/CssGenerator.ts
index 0b80972..1ca8e7e 100644
--- a/packages/tokens/src/bin/Generators/CssGenerator.ts
+++ b/packages/tokens/src/bin/Generators/CssGenerator.ts
@@ -52,7 +52,7 @@ function generateColorClasses(tokens: Tokens) {
function generateBgClasses(tokens: Tokens) {
return Object.keys(tokens.theme.colors).map(
(key) =>
- `.bg-${key} { background-color: var(--${Config.sass.varPrefix}theme--colors--${key}); }`
+ `.bg-${key} { background-color: var(--${Config.sass.varPrefix}theme--colors--${key}); }`,
);
}
@@ -65,7 +65,7 @@ function generateBgClasses(tokens: Tokens) {
function generateClrClasses(tokens: Tokens) {
return Object.keys(tokens.theme.colors).map(
(key) =>
- `.clr-${key} { color: var(--${Config.sass.varPrefix}theme--colors--${key}); }`
+ `.clr-${key} { color: var(--${Config.sass.varPrefix}theme--colors--${key}); }`,
);
}
@@ -86,7 +86,7 @@ function generateFontClasses(tokens: Tokens) {
function generateFwClasses(tokens: Tokens) {
return Object.keys(tokens.theme.font.weights).map(
(key) =>
- `.fw-${key} { font-weight: var(--${Config.sass.varPrefix}theme--font--weights--${key}); }`
+ `.fw-${key} { font-weight: var(--${Config.sass.varPrefix}theme--font--weights--${key}); }`,
);
}
@@ -99,7 +99,7 @@ function generateFwClasses(tokens: Tokens) {
function generateFsClasses(tokens: Tokens) {
return Object.keys(tokens.theme.font.sizes).map(
(key) =>
- `.fs-${key} { font-size: var(--${Config.sass.varPrefix}theme--font--sizes--${key}); }`
+ `.fs-${key} { font-size: var(--${Config.sass.varPrefix}theme--font--sizes--${key}); }`,
);
}
@@ -112,7 +112,7 @@ function generateFsClasses(tokens: Tokens) {
function generateFClasses(tokens: Tokens) {
return Object.keys(tokens.theme.font.families).map(
(key) =>
- `.f-${key} { font-family: var(--${Config.sass.varPrefix}theme--font--families--${key}); }`
+ `.f-${key} { font-family: var(--${Config.sass.varPrefix}theme--font--families--${key}); }`,
);
}
@@ -133,7 +133,7 @@ function generateMarginClasses(tokens: Tokens) {
`.mb-${key} { margin-bottom: var(--${Config.sass.varPrefix}theme--spacings--${key}); }` +
`.mt-${key} { margin-top: var(--${Config.sass.varPrefix}theme--spacings--${key}); }` +
`.ml-${key} { margin-left: var(--${Config.sass.varPrefix}theme--spacings--${key}); }` +
- `.mr-${key} { margin-right: var(--${Config.sass.varPrefix}theme--spacings--${key}); }`
+ `.mr-${key} { margin-right: var(--${Config.sass.varPrefix}theme--spacings--${key}); }`,
);
}
@@ -150,6 +150,6 @@ function generatePaddingClasses(tokens: Tokens) {
`.pb-${key} { padding-bottom: var(--${Config.sass.varPrefix}theme--spacings--${key}); }` +
`.pt-${key} { padding-top: var(--${Config.sass.varPrefix}theme--spacings--${key}); }` +
`.pl-${key} { padding-left: var(--${Config.sass.varPrefix}theme--spacings--${key}); }` +
- `.pr-${key} { padding-right: var(--${Config.sass.varPrefix}theme--spacings--${key}); }`
+ `.pr-${key} { padding-right: var(--${Config.sass.varPrefix}theme--spacings--${key}); }`,
);
}
diff --git a/packages/tokens/src/bin/Generators/SassGenerator.ts b/packages/tokens/src/bin/Generators/SassGenerator.ts
index 6218f92..d519ee1 100644
--- a/packages/tokens/src/bin/Generators/SassGenerator.ts
+++ b/packages/tokens/src/bin/Generators/SassGenerator.ts
@@ -35,7 +35,7 @@ function JSONToSassMap(json: Object, isDefault = true) {
[`'${key}'`]:
typeof value === "object" ? deepQuoteObjectKeys(value) : value,
}),
- {}
+ {},
);
}
const jsonWithQuotedKeys = deepQuoteObjectKeys(json);
diff --git a/packages/tokens/src/bin/Generators/index.spec.ts b/packages/tokens/src/bin/Generators/index.spec.ts
index f79bdf7..9e40366 100644
--- a/packages/tokens/src/bin/Generators/index.spec.ts
+++ b/packages/tokens/src/bin/Generators/index.spec.ts
@@ -12,7 +12,7 @@ describe("resolveRefs", () => {
tokens as unknown as Tokens,
(ref, resolvingTokens) => {
return resolve(resolvingTokens, ref);
- }
+ },
);
expect(res).toEqual({
a: "b",
@@ -51,7 +51,7 @@ describe("resolveRefs", () => {
tokens as unknown as Tokens,
(ref, resolvingTokens) => {
return resolve(resolvingTokens, ref);
- }
+ },
);
expect(res).toEqual({
a: "b",
@@ -77,7 +77,7 @@ describe("resolveRefs", () => {
tokens as unknown as Tokens,
(ref, resolvingTokens) => {
return resolve(resolvingTokens, ref);
- }
+ },
);
expect(res).toEqual({
a: "value",
@@ -97,7 +97,7 @@ describe("resolveRefs", () => {
return `ref(${ref})`;
});
}).toThrow(
- "Maximum resolveRefs iterations: please reduce usage of chained references."
+ "Maximum resolveRefs iterations: please reduce usage of chained references.",
);
});
});
diff --git a/packages/tokens/src/bin/Generators/index.ts b/packages/tokens/src/bin/Generators/index.ts
index 454bf4e..f4b65ad 100644
--- a/packages/tokens/src/bin/Generators/index.ts
+++ b/packages/tokens/src/bin/Generators/index.ts
@@ -7,7 +7,7 @@ import { resolve } from "Utils/resolve";
export type Generator = (
tokens: Tokens,
- opts: { path: string; selector: string; utilityClasses?: boolean }
+ opts: { path: string; selector: string; utilityClasses?: boolean },
) => Promise;
export const Generators: Record = {
@@ -19,7 +19,7 @@ export const Generators: Record = {
export const resolveRefs = (
tokens: Tokens,
- callback: (ref: string, tokens: Tokens) => string
+ callback: (ref: string, tokens: Tokens) => string,
): Tokens => {
let refsCount = 0;
let resolved = tokens;
@@ -72,7 +72,7 @@ export const resolveRefs = (
// Prevent infinite loops.
if (iterations >= maxIterations) {
throw new Error(
- "Maximum resolveRefs iterations: please reduce usage of chained references."
+ "Maximum resolveRefs iterations: please reduce usage of chained references.",
);
}
refsCount = 0;
diff --git a/packages/tokens/src/bin/ThemeGenerator.ts b/packages/tokens/src/bin/ThemeGenerator.ts
index cb3002b..d97b84f 100644
--- a/packages/tokens/src/bin/ThemeGenerator.ts
+++ b/packages/tokens/src/bin/ThemeGenerator.ts
@@ -22,13 +22,13 @@ export const buildTheme = async () => {
selector: options.selector,
utilityClasses: options.utilityClasses,
});
- })
+ }),
);
};
export const run = async (args: string[]) => {
console.log(
- chalk.red(figlet.textSync("Cunningham", { horizontalLayout: "full" }))
+ chalk.red(figlet.textSync("Cunningham", { horizontalLayout: "full" })),
);
const commaSeparatedList = (value: string) => {
@@ -40,21 +40,21 @@ export const run = async (args: string[]) => {
.option(
"-s, --selector ",
"Specify the css root selector element.",
- ":root"
+ ":root",
)
.option(
"-cwd, --working-dir ",
- "Specify the working dir ( you might not need this )."
+ "Specify the working dir ( you might not need this ).",
)
.option(
"-o, --output ",
- "Specify the output dir of generated files."
+ "Specify the output dir of generated files.",
)
.option("--utility-classes", "Generate CSS utility classes.")
.requiredOption(
"-g, --generators ",
"Specify the generators to use.",
- commaSeparatedList
+ commaSeparatedList,
)
.parse(args);
diff --git a/packages/tokens/src/bin/Utils/Files.ts b/packages/tokens/src/bin/Utils/Files.ts
index bf48185..8dcae4b 100644
--- a/packages/tokens/src/bin/Utils/Files.ts
+++ b/packages/tokens/src/bin/Utils/Files.ts
@@ -14,6 +14,6 @@ export const put = (path: string, content: string) => {
fs.writeFileSync(path, content);
console.log(
- chalk.bgGreen(chalk.white("File " + path + " generated successfully."))
+ chalk.bgGreen(chalk.white("File " + path + " generated successfully.")),
);
};
diff --git a/packages/tokens/src/bin/Utils/resolve.ts b/packages/tokens/src/bin/Utils/resolve.ts
index 2a79e68..e099966 100644
--- a/packages/tokens/src/bin/Utils/resolve.ts
+++ b/packages/tokens/src/bin/Utils/resolve.ts
@@ -1,7 +1,7 @@
export const resolve = (
object: Record,
path: string,
- separator: string = "."
+ separator: string = ".",
): any => {
return path.split(separator).reduce((acc, cur) => {
return acc[cur];
diff --git a/packages/tokens/src/bin/tests/Cunningham.spec.ts b/packages/tokens/src/bin/tests/Cunningham.spec.ts
index c0400fd..47fc7da 100644
--- a/packages/tokens/src/bin/tests/Cunningham.spec.ts
+++ b/packages/tokens/src/bin/tests/Cunningham.spec.ts
@@ -16,7 +16,7 @@ const runBin = async (args: string) => {
const promise = exec(
path.join(__dirname, "..", "..", "..", "dist", "bin", "Main.js") +
" " +
- args
+ args,
);
promise.child.stdout?.on("data", (data) => {
@@ -61,10 +61,10 @@ describe("Cunningham Bin", () => {
path.join(
__dirname,
"assets",
- "expected-default-" + Config.tokenFilename + ".css"
- )
+ "expected-default-" + Config.tokenFilename + ".css",
+ ),
)
- .toString()
+ .toString(),
);
});
@@ -77,7 +77,7 @@ describe("Cunningham Bin", () => {
fs.copyFileSync(
path.join(__dirname, "assets", "cunningham.js"),
- localConfigurationFile
+ localConfigurationFile,
);
expect(fs.existsSync(localConfigurationFile)).toEqual(true);
@@ -89,10 +89,10 @@ describe("Cunningham Bin", () => {
path.join(
__dirname,
"assets",
- "expected-js-" + Config.tokenFilename + ".css"
- )
+ "expected-js-" + Config.tokenFilename + ".css",
+ ),
)
- .toString()
+ .toString(),
);
});
@@ -105,7 +105,7 @@ describe("Cunningham Bin", () => {
fs.copyFileSync(
path.join(__dirname, "assets", "cunningham.ts"),
- localConfigurationFile
+ localConfigurationFile,
);
expect(fs.existsSync(localConfigurationFile)).toEqual(true);
@@ -131,10 +131,10 @@ describe("Cunningham Bin", () => {
path.join(
__dirname,
"assets",
- "expected-default-" + Config.tokenFilename + ".css"
- )
+ "expected-default-" + Config.tokenFilename + ".css",
+ ),
)
- .toString()
+ .toString(),
);
};
diff --git a/packages/tokens/src/bin/tests/Utils.ts b/packages/tokens/src/bin/tests/Utils.ts
index 3fabecd..412d425 100644
--- a/packages/tokens/src/bin/tests/Utils.ts
+++ b/packages/tokens/src/bin/tests/Utils.ts
@@ -9,7 +9,7 @@ import { Generators } from "Generators";
*/
export const cleanup = (dir: string) => {
const tokenFilenames = Object.keys(Generators).map(
- (extension) => Config.tokenFilename + "." + extension
+ (extension) => Config.tokenFilename + "." + extension,
);
tokenFilenames.forEach((filename) => {
diff --git a/packages/tokens/src/lib/index.spec.ts b/packages/tokens/src/lib/index.spec.ts
index ccab30b..2824ed9 100644
--- a/packages/tokens/src/lib/index.spec.ts
+++ b/packages/tokens/src/lib/index.spec.ts
@@ -9,7 +9,7 @@ describe("buildRefs", () => {
"primary-500": "blue",
},
},
- })
+ }),
).toEqual({
theme: {
colors: {