@kenlo/kdls-design-system 2.13.0 → 2.18.0

package/dist/components/BottomSheet/BottomSheet.d.ts

@@ -36,8 +36,10 @@ export interface BottomSheetProps {
     options?: BottomSheetOption[];
     /** Selects multiple options at once — renders a checkbox per row. `value`/`onChange` become string[], and changes are only committed when the Apply button (footer) is pressed */
     multiple?: boolean;
-    /** Shows a pinned "Selecionar todos" checkbox above the list. Requires multiple */
+    /** Shows a "Selecionar todos" action — a pinned checkbox row above the list by default, or a footer link with selectAllPlacement="footer". Requires multiple */
     showSelectAll?: boolean;
+    /** Where the "Selecionar todos" action sits: 'header' = checkbox row above the list | 'footer' = link in the automatic footer, opposite Aplicar. Requires showSelectAll; falls back to 'header' when a custom footer is passed */
+    selectAllPlacement?: 'header' | 'footer';
     /** Selected value(s), controlled. Single select: string | null. Multiple: string[] */
     value?: string | string[] | null;
     /** Initial value(s) in uncontrolled mode — same shape as value; ignored when value is passed */

package/dist/components/DatePicker/DatePicker.d.ts

@@ -37,6 +37,8 @@ interface DatePickerBase {
     includeTimes?: Date[];
     /** Month/year shown initially when there's no selected value */
     defaultViewDate?: Date;
+    /** Overrides the calendar's z-index, which otherwise follows where it opens: the page, or above an open Drawer, Modal or BottomSheet */
+    zIndex?: number;
     /** Disables all interaction */
     disabled?: boolean;
     /** Shows a spinner on the trigger and blocks interaction — use while data is loading */

package/dist/components/Floating/Floating.d.ts

@@ -2,6 +2,8 @@ import React from 'react';
 import './Floating.css';
 export type FloatingPlacement = 'top' | 'topLeft' | 'topRight' | 'right' | 'rightTop' | 'rightBottom' | 'bottom' | 'bottomLeft' | 'bottomRight' | 'left' | 'leftTop' | 'leftBottom';
 export type FloatingTriggerMode = 'click' | 'hover' | 'focus' | 'contextMenu';
+/** True inside an open Drawer, Modal or BottomSheet — set by them around their content */
+export declare const OverlayContext: React.Context<boolean>;
 export interface FloatingProps {
     children: React.ReactNode;
     content: React.ReactNode | ((activePlacement: FloatingPlacement) => React.ReactNode);
@@ -15,7 +17,10 @@ export interface FloatingProps {
     defaultOpen?: boolean;
     destroyOnClose?: boolean;
     getPopupContainer?: () => HTMLElement;
+    /** Wins over every automatic layer */
     zIndex?: number;
+    /** Layer at page level — inside a Drawer, Modal or BottomSheet the panel goes above it instead */
+    baseZIndex?: number;
     matchTriggerWidth?: boolean;
     className?: string;
     openClassName?: string;

package/dist/components/Floating/Floating.test.d.ts

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

package/dist/components/Header/Header.d.ts

@@ -41,6 +41,11 @@ export interface HeaderProfileMenuItem {
 export interface HeaderProps {
     /** Kenlo product that determines the logo */
     product?: KenloLogoProduct;
+    /** The product's own logo, drawn in place of the Kenlo one — for a product that is
+     *  not one of the Kenlo logos in `product` (an internal tool, a partner product).
+     *  Takes precedence over `product`. Rendered 24px tall, width follows the artwork;
+     *  keeps the link behaviour of logoHref / onLogoClick / logoLabel. */
+    logo?: IconElement;
     /** Where the logo links to — normally the product's home. Always the consumer's to
      *  set: the DS is used by Kenlo products, by the CMS and by products carrying their
      *  own brand (Vira), and each one's home is somewhere else. */

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

@@ -34,6 +34,10 @@ interface SelectBase {
     searchable?: boolean;
     /** Search field placeholder */
     searchPlaceholder?: string;
+    /** Text shown in the trigger when every option is selected, instead of "first option +N" — requires multiple */
+    allSelectedLabel?: string;
+    /** Where the "Selecionar todos" action sits: 'header' = checkbox row above the list | 'footer' = link in the footer, opposite Aplicar. Requires showSelectAll */
+    selectAllPlacement?: 'header' | 'footer';
     /** When false, disables the frontend filter — dev controls the options via onSearch + options */
     filterOption?: boolean;
     /** Callback fired on every change in the search field */
@@ -42,7 +46,7 @@ interface SelectBase {
     loading?: boolean;
     /** Callback fired when scrolling the list — use for infinite scroll */
     onMenuScroll?: (e: React.UIEvent<HTMLUListElement>) => void;
-    /** Shows a "Select all" checkbox as the list's first row — requires multiple */
+    /** Shows a "Selecionar todos" action — a checkbox row above the list by default, or a footer link with selectAllPlacement="footer". Requires multiple */
     showSelectAll?: boolean;
     /** Shows a spinner on the trigger and blocks interaction — use while the initial options are loading from the API */
     isLoading?: boolean;

package/dist/components/Tooltip/Tooltip.d.ts

@@ -8,6 +8,8 @@ export interface TooltipProps {
     children?: React.ReactNode;
     /** Tooltip position relative to the trigger. Automatically flips to the opposite side when there's no space in the requested direction. */
     placement?: TooltipPosition;
+    /** Width of the trigger's wrapper, only with `children`: 'hug' = fits the trigger, inline | 'fill' = takes the full width of the parent and stretches the trigger to it — use when the trigger is a full-width row, such as a Card. Has no effect without `children`: the default info icon keeps its own size. */
+    width?: 'hug' | 'fill';
     /** Additional CSS class applied to the trigger's wrapper. */
     className?: string;
 }