guestbell-forms 3.0.5 → 3.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.
@@ -1,6 +1,7 @@
1
1
  import * as React from 'react';
2
2
  import { FormContextState, ComponentsDict } from './FormContext';
3
3
  import { ThemeContextProps } from '../themeProvider/ThemeContext';
4
+ import { ValidationError } from '../base/input';
4
5
  export declare type FormProps = React.PropsWithChildren<ThemeContextProps & {
5
6
  id?: string;
6
7
  className?: string;
@@ -8,7 +9,7 @@ export declare type FormProps = React.PropsWithChildren<ThemeContextProps & {
8
9
  onSubmit?: () => void;
9
10
  extraComponents?: ComponentsDict;
10
11
  component?: keyof JSX.IntrinsicElements;
11
- onValidChanged?: (isValid: boolean) => void;
12
+ onValidChanged?: (isValid: boolean, errors?: ValidationError[]) => void;
12
13
  }>;
13
14
  export interface FormState {
14
15
  contextState: FormContextState;
@@ -40,7 +41,7 @@ declare const _default: React.ForwardRefExoticComponent<ThemeContextProps & {
40
41
  onSubmit?: () => void;
41
42
  extraComponents?: ComponentsDict;
42
43
  component?: keyof JSX.IntrinsicElements;
43
- onValidChanged?: (isValid: boolean) => void;
44
+ onValidChanged?: (isValid: boolean, errors?: ValidationError[]) => void;
44
45
  } & {
45
46
  children?: React.ReactNode;
46
47
  } & React.RefAttributes<Form>>;
@@ -56,7 +56,14 @@ class Form extends React.PureComponent {
56
56
  if (((_this$state$contextSt = this.state.contextState) === null || _this$state$contextSt === void 0 ? void 0 : _this$state$contextSt.isFormValid) !== (prevState === null || prevState === void 0 ? void 0 : (_prevState$contextSta = prevState.contextState) === null || _prevState$contextSta === void 0 ? void 0 : _prevState$contextSta.isFormValid)) {
57
57
  var _this$props$onValidCh, _this$props, _this$state$contextSt2;
58
58
 
59
- (_this$props$onValidCh = (_this$props = this.props).onValidChanged) === null || _this$props$onValidCh === void 0 ? void 0 : _this$props$onValidCh.call(_this$props, (_this$state$contextSt2 = this.state.contextState) === null || _this$state$contextSt2 === void 0 ? void 0 : _this$state$contextSt2.isFormValid);
59
+ const componentsWithErrors = this.state.contextState ? Object.keys(this.state.contextState.components).map(key => this.state.contextState.components[key]).filter(component => {
60
+ if (!component.validation.isValid && !component.validation.name) {
61
+ console.warn(component, 'Has validation error. FormValidationSummary is present but the component has no validation name');
62
+ }
63
+
64
+ return !component.validation.isValid;
65
+ }) : [];
66
+ (_this$props$onValidCh = (_this$props = this.props).onValidChanged) === null || _this$props$onValidCh === void 0 ? void 0 : _this$props$onValidCh.call(_this$props, (_this$state$contextSt2 = this.state.contextState) === null || _this$state$contextSt2 === void 0 ? void 0 : _this$state$contextSt2.isFormValid, componentsWithErrors.reduce((prev, current) => [...prev, ...current.validation.errors], []));
60
67
  }
61
68
  }
62
69
 
@@ -1 +1 @@
1
- {"version":3,"file":"Form.js","names":["Form","React","PureComponent","constructor","props","e","preventDefault","onSubmit","subscribe","bind","unSubscribe","updateCallback","disableComponents","enableComponents","state","contextState","isFormValid","components","componentDidUpdate","prevProps","prevState","snapshot","onValidChanged","extraComponents","Object","keys","forEach","key","component","componentApi","disableComponent","enableComponent","touchAll","touch","unTouchAll","unTouch","render","id","className","mergeContext","children","getIsFormValid","componentId","componentState","setState","previousState","assign","initialValid","validation","isValid","previousComponent","noValidate","showExpandAll","withThemeContext"],"sources":["../../../src/lib/components/form/Form.tsx"],"sourcesContent":["// Libs\r\nimport * as React from 'react';\r\n\r\n// Misc\r\nimport {\r\n FormContextState,\r\n FormComponentContextState,\r\n FormContextProvider,\r\n ComponentsDict,\r\n} from './FormContext';\r\nimport { withThemeContext } from '../themeProvider/withThemeContext';\r\nimport { ThemeContextProps } from '../themeProvider/ThemeContext';\r\n\r\nexport type FormProps = React.PropsWithChildren<\r\n ThemeContextProps & {\r\n id?: string;\r\n className?: string;\r\n noValidate?: boolean;\r\n onSubmit?: () => void;\r\n extraComponents?: ComponentsDict;\r\n component?: keyof JSX.IntrinsicElements;\r\n onValidChanged?: (isValid: boolean) => void;\r\n }\r\n>;\r\n\r\nexport interface FormState {\r\n contextState: FormContextState;\r\n}\r\n\r\nexport class Form extends React.PureComponent<FormProps, FormState> {\r\n public static defaultProps = {\r\n noValidate: false,\r\n showExpandAll: true,\r\n component: 'form' as keyof JSX.IntrinsicElements,\r\n };\r\n\r\n constructor(props: FormProps) {\r\n super(props);\r\n this.subscribe = this.subscribe.bind(this);\r\n this.unSubscribe = this.unSubscribe.bind(this);\r\n this.updateCallback = this.updateCallback.bind(this);\r\n this.disableComponents = this.disableComponents.bind(this);\r\n this.enableComponents = this.enableComponents.bind(this);\r\n this.state = {\r\n contextState: {\r\n subscribe: this.subscribe,\r\n unSubscribe: this.unSubscribe,\r\n isFormValid: true,\r\n updateCallback: this.updateCallback,\r\n disableComponents: this.disableComponents,\r\n enableComponents: this.enableComponents,\r\n components: {},\r\n },\r\n };\r\n }\r\n\r\n public componentDidUpdate(\r\n prevProps: Readonly<FormProps>,\r\n prevState: Readonly<FormState>,\r\n snapshot?: any\r\n ): void {\r\n if (\r\n this.state.contextState?.isFormValid !==\r\n prevState?.contextState?.isFormValid\r\n ) {\r\n this.props.onValidChanged?.(this.state.contextState?.isFormValid);\r\n }\r\n }\r\n\r\n public disableComponents() {\r\n const components = {\r\n ...this.state.contextState.components,\r\n ...this.props.extraComponents,\r\n };\r\n Object.keys(components).forEach(key => {\r\n const component = components[key];\r\n component &&\r\n component.componentApi &&\r\n component.componentApi.disableComponent &&\r\n component.componentApi.disableComponent();\r\n });\r\n }\r\n\r\n public enableComponents() {\r\n const components = {\r\n ...this.state.contextState.components,\r\n ...this.props.extraComponents,\r\n };\r\n Object.keys(components).forEach(key => {\r\n const component = components[key];\r\n component &&\r\n component.componentApi &&\r\n component.componentApi.enableComponent &&\r\n component.componentApi.enableComponent();\r\n });\r\n }\r\n\r\n public touchAll() {\r\n const components = {\r\n ...this.state.contextState.components,\r\n ...this.props.extraComponents,\r\n };\r\n Object.keys(components).forEach(key => {\r\n const component = components[key];\r\n component &&\r\n component.componentApi &&\r\n component.componentApi.touch &&\r\n component.componentApi.touch();\r\n });\r\n }\r\n\r\n public unTouchAll() {\r\n const components = {\r\n ...this.state.contextState.components,\r\n ...this.props.extraComponents,\r\n };\r\n Object.keys(components).forEach(key => {\r\n const component = components[key];\r\n component &&\r\n component.componentApi &&\r\n component.componentApi.unTouch &&\r\n component.componentApi.unTouch();\r\n });\r\n }\r\n\r\n public render() {\r\n return (\r\n <this.props.component\r\n {...(this.props.id && { id: this.props.id })}\r\n noValidate={true}\r\n role=\"form\"\r\n className={`input__form validation-form ${\r\n this.props.className ? this.props.className : ''\r\n }`}\r\n onSubmit={this.onSubmit}\r\n >\r\n <FormContextProvider value={this.mergeContext()}>\r\n {this.props.children}\r\n </FormContextProvider>\r\n </this.props.component>\r\n );\r\n }\r\n\r\n private mergeContext(): FormContextState {\r\n if (!this.props.extraComponents) {\r\n return this.state.contextState;\r\n }\r\n const isFormValid =\r\n this.state.contextState.isFormValid &&\r\n this.getIsFormValid(this.props.extraComponents);\r\n return {\r\n ...this.state.contextState,\r\n components: {\r\n ...this.state.contextState.components,\r\n ...this.props.extraComponents,\r\n },\r\n isFormValid,\r\n };\r\n }\r\n\r\n private onSubmit = (e: React.FormEvent) => {\r\n e.preventDefault();\r\n this.props.onSubmit && this.props.onSubmit();\r\n };\r\n\r\n private subscribe(\r\n componentId: string,\r\n componentState: FormComponentContextState\r\n ) {\r\n if (componentId) {\r\n this.setState(previousState => {\r\n let components = Object.assign(\r\n {},\r\n previousState.contextState.components\r\n );\r\n if (componentState) {\r\n components[componentId] = componentState;\r\n }\r\n let isFormValid = this.getIsFormValid(components);\r\n return {\r\n contextState: {\r\n ...previousState.contextState,\r\n components,\r\n isFormValid,\r\n },\r\n };\r\n });\r\n }\r\n }\r\n\r\n private unSubscribe(componentId: string) {\r\n if (componentId) {\r\n this.setState(previousState => {\r\n let components = Object.assign(\r\n {},\r\n previousState.contextState.components\r\n );\r\n delete components[componentId];\r\n let isFormValid = this.getIsFormValid(components);\r\n return {\r\n contextState: {\r\n ...previousState.contextState,\r\n components,\r\n isFormValid,\r\n },\r\n };\r\n });\r\n }\r\n }\r\n\r\n private getIsFormValid(\r\n components: ComponentsDict = this.state.contextState.components,\r\n initialValid: boolean = true\r\n ): boolean {\r\n let isFormValid = initialValid;\r\n Object.keys(components).forEach(key => {\r\n const component = components[key];\r\n if (component && component.validation && !component.validation.isValid) {\r\n isFormValid = false;\r\n }\r\n });\r\n return isFormValid;\r\n }\r\n\r\n private updateCallback(\r\n componentId: string,\r\n componentState: FormComponentContextState\r\n ) {\r\n this.setState(previousState => {\r\n let components = Object.assign({}, previousState.contextState.components);\r\n const previousComponent = components[componentId];\r\n if (componentState && previousComponent) {\r\n components[componentId] = {\r\n ...previousComponent,\r\n ...componentState,\r\n validation: {\r\n ...previousComponent.validation,\r\n ...componentState.validation,\r\n },\r\n };\r\n }\r\n let isFormValid = this.getIsFormValid(components);\r\n return {\r\n contextState: {\r\n ...this.state.contextState,\r\n components,\r\n isFormValid,\r\n },\r\n };\r\n });\r\n }\r\n}\r\n\r\nexport default withThemeContext<FormProps, InstanceType<typeof Form>>(\r\n Form,\r\n 'form'\r\n);\r\n"],"mappings":";;;;;;;AACA;;AAGA;;AAMA;;;;;;;;;;;;;;AAmBO,MAAMA,IAAN,SAAmBC,KAAK,CAACC,aAAzB,CAA6D;EAOlEC,WAAW,CAACC,KAAD,EAAmB;IAC5B,MAAMA,KAAN;;IAD4B,kCA4HVC,CAAD,IAAwB;MACzCA,CAAC,CAACC,cAAF;MACA,KAAKF,KAAL,CAAWG,QAAX,IAAuB,KAAKH,KAAL,CAAWG,QAAX,EAAvB;IACD,CA/H6B;;IAE5B,KAAKC,SAAL,GAAiB,KAAKA,SAAL,CAAeC,IAAf,CAAoB,IAApB,CAAjB;IACA,KAAKC,WAAL,GAAmB,KAAKA,WAAL,CAAiBD,IAAjB,CAAsB,IAAtB,CAAnB;IACA,KAAKE,cAAL,GAAsB,KAAKA,cAAL,CAAoBF,IAApB,CAAyB,IAAzB,CAAtB;IACA,KAAKG,iBAAL,GAAyB,KAAKA,iBAAL,CAAuBH,IAAvB,CAA4B,IAA5B,CAAzB;IACA,KAAKI,gBAAL,GAAwB,KAAKA,gBAAL,CAAsBJ,IAAtB,CAA2B,IAA3B,CAAxB;IACA,KAAKK,KAAL,GAAa;MACXC,YAAY,EAAE;QACZP,SAAS,EAAE,KAAKA,SADJ;QAEZE,WAAW,EAAE,KAAKA,WAFN;QAGZM,WAAW,EAAE,IAHD;QAIZL,cAAc,EAAE,KAAKA,cAJT;QAKZC,iBAAiB,EAAE,KAAKA,iBALZ;QAMZC,gBAAgB,EAAE,KAAKA,gBANX;QAOZI,UAAU,EAAE;MAPA;IADH,CAAb;EAWD;;EAEMC,kBAAkB,CACvBC,SADuB,EAEvBC,SAFuB,EAGvBC,QAHuB,EAIjB;IAAA;;IACN,IACE,+BAAKP,KAAL,CAAWC,YAAX,gFAAyBC,WAAzB,OACAI,SADA,aACAA,SADA,gDACAA,SAAS,CAAEL,YADX,0DACA,sBAAyBC,WADzB,CADF,EAGE;MAAA;;MACA,6CAAKZ,KAAL,EAAWkB,cAAX,4HAA4B,KAAKR,KAAL,CAAWC,YAAvC,2DAA4B,uBAAyBC,WAArD;IACD;EACF;;EAEMJ,iBAAiB,GAAG;IACzB,MAAMK,UAAU,mCACX,KAAKH,KAAL,CAAWC,YAAX,CAAwBE,UADb,GAEX,KAAKb,KAAL,CAAWmB,eAFA,CAAhB;;IAIAC,MAAM,CAACC,IAAP,CAAYR,UAAZ,EAAwBS,OAAxB,CAAgCC,GAAG,IAAI;MACrC,MAAMC,SAAS,GAAGX,UAAU,CAACU,GAAD,CAA5B;MACAC,SAAS,IACPA,SAAS,CAACC,YADZ,IAEED,SAAS,CAACC,YAAV,CAAuBC,gBAFzB,IAGEF,SAAS,CAACC,YAAV,CAAuBC,gBAAvB,EAHF;IAID,CAND;EAOD;;EAEMjB,gBAAgB,GAAG;IACxB,MAAMI,UAAU,mCACX,KAAKH,KAAL,CAAWC,YAAX,CAAwBE,UADb,GAEX,KAAKb,KAAL,CAAWmB,eAFA,CAAhB;;IAIAC,MAAM,CAACC,IAAP,CAAYR,UAAZ,EAAwBS,OAAxB,CAAgCC,GAAG,IAAI;MACrC,MAAMC,SAAS,GAAGX,UAAU,CAACU,GAAD,CAA5B;MACAC,SAAS,IACPA,SAAS,CAACC,YADZ,IAEED,SAAS,CAACC,YAAV,CAAuBE,eAFzB,IAGEH,SAAS,CAACC,YAAV,CAAuBE,eAAvB,EAHF;IAID,CAND;EAOD;;EAEMC,QAAQ,GAAG;IAChB,MAAMf,UAAU,mCACX,KAAKH,KAAL,CAAWC,YAAX,CAAwBE,UADb,GAEX,KAAKb,KAAL,CAAWmB,eAFA,CAAhB;;IAIAC,MAAM,CAACC,IAAP,CAAYR,UAAZ,EAAwBS,OAAxB,CAAgCC,GAAG,IAAI;MACrC,MAAMC,SAAS,GAAGX,UAAU,CAACU,GAAD,CAA5B;MACAC,SAAS,IACPA,SAAS,CAACC,YADZ,IAEED,SAAS,CAACC,YAAV,CAAuBI,KAFzB,IAGEL,SAAS,CAACC,YAAV,CAAuBI,KAAvB,EAHF;IAID,CAND;EAOD;;EAEMC,UAAU,GAAG;IAClB,MAAMjB,UAAU,mCACX,KAAKH,KAAL,CAAWC,YAAX,CAAwBE,UADb,GAEX,KAAKb,KAAL,CAAWmB,eAFA,CAAhB;;IAIAC,MAAM,CAACC,IAAP,CAAYR,UAAZ,EAAwBS,OAAxB,CAAgCC,GAAG,IAAI;MACrC,MAAMC,SAAS,GAAGX,UAAU,CAACU,GAAD,CAA5B;MACAC,SAAS,IACPA,SAAS,CAACC,YADZ,IAEED,SAAS,CAACC,YAAV,CAAuBM,OAFzB,IAGEP,SAAS,CAACC,YAAV,CAAuBM,OAAvB,EAHF;IAID,CAND;EAOD;;EAEMC,MAAM,GAAG;IACd,oBACE,yBAAM,KAAN,CAAY,SAAZ,eACO,KAAKhC,KAAL,CAAWiC,EAAX,IAAiB;MAAEA,EAAE,EAAE,KAAKjC,KAAL,CAAWiC;IAAjB,CADxB;MAEE,UAAU,EAAE,IAFd;MAGE,IAAI,EAAC,MAHP;MAIE,SAAS,EAAG,+BACV,KAAKjC,KAAL,CAAWkC,SAAX,GAAuB,KAAKlC,KAAL,CAAWkC,SAAlC,GAA8C,EAC/C,EANH;MAOE,QAAQ,EAAE,KAAK/B;IAPjB,iBASE,oBAAC,gCAAD;MAAqB,KAAK,EAAE,KAAKgC,YAAL;IAA5B,GACG,KAAKnC,KAAL,CAAWoC,QADd,CATF,CADF;EAeD;;EAEOD,YAAY,GAAqB;IACvC,IAAI,CAAC,KAAKnC,KAAL,CAAWmB,eAAhB,EAAiC;MAC/B,OAAO,KAAKT,KAAL,CAAWC,YAAlB;IACD;;IACD,MAAMC,WAAW,GACf,KAAKF,KAAL,CAAWC,YAAX,CAAwBC,WAAxB,IACA,KAAKyB,cAAL,CAAoB,KAAKrC,KAAL,CAAWmB,eAA/B,CAFF;IAGA,uCACK,KAAKT,KAAL,CAAWC,YADhB;MAEEE,UAAU,kCACL,KAAKH,KAAL,CAAWC,YAAX,CAAwBE,UADnB,GAEL,KAAKb,KAAL,CAAWmB,eAFN,CAFZ;MAMEP;IANF;EAQD;;EAOOR,SAAS,CACfkC,WADe,EAEfC,cAFe,EAGf;IACA,IAAID,WAAJ,EAAiB;MACf,KAAKE,QAAL,CAAcC,aAAa,IAAI;QAC7B,IAAI5B,UAAU,GAAGO,MAAM,CAACsB,MAAP,CACf,EADe,EAEfD,aAAa,CAAC9B,YAAd,CAA2BE,UAFZ,CAAjB;;QAIA,IAAI0B,cAAJ,EAAoB;UAClB1B,UAAU,CAACyB,WAAD,CAAV,GAA0BC,cAA1B;QACD;;QACD,IAAI3B,WAAW,GAAG,KAAKyB,cAAL,CAAoBxB,UAApB,CAAlB;QACA,OAAO;UACLF,YAAY,kCACP8B,aAAa,CAAC9B,YADP;YAEVE,UAFU;YAGVD;UAHU;QADP,CAAP;MAOD,CAhBD;IAiBD;EACF;;EAEON,WAAW,CAACgC,WAAD,EAAsB;IACvC,IAAIA,WAAJ,EAAiB;MACf,KAAKE,QAAL,CAAcC,aAAa,IAAI;QAC7B,IAAI5B,UAAU,GAAGO,MAAM,CAACsB,MAAP,CACf,EADe,EAEfD,aAAa,CAAC9B,YAAd,CAA2BE,UAFZ,CAAjB;QAIA,OAAOA,UAAU,CAACyB,WAAD,CAAjB;QACA,IAAI1B,WAAW,GAAG,KAAKyB,cAAL,CAAoBxB,UAApB,CAAlB;QACA,OAAO;UACLF,YAAY,kCACP8B,aAAa,CAAC9B,YADP;YAEVE,UAFU;YAGVD;UAHU;QADP,CAAP;MAOD,CAdD;IAeD;EACF;;EAEOyB,cAAc,GAGX;IAAA,IAFTxB,UAES,uEAFoB,KAAKH,KAAL,CAAWC,YAAX,CAAwBE,UAE5C;IAAA,IADT8B,YACS,uEADe,IACf;IACT,IAAI/B,WAAW,GAAG+B,YAAlB;IACAvB,MAAM,CAACC,IAAP,CAAYR,UAAZ,EAAwBS,OAAxB,CAAgCC,GAAG,IAAI;MACrC,MAAMC,SAAS,GAAGX,UAAU,CAACU,GAAD,CAA5B;;MACA,IAAIC,SAAS,IAAIA,SAAS,CAACoB,UAAvB,IAAqC,CAACpB,SAAS,CAACoB,UAAV,CAAqBC,OAA/D,EAAwE;QACtEjC,WAAW,GAAG,KAAd;MACD;IACF,CALD;IAMA,OAAOA,WAAP;EACD;;EAEOL,cAAc,CACpB+B,WADoB,EAEpBC,cAFoB,EAGpB;IACA,KAAKC,QAAL,CAAcC,aAAa,IAAI;MAC7B,IAAI5B,UAAU,GAAGO,MAAM,CAACsB,MAAP,CAAc,EAAd,EAAkBD,aAAa,CAAC9B,YAAd,CAA2BE,UAA7C,CAAjB;MACA,MAAMiC,iBAAiB,GAAGjC,UAAU,CAACyB,WAAD,CAApC;;MACA,IAAIC,cAAc,IAAIO,iBAAtB,EAAyC;QACvCjC,UAAU,CAACyB,WAAD,CAAV,iDACKQ,iBADL,GAEKP,cAFL;UAGEK,UAAU,kCACLE,iBAAiB,CAACF,UADb,GAELL,cAAc,CAACK,UAFV;QAHZ;MAQD;;MACD,IAAIhC,WAAW,GAAG,KAAKyB,cAAL,CAAoBxB,UAApB,CAAlB;MACA,OAAO;QACLF,YAAY,kCACP,KAAKD,KAAL,CAAWC,YADJ;UAEVE,UAFU;UAGVD;QAHU;MADP,CAAP;IAOD,CArBD;EAsBD;;AA7NiE;;;;gBAAvDhB,I,kBACkB;EAC3BmD,UAAU,EAAE,KADe;EAE3BC,aAAa,EAAE,IAFY;EAG3BxB,SAAS,EAAE;AAHgB,C;;eA+NhB,IAAAyB,kCAAA,EACbrD,IADa,EAEb,MAFa,C"}
1
+ {"version":3,"file":"Form.js","names":["Form","React","PureComponent","constructor","props","e","preventDefault","onSubmit","subscribe","bind","unSubscribe","updateCallback","disableComponents","enableComponents","state","contextState","isFormValid","components","componentDidUpdate","prevProps","prevState","snapshot","componentsWithErrors","Object","keys","map","key","filter","component","validation","isValid","name","console","warn","onValidChanged","reduce","prev","current","errors","extraComponents","forEach","componentApi","disableComponent","enableComponent","touchAll","touch","unTouchAll","unTouch","render","id","className","mergeContext","children","getIsFormValid","componentId","componentState","setState","previousState","assign","initialValid","previousComponent","noValidate","showExpandAll","withThemeContext"],"sources":["../../../src/lib/components/form/Form.tsx"],"sourcesContent":["// Libs\r\nimport * as React from 'react';\r\n\r\n// Misc\r\nimport {\r\n FormContextState,\r\n FormComponentContextState,\r\n FormContextProvider,\r\n ComponentsDict,\r\n} from './FormContext';\r\nimport { withThemeContext } from '../themeProvider/withThemeContext';\r\nimport { ThemeContextProps } from '../themeProvider/ThemeContext';\r\nimport { ValidationError } from '../base/input';\r\n\r\nexport type FormProps = React.PropsWithChildren<\r\n ThemeContextProps & {\r\n id?: string;\r\n className?: string;\r\n noValidate?: boolean;\r\n onSubmit?: () => void;\r\n extraComponents?: ComponentsDict;\r\n component?: keyof JSX.IntrinsicElements;\r\n onValidChanged?: (isValid: boolean, errors?: ValidationError[]) => void;\r\n }\r\n>;\r\n\r\nexport interface FormState {\r\n contextState: FormContextState;\r\n}\r\n\r\nexport class Form extends React.PureComponent<FormProps, FormState> {\r\n public static defaultProps = {\r\n noValidate: false,\r\n showExpandAll: true,\r\n component: 'form' as keyof JSX.IntrinsicElements,\r\n };\r\n\r\n constructor(props: FormProps) {\r\n super(props);\r\n this.subscribe = this.subscribe.bind(this);\r\n this.unSubscribe = this.unSubscribe.bind(this);\r\n this.updateCallback = this.updateCallback.bind(this);\r\n this.disableComponents = this.disableComponents.bind(this);\r\n this.enableComponents = this.enableComponents.bind(this);\r\n this.state = {\r\n contextState: {\r\n subscribe: this.subscribe,\r\n unSubscribe: this.unSubscribe,\r\n isFormValid: true,\r\n updateCallback: this.updateCallback,\r\n disableComponents: this.disableComponents,\r\n enableComponents: this.enableComponents,\r\n components: {},\r\n },\r\n };\r\n }\r\n\r\n public componentDidUpdate(\r\n prevProps: Readonly<FormProps>,\r\n prevState: Readonly<FormState>,\r\n snapshot?: any\r\n ): void {\r\n if (\r\n this.state.contextState?.isFormValid !==\r\n prevState?.contextState?.isFormValid\r\n ) {\r\n const componentsWithErrors = this.state.contextState\r\n ? Object.keys(this.state.contextState.components)\r\n .map(key => this.state.contextState.components[key])\r\n .filter(component => {\r\n if (!component.validation.isValid && !component.validation.name) {\r\n console.warn(\r\n component,\r\n 'Has validation error. FormValidationSummary is present but the component has no validation name'\r\n );\r\n }\r\n return !component.validation.isValid;\r\n })\r\n : [];\r\n this.props.onValidChanged?.(\r\n this.state.contextState?.isFormValid,\r\n componentsWithErrors.reduce(\r\n (prev, current) => [...prev, ...current.validation.errors],\r\n []\r\n )\r\n );\r\n }\r\n }\r\n\r\n public disableComponents() {\r\n const components = {\r\n ...this.state.contextState.components,\r\n ...this.props.extraComponents,\r\n };\r\n Object.keys(components).forEach(key => {\r\n const component = components[key];\r\n component &&\r\n component.componentApi &&\r\n component.componentApi.disableComponent &&\r\n component.componentApi.disableComponent();\r\n });\r\n }\r\n\r\n public enableComponents() {\r\n const components = {\r\n ...this.state.contextState.components,\r\n ...this.props.extraComponents,\r\n };\r\n Object.keys(components).forEach(key => {\r\n const component = components[key];\r\n component &&\r\n component.componentApi &&\r\n component.componentApi.enableComponent &&\r\n component.componentApi.enableComponent();\r\n });\r\n }\r\n\r\n public touchAll() {\r\n const components = {\r\n ...this.state.contextState.components,\r\n ...this.props.extraComponents,\r\n };\r\n Object.keys(components).forEach(key => {\r\n const component = components[key];\r\n component &&\r\n component.componentApi &&\r\n component.componentApi.touch &&\r\n component.componentApi.touch();\r\n });\r\n }\r\n\r\n public unTouchAll() {\r\n const components = {\r\n ...this.state.contextState.components,\r\n ...this.props.extraComponents,\r\n };\r\n Object.keys(components).forEach(key => {\r\n const component = components[key];\r\n component &&\r\n component.componentApi &&\r\n component.componentApi.unTouch &&\r\n component.componentApi.unTouch();\r\n });\r\n }\r\n\r\n public render() {\r\n return (\r\n <this.props.component\r\n {...(this.props.id && { id: this.props.id })}\r\n noValidate={true}\r\n role=\"form\"\r\n className={`input__form validation-form ${\r\n this.props.className ? this.props.className : ''\r\n }`}\r\n onSubmit={this.onSubmit}\r\n >\r\n <FormContextProvider value={this.mergeContext()}>\r\n {this.props.children}\r\n </FormContextProvider>\r\n </this.props.component>\r\n );\r\n }\r\n\r\n private mergeContext(): FormContextState {\r\n if (!this.props.extraComponents) {\r\n return this.state.contextState;\r\n }\r\n const isFormValid =\r\n this.state.contextState.isFormValid &&\r\n this.getIsFormValid(this.props.extraComponents);\r\n return {\r\n ...this.state.contextState,\r\n components: {\r\n ...this.state.contextState.components,\r\n ...this.props.extraComponents,\r\n },\r\n isFormValid,\r\n };\r\n }\r\n\r\n private onSubmit = (e: React.FormEvent) => {\r\n e.preventDefault();\r\n this.props.onSubmit && this.props.onSubmit();\r\n };\r\n\r\n private subscribe(\r\n componentId: string,\r\n componentState: FormComponentContextState\r\n ) {\r\n if (componentId) {\r\n this.setState(previousState => {\r\n let components = Object.assign(\r\n {},\r\n previousState.contextState.components\r\n );\r\n if (componentState) {\r\n components[componentId] = componentState;\r\n }\r\n let isFormValid = this.getIsFormValid(components);\r\n return {\r\n contextState: {\r\n ...previousState.contextState,\r\n components,\r\n isFormValid,\r\n },\r\n };\r\n });\r\n }\r\n }\r\n\r\n private unSubscribe(componentId: string) {\r\n if (componentId) {\r\n this.setState(previousState => {\r\n let components = Object.assign(\r\n {},\r\n previousState.contextState.components\r\n );\r\n delete components[componentId];\r\n let isFormValid = this.getIsFormValid(components);\r\n return {\r\n contextState: {\r\n ...previousState.contextState,\r\n components,\r\n isFormValid,\r\n },\r\n };\r\n });\r\n }\r\n }\r\n\r\n private getIsFormValid(\r\n components: ComponentsDict = this.state.contextState.components,\r\n initialValid: boolean = true\r\n ): boolean {\r\n let isFormValid = initialValid;\r\n Object.keys(components).forEach(key => {\r\n const component = components[key];\r\n if (component && component.validation && !component.validation.isValid) {\r\n isFormValid = false;\r\n }\r\n });\r\n return isFormValid;\r\n }\r\n\r\n private updateCallback(\r\n componentId: string,\r\n componentState: FormComponentContextState\r\n ) {\r\n this.setState(previousState => {\r\n let components = Object.assign({}, previousState.contextState.components);\r\n const previousComponent = components[componentId];\r\n if (componentState && previousComponent) {\r\n components[componentId] = {\r\n ...previousComponent,\r\n ...componentState,\r\n validation: {\r\n ...previousComponent.validation,\r\n ...componentState.validation,\r\n },\r\n };\r\n }\r\n let isFormValid = this.getIsFormValid(components);\r\n return {\r\n contextState: {\r\n ...this.state.contextState,\r\n components,\r\n isFormValid,\r\n },\r\n };\r\n });\r\n }\r\n}\r\n\r\nexport default withThemeContext<FormProps, InstanceType<typeof Form>>(\r\n Form,\r\n 'form'\r\n);\r\n"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"TagsSuggestions.js","names":["popperModifiers","name","enabled","DefaultSuggestionTag","index","tag","id","onClick","isPreselected","toString","Suggestions","props","onSelected","onSelectedFactory","React","useCallback","lastSelected","e","popperStyle","useMemo","width","anchorEl","scrollWidth","zIndex","SuggestionTag","isVisible","popperProps","classNames","className","loading","innerRef","AddNewTagComponent","LoadingComponent","isWaitingForMoreInput","WaitingForMoreInputComponent","tags","map","length","preselectedSuggestion","undefined","EmptyComponent","allowNew","SuggestionsWrapped"],"sources":["../../../../src/lib/components/tags/subComponents/TagsSuggestions.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport { Tag } from '..';\r\nimport { Button } from '../../..';\r\nimport Popper, { PopperProps } from '@mui/material/Popper';\r\nimport classNames from 'classnames';\r\n\r\nexport type RenderSuggestionTagProps<T extends Tag = Tag> = {\r\n tag: T;\r\n index: number;\r\n id?: string;\r\n onClick: (e: React.MouseEvent<HTMLElement>) => void;\r\n isPreselected: boolean;\r\n};\r\n\r\nexport type SuggestionsProps<T extends Tag = Tag> = {\r\n className?: string;\r\n innerRef: React.RefObject<HTMLDivElement>;\r\n anchorEl: HTMLElement;\r\n id?: string;\r\n preselectedSuggestion?: number;\r\n isVisible: boolean;\r\n isWaitingForMoreInput: boolean;\r\n tags: T[];\r\n onSelected: (tag: T, lastSelected: boolean) => void;\r\n value: string;\r\n loading: boolean;\r\n LoadingComponent?: string | JSX.Element;\r\n EmptyComponent?: string | JSX.Element;\r\n AddNewTagComponent?: JSX.Element;\r\n WaitingForMoreInputComponent?: string | JSX.Element;\r\n allowNew: boolean;\r\n popperProps?: Partial<PopperProps>;\r\n SuggestionTag?: React.ComponentType<RenderSuggestionTagProps<T>>;\r\n};\r\n\r\ntype InjectedProps = {};\r\n\r\nconst popperModifiers: PopperProps['modifiers'] = [\r\n {\r\n name: 'flip',\r\n enabled: true,\r\n },\r\n];\r\n\r\nfunction DefaultSuggestionTag<T extends Tag = Tag>({\r\n index,\r\n tag,\r\n id,\r\n onClick,\r\n isPreselected,\r\n}: RenderSuggestionTagProps<T>) {\r\n return (\r\n <li key={index}>\r\n <Button\r\n {...(id && {\r\n id: id + '-suggestion-' + index.toString(),\r\n })}\r\n className={\r\n 'w-100 tags-input__suggestion ' +\r\n (isPreselected ? 'tags-input__suggestion--preselected' : '')\r\n }\r\n onClick={onClick}\r\n dropdown={true}\r\n >\r\n {tag.name}\r\n </Button>\r\n </li>\r\n );\r\n}\r\n\r\nfunction Suggestions<T extends Tag = Tag>(\r\n props: SuggestionsProps<T> & InjectedProps\r\n) {\r\n const { onSelected } = props;\r\n const onSelectedFactory = React.useCallback(\r\n (tag: T, lastSelected: boolean) => (e: React.MouseEvent) => {\r\n onSelected(tag, lastSelected);\r\n },\r\n [onSelected]\r\n );\r\n const popperStyle = React.useMemo(\r\n () => ({ width: props.anchorEl?.scrollWidth, zIndex: 10000 }),\r\n [props.anchorEl?.scrollWidth]\r\n );\r\n\r\n const { SuggestionTag = DefaultSuggestionTag } = props;\r\n return (\r\n props.anchorEl && (\r\n <Popper\r\n open={props.isVisible}\r\n anchorEl={props.anchorEl}\r\n style={popperStyle}\r\n placement=\"bottom-start\"\r\n modifiers={popperModifiers}\r\n {...props.popperProps}\r\n >\r\n <div\r\n {...(props.id && {\r\n id: props.id,\r\n })}\r\n className={classNames('tags-input__suggestions', props.className, {\r\n 'tags-input__suggestions--loading': props.loading,\r\n })}\r\n ref={props.innerRef}\r\n >\r\n <ul>\r\n {props.AddNewTagComponent}\r\n {props.loading && props.LoadingComponent}\r\n {props.isWaitingForMoreInput &&\r\n props.WaitingForMoreInputComponent && (\r\n <li className=\"w-100 text-center p-2\">\r\n {props.WaitingForMoreInputComponent}\r\n </li>\r\n )}\r\n {!props.isWaitingForMoreInput &&\r\n props.tags.map((tag, index) => (\r\n <SuggestionTag\r\n key={tag.id}\r\n index={index}\r\n tag={tag}\r\n onClick={onSelectedFactory(tag, props.tags.length === 1)}\r\n id={props.id}\r\n isPreselected={\r\n props.preselectedSuggestion !== undefined &&\r\n props.preselectedSuggestion === index\r\n }\r\n />\r\n ))}\r\n {props.EmptyComponent &&\r\n props.tags.length === 0 &&\r\n !props.allowNew &&\r\n !props.isWaitingForMoreInput &&\r\n !props.loading && (\r\n <li className=\"w-100 text-center p-2\">\r\n {props.EmptyComponent}\r\n </li>\r\n )}\r\n </ul>\r\n </div>\r\n </Popper>\r\n )\r\n );\r\n}\r\n\r\nconst SuggestionsWrapped = Suggestions;\r\n\r\nexport default SuggestionsWrapped;\r\n"],"mappings":"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"}
1
+ {"version":3,"file":"TagsSuggestions.js","names":["popperModifiers","name","enabled","DefaultSuggestionTag","index","tag","id","onClick","isPreselected","toString","Suggestions","props","onSelected","onSelectedFactory","React","useCallback","lastSelected","e","popperStyle","useMemo","width","anchorEl","scrollWidth","zIndex","SuggestionTag","isVisible","popperProps","classNames","className","loading","innerRef","AddNewTagComponent","LoadingComponent","isWaitingForMoreInput","WaitingForMoreInputComponent","tags","map","length","preselectedSuggestion","undefined","EmptyComponent","allowNew","SuggestionsWrapped"],"sources":["../../../../src/lib/components/tags/subComponents/TagsSuggestions.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport { Tag } from '..';\r\nimport { Button } from '../../..';\r\nimport Popper, { PopperProps } from '@mui/material/Popper';\r\nimport classNames from 'classnames';\r\n\r\nexport type RenderSuggestionTagProps<T extends Tag = Tag> = {\r\n tag: T;\r\n index: number;\r\n id?: string;\r\n onClick: (e: React.MouseEvent<HTMLElement>) => void;\r\n isPreselected: boolean;\r\n};\r\n\r\nexport type SuggestionsProps<T extends Tag = Tag> = {\r\n className?: string;\r\n innerRef: React.RefObject<HTMLDivElement>;\r\n anchorEl: HTMLElement;\r\n id?: string;\r\n preselectedSuggestion?: number;\r\n isVisible: boolean;\r\n isWaitingForMoreInput: boolean;\r\n tags: T[];\r\n onSelected: (tag: T, lastSelected: boolean) => void;\r\n value: string;\r\n loading: boolean;\r\n LoadingComponent?: string | JSX.Element;\r\n EmptyComponent?: string | JSX.Element;\r\n AddNewTagComponent?: JSX.Element;\r\n WaitingForMoreInputComponent?: string | JSX.Element;\r\n allowNew: boolean;\r\n popperProps?: Partial<PopperProps>;\r\n SuggestionTag?: React.ComponentType<RenderSuggestionTagProps<T>>;\r\n};\r\n\r\ntype InjectedProps = {};\r\n\r\nconst popperModifiers: PopperProps['modifiers'] = [\r\n {\r\n name: 'flip',\r\n enabled: true,\r\n },\r\n];\r\n\r\nfunction DefaultSuggestionTag<T extends Tag = Tag>({\r\n index,\r\n tag,\r\n id,\r\n onClick,\r\n isPreselected,\r\n}: RenderSuggestionTagProps<T>) {\r\n return (\r\n <li key={index}>\r\n <Button\r\n {...(id && {\r\n id: id + '-suggestion-' + index.toString(),\r\n })}\r\n className={\r\n 'w-100 tags-input__suggestion ' +\r\n (isPreselected ? 'tags-input__suggestion--preselected' : '')\r\n }\r\n onClick={onClick}\r\n dropdown={true}\r\n >\r\n {tag.name}\r\n </Button>\r\n </li>\r\n );\r\n}\r\n\r\nfunction Suggestions<T extends Tag = Tag>(\r\n props: SuggestionsProps<T> & InjectedProps\r\n) {\r\n const { onSelected } = props;\r\n const onSelectedFactory = React.useCallback(\r\n (tag: T, lastSelected: boolean) => (e: React.MouseEvent) => {\r\n onSelected(tag, lastSelected);\r\n },\r\n [onSelected]\r\n );\r\n const popperStyle = React.useMemo(\r\n () => ({\r\n width: props.anchorEl?.scrollWidth,\r\n zIndex: 10000,\r\n }),\r\n [props.anchorEl?.scrollWidth]\r\n );\r\n\r\n const { SuggestionTag = DefaultSuggestionTag } = props;\r\n return (\r\n props.anchorEl && (\r\n <Popper\r\n open={props.isVisible}\r\n anchorEl={props.anchorEl}\r\n style={popperStyle}\r\n placement=\"bottom-start\"\r\n modifiers={popperModifiers}\r\n {...props.popperProps}\r\n >\r\n <div\r\n {...(props.id && {\r\n id: props.id,\r\n })}\r\n className={classNames('tags-input__suggestions', props.className, {\r\n 'tags-input__suggestions--loading': props.loading,\r\n })}\r\n ref={props.innerRef}\r\n >\r\n <ul>\r\n {props.AddNewTagComponent}\r\n {props.loading && props.LoadingComponent}\r\n {props.isWaitingForMoreInput &&\r\n props.WaitingForMoreInputComponent && (\r\n <li className=\"w-100 text-center p-2\">\r\n {props.WaitingForMoreInputComponent}\r\n </li>\r\n )}\r\n {!props.isWaitingForMoreInput &&\r\n props.tags.map((tag, index) => (\r\n <SuggestionTag\r\n key={tag.id}\r\n index={index}\r\n tag={tag}\r\n onClick={onSelectedFactory(tag, props.tags.length === 1)}\r\n id={props.id}\r\n isPreselected={\r\n props.preselectedSuggestion !== undefined &&\r\n props.preselectedSuggestion === index\r\n }\r\n />\r\n ))}\r\n {props.EmptyComponent &&\r\n props.tags.length === 0 &&\r\n !props.allowNew &&\r\n !props.isWaitingForMoreInput &&\r\n !props.loading && (\r\n <li className=\"w-100 text-center p-2\">\r\n {props.EmptyComponent}\r\n </li>\r\n )}\r\n </ul>\r\n </div>\r\n </Popper>\r\n )\r\n );\r\n}\r\n\r\nconst SuggestionsWrapped = Suggestions;\r\n\r\nexport default SuggestionsWrapped;\r\n"],"mappings":"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"}
@@ -3,7 +3,7 @@
3
3
  <head>
4
4
  <meta charset="UTF-8"/>
5
5
  <meta name="viewport" content="width=device-width, initial-scale=1"/>
6
- <title>guestbell-forms [28 Feb 2023 at 17:13]</title>
6
+ <title>guestbell-forms [31 Mar 2023 at 11:53]</title>
7
7
  <link rel="shortcut icon" href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAMAAACdt4HsAAABrVBMVEUAAAD///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////+O1foceMD///+J0/qK1Pr7/v8Xdr/9///W8P4UdL7L7P0Scr2r4Pyj3vwad8D5/f/2/f+55f3E6f34+/2H0/ojfMKpzOd0rNgQcb3F3O/j9f7c8v6g3Pz0/P/w+v/q+P7n9v6T1/uQ1vuE0vqLut/y+v+Z2fvt+f+15Pzv9fuc2/vR7v2V2Pvd6/bg9P7I6/285/2y4/yp3/zp8vk8i8kqgMT7/P31+fyv4vxGkcz6/P6/6P3j7vfS5PNnpNUxhcbO7f7F6v3O4vHK3/DA2u631Ouy0eqXweKJud5wqthfoNMMbLvY8f73+v2dxeR8sNtTmdDx9/zX6PSjyeaCtd1YnNGX2PuQveCGt95Nls42h8dLlM3F4vBtAAAAM3RSTlMAAyOx0/sKBvik8opWGBMOAe3l1snDm2E9LSb06eHcu5JpHbarfHZCN9CBb08zzkdNS0kYaptYAAAFV0lEQVRYw92X51/aYBDHHS2O2qqttVbrqNq9m+TJIAYIShBkWwqIiCgoWvfeq7Z2/s29hyQNyUcR7LveGwVyXy6XH8/9rqxglLfUPLxVduUor3h0rfp2TYvpivk37929TkG037hffoX0+peVtZQc1589rigVUdXS/ABSAyEmGIO/1XfvldSK8vs3OqB6u3m0nxmIrvgB0dj7rr7Y9IbuF68hnfFaiHA/sxqm0wciIG43P60qKv9WXWc1RXGh/mFESFABTSBi0sNAKzqet17eCtOb3kZIDwxEEU0oAIJGYxNBDhBND29e0rtXXbcpuPmED9IhEAAQ/AXEaF8EPmnrrKsv0LvWR3fg5sWDNAFZOgAgaKvZDogHNU9MFwnnYROkc56RD5CjAbQX9Ow4g7upCsvYu55aSI/Nj0H1akgKQEUM94dwK65hYRmFU9MIcH/fqJYOZYcnuJSU/waKDgTOEVaVKhwrTRP5XzgSpAITYzom7UvkhFX5VutmxeNnWDjjswTKTyfgluNDGbUpWissXhF3s7mlSml+czWkg3D0l1nNjGNjz3myOQOa1KM/jOS6ebdbAVTCi4gljHSFrviza7tOgRWcS0MOUX9zdNgag5w7rRqA44Lzw0hr1WqES36dFliSJFlh2rXIae3FFcDDgKdxrUIDePr8jGcSClV1u7A9xeN0ModY/pHMxmR1EzRh8TJiwqsHmKW0l4FCEZI+jHio+JdPPE9qwQtTRxku2D8sIeRL2LnxWSllANCQGOIiqVHAz2ye2JR0DcH+HoxDkaADLjgxjKQ+AwCX/g0+DNgdG0ukYCONAe+dbc2IAc6fwt1ARoDSezNHxV2Cmzwv3O6lDMV55edBGwGK9n1+x2F8EDfAGCxug8MhpsMEcTEAWf3rx2vZhe/LAmtIn/6apE6PN0ULKgywD9mmdxbmFl3OvD5AS5fW5zLbv/YHmcsBTjf/afDz3MaZTVCfAP9z6/Bw6ycv8EUBWJIn9zYcoAWWlW9+OzO3vkTy8H+RANLmdrpOuYWdZYEXpo+TlCJrW5EARb7fF+bWdqf3hhyZI1nWJQHgznErZhbjoEsWqi8dQNoE294aldzFurwSABL2XXMf9+H1VQGke9exw5P/AnA5Pv5ngMul7LOvO922iwACu8WkCwLCafvM4CeWPxfA8lNHcWZSoi8EwMAIciKX2Z4SWCMAa3snCZ/G4EA8D6CMLNFsGQhkkz/gQNEBbPCbWsxGUpYVu3z8IyNAknwJkfPMEhLyrdi5RTyUVACkw4GSFRNWJNEW+fgPGwHD8/JxnRuLabN4CGNRkAE23na2+VmEAUmrYymSGjMAYqH84YUIyzgzs3XC7gNgH36Vcc4zKY9o9fgPBXUAiHHwVboBHGLiX6Zcjp1f2wu4tvzZKo0ecPnDtQYDQvJXaBeNzce45Fp28ZQLrEZVuFqgBwOalArKXnW1UzlnSusQKJqKYNuz4tOnI6sZG4zanpemv+7ySU2jbA9h6uhcgpfy6G2PahirDZ6zvq6zDduMVFTKvzw8wgyEdelwY9in3XkEPs3osJuwRQ4qTkfzifndg9Gfc4pdsu82+tTnHZTBa2EAMrqr2t43pguc8tNm7JQVQ2S0ukj2d22dhXYP0/veWtwKrCkNoNimAN5+Xr/oLrxswKbVJjteWrX7eR63o4j9q0GxnaBdWgGA5VStpanIjQmEhV0/nVt5VOFUvix6awJhPcAaTEShgrG+iGyvb5a0Ndb1YGHFPEwoqAinoaykaID1o1pdPNu7XsnCKQ3R+hwWIIhGvORcJUBYXe3Xa3vq/mF/N9V13ugufMkfXn+KHsRD0B8AAAAASUVORK5CYII=" type="image/x-icon" />
8
8
 
9
9
  <script>
package/package.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
- "version": "3.0.5",
2
+ "version": "3.0.7",
3
3
  "description": "React forms with validation as used in GuestBell",
4
4
  "keywords": [
5
5
  "react",
@@ -58,7 +58,7 @@
58
58
  "postcss-loader": "3.0.0",
59
59
  "prettier": "^1.19.1",
60
60
  "react": "17.0.2",
61
- "react-cool-dimensions": "^2.0.7",
61
+ "react-cool-dimensions": "^3.0.0",
62
62
  "react-datepicker": "4.2.1",
63
63
  "react-device-detect": "^1.13.1",
64
64
  "react-dom": "17.0.2",
@@ -126,7 +126,8 @@
126
126
  "react-device-detect": "*",
127
127
  "react-dom": "*",
128
128
  "react-ink": "*",
129
- "react-onclickoutside": "*"
129
+ "react-onclickoutside": "*",
130
+ "react-cool-dimensions": "*"
130
131
  },
131
132
  "browserslist": [
132
133
  "last 1 version",