@alpaca-editor/core 1.0.0

package/src/editor/ui/Icons.tsx

@@ -0,0 +1,585 @@
+export function WizardIcon({ className }: { className?: string }) {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      fill="none"
+      viewBox="0 0 24 24"
+      strokeWidth="1.5"
+      stroke="currentColor"
+      className={className}
+    >
+      <path
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        d="M9.813 15.904 9 18.75l-.813-2.846a4.5 4.5 0 0 0-3.09-3.09L2.25 12l2.846-.813a4.5 4.5 0 0 0 3.09-3.09L9 5.25l.813 2.846a4.5 4.5 0 0 0 3.09 3.09L15.75 12l-2.846.813a4.5 4.5 0 0 0-3.09 3.09ZM18.259 8.715 18 9.75l-.259-1.035a3.375 3.375 0 0 0-2.455-2.456L14.25 6l1.036-.259a3.375 3.375 0 0 0 2.455-2.456L18 2.25l.259 1.035a3.375 3.375 0 0 0 2.456 2.456L21.75 6l-1.035.259a3.375 3.375 0 0 0-2.456 2.456ZM16.894 20.567 16.5 21.75l-.394-1.183a2.25 2.25 0 0 0-1.423-1.423L13.5 18.75l1.183-.394a2.25 2.25 0 0 0 1.423-1.423l.394-1.183.394 1.183a2.25 2.25 0 0 0 1.423 1.423l1.183.394-1.183.394a2.25 2.25 0 0 0-1.423 1.423Z"
+      />
+    </svg>
+  );
+}
+
+export function BugIcon({ className }: { className?: string }) {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      fill="none"
+      viewBox="0 0 24 24"
+      strokeWidth={1.5}
+      stroke="currentColor"
+      className={className}
+    >
+      <path
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        d="M12 12.75c1.148 0 2.278.08 3.383.237 1.037.146 1.866.966 1.866 2.013 0 3.728-2.35 6.75-5.25 6.75S6.75 18.728 6.75 15c0-1.046.83-1.867 1.866-2.013A24.204 24.204 0 0 1 12 12.75Zm0 0c2.883 0 5.647.508 8.207 1.44a23.91 23.91 0 0 1-1.152 6.06M12 12.75c-2.883 0-5.647.508-8.208 1.44.125 2.104.52 4.136 1.153 6.06M12 12.75a2.25 2.25 0 0 0 2.248-2.354M12 12.75a2.25 2.25 0 0 1-2.248-2.354M12 8.25c.995 0 1.971-.08 2.922-.236.403-.066.74-.358.795-.762a3.778 3.778 0 0 0-.399-2.25M12 8.25c-.995 0-1.97-.08-2.922-.236-.402-.066-.74-.358-.795-.762a3.734 3.734 0 0 1 .4-2.253M12 8.25a2.25 2.25 0 0 0-2.248 2.146M12 8.25a2.25 2.25 0 0 1 2.248 2.146M8.683 5a6.032 6.032 0 0 1-1.155-1.002c.07-.63.27-1.222.574-1.747m.581 2.749A3.75 3.75 0 0 1 15.318 5m0 0c.427-.283.815-.62 1.155-.999a4.471 4.471 0 0 0-.575-1.752M4.921 6a24.048 24.048 0 0 0-.392 3.314c1.668.546 3.416.914 5.223 1.082M19.08 6c.205 1.08.337 2.187.392 3.314a23.882 23.882 0 0 1-5.223 1.082"
+      />
+    </svg>
+  );
+}
+
+export function EditIcon({ className }: { className?: string }) {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      fill="none"
+      viewBox="0 0 24 24"
+      strokeWidth={1.5}
+      stroke="currentColor"
+      className={className}
+    >
+      <path
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        d="m16.862 4.487 1.687-1.688a1.875 1.875 0 1 1 2.652 2.652L10.582 16.07a4.5 4.5 0 0 1-1.897 1.13L6 18l.8-2.685a4.5 4.5 0 0 1 1.13-1.897l8.932-8.931Zm0 0L19.5 7.125M18 14v4.75A2.25 2.25 0 0 1 15.75 21H5.25A2.25 2.25 0 0 1 3 18.75V8.25A2.25 2.25 0 0 1 5.25 6H10"
+      />
+    </svg>
+  );
+}
+
+export function JsonIcon({ className }: { className?: string }) {
+  return (
+    <svg
+      fill="#000000"
+      version="1.1"
+      xmlns="http://www.w3.org/2000/svg"
+      viewBox="0 0 58 58"
+      className={className}
+    >
+      <g>
+        <path
+          d="M50.949,12.187l-1.361-1.361l-9.504-9.505c-0.001-0.001-0.001-0.001-0.002-0.001l-0.77-0.771
+		C38.957,0.195,38.486,0,37.985,0H8.963C7.776,0,6.5,0.916,6.5,2.926V39v16.537V56c0,0.837,0.841,1.652,1.836,1.909
+		c0.051,0.014,0.1,0.033,0.152,0.043C8.644,57.983,8.803,58,8.963,58h40.074c0.16,0,0.319-0.017,0.475-0.048
+		c0.052-0.01,0.101-0.029,0.152-0.043C50.659,57.652,51.5,56.837,51.5,56v-0.463V39V13.978C51.5,13.211,51.407,12.644,50.949,12.187
+		z M39.5,3.565L47.935,12H39.5V3.565z M8.963,56c-0.071,0-0.135-0.025-0.198-0.049C8.61,55.877,8.5,55.721,8.5,55.537V41h41v14.537
+		c0,0.184-0.11,0.34-0.265,0.414C49.172,55.975,49.108,56,49.037,56H8.963z M8.5,39V2.926C8.5,2.709,8.533,2,8.963,2h28.595
+		C37.525,2.126,37.5,2.256,37.5,2.391V13.78c-0.532-0.48-1.229-0.78-2-0.78c-0.553,0-1,0.448-1,1s0.447,1,1,1c0.552,0,1,0.449,1,1v4
+		c0,1.2,0.542,2.266,1.382,3c-0.84,0.734-1.382,1.8-1.382,3v4c0,0.551-0.448,1-1,1c-0.553,0-1,0.448-1,1s0.447,1,1,1
+		c1.654,0,3-1.346,3-3v-4c0-1.103,0.897-2,2-2c0.553,0,1-0.448,1-1s-0.447-1-1-1c-1.103,0-2-0.897-2-2v-4
+		c0-0.771-0.301-1.468-0.78-2h11.389c0.135,0,0.265-0.025,0.391-0.058c0,0.015,0.001,0.021,0.001,0.036V39H8.5z"
+        />
+        <path
+          d="M16.354,51.43c-0.019,0.446-0.171,0.764-0.458,0.95s-0.672,0.28-1.155,0.28c-0.191,0-0.396-0.022-0.615-0.068
+		s-0.429-0.098-0.629-0.157s-0.385-0.123-0.554-0.191s-0.299-0.135-0.39-0.198l-0.697,1.107c0.183,0.137,0.405,0.26,0.67,0.369
+		s0.54,0.207,0.827,0.294s0.565,0.15,0.834,0.191s0.504,0.062,0.704,0.062c0.401,0,0.791-0.039,1.169-0.116
+		c0.378-0.077,0.713-0.214,1.005-0.41s0.524-0.456,0.697-0.779s0.26-0.723,0.26-1.196v-7.848h-1.668V51.43z"
+        />
+        <path
+          d="M25.083,49.064c-0.314-0.228-0.654-0.422-1.019-0.581s-0.702-0.323-1.012-0.492s-0.569-0.364-0.779-0.588
+		s-0.314-0.518-0.314-0.882c0-0.146,0.036-0.299,0.109-0.458s0.173-0.303,0.301-0.431s0.273-0.234,0.438-0.321
+		s0.337-0.139,0.52-0.157c0.328-0.027,0.597-0.032,0.807-0.014s0.378,0.05,0.506,0.096s0.226,0.091,0.294,0.137
+		s0.13,0.082,0.185,0.109c0.009-0.009,0.036-0.055,0.082-0.137s0.101-0.185,0.164-0.308s0.132-0.255,0.205-0.396
+		s0.137-0.271,0.191-0.39c-0.265-0.173-0.61-0.299-1.039-0.376s-0.853-0.116-1.271-0.116c-0.41,0-0.8,0.063-1.169,0.191
+		s-0.692,0.313-0.971,0.554s-0.499,0.535-0.663,0.882S20.4,46.13,20.4,46.576c0,0.492,0.104,0.902,0.314,1.23
+		s0.474,0.613,0.793,0.854s0.661,0.451,1.025,0.629s0.704,0.355,1.019,0.533s0.576,0.376,0.786,0.595s0.314,0.483,0.314,0.793
+		c0,0.511-0.148,0.896-0.444,1.155s-0.723,0.39-1.278,0.39c-0.183,0-0.378-0.019-0.588-0.055s-0.419-0.084-0.629-0.144
+		s-0.412-0.123-0.608-0.191s-0.357-0.139-0.485-0.212l-0.287,1.176c0.155,0.137,0.34,0.253,0.554,0.349s0.439,0.171,0.677,0.226
+		c0.237,0.055,0.472,0.094,0.704,0.116s0.458,0.034,0.677,0.034c0.511,0,0.966-0.077,1.367-0.232s0.738-0.362,1.012-0.622
+		s0.485-0.561,0.636-0.902s0.226-0.695,0.226-1.06c0-0.538-0.104-0.978-0.314-1.319S25.397,49.292,25.083,49.064z"
+        />
+        <path
+          d="M34.872,45.072c-0.378-0.429-0.82-0.754-1.326-0.978s-1.06-0.335-1.661-0.335s-1.155,0.111-1.661,0.335
+		s-0.948,0.549-1.326,0.978s-0.675,0.964-0.889,1.606s-0.321,1.388-0.321,2.235s0.107,1.595,0.321,2.242s0.511,1.185,0.889,1.613
+		s0.82,0.752,1.326,0.971s1.06,0.328,1.661,0.328s1.155-0.109,1.661-0.328s0.948-0.542,1.326-0.971s0.675-0.966,0.889-1.613
+		s0.321-1.395,0.321-2.242s-0.107-1.593-0.321-2.235S35.25,45.501,34.872,45.072z M34.195,50.698
+		c-0.137,0.487-0.326,0.882-0.567,1.183s-0.515,0.518-0.82,0.649s-0.627,0.198-0.964,0.198c-0.328,0-0.641-0.07-0.937-0.212
+		s-0.561-0.364-0.793-0.67s-0.415-0.699-0.547-1.183s-0.203-1.066-0.212-1.75c0.009-0.702,0.082-1.294,0.219-1.777
+		c0.137-0.483,0.326-0.877,0.567-1.183s0.515-0.521,0.82-0.649s0.627-0.191,0.964-0.191c0.328,0,0.641,0.068,0.937,0.205
+		s0.561,0.36,0.793,0.67s0.415,0.704,0.547,1.183s0.203,1.06,0.212,1.743C34.405,49.616,34.332,50.211,34.195,50.698z"
+        />
+        <polygon
+          points="44.012,50.869 40.061,43.924 38.393,43.924 38.393,54 40.061,54 40.061,47.055 44.012,54 45.68,54 45.68,43.924 
+		44.012,43.924 	"
+        />
+        <path
+          d="M20.5,20v-4c0-0.551,0.448-1,1-1c0.553,0,1-0.448,1-1s-0.447-1-1-1c-1.654,0-3,1.346-3,3v4c0,1.103-0.897,2-2,2
+		c-0.553,0-1,0.448-1,1s0.447,1,1,1c1.103,0,2,0.897,2,2v4c0,1.654,1.346,3,3,3c0.553,0,1-0.448,1-1s-0.447-1-1-1
+		c-0.552,0-1-0.449-1-1v-4c0-1.2-0.542-2.266-1.382-3C19.958,22.266,20.5,21.2,20.5,20z"
+        />
+        <circle cx="28.5" cy="19.5" r="1.5" />
+        <path d="M28.5,25c-0.553,0-1,0.448-1,1v3c0,0.552,0.447,1,1,1s1-0.448,1-1v-3C29.5,25.448,29.053,25,28.5,25z" />
+      </g>
+    </svg>
+  );
+}
+
+export function GraphQLIcon({ className }: { className?: string }) {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      version="1.1"
+      id="GraphQL_Logo"
+      x="0px"
+      y="0px"
+      viewBox="0 0 400 400"
+      enableBackground="new 0 0 400 400"
+      className={className}
+    >
+      <g>
+        <g>
+          <g>
+            <rect
+              x="122"
+              y="-0.4"
+              transform="matrix(-0.866 -0.5 0.5 -0.866 163.3196 363.3136)"
+              fill="#E535AB"
+              width="16.6"
+              height="320.3"
+            />
+          </g>
+        </g>
+        <g>
+          <g>
+            <rect
+              x="39.8"
+              y="272.2"
+              fill="#E535AB"
+              width="320.3"
+              height="16.6"
+            />
+          </g>
+        </g>
+        <g>
+          <g>
+            <rect
+              x="37.9"
+              y="312.2"
+              transform="matrix(-0.866 -0.5 0.5 -0.866 83.0693 663.3409)"
+              fill="#E535AB"
+              width="185"
+              height="16.6"
+            />
+          </g>
+        </g>
+        <g>
+          <g>
+            <rect
+              x="177.1"
+              y="71.1"
+              transform="matrix(-0.866 -0.5 0.5 -0.866 463.3409 283.0693)"
+              fill="#E535AB"
+              width="185"
+              height="16.6"
+            />
+          </g>
+        </g>
+        <g>
+          <g>
+            <rect
+              x="122.1"
+              y="-13"
+              transform="matrix(-0.5 -0.866 0.866 -0.5 126.7903 232.1221)"
+              fill="#E535AB"
+              width="16.6"
+              height="185"
+            />
+          </g>
+        </g>
+        <g>
+          <g>
+            <rect
+              x="109.6"
+              y="151.6"
+              transform="matrix(-0.5 -0.866 0.866 -0.5 266.0828 473.3766)"
+              fill="#E535AB"
+              width="320.3"
+              height="16.6"
+            />
+          </g>
+        </g>
+        <g>
+          <g>
+            <rect x="52.5" y="107.5" fill="#E535AB" width="16.6" height="185" />
+          </g>
+        </g>
+        <g>
+          <g>
+            <rect
+              x="330.9"
+              y="107.5"
+              fill="#E535AB"
+              width="16.6"
+              height="185"
+            />
+          </g>
+        </g>
+        <g>
+          <g>
+            <rect
+              x="262.4"
+              y="240.1"
+              transform="matrix(-0.5 -0.866 0.866 -0.5 126.7953 714.2875)"
+              fill="#E535AB"
+              width="14.5"
+              height="160.9"
+            />
+          </g>
+        </g>
+        <path
+          fill="#E535AB"
+          d="M369.5,297.9c-9.6,16.7-31,22.4-47.7,12.8c-16.7-9.6-22.4-31-12.8-47.7c9.6-16.7,31-22.4,47.7-12.8   C373.5,259.9,379.2,281.2,369.5,297.9"
+        />
+        <path
+          fill="#E535AB"
+          d="M90.9,137c-9.6,16.7-31,22.4-47.7,12.8c-16.7-9.6-22.4-31-12.8-47.7c9.6-16.7,31-22.4,47.7-12.8   C94.8,99,100.5,120.3,90.9,137"
+        />
+        <path
+          fill="#E535AB"
+          d="M30.5,297.9c-9.6-16.7-3.9-38,12.8-47.7c16.7-9.6,38-3.9,47.7,12.8c9.6,16.7,3.9,38-12.8,47.7   C61.4,320.3,40.1,314.6,30.5,297.9"
+        />
+        <path
+          fill="#E535AB"
+          d="M309.1,137c-9.6-16.7-3.9-38,12.8-47.7c16.7-9.6,38-3.9,47.7,12.8c9.6,16.7,3.9,38-12.8,47.7   C340.1,159.4,318.7,153.7,309.1,137"
+        />
+        <path
+          fill="#E535AB"
+          d="M200,395.8c-19.3,0-34.9-15.6-34.9-34.9c0-19.3,15.6-34.9,34.9-34.9c19.3,0,34.9,15.6,34.9,34.9   C234.9,380.1,219.3,395.8,200,395.8"
+        />
+        <path
+          fill="#E535AB"
+          d="M200,74c-19.3,0-34.9-15.6-34.9-34.9c0-19.3,15.6-34.9,34.9-34.9c19.3,0,34.9,15.6,34.9,34.9   C234.9,58.4,219.3,74,200,74"
+        />
+      </g>
+    </svg>
+  );
+}
+
+export function ArrowDownIcon() {
+  return (
+    <svg
+      width="10"
+      height="5"
+      viewBox="0 0 10 5"
+      fill="currentColor"
+      stroke="currentColor"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <path d="M5 5L9.33013 0.5H0.669873L5 5Z" />
+    </svg>
+  );
+}
+
+export function ArrowRightIcon() {
+  return (
+    <svg
+      width="5"
+      height="10"
+      viewBox="0 0 5 10"
+      fill="currentColor"
+      stroke="currentColor"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <path d="M5 5L0.669873 9.33013V0.669873L5 5Z" />
+    </svg>
+  );
+}
+export function PuzzleIcon() {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      fill="none"
+      viewBox="0 0 24 24"
+      strokeWidth="1.5"
+      stroke="currentColor"
+    >
+      <path
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        d="M14.25 6.087c0-.355.186-.676.401-.959.221-.29.349-.634.349-1.003 0-1.036-1.007-1.875-2.25-1.875s-2.25.84-2.25 1.875c0 .369.128.713.349 1.003.215.283.401.604.401.959v0a.64.64 0 0 1-.657.643 48.39 48.39 0 0 1-4.163-.3c.186 1.613.293 3.25.315 4.907a.656.656 0 0 1-.658.663v0c-.355 0-.676-.186-.959-.401a1.647 1.647 0 0 0-1.003-.349c-1.036 0-1.875 1.007-1.875 2.25s.84 2.25 1.875 2.25c.369 0 .713-.128 1.003-.349.283-.215.604-.401.959-.401v0c.31 0 .555.26.532.57a48.039 48.039 0 0 1-.642 5.056c1.518.19 3.058.309 4.616.354a.64.64 0 0 0 .657-.643v0c0-.355-.186-.676-.401-.959a1.647 1.647 0 0 1-.349-1.003c0-1.035 1.008-1.875 2.25-1.875 1.243 0 2.25.84 2.25 1.875 0 .369-.128.713-.349 1.003-.215.283-.4.604-.4.959v0c0 .333.277.599.61.58a48.1 48.1 0 0 0 5.427-.63 48.05 48.05 0 0 0 .582-4.717.532.532 0 0 0-.533-.57v0c-.355 0-.676.186-.959.401-.29.221-.634.349-1.003.349-1.035 0-1.875-1.007-1.875-2.25s.84-2.25 1.875-2.25c.37 0 .713.128 1.003.349.283.215.604.401.96.401v0a.656.656 0 0 0 .658-.663 48.422 48.422 0 0 0-.37-5.36c-1.886.342-3.81.574-5.766.689a.578.578 0 0 1-.61-.58v0Z"
+      />
+    </svg>
+  );
+}
+
+export function NavigatorIcon() {
+  return (
+    <svg
+      width="18"
+      height="16"
+      viewBox="0 0 16 14"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      stroke="currentColor"
+    >
+      <path
+        d="M8.27572 8.58057L0.942383 4.58057L8.27572 0.580566L15.609 4.58057L8.27572 8.58057ZM8.27572 11.2472L1.32572 7.4639L2.72572 6.69723L8.27572 9.73057L13.8257 6.69723L15.2257 7.4639L8.27572 11.2472ZM8.27572 13.9139L1.32572 10.1306L2.72572 9.3639L8.27572 12.3972L13.8257 9.3639L15.2257 10.1306L8.27572 13.9139ZM8.27572 7.0639L12.8257 4.58057L8.27572 2.09723L3.72572 4.58057L8.27572 7.0639Z"
+        fill="#6b7280"
+      />
+    </svg>
+  );
+}
+
+export function FormEditIcon({ className }: { className?: string }) {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      fill="none"
+      viewBox="0 0 24 24"
+      strokeWidth={1.5}
+      stroke="currentColor"
+      className={className}
+    >
+      <path
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        d="M3.375 19.5h17.25m-17.25 0a1.125 1.125 0 0 1-1.125-1.125M3.375 19.5h7.5c.621 0 1.125-.504 1.125-1.125m-9.75 0V5.625m0 12.75v-1.5c0-.621.504-1.125 1.125-1.125m18.375 2.625V5.625m0 12.75c0 .621-.504 1.125-1.125 1.125m1.125-1.125v-1.5c0-.621-.504-1.125-1.125-1.125m0 3.75h-7.5A1.125 1.125 0 0 1 12 18.375m9.75-12.75c0-.621-.504-1.125-1.125-1.125H3.375c-.621 0-1.125.504-1.125 1.125m19.5 0v1.5c0 .621-.504 1.125-1.125 1.125M2.25 5.625v1.5c0 .621.504 1.125 1.125 1.125m0 0h17.25m-17.25 0h7.5c.621 0 1.125.504 1.125 1.125M3.375 8.25c-.621 0-1.125.504-1.125 1.125v1.5c0 .621.504 1.125 1.125 1.125m17.25-3.75h-7.5c-.621 0-1.125.504-1.125 1.125m8.625-1.125c.621 0 1.125.504 1.125 1.125v1.5c0 .621-.504 1.125-1.125 1.125m-17.25 0h7.5m-7.5 0c-.621 0-1.125.504-1.125 1.125v1.5c0 .621.504 1.125 1.125 1.125M12 10.875v-1.5m0 1.5c0 .621-.504 1.125-1.125 1.125M12 10.875c0 .621.504 1.125 1.125 1.125m-2.25 0c.621 0 1.125.504 1.125 1.125M13.125 12h7.5m-7.5 0c-.621 0-1.125.504-1.125 1.125M20.625 12c.621 0 1.125.504 1.125 1.125v1.5c0 .621-.504 1.125-1.125 1.125m-17.25 0h7.5M12 14.625v-1.5m0 1.5c0 .621-.504 1.125-1.125 1.125M12 14.625c0 .621.504 1.125 1.125 1.125m-2.25 0c.621 0 1.125.504 1.125 1.125m0 1.5v-1.5m0 0c0-.621.504-1.125 1.125-1.125m0 0h7.5"
+      />
+    </svg>
+  );
+}
+
+export function RotateDeviceIcon({ className }: { className?: string }) {
+  return (
+    <svg
+      viewBox="0 0 24 24"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+      stroke="currentColor"
+      fill="currentColor"
+    >
+      <path d="M21.323 8.616l-4.94-4.94a1.251 1.251 0 0 0-1.767 0l-10.94 10.94a1.251 1.251 0 0 0 0 1.768l4.94 4.94a1.25 1.25 0 0 0 1.768 0l10.94-10.94a1.251 1.251 0 0 0 0-1.768zM14 5.707L19.293 11 11.5 18.793 6.207 13.5zm-4.323 14.91a.25.25 0 0 1-.354 0l-1.47-1.47.5-.5-2-2-.5.5-1.47-1.47a.25.25 0 0 1 0-.354L5.5 14.207l5.293 5.293zm10.94-10.94l-.617.616L14.707 5l.616-.616a.25.25 0 0 1 .354 0l4.94 4.94a.25.25 0 0 1 0 .353zm1.394 6.265V18a3.003 3.003 0 0 1-3 3h-3.292l1.635 1.634-.707.707-2.848-2.847 2.848-2.848.707.707L15.707 20h3.304a2.002 2.002 0 0 0 2-2v-2.058zM4 9H3V7a3.003 3.003 0 0 1 3-3h3.293L7.646 2.354l.707-.707 2.848 2.847L8.354 7.34l-.707-.707L9.28 5H6a2.002 2.002 0 0 0-2 2z" />
+      <path fill="none" d="M0 0h24v24H0z" />
+    </svg>
+  );
+}
+
+export function CompareIcon({ className }: { className?: string }) {
+  return (
+    <svg
+      viewBox="0 0 24 24"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+      stroke="currentColor"
+      fill="currentColor"
+    >
+      <path d="M2 4h9v1H3v15h8v1H2zm10 19h1V2h-1zM8.283 10.283l-.566-.566L4.934 12.5l2.783 2.783.566-.566L6.566 13H11v-1H6.566zM14 12h4.08l-1.54-1.54.92-.92 2.96 2.96-2.96 2.96-.92-.92L18.08 13H14v8h9V4h-9z" />
+      <path fill="none" d="M0 0h24v24H0z" />
+    </svg>
+  );
+}
+
+export function CommentIcon({ className }: { className?: string }) {
+  return (
+    <svg
+      version="1.1"
+      id="Capa_1"
+      className={className}
+      xmlns="http://www.w3.org/2000/svg"
+      xmlnsXlink="http://www.w3.org/1999/xlink"
+      viewBox="0 0 529.668 529.668"
+      xmlSpace="preserve"
+      stroke="currentColor"
+      fill="currentColor"
+    >
+      <g id="SVGRepo_bgCarrier" strokeWidth="0"></g>
+      <g
+        id="SVGRepo_tracerCarrier"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      ></g>
+      <g id="SVGRepo_iconCarrier">
+        <g>
+          <g>
+            <path d="M45.175,529.668l108.887-117.085h330.431V0H45.894L45.175,529.668z M383.896,173.016c20.527,0,37.164,16.64,37.164,37.164 c0,20.527-16.641,37.164-37.164,37.164s-37.164-16.641-37.164-37.164C346.731,189.653,363.372,173.016,383.896,173.016z M265.192,173.016c20.526,0,37.165,16.64,37.165,37.164c0,20.527-16.641,37.164-37.165,37.164 c-20.523,0-37.164-16.641-37.164-37.164C228.028,189.653,244.668,173.016,265.192,173.016z M146.488,173.016 c20.527,0,37.164,16.64,37.164,37.164c0,20.527-16.641,37.164-37.164,37.164c-20.526,0-37.164-16.641-37.164-37.164 C109.325,189.653,125.965,173.016,146.488,173.016z"></path>{" "}
+          </g>
+        </g>
+      </g>
+    </svg>
+  );
+}
+
+export function PageWizardIcon({ className }: { className?: string }) {
+  return (
+    <svg
+      version="1.1"
+      id="Layer_1"
+      xmlns="http://www.w3.org/2000/svg"
+      xmlnsXlink="http://www.w3.org/1999/xlink"
+      viewBox="0 0 512 512"
+      xmlSpace="preserve"
+      className={className}
+      stroke="currentColor"
+      fill="currentColor"
+    >
+      <g>
+        <g>
+          <path
+            d="M454.32,219.727l-38.766-51.947l20.815-61.385c2.046-6.032,0.489-12.704-4.015-17.208
+			c-4.504-4.504-11.175-6.061-17.208-4.015l-61.384,20.815l-51.949-38.766c-5.103-3.81-11.929-4.392-17.605-1.499
+			c-5.676,2.893-9.217,8.755-9.136,15.125l0.829,64.815l-52.923,37.426c-5.201,3.678-7.863,9.989-6.867,16.282
+			c0.996,6.291,5.479,11.471,11.561,13.363l43.843,13.629L14.443,483.432c-6.535,6.534-6.535,17.131,0,23.666s17.131,6.535,23.666,0
+			l257.072-257.073l13.629,43.844c1.891,6.082,7.071,10.565,13.363,11.561c0.876,0.138,1.75,0.206,2.622,0.206
+			c5.375,0,10.494-2.595,13.66-7.072l37.426-52.923l64.815,0.828c0.071,0.001,0.143,0.001,0.214,0.001
+			c6.287,0,12.051-3.525,14.909-9.137C458.711,231.658,458.129,224.833,454.32,219.727z M367.51,212.063
+			c-5.516-0.077-10.697,2.574-13.876,7.071l-22.929,32.421c-12.767-41.075-12.097-40.949-15.933-44.786
+			c-4.112-4.112-4.736-3.485-44.786-15.934l32.423-22.928c4.496-3.181,7.14-8.37,7.071-13.876l-0.508-39.706l31.825,23.748
+			c4.415,3.294,10.167,4.206,15.382,2.437l37.606-12.753l-12.753,37.607c-1.769,5.217-0.859,10.969,2.437,15.382l23.748,31.825
+			L367.51,212.063z"
+          />
+        </g>
+      </g>
+      <g>
+        <g>
+          <polygon
+            points="173.373,67.274 160.014,42.848 146.656,67.274 122.23,80.632 146.656,93.992 160.014,118.417 173.373,93.992 
+			197.799,80.632 		"
+          />
+        </g>
+      </g>
+      <g>
+        <g>
+          <polygon
+            points="362.946,384.489 352.14,364.731 341.335,384.489 321.577,395.294 341.335,406.1 352.14,425.856 362.946,406.1 
+			382.703,395.294 		"
+          />
+        </g>
+      </g>
+      <g>
+        <g>
+          <polygon
+            points="378.142,19.757 367.337,0 356.531,19.757 336.774,30.563 356.531,41.369 367.337,61.126 378.142,41.369 
+			397.9,30.563 		"
+          />
+        </g>
+      </g>
+      <g>
+        <g>
+          <polygon
+            points="490.635,142.513 484.167,130.689 477.701,142.513 465.876,148.979 477.701,155.446 484.167,167.27 
+			490.635,155.446 502.458,148.979 		"
+          />
+        </g>
+      </g>
+      <g>
+        <g>
+          <polygon
+            points="492.626,294.117 465.876,301.951 439.128,294.117 446.962,320.865 439.128,347.615 465.876,339.781 
+			492.626,347.615 484.791,320.865 		"
+          />
+        </g>
+      </g>
+    </svg>
+  );
+}
+
+export function PageWizardLogo() {
+  return (
+    <svg
+      width="60"
+      height="60"
+      fill="white"
+      xmlns="http://www.w3.org/2000/svg"
+      viewBox="0 0 46.05 48.36"
+      className="transition-all duration-300 ease-linear"
+    >
+      <g>
+        <path d="M45.4,18.34h-1.53c-.3,0-.55.25-.55.55s.25.55.55.55h1.53c.3,0,.55-.25.55-.55s-.25-.55-.55-.55Z"></path>
+        <path d="M45.4,20.96h-1.53c-.3,0-.55.25-.55.55s.25.55.55.55h1.53c.3,0,.55-.25.55-.55s-.25-.55-.55-.55Z"></path>
+        <path d="M31.05,43.46h-1.83c-.3,0-.55.25-.55.55s.25.55.55.55h1.83c.3,0,.55-.25.55-.55s-.25-.55-.55-.55Z"></path>
+        <path d="M31.05,45.36h-1.83c-.3,0-.55.25-.55.55s.25.55.55.55h1.83c.3,0,.55-.25.55-.55s-.25-.55-.55-.55Z"></path>
+        <path d="M31.05,47.26h-1.83c-.3,0-.55.25-.55.55s.25.55.55.55h1.83c.3,0,.55-.25.55-.55s-.25-.55-.55-.55Z"></path>
+        <path d="M17.48,43.46h-1.83c-.3,0-.55.25-.55.55s.25.55.55.55h1.83c.3,0,.55-.25.55-.55s-.25-.55-.55-.55Z"></path>
+        <path d="M17.48,45.36h-1.83c-.3,0-.55.25-.55.55s.25.55.55.55h1.83c.3,0,.55-.25.55-.55s-.25-.55-.55-.55Z"></path>
+        <path d="M17.48,47.26h-1.83c-.3,0-.55.25-.55.55s.25.55.55.55h1.83c.3,0,.55-.25.55-.55s-.25-.55-.55-.55Z"></path>
+        <path d="M44.5,25.33h-1.53c-.3,0-.55.25-.55.55s.25.55.55.55h1.53c.3,0,.55-.25.55-.55s-.25-.55-.55-.55Z"></path>
+        <path d="M44.5,27.95h-1.53c-.3,0-.55.25-.55.55s.25.55.55.55h1.53c.3,0,.55-.25.55-.55s-.25-.55-.55-.55Z"></path>
+        <path d="M10.28,31.16c0-.63-.51-1.14-1.14-1.14s-1.14.51-1.14,1.14.51,1.14,1.14,1.14,1.14-.51,1.14-1.14Z"></path>
+        <ellipse cx="1.39" cy="23.4" rx="1.14" ry="1.14"></ellipse>
+        <ellipse cx="1.14" cy="18.37" rx="1.14" ry="1.14"></ellipse>
+        <path d="M5.49,34.6c-.63,0-1.14.51-1.14,1.14s.51,1.14,1.14,1.14,1.14-.51,1.14-1.14-.51-1.14-1.14-1.14Z"></path>
+        <ellipse cx="16.56" cy="10.01" rx="1.14" ry="1.14"></ellipse>
+        <ellipse cx="14.51" cy="3.52" rx="1.14" ry="1.14"></ellipse>
+        <path d="M7.82,8.7c.06,0,.11-.01.15-.03.01,0,.03,0,.04-.01l1.78,1.97c-.05.13-.07.25-.07.36,0,.63.51,1.14,1.14,1.14s1.14-.51,1.14-1.14-.51-1.14-1.14-1.14c-.08,0-.15.02-.21.04,0,0-.02,0-.03,0l-1.74-1.93c.05-.13.08-.27.08-.42,0-.63-.51-1.14-1.14-1.14s-1.14.51-1.14,1.14.51,1.14,1.14,1.14Z"></path>
+        <path d="M8.12,16c0-.17-.08-.33-.21-.43l-3.13-2.43s0-.02,0-.02c0-.03.02-.06.02-.09,0-.63-.51-1.14-1.14-1.14s-1.14.51-1.14,1.14.51,1.14,1.14,1.14c.16,0,.31-.04.48-.12l2.88,2.23v8.98l-3.5,3.05s-.03,0-.04-.01c-.06-.02-.13-.04-.2-.04-.63,0-1.14.51-1.14,1.14s.51,1.14,1.14,1.14,1.14-.51,1.14-1.14c0-.11-.02-.23-.07-.36l3.58-3.12c.12-.11.19-.26.19-.41v-9.5Z"></path>
+        <path d="M29.14,37.09v-4.15c1.03-.63,1.96-1.41,2.75-2.32h4.19c.16,0,.3-.07.41-.18l3.89-4.32c.09-.1.14-.24.14-.38l-.11-6.71c.36-.21.58-.58.58-.98,0-.63-.51-1.14-1.14-1.14s-1.14.51-1.14,1.14c0,.41.23.78.59.99l.11,6.5-3.59,3.98h-3.08c1.38-2.01,2.11-4.35,2.11-6.78,0-6.59-5.32-11.95-11.86-11.95-.31,0-.61.02-.9.04V3.31c.37-.2.6-.58.6-.99,0-.63-.51-1.14-1.14-1.14s-1.14.51-1.14,1.14c0,.4.21.76.57.97v7.68c-2.72.47-5.21,1.89-7.02,4.01-1.84,2.16-2.85,4.91-2.85,7.75,0,3.04,1.15,5.94,3.23,8.17,0,0,0,0,0,0,0,.03-.01.05-.01.09v3.4l-3.91,3.32c-.15-.06-.29-.09-.44-.09-.63,0-1.14.51-1.14,1.14s.51,1.14,1.14,1.14,1.14-.51,1.14-1.14c0-.05-.01-.09-.02-.13,0-.01,0-.02,0-.04l4.15-3.53c.12-.1.19-.26.19-.42v-2.71c.95.79,2.02,1.43,3.19,1.9v5.31l-2.23,2.46c-.2.22-.19.57.04.78.1.09.23.14.37.14.15,0,.3-.07.41-.18l2.37-2.61c.09-.1.14-.23.14-.37v-5.14c1.08.31,2.17.47,3.27.47.02,0,.03,0,.05,0v13.12c0,.3.25.55.55.55s.55-.25.55-.55v-13.18c1.34-.13,2.66-.5,3.9-1.09v3.56c0,.3.25.55.55.55s.55-.25.55-.55ZM33.75,22.74c0,5.98-4.83,10.85-10.76,10.85s-10.76-4.87-10.76-10.85,4.83-10.85,10.76-10.85,10.76,4.87,10.76,10.85Z"></path>
+        <path d="M42.45,32.42l-5.81,6.04h-3.46c-.14,0-.28.06-.39.16l-1.19,1.17s-.03,0-.04-.01c-.06-.02-.11-.03-.18-.03-.63,0-1.14.51-1.14,1.14s.51,1.14,1.14,1.14,1.14-.51,1.14-1.14c0-.12-.02-.25-.07-.38l.96-.94h3.47c.15,0,.29-.06.4-.17l5.97-6.21c.1-.11.16-.25.15-.39s-.06-.28-.17-.39c-.22-.21-.56-.2-.78.01Z"></path>
+        <path d="M26.92,5.8c.3,0,.55-.25.55-.55v-2.82c0-.3-.25-.55-.55-.55s-.55.25-.55.55v2.82c0,.3.25.55.55.55Z"></path>
+        <rect x="26.61" y="17.46" width="2.63" height="9.29"></rect>
+        <path d="M19.17,17.46l-4.1,9.29h2.68l.72-1.8h3.94l.72,1.8h2.73l-4.11-9.29h-2.59ZM19.25,23l1.19-2.97,1.19,2.97h-2.38Z"></path>
+        <path d="M41.16,3.12c.87.24,1.45.79,1.71,1.65.1.31.17.62.25.94,0,.02.02.03.02.05.09-.31.17-.62.26-.93.22-.8.73-1.35,1.52-1.63.27-.09.55-.15.83-.22.11-.03.21-.05.32-.08-.03-.01-.04-.02-.05-.02-.3-.08-.6-.15-.89-.23-.83-.23-1.4-.75-1.67-1.56-.1-.3-.17-.61-.25-.92-.02-.05-.03-.1-.04-.15-.02.01-.02.02-.02.03-.08.29-.15.58-.23.88-.21.81-.71,1.36-1.51,1.66-.2.07-.42.12-.63.17-.17.05-.35.09-.54.14h0s.04.03.05.03c.3.08.59.15.89.23Z"></path>
+        <path d="M31.32,8.28c2.09.57,3.47,1.9,4.1,3.96.23.75.4,1.51.6,2.26.01.04.02.08.03.11.21-.76.4-1.5.61-2.25.54-1.93,1.75-3.25,3.64-3.93.64-.23,1.32-.36,1.99-.54.25-.07.5-.13.77-.2-.06-.02-.09-.03-.12-.04-.71-.19-1.43-.36-2.15-.56-2-.55-3.36-1.79-4.02-3.75-.25-.72-.4-1.47-.6-2.22-.03-.12-.07-.24-.1-.36-.03.02-.03.04-.04.06-.18.7-.37,1.41-.56,2.11-.52,1.94-1.73,3.28-3.63,3.98-.49.18-1.01.28-1.51.42-.42.11-.84.22-1.29.33h0c.07.03.1.03.13.04.71.18,1.43.36,2.14.55Z"></path>
+        <path d="M45.1,12.83c-.83-.23-1.4-.75-1.67-1.56-.1-.3-.17-.61-.25-.92-.02-.05-.03-.1-.04-.15-.02.01-.02.02-.02.03-.08.29-.15.58-.23.88-.21.81-.71,1.36-1.51,1.66-.2.07-.42.12-.63.17-.17.05-.35.09-.54.14h0s.04.03.05.03c.3.08.59.15.89.23.87.24,1.45.79,1.71,1.65.1.31.17.62.25.94,0,.02.02.03.02.05.09-.31.17-.62.26-.93.22-.8.73-1.35,1.52-1.63.27-.09.55-.15.83-.22.11-.03.21-.05.32-.08-.03-.01-.04-.02-.05-.02-.3-.08-.6-.15-.89-.23Z"></path>
+      </g>
+    </svg>
+  );
+}
+
+export function UploadCloudIcon() {
+  return (
+    <svg
+      width="42"
+      height="42"
+      viewBox="0 0 42 42"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <g clipPath="url(#clip0_237_1224)">
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M11.5658 3.52275C14.1894 1.26035 17.5356 0.0108636 21 0C28.0613 0 33.9229 5.25 34.5608 12.0199C38.7397 12.6105 42 16.1096 42 20.4041C42 25.1186 38.0677 28.875 33.3034 28.875H26.25C25.9019 28.875 25.5681 28.7367 25.3219 28.4906C25.0758 28.2444 24.9375 27.9106 24.9375 27.5625C24.9375 27.2144 25.0758 26.8806 25.3219 26.6344C25.5681 26.3883 25.9019 26.25 26.25 26.25H33.306C36.6949 26.25 39.375 23.5935 39.375 20.4041C39.375 17.2121 36.6975 14.5556 33.3034 14.5556H31.9909V13.2431C31.9935 7.41563 27.111 2.625 21 2.625C18.1647 2.63633 15.4267 3.66039 13.2799 5.5125C11.2928 7.224 10.2533 9.28725 10.2533 10.9069V12.0829L9.08512 12.2115C5.418 12.6131 2.625 15.624 2.625 19.2097C2.625 23.0606 5.85375 26.25 9.92513 26.25H15.75C16.0981 26.25 16.4319 26.3883 16.6781 26.6344C16.9242 26.8806 17.0625 27.2144 17.0625 27.5625C17.0625 27.9106 16.9242 28.2444 16.6781 28.4906C16.4319 28.7367 16.0981 28.875 15.75 28.875H9.92513C4.4835 28.875 0 24.5858 0 19.2097C0 14.5819 3.32325 10.7494 7.72275 9.77812C8.09812 7.51275 9.555 5.25525 11.5658 3.52275Z"
+          fill="#69635F"
+        />
+        <path
+          fillRule="evenodd"
+          clipRule="evenodd"
+          d="M20.0699 10.8827C20.1918 10.7604 20.3366 10.6635 20.4961 10.5973C20.6555 10.5311 20.8265 10.4971 20.9991 10.4971C21.1718 10.4971 21.3427 10.5311 21.5022 10.5973C21.6616 10.6635 21.8065 10.7604 21.9284 10.8827L29.8034 18.7577C30.0498 19.0041 30.1883 19.3384 30.1883 19.6869C30.1883 20.0355 30.0498 20.3697 29.8034 20.6162C29.5569 20.8626 29.2227 21.0011 28.8741 21.0011C28.5256 21.0011 28.1913 20.8626 27.9449 20.6162L22.3116 14.9803V38.0619C22.3116 38.41 22.1733 38.7439 21.9272 38.99C21.6811 39.2361 21.3472 39.3744 20.9991 39.3744C20.651 39.3744 20.3172 39.2361 20.071 38.99C19.8249 38.7439 19.6866 38.41 19.6866 38.0619V14.9803L14.0534 20.6162C13.8069 20.8626 13.4727 21.0011 13.1241 21.0011C12.7756 21.0011 12.4413 20.8626 12.1949 20.6162C11.9484 20.3697 11.81 20.0355 11.81 19.6869C11.81 19.3384 11.9484 19.0041 12.1949 18.7577L20.0699 10.8827Z"
+          fill="#69635F"
+        />
+      </g>
+      <defs>
+        <clipPath id="clip0_237_1224">
+          <rect width="42" height="42" fill="white" />
+        </clipPath>
+      </defs>
+    </svg>
+  );
+}
+export function SparkleIconBig() {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      width="80"
+      height="75"
+      viewBox="10 20 50 50"
+      stroke="currentColor"
+      fill="currentColor"
+    >
+      <path d="M32.4918 26.0411L33.5 21L34.5082 26.0411C36.3703 35.3518 43.6482 42.6297 52.9589 44.4918L58 45.5L52.9589 46.5082C43.6482 48.3703 36.3703 55.6482 34.5082 64.9589L33.5 70L32.4918 64.9589C30.6297 55.6482 23.3518 48.3703 14.0411 46.5082L9 45.5L14.0411 44.4918C23.3518 42.6297 30.6297 35.3518 32.4918 26.0411Z" />
+    </svg>
+  );
+}
+
+export function SparkleIconSmall() {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      width="40"
+      height="35"
+      viewBox="15 20 40 50"
+      stroke="currentColor"
+      fill="currentColor"
+    >
+      <path d="M32.4918 26.0411L33.5 21L34.5082 26.0411C36.3703 35.3518 43.6482 42.6297 52.9589 44.4918L58 45.5L52.9589 46.5082C43.6482 48.3703 36.3703 55.6482 34.5082 64.9589L33.5 70L32.4918 64.9589C30.6297 55.6482 23.3518 48.3703 14.0411 46.5082L9 45.5L14.0411 44.4918C23.3518 42.6297 30.6297 35.3518 32.4918 26.0411Z" />
+    </svg>
+  );
+}