@strapi/admin 5.14.0 → 5.15.0

package/dist/admin/admin/src/components/MainNav/TrialCountdown.mjs

@@ -0,0 +1,112 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { useLicenseLimits } from '@strapi/admin/strapi-admin/ee';
+import { Flex, Tooltip } from '@strapi/design-system';
+import { isBefore, startOfToday, format } from 'date-fns';
+import { useIntl } from 'react-intl';
+import { useTheme } from 'styled-components';
+import { useGetLicenseTrialTimeLeftQuery } from '../../services/admin.mjs';
+
+const CircleProgressBar = ({ percentage })=>{
+    const theme = useTheme();
+    const radius = 45;
+    const circumference = 2 * Math.PI * radius;
+    const offset = circumference * (1 - percentage / 100);
+    return /*#__PURE__*/ jsxs("svg", {
+        width: "32",
+        height: "32",
+        viewBox: "0 0 100 100",
+        children: [
+            /*#__PURE__*/ jsx("defs", {
+                children: /*#__PURE__*/ jsxs("linearGradient", {
+                    id: "progressGradient",
+                    x1: "0%",
+                    y1: "0%",
+                    x2: "100%",
+                    y2: "0%",
+                    children: [
+                        /*#__PURE__*/ jsx("stop", {
+                            offset: "0%",
+                            stopColor: theme.colors.primary600
+                        }),
+                        /*#__PURE__*/ jsx("stop", {
+                            offset: "100%",
+                            stopColor: theme.colors.alternative600
+                        })
+                    ]
+                })
+            }),
+            /*#__PURE__*/ jsx("circle", {
+                cx: "50",
+                cy: "50",
+                r: radius,
+                stroke: "#ccc",
+                strokeWidth: "10",
+                fill: "none"
+            }),
+            /*#__PURE__*/ jsx("circle", {
+                cx: "50",
+                cy: "50",
+                r: radius,
+                stroke: "url(#progressGradient)",
+                strokeWidth: "10",
+                fill: "none",
+                strokeDasharray: circumference,
+                strokeDashoffset: offset,
+                transform: "rotate(-90 50 50)",
+                strokeLinecap: "round"
+            }),
+            /*#__PURE__*/ jsx("svg", {
+                x: "35",
+                y: "25",
+                width: "50",
+                height: "50",
+                viewBox: "0 0 32 32",
+                children: /*#__PURE__*/ jsx("path", {
+                    fill: "url(#progressGradient)",
+                    d: "m21.731 14.683-14 15a1 1 0 0 1-1.711-.875l1.832-9.167L.65 16.936a1 1 0 0 1-.375-1.625l14-15a1 1 0 0 1 1.71.875l-1.837 9.177 7.204 2.7a1 1 0 0 1 .375 1.62z"
+                })
+            })
+        ]
+    });
+};
+const TrialCountdown = ()=>{
+    const { formatMessage } = useIntl();
+    const { license, isError, isLoading } = useLicenseLimits();
+    const timeLeftData = useGetLicenseTrialTimeLeftQuery(undefined, {
+        skip: !license?.isTrial
+    });
+    if (isError || isLoading || !license?.isTrial || timeLeftData.isLoading || timeLeftData.isError || !timeLeftData.data || !timeLeftData.data.trialEndsAt) {
+        return null;
+    }
+    const targetDate = new Date(timeLeftData.data.trialEndsAt);
+    const now = new Date();
+    const isTargetDateInPast = isBefore(targetDate, startOfToday());
+    const millisecondsPerDay = 1000 * 60 * 60 * 24;
+    const timeDifference = targetDate.getTime() - now.getTime();
+    const daysLeft = Math.ceil(timeDifference / millisecondsPerDay) <= 0 ? 0 : Math.ceil(timeDifference / millisecondsPerDay);
+    return /*#__PURE__*/ jsx(Flex, {
+        justifyContent: "center",
+        padding: 3,
+        children: /*#__PURE__*/ jsx(Tooltip, {
+            label: formatMessage(isTargetDateInPast ? {
+                id: 'app.components.LeftMenu.trialCountdown.endedAt',
+                defaultMessage: 'Your trial ended on {date}'
+            } : {
+                id: 'app.components.LeftMenu.trialCountdown.endsAt',
+                defaultMessage: 'Your trial ends on {date}'
+            }, {
+                date: format(new Date(timeLeftData.data.trialEndsAt), 'PPP')
+            }),
+            side: "right",
+            children: /*#__PURE__*/ jsx("div", {
+                "data-testid": "trial-countdown",
+                children: /*#__PURE__*/ jsx(CircleProgressBar, {
+                    percentage: (30 - daysLeft) * 100 / 30
+                })
+            })
+        })
+    });
+};
+
+export { TrialCountdown };
+//# sourceMappingURL=TrialCountdown.mjs.map

package/dist/admin/admin/src/components/MainNav/TrialCountdown.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TrialCountdown.mjs","sources":["../../../../../../admin/src/components/MainNav/TrialCountdown.tsx"],"sourcesContent":["import { useLicenseLimits } from '@strapi/admin/strapi-admin/ee';\nimport { Flex, Tooltip } from '@strapi/design-system';\nimport { format, isBefore, startOfToday } from 'date-fns';\nimport { useIntl } from 'react-intl';\nimport { useTheme } from 'styled-components';\n\nimport { useGetLicenseTrialTimeLeftQuery } from '../../../src/services/admin';\n\ntype CircleProgressBarProps = {\n  percentage: number;\n};\n\nconst CircleProgressBar = ({ percentage }: CircleProgressBarProps) => {\n  const theme = useTheme();\n\n  const radius = 45;\n  const circumference = 2 * Math.PI * radius;\n  const offset = circumference * (1 - percentage / 100);\n\n  return (\n    <svg width=\"32\" height=\"32\" viewBox=\"0 0 100 100\">\n      <defs>\n        <linearGradient id=\"progressGradient\" x1=\"0%\" y1=\"0%\" x2=\"100%\" y2=\"0%\">\n          <stop offset=\"0%\" stopColor={theme.colors.primary600} />\n          <stop offset=\"100%\" stopColor={theme.colors.alternative600} />\n        </linearGradient>\n      </defs>\n      <circle cx=\"50\" cy=\"50\" r={radius} stroke=\"#ccc\" strokeWidth=\"10\" fill=\"none\" />\n      <circle\n        cx=\"50\"\n        cy=\"50\"\n        r={radius}\n        stroke=\"url(#progressGradient)\"\n        strokeWidth=\"10\"\n        fill=\"none\"\n        strokeDasharray={circumference}\n        strokeDashoffset={offset}\n        transform=\"rotate(-90 50 50)\"\n        strokeLinecap=\"round\"\n      />\n      <svg x=\"35\" y=\"25\" width=\"50\" height=\"50\" viewBox=\"0 0 32 32\">\n        <path\n          fill=\"url(#progressGradient)\"\n          d=\"m21.731 14.683-14 15a1 1 0 0 1-1.711-.875l1.832-9.167L.65 16.936a1 1 0 0 1-.375-1.625l14-15a1 1 0 0 1 1.71.875l-1.837 9.177 7.204 2.7a1 1 0 0 1 .375 1.62z\"\n        />\n      </svg>\n    </svg>\n  );\n};\n\nconst TrialCountdown = () => {\n  const { formatMessage } = useIntl();\n  const { license, isError, isLoading } = useLicenseLimits();\n\n  const timeLeftData = useGetLicenseTrialTimeLeftQuery(undefined, {\n    skip: !license?.isTrial,\n  });\n\n  if (\n    isError ||\n    isLoading ||\n    !license?.isTrial ||\n    timeLeftData.isLoading ||\n    timeLeftData.isError ||\n    !timeLeftData.data ||\n    !timeLeftData.data.trialEndsAt\n  ) {\n    return null;\n  }\n\n  const targetDate = new Date(timeLeftData.data.trialEndsAt);\n  const now = new Date();\n  const isTargetDateInPast = isBefore(targetDate, startOfToday());\n\n  const millisecondsPerDay = 1000 * 60 * 60 * 24;\n  const timeDifference = targetDate.getTime() - now.getTime();\n\n  const daysLeft =\n    Math.ceil(timeDifference / millisecondsPerDay) <= 0\n      ? 0\n      : Math.ceil(timeDifference / millisecondsPerDay);\n\n  return (\n    <Flex justifyContent=\"center\" padding={3}>\n      <Tooltip\n        label={formatMessage(\n          isTargetDateInPast\n            ? {\n                id: 'app.components.LeftMenu.trialCountdown.endedAt',\n                defaultMessage: 'Your trial ended on {date}',\n              }\n            : {\n                id: 'app.components.LeftMenu.trialCountdown.endsAt',\n                defaultMessage: 'Your trial ends on {date}',\n              },\n          {\n            date: format(new Date(timeLeftData.data.trialEndsAt), 'PPP'),\n          }\n        )}\n        side=\"right\"\n      >\n        <div data-testid=\"trial-countdown\">\n          <CircleProgressBar percentage={((30 - daysLeft) * 100) / 30} />\n        </div>\n      </Tooltip>\n    </Flex>\n  );\n};\n\nexport { TrialCountdown };\n"],"names":["CircleProgressBar","percentage","theme","useTheme","radius","circumference","Math","PI","offset","_jsxs","svg","width","height","viewBox","_jsx","defs","linearGradient","id","x1","y1","x2","y2","stop","stopColor","colors","primary600","alternative600","circle","cx","cy","r","stroke","strokeWidth","fill","strokeDasharray","strokeDashoffset","transform","strokeLinecap","x","y","path","d","TrialCountdown","formatMessage","useIntl","license","isError","isLoading","useLicenseLimits","timeLeftData","useGetLicenseTrialTimeLeftQuery","undefined","skip","isTrial","data","trialEndsAt","targetDate","Date","now","isTargetDateInPast","isBefore","startOfToday","millisecondsPerDay","timeDifference","getTime","daysLeft","ceil","Flex","justifyContent","padding","Tooltip","label","defaultMessage","date","format","side","div","data-testid"],"mappings":"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"}

package/dist/admin/admin/src/components/NpsSurvey.js

@@ -6,7 +6,7 @@ var designSystem = require('@strapi/design-system');
 var icons = require('@strapi/icons');
 var formik = require('formik');
 var reactIntl = require('react-intl');
-var styledComponents = require('styled-components');
+var styled = require('styled-components');
 var yup = require('yup');
 var AppInfo = require('../features/AppInfo.js');
 var Auth = require('../features/Auth.js');
