@wix/design-system-illustrations 2.44.2 → 2.45.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (42) hide show
  1. package/dist/cjs/BottomMenu.js +52 -0
  2. package/dist/cjs/FunnelStackedBarChart.js +59 -0
  3. package/dist/cjs/HorizontalStackedBarChart.js +57 -0
  4. package/dist/cjs/SideMenu.js +52 -0
  5. package/dist/cjs/VerticalStackedBarChart.js +57 -0
  6. package/dist/cjs/animated/StickySectionPresetsFullWidth.js +3 -1
  7. package/dist/cjs/animated/StickySectionPresetsGridRows.js +3 -1
  8. package/dist/cjs/animated/StickySectionPresetsSideBySide.js +3 -1
  9. package/dist/cjs/animated/StickySectionPresetsSplit.js +2 -1
  10. package/dist/cjs/animated/StickySectionPresetsZigzag.js +5 -3
  11. package/dist/cjs/animated/animated.global.css +5189 -235
  12. package/dist/cjs/index.js +15 -0
  13. package/dist/esm/BottomMenu.js +18 -0
  14. package/dist/esm/FunnelStackedBarChart.js +25 -0
  15. package/dist/esm/HorizontalStackedBarChart.js +23 -0
  16. package/dist/esm/SideMenu.js +18 -0
  17. package/dist/esm/VerticalStackedBarChart.js +23 -0
  18. package/dist/esm/animated/StickySectionPresetsFullWidth.js +3 -1
  19. package/dist/esm/animated/StickySectionPresetsGridRows.js +3 -1
  20. package/dist/esm/animated/StickySectionPresetsSideBySide.js +3 -1
  21. package/dist/esm/animated/StickySectionPresetsSplit.js +2 -1
  22. package/dist/esm/animated/StickySectionPresetsZigzag.js +5 -3
  23. package/dist/esm/animated/animated.global.css +5189 -235
  24. package/dist/esm/index.js +10 -0
  25. package/dist/types/BottomMenu.d.ts +5 -0
  26. package/dist/types/FunnelStackedBarChart.d.ts +5 -0
  27. package/dist/types/HorizontalStackedBarChart.d.ts +5 -0
  28. package/dist/types/SideMenu.d.ts +5 -0
  29. package/dist/types/VerticalStackedBarChart.d.ts +5 -0
  30. package/dist/types/index.d.ts +5 -0
  31. package/package.json +3 -3
  32. package/src/BottomMenu.svg +64 -0
  33. package/src/FunnelStackedBarChart.svg +184 -0
  34. package/src/HorizontalStackedBarChart.svg +202 -0
  35. package/src/MaxWidth.svg +1 -1
  36. package/src/SideMenu.svg +85 -0
  37. package/src/VerticalStackedBarChart.svg +202 -0
  38. package/src/animated/StickySectionPresetsFullWidth.html +1064 -45
  39. package/src/animated/StickySectionPresetsGridRows.html +1059 -40
  40. package/src/animated/StickySectionPresetsSideBySide.html +864 -45
  41. package/src/animated/StickySectionPresetsSplit.html +958 -46
  42. package/src/animated/StickySectionPresetsZigzag.html +1321 -62
@@ -33,9 +33,11 @@ const StickySectionPresetsZigzag = forwardRef(
33
33
  className: ["StickySectionPresetsZigzag-root", className].filter(Boolean).join(" "),
34
34
  ...props
35
35
  },
