@laerdal/life-react-components 2.1.1-dev.25 → 2.1.1-dev.29

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.
Files changed (27) hide show
  1. package/dist/Accordion/AccordionItem.cjs +8 -17
  2. package/dist/Accordion/AccordionItem.cjs.map +1 -1
  3. package/dist/Accordion/AccordionItem.d.ts +2 -0
  4. package/dist/Accordion/AccordionItem.js +9 -18
  5. package/dist/Accordion/AccordionItem.js.map +1 -1
  6. package/dist/Accordion/AccordionMenu.cjs +6 -2
  7. package/dist/Accordion/AccordionMenu.cjs.map +1 -1
  8. package/dist/Accordion/AccordionMenu.d.ts +3 -0
  9. package/dist/Accordion/AccordionMenu.js +6 -2
  10. package/dist/Accordion/AccordionMenu.js.map +1 -1
  11. package/dist/Accordion/styles.cjs +7 -11
  12. package/dist/Accordion/styles.cjs.map +1 -1
  13. package/dist/Accordion/styles.d.ts +1 -4
  14. package/dist/Accordion/styles.js +6 -9
  15. package/dist/Accordion/styles.js.map +1 -1
  16. package/dist/Table/Table.cjs +0 -1
  17. package/dist/Table/Table.cjs.map +1 -1
  18. package/dist/Table/Table.js +0 -1
  19. package/dist/Table/Table.js.map +1 -1
  20. package/dist/Table/TableStyles.cjs +4 -4
  21. package/dist/Table/TableStyles.cjs.map +1 -1
  22. package/dist/Table/TableStyles.js +4 -4
  23. package/dist/Table/TableStyles.js.map +1 -1
  24. package/dist/Table/TableTypes.cjs.map +1 -1
  25. package/dist/Table/TableTypes.d.ts +0 -1
  26. package/dist/Table/TableTypes.js.map +1 -1
  27. package/package.json +1 -1
package/dist/Accordion/AccordionItem.cjs CHANGED
@@ -14,7 +14,7 @@ var _icons = require("../icons");
14
14
  var _styles = require("./styles");
15
15
  var _common = require("../common");
16
16
  var _jsxRuntime = require("react/jsx-runtime");
17
- var _excluded = ["id", "onSelect", "isActive", "title", "icon", "disabled", "isLast", "padding", "children", "className"];
17
+ var _excluded = ["id", "onSelect", "isActive", "title", "icon", "disabled", "isLast", "padding", "children", "className", "size"];
18
18
  function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
19
19
  function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
20
20
  var AccordionItem = function AccordionItem(props) {
@@ -28,11 +28,12 @@ var AccordionItem = function AccordionItem(props) {
28
28
  padding = props.padding,
29
29
  children = props.children,
30
30
  className = props.className,
31
+ _props$size = props.size,
32
+ size = _props$size === void 0 ? _.Size.Medium : _props$size,
31
33
  rest = (0, _objectWithoutProperties2.default)(props, _excluded);
32
- var cls = (isActive ? 'active' : '') + (disabled ? ' disabled' : '') + (className ? " ".concat(className) : '');
34
+ var cls = (isActive ? 'active' : '') + (disabled ? ' disabled' : '') + (className ? " ".concat(className) : '') + " ".concat(size);
33
35
  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.AccordionItemContainer, {
34
36
  id: id,
35
- displaySeparator: !isActive && !isLast,
36
37
  children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.ItemHeaderContainer, _objectSpread(_objectSpread({
37
38
  role: "button",
38
39
  "aria-expanded": isActive,
@@ -50,26 +51,16 @@ var AccordionItem = function AccordionItem(props) {
50
51
  onMouseDown: _common.defaultOnMouseDownHandler,
51
52
  className: cls
52
53
  }, rest), {}, {
53
- children: [icon && /*#__PURE__*/_react.default.cloneElement(icon, {
54
- size: '24px'
55
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
54
+ children: [icon, /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
56
55
  children: title
57
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
56
+ }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
58
57
  "aria-hidden": "true",
59
- children: isActive ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.SystemIcons.ChevronUp, {
60
- color: _.COLORS.neutral_800,
61
- size: "20px"
62
- }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.SystemIcons.ChevronDown, {
63
- color: _.COLORS.neutral_600,
64
- size: "20px"
65
- })
58
+ children: [isActive && /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.SystemIcons.ChevronUp, {}), !isActive && /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.SystemIcons.ChevronDown, {})]
66
59
  })]
67
60
  })), isActive && /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.ItemBodyContainer, {
68
61
  id: "itemContentFor_".concat(id),
69
62
  padding: padding,
70
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_.ComponentS, {
71
- children: children
72
- })
63
+ children: children
73
64
  })]
74
65
  });
75
66
  };
package/dist/Accordion/AccordionItem.cjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"AccordionItem.cjs","names":["AccordionItem","props","id","onSelect","isActive","title","icon","disabled","isLast","padding","children","className","rest","cls","undefined","e","key","defaultOnMouseDownHandler","React","cloneElement","size","COLORS","neutral_800","neutral_600"],"sources":["../../src/Accordion/AccordionItem.tsx"],"sourcesContent":["import React from 'react';\nimport { COLORS, ComponentS } from '..';\nimport { SystemIcons } from '../icons';\nimport { AccordionItemProps } from './AccordionMenu';\nimport { AccordionItemContainer, ItemBodyContainer, ItemHeaderContainer } from './styles';\nimport { defaultOnMouseDownHandler } from '../common';\n\ninterface AccordionItemPropsInner extends AccordionItemProps {\n onSelect: (id: string) => void;\n isActive: boolean;\n isLast: boolean;\n padding?: string;\n}\n\nconst AccordionItem: React.FunctionComponent<AccordionItemPropsInner> = (props: AccordionItemPropsInner) => {\n const { id, onSelect, isActive, title, icon, disabled, isLast, padding, children, className, ...rest } = props;\n\n const cls = (isActive ? 'active' : '') + (disabled ? ' disabled' : '') + (className ? ` ${className}` : '');\n\n return (\n <AccordionItemContainer id={id} displaySeparator={!isActive && !isLast}>\n <ItemHeaderContainer\n role=\"button\"\n aria-expanded={isActive}\n id={`itemHeaderFor_${id}`}\n aria-controls={`itemContentFor_${id}`}\n tabIndex={!disabled ? 0 : undefined}\n onClick={() => {\n if (!disabled) {\n onSelect(id);\n }\n }}\n onKeyDown={(e: any) => {\n if (e.key === 'Enter') onSelect(id);\n }}\n onMouseDown={defaultOnMouseDownHandler}\n className={cls}\n {...rest}>\n {icon && React.cloneElement(icon as React.ReactElement, { size: '24px' })}\n <span>{title}</span>\n <div aria-hidden=\"true\">\n {isActive ? <SystemIcons.ChevronUp color={COLORS.neutral_800} size=\"20px\" /> : <SystemIcons.ChevronDown color={COLORS.neutral_600} size=\"20px\" />}\n </div>\n </ItemHeaderContainer>\n {isActive && (\n <ItemBodyContainer id={`itemContentFor_${id}`} padding={padding}>\n <ComponentS>{children}</ComponentS>\n </ItemBodyContainer>\n )}\n </AccordionItemContainer>\n );\n};\n\nexport default AccordionItem;\n"],"mappings":";;;;;;;;;;AAAA;AACA;AACA;AAEA;AACA;AAAsD;AAAA;AAAA;AAAA;AAStD,IAAMA,aAA+D,GAAG,SAAlEA,aAA+D,CAAIC,KAA8B,EAAK;EAC1G,IAAQC,EAAE,GAA+FD,KAAK,CAAtGC,EAAE;IAAEC,QAAQ,GAAqFF,KAAK,CAAlGE,QAAQ;IAAEC,QAAQ,GAA2EH,KAAK,CAAxFG,QAAQ;IAAEC,KAAK,GAAoEJ,KAAK,CAA9EI,KAAK;IAAEC,IAAI,GAA8DL,KAAK,CAAvEK,IAAI;IAAEC,QAAQ,GAAoDN,KAAK,CAAjEM,QAAQ;IAAEC,MAAM,GAA4CP,KAAK,CAAvDO,MAAM;IAAEC,OAAO,GAAmCR,KAAK,CAA/CQ,OAAO;IAAEC,QAAQ,GAAyBT,KAAK,CAAtCS,QAAQ;IAAEC,SAAS,GAAcV,KAAK,CAA5BU,SAAS;IAAKC,IAAI,0CAAKX,KAAK;EAE9G,IAAMY,GAAG,GAAG,CAACT,QAAQ,GAAG,QAAQ,GAAG,EAAE,KAAKG,QAAQ,GAAG,WAAW,GAAG,EAAE,CAAC,IAAII,SAAS,cAAOA,SAAS,IAAK,EAAE,CAAC;EAE3G,oBACE,sBAAC,8BAAsB;IAAC,EAAE,EAAET,EAAG;IAAC,gBAAgB,EAAE,CAACE,QAAQ,IAAI,CAACI,MAAO;IAAA,wBACrE,sBAAC,2BAAmB;MAClB,IAAI,EAAC,QAAQ;MACb,iBAAeJ,QAAS;MACxB,EAAE,0BAAmBF,EAAE,CAAG;MAC1B,0CAAiCA,EAAE,CAAG;MACtC,QAAQ,EAAE,CAACK,QAAQ,GAAG,CAAC,GAAGO,SAAU;MACpC,OAAO,EAAE,mBAAM;QACb,IAAI,CAACP,QAAQ,EAAE;UACbJ,QAAQ,CAACD,EAAE,CAAC;QACd;MACF,CAAE;MACF,SAAS,EAAE,mBAACa,CAAM,EAAK;QACrB,IAAIA,CAAC,CAACC,GAAG,KAAK,OAAO,EAAEb,QAAQ,CAACD,EAAE,CAAC;MACrC,CAAE;MACF,WAAW,EAAEe,iCAA0B;MACvC,SAAS,EAAEJ;IAAI,GACXD,IAAI;MAAA,WACPN,IAAI,iBAAIY,cAAK,CAACC,YAAY,CAACb,IAAI,EAAwB;QAAEc,IAAI,EAAE;MAAO,CAAC,CAAC,eACzE;QAAA,UAAOf;MAAK,EAAQ,eACpB;QAAK,eAAY,MAAM;QAAA,UACpBD,QAAQ,gBAAG,qBAAC,kBAAW,CAAC,SAAS;UAAC,KAAK,EAAEiB,QAAM,CAACC,WAAY;UAAC,IAAI,EAAC;QAAM,EAAG,gBAAG,qBAAC,kBAAW,CAAC,WAAW;UAAC,KAAK,EAAED,QAAM,CAACE,WAAY;UAAC,IAAI,EAAC;QAAM;MAAG,EAC7I;IAAA,GACc,EACrBnB,QAAQ,iBACP,qBAAC,yBAAiB;MAAC,EAAE,2BAAoBF,EAAE,CAAG;MAAC,OAAO,EAAEO,OAAQ;MAAA,uBAC9D,qBAAC,YAAU;QAAA,UAAEC;MAAQ;IAAc,EAEtC;EAAA,EACsB;AAE7B,CAAC;AAAC;EA3CAP,QAAQ;EACRC,QAAQ;EACRI,MAAM;EACNC,OAAO;AAAA;AAAA,eA0CMT,aAAa;AAAA"}
1
+ {"version":3,"file":"AccordionItem.cjs","names":["AccordionItem","props","id","onSelect","isActive","title","icon","disabled","isLast","padding","children","className","size","Size","Medium","rest","cls","undefined","e","key","defaultOnMouseDownHandler"],"sources":["../../src/Accordion/AccordionItem.tsx"],"sourcesContent":["import React from 'react';\nimport {COLORS, ComponentS, Size} from '..';\nimport {SystemIcons} from '../icons';\nimport {AccordionItemProps} from './AccordionMenu';\nimport {AccordionItemContainer, ItemBodyContainer, ItemHeaderContainer} from './styles';\nimport {defaultOnMouseDownHandler} from '../common';\n\ninterface AccordionItemPropsInner extends AccordionItemProps {\n onSelect: (id: string) => void;\n isActive: boolean;\n isLast: boolean;\n padding?: string;\n size?: Size.Small | Size.Medium | Size.Large;\n}\n\nconst AccordionItem: React.FunctionComponent<AccordionItemPropsInner> = (props: AccordionItemPropsInner) => {\n const {\n id,\n onSelect,\n isActive,\n title,\n icon,\n disabled,\n isLast,\n padding,\n children,\n className,\n size = Size.Medium,\n ...rest\n } = props;\n\n const cls = (isActive ? 'active' : '') + (disabled ? ' disabled' : '') + (className ? ` ${className}` : '') + ` ${size}`;\n\n return (\n <AccordionItemContainer id={id}>\n <ItemHeaderContainer\n role=\"button\"\n aria-expanded={isActive}\n id={`itemHeaderFor_${id}`}\n aria-controls={`itemContentFor_${id}`}\n tabIndex={!disabled ? 0 : undefined}\n onClick={() => {\n if (!disabled) {\n onSelect(id);\n }\n }}\n onKeyDown={(e: any) => {\n if (e.key === 'Enter') onSelect(id);\n }}\n onMouseDown={defaultOnMouseDownHandler}\n className={cls}\n {...rest}>\n {icon}\n <span>{title}</span>\n <div aria-hidden=\"true\">\n {\n isActive && <SystemIcons.ChevronUp/>\n }\n {\n !isActive && <SystemIcons.ChevronDown/>\n }\n </div>\n </ItemHeaderContainer>\n {isActive && (\n <ItemBodyContainer id={`itemContentFor_${id}`} padding={padding}>\n {children}\n </ItemBodyContainer>\n )\n }\n </AccordionItemContainer>\n );\n};\n\nexport default AccordionItem;\n"],"mappings":";;;;;;;;;;AAAA;AACA;AACA;AAEA;AACA;AAAoD;AAAA;AAAA;AAAA;AAUpD,IAAMA,aAA+D,GAAG,SAAlEA,aAA+D,CAAIC,KAA8B,EAAK;EAC1G,IACEC,EAAE,GAYAD,KAAK,CAZPC,EAAE;IACFC,QAAQ,GAWNF,KAAK,CAXPE,QAAQ;IACRC,QAAQ,GAUNH,KAAK,CAVPG,QAAQ;IACRC,KAAK,GASHJ,KAAK,CATPI,KAAK;IACLC,IAAI,GAQFL,KAAK,CARPK,IAAI;IACJC,QAAQ,GAONN,KAAK,CAPPM,QAAQ;IACRC,MAAM,GAMJP,KAAK,CANPO,MAAM;IACNC,OAAO,GAKLR,KAAK,CALPQ,OAAO;IACPC,QAAQ,GAINT,KAAK,CAJPS,QAAQ;IACRC,SAAS,GAGPV,KAAK,CAHPU,SAAS;IAAA,cAGPV,KAAK,CAFPW,IAAI;IAAJA,IAAI,4BAAGC,MAAI,CAACC,MAAM;IACfC,IAAI,0CACLd,KAAK;EAET,IAAMe,GAAG,GAAG,CAACZ,QAAQ,GAAG,QAAQ,GAAG,EAAE,KAAKG,QAAQ,GAAG,WAAW,GAAG,EAAE,CAAC,IAAII,SAAS,cAAOA,SAAS,IAAK,EAAE,CAAC,cAAOC,IAAI,CAAE;EAExH,oBACE,sBAAC,8BAAsB;IAAC,EAAE,EAAEV,EAAG;IAAA,wBAC7B,sBAAC,2BAAmB;MAClB,IAAI,EAAC,QAAQ;MACb,iBAAeE,QAAS;MACxB,EAAE,0BAAmBF,EAAE,CAAG;MAC1B,0CAAiCA,EAAE,CAAG;MACtC,QAAQ,EAAE,CAACK,QAAQ,GAAG,CAAC,GAAGU,SAAU;MACpC,OAAO,EAAE,mBAAM;QACb,IAAI,CAACV,QAAQ,EAAE;UACbJ,QAAQ,CAACD,EAAE,CAAC;QACd;MACF,CAAE;MACF,SAAS,EAAE,mBAACgB,CAAM,EAAK;QACrB,IAAIA,CAAC,CAACC,GAAG,KAAK,OAAO,EAAEhB,QAAQ,CAACD,EAAE,CAAC;MACrC,CAAE;MACF,WAAW,EAAEkB,iCAA0B;MACvC,SAAS,EAAEJ;IAAI,GACXD,IAAI;MAAA,WACPT,IAAI,eACL;QAAA,UAAOD;MAAK,EAAQ,eACpB;QAAK,eAAY,MAAM;QAAA,WAEnBD,QAAQ,iBAAI,qBAAC,kBAAW,CAAC,SAAS,KAAE,EAGpC,CAACA,QAAQ,iBAAI,qBAAC,kBAAW,CAAC,WAAW,KAAE;MAAA,EAErC;IAAA,GACc,EACrBA,QAAQ,iBACP,qBAAC,yBAAiB;MAAC,EAAE,2BAAoBF,EAAE,CAAG;MAAC,OAAO,EAAEO,OAAQ;MAAA,UAC7DC;IAAQ,EAEZ;EAAA,EAEsB;AAE7B,CAAC;AAAC;EA/DAP,QAAQ;EACRC,QAAQ;EACRI,MAAM;EACNC,OAAO;AAAA;AAAA,eA8DMT,aAAa;AAAA"}
package/dist/Accordion/AccordionItem.d.ts CHANGED
@@ -1,10 +1,12 @@
1
1
  import React from 'react';
2
+ import { Size } from '..';
2
3
  import { AccordionItemProps } from './AccordionMenu';
3
4
  interface AccordionItemPropsInner extends AccordionItemProps {
4
5
  onSelect: (id: string) => void;
5
6
  isActive: boolean;
6
7
  isLast: boolean;
7
8
  padding?: string;
9
+ size?: Size.Small | Size.Medium | Size.Large;
8
10
  }
9
11
  declare const AccordionItem: React.FunctionComponent<AccordionItemPropsInner>;
10
12
  export default AccordionItem;
package/dist/Accordion/AccordionItem.js CHANGED
@@ -1,11 +1,11 @@
1
1
  import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
2
2
  import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
3
3
  import _pt from "prop-types";
4
- var _excluded = ["id", "onSelect", "isActive", "title", "icon", "disabled", "isLast", "padding", "children", "className"];
4
+ var _excluded = ["id", "onSelect", "isActive", "title", "icon", "disabled", "isLast", "padding", "children", "className", "size"];
5
5
  function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
6
6
  function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
7
7
  import React from 'react';
8
- import { COLORS, ComponentS } from '..';
8
+ import { Size } from '..';
9
9
  import { SystemIcons } from '../icons';
10
10
  import { AccordionItemContainer, ItemBodyContainer, ItemHeaderContainer } from './styles';
11
11
  import { defaultOnMouseDownHandler } from '../common';
