@noya-app/noya-designsystem 0.0.14 → 0.0.15

package/.turbo/turbo-build.log

@@ -6,13 +6,13 @@
 CLI Target: esnext
 CJS Build start
 ESM Build start
-CJS dist/index.js     184.94 KB
-CJS dist/index.js.map 368.98 KB
-CJS ⚡️ Build success in 86ms
-ESM dist/index.mjs     168.67 KB
-ESM dist/index.mjs.map 368.07 KB
-ESM ⚡️ Build success in 86ms
+ESM dist/index.mjs     169.22 KB
+ESM dist/index.mjs.map 369.46 KB
+ESM ⚡️ Build success in 138ms
+CJS dist/index.js     185.57 KB
+CJS dist/index.js.map 370.38 KB
+CJS ⚡️ Build success in 165ms
 DTS Build start
-DTS ⚡️ Build success in 5856ms
-DTS dist/index.d.ts  53.86 KB
-DTS dist/index.d.mts 53.86 KB
+DTS ⚡️ Build success in 13680ms
+DTS dist/index.d.ts  54.19 KB
+DTS dist/index.d.mts 54.19 KB

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @noya-app/noya-designsystem
 
+## 0.0.15
+
+### Patch Changes
+
+- Bump versions
+- Updated dependencies
+  - @noya-app/noya-colorpicker@0.0.9
+  - @noya-app/noya-geometry@0.0.13
+  - @noya-app/noya-icons@0.0.6
+  - @noya-app/noya-keymap@0.0.8
+  - @noya-app/noya-utils@0.0.12
+
 ## 0.0.14
 
 ### Patch Changes

package/dist/index.d.mts

