@nexxtmove/ui 0.1.22 → 0.1.24

package/dist/nuxt.d.ts

@@ -0,0 +1 @@
+export { }

package/dist/nuxt.js

@@ -0,0 +1,49 @@
+import { defineNuxtModule as a, addComponent as c, addTemplate as s } from "@nuxt/kit";
+const i = "components/AnimatedNumber/AnimatedNumber.vue", m = "components/Button/Button.vue", x = "components/Calendar/Calendar.vue", p = "components/Chip/Chip.vue", u = "components/DatePicker/DatePicker.vue", d = "components/Header/Header.vue", r = "components/Icon/Icon.vue", l = "components/InfoBlock/InfoBlock.vue", v = "components/ProgressBar/ProgressBar.vue", S = "components/SocialIcons/SocialIcons.vue", N = "components/SocialMediaCustomTemplate/SocialMediaCustomTemplate.vue", f = "components/SocialMediaTemplate/SocialMediaTemplate.vue", C = "components/SocialMediaType/SocialMediaType.vue", M = "components/StepperHeader/StepperHeader.vue", T = {
+  NexxtAnimatedNumber: i,
+  NexxtButton: m,
+  NexxtCalendar: x,
+  NexxtChip: p,
+  NexxtDatePicker: u,
+  NexxtHeader: d,
+  NexxtIcon: r,
+  NexxtInfoBlock: l,
+  NexxtProgressBar: v,
+  NexxtSocialIcons: S,
+  NexxtSocialMediaCustomTemplate: N,
+  NexxtSocialMediaTemplate: f,
+  NexxtSocialMediaType: C,
+  NexxtStepperHeader: M
+}, I = a({
+  meta: {
+    name: "@nexxtmove/ui",
+    configKey: "nexxtmoveUi",
+    compatibility: {
+      nuxt: "^3.0.0 || ^4.0.0"
+    }
+  },
+  defaults: {
+    addCSS: !0
+  },
+  setup(e, o) {
+    for (const [t, n] of Object.entries(T))
+      c({
+        name: t,
+        export: "default",
+        filePath: `@nexxtmove/ui/${n}`
+      });
+    e.addCSS && (s({
+      filename: "nexxtmove-ui.css",
+      getContents: () => `
+@import "tailwindcss";
+@import "@nexxtmove/ui/theme";
+
+@source "../../node_modules/@nexxtmove/ui/dist/*.js";
+`,
+      write: !0
+    }), o.options.css.push("#build/nexxtmove-ui.css"));
+  }
+});
+export {
+  I as default
+};

package/package.json

@@ -1,20 +1,28 @@
 {
   "name": "@nexxtmove/ui",
   "type": "module",
-  "version": "0.1.22",
+  "version": "0.1.24",
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
       "import": "./dist/index.js"
     },
