@konstructio/ui 0.1.2-alpha.103 → 0.1.2-alpha.105

package/dist/events.types-BG1Uh8i6.js

@@ -0,0 +1,6 @@
+var R = /* @__PURE__ */ (function(t) {
+  return t.EXPAND_ROW = "@konstructio/VirtualizedTable/event-EXPAND_ROW", t.COLLAPSE_ROW = "@konstructio/VirtualizedTable/event-COLLAPSE_ROW", t.TOGGLE_ROW = "@konstructio/VirtualizedTable/event-TOGGLE_ROW", t.RESET_FILTERS = "@konstructio/VirtualizedTable/event-RESET_FILTERS", t.REFRESH = "@konstructio/VirtualizedTable/event-REFRESH", t;
+})({});
+export {
+  R as t
+};

package/dist/hooks/index.js

@@ -1,6 +1,8 @@
-import { useMediaQuery as o } from "./useMediaQuery.js";
-import { useToggle as m } from "./useToggle.js";
+import { useClickOutside as o } from "./useClickOutside.js";
+import { useMediaQuery as i } from "./useMediaQuery.js";
+import { useToggle as t } from "./useToggle.js";
 export {
-  o as useMediaQuery,
-  m as useToggle
+  o as useClickOutside,
+  i as useMediaQuery,
+  t as useToggle
 };

package/dist/hooks/useClickOutside.js

@@ -0,0 +1,14 @@
+import { useEffect as o } from "react";
+var a = (t, r) => {
+  o(() => {
+    const e = new AbortController();
+    return document.addEventListener("mousedown", (n) => {
+      t.current?.contains(n.target) || r();
+    }, { signal: e.signal }), () => {
+      e.abort();
+    };
+  }, [t, r]);
+};
+export {
+  a as useClickOutside
+};

package/dist/index.js

@@ -1,159 +1,167 @@
-import { t as o } from "./Checkbox-DzAx7n67.js";
-import { t as m } from "./DropdownButton-DnlwdPmb.js";
+import { t as o } from "./Checkbox-B_ngk9Dj.js";
+import { t as m } from "./DropdownButton-DfNojmCW.js";
 import { t as e } from "./Breadcrumb-Cp3abB2w.js";
-import { t as a } from "./Input-CW0VwW2T.js";
-import { t as n } from "./Counter-CY0xGnVM.js";
+import { t as a } from "./Input-Cf44DzfE.js";
+import { t as n } from "./Counter-BV680M5r.js";
 import { i as l, t as d } from "./utils-Cx-WzRZF.js";
 import { Alert as g } from "./components/Alert/Alert.js";
 import { Button as c } from "./components/Button/Button.js";
 import { AlertDialog as D } from "./components/AlertDialog/AlertDialog.js";
