diff --git a/packages/app/app/layout.tsx b/packages/app/app/layout.tsx
index 4a8efb20..a17b394f 100644
--- a/packages/app/app/layout.tsx
+++ b/packages/app/app/layout.tsx
@@ -10,7 +10,13 @@ export const metadata: Metadata = {
   metadataBase: new URL(process.env.STACKLY_URL ?? defaultStacklyUrl),
   title: "Stackly | Stack crypto over time.",
   description:
-    "Stackly is a simple, non-custodial tool that uses the CoW protocol to place recurring swaps based on DCA.."
+    "Stackly is a simple, non-custodial tool that uses the CoW protocol to place recurring swaps based on DCA.",
+  viewport: {
+    width: "device-width",
+    initialScale: 1,
+    maximumScale: 1,
+    userScalable: false,
+  },
 };
 
 export default function RootLayout({ children }: PropsWithChildren) {
diff --git a/packages/app/app/ui/page.tsx b/packages/app/app/ui/page.tsx
index b3c39e42..3a358a79 100644
--- a/packages/app/app/ui/page.tsx
+++ b/packages/app/app/ui/page.tsx
@@ -22,9 +22,11 @@ import {
   HeadingText,
   OverlineText,
   DialogContent,
+  CaptionText,
+  Calendar,
 } from "@/ui";
-import { CaptionText } from "@/ui/text/CaptionText";
 import { useRef, useState } from "react";
+import { DatePicker } from "../../components/DatePicker";
 
 export default function Page() {
   //  radioButtons
diff --git a/packages/app/components/DatePicker.tsx b/packages/app/components/DatePicker.tsx
new file mode 100644
index 00000000..dc6e9942
--- /dev/null
+++ b/packages/app/components/DatePicker.tsx
@@ -0,0 +1,170 @@
+"use client";
+
+import { format, isToday, isTomorrow } from "date-fns";
+
+import { Button, Calendar, Icon } from "@/ui";
+import { Popover } from "@headlessui/react";
+
+import { Dispatch, Ref, SetStateAction, useEffect, useState } from "react";
+import { usePopper } from "react-popper";
+import { twMerge } from "tailwind-merge";
+
+interface DatePickerProps {
+  dateTime: Date;
+  setDateTime: Dispatch<SetStateAction<Date>>;
+  className?: string;
+  timeCaption: string;
+  fromDate?: Date;
+}
+
+export function DatePicker({
+  dateTime,
+  setDateTime,
+  className,
+  timeCaption,
+  fromDate,
+}: DatePickerProps) {
+  const [currentDate, setCurrentDate] = useState<Date>(new Date(dateTime));
+  const [hours, setHours] = useState(format(currentDate, "HH"));
+  const [minutes, setMinutes] = useState(format(currentDate, "mm"));
+
+  const [referenceElement, setReferenceElement] = useState<
+    HTMLButtonElement | undefined
+  >();
+  const [popperElement, setPopperElement] = useState<
+    HTMLDivElement | undefined
+  >();
+
+  const { styles, attributes } = usePopper(referenceElement, popperElement, {
+    placement: "bottom",
+  });
+
+  const formattedDate = () => {
+    if (isToday(dateTime)) return format(dateTime, "'Today at' HH:mm");
+    if (isTomorrow(dateTime)) return format(dateTime, "'Tomorrow at' HH:mm");
+
+    return format(dateTime, "dd MMM Y 'at' HH:mm");
+  };
+
+  useEffect(() => {
+    const newDate = new Date(dateTime);
+    setCurrentDate(newDate);
+    setHours(format(newDate, "HH"));
+    setMinutes(format(newDate, "mm"));
+  }, [dateTime]);
+
+  return (
+    <Popover>
+      {({ open }) => (
+        <>
+          <Popover.Button
+            ref={setReferenceElement as Ref<HTMLButtonElement>}
+            className={twMerge(
+              "flex justify-between items-center focus:border-0",
+              className
+            )}
+          >
+            <span>{formattedDate()}</span>
+            <Icon name="caret-down" className="mr-2 h-4 w-4 text-black" />
+          </Popover.Button>
+          {open && (
+            <>
+              <div className="fixed inset-0 bg-black/30" aria-hidden="true" />
+              <Popover.Panel
+                ref={setPopperElement as Ref<HTMLDivElement>}
+                style={styles.popper}
+                {...attributes.popper}
+                className="w-fit h-fit m-auto max-md:!fixed max-md:!inset-0 max-md:!flex max-md:!items-center max-md:!justify-center max-md:!transform" /* This styles will make it hover on mobile */
+              >
+                {({ close }) => (
+                  <div className="flex flex-col space-y-2 bg-white divide-y divide-surface-50 rounded-2xl border border-surface-50">
+                    <Calendar
+                      mode="single"
+                      selected={currentDate}
+                      defaultMonth={currentDate}
+                      onSelect={(newDate: Date | undefined) => {
+                        if (!newDate) return;
+                        newDate.setHours(currentDate.getHours());
+                        newDate.setMinutes(currentDate.getMinutes());
+                        setCurrentDate(newDate);
+                      }}
+                      initialFocus
+                      className=""
+                      fromDate={fromDate || new Date()}
+                    />
+                    <div className="flex flex-col space-y-2 p-4">
+                      <div className="flex justify-between items-center">
+                        <span>{timeCaption}</span>
+                        <div className="flex space-x-2  items-center">
+                          <div className="flex items-center border border-surface-75 rounded-xl py-2 px-3 text-em-low">
+                            <input
+                              className="outline-none font-semibold flex-grow text-sm w-5 text-center"
+                              type="number"
+                              pattern="[0-9]*"
+                              value={hours}
+                              onKeyDown={(evt) =>
+                                ["e", "E", "+", "-"].includes(evt.key) &&
+                                evt.preventDefault()
+                              }
+                              onChange={(event) => {
+                                const hours = event.target.value;
+                                const hoursNumber = Number(hours);
+                                if (
+                                  hoursNumber >= 0 &&
+                                  hoursNumber < 24 &&
+                                  hours.length < 3
+                                ) {
+                                  setHours(hours);
+                                }
+                              }}
+                            />
+                          </div>
+                          <span>:</span>
+                          <div className="flex items-center border border-surface-75 rounded-xl py-2 px-3 text-em-low">
+                            <input
+                              className="outline-none font-semibold flex-grow text-sm w-5 text-center"
+                              type="number"
+                              pattern="[0-9]*"
+                              value={minutes}
+                              onKeyDown={(evt) =>
+                                ["e", "E", "+", "-"].includes(evt.key) &&
+                                evt.preventDefault()
+                              }
+                              onChange={(event) => {
+                                const minutes = event.target.value;
+                                const minutesNumber = Number(minutes);
+                                if (
+                                  minutesNumber >= 0 &&
+                                  minutesNumber < 60 &&
+                                  minutes.length < 3
+                                ) {
+                                  setMinutes(minutes);
+                                }
+                              }}
+                            />
+                          </div>
+                        </div>
+                      </div>
+                      <Button
+                        action="primary"
+                        onClick={() => {
+                          const newDate = new Date(currentDate);
+                          newDate.setHours(Number(hours));
+                          newDate.setMinutes(Number(minutes));
+                          setDateTime(newDate);
+                          close();
+                        }}
+                      >
+                        Set Date and Time
+                      </Button>
+                    </div>
+                  </div>
+                )}
+              </Popover.Panel>
+            </>
+          )}
+        </>
+      )}
+    </Popover>
+  );
+}
diff --git a/packages/app/components/index.ts b/packages/app/components/index.ts
index 30a14f09..ea5bb90d 100644
--- a/packages/app/components/index.ts
+++ b/packages/app/components/index.ts
@@ -6,5 +6,6 @@ import TokenPicker from "./token-picker/TokenPicker";
 export * from "./stackbox";
 export * from "./FromToStackTokenPair";
 export * from "./TokenIcon";
+export * from "./DatePicker";
 
 export { ConnectButton, Navbar, SelectNetwork, TokenPicker };
diff --git a/packages/app/components/stackbox/Stackbox.tsx b/packages/app/components/stackbox/Stackbox.tsx
index 9b11b8e6..39a5bfa0 100644
--- a/packages/app/components/stackbox/Stackbox.tsx
+++ b/packages/app/components/stackbox/Stackbox.tsx
@@ -1,10 +1,15 @@
 "use client";
 
-import { useRef, useState } from "react";
+import { useRef, useState, useEffect } from "react";
 import { cx } from "class-variance-authority";
 
 import { BodyText, Button, Icon, RadioButton, TitleText } from "@/ui";
-import { ConfirmStackModal, TokenIcon, TokenPicker } from "@/components";
+import {
+  ConfirmStackModal,
+  TokenIcon,
+  TokenPicker,
+  DatePicker,
+} from "@/components";
 import { TokenFromTokenlist } from "@/models/token";
 
 interface SelectTokenButtonProps {
@@ -13,6 +18,28 @@ interface SelectTokenButtonProps {
   token?: TokenFromTokenlist;
 }
 
+const HOUR_OPTION = "hour";
+const DAY_OPTION = "day";
+const WEEK_OPTION = "week";
+const MONTH_OPTION = "month";
+
+const frequencyOptions = [
+  { option: HOUR_OPTION, name: "Hour" },
+  { option: DAY_OPTION, name: "Day" },
+  { option: WEEK_OPTION, name: "Week" },
+  { option: MONTH_OPTION, name: "Month" },
+];
+
+const endDateByFrequency: Record<string, number> = {
+  [HOUR_OPTION]: new Date().setDate(new Date().getDate() + 2),
+  [DAY_OPTION]: new Date().setMonth(new Date().getMonth() + 1),
+  [WEEK_OPTION]: new Date().setMonth(new Date().getMonth() + 3),
+  [MONTH_OPTION]: new Date().setFullYear(new Date().getFullYear() + 1),
+};
+const startDateTimeTimestamp = new Date().setMinutes(
+  new Date().getMinutes() + 30
+);
+
 export const Stackbox = () => {
   const searchTokenBarRef = useRef<HTMLInputElement>(null);
   const [isConfirmStackOpen, setConfirmStackIsOpen] = useState(false);
@@ -21,6 +48,15 @@ export const Stackbox = () => {
   const [tokenFrom, setTokenFrom] = useState<TokenFromTokenlist>();
   const [tokenTo, setTokenTo] = useState<TokenFromTokenlist>();
 
+  const [frequency, setFrequency] = useState<string>(HOUR_OPTION);
+
+  const [startDateTime, setStartDateTime] = useState<Date>(
+    new Date(startDateTimeTimestamp)
+  );
+  const [endDateTime, setEndDateTime] = useState<Date>(
+    new Date(endDateByFrequency[frequency])
+  );
+
   const closeConfirmStack = () => setConfirmStackIsOpen(false);
   const closeTokenPicker = () => setTokenPickerIsOpen(false);
   const openConfirmStack = () => setConfirmStackIsOpen(true);
@@ -30,6 +66,10 @@ export const Stackbox = () => {
   };
   const selectToken = isPickingTokenFrom ? setTokenFrom : setTokenTo;
 
+  useEffect(() => {
+    setEndDateTime(new Date(endDateByFrequency[frequency]));
+  }, [frequency]);
+
   return (
     <>
       <div className="max-w-lg mx-auto my-24 bg-white shadow-2xl rounded-2xl">
@@ -58,42 +98,57 @@ export const Stackbox = () => {
             />
           </div>
         </div>
-        <div className="px-5 py-6">
+        <div className="px-5 py-6 space-y-6">
           <div className="space-y-2">
             <TitleText weight="bold" className="text-em-med">
               Stack WETH every
             </TitleText>
-            <div className="flex space-x-2">
-              <RadioButton
-                name="hour"
-                id="hour"
-                checked={true}
-                value={"0"}
-                onChange={() => {}}
-              >
-                Hour
-              </RadioButton>
-              <RadioButton
-                name="week"
-                id="week"
-                checked={false}
-                value={"1"}
-                onChange={() => {}}
-              >
-                Week
-              </RadioButton>
-              <RadioButton
-                name="month"
-                id="month"
-                checked={false}
-                value={"2"}
-                onChange={() => {}}
-              >
-                Month
-              </RadioButton>
+            <div className="space-y-6">
+              <div className="flex space-x-2">
+                {frequencyOptions.map(({ option, name }) => {
+                  const isSelected = frequency === option;
+                  return (
+                    <RadioButton
+                      key={option}
+                      name={option}
+                      id={option}
+                      checked={isSelected}
+                      value={option}
+                      onChange={(event) => setFrequency(event.target.value)}
+                    >
+                      <BodyText
+                        size={2}
+                        className={!isSelected ? "text-em-med" : ""}
+                      >
+                        {name}
+                      </BodyText>
+                    </RadioButton>
+                  );
+                })}
+              </div>
+              <div className="flex flex-col md:flex-row rounded-2xl border border-surface-50 divide-y md:divide-x divide-surface-50">
+                <div className="flex flex-col w-full px-4 py-3 space-y-2">
+                  <BodyText size={2}>Starting from</BodyText>
+                  <DatePicker
+                    dateTime={startDateTime}
+                    setDateTime={setStartDateTime}
+                    timeCaption="Start time"
+                    className="w-full"
+                  />
+                </div>
+                <div className="flex flex-col w-full px-4 py-3 space-y-2">
+                  <BodyText size={2}>Until</BodyText>
+                  <DatePicker
+                    dateTime={endDateTime}
+                    setDateTime={setEndDateTime}
+                    timeCaption="End time"
+                    className="w-full"
+                    fromDate={startDateTime}
+                  />
+                </div>
+              </div>
             </div>
           </div>
-          <p className="py-12 mx-auto w-fit text-em-low">The stackbox™</p>
           <Button width="full" onClick={openConfirmStack}>
             Stack Now
           </Button>
diff --git a/packages/app/components/token-picker/index.ts b/packages/app/components/token-picker/index.ts
new file mode 100644
index 00000000..51a4d7a9
--- /dev/null
+++ b/packages/app/components/token-picker/index.ts
@@ -0,0 +1 @@
+export * from "./TokenPicker";
diff --git a/packages/app/package.json b/packages/app/package.json
index 576fe42f..97a34d80 100644
--- a/packages/app/package.json
+++ b/packages/app/package.json
@@ -16,11 +16,15 @@
     "@cowprotocol/cow-sdk": "^2.1.0",
     "@headlessui/react": "^1.7.14",
     "@headlessui/tailwindcss": "^0.1.3",
+    "@popperjs/core": "^2.11.8",
     "class-variance-authority": "^0.6.0",
     "connectkit": "^1.4.0",
+    "date-fns": "^2.30.0",
     "next": "13.4.10",
     "react": "^18.2.0",
+    "react-day-picker": "^8.8.0",
     "react-dom": "^18.2.0",
+    "react-popper": "^2.3.0",
     "tailwind-merge": "^1.12.0",
     "viem": "^1.0.2",
     "wagmi": "^1.1.1"
diff --git a/packages/app/styles/global.css b/packages/app/styles/global.css
index a27072b3..b34bb708 100644
--- a/packages/app/styles/global.css
+++ b/packages/app/styles/global.css
@@ -19,3 +19,11 @@
 
 @tailwind components;
 @tailwind utilities;
+
+@layer base {
+  input[type="number"]::-webkit-inner-spin-button,
+  input[type="number"]::-webkit-outer-spin-button {
+    -webkit-appearance: none;
+    margin: 0;
+  }
+}
diff --git a/packages/app/ui/Calendar.tsx b/packages/app/ui/Calendar.tsx
new file mode 100644
index 00000000..067bfc3c
--- /dev/null
+++ b/packages/app/ui/Calendar.tsx
@@ -0,0 +1,66 @@
+"use client";
+
+import * as React from "react";
+
+import { DayPicker } from "react-day-picker";
+
+import { buttonStyles, Icon } from ".";
+import { twMerge } from "tailwind-merge";
+
+export type CalendarProps = React.ComponentProps<typeof DayPicker>;
+
+function Calendar({
+  className,
+  classNames,
+  showOutsideDays = true,
+  ...props
+}: CalendarProps) {
+  return (
+    <DayPicker
+      showOutsideDays={showOutsideDays}
+      className={className}
+      classNames={{
+        months: "flex flex-col sm:flex-row space-y-4 sm:space-x-4 sm:space-y-0",
+        month: "space-y-4",
+        caption: "flex justify-center relative items-center mx-4 py-3",
+        caption_label: "text-sm font-medium",
+        nav: "space-x-1 flex items-center",
+        nav_button: twMerge(
+          buttonStyles({ size: "icon", action: "quaternary" }),
+          "h-7 w-7 bg-transparent p-0 rounded-full border border-surface-50"
+        ),
+        nav_button_previous: "absolute left-1",
+        nav_button_next: "absolute right-1",
+        table: "w-full border-collapse space-y-1 mx-2",
+        head_row: "flex",
+        head_cell: "rounded-md w-9 font-normal text-[0.8rem]",
+        row: "flex w-full mt-2",
+        cell: "text-center text-sm p-0 relative [&:has([aria-selected])]:bg-accent first:[&:has([aria-selected])]:rounded-l-md last:[&:has([aria-selected])]:rounded-r-md focus-within:relative focus-within:z-20",
+        day: twMerge(
+          buttonStyles({ size: "icon", action: "quaternary" }),
+          "h-9 w-9 p-0 font-normal aria-selected:opacity-100 hover:enabled:bg-primary-400 focus:bg-primary-400 disabled:bg-transparent active:ring-primary-200 focus:ring-primary-200"
+        ),
+        day_selected: "bg-primary-400 text-primary-foreground ",
+        day_today: "bg-accent text-accent-foreground",
+        day_outside: "opacity-50",
+        day_disabled: "opacity-40",
+        day_range_middle:
+          "aria-selected:bg-accent aria-selected:text-accent-foreground",
+        day_hidden: "invisible",
+        ...classNames,
+      }}
+      components={{
+        IconLeft: ({ ...props }) => (
+          <Icon name="caret-left" className="h-4 w-4" />
+        ),
+        IconRight: ({ ...props }) => (
+          <Icon name="caret-right" className="h-4 w-4" />
+        ),
+      }}
+      {...props}
+    />
+  );
+}
+Calendar.displayName = "Calendar";
+
+export { Calendar };
diff --git a/packages/app/ui/buttons/index.ts b/packages/app/ui/buttons/index.ts
index b5fb6be9..fc01efb9 100644
--- a/packages/app/ui/buttons/index.ts
+++ b/packages/app/ui/buttons/index.ts
@@ -2,3 +2,4 @@ export * from "./Button";
 export * from "./ButtonLink";
 export * from "./ChipButton";
 export * from "./RadioButton";
+export * from "./base";
diff --git a/packages/app/ui/index.ts b/packages/app/ui/index.ts
index 8f18fe8e..354c8443 100644
--- a/packages/app/ui/index.ts
+++ b/packages/app/ui/index.ts
@@ -4,3 +4,4 @@ export * from "./icon/Icon";
 export * from "./modal";
 export * from "./table/Table";
 export * from "./text";
+export * from "./Calendar";
diff --git a/yarn.lock b/yarn.lock
index 65774661..3aff32e3 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1425,7 +1425,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@babel/runtime@npm:^7.17.2, @babel/runtime@npm:^7.20.7, @babel/runtime@npm:^7.22.3, @babel/runtime@npm:^7.8.4":
+"@babel/runtime@npm:^7.17.2, @babel/runtime@npm:^7.20.7, @babel/runtime@npm:^7.21.0, @babel/runtime@npm:^7.22.3, @babel/runtime@npm:^7.8.4":
   version: 7.22.6
   resolution: "@babel/runtime@npm:7.22.6"
   dependencies:
@@ -2685,6 +2685,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@popperjs/core@npm:^2.11.8":
+  version: 2.11.8
+  resolution: "@popperjs/core@npm:2.11.8"
+  checksum: e5c69fdebf52a4012f6a1f14817ca8e9599cb1be73dd1387e1785e2ed5e5f0862ff817f420a87c7fc532add1f88a12e25aeb010ffcbdc98eace3d55ce2139cf0
+  languageName: node
+  linkType: hard
+
 "@protobufjs/aspromise@npm:^1.1.1, @protobufjs/aspromise@npm:^1.1.2":
   version: 1.1.2
   resolution: "@protobufjs/aspromise@npm:1.1.2"
@@ -4532,18 +4539,22 @@ __metadata:
     "@cowprotocol/cow-sdk": ^2.1.0
     "@headlessui/react": ^1.7.14
     "@headlessui/tailwindcss": ^0.1.3
+    "@popperjs/core": ^2.11.8
     "@svgr/webpack": ^8.0.1
     "@types/node": 20.3.1
     "@types/react": 18.2.13
     autoprefixer: ^10.4.14
     class-variance-authority: ^0.6.0
     connectkit: ^1.4.0
+    date-fns: ^2.30.0
     eslint: ^8.11.0
     eslint-config-next: canary
     next: 13.4.10
     postcss: ^8.4.23
     react: ^18.2.0
+    react-day-picker: ^8.8.0
     react-dom: ^18.2.0
+    react-popper: ^2.3.0
     sharp: ^0.32.1
     tailwind-merge: ^1.12.0
     tailwindcss: ^3.3.2
@@ -5972,6 +5983,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"date-fns@npm:^2.30.0":
+  version: 2.30.0
+  resolution: "date-fns@npm:2.30.0"
+  dependencies:
+    "@babel/runtime": ^7.21.0
+  checksum: f7be01523282e9bb06c0cd2693d34f245247a29098527d4420628966a2d9aad154bd0e90a6b1cf66d37adcb769cd108cf8a7bd49d76db0fb119af5cdd13644f4
+  languageName: node
+  linkType: hard
+
 "debounce@npm:^1.2.1":
   version: 1.2.1
   resolution: "debounce@npm:1.2.1"
@@ -9502,7 +9522,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"loose-envify@npm:^1.1.0, loose-envify@npm:^1.4.0":
+"loose-envify@npm:^1.0.0, loose-envify@npm:^1.1.0, loose-envify@npm:^1.4.0":
   version: 1.4.0
   resolution: "loose-envify@npm:1.4.0"
   dependencies:
@@ -11188,6 +11208,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"react-day-picker@npm:^8.8.0":
+  version: 8.8.0
+  resolution: "react-day-picker@npm:8.8.0"
+  peerDependencies:
+    date-fns: ^2.28.0
+    react: ^16.8.0 || ^17.0.0 || ^18.0.0
+  checksum: c104b4ae44bad44183f6a273327aa1d00d23afe6f3860f8335eea2d06c0f64ea015ea7438655c79a5024a8db259ba5fa9431dbf92f03889120d0c2c00a28117f
+  languageName: node
+  linkType: hard
+
 "react-dom@npm:^18.2.0":
   version: 18.2.0
   resolution: "react-dom@npm:18.2.0"
@@ -11200,6 +11230,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"react-fast-compare@npm:^3.0.1":
+  version: 3.2.2
+  resolution: "react-fast-compare@npm:3.2.2"
+  checksum: 2071415b4f76a3e6b55c84611c4d24dcb12ffc85811a2840b5a3f1ff2d1a99be1020d9437ee7c6e024c9f4cbb84ceb35e48cf84f28fcb00265ad2dfdd3947704
+  languageName: node
+  linkType: hard
+
 "react-is@npm:^16.13.1, react-is@npm:^16.7.0":
   version: 16.13.1
   resolution: "react-is@npm:16.13.1"
@@ -11216,6 +11253,20 @@ __metadata:
   languageName: node
   linkType: hard
 
+"react-popper@npm:^2.3.0":
+  version: 2.3.0
+  resolution: "react-popper@npm:2.3.0"
+  dependencies:
+    react-fast-compare: ^3.0.1
+    warning: ^4.0.2
+  peerDependencies:
+    "@popperjs/core": ^2.0.0
+    react: ^16.8.0 || ^17 || ^18
+    react-dom: ^16.8.0 || ^17 || ^18
+  checksum: 837111c98738011c69b3069a464ea5bdcbf487105b6148e8faf90cb7337e134edb1b98b8824322941c378756cca30a15c18c25f558e53b85ed5762fa0dc8e6b2
+  languageName: node
+  linkType: hard
+
 "react-transition-state@npm:^1.1.4":
   version: 1.1.5
   resolution: "react-transition-state@npm:1.1.5"
@@ -13396,6 +13447,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"warning@npm:^4.0.2":
+  version: 4.0.3
+  resolution: "warning@npm:4.0.3"
+  dependencies:
+    loose-envify: ^1.0.0
+  checksum: 4f2cb6a9575e4faf71ddad9ad1ae7a00d0a75d24521c193fa464f30e6b04027bd97aa5d9546b0e13d3a150ab402eda216d59c1d0f2d6ca60124d96cd40dfa35c
+  languageName: node
+  linkType: hard
+
 "watchpack@npm:2.4.0":
   version: 2.4.0
   resolution: "watchpack@npm:2.4.0"