@x15ventures/x15-ui-library 3.11.4

package/dist/autoGenerated/libraryThemes.d.ts

@@ -0,0 +1,94 @@
+export declare const libraryThemes: {
+    base: {
+        buildPath: string;
+        dev: {
+            css: string;
+            map: string;
+        };
+        min: {
+            css: string;
+            map: string;
+        };
+        versioned: {
+            css: string;
+            map: string;
+        };
+    };
+    cba: {
+        buildPath: string;
+        dev: {
+            css: string;
+            map: string;
+        };
+        min: {
+            css: string;
+            map: string;
+        };
+        versioned: {
+            css: string;
+            map: string;
+        };
+    };
+    creditSavvy: {
+        buildPath: string;
+        dev: {
+            css: string;
+            map: string;
+        };
+        min: {
+            css: string;
+            map: string;
+        };
+        versioned: {
+            css: string;
+            map: string;
+        };
+    };
+    doshii: {
+        buildPath: string;
+        dev: {
+            css: string;
+            map: string;
+        };
+        min: {
+            css: string;
+            map: string;
+        };
+        versioned: {
+            css: string;
+            map: string;
+        };
+    };
+    homeIn: {
+        buildPath: string;
+        dev: {
+            css: string;
+            map: string;
+        };
+        min: {
+            css: string;
+            map: string;
+        };
+        versioned: {
+            css: string;
+            map: string;
+        };
+    };
+    x15Core: {
+        buildPath: string;
+        dev: {
+            css: string;
+            map: string;
+        };
+        min: {
+            css: string;
+            map: string;
+        };
+        versioned: {
+            css: string;
+            map: string;
+        };
+    };
+};
+export default libraryThemes;
+//# sourceMappingURL=libraryThemes.d.ts.map

package/dist/autoGenerated/libraryThemes.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"libraryThemes.d.ts","sourceRoot":"","sources":["../../src/autoGenerated/libraryThemes.ts"],"names":[],"mappings":"AACA,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2FzB,CAAC;AAAC,eAAe,aAAa,CAAC"}

package/dist/cjs/autoGenerated/libraryThemes.js

@@ -0,0 +1,101 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.libraryThemes = exports.default = void 0;
+/* eslint-disable */
+const libraryThemes = exports.libraryThemes = {
+  "base": {
+    "buildPath": "styles",
+    "dev": {
+      "css": "index.css",
+      "map": "index.css.map"
+    },
+    "min": {
+      "css": "index.min.css",
+      "map": "index.min.css.map"
+    },
+    "versioned": {
+      "css": "index.min.3.11.4.css",
+      "map": "index.min.3.11.4.css.map"
+    }
+  },
+  "cba": {
+    "buildPath": "styles/themes/cba",
+    "dev": {
+      "css": "cba.css",
+      "map": "cba.css.map"
+    },
+    "min": {
+      "css": "cba.min.css",
+      "map": "cba.min.css.map"
+    },
+    "versioned": {
+      "css": "cba.min.3.11.4.css",
+      "map": "cba.min.3.11.4.css.map"
+    }
+  },
+  "creditSavvy": {
+    "buildPath": "styles/themes/creditSavvy",
+    "dev": {
+      "css": "creditSavvy.css",
+      "map": "creditSavvy.css.map"
+    },
+    "min": {
+      "css": "creditSavvy.min.css",
+      "map": "creditSavvy.min.css.map"
+    },
+    "versioned": {
+      "css": "creditSavvy.min.3.11.4.css",
+      "map": "creditSavvy.min.3.11.4.css.map"
+    }
+  },
+  "doshii": {
+    "buildPath": "styles/themes/doshii",
+    "dev": {
+      "css": "doshii.css",
+      "map": "doshii.css.map"
+    },
+    "min": {
+      "css": "doshii.min.css",
+      "map": "doshii.min.css.map"
+    },
+    "versioned": {
+      "css": "doshii.min.3.11.4.css",
+      "map": "doshii.min.3.11.4.css.map"
+    }
+  },
+  "homeIn": {
+    "buildPath": "styles/themes/homeIn",
+    "dev": {
+      "css": "homeIn.css",
+      "map": "homeIn.css.map"
+    },
+    "min": {
+      "css": "homeIn.min.css",
+      "map": "homeIn.min.css.map"
+    },
+    "versioned": {
+      "css": "homeIn.min.3.11.4.css",
+      "map": "homeIn.min.3.11.4.css.map"
+    }
+  },
+  "x15Core": {
+    "buildPath": "styles/themes/x15Core",
+    "dev": {
+      "css": "x15Core.css",
+      "map": "x15Core.css.map"
+    },
+    "min": {
+      "css": "x15Core.min.css",
+      "map": "x15Core.min.css.map"
+    },
+    "versioned": {
+      "css": "x15Core.min.3.11.4.css",
+      "map": "x15Core.min.3.11.4.css.map"
+    }
+  }
+};
+var _default = exports.default = libraryThemes;
+//# sourceMappingURL=libraryThemes.js.map

