Merge pull request #2448 from element-hq/renovate/major-compound

Update dependency @vector-im/compound-web to v6

package.json

@@ -51,7 +51,7 @@
     "@types/lodash": "^4.14.199",
     "@use-gesture/react": "^10.2.11",
     "@vector-im/compound-design-tokens": "^1.0.0",
-    "@vector-im/compound-web": "^3.0.0",
+    "@vector-im/compound-web": "^6.0.0",
     "@vitejs/plugin-basic-ssl": "^1.0.1",
     "@vitejs/plugin-react": "^4.0.1",
     "buffer": "^6.0.3",

src/button/Button.tsx

@@ -151,7 +151,7 @@ export const MicButton: FC<{
   return (
     <Tooltip label={label}>
       <Button variant="toolbar" {...rest} on={muted}>
-        <Icon aria-label={label} width={24} height={24} />
+        <Icon aria-hidden width={24} height={24} />
       </Button>
     </Tooltip>
   );
@@ -171,7 +171,7 @@ export const VideoButton: FC<{
   return (
     <Tooltip label={label}>
       <Button variant="toolbar" {...rest} on={muted}>
-        <Icon aria-label={label} width={24} height={24} />
+        <Icon aria-hidden width={24} height={24} />
       </Button>
     </Tooltip>
   );
@@ -191,7 +191,7 @@ export const ScreenshareButton: FC<{
   return (
     <Tooltip label={label}>
       <Button variant="toolbar" {...rest} on={enabled}>
-        <ShareScreenSolidIcon aria-label={label} width={24} height={24} />
+        <ShareScreenSolidIcon aria-hidden width={24} height={24} />
       </Button>
     </Tooltip>
   );
@@ -211,11 +211,7 @@ export const HangupButton: FC<{
         className={classNames(styles.hangupButton, className)}
         {...rest}
       >
-        <EndCallIcon
+        <EndCallIcon aria-hidden width={24} height={24} />
-          aria-label={t("hangup_button_label")}
-          width={24}
-          height={24}
-        />
       </Button>
     </Tooltip>
   );
@@ -231,11 +227,7 @@ export const SettingsButton: FC<{
   return (
     <Tooltip label={t("common.settings")}>
       <Button variant="toolbar" {...rest}>
-        <SettingsSolidIcon
+        <SettingsSolidIcon aria-hidden width={24} height={24} />
-          aria-label={t("common.settings")}
-          width={24}
-          height={24}
-        />
       </Button>
     </Tooltip>
   );

src/room/EncryptionLock.tsx

@@ -1,5 +1,5 @@
 /*
-Copyright 2023 New Vector Ltd
+Copyright 2023-2024 New Vector Ltd
 
 Licensed under the Apache License, Version 2.0 (the "License");
 you may not use this file except in compliance with the License.
@@ -34,13 +34,13 @@ export const EncryptionLock: FC<Props> = ({ encrypted }) => {
   const label = encrypted ? t("common.encrypted") : t("common.unencrypted");
 
   return (
-    <Tooltip label={label} side="right" isTriggerInteractive={false}>
+    <Tooltip label={label} placement="right" isTriggerInteractive={false}>
       <Icon
         width={16}
         height={16}
         className={styles.lock}
         data-encrypted={encrypted}
-        aria-label={label}
+        aria-hidden
       />
     </Tooltip>
   );

src/room/LayoutToggle.module.css

@@ -1,5 +1,5 @@
 /*
-Copyright 2023 New Vector Ltd
+Copyright 2023-2024 New Vector Ltd
 
 Licensed under the Apache License, Version 2.0 (the "License");
 you may not use this file except in compliance with the License.
@@ -21,22 +21,15 @@ limitations under the License.
   background: var(--cpd-color-bg-canvas-default);
   box-shadow: 0px 0px 40px 0px rgba(0, 0, 0, 0.5);
   display: flex;
+  position: relative;
 }
 
 .toggle input {
   appearance: none;
-  /*
+  /* Safari puts a margin on these, which is not removed via appearance: none */
-   * Safari puts a margin on these, which is not removed via appearance: none
-   * mobile safari also has them take up space in the DOM, so set width 0
-   */
   margin: 0;
-  width: 0;
+  block-size: var(--cpd-space-11x);
-  outline: none !important;
+  inline-size: var(--cpd-space-11x);
-}
-
-.toggle label {
-  display: block;
-  padding: calc(2.5 * var(--cpd-space-1x));
   cursor: pointer;
   border-radius: var(--cpd-radius-pill-effect);
   color: var(--cpd-color-icon-primary);
@@ -44,41 +37,52 @@ limitations under the License.
   box-shadow: var(--small-drop-shadow);
 }
 
+.toggle svg {
+  display: block;
+  position: absolute;
+  padding: calc(2.5 * var(--cpd-space-1x));
+  pointer-events: none;
+  color: var(--cpd-color-icon-primary);
+}
+
+.toggle svg:nth-child(2) {
+  inset-inline-start: 2px;
+}
+
+.toggle svg:nth-child(4) {
+  inset-inline-end: 2px;
+}
+
 @media (hover: hover) {
-  .toggle label:hover {
+  .toggle input:hover {
     background: var(--cpd-color-bg-action-secondary-hovered);
     box-shadow: none;
   }
 }
 
-.toggle label:active {
+.toggle input:active {
   background: var(--cpd-color-bg-action-secondary-hovered);
   box-shadow: none;
 }
 
-.toggle input:checked + label {
+.toggle input:checked {
-  color: var(--cpd-color-icon-on-solid-primary);
   background: var(--cpd-color-bg-action-primary-rest);
 }
 
+.toggle input:checked + svg {
+  color: var(--cpd-color-icon-on-solid-primary);
+}
+
 @media (hover: hover) {
-  .toggle input:checked + label:hover {
+  .toggle input:checked:hover {
     background: var(--cpd-color-bg-action-primary-hovered);
   }
 }
 
-.toggle input:checked + label:active {
+.toggle input:checked:active {
   background: var(--cpd-color-bg-action-primary-hovered);
 }
 
-.toggle label > svg {
+.toggle input:first-child {
-  display: block;
+  margin-inline-end: 5px;
-}
-
-.toggle label:last-child {
-  margin-inline-start: 5px;
-}
-
-.toggle input:focus-visible + label {
-  outline: auto;
 }

src/room/LayoutToggle.tsx

@@ -1,5 +1,5 @@
 /*
-Copyright 2023 New Vector Ltd
+Copyright 2023-2024 New Vector Ltd
 
 Licensed under the Apache License, Version 2.0 (the "License");
 you may not use this file except in compliance with the License.
@@ -14,7 +14,7 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-import { ChangeEvent, FC, useCallback, useId } from "react";
+import { ChangeEvent, FC, useCallback } from "react";
 import { useTranslation } from "react-i18next";
 import { Tooltip } from "@vector-im/compound-web";
 import {
@@ -41,45 +41,28 @@ export const LayoutToggle: FC<Props> = ({ layout, setLayout, className }) => {
     [setLayout],
   );
 
-  const spotlightId = useId();
-  const gridId = useId();
-
   return (
     <div className={classNames(styles.toggle, className)}>
-      <input
-        id={spotlightId}
-        type="radio"
-        name="layout"
-        value="spotlight"
-        checked={layout === "spotlight"}
-        onChange={onChange}
-      />
       <Tooltip label={t("layout_spotlight_label")}>
-        <label htmlFor={spotlightId}>
+        <input
-          <SpotlightIcon
+          type="radio"
-            aria-label={t("layout_spotlight_label")}
+          name="layout"
-            width={24}
+          value="spotlight"
-            height={24}
+          checked={layout === "spotlight"}
-          />
+          onChange={onChange}
-        </label>
+        />
       </Tooltip>
-      <input
+      <SpotlightIcon aria-hidden width={24} height={24} />
-        id={gridId}
-        type="radio"
-        name="layout"
-        value="grid"
-        checked={layout === "grid"}
-        onChange={onChange}
-      />
       <Tooltip label={t("layout_grid_label")}>
-        <label htmlFor={gridId}>
+        <input
-          <GridIcon
+          type="radio"
-            aria-label={t("layout_grid_label")}
+          name="layout"
-            width={24}
+          value="grid"
-            height={24}
+          checked={layout === "grid"}
-          />
+          onChange={onChange}
-        </label>
+        />
       </Tooltip>
+      <GridIcon aria-hidden width={24} height={24} />
     </div>
   );
 };

src/tile/GridTile.tsx

@@ -90,10 +90,12 @@ const UserMediaTile = forwardRef<HTMLDivElement, UserMediaTileProps>(
     const videoEnabled = useObservableEagerState(vm.videoEnabled);
     const speaking = useObservableEagerState(vm.speaking);
     const cropVideo = useObservableEagerState(vm.cropVideo);
-    const onChangeFitContain = useCallback(() => vm.toggleFitContain(), [vm]);
     const onSelectFitContain = useCallback(
-      (e: Event) => e.preventDefault(),
+      (e: Event) => {
-      [],
+        e.preventDefault();
+        vm.toggleFitContain();
+      },
+      [vm],
     );
 
     const MicIcon = audioEnabled ? MicOnSolidIcon : MicOffSolidIcon;
@@ -106,7 +108,6 @@ const UserMediaTile = forwardRef<HTMLDivElement, UserMediaTileProps>(
           Icon={ExpandIcon}
           label={t("video_tile.change_fit_contain")}
           checked={cropVideo}
-          onChange={onChangeFitContain}
           onSelect={onSelectFitContain}
         />
         {menuEnd}
@@ -176,11 +177,10 @@ const LocalUserMediaTile = forwardRef<HTMLDivElement, LocalUserMediaTileProps>(
     const alwaysShow = useObservableEagerState(vm.alwaysShow);
     const latestAlwaysShow = useLatest(alwaysShow);
     const onSelectAlwaysShow = useCallback(
-      (e: Event) => e.preventDefault(),
+      (e: Event) => {
-      [],
+        e.preventDefault();
-    );
+        vm.setAlwaysShow(!latestAlwaysShow.current);
-    const onChangeAlwaysShow = useCallback(
+      },
-      () => vm.setAlwaysShow(!latestAlwaysShow.current),
       [vm, latestAlwaysShow],
     );
 
@@ -194,7 +194,6 @@ const LocalUserMediaTile = forwardRef<HTMLDivElement, LocalUserMediaTileProps>(
             Icon={VisibilityOnIcon}
             label={t("video_tile.always_show")}
             checked={alwaysShow}
-            onChange={onChangeAlwaysShow}
             onSelect={onSelectAlwaysShow}
           />
         }
@@ -224,8 +223,13 @@ const RemoteUserMediaTile = forwardRef<
   const { t } = useTranslation();
   const locallyMuted = useObservableEagerState(vm.locallyMuted);
   const localVolume = useObservableEagerState(vm.localVolume);
-  const onChangeMute = useCallback(() => vm.toggleLocallyMuted(), [vm]);
+  const onSelectMute = useCallback(
-  const onSelectMute = useCallback((e: Event) => e.preventDefault(), []);
+    (e: Event) => {
+      e.preventDefault();
+      vm.toggleLocallyMuted();
+    },
+    [vm],
+  );
   const onChangeLocalVolume = useCallback(
     (v: number) => vm.setLocalVolume(v),
     [vm],
@@ -244,7 +248,6 @@ const RemoteUserMediaTile = forwardRef<
             Icon={MicOffIcon}
             label={t("video_tile.mute_for_me")}
             checked={locallyMuted}
-            onChange={onChangeMute}
             onSelect={onSelectMute}
           />
           {/* TODO: Figure out how to make this slider keyboard accessible */}

src/tile/MediaView.tsx

@@ -103,14 +103,14 @@ export const MediaView = forwardRef<HTMLDivElement, Props>(
             {unencryptedWarning && (
               <Tooltip
                 label={t("common.unencrypted")}
-                side="bottom"
+                placement="bottom"
                 isTriggerInteractive={false}
               >
                 <ErrorIcon
                   width={20}
                   height={20}
-                  aria-label={t("common.unencrypted")}
                   className={styles.errorIcon}
+                  aria-hidden
                 />
               </Tooltip>
             )}

yarn.lock

@@ -1746,7 +1746,7 @@
     "@floating-ui/core" "^1.0.0"
     "@floating-ui/utils" "^0.2.0"
 
-"@floating-ui/react-dom@^2.0.0", "@floating-ui/react-dom@^2.0.8", "@floating-ui/react-dom@^2.1.0":
+"@floating-ui/react-dom@^2.0.0", "@floating-ui/react-dom@^2.1.0":
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/@floating-ui/react-dom/-/react-dom-2.1.0.tgz#4f0e5e9920137874b2405f7d6c862873baf4beff"
   integrity sha512-lNzj5EQmEKn5FFKc04+zasr09h/uX8RtJRNj5gUXsSQIXHVWTVh+hVAg1vOMCexkX8EgvemMvIFpQfkosnVNyA==
@@ -2376,18 +2376,17 @@
     "@radix-ui/react-primitive" "2.0.0"
     "@radix-ui/react-use-callback-ref" "1.1.0"
 
-"@radix-ui/react-form@^0.0.3":
+"@radix-ui/react-form@^0.1.0":
-  version "0.0.3"
+  version "0.1.0"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-form/-/react-form-0.0.3.tgz#328e7163e723ccc748459d66a2d685d7b4f85d5a"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-form/-/react-form-0.1.0.tgz#7111a6aa54a2bde0d11fb72643f9ffc871ac58ad"
-  integrity sha512-kgE+Z/haV6fxE5WqIXj05KkaXa3OkZASoTDy25yX2EIp/x0c54rOH/vFr5nOZTg7n7T1z8bSyXmiVIFP9bbhPQ==
+  integrity sha512-1/oVYPDjbFILOLIarcGcMKo+y6SbTVT/iUKVEw59CF4offwZgBgC3ZOeSBewjqU0vdA6FWTPWTN63obj55S/tQ==
   dependencies:
-    "@babel/runtime" "^7.13.10"
+    "@radix-ui/primitive" "1.1.0"
-    "@radix-ui/primitive" "1.0.1"
+    "@radix-ui/react-compose-refs" "1.1.0"
-    "@radix-ui/react-compose-refs" "1.0.1"
+    "@radix-ui/react-context" "1.1.0"
-    "@radix-ui/react-context" "1.0.1"
+    "@radix-ui/react-id" "1.1.0"
-    "@radix-ui/react-id" "1.0.1"
+    "@radix-ui/react-label" "2.1.0"
-    "@radix-ui/react-label" "2.0.2"
+    "@radix-ui/react-primitive" "2.0.0"
-    "@radix-ui/react-primitive" "1.0.3"
 
 "@radix-ui/react-id@1.0.1":
   version "1.0.1"
@@ -2404,13 +2403,12 @@
   dependencies:
     "@radix-ui/react-use-layout-effect" "1.1.0"
 
-"@radix-ui/react-label@2.0.2":
+"@radix-ui/react-label@2.1.0":
-  version "2.0.2"
+  version "2.1.0"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-label/-/react-label-2.0.2.tgz#9c72f1d334aac996fdc27b48a8bdddd82108fb6d"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-label/-/react-label-2.1.0.tgz#3aa2418d70bb242be37c51ff5e51a2adcbc372e3"
-  integrity sha512-N5ehvlM7qoTLx7nWPodsPYPgMzA5WM8zZChQg8nyFJKnDO5WHdba1vv5/H6IO5LtJMfD2Q3wh1qHFGNtK0w3bQ==
+  integrity sha512-peLblDlFw/ngk3UWq0VnYaOLy6agTZZ+MUO/WhVfm14vJGML+xH4FAl2XQGLqdefjNb7ApRg6Yn7U42ZhmYXdw==
   dependencies:
-    "@babel/runtime" "^7.13.10"
+    "@radix-ui/react-primitive" "2.0.0"
-    "@radix-ui/react-primitive" "1.0.3"
 
 "@radix-ui/react-menu@2.0.6":
   version "2.0.6"
@@ -2502,6 +2500,14 @@
   dependencies:
     "@radix-ui/react-slot" "1.1.0"
 
+"@radix-ui/react-progress@^1.0.3":
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/@radix-ui/react-progress/-/react-progress-1.1.0.tgz#28c267885ec154fc557ec7a66cb462787312f7e2"
+  integrity sha512-aSzvnYpP725CROcxAOEBVZZSIQVQdHgBr2QQFKySsaD14u8dNT0batuXI+AAGDdAHfXH8rbnHmjYFqVJ21KkRg==
+  dependencies:
+    "@radix-ui/react-context" "1.1.0"
+    "@radix-ui/react-primitive" "2.0.0"
+
 "@radix-ui/react-roving-focus@1.0.4":
   version "1.0.4"
   resolved "https://registry.yarnpkg.com/@radix-ui/react-roving-focus/-/react-roving-focus-1.0.4.tgz#e90c4a6a5f6ac09d3b8c1f5b5e81aab2f0db1974"
@@ -2558,25 +2564,6 @@
   dependencies:
     "@radix-ui/react-compose-refs" "1.1.0"
 
-"@radix-ui/react-tooltip@^1.0.6":
-  version "1.0.7"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-tooltip/-/react-tooltip-1.0.7.tgz#8f55070f852e7e7450cc1d9210b793d2e5a7686e"
-  integrity sha512-lPh5iKNFVQ/jav/j6ZrWq3blfDJ0OH9R6FlNUHPMqdLuQ9vwDgFsRxvl8b7Asuy5c8xmoojHUxKHQSOAvMHxyw==
-  dependencies:
-    "@babel/runtime" "^7.13.10"
-    "@radix-ui/primitive" "1.0.1"
-    "@radix-ui/react-compose-refs" "1.0.1"
-    "@radix-ui/react-context" "1.0.1"
-    "@radix-ui/react-dismissable-layer" "1.0.5"
-    "@radix-ui/react-id" "1.0.1"
-    "@radix-ui/react-popper" "1.1.3"
-    "@radix-ui/react-portal" "1.0.4"
-    "@radix-ui/react-presence" "1.0.1"
-    "@radix-ui/react-primitive" "1.0.3"
-    "@radix-ui/react-slot" "1.0.2"
-    "@radix-ui/react-use-controllable-state" "1.0.1"
-    "@radix-ui/react-visually-hidden" "1.0.3"
-
 "@radix-ui/react-use-callback-ref@1.0.1":
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/@radix-ui/react-use-callback-ref/-/react-use-callback-ref-1.0.1.tgz#f4bb1f27f2023c984e6534317ebc411fc181107a"
@@ -2659,14 +2646,6 @@
   dependencies:
     "@radix-ui/react-use-layout-effect" "1.1.0"
 
-"@radix-ui/react-visually-hidden@1.0.3":
-  version "1.0.3"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-visually-hidden/-/react-visually-hidden-1.0.3.tgz#51aed9dd0fe5abcad7dee2a234ad36106a6984ac"
-  integrity sha512-D4w41yN5YRKtu464TLnByKzMDG/JlMPHtfZgQAu9v6mNakUqGUI9vUrfQKz8NK41VMm/xbZbh76NUTVtIYqOMA==
-  dependencies:
-    "@babel/runtime" "^7.13.10"
-    "@radix-ui/react-primitive" "1.0.3"
-
 "@radix-ui/react-visually-hidden@^1.0.3":
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/@radix-ui/react-visually-hidden/-/react-visually-hidden-1.1.0.tgz#ad47a8572580f7034b3807c8e6740cd41038a5a2"
@@ -3829,22 +3808,21 @@
   resolved "https://registry.yarnpkg.com/@vector-im/compound-design-tokens/-/compound-design-tokens-1.7.0.tgz#508b41cd8464c72d73725030f5c84b627a41167c"
   integrity sha512-cXb2QiwEwtEZiC+7IRvYIf7tBD1KoFcL4YsrFlWapD689Wi3qrmmhFRLFoijHUM3d8Ni6B+7p5SdACRrWb6xBQ==
 
-"@vector-im/compound-web@^3.0.0":
+"@vector-im/compound-web@^6.0.0":
-  version "3.3.1"
+  version "6.0.0"
-  resolved "https://registry.yarnpkg.com/@vector-im/compound-web/-/compound-web-3.3.1.tgz#f5d69255fa62472626e0ed71b7176b09f21cbcaf"
+  resolved "https://registry.yarnpkg.com/@vector-im/compound-web/-/compound-web-6.0.0.tgz#cd9cd36f58161aa36c77f22bab7d0644a059c94e"
-  integrity sha512-V9CQfaMyKdsWxC1D4Wz08Xh0ge3SnaOBf5SSIp1+uwoJTPyfEFHKgqbZl536SHBvVBc9M9IYg+3+lPB8xkFRFA==
+  integrity sha512-+e4QlvjkCHgsG9jaIwY7viKmf5pk9nzzuiecCM6ROAX9n0oySOd01OAl0ZZBUEWeAXsPt8UbT4Ab/ewDkPs7Zw==
   dependencies:
     "@floating-ui/react" "^0.26.9"
-    "@floating-ui/react-dom" "^2.0.8"
     "@radix-ui/react-context-menu" "^2.1.5"
     "@radix-ui/react-dropdown-menu" "^2.0.6"
-    "@radix-ui/react-form" "^0.0.3"
+    "@radix-ui/react-form" "^0.1.0"
+    "@radix-ui/react-progress" "^1.0.3"
     "@radix-ui/react-separator" "^1.0.3"
     "@radix-ui/react-slot" "^1.0.2"
-    "@radix-ui/react-tooltip" "^1.0.6"
     classnames "^2.3.2"
-    graphemer "^1.4.0"
+    ts-xor "^1.3.0"
-    vaul "^0.7.0"
+    vaul "^0.9.0"
 
 "@vitejs/plugin-basic-ssl@^1.0.1":
   version "1.1.0"
@@ -8513,6 +8491,11 @@ ts-debounce@^4.0.0:
   resolved "https://registry.yarnpkg.com/ts-debounce/-/ts-debounce-4.0.0.tgz#33440ef64fab53793c3d546a8ca6ae539ec15841"
   integrity sha512-+1iDGY6NmOGidq7i7xZGA4cm8DAa6fqdYcvO5Z6yBevH++Bdo9Qt/mN0TzHUgcCcKv1gmh9+W5dHqz8pMWbCbg==
 
+ts-xor@^1.3.0:
+  version "1.3.0"
+  resolved "https://registry.yarnpkg.com/ts-xor/-/ts-xor-1.3.0.tgz#3e59f24f0321f9f10f350e0cee3b534b89a2c70b"
+  integrity sha512-RLXVjliCzc1gfKQFLRpfeD0rrWmjnSTgj7+RFhoq3KRkUYa8LE/TIidYOzM5h+IdFBDSjjSgk9Lto9sdMfDFEA==
+
 tsconfig-paths@^3.15.0:
   version "3.15.0"
   resolved "https://registry.yarnpkg.com/tsconfig-paths/-/tsconfig-paths-3.15.0.tgz#5299ec605e55b1abb23ec939ef15edaf483070d4"
@@ -8775,13 +8758,6 @@ value-or-function@^4.0.0:
   resolved "https://registry.yarnpkg.com/value-or-function/-/value-or-function-4.0.0.tgz#70836b6a876a010dc3a2b884e7902e9db064378d"
   integrity sha512-aeVK81SIuT6aMJfNo9Vte8Dw0/FZINGBV8BfCraGtqVxIeLAEhJyoWs8SmvRVmXfGss2PmmOwZCuBPbZR+IYWg==
 
-vaul@^0.7.0:
-  version "0.7.9"
-  resolved "https://registry.yarnpkg.com/vaul/-/vaul-0.7.9.tgz#365dfe8f6c1df3a81a26508474db0e0ceb98ac8c"
-  integrity sha512-RrcnGOHOq/cEU3YpyyZrnjh0H79xMpF3IrHZs9ichvHlpKjLDc4Vwjn4VkuGzeUGrmQ3wamfm/cpdKWpvBIgQw==
-  dependencies:
-    "@radix-ui/react-dialog" "^1.0.4"
-
 vaul@^0.9.0:
   version "0.9.1"
   resolved "https://registry.yarnpkg.com/vaul/-/vaul-0.9.1.tgz#3640198e04636b209b1f907fcf3079bec6ecc66b"