Release Notes

Esta página aún no está disponible en tu idioma.

This document contains release notes for the @studiocms/ui package. For more information, see the CHANGELOG file ⤴

1.2.2

#163 ⤴ 904696f ⤴ Thanks @louisescher ⤴! - Fixes custom classes on Cards overriding the default styles

1.2.1

#161 ⤴ 4217cb4 ⤴ Thanks @louisescher ⤴! - Adds support for Astro v7

1.2.0

#158 ⤴ b62de6c ⤴ Thanks @louisescher ⤴! - Adds support for Astro v6.
#158 ⤴ b62de6c ⤴ Thanks @louisescher ⤴! - Adds a new noInjectResetCSS option to disable the reset styles

1.1.2

#156 ⤴ 6efe380 ⤴ Thanks @louisescher ⤴! - Adjusts footer CSS to no longer display mobile version on devices with a 13” screen

1.1.1

#154 ⤴ 0115293 ⤴ Thanks @jellydeck ⤴! - Fixes Alert component icon, header alignment and missing virtual type declaration

1.1.0

#152 ⤴ 9b89906 ⤴ Thanks @jellydeck ⤴! - adds “Alert” component, used to display important message, tip, information and warning to the user.

1.0.1

#148 ⤴ 36d994d ⤴ Thanks @Adammatthiesen ⤴! - Fixes global window augmentation for tooltips (no user-facing changes, just better types!)
#150 ⤴ c7e6f2d ⤴ Thanks @louisescher ⤴! - Removes a leftover TODO comment

1.0.0

#85 ⤴ a7e37a5 ⤴ Thanks @louisescher ⤴! - Moves the following helpers into their own virtual modules:
- studiocms:ui/components/toaster/client - toast
- studiocms:ui/components/modal/client - ModalHelper
- studiocms:ui/components/dropdown/client - DropdownHelper
- studiocms:ui/components/progress/client - ProgressHelper
- studiocms:ui/components/sidebar/client - SingleSidebarHelper, DoubleSidebarHelper
There is also a new studiocms:ui/components/client joined module that contains all the above component helpers.
#85 ⤴ a7e37a5 ⤴ Thanks @louisescher ⤴! - Update Icon component to utilize all iconifyJSON icons that have been passed through into the config

Breaking Changes
Section titled “Breaking Changes”
- Default Icon names are now prefixed with heroicons: instead of just the icons name. This allows user-defined icons to be used without conflicting with the pre-shipped icons.
#85 ⤴ a7e37a5 ⤴ Thanks @louisescher ⤴! - Colors have been adjusted to look better for all components. Badge variants now default to “outlined” and the “default” value has been deprecated. The deprecation was due to the badges failing WGAG AAA guidelines. All projects using the “default” variant should be updated to use “outlined” instead.
#85 ⤴ a7e37a5 ⤴ Thanks @louisescher ⤴! - Introduce individual component virtual exports alongside the bundled barrel virtual export 'studiocms:ui/components'

You can now import for example Button component from studiocms:ui/components/button
#85 ⤴ a7e37a5 ⤴ Thanks @louisescher ⤴! - Updates the Tabs components to optionally use a custom ID
#85 ⤴ a7e37a5 ⤴ Thanks @louisescher ⤴! - Migrate from injected types to ambient types for static virtual modules
#85 ⤴ a7e37a5 ⤴ Thanks @louisescher ⤴! - Adds a skeleton loading state component
#85 ⤴ a7e37a5 ⤴ Thanks @louisescher ⤴! - Removes ThemeToggle as it was causing a error when added to the virtual module, it is now recommended to use the ThemeHelper directly
#85 ⤴ a7e37a5 ⤴ Thanks @louisescher ⤴! - Refactors the select components into web components
#85 ⤴ a7e37a5 ⤴ Thanks @louisescher ⤴! - Changes the inputs icon color to var(—text-muted)
#85 ⤴ a7e37a5 ⤴ Thanks @louisescher ⤴! - Fixes #91, alert type is respected and shows appropriate colors
#85 ⤴ a7e37a5 ⤴ Thanks @louisescher ⤴! - Fixes the focus outline of buttons within groups sometimes being hidden behind other buttons in the same group.
#85 ⤴ a7e37a5 ⤴ Thanks @louisescher ⤴! - Fixes toggle colors, adds new “gray” color for toggle circles, and adds a light variant for the default flat colors.
#85 ⤴ a7e37a5 ⤴ Thanks @louisescher ⤴! - Fixes Select components UI bug, where list items had no background and showed bullet points
#85 ⤴ a7e37a5 ⤴ Thanks @louisescher ⤴! - - Refactored the accordion component so it works with the Tabs component, and with nested accordions
- Refactored the Tabs component to support nested tabs
- Added a new active prop to the Tabs component to set the initial active tab
#85 ⤴ a7e37a5 ⤴ Thanks @louisescher ⤴! - Fixes an issue where the toaster HTML Element would have an unnecessary comma attribute due to a typo.
#85 ⤴ a7e37a5 ⤴ Thanks @louisescher ⤴! - Changes the way colors are declared to allow for a better customization experience.

