@cloudscape-design/components 3.0.1048 → 3.0.1050

package/button-dropdown/category-elements/mobile-expandable-category-element.js.map

@@ -1 +1 @@
-{"version":3,"file":"mobile-expandable-category-element.js","sourceRoot":"","sources":["../../../../src/button-dropdown/category-elements/mobile-expandable-category-element.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useEffect } from 'react';\nimport clsx from 'clsx';\n\nimport { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport InternalIcon from '../../icon/internal';\nimport useHiddenDescription from '../../internal/hooks/use-hidden-description';\nimport { GeneratedAnalyticsMetadataButtonDropdownExpand } from '../analytics-metadata/interfaces.js';\nimport { CategoryProps } from '../interfaces';\nimport ItemsList from '../items-list';\nimport MobileExpandableGroup from '../mobile-expandable-group/mobile-expandable-group';\nimport Tooltip from '../tooltip.js';\nimport { getMenuItemProps } from '../utils/menu-item.js';\n\nimport styles from './styles.css.js';\n\nconst MobileExpandableCategoryElement = ({\n  item,\n  onItemActivate,\n  onGroupToggle,\n  targetItem,\n  isHighlighted,\n  isKeyboardHighlight,\n  isExpanded,\n  lastInDropdown,\n  highlightItem,\n  disabled,\n  variant,\n  position,\n}: CategoryProps) => {\n  const highlighted = isHighlighted(item);\n  const expanded = isExpanded(item);\n  const isKeyboardHighlighted = isKeyboardHighlight(item);\n  const triggerRef = React.useRef<HTMLSpanElement>(null);\n\n  useEffect(() => {\n    if (triggerRef.current && highlighted && !expanded) {\n      triggerRef.current.focus();\n    }\n  }, [expanded, highlighted]);\n\n  const onClick = (e: React.MouseEvent) => {\n    if (!disabled) {\n      e.preventDefault();\n      onGroupToggle(item, e);\n    }\n  };\n\n  const onHover = () => {\n    highlightItem(item);\n  };\n\n  const isDisabledWithReason = !!item.disabledReason && item.disabled;\n  const { targetProps, descriptionEl } = useHiddenDescription(item.disabledReason);\n  const trigger = item.text && (\n    <span\n      className={clsx(styles.header, styles['expandable-header'], styles[`variant-${variant}`], {\n        [styles.highlighted]: highlighted,\n        [styles['rolled-down']]: expanded,\n        [styles.disabled]: disabled,\n        [styles['is-focused']]: isKeyboardHighlighted,\n      })}\n      // We are using the roving tabindex technique to manage the focus state of the dropdown.\n      // The current element will always have tabindex=0 which means that it can be tabbed to,\n      // while all other items have tabindex=-1 so we can focus them when necessary.\n      tabIndex={highlighted ? 0 : -1}\n      ref={triggerRef}\n      {...getMenuItemProps({ parent: true, disabled, expanded })}\n      {...(isDisabledWithReason ? targetProps : {})}\n      {...getAnalyticsMetadataAttribute(\n        disabled\n          ? {}\n          : ({\n              action: 'expand',\n              detail: {\n                position: position || '0',\n                label: { root: 'self' },\n                id: item.id || '',\n                expanded: `${!expanded}`,\n              },\n            } as GeneratedAnalyticsMetadataButtonDropdownExpand)\n      )}\n    >\n      {item.text}\n      <span\n        className={clsx(styles['expand-icon'], {\n          [styles['expand-icon-up']]: expanded,\n        })}\n      >\n        <InternalIcon name=\"caret-down-filled\" />\n      </span>\n    </span>\n  );\n\n  let content: React.ReactNode;\n\n  if (isDisabledWithReason) {\n    content = (\n      <>\n        {descriptionEl}\n        <Tooltip content={item.disabledReason}>{trigger}</Tooltip>\n      </>\n    );\n  } else if (disabled) {\n    content = trigger;\n  } else {\n    content = (\n      <MobileExpandableGroup open={expanded} trigger={trigger}>\n        {item.items && expanded && (\n          <ul role=\"menu\" aria-label={item.text} className={styles['items-list-container']}>\n            <ItemsList\n              items={item.items}\n              onItemActivate={onItemActivate}\n              onGroupToggle={onGroupToggle}\n              targetItem={targetItem}\n              isHighlighted={isHighlighted}\n              isKeyboardHighlight={isKeyboardHighlight}\n              isExpanded={isExpanded}\n              lastInDropdown={lastInDropdown}\n              highlightItem={highlightItem}\n              hasCategoryHeader={true}\n              variant={variant}\n              position={position}\n            />\n          </ul>\n        )}\n      </MobileExpandableGroup>\n    );\n  }\n\n  return (\n    <li\n      className={clsx(styles.category, styles[`variant-${variant}`], styles.expandable, {\n        [styles.expanded]: expanded,\n        [styles.disabled]: disabled,\n        [styles.highlighted]: highlighted || expanded,\n        [styles.expandable]: true,\n      })}\n      role=\"presentation\"\n      onClick={onClick}\n      onMouseEnter={onHover}\n      onTouchStart={onHover}\n      data-testid={item.id}\n    >\n      {content}\n    </li>\n  );\n};\n\nexport default MobileExpandableCategoryElement;\n"]}
+{"version":3,"file":"mobile-expandable-category-element.js","sourceRoot":"","sources":["../../../../src/button-dropdown/category-elements/mobile-expandable-category-element.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useEffect } from 'react';\nimport clsx from 'clsx';\n\nimport { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport InternalIcon from '../../icon/internal';\nimport useHiddenDescription from '../../internal/hooks/use-hidden-description';\nimport { GeneratedAnalyticsMetadataButtonDropdownExpand } from '../analytics-metadata/interfaces.js';\nimport { CategoryProps } from '../interfaces';\nimport ItemsList from '../items-list';\nimport MobileExpandableGroup from '../mobile-expandable-group/mobile-expandable-group';\nimport Tooltip from '../tooltip.js';\nimport { getMenuItemProps } from '../utils/menu-item.js';\n\nimport styles from './styles.css.js';\n\nconst MobileExpandableCategoryElement = ({\n  item,\n  onItemActivate,\n  onGroupToggle,\n  targetItem,\n  isHighlighted,\n  isKeyboardHighlight,\n  isExpanded,\n  lastInDropdown,\n  highlightItem,\n  disabled,\n  variant,\n  position,\n}: CategoryProps) => {\n  const highlighted = isHighlighted(item);\n  const expanded = isExpanded(item);\n  const isKeyboardHighlighted = isKeyboardHighlight(item);\n  const triggerRef = React.useRef<HTMLSpanElement>(null);\n\n  useEffect(() => {\n    if (triggerRef.current && highlighted && !expanded) {\n      triggerRef.current.focus();\n    }\n  }, [expanded, highlighted]);\n\n  const onClick = (e: React.MouseEvent) => {\n    if (!disabled) {\n      e.preventDefault();\n      onGroupToggle(item, e);\n    }\n  };\n\n  const onHover = () => {\n    highlightItem(item);\n  };\n\n  const isDisabledWithReason = !!item.disabledReason && item.disabled;\n  const { targetProps, descriptionEl } = useHiddenDescription(item.disabledReason);\n  const trigger = item.text && (\n    <span\n      className={clsx(styles.header, styles['expandable-header'], styles[`variant-${variant}`], {\n        [styles.highlighted]: highlighted,\n        [styles['rolled-down']]: expanded,\n        [styles.disabled]: disabled,\n        [styles['is-focused']]: isKeyboardHighlighted,\n      })}\n      // We are using the roving tabindex technique to manage the focus state of the dropdown.\n      // The current element will always have tabindex=0 which means that it can be tabbed to,\n      // while all other items have tabindex=-1 so we can focus them when necessary.\n      tabIndex={highlighted ? 0 : -1}\n      ref={triggerRef}\n      {...getMenuItemProps({ parent: true, disabled, expanded })}\n      {...(isDisabledWithReason ? targetProps : {})}\n      {...getAnalyticsMetadataAttribute(\n        disabled\n          ? {}\n          : ({\n              action: 'expand',\n              detail: {\n                position: position || '0',\n                label: { root: 'self' },\n                id: item.id || '',\n                expanded: `${!expanded}`,\n              },\n            } as GeneratedAnalyticsMetadataButtonDropdownExpand)\n      )}\n    >\n      {(item.iconName || item.iconUrl || item.iconSvg) && (\n        <span className={styles['icon-wrapper']}>\n          <InternalIcon name={item.iconName} url={item.iconUrl} svg={item.iconSvg} alt={item.iconAlt} />\n        </span>\n      )}\n      {item.text}\n      <span\n        className={clsx(styles['expand-icon'], {\n          [styles['expand-icon-up']]: expanded,\n        })}\n      >\n        <InternalIcon name=\"caret-down-filled\" />\n      </span>\n    </span>\n  );\n\n  let content: React.ReactNode;\n\n  if (isDisabledWithReason) {\n    content = (\n      <>\n        {descriptionEl}\n        <Tooltip content={item.disabledReason}>{trigger}</Tooltip>\n      </>\n    );\n  } else if (disabled) {\n    content = trigger;\n  } else {\n    content = (\n      <MobileExpandableGroup open={expanded} trigger={trigger}>\n        {item.items && expanded && (\n          <ul role=\"menu\" aria-label={item.text} className={styles['items-list-container']}>\n            <ItemsList\n              items={item.items}\n              onItemActivate={onItemActivate}\n              onGroupToggle={onGroupToggle}\n              targetItem={targetItem}\n              isHighlighted={isHighlighted}\n              isKeyboardHighlight={isKeyboardHighlight}\n              isExpanded={isExpanded}\n              lastInDropdown={lastInDropdown}\n              highlightItem={highlightItem}\n              hasCategoryHeader={true}\n              variant={variant}\n              position={position}\n            />\n          </ul>\n        )}\n      </MobileExpandableGroup>\n    );\n  }\n\n  return (\n    <li\n      className={clsx(styles.category, styles[`variant-${variant}`], styles.expandable, {\n        [styles.expanded]: expanded,\n        [styles.disabled]: disabled,\n        [styles.highlighted]: highlighted || expanded,\n        [styles.expandable]: true,\n      })}\n      role=\"presentation\"\n      onClick={onClick}\n      onMouseEnter={onHover}\n      onTouchStart={onHover}\n      data-testid={item.id}\n    >\n      {content}\n    </li>\n  );\n};\n\nexport default MobileExpandableCategoryElement;\n"]}

