rating

Rating is a set of radio ratings that allow the user to rate something.

Base Rating

rating = SingleValueFactory("rating", "Base rating component for a div containing radio inputs") # Base rating component

Rating Modifiers

---

source

RatingModifier

 RatingModifier (value, names=None, module=None, qualname=None, type=None,
                 start=1, boundary=None)

*str(object=’’) -> str str(bytes_or_buffer[, encoding[, errors]]) -> str

Create a new string object from the given object. If encoding or errors is specified, then the object must expose a data buffer that will be decoded using the given encoding and error handler. Otherwise, returns the result of object.__str__() (if defined) or repr(object). encoding defaults to sys.getdefaultencoding(). errors defaults to ‘strict’.*

class RatingModifier(str, Enum):
    HALF = "half"
    HIDDEN = "hidden"

rating_modifiers = enums_to_simple_factory(rating, [RatingModifier], "rating modifiers") # rating modifiers

Rating Sizes

rating_sizes = enums_to_simple_factory(rating, [DaisyUINamedSize], "rating size variants from extra small to extra large") # rating size variants

Rating Test Examples

---

source

test_rating_basic_examples

 test_rating_basic_examples ()

Test basic rating utilities.

def test_rating_basic_examples():
    """Test basic rating utilities."""
    # Basic rating
    assert str(rating) == "rating"
    
    # Test with modifiers
    assert str(rating.hover) == "hover:rating"
    assert str(rating.md) == "md:rating"
    assert str(rating.dark) == "dark:rating"

# Run the tests
test_rating_basic_examples()

---

source

test_rating_modifiers_examples

 test_rating_modifiers_examples ()

Test rating modifier utilities.

def test_rating_modifiers_examples():
    """Test rating modifier utilities."""
    assert str(rating_modifiers.half) == "rating-half"
    assert str(rating_modifiers.hidden) == "rating-hidden"

# Run the tests
test_rating_modifiers_examples()

---

source

test_rating_sizes_examples

 test_rating_sizes_examples ()

Test rating size variants.

def test_rating_sizes_examples():
    """Test rating size variants."""
    assert str(rating_sizes.xs) == "rating-xs"
    assert str(rating_sizes.sm) == "rating-sm"
    assert str(rating_sizes.md) == "rating-md"
    assert str(rating_sizes.lg) == "rating-lg"
    assert str(rating_sizes.xl) == "rating-xl"
    
    # With responsive modifiers
    assert str(rating_sizes.xs.sm) == "sm:rating-xs"
    assert str(rating_sizes.lg.md) == "md:rating-lg"

# Run the tests
test_rating_sizes_examples()

---

source

test_rating_basic_fasthtml_examples

 test_rating_basic_fasthtml_examples ()

Test basic rating example from daisyUI v5 documentation.

def test_rating_basic_fasthtml_examples():
    """Test basic rating example from daisyUI v5 documentation."""
    from fasthtml.common import Div, Input
    from cjm_fasthtml_daisyui.components.layout.mask import mask, mask_styles
    
    # Basic rating with 5 stars
    basic_rating = Div(
        Input(type="radio", name="rating-1", cls=combine_classes(mask, mask_styles.star), aria_label="1 star"),
        Input(type="radio", name="rating-1", cls=combine_classes(mask, mask_styles.star), aria_label="2 star", checked="checked"),
        Input(type="radio", name="rating-1", cls=combine_classes(mask, mask_styles.star), aria_label="3 star"),
        Input(type="radio", name="rating-1", cls=combine_classes(mask, mask_styles.star), aria_label="4 star"),
        Input(type="radio", name="rating-1", cls=combine_classes(mask, mask_styles.star), aria_label="5 star"),
        cls=str(rating)
    )
    
    # Verify structure
    assert basic_rating.tag == "div"
    assert basic_rating.attrs['class'] == "rating"
    assert len(basic_rating.children) == 5
    
    # Verify each input
    for i, input_elem in enumerate(basic_rating.children, 1):
        assert input_elem.tag == "input"
        assert input_elem.attrs['type'] == "radio"
        assert input_elem.attrs['name'] == "rating-1"
        assert "mask" in input_elem.attrs['class']
        assert "mask-star" in input_elem.attrs['class']
        assert input_elem.attrs['aria-label'] == f"{i} star"
        if i == 2:
            assert input_elem.attrs.get('checked') == "checked"
        else:
            assert 'checked' not in input_elem.attrs
    
    return basic_rating

