@chayns-components/core 5.0.0-beta.797 → 5.0.0-beta.798

package/lib/esm/utils/pageProvider.js

@@ -0,0 +1,84 @@
+import { getEnvironment, getWindowMetrics } from 'chayns-api';
+import { PAGE_BREAKPOINTS } from '../constants/pageProvider';
+export const getPagePadding = () => {
+  const {
+    runtimeEnvironment
+  } = getEnvironment();
+  if (typeof runtimeEnvironment === 'number' && [4, 5].includes(runtimeEnvironment)) {
+    return '0';
+  }
+  if (matchMedia(PAGE_BREAKPOINTS.desktop).matches) {
+    return '35px 43px 30px';
+  }
+  return '15px 10px 20px';
+};
+const getPageProviderInformation = customPadding => {
+  const padding = (customPadding ?? getPagePadding()).split(' ');
+  const parseValue = value => {
+    const parsed = parseInt(value.replace('px', ''), 10);
+    return Number.isNaN(parsed) ? 0 : parsed;
+  };
+  if (padding.length === 1) {
+    const value = parseValue(padding[0] ?? '');
+    return {
+      top: value,
+      right: value,
+      bottom: value,
+      left: value
+    };
+  }
+  if (padding.length === 2) {
+    const [vertical, horizontal] = padding.map(parseValue);
+    return {
+      top: vertical ?? 0,
+      right: horizontal ?? 0,
+      bottom: vertical ?? 0,
+      left: horizontal ?? 0
+    };
+  }
+  if (padding.length === 3) {
+    const [top, horizontal, bottom] = padding.map(parseValue);
+    return {
+      top: top ?? 0,
+      right: horizontal ?? 0,
+      bottom: bottom ?? 0,
+      left: horizontal ?? 0
+    };
+  }
+  if (padding.length === 4) {
+    const [top, right, bottom, left] = padding.map(parseValue);
+    return {
+      top: top ?? 0,
+      right: right ?? 0,
+      bottom: bottom ?? 0,
+      left: left ?? 0
+    };
+  }
+  return {
+    top: 0,
+    right: 0,
+    bottom: 0,
+    left: 0
+  };
+};
+export const getUsableHeight = async customPadding => {
+  let usableHeight;
+  const {
+    bottomBarHeight,
+    topBarHeight,
+    windowHeight
+  } = await getWindowMetrics();
+  const {
+    top,
+    bottom
+  } = getPageProviderInformation(customPadding);
+  usableHeight = windowHeight - bottom - top;
+  if (bottomBarHeight) {
+    usableHeight -= bottomBarHeight;
+  }
+  if (topBarHeight) {
+    usableHeight -= topBarHeight;
+  }
+  return usableHeight;
+};
+//# sourceMappingURL=pageProvider.js.map

package/lib/esm/utils/pageProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"pageProvider.js","names":["getEnvironment","getWindowMetrics","PAGE_BREAKPOINTS","getPagePadding","runtimeEnvironment","includes","matchMedia","desktop","matches","getPageProviderInformation","customPadding","padding","split","parseValue","value","parsed","parseInt","replace","Number","isNaN","length","top","right","bottom","left","vertical","horizontal","map","getUsableHeight","usableHeight","bottomBarHeight","topBarHeight","windowHeight"],"sources":["../../../src/utils/pageProvider.ts"],"sourcesContent":["import { getEnvironment, getWindowMetrics } from 'chayns-api';\nimport { PAGE_BREAKPOINTS } from '../constants/pageProvider';\n\nexport const getPagePadding = () => {\n    const { runtimeEnvironment } = getEnvironment();\n\n    if (typeof runtimeEnvironment === 'number' && [4, 5].includes(runtimeEnvironment)) {\n        return '0';\n    }\n\n    if (matchMedia(PAGE_BREAKPOINTS.desktop).matches) {\n        return '35px 43px 30px';\n    }\n\n    return '15px 10px 20px';\n};\n\ntype PaddingValues = {\n    top: number;\n    right: number;\n    bottom: number;\n    left: number;\n};\n\nconst getPageProviderInformation = (customPadding?: string): PaddingValues => {\n    const padding = (customPadding ?? getPagePadding()).split(' ');\n\n    const parseValue = (value: string): number => {\n        const parsed = parseInt(value.replace('px', ''), 10);\n        return Number.isNaN(parsed) ? 0 : parsed;\n    };\n\n    if (padding.length === 1) {\n        const value = parseValue(padding[0] ?? '');\n        return { top: value, right: value, bottom: value, left: value };\n    }\n\n    if (padding.length === 2) {\n        const [vertical, horizontal] = padding.map(parseValue);\n        return {\n            top: vertical ?? 0,\n            right: horizontal ?? 0,\n            bottom: vertical ?? 0,\n            left: horizontal ?? 0,\n        };\n    }\n\n    if (padding.length === 3) {\n        const [top, horizontal, bottom] = padding.map(parseValue);\n        return {\n            top: top ?? 0,\n            right: horizontal ?? 0,\n            bottom: bottom ?? 0,\n            left: horizontal ?? 0,\n        };\n    }\n\n    if (padding.length === 4) {\n        const [top, right, bottom, left] = padding.map(parseValue);\n        return { top: top ?? 0, right: right ?? 0, bottom: bottom ?? 0, left: left ?? 0 };\n    }\n\n    return { top: 0, right: 0, bottom: 0, left: 0 };\n};\n\nexport const getUsableHeight = async (customPadding?: string) => {\n    let usableHeight;\n\n    const { bottomBarHeight, topBarHeight, windowHeight } = await getWindowMetrics();\n\n    const { top, bottom } = getPageProviderInformation(customPadding);\n\n    usableHeight = windowHeight - bottom - top;\n\n    if (bottomBarHeight) {\n        usableHeight -= bottomBarHeight;\n    }\n\n    if (topBarHeight) {\n        usableHeight -= topBarHeight;\n    }\n\n    return usableHeight;\n};\n"],"mappings":"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","ignoreList":[]}