@@ -22,11 +22,12 @@ var AccordionItem = function AccordionItem(props) {
22
22
  padding = props.padding,
23
23
  children = props.children,
24
24
  className = props.className,
25
+ _props$size = props.size,
26
+ size = _props$size === void 0 ? Size.Medium : _props$size,
25
27
  rest = _objectWithoutProperties(props, _excluded);
26
- var cls = (isActive ? 'active' : '') + (disabled ? ' disabled' : '') + (className ? " ".concat(className) : '');
28
+ var cls = (isActive ? 'active' : '') + (disabled ? ' disabled' : '') + (className ? " ".concat(className) : '') + " ".concat(size);
27
29
  return /*#__PURE__*/_jsxs(AccordionItemContainer, {
28
30
  id: id,
29
- displaySeparator: !isActive && !isLast,
30
31
  children: [/*#__PURE__*/_jsxs(ItemHeaderContainer, _objectSpread(_objectSpread({
31
32
  role: "button",
32
33
  "aria-expanded": isActive,
@@ -44,26 +45,16 @@ var AccordionItem = function AccordionItem(props) {
44
45
  onMouseDown: defaultOnMouseDownHandler,
45
46
  className: cls
46
47
  }, rest), {}, {
47
- children: [icon && /*#__PURE__*/React.cloneElement(icon, {
48
- size: '24px'
49
- }), /*#__PURE__*/_jsx("span", {
48
+ children: [icon, /*#__PURE__*/_jsx("span", {
50
49
  children: title
51
- }), /*#__PURE__*/_jsx("div", {
50
+ }), /*#__PURE__*/_jsxs("div", {
52
51
  "aria-hidden": "true",
53
- children: isActive ? /*#__PURE__*/_jsx(SystemIcons.ChevronUp, {
54
- color: COLORS.neutral_800,
55
- size: "20px"
56
- }) : /*#__PURE__*/_jsx(SystemIcons.ChevronDown, {
57
- color: COLORS.neutral_600,
58
- size: "20px"
59
- })
52
+ children: [isActive && /*#__PURE__*/_jsx(SystemIcons.ChevronUp, {}), !isActive && /*#__PURE__*/_jsx(SystemIcons.ChevronDown, {})]
60
53
  })]
61
54
  })), isActive && /*#__PURE__*/_jsx(ItemBodyContainer, {
62
55
  id: "itemContentFor_".concat(id),
63
56
  padding: padding,
64
- children: /*#__PURE__*/_jsx(ComponentS, {
65
- children: children
66
- })
57
+ children: children
67
58
  })]
68
59
  });
69
60
  };
package/dist/Accordion/AccordionItem.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"AccordionItem.js","names":["React","COLORS","ComponentS","SystemIcons","AccordionItemContainer","ItemBodyContainer","ItemHeaderContainer","defaultOnMouseDownHandler","AccordionItem","props","id","onSelect","isActive","title","icon","disabled","isLast","padding","children","className","rest","cls","undefined","e","key","cloneElement","size","neutral_800","neutral_600"],"sources":["../../src/Accordion/AccordionItem.tsx"],"sourcesContent":["import React from 'react';\nimport { COLORS, ComponentS } from '..';\nimport { SystemIcons } from '../icons';\nimport { AccordionItemProps } from './AccordionMenu';\nimport { AccordionItemContainer, ItemBodyContainer, ItemHeaderContainer } from './styles';\nimport { defaultOnMouseDownHandler } from '../common';\n\ninterface AccordionItemPropsInner extends AccordionItemProps {\n onSelect: (id: string) => void;\n isActive: boolean;\n isLast: boolean;\n padding?: string;\n}\n\nconst AccordionItem: React.FunctionComponent<AccordionItemPropsInner> = (props: AccordionItemPropsInner) => {\n const { id, onSelect, isActive, title, icon, disabled, isLast, padding, children, className, ...rest } = props;\n\n const cls = (isActive ? 'active' : '') + (disabled ? ' disabled' : '') + (className ? ` ${className}` : '');\n\n return (\n <AccordionItemContainer id={id} displaySeparator={!isActive && !isLast}>\n <ItemHeaderContainer\n role=\"button\"\n aria-expanded={isActive}\n id={`itemHeaderFor_${id}`}\n aria-controls={`itemContentFor_${id}`}\n tabIndex={!disabled ? 0 : undefined}\n onClick={() => {\n if (!disabled) {\n onSelect(id);\n }\n }}\n onKeyDown={(e: any) => {\n if (e.key === 'Enter') onSelect(id);\n }}\n onMouseDown={defaultOnMouseDownHandler}\n className={cls}\n {...rest}>\n {icon && React.cloneElement(icon as React.ReactElement, { size: '24px' })}\n <span>{title}</span>\n <div aria-hidden=\"true\">\n {isActive ? <SystemIcons.ChevronUp color={COLORS.neutral_800} size=\"20px\" /> : <SystemIcons.ChevronDown color={COLORS.neutral_600} size=\"20px\" />}\n </div>\n </ItemHeaderContainer>\n {isActive && (\n <ItemBodyContainer id={`itemContentFor_${id}`} padding={padding}>\n <ComponentS>{children}</ComponentS>\n </ItemBodyContainer>\n )}\n </AccordionItemContainer>\n );\n};\n\nexport default AccordionItem;\n"],"mappings":";;;;;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,MAAM,EAAEC,UAAU,QAAQ,IAAI;AACvC,SAASC,WAAW,QAAQ,UAAU;AAEtC,SAASC,sBAAsB,EAAEC,iBAAiB,EAAEC,mBAAmB,QAAQ,UAAU;AACzF,SAASC,yBAAyB,QAAQ,WAAW;AAAC;AAAA;AAStD,IAAMC,aAA+D,GAAG,SAAlEA,aAA+D,CAAIC,KAA8B,EAAK;EAC1G,IAAQC,EAAE,GAA+FD,KAAK,CAAtGC,EAAE;IAAEC,QAAQ,GAAqFF,KAAK,CAAlGE,QAAQ;IAAEC,QAAQ,GAA2EH,KAAK,CAAxFG,QAAQ;IAAEC,KAAK,GAAoEJ,KAAK,CAA9EI,KAAK;IAAEC,IAAI,GAA8DL,KAAK,CAAvEK,IAAI;IAAEC,QAAQ,GAAoDN,KAAK,CAAjEM,QAAQ;IAAEC,MAAM,GAA4CP,KAAK,CAAvDO,MAAM;IAAEC,OAAO,GAAmCR,KAAK,CAA/CQ,OAAO;IAAEC,QAAQ,GAAyBT,KAAK,CAAtCS,QAAQ;IAAEC,SAAS,GAAcV,KAAK,CAA5BU,SAAS;IAAKC,IAAI,4BAAKX,KAAK;EAE9G,IAAMY,GAAG,GAAG,CAACT,QAAQ,GAAG,QAAQ,GAAG,EAAE,KAAKG,QAAQ,GAAG,WAAW,GAAG,EAAE,CAAC,IAAII,SAAS,cAAOA,SAAS,IAAK,EAAE,CAAC;EAE3G,oBACE,MAAC,sBAAsB;IAAC,EAAE,EAAET,EAAG;IAAC,gBAAgB,EAAE,CAACE,QAAQ,IAAI,CAACI,MAAO;IAAA,wBACrE,MAAC,mBAAmB;MAClB,IAAI,EAAC,QAAQ;MACb,iBAAeJ,QAAS;MACxB,EAAE,0BAAmBF,EAAE,CAAG;MAC1B,0CAAiCA,EAAE,CAAG;MACtC,QAAQ,EAAE,CAACK,QAAQ,GAAG,CAAC,GAAGO,SAAU;MACpC,OAAO,EAAE,mBAAM;QACb,IAAI,CAACP,QAAQ,EAAE;UACbJ,QAAQ,CAACD,EAAE,CAAC;QACd;MACF,CAAE;MACF,SAAS,EAAE,mBAACa,CAAM,EAAK;QACrB,IAAIA,CAAC,CAACC,GAAG,KAAK,OAAO,EAAEb,QAAQ,CAACD,EAAE,CAAC;MACrC,CAAE;MACF,WAAW,EAAEH,yBAA0B;MACvC,SAAS,EAAEc;IAAI,GACXD,IAAI;MAAA,WACPN,IAAI,iBAAId,KAAK,CAACyB,YAAY,CAACX,IAAI,EAAwB;QAAEY,IAAI,EAAE;MAAO,CAAC,CAAC,eACzE;QAAA,UAAOb;MAAK,EAAQ,eACpB;QAAK,eAAY,MAAM;QAAA,UACpBD,QAAQ,gBAAG,KAAC,WAAW,CAAC,SAAS;UAAC,KAAK,EAAEX,MAAM,CAAC0B,WAAY;UAAC,IAAI,EAAC;QAAM,EAAG,gBAAG,KAAC,WAAW,CAAC,WAAW;UAAC,KAAK,EAAE1B,MAAM,CAAC2B,WAAY;UAAC,IAAI,EAAC;QAAM;MAAG,EAC7I;IAAA,GACc,EACrBhB,QAAQ,iBACP,KAAC,iBAAiB;MAAC,EAAE,2BAAoBF,EAAE,CAAG;MAAC,OAAO,EAAEO,OAAQ;MAAA,uBAC9D,KAAC,UAAU;QAAA,UAAEC;MAAQ;IAAc,EAEtC;EAAA,EACsB;AAE7B,CAAC;AAAC;EA3CAP,QAAQ;EACRC,QAAQ;EACRI,MAAM;EACNC,OAAO;AAAA;AA0CT,eAAeT,aAAa"}
1
+ {"version":3,"file":"AccordionItem.js","names":["React","Size","SystemIcons","AccordionItemContainer","ItemBodyContainer","ItemHeaderContainer","defaultOnMouseDownHandler","AccordionItem","props","id","onSelect","isActive","title","icon","disabled","isLast","padding","children","className","size","Medium","rest","cls","undefined","e","key"],"sources":["../../src/Accordion/AccordionItem.tsx"],"sourcesContent":["import React from 'react';\nimport {COLORS, ComponentS, Size} from '..';\nimport {SystemIcons} from '../icons';\nimport {AccordionItemProps} from './AccordionMenu';\nimport {AccordionItemContainer, ItemBodyContainer, ItemHeaderContainer} from './styles';\nimport {defaultOnMouseDownHandler} from '../common';\n\ninterface AccordionItemPropsInner extends AccordionItemProps {\n onSelect: (id: string) => void;\n isActive: boolean;\n isLast: boolean;\n padding?: string;\n size?: Size.Small | Size.Medium | Size.Large;\n}\n\nconst AccordionItem: React.FunctionComponent<AccordionItemPropsInner> = (props: AccordionItemPropsInner) => {\n const {\n id,\n onSelect,\n isActive,\n title,\n icon,\n disabled,\n isLast,\n padding,\n children,\n className,\n size = Size.Medium,\n ...rest\n } = props;\n\n const cls = (isActive ? 'active' : '') + (disabled ? ' disabled' : '') + (className ? ` ${className}` : '') + ` ${size}`;\n\n return (\n <AccordionItemContainer id={id}>\n <ItemHeaderContainer\n role=\"button\"\n aria-expanded={isActive}\n id={`itemHeaderFor_${id}`}\n aria-controls={`itemContentFor_${id}`}\n tabIndex={!disabled ? 0 : undefined}\n onClick={() => {\n if (!disabled) {\n onSelect(id);\n }\n }}\n onKeyDown={(e: any) => {\n if (e.key === 'Enter') onSelect(id);\n }}\n onMouseDown={defaultOnMouseDownHandler}\n className={cls}\n {...rest}>\n {icon}\n <span>{title}</span>\n <div aria-hidden=\"true\">\n {\n isActive && <SystemIcons.ChevronUp/>\n }\n {\n !isActive && <SystemIcons.ChevronDown/>\n }\n </div>\n </ItemHeaderContainer>\n {isActive && (\n <ItemBodyContainer id={`itemContentFor_${id}`} padding={padding}>\n {children}\n </ItemBodyContainer>\n )\n }\n </AccordionItemContainer>\n );\n};\n\nexport default AccordionItem;\n"],"mappings":";;;;;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAA4BC,IAAI,QAAO,IAAI;AAC3C,SAAQC,WAAW,QAAO,UAAU;AAEpC,SAAQC,sBAAsB,EAAEC,iBAAiB,EAAEC,mBAAmB,QAAO,UAAU;AACvF,SAAQC,yBAAyB,QAAO,WAAW;AAAC;AAAA;AAUpD,IAAMC,aAA+D,GAAG,SAAlEA,aAA+D,CAAIC,KAA8B,EAAK;EAC1G,IACEC,EAAE,GAYAD,KAAK,CAZPC,EAAE;IACFC,QAAQ,GAWNF,KAAK,CAXPE,QAAQ;IACRC,QAAQ,GAUNH,KAAK,CAVPG,QAAQ;IACRC,KAAK,GASHJ,KAAK,CATPI,KAAK;IACLC,IAAI,GAQFL,KAAK,CARPK,IAAI;IACJC,QAAQ,GAONN,KAAK,CAPPM,QAAQ;IACRC,MAAM,GAMJP,KAAK,CANPO,MAAM;IACNC,OAAO,GAKLR,KAAK,CALPQ,OAAO;IACPC,QAAQ,GAINT,KAAK,CAJPS,QAAQ;IACRC,SAAS,GAGPV,KAAK,CAHPU,SAAS;IAAA,cAGPV,KAAK,CAFPW,IAAI;IAAJA,IAAI,4BAAGlB,IAAI,CAACmB,MAAM;IACfC,IAAI,4BACLb,KAAK;EAET,IAAMc,GAAG,GAAG,CAACX,QAAQ,GAAG,QAAQ,GAAG,EAAE,KAAKG,QAAQ,GAAG,WAAW,GAAG,EAAE,CAAC,IAAII,SAAS,cAAOA,SAAS,IAAK,EAAE,CAAC,cAAOC,IAAI,CAAE;EAExH,oBACE,MAAC,sBAAsB;IAAC,EAAE,EAAEV,EAAG;IAAA,wBAC7B,MAAC,mBAAmB;MAClB,IAAI,EAAC,QAAQ;MACb,iBAAeE,QAAS;MACxB,EAAE,0BAAmBF,EAAE,CAAG;MAC1B,0CAAiCA,EAAE,CAAG;MACtC,QAAQ,EAAE,CAACK,QAAQ,GAAG,CAAC,GAAGS,SAAU;MACpC,OAAO,EAAE,mBAAM;QACb,IAAI,CAACT,QAAQ,EAAE;UACbJ,QAAQ,CAACD,EAAE,CAAC;QACd;MACF,CAAE;MACF,SAAS,EAAE,mBAACe,CAAM,EAAK;QACrB,IAAIA,CAAC,CAACC,GAAG,KAAK,OAAO,EAAEf,QAAQ,CAACD,EAAE,CAAC;MACrC,CAAE;MACF,WAAW,EAAEH,yBAA0B;MACvC,SAAS,EAAEgB;IAAI,GACXD,IAAI;MAAA,WACPR,IAAI,eACL;QAAA,UAAOD;MAAK,EAAQ,eACpB;QAAK,eAAY,MAAM;QAAA,WAEnBD,QAAQ,iBAAI,KAAC,WAAW,CAAC,SAAS,KAAE,EAGpC,CAACA,QAAQ,iBAAI,KAAC,WAAW,CAAC,WAAW,KAAE;MAAA,EAErC;IAAA,GACc,EACrBA,QAAQ,iBACP,KAAC,iBAAiB;MAAC,EAAE,2BAAoBF,EAAE,CAAG;MAAC,OAAO,EAAEO,OAAQ;MAAA,UAC7DC;IAAQ,EAEZ;EAAA,EAEsB;AAE7B,CAAC;AAAC;EA/DAP,QAAQ;EACRC,QAAQ;EACRI,MAAM;EACNC,OAAO;AAAA;AA8DT,eAAeT,aAAa"}
package/dist/Accordion/AccordionMenu.cjs CHANGED
@@ -14,8 +14,9 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
14
14
  var React = _interopRequireWildcard(require("react"));
15
15
  var _AccordionItem = _interopRequireDefault(require("./AccordionItem"));
16
16
  var _styles = require("./styles");
17
+ var _types = require("../types");
17
18
  var _jsxRuntime = require("react/jsx-runtime");
18
- var _excluded = ["items", "selectedItems", "setSelectedItems", "onSelect", "multipleActive", "padding"],
19
+ var _excluded = ["items", "selectedItems", "setSelectedItems", "onSelect", "multipleActive", "padding", "size"],
19
20
  _excluded2 = ["id", "disabled", "title", "icon", "children"];
20
21
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
21
22
  function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -28,6 +29,8 @@ var AccordionMenu = function AccordionMenu(props) {
28
29
  onSelect = props.onSelect,
29
30
  multipleActive = props.multipleActive,
30
31
  padding = props.padding,
32
+ _props$size = props.size,
33
+ size = _props$size === void 0 ? _types.Size.Medium : _props$size,
31
34
  rest = (0, _objectWithoutProperties2.default)(props, _excluded);
32
35
  var _React$useState = React.useState([]),
33
36
  _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
@@ -73,7 +76,8 @@ var AccordionMenu = function AccordionMenu(props) {
73
76
  }),
74
77
  isLast: index === items.length - 1,
75
78
  onSelect: onSelected,
76
- padding: padding
79
+ padding: padding,
80
+ size: size
77
81
  }, rest), {}, {
78
82
  children: children
79
83
  }), id);
package/dist/Accordion/AccordionMenu.cjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"AccordionMenu.cjs","names":["AccordionMenu","props","items","selectedItems","setSelectedItems","onSelect","multipleActive","padding","rest","React","useState","builtinSelectedItems","builtinSetSelectedItems","getCollection","getUpdateFunction","onSelected","id","collection","updateFunc","isActive","find","x","filter","map","index","disabled","title","icon","children","length"],"sources":["../../src/Accordion/AccordionMenu.tsx"],"sourcesContent":["import * as React from 'react';\nimport AccordionItem from './AccordionItem';\nimport { AccordionMenuWrapper } from './styles';\n\nexport interface AccordionProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onSelect'>{\n items: AccordionItemProps[];\n selectedItems?: string[];\n setSelectedItems?: (a: string[]) => void;\n onSelect?: (id: string) => void;\n multipleActive?: boolean;\n padding?: string;\n}\n\nexport interface AccordionItemProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'id' | 'aria-expanded' | 'onSelect' | 'tabIndex' | 'onKeyDown' | 'onClick' | 'onMouseDown'> {\n id: string;\n disabled?: boolean;\n title: string;\n icon?: React.ReactNode;\n children: React.ReactNode;\n}\n\nconst AccordionMenu: React.FunctionComponent<AccordionProps> = (props: AccordionProps) => {\n const { items, selectedItems, setSelectedItems, onSelect, multipleActive, padding, ...rest } = props;\n const [builtinSelectedItems, builtinSetSelectedItems] = React.useState<string[]>([]);\n\n const getCollection = () => {\n return selectedItems ? selectedItems : builtinSelectedItems;\n };\n\n const getUpdateFunction = () => {\n return setSelectedItems ? setSelectedItems : builtinSetSelectedItems;\n };\n\n const onSelected = (id: string) => {\n const collection = getCollection();\n const updateFunc = getUpdateFunction();\n\n const isActive = !!collection.find((x) => x == id);\n if (multipleActive) {\n if (isActive) updateFunc(collection.filter((x) => x != id));\n else updateFunc([...collection, id]);\n } else updateFunc(isActive ? [] : [id]);\n\n onSelect && onSelect(id);\n };\n\n return (\n <AccordionMenuWrapper {...rest}>\n {items.map(({id, disabled, title, icon, children, ...rest}, index) => (\n <AccordionItem\n key={id}\n id={id}\n disabled={disabled}\n title={title}\n aria-expanded={!!getCollection().find((x) => x == id)}\n icon={icon}\n isActive={!!getCollection().find((x) => x == id)}\n isLast={index === items.length - 1}\n onSelect={onSelected}\n padding={padding}\n {...rest}>\n {children}\n </AccordionItem>\n ))}\n </AccordionMenuWrapper>\n );\n};\n\nexport default AccordionMenu;\n"],"mappings":";;;;;;;;;;;;;AAAA;AACA;AACA;AAAgD;AAAA;EAAA;AAAA;AAAA;AAAA;AAAA;AAmBhD,IAAMA,aAAsD,GAAG,SAAzDA,aAAsD,CAAIC,KAAqB,EAAK;EACxF,IAAQC,KAAK,GAAkFD,KAAK,CAA5FC,KAAK;IAAEC,aAAa,GAAmEF,KAAK,CAArFE,aAAa;IAAEC,gBAAgB,GAAiDH,KAAK,CAAtEG,gBAAgB;IAAEC,QAAQ,GAAuCJ,KAAK,CAApDI,QAAQ;IAAEC,cAAc,GAAuBL,KAAK,CAA1CK,cAAc;IAAEC,OAAO,GAAcN,KAAK,CAA1BM,OAAO;IAAKC,IAAI,0CAAKP,KAAK;EACpG,sBAAwDQ,KAAK,CAACC,QAAQ,CAAW,EAAE,CAAC;IAAA;IAA7EC,oBAAoB;IAAEC,uBAAuB;EAEpD,IAAMC,aAAa,GAAG,SAAhBA,aAAa,GAAS;IAC1B,OAAOV,aAAa,GAAGA,aAAa,GAAGQ,oBAAoB;EAC7D,CAAC;EAED,IAAMG,iBAAiB,GAAG,SAApBA,iBAAiB,GAAS;IAC9B,OAAOV,gBAAgB,GAAGA,gBAAgB,GAAGQ,uBAAuB;EACtE,CAAC;EAED,IAAMG,UAAU,GAAG,SAAbA,UAAU,CAAIC,EAAU,EAAK;IACjC,IAAMC,UAAU,GAAGJ,aAAa,EAAE;IAClC,IAAMK,UAAU,GAAGJ,iBAAiB,EAAE;IAEtC,IAAMK,QAAQ,GAAG,CAAC,CAACF,UAAU,CAACG,IAAI,CAAC,UAACC,CAAC;MAAA,OAAKA,CAAC,IAAIL,EAAE;IAAA,EAAC;IAClD,IAAIV,cAAc,EAAE;MAClB,IAAIa,QAAQ,EAAED,UAAU,CAACD,UAAU,CAACK,MAAM,CAAC,UAACD,CAAC;QAAA,OAAKA,CAAC,IAAIL,EAAE;MAAA,EAAC,CAAC,CAAC,KACvDE,UAAU,4CAAKD,UAAU,IAAED,EAAE,GAAE;IACtC,CAAC,MAAME,UAAU,CAACC,QAAQ,GAAG,EAAE,GAAG,CAACH,EAAE,CAAC,CAAC;IAEvCX,QAAQ,IAAIA,QAAQ,CAACW,EAAE,CAAC;EAC1B,CAAC;EAED,oBACE,qBAAC,4BAAoB,kCAAKR,IAAI;IAAA,UAC3BN,KAAK,CAACqB,GAAG,CAAC,gBAAiDC,KAAK;MAAA,IAApDR,EAAE,QAAFA,EAAE;QAAES,QAAQ,QAARA,QAAQ;QAAEC,KAAK,QAALA,KAAK;QAAEC,IAAI,QAAJA,IAAI;QAAEC,QAAQ,QAARA,QAAQ;QAAKpB,IAAI;MAAA,oBACvD,qBAAC,sBAAa;QAEZ,EAAE,EAAEQ,EAAG;QACP,QAAQ,EAAES,QAAS;QACnB,KAAK,EAAEC,KAAM;QACb,iBAAe,CAAC,CAACb,aAAa,EAAE,CAACO,IAAI,CAAC,UAACC,CAAC;UAAA,OAAKA,CAAC,IAAIL,EAAE;QAAA,EAAE;QACtD,IAAI,EAAEW,IAAK;QACX,QAAQ,EAAE,CAAC,CAACd,aAAa,EAAE,CAACO,IAAI,CAAC,UAACC,CAAC;UAAA,OAAKA,CAAC,IAAIL,EAAE;QAAA,EAAE;QACjD,MAAM,EAAEQ,KAAK,KAAKtB,KAAK,CAAC2B,MAAM,GAAG,CAAE;QACnC,QAAQ,EAAEd,UAAW;QACrB,OAAO,EAAER;MAAQ,GACbC,IAAI;QAAA,UACPoB;MAAQ,IAXJZ,EAAE,CAYO;IAAA,CACjB;EAAC,GACmB;AAE3B,CAAC;AAAC;EA7DAd,KAAK;IASLc,EAAE;IACFS,QAAQ;IACRC,KAAK;IACLC,IAAI;IACJC,QAAQ;EAAA;EAZRzB,aAAa;EACbC,gBAAgB;EAChBC,QAAQ;EACRC,cAAc;EACdC,OAAO;AAAA;AAAA,eA0DMP,aAAa;AAAA"}
1
+ {"version":3,"file":"AccordionMenu.cjs","names":["AccordionMenu","props","items","selectedItems","setSelectedItems","onSelect","multipleActive","padding","size","Size","Medium","rest","React","useState","builtinSelectedItems","builtinSetSelectedItems","getCollection","getUpdateFunction","onSelected","id","collection","updateFunc","isActive","find","x","filter","map","index","disabled","title","icon","children","length"],"sources":["../../src/Accordion/AccordionMenu.tsx"],"sourcesContent":["import * as React from 'react';\nimport AccordionItem from './AccordionItem';\nimport { AccordionMenuWrapper } from './styles';\nimport {Size} from \"../types\";\n\nexport interface AccordionProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onSelect'>{\n items: AccordionItemProps[];\n selectedItems?: string[];\n setSelectedItems?: (a: string[]) => void;\n onSelect?: (id: string) => void;\n multipleActive?: boolean;\n padding?: string;\n size?: Size.Small | Size.Medium | Size.Large;\n}\n\nexport interface AccordionItemProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'id' | 'aria-expanded' | 'onSelect' | 'tabIndex' | 'onKeyDown' | 'onClick' | 'onMouseDown'> {\n id: string;\n disabled?: boolean;\n title: string;\n icon?: React.ReactNode;\n\n size?: Size.Small | Size.Medium | Size.Large;\n children: React.ReactNode;\n}\n\nconst AccordionMenu: React.FunctionComponent<AccordionProps> = (props: AccordionProps) => {\n const { items, selectedItems, setSelectedItems, onSelect, multipleActive, padding, size = Size.Medium, ...rest } = props;\n const [builtinSelectedItems, builtinSetSelectedItems] = React.useState<string[]>([]);\n\n const getCollection = () => {\n return selectedItems ? selectedItems : builtinSelectedItems;\n };\n\n const getUpdateFunction = () => {\n return setSelectedItems ? setSelectedItems : builtinSetSelectedItems;\n };\n\n const onSelected = (id: string) => {\n const collection = getCollection();\n const updateFunc = getUpdateFunction();\n\n const isActive = !!collection.find((x) => x == id);\n if (multipleActive) {\n if (isActive) updateFunc(collection.filter((x) => x != id));\n else updateFunc([...collection, id]);\n } else updateFunc(isActive ? [] : [id]);\n\n onSelect && onSelect(id);\n };\n\n return (\n <AccordionMenuWrapper {...rest}>\n {items.map(({id, disabled, title, icon, children, ...rest}, index) => (\n <AccordionItem\n key={id}\n id={id}\n disabled={disabled}\n title={title}\n aria-expanded={!!getCollection().find((x) => x == id)}\n icon={icon}\n isActive={!!getCollection().find((x) => x == id)}\n isLast={index === items.length - 1}\n onSelect={onSelected}\n padding={padding}\n size={size}\n {...rest}>\n {children}\n </AccordionItem>\n ))}\n </AccordionMenuWrapper>\n );\n};\n\nexport default AccordionMenu;\n"],"mappings":";;;;;;;;;;;;;AAAA;AACA;AACA;AACA;AAA8B;AAAA;EAAA;AAAA;AAAA;AAAA;AAAA;AAsB9B,IAAMA,aAAsD,GAAG,SAAzDA,aAAsD,CAAIC,KAAqB,EAAK;EACxF,IAAQC,KAAK,GAAsGD,KAAK,CAAhHC,KAAK;IAAEC,aAAa,GAAuFF,KAAK,CAAzGE,aAAa;IAAEC,gBAAgB,GAAqEH,KAAK,CAA1FG,gBAAgB;IAAEC,QAAQ,GAA2DJ,KAAK,CAAxEI,QAAQ;IAAEC,cAAc,GAA2CL,KAAK,CAA9DK,cAAc;IAAEC,OAAO,GAAkCN,KAAK,CAA9CM,OAAO;IAAA,cAAkCN,KAAK,CAArCO,IAAI;IAAJA,IAAI,4BAAGC,WAAI,CAACC,MAAM;IAAKC,IAAI,0CAAKV,KAAK;EACxH,sBAAwDW,KAAK,CAACC,QAAQ,CAAW,EAAE,CAAC;IAAA;IAA7EC,oBAAoB;IAAEC,uBAAuB;EAEpD,IAAMC,aAAa,GAAG,SAAhBA,aAAa,GAAS;IAC1B,OAAOb,aAAa,GAAGA,aAAa,GAAGW,oBAAoB;EAC7D,CAAC;EAED,IAAMG,iBAAiB,GAAG,SAApBA,iBAAiB,GAAS;IAC9B,OAAOb,gBAAgB,GAAGA,gBAAgB,GAAGW,uBAAuB;EACtE,CAAC;EAED,IAAMG,UAAU,GAAG,SAAbA,UAAU,CAAIC,EAAU,EAAK;IACjC,IAAMC,UAAU,GAAGJ,aAAa,EAAE;IAClC,IAAMK,UAAU,GAAGJ,iBAAiB,EAAE;IAEtC,IAAMK,QAAQ,GAAG,CAAC,CAACF,UAAU,CAACG,IAAI,CAAC,UAACC,CAAC;MAAA,OAAKA,CAAC,IAAIL,EAAE;IAAA,EAAC;IAClD,IAAIb,cAAc,EAAE;MAClB,IAAIgB,QAAQ,EAAED,UAAU,CAACD,UAAU,CAACK,MAAM,CAAC,UAACD,CAAC;QAAA,OAAKA,CAAC,IAAIL,EAAE;MAAA,EAAC,CAAC,CAAC,KACvDE,UAAU,4CAAKD,UAAU,IAAED,EAAE,GAAE;IACtC,CAAC,MAAME,UAAU,CAACC,QAAQ,GAAG,EAAE,GAAG,CAACH,EAAE,CAAC,CAAC;IAEvCd,QAAQ,IAAIA,QAAQ,CAACc,EAAE,CAAC;EAC1B,CAAC;EAED,oBACE,qBAAC,4BAAoB,kCAAKR,IAAI;IAAA,UAC3BT,KAAK,CAACwB,GAAG,CAAC,gBAAiDC,KAAK;MAAA,IAApDR,EAAE,QAAFA,EAAE;QAAES,QAAQ,QAARA,QAAQ;QAAEC,KAAK,QAALA,KAAK;QAAEC,IAAI,QAAJA,IAAI;QAAEC,QAAQ,QAARA,QAAQ;QAAKpB,IAAI;MAAA,oBACvD,qBAAC,sBAAa;QAEZ,EAAE,EAAEQ,EAAG;QACP,QAAQ,EAAES,QAAS;QACnB,KAAK,EAAEC,KAAM;QACb,iBAAe,CAAC,CAACb,aAAa,EAAE,CAACO,IAAI,CAAC,UAACC,CAAC;UAAA,OAAKA,CAAC,IAAIL,EAAE;QAAA,EAAE;QACtD,IAAI,EAAEW,IAAK;QACX,QAAQ,EAAE,CAAC,CAACd,aAAa,EAAE,CAACO,IAAI,CAAC,UAACC,CAAC;UAAA,OAAKA,CAAC,IAAIL,EAAE;QAAA,EAAE;QACjD,MAAM,EAAEQ,KAAK,KAAKzB,KAAK,CAAC8B,MAAM,GAAG,CAAE;QACnC,QAAQ,EAAEd,UAAW;QACrB,OAAO,EAAEX,OAAQ;QACjB,IAAI,EAAEC;MAAK,GACPG,IAAI;QAAA,UACPoB;MAAQ,IAZJZ,EAAE,CAaO;IAAA,CACjB;EAAC,GACmB;AAE3B,CAAC;AAAC;EAjEAjB,KAAK;IAULiB,EAAE;IACFS,QAAQ;IACRC,KAAK;IACLC,IAAI;IAGJC,QAAQ;EAAA;EAfR5B,aAAa;EACbC,gBAAgB;EAChBC,QAAQ;EACRC,cAAc;EACdC,OAAO;AAAA;AAAA,eA8DMP,aAAa;AAAA"}
package/dist/Accordion/AccordionMenu.d.ts CHANGED
@@ -1,4 +1,5 @@
1
1
  import * as React from 'react';
