@xsolla/xui-b2b-sidebar 0.147.1

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.
Files changed (13) hide show
  1. package/native/index.d.mts +188 -0
  2. package/native/index.d.ts +188 -0
  3. package/native/index.js +1748 -0
  4. package/native/index.js.map +1 -0
  5. package/native/index.mjs +1715 -0
  6. package/native/index.mjs.map +1 -0
  7. package/package.json +61 -0
  8. package/web/index.d.mts +188 -0
  9. package/web/index.d.ts +188 -0
  10. package/web/index.js +1820 -0
  11. package/web/index.js.map +1 -0
  12. package/web/index.mjs +1783 -0
  13. package/web/index.mjs.map +1 -0
package/native/index.d.mts ADDED
@@ -0,0 +1,188 @@
1
+ import React, { MouseEvent, ReactNode } from 'react';
2
+
3
+ type SidebarLinkClickHandler = (event?: MouseEvent<HTMLElement>) => void;
4
+ type SidebarLinkActiveCheck = (match: unknown, location: {
5
+ pathname: string;
6
+ search?: string;
7
+ hash?: string;
8
+ }) => boolean;
9
+ interface SidebarLinkProps {
10
+ to?: string;
11
+ exact?: boolean;
12
+ external?: boolean;
13
+ target?: string | null;
14
+ className?: string;
15
+ activeClassName?: string;
16
+ isActive?: SidebarLinkActiveCheck;
17
+ onClick?: SidebarLinkClickHandler;
18
+ dataId?: string;
19
+ children: ReactNode;
20
+ }
21
+ interface SidebarContextValue {
22
+ collapsed: boolean;
23
+ onCollapsedChange: (collapsed: boolean) => void;
24
+ pathname: string;
25
+ LinkComponent: React.ComponentType<SidebarLinkProps>;
26
+ expandedId: string | null;
27
+ onExpandedIdChange: (id: string | null) => void;
28
+ }
29
+ interface SidebarProviderProps {
30
+ collapsed?: boolean;
31
+ onCollapsedChange?: (collapsed: boolean) => void;
32
+ pathname?: string;
33
+ linkComponent?: React.ComponentType<SidebarLinkProps>;
34
+ children: ReactNode;
35
+ }
36
+ declare const SidebarProvider: React.FC<SidebarProviderProps>;
37
+ declare const useSidebar: () => SidebarContextValue;
38
+
39
+ /**
40
+ * SidebarItemType — Config object for data-driven patterns (collapsed mode, dynamic lists).
41
+ * For the composable API, use SidebarMenuItem/SidebarMenuCollapsible props directly.
42
+ */
43
+ type SidebarItemType = {
44
+ to?: string;
45
+ label: ReactNode;
46
+ privileges?: Array<string>;
47
+ dataId?: string;
48
+ icon?: ReactNode;
49
+ reverse?: boolean;
50
+ target?: string | null;
51
+ exact?: boolean;
52
+ external?: boolean;
53
+ hasExternalIcon?: boolean;
54
+ onClick?: SidebarLinkClickHandler;
55
+ extra?: ReactNode;
56
+ hasTooltip?: boolean;
57
+ beta?: boolean;
58
+ multiLine?: boolean;
59
+ children?: Array<SidebarItemType>;
60
+ isActive?: SidebarLinkActiveCheck;
61
+ visibility?: string;
62
+ disallowedIntegrationTypes?: Array<string>;
63
+ isPinned?: boolean;
64
+ showBadge?: boolean;
65
+ };
66
+
67
+ /**
68
+ * Sidebar — Composable compound component following Shadcn/Radix patterns.
69
+ *
70
+ * Usage:
71
+ * <SidebarProvider collapsed={false} onCollapsedChange={fn} pathname={path} linkComponent={Link}>
72
+ * <Sidebar>
73
+ * <SidebarContent>
74
+ * <SidebarGroup label="Main">
75
+ * <SidebarMenu>
76
+ * <SidebarMenuItem to="/dashboard" icon={<Icon />} label="Dashboard" />
77
+ * <SidebarMenuCollapsible icon={<Icon />} label="Finance" matchPaths={['/finance']}>
78
+ * <SidebarMenuSub>
79
+ * <SidebarMenuItem to="/finance/payouts" label="Payouts" isNested />
80
+ * </SidebarMenuSub>
81
+ * </SidebarMenuCollapsible>
82
+ * </SidebarMenu>
83
+ * </SidebarGroup>
84
+ * </SidebarContent>
85
+ * <SidebarFooter>
86
+ * <SidebarTrigger />
87
+ * </SidebarFooter>
88
+ * </Sidebar>
89
+ * </SidebarProvider>
90
+ */
91
+
92
+ interface SidebarProps {
93
+ /** Items for the collapsed icon strip (since collapsed layout is fundamentally different) */
94
+ collapsedItems?: SidebarItemType[];
95
+ /** Tool items shown below a spacer in collapsed mode */
96
+ collapsedToolItems?: SidebarItemType[];
97
+ /** Bottom items in collapsed mode (e.g. Billing, Settings) */
98
+ collapsedBottomItems?: SidebarItemType[];
99
+ /** Whether to render the chat button in collapsed mode (defaults to true) */
100
+ showChat?: boolean;
101
+ /** Click handler for the chat button (collapsed mode) */
102
+ onChatClick?: () => void;
103
+ /** Whether the chat button shows a notification badge */
104
+ chatBadge?: boolean;
105
+ children: ReactNode;
106
+ }
107
+ declare const Sidebar: React.FC<SidebarProps>;
108
+
109
+ declare const SidebarContent: React.FC<{
110
+ children: ReactNode;
111
+ }>;
112
+
113
+ declare const SidebarFooter: React.FC<{
114
+ children: ReactNode;
115
+ }>;
116
+
117
+ declare const SidebarTrigger: React.FC;
118
+
119
+ interface SidebarGroupProps {
120
+ label?: string;
121
+ dataId?: string;
122
+ children: ReactNode;
123
+ }
124
+ declare const SidebarGroup: React.FC<SidebarGroupProps>;
125
+
126
+ declare const SidebarMenu: React.FC<{
127
+ children: ReactNode;
128
+ }>;
129
+
130
+ interface SidebarMenuItemProps {
131
+ to?: string;
132
+ label: ReactNode;
133
+ icon?: ReactNode;
134
+ exact?: boolean;
135
+ external?: boolean;
136
+ hasExternalIcon?: boolean;
137
+ target?: string | null;
138
+ onClick?: SidebarLinkClickHandler;
139
+ dataId?: string;
140
+ isActive?: SidebarLinkActiveCheck;
141
+ isPinned?: boolean;
142
+ showBadge?: boolean;
143
+ hasTooltip?: boolean;
144
+ beta?: boolean;
145
+ multiLine?: boolean;
146
+ extra?: ReactNode;
147
+ /** Whether this item is inside a SidebarMenuSub (parent collapsible sets nested styling) */
148
+ isNested?: boolean;
149
+ }
150
+ declare const SidebarMenuItem: React.FC<SidebarMenuItemProps>;
151
+
152
+ interface SidebarMenuCollapsibleProps {
153
+ icon?: ReactNode;
154
+ label: ReactNode;
155
+ dataId?: string;
156
+ /** Route prefixes that should auto-expand this collapsible */
157
+ matchPaths?: string[];
158
+ children: ReactNode;
159
+ }
160
+ declare const SidebarMenuCollapsible: React.FC<SidebarMenuCollapsibleProps>;
161
+
162
+ /**
163
+ * Container for nested menu items inside a SidebarMenuCollapsible.
164
+ * Child SidebarMenuItems automatically get nested styling via the parent
165
+ * SidebarMenuCollapsible's CSS cascade (vertical rail + indent).
166
+ */
167
+ declare const SidebarMenuSub: React.FC<{
168
+ children: ReactNode;
169
+ }>;
170
+
171
+ interface SidebarChatButtonProps {
172
+ onClick?: () => void;
173
+ badge?: boolean;
174
+ }
175
+ declare const SidebarChatButton: React.FC<SidebarChatButtonProps>;
176
+
177
+ interface SidebarCollapsedProps {
178
+ items: SidebarItemType[];
179
+ toolItems?: SidebarItemType[];
180
+ bottomItems?: SidebarItemType[];
181
+ onToggleCollapse?: () => void;
182
+ onChatClick?: () => void;
183
+ showChat?: boolean;
184
+ chatBadge?: boolean;
185
+ }
186
+ declare const SidebarCollapsed: React.FC<SidebarCollapsedProps>;
187
+
188
+ export { Sidebar, SidebarChatButton, SidebarCollapsed, type SidebarCollapsedProps, SidebarContent, SidebarFooter, SidebarGroup, type SidebarItemType, type SidebarLinkActiveCheck, type SidebarLinkClickHandler, type SidebarLinkProps, SidebarMenu, SidebarMenuCollapsible, type SidebarMenuCollapsibleProps, SidebarMenuItem, type SidebarMenuItemProps, SidebarMenuSub, type SidebarProps, SidebarProvider, type SidebarProviderProps, SidebarTrigger, useSidebar };
package/native/index.d.ts ADDED
@@ -0,0 +1,188 @@
1
+ import React, { MouseEvent, ReactNode } from 'react';
2
+
3
+ type SidebarLinkClickHandler = (event?: MouseEvent<HTMLElement>) => void;
4
+ type SidebarLinkActiveCheck = (match: unknown, location: {
5
+ pathname: string;
6
+ search?: string;
7
+ hash?: string;
8
+ }) => boolean;
9
+ interface SidebarLinkProps {
10
+ to?: string;
11
+ exact?: boolean;
12
+ external?: boolean;
13
+ target?: string | null;
14
+ className?: string;
15
+ activeClassName?: string;
16
+ isActive?: SidebarLinkActiveCheck;
17
+ onClick?: SidebarLinkClickHandler;
18
+ dataId?: string;
19
+ children: ReactNode;
20
+ }
21
+ interface SidebarContextValue {
22
+ collapsed: boolean;
23
+ onCollapsedChange: (collapsed: boolean) => void;
24
+ pathname: string;
25
+ LinkComponent: React.ComponentType<SidebarLinkProps>;
26
+ expandedId: string | null;
27
+ onExpandedIdChange: (id: string | null) => void;
28
+ }
29
+ interface SidebarProviderProps {
30
+ collapsed?: boolean;
31
+ onCollapsedChange?: (collapsed: boolean) => void;
32
+ pathname?: string;
33
+ linkComponent?: React.ComponentType<SidebarLinkProps>;
34
+ children: ReactNode;
35
+ }
36
+ declare const SidebarProvider: React.FC<SidebarProviderProps>;
37
+ declare const useSidebar: () => SidebarContextValue;
38
+
39
+ /**
40
+ * SidebarItemType — Config object for data-driven patterns (collapsed mode, dynamic lists).
41
+ * For the composable API, use SidebarMenuItem/SidebarMenuCollapsible props directly.
42
+ */
43
+ type SidebarItemType = {
44
+ to?: string;
45
+ label: ReactNode;
46
+ privileges?: Array<string>;
47
+ dataId?: string;
48
+ icon?: ReactNode;
49
+ reverse?: boolean;
50
+ target?: string | null;
51
+ exact?: boolean;
52
+ external?: boolean;
53
+ hasExternalIcon?: boolean;
54
+ onClick?: SidebarLinkClickHandler;
55
+ extra?: ReactNode;
56
+ hasTooltip?: boolean;
57
+ beta?: boolean;
58
+ multiLine?: boolean;
59
+ children?: Array<SidebarItemType>;
60
+ isActive?: SidebarLinkActiveCheck;
61
+ visibility?: string;
62
+ disallowedIntegrationTypes?: Array<string>;
63
+ isPinned?: boolean;
64
+ showBadge?: boolean;
65
+ };
66
+
67
+ /**
68
+ * Sidebar — Composable compound component following Shadcn/Radix patterns.
69
+ *
70
+ * Usage:
71
+ * <SidebarProvider collapsed={false} onCollapsedChange={fn} pathname={path} linkComponent={Link}>
72
+ * <Sidebar>
73
+ * <SidebarContent>
74
+ * <SidebarGroup label="Main">
75
+ * <SidebarMenu>
76
+ * <SidebarMenuItem to="/dashboard" icon={<Icon />} label="Dashboard" />
77
+ * <SidebarMenuCollapsible icon={<Icon />} label="Finance" matchPaths={['/finance']}>
78
+ * <SidebarMenuSub>
79
+ * <SidebarMenuItem to="/finance/payouts" label="Payouts" isNested />
80
+ * </SidebarMenuSub>
81
+ * </SidebarMenuCollapsible>
82
+ * </SidebarMenu>
83
+ * </SidebarGroup>
84
+ * </SidebarContent>
85
+ * <SidebarFooter>
86
+ * <SidebarTrigger />
87
+ * </SidebarFooter>
88
+ * </Sidebar>
89
+ * </SidebarProvider>
90
+ */
91
+
92
+ interface SidebarProps {
93
+ /** Items for the collapsed icon strip (since collapsed layout is fundamentally different) */
94
+ collapsedItems?: SidebarItemType[];
95
+ /** Tool items shown below a spacer in collapsed mode */
96
+ collapsedToolItems?: SidebarItemType[];
97
+ /** Bottom items in collapsed mode (e.g. Billing, Settings) */
98
+ collapsedBottomItems?: SidebarItemType[];
99
+ /** Whether to render the chat button in collapsed mode (defaults to true) */
100
+ showChat?: boolean;
101
+ /** Click handler for the chat button (collapsed mode) */
102
+ onChatClick?: () => void;
103
+ /** Whether the chat button shows a notification badge */
104
+ chatBadge?: boolean;
105
+ children: ReactNode;
106
+ }
107
+ declare const Sidebar: React.FC<SidebarProps>;
108
+
109
+ declare const SidebarContent: React.FC<{
110
+ children: ReactNode;
111
+ }>;
112
+
113
+ declare const SidebarFooter: React.FC<{
114
+ children: ReactNode;
115
+ }>;
116
+
117
+ declare const SidebarTrigger: React.FC;
118
+
119
+ interface SidebarGroupProps {
120
+ label?: string;
121
+ dataId?: string;
122
+ children: ReactNode;
123
+ }
124
+ declare const SidebarGroup: React.FC<SidebarGroupProps>;
125
+
126
+ declare const SidebarMenu: React.FC<{
127
+ children: ReactNode;
128
+ }>;
129
+
130
+ interface SidebarMenuItemProps {
131
+ to?: string;
132
+ label: ReactNode;
133
+ icon?: ReactNode;
134
+ exact?: boolean;
135
+ external?: boolean;
136
+ hasExternalIcon?: boolean;
137
+ target?: string | null;
138
+ onClick?: SidebarLinkClickHandler;
139
+ dataId?: string;
140
+ isActive?: SidebarLinkActiveCheck;
141
+ isPinned?: boolean;
142
+ showBadge?: boolean;
143
+ hasTooltip?: boolean;
144
+ beta?: boolean;
145
+ multiLine?: boolean;
146
+ extra?: ReactNode;
147
+ /** Whether this item is inside a SidebarMenuSub (parent collapsible sets nested styling) */
148
+ isNested?: boolean;
149
+ }
150
+ declare const SidebarMenuItem: React.FC<SidebarMenuItemProps>;
151
+
152
+ interface SidebarMenuCollapsibleProps {
153
+ icon?: ReactNode;
154
+ label: ReactNode;
155
+ dataId?: string;
156
+ /** Route prefixes that should auto-expand this collapsible */
157
+ matchPaths?: string[];
158
+ children: ReactNode;
159
+ }
160
+ declare const SidebarMenuCollapsible: React.FC<SidebarMenuCollapsibleProps>;
161
+
162
+ /**
163
+ * Container for nested menu items inside a SidebarMenuCollapsible.
164
+ * Child SidebarMenuItems automatically get nested styling via the parent
165
+ * SidebarMenuCollapsible's CSS cascade (vertical rail + indent).
166
+ */
167
+ declare const SidebarMenuSub: React.FC<{
168
+ children: ReactNode;
169
+ }>;
170
+
171
+ interface SidebarChatButtonProps {
172
+ onClick?: () => void;
173
+ badge?: boolean;
174
+ }
175
+ declare const SidebarChatButton: React.FC<SidebarChatButtonProps>;
176
+
177
+ interface SidebarCollapsedProps {
178
+ items: SidebarItemType[];
179
+ toolItems?: SidebarItemType[];
180
+ bottomItems?: SidebarItemType[];
181
+ onToggleCollapse?: () => void;
182
+ onChatClick?: () => void;
183
+ showChat?: boolean;
184
+ chatBadge?: boolean;
185
+ }
186
+ declare const SidebarCollapsed: React.FC<SidebarCollapsedProps>;
187
+
188
+ export { Sidebar, SidebarChatButton, SidebarCollapsed, type SidebarCollapsedProps, SidebarContent, SidebarFooter, SidebarGroup, type SidebarItemType, type SidebarLinkActiveCheck, type SidebarLinkClickHandler, type SidebarLinkProps, SidebarMenu, SidebarMenuCollapsible, type SidebarMenuCollapsibleProps, SidebarMenuItem, type SidebarMenuItemProps, SidebarMenuSub, type SidebarProps, SidebarProvider, type SidebarProviderProps, SidebarTrigger, useSidebar };