@alfalab/core-components 45.6.0-beta.2 → 45.6.1

package/side-panel/components/controls/Component.js

@@ -4,7 +4,7 @@ var React = require('react');
 var cn = require('classnames');
 var coreComponentsShared = require('../../../shared');
 var ResponsiveContext = require('../../ResponsiveContext.js');
-var layout_module = require('../../layout.module-6a414a6a.js');
+var layout_module = require('../../layout.module-b337e3aa.js');
 
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
 

package/side-panel/components/footer/Component.js

@@ -5,7 +5,7 @@ var cn = require('classnames');
 var coreComponentsShared = require('../../../shared');
 var Context = require('../../Context.js');
 var ResponsiveContext = require('../../ResponsiveContext.js');
-var layout_module = require('../../layout.module-6a414a6a.js');
+var layout_module = require('../../layout.module-b337e3aa.js');
 
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
 

package/side-panel/cssm/Component.responsive.js

@@ -1,50 +1,44 @@
-import React, { forwardRef, useMemo, useContext } from 'react';
-import { useMatchMedia } from '../../mq/cssm';
-import { isClient } from '../../shared/cssm';
-import { Controls } from './components/controls/Component.js';
-import { Header } from './components/header/Component.js';
-import { SidePanelDesktop } from './desktop/Component.desktop.js';
-import { SidePanelMobile } from './mobile/Component.mobile.js';
-import { ResponsiveContext } from './ResponsiveContext.js';
-import 'classnames';
-import './layout.module-cf81db0c.js';
-import '../../navigation-bar/cssm';
-import './consts.js';
-import './Context.js';
-import '../../base-modal/cssm';
-import 'react-merge-refs';
-import '../../drawer/cssm';
-import './components/content/Component.desktop.js';
-import './components/content/Component.js';
-import './components/footer/Component.desktop.js';
-import './components/footer/Component.js';
-import './components/content/Component.mobile.js';
-import './components/footer/Component.mobile.js';
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var tslib = require('tslib');
+var React = require('react');
+var coreComponentsMq = require('../../mq/cssm');
+var coreComponentsShared = require('../../shared/cssm');
+var components_controls_Component = require('./components/controls/Component.js');
+var components_header_Component = require('./components/header/Component.js');
+var desktop_Component_desktop = require('./desktop/Component.desktop.js');
+var mobile_Component_mobile = require('./mobile/Component.mobile.js');
+var ResponsiveContext = require('./ResponsiveContext.js');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 
 function createResponsive(desktop, mobile) {
     // eslint-disable-next-line
     function ResponsiveChild(props) {
-        const { view = 'desktop' } = useContext(ResponsiveContext) || {};
-        const Child = view === 'desktop' ? desktop : mobile;
-        return React.createElement(Child, { ...props });
+        var _a = (React.useContext(ResponsiveContext.ResponsiveContext) || {}).view, view = _a === void 0 ? 'desktop' : _a;
+        var Child = view === 'desktop' ? desktop : mobile;
+        return React__default.default.createElement(Child, tslib.__assign({}, props));
     }
     return ResponsiveChild;
 }
