QUI React

@qui/base

2.39.2

May 25th, 2025

  • fix (q-form-field): removed text cursor from elements that were not input fields.

2.39.1

April 21st, 2025

  • fix (FilterTree): add reverse order support for expand icon.

2.39.0

February 19th, 2025

  • feat (q-stepper): Deprecated QStepperOrientation, QStepOrientation, QStepStatus, and QStepLayout types in favor of new StepOrientation, StepStatus, and StepLayout types.
  • feat (direction): Added new Direction and Orientation types along with DirectionProperty and OrientationProperty interfaces.
  • feat (part): Introduced new PartProps interface that includes data-part and data-scope properties.
  • dev: Updated the index file to export new direction and part type definitions.

2.38.0

February 11th, 2025

  • feat (ProgressBar): Add utility functions for progress state determination
  • feat (ProgressBar): Add 'ProgressState' type

2.37.0

February 7th, 2025

  • feat (DataAttr): added dataAttr utility function.
  • feat (Booleanish): added Booleanish utility type.
  • feat (Combobox): added ComboboxValueChangeReason type.
  • feat (Notification): added NotificationOrigin, NotificationPlacement, NotificationColor types and deprecated corresponding Q-prefixed types.
  • feat (OverlayPanel): added OverlayPanelPlacement, OverlayPanelPosition, OverlayPanelOffset types and deprecated corresponding Q-prefixed types.
  • feat (Pagination): added PaginationPageChangeReason type.
  • feat (Tabs): added TabSize, TabBaseProps, TabsOrientation, TabsAlignment, TabsAccent, TabChangeReason types and deprecated corresponding Q-prefixed types.
  • feat (Transition): added TransitionState, AnimationEasing, AnimationDuration types and deprecated corresponding Q-prefixed types.
  • dev: updated tsconfig.json to include files and references entries.
  • dev: created new tsconfig.vite.json with composite enabled.

2.36.1

January 24th, 2025

  • fix (QOverlayPanelPopupClasses): added back missing export.

2.36.0

January 23rd, 2025

  • deprecated all Q* classes and utilities in favor of their camelCase named equivalents. These have also been changed from classes with static members to constant objects. Examples:
    • A class named QComboboxClasses is now an exported constant named comboboxClasses.
    • A class named QComboboxUtils is now an exported constant named comboboxUtils.
  • fix (resolveTransitionDuration): fixed an issue that was preventing numeric string parameters from being resolved into numbers.

2.35.0

January 14th, 2025

  • feat (QCombobox): removed explicit min-height CSS for options. The height for default combobox options is unchanged. The height for larger items is now determined dynamically based on the size of the content.
  • feat (QCombobox): removed unused css.

2.34.2

January 12th, 2025

  • fix (QBadge): border-radius adjusted to 1px for text and icon variants.

2.34.1

January 12th, 2025

  • fix (QCheckbox): adjusted checkbox border-radius to 1px.

2.34.0

January 10th, 2025

  • feat (QDialog): added closeOnOutsideClick property.

2.33.1

January 9th, 2025

  • chore (QPaginationClasses): converted to object from class.

2.33.0

December 29th, 2024

  • feat (LazyMode): added lazy rendering utilities and types.

2.32.2

December 22nd, 2024

  • fix (QDialog): fixed JSDoc parameter comment for onOutsideClick method.

2.32.1

December 9th, 2024

  • fix (input styles): the shared input style for hidden inputs, like those on the switch, radio, checkbox, etc., have been modified for better accessibility.

2.32.0

November 27th, 2024

  • feat (DescendantsManager): the disableItem function parameter has been expanded to accept an HTML element.

2.31.1

October 22nd, 2024

  • fix (QSideNavigationItem): Collapsed separator style adjustments to match QDS.
  • fix (QSideNavigation): Adjust max-width and min-width when collapsed to match QDS.
  • fix (QSideNavigation): CSS class adjustments to account for simplified collapse button implementation.

2.31.0

September 18th, 2024

  • feat (QTable): added QTableSize type alias.
  • fix (QTable): the table header row now renders with the correct background color.
  • fix (QTable): the table header cells now render with the correct font weight.

2.30.3

August 24th, 2024

  • fix (QStepper): removed background color change for step separators.

2.30.2

August 20th, 2024

  • fix (QSlider): reverted tooltip arrow CSS regression.

2.30.1

August 15th, 2024

  • fix (QTextArea): the label style now matches QDS 2.0.

2.30.0

