@amboss/design-system 1.15.2 → 1.15.3

package/build/esm/src/components/Callout/Callout.js

@@ -0,0 +1,96 @@
+import _styled from '@emotion/styled/base';
+import React from 'react';
+import { Icon } from '../Icon/Icon.js';
+import { Inline } from '../Inline/Inline.js';
+import { Stack } from '../Stack/Stack.js';
+import { Text } from '../Typography/Text/Text.js';
+
+function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
+const defaultProps = {
+  icon: "info",
+  type: "info",
+  "data-e2e-test-id": undefined
+};
+const StyledContainer = /*#__PURE__*/_styled("div", process.env.NODE_ENV === "production" ? {
+  target: "evdfhap1"
+} : {
+  target: "evdfhap1",
+  label: "StyledContainer"
+})(_ref => {
+  let {
+    theme,
+    type
+  } = _ref;
+  return {
+    display: "flex",
+    borderRadius: theme.variables.size.borderRadius.button.m,
+    padding: theme.variables.size.spacing.m,
+    lineHeight: theme.variables.size.lineHeight.callout.s,
+    color: theme.values.color.text[type].default,
+    backgroundColor: theme.values.color.background[`${type}Subtle`].default,
+    svg: {
+      color: theme.values.color.icon[type]
+    },
+    ...{
+      "a,button,p": {
+        color: "inherit",
+        "&:hover": {
+          color: "inherit"
+        },
+        "& button": {
+          fontWeight: "inherit",
+          fontSize: "inherit",
+          lineHeight: "inherit"
+        }
+      }
+    }
+  };
+}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkNhbGxvdXQudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXNCd0IiLCJmaWxlIjoiQ2FsbG91dC50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgUmVhY3QsIHsgUmVhY3RFbGVtZW50IH0gZnJvbSBcInJlYWN0XCI7XG5pbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcbmltcG9ydCB7IEljb25OYW1lLCBJY29uIH0gZnJvbSBcIi4uL0ljb24vSWNvblwiO1xuaW1wb3J0IHsgSW5saW5lIH0gZnJvbSBcIi4uL0lubGluZS9JbmxpbmVcIjtcbmltcG9ydCB7IFN0YWNrIH0gZnJvbSBcIi4uL1N0YWNrL1N0YWNrXCI7XG5pbXBvcnQgeyBUZXh0IH0gZnJvbSBcIi4uL1R5cG9ncmFwaHkvVGV4dC9UZXh0XCI7XG5pbXBvcnQgeyBDYWxsb3V0VmFyaWF0aW9ucyB9IGZyb20gXCIuLi8uLi90eXBlc1wiO1xuXG5leHBvcnQgdHlwZSBDYWxsb3V0UHJvcHMgPSB7XG4gIHR5cGU/OiBDYWxsb3V0VmFyaWF0aW9ucztcbiAgaWNvbj86IEljb25OYW1lO1xuICBcImRhdGEtZTJlLXRlc3QtaWRcIj86IHN0cmluZztcbiAgdGV4dDogc3RyaW5nIHwgUmVhY3RFbGVtZW50O1xuICBkZXNjcmlwdGlvbj86IHN0cmluZyB8IFJlYWN0RWxlbWVudDtcbn07XG5cbmNvbnN0IGRlZmF1bHRQcm9wczogUGFydGlhbDxDYWxsb3V0UHJvcHM+ID0ge1xuICBpY29uOiBcImluZm9cIixcbiAgdHlwZTogXCJpbmZvXCIsXG4gIFwiZGF0YS1lMmUtdGVzdC1pZFwiOiB1bmRlZmluZWQsXG59O1xuXG5jb25zdCBTdHlsZWRDb250YWluZXIgPSBzdHlsZWQuZGl2PFBhcnRpYWw8Q2FsbG91dFByb3BzPj4oXG4gICh7IHRoZW1lLCB0eXBlIH0pID0+ICh7XG4gICAgZGlzcGxheTogXCJmbGV4XCIsXG4gICAgYm9yZGVyUmFkaXVzOiB0aGVtZS52YXJpYWJsZXMuc2l6ZS5ib3JkZXJSYWRpdXMuYnV0dG9uLm0sXG4gICAgcGFkZGluZzogdGhlbWUudmFyaWFibGVzLnNpemUuc3BhY2luZy5tLFxuICAgIGxpbmVIZWlnaHQ6IHRoZW1lLnZhcmlhYmxlcy5zaXplLmxpbmVIZWlnaHQuY2FsbG91dC5zLFxuICAgIGNvbG9yOiB0aGVtZS52YWx1ZXMuY29sb3IudGV4dFt0eXBlXS5kZWZhdWx0LFxuICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUudmFsdWVzLmNvbG9yLmJhY2tncm91bmRbYCR7dHlwZX1TdWJ0bGVgXS5kZWZhdWx0LFxuICAgIHN2Zzoge1xuICAgICAgY29sb3I6IHRoZW1lLnZhbHVlcy5jb2xvci5pY29uW3R5cGVdLFxuICAgIH0sXG4gICAgLi4ue1xuICAgICAgXCJhLGJ1dHRvbixwXCI6IHtcbiAgICAgICAgY29sb3I6IFwiaW5oZXJpdFwiLFxuICAgICAgICBcIiY6aG92ZXJcIjoge1xuICAgICAgICAgIGNvbG9yOiBcImluaGVyaXRcIixcbiAgICAgICAgfSxcbiAgICAgICAgXCImIGJ1dHRvblwiOiB7XG4gICAgICAgICAgZm9udFdlaWdodDogXCJpbmhlcml0XCIsXG4gICAgICAgICAgZm9udFNpemU6IFwiaW5oZXJpdFwiLFxuICAgICAgICAgIGxpbmVIZWlnaHQ6IFwiaW5oZXJpdFwiLFxuICAgICAgICB9LFxuICAgICAgfSxcbiAgICB9LFxuICB9KVxuKTtcblxuY29uc3QgU3R5bGVkSWNvbkNvbnRhaW5lciA9IHN0eWxlZC5kaXYoe1xuICBwYWRkaW5nVG9wOiBcIjFweFwiLFxufSk7XG5cbmV4cG9ydCBmdW5jdGlvbiBDYWxsb3V0KHtcbiAgdGV4dCxcbiAgZGVzY3JpcHRpb24sXG4gIHR5cGUsXG4gIGljb24sXG4gIFwiZGF0YS1lMmUtdGVzdC1pZFwiOiBkYXRhRTJlVGVzdElkLFxufTogQ2FsbG91dFByb3BzKTogUmVhY3QuUmVhY3RFbGVtZW50IHtcbiAgY29uc3QgdGl0bGVGb250V2VpZ2h0ID0gZGVzY3JpcHRpb24gPyBcImJvbGRcIiA6IFwibm9ybWFsXCI7XG5cbiAgcmV0dXJuIChcbiAgICA8U3R5bGVkQ29udGFpbmVyXG4gICAgICBkYXRhLWUyZS10ZXN0LWlkPXtkYXRhRTJlVGVzdElkfVxuICAgICAgZGF0YS1kcy1pZD1cIkNhbGxvdXRcIlxuICAgICAgdHlwZT17dHlwZX1cbiAgICA+XG4gICAgICA8SW5saW5lIHZBbGlnbkl0ZW1zPVwidG9wXCIgc3BhY2U9XCJ4c1wiIG5vV3JhcD5cbiAgICAgICAgPFN0eWxlZEljb25Db250YWluZXI+XG4gICAgICAgICAgPEljb24gbmFtZT17aWNvbn0gY29sb3I9XCJpbmhlcml0XCIgc2l6ZT1cInNcIiAvPlxuICAgICAgICA8L1N0eWxlZEljb25Db250YWluZXI+XG4gICAgICAgIDxTdGFjayBzcGFjZT1cInh4c1wiPlxuICAgICAgICAgIDxUZXh0IHdlaWdodD17dGl0bGVGb250V2VpZ2h0fSBzaXplPVwic1wiPlxuICAgICAgICAgICAge3RleHR9XG4gICAgICAgICAgPC9UZXh0PlxuICAgICAgICAgIHtkZXNjcmlwdGlvbiAmJiA8VGV4dCBzaXplPVwic1wiPntkZXNjcmlwdGlvbn08L1RleHQ+fVxuICAgICAgICA8L1N0YWNrPlxuICAgICAgPC9JbmxpbmU+XG4gICAgPC9TdHlsZWRDb250YWluZXI+XG4gICk7XG59XG5cbkNhbGxvdXQuZGVmYXVsdFByb3BzID0gZGVmYXVsdFByb3BzO1xuIl19 */");
+const StyledIconContainer = /*#__PURE__*/_styled("div", process.env.NODE_ENV === "production" ? {
+  target: "evdfhap0"
+} : {
+  target: "evdfhap0",
+  label: "StyledIconContainer"
+})(process.env.NODE_ENV === "production" ? {
+  name: "1pjpfnb",
+  styles: "padding-top:1px"
+} : {
+  name: "1pjpfnb",
+  styles: "padding-top:1px",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkNhbGxvdXQudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWlENEIiLCJmaWxlIjoiQ2FsbG91dC50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgUmVhY3QsIHsgUmVhY3RFbGVtZW50IH0gZnJvbSBcInJlYWN0XCI7XG5pbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcbmltcG9ydCB7IEljb25OYW1lLCBJY29uIH0gZnJvbSBcIi4uL0ljb24vSWNvblwiO1xuaW1wb3J0IHsgSW5saW5lIH0gZnJvbSBcIi4uL0lubGluZS9JbmxpbmVcIjtcbmltcG9ydCB7IFN0YWNrIH0gZnJvbSBcIi4uL1N0YWNrL1N0YWNrXCI7XG5pbXBvcnQgeyBUZXh0IH0gZnJvbSBcIi4uL1R5cG9ncmFwaHkvVGV4dC9UZXh0XCI7XG5pbXBvcnQgeyBDYWxsb3V0VmFyaWF0aW9ucyB9IGZyb20gXCIuLi8uLi90eXBlc1wiO1xuXG5leHBvcnQgdHlwZSBDYWxsb3V0UHJvcHMgPSB7XG4gIHR5cGU/OiBDYWxsb3V0VmFyaWF0aW9ucztcbiAgaWNvbj86IEljb25OYW1lO1xuICBcImRhdGEtZTJlLXRlc3QtaWRcIj86IHN0cmluZztcbiAgdGV4dDogc3RyaW5nIHwgUmVhY3RFbGVtZW50O1xuICBkZXNjcmlwdGlvbj86IHN0cmluZyB8IFJlYWN0RWxlbWVudDtcbn07XG5cbmNvbnN0IGRlZmF1bHRQcm9wczogUGFydGlhbDxDYWxsb3V0UHJvcHM+ID0ge1xuICBpY29uOiBcImluZm9cIixcbiAgdHlwZTogXCJpbmZvXCIsXG4gIFwiZGF0YS1lMmUtdGVzdC1pZFwiOiB1bmRlZmluZWQsXG59O1xuXG5jb25zdCBTdHlsZWRDb250YWluZXIgPSBzdHlsZWQuZGl2PFBhcnRpYWw8Q2FsbG91dFByb3BzPj4oXG4gICh7IHRoZW1lLCB0eXBlIH0pID0+ICh7XG4gICAgZGlzcGxheTogXCJmbGV4XCIsXG4gICAgYm9yZGVyUmFkaXVzOiB0aGVtZS52YXJpYWJsZXMuc2l6ZS5ib3JkZXJSYWRpdXMuYnV0dG9uLm0sXG4gICAgcGFkZGluZzogdGhlbWUudmFyaWFibGVzLnNpemUuc3BhY2luZy5tLFxuICAgIGxpbmVIZWlnaHQ6IHRoZW1lLnZhcmlhYmxlcy5zaXplLmxpbmVIZWlnaHQuY2FsbG91dC5zLFxuICAgIGNvbG9yOiB0aGVtZS52YWx1ZXMuY29sb3IudGV4dFt0eXBlXS5kZWZhdWx0LFxuICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUudmFsdWVzLmNvbG9yLmJhY2tncm91bmRbYCR7dHlwZX1TdWJ0bGVgXS5kZWZhdWx0LFxuICAgIHN2Zzoge1xuICAgICAgY29sb3I6IHRoZW1lLnZhbHVlcy5jb2xvci5pY29uW3R5cGVdLFxuICAgIH0sXG4gICAgLi4ue1xuICAgICAgXCJhLGJ1dHRvbixwXCI6IHtcbiAgICAgICAgY29sb3I6IFwiaW5oZXJpdFwiLFxuICAgICAgICBcIiY6aG92ZXJcIjoge1xuICAgICAgICAgIGNvbG9yOiBcImluaGVyaXRcIixcbiAgICAgICAgfSxcbiAgICAgICAgXCImIGJ1dHRvblwiOiB7XG4gICAgICAgICAgZm9udFdlaWdodDogXCJpbmhlcml0XCIsXG4gICAgICAgICAgZm9udFNpemU6IFwiaW5oZXJpdFwiLFxuICAgICAgICAgIGxpbmVIZWlnaHQ6IFwiaW5oZXJpdFwiLFxuICAgICAgICB9LFxuICAgICAgfSxcbiAgICB9LFxuICB9KVxuKTtcblxuY29uc3QgU3R5bGVkSWNvbkNvbnRhaW5lciA9IHN0eWxlZC5kaXYoe1xuICBwYWRkaW5nVG9wOiBcIjFweFwiLFxufSk7XG5cbmV4cG9ydCBmdW5jdGlvbiBDYWxsb3V0KHtcbiAgdGV4dCxcbiAgZGVzY3JpcHRpb24sXG4gIHR5cGUsXG4gIGljb24sXG4gIFwiZGF0YS1lMmUtdGVzdC1pZFwiOiBkYXRhRTJlVGVzdElkLFxufTogQ2FsbG91dFByb3BzKTogUmVhY3QuUmVhY3RFbGVtZW50IHtcbiAgY29uc3QgdGl0bGVGb250V2VpZ2h0ID0gZGVzY3JpcHRpb24gPyBcImJvbGRcIiA6IFwibm9ybWFsXCI7XG5cbiAgcmV0dXJuIChcbiAgICA8U3R5bGVkQ29udGFpbmVyXG4gICAgICBkYXRhLWUyZS10ZXN0LWlkPXtkYXRhRTJlVGVzdElkfVxuICAgICAgZGF0YS1kcy1pZD1cIkNhbGxvdXRcIlxuICAgICAgdHlwZT17dHlwZX1cbiAgICA+XG4gICAgICA8SW5saW5lIHZBbGlnbkl0ZW1zPVwidG9wXCIgc3BhY2U9XCJ4c1wiIG5vV3JhcD5cbiAgICAgICAgPFN0eWxlZEljb25Db250YWluZXI+XG4gICAgICAgICAgPEljb24gbmFtZT17aWNvbn0gY29sb3I9XCJpbmhlcml0XCIgc2l6ZT1cInNcIiAvPlxuICAgICAgICA8L1N0eWxlZEljb25Db250YWluZXI+XG4gICAgICAgIDxTdGFjayBzcGFjZT1cInh4c1wiPlxuICAgICAgICAgIDxUZXh0IHdlaWdodD17dGl0bGVGb250V2VpZ2h0fSBzaXplPVwic1wiPlxuICAgICAgICAgICAge3RleHR9XG4gICAgICAgICAgPC9UZXh0PlxuICAgICAgICAgIHtkZXNjcmlwdGlvbiAmJiA8VGV4dCBzaXplPVwic1wiPntkZXNjcmlwdGlvbn08L1RleHQ+fVxuICAgICAgICA8L1N0YWNrPlxuICAgICAgPC9JbmxpbmU+XG4gICAgPC9TdHlsZWRDb250YWluZXI+XG4gICk7XG59XG5cbkNhbGxvdXQuZGVmYXVsdFByb3BzID0gZGVmYXVsdFByb3BzO1xuIl19 */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+});
+function Callout(_ref2) {
+  let {
+    text,
+    description,
+    type,
+    icon,
+    "data-e2e-test-id": dataE2eTestId
+  } = _ref2;
+  const titleFontWeight = description ? "bold" : "normal";
+  return /*#__PURE__*/React.createElement(StyledContainer, {
+    "data-e2e-test-id": dataE2eTestId,
+    "data-ds-id": "Callout",
+    type: type
+  }, /*#__PURE__*/React.createElement(Inline, {
+    vAlignItems: "top",
+    space: "xs",
+    noWrap: true
+  }, /*#__PURE__*/React.createElement(StyledIconContainer, null, /*#__PURE__*/React.createElement(Icon, {
+    name: icon,
+    color: "inherit",
+    size: "s"
+  })), /*#__PURE__*/React.createElement(Stack, {
+    space: "xxs"
+  }, /*#__PURE__*/React.createElement(Text, {
+    weight: titleFontWeight,
+    size: "s"
+  }, text), description && /*#__PURE__*/React.createElement(Text, {
+    size: "s"
+  }, description))));
+}
+Callout.defaultProps = defaultProps;
+
+export { Callout };
+//# sourceMappingURL=Callout.js.map

package/build/esm/src/components/Callout/Callout.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Callout.js","sources":["../../../../../src/components/Callout/Callout.tsx"],"sourcesContent":["import React, { ReactElement } from \"react\";\nimport styled from \"@emotion/styled\";\nimport { IconName, Icon } from \"../Icon/Icon\";\nimport { Inline } from \"../Inline/Inline\";\nimport { Stack } from \"../Stack/Stack\";\nimport { Text } from \"../Typography/Text/Text\";\nimport { CalloutVariations } from \"../../types\";\n\nexport type CalloutProps = {\n  type?: CalloutVariations;\n  icon?: IconName;\n  \"data-e2e-test-id\"?: string;\n  text: string | ReactElement;\n  description?: string | ReactElement;\n};\n\nconst defaultProps: Partial<CalloutProps> = {\n  icon: \"info\",\n  type: \"info\",\n  \"data-e2e-test-id\": undefined,\n};\n\nconst StyledContainer = styled.div<Partial<CalloutProps>>(\n  ({ theme, type }) => ({\n    display: \"flex\",\n    borderRadius: theme.variables.size.borderRadius.button.m,\n    padding: theme.variables.size.spacing.m,\n    lineHeight: theme.variables.size.lineHeight.callout.s,\n    color: theme.values.color.text[type].default,\n    backgroundColor: theme.values.color.background[`${type}Subtle`].default,\n    svg: {\n      color: theme.values.color.icon[type],\n    },\n    ...{\n      \"a,button,p\": {\n        color: \"inherit\",\n        \"&:hover\": {\n          color: \"inherit\",\n        },\n        \"& button\": {\n          fontWeight: \"inherit\",\n          fontSize: \"inherit\",\n          lineHeight: \"inherit\",\n        },\n      },\n    },\n  })\n);\n\nconst StyledIconContainer = styled.div({\n  paddingTop: \"1px\",\n});\n\nexport function Callout({\n  text,\n  description,\n  type,\n  icon,\n  \"data-e2e-test-id\": dataE2eTestId,\n}: CalloutProps): React.ReactElement {\n  const titleFontWeight = description ? \"bold\" : \"normal\";\n\n  return (\n    <StyledContainer\n      data-e2e-test-id={dataE2eTestId}\n      data-ds-id=\"Callout\"\n      type={type}\n    >\n      <Inline vAlignItems=\"top\" space=\"xs\" noWrap>\n        <StyledIconContainer>\n          <Icon name={icon} color=\"inherit\" size=\"s\" />\n        </StyledIconContainer>\n        <Stack space=\"xxs\">\n          <Text weight={titleFontWeight} size=\"s\">\n            {text}\n          </Text>\n          {description && <Text size=\"s\">{description}</Text>}\n        </Stack>\n      </Inline>\n    </StyledContainer>\n  );\n}\n\nCallout.defaultProps = defaultProps;\n"],"names":["defaultProps","icon","type","undefined","StyledContainer","_styled","process","env","NODE_ENV","target","label","_ref","theme","display","borderRadius","variables","size","button","m","padding","spacing","lineHeight","callout","s","color","values","text","default","backgroundColor","background","svg","fontWeight","fontSize","StyledIconContainer","name","styles","map","toString","_EMOTION_STRINGIFIED_CSS_ERROR__","Callout","_ref2","description","dataE2eTestId","titleFontWeight","React","createElement","Inline","vAlignItems","space","noWrap","Icon","Stack","Text","weight"],"mappings":"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"}