-const SidePanelResponsiveComponent = forwardRef(({ children, breakpoint = 1024, size = 500, defaultMatchMediaValue, dataTestId, ...restProps }, ref) => {
-    const query = `(min-width: ${breakpoint}px)`;
-    const getDefaultValue = () => (isClient() ? window.matchMedia(query).matches : false);
-    const [isDesktop] = useMatchMedia(query, defaultMatchMediaValue ?? getDefaultValue);
-    const view = isDesktop ? 'desktop' : 'mobile';
-    const contextValue = useMemo(() => ({ view, size, dataTestId }), [view, size, dataTestId]);
-    const Component = isDesktop ? SidePanelDesktop : SidePanelMobile;
-    return (React.createElement(ResponsiveContext.Provider, { value: contextValue },
-        React.createElement(Component, { ref: ref, size: size, dataTestId: dataTestId, ...restProps }, children)));
+var SidePanelResponsiveComponent = React.forwardRef(function (_a, ref) {
+    var children = _a.children, _b = _a.breakpoint, breakpoint = _b === void 0 ? 1024 : _b, _c = _a.size, size = _c === void 0 ? 500 : _c, defaultMatchMediaValue = _a.defaultMatchMediaValue, dataTestId = _a.dataTestId, restProps = tslib.__rest(_a, ["children", "breakpoint", "size", "defaultMatchMediaValue", "dataTestId"]);
+    var query = "(min-width: ".concat(breakpoint, "px)");
+    var getDefaultValue = function () { return (coreComponentsShared.isClient() ? window.matchMedia(query).matches : false); };
+    var isDesktop = coreComponentsMq.useMatchMedia(query, defaultMatchMediaValue !== null && defaultMatchMediaValue !== void 0 ? defaultMatchMediaValue : getDefaultValue)[0];
+    var view = isDesktop ? 'desktop' : 'mobile';
+    var contextValue = React.useMemo(function () { return ({ view: view, size: size, dataTestId: dataTestId }); }, [view, size, dataTestId]);
+    var Component = isDesktop ? desktop_Component_desktop.SidePanelDesktop : mobile_Component_mobile.SidePanelMobile;
+    return (React__default.default.createElement(ResponsiveContext.ResponsiveContext.Provider, { value: contextValue },
+        React__default.default.createElement(Component, tslib.__assign({ ref: ref, size: size, dataTestId: dataTestId }, restProps), children)));
 });
-const SidePanelResponsive = Object.assign(SidePanelResponsiveComponent, {
-    Header,
-    Controls,
-    Content: createResponsive(SidePanelDesktop.Content, SidePanelMobile.Content),
-    Footer: createResponsive(SidePanelDesktop.Footer, SidePanelMobile.Footer),
+var SidePanelResponsive = Object.assign(SidePanelResponsiveComponent, {
+    Header: components_header_Component.Header,
+    Controls: components_controls_Component.Controls,
+    Content: createResponsive(desktop_Component_desktop.SidePanelDesktop.Content, mobile_Component_mobile.SidePanelMobile.Content),
+    Footer: createResponsive(desktop_Component_desktop.SidePanelDesktop.Footer, mobile_Component_mobile.SidePanelMobile.Footer),
 });
 
-export { SidePanelResponsive };
+exports.SidePanelResponsive = SidePanelResponsive;

package/side-panel/cssm/Context.js

@@ -1,5 +1,7 @@
-import { BaseModalContext } from '../../base-modal/cssm';
+Object.defineProperty(exports, '__esModule', { value: true });
 
-const ModalContext = BaseModalContext;
+var coreComponentsBaseModal = require('../../base-modal/cssm');
 
-export { ModalContext };
+var ModalContext = coreComponentsBaseModal.BaseModalContext;
+
+exports.ModalContext = ModalContext;

package/side-panel/cssm/ResponsiveContext.js

@@ -1,5 +1,11 @@
-import React from 'react';
+Object.defineProperty(exports, '__esModule', { value: true });
 
-const ResponsiveContext = React.createContext(null);
+var React = require('react');
 
-export { ResponsiveContext };
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+
+var ResponsiveContext = React__default.default.createContext(null);
+
+exports.ResponsiveContext = ResponsiveContext;

package/side-panel/cssm/components/content/Component.desktop.js

@@ -1,15 +1,21 @@
-import React from 'react';
-import cn from 'classnames';
-import { SIZE_TO_CLASSNAME_MAP } from '../../consts.js';
-import { Content } from './Component.js';
-import '../../../../shared/cssm';
-import '../../Context.js';
-import '../../../../base-modal/cssm';
-import '../../ResponsiveContext.js';
+Object.defineProperty(exports, '__esModule', { value: true });
 
-const styles = {"size-500":"size-500"};
-require('./desktop.css');
+var tslib = require('tslib');
+var React = require('react');
+var cn = require('classnames');
+var consts = require('../../consts.js');
+var components_content_Component = require('./Component.js');
+var styles = require('./desktop.module.css');
 
-const ContentDesktop = ({ size = 500, className, ...restProps }) => (React.createElement(Content, { className: cn(className, size && styles[SIZE_TO_CLASSNAME_MAP[size]]), ...restProps }));
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
 
-export { ContentDesktop };
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
+var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
+
+var ContentDesktop = function (_a) {
+    var _b = _a.size, size = _b === void 0 ? 500 : _b, className = _a.className, restProps = tslib.__rest(_a, ["size", "className"]);
+    return (React__default.default.createElement(components_content_Component.Content, tslib.__assign({ className: cn__default.default(className, size && styles__default.default[consts.SIZE_TO_CLASSNAME_MAP[size]]) }, restProps)));
+};
+
+exports.ContentDesktop = ContentDesktop;

package/side-panel/cssm/components/content/Component.js

@@ -1,19 +1,26 @@
-import React, { useContext } from 'react';
-import cn from 'classnames';
-import { getDataTestId } from '../../../../shared/cssm';
-import { ModalContext } from '../../Context.js';
-import { ResponsiveContext } from '../../ResponsiveContext.js';
-import '../../../../base-modal/cssm';
+Object.defineProperty(exports, '__esModule', { value: true });
 
-const styles = {"content":"content","withHeader":"withHeader","flex":"flex"};
-require('./index.css');
+var React = require('react');
+var cn = require('classnames');
+var coreComponentsShared = require('../../../../shared/cssm');
+var Context = require('../../Context.js');
+var ResponsiveContext = require('../../ResponsiveContext.js');
+var styles = require('./index.module.css');
 
-const Content = ({ children, className, dataTestId }) => {
-    const { contentRef, hasHeader } = useContext(ModalContext);
-    const responsiveContext = useContext(ResponsiveContext);
-    return (React.createElement("div", { className: cn(styles.content, className, styles.flex, {
-            [styles.withHeader]: hasHeader,
-        }), ref: contentRef, "data-test-id": dataTestId || getDataTestId(responsiveContext?.dataTestId, 'content') }, children));
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
+var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
+
+var Content = function (_a) {
+    var _b;
+    var children = _a.children, className = _a.className, dataTestId = _a.dataTestId;
+    var _c = React.useContext(Context.ModalContext), contentRef = _c.contentRef, hasHeader = _c.hasHeader;
+    var responsiveContext = React.useContext(ResponsiveContext.ResponsiveContext);
+    return (React__default.default.createElement("div", { className: cn__default.default(styles__default.default.content, className, styles__default.default.flex, (_b = {},
+            _b[styles__default.default.withHeader] = hasHeader,
+            _b)), ref: contentRef, "data-test-id": dataTestId || coreComponentsShared.getDataTestId(responsiveContext === null || responsiveContext === void 0 ? void 0 : responsiveContext.dataTestId, 'content') }, children));
 };
 
-export { Content };
+exports.Content = Content;

package/side-panel/cssm/components/content/Component.mobile.js

@@ -1,14 +1,20 @@
-import React from 'react';
-import cn from 'classnames';
-import { Content } from './Component.js';
-import '../../../../shared/cssm';
-import '../../Context.js';
-import '../../../../base-modal/cssm';
-import '../../ResponsiveContext.js';
+Object.defineProperty(exports, '__esModule', { value: true });
 
-const styles = {"content":"content"};
-require('./mobile.css');
+var tslib = require('tslib');
+var React = require('react');
+var cn = require('classnames');
+var components_content_Component = require('./Component.js');
+var styles = require('./mobile.module.css');
 
-const ContentMobile = ({ className, ...restProps }) => (React.createElement(Content, { className: cn(className, styles.content), ...restProps }));
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
 
-export { ContentMobile };
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
+var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
+
+var ContentMobile = function (_a) {
+    var className = _a.className, restProps = tslib.__rest(_a, ["className"]);
+    return (React__default.default.createElement(components_content_Component.Content, tslib.__assign({ className: cn__default.default(className, styles__default.default.content) }, restProps)));
+};
+
+exports.ContentMobile = ContentMobile;

package/side-panel/cssm/components/content/desktop.module.css

@@ -0,0 +1,36 @@
+:root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
+} /* deprecated */ :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
+} :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
+} :root {
+} :root {
+
+    /* Hard */
+
+    /* Up */
+
+    /* Hard up */
+} :root {
+} :root {
+    --gap-2xl: 32px;
+    --gap-3xl: 40px;
+} :root {
+} :root {
+} :root {
+
+    /* sizes */
+
+    /* paddings */
+    --side-panel-s-content-paddings: var(--gap-3xl) var(--gap-3xl) 0;
+
+    /* scroll */
+
+    /* desktop */
+
+    /* mobile */
+
+    /* paddings */
+} .size-500 {
+    padding: var(--side-panel-s-content-paddings)
+} .size-500:last-child {
+        padding-bottom: var(--gap-2xl);
+    }

package/side-panel/cssm/components/content/index.module.css

@@ -0,0 +1,38 @@
+:root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
+} /* deprecated */ :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
+} :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
+} :root {
+} :root {
+
+    /* Hard */
+
+    /* Up */
+
+    /* Hard up */
+} :root {
+} :root {
+} :root {
+} :root {
+} :root {
+
+    /* sizes */
+
+    /* paddings */
+
+    /* scroll */
+
+    /* desktop */
+
+    /* mobile */
+
+    /* paddings */
+} .content {
+    position: relative;
+    box-sizing: border-box;
+    width: 100%;
+    z-index: 0
+} .content.withHeader {
+        padding-top: 0;
+    } .flex {
+    flex: 1 1 auto;
+}

