@matthiaskrijgsman/mat-ui 0.0.50 → 0.0.52
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/inputs/InputSelectDrilldown.d.ts +40 -0
- package/dist/components/inputs/SelectTrigger.d.ts +43 -0
- package/dist/index.d.ts +2 -0
- package/dist/index.js +3263 -2407
- package/dist/index.js.map +1 -1
- package/dist/style.css +4325 -1
- package/package.json +1 -1
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import type { ControlSize } from "@/control-size/control-size.util.ts";
|
|
3
|
+
export type SelectDrilldownApi = {
|
|
4
|
+
/** Dismisses the popover — call after committing a leaf selection. */
|
|
5
|
+
close: () => void;
|
|
6
|
+
};
|
|
7
|
+
export type InputSelectDrilldownProps = {
|
|
8
|
+
id?: string;
|
|
9
|
+
className?: string;
|
|
10
|
+
label?: string | React.ReactNode;
|
|
11
|
+
description?: string | React.ReactNode;
|
|
12
|
+
error?: string | React.ReactNode;
|
|
13
|
+
size?: ControlSize;
|
|
14
|
+
disabled?: boolean;
|
|
15
|
+
clearable?: boolean;
|
|
16
|
+
placeholder?: string | React.ReactNode;
|
|
17
|
+
/** Whether a value is selected — drives the clear button + trigger padding. */
|
|
18
|
+
hasValue?: boolean;
|
|
19
|
+
/** Rendered inside the trigger for the current selection. */
|
|
20
|
+
valueLabel?: React.ReactNode;
|
|
21
|
+
onClear?: () => void;
|
|
22
|
+
minWidth?: number;
|
|
23
|
+
maxWidth?: number;
|
|
24
|
+
maxHeight?: number;
|
|
25
|
+
/**
|
|
26
|
+
* Root-level menu content. Rendered inside the drilldown navigator, so it (and
|
|
27
|
+
* anything it drills into via {@link DropdownDrilldown}) slides between levels.
|
|
28
|
+
* Pass a function to receive `{ close }` for dismissing after a leaf pick.
|
|
29
|
+
*/
|
|
30
|
+
children: React.ReactNode | ((api: SelectDrilldownApi) => React.ReactNode);
|
|
31
|
+
};
|
|
32
|
+
/**
|
|
33
|
+
* A single-select control whose menu is a sliding drilldown rather than a flat
|
|
34
|
+
* option list — for hierarchies too large or too lazy to flatten up front. It
|
|
35
|
+
* owns the (shared) {@link SelectTrigger}, popover, and {@link DropdownNavigator};
|
|
36
|
+
* the consumer supplies the level content and uses {@link DropdownDrilldown} for
|
|
37
|
+
* rows that descend a level. The current value is opaque to this component — pass
|
|
38
|
+
* `valueLabel` for the trigger and `hasValue`/`onClear` for clearing.
|
|
39
|
+
*/
|
|
40
|
+
export declare const InputSelectDrilldown: (props: InputSelectDrilldownProps) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import type { ControlSize } from "@/control-size/control-size.util.ts";
|
|
3
|
+
export type SelectTriggerProps = {
|
|
4
|
+
/** Overrides the size from `ControlSizeContext` when set. */
|
|
5
|
+
size?: ControlSize;
|
|
6
|
+
open?: boolean;
|
|
7
|
+
disabled?: boolean;
|
|
8
|
+
error?: boolean;
|
|
9
|
+
clearable?: boolean;
|
|
10
|
+
/** Whether a value is selected — drives the clear button and right padding. */
|
|
11
|
+
hasValue?: boolean;
|
|
12
|
+
/** Rendered when a value is selected. */
|
|
13
|
+
selectedLabel?: React.ReactNode;
|
|
14
|
+
placeholder?: React.ReactNode;
|
|
15
|
+
onClear?: () => void;
|
|
16
|
+
showChevron?: boolean;
|
|
17
|
+
className?: string;
|
|
18
|
+
} & Omit<React.HTMLAttributes<HTMLDivElement>, 'className'>;
|
|
19
|
+
/**
|
|
20
|
+
* The shared trigger surface for the select family (`InputSelect`,
|
|
21
|
+
* `InputSelectSearchable`, `InputSelectDrilldown`): the bordered control box that
|
|
22
|
+
* shows the current selection (or placeholder) plus the icon-button tray (error
|
|
23
|
+
* icon, optional clear, chevron). Extracted so every select-like control shares
|
|
24
|
+
* exactly the same sizing and styling. Interaction props (role, tabIndex,
|
|
25
|
+
* onClick, onKeyDown, floating-ui reference props) are spread onto the box, and
|
|
26
|
+
* the forwarded ref lands on it.
|
|
27
|
+
*/
|
|
28
|
+
export declare const SelectTrigger: React.ForwardRefExoticComponent<{
|
|
29
|
+
/** Overrides the size from `ControlSizeContext` when set. */
|
|
30
|
+
size?: ControlSize;
|
|
31
|
+
open?: boolean;
|
|
32
|
+
disabled?: boolean;
|
|
33
|
+
error?: boolean;
|
|
34
|
+
clearable?: boolean;
|
|
35
|
+
/** Whether a value is selected — drives the clear button and right padding. */
|
|
36
|
+
hasValue?: boolean;
|
|
37
|
+
/** Rendered when a value is selected. */
|
|
38
|
+
selectedLabel?: React.ReactNode;
|
|
39
|
+
placeholder?: React.ReactNode;
|
|
40
|
+
onClear?: () => void;
|
|
41
|
+
showChevron?: boolean;
|
|
42
|
+
className?: string;
|
|
43
|
+
} & Omit<React.HTMLAttributes<HTMLDivElement>, "className"> & React.RefAttributes<HTMLDivElement>>;
|
package/dist/index.d.ts
CHANGED
|
@@ -34,6 +34,8 @@ export { lexicalTheme, LEXICAL_NODES } from "./components/inputs/input-lexical/l
|
|
|
34
34
|
export { InputSelectNative } from "./components/inputs/InputSelectNative.tsx";
|
|
35
35
|
export { InputSelect } from "./components/inputs/InputSelect.tsx";
|
|
36
36
|
export { InputSelectSearchable } from "./components/inputs/InputSelectSearchable.tsx";
|
|
37
|
+
export { InputSelectDrilldown } from "./components/inputs/InputSelectDrilldown.tsx";
|
|
38
|
+
export { SelectTrigger } from "./components/inputs/SelectTrigger.tsx";
|
|
37
39
|
export { InputSelectSearchableAsync } from "./components/inputs/InputSelectSearchableAsync.tsx";
|
|
38
40
|
export { InputSelectMultiple } from "./components/inputs/InputSelectMultiple.tsx";
|
|
39
41
|
export { InputSelectOption } from "./components/inputs/InputSelectOption.tsx";
|