package/lib/types/components/accordion/Accordion.styles.d.ts

@@ -11,6 +11,7 @@ export declare const StyledMotionAccordion: import("styled-components/dist/types
     slot?: string | undefined;
     title?: string | undefined;
     color?: string | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -18,7 +19,6 @@ export declare const StyledMotionAccordion: import("styled-components/dist/types
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;

package/lib/types/components/accordion/accordion-body/AccordionBody.styles.d.ts

@@ -8,6 +8,7 @@ export declare const StyledMotionAccordionBody: import("styled-components/dist/t
     slot?: string | undefined;
     title?: string | undefined;
     color?: string | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -15,7 +16,6 @@ export declare const StyledMotionAccordionBody: import("styled-components/dist/t
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;

package/lib/types/components/accordion/accordion-head/AccordionHead.styles.d.ts

@@ -4,6 +4,7 @@ export declare const StyledMotionAccordionHead: import("styled-components/dist/t
     slot?: string | undefined;
     title?: string | undefined;
     color?: string | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -11,7 +12,6 @@ export declare const StyledMotionAccordionHead: import("styled-components/dist/t
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;
@@ -269,6 +269,7 @@ export declare const StyledMotionIconWrapper: import("styled-components/dist/typ
     slot?: string | undefined;
     title?: string | undefined;
     color?: string | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -276,7 +277,6 @@ export declare const StyledMotionIconWrapper: import("styled-components/dist/typ
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;
@@ -538,6 +538,7 @@ export declare const StyledMotionContentWrapper: import("styled-components/dist/
     slot?: string | undefined;
     title?: string | undefined;
     color?: string | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -545,7 +546,6 @@ export declare const StyledMotionContentWrapper: import("styled-components/dist/
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;
@@ -803,6 +803,7 @@ export declare const StyledMotionTitleWrapper: import("styled-components/dist/ty
     slot?: string | undefined;
     title?: string | undefined;
     color?: string | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -810,7 +811,6 @@ export declare const StyledMotionTitleWrapper: import("styled-components/dist/ty
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;
@@ -1073,6 +1073,7 @@ export declare const StyledMotionTitle: import("styled-components/dist/types").I
     slot?: string | undefined;
     title?: string | undefined;
     color?: string | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -1080,7 +1081,6 @@ export declare const StyledMotionTitle: import("styled-components/dist/types").I
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;
@@ -1336,6 +1336,7 @@ export declare const StyledMotionTitleElementWrapper: import("styled-components/
     slot?: string | undefined;
     title?: string | undefined;
     color?: string | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -1343,7 +1344,6 @@ export declare const StyledMotionTitleElementWrapper: import("styled-components/
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;
@@ -1602,6 +1602,7 @@ export declare const StyledMotionSearchWrapper: import("styled-components/dist/t
     slot?: string | undefined;
     title?: string | undefined;
     color?: string | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -1609,7 +1610,6 @@ export declare const StyledMotionSearchWrapper: import("styled-components/dist/t
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;
@@ -1867,6 +1867,7 @@ export declare const StyledMotionRightElementWrapper: import("styled-components/
     slot?: string | undefined;
     title?: string | undefined;
     color?: string | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -1874,7 +1875,6 @@ export declare const StyledMotionRightElementWrapper: import("styled-components/
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;
@@ -2140,6 +2140,7 @@ export declare const StyledMotionRightInput: import("styled-components/dist/type
     size?: number | undefined;
     color?: string | undefined;
     type?: import("react").HTMLInputTypeAttribute | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -2147,7 +2148,6 @@ export declare const StyledMotionRightInput: import("styled-components/dist/type
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;
@@ -2429,6 +2429,7 @@ export declare const StyledMotionRightInputIconWrapper: import("styled-component
     slot?: string | undefined;
     title?: string | undefined;
     color?: string | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -2436,7 +2437,6 @@ export declare const StyledMotionRightInputIconWrapper: import("styled-component
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;

package/lib/types/components/amount-control/AmountControl.styles.d.ts

@@ -26,6 +26,7 @@ export declare const StyledMotionAmountControlButton: import("styled-components/
     value?: string | number | readonly string[] | undefined;
     color?: string | undefined;
     type?: "button" | "reset" | "submit" | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -33,7 +34,6 @@ export declare const StyledMotionAmountControlButton: import("styled-components/
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;

package/lib/types/components/button/Button.styles.d.ts

@@ -14,6 +14,7 @@ export declare const StyledMotionButton: import("styled-components/dist/types").
     value?: string | number | readonly string[] | undefined;
     color?: string | undefined;
     type?: "button" | "reset" | "submit" | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -21,7 +22,6 @@ export declare const StyledMotionButton: import("styled-components/dist/types").
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;
@@ -285,6 +285,7 @@ export declare const StyledMotionChildrenWrapper: import("styled-components/dist
     slot?: string | undefined;
     title?: string | undefined;
     color?: string | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -292,7 +293,6 @@ export declare const StyledMotionChildrenWrapper: import("styled-components/dist
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;
@@ -550,6 +550,7 @@ export declare const StyledMotionWaitCursorWrapper: import("styled-components/di
     slot?: string | undefined;
     title?: string | undefined;
     color?: string | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -557,7 +558,6 @@ export declare const StyledMotionWaitCursorWrapper: import("styled-components/di
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;

package/lib/types/components/color-scheme-provider/ColorSchemeProvider.d.ts

@@ -5,7 +5,7 @@ declare enum ColorMode {
     Dark = 1,
     Light = 2
 }
-type ColorSchemeProviderProps = {
+export type ColorSchemeProviderProps = {
     /**
      * The content of the application or the components for which the styles should be set
      */

package/lib/types/components/combobox/ComboBox.styles.d.ts

@@ -33,6 +33,7 @@ export declare const StyledMotionComboBoxBody: import("styled-components/dist/ty
     slot?: string | undefined;
     title?: string | undefined;
     color?: string | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -40,7 +41,6 @@ export declare const StyledMotionComboBoxBody: import("styled-components/dist/ty
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;

package/lib/types/components/context-menu/context-menu-content/ContextMenuContent.styles.d.ts

@@ -7,6 +7,7 @@ export declare const StyledMotionContextMenuContent: import("styled-components/d
     slot?: string | undefined;
     title?: string | undefined;
     color?: string | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -14,7 +15,6 @@ export declare const StyledMotionContextMenuContent: import("styled-components/d
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;

package/lib/types/components/expandable-content/ExpandableContent.styles.d.ts

@@ -5,6 +5,7 @@ export declare const StyledMotionExpandableContent: import("styled-components/di
     slot?: string | undefined;
     title?: string | undefined;
     color?: string | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -12,7 +13,6 @@ export declare const StyledMotionExpandableContent: import("styled-components/di
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;

package/lib/types/components/file-input/FileInput.styles.d.ts

@@ -19,6 +19,7 @@ export declare const StyledMotionFileInputList: import("styled-components/dist/t
     slot?: string | undefined;
     title?: string | undefined;
     color?: string | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -26,7 +27,6 @@ export declare const StyledMotionFileInputList: import("styled-components/dist/t
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;

package/lib/types/components/filter-buttons/filter-button/FilterButton.styles.d.ts

@@ -28,6 +28,7 @@ export declare const StyledMotionFilterButtonItemBackground: import("styled-comp
     slot?: string | undefined;
     title?: string | undefined;
     color?: string | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -35,7 +36,6 @@ export declare const StyledMotionFilterButtonItemBackground: import("styled-comp
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;

package/lib/types/components/input/Input.styles.d.ts

@@ -27,6 +27,7 @@ export declare const StyledMotionInputLabelWrapper: import("styled-components/di
     slot?: string | undefined;
     title?: string | undefined;
     color?: string | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -34,7 +35,6 @@ export declare const StyledMotionInputLabelWrapper: import("styled-components/di
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;
@@ -291,6 +291,7 @@ export declare const StyledMotionInputElement: import("styled-components/dist/ty
     slot?: string | undefined;
     title?: string | undefined;
     color?: string | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -298,7 +299,6 @@ export declare const StyledMotionInputElement: import("styled-components/dist/ty
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;
@@ -562,6 +562,7 @@ export declare const StyledMotionInputClearIcon: import("styled-components/dist/
     slot?: string | undefined;
     title?: string | undefined;
     color?: string | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -569,7 +570,6 @@ export declare const StyledMotionInputClearIcon: import("styled-components/dist/
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;

package/lib/types/components/list/list-item/ListItem.styles.d.ts

@@ -9,6 +9,7 @@ export declare const StyledMotionListItem: import("styled-components/dist/types"
     slot?: string | undefined;
     title?: string | undefined;
     color?: string | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -16,7 +17,6 @@ export declare const StyledMotionListItem: import("styled-components/dist/types"
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;

package/lib/types/components/list/list-item/list-item-body/ListItemBody.styles.d.ts

@@ -2,6 +2,7 @@ export declare const StyledMotionListItemBody: import("styled-components/dist/ty
     slot?: string | undefined;
     title?: string | undefined;
     color?: string | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -9,7 +10,6 @@ export declare const StyledMotionListItemBody: import("styled-components/dist/ty
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;

package/lib/types/components/list/list-item/list-item-head/ListItemHead.styles.d.ts

@@ -7,6 +7,7 @@ export declare const StyledListItemHead: import("styled-components/dist/types").
     slot?: string | undefined;
     title?: string | undefined;
     color?: string | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -14,7 +15,6 @@ export declare const StyledListItemHead: import("styled-components/dist/types").
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;
@@ -271,6 +271,7 @@ export declare const StyledMotionListItemHeadIndicator: import("styled-component
     slot?: string | undefined;
     title?: string | undefined;
     color?: string | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -278,7 +279,6 @@ export declare const StyledMotionListItemHeadIndicator: import("styled-component
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;
@@ -548,6 +548,7 @@ export declare const StyledListItemHeadTitleText: import("styled-components/dist
     slot?: string | undefined;
     title?: string | undefined;
     color?: string | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -555,7 +556,6 @@ export declare const StyledListItemHeadTitleText: import("styled-components/dist
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;
@@ -824,6 +824,7 @@ export declare const StyledMotionListItemHeadHoverItem: import("styled-component
     slot?: string | undefined;
     title?: string | undefined;
     color?: string | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -831,7 +832,6 @@ export declare const StyledMotionListItemHeadHoverItem: import("styled-component
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;

package/lib/types/components/mention-finder/MentionFinder.styles.d.ts

@@ -8,6 +8,7 @@ export declare const StyledMotionMentionFinderPopup: import("styled-components/d
     slot?: string | undefined;
     title?: string | undefined;
     color?: string | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -15,7 +16,6 @@ export declare const StyledMotionMentionFinderPopup: import("styled-components/d
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;

package/lib/types/components/page-provider/PageProvider.d.ts

@@ -0,0 +1,14 @@
+import { FC } from 'react';
+import { type ColorSchemeProviderProps } from '../color-scheme-provider/ColorSchemeProvider';
+interface PageProviderProps extends ColorSchemeProviderProps {
+    /**
+     * Whether the padding should be removed.
+     */
+    shouldRemovePadding?: boolean;
+    /**
+     * Whether the usable height should be used.
+     */
+    shouldUseUsableHeight?: boolean;
+}
+declare const PageProvider: FC<PageProviderProps>;
+export default PageProvider;

package/lib/types/components/page-provider/PageProvider.styles.d.ts

@@ -0,0 +1,7 @@
+import type { CSSProperties } from 'react';
+type StyledPageProviderProps = {
+    $padding?: CSSProperties['padding'];
+    $usableHeight?: CSSProperties['height'];
+};
+export declare const StyledPageProvider: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, StyledPageProviderProps>> & string;
+export {};

package/lib/types/components/popup/popup-content-wrapper/PopupContentWrapper.styles.d.ts

@@ -10,6 +10,7 @@ export declare const StyledMotionPopupContentWrapper: import("styled-components/
     slot?: string | undefined;
     title?: string | undefined;
     color?: string | undefined;
+    className?: string | undefined;
     rel?: string | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
@@ -17,7 +18,6 @@ export declare const StyledMotionPopupContentWrapper: import("styled-components/
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
     autoFocus?: boolean | undefined;
-    className?: string | undefined;
     contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;