@@ -33,7 +33,7 @@ function _interopNamespaceDefault(e) {
 var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
 var yup__namespace = /*#__PURE__*/_interopNamespaceDefault(yup);
 
-const FieldWrapper = styledComponents.styled(designSystem.Field.Root)`
+const FieldWrapper = styled.styled(designSystem.Field.Root)`
   height: 3.2rem;
   width: 3.2rem;
 

package/dist/admin/admin/src/components/NpsSurvey.js.map

@@ -1 +1 @@
-{"version":3,"file":"NpsSurvey.js","sources":["../../../../../admin/src/components/NpsSurvey.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport {\n  Box,\n  Flex,\n  IconButton,\n  Button,\n  Typography,\n  Textarea,\n  Portal,\n  Field,\n  VisuallyHidden,\n} from '@strapi/design-system';\nimport { Cross } from '@strapi/icons';\nimport { Formik, Form } from 'formik';\nimport { useIntl } from 'react-intl';\nimport { styled } from 'styled-components';\nimport * as yup from 'yup';\n\nimport { useAppInfo } from '../features/AppInfo';\nimport { useAuth } from '../features/Auth';\nimport { useNotification } from '../features/Notifications';\nimport { usePersistentState } from '../hooks/usePersistentState';\n\nconst FieldWrapper = styled(Field.Root)`\n  height: 3.2rem;\n  width: 3.2rem;\n\n  > label,\n  ~ input {\n    display: block;\n    position: absolute;\n    top: 0;\n    left: 0;\n    right: 0;\n    bottom: 0;\n  }\n\n  > label {\n    color: inherit;\n    cursor: pointer;\n    padding: ${({ theme }) => theme.spaces[2]};\n    text-align: center;\n    vertical-align: middle;\n  }\n\n  &:hover,\n  &:focus-within {\n    background-color: ${({ theme }) => theme.colors.neutral0};\n  }\n\n  &:active,\n  &.selected {\n    color: ${({ theme }) => theme.colors.primary700};\n    background-color: ${({ theme }) => theme.colors.neutral0};\n    border-color: ${({ theme }) => theme.colors.primary700};\n  }\n`;\n\nconst delays = {\n  postResponse: 90 * 24 * 60 * 60 * 1000, // 90 days in ms\n  postFirstDismissal: 14 * 24 * 60 * 60 * 1000, // 14 days in ms\n  postSubsequentDismissal: 90 * 24 * 60 * 60 * 1000, // 90 days in ms\n  display: 30 * 60 * 1000, // 30 minutes in ms\n};\n\nconst ratingArray = [...Array(11).keys()];\n\nconst checkIfShouldShowSurvey = (settings: NpsSurveySettings) => {\n  const { enabled, lastResponseDate, firstDismissalDate, lastDismissalDate } = settings;\n\n  // This function goes through all the cases where we'd want to not show the survey:\n  // 1. If the survey is disabled by strapi, abort mission, don't bother checking the other settings.\n  // 2. If the survey is disabled by user, abort mission, don't bother checking the other settings.\n  // 3. If the user has already responded to the survey, check if enough time has passed since the last response.\n  // 4. If the user has dismissed the survey twice or more before, check if enough time has passed since the last dismissal.\n  // 5. If the user has only dismissed the survey once before, check if enough time has passed since the first dismissal.\n  // If none of these cases check out, then we show the survey.\n  // Note that submitting a response resets the dismissal counts.\n  // Checks 4 and 5 should not be reversed, since the first dismissal will also exist if the user has dismissed the survey twice or more before.\n\n  // For users who had created an account before the NPS feature was introduced,\n  // we assume that they would have enabled the NPS feature if they had the chance.\n\n  // Global strapi disable for NSP.\n  if (window.strapi.flags.nps === false) {\n    return false;\n  }\n\n  // User chose not to enable the NPS feature when signing up\n  if (enabled === false) {\n    return false;\n  }\n\n  // The user has already responded to the survey\n  if (lastResponseDate) {\n    const timeSinceLastResponse = Date.now() - new Date(lastResponseDate).getTime();\n\n    if (timeSinceLastResponse >= delays.postResponse) {\n      return true;\n    }\n\n    return false;\n  }\n\n  // The user has dismissed the survey twice or more before\n  if (lastDismissalDate) {\n    const timeSinceLastDismissal = Date.now() - new Date(lastDismissalDate).getTime();\n\n    if (timeSinceLastDismissal >= delays.postSubsequentDismissal) {\n      return true;\n    }\n\n    return false;\n  }\n\n  // The user has only dismissed the survey once before\n  if (firstDismissalDate) {\n    const timeSinceFirstDismissal = Date.now() - new Date(firstDismissalDate).getTime();\n\n    if (timeSinceFirstDismissal >= delays.postFirstDismissal) {\n      return true;\n    }\n\n    return false;\n  }\n\n  // The user has not interacted with the survey before\n  return true;\n};\n\nconst NpsSurvey = () => {\n  const { formatMessage } = useIntl();\n  const { npsSurveySettings, setNpsSurveySettings } = useNpsSurveySettings();\n  const [isFeedbackResponse, setIsFeedbackResponse] = React.useState(false);\n  const { toggleNotification } = useNotification();\n  const currentEnvironment = useAppInfo('NpsSurvey', (state) => state.currentEnvironment);\n  const strapiVersion = useAppInfo('NpsSurvey', (state) => state.strapiVersion);\n\n  interface NpsSurveyMutationBody {\n    email: string;\n    rating: number | null;\n    comment: string;\n    environment?: string;\n    version?: string;\n    license: 'Enterprise' | 'Community';\n  }\n\n  // Only check on first render if the survey should be shown\n  const [surveyIsShown, setSurveyIsShown] = React.useState(\n    checkIfShouldShowSurvey(npsSurveySettings)\n  );\n\n  // Set a cooldown to show the survey when session begins\n  const [displaySurvey, setDisplaySurvey] = React.useState(false);\n\n  React.useEffect(() => {\n    const displayTime = setTimeout(() => {\n      setDisplaySurvey(true);\n    }, delays.display);\n\n    return () => {\n      clearTimeout(displayTime);\n    };\n  }, []);\n\n  const { user } = useAuth('NpsSurvey', (auth) => auth);\n\n  if (!displaySurvey) {\n    return null;\n  }\n\n  if (!surveyIsShown) {\n    return null;\n  }\n\n  const handleSubmitResponse = async ({\n    npsSurveyRating,\n    npsSurveyFeedback,\n  }: {\n    npsSurveyRating: NpsSurveyMutationBody['rating'];\n    npsSurveyFeedback: NpsSurveyMutationBody['comment'];\n  }) => {\n    try {\n      const body = {\n        email: typeof user === 'object' && user.email ? user.email : '',\n        rating: npsSurveyRating,\n        comment: npsSurveyFeedback,\n        environment: currentEnvironment,\n        version: strapiVersion ?? undefined,\n        license: window.strapi.projectType,\n        isHostedOnStrapiCloud: process.env.STRAPI_HOSTING === 'strapi.cloud',\n      };\n      const res = await fetch('https://analytics.strapi.io/submit-nps', {\n        method: 'POST',\n        headers: {\n          'Content-Type': 'application/json',\n        },\n        body: JSON.stringify(body),\n      });\n\n      if (!res.ok) {\n        throw new Error('Failed to submit NPS survey');\n      }\n\n      setNpsSurveySettings((settings) => ({\n        ...settings,\n        lastResponseDate: new Date().toString(),\n        firstDismissalDate: null,\n        lastDismissalDate: null,\n      }));\n      setIsFeedbackResponse(true);\n      // Thank you message displayed in the banner should disappear after few seconds.\n      setTimeout(() => {\n        setSurveyIsShown(false);\n      }, 3000);\n    } catch (err) {\n      toggleNotification({\n        type: 'danger',\n        message: formatMessage({ id: 'notification.error', defaultMessage: 'An error occurred' }),\n      });\n    }\n  };\n\n  const handleDismiss = () => {\n    setNpsSurveySettings((settings) => {\n      const nextSettings = {\n        ...settings,\n        lastResponseDate: null,\n      };\n\n      if (settings.firstDismissalDate) {\n        // If the user dismisses the survey for the second time\n        nextSettings.lastDismissalDate = new Date().toString();\n      } else {\n        // If the user dismisses the survey for the first time\n        nextSettings.firstDismissalDate = new Date().toString();\n      }\n\n      return nextSettings;\n    });\n\n    setSurveyIsShown(false);\n  };\n\n  return (\n    <Portal>\n      <Formik\n        initialValues={{ npsSurveyFeedback: '', npsSurveyRating: null }}\n        onSubmit={handleSubmitResponse}\n        validationSchema={yup.object({\n          npsSurveyFeedback: yup.string(),\n          npsSurveyRating: yup.number().required(),\n        })}\n      >\n        {({ values, handleChange, setFieldValue, isSubmitting }) => (\n          <Form name=\"npsSurveyForm\">\n            <Flex\n              hasRadius\n              direction=\"column\"\n              padding={4}\n              borderColor=\"primary200\"\n              background=\"neutral0\"\n              shadow=\"popupShadow\"\n              position=\"fixed\"\n              bottom={0}\n              left=\"50%\"\n              transform=\"translateX(-50%)\"\n              zIndex=\"200\"\n              width=\"50%\"\n            >\n              {isFeedbackResponse ? (\n                <Typography fontWeight=\"semiBold\">\n                  {formatMessage({\n                    id: 'app.components.NpsSurvey.feedback-response',\n                    defaultMessage: 'Thank you very much for your feedback!',\n                  })}\n                </Typography>\n              ) : (\n                <Box tag=\"fieldset\" width=\"100%\" borderWidth={0}>\n                  <Flex justifyContent=\"space-between\" width=\"100%\">\n                    <Box marginLeft=\"auto\" marginRight=\"auto\">\n                      <Typography fontWeight=\"semiBold\" tag=\"legend\">\n                        {formatMessage({\n                          id: 'app.components.NpsSurvey.banner-title',\n                          defaultMessage:\n                            'How likely are you to recommend Strapi to a friend or colleague?',\n                        })}\n                      </Typography>\n                    </Box>\n                    <IconButton\n                      onClick={handleDismiss}\n                      withTooltip={false}\n                      label={formatMessage({\n                        id: 'app.components.NpsSurvey.dismiss-survey-label',\n                        defaultMessage: 'Dismiss survey',\n                      })}\n                    >\n                      <Cross />\n                    </IconButton>\n                  </Flex>\n                  <Flex gap={2} marginTop={2} marginBottom={2} justifyContent=\"center\">\n                    <Typography variant=\"pi\" textColor=\"neutral600\">\n                      {formatMessage({\n                        id: 'app.components.NpsSurvey.no-recommendation',\n                        defaultMessage: 'Not at all likely',\n                      })}\n                    </Typography>\n                    {ratingArray.map((number) => {\n                      return (\n                        <FieldWrapper\n                          key={number}\n                          name=\"npsSurveyRating\"\n                          className={values.npsSurveyRating === number ? 'selected' : undefined} // \"selected\" class added when child radio button is checked\n                          hasRadius\n                          background=\"primary100\"\n                          borderColor=\"primary200\"\n                          color=\"primary600\"\n                          position=\"relative\"\n                          cursor=\"pointer\"\n                        >\n                          <Field.Label>\n                            <VisuallyHidden>\n                              <Field.Input\n                                type=\"radio\"\n                                checked={values.npsSurveyRating === number}\n                                onChange={(e) =>\n                                  setFieldValue('npsSurveyRating', parseInt(e.target.value, 10))\n                                }\n                                value={number}\n                              />\n                            </VisuallyHidden>\n                            {number}\n                          </Field.Label>\n                        </FieldWrapper>\n                      );\n                    })}\n                    <Typography variant=\"pi\" textColor=\"neutral600\">\n                      {formatMessage({\n                        id: 'app.components.NpsSurvey.happy-to-recommend',\n                        defaultMessage: 'Extremely likely',\n                      })}\n                    </Typography>\n                  </Flex>\n                  {values.npsSurveyRating !== null && (\n                    <Flex direction=\"column\">\n                      <Box marginTop={2}>\n                        <Field.Label fontWeight=\"semiBold\" fontSize={2}>\n                          {formatMessage({\n                            id: 'app.components.NpsSurvey.feedback-question',\n                            defaultMessage: 'Do you have any suggestion for improvements?',\n                          })}\n                        </Field.Label>\n                      </Box>\n                      <Box width=\"62%\" marginTop={3} marginBottom={4}>\n                        <Textarea\n                          id=\"npsSurveyFeedback\" // formik element attribute \"id\" should be same as the values key to work\n                          width=\"100%\"\n                          onChange={handleChange}\n                          value={values.npsSurveyFeedback}\n                        />\n                      </Box>\n                      <Button marginBottom={2} type=\"submit\" loading={isSubmitting}>\n                        {formatMessage({\n                          id: 'app.components.NpsSurvey.submit-feedback',\n                          defaultMessage: 'Submit Feedback',\n                        })}\n                      </Button>\n                    </Flex>\n                  )}\n                </Box>\n              )}\n            </Flex>\n          </Form>\n        )}\n      </Formik>\n    </Portal>\n  );\n};\n\ninterface NpsSurveySettings {\n  enabled: boolean;\n  lastResponseDate: string | null;\n  firstDismissalDate: string | null;\n  lastDismissalDate: string | null;\n}\n\n/**\n * We exported to make it available during admin user registration.\n * Because we only enable the NPS for users who subscribe to the newsletter when signing up\n */\nfunction useNpsSurveySettings() {\n  const [npsSurveySettings, setNpsSurveySettings] = usePersistentState<NpsSurveySettings>(\n    'STRAPI_NPS_SURVEY_SETTINGS',\n    {\n      enabled: true,\n      lastResponseDate: null,\n      firstDismissalDate: null,\n      lastDismissalDate: null,\n    }\n  );\n\n  /**\n   * TODO: should this just be an array so we can alias the `usePersistentState` hook?\n   */\n  return { npsSurveySettings, setNpsSurveySettings };\n}\n\nexport { NpsSurvey, useNpsSurveySettings };\n"],"names":["FieldWrapper","styled","Field","Root","theme","spaces","colors","neutral0","primary700","delays","postResponse","postFirstDismissal","postSubsequentDismissal","display","ratingArray","Array","keys","checkIfShouldShowSurvey","settings","enabled","lastResponseDate","firstDismissalDate","lastDismissalDate","window","strapi","flags","nps","timeSinceLastResponse","Date","now","getTime","timeSinceLastDismissal","timeSinceFirstDismissal","NpsSurvey","formatMessage","useIntl","npsSurveySettings","setNpsSurveySettings","useNpsSurveySettings","isFeedbackResponse","setIsFeedbackResponse","React","useState","toggleNotification","useNotification","currentEnvironment","useAppInfo","state","strapiVersion","surveyIsShown","setSurveyIsShown","displaySurvey","setDisplaySurvey","useEffect","displayTime","setTimeout","clearTimeout","user","useAuth","auth","handleSubmitResponse","npsSurveyRating","npsSurveyFeedback","body","email","rating","comment","environment","version","undefined","license","projectType","isHostedOnStrapiCloud","process","env","STRAPI_HOSTING","res","fetch","method","headers","JSON","stringify","ok","Error","toString","err","type","message","id","defaultMessage","handleDismiss","nextSettings","_jsx","Portal","Formik","initialValues","onSubmit","validationSchema","yup","object","string","number","required","values","handleChange","setFieldValue","isSubmitting","Form","name","Flex","hasRadius","direction","padding","borderColor","background","shadow","position","bottom","left","transform","zIndex","width","Typography","fontWeight","_jsxs","Box","tag","borderWidth","justifyContent","marginLeft","marginRight","IconButton","onClick","withTooltip","label","Cross","gap","marginTop","marginBottom","variant","textColor","map","className","color","cursor","Label","VisuallyHidden","Input","checked","onChange","e","parseInt","target","value","fontSize","Textarea","Button","loading","usePersistentState"],"mappings":"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"}
+{"version":3,"file":"NpsSurvey.js","sources":["../../../../../admin/src/components/NpsSurvey.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport {\n  Box,\n  Flex,\n  IconButton,\n  Button,\n  Typography,\n  Textarea,\n  Portal,\n  Field,\n  VisuallyHidden,\n} from '@strapi/design-system';\nimport { Cross } from '@strapi/icons';\nimport { Formik, Form } from 'formik';\nimport { useIntl } from 'react-intl';\nimport { styled } from 'styled-components';\nimport * as yup from 'yup';\n\nimport { useAppInfo } from '../features/AppInfo';\nimport { useAuth } from '../features/Auth';\nimport { useNotification } from '../features/Notifications';\nimport { usePersistentState } from '../hooks/usePersistentState';\n\nconst FieldWrapper = styled(Field.Root)`\n  height: 3.2rem;\n  width: 3.2rem;\n\n  > label,\n  ~ input {\n    display: block;\n    position: absolute;\n    top: 0;\n    left: 0;\n    right: 0;\n    bottom: 0;\n  }\n\n  > label {\n    color: inherit;\n    cursor: pointer;\n    padding: ${({ theme }) => theme.spaces[2]};\n    text-align: center;\n    vertical-align: middle;\n  }\n\n  &:hover,\n  &:focus-within {\n    background-color: ${({ theme }) => theme.colors.neutral0};\n  }\n\n  &:active,\n  &.selected {\n    color: ${({ theme }) => theme.colors.primary700};\n    background-color: ${({ theme }) => theme.colors.neutral0};\n    border-color: ${({ theme }) => theme.colors.primary700};\n  }\n`;\n\nconst delays = {\n  postResponse: 90 * 24 * 60 * 60 * 1000, // 90 days in ms\n  postFirstDismissal: 14 * 24 * 60 * 60 * 1000, // 14 days in ms\n  postSubsequentDismissal: 90 * 24 * 60 * 60 * 1000, // 90 days in ms\n  display: 30 * 60 * 1000, // 30 minutes in ms\n};\n\nconst ratingArray = [...Array(11).keys()];\n\nconst checkIfShouldShowSurvey = (settings: NpsSurveySettings) => {\n  const { enabled, lastResponseDate, firstDismissalDate, lastDismissalDate } = settings;\n\n  // This function goes through all the cases where we'd want to not show the survey:\n  // 1. If the survey is disabled by strapi, abort mission, don't bother checking the other settings.\n  // 2. If the survey is disabled by user, abort mission, don't bother checking the other settings.\n  // 3. If the user has already responded to the survey, check if enough time has passed since the last response.\n  // 4. If the user has dismissed the survey twice or more before, check if enough time has passed since the last dismissal.\n  // 5. If the user has only dismissed the survey once before, check if enough time has passed since the first dismissal.\n  // If none of these cases check out, then we show the survey.\n  // Note that submitting a response resets the dismissal counts.\n  // Checks 4 and 5 should not be reversed, since the first dismissal will also exist if the user has dismissed the survey twice or more before.\n\n  // For users who had created an account before the NPS feature was introduced,\n  // we assume that they would have enabled the NPS feature if they had the chance.\n\n  // Global strapi disable for NSP.\n  if (window.strapi.flags.nps === false) {\n    return false;\n  }\n\n  // User chose not to enable the NPS feature when signing up\n  if (enabled === false) {\n    return false;\n  }\n\n  // The user has already responded to the survey\n  if (lastResponseDate) {\n    const timeSinceLastResponse = Date.now() - new Date(lastResponseDate).getTime();\n\n    if (timeSinceLastResponse >= delays.postResponse) {\n      return true;\n    }\n\n    return false;\n  }\n\n  // The user has dismissed the survey twice or more before\n  if (lastDismissalDate) {\n    const timeSinceLastDismissal = Date.now() - new Date(lastDismissalDate).getTime();\n\n    if (timeSinceLastDismissal >= delays.postSubsequentDismissal) {\n      return true;\n    }\n\n    return false;\n  }\n\n  // The user has only dismissed the survey once before\n  if (firstDismissalDate) {\n    const timeSinceFirstDismissal = Date.now() - new Date(firstDismissalDate).getTime();\n\n    if (timeSinceFirstDismissal >= delays.postFirstDismissal) {\n      return true;\n    }\n\n    return false;\n  }\n\n  // The user has not interacted with the survey before\n  return true;\n};\n\nconst NpsSurvey = () => {\n  const { formatMessage } = useIntl();\n  const { npsSurveySettings, setNpsSurveySettings } = useNpsSurveySettings();\n  const [isFeedbackResponse, setIsFeedbackResponse] = React.useState(false);\n  const { toggleNotification } = useNotification();\n  const currentEnvironment = useAppInfo('NpsSurvey', (state) => state.currentEnvironment);\n  const strapiVersion = useAppInfo('NpsSurvey', (state) => state.strapiVersion);\n\n  interface NpsSurveyMutationBody {\n    email: string;\n    rating: number | null;\n    comment: string;\n    environment?: string;\n    version?: string;\n    license: 'Enterprise' | 'Community';\n  }\n\n  // Only check on first render if the survey should be shown\n  const [surveyIsShown, setSurveyIsShown] = React.useState(\n    checkIfShouldShowSurvey(npsSurveySettings)\n  );\n\n  // Set a cooldown to show the survey when session begins\n  const [displaySurvey, setDisplaySurvey] = React.useState(false);\n\n  React.useEffect(() => {\n    const displayTime = setTimeout(() => {\n      setDisplaySurvey(true);\n    }, delays.display);\n\n    return () => {\n      clearTimeout(displayTime);\n    };\n  }, []);\n\n  const { user } = useAuth('NpsSurvey', (auth) => auth);\n\n  if (!displaySurvey) {\n    return null;\n  }\n\n  if (!surveyIsShown) {\n    return null;\n  }\n\n  const handleSubmitResponse = async ({\n    npsSurveyRating,\n    npsSurveyFeedback,\n  }: {\n    npsSurveyRating: NpsSurveyMutationBody['rating'];\n    npsSurveyFeedback: NpsSurveyMutationBody['comment'];\n  }) => {\n    try {\n      const body = {\n        email: typeof user === 'object' && user.email ? user.email : '',\n        rating: npsSurveyRating,\n        comment: npsSurveyFeedback,\n        environment: currentEnvironment,\n        version: strapiVersion ?? undefined,\n        license: window.strapi.projectType,\n        isHostedOnStrapiCloud: process.env.STRAPI_HOSTING === 'strapi.cloud',\n      };\n      const res = await fetch('https://analytics.strapi.io/submit-nps', {\n        method: 'POST',\n        headers: {\n          'Content-Type': 'application/json',\n        },\n        body: JSON.stringify(body),\n      });\n\n      if (!res.ok) {\n        throw new Error('Failed to submit NPS survey');\n      }\n\n      setNpsSurveySettings((settings) => ({\n        ...settings,\n        lastResponseDate: new Date().toString(),\n        firstDismissalDate: null,\n        lastDismissalDate: null,\n      }));\n      setIsFeedbackResponse(true);\n      // Thank you message displayed in the banner should disappear after few seconds.\n      setTimeout(() => {\n        setSurveyIsShown(false);\n      }, 3000);\n    } catch (err) {\n      toggleNotification({\n        type: 'danger',\n        message: formatMessage({ id: 'notification.error', defaultMessage: 'An error occurred' }),\n      });\n    }\n  };\n\n  const handleDismiss = () => {\n    setNpsSurveySettings((settings) => {\n      const nextSettings = {\n        ...settings,\n        lastResponseDate: null,\n      };\n\n      if (settings.firstDismissalDate) {\n        // If the user dismisses the survey for the second time\n        nextSettings.lastDismissalDate = new Date().toString();\n      } else {\n        // If the user dismisses the survey for the first time\n        nextSettings.firstDismissalDate = new Date().toString();\n      }\n\n      return nextSettings;\n    });\n\n    setSurveyIsShown(false);\n  };\n\n  return (\n    <Portal>\n      <Formik\n        initialValues={{ npsSurveyFeedback: '', npsSurveyRating: null }}\n        onSubmit={handleSubmitResponse}\n        validationSchema={yup.object({\n          npsSurveyFeedback: yup.string(),\n          npsSurveyRating: yup.number().required(),\n        })}\n      >\n        {({ values, handleChange, setFieldValue, isSubmitting }) => (\n          <Form name=\"npsSurveyForm\">\n            <Flex\n              hasRadius\n              direction=\"column\"\n              padding={4}\n              borderColor=\"primary200\"\n              background=\"neutral0\"\n              shadow=\"popupShadow\"\n              position=\"fixed\"\n              bottom={0}\n              left=\"50%\"\n              transform=\"translateX(-50%)\"\n              zIndex=\"200\"\n              width=\"50%\"\n            >\n              {isFeedbackResponse ? (\n                <Typography fontWeight=\"semiBold\">\n                  {formatMessage({\n                    id: 'app.components.NpsSurvey.feedback-response',\n                    defaultMessage: 'Thank you very much for your feedback!',\n                  })}\n                </Typography>\n              ) : (\n                <Box tag=\"fieldset\" width=\"100%\" borderWidth={0}>\n                  <Flex justifyContent=\"space-between\" width=\"100%\">\n                    <Box marginLeft=\"auto\" marginRight=\"auto\">\n                      <Typography fontWeight=\"semiBold\" tag=\"legend\">\n                        {formatMessage({\n                          id: 'app.components.NpsSurvey.banner-title',\n                          defaultMessage:\n                            'How likely are you to recommend Strapi to a friend or colleague?',\n                        })}\n                      </Typography>\n                    </Box>\n                    <IconButton\n                      onClick={handleDismiss}\n                      withTooltip={false}\n                      label={formatMessage({\n                        id: 'app.components.NpsSurvey.dismiss-survey-label',\n                        defaultMessage: 'Dismiss survey',\n                      })}\n                    >\n                      <Cross />\n                    </IconButton>\n                  </Flex>\n                  <Flex gap={2} marginTop={2} marginBottom={2} justifyContent=\"center\">\n                    <Typography variant=\"pi\" textColor=\"neutral600\">\n                      {formatMessage({\n                        id: 'app.components.NpsSurvey.no-recommendation',\n                        defaultMessage: 'Not at all likely',\n                      })}\n                    </Typography>\n                    {ratingArray.map((number) => {\n                      return (\n                        <FieldWrapper\n                          key={number}\n                          name=\"npsSurveyRating\"\n                          className={values.npsSurveyRating === number ? 'selected' : undefined} // \"selected\" class added when child radio button is checked\n                          hasRadius\n                          background=\"primary100\"\n                          borderColor=\"primary200\"\n                          color=\"primary600\"\n                          position=\"relative\"\n                          cursor=\"pointer\"\n                        >\n                          <Field.Label>\n                            <VisuallyHidden>\n                              <Field.Input\n                                type=\"radio\"\n                                checked={values.npsSurveyRating === number}\n                                onChange={(e) =>\n                                  setFieldValue('npsSurveyRating', parseInt(e.target.value, 10))\n                                }\n                                value={number}\n                              />\n                            </VisuallyHidden>\n                            {number}\n                          </Field.Label>\n                        </FieldWrapper>\n                      );\n                    })}\n                    <Typography variant=\"pi\" textColor=\"neutral600\">\n                      {formatMessage({\n                        id: 'app.components.NpsSurvey.happy-to-recommend',\n                        defaultMessage: 'Extremely likely',\n                      })}\n                    </Typography>\n                  </Flex>\n                  {values.npsSurveyRating !== null && (\n                    <Flex direction=\"column\">\n                      <Box marginTop={2}>\n                        <Field.Label fontWeight=\"semiBold\" fontSize={2}>\n                          {formatMessage({\n                            id: 'app.components.NpsSurvey.feedback-question',\n                            defaultMessage: 'Do you have any suggestion for improvements?',\n                          })}\n                        </Field.Label>\n                      </Box>\n                      <Box width=\"62%\" marginTop={3} marginBottom={4}>\n                        <Textarea\n                          id=\"npsSurveyFeedback\" // formik element attribute \"id\" should be same as the values key to work\n                          width=\"100%\"\n                          onChange={handleChange}\n                          value={values.npsSurveyFeedback}\n                        />\n                      </Box>\n                      <Button marginBottom={2} type=\"submit\" loading={isSubmitting}>\n                        {formatMessage({\n                          id: 'app.components.NpsSurvey.submit-feedback',\n                          defaultMessage: 'Submit Feedback',\n                        })}\n                      </Button>\n                    </Flex>\n                  )}\n                </Box>\n              )}\n            </Flex>\n          </Form>\n        )}\n      </Formik>\n    </Portal>\n  );\n};\n\ninterface NpsSurveySettings {\n  enabled: boolean;\n  lastResponseDate: string | null;\n  firstDismissalDate: string | null;\n  lastDismissalDate: string | null;\n}\n\n/**\n * We exported to make it available during admin user registration.\n * Because we only enable the NPS for users who subscribe to the newsletter when signing up\n */\nfunction useNpsSurveySettings() {\n  const [npsSurveySettings, setNpsSurveySettings] = usePersistentState<NpsSurveySettings>(\n    'STRAPI_NPS_SURVEY_SETTINGS',\n    {\n      enabled: true,\n      lastResponseDate: null,\n      firstDismissalDate: null,\n      lastDismissalDate: null,\n    }\n  );\n\n  /**\n   * TODO: should this just be an array so we can alias the `usePersistentState` hook?\n   */\n  return { npsSurveySettings, setNpsSurveySettings };\n}\n\nexport { NpsSurvey, useNpsSurveySettings };\n"],"names":["FieldWrapper","styled","Field","Root","theme","spaces","colors","neutral0","primary700","delays","postResponse","postFirstDismissal","postSubsequentDismissal","display","ratingArray","Array","keys","checkIfShouldShowSurvey","settings","enabled","lastResponseDate","firstDismissalDate","lastDismissalDate","window","strapi","flags","nps","timeSinceLastResponse","Date","now","getTime","timeSinceLastDismissal","timeSinceFirstDismissal","NpsSurvey","formatMessage","useIntl","npsSurveySettings","setNpsSurveySettings","useNpsSurveySettings","isFeedbackResponse","setIsFeedbackResponse","React","useState","toggleNotification","useNotification","currentEnvironment","useAppInfo","state","strapiVersion","surveyIsShown","setSurveyIsShown","displaySurvey","setDisplaySurvey","useEffect","displayTime","setTimeout","clearTimeout","user","useAuth","auth","handleSubmitResponse","npsSurveyRating","npsSurveyFeedback","body","email","rating","comment","environment","version","undefined","license","projectType","isHostedOnStrapiCloud","process","env","STRAPI_HOSTING","res","fetch","method","headers","JSON","stringify","ok","Error","toString","err","type","message","id","defaultMessage","handleDismiss","nextSettings","_jsx","Portal","Formik","initialValues","onSubmit","validationSchema","yup","object","string","number","required","values","handleChange","setFieldValue","isSubmitting","Form","name","Flex","hasRadius","direction","padding","borderColor","background","shadow","position","bottom","left","transform","zIndex","width","Typography","fontWeight","_jsxs","Box","tag","borderWidth","justifyContent","marginLeft","marginRight","IconButton","onClick","withTooltip","label","Cross","gap","marginTop","marginBottom","variant","textColor","map","className","color","cursor","Label","VisuallyHidden","Input","checked","onChange","e","parseInt","target","value","fontSize","Textarea","Button","loading","usePersistentState"],"mappings":"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"}

package/dist/admin/admin/src/components/SubNav.js

@@ -5,9 +5,9 @@ var React = require('react');
 var designSystem = require('@strapi/design-system');
 var icons = require('@strapi/icons');
 var reactRouterDom = require('react-router-dom');
-var styledComponents = require('styled-components');
+var styled = require('styled-components');
 
-const Main = styledComponents.styled(designSystem.SubNav)`
+const Main = styled.styled(designSystem.SubNav)`
   background-color: ${({ theme })=>theme.colors.neutral0};
   border-right: 1px solid ${({ theme })=>theme.colors.neutral150};
 
@@ -18,7 +18,7 @@ const Main = styledComponents.styled(designSystem.SubNav)`
     display: none;
   }
 `;
-const StyledLink = styledComponents.styled(reactRouterDom.NavLink)`
+const StyledLink = styled.styled(reactRouterDom.NavLink)`
   display: flex;
   align-items: center;
   justify-content: space-between;
@@ -91,7 +91,7 @@ const Link = (props)=>{
         })
     });
 };
