@amboss/design-system 2.0.2 → 2.0.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,4 +1,5 @@
1
1
  import React from "react";
2
+ import type { Property } from "csstype";
2
3
  import { Box } from "../Box/Box";
3
4
  export type CollapsibleProps = {
4
5
  /** 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 */
@@ -7,9 +8,10 @@ export type CollapsibleProps = {
7
8
  ...React.ReactElement[]
8
9
  ];
9
10
  isExpanded: boolean | undefined;
11
+ overflow?: Property.Overflow;
10
12
  };
11
13
  export type CollapsibleHeaderProps = {
12
14
  onClick?: (e: React.FormEvent<HTMLButtonElement>) => void;
13
15
  } & React.ComponentProps<typeof Box>;
14
16
  export declare function CollapsibleHeader({ space, vSpace, rSpace, lSpace, tSpace, bSpace, onClick, children, }: CollapsibleHeaderProps): React.ReactElement;
15
- export declare function Collapsible({ isExpanded, children, }: CollapsibleProps): React.ReactElement;
17
+ export declare function Collapsible({ isExpanded, overflow, children, }: CollapsibleProps): React.ReactElement;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),function(target,all){for(var name in all)Object.defineProperty(target,name,{enumerable:!0,get:all[name]})}(exports,{Collapsible:function(){return Collapsible},CollapsibleHeader:function(){return CollapsibleHeader}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=require("@swc/helpers/_/_interop_require_wildcard")._(require("react")),_styled=_interop_require_default._(require("@emotion/styled")),_Box=require("../Box/Box"),_Icon=require("../Icon/Icon"),_Inline=require("../Inline/Inline"),_Expandable=require("../Utilities/Expandable/Expandable"),IsExpandedContext=(0,_react.createContext)(!1),StyledButton=(0,_styled.default)("button",{target:"eivwvsl0",label:"StyledButton"})(({theme,isExpanded})=>({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}}}),"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3JjL2NvbXBvbmVudHMvQ29sbGFwc2libGUvQ29sbGFwc2libGUudHN4Iiwic291cmNlcyI6WyJzcmMvY29tcG9uZW50cy9Db2xsYXBzaWJsZS9Db2xsYXBzaWJsZS50c3giXSwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0LCB7IGNyZWF0ZUNvbnRleHQsIHVzZUNvbnRleHQgfSBmcm9tIFwicmVhY3RcIjtcbmltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsgQm94IH0gZnJvbSBcIi4uL0JveC9Cb3hcIjtcbmltcG9ydCB7IEljb24gfSBmcm9tIFwiLi4vSWNvbi9JY29uXCI7XG5pbXBvcnQgeyBJbmxpbmUgfSBmcm9tIFwiLi4vSW5saW5lL0lubGluZVwiO1xuaW1wb3J0IHsgRXhwYW5kYWJsZSB9IGZyb20gXCIuLi9VdGlsaXRpZXMvRXhwYW5kYWJsZS9FeHBhbmRhYmxlXCI7XG5cbmV4cG9ydCB0eXBlIENvbGxhcHNpYmxlUHJvcHMgPSB7XG4gIC8qKiB0aGUgZmlyc3QgZWxlbWVudCBvZiB0aGUgYXJyYXkgb2YgY2hpbGRyZW4gaGFzIHRvIGJlICBgPENvbGxhcHNpYmxlSGVhZGVyLz5gLiBUaGUgcmVzdCBvZiB0aGUgY2hpbGRyZW4gaXMgdGhlIGNvbnRlbnQgdmlzaWJsZSBhZnRlciBzcHJlYWRpbmcgdGhlIGNvbXBvbmVudCAqL1xuICBjaGlsZHJlbjogW1xuICAgIFJlYWN0LlJlYWN0RWxlbWVudDxDb2xsYXBzaWJsZUhlYWRlclByb3BzPixcbiAgICAuLi5SZWFjdC5SZWFjdEVsZW1lbnRbXVxuICBdO1xuICBpc0V4cGFuZGVkOiBib29sZWFuIHwgdW5kZWZpbmVkO1xufTtcblxuZXhwb3J0IHR5cGUgQ29sbGFwc2libGVIZWFkZXJQcm9wcyA9IHtcbiAgb25DbGljaz86IChlOiBSZWFjdC5Gb3JtRXZlbnQ8SFRNTEJ1dHRvbkVsZW1lbnQ+KSA9PiB2b2lkO1xufSAmIFJlYWN0LkNvbXBvbmVudFByb3BzPHR5cGVvZiBCb3g+O1xuXG5jb25zdCBJc0V4cGFuZGVkQ29udGV4dCA9IGNyZWF0ZUNvbnRleHQoZmFsc2UpO1xuXG5jb25zdCBTdHlsZWRCdXR0b24gPSBzdHlsZWQuYnV0dG9uPHsgaXNFeHBhbmRlZDogYm9vbGVhbiB9PihcbiAgKHsgdGhlbWUsIGlzRXhwYW5kZWQgfSkgPT4gKHtcbiAgICBkaXNwbGF5OiBcImJsb2NrXCIsXG4gICAgd2lkdGg6IFwiMTAwJVwiLFxuICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUudmFsdWVzLmNvbG9yLmJhY2tncm91bmQucHJpbWFyeS5kZWZhdWx0LFxuICAgIGJvcmRlcjogXCJub25lXCIsXG4gICAgY3Vyc29yOiBcInBvaW50ZXJcIixcbiAgICBwYWRkaW5nOiAwLFxuICAgIC4uLihpc0V4cGFuZGVkICYmIHtcbiAgICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUudmFsdWVzLmNvbG9yLmJhY2tncm91bmQuc2Vjb25kYXJ5LmhvdmVyLFxuICAgICAgXCI6Z2xvYmFsKC5pc0Rhcmttb2RlQWN0aXZlKSAmXCI6IHtcbiAgICAgICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS52YWx1ZXMuY29sb3IuYmFja2dyb3VuZC5wcmltYXJ5LmRlZmF1bHQsXG4gICAgICB9LFxuICAgIH0pLFxuXG4gICAgXCImOmhvdmVyXCI6IHtcbiAgICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUudmFsdWVzLmNvbG9yLmJhY2tncm91bmQuc2Vjb25kYXJ5LmhvdmVyLFxuICAgICAgXCI6Z2xvYmFsKC5pc0Rhcmttb2RlQWN0aXZlKSAmXCI6IHtcbiAgICAgICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS52YWx1ZXMuY29sb3IuYmFja2dyb3VuZC5wcmltYXJ5LmRlZmF1bHQsXG4gICAgICB9LFxuICAgIH0sXG4gIH0pXG4pO1xuXG5leHBvcnQgZnVuY3Rpb24gQ29sbGFwc2libGVIZWFkZXIoe1xuICBzcGFjZSxcbiAgdlNwYWNlLFxuICByU3BhY2UsXG4gIGxTcGFjZSxcbiAgdFNwYWNlLFxuICBiU3BhY2UsXG4gIG9uQ2xpY2ssXG4gIGNoaWxkcmVuLFxufTogQ29sbGFwc2libGVIZWFkZXJQcm9wcyk6IFJlYWN0LlJlYWN0RWxlbWVudCB7XG4gIGNvbnN0IGlzRXhwYW5kZWQgPSB1c2VDb250ZXh0KElzRXhwYW5kZWRDb250ZXh0KTtcbiAgcmV0dXJuIChcbiAgICA8U3R5bGVkQnV0dG9uXG4gICAgICB0eXBlPVwiYnV0dG9uXCJcbiAgICAgIGRhdGEtZHMtaWQ9XCJDb2xsYXBzaWJsZUhlYWRlclwiXG4gICAgICBpc0V4cGFuZGVkPXtpc0V4cGFuZGVkfVxuICAgICAgb25DbGljaz17b25DbGlja31cbiAgICA+XG4gICAgICA8Qm94XG4gICAgICAgIHNwYWNlPXtzcGFjZX1cbiAgICAgICAgdlNwYWNlPXt2U3BhY2V9XG4gICAgICAgIHJTcGFjZT17clNwYWNlfVxuICAgICAgICBsU3BhY2U9e2xTcGFjZX1cbiAgICAgICAgdFNwYWNlPXt0U3BhY2V9XG4gICAgICAgIGJTcGFjZT17YlNwYWNlfVxuICAgICAgPlxuICAgICAgICA8SW5saW5lIGFsaWduSXRlbXM9XCJzcGFjZUJldHdlZW5cIiBub1dyYXA+XG4gICAgICAgICAgPGRpdj57Y2hpbGRyZW59PC9kaXY+XG4gICAgICAgICAgPEljb25cbiAgICAgICAgICAgIG5hbWU9e2lzRXhwYW5kZWQgPyBcImNoZXZyb24tdXBcIiA6IFwiY2hldnJvbi1kb3duXCJ9XG4gICAgICAgICAgICBjb2xvcj1cInRlcnRpYXJ5XCJcbiAgICAgICAgICAvPlxuICAgICAgICA8L0lubGluZT5cbiAgICAgIDwvQm94PlxuICAgIDwvU3R5bGVkQnV0dG9uPlxuICApO1xufVxuXG5leHBvcnQgZnVuY3Rpb24gQ29sbGFwc2libGUoe1xuICBpc0V4cGFuZGVkLFxuICBjaGlsZHJlbixcbn06IENvbGxhcHNpYmxlUHJvcHMpOiBSZWFjdC5SZWFjdEVsZW1lbnQge1xuICBjb25zdCBbY29sbGFwc2libGVIZWFkZXIsIC4uLmNvbGxhcHNpYmxlQ2hpbGRyZW5dID0gY2hpbGRyZW47XG4gIHJldHVybiAoXG4gICAgPElzRXhwYW5kZWRDb250ZXh0LlByb3ZpZGVyIHZhbHVlPXtpc0V4cGFuZGVkfT5cbiAgICAgIHtjb2xsYXBzaWJsZUhlYWRlcn1cbiAgICAgIDxFeHBhbmRhYmxlIGlzRXhwYW5kZWQ9e2lzRXhwYW5kZWR9Pntjb2xsYXBzaWJsZUNoaWxkcmVufTwvRXhwYW5kYWJsZT5cbiAgICA8L0lzRXhwYW5kZWRDb250ZXh0LlByb3ZpZGVyPlxuICApO1xufVxuIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXNCcUIifQ== */");function CollapsibleHeader({space,vSpace,rSpace,lSpace,tSpace,bSpace,onClick,children}){let isExpanded=(0,_react.useContext)(IsExpandedContext);return _react.default.createElement(StyledButton,{type:"button","data-ds-id":"CollapsibleHeader",isExpanded:isExpanded,onClick:onClick},_react.default.createElement(_Box.Box,{space:space,vSpace:vSpace,rSpace:rSpace,lSpace:lSpace,tSpace:tSpace,bSpace:bSpace},_react.default.createElement(_Inline.Inline,{alignItems:"spaceBetween",noWrap:!0},_react.default.createElement("div",null,children),_react.default.createElement(_Icon.Icon,{name:isExpanded?"chevron-up":"chevron-down",color:"tertiary"}))))}function Collapsible({isExpanded,children}){let[collapsibleHeader,...collapsibleChildren]=children;return _react.default.createElement(IsExpandedContext.Provider,{value:isExpanded},collapsibleHeader,_react.default.createElement(_Expandable.Expandable,{isExpanded:isExpanded},collapsibleChildren))}
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),function(target,all){for(var name in all)Object.defineProperty(target,name,{enumerable:!0,get:all[name]})}(exports,{Collapsible:function(){return Collapsible},CollapsibleHeader:function(){return CollapsibleHeader}});const _interop_require_default=require("@swc/helpers/_/_interop_require_default"),_react=require("@swc/helpers/_/_interop_require_wildcard")._(require("react")),_styled=_interop_require_default._(require("@emotion/styled")),_Box=require("../Box/Box"),_Icon=require("../Icon/Icon"),_Inline=require("../Inline/Inline"),_Expandable=require("../Utilities/Expandable/Expandable"),IsExpandedContext=(0,_react.createContext)(!1),StyledButton=(0,_styled.default)("button",{target:"e1q2mhan0",label:"StyledButton"})(({theme,isExpanded})=>({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}}}),"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3JjL2NvbXBvbmVudHMvQ29sbGFwc2libGUvQ29sbGFwc2libGUudHN4Iiwic291cmNlcyI6WyJzcmMvY29tcG9uZW50cy9Db2xsYXBzaWJsZS9Db2xsYXBzaWJsZS50c3giXSwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0LCB7IGNyZWF0ZUNvbnRleHQsIHVzZUNvbnRleHQgfSBmcm9tIFwicmVhY3RcIjtcbmltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHR5cGUgeyBQcm9wZXJ0eSB9IGZyb20gXCJjc3N0eXBlXCI7XG5pbXBvcnQgeyBCb3ggfSBmcm9tIFwiLi4vQm94L0JveFwiO1xuaW1wb3J0IHsgSWNvbiB9IGZyb20gXCIuLi9JY29uL0ljb25cIjtcbmltcG9ydCB7IElubGluZSB9IGZyb20gXCIuLi9JbmxpbmUvSW5saW5lXCI7XG5pbXBvcnQgeyBFeHBhbmRhYmxlIH0gZnJvbSBcIi4uL1V0aWxpdGllcy9FeHBhbmRhYmxlL0V4cGFuZGFibGVcIjtcblxuZXhwb3J0IHR5cGUgQ29sbGFwc2libGVQcm9wcyA9IHtcbiAgLyoqIHRoZSBmaXJzdCBlbGVtZW50IG9mIHRoZSBhcnJheSBvZiBjaGlsZHJlbiBoYXMgdG8gYmUgIGA8Q29sbGFwc2libGVIZWFkZXIvPmAuIFRoZSByZXN0IG9mIHRoZSBjaGlsZHJlbiBpcyB0aGUgY29udGVudCB2aXNpYmxlIGFmdGVyIHNwcmVhZGluZyB0aGUgY29tcG9uZW50ICovXG4gIGNoaWxkcmVuOiBbXG4gICAgUmVhY3QuUmVhY3RFbGVtZW50PENvbGxhcHNpYmxlSGVhZGVyUHJvcHM+LFxuICAgIC4uLlJlYWN0LlJlYWN0RWxlbWVudFtdXG4gIF07XG4gIGlzRXhwYW5kZWQ6IGJvb2xlYW4gfCB1bmRlZmluZWQ7XG4gIG92ZXJmbG93PzogUHJvcGVydHkuT3ZlcmZsb3c7XG59O1xuXG5leHBvcnQgdHlwZSBDb2xsYXBzaWJsZUhlYWRlclByb3BzID0ge1xuICBvbkNsaWNrPzogKGU6IFJlYWN0LkZvcm1FdmVudDxIVE1MQnV0dG9uRWxlbWVudD4pID0+IHZvaWQ7XG59ICYgUmVhY3QuQ29tcG9uZW50UHJvcHM8dHlwZW9mIEJveD47XG5cbmNvbnN0IElzRXhwYW5kZWRDb250ZXh0ID0gY3JlYXRlQ29udGV4dChmYWxzZSk7XG5cbmNvbnN0IFN0eWxlZEJ1dHRvbiA9IHN0eWxlZC5idXR0b248eyBpc0V4cGFuZGVkOiBib29sZWFuIH0+KFxuICAoeyB0aGVtZSwgaXNFeHBhbmRlZCB9KSA9PiAoe1xuICAgIGRpc3BsYXk6IFwiYmxvY2tcIixcbiAgICB3aWR0aDogXCIxMDAlXCIsXG4gICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS52YWx1ZXMuY29sb3IuYmFja2dyb3VuZC5wcmltYXJ5LmRlZmF1bHQsXG4gICAgYm9yZGVyOiBcIm5vbmVcIixcbiAgICBjdXJzb3I6IFwicG9pbnRlclwiLFxuICAgIHBhZGRpbmc6IDAsXG4gICAgLi4uKGlzRXhwYW5kZWQgJiYge1xuICAgICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS52YWx1ZXMuY29sb3IuYmFja2dyb3VuZC5zZWNvbmRhcnkuaG92ZXIsXG4gICAgICBcIjpnbG9iYWwoLmlzRGFya21vZGVBY3RpdmUpICZcIjoge1xuICAgICAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLnZhbHVlcy5jb2xvci5iYWNrZ3JvdW5kLnByaW1hcnkuZGVmYXVsdCxcbiAgICAgIH0sXG4gICAgfSksXG5cbiAgICBcIiY6aG92ZXJcIjoge1xuICAgICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS52YWx1ZXMuY29sb3IuYmFja2dyb3VuZC5zZWNvbmRhcnkuaG92ZXIsXG4gICAgICBcIjpnbG9iYWwoLmlzRGFya21vZGVBY3RpdmUpICZcIjoge1xuICAgICAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLnZhbHVlcy5jb2xvci5iYWNrZ3JvdW5kLnByaW1hcnkuZGVmYXVsdCxcbiAgICAgIH0sXG4gICAgfSxcbiAgfSlcbik7XG5cbmV4cG9ydCBmdW5jdGlvbiBDb2xsYXBzaWJsZUhlYWRlcih7XG4gIHNwYWNlLFxuICB2U3BhY2UsXG4gIHJTcGFjZSxcbiAgbFNwYWNlLFxuICB0U3BhY2UsXG4gIGJTcGFjZSxcbiAgb25DbGljayxcbiAgY2hpbGRyZW4sXG59OiBDb2xsYXBzaWJsZUhlYWRlclByb3BzKTogUmVhY3QuUmVhY3RFbGVtZW50IHtcbiAgY29uc3QgaXNFeHBhbmRlZCA9IHVzZUNvbnRleHQoSXNFeHBhbmRlZENvbnRleHQpO1xuICByZXR1cm4gKFxuICAgIDxTdHlsZWRCdXR0b25cbiAgICAgIHR5cGU9XCJidXR0b25cIlxuICAgICAgZGF0YS1kcy1pZD1cIkNvbGxhcHNpYmxlSGVhZGVyXCJcbiAgICAgIGlzRXhwYW5kZWQ9e2lzRXhwYW5kZWR9XG4gICAgICBvbkNsaWNrPXtvbkNsaWNrfVxuICAgID5cbiAgICAgIDxCb3hcbiAgICAgICAgc3BhY2U9e3NwYWNlfVxuICAgICAgICB2U3BhY2U9e3ZTcGFjZX1cbiAgICAgICAgclNwYWNlPXtyU3BhY2V9XG4gICAgICAgIGxTcGFjZT17bFNwYWNlfVxuICAgICAgICB0U3BhY2U9e3RTcGFjZX1cbiAgICAgICAgYlNwYWNlPXtiU3BhY2V9XG4gICAgICA+XG4gICAgICAgIDxJbmxpbmUgYWxpZ25JdGVtcz1cInNwYWNlQmV0d2VlblwiIG5vV3JhcD5cbiAgICAgICAgICA8ZGl2PntjaGlsZHJlbn08L2Rpdj5cbiAgICAgICAgICA8SWNvblxuICAgICAgICAgICAgbmFtZT17aXNFeHBhbmRlZCA/IFwiY2hldnJvbi11cFwiIDogXCJjaGV2cm9uLWRvd25cIn1cbiAgICAgICAgICAgIGNvbG9yPVwidGVydGlhcnlcIlxuICAgICAgICAgIC8+XG4gICAgICAgIDwvSW5saW5lPlxuICAgICAgPC9Cb3g+XG4gICAgPC9TdHlsZWRCdXR0b24+XG4gICk7XG59XG5cbmV4cG9ydCBmdW5jdGlvbiBDb2xsYXBzaWJsZSh7XG4gIGlzRXhwYW5kZWQsXG4gIG92ZXJmbG93LFxuICBjaGlsZHJlbixcbn06IENvbGxhcHNpYmxlUHJvcHMpOiBSZWFjdC5SZWFjdEVsZW1lbnQge1xuICBjb25zdCBbY29sbGFwc2libGVIZWFkZXIsIC4uLmNvbGxhcHNpYmxlQ2hpbGRyZW5dID0gY2hpbGRyZW47XG4gIHJldHVybiAoXG4gICAgPElzRXhwYW5kZWRDb250ZXh0LlByb3ZpZGVyIHZhbHVlPXtpc0V4cGFuZGVkfT5cbiAgICAgIHtjb2xsYXBzaWJsZUhlYWRlcn1cbiAgICAgIDxFeHBhbmRhYmxlIGlzRXhwYW5kZWQ9e2lzRXhwYW5kZWR9IG92ZXJmbG93PXtvdmVyZmxvd30+XG4gICAgICAgIHtjb2xsYXBzaWJsZUNoaWxkcmVufVxuICAgICAgPC9FeHBhbmRhYmxlPlxuICAgIDwvSXNFeHBhbmRlZENvbnRleHQuUHJvdmlkZXI+XG4gICk7XG59XG4iXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBd0JxQiJ9 */");function CollapsibleHeader({space,vSpace,rSpace,lSpace,tSpace,bSpace,onClick,children}){let isExpanded=(0,_react.useContext)(IsExpandedContext);return _react.default.createElement(StyledButton,{type:"button","data-ds-id":"CollapsibleHeader",isExpanded:isExpanded,onClick:onClick},_react.default.createElement(_Box.Box,{space:space,vSpace:vSpace,rSpace:rSpace,lSpace:lSpace,tSpace:tSpace,bSpace:bSpace},_react.default.createElement(_Inline.Inline,{alignItems:"spaceBetween",noWrap:!0},_react.default.createElement("div",null,children),_react.default.createElement(_Icon.Icon,{name:isExpanded?"chevron-up":"chevron-down",color:"tertiary"}))))}function Collapsible({isExpanded,overflow,children}){let[collapsibleHeader,...collapsibleChildren]=children;return _react.default.createElement(IsExpandedContext.Provider,{value:isExpanded},collapsibleHeader,_react.default.createElement(_Expandable.Expandable,{isExpanded:isExpanded,overflow:overflow},collapsibleChildren))}
@@ -1,4 +1,5 @@
1
1
  import React from "react";
