@dr.pogodin/react-utils 1.49.0 → 1.49.1

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 (10) hide show
  1. package/build/development/shared/components/Checkbox/index.js +8 -1
  2. package/build/development/shared/components/Checkbox/index.js.map +1 -1
  3. package/build/production/shared/components/Checkbox/index.js +1 -1
  4. package/build/production/shared/components/Checkbox/index.js.map +1 -1
  5. package/build/types-code/shared/components/Checkbox/index.d.ts +3 -2
  6. package/build/types-scss/src/shared/components/Checkbox/theme.scss.d.ts +2 -0
  7. package/build/web/shared/components/Checkbox/index.js +6 -1
  8. package/build/web/shared/components/Checkbox/index.js.map +1 -1
  9. package/build/web/shared/components/Checkbox/theme.scss +21 -0
  10. package/package.json +6 -6
package/build/development/shared/components/Checkbox/index.js CHANGED
@@ -7,12 +7,15 @@ const defaultTheme = {
7
7
  "indeterminate": "-dr-pogodin-react-utils___build-web-shared-components-Checkbox-theme___indeterminate___ckSC8W",
8
8
  "container": "-dr-pogodin-react-utils___build-web-shared-components-Checkbox-theme___container___g7wee9",
9
9
  "label": "-dr-pogodin-react-utils___build-web-shared-components-Checkbox-theme___label___XQ57WS",
10
+ "error": "-dr-pogodin-react-utils___build-web-shared-components-Checkbox-theme___error___foaF-C",
11
+ "errorMessage": "-dr-pogodin-react-utils___build-web-shared-components-Checkbox-theme___errorMessage___WC9mi1",
10
12
  "disabled": "-dr-pogodin-react-utils___build-web-shared-components-Checkbox-theme___disabled___baVvQA"
11
13
  };
