Hi, @Alex Klein !

We are happy to announce that the “Skeleton“ component has been updated to the 1.1.0 version with a new "Margin" setting, Dimension values without "px", new Readme usage and another helpful changes. You already can try it on the Marketplace or Update your actual component to the last version in your App.

To the dynamic size content question - You can use width and height logic to determine dynamic size. Previously, values were accepted only with the indication of the unit of measurement. But now we've added some validation and now it's possible to pass a value without a unit, but that value will be automatically converted to px. Also, to determine the height and width depending on the screen size, you can use the "Get App Size" block.

If you Still have questions - please, create the Support topic and we can help you there.

Happy Codeless Coding!

Hi Stanislav, thanks for the update, I understand this component more now. Seems to me that is is essentially a block with a few kinds of CSS classes which we can make visible or invisible when we want, with possibly some height/width logic areas that allow us to set sizes. Perhaps building our own CSS class(es) for content is a smarter way to create the skeleton loading? I’m relatively new to coding, but I imagine adding or removing a class that defines a “loading” animated background for any kind of element would be easier than turning on & off visibility for multiple elements… or maybe I’m missing something? How does this specific component save us time/work? Thank you again for your efforts!

Hi, Alex!

Thank for your comment.

I’ve tested your cases and can aswer you that we created an internal sub-tickets to add the Usage to the Readme file and fixing some issues.

When you type the dimetsion props (height, width) you need to use index without space - “px“ or “%“. Ex - “100px”, not “100”, not “100 px“.

There are “width logic” and “height logic” in the component already, we’ll add the dynamic dimesions change to the Usage.

I’ll notifiy you, When a new version will be available.

Hi Stanislav, any update on this component? We really would love to avoid having to build our own custom component 😀

Hi, Alex!

The feature is on the development stage. We are planned to release it on this week)

Hello team, after playing with this component, some questions (or bug reports):

— it appears that the component becomes invisible automatically as soon as some other content that’s contained in the same block is rendered. Is this how it works? Would be good to document a little more to specifically describe how ‘Skeleton’ works.

— when not setting a height, component is nicely visible. But when we set a height, the ‘Skeleton’ is not visible. This is a bug, I think.

—when setting a width, this is just ignored by the component (setting width to “100” does nothing, ‘Skeleton’ is still 100% of parent container.

—”classes” seems to be simply ignored, we cannot use any of our pre-defined CSS classes.

— how to deal with content that this dynamic in size (e.g. an image that is 400 px max width but can be smaller on mobile phones)? Do we create “width logic” and “height logic” via some calculations we have to come up with? What shape does “width logic” take? Wiring a number to the return doesn’t seem to do anything other than break things, the ‘Skelton’ is not visible at all if we do that.

Please advise and thank you

@Alex Klein , Hi!

If I understand correctly - yes, it can works in certain situations, but by removing and adding to the page, you can make a more detailed skeleton like the card in the usage guide, and it will be a more versatile solution. You may not be able to change the background to show the skeleton in some components.