-const StyledHeader = styledComponents.styled(designSystem.Box)`
+const StyledHeader = styled.styled(designSystem.Box)`
   height: 56px;
   display: flex;
   align-items: center;
@@ -174,7 +174,7 @@ const Section = ({ label, children, link })=>{
         ]
     });
 };
-const SubSectionHeader = styledComponents.styled.button`
+const SubSectionHeader = styled.styled.button`
   cursor: pointer;
   width: 100%;
   border: none;
@@ -196,7 +196,7 @@ const SubSectionHeader = styledComponents.styled.button`
     background-color: ${({ theme })=>theme.colors.neutral100};
   }
 `;
-const SubSectionLinkWrapper = styledComponents.styled.li`
+const SubSectionLinkWrapper = styled.styled.li`
   ${StyledLink} > div {
     padding-left: 36px;
   }

package/dist/admin/admin/src/components/SubNav.js.map

@@ -1 +1 @@
-{"version":3,"file":"SubNav.js","sources":["../../../../../admin/src/components/SubNav.tsx"],"sourcesContent":["import { useId, useState } from 'react';\n\nimport { Box, SubNav as DSSubNav, Flex, Typography, IconButton } from '@strapi/design-system';\nimport { ChevronDown, Plus } from '@strapi/icons';\nimport { NavLink } from 'react-router-dom';\nimport { styled } from 'styled-components';\n\nconst Main = styled(DSSubNav)`\n  background-color: ${({ theme }) => theme.colors.neutral0};\n  border-right: 1px solid ${({ theme }) => theme.colors.neutral150};\n\n  scrollbar-width: none;\n  -ms-overflow-style: none;\n\n  &::-webkit-scrollbar {\n    display: none;\n  }\n`;\n\nconst StyledLink = styled(NavLink)`\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  text-decoration: none;\n  height: 32px;\n\n  color: ${({ theme }) => theme.colors.neutral800};\n\n  &.active > div {\n    ${({ theme }) => {\n      return `\n        background-color: ${theme.colors.primary100};\n        color: ${theme.colors.primary700};\n        font-weight: 500;\n      `;\n    }}\n  }\n\n  &:hover.active > div {\n    ${({ theme }) => {\n      return `\n        background-color: ${theme.colors.primary100};\n      `;\n    }}\n  }\n\n  &:hover > div {\n    ${({ theme }) => {\n      return `\n        background-color: ${theme.colors.neutral100};\n      `;\n    }}\n  }\n\n  &:focus-visible {\n    outline-offset: -2px;\n  }\n`;\n\nconst Link = (\n  props: Omit<React.ComponentProps<typeof StyledLink>, 'label'> & {\n    label: React.ReactNode;\n    endAction?: React.ReactNode;\n  }\n) => {\n  const { label, endAction, ...rest } = props;\n  return (\n    <StyledLink {...rest}>\n      <Box width={'100%'} paddingLeft={3} paddingRight={3} borderRadius={1}>\n        <Flex justifyContent=\"space-between\" width=\"100%\" gap={1}>\n          <Typography\n            tag=\"div\"\n            lineHeight=\"32px\"\n            width=\"100%\"\n            overflow=\"hidden\"\n            style={{ textOverflow: 'ellipsis', whiteSpace: 'nowrap' }}\n          >\n            {label}\n          </Typography>\n          <Flex gap={2}>{endAction}</Flex>\n        </Flex>\n      </Box>\n    </StyledLink>\n  );\n};\n\nconst StyledHeader = styled(Box)`\n  height: 56px;\n  display: flex;\n  align-items: center;\n  padding-left: ${({ theme }) => theme.spaces[5]};\n`;\n\nconst Header = ({ label }: { label: string }) => {\n  return (\n    <StyledHeader>\n      <Typography variant=\"beta\" tag=\"h2\">\n        {label}\n      </Typography>\n    </StyledHeader>\n  );\n};\n\nconst Sections = ({ children, ...props }: { children: React.ReactNode[]; [key: string]: any }) => {\n  return (\n    <Box paddingBottom={4}>\n      <Flex tag=\"ol\" gap=\"5\" direction=\"column\" alignItems=\"stretch\" {...props}>\n        {children.map((child, index) => {\n          return <li key={index}>{child}</li>;\n        })}\n      </Flex>\n    </Box>\n  );\n};\n\nconst Section = ({\n  label,\n  children,\n  link,\n}: {\n  label: string;\n  children: React.ReactNode[];\n  link?: { label: string; onClik: () => void };\n}) => {\n  const listId = useId();\n\n  return (\n    <Flex direction=\"column\" alignItems=\"stretch\" gap={2}>\n      <Box paddingLeft={5} paddingRight={5}>\n        <Flex position=\"relative\" justifyContent=\"space-between\">\n          <Flex>\n            <Box>\n              <Typography variant=\"sigma\" textColor=\"neutral600\">\n                {label}\n              </Typography>\n            </Box>\n          </Flex>\n          {link && (\n            <IconButton\n              label={link.label}\n              variant=\"ghost\"\n              withTooltip\n              onClick={link.onClik}\n              size=\"XS\"\n            >\n              <Plus />\n            </IconButton>\n          )}\n        </Flex>\n      </Box>\n      <Flex\n        tag=\"ol\"\n        id={listId}\n        direction=\"column\"\n        gap=\"2px\"\n        alignItems={'stretch'}\n        marginLeft={2}\n        marginRight={2}\n      >\n        {children.map((child, index) => {\n          return <li key={index}>{child}</li>;\n        })}\n      </Flex>\n    </Flex>\n  );\n};\n\nconst SubSectionHeader = styled.button`\n  cursor: pointer;\n  width: 100%;\n  border: none;\n  padding: 0;\n  background: transparent;\n  display: flex;\n  align-items: center;\n\n  height: 32px;\n\n  border-radius: ${({ theme }) => theme.borderRadius};\n\n  padding-left: ${({ theme }) => theme.spaces[3]};\n  padding-right: ${({ theme }) => theme.spaces[3]};\n  padding-top: ${({ theme }) => theme.spaces[2]};\n  padding-bottom: ${({ theme }) => theme.spaces[2]};\n\n  &:hover {\n    background-color: ${({ theme }) => theme.colors.neutral100};\n  }\n`;\n\nconst SubSectionLinkWrapper = styled.li`\n  ${StyledLink} > div {\n    padding-left: 36px;\n  }\n`;\n\nconst SubSection = ({ label, children }: { label: string; children: React.ReactNode[] }) => {\n  const [isOpen, setOpenLinks] = useState(true);\n  const listId = useId();\n\n  const handleClick = () => {\n    setOpenLinks((prev) => !prev);\n  };\n\n  return (\n    <Box>\n      <Flex justifyContent=\"space-between\">\n        <SubSectionHeader onClick={handleClick} aria-expanded={isOpen} aria-controls={listId}>\n          <ChevronDown\n            aria-hidden\n            fill=\"neutral500\"\n            style={{\n              transform: `rotate(${isOpen ? '0deg' : '-90deg'})`,\n              transition: 'transform 0.5s',\n            }}\n          />\n          <Box paddingLeft={2}>\n            <Typography tag=\"span\" fontWeight=\"semiBold\" textColor=\"neutral800\">\n              {label}\n            </Typography>\n          </Box>\n        </SubSectionHeader>\n      </Flex>\n      {\n        <Flex\n          tag=\"ul\"\n          id={listId}\n          direction=\"column\"\n          gap=\"2px\"\n          alignItems={'stretch'}\n          style={{\n            maxHeight: isOpen ? '1000px' : 0,\n            overflow: 'hidden',\n            transition: isOpen\n              ? 'max-height 1s ease-in-out'\n              : 'max-height 0.5s cubic-bezier(0, 1, 0, 1)',\n          }}\n        >\n          {children.map((child, index) => {\n            return <SubSectionLinkWrapper key={index}>{child}</SubSectionLinkWrapper>;\n          })}\n        </Flex>\n      }\n    </Box>\n  );\n};\n\nexport const SubNav = {\n  Main,\n  Header,\n  Link,\n  Sections,\n  Section,\n  SubSection,\n};\n"],"names":["Main","styled","DSSubNav","theme","colors","neutral0","neutral150","StyledLink","NavLink","neutral800","primary100","primary700","neutral100","Link","props","label","endAction","rest","_jsx","Box","width","paddingLeft","paddingRight","borderRadius","_jsxs","Flex","justifyContent","gap","Typography","tag","lineHeight","overflow","style","textOverflow","whiteSpace","StyledHeader","spaces","Header","variant","Sections","children","paddingBottom","direction","alignItems","map","child","index","li","Section","link","listId","useId","position","textColor","IconButton","withTooltip","onClick","onClik","size","Plus","id","marginLeft","marginRight","SubSectionHeader","button","SubSectionLinkWrapper","SubSection","isOpen","setOpenLinks","useState","handleClick","prev","aria-expanded","aria-controls","ChevronDown","aria-hidden","fill","transform","transition","fontWeight","maxHeight","SubNav"],"mappings":"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"}
+{"version":3,"file":"SubNav.js","sources":["../../../../../admin/src/components/SubNav.tsx"],"sourcesContent":["import { useId, useState } from 'react';\n\nimport { Box, SubNav as DSSubNav, Flex, Typography, IconButton } from '@strapi/design-system';\nimport { ChevronDown, Plus } from '@strapi/icons';\nimport { NavLink } from 'react-router-dom';\nimport { styled } from 'styled-components';\n\nconst Main = styled(DSSubNav)`\n  background-color: ${({ theme }) => theme.colors.neutral0};\n  border-right: 1px solid ${({ theme }) => theme.colors.neutral150};\n\n  scrollbar-width: none;\n  -ms-overflow-style: none;\n\n  &::-webkit-scrollbar {\n    display: none;\n  }\n`;\n\nconst StyledLink = styled(NavLink)`\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  text-decoration: none;\n  height: 32px;\n\n  color: ${({ theme }) => theme.colors.neutral800};\n\n  &.active > div {\n    ${({ theme }) => {\n      return `\n        background-color: ${theme.colors.primary100};\n        color: ${theme.colors.primary700};\n        font-weight: 500;\n      `;\n    }}\n  }\n\n  &:hover.active > div {\n    ${({ theme }) => {\n      return `\n        background-color: ${theme.colors.primary100};\n      `;\n    }}\n  }\n\n  &:hover > div {\n    ${({ theme }) => {\n      return `\n        background-color: ${theme.colors.neutral100};\n      `;\n    }}\n  }\n\n  &:focus-visible {\n    outline-offset: -2px;\n  }\n`;\n\nconst Link = (\n  props: Omit<React.ComponentProps<typeof StyledLink>, 'label'> & {\n    label: React.ReactNode;\n    endAction?: React.ReactNode;\n  }\n) => {\n  const { label, endAction, ...rest } = props;\n  return (\n    <StyledLink {...rest}>\n      <Box width={'100%'} paddingLeft={3} paddingRight={3} borderRadius={1}>\n        <Flex justifyContent=\"space-between\" width=\"100%\" gap={1}>\n          <Typography\n            tag=\"div\"\n            lineHeight=\"32px\"\n            width=\"100%\"\n            overflow=\"hidden\"\n            style={{ textOverflow: 'ellipsis', whiteSpace: 'nowrap' }}\n          >\n            {label}\n          </Typography>\n          <Flex gap={2}>{endAction}</Flex>\n        </Flex>\n      </Box>\n    </StyledLink>\n  );\n};\n\nconst StyledHeader = styled(Box)`\n  height: 56px;\n  display: flex;\n  align-items: center;\n  padding-left: ${({ theme }) => theme.spaces[5]};\n`;\n\nconst Header = ({ label }: { label: string }) => {\n  return (\n    <StyledHeader>\n      <Typography variant=\"beta\" tag=\"h2\">\n        {label}\n      </Typography>\n    </StyledHeader>\n  );\n};\n\nconst Sections = ({ children, ...props }: { children: React.ReactNode[]; [key: string]: any }) => {\n  return (\n    <Box paddingBottom={4}>\n      <Flex tag=\"ol\" gap=\"5\" direction=\"column\" alignItems=\"stretch\" {...props}>\n        {children.map((child, index) => {\n          return <li key={index}>{child}</li>;\n        })}\n      </Flex>\n    </Box>\n  );\n};\n\nconst Section = ({\n  label,\n  children,\n  link,\n}: {\n  label: string;\n  children: React.ReactNode[];\n  link?: { label: string; onClik: () => void };\n}) => {\n  const listId = useId();\n\n  return (\n    <Flex direction=\"column\" alignItems=\"stretch\" gap={2}>\n      <Box paddingLeft={5} paddingRight={5}>\n        <Flex position=\"relative\" justifyContent=\"space-between\">\n          <Flex>\n            <Box>\n              <Typography variant=\"sigma\" textColor=\"neutral600\">\n                {label}\n              </Typography>\n            </Box>\n          </Flex>\n          {link && (\n            <IconButton\n              label={link.label}\n              variant=\"ghost\"\n              withTooltip\n              onClick={link.onClik}\n              size=\"XS\"\n            >\n              <Plus />\n            </IconButton>\n          )}\n        </Flex>\n      </Box>\n      <Flex\n        tag=\"ol\"\n        id={listId}\n        direction=\"column\"\n        gap=\"2px\"\n        alignItems={'stretch'}\n        marginLeft={2}\n        marginRight={2}\n      >\n        {children.map((child, index) => {\n          return <li key={index}>{child}</li>;\n        })}\n      </Flex>\n    </Flex>\n  );\n};\n\nconst SubSectionHeader = styled.button`\n  cursor: pointer;\n  width: 100%;\n  border: none;\n  padding: 0;\n  background: transparent;\n  display: flex;\n  align-items: center;\n\n  height: 32px;\n\n  border-radius: ${({ theme }) => theme.borderRadius};\n\n  padding-left: ${({ theme }) => theme.spaces[3]};\n  padding-right: ${({ theme }) => theme.spaces[3]};\n  padding-top: ${({ theme }) => theme.spaces[2]};\n  padding-bottom: ${({ theme }) => theme.spaces[2]};\n\n  &:hover {\n    background-color: ${({ theme }) => theme.colors.neutral100};\n  }\n`;\n\nconst SubSectionLinkWrapper = styled.li`\n  ${StyledLink} > div {\n    padding-left: 36px;\n  }\n`;\n\nconst SubSection = ({ label, children }: { label: string; children: React.ReactNode[] }) => {\n  const [isOpen, setOpenLinks] = useState(true);\n  const listId = useId();\n\n  const handleClick = () => {\n    setOpenLinks((prev) => !prev);\n  };\n\n  return (\n    <Box>\n      <Flex justifyContent=\"space-between\">\n        <SubSectionHeader onClick={handleClick} aria-expanded={isOpen} aria-controls={listId}>\n          <ChevronDown\n            aria-hidden\n            fill=\"neutral500\"\n            style={{\n              transform: `rotate(${isOpen ? '0deg' : '-90deg'})`,\n              transition: 'transform 0.5s',\n            }}\n          />\n          <Box paddingLeft={2}>\n            <Typography tag=\"span\" fontWeight=\"semiBold\" textColor=\"neutral800\">\n              {label}\n            </Typography>\n          </Box>\n        </SubSectionHeader>\n      </Flex>\n      {\n        <Flex\n          tag=\"ul\"\n          id={listId}\n          direction=\"column\"\n          gap=\"2px\"\n          alignItems={'stretch'}\n          style={{\n            maxHeight: isOpen ? '1000px' : 0,\n            overflow: 'hidden',\n            transition: isOpen\n              ? 'max-height 1s ease-in-out'\n              : 'max-height 0.5s cubic-bezier(0, 1, 0, 1)',\n          }}\n        >\n          {children.map((child, index) => {\n            return <SubSectionLinkWrapper key={index}>{child}</SubSectionLinkWrapper>;\n          })}\n        </Flex>\n      }\n    </Box>\n  );\n};\n\nexport const SubNav = {\n  Main,\n  Header,\n  Link,\n  Sections,\n  Section,\n  SubSection,\n};\n"],"names":["Main","styled","DSSubNav","theme","colors","neutral0","neutral150","StyledLink","NavLink","neutral800","primary100","primary700","neutral100","Link","props","label","endAction","rest","_jsx","Box","width","paddingLeft","paddingRight","borderRadius","_jsxs","Flex","justifyContent","gap","Typography","tag","lineHeight","overflow","style","textOverflow","whiteSpace","StyledHeader","spaces","Header","variant","Sections","children","paddingBottom","direction","alignItems","map","child","index","li","Section","link","listId","useId","position","textColor","IconButton","withTooltip","onClick","onClik","size","Plus","id","marginLeft","marginRight","SubSectionHeader","button","SubSectionLinkWrapper","SubSection","isOpen","setOpenLinks","useState","handleClick","prev","aria-expanded","aria-controls","ChevronDown","aria-hidden","fill","transform","transition","fontWeight","maxHeight","SubNav"],"mappings":"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"}

