v5.4.7-dev.14

Templates and Cards...

This dev build brings template and card compose capabilities to the horseshoe. Now you can re-use complete cards, or color stops and more and even compose cards out of other cards!

The child cards are actually meant for scalable cards like the horseshoe and the Swiss Army Knife. As you can see, the markdown card does not scale very well in the reserved space. It adds a scroll bar as it does not scale the contents to the width and height given.

On the left a simple card. On the right, a card built with a markdown card, and two of the "left" card.

    awair_test2:
      template:
        type: card
        defaults:
          - max: 100
      card:
        dev:
          debug: true
        constants:
          max: '[[max]]'

        layout:
          states:
            - entity_index: 0
              xpos: 50
              ypos: 50
              color_stops:
                template:
                  name: fhs_colorstops_awair_score
          names:
            - entity_index: 0
              xpos: 50
              ypos: 65
              color_stops:
                template:
                  name: fhs_colorstops_awair_score

And the YAML for the card on the right:

        - type: custom:flex-horseshoe-card
          dev:
            debug: true
          template:
            name: awair_test
            variables:
              - entity: sensor.awair_element_study_score
              - label: Awair
              - max: 100

        - type: custom:flex-horseshoe-card
          aspectratio: 1/1

          cards:
            - type: markdown
              xpos: 50
              ypos: 25
              width: 80
              height: 20
              frameless: true
              content: |
                ## Markdown child

            - type: custom:flex-horseshoe-card
              entities:
                - entity: sensor.awair_element_study_score
                  name: Awair S
              template:
                name: awair_test2
                variables:
                  - max: 100
              xpos: 25
              ypos: 65
              width: 40
              height: 40

            - type: custom:flex-horseshoe-card
              template:
                name: awair_test
                variables:
                  - entity: sensor.awair_element_livingroom_score
                  - label: Awair L
                  - max: 100
              xpos: 75
              ypos: 65
              width: 40
              height: 40

What's Changed

💥 Breaking changes

• break: Combine state and role in stringstate modes by @AmoebeLabs in #267
• breaking: Replace variables with constants for JavaScript templates by @AmoebeLabs in #310

🐛 Bug fixes

• fix: Add future formatters as comment in state tool by @AmoebeLabs in #248
• fix: Remove default 0 for entity index for shapes and icons if icon set by @AmoebeLabs in #256
• fix: Let scaleLayer renderer use styleMap() instead of direct fill by @AmoebeLabs in #269
• fix: Apply color filter to horseshoe animator by @AmoebeLabs in #271
• fix: Fix mergeFilters. Allow false values for toDict by @AmoebeLabs in #277
• regresssion: Fix state overrides, formatters and icon override by @AmoebeLabs in #281
• fix: Fix decimal separator detection. Use locale to find the separator by @AmoebeLabs in #294
• fix: Fix card template merge preserving entities arrays by @AmoebeLabs in #315

🚀 New features

• feat: (beta) Add labels and ticks to horseshoe by @AmoebeLabs in #212
• feat: Add external json color palettes to support darklight mode for custom colors not in the theme by @AmoebeLabs in #214
• feat: Extend same_as with named tags, and auto-ids when not assigned based on index in list, delta's and calc() functions by @AmoebeLabs in #218
• feat: Add static constants and ref support for reusable layout configuration by @AmoebeLabs in #221
• feat: Add display svg or image instead of icon by @AmoebeLabs in #225
• feat: Add state mapping support to horseshoe by @AmoebeLabs in #226
• feat: Add format options in entity definitions to regain control over formatting by @AmoebeLabs in #232
• Refactor: Rewrite horseshoe to separate classes to make maintenance and changes easier by @AmoebeLabs in #234
• feat: Add rectangle tool and base tool. Base tool to be used by future shap… by @AmoebeLabs in #238
• feat: Add default ZPOS in config for each section by @AmoebeLabs in #252
• feat: Add sorted zpos rendering by @AmoebeLabs in #253
• feat: Add zpos next to xpos and ypos to define the layer and render order by @AmoebeLabs in #254
• feat: Add parent tree to groups so groups itself can be grouped and positioned too. Includes dzpos and calc(zpos.
  ) by @AmoebeLabs in #257
• feat: Add arc tool shape as lowest layer by @AmoebeLabs in #259
• feat: Add segment stringstate mode for horseshoe to show for instance lowhighmoderate including labels and translations by @AmoebeLabs in #263
• feat: Add support for dark and light modes of a theme in the color stops (and some version of color filter by mistake) by @AmoebeLabs in #265
• feat: Add preserve_neutral to monochrome and duotone color filters to preserve black, white and gray colors by @AmoebeLabs in #273
• feat: Add amount of color option to monochrome and duotone filters by @AmoebeLabs in #275
• feat: Add ranking with color stop and connect reversed state map with stringstate_level horseshoe to make it work! by @AmoebeLabs in #283
• feat: Add relative position to uom like none, top, bottom and default end by @AmoebeLabs in #286
• feat: Add icon_size_percent to icon tool by @AmoebeLabs in #288
• feat: Let ref() do a replace instead of a merge in combination with same_as by @AmoebeLabs in #292
• feat: Add template and templates support by @AmoebeLabs in #304
• feat: Add child card support by @AmoebeLabs in #305
• feat: Remove card settings on best effort basis for frameless or embedded setting by @AmoebeLabs in #306
• feat: Extend template engine to work for more templates like color_stops and more by @AmoebeLabs in #308

🧰 Maintenance

• chore: Remove vx versions of functions and classes for dev3 by @AmoebeLabs in #216
• chore: Remove obsolete files and fix regression for spline by @AmoebeLabs in #237
• Bump js-yaml from 4.1.1 to 4.2.0 by @dependabot[bot] in #235

📚 Documentation

• doc: Add docs folder and documentation by @AmoebeLabs in #229
• doc: Update documentation for templates, color stops and color filters by @AmoebeLabs in #311

Other changes

• refactor: Refactor other shapes like lines and circles to same structure as the rectangle by @AmoebeLabs in #240
• Refactor: Add name and area too caused by refactor by @AmoebeLabs in #242
• Refactor: Add state tool caused by refactor by @AmoebeLabs in #244
• Refactor: Add icon tool caused by refactor by @AmoebeLabs in #246
• refactor: Horseshoe-gauge now uses base tool by @AmoebeLabs in #261
• Fix: Add delayed update after theme change to let palette work by @AmoebeLabs in #279
• chore: Add JSDOC stuff and rename some functions by @AmoebeLabs in #285
• regression: Remove stateValue from format if attribute by @AmoebeLabs in #290
• chore: Split same as into its own class file by @AmoebeLabs in #302
• chore: Rename functions to logical more descriptive names by @AmoebeLabs in #303

Full Changelog: v5.4.7...v5.4.7-dev.14