-    "./theme": "./tailwind/nexxtmove.tailwind.theme.css"
+    "./nuxt": {
+      "import": "./dist/nuxt.js"
+    },
+    "./theme": "./tailwind/nexxtmove.tailwind.theme.css",
+    "./components.json": "./src/components.json",
+    "./components/*": "./src/components/*"
   },
   "files": [
     "dist",
+    "src",
     "tailwind"
   ],
   "dependencies": {
-    "reka-ui": "^2.7.0"
+    "date-fns": "^4.1.0",
+    "date-fns-tz": "^3.2.0",
+    "reka-ui": "^2.9.2"
   },
   "peerDependencies": {
     "tailwindcss": "^4.0.0",
@@ -23,11 +31,14 @@
   "devDependencies": {
     "@awesome.me/kit-37b149f3ef": "^1.0.4",
     "@eslint/js": "^9.39.2",
-    "@storybook/addon-a11y": "^10.2.13",
-    "@storybook/addon-docs": "^10.2.13",
-    "@storybook/addon-vitest": "^10.2.13",
-    "@storybook/builder-vite": "^10.2.13",
-    "@storybook/vue3-vite": "^10.2.13",
+    "@nuxt/kit": "^4.3.1",
+    "@nuxt/schema": "^4.3.1",
+    "@storybook/addon-a11y": "^10.3.3",
+    "@storybook/addon-designs": "^11.1.2",
+    "@storybook/addon-docs": "^10.3.3",
+    "@storybook/addon-vitest": "^10.3.3",
+    "@storybook/builder-vite": "^10.3.3",
+    "@storybook/vue3-vite": "^10.3.3",
     "@tailwindcss/vite": "^4.1.18",
     "@types/node": "^25.0.3",
     "@types/react": "^19.2.8",
@@ -36,23 +47,23 @@
     "@vitest/coverage-v8": "^4.0.16",
     "@vue/eslint-config-typescript": "^14.6.0",
     "@vue/test-utils": "^2.4.6",
-    "@vue/tsconfig": "^0.8.1",
+    "@vue/tsconfig": "^0.9.0",
     "consola": "^3.4.2",
     "eslint": "^9.39.2",
     "eslint-config-prettier": "^10.1.8",
     "eslint-plugin-prettier": "^5.5.5",
-    "eslint-plugin-storybook": "10.2.13",
+    "eslint-plugin-storybook": "10.3.3",
     "eslint-plugin-vue": "^10.6.2",
     "globals": "^17.0.0",
-    "jsdom": "^27.4.0",
+    "jsdom": "^28.1.0",
     "prettier": "^3.7.4",
     "prettier-plugin-tailwindcss": "^0.7.2",
     "react": "^19.2.3",
     "react-dom": "^19.2.3",
     "remark-frontmatter": "^5.0.0",
-    "storybook": "^10.2.13",
+    "storybook": "^10.3.3",
     "typescript-eslint": "^8.52.0",
-    "vite": "^7.3.0",
+    "vite": "^7.3.1",
     "vite-plugin-dts": "^4.5.4",
     "vite-svg-loader": "^5.1.0",
     "vitest": "^4.0.16"

package/src/assets/svg/type_post.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg"  viewBox="0 0 716.872 800.535" xmlns:xlink="http://www.w3.org/1999/xlink" role="img" artist="Katerina Limpitsouni" source="https://undraw.co/"><g transform="translate(-765 -285)"><path d="M82.664,76.476a68.781,68.781,0,1,1,89.387,65.637l-13.3,87.874L90.972,173.5s14.643-18.652,22.5-39.683a68.706,68.706,0,0,1-30.8-57.341Z" transform="translate(801.236 288.373)" fill="#ed9da0"/><path d="M14.072,448.892l17.049-120.7L67.9,352.462,43.968,454.77c4.422,6.371,6.331,15.182,4.537,24.3-3.138,15.961-16.39,26.794-29.6,24.2S-2.467,485.63.671,469.669c1.794-9.122,6.9-16.554,13.4-20.777h0Z" transform="translate(765 428.86)" fill="#ed9da0"/><path d="M260.456,442.327l-17.049-120.7L206.625,345.9,230.56,448.2c-4.422,6.371-6.331,15.182-4.537,24.3,3.138,15.961,16.39,26.794,29.6,24.2s21.373-17.641,18.235-33.6c-1.794-9.122-6.9-16.554-13.4-20.777h0Z" transform="translate(855.574 425.982)" fill="#e09093"/><path d="M202.2,112.283l-80.27,11.8v21.407s-68.466-11.963-77.909,47.059V338.928L10.97,485.3l42.5,9.443,53.12-155.819,20.4,19.319h106.24L258.7,338.928l33.212,132.21,49.579-18.887L315.8,329.485s11.529-153.458-42.772-177.067-54.3-16.526-54.3-16.526L202.2,112.283Z" transform="translate(769.809 334.219)" fill="#e6e6e6"/><path d="M112.115,282.988l-9.444,25.97S31.845,377.423,46.01,554.49l231.367-7.083s33.052-188.871-44.857-243.171l-14.184-21.248H112.115Z" transform="translate(784.347 409.047)" fill="#090814"/><path d="M67.549,170.219s3.212,24.368,32.969,25.164L160.881,197S109.854,72.815,130.835,86.805s76.934-44.661,76.934-44.661l16.509,30.963s39.442-14.283-4.27-49.258c0,0-52.155-40.322-107.524-16.109S67.549,170.219,67.549,170.219h0Z" transform="translate(794.267 285)" fill="#090814"/><path d="M475.924,772.417l-329.553-90.5a14.737,14.737,0,0,1-10.3-18.093L298.45,72.546a14.737,14.737,0,0,1,18.093-10.3l329.554,90.5a14.737,14.737,0,0,1,10.3,18.093L494.017,762.12a14.737,14.737,0,0,1-18.093,10.3Z" transform="translate(824.416 312.055)" fill="#fff"/><path d="M475.924,772.417l-329.553-90.5a14.737,14.737,0,0,1-10.3-18.093L298.45,72.546a14.737,14.737,0,0,1,18.093-10.3l329.554,90.5a14.737,14.737,0,0,1,10.3,18.093L494.017,762.12a14.737,14.737,0,0,1-18.093,10.3Z" transform="translate(824.416 312.055)" fill="none" stroke="#2f2e41" stroke-miterlimit="10" stroke-width="1"/><path d="M476.388,502.565l-270.7-74.339a16.654,16.654,0,0,1-11.637-20.446l61.655-224.509a16.654,16.654,0,0,1,20.447-11.635l270.7,74.339a16.652,16.652,0,0,1,11.634,20.445L496.833,490.93A16.652,16.652,0,0,1,476.388,502.565Z" transform="translate(849.803 359.975)" fill="#6899FC"/><path d="M331.108,171.8l-73.547-20.2a7.11,7.11,0,0,1-4.968-8.728l4.695-17.1a7.11,7.11,0,0,1,8.729-4.968L339.564,141a7.109,7.109,0,0,1,4.965,8.728l-4.695,17.1a7.109,7.109,0,0,1-8.726,4.967Z" transform="translate(875.612 337.844)" fill="#d6d6e3"/><path d="M331.763,132.1l-65.375-17.953a6.022,6.022,0,0,1-4.208-7.394l3.86-14.056a6.022,6.022,0,0,1,7.394-4.209l65.375,17.953a6.022,6.022,0,0,1,4.207,7.4l-3.86,14.056a6.022,6.022,0,0,1-7.394,4.208Z" transform="translate(879.831 323.692)" fill="#d6d6e3"/><path d="M404.249,191.881l-73.547-20.2a7.11,7.11,0,0,1-4.968-8.728l4.695-17.1a7.11,7.11,0,0,1,8.729-4.968l73.547,20.2a7.109,7.109,0,0,1,4.965,8.728l-4.695,17.1a7.109,7.109,0,0,1-8.726,4.967Z" transform="translate(907.673 346.648)" fill="#d6d6e3"/><path d="M477.39,211.967l-73.547-20.2a7.11,7.11,0,0,1-4.968-8.728l4.695-17.1a7.11,7.11,0,0,1,8.729-4.968l73.547,20.2a7.109,7.109,0,0,1,4.965,8.728L486.116,207a7.109,7.109,0,0,1-8.726,4.967Z" transform="translate(939.734 355.453)" fill="#d6d6e3"/><path d="M196.661,423.849a22.618,22.618,0,1,1,27.8-15.821A22.644,22.644,0,0,1,196.661,423.849Z" transform="translate(843.915 451.317)" fill="#6899FC"/><path d="M386.282,495.391,178.444,438.314a10.644,10.644,0,1,1,5.637-20.527L391.92,474.863a10.644,10.644,0,1,1-5.637,20.527Z" transform="translate(839.79 467.968)" fill="#d6d6e3"/><path d="M380.071,521.5,172.232,464.426A10.644,10.644,0,1,1,177.87,443.9l207.838,57.077a10.644,10.644,0,1,1-5.637,20.527Z" transform="translate(837.067 479.414)" fill="#d6d6e3"/><path d="M298.165,526.827,166.021,490.538a10.644,10.644,0,1,1,5.637-20.527L303.8,506.3a10.644,10.644,0,1,1-5.637,20.527Z" transform="translate(834.344 490.86)" fill="#d6d6e3"/></g></svg>

package/src/assets/svg/type_reel.svg

@@ -0,0 +1,54 @@
+<svg viewBox="0 0 494 664" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_544_535)">
+<path d="M331.263 157.737H327.615V57.826C327.615 50.2322 326.12 42.7127 323.214 35.697C320.308 28.6812 316.048 22.3065 310.679 16.9369C305.309 11.5672 298.934 7.30779 291.919 4.40176C284.903 1.49572 277.383 6.56612e-06 269.79 0H58.1138C42.7774 -1.5913e-05 28.0692 6.09233 17.2247 16.9368C6.38021 27.7812 0.287829 42.4894 0.287781 57.8258V605.947C0.287781 621.284 6.38012 635.992 17.2246 646.836C28.069 657.681 42.7773 663.773 58.1137 663.773H269.789C285.126 663.773 299.834 657.681 310.678 646.836C321.523 635.992 327.615 621.284 327.615 605.947V228.856H331.263V157.737Z" fill="#3F3D56"/>
+<path d="M315.309 58.23V605.55C315.309 606.35 315.289 607.14 315.238 607.93C314.633 618.955 309.825 629.329 301.805 636.918C293.784 644.507 283.161 648.734 272.119 648.73H59.4284C48.3601 648.733 37.7136 644.484 29.6887 636.861C21.6638 629.238 16.8739 618.824 16.3088 607.77C16.2688 607.04 16.2487 606.3 16.2487 605.55V58.23C16.2476 46.7767 20.7961 35.792 28.8939 27.6924C36.9916 19.5927 47.9752 15.0415 59.4284 15.04H85.2385C83.9677 18.1551 83.4824 21.5349 83.8253 24.8817C84.1682 28.2285 85.3288 31.4397 87.2048 34.2324C89.0808 37.0252 91.6147 39.3138 94.5833 40.8968C97.552 42.4797 100.864 43.3084 104.229 43.31H225.499C228.863 43.3082 232.175 42.4793 235.144 40.8962C238.112 39.3132 240.646 37.0246 242.522 34.2319C244.398 31.4392 245.558 28.2282 245.901 24.8815C246.244 21.5348 245.759 18.1551 244.488 15.04H272.119C283.573 15.0411 294.558 19.5919 302.657 27.6913C310.757 35.7907 315.308 46.7756 315.309 58.23Z" fill="white"/>
+<path d="M311.381 471H20.1695C19.1465 470.999 18.1657 470.592 17.4423 469.869C16.7189 469.146 16.3119 468.165 16.3107 467.142V109.869C16.312 108.846 16.7189 107.865 17.4423 107.142C18.1657 106.418 19.1465 106.012 20.1695 106.01H311.381C312.404 106.011 313.384 106.418 314.108 107.142C314.831 107.865 315.238 108.846 315.24 109.869V467.142C315.238 468.165 314.831 469.146 314.108 469.869C313.384 470.592 312.404 470.999 311.381 471Z" fill="#F0F0F0"/>
+<path d="M290.008 130.94H42.1384C41.1149 130.941 40.1334 131.348 39.4097 132.071C38.686 132.795 38.2791 133.776 38.2785 134.8V392.95C38.2812 393.972 38.6891 394.951 39.4126 395.673C40.1362 396.395 41.1164 396.8 42.1384 396.8H290.008C291.031 396.8 292.011 396.395 292.734 395.673C293.458 394.951 293.866 393.972 293.869 392.95V134.8C293.868 133.776 293.461 132.795 292.737 132.071C292.014 131.347 291.032 130.941 290.008 130.94Z" fill="white"/>
+<path d="M37.8386 93C43.3614 93 47.8386 88.5228 47.8386 83C47.8386 77.4772 43.3614 73 37.8386 73C32.3157 73 27.8386 77.4772 27.8386 83C27.8386 88.5228 32.3157 93 37.8386 93Z" fill="#D300C5"/>
+<path d="M85.4037 409.529C68.3279 382.027 74.2118 346.892 77.0862 314.648C81.3795 266.271 77.5055 217.517 65.6263 170.425C79.7756 186.226 89.1116 205.742 92.5336 226.674C95.3525 244.129 93.9597 262.086 97.1529 279.476C104 316.764 131.574 350.393 127.307 388.064C126.363 396.391 123.19 405.346 115.797 409.292C107.453 413.746 97.2669 410.203 88.5135 406.618" fill="#F0F0F0"/>
+<path d="M56.5858 420.945C54.7159 419.065 52.176 418.006 49.5249 417.999C46.8738 417.993 44.3286 419.039 42.4493 420.909C40.57 422.779 39.5104 425.319 39.5038 427.97C39.4971 430.621 40.5439 433.166 42.4138 435.046L42.4482 435.08L56.5858 449.216L70.7235 435.08C72.5898 433.204 73.6358 430.664 73.6322 428.017C73.6285 425.371 72.5754 422.833 70.7039 420.962C68.8323 419.091 66.295 418.038 63.6484 418.035C61.0019 418.032 58.462 419.078 56.5858 420.945Z" fill="#D300C5"/>
+<path d="M100.586 420.945C98.7159 419.065 96.176 418.006 93.5249 417.999C90.8738 417.993 88.3286 419.039 86.4493 420.909C84.57 422.779 83.5104 425.319 83.5038 427.97C83.4971 430.621 84.5439 433.166 86.4138 435.046L86.4482 435.08L100.586 449.216L114.723 435.08C116.59 433.204 117.636 430.664 117.632 428.017C117.628 425.371 116.575 422.833 114.704 420.962C112.832 419.091 110.295 418.038 107.648 418.035C105.002 418.032 102.462 419.078 100.586 420.945Z" fill="#D300C5"/>
+<path d="M144.586 420.945C142.716 419.065 140.176 418.006 137.525 417.999C134.874 417.993 132.329 419.039 130.449 420.909C128.57 422.779 127.51 425.319 127.504 427.97C127.497 430.621 128.544 433.166 130.414 435.046L130.448 435.08L144.586 449.216L158.723 435.08C160.59 433.204 161.636 430.664 161.632 428.017C161.628 425.371 160.575 422.833 158.704 420.962C156.832 419.091 154.295 418.038 151.648 418.035C149.002 418.032 146.462 419.078 144.586 420.945Z" fill="#D300C5"/>
+<path d="M222.307 90.8424H81.2918C80.2777 90.8436 79.2734 90.6448 78.3362 90.2576C77.399 89.8703 76.5473 89.3021 75.8298 88.5854C75.1123 87.8688 74.5432 87.0177 74.1548 86.081C73.7665 85.1442 73.5666 84.1401 73.5666 83.126C73.5666 82.1119 73.7665 81.1078 74.1548 80.171C74.5432 79.2343 75.1123 78.3832 75.8298 77.6666C76.5473 76.9499 77.399 76.3817 78.3362 75.9944C79.2734 75.6072 80.2777 75.4084 81.2918 75.4096H222.307C223.321 75.4084 224.325 75.6072 225.262 75.9944C226.199 76.3817 227.051 76.9499 227.769 77.6666C228.486 78.3832 229.055 79.2343 229.444 80.171C229.832 81.1078 230.032 82.1119 230.032 83.126C230.032 84.1401 229.832 85.1442 229.444 86.081C229.055 87.0177 228.486 87.8688 227.769 88.5854C227.051 89.3021 226.199 89.8703 225.262 90.2576C224.325 90.6448 223.321 90.8436 222.307 90.8424Z" fill="#D300C5"/>
+<path d="M311.379 538.01H20.1686C19.1451 538.011 18.1637 538.418 17.4399 539.141C16.7162 539.865 16.3093 540.846 16.3087 541.87V607.77C16.8739 618.824 21.6638 629.238 29.6886 636.861C37.7135 644.484 48.3601 648.733 59.4284 648.73H272.119C283.161 648.734 293.784 644.507 301.805 636.918C309.825 629.329 314.633 618.955 315.238 607.93V541.87C315.238 540.846 314.831 539.865 314.107 539.141C313.384 538.418 312.402 538.011 311.379 538.01Z" fill="#F0F0F0"/>
+<path d="M290.008 562.94H42.1384C41.1149 562.941 40.1334 563.348 39.4097 564.071C38.686 564.795 38.2791 565.776 38.2785 566.8V643.2C44.7336 646.837 52.0195 648.742 59.4284 648.73H272.119C279.762 648.741 287.269 646.714 293.869 642.86V566.8C293.868 565.776 293.461 564.795 292.737 564.071C292.014 563.347 291.032 562.941 290.008 562.94Z" fill="white"/>
+<path d="M37.8386 525C43.3614 525 47.8386 520.523 47.8386 515C47.8386 509.477 43.3614 505 37.8386 505C32.3157 505 27.8386 509.477 27.8386 515C27.8386 520.523 32.3157 525 37.8386 525Z" fill="#E4E4E4"/>
+<path d="M222.307 522.842H81.2918C80.2777 522.844 79.2734 522.645 78.3362 522.258C77.399 521.87 76.5473 521.302 75.8298 520.585C75.1123 519.869 74.5432 519.018 74.1548 518.081C73.7665 517.144 73.5666 516.14 73.5666 515.126C73.5666 514.112 73.7665 513.108 74.1548 512.171C74.5432 511.234 75.1123 510.383 75.8298 509.667C76.5473 508.95 77.399 508.382 78.3362 507.994C79.2734 507.607 80.2777 507.408 81.2918 507.41H222.307C223.321 507.408 224.325 507.607 225.262 507.994C226.199 508.382 227.051 508.95 227.769 509.667C228.486 510.383 229.055 511.234 229.444 512.171C229.832 513.108 230.032 514.112 230.032 515.126C230.032 516.14 229.832 517.144 229.444 518.081C229.055 519.018 228.486 519.869 227.769 520.585C227.051 521.302 226.199 521.87 225.262 522.258C224.325 522.645 223.321 522.844 222.307 522.842Z" fill="#E4E4E4"/>
+<path d="M142.598 648.73H69.3288C76.7888 634.05 90.5588 622.09 106.789 621.46C109.235 621.369 111.683 621.55 114.089 622C115.098 622.18 116.089 622.42 117.079 622.68C123.304 624.281 128.973 627.555 133.471 632.147C137.969 636.738 141.125 642.473 142.598 648.73Z" fill="#F2F2F2"/>
+<path d="M259.789 648.73H160.299C161.827 644.165 163.125 639.525 164.189 634.83C168.658 615.52 173.209 593.84 189.698 582.86C198.879 576.74 210.049 575.74 220.638 578.44C220.959 578.52 221.289 578.61 221.609 578.71C234.1 582.175 244.822 590.228 251.629 601.26C260.059 615.4 261.939 632.22 259.789 648.73Z" fill="#F2F2F2"/>
+<path d="M118.109 636.94C118.061 640.891 117.71 644.833 117.059 648.73H114.198C115.702 639.88 115.665 630.837 114.089 622C115.098 622.18 116.089 622.42 117.079 622.68C117.837 627.394 118.181 632.166 118.109 636.94Z" fill="white"/>
+<path d="M221.979 579.63C221.988 581.79 221.979 583.96 221.919 586.13C221.477 604.17 218.79 622.085 213.919 639.46C213.059 642.56 212.129 645.65 211.129 648.73H208.189C209.989 643.25 211.559 637.7 212.919 632.14C217.125 615.074 219.221 597.557 219.158 579.98C219.16 579.582 219.315 579.201 219.591 578.914C219.866 578.628 220.241 578.458 220.638 578.44C220.985 578.402 221.332 578.498 221.609 578.71C221.738 578.824 221.839 578.966 221.903 579.126C221.967 579.286 221.993 579.458 221.979 579.63Z" fill="white"/>
+<path d="M274.792 598.066C278.106 598.066 280.792 595.379 280.792 592.066C280.792 588.752 278.106 586.066 274.792 586.066C271.478 586.066 268.792 588.752 268.792 592.066C268.792 595.379 271.478 598.066 274.792 598.066Z" fill="#F2F2F2"/>
+<path d="M130.973 160.198C134.287 160.198 136.973 157.511 136.973 154.198C136.973 150.884 134.287 148.198 130.973 148.198C127.659 148.198 124.973 150.884 124.973 154.198C124.973 157.511 127.659 160.198 130.973 160.198Z" fill="#D300C5"/>
+<path d="M241.973 195.198C245.287 195.198 247.973 192.511 247.973 189.198C247.973 185.884 245.287 183.198 241.973 183.198C238.659 183.198 235.973 185.884 235.973 189.198C235.973 192.511 238.659 195.198 241.973 195.198Z" fill="#E4E4E4"/>
+<path d="M238.973 317.198C242.287 317.198 244.973 314.511 244.973 311.198C244.973 307.884 242.287 305.198 238.973 305.198C235.659 305.198 232.973 307.884 232.973 311.198C232.973 314.511 235.659 317.198 238.973 317.198Z" fill="#E4E4E4"/>
+<path d="M212.419 374.38L208.359 361.38C207.661 358.355 206.776 355.376 205.709 352.46C201.129 338.62 191.069 310.71 179.218 281.55L165.278 267.61L161.419 265.09L157.769 262.72L156.198 264.17L141.229 277.99L141.119 278.9L131.339 362.02C131.339 362.02 131.309 362.25 131.258 362.7C131.149 363.67 130.919 365.65 130.619 368.48C130.049 373.8 129.129 383.09 128.218 394.8H218.789L212.419 374.38Z" fill="#3F3D56"/>
+<path opacity="0.2" d="M148.236 315.262L144.435 338.977L170.157 349.587L148.236 315.262Z" fill="black"/>
+<path d="M194.289 209.15C189.614 204.045 183.507 200.472 176.766 198.899C170.026 197.326 162.967 197.826 156.516 200.334C150.065 202.842 144.522 207.242 140.615 212.955C136.707 218.668 134.617 225.428 134.619 232.35V257.98C134.619 259.205 135.106 260.38 135.972 261.246C136.839 262.112 138.013 262.599 139.238 262.6H198.709C199.932 262.597 201.105 262.109 201.969 261.243C202.833 260.377 203.319 259.204 203.319 257.98V232.35C203.322 223.758 200.1 215.479 194.289 209.15Z" fill="#2F2E41"/>
+<path d="M175.537 261.051C189.445 261.051 200.72 249.777 200.72 235.868C200.72 221.96 189.445 210.685 175.537 210.685C161.629 210.685 150.354 221.96 150.354 235.868C150.354 249.777 161.629 261.051 175.537 261.051Z" fill="#FFB8B8"/>
+<path d="M194.289 209.15C191.105 207.878 187.707 207.226 184.279 207.23H179.149C174.829 207.231 170.572 208.263 166.731 210.24C162.891 212.218 159.578 215.084 157.069 218.6C156.899 218.82 156.749 219.05 156.598 219.27C153.58 223.738 151.971 229.008 151.979 234.4V234.91H162.809L166.509 224.56L167.249 234.91H172.848L174.709 229.69L175.079 234.91C186.789 239.238 198.939 238.961 211.448 234.91V234.4C211.443 228.958 209.804 223.642 206.745 219.141C203.686 214.639 199.347 211.159 194.289 209.15Z" fill="#2F2E41"/>
+<path d="M178.948 260.82C178.926 260.762 178.899 260.705 178.869 260.65C175.479 254.19 171.229 244.3 170.988 234.91C170.848 229.3 172.149 223.86 175.928 219.45L176.649 218.6H147.339V262.61L156.198 264.17L161.419 265.09L173.968 267.31C174.239 267.358 174.514 267.382 174.789 267.38C175.515 267.379 176.23 267.207 176.877 266.877C177.523 266.546 178.082 266.068 178.508 265.48C179.125 264.65 179.436 263.633 179.388 262.6C179.37 261.982 179.22 261.375 178.948 260.82Z" fill="#2F2E41"/>
+<path opacity="0.2" d="M131.95 360.864C138.652 368.624 147.743 373.938 157.794 375.97C167.846 378.001 178.287 376.635 187.477 372.087L192.958 369.375L131.95 360.864Z" fill="black"/>
+<path d="M415.953 436.692C416.035 434.963 416.495 433.273 417.301 431.741C418.106 430.209 419.238 428.873 420.616 427.826C421.994 426.779 423.585 426.046 425.277 425.68C426.968 425.315 428.72 425.324 430.407 425.709L446.063 403.645L461.792 409.889L439.245 440.736C438.411 443.529 436.583 445.918 434.105 447.452C431.628 448.986 428.674 449.558 425.803 449.059C422.932 448.561 420.343 447.026 418.528 444.747C416.713 442.468 415.797 439.601 415.953 436.692Z" fill="#A0616A"/>
+<path d="M433.128 417.717L460.963 370.901L449.623 340.659L465.068 299.469L465.638 299.714C466.011 299.874 474.788 303.79 476.089 317.815L493.839 373.6L446.466 435.057L433.128 417.717Z" fill="#3F3D56"/>
+<path d="M281.95 245.608C283.667 245.823 285.316 246.412 286.781 247.334C288.246 248.256 289.491 249.487 290.429 250.942C291.366 252.397 291.973 254.04 292.207 255.755C292.441 257.47 292.296 259.215 291.782 260.868L312.57 278.183L305.128 293.381L276.116 268.517C273.397 267.47 271.156 265.462 269.818 262.873C268.48 260.285 268.138 257.295 268.857 254.471C269.577 251.648 271.306 249.186 273.719 247.552C276.132 245.918 279.061 245.227 281.95 245.608Z" fill="#A0616A"/>
+<path d="M299.54 264.198L344.063 295.57L375.092 286.601L414.964 305.185L414.676 305.734C414.488 306.094 409.905 314.542 395.821 314.754L338.83 328.138L281.221 276.156L299.54 264.198Z" fill="#3F3D56"/>
+<path d="M381.01 645.697L365.531 645.696L358.167 585.993L381.012 585.994L381.01 645.697Z" fill="#A0616A"/>
+<path d="M349.799 641.274H384.326V660.069H335.679V655.393C335.679 651.648 337.167 648.057 339.815 645.409C342.463 642.761 346.054 641.274 349.799 641.274Z" fill="#2F2E41"/>
+<path d="M442.874 645.697L427.396 645.696L420.032 585.993L442.877 585.994L442.874 645.697Z" fill="#A0616A"/>
+<path d="M411.663 641.274H446.191V660.069H397.544V655.393C397.544 651.648 399.032 648.057 401.68 645.409C404.327 642.761 407.919 641.274 411.663 641.274Z" fill="#2F2E41"/>
+<path d="M448.379 427.774L447.117 516.153L445.854 632.307L418.078 629.782L404.19 469.438L386.515 629.782H357.839L354.951 468.176L365.051 432.825L448.379 427.774Z" fill="#2F2E41"/>
+<path d="M362.283 433.364L358.051 433.181L377.706 324.906L369.658 292.18C369.24 290.477 369.461 288.68 370.279 287.129C371.097 285.578 372.456 284.382 374.097 283.766L388.577 278.336L393.692 264.268L434.053 268.617L435.045 279.612C439.419 281.015 475.435 293.009 472.95 306.676C470.497 320.166 456.015 362.606 455.28 364.757L452.743 425.623L452.431 425.779C452.056 425.966 424.237 439.645 394.015 439.643C383.372 439.642 372.425 437.945 362.283 433.364Z" fill="#3F3D56"/>
+<path d="M437.789 242.186C445.487 228.103 440.312 210.446 426.229 202.748C412.147 195.05 394.49 200.226 386.792 214.308C379.094 228.391 384.27 246.047 398.352 253.745C412.434 261.443 430.091 256.268 437.789 242.186Z" fill="#A0616A"/>
+<path d="M435.829 256.377C430.291 262.277 420.006 259.11 419.284 251.051C419.228 250.425 419.232 249.795 419.297 249.17C419.669 245.6 421.732 242.359 421.238 238.59C421.126 237.652 420.776 236.758 420.222 235.993C415.809 230.083 405.449 238.636 401.285 233.286C398.731 230.006 401.733 224.841 399.773 221.175C397.186 216.336 389.525 218.723 384.72 216.073C379.375 213.124 379.694 204.923 383.213 199.934C387.505 193.85 395.029 190.603 402.459 190.136C409.89 189.668 417.269 191.676 424.206 194.38C432.088 197.451 439.904 201.696 444.754 208.627C450.653 217.055 451.22 228.386 448.27 238.241C446.476 244.237 440.351 251.56 435.829 256.377Z" fill="#2F2E41"/>
+<path d="M225.006 372.041H209.433C208.933 372.043 208.451 371.857 208.081 371.522C207.711 371.186 207.48 370.724 207.433 370.227L204.315 338.275H230.124L227.007 370.226C226.96 370.724 226.729 371.186 226.359 371.522C225.989 371.857 225.506 372.043 225.006 372.041Z" fill="#D300C5"/>
+<path d="M230.083 342.295H204.357C203.824 342.294 203.313 342.082 202.936 341.706C202.559 341.329 202.347 340.818 202.347 340.285V335.461C202.347 334.928 202.559 334.418 202.936 334.041C203.313 333.664 203.824 333.452 204.357 333.451H230.083C230.616 333.452 231.127 333.664 231.503 334.041C231.88 334.418 232.092 334.928 232.093 335.461V340.285C232.092 340.818 231.88 341.329 231.503 341.706C231.127 342.082 230.616 342.294 230.083 342.295Z" fill="#3F3D56"/>
+<path d="M219.581 355.067C218.458 353.805 217.071 352.804 215.519 352.136C213.968 351.468 212.288 351.148 210.599 351.199C208.911 351.25 207.254 351.67 205.745 352.431C204.236 353.192 202.913 354.274 201.868 355.602L176.441 348.463L168.334 362.857L204.384 372.433C206.73 374.041 209.585 374.733 212.407 374.376C215.229 374.02 217.823 372.641 219.696 370.5C221.569 368.359 222.592 365.606 222.571 362.762C222.55 359.917 221.486 357.179 219.581 355.067Z" fill="#FFB8B8"/>
+<path d="M178.238 347.26L166.169 339.57L162.729 337.95L147.178 330.62C147.638 329.04 148.959 324.32 150.209 318.34C153.129 304.35 155.619 283.46 145.569 279.8C144.144 279.262 142.641 278.958 141.119 278.9C139.082 278.826 137.061 279.288 135.259 280.24C127.729 284.17 124.739 295.23 124.629 295.64L115.319 321.19C114.459 322.37 105.609 334.63 107.039 343.71C107.219 345.014 107.667 346.267 108.355 347.389C109.044 348.512 109.958 349.479 111.039 350.23C117.483 354.849 124.239 359.015 131.259 362.7C132.888 363.54 134.482 364.317 136.039 365.03C144.759 369.01 152.448 371.04 158.908 371.04C161.021 371.057 163.127 370.812 165.178 370.31L190.269 369.74L190.428 369.02L190.488 368.74L193.819 353.34L194.759 348.98L178.238 347.26Z" fill="#3F3D56"/>
+</g>
+<defs>
+<clipPath id="clip0_544_535">
+<rect width="494" height="664" fill="white"/>
+</clipPath>
+</defs>
+</svg>

package/src/assets/svg/type_story.svg

@@ -0,0 +1,46 @@
+<svg viewBox="0 0 117 182" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_544_634)">
+<path d="M42.4513 0H99.1276C103.574 0.00484055 107.837 1.78168 110.98 4.94067C114.124 8.09965 115.893 12.3828 115.898 16.8502V21.9976C116.014 21.9654 116.136 21.9608 116.255 21.9842C116.373 22.0076 116.484 22.0583 116.58 22.1324C116.675 22.2065 116.752 22.3019 116.805 22.411C116.858 22.5202 116.884 22.6401 116.883 22.7613V26.7196C116.884 26.8408 116.857 26.9607 116.805 27.0699C116.752 27.179 116.675 27.2743 116.58 27.3484C116.484 27.4225 116.373 27.4732 116.254 27.4966C116.136 27.52 116.014 27.5155 115.898 27.4833V33.4762C116.014 33.444 116.136 33.4394 116.255 33.4628C116.373 33.4862 116.484 33.537 116.58 33.611C116.675 33.6851 116.752 33.7805 116.805 33.8896C116.858 33.9988 116.884 34.1187 116.883 34.2399V44.1359C116.884 44.2571 116.858 44.377 116.805 44.4862C116.752 44.5953 116.675 44.6907 116.58 44.7648C116.484 44.8388 116.373 44.8896 116.255 44.913C116.136 44.9364 116.014 44.9318 115.898 44.8996V48.518C116.014 48.4858 116.136 48.4812 116.255 48.5046C116.373 48.528 116.484 48.5787 116.58 48.6528C116.675 48.7269 116.752 48.8223 116.805 48.9314C116.858 49.0406 116.884 49.1605 116.883 49.2817V59.1776C116.884 59.2989 116.858 59.4188 116.805 59.528C116.752 59.6371 116.675 59.7325 116.58 59.8066C116.484 59.8806 116.373 59.9314 116.255 59.9548C116.136 59.9781 116.014 59.9736 115.898 59.9413V164.444C115.893 168.911 114.124 173.194 110.98 176.353C107.836 179.512 103.574 181.289 99.1276 181.294H42.4513C38.0051 181.289 33.7424 179.512 30.5984 176.353C27.4545 173.194 25.6861 168.911 25.6813 164.444V16.8502C25.6861 12.3828 27.4545 8.09965 30.5984 4.94067C33.7424 1.78168 38.0051 0.00484055 42.4513 0ZM29.2275 164.444C29.2313 167.966 30.6258 171.344 33.1049 173.835C35.584 176.326 38.9453 177.727 42.4513 177.731H99.1276C102.634 177.727 105.995 176.326 108.474 173.835C110.953 171.344 112.348 167.966 112.351 164.444V16.8502C112.348 13.3275 110.953 9.95009 108.474 7.45911C105.995 4.96814 102.634 3.56701 99.1276 3.56315H42.4513C38.9453 3.56701 35.584 4.96814 33.1049 7.45911C30.6258 9.95009 29.2313 13.3275 29.2275 16.8502V164.444Z" fill="#3F3D56"/>
+<path d="M42.4513 179.71H99.1276C103.156 179.705 107.018 178.096 109.866 175.234C112.715 172.372 114.317 168.491 114.321 164.444V16.8496C114.317 12.8021 112.715 8.9216 109.866 6.05957C107.018 3.19755 103.156 1.58774 99.1276 1.58336H42.4513C38.4231 1.58774 34.5611 3.19755 31.7127 6.05957C28.8643 8.9216 27.2621 12.8021 27.2578 16.8496V164.444C27.2621 168.491 28.8643 172.372 31.7127 175.234C34.5611 178.096 38.4231 179.705 42.4513 179.71Z" fill="#E6E6E6"/>
+<path d="M41.0508 177.335H100.528C103.245 177.332 105.85 176.246 107.772 174.315C109.693 172.385 110.774 169.767 110.776 167.037V14.253C110.774 11.5229 109.693 8.90533 107.772 6.97481C105.85 5.0443 103.245 3.95849 100.528 3.95567H92.7715C92.3225 3.95618 91.892 4.13565 91.5744 4.45468C91.2569 4.77371 91.0783 5.20627 91.0778 5.65745C91.0763 6.99035 90.5487 8.26822 89.6107 9.21072C88.6727 10.1532 87.4009 10.6834 86.0743 10.6849H56.2924C54.9659 10.6834 53.6941 10.1532 52.7561 9.21072C51.818 8.26822 51.2904 6.99035 51.2889 5.65745C51.2884 5.20627 51.1098 4.77371 50.7923 4.45468C50.4748 4.13565 50.0443 3.95618 49.5952 3.95567H41.0508C38.3336 3.95849 35.7285 5.0443 33.8072 6.97481C31.8859 8.90533 30.8053 11.5229 30.8024 14.253V167.037C30.8053 169.767 31.8859 172.385 33.8072 174.315C35.7285 176.246 38.3336 177.332 41.0508 177.335Z" fill="white"/>
+<path d="M68.2285 7.42193H75.3198C75.5288 7.42193 75.7292 7.33853 75.877 7.19006C76.0247 7.04159 76.1077 6.84022 76.1077 6.63026C76.1077 6.42029 76.0247 6.21892 75.877 6.07046C75.7292 5.92199 75.5288 5.83858 75.3198 5.83858H68.2288C68.0198 5.83858 67.8194 5.92199 67.6716 6.07046C67.5239 6.21892 67.4408 6.42029 67.4408 6.63026C67.4408 6.84022 67.5239 7.04159 67.6716 7.19006C67.8194 7.33853 68.0198 7.42193 68.2288 7.42193H68.2285Z" fill="white"/>
+<path d="M63.3043 7.22384C63.0868 7.22384 62.9104 7.04664 62.9104 6.82805C62.9104 6.60947 63.0868 6.43227 63.3043 6.43227C63.5219 6.43227 63.6982 6.60947 63.6982 6.82805C63.6982 7.04664 63.5219 7.22384 63.3043 7.22384Z" fill="white"/>
+<path d="M28.8873 34.8817H112.77V35.7839H28.8873V34.8817Z" fill="#E6E6E6"/>
+<path d="M28.8873 52.9241H112.77V53.8263H28.8873V52.9241Z" fill="#E6E6E6"/>
+<path d="M28.8873 90.2117H112.77V91.1139H28.8873V90.2117Z" fill="#E6E6E6"/>
+<path d="M28.8873 127.499H112.77V128.401H28.8873V127.499Z" fill="#E6E6E6"/>
+<path d="M28.8873 156.668H112.77V157.57H28.8873V156.668Z" fill="#E6E6E6"/>
+<path d="M51.8524 35.3328H52.7503V90.6625H51.8524V35.3328Z" fill="#E6E6E6"/>
+<path d="M93.8449 90.6465H94.7427V157.118H93.8449V90.6465Z" fill="#E6E6E6"/>
+<path d="M30.8033 108.88H94.2938V109.782H30.8033V108.88Z" fill="#E6E6E6"/>
+<path d="M51.7558 157.118H52.6537V177.334H51.7558V157.118Z" fill="#E6E6E6"/>
+<path d="M52.4509 71.9372H110.925V72.8394H52.4509V71.9372Z" fill="#E6E6E6"/>
+<path d="M98.7132 3.38815L99.5414 3.73643L86.3091 35.5068L85.4808 35.1585L98.7132 3.38815Z" fill="#E6E6E6"/>
+<path d="M57.9603 10.6875H58.8582V35.3328H57.9603V10.6875Z" fill="#E6E6E6"/>
+<path d="M34.8093 49.015C34.8093 57.0981 47.2459 75.933 50.8816 81.2647C50.9913 81.4258 51.1384 81.5575 51.3102 81.6485C51.482 81.7395 51.6732 81.7871 51.8674 81.7871C52.0616 81.7871 52.2529 81.7395 52.4247 81.6485C52.5965 81.5575 52.7436 81.4258 52.8533 81.2647C56.4881 75.933 68.9256 57.0981 68.9256 49.015C68.9256 44.4692 67.1284 40.1095 63.9292 36.8951C60.7301 33.6807 56.3912 31.8748 51.867 31.8748C47.3428 31.8748 43.0038 33.6807 39.8047 36.8951C36.6056 40.1095 34.8084 44.4692 34.8084 49.015H34.8093Z" fill="#6899FC"/>
+<path d="M51.8676 56.5328C47.0743 56.5328 43.1886 52.6284 43.1886 47.8122C43.1886 42.996 47.0743 39.0917 51.8676 39.0917C56.6609 39.0917 60.5466 42.996 60.5466 47.8122C60.5466 52.6284 56.6609 56.5328 51.8676 56.5328Z" fill="white"/>
+<path d="M52.436 90.9215L85.3041 156.906L84.5012 157.31L51.6331 91.3252L52.436 90.9215Z" fill="#E6E6E6"/>
+<path d="M51.8678 94.4212C49.7192 94.4212 47.9774 92.6711 47.9774 90.5121C47.9774 88.3532 49.7192 86.603 51.8678 86.603C54.0165 86.603 55.7583 88.3532 55.7583 90.5121C55.7583 92.6711 54.0165 94.4212 51.8678 94.4212Z" fill="#6899FC"/>
+<path d="M10.0286 56.7944C9.30552 56.7944 8.71932 56.2054 8.71932 55.4789C8.71932 54.7523 9.30552 54.1633 10.0286 54.1633C10.7518 54.1633 11.338 54.7523 11.338 55.4789C11.338 56.2054 10.7518 56.7944 10.0286 56.7944Z" fill="#F2F2F2"/>
+<path d="M17.6603 66.8678L22.4758 67.0555L22.2356 73.2764L17.4202 73.0888L17.6603 66.8678Z" fill="#6899FC"/>
+<path d="M39.3833 88.6555C39.3833 88.6555 46.0521 85.454 45.9453 88.219C45.8384 90.9841 39.2232 92.803 39.2232 92.803L39.3833 88.6555Z" fill="#FFB9B9"/>
+<path d="M35.7239 112.05C35.7239 112.05 38.8701 119.788 40.0325 125.371C41.1949 130.954 42.9653 138.638 40.6882 144.088C38.411 149.537 31.9366 165.553 31.8698 167.281C31.8031 169.009 32.4243 170.765 31.0484 170.711C29.6726 170.657 22.1853 168.288 21.8813 167.238C21.5773 166.188 24.4358 163.53 24.4358 163.53L31.4952 141.306L24.1307 126.828L18.8189 148.427L17.7789 175.385C17.7789 175.385 12.6727 173.801 11.9315 175.157C11.9315 175.157 9.64373 171.953 9.35318 170.557C9.06263 169.161 10.4337 142.562 10.4337 142.562C10.4337 142.562 5.74677 112.266 9.53042 112.413C13.3141 112.561 28.1334 103.447 35.7239 112.05Z" fill="#090814"/>
+<path d="M31.1026 169.328C31.1026 169.328 34.5929 177.078 34.9235 177.438C35.2542 177.798 37.5285 181.347 35.8086 181.28C34.0887 181.213 30.0279 179.324 27.0388 176.439C24.0497 173.553 20.1089 168.554 20.4662 168.221C20.8235 167.889 23.2714 166.946 23.2714 166.946L31.1026 169.328Z" fill="#090814"/>
+<path d="M17.1573 173.631C17.1573 173.631 17.3679 177.1 18.0023 178.509C18.6367 179.919 18.5567 181.993 16.837 181.925C15.1174 181.858 10.6722 180.993 10.6722 180.993C10.6722 180.993 10.4083 178.906 10.7656 178.574C11.1229 178.241 12.6454 174.493 11.9976 173.43C11.3497 172.366 17.1573 173.631 17.1573 173.631Z" fill="#090814"/>
+<path d="M14.6127 61.0379C14.6127 61.0379 10.9463 66.7794 9.51712 68.1083C8.08799 69.4371 12.1089 72.3628 12.1089 72.3628L19.3055 73.3355C19.3055 73.3355 19.2149 66.7554 19.5856 66.0777C19.9563 65.4 14.6127 61.0379 14.6127 61.0379Z" fill="#FFB9B9"/>
+<path d="M20.868 68.5506C20.868 68.5506 19.3854 71.2619 18.0096 71.2084C16.6337 71.1548 9.51622 68.1085 9.21289 67.0581C8.90955 66.0076 6.85555 74.5812 6.85555 74.5812L24.2697 105.373L28.5175 102.423L26.4591 84.3441L24.7691 74.5865L20.868 68.5506Z" fill="#6899FC"/>
+<path d="M8.57098 96.1082C9.26562 97.5683 9.69939 99.0907 9.63937 100.649C9.63677 100.719 9.63395 100.788 9.62788 100.857C9.463 104.055 8.2904 107.755 7.86963 110.445C7.56435 112.375 7.65123 113.784 8.7753 114.115C11.5003 114.913 8.37794 115.484 18.9209 119.01C29.4639 122.536 31.3039 119.492 31.3305 118.801C31.3572 118.11 29.8375 112.858 30.1947 112.527C30.552 112.195 35.1941 116.875 36.5968 116.237C37.9995 115.6 36.7569 112.09 36.7569 112.09C36.7569 112.09 33.5973 104.698 33.664 102.97C33.7308 101.242 28.8772 93.0919 28.8772 93.0919L25.5765 71.5029C25.5765 71.5029 24.3073 68.6843 22.6008 68.2718C20.8943 67.8592 19.4784 68.8424 19.4784 68.8424L22.3339 75.1843L25.3473 86.3786L24.8433 90.5126C24.8433 90.5126 21.3398 83.1072 19.0386 80.2485C16.7374 77.3898 11.8314 70.6221 11.8314 70.6221C11.8314 70.6221 10.6861 66.7389 11.5497 65.5784C12.4144 64.4145 7.94287 64.2401 6.03642 69.0118C5.02588 71.5406 3.38528 75.3119 2.35763 78.8232C1.44178 81.934 1.00933 84.8418 1.91651 86.504C3.30426 89.0426 6.79258 92.3802 8.57098 96.1082Z" fill="#D6D6E3"/>
+<path opacity="0.1" d="M1.91756 86.5033C3.30422 89.0426 6.79256 92.3813 8.57096 96.1082C9.03549 94.4268 9.60208 92.687 9.60208 92.687C9.60208 92.687 11.7755 81.003 5.34675 77.9835C4.28157 77.88 3.21623 78.1791 2.35869 78.8223C1.44284 81.9333 1.01016 84.8412 1.91756 86.5033Z" fill="black"/>
+<path d="M27.4378 85.7671L32.8878 87.3639L40.4552 87.6587L41.2336 94.2655L28.797 95.1655C28.797 95.1655 25.6921 86.3912 27.4378 85.7671Z" fill="#D6D6E3"/>
+<path d="M18.5506 107.981C18.5506 107.981 25.8419 109.197 24.1776 111.402C22.5134 113.606 16.0544 111.288 16.0544 111.288L18.5506 107.981Z" fill="#FFB9B9"/>
+<path opacity="0.1" d="M9.62757 100.856C9.46268 104.055 8.29009 107.754 7.86932 110.444C10.192 112.653 12.4007 114.603 13.2331 114.634C14.953 114.701 17.7181 114.463 18.7365 114.848C19.7548 115.234 20.3524 108.681 20.3524 108.681C20.3524 108.681 19.7444 106.58 17.0328 105.437C15.2026 104.663 11.6941 102.564 9.62757 100.856Z" fill="black"/>
+<path d="M5.4267 75.9099C5.4267 75.9099 -0.394052 74.9907 -0.0796684 84.6949C0.234715 94.399 -0.693277 100.593 1.64781 102.416C3.98889 104.239 11.5928 112.496 13.3131 112.562C15.0335 112.629 17.7982 112.391 18.8165 112.777C19.8348 113.162 20.4324 106.609 20.4324 106.609C20.4324 106.609 19.8244 104.509 17.1128 103.365C14.4012 102.222 8.01283 98.1648 8.0657 96.7824C8.11856 95.4 9.6816 90.6149 9.6816 90.6149C9.6816 90.6149 11.8554 78.9296 5.4267 75.9099Z" fill="#D6D6E3"/>
+<path d="M19.7458 69.5394C15.5634 69.5394 12.1729 66.1327 12.1729 61.9303C12.1729 57.7278 15.5634 54.3211 19.7458 54.3211C23.9282 54.3211 27.3187 57.7278 27.3187 61.9303C27.3187 66.1327 23.9282 69.5394 19.7458 69.5394Z" fill="#FFB9B9"/>
+<path d="M24.8448 51.0236C25.0275 51.1817 25.2462 51.292 25.4816 51.3447C25.5997 51.3656 25.7213 51.3389 25.8199 51.2703C25.9185 51.2017 25.9861 51.0967 26.0081 50.9783C26.1814 51.3392 26.3764 51.7241 26.7307 51.9094C27.0849 52.0947 27.6314 51.9392 27.6825 51.5417C27.7342 51.8435 27.8671 52.1254 28.0669 52.3568C28.2864 52.5671 28.6844 52.6202 28.8759 52.384C28.721 53.2346 28.8165 54.1095 28.7676 54.9729C28.7186 55.8363 28.4898 56.7515 27.8407 57.3193C26.8938 58.1466 25.4701 57.943 24.2247 57.7861C24.0364 57.7464 23.841 57.7571 23.6581 57.8172C23.1919 58.0168 23.2129 58.6691 23.2066 59.1783C23.1687 60.072 22.8168 60.9232 22.2134 61.5808C21.6099 62.2385 20.7941 62.6599 19.9107 62.7704C19.4164 62.847 18.912 62.7233 18.5084 62.4264C18.1548 62.1253 17.9741 61.6344 17.5689 61.4082C16.9098 61.0403 16.1103 61.5769 15.6285 62.1597C15.1466 62.7425 14.6717 63.4592 13.925 63.5659C12.9377 63.707 12.1856 62.6951 11.8169 61.765C11.3078 60.4603 11.064 59.0663 11.0996 57.6653C11.1353 56.2643 11.4497 54.8846 12.0244 53.6077C14.086 49.0923 21.1284 48.378 24.8448 51.0236Z" fill="#090814"/>
+</g>
+<defs>
+<clipPath id="clip0_544_634">
+<rect width="117" height="182" fill="white" transform="matrix(-1 0 0 1 117 0)"/>
+</clipPath>
+</defs>
+</svg>

package/src/assets/svg/type_tiktok.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg"  viewBox="0 0 394.727 791.624" xmlns:xlink="http://www.w3.org/1999/xlink" role="img" artist="Katerina Limpitsouni" source="https://undraw.co/"><g transform="translate(-774.512 -144.188)"><g transform="translate(774.512 144.188)"><path d="M661.092,267.313h-4.353V148.155a68.963,68.963,0,0,0-68.962-68.962H335.328a68.963,68.963,0,0,0-68.963,68.962v653.7a68.963,68.963,0,0,0,68.962,68.962h252.45a68.963,68.963,0,0,0,68.963-68.963V352.13h4.352Z" transform="translate(-266.365 -79.193)" fill="#090814"/><path d="M589.025,95.686H556.073a24.468,24.468,0,0,1-22.654,33.71H388.787a24.468,24.468,0,0,1-22.655-33.71H335.355a51.5,51.5,0,0,0-51.5,51.5V799.932a51.5,51.5,0,0,0,51.5,51.5h253.66a51.5,51.5,0,0,0,51.5-51.5V147.188a51.5,51.5,0,0,0-51.491-51.5Z" transform="translate(-264.822 -77.743)" fill="#fff"/></g><g transform="translate(-341.488 63.887)"><g transform="translate(0 49.158)"><path d="M305.024,283.02c0,61.894-36.795,83.5-82.184,83.5s-82.184-21.611-82.184-83.5S222.84,142.387,222.84,142.387,305.024,221.126,305.024,283.02Z" transform="translate(999.344 176.27)" fill="#f2f2f2"/><path d="M85.887,310.519l.842-51.8,35.028-64.084-34.9,55.958.378-23.292,24.142-46.364-24.042,40.2h0l.681-41.891,25.85-36.911L88.127,172.661l.425-76.812L85.879,197.535l.22-4.2L59.815,153.108l25.862,48.284-2.449,46.784-.073-1.242L52.856,204.6l30.208,46.724-.306,5.85-.055.088.025.481-6.213,118.7h8.3l1-61.309,30.134-46.609Z" transform="translate(1133.305 222.809)" fill="#e6e6e6"/></g><g transform="translate(39 37.887)"><path d="M344.346,316.665c0,76.7-45.6,103.476-101.845,103.476S140.656,393.36,140.656,316.665,242.5,142.387,242.5,142.387,344.346,239.963,344.346,316.665Z" transform="translate(1102.66 120.412)" fill="#f2f2f2"/><path d="M93.789,361.876l1.043-64.193,43.408-79.415L94.991,287.614l.468-28.864,29.917-57.456L95.583,251.111h0l.844-51.913,32.034-45.742-31.9,37.581.527-95.188L93.779,221.862l.273-5.2L61.48,166.807l32.049,59.835-3.035,57.977-.09-1.539L52.856,230.617l37.435,57.9-.379,7.25-.068.109.031.6-7.7,147.1H92.461L93.7,367.6l37.343-57.76Z" transform="translate(1247.665 166.951)" fill="#e6e6e6"/></g><g transform="translate(378.391 36.451)"><circle cx="20.597" cy="20.597" r="20.597" transform="translate(914.156 243.577)" fill="#2f2e41"/><path d="M691.385,108.662l6.881-5.771a8.133,8.133,0,0,0,.607-11.9h0a8.133,8.133,0,0,0-13.407,2.7l-3.284,8.393-26.293,45.137-13.366,36.592,10.737,12.928,14.461-44.7Z" transform="translate(316.771 89.998)" fill="#ed9da0"/><path d="M501.789,108.662l-6.881-5.771a8.133,8.133,0,0,1-.607-11.9h0a8.133,8.133,0,0,1,13.407,2.7l3.284,8.393,26.293,45.137,14.68,37.03-12.051,12.489-14.461-44.7Z" transform="translate(360 89.998)" fill="#ed9da0"/><circle cx="10.517" cy="10.517" r="10.517" transform="translate(925.113 233.06)" fill="#090814"/><path d="M356.577,500.975l-9.422-.657.438-128.4,23.226,5.7Z" transform="translate(579.928 71.708)" fill="#ed9da0"/><path d="M591.908,667.856h0a9.159,9.159,0,0,1-8.443-6.134c-2.049-6.021-.99-11.749,2.578-17.242l-1.166-8.161a9.079,9.079,0,0,1,2.137-7.241l6.041-6.947v8.764c4.422-3.867,7.148-4.007,10.956-.876L600.5,647.985l.856,9.844a9.231,9.231,0,0,1-9.453,10.027Z" transform="translate(334.03 -63.25)" fill="#090814"/><path d="M616.932,263.468l-36.811-.876c5.216-5.07,12.686-24.512,11.394-30.237h17.967C607.326,238.247,611.5,258.262,616.932,263.468Z" transform="translate(334.692 48.691)" fill="#ed9da0"/><path d="M619.5,326.055l-50.834-14.9,1.753-21.911L566.038,266.9c.447-2.425-11.123-32.374-10.517-34.62,2.42-8.972,8.759-7.732,13.366-14.242.748-1.057,6.586,6.377,10.362,11.4.448.774.756,1.3.968,1.655a13.085,13.085,0,0,1,1.763,7.961l0,.048h0c-2.069,7.161,2.684,4.225,10.137,4.349h0c6.323.105,12.051,5.115,12.051-1.208h0c-.01-.358-.026-.733-.043-1.118a17.636,17.636,0,0,1,2.22-9.273,38.533,38.533,0,0,1,2.016-3.5c4.277-6.047,10.166-14.083,10.487-12.944,1.351,4.795,8.3,8.823,10.737,17.31.375,1.306-1.883,9.235-1.753,10.517.976,9.611-.876,14.9-1.753,22.349A188.786,188.786,0,0,0,619.5,326.055Z" transform="translate(341.764 53.591)" fill="#f59e0b"/><path d="M614.441,438.2l-28.923-8.764-.438-26.293-22.788-43.822,8.764-14.461,49.957,13.147C624.423,379.85,620.666,407.949,614.441,438.2Z" transform="translate(339.813 16.38)" fill="#090814"/><path d="M348.028,317.977H332.251l-29.36-41.193,10.517-8.765Z" transform="translate(592.641 101.547)" fill="#2f2e41"/><path d="M604.443,409.592H578.229a31.048,31.048,0,0,1-17.447-5.332,27.709,27.709,0,0,1-8.926-35.423h0l52.587,2.629Z" transform="translate(343.676 9.494)" fill="#090814"/><path d="M584.887,374.513l-23.077-.7q-.13-.329-.246-.66c-3.069-8.741,1.546-18.243,10.085-21.836.86-.362,1.733-.7,2.625-1A13.784,13.784,0,0,1,592.6,363.091a34.749,34.749,0,0,1-.327,5.25,7.216,7.216,0,0,1-7.383,6.172Z" transform="translate(340.295 15.035)" fill="#ed9da0"/><path d="M322.629,364.472h-9.2l-1.315-74.5,25.856-.438Z" transform="translate(589.993 95.367)" fill="#ed9da0"/><path d="M558.709,510.689h0a9.159,9.159,0,0,1-8.443-6.134c-2.049-6.021-.99-11.749,2.578-17.242l-1.166-8.161a9.079,9.079,0,0,1,2.137-7.241l6.041-6.947v8.764c4.422-3.867,7.148-4.007,10.956-.876l-3.506,17.967.856,9.844a9.231,9.231,0,0,1-9.453,10.027Z" transform="translate(343.564 -18.113)" fill="#090814"/><circle cx="17.967" cy="17.967" r="17.967" transform="translate(917.443 251.685)" fill="#ed9da0"/><path d="M617.73,198.594c0,9.2-8.332-3.944-17.529-3.944s-15.776,13.141-15.776,3.944a16.652,16.652,0,0,1,33.3,0Z" transform="translate(333.456 63.169)" fill="#090814"/></g><line x2="288" transform="translate(1181.5 221.5)" fill="none" stroke="#090814" stroke-linecap="round" stroke-width="5"/><path d="M356.2,605.319H.321v-3.3H356.364Z" transform="translate(1135.046 46.393)" fill="#f2f2f2"/></g><g transform="translate(-325.488 43.887)"><path d="M8,0H56a8,8,0,0,1,0,16H8A8,8,0,0,1,8,0Z" transform="translate(1232 173)" fill="#f59e0b"/><path d="M8,0H56a8,8,0,0,1,0,16H8A8,8,0,0,1,8,0Z" transform="translate(1300 173)" fill="#e6e6e6"/></g><path d="M8,0h98a8,8,0,0,1,0,16H8A8,8,0,0,1,8,0Z" transform="translate(823.512 770.887)" fill="#090814"/><path d="M8,0A8,8,0,1,1,0,8,8,8,0,0,1,8,0Z" transform="translate(949.512 770.887)" fill="#f59e0b"/><path d="M8,0H216a8,8,0,0,1,0,16H8A8,8,0,0,1,8,0Z" transform="translate(823.512 794.887)" fill="#e6e6e6"/><path d="M8,0H216a8,8,0,0,1,0,16H8A8,8,0,0,1,8,0Z" transform="translate(823.512 818.887)" fill="#e6e6e6"/><path d="M23336.635,20859.254a51.678,51.678,0,0,1-44.131-44.029v-10.971h358.049v8.514a51.65,51.65,0,0,1-44.406,46.486Z" transform="translate(-22499.629 -19939.871)" fill="#090814"/><g transform="translate(-341.488 43.887)"><path d="M16.5,0A16.5,16.5,0,1,1,0,16.5,16.5,16.5,0,0,1,16.5,0Z" transform="translate(1165 836)" fill="#f59e0b"/><path d="M16.5,0A16.5,16.5,0,1,1,0,16.5,16.5,16.5,0,0,1,16.5,0Z" transform="translate(1230 836)" fill="#3f3d56"/><path d="M16.5,0A16.5,16.5,0,1,1,0,16.5,16.5,16.5,0,0,1,16.5,0Z" transform="translate(1296 836)" fill="#3f3d56"/><path d="M16.5,0A16.5,16.5,0,1,1,0,16.5,16.5,16.5,0,0,1,16.5,0Z" transform="translate(1426 836)" fill="#3f3d56"/><path d="M16.5,0A16.5,16.5,0,1,1,0,16.5,16.5,16.5,0,0,1,16.5,0Z" transform="translate(1361 836)" fill="#3f3d56"/></g><path d="M16.5,0A16.5,16.5,0,1,1,0,16.5,16.5,16.5,0,0,1,16.5,0Z" transform="translate(1086.512 810.887)" fill="#f59e0b"/><path d="M16.5,0A16.5,16.5,0,1,1,0,16.5,16.5,16.5,0,0,1,16.5,0Z" transform="translate(1086.512 769.887)" fill="#e6e6e6"/><path d="M16.5,0A16.5,16.5,0,1,1,0,16.5,16.5,16.5,0,0,1,16.5,0Z" transform="translate(1086.512 728.887)" fill="#e6e6e6"/><path d="M24,0A24,24,0,1,1,0,24,24,24,0,0,1,24,0Z" transform="translate(1079.512 553.887)" fill="#f59e0b"/><g transform="translate(-341.488 43.887)"><path d="M12,0A12,12,0,1,1,0,12,12,12,0,0,1,12,0Z" transform="translate(1433 546)" fill="#fe6583"/><path d="M6.37-1.074c-.454-1.085,0-4.34,0-4.34s-3.207.427-4.275,0-1.069-1.281,0-1.708,4.275,0,4.275,0-.454-3.247,0-4.329,1.362-1.082,1.815,0,0,4.329,0,4.329,3.207-.427,4.275,0,1.069,1.281,0,1.708-4.275,0-4.275,0,.454,3.255,0,4.34S6.824.011,6.37-1.074Z" transform="translate(1437.723 564.262)" fill="#f2f2f2"/></g></g></svg>

