@kaizen/components 0.0.0-canary-test-fms-popover-api-update-20250624021814 → 0.0.0-canary-test-cherry-picked-updates-20250702235156

package/dist/types/Filter/FilterMultiSelect/FilterMultiSelect.d.ts

@@ -19,7 +19,7 @@ export type FilterMultiSelectProps = {
     className?: string;
 } & Omit<MenuPopupProps, 'children'> & Omit<MenuTriggerProviderProps, 'children'> & SelectionProps;
 export declare const FilterMultiSelect: {
-    ({ trigger, children, isOpen, defaultOpen, onOpenChange, isLoading, loadingSkeleton, label, items, selectedKeys, defaultSelectedKeys, onSelectionChange, selectionMode, onSearchInputChange, triggerRef, className, floatingOptions, }: FilterMultiSelectProps): JSX.Element;
+    ({ trigger, children, isOpen, defaultOpen, onOpenChange, isLoading, loadingSkeleton, label, items, selectedKeys, defaultSelectedKeys, onSelectionChange, selectionMode, onSearchInputChange, triggerRef, className, }: FilterMultiSelectProps): JSX.Element;
     displayName: string;
     TriggerButton: {
         ({ selectedOptionLabels, label, classNameOverride, labelCharacterLimitBeforeTruncate, }: import("./subcomponents/Trigger").FilterTriggerButtonProps): JSX.Element;

package/dist/types/Filter/FilterMultiSelect/_docs/MockData.d.ts

@@ -8,4 +8,3 @@ export declare const locationDemographicValues: {
     demographicValueId: string;
     label: string;
 }[];
-export declare const mockManyItems: ItemType[];

package/dist/types/Filter/FilterMultiSelect/subcomponents/MenuPopup/MenuPopup.d.ts

@@ -1,13 +1,10 @@
-import React, { type HTMLAttributes } from 'react';
-import { type UseFloatingOptions } from '@floating-ui/react-dom';
-import { type OverrideClassName } from "../../../../types/OverrideClassName";
+import React from 'react';
 export type MenuPopupProps = {
-    children: React.ReactNode;
-    floatingOptions?: Partial<UseFloatingOptions>;
     isLoading?: boolean;
     loadingSkeleton?: React.ReactNode;
-} & OverrideClassName<HTMLAttributes<HTMLDivElement>>;
+    children: React.ReactNode;
+};
 export declare const MenuPopup: {
-    ({ children, floatingOptions, classNameOverride, isLoading, loadingSkeleton, ...restProps }: MenuPopupProps): JSX.Element;
+    ({ isLoading, loadingSkeleton, children, }: MenuPopupProps): JSX.Element;
     displayName: string;
 };

package/dist/types/__next__/Select/Select.d.ts

@@ -5,7 +5,7 @@ import { type Key } from '@react-types/shared';
 import { type OverrideClassName } from "../../types/OverrideClassName";
 import { type SelectPopoverContentsProps, type SelectToggleProps } from './subcomponents';
 import { type SelectItem, type SelectOption } from './types';
-type OmittedAriaSelectProps = 'children' | 'items' | 'onSelectionChange';
+type OmittedAriaSelectProps = 'children' | 'items';
 export type SelectProps<Option extends SelectOption = SelectOption> = {
     /**
      * Item objects in the collection.
@@ -45,17 +45,13 @@ export type SelectProps<Option extends SelectOption = SelectOption> = {
      * Use the `labelText` prop to provide a concise name, and the `description` prop for any help text.
      */
     placeholder?: string;
-    /**
-     * Handler that is called when the selection changes.
-     */
-    onSelectionChange?: (key: Key) => void;
 } & OverrideClassName<Omit<AriaSelectProps<Option>, OmittedAriaSelectProps>>;
 /**
  * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3081896474/Select Guidance} |
  * {@link https://cultureamp.design/?path=/docs/components-select--docs Storybook}
  */
 export declare const Select: {
-    <Option extends SelectOption = SelectOption>({ label, items, id: propsId, trigger, children, status, validationMessage, isReversed, isRequired, isFullWidth, disabledValues, classNameOverride, selectedKey, description, placeholder, isDisabled, onSelectionChange, portalContainerId, ...restProps }: SelectProps<Option>): JSX.Element;
+    <Option extends SelectOption = SelectOption>({ label, items, id: propsId, trigger, children, status, validationMessage, isReversed, isRequired, isFullWidth, disabledValues, classNameOverride, selectedKey, description, placeholder, isDisabled, portalContainerId, onSelectionChange, ...restProps }: SelectProps<Option>): JSX.Element;
     displayName: string;
     Section: {
         <Option extends SelectOption = SelectOption>({ section, }: import("./subcomponents").ListBoxSectionProps<Option>): JSX.Element;

package/dist/types/__next__/Select/subcomponents/Overlay/Overlay.d.ts

@@ -3,9 +3,8 @@ import { type OverrideClassName } from "../../../../types/OverrideClassName";
 import { type SelectOption } from '../../types';
 export type OverlayProps = OverrideClassName<HTMLAttributes<HTMLDivElement>> & {
     children: React.ReactNode;
-    popoverRef?: React.RefObject<Element | null>;
 };
 export declare const Overlay: {
-    <Option extends SelectOption>({ children, classNameOverride, popoverRef, ...restProps }: OverlayProps): JSX.Element;
+    <Option extends SelectOption>({ children, classNameOverride, ...restProps }: OverlayProps): JSX.Element;
     displayName: string;
 };

package/dist/types/__next__/Select/subcomponents/SelectPopoverContents/SelectPopoverContents.d.ts

@@ -6,9 +6,8 @@ export type SelectPopoverContentsProps<Option extends SelectOption> = {
         items: SelectItemNode<Option>[];
     }) => React.ReactNode;
     menuProps: AriaListBoxOptions<SelectItem<Option>>;
-    popoverRef?: React.RefObject<Element | null>;
 };
 export declare const SelectPopoverContents: {
-    <Option extends SelectOption>({ children, menuProps, popoverRef, }: SelectPopoverContentsProps<Option>): JSX.Element;
+    <Option extends SelectOption>({ children, menuProps, }: SelectPopoverContentsProps<Option>): JSX.Element;
     displayName: string;
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kaizen/components",
-  "version": "0.0.0-canary-test-fms-popover-api-update-20250624021814",
+  "version": "0.0.0-canary-test-cherry-picked-updates-20250702235156",
   "description": "Kaizen component library",
   "author": "Geoffrey Chong <geoff.chong@cultureamp.com>",
   "homepage": "https://cultureamp.design",

package/src/Avatar/Avatar.module.css

@@ -1,140 +1,138 @@
-@layer kz-components {
-  .wrapper {
-    --avatar-x-y: 1.5rem;
-
-    background: var(--color-gray-300);
-    border-radius: 100%;
-    box-sizing: border-box;
-    overflow: hidden;
-    align-items: center;
-    display: flex;
-    justify-content: center;
-    width: var(--avatar-x-y);
-    height: var(--avatar-x-y);
-    box-shadow: var(--shadow-small-box-shadow);
-    border: 3px solid var(--color-white);
-  }
-
-  .small {
-    box-shadow: none;
-    border: none;
-
-    --avatar-x-y: 1.25rem;
-  }
-
-  .medium {
-    --avatar-x-y: 3rem;
-  }
-
-  .large {
-    --avatar-x-y: 4.5rem;
-  }
-
-  .xlarge {
-    --avatar-x-y: 6rem;
-  }
-
-  .xxlarge {
-    --avatar-x-y: 7.75rem;
-  }
-
-  /* Themes */
-  .personal {
-    background: var(--color-orange-100);
-  }
-
-  .otherUser {
-    background: var(--color-gray-300);
-  }
-
-  .company {
-    border: 0;
-    background: var(--color-white);
-    padding: var(--spacing-6);
-    border-radius: var(--border-solid-border-radius);
-  }
-
-  .small.company {
-    padding: 0;
-  }
-
-  .avatarImage {
-    width: 100%;
-    height: 100%;
-    object-fit: cover;
-  }
-
-  .avatarImage.loading {
-    display: none;
-  }
-
-  .companyAvatarImage {
-    object-fit: contain;
-    box-sizing: border-box;
-    border-radius: var(--spacing-4);
-  }
-
-  .fallbackIcon {
-    color: rgb(var(--color-purple-800-rgb), 0.7);
-    font-size: calc(var(--avatar-x-y) * 0.7);
-  }
-
-  .xlarge .fallbackIcon,
-  .xxlarge .fallbackIcon {
-    font-size: calc(var(--avatar-x-y) * 0.8);
-  }
-
-  .initials {
-    box-sizing: border-box;
-    color: var(--color-purple-800);
-    padding-left: 5px;
-    padding-right: 5px;
-    text-align: center;
-    width: 100%;
-    font-size: var(--typography-heading-3-font-size);
-    font-family: var(--typography-heading-1-font-family);
-    font-weight: var(--typography-heading-1-font-weight);
-    letter-spacing: var(--typography-heading-3-letter-spacing);
-  }
-
-  .initials.longName::before {
-    content: none;
-  }
-
-  .initials::before {
-    content: '';
-    display: block;
-    margin-top: -0.001em;
-  }
-
-  .wrapper .initials {
-    text-decoration: none;
-    speak-as: spell-out;
-
-    /* to override materialize.css global styling in performance-ui,
+.wrapper {
+  --avatar-x-y: 1.5rem;
+
+  background: var(--color-gray-300);
+  border-radius: 100%;
+  box-sizing: border-box;
+  overflow: hidden;
+  align-items: center;
+  display: flex;
+  justify-content: center;
+  width: var(--avatar-x-y);
+  height: var(--avatar-x-y);
+  box-shadow: var(--shadow-small-box-shadow);
+  border: 3px solid var(--color-white);
+}
+
+.small {
+  box-shadow: none;
+  border: none;
+
+  --avatar-x-y: 1.25rem;
+}
+
+.medium {
+  --avatar-x-y: 3rem;
+}
+
+.large {
+  --avatar-x-y: 4.5rem;
+}
+
+.xlarge {
+  --avatar-x-y: 6rem;
+}
+
+.xxlarge {
+  --avatar-x-y: 7.75rem;
+}
+
+/* Themes */
+.personal {
+  background: var(--color-orange-100);
+}
+
+.otherUser {
+  background: var(--color-gray-300);
+}
+
+.company {
+  border: 0;
+  background: var(--color-white);
+  padding: var(--spacing-6);
+  border-radius: var(--border-solid-border-radius);
+}
+
+.small.company {
+  padding: 0;
+}
+
+.avatarImage {
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+}
+
+.avatarImage.loading {
+  display: none;
+}
+
+.companyAvatarImage {
+  object-fit: contain;
+  box-sizing: border-box;
+  border-radius: var(--spacing-4);
+}
+
+.fallbackIcon {
+  color: rgb(var(--color-purple-800-rgb), 0.7);
+  font-size: calc(var(--avatar-x-y) * 0.7);
+}
+
+.xlarge .fallbackIcon,
+.xxlarge .fallbackIcon {
+  font-size: calc(var(--avatar-x-y) * 0.8);
+}
+
+.initials {
+  box-sizing: border-box;
+  color: var(--color-purple-800);
+  padding-left: 5px;
+  padding-right: 5px;
+  text-align: center;
+  width: 100%;
+  font-size: var(--typography-heading-3-font-size);
+  font-family: var(--typography-heading-1-font-family);
+  font-weight: var(--typography-heading-1-font-weight);
+  letter-spacing: var(--typography-heading-3-letter-spacing);
+}
+
+.initials.longName::before {
+  content: none;
+}
+
+.initials::before {
+  content: '';
+  display: block;
+  margin-top: -0.001em;
+}
+
+.wrapper .initials {
+  text-decoration: none;
+  speak-as: spell-out;
+
+  /* to override materialize.css global styling in performance-ui,
   * which sets a border-bottom on abbr tags
   */
-    border-bottom: none;
-  }
-
-  .xlarge .initials,
-  .xxlarge .initials {
-    font-size: var(--typography-heading-1-font-size);
-    letter-spacing: var(--typography-heading-1-letter-spacing);
-  }
-
-  .medium .initials {
-    font-size: var(--typography-heading-5-font-size);
-  }
-
-  .small .initials {
-    font-size: 0.5rem;
-  }
-
-  .small .initials,
-  .medium .initials {
-    margin-bottom: -1px;
-    font-weight: var(--typography-heading-5-font-weight);
-    letter-spacing: var(--typography-heading-5-letter-spacing);
-  }
+  border-bottom: none;
+}
+
+.xlarge .initials,
+.xxlarge .initials {
+  font-size: var(--typography-heading-1-font-size);
+  letter-spacing: var(--typography-heading-1-letter-spacing);
+}
+
+.medium .initials {
+  font-size: var(--typography-heading-5-font-size);
+}
+
+.small .initials {
+  font-size: 0.5rem;
+}
+
+.small .initials,
+.medium .initials {
+  margin-bottom: -1px;
+  font-weight: var(--typography-heading-5-font-weight);
+  letter-spacing: var(--typography-heading-5-letter-spacing);
 }

package/src/AvatarGroup/AvatarGroup.module.css

@@ -1,59 +1,57 @@
-@layer kz-components {
-  .AvatarGroup {
-    display: inline-flex;
-    list-style: none;
-    margin: 0;
-    padding: 0;
-  }
-
-  .AvatarCounter {
-    direction: ltr;
-    align-items: center;
-    background: var(--color-gray-300);
-    border: 3px solid var(--color-white);
-    border-radius: 100%;
-    box-sizing: border-box;
-    box-shadow: var(--shadow-small-box-shadow);
-    display: flex;
-    justify-content: center;
-    overflow: hidden;
-    width: var(--avatar-x-y, 1.25rem);
-    height: var(--avatar-x-y, 1.25rem);
-    font-family: var(--typography-heading-5-font-family);
-    font-weight: var(--typography-heading-5-font-weight);
-    letter-spacing: var(--typography-heading-5-letter-spacing);
-  }
-
-  .AvatarGroupItem + .AvatarGroupItem {
-    margin-inline-start: calc((var(--avatar-x-y)) / -2);
-  }
-
-  .small {
-    --avatar-x-y: 1.25rem;
-  }
-
-  .small .AvatarCounter {
-    box-shadow: none;
-    border: none;
-    font-size: 0.5rem;
-  }
-
-  .medium {
-    --avatar-x-y: 3rem;
-  }
-
-  .medium .AvatarCounter {
-    font-size: var(--typography-heading-5-font-size);
-  }
-
-  .large {
-    --avatar-x-y: 4.5rem;
-  }
-
-  .large .AvatarCounter {
-    font-family: var(--typography-heading-3-font-family);
-    font-size: var(--typography-heading-3-font-size);
-    font-weight: var(--typography-heading-3-font-weight);
-    letter-spacing: var(--typography-heading-3-letter-spacing);
-  }
+.AvatarGroup {
+  display: inline-flex;
+  list-style: none;
+  margin: 0;
+  padding: 0;
+}
+
+.AvatarCounter {
+  direction: ltr;
+  align-items: center;
+  background: var(--color-gray-300);
+  border: 3px solid var(--color-white);
+  border-radius: 100%;
+  box-sizing: border-box;
+  box-shadow: var(--shadow-small-box-shadow);
+  display: flex;
+  justify-content: center;
+  overflow: hidden;
+  width: var(--avatar-x-y, 1.25rem);
+  height: var(--avatar-x-y, 1.25rem);
+  font-family: var(--typography-heading-5-font-family);
+  font-weight: var(--typography-heading-5-font-weight);
+  letter-spacing: var(--typography-heading-5-letter-spacing);
+}
+
+.AvatarGroupItem + .AvatarGroupItem {
+  margin-inline-start: calc((var(--avatar-x-y)) / -2);
+}
+
+.small {
+  --avatar-x-y: 1.25rem;
+}
+
+.small .AvatarCounter {
+  box-shadow: none;
+  border: none;
+  font-size: 0.5rem;
+}
+
+.medium {
+  --avatar-x-y: 3rem;
+}
+
+.medium .AvatarCounter {
+  font-size: var(--typography-heading-5-font-size);
+}
+
+.large {
+  --avatar-x-y: 4.5rem;
+}
+
+.large .AvatarCounter {
+  font-family: var(--typography-heading-3-font-family);
+  font-size: var(--typography-heading-3-font-size);
+  font-weight: var(--typography-heading-3-font-weight);
+  letter-spacing: var(--typography-heading-3-letter-spacing);
 }