2
+ import { Size } from "../types";
2
3
  export interface AccordionProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onSelect'> {
3
4
  items: AccordionItemProps[];
4
5
  selectedItems?: string[];
@@ -6,12 +7,14 @@ export interface AccordionProps extends Omit<React.HTMLAttributes<HTMLDivElement
6
7
  onSelect?: (id: string) => void;
7
8
  multipleActive?: boolean;
8
9
  padding?: string;
10
+ size?: Size.Small | Size.Medium | Size.Large;
9
11
  }
10
12
  export interface AccordionItemProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'id' | 'aria-expanded' | 'onSelect' | 'tabIndex' | 'onKeyDown' | 'onClick' | 'onMouseDown'> {
11
13
  id: string;
12
14
  disabled?: boolean;
13
15
  title: string;
14
16
  icon?: React.ReactNode;
17
+ size?: Size.Small | Size.Medium | Size.Large;
15
18
  children: React.ReactNode;
16
19
  }
17
20
  declare const AccordionMenu: React.FunctionComponent<AccordionProps>;
package/dist/Accordion/AccordionMenu.js CHANGED
@@ -3,13 +3,14 @@ import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
3
3
  import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
4
4
  import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
5
5
  import _pt from "prop-types";
6
- var _excluded = ["items", "selectedItems", "setSelectedItems", "onSelect", "multipleActive", "padding"],
6
+ var _excluded = ["items", "selectedItems", "setSelectedItems", "onSelect", "multipleActive", "padding", "size"],
7
7
  _excluded2 = ["id", "disabled", "title", "icon", "children"];
8
8
  function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
9
9
  function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
10
10
  import * as React from 'react';
11
11
  import AccordionItem from './AccordionItem';
12
12
  import { AccordionMenuWrapper } from './styles';
13
+ import { Size } from "../types";
13
14
  import { jsx as _jsx } from "react/jsx-runtime";
14
15
  var AccordionMenu = function AccordionMenu(props) {
15
16
  var items = props.items,
@@ -18,6 +19,8 @@ var AccordionMenu = function AccordionMenu(props) {
18
19
  onSelect = props.onSelect,
19
20
  multipleActive = props.multipleActive,
20
21
  padding = props.padding,
22
+ _props$size = props.size,
23
+ size = _props$size === void 0 ? Size.Medium : _props$size,
21
24
  rest = _objectWithoutProperties(props, _excluded);
22
25
  var _React$useState = React.useState([]),
23
26
  _React$useState2 = _slicedToArray(_React$useState, 2),
@@ -63,7 +66,8 @@ var AccordionMenu = function AccordionMenu(props) {
63
66
  }),
64
67
  isLast: index === items.length - 1,
65
68
  onSelect: onSelected,
66
- padding: padding
69
+ padding: padding,
70
+ size: size
67
71
  }, rest), {}, {
68
72
  children: children
69
73
  }), id);
package/dist/Accordion/AccordionMenu.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"AccordionMenu.js","names":["React","AccordionItem","AccordionMenuWrapper","AccordionMenu","props","items","selectedItems","setSelectedItems","onSelect","multipleActive","padding","rest","useState","builtinSelectedItems","builtinSetSelectedItems","getCollection","getUpdateFunction","onSelected","id","collection","updateFunc","isActive","find","x","filter","map","index","disabled","title","icon","children","length"],"sources":["../../src/Accordion/AccordionMenu.tsx"],"sourcesContent":["import * as React from 'react';\nimport AccordionItem from './AccordionItem';\nimport { AccordionMenuWrapper } from './styles';\n\nexport interface AccordionProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onSelect'>{\n items: AccordionItemProps[];\n selectedItems?: string[];\n setSelectedItems?: (a: string[]) => void;\n onSelect?: (id: string) => void;\n multipleActive?: boolean;\n padding?: string;\n}\n\nexport interface AccordionItemProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'id' | 'aria-expanded' | 'onSelect' | 'tabIndex' | 'onKeyDown' | 'onClick' | 'onMouseDown'> {\n id: string;\n disabled?: boolean;\n title: string;\n icon?: React.ReactNode;\n children: React.ReactNode;\n}\n\nconst AccordionMenu: React.FunctionComponent<AccordionProps> = (props: AccordionProps) => {\n const { items, selectedItems, setSelectedItems, onSelect, multipleActive, padding, ...rest } = props;\n const [builtinSelectedItems, builtinSetSelectedItems] = React.useState<string[]>([]);\n\n const getCollection = () => {\n return selectedItems ? selectedItems : builtinSelectedItems;\n };\n\n const getUpdateFunction = () => {\n return setSelectedItems ? setSelectedItems : builtinSetSelectedItems;\n };\n\n const onSelected = (id: string) => {\n const collection = getCollection();\n const updateFunc = getUpdateFunction();\n\n const isActive = !!collection.find((x) => x == id);\n if (multipleActive) {\n if (isActive) updateFunc(collection.filter((x) => x != id));\n else updateFunc([...collection, id]);\n } else updateFunc(isActive ? [] : [id]);\n\n onSelect && onSelect(id);\n };\n\n return (\n <AccordionMenuWrapper {...rest}>\n {items.map(({id, disabled, title, icon, children, ...rest}, index) => (\n <AccordionItem\n key={id}\n id={id}\n disabled={disabled}\n title={title}\n aria-expanded={!!getCollection().find((x) => x == id)}\n icon={icon}\n isActive={!!getCollection().find((x) => x == id)}\n isLast={index === items.length - 1}\n onSelect={onSelected}\n padding={padding}\n {...rest}>\n {children}\n </AccordionItem>\n ))}\n </AccordionMenuWrapper>\n );\n};\n\nexport default AccordionMenu;\n"],"mappings":"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"}
1
+ {"version":3,"file":"AccordionMenu.js","names":["React","AccordionItem","AccordionMenuWrapper","Size","AccordionMenu","props","items","selectedItems","setSelectedItems","onSelect","multipleActive","padding","size","Medium","rest","useState","builtinSelectedItems","builtinSetSelectedItems","getCollection","getUpdateFunction","onSelected","id","collection","updateFunc","isActive","find","x","filter","map","index","disabled","title","icon","children","length"],"sources":["../../src/Accordion/AccordionMenu.tsx"],"sourcesContent":["import * as React from 'react';\nimport AccordionItem from './AccordionItem';\nimport { AccordionMenuWrapper } from './styles';\nimport {Size} from \"../types\";\n\nexport interface AccordionProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onSelect'>{\n items: AccordionItemProps[];\n selectedItems?: string[];\n setSelectedItems?: (a: string[]) => void;\n onSelect?: (id: string) => void;\n multipleActive?: boolean;\n padding?: string;\n size?: Size.Small | Size.Medium | Size.Large;\n}\n\nexport interface AccordionItemProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'id' | 'aria-expanded' | 'onSelect' | 'tabIndex' | 'onKeyDown' | 'onClick' | 'onMouseDown'> {\n id: string;\n disabled?: boolean;\n title: string;\n icon?: React.ReactNode;\n\n size?: Size.Small | Size.Medium | Size.Large;\n children: React.ReactNode;\n}\n\nconst AccordionMenu: React.FunctionComponent<AccordionProps> = (props: AccordionProps) => {\n const { items, selectedItems, setSelectedItems, onSelect, multipleActive, padding, size = Size.Medium, ...rest } = props;\n const [builtinSelectedItems, builtinSetSelectedItems] = React.useState<string[]>([]);\n\n const getCollection = () => {\n return selectedItems ? selectedItems : builtinSelectedItems;\n };\n\n const getUpdateFunction = () => {\n return setSelectedItems ? setSelectedItems : builtinSetSelectedItems;\n };\n\n const onSelected = (id: string) => {\n const collection = getCollection();\n const updateFunc = getUpdateFunction();\n\n const isActive = !!collection.find((x) => x == id);\n if (multipleActive) {\n if (isActive) updateFunc(collection.filter((x) => x != id));\n else updateFunc([...collection, id]);\n } else updateFunc(isActive ? [] : [id]);\n\n onSelect && onSelect(id);\n };\n\n return (\n <AccordionMenuWrapper {...rest}>\n {items.map(({id, disabled, title, icon, children, ...rest}, index) => (\n <AccordionItem\n key={id}\n id={id}\n disabled={disabled}\n title={title}\n aria-expanded={!!getCollection().find((x) => x == id)}\n icon={icon}\n isActive={!!getCollection().find((x) => x == id)}\n isLast={index === items.length - 1}\n onSelect={onSelected}\n padding={padding}\n size={size}\n {...rest}>\n {children}\n </AccordionItem>\n ))}\n </AccordionMenuWrapper>\n );\n};\n\nexport default AccordionMenu;\n"],"mappings":"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"}
package/dist/Accordion/styles.cjs CHANGED
@@ -4,24 +4,20 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
4
4
  Object.defineProperty(exports, "__esModule", {
5
5
  value: true
6
6
  });
7
- exports.ItemHeaderContainer = exports.ItemBodyContainer = exports.HeaderIconContainer = exports.AccordionMenuWrapper = exports.AccordionItemContainer = void 0;
7
+ exports.ItemHeaderContainer = exports.ItemBodyContainer = exports.AccordionMenuWrapper = exports.AccordionItemContainer = void 0;
8
8
  var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
9
9
  var _styledComponents = _interopRequireDefault(require("styled-components"));
10
10
  var _styles = require("../styles");
11
11
  var _zIndexes = require("../styles/z-indexes");
12
- var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
12
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4;
13
13
  var AccordionMenuWrapper = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n min-width: 320px;\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n"])));
14
14
  exports.AccordionMenuWrapper = AccordionMenuWrapper;
15
- var AccordionItemContainer = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n width: 100%;\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n border-bottom: ", ";\n"])), function (props) {
16
- return props.displaySeparator ? "1px solid ".concat(_styles.COLORS.neutral_100) : '';
17
- });
18
- exports.AccordionItemContainer = AccordionItemContainer;
19
- var ItemHeaderContainer = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n position: relative;\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 12px 16px 11px 16px;\n cursor: pointer;\n\n ", "\n\n div:last-child {\n margin-left: auto;\n }\n outline: none;\n\n :focus:not(:active) {\n ", "\n }\n\n :hover {\n background: ", ";\n color: ", ";\n z-index: ", ";\n }\n\n :active {\n color: ", ";\n background: ", ";\n z-index: ", ";\n }\n\n &.active {\n color: ", ";\n }\n\n &.disabled {\n background: ", "!important;\n color: ", ";\n cursor: not-allowed;\n pointer-events: none;\n svg {\n color: ", "!important;\n }\n }\n"])), (0, _styles.ComponentMStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.neutral_600), _styles.focusStyles, _styles.COLORS.primary_20, _styles.COLORS.primary_700, _zIndexes.Z_INDEXES.hover, _styles.COLORS.primary_800, _styles.COLORS.primary_100, _zIndexes.Z_INDEXES.active, _styles.COLORS.neutral_800, _styles.COLORS.white, _styles.COLORS.neutral_300, _styles.COLORS.neutral_300);
15
+ var ItemHeaderContainer = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n position: relative;\n display: flex;\n align-items: center;\n gap: 8px;\n cursor: pointer;\n outline: none;\n box-sizing: border-box;\n\n ", "\n\n div:last-child {\n margin-left: auto;\n }\n\n padding: 0 16px;\n min-height: 48px;\n \n svg {\n width: 20px;\n height: 20px;\n }\n \n &.medium {\n ", "\n padding: 0 24px;\n min-height: 56px;\n\n svg {\n width: 24px;\n height: 24px;\n }\n }\n\n &.large {\n ", "\n padding: 0 32px;\n min-height: 64px;\n svg {\n width: 24px;\n height: 24px;\n }\n }\n\n :focus:not(:active) {\n ", "\n }\n\n :hover {\n background: ", ";\n color: ", ";\n z-index: ", ";\n }\n\n :active {\n color: ", ";\n background: ", ";\n z-index: ", ";\n }\n\n &.active {\n color: ", ";\n }\n\n &.disabled {\n background: ", "!important;\n color: ", ";\n cursor: not-allowed;\n pointer-events: none;\n svg {\n color: ", "!important;\n }\n }\n"])), (0, _styles.ComponentSStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.neutral_600), (0, _styles.ComponentMStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.neutral_600), (0, _styles.ComponentLStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.neutral_600), _styles.focusStyles, _styles.COLORS.primary_20, _styles.COLORS.primary_700, _zIndexes.Z_INDEXES.hover, _styles.COLORS.primary_800, _styles.COLORS.primary_100, _zIndexes.Z_INDEXES.active, _styles.COLORS.neutral_800, _styles.COLORS.white, _styles.COLORS.neutral_300, _styles.COLORS.neutral_300);
20
16
  exports.ItemHeaderContainer = ItemHeaderContainer;
21
- var HeaderIconContainer = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n margin-left: auto;\n"])));
22
- exports.HeaderIconContainer = HeaderIconContainer;
23
- var ItemBodyContainer = _styledComponents.default.div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n padding: ", ";\n background: ", ";\n"])), function (props) {
17
+ var AccordionItemContainer = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n width: 100%;\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n \n &:not(:last-child) ", ":not(.active) {\n border-bottom: 1px solid ", ";\n }\n"])), ItemHeaderContainer, _styles.COLORS.neutral_100);
18
+ exports.AccordionItemContainer = AccordionItemContainer;
19
+ var ItemBodyContainer = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n padding: ", ";\n background: ", ";\n \n ", "\n \n .medium & {\n ", "\n }\n \n .large & {\n ", "\n }\n\n"])), function (props) {
24
20
  return props.padding || '12px 16px';
25
- }, _styles.COLORS.white);
21
+ }, _styles.COLORS.white, (0, _styles.ComponentSStyling)(_styles.ComponentTextStyle.Regular, null), (0, _styles.ComponentMStyling)(_styles.ComponentTextStyle.Regular, null), (0, _styles.ComponentLStyling)(_styles.ComponentTextStyle.Regular, null));
26
22
  exports.ItemBodyContainer = ItemBodyContainer;
27
23
  //# sourceMappingURL=styles.cjs.map
package/dist/Accordion/styles.cjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"styles.cjs","names":["AccordionMenuWrapper","styled","div","AccordionItemContainer","props","displaySeparator","COLORS","neutral_100","ItemHeaderContainer","ComponentMStyling","ComponentTextStyle","Regular","neutral_600","focusStyles","primary_20","primary_700","Z_INDEXES","hover","primary_800","primary_100","active","neutral_800","white","neutral_300","HeaderIconContainer","ItemBodyContainer","padding"],"sources":["../../src/Accordion/styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport { COLORS, ComponentMStyling, ComponentTextStyle, focusStyles } from '../styles';\nimport { Z_INDEXES } from '../styles/z-indexes';\n\nexport const AccordionMenuWrapper = styled.div`\n min-width: 320px;\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n`;\n\nexport const AccordionItemContainer = styled.div<{ displaySeparator: boolean }>`\n width: 100%;\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n border-bottom: ${(props) => (props.displaySeparator ? `1px solid ${COLORS.neutral_100}` : '')};\n`;\n\nexport const ItemHeaderContainer = styled.div`\n position: relative;\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 12px 16px 11px 16px;\n cursor: pointer;\n\n ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n\n div:last-child {\n margin-left: auto;\n }\n outline: none;\n\n :focus:not(:active) {\n ${focusStyles}\n }\n\n :hover {\n background: ${COLORS.primary_20};\n color: ${COLORS.primary_700};\n z-index: ${Z_INDEXES.hover};\n }\n\n :active {\n color: ${COLORS.primary_800};\n background: ${COLORS.primary_100};\n z-index: ${Z_INDEXES.active};\n }\n\n &.active {\n color: ${COLORS.neutral_800};\n }\n\n &.disabled {\n background: ${COLORS.white}!important;\n color: ${COLORS.neutral_300};\n cursor: not-allowed;\n pointer-events: none;\n svg {\n color: ${COLORS.neutral_300}!important;\n }\n }\n`;\n\nexport const HeaderIconContainer = styled.div`\n margin-left: auto;\n`;\n\nexport const ItemBodyContainer = styled.div<{ padding?: string }>`\n padding: ${(props) => props.padding || '12px 16px'};\n background: ${COLORS.white};\n`;\n"],"mappings":";;;;;;;;AAAA;AACA;AACA;AAAgD;AAEzC,IAAMA,oBAAoB,GAAGC,yBAAM,CAACC,GAAG,kLAK7C;AAAC;AAEK,IAAMC,sBAAsB,GAAGF,yBAAM,CAACC,GAAG,wMAK7B,UAACE,KAAK;EAAA,OAAMA,KAAK,CAACC,gBAAgB,uBAAgBC,cAAM,CAACC,WAAW,IAAK,EAAE;AAAA,CAAC,CAC9F;AAAC;AAEK,IAAMC,mBAAmB,GAAGP,yBAAM,CAACC,GAAG,2sBAQzC,IAAAO,yBAAiB,EAACC,0BAAkB,CAACC,OAAO,EAAEL,cAAM,CAACM,WAAW,CAAC,EAQ/DC,mBAAW,EAICP,cAAM,CAACQ,UAAU,EACtBR,cAAM,CAACS,WAAW,EAChBC,mBAAS,CAACC,KAAK,EAIjBX,cAAM,CAACY,WAAW,EACbZ,cAAM,CAACa,WAAW,EACrBH,mBAAS,CAACI,MAAM,EAIlBd,cAAM,CAACe,WAAW,EAIbf,cAAM,CAACgB,KAAK,EACjBhB,cAAM,CAACiB,WAAW,EAIhBjB,cAAM,CAACiB,WAAW,CAGhC;AAAC;AAEK,IAAMC,mBAAmB,GAAGvB,yBAAM,CAACC,GAAG,6GAE5C;AAAC;AAEK,IAAMuB,iBAAiB,GAAGxB,yBAAM,CAACC,GAAG,+HAC9B,UAACE,KAAK;EAAA,OAAKA,KAAK,CAACsB,OAAO,IAAI,WAAW;AAAA,GACpCpB,cAAM,CAACgB,KAAK,CAC3B;AAAC"}
1
+ {"version":3,"file":"styles.cjs","names":["AccordionMenuWrapper","styled","div","ItemHeaderContainer","ComponentSStyling","ComponentTextStyle","Regular","COLORS","neutral_600","ComponentMStyling","ComponentLStyling","focusStyles","primary_20","primary_700","Z_INDEXES","hover","primary_800","primary_100","active","neutral_800","white","neutral_300","AccordionItemContainer","neutral_100","ItemBodyContainer","props","padding"],"sources":["../../src/Accordion/styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport {\n COLORS,\n ComponentLStyling,\n ComponentMStyling,\n ComponentSStyling,\n ComponentTextStyle,\n focusStyles\n} from '../styles';\nimport { Z_INDEXES } from '../styles/z-indexes';\n\nexport const AccordionMenuWrapper = styled.div`\n min-width: 320px;\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n`;\n\n\n\nexport const ItemHeaderContainer = styled.div`\n position: relative;\n display: flex;\n align-items: center;\n gap: 8px;\n cursor: pointer;\n outline: none;\n box-sizing: border-box;\n\n ${ComponentSStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n\n div:last-child {\n margin-left: auto;\n }\n\n padding: 0 16px;\n min-height: 48px;\n \n svg {\n width: 20px;\n height: 20px;\n }\n \n &.medium {\n ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n padding: 0 24px;\n min-height: 56px;\n\n svg {\n width: 24px;\n height: 24px;\n }\n }\n\n &.large {\n ${ComponentLStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n padding: 0 32px;\n min-height: 64px;\n svg {\n width: 24px;\n height: 24px;\n }\n }\n\n :focus:not(:active) {\n ${focusStyles}\n }\n\n :hover {\n background: ${COLORS.primary_20};\n color: ${COLORS.primary_700};\n z-index: ${Z_INDEXES.hover};\n }\n\n :active {\n color: ${COLORS.primary_800};\n background: ${COLORS.primary_100};\n z-index: ${Z_INDEXES.active};\n }\n\n &.active {\n color: ${COLORS.neutral_800};\n }\n\n &.disabled {\n background: ${COLORS.white}!important;\n color: ${COLORS.neutral_300};\n cursor: not-allowed;\n pointer-events: none;\n svg {\n color: ${COLORS.neutral_300}!important;\n }\n }\n`;\n\nexport const AccordionItemContainer = styled.div`\n width: 100%;\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n \n &:not(:last-child) ${ItemHeaderContainer}:not(.active) {\n border-bottom: 1px solid ${COLORS.neutral_100};\n }\n`;\n\nexport const ItemBodyContainer = styled.div<{ padding?: string }>`\n padding: ${(props) => props.padding || '12px 16px'};\n background: ${COLORS.white};\n \n ${ComponentSStyling(ComponentTextStyle.Regular, null)}\n \n .medium & {\n ${ComponentMStyling(ComponentTextStyle.Regular, null)}\n }\n \n .large & {\n ${ComponentLStyling(ComponentTextStyle.Regular, null)}\n }\n\n`;\n"],"mappings":";;;;;;;;AAAA;AACA;AAQA;AAAgD;AAEzC,IAAMA,oBAAoB,GAAGC,yBAAM,CAACC,GAAG,kLAK7C;AAAC;AAIK,IAAMC,mBAAmB,GAAGF,yBAAM,CAACC,GAAG,wjCASzC,IAAAE,yBAAiB,EAACC,0BAAkB,CAACC,OAAO,EAAEC,cAAM,CAACC,WAAW,CAAC,EAe/D,IAAAC,yBAAiB,EAACJ,0BAAkB,CAACC,OAAO,EAAEC,cAAM,CAACC,WAAW,CAAC,EAWjE,IAAAE,yBAAiB,EAACL,0BAAkB,CAACC,OAAO,EAAEC,cAAM,CAACC,WAAW,CAAC,EAUjEG,mBAAW,EAICJ,cAAM,CAACK,UAAU,EACtBL,cAAM,CAACM,WAAW,EAChBC,mBAAS,CAACC,KAAK,EAIjBR,cAAM,CAACS,WAAW,EACbT,cAAM,CAACU,WAAW,EACrBH,mBAAS,CAACI,MAAM,EAIlBX,cAAM,CAACY,WAAW,EAIbZ,cAAM,CAACa,KAAK,EACjBb,cAAM,CAACc,WAAW,EAIhBd,cAAM,CAACc,WAAW,CAGhC;AAAC;AAEK,IAAMC,sBAAsB,GAAGrB,yBAAM,CAACC,GAAG,uQAMzBC,mBAAmB,EACXI,cAAM,CAACgB,WAAW,CAEhD;AAAC;AAEK,IAAMC,iBAAiB,GAAGvB,yBAAM,CAACC,GAAG,gNAC9B,UAACuB,KAAK;EAAA,OAAKA,KAAK,CAACC,OAAO,IAAI,WAAW;AAAA,GACpCnB,cAAM,CAACa,KAAK,EAExB,IAAAhB,yBAAiB,EAACC,0BAAkB,CAACC,OAAO,EAAE,IAAI,CAAC,EAGjD,IAAAG,yBAAiB,EAACJ,0BAAkB,CAACC,OAAO,EAAE,IAAI,CAAC,EAInD,IAAAI,yBAAiB,EAACL,0BAAkB,CAACC,OAAO,EAAE,IAAI,CAAC,CAGxD;AAAC"}
package/dist/Accordion/styles.d.ts CHANGED
@@ -1,9 +1,6 @@
1
1
  export declare const AccordionMenuWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
