71 lines
3.1 KiB
Python
71 lines
3.1 KiB
Python
from typing import Literal
|
|
|
|
from ..defaults import DEFAULT_PROP, resolve_defaults
|
|
from ..element import Element
|
|
|
|
|
|
class Skeleton(Element):
|
|
|
|
@resolve_defaults
|
|
def __init__(self,
|
|
type: Literal[ # pylint: disable=redefined-builtin
|
|
'text',
|
|
'rect',
|
|
'circle',
|
|
'QBtn',
|
|
'QBadge',
|
|
'QChip',
|
|
'QToolbar',
|
|
'QCheckbox',
|
|
'QRadio',
|
|
'QToggle',
|
|
'QSlider',
|
|
'QRange',
|
|
'QInput',
|
|
'QAvatar',
|
|
] = DEFAULT_PROP | 'rect',
|
|
*,
|
|
tag: str = DEFAULT_PROP | 'div',
|
|
animation: Literal[
|
|
'wave',
|
|
'pulse',
|
|
'pulse-x',
|
|
'pulse-y',
|
|
'fade',
|
|
'blink',
|
|
'none',
|
|
] = DEFAULT_PROP | 'wave',
|
|
animation_speed: float = 1.5,
|
|
square: bool = DEFAULT_PROP | False,
|
|
bordered: bool = DEFAULT_PROP | False,
|
|
size: str | None = DEFAULT_PROP | None,
|
|
width: str | None = DEFAULT_PROP | None,
|
|
height: str | None = DEFAULT_PROP | None,
|
|
) -> None:
|
|
"""Skeleton
|
|
|
|
This element is based on Quasar's `QSkeleton <https://quasar.dev/vue-components/skeleton>`_ component.
|
|
It serves as a placeholder for loading content in cards, menus and other component containers.
|
|
See the `Quasar documentation <https://quasar.dev/vue-components/skeleton/#predefined-types>`_ for a list of available types.
|
|
|
|
:param type: type of skeleton to display (default: "rect")
|
|
:param tag: HTML tag to use for this element (default: "div")
|
|
:param animation: animation effect of the skeleton placeholder (default: "wave")
|
|
:param animation_speed: animation speed in seconds (default: 1.5)
|
|
:param square: whether to remover border-radius so borders are squared (default: ``False``)
|
|
:param bordered: whether to apply a default border to the component (default: ``False``)
|
|
:param size: size in CSS units (overrides ``width`` and ``height``)
|
|
:param width: width in CSS units (overridden by ``size`` if set)
|
|
:param height: height in CSS units (overridden by ``size`` if set)
|
|
"""
|
|
super().__init__('q-skeleton')
|
|
self._props.set_optional('type', type if type != 'rect' else None)
|
|
self._props.set_optional('tag', tag if tag != 'div' else None)
|
|
self._props.set_optional('animation', animation if animation != 'wave' else None)
|
|
self._props.set_optional('animation-speed', animation_speed if animation_speed != 1.5 else None)
|
|
self._props.set_bool('square', square)
|
|
self._props.set_bool('bordered', bordered)
|
|
self._props.set_optional('size', size)
|
|
self._props.set_optional('width', width)
|
|
self._props.set_optional('height', height)
|