August 8th, 2024

  • feat (QStepper): added classes for 5 new statuses.

2.29.0

July 25th, 2024

  • feat (QSlider): added classes to shared utilities.
  • fix: added missing q-fade class.

2.28.2

July 10th, 2024

  • Loosened the peer dependencies for @qui packages.

2.28.1

July 9th, 2024

  • dev: updated tsconfigs.

2.28.0

June 27th, 2024

  • feat: public interfaces now use the @public JSDoc tag instead of the custom @group docs tag.

2.27.4

June 23rd, 2024

  • fix (QHeader): the height has been adjusted down from 61px to 48px to match QDS styles (removed vertical padding).
  • fix (QHeader): vertically oriented q-divider separators are now centered with a height of 24px to match QDS styles.

2.27.3

June 12th, 2024

  • fix (QButton/QIconButton): the negative variant's text color has been adjusted to match QDS 2.0 styles.

2.27.2

May 30th, 2024

  • bugfix (QTooltip): default max-width is now 200px.
  • bugfix (QTooltip): added missing box-shadow style.

2.27.1

May 30th, 2024

  • bugfix (QNotification): increased specificity of the CSS targeting the close-icon element to prevent conflicts.
  • bugfix (QTooltip): adjusted border radius to match QDS.

2.27.0

May 29th, 2024

  • feat: added escapeStringRegexp utility function. Escapes a string to make it safe for regexp functions.
  • feat: added QuiTheme utility type.

2.26.2

May 26th, 2024

  • Update dependencies: @qui/css-utils

2.26.1

May 22nd, 2024

  • dev: scripts update.

2.26.0

May 22nd, 2024

  • dev: Upgraded vite to v5.
  • Changed package type to module.
  • The CommonJS export is now index.cjs, and the ESM export is now index.js.

2.25.0

May 9th, 2024

  • feat (QInlineAlert): added className spread args for the root element.
  • feat (QPopover): updated typography classes.

2.24.0

May 4th, 2024

  • feat (Stepper): added utility classes.

2.23.0

April 12th, 2024

  • feat (QDialog): added more styles to q-dialog--modal class.

2.22.1

April 9th, 2024

  • fix (DescendantsManager): no longer emits an error to the dev console in SSR.

2.22.0

April 9th, 2024

  • feat: moved DescendantsManager class from @qui/react to this package for use in other libs.

2.21.0

April 5th, 2024

  • feat (QSlider): added missing utility classes.

2.20.0

April 4th, 2024

  • feat: added styles and utility classes for the QSlider component.

2.19.2

March 29th, 2024

  • fix (QTable): removed invalid CSS selector.
  • Removed devDependencies and scripts from published package.json.

2.19.1

March 26th, 2024

  • fix (QSkeleton): added the missing number union type from height and width properties.

2.19.0

March 19th, 2024

  • feat (QCombobox): the options input can now be an array of strings.
    • Updated many utility types to account for this change.

2.18.1

March 11th, 2024

  • Fixed ESLint errors from the prettier v3 update.

2.18.0

March 5th, 2024

  • feat (QSkeleton): Added styles and utilities.

2.17.1

March 3rd, 2024

  • Tooltip arrow CSS fixes.

2.17.0

February 29th, 2024

  • Adjusted Card styles to account for new React functionality.
  • Replaced all font properties with new font shorthand properties from @qui/styles.

2.16.2

February 26th, 2024

  • The Accordion's default background color is now governed by the --q-accordion-background variable. The value that this points to is identical to the previous variable. This approach lets the user customize the background of individual accordions more easily.
  • Fixed a bug that was causing the Side Navigation's expanded chevron to reverse.
  • Adjusted the Stepper Content CSS: the label/description will now be centered vertically in row layout.

2.16.1

February 26th, 2024

  • Fixed the font of the Stepper's counter. The intended font variable is now applied as expected.

2.16.0

February 22nd, 2024

  • Updated Badge CSS to support rendering both an icon and text at once when kind is text.
  • Added a new type alias: QBadgeIconPlacement.

2.15.1

February 15th, 2024

  • Adjusted dialog classes for improved merging capabilities.

2.15.0

February 9th, 2024

  • Added styles, types, and utility classes for the Stepper component. Note: this component is slightly different from our existing Steps component, but features a better interface and more customization. The old Steps component will be deprecated once the equivalent Angular Stepper component has been built.

2.14.2

February 6th, 2024

  • QIcon ClassNames interface adjustment for JSDoc formatting.

2.14.1

