Improved Shopping List Card

[Mindreader]

v1.2.0-BETA-8 has been released

Implemented EAN Code Reader

This feature currently supports EAN-13 barcodes, limited to food products only.
The reason is simple — there is no free global EAN database available, except for the Open Food Facts project:
https://world.openfoodfacts.org

In the future, I might add support for a local EAN list (similar to the local categories or local chips feature).

How to use

The feature is automatically triggered when:

• an EAN-13 barcode is scanned using the camera, or
• an EAN-13 number is entered manually into the input field.

You can test it by entering this example code: 4337256383165

Added ToDo Mode

The new ToDo Mode transforms the Home Assistant ToDo list into a kind of task manager with recurring due date functionality.

Key features include:

• Set recurring due dates and due times for each item.
• Automatic calculation and display of remaining time until due, with intuitive formatting (e.g., days & hours, months & days).
• Flexible options when marking tasks complete, such as removing the due date or scheduling the next due date based on custom intervals.
• Visual indicators for upcoming or overdue tasks with configurable warning thresholds (currently only via YAML, see below).
• Streamlined UI without quantity input or export buttons, optimized specifically for task management.

List View:

Edit Mode:

Acknowledge an item:

Configuration of Warning Thresholds for ToDo Due Dates

In ToDo Mode, you can configure when upcoming tasks are visually marked as “due soon” based on configurable warning thresholds. These thresholds are defined in minutes and differ depending on the type of interval or due date format:

Configuration Parameter	Description	Default Value (Minutes)
todo_yellow_m	Warning threshold for intervals in months	1440 (24 hours)
todo_yellow_d	Warning threshold for intervals in days	120 (2 hours)
todo_yellow_h	Warning threshold for intervals in hours	10 (10 minutes)
todo_yellow_s	Warning threshold for due dates without time	120 (2 hours)

If the remaining time until the due date is within the configured threshold, the task will be highlighted in orange to remind you in time.

Example Configuration

todo_yellow_m: 2880  # 2 days (in minutes) for monthly intervals
todo_yellow_d: 240   # 4 hours for daily intervals
todo_yellow_h: 15    # 15 minutes for hourly intervals
todo_yellow_s: 60    # 1 hour for dates without time

[Mindreader]

v2.0.0 has been released - Final Version

Changes since last BETA

• Added a general category for all items without a category. Now you can also collapse these items.
• In ToDo mode, the number of items shown for each category is now inverted. The number before the ‘/’ only counts entries that are not yet due. (Example: 3/5 means that out of 5 entries, 3 are still pending.) This way, when you see (5/5), you know there are currently no tasks left to do.

For all other changes from v1.0.0 to 2.0.0, please refer to the release notes:

Releases · Nisbo/ha-shopping-list-improved

It’s too much to post here.

[Mindreader]

v2.1.0 has been released

• Added collapsible configuration sections in the Config Editor
  

  

• Added option to set a title for the card
  

  

• Added font size option for the title

• Added icon option for the title

• Clicking on the title now collapses/expands the entire card
  

• Added option to show/hide the exclamation mark (Todo Mode)

• Exclamation mark for due items is now also shown in the title (Todo Mode)

• Warning thresholds for ToDo due dates are now available in the GUI editor
  

  

• Implemented local EAN file support (formats: EAN-8, UPC (12), EAN-13, and GS1-14)
  

  

You might also need to add the www folder (or your specific folder) to the allowlist_external_dirs in your configuration.yaml and restart Home Assistant afterwards:

# Loads default set of integrations. Do not remove.
default_config:

# add your path to the file here
homeassistant:
  allowlist_external_dirs:
    - "/config/www/"

• Added Copy / Paste buttons

If you press the copy button, the current date, time, and interval will be saved to local storage (browser). You can then use the paste button to quickly apply these settings to a new entry or update an existing one.

[Mindreader]

v2.2.0-BETA-1 has been released

Implemented Dynamic Categories

Dynamic categories make it possible to assign items to categories that are not predefined, even from outside the card (e.g., through automations in the format: @Category@ Item). Additionally, new categories can be created when adding items through the card. These categories remain available until the last item in the category has been removed.

Due to the implementation of dynamic categories, the category merge mode has been reworked. There are many new options available to choose how local, global, and dynamic categories should be merged. 'local_only' shows only the locally defined categories, 'global_only' shows only the global categories, and 'dynamic_only' shows only the dynamic categories. All other options combine two or all three types in different ways.

