@central-design-system/components 4.0.0-alpha.10 → 4.0.0-alpha.12

package/dist/es/src/components/CdsDivider/CdsDivider.vue_vue_type_script_setup_true_lang.js

@@ -1,10 +1,10 @@
 import { defineComponent, useSlots, useAttrs, computed, toRef, createVNode, unref } from "vue";
-import { p as provideTheme } from "../../composables/useTheme/useTheme.js";
 import { u as useDefaults } from "../../core/useDefaults.js";
 import { u as convertToUnit } from "../../utils/helpers.js";
 import { c as classNames } from "../../utils/dom/classNames.js";
 import { C as CdsDividerConstants } from "./api/CdsDivider.constants.js";
 import { d as defineCdsDividerProps } from "./api/CdsDivider.props.js";
+import { p as provideTheme } from "../../composables/useTheme/useTheme.js";
 import { u as useTextColor } from "../../composables/useColor/useColor.js";
 const _sfc_main = /* @__PURE__ */ defineComponent({
   ...{

package/dist/es/src/components/CdsDrawer/CdsDrawer.css

@@ -1,4 +1,7 @@
 @layer cds-components {
+  body.cds-body--drawer-toggle {
+    overflow-x: hidden !important;
+  }
   .cds-drawer {
     position: absolute;
     top: 0;

package/dist/es/src/components/CdsDrawer/CdsDrawer.vue_vue_type_script_setup_true_lang.js

@@ -1,17 +1,17 @@
 import { defineComponent, useSlots, useAttrs, ref, computed, unref, reactive, toRef, onBeforeUnmount, watch, nextTick, createVNode, Fragment, mergeProps } from "vue";
-import { u as useDisplay } from "../../composables/useDisplay/useDisplay.js";
 import { u as useFocusTrap } from "../../composables/useFocus/useFocusTrap.js";
 import { u as useSsrBoot } from "../../composables/useSsrBoot/useSsrBoot.js";
-import { p as provideTheme } from "../../composables/useTheme/useTheme.js";
 import { u as useDefaults } from "../../core/useDefaults.js";
 import { u as useProxyModel } from "../../core/useProxyModel.js";
 import { u as convertToUnit, _ as keyNames, I as focusableChildren } from "../../utils/helpers.js";
 import { c as classNames } from "../../utils/dom/classNames.js";
 import { C as CdsImage } from "../CdsImage/index.js";
-import { C as CdsDrawerConstants, a as CDS_DRAWER_WIDTH, b as CDS_DRAWER_Z_INDEX_OUTER, c as CDS_DRAWER_WIDTH_MINIFIED } from "./api/CdsDrawer.constants.js";
+import { C as CdsDrawerConstants, a as CDS_DRAWER_WIDTH, b as CDS_DRAWER_Z_INDEX_OUTER, c as CDS_DRAWER_WIDTH_MINIFIED, d as CDS_DRAWER_BODY_TOGGLE_CLASS, e as CDS_DRAWER_TOGGLE_TIMEOUT } from "./api/CdsDrawer.constants.js";
 import { d as defineCdsDrawerProps } from "./api/CdsDrawer.props.js";
 import { u as useDrawerTouch } from "./composables/useDrawerTouch.js";
+import { u as useDisplay } from "../../composables/useDisplay/useDisplay.js";
 import { u as useInjectLayout } from "../../composables/useLayout/context.js";
+import { p as provideTheme } from "../../composables/useTheme/useTheme.js";
 import { u as useDimensions } from "../../composables/useDimensions/useDimensions.js";
 import { a as useBackgroundColor, u as useTextColor } from "../../composables/useColor/useColor.js";
 const _sfc_main = /* @__PURE__ */ defineComponent({
@@ -85,9 +85,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       backgroundColorClasses: scrimColorClasses,
       backgroundColorStyles: scrimColorStyles
     } = useBackgroundColor(() => typeof props.scrim === "string" ? props.scrim : null);
+    const onLayout = computed(() => unref(isActive) && !unref(isTemporary));
     const fixed = computed(() => {
       if (!unref(inLayout)) return props.fixed;
-      return props.fixed || unref(layout.view).indexOf(props.right ? "R" : "L") > -1 || unref(display.platform).ios && unref(layout.isContainer);
+      return props.fixed || !unref(onLayout) || unref(layout.view).indexOf(props.right ? "R" : "L") > -1 || unref(display.platform).ios && unref(layout.isContainer);
     });
     const drawerClasses = computed(() => ({
       [`${CdsDrawerConstants.rootClass}--active`]: unref(isActive),
@@ -175,7 +176,25 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         });
       });
     }
+    let toggleTimer;
+    function unlockBodyScroll() {
+      var _a;
+      clearTimeout(toggleTimer);
+      toggleTimer = void 0;
+      (_a = unref(drawerRef)) == null ? void 0 : _a.removeEventListener("transitionend", unlockBodyScroll);
+      document.body.classList.remove(CDS_DRAWER_BODY_TOGGLE_CLASS);
+    }
+    function lockBodyScroll() {
+      var _a;
+      unlockBodyScroll();
+      document.body.classList.add(CDS_DRAWER_BODY_TOGGLE_CLASS);
+      (_a = unref(drawerRef)) == null ? void 0 : _a.addEventListener("transitionend", unlockBodyScroll, {
+        once: true
+      });
+      toggleTimer = setTimeout(unlockBodyScroll, CDS_DRAWER_TOGGLE_TIMEOUT);
+    }
     onBeforeUnmount(() => {
+      if (toggleTimer !== void 0) unlockBodyScroll();
       if (unref(inLayout)) {
         layout.update(props.right ? "right" : "left", "space", false);
       }
@@ -184,6 +203,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       if (value) {
         activeElement = document.activeElement;
         emit("opened", value);
+        if (unref(inLayout) && !unref(layout.isContainer) && !unref(fixed)) lockBodyScroll();
         if (unref(isFocusTrapped)) focusInside();
       } else {
         activeElement == null ? void 0 : activeElement.focus();

package/dist/es/src/components/CdsDrawer/api/CdsDrawer.constants.js

@@ -4,11 +4,15 @@ const CDS_DRAWER_WIDTH = 240;
 const CDS_DRAWER_WIDTH_MINIFIED = 56;
 const CDS_DRAWER_Z_INDEX_INNER = 600;
 const CDS_DRAWER_Z_INDEX_OUTER = 801;
+const CDS_DRAWER_BODY_TOGGLE_CLASS = "cds-body--drawer-toggle";
+const CDS_DRAWER_TOGGLE_TIMEOUT = 300;
 export {
   CdsDrawerConstants as C,
   CDS_DRAWER_WIDTH as a,
   CDS_DRAWER_Z_INDEX_OUTER as b,
   CDS_DRAWER_WIDTH_MINIFIED as c,
-  CDS_DRAWER_Z_INDEX_INNER as d
+  CDS_DRAWER_BODY_TOGGLE_CLASS as d,
+  CDS_DRAWER_TOGGLE_TIMEOUT as e,
+  CDS_DRAWER_Z_INDEX_INNER as f
 };
 //# sourceMappingURL=CdsDrawer.constants.js.map

package/dist/es/src/components/CdsDrawer/api/CdsDrawer.props.js

@@ -1,9 +1,9 @@
 import { d as defineFocusTrapProps } from "../../../composables/useFocus/useFocusTrap.js";
-import { d as defineThemeProps } from "../../../composables/useTheme/useTheme.js";
 import { d as defineComponentProps, a as defineTagProps } from "../../../core/defineComponent.js";
 import { p as propsFactory } from "../../../core/propsFactory.js";
 import { a7 as pick, a3 as omit } from "../../../utils/helpers.js";
 import { C as CdsDrawerConstants, a as CDS_DRAWER_WIDTH } from "./CdsDrawer.constants.js";
+import { d as defineThemeProps } from "../../../composables/useTheme/useTheme.js";
 import { d as defineColorProps } from "../../../composables/useColor/useColor.js";
 import { d as defineDimensionsProps } from "../../../composables/useDimensions/useDimensions.js";
 const defineCdsDrawerProps = propsFactory(

package/dist/es/src/components/CdsEmptyState/CdsEmptyState.vue_vue_type_script_setup_true_lang.js

@@ -1,6 +1,4 @@
 import { defineComponent, useSlots, resolveDynamicComponent, createVNode, unref } from "vue";
-import { u as useDisplay } from "../../composables/useDisplay/useDisplay.js";
-import { p as provideTheme } from "../../composables/useTheme/useTheme.js";
 import { u as useDefaults } from "../../core/useDefaults.js";
 import { p as pascalCase } from "../../utils/changeCase.js";
 import { u as convertToUnit } from "../../utils/helpers.js";
@@ -11,8 +9,10 @@ import { C as CdsIcon } from "../CdsIcon/index.js";
 import { C as CdsImage } from "../CdsImage/index.js";
 import { C as CdsEmptyStateConstants } from "./api/CdsEmptyState.constants.js";
 import { d as defineCdsEmptyStateProps } from "./api/CdsEmptyState.props.js";
+import { p as provideTheme } from "../../composables/useTheme/useTheme.js";
 import { a as useBackgroundColor, u as useTextColor } from "../../composables/useColor/useColor.js";
 import { u as useDimensions } from "../../composables/useDimensions/useDimensions.js";
+import { u as useDisplay } from "../../composables/useDisplay/useDisplay.js";
 const _sfc_main = /* @__PURE__ */ defineComponent({
   ...{
     name: CdsEmptyStateConstants.name

package/dist/es/src/components/CdsEmptyState/api/CdsEmptyState.props.js

@@ -1,11 +1,11 @@
 import { I as IconValue } from "../../../composables/useIcons/internal/useIcons.constants.js";
 import { d as defineRouterProps } from "../../../composables/useRouter/useRouter.js";
 import { d as defineTextProps } from "../../../composables/useText/useText.js";
-import { d as defineThemeProps } from "../../../composables/useTheme/useTheme.js";
 import { d as defineComponentProps } from "../../../core/defineComponent.js";
 import { p as propsFactory } from "../../../core/propsFactory.js";
 import { a7 as pick } from "../../../utils/helpers.js";
 import { C as CdsEmptyStateConstants } from "./CdsEmptyState.constants.js";
+import { d as defineThemeProps } from "../../../composables/useTheme/useTheme.js";
 import { d as defineSizeProps } from "../../../composables/useSize/useSize.js";
 import { d as defineDimensionsProps } from "../../../composables/useDimensions/useDimensions.js";
 import { d as defineColorProps } from "../../../composables/useColor/useColor.js";

package/dist/es/src/components/CdsExpandablePanel/CdsExpandablePanels.vue_vue_type_script_setup_true_lang.js

@@ -1,11 +1,11 @@
 import { defineComponent, useSlots, toRef, createVNode, unref } from "vue";
 import { u as useGroup } from "../../composables/useGroup/useGroup.js";
-import { p as provideTheme } from "../../composables/useTheme/useTheme.js";
 import { u as useDefaults, p as provideDefaults } from "../../core/useDefaults.js";
 import { u as convertToUnit } from "../../utils/helpers.js";
 import { c as classNames } from "../../utils/dom/classNames.js";
 import { c as CdsExpandablePanelsConstants, e as CdsExpandablePanelsSymbol, b as CdsExpandablePanelConstants } from "./api/CdsExpandablePanel.constants.js";
 import { c as defineCdsExpandablePanelsProps } from "./api/CdsExpandablePanel.props.js";
+import { p as provideTheme } from "../../composables/useTheme/useTheme.js";
 const _sfc_main = /* @__PURE__ */ defineComponent({
   ...{
     name: CdsExpandablePanelsConstants.name

package/dist/es/src/components/CdsExpandablePanel/api/CdsExpandablePanel.props.js

@@ -3,12 +3,12 @@ import { d as defineGroupItemProps } from "../../../composables/useGroup/useGrou
 import { I as IconValue } from "../../../composables/useIcons/internal/useIcons.constants.js";
 import { d as defineLazyProps } from "../../../composables/useLazy/useLazy.js";
 import { d as defineReadonlyProps } from "../../../composables/useReadonly/useReadonly.js";
-import { d as defineThemeProps } from "../../../composables/useTheme/useTheme.js";
 import { d as defineComponentProps, a as defineTagProps } from "../../../core/defineComponent.js";
 import { p as propsFactory } from "../../../core/propsFactory.js";
 import { a7 as pick } from "../../../utils/helpers.js";
 import { C as CdsExpandablePanelContentConstants, a as CdsExpandablePanelTitleConstants, b as CdsExpandablePanelConstants, c as CdsExpandablePanelsConstants } from "./CdsExpandablePanel.constants.js";
 import { d as defineDimensionsProps } from "../../../composables/useDimensions/useDimensions.js";
+import { d as defineThemeProps } from "../../../composables/useTheme/useTheme.js";
 const defineCdsExpandablePanelTitleProps = propsFactory(
   {
     /**

package/dist/es/src/components/CdsField/CdsField.vue_vue_type_script_setup_true_lang.js

@@ -4,7 +4,6 @@ import { u as useFocus, d as defineFocusProps } from "../../composables/useFocus
 import { L as LoaderSlot } from "../../composables/useLoader/LoaderSlot.js";
 import { u as useLoader } from "../../composables/useLoader/useLoader.js";
 import { u as useRtl } from "../../composables/useLocale/useLocale.js";
-import { p as provideTheme } from "../../composables/useTheme/useTheme.js";
 import { u as useDefaults } from "../../core/useDefaults.js";
 import { a as CdsTransitionExpandX } from "../../transitions/index.js";
 import { c as classNames } from "../../utils/dom/classNames.js";
@@ -12,6 +11,7 @@ import { C as CdsDefaultsProvider } from "../CdsDefaultsProvider/index.js";
 import { C as CdsProgressCircle } from "../CdsProgressCircle/index.js";
 import { C as CdsFieldConstants } from "./api/CdsField.constants.js";
 import { d as defineCdsFieldProps } from "./api/CdsField.props.js";
+import { p as provideTheme } from "../../composables/useTheme/useTheme.js";
 import { u as useSize } from "../../composables/useSize/useSize.js";
 import { a as useBackgroundColor, u as useTextColor, c as useShadowBorderColor } from "../../composables/useColor/useColor.js";
 const _sfc_main = /* @__PURE__ */ defineComponent({

package/dist/es/src/components/CdsField/api/CdsField.props.js

@@ -2,11 +2,11 @@ import { d as defineDisabledProps } from "../../../composables/useDisabled/useDi
 import { I as IconValue } from "../../../composables/useIcons/internal/useIcons.constants.js";
 import { d as defineLoaderProps } from "../../../composables/useLoader/useLoader.js";
 import { d as defineReadonlyProps } from "../../../composables/useReadonly/useReadonly.js";
-import { d as defineThemeProps } from "../../../composables/useTheme/useTheme.js";
 import { d as defineComponentProps } from "../../../core/defineComponent.js";
 import { p as propsFactory } from "../../../core/propsFactory.js";
 import { E as EventProp } from "../../../utils/helpers.js";
 import { C as CdsFieldConstants } from "./CdsField.constants.js";
+import { d as defineThemeProps } from "../../../composables/useTheme/useTheme.js";
 import { d as defineSizeProps } from "../../../composables/useSize/useSize.js";
 import { d as defineColorProps } from "../../../composables/useColor/useColor.js";
 const defineCdsFieldProps = propsFactory(

package/dist/es/src/components/CdsFooter/CdsFooter.css

@@ -12,6 +12,9 @@
   .cds-footer--absolute {
     position: absolute;
   }
+  .cds-footer--absolute.cds-footer--prevent-focus {
+    display: none;
+  }
   .cds-footer--fixed {
     position: fixed;
   }

package/dist/es/src/components/CdsFooter/CdsFooter.vue_vue_type_script_setup_true_lang.js

@@ -1,12 +1,12 @@
 import { defineComponent, useSlots, watch, unref, createVNode } from "vue";
-import { u as useDisplay } from "../../composables/useDisplay/useDisplay.js";
-import { p as provideTheme } from "../../composables/useTheme/useTheme.js";
 import { u as useDefaults } from "../../core/useDefaults.js";
 import { c as classNames } from "../../utils/dom/classNames.js";
 import { w as warn } from "../../utils/dom/console.js";
 import { C as CdsFooterConstants } from "./api/CdsFooter.constants.js";
 import { d as defineCdsFooterProps } from "./api/CdsFooter.props.js";
 import { u as useInjectLayout } from "../../composables/useLayout/context.js";
+import { u as useDisplay } from "../../composables/useDisplay/useDisplay.js";
+import { p as provideTheme } from "../../composables/useTheme/useTheme.js";
 import { a as useBackgroundColor, u as useTextColor } from "../../composables/useColor/useColor.js";
 import { u as useLayout } from "../../composables/useLayout/useLayout.js";
 import { L as LayoutResizeObserver } from "../CdsLayout/internal/LayoutResizeObserver.js";

package/dist/es/src/components/CdsFooter/api/CdsFooter.props.js

@@ -1,8 +1,8 @@
-import { d as defineThemeProps } from "../../../composables/useTheme/useTheme.js";
 import { d as defineComponentProps } from "../../../core/defineComponent.js";
 import { p as propsFactory } from "../../../core/propsFactory.js";
 import { a7 as pick } from "../../../utils/helpers.js";
 import { C as CdsFooterConstants } from "./CdsFooter.constants.js";
+import { d as defineThemeProps } from "../../../composables/useTheme/useTheme.js";
 import { d as defineColorProps } from "../../../composables/useColor/useColor.js";
 import { d as defineLayoutProps } from "../../../composables/useLayout/useLayout.js";
 const defineCdsFooterProps = propsFactory(

package/dist/es/src/components/CdsFunctionalButton/api/CdsFunctionalButton.props.js

@@ -2,11 +2,11 @@ import { d as defineDisabledProps } from "../../../composables/useDisabled/useDi
 import { d as defineLoaderProps } from "../../../composables/useLoader/useLoader.js";
 import { d as defineReadonlyProps } from "../../../composables/useReadonly/useReadonly.js";
 import { d as defineRouterProps } from "../../../composables/useRouter/useRouter.js";
-import { d as defineThemeProps } from "../../../composables/useTheme/useTheme.js";
 import { a as defineTagProps, d as defineComponentProps } from "../../../core/defineComponent.js";
 import { p as propsFactory } from "../../../core/propsFactory.js";
 import { a3 as omit } from "../../../utils/helpers.js";
 import { C as CdsFunctionalButtonConstants } from "./CdsFunctionalButton.constants.js";
+import { d as defineThemeProps } from "../../../composables/useTheme/useTheme.js";
 import { d as defineColorProps } from "../../../composables/useColor/useColor.js";
 const defineCdsFunctionalButtonProps = propsFactory(
   {

package/dist/es/src/components/CdsGrid/CdsCol.vue_vue_type_script_setup_true_lang.js

@@ -1,10 +1,10 @@
 import { defineComponent, useSlots, inject, computed, unref, h } from "vue";
-import { b as breakpoints } from "../../composables/useDisplay/internal/useDisplay.constants.js";
 import { u as useDefaults } from "../../core/useDefaults.js";
 import { c as classNames } from "../../utils/dom/classNames.js";
 import { b as componentColName, C as CssGridSymbol, d as componentPrefix } from "./api/CdsGrid.constants.js";
 import { d as defineCdsColProps } from "./api/CdsGrid.props.js";
 import { g as getClassNameForSpan, a as getClassNameForGridBreakpoints, b as getClassNameForFlexBreakpoints } from "./utils/index.js";
+import { b as breakpoints } from "../../composables/useDisplay/internal/useDisplay.constants.js";
 const _sfc_main = /* @__PURE__ */ defineComponent({
   ...{
     name: componentColName

package/dist/es/src/components/CdsHeader/CdsHeader.vue_vue_type_script_setup_true_lang.js

@@ -1,11 +1,11 @@
 import { defineComponent, useSlots, watch, createVNode, unref } from "vue";
-import { p as provideTheme } from "../../composables/useTheme/useTheme.js";
 import { u as useDefaults } from "../../core/useDefaults.js";
 import { c as classNames } from "../../utils/dom/classNames.js";
 import { w as warn } from "../../utils/dom/console.js";
 import { C as CdsHeaderConstants } from "./api/CdsHeader.constants.js";
 import { d as defineCdsHeaderProps } from "./api/CdsHeader.props.js";
 import { u as useInjectLayout } from "../../composables/useLayout/context.js";
+import { p as provideTheme } from "../../composables/useTheme/useTheme.js";
 import { a as useBackgroundColor, u as useTextColor } from "../../composables/useColor/useColor.js";
 import { u as useLayout } from "../../composables/useLayout/useLayout.js";
 import { L as LayoutResizeObserver } from "../CdsLayout/internal/LayoutResizeObserver.js";

package/dist/es/src/components/CdsHeader/api/CdsHeader.props.js

@@ -1,8 +1,8 @@
-import { d as defineThemeProps } from "../../../composables/useTheme/useTheme.js";
 import { d as defineComponentProps } from "../../../core/defineComponent.js";
 import { p as propsFactory } from "../../../core/propsFactory.js";
 import { a7 as pick } from "../../../utils/helpers.js";
 import { C as CdsHeaderConstants } from "./CdsHeader.constants.js";
+import { d as defineThemeProps } from "../../../composables/useTheme/useTheme.js";
 import { d as defineColorProps } from "../../../composables/useColor/useColor.js";
 import { d as defineLayoutProps } from "../../../composables/useLayout/useLayout.js";
 const defineCdsHeaderProps = propsFactory(

package/dist/es/src/components/CdsIcon/CdsIcon.vue_vue_type_script_setup_true_lang.js

@@ -1,12 +1,12 @@
 import { defineComponent, useSlots, useAttrs, shallowRef, Text, unref, createVNode } from "vue";
 import { u as useIcon } from "../../composables/useIcons/useIcons.js";
-import { u as useTheme } from "../../composables/useTheme/useTheme.js";
 import { u as useDefaults } from "../../core/useDefaults.js";
 import { G as flattenFragments, u as convertToUnit } from "../../utils/helpers.js";
 import { c as classNames } from "../../utils/dom/classNames.js";
 import { C as CdsIconConstants } from "./api/CdsIcon.constants.js";
 import { d as defineCdsIconProps } from "./api/CdsIcon.props.js";
 import { u as useSize } from "../../composables/useSize/useSize.js";
+import { u as useTheme } from "../../composables/useTheme/useTheme.js";
 import { u as useTextColor } from "../../composables/useColor/useColor.js";
 const _sfc_main = /* @__PURE__ */ defineComponent({
   ...{

package/dist/es/src/components/CdsIcon/api/CdsIcon.props.js

@@ -1,8 +1,8 @@
 import { d as defineDisabledProps } from "../../../composables/useDisabled/useDisabled.js";
-import { d as defineThemeProps } from "../../../composables/useTheme/useTheme.js";
 import { d as defineComponentProps, a as defineTagProps } from "../../../core/defineComponent.js";
 import { p as propsFactory } from "../../../core/propsFactory.js";
 import { C as CdsIconConstants } from "./CdsIcon.constants.js";
+import { d as defineThemeProps } from "../../../composables/useTheme/useTheme.js";
 import { d as defineSizeProps } from "../../../composables/useSize/useSize.js";
 import { d as defineColorProps } from "../../../composables/useColor/useColor.js";
 const defineCdsIconProps = propsFactory(

package/dist/es/src/components/CdsImage/CdsImage.vue_vue_type_script_setup_true_lang.js

@@ -1,6 +1,5 @@
 import { defineComponent, useSlots, getCurrentInstance, shallowRef, ref, computed, watch, onBeforeMount, nextTick, onBeforeUnmount, toRef, withDirectives, createVNode, unref, Fragment, vShow } from "vue";
 import { C as CdsResponsive } from "../CdsResponsive/index.js";
-import { p as provideTheme } from "../../composables/useTheme/useTheme.js";
 import { M as MaybeTransition } from "../../composables/useTransition/useTransition.js";
 import { u as useDefaults } from "../../core/useDefaults.js";
 import { a6 as parseAspectRatio, u as convertToUnit } from "../../utils/helpers.js";
@@ -8,6 +7,7 @@ import { c as classNames } from "../../utils/dom/classNames.js";
 import { b as SUPPORTS_INTERSECTION_OBSERVER } from "../../utils/dom/globals.js";
 import { C as CdsImageConstants } from "./api/CdsImage.constants.js";
 import { d as defineCdsImageProps } from "./api/CdsImage.props.js";
+import { p as provideTheme } from "../../composables/useTheme/useTheme.js";
 import { a as useBackgroundColor } from "../../composables/useColor/useColor.js";
 import { I as Intersect } from "../../directives/intersect/index.js";
 const _sfc_main = /* @__PURE__ */ defineComponent({

package/dist/es/src/components/CdsImage/api/CdsImage.props.js

@@ -1,8 +1,8 @@
 import { d as defineCdsResponsiveProps } from "../../CdsResponsive/api/CdsResponsive.props.js";
-import { d as defineThemeProps } from "../../../composables/useTheme/useTheme.js";
 import { b as defineTransitionProps } from "../../../composables/useTransition/useTransition.js";
 import { p as propsFactory } from "../../../core/propsFactory.js";
 import { C as CdsImageConstants } from "./CdsImage.constants.js";
+import { d as defineThemeProps } from "../../../composables/useTheme/useTheme.js";
 const defineCdsImageProps = propsFactory(
   {
     /**

package/dist/es/src/components/CdsInput/CdsInput.vue_vue_type_script_setup_true_lang.js

@@ -1,7 +1,6 @@
 import { defineComponent, useSlots, useId, computed, toRef, unref, createVNode } from "vue";
 import { u as useDirection } from "../../composables/useDirection/useDirection.js";
 import { u as useRtl } from "../../composables/useLocale/useLocale.js";
-import { p as provideTheme } from "../../composables/useTheme/useTheme.js";
 import { u as useValidation } from "../../composables/useValidation/useValidation.js";
 import { u as useDefaults } from "../../core/useDefaults.js";
 import { c as classNames } from "../../utils/dom/classNames.js";
@@ -11,6 +10,7 @@ import { C as CdsMessages } from "../CdsMessages/index.js";
 import { C as CdsInputConstants } from "./api/CdsInput.constants.js";
 import { d as defineCdsInputProps } from "./api/CdsInput.props.js";
 import { u as useInputIcon } from "./CdsInputIcon.js";
+import { p as provideTheme } from "../../composables/useTheme/useTheme.js";
 import { u as useDimensions } from "../../composables/useDimensions/useDimensions.js";
 import { u as useSize } from "../../composables/useSize/useSize.js";
 const _sfc_main = /* @__PURE__ */ defineComponent({

package/dist/es/src/components/CdsInput/api/CdsInput.props.js

@@ -1,12 +1,12 @@
 import { d as defineCdsMessagesProps } from "../../CdsMessages/api/CdsMessages.props.js";
 import { d as defineDirectionProps } from "../../../composables/useDirection/useDirection.js";
 import { I as IconValue } from "../../../composables/useIcons/internal/useIcons.constants.js";
-import { d as defineThemeProps } from "../../../composables/useTheme/useTheme.js";
 import { d as defineValidationProps } from "../../../composables/useValidation/useValidation.js";
 import { d as defineComponentProps } from "../../../core/defineComponent.js";
 import { p as propsFactory } from "../../../core/propsFactory.js";
 import { a7 as pick, E as EventProp } from "../../../utils/helpers.js";
 import { C as CdsInputConstants } from "./CdsInput.constants.js";
+import { d as defineThemeProps } from "../../../composables/useTheme/useTheme.js";
 import { d as defineDimensionsProps } from "../../../composables/useDimensions/useDimensions.js";
 import { d as defineColorProps } from "../../../composables/useColor/useColor.js";
 import { d as defineSizeProps } from "../../../composables/useSize/useSize.js";

package/dist/es/src/components/CdsLayout/CdsLayout.css

@@ -2,7 +2,6 @@
   .cds-layout {
     position: relative;
     width: 100%;
-    overflow: hidden;
     color: rgb(var(--cds-color-content-primary));
     outline: 0;
     background: rgb(var(--cds-color-page-primary));

package/dist/es/src/components/CdsLayout/CdsLayout.vue_vue_type_script_setup_true_lang.js

@@ -1,12 +1,12 @@
 import { defineComponent, useSlots, ref, unref, computed, reactive, watch, onUnmounted, createVNode, Fragment } from "vue";
-import { u as useDisplay } from "../../composables/useDisplay/useDisplay.js";
-import { p as provideTheme } from "../../composables/useTheme/useTheme.js";
 import { u as useDefaults } from "../../core/useDefaults.js";
 import { c as classNames } from "../../utils/dom/classNames.js";
 import { b as getScrollBarSize, i as hasPreventedScroll } from "../../utils/dom/getScrollParent.js";
 import { a as IN_BROWSER } from "../../utils/dom/globals.js";
 import { C as CdsLayoutConstants, a as CDS_DRAWER_WIDTH } from "./api/CdsLayout.constants.js";
 import { d as defineCdsLayoutProps } from "./api/CdsLayout.props.js";
+import { p as provideTheme } from "../../composables/useTheme/useTheme.js";
+import { u as useDisplay } from "../../composables/useDisplay/useDisplay.js";
 import { p as provideLayout } from "../../composables/useLayout/context.js";
 import { L as LayoutScrollObserver } from "./internal/LayoutScrollObserver.js";
 import { L as LayoutResizeObserver } from "./internal/LayoutResizeObserver.js";

package/dist/es/src/components/CdsLayout/api/CdsLayout.props.js

@@ -1,7 +1,7 @@
-import { d as defineThemeProps } from "../../../composables/useTheme/useTheme.js";
 import { d as defineComponentProps } from "../../../core/defineComponent.js";
 import { p as propsFactory } from "../../../core/propsFactory.js";
 import { C as CdsLayoutConstants } from "./CdsLayout.constants.js";
+import { d as defineThemeProps } from "../../../composables/useTheme/useTheme.js";
 const defineCdsLayoutProps = propsFactory(
   {
     /**

package/dist/es/src/components/CdsLink/CdsLink.vue_vue_type_script_setup_true_lang.js

@@ -1,11 +1,11 @@
 import { defineComponent, useSlots, useAttrs, createVNode, mergeProps, unref } from "vue";
 import { u as useLink } from "../../composables/useRouter/useRouter.js";
 import { u as useText } from "../../composables/useText/useText.js";
-import { p as provideTheme } from "../../composables/useTheme/useTheme.js";
 import { u as useDefaults } from "../../core/useDefaults.js";
 import { c as classNames } from "../../utils/dom/classNames.js";
 import { C as CdsLinkConstants } from "./api/CdsLink.constants.js";
 import { d as defineCdsLinkProps } from "./api/CdsLink.props.js";
+import { p as provideTheme } from "../../composables/useTheme/useTheme.js";
 const _sfc_main = /* @__PURE__ */ defineComponent({
   ...{
     name: CdsLinkConstants.name

package/dist/es/src/components/CdsLink/api/CdsLink.props.js

@@ -1,9 +1,9 @@
 import { d as defineRouterProps } from "../../../composables/useRouter/useRouter.js";
 import { d as defineTextProps } from "../../../composables/useText/useText.js";
-import { d as defineThemeProps } from "../../../composables/useTheme/useTheme.js";
 import { d as defineComponentProps } from "../../../core/defineComponent.js";
 import { p as propsFactory } from "../../../core/propsFactory.js";
 import { C as CdsLinkConstants } from "./CdsLink.constants.js";
+import { d as defineThemeProps } from "../../../composables/useTheme/useTheme.js";
 const defineCdsLinkProps = propsFactory(
   {
     /**

package/dist/es/src/components/CdsList/CdsList.vue_vue_type_script_setup_true_lang.js

@@ -1,6 +1,5 @@
 import { defineComponent, useSlots, useAttrs, useId, toRef, watch, unref, createVNode } from "vue";
 import { b as useNested } from "../../composables/useNested/useNested.js";
-import { p as provideTheme } from "../../composables/useTheme/useTheme.js";
 import { u as useDefaults, p as provideDefaults } from "../../core/useDefaults.js";
 import { u as convertToUnit } from "../../utils/helpers.js";
 import { c as classNames } from "../../utils/dom/classNames.js";
@@ -8,6 +7,7 @@ import { C as CdsListConstants } from "./api/CdsList.constants.js";
 import { b as defineCdsListProps } from "./api/CdsList.props.js";
 import { _ as _sfc_main$1 } from "./components/ListChildren.vue_vue_type_script_setup_true_lang.js";
 import { p as provideList, c as createList } from "./composables/useList.js";
+import { p as provideTheme } from "../../composables/useTheme/useTheme.js";
 import { a as useBackgroundColor } from "../../composables/useColor/useColor.js";
 import { u as useDimensions } from "../../composables/useDimensions/useDimensions.js";
 const _sfc_main = /* @__PURE__ */ defineComponent({

package/dist/es/src/components/CdsList/CdsListItem.vue_vue_type_script_setup_true_lang.js

@@ -5,7 +5,6 @@ import { C as CdsIcon } from "../CdsIcon/index.js";
 import { u as useList } from "./composables/useList.js";
 import { a as useNestedItem } from "../../composables/useNested/useNested.js";
 import { u as useLink } from "../../composables/useRouter/useRouter.js";
-import { p as provideTheme } from "../../composables/useTheme/useTheme.js";
 import { u as useDefaults } from "../../core/useDefaults.js";
 import { u as convertToUnit, _ as keyNames } from "../../utils/helpers.js";
 import { c as classNames } from "../../utils/dom/classNames.js";
@@ -14,6 +13,7 @@ import { a as defineCdsListItemProps } from "./api/CdsList.props.js";
 import { _ as _sfc_main$3 } from "./CdsListItemDescription.vue_vue_type_script_lang.js";
 import { _ as _sfc_main$2 } from "./CdsListItemSubtitle.vue_vue_type_script_lang.js";
 import { _ as _sfc_main$1 } from "./CdsListItemTitle.vue_vue_type_script_lang.js";
+import { p as provideTheme } from "../../composables/useTheme/useTheme.js";
 import { u as useDimensions } from "../../composables/useDimensions/useDimensions.js";
 import { u as useTextColor, a as useBackgroundColor } from "../../composables/useColor/useColor.js";
 const _sfc_main = /* @__PURE__ */ defineComponent({

package/dist/es/src/components/CdsList/api/CdsList.props.js

@@ -4,11 +4,11 @@ import { I as IconValue } from "../../../composables/useIcons/internal/useIcons.
 import { d as defineItemsProps } from "../../../composables/useItems/useItems.js";
 import { d as defineNestedProps } from "../../../composables/useNested/useNested.js";
 import { d as defineRouterProps } from "../../../composables/useRouter/useRouter.js";
-import { d as defineThemeProps } from "../../../composables/useTheme/useTheme.js";
 import { d as defineComponentProps, a as defineTagProps } from "../../../core/defineComponent.js";
 import { p as propsFactory } from "../../../core/propsFactory.js";
 import { E as EventProp, a7 as pick } from "../../../utils/helpers.js";
 import { C as CdsListConstants, a as CdsListItemConstants, b as CdsListGroupConstants, c as CdsListSubheaderConstants, d as CdsListItemDividerConstants } from "./CdsList.constants.js";
+import { d as defineThemeProps } from "../../../composables/useTheme/useTheme.js";
 import { d as defineColorProps } from "../../../composables/useColor/useColor.js";
 import { d as defineDimensionsProps } from "../../../composables/useDimensions/useDimensions.js";
 const defineCdsListProps = propsFactory(

package/dist/es/src/components/CdsLoader/CdsLoader.vue_vue_type_script_setup_true_lang.js

@@ -1,9 +1,9 @@
 import { defineComponent, useAttrs, createVNode, unref, mergeProps } from "vue";
-import { p as provideTheme } from "../../composables/useTheme/useTheme.js";
 import { u as useDefaults } from "../../core/useDefaults.js";
 import { c as classNames } from "../../utils/dom/classNames.js";
 import { C as CdsLoaderConstants } from "./api/CdsLoader.constants.js";
 import { d as defineCdsLoaderProps } from "./api/CdsLoader.props.js";
+import { p as provideTheme } from "../../composables/useTheme/useTheme.js";
 import { u as useSize } from "../../composables/useSize/useSize.js";
 const _sfc_main = /* @__PURE__ */ defineComponent({
   ...{

package/dist/es/src/components/CdsNotification/CdsNotification.vue_vue_type_script_setup_true_lang.js

@@ -2,7 +2,6 @@ import { defineComponent, useSlots, toRef, unref, createVNode, mergeProps } from
 import { a as useLocale } from "../../composables/useLocale/useLocale.js";
 import { u as useStatus } from "../../composables/useStatus/useStatus.js";
 import { u as useText } from "../../composables/useText/useText.js";
-import { p as provideTheme } from "../../composables/useTheme/useTheme.js";
 import { u as useDefaults } from "../../core/useDefaults.js";
 import { u as useProxyModel } from "../../core/useProxyModel.js";
 import { c as classNames } from "../../utils/dom/classNames.js";
@@ -11,6 +10,7 @@ import { C as CdsFunctionalButton } from "../CdsFunctionalButton/index.js";
 import { C as CdsIcon } from "../CdsIcon/index.js";
 import { C as CdsNotificationConstants, n as notificationStatusIcons } from "./api/CdsNotification.constants.js";
 import { d as defineCdsNotificationProps } from "./api/CdsNotification.props.js";
+import { p as provideTheme } from "../../composables/useTheme/useTheme.js";
 import { a as useBackgroundColor, u as useTextColor } from "../../composables/useColor/useColor.js";
 const _sfc_main = /* @__PURE__ */ defineComponent({
   ...{

package/dist/es/src/components/CdsNotification/api/CdsNotification.props.js

@@ -1,11 +1,11 @@
 import { I as IconValue } from "../../../composables/useIcons/internal/useIcons.constants.js";
 import { d as defineStatusProps } from "../../../composables/useStatus/useStatus.js";
 import { d as defineTextProps } from "../../../composables/useText/useText.js";
-import { d as defineThemeProps } from "../../../composables/useTheme/useTheme.js";
 import { a as defineTagProps, d as defineComponentProps } from "../../../core/defineComponent.js";
 import { p as propsFactory } from "../../../core/propsFactory.js";
 import { a7 as pick } from "../../../utils/helpers.js";
 import { C as CdsNotificationConstants } from "./CdsNotification.constants.js";
+import { d as defineThemeProps } from "../../../composables/useTheme/useTheme.js";
 import { d as defineColorProps } from "../../../composables/useColor/useColor.js";
 const defineCdsNotificationProps = propsFactory(
   {

package/dist/es/src/components/CdsOtpInput/CdsOtpInput.vue_vue_type_script_setup_true_lang.js

@@ -3,7 +3,6 @@ import { C as CdsOverlay } from "../CdsOverlay/index.js";
 import { C as CdsProgressCircle } from "../CdsProgressCircle/index.js";
 import { u as useFocus, b as useAutofocus } from "../../composables/useFocus/useFocus.js";
 import { a as useLocale, u as useRtl } from "../../composables/useLocale/useLocale.js";
-import { p as provideTheme } from "../../composables/useTheme/useTheme.js";
 import { u as useDefaults, p as provideDefaults } from "../../core/useDefaults.js";
 import { u as useProxyModel } from "../../core/useProxyModel.js";
 import { D as filterInputAttrs } from "../../utils/helpers.js";
@@ -15,6 +14,7 @@ import { _ as _sfc_main$1 } from "./CdsOtpGroup.vue_vue_type_script_setup_true_l
 import { _ as _sfc_main$3 } from "./CdsOtpSeparator.vue_vue_type_script_setup_true_lang.js";
 import { u as useOtpInput } from "./composables/useOtpInput.js";
 import { I as Intersect } from "../../directives/intersect/index.js";
+import { p as provideTheme } from "../../composables/useTheme/useTheme.js";
 import { u as useDimensions } from "../../composables/useDimensions/useDimensions.js";
 import { u as useSize } from "../../composables/useSize/useSize.js";
 const _sfc_main = /* @__PURE__ */ defineComponent({

package/dist/es/src/components/CdsOtpInput/api/CdsOtpInput.props.js

@@ -1,10 +1,10 @@
 import { d as defineDisabledProps } from "../../../composables/useDisabled/useDisabled.js";
 import { d as defineFocusProps, a as defineAutofocusProps } from "../../../composables/useFocus/useFocus.js";
 import { d as defineLoaderProps } from "../../../composables/useLoader/useLoader.js";
-import { d as defineThemeProps } from "../../../composables/useTheme/useTheme.js";
 import { d as defineComponentProps } from "../../../core/defineComponent.js";
 import { p as propsFactory } from "../../../core/propsFactory.js";
 import { C as CdsOtpFieldConstants, a as CdsOtpGroupConstants, b as CdsOtpSeparatorConstants, c as CdsOtpInputConstants } from "./CdsOtpInput.constants.js";
+import { d as defineThemeProps } from "../../../composables/useTheme/useTheme.js";
 import { d as defineSizeProps } from "../../../composables/useSize/useSize.js";
 import { d as defineDimensionsProps } from "../../../composables/useDimensions/useDimensions.js";
 import { d as defineColorProps } from "../../../composables/useColor/useColor.js";

package/dist/es/src/components/CdsOverlay/CdsOverlay.vue_vue_type_script_setup_true_lang.js

@@ -7,7 +7,6 @@ import { a as useRouter, b as useBackButton } from "../../composables/useRouter/
 import { u as useScopeId } from "../../composables/useScopeId/useScopeId.js";
 import { u as useStack } from "../../composables/useStack/useStack.js";
 import { u as useTeleport } from "../../composables/useTeleport/useTeleport.js";
-import { p as provideTheme } from "../../composables/useTheme/useTheme.js";
 import { s as standardEasing, M as MaybeTransition } from "../../composables/useTransition/useTransition.js";
 import { g as getCurrentInstance } from "../../core/getCurrentInstance.js";
 import { u as useDefaults } from "../../core/useDefaults.js";
@@ -25,6 +24,7 @@ import { u as useActivator } from "./composables/useActivator.js";
 import { u as useLocationStrategies } from "./composables/useLocationStrategies.js";
 import { u as useScrollStrategies } from "./composables/useScrollStrategies.js";
 import { C as ClickOutside } from "../../directives/click-outside/index.js";
+import { p as provideTheme } from "../../composables/useTheme/useTheme.js";
 import { u as useDimensions } from "../../composables/useDimensions/useDimensions.js";
 import { a as useBackgroundColor } from "../../composables/useColor/useColor.js";
 const _sfc_main = /* @__PURE__ */ defineComponent({