# Run the tests
test_rating_basic_fasthtml_examples()

<div class="rating">
  <input type="radio" name="rating-1" aria-label="1 star" class="mask mask-star">
  <input type="radio" name="rating-1" aria-label="2 star" checked="checked" class="mask mask-star">
  <input type="radio" name="rating-1" aria-label="3 star" class="mask mask-star">
  <input type="radio" name="rating-1" aria-label="4 star" class="mask mask-star">
  <input type="radio" name="rating-1" aria-label="5 star" class="mask mask-star">
</div>

test_func = test_rating_basic_fasthtml_examples
app, rt = create_test_app(theme=DaisyUITheme.LIGHT)

@rt
def index():
    return create_test_page(test_func.__doc__.title().replace('.', ''), test_func())
server = start_test_server(app)
display(HTMX())
server.stop()

---

source

test_rating_readonly_fasthtml_examples

 test_rating_readonly_fasthtml_examples ()

Test read-only rating from daisyUI v5 documentation.

def test_rating_readonly_fasthtml_examples():
    """Test read-only rating from daisyUI v5 documentation."""
    from fasthtml.common import Div
    from cjm_fasthtml_daisyui.components.layout.mask import mask, mask_styles
    
    # Read-only rating with 3 stars selected
    readonly_rating = Div(
        Div(cls=combine_classes(mask, mask_styles.star), aria_label="1 star"),
        Div(cls=combine_classes(mask, mask_styles.star), aria_label="2 star"),
        Div(cls=combine_classes(mask, mask_styles.star), aria_label="3 star", aria_current="true"),
        Div(cls=combine_classes(mask, mask_styles.star), aria_label="4 star"),
        Div(cls=combine_classes(mask, mask_styles.star), aria_label="5 star"),
        cls=str(rating)
    )
    
    # Verify structure
    assert readonly_rating.tag == "div"
    assert readonly_rating.attrs['class'] == "rating"
    assert len(readonly_rating.children) == 5
    
    # Verify each div
    for i, div_elem in enumerate(readonly_rating.children, 1):
        assert div_elem.tag == "div"
        assert "mask" in div_elem.attrs['class']
        assert "mask-star" in div_elem.attrs['class']
        assert div_elem.attrs['aria-label'] == f"{i} star"
        if i == 3:
            assert div_elem.attrs.get('aria-current') == "true"
        else:
            assert 'aria-current' not in div_elem.attrs
    
    return readonly_rating

# Run the tests
test_rating_readonly_fasthtml_examples()

<div class="rating">
  <div aria-label="1 star" class="mask mask-star"></div>
  <div aria-label="2 star" class="mask mask-star"></div>
  <div aria-label="3 star" aria-current="true" class="mask mask-star"></div>
  <div aria-label="4 star" class="mask mask-star"></div>
  <div aria-label="5 star" class="mask mask-star"></div>
</div>

test_func = test_rating_readonly_fasthtml_examples
app, rt = create_test_app(theme=DaisyUITheme.LIGHT)

@rt
def index():
    return create_test_page(test_func.__doc__.title().replace('.', ''), test_func())
server = start_test_server(app)
display(HTMX())
server.stop()

---

source

test_rating_with_colors_fasthtml_examples

 test_rating_with_colors_fasthtml_examples ()

Test rating with different colors from daisyUI v5 documentation.