package/button-dropdown/category-elements/styles.css.js

@@ -1,20 +1,22 @@
 
     import './styles.scoped.css';
     export default {
-  "header": "awsui_header_16mm3_1lc2r_145",
-  "disabled": "awsui_disabled_16mm3_1lc2r_160",
-  "expandable-header": "awsui_expandable-header_16mm3_1lc2r_164",
-  "rolled-down": "awsui_rolled-down_16mm3_1lc2r_175",
-  "highlighted": "awsui_highlighted_16mm3_1lc2r_178",
-  "is-focused": "awsui_is-focused_16mm3_1lc2r_196",
-  "visual-refresh": "awsui_visual-refresh_16mm3_1lc2r_199",
-  "category": "awsui_category_16mm3_1lc2r_203",
-  "expandable": "awsui_expandable_16mm3_1lc2r_164",
-  "variant-navigation": "awsui_variant-navigation_16mm3_1lc2r_218",
-  "expand-icon": "awsui_expand-icon_16mm3_1lc2r_225",
-  "expand-icon-up": "awsui_expand-icon-up_16mm3_1lc2r_242",
-  "expand-icon-right": "awsui_expand-icon-right_16mm3_1lc2r_245",
-  "items-list-container": "awsui_items-list-container_16mm3_1lc2r_253",
-  "in-dropdown": "awsui_in-dropdown_16mm3_1lc2r_262"
+  "header": "awsui_header_16mm3_mv8zj_145",
+  "disabled": "awsui_disabled_16mm3_mv8zj_161",
+  "expandable-header": "awsui_expandable-header_16mm3_mv8zj_165",
+  "rolled-down": "awsui_rolled-down_16mm3_mv8zj_176",
+  "highlighted": "awsui_highlighted_16mm3_mv8zj_179",
+  "is-focused": "awsui_is-focused_16mm3_mv8zj_197",
+  "visual-refresh": "awsui_visual-refresh_16mm3_mv8zj_200",
+  "category": "awsui_category_16mm3_mv8zj_204",
+  "expandable": "awsui_expandable_16mm3_mv8zj_165",
+  "variant-navigation": "awsui_variant-navigation_16mm3_mv8zj_219",
+  "expand-icon": "awsui_expand-icon_16mm3_mv8zj_226",
+  "expand-icon-up": "awsui_expand-icon-up_16mm3_mv8zj_244",
+  "expand-icon-right": "awsui_expand-icon-right_16mm3_mv8zj_247",
+  "items-list-container": "awsui_items-list-container_16mm3_mv8zj_255",
+  "in-dropdown": "awsui_in-dropdown_16mm3_mv8zj_264",
+  "icon-wrapper": "awsui_icon-wrapper_16mm3_mv8zj_268",
+  "header-content": "awsui_header-content_16mm3_mv8zj_272"
 };
   

package/button-dropdown/category-elements/styles.scoped.css

@@ -142,7 +142,7 @@
 */
 /* Style used for links in slots/components that are text heavy, to help links stand out among
 surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F73#description */