12
14
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
13
15
  const Checkbox = ({
14
16
  checked,
15
17
  disabled,
18
+ error,
16
19
  label,
17
20
  onChange,
18
21
  testId,
@@ -23,6 +26,7 @@ const Checkbox = ({
23
26
  if (disabled) containerClassName += ` ${composed.disabled}`;
24
27
  let checkboxClassName = composed.checkbox;
25
28
  if (checked === 'indeterminate') checkboxClassName += ` ${composed.indeterminate}`;
29
+ if (error) containerClassName += ` ${composed.error}`;
26
30
  return /*#__PURE__*/_jsxs("div", {
27
31
  className: containerClassName,
28
32
  children: [label === undefined ? null : /*#__PURE__*/_jsx("div", {
@@ -38,7 +42,10 @@ const Checkbox = ({
38
42
  e.stopPropagation();
39
43
  },
40
44
  type: "checkbox"
41
- })]
45
+ }), error && error !== true ? /*#__PURE__*/_jsx("div", {
46
+ className: composed.errorMessage,
47
+ children: error
48
+ }) : null]
42
49
  });
43
50
  };
44
51
  export default Checkbox;
package/build/development/shared/components/Checkbox/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":["useTheme","defaultTheme","jsx","_jsx","jsxs","_jsxs","Checkbox","checked","disabled","label","onChange","testId","theme","composed","containerClassName","container","checkboxClassName","checkbox","indeterminate","className","children","undefined","process","env","NODE_ENV","onClick","e","stopPropagation","type"],"sources":["../../../../../src/shared/components/Checkbox/index.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { type Theme, useTheme } from '@dr.pogodin/react-themes';\n\nimport defaultTheme from './theme.scss';\n\ntype PropT<ValueT> = {\n checked?: ValueT;\n disabled?: boolean;\n label?: React.ReactNode;\n onChange?: React.ChangeEventHandler<HTMLInputElement>;\n testId?: string;\n theme?: Theme<\n | 'checkbox'\n | 'container'\n | 'disabled'\n | 'indeterminate'\n | 'label'\n >;\n};\n\nconst Checkbox = <ValueT extends 'indeterminate' | boolean = boolean>({\n checked,\n disabled,\n label,\n onChange,\n testId,\n theme,\n}: PropT<ValueT>): ReactNode => {\n const composed = useTheme('Checkbox', defaultTheme, theme);\n\n let containerClassName = composed.container;\n if (disabled) containerClassName += ` ${composed.disabled}`;\n\n let checkboxClassName = composed.checkbox;\n if (checked === 'indeterminate') checkboxClassName += ` ${composed.indeterminate}`;\n\n return (\n <div className={containerClassName}>\n { label === undefined\n ? null : <div className={composed.label}>{label}</div> }\n <input\n checked={checked === undefined ? undefined : checked === true}\n className={checkboxClassName}\n data-testid={process.env.NODE_ENV === 'production' ? undefined : testId}\n disabled={disabled}\n onChange={onChange}\n onClick={(e) => {\n e.stopPropagation();\n }}\n type=\"checkbox\"\n />\n </div>\n );\n};\n\nexport default Checkbox;\n"],"mappings":"AAEA,SAAqBA,QAAQ,QAAQ,0BAA0B;AAAA,MAAAC,YAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA;AAEvB,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAiBxC,MAAMC,QAAQ,GAAGA,CAAqD;EACpEC,OAAO;EACPC,QAAQ;EACRC,KAAK;EACLC,QAAQ;EACRC,MAAM;EACNC;AACa,CAAC,KAAgB;EAC9B,MAAMC,QAAQ,GAAGb,QAAQ,CAAC,UAAU,EAAEC,YAAY,EAAEW,KAAK,CAAC;EAE1D,IAAIE,kBAAkB,GAAGD,QAAQ,CAACE,SAAS;EAC3C,IAAIP,QAAQ,EAAEM,kBAAkB,IAAI,IAAID,QAAQ,CAACL,QAAQ,EAAE;EAE3D,IAAIQ,iBAAiB,GAAGH,QAAQ,CAACI,QAAQ;EACzC,IAAIV,OAAO,KAAK,eAAe,EAAES,iBAAiB,IAAI,IAAIH,QAAQ,CAACK,aAAa,EAAE;EAElF,oBACEb,KAAA;IAAKc,SAAS,EAAEL,kBAAmB;IAAAM,QAAA,GAC/BX,KAAK,KAAKY,SAAS,GACjB,IAAI,gBAAGlB,IAAA;MAAKgB,SAAS,EAAEN,QAAQ,CAACJ,KAAM;MAAAW,QAAA,EAAEX;IAAK,CAAM,CAAC,eACxDN,IAAA;MACEI,OAAO,EAAEA,OAAO,KAAKc,SAAS,GAAGA,SAAS,GAAGd,OAAO,KAAK,IAAK;MAC9DY,SAAS,EAAEH,iBAAkB;MAC7B,eAAaM,OAAO,CAACC,GAAG,CAACC,QAAQ,KAAK,YAAY,GAAGH,SAAS,GAAGV,MAAO;MACxEH,QAAQ,EAAEA,QAAS;MACnBE,QAAQ,EAAEA,QAAS;MACnBe,OAAO,EAAGC,CAAC,IAAK;QACdA,CAAC,CAACC,eAAe,CAAC,CAAC;MACrB,CAAE;MACFC,IAAI,EAAC;IAAU,CAChB,CAAC;EAAA,CACC,CAAC;AAEV,CAAC;AAED,eAAetB,QAAQ","ignoreList":[]}
1
+ {"version":3,"file":"index.js","names":["useTheme","defaultTheme","jsx","_jsx","jsxs","_jsxs","Checkbox","checked","disabled","error","label","onChange","testId","theme","composed","containerClassName","container","checkboxClassName","checkbox","indeterminate","className","children","undefined","process","env","NODE_ENV","onClick","e","stopPropagation","type","errorMessage"],"sources":["../../../../../src/shared/components/Checkbox/index.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { type Theme, useTheme } from '@dr.pogodin/react-themes';\n\nimport defaultTheme from './theme.scss';\n\ntype PropT<ValueT> = {\n checked?: ValueT;\n disabled?: boolean;\n error?: ReactNode;\n label?: React.ReactNode;\n onChange?: React.ChangeEventHandler<HTMLInputElement>;\n testId?: string;\n theme?: Theme<\n | 'checkbox'\n | 'container'\n | 'disabled'\n | 'error'\n | 'errorMessage'\n | 'indeterminate'\n | 'label'\n >;\n};\n\nconst Checkbox = <ValueT extends 'indeterminate' | boolean = boolean>({\n checked,\n disabled,\n error,\n label,\n onChange,\n testId,\n theme,\n}: PropT<ValueT>): ReactNode => {\n const composed = useTheme('Checkbox', defaultTheme, theme);\n\n let containerClassName = composed.container;\n if (disabled) containerClassName += ` ${composed.disabled}`;\n\n let checkboxClassName = composed.checkbox;\n if (checked === 'indeterminate') checkboxClassName += ` ${composed.indeterminate}`;\n\n if (error) containerClassName += ` ${composed.error}`;\n\n return (\n <div className={containerClassName}>\n { label === undefined\n ? null : <div className={composed.label}>{label}</div> }\n <input\n checked={checked === undefined ? undefined : checked === true}\n className={checkboxClassName}\n data-testid={process.env.NODE_ENV === 'production' ? undefined : testId}\n disabled={disabled}\n onChange={onChange}\n onClick={(e) => {\n e.stopPropagation();\n }}\n type=\"checkbox\"\n />\n {error && error !== true\n ? <div className={composed.errorMessage}>{error}</div>\n : null}\n </div>\n );\n};\n\nexport default Checkbox;\n"],"mappings":"AAEA,SAAqBA,QAAQ,QAAQ,0BAA0B;AAAA,MAAAC,YAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA;AAEvB,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAoBxC,MAAMC,QAAQ,GAAGA,CAAqD;EACpEC,OAAO;EACPC,QAAQ;EACRC,KAAK;EACLC,KAAK;EACLC,QAAQ;EACRC,MAAM;EACNC;AACa,CAAC,KAAgB;EAC9B,MAAMC,QAAQ,GAAGd,QAAQ,CAAC,UAAU,EAAEC,YAAY,EAAEY,KAAK,CAAC;EAE1D,IAAIE,kBAAkB,GAAGD,QAAQ,CAACE,SAAS;EAC3C,IAAIR,QAAQ,EAAEO,kBAAkB,IAAI,IAAID,QAAQ,CAACN,QAAQ,EAAE;EAE3D,IAAIS,iBAAiB,GAAGH,QAAQ,CAACI,QAAQ;EACzC,IAAIX,OAAO,KAAK,eAAe,EAAEU,iBAAiB,IAAI,IAAIH,QAAQ,CAACK,aAAa,EAAE;EAElF,IAAIV,KAAK,EAAEM,kBAAkB,IAAI,IAAID,QAAQ,CAACL,KAAK,EAAE;EAErD,oBACEJ,KAAA;IAAKe,SAAS,EAAEL,kBAAmB;IAAAM,QAAA,GAC/BX,KAAK,KAAKY,SAAS,GACjB,IAAI,gBAAGnB,IAAA;MAAKiB,SAAS,EAAEN,QAAQ,CAACJ,KAAM;MAAAW,QAAA,EAAEX;IAAK,CAAM,CAAC,eACxDP,IAAA;MACEI,OAAO,EAAEA,OAAO,KAAKe,SAAS,GAAGA,SAAS,GAAGf,OAAO,KAAK,IAAK;MAC9Da,SAAS,EAAEH,iBAAkB;MAC7B,eAAaM,OAAO,CAACC,GAAG,CAACC,QAAQ,KAAK,YAAY,GAAGH,SAAS,GAAGV,MAAO;MACxEJ,QAAQ,EAAEA,QAAS;MACnBG,QAAQ,EAAEA,QAAS;MACnBe,OAAO,EAAGC,CAAC,IAAK;QACdA,CAAC,CAACC,eAAe,CAAC,CAAC;MACrB,CAAE;MACFC,IAAI,EAAC;IAAU,CAChB,CAAC,EACDpB,KAAK,IAAIA,KAAK,KAAK,IAAI,gBACpBN,IAAA;MAAKiB,SAAS,EAAEN,QAAQ,CAACgB,YAAa;MAAAT,QAAA,EAAEZ;IAAK,CAAM,CAAC,GACpD,IAAI;EAAA,CACL,CAAC;AAEV,CAAC;AAED,eAAeH,QAAQ","ignoreList":[]}
package/build/production/shared/components/Checkbox/index.js CHANGED
@@ -1,2 +1,2 @@
1
- import{useTheme}from"@dr.pogodin/react-themes";const defaultTheme={"context":"_08mmmo","ad":"Hc06MV","hoc":"toOtOd","checkbox":"v4DmWM","indeterminate":"ckSC8W","container":"g7wee9","label":"XQ57WS","disabled":"baVvQA"};import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const Checkbox=({checked,disabled,label,onChange,testId,theme})=>{const composed=useTheme("Checkbox",defaultTheme,theme);let containerClassName=composed.container;if(disabled)containerClassName+=` ${composed.disabled}`;let checkboxClassName=composed.checkbox;if(checked==="indeterminate")checkboxClassName+=` ${composed.indeterminate}`;return/*#__PURE__*/_jsxs("div",{className:containerClassName,children:[label===undefined?null:/*#__PURE__*/_jsx("div",{className:composed.label,children:label}),/*#__PURE__*/_jsx("input",{checked:checked===undefined?undefined:checked===true,className:checkboxClassName,"data-testid":process.env.NODE_ENV==="production"?undefined:testId,disabled:disabled,onChange:onChange,onClick:e=>{e.stopPropagation();},type:"checkbox"})]});};export default Checkbox;
1
+ import{useTheme}from"@dr.pogodin/react-themes";const defaultTheme={"context":"_08mmmo","ad":"Hc06MV","hoc":"toOtOd","checkbox":"v4DmWM","indeterminate":"ckSC8W","container":"g7wee9","label":"XQ57WS","error":"foaF-C","errorMessage":"WC9mi1","disabled":"baVvQA"};import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";const Checkbox=({checked,disabled,error,label,onChange,testId,theme})=>{const composed=useTheme("Checkbox",defaultTheme,theme);let containerClassName=composed.container;if(disabled)containerClassName+=` ${composed.disabled}`;let checkboxClassName=composed.checkbox;if(checked==="indeterminate")checkboxClassName+=` ${composed.indeterminate}`;if(error)containerClassName+=` ${composed.error}`;return/*#__PURE__*/_jsxs("div",{className:containerClassName,children:[label===undefined?null:/*#__PURE__*/_jsx("div",{className:composed.label,children:label}),/*#__PURE__*/_jsx("input",{checked:checked===undefined?undefined:checked===true,className:checkboxClassName,"data-testid":process.env.NODE_ENV==="production"?undefined:testId,disabled:disabled,onChange:onChange,onClick:e=>{e.stopPropagation();},type:"checkbox"}),error&&error!==true?/*#__PURE__*/_jsx("div",{className:composed.errorMessage,children:error}):null]});};export default Checkbox;
2
2
  //# sourceMappingURL=index.js.map
package/build/production/shared/components/Checkbox/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":["useTheme","defaultTheme","jsx","_jsx","jsxs","_jsxs","Checkbox","checked","disabled","label","onChange","testId","theme","composed","containerClassName","container","checkboxClassName","checkbox","indeterminate","className","children","undefined","process","env","NODE_ENV","onClick","e","stopPropagation","type"],"sources":["../../../../../src/shared/components/Checkbox/index.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { type Theme, useTheme } from '@dr.pogodin/react-themes';\n\nimport defaultTheme from './theme.scss';\n\ntype PropT<ValueT> = {\n checked?: ValueT;\n disabled?: boolean;\n label?: React.ReactNode;\n onChange?: React.ChangeEventHandler<HTMLInputElement>;\n testId?: string;\n theme?: Theme<\n | 'checkbox'\n | 'container'\n | 'disabled'\n | 'indeterminate'\n | 'label'\n >;\n};\n\nconst Checkbox = <ValueT extends 'indeterminate' | boolean = boolean>({\n checked,\n disabled,\n label,\n onChange,\n testId,\n theme,\n}: PropT<ValueT>): ReactNode => {\n const composed = useTheme('Checkbox', defaultTheme, theme);\n\n let containerClassName = composed.container;\n if (disabled) containerClassName += ` ${composed.disabled}`;\n\n let checkboxClassName = composed.checkbox;\n if (checked === 'indeterminate') checkboxClassName += ` ${composed.indeterminate}`;\n\n return (\n <div className={containerClassName}>\n { label === undefined\n ? null : <div className={composed.label}>{label}</div> }\n <input\n checked={checked === undefined ? undefined : checked === true}\n className={checkboxClassName}\n data-testid={process.env.NODE_ENV === 'production' ? undefined : testId}\n disabled={disabled}\n onChange={onChange}\n onClick={(e) => {\n e.stopPropagation();\n }}\n type=\"checkbox\"\n />\n </div>\n );\n};\n\nexport default Checkbox;\n"],"mappings":"AAEA,OAAqBA,QAAQ,KAAQ,0BAA0B,OAAAC,YAAA,2JAEvB,OAAAC,GAAA,IAAAC,IAAA,CAAAC,IAAA,IAAAC,KAAA,yBAiBxC,KAAM,CAAAC,QAAQ,CAAGA,CAAqD,CACpEC,OAAO,CACPC,QAAQ,CACRC,KAAK,CACLC,QAAQ,CACRC,MAAM,CACNC,KACa,CAAC,GAAgB,CAC9B,KAAM,CAAAC,QAAQ,CAAGb,QAAQ,CAAC,UAAU,CAAEC,YAAY,CAAEW,KAAK,CAAC,CAE1D,GAAI,CAAAE,kBAAkB,CAAGD,QAAQ,CAACE,SAAS,CAC3C,GAAIP,QAAQ,CAAEM,kBAAkB,EAAI,IAAID,QAAQ,CAACL,QAAQ,EAAE,CAE3D,GAAI,CAAAQ,iBAAiB,CAAGH,QAAQ,CAACI,QAAQ,CACzC,GAAIV,OAAO,GAAK,eAAe,CAAES,iBAAiB,EAAI,IAAIH,QAAQ,CAACK,aAAa,EAAE,CAElF,mBACEb,KAAA,QAAKc,SAAS,CAAEL,kBAAmB,CAAAM,QAAA,EAC/BX,KAAK,GAAKY,SAAS,CACjB,IAAI,cAAGlB,IAAA,QAAKgB,SAAS,CAAEN,QAAQ,CAACJ,KAAM,CAAAW,QAAA,CAAEX,KAAK,CAAM,CAAC,cACxDN,IAAA,UACEI,OAAO,CAAEA,OAAO,GAAKc,SAAS,CAAGA,SAAS,CAAGd,OAAO,GAAK,IAAK,CAC9DY,SAAS,CAAEH,iBAAkB,CAC7B,cAAaM,OAAO,CAACC,GAAG,CAACC,QAAQ,GAAK,YAAY,CAAGH,SAAS,CAAGV,MAAO,CACxEH,QAAQ,CAAEA,QAAS,CACnBE,QAAQ,CAAEA,QAAS,CACnBe,OAAO,CAAGC,CAAC,EAAK,CACdA,CAAC,CAACC,eAAe,CAAC,CAAC,CACrB,CAAE,CACFC,IAAI,CAAC,UAAU,CAChB,CAAC,EACC,CAAC,CAEV,CAAC,CAED,cAAe,CAAAtB,QAAQ","ignoreList":[]}
1
+ {"version":3,"file":"index.js","names":["useTheme","defaultTheme","jsx","_jsx","jsxs","_jsxs","Checkbox","checked","disabled","error","label","onChange","testId","theme","composed","containerClassName","container","checkboxClassName","checkbox","indeterminate","className","children","undefined","process","env","NODE_ENV","onClick","e","stopPropagation","type","errorMessage"],"sources":["../../../../../src/shared/components/Checkbox/index.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { type Theme, useTheme } from '@dr.pogodin/react-themes';\n\nimport defaultTheme from './theme.scss';\n\ntype PropT<ValueT> = {\n checked?: ValueT;\n disabled?: boolean;\n error?: ReactNode;\n label?: React.ReactNode;\n onChange?: React.ChangeEventHandler<HTMLInputElement>;\n testId?: string;\n theme?: Theme<\n | 'checkbox'\n | 'container'\n | 'disabled'\n | 'error'\n | 'errorMessage'\n | 'indeterminate'\n | 'label'\n >;\n};\n\nconst Checkbox = <ValueT extends 'indeterminate' | boolean = boolean>({\n checked,\n disabled,\n error,\n label,\n onChange,\n testId,\n theme,\n}: PropT<ValueT>): ReactNode => {\n const composed = useTheme('Checkbox', defaultTheme, theme);\n\n let containerClassName = composed.container;\n if (disabled) containerClassName += ` ${composed.disabled}`;\n\n let checkboxClassName = composed.checkbox;\n if (checked === 'indeterminate') checkboxClassName += ` ${composed.indeterminate}`;\n\n if (error) containerClassName += ` ${composed.error}`;\n\n return (\n <div className={containerClassName}>\n { label === undefined\n ? null : <div className={composed.label}>{label}</div> }\n <input\n checked={checked === undefined ? undefined : checked === true}\n className={checkboxClassName}\n data-testid={process.env.NODE_ENV === 'production' ? undefined : testId}\n disabled={disabled}\n onChange={onChange}\n onClick={(e) => {\n e.stopPropagation();\n }}\n type=\"checkbox\"\n />\n {error && error !== true\n ? <div className={composed.errorMessage}>{error}</div>\n : null}\n </div>\n );\n};\n\nexport default Checkbox;\n"],"mappings":"AAEA,OAAqBA,QAAQ,KAAQ,0BAA0B,OAAAC,YAAA,oMAEvB,OAAAC,GAAA,IAAAC,IAAA,CAAAC,IAAA,IAAAC,KAAA,yBAoBxC,KAAM,CAAAC,QAAQ,CAAGA,CAAqD,CACpEC,OAAO,CACPC,QAAQ,CACRC,KAAK,CACLC,KAAK,CACLC,QAAQ,CACRC,MAAM,CACNC,KACa,CAAC,GAAgB,CAC9B,KAAM,CAAAC,QAAQ,CAAGd,QAAQ,CAAC,UAAU,CAAEC,YAAY,CAAEY,KAAK,CAAC,CAE1D,GAAI,CAAAE,kBAAkB,CAAGD,QAAQ,CAACE,SAAS,CAC3C,GAAIR,QAAQ,CAAEO,kBAAkB,EAAI,IAAID,QAAQ,CAACN,QAAQ,EAAE,CAE3D,GAAI,CAAAS,iBAAiB,CAAGH,QAAQ,CAACI,QAAQ,CACzC,GAAIX,OAAO,GAAK,eAAe,CAAEU,iBAAiB,EAAI,IAAIH,QAAQ,CAACK,aAAa,EAAE,CAElF,GAAIV,KAAK,CAAEM,kBAAkB,EAAI,IAAID,QAAQ,CAACL,KAAK,EAAE,CAErD,mBACEJ,KAAA,QAAKe,SAAS,CAAEL,kBAAmB,CAAAM,QAAA,EAC/BX,KAAK,GAAKY,SAAS,CACjB,IAAI,cAAGnB,IAAA,QAAKiB,SAAS,CAAEN,QAAQ,CAACJ,KAAM,CAAAW,QAAA,CAAEX,KAAK,CAAM,CAAC,cACxDP,IAAA,UACEI,OAAO,CAAEA,OAAO,GAAKe,SAAS,CAAGA,SAAS,CAAGf,OAAO,GAAK,IAAK,CAC9Da,SAAS,CAAEH,iBAAkB,CAC7B,cAAaM,OAAO,CAACC,GAAG,CAACC,QAAQ,GAAK,YAAY,CAAGH,SAAS,CAAGV,MAAO,CACxEJ,QAAQ,CAAEA,QAAS,CACnBG,QAAQ,CAAEA,QAAS,CACnBe,OAAO,CAAGC,CAAC,EAAK,CACdA,CAAC,CAACC,eAAe,CAAC,CAAC,CACrB,CAAE,CACFC,IAAI,CAAC,UAAU,CAChB,CAAC,CACDpB,KAAK,EAAIA,KAAK,GAAK,IAAI,cACpBN,IAAA,QAAKiB,SAAS,CAAEN,QAAQ,CAACgB,YAAa,CAAAT,QAAA,CAAEZ,KAAK,CAAM,CAAC,CACpD,IAAI,EACL,CAAC,CAEV,CAAC,CAED,cAAe,CAAAH,QAAQ","ignoreList":[]}
package/build/types-code/shared/components/Checkbox/index.d.ts CHANGED
@@ -3,10 +3,11 @@ import { type Theme } from '@dr.pogodin/react-themes';
3
3
  type PropT<ValueT> = {
4
4
  checked?: ValueT;
5
5
  disabled?: boolean;
6
+ error?: ReactNode;
6
7
  label?: React.ReactNode;
7
8
  onChange?: React.ChangeEventHandler<HTMLInputElement>;
8
9
  testId?: string;
9
- theme?: Theme<'checkbox' | 'container' | 'disabled' | 'indeterminate' | 'label'>;
10
+ theme?: Theme<'checkbox' | 'container' | 'disabled' | 'error' | 'errorMessage' | 'indeterminate' | 'label'>;
10
11
  };
11
- declare const Checkbox: <ValueT extends "indeterminate" | boolean = boolean>({ checked, disabled, label, onChange, testId, theme, }: PropT<ValueT>) => ReactNode;
12
+ declare const Checkbox: <ValueT extends "indeterminate" | boolean = boolean>({ checked, disabled, error, label, onChange, testId, theme, }: PropT<ValueT>) => ReactNode;
12
13
  export default Checkbox;
package/build/types-scss/src/shared/components/Checkbox/theme.scss.d.ts CHANGED
@@ -3,6 +3,8 @@ export declare const checkbox: string;
3
3
  export declare const container: string;
4
4
  export declare const context: string;
5
5
  export declare const disabled: string;
6
+ export declare const error: string;
7
+ export declare const errorMessage: string;
6
8
  export declare const hoc: string;
7
9
  export declare const indeterminate: string;
8
10
  export declare const label: string;
package/build/web/shared/components/Checkbox/index.js CHANGED
@@ -4,6 +4,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
4
4
  const Checkbox = ({
5
5
  checked,
6
6
  disabled,
7
+ error,
7
8
  label,
8
9
  onChange,
9
10
  testId,
@@ -14,6 +15,7 @@ const Checkbox = ({
14
15
  if (disabled) containerClassName += ` ${composed.disabled}`;
15
16
  let checkboxClassName = composed.checkbox;
16
17
  if (checked === 'indeterminate') checkboxClassName += ` ${composed.indeterminate}`;
18
+ if (error) containerClassName += ` ${composed.error}`;
17
19
  return /*#__PURE__*/_jsxs("div", {
18
20
  className: containerClassName,
19
21
  children: [label === undefined ? null : /*#__PURE__*/_jsx("div", {
@@ -29,7 +31,10 @@ const Checkbox = ({
29
31
  e.stopPropagation();
30
32
  },
31
33
  type: "checkbox"
32
- })]
34
+ }), error && error !== true ? /*#__PURE__*/_jsx("div", {
35
+ className: composed.errorMessage,
36
+ children: error
37
+ }) : null]
33
38
  });
34
39
  };
35
40
  export default Checkbox;
package/build/web/shared/components/Checkbox/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":["useTheme","defaultTheme","jsx","_jsx","jsxs","_jsxs","Checkbox","checked","disabled","label","onChange","testId","theme","composed","containerClassName","container","checkboxClassName","checkbox","indeterminate","className","children","undefined","process","env","NODE_ENV","onClick","e","stopPropagation","type"],"sources":["../../../../../src/shared/components/Checkbox/index.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { type Theme, useTheme } from '@dr.pogodin/react-themes';\n\nimport defaultTheme from './theme.scss';\n\ntype PropT<ValueT> = {\n checked?: ValueT;\n disabled?: boolean;\n label?: React.ReactNode;\n onChange?: React.ChangeEventHandler<HTMLInputElement>;\n testId?: string;\n theme?: Theme<\n | 'checkbox'\n | 'container'\n | 'disabled'\n | 'indeterminate'\n | 'label'\n >;\n};\n\nconst Checkbox = <ValueT extends 'indeterminate' | boolean = boolean>({\n checked,\n disabled,\n label,\n onChange,\n testId,\n theme,\n}: PropT<ValueT>): ReactNode => {\n const composed = useTheme('Checkbox', defaultTheme, theme);\n\n let containerClassName = composed.container;\n if (disabled) containerClassName += ` ${composed.disabled}`;\n\n let checkboxClassName = composed.checkbox;\n if (checked === 'indeterminate') checkboxClassName += ` ${composed.indeterminate}`;\n\n return (\n <div className={containerClassName}>\n { label === undefined\n ? null : <div className={composed.label}>{label}</div> }\n <input\n checked={checked === undefined ? undefined : checked === true}\n className={checkboxClassName}\n data-testid={process.env.NODE_ENV === 'production' ? undefined : testId}\n disabled={disabled}\n onChange={onChange}\n onClick={(e) => {\n e.stopPropagation();\n }}\n type=\"checkbox\"\n />\n </div>\n );\n};\n\nexport default Checkbox;\n"],"mappings":"AAEA,SAAqBA,QAAQ,QAAQ,0BAA0B;AAE/D,OAAOC,YAAY;AAAqB,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAiBxC,MAAMC,QAAQ,GAAGA,CAAqD;EACpEC,OAAO;EACPC,QAAQ;EACRC,KAAK;EACLC,QAAQ;EACRC,MAAM;EACNC;AACa,CAAC,KAAgB;EAC9B,MAAMC,QAAQ,GAAGb,QAAQ,CAAC,UAAU,EAAEC,YAAY,EAAEW,KAAK,CAAC;EAE1D,IAAIE,kBAAkB,GAAGD,QAAQ,CAACE,SAAS;EAC3C,IAAIP,QAAQ,EAAEM,kBAAkB,IAAI,IAAID,QAAQ,CAACL,QAAQ,EAAE;EAE3D,IAAIQ,iBAAiB,GAAGH,QAAQ,CAACI,QAAQ;EACzC,IAAIV,OAAO,KAAK,eAAe,EAAES,iBAAiB,IAAI,IAAIH,QAAQ,CAACK,aAAa,EAAE;EAElF,oBACEb,KAAA;IAAKc,SAAS,EAAEL,kBAAmB;IAAAM,QAAA,GAC/BX,KAAK,KAAKY,SAAS,GACjB,IAAI,gBAAGlB,IAAA;MAAKgB,SAAS,EAAEN,QAAQ,CAACJ,KAAM;MAAAW,QAAA,EAAEX;IAAK,CAAM,CAAC,eACxDN,IAAA;MACEI,OAAO,EAAEA,OAAO,KAAKc,SAAS,GAAGA,SAAS,GAAGd,OAAO,KAAK,IAAK;MAC9DY,SAAS,EAAEH,iBAAkB;MAC7B,eAAaM,OAAO,CAACC,GAAG,CAACC,QAAQ,KAAK,YAAY,GAAGH,SAAS,GAAGV,MAAO;MACxEH,QAAQ,EAAEA,QAAS;MACnBE,QAAQ,EAAEA,QAAS;MACnBe,OAAO,EAAGC,CAAC,IAAK;QACdA,CAAC,CAACC,eAAe,CAAC,CAAC;MACrB,CAAE;MACFC,IAAI,EAAC;IAAU,CAChB,CAAC;EAAA,CACC,CAAC;AAEV,CAAC;AAED,eAAetB,QAAQ","ignoreList":[]}
1
+ {"version":3,"file":"index.js","names":["useTheme","defaultTheme","jsx","_jsx","jsxs","_jsxs","Checkbox","checked","disabled","error","label","onChange","testId","theme","composed","containerClassName","container","checkboxClassName","checkbox","indeterminate","className","children","undefined","process","env","NODE_ENV","onClick","e","stopPropagation","type","errorMessage"],"sources":["../../../../../src/shared/components/Checkbox/index.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { type Theme, useTheme } from '@dr.pogodin/react-themes';\n\nimport defaultTheme from './theme.scss';\n\ntype PropT<ValueT> = {\n checked?: ValueT;\n disabled?: boolean;\n error?: ReactNode;\n label?: React.ReactNode;\n onChange?: React.ChangeEventHandler<HTMLInputElement>;\n testId?: string;\n theme?: Theme<\n | 'checkbox'\n | 'container'\n | 'disabled'\n | 'error'\n | 'errorMessage'\n | 'indeterminate'\n | 'label'\n >;\n};\n\nconst Checkbox = <ValueT extends 'indeterminate' | boolean = boolean>({\n checked,\n disabled,\n error,\n label,\n onChange,\n testId,\n theme,\n}: PropT<ValueT>): ReactNode => {\n const composed = useTheme('Checkbox', defaultTheme, theme);\n\n let containerClassName = composed.container;\n if (disabled) containerClassName += ` ${composed.disabled}`;\n\n let checkboxClassName = composed.checkbox;\n if (checked === 'indeterminate') checkboxClassName += ` ${composed.indeterminate}`;\n\n if (error) containerClassName += ` ${composed.error}`;\n\n return (\n <div className={containerClassName}>\n { label === undefined\n ? null : <div className={composed.label}>{label}</div> }\n <input\n checked={checked === undefined ? undefined : checked === true}\n className={checkboxClassName}\n data-testid={process.env.NODE_ENV === 'production' ? undefined : testId}\n disabled={disabled}\n onChange={onChange}\n onClick={(e) => {\n e.stopPropagation();\n }}\n type=\"checkbox\"\n />\n {error && error !== true\n ? <div className={composed.errorMessage}>{error}</div>\n : null}\n </div>\n );\n};\n\nexport default Checkbox;\n"],"mappings":"AAEA,SAAqBA,QAAQ,QAAQ,0BAA0B;AAE/D,OAAOC,YAAY;AAAqB,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAoBxC,MAAMC,QAAQ,GAAGA,CAAqD;EACpEC,OAAO;EACPC,QAAQ;EACRC,KAAK;EACLC,KAAK;EACLC,QAAQ;EACRC,MAAM;EACNC;AACa,CAAC,KAAgB;EAC9B,MAAMC,QAAQ,GAAGd,QAAQ,CAAC,UAAU,EAAEC,YAAY,EAAEY,KAAK,CAAC;EAE1D,IAAIE,kBAAkB,GAAGD,QAAQ,CAACE,SAAS;EAC3C,IAAIR,QAAQ,EAAEO,kBAAkB,IAAI,IAAID,QAAQ,CAACN,QAAQ,EAAE;EAE3D,IAAIS,iBAAiB,GAAGH,QAAQ,CAACI,QAAQ;EACzC,IAAIX,OAAO,KAAK,eAAe,EAAEU,iBAAiB,IAAI,IAAIH,QAAQ,CAACK,aAAa,EAAE;EAElF,IAAIV,KAAK,EAAEM,kBAAkB,IAAI,IAAID,QAAQ,CAACL,KAAK,EAAE;EAErD,oBACEJ,KAAA;IAAKe,SAAS,EAAEL,kBAAmB;IAAAM,QAAA,GAC/BX,KAAK,KAAKY,SAAS,GACjB,IAAI,gBAAGnB,IAAA;MAAKiB,SAAS,EAAEN,QAAQ,CAACJ,KAAM;MAAAW,QAAA,EAAEX;IAAK,CAAM,CAAC,eACxDP,IAAA;MACEI,OAAO,EAAEA,OAAO,KAAKe,SAAS,GAAGA,SAAS,GAAGf,OAAO,KAAK,IAAK;MAC9Da,SAAS,EAAEH,iBAAkB;MAC7B,eAAaM,OAAO,CAACC,GAAG,CAACC,QAAQ,KAAK,YAAY,GAAGH,SAAS,GAAGV,MAAO;MACxEJ,QAAQ,EAAEA,QAAS;MACnBG,QAAQ,EAAEA,QAAS;MACnBe,OAAO,EAAGC,CAAC,IAAK;QACdA,CAAC,CAACC,eAAe,CAAC,CAAC;MACrB,CAAE;MACFC,IAAI,EAAC;IAAU,CAChB,CAAC,EACDpB,KAAK,IAAIA,KAAK,KAAK,IAAI,gBACpBN,IAAA;MAAKiB,SAAS,EAAEN,QAAQ,CAACgB,YAAa;MAAAT,QAAA,EAAEZ;IAAK,CAAM,CAAC,GACpD,IAAI;EAAA,CACL,CAAC;AAEV,CAAC;AAED,eAAeH,QAAQ","ignoreList":[]}
package/build/web/shared/components/Checkbox/theme.scss CHANGED
@@ -53,6 +53,27 @@
53
53
  margin: 0 0.6em 0 1.5em;
54
54
  }
55
55
 
56
+
57
+ // TODO: The default error theming should be double-checked,
58
+ // right now the problem with build script in dev mode pervents me
59
+ // to do it right, see: https://github.com/birdofpreyru/react-utils/issues/466
60
+ &.error &.checkbox {
61
+ border-color: red;
62
+
63
+ &:focus {
64
+ box-shadow: 0 0 3px 1px orangered;
65
+ }
66
+ }
67
+
68
+ &.errorMessage {
69
+ color: red;
70
+ font-size: 0.8em;
71
+ font-style: italic;
72
+ padding-right: 0.6em;
73
+ text-align: right;
74
+ width: 100%;
75
+ }
76
+
56
77
  &.disabled {
57
78
  opacity: 0.33;
58
79
 
package/package.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
- "version": "1.49.0",
2
+ "version": "1.49.1",
3
3
  "bin": {
4
4
  "react-utils-build": "bin/build.js",
5
5
  "react-utils-setup": "bin/setup.js"
@@ -37,7 +37,7 @@
37
37
  "react-router": "^7.13.2",
38
38
  "request-ip": "^3.3.0",
39
39
  "rimraf": "^6.1.3",
40
- "serialize-javascript": "^7.0.4",
40
+ "serialize-javascript": "^7.0.5",
41
41
  "serve-favicon": "^2.5.1",
42
42
  "source-map-support": "^0.5.21",
43
43
  "uuid": "^13.0.0",
@@ -55,7 +55,7 @@
55
55
  "@babel/register": "^7.28.6",
56
56
  "@dr.pogodin/babel-plugin-transform-assets": "^1.2.6",
57
57
  "@dr.pogodin/babel-preset-svgr": "^1.9.3",
58
- "@dr.pogodin/eslint-configs": "^0.2.8",
58
+ "@dr.pogodin/eslint-configs": "^0.2.9",
59
59
  "@pmmmwh/react-refresh-webpack-plugin": "^0.6.2",
60
60
  "@standard-schema/spec": "^1.1.0",
61
61
  "@testing-library/dom": "^10.4.1",
@@ -92,7 +92,7 @@
92
92
  "jest": "^30.3.0",
93
93
  "jest-environment-jsdom": "^30.3.0",
94
94
  "memfs": "^4.57.1",
95
- "mini-css-extract-plugin": "^2.10.1",
95
+ "mini-css-extract-plugin": "^2.10.2",
96
96
  "mockdate": "^3.0.5",
97
97
  "nodelist-foreach-polyfill": "^1.2.0",
98
98
  "postcss": "^8.5.8",
@@ -105,7 +105,7 @@
105
105
  "sass-loader": "^16.0.7",
106
106
  "sitemap": "^9.0.1",
107
107
  "source-map-loader": "^5.0.0",
108
- "stylelint": "^17.5.0",
108
+ "stylelint": "^17.6.0",
109
109
  "stylelint-config-standard-scss": "^17.0.0",
110
110
  "supertest": "^7.2.2",
111
111
  "tsc-alias": "1.8.16",
@@ -113,7 +113,7 @@
113
113
  "typed-scss-modules": "^8.1.1",
114
114
  "typescript": "^5.9.3",
115
115
  "webpack": "^5.105.4",
116
- "webpack-dev-middleware": "^8.0.1",
116
+ "webpack-dev-middleware": "^8.0.2",
117
117
  "webpack-hot-middleware": "^2.26.1",
118
118
  "webpack-merge": "^6.0.1",
119
119
  "workbox-core": "^7.4.0",