def test_rating_with_colors_fasthtml_examples():
    """Test rating with different colors from daisyUI v5 documentation."""
    from fasthtml.common import Div, Input
    from cjm_fasthtml_tailwind.utilities.backgrounds import bg
    from cjm_fasthtml_tailwind.utilities.flexbox_and_grid import gap
    from cjm_fasthtml_daisyui.components.layout.mask import mask, mask_styles
    
    # mask-star-2 with orange-400 color
    star2_orange_rating = Div(
        Input(type="radio", name="rating-2", cls=combine_classes(mask, mask_styles.star_2, bg.orange._400), aria_label="1 star"),
        Input(type="radio", name="rating-2", cls=combine_classes(mask, mask_styles.star_2, bg.orange._400), aria_label="2 star", checked="checked"),
        Input(type="radio", name="rating-2", cls=combine_classes(mask, mask_styles.star_2, bg.orange._400), aria_label="3 star"),
        Input(type="radio", name="rating-2", cls=combine_classes(mask, mask_styles.star_2, bg.orange._400), aria_label="4 star"),
        Input(type="radio", name="rating-2", cls=combine_classes(mask, mask_styles.star_2, bg.orange._400), aria_label="5 star"),
        cls=str(rating)
    )
    
    # Verify star2_orange_rating
    assert star2_orange_rating.tag == "div"
    assert star2_orange_rating.attrs['class'] == "rating"
    for i, input_elem in enumerate(star2_orange_rating.children, 1):
        assert input_elem.attrs['name'] == "rating-2"
        assert "mask-star-2" in input_elem.attrs['class']
        assert "bg-orange-400" in input_elem.attrs['class']
        if i == 2:
            assert input_elem.attrs.get('checked') == "checked"
    
    # mask-heart with multiple colors
    heart_multi_color_rating = Div(
        Input(type="radio", name="rating-3", cls=combine_classes(mask, mask_styles.heart, bg.red._400), aria_label="1 star"),
        Input(type="radio", name="rating-3", cls=combine_classes(mask, mask_styles.heart, bg.orange._400), aria_label="2 star", checked="checked"),
        Input(type="radio", name="rating-3", cls=combine_classes(mask, mask_styles.heart, bg.yellow._400), aria_label="3 star"),
        Input(type="radio", name="rating-3", cls=combine_classes(mask, mask_styles.heart, bg.lime._400), aria_label="4 star"),
        Input(type="radio", name="rating-3", cls=combine_classes(mask, mask_styles.heart, bg.green._400), aria_label="5 star"),
        cls=combine_classes(rating, gap._1)
    )
    
    # Verify heart_multi_color_rating
    assert heart_multi_color_rating.tag == "div"
    assert "rating" in heart_multi_color_rating.attrs['class']
    assert "gap-1" in heart_multi_color_rating.attrs['class']
    
    colors = ["bg-red-400", "bg-orange-400", "bg-yellow-400", "bg-lime-400", "bg-green-400"]
    for i, (input_elem, color) in enumerate(zip(heart_multi_color_rating.children, colors), 1):
        assert input_elem.attrs['name'] == "rating-3"
        assert "mask-heart" in input_elem.attrs['class']
        assert color in input_elem.attrs['class']
        if i == 2:
            assert input_elem.attrs.get('checked') == "checked"
    
    # mask-star-2 with green-500 color
    star2_green_rating = Div(
        Input(type="radio", name="rating-4", cls=combine_classes(mask, mask_styles.star_2, bg.green._500), aria_label="1 star"),
        Input(type="radio", name="rating-4", cls=combine_classes(mask, mask_styles.star_2, bg.green._500), aria_label="2 star", checked="checked"),
        Input(type="radio", name="rating-4", cls=combine_classes(mask, mask_styles.star_2, bg.green._500), aria_label="3 star"),
        Input(type="radio", name="rating-4", cls=combine_classes(mask, mask_styles.star_2, bg.green._500), aria_label="4 star"),
        Input(type="radio", name="rating-4", cls=combine_classes(mask, mask_styles.star_2, bg.green._500), aria_label="5 star"),
        cls=str(rating)
    )
    
    # Verify star2_green_rating
    assert star2_green_rating.tag == "div"
    assert star2_green_rating.attrs['class'] == "rating"
    for i, input_elem in enumerate(star2_green_rating.children, 1):
        assert input_elem.attrs['name'] == "rating-4"
        assert "mask-star-2" in input_elem.attrs['class']
        assert "bg-green-500" in input_elem.attrs['class']
        if i == 2:
            assert input_elem.attrs.get('checked') == "checked"
    
    return Div(star2_orange_rating, heart_multi_color_rating, star2_green_rating)

