@frontify/fondue-components 3.3.6 → 4.0.1

package/dist/index.d.ts

@@ -177,6 +177,7 @@ export declare const ColorPicker: {
     'data-test-id'?: string;
     } & RefAttributes<HTMLDivElement>>;
     Input: ForwardRefExoticComponent<({
+    id?: string;
     currentColor?: RgbaColor;
     isOpen?: boolean;
     onClear?: () => void;
@@ -238,6 +239,11 @@ declare type ComboboxProps = {
      * Disables the combobox component.
      */
     disabled?: boolean;
+    /**
+     * The alignment of the menu.
+     * @default "start"
+     */
+    alignMenu?: 'start' | 'center' | 'end';
     /**
      * The aria label of the combobox component.
      */
@@ -361,11 +367,21 @@ declare type DialogContentProps = {
 };
 
 declare type DialogFooterProps = {
+    /**
+     * Show a border at the top of the footer
+     * @default true
+     */
+    showBorder?: boolean;
     children?: ReactNode;
     'data-test-id'?: string;
 };
 
 declare type DialogHeaderProps = {
+    /**
+     * Show a border at the bottom of the header
+     * @default true
+     */
+    showBorder?: boolean;
     /**
      * Show a close button in the header
      * @default true
@@ -399,6 +415,11 @@ declare type DialogSideContentProps = {
 };
 
 declare type DialogTriggerProps = {
+    /**
+     * Change the default rendered element for the one passed as a child, merging their props and behavior.
+     * @default true
+     */
+    asChild?: boolean;
     children?: ReactNode;
     'data-test-id'?: string;
 };
@@ -461,6 +482,16 @@ declare type DropdownContentProps = {
     'data-test-id'?: string;
     onOpen?: () => void;
     onClose?: () => void;
+    /**
+     * The vertical padding around each dropdown item.
+     * @default "comfortable"
+     */
+    padding?: 'comfortable' | 'compact';
+    /**
+     * Defines the alignment of the dropdown.
+     * @default "start"
+     */
+    align?: 'start' | 'center' | 'end';
     /**
      * Defines the preferred side of the dropdown. It will not be respected if there are collisions with the viewport.
      * @default "bottom"
@@ -525,6 +556,11 @@ declare type DropdownSubTriggerProps = {
 };
 
 declare type DropdownTriggerProps = {
+    /**
+     * Change the default rendered element for the one passed as a child, merging their props and behavior.
+     * @default true
+     */
+    asChild?: boolean;
     children?: ReactNode;
     'data-test-id'?: string;
 };
@@ -659,6 +695,11 @@ declare type FlyoutRootProps = {
 };
 
 declare type FlyoutTriggerProps = {
+    /**
+     * Change the default rendered element for the one passed as a child, merging their props and behavior.
+     * @default true
+     */
+    asChild?: boolean;
     children?: ReactNode;
     'data-test-id'?: string;
 };
@@ -1039,6 +1080,11 @@ declare type SelectComponentProps = {
      * Disables the select component.
      */
     disabled?: boolean;
+    /**
+     * The alignment of the menu.
+     * @default "start"
+     */
+    alignMenu?: 'start' | 'center' | 'end';
     /**
      * The aria label of the select component.
      */
@@ -1050,7 +1096,7 @@ declare type SelectComponentProps = {
 };
 
 declare const SelectInput: {
-    ({ children, onSelect, value, defaultValue, placeholder, status, disabled, "aria-label": ariaLabel, "data-test-id": dataTestId, }: SelectComponentProps, forwardedRef: ForwardedRef<HTMLDivElement>): JSX_2.Element;
+    ({ children, onSelect, value, defaultValue, placeholder, status, disabled, alignMenu, "aria-label": ariaLabel, "data-test-id": dataTestId, }: SelectComponentProps, forwardedRef: ForwardedRef<HTMLDivElement>): JSX_2.Element;
     displayName: string;
 };
 
@@ -1205,6 +1251,50 @@ declare type SwitchProps = {
     'data-test-id'?: string;
 } & CommonAriaAttrs;
 
+export declare const Tabs: {
+    Root: ForwardRefExoticComponent<TabsRootProps & RefAttributes<HTMLDivElement>>;
+    Tab: ForwardRefExoticComponent<TabsTabProps & RefAttributes<HTMLDivElement>>;
+    Trigger: ForwardRefExoticComponent<TabsTriggerProps & RefAttributes<HTMLButtonElement>>;
+    Content: ForwardRefExoticComponent<TabsContentProps & RefAttributes<HTMLDivElement>>;
+};
+
+declare type TabsContentProps = {
+    children: ReactNode;
+};
+
+declare type TabsRootProps = {
+    id?: string;
+    children: ReactNode;
+    /**
+     * The default active tab
+     * Used for uncontrolled components
+     */
+    defaultActiveTab?: string;
+    /**
+     * The controlled value of the active tab
+     */
+    activeTab?: string;
+    /**
+     * The height of the tabs
+     * @default 'medium'
+     */
+    size?: 'medium' | 'large';
+    /**
+     * Event handler called when the active tab changes
+     */
+    onActiveTabChange?: (value: string) => void;
+};
+
+declare type TabsTabProps = {
+    children: ReactNode;
+    value: string;
+    disabled?: boolean;
+};
+
+declare type TabsTriggerProps = {
+    children: ReactNode;
+};
+
 declare const TextFieldRoot: {
     ({ children, className, status, "data-test-id": dataTestId, ...inputProps }: TextInputProps, ref: ForwardedRef<HTMLInputElement>): JSX_2.Element;
     displayName: string;
@@ -1353,6 +1443,11 @@ declare type TooltipRootProps = {
 };
 
 declare type TooltipTriggerProps = {
+    /**
+     * Change the default rendered element for the one passed as a child, merging their props and behavior.
+     * @default false
+     */
+    asChild?: boolean;
     children: ReactNode;
     'data-test-id'?: string;
 };