2
- export declare const AccordionItemContainer: import("styled-components").StyledComponent<"div", any, {
3
- displaySeparator: boolean;
4
- }, never>;
5
2
  export declare const ItemHeaderContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
6
- export declare const HeaderIconContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
3
+ export declare const AccordionItemContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
7
4
  export declare const ItemBodyContainer: import("styled-components").StyledComponent<"div", any, {
8
5
  padding?: string | undefined;
9
6
  }, never>;
package/dist/Accordion/styles.js CHANGED
@@ -1,15 +1,12 @@
1
1
  import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
2
- var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
2
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4;
3
3
  import styled from 'styled-components';
4
- import { COLORS, ComponentMStyling, ComponentTextStyle, focusStyles } from '../styles';
4
+ import { COLORS, ComponentLStyling, ComponentMStyling, ComponentSStyling, ComponentTextStyle, focusStyles } from '../styles';
5
5
  import { Z_INDEXES } from '../styles/z-indexes';
6
6
  export var AccordionMenuWrapper = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n min-width: 320px;\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n"])));
7
- export var AccordionItemContainer = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n width: 100%;\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n border-bottom: ", ";\n"])), function (props) {
8
- return props.displaySeparator ? "1px solid ".concat(COLORS.neutral_100) : '';
9
- });
10
- export var ItemHeaderContainer = styled.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n position: relative;\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 12px 16px 11px 16px;\n cursor: pointer;\n\n ", "\n\n div:last-child {\n margin-left: auto;\n }\n outline: none;\n\n :focus:not(:active) {\n ", "\n }\n\n :hover {\n background: ", ";\n color: ", ";\n z-index: ", ";\n }\n\n :active {\n color: ", ";\n background: ", ";\n z-index: ", ";\n }\n\n &.active {\n color: ", ";\n }\n\n &.disabled {\n background: ", "!important;\n color: ", ";\n cursor: not-allowed;\n pointer-events: none;\n svg {\n color: ", "!important;\n }\n }\n"])), ComponentMStyling(ComponentTextStyle.Regular, COLORS.neutral_600), focusStyles, COLORS.primary_20, COLORS.primary_700, Z_INDEXES.hover, COLORS.primary_800, COLORS.primary_100, Z_INDEXES.active, COLORS.neutral_800, COLORS.white, COLORS.neutral_300, COLORS.neutral_300);
11
- export var HeaderIconContainer = styled.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n margin-left: auto;\n"])));
12
- export var ItemBodyContainer = styled.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n padding: ", ";\n background: ", ";\n"])), function (props) {
7
+ export var ItemHeaderContainer = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n position: relative;\n display: flex;\n align-items: center;\n gap: 8px;\n cursor: pointer;\n outline: none;\n box-sizing: border-box;\n\n ", "\n\n div:last-child {\n margin-left: auto;\n }\n\n padding: 0 16px;\n min-height: 48px;\n \n svg {\n width: 20px;\n height: 20px;\n }\n \n &.medium {\n ", "\n padding: 0 24px;\n min-height: 56px;\n\n svg {\n width: 24px;\n height: 24px;\n }\n }\n\n &.large {\n ", "\n padding: 0 32px;\n min-height: 64px;\n svg {\n width: 24px;\n height: 24px;\n }\n }\n\n :focus:not(:active) {\n ", "\n }\n\n :hover {\n background: ", ";\n color: ", ";\n z-index: ", ";\n }\n\n :active {\n color: ", ";\n background: ", ";\n z-index: ", ";\n }\n\n &.active {\n color: ", ";\n }\n\n &.disabled {\n background: ", "!important;\n color: ", ";\n cursor: not-allowed;\n pointer-events: none;\n svg {\n color: ", "!important;\n }\n }\n"])), ComponentSStyling(ComponentTextStyle.Regular, COLORS.neutral_600), ComponentMStyling(ComponentTextStyle.Regular, COLORS.neutral_600), ComponentLStyling(ComponentTextStyle.Regular, COLORS.neutral_600), focusStyles, COLORS.primary_20, COLORS.primary_700, Z_INDEXES.hover, COLORS.primary_800, COLORS.primary_100, Z_INDEXES.active, COLORS.neutral_800, COLORS.white, COLORS.neutral_300, COLORS.neutral_300);
8
+ export var AccordionItemContainer = styled.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n width: 100%;\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n \n &:not(:last-child) ", ":not(.active) {\n border-bottom: 1px solid ", ";\n }\n"])), ItemHeaderContainer, COLORS.neutral_100);
9
+ export var ItemBodyContainer = styled.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n padding: ", ";\n background: ", ";\n \n ", "\n \n .medium & {\n ", "\n }\n \n .large & {\n ", "\n }\n\n"])), function (props) {
13
10
  return props.padding || '12px 16px';
14
- }, COLORS.white);
11
+ }, COLORS.white, ComponentSStyling(ComponentTextStyle.Regular, null), ComponentMStyling(ComponentTextStyle.Regular, null), ComponentLStyling(ComponentTextStyle.Regular, null));
15
12
  //# sourceMappingURL=styles.js.map