package/build/esm/src/components/Card/Card.d.ts

@@ -0,0 +1,16 @@
+import React from "react";
+import { DropdownMenuProps } from "../DropdownMenu/DropdownMenu";
+export declare type CardProps = {
+    /** Specify title displayed in Header */
+    title?: string;
+    /** @deprecated Subtitle is now deprecated */
+    subtitle?: string;
+    /** @deprecated button property is deprecated now. Please use dropdown prop. */
+    button?: React.ReactElement;
+    dropdown?: Omit<DropdownMenuProps, "iconName" | "size">;
+    overflow?: "auto" | "hidden" | "visible";
+    squareCorners?: boolean;
+    children?: React.ReactNode;
+    "data-e2e-test-id"?: string;
+};
+export declare function Card({ title, subtitle, button, dropdown, children, overflow, squareCorners, "data-e2e-test-id": dataE2eTestId, }: CardProps): React.ReactElement;

package/build/esm/src/components/Card/Card.js

@@ -0,0 +1,63 @@
+import _styled from '@emotion/styled/base';
+import React from 'react';
+import { CardHeader } from './CardHeader/CardHeader.js';
+import { informDeprecation } from '../../shared/informDeprecation.js';
+
+const StyledContainer = /*#__PURE__*/_styled("div", process.env.NODE_ENV === "production" ? {
+  target: "eieabd00"
+} : {
+  target: "eieabd00",
+  label: "StyledContainer"
+})(_ref => {
+  let {
+    theme,
+    overflow,
+    squareCorners
+  } = _ref;
+  return {
+    ...(squareCorners ? {
+      borderRadius: 0
+    } : {
+      borderRadius: theme.variables.size.borderRadius.card.m,
+      "& > *:last-child": {
+        borderBottomLeftRadius: theme.variables.size.borderRadius.card.m,
+        borderBottomRightRadius: theme.variables.size.borderRadius.card.m
+      },
+      "& > *:first-child": {
+        borderTopLeftRadius: theme.variables.size.borderRadius.card.m,
+        borderTopRightRadius: theme.variables.size.borderRadius.card.m
+      }
+    }),
+    boxShadow: theme.variables.shadow.card.a,
+    backgroundColor: theme.values.color.background.primary.default,
+    overflow
+  };
+}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkNhcmQudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQTJCd0IiLCJmaWxlIjoiQ2FyZC50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgUmVhY3QgZnJvbSBcInJlYWN0XCI7XG5pbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcbmltcG9ydCB7IENhcmRIZWFkZXIgfSBmcm9tIFwiLi9DYXJkSGVhZGVyL0NhcmRIZWFkZXJcIjtcbmltcG9ydCB7IGluZm9ybURlcHJlY2F0aW9uIH0gZnJvbSBcIi4uLy4uL3NoYXJlZC9pbmZvcm1EZXByZWNhdGlvblwiO1xuaW1wb3J0IHsgRHJvcGRvd25NZW51UHJvcHMgfSBmcm9tIFwiLi4vRHJvcGRvd25NZW51L0Ryb3Bkb3duTWVudVwiO1xuXG5leHBvcnQgdHlwZSBDYXJkUHJvcHMgPSB7XG4gIC8qKiBTcGVjaWZ5IHRpdGxlIGRpc3BsYXllZCBpbiBIZWFkZXIgKi9cbiAgdGl0bGU/OiBzdHJpbmc7XG5cbiAgLyoqIEBkZXByZWNhdGVkIFN1YnRpdGxlIGlzIG5vdyBkZXByZWNhdGVkICovXG4gIHN1YnRpdGxlPzogc3RyaW5nO1xuXG4gIC8qKiBAZGVwcmVjYXRlZCBidXR0b24gcHJvcGVydHkgaXMgZGVwcmVjYXRlZCBub3cuIFBsZWFzZSB1c2UgZHJvcGRvd24gcHJvcC4gKi9cbiAgYnV0dG9uPzogUmVhY3QuUmVhY3RFbGVtZW50O1xuXG4gIGRyb3Bkb3duPzogT21pdDxEcm9wZG93bk1lbnVQcm9wcywgXCJpY29uTmFtZVwiIHwgXCJzaXplXCI+O1xuXG4gIG92ZXJmbG93PzogXCJhdXRvXCIgfCBcImhpZGRlblwiIHwgXCJ2aXNpYmxlXCI7XG5cbiAgc3F1YXJlQ29ybmVycz86IGJvb2xlYW47XG5cbiAgY2hpbGRyZW4/OiBSZWFjdC5SZWFjdE5vZGU7XG5cbiAgXCJkYXRhLWUyZS10ZXN0LWlkXCI/OiBzdHJpbmc7XG59O1xuXG5jb25zdCBTdHlsZWRDb250YWluZXIgPSBzdHlsZWQuZGl2PFBhcnRpYWw8Q2FyZFByb3BzPj4oXG4gICh7IHRoZW1lLCBvdmVyZmxvdywgc3F1YXJlQ29ybmVycyB9KSA9PiAoe1xuICAgIC4uLihzcXVhcmVDb3JuZXJzXG4gICAgICA/IHtcbiAgICAgICAgICBib3JkZXJSYWRpdXM6IDAsXG4gICAgICAgIH1cbiAgICAgIDoge1xuICAgICAgICAgIGJvcmRlclJhZGl1czogdGhlbWUudmFyaWFibGVzLnNpemUuYm9yZGVyUmFkaXVzLmNhcmQubSxcbiAgICAgICAgICBcIiYgPiAqOmxhc3QtY2hpbGRcIjoge1xuICAgICAgICAgICAgYm9yZGVyQm90dG9tTGVmdFJhZGl1czogdGhlbWUudmFyaWFibGVzLnNpemUuYm9yZGVyUmFkaXVzLmNhcmQubSxcbiAgICAgICAgICAgIGJvcmRlckJvdHRvbVJpZ2h0UmFkaXVzOiB0aGVtZS52YXJpYWJsZXMuc2l6ZS5ib3JkZXJSYWRpdXMuY2FyZC5tLFxuICAgICAgICAgIH0sXG4gICAgICAgICAgXCImID4gKjpmaXJzdC1jaGlsZFwiOiB7XG4gICAgICAgICAgICBib3JkZXJUb3BMZWZ0UmFkaXVzOiB0aGVtZS52YXJpYWJsZXMuc2l6ZS5ib3JkZXJSYWRpdXMuY2FyZC5tLFxuICAgICAgICAgICAgYm9yZGVyVG9wUmlnaHRSYWRpdXM6IHRoZW1lLnZhcmlhYmxlcy5zaXplLmJvcmRlclJhZGl1cy5jYXJkLm0sXG4gICAgICAgICAgfSxcbiAgICAgICAgfSksXG4gICAgYm94U2hhZG93OiB0aGVtZS52YXJpYWJsZXMuc2hhZG93LmNhcmQuYSxcbiAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLnZhbHVlcy5jb2xvci5iYWNrZ3JvdW5kLnByaW1hcnkuZGVmYXVsdCxcbiAgICBvdmVyZmxvdyxcbiAgfSlcbik7XG5cbmV4cG9ydCBmdW5jdGlvbiBDYXJkKHtcbiAgdGl0bGUsXG4gIHN1YnRpdGxlLFxuICBidXR0b24sXG4gIGRyb3Bkb3duLFxuICBjaGlsZHJlbixcbiAgb3ZlcmZsb3cgPSBcImhpZGRlblwiLFxuICBzcXVhcmVDb3JuZXJzID0gZmFsc2UsXG4gIFwiZGF0YS1lMmUtdGVzdC1pZFwiOiBkYXRhRTJlVGVzdElkLFxufTogQ2FyZFByb3BzKTogUmVhY3QuUmVhY3RFbGVtZW50IHtcbiAgaW5mb3JtRGVwcmVjYXRpb24oXG4gICAgc3VidGl0bGUsXG4gICAgc3VidGl0bGUsXG4gICAgXCJDYXJkXCIsXG4gICAgXCJTdWJ0aXRsZSBpcyBub3cgYSBkZXByaWNhdGVkIHByb3AsIHBsZWFzZSBkaXNjdXNzIGEgd29ya2Fyb3VuZCB3aXRoIGFueSBvZiBVWCBkZXNpZ25lcnNcIlxuICApO1xuXG4gIGluZm9ybURlcHJlY2F0aW9uKFxuICAgIGJ1dHRvbixcbiAgICBidXR0b24sXG4gICAgXCJDYXJkXCIsXG4gICAgXCJCdXR0b24gaXMgZGVwcmVjYXRlZCwgcGxlYXNlIHVzZSBkcm9wZG93biBwcm9wZXJ0eSBpbnN0ZWFkXCJcbiAgKTtcblxuICByZXR1cm4gKFxuICAgIDxTdHlsZWRDb250YWluZXJcbiAgICAgIGRhdGEtZTJlLXRlc3QtaWQ9e2RhdGFFMmVUZXN0SWR9XG4gICAgICBkYXRhLWRzLWlkPVwiQ2FyZFwiXG4gICAgICBvdmVyZmxvdz17b3ZlcmZsb3d9XG4gICAgICBzcXVhcmVDb3JuZXJzPXtzcXVhcmVDb3JuZXJzfVxuICAgID5cbiAgICAgIHsoYnV0dG9uIHx8IGRyb3Bkb3duIHx8IHN1YnRpdGxlIHx8IHRpdGxlKSAmJiAoXG4gICAgICAgIDxDYXJkSGVhZGVyXG4gICAgICAgICAgdGl0bGU9e3RpdGxlfVxuICAgICAgICAgIHN1YnRpdGxlPXtzdWJ0aXRsZX1cbiAgICAgICAgICBidXR0b249e2J1dHRvbn1cbiAgICAgICAgICBkcm9wZG93bj17ZHJvcGRvd259XG4gICAgICAgIC8+XG4gICAgICApfVxuICAgICAge2NoaWxkcmVufVxuICAgIDwvU3R5bGVkQ29udGFpbmVyPlxuICApO1xufVxuIl19 */");
+function Card(_ref2) {
+  let {
+    title,
+    subtitle,
+    button,
+    dropdown,
+    children,
+    overflow = "hidden",
+    squareCorners = false,
+    "data-e2e-test-id": dataE2eTestId
+  } = _ref2;
+  informDeprecation(subtitle, subtitle, "Card", "Subtitle is now a depricated prop, please discuss a workaround with any of UX designers");
+  informDeprecation(button, button, "Card", "Button is deprecated, please use dropdown property instead");
+  return /*#__PURE__*/React.createElement(StyledContainer, {
+    "data-e2e-test-id": dataE2eTestId,
+    "data-ds-id": "Card",
+    overflow: overflow,
+    squareCorners: squareCorners
+  }, (button || dropdown || subtitle || title) && /*#__PURE__*/React.createElement(CardHeader, {
+    title: title,
+    subtitle: subtitle,
+    button: button,
+    dropdown: dropdown
+  }), children);
+}
+
+export { Card };
+//# sourceMappingURL=Card.js.map

package/build/esm/src/components/Card/Card.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Card.js","sources":["../../../../../src/components/Card/Card.tsx"],"sourcesContent":["import React from \"react\";\nimport styled from \"@emotion/styled\";\nimport { CardHeader } from \"./CardHeader/CardHeader\";\nimport { informDeprecation } from \"../../shared/informDeprecation\";\nimport { DropdownMenuProps } from \"../DropdownMenu/DropdownMenu\";\n\nexport type CardProps = {\n  /** Specify title displayed in Header */\n  title?: string;\n\n  /** @deprecated Subtitle is now deprecated */\n  subtitle?: string;\n\n  /** @deprecated button property is deprecated now. Please use dropdown prop. */\n  button?: React.ReactElement;\n\n  dropdown?: Omit<DropdownMenuProps, \"iconName\" | \"size\">;\n\n  overflow?: \"auto\" | \"hidden\" | \"visible\";\n\n  squareCorners?: boolean;\n\n  children?: React.ReactNode;\n\n  \"data-e2e-test-id\"?: string;\n};\n\nconst StyledContainer = styled.div<Partial<CardProps>>(\n  ({ theme, overflow, squareCorners }) => ({\n    ...(squareCorners\n      ? {\n          borderRadius: 0,\n        }\n      : {\n          borderRadius: theme.variables.size.borderRadius.card.m,\n          \"& > *:last-child\": {\n            borderBottomLeftRadius: theme.variables.size.borderRadius.card.m,\n            borderBottomRightRadius: theme.variables.size.borderRadius.card.m,\n          },\n          \"& > *:first-child\": {\n            borderTopLeftRadius: theme.variables.size.borderRadius.card.m,\n            borderTopRightRadius: theme.variables.size.borderRadius.card.m,\n          },\n        }),\n    boxShadow: theme.variables.shadow.card.a,\n    backgroundColor: theme.values.color.background.primary.default,\n    overflow,\n  })\n);\n\nexport function Card({\n  title,\n  subtitle,\n  button,\n  dropdown,\n  children,\n  overflow = \"hidden\",\n  squareCorners = false,\n  \"data-e2e-test-id\": dataE2eTestId,\n}: CardProps): React.ReactElement {\n  informDeprecation(\n    subtitle,\n    subtitle,\n    \"Card\",\n    \"Subtitle is now a depricated prop, please discuss a workaround with any of UX designers\"\n  );\n\n  informDeprecation(\n    button,\n    button,\n    \"Card\",\n    \"Button is deprecated, please use dropdown property instead\"\n  );\n\n  return (\n    <StyledContainer\n      data-e2e-test-id={dataE2eTestId}\n      data-ds-id=\"Card\"\n      overflow={overflow}\n      squareCorners={squareCorners}\n    >\n      {(button || dropdown || subtitle || title) && (\n        <CardHeader\n          title={title}\n          subtitle={subtitle}\n          button={button}\n          dropdown={dropdown}\n        />\n      )}\n      {children}\n    </StyledContainer>\n  );\n}\n"],"names":["StyledContainer","_styled","process","env","NODE_ENV","target","label","_ref","theme","overflow","squareCorners","borderRadius","variables","size","card","m","borderBottomLeftRadius","borderBottomRightRadius","borderTopLeftRadius","borderTopRightRadius","boxShadow","shadow","a","backgroundColor","values","color","background","primary","default","Card","_ref2","title","subtitle","button","dropdown","children","dataE2eTestId","informDeprecation","React","createElement","CardHeader"],"mappings":";;;;;AA2BA,MAAMA,eAAe,gBAAGC,OAAA,CAAA,KAAA,EAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA,KAAA,YAAA,GAAA;EAAAC,MAAA,EAAA,UAAA;AAAA,CAAA,GAAA;EAAAA,MAAA,EAAA,UAAA;EAAAC,KAAA,EAAA,iBAAA;AAAA,CAAA,CAAA,CACtBC,IAAA,IAAA;EAAA,IAAC;IAAEC,KAAK;IAAEC,QAAQ;AAAEC,IAAAA,aAAAA;AAAc,GAAC,GAAAH,IAAA,CAAA;EAAA,OAAM;AACvC,IAAA,IAAIG,aAAa,GACb;AACEC,MAAAA,YAAY,EAAE,CAAA;AAChB,KAAC,GACD;MACEA,YAAY,EAAEH,KAAK,CAACI,SAAS,CAACC,IAAI,CAACF,YAAY,CAACG,IAAI,CAACC,CAAC;AACtD,MAAA,kBAAkB,EAAE;QAClBC,sBAAsB,EAAER,KAAK,CAACI,SAAS,CAACC,IAAI,CAACF,YAAY,CAACG,IAAI,CAACC,CAAC;QAChEE,uBAAuB,EAAET,KAAK,CAACI,SAAS,CAACC,IAAI,CAACF,YAAY,CAACG,IAAI,CAACC,CAAAA;OACjE;AACD,MAAA,mBAAmB,EAAE;QACnBG,mBAAmB,EAAEV,KAAK,CAACI,SAAS,CAACC,IAAI,CAACF,YAAY,CAACG,IAAI,CAACC,CAAC;QAC7DI,oBAAoB,EAAEX,KAAK,CAACI,SAAS,CAACC,IAAI,CAACF,YAAY,CAACG,IAAI,CAACC,CAAAA;AAC/D,OAAA;AACF,KAAC,CAAC;IACNK,SAAS,EAAEZ,KAAK,CAACI,SAAS,CAACS,MAAM,CAACP,IAAI,CAACQ,CAAC;IACxCC,eAAe,EAAEf,KAAK,CAACgB,MAAM,CAACC,KAAK,CAACC,UAAU,CAACC,OAAO,CAACC,OAAO;AAC9DnB,IAAAA,QAAAA;GACD,CAAA;AAAA,CAAC,EAAAP,OAAA,CAAAC,GAAA,CAAAC,QAAA,0jHACJ,CAAC,CAAA;AAEM,SAASyB,IAAIA,CAAAC,KAAA,EASc;EAAA,IATb;IACnBC,KAAK;IACLC,QAAQ;IACRC,MAAM;IACNC,QAAQ;IACRC,QAAQ;AACR1B,IAAAA,QAAQ,GAAG,QAAQ;AACnBC,IAAAA,aAAa,GAAG,KAAK;AACrB,IAAA,kBAAkB,EAAE0B,aAAAA;AACX,GAAC,GAAAN,KAAA,CAAA;EACVO,iBAAiB,CACfL,QAAQ,EACRA,QAAQ,EACR,MAAM,EACN,yFACF,CAAC,CAAA;EAEDK,iBAAiB,CACfJ,MAAM,EACNA,MAAM,EACN,MAAM,EACN,4DACF,CAAC,CAAA;AAED,EAAA,oBACEK,KAAA,CAAAC,aAAA,CAACvC,eAAe,EAAA;AACd,IAAA,kBAAA,EAAkBoC,aAAc;AAChC,IAAA,YAAA,EAAW,MAAM;AACjB3B,IAAAA,QAAQ,EAAEA,QAAS;AACnBC,IAAAA,aAAa,EAAEA,aAAAA;AAAc,GAAA,EAE5B,CAACuB,MAAM,IAAIC,QAAQ,IAAIF,QAAQ,IAAID,KAAK,kBACvCO,KAAA,CAAAC,aAAA,CAACC,UAAU,EAAA;AACTT,IAAAA,KAAK,EAAEA,KAAM;AACbC,IAAAA,QAAQ,EAAEA,QAAS;AACnBC,IAAAA,MAAM,EAAEA,MAAO;AACfC,IAAAA,QAAQ,EAAEA,QAAAA;GACX,CACF,EACAC,QACc,CAAC,CAAA;AAEtB;;;;"}

