@kodiak-finance/orderly-layout-grid 2.9.2-alpha.0
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/index.css +11 -0
- package/dist/index.css.map +1 -0
- package/dist/index.d.mts +154 -0
- package/dist/index.d.ts +154 -0
- package/dist/index.js +541 -0
- package/dist/index.js.map +1 -0
- package/dist/index.mjs +524 -0
- package/dist/index.mjs.map +1 -0
- package/dist/styles.css +1 -0
- package/package.json +46 -0
package/dist/index.css
ADDED
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
/* src/styles.css */
|
|
2
|
+
.react-resizable-handle {
|
|
3
|
+
z-index: 100;
|
|
4
|
+
}
|
|
5
|
+
.react-grid-item > .react-resizable-handle::after {
|
|
6
|
+
border-right: 2px solid rgb(var(--oui-color-base-6) / var(--tw-border-opacity, 1));
|
|
7
|
+
border-bottom: 2px solid rgb(var(--oui-color-base-6) / var(--tw-border-opacity, 1));
|
|
8
|
+
width: 8px;
|
|
9
|
+
height: 8px;
|
|
10
|
+
}
|
|
11
|
+
/*# sourceMappingURL=index.css.map */
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/styles.css"],"sourcesContent":[".react-resizable-handle {\n z-index: 100;\n}\n.react-grid-item > .react-resizable-handle::after {\n border-right: 2px solid\n rgb(var(--oui-color-base-6) / var(--tw-border-opacity, 1));\n border-bottom: 2px solid\n rgb(var(--oui-color-base-6) / var(--tw-border-opacity, 1));\n width: 8px;\n height: 8px;\n}\n"],"mappings":";AAAA,CAAC;AACC,WAAS;AACX;AACA,CAAC,gBAAgB,EAAE,CAHlB,sBAGyC;AACxC,gBAAc,IAAI,MAChB,IAAI,IAAI,oBAAoB,EAAE,IAAI,mBAAmB,EAAE;AACzD,iBAAe,IAAI,MACjB,IAAI,IAAI,oBAAoB,EAAE,IAAI,mBAAmB,EAAE;AACzD,SAAO;AACP,UAAQ;AACV;","names":[]}
|
package/dist/index.d.mts
ADDED
|
@@ -0,0 +1,154 @@
|
|
|
1
|
+
import { LayoutModel, LayoutStrategy } from '@kodiak-finance/orderly-layout-core';
|
|
2
|
+
import { LayoutItem, CompactType } from 'react-grid-layout';
|
|
3
|
+
import React$1 from 'react';
|
|
4
|
+
import { OrderlySDK } from '@kodiak-finance/orderly-ui';
|
|
5
|
+
|
|
6
|
+
interface GridConfig {
|
|
7
|
+
breakpoints?: {
|
|
8
|
+
lg: number;
|
|
9
|
+
md: number;
|
|
10
|
+
sm: number;
|
|
11
|
+
xs: number;
|
|
12
|
+
};
|
|
13
|
+
cols?: {
|
|
14
|
+
lg: number;
|
|
15
|
+
md: number;
|
|
16
|
+
sm: number;
|
|
17
|
+
xs: number;
|
|
18
|
+
};
|
|
19
|
+
rowHeight?: number;
|
|
20
|
+
margin?: [number, number];
|
|
21
|
+
containerPadding?: [number, number];
|
|
22
|
+
compactType?: CompactType;
|
|
23
|
+
isDraggable?: boolean;
|
|
24
|
+
isResizable?: boolean;
|
|
25
|
+
}
|
|
26
|
+
interface LayoutGridPluginOptions {
|
|
27
|
+
presets?: GridLayoutPreset[];
|
|
28
|
+
grid?: GridConfig;
|
|
29
|
+
persistLayout?: boolean;
|
|
30
|
+
getInitialLayout?: () => GridLayoutModel;
|
|
31
|
+
classNames?: {
|
|
32
|
+
item?: string;
|
|
33
|
+
};
|
|
34
|
+
}
|
|
35
|
+
type GridLayoutItemSpec = Omit<LayoutItem, "i"> & {
|
|
36
|
+
panelId: string;
|
|
37
|
+
className?: string;
|
|
38
|
+
style?: React.CSSProperties;
|
|
39
|
+
/** When true, item height follows content (measured via ResizeObserver and pushed to layout). */
|
|
40
|
+
autoHeight?: boolean;
|
|
41
|
+
/**
|
|
42
|
+
* Whether this grid item is collapsible.
|
|
43
|
+
*
|
|
44
|
+
* For collapsible items, `w` is treated as the expanded width
|
|
45
|
+
* and `minW` is treated as the collapsed width. The actual
|
|
46
|
+
* collapsed / expanded state is derived from the current layout
|
|
47
|
+
* width at render time (e.g. when dragged down to `minW`).
|
|
48
|
+
*/
|
|
49
|
+
collapsible?: boolean;
|
|
50
|
+
};
|
|
51
|
+
interface GridLayoutRule {
|
|
52
|
+
lg?: GridLayoutItemSpec[];
|
|
53
|
+
md?: GridLayoutItemSpec[];
|
|
54
|
+
sm?: GridLayoutItemSpec[];
|
|
55
|
+
xs?: GridLayoutItemSpec[];
|
|
56
|
+
}
|
|
57
|
+
interface GridLayoutPreset {
|
|
58
|
+
id: string;
|
|
59
|
+
name: string;
|
|
60
|
+
rule: GridLayoutRule;
|
|
61
|
+
rowHeight?: number;
|
|
62
|
+
}
|
|
63
|
+
interface GridLayoutItem extends LayoutItem {
|
|
64
|
+
panelId: string;
|
|
65
|
+
className?: string;
|
|
66
|
+
style?: React.CSSProperties;
|
|
67
|
+
/** When true, item height follows content (measured via ResizeObserver and pushed to layout). */
|
|
68
|
+
autoHeight?: boolean;
|
|
69
|
+
/**
|
|
70
|
+
* Whether this grid item is collapsible.
|
|
71
|
+
*
|
|
72
|
+
* For collapsible items, `w` is treated as the expanded width
|
|
73
|
+
* and `minW` is treated as the collapsed width. The actual
|
|
74
|
+
* collapsed / expanded state is derived from the current layout
|
|
75
|
+
* width at render time (e.g. when dragged down to `minW`).
|
|
76
|
+
*/
|
|
77
|
+
collapsible?: boolean;
|
|
78
|
+
}
|
|
79
|
+
interface GridLayoutModel extends LayoutModel {
|
|
80
|
+
layouts: {
|
|
81
|
+
lg?: GridLayoutItem[];
|
|
82
|
+
md?: GridLayoutItem[];
|
|
83
|
+
sm?: GridLayoutItem[];
|
|
84
|
+
xs?: GridLayoutItem[];
|
|
85
|
+
};
|
|
86
|
+
breakpoints?: {
|
|
87
|
+
lg: number;
|
|
88
|
+
md: number;
|
|
89
|
+
sm: number;
|
|
90
|
+
xs: number;
|
|
91
|
+
};
|
|
92
|
+
cols?: {
|
|
93
|
+
lg: number;
|
|
94
|
+
md: number;
|
|
95
|
+
sm: number;
|
|
96
|
+
xs: number;
|
|
97
|
+
};
|
|
98
|
+
compactType?: "vertical" | "horizontal" | null;
|
|
99
|
+
isDraggable?: boolean;
|
|
100
|
+
isResizable?: boolean;
|
|
101
|
+
margin?: [number, number];
|
|
102
|
+
containerPadding?: [number, number];
|
|
103
|
+
rowHeight?: number;
|
|
104
|
+
}
|
|
105
|
+
|
|
106
|
+
declare const gridStrategy: LayoutStrategy<GridLayoutModel>;
|
|
107
|
+
|
|
108
|
+
declare const DEFAULT_BREAKPOINTS: {
|
|
109
|
+
lg: number;
|
|
110
|
+
md: number;
|
|
111
|
+
sm: number;
|
|
112
|
+
xs: number;
|
|
113
|
+
};
|
|
114
|
+
declare const DEFAULT_COLS: {
|
|
115
|
+
lg: number;
|
|
116
|
+
md: number;
|
|
117
|
+
sm: number;
|
|
118
|
+
xs: number;
|
|
119
|
+
};
|
|
120
|
+
/** Build grid layout from panelIds; optional rule (missing breakpoints fall back to lg), else default lg rule from defaultPresets. */
|
|
121
|
+
declare function createDefaultGridLayout(panelIds: string[], rule?: GridLayoutRule, rowHeight?: number): GridLayoutModel;
|
|
122
|
+
declare function serializeGridLayout(layout: GridLayoutModel): string;
|
|
123
|
+
declare function deserializeGridLayout(json: string): GridLayoutModel;
|
|
124
|
+
|
|
125
|
+
declare function createTradingGridLayoutFromPreset(preset?: GridLayoutPreset | null): GridLayoutModel;
|
|
126
|
+
declare function createTradingGridLayout(): GridLayoutModel;
|
|
127
|
+
|
|
128
|
+
declare const DEFAULT_GRID_PRESETS: GridLayoutPreset[];
|
|
129
|
+
declare function getDefaultGridPresets(): GridLayoutPreset[];
|
|
130
|
+
|
|
131
|
+
/** Preset list + selected id (LayoutRuleManager); used by plugin for getInitialLayout/storageKey. */
|
|
132
|
+
|
|
133
|
+
interface GridPresetContextValue {
|
|
134
|
+
presets: GridLayoutPreset[];
|
|
135
|
+
selectedPresetId: string;
|
|
136
|
+
setSelectedPresetId: (id: string) => void;
|
|
137
|
+
layoutStorageKey: string;
|
|
138
|
+
reset: () => void;
|
|
139
|
+
rowHeight?: number;
|
|
140
|
+
}
|
|
141
|
+
|
|
142
|
+
/** Preset dropdown; use inside GridPresetProvider. */
|
|
143
|
+
|
|
144
|
+
interface GridLayoutSwitcherProps {
|
|
145
|
+
className?: string;
|
|
146
|
+
style?: React$1.CSSProperties;
|
|
147
|
+
"aria-label"?: string;
|
|
148
|
+
}
|
|
149
|
+
declare function GridLayoutSwitcher({ className, style, "aria-label": ariaLabel, }: GridLayoutSwitcherProps): React$1.ReactElement | null;
|
|
150
|
+
|
|
151
|
+
/** Registers the grid layout plugin (Trading.Layout.Desktop interceptor). */
|
|
152
|
+
declare function registerLayoutGridPlugin(options?: LayoutGridPluginOptions): (SDK: OrderlySDK) => void;
|
|
153
|
+
|
|
154
|
+
export { DEFAULT_BREAKPOINTS, DEFAULT_COLS, DEFAULT_GRID_PRESETS, type GridConfig, type GridLayoutItem, type GridLayoutItemSpec, type GridLayoutModel, type GridLayoutPreset, type GridLayoutRule, GridLayoutSwitcher, type GridLayoutSwitcherProps, type GridPresetContextValue, type LayoutGridPluginOptions, createDefaultGridLayout, createTradingGridLayout, createTradingGridLayoutFromPreset, deserializeGridLayout, getDefaultGridPresets, gridStrategy, registerLayoutGridPlugin, serializeGridLayout };
|
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,154 @@
|
|
|
1
|
+
import { LayoutModel, LayoutStrategy } from '@kodiak-finance/orderly-layout-core';
|
|
2
|
+
import { LayoutItem, CompactType } from 'react-grid-layout';
|
|
3
|
+
import React$1 from 'react';
|
|
4
|
+
import { OrderlySDK } from '@kodiak-finance/orderly-ui';
|
|
5
|
+
|
|
6
|
+
interface GridConfig {
|
|
7
|
+
breakpoints?: {
|
|
8
|
+
lg: number;
|
|
9
|
+
md: number;
|
|
10
|
+
sm: number;
|
|
11
|
+
xs: number;
|
|
12
|
+
};
|
|
13
|
+
cols?: {
|
|
14
|
+
lg: number;
|
|
15
|
+
md: number;
|
|
16
|
+
sm: number;
|
|
17
|
+
xs: number;
|
|
18
|
+
};
|
|
19
|
+
rowHeight?: number;
|
|
20
|
+
margin?: [number, number];
|
|
21
|
+
containerPadding?: [number, number];
|
|
22
|
+
compactType?: CompactType;
|
|
23
|
+
isDraggable?: boolean;
|
|
24
|
+
isResizable?: boolean;
|
|
25
|
+
}
|
|
26
|
+
interface LayoutGridPluginOptions {
|
|
27
|
+
presets?: GridLayoutPreset[];
|
|
28
|
+
grid?: GridConfig;
|
|
29
|
+
persistLayout?: boolean;
|
|
30
|
+
getInitialLayout?: () => GridLayoutModel;
|
|
31
|
+
classNames?: {
|
|
32
|
+
item?: string;
|
|
33
|
+
};
|
|
34
|
+
}
|
|
35
|
+
type GridLayoutItemSpec = Omit<LayoutItem, "i"> & {
|
|
36
|
+
panelId: string;
|
|
37
|
+
className?: string;
|
|
38
|
+
style?: React.CSSProperties;
|
|
39
|
+
/** When true, item height follows content (measured via ResizeObserver and pushed to layout). */
|
|
40
|
+
autoHeight?: boolean;
|
|
41
|
+
/**
|
|
42
|
+
* Whether this grid item is collapsible.
|
|
43
|
+
*
|
|
44
|
+
* For collapsible items, `w` is treated as the expanded width
|
|
45
|
+
* and `minW` is treated as the collapsed width. The actual
|
|
46
|
+
* collapsed / expanded state is derived from the current layout
|
|
47
|
+
* width at render time (e.g. when dragged down to `minW`).
|
|
48
|
+
*/
|
|
49
|
+
collapsible?: boolean;
|
|
50
|
+
};
|
|
51
|
+
interface GridLayoutRule {
|
|
52
|
+
lg?: GridLayoutItemSpec[];
|
|
53
|
+
md?: GridLayoutItemSpec[];
|
|
54
|
+
sm?: GridLayoutItemSpec[];
|
|
55
|
+
xs?: GridLayoutItemSpec[];
|
|
56
|
+
}
|
|
57
|
+
interface GridLayoutPreset {
|
|
58
|
+
id: string;
|
|
59
|
+
name: string;
|
|
60
|
+
rule: GridLayoutRule;
|
|
61
|
+
rowHeight?: number;
|
|
62
|
+
}
|
|
63
|
+
interface GridLayoutItem extends LayoutItem {
|
|
64
|
+
panelId: string;
|
|
65
|
+
className?: string;
|
|
66
|
+
style?: React.CSSProperties;
|
|
67
|
+
/** When true, item height follows content (measured via ResizeObserver and pushed to layout). */
|
|
68
|
+
autoHeight?: boolean;
|
|
69
|
+
/**
|
|
70
|
+
* Whether this grid item is collapsible.
|
|
71
|
+
*
|
|
72
|
+
* For collapsible items, `w` is treated as the expanded width
|
|
73
|
+
* and `minW` is treated as the collapsed width. The actual
|
|
74
|
+
* collapsed / expanded state is derived from the current layout
|
|
75
|
+
* width at render time (e.g. when dragged down to `minW`).
|
|
76
|
+
*/
|
|
77
|
+
collapsible?: boolean;
|
|
78
|
+
}
|
|
79
|
+
interface GridLayoutModel extends LayoutModel {
|
|
80
|
+
layouts: {
|
|
81
|
+
lg?: GridLayoutItem[];
|
|
82
|
+
md?: GridLayoutItem[];
|
|
83
|
+
sm?: GridLayoutItem[];
|
|
84
|
+
xs?: GridLayoutItem[];
|
|
85
|
+
};
|
|
86
|
+
breakpoints?: {
|
|
87
|
+
lg: number;
|
|
88
|
+
md: number;
|
|
89
|
+
sm: number;
|
|
90
|
+
xs: number;
|
|
91
|
+
};
|
|
92
|
+
cols?: {
|
|
93
|
+
lg: number;
|
|
94
|
+
md: number;
|
|
95
|
+
sm: number;
|
|
96
|
+
xs: number;
|
|
97
|
+
};
|
|
98
|
+
compactType?: "vertical" | "horizontal" | null;
|
|
99
|
+
isDraggable?: boolean;
|
|
100
|
+
isResizable?: boolean;
|
|
101
|
+
margin?: [number, number];
|
|
102
|
+
containerPadding?: [number, number];
|
|
103
|
+
rowHeight?: number;
|
|
104
|
+
}
|
|
105
|
+
|
|
106
|
+
declare const gridStrategy: LayoutStrategy<GridLayoutModel>;
|
|
107
|
+
|
|
108
|
+
declare const DEFAULT_BREAKPOINTS: {
|
|
109
|
+
lg: number;
|
|
110
|
+
md: number;
|
|
111
|
+
sm: number;
|
|
112
|
+
xs: number;
|
|
113
|
+
};
|
|
114
|
+
declare const DEFAULT_COLS: {
|
|
115
|
+
lg: number;
|
|
116
|
+
md: number;
|
|
117
|
+
sm: number;
|
|
118
|
+
xs: number;
|
|
119
|
+
};
|
|
120
|
+
/** Build grid layout from panelIds; optional rule (missing breakpoints fall back to lg), else default lg rule from defaultPresets. */
|
|
121
|
+
declare function createDefaultGridLayout(panelIds: string[], rule?: GridLayoutRule, rowHeight?: number): GridLayoutModel;
|
|
122
|
+
declare function serializeGridLayout(layout: GridLayoutModel): string;
|
|
123
|
+
declare function deserializeGridLayout(json: string): GridLayoutModel;
|
|
124
|
+
|
|
125
|
+
declare function createTradingGridLayoutFromPreset(preset?: GridLayoutPreset | null): GridLayoutModel;
|
|
126
|
+
declare function createTradingGridLayout(): GridLayoutModel;
|
|
127
|
+
|
|
128
|
+
declare const DEFAULT_GRID_PRESETS: GridLayoutPreset[];
|
|
129
|
+
declare function getDefaultGridPresets(): GridLayoutPreset[];
|
|
130
|
+
|
|
131
|
+
/** Preset list + selected id (LayoutRuleManager); used by plugin for getInitialLayout/storageKey. */
|
|
132
|
+
|
|
133
|
+
interface GridPresetContextValue {
|
|
134
|
+
presets: GridLayoutPreset[];
|
|
135
|
+
selectedPresetId: string;
|
|
136
|
+
setSelectedPresetId: (id: string) => void;
|
|
137
|
+
layoutStorageKey: string;
|
|
138
|
+
reset: () => void;
|
|
139
|
+
rowHeight?: number;
|
|
140
|
+
}
|
|
141
|
+
|
|
142
|
+
/** Preset dropdown; use inside GridPresetProvider. */
|
|
143
|
+
|
|
144
|
+
interface GridLayoutSwitcherProps {
|
|
145
|
+
className?: string;
|
|
146
|
+
style?: React$1.CSSProperties;
|
|
147
|
+
"aria-label"?: string;
|
|
148
|
+
}
|
|
149
|
+
declare function GridLayoutSwitcher({ className, style, "aria-label": ariaLabel, }: GridLayoutSwitcherProps): React$1.ReactElement | null;
|
|
150
|
+
|
|
151
|
+
/** Registers the grid layout plugin (Trading.Layout.Desktop interceptor). */
|
|
152
|
+
declare function registerLayoutGridPlugin(options?: LayoutGridPluginOptions): (SDK: OrderlySDK) => void;
|
|
153
|
+
|
|
154
|
+
export { DEFAULT_BREAKPOINTS, DEFAULT_COLS, DEFAULT_GRID_PRESETS, type GridConfig, type GridLayoutItem, type GridLayoutItemSpec, type GridLayoutModel, type GridLayoutPreset, type GridLayoutRule, GridLayoutSwitcher, type GridLayoutSwitcherProps, type GridPresetContextValue, type LayoutGridPluginOptions, createDefaultGridLayout, createTradingGridLayout, createTradingGridLayoutFromPreset, deserializeGridLayout, getDefaultGridPresets, gridStrategy, registerLayoutGridPlugin, serializeGridLayout };
|