@frontify/fondue-components 25.0.0 → 26.0.2

package/dist/fondue-components99.js

@@ -0,0 +1,48 @@
+const c = "_root_13ciu_7", e = "_selectedValue_13ciu_63", _ = "_input_13ciu_80", o = "_slot_13ciu_106", t = "_clear_13ciu_156", n = "_clearIcon_13ciu_163", u = "_icons_13ciu_167", i = "_caret_13ciu_173", r = "_iconSuccess_13ciu_201", s = "_iconError_13ciu_207", a = "_menu_13ciu_213", l = "_portal_13ciu_236", p = "_item_13ciu_252", g = "_checkmarkIcon_13ciu_281", m = "_itemValue_13ciu_287", d = "_group_13ciu_301", I = "_groupHeading_13ciu_312", b = "_badgesContainer_13ciu_324", k = "_badgeWrapper_13ciu_336", S = "_srOnly_13ciu_345", V = "_multiSelectInput_13ciu_357", y = {
+  root: c,
+  selectedValue: e,
+  input: _,
+  slot: o,
+  clear: t,
+  clearIcon: n,
+  icons: u,
+  caret: i,
+  iconSuccess: r,
+  iconError: s,
+  menu: a,
+  portal: l,
+  item: p,
+  checkmarkIcon: g,
+  itemValue: m,
+  group: d,
+  groupHeading: I,
+  badgesContainer: b,
+  badgeWrapper: k,
+  srOnly: S,
+  multiSelectInput: V
+};
+export {
+  k as badgeWrapper,
+  b as badgesContainer,
+  i as caret,
+  g as checkmarkIcon,
+  t as clear,
+  n as clearIcon,
+  y as default,
+  d as group,
+  I as groupHeading,
+  s as iconError,
+  r as iconSuccess,
+  u as icons,
+  _ as input,
+  p as item,
+  m as itemValue,
+  a as menu,
+  V as multiSelectInput,
+  l as portal,
+  c as root,
+  e as selectedValue,
+  o as slot,
+  S as srOnly
+};
+//# sourceMappingURL=fondue-components99.js.map

package/dist/fondue-components99.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"fondue-components99.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/index.d.ts