package/build/esm/src/components/Card/CardBox.d.ts

@@ -0,0 +1,6 @@
+import React from "react";
+export declare type CardBoxProps = {
+    children: React.ReactNode;
+    "data-e2e-test-id"?: string;
+};
+export declare function CardBox({ children, "data-e2e-test-id": dataE2eTestId, }: CardBoxProps): React.ReactElement;

package/build/esm/src/components/Card/CardBox.js

@@ -0,0 +1,18 @@
+import React from 'react';
+import { Box } from '../Box/Box.js';
+
+function CardBox(_ref) {
+  let {
+    children,
+    "data-e2e-test-id": dataE2eTestId
+  } = _ref;
+  return /*#__PURE__*/React.createElement(Box, {
+    "data-e2e-test-id": dataE2eTestId,
+    "data-ds-id": "CardBox",
+    space: ["m", "l", "l"],
+    vSpace: "m"
+  }, children);
+}
+
+export { CardBox };
+//# sourceMappingURL=CardBox.js.map

package/build/esm/src/components/Card/CardBox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CardBox.js","sources":["../../../../../src/components/Card/CardBox.tsx"],"sourcesContent":["import React from \"react\";\nimport { Box } from \"../Box/Box\";\n\nexport type CardBoxProps = {\n  children: React.ReactNode;\n  \"data-e2e-test-id\"?: string;\n};\n\nexport function CardBox({\n  children,\n  \"data-e2e-test-id\": dataE2eTestId,\n}: CardBoxProps): React.ReactElement {\n  return (\n    <Box\n      data-e2e-test-id={dataE2eTestId}\n      data-ds-id=\"CardBox\"\n      space={[\"m\", \"l\", \"l\"]}\n      vSpace=\"m\"\n    >\n      {children}\n    </Box>\n  );\n}\n"],"names":["CardBox","_ref","children","dataE2eTestId","React","createElement","Box","space","vSpace"],"mappings":";;;AAQO,SAASA,OAAOA,CAAAC,IAAA,EAGc;EAAA,IAHb;IACtBC,QAAQ;AACR,IAAA,kBAAkB,EAAEC,aAAAA;AACR,GAAC,GAAAF,IAAA,CAAA;AACb,EAAA,oBACEG,KAAA,CAAAC,aAAA,CAACC,GAAG,EAAA;AACF,IAAA,kBAAA,EAAkBH,aAAc;AAChC,IAAA,YAAA,EAAW,SAAS;AACpBI,IAAAA,KAAK,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAE;AACvBC,IAAAA,MAAM,EAAC,GAAA;AAAG,GAAA,EAETN,QACE,CAAC,CAAA;AAEV;;;;"}