-import { Autocomplete as V } from "./components/Autocomplete/Autocomplete.js";
-import { t as w } from "./Loading-fD0Xiyeq.js";
-import { Badge as S } from "./components/Badge/Badge.js";
-import { Typography as x } from "./components/Typography/Typography.js";
-import { ButtonGroup as L } from "./components/ButtonGroup/ButtonGroup.js";
-import { Card as E } from "./components/Card/Card.js";
-import { useMediaQuery as I } from "./hooks/useMediaQuery.js";
-import { useToggle as M } from "./hooks/useToggle.js";
-import { DatePicker as A } from "./components/Datepicker/DatePicker.js";
-import { Radio as y } from "./components/Radio/Radio.js";
-import { RadioGroup as O } from "./components/RadioGroup/RadioGroup.js";
-import { TimePicker as U } from "./components/TimePicker/TimePicker.js";
-import { DateRangePicker as j } from "./components/DateRangePicker/DateRangePicker.js";
-import { Divider as H } from "./components/Divider/Divider.js";
-import { Drawer as K } from "./components/Drawer/Drawer.js";
-import { BadgeMultiSelect as Y } from "./components/Filter/components/BadgeDropdown/BadgeMultiSelect.js";
-import { DateFilterDropdown as _ } from "./components/Filter/components/DateFilterDropdown/DateFilterDropdown.js";
-import { DateRangeFilterDropdown as rr } from "./components/Filter/components/DateRangeFilterDropdown/DateRangeFilterDropdown.js";
-import { TextMultiSelect as tr } from "./components/Filter/components/TextMultiSelect/TextMultiSelect.js";
-import { TimeFilterDropdown as ir } from "./components/Filter/components/TimeFilterDropdown/TimeFilterDropdown.js";
-import { Filter as pr } from "./components/Filter/Filter.js";
-import { t as fr } from "./ImageUpload-DZTm4SBB.js";
-import { LineChart as sr } from "./components/LineChart/LineChart.js";
-import { t as dr } from "./Modal-Bfzggwlr.js";
-import { t as gr } from "./components-BIHlj4yH.js";
-import { PhoneNumberInput as cr } from "./components/PhoneNumberInput/PhoneNumberInput.js";
-import { PieChart as Dr } from "./components/PieChart/PieChart.js";
-import { ProgressBar as Vr } from "./components/ProgressBar/ProgressBar.js";
+import { useClickOutside as R } from "./hooks/useClickOutside.js";
+import { useMediaQuery as b } from "./hooks/useMediaQuery.js";
+import { useToggle as w } from "./hooks/useToggle.js";
+import { Autocomplete as x } from "./components/Autocomplete/Autocomplete.js";
+import { t as E } from "./Loading-DUh9PMJN.js";
+import { Badge as P } from "./components/Badge/Badge.js";
+import { Typography as I } from "./components/Typography/Typography.js";
+import { ButtonGroup as k } from "./components/ButtonGroup/ButtonGroup.js";
+import { Card as A } from "./components/Card/Card.js";
+import { DatePicker as y } from "./components/Datepicker/DatePicker.js";
+import { Radio as O } from "./components/Radio/Radio.js";
+import { RadioGroup as U } from "./components/RadioGroup/RadioGroup.js";
+import { TimePicker as j } from "./components/TimePicker/TimePicker.js";
+import { DateRangePicker as H } from "./components/DateRangePicker/DateRangePicker.js";
+import { Divider as K } from "./components/Divider/Divider.js";
+import { Drawer as Y } from "./components/Drawer/Drawer.js";
+import { BadgeMultiSelect as _ } from "./components/Filter/components/BadgeDropdown/BadgeMultiSelect.js";
+import { DateFilterDropdown as rr } from "./components/Filter/components/DateFilterDropdown/DateFilterDropdown.js";
+import { DateRangeFilterDropdown as tr } from "./components/Filter/components/DateRangeFilterDropdown/DateRangeFilterDropdown.js";
+import { TextMultiSelect as ir } from "./components/Filter/components/TextMultiSelect/TextMultiSelect.js";
+import { TimeFilterDropdown as pr } from "./components/Filter/components/TimeFilterDropdown/TimeFilterDropdown.js";
+import { Filter as fr } from "./components/Filter/Filter.js";
+import { t as sr } from "./ImageUpload-DiwymQcU.js";
+import { LineChart as dr } from "./components/LineChart/LineChart.js";
+import { t as gr } from "./Modal-Dyn088X7.js";
+import { t as cr } from "./components-Cf345jTv.js";
+import { PhoneNumberInput as Dr } from "./components/PhoneNumberInput/PhoneNumberInput.js";
+import { PieChart as Rr } from "./components/PieChart/PieChart.js";
+import { ProgressBar as br } from "./components/ProgressBar/ProgressBar.js";
 import { RadioCard as wr } from "./components/RadioCard/RadioCard.js";