The priority in which categories are merged follows the order in which they appear, from left to right. At first, it may look overloaded and some options might seem duplicated, but in the background this only happens if you don’t have overlapping categories.

For example, if you have the category “Vegetables” both in the local and global categories, the merge order matters. If “Vegetables” is red in the local category and green in the global category, then in the mode Local → Global the color will be red, while in Global → Local it will be green.

Additionally, there are different options to sort the merged categories. You can sort each block (global/local/dynamic) by name, or you can sort all categories together. And of course, there is also an option without sorting, meaning that the categories will be displayed as defined in the config editor, the text file for the global categories, and as detected in the items for dynamic categories.

Dont forget to enable dynamic categories AND change the merge mode for categories to use this feature.

Add an item to a dynamic category

Here you can see the dynamic category

If you add another item, you have to option to chose the earlier created dynamic category

New Options for ToDo Mode

• Option to show/hide the title info about the next due item
  Displays the next due date of all items from all categories under the title when in ToDo mode, provided a title is set.
  Expired items are not shown here; they are indicated by an exclamation mark to the right of the name.

• Option to show/hide the title info icon
  Displays a calendar icon before the due date as a visual highlight.

• Option to show the next due date inside a category
  If this option is enabled, the next due date will be displayed under the category name in ToDo mode.
  This allows you to see at a glance when the next item in that category is due.

• Option to show/hide the title exclamation mark (ToDo only)

New Options for Chips

• option to hide the chips
  

  

• option to show chips in the color of the category (the item must be part of a defined local or global category)
  If a chip is assigned as an ‘item’ to a category and that category has a defined color, the chip will be displayed in that color.
  The color priority order is: Highlight → Category → Global → Standard → Browser.

General Options

• option to show the input mask at top / bottom
• clear all button now also works in ToDo mode

General Category Options

• option to show the category icon larger (approx. 2x)
  If the next due date is displayed, this option allows enlarging the icon so that it fits visually better.

New Options Overview

Parameter	Type	Description	Default
show_title_info	Boolean	Option to show the next due date info under the title in ToDo mode	true
show_title_info_icon	Boolean	Displays a calendar icon before the due date as a visual highlight	true
show_title_exclamation_mark	Boolean	Shows an exclamation mark next to the title for due items (ToDo mode only)	true
input_row_position	String	Position of the input mask (top or bottom)	"top"
chips_with_cat_color	Boolean	Shows chips in the color of the assigned category	true
show_cat_next_due	Boolean	Shows the next due date below the category name in ToDo mode	true
cat_double_sized_icon	Boolean	Enlarges the icon when the next due date is displayed to better fit visually	true
show_cat_exclamation_mark	Boolean	Shows an exclamation mark on the category for due items	true
allow_dynamic_categories	Boolean	Allows the use of dynamic categories	false
category_merge_mode	String	Defines how local, global, and dynamic categories are merged	"local_only"

---

category_merge_mode Options

Mode	Description
local_only	Show only locally defined categories
standard_only	(old) Only standard categories
global_only	Show only global categories
dynamic_only	Show only dynamic categories
local_only_sorted	Local categories, sorted alphabetically
global_only_sorted	Global categories, sorted alphabetically
dynamic_only_sorted	Dynamic categories, sorted alphabetically
local_global	Combine local + global categories (order matters)
local_first	(old) Local first, then global
local_dynamic	Combine local + dynamic categories
global_dynamic	Combine global + dynamic categories
global_local	Combine global + local categories (order matters)
global_first	(old) Global first, then local
dynamic_local	Combine dynamic + local categories
dynamic_global	Combine dynamic + global categories
local_global_sorted	Local + global categories, sorted alphabetically
local_dynamic_sorted	Local + dynamic categories, sorted alphabetically
global_dynamic_sorted	Global + dynamic categories, sorted alphabetically
global_local_sorted	Global + local categories, sorted alphabetically
dynamic_local_sorted	Dynamic + local categories, sorted alphabetically
dynamic_global_sorted	Dynamic + global categories, sorted alphabetically
local_global_sorted_total	Local + global categories, alphabetically sorted and merged
global_combined	(old) Global categories merged
local_dynamic_sorted_total	Local + dynamic categories, alphabetically sorted and merged
global_dynamic_sorted_total	Global + dynamic categories, alphabetically sorted and merged
global_local_sorted_total	Global + local categories, alphabetically sorted and merged
dynamic_local_sorted_total	Dynamic + local categories, alphabetically sorted and merged
dynamic_global_sorted_total	Dynamic + global categories, alphabetically sorted and merged
local_global_dynamic	Combine local + global + dynamic categories
local_dynamic_global	Combine local + dynamic + global categories
global_local_dynamic	Combine global + local + dynamic categories
global_dynamic_local	Combine global + dynamic + local categories
dynamic_local_global	Combine dynamic + local + global categories
dynamic_global_local	Combine dynamic + global + local categories
local_global_dynamic_sorted	Combine local + global + dynamic categories, sorted alphabetically
local_dynamic_global_sorted	Combine local + dynamic + global categories, sorted alphabetically
global_local_dynamic_sorted	Combine global + local + dynamic categories, sorted alphabetically
global_dynamic_local_sorted	Combine global + dynamic + local categories, sorted alphabetically
dynamic_local_global_sorted	Combine dynamic + local + global categories, sorted alphabetically
dynamic_global_local_sorted	Combine dynamic + global + local categories, sorted alphabetically
local_global_dynamic_sorted_total	Combine local + global + dynamic categories, sorted and merged
local_dynamic_global_sorted_total	Combine local + dynamic + global categories, sorted and merged
global_local_dynamic_sorted_total	Combine global + local + dynamic categories, sorted and merged
global_dynamic_local_sorted_total	Combine global + dynamic + local categories, sorted and merged
dynamic_local_global_sorted_total	Combine dynamic + local + global categories, sorted and merged
dynamic_global_local_sorted_total	Combine dynamic + global + local categories, sorted and merged