package/dist/cjs/autoGenerated/libraryThemes.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"libraryThemes.js","names":["libraryThemes","exports","_default","default"],"sources":["../../../src/autoGenerated/libraryThemes.ts"],"sourcesContent":["/* eslint-disable */\nexport const libraryThemes = {\n  \"base\": {\n    \"buildPath\": \"styles\",\n    \"dev\": {\n      \"css\": \"index.css\",\n      \"map\": \"index.css.map\"\n    },\n    \"min\": {\n      \"css\": \"index.min.css\",\n      \"map\": \"index.min.css.map\"\n    },\n    \"versioned\": {\n      \"css\": \"index.min.3.11.4.css\",\n      \"map\": \"index.min.3.11.4.css.map\"\n    }\n  },\n  \"cba\": {\n    \"buildPath\": \"styles/themes/cba\",\n    \"dev\": {\n      \"css\": \"cba.css\",\n      \"map\": \"cba.css.map\"\n    },\n    \"min\": {\n      \"css\": \"cba.min.css\",\n      \"map\": \"cba.min.css.map\"\n    },\n    \"versioned\": {\n      \"css\": \"cba.min.3.11.4.css\",\n      \"map\": \"cba.min.3.11.4.css.map\"\n    }\n  },\n  \"creditSavvy\": {\n    \"buildPath\": \"styles/themes/creditSavvy\",\n    \"dev\": {\n      \"css\": \"creditSavvy.css\",\n      \"map\": \"creditSavvy.css.map\"\n    },\n    \"min\": {\n      \"css\": \"creditSavvy.min.css\",\n      \"map\": \"creditSavvy.min.css.map\"\n    },\n    \"versioned\": {\n      \"css\": \"creditSavvy.min.3.11.4.css\",\n      \"map\": \"creditSavvy.min.3.11.4.css.map\"\n    }\n  },\n  \"doshii\": {\n    \"buildPath\": \"styles/themes/doshii\",\n    \"dev\": {\n      \"css\": \"doshii.css\",\n      \"map\": \"doshii.css.map\"\n    },\n    \"min\": {\n      \"css\": \"doshii.min.css\",\n      \"map\": \"doshii.min.css.map\"\n    },\n    \"versioned\": {\n      \"css\": \"doshii.min.3.11.4.css\",\n      \"map\": \"doshii.min.3.11.4.css.map\"\n    }\n  },\n  \"homeIn\": {\n    \"buildPath\": \"styles/themes/homeIn\",\n    \"dev\": {\n      \"css\": \"homeIn.css\",\n      \"map\": \"homeIn.css.map\"\n    },\n    \"min\": {\n      \"css\": \"homeIn.min.css\",\n      \"map\": \"homeIn.min.css.map\"\n    },\n    \"versioned\": {\n      \"css\": \"homeIn.min.3.11.4.css\",\n      \"map\": \"homeIn.min.3.11.4.css.map\"\n    }\n  },\n  \"x15Core\": {\n    \"buildPath\": \"styles/themes/x15Core\",\n    \"dev\": {\n      \"css\": \"x15Core.css\",\n      \"map\": \"x15Core.css.map\"\n    },\n    \"min\": {\n      \"css\": \"x15Core.min.css\",\n      \"map\": \"x15Core.min.css.map\"\n    },\n    \"versioned\": {\n      \"css\": \"x15Core.min.3.11.4.css\",\n      \"map\": \"x15Core.min.3.11.4.css.map\"\n    }\n  }\n}; export default libraryThemes;"],"mappings":";;;;;;AAAA;AACO,MAAMA,aAAa,GAAAC,OAAA,CAAAD,aAAA,GAAG;EAC3B,MAAM,EAAE;IACN,WAAW,EAAE,QAAQ;IACrB,KAAK,EAAE;MACL,KAAK,EAAE,WAAW;MAClB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,eAAe;MACtB,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,sBAAsB;MAC7B,KAAK,EAAE;IACT;EACF,CAAC;EACD,KAAK,EAAE;IACL,WAAW,EAAE,mBAAmB;IAChC,KAAK,EAAE;MACL,KAAK,EAAE,SAAS;MAChB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,aAAa;MACpB,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,oBAAoB;MAC3B,KAAK,EAAE;IACT;EACF,CAAC;EACD,aAAa,EAAE;IACb,WAAW,EAAE,2BAA2B;IACxC,KAAK,EAAE;MACL,KAAK,EAAE,iBAAiB;MACxB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,qBAAqB;MAC5B,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,4BAA4B;MACnC,KAAK,EAAE;IACT;EACF,CAAC;EACD,QAAQ,EAAE;IACR,WAAW,EAAE,sBAAsB;IACnC,KAAK,EAAE;MACL,KAAK,EAAE,YAAY;MACnB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,gBAAgB;MACvB,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,uBAAuB;MAC9B,KAAK,EAAE;IACT;EACF,CAAC;EACD,QAAQ,EAAE;IACR,WAAW,EAAE,sBAAsB;IACnC,KAAK,EAAE;MACL,KAAK,EAAE,YAAY;MACnB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,gBAAgB;MACvB,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,uBAAuB;MAC9B,KAAK,EAAE;IACT;EACF,CAAC;EACD,SAAS,EAAE;IACT,WAAW,EAAE,uBAAuB;IACpC,KAAK,EAAE;MACL,KAAK,EAAE,aAAa;MACpB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,iBAAiB;MACxB,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,wBAAwB;MAC/B,KAAK,EAAE;IACT;EACF;AACF,CAAC;AAAC,IAAAE,QAAA,GAAAD,OAAA,CAAAE,OAAA,GAAgBH,aAAa","ignoreList":[]}

package/dist/cjs/autoGenerated/libraryThemes.json