February 4th, 2024

  • Changes were made to the Accordion class and shared utilities for support of the React accordion component.

2.14.0

February 1st, 2024

  • Removed color transitions from the Tabs component styles. These were occasionally causing a pop-in effect on the component's initial render.
  • Added table element styles and utilities classes.

2.13.1

January 26th, 2024

  • Added CSS fixes for every input element for Firefox compatibility. The following elements were fixed:
    • <q-checkbox>
    • <q-menu-item>
    • <q-number-input>
    • <q-radio>
    • <q-text-area>
    • <q-text-input>

2.13.0

January 20th, 2024

  • Adjusted pagination utilities for better React support.
  • Added shared pagination utilities for consistent functionality between packages.
  • Added TSDoc tags to some input properties to enable linking from properties tables.

2.12.0

January 9th, 2024

  • Removed clsx from peerDependencies.
  • clsx is now internal to this package.
  • The border color of text and number inputs will no longer flash on initial load.

2.11.0

January 4th, 2024

  • Updated the list class utilities to allow for passing additional class arguments.

2.10.2

December 20th, 2023

  • Fixed an issue with the Progress Bar types that was causing the 'react' reference type to be included in the built type definitions.

2.10.1

December 19th, 2023

  • Added breadcrumb item separator class.
  • CSS transitions will now only apply on interaction for the following components:
    • Button
    • Icon Button
    • Link
    • Switch
    • Tag

2.10.0

December 19th, 2023

  • Corrected the switch layout in full width mode.
  • The rankings export from the matchSorter utility is now deprecated in favor of the Rankings enum which provides the exact same functionality, but better.

2.9.5

November 20th, 2023

  • Adjusted q-side-navigation--root min-width to match specs.

2.9.4

November 20th, 2023

  • Narrowed the QCombobox Option generic type parameter for clarity.

2.9.3

November 16th, 2023

  • Modified the q-breadcrumbs classes to support React props spreading.

2.9.2

November 14th, 2023

  • Modified the q-progress-bar classes to support React props spreading.

2.9.1

November 9th, 2023

  • Added QComboboxAutoComplete type.

2.9.0

November 3rd, 2023

  • Added boolean to union parameter type of isDefined.
  • Added scrollIntoView function for computing the scrolling required to keep an element in view.

2.8.0

October 30th, 2023

  • Removed custom styles from textarea scrollbars. These now default to the browser and OS native scrollbars.
  • Updated tabs CSS classes to support new alignment property. This property applies the same behavior as the previous verticalTabPlacement property, but also applies to horizontal tabs. The verticalTabPlacement property has been deprecated.

2.7.0

October 6th, 2023

  • Better JSDoc types.

2.6.0

October 3rd, 2023

  • Updated q-tag focus border styles to match QDS. The focused border now uses an inset box-shadow instead of an outline.
  • Added QComboboxBaseInput interface with common properties for Angular/React.
  • Added QComboboxUtils class with shared utilities for Angular/React.
  • Added a min-width of 15px to the combobox's input wrapper class.
  • Adjusted combobox menu hover and focus styles to better match QDS's menu. Previously, these matched the side navigation. The menu makes more sense.

2.5.1

September 21st, 2023

  • Added more functionality to the shared Progress Circle utilities.
  • Adjusted many JSDoc comments for consistency.

2.5.0

September 16th, 2023

  • Adjustments and changes for React Dialog.

2.4.1

September 10th, 2023

  • Fixed notification label/description alignment.

2.4.0

September 10th, 2023

  • Added default props for the QAvatar, QOverlayPanel, and QTooltip components.

2.3.0

September 6th, 2023

  • Added supporting classes, types, and styles for the Filter Tree component.

2.2.0

August 21st, 2023

  • The Progress Bar and Progress Circle components now accept a color attribute which can be used to change the filled color of each component.

2.1.1

August 20th, 2023

  • Added customizable type input for q-text-input.

2.1.0

August 20th, 2023

  • Updated neutral color palette to match the updated QDS 2.0 designs. Since this only changes the values of the colors, it is not a breaking change. The difference is also minimal.
  • Added the active input to the QBreadcrumbItem interface. When supplied, the breadcrumb item will render with an emphasized text color to indicate that the item is active.

2.0.0

  • Removed deprecated code in accordance with @qui/angular v2.0 release.

1.0.1

  • Progress Circle
    • Fixed a rare issue that was causing the indeterminate animation to appear with a visual artifact in the first 500ms of rendering.

1.0.0