package/src/components/AnimatedNumber/AnimatedNumber.stories.ts

@@ -0,0 +1,15 @@
+import type { Meta, StoryObj } from '@storybook/vue3-vite'
+import AnimatedNumber from './AnimatedNumber.vue'
+
+export default {
+  title: 'Components/Atoms/Animated Number',
+  component: AnimatedNumber,
+} satisfies Meta<typeof AnimatedNumber>
+
+type Story = StoryObj<typeof AnimatedNumber>
+
+export const Default: Story = {
+  args: {
+    value: 4,
+  },
+}

package/src/components/AnimatedNumber/AnimatedNumber.test.ts

@@ -0,0 +1,56 @@
+import { describe, it, expect } from 'vitest'
+import { mount } from '@vue/test-utils'
+import AnimatedNumber from './AnimatedNumber.vue'
+
+describe('AnimatedNumber', () => {
+  it('renders the number correctly', () => {
+    const wrapper = mount(AnimatedNumber, {
+      props: {
+        value: 123,
+      },
+    })
+
+    expect(wrapper.text()).toBe('123')
+    expect(wrapper.attributes('aria-label')).toBe('123')
+  })
+
+  it('splits the number into digits', () => {
+    const wrapper = mount(AnimatedNumber, {
+      props: {
+        value: 45,
+      },
+    })
+
+    const digitWrappers = wrapper.findAll('.relative.inline-flex.h-\\[1\\.5em\\]')
+    expect(digitWrappers).toHaveLength(2)
+    expect(digitWrappers.at(0)?.text()).toBe('4')
+    expect(digitWrappers.at(1)?.text()).toBe('5')
+  })
+
+  it('handles single digit values', () => {
+    const wrapper = mount(AnimatedNumber, {
+      props: {
+        value: 7,
+      },
+    })
+
+    const digitWrappers = wrapper.findAll('.relative.inline-flex.h-\\[1\\.5em\\]')
+    expect(digitWrappers).toHaveLength(1)
+    expect(digitWrappers.at(0)?.text()).toBe('7')
+  })
+
+  it('updates digits when value changes', async () => {
+    const wrapper = mount(AnimatedNumber, {
+      props: {
+        value: 9,
+      },
+    })
+
+    expect(wrapper.text()).toBe('9')
+
+    await wrapper.setProps({ value: 10 })
+
+    expect(wrapper.text()).toBe('10')
+    expect(wrapper.findAll('.relative.inline-flex.h-\\[1\\.5em\\]')).toHaveLength(2)
+  })
+})

