@kaze-style/core - npm Package Compare versions

Comparing version 0.5.2 to 0.5.3

dist/__preGlobalStyle.d.ts

@@ -6,5 +6,5 @@ import type { CssRules, KazeGlobalStyle } from './types/style';
 };
-export declare const __preGlobalStyle: <Selector extends string>(globalStyles: Record<Selector, KazeGlobalStyle>, forBuild: {
+export declare const __preGlobalStyle: (globalStyles: KazeGlobalStyle, forBuild: {
     fileName: string;
     globalStyles: ForBuildGlobalStyle[];
 }, fileName: string, index: number) => void;

dist/__preGlobalStyle.js

@@ -1,1 +0,1 @@
-import{createGlobalStyle as r}from"./createGlobalStyle";const y=(l,e,t,s)=>{const{cssRules:o}=r(l);e.fileName===t&&e.globalStyles.push({cssRules:o,index:s})};export{y as __preGlobalStyle};
+import{createGlobalStyle as a}from"./createGlobalStyle";const y=(e,l,s,t)=>{const{cssRules:o}=a(e);l.fileName===s&&l.globalStyles.push({cssRules:o,index:t})};export{y as __preGlobalStyle};

dist/resolveStyle.js

@@ -1,1 +0,1 @@
-import{combinedQuery as f}from"./utils/combinedQuery";import{compileCSS as N}from"./utils/compileCSS";import{compileKeyFrameCSS as b}from"./utils/compileKeyFrameCSS";import{hashClassName as h}from"./utils/hashClassName";import{hashSelector as u}from"./utils/hashSelector";import{hyphenateProperty as R}from"./utils/hyphenateProperty";import{isLayerSelector as g}from"./utils/isLayerSelector";import{isMediaQuerySelector as C}from"./utils/isMediaQuerySelector";import{isNestedSelector as O}from"./utils/isNestedSelector";import{isObject as j}from"./utils/isObject";import{isShortHandProperty as K}from"./utils/isShortHandProperty";import{isSupportQuerySelector as Q}from"./utils/isSupportQuerySelector";import{normalizeNestedProperty as z}from"./utils/normalizeNestedProperty";import{omit as A}from"./utils/omit";import{resolveShortHandStyle as P}from"./utils/resolveShortHandStyle";const a=({style:y,pseudo:m="",media:i="",layer:o="",support:c="",resolvedStyle:r={classNameObject:{},cssRules:[]}})=>{for(const p in y){const e=p,s=y[e];if(typeof s=="string"||typeof s=="number"||Array.isArray(s))if(K(e)){const t=P(e,s);a({style:Object.assign(A(y,[e]),t),pseudo:m,media:i,layer:o,support:c,resolvedStyle:r})}else{const t=R(e),l=h({media:i,pseudo:m,property:t,layer:o,support:c,styleValue:s}),n=u({media:i,pseudo:m,layer:o,support:c,property:t}),S=N({media:i,pseudo:m,property:t,layer:o,support:c,styleValue:s,className:l});r.cssRules.push(S),Object.assign(r.classNameObject,{[n]:l})}else if(e==="animationName"){const t=s,{keyframesRule:l,keyframeName:n}=b(t);r.cssRules.push(l),Object.assign(r.classNameObject,{[n]:n}),a({style:{animationName:n},pseudo:m,media:i,layer:o,support:c,resolvedStyle:r})}else if(j(s))if(C(e)){const t=f(i,e.slice(6).trim());a({style:s,pseudo:m,layer:o,media:t,support:c,resolvedStyle:r})}else if(g(e)){const t=(o?`${o}.`:"")+e.slice(6).trim();a({style:s,pseudo:m,layer:t,media:i,support:c,resolvedStyle:r})}else if(Q(e)){const t=f(c,e.slice(9).trim());a({style:s,pseudo:m,layer:o,media:i,support:t,resolvedStyle:r})}else O(e)&&a({style:s,pseudo:m+z(e),media:i,layer:o,support:c,resolvedStyle:r})}return r};export{a as resolveStyle};
+import{combinedQuery as f}from"./utils/combinedQuery";import{compileCSS as u}from"./utils/compileCSS";import{compileKeyFrameCSS as N}from"./utils/compileKeyFrameCSS";import{hashClassName as b}from"./utils/hashClassName";import{hashSelector as h}from"./utils/hashSelector";import{hyphenateProperty as R}from"./utils/hyphenateProperty";import{isLayerSelector as g}from"./utils/isLayerSelector";import{isMediaQuerySelector as C}from"./utils/isMediaQuerySelector";import{isNestedSelector as O}from"./utils/isNestedSelector";import{isObject as j}from"./utils/isObject";import{isShortHandProperty as K}from"./utils/isShortHandProperty";import{isSupportQuerySelector as Q}from"./utils/isSupportQuerySelector";import{normalizeNestedProperty as z}from"./utils/normalizeNestedProperty";import{omit as A}from"./utils/omit";import{resolveShortHandStyle as P}from"./utils/resolveShortHandStyle";const a=({style:y,pseudo:m="",media:i="",layer:o="",support:c="",resolvedStyle:r={classNameObject:{},cssRules:[]}})=>{for(const p in y){const e=p,s=y[e];if(typeof s=="string"||typeof s=="number"||Array.isArray(s))if(K(e)){const t=P(e,s);a({style:Object.assign(A(y,[e]),t),pseudo:m,media:i,layer:o,support:c,resolvedStyle:r})}else{const t=R(e),l=b({media:i,pseudo:m,property:t,layer:o,support:c,styleValue:s}),n=h({media:i,pseudo:m,layer:o,support:c,property:t}),S=u({media:i,pseudo:m,property:t,layer:o,support:c,styleValue:s,className:l});r.cssRules.push(S),Object.assign(r.classNameObject,{[n]:l})}else if(e==="animationName"){const t=s,{keyframesRule:l,keyframeName:n}=N(t);r.cssRules.push(l),Object.assign(r.classNameObject,{[n]:n}),a({style:{animationName:n},pseudo:m,media:i,layer:o,support:c,resolvedStyle:r})}else if(j(s))if(C(e)){const t=f(i,e.slice(6).trim());a({style:s,pseudo:m,layer:o,media:t,support:c,resolvedStyle:r})}else if(g(e)){const t=(o?`${o}.`:"")+e.slice(6).trim();a({style:s,pseudo:m,layer:t,media:i,support:c,resolvedStyle:r})}else if(Q(e)){const t=f(c,e.slice(9).trim());a({style:s,pseudo:m,layer:o,media:i,support:t,resolvedStyle:r})}else O(e)&&a({style:s,pseudo:m+z(e),media:i,layer:o,support:c,resolvedStyle:r})}return r};export{a as resolveStyle};

dist/types/style.d.ts

 import type { Pseudos, PropertiesFallback, PropertiesHyphenFallback, AtRule } from 'csstype';
 import type { ClassName } from '../ClassName';
-import type { NestedObject, TrimPrefix } from './utils';
+import type { AndArray, NestedObject, TrimPrefix } from './utils';
 export declare type CSSValue = string | number;
-declare type CSSPseudos = {
-    [_ in Pseudos]?: SupportedAllStyle;
-};
 declare type PredictType = '@media screen and (max-width: 0)' | '@media screen and (min-width: 0)' | '@media (prefers-color-scheme: dark)' | '@media (prefers-color-scheme: light)' | '@layer utilities' | '@layer base' | '@supports ()' | '@supports not ()';
@@ -12,5 +9,10 @@ declare type PredictTypeRules = {
 };
-export declare type CSSKeyframes = Record<'from' | 'to' | string, SupportedCSSProperties>;
+declare type CSSPseudosRules = {
+    [_ in Pseudos]?: SupportedAllStyle;
+};
+export declare type CSSKeyframesRules = {
+    [_ in 'from' | 'to' | string]?: SupportedCSSProperties;
+};
 declare type CSSAnimationNameProperty = {
-    animationName?: CSSKeyframes | string;
+    animationName?: CSSKeyframesRules | string;
 };
@@ -22,10 +24,12 @@ declare const supportShorthandProperties: readonly ["margin", "padding", "gap", "inset", "overflow", "outline", "borderRadius"];
 export declare type SupportedCSSProperties = Omit<PropertiesFallback<CSSValue> & PropertiesHyphenFallback<CSSValue> & SupportShorthandProperties, 'animationName' | 'animation-name'>;
-declare type SupportedAllStyle = SupportedCSSProperties & CSSPseudos & PredictTypeRules & CSSAnimationNameProperty;
+declare type SupportedAllStyle = SupportedCSSProperties & CSSPseudosRules & PredictTypeRules & CSSAnimationNameProperty;
 export declare type KazeStyle = NestedObject<NestedObject<NestedObject<NestedObject<NestedObject<SupportedAllStyle>>>>>;
 declare type SupportedGlobalStyle = PropertiesFallback<CSSValue> & PropertiesHyphenFallback<CSSValue>;
-declare type FontFace = {
-    '@font-face'?: AtRule.FontFaceFallback<CSSValue> & AtRule.FontFaceHyphenFallback<CSSValue>;
-};
-declare type PredictGlobalType = 'body' | 'html' | '*' | '::before,::after' | '*,::before,::after';
-export declare type KazeGlobalStyle = FontFace | Record<string | PredictGlobalType, SupportedGlobalStyle>;
+declare type FontFaceStyle = AtRule.FontFaceFallback<CSSValue> & AtRule.FontFaceHyphenFallback<CSSValue>;
+declare type PredictGlobalSelector = 'body' | 'html' | '*' | '::before,::after' | '*,::before,::after';
+export declare type KazeGlobalStyle = {
+    '@font-face'?: FontFaceStyle;
+} & {
+    [_ in PredictGlobalSelector]?: SupportedGlobalStyle;
+} & Record<string, SupportedGlobalStyle> & Record<string, Record<string, AndArray<CSSValue>>>;
 export declare type CssRules = string[];
@@ -32,0 +36,0 @@ export declare type Classes<K extends string> = Record<K, string>;

dist/utils/compileKeyFrameCSS.d.ts

@@ -1,5 +0,5 @@
-import type { CSSKeyframes } from '../types/style';
-export declare const compileKeyFrameCSS: (keyframeObject: CSSKeyframes) => {
+import type { CSSKeyframesRules } from '../types/style';
+export declare const compileKeyFrameCSS: (keyframeObject: CSSKeyframesRules) => {
     keyframesRule: string;
     keyframeName: string;
 };

package.json

 {
   "name": "@kaze-style/core",
-  "version": "0.5.2",
+  "version": "0.5.3",
   "license": "MIT",
@@ -5,0 +5,0 @@ "author": "Taishi Naritomi",

README.md

@@ -34,4 +34,6 @@ <div>
 
+### createStyle
+
 ```ts
-//Component.tsx
+//Button.tsx
 import { createStyle } from '@kaze-style/react';
@@ -45,3 +47,3 @@
 
-const Component = () => {
+const Button = () => {
   return <button className={classes.button}>button</button>;
@@ -51,2 +53,54 @@ };
 
+### mergeStyle
+
+```ts
+//Button.tsx
+import { createStyle, mergeStyle } from '@kaze-style/react';
+
+const classes = createStyle({
+  red: {
+    color: 'red',
+  },
+});
+
+const Button = (props) => {
+  return (
+    <button className={mergeStyle(classes.red, props.className)}>button</button>
+  );
+};
+```
+
+```ts
+//Component.tsx
+import { createStyle } from '@kaze-style/react';
+import { Button } from '@kaze-style/react';
+
+const classes = createStyle({
+  blue: {
+    color: 'blue',
+  },
+});
+
+const Component = () => {
+  return <Button className={classes.blue} />;
+};
+```
+
+### createGlobalStyle
+
+```ts
+//App.tsx
+import { createGlobalStyle } from '@kaze-style/react';
+
+createGlobalStyle({
+  html: {
+    color: 'red',
+  },
+});
+
+const App = () => {
+  return <div></div>;
+};
+```
+
 ### Setup Next.js（build time extract）
@@ -53,0 +107,0 @@

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

57301

increased by1.55%

Lines of code

246

increased by1.65%

Number of lines in readme file

134

increased by67.5%

No dependency changes