# Run the tests
test_rating_with_colors_fasthtml_examples()

<div>
  <div class="rating">
    <input type="radio" name="rating-2" aria-label="1 star" class="mask mask-star-2 bg-orange-400">
    <input type="radio" name="rating-2" aria-label="2 star" checked="checked" class="mask mask-star-2 bg-orange-400">
    <input type="radio" name="rating-2" aria-label="3 star" class="mask mask-star-2 bg-orange-400">
    <input type="radio" name="rating-2" aria-label="4 star" class="mask mask-star-2 bg-orange-400">
    <input type="radio" name="rating-2" aria-label="5 star" class="mask mask-star-2 bg-orange-400">
  </div>
  <div class="rating gap-1">
    <input type="radio" name="rating-3" aria-label="1 star" class="mask mask-heart bg-red-400">
    <input type="radio" name="rating-3" aria-label="2 star" checked="checked" class="mask mask-heart bg-orange-400">
    <input type="radio" name="rating-3" aria-label="3 star" class="mask mask-heart bg-yellow-400">
    <input type="radio" name="rating-3" aria-label="4 star" class="mask mask-heart bg-lime-400">
    <input type="radio" name="rating-3" aria-label="5 star" class="mask mask-heart bg-green-400">
  </div>
  <div class="rating">
    <input type="radio" name="rating-4" aria-label="1 star" class="mask mask-star-2 bg-green-500">
    <input type="radio" name="rating-4" aria-label="2 star" checked="checked" class="mask mask-star-2 bg-green-500">
    <input type="radio" name="rating-4" aria-label="3 star" class="mask mask-star-2 bg-green-500">
    <input type="radio" name="rating-4" aria-label="4 star" class="mask mask-star-2 bg-green-500">
    <input type="radio" name="rating-4" aria-label="5 star" class="mask mask-star-2 bg-green-500">
  </div>
</div>

test_func = test_rating_with_colors_fasthtml_examples
app, rt = create_test_app(theme=DaisyUITheme.LIGHT)

@rt
def index():
    return create_test_page(test_func.__doc__.title().replace('.', ''), test_func())
server = start_test_server(app)
display(HTMX())
server.stop()

---

source

test_rating_sizes_fasthtml_examples

 test_rating_sizes_fasthtml_examples ()

Test rating size variations from daisyUI v5 documentation.

