uikit-react-public 0.29.5 → 0.29.6

package/dist/components/Overlay/Overlay.d.ts

@@ -1,15 +1,26 @@
 import { HTMLAttributes, RefObject, ReactElement } from 'react';
-import { Placement } from '@floating-ui/react-dom';
+import { Placement, FlipOptions, ShiftOptions } from '@floating-ui/react-dom';
 export declare const NAME = "ucl-overlay";
+type OverlaySizeOptions = {
+    padding?: number;
+    matchReferenceWidth?: boolean;
+};
+export type OverlaySize = {
+    referenceWidth: number;
+    availableWidth: number;
+    availableHeight: number;
+};
 export interface OverlayProps extends HTMLAttributes<HTMLDivElement> {
     reference: RefObject<HTMLElement | null>;
     placement?: Placement;
     blanket?: boolean;
-    flip?: boolean;
-    shift?: boolean;
+    flip?: boolean | FlipOptions;
+    shift?: boolean | ShiftOptions;
     offset?: number;
+    size?: boolean | OverlaySizeOptions;
     arrow?: ReactElement;
     arrowClassName?: string;
+    onSizeChange?: (size: OverlaySize) => void;
     onBlanketClick?: (ev: React.MouseEvent<HTMLDivElement>) => void;
 }
 export type Ref = HTMLDivElement | null;

package/dist/components/Overlay/Overlay.stories.d.ts

@@ -43,11 +43,40 @@ declare const meta: {
         reference: import('react').RefObject<HTMLElement | null>;
         placement?: import('@floating-ui/utils').Placement | undefined;
         blanket?: boolean | undefined;
-        flip?: boolean | undefined;
-        shift?: boolean | undefined;
+        flip?: boolean | {
+            padding?: import('@floating-ui/utils').Padding | undefined;
+            mainAxis?: boolean | undefined;
+            crossAxis?: boolean | "alignment" | undefined;
+            fallbackPlacements?: Array<import('@floating-ui/utils').Placement> | undefined;
+            fallbackStrategy?: "bestFit" | "initialPlacement" | undefined;
+            fallbackAxisSideDirection?: "none" | "start" | "end" | undefined;
+            flipAlignment?: boolean | undefined;
+            rootBoundary?: import('@floating-ui/core').RootBoundary | undefined;
+            elementContext?: import('@floating-ui/core').ElementContext | undefined;
+            altBoundary?: boolean | undefined;
+            boundary?: import('@floating-ui/dom').Boundary | undefined;
+        } | undefined;
+        shift?: boolean | {
+            padding?: import('@floating-ui/utils').Padding | undefined;
+            mainAxis?: boolean | undefined;
+            crossAxis?: boolean | undefined;
+            rootBoundary?: import('@floating-ui/core').RootBoundary | undefined;
+            elementContext?: import('@floating-ui/core').ElementContext | undefined;
+            altBoundary?: boolean | undefined;
+            limiter?: {
+                fn: (state: import('@floating-ui/core').MiddlewareState) => import('@floating-ui/utils').Coords;
+                options?: any;
+            } | undefined;
+            boundary?: import('@floating-ui/dom').Boundary | undefined;
+        } | undefined;
         offset?: number | undefined;
+        size?: (boolean | {
+            padding?: number;
+            matchReferenceWidth?: boolean;
+        }) | undefined;
         arrow?: import('react').ReactElement | undefined;
         arrowClassName?: string | undefined;
+        onSizeChange?: ((size: import('./Overlay').OverlaySize) => void) | undefined;
         onBlanketClick?: ((ev: React.MouseEvent<HTMLDivElement>) => void) | undefined;
         defaultChecked?: boolean | undefined | undefined;
         defaultValue?: string | number | readonly string[] | undefined;

package/dist/components/Overlay/__tests__/Overlay.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/Overlay/index.d.ts

@@ -1,2 +1,2 @@
 export { default } from './Overlay';
-export type { OverlayProps } from './Overlay';
+export type { OverlayProps, OverlaySize } from './Overlay';

package/dist/components/Select/Select.stories.d.ts

@@ -154,6 +154,18 @@ declare const meta: {
                 };
             };
         };
+        dropdownWidth: {
+            description: string;
+            control: {
+                type: "radio";
+            };
+            options: string[];
+            table: {
+                type: {
+                    summary: string;
+                };
+            };
+        };
         panelClassName: {
             description: string;
             control: {

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

@@ -26,6 +26,7 @@ export type OptionData<T> = {
  * Additional props forwarded to the filter input when `filterable` is true
  */
 export type FilterInputProps = Omit<React.InputHTMLAttributes<HTMLInputElement>, 'value' | 'onChange' | 'disabled' | 'ref' | 'role' | 'aria-autocomplete' | 'aria-label'>;
+export type SelectDropdownWidth = 'content' | 'match-select';
 type SelectBaseProps<T = string | number> = Omit<React.HTMLAttributes<HTMLElement>, 'onChange'> & {
     /**
      * Controls keyboard selection behaviour in the custom select variant.
@@ -77,6 +78,12 @@ type SelectBaseProps<T = string | number> = Omit<React.HTMLAttributes<HTMLElemen
      * Allow long option labels to wrap instead of truncating
      */
     lineBreak?: boolean;
+    /**
+     * Controls the width of the custom options panel.
+     * - `content` (default): panel is at least the Select width and can grow to fit option labels.
+     * - `match-select`: panel width is capped to the Select width.
+     */
+    dropdownWidth?: SelectDropdownWidth;
     /**
      * Custom className for the root element
      */

package/dist/components/Select/subcomponents/CustomSelect.d.ts

@@ -1,4 +1,4 @@
 import { InternalSelectProps } from '../Select.types';
 type CustomSelectProps<T> = Omit<InternalSelectProps<T>, 'native' | 'nativeHtmlAttributes'>;
-declare const CustomSelect: <T extends string | number>({ selectionBehaviour, value, options, onValueChange, disabled, clearable, placeholder, lineBreak, filterInputProps, width, testId, className, panelClassName, filterable, ref, ...props }: CustomSelectProps<T>) => import("react").JSX.Element;
+declare const CustomSelect: <T extends string | number>({ selectionBehaviour, value, options, onValueChange, disabled, clearable, placeholder, lineBreak, dropdownWidth, filterInputProps, width, testId, className, panelClassName, filterable, ref, ...props }: CustomSelectProps<T>) => import("react").JSX.Element;
 export default CustomSelect;

package/dist/components/Select/subcomponents/Panel.d.ts

@@ -1,3 +1,9 @@
-type PanelProps = React.ComponentPropsWithoutRef<'div'>;
-declare const Panel: ({ className, ...props }: PanelProps) => import("react").JSX.Element;
+import { SelectDropdownWidth } from '../Select.types';
+type PanelProps = React.ComponentPropsWithoutRef<'div'> & {
+    dropdownWidth?: SelectDropdownWidth;
+    referenceWidth?: number;
+    availableHeight?: number;
+    maxWidth?: number;
+};
+declare const Panel: ({ className, dropdownWidth, referenceWidth, availableHeight, maxWidth, ...props }: PanelProps) => import("react").JSX.Element;
 export default Panel;