From fdc2ecda32d83a20cec6f0ea4a49c98e10f6f201 Mon Sep 17 00:00:00 2001 From: nicosammito Date: Fri, 3 May 2024 16:26:54 +0200 Subject: [PATCH 1/3] implementation of simple flex container --- src/components/flex/Flex.stories.tsx | 20 ++++++++++++++++++++ src/components/flex/Flex.style.scss | 3 +++ src/components/flex/Flex.tsx | 20 ++++++++++++++++++++ src/index.ts | 1 + 4 files changed, 44 insertions(+) create mode 100644 src/components/flex/Flex.stories.tsx create mode 100644 src/components/flex/Flex.style.scss create mode 100644 src/components/flex/Flex.tsx diff --git a/src/components/flex/Flex.stories.tsx b/src/components/flex/Flex.stories.tsx new file mode 100644 index 00000000..44038173 --- /dev/null +++ b/src/components/flex/Flex.stories.tsx @@ -0,0 +1,20 @@ +import {Meta} from "@storybook/react"; +import React from "react"; +import Flex from "./Flex"; +import Text from "../Text/Text"; + +const meta: Meta = { + title: "Flex", + component: Flex +} + +export default meta + +export const ExampleFlex = () => { + + return + Example Text 1 + Example Text 2 + + +} \ No newline at end of file diff --git a/src/components/flex/Flex.style.scss b/src/components/flex/Flex.style.scss new file mode 100644 index 00000000..271fd71c --- /dev/null +++ b/src/components/flex/Flex.style.scss @@ -0,0 +1,3 @@ +.flex { + display: flex; +} \ No newline at end of file diff --git a/src/components/flex/Flex.tsx b/src/components/flex/Flex.tsx new file mode 100644 index 00000000..1040b513 --- /dev/null +++ b/src/components/flex/Flex.tsx @@ -0,0 +1,20 @@ +import {Code0Component} from "../../utils/types"; +import React from "react"; +import {mergeCode0Props} from "../../utils/utils"; +import "./Flex.style.scss"; + +interface FlexType extends Code0Component { + children: React.ReactNode | React.ReactNode[] +} + +const Flex: React.FC = props => { + + const {children, ...rest} = props + + return
+ {children} +
+ +} + +export default Flex \ No newline at end of file diff --git a/src/index.ts b/src/index.ts index 1fd431ec..7c6d7c59 100644 --- a/src/index.ts +++ b/src/index.ts @@ -14,3 +14,4 @@ export { default as Popover} from "./components/popover/Popover" export { default as Quote} from "./components/quote/Quote" export { default as Row} from "./components/row/Row" export { default as Tooltip} from "./components/tooltip/Tooltip" +export { default as Flex} from "./components/flex/Flex" From 9bfc2bdacaa2637f00ef719f49d0b6e6b9d38a96 Mon Sep 17 00:00:00 2001 From: nicosammito Date: Fri, 3 May 2024 16:27:11 +0200 Subject: [PATCH 2/3] updating version number to current 0.2.3 version --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index b64af853..bc23924e 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@code0-tech/pictor", - "version": "0.2.2", + "version": "0.2.3", "description": "A simple template for a custom React component library", "scripts": { "dev": "npm run storybook:dev", From 562f666a072a862ce6b850c7915b4c017c1acc6a Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" <41898282+github-actions[bot]@users.noreply.github.com> Date: Fri, 3 May 2024 14:33:52 +0000 Subject: [PATCH 3/3] Update image snapshots --- __snapshots__/flex--example-flex-chromium.png | Bin 0 -> 1978 bytes __snapshots__/flex--example-flex-firefox.png | Bin 0 -> 3883 bytes __snapshots__/flex--example-flex-webkit.png | Bin 0 -> 2043 bytes 3 files changed, 0 insertions(+), 0 deletions(-) create mode 100644 __snapshots__/flex--example-flex-chromium.png create mode 100644 __snapshots__/flex--example-flex-firefox.png create mode 100644 __snapshots__/flex--example-flex-webkit.png diff --git a/__snapshots__/flex--example-flex-chromium.png b/__snapshots__/flex--example-flex-chromium.png new file mode 100644 index 0000000000000000000000000000000000000000..d5cd72012e540359911cbeaf9a320e760d93b7e7 GIT binary patch literal 1978 zcmb_d`!^Ge8=t5)%!F4AX>O4>k%d*8h)`~osJRqkF1gE?qSqzK^+m`Ub9w6>u|oB( zg>sp1*(RG9Vr&?%`*m*d?mg%G7ktn6m*;uT=RD^*&*yy3=X}zg9c{ppP)Ps)0JgKW zx(Wb@{X4^f2ShcJ9zzs0v8byymVi2@>NEgwFxt+_!X@_k+;Fh7i$JY&X~E$2)Yp(- zQhu?p;)A7gA8NoVz{kB7^MHfdgR7_5FTw^76Pkn0J{bN|Wtw4kOsS?9DqpD_e4yZH z$_Edtn(w(iM1>A1-76faeO&|1=S@a92aE2(p6v;~GZD}CRu*?4El9yElPGnRl`3l) zOH`i&0bw*0ND`KkCm}-Yk}QGcS{ASr=RBgUrLLVb5LTe2n<9HjPQenW{XedWjgvhs z#wNj)Nbr~qYvrZ|eEeWt>!^t_^^(}unIbPZi z?jVjpSSXD3O#DVmdTT~-lu_Hc!|5D1=o;HB&>F!t1hn(bZE>h|97@~d5hV(9NJ+`o zedq*}5M0F_Fy|pgYlwhwGu4lq+jGswg<19S{V3r~ASmMg-rB-)chkX*WuA6fwsAyW zI=Pew3HP4NsKQkB3=Pe&1N8@%q zT3anaGBUKFw@cgx0jaKTt+=s4K-b!yu(q;xXbr_KZf>6Zv${T0mw^1P%7lv1@uqn0 z?z|hI@jaI}S0Oy2(s?)ggKFk2i~7L z!@1HZ?;&1%DkoCRVaG$P`S=(wgq!twZ+7Kqb^dEm4%=~wsWf(r+8zV-HI4yZC-FjRm*;3%i( z61ngE^(eDoiEo_P-yp)o*@#z{9T*-#LF+-K%^FByShxDqLX)!H-2?-3XN=Z;MTLu% zJp^3x-$5$6`n3RJ{jvmGju#i=i;AHpXJ?;vadDw0_IYDRUqe35e;l&*3=tR60fE7v z2mQo9O-HkajKfSudRVU zNAs~Oo_5A(;p?JeZbL?rXxwoU=+T;K?f} z#ym=3361ysS05i8ekA3u*z$B1OH$Z$`})(=#mC|A?w+U$h&Or(WwQDOcRsfszFF`V z;J}`mo#ly4_2Epd7sKMZv8JX2<)UJjosJ`XsZu>mjM((kgu2%Z!EpIS?A@bCA-xQl zV`L)_g|?CtSGv;Pahr!Nde(hTx-A8N0BE$tnKnC(#k-sM7%FkzMlA$5S#PAT{t%Ai rpZzy)SnqfHE&z=pBdz~Wp)|dRMP{mU+UYP+7z6CA9j)ptZzuf&Dhjt2 literal 0 HcmV?d00001 diff --git a/__snapshots__/flex--example-flex-firefox.png b/__snapshots__/flex--example-flex-firefox.png new file mode 100644 index 0000000000000000000000000000000000000000..78bda6b4f4c7f1aff1a6c901c3fbbb3660a02020 GIT binary patch literal 3883 zcmd6q_ct5-7sqLhG%8|KL9ANELzS2nE2veqDN5~?M5z^3+LNWQ6uigH_rlK)+}$$u z<<|?ejkv>ZjeD>dQT}S2_88gO*|ceB3+ojY@&*oPY>4sgV(@3U>X|gJZA73l3Q-;KN(Gk^VR=~ z$WcgI>n1NnMk7(nhZ0Obl!OOXMf5*hzf9imXn_2*CilMw*bQi8!qZVKfI zWPvC$Q1T|*J~KNgMlODqcPNMOXxh;_;A%18b5 zV+%?t-?nqO0*D5CoWSVP{?mypQ4^2V7+0CejsSF>p8&4!BHrU5`)AuuqIxJH;`c=! z!M^;#vcf%xZDbg~UBkYLa^#P)2Zyqu?^T)=;f8@pN%oD|nqAa2H1#h>ctLKvDV(u+b-ZO6}2sR8xGBswV zv?R+axvGo6*z?-S2t}_Wxha3syt8wLiStwaCr5**xmp({HT_8EP(H4nDl+Qqvwqu? zErZ;ockdP}?|m37K5@&10XZZzdV4Ky4f!loP=|ztO}s4(lj<&1$KY64e-y;@i54?; zo{v0sRo(Ht?9u`a^mQl)c@5F!WoKtgk(tdpZ&W!p|9Rf3jVKNm=u@vJGegYcfgHDb zc4REyh~4qBF9z|!44eHHHwP z7t#@O$dM!InCly`lUsOJtb(^o>bG$T8XzyKCD^Rh6f&jC`Y(0J@9fa}6_O;$_gf7_ zwkMi-)PmCuPkxA)YG{o62!O=65&wR-1TU!OQ&Ng>Zissv)g|@rBkh4NMp)?43NoE+ zda^TqkHa0s(`8+-W<{zY9verqe$OZPbs@fjcCxIIzt&Zg+gV4mn9@Apj5!r}B^QN7 z6GK5Ru zzw8p_F88%2#uA1nxn>3iuq>>5hbr^Udrf+ZLTf#x9=y}3$(&4I_jYGHi;s7op#fb2 zD5BAIMqjcV%V8_#6n8Lf_pQuU5-&vHQwtqV?r+;&=B$)-WY)B_@^ZSo&|>4B#cPtR z&ij+fHG0qFAFYWgW43QqouTfSsB{}>8|T9^aS(OgooP3*oQSKTX3ynBLL6)Fsx-n}V;ctQ!nz`U$`c5i#9mMrb(6Ci~3e`|$&5{PjSa z_8`_uHDe)nWZ!I5W~1N4iwI+;EPmyNfh9~E%f|7~25!)D;0A3o%fP>kcH$qr>Sd#` zOjBi()N~BENLL!3cQGN$W==n;Zm9TiRoQgH-?s^=&V2fSB#~nAC0{$b=Z{1sx84kN4Y%F0r5 zbjrk%8vW4bWhiQi`!l-N<<*iU>Y~hbKs7x=w~>c;*#VXiG6qj-#p;4&>EF& zoPzh84GyD3jN@BJEaT~r%!XM9a0jwlA&#T8^qaj~m$1V+v-1?ZZbtcuPnIwFzQwBA z`Js)CdU0;9ZW{ah(nrqAXZ}h)yHo89IT8;uyYiK=OpLa#r#}Xpj90r=ZJQhK zW*n;*U9S5_I(I<3;Veit0MkAXS`8_0gjZN0aiJw^ls-=o$F;J3A)6yg;Pr#DRUx`Mp}9_P{O8} zK$nO^UO`P(S*2K34MUye{wO&fcJU|8^XN!l z_hs!DtoX5UIc52|hC75j5%yZm$d&$66nO;&^~qOsuXRmk_O&Jb#9NcZLdmibeSi-+ zlAJs($DQ|G64LYX^7_HrX|NTGf11k?IPvS#2lnCT;hrCMzHCLA(VFt%kZ2L}+NHGb z!l2HtVxWP!I|aAGVlV@6Y{1rhH9e-@>6MP_?3|H9amUfW1*|rxH#VIa{IM`(qN4v? z?4)IowERHW2K+=a_W(zm^r3cTI_U}DxZ`{=BIrMh0d@2Cc7Nh5)*W|us{Qxpe zj{X@VVO3^w_oB*{YL-E0>VP4Xy!x_Yr@-IH4Egnk{rmbu&dzW0ZM#CHnv#PQ$_wV*vUe#Lxk2yYwYa&OhC_ZqAjE}hRl+xiHHhm*v z&_$N8R9V2U)rg44$-u~$5tk1POzuVAG~b$Rl?n@rqel99v<7UxxZ8bx1B*CjN!2CG z!ZX;>MxVo~EX;sGJv|QJRb?DM)X;~)&iU3nW+lwy=RVe_uLK|) zQh)B3da!d=M<&3)X@UxhUU;Bf=vxGY@y7Hz5bHo$b2^R~+0lbRz{|}H7{LH1p~psl4ereubVn9Gb4mL`yZl->XgC4L>o3ZgdUaJ@e<;BP z{)60B+JHyOjDyiaYh1Veh-Nuk65IstE}Lgjk_-?Mky2gQGCHd&9kFp+A7d#qP2Ld7fW~Yo@32pp`wel zqP>4oZQu2RHf@XE(t;%c{mv?V!>-e%(yfG~V5*~zBGr#t??w&%XeP4|; zjyyl*G4!z2>3jZhM1M^q@G8iq9r(v|H9E7O7yFJO?{E^4dV?$w9Y|C_A2}IUv=_iM zI*_I))X$@jXO(B?y;`SoHlF&w@r{~9_iE{e;BoY(%&e z?b_Twfq$61tcG~DK^5iD_rWy2KO{HWJe^*1$(cF zHp0l|Cgzy|(~+DtsRgR8ki1E7{fmkU;(@*Ri0V9p1;GLWhqGJ!*^v)xDAP$nrly>w z1bwttncPp*+ZK2kBW$y$zGzKbN&sAA6vsG-d}+v^1O%6pfSQuoB_>6xS~KRJU_Qpf z*)r*kk~axnS!x6gCqU9H#Dq_vcV@B<23cm#K#C4oY2ntx8Wit5*x$i$jnr9b9>VZYSs z@s-$Xe~fSiO(|zT##jV5p!yZsVLZ&($c#RpJ=kzQgTZN6R~O-A3@wjCenKm_j}~pJ z2-Xx_-7b3`D19wU(xQz98{eWFbx=<^alL1FB4j*EiYX_dhoGM3s$gbuF@ILvMrWf$ zN^WODp9W6Ibe(gBx*_G>a`o>d*D43}q|F)?>fONdIu{R?UAxBELRLO0vGq$AJxg&5 zZHVDwsCMji`iXLRY@Bo|*sFJZ3Kez&!;}0q&>Z4xqauSU+YTvBy6G`O1gE&gwx^Gs zX?q3LFV;5$m2@GxRwJcvjK%77^^fL7B)<)BElX=N^2kQ*S@wuKRnIpvh-L@=^V|R36Kn2Rfa_A0*{d~=%{B23f|^Q} zg}cFly~2KUA)!_{#KPR19Rb0=^;df(9su^&xj5Q+C6{t1S-z_4iu?buWEc8n0R;Rl z+#g`ucSkep35;bG)i#mD%*dNx=buGx4VPN+c{1>jlx03Sm|Zr0_fq!@{3y&4W~tHu zeH3H@Ls4^`bmc}h8NAQ{b;Yc6auk=29jnOH@9WH!si7pJVTpapPt#@DpomJ-^iQVh z+55DVROGV!U{Kkx3@y7{(fT{i!iF+b}(0JX%SuFQvldHI{NvbQfO64@$rWMz3Sb2g=Lga3p@>buu_g%?FkPk zdg9GmQ0N5Fs*%_^W3>G}2hut-kDk0!R{`h>M^SkYFY@^5qAXB;MRx&-zb>VZ<9xgN zdUYU`Y6j7?g&7dGerK08qRiCpGA5wVT-_4`1$XY1FsixSD#`$YR264A=@1DN-YeZ$ znnp_kZn(a*?M}t9kp~ZaG_29(p8N;*l@T@&MCgPm4U-Zui*Bng7XgZ(-yE(e&yT+8l6ZR!)_)aafKF-5BbA6Q_YfJ^x|c1iWppctFA= zzy2E6vsmS%qhMleV(9S+K5tZFKCkc26wOI+1kbS9y1*Hbd;gWoake|v1=h9YjDA?=X*tF@>kyAHX2~tA6Beeyn z)$1Jc5d5l!pWf)r^?>tbRprMQ2Z-lzU9UpHcCxG2B>-79wfChbk5wl!{*^s!{z4@a zZ(;y}jB~{-*!OR2vVNHnmRRD_(ro$TF*~n>e;;S220SV)?dj?HJI+kOiK;Yr!{S%w=46Ngxh#=xW7#_oS^dfwy5)i)GZY=OsN$~ znqMXTB-g#8xq&jTprT_jcEOp+Tf0Vs7V}cSioM*#Sw7Uq!s615#5-LIS#(|p}@m#Ly$Y=RzJ=2%2-22YSU5+W8S;K zuQK+O6rh6*qoi3%O#HxV<}xGhii%+=fv>Ncyi94xuWj2cgd96|^vIFG_5@=2^Yy_o z&is|Lk=#Pp&Kv06S?3r$-Vmr8@$Nl_{j30d>hIqJI1L4!+7CpVc+$#o*p%uQR8}Wp z3d>nQxQV1UHTjasU%9@G>f?N=;$r!^_op%)Zw_U*3Qx4V8} z%gf3#2n2uN!ik&W;?jJ+B)rK@n%-X1_MA>1I0eT0g`~=dfAtz^LZStA&0y zH_CG?@8}3DsSsL`#+S5@cMN?QckX!IuXnE1*yVlTZfD-QeY;h`NmcU0!tq!SMIhSv z>=x{|&$GltYrL!W@USNw)W~+qu&pCn!Uq4(5e(LIRP+2Zsl&X!zJ{JWQ~a_?1o(OK z_n5>QCrWhh?uhPKQi?WRq8Y<^g8=iSa)hDQMO#2gkkvCtkOS1Wg_`g8I%LX9NFKD; eJM*6aT$)HMoB`G{l|Ts79B^?u??|zSW&RKLfbY)$ literal 0 HcmV?d00001