@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/esm/index.js CHANGED
@@ -5413,11 +5413,11 @@ const HEADER_STYLES = createStyles((theme) => ({
5413
5413
  * (logo, site title, navigation). Screen-readers expose it as the
5414
5414
  * `banner` landmark when it is a direct child of `<body>`.
5415
5415
  *
5416
- * @example <Header padding="md" display="flex" alignItems="center" gap="sm">…</Header>
5416
+ * @example <Header px="md" py="sm" alignItems="center" gap="sm">…</Header>
5417
5417
  * @example <Header withBorder>…</Header>
5418
5418
  */
5419
- const Header = ({ ref, style, className, children, withBorder = true, ...props }) => {
5420
- const { styleProps, restProps } = extractBoxStyleProps(props);
5419
+ const Header = ({ ref, style, className, children, withBorder = true, display = 'flex', ...props }) => {
5420
+ const { styleProps, restProps } = extractBoxStyleProps({ display, ...props });
5421
5421
  const generatedClassName = BOX_STYLES.root(styleProps);
5422
5422
  return (jsx("header", { ref: ref, className: cx(generatedClassName, withBorder && HEADER_STYLES.withBorder(), className), style: style, ...restProps, children: children }));
5423
5423
  };
@@ -5648,7 +5648,7 @@ const DRAWER_STYLES = createStyles((theme) => ({
5648
5648
  display: 'flex',
5649
5649
  flexDirection: 'column',
5650
5650
  width: isExpanded ? EXPANDED_DRAWER_WIDTH : COLLAPSED_DRAWER_WIDTH,
5651
- transition: `width ${theme.transition.fast}`,
5651
+ transition: `width ${theme.transition.normal}`,
5652
5652
  overflow: 'hidden',
5653
5653
  backgroundColor: theme.colors.surfacePaper,
5654
5654
  borderRight: `1px solid ${theme.colors.borderMain}`,
@@ -5844,7 +5844,7 @@ const DRAWER_ITEM_STYLES = createStyles((theme) => ({
5844
5844
  outline: 'none',
5845
5845
  textDecoration: 'none',
5846
5846
  boxSizing: 'border-box',
5847
- transition: `width ${theme.transition.fast}, background-color ${theme.transition.fast}, color ${theme.transition.fast}`,
5847
+ transition: `width ${theme.transition.normal}, background-color ${theme.transition.fast}, color ${theme.transition.fast}`,
5848
5848
  whiteSpace: 'nowrap',
5849
5849
  overflow: 'hidden',
5850
5850
  height: DEFAULT_DRAWER_ITEM_SIZE,
@@ -5908,7 +5908,7 @@ const DRAWER_ITEM_STYLES = createStyles((theme) => ({
5908
5908
  */
5909
5909
  const DrawerItem = ({ startIcon, label, selected = false, endContent, href, onClick, disabled = false, ariaLabel, ariaLabelledBy, ariaDescribedBy, ariaControls, ariaExpanded, ariaHasPopup, ariaCurrent, }) => {
5910
5910
  const { isExpanded } = useDrawerContext();
5911
- const { isVisible: isLabelVisible, isFadingIn: isLabelFadingIn } = useTransitionRender(isExpanded);
5911
+ const { isVisible: isLabelVisible, isFadingIn: isLabelFadingIn } = useTransitionRender(isExpanded, 200);
5912
5912
  const rootClassName = DRAWER_ITEM_STYLES.root({ selected, isExpanded });
5913
5913
  const computedAriaLabel = ariaLabel ?? (!isExpanded ? label : undefined);
5914
5914
  const computedAriaCurrent = ariaCurrent ?? (selected ? 'page' : undefined);