-import { RadioCardGroup as Sr } from "./components/RadioCardGroup/RadioCardGroup.js";
-import { Range as xr } from "./components/Range/Range.js";
-import { Select as Lr } from "./components/Select/Select.js";
-import { Footer as Er } from "./components/Sidebar/components/Footer/Footer.js";
-import { Label as Ir } from "./components/Sidebar/components/Label/Label.js";
-import { Logo as Mr } from "./components/Sidebar/components/Logo/Logo.js";
-import { NavigationGroup as Ar } from "./components/Sidebar/components/NavigationGroup/NavigationGroup.js";
-import { NavigationOption as yr } from "./components/Sidebar/components/NavigationOption/NavigationOption.js";
-import { NavigationSeparator as Or } from "./components/Sidebar/components/NavigationSeparator/NavigationSeparator.js";
-import { Navigation as Ur } from "./components/Sidebar/components/Navigation/Navigation.js";
-import { Sidebar as jr } from "./components/Sidebar/Sidebar.js";
-import { Slider as Hr } from "./components/Slider/Slider.js";
-import { t as Kr } from "./Spinner-Lw9mZYhg.js";
-import { horizontalConnectorWrapperVariants as Yr, stepConnectorVariants as Zr, stepContentVariants as _r, stepDescriptionVariants as $r, stepIndicatorVariants as ro, stepItemVariants as oo, stepLabelVariants as to, stepListVariants as mo, stepVariants as io, stepperVariants as eo } from "./components/Stepper/Stepper.variants.js";
-import { Stepper as ao } from "./components/Stepper/Stepper.js";
-import { t as no } from "./Switch-WBRr8uOJ.js";
-import { Table as lo } from "./components/Table/Table.js";
-import { Content as go } from "./components/Tabs/components/Content.js";
-import { List as co } from "./components/Tabs/components/List.js";
-import { Trigger as Do } from "./components/Tabs/components/Trigger.js";
-import { Tabs as Vo } from "./components/Tabs/Tabs.js";
-import { Tag as wo } from "./components/Tag/Tag.js";
-import { TagSelect as So } from "./components/TagSelect/TagSelect.js";
-import { TextArea as xo } from "./components/TextArea/TextArea.js";
-import { t as Lo } from "./Toast-ByH-l4XK.js";
-import { Tooltip as Eo } from "./components/Tooltip/Tooltip.js";
-import { VirtualizedTableEvent as Io, sendCollapseRowEvent as No, sendExpandRowEvent as Mo, sendResetFiltersEvent as ko, sendToggleRowEvent as Ao } from "./components/VirtualizedTable/events/index.js";
-import { TruncateText as yo } from "./components/VirtualizedTable/components/TruncateText/TruncateText.js";
-import { VirtualizedTable as Oo } from "./components/VirtualizedTable/VirtualizedTable.js";
-import { ThemeContext as Uo } from "./contexts/theme.context.js";
-import { useTheme as jo } from "./contexts/theme.hook.js";
-import { t as Ho } from "./theme.provider-Dw4O3ocC.js";
+import { RadioCardGroup as xr } from "./components/RadioCardGroup/RadioCardGroup.js";
+import { Range as Er } from "./components/Range/Range.js";
+import { Select as Pr } from "./components/Select/Select.js";
+import { CollapseTrigger as Ir } from "./components/Sidebar/components/CollapseTrigger/CollapseTrigger.js";
+import { Footer as kr } from "./components/Sidebar/components/Footer/Footer.js";
+import { Label as Ar } from "./components/Sidebar/components/Label/Label.js";
+import { Logo as yr } from "./components/Sidebar/components/Logo/Logo.js";
+import { NavigationGroup as Or } from "./components/Sidebar/components/NavigationGroup/NavigationGroup.js";
+import { NavigationOption as Ur } from "./components/Sidebar/components/NavigationOption/NavigationOption.js";
+import { NavigationSeparator as jr } from "./components/Sidebar/components/NavigationSeparator/NavigationSeparator.js";
+import { Navigation as Hr } from "./components/Sidebar/components/Navigation/Navigation.js";
+import { Sidebar as Kr } from "./components/Sidebar/Sidebar.js";
+import { Slider as Yr } from "./components/Slider/Slider.js";
+import { t as _r } from "./Spinner-CUwE2bLm.js";
+import { horizontalConnectorWrapperVariants as ro, stepConnectorVariants as oo, stepContentVariants as to, stepDescriptionVariants as mo, stepIndicatorVariants as io, stepItemVariants as eo, stepLabelVariants as po, stepListVariants as ao, stepVariants as fo, stepperVariants as no } from "./components/Stepper/Stepper.variants.js";
+import { Stepper as lo } from "./components/Stepper/Stepper.js";
+import { t as go } from "./Switch-aPhL5rNG.js";
+import { Table as co } from "./components/Table/Table.js";
+import { Content as Do } from "./components/Tabs/components/Content.js";
+import { List as Ro } from "./components/Tabs/components/List.js";
+import { Trigger as bo } from "./components/Tabs/components/Trigger.js";
+import { Tabs as wo } from "./components/Tabs/Tabs.js";
+import { Tag as xo } from "./components/Tag/Tag.js";
+import { TagSelect as Eo } from "./components/TagSelect/TagSelect.js";
+import { TextArea as Po } from "./components/TextArea/TextArea.js";
+import { t as Io } from "./Toast-3NEz7LLa.js";
+import { Tooltip as ko } from "./components/Tooltip/Tooltip.js";
+import { t as Ao } from "./events.types-BG1Uh8i6.js";
+import { sendResetFiltersEvent as yo } from "./components/VirtualizedTable/events/filters/filters.js";
+import { sendRefreshEvent as Oo } from "./components/VirtualizedTable/events/refresh/refresh.js";
+import { sendCollapseRowEvent as Uo, sendExpandRowEvent as Wo, sendToggleRowEvent as jo } from "./components/VirtualizedTable/events/row/row.js";
+import { TruncateText as Ho } from "./components/VirtualizedTable/components/TruncateText/TruncateText.js";
+import { VirtualizedTable as Ko } from "./components/VirtualizedTable/VirtualizedTable.js";
+import { ThemeContext as Yo } from "./contexts/theme.context.js";
+import { useTheme as _o } from "./contexts/theme.hook.js";
+import { t as rt } from "./theme.provider-Dw4O3ocC.js";
 import "./contexts/index.js";
 export {
   g as Alert,
   D as AlertDialog,
-  V as Autocomplete,
-  S as Badge,
-  Y as BadgeMultiSelect,
+  x as Autocomplete,
+  P as Badge,
+  _ as BadgeMultiSelect,
   e as Breadcrumb,
   c as Button,
-  L as ButtonGroup,
-  E as Card,
+  k as ButtonGroup,
+  A as Card,
   o as Checkbox,
-  go as Content,
+  Ir as CollapseTrigger,
+  Do as Content,
   n as Counter,
-  _ as DateFilterDropdown,
-  A as DatePicker,
-  rr as DateRangeFilterDropdown,
-  j as DateRangePicker,
-  H as Divider,
-  K as Drawer,
-  Lr as Dropdown,
+  rr as DateFilterDropdown,
+  y as DatePicker,
+  tr as DateRangeFilterDropdown,
+  H as DateRangePicker,
+  K as Divider,
+  Y as Drawer,
+  Pr as Dropdown,
   m as DropdownButton,
-  pr as Filter,
-  Er as Footer,
-  fr as ImageUpload,
+  fr as Filter,
+  kr as Footer,
+  sr as ImageUpload,
   a as Input,
-  Ir as Label,
-  sr as LineChart,
-  co as List,
-  w as Loading,
-  Mr as Logo,
-  dr as Modal,
-  gr as MultiSelectDropdown,
-  Ur as Navigation,
-  Ar as NavigationGroup,
-  yr as NavigationOption,
-  Or as NavigationSeparator,
+  Ar as Label,
+  dr as LineChart,
+  Ro as List,
+  E as Loading,
+  yr as Logo,
+  gr as Modal,
+  cr as MultiSelectDropdown,
+  Hr as Navigation,
+  Or as NavigationGroup,
+  Ur as NavigationOption,
+  jr as NavigationSeparator,
   n as NumberInput,
-  cr as PhoneNumberInput,
-  Dr as PieChart,
-  Vr as ProgressBar,
-  y as Radio,
+  Dr as PhoneNumberInput,
+  Rr as PieChart,
+  br as ProgressBar,
+  O as Radio,
   wr as RadioCard,
-  Sr as RadioCardGroup,
-  O as RadioGroup,
-  xr as Range,
-  Lr as Select,
-  jr as Sidebar,
-  Hr as Slider,
-  Kr as Spinner,
-  ao as Stepper,
-  no as Switch,
-  lo as Table,
-  Vo as Tabs,
-  wo as Tag,
-  So as TagSelect,
-  xo as TextArea,
-  tr as TextMultiSelect,
-  Uo as ThemeContext,
-  Ho as ThemeProvider,
-  ir as TimeFilterDropdown,
-  U as TimePicker,
-  Lo as Toast,
-  Eo as Tooltip,
-  Do as Trigger,
-  yo as TruncateText,
-  x as Typography,
-  Oo as VirtualizedTable,
-  Io as VirtualizedTableEvent,
+  xr as RadioCardGroup,
+  U as RadioGroup,
+  Er as Range,
+  Pr as Select,
+  Kr as Sidebar,
+  Yr as Slider,
+  _r as Spinner,
+  lo as Stepper,
+  go as Switch,
+  co as Table,
+  wo as Tabs,
+  xo as Tag,
+  Eo as TagSelect,
+  Po as TextArea,
+  ir as TextMultiSelect,
+  Yo as ThemeContext,
+  rt as ThemeProvider,
+  pr as TimeFilterDropdown,
+  j as TimePicker,
+  Io as Toast,
+  ko as Tooltip,
+  bo as Trigger,
+  Ho as TruncateText,
+  I as Typography,
+  Ko as VirtualizedTable,
+  Ao as VirtualizedTableEvent,
   d as cn,
-  Yr as horizontalConnectorWrapperVariants,
+  ro as horizontalConnectorWrapperVariants,
   l as resolveColor,
-  No as sendCollapseRowEvent,
-  Mo as sendExpandRowEvent,
-  ko as sendResetFiltersEvent,
-  Ao as sendToggleRowEvent,
-  Zr as stepConnectorVariants,
-  _r as stepContentVariants,
-  $r as stepDescriptionVariants,
-  ro as stepIndicatorVariants,
-  oo as stepItemVariants,
-  to as stepLabelVariants,
-  mo as stepListVariants,
-  io as stepVariants,
-  eo as stepperVariants,
-  I as useMediaQuery,
-  jo as useTheme,
-  M as useToggle
+  Uo as sendCollapseRowEvent,
+  Wo as sendExpandRowEvent,
+  Oo as sendRefreshEvent,
+  yo as sendResetFiltersEvent,
+  jo as sendToggleRowEvent,
+  oo as stepConnectorVariants,
+  to as stepContentVariants,
+  mo as stepDescriptionVariants,
+  io as stepIndicatorVariants,
+  eo as stepItemVariants,
+  po as stepLabelVariants,
+  ao as stepListVariants,
+  fo as stepVariants,
+  no as stepperVariants,
+  R as useClickOutside,
+  b as useMediaQuery,
+  _o as useTheme,
+  w as useToggle
 };