def test_rating_sizes_fasthtml_examples():
    """Test rating size variations from daisyUI v5 documentation."""
    from fasthtml.common import Div, Input
    from cjm_fasthtml_tailwind.utilities.backgrounds import bg
    from cjm_fasthtml_daisyui.components.layout.mask import mask, mask_styles
    
    # Common mask and background classes
    mask_star2_orange = combine_classes(mask, mask_styles.star_2, bg.orange._400)
    
    # Extra small rating
    xs_rating = Div(
        Input(type="radio", name="rating-5", cls=mask_star2_orange, aria_label="1 star"),
        Input(type="radio", name="rating-5", cls=mask_star2_orange, aria_label="2 star", checked="checked"),
        Input(type="radio", name="rating-5", cls=mask_star2_orange, aria_label="3 star"),
        Input(type="radio", name="rating-5", cls=mask_star2_orange, aria_label="4 star"),
        Input(type="radio", name="rating-5", cls=mask_star2_orange, aria_label="5 star"),
        cls=combine_classes(rating, rating_sizes.xs)
    )
    
    # Small rating
    sm_rating = Div(
        Input(type="radio", name="rating-6", cls=mask_star2_orange, aria_label="1 star"),
        Input(type="radio", name="rating-6", cls=mask_star2_orange, aria_label="2 star", checked="checked"),
        Input(type="radio", name="rating-6", cls=mask_star2_orange, aria_label="3 star"),
        Input(type="radio", name="rating-6", cls=mask_star2_orange, aria_label="4 star"),
        Input(type="radio", name="rating-6", cls=mask_star2_orange, aria_label="5 star"),
        cls=combine_classes(rating, rating_sizes.sm)
    )
    
    # Medium rating
    md_rating = Div(
        Input(type="radio", name="rating-7", cls=mask_star2_orange, aria_label="1 star"),
        Input(type="radio", name="rating-7", cls=mask_star2_orange, aria_label="2 star", checked="checked"),
        Input(type="radio", name="rating-7", cls=mask_star2_orange, aria_label="3 star"),
        Input(type="radio", name="rating-7", cls=mask_star2_orange, aria_label="4 star"),
        Input(type="radio", name="rating-7", cls=mask_star2_orange, aria_label="5 star"),
        cls=combine_classes(rating, rating_sizes.md)
    )
    
    # Large rating
    lg_rating = Div(
        Input(type="radio", name="rating-8", cls=mask_star2_orange, aria_label="1 star"),
        Input(type="radio", name="rating-8", cls=mask_star2_orange, aria_label="2 star", checked="checked"),
        Input(type="radio", name="rating-8", cls=mask_star2_orange, aria_label="3 star"),
        Input(type="radio", name="rating-8", cls=mask_star2_orange, aria_label="4 star"),
        Input(type="radio", name="rating-8", cls=mask_star2_orange, aria_label="5 star"),
        cls=combine_classes(rating, rating_sizes.lg)
    )
    
    # Extra large rating
    xl_rating = Div(
        Input(type="radio", name="rating-9", cls=mask_star2_orange, aria_label="1 star"),
        Input(type="radio", name="rating-9", cls=mask_star2_orange, aria_label="2 star", checked="checked"),
        Input(type="radio", name="rating-9", cls=mask_star2_orange, aria_label="3 star"),
        Input(type="radio", name="rating-9", cls=mask_star2_orange, aria_label="4 star"),
        Input(type="radio", name="rating-9", cls=mask_star2_orange, aria_label="5 star"),
        cls=combine_classes(rating, rating_sizes.xl)
    )
    
    # Verify all sizes
    sizes = [
        (xs_rating, "rating-xs", "rating-5"),
        (sm_rating, "rating-sm", "rating-6"),
        (md_rating, "rating-md", "rating-7"),
        (lg_rating, "rating-lg", "rating-8"),
        (xl_rating, "rating-xl", "rating-9")
    ]
    
    for rating_elem, size_class, name in sizes:
        assert rating_elem.tag == "div"
        assert "rating" in rating_elem.attrs['class']
        assert size_class in rating_elem.attrs['class']
        assert len(rating_elem.children) == 5
        
        for i, input_elem in enumerate(rating_elem.children, 1):
            assert input_elem.attrs['name'] == name
            assert "mask" in input_elem.attrs['class']
            assert "mask-star-2" in input_elem.attrs['class']
            assert "bg-orange-400" in input_elem.attrs['class']
            if i == 2:
                assert input_elem.attrs.get('checked') == "checked"
    
    return Div(xs_rating, sm_rating, md_rating, lg_rating, xl_rating)

# Run the tests
test_rating_sizes_fasthtml_examples()