@@ -0,0 +1,92 @@
+{
+  "base": {
+    "buildPath": "styles",
+    "dev": {
+      "css": "index.css",
+      "map": "index.css.map"
+    },
+    "min": {
+      "css": "index.min.css",
+      "map": "index.min.css.map"
+    },
+    "versioned": {
+      "css": "base.min.3.11.4.css",
+      "map": "base.min.3.11.4.css.map"
+    }
+  },
+  "cba": {
+    "buildPath": "styles/themes/cba",
+    "dev": {
+      "css": "cba.css",
+      "map": "cba.css.map"
+    },
+    "min": {
+      "css": "cba.min.css",
+      "map": "cba.min.css.map"
+    },
+    "versioned": {
+      "css": "cba.min.3.11.4.css",
+      "map": "cba.min.3.11.4.css.map"
+    }
+  },
+  "creditSavvy": {
+    "buildPath": "styles/themes/creditSavvy",
+    "dev": {
+      "css": "creditSavvy.css",
+      "map": "creditSavvy.css.map"
+    },
+    "min": {
+      "css": "creditSavvy.min.css",
+      "map": "creditSavvy.min.css.map"
+    },
+    "versioned": {
+      "css": "creditSavvy.min.3.11.4.css",
+      "map": "creditSavvy.min.3.11.4.css.map"
+    }
+  },
+  "doshii": {
+    "buildPath": "styles/themes/doshii",
+    "dev": {
+      "css": "doshii.css",
+      "map": "doshii.css.map"
+    },
+    "min": {
+      "css": "doshii.min.css",
+      "map": "doshii.min.css.map"
+    },
+    "versioned": {
+      "css": "doshii.min.3.11.4.css",
+      "map": "doshii.min.3.11.4.css.map"
+    }
+  },
+  "homeIn": {
+    "buildPath": "styles/themes/homeIn",
+    "dev": {
+      "css": "homeIn.css",
+      "map": "homeIn.css.map"
+    },
+    "min": {
+      "css": "homeIn.min.css",
+      "map": "homeIn.min.css.map"
+    },
+    "versioned": {
+      "css": "homeIn.min.3.11.4.css",
+      "map": "homeIn.min.3.11.4.css.map"
+    }
+  },
+  "x15Core": {
+    "buildPath": "styles/themes/x15Core",
+    "dev": {
+      "css": "x15Core.css",
+      "map": "x15Core.css.map"
+    },
+    "min": {
+      "css": "x15Core.min.css",
+      "map": "x15Core.min.css.map"
+    },
+    "versioned": {
+      "css": "x15Core.min.3.11.4.css",
+      "map": "x15Core.min.3.11.4.css.map"
+    }
+  }
+}

package/dist/cjs/components/design/accordion/Accordion.js

@@ -0,0 +1,131 @@
+"use strict";
+'use client';
+
+/* eslint-disable jsxA11y/no-noninteractive-tabindex, no-unused-vars */
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.Accordion = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _SvgIcon = require("@x15ventures/x15-ui-library-icons/svgIcon/SvgIcon");
+var _iconDefinitions = require("@x15ventures/x15-ui-library-icons/iconDefinitions");
+var _Icon = require("../icons/basicIcon/Icon");
+require("./accordion.css");
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+const Accordion = ({
+  id,
+  heading,
+  children,
+  footer,
+  openIcon = null,
+  closeIcon = null,
+  isOpen = true,
+  isAnimated = true,
+  isFixed = false,
+  innerBorders = true,
+  outerBorders = true,
+  hasShadow = false,
+  onChange,
+  customCssClass,
+  restrictHeight,
+  headerButtonCustomLabel,
+  headerButtonCssClass,
+  paddingStyle = 'regular',
+  horizontalAlignments
+}) => {
+  const [panelIsOpen, setPanelIsOpen] = (0, _react.useState)(isOpen || isFixed);
+  const accordionControl = (0, _react.useRef)(null);
+  const panelId = id || `accordion_${Date.now()}`;
+  const contentId = `${panelId}_content`;
+  const controlId = `${panelId}_control`;
+  const customSectionHeader = typeof heading !== 'string' && !headerButtonCustomLabel;
+  const TogglePanelOpenState = () => {
+    const newState = !panelIsOpen;
+    setPanelIsOpen(newState);
+    if (onChange) {
+      onChange(newState);
+    }
+  };
+  const heightCssClass = restrictHeight ? `accordion_${restrictHeight}` : '';
+
+  // map horizontal alignment props to justify-content values for fixed accordions
+  const justifyContentMap = {
+    left: 'flex-start',
+    center: 'center',
+    right: 'flex-end'
+  };
+  const alignmentStyle = {
+    ...(isFixed && horizontalAlignments?.header ? {
+      '--header-align-h': justifyContentMap[horizontalAlignments.header]
+    } : {
+      '--header-align-h': horizontalAlignments?.header || 'left'
+    }),
+    '--content-align-h': horizontalAlignments?.content || 'left',
+    '--footer-align-h': horizontalAlignments?.footer || 'left'
+  };
+  const wrapperCssClass = `
+    accordion 
+    ${customCssClass || ''} 
+    ${heightCssClass} 
+    ${panelIsOpen || isFixed ? 'open' : 'closed'} 
+    ${isFixed ? 'fixed' : ''}
+    ${isAnimated ? 'animated' : ''}
+    ${outerBorders ? 'outerBorders' : ''}
+    ${paddingStyle ? `padding_${paddingStyle}` : ''}
+    ${hasShadow ? 'hasShadow' : ''}
+  `;
+  const headerCssClass = `accordionHeader ${customSectionHeader || isFixed ? 'accordionHeader_custom' : ''} ${innerBorders ? 'accordionHeader_innerBorders' : ''}`;
+  const controlCssClass = `accordionControl ${customCssClass ? `${customCssClass}_accordionControl` : ''} ${headerButtonCssClass || ''}`;
+  const contentCssClass = `accordionContent ${customCssClass ? `${customCssClass}_accordionContent` : ''}`;
+  const OpenIcon = () => {
+    if (openIcon) {
+      return /*#__PURE__*/_react.default.createElement(_Icon.Icon, {
+        icon: openIcon
+      });
+    }
+    return /*#__PURE__*/_react.default.createElement(_SvgIcon.SvgIcon, {
+      svgDefinition: _iconDefinitions.chevronUp
+    });
+  };
+  const CloseIcon = () => {
+    if (closeIcon) {
+      return /*#__PURE__*/_react.default.createElement(_Icon.Icon, {
+        icon: closeIcon
+      });
+    }
+    return /*#__PURE__*/_react.default.createElement(_SvgIcon.SvgIcon, {
+      svgDefinition: _iconDefinitions.chevronDown
+    });
+  };
+  return /*#__PURE__*/_react.default.createElement("section", {
+    className: wrapperCssClass,
+    style: alignmentStyle
+  }, /*#__PURE__*/_react.default.createElement("header", {
+    className: headerCssClass
+  }, customSectionHeader ? /*#__PURE__*/_react.default.createElement("div", {
+    tabIndex: 0,
+    className: "accordionCustomHeading"
+  }, heading) : /*#__PURE__*/_react.default.createElement("h3", null, isFixed ? heading : /*#__PURE__*/_react.default.createElement("button", {
+    ref: accordionControl,
+    "aria-controls": contentId,
+    "aria-expanded": panelIsOpen,
+    id: controlId,
+    onClick: TogglePanelOpenState,
+    type: "button",
+    className: controlCssClass
+  }, /*#__PURE__*/_react.default.createElement("span", {
+    className: "sr-only"
+  }, "Open and close accordion"), headerButtonCustomLabel || /*#__PURE__*/_react.default.createElement("span", {
+    className: "labelText"
+  }, heading), panelIsOpen ? /*#__PURE__*/_react.default.createElement(OpenIcon, null) : /*#__PURE__*/_react.default.createElement(CloseIcon, null)))), /*#__PURE__*/_react.default.createElement("section", {
+    tabIndex: 0,
+    className: contentCssClass,
+    id: contentId,
+    "aria-labelledby": controlId
+  }, /*#__PURE__*/_react.default.createElement("span", {
+    className: "sr-only"
+  }, "Start of accordion content"), children, footer && /*#__PURE__*/_react.default.createElement("footer", null, footer)));
+};
+exports.Accordion = Accordion;
+var _default = exports.default = Accordion;
+//# sourceMappingURL=Accordion.js.map

