@strapi/plugin-users-permissions 0.0.0-next.f0bfcece1007e5aa527570187635aefc86db536e → 0.0.0-next.f0f36e3df4b18f167036dcbca529dcb933bf4e1d

package/admin/src/components/Permissions/PermissionRow/SubCategory.jsx

@@ -78,7 +78,14 @@ const SubCategory = ({ subCategory }) => {
             const name = `${action.name}.enabled`;
 
             return (
-              <Grid.Item col={6} key={action.name} direction="column" alignItems="stretch">
+              <Grid.Item
+                col={4}
+                xs={12}
+                s={6}
+                key={action.name}
+                direction="column"
+                alignItems="stretch"
+              >
                 <CheckboxWrapper isActive={isActionSelected(action.name)} padding={2} hasRadius>
                   <Checkbox
                     checked={get(modifiedData, name, false)}

package/admin/src/components/Policies/index.jsx

@@ -24,6 +24,7 @@ const Policies = () => {
   return (
     <Grid.Item
       col={5}
+      xs={12}
       background="neutral150"
       paddingTop={6}
       paddingBottom={6}

package/admin/src/components/UsersPermissions/index.jsx

@@ -64,6 +64,7 @@ const UsersPermissions = forwardRef(({ permissions, routes }, ref) => {
       <Grid.Root gap={0} shadow="filterShadow" hasRadius background="neutral0">
         <Grid.Item
           col={7}
+          xs={12}
           paddingTop={6}
           paddingBottom={6}
           paddingLeft={7}

package/admin/src/pages/EmailTemplates/components/EmailForm.jsx

@@ -104,7 +104,8 @@ const EmailForm = ({ template = {}, onToggle, open, onSubmit }) => {
                     ].map(({ size, ...field }) => (
                       <Grid.Item
                         key={field.name}
-                        col={size}
+                        m={size}
+                        xs={12}
                         direction="column"
                         alignItems="stretch"
                       >

package/admin/src/pages/Providers/index.jsx

@@ -144,7 +144,7 @@ export const ProvidersPage = () => {
   }
 
   return (
-    <Layouts.Root>
+    <Page.Main>
       <Page.Title>
         {formatMessage(
           { id: 'Settings.PageTitle', defaultMessage: 'Settings - {name}' },
@@ -156,83 +156,81 @@ export const ProvidersPage = () => {
           }
         )}
       </Page.Title>
-      <Page.Main>
-        <Layouts.Header
-          title={formatMessage({
-            id: getTrad('HeaderNav.link.providers'),
-            defaultMessage: 'Providers',
-          })}
-        />
-        <Layouts.Content>
-          <Table colCount={3} rowCount={providers.length + 1}>
-            <Thead>
-              <Tr>
-                <Th>
-                  <Typography variant="sigma" textColor="neutral600">
-                    {formatMessage({ id: 'global.name', defaultMessage: 'Name' })}
-                  </Typography>
-                </Th>
-                <Th>
-                  <Typography variant="sigma" textColor="neutral600">
-                    {formatMessage({ id: getTrad('Providers.status'), defaultMessage: 'Status' })}
+      <Layouts.Header
+        title={formatMessage({
+          id: getTrad('HeaderNav.link.providers'),
+          defaultMessage: 'Providers',
+        })}
+      />
+      <Layouts.Content>
+        <Table colCount={3} rowCount={providers.length + 1}>
+          <Thead>
+            <Tr>
+              <Th>
+                <Typography variant="sigma" textColor="neutral600">
+                  {formatMessage({ id: 'global.name', defaultMessage: 'Name' })}
+                </Typography>
+              </Th>
+              <Th>
+                <Typography variant="sigma" textColor="neutral600">
+                  {formatMessage({ id: getTrad('Providers.status'), defaultMessage: 'Status' })}
+                </Typography>
+              </Th>
+              <Th>
+                <Typography variant="sigma">
+                  <VisuallyHidden>
+                    {formatMessage({
+                      id: 'global.settings',
+                      defaultMessage: 'Settings',
+                    })}
+                  </VisuallyHidden>
+                </Typography>
+              </Th>
+            </Tr>
+          </Thead>
+          <Tbody>
+            {providers.map((provider) => (
+              <Tr
+                key={provider.name}
+                onClick={() => (canUpdate ? handleClickEdit(provider) : undefined)}
+              >
+                <Td width="45%">
+                  <Typography fontWeight="semiBold" textColor="neutral800">
+                    {provider.name}
                   </Typography>
-                </Th>
-                <Th>
-                  <Typography variant="sigma">
-                    <VisuallyHidden>
-                      {formatMessage({
-                        id: 'global.settings',
-                        defaultMessage: 'Settings',
-                      })}
-                    </VisuallyHidden>
+                </Td>
+                <Td width="65%">
+                  <Typography
+                    textColor={provider.enabled ? 'success600' : 'danger600'}
+                    data-testid={`enable-${provider.name}`}
+                  >
+                    {provider.enabled
+                      ? formatMessage({
+                          id: 'global.enabled',
+                          defaultMessage: 'Enabled',
+                        })
+                      : formatMessage({
+                          id: 'global.disabled',
+                          defaultMessage: 'Disabled',
+                        })}
                   </Typography>
-                </Th>
-              </Tr>
-            </Thead>
-            <Tbody>
-              {providers.map((provider) => (
-                <Tr
-                  key={provider.name}
-                  onClick={() => (canUpdate ? handleClickEdit(provider) : undefined)}
-                >
-                  <Td width="45%">
-                    <Typography fontWeight="semiBold" textColor="neutral800">
-                      {provider.name}
-                    </Typography>
-                  </Td>
-                  <Td width="65%">
-                    <Typography
-                      textColor={provider.enabled ? 'success600' : 'danger600'}
-                      data-testid={`enable-${provider.name}`}
+                </Td>
+                <Td onClick={(e) => e.stopPropagation()}>
+                  {canUpdate && (
+                    <IconButton
+                      onClick={() => handleClickEdit(provider)}
+                      variant="ghost"
+                      label="Edit"
                     >
-                      {provider.enabled
-                        ? formatMessage({
-                            id: 'global.enabled',
-                            defaultMessage: 'Enabled',
-                          })
-                        : formatMessage({
-                            id: 'global.disabled',
-                            defaultMessage: 'Disabled',
-                          })}
-                    </Typography>
-                  </Td>
-                  <Td onClick={(e) => e.stopPropagation()}>
-                    {canUpdate && (
-                      <IconButton
-                        onClick={() => handleClickEdit(provider)}
-                        variant="ghost"
-                        label="Edit"
-                      >
-                        <Pencil />
-                      </IconButton>
-                    )}
-                  </Td>
-                </Tr>
-              ))}
-            </Tbody>
-          </Table>
-        </Layouts.Content>
-      </Page.Main>
+                      <Pencil />
+                    </IconButton>
+                  )}
+                </Td>
+              </Tr>
+            ))}
+          </Tbody>
+        </Table>
+      </Layouts.Content>
       <FormModal
         initialData={data[providerToEditName]}
         isOpen={isOpen}
@@ -249,7 +247,7 @@ export const ProvidersPage = () => {
         onSubmit={handleSubmit}
         providerToEditName={providerToEditName}
       />
-    </Layouts.Root>
+    </Page.Main>
   );
 };
 

package/admin/src/pages/Roles/pages/CreatePage.jsx

@@ -4,14 +4,21 @@ import {
   Button,
   Flex,
   Grid,
-  Main,
   Textarea,
   TextInput,
   Typography,
   Field,
+  Box,
 } from '@strapi/design-system';
 import { Check } from '@strapi/icons';
-import { Page, useTracking, useNotification, useFetchClient, Layouts } from '@strapi/strapi/admin';
+import {
+  Page,
+  useTracking,
+  useNotification,
+  useFetchClient,
+  Layouts,
+  BackButton,
+} from '@strapi/strapi/admin';
 import { Formik, Form } from 'formik';
 import { useIntl } from 'react-intl';
 import { useMutation } from 'react-query';
@@ -68,7 +75,7 @@ export const CreatePage = () => {
   };
 
   return (
-    <Main>
+    <Page.Main>
       <Page.Title>
         {formatMessage(
           { id: 'Settings.PageTitle', defaultMessage: 'Settings - {name}' },
@@ -102,6 +109,12 @@ export const CreatePage = () => {
                 id: 'Settings.roles.create.description',
                 defaultMessage: 'Define the rights given to the role',
               })}
+              navigationAction={
+                // The back link for mobile works differently; it is placed higher up in the DOM.
+                <Box display={{ initial: 'none', medium: 'block' }}>
+                  <BackButton fallback=".." />
+                </Box>
+              }
             />
             <Layouts.Content>
               <Flex
@@ -125,7 +138,7 @@ export const CreatePage = () => {
                   </Typography>
 
                   <Grid.Root gap={4}>
-                    <Grid.Item col={6} direction="column" alignItems="stretch">
+                    <Grid.Item col={6} xs={12} direction="column" alignItems="stretch">
                       <Field.Root
                         name="name"
                         error={
@@ -141,11 +154,11 @@ export const CreatePage = () => {
                             defaultMessage: 'Name',
                           })}
                         </Field.Label>
-                        <TextInput value={values.name || ''} onChange={handleChange} />
+                        <TextInput type="text" value={values.name || ''} onChange={handleChange} />
                         <Field.Error />
                       </Field.Root>
                     </Grid.Item>
-                    <Grid.Item col={6} direction="column" alignItems="stretch">
+                    <Grid.Item col={6} xs={12} direction="column" alignItems="stretch">
                       <Field.Root
                         name="description"
                         error={
@@ -183,7 +196,7 @@ export const CreatePage = () => {
           </Form>
         )}
       </Formik>
-    </Main>
+    </Page.Main>
   );
 };
 

package/admin/src/pages/Roles/pages/EditPage.jsx

@@ -1,7 +1,6 @@
 import * as React from 'react';
 
 import {
-  Main,
   Button,
   Flex,
   TextInput,
@@ -9,6 +8,7 @@ import {
   Typography,
   Grid,
   Field,
+  Box,
 } from '@strapi/design-system';
 import { Check } from '@strapi/icons';
 import {
@@ -86,7 +86,7 @@ export const EditPage = () => {
   }
 
   return (
-    <Main>
+    <Page.Main>
       <Page.Title>
         {formatMessage(
           { id: 'Settings.PageTitle', defaultMessage: 'Settings - {name}' },
@@ -119,7 +119,12 @@ export const EditPage = () => {
               }
               title={role.name}
               subtitle={role.description}
-              navigationAction={<BackButton fallback=".." />}
+              navigationAction={
+                // The back link for mobile works differently; it is placed higher up in the DOM.
+                <Box display={{ initial: 'none', medium: 'block' }}>
+                  <BackButton fallback=".." />
+                </Box>
+              }
             />
             <Layouts.Content>
               <Flex
@@ -143,7 +148,7 @@ export const EditPage = () => {
                   </Typography>
 
                   <Grid.Root gap={4}>
-                    <Grid.Item col={6} direction="column" alignItems="stretch">
+                    <Grid.Item col={6} xs={12} direction="column" alignItems="stretch">
                       <Field.Root
                         name="name"
                         error={
@@ -162,11 +167,11 @@ export const EditPage = () => {
                             defaultMessage: 'Name',
                           })}
                         </Field.Label>
-                        <TextInput value={values.name || ''} onChange={handleChange} />
+                        <TextInput type="text" value={values.name || ''} onChange={handleChange} />
                         <Field.Error />
                       </Field.Root>
                     </Grid.Item>
-                    <Grid.Item col={6} direction="column" alignItems="stretch">
+                    <Grid.Item col={6} xs={12} direction="column" alignItems="stretch">
                       <Field.Root
                         name="description"
                         error={
@@ -204,7 +209,7 @@ export const EditPage = () => {
           </Form>
         )}
       </Formik>
-    </Main>
+    </Page.Main>
   );
 };
 

package/admin/src/pages/Roles/pages/ListPage/index.jsx

@@ -153,107 +153,105 @@ export const RolesListPage = () => {
   }
 
   return (
-    <Layouts.Root>
+    <Page.Main>
       <Page.Title>
         {formatMessage(
           { id: 'Settings.PageTitle', defaultMessage: 'Settings - {name}' },
           { name: pageTitle }
         )}
       </Page.Title>
-      <Page.Main>
-        <Layouts.Header
-          title={formatMessage({
-            id: 'global.roles',
-            defaultMessage: 'Roles',
-          })}
-          subtitle={formatMessage({
-            id: 'Settings.roles.list.description',
-            defaultMessage: 'List of roles',
-          })}
-          primaryAction={
-            canCreate ? (
-              <LinkButton
-                to="new"
-                tag={NavLink}
-                onClick={() => trackUsage('willCreateRole')}
-                startIcon={<Plus />}
-                size="S"
-              >
-                {formatMessage({
-                  id: getTrad('List.button.roles'),
-                  defaultMessage: 'Add new role',
-                })}
-              </LinkButton>
-            ) : null
-          }
-        />
-
-        <Layouts.Action
-          startActions={
-            <SearchInput
-              label={formatMessage({
-                id: 'app.component.search.label',
-                defaultMessage: 'Search',
+      <Layouts.Header
+        title={formatMessage({
+          id: 'global.roles',
+          defaultMessage: 'Roles',
+        })}
+        subtitle={formatMessage({
+          id: 'Settings.roles.list.description',
+          defaultMessage: 'List of roles',
+        })}
+        primaryAction={
+          canCreate ? (
+            <LinkButton
+              to="new"
+              tag={NavLink}
+              onClick={() => trackUsage('willCreateRole')}
+              startIcon={<Plus />}
+              size="S"
+            >
+              {formatMessage({
+                id: getTrad('List.button.roles'),
+                defaultMessage: 'Add new role',
               })}
-            />
-          }
-        />
+            </LinkButton>
+          ) : null
+        }
+      />
+
+      <Layouts.Action
+        startActions={
+          <SearchInput
+            label={formatMessage({
+              id: 'app.component.search.label',
+              defaultMessage: 'Search',
+            })}
+          />
+        }
+      />
 
-        <Layouts.Content>
-          {!canRead && <Page.NoPermissions />}
-          {canRead && sortedRoles && sortedRoles?.length ? (
-            <Table colCount={colCount} rowCount={rowCount}>
-              <Thead>
-                <Tr>
-                  <Th>
-                    <Typography variant="sigma" textColor="neutral600">
-                      {formatMessage({ id: 'global.name', defaultMessage: 'Name' })}
-                    </Typography>
-                  </Th>
-                  <Th>
-                    <Typography variant="sigma" textColor="neutral600">
-                      {formatMessage({
-                        id: 'global.description',
-                        defaultMessage: 'Description',
-                      })}
-                    </Typography>
-                  </Th>
-                  <Th>
-                    <Typography variant="sigma" textColor="neutral600">
-                      {formatMessage({
-                        id: 'global.users',
-                        defaultMessage: 'Users',
-                      })}
-                    </Typography>
-                  </Th>
-                  <Th>
-                    <VisuallyHidden>
-                      {formatMessage({
-                        id: 'global.actions',
-                        defaultMessage: 'Actions',
-                      })}
-                    </VisuallyHidden>
-                  </Th>
-                </Tr>
-              </Thead>
-              <TableBody
-                sortedRoles={sortedRoles}
-                canDelete={canDelete}
-                canUpdate={canUpdate}
-                permissions={PERMISSIONS}
-                setRoleToDelete={setRoleToDelete}
-                onDelete={[showConfirmDelete, setShowConfirmDelete]}
-              />
-            </Table>
-          ) : (
-            <EmptyStateLayout content={formatMessage(emptyLayout[emptyContent])} />
-          )}
-        </Layouts.Content>
-        <Dialog.Root open={showConfirmDelete} onOpenChange={handleShowConfirmDelete}>
-          <ConfirmDialog onConfirm={handleConfirmDelete} />
-        </Dialog.Root>
-      </Page.Main>
-    </Layouts.Root>
+      <Layouts.Content>
+        {!canRead && <Page.NoPermissions />}
+        {canRead && sortedRoles && sortedRoles?.length ? (
+          <Table colCount={colCount} rowCount={rowCount}>
+            <Thead>
+              <Tr>
+                <Th>
+                  <Typography variant="sigma" textColor="neutral600">
+                    {formatMessage({ id: 'global.name', defaultMessage: 'Name' })}
+                  </Typography>
+                </Th>
+                <Th>
+                  <Typography variant="sigma" textColor="neutral600">
+                    {formatMessage({
+                      id: 'global.description',
+                      defaultMessage: 'Description',
+                    })}
+                  </Typography>
+                </Th>
+                <Th>
+                  <Typography variant="sigma" textColor="neutral600">
+                    {formatMessage({
+                      id: 'global.users',
+                      defaultMessage: 'Users',
+                    })}
+                  </Typography>
+                </Th>
+                <Th>
+                  <VisuallyHidden>
+                    {formatMessage({
+                      id: 'global.actions',
+                      defaultMessage: 'Actions',
+                    })}
+                  </VisuallyHidden>
+                </Th>
+              </Tr>
+            </Thead>
+            <TableBody
+              sortedRoles={sortedRoles}
+              canDelete={canDelete}
+              canUpdate={canUpdate}
+              permissions={PERMISSIONS}
+              setRoleToDelete={setRoleToDelete}
+              onDelete={[showConfirmDelete, setShowConfirmDelete]}
+            />
+          </Table>
+        ) : (
+          <EmptyStateLayout content={formatMessage(emptyLayout[emptyContent])} />
+        )}
+      </Layouts.Content>
+      <Dialog.Root open={showConfirmDelete} onOpenChange={handleShowConfirmDelete}>
+        <ConfirmDialog onConfirm={handleConfirmDelete} />
+      </Dialog.Root>
+    </Page.Main>
   );
 };
 

package/admin/src/translations/en.json

@@ -17,6 +17,7 @@
   "EditPage.form.roles": "Role details",
   "Email.template.data.loaded": "Email templates has been loaded",
   "Email.template.email_confirmation": "Email address confirmation",
+  "Email.template.reset_password": "Reset password",
   "Email.template.form.edit.label": "Edit a template",
   "Email.template.table.action.label": "action",
   "Email.template.table.icon.label": "icon",

package/dist/admin/components/FormModal/Input/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../admin/src/components/FormModal/Input/index.jsx"],"sourcesContent":["/**\n *\n * Input\n *\n */\n\nimport * as React from 'react';\n\nimport { TextInput, Toggle, Field } from '@strapi/design-system';\nimport PropTypes from 'prop-types';\nimport { useIntl } from 'react-intl';\n\nconst Input = ({\n  description,\n  disabled,\n  intlLabel,\n  error,\n  name,\n  onChange,\n  placeholder,\n  providerToEditName,\n  type,\n  value,\n}) => {\n  const { formatMessage } = useIntl();\n  const inputValue =\n    name === 'noName'\n      ? `${window.strapi.backendURL}/api/connect/${providerToEditName}/callback`\n      : value;\n\n  const label = formatMessage(\n    { id: intlLabel.id, defaultMessage: intlLabel.defaultMessage },\n    { provider: providerToEditName, ...intlLabel.values }\n  );\n  const hint = description\n    ? formatMessage(\n        { id: description.id, defaultMessage: description.defaultMessage },\n        { provider: providerToEditName, ...description.values }\n      )\n    : '';\n\n  if (type === 'bool') {\n    return (\n      <Field.Root hint={hint} name={name}>\n        <Field.Label>{label}</Field.Label>\n        <Toggle\n          aria-label={name}\n          checked={value}\n          disabled={disabled}\n          offLabel={formatMessage({\n            id: 'app.components.ToggleCheckbox.off-label',\n            defaultMessage: 'Off',\n          })}\n          onLabel={formatMessage({\n            id: 'app.components.ToggleCheckbox.on-label',\n            defaultMessage: 'On',\n          })}\n          onChange={(e) => {\n            onChange({ target: { name, value: e.target.checked } });\n          }}\n        />\n        <Field.Hint />\n      </Field.Root>\n    );\n  }\n\n  const formattedPlaceholder = placeholder\n    ? formatMessage(\n        { id: placeholder.id, defaultMessage: placeholder.defaultMessage },\n        { ...placeholder.values }\n      )\n    : '';\n\n  const errorMessage = error ? formatMessage({ id: error, defaultMessage: error }) : '';\n\n  return (\n    <Field.Root error={errorMessage} name={name}>\n      <Field.Label>{label}</Field.Label>\n      <TextInput\n        disabled={disabled}\n        onChange={onChange}\n        placeholder={formattedPlaceholder}\n        type={type}\n        value={inputValue}\n      />\n      <Field.Error />\n    </Field.Root>\n  );\n};\n\nInput.defaultProps = {\n  description: null,\n  disabled: false,\n  error: '',\n  placeholder: null,\n  value: '',\n};\n\nInput.propTypes = {\n  description: PropTypes.shape({\n    id: PropTypes.string.isRequired,\n    defaultMessage: PropTypes.string.isRequired,\n    values: PropTypes.object,\n  }),\n  disabled: PropTypes.bool,\n  error: PropTypes.string,\n  intlLabel: PropTypes.shape({\n    id: PropTypes.string.isRequired,\n    defaultMessage: PropTypes.string.isRequired,\n    values: PropTypes.object,\n  }).isRequired,\n  name: PropTypes.string.isRequired,\n  onChange: PropTypes.func.isRequired,\n  placeholder: PropTypes.shape({\n    id: PropTypes.string.isRequired,\n    defaultMessage: PropTypes.string.isRequired,\n    values: PropTypes.object,\n  }),\n  providerToEditName: PropTypes.string.isRequired,\n  type: PropTypes.string.isRequired,\n  value: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]),\n};\n\nexport default Input;\n"],"names":["Input","description","disabled","intlLabel","error","name","onChange","placeholder","providerToEditName","type","value","formatMessage","useIntl","inputValue","window","strapi","backendURL","label","id","defaultMessage","provider","values","hint","_jsxs","Field","Root","_jsx","Label","Toggle","aria-label","checked","offLabel","onLabel","e","target","Hint","formattedPlaceholder","errorMessage","TextInput","Error","defaultProps","propTypes","PropTypes","shape","string","isRequired","object","bool","func","oneOfType"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../../../admin/src/components/FormModal/Input/index.jsx"],"sourcesContent":["/**\n *\n * Input\n *\n */\n\nimport * as React from 'react';\n\nimport { TextInput, Toggle, Field } from '@strapi/design-system';\nimport PropTypes from 'prop-types';\nimport { useIntl } from 'react-intl';\n\nconst Input = ({\n  description,\n  disabled,\n  intlLabel,\n  error,\n  name,\n  onChange,\n  placeholder,\n  providerToEditName,\n  type,\n  value,\n}) => {\n  const { formatMessage } = useIntl();\n  const inputValue =\n    name === 'noName'\n      ? `${window.strapi.backendURL}/api/connect/${providerToEditName}/callback`\n      : value;\n\n  const label = formatMessage(\n    { id: intlLabel.id, defaultMessage: intlLabel.defaultMessage },\n    { provider: providerToEditName, ...intlLabel.values }\n  );\n  const hint = description\n    ? formatMessage(\n        { id: description.id, defaultMessage: description.defaultMessage },\n        { provider: providerToEditName, ...description.values }\n      )\n    : '';\n\n  if (type === 'bool') {\n    return (\n      <Field.Root hint={hint} name={name}>\n        <Field.Label>{label}</Field.Label>\n        <Toggle\n          aria-label={name}\n          checked={value}\n          disabled={disabled}\n          offLabel={formatMessage({\n            id: 'app.components.ToggleCheckbox.off-label',\n            defaultMessage: 'Off',\n          })}\n          onLabel={formatMessage({\n            id: 'app.components.ToggleCheckbox.on-label',\n            defaultMessage: 'On',\n          })}\n          onChange={(e) => {\n            onChange({ target: { name, value: e.target.checked } });\n          }}\n        />\n        <Field.Hint />\n      </Field.Root>\n    );\n  }\n\n  const formattedPlaceholder = placeholder\n    ? formatMessage(\n        { id: placeholder.id, defaultMessage: placeholder.defaultMessage },\n        { ...placeholder.values }\n      )\n    : '';\n\n  const errorMessage = error ? formatMessage({ id: error, defaultMessage: error }) : '';\n\n  return (\n    <Field.Root error={errorMessage} name={name}>\n      <Field.Label>{label}</Field.Label>\n      <TextInput\n        disabled={disabled}\n        onChange={onChange}\n        placeholder={formattedPlaceholder}\n        type={type}\n        value={inputValue}\n      />\n      <Field.Error />\n    </Field.Root>\n  );\n};\n\nInput.defaultProps = {\n  description: null,\n  disabled: false,\n  error: '',\n  placeholder: null,\n  value: '',\n};\n\nInput.propTypes = {\n  description: PropTypes.shape({\n    id: PropTypes.string.isRequired,\n    defaultMessage: PropTypes.string.isRequired,\n    values: PropTypes.object,\n  }),\n  disabled: PropTypes.bool,\n  error: PropTypes.string,\n  intlLabel: PropTypes.shape({\n    id: PropTypes.string.isRequired,\n    defaultMessage: PropTypes.string.isRequired,\n    values: PropTypes.object,\n  }).isRequired,\n  name: PropTypes.string.isRequired,\n  onChange: PropTypes.func.isRequired,\n  placeholder: PropTypes.shape({\n    id: PropTypes.string.isRequired,\n    defaultMessage: PropTypes.string.isRequired,\n    values: PropTypes.object,\n  }),\n  providerToEditName: PropTypes.string.isRequired,\n  type: PropTypes.string.isRequired,\n  value: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]),\n};\n\nexport default Input;\n"],"names":["Input","description","disabled","intlLabel","error","name","onChange","placeholder","providerToEditName","type","value","formatMessage","useIntl","inputValue","window","strapi","backendURL","label","id","defaultMessage","provider","values","hint","_jsxs","Field","Root","_jsx","Label","Toggle","aria-label","checked","offLabel","onLabel","e","target","Hint","formattedPlaceholder","errorMessage","TextInput","Error","defaultProps","propTypes","PropTypes","shape","string","isRequired","object","bool","func","oneOfType"],"mappings":"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"}