package/dist/admin/admin/src/components/Table.js

@@ -6,7 +6,7 @@ var designSystem = require('@strapi/design-system');
 var icons = require('@strapi/icons');
 var symbols = require('@strapi/icons/symbols');
 var reactIntl = require('react-intl');
-var styledComponents = require('styled-components');
+var styled = require('styled-components');
 var useControllableState = require('../hooks/useControllableState.js');
 var useQueryParams = require('../hooks/useQueryParams.js');
 var Context = require('./Context.js');
@@ -137,7 +137,7 @@ const Root = ({ children, defaultSelectedRows, footer, headers = [], isLoading =
         })
     });
 };
-const SortIcon = styledComponents.styled(icons.CaretDown)`
+const SortIcon = styled.styled(icons.CaretDown)`
   transform: ${({ $isUp })=>`rotate(${$isUp ? '180' : '0'}deg)`};
 `;
 /* -------------------------------------------------------------------------------------------------

package/dist/admin/admin/src/components/Table.js.map

@@ -1 +1 @@
-{"version":3,"file":"Table.js","sources":["../../../../../admin/src/components/Table.tsx"],"sourcesContent":["/**\n * TODO: honestly, half of this stuff should come straight from\n * the design-system and then we can just wrap round the bits for\n * the i18n & router interactions.\n *\n * So we'll do that in v2 of the DS.\n */\n\nimport * as React from 'react';\n\nimport {\n  Flex,\n  Typography,\n  Th,\n  Tbody,\n  Td,\n  Tooltip,\n  IconButton,\n  Thead,\n  Tr,\n  RawTrProps,\n  Checkbox,\n  Loader,\n  Table as DSTable,\n  EmptyStateLayout,\n  EmptyStateLayoutProps,\n  TableProps,\n  RawTdProps,\n} from '@strapi/design-system';\nimport { CaretDown } from '@strapi/icons';\nimport { EmptyDocuments } from '@strapi/icons/symbols';\nimport { useIntl } from 'react-intl';\nimport { styled } from 'styled-components';\n\nimport { useControllableState } from '../hooks/useControllableState';\nimport { useQueryParams } from '../hooks/useQueryParams';\n\nimport { createContext } from './Context';\n\n/* -------------------------------------------------------------------------------------------------\n * Root\n * -----------------------------------------------------------------------------------------------*/\n\ninterface BaseRow {\n  id: string | number;\n  [key: string]: any;\n}\n\ninterface TableHeader<TData = object, THeader = object> {\n  /**\n   * Typically used by plugins to render a custom cell\n   */\n  cellFormatter?: (data: TData, header: Omit<THeader, 'cellFormatter'>) => React.ReactNode;\n  label: string;\n  name: string;\n  searchable?: boolean;\n  sortable?: boolean;\n}\n\ninterface TableContextValue<TRow extends BaseRow, THeader extends TableHeader<TRow, THeader>>\n  extends Pick<TableProps, 'footer'> {\n  colCount: number;\n  hasHeaderCheckbox: boolean;\n  headers: THeader[];\n  isLoading: boolean;\n  rowCount: number;\n  rows: TRow[];\n  setHasHeaderCheckbox: (value: boolean) => void;\n  selectedRows: TRow[];\n  selectRow: (row: TRow | TRow[]) => void;\n}\n\nconst [TableProvider, useTable] = createContext<TableContextValue<any, any>>('Table');\n\ninterface RootProps<TRow extends BaseRow, THeader extends TableHeader<TRow, THeader>>\n  extends Partial<\n    Pick<\n      TableContextValue<TRow, THeader>,\n      'footer' | 'headers' | 'isLoading' | 'rows' | 'selectedRows'\n    >\n  > {\n  children?: React.ReactNode;\n  defaultSelectedRows?: TRow[];\n  onSelectedRowsChange?: (selectedRows: TRow[]) => void;\n}\n\nconst Root = <TRow extends BaseRow, THeader extends TableHeader<TRow, THeader>>({\n  children,\n  defaultSelectedRows,\n  footer,\n  headers = [],\n  isLoading = false,\n  onSelectedRowsChange,\n  rows = [],\n  selectedRows: selectedRowsProps,\n}: RootProps<TRow, THeader>) => {\n  const [selectedRows = [], setSelectedRows] = useControllableState({\n    prop: selectedRowsProps,\n    defaultProp: defaultSelectedRows,\n    onChange: onSelectedRowsChange,\n  });\n  const [hasHeaderCheckbox, setHasHeaderCheckbox] = React.useState(false);\n\n  const rowCount = rows.length + 1;\n  const colCount = hasHeaderCheckbox ? headers.length + 1 : headers.length;\n\n  const selectRow: TableContextValue<TRow, THeader>['selectRow'] = (row) => {\n    if (Array.isArray(row)) {\n      setSelectedRows(row);\n    } else {\n      setSelectedRows((prev = []) => {\n        const currentRowIndex = prev.findIndex((r) => r.id === row.id);\n        if (currentRowIndex > -1) {\n          return prev.toSpliced(currentRowIndex, 1);\n        }\n\n        return [...prev, row];\n      });\n    }\n  };\n\n  return (\n    <TableProvider\n      colCount={colCount}\n      hasHeaderCheckbox={hasHeaderCheckbox}\n      setHasHeaderCheckbox={setHasHeaderCheckbox}\n      footer={footer}\n      headers={headers}\n      isLoading={isLoading}\n      rowCount={rowCount}\n      rows={rows}\n      selectedRows={selectedRows}\n      selectRow={selectRow}\n    >\n      {children}\n    </TableProvider>\n  );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * Content\n * -----------------------------------------------------------------------------------------------*/\n\nconst Content = ({ children }: Table.ContentProps) => {\n  const rowCount = useTable('Content', (state) => state.rowCount);\n  const colCount = useTable('Content', (state) => state.colCount);\n  const footer = useTable('Content', (state) => state.footer);\n\n  return (\n    <DSTable rowCount={rowCount} colCount={colCount} footer={footer}>\n      {children}\n    </DSTable>\n  );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * Head\n * -----------------------------------------------------------------------------------------------*/\n\nconst Head = ({ children }: Table.HeadProps) => {\n  return (\n    <Thead>\n      <Tr>{children}</Tr>\n    </Thead>\n  );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * HeaderCell\n * -----------------------------------------------------------------------------------------------*/\n\n/**\n * @description A header cell in your table, internally will set the query params for sorting to\n * be passed to your data-fetching function.\n */\nconst HeaderCell = <TData, THead>({ name, label, sortable }: TableHeader<TData, THead>) => {\n  const [{ query }, setQuery] = useQueryParams<{ sort?: `${string}:${'ASC' | 'DESC'}` }>();\n  const sort = query?.sort ?? '';\n  const [sortBy, sortOrder] = sort.split(':');\n  const { formatMessage } = useIntl();\n  const isSorted = sortBy === name;\n\n  const sortLabel = formatMessage(\n    { id: 'components.TableHeader.sort', defaultMessage: 'Sort on {label}' },\n    { label }\n  );\n\n  const handleClickSort = () => {\n    if (sortable) {\n      setQuery({\n        sort: `${name}:${isSorted && sortOrder === 'ASC' ? 'DESC' : 'ASC'}`,\n      });\n    }\n  };\n\n  return (\n    <Th\n      action={\n        isSorted &&\n        sortable && (\n          <IconButton label={sortLabel} onClick={handleClickSort} variant=\"ghost\">\n            <SortIcon $isUp={sortOrder === 'ASC'} />\n          </IconButton>\n        )\n      }\n    >\n      <Tooltip label={sortable ? sortLabel : label}>\n        <Typography\n          textColor=\"neutral600\"\n          tag={!isSorted && sortable ? 'button' : 'span'}\n          onClick={handleClickSort}\n          variant=\"sigma\"\n        >\n          {label}\n        </Typography>\n      </Tooltip>\n    </Th>\n  );\n};\n\nconst SortIcon = styled(CaretDown)<{\n  $isUp: boolean;\n}>`\n  transform: ${({ $isUp }) => `rotate(${$isUp ? '180' : '0'}deg)`};\n`;\n\n/* -------------------------------------------------------------------------------------------------\n * ActionBar\n * -----------------------------------------------------------------------------------------------*/\n\nconst ActionBar = ({ children }: Table.ActionBarProps) => {\n  const { formatMessage } = useIntl();\n  const selectedRows = useTable('ActionBar', (state) => state.selectedRows);\n\n  if (selectedRows.length === 0) return null;\n\n  return (\n    <Flex gap={2}>\n      <Typography variant=\"omega\" textColor=\"neutral500\">\n        {formatMessage(\n          {\n            id: 'content-manager.components.TableDelete.label',\n            defaultMessage: '{number, plural, one {# row} other {# rows}} selected',\n          },\n          { number: selectedRows.length }\n        )}\n      </Typography>\n      {children}\n    </Flex>\n  );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * HeaderCheckboxCell\n * -----------------------------------------------------------------------------------------------*/\n\nconst HeaderCheckboxCell = () => {\n  const rows = useTable('HeaderCheckboxCell', (state) => state.rows);\n  const selectedRows = useTable('HeaderCheckboxCell', (state) => state.selectedRows);\n  const selectRow = useTable('HeaderCheckboxCell', (state) => state.selectRow);\n  const setHasHeaderCheckbox = useTable(\n    'HeaderCheckboxCell',\n    (state) => state.setHasHeaderCheckbox\n  );\n\n  const { formatMessage } = useIntl();\n\n  const areAllEntriesSelected = selectedRows.length === rows.length && rows.length > 0;\n  const isIndeterminate = !areAllEntriesSelected && selectedRows.length > 0;\n\n  React.useEffect(() => {\n    setHasHeaderCheckbox(true);\n\n    return () => setHasHeaderCheckbox(false);\n  }, [setHasHeaderCheckbox]);\n\n  const handleSelectAll = () => {\n    if (!areAllEntriesSelected) {\n      selectRow(rows);\n    } else {\n      selectRow([]);\n    }\n  };\n\n  return (\n    <Th>\n      <Checkbox\n        aria-label={formatMessage({\n          id: 'global.select-all-entries',\n          defaultMessage: 'Select all entries',\n        })}\n        disabled={rows.length === 0}\n        checked={isIndeterminate ? 'indeterminate' : areAllEntriesSelected}\n        onCheckedChange={handleSelectAll}\n      />\n    </Th>\n  );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * Empty\n * -----------------------------------------------------------------------------------------------*/\n\nconst Empty = (props: Table.EmptyProps) => {\n  const { formatMessage } = useIntl();\n\n  const rows = useTable('Empty', (state) => state.rows);\n  const isLoading = useTable('Empty', (state) => state.isLoading);\n  const colCount = useTable('Empty', (state) => state.colCount);\n\n  /**\n   * If we're loading or we have some data, we don't show the empty state.\n   */\n  if (rows.length > 0 || isLoading) {\n    return null;\n  }\n\n  return (\n    <Tbody>\n      <Tr>\n        <Td colSpan={colCount}>\n          <EmptyStateLayout\n            content={formatMessage({\n              id: 'app.components.EmptyStateLayout.content-document',\n              defaultMessage: 'No content found',\n            })}\n            hasRadius\n            icon={<EmptyDocuments width=\"16rem\" />}\n            {...props}\n          />\n        </Td>\n      </Tr>\n    </Tbody>\n  );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * LoadingBody\n * -----------------------------------------------------------------------------------------------*/\n\nconst Loading = ({ children = 'Loading content' }: Table.LoadingProps) => {\n  const isLoading = useTable('Loading', (state) => state.isLoading);\n  const colCount = useTable('Loading', (state) => state.colCount);\n\n  if (!isLoading) {\n    return null;\n  }\n\n  return (\n    <Tbody>\n      <Tr>\n        <Td colSpan={colCount}>\n          <Flex justifyContent=\"center\" padding={11} background=\"neutral0\">\n            <Loader>{children}</Loader>\n          </Flex>\n        </Td>\n      </Tr>\n    </Tbody>\n  );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * Body\n * -----------------------------------------------------------------------------------------------*/\n\nconst Body = ({ children }: Table.BodyProps) => {\n  const isLoading = useTable('Body', (state) => state.isLoading);\n  const rows = useTable('Body', (state) => state.rows);\n\n  if (isLoading || rows.length === 0) {\n    return null;\n  }\n\n  return <Tbody>{children}</Tbody>;\n};\n\n/* -------------------------------------------------------------------------------------------------\n * Row\n * -----------------------------------------------------------------------------------------------*/\nconst Row = (props: Table.RowProps) => {\n  return <Tr {...props} />;\n};\n\n/* -------------------------------------------------------------------------------------------------\n * Cell\n * -----------------------------------------------------------------------------------------------*/\nconst Cell = (props: Table.CellProps) => {\n  return <Td {...props} />;\n};\n\n/* -------------------------------------------------------------------------------------------------\n * Row\n * -----------------------------------------------------------------------------------------------*/\nconst CheckboxCell = ({ id, ...props }: Table.CheckboxCellProps) => {\n  const rows = useTable('CheckboxCell', (state) => state.rows);\n  const selectedRows = useTable('CheckboxCell', (state) => state.selectedRows);\n  const selectRow = useTable('CheckboxCell', (state) => state.selectRow);\n\n  const { formatMessage } = useIntl();\n\n  const handleSelectRow = () => {\n    selectRow(rows.find((row) => row.id === id));\n  };\n\n  const isChecked = selectedRows.findIndex((row) => row.id === id) > -1;\n\n  return (\n    <Cell {...props} onClick={(e) => e.stopPropagation()}>\n      <Checkbox\n        aria-label={formatMessage(\n          {\n            id: 'app.component.table.select.one-entry',\n            defaultMessage: `Select {target}`,\n          },\n          { target: id }\n        )}\n        disabled={rows.length === 0}\n        checked={isChecked}\n        onCheckedChange={handleSelectRow}\n      />\n    </Cell>\n  );\n};\n/* -------------------------------------------------------------------------------------------------\n * Exports\n * -----------------------------------------------------------------------------------------------*/\n\n/**\n * @alpha we may move this component to the design-system.\n * @public\n * @description A generic table component composition. Internally handles the state of the table\n * such as selected rows, loading state, and more assuming the correct pieces are put togther.\n * @example\n * ```tsx\n * interace Data {\n *  id: string;\n *  name: string;\n *  email: string;\n * }\n *\n * const ListView = () => {\n *  const { data, isLoading } = useGetData<Data>();\n *\n *  const headers: Table.Header<Data>[] = [\n *    {\n *      label: 'Name',\n *      name: 'name',\n *      sortable: true,\n *    },\n *    {\n *      label: 'Email',\n *      name: 'email',\n *      sortable: true,\n *    },\n *  ];\n *\n *  return (\n *    <Table.Root rows={data} headers={headers} isLoading={isLoading}>\n *      <Table.Content>\n *        <Table.Head>\n *          {headers.map((head) => (\n *            <Table.HeaderCell key={head.name} {...head} />\n *          ))}\n *        </Table.Head>\n *        <Table.Body>\n *          <Table.Loading />\n *          <Table.Empty />\n *          {data.map((row) => (\n *            <Table.Row key={row.id}>\n *              <Table.Cell>{row.name}</Table.Cell>\n *              <Table.Cell>{row.email}</Table.Cell>\n *            </Table.Row>\n *          ))}\n *        </Table.Body>\n *      </Table.Content>\n *    </Table.Root>\n *  );\n * };\n * ```\n */\nconst Table = {\n  Root,\n  Content,\n  ActionBar,\n  Head,\n  HeaderCell,\n  HeaderCheckboxCell,\n  Body,\n  CheckboxCell,\n  Cell,\n  Row,\n  Loading,\n  Empty,\n};\n\n// eslint-disable-next-line @typescript-eslint/no-namespace\nnamespace Table {\n  export type Props<\n    TData extends BaseRow,\n    THeader extends TableHeader<TData, THeader> = TableHeader<TData, TableHeader>,\n  > = RootProps<TData, THeader>;\n  export interface ActionBarProps {\n    children?: React.ReactNode;\n  }\n\n  export interface ContentProps {\n    children: React.ReactNode;\n  }\n\n  export type Header<TData, THeader> = TableHeader<TData, THeader>;\n\n  export interface HeadProps {\n    children: React.ReactNode;\n  }\n\n  export interface EmptyProps extends Partial<EmptyStateLayoutProps> {}\n\n  export interface LoadingProps {\n    children?: React.ReactNode;\n  }\n\n  export interface BodyProps {\n    children: React.ReactNode;\n  }\n\n  export interface RowProps extends RawTrProps {}\n\n  export interface CellProps extends RawTdProps {}\n\n  export interface CheckboxCellProps extends Pick<BaseRow, 'id'>, Omit<RawTdProps, 'id'> {}\n}\n\nexport { Table, useTable };\n"],"names":["TableProvider","useTable","createContext","Root","children","defaultSelectedRows","footer","headers","isLoading","onSelectedRowsChange","rows","selectedRows","selectedRowsProps","setSelectedRows","useControllableState","prop","defaultProp","onChange","hasHeaderCheckbox","setHasHeaderCheckbox","React","useState","rowCount","length","colCount","selectRow","row","Array","isArray","prev","currentRowIndex","findIndex","r","id","toSpliced","_jsx","Content","state","DSTable","Head","Thead","Tr","HeaderCell","name","label","sortable","query","setQuery","useQueryParams","sort","sortBy","sortOrder","split","formatMessage","useIntl","isSorted","sortLabel","defaultMessage","handleClickSort","Th","action","IconButton","onClick","variant","SortIcon","$isUp","Tooltip","Typography","textColor","tag","styled","CaretDown","ActionBar","_jsxs","Flex","gap","number","HeaderCheckboxCell","areAllEntriesSelected","isIndeterminate","useEffect","handleSelectAll","Checkbox","aria-label","disabled","checked","onCheckedChange","Empty","props","Tbody","Td","colSpan","EmptyStateLayout","content","hasRadius","icon","EmptyDocuments","width","Loading","justifyContent","padding","background","Loader","Body","Row","Cell","CheckboxCell","handleSelectRow","find","isChecked","e","stopPropagation","target","Table"],"mappings":"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"}
+{"version":3,"file":"Table.js","sources":["../../../../../admin/src/components/Table.tsx"],"sourcesContent":["/**\n * TODO: honestly, half of this stuff should come straight from\n * the design-system and then we can just wrap round the bits for\n * the i18n & router interactions.\n *\n * So we'll do that in v2 of the DS.\n */\n\nimport * as React from 'react';\n\nimport {\n  Flex,\n  Typography,\n  Th,\n  Tbody,\n  Td,\n  Tooltip,\n  IconButton,\n  Thead,\n  Tr,\n  RawTrProps,\n  Checkbox,\n  Loader,\n  Table as DSTable,\n  EmptyStateLayout,\n  EmptyStateLayoutProps,\n  TableProps,\n  RawTdProps,\n} from '@strapi/design-system';\nimport { CaretDown } from '@strapi/icons';\nimport { EmptyDocuments } from '@strapi/icons/symbols';\nimport { useIntl } from 'react-intl';\nimport { styled } from 'styled-components';\n\nimport { useControllableState } from '../hooks/useControllableState';\nimport { useQueryParams } from '../hooks/useQueryParams';\n\nimport { createContext } from './Context';\n\n/* -------------------------------------------------------------------------------------------------\n * Root\n * -----------------------------------------------------------------------------------------------*/\n\ninterface BaseRow {\n  id: string | number;\n  [key: string]: any;\n}\n\ninterface TableHeader<TData = object, THeader = object> {\n  /**\n   * Typically used by plugins to render a custom cell\n   */\n  cellFormatter?: (data: TData, header: Omit<THeader, 'cellFormatter'>) => React.ReactNode;\n  label: string;\n  name: string;\n  searchable?: boolean;\n  sortable?: boolean;\n}\n\ninterface TableContextValue<TRow extends BaseRow, THeader extends TableHeader<TRow, THeader>>\n  extends Pick<TableProps, 'footer'> {\n  colCount: number;\n  hasHeaderCheckbox: boolean;\n  headers: THeader[];\n  isLoading: boolean;\n  rowCount: number;\n  rows: TRow[];\n  setHasHeaderCheckbox: (value: boolean) => void;\n  selectedRows: TRow[];\n  selectRow: (row: TRow | TRow[]) => void;\n}\n\nconst [TableProvider, useTable] = createContext<TableContextValue<any, any>>('Table');\n\ninterface RootProps<TRow extends BaseRow, THeader extends TableHeader<TRow, THeader>>\n  extends Partial<\n    Pick<\n      TableContextValue<TRow, THeader>,\n      'footer' | 'headers' | 'isLoading' | 'rows' | 'selectedRows'\n    >\n  > {\n  children?: React.ReactNode;\n  defaultSelectedRows?: TRow[];\n  onSelectedRowsChange?: (selectedRows: TRow[]) => void;\n}\n\nconst Root = <TRow extends BaseRow, THeader extends TableHeader<TRow, THeader>>({\n  children,\n  defaultSelectedRows,\n  footer,\n  headers = [],\n  isLoading = false,\n  onSelectedRowsChange,\n  rows = [],\n  selectedRows: selectedRowsProps,\n}: RootProps<TRow, THeader>) => {\n  const [selectedRows = [], setSelectedRows] = useControllableState({\n    prop: selectedRowsProps,\n    defaultProp: defaultSelectedRows,\n    onChange: onSelectedRowsChange,\n  });\n  const [hasHeaderCheckbox, setHasHeaderCheckbox] = React.useState(false);\n\n  const rowCount = rows.length + 1;\n  const colCount = hasHeaderCheckbox ? headers.length + 1 : headers.length;\n\n  const selectRow: TableContextValue<TRow, THeader>['selectRow'] = (row) => {\n    if (Array.isArray(row)) {\n      setSelectedRows(row);\n    } else {\n      setSelectedRows((prev = []) => {\n        const currentRowIndex = prev.findIndex((r) => r.id === row.id);\n        if (currentRowIndex > -1) {\n          return prev.toSpliced(currentRowIndex, 1);\n        }\n\n        return [...prev, row];\n      });\n    }\n  };\n\n  return (\n    <TableProvider\n      colCount={colCount}\n      hasHeaderCheckbox={hasHeaderCheckbox}\n      setHasHeaderCheckbox={setHasHeaderCheckbox}\n      footer={footer}\n      headers={headers}\n      isLoading={isLoading}\n      rowCount={rowCount}\n      rows={rows}\n      selectedRows={selectedRows}\n      selectRow={selectRow}\n    >\n      {children}\n    </TableProvider>\n  );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * Content\n * -----------------------------------------------------------------------------------------------*/\n\nconst Content = ({ children }: Table.ContentProps) => {\n  const rowCount = useTable('Content', (state) => state.rowCount);\n  const colCount = useTable('Content', (state) => state.colCount);\n  const footer = useTable('Content', (state) => state.footer);\n\n  return (\n    <DSTable rowCount={rowCount} colCount={colCount} footer={footer}>\n      {children}\n    </DSTable>\n  );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * Head\n * -----------------------------------------------------------------------------------------------*/\n\nconst Head = ({ children }: Table.HeadProps) => {\n  return (\n    <Thead>\n      <Tr>{children}</Tr>\n    </Thead>\n  );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * HeaderCell\n * -----------------------------------------------------------------------------------------------*/\n\n/**\n * @description A header cell in your table, internally will set the query params for sorting to\n * be passed to your data-fetching function.\n */\nconst HeaderCell = <TData, THead>({ name, label, sortable }: TableHeader<TData, THead>) => {\n  const [{ query }, setQuery] = useQueryParams<{ sort?: `${string}:${'ASC' | 'DESC'}` }>();\n  const sort = query?.sort ?? '';\n  const [sortBy, sortOrder] = sort.split(':');\n  const { formatMessage } = useIntl();\n  const isSorted = sortBy === name;\n\n  const sortLabel = formatMessage(\n    { id: 'components.TableHeader.sort', defaultMessage: 'Sort on {label}' },\n    { label }\n  );\n\n  const handleClickSort = () => {\n    if (sortable) {\n      setQuery({\n        sort: `${name}:${isSorted && sortOrder === 'ASC' ? 'DESC' : 'ASC'}`,\n      });\n    }\n  };\n\n  return (\n    <Th\n      action={\n        isSorted &&\n        sortable && (\n          <IconButton label={sortLabel} onClick={handleClickSort} variant=\"ghost\">\n            <SortIcon $isUp={sortOrder === 'ASC'} />\n          </IconButton>\n        )\n      }\n    >\n      <Tooltip label={sortable ? sortLabel : label}>\n        <Typography\n          textColor=\"neutral600\"\n          tag={!isSorted && sortable ? 'button' : 'span'}\n          onClick={handleClickSort}\n          variant=\"sigma\"\n        >\n          {label}\n        </Typography>\n      </Tooltip>\n    </Th>\n  );\n};\n\nconst SortIcon = styled(CaretDown)<{\n  $isUp: boolean;\n}>`\n  transform: ${({ $isUp }) => `rotate(${$isUp ? '180' : '0'}deg)`};\n`;\n\n/* -------------------------------------------------------------------------------------------------\n * ActionBar\n * -----------------------------------------------------------------------------------------------*/\n\nconst ActionBar = ({ children }: Table.ActionBarProps) => {\n  const { formatMessage } = useIntl();\n  const selectedRows = useTable('ActionBar', (state) => state.selectedRows);\n\n  if (selectedRows.length === 0) return null;\n\n  return (\n    <Flex gap={2}>\n      <Typography variant=\"omega\" textColor=\"neutral500\">\n        {formatMessage(\n          {\n            id: 'content-manager.components.TableDelete.label',\n            defaultMessage: '{number, plural, one {# row} other {# rows}} selected',\n          },\n          { number: selectedRows.length }\n        )}\n      </Typography>\n      {children}\n    </Flex>\n  );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * HeaderCheckboxCell\n * -----------------------------------------------------------------------------------------------*/\n\nconst HeaderCheckboxCell = () => {\n  const rows = useTable('HeaderCheckboxCell', (state) => state.rows);\n  const selectedRows = useTable('HeaderCheckboxCell', (state) => state.selectedRows);\n  const selectRow = useTable('HeaderCheckboxCell', (state) => state.selectRow);\n  const setHasHeaderCheckbox = useTable(\n    'HeaderCheckboxCell',\n    (state) => state.setHasHeaderCheckbox\n  );\n\n  const { formatMessage } = useIntl();\n\n  const areAllEntriesSelected = selectedRows.length === rows.length && rows.length > 0;\n  const isIndeterminate = !areAllEntriesSelected && selectedRows.length > 0;\n\n  React.useEffect(() => {\n    setHasHeaderCheckbox(true);\n\n    return () => setHasHeaderCheckbox(false);\n  }, [setHasHeaderCheckbox]);\n\n  const handleSelectAll = () => {\n    if (!areAllEntriesSelected) {\n      selectRow(rows);\n    } else {\n      selectRow([]);\n    }\n  };\n\n  return (\n    <Th>\n      <Checkbox\n        aria-label={formatMessage({\n          id: 'global.select-all-entries',\n          defaultMessage: 'Select all entries',\n        })}\n        disabled={rows.length === 0}\n        checked={isIndeterminate ? 'indeterminate' : areAllEntriesSelected}\n        onCheckedChange={handleSelectAll}\n      />\n    </Th>\n  );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * Empty\n * -----------------------------------------------------------------------------------------------*/\n\nconst Empty = (props: Table.EmptyProps) => {\n  const { formatMessage } = useIntl();\n\n  const rows = useTable('Empty', (state) => state.rows);\n  const isLoading = useTable('Empty', (state) => state.isLoading);\n  const colCount = useTable('Empty', (state) => state.colCount);\n\n  /**\n   * If we're loading or we have some data, we don't show the empty state.\n   */\n  if (rows.length > 0 || isLoading) {\n    return null;\n  }\n\n  return (\n    <Tbody>\n      <Tr>\n        <Td colSpan={colCount}>\n          <EmptyStateLayout\n            content={formatMessage({\n              id: 'app.components.EmptyStateLayout.content-document',\n              defaultMessage: 'No content found',\n            })}\n            hasRadius\n            icon={<EmptyDocuments width=\"16rem\" />}\n            {...props}\n          />\n        </Td>\n      </Tr>\n    </Tbody>\n  );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * LoadingBody\n * -----------------------------------------------------------------------------------------------*/\n\nconst Loading = ({ children = 'Loading content' }: Table.LoadingProps) => {\n  const isLoading = useTable('Loading', (state) => state.isLoading);\n  const colCount = useTable('Loading', (state) => state.colCount);\n\n  if (!isLoading) {\n    return null;\n  }\n\n  return (\n    <Tbody>\n      <Tr>\n        <Td colSpan={colCount}>\n          <Flex justifyContent=\"center\" padding={11} background=\"neutral0\">\n            <Loader>{children}</Loader>\n          </Flex>\n        </Td>\n      </Tr>\n    </Tbody>\n  );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * Body\n * -----------------------------------------------------------------------------------------------*/\n\nconst Body = ({ children }: Table.BodyProps) => {\n  const isLoading = useTable('Body', (state) => state.isLoading);\n  const rows = useTable('Body', (state) => state.rows);\n\n  if (isLoading || rows.length === 0) {\n    return null;\n  }\n\n  return <Tbody>{children}</Tbody>;\n};\n\n/* -------------------------------------------------------------------------------------------------\n * Row\n * -----------------------------------------------------------------------------------------------*/\nconst Row = (props: Table.RowProps) => {\n  return <Tr {...props} />;\n};\n\n/* -------------------------------------------------------------------------------------------------\n * Cell\n * -----------------------------------------------------------------------------------------------*/\nconst Cell = (props: Table.CellProps) => {\n  return <Td {...props} />;\n};\n\n/* -------------------------------------------------------------------------------------------------\n * Row\n * -----------------------------------------------------------------------------------------------*/\nconst CheckboxCell = ({ id, ...props }: Table.CheckboxCellProps) => {\n  const rows = useTable('CheckboxCell', (state) => state.rows);\n  const selectedRows = useTable('CheckboxCell', (state) => state.selectedRows);\n  const selectRow = useTable('CheckboxCell', (state) => state.selectRow);\n\n  const { formatMessage } = useIntl();\n\n  const handleSelectRow = () => {\n    selectRow(rows.find((row) => row.id === id));\n  };\n\n  const isChecked = selectedRows.findIndex((row) => row.id === id) > -1;\n\n  return (\n    <Cell {...props} onClick={(e) => e.stopPropagation()}>\n      <Checkbox\n        aria-label={formatMessage(\n          {\n            id: 'app.component.table.select.one-entry',\n            defaultMessage: `Select {target}`,\n          },\n          { target: id }\n        )}\n        disabled={rows.length === 0}\n        checked={isChecked}\n        onCheckedChange={handleSelectRow}\n      />\n    </Cell>\n  );\n};\n/* -------------------------------------------------------------------------------------------------\n * Exports\n * -----------------------------------------------------------------------------------------------*/\n\n/**\n * @alpha we may move this component to the design-system.\n * @public\n * @description A generic table component composition. Internally handles the state of the table\n * such as selected rows, loading state, and more assuming the correct pieces are put togther.\n * @example\n * ```tsx\n * interace Data {\n *  id: string;\n *  name: string;\n *  email: string;\n * }\n *\n * const ListView = () => {\n *  const { data, isLoading } = useGetData<Data>();\n *\n *  const headers: Table.Header<Data>[] = [\n *    {\n *      label: 'Name',\n *      name: 'name',\n *      sortable: true,\n *    },\n *    {\n *      label: 'Email',\n *      name: 'email',\n *      sortable: true,\n *    },\n *  ];\n *\n *  return (\n *    <Table.Root rows={data} headers={headers} isLoading={isLoading}>\n *      <Table.Content>\n *        <Table.Head>\n *          {headers.map((head) => (\n *            <Table.HeaderCell key={head.name} {...head} />\n *          ))}\n *        </Table.Head>\n *        <Table.Body>\n *          <Table.Loading />\n *          <Table.Empty />\n *          {data.map((row) => (\n *            <Table.Row key={row.id}>\n *              <Table.Cell>{row.name}</Table.Cell>\n *              <Table.Cell>{row.email}</Table.Cell>\n *            </Table.Row>\n *          ))}\n *        </Table.Body>\n *      </Table.Content>\n *    </Table.Root>\n *  );\n * };\n * ```\n */\nconst Table = {\n  Root,\n  Content,\n  ActionBar,\n  Head,\n  HeaderCell,\n  HeaderCheckboxCell,\n  Body,\n  CheckboxCell,\n  Cell,\n  Row,\n  Loading,\n  Empty,\n};\n\n// eslint-disable-next-line @typescript-eslint/no-namespace\nnamespace Table {\n  export type Props<\n    TData extends BaseRow,\n    THeader extends TableHeader<TData, THeader> = TableHeader<TData, TableHeader>,\n  > = RootProps<TData, THeader>;\n  export interface ActionBarProps {\n    children?: React.ReactNode;\n  }\n\n  export interface ContentProps {\n    children: React.ReactNode;\n  }\n\n  export type Header<TData, THeader> = TableHeader<TData, THeader>;\n\n  export interface HeadProps {\n    children: React.ReactNode;\n  }\n\n  export interface EmptyProps extends Partial<EmptyStateLayoutProps> {}\n\n  export interface LoadingProps {\n    children?: React.ReactNode;\n  }\n\n  export interface BodyProps {\n    children: React.ReactNode;\n  }\n\n  export interface RowProps extends RawTrProps {}\n\n  export interface CellProps extends RawTdProps {}\n\n  export interface CheckboxCellProps extends Pick<BaseRow, 'id'>, Omit<RawTdProps, 'id'> {}\n}\n\nexport { Table, useTable };\n"],"names":["TableProvider","useTable","createContext","Root","children","defaultSelectedRows","footer","headers","isLoading","onSelectedRowsChange","rows","selectedRows","selectedRowsProps","setSelectedRows","useControllableState","prop","defaultProp","onChange","hasHeaderCheckbox","setHasHeaderCheckbox","React","useState","rowCount","length","colCount","selectRow","row","Array","isArray","prev","currentRowIndex","findIndex","r","id","toSpliced","_jsx","Content","state","DSTable","Head","Thead","Tr","HeaderCell","name","label","sortable","query","setQuery","useQueryParams","sort","sortBy","sortOrder","split","formatMessage","useIntl","isSorted","sortLabel","defaultMessage","handleClickSort","Th","action","IconButton","onClick","variant","SortIcon","$isUp","Tooltip","Typography","textColor","tag","styled","CaretDown","ActionBar","_jsxs","Flex","gap","number","HeaderCheckboxCell","areAllEntriesSelected","isIndeterminate","useEffect","handleSelectAll","Checkbox","aria-label","disabled","checked","onCheckedChange","Empty","props","Tbody","Td","colSpan","EmptyStateLayout","content","hasRadius","icon","EmptyDocuments","width","Loading","justifyContent","padding","background","Loader","Body","Row","Cell","CheckboxCell","handleSelectRow","find","isChecked","e","stopPropagation","target","Table"],"mappings":"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"}

package/dist/admin/admin/src/components/Theme.js

@@ -5,7 +5,7 @@ var React = require('react');
 var designSystem = require('@strapi/design-system');
 var reactIntl = require('react-intl');
 var reactRedux = require('react-redux');
-var styledComponents = require('styled-components');
+var styled = require('styled-components');
 var hooks = require('../core/store/hooks.js');
 var reducer = require('../reducer.js');
 
@@ -66,7 +66,7 @@ const Theme = ({ children, themes })=>{
         ]
     });
 };
-const GlobalStyle = styledComponents.createGlobalStyle`
+const GlobalStyle = styled.createGlobalStyle`
   body {
     background: ${({ theme })=>theme.colors.neutral100};
   }

package/dist/admin/admin/src/components/Theme.js.map

@@ -1 +1 @@
-{"version":3,"file":"Theme.js","sources":["../../../../../admin/src/components/Theme.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { DesignSystemProvider } from '@strapi/design-system';\nimport { useIntl } from 'react-intl';\nimport { useDispatch } from 'react-redux';\nimport { DefaultTheme, createGlobalStyle } from 'styled-components';\n\nimport { useTypedSelector } from '../core/store/hooks';\nimport { setAvailableThemes } from '../reducer';\n\ninterface ThemeProps {\n  children: React.ReactNode;\n  themes: {\n    dark: DefaultTheme;\n    light: DefaultTheme;\n  };\n}\n\nconst Theme = ({ children, themes }: ThemeProps) => {\n  const { currentTheme } = useTypedSelector((state) => state.admin_app.theme);\n  const [systemTheme, setSystemTheme] = React.useState<'light' | 'dark'>();\n  const { locale } = useIntl();\n  const dispatch = useDispatch();\n\n  // Listen to changes in the system theme\n  React.useEffect(() => {\n    const themeWatcher = window.matchMedia('(prefers-color-scheme: dark)');\n    setSystemTheme(themeWatcher.matches ? 'dark' : 'light');\n\n    const listener = (event: MediaQueryListEvent) => {\n      setSystemTheme(event.matches ? 'dark' : 'light');\n    };\n    themeWatcher.addEventListener('change', listener);\n\n    // Remove listener on cleanup\n    return () => {\n      themeWatcher.removeEventListener('change', listener);\n    };\n  }, []);\n\n  React.useEffect(() => {\n    dispatch(setAvailableThemes(Object.keys(themes)));\n  }, [dispatch, themes]);\n\n  const computedThemeName = currentTheme === 'system' ? systemTheme : currentTheme;\n\n  return (\n    <DesignSystemProvider\n      locale={locale}\n      /**\n       * TODO: could we make this neater i.e. by setting up the context to throw\n       * if it can't find it, that way the type is always fully defined and we're\n       * not checking it all the time...\n       */\n      theme={themes?.[computedThemeName || 'light']}\n    >\n      {children}\n      <GlobalStyle />\n    </DesignSystemProvider>\n  );\n};\n\nconst GlobalStyle = createGlobalStyle`\n  body {\n    background: ${({ theme }) => theme.colors.neutral100};\n  }\n`;\n\nexport { Theme };\nexport type { ThemeProps };\n"],"names":["Theme","children","themes","currentTheme","useTypedSelector","state","admin_app","theme","systemTheme","setSystemTheme","React","useState","locale","useIntl","dispatch","useDispatch","useEffect","themeWatcher","window","matchMedia","matches","listener","event","addEventListener","removeEventListener","setAvailableThemes","Object","keys","computedThemeName","_jsxs","DesignSystemProvider","_jsx","GlobalStyle","createGlobalStyle","colors","neutral100"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkBA,MAAMA,QAAQ,CAAC,EAAEC,QAAQ,EAAEC,MAAM,EAAc,GAAA;IAC7C,MAAM,EAAEC,YAAY,EAAE,GAAGC,sBAAAA,CAAiB,CAACC,KAAUA,GAAAA,KAAAA,CAAMC,SAAS,CAACC,KAAK,CAAA;AAC1E,IAAA,MAAM,CAACC,WAAAA,EAAaC,cAAe,CAAA,GAAGC,iBAAMC,QAAQ,EAAA;IACpD,MAAM,EAAEC,MAAM,EAAE,GAAGC,iBAAAA,EAAAA;AACnB,IAAA,MAAMC,QAAWC,GAAAA,sBAAAA,EAAAA;;AAGjBL,IAAAA,gBAAAA,CAAMM,SAAS,CAAC,IAAA;QACd,MAAMC,YAAAA,GAAeC,MAAOC,CAAAA,UAAU,CAAC,8BAAA,CAAA;QACvCV,cAAeQ,CAAAA,YAAAA,CAAaG,OAAO,GAAG,MAAS,GAAA,OAAA,CAAA;AAE/C,QAAA,MAAMC,WAAW,CAACC,KAAAA,GAAAA;YAChBb,cAAea,CAAAA,KAAAA,CAAMF,OAAO,GAAG,MAAS,GAAA,OAAA,CAAA;AAC1C,SAAA;QACAH,YAAaM,CAAAA,gBAAgB,CAAC,QAAUF,EAAAA,QAAAA,CAAAA;;QAGxC,OAAO,IAAA;YACLJ,YAAaO,CAAAA,mBAAmB,CAAC,QAAUH,EAAAA,QAAAA,CAAAA;AAC7C,SAAA;AACF,KAAA,EAAG,EAAE,CAAA;AAELX,IAAAA,gBAAAA,CAAMM,SAAS,CAAC,IAAA;QACdF,QAASW,CAAAA,0BAAAA,CAAmBC,MAAOC,CAAAA,IAAI,CAACzB,MAAAA,CAAAA,CAAAA,CAAAA;KACvC,EAAA;AAACY,QAAAA,QAAAA;AAAUZ,QAAAA;AAAO,KAAA,CAAA;IAErB,MAAM0B,iBAAAA,GAAoBzB,YAAiB,KAAA,QAAA,GAAWK,WAAcL,GAAAA,YAAAA;AAEpE,IAAA,qBACE0B,eAACC,CAAAA,iCAAAA,EAAAA;QACClB,MAAQA,EAAAA,MAAAA;AACR;;;;AAIC,UACDL,KAAOL,EAAAA,MAAAA,GAAS0B,iBAAAA,IAAqB,OAAQ,CAAA;;AAE5C3B,YAAAA,QAAAA;0BACD8B,cAACC,CAAAA,WAAAA,EAAAA,EAAAA;;;AAGP;AAEA,MAAMA,WAAAA,GAAcC,kCAAiB;;gBAErB,EAAE,CAAC,EAAE1B,KAAK,EAAE,GAAKA,KAAM2B,CAAAA,MAAM,CAACC,UAAU,CAAC;;AAEzD,CAAC;;;;"}
+{"version":3,"file":"Theme.js","sources":["../../../../../admin/src/components/Theme.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { DesignSystemProvider } from '@strapi/design-system';\nimport { useIntl } from 'react-intl';\nimport { useDispatch } from 'react-redux';\nimport { DefaultTheme, createGlobalStyle } from 'styled-components';\n\nimport { useTypedSelector } from '../core/store/hooks';\nimport { setAvailableThemes } from '../reducer';\n\ninterface ThemeProps {\n  children: React.ReactNode;\n  themes: {\n    dark: DefaultTheme;\n    light: DefaultTheme;\n  };\n}\n\nconst Theme = ({ children, themes }: ThemeProps) => {\n  const { currentTheme } = useTypedSelector((state) => state.admin_app.theme);\n  const [systemTheme, setSystemTheme] = React.useState<'light' | 'dark'>();\n  const { locale } = useIntl();\n  const dispatch = useDispatch();\n\n  // Listen to changes in the system theme\n  React.useEffect(() => {\n    const themeWatcher = window.matchMedia('(prefers-color-scheme: dark)');\n    setSystemTheme(themeWatcher.matches ? 'dark' : 'light');\n\n    const listener = (event: MediaQueryListEvent) => {\n      setSystemTheme(event.matches ? 'dark' : 'light');\n    };\n    themeWatcher.addEventListener('change', listener);\n\n    // Remove listener on cleanup\n    return () => {\n      themeWatcher.removeEventListener('change', listener);\n    };\n  }, []);\n\n  React.useEffect(() => {\n    dispatch(setAvailableThemes(Object.keys(themes)));\n  }, [dispatch, themes]);\n\n  const computedThemeName = currentTheme === 'system' ? systemTheme : currentTheme;\n\n  return (\n    <DesignSystemProvider\n      locale={locale}\n      /**\n       * TODO: could we make this neater i.e. by setting up the context to throw\n       * if it can't find it, that way the type is always fully defined and we're\n       * not checking it all the time...\n       */\n      theme={themes?.[computedThemeName || 'light']}\n    >\n      {children}\n      <GlobalStyle />\n    </DesignSystemProvider>\n  );\n};\n\nconst GlobalStyle = createGlobalStyle`\n  body {\n    background: ${({ theme }) => theme.colors.neutral100};\n  }\n`;\n\nexport { Theme };\nexport type { ThemeProps };\n"],"names":["Theme","children","themes","currentTheme","useTypedSelector","state","admin_app","theme","systemTheme","setSystemTheme","React","useState","locale","useIntl","dispatch","useDispatch","useEffect","themeWatcher","window","matchMedia","matches","listener","event","addEventListener","removeEventListener","setAvailableThemes","Object","keys","computedThemeName","_jsxs","DesignSystemProvider","_jsx","GlobalStyle","createGlobalStyle","colors","neutral100"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkBA,MAAMA,QAAQ,CAAC,EAAEC,QAAQ,EAAEC,MAAM,EAAc,GAAA;IAC7C,MAAM,EAAEC,YAAY,EAAE,GAAGC,sBAAAA,CAAiB,CAACC,KAAUA,GAAAA,KAAAA,CAAMC,SAAS,CAACC,KAAK,CAAA;AAC1E,IAAA,MAAM,CAACC,WAAAA,EAAaC,cAAe,CAAA,GAAGC,iBAAMC,QAAQ,EAAA;IACpD,MAAM,EAAEC,MAAM,EAAE,GAAGC,iBAAAA,EAAAA;AACnB,IAAA,MAAMC,QAAWC,GAAAA,sBAAAA,EAAAA;;AAGjBL,IAAAA,gBAAAA,CAAMM,SAAS,CAAC,IAAA;QACd,MAAMC,YAAAA,GAAeC,MAAOC,CAAAA,UAAU,CAAC,8BAAA,CAAA;QACvCV,cAAeQ,CAAAA,YAAAA,CAAaG,OAAO,GAAG,MAAS,GAAA,OAAA,CAAA;AAE/C,QAAA,MAAMC,WAAW,CAACC,KAAAA,GAAAA;YAChBb,cAAea,CAAAA,KAAAA,CAAMF,OAAO,GAAG,MAAS,GAAA,OAAA,CAAA;AAC1C,SAAA;QACAH,YAAaM,CAAAA,gBAAgB,CAAC,QAAUF,EAAAA,QAAAA,CAAAA;;QAGxC,OAAO,IAAA;YACLJ,YAAaO,CAAAA,mBAAmB,CAAC,QAAUH,EAAAA,QAAAA,CAAAA;AAC7C,SAAA;AACF,KAAA,EAAG,EAAE,CAAA;AAELX,IAAAA,gBAAAA,CAAMM,SAAS,CAAC,IAAA;QACdF,QAASW,CAAAA,0BAAAA,CAAmBC,MAAOC,CAAAA,IAAI,CAACzB,MAAAA,CAAAA,CAAAA,CAAAA;KACvC,EAAA;AAACY,QAAAA,QAAAA;AAAUZ,QAAAA;AAAO,KAAA,CAAA;IAErB,MAAM0B,iBAAAA,GAAoBzB,YAAiB,KAAA,QAAA,GAAWK,WAAcL,GAAAA,YAAAA;AAEpE,IAAA,qBACE0B,eAACC,CAAAA,iCAAAA,EAAAA;QACClB,MAAQA,EAAAA,MAAAA;AACR;;;;AAIC,UACDL,KAAOL,EAAAA,MAAAA,GAAS0B,iBAAAA,IAAqB,OAAQ,CAAA;;AAE5C3B,YAAAA,QAAAA;0BACD8B,cAACC,CAAAA,WAAAA,EAAAA,EAAAA;;;AAGP;AAEA,MAAMA,WAAAA,GAAcC,wBAAiB;;gBAErB,EAAE,CAAC,EAAE1B,KAAK,EAAE,GAAKA,KAAM2B,CAAAA,MAAM,CAACC,UAAU,CAAC;;AAEzD,CAAC;;;;"}