 Hello, polycasters, and welcome to another edition of the MiaoNika show. Last time when I was here, I was telling you about how to get your forms to care about your custom elements. And the thing that I showed you was that you can basically bind the property that you care about in a custom element to the value of a hidden input, because forms care about hidden inputs, and that's how you can send them to the server. Today, I'm going to still talk about forms, but I'm going to show you something a little bit different. Oftentimes, you might be the one writing your custom element, and all you need to do is just make an input look prettier, because the native input is in the greatest. So if you want to just do that, the way you can get around it is to just make a wrapper that just styles your input, and then your input is still in the light DOM of the form, so the form just sees it as if it was a normal input and not a custom element. So let's go ahead and do this. Over here, I have a form just like I had before, and it's styled. It's exactly the same that I've always last time. I'm still using HTTP bin, and if you missed it, I was telling you it's a thing that just basically echoes back all the headers and all the arguments that you sent in, which is great. So I have a form, and in it, I want to do again the birthday example, where I'm going to ask you to put in your birthday, and then I'm going to send you something on your birthday. So I'm going to have an input here inside the form, and these inputs have a placeholder, and they have a name and a date. So if they have a name, the form cares about them, and it's going to submit them. So you can go ahead and see what it looks like. You have a really ugly input, but if I type something in it by the magic of forms, I'm going to send this day and the month over there, but that's not what I want. I want to assemble something that says birthday so that my server knows what to do with it. So what I'm going to go ahead and do is first make these inputs look great because they're terrible right now, and I'm going to wrap them in a custom element that is going to take a label that we're going to display and just style basically all of these inputs that get distributed to it. So if you go over here to our element, I'm going to add the label, and it's going to come as a property as you saw. So I'm going to actually add it as a property so that we can display it. And then a giant content block that basically says display here everything that you're passing me. And again, the styles aren't any different than before. If you look at my shirt styles, the only thing that I had to add was to also style a distributed input, not just like a shadow DOM input like before. So if you go back to our form, I'm going to actually import the element so that it works. And now if I refresh my page, bam, pretty input, that's amazing. But whatever data you pass in it, it's still in the wrong format because I didn't really fix that in any way. So we can go ahead and do that by binding the value that we get from a native event. So I'm going to over here, get the value from the input, and it's going to be whatever the input fires an event. I'm going to put in a property called month, and I'm going to do the same for the day, only call it a day. And then I'm going to do the same trick as before, where I have a hidden input and that thing gets sent to the server. So I'm going to bind this property month and this day, separate them by a slash and wrap these all in a nice little DOM bind so that the bindings actually work. And if you go back to the demo, put in a birthday as before, submit it, bam, look at that. We have an argument called birthday and it's in the right format. The server is happy. I'm happy. The form is happy. I think we got this done. So that's it. That's another way that you can get your forms to care about custom elements. Thank you so much for watching. Hopefully, I'll get to see you again. I'll talk to Rob to see if we can do this again. Please subscribe to the channel. If you have any questions, comments below or you can find me on Twitter at nonwaldorf. And that's it. Bye! We love!