package/build/esm/src/components/Card/CardHeader/CardHeader.d.ts

@@ -0,0 +1,12 @@
+import React from "react";
+import { DropdownMenuProps } from "../../DropdownMenu/DropdownMenu";
+export declare class CardHeaderProps {
+    title?: string;
+    /** @deprecated * */
+    subtitle?: string;
+    dropdown?: Omit<DropdownMenuProps, "iconName" | "size">;
+    /** @deprecated * */
+    button?: React.ReactElement;
+    "data-e2e-test-id"?: string;
+}
+export declare function CardHeader({ title, subtitle, button, dropdown, "data-e2e-test-id": dataE2eTestId, }: CardHeaderProps): React.ReactElement;

package/build/esm/src/components/Card/CardHeader/CardHeader.js

@@ -0,0 +1,52 @@
+import _extends from '@babel/runtime/helpers/extends';
+import _styled from '@emotion/styled/base';
+import React from 'react';
+import { Stack } from '../../Stack/Stack.js';
+import { Inline } from '../../Inline/Inline.js';
+import { H5 } from '../../Typography/Header/Header.js';
+import { Text } from '../../Typography/Text/Text.js';
+import { Divider } from '../../Divider/Divider.js';
+import { Box } from '../../Box/Box.js';
+import { DropdownMenu } from '../../DropdownMenu/DropdownMenu.js';
+
+const StyledHeaderWrap = /*#__PURE__*/_styled("div", process.env.NODE_ENV === "production" ? {
+  target: "ehgetke0"
+} : {
+  target: "ehgetke0",
+  label: "StyledHeaderWrap"
+})({
+  // Compensate small button height with 6px
+  padding: `6px 0`
+}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkNhcmRIZWFkZXIudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWN5QiIsImZpbGUiOiJDYXJkSGVhZGVyLnRzeCIsInNvdXJjZXNDb250ZW50IjpbIi8qIGVzbGludC1kaXNhYmxlIHJlYWN0L2pzeC1wcm9wcy1uby1zcHJlYWRpbmcgKi9cbmltcG9ydCBSZWFjdCBmcm9tIFwicmVhY3RcIjtcbmltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsgU3RhY2sgfSBmcm9tIFwiLi4vLi4vU3RhY2svU3RhY2tcIjtcbmltcG9ydCB7IElubGluZSB9IGZyb20gXCIuLi8uLi9JbmxpbmUvSW5saW5lXCI7XG5pbXBvcnQgeyBINSB9IGZyb20gXCIuLi8uLi9UeXBvZ3JhcGh5L0hlYWRlci9IZWFkZXJcIjtcbmltcG9ydCB7IFRleHQgfSBmcm9tIFwiLi4vLi4vVHlwb2dyYXBoeS9UZXh0L1RleHRcIjtcbmltcG9ydCB7IERpdmlkZXIgfSBmcm9tIFwiLi4vLi4vRGl2aWRlci9EaXZpZGVyXCI7XG5pbXBvcnQgeyBCb3ggfSBmcm9tIFwiLi4vLi4vQm94L0JveFwiO1xuaW1wb3J0IHtcbiAgRHJvcGRvd25NZW51LFxuICBEcm9wZG93bk1lbnVQcm9wcyxcbn0gZnJvbSBcIi4uLy4uL0Ryb3Bkb3duTWVudS9Ecm9wZG93bk1lbnVcIjtcblxuY29uc3QgU3R5bGVkSGVhZGVyV3JhcCA9IHN0eWxlZC5kaXYoe1xuICAvLyBDb21wZW5zYXRlIHNtYWxsIGJ1dHRvbiBoZWlnaHQgd2l0aCA2cHhcbiAgcGFkZGluZzogYDZweCAwYCxcbn0pO1xuXG5leHBvcnQgY2xhc3MgQ2FyZEhlYWRlclByb3BzIHtcbiAgdGl0bGU/OiBzdHJpbmc7XG5cbiAgLyoqIEBkZXByZWNhdGVkICogKi9cbiAgc3VidGl0bGU/OiBzdHJpbmc7XG5cbiAgZHJvcGRvd24/OiBPbWl0PERyb3Bkb3duTWVudVByb3BzLCBcImljb25OYW1lXCIgfCBcInNpemVcIj47XG5cbiAgLyoqIEBkZXByZWNhdGVkICogKi9cbiAgYnV0dG9uPzogUmVhY3QuUmVhY3RFbGVtZW50O1xuXG4gIFwiZGF0YS1lMmUtdGVzdC1pZFwiPzogc3RyaW5nO1xufVxuXG5leHBvcnQgZnVuY3Rpb24gQ2FyZEhlYWRlcih7XG4gIHRpdGxlLFxuICBzdWJ0aXRsZSxcbiAgYnV0dG9uLFxuICBkcm9wZG93bixcbiAgXCJkYXRhLWUyZS10ZXN0LWlkXCI6IGRhdGFFMmVUZXN0SWQsXG59OiBDYXJkSGVhZGVyUHJvcHMpOiBSZWFjdC5SZWFjdEVsZW1lbnQge1xuICByZXR1cm4gKFxuICAgIDxkaXYgZGF0YS1lMmUtdGVzdC1pZD17ZGF0YUUyZVRlc3RJZH0+XG4gICAgICA8Qm94IHNwYWNlPXtbXCJtXCIsIFwibFwiLCBcImxcIl19IHZTcGFjZT1cInNcIiByU3BhY2U9XCJzXCI+XG4gICAgICAgIDxJbmxpbmUgYWxpZ25JdGVtcz1cInNwYWNlQmV0d2VlblwiIHZBbGlnbkl0ZW1zPVwidG9wXCIgbm9XcmFwPlxuICAgICAgICAgIDxTdGFjayBzcGFjZT1cInhzXCI+XG4gICAgICAgICAgICB7dGl0bGUgJiYgKFxuICAgICAgICAgICAgICA8U3R5bGVkSGVhZGVyV3JhcD5cbiAgICAgICAgICAgICAgICA8SDU+e3RpdGxlfTwvSDU+XG4gICAgICAgICAgICAgIDwvU3R5bGVkSGVhZGVyV3JhcD5cbiAgICAgICAgICAgICl9XG4gICAgICAgICAgICB7c3VidGl0bGUgJiYgKFxuICAgICAgICAgICAgICA8VGV4dCBzaXplPVwieHNcIiBhcz1cInNwYW5cIiBjb2xvcj1cInRlcnRpYXJ5XCI+XG4gICAgICAgICAgICAgICAge3N1YnRpdGxlfVxuICAgICAgICAgICAgICA8L1RleHQ+XG4gICAgICAgICAgICApfVxuICAgICAgICAgIDwvU3RhY2s+XG4gICAgICAgICAge2J1dHRvbiAmJiA8ZGl2PntidXR0b259PC9kaXY+fVxuICAgICAgICAgIHtkcm9wZG93biAmJiAoXG4gICAgICAgICAgICA8RHJvcGRvd25NZW51IHsuLi5kcm9wZG93bn0gc2l6ZT1cInNcIiBpY29uTmFtZT1cIm1vcmUtaG9yaXpvbnRhbFwiIC8+XG4gICAgICAgICAgKX1cbiAgICAgICAgPC9JbmxpbmU+XG4gICAgICA8L0JveD5cbiAgICAgIDxEaXZpZGVyIC8+XG4gICAgPC9kaXY+XG4gICk7XG59XG4iXX0= */");
+function CardHeader(_ref) {
+  let {
+    title,
+    subtitle,
+    button,
+    dropdown,
+    "data-e2e-test-id": dataE2eTestId
+  } = _ref;
+  return /*#__PURE__*/React.createElement("div", {
+    "data-e2e-test-id": dataE2eTestId
+  }, /*#__PURE__*/React.createElement(Box, {
+    space: ["m", "l", "l"],
+    vSpace: "s",
+    rSpace: "s"
+  }, /*#__PURE__*/React.createElement(Inline, {
+    alignItems: "spaceBetween",
+    vAlignItems: "top",
+    noWrap: true
+  }, /*#__PURE__*/React.createElement(Stack, {
+    space: "xs"
+  }, title && /*#__PURE__*/React.createElement(StyledHeaderWrap, null, /*#__PURE__*/React.createElement(H5, null, title)), subtitle && /*#__PURE__*/React.createElement(Text, {
+    size: "xs",
+    as: "span",
+    color: "tertiary"
+  }, subtitle)), button && /*#__PURE__*/React.createElement("div", null, button), dropdown && /*#__PURE__*/React.createElement(DropdownMenu, _extends({}, dropdown, {
+    size: "s",
+    iconName: "more-horizontal"
+  })))), /*#__PURE__*/React.createElement(Divider, null));
+}
+
+export { CardHeader };
+//# sourceMappingURL=CardHeader.js.map

package/build/esm/src/components/Card/CardHeader/CardHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CardHeader.js","sources":["../../../../../../src/components/Card/CardHeader/CardHeader.tsx"],"sourcesContent":["/* eslint-disable react/jsx-props-no-spreading */\nimport React from \"react\";\nimport styled from \"@emotion/styled\";\nimport { Stack } from \"../../Stack/Stack\";\nimport { Inline } from \"../../Inline/Inline\";\nimport { H5 } from \"../../Typography/Header/Header\";\nimport { Text } from \"../../Typography/Text/Text\";\nimport { Divider } from \"../../Divider/Divider\";\nimport { Box } from \"../../Box/Box\";\nimport {\n  DropdownMenu,\n  DropdownMenuProps,\n} from \"../../DropdownMenu/DropdownMenu\";\n\nconst StyledHeaderWrap = styled.div({\n  // Compensate small button height with 6px\n  padding: `6px 0`,\n});\n\nexport class CardHeaderProps {\n  title?: string;\n\n  /** @deprecated * */\n  subtitle?: string;\n\n  dropdown?: Omit<DropdownMenuProps, \"iconName\" | \"size\">;\n\n  /** @deprecated * */\n  button?: React.ReactElement;\n\n  \"data-e2e-test-id\"?: string;\n}\n\nexport function CardHeader({\n  title,\n  subtitle,\n  button,\n  dropdown,\n  \"data-e2e-test-id\": dataE2eTestId,\n}: CardHeaderProps): React.ReactElement {\n  return (\n    <div data-e2e-test-id={dataE2eTestId}>\n      <Box space={[\"m\", \"l\", \"l\"]} vSpace=\"s\" rSpace=\"s\">\n        <Inline alignItems=\"spaceBetween\" vAlignItems=\"top\" noWrap>\n          <Stack space=\"xs\">\n            {title && (\n              <StyledHeaderWrap>\n                <H5>{title}</H5>\n              </StyledHeaderWrap>\n            )}\n            {subtitle && (\n              <Text size=\"xs\" as=\"span\" color=\"tertiary\">\n                {subtitle}\n              </Text>\n            )}\n          </Stack>\n          {button && <div>{button}</div>}\n          {dropdown && (\n            <DropdownMenu {...dropdown} size=\"s\" iconName=\"more-horizontal\" />\n          )}\n        </Inline>\n      </Box>\n      <Divider />\n    </div>\n  );\n}\n"],"names":["StyledHeaderWrap","_styled","process","env","NODE_ENV","target","label","padding","CardHeader","_ref","title","subtitle","button","dropdown","dataE2eTestId","React","createElement","Box","space","vSpace","rSpace","Inline","alignItems","vAlignItems","noWrap","Stack","H5","Text","size","as","color","DropdownMenu","_extends","iconName","Divider"],"mappings":";;;;;;;;;;;AAcA,MAAMA,gBAAgB,gBAAGC,OAAA,CAAA,KAAA,EAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA,KAAA,YAAA,GAAA;EAAAC,MAAA,EAAA,UAAA;AAAA,CAAA,GAAA;EAAAA,MAAA,EAAA,UAAA;EAAAC,KAAA,EAAA,kBAAA;AAAA,CAAW,CAAA,CAAA;AAClC;AACAC,EAAAA,OAAO,EAAG,CAAA,KAAA,CAAA;AACZ,CAAC,EAAAL,OAAA,CAAAC,GAAA,CAAAC,QAAA,KAAC,YAAA,GAAA,EAAA,GAAA,ioFAAA,CAAA,CAAA;AAgBK,SAASI,UAAUA,CAAAC,IAAA,EAMc;EAAA,IANb;IACzBC,KAAK;IACLC,QAAQ;IACRC,MAAM;IACNC,QAAQ;AACR,IAAA,kBAAkB,EAAEC,aAAAA;AACL,GAAC,GAAAL,IAAA,CAAA;EAChB,oBACEM,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;IAAK,kBAAkBF,EAAAA,aAAAA;AAAc,GAAA,eACnCC,KAAA,CAAAC,aAAA,CAACC,GAAG,EAAA;AAACC,IAAAA,KAAK,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAE;AAACC,IAAAA,MAAM,EAAC,GAAG;AAACC,IAAAA,MAAM,EAAC,GAAA;AAAG,GAAA,eAChDL,KAAA,CAAAC,aAAA,CAACK,MAAM,EAAA;AAACC,IAAAA,UAAU,EAAC,cAAc;AAACC,IAAAA,WAAW,EAAC,KAAK;IAACC,MAAM,EAAA,IAAA;AAAA,GAAA,eACxDT,KAAA,CAAAC,aAAA,CAACS,KAAK,EAAA;AAACP,IAAAA,KAAK,EAAC,IAAA;GACVR,EAAAA,KAAK,iBACJK,KAAA,CAAAC,aAAA,CAAChB,gBAAgB,EAAA,IAAA,eACfe,KAAA,CAAAC,aAAA,CAACU,EAAE,EAAEhB,IAAAA,EAAAA,KAAU,CACC,CACnB,EACAC,QAAQ,iBACPI,KAAA,CAAAC,aAAA,CAACW,IAAI,EAAA;AAACC,IAAAA,IAAI,EAAC,IAAI;AAACC,IAAAA,EAAE,EAAC,MAAM;AAACC,IAAAA,KAAK,EAAC,UAAA;GAC7BnB,EAAAA,QACG,CAEH,CAAC,EACPC,MAAM,iBAAIG,KAAA,CAAAC,aAAA,CAAMJ,KAAAA,EAAAA,IAAAA,EAAAA,MAAY,CAAC,EAC7BC,QAAQ,iBACPE,KAAA,CAAAC,aAAA,CAACe,YAAY,EAAAC,QAAA,CAAA,EAAA,EAAKnB,QAAQ,EAAA;AAAEe,IAAAA,IAAI,EAAC,GAAG;AAACK,IAAAA,QAAQ,EAAC,iBAAA;GAAmB,CAAA,CAE7D,CACL,CAAC,eACNlB,KAAA,CAAAC,aAAA,CAACkB,OAAO,EAAE,IAAA,CACP,CAAC,CAAA;AAEV;;;;"}

