@aurora-ds/components 1.7.12 → 1.7.14

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/cjs/index.js CHANGED
@@ -5433,11 +5433,11 @@ const HEADER_STYLES = theme.createStyles((theme) => ({
5433
5433
  * (logo, site title, navigation). Screen-readers expose it as the
5434
5434
  * `banner` landmark when it is a direct child of `<body>`.
5435
5435
  *
5436
- * @example <Header padding="md" display="flex" alignItems="center" gap="sm">…</Header>
5436
+ * @example <Header px="md" py="sm" alignItems="center" gap="sm">…</Header>
5437
5437
  * @example <Header withBorder>…</Header>
5438
5438
  */
5439
- const Header = ({ ref, style, className, children, withBorder = true, ...props }) => {
5440
- const { styleProps, restProps } = extractBoxStyleProps(props);
5439
+ const Header = ({ ref, style, className, children, withBorder = true, display = 'flex', ...props }) => {
5440
+ const { styleProps, restProps } = extractBoxStyleProps({ display, ...props });
5441
5441
  const generatedClassName = BOX_STYLES.root(styleProps);
5442
5442
  return (jsxRuntime.jsx("header", { ref: ref, className: theme.cx(generatedClassName, withBorder && HEADER_STYLES.withBorder(), className), style: style, ...restProps, children: children }));
5443
5443
  };
@@ -5668,7 +5668,7 @@ const DRAWER_STYLES = theme.createStyles((theme) => ({
5668
5668
  display: 'flex',
5669
5669
  flexDirection: 'column',
5670
5670
  width: isExpanded ? EXPANDED_DRAWER_WIDTH : COLLAPSED_DRAWER_WIDTH,
5671
- transition: `width ${theme.transition.fast}`,
5671
+ transition: `width ${theme.transition.normal}`,
5672
5672
  overflow: 'hidden',
5673
5673
  backgroundColor: theme.colors.surfacePaper,
5674
5674
  borderRight: `1px solid ${theme.colors.borderMain}`,
@@ -5864,7 +5864,7 @@ const DRAWER_ITEM_STYLES = theme.createStyles((theme) => ({
5864
5864
  outline: 'none',
5865
5865
  textDecoration: 'none',
5866
5866
  boxSizing: 'border-box',
5867
- transition: `width ${theme.transition.fast}, background-color ${theme.transition.fast}, color ${theme.transition.fast}`,
5867
+ transition: `width ${theme.transition.normal}, background-color ${theme.transition.fast}, color ${theme.transition.fast}`,
5868
5868
  whiteSpace: 'nowrap',
5869
5869
  overflow: 'hidden',
5870
5870
  height: DEFAULT_DRAWER_ITEM_SIZE,
@@ -5928,7 +5928,7 @@ const DRAWER_ITEM_STYLES = theme.createStyles((theme) => ({
5928
5928
  */
5929
5929
  const DrawerItem = ({ startIcon, label, selected = false, endContent, href, onClick, disabled = false, ariaLabel, ariaLabelledBy, ariaDescribedBy, ariaControls, ariaExpanded, ariaHasPopup, ariaCurrent, }) => {
5930
5930
  const { isExpanded } = useDrawerContext();
5931
- const { isVisible: isLabelVisible, isFadingIn: isLabelFadingIn } = useTransitionRender(isExpanded);
5931
+ const { isVisible: isLabelVisible, isFadingIn: isLabelFadingIn } = useTransitionRender(isExpanded, 200);
5932
5932
  const rootClassName = DRAWER_ITEM_STYLES.root({ selected, isExpanded });
5933
5933
  const computedAriaLabel = ariaLabel ?? (!isExpanded ? label : undefined);
5934
5934
  const computedAriaCurrent = ariaCurrent ?? (selected ? 'page' : undefined);