@@ -64,9 +64,9 @@ interface ButtonRootProps {
 }
 declare const Button: (props: ButtonRootProps & React__default.RefAttributes<HTMLButtonElement>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
 
-type ChipColorScheme = 'primary' | 'secondary' | 'error';
-type ChipSize = 'small' | 'medium';
-type ChipVariant = 'solid' | 'outlined' | 'ghost';
+type ChipColorScheme = "primary" | "secondary" | "error";
+type ChipSize = "small" | "medium";
+type ChipVariant = "solid" | "outlined" | "ghost";
 interface ChipProps {
     colorScheme?: ChipColorScheme;
     variant?: ChipVariant;
@@ -258,13 +258,14 @@ interface Props$g {
     title?: ReactNode;
     description?: ReactNode;
     children?: ReactNode;
-    style?: ComponentProps<typeof StyledContent>['style'];
-    open: ComponentProps<typeof DialogPrimitive.Root>['open'];
-    onOpenChange?: ComponentProps<typeof DialogPrimitive.Root>['onOpenChange'];
-    onOpenAutoFocus?: ComponentProps<typeof DialogPrimitive.Content>['onOpenAutoFocus'];
+    style?: ComponentProps<typeof StyledContent>["style"];
+    open: ComponentProps<typeof DialogPrimitive.Root>["open"];
+    onOpenChange?: ComponentProps<typeof DialogPrimitive.Root>["onOpenChange"];
+    onOpenAutoFocus?: ComponentProps<typeof DialogPrimitive.Content>["onOpenAutoFocus"];
     closeOnInteractOutside?: boolean;
 }
 declare const Dialog: (props: Props$g & React__default.RefAttributes<IDialog>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
+declare const FullscreenDialog: (props: Props$g & React__default.RefAttributes<IDialog>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
 
 type DividerVariant = 'normal' | 'strong' | 'subtle';
 interface DividerProps {
@@ -878,13 +879,13 @@ declare const Stack: {
     H: (props: StackProps & React__default.RefAttributes<HTMLElement>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
 };
 
-type SwitchVariant = 'normal' | 'primary' | 'secondary';
+type SwitchColorScheme = "normal" | "primary" | "secondary";
 interface Props$3 {
     value: boolean;
     onChange: (value: boolean) => void;
-    variant?: SwitchVariant;
+    colorScheme?: SwitchColorScheme;
 }
-declare const Switch: ({ value, onChange, variant, }: Props$3) => React__default.JSX.Element;
+declare const Switch: ({ value, onChange, colorScheme, }: Props$3) => React__default.JSX.Element;
 
 type StyleProps = {
     flex?: CSSProperties$1["flex"];
@@ -901,6 +902,8 @@ type StyleProps = {
     whiteSpace?: CSSProperties$1["whiteSpace"];
     height?: CSSProperties$1["height"];
     width?: CSSProperties$1["width"];
+    minWidth?: CSSProperties$1["minWidth"];
+    maxWidth?: CSSProperties$1["maxWidth"];
     opacity?: CSSProperties$1["opacity"];
     position?: CSSProperties$1["position"];
     overflow?: CSSProperties$1["overflow"];
@@ -924,6 +927,7 @@ interface Props$2 extends StyleProps {
     color?: ThemeColorName;
     children: ReactNode;
     onClick?: () => void;
+    onDoubleClick?: () => void;
 }
 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">;
@@ -1285,4 +1289,4 @@ declare module "react" {
     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, 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 };
+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, FullscreenDialog, 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

@@ -64,9 +64,9 @@ interface ButtonRootProps {
 }
 declare const Button: (props: ButtonRootProps & React__default.RefAttributes<HTMLButtonElement>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
 
-type ChipColorScheme = 'primary' | 'secondary' | 'error';
-type ChipSize = 'small' | 'medium';
-type ChipVariant = 'solid' | 'outlined' | 'ghost';
+type ChipColorScheme = "primary" | "secondary" | "error";
+type ChipSize = "small" | "medium";
+type ChipVariant = "solid" | "outlined" | "ghost";
 interface ChipProps {
     colorScheme?: ChipColorScheme;
     variant?: ChipVariant;
@@ -258,13 +258,14 @@ interface Props$g {
     title?: ReactNode;
     description?: ReactNode;
     children?: ReactNode;
-    style?: ComponentProps<typeof StyledContent>['style'];
-    open: ComponentProps<typeof DialogPrimitive.Root>['open'];
-    onOpenChange?: ComponentProps<typeof DialogPrimitive.Root>['onOpenChange'];
-    onOpenAutoFocus?: ComponentProps<typeof DialogPrimitive.Content>['onOpenAutoFocus'];
+    style?: ComponentProps<typeof StyledContent>["style"];
+    open: ComponentProps<typeof DialogPrimitive.Root>["open"];
+    onOpenChange?: ComponentProps<typeof DialogPrimitive.Root>["onOpenChange"];
+    onOpenAutoFocus?: ComponentProps<typeof DialogPrimitive.Content>["onOpenAutoFocus"];
     closeOnInteractOutside?: boolean;
 }
 declare const Dialog: (props: Props$g & React__default.RefAttributes<IDialog>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
+declare const FullscreenDialog: (props: Props$g & React__default.RefAttributes<IDialog>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
 
 type DividerVariant = 'normal' | 'strong' | 'subtle';
 interface DividerProps {
@@ -878,13 +879,13 @@ declare const Stack: {
     H: (props: StackProps & React__default.RefAttributes<HTMLElement>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
 };
 
-type SwitchVariant = 'normal' | 'primary' | 'secondary';
+type SwitchColorScheme = "normal" | "primary" | "secondary";
 interface Props$3 {
     value: boolean;
     onChange: (value: boolean) => void;
-    variant?: SwitchVariant;
+    colorScheme?: SwitchColorScheme;
 }
-declare const Switch: ({ value, onChange, variant, }: Props$3) => React__default.JSX.Element;
+declare const Switch: ({ value, onChange, colorScheme, }: Props$3) => React__default.JSX.Element;
 
 type StyleProps = {
     flex?: CSSProperties$1["flex"];
@@ -901,6 +902,8 @@ type StyleProps = {
     whiteSpace?: CSSProperties$1["whiteSpace"];
     height?: CSSProperties$1["height"];
     width?: CSSProperties$1["width"];
+    minWidth?: CSSProperties$1["minWidth"];
+    maxWidth?: CSSProperties$1["maxWidth"];
     opacity?: CSSProperties$1["opacity"];
     position?: CSSProperties$1["position"];
     overflow?: CSSProperties$1["overflow"];
@@ -924,6 +927,7 @@ interface Props$2 extends StyleProps {
     color?: ThemeColorName;
     children: ReactNode;
     onClick?: () => void;
+    onDoubleClick?: () => void;
 }
 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">;
@@ -1285,4 +1289,4 @@ declare module "react" {
     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, 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 };
+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, FullscreenDialog, 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.js

@@ -50,6 +50,7 @@ __export(src_exports, {
   DropdownMenu: () => DropdownMenu,
   FillInputField: () => FillInputField,
   FillPreviewBackground: () => FillPreviewBackground,
+  FullscreenDialog: () => FullscreenDialog,
   GlobalInputBlurProvider: () => GlobalInputBlurProvider,
   GradientPicker: () => GradientPicker,
   GridView: () => GridView,
@@ -574,6 +575,28 @@ var Dialog = (0, import_react7.forwardRef)(function Dialog2({
     children
   ));
 });
+var FullscreenDialog = (0, import_react7.forwardRef)(function FullscreenDialog2({ style, ...rest }, forwardedRef) {
+  return /* @__PURE__ */ import_react7.default.createElement(
+    Dialog,
+    {
+      ref: forwardedRef,
+      style: {
+        width: "100%",
+        height: "100%",
+        maxWidth: "100%",
+        maxHeight: "100%",
+        top: "0",
+        left: "0",
+        transform: "none",
+        display: "flex",
+        flexDirection: "column",
+        padding: 0,
+        ...style
+      },
+      ...rest
+    }
+  );
+});
 
 // src/components/InputField.tsx
 var import_noya_icons2 = require("@noya-app/noya-icons");
@@ -1828,6 +1851,7 @@ var ChipElement = import_styled_components16.default.span(({ theme, colorScheme,
     display: "inline-flex",
     alignItems: "center",
     lineHeight: "1.4",
+    whiteSpace: "pre",
     ...size2 === "medium" ? {
       fontSize: "11px",
       padding: "4px 8px"
@@ -4795,7 +4819,7 @@ var Slider = function Slider2({
 var SwitchPrimitive = __toESM(require("@radix-ui/react-switch"));
 var import_react38 = __toESM(require("react"));
 var import_styled_components33 = __toESM(require("styled-components"));
-var SwitchRoot = (0, import_styled_components33.default)(SwitchPrimitive.Root)(({ theme, variant }) => ({
+var SwitchRoot = (0, import_styled_components33.default)(SwitchPrimitive.Root)(({ theme, colorScheme: variant }) => ({
   all: "unset",
   width: 32,
   height: 19,
@@ -4827,12 +4851,12 @@ var SwitchThumb = (0, import_styled_components33.default)(SwitchPrimitive.Thumb)
 var Switch = function Switch2({
   value,
   onChange,
-  variant = "normal"
+  colorScheme = "normal"
 }) {
   return /* @__PURE__ */ import_react38.default.createElement(
     SwitchRoot,
     {
-      variant,
+      colorScheme,
       checked: value,
       onCheckedChange: (newValue) => {
         onChange(newValue);
@@ -5427,6 +5451,7 @@ var DimensionInput = (0, import_react42.memo)(function DimensionInput2({
   DropdownMenu,
   FillInputField,
   FillPreviewBackground,
+  FullscreenDialog,
   GlobalInputBlurProvider,
   GradientPicker,
   GridView,