Skip to content

v1.1.0

Choose a tag to compare

@github-actions github-actions released this 27 Oct 13:20
· 25 commits to main since this release

The biggest Tabdeck release yet: nearly 40 new features. Tabs can now react to your home (live icons, alerts, formatted badges), the card can run a wall panel by itself, the deck can be a phone-style dock, a dropdown menu or a side-by-side split view, and the editor can build a deck for you from your own entities or convert one from another card. It also speaks eight languages, and there's a live demo to try everything in the browser before you install it.

Every new feature is opt-in. Nothing needs migrating and existing dashboards look and behave exactly as before.


🎮 New: try it in your browser

  • Live demo: a playground with example decks, a YAML box you can edit, and pretend devices (guest mode, a garage door, lights) that switch visibility, badges and alerts live. No Home Assistant needed.
  • Showcase: a wiki page of community decks and starter ideas. Share yours with the new Show and tell discussion form (screenshot, YAML and a tick-box to agree to it being featured).

✨ New: the editor builds decks for you

  • Starter templates: Start from a template builds a working deck from your own entities: Rooms, Lights, Security, Media, Climate, Energy or Family. Replace the current tabs or add to them.
  • Convert from another card: paste a tabbed-card, swipe-card, state-switch, Bubble Card pop-ups, a stack or grid (split at heading cards), conditional cards, a sections view or a whole dashboard, and get Tabdeck tabs back. Options are mapped across, and anything that couldn't be carried over is explained.
  • Why is this tab hidden?: the editor checks each tab's conditions against live state. Hidden now and Alerting chips show on the tab list, and each condition gets a ✅ or ❌ with the current value, any missing entity and live template results.
  • Condition builders: Visibility, Alert and Default-when conditions use Home Assistant's own condition editor. Tabdeck-only types such as template edit as YAML in place. (#110)
  • Copy and import tabs: copy a tab's config to the clipboard (works over plain http too) and paste one or several tabs back in. (#111)

🏠 New: tabs that react to your home

  • Live icons, names and colours: a tab's icon, name, subtitle, color and accent can be Jinja templates, so the Garage tab can turn red with an open-door icon while it's open. (#100)

  • Alert pulse: per-tab alert conditions make a tab pulse in --tabdeck-alert-color while they're met. With reduced motion on, it's a steady tint instead. (#102)

  • Badge formatting: badge_format: { precision, unit, max } turns 21.456 into 21.5° and 150 into 99+. Set it per tab or once for the whole card. (#101)

  • A tab per area or label: auto_tabs: { source: areas | labels } builds a tab for every area (with its icon) or label, listing its entities. No Jinja needed. (#112)

  • Tab-change actions: enter_action / leave_action run any HA action when a tab opens or closes, for example turning a camera stream on only while its tab is showing. (#106)

    - name: Garage
      icon: "{{ 'mdi:garage-open' if is_state('cover.garage', 'open') else 'mdi:garage' }}"
      color: "{{ 'var(--error-color)' if is_state('cover.garage', 'open') else '' }}"
      alert:
        - condition: state
          entity: cover.garage
          state: open

🖥️ New: wall panels and kiosks

  • Auto-rotate: auto_rotate: 15 cycles through the tabs and pauses whenever someone touches the screen. (#103)
  • Idle return: idle_return: 120 goes back to the default tab after two minutes with nobody using it. (#103)
  • Remote control from HA: with remember: entity, the card now follows its helper entity live, so an automation or Node-RED flow can change the tab on every panel at once. (#99)
  • Edit mode helpers: while you edit the dashboard, hidden tabs appear faded with an eye-off marker so you can still reach them, and rotation and idle return pause.

🧭 New: more ways to lay out a deck

  • Dock: dock: true pins the bar to the bottom of the screen like a phone app's navigation, with the icon over the label, badges on the icon, and room left for the home bar and HA's sidebar.
  • Floating action tabs: fab: true makes a tab a raised round button that floats above the dock. Pair it with tap_action.
  • Grouped tabs: a tab with children: holds sub-tabs, shown as a second row or, with children_display: menu, as a ▾ dropdown on the tab.
  • Split view: split: 900 shows every tab side by side as columns once the card is at least 900 px wide. (#108)
  • Narrow screens: tab_display_narrow switches to, say, icon-only tabs when the card is narrow. (#108)
  • Expand the selected tab: tab_display: active shows icons only, except the selected tab, which also shows its name. Suggested by the community in discussion #93.
  • Pagination dots and content arrows: tab_display: dots swaps the tabs for a row of dots, and content_arrows: true adds ‹ › buttons beside the content.
  • Expanding side rail: rail_expand: true keeps a left or right bar as an icon rail that slides its labels out on hover or keyboard focus.
  • Scroll-spy: scroll_spy: true stacks every tab as one long page. The bar jumps to each section and highlights the one you're reading. (#105)
  • Collapsible: collapsible: true folds the content away when you tap the open tab again. start_collapsed starts folded. (#107)
  • hide_bar: content only, no tab bar.

🎨 New: styling

  • Style presets: preset: ios | material | glass | minimal | rail applies a whole look in one line. Anything you set yourself still wins, and the editor's preset picker fills the values into the form so you can tweak from there. A new --tabdeck-bar-backdrop variable gives frosted bars. (#109)
  • Per-tab styles: a tab's own styles apply while it's open, for example a different accent colour per room. (#113)

⌨️ New: getting around faster

  • Quick-switch search: search: true adds a 🔍 filter that ignores case and accents and searches names and subtitles. Use ↑ ↓ and Enter to pick a tab.
  • Keyboard shortcuts: hotkeys: true gives 1 to 9 for tabs, [ ] to step and / to search. They're ignored while you're typing.
  • Back button: history: true makes the browser's Back button, or the phone's back gesture, return to the previous tab.
  • Arrange your own tabs: customize: true lets each person reorder and hide tabs for themselves. It's saved in their browser and never changes the dashboard config.
  • Navigation tabs: a tab with tap_action runs an action, such as navigate to another view, instead of opening. (#104)
  • Friendlier deep links: #tab=living-room now matches the Living Room tab, ignoring case. (#99)

🌍 New: eight languages

The editor and the card's own text follow your Home Assistant language: English, Deutsch, Español, Français, Italiano, Nederlands, Polski and Português. Regional variants use the base language, and anything not yet translated shows in English. See Languages if you'd like to help translate.

🔌 New: for scripts and other cards

  • selectTab(nameOrIndex), selectedTab, and a tabdeck-tab-changed event on every tab change, for browser_mod, scripts and other cards.

🐛 Fixed

  • Sticky bars no longer hide under Home Assistant's header. They now pin just below it. Override the position with --tabdeck-sticky-top. (#105)
  • Actions picked in HA's action editor now run. perform-action (what the picker writes) works for hold_action, badge_action and tap_action; before, only the older call-service did. (#106)
  • Content beside a left or right tab bar fills the card instead of shrinking to fit its content.
  • The editor's Add tab icon shows on current Home Assistant builds.
  • Swiping skips disabled tabs instead of landing on them.
  • A 0.0 badge counts as zero, so hide_inactive_badge hides it and dot mode shows no dot.

Upgrading

Update via HACS, then hard-refresh your browser (Ctrl/Cmd + Shift + R) so the new card loads. Nothing needs changing in your config.

Full details for each feature are on the Wiki.

Full changelog: v1.0.0...v1.1.0