package/side-panel/cssm/components/content/mobile.module.css

@@ -0,0 +1,34 @@
+:root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
+} /* deprecated */ :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
+} :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
+} :root {
+} :root {
+
+    /* Hard */
+
+    /* Up */
+
+    /* Hard up */
+} :root {
+} :root {
+    --gap-m: 16px;
+} :root {
+} :root {
+} :root {
+
+    /* sizes */
+
+    /* paddings */
+
+    /* scroll */
+
+    /* desktop */
+
+    /* mobile */
+
+    /* paddings */
+} .content {
+    padding: var(--gap-m) var(--gap-m) 0
+} .content:last-child {
+        padding-bottom: var(--gap-m);
+    }

package/side-panel/cssm/components/controls/Component.js

@@ -1,22 +1,30 @@
-import React, { useContext } from 'react';
-import cn from 'classnames';
-import { getDataTestId } from '../../../../shared/cssm';
-import { ResponsiveContext } from '../../ResponsiveContext.js';
-import { l as layoutStyles } from '../../layout.module-cf81db0c.js';
+Object.defineProperty(exports, '__esModule', { value: true });
 
-const styles = {"component":"component"};
-require('./index.css');
+var React = require('react');
+var cn = require('classnames');
+var coreComponentsShared = require('../../../../shared/cssm');
+var ResponsiveContext = require('../../ResponsiveContext.js');
+var layoutStyles = require('../footer/layout.module.css');
+var styles = require('./index.module.css');
 
