@manifest-ui/styled-system - npm Package Compare versions

Comparing version 0.0.2 to 0.0.3

dts/types.d.ts

 import * as CSS from 'csstype';
 import { BackgroundProps, BorderProps, ColorProps, FlexboxProps, GridProps, LayoutProps, OtherProps, PositionProps, ShadowProps, SpaceProps, TransitionProps, TypographyProps } from './props';
 export declare type Cache = Map<string, any>;
+export interface Color {
+    50: CSS.Property.Color;
+    100: CSS.Property.Color;
+    200: CSS.Property.Color;
+    300: CSS.Property.Color;
+    400: CSS.Property.Color;
+    500: CSS.Property.Color;
+    600: CSS.Property.Color;
+    700: CSS.Property.Color;
+    800: CSS.Property.Color;
+    900: CSS.Property.Color;
+}
+export interface ColorMode {
+    background?: Record<string, CSS.Property.Color>;
+    black?: CSS.Property.Color;
+    border?: CSS.Property.Color;
+    emphasis?: Record<string, CSS.Property.Color>;
+    fill?: Record<string, Partial<Color>>;
+    neutral?: Partial<Color>;
+    primary?: Partial<Color>;
+    secondary?: Partial<Color>;
+    status?: Record<string, Partial<Color>>;
+    white?: CSS.Property.Color;
+}
+export declare type Colors = ColorMode & {
+    modes?: {
+        [key in Mode]: ColorMode;
+    };
+};
 export interface ConfigStyle {
@@ -20,6 +49,7 @@ defaultScale?: Array<string | number>;
 export interface ComponentOverride {
-    overrides?: SystemStyleObject;
+    slots?: Record<string, SystemStyleObject>;
     sizes?: Record<string, SystemStyleObject>;
     variants?: Record<string, SystemStyleObject>;
 }
+export declare type Direction = 'ltr' | 'rtl';
 export interface FunctionCSSInterpolation {
@@ -29,2 +59,3 @@ (theme: Theme): CSSObject;
 export declare type Length = string | 0 | number;
+export declare type Mode = 'dark' | 'light';
 export declare type ObjectOrArray<T, K extends keyof any = keyof any> = T[] | Record<K, T | Record<K, T> | T[]>;
@@ -62,6 +93,6 @@ export declare type Prop<T> = T | ResponsiveValue<T> | ((theme: Theme) => T | ResponsiveValue<T>);
     breakpoints?: ObjectOrArray<number | string | symbol>;
-    colors?: ObjectOrArray<CSS.Property.Color>;
+    colors?: Colors;
     components?: Record<string, ComponentOverride>;
-    fontSizes?: ObjectOrArray<CSS.Property.FontSize<number>>;
     fonts?: ObjectOrArray<CSS.Property.FontFamily>;
+    fontSizes?: ObjectOrArray<CSS.Property.FontSize<string | number>>;
     fontWeights?: ObjectOrArray<CSS.Property.FontWeight>;
@@ -73,3 +104,2 @@ lineHeights?: ObjectOrArray<CSS.Property.LineHeight<Length>>;
     };
-    opacities?: ObjectOrArray<CSS.Property.Opacity>;
     radii?: ObjectOrArray<CSS.Property.BorderRadius<Length>>;
@@ -76,0 +106,0 @@ shadows?: ObjectOrArray<CSS.Property.BoxShadow>;

package.json

 {
   "name": "@manifest-ui/styled-system",
-  "version": "0.0.2",
+  "version": "0.0.3",
   "main": "./lib/index.js",
@@ -5,0 +5,0 @@ "types": "./dts/index.d.ts",

src/types.ts

@@ -19,2 +19,34 @@ import * as CSS from 'csstype';
 
+export interface Color {
+  50: CSS.Property.Color;
+  100: CSS.Property.Color;
+  200: CSS.Property.Color;
+  300: CSS.Property.Color;
+  400: CSS.Property.Color;
+  500: CSS.Property.Color;
+  600: CSS.Property.Color;
+  700: CSS.Property.Color;
+  800: CSS.Property.Color;
+  900: CSS.Property.Color;
+}
+
+export interface ColorMode {
+  background?: Record<string, CSS.Property.Color>;
+  black?: CSS.Property.Color;
+  border?: CSS.Property.Color;
+  emphasis?: Record<string, CSS.Property.Color>;
+  fill?: Record<string, Partial<Color>>;
+  neutral?: Partial<Color>;
+  primary?: Partial<Color>;
+  secondary?: Partial<Color>;
+  status?: Record<string, Partial<Color>>;
+  white?: CSS.Property.Color;
+}
+
+export type Colors = ColorMode & {
+  modes?: {
+    [key in Mode]: ColorMode;
+  };
+};
+
 export interface ConfigStyle {
@@ -43,3 +75,3 @@ defaultScale?: Array<string | number>;
 export interface ComponentOverride {
-  overrides?: SystemStyleObject;
+  slots?: Record<string, SystemStyleObject>;
   sizes?: Record<string, SystemStyleObject>;
@@ -49,2 +81,4 @@ variants?: Record<string, SystemStyleObject>;
 
+export type Direction = 'ltr' | 'rtl';
+
 export interface FunctionCSSInterpolation {
@@ -56,2 +90,4 @@ (theme: Theme): CSSObject;
 
+export type Mode = 'dark' | 'light';
+
 export type ObjectOrArray<T, K extends keyof any = keyof any> =
@@ -121,6 +157,6 @@ | T[]
   breakpoints?: ObjectOrArray<number | string | symbol>;
-  colors?: ObjectOrArray<CSS.Property.Color>;
+  colors?: Colors;
   components?: Record<string, ComponentOverride>;
-  fontSizes?: ObjectOrArray<CSS.Property.FontSize<number>>;
   fonts?: ObjectOrArray<CSS.Property.FontFamily>;
+  fontSizes?: ObjectOrArray<CSS.Property.FontSize<string | number>>;
   fontWeights?: ObjectOrArray<CSS.Property.FontWeight>;
@@ -130,3 +166,2 @@ lineHeights?: ObjectOrArray<CSS.Property.LineHeight<Length>>;
   mediaQueries?: { [size: string]: string };
-  opacities?: ObjectOrArray<CSS.Property.Opacity>;
   radii?: ObjectOrArray<CSS.Property.BorderRadius<Length>>;
@@ -133,0 +168,0 @@ shadows?: ObjectOrArray<CSS.Property.BoxShadow>;

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

97710

increased by1.73%

Lines of code

2802

increased by2.19%

No dependency changes