36
- /* @__PURE__ */ React.createElement("defs", null, /* @__PURE__ */ React.createElement("linearGradient", { id: `${uid}-paint0_linear_4424_19163`, x1: "113.06", y1: "9.65327", x2: "47.0261", y2: "92.6155", gradientUnits: "userSpaceOnUse" }, /* @__PURE__ */ React.createElement("stop", { offset: "0.176006", stopColor: "#EAEFFF" }), /* @__PURE__ */ React.createElement("stop", { offset: "0.55", stopColor: "#B8C4FF" }), /* @__PURE__ */ React.createElement("stop", { offset: "0.8", stopColor: "#002294" })), /* @__PURE__ */ React.createElement("filter", { id: `${uid}-filter1_f_4424_19163`, filterUnits: "objectBoundingBox", x: "-1", y: "-1", width: "3", height: "3", colorInterpolationFilters: "sRGB" }, /* @__PURE__ */ React.createElement("feFlood", { result: "BackgroundImageFix", floodOpacity: "0" }), /* @__PURE__ */ React.createElement("feBlend", { mode: "normal", in: "SourceGraphic", in2: "BackgroundImageFix", result: "shape" }), /* @__PURE__ */ React.createElement("feGaussianBlur", { stdDeviation: "2.36111", result: "effect1_foregroundBlur_4424_19163" })), /* @__PURE__ */ React.createElement("clipPath", { id: `${uid}-clip0_4424_19163` }, /* @__PURE__ */ React.createElement("rect", { width: "68", height: "68", fill: "white" })), /* @__PURE__ */ React.createElement("clipPath", { id: `${uid}-clip1_4424_19163` }, /* @__PURE__ */ React.createElement("path", { d: "M0 7.55556C0 3.38274 3.38274 0 7.55556 0H60.4444C64.6173 0 68 3.38274 68 7.55556V60.4444C68 64.6173 64.6173 68 60.4444 68H7.55556C3.38274 68 0 64.6173 0 60.4444V7.55556Z", fill: "white" })), /* @__PURE__ */ React.createElement("clipPath", { id: `${uid}-clip2_4424_19163` }, /* @__PURE__ */ React.createElement("rect", { x: "54.7812", y: "32.1719", width: "23.6111", height: "20.7778", rx: "2.83333", transform: "rotate(90 54.7812 32.1719)", fill: "white" }))),
37
- /* @__PURE__ */ React.createElement("g", { fill: "none" }, /* @__PURE__ */ React.createElement("g", { fill: "none", clipPath: `url(#${uid}-clip0_4424_19163)` }, /* @__PURE__ */ React.createElement("g", { fill: "none" }, /* @__PURE__ */ React.createElement("g", { fill: "none", clipPath: `url(#${uid}-clip1_4424_19163)` })), /* @__PURE__ */ React.createElement("g", { fill: "none" }, /* @__PURE__ */ React.createElement("g", { fill: "none", className: "StickySectionPresetsZigzag-Frame-1707483283" }, /* @__PURE__ */ React.createElement("path", { d: "M 34 16.05993 L 34 34.00437 A 2.83333 2.83333 45 0 1 31.16667 36.8377 L 16.05553 36.8377 A 2.83333 2.83333 45 0 1 13.2222 34.00437 L 13.2222 16.05993 A 2.83333 2.83333 45 0 1 16.05553 13.2266 L 31.16667 13.2266 A 2.83333 2.83333 45 0 1 34 16.05993 Z", fill: "var(--color-2)" })), /* @__PURE__ */ React.createElement("g", { fill: "none", className: "StickySectionPresetsZigzag-Frame-1707483285" }, /* @__PURE__ */ React.createElement("path", { d: "M 54.7812 21.72393 L 54.7812 39.66837 A 2.83333 2.83333 45 0 1 51.94787 42.5017 L 36.83673 42.5017 A 2.83333 2.83333 45 0 1 34.0034 39.66837 L 34.0034 21.72393 A 2.83333 2.83333 45 0 1 36.83673 18.8906 L 51.94787 18.8906 A 2.83333 2.83333 45 0 1 54.7812 21.72393 Z", fill: "var(--color-3)" })), /* @__PURE__ */ React.createElement("g", { fill: "none", className: "StickySectionPresetsZigzag-Frame-1707483284" }, /* @__PURE__ */ React.createElement("path", { d: "M 34 29.27863 L 34 47.22307 A 2.83333 2.83333 45 0 1 31.16667 50.0564 L 16.05553 50.0564 A 2.83333 2.83333 45 0 1 13.2222 47.22307 L 13.2222 29.27863 A 2.83333 2.83333 45 0 1 16.05553 26.4453 L 31.16667 26.4453 A 2.83333 2.83333 45 0 1 34 29.27863 Z", fill: "var(--color-4)" })), /* @__PURE__ */ React.createElement("g", { fill: "none", className: "StickySectionPresetsZigzag-Frame-1707483282" }, /* @__PURE__ */ React.createElement("g", { fill: "none", clipPath: `url(#${uid}-clip2_4424_19163)` }, /* @__PURE__ */ React.createElement("path", { d: "M 54.7812 35.00523 L 54.7812 52.94967 A 2.83333 2.83333 45 0 1 51.94787 55.783 L 36.83673 55.783 A 2.83333 2.83333 45 0 1 34.0034 52.94967 L 34.0034 35.00523 A 2.83333 2.83333 45 0 1 36.83673 32.1719 L 51.94787 32.1719 A 2.83333 2.83333 45 0 1 54.7812 35.00523 Z", fill: "var(--color-2)" }), /* @__PURE__ */ React.createElement("g", { fill: "none" }, /* @__PURE__ */ React.createElement("path", { d: "M121.734 61.3828L121.734 1.10425L25.0979 1.10425L25.0979 61.3828L121.734 61.3828Z", fill: `url(#${uid}-paint0_linear_4424_19163)` }))))))),
38
- /* @__PURE__ */ React.createElement("g", { fill: "none", className: "StickySectionPresetsZigzag-Thumbnail-Container-2" }, /* @__PURE__ */ React.createElement("g", { fill: "none", clipPath: `url(#${uid}-clip0_4424_19163)` }, /* @__PURE__ */ React.createElement("g", { fill: "none" }, /* @__PURE__ */ React.createElement("g", { fill: "none", clipPath: `url(#${uid}-clip1_4424_19163)` })), /* @__PURE__ */ React.createElement("g", { fill: "none" }, /* @__PURE__ */ React.createElement("g", { fill: "none" }, /* @__PURE__ */ React.createElement("path", { d: "M 34 16.05993 L 34 34.00437 A 2.83333 2.83333 45 0 1 31.16667 36.8377 L 16.05553 36.8377 A 2.83333 2.83333 45 0 1 13.2222 34.00437 L 13.2222 16.05993 A 2.83333 2.83333 45 0 1 16.05553 13.2266 L 31.16667 13.2266 A 2.83333 2.83333 45 0 1 34 16.05993 Z", fill: "var(--color-2)" })), /* @__PURE__ */ React.createElement("g", { fill: "none" }, /* @__PURE__ */ React.createElement("path", { d: "M 54.7812 21.72393 L 54.7812 39.66837 A 2.83333 2.83333 45 0 1 51.94787 42.5017 L 36.83673 42.5017 A 2.83333 2.83333 45 0 1 34.0034 39.66837 L 34.0034 21.72393 A 2.83333 2.83333 45 0 1 36.83673 18.8906 L 51.94787 18.8906 A 2.83333 2.83333 45 0 1 54.7812 21.72393 Z", fill: "var(--color-3)" })), /* @__PURE__ */ React.createElement("g", { fill: "none" }, /* @__PURE__ */ React.createElement("path", { d: "M 34 29.27863 L 34 47.22307 A 2.83333 2.83333 45 0 1 31.16667 50.0564 L 16.05553 50.0564 A 2.83333 2.83333 45 0 1 13.2222 47.22307 L 13.2222 29.27863 A 2.83333 2.83333 45 0 1 16.05553 26.4453 L 31.16667 26.4453 A 2.83333 2.83333 45 0 1 34 29.27863 Z", fill: "var(--color-4)" })), /* @__PURE__ */ React.createElement("g", { fill: "none" }, /* @__PURE__ */ React.createElement("g", { fill: "none", clipPath: `url(#${uid}-clip2_4424_19163)` }, /* @__PURE__ */ React.createElement("path", { d: "M 54.7812 35.00523 L 54.7812 52.94967 A 2.83333 2.83333 45 0 1 51.94787 55.783 L 36.83673 55.783 A 2.83333 2.83333 45 0 1 34.0034 52.94967 L 34.0034 35.00523 A 2.83333 2.83333 45 0 1 36.83673 32.1719 L 51.94787 32.1719 A 2.83333 2.83333 45 0 1 54.7812 35.00523 Z", fill: "var(--color-2)" }), /* @__PURE__ */ React.createElement("g", { fill: "none" }, /* @__PURE__ */ React.createElement("path", { d: "M121.734 61.3828L121.734 1.10425L25.0979 1.10425L25.0979 61.3828L121.734 61.3828Z", fill: `url(#${uid}-paint0_linear_4424_19163)` })))))))
36
+ /* @__PURE__ */ React.createElement("defs", null, /* @__PURE__ */ React.createElement("linearGradient", { id: `${uid}-paint0_linear_4424_19163`, x1: "84.4835", y1: "12.5889", x2: "44.9505", y2: "76.1371", gradientUnits: "userSpaceOnUse" }, /* @__PURE__ */ React.createElement("stop", { offset: "0.28649", stopColor: "#EAEFFF" }), /* @__PURE__ */ React.createElement("stop", { offset: "0.65592", stopColor: "#B8C4FF" }), /* @__PURE__ */ React.createElement("stop", { offset: "0.90287", stopColor: "#002294" })), /* @__PURE__ */ React.createElement("filter", { id: `${uid}-filter1_f_4424_19163`, filterUnits: "objectBoundingBox", x: "-1", y: "-1", width: "3", height: "3", colorInterpolationFilters: "sRGB" }, /* @__PURE__ */ React.createElement("feFlood", { result: "BackgroundImageFix", floodOpacity: "0" }), /* @__PURE__ */ React.createElement("feBlend", { mode: "normal", in: "SourceGraphic", in2: "BackgroundImageFix", result: "shape" }), /* @__PURE__ */ React.createElement("feGaussianBlur", { stdDeviation: "2.36111", result: "effect1_foregroundBlur_4424_19163" })), /* @__PURE__ */ React.createElement("clipPath", { id: `${uid}-clip0_4424_19163` }, /* @__PURE__ */ React.createElement("rect", { width: "68", height: "68", fill: "white" })), /* @__PURE__ */ React.createElement("clipPath", { id: `${uid}-clip1_4424_19163` }, /* @__PURE__ */ React.createElement("path", { d: "M0 7.55556C0 3.38274 3.38274 0 7.55556 0H60.4444C64.6173 0 68 3.38274 68 7.55556V60.4444C68 64.6173 64.6173 68 60.4444 68H7.55556C3.38274 68 0 64.6173 0 60.4444V7.55556Z", fill: "white" })), /* @__PURE__ */ React.createElement("clipPath", { id: `${uid}-clip2_4424_19163` }, /* @__PURE__ */ React.createElement("rect", { x: "54.7812", y: "32.1719", width: "23.6111", height: "20.7778", rx: "2.83333", transform: "rotate(90 54.7812 32.1719)", fill: "white" }))),
37
+ /* @__PURE__ */ React.createElement("g", { fill: "none", className: "StickySectionPresetsZigzag-container" }, /* @__PURE__ */ React.createElement("rect", { x: "13", y: "13", width: "42", height: "42", rx: "2.83333", fill: "var(--illustration-color-opacity-25)" }), /* @__PURE__ */ React.createElement("g", { fill: "none", opacity: "0.25" }, /* @__PURE__ */ React.createElement("rect", { x: "13", y: "13", width: "42", height: "42", rx: "2.83333", fill: "var(--color-4)" }))),
38
+ /* @__PURE__ */ React.createElement("g", { fill: "none" }, /* @__PURE__ */ React.createElement("g", { fill: "none", clipPath: `url(#${uid}-clip0_4424_19163)` }, /* @__PURE__ */ React.createElement("g", { fill: "none" }, /* @__PURE__ */ React.createElement("g", { fill: "none", clipPath: `url(#${uid}-clip1_4424_19163)` })), /* @__PURE__ */ React.createElement("g", { fill: "none" }, /* @__PURE__ */ React.createElement("g", { fill: "none", className: "StickySectionPresetsZigzag-Frame-1707483283" }, /* @__PURE__ */ React.createElement("path", { d: "M 34 16.05993 L 34 34.00437 A 2.83333 2.83333 45 0 1 31.16667 36.8377 L 16.05553 36.8377 A 2.83333 2.83333 45 0 1 13.2222 34.00437 L 13.2222 16.05993 A 2.83333 2.83333 45 0 1 16.05553 13.2266 L 31.16667 13.2266 A 2.83333 2.83333 45 0 1 34 16.05993 Z", fill: "var(--color-2)" })), /* @__PURE__ */ React.createElement("g", { fill: "none", className: "StickySectionPresetsZigzag-Frame-1707483285" }, /* @__PURE__ */ React.createElement("path", { d: "M 54.7812 21.72393 L 54.7812 39.66837 A 2.83333 2.83333 45 0 1 51.94787 42.5017 L 36.83673 42.5017 A 2.83333 2.83333 45 0 1 34.0034 39.66837 L 34.0034 21.72393 A 2.83333 2.83333 45 0 1 36.83673 18.8906 L 51.94787 18.8906 A 2.83333 2.83333 45 0 1 54.7812 21.72393 Z", fill: "var(--color-3)" })), /* @__PURE__ */ React.createElement("g", { fill: "none", className: "StickySectionPresetsZigzag-Frame-1707483284" }, /* @__PURE__ */ React.createElement("path", { d: "M 34 29.27863 L 34 47.22307 A 2.83333 2.83333 45 0 1 31.16667 50.0564 L 16.05553 50.0564 A 2.83333 2.83333 45 0 1 13.2222 47.22307 L 13.2222 29.27863 A 2.83333 2.83333 45 0 1 16.05553 26.4453 L 31.16667 26.4453 A 2.83333 2.83333 45 0 1 34 29.27863 Z", fill: "var(--color-4)" })), /* @__PURE__ */ React.createElement("g", { fill: "none", className: "StickySectionPresetsZigzag-Frame-1707483282" }, /* @__PURE__ */ React.createElement("g", { fill: "none", clipPath: `url(#${uid}-clip2_4424_19163)` }, /* @__PURE__ */ React.createElement("path", { d: "M 54.7812 35.00523 L 54.7812 52.94967 A 2.83333 2.83333 45 0 1 51.94787 55.783 L 36.83673 55.783 A 2.83333 2.83333 45 0 1 34.0034 52.94967 L 34.0034 35.00523 A 2.83333 2.83333 45 0 1 36.83673 32.1719 L 51.94787 32.1719 A 2.83333 2.83333 45 0 1 54.7812 35.00523 Z", fill: "var(--color-2)" }), /* @__PURE__ */ React.createElement("g", { fill: "none" }, /* @__PURE__ */ React.createElement("path", { d: "M104.434 63.726L104.434 25.000L25.000 25.000L25.000 63.726L104.434 63.726Z", fill: `url(#${uid}-paint0_linear_4424_19163)` }))))))),
39
+ /* @__PURE__ */ React.createElement("g", { fill: "none", className: "StickySectionPresetsZigzag-Thumbnail-Container-2" }, /* @__PURE__ */ React.createElement("g", { fill: "none", clipPath: `url(#${uid}-clip0_4424_19163)` }, /* @__PURE__ */ React.createElement("g", { fill: "none" }, /* @__PURE__ */ React.createElement("g", { fill: "none", clipPath: `url(#${uid}-clip1_4424_19163)` })), /* @__PURE__ */ React.createElement("g", { fill: "none" }, /* @__PURE__ */ React.createElement("g", { fill: "none" }, /* @__PURE__ */ React.createElement("path", { d: "M 34 16.05993 L 34 34.00437 A 2.83333 2.83333 45 0 1 31.16667 36.8377 L 16.05553 36.8377 A 2.83333 2.83333 45 0 1 13.2222 34.00437 L 13.2222 16.05993 A 2.83333 2.83333 45 0 1 16.05553 13.2266 L 31.16667 13.2266 A 2.83333 2.83333 45 0 1 34 16.05993 Z", fill: "var(--color-2)" })), /* @__PURE__ */ React.createElement("g", { fill: "none" }, /* @__PURE__ */ React.createElement("path", { d: "M 54.7812 21.72393 L 54.7812 39.66837 A 2.83333 2.83333 45 0 1 51.94787 42.5017 L 36.83673 42.5017 A 2.83333 2.83333 45 0 1 34.0034 39.66837 L 34.0034 21.72393 A 2.83333 2.83333 45 0 1 36.83673 18.8906 L 51.94787 18.8906 A 2.83333 2.83333 45 0 1 54.7812 21.72393 Z", fill: "var(--color-3)" })), /* @__PURE__ */ React.createElement("g", { fill: "none" }, /* @__PURE__ */ React.createElement("path", { d: "M 34 29.27863 L 34 47.22307 A 2.83333 2.83333 45 0 1 31.16667 50.0564 L 16.05553 50.0564 A 2.83333 2.83333 45 0 1 13.2222 47.22307 L 13.2222 29.27863 A 2.83333 2.83333 45 0 1 16.05553 26.4453 L 31.16667 26.4453 A 2.83333 2.83333 45 0 1 34 29.27863 Z", fill: "var(--color-4)" })), /* @__PURE__ */ React.createElement("g", { fill: "none" }, /* @__PURE__ */ React.createElement("g", { fill: "none", clipPath: `url(#${uid}-clip2_4424_19163)` }, /* @__PURE__ */ React.createElement("path", { d: "M 54.7812 35.00523 L 54.7812 52.94967 A 2.83333 2.83333 45 0 1 51.94787 55.783 L 36.83673 55.783 A 2.83333 2.83333 45 0 1 34.0034 52.94967 L 34.0034 35.00523 A 2.83333 2.83333 45 0 1 36.83673 32.1719 L 51.94787 32.1719 A 2.83333 2.83333 45 0 1 54.7812 35.00523 Z", fill: "var(--color-2)" }), /* @__PURE__ */ React.createElement("g", { fill: "none" }, /* @__PURE__ */ React.createElement("path", { d: "M104.434 63.726L104.434 25.000L25.000 25.000L25.000 63.726L104.434 63.726Z", fill: `url(#${uid}-paint0_linear_4424_19163)` }))))))),
40
+ /* @__PURE__ */ React.createElement("g", { fill: "none", className: "StickySectionPresetsZigzag-scrollbar-first-run" }, /* @__PURE__ */ React.createElement("g", { fill: "none", className: "StickySectionPresetsZigzag-scrollbar" }, /* @__PURE__ */ React.createElement("g", { transform: "translate(56.58 18) scale(0.52)", fill: "none" }, /* @__PURE__ */ React.createElement("path", { d: "M4 58.125C4 59.1605 3.10468 60 2.00025 60C0.895815 60 0.000495434 59.1605 0.000495434 58.125L0.000495434 1.875C0.000495434 0.839466 0.895815 0 2.00025 0C3.10468 0 4 0.839466 4 1.875L4 58.125Z", fill: "var(--scrollbar-track)" }), /* @__PURE__ */ React.createElement("g", { className: "StickySectionPresetsZigzag-scrollbar-thumb" }, /* @__PURE__ */ React.createElement("path", { d: "M2 8.48438L2 17.4572", fill: "none", stroke: "var(--color-2)", strokeWidth: "4", strokeLinecap: "round" })))))
39
41
  );
40
42
  }
41
43
  );