@@ -188,11 +188,11 @@ declare type BadgeProps = {
     /**
      * Click handler
      */
-    onClick?: (event?: MouseEvent_2<HTMLButtonElement>) => void;
+    onClick?: (event: MouseEvent_2<HTMLButtonElement>) => void;
     /**
      * Click handler on dismiss - providing this will show the dismiss button
      */
-    onDismiss?: (event?: MouseEvent_2<HTMLButtonElement>) => void;
+    onDismiss?: (event: MouseEvent_2<HTMLButtonElement>) => void;
     /**
      * The color of the status dot
      */
@@ -422,6 +422,64 @@ declare type ColorPickerProps = {
     'data-test-id'?: string;
 };
 
+declare type ComboboxComponent = typeof ComboboxSingle & {
+    Multiple: typeof ComboboxMultiple;
+};
+
+declare const ComboboxMultiple: ForwardRefExoticComponent<    {
+children?: ReactNode;
+placeholder?: string;
+status?: "neutral" | "success" | "error";
+disabled?: boolean;
+alignMenu?: "start" | "center" | "end";
+side?: "left" | "right" | "bottom" | "top";
+id?: string;
+'data-test-id'?: string;
+viewportCollisionPadding?: SelectMenuViewportCollisionPadding;
+getAsyncItems?: AsyncItemsFetcher;
+onEscapeKeyDown?: (event: KeyboardEvent) => void;
+} & CommonAriaProps & {
+/**
+* The active value in the combobox component. This is used to control the combobox externally
+*/
+value?: string[] | null;
+/**
+* Callback function that is called when items are selected
+*/
+onSelect?: (selectedValues: string[] | null) => void;
+/**
+* The default value of the combobox component. Used for uncontrolled usages
+*/
+defaultValue?: string[];
+} & RefAttributes<HTMLDivElement>>;
+
+declare const ComboboxSingle: ForwardRefExoticComponent<    {
+children?: ReactNode;
+placeholder?: string;
+status?: "neutral" | "success" | "error";
+disabled?: boolean;
+alignMenu?: "start" | "center" | "end";
+side?: "left" | "right" | "bottom" | "top";
+id?: string;
+'data-test-id'?: string;
+viewportCollisionPadding?: SelectMenuViewportCollisionPadding;
+getAsyncItems?: AsyncItemsFetcher;
+onEscapeKeyDown?: (event: KeyboardEvent) => void;
+} & CommonAriaProps & {
+/**
+* The active value in the combobox component. This is used to control the combobox externally
+*/
+value?: string | null;
+/**
+* Callback function that is called when an item is selected
+*/
+onSelect?: (selectedValue: string | null) => void;
+/**
+* The default value of the combobox component. Used for uncontrolled usages
+*/
+defaultValue?: string;
+} & RefAttributes<HTMLDivElement>>;
+
 declare type CommonAriaAttrs = Pick<AriaAttributes, 'aria-describedby'> & AtLeastOneAriaLabelAttr;
 
 declare type CommonAriaProps = {
@@ -809,6 +867,11 @@ declare const enUS: {
     Flyout_close: string;
     Select_clear: string;
     Select_toggleMenu: string;
+    Select_error: string;
+    Select_selectedCount: string;
+    Select_singleItemSelected: string;
+    Select_multipleItemsSelected: string;
+    Select_additionalItemsSelected: string;
     Switch_defaultLabel: string;
     Table_sortByDescending: string;
     Table_sortByAscending: string;
@@ -999,68 +1062,6 @@ declare type FlyoutTriggerProps = {
 
 declare type FlyoutViewportCollisionPadding = 'compact' | 'spacious';
 
-declare const ForwardedRefCombobox: ForwardRefExoticComponent<    {
-/**
-* Children of the Combobox component. This can contain the `Select.Slot` components for the label, decorators, clear action and menu.
-*/
-children?: ReactNode;
-/**
-* Callback function that is called when an item is selected.
-*/
-onSelect?: (selectedValue: string | null) => void;
-/**
-* The active value in the combobox component. This is used to control the combobox externally.
-*/
-value?: string | null;
-/**
-* The default value of the combobox component. Used for uncontrolled usages.
-*/
-defaultValue?: string;
-/**
-* The placeholder in the combobox component.
-*/
-placeholder?: string;
-/**
-* Status of the text input
-* @default "neutral"
-*/
-status?: "neutral" | "success" | "error";
-/**
-* Disables the combobox component.
-*/
-disabled?: boolean;
-/**
-* The alignment of the menu.
-* @default "start"
-*/
-alignMenu?: "start" | "center" | "end" /**
-* Defines the preferred side of the combobox. It will not be respected if there are collisions with the viewport.
-* @default "bottom"
-*/;
-side?: "left" | "right" | "bottom" | "top";
-/**
-* Id of the combobox component
-*/
-id?: string;
-/**
-* The data test id of the combobox component.
-*/
-'data-test-id'?: string;
-/**
-* Define the minimum distance between the select menu and the viewport edge
-* @default 'compact'
-*/
-viewportCollisionPadding?: SelectMenuViewportCollisionPadding;
-/**
-* Function to fetch items asynchronously.
-*/
-getAsyncItems?: AsyncItemsFetcher;
-/**
-* Event handler called when the escape key is pressed.
-*/
-onEscapeKeyDown?: (event: KeyboardEvent) => void;
-} & CommonAriaProps & RefAttributes<HTMLDivElement>>;
-
 declare const ForwardedRefSelectItem: ForwardRefExoticComponent<SelectItemProps & RefAttributes<HTMLLIElement>>;
 
 declare const ForwardedRefSelectItemGroup: ForwardRefExoticComponent<SelectItemGroupProps & RefAttributes<HTMLDivElement>>;
@@ -1668,83 +1669,14 @@ declare type SegmentedControlRootProps<TValue extends string = string> = {
     hugWidth?: boolean;
 };
 
-export declare const Select: typeof SelectInput & {
-    Combobox: typeof ForwardedRefCombobox;
+export declare const Select: typeof SelectSingle & {
+    Multiple: typeof SelectMultiple;
+    Combobox: ComboboxComponent;
     Item: typeof ForwardedRefSelectItem;
     Group: typeof ForwardedRefSelectItemGroup;
     Slot: typeof ForwardedRefSelectSlot;
 };
 
-declare type SelectComponentProps = {
-    /**
-     * Children of the Select component. This can contain the `Select.Slot` components for the label, decorators, clear action and menu.
-     */
-    children?: ReactNode;
-    /**
-     * Callback function that is called when an item is selected.
-     */
-    onSelect?: (selectedValue: string | null) => void;
-    /**
-     * The active value in the select component. This is used to control the select externally.
-     */
-    value?: string | null;
-    /**
-     * The default value of the select component. Used for uncontrolled usages.
-     */
-    defaultValue?: string;
-    /**
-     * The placeholder in the select component.
-     */
-    placeholder?: string;
-    /**
-     * Status of the text input
-     * @default "neutral"
-     */
-    status?: 'neutral' | 'success' | 'error';
-    /**
-     * Disables the select component.
-     */
-    disabled?: boolean;
-    /**
-     * The alignment of the menu.
-     * @default "start"
-     */
-    alignMenu?: 'start' | 'center' | 'end';
-    /**
-     * Defines the preferred side of the select. It will not be respected if there are collisions with the viewport.
-     * @default "bottom"
-     */
-    side?: 'left' | 'right' | 'bottom' | 'top';
-    /**
-     * The data test id of the select component.
-     */
-    'data-test-id'?: string;
-    /**
-     * Id of the select component
-     */
-    id?: string;
-    /**
-     * The value of the select is shown as plain text (from the label prop) when set to true.
-     * Items child components are used if set to false
-     * @default true
-     */
-    showStringValue?: boolean;
-    /**
-     * Define the minimum distance between the select menu and the viewport edge
-     * @default 'compact'
-     */
-    viewportCollisionPadding?: SelectMenuViewportCollisionPadding;
-    /**
-     * Event handler called when the escape key is pressed.
-     */
-    onEscapeKeyDown?: (event: KeyboardEvent) => void;
-} & CommonAriaProps;
-
-declare const SelectInput: {
-    ({ children, onSelect, value, defaultValue, placeholder, status, disabled, alignMenu, side, id, showStringValue, "data-test-id": dataTestId, viewportCollisionPadding, onEscapeKeyDown, ...props }: SelectComponentProps, forwardedRef: ForwardedRef<HTMLDivElement>): JSX_2.Element;
-    displayName: string;
-};
-
 declare type SelectItemGroupProps = {
     /**
      * The children of the select item group. This can contain multiple `Select.Item` components.
@@ -1789,6 +1721,60 @@ declare type SelectItemProps = {
 
 declare type SelectMenuViewportCollisionPadding = 'compact' | 'spacious';
 
+declare const SelectMultiple: ForwardRefExoticComponent<    {
+children?: ReactNode;
+placeholder?: string;
+status?: "neutral" | "success" | "error";
+disabled?: boolean;
+alignMenu?: "start" | "center" | "end";
+side?: "left" | "right" | "bottom" | "top";
+'data-test-id'?: string;
+id?: string;
+showStringValue?: boolean;
+viewportCollisionPadding?: SelectMenuViewportCollisionPadding;
+onEscapeKeyDown?: (event: KeyboardEvent) => void;
+} & CommonAriaProps & {
+/**
+* The active value in the select component. This is used to control the select externally
+*/
+value?: string[] | null;
+/**
+* Callback function that is called when items are selected
+*/
+onSelect?: (selectedValues: string[] | null) => void;
+/**
+* The default value of the select component. Used for uncontrolled usages
+*/
+defaultValue?: string[];
+} & RefAttributes<HTMLDivElement>>;
+
+declare const SelectSingle: ForwardRefExoticComponent<    {
+children?: ReactNode;
+placeholder?: string;
+status?: "neutral" | "success" | "error";
+disabled?: boolean;
+alignMenu?: "start" | "center" | "end";
+side?: "left" | "right" | "bottom" | "top";
+'data-test-id'?: string;
+id?: string;
+showStringValue?: boolean;
+viewportCollisionPadding?: SelectMenuViewportCollisionPadding;
+onEscapeKeyDown?: (event: KeyboardEvent) => void;
+} & CommonAriaProps & {
+/**
+* The active value in the select component. This is used to control the select externally
+*/
+value?: string | null;
+/**
+* Callback function that is called when an item is selected
+*/
+onSelect?: (selectedValue: string | null) => void;
+/**
+* The default value of the select component. Used for uncontrolled usages
+*/
+defaultValue?: string;
+} & RefAttributes<HTMLDivElement>>;
+
 declare type SelectSlotProps = {
     /**
      * The children of the select slot. This can be a custom component.