Before, we would use raw HSL values in order to be able to modify them later on:
```
:root {
  --background-base: 0 0% 6%;
}
```
This introduces an unnecessary hurdle to customization, since most other libraries ship with either their own color values and spaces or a different approach entirely. Thus, the goal of this PR is to replace this approach with a simpler one. We will now default to HSL functions instead of the raw values:
```
:root {
  --background-base: hsl(0 0% 6%);
}
```
Migrating from this can be a little tedious if the old system was used in custom components. You can use this regular expression with VSCode’s (or any other IDE’s) search & replace feature to replace all instances of the old syntax with the new:

Search Value: hsl[a]?$(var\([A-Za-z-\d]+$)\) Replace Value: $1

Please make sure to manually search for hsl(var( and hsla(var( after running the above to make sure all previous values have been replaced.
#85 ⤴ a7e37a5 ⤴ Thanks @louisescher ⤴! - Fixes buttons within dropdowns not displaying properly within a group
#85 ⤴ a7e37a5 ⤴ Thanks @louisescher ⤴! - adds the tooltip component
#85 ⤴ a7e37a5 ⤴ Thanks @louisescher ⤴! - Adds optional icons and help texts to inputs
#85 ⤴ a7e37a5 ⤴ Thanks @louisescher ⤴! - Improve icon handling and processing, allowing icon sets defined in the config to also use - in their name (e.g. ‘simple-icons’)
#85 ⤴ a7e37a5 ⤴ Thanks @louisescher ⤴! - Fixed undeclared css variables for flat button style
#85 ⤴ a7e37a5 ⤴ Thanks @louisescher ⤴! - Fixes ambient type declarations
#85 ⤴ a7e37a5 ⤴ Thanks @louisescher ⤴! - Adds StudioCMS Typography using a .prose class
#85 ⤴ a7e37a5 ⤴ Thanks @louisescher ⤴! - Adds a missing background color to modals

1.0.0-beta.6

#140 ⤴ e70e8b4 ⤴ Thanks @louisescher ⤴! - Adds a missing background color to modals

1.0.0-beta.5

#136 ⤴ 4cdc396 ⤴ Thanks @louisescher ⤴! - Refactors the select components into web components
#138 ⤴ deec8e5 ⤴ Thanks @louisescher ⤴! - Changes the inputs icon color to var(—text-muted)

1.0.0-beta.4

#137 ⤴ dee51eb ⤴ Thanks @Adammatthiesen ⤴! - Moves the following helpers into their own virtual modules:
- studiocms:ui/components/toaster/client - toast
- studiocms:ui/components/modal/client - ModalHelper
- studiocms:ui/components/dropdown/client - DropdownHelper
- studiocms:ui/components/progress/client - ProgressHelper
- studiocms:ui/components/sidebar/client - SingleSidebarHelper, DoubleSidebarHelper
There is also a new studiocms:ui/components/client joined module that contains all the above component helpers.
#133 ⤴ 8e2172d ⤴ Thanks @RATIU5 ⤴! - Fixed undeclared css variables for flat button style

1.0.0-beta.3

#130 ⤴ 57f900d ⤴ Thanks @RATIU5 ⤴! - Fixes toggle colors, adds new “gray” color for toggle circles, and adds a light variant for the default flat colors.

1.0.0-beta.2

#125 ⤴ 9473be8 ⤴ Thanks @RATIU5 ⤴! - Colors have been adjusted to look better for all components. Badge variants now default to “outlined” and the “default” value has been deprecated. The deprecation was due to the badges failing WGAG AAA guidelines. All projects using the “default” variant should be updated to use “outlined” instead.
#118 ⤴ 1779190 ⤴ Thanks @RATIU5 ⤴! - Updates the Tabs components to optionally use a custom ID
#119 ⤴ 6bdc0ee ⤴ Thanks @louisescher ⤴! - Fixes an issue where the toaster HTML Element would have an unnecessary comma attribute due to a typo.
#124 ⤴ 8a2f606 ⤴ Thanks @Adammatthiesen ⤴! - Improve icon handling and processing, allowing icon sets defined in the config to also use - in their name (e.g. ‘simple-icons’)

1.0.0-beta.1

#110 ⤴ 8bb4637 ⤴ Thanks @louisescher ⤴! - Fixes the focus outline of buttons within groups sometimes being hidden behind other buttons in the same group.
#112 ⤴ ba10776 ⤴ Thanks @louisescher ⤴! - Fixes buttons within dropdowns not displaying properly within a group
#111 ⤴ f2fc787 ⤴ Thanks @louisescher ⤴! - Adds optional icons and help texts to inputs

1.0.0-beta.0

#88 ⤴ b96fe4d ⤴ Thanks @Adammatthiesen ⤴! - Update Icon component to utilize all iconifyJSON icons that have been passed through into the config

Breaking Changes
Section titled “Breaking Changes”
- Default Icon names are now prefixed with heroicons: instead of just the icons name. This allows user-defined icons to be used without conflicting with the pre-shipped icons.
#106 ⤴ 613830e ⤴ Thanks @Adammatthiesen ⤴! - Introduce individual component virtual exports alongside the bundled barrel virtual export 'studiocms:ui/components'

You can now import for example Button component from studiocms:ui/components/button
#89 ⤴ ce1f6fc ⤴ Thanks @Adammatthiesen ⤴! - Migrate from injected types to ambient types for static virtual modules
#86 ⤴ 63e3b9e ⤴ Thanks @RATIU5 ⤴! - Adds a skeleton loading state component
#87 ⤴ 80d1970 ⤴ Thanks @Adammatthiesen ⤴! - Removes ThemeToggle as it was causing a error when added to the virtual module, it is now recommended to use the ThemeHelper directly
#92 ⤴ bd47caf ⤴ Thanks @RATIU5 ⤴! - Fixes #91, alert type is respected and shows appropriate colors
#103 ⤴ 111e685 ⤴ Thanks @RATIU5 ⤴! - Fixes Select components UI bug, where list items had no background and showed bullet points
#104 ⤴ f708d9d ⤴ Thanks @RATIU5 ⤴! - - Refactored the accordion component so it works with the Tabs component, and with nested accordions
- Refactored the Tabs component to support nested tabs
- Added a new active prop to the Tabs component to set the initial active tab
#96 ⤴ ddf67da ⤴ Thanks @louisescher ⤴! - Changes the way colors are declared to allow for a better customization experience.

Before, we would use raw HSL values in order to be able to modify them later on:
```
:root {
  --background-base: 0 0% 6%;
}
```
This introduces an unnecessary hurdle to customization, since most other libraries ship with either their own color values and spaces or a different approach entirely. Thus, the goal of this PR is to replace this approach with a simpler one. We will now default to HSL functions instead of the raw values:
```
:root {
  --background-base: hsl(0 0% 6%);
}
```
Migrating from this can be a little tedious if the old system was used in custom components. You can use this regular expression with VSCode’s (or any other IDE’s) search & replace feature to replace all instances of the old syntax with the new:

Search Value: hsl[a]?$(var\([A-Za-z-\d]+$)\) Replace Value: $1

Please make sure to manually search for hsl(var( and hsla(var( after running the above to make sure all previous values have been replaced.
#101 ⤴ 12eba39 ⤴ Thanks @RATIU5 ⤴! - adds the tooltip component
#93 ⤴ bb5ab5a ⤴ Thanks @RATIU5 ⤴! - Adds StudioCMS Typography using a .prose class

0.4.17

#94 ⤴ 2b89d92 ⤴ Thanks @RATIU5 ⤴! - prevents overflow select dropdowns with a scrollable container and enables toggling the dropdown via svg icon click

0.4.16

#83 ⤴ 9fc5efb ⤴ Thanks @louisescher ⤴! - Fixes selects not being form compatible

0.4.15

#81 ⤴ cbee510 ⤴ Thanks @RATIU5 ⤴! - fixes select interfaces and types and adds safety check to prevent duplicate event listeners

0.4.14

#78 ⤴ c27bf16 ⤴ Thanks @louisescher ⤴! - Fixes mismatched IDs in the CSS for the double sidebar component

0.4.13

#67 ⤴ ad073b3 ⤴ Thanks @RATIU5 ⤴! - Adds multi-select functionality on the select component

0.4.12

#72 ⤴ f183732 ⤴ Thanks @louisescher ⤴! - Fixes a z-index for starlight variant tabs being too great

0.4.11

#69 ⤴ ef29352 ⤴ Thanks @louisescher ⤴! - Fixes broken styles for flat success buttons in light mode and starlight tabs when used in cards

0.4.10

#63 ⤴ dc7b723 ⤴ Thanks @Adammatthiesen ⤴! - Adds a value prop to the checkbox

0.4.9

#61 ⤴ 59f4c05 ⤴ Thanks @louisescher ⤴! - Fixes card footers to be hidden should they have no content

0.4.8

#59 ⤴ f71057d ⤴ Thanks @Adammatthiesen ⤴! - Add viewbox attribute for IconBase component

0.4.7

#56 ⤴ 40ae2ea ⤴ Thanks @Adammatthiesen ⤴! - Add option to disable global CSS injection and allow users to import the global css themselves.

Basic Example of how to import:
```
---
import "studiocms:ui/global-css";
---
```

0.4.6

#52 ⤴ 65eea2c ⤴ Thanks @Adammatthiesen ⤴! - Update Input component to allow search type

0.4.5

#50 ⤴ 51d5565 ⤴ Thanks @Adammatthiesen ⤴! - fix weird icon sizing during build

0.4.4

#48 ⤴ 4a43e03 ⤴ Thanks @Adammatthiesen ⤴! - Fix Icon component requiring functions from Iconify Utils lib during runtime as well as extend usage possibilities.

NEW:
- IconBase component exported from studiocms:ui/components which allows passing custom image collections from Iconify.
Updated:
- Icon component to use this new system.

0.4.3

#46 ⤴ 29ea967 ⤴ Thanks @louisescher ⤴! - Fixes icons getting cut off in certain circumstances and changes dropdown links to include icons

0.4.2

#44 ⤴ 99a2f79 ⤴ Thanks @louisescher ⤴! - Fixes compatibility issues with Astro view transitions

0.4.1

#40 ⤴ 641e4b0 ⤴ Thanks @Adammatthiesen ⤴! - Update publish config and files included

0.4.0

#36 ⤴ 07e2d9e ⤴ Thanks @louisescher ⤴! - Implement Build step and migrate all exported components into virtual modules

Instead of @studiocms/ui/components use studiocms:ui/components

For more information see https://ui.studiocms.dev ⤴
#36 ⤴ 07e2d9e ⤴ Thanks @louisescher ⤴! - Add a few new components:
- Accordion
- Badge
- Breadcrumbs
- Group
- Progress
- Sidebar
Add two new colors
- info (Blue)
- monochrome (Black/White)
Add the ability to pass a CSS file for customization of all colors

0.3.2

#33 ⤴ 58e223c ⤴ Thanks @louisescher ⤴! - Fix tabs not being displayed correctly & dividers displaying backgrounds for empty slots

0.3.1

#27 ⤴ 6b0b58f ⤴ Thanks @louisescher ⤴! - Add pathe as a dependency to deal with path issues on Windows

0.3.0

#18 ⤴ e471e11 ⤴ Thanks @louisescher ⤴! - The Accessibility Update

This version of @studiocms/ui includes a lot of improvements to the documentation and components. The most important changes include the move to an integration-based system and a massive keyboard accessibility overhaul (thanks to HiDeoo ⤴ for the feedback on this)!

Components
Section titled “Components”
- Added a new <Tabs /> component based on the tabs on the homepage.
- Updated the <Card /> component to include a new “filled” style.
Utilities
Section titled “Utilities”
- Moved the ThemeHelper class to its own category in the docs.
Accessibility
Section titled “Accessibility”
- Overhauled the keyboard accessibility on all components to make them adhere to the ARIA standards.

0.1.0

#1 ⤴ 14be139 ⤴ Thanks @Adammatthiesen ⤴! - Added a new footer component, made accessibility improvements and preparations for first stable release
#1 ⤴ 14be139 ⤴ Thanks @Adammatthiesen ⤴! - - Update <Input /> component’s available types
#1 ⤴ 14be139 ⤴ Thanks @Adammatthiesen ⤴! - Added a new searchable select component and improved accessibility for normal selects
#1 ⤴ 14be139 ⤴ Thanks @Adammatthiesen ⤴! - Created new UI Library in preparations for the new StudioCMS Dashboard project
#1 ⤴ 14be139 ⤴ Thanks @Adammatthiesen ⤴! - Added a theme helper and theme toggle component
#1 ⤴ 14be139 ⤴ Thanks @Adammatthiesen ⤴! - Adjusted persistent toasts to include an outline for better visibility

0.0.1

Initial Testing release

Release Notes

1.2.2

1.2.1

1.2.0

1.1.2

1.1.1

1.1.0

1.0.1

1.0.0

Breaking Changes

1.0.0-beta.6

1.0.0-beta.5

1.0.0-beta.4

1.0.0-beta.3

1.0.0-beta.2

1.0.0-beta.1

1.0.0-beta.0

Breaking Changes

0.4.17

0.4.16

0.4.15

0.4.14

0.4.13

0.4.12

0.4.11

0.4.10

0.4.9

0.4.8

0.4.7

0.4.6

0.4.5

0.4.4

0.4.3

0.4.2

0.4.1

0.4.0

0.3.2

0.3.1

0.3.0

Components

Utilities

Accessibility

0.1.0

0.0.1