package/dist/cjs/components/design/accordion/Accordion.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Accordion.js","names":["Object","defineProperty","exports","value","default","Accordion","_react","_interopRequireWildcard","require","_SvgIcon","_iconDefinitions","_Icon","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","has","get","set","hasOwnProperty","call","getOwnPropertyDescriptor","id","heading","children","footer","openIcon","closeIcon","isOpen","isAnimated","isFixed","innerBorders","outerBorders","hasShadow","onChange","customCssClass","restrictHeight","headerButtonCustomLabel","headerButtonCssClass","paddingStyle","horizontalAlignments","panelIsOpen","setPanelIsOpen","useState","accordionControl","useRef","panelId","Date","now","contentId","controlId","customSectionHeader","TogglePanelOpenState","newState","heightCssClass","justifyContentMap","left","center","right","alignmentStyle","header","content","wrapperCssClass","headerCssClass","controlCssClass","contentCssClass","OpenIcon","createElement","Icon","icon","SvgIcon","svgDefinition","chevronUp","CloseIcon","chevronDown","className","style","tabIndex","ref","onClick","type","_default"],"sources":["../../../../../src/components/design/accordion/Accordion.tsx"],"sourcesContent":["'use client';\n\n/* eslint-disable jsxA11y/no-noninteractive-tabindex, no-unused-vars */\n\nimport React, { useRef, useState } from 'react';\nimport { SvgIcon } from '@x15ventures/x15-ui-library-icons/svgIcon/SvgIcon';\nimport { chevronUp, chevronDown } from '@x15ventures/x15-ui-library-icons/iconDefinitions';\n\nimport { Icon } from '../icons/basicIcon/Icon';\n\nimport './accordion.scss';\n\nexport interface AccordionProps {\n  id: string;\n  isOpen?: boolean;\n  isAnimated?: boolean;\n  isFixed?: boolean;\n  innerBorders?: boolean;\n  outerBorders?: boolean;\n  hasShadow?: boolean;\n  onChange?: (args: boolean) => void;\n  openIcon?: string;\n  closeIcon?: string;\n  heading: string | React.ReactElement;\n  footer?: string | React.ReactElement;\n  customCssClass?: string;\n  restrictHeight?: 'xs' | 's' | 'm' | 'l' | 'xl' | 'auto';\n  headerButtonCustomLabel?: string | React.ReactElement;\n  headerButtonCssClass?: string;\n  paddingStyle?: 'compact' | 'regular' | 'spacious';\n  children?: React.ReactNode;\n  horizontalAlignments?: {\n    header?: 'left' | 'center' | 'right';\n    content?: 'left' | 'center' | 'right';\n    footer?: 'left' | 'center' | 'right';\n  };\n}\n\nexport const Accordion: React.FC<AccordionProps> = (\n  {\n    id,\n    heading,\n    children,\n    footer,\n    openIcon = null,\n    closeIcon = null,\n    isOpen = true,\n    isAnimated = true,\n    isFixed = false,\n    innerBorders = true,\n    outerBorders = true,\n    hasShadow = false,\n    onChange,\n    customCssClass,\n    restrictHeight,\n    headerButtonCustomLabel,\n    headerButtonCssClass,\n    paddingStyle = 'regular',\n    horizontalAlignments,\n  }\n) => {\n  const [panelIsOpen, setPanelIsOpen] = useState(isOpen || isFixed);\n  const accordionControl = useRef(null);\n\n  const panelId = id || `accordion_${ Date.now() }`;\n  const contentId = `${ panelId }_content`;\n  const controlId = `${ panelId }_control`;\n\n  const customSectionHeader = typeof heading !== 'string' && !headerButtonCustomLabel;\n\n  const TogglePanelOpenState = () => {\n    const newState = !panelIsOpen;\n    setPanelIsOpen(newState);\n    if (onChange) {\n      onChange(newState);\n    }\n  };\n\n  const heightCssClass = restrictHeight ? `accordion_${ restrictHeight }` : '';\n\n\n  // map horizontal alignment props to justify-content values for fixed accordions\n  const justifyContentMap = {\n    left: 'flex-start',\n    center: 'center',\n    right: 'flex-end',\n  };\n\n  const alignmentStyle = {\n    ...(isFixed && horizontalAlignments?.header\n      ? { '--header-align-h': justifyContentMap[horizontalAlignments.header] }\n      : { '--header-align-h': horizontalAlignments?.header || 'left' }),\n    '--content-align-h': horizontalAlignments?.content || 'left',\n    '--footer-align-h': horizontalAlignments?.footer || 'left',\n  };\n\n  const wrapperCssClass = `\n    accordion \n    ${ customCssClass || '' } \n    ${ heightCssClass } \n    ${ panelIsOpen || isFixed ? 'open' : 'closed' } \n    ${ isFixed ? 'fixed' : '' }\n    ${ isAnimated ? 'animated' : '' }\n    ${ outerBorders ? 'outerBorders' : '' }\n    ${ paddingStyle ? `padding_${ paddingStyle }` : '' }\n    ${ hasShadow ? 'hasShadow' : '' }\n  `;\n\n  const headerCssClass = `accordionHeader ${ customSectionHeader || isFixed ? 'accordionHeader_custom' : '' } ${ innerBorders ? 'accordionHeader_innerBorders' : '' }`;\n\n  const controlCssClass = `accordionControl ${ customCssClass ? `${ customCssClass }_accordionControl` : '' } ${ headerButtonCssClass || '' }`;\n\n  const contentCssClass = `accordionContent ${ customCssClass ? `${ customCssClass }_accordionContent` : '' }`;\n\n  const OpenIcon = () => {\n    if (openIcon) {\n      return <Icon icon={ openIcon } />;\n    }\n    return <SvgIcon svgDefinition={ chevronUp } />;\n  };\n\n  const CloseIcon = () => {\n    if (closeIcon) {\n      return <Icon icon={ closeIcon } />;\n    }\n    return <SvgIcon svgDefinition={ chevronDown } />;\n  };\n\n  return (\n    <section className={ wrapperCssClass } style={ alignmentStyle as React.CSSProperties }>\n      <header className={ headerCssClass }>\n        {\n          customSectionHeader\n            ? <div tabIndex={ 0 } className=\"accordionCustomHeading\">{ heading }</div>\n            : (\n              <h3>\n                { isFixed\n                  ? heading\n                  : (\n                    <button\n                      ref={ accordionControl }\n                      aria-controls={ contentId }\n                      aria-expanded={ panelIsOpen }\n                      id={ controlId }\n                      onClick={ TogglePanelOpenState }\n                      type=\"button\"\n                      className={ controlCssClass }\n                    >\n                      <span className=\"sr-only\">Open and close accordion</span>\n                      {\n                        headerButtonCustomLabel || <span className=\"labelText\">{ heading }</span>\n                      }\n                      {\n                        panelIsOpen\n                          ? <OpenIcon />\n                          : <CloseIcon />\n                      }\n                    </button>\n                  ) }\n              </h3>\n            )\n        }\n      </header>\n\n      <section tabIndex={ 0 } className={ contentCssClass } id={ contentId } aria-labelledby={ controlId }>\n        <span className=\"sr-only\">Start of accordion content</span>\n        { children }\n\n        { footer\n          && (\n            <footer>\n              { footer }\n            </footer>\n          ) }\n      </section>\n    </section>\n  );\n};\n\nexport default Accordion;\n"],"mappings":";AAAA,YAAY;;AAEZ;AAAAA,MAAA,CAAAC,cAAA,CAAAC,OAAA;EAAAC,KAAA;AAAA;AAAAD,OAAA,CAAAE,OAAA,GAAAF,OAAA,CAAAG,SAAA;AAEA,IAAAC,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AACA,IAAAC,QAAA,GAAAD,OAAA;AACA,IAAAE,gBAAA,GAAAF,OAAA;AAEA,IAAAG,KAAA,GAAAH,OAAA;AAEAA,OAAA;AAA0B,SAAAD,wBAAAK,CAAA,EAAAC,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAP,uBAAA,YAAAA,CAAAK,CAAA,EAAAC,CAAA,SAAAA,CAAA,IAAAD,CAAA,IAAAA,CAAA,CAAAK,UAAA,SAAAL,CAAA,MAAAM,CAAA,EAAAC,CAAA,EAAAC,CAAA,KAAAC,SAAA,QAAAjB,OAAA,EAAAQ,CAAA,iBAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,SAAAQ,CAAA,MAAAF,CAAA,GAAAL,CAAA,GAAAG,CAAA,GAAAD,CAAA,QAAAG,CAAA,CAAAI,GAAA,CAAAV,CAAA,UAAAM,CAAA,CAAAK,GAAA,CAAAX,CAAA,GAAAM,CAAA,CAAAM,GAAA,CAAAZ,CAAA,EAAAQ,CAAA,gBAAAP,CAAA,IAAAD,CAAA,gBAAAC,CAAA,OAAAY,cAAA,CAAAC,IAAA,CAAAd,CAAA,EAAAC,CAAA,OAAAM,CAAA,IAAAD,CAAA,GAAAlB,MAAA,CAAAC,cAAA,KAAAD,MAAA,CAAA2B,wBAAA,CAAAf,CAAA,EAAAC,CAAA,OAAAM,CAAA,CAAAI,GAAA,IAAAJ,CAAA,CAAAK,GAAA,IAAAN,CAAA,CAAAE,CAAA,EAAAP,CAAA,EAAAM,CAAA,IAAAC,CAAA,CAAAP,CAAA,IAAAD,CAAA,CAAAC,CAAA,WAAAO,CAAA,KAAAR,CAAA,EAAAC,CAAA;AA4BnB,MAAMR,SAAmC,GAAGA,CACjD;EACEuB,EAAE;EACFC,OAAO;EACPC,QAAQ;EACRC,MAAM;EACNC,QAAQ,GAAG,IAAI;EACfC,SAAS,GAAG,IAAI;EAChBC,MAAM,GAAG,IAAI;EACbC,UAAU,GAAG,IAAI;EACjBC,OAAO,GAAG,KAAK;EACfC,YAAY,GAAG,IAAI;EACnBC,YAAY,GAAG,IAAI;EACnBC,SAAS,GAAG,KAAK;EACjBC,QAAQ;EACRC,cAAc;EACdC,cAAc;EACdC,uBAAuB;EACvBC,oBAAoB;EACpBC,YAAY,GAAG,SAAS;EACxBC;AACF,CAAC,KACE;EACH,MAAM,CAACC,WAAW,EAAEC,cAAc,CAAC,GAAG,IAAAC,eAAQ,EAACf,MAAM,IAAIE,OAAO,CAAC;EACjE,MAAMc,gBAAgB,GAAG,IAAAC,aAAM,EAAC,IAAI,CAAC;EAErC,MAAMC,OAAO,GAAGxB,EAAE,IAAI,aAAcyB,IAAI,CAACC,GAAG,CAAC,CAAC,EAAG;EACjD,MAAMC,SAAS,GAAG,GAAIH,OAAO,UAAW;EACxC,MAAMI,SAAS,GAAG,GAAIJ,OAAO,UAAW;EAExC,MAAMK,mBAAmB,GAAG,OAAO5B,OAAO,KAAK,QAAQ,IAAI,CAACc,uBAAuB;EAEnF,MAAMe,oBAAoB,GAAGA,CAAA,KAAM;IACjC,MAAMC,QAAQ,GAAG,CAACZ,WAAW;IAC7BC,cAAc,CAACW,QAAQ,CAAC;IACxB,IAAInB,QAAQ,EAAE;MACZA,QAAQ,CAACmB,QAAQ,CAAC;IACpB;EACF,CAAC;EAED,MAAMC,cAAc,GAAGlB,cAAc,GAAG,aAAcA,cAAc,EAAG,GAAG,EAAE;;EAG5E;EACA,MAAMmB,iBAAiB,GAAG;IACxBC,IAAI,EAAE,YAAY;IAClBC,MAAM,EAAE,QAAQ;IAChBC,KAAK,EAAE;EACT,CAAC;EAED,MAAMC,cAAc,GAAG;IACrB,IAAI7B,OAAO,IAAIU,oBAAoB,EAAEoB,MAAM,GACvC;MAAE,kBAAkB,EAAEL,iBAAiB,CAACf,oBAAoB,CAACoB,MAAM;IAAE,CAAC,GACtE;MAAE,kBAAkB,EAAEpB,oBAAoB,EAAEoB,MAAM,IAAI;IAAO,CAAC,CAAC;IACnE,mBAAmB,EAAEpB,oBAAoB,EAAEqB,OAAO,IAAI,MAAM;IAC5D,kBAAkB,EAAErB,oBAAoB,EAAEf,MAAM,IAAI;EACtD,CAAC;EAED,MAAMqC,eAAe,GAAG;AAC1B;AACA,MAAO3B,cAAc,IAAI,EAAE;AAC3B,MAAOmB,cAAc;AACrB,MAAOb,WAAW,IAAIX,OAAO,GAAG,MAAM,GAAG,QAAQ;AACjD,MAAOA,OAAO,GAAG,OAAO,GAAG,EAAE;AAC7B,MAAOD,UAAU,GAAG,UAAU,GAAG,EAAE;AACnC,MAAOG,YAAY,GAAG,cAAc,GAAG,EAAE;AACzC,MAAOO,YAAY,GAAG,WAAYA,YAAY,EAAG,GAAG,EAAE;AACtD,MAAON,SAAS,GAAG,WAAW,GAAG,EAAE;AACnC,GAAG;EAED,MAAM8B,cAAc,GAAG,mBAAoBZ,mBAAmB,IAAIrB,OAAO,GAAG,wBAAwB,GAAG,EAAE,IAAMC,YAAY,GAAG,8BAA8B,GAAG,EAAE,EAAG;EAEpK,MAAMiC,eAAe,GAAG,oBAAqB7B,cAAc,GAAG,GAAIA,cAAc,mBAAoB,GAAG,EAAE,IAAMG,oBAAoB,IAAI,EAAE,EAAG;EAE5I,MAAM2B,eAAe,GAAG,oBAAqB9B,cAAc,GAAG,GAAIA,cAAc,mBAAoB,GAAG,EAAE,EAAG;EAE5G,MAAM+B,QAAQ,GAAGA,CAAA,KAAM;IACrB,IAAIxC,QAAQ,EAAE;MACZ,oBAAO1B,MAAA,CAAAF,OAAA,CAAAqE,aAAA,CAAC9D,KAAA,CAAA+D,IAAI;QAACC,IAAI,EAAG3C;MAAU,CAAE,CAAC;IACnC;IACA,oBAAO1B,MAAA,CAAAF,OAAA,CAAAqE,aAAA,CAAChE,QAAA,CAAAmE,OAAO;MAACC,aAAa,EAAGC;IAAW,CAAE,CAAC;EAChD,CAAC;EAED,MAAMC,SAAS,GAAGA,CAAA,KAAM;IACtB,IAAI9C,SAAS,EAAE;MACb,oBAAO3B,MAAA,CAAAF,OAAA,CAAAqE,aAAA,CAAC9D,KAAA,CAAA+D,IAAI;QAACC,IAAI,EAAG1C;MAAW,CAAE,CAAC;IACpC;IACA,oBAAO3B,MAAA,CAAAF,OAAA,CAAAqE,aAAA,CAAChE,QAAA,CAAAmE,OAAO;MAACC,aAAa,EAAGG;IAAa,CAAE,CAAC;EAClD,CAAC;EAED,oBACE1E,MAAA,CAAAF,OAAA,CAAAqE,aAAA;IAASQ,SAAS,EAAGb,eAAiB;IAACc,KAAK,EAAGjB;EAAuC,gBACpF3D,MAAA,CAAAF,OAAA,CAAAqE,aAAA;IAAQQ,SAAS,EAAGZ;EAAgB,GAEhCZ,mBAAmB,gBACfnD,MAAA,CAAAF,OAAA,CAAAqE,aAAA;IAAKU,QAAQ,EAAG,CAAG;IAACF,SAAS,EAAC;EAAwB,GAAGpD,OAAc,CAAC,gBAExEvB,MAAA,CAAAF,OAAA,CAAAqE,aAAA,aACIrC,OAAO,GACLP,OAAO,gBAEPvB,MAAA,CAAAF,OAAA,CAAAqE,aAAA;IACEW,GAAG,EAAGlC,gBAAkB;IACxB,iBAAgBK,SAAW;IAC3B,iBAAgBR,WAAa;IAC7BnB,EAAE,EAAG4B,SAAW;IAChB6B,OAAO,EAAG3B,oBAAsB;IAChC4B,IAAI,EAAC,QAAQ;IACbL,SAAS,EAAGX;EAAiB,gBAE7BhE,MAAA,CAAAF,OAAA,CAAAqE,aAAA;IAAMQ,SAAS,EAAC;EAAS,GAAC,0BAA8B,CAAC,EAEvDtC,uBAAuB,iBAAIrC,MAAA,CAAAF,OAAA,CAAAqE,aAAA;IAAMQ,SAAS,EAAC;EAAW,GAAGpD,OAAe,CAAC,EAGzEkB,WAAW,gBACPzC,MAAA,CAAAF,OAAA,CAAAqE,aAAA,CAACD,QAAQ,MAAE,CAAC,gBACZlE,MAAA,CAAAF,OAAA,CAAAqE,aAAA,CAACM,SAAS,MAAE,CAEZ,CAEV,CAGJ,CAAC,eAETzE,MAAA,CAAAF,OAAA,CAAAqE,aAAA;IAASU,QAAQ,EAAG,CAAG;IAACF,SAAS,EAAGV,eAAiB;IAAC3C,EAAE,EAAG2B,SAAW;IAAC,mBAAkBC;EAAW,gBAClGlD,MAAA,CAAAF,OAAA,CAAAqE,aAAA;IAAMQ,SAAS,EAAC;EAAS,GAAC,4BAAgC,CAAC,EACzDnD,QAAQ,EAERC,MAAM,iBAEJzB,MAAA,CAAAF,OAAA,CAAAqE,aAAA,iBACI1C,MACI,CAEL,CACF,CAAC;AAEd,CAAC;AAAC7B,OAAA,CAAAG,SAAA,GAAAA,SAAA;AAAA,IAAAkF,QAAA,GAAArF,OAAA,CAAAE,OAAA,GAEaC,SAAS","ignoreList":[]}

package/dist/cjs/components/design/accordion/accordion.css

@@ -0,0 +1,217 @@
+/* Popovers */
+/* BUTTONS */
+.accordion {
+  width: var(--accordionWidth, 100%);
+  background: var(--accordionBg, transparent);
+  margin: var(--accordionMargin, 0 0 20px);
+  box-sizing: border-box;
+  display: flex;
+  flex-direction: column;
+  row-gap: 0;
+}
+.accordion.hasShadow {
+  box-shadow: var(--accordionShadow, 0 0 5px 0 #d3dee4);
+}
+.accordion.outerBorders {
+  border: var(--accordionBorder, 1px solid #e5ebef);
+  border-radius: var(--accordionBorderRadius, 5px);
+}
+.accordion.padding_compact header.accordionHeader button {
+  padding: var(--accordionPaddingCompact, 10px 10px);
+}
+.accordion.padding_compact .accordionContent {
+  padding: var(--accordionPaddingCompact, 10px 10px);
+}
+.accordion.padding_compact .accordionContent footer {
+  padding: var(--accordionPaddingCompact, 10px 10px);
+  margin: var(--accordionFooterMarginCompact, 0 -10px -10px);
+}
+.accordion.padding_compact.closed .accordionContent {
+  padding: var(--accordionClosedContentPaddingCompact, 0 10px);
+}
+.accordion.padding_regular header.accordionHeader button {
+  padding: var(--accordionPaddingRegular, 20px 20px);
+}
+.accordion.padding_regular .accordionContent {
+  padding: var(--accordionPaddingRegular, 20px 20px);
+}
+.accordion.padding_regular .accordionContent footer {
+  padding: var(--accordionPaddingRegular, 20px 20px);
+  margin: var(--accordionFooterMarginRegular, 0 -20px -20px);
+}
+.accordion.padding_regular.closed .accordionContent {
+  padding: var(--accordionClosedContentPaddingRegular, 0 20px);
+}
+.accordion.padding_spacious header.accordionHeader button {
+  padding: var(--accordionPaddingSpacious, 30px 30px);
+}
+.accordion.padding_spacious .accordionContent {
+  padding: var(--accordionPaddingSpacious, 30px 30px);
+}
+.accordion.padding_spacious .accordionContent footer {
+  padding: var(--accordionPaddingSpacious, 30px 30px);
+  margin: var(--accordionFooterMarginSpacious, 0 -30px -30px);
+}
+.accordion.padding_spacious.closed .accordionContent {
+  padding: var(--accordionClosedContentPaddingSpacious, 0 30px);
+}
+.accordion header.accordionHeader {
+  display: flex;
+  flex-direction: row;
+  column-gap: 10px;
+  align-items: center;
+  justify-content: flex-start;
+  position: relative;
+  z-index: 1;
+  margin: 0;
+  box-shadow: var(--accordionHeaderBoxShadow, none);
+  border-radius: var(--accordionHeaderBorderRadius, 3px 3px 0 0);
+  background: var(--accordionHeaderBg, #fff);
+}
+.accordion header.accordionHeader.accordionHeader_innerBorders {
+  border-bottom: var(--accordionHeaderBorder, 1px solid #e5ebef);
+}
+.accordion header.accordionHeader.accordionHeader_custom {
+  padding: var(--accordionPaddingRegular, 20px 20px);
+}
+.accordion header.accordionHeader h2, .accordion header.accordionHeader h3 {
+  margin: 0;
+}
+.accordion header.accordionHeader button {
+  display: inline-flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: center;
+  margin: 0;
+  cursor: pointer;
+  font-weight: 500;
+  box-sizing: border-box;
+  column-gap: 10px;
+  row-gap: 10px;
+  display: flex;
+  flex-direction: row;
+  column-gap: 10px;
+  align-items: center;
+  justify-content: space-between;
+  font-family: var(--accordionHeaderFont, serif) serif;
+  height: var(--accordionHeaderHeight, none);
+  width: var(--accordionWidth, 100%);
+  border: none;
+  font-size: var(--accordionHeaderFontSize, 21px);
+  font-weight: var(--accordionHeaderFontWeight, bold);
+  background: none;
+  color: var(--accordionHeaderFg, #222);
+}
+.accordion header.accordionHeader button .icon {
+  margin-right: 0;
+  color: var(--accordionHeaderIconColor, #222);
+}
+.accordion header.accordionHeader button .labelText {
+  width: 100%;
+  text-align: var(--header-align-h, left);
+}
+.accordion header.accordionHeader button .labelText strong, .accordion header.accordionHeader button .labelText em {
+  display: block;
+  font-weight: inherit;
+  font-style: normal;
+}
+.accordion header.accordionHeader button .labelText em {
+  font-size: 0.75em;
+}
+.accordion.fixed {
+  border: var(--accordionFixedBorder, none);
+  border-radius: var(--accordionFixedBorderRadius, 0);
+}
+.accordion.fixed header.accordionHeader h2, .accordion.fixed header.accordionHeader h3 {
+  display: flex;
+  flex-direction: row;
+  column-gap: 20px;
+  align-items: center;
+  justify-content: flex-start;
+  font-weight: 800;
+  box-sizing: border-box;
+  height: var(--accordionFixedHeaderHeight, auto);
+  width: var(--accordionFixedHeaderWidth, auto);
+  border: var(--accordionFixedHeaderBorder, none);
+  font-size: var(--accordionHeaderFontSize, 21px);
+  background: var(--accordionFixedHeaderBg, none);
+  color: var(--accordionFixedHeaderFgColor, #222);
+  border-radius: var(--accordionFixedBorderRadius, 0) var(--accordionFixedBorderRadius, 0) 0 0;
+  justify-content: var(--header-align-h, flex-start);
+}
+.accordion header.accordionHeader .accordionCustomHeading {
+  display: flex;
+  flex-direction: row;
+  column-gap: 20px;
+  align-items: baseline;
+  justify-content: flex-start;
+  padding: var(--accordionCustomHeaderPadding, 0 0 10px);
+}
+.accordion header.accordionHeader .accordionCustomHeading h2, .accordion header.accordionHeader .accordionCustomHeading h3 {
+  display: block;
+  padding: 0;
+}
+.accordion header.accordionHeader .accordionCustomHeading p {
+  margin: 0;
+}
+.accordion .accordionContent {
+  box-sizing: border-box;
+  max-height: none;
+  opacity: 1;
+  text-align: var(--content-align-h, left);
+}
+.accordion .accordionContent footer {
+  text-align: var(--footer-align-h, left);
+}
+.accordion.animated .accordionContent {
+  transition: all 1s ease;
+}
+@media (prefers-reduced-motion: reduce) {
+  .accordion.animated .accordionContent {
+    transition: none;
+  }
+}
+.accordion.accordion_xs header.accordionHeader button {
+  height: 30px;
+  font-size: 0.7em;
+  padding: 0 8px;
+}
+.accordion.accordion_xs .accordionContent {
+  max-height: 80px;
+  overflow: auto;
+  padding: 8px;
+}
+.accordion.accordion_s header.accordionHeader button {
+  height: 36px;
+  font-size: 0.8em;
+  padding: 0 10px;
+}
+.accordion.accordion_s .accordionContent {
+  max-height: 150px;
+  overflow: auto;
+  padding: 10px;
+}
+.accordion.accordion_m .accordionContent {
+  max-height: 300px;
+  overflow: auto;
+}
+.accordion.accordion_l .accordionContent {
+  max-height: 450px;
+  overflow: auto;
+}
+.accordion.accordion_xl .accordionContent {
+  max-height: 600px;
+  overflow: auto;
+}
+.accordion.closed {
+  overflow: hidden;
+}
+.accordion.closed header.accordionHeader {
+  border-bottom: none;
+}
+.accordion.closed .accordionContent {
+  max-height: 1px;
+  margin-top: -1px;
+  opacity: 0.01;
+  overflow: hidden;
+}