@noya-app/noya-designsystem 0.0.8 → 0.0.9

package/.turbo/turbo-build.log

@@ -5,13 +5,13 @@ CLI tsup v8.0.1
 CLI Target: esnext
 CJS Build start
 ESM Build start
-CJS dist/index.js     183.08 KB
-CJS dist/index.js.map 366.48 KB
-CJS ⚡️ Build success in 48ms
-ESM dist/index.mjs     166.96 KB
-ESM dist/index.mjs.map 365.59 KB
-ESM ⚡️ Build success in 48ms
+ESM dist/index.mjs     167.98 KB
+ESM dist/index.mjs.map 366.02 KB
+ESM ⚡️ Build success in 79ms
+CJS dist/index.js     184.28 KB
+CJS dist/index.js.map 366.94 KB
+CJS ⚡️ Build success in 79ms
 DTS Build start
-DTS ⚡️ Build success in 5132ms
-DTS dist/index.d.ts  52.64 KB
-DTS dist/index.d.mts 52.64 KB
+DTS ⚡️ Build success in 5889ms
+DTS dist/index.d.ts  53.26 KB
+DTS dist/index.d.mts 53.26 KB

package/CHANGELOG.md

@@ -1,5 +1,12 @@
 # @noya-app/noya-designsystem
 
+## 0.0.9
+
+### Patch Changes
+
+- Updated dependencies
+  - @noya-app/noya-geometry@0.0.8
+
 ## 0.0.8
 
 ### Patch Changes

package/dist/index.d.mts

@@ -18,13 +18,13 @@ import * as ToggleGroupPrimitive from '@radix-ui/react-toggle-group';
 import { useGesture } from 'react-use-gesture';
 import { RgbaColor } from '@noya-app/noya-colorpicker';
 