package/build/esm/src/components/Collapsible/Collapsible.d.ts

@@ -0,0 +1,15 @@
+import React from "react";
+import { Box } from "../Box/Box";
+export declare type CollapsibleProps = {
+    /** the first element of the array of children has to be  `<CollapsibleHeader/>`. The rest of the children is the content visible after spreading the component */
+    children: [
+        React.ReactElement<CollapsibleHeaderProps>,
+        ...React.ReactElement[]
+    ];
+    isExpanded: boolean | undefined;
+};
+export declare type CollapsibleHeaderProps = {
+    onClick?: (e: React.FormEvent<HTMLButtonElement>) => void;
+} & React.ComponentProps<typeof Box>;
+export declare function CollapsibleHeader({ space, vSpace, rSpace, lSpace, tSpace, bSpace, onClick, children, }: CollapsibleHeaderProps): React.ReactElement;
+export declare function Collapsible({ isExpanded, children, }: CollapsibleProps): React.ReactElement;

package/build/esm/src/components/Collapsible/Collapsible.js

@@ -0,0 +1,110 @@
+import _styled from '@emotion/styled/base';
+import React, { useContext, createContext } from 'react';
+import { Box } from '../Box/Box.js';
+import { Icon } from '../Icon/Icon.js';
+import { Inline } from '../Inline/Inline.js';
+
+const ANIMATION_TIME = 200;
+const IsExpandedContext = /*#__PURE__*/createContext(false);
+const StyledChildrenContainer = /*#__PURE__*/_styled("div", process.env.NODE_ENV === "production" ? {
+  target: "ecrjv272"
+} : {
+  target: "ecrjv272",
+  label: "StyledChildrenContainer"
+})(() => ({
+  overflow: "hidden"
+}), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkNvbGxhcHNpYmxlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFzQmdDIiwiZmlsZSI6IkNvbGxhcHNpYmxlLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBSZWFjdCwgeyBjcmVhdGVDb250ZXh0LCB1c2VDb250ZXh0IH0gZnJvbSBcInJlYWN0XCI7XG5pbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcbmltcG9ydCB7IEJveCB9IGZyb20gXCIuLi9Cb3gvQm94XCI7XG5pbXBvcnQgeyBJY29uIH0gZnJvbSBcIi4uL0ljb24vSWNvblwiO1xuaW1wb3J0IHsgSW5saW5lIH0gZnJvbSBcIi4uL0lubGluZS9JbmxpbmVcIjtcblxuZXhwb3J0IHR5cGUgQ29sbGFwc2libGVQcm9wcyA9IHtcbiAgLyoqIHRoZSBmaXJzdCBlbGVtZW50IG9mIHRoZSBhcnJheSBvZiBjaGlsZHJlbiBoYXMgdG8gYmUgIGA8Q29sbGFwc2libGVIZWFkZXIvPmAuIFRoZSByZXN0IG9mIHRoZSBjaGlsZHJlbiBpcyB0aGUgY29udGVudCB2aXNpYmxlIGFmdGVyIHNwcmVhZGluZyB0aGUgY29tcG9uZW50ICovXG4gIGNoaWxkcmVuOiBbXG4gICAgUmVhY3QuUmVhY3RFbGVtZW50PENvbGxhcHNpYmxlSGVhZGVyUHJvcHM+LFxuICAgIC4uLlJlYWN0LlJlYWN0RWxlbWVudFtdXG4gIF07XG4gIGlzRXhwYW5kZWQ6IGJvb2xlYW4gfCB1bmRlZmluZWQ7XG59O1xuXG5leHBvcnQgdHlwZSBDb2xsYXBzaWJsZUhlYWRlclByb3BzID0ge1xuICBvbkNsaWNrPzogKGU6IFJlYWN0LkZvcm1FdmVudDxIVE1MQnV0dG9uRWxlbWVudD4pID0+IHZvaWQ7XG59ICYgUmVhY3QuQ29tcG9uZW50UHJvcHM8dHlwZW9mIEJveD47XG5cbmNvbnN0IEFOSU1BVElPTl9USU1FID0gMjAwO1xuY29uc3QgSXNFeHBhbmRlZENvbnRleHQgPSBjcmVhdGVDb250ZXh0KGZhbHNlKTtcblxuY29uc3QgU3R5bGVkQ2hpbGRyZW5Db250YWluZXIgPSBzdHlsZWQuZGl2KCgpID0+ICh7XG4gIG92ZXJmbG93OiBcImhpZGRlblwiLFxufSkpO1xuXG5jb25zdCBTdHlsZWRFeHBhbmRpbmdDb250YWluZXIgPSBzdHlsZWQuZGl2PHtcbiAgaXNFeHBhbmRlZDogYm9vbGVhbjtcbn0+KCh7IGlzRXhwYW5kZWQgfSkgPT4gKHtcbiAgdHJhbnNmb3JtOiBgdHJhbnNsYXRlWSgke2lzRXhwYW5kZWQgPyBcIjAlXCIgOiBcIm1heCgtMTAwcHgsIC01MCUpXCJ9KWAsXG4gIHRyYW5zaXRpb246IGB0cmFuc2Zvcm0gJHtcbiAgICBpc0V4cGFuZGVkID8gQU5JTUFUSU9OX1RJTUUgOiAwXG4gIH1tcyBjdWJpYy1iZXppZXIoMC4wLCAwLjAsIDAuMjUsIDEuMClgLFxufSkpO1xuXG5jb25zdCBTdHlsZWRCdXR0b24gPSBzdHlsZWQuYnV0dG9uPHsgaXNFeHBhbmRlZDogYm9vbGVhbiB9PihcbiAgKHsgdGhlbWUsIGlzRXhwYW5kZWQgfSkgPT4gKHtcbiAgICBkaXNwbGF5OiBcImJsb2NrXCIsXG4gICAgd2lkdGg6IFwiMTAwJVwiLFxuICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUudmFsdWVzLmNvbG9yLmJhY2tncm91bmQucHJpbWFyeS5kZWZhdWx0LFxuICAgIGJvcmRlcjogXCJub25lXCIsXG4gICAgY3Vyc29yOiBcInBvaW50ZXJcIixcbiAgICBwYWRkaW5nOiAwLFxuICAgIC4uLihpc0V4cGFuZGVkICYmIHtcbiAgICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUudmFsdWVzLmNvbG9yLmJhY2tncm91bmQuc2Vjb25kYXJ5LmhvdmVyLFxuICAgICAgXCI6Z2xvYmFsKC5pc0Rhcmttb2RlQWN0aXZlKSAmXCI6IHtcbiAgICAgICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS52YWx1ZXMuY29sb3IuYmFja2dyb3VuZC5wcmltYXJ5LmRlZmF1bHQsXG4gICAgICB9LFxuICAgIH0pLFxuXG4gICAgXCImOmhvdmVyXCI6IHtcbiAgICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUudmFsdWVzLmNvbG9yLmJhY2tncm91bmQuc2Vjb25kYXJ5LmhvdmVyLFxuICAgICAgXCI6Z2xvYmFsKC5pc0Rhcmttb2RlQWN0aXZlKSAmXCI6IHtcbiAgICAgICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS52YWx1ZXMuY29sb3IuYmFja2dyb3VuZC5wcmltYXJ5LmRlZmF1bHQsXG4gICAgICB9LFxuICAgIH0sXG4gIH0pXG4pO1xuXG5leHBvcnQgZnVuY3Rpb24gQ29sbGFwc2libGVIZWFkZXIoe1xuICBzcGFjZSxcbiAgdlNwYWNlLFxuICByU3BhY2UsXG4gIGxTcGFjZSxcbiAgdFNwYWNlLFxuICBiU3BhY2UsXG4gIG9uQ2xpY2ssXG4gIGNoaWxkcmVuLFxufTogQ29sbGFwc2libGVIZWFkZXJQcm9wcyk6IFJlYWN0LlJlYWN0RWxlbWVudCB7XG4gIGNvbnN0IGlzRXhwYW5kZWQgPSB1c2VDb250ZXh0KElzRXhwYW5kZWRDb250ZXh0KTtcbiAgcmV0dXJuIChcbiAgICA8U3R5bGVkQnV0dG9uXG4gICAgICB0eXBlPVwiYnV0dG9uXCJcbiAgICAgIGRhdGEtZHMtaWQ9XCJDb2xsYXBzaWJsZUhlYWRlclwiXG4gICAgICBpc0V4cGFuZGVkPXtpc0V4cGFuZGVkfVxuICAgICAgb25DbGljaz17b25DbGlja31cbiAgICA+XG4gICAgICA8Qm94XG4gICAgICAgIHNwYWNlPXtzcGFjZX1cbiAgICAgICAgdlNwYWNlPXt2U3BhY2V9XG4gICAgICAgIHJTcGFjZT17clNwYWNlfVxuICAgICAgICBsU3BhY2U9e2xTcGFjZX1cbiAgICAgICAgdFNwYWNlPXt0U3BhY2V9XG4gICAgICAgIGJTcGFjZT17YlNwYWNlfVxuICAgICAgPlxuICAgICAgICA8SW5saW5lIGFsaWduSXRlbXM9XCJzcGFjZUJldHdlZW5cIiBub1dyYXA+XG4gICAgICAgICAgPGRpdj57Y2hpbGRyZW59PC9kaXY+XG4gICAgICAgICAgPEljb25cbiAgICAgICAgICAgIG5hbWU9e2lzRXhwYW5kZWQgPyBcImNoZXZyb24tdXBcIiA6IFwiY2hldnJvbi1kb3duXCJ9XG4gICAgICAgICAgICB2YXJpYW50PVwidGVydGlhcnlcIlxuICAgICAgICAgIC8+XG4gICAgICAgIDwvSW5saW5lPlxuICAgICAgPC9Cb3g+XG4gICAgPC9TdHlsZWRCdXR0b24+XG4gICk7XG59XG5cbmV4cG9ydCBmdW5jdGlvbiBDb2xsYXBzaWJsZSh7XG4gIGlzRXhwYW5kZWQsXG4gIGNoaWxkcmVuLFxufTogQ29sbGFwc2libGVQcm9wcyk6IFJlYWN0LlJlYWN0RWxlbWVudCB7XG4gIGNvbnN0IFtjb2xsYXBzaWJsZUhlYWRlciwgLi4uY29sbGFwc2libGVDaGlsZHJlbl0gPSBjaGlsZHJlbjtcbiAgcmV0dXJuIChcbiAgICA8SXNFeHBhbmRlZENvbnRleHQuUHJvdmlkZXIgdmFsdWU9e2lzRXhwYW5kZWR9PlxuICAgICAge2NvbGxhcHNpYmxlSGVhZGVyfVxuICAgICAgPFN0eWxlZENoaWxkcmVuQ29udGFpbmVyIGRhdGEtZHMtaWQ9XCJDb2xsYXBzaWJsZVwiPlxuICAgICAgICA8U3R5bGVkRXhwYW5kaW5nQ29udGFpbmVyIGlzRXhwYW5kZWQ9e2lzRXhwYW5kZWR9PlxuICAgICAgICAgIHtpc0V4cGFuZGVkICYmIGNvbGxhcHNpYmxlQ2hpbGRyZW59XG4gICAgICAgIDwvU3R5bGVkRXhwYW5kaW5nQ29udGFpbmVyPlxuICAgICAgPC9TdHlsZWRDaGlsZHJlbkNvbnRhaW5lcj5cbiAgICA8L0lzRXhwYW5kZWRDb250ZXh0LlByb3ZpZGVyPlxuICApO1xufVxuIl19 */");
+const StyledExpandingContainer = /*#__PURE__*/_styled("div", process.env.NODE_ENV === "production" ? {
+  target: "ecrjv271"
+} : {
+  target: "ecrjv271",
+  label: "StyledExpandingContainer"
+})(_ref => {
+  let {
+    isExpanded
+  } = _ref;
+  return {
+    transform: `translateY(${isExpanded ? "0%" : "max(-100px, -50%)"})`,
+    transition: `transform ${isExpanded ? ANIMATION_TIME : 0}ms cubic-bezier(0.0, 0.0, 0.25, 1.0)`
+  };
+}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkNvbGxhcHNpYmxlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUEwQmlDIiwiZmlsZSI6IkNvbGxhcHNpYmxlLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBSZWFjdCwgeyBjcmVhdGVDb250ZXh0LCB1c2VDb250ZXh0IH0gZnJvbSBcInJlYWN0XCI7XG5pbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcbmltcG9ydCB7IEJveCB9IGZyb20gXCIuLi9Cb3gvQm94XCI7XG5pbXBvcnQgeyBJY29uIH0gZnJvbSBcIi4uL0ljb24vSWNvblwiO1xuaW1wb3J0IHsgSW5saW5lIH0gZnJvbSBcIi4uL0lubGluZS9JbmxpbmVcIjtcblxuZXhwb3J0IHR5cGUgQ29sbGFwc2libGVQcm9wcyA9IHtcbiAgLyoqIHRoZSBmaXJzdCBlbGVtZW50IG9mIHRoZSBhcnJheSBvZiBjaGlsZHJlbiBoYXMgdG8gYmUgIGA8Q29sbGFwc2libGVIZWFkZXIvPmAuIFRoZSByZXN0IG9mIHRoZSBjaGlsZHJlbiBpcyB0aGUgY29udGVudCB2aXNpYmxlIGFmdGVyIHNwcmVhZGluZyB0aGUgY29tcG9uZW50ICovXG4gIGNoaWxkcmVuOiBbXG4gICAgUmVhY3QuUmVhY3RFbGVtZW50PENvbGxhcHNpYmxlSGVhZGVyUHJvcHM+LFxuICAgIC4uLlJlYWN0LlJlYWN0RWxlbWVudFtdXG4gIF07XG4gIGlzRXhwYW5kZWQ6IGJvb2xlYW4gfCB1bmRlZmluZWQ7XG59O1xuXG5leHBvcnQgdHlwZSBDb2xsYXBzaWJsZUhlYWRlclByb3BzID0ge1xuICBvbkNsaWNrPzogKGU6IFJlYWN0LkZvcm1FdmVudDxIVE1MQnV0dG9uRWxlbWVudD4pID0+IHZvaWQ7XG59ICYgUmVhY3QuQ29tcG9uZW50UHJvcHM8dHlwZW9mIEJveD47XG5cbmNvbnN0IEFOSU1BVElPTl9USU1FID0gMjAwO1xuY29uc3QgSXNFeHBhbmRlZENvbnRleHQgPSBjcmVhdGVDb250ZXh0KGZhbHNlKTtcblxuY29uc3QgU3R5bGVkQ2hpbGRyZW5Db250YWluZXIgPSBzdHlsZWQuZGl2KCgpID0+ICh7XG4gIG92ZXJmbG93OiBcImhpZGRlblwiLFxufSkpO1xuXG5jb25zdCBTdHlsZWRFeHBhbmRpbmdDb250YWluZXIgPSBzdHlsZWQuZGl2PHtcbiAgaXNFeHBhbmRlZDogYm9vbGVhbjtcbn0+KCh7IGlzRXhwYW5kZWQgfSkgPT4gKHtcbiAgdHJhbnNmb3JtOiBgdHJhbnNsYXRlWSgke2lzRXhwYW5kZWQgPyBcIjAlXCIgOiBcIm1heCgtMTAwcHgsIC01MCUpXCJ9KWAsXG4gIHRyYW5zaXRpb246IGB0cmFuc2Zvcm0gJHtcbiAgICBpc0V4cGFuZGVkID8gQU5JTUFUSU9OX1RJTUUgOiAwXG4gIH1tcyBjdWJpYy1iZXppZXIoMC4wLCAwLjAsIDAuMjUsIDEuMClgLFxufSkpO1xuXG5jb25zdCBTdHlsZWRCdXR0b24gPSBzdHlsZWQuYnV0dG9uPHsgaXNFeHBhbmRlZDogYm9vbGVhbiB9PihcbiAgKHsgdGhlbWUsIGlzRXhwYW5kZWQgfSkgPT4gKHtcbiAgICBkaXNwbGF5OiBcImJsb2NrXCIsXG4gICAgd2lkdGg6IFwiMTAwJVwiLFxuICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUudmFsdWVzLmNvbG9yLmJhY2tncm91bmQucHJpbWFyeS5kZWZhdWx0LFxuICAgIGJvcmRlcjogXCJub25lXCIsXG4gICAgY3Vyc29yOiBcInBvaW50ZXJcIixcbiAgICBwYWRkaW5nOiAwLFxuICAgIC4uLihpc0V4cGFuZGVkICYmIHtcbiAgICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUudmFsdWVzLmNvbG9yLmJhY2tncm91bmQuc2Vjb25kYXJ5LmhvdmVyLFxuICAgICAgXCI6Z2xvYmFsKC5pc0Rhcmttb2RlQWN0aXZlKSAmXCI6IHtcbiAgICAgICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS52YWx1ZXMuY29sb3IuYmFja2dyb3VuZC5wcmltYXJ5LmRlZmF1bHQsXG4gICAgICB9LFxuICAgIH0pLFxuXG4gICAgXCImOmhvdmVyXCI6IHtcbiAgICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUudmFsdWVzLmNvbG9yLmJhY2tncm91bmQuc2Vjb25kYXJ5LmhvdmVyLFxuICAgICAgXCI6Z2xvYmFsKC5pc0Rhcmttb2RlQWN0aXZlKSAmXCI6IHtcbiAgICAgICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS52YWx1ZXMuY29sb3IuYmFja2dyb3VuZC5wcmltYXJ5LmRlZmF1bHQsXG4gICAgICB9LFxuICAgIH0sXG4gIH0pXG4pO1xuXG5leHBvcnQgZnVuY3Rpb24gQ29sbGFwc2libGVIZWFkZXIoe1xuICBzcGFjZSxcbiAgdlNwYWNlLFxuICByU3BhY2UsXG4gIGxTcGFjZSxcbiAgdFNwYWNlLFxuICBiU3BhY2UsXG4gIG9uQ2xpY2ssXG4gIGNoaWxkcmVuLFxufTogQ29sbGFwc2libGVIZWFkZXJQcm9wcyk6IFJlYWN0LlJlYWN0RWxlbWVudCB7XG4gIGNvbnN0IGlzRXhwYW5kZWQgPSB1c2VDb250ZXh0KElzRXhwYW5kZWRDb250ZXh0KTtcbiAgcmV0dXJuIChcbiAgICA8U3R5bGVkQnV0dG9uXG4gICAgICB0eXBlPVwiYnV0dG9uXCJcbiAgICAgIGRhdGEtZHMtaWQ9XCJDb2xsYXBzaWJsZUhlYWRlclwiXG4gICAgICBpc0V4cGFuZGVkPXtpc0V4cGFuZGVkfVxuICAgICAgb25DbGljaz17b25DbGlja31cbiAgICA+XG4gICAgICA8Qm94XG4gICAgICAgIHNwYWNlPXtzcGFjZX1cbiAgICAgICAgdlNwYWNlPXt2U3BhY2V9XG4gICAgICAgIHJTcGFjZT17clNwYWNlfVxuICAgICAgICBsU3BhY2U9e2xTcGFjZX1cbiAgICAgICAgdFNwYWNlPXt0U3BhY2V9XG4gICAgICAgIGJTcGFjZT17YlNwYWNlfVxuICAgICAgPlxuICAgICAgICA8SW5saW5lIGFsaWduSXRlbXM9XCJzcGFjZUJldHdlZW5cIiBub1dyYXA+XG4gICAgICAgICAgPGRpdj57Y2hpbGRyZW59PC9kaXY+XG4gICAgICAgICAgPEljb25cbiAgICAgICAgICAgIG5hbWU9e2lzRXhwYW5kZWQgPyBcImNoZXZyb24tdXBcIiA6IFwiY2hldnJvbi1kb3duXCJ9XG4gICAgICAgICAgICB2YXJpYW50PVwidGVydGlhcnlcIlxuICAgICAgICAgIC8+XG4gICAgICAgIDwvSW5saW5lPlxuICAgICAgPC9Cb3g+XG4gICAgPC9TdHlsZWRCdXR0b24+XG4gICk7XG59XG5cbmV4cG9ydCBmdW5jdGlvbiBDb2xsYXBzaWJsZSh7XG4gIGlzRXhwYW5kZWQsXG4gIGNoaWxkcmVuLFxufTogQ29sbGFwc2libGVQcm9wcyk6IFJlYWN0LlJlYWN0RWxlbWVudCB7XG4gIGNvbnN0IFtjb2xsYXBzaWJsZUhlYWRlciwgLi4uY29sbGFwc2libGVDaGlsZHJlbl0gPSBjaGlsZHJlbjtcbiAgcmV0dXJuIChcbiAgICA8SXNFeHBhbmRlZENvbnRleHQuUHJvdmlkZXIgdmFsdWU9e2lzRXhwYW5kZWR9PlxuICAgICAge2NvbGxhcHNpYmxlSGVhZGVyfVxuICAgICAgPFN0eWxlZENoaWxkcmVuQ29udGFpbmVyIGRhdGEtZHMtaWQ9XCJDb2xsYXBzaWJsZVwiPlxuICAgICAgICA8U3R5bGVkRXhwYW5kaW5nQ29udGFpbmVyIGlzRXhwYW5kZWQ9e2lzRXhwYW5kZWR9PlxuICAgICAgICAgIHtpc0V4cGFuZGVkICYmIGNvbGxhcHNpYmxlQ2hpbGRyZW59XG4gICAgICAgIDwvU3R5bGVkRXhwYW5kaW5nQ29udGFpbmVyPlxuICAgICAgPC9TdHlsZWRDaGlsZHJlbkNvbnRhaW5lcj5cbiAgICA8L0lzRXhwYW5kZWRDb250ZXh0LlByb3ZpZGVyPlxuICApO1xufVxuIl19 */");
+const StyledButton = /*#__PURE__*/_styled("button", process.env.NODE_ENV === "production" ? {
+  target: "ecrjv270"
+} : {
+  target: "ecrjv270",
+  label: "StyledButton"
+})(_ref2 => {
+  let {
+    theme,
+    isExpanded
+  } = _ref2;
+  return {
+    display: "block",
+    width: "100%",
+    backgroundColor: theme.values.color.background.primary.default,
+    border: "none",
+    cursor: "pointer",
+    padding: 0,
+    ...(isExpanded && {
+      backgroundColor: theme.values.color.background.secondary.hover,
+      ":global(.isDarkmodeActive) &": {
+        backgroundColor: theme.values.color.background.primary.default
+      }
+    }),
+    "&:hover": {
+      backgroundColor: theme.values.color.background.secondary.hover,
+      ":global(.isDarkmodeActive) &": {
+        backgroundColor: theme.values.color.background.primary.default
+      }
+    }
+  };
+}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkNvbGxhcHNpYmxlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFtQ3FCIiwiZmlsZSI6IkNvbGxhcHNpYmxlLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBSZWFjdCwgeyBjcmVhdGVDb250ZXh0LCB1c2VDb250ZXh0IH0gZnJvbSBcInJlYWN0XCI7XG5pbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcbmltcG9ydCB7IEJveCB9IGZyb20gXCIuLi9Cb3gvQm94XCI7XG5pbXBvcnQgeyBJY29uIH0gZnJvbSBcIi4uL0ljb24vSWNvblwiO1xuaW1wb3J0IHsgSW5saW5lIH0gZnJvbSBcIi4uL0lubGluZS9JbmxpbmVcIjtcblxuZXhwb3J0IHR5cGUgQ29sbGFwc2libGVQcm9wcyA9IHtcbiAgLyoqIHRoZSBmaXJzdCBlbGVtZW50IG9mIHRoZSBhcnJheSBvZiBjaGlsZHJlbiBoYXMgdG8gYmUgIGA8Q29sbGFwc2libGVIZWFkZXIvPmAuIFRoZSByZXN0IG9mIHRoZSBjaGlsZHJlbiBpcyB0aGUgY29udGVudCB2aXNpYmxlIGFmdGVyIHNwcmVhZGluZyB0aGUgY29tcG9uZW50ICovXG4gIGNoaWxkcmVuOiBbXG4gICAgUmVhY3QuUmVhY3RFbGVtZW50PENvbGxhcHNpYmxlSGVhZGVyUHJvcHM+LFxuICAgIC4uLlJlYWN0LlJlYWN0RWxlbWVudFtdXG4gIF07XG4gIGlzRXhwYW5kZWQ6IGJvb2xlYW4gfCB1bmRlZmluZWQ7XG59O1xuXG5leHBvcnQgdHlwZSBDb2xsYXBzaWJsZUhlYWRlclByb3BzID0ge1xuICBvbkNsaWNrPzogKGU6IFJlYWN0LkZvcm1FdmVudDxIVE1MQnV0dG9uRWxlbWVudD4pID0+IHZvaWQ7XG59ICYgUmVhY3QuQ29tcG9uZW50UHJvcHM8dHlwZW9mIEJveD47XG5cbmNvbnN0IEFOSU1BVElPTl9USU1FID0gMjAwO1xuY29uc3QgSXNFeHBhbmRlZENvbnRleHQgPSBjcmVhdGVDb250ZXh0KGZhbHNlKTtcblxuY29uc3QgU3R5bGVkQ2hpbGRyZW5Db250YWluZXIgPSBzdHlsZWQuZGl2KCgpID0+ICh7XG4gIG92ZXJmbG93OiBcImhpZGRlblwiLFxufSkpO1xuXG5jb25zdCBTdHlsZWRFeHBhbmRpbmdDb250YWluZXIgPSBzdHlsZWQuZGl2PHtcbiAgaXNFeHBhbmRlZDogYm9vbGVhbjtcbn0+KCh7IGlzRXhwYW5kZWQgfSkgPT4gKHtcbiAgdHJhbnNmb3JtOiBgdHJhbnNsYXRlWSgke2lzRXhwYW5kZWQgPyBcIjAlXCIgOiBcIm1heCgtMTAwcHgsIC01MCUpXCJ9KWAsXG4gIHRyYW5zaXRpb246IGB0cmFuc2Zvcm0gJHtcbiAgICBpc0V4cGFuZGVkID8gQU5JTUFUSU9OX1RJTUUgOiAwXG4gIH1tcyBjdWJpYy1iZXppZXIoMC4wLCAwLjAsIDAuMjUsIDEuMClgLFxufSkpO1xuXG5jb25zdCBTdHlsZWRCdXR0b24gPSBzdHlsZWQuYnV0dG9uPHsgaXNFeHBhbmRlZDogYm9vbGVhbiB9PihcbiAgKHsgdGhlbWUsIGlzRXhwYW5kZWQgfSkgPT4gKHtcbiAgICBkaXNwbGF5OiBcImJsb2NrXCIsXG4gICAgd2lkdGg6IFwiMTAwJVwiLFxuICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUudmFsdWVzLmNvbG9yLmJhY2tncm91bmQucHJpbWFyeS5kZWZhdWx0LFxuICAgIGJvcmRlcjogXCJub25lXCIsXG4gICAgY3Vyc29yOiBcInBvaW50ZXJcIixcbiAgICBwYWRkaW5nOiAwLFxuICAgIC4uLihpc0V4cGFuZGVkICYmIHtcbiAgICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUudmFsdWVzLmNvbG9yLmJhY2tncm91bmQuc2Vjb25kYXJ5LmhvdmVyLFxuICAgICAgXCI6Z2xvYmFsKC5pc0Rhcmttb2RlQWN0aXZlKSAmXCI6IHtcbiAgICAgICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS52YWx1ZXMuY29sb3IuYmFja2dyb3VuZC5wcmltYXJ5LmRlZmF1bHQsXG4gICAgICB9LFxuICAgIH0pLFxuXG4gICAgXCImOmhvdmVyXCI6IHtcbiAgICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUudmFsdWVzLmNvbG9yLmJhY2tncm91bmQuc2Vjb25kYXJ5LmhvdmVyLFxuICAgICAgXCI6Z2xvYmFsKC5pc0Rhcmttb2RlQWN0aXZlKSAmXCI6IHtcbiAgICAgICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS52YWx1ZXMuY29sb3IuYmFja2dyb3VuZC5wcmltYXJ5LmRlZmF1bHQsXG4gICAgICB9LFxuICAgIH0sXG4gIH0pXG4pO1xuXG5leHBvcnQgZnVuY3Rpb24gQ29sbGFwc2libGVIZWFkZXIoe1xuICBzcGFjZSxcbiAgdlNwYWNlLFxuICByU3BhY2UsXG4gIGxTcGFjZSxcbiAgdFNwYWNlLFxuICBiU3BhY2UsXG4gIG9uQ2xpY2ssXG4gIGNoaWxkcmVuLFxufTogQ29sbGFwc2libGVIZWFkZXJQcm9wcyk6IFJlYWN0LlJlYWN0RWxlbWVudCB7XG4gIGNvbnN0IGlzRXhwYW5kZWQgPSB1c2VDb250ZXh0KElzRXhwYW5kZWRDb250ZXh0KTtcbiAgcmV0dXJuIChcbiAgICA8U3R5bGVkQnV0dG9uXG4gICAgICB0eXBlPVwiYnV0dG9uXCJcbiAgICAgIGRhdGEtZHMtaWQ9XCJDb2xsYXBzaWJsZUhlYWRlclwiXG4gICAgICBpc0V4cGFuZGVkPXtpc0V4cGFuZGVkfVxuICAgICAgb25DbGljaz17b25DbGlja31cbiAgICA+XG4gICAgICA8Qm94XG4gICAgICAgIHNwYWNlPXtzcGFjZX1cbiAgICAgICAgdlNwYWNlPXt2U3BhY2V9XG4gICAgICAgIHJTcGFjZT17clNwYWNlfVxuICAgICAgICBsU3BhY2U9e2xTcGFjZX1cbiAgICAgICAgdFNwYWNlPXt0U3BhY2V9XG4gICAgICAgIGJTcGFjZT17YlNwYWNlfVxuICAgICAgPlxuICAgICAgICA8SW5saW5lIGFsaWduSXRlbXM9XCJzcGFjZUJldHdlZW5cIiBub1dyYXA+XG4gICAgICAgICAgPGRpdj57Y2hpbGRyZW59PC9kaXY+XG4gICAgICAgICAgPEljb25cbiAgICAgICAgICAgIG5hbWU9e2lzRXhwYW5kZWQgPyBcImNoZXZyb24tdXBcIiA6IFwiY2hldnJvbi1kb3duXCJ9XG4gICAgICAgICAgICB2YXJpYW50PVwidGVydGlhcnlcIlxuICAgICAgICAgIC8+XG4gICAgICAgIDwvSW5saW5lPlxuICAgICAgPC9Cb3g+XG4gICAgPC9TdHlsZWRCdXR0b24+XG4gICk7XG59XG5cbmV4cG9ydCBmdW5jdGlvbiBDb2xsYXBzaWJsZSh7XG4gIGlzRXhwYW5kZWQsXG4gIGNoaWxkcmVuLFxufTogQ29sbGFwc2libGVQcm9wcyk6IFJlYWN0LlJlYWN0RWxlbWVudCB7XG4gIGNvbnN0IFtjb2xsYXBzaWJsZUhlYWRlciwgLi4uY29sbGFwc2libGVDaGlsZHJlbl0gPSBjaGlsZHJlbjtcbiAgcmV0dXJuIChcbiAgICA8SXNFeHBhbmRlZENvbnRleHQuUHJvdmlkZXIgdmFsdWU9e2lzRXhwYW5kZWR9PlxuICAgICAge2NvbGxhcHNpYmxlSGVhZGVyfVxuICAgICAgPFN0eWxlZENoaWxkcmVuQ29udGFpbmVyIGRhdGEtZHMtaWQ9XCJDb2xsYXBzaWJsZVwiPlxuICAgICAgICA8U3R5bGVkRXhwYW5kaW5nQ29udGFpbmVyIGlzRXhwYW5kZWQ9e2lzRXhwYW5kZWR9PlxuICAgICAgICAgIHtpc0V4cGFuZGVkICYmIGNvbGxhcHNpYmxlQ2hpbGRyZW59XG4gICAgICAgIDwvU3R5bGVkRXhwYW5kaW5nQ29udGFpbmVyPlxuICAgICAgPC9TdHlsZWRDaGlsZHJlbkNvbnRhaW5lcj5cbiAgICA8L0lzRXhwYW5kZWRDb250ZXh0LlByb3ZpZGVyPlxuICApO1xufVxuIl19 */");
+function CollapsibleHeader(_ref3) {
+  let {
+    space,
+    vSpace,
+    rSpace,
+    lSpace,
+    tSpace,
+    bSpace,
+    onClick,
+    children
+  } = _ref3;
+  const isExpanded = useContext(IsExpandedContext);
+  return /*#__PURE__*/React.createElement(StyledButton, {
+    type: "button",
+    "data-ds-id": "CollapsibleHeader",
+    isExpanded: isExpanded,
+    onClick: onClick
+  }, /*#__PURE__*/React.createElement(Box, {
+    space: space,
+    vSpace: vSpace,
+    rSpace: rSpace,
+    lSpace: lSpace,
+    tSpace: tSpace,
+    bSpace: bSpace
+  }, /*#__PURE__*/React.createElement(Inline, {
+    alignItems: "spaceBetween",
+    noWrap: true
+  }, /*#__PURE__*/React.createElement("div", null, children), /*#__PURE__*/React.createElement(Icon, {
+    name: isExpanded ? "chevron-up" : "chevron-down",
+    variant: "tertiary"
+  }))));
+}
+function Collapsible(_ref4) {
+  let {
+    isExpanded,
+    children
+  } = _ref4;
+  const [collapsibleHeader, ...collapsibleChildren] = children;
+  return /*#__PURE__*/React.createElement(IsExpandedContext.Provider, {
+    value: isExpanded
+  }, collapsibleHeader, /*#__PURE__*/React.createElement(StyledChildrenContainer, {
+    "data-ds-id": "Collapsible"
+  }, /*#__PURE__*/React.createElement(StyledExpandingContainer, {
+    isExpanded: isExpanded
+  }, isExpanded && collapsibleChildren)));
+}
+
+export { Collapsible, CollapsibleHeader };
+//# sourceMappingURL=Collapsible.js.map

package/build/esm/src/components/Collapsible/Collapsible.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Collapsible.js","sources":["../../../../../src/components/Collapsible/Collapsible.tsx"],"sourcesContent":["import React, { createContext, useContext } from \"react\";\nimport styled from \"@emotion/styled\";\nimport { Box } from \"../Box/Box\";\nimport { Icon } from \"../Icon/Icon\";\nimport { Inline } from \"../Inline/Inline\";\n\nexport type CollapsibleProps = {\n  /** the first element of the array of children has to be  `<CollapsibleHeader/>`. The rest of the children is the content visible after spreading the component */\n  children: [\n    React.ReactElement<CollapsibleHeaderProps>,\n    ...React.ReactElement[]\n  ];\n  isExpanded: boolean | undefined;\n};\n\nexport type CollapsibleHeaderProps = {\n  onClick?: (e: React.FormEvent<HTMLButtonElement>) => void;\n} & React.ComponentProps<typeof Box>;\n\nconst ANIMATION_TIME = 200;\nconst IsExpandedContext = createContext(false);\n\nconst StyledChildrenContainer = styled.div(() => ({\n  overflow: \"hidden\",\n}));\n\nconst StyledExpandingContainer = styled.div<{\n  isExpanded: boolean;\n}>(({ isExpanded }) => ({\n  transform: `translateY(${isExpanded ? \"0%\" : \"max(-100px, -50%)\"})`,\n  transition: `transform ${\n    isExpanded ? ANIMATION_TIME : 0\n  }ms cubic-bezier(0.0, 0.0, 0.25, 1.0)`,\n}));\n\nconst StyledButton = styled.button<{ isExpanded: boolean }>(\n  ({ theme, isExpanded }) => ({\n    display: \"block\",\n    width: \"100%\",\n    backgroundColor: theme.values.color.background.primary.default,\n    border: \"none\",\n    cursor: \"pointer\",\n    padding: 0,\n    ...(isExpanded && {\n      backgroundColor: theme.values.color.background.secondary.hover,\n      \":global(.isDarkmodeActive) &\": {\n        backgroundColor: theme.values.color.background.primary.default,\n      },\n    }),\n\n    \"&:hover\": {\n      backgroundColor: theme.values.color.background.secondary.hover,\n      \":global(.isDarkmodeActive) &\": {\n        backgroundColor: theme.values.color.background.primary.default,\n      },\n    },\n  })\n);\n\nexport function CollapsibleHeader({\n  space,\n  vSpace,\n  rSpace,\n  lSpace,\n  tSpace,\n  bSpace,\n  onClick,\n  children,\n}: CollapsibleHeaderProps): React.ReactElement {\n  const isExpanded = useContext(IsExpandedContext);\n  return (\n    <StyledButton\n      type=\"button\"\n      data-ds-id=\"CollapsibleHeader\"\n      isExpanded={isExpanded}\n      onClick={onClick}\n    >\n      <Box\n        space={space}\n        vSpace={vSpace}\n        rSpace={rSpace}\n        lSpace={lSpace}\n        tSpace={tSpace}\n        bSpace={bSpace}\n      >\n        <Inline alignItems=\"spaceBetween\" noWrap>\n          <div>{children}</div>\n          <Icon\n            name={isExpanded ? \"chevron-up\" : \"chevron-down\"}\n            variant=\"tertiary\"\n          />\n        </Inline>\n      </Box>\n    </StyledButton>\n  );\n}\n\nexport function Collapsible({\n  isExpanded,\n  children,\n}: CollapsibleProps): React.ReactElement {\n  const [collapsibleHeader, ...collapsibleChildren] = children;\n  return (\n    <IsExpandedContext.Provider value={isExpanded}>\n      {collapsibleHeader}\n      <StyledChildrenContainer data-ds-id=\"Collapsible\">\n        <StyledExpandingContainer isExpanded={isExpanded}>\n          {isExpanded && collapsibleChildren}\n        </StyledExpandingContainer>\n      </StyledChildrenContainer>\n    </IsExpandedContext.Provider>\n  );\n}\n"],"names":["ANIMATION_TIME","IsExpandedContext","createContext","StyledChildrenContainer","_styled","process","env","NODE_ENV","target","label","overflow","StyledExpandingContainer","_ref","isExpanded","transform","transition","StyledButton","_ref2","theme","display","width","backgroundColor","values","color","background","primary","default","border","cursor","padding","secondary","hover","CollapsibleHeader","_ref3","space","vSpace","rSpace","lSpace","tSpace","bSpace","onClick","children","useContext","React","createElement","type","Box","Inline","alignItems","noWrap","Icon","name","variant","Collapsible","_ref4","collapsibleHeader","collapsibleChildren","Provider","value"],"mappings":"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"}

package/build/esm/src/components/Column/Columns.d.ts

@@ -0,0 +1,45 @@
+import React from "react";
+import { MQ, HorizontalAlignment, SpaceSizes, VerticalAlignment, ColumnSizes, ColumnAlignment, Order } from "../../types";
+export declare type ColumnsProps = {
+    children: React.ReactNode[] | React.ReactNode;
+    /** represents the size of both horizontal and vertical gap between children, can be a single string or an array of 3 strings
+     * specify [small screen gap size, medium screen gap size, large screen gap size] to apply different gap sizes for different screen sizes
+     */
+    gap?: SpaceSizes | MQ<SpaceSizes>;
+    /** set to true if you want the last element to fill the space
+     */
+    alwaysFillSpace?: boolean;
+    /** specify horizontal alignment
+     * specify [small screen alignItems, medium screen alignItems, large screen alignItems] to apply different alignItems for different screen sizes
+     */
+    alignItems?: HorizontalAlignment | MQ<HorizontalAlignment>;
+    /** specify vertical alignment
+     * specify [small screen vAlignItems, medium screen vAlignItems, large screen vAlignItems] to apply different vAlignItems for different screen sizes
+     */
+    vAlignItems?: VerticalAlignment | MQ<VerticalAlignment>;
+    "data-e2e-test-id"?: string;
+    /** @ignore */
+    "data-ds-id"?: string;
+};
+export declare type ColumnProps = {
+    children: React.ReactNode[] | React.ReactNode;
+    /** represents the size of the column, can be a single number or an array of 3 numbers with a value ranging from 1 to 12
+     * specify [small screen column size, medium screen column size, large screen column size] to apply different values for different screen sizes
+     */
+    size?: ColumnSizes | MQ<ColumnSizes>;
+    /** specify the visual positioning of the column. [small screen column order, medium screen column order, large screen column order] to apply different order for different screen sizes
+     */
+    order?: Order | MQ<Order>;
+    alignSelf?: ColumnAlignment | MQ<ColumnAlignment>;
+    "data-e2e-test-id"?: string;
+    /** @ignore */
+    "data-ds-id"?: string;
+};
+export declare const Column: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType<any>;
+} & Partial<ColumnProps>, React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const Columns: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType<any>;
+} & Partial<ColumnsProps>, React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;