Added styles, types, and utility classes for the following components:

  • Card
  • Combobox
  • Header

0.11.0

Added styles, types, and utility classes for the following components:

  • Button Group
  • Steps

0.10.0

Added styles, types, and utility classes for the following components:

  • Link
  • Popover

Changes:

  • Overlay Panel zIndex moved to component.

0.9.1

Patch Changes

  • patch

0.9.0

June 16, 2023

Added styles, types, and utility classes for the following components:

  • Alert Banner: shows pressing and high-signal messages, such as system alerts.
  • Breadcrumbs: a navigation tool that shows users where they are on a website and how to get back to previous pages.
  • Dropdown: Allows the user to choose from a list of options in a limited space.
  • List: continuous, vertical indices of text or images. Similar to the menu.
  • Progress Circle: also known as a loading spinner.
  • Side Navigation: lets users navigate the entire content of a product or a section. It's made up of links, icons, expandable sections, and more.
  • Switch: input component for toggling a single option on or off.

Adjusted some component styles to align with the updated QDS 2.0 designs.

0.8.1

June 1st, 2023

  • The tooltip now supports fixed positioning.
  • The Menu Item's pointer-events style is now set to none when disabled.

0.8.0

May 31st, 2023

  • Avatar: added CSS, utility classes, and types.
  • Text Area: added CSS, utility classes, and types.
  • Simplified q-expand CSS classes.

0.7.4

May 25th, 2023

  • Slight adjustment to Overlay Panel classes.

0.7.3

May 18th, 2023

  • Added optional fixed position to overlay panel popup component styles.

0.7.2

May 16th, 2023

  • Added and adjusted q-tabs classes to reflect the q-tabs component's new fullWidth, fullHeight, and verticalTabPlacement properties.

0.7.1

Patch Changes

  • Added the Pagination component's CSS, types, and utility class.
  • Added Select classNames configuration.

0.7.0

  • Added CSS, types, and utility classes for the following components:
    • Form Field Base
    • Select
    • Sidebar
  • Text Input: Changed the prefix of most of the text-input's CSS classes from q-text-field-- to q-form-field-- to reflect the new base directive. Refer to the CSS documentation for details.

0.6.2

  • Removed global button css in favor of per-component css.

The following css has been removed:

button,
[type="button"],
[type="reset"],
[type="submit"] {
background-color: transparent;
-webkit-appearance: button;
background-image: none;
}

0.6.1

  • Adjusted Button/Icon Button CSS: replaced focus-visible padding/border width adjustments with a 1px outline.

0.6.0

Added CSS, types, and utility classes for the following components:

  • Checkbox
  • Dialog
  • Progress Bar
  • Status
  • Tag

0.5.2

April 14, 2023

  • Removed a CSS rule that was preventing the tab panel content from taking up the full width of the tabs root container.

0.5.1

April 10, 2023

  • Fixed a bug which was preventing the q-button directive's icons from receiving the appropriate size classes.

0.5.0

April 7, 2023

  • The Notification styles and classes have been reworked.
  • Changed QAlertSeverity to QAlertColor
  • Deprecated QAlertColor 'information' category.
  • Implemented tabs, accordion, inline-alert, and divider styles, types, and classes.

0.4.1

March 24, 2023

  • Updated CSS class name utilities.

0.4.0

March 24, 2023

  • Many styles have changed in accordance with QDS 2.0.
  • Added Inline Badge component styles.
  • Changed Toast to notification.
  • The Button, Icon Button, and Notification’s status colors have changed:
    • default is now neutral
    • success is now positive
    • error is now negative
  • The extra-large (xl) size has been removed from the Button and Icon Button components.
  • The extra-small (xs) size has been removed from the Text Input component.

0.3.1

March 14th, 2023

  • Added missing Toast CSS.

0.3.0

  • Renamed dropdown to overlay-panel, added styles.
  • Added icon styles, types, and utils.
  • Modified pre-existing button icon styles to account for consolidated icon styles.
  • Added menu styles, types, and utils.
  • Added text-input styles, types, and utils.
  • Added and tweaked some transition animations.

0.2.1

March 05, 2023

  • Added expand, dropdown classes.
  • Added dropdown utilities and types.

0.2.0

February 27, 2023

  • Added button styles, types, and utils.
  • Added icon-button styles, types, and utils.
  • Added expand styles, types, and utils.
  • Added link styles, types, and utils.
  • Added tabs styles, types, and utils (still WIP).
  • Added tooltip styles, types, and utils.
  • Added toast styles, types, and utils.