-interface Props$g {
+interface Props$h {
     size?: number;
     opacity?: number;
     color?: string;
     trackColor?: string;
 }
-declare const ActivityIndicator: (props: Props$g) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
+declare const ActivityIndicator: (props: Props$h) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
 
 declare function Avatar({ image, name, fallback, size, overflow, }: {
     image?: string;
@@ -247,7 +247,7 @@ declare const CloseButtonContainer: styled_components.StyledComponent<"div", sty
 interface IDialog {
     containsElement: (element: HTMLElement) => boolean;
 }
-interface Props$f {
+interface Props$g {
     title?: ReactNode;
     description?: ReactNode;
     children?: ReactNode;
@@ -257,7 +257,7 @@ interface Props$f {
     onOpenAutoFocus?: ComponentProps<typeof DialogPrimitive.Content>['onOpenAutoFocus'];
     closeOnInteractOutside?: boolean;
 }
-declare const Dialog: (props: Props$f & React__default.RefAttributes<IDialog>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
+declare const Dialog: (props: Props$g & React__default.RefAttributes<IDialog>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
 
 type DividerVariant = 'normal' | 'strong' | 'subtle';
 interface DividerProps {
@@ -272,8 +272,8 @@ declare const DropdownMenu: <T extends string>(props: MenuProps<T> & {
     onCloseAutoFocus?: ((event: React__default.SyntheticEvent<unknown, Event>) => void) | undefined;
 } & React__default.RefAttributes<HTMLElement>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
 
-declare const SUPPORTED_IMAGE_UPLOAD_TYPES: ("image/png" | "image/jpeg" | "image/webp" | "application/pdf" | "image/svg+xml")[];
-declare const SUPPORTED_CANVAS_UPLOAD_TYPES: ("" | "image/png" | "image/jpeg" | "image/webp" | "application/pdf" | "image/svg+xml")[];
+declare const SUPPORTED_IMAGE_UPLOAD_TYPES: ("image/png" | "image/jpeg" | "image/webp" | "image/svg+xml" | "application/pdf")[];
+declare const SUPPORTED_CANVAS_UPLOAD_TYPES: ("" | "image/png" | "image/jpeg" | "image/webp" | "image/svg+xml" | "application/pdf")[];
 type SupportedImageUploadType = (typeof SUPPORTED_IMAGE_UPLOAD_TYPES)[number];
 type SupportedCanvasUploadType = (typeof SUPPORTED_CANVAS_UPLOAD_TYPES)[number];
 type SketchPattern = {
@@ -283,24 +283,24 @@ type SketchPattern = {
     patternTileScale: number;
 };
 
-interface Props$e {
+interface Props$f {
     id?: string;
     value?: Sketch.Color | Sketch.Gradient | SketchPattern;
     flex?: CSSProperties['flex'];
 }
-declare const FillInputField: (props: Props$e & React__default.RefAttributes<HTMLButtonElement>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
+declare const FillInputField: (props: Props$f & React__default.RefAttributes<HTMLButtonElement>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
 
 declare const PatternPreviewBackground: (props: {
     fillType: Sketch.PatternFillType;
     tileScale: number;
     imageRef: string;
 }) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
-interface Props$d {
+interface Props$e {
     value?: Sketch.Color | Sketch.Gradient | SketchPattern;
 }
-declare const FillPreviewBackground: (props: Props$d) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
+declare const FillPreviewBackground: (props: Props$e) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
 
-interface Props$c {
+interface Props$d {
     value: Sketch.GradientStop[];
     selectedStop: number;
     onChangeColor: (color: Sketch.Color) => void;
@@ -309,7 +309,7 @@ interface Props$c {
     onDelete: () => void;
     onSelectStop: (index: number) => void;
 }
-declare const GradientPicker: (props: Props$c) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
+declare const GradientPicker: (props: Props$d) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
 
 type GridProps = {
     columns?: string;
@@ -382,7 +382,7 @@ declare const IconButton: (props: Omit<ButtonRootProps, "children" | "size" | "f
     size?: number | undefined;
 } & React__default.RefAttributes<HTMLButtonElement>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
 
-type Props$b = {
+type Props$c = {
     id?: string;
     style?: any;
     className?: string;
@@ -400,13 +400,13 @@ type Props$b = {
     onFocusChange?: (isFocused: boolean) => void;
     onBlur?: FocusEventHandler;
 } & Pick<InputHTMLAttributes<HTMLInputElement>, "autoComplete" | "autoCapitalize" | "autoCorrect" | "spellCheck" | "autoFocus">;
-type ReadOnlyProps = Props$b & {
+type ReadOnlyProps = Props$c & {
     readOnly: true;
 };
-type ControlledProps = Props$b & {
+type ControlledProps = Props$c & {
     onChange: (value: string) => void;
 };
-type SubmittableProps = Props$b & {
+type SubmittableProps = Props$c & {
     onSubmit: (value: string) => void;
     allowSubmittingWithSameValue?: boolean;
     submitAutomaticallyAfterDelay?: number;
@@ -663,7 +663,7 @@ interface CompletionMenuProps {
     listSize: Size;
 }
 declare const CompletionMenu: (props: CompletionMenuProps & React__default.RefAttributes<IVirtualizedList>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
-interface Props$a {
+type Props$b = {
     loading?: boolean;
     initialValue?: string;
     placeholder?: string;
@@ -679,8 +679,8 @@ interface Props$a {
     children?: React__default.ReactNode;
     hideChildrenWhenFocused?: boolean;
     hideMenuWhenEmptyValue?: boolean;
-}
-declare const InputFieldWithCompletions: (props: Props$a & React__default.RefAttributes<HTMLInputElement>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
+};
+declare const InputFieldWithCompletions: (props: Props$b & React__default.RefAttributes<HTMLInputElement>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
 
 interface LabelRootProps {
     label: ReactNode;
@@ -703,7 +703,7 @@ interface ContainerProps {
 declare const LabeledElementView: (props: ContainerProps) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
 
 type PopoverVariant = 'normal' | 'large';
-interface Props$9 extends Pick<ComponentProps<typeof PopoverPrimitive['Content']>, 'onOpenAutoFocus' | 'onCloseAutoFocus' | 'onPointerDownOutside' | 'onInteractOutside' | 'onFocusOutside' | 'side'> {
+interface Props$a extends Pick<ComponentProps<typeof PopoverPrimitive['Content']>, 'onOpenAutoFocus' | 'onCloseAutoFocus' | 'onPointerDownOutside' | 'onInteractOutside' | 'onFocusOutside' | 'side'> {
     children: React__default.ReactNode;
     trigger: React__default.ReactNode;
     variant?: PopoverVariant;
@@ -714,7 +714,7 @@ interface Props$9 extends Pick<ComponentProps<typeof PopoverPrimitive['Content']
     onClickClose?: () => void;
     showArrow?: boolean;
 }
-declare function Popover({ children, trigger, variant, closable, open, side, sideOffset, showArrow, onOpenChange, onOpenAutoFocus, onCloseAutoFocus, onPointerDownOutside, onInteractOutside, onFocusOutside, onClickClose, }: Props$9): React__default.JSX.Element;
+declare function Popover({ children, trigger, variant, closable, open, side, sideOffset, showArrow, onOpenChange, onOpenAutoFocus, onCloseAutoFocus, onPointerDownOutside, onInteractOutside, onFocusOutside, onClickClose, }: Props$a): React__default.JSX.Element;
 
 type ProgressVariant = 'normal' | 'warning' | 'primary' | 'secondary';
 declare function Progress({ value, width, height, flex, variant, }: {
@@ -735,7 +735,7 @@ interface ItemProps {
     children: ReactNode;
     disabled?: boolean;
 }
-interface Props$8 {
+interface Props$9 {
     id?: string;
     value?: string;
     onValueChange?: ComponentProps<typeof StyledRoot>['onValueChange'];
@@ -744,14 +744,14 @@ interface Props$8 {
     children: ReactNode;
 }
 declare namespace RadioGroup {
-    const Root: (props: Props$8) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
+    const Root: (props: Props$9) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
     const Item: (props: ItemProps & React__default.RefAttributes<HTMLButtonElement>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
 }
 
-interface Props$7 {
+interface Props$8 {
     children?: ReactNode | ((scrollElementRef: HTMLDivElement) => ReactNode);
 }
-declare const ScrollArea: (props: Props$7) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
+declare const ScrollArea: (props: Props$8) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
 
 interface SelectOptionProps<T extends string> {
     value: T;
@@ -766,29 +766,29 @@ type ChildrenProps<T> = {
     getTitle?: (option: T, index: number) => string;
     onChange: (value: T) => void;
 };
-type Props$6<T extends string> = ChildrenProps<T> & {
+type Props$7<T extends string> = ChildrenProps<T> & {
     id: string;
     flex?: CSSProperties["flex"];
     value: T;
 };
-declare const Select: <T extends string>(props: Props$6<T>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
+declare const Select: <T extends string>(props: Props$7<T>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
 
-interface Props$5 {
+interface Props$6 {
     id?: string;
     value: number;
     onValueChange: (value: number) => void;
     min: number;
     max: number;
 }
-declare const Slider: ({ id, value, onValueChange, min, max, }: Props$5) => React__default.JSX.Element;
+declare const Slider: ({ id, value, onValueChange, min, max, }: Props$6) => React__default.JSX.Element;
 
-interface Props$4 {
+interface Props$5 {
     size?: number | string;
     inline?: boolean;
 }
 declare namespace Spacer {
-    const Vertical: styled_components.StyledComponent<"span", styled_components.DefaultTheme, Props$4, never>;
-    const Horizontal: styled_components.StyledComponent<"span", styled_components.DefaultTheme, Props$4, never>;
+    const Vertical: styled_components.StyledComponent<"span", styled_components.DefaultTheme, Props$5, never>;
+    const Horizontal: styled_components.StyledComponent<"span", styled_components.DefaultTheme, Props$5, never>;
 }
 
 type BreakpointKey = number | string;
@@ -851,7 +851,7 @@ interface StyleProps$1 {
     lineHeight?: CSSProperties['lineHeight'];
 }
 type StackBreakpointList = BreakpointCollection<StyleProps$1>;
-interface Props$3 extends StyleProps$1 {
+interface Props$4 extends StyleProps$1 {
     id?: string;
     as?: keyof ReactHTML;
     className?: string;
@@ -861,19 +861,19 @@ interface Props$3 extends StyleProps$1 {
     href?: string;
     tabIndex?: number;
 }
-type StackProps = Omit<Props$3, 'flexDirection'>;
+type StackProps = Omit<Props$4, 'flexDirection'>;
 declare const Stack: {
     V: (props: StackProps & React__default.RefAttributes<HTMLElement>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
     H: (props: StackProps & React__default.RefAttributes<HTMLElement>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
 };
 
 type SwitchVariant = 'normal' | 'primary' | 'secondary';
-interface Props$2 {
+interface Props$3 {
     value: boolean;
     onChange: (value: boolean) => void;
     variant?: SwitchVariant;
 }
-declare const Switch: ({ value, onChange, variant, }: Props$2) => React__default.JSX.Element;
+declare const Switch: ({ value, onChange, variant, }: Props$3) => React__default.JSX.Element;
 
 type StyleProps = {
     flex?: CSSProperties$1['flex'];
@@ -903,7 +903,7 @@ type StyleProps = {
     userSelect?: CSSProperties$1['userSelect'];
 };
 type TextBreakpointList = BreakpointCollection<StyleProps>;
-interface Props$1 extends StyleProps {
+interface Props$2 extends StyleProps {
     as?: keyof ReactHTML;
     href?: string;
     className?: string;
@@ -913,8 +913,8 @@ interface Props$1 extends StyleProps {
     children: ReactNode;
     onClick?: () => void;
 }
-declare const Text$1: (props: Props$1 & React__default.RefAttributes<HTMLElement>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
-type PresetProps = Omit<Props$1, 'variant'>;
+declare const Text$1: (props: Props$2 & React__default.RefAttributes<HTMLElement>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
+type PresetProps = Omit<Props$2, 'variant'>;
 declare const Heading1: (props: PresetProps & React__default.RefAttributes<HTMLElement>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
 declare const Heading2: (props: PresetProps & React__default.RefAttributes<HTMLElement>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
 declare const Heading3: (props: PresetProps & React__default.RefAttributes<HTMLElement>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
@@ -935,11 +935,11 @@ declare const ToastProvider: ({ children }: {
     children: React__default.ReactNode;
 }) => React__default.JSX.Element;
 
-interface Props {
+interface Props$1 {
     children: ReactNode;
     content: ReactNode;
 }
-declare const Tooltip: (props: Props) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
+declare const Tooltip: (props: Props$1) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
 
 type TreeRowBaseProps = {
     icon?: ReactNode;
@@ -1248,9 +1248,24 @@ interface ArrayControllerProps<Item> {
 }
 declare const ArrayController: <Item>(props: ArrayControllerProps<Item>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
 
+type SetNumberMode = "replace" | "adjust";
+declare function getNewValue(value: number, mode: SetNumberMode, delta?: number): number;
+type DimensionValue = number | undefined;
+interface Props {
+    id?: string;
+    value: DimensionValue;
+    onSetValue: (value: number, mode: SetNumberMode) => void;
+    label?: string;
+    size?: number;
+    placeholder?: string;
+    disabled?: boolean;
+    trigger?: "change" | "submit";
+}
+declare const DimensionInput: (props: Props) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
+
 declare module "react" {
     function memo<A, B>(Component: (props: A) => B): (props: A) => React.ReactElement | null;
     function forwardRef<T, P = {}>(render: (props: P, ref: React.ForwardedRef<T>) => React.ReactElement | null): (props: P & React.RefAttributes<T>) => React.ReactElement | null;
 }
 
-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, 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 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, isLeftButtonClicked, isRightButtonClicked, lightTheme, mediaQuery, mergeEventHandlers, normalizeListIndex, rgbaToSketchColor, size, sketchColorToHex, sketchColorToRgba, sketchColorToRgbaString, useDesignSystemConfiguration, useDesignSystemTheme, useDialogContainsElement, useGlobalInputBlur, useGlobalInputBlurListener, useGlobalInputBlurTrigger, useHover, useImageData, useOpenInputDialog, usePlatform, usePlatformModKey, withSeparatorElements };
+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, normalizeListIndex, rgbaToSketchColor, size, sketchColorToHex, sketchColorToRgba, sketchColorToRgbaString, useDesignSystemConfiguration, useDesignSystemTheme, useDialogContainsElement, useGlobalInputBlur, useGlobalInputBlurListener, useGlobalInputBlurTrigger, useHover, useImageData, useOpenInputDialog, usePlatform, usePlatformModKey, withSeparatorElements };

package/dist/index.d.ts

@@ -18,13 +18,13 @@ import * as ToggleGroupPrimitive from '@radix-ui/react-toggle-group';
 import { useGesture } from 'react-use-gesture';
 import { RgbaColor } from '@noya-app/noya-colorpicker';
 
-interface Props$g {
+interface Props$h {
     size?: number;
     opacity?: number;
     color?: string;
     trackColor?: string;
 }
-declare const ActivityIndicator: (props: Props$g) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
+declare const ActivityIndicator: (props: Props$h) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
 
 declare function Avatar({ image, name, fallback, size, overflow, }: {
     image?: string;
@@ -247,7 +247,7 @@ declare const CloseButtonContainer: styled_components.StyledComponent<"div", sty
 interface IDialog {
     containsElement: (element: HTMLElement) => boolean;
 }
-interface Props$f {
+interface Props$g {
     title?: ReactNode;
     description?: ReactNode;
     children?: ReactNode;
@@ -257,7 +257,7 @@ interface Props$f {
     onOpenAutoFocus?: ComponentProps<typeof DialogPrimitive.Content>['onOpenAutoFocus'];
     closeOnInteractOutside?: boolean;
 }
-declare const Dialog: (props: Props$f & React__default.RefAttributes<IDialog>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
+declare const Dialog: (props: Props$g & React__default.RefAttributes<IDialog>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
 
 type DividerVariant = 'normal' | 'strong' | 'subtle';
 interface DividerProps {
@@ -272,8 +272,8 @@ declare const DropdownMenu: <T extends string>(props: MenuProps<T> & {
     onCloseAutoFocus?: ((event: React__default.SyntheticEvent<unknown, Event>) => void) | undefined;
 } & React__default.RefAttributes<HTMLElement>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
 
-declare const SUPPORTED_IMAGE_UPLOAD_TYPES: ("image/png" | "image/jpeg" | "image/webp" | "application/pdf" | "image/svg+xml")[];
-declare const SUPPORTED_CANVAS_UPLOAD_TYPES: ("" | "image/png" | "image/jpeg" | "image/webp" | "application/pdf" | "image/svg+xml")[];
+declare const SUPPORTED_IMAGE_UPLOAD_TYPES: ("image/png" | "image/jpeg" | "image/webp" | "image/svg+xml" | "application/pdf")[];
+declare const SUPPORTED_CANVAS_UPLOAD_TYPES: ("" | "image/png" | "image/jpeg" | "image/webp" | "image/svg+xml" | "application/pdf")[];
 type SupportedImageUploadType = (typeof SUPPORTED_IMAGE_UPLOAD_TYPES)[number];
 type SupportedCanvasUploadType = (typeof SUPPORTED_CANVAS_UPLOAD_TYPES)[number];
 type SketchPattern = {
@@ -283,24 +283,24 @@ type SketchPattern = {
     patternTileScale: number;
 };
 
-interface Props$e {
+interface Props$f {
     id?: string;
     value?: Sketch.Color | Sketch.Gradient | SketchPattern;
     flex?: CSSProperties['flex'];
 }
-declare const FillInputField: (props: Props$e & React__default.RefAttributes<HTMLButtonElement>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
+declare const FillInputField: (props: Props$f & React__default.RefAttributes<HTMLButtonElement>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
 
 declare const PatternPreviewBackground: (props: {
     fillType: Sketch.PatternFillType;
     tileScale: number;
     imageRef: string;
 }) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
-interface Props$d {
+interface Props$e {
     value?: Sketch.Color | Sketch.Gradient | SketchPattern;
 }
-declare const FillPreviewBackground: (props: Props$d) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
+declare const FillPreviewBackground: (props: Props$e) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
 
-interface Props$c {
+interface Props$d {
     value: Sketch.GradientStop[];
     selectedStop: number;
     onChangeColor: (color: Sketch.Color) => void;
@@ -309,7 +309,7 @@ interface Props$c {
     onDelete: () => void;
     onSelectStop: (index: number) => void;
 }
-declare const GradientPicker: (props: Props$c) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
+declare const GradientPicker: (props: Props$d) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
 
 type GridProps = {
     columns?: string;
@@ -382,7 +382,7 @@ declare const IconButton: (props: Omit<ButtonRootProps, "children" | "size" | "f
     size?: number | undefined;
 } & React__default.RefAttributes<HTMLButtonElement>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
 
-type Props$b = {
+type Props$c = {
     id?: string;
     style?: any;
     className?: string;
@@ -400,13 +400,13 @@ type Props$b = {
     onFocusChange?: (isFocused: boolean) => void;
     onBlur?: FocusEventHandler;
 } & Pick<InputHTMLAttributes<HTMLInputElement>, "autoComplete" | "autoCapitalize" | "autoCorrect" | "spellCheck" | "autoFocus">;
-type ReadOnlyProps = Props$b & {
+type ReadOnlyProps = Props$c & {
     readOnly: true;
 };
-type ControlledProps = Props$b & {
+type ControlledProps = Props$c & {
     onChange: (value: string) => void;
 };
-type SubmittableProps = Props$b & {
+type SubmittableProps = Props$c & {
     onSubmit: (value: string) => void;
     allowSubmittingWithSameValue?: boolean;
     submitAutomaticallyAfterDelay?: number;
@@ -663,7 +663,7 @@ interface CompletionMenuProps {
     listSize: Size;
 }
 declare const CompletionMenu: (props: CompletionMenuProps & React__default.RefAttributes<IVirtualizedList>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
-interface Props$a {
+type Props$b = {
     loading?: boolean;
     initialValue?: string;
     placeholder?: string;
@@ -679,8 +679,8 @@ interface Props$a {
     children?: React__default.ReactNode;
     hideChildrenWhenFocused?: boolean;
     hideMenuWhenEmptyValue?: boolean;
-}
-declare const InputFieldWithCompletions: (props: Props$a & React__default.RefAttributes<HTMLInputElement>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
+};
+declare const InputFieldWithCompletions: (props: Props$b & React__default.RefAttributes<HTMLInputElement>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
 
 interface LabelRootProps {
     label: ReactNode;
@@ -703,7 +703,7 @@ interface ContainerProps {
 declare const LabeledElementView: (props: ContainerProps) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
 
 type PopoverVariant = 'normal' | 'large';
-interface Props$9 extends Pick<ComponentProps<typeof PopoverPrimitive['Content']>, 'onOpenAutoFocus' | 'onCloseAutoFocus' | 'onPointerDownOutside' | 'onInteractOutside' | 'onFocusOutside' | 'side'> {
+interface Props$a extends Pick<ComponentProps<typeof PopoverPrimitive['Content']>, 'onOpenAutoFocus' | 'onCloseAutoFocus' | 'onPointerDownOutside' | 'onInteractOutside' | 'onFocusOutside' | 'side'> {
     children: React__default.ReactNode;
     trigger: React__default.ReactNode;
     variant?: PopoverVariant;
@@ -714,7 +714,7 @@ interface Props$9 extends Pick<ComponentProps<typeof PopoverPrimitive['Content']
     onClickClose?: () => void;
     showArrow?: boolean;
 }
-declare function Popover({ children, trigger, variant, closable, open, side, sideOffset, showArrow, onOpenChange, onOpenAutoFocus, onCloseAutoFocus, onPointerDownOutside, onInteractOutside, onFocusOutside, onClickClose, }: Props$9): React__default.JSX.Element;
+declare function Popover({ children, trigger, variant, closable, open, side, sideOffset, showArrow, onOpenChange, onOpenAutoFocus, onCloseAutoFocus, onPointerDownOutside, onInteractOutside, onFocusOutside, onClickClose, }: Props$a): React__default.JSX.Element;
 
 type ProgressVariant = 'normal' | 'warning' | 'primary' | 'secondary';
 declare function Progress({ value, width, height, flex, variant, }: {
@@ -735,7 +735,7 @@ interface ItemProps {
     children: ReactNode;
     disabled?: boolean;
 }
-interface Props$8 {
+interface Props$9 {
     id?: string;
     value?: string;
     onValueChange?: ComponentProps<typeof StyledRoot>['onValueChange'];
@@ -744,14 +744,14 @@ interface Props$8 {
     children: ReactNode;
 }
 declare namespace RadioGroup {
-    const Root: (props: Props$8) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
+    const Root: (props: Props$9) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
     const Item: (props: ItemProps & React__default.RefAttributes<HTMLButtonElement>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
 }
 
-interface Props$7 {
+interface Props$8 {
     children?: ReactNode | ((scrollElementRef: HTMLDivElement) => ReactNode);
 }
-declare const ScrollArea: (props: Props$7) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
+declare const ScrollArea: (props: Props$8) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
 
 interface SelectOptionProps<T extends string> {
     value: T;
@@ -766,29 +766,29 @@ type ChildrenProps<T> = {
     getTitle?: (option: T, index: number) => string;
     onChange: (value: T) => void;
 };
-type Props$6<T extends string> = ChildrenProps<T> & {
+type Props$7<T extends string> = ChildrenProps<T> & {
     id: string;
     flex?: CSSProperties["flex"];
     value: T;
 };
-declare const Select: <T extends string>(props: Props$6<T>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
+declare const Select: <T extends string>(props: Props$7<T>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
 
-interface Props$5 {
+interface Props$6 {
     id?: string;
     value: number;
     onValueChange: (value: number) => void;
     min: number;
     max: number;
 }
-declare const Slider: ({ id, value, onValueChange, min, max, }: Props$5) => React__default.JSX.Element;
+declare const Slider: ({ id, value, onValueChange, min, max, }: Props$6) => React__default.JSX.Element;
 
-interface Props$4 {
+interface Props$5 {
     size?: number | string;
     inline?: boolean;
 }
 declare namespace Spacer {
-    const Vertical: styled_components.StyledComponent<"span", styled_components.DefaultTheme, Props$4, never>;
-    const Horizontal: styled_components.StyledComponent<"span", styled_components.DefaultTheme, Props$4, never>;
+    const Vertical: styled_components.StyledComponent<"span", styled_components.DefaultTheme, Props$5, never>;
+    const Horizontal: styled_components.StyledComponent<"span", styled_components.DefaultTheme, Props$5, never>;
 }
 
 type BreakpointKey = number | string;
@@ -851,7 +851,7 @@ interface StyleProps$1 {
     lineHeight?: CSSProperties['lineHeight'];
 }
 type StackBreakpointList = BreakpointCollection<StyleProps$1>;
-interface Props$3 extends StyleProps$1 {
+interface Props$4 extends StyleProps$1 {
     id?: string;
     as?: keyof ReactHTML;
     className?: string;
@@ -861,19 +861,19 @@ interface Props$3 extends StyleProps$1 {
     href?: string;
     tabIndex?: number;
 }
-type StackProps = Omit<Props$3, 'flexDirection'>;
+type StackProps = Omit<Props$4, 'flexDirection'>;
 declare const Stack: {
     V: (props: StackProps & React__default.RefAttributes<HTMLElement>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
     H: (props: StackProps & React__default.RefAttributes<HTMLElement>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
 };
 
 type SwitchVariant = 'normal' | 'primary' | 'secondary';
-interface Props$2 {
+interface Props$3 {
     value: boolean;
     onChange: (value: boolean) => void;
     variant?: SwitchVariant;
 }
-declare const Switch: ({ value, onChange, variant, }: Props$2) => React__default.JSX.Element;
+declare const Switch: ({ value, onChange, variant, }: Props$3) => React__default.JSX.Element;
 
 type StyleProps = {
     flex?: CSSProperties$1['flex'];
@@ -903,7 +903,7 @@ type StyleProps = {
     userSelect?: CSSProperties$1['userSelect'];
 };
 type TextBreakpointList = BreakpointCollection<StyleProps>;
-interface Props$1 extends StyleProps {
+interface Props$2 extends StyleProps {
     as?: keyof ReactHTML;
     href?: string;
     className?: string;
@@ -913,8 +913,8 @@ interface Props$1 extends StyleProps {
     children: ReactNode;
     onClick?: () => void;
 }
-declare const Text$1: (props: Props$1 & React__default.RefAttributes<HTMLElement>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
-type PresetProps = Omit<Props$1, 'variant'>;
+declare const Text$1: (props: Props$2 & React__default.RefAttributes<HTMLElement>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
+type PresetProps = Omit<Props$2, 'variant'>;
 declare const Heading1: (props: PresetProps & React__default.RefAttributes<HTMLElement>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
 declare const Heading2: (props: PresetProps & React__default.RefAttributes<HTMLElement>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
 declare const Heading3: (props: PresetProps & React__default.RefAttributes<HTMLElement>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
@@ -935,11 +935,11 @@ declare const ToastProvider: ({ children }: {
     children: React__default.ReactNode;
 }) => React__default.JSX.Element;
 
-interface Props {
+interface Props$1 {
     children: ReactNode;
     content: ReactNode;
 }
-declare const Tooltip: (props: Props) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
+declare const Tooltip: (props: Props$1) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
 
 type TreeRowBaseProps = {
     icon?: ReactNode;
@@ -1248,9 +1248,24 @@ interface ArrayControllerProps<Item> {
 }
 declare const ArrayController: <Item>(props: ArrayControllerProps<Item>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
 
+type SetNumberMode = "replace" | "adjust";
+declare function getNewValue(value: number, mode: SetNumberMode, delta?: number): number;
+type DimensionValue = number | undefined;
+interface Props {
+    id?: string;
+    value: DimensionValue;
+    onSetValue: (value: number, mode: SetNumberMode) => void;
+    label?: string;
+    size?: number;
+    placeholder?: string;
+    disabled?: boolean;
+    trigger?: "change" | "submit";
+}
+declare const DimensionInput: (props: Props) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
+
 declare module "react" {
     function memo<A, B>(Component: (props: A) => B): (props: A) => React.ReactElement | null;
     function forwardRef<T, P = {}>(render: (props: P, ref: React.ForwardedRef<T>) => React.ReactElement | null): (props: P & React.RefAttributes<T>) => React.ReactElement | null;
 }
 
-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, 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 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, isLeftButtonClicked, isRightButtonClicked, lightTheme, mediaQuery, mergeEventHandlers, normalizeListIndex, rgbaToSketchColor, size, sketchColorToHex, sketchColorToRgba, sketchColorToRgbaString, useDesignSystemConfiguration, useDesignSystemTheme, useDialogContainsElement, useGlobalInputBlur, useGlobalInputBlurListener, useGlobalInputBlurTrigger, useHover, useImageData, useOpenInputDialog, usePlatform, usePlatformModKey, withSeparatorElements };
+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, normalizeListIndex, rgbaToSketchColor, size, sketchColorToHex, sketchColorToRgba, sketchColorToRgbaString, useDesignSystemConfiguration, useDesignSystemTheme, useDialogContainsElement, useGlobalInputBlur, useGlobalInputBlurListener, useGlobalInputBlurTrigger, useHover, useImageData, useOpenInputDialog, usePlatform, usePlatformModKey, withSeparatorElements };