@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
package/src/HorizontalStackedBarChart.svg ADDED
@@ -0,0 +1,202 @@
1
+ <svg width="72" height="72" viewBox="0 0 72 72" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#wash_0_clippath)"><path d="M14 12C14 10.8954 14.8954 10 16 10L56 10C57.1046 10 58 10.8954 58 12V23C58 24.1046 57.1046 25 56 25L16 25C14.8954 25 14 24.1046 14 23L14 12Z" fill="var(--wds-illustration-color-opacity-100, #f8f6f100)"/></g><g clip-path="url(#wash_1_clippath)"><path d="M14 32C14 30.3431 15.3431 29 17 29L48 29C49.6569 29 51 30.3431 51 32V41C51 42.6569 49.6569 44 48 44L17 44C15.3431 44 14 42.6569 14 41L14 32Z" fill="var(--wds-illustration-color-opacity-100, #f8f6f100)"/></g><g clip-path="url(#wash_2_clippath)"><path d="M14 51C14 49.3431 15.3431 48 17 48L39 48C40.6569 48 42 49.3431 42 51V60C42 61.6569 40.6569 63 39 63H17C15.3431 63 14 61.6569 14 60L14 51Z" fill="var(--wds-illustration-color-opacity-100, #f8f6f100)"/></g>
2
+ <g clip-path="url(#clip0_2453_6894)">
3
+ <g opacity="0.65">
4
+ <g clip-path="url(#clip1_2453_6894)">
5
+ <rect width="15" height="17" transform="translate(50 10) rotate(90)" fill="#002291"/>
6
+ <g filter="url(#filter0_f_2453_6894)">
7
+ <rect x="23" y="-3" width="118" height="34" fill="url(#paint0_linear_2453_6894)"/>
8
+ </g>
9
+ </g>
10
+ </g>
11
+ <g opacity="0.35">
12
+ <g clip-path="url(#clip2_2453_6894)">
13
+ <path d="M56 10C57.1046 10 58 10.8954 58 12L58 23C58 24.1046 57.1046 25 56 25L50 25L50 10L56 10Z" fill="#002291"/>
14
+ <g filter="url(#filter1_f_2453_6894)">
15
+ <rect x="46" y="5" width="29" height="26" fill="url(#paint1_linear_2453_6894)"/>
16
+ </g>
17
+ </g>
18
+ </g>
19
+ <g clip-path="url(#clip3_2453_6894)">
20
+ <path d="M33 10L33 25L16 25C14.8954 25 14 24.1046 14 23L14 12C14 10.8954 14.8954 10 16 10L33 10Z" fill="#002291"/>
21
+ <g filter="url(#filter2_f_2453_6894)">
22
+ <rect x="14" y="-11" width="129" height="36" fill="url(#paint2_linear_2453_6894)"/>
23
+ </g>
24
+ </g>
25
+ </g>
26
+ <g clip-path="url(#clip4_2453_6894)">
27
+ <g opacity="0.65">
28
+ <g clip-path="url(#clip5_2453_6894)">
29
+ <rect width="15" height="17" transform="translate(40 29) rotate(90)" fill="#002291"/>
30
+ <g filter="url(#filter3_f_2453_6894)">
31
+ <rect x="13" y="20" width="90" height="30" fill="url(#paint3_linear_2453_6894)"/>
32
+ </g>
33
+ </g>
34
+ </g>
35
+ <g opacity="0.35">
36
+ <g clip-path="url(#clip6_2453_6894)">
37
+ <path d="M49 29C50.1046 29 51 29.8954 51 31L51 42C51 43.1046 50.1046 44 49 44L40 44L40 29L49 29Z" fill="#002291"/>
38
+ <g filter="url(#filter4_f_2453_6894)">
39
+ <rect x="36" y="24" width="22" height="26" fill="url(#paint4_linear_2453_6894)"/>
40
+ </g>
41
+ </g>
42
+ </g>
43
+ <g clip-path="url(#clip7_2453_6894)">
44
+ <path d="M23 29L23 44L16 44C14.8954 44 14 43.1046 14 42L14 31C14 29.8954 14.8954 29 16 29L23 29Z" fill="#002291"/>
45
+ <g filter="url(#filter5_f_2453_6894)">
46
+ <rect x="14" y="4" width="82" height="40" fill="url(#paint5_linear_2453_6894)"/>
47
+ </g>
48
+ </g>
49
+ </g>
50
+ <g clip-path="url(#clip8_2453_6894)">
51
+ <g opacity="0.65">
52
+ <g clip-path="url(#clip9_2453_6894)">
53
+ <rect width="15" height="4" transform="translate(36 48) rotate(90)" fill="#002291"/>
54
+ <g filter="url(#filter6_f_2453_6894)">
55
+ <rect x="22" y="35" width="47" height="34" fill="url(#paint6_linear_2453_6894)"/>
56
+ </g>
57
+ </g>
58
+ </g>
59
+ <g opacity="0.35">
60
+ <g clip-path="url(#clip10_2453_6894)">
61
+ <path d="M40 48C41.1046 48 42 48.8954 42 50L42 61C42 62.1046 41.1046 63 40 63L35 63L35 48L40 48Z" fill="#002291"/>
62
+ <g filter="url(#filter7_f_2453_6894)">
63
+ <rect x="31" y="43" width="18" height="26" fill="url(#paint7_linear_2453_6894)"/>
64
+ </g>
65
+ </g>
66
+ </g>
67
+ <g clip-path="url(#clip11_2453_6894)">
68
+ <path d="M32 48L32 63L16 63C14.8954 63 14 62.1046 14 61L14 50C14 48.8954 14.8954 48 16 48L32 48Z" fill="#002291"/>
69
+ <g filter="url(#filter8_f_2453_6894)">
70
+ <rect x="14" y="23" width="82" height="40" fill="url(#paint8_linear_2453_6894)"/>
71
+ </g>
72
+ </g>
73
+ </g>
74
+ <defs>
75
+ <filter id="filter0_f_2453_6894" x="18" y="-8" width="128" height="44" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
76
+ <feFlood flood-opacity="0" result="BackgroundImageFix"/>
77
+ <feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
78
+ <feGaussianBlur stdDeviation="2.5" result="effect1_foregroundBlur_2453_6894"/>
79
+ </filter>
80
+ <filter id="filter1_f_2453_6894" x="41" y="0" width="39" height="36" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
81
+ <feFlood flood-opacity="0" result="BackgroundImageFix"/>
82
+ <feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
83
+ <feGaussianBlur stdDeviation="2.5" result="effect1_foregroundBlur_2453_6894"/>
84
+ </filter>
85
+ <filter id="filter2_f_2453_6894" x="9" y="-16" width="139" height="46" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
86
+ <feFlood flood-opacity="0" result="BackgroundImageFix"/>
87
+ <feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
88
+ <feGaussianBlur stdDeviation="2.5" result="effect1_foregroundBlur_2453_6894"/>
89
+ </filter>
90
+ <filter id="filter3_f_2453_6894" x="8" y="15" width="100" height="40" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
91
+ <feFlood flood-opacity="0" result="BackgroundImageFix"/>
92
+ <feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
93
+ <feGaussianBlur stdDeviation="2.5" result="effect1_foregroundBlur_2453_6894"/>
94
+ </filter>
95
+ <filter id="filter4_f_2453_6894" x="31" y="19" width="32" height="36" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
96
+ <feFlood flood-opacity="0" result="BackgroundImageFix"/>
97
+ <feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
98
+ <feGaussianBlur stdDeviation="2.5" result="effect1_foregroundBlur_2453_6894"/>
99
+ </filter>
100
+ <filter id="filter5_f_2453_6894" x="9" y="-1" width="92" height="50" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
101
+ <feFlood flood-opacity="0" result="BackgroundImageFix"/>
102
+ <feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
103
+ <feGaussianBlur stdDeviation="2.5" result="effect1_foregroundBlur_2453_6894"/>
104
+ </filter>
105
+ <filter id="filter6_f_2453_6894" x="17" y="30" width="57" height="44" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
106
+ <feFlood flood-opacity="0" result="BackgroundImageFix"/>
107
+ <feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
108
+ <feGaussianBlur stdDeviation="2.5" result="effect1_foregroundBlur_2453_6894"/>
109
+ </filter>
110
+ <filter id="filter7_f_2453_6894" x="26" y="38" width="28" height="36" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
111
+ <feFlood flood-opacity="0" result="BackgroundImageFix"/>
112
+ <feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
113
+ <feGaussianBlur stdDeviation="2.5" result="effect1_foregroundBlur_2453_6894"/>
114
+ </filter>
115
+ <filter id="filter8_f_2453_6894" x="9" y="18" width="92" height="50" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
116
+ <feFlood flood-opacity="0" result="BackgroundImageFix"/>
117
+ <feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
118
+ <feGaussianBlur stdDeviation="2.5" result="effect1_foregroundBlur_2453_6894"/>
119
+ </filter>
120
+ <linearGradient id="paint0_linear_2453_6894" x1="124.265" y1="0.0518266" x2="111.394" y2="57.0503" gradientUnits="userSpaceOnUse">
121
+ <stop offset="0.176006" stop-color="#EAEFF1"/>
122
+ <stop offset="0.576923" stop-color="#B8C4FF"/>
123
+ <stop offset="0.85" stop-color="#002291"/>
124
+ </linearGradient>
125
+ <linearGradient id="paint1_linear_2453_6894" x1="70.8871" y1="7.33375" x2="49.3386" y2="38.0033" gradientUnits="userSpaceOnUse">
126
+ <stop offset="0.176006" stop-color="#EAEFF1"/>
127
+ <stop offset="0.576923" stop-color="#B8C4FF"/>
128
+ <stop offset="0.85" stop-color="#002291"/>
129
+ </linearGradient>
130
+ <linearGradient id="paint2_linear_2453_6894" x1="124.705" y1="-7.76865" x2="111.466" y2="52.7646" gradientUnits="userSpaceOnUse">
131
+ <stop offset="0.176006" stop-color="#EAEFF1"/>
132
+ <stop offset="0.576923" stop-color="#B8C4FF"/>
133
+ <stop offset="0.85" stop-color="#002291"/>
134
+ </linearGradient>
135
+ <linearGradient id="paint3_linear_2453_6894" x1="90.2357" y1="22.6928" x2="77.3102" y2="72.1734" gradientUnits="userSpaceOnUse">
136
+ <stop offset="0.176006" stop-color="#EAEFF1"/>
137
+ <stop offset="0.576923" stop-color="#B8C4FF"/>
138
+ <stop offset="0.85" stop-color="#002291"/>
139
+ </linearGradient>
140
+ <linearGradient id="paint4_linear_2453_6894" x1="54.8798" y1="26.3337" x2="32.0423" y2="50.9921" gradientUnits="userSpaceOnUse">
141
+ <stop offset="0.176006" stop-color="#EAEFF1"/>
142
+ <stop offset="0.576923" stop-color="#B8C4FF"/>
143
+ <stop offset="0.85" stop-color="#002291"/>
144
+ </linearGradient>
145
+ <linearGradient id="paint5_linear_2453_6894" x1="84.3703" y1="7.59038" x2="60.864" y2="69.0806" gradientUnits="userSpaceOnUse">
146
+ <stop offset="0.176006" stop-color="#EAEFF1"/>
147
+ <stop offset="0.576923" stop-color="#B8C4FF"/>
148
+ <stop offset="0.85" stop-color="#002291"/>
149
+ </linearGradient>
150
+ <linearGradient id="paint6_linear_2453_6894" x1="62.3342" y1="38.0518" x2="36.6335" y2="83.3865" gradientUnits="userSpaceOnUse">
151
+ <stop offset="0.176006" stop-color="#EAEFF1"/>
152
+ <stop offset="0.576923" stop-color="#B8C4FF"/>
153
+ <stop offset="0.85" stop-color="#002291"/>
154
+ </linearGradient>
155
+ <linearGradient id="paint7_linear_2453_6894" x1="46.4471" y1="45.3337" x2="23.7173" y2="65.4137" gradientUnits="userSpaceOnUse">
156
+ <stop offset="0.176006" stop-color="#EAEFF1"/>
157
+ <stop offset="0.576923" stop-color="#B8C4FF"/>
158
+ <stop offset="0.85" stop-color="#002291"/>
159
+ </linearGradient>
160
+ <linearGradient id="paint8_linear_2453_6894" x1="84.3703" y1="26.5904" x2="60.864" y2="88.0806" gradientUnits="userSpaceOnUse">
161
+ <stop offset="0.176006" stop-color="#EAEFF1"/>
162
+ <stop offset="0.576923" stop-color="#B8C4FF"/>
163
+ <stop offset="0.85" stop-color="#002291"/>
164
+ </linearGradient>
165
+ <clipPath id="clip0_2453_6894">
166
+ <path d="M14 13C14 11.3431 15.3431 10 17 10L55 10C56.6569 10 58 11.3431 58 13V22C58 23.6569 56.6569 25 55 25L17 25C15.3431 25 14 23.6569 14 22L14 13Z" fill="white"/>
167
+ </clipPath>
168
+ <clipPath id="clip1_2453_6894">
169
+ <rect width="15" height="17" fill="white" transform="translate(50 10) rotate(90)"/>
170
+ </clipPath>
171
+ <clipPath id="clip2_2453_6894">
172
+ <path d="M56 10C57.1046 10 58 10.8954 58 12L58 23C58 24.1046 57.1046 25 56 25L50 25L50 10L56 10Z" fill="white"/>
173
+ </clipPath>
174
+ <clipPath id="clip3_2453_6894">
175
+ <path d="M33 10L33 25L16 25C14.8954 25 14 24.1046 14 23L14 12C14 10.8954 14.8954 10 16 10L33 10Z" fill="white"/>
176
+ </clipPath>
177
+ <clipPath id="clip4_2453_6894">
178
+ <path d="M14 32C14 30.3431 15.3431 29 17 29L48 29C49.6569 29 51 30.3431 51 32V41C51 42.6569 49.6569 44 48 44L17 44C15.3431 44 14 42.6569 14 41L14 32Z" fill="white"/>
179
+ </clipPath>
180
+ <clipPath id="clip5_2453_6894">
181
+ <rect width="15" height="17" fill="white" transform="translate(40 29) rotate(90)"/>
182
+ </clipPath>
183
+ <clipPath id="clip6_2453_6894">
184
+ <path d="M49 29C50.1046 29 51 29.8954 51 31L51 42C51 43.1046 50.1046 44 49 44L40 44L40 29L49 29Z" fill="white"/>
185
+ </clipPath>
186
+ <clipPath id="clip7_2453_6894">
187
+ <path d="M23 29L23 44L16 44C14.8954 44 14 43.1046 14 42L14 31C14 29.8954 14.8954 29 16 29L23 29Z" fill="white"/>
188
+ </clipPath>
189
+ <clipPath id="clip8_2453_6894">
190
+ <path d="M14 51C14 49.3431 15.3431 48 17 48L46 48C47.6569 48 49 49.3431 49 51V60C49 61.6569 47.6569 63 46 63L17 63C15.3431 63 14 61.6569 14 60L14 51Z" fill="white"/>
191
+ </clipPath>
192
+ <clipPath id="clip9_2453_6894">
193
+ <rect width="15" height="4" fill="white" transform="translate(36 48) rotate(90)"/>
194
+ </clipPath>
195
+ <clipPath id="clip10_2453_6894">
196
+ <path d="M40 48C41.1046 48 42 48.8954 42 50L42 61C42 62.1046 41.1046 63 40 63L35 63L35 48L40 48Z" fill="white"/>
197
+ </clipPath>
198
+ <clipPath id="clip11_2453_6894">
199
+ <path d="M32 48L32 63L16 63C14.8954 63 14 62.1046 14 61L14 50C14 48.8954 14.8954 48 16 48L32 48Z" fill="white"/>
200
+ </clipPath>
201
+ <clipPath id="wash_0_clippath"><path d="M14 13C14 11.3431 15.3431 10 17 10L55 10C56.6569 10 58 11.3431 58 13V22C58 23.6569 56.6569 25 55 25L17 25C15.3431 25 14 23.6569 14 22L14 13Z" fill="white"/></clipPath><clipPath id="wash_1_clippath"><path d="M14 32C14 30.3431 15.3431 29 17 29L48 29C49.6569 29 51 30.3431 51 32V41C51 42.6569 49.6569 44 48 44L17 44C15.3431 44 14 42.6569 14 41L14 32Z" fill="white"/></clipPath><clipPath id="wash_2_clippath"><path d="M14 51C14 49.3431 15.3431 48 17 48L46 48C47.6569 48 49 49.3431 49 51V60C49 61.6569 47.6569 63 46 63L17 63C15.3431 63 14 61.6569 14 60L14 51Z" fill="white"/></clipPath></defs>
202
+ </svg>
package/src/MaxWidth.svg CHANGED
@@ -54,4 +54,4 @@
54
54
  <rect x="108.592" y="66.4141" width="19" height="7" rx="3.5" fill="white"/>
