chore(cauldron): Release 6.8.0 (#1707)

.github/ISSUE_TEMPLATE/BUG.yml

@@ -7,13 +7,18 @@ body:
     attributes:
       value: |
         Thanks for taking the time to fill out this bug report!
+
+        > [!Note]
+        > Cauldron is a public repo for Deque's design system. Please be careful to not include details or screenshots from unreleased or private features within Deque products.
   - type: textarea
     id: steps-to-reproduce
     attributes:
       label: Steps to reproduce
       description: Give us the details we need to reproduce the bug.
-      placeholder: Steps to reproduce the bug
-      value: "Steps to reproduce"
+      placeholder: |
+        1. Go to '...'
+        2. Click on '...'
+        3. Description of error
     validations:
       required: true
   - type: textarea
@@ -22,45 +27,30 @@ body:
       label: Expected Behavior
       description: What did you expect to happen?
       placeholder: Tell us what you expected to happen!
-      value: "Not a bug."
-    validations:
-      required: true
-  - type: textarea
-    id: actual-behavior
-    attributes:
-      label: Actual Behavior
-      description: What actually happened?
-      placeholder: Tell us what you are experiencing!
-      value: "A bug happened!"
     validations:
       required: true
   - type: input
     id: version
     attributes:
       label: Version
       description: What version of cauldron did this happen with?
-      placeholder: 4.0.0
+      placeholder: v4.0.0
     validations:
       required: true
   - type: dropdown
     id: browsers
     attributes:
-      label: What browsers are you experiencing the problem on?
+      label: What browser(s) are you experiencing the problem on?
       multiple: true
       options:
-        - Firefox
         - Chrome
+        - Firefox
         - Safari
-        - Microsoft Edge
+        - Edge
+        - iOS Safari
   - type: textarea
     id: logs
     attributes:
       label: Relevant log output
       description: Please copy and paste any relevant log output. This will be automatically formatted into code, so no need for backticks.
       render: shell
-  - type: textarea
-    id: anything-else
-    attributes:
-      label: Anything else we should know?
-      description: Please provide any additional information that may be helpful.
-      value: "Additional information"

CHANGELOG.md

@@ -2,6 +2,24 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+## [6.8.0](https://github.com/dequelabs/cauldron/compare/v6.7.0...v6.8.0) (2024-10-08)
+
+
+### Features
+
+* **ClickOutsideListener:** refactor and allow for ref targets ([#1687](https://github.com/dequelabs/cauldron/issues/1687)) ([8f770f3](https://github.com/dequelabs/cauldron/commit/8f770f32e46104312a50bc26d81f8c53e0a6c036))
+* **icon:** added `broken-image` icon ([#1700](https://github.com/dequelabs/cauldron/issues/1700)) ([d64ab15](https://github.com/dequelabs/cauldron/commit/d64ab15b841b12bd15c427b722e71ad9eede0f2e))
+* **react,styles:** add BottomSheet component ([#1694](https://github.com/dequelabs/cauldron/issues/1694)) ([5a2f12d](https://github.com/dequelabs/cauldron/commit/5a2f12d4e47970e809238328a9d8df1afe26ba3c))
+* **react,styles:** add Drawer component ([#1646](https://github.com/dequelabs/cauldron/issues/1646)) ([4be82cb](https://github.com/dequelabs/cauldron/commit/4be82cb3f7943c67330aef2f2d47215d83e5f294))
+* **styles:** synced Link component ([#1675](https://github.com/dequelabs/cauldron/issues/1675)) ([8ff3885](https://github.com/dequelabs/cauldron/commit/8ff3885e5a1b06dbf41a80e728da85cf6b77f9b8))
+
+
+### Bug Fixes
+
+* **docker:** use the default value of playwright_version ARG declared before the first FROM ([#1704](https://github.com/dequelabs/cauldron/issues/1704)) ([fbd45e8](https://github.com/dequelabs/cauldron/commit/fbd45e8c95c596139647e766c49da18c499c8dbb))
+* **Notice:** allow className to be passed into Notice component ([#1702](https://github.com/dequelabs/cauldron/issues/1702)) ([cb86dd3](https://github.com/dequelabs/cauldron/commit/cb86dd32fc28fbb024d4c3007d5d2697eec7bf69))
+* **react:** fix incorrect icon size for IconButton[large] ([#1655](https://github.com/dequelabs/cauldron/issues/1655)) ([b2cf09f](https://github.com/dequelabs/cauldron/commit/b2cf09f331c845f2e15bb98484930501581ee73a))
+
 ## [6.7.0](https://github.com/dequelabs/cauldron/compare/v6.6.1...v6.7.0) (2024-09-11)
 
 

CONTRIBUTING.md

@@ -4,7 +4,7 @@
    - [Discussing Proprietary Features](#discussing-proprietary-features)
    - [Setup](#setup)
 1. [Adding New Components](#adding-new-components)
-   - [Process for New Components](#process-for-new-components) 
+   - [Process for New Components](#process-for-new-components)
 1. [Developing Components](#developing-components)
    - [Tools Used](#tools-used)
    - [Structure](#structure)
@@ -40,7 +40,7 @@ Local development setup is documented in [this project's readme](./README.md#dev
 
 ## Adding New Components
 
-One of Cauldron's primary goals is to provide high quality, stable, reusable components. This process is intentially slow because it is a critical front-end infrastructure of Deque's products.
+One of Cauldron's primary goals is to provide high quality, stable, reusable components. This process is intentionally slow because it is a critical front-end infrastructure of Deque's products.
 
 As such, components that land in Cauldron tend to have several, if not all of the following qualities:
 
@@ -61,7 +61,7 @@ For a new component to be added to Cauldron, the below workflow describes the de
 <details>
    <summary>Workflow chart describing process and steps to getting a component added to Cauldron</summary>
 
-   ![workflow chart describing process and steps to getting a component added to Cauldron](./docs/assets/img/new-component-workflow.png)
+![workflow chart describing process and steps to getting a component added to Cauldron](./docs/assets/img/new-component-workflow.png)
 
 </details>
 

docs/components/Navigation.css

@@ -14,6 +14,16 @@
   --docs-navigation-divider-color: var(--stroke-dark);
 }
 
+body.TopBar--thin .NavigationDrawer {
+  --top-bar-height: var(--top-bar-height-thin);
+}
+
+.NavigationDrawer {
+  --drawer-top: var(--top-bar-height);
+  --drawer-height: calc(100vh - var(--top-bar-height));
+  overflow-y: auto;
+}
+
 .Navigation {
   width: var(--menu-width);
   background-color: var(--docs-navigation-background-color);

docs/components/Navigation.tsx

@@ -1,5 +1,5 @@
 import React, { useState, useEffect } from 'react';
-import { Icon, ClickOutsideListener, Scrim } from '@deque/cauldron-react';
+import { Icon, Scrim } from '@deque/cauldron-react';
 import { Link, useLocation } from 'react-router-dom';
 import { components, pages, foundations } from '../collections';
 import './Navigation.css';
@@ -38,12 +38,11 @@ const NavigationLink = ({
 
 interface NavigationProps extends React.HTMLAttributes<HTMLElement> {
   contentRef: React.RefObject<HTMLElement>;
-  active?: boolean;
-  onClick?: () => void;
+  onNavigation?: () => void;
 }
 
 function Navigation(
-  { contentRef, active = true, onClick = () => {}, ...props }: NavigationProps,
+  { contentRef, onNavigation = () => {}, ...props }: NavigationProps,
   ref: React.Ref<HTMLElement>
 ) {
   const location = useLocation();
@@ -59,7 +58,7 @@ function Navigation(
       }
     }
 
-    onClick();
+    onNavigation();
   };
 
   const activeComponents = components.filter(
@@ -78,7 +77,6 @@ function Navigation(
           text={name}
           active={isActive}
           onClick={handleClick}
-          tabIndex={!active ? -1 : undefined}
         />
       </li>
     );