package/src/components/AnimatedNumber/AnimatedNumber.vue

@@ -0,0 +1,61 @@
+<script setup lang="ts">
+import { computed, ref, watch } from 'vue'
+
+type EasingFunction = 'ease-linear' | 'ease-in' | 'ease-out' | 'ease-in-out'
+
+const {
+  value,
+  duration = 500,
+  easing = 'ease-out',
+} = defineProps<{
+  value: number
+  duration?: number
+  easing?: EasingFunction
+}>()
+
+const direction = ref<'up' | 'down'>('up')
+const digits = computed(() => String(value).split(''))
+const transitionDuration = computed(() => `duration-${duration}`)
+
+watch(
+  () => value,
+  (newVal, oldVal) => {
+    direction.value = newVal > oldVal ? 'up' : 'down'
+  },
+)
+</script>
+
+<template>
+  <TransitionGroup
+    tag="div"
+    class="relative flex shrink-0 items-center tabular-nums"
+    :aria-label="value"
+    :enter-active-class="`transition-all ${transitionDuration} ${easing}`"
+    :leave-active-class="`absolute transition-all ${transitionDuration} ${easing}`"
+    :enter-from-class="
+      direction === 'up' ? 'translate-y-full opacity-0' : '-translate-y-full opacity-0'
+    "
+    :leave-to-class="
+      direction === 'up' ? '-translate-y-full opacity-0' : 'translate-y-full opacity-0'
+    "
+    move-class="transition-all duration-500 ease-in-out"
+  >
+    <div
+      v-for="(digit, i) in digits"
+      :key="i"
+      class="relative inline-flex h-[1.5em] w-[1ch] items-center justify-center overflow-hidden"
+      aria-hidden="true"
+    >
+      <Transition
+        :enter-active-class="`transition-transform ${transitionDuration} ${easing}`"
+        :leave-active-class="`absolute inset-0 transition-transform ${transitionDuration} ${easing}`"
+        :enter-from-class="direction === 'up' ? 'translate-y-full' : '-translate-y-full'"
+        :leave-to-class="direction === 'up' ? '-translate-y-full' : 'translate-y-full'"
+      >
+        <span :key="digit" class="flex h-full w-full items-center justify-center">
+          {{ digit }}
+        </span>
+      </Transition>
+    </div>
+  </TransitionGroup>
+</template>