@redneckz/wildless-cms-uni-blocks 0.2.73 → 0.2.74

package/src/icons/GlassIcon.svg

@@ -0,0 +1 @@
+<svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 63 63"><g clip-path="url(#a)"><path d="M63 60.987c0-.13-.172-.259-.505-.382-3.072-.812-12.836-1.398-24.405-1.398-14.04 0-25.427.873-25.427 1.944 0 .13.172.26.505.382 3.083.812 12.837 1.399 24.406 1.399 14.04 0 25.426-.873 25.426-1.945Z" fill="#050304"/><path d="M63 60.987c0-.13-.172-.259-.505-.382-3.072-.812-12.836-1.398-24.405-1.398-14.04 0-25.427.873-25.427 1.944 0 .13.172.26.505.382 3.083.812 12.837 1.399 24.406 1.399 14.04 0 25.426-.873 25.426-1.945Z" fill="url(#b)"/><path d="M63 60.987c0-.13-.172-.259-.505-.382-3.072-.812-12.836-1.398-24.405-1.398-14.04 0-25.427.873-25.427 1.944 0 .13.172.26.505.382 3.083.812 12.837 1.399 24.406 1.399 14.04 0 25.426-.873 25.426-1.945Z" fill="#050304"/><path d="M63 60.987c0-.13-.172-.259-.505-.382-3.072-.812-12.836-1.398-24.405-1.398-14.04 0-25.427.873-25.427 1.944 0 .13.172.26.505.382 3.083.812 12.837 1.399 24.406 1.399 14.04 0 25.426-.873 25.426-1.945Z" fill="url(#c)"/><path d="M53.554 40.447a.31.31 0 0 0-.609 0l-.269 1.279a1.153 1.153 0 0 1-.89.89l-1.28.27a.31.31 0 0 0 0 .608l1.28.27c.447.093.796.443.89.89l.27 1.28a.31.31 0 0 0 .608 0l.269-1.28c.094-.447.443-.797.89-.89l1.28-.27a.31.31 0 0 0 0-.608l-1.28-.27a1.153 1.153 0 0 1-.89-.89l-.27-1.279Z" fill="#FFCA42"/><path d="M48.658 53.298H15.076a.827.827 0 0 1-.824-.824v-2.213c0-.454.37-.825.824-.825h33.582c.453 0 .824.371.824.825v2.213c0 .453-.371.824-.824.824Z" fill="#FA552D"/><path d="M48.658 53.298H15.076a.827.827 0 0 1-.824-.824v-2.213c0-.454.37-.825.824-.825h33.582c.453 0 .824.371.824.825v2.213c0 .453-.371.824-.824.824Z" fill="#42AB44"/><path d="M26.19 52.168h-.597v.552h.597v-.552Zm1.196-.42h-.598v.972h.598v-.972Zm1.195-.643h-.598v1.615h.598v-1.615Zm1.195.26h-.598v1.355h.598v-1.356Zm1.191-1.357h-.598v2.436h.598v-2.436Zm1.195 0h-.597v2.712h.597v-2.712Zm1.196 0h-.598v2.712h.598v-2.712Zm1.195 0h-.598v2.712h.598v-2.712Zm1.19 0h-.597v2.712h.598v-2.712Zm1.196 0h-.597v2.712h.597v-2.712Zm1.195 0h-.597v2.712h.597v-2.712Zm1.196 0h-.598v1.904h.598v-1.904Zm1.19 0h-.597v2.712h.598v-2.712Zm1.196 0h-.598v2.712h.598v-2.712Zm1.195 0h-.598v2.712h.598v-2.712Zm1.195 0h-.597v2.712h.597v-2.712Zm1.191 0H44.7v2.712h.597v-2.712Zm1.196 0h-.598v2.712h.597v-2.712Zm1.195 0h-.598v2.712h.598v-2.712Zm1.195 0h-.598v2.712h.598v-2.712Z" fill="#5F1A58"/><path d="M26.19 52.168h-.597v.552h.597v-.552Zm1.196-.42h-.598v.972h.598v-.972Zm1.195-.643h-.598v1.615h.598v-1.615Zm1.195.26h-.598v1.355h.598v-1.356Zm1.191-1.357h-.598v2.436h.598v-2.436Zm1.195 0h-.597v2.712h.597v-2.712Zm1.196 0h-.598v2.712h.598v-2.712Zm1.195 0h-.598v2.712h.598v-2.712Zm1.19 0h-.597v2.712h.598v-2.712Zm1.196 0h-.597v2.712h.597v-2.712Zm1.195 0h-.597v2.712h.597v-2.712Zm1.196 0h-.598v1.904h.598v-1.904Zm1.19 0h-.597v2.712h.598v-2.712Zm1.196 0h-.598v2.712h.598v-2.712Zm1.195 0h-.598v2.712h.598v-2.712Zm1.195 0h-.597v2.712h.597v-2.712Zm1.191 0H44.7v2.712h.597v-2.712Zm1.196 0h-.598v2.712h.597v-2.712Zm1.195 0h-.598v2.712h.598v-2.712Zm1.195 0h-.598v2.712h.598v-2.712Z" fill="#050304"/><path d="M26.19 52.168h-.597v.552h.597v-.552Zm1.196-.42h-.598v.972h.598v-.972Zm1.195-.643h-.598v1.615h.598v-1.615Zm1.195.26h-.598v1.355h.598v-1.356Zm1.191-1.357h-.598v2.436h.598v-2.436Zm1.195 0h-.597v2.712h.597v-2.712Zm1.196 0h-.598v2.712h.598v-2.712Zm1.195 0h-.598v2.712h.598v-2.712Zm1.19 0h-.597v2.712h.598v-2.712Zm1.196 0h-.597v2.712h.597v-2.712Zm1.195 0h-.597v2.712h.597v-2.712Zm1.196 0h-.598v1.904h.598v-1.904Zm1.19 0h-.597v2.712h.598v-2.712Zm1.196 0h-.598v2.712h.598v-2.712Zm1.195 0h-.598v2.712h.598v-2.712Zm1.195 0h-.597v2.712h.597v-2.712Zm1.191 0H44.7v2.712h.597v-2.712Zm1.196 0h-.598v2.712h.597v-2.712Zm1.195 0h-.598v2.712h.598v-2.712Zm1.195 0h-.598v2.712h.598v-2.712Z" fill="url(#d)"/><path d="M48.657 53.298H40.11v-3.862h8.544c.453 0 .824.371.824.824v2.214a.82.82 0 0 1-.82.824Z" fill="#050304"/><path d="M48.657 53.298H40.11v-3.862h8.544c.453 0 .824.371.824.824v2.214a.82.82 0 0 1-.82.824Z" fill="url(#e)"/><path d="M48.657 53.298H40.11v-3.862h8.544c.453 0 .824.371.824.824v2.214a.82.82 0 0 1-.82.824Z" fill="#050304"/><path d="M48.657 53.298H40.11v-3.862h8.544c.453 0 .824.371.824.824v2.214a.82.82 0 0 1-.82.824Z" fill="url(#f)"/><path d="M54.117 57.162H20.54a.827.827 0 0 1-.824-.824v-2.213c0-.454.37-.825.824-.825h33.582c.453 0 .824.371.824.825v2.213a.83.83 0 0 1-.829.824Z" fill="#42AB44"/><path d="M54.117 57.162H40.43l-20.714-2.176v-.861c0-.454.37-.825.824-.825h33.582c.453 0 .824.371.824.825v2.213a.83.83 0 0 1-.829.824Z" fill="#050304"/><path d="M54.117 57.162H40.43l-20.714-2.176v-.861c0-.454.37-.825.824-.825h33.582c.453 0 .824.371.824.825v2.213a.83.83 0 0 1-.829.824Z" fill="url(#g)"/><path d="M51.198 61.021H17.616a.827.827 0 0 1-.824-.824v-2.214c0-.453.37-.824.824-.824h33.582c.453 0 .824.371.824.825v2.213a.824.824 0 0 1-.824.824Z" fill="#050304"/><path d="M51.198 61.021H17.616a.827.827 0 0 1-.824-.824v-2.214c0-.453.37-.824.824-.824h33.582c.453 0 .824.371.824.825v2.213a.824.824 0 0 1-.824.824Z" fill="url(#h)"/><path d="M51.198 61.021H17.616a.827.827 0 0 1-.824-.824v-2.214c0-.453.37-.824.824-.824h33.582c.453 0 .824.371.824.825v2.213a.824.824 0 0 1-.824.824Z" fill="#050304"/><path d="M51.198 61.021H17.616a.827.827 0 0 1-.824-.824v-2.214c0-.453.37-.824.824-.824h33.582c.453 0 .824.371.824.825v2.213a.824.824 0 0 1-.824.824Z" fill="url(#i)"/><path d="M51.198 61.021h-8.544v-3.862h8.544c.453 0 .824.371.824.825v2.213c0 .457-.37.824-.824.824Z" fill="#050304"/><path d="M51.198 61.021h-8.544v-3.862h8.544c.453 0 .824.371.824.825v2.213c0 .457-.37.824-.824.824Z" fill="url(#j)"/><path d="M51.198 61.021h-8.544v-3.862h8.544c.453 0 .824.371.824.825v2.213c0 .457-.37.824-.824.824Z" fill="#050304"/><path d="M51.198 61.021h-8.544v-3.862h8.544c.453 0 .824.371.824.825v2.213c0 .457-.37.824-.824.824Z" fill="url(#k)"/><path d="M24.704 57.763h-.598v2.658h.598v-2.658Zm1.195.334h-.597v1.99h.597v-1.99Zm1.191.614h-.597v.762h.597v-.762Zm1.196.56h-.598v1.15h.598v-1.15Zm1.195-1.137h-.598v.956h.598v-.956Zm2.386.383h-.598v1.15h.598v-1.15Z" fill="#5F1A58"/><path d="M24.704 57.763h-.598v2.658h.598v-2.658Zm1.195.334h-.597v1.99h.597v-1.99Zm1.191.614h-.597v.762h.597v-.762Zm1.196.56h-.598v1.15h.598v-1.15Zm1.195-1.137h-.598v.956h.598v-.956Zm2.386.383h-.598v1.15h.598v-1.15Z" fill="#050304"/><path d="M24.704 57.763h-.598v2.658h.598v-2.658Zm1.195.334h-.597v1.99h.597v-1.99Zm1.191.614h-.597v.762h.597v-.762Zm1.196.56h-.598v1.15h.598v-1.15Zm1.195-1.137h-.598v.956h.598v-.956Zm2.386.383h-.598v1.15h.598v-1.15Z" fill="url(#l)"/><path d="M32.922 49.437c9.144 0 16.556-7.412 16.556-16.556 0-9.143-7.413-16.556-16.556-16.556s-16.556 7.413-16.556 16.556c0 9.144 7.413 16.556 16.556 16.556Z" fill="#050304"/><path d="M32.922 49.437c9.144 0 16.556-7.412 16.556-16.556 0-9.143-7.413-16.556-16.556-16.556s-16.556 7.413-16.556 16.556c0 9.144 7.413 16.556 16.556 16.556Z" fill="url(#m)"/><mask id="n" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="14" y="16" width="34" height="34"><path d="M30.804 49.436c9.143 0 16.556-7.412 16.556-16.556 0-9.143-7.413-16.555-16.556-16.555-9.144 0-16.556 7.412-16.556 16.555 0 9.144 7.412 16.556 16.556 16.556Z" fill="#91BD65"/></mask><g mask="url(#n)"><path d="M30.804 49.436c9.143 0 16.556-7.412 16.556-16.556 0-9.143-7.413-16.555-16.556-16.555-9.144 0-16.556 7.412-16.556 16.555 0 9.144 7.412 16.556 16.556 16.556Z" fill="url(#o)"/><path d="m24.416 27.667-7.386-8.172-2.827 1.636 6.256 6.714 3.957-.178Z" fill="#FFCA42"/><path d="m24.416 27.667-7.386-8.172-2.827 1.636 6.256 6.714 3.957-.178Z" fill="url(#p)"/><mask id="q" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="17" y="19" width="28" height="28"><path d="M30.803 46.495c7.519 0 13.614-6.095 13.614-13.613S38.322 19.27 30.803 19.27c-7.518 0-13.613 6.095-13.613 13.613s6.095 13.613 13.613 13.613Z" fill="#91BD65"/></mask><g mask="url(#q)"><path d="M30.803 46.495c7.519 0 13.614-6.095 13.614-13.613S38.322 19.27 30.803 19.27c-7.518 0-13.613 6.095-13.613 13.613s6.095 13.613 13.613 13.613Z" fill="#FA552D"/><path d="M30.803 46.495c7.519 0 13.614-6.095 13.614-13.613S38.322 19.27 30.803 19.27c-7.518 0-13.613 6.095-13.613 13.613s6.095 13.613 13.613 13.613Z" fill="url(#r)"/><path d="M30.803 46.495c7.519 0 13.614-6.095 13.614-13.613S38.322 19.27 30.803 19.27c-7.518 0-13.613 6.095-13.613 13.613s6.095 13.613 13.613 13.613Z" fill="url(#s)"/><path d="M15.888 49.14h29.369l-2.3-11.803a3.147 3.147 0 0 0-3.087-2.543H21.274a3.147 3.147 0 0 0-3.087 2.543l-2.3 11.804Z" fill="#FFCA42"/><path d="M15.888 49.14h29.369l-2.3-11.803a3.147 3.147 0 0 0-3.087-2.543H21.274a3.147 3.147 0 0 0-3.087 2.543l-2.3 11.804Z" fill="url(#t)"/></g><path d="M27.029 27.451c2.39-1.986.944-5.06-2.477-2.72-3.825 2.622-.532 5.222 2.477 2.72Z" fill="#FFCA42"/><path d="M27.029 27.451c2.39-1.986.944-5.06-2.477-2.72-3.825 2.622-.532 5.222 2.477 2.72Z" fill="url(#u)"/><path d="M31.34 20.876c-7.517 0-13.613 6.096-13.613 13.613 0 1.204.157 2.37.45 3.483a13.57 13.57 0 0 1-.986-5.09c0-7.517 6.096-13.613 13.614-13.613 6.313 0 11.622 4.303 13.163 10.135-2.02-5-6.911-8.528-12.628-8.528Z" fill="#FA552D"/><path d="M31.34 20.876c-7.517 0-13.613 6.096-13.613 13.613 0 1.204.157 2.37.45 3.483a13.57 13.57 0 0 1-.986-5.09c0-7.517 6.096-13.613 13.614-13.613 6.313 0 11.622 4.303 13.163 10.135-2.02-5-6.911-8.528-12.628-8.528Z" fill="url(#v)"/><path d="M31.34 20.876c-7.517 0-13.613 6.096-13.613 13.613 0 1.204.157 2.37.45 3.483a13.57 13.57 0 0 1-.986-5.09c0-7.517 6.096-13.613 13.614-13.613 6.313 0 11.622 4.303 13.163 10.135-2.02-5-6.911-8.528-12.628-8.528Z" fill="#050304"/><path d="M31.34 20.876c-7.517 0-13.613 6.096-13.613 13.613 0 1.204.157 2.37.45 3.483a13.57 13.57 0 0 1-.986-5.09c0-7.517 6.096-13.613 13.614-13.613 6.313 0 11.622 4.303 13.163 10.135-2.02-5-6.911-8.528-12.628-8.528Z" fill="url(#w)"/></g><path d="M21.614 6.16a.425.425 0 0 0-.833 0l-.368 1.75a1.578 1.578 0 0 1-1.22 1.22l-1.75.368a.425.425 0 0 0 0 .832l1.75.368c.613.13 1.091.607 1.22 1.22l.368 1.75a.425.425 0 0 0 .833 0l.368-1.75a1.578 1.578 0 0 1 1.219-1.22l1.75-.368a.425.425 0 0 0 0-.832l-1.75-.368a1.578 1.578 0 0 1-1.22-1.22l-.367-1.75ZM8.279 39.569a.64.64 0 0 0-1.252 0l-.553 2.632a2.372 2.372 0 0 1-1.833 1.833l-2.632.553a.64.64 0 0 0 0 1.252l2.632.553c.92.194 1.64.913 1.833 1.833l.553 2.633a.64.64 0 0 0 1.252 0l.553-2.633c.194-.92.913-1.64 1.833-1.833l2.632-.553a.64.64 0 0 0 0-1.252l-2.632-.553A2.372 2.372 0 0 1 8.832 42.2l-.553-2.632Z" fill="#FFCA42"/></g><defs><linearGradient id="b" x1="12.663" y1="61.069" x2="63" y2="61.069" gradientUnits="userSpaceOnUse"><stop stop-color="#FA552D"/><stop offset=".104" stop-color="#FA552D" stop-opacity="0"/><stop offset=".81" stop-color="#5F1A58" stop-opacity="0"/><stop offset="1" stop-color="#5F1A58"/></linearGradient><linearGradient id="c" x1="63" y1="62.932" x2="12.717" y2="62.932" gradientUnits="userSpaceOnUse"><stop stop-color="#04D600"/><stop offset=".297" stop-color="#00D63C" stop-opacity="0"/><stop offset=".833" stop-color="#FA552D" stop-opacity="0"/><stop offset="1" stop-color="#FA552D"/></linearGradient><linearGradient id="d" x1="62.165" y1="54.392" x2="15.354" y2="51.029" gradientUnits="userSpaceOnUse"><stop stop-color="#04D600"/><stop offset=".7" stop-color="#00D63C" stop-opacity="0"/></linearGradient><linearGradient id="e" x1="46.244" y1="51.847" x2="40.039" y2="51.847" gradientUnits="userSpaceOnUse"><stop stop-color="#5F1A58"/><stop offset="1" stop-color="#5F1A58" stop-opacity="0"/></linearGradient><linearGradient id="f" x1="54.82" y1="55.679" x2="35.901" y2="55.295" gradientUnits="userSpaceOnUse"><stop stop-color="#04D600"/><stop offset=".7" stop-color="#00D63C" stop-opacity="0"/></linearGradient><linearGradient id="g" x1="75.037" y1="59.543" x2="4.274" y2="54.143" gradientUnits="userSpaceOnUse"><stop stop-color="#04D600"/><stop offset=".7" stop-color="#00D63C" stop-opacity="0"/></linearGradient><linearGradient id="h" x1="16.792" y1="59.265" x2="21.944" y2="59.265" gradientUnits="userSpaceOnUse"><stop stop-color="#FA552D"/><stop offset="1" stop-color="#FA552D" stop-opacity="0"/></linearGradient><linearGradient id="i" x1="72.113" y1="63.402" x2="1.35" y2="58.002" gradientUnits="userSpaceOnUse"><stop stop-color="#04D600"/><stop offset=".7" stop-color="#00D63C" stop-opacity="0"/></linearGradient><linearGradient id="j" x1="42.757" y1="59.059" x2="48.94" y2="59.059" gradientUnits="userSpaceOnUse"><stop stop-color="#5F1A58"/><stop offset="1" stop-color="#5F1A58" stop-opacity="0"/></linearGradient><linearGradient id="k" x1="57.365" y1="63.402" x2="38.447" y2="63.018" gradientUnits="userSpaceOnUse"><stop stop-color="#04D600"/><stop offset=".7" stop-color="#00D63C" stop-opacity="0"/></linearGradient><linearGradient id="l" x1="36.293" y1="62.06" x2="20.623" y2="61.677" gradientUnits="userSpaceOnUse"><stop stop-color="#04D600"/><stop offset=".7" stop-color="#00D63C" stop-opacity="0"/></linearGradient><linearGradient id="m" x1="55.687" y1="41.093" x2="29.024" y2="16.325" gradientUnits="userSpaceOnUse"><stop stop-color="#04D600"/><stop offset=".297" stop-color="#00D63C" stop-opacity="0"/><stop offset=".833" stop-color="#FA552D" stop-opacity="0"/><stop offset="1" stop-color="#FA552D"/></linearGradient><linearGradient id="o" x1="23.849" y1="45.931" x2="26.662" y2="14.768" gradientUnits="userSpaceOnUse"><stop stop-color="#7DC15D"/><stop offset="1" stop-color="#FEE54F"/></linearGradient><linearGradient id="p" x1="18.119" y1="22.174" x2="19.561" y2="25.265" gradientUnits="userSpaceOnUse"><stop stop-color="#FEFFCF"/><stop offset="1" stop-color="#FEFFCF" stop-opacity="0"/></linearGradient><linearGradient id="r" x1="28.215" y1="46.697" x2="28.215" y2="21.144" gradientUnits="userSpaceOnUse"><stop stop-color="#FFCA42"/><stop offset="1" stop-color="#FFCA42" stop-opacity="0"/></linearGradient><linearGradient id="s" x1="24.794" y1="25.705" x2="30.803" y2="46.495" gradientUnits="userSpaceOnUse"><stop stop-color="#7DC15D"/><stop offset="1" stop-color="#FEE54F"/></linearGradient><linearGradient id="t" x1="30.572" y1="34.794" x2="30.572" y2="40.927" gradientUnits="userSpaceOnUse"><stop stop-color="#FEFFCF"/><stop offset="1" stop-color="#FEFFCF" stop-opacity="0"/></linearGradient><linearGradient id="u" x1="24.301" y1="28.354" x2="24.919" y2="25.469" gradientUnits="userSpaceOnUse"><stop stop-color="#FEFFCF"/><stop offset="1" stop-color="#FEFFCF" stop-opacity="0"/></linearGradient><linearGradient id="v" x1="24.301" y1="20.32" x2="26.98" y2="30.005" gradientUnits="userSpaceOnUse"><stop stop-color="#5F1A58"/><stop offset="1" stop-color="#5F1A58" stop-opacity="0"/></linearGradient><linearGradient id="w" x1="59.239" y1="49.504" x2="5.149" y2="48.856" gradientUnits="userSpaceOnUse"><stop stop-color="#04D600"/><stop offset=".7" stop-color="#00D63C" stop-opacity="0"/></linearGradient><clipPath id="a"><path fill="#fff" d="M0 0h63v63H0z"/></clipPath></defs></svg>

package/src/icons/PlayMarketIcon.svg

@@ -1,6 +1 @@
-<svg width="24" height="24" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <path
-    d="M1 22.427V2.576C1 1.883 1.447 1.284 2.094 1L14.85 12.498 2.089 24a1.89 1.89 0 0 1-.795-.646A1.625 1.625 0 0 1 1 22.427Zm17.899-6.282-13.95 7.259 11.002-9.915 2.948 2.656Zm4.335-5.035c.237.162.428.37.561.61.133.239.203.502.205.77.002.267-.064.53-.193.771s-.317.452-.551.617l-2.964 1.542-3.241-2.922 3.24-2.92 2.944 1.532ZM4.959 1.598l13.938 7.253-2.945 2.654L4.958 1.598Z"
-    fill="#42AB44"
-  />
-</svg>
+<svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 23 23"><path d="M0 21.427V1.576C0 .883.447.284 1.094 0L13.85 11.498 1.089 23a1.89 1.89 0 0 1-.795-.646A1.625 1.625 0 0 1 0 21.427Zm17.899-6.282-13.95 7.259 11.002-9.915 2.948 2.656Zm4.335-5.035c.237.162.428.37.561.61.133.239.203.502.205.77.002.267-.064.53-.193.771s-.317.452-.551.617l-2.964 1.542-3.241-2.922 3.24-2.92 2.944 1.532ZM3.959.598l13.938 7.253-2.945 2.654L3.958.598Z" fill="#42AB44"/></svg>

package/src/ui-kit/ArrowButton.tsx

@@ -1,33 +1,32 @@
 import { JSX } from '@redneckz/uni-jsx';
+import { Button } from './Button';
+import { ButtonProps } from './ButtonProps';
+import { SVG } from './SVG';
 
-export interface ArrowButtonProps {
-  onClick?: () => void;
-  ariaLabel?: string;
-  className?: string;
-}
+const ARROW_PATHS = [
+  {
+    d: 'm9 12 4-4-4-4',
+    stroke: 'currentColor',
+    strokeWidth: '2',
+    strokeLinecap: 'round',
+    fill: 'none',
+  },
+  {
+    d: 'M2 9a1 1 0 0 1 0-2v2Zm6-2a1 1 0 0 1 0 2V7ZM2 7h6v2H2V7Z',
+  },
+];
 
-export const ArrowButton = JSX<ArrowButtonProps>(({ className, onClick, ariaLabel }) => {
-  return (
-    <button
-      className={`${className} border-none no-underline w-12 h-12 rounded-3xl bg-white flex text-black hover:text-primary-main`}
-      style={{ boxShadow: '0px 4px 25px rgba(0, 0, 0, 0.07)' }}
-      onClick={onClick}
-      aria-label={ariaLabel}
-    >
-      <svg
-        className="m-auto"
-        width="16"
-        height="16"
-        viewBox="0 0 16 16"
-        fill="none"
-        xmlns="http://www.w3.org/2000/svg"
-      >
-        <path d="M7 12L3 8L7 4" stroke="currentColor" strokeWidth="2" strokeLinecap="round" />
-        <path
-          d="M14 9C14.5523 9 15 8.55228 15 8C15 7.44772 14.5523 7 14 7L14 9ZM8 7C7.44772 7 7 7.44772 7 8C7 8.55229 7.44772 9 8 9L8 7ZM14 7L8 7L8 9L14 9L14 7Z"
-          fill="currentColor"
-        />
-      </svg>
-    </button>
-  );
-});
+export const ArrowButton = JSX<ButtonProps>(({ className, disabled, ...rest }) => (
+  <Button
+    rounded
+    className={`shadow-[0_4px_25px_rgba(0,0,0,0.07)] w-12 h-12 min-h-12 max-h-12 flex items-center justify-center ${
+      disabled
+        ? 'bg-secondary-light text-secondary-text'
+        : 'bg-white text-primary-text hover:text-primary-main'
+    } ${className || ''}`}
+    disabled={disabled}
+    {...rest}
+  >
+    <SVG paths={ARROW_PATHS} viewBox="0 0 16 16" fill="none" width="16" height="16" />
+  </Button>
+));

package/src/ui-kit/Button.fixture.tsx

@@ -1,7 +1,7 @@
 import '../setup-fixture';
 
 import { Button } from './Button';
-import { IconButton } from './IconButton';
+import { Icon } from './Icon';
 
 export default {
   all: (
@@ -64,21 +64,49 @@ export default {
       <div>
         <p>With Icon</p>
         <div className="flex gap-6" data-theme="pc">
-          <IconButton
+          <Button
             href="https://www.rshb.ru/"
             target="_blank"
             aboveText="Доступно в"
+            appendLeft={
+              /** Div need for perfect pixel */
+              <div>
+                <Icon name="PlayMarketIcon" width="24" height="24" />
+              </div>
+            }
             text="Google Play"
             version="secondary"
-            icon="PlayMarketIcon"
           />
-          <IconButton
+          <Button
             href="https://www.rshb.ru/"
             target="_blank"
             aboveText="Загрузите в"
+            appendLeft={
+              <div>
+                <Icon name="AppleIcon" width="24" height="24" />
+              </div>
+            }
             text="App Store"
             version="secondary"
-            icon="AppleIcon"
+          />
+        </div>
+      </div>
+      <div>
+        <p>Rounded with only Icon</p>
+        <div className="flex gap-6" data-theme="pc">
+          <Button
+            rounded
+            href="https://www.rshb.ru/"
+            target="_blank"
+            version="secondary"
+            appendLeft={<Icon name="PlayMarketIcon" width="20" height="21" />}
+          />
+          <Button
+            rounded
+            href="https://www.rshb.ru/"
+            target="_blank"
+            version="secondary"
+            appendLeft={<Icon name="AppleIcon" width="18" height="20" />}
           />
         </div>
       </div>

package/src/ui-kit/Button.tsx

@@ -1,6 +1,6 @@
 import { JSX } from '@redneckz/uni-jsx';
 import type { ButtonVersion } from '../model/ButtonVersion';
-import type { ButtonProps } from './ButtonProps';
+import type { ButtonInnerProps, ButtonProps } from './ButtonProps';
 
 const buttonStyleMap: Record<ButtonVersion, string> = {
   primary: 'text-white bg-primary-main hover:bg-primary-hover active:bg-primary-active',
@@ -13,20 +13,28 @@ const buttonDisabledStyleMap: Record<ButtonVersion, string> = {
   secondary: 'bg-secondary-light text-secondary-text',
 };
 
-const styleButton = 'inline-block rounded-md px-8 py-2 text-center font-sans';
+const styleButton = 'inline-block text-center font-sans select-none';
 
 export const Button = JSX<ButtonProps>(
   ({
     className,
     text,
+    aboveText,
+    appendLeft,
     href,
     target,
     onClick,
     children,
     disabled,
-    version = 'primary',
+    rounded,
+    version = 'none',
     ariaLabel,
+    ...rest
   }) => {
+    const buttonInner = children ?? (
+      <ButtonInner text={text} aboveText={aboveText} appendLeft={appendLeft} rounded={rounded} />
+    );
+
     if (disabled) {
       return (
         <div
@@ -34,33 +42,49 @@ export const Button = JSX<ButtonProps>(
           aria-disabled="true"
           aria-label={ariaLabel}
           tabIndex="-1"
-          className={`${styleButton} select-none ${buttonDisabledStyleMap[version]} ${
-            className || ''
-          }`}
+          className={`${styleButton} ${buttonDisabledStyleMap[version] || ''} ${
+            rounded ? 'rounded-full' : 'rounded-md'
+          } ${className || ''}`}
         >
-          {children ? (
-            <div>{children}</div>
-          ) : (
-            <div className="text-sm font-medium py-1.5">{text}</div>
-          )}
+          {buttonInner}
         </div>
       );
     }
 
     return (
       <a
-        className={`${styleButton} no-underline ${buttonStyleMap[version]} ${className || ''}`}
+        className={`${styleButton} cursor-pointer no-underline ${buttonStyleMap[version] || ''} ${
+          rounded ? 'rounded-full' : 'rounded-md'
+        } ${className || ''}`}
         href={href}
         target={target}
         onClick={onClick}
         aria-label={ariaLabel}
+        role={!href ? 'button' : 'link'}
+        {...rest}
       >
-        {children ? (
-          <div>{children}</div>
-        ) : (
-          <div className="text-sm font-medium py-1.5">{text}</div>
-        )}
+        {buttonInner}
       </a>
     );
   },
 );
+
+export const ButtonInner = JSX<ButtonInnerProps>(({ text, aboveText, appendLeft, rounded }) => {
+  const withoutText = !text && !aboveText && Boolean(appendLeft);
+
+  const buttonInnerClasses = `flex items-center justify-center ${
+    withoutText ? 'h-12 w-12 min-h-12 min-w-12' : `px-8 gap-2 ${aboveText ? 'py-2' : 'py-[13px]'}`
+  } ${rounded ? 'rounded-full' : ''}`;
+
+  return (
+    <div className={buttonInnerClasses}>
+      {appendLeft ? appendLeft : null}
+      {!withoutText ? (
+        <div>
+          <div className="text-xxs text-left">{aboveText}</div>
+          <div className="text-sm font-medium text-left">{text}</div>
+        </div>
+      ) : null}
+    </div>
+  );
+});

package/src/ui-kit/ButtonProps.ts

@@ -1,10 +1,24 @@
 import type { ButtonVersion } from '../model/ButtonVersion';
 import type { LinkContent } from '../model/LinkContent';
+import { IconName } from './IconProps';
 
-export interface ButtonProps extends LinkContent {
+export interface ButtonInnerProps {
+  text?: string;
+  aboveText?: string;
+  appendLeft?: any;
+  rounded?: boolean;
+}
+
+export interface ButtonProps extends LinkContent, ButtonInnerProps {
   className?: string;
-  onClick?: (ev: MouseEvent) => any;
   version?: ButtonVersion;
-  ariaLabel?: string;
   disabled?: boolean;
+  rel?: string;
+  ariaLabel?: string;
+  /** @hidden */
+  onClick?: (ev: MouseEvent) => any;
+}
+
+export interface ButtonWithIconProps extends ButtonProps {
+  icon?: IconName;
 }

package/src/ui-kit/Icon.fixture.tsx

@@ -0,0 +1,22 @@
+import '../setup-fixture';
+import { Icon } from './Icon';
+
+import { IconMap } from './IconProps';
+import type { IconName } from './IconProps';
+
+export default {
+  all: (
+    <div className="w-[1280px]">
+      <div className="grid grid-cols-6 gap-8">
+        {(Object.keys(IconMap) as Array<IconName>)
+          .filter((v) => isNaN(Number(v)))
+          .map((icon, i) => (
+            <div key={String(i)} className="flex flex-col items-center gap-3">
+              <div>{icon}</div>
+              <Icon name={icon} width="64" />
+            </div>
+          ))}
+      </div>
+    </div>
+  ),
+};

package/src/ui-kit/IconProps.ts

@@ -1,24 +1,27 @@
-export type IconName =
-  | 'ActualBalanceIcon'
-  | 'AppleIcon'
-  | 'CalendarIcon'
-  | 'ClockIcon'
-  | 'ComfortableCompIcon'
-  | 'DollarIcon'
-  | 'EmptyWalletIcon'
-  | 'EuroIcon'
-  | 'GridIcon'
-  | 'LoupeIcon'
-  | 'NewDocIcon'
-  | 'OkIcon'
-  | 'PassSendIcon'
-  | 'PercentageSquareIcon'
-  | 'PlayMarketIcon'
-  | 'ProfileIcon'
-  | 'SignDocsIcon'
-  | 'TelegramIcon'
-  | 'VKIcon'
-  | 'ArrowLeftIcon';
+export enum IconMap {
+  'ActualBalanceIcon',
+  'AppleIcon',
+  'CalendarIcon',
+  'ClockIcon',
+  'ComfortableCompIcon',
+  'DollarIcon',
+  'EmptyWalletIcon',
+  'EuroIcon',
+  'GridIcon',
+  'LoupeIcon',
+  'NewDocIcon',
+  'OkIcon',
+  'PassSendIcon',
+  'PercentageSquareIcon',
+  'PlayMarketIcon',
+  'ProfileIcon',
+  'SignDocsIcon',
+  'TelegramIcon',
+  'VKIcon',
+  'GlassIcon',
+}
+
+export type IconName = keyof typeof IconMap;
 
 export interface IconProps {
   className?: string;

package/src/{Img.tsx → ui-kit/Img.tsx}

@@ -1,5 +1,5 @@
 import { JSX } from '@redneckz/uni-jsx';
-import type { Picture, ImgSource } from './model/Picture';
+import type { ImgSource, Picture } from '../model/Picture';
 
 export interface TextWithImageProps {
   className?: string;

package/src/ui-kit/SVG.tsx

@@ -17,12 +17,21 @@ export interface SVGProps extends SVGPathOptions {
   className?: string;
   viewBox?: string;
   paths: SVGPath[];
+  width?: string;
+  height?: string;
 }
 
 export const SVG = JSX<SVGProps>(
-  ({ className, viewBox, fill = 'none', paths, ...commonOptions }) => {
+  ({ className, viewBox, fill = 'none', width, height, paths, ...commonOptions }) => {
     return (
-      <svg xmlns="http://www.w3.org/2000/svg" className={className} viewBox={viewBox} fill={fill}>
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        className={className}
+        viewBox={viewBox}
+        fill={fill}
+        width={width}
+        height={height}
+      >
         {paths.map(({ d, fill, ...options }, i) => (
           <path key={i} d={d} fill={fill || 'currentColor'} {...commonOptions} {...options} />
         ))}

package/dist/Img.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Img.js","sourceRoot":"","sources":["../src/Img.tsx"],"names":[],"mappings":";;;AAAA,+CAAwC;AAQ3B,QAAA,GAAG,GAAG,IAAA,aAAG,EAAqB,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CACnE,qCAAS,SAAS,EAAE,GAAG,SAAS,IAAI,EAAE,EAAE,aACrC,KAAK,CAAC,OAAO,EAAE,MAAM;YACpB,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,EAAE,GAAG,EAAE,MAAM,EAAE,EAAE,KAAK,EAAE,EAAE,CAAC,CAC5C,mCAAgC,MAAM,EAAE,GAAG,EAAE,IAAI,EAAE,gBAAgB,CAAC,MAAM,CAAC,IAA9D,GAAG,KAAK,IAAI,GAAG,EAAE,CAAiD,CAChF,CAAC;YACJ,CAAC,CAAC,IAAI,EACR,gCAAK,GAAG,EAAE,KAAK,CAAC,GAAG,EAAE,GAAG,EAAE,KAAK,CAAC,GAAG,IAAI,KAAK,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,KAAM,KAAK,EAAE,IAAI,GAAI,IACnF,CACX,CAAC,CAAC;AAEH,SAAgB,gBAAgB,CAAC,MAA2B;IAC1D,OAAO,MAAM,CAAC,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC;AACxD,CAAC;AAFD,4CAEC"}

package/dist/ui-kit/IconButton.d.ts

@@ -1,2 +0,0 @@
-import type { IconButtonProps } from './IconButtonProps';
-export declare const IconButton: (props: import("@redneckz/uni-jsx").PropsWithChildren<IconButtonProps, any>, context?: any) => any;

package/dist/ui-kit/IconButton.js

@@ -1,10 +0,0 @@
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.IconButton = void 0;
-const jsx_runtime_1 = require("@redneckz/uni-jsx/jsx-runtime");
-const uni_jsx_1 = require("@redneckz/uni-jsx");
-const Button_1 = require("./Button");
-const Icon_1 = require("./Icon");
-exports.IconButton = (0, uni_jsx_1.JSX)((props) => {
-    return ((0, jsx_runtime_1.jsx)(Button_1.Button, { ...props, children: props.icon ? ((0, jsx_runtime_1.jsxs)("div", { className: "flex items-center", children: [(0, jsx_runtime_1.jsx)("div", { className: "mr-2", children: (0, jsx_runtime_1.jsx)(Icon_1.Icon, { name: props.icon, width: "24", height: "24" }) }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("div", { className: "text-xxs text-left", children: props.aboveText }), (0, jsx_runtime_1.jsx)("div", { className: "text-sm font-medium text-left", children: props.text })] })] })) : null }));
-});
-//# sourceMappingURL=IconButton.js.map

package/dist/ui-kit/IconButton.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"IconButton.js","sourceRoot":"","sources":["../../src/ui-kit/IconButton.tsx"],"names":[],"mappings":";;;AAAA,+CAAwC;AACxC,qCAAkC;AAClC,iCAA8B;AAGjB,QAAA,UAAU,GAAG,IAAA,aAAG,EAAkB,CAAC,KAAK,EAAE,EAAE;IACvD,OAAO,CACL,uBAAC,eAAM,OAAK,KAAK,YACd,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,CACZ,iCAAK,SAAS,EAAC,mBAAmB,aAChC,gCAAK,SAAS,EAAC,MAAM,YACnB,uBAAC,WAAI,IAAC,IAAI,EAAE,KAAK,CAAC,IAAI,EAAE,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,GAAG,GAC7C,EACN,4CACE,gCAAK,SAAS,EAAC,oBAAoB,YAAE,KAAK,CAAC,SAAS,GAAO,EAC3D,gCAAK,SAAS,EAAC,+BAA+B,YAAE,KAAK,CAAC,IAAI,GAAO,IAC7D,IACF,CACP,CAAC,CAAC,CAAC,IAAI,GACD,CACV,CAAC;AACJ,CAAC,CAAC,CAAC"}

package/dist/ui-kit/IconButtonProps.d.ts

@@ -1,6 +0,0 @@
-import type { ButtonProps } from './ButtonProps';
-import type { IconName } from './IconProps';
-export interface IconButtonProps extends ButtonProps {
-    icon?: IconName;
-    aboveText?: string;
-}

package/dist/ui-kit/IconButtonProps.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"IconButtonProps.js","sourceRoot":"","sources":["../../src/ui-kit/IconButtonProps.ts"],"names":[],"mappings":""}

package/lib/Img.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Img.js","sourceRoot":"","sources":["../src/Img.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAQxC,MAAM,CAAC,MAAM,GAAG,GAAG,GAAG,CAAqB,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CACnE,mBAAS,SAAS,EAAE,GAAG,SAAS,IAAI,EAAE,EAAE,aACrC,KAAK,CAAC,OAAO,EAAE,MAAM;YACpB,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,EAAE,GAAG,EAAE,MAAM,EAAE,EAAE,KAAK,EAAE,EAAE,CAAC,CAC5C,iBAAgC,MAAM,EAAE,GAAG,EAAE,IAAI,EAAE,gBAAgB,CAAC,MAAM,CAAC,IAA9D,GAAG,KAAK,IAAI,GAAG,EAAE,CAAiD,CAChF,CAAC;YACJ,CAAC,CAAC,IAAI,EACR,cAAK,GAAG,EAAE,KAAK,CAAC,GAAG,EAAE,GAAG,EAAE,KAAK,CAAC,GAAG,IAAI,KAAK,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,KAAM,KAAK,EAAE,IAAI,GAAI,IACnF,CACX,CAAC,CAAC;AAEH,MAAM,UAAU,gBAAgB,CAAC,MAA2B;IAC1D,OAAO,MAAM,CAAC,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC;AACxD,CAAC"}

package/lib/ui-kit/IconButton.d.ts

@@ -1,2 +0,0 @@
-import type { IconButtonProps } from './IconButtonProps';
-export declare const IconButton: (props: import("@redneckz/uni-jsx").PropsWithChildren<IconButtonProps, any>, context?: any) => any;

package/lib/ui-kit/IconButton.js

@@ -1,8 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "@redneckz/uni-jsx/jsx-runtime";
-import { JSX } from '@redneckz/uni-jsx';
-import { Button } from './Button.js';
-import { Icon } from './Icon.js';
-export const IconButton = JSX((props) => {
-    return (_jsx(Button, { ...props, children: props.icon ? (_jsxs("div", { className: "flex items-center", children: [_jsx("div", { className: "mr-2", children: _jsx(Icon, { name: props.icon, width: "24", height: "24" }) }), _jsxs("div", { children: [_jsx("div", { className: "text-xxs text-left", children: props.aboveText }), _jsx("div", { className: "text-sm font-medium text-left", children: props.text })] })] })) : null }));
-});
-//# sourceMappingURL=IconButton.js.map

package/lib/ui-kit/IconButton.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"IconButton.js","sourceRoot":"","sources":["../../src/ui-kit/IconButton.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AACxC,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAG9B,MAAM,CAAC,MAAM,UAAU,GAAG,GAAG,CAAkB,CAAC,KAAK,EAAE,EAAE;IACvD,OAAO,CACL,KAAC,MAAM,OAAK,KAAK,YACd,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,CACZ,eAAK,SAAS,EAAC,mBAAmB,aAChC,cAAK,SAAS,EAAC,MAAM,YACnB,KAAC,IAAI,IAAC,IAAI,EAAE,KAAK,CAAC,IAAI,EAAE,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,GAAG,GAC7C,EACN,0BACE,cAAK,SAAS,EAAC,oBAAoB,YAAE,KAAK,CAAC,SAAS,GAAO,EAC3D,cAAK,SAAS,EAAC,+BAA+B,YAAE,KAAK,CAAC,IAAI,GAAO,IAC7D,IACF,CACP,CAAC,CAAC,CAAC,IAAI,GACD,CACV,CAAC;AACJ,CAAC,CAAC,CAAC"}

package/lib/ui-kit/IconButtonProps.d.ts

@@ -1,6 +0,0 @@
-import type { ButtonProps } from './ButtonProps';
-import type { IconName } from './IconProps';
-export interface IconButtonProps extends ButtonProps {
-    icon?: IconName;
-    aboveText?: string;
-}

package/lib/ui-kit/IconButtonProps.js

@@ -1,2 +0,0 @@
-export {};
-//# sourceMappingURL=IconButtonProps.js.map

package/lib/ui-kit/IconButtonProps.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"IconButtonProps.js","sourceRoot":"","sources":["../../src/ui-kit/IconButtonProps.ts"],"names":[],"mappings":""}

package/src/ui-kit/IconButton.tsx

@@ -1,22 +0,0 @@
-import { JSX } from '@redneckz/uni-jsx';
-import { Button } from './Button';
-import { Icon } from './Icon';
-import type { IconButtonProps } from './IconButtonProps';
-
-export const IconButton = JSX<IconButtonProps>((props) => {
-  return (
-    <Button {...props}>
-      {props.icon ? (
-        <div className="flex items-center">
-          <div className="mr-2">
-            <Icon name={props.icon} width="24" height="24" />
-          </div>
-          <div>
-            <div className="text-xxs text-left">{props.aboveText}</div>
-            <div className="text-sm font-medium text-left">{props.text}</div>
-          </div>
-        </div>
-      ) : null}
-    </Button>
-  );
-});

package/src/ui-kit/IconButtonProps.ts

@@ -1,7 +0,0 @@
-import type { ButtonProps } from './ButtonProps';
-import type { IconName } from './IconProps';
-
-export interface IconButtonProps extends ButtonProps {
-  icon?: IconName;
-  aboveText?: string;
-}