package/dist/Accordion/styles.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"styles.js","names":["styled","COLORS","ComponentMStyling","ComponentTextStyle","focusStyles","Z_INDEXES","AccordionMenuWrapper","div","AccordionItemContainer","props","displaySeparator","neutral_100","ItemHeaderContainer","Regular","neutral_600","primary_20","primary_700","hover","primary_800","primary_100","active","neutral_800","white","neutral_300","HeaderIconContainer","ItemBodyContainer","padding"],"sources":["../../src/Accordion/styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport { COLORS, ComponentMStyling, ComponentTextStyle, focusStyles } from '../styles';\nimport { Z_INDEXES } from '../styles/z-indexes';\n\nexport const AccordionMenuWrapper = styled.div`\n min-width: 320px;\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n`;\n\nexport const AccordionItemContainer = styled.div<{ displaySeparator: boolean }>`\n width: 100%;\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n border-bottom: ${(props) => (props.displaySeparator ? `1px solid ${COLORS.neutral_100}` : '')};\n`;\n\nexport const ItemHeaderContainer = styled.div`\n position: relative;\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 12px 16px 11px 16px;\n cursor: pointer;\n\n ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n\n div:last-child {\n margin-left: auto;\n }\n outline: none;\n\n :focus:not(:active) {\n ${focusStyles}\n }\n\n :hover {\n background: ${COLORS.primary_20};\n color: ${COLORS.primary_700};\n z-index: ${Z_INDEXES.hover};\n }\n\n :active {\n color: ${COLORS.primary_800};\n background: ${COLORS.primary_100};\n z-index: ${Z_INDEXES.active};\n }\n\n &.active {\n color: ${COLORS.neutral_800};\n }\n\n &.disabled {\n background: ${COLORS.white}!important;\n color: ${COLORS.neutral_300};\n cursor: not-allowed;\n pointer-events: none;\n svg {\n color: ${COLORS.neutral_300}!important;\n }\n }\n`;\n\nexport const HeaderIconContainer = styled.div`\n margin-left: auto;\n`;\n\nexport const ItemBodyContainer = styled.div<{ padding?: string }>`\n padding: ${(props) => props.padding || '12px 16px'};\n background: ${COLORS.white};\n`;\n"],"mappings":";;AAAA,OAAOA,MAAM,MAAe,mBAAmB;AAC/C,SAASC,MAAM,EAAEC,iBAAiB,EAAEC,kBAAkB,EAAEC,WAAW,QAAQ,WAAW;AACtF,SAASC,SAAS,QAAQ,qBAAqB;AAE/C,OAAO,IAAMC,oBAAoB,GAAGN,MAAM,CAACO,GAAG,oKAK7C;AAED,OAAO,IAAMC,sBAAsB,GAAGR,MAAM,CAACO,GAAG,0LAK7B,UAACE,KAAK;EAAA,OAAMA,KAAK,CAACC,gBAAgB,uBAAgBT,MAAM,CAACU,WAAW,IAAK,EAAE;AAAA,CAAC,CAC9F;AAED,OAAO,IAAMC,mBAAmB,GAAGZ,MAAM,CAACO,GAAG,6rBAQzCL,iBAAiB,CAACC,kBAAkB,CAACU,OAAO,EAAEZ,MAAM,CAACa,WAAW,CAAC,EAQ/DV,WAAW,EAICH,MAAM,CAACc,UAAU,EACtBd,MAAM,CAACe,WAAW,EAChBX,SAAS,CAACY,KAAK,EAIjBhB,MAAM,CAACiB,WAAW,EACbjB,MAAM,CAACkB,WAAW,EACrBd,SAAS,CAACe,MAAM,EAIlBnB,MAAM,CAACoB,WAAW,EAIbpB,MAAM,CAACqB,KAAK,EACjBrB,MAAM,CAACsB,WAAW,EAIhBtB,MAAM,CAACsB,WAAW,CAGhC;AAED,OAAO,IAAMC,mBAAmB,GAAGxB,MAAM,CAACO,GAAG,+FAE5C;AAED,OAAO,IAAMkB,iBAAiB,GAAGzB,MAAM,CAACO,GAAG,iHAC9B,UAACE,KAAK;EAAA,OAAKA,KAAK,CAACiB,OAAO,IAAI,WAAW;AAAA,GACpCzB,MAAM,CAACqB,KAAK,CAC3B"}
1
+ {"version":3,"file":"styles.js","names":["styled","COLORS","ComponentLStyling","ComponentMStyling","ComponentSStyling","ComponentTextStyle","focusStyles","Z_INDEXES","AccordionMenuWrapper","div","ItemHeaderContainer","Regular","neutral_600","primary_20","primary_700","hover","primary_800","primary_100","active","neutral_800","white","neutral_300","AccordionItemContainer","neutral_100","ItemBodyContainer","props","padding"],"sources":["../../src/Accordion/styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport {\n COLORS,\n ComponentLStyling,\n ComponentMStyling,\n ComponentSStyling,\n ComponentTextStyle,\n focusStyles\n} from '../styles';\nimport { Z_INDEXES } from '../styles/z-indexes';\n\nexport const AccordionMenuWrapper = styled.div`\n min-width: 320px;\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n`;\n\n\n\nexport const ItemHeaderContainer = styled.div`\n position: relative;\n display: flex;\n align-items: center;\n gap: 8px;\n cursor: pointer;\n outline: none;\n box-sizing: border-box;\n\n ${ComponentSStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n\n div:last-child {\n margin-left: auto;\n }\n\n padding: 0 16px;\n min-height: 48px;\n \n svg {\n width: 20px;\n height: 20px;\n }\n \n &.medium {\n ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n padding: 0 24px;\n min-height: 56px;\n\n svg {\n width: 24px;\n height: 24px;\n }\n }\n\n &.large {\n ${ComponentLStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n padding: 0 32px;\n min-height: 64px;\n svg {\n width: 24px;\n height: 24px;\n }\n }\n\n :focus:not(:active) {\n ${focusStyles}\n }\n\n :hover {\n background: ${COLORS.primary_20};\n color: ${COLORS.primary_700};\n z-index: ${Z_INDEXES.hover};\n }\n\n :active {\n color: ${COLORS.primary_800};\n background: ${COLORS.primary_100};\n z-index: ${Z_INDEXES.active};\n }\n\n &.active {\n color: ${COLORS.neutral_800};\n }\n\n &.disabled {\n background: ${COLORS.white}!important;\n color: ${COLORS.neutral_300};\n cursor: not-allowed;\n pointer-events: none;\n svg {\n color: ${COLORS.neutral_300}!important;\n }\n }\n`;\n\nexport const AccordionItemContainer = styled.div`\n width: 100%;\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n \n &:not(:last-child) ${ItemHeaderContainer}:not(.active) {\n border-bottom: 1px solid ${COLORS.neutral_100};\n }\n`;\n\nexport const ItemBodyContainer = styled.div<{ padding?: string }>`\n padding: ${(props) => props.padding || '12px 16px'};\n background: ${COLORS.white};\n \n ${ComponentSStyling(ComponentTextStyle.Regular, null)}\n \n .medium & {\n ${ComponentMStyling(ComponentTextStyle.Regular, null)}\n }\n \n .large & {\n ${ComponentLStyling(ComponentTextStyle.Regular, null)}\n }\n\n`;\n"],"mappings":";;AAAA,OAAOA,MAAM,MAAe,mBAAmB;AAC/C,SACEC,MAAM,EACNC,iBAAiB,EACjBC,iBAAiB,EACjBC,iBAAiB,EACjBC,kBAAkB,EAClBC,WAAW,QACN,WAAW;AAClB,SAASC,SAAS,QAAQ,qBAAqB;AAE/C,OAAO,IAAMC,oBAAoB,GAAGR,MAAM,CAACS,GAAG,oKAK7C;AAID,OAAO,IAAMC,mBAAmB,GAAGV,MAAM,CAACS,GAAG,0iCASzCL,iBAAiB,CAACC,kBAAkB,CAACM,OAAO,EAAEV,MAAM,CAACW,WAAW,CAAC,EAe/DT,iBAAiB,CAACE,kBAAkB,CAACM,OAAO,EAAEV,MAAM,CAACW,WAAW,CAAC,EAWjEV,iBAAiB,CAACG,kBAAkB,CAACM,OAAO,EAAEV,MAAM,CAACW,WAAW,CAAC,EAUjEN,WAAW,EAICL,MAAM,CAACY,UAAU,EACtBZ,MAAM,CAACa,WAAW,EAChBP,SAAS,CAACQ,KAAK,EAIjBd,MAAM,CAACe,WAAW,EACbf,MAAM,CAACgB,WAAW,EACrBV,SAAS,CAACW,MAAM,EAIlBjB,MAAM,CAACkB,WAAW,EAIblB,MAAM,CAACmB,KAAK,EACjBnB,MAAM,CAACoB,WAAW,EAIhBpB,MAAM,CAACoB,WAAW,CAGhC;AAED,OAAO,IAAMC,sBAAsB,GAAGtB,MAAM,CAACS,GAAG,yPAMzBC,mBAAmB,EACXT,MAAM,CAACsB,WAAW,CAEhD;AAED,OAAO,IAAMC,iBAAiB,GAAGxB,MAAM,CAACS,GAAG,kMAC9B,UAACgB,KAAK;EAAA,OAAKA,KAAK,CAACC,OAAO,IAAI,WAAW;AAAA,GACpCzB,MAAM,CAACmB,KAAK,EAExBhB,iBAAiB,CAACC,kBAAkB,CAACM,OAAO,EAAE,IAAI,CAAC,EAGjDR,iBAAiB,CAACE,kBAAkB,CAACM,OAAO,EAAE,IAAI,CAAC,EAInDT,iBAAiB,CAACG,kBAAkB,CAACM,OAAO,EAAE,IAAI,CAAC,CAGxD"}
package/dist/Table/Table.cjs CHANGED
@@ -348,7 +348,6 @@ var Table = function Table(props) {
348
348
  * Return Table component.
349
349
  */
350
350
  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_TableStyles.TableWrapper, {
351
- className: props.border ? 'border' : undefined,
352
351
  children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_TableHeaders.default, _objectSpread({}, props)), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TableBody.default, _objectSpread(_objectSpread({}, props), {}, {
353
352
  currentPageRows: currentPageRows,
354
353
  selected: selected,
package/dist/Table/Table.cjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Table.cjs","names":["Table","props","onPreviousPageClick","onNextPageClick","onRowsPerPageChange","onTriggerSortingChange","columns","rows","remoteOperations","pagination","showLoadingIndicator","selectable","multiSelect","keyExpr","sortProps","accordion","collapsed","collapsedRows","rowsPerPageLabel","React","useState","rowsPerPage","setRowsPerPage","filteredRows","setFilteredRows","currentPageRows","setCurrentPageRows","currentPage","setCurrentPage","sort","setSort","from","setFrom","to","setTo","total","setTotal","isCollapsed","setIsCollapsed","selectAllState","setSelectAllState","undefined","selected","setSelected","useEffect","selectedRows","currentList","map","row","count","filter","item","includes","length","filterAndSortRows","tmpFilteredRows","matchFilterCriteria","column","filterValue","key","toLowerCase","indexOf","direction","a","b","rowsFrom","rowsTo","slice","sortTableColumn","columnKey","sortDirection","previousPage","nextPage","changeRowsPerPage","value","onRowClick","selectedText","window","getSelection","toString","currentSelection","existing","splice","onSelectionChange","onSelectAllClick","border","Size","Medium"],"sources":["../../src/Table/Table.tsx"],"sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\n\n/**\n * Import custom components.\n */\nimport {Size} from '../types'\n\n/**\n * Import custom styles.\n */\nimport {StyledTable, StyledTableSpinner, TableWrapper} from './TableStyles';\n\n/**\n * Import custom types.\n */\nimport {TableProps, TableColumn, TableSortingDirection, TableSortProps} from './TableTypes';\nimport {LoadingIndicator} from '../LoadingIndicator';\nimport TableHeader from './TableHeaders';\nimport TableFooter from './TableFooter';\nimport TableBody from './TableBody';\n\nconst Table: React.FunctionComponent<TableProps> = (props: TableProps) => {\n let {\n onPreviousPageClick,\n onNextPageClick,\n onRowsPerPageChange,\n onTriggerSortingChange,\n columns,\n rows,\n remoteOperations,\n pagination,\n showLoadingIndicator,\n selectable,\n multiSelect,\n keyExpr,\n sortProps,\n accordion,\n collapsed = true,\n collapsedRows,\n rowsPerPageLabel\n } = props;\n\n // States used within the component\n const [rowsPerPage, setRowsPerPage] = React.useState<number>(10);\n const [filteredRows, setFilteredRows] = React.useState<any[]>([]);\n const [currentPageRows, setCurrentPageRows] = React.useState<any[]>([]);\n const [currentPage, setCurrentPage] = React.useState<number>(1);\n const [sort, setSort] = React.useState<TableSortProps | undefined>(sortProps);\n const [from, setFrom] = React.useState<number>();\n const [to, setTo] = React.useState<number>();\n const [total, setTotal] = React.useState<number>();\n\n const [isCollapsed, setIsCollapsed] = React.useState(true);\n\n const [selectAllState, setSelectAllState] = React.useState<'all' | 'some' | 'none'>('none');\n\n const [selected, setSelected] = React.useState<any | any[]>(multiSelect ? [] : undefined);\n\n React.useEffect(() => {\n setSort(sortProps);\n }, [sortProps])\n\n React.useEffect(() => {\n setSelected(props.selectedRows || (multiSelect ? [] : undefined))\n }, [props.selectedRows, multiSelect])\n\n /**\n * update select all checkbox state\n */\n React.useEffect(() => {\n if (multiSelect) {\n const currentList = currentPageRows.map(row => keyExpr ? row[keyExpr] : row);\n const count = selected.filter((item: any) => currentList.includes(item)).length;\n\n setSelectAllState(count === currentList.length ? 'all' : count > 0 ? 'some' : 'none');\n }\n }, [currentPageRows, multiSelect, selected, keyExpr])\n\n /**\n * Takes care of remote pagination.\n * Works only in case remote pagination is set to true.\n */\n React.useEffect(() => {\n if (remoteOperations) {\n setCurrentPageRows(rows);\n\n // Let's assign pagination values\n setFrom(pagination?.from);\n setTo(pagination?.to);\n setTotal(pagination?.total);\n setCurrentPage(pagination?.currentPage!);\n setRowsPerPage(pagination?.rowsPerPage!);\n }\n }, [remoteOperations, pagination, rows]);\n\n /**\n * Sets number of rows to display when accordion.\n */\n React.useEffect(() => {\n if (!accordion) return;\n\n setRowsPerPage(isCollapsed ? collapsedRows || 10 : rows.length);\n }, [rows, accordion, collapsedRows, isCollapsed])\n\n React.useEffect(() => {\n if (!accordion) return;\n\n setIsCollapsed(!!collapsed);\n }, [accordion, collapsed])\n\n /**\n * Filters out a rows by specific column filters and sorts them if any sorting is set.\n * @returns Filtered and sorted rows.\n */\n const filterAndSortRows = (): any[] => {\n let tmpFilteredRows = rows.filter((row) => {\n // Let's start with matched filter criteria\n let matchFilterCriteria = true;\n\n // Let's go through columns\n for (const column of columns) {\n // Let's check if filter value is specified for the column\n // And if it doesn't match the current row column value\n // Then let's update match filter criteria to failed\n if (column.filterValue && row[column.key].toLowerCase().indexOf(column.filterValue.toLowerCase()) === -1) {\n matchFilterCriteria = false;\n }\n }\n\n // Let's return row only in case match filter criteria succeeds\n if (matchFilterCriteria) {\n return row;\n }\n });\n\n // Let's apply sorting if needed\n if (!!sort?.column && !!sort?.direction) {\n // Let's sort the rows\n tmpFilteredRows.sort((a, b) => {\n if (a[sort.column!] > b[sort.column!]) {\n return sort.direction! === 'asc' ? 1 : -1;\n } else if (a[sort.column!] < b[sort.column!]) {\n return sort.direction! === 'asc' ? -1 : 1;\n } else {\n return 0;\n }\n });\n }\n\n // Let's return filtered rows\n return tmpFilteredRows;\n };\n\n /**\n * Takes care of local pagination.\n * Works only in case remote pagination is not defined or is set to false.\n */\n React.useEffect(() => {\n if (!remoteOperations) {\n // Let's retrieve temporary filtered rows and update globally filtered rows\n const tmpFilteredRows = filterAndSortRows();\n setFilteredRows(tmpFilteredRows);\n setTotal(tmpFilteredRows.length);\n\n // Assign rows from and rows to\n const rowsFrom = (currentPage - 1) * rowsPerPage;\n const rowsTo = rowsFrom + rowsPerPage >= tmpFilteredRows.length ? tmpFilteredRows.length : rowsFrom + rowsPerPage;\n\n // Set from and to values\n setFrom(rowsFrom + 1);\n setTo(rowsTo);\n\n // Filter out the rows\n setCurrentPageRows(tmpFilteredRows.slice(rowsFrom, rowsTo));\n }\n }, [rowsPerPage, rows, currentPage, columns, sort, remoteOperations]);\n\n\n /**\n * Applies a specific sorting to a column.\n * If no sorting exists, then applies ascending initially\n * @param column - Column to which sorting should be applied.\n */\n const sortTableColumn = (column: TableColumn): void => {\n let columnKey = '';\n let sortDirection: TableSortingDirection | undefined = undefined;\n\n if (sort?.column !== column.key) {\n columnKey = column.key;\n sortDirection = 'asc';\n } else {\n if (sort?.direction === 'desc') {\n columnKey = '';\n sortDirection = undefined;\n } else {\n columnKey = sort.column;\n sortDirection = sort.direction === 'asc' ? 'desc' : 'asc';\n }\n }\n\n if(columnKey == '')\n setSort(undefined);\n else\n setSort({column: columnKey, direction: sortDirection!});\n\n remoteOperations && onTriggerSortingChange && onTriggerSortingChange(columnKey, sortDirection);\n };\n\n /**\n * Navigates user back to the previous page and updates the current table page.\n */\n const previousPage = () => {\n if (remoteOperations) {\n // Let's inform parent component about page change\n if (onPreviousPageClick) {\n onPreviousPageClick();\n }\n } else {\n // Let's change the page within the component\n setCurrentPage(currentPage > 1 ? currentPage - 1 : 1);\n }\n };\n\n /**\n * Navigates user to the next page and updates the current table page.\n */\n const nextPage = () => {\n if (remoteOperations) {\n // Let's inform parent component about page change\n if (onNextPageClick) {\n onNextPageClick();\n }\n } else {\n // Let's change the page within the component\n setCurrentPage(currentPage * rowsPerPage >= filteredRows.length ? currentPage : currentPage + 1);\n }\n };\n\n /**\n * Updates the rows per page value and refreshes the table content accordingly.\n * @param value - Newly selected rows per page value.\n */\n const changeRowsPerPage = (value: number) => {\n // Let's check if we are using remote pagination\n if (remoteOperations) {\n // Inform parent component about rows per page change\n if (onRowsPerPageChange) {\n onRowsPerPageChange(value);\n }\n } else {\n // Let's reset current page to 1\n setCurrentPage(1);\n }\n\n // Let's set rows per page\n setRowsPerPage(value);\n };\n\n\n /**\n * Function which is called when a mouse click happens on a row to pass data to the parent component.\n * @param row - Row in which the link is located.\n */\n const onRowClick = (row: any): void => {\n const selectedText = window?.getSelection()?.toString();\n\n if (selectedText?.length === 0 && selectable) {\n const value = keyExpr ? row[keyExpr] : row;\n let currentSelection = value;\n if (!!multiSelect) {\n const existing = selected?.indexOf(value);\n if (existing > -1) {\n currentSelection = [...selected];\n currentSelection.splice(existing, 1);\n } else {\n currentSelection = [...selected, currentSelection];\n }\n }\n\n setSelected(currentSelection)\n props.onSelectionChange && props.onSelectionChange(currentSelection);\n }\n };\n\n /**\n * Function which is called when user clicks checkbox to select or deselect all rows.\n */\n const onSelectAllClick = () => {\n const currentList = currentPageRows.map(row => keyExpr ? row[keyExpr] : row);\n\n switch (selectAllState) {\n case 'all':\n setSelected([...selected].filter(item => !currentList.includes(item)));\n setSelectAllState('none');\n break;\n case 'none':\n setSelected([...selected, ...currentList]);\n setSelectAllState('all');\n break;\n case 'some':\n setSelected([...selected, ...currentList.filter(item => !selected.includes(item))]);\n setSelectAllState('all');\n break;\n }\n };\n\n /**\n * Return Table component.\n */\n return (\n <TableWrapper className={props.border ? 'border' : undefined}>\n <TableHeader {...props}/>\n <TableBody {...props}\n currentPageRows={currentPageRows}\n selected={selected}\n onRowClick={onRowClick}\n sortByColumn={sortTableColumn}\n onSelectAllClick={onSelectAllClick}\n sortProps={sort}\n selectAllState={selectAllState}/>\n <TableFooter {...props}\n onRowsPerPageChange={changeRowsPerPage}\n rowsPerPage={rowsPerPage}\n setIsCollapsed={setIsCollapsed}\n isCollapsed={isCollapsed}\n from={from}\n to={to}\n total={total}\n nextPage={nextPage}\n prevPage={previousPage}/>\n {showLoadingIndicator && (\n <StyledTableSpinner>\n <LoadingIndicator size={Size.Medium}/>\n </StyledTableSpinner>\n )}\n </TableWrapper>\n );\n};\n\nexport default Table;\n"],"mappings":"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"}
1
+ {"version":3,"file":"Table.cjs","names":["Table","props","onPreviousPageClick","onNextPageClick","onRowsPerPageChange","onTriggerSortingChange","columns","rows","remoteOperations","pagination","showLoadingIndicator","selectable","multiSelect","keyExpr","sortProps","accordion","collapsed","collapsedRows","rowsPerPageLabel","React","useState","rowsPerPage","setRowsPerPage","filteredRows","setFilteredRows","currentPageRows","setCurrentPageRows","currentPage","setCurrentPage","sort","setSort","from","setFrom","to","setTo","total","setTotal","isCollapsed","setIsCollapsed","selectAllState","setSelectAllState","undefined","selected","setSelected","useEffect","selectedRows","currentList","map","row","count","filter","item","includes","length","filterAndSortRows","tmpFilteredRows","matchFilterCriteria","column","filterValue","key","toLowerCase","indexOf","direction","a","b","rowsFrom","rowsTo","slice","sortTableColumn","columnKey","sortDirection","previousPage","nextPage","changeRowsPerPage","value","onRowClick","selectedText","window","getSelection","toString","currentSelection","existing","splice","onSelectionChange","onSelectAllClick","Size","Medium"],"sources":["../../src/Table/Table.tsx"],"sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\n\n/**\n * Import custom components.\n */\nimport {Size} from '../types'\n\n/**\n * Import custom styles.\n */\nimport {StyledTable, StyledTableSpinner, TableWrapper} from './TableStyles';\n\n/**\n * Import custom types.\n */\nimport {TableProps, TableColumn, TableSortingDirection, TableSortProps} from './TableTypes';\nimport {LoadingIndicator} from '../LoadingIndicator';\nimport TableHeader from './TableHeaders';\nimport TableFooter from './TableFooter';\nimport TableBody from './TableBody';\n\nconst Table: React.FunctionComponent<TableProps> = (props: TableProps) => {\n let {\n onPreviousPageClick,\n onNextPageClick,\n onRowsPerPageChange,\n onTriggerSortingChange,\n columns,\n rows,\n remoteOperations,\n pagination,\n showLoadingIndicator,\n selectable,\n multiSelect,\n keyExpr,\n sortProps,\n accordion,\n collapsed = true,\n collapsedRows,\n rowsPerPageLabel\n } = props;\n\n // States used within the component\n const [rowsPerPage, setRowsPerPage] = React.useState<number>(10);\n const [filteredRows, setFilteredRows] = React.useState<any[]>([]);\n const [currentPageRows, setCurrentPageRows] = React.useState<any[]>([]);\n const [currentPage, setCurrentPage] = React.useState<number>(1);\n const [sort, setSort] = React.useState<TableSortProps | undefined>(sortProps);\n const [from, setFrom] = React.useState<number>();\n const [to, setTo] = React.useState<number>();\n const [total, setTotal] = React.useState<number>();\n\n const [isCollapsed, setIsCollapsed] = React.useState(true);\n\n const [selectAllState, setSelectAllState] = React.useState<'all' | 'some' | 'none'>('none');\n\n const [selected, setSelected] = React.useState<any | any[]>(multiSelect ? [] : undefined);\n\n React.useEffect(() => {\n setSort(sortProps);\n }, [sortProps])\n\n React.useEffect(() => {\n setSelected(props.selectedRows || (multiSelect ? [] : undefined))\n }, [props.selectedRows, multiSelect])\n\n /**\n * update select all checkbox state\n */\n React.useEffect(() => {\n if (multiSelect) {\n const currentList = currentPageRows.map(row => keyExpr ? row[keyExpr] : row);\n const count = selected.filter((item: any) => currentList.includes(item)).length;\n\n setSelectAllState(count === currentList.length ? 'all' : count > 0 ? 'some' : 'none');\n }\n }, [currentPageRows, multiSelect, selected, keyExpr])\n\n /**\n * Takes care of remote pagination.\n * Works only in case remote pagination is set to true.\n */\n React.useEffect(() => {\n if (remoteOperations) {\n setCurrentPageRows(rows);\n\n // Let's assign pagination values\n setFrom(pagination?.from);\n setTo(pagination?.to);\n setTotal(pagination?.total);\n setCurrentPage(pagination?.currentPage!);\n setRowsPerPage(pagination?.rowsPerPage!);\n }\n }, [remoteOperations, pagination, rows]);\n\n /**\n * Sets number of rows to display when accordion.\n */\n React.useEffect(() => {\n if (!accordion) return;\n\n setRowsPerPage(isCollapsed ? collapsedRows || 10 : rows.length);\n }, [rows, accordion, collapsedRows, isCollapsed])\n\n React.useEffect(() => {\n if (!accordion) return;\n\n setIsCollapsed(!!collapsed);\n }, [accordion, collapsed])\n\n /**\n * Filters out a rows by specific column filters and sorts them if any sorting is set.\n * @returns Filtered and sorted rows.\n */\n const filterAndSortRows = (): any[] => {\n let tmpFilteredRows = rows.filter((row) => {\n // Let's start with matched filter criteria\n let matchFilterCriteria = true;\n\n // Let's go through columns\n for (const column of columns) {\n // Let's check if filter value is specified for the column\n // And if it doesn't match the current row column value\n // Then let's update match filter criteria to failed\n if (column.filterValue && row[column.key].toLowerCase().indexOf(column.filterValue.toLowerCase()) === -1) {\n matchFilterCriteria = false;\n }\n }\n\n // Let's return row only in case match filter criteria succeeds\n if (matchFilterCriteria) {\n return row;\n }\n });\n\n // Let's apply sorting if needed\n if (!!sort?.column && !!sort?.direction) {\n // Let's sort the rows\n tmpFilteredRows.sort((a, b) => {\n if (a[sort.column!] > b[sort.column!]) {\n return sort.direction! === 'asc' ? 1 : -1;\n } else if (a[sort.column!] < b[sort.column!]) {\n return sort.direction! === 'asc' ? -1 : 1;\n } else {\n return 0;\n }\n });\n }\n\n // Let's return filtered rows\n return tmpFilteredRows;\n };\n\n /**\n * Takes care of local pagination.\n * Works only in case remote pagination is not defined or is set to false.\n */\n React.useEffect(() => {\n if (!remoteOperations) {\n // Let's retrieve temporary filtered rows and update globally filtered rows\n const tmpFilteredRows = filterAndSortRows();\n setFilteredRows(tmpFilteredRows);\n setTotal(tmpFilteredRows.length);\n\n // Assign rows from and rows to\n const rowsFrom = (currentPage - 1) * rowsPerPage;\n const rowsTo = rowsFrom + rowsPerPage >= tmpFilteredRows.length ? tmpFilteredRows.length : rowsFrom + rowsPerPage;\n\n // Set from and to values\n setFrom(rowsFrom + 1);\n setTo(rowsTo);\n\n // Filter out the rows\n setCurrentPageRows(tmpFilteredRows.slice(rowsFrom, rowsTo));\n }\n }, [rowsPerPage, rows, currentPage, columns, sort, remoteOperations]);\n\n\n /**\n * Applies a specific sorting to a column.\n * If no sorting exists, then applies ascending initially\n * @param column - Column to which sorting should be applied.\n */\n const sortTableColumn = (column: TableColumn): void => {\n let columnKey = '';\n let sortDirection: TableSortingDirection | undefined = undefined;\n\n if (sort?.column !== column.key) {\n columnKey = column.key;\n sortDirection = 'asc';\n } else {\n if (sort?.direction === 'desc') {\n columnKey = '';\n sortDirection = undefined;\n } else {\n columnKey = sort.column;\n sortDirection = sort.direction === 'asc' ? 'desc' : 'asc';\n }\n }\n\n if(columnKey == '')\n setSort(undefined);\n else\n setSort({column: columnKey, direction: sortDirection!});\n\n remoteOperations && onTriggerSortingChange && onTriggerSortingChange(columnKey, sortDirection);\n };\n\n /**\n * Navigates user back to the previous page and updates the current table page.\n */\n const previousPage = () => {\n if (remoteOperations) {\n // Let's inform parent component about page change\n if (onPreviousPageClick) {\n onPreviousPageClick();\n }\n } else {\n // Let's change the page within the component\n setCurrentPage(currentPage > 1 ? currentPage - 1 : 1);\n }\n };\n\n /**\n * Navigates user to the next page and updates the current table page.\n */\n const nextPage = () => {\n if (remoteOperations) {\n // Let's inform parent component about page change\n if (onNextPageClick) {\n onNextPageClick();\n }\n } else {\n // Let's change the page within the component\n setCurrentPage(currentPage * rowsPerPage >= filteredRows.length ? currentPage : currentPage + 1);\n }\n };\n\n /**\n * Updates the rows per page value and refreshes the table content accordingly.\n * @param value - Newly selected rows per page value.\n */\n const changeRowsPerPage = (value: number) => {\n // Let's check if we are using remote pagination\n if (remoteOperations) {\n // Inform parent component about rows per page change\n if (onRowsPerPageChange) {\n onRowsPerPageChange(value);\n }\n } else {\n // Let's reset current page to 1\n setCurrentPage(1);\n }\n\n // Let's set rows per page\n setRowsPerPage(value);\n };\n\n\n /**\n * Function which is called when a mouse click happens on a row to pass data to the parent component.\n * @param row - Row in which the link is located.\n */\n const onRowClick = (row: any): void => {\n const selectedText = window?.getSelection()?.toString();\n\n if (selectedText?.length === 0 && selectable) {\n const value = keyExpr ? row[keyExpr] : row;\n let currentSelection = value;\n if (!!multiSelect) {\n const existing = selected?.indexOf(value);\n if (existing > -1) {\n currentSelection = [...selected];\n currentSelection.splice(existing, 1);\n } else {\n currentSelection = [...selected, currentSelection];\n }\n }\n\n setSelected(currentSelection)\n props.onSelectionChange && props.onSelectionChange(currentSelection);\n }\n };\n\n /**\n * Function which is called when user clicks checkbox to select or deselect all rows.\n */\n const onSelectAllClick = () => {\n const currentList = currentPageRows.map(row => keyExpr ? row[keyExpr] : row);\n\n switch (selectAllState) {\n case 'all':\n setSelected([...selected].filter(item => !currentList.includes(item)));\n setSelectAllState('none');\n break;\n case 'none':\n setSelected([...selected, ...currentList]);\n setSelectAllState('all');\n break;\n case 'some':\n setSelected([...selected, ...currentList.filter(item => !selected.includes(item))]);\n setSelectAllState('all');\n break;\n }\n };\n\n /**\n * Return Table component.\n */\n return (\n <TableWrapper>\n <TableHeader {...props}/>\n <TableBody {...props}\n currentPageRows={currentPageRows}\n selected={selected}\n onRowClick={onRowClick}\n sortByColumn={sortTableColumn}\n onSelectAllClick={onSelectAllClick}\n sortProps={sort}\n selectAllState={selectAllState}/>\n <TableFooter {...props}\n onRowsPerPageChange={changeRowsPerPage}\n rowsPerPage={rowsPerPage}\n setIsCollapsed={setIsCollapsed}\n isCollapsed={isCollapsed}\n from={from}\n to={to}\n total={total}\n nextPage={nextPage}\n prevPage={previousPage}/>\n {showLoadingIndicator && (\n <StyledTableSpinner>\n <LoadingIndicator size={Size.Medium}/>\n </StyledTableSpinner>\n )}\n </TableWrapper>\n );\n};\n\nexport default Table;\n"],"mappings":"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"}
package/dist/Table/Table.js CHANGED
@@ -355,7 +355,6 @@ var Table = function Table(props) {
355
355
  * Return Table component.
356
356
  */
357
357
  return /*#__PURE__*/_jsxs(TableWrapper, {
358
- className: props.border ? 'border' : undefined,
359
358
  children: [/*#__PURE__*/_jsx(TableHeader, _objectSpread({}, props)), /*#__PURE__*/_jsx(TableBody, _objectSpread(_objectSpread({}, props), {}, {
360
359
  currentPageRows: currentPageRows,
361
360
  selected: selected,
package/dist/Table/Table.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Table.js","names":["React","Size","StyledTableSpinner","TableWrapper","LoadingIndicator","TableHeader","TableFooter","TableBody","Table","props","onPreviousPageClick","onNextPageClick","onRowsPerPageChange","onTriggerSortingChange","columns","rows","remoteOperations","pagination","showLoadingIndicator","selectable","multiSelect","keyExpr","sortProps","accordion","collapsed","collapsedRows","rowsPerPageLabel","useState","rowsPerPage","setRowsPerPage","filteredRows","setFilteredRows","currentPageRows","setCurrentPageRows","currentPage","setCurrentPage","sort","setSort","from","setFrom","to","setTo","total","setTotal","isCollapsed","setIsCollapsed","selectAllState","setSelectAllState","undefined","selected","setSelected","useEffect","selectedRows","currentList","map","row","count","filter","item","includes","length","filterAndSortRows","tmpFilteredRows","matchFilterCriteria","column","filterValue","key","toLowerCase","indexOf","direction","a","b","rowsFrom","rowsTo","slice","sortTableColumn","columnKey","sortDirection","previousPage","nextPage","changeRowsPerPage","value","onRowClick","selectedText","window","getSelection","toString","currentSelection","existing","splice","onSelectionChange","onSelectAllClick","border","Medium"],"sources":["../../src/Table/Table.tsx"],"sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\n\n/**\n * Import custom components.\n */\nimport {Size} from '../types'\n\n/**\n * Import custom styles.\n */\nimport {StyledTable, StyledTableSpinner, TableWrapper} from './TableStyles';\n\n/**\n * Import custom types.\n */\nimport {TableProps, TableColumn, TableSortingDirection, TableSortProps} from './TableTypes';\nimport {LoadingIndicator} from '../LoadingIndicator';\nimport TableHeader from './TableHeaders';\nimport TableFooter from './TableFooter';\nimport TableBody from './TableBody';\n\nconst Table: React.FunctionComponent<TableProps> = (props: TableProps) => {\n let {\n onPreviousPageClick,\n onNextPageClick,\n onRowsPerPageChange,\n onTriggerSortingChange,\n columns,\n rows,\n remoteOperations,\n pagination,\n showLoadingIndicator,\n selectable,\n multiSelect,\n keyExpr,\n sortProps,\n accordion,\n collapsed = true,\n collapsedRows,\n rowsPerPageLabel\n } = props;\n\n // States used within the component\n const [rowsPerPage, setRowsPerPage] = React.useState<number>(10);\n const [filteredRows, setFilteredRows] = React.useState<any[]>([]);\n const [currentPageRows, setCurrentPageRows] = React.useState<any[]>([]);\n const [currentPage, setCurrentPage] = React.useState<number>(1);\n const [sort, setSort] = React.useState<TableSortProps | undefined>(sortProps);\n const [from, setFrom] = React.useState<number>();\n const [to, setTo] = React.useState<number>();\n const [total, setTotal] = React.useState<number>();\n\n const [isCollapsed, setIsCollapsed] = React.useState(true);\n\n const [selectAllState, setSelectAllState] = React.useState<'all' | 'some' | 'none'>('none');\n\n const [selected, setSelected] = React.useState<any | any[]>(multiSelect ? [] : undefined);\n\n React.useEffect(() => {\n setSort(sortProps);\n }, [sortProps])\n\n React.useEffect(() => {\n setSelected(props.selectedRows || (multiSelect ? [] : undefined))\n }, [props.selectedRows, multiSelect])\n\n /**\n * update select all checkbox state\n */\n React.useEffect(() => {\n if (multiSelect) {\n const currentList = currentPageRows.map(row => keyExpr ? row[keyExpr] : row);\n const count = selected.filter((item: any) => currentList.includes(item)).length;\n\n setSelectAllState(count === currentList.length ? 'all' : count > 0 ? 'some' : 'none');\n }\n }, [currentPageRows, multiSelect, selected, keyExpr])\n\n /**\n * Takes care of remote pagination.\n * Works only in case remote pagination is set to true.\n */\n React.useEffect(() => {\n if (remoteOperations) {\n setCurrentPageRows(rows);\n\n // Let's assign pagination values\n setFrom(pagination?.from);\n setTo(pagination?.to);\n setTotal(pagination?.total);\n setCurrentPage(pagination?.currentPage!);\n setRowsPerPage(pagination?.rowsPerPage!);\n }\n }, [remoteOperations, pagination, rows]);\n\n /**\n * Sets number of rows to display when accordion.\n */\n React.useEffect(() => {\n if (!accordion) return;\n\n setRowsPerPage(isCollapsed ? collapsedRows || 10 : rows.length);\n }, [rows, accordion, collapsedRows, isCollapsed])\n\n React.useEffect(() => {\n if (!accordion) return;\n\n setIsCollapsed(!!collapsed);\n }, [accordion, collapsed])\n\n /**\n * Filters out a rows by specific column filters and sorts them if any sorting is set.\n * @returns Filtered and sorted rows.\n */\n const filterAndSortRows = (): any[] => {\n let tmpFilteredRows = rows.filter((row) => {\n // Let's start with matched filter criteria\n let matchFilterCriteria = true;\n\n // Let's go through columns\n for (const column of columns) {\n // Let's check if filter value is specified for the column\n // And if it doesn't match the current row column value\n // Then let's update match filter criteria to failed\n if (column.filterValue && row[column.key].toLowerCase().indexOf(column.filterValue.toLowerCase()) === -1) {\n matchFilterCriteria = false;\n }\n }\n\n // Let's return row only in case match filter criteria succeeds\n if (matchFilterCriteria) {\n return row;\n }\n });\n\n // Let's apply sorting if needed\n if (!!sort?.column && !!sort?.direction) {\n // Let's sort the rows\n tmpFilteredRows.sort((a, b) => {\n if (a[sort.column!] > b[sort.column!]) {\n return sort.direction! === 'asc' ? 1 : -1;\n } else if (a[sort.column!] < b[sort.column!]) {\n return sort.direction! === 'asc' ? -1 : 1;\n } else {\n return 0;\n }\n });\n }\n\n // Let's return filtered rows\n return tmpFilteredRows;\n };\n\n /**\n * Takes care of local pagination.\n * Works only in case remote pagination is not defined or is set to false.\n */\n React.useEffect(() => {\n if (!remoteOperations) {\n // Let's retrieve temporary filtered rows and update globally filtered rows\n const tmpFilteredRows = filterAndSortRows();\n setFilteredRows(tmpFilteredRows);\n setTotal(tmpFilteredRows.length);\n\n // Assign rows from and rows to\n const rowsFrom = (currentPage - 1) * rowsPerPage;\n const rowsTo = rowsFrom + rowsPerPage >= tmpFilteredRows.length ? tmpFilteredRows.length : rowsFrom + rowsPerPage;\n\n // Set from and to values\n setFrom(rowsFrom + 1);\n setTo(rowsTo);\n\n // Filter out the rows\n setCurrentPageRows(tmpFilteredRows.slice(rowsFrom, rowsTo));\n }\n }, [rowsPerPage, rows, currentPage, columns, sort, remoteOperations]);\n\n\n /**\n * Applies a specific sorting to a column.\n * If no sorting exists, then applies ascending initially\n * @param column - Column to which sorting should be applied.\n */\n const sortTableColumn = (column: TableColumn): void => {\n let columnKey = '';\n let sortDirection: TableSortingDirection | undefined = undefined;\n\n if (sort?.column !== column.key) {\n columnKey = column.key;\n sortDirection = 'asc';\n } else {\n if (sort?.direction === 'desc') {\n columnKey = '';\n sortDirection = undefined;\n } else {\n columnKey = sort.column;\n sortDirection = sort.direction === 'asc' ? 'desc' : 'asc';\n }\n }\n\n if(columnKey == '')\n setSort(undefined);\n else\n setSort({column: columnKey, direction: sortDirection!});\n\n remoteOperations && onTriggerSortingChange && onTriggerSortingChange(columnKey, sortDirection);\n };\n\n /**\n * Navigates user back to the previous page and updates the current table page.\n */\n const previousPage = () => {\n if (remoteOperations) {\n // Let's inform parent component about page change\n if (onPreviousPageClick) {\n onPreviousPageClick();\n }\n } else {\n // Let's change the page within the component\n setCurrentPage(currentPage > 1 ? currentPage - 1 : 1);\n }\n };\n\n /**\n * Navigates user to the next page and updates the current table page.\n */\n const nextPage = () => {\n if (remoteOperations) {\n // Let's inform parent component about page change\n if (onNextPageClick) {\n onNextPageClick();\n }\n } else {\n // Let's change the page within the component\n setCurrentPage(currentPage * rowsPerPage >= filteredRows.length ? currentPage : currentPage + 1);\n }\n };\n\n /**\n * Updates the rows per page value and refreshes the table content accordingly.\n * @param value - Newly selected rows per page value.\n */\n const changeRowsPerPage = (value: number) => {\n // Let's check if we are using remote pagination\n if (remoteOperations) {\n // Inform parent component about rows per page change\n if (onRowsPerPageChange) {\n onRowsPerPageChange(value);\n }\n } else {\n // Let's reset current page to 1\n setCurrentPage(1);\n }\n\n // Let's set rows per page\n setRowsPerPage(value);\n };\n\n\n /**\n * Function which is called when a mouse click happens on a row to pass data to the parent component.\n * @param row - Row in which the link is located.\n */\n const onRowClick = (row: any): void => {\n const selectedText = window?.getSelection()?.toString();\n\n if (selectedText?.length === 0 && selectable) {\n const value = keyExpr ? row[keyExpr] : row;\n let currentSelection = value;\n if (!!multiSelect) {\n const existing = selected?.indexOf(value);\n if (existing > -1) {\n currentSelection = [...selected];\n currentSelection.splice(existing, 1);\n } else {\n currentSelection = [...selected, currentSelection];\n }\n }\n\n setSelected(currentSelection)\n props.onSelectionChange && props.onSelectionChange(currentSelection);\n }\n };\n\n /**\n * Function which is called when user clicks checkbox to select or deselect all rows.\n */\n const onSelectAllClick = () => {\n const currentList = currentPageRows.map(row => keyExpr ? row[keyExpr] : row);\n\n switch (selectAllState) {\n case 'all':\n setSelected([...selected].filter(item => !currentList.includes(item)));\n setSelectAllState('none');\n break;\n case 'none':\n setSelected([...selected, ...currentList]);\n setSelectAllState('all');\n break;\n case 'some':\n setSelected([...selected, ...currentList.filter(item => !selected.includes(item))]);\n setSelectAllState('all');\n break;\n }\n };\n\n /**\n * Return Table component.\n */\n return (\n <TableWrapper className={props.border ? 'border' : undefined}>\n <TableHeader {...props}/>\n <TableBody {...props}\n currentPageRows={currentPageRows}\n selected={selected}\n onRowClick={onRowClick}\n sortByColumn={sortTableColumn}\n onSelectAllClick={onSelectAllClick}\n sortProps={sort}\n selectAllState={selectAllState}/>\n <TableFooter {...props}\n onRowsPerPageChange={changeRowsPerPage}\n rowsPerPage={rowsPerPage}\n setIsCollapsed={setIsCollapsed}\n isCollapsed={isCollapsed}\n from={from}\n to={to}\n total={total}\n nextPage={nextPage}\n prevPage={previousPage}/>\n {showLoadingIndicator && (\n <StyledTableSpinner>\n <LoadingIndicator size={Size.Medium}/>\n </StyledTableSpinner>\n )}\n </TableWrapper>\n );\n};\n\nexport default Table;\n"],"mappings":"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"}
1
+ {"version":3,"file":"Table.js","names":["React","Size","StyledTableSpinner","TableWrapper","LoadingIndicator","TableHeader","TableFooter","TableBody","Table","props","onPreviousPageClick","onNextPageClick","onRowsPerPageChange","onTriggerSortingChange","columns","rows","remoteOperations","pagination","showLoadingIndicator","selectable","multiSelect","keyExpr","sortProps","accordion","collapsed","collapsedRows","rowsPerPageLabel","useState","rowsPerPage","setRowsPerPage","filteredRows","setFilteredRows","currentPageRows","setCurrentPageRows","currentPage","setCurrentPage","sort","setSort","from","setFrom","to","setTo","total","setTotal","isCollapsed","setIsCollapsed","selectAllState","setSelectAllState","undefined","selected","setSelected","useEffect","selectedRows","currentList","map","row","count","filter","item","includes","length","filterAndSortRows","tmpFilteredRows","matchFilterCriteria","column","filterValue","key","toLowerCase","indexOf","direction","a","b","rowsFrom","rowsTo","slice","sortTableColumn","columnKey","sortDirection","previousPage","nextPage","changeRowsPerPage","value","onRowClick","selectedText","window","getSelection","toString","currentSelection","existing","splice","onSelectionChange","onSelectAllClick","Medium"],"sources":["../../src/Table/Table.tsx"],"sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\n\n/**\n * Import custom components.\n */\nimport {Size} from '../types'\n\n/**\n * Import custom styles.\n */\nimport {StyledTable, StyledTableSpinner, TableWrapper} from './TableStyles';\n\n/**\n * Import custom types.\n */\nimport {TableProps, TableColumn, TableSortingDirection, TableSortProps} from './TableTypes';\nimport {LoadingIndicator} from '../LoadingIndicator';\nimport TableHeader from './TableHeaders';\nimport TableFooter from './TableFooter';\nimport TableBody from './TableBody';\n\nconst Table: React.FunctionComponent<TableProps> = (props: TableProps) => {\n let {\n onPreviousPageClick,\n onNextPageClick,\n onRowsPerPageChange,\n onTriggerSortingChange,\n columns,\n rows,\n remoteOperations,\n pagination,\n showLoadingIndicator,\n selectable,\n multiSelect,\n keyExpr,\n sortProps,\n accordion,\n collapsed = true,\n collapsedRows,\n rowsPerPageLabel\n } = props;\n\n // States used within the component\n const [rowsPerPage, setRowsPerPage] = React.useState<number>(10);\n const [filteredRows, setFilteredRows] = React.useState<any[]>([]);\n const [currentPageRows, setCurrentPageRows] = React.useState<any[]>([]);\n const [currentPage, setCurrentPage] = React.useState<number>(1);\n const [sort, setSort] = React.useState<TableSortProps | undefined>(sortProps);\n const [from, setFrom] = React.useState<number>();\n const [to, setTo] = React.useState<number>();\n const [total, setTotal] = React.useState<number>();\n\n const [isCollapsed, setIsCollapsed] = React.useState(true);\n\n const [selectAllState, setSelectAllState] = React.useState<'all' | 'some' | 'none'>('none');\n\n const [selected, setSelected] = React.useState<any | any[]>(multiSelect ? [] : undefined);\n\n React.useEffect(() => {\n setSort(sortProps);\n }, [sortProps])\n\n React.useEffect(() => {\n setSelected(props.selectedRows || (multiSelect ? [] : undefined))\n }, [props.selectedRows, multiSelect])\n\n /**\n * update select all checkbox state\n */\n React.useEffect(() => {\n if (multiSelect) {\n const currentList = currentPageRows.map(row => keyExpr ? row[keyExpr] : row);\n const count = selected.filter((item: any) => currentList.includes(item)).length;\n\n setSelectAllState(count === currentList.length ? 'all' : count > 0 ? 'some' : 'none');\n }\n }, [currentPageRows, multiSelect, selected, keyExpr])\n\n /**\n * Takes care of remote pagination.\n * Works only in case remote pagination is set to true.\n */\n React.useEffect(() => {\n if (remoteOperations) {\n setCurrentPageRows(rows);\n\n // Let's assign pagination values\n setFrom(pagination?.from);\n setTo(pagination?.to);\n setTotal(pagination?.total);\n setCurrentPage(pagination?.currentPage!);\n setRowsPerPage(pagination?.rowsPerPage!);\n }\n }, [remoteOperations, pagination, rows]);\n\n /**\n * Sets number of rows to display when accordion.\n */\n React.useEffect(() => {\n if (!accordion) return;\n\n setRowsPerPage(isCollapsed ? collapsedRows || 10 : rows.length);\n }, [rows, accordion, collapsedRows, isCollapsed])\n\n React.useEffect(() => {\n if (!accordion) return;\n\n setIsCollapsed(!!collapsed);\n }, [accordion, collapsed])\n\n /**\n * Filters out a rows by specific column filters and sorts them if any sorting is set.\n * @returns Filtered and sorted rows.\n */\n const filterAndSortRows = (): any[] => {\n let tmpFilteredRows = rows.filter((row) => {\n // Let's start with matched filter criteria\n let matchFilterCriteria = true;\n\n // Let's go through columns\n for (const column of columns) {\n // Let's check if filter value is specified for the column\n // And if it doesn't match the current row column value\n // Then let's update match filter criteria to failed\n if (column.filterValue && row[column.key].toLowerCase().indexOf(column.filterValue.toLowerCase()) === -1) {\n matchFilterCriteria = false;\n }\n }\n\n // Let's return row only in case match filter criteria succeeds\n if (matchFilterCriteria) {\n return row;\n }\n });\n\n // Let's apply sorting if needed\n if (!!sort?.column && !!sort?.direction) {\n // Let's sort the rows\n tmpFilteredRows.sort((a, b) => {\n if (a[sort.column!] > b[sort.column!]) {\n return sort.direction! === 'asc' ? 1 : -1;\n } else if (a[sort.column!] < b[sort.column!]) {\n return sort.direction! === 'asc' ? -1 : 1;\n } else {\n return 0;\n }\n });\n }\n\n // Let's return filtered rows\n return tmpFilteredRows;\n };\n\n /**\n * Takes care of local pagination.\n * Works only in case remote pagination is not defined or is set to false.\n */\n React.useEffect(() => {\n if (!remoteOperations) {\n // Let's retrieve temporary filtered rows and update globally filtered rows\n const tmpFilteredRows = filterAndSortRows();\n setFilteredRows(tmpFilteredRows);\n setTotal(tmpFilteredRows.length);\n\n // Assign rows from and rows to\n const rowsFrom = (currentPage - 1) * rowsPerPage;\n const rowsTo = rowsFrom + rowsPerPage >= tmpFilteredRows.length ? tmpFilteredRows.length : rowsFrom + rowsPerPage;\n\n // Set from and to values\n setFrom(rowsFrom + 1);\n setTo(rowsTo);\n\n // Filter out the rows\n setCurrentPageRows(tmpFilteredRows.slice(rowsFrom, rowsTo));\n }\n }, [rowsPerPage, rows, currentPage, columns, sort, remoteOperations]);\n\n\n /**\n * Applies a specific sorting to a column.\n * If no sorting exists, then applies ascending initially\n * @param column - Column to which sorting should be applied.\n */\n const sortTableColumn = (column: TableColumn): void => {\n let columnKey = '';\n let sortDirection: TableSortingDirection | undefined = undefined;\n\n if (sort?.column !== column.key) {\n columnKey = column.key;\n sortDirection = 'asc';\n } else {\n if (sort?.direction === 'desc') {\n columnKey = '';\n sortDirection = undefined;\n } else {\n columnKey = sort.column;\n sortDirection = sort.direction === 'asc' ? 'desc' : 'asc';\n }\n }\n\n if(columnKey == '')\n setSort(undefined);\n else\n setSort({column: columnKey, direction: sortDirection!});\n\n remoteOperations && onTriggerSortingChange && onTriggerSortingChange(columnKey, sortDirection);\n };\n\n /**\n * Navigates user back to the previous page and updates the current table page.\n */\n const previousPage = () => {\n if (remoteOperations) {\n // Let's inform parent component about page change\n if (onPreviousPageClick) {\n onPreviousPageClick();\n }\n } else {\n // Let's change the page within the component\n setCurrentPage(currentPage > 1 ? currentPage - 1 : 1);\n }\n };\n\n /**\n * Navigates user to the next page and updates the current table page.\n */\n const nextPage = () => {\n if (remoteOperations) {\n // Let's inform parent component about page change\n if (onNextPageClick) {\n onNextPageClick();\n }\n } else {\n // Let's change the page within the component\n setCurrentPage(currentPage * rowsPerPage >= filteredRows.length ? currentPage : currentPage + 1);\n }\n };\n\n /**\n * Updates the rows per page value and refreshes the table content accordingly.\n * @param value - Newly selected rows per page value.\n */\n const changeRowsPerPage = (value: number) => {\n // Let's check if we are using remote pagination\n if (remoteOperations) {\n // Inform parent component about rows per page change\n if (onRowsPerPageChange) {\n onRowsPerPageChange(value);\n }\n } else {\n // Let's reset current page to 1\n setCurrentPage(1);\n }\n\n // Let's set rows per page\n setRowsPerPage(value);\n };\n\n\n /**\n * Function which is called when a mouse click happens on a row to pass data to the parent component.\n * @param row - Row in which the link is located.\n */\n const onRowClick = (row: any): void => {\n const selectedText = window?.getSelection()?.toString();\n\n if (selectedText?.length === 0 && selectable) {\n const value = keyExpr ? row[keyExpr] : row;\n let currentSelection = value;\n if (!!multiSelect) {\n const existing = selected?.indexOf(value);\n if (existing > -1) {\n currentSelection = [...selected];\n currentSelection.splice(existing, 1);\n } else {\n currentSelection = [...selected, currentSelection];\n }\n }\n\n setSelected(currentSelection)\n props.onSelectionChange && props.onSelectionChange(currentSelection);\n }\n };\n\n /**\n * Function which is called when user clicks checkbox to select or deselect all rows.\n */\n const onSelectAllClick = () => {\n const currentList = currentPageRows.map(row => keyExpr ? row[keyExpr] : row);\n\n switch (selectAllState) {\n case 'all':\n setSelected([...selected].filter(item => !currentList.includes(item)));\n setSelectAllState('none');\n break;\n case 'none':\n setSelected([...selected, ...currentList]);\n setSelectAllState('all');\n break;\n case 'some':\n setSelected([...selected, ...currentList.filter(item => !selected.includes(item))]);\n setSelectAllState('all');\n break;\n }\n };\n\n /**\n * Return Table component.\n */\n return (\n <TableWrapper>\n <TableHeader {...props}/>\n <TableBody {...props}\n currentPageRows={currentPageRows}\n selected={selected}\n onRowClick={onRowClick}\n sortByColumn={sortTableColumn}\n onSelectAllClick={onSelectAllClick}\n sortProps={sort}\n selectAllState={selectAllState}/>\n <TableFooter {...props}\n onRowsPerPageChange={changeRowsPerPage}\n rowsPerPage={rowsPerPage}\n setIsCollapsed={setIsCollapsed}\n isCollapsed={isCollapsed}\n from={from}\n to={to}\n total={total}\n nextPage={nextPage}\n prevPage={previousPage}/>\n {showLoadingIndicator && (\n <StyledTableSpinner>\n <LoadingIndicator size={Size.Medium}/>\n </StyledTableSpinner>\n )}\n </TableWrapper>\n );\n};\n\nexport default Table;\n"],"mappings":"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"}
package/dist/Table/TableStyles.cjs CHANGED
@@ -17,9 +17,9 @@ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _temp
17
17
  * Table styles
18
18
  */
19
19
 
20
- var TableWrapper = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n position: relative;\n\n &.border{\n border-left: 1px solid ", ";\n border-right: 1px solid ", ";\n }\n"])), _styles.COLORS.neutral_200, _styles.COLORS.neutral_200);
20
+ var TableWrapper = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n position: relative;\n"])));
21
21
  exports.TableWrapper = TableWrapper;
22
- var StyledTable = _styledComponents.default.table(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n background: transparent;\n border-collapse: collapse;\n width: 100%;\n\n &.fixed {\n table-layout: fixed;\n }\n\n &.auto {\n table-layout: auto;\n }\n"])));
22
+ var StyledTable = _styledComponents.default.table(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n background: transparent;\n width: 100%;\n\n &.fixed {\n table-layout: fixed;\n }\n\n &.auto {\n table-layout: auto;\n }\n"])));
23
23
  exports.StyledTable = StyledTable;
24
24
  var StyledTableHeader = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n"])));
25
25
  exports.StyledTableHeader = StyledTableHeader;
@@ -37,11 +37,11 @@ var StyledTableHeaderColumnSortDirection = _styledComponents.default.span(_templ
37
37
  exports.StyledTableHeaderColumnSortDirection = StyledTableHeaderColumnSortDirection;
38
38
  var StyledTableHeaderColumn = _styledComponents.default.th(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["\n ", "\n position: relative;\n text-align: unset;\n background-color: ", ";\n\n //fixes header heights no idea why\n height: 1px;\n\n &.sortable {\n cursor: pointer;\n\n &:hover {\n background-color: ", ";\n color: ", ";\n z-index: ", ";\n }\n\n &:active {\n background-color: ", ";\n color: ", ";\n z-index: ", ";\n }\n\n &:focus {\n ", "\n }\n }\n\n &.left {\n & > div {\n justify-content: left;\n }\n }\n\n &.right {\n & > div {\n justify-content: right;\n }\n }\n\n &.center {\n & > div {\n justify-content: center;\n }\n }\n\n &.sortable ", " > svg {\n opacity: 0;\n }\n\n &.sortable.sorted ", " > svg {\n opacity: 1;\n }\n\n &.sorted {\n background-color: ", ";\n }\n"])), (0, _typography.ComponentSStyling)(_typography.ComponentTextStyle.Bold, _styles.COLORS.neutral_600), _styles.COLORS.white, _styles.COLORS.primary_20, _styles.COLORS.primary_700, _zIndexes.Z_INDEXES.hover, _styles.COLORS.primary_100, _styles.COLORS.primary_800, _zIndexes.Z_INDEXES.active, _styles.focusStyles, StyledTableHeaderColumnContent, StyledTableHeaderColumnContent, _styles.COLORS.neutral_20);
39
39
  exports.StyledTableHeaderColumn = StyledTableHeaderColumn;
40
- var StyledTableBodyRow = _styledComponents.default.tr(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2.default)(["\n cursor: pointer;\n position: relative;\n outline: none;\n background-color: ", ";\n \n &:not(:last-child) {\n border-bottom: 1px solid ", ";\n }\n\n &.selected{\n background-color: ", ";\n }\n \n &:hover {\n background-color: ", ";\n z-index: ", ";\n }\n\n &:focus {\n ", "\n }\n\n &:active {\n z-index: ", ";\n }\n\n"])), _styles.COLORS.white, _styles.COLORS.neutral_200, _styles.COLORS.primary_100, _styles.COLORS.primary_100, _zIndexes.Z_INDEXES.hover, _styles.focusStyles, _zIndexes.Z_INDEXES.active);
40
+ var StyledTableBodyRow = _styledComponents.default.tr(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2.default)(["\n cursor: pointer;\n position: relative;\n outline: none;\n\n &.selected{\n background-color: ", ";\n }\n \n &:hover {\n background-color: ", ";\n z-index: ", ";\n }\n\n &:focus {\n ", "\n }\n\n &:active {\n z-index: ", ";\n }\n\n"])), _styles.COLORS.primary_100, _styles.COLORS.primary_200, _zIndexes.Z_INDEXES.hover, _styles.focusStyles, _zIndexes.Z_INDEXES.active);
41
41
  exports.StyledTableBodyRow = StyledTableBodyRow;
42
42
  var StyledTableNoRowsLabelRow = _styledComponents.default.tr(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteral2.default)(["\n position: relative;\n outline: none;\n background-color: ", ";\n"])), _styles.COLORS.neutral_50);
43
43
  exports.StyledTableNoRowsLabelRow = StyledTableNoRowsLabelRow;
44
- var StyledTableBody = _styledComponents.default.tbody(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteral2.default)(["\n"])));
44
+ var StyledTableBody = _styledComponents.default.tbody(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteral2.default)(["\n ", ":nth-child(odd):not(.selected):not(:hover):not(:focus):not(:active) {\n background-color: ", ";\n }\n\n ", ":nth-child(even):not(.selected):not(:hover):not(:focus):not(:active) {\n background-color: ", ";\n }\n"])), StyledTableBodyRow, _styles.COLORS.neutral_50, StyledTableBodyRow, _styles.COLORS.neutral_20);
45
45
  exports.StyledTableBody = StyledTableBody;
46
46
  var StyledTableCell = _styledComponents.default.td(_templateObject14 || (_templateObject14 = (0, _taggedTemplateLiteral2.default)([""])));
47
47
  exports.StyledTableCell = StyledTableCell;
package/dist/Table/TableStyles.cjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"TableStyles.cjs","names":["TableWrapper","styled","div","COLORS","neutral_200","StyledTable","table","StyledTableHeader","StyledTableHeaderTitle","StyledTableHeaderTitleContent","ComponentLStyling","ComponentTextStyle","Bold","black","StyledTableHeaderRow","thead","StyledTableHeaderColumns","tr","StyledTableHeaderColumnContent","StyledTableHeaderColumnSortDirection","span","StyledTableHeaderColumn","th","ComponentSStyling","neutral_600","white","primary_20","primary_700","Z_INDEXES","hover","primary_100","primary_800","active","focusStyles","neutral_20","StyledTableBodyRow","StyledTableNoRowsLabelRow","neutral_50","StyledTableBody","tbody","StyledTableCell","td","StyledTableCellContent","Regular","StyledCheckBox","StyledTableCellIcon","neutral_700","StyledTableCellText","StyledTableFooter","StyledTableFooterContent","StyledTableFooterCurrentInfo","ComponentXSStyling","StyledTableFooterControls","StyledTableSpinner","backdrop","StyledTableFooterCollapseButton","button","ComponentMStyling","StyledTableBodyWrapper","scrollBarStyling","Size","Small"],"sources":["../../src/Table/TableStyles.ts"],"sourcesContent":["/**\n * Import third-party libraries.\n */\nimport styled from 'styled-components';\n\n/**\n * Import custom style properties.\n */\nimport {COLORS, focusStyles, scrollBarStyling} from '../styles';\nimport {\n ComponentLStyling,\n ComponentMStyling,\n ComponentSStyling,\n ComponentTextStyle,\n ComponentXSStyling\n} from '../styles/typography';\nimport {Z_INDEXES} from '../styles/z-indexes';\nimport {StyledCheckBox} from '../InputFields/Checkbox';\nimport {Size} from \"../types\";\n\n/**\n * Table styles\n */\n\nexport const TableWrapper = styled.div`\n position: relative;\n\n &.border{\n border-left: 1px solid ${COLORS.neutral_200};\n border-right: 1px solid ${COLORS.neutral_200};\n }\n`;\n\n\nexport const StyledTable = styled.table`\n background: transparent;\n border-collapse: collapse;\n width: 100%;\n\n &.fixed {\n table-layout: fixed;\n }\n\n &.auto {\n table-layout: auto;\n }\n`;\n\nexport const StyledTableHeader = styled.div`\n`;\n\nexport const StyledTableHeaderTitle = styled.div`\n`;\n\nexport const StyledTableHeaderTitleContent = styled.div`\n display: flex;\n align-items: center;\n justify-content: space-between;\n width: 100%;\n box-sizing: border-box;\n min-height: 56px;\n border-bottom: 1px solid ${COLORS.neutral_200};\n border-top: 2px solid ${COLORS.neutral_200};\n padding: 0 16px;\n\n ${ComponentLStyling(ComponentTextStyle.Bold, COLORS.black)}\n .title-menu {\n margin-right: -16px;\n }\n`;\n\nexport const StyledTableHeaderRow = styled.thead`\n`;\n\nexport const StyledTableHeaderColumns = styled.tr`\n`;\n\nexport const StyledTableHeaderColumnContent = styled.div`\n box-sizing: border-box;\n min-height: 56px;\n padding: 0 16px;\n height: 100%;\n display: flex;\n align-items: center;\n justify-content: space-between;\n border-top: 1px solid ${COLORS.neutral_200};\n border-bottom: 1px solid ${COLORS.neutral_200};\n`;\n\nexport const StyledTableHeaderColumnSortDirection = styled.span`\n width: 24px;\n height: 24px;\n`;\n\nexport const StyledTableHeaderColumn = styled.th`\n ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n position: relative;\n text-align: unset;\n background-color: ${COLORS.white};\n\n //fixes header heights no idea why\n height: 1px;\n\n &.sortable {\n cursor: pointer;\n\n &:hover {\n background-color: ${COLORS.primary_20};\n color: ${COLORS.primary_700};\n z-index: ${Z_INDEXES.hover};\n }\n\n &:active {\n background-color: ${COLORS.primary_100};\n color: ${COLORS.primary_800};\n z-index: ${Z_INDEXES.active};\n }\n\n &:focus {\n ${focusStyles}\n }\n }\n\n &.left {\n & > div {\n justify-content: left;\n }\n }\n\n &.right {\n & > div {\n justify-content: right;\n }\n }\n\n &.center {\n & > div {\n justify-content: center;\n }\n }\n\n &.sortable ${StyledTableHeaderColumnContent} > svg {\n opacity: 0;\n }\n\n &.sortable.sorted ${StyledTableHeaderColumnContent} > svg {\n opacity: 1;\n }\n\n &.sorted {\n background-color: ${COLORS.neutral_20};\n }\n`;\n\nexport const StyledTableBodyRow = styled.tr`\n cursor: pointer;\n position: relative;\n outline: none;\n background-color: ${COLORS.white};\n \n &:not(:last-child) {\n border-bottom: 1px solid ${COLORS.neutral_200};\n }\n\n &.selected{\n background-color: ${COLORS.primary_100};\n }\n \n &:hover {\n background-color: ${COLORS.primary_100};\n z-index: ${Z_INDEXES.hover};\n }\n\n &:focus {\n ${focusStyles}\n }\n\n &:active {\n z-index: ${Z_INDEXES.active};\n }\n\n`;\n\nexport const StyledTableNoRowsLabelRow = styled.tr`\n position: relative;\n outline: none;\n background-color: ${COLORS.neutral_50};\n`;\n\nexport const StyledTableBody = styled.tbody`\n`;\n\n\nexport const StyledTableCell = styled.td``;\n\nexport const StyledTableCellContent = styled.div`\n min-height: 48px;\n\n padding: 0 16px;\n ${ComponentSStyling(ComponentTextStyle.Regular, COLORS.black)}\n\n display: flex;\n align-items: center;\n justify-content: left;\n gap: 8px;\n\n &.truncate-text,\n &.truncate-text span {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n &.left {\n justify-content: left;\n }\n\n &.right {\n justify-content: right;\n }\n\n &.center {\n justify-content: center;\n }\n\n a:first-letter,\n span:first-letter {\n text-transform: uppercase;\n }\n \n ${StyledCheckBox}{\n width: fit-content;\n }\n`;\n\nexport const StyledTableCellIcon = styled.div`\n color: ${COLORS.neutral_700};\n width: 24px;\n height: 24px;\n\n svg {\n color: ${COLORS.neutral_700};\n width: 24px;\n height: 24px;\n }\n`;\n\nexport const StyledTableCellText = styled.span`\n padding: 12px 0;\n`;\n\n\nexport const StyledTableFooter = styled.div`\n`;\n\nexport const StyledTableFooterContent = styled.div`\n border-top: 2px solid ${COLORS.neutral_200};\n border-bottom: 1px solid ${COLORS.neutral_200};\n box-sizing: border-box;\n min-height: 56px;\n\n display: flex;\n align-items: center;\n justify-content: right;\n\n`;\n\nexport const StyledTableFooterCurrentInfo = styled.span`\n padding: 0 16px;\n ${ComponentXSStyling(ComponentTextStyle.Regular, COLORS.black)}\n`;\n\nexport const StyledTableFooterControls = styled.div`\n display: flex;\n`;\n\nexport const StyledTableSpinner = styled.div`\n height: 100%;\n width: 100%;\n position: absolute;\n background-color: rgba(255, 255, 255, 0.75);\n top: 0;\n z-index: ${Z_INDEXES.backdrop};\n`;\n\nexport const StyledTableFooterCollapseButton = styled.button`\n position: relative;\n border-bottom: 1px solid ${COLORS.neutral_200};\n border-top: 1px solid ${COLORS.neutral_200};\n border-left: none;\n border-right: none;\n box-sizing: border-box;\n min-height: 48px;\n display: flex;\n width: 100%;\n align-items: center;\n justify-content: center;\n gap: 4px;\n background: ${COLORS.white};\n\n cursor: pointer;\n\n ${ComponentMStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n \n &:focus {\n ${focusStyles}\n }\n\n &:hover {\n z-index: ${Z_INDEXES.hover};\n background: ${COLORS.primary_20};\n color: ${COLORS.primary_700};\n }\n\n &:active {\n z-index: ${Z_INDEXES.active};\n background: ${COLORS.primary_100};\n color: ${COLORS.primary_800};\n }\n\n &:disabled {\n display: none;\n }\n\n`;\n\n\nexport const StyledTableBodyWrapper = styled.div`\n overflow-x: auto;\n ${scrollBarStyling(Size.Small)}\n\n ::-webkit-scrollbar-track {\n margin: 6px;\n }\n\n &.scrollable{\n margin-bottom: 6px;\n padding-bottom: 10px;\n }\n`;\n"],"mappings":"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"}
1
+ {"version":3,"file":"TableStyles.cjs","names":["TableWrapper","styled","div","StyledTable","table","StyledTableHeader","StyledTableHeaderTitle","StyledTableHeaderTitleContent","COLORS","neutral_200","ComponentLStyling","ComponentTextStyle","Bold","black","StyledTableHeaderRow","thead","StyledTableHeaderColumns","tr","StyledTableHeaderColumnContent","StyledTableHeaderColumnSortDirection","span","StyledTableHeaderColumn","th","ComponentSStyling","neutral_600","white","primary_20","primary_700","Z_INDEXES","hover","primary_100","primary_800","active","focusStyles","neutral_20","StyledTableBodyRow","primary_200","StyledTableNoRowsLabelRow","neutral_50","StyledTableBody","tbody","StyledTableCell","td","StyledTableCellContent","Regular","StyledCheckBox","StyledTableCellIcon","neutral_700","StyledTableCellText","StyledTableFooter","StyledTableFooterContent","StyledTableFooterCurrentInfo","ComponentXSStyling","StyledTableFooterControls","StyledTableSpinner","backdrop","StyledTableFooterCollapseButton","button","ComponentMStyling","StyledTableBodyWrapper","scrollBarStyling","Size","Small"],"sources":["../../src/Table/TableStyles.ts"],"sourcesContent":["/**\n * Import third-party libraries.\n */\nimport styled from 'styled-components';\n\n/**\n * Import custom style properties.\n */\nimport {COLORS, focusStyles, scrollBarStyling} from '../styles';\nimport {\n ComponentLStyling,\n ComponentMStyling,\n ComponentSStyling,\n ComponentTextStyle,\n ComponentXSStyling\n} from '../styles/typography';\nimport {Z_INDEXES} from '../styles/z-indexes';\nimport {StyledCheckBox} from '../InputFields/Checkbox';\nimport {Size} from \"../types\";\n\n/**\n * Table styles\n */\n\nexport const TableWrapper = styled.div`\n position: relative;\n`;\n\n\nexport const StyledTable = styled.table`\n background: transparent;\n width: 100%;\n\n &.fixed {\n table-layout: fixed;\n }\n\n &.auto {\n table-layout: auto;\n }\n`;\n\nexport const StyledTableHeader = styled.div`\n`;\n\nexport const StyledTableHeaderTitle = styled.div`\n`;\n\nexport const StyledTableHeaderTitleContent = styled.div`\n display: flex;\n align-items: center;\n justify-content: space-between;\n width: 100%;\n box-sizing: border-box;\n min-height: 56px;\n border-bottom: 1px solid ${COLORS.neutral_200};\n border-top: 2px solid ${COLORS.neutral_200};\n padding: 0 16px;\n\n ${ComponentLStyling(ComponentTextStyle.Bold, COLORS.black)}\n .title-menu {\n margin-right: -16px;\n }\n`;\n\nexport const StyledTableHeaderRow = styled.thead`\n`;\n\nexport const StyledTableHeaderColumns = styled.tr`\n`;\n\nexport const StyledTableHeaderColumnContent = styled.div`\n box-sizing: border-box;\n min-height: 56px;\n padding: 0 16px;\n height: 100%;\n display: flex;\n align-items: center;\n justify-content: space-between;\n border-top: 1px solid ${COLORS.neutral_200};\n border-bottom: 1px solid ${COLORS.neutral_200};\n`;\n\nexport const StyledTableHeaderColumnSortDirection = styled.span`\n width: 24px;\n height: 24px;\n`;\n\nexport const StyledTableHeaderColumn = styled.th`\n ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n position: relative;\n text-align: unset;\n background-color: ${COLORS.white};\n\n //fixes header heights no idea why\n height: 1px;\n\n &.sortable {\n cursor: pointer;\n\n &:hover {\n background-color: ${COLORS.primary_20};\n color: ${COLORS.primary_700};\n z-index: ${Z_INDEXES.hover};\n }\n\n &:active {\n background-color: ${COLORS.primary_100};\n color: ${COLORS.primary_800};\n z-index: ${Z_INDEXES.active};\n }\n\n &:focus {\n ${focusStyles}\n }\n }\n\n &.left {\n & > div {\n justify-content: left;\n }\n }\n\n &.right {\n & > div {\n justify-content: right;\n }\n }\n\n &.center {\n & > div {\n justify-content: center;\n }\n }\n\n &.sortable ${StyledTableHeaderColumnContent} > svg {\n opacity: 0;\n }\n\n &.sortable.sorted ${StyledTableHeaderColumnContent} > svg {\n opacity: 1;\n }\n\n &.sorted {\n background-color: ${COLORS.neutral_20};\n }\n`;\n\nexport const StyledTableBodyRow = styled.tr`\n cursor: pointer;\n position: relative;\n outline: none;\n\n &.selected{\n background-color: ${COLORS.primary_100};\n }\n \n &:hover {\n background-color: ${COLORS.primary_200};\n z-index: ${Z_INDEXES.hover};\n }\n\n &:focus {\n ${focusStyles}\n }\n\n &:active {\n z-index: ${Z_INDEXES.active};\n }\n\n`;\n\nexport const StyledTableNoRowsLabelRow = styled.tr`\n position: relative;\n outline: none;\n background-color: ${COLORS.neutral_50};\n`;\n\nexport const StyledTableBody = styled.tbody`\n ${StyledTableBodyRow}:nth-child(odd):not(.selected):not(:hover):not(:focus):not(:active) {\n background-color: ${COLORS.neutral_50};\n }\n\n ${StyledTableBodyRow}:nth-child(even):not(.selected):not(:hover):not(:focus):not(:active) {\n background-color: ${COLORS.neutral_20};\n }\n`;\n\n\nexport const StyledTableCell = styled.td``;\n\nexport const StyledTableCellContent = styled.div`\n min-height: 48px;\n\n padding: 0 16px;\n ${ComponentSStyling(ComponentTextStyle.Regular, COLORS.black)}\n\n display: flex;\n align-items: center;\n justify-content: left;\n gap: 8px;\n\n &.truncate-text,\n &.truncate-text span {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n &.left {\n justify-content: left;\n }\n\n &.right {\n justify-content: right;\n }\n\n &.center {\n justify-content: center;\n }\n\n a:first-letter,\n span:first-letter {\n text-transform: uppercase;\n }\n \n ${StyledCheckBox}{\n width: fit-content;\n }\n`;\n\nexport const StyledTableCellIcon = styled.div`\n color: ${COLORS.neutral_700};\n width: 24px;\n height: 24px;\n\n svg {\n color: ${COLORS.neutral_700};\n width: 24px;\n height: 24px;\n }\n`;\n\nexport const StyledTableCellText = styled.span`\n padding: 12px 0;\n`;\n\n\nexport const StyledTableFooter = styled.div`\n`;\n\nexport const StyledTableFooterContent = styled.div`\n border-top: 2px solid ${COLORS.neutral_200};\n border-bottom: 1px solid ${COLORS.neutral_200};\n box-sizing: border-box;\n min-height: 56px;\n\n display: flex;\n align-items: center;\n justify-content: right;\n\n`;\n\nexport const StyledTableFooterCurrentInfo = styled.span`\n padding: 0 16px;\n ${ComponentXSStyling(ComponentTextStyle.Regular, COLORS.black)}\n`;\n\nexport const StyledTableFooterControls = styled.div`\n display: flex;\n`;\n\nexport const StyledTableSpinner = styled.div`\n height: 100%;\n width: 100%;\n position: absolute;\n background-color: rgba(255, 255, 255, 0.75);\n top: 0;\n z-index: ${Z_INDEXES.backdrop};\n`;\n\nexport const StyledTableFooterCollapseButton = styled.button`\n position: relative;\n border-bottom: 1px solid ${COLORS.neutral_200};\n border-top: 1px solid ${COLORS.neutral_200};\n border-left: none;\n border-right: none;\n box-sizing: border-box;\n min-height: 48px;\n display: flex;\n width: 100%;\n align-items: center;\n justify-content: center;\n gap: 4px;\n background: ${COLORS.white};\n\n cursor: pointer;\n\n ${ComponentMStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n \n &:focus {\n ${focusStyles}\n }\n\n &:hover {\n z-index: ${Z_INDEXES.hover};\n background: ${COLORS.primary_20};\n color: ${COLORS.primary_700};\n }\n\n &:active {\n z-index: ${Z_INDEXES.active};\n background: ${COLORS.primary_100};\n color: ${COLORS.primary_800};\n }\n\n &:disabled {\n display: none;\n }\n\n`;\n\n\nexport const StyledTableBodyWrapper = styled.div`\n overflow-x: auto;\n ${scrollBarStyling(Size.Small)}\n\n ::-webkit-scrollbar-track {\n margin: 6px;\n }\n\n &.scrollable{\n margin-bottom: 6px;\n padding-bottom: 10px;\n }\n`;\n"],"mappings":"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"}
package/dist/Table/TableStyles.js CHANGED
@@ -18,8 +18,8 @@ import { Size } from "../types";
18
18
  * Table styles