<div>
  <div class="rating rating-xs">
    <input type="radio" name="rating-5" aria-label="1 star" class="mask mask-star-2 bg-orange-400">
    <input type="radio" name="rating-5" aria-label="2 star" checked="checked" class="mask mask-star-2 bg-orange-400">
    <input type="radio" name="rating-5" aria-label="3 star" class="mask mask-star-2 bg-orange-400">
    <input type="radio" name="rating-5" aria-label="4 star" class="mask mask-star-2 bg-orange-400">
    <input type="radio" name="rating-5" aria-label="5 star" class="mask mask-star-2 bg-orange-400">
  </div>
  <div class="rating rating-sm">
    <input type="radio" name="rating-6" aria-label="1 star" class="mask mask-star-2 bg-orange-400">
    <input type="radio" name="rating-6" aria-label="2 star" checked="checked" class="mask mask-star-2 bg-orange-400">
    <input type="radio" name="rating-6" aria-label="3 star" class="mask mask-star-2 bg-orange-400">
    <input type="radio" name="rating-6" aria-label="4 star" class="mask mask-star-2 bg-orange-400">
    <input type="radio" name="rating-6" aria-label="5 star" class="mask mask-star-2 bg-orange-400">
  </div>
  <div class="rating rating-md">
    <input type="radio" name="rating-7" aria-label="1 star" class="mask mask-star-2 bg-orange-400">
    <input type="radio" name="rating-7" aria-label="2 star" checked="checked" class="mask mask-star-2 bg-orange-400">
    <input type="radio" name="rating-7" aria-label="3 star" class="mask mask-star-2 bg-orange-400">
    <input type="radio" name="rating-7" aria-label="4 star" class="mask mask-star-2 bg-orange-400">
    <input type="radio" name="rating-7" aria-label="5 star" class="mask mask-star-2 bg-orange-400">
  </div>
  <div class="rating rating-lg">
    <input type="radio" name="rating-8" aria-label="1 star" class="mask mask-star-2 bg-orange-400">
    <input type="radio" name="rating-8" aria-label="2 star" checked="checked" class="mask mask-star-2 bg-orange-400">
    <input type="radio" name="rating-8" aria-label="3 star" class="mask mask-star-2 bg-orange-400">
    <input type="radio" name="rating-8" aria-label="4 star" class="mask mask-star-2 bg-orange-400">
    <input type="radio" name="rating-8" aria-label="5 star" class="mask mask-star-2 bg-orange-400">
  </div>
  <div class="rating rating-xl">
    <input type="radio" name="rating-9" aria-label="1 star" class="mask mask-star-2 bg-orange-400">
    <input type="radio" name="rating-9" aria-label="2 star" checked="checked" class="mask mask-star-2 bg-orange-400">
    <input type="radio" name="rating-9" aria-label="3 star" class="mask mask-star-2 bg-orange-400">
    <input type="radio" name="rating-9" aria-label="4 star" class="mask mask-star-2 bg-orange-400">
    <input type="radio" name="rating-9" aria-label="5 star" class="mask mask-star-2 bg-orange-400">
  </div>
</div>

test_func = test_rating_sizes_fasthtml_examples
app, rt = create_test_app(theme=DaisyUITheme.LIGHT)

@rt
def index():
    return create_test_page(test_func.__doc__.title().replace('.', ''), test_func())
server = start_test_server(app)
display(HTMX())
server.stop()

---

source

test_rating_with_hidden_fasthtml_examples

 test_rating_with_hidden_fasthtml_examples ()

Test rating with hidden clear option from daisyUI v5 documentation.

def test_rating_with_hidden_fasthtml_examples():
    """Test rating with hidden clear option from daisyUI v5 documentation."""
    from fasthtml.common import Div, Input
    from cjm_fasthtml_daisyui.components.layout.mask import mask, mask_styles
    
    # Rating with hidden clear option
    rating_with_hidden = Div(
        Input(type="radio", name="rating-10", cls=str(rating_modifiers.hidden), aria_label="clear"),
        Input(type="radio", name="rating-10", cls=combine_classes(mask, mask_styles.star_2), aria_label="1 star"),
        Input(type="radio", name="rating-10", cls=combine_classes(mask, mask_styles.star_2), aria_label="2 star", checked="checked"),
        Input(type="radio", name="rating-10", cls=combine_classes(mask, mask_styles.star_2), aria_label="3 star"),
        Input(type="radio", name="rating-10", cls=combine_classes(mask, mask_styles.star_2), aria_label="4 star"),
        Input(type="radio", name="rating-10", cls=combine_classes(mask, mask_styles.star_2), aria_label="5 star"),
        cls=combine_classes(rating, rating_sizes.lg)
    )
    
    # Verify structure
    assert rating_with_hidden.tag == "div"
    assert "rating" in rating_with_hidden.attrs['class']
    assert "rating-lg" in rating_with_hidden.attrs['class']
    assert len(rating_with_hidden.children) == 6  # One hidden + 5 stars
    
    # Verify hidden clear input
    hidden_input = rating_with_hidden.children[0]
    assert hidden_input.tag == "input"
    assert hidden_input.attrs['type'] == "radio"
    assert hidden_input.attrs['name'] == "rating-10"
    assert hidden_input.attrs['class'] == "rating-hidden"
    assert hidden_input.attrs['aria-label'] == "clear"
    
    # Verify star inputs
    for i, input_elem in enumerate(rating_with_hidden.children[1:], 1):
        assert input_elem.tag == "input"
        assert input_elem.attrs['type'] == "radio"
        assert input_elem.attrs['name'] == "rating-10"
        assert "mask" in input_elem.attrs['class']
        assert "mask-star-2" in input_elem.attrs['class']
        assert input_elem.attrs['aria-label'] == f"{i} star"
        if i == 2:
            assert input_elem.attrs.get('checked') == "checked"
        else:
            assert 'checked' not in input_elem.attrs
    
    return rating_with_hidden