-.awsui_header_16mm3_1lc2r_145:not(#\9) {
+.awsui_header_16mm3_mv8zj_145:not(#\9) {
   position: relative;
   margin-block: 0;
   margin-inline: 0;
@@ -153,29 +153,30 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   font-weight: bold;
   display: flex;
   justify-content: space-between;
+  align-items: center;
   padding-block: calc(var(--space-xxs-hwfkai, 4px) + var(--border-item-width-miijiw, 2px) - var(--border-divider-list-width-tdfx1x, 1px));
   padding-inline: calc(var(--space-button-horizontal-k0c786, 20px) + var(--border-item-width-miijiw, 2px));
   z-index: 1;
 }
-.awsui_header_16mm3_1lc2r_145.awsui_disabled_16mm3_1lc2r_160:not(#\9) {
+.awsui_header_16mm3_mv8zj_145.awsui_disabled_16mm3_mv8zj_161:not(#\9) {
   color: var(--color-text-dropdown-item-disabled-8m65hf, #b4b4bb);
   cursor: default;
 }
-.awsui_header_16mm3_1lc2r_145.awsui_expandable-header_16mm3_1lc2r_164:not(#\9) {
+.awsui_header_16mm3_mv8zj_145.awsui_expandable-header_16mm3_mv8zj_165:not(#\9) {
   border-block-start-color: var(--color-border-dropdown-group-ylcnh8, #c6c6cd);
   border-block-end-color: var(--color-border-dropdown-group-ylcnh8, #c6c6cd);
   cursor: pointer;
 }
-.awsui_header_16mm3_1lc2r_145.awsui_expandable-header_16mm3_1lc2r_164.awsui_disabled_16mm3_1lc2r_160:not(#\9) {
+.awsui_header_16mm3_mv8zj_145.awsui_expandable-header_16mm3_mv8zj_165.awsui_disabled_16mm3_mv8zj_161:not(#\9) {
   cursor: default;
 }
-.awsui_header_16mm3_1lc2r_145.awsui_expandable-header_16mm3_1lc2r_164:not(#\9):focus {
+.awsui_header_16mm3_mv8zj_145.awsui_expandable-header_16mm3_mv8zj_165:not(#\9):focus {
   outline: none;
 }
-.awsui_header_16mm3_1lc2r_145.awsui_expandable-header_16mm3_1lc2r_164.awsui_rolled-down_16mm3_1lc2r_175:not(#\9) {
+.awsui_header_16mm3_mv8zj_145.awsui_expandable-header_16mm3_mv8zj_165.awsui_rolled-down_16mm3_mv8zj_176:not(#\9) {
   border-block-end-color: transparent;
 }
-.awsui_header_16mm3_1lc2r_145.awsui_expandable-header_16mm3_1lc2r_164.awsui_highlighted_16mm3_1lc2r_178:not(#\9) {
+.awsui_header_16mm3_mv8zj_145.awsui_expandable-header_16mm3_mv8zj_165.awsui_highlighted_16mm3_mv8zj_179:not(#\9) {
   background-color: var(--color-background-dropdown-item-hover-yunepc, #f3f3f7);
   color: var(--color-text-dropdown-item-highlighted-yr1px8, #0f141a);
   padding-block: var(--space-xxs-hwfkai, 4px);
@@ -188,69 +189,70 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   border-end-end-radius: var(--border-radius-item-iwaia5, 8px);
   z-index: 2;
 }
-.awsui_header_16mm3_1lc2r_145.awsui_expandable-header_16mm3_1lc2r_164.awsui_highlighted_16mm3_1lc2r_178.awsui_disabled_16mm3_1lc2r_160:not(#\9) {
+.awsui_header_16mm3_mv8zj_145.awsui_expandable-header_16mm3_mv8zj_165.awsui_highlighted_16mm3_mv8zj_179.awsui_disabled_16mm3_mv8zj_161:not(#\9) {
   background-color: var(--color-background-dropdown-item-dimmed-dhho03, transparent);
   border-color: var(--color-border-dropdown-item-dimmed-hover-ga9sch, #8c8c94);
   color: var(--color-text-dropdown-item-dimmed-tq8vh3, #b4b4bb);
 }
-.awsui_header_16mm3_1lc2r_145.awsui_expandable-header_16mm3_1lc2r_164.awsui_highlighted_16mm3_1lc2r_178.awsui_is-focused_16mm3_1lc2r_196:not(#\9) {
+.awsui_header_16mm3_mv8zj_145.awsui_expandable-header_16mm3_mv8zj_165.awsui_highlighted_16mm3_mv8zj_179.awsui_is-focused_16mm3_mv8zj_197:not(#\9) {
   border-color: var(--color-border-dropdown-item-focused-zacqlp, #424650);
 }
-.awsui_header_16mm3_1lc2r_145.awsui_expandable-header_16mm3_1lc2r_164.awsui_highlighted_16mm3_1lc2r_178.awsui_is-focused_16mm3_1lc2r_196:not(#\9):not(.awsui_visual-refresh_16mm3_1lc2r_199) {
+.awsui_header_16mm3_mv8zj_145.awsui_expandable-header_16mm3_mv8zj_165.awsui_highlighted_16mm3_mv8zj_179.awsui_is-focused_16mm3_mv8zj_197:not(#\9):not(.awsui_visual-refresh_16mm3_mv8zj_200) {
   box-shadow: inset 0 0 0 var(--border-control-focus-ring-shadow-spread-9mjajk, 1px) var(--color-border-item-focused-uk47pl, #006ce0);
 }
 
-.awsui_category_16mm3_1lc2r_203:not(#\9) {
+.awsui_category_16mm3_mv8zj_204:not(#\9) {
   list-style: none;
   margin-block-start: calc(-1 * var(--border-divider-list-width-tdfx1x, 1px));
   padding-block: 0;
   padding-inline: 0;
 }
-.awsui_category_16mm3_1lc2r_203:not(#\9):first-child {
+.awsui_category_16mm3_mv8zj_204:not(#\9):first-child {
   margin-block-start: 0;
 }
-.awsui_category_16mm3_1lc2r_203.awsui_expandable_16mm3_1lc2r_164:not(#\9) {
+.awsui_category_16mm3_mv8zj_204.awsui_expandable_16mm3_mv8zj_165:not(#\9) {
   border-block-start: 0;
 }
-.awsui_category_16mm3_1lc2r_203:not(#\9):last-child {
+.awsui_category_16mm3_mv8zj_204:not(#\9):last-child {
   border-block-end: none;
 }
-.awsui_category_16mm3_1lc2r_203.awsui_variant-navigation_16mm3_1lc2r_218:not(#\9) {
+.awsui_category_16mm3_mv8zj_204.awsui_variant-navigation_16mm3_mv8zj_219:not(#\9) {
   padding-block-start: var(--space-xxs-hwfkai, 4px);
 }
-.awsui_category_16mm3_1lc2r_203.awsui_variant-navigation_16mm3_1lc2r_218.awsui_expandable_16mm3_1lc2r_164:not(#\9) {
+.awsui_category_16mm3_mv8zj_204.awsui_variant-navigation_16mm3_mv8zj_219.awsui_expandable_16mm3_mv8zj_165:not(#\9) {
   padding-block-start: 0;
 }
 
-.awsui_expand-icon_16mm3_1lc2r_225:not(#\9) {
+.awsui_expand-icon_16mm3_mv8zj_226:not(#\9) {
   position: relative;
-  inset-inline-start: var(--space-s-tvghoh, 12px);
+  inset-inline-end: calc(-1 * var(--space-s-tvghoh, 12px));
   inline-size: var(--space-m-dsumyt, 16px);
   display: inline-block;
+  margin-inline-start: auto;
   transition: transform var(--motion-duration-rotate-180-cxi9g7, 135ms) var(--motion-easing-rotate-180-7a58rc, cubic-bezier(0.165, 0.84, 0.44, 1));
 }
 @media (prefers-reduced-motion: reduce) {
-  .awsui_expand-icon_16mm3_1lc2r_225:not(#\9) {
+  .awsui_expand-icon_16mm3_mv8zj_226:not(#\9) {
     animation: none;
     transition: none;
   }
 }
-.awsui-motion-disabled .awsui_expand-icon_16mm3_1lc2r_225:not(#\9), .awsui-mode-entering .awsui_expand-icon_16mm3_1lc2r_225:not(#\9) {
+.awsui-motion-disabled .awsui_expand-icon_16mm3_mv8zj_226:not(#\9), .awsui-mode-entering .awsui_expand-icon_16mm3_mv8zj_226:not(#\9) {
   animation: none;
   transition: none;
 }
-.awsui_expand-icon-up_16mm3_1lc2r_242:not(#\9) {
+.awsui_expand-icon-up_16mm3_mv8zj_244:not(#\9) {
   transform: rotate(-180deg);
 }
-.awsui_expand-icon-right_16mm3_1lc2r_245:not(#\9) {
+.awsui_expand-icon-right_16mm3_mv8zj_247:not(#\9) {
   transform: rotate(-90deg);
   /* stylelint-disable-next-line plugin/no-unsupported-browser-features */
 }
-.awsui_expand-icon-right_16mm3_1lc2r_245:not(#\9):dir(rtl) {
+.awsui_expand-icon-right_16mm3_mv8zj_247:not(#\9):dir(rtl) {
   transform: rotate(90deg);
 }
 
-.awsui_items-list-container_16mm3_1lc2r_253:not(#\9) {
+.awsui_items-list-container_16mm3_mv8zj_255:not(#\9) {
   padding-block: 0;
   padding-inline: 0;
   margin-block-start: -1px;
@@ -259,6 +261,15 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   overflow-y: auto;
 }
 
-.awsui_in-dropdown_16mm3_1lc2r_262:not(#\9) {
+.awsui_in-dropdown_16mm3_mv8zj_264:not(#\9) {
   margin-block-end: -1px;
+}
+
+.awsui_icon-wrapper_16mm3_mv8zj_268:not(#\9) {
+  margin-inline-end: var(--space-xxs-hwfkai, 4px);
+}
+
+.awsui_header-content_16mm3_mv8zj_272:not(#\9) {
+  display: flex;
+  align-items: center;
 }

package/button-dropdown/category-elements/styles.selectors.js

@@ -2,20 +2,22 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "header": "awsui_header_16mm3_1lc2r_145",
-  "disabled": "awsui_disabled_16mm3_1lc2r_160",
-  "expandable-header": "awsui_expandable-header_16mm3_1lc2r_164",
-  "rolled-down": "awsui_rolled-down_16mm3_1lc2r_175",
-  "highlighted": "awsui_highlighted_16mm3_1lc2r_178",
-  "is-focused": "awsui_is-focused_16mm3_1lc2r_196",
-  "visual-refresh": "awsui_visual-refresh_16mm3_1lc2r_199",
-  "category": "awsui_category_16mm3_1lc2r_203",
-  "expandable": "awsui_expandable_16mm3_1lc2r_164",
-  "variant-navigation": "awsui_variant-navigation_16mm3_1lc2r_218",
-  "expand-icon": "awsui_expand-icon_16mm3_1lc2r_225",
-  "expand-icon-up": "awsui_expand-icon-up_16mm3_1lc2r_242",
-  "expand-icon-right": "awsui_expand-icon-right_16mm3_1lc2r_245",
-  "items-list-container": "awsui_items-list-container_16mm3_1lc2r_253",
-  "in-dropdown": "awsui_in-dropdown_16mm3_1lc2r_262"
+  "header": "awsui_header_16mm3_mv8zj_145",
+  "disabled": "awsui_disabled_16mm3_mv8zj_161",
+  "expandable-header": "awsui_expandable-header_16mm3_mv8zj_165",
+  "rolled-down": "awsui_rolled-down_16mm3_mv8zj_176",
+  "highlighted": "awsui_highlighted_16mm3_mv8zj_179",
+  "is-focused": "awsui_is-focused_16mm3_mv8zj_197",
+  "visual-refresh": "awsui_visual-refresh_16mm3_mv8zj_200",
+  "category": "awsui_category_16mm3_mv8zj_204",
+  "expandable": "awsui_expandable_16mm3_mv8zj_165",
+  "variant-navigation": "awsui_variant-navigation_16mm3_mv8zj_219",
+  "expand-icon": "awsui_expand-icon_16mm3_mv8zj_226",
+  "expand-icon-up": "awsui_expand-icon-up_16mm3_mv8zj_244",
+  "expand-icon-right": "awsui_expand-icon-right_16mm3_mv8zj_247",
+  "items-list-container": "awsui_items-list-container_16mm3_mv8zj_255",
+  "in-dropdown": "awsui_in-dropdown_16mm3_mv8zj_264",
+  "icon-wrapper": "awsui_icon-wrapper_16mm3_mv8zj_268",
+  "header-content": "awsui_header-content_16mm3_mv8zj_272"
 };
   

package/button-dropdown/item-element/styles.css.js

@@ -1,21 +1,21 @@
 
     import './styles.scoped.css';
     export default {
-  "item-element": "awsui_item-element_93a1u_idixt_145",
-  "disabled": "awsui_disabled_93a1u_idixt_157",
-  "show-divider": "awsui_show-divider_93a1u_idixt_164",
-  "highlighted": "awsui_highlighted_93a1u_idixt_167",
-  "is-focused": "awsui_is-focused_93a1u_idixt_182",
-  "visual-refresh": "awsui_visual-refresh_93a1u_idixt_185",
-  "menu-item": "awsui_menu-item_93a1u_idixt_189",
-  "link-style": "awsui_link-style_93a1u_idixt_201",
-  "current-breadcrumb": "awsui_current-breadcrumb_93a1u_idixt_237",
-  "link-style-highlighted": "awsui_link-style-highlighted_93a1u_idixt_245",
-  "has-category-header": "awsui_has-category-header_93a1u_idixt_251",
-  "item-tooltip-wrapper": "awsui_item-tooltip-wrapper_93a1u_idixt_251",
-  "has-checkmark": "awsui_has-checkmark_93a1u_idixt_251",
-  "icon": "awsui_icon_93a1u_idixt_255",
-  "checkmark": "awsui_checkmark_93a1u_idixt_259",
-  "external-icon": "awsui_external-icon_93a1u_idixt_266"
+  "item-element": "awsui_item-element_93a1u_so9cs_145",
+  "disabled": "awsui_disabled_93a1u_so9cs_157",
+  "show-divider": "awsui_show-divider_93a1u_so9cs_164",
+  "highlighted": "awsui_highlighted_93a1u_so9cs_167",
+  "is-focused": "awsui_is-focused_93a1u_so9cs_182",
+  "visual-refresh": "awsui_visual-refresh_93a1u_so9cs_185",
+  "menu-item": "awsui_menu-item_93a1u_so9cs_189",
+  "link-style": "awsui_link-style_93a1u_so9cs_201",
+  "current-breadcrumb": "awsui_current-breadcrumb_93a1u_so9cs_237",
+  "link-style-highlighted": "awsui_link-style-highlighted_93a1u_so9cs_245",
+  "has-category-header": "awsui_has-category-header_93a1u_so9cs_251",
+  "item-tooltip-wrapper": "awsui_item-tooltip-wrapper_93a1u_so9cs_251",
+  "has-checkmark": "awsui_has-checkmark_93a1u_so9cs_251",
+  "icon": "awsui_icon_93a1u_so9cs_255",
+  "checkmark": "awsui_checkmark_93a1u_so9cs_259",
+  "external-icon": "awsui_external-icon_93a1u_so9cs_266"
 };
   

package/button-dropdown/item-element/styles.scoped.css

@@ -142,7 +142,7 @@
 */
 /* Style used for links in slots/components that are text heavy, to help links stand out among
 surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F73#description */
-.awsui_item-element_93a1u_idixt_145:not(#\9) {
+.awsui_item-element_93a1u_so9cs_145:not(#\9) {
   position: relative;
   z-index: 1;
   border-block: var(--border-item-width-miijiw, 2px) solid transparent;
@@ -154,17 +154,17 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   margin-block-start: calc(-1 * var(--border-width-dropdown-youcay, 2px));
   cursor: pointer;
 }
-.awsui_item-element_93a1u_idixt_145.awsui_disabled_93a1u_idixt_157:not(#\9) {
+.awsui_item-element_93a1u_so9cs_145.awsui_disabled_93a1u_so9cs_157:not(#\9) {
   cursor: default;
   color: var(--color-text-dropdown-item-disabled-8m65hf, #b4b4bb);
 }
-.awsui_item-element_93a1u_idixt_145:not(#\9):first-child {
+.awsui_item-element_93a1u_so9cs_145:not(#\9):first-child {
   margin-block-start: 0;
 }
-.awsui_item-element_93a1u_idixt_145.awsui_show-divider_93a1u_idixt_164:not(#\9) {
+.awsui_item-element_93a1u_so9cs_145.awsui_show-divider_93a1u_so9cs_164:not(#\9) {
   border-block-end: var(--border-item-width-miijiw, 2px) solid var(--color-border-dropdown-group-ylcnh8, #c6c6cd);
 }
-.awsui_item-element_93a1u_idixt_145.awsui_highlighted_93a1u_idixt_167:not(#\9) {
+.awsui_item-element_93a1u_so9cs_145.awsui_highlighted_93a1u_so9cs_167:not(#\9) {
   color: var(--color-text-dropdown-item-highlighted-yr1px8, #0f141a);
   z-index: 2;
   background-color: var(--color-background-dropdown-item-hover-yunepc, #f3f3f7);
@@ -174,19 +174,19 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   border-end-start-radius: var(--border-radius-item-iwaia5, 8px);
   border-end-end-radius: var(--border-radius-item-iwaia5, 8px);
 }
-.awsui_item-element_93a1u_idixt_145.awsui_highlighted_93a1u_idixt_167.awsui_disabled_93a1u_idixt_157:not(#\9) {
+.awsui_item-element_93a1u_so9cs_145.awsui_highlighted_93a1u_so9cs_167.awsui_disabled_93a1u_so9cs_157:not(#\9) {
   color: var(--color-text-dropdown-item-dimmed-tq8vh3, #b4b4bb);
   border-color: var(--color-border-dropdown-item-dimmed-hover-ga9sch, #8c8c94);
   background-color: var(--color-background-dropdown-item-dimmed-dhho03, transparent);
 }
-.awsui_item-element_93a1u_idixt_145.awsui_highlighted_93a1u_idixt_167.awsui_is-focused_93a1u_idixt_182:not(#\9) {
+.awsui_item-element_93a1u_so9cs_145.awsui_highlighted_93a1u_so9cs_167.awsui_is-focused_93a1u_so9cs_182:not(#\9) {
   border-color: var(--color-border-dropdown-item-focused-zacqlp, #424650);
 }
-.awsui_item-element_93a1u_idixt_145.awsui_highlighted_93a1u_idixt_167.awsui_is-focused_93a1u_idixt_182:not(#\9):not(.awsui_visual-refresh_93a1u_idixt_185) {
+.awsui_item-element_93a1u_so9cs_145.awsui_highlighted_93a1u_so9cs_167.awsui_is-focused_93a1u_so9cs_182:not(#\9):not(.awsui_visual-refresh_93a1u_so9cs_185) {
   box-shadow: inset 0 0 0 var(--border-control-focus-ring-shadow-spread-9mjajk, 1px) var(--color-border-item-focused-uk47pl, #006ce0);
 }
 
-.awsui_menu-item_93a1u_idixt_189:not(#\9) {
+.awsui_menu-item_93a1u_so9cs_189:not(#\9) {
   min-inline-size: 0;
   word-break: break-word;
   display: flex;
@@ -198,11 +198,11 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   /* stylelint-disable selector-max-type */
   /* stylelint-enable selector-max-type */
 }
-.awsui_menu-item_93a1u_idixt_189.awsui_link-style_93a1u_idixt_201:not(#\9) {
+.awsui_menu-item_93a1u_so9cs_189.awsui_link-style_93a1u_so9cs_201:not(#\9) {
   padding-block-end: calc(var(--space-xxs-hwfkai, 4px) + var(--space-xxxs-pajhad, 2px));
   text-underline-offset: 0.25em;
   text-decoration-thickness: 1px;
-  color: var(--color-text-link-default-1dmm7z, #006ce0);
+  color: var(--awsui-style-color-default-kcc2gu, var(--color-text-link-default-1dmm7z, #006ce0));
   font-weight: inherit;
   letter-spacing: normal;
   text-decoration-line: underline;
@@ -213,30 +213,30 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   transition-duration: var(--motion-duration-refresh-only-medium-5rbn3k, 165ms);
 }
 @media (prefers-reduced-motion: reduce) {
-  .awsui_menu-item_93a1u_idixt_189.awsui_link-style_93a1u_idixt_201:not(#\9) {
+  .awsui_menu-item_93a1u_so9cs_189.awsui_link-style_93a1u_so9cs_201:not(#\9) {
     animation: none;
     transition: none;
   }
 }
-.awsui-motion-disabled .awsui_menu-item_93a1u_idixt_189.awsui_link-style_93a1u_idixt_201:not(#\9), .awsui-mode-entering .awsui_menu-item_93a1u_idixt_189.awsui_link-style_93a1u_idixt_201:not(#\9) {
+.awsui-motion-disabled .awsui_menu-item_93a1u_so9cs_189.awsui_link-style_93a1u_so9cs_201:not(#\9), .awsui-mode-entering .awsui_menu-item_93a1u_so9cs_189.awsui_link-style_93a1u_so9cs_201:not(#\9) {
   animation: none;
   transition: none;
 }
-.awsui_menu-item_93a1u_idixt_189.awsui_link-style_93a1u_idixt_201:not(#\9):hover {
+.awsui_menu-item_93a1u_so9cs_189.awsui_link-style_93a1u_so9cs_201:not(#\9):hover {
   cursor: pointer;
-  color: var(--color-text-link-hover-sq1gxg, #002b66);
+  color: var(--awsui-style-color-hover-kcc2gu, var(--color-text-link-hover-sq1gxg, #002b66));
 }
-.awsui_menu-item_93a1u_idixt_189.awsui_link-style_93a1u_idixt_201:not(#\9):focus {
+.awsui_menu-item_93a1u_so9cs_189.awsui_link-style_93a1u_so9cs_201:not(#\9):focus {
   outline: none;
 }
-.awsui_menu-item_93a1u_idixt_189.awsui_link-style_93a1u_idixt_201:not(#\9):active {
-  color: var(--color-text-link-hover-sq1gxg, #002b66);
+.awsui_menu-item_93a1u_so9cs_189.awsui_link-style_93a1u_so9cs_201:not(#\9):active {
+  color: var(--awsui-style-color-active-kcc2gu, var(--color-text-link-hover-sq1gxg, #002b66));
 }
-.awsui_menu-item_93a1u_idixt_189.awsui_link-style_93a1u_idixt_201:not(#\9):active, .awsui_menu-item_93a1u_idixt_189.awsui_link-style_93a1u_idixt_201:not(#\9):focus, .awsui_menu-item_93a1u_idixt_189.awsui_link-style_93a1u_idixt_201:not(#\9):hover {
+.awsui_menu-item_93a1u_so9cs_189.awsui_link-style_93a1u_so9cs_201:not(#\9):active, .awsui_menu-item_93a1u_so9cs_189.awsui_link-style_93a1u_so9cs_201:not(#\9):focus, .awsui_menu-item_93a1u_so9cs_189.awsui_link-style_93a1u_so9cs_201:not(#\9):hover {
   text-decoration-line: underline;
   text-decoration-color: currentColor;
 }
-.awsui_menu-item_93a1u_idixt_189.awsui_link-style_93a1u_idixt_201.awsui_current-breadcrumb_93a1u_idixt_237:not(#\9) {
+.awsui_menu-item_93a1u_so9cs_189.awsui_link-style_93a1u_so9cs_201.awsui_current-breadcrumb_93a1u_so9cs_237:not(#\9) {
   font-weight: var(--font-weight-button-0eg20c, 700);
   -webkit-font-smoothing: var(--font-smoothing-webkit-oemolo, antialiased);
   -moz-osx-font-smoothing: var(--font-smoothing-moz-osx-hbm0aq, grayscale);
@@ -244,27 +244,27 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   font-weight: 700;
   text-decoration: none;
 }
-.awsui_menu-item_93a1u_idixt_189.awsui_link-style_93a1u_idixt_201.awsui_link-style-highlighted_93a1u_idixt_245:not(#\9) {
+.awsui_menu-item_93a1u_so9cs_189.awsui_link-style_93a1u_so9cs_201.awsui_link-style-highlighted_93a1u_so9cs_245:not(#\9) {
   color: var(--color-text-link-hover-sq1gxg, #002b66);
 }
-.awsui_menu-item_93a1u_idixt_189:not(#\9):focus {
+.awsui_menu-item_93a1u_so9cs_189:not(#\9):focus {
   outline: none;
 }
-.awsui_has-category-header_93a1u_idixt_251 > .awsui_menu-item_93a1u_idixt_189:not(#\9), .awsui_has-category-header_93a1u_idixt_251 > .awsui_item-tooltip-wrapper_93a1u_idixt_251 > .awsui_menu-item_93a1u_idixt_189:not(#\9), .awsui_has-category-header_93a1u_idixt_251:not(#\9):not(.awsui_has-checkmark_93a1u_idixt_251) > span > .awsui_menu-item_93a1u_idixt_189 {
+.awsui_has-category-header_93a1u_so9cs_251 > .awsui_menu-item_93a1u_so9cs_189:not(#\9), .awsui_has-category-header_93a1u_so9cs_251 > .awsui_item-tooltip-wrapper_93a1u_so9cs_251 > .awsui_menu-item_93a1u_so9cs_189:not(#\9), .awsui_has-category-header_93a1u_so9cs_251:not(#\9):not(.awsui_has-checkmark_93a1u_so9cs_251) > span > .awsui_menu-item_93a1u_so9cs_189 {
   padding-inline-start: calc(var(--space-xs-ymlm0b, 8px) + var(--space-l-2ud1p3, 20px));
 }
 
-.awsui_icon_93a1u_idixt_255:not(#\9) {
+.awsui_icon_93a1u_so9cs_255:not(#\9) {
   padding-inline-end: var(--space-xxs-hwfkai, 4px);
   flex-shrink: 0;
 }
-.awsui_icon_93a1u_idixt_255.awsui_checkmark_93a1u_idixt_259:not(#\9) {
+.awsui_icon_93a1u_so9cs_255.awsui_checkmark_93a1u_so9cs_259:not(#\9) {
   color: var(--color-text-status-info-ue8bd2, #006ce0);
 }
-.awsui_icon_93a1u_idixt_255.awsui_disabled_93a1u_idixt_157:not(#\9) {
+.awsui_icon_93a1u_so9cs_255.awsui_disabled_93a1u_so9cs_157:not(#\9) {
   color: var(--color-text-interactive-disabled-1bqmrl, #b4b4bb);
 }
 
-.awsui_external-icon_93a1u_idixt_266:not(#\9) {
+.awsui_external-icon_93a1u_so9cs_266:not(#\9) {
   margin-inline-start: var(--space-xxs-hwfkai, 4px);
 }

package/button-dropdown/item-element/styles.selectors.js

@@ -2,21 +2,21 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "item-element": "awsui_item-element_93a1u_idixt_145",
-  "disabled": "awsui_disabled_93a1u_idixt_157",
-  "show-divider": "awsui_show-divider_93a1u_idixt_164",
-  "highlighted": "awsui_highlighted_93a1u_idixt_167",
-  "is-focused": "awsui_is-focused_93a1u_idixt_182",
-  "visual-refresh": "awsui_visual-refresh_93a1u_idixt_185",
-  "menu-item": "awsui_menu-item_93a1u_idixt_189",
-  "link-style": "awsui_link-style_93a1u_idixt_201",
-  "current-breadcrumb": "awsui_current-breadcrumb_93a1u_idixt_237",
-  "link-style-highlighted": "awsui_link-style-highlighted_93a1u_idixt_245",
-  "has-category-header": "awsui_has-category-header_93a1u_idixt_251",
-  "item-tooltip-wrapper": "awsui_item-tooltip-wrapper_93a1u_idixt_251",
-  "has-checkmark": "awsui_has-checkmark_93a1u_idixt_251",
-  "icon": "awsui_icon_93a1u_idixt_255",
-  "checkmark": "awsui_checkmark_93a1u_idixt_259",
-  "external-icon": "awsui_external-icon_93a1u_idixt_266"
+  "item-element": "awsui_item-element_93a1u_so9cs_145",
+  "disabled": "awsui_disabled_93a1u_so9cs_157",
+  "show-divider": "awsui_show-divider_93a1u_so9cs_164",
+  "highlighted": "awsui_highlighted_93a1u_so9cs_167",
+  "is-focused": "awsui_is-focused_93a1u_so9cs_182",
+  "visual-refresh": "awsui_visual-refresh_93a1u_so9cs_185",
+  "menu-item": "awsui_menu-item_93a1u_so9cs_189",
+  "link-style": "awsui_link-style_93a1u_so9cs_201",
+  "current-breadcrumb": "awsui_current-breadcrumb_93a1u_so9cs_237",
+  "link-style-highlighted": "awsui_link-style-highlighted_93a1u_so9cs_245",
+  "has-category-header": "awsui_has-category-header_93a1u_so9cs_251",
+  "item-tooltip-wrapper": "awsui_item-tooltip-wrapper_93a1u_so9cs_251",
+  "has-checkmark": "awsui_has-checkmark_93a1u_so9cs_251",
+  "icon": "awsui_icon_93a1u_so9cs_255",
+  "checkmark": "awsui_checkmark_93a1u_so9cs_259",
+  "external-icon": "awsui_external-icon_93a1u_so9cs_266"
 };
   

package/date-input/index.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
 import { DateInputProps } from './interfaces';
 export { DateInputProps };
-declare const DateInput: React.ForwardRefExoticComponent<DateInputProps & React.RefAttributes<HTMLInputElement>>;
+declare const DateInput: React.ForwardRefExoticComponent<DateInputProps & React.RefAttributes<import("..").InputProps.Ref>>;
 export default DateInput;

package/date-input/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/date-input/index.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAc,MAAM,OAAO,CAAC;AAInC,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAG9C,OAAO,EAAE,cAAc,EAAE,CAAC;AAE1B,QAAA,MAAM,SAAS,yFAKb,CAAC;AAIH,eAAe,SAAS,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/date-input/index.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAc,MAAM,OAAO,CAAC;AAInC,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAG9C,OAAO,EAAE,cAAc,EAAE,CAAC;AAE1B,QAAA,MAAM,SAAS,oGAKb,CAAC;AAIH,eAAe,SAAS,CAAC"}

package/date-input/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/date-input/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,YAAY,CAAC;AACb,OAAO,KAAc,MAAM,OAAO,CAAC;AAEnC,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AACpE,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AAExE,OAAO,iBAAiB,MAAM,YAAY,CAAC;AAI3C,MAAM,SAAS,GAAG,KAAK,CAAC,UAAU,CAAC,CAAC,KAAqB,EAAE,GAA0B,EAAE,EAAE;IACvF,MAAM,kBAAkB,GAAG,gBAAgB,CAAC,WAAW,EAAE;QACvD,KAAK,EAAE,EAAE,SAAS,EAAE,KAAK,CAAC,SAAS,EAAE,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAE;KAChE,CAAC,CAAC;IACH,OAAO,oBAAC,iBAAiB,oBAAK,KAAK,EAAM,kBAAkB,IAAE,GAAG,EAAE,GAAG,IAAI,CAAC;AAC5E,CAAC,CAAC,CAAC;AAEH,gBAAgB,CAAC,SAAS,EAAE,WAAW,CAAC,CAAC;AAEzC,eAAe,SAAS,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\n'use client';\nimport React, { Ref } from 'react';\n\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport { DateInputProps } from './interfaces';\nimport InternalDateInput from './internal';\n\nexport { DateInputProps };\n\nconst DateInput = React.forwardRef((props: DateInputProps, ref: Ref<HTMLInputElement>) => {\n  const baseComponentProps = useBaseComponent('DateInput', {\n    props: { autoFocus: props.autoFocus, readOnly: props.readOnly },\n  });\n  return <InternalDateInput {...props} {...baseComponentProps} ref={ref} />;\n});\n\napplyDisplayName(DateInput, 'DateInput');\n\nexport default DateInput;\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/date-input/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,YAAY,CAAC;AACb,OAAO,KAAc,MAAM,OAAO,CAAC;AAEnC,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AACpE,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AAExE,OAAO,iBAAiB,MAAM,YAAY,CAAC;AAI3C,MAAM,SAAS,GAAG,KAAK,CAAC,UAAU,CAAC,CAAC,KAAqB,EAAE,GAA4B,EAAE,EAAE;IACzF,MAAM,kBAAkB,GAAG,gBAAgB,CAAC,WAAW,EAAE;QACvD,KAAK,EAAE,EAAE,SAAS,EAAE,KAAK,CAAC,SAAS,EAAE,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAE;KAChE,CAAC,CAAC;IACH,OAAO,oBAAC,iBAAiB,oBAAK,KAAK,EAAM,kBAAkB,IAAE,GAAG,EAAE,GAAG,IAAI,CAAC;AAC5E,CAAC,CAAC,CAAC;AAEH,gBAAgB,CAAC,SAAS,EAAE,WAAW,CAAC,CAAC;AAEzC,eAAe,SAAS,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\n'use client';\nimport React, { Ref } from 'react';\n\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport { DateInputProps } from './interfaces';\nimport InternalDateInput from './internal';\n\nexport { DateInputProps };\n\nconst DateInput = React.forwardRef((props: DateInputProps, ref: Ref<DateInputProps.Ref>) => {\n  const baseComponentProps = useBaseComponent('DateInput', {\n    props: { autoFocus: props.autoFocus, readOnly: props.readOnly },\n  });\n  return <InternalDateInput {...props} {...baseComponentProps} ref={ref} />;\n});\n\napplyDisplayName(DateInput, 'DateInput');\n\nexport default DateInput;\n"]}

package/date-input/interfaces.d.ts

@@ -1,12 +1,41 @@
 import { BaseInputProps, InputProps } from '../input/interfaces';
 import { BaseComponentProps } from '../internal/base-component';
 import { FormFieldValidationControlProps } from '../internal/context/form-field-context';
+import { DateFormat, DateGranularity, EditableDateFormat } from '../internal/utils/date-time/interfaces';
 export interface DateInputProps extends BaseInputProps, FormFieldValidationControlProps, BaseComponentProps {
   /**
    * The current input value, in YYYY-MM-DD format.
    */
   value: string;
+  /**
+   * Specifies the locale to use to render month names and determine the starting day of the week.
+   * If you don't provide this, the locale is determined by the page and browser locales.
+   * Supported values and formats are listed in the [JavaScript Intl API specification](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl#Locale_identification_and_negotiation).
+   */
+  locale?: string;
+  /**
+   * Specifies the granularity at which users will be able to select a date.
+   * Defaults to `day`.
+   **/
+  granularity?: DateInputProps.Granularity;
+  /**
+   * The format as it is displayed. It can take the following values:
+   * * `iso`: ISO 8601 format without time, e.g.: 2024-01-30 (or 2024-01).
+   * * `long-localized`: a more human-readable, localized format, e.g.: January 30, 2024 (or January, 2024).
+   * * `slashed`: similar to ISO 8601 but with '/' in place of '-'. e.g.: 2024/01/30 (or 2024/01).
+   */
+  format?: DateInputProps.Format;
+  /**
+   * Specifies the date format to use when the format is 'long-localized' and editing the date.
+   * The format of the input as it is being interacted with. It can take the following values:
+   * * `iso`: ISO 8601 format without time, e.g.: 2024-01-30 (or 2024-01).
+   * * `slashed`: similar to ISO 8601 but with '/' in place of '-'. e.g.: 2024/01/30 (or 2024/01).
+   */
+  inputFormat?: DateInputProps.InputFormat;
 }
 export declare namespace DateInputProps {
   type Ref = InputProps.Ref;
+  type Format = DateFormat;
+  type InputFormat = EditableDateFormat;
+  type Granularity = DateGranularity;
 }

package/date-input/interfaces.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/date-input/interfaces.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,cAAc,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AACjE,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,+BAA+B,EAAE,MAAM,wCAAwC,CAAC;AAEzF,MAAM,WAAW,cAAe,SAAQ,cAAc,EAAE,+BAA+B,EAAE,kBAAkB;IACzG;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;CACf;AAED,yBAAiB,cAAc,CAAC;IAC9B,KAAY,GAAG,GAAG,UAAU,CAAC,GAAG,CAAC;CAClC"}
+{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/date-input/interfaces.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,cAAc,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AACjE,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,+BAA+B,EAAE,MAAM,wCAAwC,CAAC;AACzF,OAAO,EAAE,UAAU,EAAE,eAAe,EAAE,kBAAkB,EAAE,MAAM,wCAAwC,CAAC;AAEzG,MAAM,WAAW,cAAe,SAAQ,cAAc,EAAE,+BAA+B,EAAE,kBAAkB;IACzG;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;;;OAIG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB;;;QAGI;IACJ,WAAW,CAAC,EAAE,cAAc,CAAC,WAAW,CAAC;IAEzC;;;;;OAKG;IACH,MAAM,CAAC,EAAE,cAAc,CAAC,MAAM,CAAC;IAE/B;;;;;OAKG;IACH,WAAW,CAAC,EAAE,cAAc,CAAC,WAAW,CAAC;CAC1C;AAED,yBAAiB,cAAc,CAAC;IAC9B,KAAY,GAAG,GAAG,UAAU,CAAC,GAAG,CAAC;IAEjC,KAAY,MAAM,GAAG,UAAU,CAAC;IAEhC,KAAY,WAAW,GAAG,kBAAkB,CAAC;IAE7C,KAAY,WAAW,GAAG,eAAe,CAAC;CAC3C"}

package/date-input/interfaces.js.map

@@ -1 +1 @@
-{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/date-input/interfaces.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { BaseInputProps, InputProps } from '../input/interfaces';\nimport { BaseComponentProps } from '../internal/base-component';\nimport { FormFieldValidationControlProps } from '../internal/context/form-field-context';\n\nexport interface DateInputProps extends BaseInputProps, FormFieldValidationControlProps, BaseComponentProps {\n  /**\n   * The current input value, in YYYY-MM-DD format.\n   */\n  value: string;\n}\n\nexport namespace DateInputProps {\n  export type Ref = InputProps.Ref;\n}\n"]}
+{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/date-input/interfaces.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { BaseInputProps, InputProps } from '../input/interfaces';\nimport { BaseComponentProps } from '../internal/base-component';\nimport { FormFieldValidationControlProps } from '../internal/context/form-field-context';\nimport { DateFormat, DateGranularity, EditableDateFormat } from '../internal/utils/date-time/interfaces';\n\nexport interface DateInputProps extends BaseInputProps, FormFieldValidationControlProps, BaseComponentProps {\n  /**\n   * The current input value, in YYYY-MM-DD format.\n   */\n  value: string;\n\n  /**\n   * Specifies the locale to use to render month names and determine the starting day of the week.\n   * If you don't provide this, the locale is determined by the page and browser locales.\n   * Supported values and formats are listed in the [JavaScript Intl API specification](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl#Locale_identification_and_negotiation).\n   */\n  locale?: string;\n\n  /**\n   * Specifies the granularity at which users will be able to select a date.\n   * Defaults to `day`.\n   **/\n  granularity?: DateInputProps.Granularity;\n\n  /**\n   * The format as it is displayed. It can take the following values:\n   * * `iso`: ISO 8601 format without time, e.g.: 2024-01-30 (or 2024-01).\n   * * `long-localized`: a more human-readable, localized format, e.g.: January 30, 2024 (or January, 2024).\n   * * `slashed`: similar to ISO 8601 but with '/' in place of '-'. e.g.: 2024/01/30 (or 2024/01).\n   */\n  format?: DateInputProps.Format;\n\n  /**\n   * Specifies the date format to use when the format is 'long-localized' and editing the date.\n   * The format of the input as it is being interacted with. It can take the following values:\n   * * `iso`: ISO 8601 format without time, e.g.: 2024-01-30 (or 2024-01).\n   * * `slashed`: similar to ISO 8601 but with '/' in place of '-'. e.g.: 2024/01/30 (or 2024/01).\n   */\n  inputFormat?: DateInputProps.InputFormat;\n}\n\nexport namespace DateInputProps {\n  export type Ref = InputProps.Ref;\n\n  export type Format = DateFormat;\n\n  export type InputFormat = EditableDateFormat;\n\n  export type Granularity = DateGranularity;\n}\n"]}

package/date-input/internal.d.ts

@@ -1,8 +1,5 @@
 import React from 'react';
-import { CalendarProps } from '../calendar/interfaces';
 import { InternalBaseComponentProps } from '../internal/hooks/use-base-component';
 import { DateInputProps } from './interfaces';
-declare const InternalDateInput: React.ForwardRefExoticComponent<DateInputProps & InternalBaseComponentProps<any> & {
-  granularity?: CalendarProps.Granularity | undefined;
-} & React.RefAttributes<HTMLInputElement>>;
+declare const InternalDateInput: React.ForwardRefExoticComponent<DateInputProps & InternalBaseComponentProps<any> & React.RefAttributes<import("..").InputProps.Ref>>;
 export default InternalDateInput;

package/date-input/internal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/date-input/internal.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAc,MAAM,OAAO,CAAC;AAGnC,OAAO,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAGvD,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAElF,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAU9C,QAAA,MAAM,iBAAiB;;0CAqBtB,CAAC;AAEF,eAAe,iBAAiB,CAAC"}
+{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/date-input/internal.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAyC,MAAM,OAAO,CAAC;AAM9D,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAIlF,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAO9C,QAAA,MAAM,iBAAiB,sIAyEtB,CAAC;AAEF,eAAe,iBAAiB,CAAC"}