package/dist/lib/components/Autocomplete/components/List/List.variants.d.ts

@@ -1,4 +1,3 @@
 export declare const listVariants: (props?: import('class-variance-authority/types').ClassProp | undefined) => string;
 export declare const emptyListVariants: (props?: import('class-variance-authority/types').ClassProp | undefined) => string;
 export declare const listItemVariants: (props?: import('class-variance-authority/types').ClassProp | undefined) => string;
-export declare const buttonVariants: (props?: import('class-variance-authority/types').ClassProp | undefined) => string;

package/dist/lib/components/DropdownButton/DropdownButton.d.ts

@@ -2,19 +2,18 @@ import { FC } from 'react';
 import { Props } from './DropdownButton.types';
 /**
  * A button with an attached dropdown menu for selecting actions.
- * Closes automatically on outside click, Escape key, or tab visibility change.
+ * Built on Radix DropdownMenu: closes on outside click or Escape, and
+ * supports full keyboard navigation.
  *
  * @example
  * ```tsx
  * <DropdownButton
+ *   label="Download Invoice as"
  *   options={[
- *     { label: 'Download PDF', onClick: handlePdf },
- *     { label: 'Download CSV', onClick: handleCsv },
+ *     { label: 'PDF', onClick: () => downloadPdf() },
+ *     { label: 'CSV', onClick: () => downloadCsv() },
  *   ]}
- *   buttonClassName="w-64"
  * />
  * ```
- *
- * @see {@link https://konstructio.github.io/konstruct-ui/?path=/docs/components-dropdownbutton--docs Storybook}
  */
 export declare const DropdownButton: FC<Props>;