# Run the tests
test_rating_with_hidden_fasthtml_examples()

<div class="rating rating-lg">
  <input type="radio" name="rating-10" aria-label="clear" class="rating-hidden">
  <input type="radio" name="rating-10" aria-label="1 star" class="mask mask-star-2">
  <input type="radio" name="rating-10" aria-label="2 star" checked="checked" class="mask mask-star-2">
  <input type="radio" name="rating-10" aria-label="3 star" class="mask mask-star-2">
  <input type="radio" name="rating-10" aria-label="4 star" class="mask mask-star-2">
  <input type="radio" name="rating-10" aria-label="5 star" class="mask mask-star-2">
</div>

test_func = test_rating_with_hidden_fasthtml_examples
app, rt = create_test_app(theme=DaisyUITheme.LIGHT)

@rt
def index():
    return create_test_page(test_func.__doc__.title().replace('.', ''), test_func())
server = start_test_server(app)
display(HTMX())
server.stop()

---

source

test_rating_half_stars_fasthtml_examples

 test_rating_half_stars_fasthtml_examples ()

Test rating with half stars from daisyUI v5 documentation.

def test_rating_half_stars_fasthtml_examples():
    """Test rating with half stars from daisyUI v5 documentation."""
    from fasthtml.common import Div, Input
    from cjm_fasthtml_tailwind.utilities.backgrounds import bg
    from cjm_fasthtml_daisyui.components.layout.mask import mask, mask_styles, mask_modifiers
    
    # Half stars rating
    half_stars_rating = Div(
        Input(type="radio", name="rating-11", cls=str(rating_modifiers.hidden)),
        Input(type="radio", name="rating-11", cls=combine_classes(mask, mask_styles.star_2, mask_modifiers.half_1, bg.green._500), aria_label="0.5 star"),
        Input(type="radio", name="rating-11", cls=combine_classes(mask, mask_styles.star_2, mask_modifiers.half_2, bg.green._500), aria_label="1 star"),
        Input(type="radio", name="rating-11", cls=combine_classes(mask, mask_styles.star_2, mask_modifiers.half_1, bg.green._500), aria_label="1.5 star", checked="checked"),
        Input(type="radio", name="rating-11", cls=combine_classes(mask, mask_styles.star_2, mask_modifiers.half_2, bg.green._500), aria_label="2 star"),
        Input(type="radio", name="rating-11", cls=combine_classes(mask, mask_styles.star_2, mask_modifiers.half_1, bg.green._500), aria_label="2.5 star"),
        Input(type="radio", name="rating-11", cls=combine_classes(mask, mask_styles.star_2, mask_modifiers.half_2, bg.green._500), aria_label="3 star"),
        Input(type="radio", name="rating-11", cls=combine_classes(mask, mask_styles.star_2, mask_modifiers.half_1, bg.green._500), aria_label="3.5 star"),
        Input(type="radio", name="rating-11", cls=combine_classes(mask, mask_styles.star_2, mask_modifiers.half_2, bg.green._500), aria_label="4 star"),
        Input(type="radio", name="rating-11", cls=combine_classes(mask, mask_styles.star_2, mask_modifiers.half_1, bg.green._500), aria_label="4.5 star"),
        Input(type="radio", name="rating-11", cls=combine_classes(mask, mask_styles.star_2, mask_modifiers.half_2, bg.green._500), aria_label="5 star"),
        cls=combine_classes(rating, rating_sizes.lg, rating_modifiers.half)
    )
    
    # Verify structure
    assert half_stars_rating.tag == "div"
    assert "rating" in half_stars_rating.attrs['class']
    assert "rating-lg" in half_stars_rating.attrs['class']
    assert "rating-half" in half_stars_rating.attrs['class']
    assert len(half_stars_rating.children) == 11  # 1 hidden + 10 halves
    
    # Verify hidden input
    hidden_input = half_stars_rating.children[0]
    assert hidden_input.tag == "input"
    assert hidden_input.attrs['type'] == "radio"
    assert hidden_input.attrs['name'] == "rating-11"
    assert hidden_input.attrs['class'] == "rating-hidden"
    
    # Verify half star inputs
    expected_labels = [
        "0.5 star", "1 star", "1.5 star", "2 star", "2.5 star",
        "3 star", "3.5 star", "4 star", "4.5 star", "5 star"
    ]
    
    for i, (input_elem, label) in enumerate(zip(half_stars_rating.children[1:], expected_labels)):
        assert input_elem.tag == "input"
        assert input_elem.attrs['type'] == "radio"
        assert input_elem.attrs['name'] == "rating-11"
        assert "mask" in input_elem.attrs['class']
        assert "mask-star-2" in input_elem.attrs['class']
        assert "bg-green-500" in input_elem.attrs['class']
        assert input_elem.attrs['aria-label'] == label
        
        # Check for half-1 or half-2
        if i % 2 == 0:  # Even indices (0, 2, 4, 6, 8) should have half-1
            assert "mask-half-1" in input_elem.attrs['class']
        else:  # Odd indices (1, 3, 5, 7, 9) should have half-2
            assert "mask-half-2" in input_elem.attrs['class']
        
        # Check if 1.5 star is checked (index 2 in 0-based)
        if i == 2:
            assert input_elem.attrs.get('checked') == "checked"
        else:
            assert 'checked' not in input_elem.attrs
    
    return half_stars_rating

