@noya-app/noya-designsystem 0.0.14 → 0.0.16
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/.eslintrc.js +11 -0
- package/.turbo/turbo-build.log +8 -8
- package/.turbo/turbo-lint.log +3 -0
- package/CHANGELOG.md +24 -0
- package/dist/index.d.mts +133 -111
- package/dist/index.d.ts +133 -111
- package/dist/index.js +7832 -646
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +7819 -601
- package/dist/index.mjs.map +1 -1
- package/package.json +8 -7
- package/src/components/Chip.tsx +101 -82
- package/src/components/Dialog.tsx +51 -26
- package/src/components/DraggableMenuButton.tsx +116 -0
- package/src/components/InputField.tsx +196 -132
- package/src/components/InputFieldWithCompletions.tsx +43 -6
- package/src/components/InspectorPrimitives.tsx +1 -1
- package/src/components/ListView.tsx +77 -38
- package/src/components/Select.tsx +2 -0
- package/src/components/Sortable.tsx +45 -36
- package/src/components/Stack.tsx +63 -62
- package/src/components/Switch.tsx +25 -25
- package/src/components/Text.tsx +3 -0
- package/src/contexts/DialogContext.tsx +3 -0
- package/src/index.tsx +3 -2
- package/src/theme/light.ts +1 -1
- package/src/utils/getGradientBackground.tsx +8 -10
package/.eslintrc.js
ADDED
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
/** @type {import("eslint").Linter.Config} */
|
|
2
|
+
module.exports = {
|
|
3
|
+
root: true,
|
|
4
|
+
extends: ["@repo/eslint-config/next.js"],
|
|
5
|
+
parser: "@typescript-eslint/parser",
|
|
6
|
+
rules: {
|
|
7
|
+
"no-unused-vars": "off",
|
|
8
|
+
"no-redeclare": "off",
|
|
9
|
+
},
|
|
10
|
+
ignorePatterns: ["dist/"],
|
|
11
|
+
};
|
package/.turbo/turbo-build.log
CHANGED
|
@@ -6,13 +6,13 @@
|
|
|
6
6
|
[34mCLI[39m Target: esnext
|
|
7
7
|
[34mCJS[39m Build start
|
|
8
8
|
[34mESM[39m Build start
|
|
9
|
-
[
|
|
10
|
-
[
|
|
11
|
-
[
|
|
12
|
-
[
|
|
13
|
-
[
|
|
14
|
-
[
|
|
9
|
+
[32mESM[39m [1mdist/index.mjs [22m[32m1.09 MB[39m
|
|
10
|
+
[32mESM[39m [1mdist/index.mjs.map [22m[32m1.49 MB[39m
|
|
11
|
+
[32mESM[39m ⚡️ Build success in 148ms
|
|
12
|
+
[32mCJS[39m [1mdist/index.js [22m[32m1.10 MB[39m
|
|
13
|
+
[32mCJS[39m [1mdist/index.js.map [22m[32m1.50 MB[39m
|
|
14
|
+
[32mCJS[39m ⚡️ Build success in 149ms
|
|
15
15
|
[34mDTS[39m Build start
|
|
16
16
|
[32mDTS[39m ⚡️ Build success in 5856ms
|
|
17
|
-
[32mDTS[39m [1mdist/index.d.ts [22m[
|
|
18
|
-
[32mDTS[39m [1mdist/index.d.mts [22m[
|
|
17
|
+
[32mDTS[39m [1mdist/index.d.ts [22m[32m55.00 KB[39m
|
|
18
|
+
[32mDTS[39m [1mdist/index.d.mts [22m[32m55.00 KB[39m
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
|
|
2
|
+
[0m[2m[35m$[0m [2m[1meslint . --max-warnings 0[0m
|
|
3
|
+
Pages directory cannot be found at /Users/devinabbott/Projects/noya-core/packages/noya-designsystem/pages or /Users/devinabbott/Projects/noya-core/packages/noya-designsystem/src/pages. If using a custom path, please configure with the `no-html-link-for-pages` rule in your eslint config file.
|
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,29 @@
|
|
|
1
1
|
# @noya-app/noya-designsystem
|
|
2
2
|
|
|
3
|
+
## 0.0.16
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- f974ad5: Update versions
|
|
8
|
+
- Updated dependencies [f974ad5]
|
|
9
|
+
- @noya-app/noya-colorpicker@0.0.10
|
|
10
|
+
- @noya-app/noya-geometry@0.0.14
|
|
11
|
+
- @noya-app/noya-icons@0.0.7
|
|
12
|
+
- @noya-app/noya-keymap@0.0.9
|
|
13
|
+
- @noya-app/noya-utils@0.0.13
|
|
14
|
+
|
|
15
|
+
## 0.0.15
|
|
16
|
+
|
|
17
|
+
### Patch Changes
|
|
18
|
+
|
|
19
|
+
- Bump versions
|
|
20
|
+
- Updated dependencies
|
|
21
|
+
- @noya-app/noya-colorpicker@0.0.9
|
|
22
|
+
- @noya-app/noya-geometry@0.0.13
|
|
23
|
+
- @noya-app/noya-icons@0.0.6
|
|
24
|
+
- @noya-app/noya-keymap@0.0.8
|
|
25
|
+
- @noya-app/noya-utils@0.0.12
|
|
26
|
+
|
|
3
27
|
## 0.0.14
|
|
4
28
|
|
|
5
29
|
### Patch Changes
|
package/dist/index.d.mts
CHANGED
|
@@ -64,9 +64,9 @@ interface ButtonRootProps {
|
|
|
64
64
|
}
|
|
65
65
|
declare const Button: (props: ButtonRootProps & React__default.RefAttributes<HTMLButtonElement>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
|
|
66
66
|
|
|
67
|
-
type ChipColorScheme =
|
|
68
|
-
type ChipSize =
|
|
69
|
-
type ChipVariant =
|
|
67
|
+
type ChipColorScheme = "primary" | "secondary" | "error";
|
|
68
|
+
type ChipSize = "small" | "medium";
|
|
69
|
+
type ChipVariant = "solid" | "outlined" | "ghost";
|
|
70
70
|
interface ChipProps {
|
|
71
71
|
colorScheme?: ChipColorScheme;
|
|
72
72
|
variant?: ChipVariant;
|
|
@@ -258,13 +258,14 @@ interface Props$g {
|
|
|
258
258
|
title?: ReactNode;
|
|
259
259
|
description?: ReactNode;
|
|
260
260
|
children?: ReactNode;
|
|
261
|
-
style?: ComponentProps<typeof StyledContent>[
|
|
262
|
-
open: ComponentProps<typeof DialogPrimitive.Root>[
|
|
263
|
-
onOpenChange?: ComponentProps<typeof DialogPrimitive.Root>[
|
|
264
|
-
onOpenAutoFocus?: ComponentProps<typeof DialogPrimitive.Content>[
|
|
261
|
+
style?: ComponentProps<typeof StyledContent>["style"];
|
|
262
|
+
open: ComponentProps<typeof DialogPrimitive.Root>["open"];
|
|
263
|
+
onOpenChange?: ComponentProps<typeof DialogPrimitive.Root>["onOpenChange"];
|
|
264
|
+
onOpenAutoFocus?: ComponentProps<typeof DialogPrimitive.Content>["onOpenAutoFocus"];
|
|
265
265
|
closeOnInteractOutside?: boolean;
|
|
266
266
|
}
|
|
267
267
|
declare const Dialog: (props: Props$g & React__default.RefAttributes<IDialog>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
|
|
268
|
+
declare const FullscreenDialog: (props: Props$g & React__default.RefAttributes<IDialog>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
|
|
268
269
|
|
|
269
270
|
type DividerVariant = 'normal' | 'strong' | 'subtle';
|
|
270
271
|
interface DividerProps {
|
|
@@ -274,6 +275,15 @@ interface DividerProps {
|
|
|
274
275
|
declare const Divider: (props: DividerProps) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
|
|
275
276
|
declare const DividerVertical: (props: DividerProps) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
|
|
276
277
|
|
|
278
|
+
/**
|
|
279
|
+
* A button that opens a menu when clicked, but also allows dragging the
|
|
280
|
+
*/
|
|
281
|
+
declare const DraggableMenuButton: <T extends string>(props: {
|
|
282
|
+
items: MenuItem<T>[];
|
|
283
|
+
onSelect: (value: T) => void;
|
|
284
|
+
isVisible?: boolean | undefined;
|
|
285
|
+
}) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
|
|
286
|
+
|
|
277
287
|
declare const DropdownMenu: <T extends string>(props: MenuProps<T> & {
|
|
278
288
|
open?: boolean | undefined;
|
|
279
289
|
onCloseAutoFocus?: ((event: React__default.SyntheticEvent<unknown, Event>) => void) | undefined;
|
|
@@ -423,11 +433,12 @@ type SubmittableProps = Props$c & {
|
|
|
423
433
|
};
|
|
424
434
|
type TextInputProps = ReadOnlyProps | ControlledProps | SubmittableProps;
|
|
425
435
|
|
|
426
|
-
type LabelPosition =
|
|
427
|
-
type InputFieldSize =
|
|
436
|
+
type LabelPosition = "start" | "end";
|
|
437
|
+
type InputFieldSize = "small" | "medium" | "large";
|
|
428
438
|
interface InputFieldLabelProps {
|
|
429
439
|
children?: ReactNode;
|
|
430
440
|
pointerEvents?: Property.PointerEvents;
|
|
441
|
+
style?: React__default.CSSProperties;
|
|
431
442
|
}
|
|
432
443
|
interface InputFieldDropdownProps<T extends string> {
|
|
433
444
|
id?: string;
|
|
@@ -435,7 +446,7 @@ interface InputFieldDropdownProps<T extends string> {
|
|
|
435
446
|
onSelect: (value: T) => void;
|
|
436
447
|
children?: ReactNode;
|
|
437
448
|
}
|
|
438
|
-
type InputFieldVariant =
|
|
449
|
+
type InputFieldVariant = "normal" | "bare";
|
|
439
450
|
declare const InputElement: styled_components.StyledComponent<(props: TextInputProps & React__default.RefAttributes<HTMLInputElement>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null, styled_components.DefaultTheme, {
|
|
440
451
|
labelPosition: LabelPosition;
|
|
441
452
|
labelSize: number;
|
|
@@ -447,10 +458,10 @@ declare const InputElement: styled_components.StyledComponent<(props: TextInputP
|
|
|
447
458
|
readOnly?: boolean | undefined;
|
|
448
459
|
size: InputFieldSize;
|
|
449
460
|
}, never>;
|
|
450
|
-
type InputFieldNumberInputProps = Omit<TextInputProps,
|
|
461
|
+
type InputFieldNumberInputProps = Omit<TextInputProps, "value" | "onChange" | "onKeyDown" | "onSubmit"> & {
|
|
451
462
|
value: number | undefined;
|
|
452
463
|
onNudge?: (value: number) => void;
|
|
453
|
-
variant?:
|
|
464
|
+
variant?: "bare";
|
|
454
465
|
} & ({
|
|
455
466
|
onChange: (value: number) => void;
|
|
456
467
|
} | {
|
|
@@ -476,13 +487,16 @@ declare namespace InputField {
|
|
|
476
487
|
textAlign?: Property.TextAlign | undefined;
|
|
477
488
|
variant?: "bare" | undefined;
|
|
478
489
|
}) & React__default.RefAttributes<HTMLInputElement>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
|
|
490
|
+
const Typeahead: (props: {
|
|
491
|
+
value: string;
|
|
492
|
+
}) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
|
|
479
493
|
const NumberInput: (props: InputFieldNumberInputProps) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
|
|
480
494
|
const DropdownMenu: <T extends string>(props: InputFieldDropdownProps<T>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
|
|
481
495
|
const Button: (props: {
|
|
482
496
|
children?: React__default.ReactNode;
|
|
483
497
|
onClick?: (() => void) | undefined;
|
|
484
498
|
}) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
|
|
485
|
-
const Label: (props: InputFieldLabelProps) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
|
|
499
|
+
const Label: (props: InputFieldLabelProps & React__default.RefAttributes<HTMLLabelElement>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
|
|
486
500
|
}
|
|
487
501
|
|
|
488
502
|
declare function fuzzyScore({ item, query }: {
|
|
@@ -528,9 +542,9 @@ type CompletionSectionHeader = {
|
|
|
528
542
|
};
|
|
529
543
|
type CompletionListItem = (CompletionItem & IScoredItem) | CompletionSectionHeader;
|
|
530
544
|
|
|
531
|
-
type RelativeDropPosition =
|
|
545
|
+
type RelativeDropPosition = "above" | "below" | "inside";
|
|
532
546
|
type DropValidator = (sourceIndex: number, destinationIndex: number, position: RelativeDropPosition) => boolean;
|
|
533
|
-
declare const
|
|
547
|
+
declare const normalizeListDestinationIndex: (index: number, position: "above" | "below") => number;
|
|
534
548
|
type UseSortableReturnType = ReturnType<typeof useSortable>;
|
|
535
549
|
interface ItemProps$1<T> {
|
|
536
550
|
id: string;
|
|
@@ -539,7 +553,7 @@ interface ItemProps$1<T> {
|
|
|
539
553
|
ref: Ref<T>;
|
|
540
554
|
relativeDropPosition?: RelativeDropPosition;
|
|
541
555
|
[key: string]: any;
|
|
542
|
-
} & UseSortableReturnType[
|
|
556
|
+
} & UseSortableReturnType["attributes"]) => JSX.Element;
|
|
543
557
|
}
|
|
544
558
|
interface RootProps {
|
|
545
559
|
keys: string[];
|
|
@@ -547,6 +561,7 @@ interface RootProps {
|
|
|
547
561
|
renderOverlay?: (index: number) => ReactNode;
|
|
548
562
|
onMoveItem?: (sourceIndex: number, destinationIndex: number, position: RelativeDropPosition) => void;
|
|
549
563
|
acceptsDrop?: DropValidator;
|
|
564
|
+
axis?: "x" | "y";
|
|
550
565
|
}
|
|
551
566
|
declare namespace Sortable {
|
|
552
567
|
const Item: <T extends HTMLElement>(props: ItemProps$1<T>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
|
|
@@ -566,7 +581,6 @@ type ListRowContextValue = {
|
|
|
566
581
|
gap: number;
|
|
567
582
|
variant: ListViewVariant;
|
|
568
583
|
sectionHeaderVariant: ListViewSectionHeaderVariant;
|
|
569
|
-
indentation: number;
|
|
570
584
|
pressEventName: PressEventName;
|
|
571
585
|
isSectionHeader: boolean;
|
|
572
586
|
colorScheme: ListColorScheme;
|
|
@@ -589,7 +603,6 @@ interface ListViewRowProps<MenuItemType extends string = string> {
|
|
|
589
603
|
selected?: boolean;
|
|
590
604
|
depth?: number;
|
|
591
605
|
disabled?: boolean;
|
|
592
|
-
draggable?: boolean;
|
|
593
606
|
hovered?: boolean;
|
|
594
607
|
sortable?: boolean;
|
|
595
608
|
gap?: number;
|
|
@@ -659,7 +672,7 @@ declare namespace ListView {
|
|
|
659
672
|
const rowHeight = 31;
|
|
660
673
|
const sectionHeaderLabelHeight = 27;
|
|
661
674
|
const calculateHeight: (items: number, headerCount: number, headerVariant: ListViewSectionHeaderVariant) => number;
|
|
662
|
-
const
|
|
675
|
+
const normalizeDestinationIndex: (index: number, position: "above" | "below") => number;
|
|
663
676
|
}
|
|
664
677
|
|
|
665
678
|
declare const CompletionToken: styled_components.StyledComponent<"span", styled_components.DefaultTheme, {
|
|
@@ -691,7 +704,12 @@ type Props$b = {
|
|
|
691
704
|
hideChildrenWhenFocused?: boolean;
|
|
692
705
|
hideMenuWhenEmptyValue?: boolean;
|
|
693
706
|
};
|
|
694
|
-
|
|
707
|
+
interface IInputFieldWithCompletions {
|
|
708
|
+
focus(): void;
|
|
709
|
+
setValue(value: string): void;
|
|
710
|
+
selectAllInputText(): void;
|
|
711
|
+
}
|
|
712
|
+
declare const InputFieldWithCompletions: (props: Props$b & React__default.RefAttributes<IInputFieldWithCompletions>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
|
|
695
713
|
|
|
696
714
|
interface LabelRootProps {
|
|
697
715
|
label: ReactNode;
|
|
@@ -809,57 +827,58 @@ type BreakpointCollection<T extends object> = Breakpoint<T>[] | Record<Breakpoin
|
|
|
809
827
|
declare function withSeparatorElements(elements: ReactNode, separator: ReactNode | (() => ReactNode)): (string | number | React$1.ReactElement<any, string | React$1.JSXElementConstructor<any>> | Iterable<ReactNode> | React$1.ReactPortal)[];
|
|
810
828
|
|
|
811
829
|
interface StyleProps$1 {
|
|
812
|
-
display?:
|
|
813
|
-
visibility?: CSSProperties[
|
|
814
|
-
position?: CSSProperties[
|
|
815
|
-
zIndex?: CSSProperties[
|
|
816
|
-
gap?: CSSProperties[
|
|
817
|
-
inset?: CSSProperties[
|
|
818
|
-
top?: CSSProperties[
|
|
819
|
-
right?: CSSProperties[
|
|
820
|
-
bottom?: CSSProperties[
|
|
821
|
-
left?: CSSProperties[
|
|
822
|
-
flexDirection?: CSSProperties[
|
|
823
|
-
justifyContent?: CSSProperties[
|
|
824
|
-
alignItems?: CSSProperties[
|
|
825
|
-
alignSelf?: CSSProperties[
|
|
826
|
-
flex?: CSSProperties[
|
|
827
|
-
flexWrap?: CSSProperties[
|
|
828
|
-
height?: CSSProperties[
|
|
829
|
-
minHeight?: CSSProperties[
|
|
830
|
-
maxHeight?: CSSProperties[
|
|
831
|
-
width?: CSSProperties[
|
|
832
|
-
minWidth?: CSSProperties[
|
|
833
|
-
maxWidth?: CSSProperties[
|
|
834
|
-
aspectRatio?: CSSProperties[
|
|
835
|
-
padding?: CSSProperties[
|
|
830
|
+
display?: "flex" | "inline-flex" | "none" | "block";
|
|
831
|
+
visibility?: CSSProperties["visibility"];
|
|
832
|
+
position?: CSSProperties["position"];
|
|
833
|
+
zIndex?: CSSProperties["zIndex"];
|
|
834
|
+
gap?: CSSProperties["gap"];
|
|
835
|
+
inset?: CSSProperties["inset"];
|
|
836
|
+
top?: CSSProperties["top"];
|
|
837
|
+
right?: CSSProperties["right"];
|
|
838
|
+
bottom?: CSSProperties["bottom"];
|
|
839
|
+
left?: CSSProperties["left"];
|
|
840
|
+
flexDirection?: CSSProperties["flexDirection"];
|
|
841
|
+
justifyContent?: CSSProperties["justifyContent"];
|
|
842
|
+
alignItems?: CSSProperties["alignItems"];
|
|
843
|
+
alignSelf?: CSSProperties["alignSelf"];
|
|
844
|
+
flex?: CSSProperties["flex"];
|
|
845
|
+
flexWrap?: CSSProperties["flexWrap"];
|
|
846
|
+
height?: CSSProperties["height"];
|
|
847
|
+
minHeight?: CSSProperties["minHeight"];
|
|
848
|
+
maxHeight?: CSSProperties["maxHeight"];
|
|
849
|
+
width?: CSSProperties["width"];
|
|
850
|
+
minWidth?: CSSProperties["minWidth"];
|
|
851
|
+
maxWidth?: CSSProperties["maxWidth"];
|
|
852
|
+
aspectRatio?: CSSProperties["aspectRatio"];
|
|
853
|
+
padding?: CSSProperties["padding"];
|
|
836
854
|
paddingVertical?: string | number;
|
|
837
855
|
paddingHorizontal?: string | number;
|
|
838
|
-
margin?: CSSProperties[
|
|
839
|
-
background?: CSSProperties[
|
|
840
|
-
backgroundSize?: CSSProperties[
|
|
841
|
-
backgroundPosition?: CSSProperties[
|
|
842
|
-
borderRadius?: CSSProperties[
|
|
843
|
-
overflowX?: CSSProperties[
|
|
844
|
-
overflowY?: CSSProperties[
|
|
845
|
-
overflow?: CSSProperties[
|
|
846
|
-
textOverflow?: CSSProperties[
|
|
847
|
-
boxShadow?: CSSProperties[
|
|
848
|
-
outline?: CSSProperties[
|
|
849
|
-
border?: CSSProperties[
|
|
850
|
-
borderTop?: CSSProperties[
|
|
851
|
-
borderRight?: CSSProperties[
|
|
852
|
-
borderBottom?: CSSProperties[
|
|
853
|
-
borderLeft?: CSSProperties[
|
|
854
|
-
cursor?: CSSProperties[
|
|
855
|
-
userSelect?: CSSProperties[
|
|
856
|
-
transition?: CSSProperties[
|
|
857
|
-
opacity?: CSSProperties[
|
|
858
|
-
filter?: CSSProperties[
|
|
859
|
-
color?: CSSProperties[
|
|
860
|
-
order?: CSSProperties[
|
|
861
|
-
pointerEvents?: CSSProperties[
|
|
862
|
-
lineHeight?: CSSProperties[
|
|
856
|
+
margin?: CSSProperties["margin"];
|
|
857
|
+
background?: CSSProperties["background"];
|
|
858
|
+
backgroundSize?: CSSProperties["backgroundSize"];
|
|
859
|
+
backgroundPosition?: CSSProperties["backgroundPosition"];
|
|
860
|
+
borderRadius?: CSSProperties["borderRadius"];
|
|
861
|
+
overflowX?: CSSProperties["overflowX"];
|
|
862
|
+
overflowY?: CSSProperties["overflowY"];
|
|
863
|
+
overflow?: CSSProperties["overflow"];
|
|
864
|
+
textOverflow?: CSSProperties["textOverflow"];
|
|
865
|
+
boxShadow?: CSSProperties["boxShadow"];
|
|
866
|
+
outline?: CSSProperties["outline"];
|
|
867
|
+
border?: CSSProperties["border"];
|
|
868
|
+
borderTop?: CSSProperties["borderTop"];
|
|
869
|
+
borderRight?: CSSProperties["borderRight"];
|
|
870
|
+
borderBottom?: CSSProperties["borderBottom"];
|
|
871
|
+
borderLeft?: CSSProperties["borderLeft"];
|
|
872
|
+
cursor?: CSSProperties["cursor"];
|
|
873
|
+
userSelect?: CSSProperties["userSelect"];
|
|
874
|
+
transition?: CSSProperties["transition"];
|
|
875
|
+
opacity?: CSSProperties["opacity"];
|
|
876
|
+
filter?: CSSProperties["filter"];
|
|
877
|
+
color?: CSSProperties["color"];
|
|
878
|
+
order?: CSSProperties["order"];
|
|
879
|
+
pointerEvents?: CSSProperties["pointerEvents"];
|
|
880
|
+
lineHeight?: CSSProperties["lineHeight"];
|
|
881
|
+
isolation?: CSSProperties["isolation"];
|
|
863
882
|
}
|
|
864
883
|
type StackBreakpointList = BreakpointCollection<StyleProps$1>;
|
|
865
884
|
interface Props$4 extends StyleProps$1 {
|
|
@@ -872,19 +891,19 @@ interface Props$4 extends StyleProps$1 {
|
|
|
872
891
|
href?: string;
|
|
873
892
|
tabIndex?: number;
|
|
874
893
|
}
|
|
875
|
-
type StackProps = Omit<Props$4,
|
|
894
|
+
type StackProps = Omit<Props$4, "flexDirection">;
|
|
876
895
|
declare const Stack: {
|
|
877
896
|
V: (props: StackProps & React__default.RefAttributes<HTMLElement>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
|
|
878
897
|
H: (props: StackProps & React__default.RefAttributes<HTMLElement>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
|
|
879
898
|
};
|
|
880
899
|
|
|
881
|
-
type
|
|
900
|
+
type SwitchColorScheme = "normal" | "primary" | "secondary";
|
|
882
901
|
interface Props$3 {
|
|
883
902
|
value: boolean;
|
|
884
903
|
onChange: (value: boolean) => void;
|
|
885
|
-
|
|
904
|
+
colorScheme?: SwitchColorScheme;
|
|
886
905
|
}
|
|
887
|
-
declare const Switch: ({ value, onChange,
|
|
906
|
+
declare const Switch: ({ value, onChange, colorScheme, }: Props$3) => React__default.JSX.Element;
|
|
888
907
|
|
|
889
908
|
type StyleProps = {
|
|
890
909
|
flex?: CSSProperties$1["flex"];
|
|
@@ -901,6 +920,8 @@ type StyleProps = {
|
|
|
901
920
|
whiteSpace?: CSSProperties$1["whiteSpace"];
|
|
902
921
|
height?: CSSProperties$1["height"];
|
|
903
922
|
width?: CSSProperties$1["width"];
|
|
923
|
+
minWidth?: CSSProperties$1["minWidth"];
|
|
924
|
+
maxWidth?: CSSProperties$1["maxWidth"];
|
|
904
925
|
opacity?: CSSProperties$1["opacity"];
|
|
905
926
|
position?: CSSProperties$1["position"];
|
|
906
927
|
overflow?: CSSProperties$1["overflow"];
|
|
@@ -924,6 +945,7 @@ interface Props$2 extends StyleProps {
|
|
|
924
945
|
color?: ThemeColorName;
|
|
925
946
|
children: ReactNode;
|
|
926
947
|
onClick?: () => void;
|
|
948
|
+
onDoubleClick?: () => void;
|
|
927
949
|
}
|
|
928
950
|
declare const Text$1: (props: Props$2 & React__default.RefAttributes<HTMLElement>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
|
|
929
951
|
type PresetProps = Omit<Props$2, "variant">;
|
|
@@ -1196,6 +1218,42 @@ declare function sketchColorToRgbaString(value: Sketch.Color): string;
|
|
|
1196
1218
|
declare function rgbaToSketchColor(value: RgbaColor): Sketch.Color;
|
|
1197
1219
|
declare function sketchColorToHex(value: Sketch.Color): string;
|
|
1198
1220
|
|
|
1221
|
+
interface ArrayControllerProps<Item> {
|
|
1222
|
+
id: string;
|
|
1223
|
+
items: Item[];
|
|
1224
|
+
title: ReactNode;
|
|
1225
|
+
sortable?: boolean;
|
|
1226
|
+
reversed?: boolean;
|
|
1227
|
+
expanded?: boolean;
|
|
1228
|
+
getKey?: (item: Item) => string;
|
|
1229
|
+
onMoveItem?: (sourceIndex: number, destinationIndex: number) => void;
|
|
1230
|
+
onClickPlus?: () => void;
|
|
1231
|
+
onClickTrash?: () => void;
|
|
1232
|
+
onClickExpand?: () => void;
|
|
1233
|
+
renderItem: (props: {
|
|
1234
|
+
item: Item;
|
|
1235
|
+
index: number;
|
|
1236
|
+
}) => ReactNode;
|
|
1237
|
+
renderExpandedContent?: () => ReactNode;
|
|
1238
|
+
padding?: number;
|
|
1239
|
+
}
|
|
1240
|
+
declare const ArrayController: <Item>(props: ArrayControllerProps<Item>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
|
|
1241
|
+
|
|
1242
|
+
type SetNumberMode = "replace" | "adjust";
|
|
1243
|
+
declare function getNewValue(value: number, mode: SetNumberMode, delta?: number): number;
|
|
1244
|
+
type DimensionValue = number | undefined;
|
|
1245
|
+
interface Props {
|
|
1246
|
+
id?: string;
|
|
1247
|
+
value: DimensionValue;
|
|
1248
|
+
onSetValue: (value: number, mode: SetNumberMode) => void;
|
|
1249
|
+
label?: string;
|
|
1250
|
+
size?: number;
|
|
1251
|
+
placeholder?: string;
|
|
1252
|
+
disabled?: boolean;
|
|
1253
|
+
trigger?: "change" | "submit";
|
|
1254
|
+
}
|
|
1255
|
+
declare const DimensionInput: (props: Props) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
|
|
1256
|
+
|
|
1199
1257
|
declare const Section: styled_components.StyledComponent<"div", styled_components.DefaultTheme, {
|
|
1200
1258
|
padding?: CSSProperties["padding"];
|
|
1201
1259
|
gap?: CSSProperties["gap"];
|
|
@@ -1218,7 +1276,7 @@ declare const RowLabel: styled_components.StyledComponent<"span", styled_compone
|
|
|
1218
1276
|
declare const LabeledRow: (props: {
|
|
1219
1277
|
id?: string | undefined;
|
|
1220
1278
|
children: ReactNode;
|
|
1221
|
-
label:
|
|
1279
|
+
label: ReactNode;
|
|
1222
1280
|
labelTextStyle?: "small" | "heading3" | "heading4" | "heading5" | undefined;
|
|
1223
1281
|
gap?: CSSProperties["gap"];
|
|
1224
1282
|
right?: ReactNode;
|
|
@@ -1244,45 +1302,9 @@ declare namespace InspectorPrimitives {
|
|
|
1244
1302
|
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 };
|
|
1245
1303
|
}
|
|
1246
1304
|
|
|
1247
|
-
interface ArrayControllerProps<Item> {
|
|
1248
|
-
id: string;
|
|
1249
|
-
items: Item[];
|
|
1250
|
-
title: ReactNode;
|
|
1251
|
-
sortable?: boolean;
|
|
1252
|
-
reversed?: boolean;
|
|
1253
|
-
expanded?: boolean;
|
|
1254
|
-
getKey?: (item: Item) => string;
|
|
1255
|
-
onMoveItem?: (sourceIndex: number, destinationIndex: number) => void;
|
|
1256
|
-
onClickPlus?: () => void;
|
|
1257
|
-
onClickTrash?: () => void;
|
|
1258
|
-
onClickExpand?: () => void;
|
|
1259
|
-
renderItem: (props: {
|
|
1260
|
-
item: Item;
|
|
1261
|
-
index: number;
|
|
1262
|
-
}) => ReactNode;
|
|
1263
|
-
renderExpandedContent?: () => ReactNode;
|
|
1264
|
-
padding?: number;
|
|
1265
|
-
}
|
|
1266
|
-
declare const ArrayController: <Item>(props: ArrayControllerProps<Item>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
|
|
1267
|
-
|
|
1268
|
-
type SetNumberMode = "replace" | "adjust";
|
|
1269
|
-
declare function getNewValue(value: number, mode: SetNumberMode, delta?: number): number;
|
|
1270
|
-
type DimensionValue = number | undefined;
|
|
1271
|
-
interface Props {
|
|
1272
|
-
id?: string;
|
|
1273
|
-
value: DimensionValue;
|
|
1274
|
-
onSetValue: (value: number, mode: SetNumberMode) => void;
|
|
1275
|
-
label?: string;
|
|
1276
|
-
size?: number;
|
|
1277
|
-
placeholder?: string;
|
|
1278
|
-
disabled?: boolean;
|
|
1279
|
-
trigger?: "change" | "submit";
|
|
1280
|
-
}
|
|
1281
|
-
declare const DimensionInput: (props: Props) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
|
|
1282
|
-
|
|
1283
1305
|
declare module "react" {
|
|
1284
1306
|
function memo<A, B>(Component: (props: A) => B): (props: A) => React.ReactElement | null;
|
|
1285
1307
|
function forwardRef<T, P = {}>(render: (props: P, ref: React.ForwardedRef<T>) => React.ReactElement | null): (props: P & React.RefAttributes<T>) => React.ReactElement | null;
|
|
1286
1308
|
}
|
|
1287
1309
|
|
|
1288
|
-
export { ActivityIndicator, ArrayController, type ArrayControllerProps, Avatar, Body, Button, ButtonElement, type ButtonRootProps, Chip, type ChipProps, CloseButtonContainer, type Colors, type CompletionItem, type CompletionListItem, CompletionMenu, type CompletionSectionHeader, CompletionToken, ContextMenu, type DesignSystemConfigurationContextValue, DesignSystemConfigurationProvider, Dialog, type DialogContextValue, DialogProvider, DimensionInput, type DimensionValue, Divider, DividerVertical, type DropValidator, DropdownMenu, type EditableRowProps, type EventName, type ExtractMenuItemType, FillInputField, FillPreviewBackground, type GlobalInputBlurContextValue, GlobalInputBlurProvider, GradientPicker, type GridProps, GridView, type GridViewSize, Heading1, Heading2, Heading3, Heading4, Heading5, type HoverEvent, type HoverEvents, type HoverProps, type IDialog, type IScoredItem, type IToken, type IVirtualizedList, IconButton, type ImageDataContextValue, ImageDataProvider, InputElement, InputField, type InputFieldSize, InputFieldWithCompletions, InspectorPrimitives, Italic, KeyboardShortcut, Label, LabeledElementView, type ListRowMarginType, type ListRowPosition, ListView, type MatchRange, type MenuConfig, type MenuItem, type MenuItemProps, type MenuProps, type Optional, PatternPreviewBackground, Popover, Progress, RadioGroup, type ReactDOMEventHandlers, type ReactEventHandlers, type RegularMenuItem, type RelativeDropPosition, Row$1 as Row, SEPARATOR_ITEM, SUPPORTED_CANVAS_UPLOAD_TYPES, SUPPORTED_IMAGE_UPLOAD_TYPES, ScrollArea, Select, SelectOption, 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, createSectionedMenu, dark as darkTheme, fuzzyFilter, fuzzyScore, fuzzyTokenize, getGradientBackground, getNewValue, isLeftButtonClicked, isRightButtonClicked, lightTheme, mediaQuery, mergeEventHandlers,
|
|
1310
|
+
export { ActivityIndicator, ArrayController, type ArrayControllerProps, Avatar, Body, Button, ButtonElement, type ButtonRootProps, Chip, type ChipProps, CloseButtonContainer, type Colors, type CompletionItem, type CompletionListItem, CompletionMenu, type CompletionSectionHeader, CompletionToken, ContextMenu, type DesignSystemConfigurationContextValue, DesignSystemConfigurationProvider, Dialog, type DialogContextValue, DialogProvider, DimensionInput, type DimensionValue, Divider, DividerVertical, DraggableMenuButton, type DropValidator, DropdownMenu, type EditableRowProps, type EventName, type ExtractMenuItemType, FillInputField, FillPreviewBackground, 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, IconButton, type ImageDataContextValue, ImageDataProvider, InputElement, InputField, type InputFieldSize, InputFieldWithCompletions, InspectorPrimitives, Italic, KeyboardShortcut, Label, LabeledElementView, type ListRowMarginType, type ListRowPosition, ListView, type MatchRange, type MenuConfig, type MenuItem, type MenuItemProps, type MenuProps, type Optional, PatternPreviewBackground, Popover, Progress, RadioGroup, type ReactDOMEventHandlers, type ReactEventHandlers, type RegularMenuItem, type RelativeDropPosition, Row$1 as Row, SEPARATOR_ITEM, SUPPORTED_CANVAS_UPLOAD_TYPES, SUPPORTED_IMAGE_UPLOAD_TYPES, ScrollArea, Select, SelectOption, 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, createSectionedMenu, dark as darkTheme, fuzzyFilter, fuzzyScore, fuzzyTokenize, getGradientBackground, getNewValue, isLeftButtonClicked, isRightButtonClicked, lightTheme, mediaQuery, mergeEventHandlers, normalizeListDestinationIndex, rgbaToSketchColor, size, sketchColorToHex, sketchColorToRgba, sketchColorToRgbaString, useDesignSystemConfiguration, useDesignSystemTheme, useDialogContainsElement, useGlobalInputBlur, useGlobalInputBlurListener, useGlobalInputBlurTrigger, useHover, useImageData, useOpenInputDialog, usePlatform, usePlatformModKey, withSeparatorElements };
|