2
+ import type { Property } from "csstype";
2
3
  import { Box } from "../Box/Box";
3
4
  export type CollapsibleProps = {
4
5
  /** 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 */
@@ -7,9 +8,10 @@ export type CollapsibleProps = {
7
8
  ...React.ReactElement[]
8
9
  ];
9
10
  isExpanded: boolean | undefined;
11
+ overflow?: Property.Overflow;
10
12
  };
11
13
  export type CollapsibleHeaderProps = {
12
14
  onClick?: (e: React.FormEvent<HTMLButtonElement>) => void;
13
15
  } & React.ComponentProps<typeof Box>;
14
16
  export declare function CollapsibleHeader({ space, vSpace, rSpace, lSpace, tSpace, bSpace, onClick, children, }: CollapsibleHeaderProps): React.ReactElement;
15
- export declare function Collapsible({ isExpanded, children, }: CollapsibleProps): React.ReactElement;
17
+ export declare function Collapsible({ isExpanded, overflow, children, }: CollapsibleProps): React.ReactElement;
@@ -1 +1 @@
1
- import React,{createContext,useContext}from"react";import styled from"@emotion/styled";import{Box}from"../Box/Box";import{Icon}from"../Icon/Icon";import{Inline}from"../Inline/Inline";import{Expandable}from"../Utilities/Expandable/Expandable";let IsExpandedContext=createContext(!1),StyledButton=styled("button",{target:"eivwvsl0",label:"StyledButton"})(({theme,isExpanded})=>({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}}}),"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3JjL2NvbXBvbmVudHMvQ29sbGFwc2libGUvQ29sbGFwc2libGUudHN4Iiwic291cmNlcyI6WyJzcmMvY29tcG9uZW50cy9Db2xsYXBzaWJsZS9Db2xsYXBzaWJsZS50c3giXSwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0LCB7IGNyZWF0ZUNvbnRleHQsIHVzZUNvbnRleHQgfSBmcm9tIFwicmVhY3RcIjtcbmltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsgQm94IH0gZnJvbSBcIi4uL0JveC9Cb3hcIjtcbmltcG9ydCB7IEljb24gfSBmcm9tIFwiLi4vSWNvbi9JY29uXCI7XG5pbXBvcnQgeyBJbmxpbmUgfSBmcm9tIFwiLi4vSW5saW5lL0lubGluZVwiO1xuaW1wb3J0IHsgRXhwYW5kYWJsZSB9IGZyb20gXCIuLi9VdGlsaXRpZXMvRXhwYW5kYWJsZS9FeHBhbmRhYmxlXCI7XG5cbmV4cG9ydCB0eXBlIENvbGxhcHNpYmxlUHJvcHMgPSB7XG4gIC8qKiB0aGUgZmlyc3QgZWxlbWVudCBvZiB0aGUgYXJyYXkgb2YgY2hpbGRyZW4gaGFzIHRvIGJlICBgPENvbGxhcHNpYmxlSGVhZGVyLz5gLiBUaGUgcmVzdCBvZiB0aGUgY2hpbGRyZW4gaXMgdGhlIGNvbnRlbnQgdmlzaWJsZSBhZnRlciBzcHJlYWRpbmcgdGhlIGNvbXBvbmVudCAqL1xuICBjaGlsZHJlbjogW1xuICAgIFJlYWN0LlJlYWN0RWxlbWVudDxDb2xsYXBzaWJsZUhlYWRlclByb3BzPixcbiAgICAuLi5SZWFjdC5SZWFjdEVsZW1lbnRbXVxuICBdO1xuICBpc0V4cGFuZGVkOiBib29sZWFuIHwgdW5kZWZpbmVkO1xufTtcblxuZXhwb3J0IHR5cGUgQ29sbGFwc2libGVIZWFkZXJQcm9wcyA9IHtcbiAgb25DbGljaz86IChlOiBSZWFjdC5Gb3JtRXZlbnQ8SFRNTEJ1dHRvbkVsZW1lbnQ+KSA9PiB2b2lkO1xufSAmIFJlYWN0LkNvbXBvbmVudFByb3BzPHR5cGVvZiBCb3g+O1xuXG5jb25zdCBJc0V4cGFuZGVkQ29udGV4dCA9IGNyZWF0ZUNvbnRleHQoZmFsc2UpO1xuXG5jb25zdCBTdHlsZWRCdXR0b24gPSBzdHlsZWQuYnV0dG9uPHsgaXNFeHBhbmRlZDogYm9vbGVhbiB9PihcbiAgKHsgdGhlbWUsIGlzRXhwYW5kZWQgfSkgPT4gKHtcbiAgICBkaXNwbGF5OiBcImJsb2NrXCIsXG4gICAgd2lkdGg6IFwiMTAwJVwiLFxuICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUudmFsdWVzLmNvbG9yLmJhY2tncm91bmQucHJpbWFyeS5kZWZhdWx0LFxuICAgIGJvcmRlcjogXCJub25lXCIsXG4gICAgY3Vyc29yOiBcInBvaW50ZXJcIixcbiAgICBwYWRkaW5nOiAwLFxuICAgIC4uLihpc0V4cGFuZGVkICYmIHtcbiAgICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUudmFsdWVzLmNvbG9yLmJhY2tncm91bmQuc2Vjb25kYXJ5LmhvdmVyLFxuICAgICAgXCI6Z2xvYmFsKC5pc0Rhcmttb2RlQWN0aXZlKSAmXCI6IHtcbiAgICAgICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS52YWx1ZXMuY29sb3IuYmFja2dyb3VuZC5wcmltYXJ5LmRlZmF1bHQsXG4gICAgICB9LFxuICAgIH0pLFxuXG4gICAgXCImOmhvdmVyXCI6IHtcbiAgICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUudmFsdWVzLmNvbG9yLmJhY2tncm91bmQuc2Vjb25kYXJ5LmhvdmVyLFxuICAgICAgXCI6Z2xvYmFsKC5pc0Rhcmttb2RlQWN0aXZlKSAmXCI6IHtcbiAgICAgICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS52YWx1ZXMuY29sb3IuYmFja2dyb3VuZC5wcmltYXJ5LmRlZmF1bHQsXG4gICAgICB9LFxuICAgIH0sXG4gIH0pXG4pO1xuXG5leHBvcnQgZnVuY3Rpb24gQ29sbGFwc2libGVIZWFkZXIoe1xuICBzcGFjZSxcbiAgdlNwYWNlLFxuICByU3BhY2UsXG4gIGxTcGFjZSxcbiAgdFNwYWNlLFxuICBiU3BhY2UsXG4gIG9uQ2xpY2ssXG4gIGNoaWxkcmVuLFxufTogQ29sbGFwc2libGVIZWFkZXJQcm9wcyk6IFJlYWN0LlJlYWN0RWxlbWVudCB7XG4gIGNvbnN0IGlzRXhwYW5kZWQgPSB1c2VDb250ZXh0KElzRXhwYW5kZWRDb250ZXh0KTtcbiAgcmV0dXJuIChcbiAgICA8U3R5bGVkQnV0dG9uXG4gICAgICB0eXBlPVwiYnV0dG9uXCJcbiAgICAgIGRhdGEtZHMtaWQ9XCJDb2xsYXBzaWJsZUhlYWRlclwiXG4gICAgICBpc0V4cGFuZGVkPXtpc0V4cGFuZGVkfVxuICAgICAgb25DbGljaz17b25DbGlja31cbiAgICA+XG4gICAgICA8Qm94XG4gICAgICAgIHNwYWNlPXtzcGFjZX1cbiAgICAgICAgdlNwYWNlPXt2U3BhY2V9XG4gICAgICAgIHJTcGFjZT17clNwYWNlfVxuICAgICAgICBsU3BhY2U9e2xTcGFjZX1cbiAgICAgICAgdFNwYWNlPXt0U3BhY2V9XG4gICAgICAgIGJTcGFjZT17YlNwYWNlfVxuICAgICAgPlxuICAgICAgICA8SW5saW5lIGFsaWduSXRlbXM9XCJzcGFjZUJldHdlZW5cIiBub1dyYXA+XG4gICAgICAgICAgPGRpdj57Y2hpbGRyZW59PC9kaXY+XG4gICAgICAgICAgPEljb25cbiAgICAgICAgICAgIG5hbWU9e2lzRXhwYW5kZWQgPyBcImNoZXZyb24tdXBcIiA6IFwiY2hldnJvbi1kb3duXCJ9XG4gICAgICAgICAgICBjb2xvcj1cInRlcnRpYXJ5XCJcbiAgICAgICAgICAvPlxuICAgICAgICA8L0lubGluZT5cbiAgICAgIDwvQm94PlxuICAgIDwvU3R5bGVkQnV0dG9uPlxuICApO1xufVxuXG5leHBvcnQgZnVuY3Rpb24gQ29sbGFwc2libGUoe1xuICBpc0V4cGFuZGVkLFxuICBjaGlsZHJlbixcbn06IENvbGxhcHNpYmxlUHJvcHMpOiBSZWFjdC5SZWFjdEVsZW1lbnQge1xuICBjb25zdCBbY29sbGFwc2libGVIZWFkZXIsIC4uLmNvbGxhcHNpYmxlQ2hpbGRyZW5dID0gY2hpbGRyZW47XG4gIHJldHVybiAoXG4gICAgPElzRXhwYW5kZWRDb250ZXh0LlByb3ZpZGVyIHZhbHVlPXtpc0V4cGFuZGVkfT5cbiAgICAgIHtjb2xsYXBzaWJsZUhlYWRlcn1cbiAgICAgIDxFeHBhbmRhYmxlIGlzRXhwYW5kZWQ9e2lzRXhwYW5kZWR9Pntjb2xsYXBzaWJsZUNoaWxkcmVufTwvRXhwYW5kYWJsZT5cbiAgICA8L0lzRXhwYW5kZWRDb250ZXh0LlByb3ZpZGVyPlxuICApO1xufVxuIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXNCcUIifQ== */");export function CollapsibleHeader({space,vSpace,rSpace,lSpace,tSpace,bSpace,onClick,children}){let isExpanded=useContext(IsExpandedContext);return React.createElement(StyledButton,{type:"button","data-ds-id":"CollapsibleHeader",isExpanded:isExpanded,onClick:onClick},React.createElement(Box,{space:space,vSpace:vSpace,rSpace:rSpace,lSpace:lSpace,tSpace:tSpace,bSpace:bSpace},React.createElement(Inline,{alignItems:"spaceBetween",noWrap:!0},React.createElement("div",null,children),React.createElement(Icon,{name:isExpanded?"chevron-up":"chevron-down",color:"tertiary"}))))}export function Collapsible({isExpanded,children}){let[collapsibleHeader,...collapsibleChildren]=children;return React.createElement(IsExpandedContext.Provider,{value:isExpanded},collapsibleHeader,React.createElement(Expandable,{isExpanded:isExpanded},collapsibleChildren))}
1
+ import React,{createContext,useContext}from"react";import styled from"@emotion/styled";import{Box}from"../Box/Box";import{Icon}from"../Icon/Icon";import{Inline}from"../Inline/Inline";import{Expandable}from"../Utilities/Expandable/Expandable";let IsExpandedContext=createContext(!1),StyledButton=styled("button",{target:"e1q2mhan0",label:"StyledButton"})(({theme,isExpanded})=>({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}}}),"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3JjL2NvbXBvbmVudHMvQ29sbGFwc2libGUvQ29sbGFwc2libGUudHN4Iiwic291cmNlcyI6WyJzcmMvY29tcG9uZW50cy9Db2xsYXBzaWJsZS9Db2xsYXBzaWJsZS50c3giXSwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0LCB7IGNyZWF0ZUNvbnRleHQsIHVzZUNvbnRleHQgfSBmcm9tIFwicmVhY3RcIjtcbmltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHR5cGUgeyBQcm9wZXJ0eSB9IGZyb20gXCJjc3N0eXBlXCI7XG5pbXBvcnQgeyBCb3ggfSBmcm9tIFwiLi4vQm94L0JveFwiO1xuaW1wb3J0IHsgSWNvbiB9IGZyb20gXCIuLi9JY29uL0ljb25cIjtcbmltcG9ydCB7IElubGluZSB9IGZyb20gXCIuLi9JbmxpbmUvSW5saW5lXCI7XG5pbXBvcnQgeyBFeHBhbmRhYmxlIH0gZnJvbSBcIi4uL1V0aWxpdGllcy9FeHBhbmRhYmxlL0V4cGFuZGFibGVcIjtcblxuZXhwb3J0IHR5cGUgQ29sbGFwc2libGVQcm9wcyA9IHtcbiAgLyoqIHRoZSBmaXJzdCBlbGVtZW50IG9mIHRoZSBhcnJheSBvZiBjaGlsZHJlbiBoYXMgdG8gYmUgIGA8Q29sbGFwc2libGVIZWFkZXIvPmAuIFRoZSByZXN0IG9mIHRoZSBjaGlsZHJlbiBpcyB0aGUgY29udGVudCB2aXNpYmxlIGFmdGVyIHNwcmVhZGluZyB0aGUgY29tcG9uZW50ICovXG4gIGNoaWxkcmVuOiBbXG4gICAgUmVhY3QuUmVhY3RFbGVtZW50PENvbGxhcHNpYmxlSGVhZGVyUHJvcHM+LFxuICAgIC4uLlJlYWN0LlJlYWN0RWxlbWVudFtdXG4gIF07XG4gIGlzRXhwYW5kZWQ6IGJvb2xlYW4gfCB1bmRlZmluZWQ7XG4gIG92ZXJmbG93PzogUHJvcGVydHkuT3ZlcmZsb3c7XG59O1xuXG5leHBvcnQgdHlwZSBDb2xsYXBzaWJsZUhlYWRlclByb3BzID0ge1xuICBvbkNsaWNrPzogKGU6IFJlYWN0LkZvcm1FdmVudDxIVE1MQnV0dG9uRWxlbWVudD4pID0+IHZvaWQ7XG59ICYgUmVhY3QuQ29tcG9uZW50UHJvcHM8dHlwZW9mIEJveD47XG5cbmNvbnN0IElzRXhwYW5kZWRDb250ZXh0ID0gY3JlYXRlQ29udGV4dChmYWxzZSk7XG5cbmNvbnN0IFN0eWxlZEJ1dHRvbiA9IHN0eWxlZC5idXR0b248eyBpc0V4cGFuZGVkOiBib29sZWFuIH0+KFxuICAoeyB0aGVtZSwgaXNFeHBhbmRlZCB9KSA9PiAoe1xuICAgIGRpc3BsYXk6IFwiYmxvY2tcIixcbiAgICB3aWR0aDogXCIxMDAlXCIsXG4gICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS52YWx1ZXMuY29sb3IuYmFja2dyb3VuZC5wcmltYXJ5LmRlZmF1bHQsXG4gICAgYm9yZGVyOiBcIm5vbmVcIixcbiAgICBjdXJzb3I6IFwicG9pbnRlclwiLFxuICAgIHBhZGRpbmc6IDAsXG4gICAgLi4uKGlzRXhwYW5kZWQgJiYge1xuICAgICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS52YWx1ZXMuY29sb3IuYmFja2dyb3VuZC5zZWNvbmRhcnkuaG92ZXIsXG4gICAgICBcIjpnbG9iYWwoLmlzRGFya21vZGVBY3RpdmUpICZcIjoge1xuICAgICAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLnZhbHVlcy5jb2xvci5iYWNrZ3JvdW5kLnByaW1hcnkuZGVmYXVsdCxcbiAgICAgIH0sXG4gICAgfSksXG5cbiAgICBcIiY6aG92ZXJcIjoge1xuICAgICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS52YWx1ZXMuY29sb3IuYmFja2dyb3VuZC5zZWNvbmRhcnkuaG92ZXIsXG4gICAgICBcIjpnbG9iYWwoLmlzRGFya21vZGVBY3RpdmUpICZcIjoge1xuICAgICAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLnZhbHVlcy5jb2xvci5iYWNrZ3JvdW5kLnByaW1hcnkuZGVmYXVsdCxcbiAgICAgIH0sXG4gICAgfSxcbiAgfSlcbik7XG5cbmV4cG9ydCBmdW5jdGlvbiBDb2xsYXBzaWJsZUhlYWRlcih7XG4gIHNwYWNlLFxuICB2U3BhY2UsXG4gIHJTcGFjZSxcbiAgbFNwYWNlLFxuICB0U3BhY2UsXG4gIGJTcGFjZSxcbiAgb25DbGljayxcbiAgY2hpbGRyZW4sXG59OiBDb2xsYXBzaWJsZUhlYWRlclByb3BzKTogUmVhY3QuUmVhY3RFbGVtZW50IHtcbiAgY29uc3QgaXNFeHBhbmRlZCA9IHVzZUNvbnRleHQoSXNFeHBhbmRlZENvbnRleHQpO1xuICByZXR1cm4gKFxuICAgIDxTdHlsZWRCdXR0b25cbiAgICAgIHR5cGU9XCJidXR0b25cIlxuICAgICAgZGF0YS1kcy1pZD1cIkNvbGxhcHNpYmxlSGVhZGVyXCJcbiAgICAgIGlzRXhwYW5kZWQ9e2lzRXhwYW5kZWR9XG4gICAgICBvbkNsaWNrPXtvbkNsaWNrfVxuICAgID5cbiAgICAgIDxCb3hcbiAgICAgICAgc3BhY2U9e3NwYWNlfVxuICAgICAgICB2U3BhY2U9e3ZTcGFjZX1cbiAgICAgICAgclNwYWNlPXtyU3BhY2V9XG4gICAgICAgIGxTcGFjZT17bFNwYWNlfVxuICAgICAgICB0U3BhY2U9e3RTcGFjZX1cbiAgICAgICAgYlNwYWNlPXtiU3BhY2V9XG4gICAgICA+XG4gICAgICAgIDxJbmxpbmUgYWxpZ25JdGVtcz1cInNwYWNlQmV0d2VlblwiIG5vV3JhcD5cbiAgICAgICAgICA8ZGl2PntjaGlsZHJlbn08L2Rpdj5cbiAgICAgICAgICA8SWNvblxuICAgICAgICAgICAgbmFtZT17aXNFeHBhbmRlZCA/IFwiY2hldnJvbi11cFwiIDogXCJjaGV2cm9uLWRvd25cIn1cbiAgICAgICAgICAgIGNvbG9yPVwidGVydGlhcnlcIlxuICAgICAgICAgIC8+XG4gICAgICAgIDwvSW5saW5lPlxuICAgICAgPC9Cb3g+XG4gICAgPC9TdHlsZWRCdXR0b24+XG4gICk7XG59XG5cbmV4cG9ydCBmdW5jdGlvbiBDb2xsYXBzaWJsZSh7XG4gIGlzRXhwYW5kZWQsXG4gIG92ZXJmbG93LFxuICBjaGlsZHJlbixcbn06IENvbGxhcHNpYmxlUHJvcHMpOiBSZWFjdC5SZWFjdEVsZW1lbnQge1xuICBjb25zdCBbY29sbGFwc2libGVIZWFkZXIsIC4uLmNvbGxhcHNpYmxlQ2hpbGRyZW5dID0gY2hpbGRyZW47XG4gIHJldHVybiAoXG4gICAgPElzRXhwYW5kZWRDb250ZXh0LlByb3ZpZGVyIHZhbHVlPXtpc0V4cGFuZGVkfT5cbiAgICAgIHtjb2xsYXBzaWJsZUhlYWRlcn1cbiAgICAgIDxFeHBhbmRhYmxlIGlzRXhwYW5kZWQ9e2lzRXhwYW5kZWR9IG92ZXJmbG93PXtvdmVyZmxvd30+XG4gICAgICAgIHtjb2xsYXBzaWJsZUNoaWxkcmVufVxuICAgICAgPC9FeHBhbmRhYmxlPlxuICAgIDwvSXNFeHBhbmRlZENvbnRleHQuUHJvdmlkZXI+XG4gICk7XG59XG4iXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBd0JxQiJ9 */");export function CollapsibleHeader({space,vSpace,rSpace,lSpace,tSpace,bSpace,onClick,children}){let isExpanded=useContext(IsExpandedContext);return React.createElement(StyledButton,{type:"button","data-ds-id":"CollapsibleHeader",isExpanded:isExpanded,onClick:onClick},React.createElement(Box,{space:space,vSpace:vSpace,rSpace:rSpace,lSpace:lSpace,tSpace:tSpace,bSpace:bSpace},React.createElement(Inline,{alignItems:"spaceBetween",noWrap:!0},React.createElement("div",null,children),React.createElement(Icon,{name:isExpanded?"chevron-up":"chevron-down",color:"tertiary"}))))}export function Collapsible({isExpanded,overflow,children}){let[collapsibleHeader,...collapsibleChildren]=children;return React.createElement(IsExpandedContext.Provider,{value:isExpanded},collapsibleHeader,React.createElement(Expandable,{isExpanded:isExpanded,overflow:overflow},collapsibleChildren))}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@amboss/design-system",
3
- "version": "2.0.2",
3
+ "version": "2.0.3",
4
4
  "description": "the design system for AMBOSS products",
5
5
  "author": "AMBOSS",
6
6
  "license": "ISC",