Releases: shannonhochkins/ha-component-kit
6.0.2
6.0.2
@hakit/components
- BUGIX - spacing issue for ButtonCard when has no content - fixes issue
- FEATURE - Introducing "tooltipsWhenClosed" prop, which is now enabled by default to display an indicator of what a button does in collapsed state
@hakit/core
- BUGFIX - HassConnect suspend/resume now resolves even when browsers skip
visibilitychangeafter long tab freezes (addedpageshowfallback + visibility polling), preventing stuck reconnections with error code 3 - solves issue
General
- BUGFIX - rimraf added to ensure scripts work in different OS's
6.0.1
6.0.1
General
CHORE - Locales refreshed to the latest Home Assistant strings/hashes; locale key types updated for new tokens (e.g., any/first/last, additional device status terms).
@hakit/core
BUGFIX - HassConnect now guards all window access in suspend/resume and connection flows to avoid SSR/test crashes and ensure inherited connections/auth-callback cleanup stay safe (fixes issue)
IMPROVEMENT - Entity registry list derives domain titles via computeDomainTitle, improving labels/search without relying on locale strings.
IMPROVEMENT - Service schema/types regenerated from the latest HA: frontend.setTheme supports optional light/dark names, scene services add apply/create/delete with transitions, media/recorder constraints refreshed.
IMPROVEMENT - Humidifier entities expose target_humidity_step for finer control.
@hakit/components
- Updated modal header with option to hide the gear fab thanks to @Scoff123!
No component code changes; version bumped to align with core 6.0.1.
create-hakit
Bump to 1.2.3 to consume the latest packages - adjusted template and released changes
6.0.0
Migration Checklist
Perform these steps in order - Full details below under the BREAKING CHANGES section.
- Replace
useStoreusage where accessing helpers/state directly withuseHass(BREAKING rename). Update any imports & snapshots accordingly. - Remove deprecated
getConfig,getServices,getUser,getStatescalls. Replace with store subscriptions:useHass(state => state.config)etc, or snapshotsuseHass.getState().config. - Update
useUsershook calls: removerefetchusage; pass filtering options directly. - ButtonCard: remove
unitOfMeasurementprop. Use automatic locale formatting orcustomRenderStatefor overrides. - ButtonCard/SensorCard: if you relied on automatic domain prefix (e.g.
Light: 50%), manually add viadescriptionorcustomRenderState, or usecomputeDomainTitle. - TimeCard: if you depended on implicit entity assignment, explicitly pass entity props OR rely on new browser-time behavior.
- Locale keys changed - You may have typescript errors if referencing locale keys that no longer exist.
- Migrate any usage of removed
HassContext/HassContextProps(now merged into store). Remove direct context imports. - Adjust any code using previous area structure (
servicesremoved) as it's information that's not in use (please raise an issue if you need this data for a specific use case).
BREAKING CHANGES
@hakit/components
- BREAKING / BUGFIX - TimeCard - Fixing unexpected lag when no entity option is used, falls behind by up to 30seconds in some cases, now uses browser time directly when no entity is provided. Removed default "entity" assignment if it's available, now users will have to opt into using an entity if they want to use one (breaking change), all dates when using non entity flow are now timezone/language/locale aware using the new locale services.
- BREAKING - ButtonCard - unitOfMeasurement prop removed, now that we're formatting the same as home assistant, it will respect the users settings for units automatically, if you were using this prop, you will have to remove it and let the component handle the formatting automatically, if you still need to have a custom render state, you can use the
customRenderStateprop to provide your own custom rendering logic. - BREAKING - ButtonCard - A subtle breaking change, the automatic "domain" prefix before the state value on ButtonCards/SensorCards has been removed, this means for a light card you'll no longer see "Light: 50%", where 50% is the brightness value, this was redundant information as the Name of the entity is clearly displayed, if you still want to add this prefix back, you can either use
customRenderStateprop to provide your own logic, or you can set thedescriptionprop to include the domain name if you wish, you can import thecomputeDomainTitlehelper from@hakit/coreto help with this.
@hakit/core
- BREAKING -Refactoring all logic around locale generation, locale keys have changed, values will change as users reported a few inconsistencies with home assistant locale values, if you're using the locale services directly you may have to update some keys, all types have been updated accordingly so you should get type errors once upgrading.
- BREAKING - useHass - The methods -
getConfig,getServices,getUser,getStateshave been removed, this information is now pre-fetched, and will automatically update whenever any of the information changes, you can access this information via theuseStorehook to subscribe, and retrieve programmaticallyconst user = useStore(state => state.user);or to get a snapshotconst user = useStore.getState().user; - BREAKING - useUsers - options passed to this hook have changed,
refetchfunction has been removed, and you now just pass the filtering options directly. - BREAKING - useStore -> Deprecated and renamed to useHass, useHass functionality has been merged into useStore with methods accessible via the store directly, for example:
// OLD
const { callService } = useHass();
// NEW
const { callService } = useStore.getState().helpers;
// OLD
const { windowContext } = useHass();
// NEW
const windowContext = useStore((state) => state.windowContext);- BREAKING - HassContext, HassContextProps - Removed, and merged with UseHassStore (or HassStore if not using the hook)
- NEW/BREAKING - useAreas - now supports floors, a floor_id and a FloorRegistryEntry will be associated with an area, the breaking change is that "services" were removed from the area structure.
NEW FEATURES
@hakit/components
- NEW - LightControls - Added support for "favorites" similar to how home assistant displays, we do not have the management of favorite colors via the UI here as home assistant does.
@hakit/core
- NEW - useHistory - Updated useHistory subscriptions to match latest logic with home assistant, added new options to support numeric histories and splitting by device class.
- NEW - useLocalData - A new hook to subscribe to locale data updates from home assistant, this includes information related to formatting language, number and date formatting, the formatter api functions rely on this data to format values correctly and a wide range of helper methods are now available.
- NEW - useRegistryData - A new hook to subscribe to registry data updates from home assistant for entities, devices, areas, floors and more
- NEW - useFloors - A new hook to subscribe to floor registry data from home assistant, this will return a hierarchical list of floors and their associated areas, and the devices/entities within the areas, any areas not assigned to a floor will be part of the "Unassigned" floor.
- NEW - formatter - Convenience formatter methods to format entity states, attributes and date/time values according to the current locale and configuration, this is now accessible via the store
useStore(state => state.formatter)or programmaticallyuseStore.getState().formatter, examples added to theuseStoredocs. - NEW - computeDefaultFavoriteColors - A new function to get the default fav colors for a light if supported, as well as lightSupportsFavoriteColors function
- NEW - entityRegistryEntries now available on the store via useStore(state => state.entityRegistryEntries) or useStore().getState().entityRegistryEntries
- NEW - getExtendedEntityRegistryEntry - a new method to retrieve a single entity registry entry
- NEW - getExtendedEntityRegistryEntries - a new method to retrieve multiple entity registry entries at once
- NEW - updateEntityRegistryEntry - a new method to update an entity registry entry
- NEW - removeEntityRegistryEntry - a new method to remove an entity registry entry
- NEW - fetchEntityRegistryDisplayEntry - a new method to fetch the display entry for a single entity
- NEW - getAutomaticEntityIds - Ask Home Assistant for automatically suggested entity_ids for given IDs.
- NEW - findBatteryEntity - Find the most relevant battery entity from a list of registry display entries.
- NEW - findBatteryChargingEntity - Locate a battery charging entity (device_class === "battery_charging") in the provided list.
- NEW - createAreaRegistryEntry - A new method to create an area registry entry.
- NEW - updateAreaRegistryEntry - A new method to update an area registry entry.
- NEW - deleteAreaRegistryEntry - A new method to delete an area registry entry.
- NEW - subscribeFloorRegistry - A new method to subscribe to floor registry updates.
- NEW - updateDeviceRegistryEntry - A new method to update a device registry entry.
- NEW - removeConfigEntryFromDevice- A new method to remove a config entry from a device.
IMPROVEMENTS
@hakit/components
- IMPROVEMENT - Weather Card - Updated some styling issues and layout issues for smaller devices, moved apparent temperature to be in the weather details section automatically when available, locale updates for state values and attributes
- IMPROVEMENT - Updated multiple components to use the new locale keys
- IMPROVEMENT - ButtonCard - Updated to use new formatters to format attribute/state values correctly
@hakit/core
- updating computeStateDisplay to match home assistant logic
BUGFIXES
@hakit/components
- BUGFIX - LightControls - Fixed bugs relating to the control slider, fixed issue where brightness value wasn't aligning with the slider position and value of the entity, fixed issue where lights that don't support color, temp, brightness would not render a "switch" to control the light on/off state.
- BUGFIX - Weather Card - updated hard coded "feels like" to use "apparent temperature" locale, localizing state value
5.1.6
5.1.6
General
- Bumping core dependencies, removed a bunch of other unused dependencies
- Exported VideoPlay and hls/webrtc components for more custom usage outside of CameraCard
- Fixed bug with
npm create hakit@latestwhere the latest vite was conflicting with the post creation steps - Upgraded storybook
- Upgraded locales to match latest home assistant release
@hakit/components
- BUGFIX - MediaPlayerCard - Play media now expects a "media" object for media_content_type and media_content_id
@hakit/core
- Fixed authentication bug where it would make a duplicate request to /auth causing the first login to fail immediately
5.1.2
What's Changed
- 275 button card click causes rerender by @shannonhochkins in #279
- useTemplate updates to conditionally render templates via the hook, fixed error bugs
- renderError prop added to HassConnect
Full Changelog: 5.1.1...5.1.2
5.1.1
@hakit/components
- IMPROVEMENT - Various updates to performance in a few components by updating the zustand store to v5 from v4
- BUGFIX - TimeCard - was logging missing keys for the formatter tokens, this is now resolved
- BUGFIX / IMPROVEMENT - All Cards - The scale effect will now only be applied when the card itself is being clicked, if there's buttons with click actions within the card the scale effect will no longer scale whilst these are being tapped, whilst being tapped a class will be added to the base-card of
card-base-active - BUGFIX - MediaPlayerCard - You could open infinite modals by launching another modal by long pressing the media player card in the initial popup, this has been fixed too. The background image of the artwork that is playing is now a separate element instead of a background image on the main card.
- NEW - disableModal - A flag you can provide to call cards that support entity popups to disable the long press modal functionality and control your own functionality via the
longPressCallbackprop. - BUGFIX - CalendarCard - Fixed a bug that was causing the calendar card to re-render too many times.
- NEW - refCallback - A new method to get the ref element of the base card
- BUGFIX - TimeCard - was previously not setting keys on the fragment elements that make up the "time" value.
@hakit/core
- NEW - useUsers - a new hook to retrieve all users from the home assistant instance, this will return an array of users with their details, this is useful if you want to display a list of users in your dashboard or use it for other purposes.
- NEW - useEntities - a new hook to subscribe to multiple entities at once, this will return an array of entities that match the provided entity ids, this is useful if you want to subscribe to multiple entities at once and get their updates in real-time.
- IMPROVEMENT - useCamera - updated to support changes home assistant made back in November last year, thanks to @kdkavanagh for this one!
- IMPROVEMENT - zustand has been updated to v5, this should improve performance and reduce the amount of re-renders in the application
- IMPROVEMENT - the connection methods and re-authentication methods have received some love, the web sockets will now be automatically suspended when on an inactive tab (home assistant does this too), as well as "frozen" tabs/browsers, and will resume when the tab is active again, this should improve performance on slower devices, messages will be queued whilst inactive and will be sent when the tab is active again.
- NEW - To add to the above, from the store you can now access
connectionStatusto determine the current state of the connection viauseStore(state => state.connectionStatus), this will return a string with the current status of the connection, this is useful if you want to display a message to the user when the connection is lost or re-established, if you want to configure the suspend/resume options you can pass throughhandleResumeOptionsvia theoptionsprop onHassConnect - IMPROVEMENT - Removed some packages that are no longer needed, this should reduce the bundle size of the core package and improve performance.
- DEPRECATED - useStore().lastUpdated and useStore().setLastUpdated - these were remnants of the old store implementation, there was nothing using, or even setting this value so i've decided to remove it.
- IMPROVEMENT - Many optimisations to
useEntity, much faster updates without throttling/debouncing, however there's been some side effects to this- DEPRECATED - throttle - no longer needed as we update as often as we can
- BREAKING - home assistant has removed the "kelvin" value you can pass to set the temperature of a light entity and is replaced with
color_temp_kelvin. - BREAKING - getAllEntities - There was an unfortunate side effect of the previous store implementation where getAllEntities would automatically re-trigger a re-render of the component that was using it, the intention of this method is to grab a fresh copy of the entities at the time of the call, not trigger a re-render causing it to get new entities on every entity change, if you are using this method, you can swap it for the following:
// OLD
const { getAllEntities } = useHass();
const entities = getAllEntities();
// NEW
const { useStore } = useHass();
const entities = useStore((state) => state.entities);- NEW - renderError - a new prop you can provide to the HassConnect component to render the error message anywhere of your choice, useful to show via portals, or even just to match your applications styles.
Storybook
- Updated storybook to latest version
- Bugfix for the MediaPlayerCard, previously the "progress" bar was not displaying correctly (storybook only issue)
Dependencies
- zustand - now required v5 or higher
5.1.0
@hakit/components
- NEW - Modal position - Now positioned centered within the screen vertically
- BREAKING -
framer-motionhas been removed entirely as a core dependency, this was previously used to animate the modals and other components, most of the main animations are still supported visually, the main ones that will change are the expand/collapse scale animation from the card to the modal, Custom logic for the Group component to maintain the "expand" / "collapse" animations, Added custom scale functionality to mimic what framer-motion does with whileTap - solves issue - BREAKING -
breakpoints,setBreakpointshave been moved to the themeStore and out of @hakit/core, nothing in @hakit/core consumes or uses these values, so it makes sense to move to the components package and set via the ThemeProvider - NEW - Breakpoints can now be disabled or edited with a smaller pool of breakpoints, or no breakpoints at all, this is useful if you're using a custom theme and want to disable the breakpoints entirely, or if you want to use a smaller set of breakpoints without having to configure all of them. This has all been documented in storybook - solves issue
@hakit/core
- IMPROVEMENT - Error handling on setBreakpoints if the user provided invalid breakpoint values as values should be provided in a linear format
- PERFORMANCE - optimisation to useBreakpoint, now state will only update when any of the matches change
- BUGFIX - If switching window context dynamically, the window match logic will not work and will have to shift midway, this has been addressed
- NEW - introduced onDisconnect callback for HassConnect options
- NEW - Added retry connection functionality when the connection is lost for long running dashboards
- NEW - Locale functionality moved to it's own component to fetch these before render
- NEW - useUser - a new hook to return the current user of the dashboard logged in at the time - issue
- NEW - Updated locales to match latest home assistant release
General
- CHORE - Updated storybook to latest
- DOCS - Added documentation to related hooks and methods to retrieve a user, useUser hook exposed, and getUser method still available from useHass
- DOCS - Simplified other related docs
- DOCS - Documented custom breakpoints
5.0.9
5.0.9
@hakit/components
- NEW - TimeCard - when no time/date entity is provided, by default it will use the browsers time and date, this also uses a custom formatter to format the custom date string, previously the custom formatters only allowed you to specify strings per identifier, now you can return a ReactNode meaning we can have the same formatting behavior as if we have an entity (AM/PM suffix now wrapped in different styles.)
- BREAKING - TimeCard - Unlikely breaking change for users unless you're potentially using css selectors targeting the h4 element in time cards, the h4 element is now a span to avoid nesting h4 elements after introducing the above feature.
- IMPROVEMENT - Tooltip - A previously unknown behavior as something changed along the way, all tooltips were rendered on the page even before interacting with elements, and also continuously updating position on window resize, now tooltip elements are only created when interacting with the element with the tooltip, and removed from the dom after the interaction is complete, this should reduce the amount of elements on the page and improve performance.
@hakit/core
- useEntity - more issues with the useEntity hook causing delays in updates, the hook behind the scenes was using a debounce not a throttle which was not intended behavior, this seems to have resolved syncing issues with storybook and the actual dashboard. fixes
5.0.8
5.0.8
@hakit/components
- BUGFIX - Breakpoints - A previous release caused the breakpoint logic to break, there was also another related bug where if breakpoints were provided to the ThemeProvider, it would cause a recursive update as there was a mis-match between the internal and input objects - fixes issue
- MediaPlayerCard, ControlSliderCircular, ClimateControls, RangeSlider - all now update with the trailing edge first as these also had a similar problem to the useEntity hook mentioned below.
@hakit/core
- useEntity - issue with throttle controls acting like a delay, it will now taking the trailing/leading edge and initial updates will be immediate, default throttle time dropped from 150ms to 25ms, other components will also see a speed up in updates in the UI with this change, thanks for reporting @maumi - fixes issue
- useWeather, useLogs - also updated with incorrect throttle options
5.0.7
5.0.7
@hakit/components
- BUGFIX - CalendarCard - Logic to swap out the view only when the view prop was undefined was a bit of a premature optimization, there's now two additional props
disableNarrowanddisableAutoViewto disable the logic independently, fixes issue
@hakit/core
- No changes, alignment with components package so versions are aligned