-const Controls = ({ primary, secondary, gap, layout: layoutProp = 'start', mobileLayout = layoutProp, }) => {
-    const context = useContext(ResponsiveContext);
-    const { view = 'desktop', dataTestId } = context || {};
-    const layout = view === 'mobile' ? mobileLayout : layoutProp;
-    const shouldReverse = view === 'mobile' && layout !== 'column';
-    return (React.createElement("div", { "data-test-id": getDataTestId(dataTestId, 'controls'), className: cn(styles.component, layoutStyles[layout], gap && layoutStyles[`gap-${gap}`]) }, shouldReverse ? (React.createElement(React.Fragment, null,
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
+var layoutStyles__default = /*#__PURE__*/_interopDefaultCompat(layoutStyles);
+var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
+
+var Controls = function (_a) {
+    var primary = _a.primary, secondary = _a.secondary, gap = _a.gap, _b = _a.layout, layoutProp = _b === void 0 ? 'start' : _b, _c = _a.mobileLayout, mobileLayout = _c === void 0 ? layoutProp : _c;
+    var context = React.useContext(ResponsiveContext.ResponsiveContext);
+    var _d = context || {}, _e = _d.view, view = _e === void 0 ? 'desktop' : _e, dataTestId = _d.dataTestId;
+    var layout = view === 'mobile' ? mobileLayout : layoutProp;
+    var shouldReverse = view === 'mobile' && layout !== 'column';
+    return (React__default.default.createElement("div", { "data-test-id": coreComponentsShared.getDataTestId(dataTestId, 'controls'), className: cn__default.default(styles__default.default.component, layoutStyles__default.default[layout], gap && layoutStyles__default.default["gap-".concat(gap)]) }, shouldReverse ? (React__default.default.createElement(React__default.default.Fragment, null,
         secondary,
-        primary)) : (React.createElement(React.Fragment, null,
+        primary)) : (React__default.default.createElement(React__default.default.Fragment, null,
         primary,
         secondary))));
 };
 
-export { Controls };
+exports.Controls = Controls;

package/side-panel/cssm/components/controls/index.js

@@ -1,6 +1,7 @@
-export { Controls } from './Component.js';
-import 'react';
-import 'classnames';
-import '../../../../shared/cssm';
-import '../../ResponsiveContext.js';
-import '../../layout.module-cf81db0c.js';
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var components_controls_Component = require('./Component.js');
+
+
+
+exports.Controls = components_controls_Component.Controls;

package/side-panel/cssm/components/controls/index.module.css

@@ -0,0 +1,3 @@
+.component {
+    width: 100%;
+}

package/side-panel/cssm/components/footer/Component.desktop.js

@@ -1,18 +1,24 @@
-import React from 'react';
-import cn from 'classnames';
-import { SIZE_TO_CLASSNAME_MAP } from '../../consts.js';
-import { Footer } from './Component.js';
-import '../../../../shared/cssm';
-import '../../Context.js';
-import '../../../../base-modal/cssm';
-import '../../ResponsiveContext.js';
-import '../../layout.module-cf81db0c.js';
+Object.defineProperty(exports, '__esModule', { value: true });
 
-const styles = {"sticky":"sticky","size-500":"size-500"};
-require('./desktop.css');
+var tslib = require('tslib');
+var React = require('react');
+var cn = require('classnames');
+var consts = require('../../consts.js');
+var components_footer_Component = require('./Component.js');
+var styles = require('./desktop.module.css');
 
-const FooterDesktop = ({ size = 500, className, sticky, ...restProps }) => (React.createElement(Footer, { className: cn(className, size && styles[SIZE_TO_CLASSNAME_MAP[size]], {
-        [styles.sticky]: sticky,
-    }), sticky: sticky, ...restProps }));
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
 
-export { FooterDesktop };
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
+var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
+
+var FooterDesktop = function (_a) {
+    var _b;
+    var _c = _a.size, size = _c === void 0 ? 500 : _c, className = _a.className, sticky = _a.sticky, restProps = tslib.__rest(_a, ["size", "className", "sticky"]);
+    return (React__default.default.createElement(components_footer_Component.Footer, tslib.__assign({ className: cn__default.default(className, size && styles__default.default[consts.SIZE_TO_CLASSNAME_MAP[size]], (_b = {},
+            _b[styles__default.default.sticky] = sticky,
+            _b)), sticky: sticky }, restProps)));
+};
+
+exports.FooterDesktop = FooterDesktop;

package/side-panel/cssm/components/footer/Component.js

@@ -1,24 +1,32 @@
-import React, { useContext, useEffect } from 'react';
-import cn from 'classnames';
-import { getDataTestId } from '../../../../shared/cssm';
-import { ModalContext } from '../../Context.js';
-import { ResponsiveContext } from '../../ResponsiveContext.js';
-import { l as layoutStyles } from '../../layout.module-cf81db0c.js';
-import '../../../../base-modal/cssm';
+Object.defineProperty(exports, '__esModule', { value: true });
 
-const styles = {"footer":"footer","sticky":"sticky","highlighted":"highlighted"};
-require('./index.css');
+var React = require('react');
+var cn = require('classnames');
+var coreComponentsShared = require('../../../../shared/cssm');
+var Context = require('../../Context.js');
+var ResponsiveContext = require('../../ResponsiveContext.js');
+var styles = require('./index.module.css');
+var layoutStyles = require('./layout.module.css');
 
-const Footer = ({ children, className, sticky, layout = 'start', gap, dataTestId, }) => {
-    const { footerHighlighted, setHasFooter } = useContext(ModalContext);
-    const responsiveContext = useContext(ResponsiveContext);
-    useEffect(() => {
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
+var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
+var layoutStyles__default = /*#__PURE__*/_interopDefaultCompat(layoutStyles);
+
+var Footer = function (_a) {
+    var _b;
+    var children = _a.children, className = _a.className, sticky = _a.sticky, _c = _a.layout, layout = _c === void 0 ? 'start' : _c, gap = _a.gap, dataTestId = _a.dataTestId;
+    var _d = React.useContext(Context.ModalContext), footerHighlighted = _d.footerHighlighted, setHasFooter = _d.setHasFooter;
+    var responsiveContext = React.useContext(ResponsiveContext.ResponsiveContext);
+    React.useEffect(function () {
         setHasFooter(true);
     }, [setHasFooter]);
-    return (React.createElement("div", { className: cn(styles.footer, className, layoutStyles[layout], gap && layoutStyles[`gap-${gap}`], {
-            [styles.highlighted]: sticky && footerHighlighted,
-            [styles.sticky]: sticky,
-        }), "data-test-id": dataTestId || getDataTestId(responsiveContext?.dataTestId, 'footer') }, children));
+    return (React__default.default.createElement("div", { className: cn__default.default(styles__default.default.footer, className, layoutStyles__default.default[layout], gap && layoutStyles__default.default["gap-".concat(gap)], (_b = {},
+            _b[styles__default.default.highlighted] = sticky && footerHighlighted,
+            _b[styles__default.default.sticky] = sticky,
+            _b)), "data-test-id": dataTestId || coreComponentsShared.getDataTestId(responsiveContext === null || responsiveContext === void 0 ? void 0 : responsiveContext.dataTestId, 'footer') }, children));
 };
 
-export { Footer };
+exports.Footer = Footer;

package/side-panel/cssm/components/footer/Component.mobile.js

@@ -1,17 +1,23 @@
-import React from 'react';
-import cn from 'classnames';
-import { Footer } from './Component.js';
-import '../../../../shared/cssm';
-import '../../Context.js';
-import '../../../../base-modal/cssm';
-import '../../ResponsiveContext.js';
-import '../../layout.module-cf81db0c.js';
+Object.defineProperty(exports, '__esModule', { value: true });
 
-const styles = {"footer":"footer","sticky":"sticky"};
-require('./mobile.css');
+var tslib = require('tslib');
+var React = require('react');
+var cn = require('classnames');
+var components_footer_Component = require('./Component.js');
+var styles = require('./mobile.module.css');
 
-const FooterMobile = ({ className, sticky, layout = 'start', ...restProps }) => (React.createElement(Footer, { className: cn(className, styles.footer, {
-        [styles.sticky]: sticky,
-    }), sticky: sticky, layout: layout, ...restProps }));
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
 
-export { FooterMobile };
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
+var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
+
+var FooterMobile = function (_a) {
+    var _b;
+    var className = _a.className, sticky = _a.sticky, _c = _a.layout, layout = _c === void 0 ? 'start' : _c, restProps = tslib.__rest(_a, ["className", "sticky", "layout"]);
+    return (React__default.default.createElement(components_footer_Component.Footer, tslib.__assign({ className: cn__default.default(className, styles__default.default.footer, (_b = {},
+            _b[styles__default.default.sticky] = sticky,
+            _b)), sticky: sticky, layout: layout }, restProps)));
+};
+
+exports.FooterMobile = FooterMobile;

package/side-panel/cssm/components/footer/desktop.module.css

@@ -0,0 +1,36 @@
+:root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
+} /* deprecated */ :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
+} :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
+} :root {
+} :root {
+
+    /* Hard */
+
+    /* Up */
+
+    /* Hard up */
+} :root {
+} :root {
+    --gap-xl: 24px;
+    --gap-3xl: 40px;
+} :root {
+} :root {
+} :root {
+
+    /* sizes */
+
+    /* paddings */
+    --side-panel-s-footer-paddings: var(--gap-xl) var(--gap-3xl) var(--gap-3xl);
+
+    /* scroll */
+
+    /* desktop */
+
+    /* mobile */
+
+    /* paddings */
+} .sticky {
+    bottom: 0;
+} .size-500 {
+    padding: var(--side-panel-s-footer-paddings);
+}