@cronocode/react-box 2.0.6 → 2.0.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/core.cjs +4 -4
  2. package/core.mjs +13 -13
  3. package/package.json +1 -1
package/core.cjs CHANGED
@@ -4,16 +4,16 @@ body{margin: 0;line-height: var(--lineHeight);font-size: var(--fontSize);}
4
4
  a,ul{all: unset;}
5
5
  .${e.boxClassName}{display: block;border: 0 solid var(--borderColor);outline: 0px solid var(--outlineColor);margin: 0;padding: 0;background-color: initial;transition: all var(--transitionTime);box-sizing: border-box;font-family: inherit;font-size: inherit;}
6
6
  .${e.svgClassName}{display: block;border: 0 solid var(--borderColor);outline: 0px solid var(--outlineColor);margin: 0;padding: 0;transition: all var(--svgTransitionTime);}.${e.svgClassName} path,.${e.svgClassName} circle,.${e.svgClassName} rect,.${e.svgClassName} line {transition: all var(--svgTransitionTime);}
7
- `,u=new ne;let n=!0,t={};k();function d(a,o,v){if(a in $)return C(a,o,v);if(ue.includes(a))return a+o}e.get=d;function p(){if(n){let a=m([l]);P.forEach(v=>{a=m(a,v)}),B.forEach(v=>{a.push(`@media(min-width: ${te[v]}px){`),a=m(a,void 0,v),P.forEach(V=>{a=m(a,V,v)}),a.push("}")});const o=r();o.innerHTML=a.join(""),n=!1}}e.flush=p;function k(){oe(),t=Object.keys($).reduce((o,v)=>(o[v]=new Set,o),{})}e.clear=k;function E(a,o,v){re(a,o,v).forEach(b=>{t[b]=new Set})}e.addCustomPseudoClass=E;function C(a,o,v){const V=(v??"")+a;t[V].has(o)||(n=!0,t[V].add(o));const b=`${V}${o}`;return process.env.NODE_ENV==="test"?b:u.getIdentity(b)}const i={hover:"hover",focus:"focus-within",hasFocus:"has(:focus-within)",active:"active",checked:"checked",hasChecked:"has(:checked)",indeterminate:"indeterminate",valid:"user-valid",hasValid:"has(:valid)",invalid:"user-invalid",hasInvalid:"has(:user-invalid)",required:"required",optional:"optional",disabled:"disabled",hasDisabled:"has(:disabled)"};function m(a,o,v){return Object.entries(t).filter(([b,x])=>{var N,y;return((N=$[b])==null?void 0:N.pseudoSuffix)===o&&((y=$[b])==null?void 0:y.breakpoint)===v&&x.size>0}).reduce((b,[x,N])=>(N.forEach(y=>{var L;const S=$[x],z=f(S,y),G=`.${C(x,y)}`,R=V(G,S,z,o?i[o]:void 0),g=((L=z.formatValue)==null?void 0:L.call(z,x,y))??y,ee=$[x].cssNames.map(se=>`${se}:${g};`).join("");b.push(`${R.join(",")}{${ee}}`)}),b),a);function V(b,x,N,y){let S=b;return y&&(S=x.customPseudoSuffix?`.${x.customPseudoSuffix}:${y} ${b}`:`${b}:${y}`),N.formatSelector?N.formatSelector(S):[S]}}function f(a,o){return a.isThemeStyle?a:a.values1.values.includes(o)?a.values1:a.values2.values.includes(o)?a.values2:a.values3}function r(){const o=typeof window<"u"&&typeof window.document<"u"?window.document:global.document;let v=o.getElementById(e.cronoStylesElementId);return v||(v=o.createElement("style"),v.setAttribute("id",e.cronoStylesElementId),v.setAttribute("type","text/css"),o.head.insertBefore(v,o.head.firstChild)),v}e.getElement=r})(D||(D={}));const T=D,ie={button:{styles:{display:"inline-block",p:3,cursor:"pointer",b:1,borderRadius:1,userSelect:"none",disabled:{cursor:"default"}}},checkbox:{styles:{display:"inline-block"}},radioButton:{styles:{display:"inline-block",b:1,p:2}},textbox:{styles:{display:"inline-block",b:1,borderRadius:1,p:3}},textarea:{styles:{display:"inline-block",b:1,borderRadius:1}}};var q;(e=>{e.Styles={};function l(i){e.Styles=t(ie),n(i)}e.setup=l;function u(i,m){const{colors:f={},shadows:r={},backgrounds:a={},backgroundImages:o={}}=i;f.none="none",r.none="none",a.none="none",o.none="none";const v=Object.entries(f).map(([g,j])=>`--color${g}: ${j};`).join(`
7
+ `,u=new ne;let n=!0,t={};k();function d(a,o,v){if(a in $)return C(a,o,v);if(ue.includes(a))return a+o}e.get=d;function p(){if(n){let a=m([l]);P.forEach(v=>{a=m(a,v)}),B.forEach(v=>{a.push(`@media(min-width: ${te[v]}px){`),a=m(a,void 0,v),P.forEach(V=>{a=m(a,V,v)}),a.push("}")});const o=r();o.innerHTML=a.join(""),n=!1}}e.flush=p;function k(){oe(),t=Object.keys($).reduce((o,v)=>(o[v]=new Set,o),{})}e.clear=k;function E(a,o,v){re(a,o,v).forEach(b=>{t[b]=new Set})}e.addCustomPseudoClass=E;function C(a,o,v){const V=(v??"")+a;t[V].has(o)||(n=!0,t[V].add(o));const b=`${V}${o}`;return process.env.NODE_ENV==="test"?b:u.getIdentity(b)}const i={hover:"hover",focus:"focus-within",hasFocus:"has(:focus-within)",active:"active",checked:"checked",hasChecked:"has(:checked)",indeterminate:"indeterminate",valid:"user-valid",hasValid:"has(:valid)",invalid:"user-invalid",hasInvalid:"has(:user-invalid)",required:"required",optional:"optional",disabled:"disabled",hasDisabled:"has(:disabled)"};function m(a,o,v){return Object.entries(t).filter(([b,x])=>{var N,y;return((N=$[b])==null?void 0:N.pseudoSuffix)===o&&((y=$[b])==null?void 0:y.breakpoint)===v&&x.size>0}).reduce((b,[x,N])=>(N.forEach(y=>{var L;const S=$[x],T=f(S,y),G=`.${C(x,y)}`,R=V(G,S,T,o?i[o]:void 0),g=((L=T.formatValue)==null?void 0:L.call(T,x,y))??y,ee=$[x].cssNames.map(se=>`${se}:${g};`).join("");b.push(`${R.join(",")}{${ee}}`)}),b),a);function V(b,x,N,y){let S=b;return y&&(S=x.customPseudoSuffix?`.${x.customPseudoSuffix}:${y} ${b}`:`${b}:${y}`),N.formatSelector?N.formatSelector(S):[S]}}function f(a,o){return a.isThemeStyle?a:a.values1.values.includes(o)?a.values1:a.values2.values.includes(o)?a.values2:a.values3}function r(){const o=typeof window<"u"&&typeof window.document<"u"?window.document:global.document;let v=o.getElementById(e.cronoStylesElementId);return v||(v=o.createElement("style"),v.setAttribute("id",e.cronoStylesElementId),v.setAttribute("type","text/css"),o.head.insertBefore(v,o.head.firstChild)),v}e.getElement=r})(D||(D={}));const z=D,ie={button:{styles:{display:"inline-block",p:3,cursor:"pointer",b:1,borderRadius:1,userSelect:"none",disabled:{cursor:"default"}}},checkbox:{styles:{display:"inline-block"}},radioButton:{styles:{display:"inline-block",b:1,p:2}},textbox:{styles:{display:"inline-block",b:1,borderRadius:1,p:3}},textarea:{styles:{display:"inline-block",b:1,borderRadius:1}}};var q;(e=>{e.Styles={};function l(i){e.Styles=t(ie),n(i)}e.setup=l;function u(i,m){const{colors:f={},shadows:r={},backgrounds:a={},backgroundImages:o={}}=i;f.none="none",r.none="none",a.none="none",o.none="none";const v=Object.entries(f).map(([g,j])=>`--color${g}: ${j};`).join(`
8
8
  `),V=Object.entries(r).map(([g,j])=>`--shadow${g}: ${j};`).join(`
9
9
  `),b=Object.entries(a).map(([g,j])=>`--background${g}: ${j};`).join(`
10
10
  `),x=Object.entries(o).map(([g,j])=>`--backgroundImage${g}: ${j};`).join(`
11
- `),N=[":root {"];v&&N.push(` ${v}`),V&&N.push(` ${V}`),b&&N.push(` ${b}`),x&&N.push(` ${x}`),N.push("}");const y=Object.keys(f).map(g=>`'${g}'`).join(" | "),S=Object.keys(a).map(g=>`'${g}'`).join(" | "),z=Object.keys(o).map(g=>`'${g}'`).join(" | "),G=Object.keys(r).map(g=>`'${g}'`).join(" | "),R=`import '@cronocode/react-box';
11
+ `),N=[":root {"];v&&N.push(` ${v}`),V&&N.push(` ${V}`),b&&N.push(` ${b}`),x&&N.push(` ${x}`),N.push("}");const y=Object.keys(f).map(g=>`'${g}'`).join(" | "),S=Object.keys(a).map(g=>`'${g}'`).join(" | "),T=Object.keys(o).map(g=>`'${g}'`).join(" | "),G=Object.keys(r).map(g=>`'${g}'`).join(" | "),R=`import '@cronocode/react-box';
12
12
 
13
13
  declare module '${(m==null?void 0:m.namespacePath)??"@cronocode/react-box/core/types"}' {
14
14
  type ColorType = ${y};
15
15
  type BackgroundType = ${S};
16
- type BackgroundImageType = ${z};
16
+ type BackgroundImageType = ${T};
17
17
  type ShadowType = ${G};
18
18
 
19
19
  namespace Augmented {
@@ -34,4 +34,4 @@ a,ul{all: unset;}
34
34
  }
35
35
  }
36
36
  `;return{variables:N.join(`
37
- `),boxDts:R}}e.setupAugmentedProps=u;function n(i){const m=t(i);if(m.components)return Object.entries(m.components).forEach(([f,r])=>{var o;const a=(o=e.Styles.components)==null?void 0:o[f];a?e.Styles.components[f].styles={...a.styles,...r.styles}:e.Styles.components[f]=r}),m}function t(i){return d(i),p(i),E(i),i}function d(i){const{components:m,...f}=i,r=Object.entries(f);r.length&&!i.components&&(i.components={});for(const a of r){const[o,v]=a;i.components[o]=v,delete i[o]}}function p(i){if(!i.components)return;const m=Object.keys(i.components);for(const f of m){const r=i.components[f],a=k(f,r);delete r.children;for(const o of a){const[v,V]=o;i.components[v]=V}}}function k(i,m){if(!m.children)return[];const f=Object.keys(m.children),r=[];for(const a of f){const o=`${i}.${a}`,v=m.children[a],V=k(o,v);r.push(...V),delete v.children,r.push([o,v])}return r}function E(i){if(!i.components)return;const m=Object.values(i.components);for(const f of m)C(f.styles),B.forEach(r=>{if(r in f.styles){const a=f.styles[r];C(a)}}),f.themes&&Object.values(f.themes).forEach(r=>{C(r),B.forEach(a=>{if(a in r){const o=r[a];C(o)}})})}function C(i){P.forEach(m=>{if(m in i){const f=i[m];Object.entries(f).map(([r,a])=>{i[`${r}${m}`]=a}),delete i[m]}})}})(q||(q={}));const J=q;function ce(e){const{clean:l,theme:u,component:n}=e;return H.useMemo(()=>{var d,p;if(l)return;let t=(d=J.Styles.components)==null?void 0:d[n];if(t)return u?{...t.styles,...(p=t.themes)==null?void 0:p[u]}:t.styles},[n,l,u])}const me=typeof window<"u"&&typeof window.document<"u",de=me?H.useLayoutEffect:H.useEffect;function fe(e,l){const u=ce(e);return de(T.flush,[e]),H.useMemo(()=>{const n=[l?T.svgClassName:T.boxClassName],t=u?{...u,...e}:{...e};return U(t),Object.entries(t).forEach(([d,p])=>{n.push(T.get(d,p))}),B.forEach(d=>{if(d in t){const p=t[d];U(p),Object.entries(p).forEach(([k,E])=>{n.push(T.get(k,E,d))}),delete t[d]}}),n},[e,u])}function U(e){w(e,"hover","hover"),w(e,"focus","focus"),w(e,"hasFocus","hasFocus"),w(e,"active","active"),w(e,"disabled","disabled"),w(e,"hasDisabled","hasDisabled"),w(e,"checked","checked"),w(e,"hasChecked","hasChecked"),w(e,"valid","valid"),w(e,"hasValid","hasValid"),w(e,"invalid","invalid"),w(e,"hasInvalid","hasInvalid"),A(e,"hoverGroup","hover"),A(e,"focusGroup","focus"),A(e,"activeGroup","active"),A(e,"disabledGroup","disabled")}function w(e,l,u){l in e&&Q(e,l,u,e[l])}function A(e,l,u){l in e&&X.ObjectUtils.isObject(e[l])&&Object.entries(e[l]).forEach(([n,t])=>{T.addCustomPseudoClass(u,n,l),Q(e,l,u+n,t)})}function Q(e,l,u,n){Array.isArray(n)?(Object.entries(n[1]).forEach(([t,d])=>{e[`${t}${u}`]=d}),e[l]=n[0]):X.ObjectUtils.isObject(n)&&(Object.entries(n).forEach(([t,d])=>{e[`${t}${u}`]=d}),delete e[l])}function Z(...e){return e.reduce((l,u)=>u?typeof u=="string"?(l.push(u),l):Array.isArray(u)?(l.push(...Z(...u)),l):(Object.entries(u).forEach(([n,t])=>{t&&l.push(n)}),l):l,[])}exports.StylesContext=T;exports.Theme=J;exports.classNames=Z;exports.useStyles=fe;
37
+ `),boxDts:R}}e.setupAugmentedProps=u;function n(i){const m=t(i);if(m.components)return Object.entries(m.components).forEach(([f,r])=>{var o;const a=(o=e.Styles.components)==null?void 0:o[f];a?(e.Styles.components[f].styles={...a.styles,...r.styles},e.Styles.components[f].themes=r.themes):e.Styles.components[f]=r}),m}function t(i){return d(i),p(i),E(i),i}function d(i){const{components:m,...f}=i,r=Object.entries(f);r.length&&!i.components&&(i.components={});for(const a of r){const[o,v]=a;i.components[o]=v,delete i[o]}}function p(i){if(!i.components)return;const m=Object.keys(i.components);for(const f of m){const r=i.components[f],a=k(f,r);delete r.children;for(const o of a){const[v,V]=o;i.components[v]=V}}}function k(i,m){if(!m.children)return[];const f=Object.keys(m.children),r=[];for(const a of f){const o=`${i}.${a}`,v=m.children[a],V=k(o,v);r.push(...V),delete v.children,r.push([o,v])}return r}function E(i){if(!i.components)return;const m=Object.values(i.components);for(const f of m)C(f.styles),B.forEach(r=>{if(r in f.styles){const a=f.styles[r];C(a)}}),f.themes&&Object.values(f.themes).forEach(r=>{C(r),B.forEach(a=>{if(a in r){const o=r[a];C(o)}})})}function C(i){P.forEach(m=>{if(m in i){const f=i[m];Object.entries(f).map(([r,a])=>{i[`${r}${m}`]=a}),delete i[m]}})}})(q||(q={}));const J=q;function ce(e){const{clean:l,theme:u,component:n}=e;return H.useMemo(()=>{var d,p;if(l)return;let t=(d=J.Styles.components)==null?void 0:d[n];if(t)return u?{...t.styles,...(p=t.themes)==null?void 0:p[u]}:t.styles},[n,l,u])}const me=typeof window<"u"&&typeof window.document<"u",de=me?H.useLayoutEffect:H.useEffect;function fe(e,l){const u=ce(e);return de(z.flush,[e]),H.useMemo(()=>{const n=[l?z.svgClassName:z.boxClassName],t=u?{...u,...e}:{...e};return U(t),Object.entries(t).forEach(([d,p])=>{n.push(z.get(d,p))}),B.forEach(d=>{if(d in t){const p=t[d];U(p),Object.entries(p).forEach(([k,E])=>{n.push(z.get(k,E,d))}),delete t[d]}}),n},[e,u])}function U(e){w(e,"hover","hover"),w(e,"focus","focus"),w(e,"hasFocus","hasFocus"),w(e,"active","active"),w(e,"disabled","disabled"),w(e,"hasDisabled","hasDisabled"),w(e,"checked","checked"),w(e,"hasChecked","hasChecked"),w(e,"valid","valid"),w(e,"hasValid","hasValid"),w(e,"invalid","invalid"),w(e,"hasInvalid","hasInvalid"),A(e,"hoverGroup","hover"),A(e,"focusGroup","focus"),A(e,"activeGroup","active"),A(e,"disabledGroup","disabled")}function w(e,l,u){l in e&&Q(e,l,u,e[l])}function A(e,l,u){l in e&&X.ObjectUtils.isObject(e[l])&&Object.entries(e[l]).forEach(([n,t])=>{z.addCustomPseudoClass(u,n,l),Q(e,l,u+n,t)})}function Q(e,l,u,n){Array.isArray(n)?(Object.entries(n[1]).forEach(([t,d])=>{e[`${t}${u}`]=d}),e[l]=n[0]):X.ObjectUtils.isObject(n)&&(Object.entries(n).forEach(([t,d])=>{e[`${t}${u}`]=d}),delete e[l])}function Z(...e){return e.reduce((l,u)=>u?typeof u=="string"?(l.push(u),l):Array.isArray(u)?(l.push(...Z(...u)),l):(Object.entries(u).forEach(([n,t])=>{t&&l.push(n)}),l):l,[])}exports.StylesContext=z;exports.Theme=J;exports.classNames=Z;exports.useStyles=fe;
package/core.mjs CHANGED
@@ -185,7 +185,7 @@ const c = [
185
185
  -92,
186
186
  -96,
187
187
  -100
188
- ], h = [...c, ...ae], W = ["solid", "dashed", "dotted", "double", "groove", "ridge", "inset", "outset", "none", "hidden"], R = ["auto", "hidden", "scroll", "visible"], z = [
188
+ ], h = [...c, ...ae], W = ["solid", "dashed", "dotted", "double", "groove", "ridge", "inset", "outset", "none", "hidden"], R = ["auto", "hidden", "scroll", "visible"], T = [
189
189
  "1/2",
190
190
  "1/3",
191
191
  "2/3",
@@ -239,7 +239,7 @@ const c = [
239
239
  values1: { values: O, formatValue: s.Value.widthHeight },
240
240
  values2: { values: c, formatValue: s.Value.rem },
241
241
  values3: {
242
- values: z,
242
+ values: T,
243
243
  formatValue: s.Value.fraction
244
244
  // formatClassName: BoxStylesFormatters.ClassName.fraction,
245
245
  }
@@ -249,7 +249,7 @@ const c = [
249
249
  values1: { values: O, formatValue: s.Value.widthHeight },
250
250
  values2: { values: c, formatValue: s.Value.rem },
251
251
  values3: {
252
- values: z,
252
+ values: T,
253
253
  formatValue: s.Value.fraction
254
254
  // formatClassName: BoxStylesFormatters.ClassName.fraction,
255
255
  }
@@ -259,7 +259,7 @@ const c = [
259
259
  values1: { values: O, formatValue: s.Value.widthHeight },
260
260
  values2: { values: c, formatValue: s.Value.rem },
261
261
  values3: {
262
- values: z,
262
+ values: T,
263
263
  formatValue: s.Value.fraction
264
264
  // formatClassName: BoxStylesFormatters.ClassName.fraction,
265
265
  }
@@ -269,7 +269,7 @@ const c = [
269
269
  values1: { values: O, formatValue: s.Value.widthHeight },
270
270
  values2: { values: c, formatValue: s.Value.rem },
271
271
  values3: {
272
- values: z,
272
+ values: T,
273
273
  formatValue: s.Value.fraction
274
274
  // formatClassName: BoxStylesFormatters.ClassName.fraction,
275
275
  }
@@ -279,7 +279,7 @@ const c = [
279
279
  values1: { values: O, formatValue: s.Value.widthHeight },
280
280
  values2: { values: c, formatValue: s.Value.rem },
281
281
  values3: {
282
- values: z,
282
+ values: T,
283
283
  formatValue: s.Value.fraction
284
284
  // formatClassName: BoxStylesFormatters.ClassName.fraction,
285
285
  }
@@ -289,7 +289,7 @@ const c = [
289
289
  values1: { values: O, formatValue: s.Value.widthHeight },
290
290
  values2: { values: c, formatValue: s.Value.rem },
291
291
  values3: {
292
- values: z,
292
+ values: T,
293
293
  formatValue: s.Value.fraction
294
294
  // formatClassName: BoxStylesFormatters.ClassName.fraction,
295
295
  }
@@ -1037,12 +1037,12 @@ a,ul{all: unset;}
1037
1037
  }
1038
1038
  ).reduce((b, [y, N]) => (N.forEach((x) => {
1039
1039
  var L;
1040
- const S = $[y], T = f(S, x), P = `.${C(y, x)}`, G = V(
1040
+ const S = $[y], z = f(S, x), P = `.${C(y, x)}`, G = V(
1041
1041
  P,
1042
1042
  S,
1043
- T,
1043
+ z,
1044
1044
  o ? i[o] : void 0
1045
- ), g = ((L = T.formatValue) == null ? void 0 : L.call(T, y, x)) ?? x, Q = $[y].cssNames.map((Z) => `${Z}:${g};`).join("");
1045
+ ), g = ((L = z.formatValue) == null ? void 0 : L.call(z, y, x)) ?? x, Q = $[y].cssNames.map((Z) => `${Z}:${g};`).join("");
1046
1046
  b.push(`${G.join(",")}{${Q}}`);
1047
1047
  }), b), a);
1048
1048
  function V(b, y, N, x) {
@@ -1118,12 +1118,12 @@ var D;
1118
1118
  `), y = Object.entries(o).map(([g, j]) => `--backgroundImage${g}: ${j};`).join(`
1119
1119
  `), N = [":root {"];
1120
1120
  v && N.push(` ${v}`), V && N.push(` ${V}`), b && N.push(` ${b}`), y && N.push(` ${y}`), N.push("}");
1121
- const x = Object.keys(f).map((g) => `'${g}'`).join(" | "), S = Object.keys(a).map((g) => `'${g}'`).join(" | "), T = Object.keys(o).map((g) => `'${g}'`).join(" | "), P = Object.keys(r).map((g) => `'${g}'`).join(" | "), G = `import '@cronocode/react-box';
1121
+ const x = Object.keys(f).map((g) => `'${g}'`).join(" | "), S = Object.keys(a).map((g) => `'${g}'`).join(" | "), z = Object.keys(o).map((g) => `'${g}'`).join(" | "), P = Object.keys(r).map((g) => `'${g}'`).join(" | "), G = `import '@cronocode/react-box';
1122
1122
 
1123
1123
  declare module '${(m == null ? void 0 : m.namespacePath) ?? "@cronocode/react-box/core/types"}' {
1124
1124
  type ColorType = ${x};
1125
1125
  type BackgroundType = ${S};
1126
- type BackgroundImageType = ${T};
1126
+ type BackgroundImageType = ${z};
1127
1127
  type ShadowType = ${P};
1128
1128
 
1129
1129
  namespace Augmented {
@@ -1157,7 +1157,7 @@ var D;
1157
1157
  return Object.entries(m.components).forEach(([f, r]) => {
1158
1158
  var o;
1159
1159
  const a = (o = e.Styles.components) == null ? void 0 : o[f];
1160
- a ? e.Styles.components[f].styles = { ...a.styles, ...r.styles } : e.Styles.components[f] = r;
1160
+ a ? (e.Styles.components[f].styles = { ...a.styles, ...r.styles }, e.Styles.components[f].themes = r.themes) : e.Styles.components[f] = r;
1161
1161
  }), m;
1162
1162
  }
1163
1163
  function t(i) {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@cronocode/react-box",
3
- "version": "2.0.6",
3
+ "version": "2.0.7",
4
4
  "type": "module",
5
5
  "main": "./box.cjs",
6
6
  "module": "./box.mjs",