@xsolla/xui-multi-select 0.112.0 → 0.113.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xsolla/xui-multi-select",
-  "version": "0.112.0",
+  "version": "0.113.0",
   "main": "./web/index.js",
   "module": "./web/index.mjs",
   "types": "./web/index.d.ts",
@@ -10,10 +10,10 @@
     "build:native": "PLATFORM=native tsup"
   },
   "dependencies": {
-    "@xsolla/xui-checkbox": "0.112.0",
-    "@xsolla/xui-core": "0.112.0",
-    "@xsolla/xui-dropdown": "0.112.0",
-    "@xsolla/xui-primitives-core": "0.112.0"
+    "@xsolla/xui-checkbox": "0.113.0",
+    "@xsolla/xui-core": "0.113.0",
+    "@xsolla/xui-dropdown": "0.113.0",
+    "@xsolla/xui-primitives-core": "0.113.0"
   },
   "peerDependencies": {
     "react": ">=16.8.0",

package/web/index.d.ts

@@ -0,0 +1,89 @@
+import * as react from 'react';
+import { ReactNode } from 'react';
+
+type MultiSelectValue = (string | number)[];
+type MultiSelectVariant = "tag" | "text";
+type MultiSelectSize = "xs" | "sm" | "md" | "lg" | "xl";
+type MultiSelectState = "default" | "hover" | "focus" | "disable" | "error";
+interface MultiSelectOption {
+    label: ReactNode;
+    value: string | number;
+    disabled?: boolean;
+}
+interface MultiSelectProps {
+    /**
+     * Property to define options for the multi-select.
+     */
+    options: MultiSelectOption[];
+    /**
+     * Property for specifying the placeholder of the control.
+     * @default "Select"
+     */
+    placeholder?: string;
+    /**
+     * Property for specifying the value of the control.
+     */
+    value?: MultiSelectValue;
+    /**
+     * Function that will be called when the value changes.
+     */
+    onChange?: (values: MultiSelectValue) => void;
+    /**
+     * Property for displaying an error message and highlighting the control as invalid.
+     */
+    errorMessage?: string;
+    /**
+     * Property for changing the size of the control.
+     * @default "md"
+     */
+    size?: MultiSelectSize;
+    /**
+     * Property for changing the state of the control.
+     */
+    state?: MultiSelectState;
+    /**
+     * Label text displayed above the control.
+     */
+    label?: string;
+    /**
+     * Icon displayed on the left side of the control.
+     */
+    iconLeft?: ReactNode;
+    /**
+     * Icon displayed on the right side of the control (overrides default caret).
+     */
+    iconRight?: ReactNode;
+    /**
+     * Property to disable the control.
+     */
+    disabled?: boolean;
+    /**
+     * Display type of selected options (as Tag component or as plain text with comma-separated list).
+     * @default "tag"
+     */
+    variant?: MultiSelectVariant;
+    /**
+     * Makes the height fixed (if false) or dependent on the content inside (if true).
+     * @default true
+     */
+    flexible?: boolean;
+    /**
+     * Switch on displaying a remove button in each tag.
+     * @default true
+     */
+    removeTagsButtons?: boolean;
+    /**
+     * Add clear all button.
+     * @default false
+     */
+    extraClear?: boolean;
+    /**
+     * Maximum height of the dropdown menu.
+     * @default 300
+     */
+    maxHeight?: number;
+}
+
+declare const MultiSelect: react.ForwardRefExoticComponent<MultiSelectProps & react.RefAttributes<HTMLDivElement>>;
+
+export { MultiSelect, type MultiSelectOption, type MultiSelectProps, type MultiSelectSize, type MultiSelectState, type MultiSelectValue, type MultiSelectVariant };

package/web/index.js

@@ -224,6 +224,7 @@ var Text = ({
   className,
   id,
   role,
+  numberOfLines: _numberOfLines,
   ...props
 }) => {
   return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
@@ -1008,6 +1009,7 @@ var Text2 = ({
   className,
   id,
   role,
+  numberOfLines: _numberOfLines,
   ...props
 }) => {
   return /* @__PURE__ */ (0, import_jsx_runtime394.jsx)(

package/web/index.js.flow

@@ -0,0 +1,124 @@
+/**
+ * Flowtype definitions for index
+ * Generated by Flowgen from a Typescript Definition
+ * Flowgen v1.21.0
+ * @flow
+ */
+
+import * as react from "react";
+import { Node } from "react";
+declare type MultiSelectValue = (string | number)[];
+declare type MultiSelectVariant = "tag" | "text";
+declare type MultiSelectSize = "xs" | "sm" | "md" | "lg" | "xl";
+declare type MultiSelectState =
+  | "default"
+  | "hover"
+  | "focus"
+  | "disable"
+  | "error";
+declare interface MultiSelectOption {
+  label: Node;
+  value: string | number;
+  disabled?: boolean;
+}
+declare interface MultiSelectProps {
+  /**
+   * Property to define options for the multi-select.
+   */
+  options: MultiSelectOption[];
+
+  /**
+   * Property for specifying the placeholder of the control.
+   * @default "Select"
+   */
+  placeholder?: string;
+
+  /**
+   * Property for specifying the value of the control.
+   */
+  value?: MultiSelectValue;
+
+  /**
+   * Function that will be called when the value changes.
+   */
+  onChange?: (values: MultiSelectValue) => void;
+
+  /**
+   * Property for displaying an error message and highlighting the control as invalid.
+   */
+  errorMessage?: string;
+
+  /**
+   * Property for changing the size of the control.
+   * @default "md"
+   */
+  size?: MultiSelectSize;
+
+  /**
+   * Property for changing the state of the control.
+   */
+  state?: MultiSelectState;
+
+  /**
+   * Label text displayed above the control.
+   */
+  label?: string;
+
+  /**
+   * Icon displayed on the left side of the control.
+   */
+  iconLeft?: Node;
+
+  /**
+   * Icon displayed on the right side of the control (overrides default caret).
+   */
+  iconRight?: Node;
+
+  /**
+   * Property to disable the control.
+   */
+  disabled?: boolean;
+
+  /**
+   * Display type of selected options (as Tag component or as plain text with comma-separated list).
+   * @default "tag"
+   */
+  variant?: MultiSelectVariant;
+
+  /**
+   * Makes the height fixed (if false) or dependent on the content inside (if true).
+   * @default true
+   */
+  flexible?: boolean;
+
+  /**
+   * Switch on displaying a remove button in each tag.
+   * @default true
+   */
+  removeTagsButtons?: boolean;
+
+  /**
+   * Add clear all button.
+   * @default false
+   */
+  extraClear?: boolean;
+
+  /**
+   * Maximum height of the dropdown menu.
+   * @default 300
+   */
+  maxHeight?: number;
+}
+declare var MultiSelect: react.ForwardRefExoticComponent<{
+  ...MultiSelectProps,
+  ...react.RefAttributes<HTMLDivElement>,
+}>;
+export type {
+  MultiSelectOption,
+  MultiSelectProps,
+  MultiSelectSize,
+  MultiSelectState,
+  MultiSelectValue,
+  MultiSelectVariant,
+};
+declare export { MultiSelect };