55
55
  </clipPath>
56
56
  </defs>
57
- </svg>
57
+ </svg>
package/src/SideMenu.svg ADDED
@@ -0,0 +1,85 @@
1
+ <svg width="100" height="100" viewBox="0 0 100 100" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <g clip-path="url(#clip0_2453_6834)">
3
+ <rect width="83" height="43" rx="6" transform="matrix(4.37114e-08 -1 -1 -4.37114e-08 71 91)" fill="#002291"/>
4
+ <g filter="url(#filter0_f_2453_6834)">
5
+ <rect width="101" height="79" transform="matrix(1.19249e-08 1 1 -1.19249e-08 24 -6)" fill="url(#paint0_linear_2453_6834)"/>
6
+ </g>
7
+ <g clip-path="url(#clip1_2453_6834)">
8
+ <path d="M34 91C30.6863 91 28 88.3137 28 85V25C28 21.6863 30.6863 19 34 19H65C68.3137 19 71 21.6863 71 25V85C71 88.3137 68.3137 91 65 91H34Z" fill="#002291"/>
9
+ <g filter="url(#filter1_f_2453_6834)">
10
+ <rect x="25.9532" y="9.13281" width="63.0242" height="83.4147" transform="rotate(-0.0592402 25.9532 9.13281)" fill="url(#paint1_linear_2453_6834)"/>
11
+ </g>
12
+ <g clip-path="url(#clip2_2453_6834)">
13
+ <path d="M28 25C28 21.6863 30.6863 19 34 19H55V91H34C30.6863 91 28 88.3137 28 85V25Z" fill="#002291"/>
14
+ <g filter="url(#filter2_f_2453_6834)">
15
+ <path d="M28 -74H119V91H28V-74Z" fill="url(#paint2_linear_2453_6834)"/>
16
+ </g>
17
+ <path d="M34 51.7777C34 51.4187 34.291 51.1277 34.65 51.1277H47.35C47.709 51.1277 48 51.4187 48 51.7777C48 52.1367 47.709 52.4277 47.35 52.4277H34.65C34.291 52.4277 34 52.1367 34 51.7777Z" fill="#D5DFFF"/>
18
+ <path d="M34 56.7777C34 56.4187 34.291 56.1277 34.65 56.1277H47.35C47.709 56.1277 48 56.4187 48 56.7777C48 57.1367 47.709 57.4277 47.35 57.4277H34.65C34.291 57.4277 34 57.1367 34 56.7777Z" fill="#D5DFFF"/>
19
+ <path d="M34 46.7777C34 46.4187 34.291 46.1277 34.65 46.1277H47.35C47.709 46.1277 48 46.4187 48 46.7777C48 47.1367 47.709 47.4277 47.35 47.4277H34.65C34.291 47.4277 34 47.1367 34 46.7777Z" fill="#D5DFFF"/>
20
+ <path d="M34 41.6527C34 41.2937 34.291 41.0027 34.65 41.0027H47.35C47.709 41.0027 48 41.2937 48 41.6527C48 42.0117 47.709 42.3027 47.35 42.3027H34.65C34.291 42.3027 34 42.0117 34 41.6527Z" fill="#D5DFFF"/>
21
+ <path d="M37.7782 27.6287C38.0125 27.3946 38.3916 27.3946 38.6258 27.6287C38.8601 27.863 38.86 28.2421 38.6258 28.4764L37.8475 29.2547L38.6258 30.033C38.86 30.2673 38.86 30.6464 38.6258 30.8807C38.3916 31.115 38.0125 31.1149 37.7782 30.8807L36.9999 30.1024L36.2215 30.8807C35.9872 31.1149 35.6081 31.115 35.3739 30.8807C35.1397 30.6464 35.1397 30.2673 35.3739 30.033L36.1522 29.2547L35.3739 28.4764C35.1397 28.2421 35.1396 27.863 35.3739 27.6287C35.6081 27.3946 35.9872 27.3946 36.2215 27.6287L36.9999 28.4071L37.7782 27.6287Z" fill="#D5DFFF"/>
22
+ </g>
23
+ </g>
24
+ <g clip-path="url(#clip3_2453_6834)">
25
+ <rect x="44" y="12" width="10" height="3" rx="1.5" fill="#002291"/>
26
+ <g filter="url(#filter3_f_2453_6834)">
27
+ <path d="M44.0001 -4.82031H76.0883V14.665H44.0001V-4.82031Z" fill="url(#paint3_linear_2453_6834)"/>
28
+ </g>
29
+ </g>
30
+ </g>
31
+ <defs>
32
+ <filter id="filter0_f_2453_6834" x="11.2917" y="-18.7083" width="104.417" height="126.417" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
33
+ <feFlood flood-opacity="0" result="BackgroundImageFix"/>
34
+ <feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
35
+ <feGaussianBlur stdDeviation="6.35417" result="effect1_foregroundBlur_2453_6834"/>
36
+ </filter>
37
+ <filter id="filter1_f_2453_6834" x="13.9532" y="-2.92969" width="87.1104" height="107.477" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
38
+ <feFlood flood-opacity="0" result="BackgroundImageFix"/>
39
+ <feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
40
+ <feGaussianBlur stdDeviation="6" result="effect1_foregroundBlur_2453_6834"/>
41
+ </filter>
42
+ <filter id="filter2_f_2453_6834" x="15.2917" y="-86.7083" width="116.417" height="190.417" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
43
+ <feFlood flood-opacity="0" result="BackgroundImageFix"/>
44
+ <feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
45
+ <feGaussianBlur stdDeviation="6.35417" result="effect1_foregroundBlur_2453_6834"/>
46
+ </filter>
47
+ <filter id="filter3_f_2453_6834" x="40.179" y="-8.64139" width="39.7304" height="27.1265" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
48
+ <feFlood flood-opacity="0" result="BackgroundImageFix"/>
49
+ <feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
50
+ <feGaussianBlur stdDeviation="1.91054" result="effect1_foregroundBlur_2453_6834"/>
51
+ </filter>
52
+ <linearGradient id="paint0_linear_2453_6834" x1="86.6757" y1="7.09101" x2="24.6581" y2="108.266" gradientUnits="userSpaceOnUse">
53
+ <stop offset="0.211538" stop-color="#B8C4FF"/>
54
+ <stop offset="0.552885" stop-color="#D5DFFF"/>
55
+ <stop offset="0.879808" stop-color="#EAEFF1"/>
56
+ </linearGradient>
57
+ <linearGradient id="paint1_linear_2453_6834" x1="80.039" y1="16.6201" x2="6.6037" y2="87.4206" gradientUnits="userSpaceOnUse">
58
+ <stop offset="0.274038" stop-color="#EAEFF1"/>
59
+ <stop offset="0.596154" stop-color="#B8C4FF"/>
60
+ <stop offset="0.85" stop-color="#002291"/>
61
+ </linearGradient>
62
+ <linearGradient id="paint2_linear_2453_6834" x1="106.094" y1="-59.1897" x2="-30.732" y2="37.1028" gradientUnits="userSpaceOnUse">
63
+ <stop offset="0.176006" stop-color="#EAEFF1"/>
64
+ <stop offset="0.55" stop-color="#B8C4FF"/>
65
+ <stop offset="0.8" stop-color="#002291"/>
66
+ </linearGradient>
67
+ <linearGradient id="paint3_linear_2453_6834" x1="71.5374" y1="-3.07132" x2="58.2165" y2="24.9209" gradientUnits="userSpaceOnUse">
68
+ <stop offset="0.176006" stop-color="#EAEFF1"/>
69
+ <stop offset="0.576923" stop-color="#B8C4FF"/>
70
+ <stop offset="0.85" stop-color="#002291"/>
71
+ </linearGradient>
72
+ <clipPath id="clip0_2453_6834">
73
+ <rect width="83" height="43" rx="6" transform="matrix(4.37114e-08 -1 -1 -4.37114e-08 71 91)" fill="white"/>
74
+ </clipPath>
75
+ <clipPath id="clip1_2453_6834">
76
+ <path d="M34 91C30.6863 91 28 88.3137 28 85V25C28 21.6863 30.6863 19 34 19H65C68.3137 19 71 21.6863 71 25V85C71 88.3137 68.3137 91 65 91H34Z" fill="white"/>
77
+ </clipPath>
78
+ <clipPath id="clip2_2453_6834">
79
+ <path d="M28 25C28 21.6863 30.6863 19 34 19H55V91H34C30.6863 91 28 88.3137 28 85V25Z" fill="white"/>
80
+ </clipPath>
81
+ <clipPath id="clip3_2453_6834">
82
+ <rect x="44" y="12" width="10" height="3" rx="1.5" fill="white"/>
83
+ </clipPath>
84
+ </defs>
85
+ </svg>
package/src/VerticalStackedBarChart.svg ADDED
@@ -0,0 +1,202 @@
1
+ <svg width="72" height="72" viewBox="0 0 72 72" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#wash_0_clippath)"><path d="M23 58C24.1046 58 25 57.1046 25 56L25 16C25 14.8954 24.1046 14 23 14L12 14C10.8954 14 10 14.8954 10 16L10 56C10 57.1046 10.8954 58 12 58L23 58Z" fill="var(--wds-illustration-color-opacity-100, #f8f6f100)"/></g><g clip-path="url(#wash_1_clippath)"><path d="M41 58C42.6569 58 44 56.6569 44 55L44 24C44 22.3431 42.6569 21 41 21L32 21C30.3431 21 29 22.3431 29 24L29 55C29 56.6569 30.3431 58 32 58L41 58Z" fill="var(--wds-illustration-color-opacity-100, #f8f6f100)"/></g><g clip-path="url(#wash_2_clippath)"><path d="M60 58C61.6569 58 63 56.6569 63 55L63 33C63 31.3431 61.6569 30 60 30L51 30C49.3431 30 48 31.3431 48 33L48 55C48 56.6569 49.3431 58 51 58L60 58Z" fill="var(--wds-illustration-color-opacity-100, #f8f6f100)"/></g>
2
+ <g clip-path="url(#clip0_2453_7136)">
3
+ <g opacity="0.65">
4
+ <g clip-path="url(#clip1_2453_7136)">
5
+ <rect width="15" height="17" transform="matrix(-1 0 0 1 25 22)" fill="#002291"/>
6
+ <g filter="url(#filter0_f_2453_7136)">
7
+ <rect width="118" height="34" transform="matrix(4.37114e-08 -1 -1 -4.37114e-08 38 49)" fill="url(#paint0_linear_2453_7136)"/>
8
+ </g>
9
+ </g>
10
+ </g>
11
+ <g opacity="0.35">
12
+ <g clip-path="url(#clip2_2453_7136)">
13
+ <path d="M25 16C25 14.8954 24.1046 14 23 14H12C10.8954 14 10 14.8954 10 16V22H25V16Z" fill="#002291"/>
14
+ <g filter="url(#filter1_f_2453_7136)">
15
+ <rect width="29" height="26" transform="matrix(4.37114e-08 -1 -1 -4.37114e-08 30 26)" fill="url(#paint1_linear_2453_7136)"/>
16
+ </g>
17
+ </g>
18
+ </g>
19
+ <g clip-path="url(#clip3_2453_7136)">
20
+ <path d="M25 39H10V56C10 57.1046 10.8954 58 12 58H23C24.1046 58 25 57.1046 25 56V39Z" fill="#002291"/>
21
+ <g filter="url(#filter2_f_2453_7136)">
22
+ <rect width="129" height="36" transform="matrix(4.37114e-08 -1 -1 -4.37114e-08 46 58)" fill="url(#paint2_linear_2453_7136)"/>
23
+ </g>
24
+ </g>
25
+ </g>
26
+ <g clip-path="url(#clip4_2453_7136)">
27
+ <g opacity="0.65">
28
+ <g clip-path="url(#clip5_2453_7136)">
29
+ <rect width="15" height="17" transform="matrix(-1 0 0 1 44 32)" fill="#002291"/>
30
+ <g filter="url(#filter3_f_2453_7136)">
31
+ <rect width="90" height="30" transform="matrix(4.37114e-08 -1 -1 -4.37114e-08 53 59)" fill="url(#paint3_linear_2453_7136)"/>
32
+ </g>
33
+ </g>
34
+ </g>
35
+ <g opacity="0.35">
36
+ <g clip-path="url(#clip6_2453_7136)">
37
+ <path d="M44 23C44 21.8954 43.1046 21 42 21H31C29.8954 21 29 21.8954 29 23V32H44V23Z" fill="#002291"/>
38
+ <g filter="url(#filter4_f_2453_7136)">
39
+ <rect width="22" height="26" transform="matrix(4.37114e-08 -1 -1 -4.37114e-08 49 36)" fill="url(#paint4_linear_2453_7136)"/>
40
+ </g>
41
+ </g>
42
+ </g>
43
+ <g clip-path="url(#clip7_2453_7136)">
44
+ <path d="M44 49H29V56C29 57.1046 29.8954 58 31 58H42C43.1046 58 44 57.1046 44 56V49Z" fill="#002291"/>
45
+ <g filter="url(#filter5_f_2453_7136)">
46
+ <rect width="82" height="40" transform="matrix(4.37114e-08 -1 -1 -4.37114e-08 69 58)" fill="url(#paint5_linear_2453_7136)"/>
47
+ </g>
48
+ </g>
49
+ </g>
50
+ <g clip-path="url(#clip8_2453_7136)">
51
+ <g opacity="0.65">
52
+ <g clip-path="url(#clip9_2453_7136)">
53
+ <rect width="15" height="4" transform="matrix(-1 0 0 1 63 36)" fill="#002291"/>
54
+ <g filter="url(#filter6_f_2453_7136)">
55
+ <rect width="47" height="34" transform="matrix(4.37114e-08 -1 -1 -4.37114e-08 76 50)" fill="url(#paint6_linear_2453_7136)"/>
56
+ </g>
57
+ </g>
58
+ </g>
59
+ <g opacity="0.35">
60
+ <g clip-path="url(#clip10_2453_7136)">
61
+ <path d="M63 32C63 30.8954 62.1046 30 61 30H50C48.8954 30 48 30.8954 48 32V37H63V32Z" fill="#002291"/>
62
+ <g filter="url(#filter7_f_2453_7136)">
63
+ <rect width="18" height="26" transform="matrix(4.37114e-08 -1 -1 -4.37114e-08 68 41)" fill="url(#paint7_linear_2453_7136)"/>
64
+ </g>
65
+ </g>
66
+ </g>
67
+ <g clip-path="url(#clip11_2453_7136)">
68
+ <path d="M63 40H48V56C48 57.1046 48.8954 58 50 58H61C62.1046 58 63 57.1046 63 56V40Z" fill="#002291"/>
69
+ <g filter="url(#filter8_f_2453_7136)">
70
+ <rect width="82" height="40" transform="matrix(4.37114e-08 -1 -1 -4.37114e-08 88 58)" fill="url(#paint8_linear_2453_7136)"/>
71
+ </g>
72
+ </g>
73
+ </g>
74
+ <defs>
75
+ <filter id="filter0_f_2453_7136" x="-1" y="-74" width="44" height="128" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
76
+ <feFlood flood-opacity="0" result="BackgroundImageFix"/>
77
+ <feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
78
+ <feGaussianBlur stdDeviation="2.5" result="effect1_foregroundBlur_2453_7136"/>
79
+ </filter>
80
+ <filter id="filter1_f_2453_7136" x="-1" y="-8" width="36" height="39" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
81
+ <feFlood flood-opacity="0" result="BackgroundImageFix"/>
82
+ <feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
83
+ <feGaussianBlur stdDeviation="2.5" result="effect1_foregroundBlur_2453_7136"/>
84
+ </filter>
85
+ <filter id="filter2_f_2453_7136" x="5" y="-76" width="46" height="139" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
86
+ <feFlood flood-opacity="0" result="BackgroundImageFix"/>
87
+ <feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
88
+ <feGaussianBlur stdDeviation="2.5" result="effect1_foregroundBlur_2453_7136"/>
89
+ </filter>
90
+ <filter id="filter3_f_2453_7136" x="18" y="-36" width="40" height="100" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
91
+ <feFlood flood-opacity="0" result="BackgroundImageFix"/>
92
+ <feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
93
+ <feGaussianBlur stdDeviation="2.5" result="effect1_foregroundBlur_2453_7136"/>
94
+ </filter>
95
+ <filter id="filter4_f_2453_7136" x="18" y="9" width="36" height="32" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
96
+ <feFlood flood-opacity="0" result="BackgroundImageFix"/>
97
+ <feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
98
+ <feGaussianBlur stdDeviation="2.5" result="effect1_foregroundBlur_2453_7136"/>
99
+ </filter>
100
+ <filter id="filter5_f_2453_7136" x="24" y="-29" width="50" height="92" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
101
+ <feFlood flood-opacity="0" result="BackgroundImageFix"/>
102
+ <feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
103
+ <feGaussianBlur stdDeviation="2.5" result="effect1_foregroundBlur_2453_7136"/>
104
+ </filter>
105
+ <filter id="filter6_f_2453_7136" x="37" y="-2" width="44" height="57" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
106
+ <feFlood flood-opacity="0" result="BackgroundImageFix"/>
107
+ <feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
108
+ <feGaussianBlur stdDeviation="2.5" result="effect1_foregroundBlur_2453_7136"/>
109
+ </filter>
110
+ <filter id="filter7_f_2453_7136" x="37" y="18" width="36" height="28" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
111
+ <feFlood flood-opacity="0" result="BackgroundImageFix"/>
112
+ <feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
113
+ <feGaussianBlur stdDeviation="2.5" result="effect1_foregroundBlur_2453_7136"/>
114
+ </filter>
115
+ <filter id="filter8_f_2453_7136" x="43" y="-29" width="50" height="92" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
116
+ <feFlood flood-opacity="0" result="BackgroundImageFix"/>
117
+ <feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
118
+ <feGaussianBlur stdDeviation="2.5" result="effect1_foregroundBlur_2453_7136"/>
119
+ </filter>
120
+ <linearGradient id="paint0_linear_2453_7136" x1="101.265" y1="3.05183" x2="88.3942" y2="60.0503" gradientUnits="userSpaceOnUse">
121
+ <stop offset="0.176006" stop-color="#EAEFF1"/>
122
+ <stop offset="0.576923" stop-color="#B8C4FF"/>
123
+ <stop offset="0.85" stop-color="#002291"/>
124
+ </linearGradient>
125
+ <linearGradient id="paint1_linear_2453_7136" x1="24.8871" y1="2.33375" x2="3.33863" y2="33.0033" gradientUnits="userSpaceOnUse">
126
+ <stop offset="0.176006" stop-color="#EAEFF1"/>
127
+ <stop offset="0.576923" stop-color="#B8C4FF"/>
128
+ <stop offset="0.85" stop-color="#002291"/>
129
+ </linearGradient>
130
+ <linearGradient id="paint2_linear_2453_7136" x1="110.705" y1="3.23135" x2="97.466" y2="63.7646" gradientUnits="userSpaceOnUse">
131
+ <stop offset="0.176006" stop-color="#EAEFF1"/>
132
+ <stop offset="0.576923" stop-color="#B8C4FF"/>
133
+ <stop offset="0.85" stop-color="#002291"/>
134
+ </linearGradient>
135
+ <linearGradient id="paint3_linear_2453_7136" x1="77.2357" y1="2.69279" x2="64.3102" y2="52.1734" gradientUnits="userSpaceOnUse">
136
+ <stop offset="0.176006" stop-color="#EAEFF1"/>
137
+ <stop offset="0.576923" stop-color="#B8C4FF"/>
138
+ <stop offset="0.85" stop-color="#002291"/>
139
+ </linearGradient>
140
+ <linearGradient id="paint4_linear_2453_7136" x1="18.8798" y1="2.33375" x2="-3.95767" y2="26.9921" gradientUnits="userSpaceOnUse">
141
+ <stop offset="0.176006" stop-color="#EAEFF1"/>
142
+ <stop offset="0.576923" stop-color="#B8C4FF"/>
143
+ <stop offset="0.85" stop-color="#002291"/>
144
+ </linearGradient>
145
+ <linearGradient id="paint5_linear_2453_7136" x1="70.3703" y1="3.59038" x2="46.864" y2="65.0806" gradientUnits="userSpaceOnUse">
146
+ <stop offset="0.176006" stop-color="#EAEFF1"/>
147
+ <stop offset="0.576923" stop-color="#B8C4FF"/>
148
+ <stop offset="0.85" stop-color="#002291"/>
149
+ </linearGradient>
150
+ <linearGradient id="paint6_linear_2453_7136" x1="40.3342" y1="3.05183" x2="14.6335" y2="48.3865" gradientUnits="userSpaceOnUse">
151
+ <stop offset="0.176006" stop-color="#EAEFF1"/>
152
+ <stop offset="0.576923" stop-color="#B8C4FF"/>
153
+ <stop offset="0.85" stop-color="#002291"/>
154
+ </linearGradient>
155
+ <linearGradient id="paint7_linear_2453_7136" x1="15.4471" y1="2.33375" x2="-7.28274" y2="22.4137" gradientUnits="userSpaceOnUse">
156
+ <stop offset="0.176006" stop-color="#EAEFF1"/>
157
+ <stop offset="0.576923" stop-color="#B8C4FF"/>
158
+ <stop offset="0.85" stop-color="#002291"/>
159
+ </linearGradient>
160
+ <linearGradient id="paint8_linear_2453_7136" x1="70.3703" y1="3.59038" x2="46.864" y2="65.0806" gradientUnits="userSpaceOnUse">
161
+ <stop offset="0.176006" stop-color="#EAEFF1"/>
162
+ <stop offset="0.576923" stop-color="#B8C4FF"/>
163
+ <stop offset="0.85" stop-color="#002291"/>
164
+ </linearGradient>
165
+ <clipPath id="clip0_2453_7136">
166
+ <path d="M22 58C23.6569 58 25 56.6569 25 55L25 17C25 15.3431 23.6569 14 22 14L13 14C11.3431 14 10 15.3431 10 17L10 55C10 56.6569 11.3431 58 13 58L22 58Z" fill="white"/>
167
+ </clipPath>
168
+ <clipPath id="clip1_2453_7136">
169
+ <rect width="15" height="17" fill="white" transform="matrix(-1 0 0 1 25 22)"/>
170
+ </clipPath>
171
+ <clipPath id="clip2_2453_7136">
172
+ <path d="M25 16C25 14.8954 24.1046 14 23 14H12C10.8954 14 10 14.8954 10 16V22H25V16Z" fill="white"/>
173
+ </clipPath>
174
+ <clipPath id="clip3_2453_7136">
175
+ <path d="M25 39H10V56C10 57.1046 10.8954 58 12 58H23C24.1046 58 25 57.1046 25 56V39Z" fill="white"/>
176
+ </clipPath>
177
+ <clipPath id="clip4_2453_7136">
178
+ <path d="M41 58C42.6569 58 44 56.6569 44 55L44 24C44 22.3431 42.6569 21 41 21L32 21C30.3431 21 29 22.3431 29 24L29 55C29 56.6569 30.3431 58 32 58L41 58Z" fill="white"/>
179
+ </clipPath>
180
+ <clipPath id="clip5_2453_7136">
181
+ <rect width="15" height="17" fill="white" transform="matrix(-1 0 0 1 44 32)"/>
182
+ </clipPath>
183
+ <clipPath id="clip6_2453_7136">
184
+ <path d="M44 23C44 21.8954 43.1046 21 42 21H31C29.8954 21 29 21.8954 29 23V32H44V23Z" fill="white"/>
185
+ </clipPath>
186
+ <clipPath id="clip7_2453_7136">
187
+ <path d="M44 49H29V56C29 57.1046 29.8954 58 31 58H42C43.1046 58 44 57.1046 44 56V49Z" fill="white"/>
188
+ </clipPath>
189
+ <clipPath id="clip8_2453_7136">
190
+ <path d="M60 58C61.6569 58 63 56.6569 63 55L63 26C63 24.3431 61.6569 23 60 23L51 23C49.3431 23 48 24.3431 48 26L48 55C48 56.6569 49.3431 58 51 58L60 58Z" fill="white"/>
191
+ </clipPath>
192
+ <clipPath id="clip9_2453_7136">
193
+ <rect width="15" height="4" fill="white" transform="matrix(-1 0 0 1 63 36)"/>
194
+ </clipPath>
195
+ <clipPath id="clip10_2453_7136">
196
+ <path d="M63 32C63 30.8954 62.1046 30 61 30H50C48.8954 30 48 30.8954 48 32V37H63V32Z" fill="white"/>
197
+ </clipPath>
198
+ <clipPath id="clip11_2453_7136">
199
+ <path d="M63 40H48V56C48 57.1046 48.8954 58 50 58H61C62.1046 58 63 57.1046 63 56V40Z" fill="white"/>
200
+ </clipPath>
201
+ <clipPath id="wash_0_clippath"><path d="M22 58C23.6569 58 25 56.6569 25 55L25 17C25 15.3431 23.6569 14 22 14L13 14C11.3431 14 10 15.3431 10 17L10 55C10 56.6569 11.3431 58 13 58L22 58Z" fill="white"/></clipPath><clipPath id="wash_1_clippath"><path d="M41 58C42.6569 58 44 56.6569 44 55L44 24C44 22.3431 42.6569 21 41 21L32 21C30.3431 21 29 22.3431 29 24L29 55C29 56.6569 30.3431 58 32 58L41 58Z" fill="white"/></clipPath><clipPath id="wash_2_clippath"><path d="M60 58C61.6569 58 63 56.6569 63 55L63 26C63 24.3431 61.6569 23 60 23L51 23C49.3431 23 48 24.3431 48 26L48 55C48 56.6569 49.3431 58 51 58L60 58Z" fill="white"/></clipPath></defs>
202
+ </svg>