# Run the tests
test_rating_half_stars_fasthtml_examples()

<div class="rating rating-lg rating-half">
  <input type="radio" name="rating-11" class="rating-hidden">
  <input type="radio" name="rating-11" aria-label="0.5 star" class="mask mask-star-2 mask-half-1 bg-green-500">
  <input type="radio" name="rating-11" aria-label="1 star" class="mask mask-star-2 mask-half-2 bg-green-500">
  <input type="radio" name="rating-11" aria-label="1.5 star" checked="checked" class="mask mask-star-2 mask-half-1 bg-green-500">
  <input type="radio" name="rating-11" aria-label="2 star" class="mask mask-star-2 mask-half-2 bg-green-500">
  <input type="radio" name="rating-11" aria-label="2.5 star" class="mask mask-star-2 mask-half-1 bg-green-500">
  <input type="radio" name="rating-11" aria-label="3 star" class="mask mask-star-2 mask-half-2 bg-green-500">
  <input type="radio" name="rating-11" aria-label="3.5 star" class="mask mask-star-2 mask-half-1 bg-green-500">
  <input type="radio" name="rating-11" aria-label="4 star" class="mask mask-star-2 mask-half-2 bg-green-500">
  <input type="radio" name="rating-11" aria-label="4.5 star" class="mask mask-star-2 mask-half-1 bg-green-500">
  <input type="radio" name="rating-11" aria-label="5 star" class="mask mask-star-2 mask-half-2 bg-green-500">
</div>

test_func = test_rating_half_stars_fasthtml_examples
app, rt = create_test_app(theme=DaisyUITheme.LIGHT)

@rt
def index():
    return create_test_page(test_func.__doc__.title().replace('.', ''), test_func())
server = start_test_server(app)
display(HTMX())
server.stop()