usersvg - png - animations not beingapplied

[stinobook]

Bug report notice

Before you file a bug, make sure that you did not make a configuration mistake. The Swiss Army Knife in its current state does not yet have full configuration sanity checks!

I'm not sure actually

Swiss Army Knife version

Bug description

State animation not being applied to png usersvg. I have a robot vaccuum, and the rectex responds well to the animations (entity_index 0) for debugging purpose i also added a state with the text value of the entity_index 1. when aplying the style directly (without animations) it works. once i try to apply it through animations it doesn't respond. current life span of main brush is 0.54% which is rounded to 1 with the decimals:0. since i thought maybe it was an issue with the comma. ive tried adding ' brackets around the state value: card isnt drawn anymore at all (no error card, just invisible) adding ' over operator: doesn't do anything adding entity_index in the state animation: nothing since its a percentage, maybe sak treated it as a percentage, so i used 0.10, 0.20, 10% 20% as states as well: also nothing i wanted to wait for the update to see if that might have a fix but still the same issue. so if you see anything thats wrong with the code or if it is an actual bug, please enlighten me.

To Reproduce

card code:

              - type: 'custom:swiss-army-knife-card'
                aspectratio: 1/1
                entities:
                  - entity: vacuum.marie_jose
                  - entity: sensor.marie_jose_life_span_brush
                    decimals: 0
                  - entity: sensor.marie_jose_life_span_side_brush
                    decimals: 0
                  - entity: sensor.marie_jose_life_span_filter
                    decimals: 0
                layout:
                  styles:
                    card:
                      background: linear-gradient(135deg, rgba(254,100,146,1) 0%, rgba(242,151,94,1) 100%)
                      border: none
                      box-shadow: none
                  toolsets:
                    - toolset: background
                      position:
                       cx: 50
                       cy: 50
                      tools:
                        - type: rectex
                          position:
                            cx: 50
                            cy: 50
                            width: 100
                            height: 100
                          entity_index: 0
                          styles:
                            rectex:
                              fill: rgba(0,0,0,0)
                          user_actions:
                            tap_action:
                              haptic: light
                              actions:
                                - action: fire-dom-event
                                  browser_mod:
                                          --not relevant, removed-
                          animations:
                            - state: 'cleaning'
                              styles:
                                rectex:
                                  fill: rgba(0,0,0,0)
                                  transition: fill 0.5s linear
                            - state: 'docked'
                              styles:
                                rectex:
                                  fill: rgba(97, 69, 71, 1)
                                  transition: fill 0.5s linear
                            - state: 'docked'
                              operator: '!='
                              styles:
                                rectex:
                                  fill: rgba(97, 69, 71, 1)
                                  transition: fill 0.5s linear
                        - type: state
                          position:
                            cx: 50
                            cy: 15
                          entity_index: 1
                          styles:
                            state:
                              font-size: 10em
                        - type: usersvg
                          position:
                            cx: 75
                            cy: 15
                            height: 30
                            width: 30
                          entity_index: 1
                          style: 'images'
                          images:
                            - default: /local/images/main-brush.png
                          animations:
                            - state: 10
                              operator: <=
                              styles:
                                usersvg:
                                  filter: invert(50%) sepia(17%) saturate(5187%) hue-rotate(321deg) brightness(94%) contrast(89%)
                                  opacity: 1
                            - state: 20
                              operator: <=
                              styles:
                                usersvg:
                                  filter: unset
                                  opactiy: 0.5
                            - state: 20
                              operator: >
                              styles:
                                usersvg:
                                  filter: unset
                                  opactiy: 0
                        - type: usersvg
                          position:
                            cx: 75
                            cy: 35
                            height: 30
                            width: 30
                          entity_index: 2
                          style: 'images'
                          images:
                            - default: /local/images/side-brush.png
                          animations:
                            - state: 10
                              operator: <=
                              styles:
                                usersvg:
                                  filter: invert(50%) sepia(17%) saturate(5187%) hue-rotate(321deg) brightness(94%) contrast(89%)
                                  opacity: 1
                            - state: 20
                              operator: <=
                              styles:
                                usersvg:
                                  filter: unset
                                  opactiy: 0.5
                            - state: 20
                              operator: >
                              styles:
                                usersvg:
                                  filter: unset
                                  opactiy: 0
                        - type: usersvg
                          position:
                            cx: 75
                            cy: 55
                            height: 30
                            width: 30
                          entity_index: 3
                          style: 'images'
                          images:
                            - default: /local/images/filter.png
                          animations:
                            - state: 10
                              operator: <=
                              styles:
                                usersvg:
                                  filter: invert(50%) sepia(17%) saturate(5187%) hue-rotate(321deg) brightness(94%) contrast(89%)
                                  opacity: 1
                            - state: 20
                              operator: <=
                              styles:
                                usersvg:
                                  filter: unset
                                  opactiy: 0.5
                            - state: 20
                              operator: >
                              styles:
                                usersvg:
                                  filter: unset
                                  opactiy: 0
                        - type: icon
                          position:
                            cx: 25
                            cy: 25
                            align: start
                            icon_size: 45
                          entity_index: 0
                          styles:
                            icon:
                              fill: var(--primary-text-color)
                              color: var(--primary-text-color)
                              pointer-events: none
                          animations:
                            - state: unknown
                              icon: mdi:lan-disconnect
                              styles:
                                icon:
                                  fill: var(--paper-toggle-button-checked-button-color)
                            - state: error
                              icon: mdi:alert
                              styles:
                                icon:
                                  fill: var(--paper-toggle-button-checked-button-color)
                            - state: '-ua-'
                              icon: mdi:lan-disconnect
                              styles:
                                icon:
                                  fill: var(--paper-toggle-button-checked-button-color)
                            - state: '-ua-'
                              operator: '!='
                              styles:
                                icon:
                                  fill: var(--primary-text-color)
                        - type: name
                          position:
                            cx: 10
                            cy: 80
                          entity_index: 0
                          styles:
                            name:
                              text-anchor: start
                              font-size: 14em
                              font-weight: 500
                              pointer-events: none
                        - type: state
                          position:
                            cx: 10
                            cy: 92
                          entity_index: 0
                          styles:
                            state:
                              text-anchor: start
                              font-size: 9em
                              opacity: 0.5

Expected behavior

change appearance on svg based on state.

Screenshots

card example: