@prop-styles/core - npm Package Compare versions

Comparing version 0.0.1 to 0.0.2

dist/index.es.js

@@ -7,24 +7,24 @@ /*!
  */
-function c(n) {
-  return typeof n == "string" ? /^-?\d+(\.\d+)?$/.test(n) : d(n);
+function u(n) {
+  return typeof n == "string" ? /^-?\d+(\.\d+)?$/.test(n) : a(n);
 }
-function d(n) {
+function a(n) {
   return Number.isFinite(n);
 }
-function u(n) {
+function d(n) {
   return typeof n > "u" || n === null;
 }
-function e(n, i = "px") {
-  if (c(n))
-    return `${n}${i}`;
+function e(n, r = "px") {
+  if (u(n))
+    return `${n}${r}`;
   if (n && typeof n == "string") {
     const t = n.trim().replace(/\s{2,}/g, " ");
-    return /^(-?\d+(\.\d+)?([a-z]+|%)?\s*)+$/i.test(t) && /(\d+\s|\s\d+$)/.test(t) ? t.trim().split(" ").map((r) => e(r, i)).join(" ") : t;
+    return /^(-?\d+(\.\d+)?([a-z]+|%)?\s*)+$/i.test(t) && /(\d+\s|\s\d+$)/.test(t) ? t.trim().split(" ").map((i) => e(i, r)).join(" ") : t;
   }
   return "";
 }
-function p(n = "", i = "-") {
+function p(n = "", r = "-") {
   return n.replace(
     /[A-Z]/g,
-    (t, r) => `${r > 0 ? i : ""}${t.toLowerCase()}`
+    (t, i) => `${i > 0 ? r : ""}${t.toLowerCase()}`
   );
@@ -39,7 +39,7 @@ }
 }
-function o(n, i, t) {
-  return u(i) || i === !1 ? null : [n, t ?? i];
+function o(n, r, t) {
+  return !r && r !== 0 ? null : [n, t ?? String(r)];
 }
-function f(n, i) {
-  return n.reduce((t, r) => (t[r] = (l) => i(r, l), t), {});
+function f(n, r) {
+  return n.reduce((t, i) => (t[i] = (l) => r(i, l), t), {});
 }
@@ -49,3 +49,3 @@ function y(n) {
     n,
-    (i, t) => o("display", t, p(i))
+    (r, t) => o("display", t, p(r))
   );
@@ -56,7 +56,7 @@ }
     n,
-    (i, t) => o(i, t, e(t))
+    (r, t) => o(r, t, e(t))
   );
 }
 function k(n) {
-  return f(n, (i, t) => [i, t]);
+  return f(n, (r, t) => [r, t]);
 }
@@ -68,12 +68,12 @@ const P = /^-?\d+(\.\d+)?[a-z]+$/i;
 function W(n) {
-  return u(n) ? null : c(n) || R(n) ? ["borderWidth", e(n)] : b(n) ? ["borderColor", n] : ["border", String(n)];
+  return d(n) ? null : u(n) || R(n) ? ["borderWidth", e(n)] : b(n) ? ["borderColor", n] : ["border", String(n)];
 }
-function _(n, i, t) {
-  let r;
+function _(n, r, t) {
+  let i;
   for (const l of Object.keys(n))
-    if (r = i[l], r) {
-      const s = r(n[l], n);
+    if (i = r[l], i) {
+      const s = i(n[l], n);
       if (s) {
-        const [a, g] = s;
-        t[a] = g;
+        const [c, g] = s;
+        t[c] = g;
       }
@@ -138,13 +138,14 @@ }
 };
-function L(n, i) {
+function L(n, r) {
   const t = {
     ...n.style
-  }, r = {
+  }, i = {
     ...E,
-    ...i
+    ...r
   };
-  return _(n, r, t), t;
+  return _(n, i, t), t;
 }
 export {
-  L as createPropStyles
+  L as createPropStyles,
+  o as formatReturn
 };

dist/index.umd.js

@@ -1,2 +0,2 @@
-(function(r,o){typeof exports=="object"&&typeof module<"u"?o(exports):typeof define=="function"&&define.amd?define(["exports"],o):(r=typeof globalThis<"u"?globalThis:r||self,o(r["prop-styles-core"]={}))})(this,function(r){"use strict";/*!
+(function(r,f){typeof exports=="object"&&typeof module<"u"?f(exports):typeof define=="function"&&define.amd?define(["exports"],f):(r=typeof globalThis<"u"?globalThis:r||self,f(r["prop-styles-core"]={}))})(this,function(r){"use strict";/*!
  * zx-sml version 0.9.4
@@ -6,2 +6,2 @@ * Author: Capricorncd <[e-mail]>
  * Released on: 2024-04-14 23:53:59 (GMT+0900)
- */function o(n){return typeof n=="string"?/^-?\d+(\.\d+)?$/.test(n):a(n)}function a(n){return Number.isFinite(n)}function d(n){return typeof n>"u"||n===null}function s(n,e="px"){if(o(n))return`${n}${e}`;if(n&&typeof n=="string"){const t=n.trim().replace(/\s{2,}/g," ");return/^(-?\d+(\.\d+)?([a-z]+|%)?\s*)+$/i.test(t)&&/(\d+\s|\s\d+$)/.test(t)?t.trim().split(" ").map(i=>s(i,e)).join(" "):t}return""}function g(n="",e="-"){return n.replace(/[A-Z]/g,(t,i)=>`${i>0?e:""}${t.toLowerCase()}`)}function p(n){return typeof n=="boolean"}const h=/^(#[a-f0-9]{3,8}|(rgba?|hsla?|hwb|lab|lch|oklab|oklch|hwb|lch|light-dark)\(.+\))$/i;function m(n){return typeof n!="string"?!1:h.test(n)}function f(n,e,t){return d(e)||e===!1?null:[n,t??e]}function u(n,e){return n.reduce((t,i)=>(t[i]=l=>e(i,l),t),{})}function b(n){return u(n,(e,t)=>f("display",t,g(e)))}function y(n){return u(n,(e,t)=>f(e,t,s(t)))}function S(n){return u(n,(e,t)=>[e,t])}const P=/^-?\d+(\.\d+)?[a-z]+$/i;function k(n){return typeof n=="string"&&P.test(n)}function _(n){return d(n)?null:o(n)||k(n)?["borderWidth",s(n)]:m(n)?["borderColor",n]:["border",String(n)]}function R(n,e,t){let i;for(const l of Object.keys(n))if(i=e[l],i){const c=i(n[l],n);if(c){const[L,$]=c;t[L]=$}}}const W=["width","minWidth","maxWidth","height","minHeight","maxHeight","padding","paddingTop","paddingBottom","paddingLeft","paddingRight","paddingInline","paddingBlock","margin","marginTop","marginBottom","marginLeft","marginRight","marginInline","marginBlock","gap","fontSize","lineHeight"],w=["background","color"],C={radius:n=>["borderRadius",s(n)],align:n=>["alignItems",n??""],justify:n=>["justifyContent",n??""],column:n=>n?["flexDirection","column"]:null,wrap:n=>n?["flexWrap",p(n)?"wrap":n]:null,breakWord:n=>n?["overflowWrap","break-word"]:null,bold:n=>n?["fontWeight","bold"]:null,thin:n=>n?["fontWeight","500"]:null,...b(["flex","grid","inline","inlineFlex","inlineBlock"]),scroll:n=>n?[`overflow${typeof n=="string"?n.toUpperCase():""}`,"auto"]:null,...y(W),...S(w),border:n=>_(n),fs:n=>f("fontSize",n,s(n)),bg:n=>f("background",n),fontWeight:n=>f("fontWeight",n),fw:n=>f("fontWeight",n)};function E(n,e){const t={...n.style},i={...C,...e};return R(n,i,t),t}r.createPropStyles=E,Object.defineProperty(r,Symbol.toStringTag,{value:"Module"})});
+ */function f(n){return typeof n=="string"?/^-?\d+(\.\d+)?$/.test(n):c(n)}function c(n){return Number.isFinite(n)}function g(n){return typeof n>"u"||n===null}function l(n,i="px"){if(f(n))return`${n}${i}`;if(n&&typeof n=="string"){const t=n.trim().replace(/\s{2,}/g," ");return/^(-?\d+(\.\d+)?([a-z]+|%)?\s*)+$/i.test(t)&&/(\d+\s|\s\d+$)/.test(t)?t.trim().split(" ").map(e=>l(e,i)).join(" "):t}return""}function a(n="",i="-"){return n.replace(/[A-Z]/g,(t,e)=>`${e>0?i:""}${t.toLowerCase()}`)}function p(n){return typeof n=="boolean"}const m=/^(#[a-f0-9]{3,8}|(rgba?|hsla?|hwb|lab|lch|oklab|oklch|hwb|lch|light-dark)\(.+\))$/i;function h(n){return typeof n!="string"?!1:m.test(n)}function o(n,i,t){return!i&&i!==0?null:[n,t??String(i)]}function u(n,i){return n.reduce((t,e)=>(t[e]=s=>i(e,s),t),{})}function b(n){return u(n,(i,t)=>o("display",t,a(i)))}function y(n){return u(n,(i,t)=>o(i,t,l(t)))}function S(n){return u(n,(i,t)=>[i,t])}const P=/^-?\d+(\.\d+)?[a-z]+$/i;function R(n){return typeof n=="string"&&P.test(n)}function k(n){return g(n)?null:f(n)||R(n)?["borderWidth",l(n)]:h(n)?["borderColor",n]:["border",String(n)]}function _(n,i,t){let e;for(const s of Object.keys(n))if(e=i[s],e){const d=e(n[s],n);if(d){const[L,$]=d;t[L]=$}}}const W=["width","minWidth","maxWidth","height","minHeight","maxHeight","padding","paddingTop","paddingBottom","paddingLeft","paddingRight","paddingInline","paddingBlock","margin","marginTop","marginBottom","marginLeft","marginRight","marginInline","marginBlock","gap","fontSize","lineHeight"],w=["background","color"],C={radius:n=>["borderRadius",l(n)],align:n=>["alignItems",n??""],justify:n=>["justifyContent",n??""],column:n=>n?["flexDirection","column"]:null,wrap:n=>n?["flexWrap",p(n)?"wrap":n]:null,breakWord:n=>n?["overflowWrap","break-word"]:null,bold:n=>n?["fontWeight","bold"]:null,thin:n=>n?["fontWeight","500"]:null,...b(["flex","grid","inline","inlineFlex","inlineBlock"]),scroll:n=>n?[`overflow${typeof n=="string"?n.toUpperCase():""}`,"auto"]:null,...y(W),...S(w),border:n=>k(n),fs:n=>o("fontSize",n,l(n)),bg:n=>o("background",n),fontWeight:n=>o("fontWeight",n),fw:n=>o("fontWeight",n)};function E(n,i){const t={...n.style},e={...C,...i};return _(n,e,t),t}r.createPropStyles=E,r.formatReturn=o,Object.defineProperty(r,Symbol.toStringTag,{value:"Module"})});

dist/types.d.ts

@@ -6,2 +6,3 @@ /**
 export function createPropStyles<T extends BaseProps>(props: T, mappings?: PropMappings): Record<string, string>;
+export function formatReturn(key: string, value: V, strValue?: string): PropMappingHandlerReturn;
 export interface BaseProps {
@@ -8,0 +9,0 @@ // style

package.json

 {
   "name": "@prop-styles/core",
-  "version": "0.0.1",
-  "description": "",
+  "version": "0.0.2",
+  "description": "The library provides a static method createPropStyles to create Style objects.",
   "main": "src/index.ts",
@@ -21,4 +21,5 @@ "type": "module",
   "scripts": {
-    "build": "vite build --emptyOutDir && npm run docs",
+    "build": "vite build --emptyOutDir",
     "docs": "node scripts/docs.mjs",
+    "pl": "npm run build && npm run docs && npm publish",
     "eslint": "eslint . --fix --ext .js,.jsx,.cjs,.mjs,.ts,.tsx",
@@ -25,0 +26,0 @@ "test": "vitest"

README.md

 # @prop-styles/core
 
-The library provides a static method [createPropStyles](#createPropStyles) to create Style objects.
+<p>
+<a href="https://npmcharts.com/compare/@prop-styles/core?minimal=true"><img src="https://img.shields.io/npm/dm/@prop-styles/core.svg?sanitize=true" alt="Downloads"></a>
+<a href="https://www.npmjs.com/package/@prop-styles/core"><img src="https://img.shields.io/npm/v/@prop-styles/core.svg?sanitize=true" alt="Version"></a>
+<a href="https://www.npmjs.com/package/@prop-styles/core"><img src="https://img.shields.io/npm/l/@prop-styles/core.svg?sanitize=true" alt="License"></a>
+</p>
 
+The library provides a static method [createPropStyles](#createpropstylesprops-mappings) to create Style objects.
+
 ```bash
@@ -10,7 +16,10 @@ npm i @prop-styles/core
 Example
+
 ```js
-import { createPropStyles } from '@prop-styles/core'
+import { createPropStyles, formatReturn } from '@prop-styles/core'
 
 const style = createPropStyles({ color: 'red', width: 100 }, {
-  color: (value) => ['--color-primary', 'red']
+  color: (value) => value ? ['--color-primary', value] : null
+  // or use formatReturn to make null judgment
+  // color: (value) => formatReturn('--color-primary', value)
 })
@@ -28,2 +37,13 @@
 
+Example
+
+```js
+const props = { width: 100, color: '#fff' }
+
+createPropStyles(props, {
+  // custom mapping handler
+  color: (value) => ['--color', value]
+}) // { width: '100px', '--color', '#fff' }
+```
+
 Param|Types|Required|Description
@@ -38,2 +58,28 @@ :--|:--|:--|:--
 
+### formatReturn(key, value, strValue)
+
+Used for [PropMappingHandler](#PropMappingHandler) processing. When `value` is `null/undefined/''/false`, return null, otherwise return the specified value.
+
+Example
+
+```js
+formatReturn('width', 100) // ['width', '100']
+formatReturn('width', '100px') // ['width', '100px']
+formatReturn('width', 100, '100%') // ['width', '100%']
+
+formatReturn('key', false) // null
+formatReturn('key', '') // null
+formatReturn('key', undefined) // null
+formatReturn('key', null) // null
+formatReturn('key', null, 'stringValue') // null
+```
+
+Param|Types|Required|Description
+:--|:--|:--|:--
+key|`string`|yes|The PropMappingHandlerReturn `key` or customize `key`
+value|`V`|yes|The `props[prop]'s value`
+strValue|`string`|no|Customize the `value` of PropMappingHandlerReturn
+
+- @returns `PropMappingHandlerReturn` see [PropMappingHandlerReturn](#PropMappingHandlerReturn)
+
 ## Types
@@ -166,2 +212,4 @@
 
+PropMappings processing function, returns [PropMappingHandlerReturn](#PropMappingHandlerReturn)
+
 Prop|Types|Required|Description
@@ -186,2 +234,4 @@ :--|:--|:--|:--
 
+[PropMappingHandler](#PropMappingHandler)
+
 Prop|Types|Required|Description
@@ -188,0 +238,0 @@ :--|:--|:--|:--

src/index.ts

@@ -8,1 +8,2 @@ /**
 export * from './styles'
+export { formatReturn } from './utils'

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

15761

increased by16.03%

Lines of code

244

increased by1.24%

Number of lines in readme file

250

increased by25%

No dependency changes