[Mindreader]

v2.2.0-BETA-2 has been released

Implemented Admin Options

With this new option, you can easily copy changes from your list to the configuration section.
Simply click the Copy button to transfer the content of the text area to your clipboard.
Inside the configuration editor, use your device’s paste function to insert the content into the configuration field.

Position of the Admin Button

Option in the Config Editor

Admin Options

---

Dynamic Categories – Include Items

If you check this checkbox, the assigned items of the dynamic category will also be included in the generated text area.
Use this function to copy the new categories—including their items—to your clipboard, then paste them into the defined local categories within the configuration editor.

---

Manual Assigned Items – Include Already Configured Items

If you check this checkbox, all items already assigned to a category (not only the changes) will be included in the generated text area.
Use this function to copy the complete updated configuration to your clipboard and replace the content of the categories section inside the configuration editor.

[yngve]

This seems very nice, but since being a noob, how do I implement this Improved shopping list? I have installed it, but where do I go now?

[yngve]

Never mind, forgot to restart HA. Now it shows up Thanks!

[yngve]

Is it possible to have my default chips or global chips with categories, so I won’t have to enter the category each time I push a chip?

[Hellis81]

Add the items in a category and it will get sorted by itself

[yngve]

Do you mean in the yaml code of the card or in a txt file with global chips?

[Hellis81]

Like this:

So I guess yaml code of the card.

[yngve]

Thanks a lot!

[GrizzlY (Anton)]

A great addition! I wish the author success.
If the project is still being supported, the following ideas may be useful:

1. Add “auto-completion” of words (for example, filtering chips when entering the first letters).
2. Color the chips by color according to the categories.
3. Sometimes need to add grams instead of a quantity, a drop-down menu and a counter are not convenient in this case.

[Hellis81]

Regarding 3) we usually add them as item (500).
Not convenient but it works OK.
If you add these items as dishes or chips then it is easier. So you could have item (500) and item (1000) as two chips.
But we are using dishes for a lot of items. It has really made things easier.

Regarding 1 and 2. Sure. I agree with you.

And I recently noticed the card makes difference between tomatoes and Tomatoes and one of them goes in the uncategorized bin.
Perhaps add a |capitalize first word function-thingy?

[GrizzlY (Anton)]

I didn’t notice it right away, but the “Color the chips according to the categories” feature is implemented in v2.2.0-BETA-1

[Mindreader]

v2.2.0-BETA-6 has been released

there were some more BETA versions released not mentioned here, you can see the changelog here:

Releases · Nisbo/ha-shopping-list-improved

Bugfixes

• In shopping list mode, check after 5 seconds if items are available; if not, trigger a refresh.
• Fixed a bug with local chips where new chips were created if a chip already existed with different casing (e.g., “Tomatos” vs. “tomatos”).

@GrizzlY
2. and 3. were already answered by @Hellis81

Regarding 1.

Add “auto-completion” of words (for example, filtering chips when entering the first letters).

Nice idea, let me think about this. Maybe this function will not be optimal on a mobile phone.