19
19
  */
20
20
 
21
- export var TableWrapper = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n position: relative;\n\n &.border{\n border-left: 1px solid ", ";\n border-right: 1px solid ", ";\n }\n"])), COLORS.neutral_200, COLORS.neutral_200);
22
- export var StyledTable = styled.table(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n background: transparent;\n border-collapse: collapse;\n width: 100%;\n\n &.fixed {\n table-layout: fixed;\n }\n\n &.auto {\n table-layout: auto;\n }\n"])));
21
+ export var TableWrapper = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n position: relative;\n"])));
22
+ export var StyledTable = styled.table(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n background: transparent;\n width: 100%;\n\n &.fixed {\n table-layout: fixed;\n }\n\n &.auto {\n table-layout: auto;\n }\n"])));
23
23
  export var StyledTableHeader = styled.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n"])));
24
24
  export var StyledTableHeaderTitle = styled.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n"])));
25
25
  export var StyledTableHeaderTitleContent = styled.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n width: 100%;\n box-sizing: border-box;\n min-height: 56px;\n border-bottom: 1px solid ", ";\n border-top: 2px solid ", ";\n padding: 0 16px;\n\n ", "\n .title-menu {\n margin-right: -16px;\n }\n"])), COLORS.neutral_200, COLORS.neutral_200, ComponentLStyling(ComponentTextStyle.Bold, COLORS.black));
@@ -28,9 +28,9 @@ export var StyledTableHeaderColumns = styled.tr(_templateObject7 || (_templateOb
28
28
  export var StyledTableHeaderColumnContent = styled.div(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n box-sizing: border-box;\n min-height: 56px;\n padding: 0 16px;\n height: 100%;\n display: flex;\n align-items: center;\n justify-content: space-between;\n border-top: 1px solid ", ";\n border-bottom: 1px solid ", ";\n"])), COLORS.neutral_200, COLORS.neutral_200);
29
29
  export var StyledTableHeaderColumnSortDirection = styled.span(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n width: 24px;\n height: 24px;\n"])));
30
30
  export var StyledTableHeaderColumn = styled.th(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n ", "\n position: relative;\n text-align: unset;\n background-color: ", ";\n\n //fixes header heights no idea why\n height: 1px;\n\n &.sortable {\n cursor: pointer;\n\n &:hover {\n background-color: ", ";\n color: ", ";\n z-index: ", ";\n }\n\n &:active {\n background-color: ", ";\n color: ", ";\n z-index: ", ";\n }\n\n &:focus {\n ", "\n }\n }\n\n &.left {\n & > div {\n justify-content: left;\n }\n }\n\n &.right {\n & > div {\n justify-content: right;\n }\n }\n\n &.center {\n & > div {\n justify-content: center;\n }\n }\n\n &.sortable ", " > svg {\n opacity: 0;\n }\n\n &.sortable.sorted ", " > svg {\n opacity: 1;\n }\n\n &.sorted {\n background-color: ", ";\n }\n"])), ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_600), COLORS.white, COLORS.primary_20, COLORS.primary_700, Z_INDEXES.hover, COLORS.primary_100, COLORS.primary_800, Z_INDEXES.active, focusStyles, StyledTableHeaderColumnContent, StyledTableHeaderColumnContent, COLORS.neutral_20);
31
- export var StyledTableBodyRow = styled.tr(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n cursor: pointer;\n position: relative;\n outline: none;\n background-color: ", ";\n \n &:not(:last-child) {\n border-bottom: 1px solid ", ";\n }\n\n &.selected{\n background-color: ", ";\n }\n \n &:hover {\n background-color: ", ";\n z-index: ", ";\n }\n\n &:focus {\n ", "\n }\n\n &:active {\n z-index: ", ";\n }\n\n"])), COLORS.white, COLORS.neutral_200, COLORS.primary_100, COLORS.primary_100, Z_INDEXES.hover, focusStyles, Z_INDEXES.active);
31
+ export var StyledTableBodyRow = styled.tr(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n cursor: pointer;\n position: relative;\n outline: none;\n\n &.selected{\n background-color: ", ";\n }\n \n &:hover {\n background-color: ", ";\n z-index: ", ";\n }\n\n &:focus {\n ", "\n }\n\n &:active {\n z-index: ", ";\n }\n\n"])), COLORS.primary_100, COLORS.primary_200, Z_INDEXES.hover, focusStyles, Z_INDEXES.active);
32
32
  export var StyledTableNoRowsLabelRow = styled.tr(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["\n position: relative;\n outline: none;\n background-color: ", ";\n"])), COLORS.neutral_50);
33
- export var StyledTableBody = styled.tbody(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["\n"])));
33
+ export var StyledTableBody = styled.tbody(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["\n ", ":nth-child(odd):not(.selected):not(:hover):not(:focus):not(:active) {\n background-color: ", ";\n }\n\n ", ":nth-child(even):not(.selected):not(:hover):not(:focus):not(:active) {\n background-color: ", ";\n }\n"])), StyledTableBodyRow, COLORS.neutral_50, StyledTableBodyRow, COLORS.neutral_20);
34
34
  export var StyledTableCell = styled.td(_templateObject14 || (_templateObject14 = _taggedTemplateLiteral([""])));
35
35
  export var StyledTableCellContent = styled.div(_templateObject15 || (_templateObject15 = _taggedTemplateLiteral(["\n min-height: 48px;\n\n padding: 0 16px;\n ", "\n\n display: flex;\n align-items: center;\n justify-content: left;\n gap: 8px;\n\n &.truncate-text,\n &.truncate-text span {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n &.left {\n justify-content: left;\n }\n\n &.right {\n justify-content: right;\n }\n\n &.center {\n justify-content: center;\n }\n\n a:first-letter,\n span:first-letter {\n text-transform: uppercase;\n }\n \n ", "{\n width: fit-content;\n }\n"])), ComponentSStyling(ComponentTextStyle.Regular, COLORS.black), StyledCheckBox);
36
36
  export var StyledTableCellIcon = styled.div(_templateObject16 || (_templateObject16 = _taggedTemplateLiteral(["\n color: ", ";\n width: 24px;\n height: 24px;\n\n svg {\n color: ", ";\n width: 24px;\n height: 24px;\n }\n"])), COLORS.neutral_700, COLORS.neutral_700);
package/dist/Table/TableStyles.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"TableStyles.js","names":["styled","COLORS","focusStyles","scrollBarStyling","ComponentLStyling","ComponentMStyling","ComponentSStyling","ComponentTextStyle","ComponentXSStyling","Z_INDEXES","StyledCheckBox","Size","TableWrapper","div","neutral_200","StyledTable","table","StyledTableHeader","StyledTableHeaderTitle","StyledTableHeaderTitleContent","Bold","black","StyledTableHeaderRow","thead","StyledTableHeaderColumns","tr","StyledTableHeaderColumnContent","StyledTableHeaderColumnSortDirection","span","StyledTableHeaderColumn","th","neutral_600","white","primary_20","primary_700","hover","primary_100","primary_800","active","neutral_20","StyledTableBodyRow","StyledTableNoRowsLabelRow","neutral_50","StyledTableBody","tbody","StyledTableCell","td","StyledTableCellContent","Regular","StyledTableCellIcon","neutral_700","StyledTableCellText","StyledTableFooter","StyledTableFooterContent","StyledTableFooterCurrentInfo","StyledTableFooterControls","StyledTableSpinner","backdrop","StyledTableFooterCollapseButton","button","StyledTableBodyWrapper","Small"],"sources":["../../src/Table/TableStyles.ts"],"sourcesContent":["/**\n * Import third-party libraries.\n */\nimport styled from 'styled-components';\n\n/**\n * Import custom style properties.\n */\nimport {COLORS, focusStyles, scrollBarStyling} from '../styles';\nimport {\n ComponentLStyling,\n ComponentMStyling,\n ComponentSStyling,\n ComponentTextStyle,\n ComponentXSStyling\n} from '../styles/typography';\nimport {Z_INDEXES} from '../styles/z-indexes';\nimport {StyledCheckBox} from '../InputFields/Checkbox';\nimport {Size} from \"../types\";\n\n/**\n * Table styles\n */\n\nexport const TableWrapper = styled.div`\n position: relative;\n\n &.border{\n border-left: 1px solid ${COLORS.neutral_200};\n border-right: 1px solid ${COLORS.neutral_200};\n }\n`;\n\n\nexport const StyledTable = styled.table`\n background: transparent;\n border-collapse: collapse;\n width: 100%;\n\n &.fixed {\n table-layout: fixed;\n }\n\n &.auto {\n table-layout: auto;\n }\n`;\n\nexport const StyledTableHeader = styled.div`\n`;\n\nexport const StyledTableHeaderTitle = styled.div`\n`;\n\nexport const StyledTableHeaderTitleContent = styled.div`\n display: flex;\n align-items: center;\n justify-content: space-between;\n width: 100%;\n box-sizing: border-box;\n min-height: 56px;\n border-bottom: 1px solid ${COLORS.neutral_200};\n border-top: 2px solid ${COLORS.neutral_200};\n padding: 0 16px;\n\n ${ComponentLStyling(ComponentTextStyle.Bold, COLORS.black)}\n .title-menu {\n margin-right: -16px;\n }\n`;\n\nexport const StyledTableHeaderRow = styled.thead`\n`;\n\nexport const StyledTableHeaderColumns = styled.tr`\n`;\n\nexport const StyledTableHeaderColumnContent = styled.div`\n box-sizing: border-box;\n min-height: 56px;\n padding: 0 16px;\n height: 100%;\n display: flex;\n align-items: center;\n justify-content: space-between;\n border-top: 1px solid ${COLORS.neutral_200};\n border-bottom: 1px solid ${COLORS.neutral_200};\n`;\n\nexport const StyledTableHeaderColumnSortDirection = styled.span`\n width: 24px;\n height: 24px;\n`;\n\nexport const StyledTableHeaderColumn = styled.th`\n ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n position: relative;\n text-align: unset;\n background-color: ${COLORS.white};\n\n //fixes header heights no idea why\n height: 1px;\n\n &.sortable {\n cursor: pointer;\n\n &:hover {\n background-color: ${COLORS.primary_20};\n color: ${COLORS.primary_700};\n z-index: ${Z_INDEXES.hover};\n }\n\n &:active {\n background-color: ${COLORS.primary_100};\n color: ${COLORS.primary_800};\n z-index: ${Z_INDEXES.active};\n }\n\n &:focus {\n ${focusStyles}\n }\n }\n\n &.left {\n & > div {\n justify-content: left;\n }\n }\n\n &.right {\n & > div {\n justify-content: right;\n }\n }\n\n &.center {\n & > div {\n justify-content: center;\n }\n }\n\n &.sortable ${StyledTableHeaderColumnContent} > svg {\n opacity: 0;\n }\n\n &.sortable.sorted ${StyledTableHeaderColumnContent} > svg {\n opacity: 1;\n }\n\n &.sorted {\n background-color: ${COLORS.neutral_20};\n }\n`;\n\nexport const StyledTableBodyRow = styled.tr`\n cursor: pointer;\n position: relative;\n outline: none;\n background-color: ${COLORS.white};\n \n &:not(:last-child) {\n border-bottom: 1px solid ${COLORS.neutral_200};\n }\n\n &.selected{\n background-color: ${COLORS.primary_100};\n }\n \n &:hover {\n background-color: ${COLORS.primary_100};\n z-index: ${Z_INDEXES.hover};\n }\n\n &:focus {\n ${focusStyles}\n }\n\n &:active {\n z-index: ${Z_INDEXES.active};\n }\n\n`;\n\nexport const StyledTableNoRowsLabelRow = styled.tr`\n position: relative;\n outline: none;\n background-color: ${COLORS.neutral_50};\n`;\n\nexport const StyledTableBody = styled.tbody`\n`;\n\n\nexport const StyledTableCell = styled.td``;\n\nexport const StyledTableCellContent = styled.div`\n min-height: 48px;\n\n padding: 0 16px;\n ${ComponentSStyling(ComponentTextStyle.Regular, COLORS.black)}\n\n display: flex;\n align-items: center;\n justify-content: left;\n gap: 8px;\n\n &.truncate-text,\n &.truncate-text span {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n &.left {\n justify-content: left;\n }\n\n &.right {\n justify-content: right;\n }\n\n &.center {\n justify-content: center;\n }\n\n a:first-letter,\n span:first-letter {\n text-transform: uppercase;\n }\n \n ${StyledCheckBox}{\n width: fit-content;\n }\n`;\n\nexport const StyledTableCellIcon = styled.div`\n color: ${COLORS.neutral_700};\n width: 24px;\n height: 24px;\n\n svg {\n color: ${COLORS.neutral_700};\n width: 24px;\n height: 24px;\n }\n`;\n\nexport const StyledTableCellText = styled.span`\n padding: 12px 0;\n`;\n\n\nexport const StyledTableFooter = styled.div`\n`;\n\nexport const StyledTableFooterContent = styled.div`\n border-top: 2px solid ${COLORS.neutral_200};\n border-bottom: 1px solid ${COLORS.neutral_200};\n box-sizing: border-box;\n min-height: 56px;\n\n display: flex;\n align-items: center;\n justify-content: right;\n\n`;\n\nexport const StyledTableFooterCurrentInfo = styled.span`\n padding: 0 16px;\n ${ComponentXSStyling(ComponentTextStyle.Regular, COLORS.black)}\n`;\n\nexport const StyledTableFooterControls = styled.div`\n display: flex;\n`;\n\nexport const StyledTableSpinner = styled.div`\n height: 100%;\n width: 100%;\n position: absolute;\n background-color: rgba(255, 255, 255, 0.75);\n top: 0;\n z-index: ${Z_INDEXES.backdrop};\n`;\n\nexport const StyledTableFooterCollapseButton = styled.button`\n position: relative;\n border-bottom: 1px solid ${COLORS.neutral_200};\n border-top: 1px solid ${COLORS.neutral_200};\n border-left: none;\n border-right: none;\n box-sizing: border-box;\n min-height: 48px;\n display: flex;\n width: 100%;\n align-items: center;\n justify-content: center;\n gap: 4px;\n background: ${COLORS.white};\n\n cursor: pointer;\n\n ${ComponentMStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n \n &:focus {\n ${focusStyles}\n }\n\n &:hover {\n z-index: ${Z_INDEXES.hover};\n background: ${COLORS.primary_20};\n color: ${COLORS.primary_700};\n }\n\n &:active {\n z-index: ${Z_INDEXES.active};\n background: ${COLORS.primary_100};\n color: ${COLORS.primary_800};\n }\n\n &:disabled {\n display: none;\n }\n\n`;\n\n\nexport const StyledTableBodyWrapper = styled.div`\n overflow-x: auto;\n ${scrollBarStyling(Size.Small)}\n\n ::-webkit-scrollbar-track {\n margin: 6px;\n }\n\n &.scrollable{\n margin-bottom: 6px;\n padding-bottom: 10px;\n }\n`;\n"],"mappings":"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"}
1
+ {"version":3,"file":"TableStyles.js","names":["styled","COLORS","focusStyles","scrollBarStyling","ComponentLStyling","ComponentMStyling","ComponentSStyling","ComponentTextStyle","ComponentXSStyling","Z_INDEXES","StyledCheckBox","Size","TableWrapper","div","StyledTable","table","StyledTableHeader","StyledTableHeaderTitle","StyledTableHeaderTitleContent","neutral_200","Bold","black","StyledTableHeaderRow","thead","StyledTableHeaderColumns","tr","StyledTableHeaderColumnContent","StyledTableHeaderColumnSortDirection","span","StyledTableHeaderColumn","th","neutral_600","white","primary_20","primary_700","hover","primary_100","primary_800","active","neutral_20","StyledTableBodyRow","primary_200","StyledTableNoRowsLabelRow","neutral_50","StyledTableBody","tbody","StyledTableCell","td","StyledTableCellContent","Regular","StyledTableCellIcon","neutral_700","StyledTableCellText","StyledTableFooter","StyledTableFooterContent","StyledTableFooterCurrentInfo","StyledTableFooterControls","StyledTableSpinner","backdrop","StyledTableFooterCollapseButton","button","StyledTableBodyWrapper","Small"],"sources":["../../src/Table/TableStyles.ts"],"sourcesContent":["/**\n * Import third-party libraries.\n */\nimport styled from 'styled-components';\n\n/**\n * Import custom style properties.\n */\nimport {COLORS, focusStyles, scrollBarStyling} from '../styles';\nimport {\n ComponentLStyling,\n ComponentMStyling,\n ComponentSStyling,\n ComponentTextStyle,\n ComponentXSStyling\n} from '../styles/typography';\nimport {Z_INDEXES} from '../styles/z-indexes';\nimport {StyledCheckBox} from '../InputFields/Checkbox';\nimport {Size} from \"../types\";\n\n/**\n * Table styles\n */\n\nexport const TableWrapper = styled.div`\n position: relative;\n`;\n\n\nexport const StyledTable = styled.table`\n background: transparent;\n width: 100%;\n\n &.fixed {\n table-layout: fixed;\n }\n\n &.auto {\n table-layout: auto;\n }\n`;\n\nexport const StyledTableHeader = styled.div`\n`;\n\nexport const StyledTableHeaderTitle = styled.div`\n`;\n\nexport const StyledTableHeaderTitleContent = styled.div`\n display: flex;\n align-items: center;\n justify-content: space-between;\n width: 100%;\n box-sizing: border-box;\n min-height: 56px;\n border-bottom: 1px solid ${COLORS.neutral_200};\n border-top: 2px solid ${COLORS.neutral_200};\n padding: 0 16px;\n\n ${ComponentLStyling(ComponentTextStyle.Bold, COLORS.black)}\n .title-menu {\n margin-right: -16px;\n }\n`;\n\nexport const StyledTableHeaderRow = styled.thead`\n`;\n\nexport const StyledTableHeaderColumns = styled.tr`\n`;\n\nexport const StyledTableHeaderColumnContent = styled.div`\n box-sizing: border-box;\n min-height: 56px;\n padding: 0 16px;\n height: 100%;\n display: flex;\n align-items: center;\n justify-content: space-between;\n border-top: 1px solid ${COLORS.neutral_200};\n border-bottom: 1px solid ${COLORS.neutral_200};\n`;\n\nexport const StyledTableHeaderColumnSortDirection = styled.span`\n width: 24px;\n height: 24px;\n`;\n\nexport const StyledTableHeaderColumn = styled.th`\n ${ComponentSStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n position: relative;\n text-align: unset;\n background-color: ${COLORS.white};\n\n //fixes header heights no idea why\n height: 1px;\n\n &.sortable {\n cursor: pointer;\n\n &:hover {\n background-color: ${COLORS.primary_20};\n color: ${COLORS.primary_700};\n z-index: ${Z_INDEXES.hover};\n }\n\n &:active {\n background-color: ${COLORS.primary_100};\n color: ${COLORS.primary_800};\n z-index: ${Z_INDEXES.active};\n }\n\n &:focus {\n ${focusStyles}\n }\n }\n\n &.left {\n & > div {\n justify-content: left;\n }\n }\n\n &.right {\n & > div {\n justify-content: right;\n }\n }\n\n &.center {\n & > div {\n justify-content: center;\n }\n }\n\n &.sortable ${StyledTableHeaderColumnContent} > svg {\n opacity: 0;\n }\n\n &.sortable.sorted ${StyledTableHeaderColumnContent} > svg {\n opacity: 1;\n }\n\n &.sorted {\n background-color: ${COLORS.neutral_20};\n }\n`;\n\nexport const StyledTableBodyRow = styled.tr`\n cursor: pointer;\n position: relative;\n outline: none;\n\n &.selected{\n background-color: ${COLORS.primary_100};\n }\n \n &:hover {\n background-color: ${COLORS.primary_200};\n z-index: ${Z_INDEXES.hover};\n }\n\n &:focus {\n ${focusStyles}\n }\n\n &:active {\n z-index: ${Z_INDEXES.active};\n }\n\n`;\n\nexport const StyledTableNoRowsLabelRow = styled.tr`\n position: relative;\n outline: none;\n background-color: ${COLORS.neutral_50};\n`;\n\nexport const StyledTableBody = styled.tbody`\n ${StyledTableBodyRow}:nth-child(odd):not(.selected):not(:hover):not(:focus):not(:active) {\n background-color: ${COLORS.neutral_50};\n }\n\n ${StyledTableBodyRow}:nth-child(even):not(.selected):not(:hover):not(:focus):not(:active) {\n background-color: ${COLORS.neutral_20};\n }\n`;\n\n\nexport const StyledTableCell = styled.td``;\n\nexport const StyledTableCellContent = styled.div`\n min-height: 48px;\n\n padding: 0 16px;\n ${ComponentSStyling(ComponentTextStyle.Regular, COLORS.black)}\n\n display: flex;\n align-items: center;\n justify-content: left;\n gap: 8px;\n\n &.truncate-text,\n &.truncate-text span {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n &.left {\n justify-content: left;\n }\n\n &.right {\n justify-content: right;\n }\n\n &.center {\n justify-content: center;\n }\n\n a:first-letter,\n span:first-letter {\n text-transform: uppercase;\n }\n \n ${StyledCheckBox}{\n width: fit-content;\n }\n`;\n\nexport const StyledTableCellIcon = styled.div`\n color: ${COLORS.neutral_700};\n width: 24px;\n height: 24px;\n\n svg {\n color: ${COLORS.neutral_700};\n width: 24px;\n height: 24px;\n }\n`;\n\nexport const StyledTableCellText = styled.span`\n padding: 12px 0;\n`;\n\n\nexport const StyledTableFooter = styled.div`\n`;\n\nexport const StyledTableFooterContent = styled.div`\n border-top: 2px solid ${COLORS.neutral_200};\n border-bottom: 1px solid ${COLORS.neutral_200};\n box-sizing: border-box;\n min-height: 56px;\n\n display: flex;\n align-items: center;\n justify-content: right;\n\n`;\n\nexport const StyledTableFooterCurrentInfo = styled.span`\n padding: 0 16px;\n ${ComponentXSStyling(ComponentTextStyle.Regular, COLORS.black)}\n`;\n\nexport const StyledTableFooterControls = styled.div`\n display: flex;\n`;\n\nexport const StyledTableSpinner = styled.div`\n height: 100%;\n width: 100%;\n position: absolute;\n background-color: rgba(255, 255, 255, 0.75);\n top: 0;\n z-index: ${Z_INDEXES.backdrop};\n`;\n\nexport const StyledTableFooterCollapseButton = styled.button`\n position: relative;\n border-bottom: 1px solid ${COLORS.neutral_200};\n border-top: 1px solid ${COLORS.neutral_200};\n border-left: none;\n border-right: none;\n box-sizing: border-box;\n min-height: 48px;\n display: flex;\n width: 100%;\n align-items: center;\n justify-content: center;\n gap: 4px;\n background: ${COLORS.white};\n\n cursor: pointer;\n\n ${ComponentMStyling(ComponentTextStyle.Bold, COLORS.neutral_600)}\n \n &:focus {\n ${focusStyles}\n }\n\n &:hover {\n z-index: ${Z_INDEXES.hover};\n background: ${COLORS.primary_20};\n color: ${COLORS.primary_700};\n }\n\n &:active {\n z-index: ${Z_INDEXES.active};\n background: ${COLORS.primary_100};\n color: ${COLORS.primary_800};\n }\n\n &:disabled {\n display: none;\n }\n\n`;\n\n\nexport const StyledTableBodyWrapper = styled.div`\n overflow-x: auto;\n ${scrollBarStyling(Size.Small)}\n\n ::-webkit-scrollbar-track {\n margin: 6px;\n }\n\n &.scrollable{\n margin-bottom: 6px;\n padding-bottom: 10px;\n }\n`;\n"],"mappings":"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"}
package/dist/Table/TableTypes.cjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"TableTypes.cjs","names":[],"sources":["../../src/Table/TableTypes.ts"],"sourcesContent":["/**\n * Types for the table.\n */\nimport {DropdownButtonProps} from '../Dropdown/DropdownButtonTypes';\nimport {ButtonProps} from '../Button/Button';\nimport {IconButtonProps} from '../Button/Iconbutton';\nimport {HyperlinkProps} from '../HyperLink/HyperLink';\n\nexport interface TableProps {\n title?: string; // Will render header row\n\n columns: TableColumn[];\n rows: any[];\n\n border?: boolean;\n accordion?: boolean; // Will render accordion table\n collapsed?: boolean; // whether table should be collapsed or not\n collapsedRows?: number; // Number of rows to show when table is collapsed\n sortProps?: TableSortProps;\n\n remoteOperations?: boolean; // Indicates that pagination should be done remotely\n pagination?: TablePagination; // Required only in case remotePagination is set to true\n onPreviousPageClick?: () => void; // Will fire on previous page click in case remotePagination is set to true\n onNextPageClick?: () => void; // Will fire on next page click in case remotePagination is set to true\n onRowsPerPageChange?: (count: number) => void; // Will fire when rows per page changes in case remotePagination is set to true\n onTriggerSortingChange?: (key: string, direction?: TableSortingDirection) => void; // Will fire when the sorting direction changes. Used with remote pagination,\n\n showLoadingIndicator?: boolean;\n rowsPerPageLabel? :string; //label that will be shown next to the rows per page selector\n noRowsLabel?: string; //label that will be shown when there are no rows in the grid\n showMoreLabel?: string; //label that will be shown for 'accordion' grid when there are some rows collapsed\n showFewerLabel?: string; //label that will be shown for 'accordion' grid when user can 'collapse' some of the rows\n\n menu?: Pick<DropdownButtonProps, 'items' | 'onClick' | 'disabled' | 'width' | 'itemsType' | 'multiSelect'>;\n\n selectable?: boolean;\n onSelectionChange?: (value: any | any[]) => void;\n multiSelect?: boolean;\n keyExpr?: string;\n selectedRows?: any[];\n\n layout?: TableLayout;\n}\n\nexport interface TableSortProps {\n column: string;\n direction: TableSortingDirection;\n}\n\nexport interface TableColumn {\n key: string;\n name: string;\n filterValue?: string;\n\n icon?: React.ReactNode;\n\n width?: string | number;\n colorFn?: (row: any, key: string) => string;\n justify?: TableJustification;\n shortenText?: boolean;\n\n action?: (row: any, event: any) => void;\n type?: TableColumnTypes;\n additionalProps?: Pick<ButtonProps, 'variant' | 'size' | 'width' | 'icon'> | Pick<IconButtonProps, 'variant' | 'shape' | 'disabled'> | Pick<HyperlinkProps, 'variant'>;\n customContent?: (row: any, key: string) => any;\n\n sortable?: boolean;\n}\n\nexport type TableColumnTypes = 'text' | 'boolean' | 'number' | 'custom' | 'button' | 'icon' | 'link';\n\nexport type TableJustification = 'right' | 'left' | 'center';\n\nexport type TableSortingDirection = 'asc' | 'desc';\n\nexport type TableLayout = 'auto' | 'fixed';\n\nexport interface TablePagination {\n from: number;\n to: number;\n total: number;\n currentPage: number;\n rowsPerPage: number;\n}\n\n// will override component properties in case of button, icon and link\n"],"mappings":""}
1
+ {"version":3,"file":"TableTypes.cjs","names":[],"sources":["../../src/Table/TableTypes.ts"],"sourcesContent":["/**\n * Types for the table.\n */\nimport {DropdownButtonProps} from '../Dropdown/DropdownButtonTypes';\nimport {ButtonProps} from '../Button/Button';\nimport {IconButtonProps} from '../Button/Iconbutton';\nimport {HyperlinkProps} from '../HyperLink/HyperLink';\n\nexport interface TableProps {\n title?: string; // Will render header row\n\n columns: TableColumn[];\n rows: any[];\n\n accordion?: boolean; // Will render accordion table\n collapsed?: boolean; // whether table should be collapsed or not\n collapsedRows?: number; // Number of rows to show when table is collapsed\n sortProps?: TableSortProps;\n\n remoteOperations?: boolean; // Indicates that pagination should be done remotely\n pagination?: TablePagination; // Required only in case remotePagination is set to true\n onPreviousPageClick?: () => void; // Will fire on previous page click in case remotePagination is set to true\n onNextPageClick?: () => void; // Will fire on next page click in case remotePagination is set to true\n onRowsPerPageChange?: (count: number) => void; // Will fire when rows per page changes in case remotePagination is set to true\n onTriggerSortingChange?: (key: string, direction?: TableSortingDirection) => void; // Will fire when the sorting direction changes. Used with remote pagination,\n\n showLoadingIndicator?: boolean;\n rowsPerPageLabel? :string; //label that will be shown next to the rows per page selector\n noRowsLabel?: string; //label that will be shown when there are no rows in the grid\n showMoreLabel?: string; //label that will be shown for 'accordion' grid when there are some rows collapsed\n showFewerLabel?: string; //label that will be shown for 'accordion' grid when user can 'collapse' some of the rows\n\n menu?: Pick<DropdownButtonProps, 'items' | 'onClick' | 'disabled' | 'width' | 'itemsType' | 'multiSelect'>;\n\n selectable?: boolean;\n onSelectionChange?: (value: any | any[]) => void;\n multiSelect?: boolean;\n keyExpr?: string;\n selectedRows?: any[];\n\n layout?: TableLayout;\n}\n\nexport interface TableSortProps {\n column: string;\n direction: TableSortingDirection;\n}\n\nexport interface TableColumn {\n key: string;\n name: string;\n filterValue?: string;\n\n icon?: React.ReactNode;\n\n width?: string | number;\n colorFn?: (row: any, key: string) => string;\n justify?: TableJustification;\n shortenText?: boolean;\n\n action?: (row: any, event: any) => void;\n type?: TableColumnTypes;\n additionalProps?: Pick<ButtonProps, 'variant' | 'size' | 'width' | 'icon'> | Pick<IconButtonProps, 'variant' | 'shape' | 'disabled'> | Pick<HyperlinkProps, 'variant'>;\n customContent?: (row: any, key: string) => any;\n\n sortable?: boolean;\n}\n\nexport type TableColumnTypes = 'text' | 'boolean' | 'number' | 'custom' | 'button' | 'icon' | 'link';\n\nexport type TableJustification = 'right' | 'left' | 'center';\n\nexport type TableSortingDirection = 'asc' | 'desc';\n\nexport type TableLayout = 'auto' | 'fixed';\n\nexport interface TablePagination {\n from: number;\n to: number;\n total: number;\n currentPage: number;\n rowsPerPage: number;\n}\n\n// will override component properties in case of button, icon and link\n"],"mappings":""}
package/dist/Table/TableTypes.d.ts CHANGED
@@ -9,7 +9,6 @@ export interface TableProps {
9
9
  title?: string;
10
10
  columns: TableColumn[];
11
11
  rows: any[];
12
- border?: boolean;
13
12
  accordion?: boolean;
14
13
  collapsed?: boolean;
15
14
  collapsedRows?: number;
package/dist/Table/TableTypes.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"TableTypes.js","names":[],"sources":["../../src/Table/TableTypes.ts"],"sourcesContent":["/**\n * Types for the table.\n */\nimport {DropdownButtonProps} from '../Dropdown/DropdownButtonTypes';\nimport {ButtonProps} from '../Button/Button';\nimport {IconButtonProps} from '../Button/Iconbutton';\nimport {HyperlinkProps} from '../HyperLink/HyperLink';\n\nexport interface TableProps {\n title?: string; // Will render header row\n\n columns: TableColumn[];\n rows: any[];\n\n border?: boolean;\n accordion?: boolean; // Will render accordion table\n collapsed?: boolean; // whether table should be collapsed or not\n collapsedRows?: number; // Number of rows to show when table is collapsed\n sortProps?: TableSortProps;\n\n remoteOperations?: boolean; // Indicates that pagination should be done remotely\n pagination?: TablePagination; // Required only in case remotePagination is set to true\n onPreviousPageClick?: () => void; // Will fire on previous page click in case remotePagination is set to true\n onNextPageClick?: () => void; // Will fire on next page click in case remotePagination is set to true\n onRowsPerPageChange?: (count: number) => void; // Will fire when rows per page changes in case remotePagination is set to true\n onTriggerSortingChange?: (key: string, direction?: TableSortingDirection) => void; // Will fire when the sorting direction changes. Used with remote pagination,\n\n showLoadingIndicator?: boolean;\n rowsPerPageLabel? :string; //label that will be shown next to the rows per page selector\n noRowsLabel?: string; //label that will be shown when there are no rows in the grid\n showMoreLabel?: string; //label that will be shown for 'accordion' grid when there are some rows collapsed\n showFewerLabel?: string; //label that will be shown for 'accordion' grid when user can 'collapse' some of the rows\n\n menu?: Pick<DropdownButtonProps, 'items' | 'onClick' | 'disabled' | 'width' | 'itemsType' | 'multiSelect'>;\n\n selectable?: boolean;\n onSelectionChange?: (value: any | any[]) => void;\n multiSelect?: boolean;\n keyExpr?: string;\n selectedRows?: any[];\n\n layout?: TableLayout;\n}\n\nexport interface TableSortProps {\n column: string;\n direction: TableSortingDirection;\n}\n\nexport interface TableColumn {\n key: string;\n name: string;\n filterValue?: string;\n\n icon?: React.ReactNode;\n\n width?: string | number;\n colorFn?: (row: any, key: string) => string;\n justify?: TableJustification;\n shortenText?: boolean;\n\n action?: (row: any, event: any) => void;\n type?: TableColumnTypes;\n additionalProps?: Pick<ButtonProps, 'variant' | 'size' | 'width' | 'icon'> | Pick<IconButtonProps, 'variant' | 'shape' | 'disabled'> | Pick<HyperlinkProps, 'variant'>;\n customContent?: (row: any, key: string) => any;\n\n sortable?: boolean;\n}\n\nexport type TableColumnTypes = 'text' | 'boolean' | 'number' | 'custom' | 'button' | 'icon' | 'link';\n\nexport type TableJustification = 'right' | 'left' | 'center';\n\nexport type TableSortingDirection = 'asc' | 'desc';\n\nexport type TableLayout = 'auto' | 'fixed';\n\nexport interface TablePagination {\n from: number;\n to: number;\n total: number;\n currentPage: number;\n rowsPerPage: number;\n}\n\n// will override component properties in case of button, icon and link\n"],"mappings":""}
1
+ {"version":3,"file":"TableTypes.js","names":[],"sources":["../../src/Table/TableTypes.ts"],"sourcesContent":["/**\n * Types for the table.\n */\nimport {DropdownButtonProps} from '../Dropdown/DropdownButtonTypes';\nimport {ButtonProps} from '../Button/Button';\nimport {IconButtonProps} from '../Button/Iconbutton';\nimport {HyperlinkProps} from '../HyperLink/HyperLink';\n\nexport interface TableProps {\n title?: string; // Will render header row\n\n columns: TableColumn[];\n rows: any[];\n\n accordion?: boolean; // Will render accordion table\n collapsed?: boolean; // whether table should be collapsed or not\n collapsedRows?: number; // Number of rows to show when table is collapsed\n sortProps?: TableSortProps;\n\n remoteOperations?: boolean; // Indicates that pagination should be done remotely\n pagination?: TablePagination; // Required only in case remotePagination is set to true\n onPreviousPageClick?: () => void; // Will fire on previous page click in case remotePagination is set to true\n onNextPageClick?: () => void; // Will fire on next page click in case remotePagination is set to true\n onRowsPerPageChange?: (count: number) => void; // Will fire when rows per page changes in case remotePagination is set to true\n onTriggerSortingChange?: (key: string, direction?: TableSortingDirection) => void; // Will fire when the sorting direction changes. Used with remote pagination,\n\n showLoadingIndicator?: boolean;\n rowsPerPageLabel? :string; //label that will be shown next to the rows per page selector\n noRowsLabel?: string; //label that will be shown when there are no rows in the grid\n showMoreLabel?: string; //label that will be shown for 'accordion' grid when there are some rows collapsed\n showFewerLabel?: string; //label that will be shown for 'accordion' grid when user can 'collapse' some of the rows\n\n menu?: Pick<DropdownButtonProps, 'items' | 'onClick' | 'disabled' | 'width' | 'itemsType' | 'multiSelect'>;\n\n selectable?: boolean;\n onSelectionChange?: (value: any | any[]) => void;\n multiSelect?: boolean;\n keyExpr?: string;\n selectedRows?: any[];\n\n layout?: TableLayout;\n}\n\nexport interface TableSortProps {\n column: string;\n direction: TableSortingDirection;\n}\n\nexport interface TableColumn {\n key: string;\n name: string;\n filterValue?: string;\n\n icon?: React.ReactNode;\n\n width?: string | number;\n colorFn?: (row: any, key: string) => string;\n justify?: TableJustification;\n shortenText?: boolean;\n\n action?: (row: any, event: any) => void;\n type?: TableColumnTypes;\n additionalProps?: Pick<ButtonProps, 'variant' | 'size' | 'width' | 'icon'> | Pick<IconButtonProps, 'variant' | 'shape' | 'disabled'> | Pick<HyperlinkProps, 'variant'>;\n customContent?: (row: any, key: string) => any;\n\n sortable?: boolean;\n}\n\nexport type TableColumnTypes = 'text' | 'boolean' | 'number' | 'custom' | 'button' | 'icon' | 'link';\n\nexport type TableJustification = 'right' | 'left' | 'center';\n\nexport type TableSortingDirection = 'asc' | 'desc';\n\nexport type TableLayout = 'auto' | 'fixed';\n\nexport interface TablePagination {\n from: number;\n to: number;\n total: number;\n currentPage: number;\n rowsPerPage: number;\n}\n\n// will override component properties in case of button, icon and link\n"],"mappings":""}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@laerdal/life-react-components",
3
- "version": "2.1.1-dev.25",
3
+ "version": "2.1.1-dev.29",
4
4
  "private": false,
5
5
  "author": "Erik Martirosyan <erik.martirosyan@laerdal.com>",
6
6
  "contributors": [],