diff --git a/apps/browser/src/autofill/content/components/lit-stories/.lit-docs/action-button.mdx b/apps/browser/src/autofill/content/components/lit-stories/.lit-docs/action-button.mdx index 73cd6fb93a9..fcec5bb7a82 100644 --- a/apps/browser/src/autofill/content/components/lit-stories/.lit-docs/action-button.mdx +++ b/apps/browser/src/autofill/content/components/lit-stories/.lit-docs/action-button.mdx @@ -25,7 +25,6 @@ It is designed with accessibility and responsive design in mind. ## Installation and Setup 1. Ensure you have the necessary dependencies installed: - - `lit`: Used to render the component. - `@emotion/css`: Used for styling the component. diff --git a/apps/browser/src/autofill/content/components/lit-stories/.lit-docs/badge-button.mdx b/apps/browser/src/autofill/content/components/lit-stories/.lit-docs/badge-button.mdx index 47d82ad68da..b5ea41b283c 100644 --- a/apps/browser/src/autofill/content/components/lit-stories/.lit-docs/badge-button.mdx +++ b/apps/browser/src/autofill/content/components/lit-stories/.lit-docs/badge-button.mdx @@ -25,7 +25,6 @@ handling, and a disabled state. The component is optimized for accessibility and ## Installation and Setup 1. Ensure you have the necessary dependencies installed: - - `lit`: Used to render the component. - `@emotion/css`: Used for styling the component. diff --git a/apps/browser/src/autofill/content/components/lit-stories/.lit-docs/close-button.mdx b/apps/browser/src/autofill/content/components/lit-stories/.lit-docs/close-button.mdx index da9c15246fd..03a7b72001a 100644 --- a/apps/browser/src/autofill/content/components/lit-stories/.lit-docs/close-button.mdx +++ b/apps/browser/src/autofill/content/components/lit-stories/.lit-docs/close-button.mdx @@ -22,7 +22,6 @@ a close icon for visual clarity. The component is designed to be intuitive and a ## Installation and Setup 1. Ensure you have the necessary dependencies installed: - - `lit`: Used to render the component. - `@emotion/css`: Used for styling the component. diff --git a/apps/browser/src/autofill/content/components/lit-stories/.lit-docs/edit-button.mdx b/apps/browser/src/autofill/content/components/lit-stories/.lit-docs/edit-button.mdx index c6c4262806b..a5a791ffbe1 100644 --- a/apps/browser/src/autofill/content/components/lit-stories/.lit-docs/edit-button.mdx +++ b/apps/browser/src/autofill/content/components/lit-stories/.lit-docs/edit-button.mdx @@ -25,7 +25,6 @@ or settings where inline editing is required. ## Installation and Setup 1. Ensure you have the necessary dependencies installed: - - `lit`: Used to render the component. - `@emotion/css`: Used for styling the component. diff --git a/apps/browser/src/platform/services/local-backed-session-storage.service.spec.ts b/apps/browser/src/platform/services/local-backed-session-storage.service.spec.ts index 1b4665b3222..947fecb5aac 100644 --- a/apps/browser/src/platform/services/local-backed-session-storage.service.spec.ts +++ b/apps/browser/src/platform/services/local-backed-session-storage.service.spec.ts @@ -50,8 +50,8 @@ describe("LocalBackedSessionStorage", () => { const result = await sut.get("test"); // FIXME: Remove when updating file. Eslint update // eslint-disable-next-line @typescript-eslint/no-unused-expressions - expect(encryptService.decryptString).toHaveBeenCalledWith(encrypted, sessionKey), - expect(result).toEqual("decrypted"); + (expect(encryptService.decryptString).toHaveBeenCalledWith(encrypted, sessionKey), + expect(result).toEqual("decrypted")); }); it("caches the decrypted value when one is stored in local storage", async () => { @@ -69,8 +69,8 @@ describe("LocalBackedSessionStorage", () => { const result = await sut.get("test"); // FIXME: Remove when updating file. Eslint update // eslint-disable-next-line @typescript-eslint/no-unused-expressions - expect(encryptService.decryptString).toHaveBeenCalledWith(encrypted, sessionKey), - expect(result).toEqual("decrypted"); + (expect(encryptService.decryptString).toHaveBeenCalledWith(encrypted, sessionKey), + expect(result).toEqual("decrypted")); }); it("caches the decrypted value when one is stored in local storage", async () => { diff --git a/libs/components/src/icon/icon.mdx b/libs/components/src/icon/icon.mdx index bf350d96e81..e4186b5e4a9 100644 --- a/libs/components/src/icon/icon.mdx +++ b/libs/components/src/icon/icon.mdx @@ -19,7 +19,6 @@ import { IconModule } from "@bitwarden/components"; ## Developer Instructions 1. **Download the SVG** and import it as an `.svg` initially into the IDE of your choice. - - The SVG should be formatted using either a built-in formatter or an external tool like [SVG Formatter Beautifier](https://codebeautify.org/svg-formatter-beautifier) to make applying classes easier. @@ -35,7 +34,6 @@ import { IconModule } from "@bitwarden/components"; ``` 5. **Replace any hardcoded strokes or fills** with the appropriate Tailwind class. - - **Note:** Stroke is used when styling the outline of an SVG path, while fill is used when styling the inside of an SVG path. @@ -75,14 +73,11 @@ import { IconModule } from "@bitwarden/components"; 6. **Remove any hardcoded width or height attributes** if your SVG has a configured [viewBox](https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/viewBox) attribute in order to allow the SVG to scale to fit its container. - - **Note:** Scaling is required for any SVG used as an [AnonLayout](?path=/docs/auth-anon-layout--docs) `pageIcon`. 7. **Import your SVG const** anywhere you want to use the SVG. - - **Angular Component Example:** - - **TypeScript:** ```typescript diff --git a/libs/components/src/stories/introduction.mdx b/libs/components/src/stories/introduction.mdx index eb7328cd76d..7580262a6ef 100644 --- a/libs/components/src/stories/introduction.mdx +++ b/libs/components/src/stories/introduction.mdx @@ -153,7 +153,6 @@ what would be helpful to you if you were consuming this component for the first 2. (For team-owned components) Check if your file path is already included in the `.storybook/main.ts` config -- if not, add it 3. Write the docs `*.mdx` page - - What is the component intended to be used for? - How to import and use it? What inputs and slots are available? - Are there other usage guidelines, such as pointing out similar components and when to use each?