@noya-app/noya-designsystem 0.1.31 → 0.1.33
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/.turbo/turbo-build.log +20 -12
- package/.turbo/turbo-lint.log +2 -1
- package/CHANGELOG.md +14 -0
- package/README.md +13 -1
- package/dist/index.css +1 -0
- package/dist/index.d.ts +132 -509
- package/dist/index.js +4167 -2716
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +4097 -2643
- package/dist/index.mjs.map +1 -1
- package/package.json +15 -6
- package/src/components/ActivityIndicator.tsx +4 -36
- package/src/components/Avatar.tsx +63 -62
- package/src/components/Button.tsx +53 -172
- package/src/components/Chip.tsx +117 -150
- package/src/components/ContextMenu.tsx +13 -35
- package/src/components/Dialog.tsx +66 -54
- package/src/components/Divider.tsx +31 -41
- package/src/components/DraggableMenuButton.tsx +29 -30
- package/src/components/DropdownMenu.tsx +30 -40
- package/src/components/FillInputField.tsx +16 -26
- package/src/components/FillPreviewBackground.tsx +18 -22
- package/src/components/FloatingWindow.tsx +4 -7
- package/src/components/GridView.tsx +70 -200
- package/src/components/IconButton.tsx +1 -5
- package/src/components/InputField.tsx +191 -194
- package/src/components/InputFieldWithCompletions.tsx +20 -27
- package/src/components/InspectorContainer.tsx +4 -9
- package/src/components/InspectorPrimitives.tsx +135 -109
- package/src/components/Label.tsx +5 -36
- package/src/components/LabeledElementView.tsx +5 -26
- package/src/components/ListView.tsx +239 -167
- package/src/components/Popover.tsx +15 -39
- package/src/components/Progress.tsx +21 -44
- package/src/components/RadioGroup.tsx +6 -71
- package/src/components/ScrollArea.tsx +11 -39
- package/src/components/SelectMenu.tsx +31 -48
- package/src/components/Slider.tsx +7 -43
- package/src/components/Spacer.tsx +6 -18
- package/src/components/Switch.tsx +4 -42
- package/src/components/Text.tsx +31 -66
- package/src/components/TextArea.tsx +5 -31
- package/src/components/Toast.tsx +15 -57
- package/src/components/Tooltip.tsx +4 -13
- package/src/components/WorkspaceLayout.tsx +4 -14
- package/src/components/internal/Menu.tsx +37 -83
- package/src/contexts/DesignSystemConfiguration.tsx +1 -47
- package/src/contexts/DialogContext.tsx +2 -10
- package/src/hooks/useDarkMode.ts +14 -0
- package/src/index.css +108 -0
- package/src/index.tsx +3 -4
- package/src/theme/index.ts +4 -16
- package/src/utils/tailwind.ts +17 -0
- package/tailwind.config.ts +106 -166
- package/tsup.config.ts +16 -0
- package/dist/index.d.mts +0 -1443
- package/src/components/Grid.tsx +0 -54
- package/src/components/Stack.tsx +0 -164
- package/src/theme/dark.ts +0 -45
- package/src/theme/light.ts +0 -226
- package/src/utils/breakpoints.ts +0 -45
package/dist/index.d.mts
DELETED
|
@@ -1,1443 +0,0 @@
|
|
|
1
|
-
import * as React$1 from 'react';
|
|
2
|
-
import React__default, { CSSProperties, ReactNode, ComponentProps, SyntheticEvent, AriaRole, KeyboardEventHandler, MouseEventHandler, PointerEventHandler, FocusEventHandler, InputHTMLAttributes, Ref, ReactHTML } from 'react';
|
|
3
|
-
import * as styled_components_dist_types from 'styled-components/dist/types';
|
|
4
|
-
import * as styled_components from 'styled-components';
|
|
5
|
-
import { CSSObject, CSSProperties as CSSProperties$1 } from 'styled-components';
|
|
6
|
-
import * as Icons from '@noya-app/noya-icons';
|
|
7
|
-
export { Icons };
|
|
8
|
-
import * as DialogPrimitive from '@radix-ui/react-dialog';
|
|
9
|
-
import * as RadixDropdownMenu from '@radix-ui/react-dropdown-menu';
|
|
10
|
-
import { Sketch } from '@noya-app/noya-file-format';
|
|
11
|
-
import * as _noya_app_noya_keymap from '@noya-app/noya-keymap';
|
|
12
|
-
import { KeyModifiers, PlatformName } from '@noya-app/noya-keymap';
|
|
13
|
-
import { Property } from 'csstype';
|
|
14
|
-
import * as _noya_app_noya_geometry from '@noya-app/noya-geometry';
|
|
15
|
-
import { Size } from '@noya-app/noya-geometry';
|
|
16
|
-
import { IItemScore } from 'vscode-fuzzy-scorer';
|
|
17
|
-
import { useSortable } from '@dnd-kit/sortable';
|
|
18
|
-
import * as PopoverPrimitive from '@radix-ui/react-popover';
|
|
19
|
-
import { SelectProps } from '@radix-ui/react-select';
|
|
20
|
-
import { ImperativePanelGroupHandle } from 'react-resizable-panels';
|
|
21
|
-
import { RgbaColor } from '@noya-app/noya-colorpicker';
|
|
22
|
-
|
|
23
|
-
interface Props$i {
|
|
24
|
-
size?: number;
|
|
25
|
-
opacity?: number;
|
|
26
|
-
color?: string;
|
|
27
|
-
trackColor?: string;
|
|
28
|
-
}
|
|
29
|
-
declare const ActivityIndicator: (props: Props$i) => React__default.ReactElement | null;
|
|
30
|
-
|
|
31
|
-
declare const Avatar: (props: {
|
|
32
|
-
image?: string;
|
|
33
|
-
name?: string;
|
|
34
|
-
fallback?: string;
|
|
35
|
-
size?: number;
|
|
36
|
-
overflow?: number;
|
|
37
|
-
style?: React__default.CSSProperties;
|
|
38
|
-
className?: string;
|
|
39
|
-
} & React__default.RefAttributes<HTMLDivElement>) => React__default.ReactElement | null;
|
|
40
|
-
declare function AvatarStack({ size, children, }: {
|
|
41
|
-
size?: number;
|
|
42
|
-
children: React__default.ReactNode;
|
|
43
|
-
}): React__default.JSX.Element;
|
|
44
|
-
|
|
45
|
-
type ButtonVariant = "normal" | "primary" | "primaryGradient" | "secondary" | "secondaryBright" | "white" | "thin" | "floating" | "none";
|
|
46
|
-
type ButtonSize = "small" | "normal" | "large";
|
|
47
|
-
declare const ButtonElement: styled_components_dist_types.IStyledComponentBase<"web", styled_components_dist_types.Substitute<React__default.DetailedHTMLProps<React__default.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, {
|
|
48
|
-
$active: boolean;
|
|
49
|
-
$variant: ButtonVariant;
|
|
50
|
-
$size: ButtonSize;
|
|
51
|
-
$flex?: CSSProperties["flex"];
|
|
52
|
-
$defaultBackground?: string;
|
|
53
|
-
}>> & string;
|
|
54
|
-
interface ButtonRootProps {
|
|
55
|
-
id?: string;
|
|
56
|
-
className?: string;
|
|
57
|
-
style?: CSSProperties;
|
|
58
|
-
flex?: CSSProperties["flex"];
|
|
59
|
-
tabIndex?: number;
|
|
60
|
-
children: ReactNode;
|
|
61
|
-
active?: boolean;
|
|
62
|
-
disabled?: boolean;
|
|
63
|
-
/** @default normal */
|
|
64
|
-
variant?: ButtonVariant;
|
|
65
|
-
/** @default normal */
|
|
66
|
-
size?: ButtonSize;
|
|
67
|
-
tooltip?: ReactNode;
|
|
68
|
-
onClick?: (event: React__default.MouseEvent) => void;
|
|
69
|
-
onPointerDown?: (event: React__default.PointerEvent) => void;
|
|
70
|
-
contentStyle?: CSSProperties;
|
|
71
|
-
defaultBackground?: string;
|
|
72
|
-
as?: React__default.ElementType;
|
|
73
|
-
htmlFor?: string;
|
|
74
|
-
href?: string;
|
|
75
|
-
target?: string;
|
|
76
|
-
rel?: string;
|
|
77
|
-
}
|
|
78
|
-
declare const Button: (props: ButtonRootProps & React__default.RefAttributes<HTMLButtonElement>) => React__default.ReactElement | null;
|
|
79
|
-
|
|
80
|
-
type ChipColorScheme = "primary" | "secondary" | "error";
|
|
81
|
-
type ChipSize = "small" | "medium" | "large";
|
|
82
|
-
type ChipVariant = "solid" | "outlined" | "ghost";
|
|
83
|
-
interface ChipProps {
|
|
84
|
-
id?: string;
|
|
85
|
-
className?: string;
|
|
86
|
-
colorScheme?: ChipColorScheme;
|
|
87
|
-
variant?: ChipVariant;
|
|
88
|
-
size?: ChipSize;
|
|
89
|
-
children?: React__default.ReactNode;
|
|
90
|
-
clickable?: boolean;
|
|
91
|
-
deletable?: boolean;
|
|
92
|
-
addable?: boolean;
|
|
93
|
-
monospace?: boolean;
|
|
94
|
-
onDelete?: () => void;
|
|
95
|
-
onAdd?: () => void;
|
|
96
|
-
onClick?: () => void;
|
|
97
|
-
onHoverDeleteChange?: (hovering: boolean) => void;
|
|
98
|
-
style?: React__default.CSSProperties;
|
|
99
|
-
tabIndex?: number;
|
|
100
|
-
}
|
|
101
|
-
declare const Chip: (props: ChipProps & React__default.RefAttributes<HTMLSpanElement>) => React__default.ReactElement | null;
|
|
102
|
-
|
|
103
|
-
declare const name$1: string;
|
|
104
|
-
declare const colors$1: {
|
|
105
|
-
logo: {
|
|
106
|
-
fill: string;
|
|
107
|
-
highlight: string;
|
|
108
|
-
};
|
|
109
|
-
background: string;
|
|
110
|
-
text: string;
|
|
111
|
-
textMuted: string;
|
|
112
|
-
textSubtle: string;
|
|
113
|
-
textDisabled: string;
|
|
114
|
-
textDecorativeLight: string;
|
|
115
|
-
dividerSubtle: string;
|
|
116
|
-
divider: string;
|
|
117
|
-
dividerStrong: string;
|
|
118
|
-
primary: string;
|
|
119
|
-
primaryLight: string;
|
|
120
|
-
primaryPastel: string;
|
|
121
|
-
secondary: string;
|
|
122
|
-
secondaryLight: string;
|
|
123
|
-
secondaryPastel: string;
|
|
124
|
-
secondaryBright: string;
|
|
125
|
-
warning: string;
|
|
126
|
-
neutralBackground: string;
|
|
127
|
-
inputBackground: string;
|
|
128
|
-
inputBackgroundLight: string;
|
|
129
|
-
codeBackground: string;
|
|
130
|
-
codeBackgroundLight: string;
|
|
131
|
-
readonly codeBackgroundDark: string;
|
|
132
|
-
codeBackgroundDecorativeDark: string;
|
|
133
|
-
selectedBackground: string;
|
|
134
|
-
transparentChecker: string;
|
|
135
|
-
activeBackground: string;
|
|
136
|
-
scrollbar: string;
|
|
137
|
-
placeholderDots: string;
|
|
138
|
-
breadcrumb: {
|
|
139
|
-
readonly text: string;
|
|
140
|
-
readonly textHover: string;
|
|
141
|
-
readonly icon: string;
|
|
142
|
-
};
|
|
143
|
-
listView: {
|
|
144
|
-
raisedBackground: string;
|
|
145
|
-
editingBackground: string;
|
|
146
|
-
};
|
|
147
|
-
canvas: {
|
|
148
|
-
background: string;
|
|
149
|
-
readonly selectionStroke: string;
|
|
150
|
-
dragHandleStroke: string;
|
|
151
|
-
measurement: string;
|
|
152
|
-
sliceOutline: string;
|
|
153
|
-
grid: string;
|
|
154
|
-
};
|
|
155
|
-
sidebar: {
|
|
156
|
-
background: string;
|
|
157
|
-
backgroundTransparent: string;
|
|
158
|
-
};
|
|
159
|
-
popover: {
|
|
160
|
-
background: string;
|
|
161
|
-
divider: string;
|
|
162
|
-
};
|
|
163
|
-
slider: {
|
|
164
|
-
background: string;
|
|
165
|
-
border: string;
|
|
166
|
-
};
|
|
167
|
-
radioGroup: {
|
|
168
|
-
background: string;
|
|
169
|
-
};
|
|
170
|
-
icon: string;
|
|
171
|
-
iconSelected: string;
|
|
172
|
-
mask: string;
|
|
173
|
-
imageOverlay: string;
|
|
174
|
-
readonly dragOutline: string;
|
|
175
|
-
selection: string;
|
|
176
|
-
thumbnailBackground: string;
|
|
177
|
-
thumbnailShadow: string;
|
|
178
|
-
inlineCode: {
|
|
179
|
-
text: string;
|
|
180
|
-
background: string;
|
|
181
|
-
};
|
|
182
|
-
textLink: string;
|
|
183
|
-
textLinkFocused: string;
|
|
184
|
-
};
|
|
185
|
-
declare const fonts: {
|
|
186
|
-
normal: string;
|
|
187
|
-
monospace: string;
|
|
188
|
-
};
|
|
189
|
-
declare const textStyles: {
|
|
190
|
-
title: CSSObject;
|
|
191
|
-
subtitle: CSSObject;
|
|
192
|
-
heading1: CSSObject;
|
|
193
|
-
heading2: CSSObject;
|
|
194
|
-
heading3: CSSObject;
|
|
195
|
-
heading4: CSSObject;
|
|
196
|
-
heading5: CSSObject;
|
|
197
|
-
body: CSSObject;
|
|
198
|
-
small: CSSObject;
|
|
199
|
-
button: CSSObject;
|
|
200
|
-
code: CSSObject;
|
|
201
|
-
label: CSSObject;
|
|
202
|
-
};
|
|
203
|
-
declare const sizes: {
|
|
204
|
-
inset: {
|
|
205
|
-
top: number;
|
|
206
|
-
};
|
|
207
|
-
sidebarWidth: number;
|
|
208
|
-
toolbar: {
|
|
209
|
-
height: number;
|
|
210
|
-
itemSeparator: number;
|
|
211
|
-
};
|
|
212
|
-
inspector: {
|
|
213
|
-
horizontalSeparator: number;
|
|
214
|
-
verticalSeparator: number;
|
|
215
|
-
};
|
|
216
|
-
spacing: {
|
|
217
|
-
nano: number;
|
|
218
|
-
micro: number;
|
|
219
|
-
small: number;
|
|
220
|
-
medium: number;
|
|
221
|
-
large: number;
|
|
222
|
-
xlarge: number;
|
|
223
|
-
xxlarge: number;
|
|
224
|
-
};
|
|
225
|
-
dialog: {
|
|
226
|
-
padding: number;
|
|
227
|
-
};
|
|
228
|
-
};
|
|
229
|
-
|
|
230
|
-
declare const lightTheme_fonts: typeof fonts;
|
|
231
|
-
declare const lightTheme_sizes: typeof sizes;
|
|
232
|
-
declare const lightTheme_textStyles: typeof textStyles;
|
|
233
|
-
declare namespace lightTheme {
|
|
234
|
-
export { colors$1 as colors, lightTheme_fonts as fonts, name$1 as name, lightTheme_sizes as sizes, lightTheme_textStyles as textStyles };
|
|
235
|
-
}
|
|
236
|
-
|
|
237
|
-
type Theme = typeof lightTheme;
|
|
238
|
-
declare module 'styled-components' {
|
|
239
|
-
interface DefaultTheme extends Theme {
|
|
240
|
-
}
|
|
241
|
-
}
|
|
242
|
-
interface Colors {
|
|
243
|
-
}
|
|
244
|
-
type PickByValue<T, V> = Pick<T, {
|
|
245
|
-
[K in keyof T]-?: T[K] extends V ? K : never;
|
|
246
|
-
}[keyof T]>;
|
|
247
|
-
type ThemeColorName = keyof PickByValue<Theme['colors'], string>;
|
|
248
|
-
|
|
249
|
-
type IconName = keyof typeof Icons;
|
|
250
|
-
|
|
251
|
-
declare function renderIcon(iconName: Exclude<ReactNode, string> | IconName): ReactNode;
|
|
252
|
-
|
|
253
|
-
declare const SEPARATOR_ITEM = "separator";
|
|
254
|
-
type MenuItemRole = "undo" | "redo" | "cut" | "copy" | "paste" | "pasteAndMatchStyle" | "delete" | "selectAll" | "reload" | "forceReload" | "toggleDevTools" | "resetZoom" | "zoomIn" | "zoomOut" | "toggleSpellChecker" | "togglefullscreen" | "window" | "minimize" | "close" | "help" | "about" | "services" | "hide" | "hideOthers" | "unhide" | "quit" | "showSubstitutions" | "toggleSmartQuotes" | "toggleSmartDashes" | "toggleTextReplacement" | "startSpeaking" | "stopSpeaking" | "zoom" | "front" | "appMenu" | "fileMenu" | "editMenu" | "viewMenu" | "shareMenu" | "recentDocuments" | "toggleTabBar" | "selectNextTab" | "selectPreviousTab" | "mergeAllWindows" | "clearRecentDocuments" | "moveTabToNewWindow" | "windowMenu";
|
|
255
|
-
type RegularMenuItem<T extends string> = {
|
|
256
|
-
value?: T;
|
|
257
|
-
title: ReactNode;
|
|
258
|
-
shortcut?: string;
|
|
259
|
-
checked?: boolean;
|
|
260
|
-
disabled?: boolean;
|
|
261
|
-
icon?: Exclude<ReactNode, string> | IconName;
|
|
262
|
-
items?: MenuItem<T>[];
|
|
263
|
-
role?: MenuItemRole;
|
|
264
|
-
};
|
|
265
|
-
type MenuItem<T extends string> = typeof SEPARATOR_ITEM | RegularMenuItem<T>;
|
|
266
|
-
type ExtractMenuItemType<T> = T extends RegularMenuItem<infer U> ? U : never;
|
|
267
|
-
declare const KeyboardShortcut: (props: {
|
|
268
|
-
shortcut: string;
|
|
269
|
-
}) => React__default.ReactElement | null;
|
|
270
|
-
|
|
271
|
-
interface MenuItemProps<T extends string> {
|
|
272
|
-
value?: T;
|
|
273
|
-
children: ReactNode;
|
|
274
|
-
onSelect: (value: T) => void;
|
|
275
|
-
checked: boolean;
|
|
276
|
-
disabled: boolean;
|
|
277
|
-
indented: boolean;
|
|
278
|
-
shortcut?: string;
|
|
279
|
-
icon?: ReactNode;
|
|
280
|
-
items?: MenuItem<T>[];
|
|
281
|
-
}
|
|
282
|
-
interface MenuProps<T extends string> {
|
|
283
|
-
children: ReactNode;
|
|
284
|
-
items: MenuItem<T>[];
|
|
285
|
-
onSelect: (value: T) => void;
|
|
286
|
-
isNested?: boolean;
|
|
287
|
-
shouldBindKeyboardShortcuts?: boolean;
|
|
288
|
-
onOpenChange?: (open: boolean) => void;
|
|
289
|
-
}
|
|
290
|
-
declare const ContextMenu: <T extends string>(props: MenuProps<T>) => React__default.ReactElement | null;
|
|
291
|
-
|
|
292
|
-
declare const StyledContent: styled_components_dist_types.IStyledComponentBase<"web", styled_components.FastOmit<DialogPrimitive.DialogContentProps & React__default.RefAttributes<HTMLDivElement>, never>> & string & Omit<React__default.ForwardRefExoticComponent<DialogPrimitive.DialogContentProps & React__default.RefAttributes<HTMLDivElement>>, keyof React__default.Component<any, {}, any>>;
|
|
293
|
-
declare const CloseButtonContainer: styled_components_dist_types.IStyledComponentBase<"web", styled_components.FastOmit<React__default.DetailedHTMLProps<React__default.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
|
|
294
|
-
interface IDialog {
|
|
295
|
-
containsElement: (element: HTMLElement) => boolean;
|
|
296
|
-
}
|
|
297
|
-
interface Props$h {
|
|
298
|
-
title?: ReactNode;
|
|
299
|
-
description?: ReactNode;
|
|
300
|
-
children?: ReactNode;
|
|
301
|
-
style?: ComponentProps<typeof StyledContent>["style"];
|
|
302
|
-
open: ComponentProps<typeof DialogPrimitive.Root>["open"];
|
|
303
|
-
onOpenChange?: ComponentProps<typeof DialogPrimitive.Root>["onOpenChange"];
|
|
304
|
-
onOpenAutoFocus?: ComponentProps<typeof DialogPrimitive.Content>["onOpenAutoFocus"];
|
|
305
|
-
closeOnInteractOutside?: boolean;
|
|
306
|
-
}
|
|
307
|
-
declare const Dialog: (props: Props$h & React__default.RefAttributes<IDialog>) => React__default.ReactElement | null;
|
|
308
|
-
declare const FullscreenDialog: (props: Props$h & React__default.RefAttributes<IDialog>) => React__default.ReactElement | null;
|
|
309
|
-
|
|
310
|
-
type DividerVariant = "normal" | "strong" | "subtle";
|
|
311
|
-
interface DividerProps {
|
|
312
|
-
variant?: DividerVariant;
|
|
313
|
-
overflow?: number;
|
|
314
|
-
}
|
|
315
|
-
declare const Divider: (props: DividerProps) => React__default.ReactElement | null;
|
|
316
|
-
declare const DividerVertical: (props: DividerProps) => React__default.ReactElement | null;
|
|
317
|
-
|
|
318
|
-
/**
|
|
319
|
-
* A button that opens a menu when clicked, but also allows dragging the
|
|
320
|
-
*/
|
|
321
|
-
declare const DraggableMenuButton: <T extends string>(props: {
|
|
322
|
-
items?: MenuItem<T>[];
|
|
323
|
-
onSelect?: (value: T) => void;
|
|
324
|
-
isVisible?: boolean;
|
|
325
|
-
}) => React__default.ReactElement | null;
|
|
326
|
-
|
|
327
|
-
declare const DropdownMenu: <T extends string>(props: MenuProps<T> & {
|
|
328
|
-
open?: boolean;
|
|
329
|
-
onCloseAutoFocus?: React__default.EventHandler<SyntheticEvent<unknown>>;
|
|
330
|
-
} & Pick<RadixDropdownMenu.DropdownMenuContentProps & React__default.RefAttributes<HTMLDivElement>, "align" | "side" | "sideOffset" | "alignOffset" | "collisionPadding"> & React__default.RefAttributes<HTMLElement>) => React__default.ReactElement | null;
|
|
331
|
-
|
|
332
|
-
declare const SUPPORTED_IMAGE_UPLOAD_TYPES: ("image/png" | "image/jpeg" | "image/webp" | "image/svg+xml" | "application/pdf")[];
|
|
333
|
-
declare const SUPPORTED_CANVAS_UPLOAD_TYPES: ("" | "image/png" | "image/jpeg" | "image/webp" | "image/svg+xml" | "application/pdf")[];
|
|
334
|
-
type SupportedImageUploadType = (typeof SUPPORTED_IMAGE_UPLOAD_TYPES)[number];
|
|
335
|
-
type SupportedCanvasUploadType = (typeof SUPPORTED_CANVAS_UPLOAD_TYPES)[number];
|
|
336
|
-
type SketchPattern = {
|
|
337
|
-
_class: 'pattern';
|
|
338
|
-
image?: Sketch.FileRef | Sketch.DataRef;
|
|
339
|
-
patternFillType: Sketch.PatternFillType;
|
|
340
|
-
patternTileScale: number;
|
|
341
|
-
};
|
|
342
|
-
|
|
343
|
-
interface Props$g {
|
|
344
|
-
id?: string;
|
|
345
|
-
value?: Sketch.Color | Sketch.Gradient | SketchPattern;
|
|
346
|
-
flex?: CSSProperties["flex"];
|
|
347
|
-
}
|
|
348
|
-
declare const FillInputField: (props: Props$g & React__default.RefAttributes<HTMLButtonElement>) => React__default.ReactElement | null;
|
|
349
|
-
|
|
350
|
-
declare const PatternPreviewBackground: (props: {
|
|
351
|
-
fillType: Sketch.PatternFillType;
|
|
352
|
-
tileScale: number;
|
|
353
|
-
imageRef: string;
|
|
354
|
-
}) => React__default.ReactElement | null;
|
|
355
|
-
interface Props$f {
|
|
356
|
-
value?: Sketch.Color | Sketch.Gradient | SketchPattern;
|
|
357
|
-
}
|
|
358
|
-
declare const FillPreviewBackground: (props: Props$f) => React__default.ReactElement | null;
|
|
359
|
-
|
|
360
|
-
interface FloatingWindowProps {
|
|
361
|
-
title?: string;
|
|
362
|
-
onClose?: () => void;
|
|
363
|
-
children: React__default.ReactNode;
|
|
364
|
-
initialWidth?: number;
|
|
365
|
-
initialHeight?: number;
|
|
366
|
-
initialX?: number;
|
|
367
|
-
initialY?: number;
|
|
368
|
-
minWidth?: number;
|
|
369
|
-
minHeight?: number;
|
|
370
|
-
toolbarContent?: React__default.ReactNode;
|
|
371
|
-
renderToolbar?: (props: {
|
|
372
|
-
title?: string;
|
|
373
|
-
toolbarContent?: React__default.ReactNode;
|
|
374
|
-
onClose?: () => void;
|
|
375
|
-
}) => React__default.ReactNode;
|
|
376
|
-
}
|
|
377
|
-
declare const FloatingWindow: React__default.FC<FloatingWindowProps>;
|
|
378
|
-
|
|
379
|
-
interface Props$e {
|
|
380
|
-
value: Sketch.GradientStop[];
|
|
381
|
-
selectedStop: number;
|
|
382
|
-
onChangeColor: (color: Sketch.Color) => void;
|
|
383
|
-
onChangePosition: (position: number) => void;
|
|
384
|
-
onAdd: (color: Sketch.Color, position: number) => void;
|
|
385
|
-
onDelete: () => void;
|
|
386
|
-
onSelectStop: (index: number) => void;
|
|
387
|
-
}
|
|
388
|
-
declare const GradientPicker: (props: Props$e) => React__default.ReactElement | null;
|
|
389
|
-
|
|
390
|
-
type GridProps = {
|
|
391
|
-
columns?: string;
|
|
392
|
-
rows?: string;
|
|
393
|
-
alignItems?: 'start' | 'center' | 'end';
|
|
394
|
-
justifyItems?: 'start' | 'center' | 'end';
|
|
395
|
-
placeItems?: 'start' | 'center' | 'end';
|
|
396
|
-
width?: number | string;
|
|
397
|
-
minWidth?: number | string;
|
|
398
|
-
maxWidth?: number | string;
|
|
399
|
-
height?: number | string;
|
|
400
|
-
minHeight?: number | string;
|
|
401
|
-
maxHeight?: number | string;
|
|
402
|
-
padding?: number | string;
|
|
403
|
-
paddingX?: number | string;
|
|
404
|
-
paddingXStart?: number | string;
|
|
405
|
-
paddingXEnd?: number | string;
|
|
406
|
-
paddingY?: number | string;
|
|
407
|
-
paddingYStart?: number | string;
|
|
408
|
-
paddingYEnd?: number | string;
|
|
409
|
-
gap?: number | string;
|
|
410
|
-
gapX?: number | string;
|
|
411
|
-
gapY?: number | string;
|
|
412
|
-
background?: keyof Colors;
|
|
413
|
-
};
|
|
414
|
-
|
|
415
|
-
type GridViewSize = "xxs" | "xs" | "small" | "medium" | "large" | "xl";
|
|
416
|
-
interface ItemProps$2<MenuItemType extends string = string> {
|
|
417
|
-
id: string;
|
|
418
|
-
title?: ReactNode;
|
|
419
|
-
subtitle?: ReactNode;
|
|
420
|
-
loading?: boolean;
|
|
421
|
-
selected?: boolean;
|
|
422
|
-
onClick?: (event: React__default.MouseEvent) => void;
|
|
423
|
-
onPress?: (options: KeyModifiers) => void;
|
|
424
|
-
onDoubleClick?: () => void;
|
|
425
|
-
onHoverChange?: (isHovering: boolean) => void;
|
|
426
|
-
children?: ReactNode;
|
|
427
|
-
menuItems?: MenuItem<MenuItemType>[];
|
|
428
|
-
onSelectMenuItem?: (value: MenuItemType) => void;
|
|
429
|
-
onContextMenu?: () => void;
|
|
430
|
-
style?: CSSProperties;
|
|
431
|
-
}
|
|
432
|
-
type GridViewContextValue = {
|
|
433
|
-
size: GridViewSize;
|
|
434
|
-
textPosition: "overlay" | "below" | "toolip";
|
|
435
|
-
bordered: boolean;
|
|
436
|
-
disabled: boolean;
|
|
437
|
-
};
|
|
438
|
-
interface GridViewRootProps extends Partial<GridViewContextValue> {
|
|
439
|
-
children: ReactNode;
|
|
440
|
-
onClick?: () => void;
|
|
441
|
-
scrollable?: boolean;
|
|
442
|
-
}
|
|
443
|
-
declare namespace GridView {
|
|
444
|
-
const Root: (props: GridViewRootProps) => React__default.ReactElement | null;
|
|
445
|
-
const Item: <MenuItemType extends string>(props: ItemProps$2<MenuItemType> & React__default.RefAttributes<HTMLDivElement>) => React__default.ReactElement | null;
|
|
446
|
-
const Section: (props: {
|
|
447
|
-
children?: ReactNode;
|
|
448
|
-
padding?: CSSProperties["padding"];
|
|
449
|
-
}) => React__default.ReactElement | null;
|
|
450
|
-
const SectionHeader: (props: {
|
|
451
|
-
title: string;
|
|
452
|
-
}) => React__default.ReactElement | null;
|
|
453
|
-
}
|
|
454
|
-
|
|
455
|
-
declare const IconButton: (props: Omit<ButtonRootProps, "children" | "size" | "flex" | "variant"> & {
|
|
456
|
-
iconName: IconName;
|
|
457
|
-
className?: string;
|
|
458
|
-
style?: CSSProperties;
|
|
459
|
-
selected?: boolean;
|
|
460
|
-
color?: string;
|
|
461
|
-
size?: number;
|
|
462
|
-
} & React__default.RefAttributes<HTMLButtonElement>) => React__default.ReactElement | null;
|
|
463
|
-
|
|
464
|
-
type Props$d = {
|
|
465
|
-
id?: string;
|
|
466
|
-
style?: any;
|
|
467
|
-
className?: string;
|
|
468
|
-
type?: "text" | "search";
|
|
469
|
-
disabled?: boolean;
|
|
470
|
-
value: string;
|
|
471
|
-
placeholder?: string;
|
|
472
|
-
role?: AriaRole;
|
|
473
|
-
name?: HTMLInputElement["name"];
|
|
474
|
-
onKeyDown?: KeyboardEventHandler;
|
|
475
|
-
onClick?: MouseEventHandler;
|
|
476
|
-
onDoubleClick?: MouseEventHandler;
|
|
477
|
-
onPointerDown?: PointerEventHandler;
|
|
478
|
-
onFocusCapture?: FocusEventHandler;
|
|
479
|
-
onFocusChange?: (isFocused: boolean) => void;
|
|
480
|
-
onBlur?: FocusEventHandler;
|
|
481
|
-
} & Pick<InputHTMLAttributes<HTMLInputElement>, "autoComplete" | "autoCapitalize" | "autoCorrect" | "spellCheck" | "autoFocus">;
|
|
482
|
-
type ReadOnlyProps = Props$d & {
|
|
483
|
-
readOnly: true;
|
|
484
|
-
};
|
|
485
|
-
type ControlledProps = Props$d & {
|
|
486
|
-
onChange: (value: string) => void;
|
|
487
|
-
};
|
|
488
|
-
type SubmittableProps = Props$d & {
|
|
489
|
-
onSubmit: (value: string) => void;
|
|
490
|
-
allowSubmittingWithSameValue?: boolean;
|
|
491
|
-
submitAutomaticallyAfterDelay?: number;
|
|
492
|
-
};
|
|
493
|
-
type TextInputProps = ReadOnlyProps | ControlledProps | SubmittableProps;
|
|
494
|
-
|
|
495
|
-
type LabelPosition = "start" | "end";
|
|
496
|
-
type InputFieldSize = "small" | "medium" | "large";
|
|
497
|
-
interface InputFieldLabelProps {
|
|
498
|
-
children?: ReactNode;
|
|
499
|
-
pointerEvents?: Property.PointerEvents;
|
|
500
|
-
style?: React__default.CSSProperties;
|
|
501
|
-
}
|
|
502
|
-
interface InputFieldDropdownProps<T extends string> {
|
|
503
|
-
id?: string;
|
|
504
|
-
items: MenuItem<T>[];
|
|
505
|
-
onSelect: (value: T) => void;
|
|
506
|
-
children?: ReactNode;
|
|
507
|
-
}
|
|
508
|
-
type InputFieldVariant = "normal" | "bare";
|
|
509
|
-
declare const InputElement: styled_components_dist_types.IStyledComponentBase<"web", styled_components_dist_types.Substitute<(TextInputProps & React__default.RefAttributes<HTMLInputElement>) & styled_components_dist_types.BaseObject, {
|
|
510
|
-
disabled?: boolean;
|
|
511
|
-
readOnly?: boolean;
|
|
512
|
-
$labelPosition: LabelPosition;
|
|
513
|
-
$labelSize?: number;
|
|
514
|
-
$hasDropdown: boolean;
|
|
515
|
-
$textAlign?: Property.TextAlign;
|
|
516
|
-
$variant?: InputFieldVariant;
|
|
517
|
-
$size: InputFieldSize;
|
|
518
|
-
}>> & string & Omit<(props: TextInputProps & React__default.RefAttributes<HTMLInputElement>) => React__default.ReactElement | null, keyof React__default.Component<any, {}, any>>;
|
|
519
|
-
type InputFieldNumberInputProps = Omit<TextInputProps, "value" | "onChange" | "onKeyDown" | "onSubmit"> & {
|
|
520
|
-
value: number | undefined;
|
|
521
|
-
onNudge?: (value: number) => void;
|
|
522
|
-
variant?: "bare";
|
|
523
|
-
} & ({
|
|
524
|
-
onChange: (value: number) => void;
|
|
525
|
-
} | {
|
|
526
|
-
onSubmit: (value: number) => void;
|
|
527
|
-
});
|
|
528
|
-
interface InputFieldRootProps {
|
|
529
|
-
id?: string;
|
|
530
|
-
flex?: string;
|
|
531
|
-
children?: ReactNode;
|
|
532
|
-
width?: number;
|
|
533
|
-
/** @default end */
|
|
534
|
-
labelPosition?: LabelPosition;
|
|
535
|
-
labelSize?: number;
|
|
536
|
-
hasDropdown?: boolean;
|
|
537
|
-
/** @default medium */
|
|
538
|
-
size?: InputFieldSize;
|
|
539
|
-
renderPopoverContent?: (options: {
|
|
540
|
-
width: number;
|
|
541
|
-
}) => ReactNode;
|
|
542
|
-
onFocusChange?: (isFocused: boolean) => void;
|
|
543
|
-
style?: React__default.CSSProperties;
|
|
544
|
-
className?: string;
|
|
545
|
-
}
|
|
546
|
-
declare namespace InputField {
|
|
547
|
-
const Root: (props: InputFieldRootProps) => React__default.ReactElement | null;
|
|
548
|
-
const Input: (props: (TextInputProps & {
|
|
549
|
-
textAlign?: Property.TextAlign;
|
|
550
|
-
variant?: "bare";
|
|
551
|
-
}) & React__default.RefAttributes<HTMLInputElement>) => React__default.ReactElement | null;
|
|
552
|
-
const Typeahead: (props: {
|
|
553
|
-
prefix: string;
|
|
554
|
-
value: string;
|
|
555
|
-
}) => React__default.ReactElement | null;
|
|
556
|
-
const NumberInput: (props: InputFieldNumberInputProps) => React__default.ReactElement | null;
|
|
557
|
-
const DropdownMenu: <T extends string>(props: InputFieldDropdownProps<T>) => React__default.ReactElement | null;
|
|
558
|
-
const Button: (props: {
|
|
559
|
-
children?: ReactNode;
|
|
560
|
-
onClick?: () => void;
|
|
561
|
-
} & React__default.RefAttributes<HTMLButtonElement>) => React__default.ReactElement | null;
|
|
562
|
-
const Label: (props: InputFieldLabelProps & React__default.RefAttributes<HTMLLabelElement>) => React__default.ReactElement | null;
|
|
563
|
-
const PrimitiveElement: styled_components_dist_types.IStyledComponentBase<"web", styled_components.FastOmit<React__default.DetailedHTMLProps<React__default.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, never>> & string;
|
|
564
|
-
}
|
|
565
|
-
|
|
566
|
-
declare function fuzzyScore({ item, query }: {
|
|
567
|
-
item: string;
|
|
568
|
-
query: string;
|
|
569
|
-
}): IItemScore;
|
|
570
|
-
type IScoredItem = IItemScore & {
|
|
571
|
-
index: number;
|
|
572
|
-
};
|
|
573
|
-
declare function fuzzyFilter({ items, query, scoreThreshold, }: {
|
|
574
|
-
items: string[];
|
|
575
|
-
query: string;
|
|
576
|
-
scoreThreshold?: number;
|
|
577
|
-
}): IScoredItem[];
|
|
578
|
-
type IToken = {
|
|
579
|
-
type: 'text';
|
|
580
|
-
text: string;
|
|
581
|
-
} | {
|
|
582
|
-
type: 'match';
|
|
583
|
-
text: string;
|
|
584
|
-
};
|
|
585
|
-
type MatchRange = {
|
|
586
|
-
start: number;
|
|
587
|
-
end: number;
|
|
588
|
-
};
|
|
589
|
-
declare function fuzzyTokenize({ item, itemScore, }: {
|
|
590
|
-
item: string;
|
|
591
|
-
itemScore: IItemScore;
|
|
592
|
-
}): IToken[];
|
|
593
|
-
|
|
594
|
-
type CompletionItem = {
|
|
595
|
-
type?: undefined;
|
|
596
|
-
id: string;
|
|
597
|
-
name: string;
|
|
598
|
-
icon?: ReactNode;
|
|
599
|
-
alwaysInclude?: boolean;
|
|
600
|
-
};
|
|
601
|
-
type CompletionSectionHeader = {
|
|
602
|
-
type: 'sectionHeader';
|
|
603
|
-
id: string;
|
|
604
|
-
name: string;
|
|
605
|
-
maxVisibleItems?: number;
|
|
606
|
-
};
|
|
607
|
-
type CompletionListItem = (CompletionItem & IScoredItem) | CompletionSectionHeader;
|
|
608
|
-
|
|
609
|
-
type RelativeDropPosition = "above" | "below" | "inside";
|
|
610
|
-
type DropValidator = (sourceIndex: number, destinationIndex: number, position: RelativeDropPosition) => boolean;
|
|
611
|
-
declare const normalizeListDestinationIndex: (index: number, position: "above" | "below") => number;
|
|
612
|
-
type UseSortableReturnType = ReturnType<typeof useSortable>;
|
|
613
|
-
interface ItemProps$1<T> {
|
|
614
|
-
id: string;
|
|
615
|
-
disabled?: boolean;
|
|
616
|
-
children: (props: {
|
|
617
|
-
ref: Ref<T>;
|
|
618
|
-
relativeDropPosition?: RelativeDropPosition;
|
|
619
|
-
[key: string]: any;
|
|
620
|
-
} & UseSortableReturnType["attributes"]) => JSX.Element;
|
|
621
|
-
}
|
|
622
|
-
interface RootProps {
|
|
623
|
-
keys: string[];
|
|
624
|
-
children: ReactNode;
|
|
625
|
-
renderOverlay?: (index: number) => ReactNode;
|
|
626
|
-
onMoveItem?: (sourceIndex: number, destinationIndex: number, position: RelativeDropPosition) => void;
|
|
627
|
-
acceptsDrop?: DropValidator;
|
|
628
|
-
axis?: "x" | "y";
|
|
629
|
-
}
|
|
630
|
-
declare namespace Sortable {
|
|
631
|
-
const Item: <T extends HTMLElement>(props: ItemProps$1<T>) => React__default.ReactElement | null;
|
|
632
|
-
const Root: (props: RootProps) => React__default.ReactElement | null;
|
|
633
|
-
}
|
|
634
|
-
|
|
635
|
-
type ListRowMarginType = "none" | "top" | "bottom" | "vertical";
|
|
636
|
-
type ListRowPosition = "only" | "first" | "middle" | "last";
|
|
637
|
-
type ListColorScheme = "primary" | "secondary";
|
|
638
|
-
type PressEventName = "onClick" | "onPointerDown";
|
|
639
|
-
type ListRowContextValue = {
|
|
640
|
-
marginType: ListRowMarginType;
|
|
641
|
-
selectedPosition: ListRowPosition;
|
|
642
|
-
sortable: boolean;
|
|
643
|
-
expandable: boolean;
|
|
644
|
-
divider: boolean;
|
|
645
|
-
gap: number;
|
|
646
|
-
variant: ListViewVariant;
|
|
647
|
-
sectionHeaderVariant: ListViewSectionHeaderVariant;
|
|
648
|
-
pressEventName: PressEventName;
|
|
649
|
-
isSectionHeader: boolean;
|
|
650
|
-
colorScheme: ListColorScheme;
|
|
651
|
-
};
|
|
652
|
-
interface EditableRowProps {
|
|
653
|
-
value: string;
|
|
654
|
-
onSubmitEditing: (value: string) => void;
|
|
655
|
-
autoFocus: boolean;
|
|
656
|
-
placeholder?: string;
|
|
657
|
-
}
|
|
658
|
-
interface ListViewClickInfo {
|
|
659
|
-
shiftKey: boolean;
|
|
660
|
-
altKey: boolean;
|
|
661
|
-
metaKey: boolean;
|
|
662
|
-
ctrlKey: boolean;
|
|
663
|
-
}
|
|
664
|
-
interface ListViewRowProps<MenuItemType extends string = string> {
|
|
665
|
-
id?: string;
|
|
666
|
-
tabIndex?: number;
|
|
667
|
-
selected?: boolean;
|
|
668
|
-
/** @default 0 */
|
|
669
|
-
depth?: number;
|
|
670
|
-
disabled?: boolean;
|
|
671
|
-
hovered?: boolean;
|
|
672
|
-
sortable?: boolean;
|
|
673
|
-
gap?: number;
|
|
674
|
-
backgroundColor?: CSSProperties["backgroundColor"];
|
|
675
|
-
onPress?: (info: ListViewClickInfo) => void;
|
|
676
|
-
onDoubleClick?: () => void;
|
|
677
|
-
onHoverChange?: (isHovering: boolean) => void;
|
|
678
|
-
children?: ReactNode;
|
|
679
|
-
isSectionHeader?: boolean;
|
|
680
|
-
menuItems?: MenuItem<MenuItemType>[];
|
|
681
|
-
onSelectMenuItem?: (value: MenuItemType) => void;
|
|
682
|
-
onContextMenu?: () => void;
|
|
683
|
-
onMenuOpenChange?: (isOpen: boolean) => void;
|
|
684
|
-
onKeyDown?: (event: React__default.KeyboardEvent) => void;
|
|
685
|
-
style?: CSSProperties;
|
|
686
|
-
className?: string;
|
|
687
|
-
dragIndicatorStyle?: CSSProperties | ((props: {
|
|
688
|
-
depth: number;
|
|
689
|
-
indentation: number;
|
|
690
|
-
position: RelativeDropPosition;
|
|
691
|
-
}) => CSSProperties);
|
|
692
|
-
}
|
|
693
|
-
interface IVirtualizedList {
|
|
694
|
-
scrollToIndex(index: number): void;
|
|
695
|
-
}
|
|
696
|
-
type ListViewItemInfo = {
|
|
697
|
-
isDragging: boolean;
|
|
698
|
-
};
|
|
699
|
-
type ChildrenProps = {
|
|
700
|
-
children: ReactNode;
|
|
701
|
-
};
|
|
702
|
-
type RenderProps<T> = {
|
|
703
|
-
data: T[];
|
|
704
|
-
renderItem: (item: T, index: number, info: ListViewItemInfo) => ReactNode;
|
|
705
|
-
keyExtractor: (item: T, index: number) => string;
|
|
706
|
-
/**
|
|
707
|
-
* Each item must have an `id` in order to be sortable.
|
|
708
|
-
*
|
|
709
|
-
* Additionally, the key extracted with `keyExtractor` must match the ListItem.Row `id`.
|
|
710
|
-
*/
|
|
711
|
-
sortable?: boolean;
|
|
712
|
-
virtualized?: Size;
|
|
713
|
-
};
|
|
714
|
-
type ListViewVariant = "normal" | "padded" | "bare";
|
|
715
|
-
type ListViewSectionHeaderVariant = "normal" | "label";
|
|
716
|
-
type ListViewRootProps = {
|
|
717
|
-
id?: string;
|
|
718
|
-
className?: string;
|
|
719
|
-
style?: CSSProperties;
|
|
720
|
-
onPress?: () => void;
|
|
721
|
-
scrollable?: boolean;
|
|
722
|
-
expandable?: boolean;
|
|
723
|
-
onMoveItem?: (sourceIndex: number, destinationIndex: number, position: RelativeDropPosition) => void;
|
|
724
|
-
indentation?: number;
|
|
725
|
-
acceptsDrop?: DropValidator;
|
|
726
|
-
pressEventName?: PressEventName;
|
|
727
|
-
variant?: ListViewVariant;
|
|
728
|
-
sectionHeaderVariant?: ListViewSectionHeaderVariant;
|
|
729
|
-
divider?: boolean;
|
|
730
|
-
gap?: number;
|
|
731
|
-
colorScheme?: ListColorScheme;
|
|
732
|
-
};
|
|
733
|
-
declare namespace ListView {
|
|
734
|
-
const RowTitle: (props: styled_components.FastOmit<React__default.DetailedHTMLProps<React__default.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>) => React__default.ReactElement | null;
|
|
735
|
-
const EditableRowTitle: (props: EditableRowProps) => React__default.ReactElement | null;
|
|
736
|
-
const Row: <MenuItemType extends string>(props: ListViewRowProps<MenuItemType> & React__default.RefAttributes<HTMLElement>) => React__default.ReactElement | null;
|
|
737
|
-
const Root: <T = any>(props: ((ChildrenProps | RenderProps<T>) & ListViewRootProps) & React__default.RefAttributes<IVirtualizedList>) => React__default.ReactElement | null;
|
|
738
|
-
const RowContext: React__default.Context<ListRowContextValue>;
|
|
739
|
-
type ClickInfo = ListViewClickInfo;
|
|
740
|
-
type ItemInfo = ListViewItemInfo;
|
|
741
|
-
type RowProps<MenuItemType extends string = string> = ListViewRowProps<MenuItemType>;
|
|
742
|
-
type VirtualizedList = IVirtualizedList;
|
|
743
|
-
const DragIndicator: styled_components_dist_types.IStyledComponentBase<"web", styled_components_dist_types.Substitute<React__default.DetailedHTMLProps<React__default.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
|
|
744
|
-
$relativeDropPosition: RelativeDropPosition;
|
|
745
|
-
$gap: number;
|
|
746
|
-
$offsetLeft: number;
|
|
747
|
-
$colorScheme: ListColorScheme;
|
|
748
|
-
}>> & string;
|
|
749
|
-
const rowHeight = 31;
|
|
750
|
-
const sectionHeaderLabelHeight = 27;
|
|
751
|
-
const calculateHeight: (items: number, headerCount: number, headerVariant: ListViewSectionHeaderVariant) => number;
|
|
752
|
-
const normalizeDestinationIndex: (index: number, position: "above" | "below") => number;
|
|
753
|
-
}
|
|
754
|
-
|
|
755
|
-
declare const CompletionToken: styled_components_dist_types.IStyledComponentBase<"web", styled_components_dist_types.Substitute<React__default.DetailedHTMLProps<React__default.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {
|
|
756
|
-
$type: IToken["type"];
|
|
757
|
-
}>> & string;
|
|
758
|
-
interface CompletionMenuProps {
|
|
759
|
-
items: CompletionListItem[];
|
|
760
|
-
selectedIndex: number;
|
|
761
|
-
onSelectItem: (item: CompletionListItem) => void;
|
|
762
|
-
onHoverIndex: (index: number) => void;
|
|
763
|
-
listSize: Size;
|
|
764
|
-
}
|
|
765
|
-
declare const CompletionMenu: (props: CompletionMenuProps & React__default.RefAttributes<IVirtualizedList>) => React__default.ReactElement | null;
|
|
766
|
-
type Props$c = {
|
|
767
|
-
loading?: boolean;
|
|
768
|
-
initialValue?: string;
|
|
769
|
-
placeholder?: string;
|
|
770
|
-
items: (CompletionItem | CompletionSectionHeader)[];
|
|
771
|
-
onChange?: (value: string) => void;
|
|
772
|
-
onHoverItem?: (item: CompletionItem | undefined) => void;
|
|
773
|
-
onSelectItem?: (item: CompletionItem) => void;
|
|
774
|
-
onFocus?: (event: React__default.FocusEvent<HTMLInputElement>) => void;
|
|
775
|
-
onBlur?: (didSubmit: boolean, value: string) => void;
|
|
776
|
-
onDeleteWhenEmpty?: () => void;
|
|
777
|
-
size?: InputFieldSize;
|
|
778
|
-
style?: React__default.CSSProperties;
|
|
779
|
-
className?: string;
|
|
780
|
-
children?: React__default.ReactNode;
|
|
781
|
-
hideChildrenWhenFocused?: boolean;
|
|
782
|
-
hideMenuWhenEmptyValue?: boolean;
|
|
783
|
-
};
|
|
784
|
-
interface IInputFieldWithCompletions {
|
|
785
|
-
focus(): void;
|
|
786
|
-
setValue(value: string): void;
|
|
787
|
-
selectAllInputText(): void;
|
|
788
|
-
}
|
|
789
|
-
declare const InputFieldWithCompletions: (props: Props$c & React__default.RefAttributes<IInputFieldWithCompletions>) => React__default.ReactElement | null;
|
|
790
|
-
|
|
791
|
-
declare const InspectorContainer: (props: {
|
|
792
|
-
header?: React__default.ReactNode;
|
|
793
|
-
children?: React__default.ReactNode;
|
|
794
|
-
fallback?: React__default.ReactNode;
|
|
795
|
-
showDividers?: boolean;
|
|
796
|
-
id?: string;
|
|
797
|
-
className?: string;
|
|
798
|
-
style?: React__default.CSSProperties;
|
|
799
|
-
} & React__default.RefAttributes<HTMLDivElement>) => React__default.ReactElement | null;
|
|
800
|
-
|
|
801
|
-
interface LabelRootProps {
|
|
802
|
-
label: ReactNode;
|
|
803
|
-
children: ReactNode;
|
|
804
|
-
}
|
|
805
|
-
declare namespace Label {
|
|
806
|
-
const Label: (props: styled_components_dist_types.Substitute<React__default.DetailedHTMLProps<React__default.LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, {
|
|
807
|
-
$selected?: boolean;
|
|
808
|
-
}>) => React__default.ReactElement | null;
|
|
809
|
-
const Root: (props: LabelRootProps) => React__default.ReactElement | null;
|
|
810
|
-
}
|
|
811
|
-
|
|
812
|
-
interface ContainerProps {
|
|
813
|
-
children: ReactNode;
|
|
814
|
-
renderLabel: (provided: {
|
|
815
|
-
id: string;
|
|
816
|
-
index: number;
|
|
817
|
-
}) => ReactNode;
|
|
818
|
-
}
|
|
819
|
-
declare const LabeledElementView: (props: ContainerProps) => React__default.ReactElement | null;
|
|
820
|
-
|
|
821
|
-
type PopoverVariant = "normal" | "large";
|
|
822
|
-
interface Props$b extends Pick<ComponentProps<(typeof PopoverPrimitive)["Content"]>, "onOpenAutoFocus" | "onCloseAutoFocus" | "onPointerDownOutside" | "onInteractOutside" | "onFocusOutside" | "side"> {
|
|
823
|
-
children: React__default.ReactNode;
|
|
824
|
-
trigger: React__default.ReactNode;
|
|
825
|
-
variant?: PopoverVariant;
|
|
826
|
-
closable?: boolean;
|
|
827
|
-
open?: boolean;
|
|
828
|
-
onOpenChange?: (open: boolean) => void;
|
|
829
|
-
sideOffset?: number;
|
|
830
|
-
onClickClose?: () => void;
|
|
831
|
-
showArrow?: boolean;
|
|
832
|
-
}
|
|
833
|
-
declare function Popover({ children, trigger, variant, closable, open, side, sideOffset, showArrow, onOpenChange, onOpenAutoFocus, onCloseAutoFocus, onPointerDownOutside, onInteractOutside, onFocusOutside, onClickClose, }: Props$b): React__default.JSX.Element;
|
|
834
|
-
|
|
835
|
-
type ProgressVariant = 'normal' | 'warning' | 'primary' | 'secondary';
|
|
836
|
-
declare function Progress({ value, width, height, flex, variant, }: {
|
|
837
|
-
value: number;
|
|
838
|
-
height?: CSSProperties['height'];
|
|
839
|
-
width?: CSSProperties['width'];
|
|
840
|
-
flex?: CSSProperties['flex'];
|
|
841
|
-
variant?: ProgressVariant;
|
|
842
|
-
}): React__default.JSX.Element;
|
|
843
|
-
|
|
844
|
-
type RadioGroupColorScheme = "primary" | "secondary";
|
|
845
|
-
interface ItemProps {
|
|
846
|
-
value: string;
|
|
847
|
-
tooltip?: ReactNode;
|
|
848
|
-
children: ReactNode;
|
|
849
|
-
disabled?: boolean;
|
|
850
|
-
}
|
|
851
|
-
interface Props$a {
|
|
852
|
-
id?: string;
|
|
853
|
-
value?: string;
|
|
854
|
-
onValueChange?: (value: string) => void;
|
|
855
|
-
/** @default primary */
|
|
856
|
-
colorScheme?: RadioGroupColorScheme;
|
|
857
|
-
allowEmpty?: boolean;
|
|
858
|
-
children: ReactNode;
|
|
859
|
-
}
|
|
860
|
-
declare namespace RadioGroup {
|
|
861
|
-
const Root: (props: Props$a) => React__default.ReactElement | null;
|
|
862
|
-
const Item: (props: ItemProps & React__default.RefAttributes<HTMLButtonElement>) => React__default.ReactElement | null;
|
|
863
|
-
}
|
|
864
|
-
|
|
865
|
-
interface Props$9 {
|
|
866
|
-
children?: ReactNode | ((scrollElementRef: HTMLDivElement) => ReactNode);
|
|
867
|
-
}
|
|
868
|
-
declare const ScrollArea: (props: Props$9) => React__default.ReactElement | null;
|
|
869
|
-
|
|
870
|
-
type Props$8<T extends string> = {
|
|
871
|
-
id?: string;
|
|
872
|
-
style?: React__default.CSSProperties;
|
|
873
|
-
className?: string;
|
|
874
|
-
menuItems: MenuItem<T>[];
|
|
875
|
-
value: T;
|
|
876
|
-
onSelect?: (value: T) => void;
|
|
877
|
-
placeholder?: string;
|
|
878
|
-
disabled?: boolean;
|
|
879
|
-
readOnly?: boolean;
|
|
880
|
-
label?: React__default.ReactNode;
|
|
881
|
-
} & Pick<SelectProps, "open">;
|
|
882
|
-
declare const SelectMenu: <T extends string = string>(props: Props$8<T>) => React__default.ReactElement | null;
|
|
883
|
-
|
|
884
|
-
interface Props$7 {
|
|
885
|
-
id?: string;
|
|
886
|
-
value: number;
|
|
887
|
-
onValueChange: (value: number) => void;
|
|
888
|
-
min: number;
|
|
889
|
-
max: number;
|
|
890
|
-
}
|
|
891
|
-
declare const Slider: ({ id, value, onValueChange, min, max, }: Props$7) => React__default.JSX.Element;
|
|
892
|
-
|
|
893
|
-
interface Props$6 {
|
|
894
|
-
size?: number | string;
|
|
895
|
-
inline?: boolean;
|
|
896
|
-
}
|
|
897
|
-
declare namespace Spacer {
|
|
898
|
-
const Vertical: (props: Props$6 & React__default.RefAttributes<HTMLSpanElement>) => React__default.ReactElement | null;
|
|
899
|
-
const Horizontal: (props: Props$6 & React__default.RefAttributes<HTMLSpanElement>) => React__default.ReactElement | null;
|
|
900
|
-
}
|
|
901
|
-
|
|
902
|
-
type BreakpointKey = number | string;
|
|
903
|
-
type Breakpoint<T extends object> = [BreakpointKey, T];
|
|
904
|
-
type BreakpointCollection<T extends object> = Breakpoint<T>[] | Record<BreakpointKey, T>;
|
|
905
|
-
|
|
906
|
-
declare function withSeparatorElements(elements: ReactNode, separator: ReactNode | (() => ReactNode)): (string | number | React$1.ReactElement<any, string | React$1.JSXElementConstructor<any>> | Iterable<ReactNode> | React$1.ReactPortal)[];
|
|
907
|
-
|
|
908
|
-
interface StyleProps$1 {
|
|
909
|
-
display?: CSSProperties["display"];
|
|
910
|
-
visibility?: CSSProperties["visibility"];
|
|
911
|
-
position?: CSSProperties["position"];
|
|
912
|
-
zIndex?: CSSProperties["zIndex"];
|
|
913
|
-
gap?: CSSProperties["gap"];
|
|
914
|
-
inset?: CSSProperties["inset"];
|
|
915
|
-
top?: CSSProperties["top"];
|
|
916
|
-
right?: CSSProperties["right"];
|
|
917
|
-
bottom?: CSSProperties["bottom"];
|
|
918
|
-
left?: CSSProperties["left"];
|
|
919
|
-
flexDirection?: CSSProperties["flexDirection"];
|
|
920
|
-
justifyContent?: CSSProperties["justifyContent"];
|
|
921
|
-
alignItems?: CSSProperties["alignItems"];
|
|
922
|
-
alignSelf?: CSSProperties["alignSelf"];
|
|
923
|
-
flex?: CSSProperties["flex"];
|
|
924
|
-
flexWrap?: CSSProperties["flexWrap"];
|
|
925
|
-
height?: CSSProperties["height"];
|
|
926
|
-
minHeight?: CSSProperties["minHeight"];
|
|
927
|
-
maxHeight?: CSSProperties["maxHeight"];
|
|
928
|
-
width?: CSSProperties["width"];
|
|
929
|
-
minWidth?: CSSProperties["minWidth"];
|
|
930
|
-
maxWidth?: CSSProperties["maxWidth"];
|
|
931
|
-
aspectRatio?: CSSProperties["aspectRatio"];
|
|
932
|
-
padding?: CSSProperties["padding"];
|
|
933
|
-
paddingVertical?: string | number;
|
|
934
|
-
paddingHorizontal?: string | number;
|
|
935
|
-
margin?: CSSProperties["margin"];
|
|
936
|
-
background?: CSSProperties["background"];
|
|
937
|
-
backgroundSize?: CSSProperties["backgroundSize"];
|
|
938
|
-
backgroundPosition?: CSSProperties["backgroundPosition"];
|
|
939
|
-
borderRadius?: CSSProperties["borderRadius"];
|
|
940
|
-
overflowX?: CSSProperties["overflowX"];
|
|
941
|
-
overflowY?: CSSProperties["overflowY"];
|
|
942
|
-
overflow?: CSSProperties["overflow"];
|
|
943
|
-
textOverflow?: CSSProperties["textOverflow"];
|
|
944
|
-
boxShadow?: CSSProperties["boxShadow"];
|
|
945
|
-
outline?: CSSProperties["outline"];
|
|
946
|
-
border?: CSSProperties["border"];
|
|
947
|
-
borderTop?: CSSProperties["borderTop"];
|
|
948
|
-
borderRight?: CSSProperties["borderRight"];
|
|
949
|
-
borderBottom?: CSSProperties["borderBottom"];
|
|
950
|
-
borderLeft?: CSSProperties["borderLeft"];
|
|
951
|
-
cursor?: CSSProperties["cursor"];
|
|
952
|
-
userSelect?: CSSProperties["userSelect"];
|
|
953
|
-
transition?: CSSProperties["transition"];
|
|
954
|
-
opacity?: CSSProperties["opacity"];
|
|
955
|
-
filter?: CSSProperties["filter"];
|
|
956
|
-
color?: CSSProperties["color"];
|
|
957
|
-
order?: CSSProperties["order"];
|
|
958
|
-
pointerEvents?: CSSProperties["pointerEvents"];
|
|
959
|
-
lineHeight?: CSSProperties["lineHeight"];
|
|
960
|
-
isolation?: CSSProperties["isolation"];
|
|
961
|
-
backdropFilter?: CSSProperties["backdropFilter"];
|
|
962
|
-
}
|
|
963
|
-
type StackBreakpointList = BreakpointCollection<StyleProps$1>;
|
|
964
|
-
interface Props$5 extends StyleProps$1 {
|
|
965
|
-
id?: string;
|
|
966
|
-
as?: keyof ReactHTML;
|
|
967
|
-
className?: string;
|
|
968
|
-
children?: ReactNode;
|
|
969
|
-
separator?: Parameters<typeof withSeparatorElements>[1];
|
|
970
|
-
breakpoints?: StackBreakpointList | null | false;
|
|
971
|
-
href?: string;
|
|
972
|
-
tabIndex?: number;
|
|
973
|
-
style?: StyleProps$1;
|
|
974
|
-
}
|
|
975
|
-
type StackProps = Omit<Props$5, "flexDirection">;
|
|
976
|
-
declare const Stack: {
|
|
977
|
-
V: (props: StackProps & React__default.RefAttributes<HTMLElement>) => React__default.ReactElement | null;
|
|
978
|
-
H: (props: StackProps & React__default.RefAttributes<HTMLElement>) => React__default.ReactElement | null;
|
|
979
|
-
};
|
|
980
|
-
|
|
981
|
-
type SwitchColorScheme = "normal" | "primary" | "secondary";
|
|
982
|
-
interface Props$4 {
|
|
983
|
-
value: boolean;
|
|
984
|
-
onChange: (value: boolean) => void;
|
|
985
|
-
/** @default normal */
|
|
986
|
-
colorScheme?: SwitchColorScheme;
|
|
987
|
-
disabled?: boolean;
|
|
988
|
-
}
|
|
989
|
-
declare const Switch: ({ value, onChange, colorScheme, disabled, }: Props$4) => React__default.JSX.Element;
|
|
990
|
-
|
|
991
|
-
type StyleProps = {
|
|
992
|
-
flex?: CSSProperties$1["flex"];
|
|
993
|
-
padding?: CSSProperties$1["padding"];
|
|
994
|
-
background?: CSSProperties$1["background"];
|
|
995
|
-
borderRadius?: CSSProperties$1["borderRadius"];
|
|
996
|
-
textAlign?: CSSProperties$1["textAlign"];
|
|
997
|
-
fontWeight?: CSSProperties$1["fontWeight"];
|
|
998
|
-
fontStyle?: CSSProperties$1["fontStyle"];
|
|
999
|
-
fontSize?: CSSProperties$1["fontSize"];
|
|
1000
|
-
lineHeight?: CSSProperties$1["lineHeight"];
|
|
1001
|
-
fontFamily?: CSSProperties$1["fontFamily"];
|
|
1002
|
-
wordBreak?: CSSProperties$1["wordBreak"];
|
|
1003
|
-
whiteSpace?: CSSProperties$1["whiteSpace"];
|
|
1004
|
-
height?: CSSProperties$1["height"];
|
|
1005
|
-
width?: CSSProperties$1["width"];
|
|
1006
|
-
minWidth?: CSSProperties$1["minWidth"];
|
|
1007
|
-
maxWidth?: CSSProperties$1["maxWidth"];
|
|
1008
|
-
opacity?: CSSProperties$1["opacity"];
|
|
1009
|
-
position?: CSSProperties$1["position"];
|
|
1010
|
-
overflow?: CSSProperties$1["overflow"];
|
|
1011
|
-
textOverflow?: CSSProperties$1["textOverflow"];
|
|
1012
|
-
textDecoration?: CSSProperties$1["textDecoration"];
|
|
1013
|
-
display?: CSSProperties$1["display"];
|
|
1014
|
-
top?: CSSProperties$1["top"];
|
|
1015
|
-
right?: CSSProperties$1["right"];
|
|
1016
|
-
bottom?: CSSProperties$1["bottom"];
|
|
1017
|
-
left?: CSSProperties$1["left"];
|
|
1018
|
-
userSelect?: CSSProperties$1["userSelect"];
|
|
1019
|
-
cursor?: CSSProperties$1["cursor"];
|
|
1020
|
-
};
|
|
1021
|
-
type TextBreakpointList = BreakpointCollection<StyleProps>;
|
|
1022
|
-
interface Props$3 extends StyleProps {
|
|
1023
|
-
as?: keyof ReactHTML;
|
|
1024
|
-
href?: string;
|
|
1025
|
-
className?: string;
|
|
1026
|
-
style?: React__default.CSSProperties;
|
|
1027
|
-
variant: keyof Theme["textStyles"];
|
|
1028
|
-
breakpoints?: BreakpointCollection<StyleProps> | null | false;
|
|
1029
|
-
color?: ThemeColorName;
|
|
1030
|
-
children: ReactNode;
|
|
1031
|
-
onClick?: () => void;
|
|
1032
|
-
onDoubleClick?: () => void;
|
|
1033
|
-
onKeyDown?: (event: React__default.KeyboardEvent<HTMLSpanElement>) => void;
|
|
1034
|
-
tabIndex?: number;
|
|
1035
|
-
}
|
|
1036
|
-
declare const Text$1: (props: Props$3 & React__default.RefAttributes<HTMLElement>) => React__default.ReactElement | null;
|
|
1037
|
-
type PresetProps = Omit<Props$3, "variant">;
|
|
1038
|
-
declare const Heading1: (props: PresetProps & React__default.RefAttributes<HTMLElement>) => React__default.ReactElement | null;
|
|
1039
|
-
declare const Heading2: (props: PresetProps & React__default.RefAttributes<HTMLElement>) => React__default.ReactElement | null;
|
|
1040
|
-
declare const Heading3: (props: PresetProps & React__default.RefAttributes<HTMLElement>) => React__default.ReactElement | null;
|
|
1041
|
-
declare const Heading4: (props: PresetProps & React__default.RefAttributes<HTMLElement>) => React__default.ReactElement | null;
|
|
1042
|
-
declare const Heading5: (props: PresetProps & React__default.RefAttributes<HTMLElement>) => React__default.ReactElement | null;
|
|
1043
|
-
declare const Body: (props: PresetProps & React__default.RefAttributes<HTMLElement>) => React__default.ReactElement | null;
|
|
1044
|
-
declare const Small: (props: PresetProps & React__default.RefAttributes<HTMLElement>) => React__default.ReactElement | null;
|
|
1045
|
-
declare const Italic: ({ children }: {
|
|
1046
|
-
children: ReactNode;
|
|
1047
|
-
}) => React__default.JSX.Element;
|
|
1048
|
-
|
|
1049
|
-
declare const useAutoResize: (value: string) => React__default.MutableRefObject<HTMLTextAreaElement | null>;
|
|
1050
|
-
declare const AutoResizingTextArea: (props: Omit<styled_components.FastOmit<React__default.DetailedHTMLProps<React__default.TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, never>, "onChange" | "value"> & {
|
|
1051
|
-
onChangeText: (value: string) => void;
|
|
1052
|
-
value?: string;
|
|
1053
|
-
} & React__default.RefAttributes<HTMLTextAreaElement>) => React__default.ReactElement | null;
|
|
1054
|
-
|
|
1055
|
-
declare const Toast: ({ title, content, children, ...props }: {
|
|
1056
|
-
title?: string;
|
|
1057
|
-
content: ReactNode;
|
|
1058
|
-
children?: React__default.ReactNode;
|
|
1059
|
-
}) => React__default.JSX.Element;
|
|
1060
|
-
declare const ToastProvider: ({ children }: {
|
|
1061
|
-
children: React__default.ReactNode;
|
|
1062
|
-
}) => React__default.JSX.Element;
|
|
1063
|
-
|
|
1064
|
-
interface Props$2 {
|
|
1065
|
-
children: ReactNode;
|
|
1066
|
-
content: ReactNode;
|
|
1067
|
-
}
|
|
1068
|
-
declare const Tooltip: (props: Props$2) => React__default.ReactElement | null;
|
|
1069
|
-
|
|
1070
|
-
type TreeRowBaseProps = {
|
|
1071
|
-
icon?: Exclude<ReactNode, string> | IconName;
|
|
1072
|
-
expanded?: boolean;
|
|
1073
|
-
onClickChevron?: ({ altKey }: {
|
|
1074
|
-
altKey: boolean;
|
|
1075
|
-
}) => void;
|
|
1076
|
-
};
|
|
1077
|
-
type TreeViewRowProps<MenuItemType extends string> = ListView.RowProps<MenuItemType> & TreeRowBaseProps;
|
|
1078
|
-
declare namespace TreeView {
|
|
1079
|
-
const Root: <T = any>(props: (({
|
|
1080
|
-
children: ReactNode;
|
|
1081
|
-
} | {
|
|
1082
|
-
data: T[];
|
|
1083
|
-
renderItem: (item: T, index: number, info: {
|
|
1084
|
-
isDragging: boolean;
|
|
1085
|
-
}) => ReactNode;
|
|
1086
|
-
keyExtractor: (item: T, index: number) => string;
|
|
1087
|
-
sortable?: boolean;
|
|
1088
|
-
virtualized?: _noya_app_noya_geometry.Size;
|
|
1089
|
-
}) & {
|
|
1090
|
-
id?: string;
|
|
1091
|
-
className?: string;
|
|
1092
|
-
style?: React__default.CSSProperties;
|
|
1093
|
-
onPress?: () => void;
|
|
1094
|
-
scrollable?: boolean;
|
|
1095
|
-
expandable?: boolean;
|
|
1096
|
-
onMoveItem?: (sourceIndex: number, destinationIndex: number, position: RelativeDropPosition) => void;
|
|
1097
|
-
indentation?: number;
|
|
1098
|
-
acceptsDrop?: DropValidator;
|
|
1099
|
-
pressEventName?: "onClick" | "onPointerDown";
|
|
1100
|
-
variant?: "normal" | "bare" | "padded";
|
|
1101
|
-
sectionHeaderVariant?: "label" | "normal";
|
|
1102
|
-
divider?: boolean;
|
|
1103
|
-
gap?: number;
|
|
1104
|
-
colorScheme?: "primary" | "secondary";
|
|
1105
|
-
}) & React__default.RefAttributes<IVirtualizedList>) => React__default.ReactElement | null;
|
|
1106
|
-
const RowTitle: (props: styled_components.FastOmit<React__default.DetailedHTMLProps<React__default.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>) => React__default.ReactElement | null;
|
|
1107
|
-
const EditableRowTitle: (props: EditableRowProps) => React__default.ReactElement | null;
|
|
1108
|
-
const Row: <MenuItemType extends string>(props: ListView.RowProps<MenuItemType> & TreeRowBaseProps & React__default.RefAttributes<HTMLLIElement>) => React__default.ReactElement | null;
|
|
1109
|
-
type ClickInfo = ListView.ClickInfo;
|
|
1110
|
-
type RowProps<MenuItemType extends string> = TreeViewRowProps<MenuItemType>;
|
|
1111
|
-
}
|
|
1112
|
-
|
|
1113
|
-
declare const EDITOR_PANEL_GROUP_ID = "editor-panel-group";
|
|
1114
|
-
declare const LEFT_SIDEBAR_ID = "editor-left-sidebar";
|
|
1115
|
-
declare const RIGHT_SIDEBAR_ID = "editor-right-sidebar";
|
|
1116
|
-
declare const CONTENT_AREA_ID = "editor-content-area";
|
|
1117
|
-
type PanelLayoutState = {
|
|
1118
|
-
leftSidebarCollapsed: boolean;
|
|
1119
|
-
rightSidebarCollapsed: boolean;
|
|
1120
|
-
};
|
|
1121
|
-
declare function usePreservePanelSize(panelGroupRef: React__default.RefObject<ImperativePanelGroupHandle | null>, setPanelLayoutState?: (state: PanelLayoutState) => void): void;
|
|
1122
|
-
|
|
1123
|
-
interface Props$1 {
|
|
1124
|
-
autoSavePrefix?: string;
|
|
1125
|
-
leftSidebarContent?: React__default.ReactNode;
|
|
1126
|
-
children?: React__default.ReactNode;
|
|
1127
|
-
rightSidebarContent?: React__default.ReactNode;
|
|
1128
|
-
hasRightSidebar?: boolean;
|
|
1129
|
-
hasLeftSidebar?: boolean;
|
|
1130
|
-
onChangeLayoutState?: (layoutState: PanelLayoutState) => void;
|
|
1131
|
-
leftSidebarCanResize?: boolean;
|
|
1132
|
-
id?: string;
|
|
1133
|
-
className?: string;
|
|
1134
|
-
style?: React__default.CSSProperties;
|
|
1135
|
-
/**
|
|
1136
|
-
* Accepts a number (px) or % string (e.g. "50%").
|
|
1137
|
-
* Use % to avoid flicker server-rendering.
|
|
1138
|
-
*/
|
|
1139
|
-
leftSidebarInitialSize?: number | string;
|
|
1140
|
-
leftSidebarMinSize?: number | string;
|
|
1141
|
-
/**
|
|
1142
|
-
* Accepts a number (px) or % string (e.g. "50%").
|
|
1143
|
-
* Use % to avoid flicker server-rendering.
|
|
1144
|
-
*/
|
|
1145
|
-
rightSidebarInitialSize?: number | string;
|
|
1146
|
-
rightSidebarMinSize?: number | string;
|
|
1147
|
-
}
|
|
1148
|
-
type IWorkspaceLayout = {
|
|
1149
|
-
setLeftSidebarExpanded: (expanded: boolean) => void;
|
|
1150
|
-
setRightSidebarExpanded: (expanded: boolean) => void;
|
|
1151
|
-
toggleAllSidebars: () => void;
|
|
1152
|
-
toggleLeftSidebar: () => void;
|
|
1153
|
-
toggleRightSidebar: () => void;
|
|
1154
|
-
};
|
|
1155
|
-
declare const WorkspaceLayout: (props: Props$1 & React__default.RefAttributes<IWorkspaceLayout>) => React__default.ReactElement | null;
|
|
1156
|
-
|
|
1157
|
-
declare const DesignSystemThemeProvider: (props: {
|
|
1158
|
-
children: ReactNode;
|
|
1159
|
-
theme?: Theme;
|
|
1160
|
-
}) => React__default.ReactElement | null;
|
|
1161
|
-
type DesignSystemConfigurationContextValue = {
|
|
1162
|
-
platform: PlatformName;
|
|
1163
|
-
};
|
|
1164
|
-
declare const DesignSystemConfigurationProvider: (props: {
|
|
1165
|
-
children: ReactNode;
|
|
1166
|
-
theme?: Theme | "light" | "dark";
|
|
1167
|
-
platform?: PlatformName;
|
|
1168
|
-
}) => React__default.ReactElement | null;
|
|
1169
|
-
declare function useDesignSystemConfiguration(): DesignSystemConfigurationContextValue;
|
|
1170
|
-
declare function useDesignSystemTheme(): styled_components.DefaultTheme;
|
|
1171
|
-
|
|
1172
|
-
declare const Row$1: styled_components_dist_types.IStyledComponentBase<"web", styled_components.FastOmit<React__default.DetailedHTMLProps<React__default.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
|
|
1173
|
-
type DialogContextValue = {
|
|
1174
|
-
openInputDialog(title: string, inputValue?: string): Promise<string | undefined>;
|
|
1175
|
-
containsElement(element: HTMLElement): boolean;
|
|
1176
|
-
};
|
|
1177
|
-
declare const DialogProvider: ({ children, }: {
|
|
1178
|
-
children: ReactNode;
|
|
1179
|
-
}) => React__default.JSX.Element;
|
|
1180
|
-
declare function useOpenInputDialog(): (title: string, inputValue?: string) => Promise<string | undefined>;
|
|
1181
|
-
declare function useDialogContainsElement(): (element: HTMLElement) => boolean;
|
|
1182
|
-
|
|
1183
|
-
type FloatingWindowContextValue = {
|
|
1184
|
-
createWindow: (element: React__default.ReactNode) => string;
|
|
1185
|
-
closeWindow: (id: string) => void;
|
|
1186
|
-
};
|
|
1187
|
-
type CurrentWindowContextValue = {
|
|
1188
|
-
id: string;
|
|
1189
|
-
};
|
|
1190
|
-
declare const FloatingWindowProvider: ({ children, }: {
|
|
1191
|
-
children: React__default.ReactNode;
|
|
1192
|
-
}) => React__default.JSX.Element;
|
|
1193
|
-
declare const useFloatingWindowManager: () => FloatingWindowContextValue;
|
|
1194
|
-
declare const useCurrentFloatingWindowInternal: () => CurrentWindowContextValue;
|
|
1195
|
-
|
|
1196
|
-
type ImageDataContextValue = {
|
|
1197
|
-
getImageData: (ref: string) => ArrayBuffer | undefined;
|
|
1198
|
-
};
|
|
1199
|
-
declare const ImageDataProvider: (props: {
|
|
1200
|
-
children: ReactNode;
|
|
1201
|
-
getImageData?: (ref: string) => ArrayBuffer | undefined;
|
|
1202
|
-
}) => React__default.ReactElement | null;
|
|
1203
|
-
declare function useImageData(ref: string): ArrayBuffer | undefined;
|
|
1204
|
-
|
|
1205
|
-
type GlobalInputBlurContextValue = {
|
|
1206
|
-
addListener: (f: () => void) => void;
|
|
1207
|
-
removeListener: (f: () => void) => void;
|
|
1208
|
-
trigger: () => void;
|
|
1209
|
-
};
|
|
1210
|
-
declare const GlobalInputBlurProvider: React$1.Provider<GlobalInputBlurContextValue>;
|
|
1211
|
-
/**
|
|
1212
|
-
* Some components store their editable state internally.
|
|
1213
|
-
* We trigger this event before selection changes so that they can commit their
|
|
1214
|
-
* edits before they unmount. This is more manual but simpler than doing so during
|
|
1215
|
-
* the unmount phase (e.g. the return function of `useEffect`), since handlers are
|
|
1216
|
-
* guaranteed to be called with the current data.
|
|
1217
|
-
*/
|
|
1218
|
-
declare const useGlobalInputBlur: () => GlobalInputBlurContextValue;
|
|
1219
|
-
declare function useGlobalInputBlurListener(f: () => void): void;
|
|
1220
|
-
declare function useGlobalInputBlurTrigger(): () => void;
|
|
1221
|
-
|
|
1222
|
-
interface HoverEvent {
|
|
1223
|
-
/** The type of hover event being fired. */
|
|
1224
|
-
type: 'hoverstart' | 'hoverend';
|
|
1225
|
-
/** The pointer type that triggered the hover event. */
|
|
1226
|
-
pointerType: 'mouse' | 'pen';
|
|
1227
|
-
/** The target element of the hover event. */
|
|
1228
|
-
target: HTMLElement;
|
|
1229
|
-
}
|
|
1230
|
-
interface HoverEvents {
|
|
1231
|
-
/** Handler that is called when a hover interaction starts. */
|
|
1232
|
-
onHoverStart?(e: HoverEvent): void;
|
|
1233
|
-
/** Handler that is called when a hover interaction ends. */
|
|
1234
|
-
onHoverEnd?(e: HoverEvent): void;
|
|
1235
|
-
/** Handler that is called when the hover state changes. */
|
|
1236
|
-
onHoverChange?(isHovering: boolean): void;
|
|
1237
|
-
}
|
|
1238
|
-
interface HoverProps extends HoverEvents {
|
|
1239
|
-
/** Whether the hover events should be disabled. */
|
|
1240
|
-
isDisabled?: boolean;
|
|
1241
|
-
}
|
|
1242
|
-
interface HoverResult {
|
|
1243
|
-
/** Props to spread on the target element. */
|
|
1244
|
-
hoverProps: React$1.HTMLAttributes<HTMLElement>;
|
|
1245
|
-
isHovered: boolean;
|
|
1246
|
-
}
|
|
1247
|
-
/**
|
|
1248
|
-
* Handles pointer hover interactions for an element. Normalizes behavior
|
|
1249
|
-
* across browsers and platforms, and ignores emulated mouse events on touch devices.
|
|
1250
|
-
*/
|
|
1251
|
-
declare function useHover(props?: HoverProps): HoverResult;
|
|
1252
|
-
|
|
1253
|
-
declare function usePlatform(): _noya_app_noya_keymap.PlatformName;
|
|
1254
|
-
/**
|
|
1255
|
-
* Either ctrl or meta, depending on the platform
|
|
1256
|
-
*/
|
|
1257
|
-
declare function usePlatformModKey(): 'ctrlKey' | 'metaKey';
|
|
1258
|
-
|
|
1259
|
-
declare const size: {
|
|
1260
|
-
medium: string;
|
|
1261
|
-
large: string;
|
|
1262
|
-
xlarge: string;
|
|
1263
|
-
xxlarge: string;
|
|
1264
|
-
};
|
|
1265
|
-
declare const mediaQuery: {
|
|
1266
|
-
small: string;
|
|
1267
|
-
medium: string;
|
|
1268
|
-
large: string;
|
|
1269
|
-
xlarge: string;
|
|
1270
|
-
};
|
|
1271
|
-
|
|
1272
|
-
declare const name: string;
|
|
1273
|
-
declare const colors: {
|
|
1274
|
-
logo: {
|
|
1275
|
-
fill: string;
|
|
1276
|
-
highlight: string;
|
|
1277
|
-
};
|
|
1278
|
-
background: string;
|
|
1279
|
-
text: string;
|
|
1280
|
-
textMuted: string;
|
|
1281
|
-
textSubtle: string;
|
|
1282
|
-
textDisabled: string;
|
|
1283
|
-
textDecorativeLight: string;
|
|
1284
|
-
dividerSubtle: string;
|
|
1285
|
-
divider: string;
|
|
1286
|
-
dividerStrong: string;
|
|
1287
|
-
primary: string;
|
|
1288
|
-
primaryLight: string;
|
|
1289
|
-
primaryPastel: string;
|
|
1290
|
-
secondary: string;
|
|
1291
|
-
secondaryLight: string;
|
|
1292
|
-
secondaryPastel: string;
|
|
1293
|
-
secondaryBright: string;
|
|
1294
|
-
warning: string;
|
|
1295
|
-
neutralBackground: string;
|
|
1296
|
-
inputBackground: string;
|
|
1297
|
-
inputBackgroundLight: string;
|
|
1298
|
-
codeBackground: string;
|
|
1299
|
-
codeBackgroundLight: string;
|
|
1300
|
-
readonly codeBackgroundDark: string;
|
|
1301
|
-
codeBackgroundDecorativeDark: string;
|
|
1302
|
-
selectedBackground: string;
|
|
1303
|
-
transparentChecker: string;
|
|
1304
|
-
activeBackground: string;
|
|
1305
|
-
scrollbar: string;
|
|
1306
|
-
placeholderDots: string;
|
|
1307
|
-
breadcrumb: {
|
|
1308
|
-
readonly text: string;
|
|
1309
|
-
readonly textHover: string;
|
|
1310
|
-
readonly icon: string;
|
|
1311
|
-
};
|
|
1312
|
-
listView: {
|
|
1313
|
-
raisedBackground: string;
|
|
1314
|
-
editingBackground: string;
|
|
1315
|
-
};
|
|
1316
|
-
canvas: {
|
|
1317
|
-
background: string;
|
|
1318
|
-
readonly selectionStroke: string;
|
|
1319
|
-
dragHandleStroke: string;
|
|
1320
|
-
measurement: string;
|
|
1321
|
-
sliceOutline: string;
|
|
1322
|
-
grid: string;
|
|
1323
|
-
};
|
|
1324
|
-
sidebar: {
|
|
1325
|
-
background: string;
|
|
1326
|
-
backgroundTransparent: string;
|
|
1327
|
-
};
|
|
1328
|
-
popover: {
|
|
1329
|
-
background: string;
|
|
1330
|
-
divider: string;
|
|
1331
|
-
};
|
|
1332
|
-
slider: {
|
|
1333
|
-
background: string;
|
|
1334
|
-
border: string;
|
|
1335
|
-
};
|
|
1336
|
-
radioGroup: {
|
|
1337
|
-
background: string;
|
|
1338
|
-
};
|
|
1339
|
-
icon: string;
|
|
1340
|
-
iconSelected: string;
|
|
1341
|
-
mask: string;
|
|
1342
|
-
imageOverlay: string;
|
|
1343
|
-
readonly dragOutline: string;
|
|
1344
|
-
selection: string;
|
|
1345
|
-
thumbnailBackground: string;
|
|
1346
|
-
thumbnailShadow: string;
|
|
1347
|
-
inlineCode: {
|
|
1348
|
-
text: string;
|
|
1349
|
-
background: string;
|
|
1350
|
-
};
|
|
1351
|
-
textLink: string;
|
|
1352
|
-
textLinkFocused: string;
|
|
1353
|
-
};
|
|
1354
|
-
|
|
1355
|
-
declare const dark_colors: typeof colors;
|
|
1356
|
-
declare const dark_fonts: typeof fonts;
|
|
1357
|
-
declare const dark_name: typeof name;
|
|
1358
|
-
declare const dark_sizes: typeof sizes;
|
|
1359
|
-
declare const dark_textStyles: typeof textStyles;
|
|
1360
|
-
declare namespace dark {
|
|
1361
|
-
export { dark_colors as colors, dark_fonts as fonts, dark_name as name, dark_sizes as sizes, dark_textStyles as textStyles };
|
|
1362
|
-
}
|
|
1363
|
-
|
|
1364
|
-
type Optional<T> = T | false | null | undefined;
|
|
1365
|
-
type MenuConfig<T extends string> = Optional<Optional<RegularMenuItem<T>>[]>[];
|
|
1366
|
-
declare function createSectionedMenu<T extends string>(...sections: MenuConfig<T>): MenuItem<T>[];
|
|
1367
|
-
|
|
1368
|
-
declare function getGradientBackground(value: Sketch.GradientStop[], type: Sketch.GradientType, direction?: number): string;
|
|
1369
|
-
|
|
1370
|
-
declare function sketchColorToRgba(value: Sketch.Color): RgbaColor;
|
|
1371
|
-
declare function sketchColorToRgbaString(value: Sketch.Color): string;
|
|
1372
|
-
declare function rgbaToSketchColor(value: RgbaColor): Sketch.Color;
|
|
1373
|
-
declare function sketchColorToHex(value: Sketch.Color): string;
|
|
1374
|
-
|
|
1375
|
-
type SetNumberMode = "replace" | "adjust";
|
|
1376
|
-
declare function getNewValue(value: number, mode: SetNumberMode, delta?: number): number;
|
|
1377
|
-
type DimensionValue = number | undefined;
|
|
1378
|
-
interface Props {
|
|
1379
|
-
id?: string;
|
|
1380
|
-
value: DimensionValue;
|
|
1381
|
-
onSetValue: (value: number, mode: SetNumberMode) => void;
|
|
1382
|
-
label?: string;
|
|
1383
|
-
size?: number;
|
|
1384
|
-
placeholder?: string;
|
|
1385
|
-
disabled?: boolean;
|
|
1386
|
-
trigger?: "change" | "submit";
|
|
1387
|
-
}
|
|
1388
|
-
declare const DimensionInput: (props: Props) => React__default.ReactElement | null;
|
|
1389
|
-
|
|
1390
|
-
declare const Section: styled_components_dist_types.IStyledComponentBase<"web", styled_components_dist_types.Substitute<React__default.DetailedHTMLProps<React__default.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
|
|
1391
|
-
$padding?: CSSProperties["padding"];
|
|
1392
|
-
$gap?: CSSProperties["gap"];
|
|
1393
|
-
}>> & string;
|
|
1394
|
-
declare const SectionHeader: styled_components_dist_types.IStyledComponentBase<"web", styled_components.FastOmit<React__default.DetailedHTMLProps<React__default.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
|
|
1395
|
-
declare const Title: styled_components_dist_types.IStyledComponentBase<"web", styled_components_dist_types.Substitute<React__default.DetailedHTMLProps<React__default.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
|
|
1396
|
-
$textStyle?: "small" | "heading5" | "heading4" | "heading3";
|
|
1397
|
-
}>> & string;
|
|
1398
|
-
declare const Row: styled_components_dist_types.IStyledComponentBase<"web", styled_components_dist_types.Substitute<React__default.DetailedHTMLProps<React__default.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
|
|
1399
|
-
$gap?: CSSProperties["gap"];
|
|
1400
|
-
}>> & string;
|
|
1401
|
-
declare const Column: styled_components_dist_types.IStyledComponentBase<"web", styled_components.FastOmit<React__default.DetailedHTMLProps<React__default.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
|
|
1402
|
-
declare const Checkbox: styled_components_dist_types.IStyledComponentBase<"web", styled_components.FastOmit<React__default.DetailedHTMLProps<React__default.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, never>> & string;
|
|
1403
|
-
declare const Text: styled_components_dist_types.IStyledComponentBase<"web", styled_components.FastOmit<React__default.DetailedHTMLProps<React__default.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>> & string;
|
|
1404
|
-
declare const VerticalSeparator: () => React__default.JSX.Element;
|
|
1405
|
-
declare const HorizontalSeparator: () => React__default.JSX.Element;
|
|
1406
|
-
declare const RowLabel: styled_components_dist_types.IStyledComponentBase<"web", styled_components_dist_types.Substitute<React__default.DetailedHTMLProps<React__default.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {
|
|
1407
|
-
$textStyle?: "small" | "heading5" | "heading4" | "heading3";
|
|
1408
|
-
}>> & string;
|
|
1409
|
-
declare const LabeledRow: (props: {
|
|
1410
|
-
id?: string;
|
|
1411
|
-
children: ReactNode;
|
|
1412
|
-
label: ReactNode;
|
|
1413
|
-
labelTextStyle?: "small" | "heading5" | "heading4" | "heading3";
|
|
1414
|
-
gap?: CSSProperties["gap"];
|
|
1415
|
-
right?: ReactNode;
|
|
1416
|
-
}) => React__default.ReactElement | null;
|
|
1417
|
-
declare const LabeledSliderRow: (props: {
|
|
1418
|
-
children: ReactNode;
|
|
1419
|
-
label: string;
|
|
1420
|
-
}) => React__default.ReactElement | null;
|
|
1421
|
-
|
|
1422
|
-
declare const InspectorPrimitives_Checkbox: typeof Checkbox;
|
|
1423
|
-
declare const InspectorPrimitives_Column: typeof Column;
|
|
1424
|
-
declare const InspectorPrimitives_HorizontalSeparator: typeof HorizontalSeparator;
|
|
1425
|
-
declare const InspectorPrimitives_LabeledRow: typeof LabeledRow;
|
|
1426
|
-
declare const InspectorPrimitives_LabeledSliderRow: typeof LabeledSliderRow;
|
|
1427
|
-
declare const InspectorPrimitives_Row: typeof Row;
|
|
1428
|
-
declare const InspectorPrimitives_RowLabel: typeof RowLabel;
|
|
1429
|
-
declare const InspectorPrimitives_Section: typeof Section;
|
|
1430
|
-
declare const InspectorPrimitives_SectionHeader: typeof SectionHeader;
|
|
1431
|
-
declare const InspectorPrimitives_Text: typeof Text;
|
|
1432
|
-
declare const InspectorPrimitives_Title: typeof Title;
|
|
1433
|
-
declare const InspectorPrimitives_VerticalSeparator: typeof VerticalSeparator;
|
|
1434
|
-
declare namespace InspectorPrimitives {
|
|
1435
|
-
export { InspectorPrimitives_Checkbox as Checkbox, InspectorPrimitives_Column as Column, InspectorPrimitives_HorizontalSeparator as HorizontalSeparator, InspectorPrimitives_LabeledRow as LabeledRow, InspectorPrimitives_LabeledSliderRow as LabeledSliderRow, InspectorPrimitives_Row as Row, InspectorPrimitives_RowLabel as RowLabel, InspectorPrimitives_Section as Section, InspectorPrimitives_SectionHeader as SectionHeader, InspectorPrimitives_Text as Text, InspectorPrimitives_Title as Title, InspectorPrimitives_VerticalSeparator as VerticalSeparator };
|
|
1436
|
-
}
|
|
1437
|
-
|
|
1438
|
-
declare module "react" {
|
|
1439
|
-
function memo<A, B>(Component: (props: A) => B): (props: A) => React.ReactElement | null;
|
|
1440
|
-
function forwardRef<T, P = {}>(render: (props: P, ref: React.ForwardedRef<T>) => React.ReactElement | null): (props: P & React.RefAttributes<T>) => React.ReactElement | null;
|
|
1441
|
-
}
|
|
1442
|
-
|
|
1443
|
-
export { ActivityIndicator, AutoResizingTextArea, Avatar, AvatarStack, Body, Button, ButtonElement, type ButtonRootProps, CONTENT_AREA_ID, Chip, type ChipProps, CloseButtonContainer, type Colors, type CompletionItem, type CompletionListItem, CompletionMenu, type CompletionSectionHeader, CompletionToken, ContextMenu, type DesignSystemConfigurationContextValue, DesignSystemConfigurationProvider, DesignSystemThemeProvider, Dialog, type DialogContextValue, DialogProvider, DimensionInput, type DimensionValue, Divider, DividerVertical, DraggableMenuButton, type DropValidator, DropdownMenu, EDITOR_PANEL_GROUP_ID, type EditableRowProps, type ExtractMenuItemType, FillInputField, FillPreviewBackground, FloatingWindow, FloatingWindowProvider, FullscreenDialog, type GlobalInputBlurContextValue, GlobalInputBlurProvider, GradientPicker, type GridProps, GridView, type GridViewSize, Heading1, Heading2, Heading3, Heading4, Heading5, type HoverEvent, type HoverEvents, type HoverProps, type IDialog, type IInputFieldWithCompletions, type IScoredItem, type IToken, type IVirtualizedList, type IWorkspaceLayout, IconButton, type IconName, type ImageDataContextValue, ImageDataProvider, InputElement, InputField, type InputFieldSize, InputFieldWithCompletions, InspectorContainer, InspectorPrimitives, Italic, KeyboardShortcut, LEFT_SIDEBAR_ID, Label, LabeledElementView, type ListRowMarginType, type ListRowPosition, ListView, type MatchRange, type MenuConfig, type MenuItem, type MenuItemProps, type MenuProps, type Optional, type PanelLayoutState, PatternPreviewBackground, Popover, Progress, RIGHT_SIDEBAR_ID, RadioGroup, type RegularMenuItem, type RelativeDropPosition, Row$1 as Row, SEPARATOR_ITEM, SUPPORTED_CANVAS_UPLOAD_TYPES, SUPPORTED_IMAGE_UPLOAD_TYPES, ScrollArea, SelectMenu, type SetNumberMode, type SketchPattern, Slider, Small, Sortable, Spacer, Stack, type StackBreakpointList, type SupportedCanvasUploadType, type SupportedImageUploadType, Switch, Text$1 as Text, type TextBreakpointList, type Theme, type ThemeColorName, Toast, ToastProvider, Tooltip, TreeView, WorkspaceLayout, createSectionedMenu, dark as darkTheme, fuzzyFilter, fuzzyScore, fuzzyTokenize, getGradientBackground, getNewValue, lightTheme, mediaQuery, normalizeListDestinationIndex, renderIcon, rgbaToSketchColor, size, sketchColorToHex, sketchColorToRgba, sketchColorToRgbaString, useAutoResize, useCurrentFloatingWindowInternal, useDesignSystemConfiguration, useDesignSystemTheme, useDialogContainsElement, useFloatingWindowManager, useGlobalInputBlur, useGlobalInputBlurListener, useGlobalInputBlurTrigger, useHover, useImageData, useOpenInputDialog, usePlatform, usePlatformModKey, usePreservePanelSize, withSeparatorElements };
|