@manuscripts/style-guide 3.5.9 → 3.5.10

package/dist/cjs/components/DatePicker.js

@@ -12,6 +12,9 @@ const styled_components_1 = __importDefault(require("styled-components"));
 const icons_1 = require("./icons");
 const DatePicker = ({ id, originalDate, date, handleDateChange, placeholder, showTimeSelect, required, }) => {
     const [selectedDate, setSelectedDate] = (0, react_1.useState)(date || null);
+    (0, react_1.useEffect)(() => {
+        setSelectedDate(date ?? null);
+    }, [date]);
     const handleChange = (date) => {
         setSelectedDate(date);
         handleDateChange(date);

package/dist/cjs/components/FormCommon.js

@@ -45,6 +45,7 @@ exports.TextWithGenerationWrapper = styled_components_1.default.div `
 `;
 exports.TextFieldError = styled_components_1.default.div `
   margin-top: 4px;
+  width: 100%;
 `;
 exports.TextFieldErrorItem = styled_components_1.default.div `
   font-family: ${(props) => props.theme.font.family.sans};

package/dist/cjs/components/FormFieldContainer.js

@@ -17,6 +17,7 @@ const FormFieldContainer = ({ label, error, info, id, children, }) => {
 };
 exports.FormFieldContainer = FormFieldContainer;
 const FormFieldInfo = styled_components_1.default.div `
+  width: 100%;
   font-family: ${(props) => props.theme.font.family.sans};
   font-size: ${(props) => props.theme.font.size.small};
   color: ${(props) => props.theme.colors.text.secondary};

package/dist/cjs/components/TextField.js

@@ -155,6 +155,7 @@ exports.TextFieldGroup = styled_components_1.default.div `
 `;
 exports.TextFieldLabel = styled_components_1.default.label `
   display: block;
+  width: 100%;
   font-family: ${(props) => props.theme.font.family.sans};
   color: ${(props) => props.theme.colors.text.primary};
   font-size: ${(props) => props.theme.font.size.normal};

package/dist/es/components/DatePicker.js

@@ -1,11 +1,14 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import 'react-datepicker/dist/react-datepicker.css';
-import { useState } from 'react';
+import { useEffect, useState } from 'react';
 import ReactDatePicker from 'react-datepicker';
 import styled from 'styled-components';
 import { CalendarIcon } from './icons';
 export const DatePicker = ({ id, originalDate, date, handleDateChange, placeholder, showTimeSelect, required, }) => {
     const [selectedDate, setSelectedDate] = useState(date || null);
+    useEffect(() => {
+        setSelectedDate(date ?? null);
+    }, [date]);
     const handleChange = (date) => {
         setSelectedDate(date);
         handleDateChange(date);

package/dist/es/components/FormCommon.js

@@ -37,6 +37,7 @@ export const TextWithGenerationWrapper = styled.div `
 `;
 export const TextFieldError = styled.div `
   margin-top: 4px;
+  width: 100%;
 `;
 export const TextFieldErrorItem = styled.div `
   font-family: ${(props) => props.theme.font.family.sans};

package/dist/es/components/FormFieldContainer.js

@@ -10,6 +10,7 @@ export const FormFieldContainer = ({ label, error, info, id, children, }) => {
     return (_jsxs(Fragment, { children: [label ? (_jsxs(TextFieldLabel, { htmlFor: id, children: [label, " ", childrenWithErrorProp] })) : (childrenWithErrorProp), info && !error && _jsx(FormFieldInfo, { children: info }), error && (_jsx(TextFieldError, { children: _jsx(TextFieldErrorItem, { children: error }) }))] }));
 };
 const FormFieldInfo = styled.div `
+  width: 100%;
   font-family: ${(props) => props.theme.font.family.sans};
   font-size: ${(props) => props.theme.font.size.small};
   color: ${(props) => props.theme.colors.text.secondary};

package/dist/es/components/TextField.js

@@ -119,6 +119,7 @@ export const TextFieldGroup = styled.div `
 `;
 export const TextFieldLabel = styled.label `
   display: block;
+  width: 100%;
   font-family: ${(props) => props.theme.font.family.sans};
   color: ${(props) => props.theme.colors.text.primary};
   font-size: ${(props) => props.theme.font.size.normal};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@manuscripts/style-guide",
   "description": "Shared components for Manuscripts applications",
-  "version": "3.5.9",
+  "version": "3.5.10",
   "repository": "github:Atypon-OpenSource/manuscripts-style-guide",
   "license": "Apache-2.0",
   "main": "dist/cjs",