@vincentgraul/react-components 1.0.35 → 1.0.37

package/build/country-selector/CountrySelector.d.ts

@@ -1,6 +1,7 @@
 import { ReactNode } from "react";
 interface Props {
     languages: string[];
+    value?: string;
     onChange?: (option: Option) => void;
     flagWidth?: string;
     className?: string;

package/build/country-selector/CountrySelector.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CountrySelector.d.ts","sourceRoot":"","sources":["../../src/country-selector/CountrySelector.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,SAAS,EAAuB,MAAM,OAAO,CAAC;AAK9D,UAAU,KAAK;IACb,SAAS,EAAE,MAAM,EAAE,CAAC;IACpB,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,UAAU,MAAM;IACd,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,SAAS,CAAC;CAClB;AAED,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,KAAK,EAAE,KAAK,2CAwCnD"}
+{"version":3,"file":"CountrySelector.d.ts","sourceRoot":"","sources":["../../src/country-selector/CountrySelector.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,SAAS,EAAuB,MAAM,OAAO,CAAC;AAK9D,UAAU,KAAK;IACb,SAAS,EAAE,MAAM,EAAE,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,UAAU,MAAM;IACd,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,SAAS,CAAC;CAClB;AAED,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,KAAK,EAAE,KAAK,2CAyCnD"}

package/build/country-selector/CountrySelector.js

@@ -13,7 +13,7 @@ import Select from "../select/Select";
 import { capitalize } from "@vincentgraul/utils/word";
 import * as Icons from "./icons";
 export default function CountrySelector(props) {
-    const { className, languages, onChange, flagWidth = "30px" } = props;
+    const { value, className, languages, onChange, flagWidth = "30px" } = props;
     const [options, setOptions] = useState(null);
     const FlagStyle = {
         display: "block",
@@ -36,5 +36,5 @@ export default function CountrySelector(props) {
     if (!options) {
         return null;
     }
-    return (_jsx(Select, { className: `country-selector ${className}`, options: options, onChange: onChange }));
+    return (_jsx(Select, { selectedValue: value, className: `country-selector ${className}`, options: options, onChange: onChange }));
 }

package/build/select/Select.d.ts

@@ -7,6 +7,7 @@ interface Option {
 export type OptionWithoutId = Omit<Option, "id">;
 interface Props {
     options: OptionWithoutId[];
+    selectedValue?: string;
     onChange?: (option: Option) => void;
     className?: string;
 }

package/build/select/Select.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../src/select/Select.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAA+B,MAAM,OAAO,CAAC;AAKtE,UAAU,MAAM;IACd,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,MAAM,eAAe,GAAG,IAAI,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC;AAEjD,UAAU,KAAK;IACb,OAAO,EAAE,eAAe,EAAE,CAAC;IAC3B,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,CAAC,OAAO,UAAU,MAAM,CAAC,KAAK,EAAE,KAAK,2CA0E1C;AAoCD,QAAA,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAmBX,CAAC"}
+{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../src/select/Select.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAA+B,MAAM,OAAO,CAAC;AAKtE,UAAU,MAAM;IACd,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,MAAM,eAAe,GAAG,IAAI,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC;AAEjD,UAAU,KAAK;IACb,OAAO,EAAE,eAAe,EAAE,CAAC;IAC3B,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,CAAC,OAAO,UAAU,MAAM,CAAC,KAAK,EAAE,KAAK,2CA4E1C;AAoCD,QAAA,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAmBX,CAAC"}

package/build/select/Select.js

@@ -4,7 +4,7 @@ import styled from "styled-components";
 import { ArrowBottom } from "./icons";
 import useOutsideAlerter from "../outside-alerter/useOutsideAlerter";
 export default function Select(props) {
-    const { className, onChange } = props;
+    const { selectedValue, className, onChange } = props;
     const [options, setOptions] = useState(null);
     const [isListVisible, setListVisibility] = useState(false);
     const [selectedOption, setSelectedOption] = useState(null);
@@ -25,8 +25,8 @@ export default function Select(props) {
         setOptions(props.options.map((option, index) => (Object.assign(Object.assign({}, option), { id: index }))));
     }, [props.options]);
     useEffect(() => {
-        if (options) {
-            setSelectedOption(options[0]);
+        if (options && !selectedOption) {
+            setSelectedOption(selectedValue ? options.find((option) => option.value === selectedValue) : options[0]);
         }
     }, [options]);
     useEffect(() => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vincentgraul/react-components",
-  "version": "1.0.35",
+  "version": "1.0.37",
   "exports": {
     "./match-device": {
       "import": "./build/match-device/useMatchDevice.js"