package/dist/lib/components/DropdownButton/DropdownButton.types.d.ts

@@ -29,6 +29,8 @@ export type Props = {
     className?: string;
     /** Additional CSS classes for each dropdown item */
     itemClassName?: string;
+    /** Content of the trigger button */
+    label?: string | ReactNode;
     /** Additional CSS classes for the dropdown list */
     listClassName?: string;
     /** Array of options to display in the dropdown */

package/dist/lib/components/Filter/Filter.types.d.ts

@@ -49,6 +49,8 @@ export type Props = VariantProps<typeof filterVariants> & PropsWithChildren & {
     theme?: Theme;
     /** Whether to close the filter dropdown automatically when Apply is clicked. Defaults to true. */
     closeOnApply?: boolean;
+    /** Scope for reset events; dropdowns only respond to resets with the same scope. Defaults to a per-instance id. */
+    resetScope?: string;
 };
 /** @deprecated Use Props instead */
 export type FilterProps = Props;

package/dist/lib/components/Filter/contexts/filter.context.d.ts

@@ -1,5 +1,6 @@
 export type FilterContextType = {
     closeOnApply: boolean;
+    resetScope?: string;
     theme?: string;
 };
 export declare const FilterContext: import('react').Context<FilterContextType>;

package/dist/lib/components/Filter/events/index.d.ts

@@ -1,6 +1,14 @@
 export declare enum FilterEvent {
+    OPEN = "@konstructio/KonstructFilter/event-OPEN",
+    RESET = "@konstructio/KonstructFilter/event-RESET"
+}
+/** @deprecated Use FilterEvent instead */
+export declare enum LegacyFilterEvent {
     OPEN = "@konstrtuctio/KonstructFilter/event-OPEN",
     RESET = "@konstrtuctio/KonstructFilter/event-RESET"
 }
-export declare const sendOpenFilterEvent: (id: string) => boolean;
-export declare const resetEvent: () => boolean;
+export declare const sendOpenFilterEvent: (id: string) => void;
+export declare const resetEvent: (scope?: string) => void;
+export declare const addFilterEventListener: <T>(event: FilterEvent, handler: (event: CustomEvent<T>) => void, options: {
+    signal?: AbortSignal;
+}) => void;

package/dist/lib/components/Filter/hooks/index.d.ts

@@ -0,0 +1 @@
+export * from './useFilterDropdownSync';

package/dist/lib/components/Filter/hooks/useFilterDropdownSync.d.ts

@@ -0,0 +1,2 @@
+import { Props } from './useFilterDropdownSync.types';
+export declare const useFilterDropdownSync: ({ id, onClose, onReset }: Props) => void;

package/dist/lib/components/Filter/hooks/useFilterDropdownSync.types.d.ts

@@ -0,0 +1,5 @@
+export type Props = {
+    id: string;
+    onClose: () => void;
+    onReset: () => void;
+};

package/dist/lib/components/PieChart/PieChart.types.d.ts

@@ -18,7 +18,7 @@ type CSSColor = `var(--${string})` | `rgb(${number}, ${number}, ${number})` | `r
 export type Props = {
     /**
      * Array of hexadecimal colors for the borders of the pie chart segments
-     * @default ['#FFFFFF', '#FFFFFF']
+     * @default [resolveColor('--color-white'), resolveColor('--color-white')]
      */
     borderColors?: HexColor[] | CSSColor[] | (HexColor | CSSColor)[];
     /**
@@ -28,7 +28,7 @@ export type Props = {
     borderWidth?: number;
     /**
      * Array of hexadecimal colors for filling the pie chart segments
-     * @default ['#525252', '#00D492']
+     * @default [resolveColor('--color-neutral-600'), resolveColor('--color-emerald-400')]
      */
     colors?: HexColor[] | CSSColor[] | (HexColor | CSSColor)[];
     /**
@@ -43,7 +43,7 @@ export type Props = {
     redraw?: boolean;
     /**
      * Hexadecimal color for the subtitle text
-     * @default '#6B7280'
+     * @default resolveColor('--color-gray-500')
      */
     subtitleColor?: HexColor;
     /**
@@ -58,7 +58,7 @@ export type Props = {
     subtitleFontWeight?: 'bold' | 'normal';
     /**
      * Hexadecimal color for the title text
-     * @default '#111827'
+     * @default resolveColor('--color-gray-900')
      */
     titleColor?: HexColor;
     /**

package/dist/lib/components/ProgressBar/ProgressBar.types.d.ts

@@ -3,6 +3,8 @@ import { VariantProps } from 'class-variance-authority';
 import { Theme } from '../../domain/theme';
 import { progressBarFillVariants } from './ProgressBar.variants';
 export interface Props extends VariantProps<typeof progressBarFillVariants> {
+    /** Accessible name announced for the progress bar */
+    ariaLabel?: string;
     /** Additional CSS classes for the outer wrapper */
     className?: string;
     /** Custom CSS class for the progress bar fill (e.g., "bg-purple-500") */

package/dist/lib/components/Select/hooks/useSelect.d.ts

@@ -1,13 +1,12 @@
 import { ComponentRef, RefObject } from 'react';
 import { SelectProps, Option } from '../Select.types';
 type UseSelectParams = {
-    ulRef: RefObject<ComponentRef<'ul'> | null>;
     inputRef?: RefObject<ComponentRef<'input'> | null>;
-    disabled: boolean;
+    searchInputRef?: RefObject<ComponentRef<'input'> | null>;
     internalValue?: Option;
     onBlur?: SelectProps['onBlur'];
 };
-export declare const useSelect: ({ ulRef, inputRef, disabled, internalValue, onBlur, }: UseSelectParams) => {
+export declare const useSelect: ({ inputRef, searchInputRef, internalValue, onBlur, }: UseSelectParams) => {
     wrapperRef: RefObject<HTMLDivElement | null>;
     wrapperInputRef: RefObject<HTMLDivElement | null>;
     handleOpen: () => void;

package/dist/lib/components/Sidebar/Sidebar.d.ts

@@ -1,5 +1,5 @@
 import { FC } from 'react';
-import { Footer, Label, Logo, Navigation, NavigationGroup, NavigationOption, NavigationSeparator } from './components';
+import { CollapseTrigger, Footer, Label, Logo, Navigation, NavigationGroup, NavigationOption, NavigationSeparator } from './components';
 import { SidebarChildrenProps, Props as SidebarProps } from './Sidebar.types';
 /**
  * A compound component for building application sidebars.
@@ -25,4 +25,4 @@ import { SidebarChildrenProps, Props as SidebarProps } from './Sidebar.types';
  * @see {@link https://konstructio.github.io/konstruct-ui/?path=/docs/components-sidebar--docs Storybook}
  */
 declare const Sidebar: FC<SidebarProps> & SidebarChildrenProps;
-export { Footer, Label, Logo, Navigation, NavigationGroup, NavigationOption, NavigationSeparator, Sidebar, };
+export { CollapseTrigger, Footer, Label, Logo, Navigation, NavigationGroup, NavigationOption, NavigationSeparator, Sidebar, };

package/dist/lib/components/Sidebar/Sidebar.types.d.ts

@@ -4,7 +4,7 @@ import { ClassNames as DrawerClassNames } from '../Drawer/Drawer.types';
 import { Theme } from '../../domain/theme';
 import { SidebarModeProp } from './hooks/useSidebarMode';
 import { wrapperSiderbarVariants } from './Sidebar.variants';
-import { FooterProps, LabelProps, LogoProps, NavigationGroupProps, NavigationOptionProps, NavigationProps, NavigationSeparatorProps } from './components';
+import { CollapseTriggerProps, FooterProps, LabelProps, LogoProps, NavigationGroupProps, NavigationOptionProps, NavigationProps, NavigationSeparatorProps } from './components';
 /**
  * Props for the Sidebar component.
  * A compound component for building application sidebars with navigation.
@@ -77,7 +77,7 @@ export interface Props extends Omit<VariantProps<typeof wrapperSiderbarVariants>
      * the panel's horizontal padding so dividers can span edge-to-edge,
      * raising the root `z-index` past higher-z layers, etc.
      *
-     * The Sidebar already applies sensible defaults internally (root `z-[60]`,
+     * The Sidebar already applies sensible defaults internally (root `z-60`,
      * panel uses `wrapperClassName`, content `gap-0`); user-provided classes
      * are appended via `cn`, so they win on conflicts.
      */
@@ -107,9 +107,9 @@ export interface Props extends Omit<VariantProps<typeof wrapperSiderbarVariants>
      * Inline styles applied to the wrapper `<aside>` (or the drawer panel in
      * drawer mode). Useful for setting CSS custom properties that drive
      * theming via the protection stylesheet (e.g.
-     * `--konstruct-sidebar-hover-bg`, `--konstruct-sidebar-active-bg`),
-     * since inline styles outrank un-layered utilities shipped by federated
-     * remote micro-frontends.
+     * `--konstruct-sidebar-logo-padding-expanded`), since inline styles
+     * outrank un-layered utilities shipped by federated remote
+     * micro-frontends.
      */
     style?: CSSProperties;
 }
@@ -119,6 +119,7 @@ export type SidebarProps = Props;
  * Sidebar compound component type with sub-components.
  */
 export type SidebarChildrenProps = {
+    CollapseTrigger: FC<CollapseTriggerProps>;
     Footer: FC<FooterProps>;
     Label: FC<LabelProps>;
     Logo: FC<LogoProps>;

package/dist/lib/components/Sidebar/components/CollapseTrigger/CollapseTrigger.d.ts

@@ -0,0 +1,4 @@
+import { FC } from 'react';
+import { Props } from './CollapseTrigger.types';
+declare const CollapseTrigger: FC<Props>;
+export { CollapseTrigger };

package/dist/lib/components/Sidebar/components/CollapseTrigger/CollapseTrigger.types.d.ts

@@ -0,0 +1,4 @@
+export interface Props {
+    className?: string;
+}
+export type CollapseTriggerProps = Props;

package/dist/lib/components/Sidebar/components/CollapseTrigger/CollapseTrigger.variants.d.ts

@@ -0,0 +1 @@
+export declare const collapseTriggerVariants: (props?: import('class-variance-authority/types').ClassProp | undefined) => string;

package/dist/lib/components/Sidebar/components/Logo/Logo.types.d.ts

@@ -3,6 +3,14 @@ import { PropsWithChildren } from 'react';
 import { logoVariants } from './Logo.variants';
 export interface Props extends PropsWithChildren, VariantProps<typeof logoVariants> {
     className?: string;
+    /**
+     * When true, keeps the logo content visible while the sidebar is in
+     * `collapsed` mode. By default the logo content hides in collapsed mode,
+     * while a `Sidebar.CollapseTrigger` placed as a direct child of
+     * `Sidebar.Logo` stays visible so the user can still expand the sidebar.
+     * Defaults to `false`.
+     */
+    showOnCollapse?: boolean;
 }
 /** @deprecated Use Props instead */
 export type LogoProps = Props;

package/dist/lib/components/Sidebar/components/Logo/Logo.variants.d.ts

@@ -1 +1,3 @@
-export declare const logoVariants: (props?: import('class-variance-authority/types').ClassProp | undefined) => string;
+export declare const logoVariants: (props?: ({
+    showOnCollapse?: boolean | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;

package/dist/lib/components/Sidebar/components/index.d.ts

@@ -1,3 +1,5 @@
+export * from './CollapseTrigger/CollapseTrigger';
+export type { CollapseTriggerProps } from './CollapseTrigger/CollapseTrigger.types';
 export * from './Footer/Footer';
 export type { FooterProps } from './Footer/Footer.types';
 export * from './HamburgerTrigger/HamburgerTrigger';

package/dist/lib/components/Sidebar/contexts/SidebarContext.d.ts

@@ -11,6 +11,18 @@ export interface SidebarContextValue {
      * navigation events (e.g. when the user clicks a link).
      */
     closeDrawer: () => void;
+    /**
+     * Whether the sidebar can be toggled between `expanded` and `collapsed`.
+     * `false` in `drawer` mode, where the drawer's own open/close controls
+     * apply instead.
+     */
+    canToggle: boolean;
+    /**
+     * Toggles the sidebar between `expanded` and `collapsed`, overriding the
+     * viewport-derived mode until the viewport crosses a breakpoint. No-op in
+     * `drawer` mode.
+     */
+    toggleMode: () => void;
 }
 export declare const SidebarContext: import('react').Context<SidebarContextValue>;
 export declare const useSidebarContext: () => SidebarContextValue;