@worldresources/wri-design-systems 2.208.2 → 2.209.0

package/dist/index.d.ts

@@ -132,6 +132,8 @@ type ComboboxLabels = {
     toggleOptionsLabel: string;
     /** Visible text shown when no results match. Rendered as JSX child. Default: "No items found" */
     noItemsFoundLabel: ReactNodeLabel;
+    /** Builds the visible text for the create-new-option row. Default: (inputValue) => `Create “${inputValue}”` */
+    createOptionLabel: (inputValue: string) => ReactNodeLabel;
 };
 /** Labels for CloseButton internal UI strings. */
 type CloseButtonLabels = {
@@ -1230,11 +1232,12 @@ type TextInputProps = Omit<InputProps, 'size' | 'variant' | 'colorPalette' | 'de
 
 declare const TextInput: ({ label, caption, placeholder, errorMessage, required, disabled, size, showOptionalLabel, noMarginBottom, defaultValue, onChange, onFocus, onBlur, labels, value: controlledValue, ...rest }: TextInputProps) => _emotion_react_jsx_runtime.JSX.Element;
 
+type ComboboxItem = {
+    label: string;
+    value: string;
+};
 type ComboboxProps = {
-    initialItems?: {
-        label: string;
-        value: string;
-    }[];
+    initialItems?: ComboboxItem[];
     label?: string;
     required?: boolean;
     caption?: string;
@@ -1247,9 +1250,25 @@ type ComboboxProps = {
     noMarginBottom?: boolean;
     multiple?: boolean;
     showSelectedItems?: boolean;
+    /**
+     * Controlled selected values. When provided, the component is fully
+     * controlled — pair with `onChange`.
+     */
+    value?: string[];
+    /** Initial selected values for uncontrolled usage. */
+    defaultValue?: string[];
+    /** Called with the selected values whenever the selection changes. */
+    onChange?: (values: string[]) => void;
+    /**
+     * Whether the user can create options that do not exist in `initialItems`.
+     * When `true`, typing a non-matching value shows a "Create …" row that adds
+     * the entry to the list on selection.
+     * @default false
+     */
+    creatable?: boolean;
 };
 
-declare const Combobox: ({ label, required, caption, errorMessage, size, disabled, showOptionalLabel, placeholder, labels, noMarginBottom, initialItems, multiple, showSelectedItems, }: ComboboxProps) => _emotion_react_jsx_runtime.JSX.Element;
+declare const Combobox: ({ label, required, caption, errorMessage, size, disabled, showOptionalLabel, placeholder, labels, noMarginBottom, initialItems, multiple, showSelectedItems, value: controlledValue, defaultValue, onChange, creatable, }: ComboboxProps) => _emotion_react_jsx_runtime.JSX.Element;
 
 type TagProps = Omit<Tag$1.RootProps, 'size' | 'variant' | 'colorPalette' | 'children'> & {
     label: string;