@noya-app/noya-designsystem 0.1.21 → 0.1.22

package/src/components/internal/Menu.tsx

@@ -1,5 +1,5 @@
 import { getShortcutDisplayParts } from "@noya-app/noya-keymap";
-import React, { memo, ReactElement, ReactNode } from "react";
+import React, { memo, ReactNode } from "react";
 import styled, { CSSObject } from "styled-components";
 import { useDesignSystemConfiguration } from "../../contexts/DesignSystemConfiguration";
 import { Theme } from "../../theme";
@@ -63,7 +63,7 @@ export type RegularMenuItem<T extends string> = {
   shortcut?: string;
   checked?: boolean;
   disabled?: boolean;
-  icon?: ReactElement;
+  icon?: ReactNode;
   items?: MenuItem<T>[];
   role?: MenuItemRole;
 };

package/src/index.tsx

@@ -41,6 +41,7 @@ export * from "./components/Progress";
 export * from "./components/RadioGroup";
 export * from "./components/ScrollArea";
 export * from "./components/Select";
+export * from "./components/SelectMenu";
 export * from "./components/Slider";
 export * from "./components/Sortable";
 export type { RelativeDropPosition } from "./components/Sortable";

package/src/theme/light.ts

@@ -181,7 +181,8 @@ export const textStyles = {
     fontFamily: fonts.normal,
     fontSize: "0.62rem",
     fontWeight: 400,
-    lineHeight: "1.4",
+    lineHeight: "19px",
+    // lineHeight: "1.4",
     textTransform: "uppercase",
     letterSpacing: "-0.3px",
   } as CSSObject,

package/src/utils/breakpoints.ts

@@ -1,4 +1,4 @@
-import { CSSObject } from 'styled-components';
+import { CSSObject } from "styled-components";
 
 type BreakpointKey = number | string;
 
@@ -11,15 +11,15 @@ export type BreakpointCollection<T extends object> =
 export type StyleMap = Record<string, CSSObject>;
 
 export function mergeBreakpoints(
-  breakpoints: BreakpointCollection<CSSObject>,
+  breakpoints: BreakpointCollection<CSSObject>
 ): StyleMap;
 export function mergeBreakpoints<T extends object>(
   breakpoints: BreakpointCollection<T>,
-  transform?: (value: T) => CSSObject,
+  transform?: (value: T) => CSSObject
 ): StyleMap;
 export function mergeBreakpoints<T extends object>(
   breakpoints: BreakpointCollection<T>,
-  transform?: (value: T) => CSSObject,
+  transform?: (value: T) => CSSObject
 ): StyleMap {
   const breakpointMap = Array.isArray(breakpoints)
     ? breakpoints.reduce(
@@ -28,7 +28,7 @@ export function mergeBreakpoints<T extends object>(
           result[key] = result[key] ? { ...result[key], ...value } : value;
           return result;
         },
-        {},
+        {}
       )
     : breakpoints;
 
@@ -37,7 +37,7 @@ export function mergeBreakpoints<T extends object>(
   const transformedList = breakpointList
     .sort((a, b) => Number(b[0]) - Number(a[0]))
     .map(([width, value]: Breakpoint<T>) => [
-      `@media screen and (max-width: ${width}px)`,
+      `@media (min-width: ${width}px)`,
       transform?.(value) ?? value,
     ]);