@xsolla/xui-status-dropdown 0.148.0-pr266.1777536173

package/README.md

@@ -0,0 +1,24 @@
+# @xsolla/xui-status-dropdown
+
+An interactive status tag component that opens a context menu to change the status.
+
+## Installation
+
+```bash
+yarn add @xsolla/xui-status-dropdown
+```
+
+## Usage
+
+```tsx
+import { StatusDropdown } from '@xsolla/xui-status-dropdown';
+
+<StatusDropdown
+  palette="success"
+  label="Success"
+  onStatusChange={(newStatus) => console.log(newStatus)}
+>
+  <ContextMenuItem label="Success" value="success" />
+  <ContextMenuItem label="Warning" value="warning" />
+</StatusDropdown>
+```

package/native/index.d.mts

@@ -0,0 +1,35 @@
+import React, { ReactNode } from 'react';
+import { ThemeOverrideProps } from '@xsolla/xui-core';
+
+type StatusDropdownPalette = "Neutral" | "Success" | "Warning" | "Alert" | "Brand";
+interface StatusDropdownProps extends ThemeOverrideProps {
+    /** The current status label to display */
+    label: string;
+    /** Color palette for the status indicator */
+    palette?: StatusDropdownPalette;
+    /** Whether to show the status dot */
+    dot?: boolean;
+    /** Dropdown menu content (usually ContextMenuItem components) */
+    children: ReactNode;
+    /** Callback when a menu item is selected. Value comes from child ContextMenuItem. */
+    onSelect?: (value: any) => void;
+    /** Whether the dropdown is open (controlled) */
+    isOpen?: boolean;
+    /** Callback when the open state changes */
+    onOpenChange?: (isOpen: boolean) => void;
+    /** Accessible label for the dropdown trigger. If not provided, one is generated from label. */
+    "aria-label"?: string;
+    /** Test ID for testing frameworks */
+    testID?: string;
+    /** HTML id attribute */
+    id?: string;
+}
+
+/**
+ * StatusDropdown - A compact interactive status tag
+ *
+ * Displays current status and allows changing it via a context menu.
+ */
+declare const StatusDropdown: React.ForwardRefExoticComponent<StatusDropdownProps & React.RefAttributes<any>>;
+
+export { StatusDropdown, type StatusDropdownPalette, type StatusDropdownProps };

package/native/index.d.ts

@@ -0,0 +1,35 @@
+import React, { ReactNode } from 'react';
+import { ThemeOverrideProps } from '@xsolla/xui-core';
+
+type StatusDropdownPalette = "Neutral" | "Success" | "Warning" | "Alert" | "Brand";
+interface StatusDropdownProps extends ThemeOverrideProps {
+    /** The current status label to display */
+    label: string;
+    /** Color palette for the status indicator */
+    palette?: StatusDropdownPalette;
+    /** Whether to show the status dot */
+    dot?: boolean;
+    /** Dropdown menu content (usually ContextMenuItem components) */
+    children: ReactNode;
+    /** Callback when a menu item is selected. Value comes from child ContextMenuItem. */
+    onSelect?: (value: any) => void;
+    /** Whether the dropdown is open (controlled) */
+    isOpen?: boolean;
+    /** Callback when the open state changes */
+    onOpenChange?: (isOpen: boolean) => void;
+    /** Accessible label for the dropdown trigger. If not provided, one is generated from label. */
+    "aria-label"?: string;
+    /** Test ID for testing frameworks */
+    testID?: string;
+    /** HTML id attribute */
+    id?: string;
+}
+
+/**
+ * StatusDropdown - A compact interactive status tag
+ *
+ * Displays current status and allows changing it via a context menu.
+ */
+declare const StatusDropdown: React.ForwardRefExoticComponent<StatusDropdownProps & React.RefAttributes<any>>;
+
+export { StatusDropdown, type StatusDropdownPalette, type StatusDropdownProps };