@tecsinapse/react-web-kit 1.5.0 → 1.6.3

package/CHANGELOG.md

@@ -3,6 +3,60 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [1.6.3](https://github.com/tecsinapse/design-system/compare/@tecsinapse/react-web-kit@1.6.2...@tecsinapse/react-web-kit@1.6.3) (2021-09-16)
+
+
+### Bug Fixes
+
+* **menubar:** fixing toggle for search items ([330e6b8](https://github.com/tecsinapse/design-system/commit/330e6b8467945c55bbcbaa4876cd160224ef509d))
+* **menubar:** fixing toggle for search items ([3aefce8](https://github.com/tecsinapse/design-system/commit/3aefce867cab7a12bafdef181148fc48654044ff))
+
+
+
+
+
+## [1.6.2](https://github.com/tecsinapse/design-system/compare/@tecsinapse/react-web-kit@1.6.1...@tecsinapse/react-web-kit@1.6.2) (2021-09-15)
+
+
+### Bug Fixes
+
+* **menubar:** fixing z-index ([7f8396f](https://github.com/tecsinapse/design-system/commit/7f8396f77b41d32e21eb0cfef9b0c706c13ef454))
+
+
+
+
+
+## [1.6.1](https://github.com/tecsinapse/design-system/compare/@tecsinapse/react-web-kit@1.6.0...@tecsinapse/react-web-kit@1.6.1) (2021-09-15)
+
+
+### Bug Fixes
+
+* **menubar:** fixing right components ([efc933d](https://github.com/tecsinapse/design-system/commit/efc933d5a716be0c8f07b4c06a86c52db2f85077))
+
+
+
+
+
+# [1.6.0](https://github.com/tecsinapse/design-system/compare/@tecsinapse/react-web-kit@1.5.0...@tecsinapse/react-web-kit@1.6.0) (2021-09-14)
+
+
+### Bug Fixes
+
+* **exports:** exporting components ([83a0500](https://github.com/tecsinapse/design-system/commit/83a0500e5666568029dbe6cb90a9c594c90c0af1))
+* **transition:** changing animation from linear to ease-in-out ([d6570aa](https://github.com/tecsinapse/design-system/commit/d6570aa1d952ba18db122955b6f1e54a1f223b14))
+* button user-select style ([f1145b4](https://github.com/tecsinapse/design-system/commit/f1145b400847dd8ab526a48f25958fdc407c9afb))
+
+
+### Features
+
+* add accordion ([f7089c0](https://github.com/tecsinapse/design-system/commit/f7089c0d98568fd3ee0aa64f2150063f67e4fe66))
+* add modal ([eff7597](https://github.com/tecsinapse/design-system/commit/eff7597f779c9e10b078153ed0eb23acc143760b))
+* move to atoms ([5085e28](https://github.com/tecsinapse/design-system/commit/5085e28a96eafd85731cf3f564ae9de21635aea8))
+
+
+
+
+
 # [1.5.0](https://github.com/tecsinapse/design-system/compare/@tecsinapse/react-web-kit@1.4.0...@tecsinapse/react-web-kit@1.5.0) (2021-09-06)
 
 

package/dist/components/atoms/Accordion/Accordion.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+export interface AccordionProps {
+    open?: boolean;
+    onChange?: () => void;
+    title: string;
+    transition?: number;
+}
+declare const Accordion: React.FC<AccordionProps>;
+export default Accordion;

package/dist/components/atoms/Accordion/Accordion.js

@@ -0,0 +1,85 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _reactCore = require("@tecsinapse/react-core");
+
+var _styled = require("./styled");
+
+var _reactTransitionGroup = require("react-transition-group");
+
+var _animations = require("./animations");
+
+var _react2 = require("@emotion/react");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+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; }
+
+const Accordion = ({
+  title,
+  open: _open = false,
+  onChange,
+  transition = 200,
+  children
+}) => {
+  const [open, setOpen] = _react.default.useState(_open);
+
+  const [contentHeight, setContentHeight] = _react.default.useState(0);
+
+  const theme = (0, _react2.useTheme)();
+  const ref = (0, _react.useRef)(null);
+
+  _react.default.useEffect(() => setOpen(_open), [_open]);
+
+  _react.default.useLayoutEffect(() => {
+    var _ref$current;
+
+    const size = Array.from(((_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : _ref$current.children) || []).reduce((prev, curr) => prev + curr.clientHeight, 0);
+    setContentHeight(size);
+  }, []);
+
+  const handleClick = _react.default.useCallback(() => {
+    if (onChange) {
+      onChange();
+      return;
+    }
+
+    setOpen(state => !state);
+  }, [onChange]);
+
+  return _react.default.createElement(_styled.AccordionContainer, null, _react.default.createElement(_styled.TitleContainer, {
+    onClick: handleClick
+  }, _react.default.createElement(_reactTransitionGroup.Transition, {
+    in: open,
+    timeout: transition
+  }, state => _react.default.createElement(_reactCore.Text, {
+    typography: "h4",
+    fontWeight: "bold",
+    style: { ...(0, _animations.titleStyle)(transition, theme),
+      ...(0, _animations.titleTransition)(theme)[state]
+    }
+  }, title)), _react.default.createElement(_styled.IconContainer, null, _react.default.createElement(_reactCore.Icon, {
+    type: "material-community",
+    name: open ? 'chevron-up' : 'chevron-down',
+    size: "kilo",
+    fontColor: "medium"
+  }))), _react.default.createElement(_reactTransitionGroup.Transition, {
+    in: open,
+    timeout: transition
+  }, state => _react.default.createElement(_styled.ContentContainer, {
+    ref: htmlEl => ref.current = htmlEl,
+    style: { ...(0, _animations.contentStyle)(open, transition, contentHeight, theme),
+      ...(0, _animations.contentTransition)(contentHeight, theme)[state]
+    }
+  }, children)));
+};
+
+var _default = Accordion;
+exports.default = _default;
+//# sourceMappingURL=Accordion.js.map

package/dist/components/atoms/Accordion/Accordion.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/atoms/Accordion/Accordion.tsx"],"names":["Accordion","title","open","_open","onChange","transition","children","setOpen","React","useState","contentHeight","setContentHeight","theme","ref","useEffect","useLayoutEffect","size","Array","from","current","reduce","prev","curr","clientHeight","handleClick","useCallback","state","htmlEl"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AAMA;;AACA;;AAMA;;;;;;AAUA,MAAMA,SAAmC,GAAG,CAAC;AAC3CC,EAAAA,KAD2C;AAE3CC,EAAAA,IAAI,EAAEC,KAAK,GAAG,KAF6B;AAG3CC,EAAAA,QAH2C;AAI3CC,EAAAA,UAAU,GAAG,GAJ8B;AAK3CC,EAAAA;AAL2C,CAAD,KAMtC;AACJ,QAAM,CAACJ,IAAD,EAAOK,OAAP,IAAkBC,eAAMC,QAAN,CAAeN,KAAf,CAAxB;;AACA,QAAM,CAACO,aAAD,EAAgBC,gBAAhB,IAAoCH,eAAMC,QAAN,CAAe,CAAf,CAA1C;;AACA,QAAMG,KAAK,GAAG,uBAAd;AAEA,QAAMC,GAAG,GAAG,mBAA8B,IAA9B,CAAZ;;AAEAL,iBAAMM,SAAN,CAAgB,MAAMP,OAAO,CAACJ,KAAD,CAA7B,EAAsC,CAACA,KAAD,CAAtC;;AAEAK,iBAAMO,eAAN,CAAsB,MAAM;AAAA;;AAC1B,UAAMC,IAAI,GAAGC,KAAK,CAACC,IAAN,CACV,iBAAAL,GAAG,CAACM,OAAJ,8DAAab,QAAb,KAAyB,EADf,EAEXc,MAFW,CAEJ,CAACC,IAAD,EAAOC,IAAP,KAAgBD,IAAI,GAAGC,IAAI,CAACC,YAFxB,EAEsC,CAFtC,CAAb;AAGAZ,IAAAA,gBAAgB,CAACK,IAAD,CAAhB;AACD,GALD,EAKG,EALH;;AAOA,QAAMQ,WAAW,GAAGhB,eAAMiB,WAAN,CAAkB,MAAM;AAC1C,QAAIrB,QAAJ,EAAc;AACZA,MAAAA,QAAQ;AACR;AACD;;AACDG,IAAAA,OAAO,CAACmB,KAAK,IAAI,CAACA,KAAX,CAAP;AACD,GANmB,EAMjB,CAACtB,QAAD,CANiB,CAApB;;AAQA,SACE,6BAAC,0BAAD,QACE,6BAAC,sBAAD;AAAgB,IAAA,OAAO,EAAEoB;AAAzB,KACE,6BAAC,gCAAD;AAAY,IAAA,EAAE,EAAEtB,IAAhB;AAAsB,IAAA,OAAO,EAAEG;AAA/B,KACGqB,KAAK,IACJ,6BAAC,eAAD;AACE,IAAA,UAAU,EAAC,IADb;AAEE,IAAA,UAAU,EAAC,MAFb;AAGE,IAAA,KAAK,EAAE,EACL,GAAG,4BAAWrB,UAAX,EAAuBO,KAAvB,CADE;AAEL,SAAG,iCAAgBA,KAAhB,EAAuBc,KAAvB;AAFE;AAHT,KAQGzB,KARH,CAFJ,CADF,EAeE,6BAAC,qBAAD,QACE,6BAAC,eAAD;AACE,IAAA,IAAI,EAAC,oBADP;AAEE,IAAA,IAAI,EAAEC,IAAI,GAAG,YAAH,GAAkB,cAF9B;AAGE,IAAA,IAAI,EAAC,MAHP;AAIE,IAAA,SAAS,EAAC;AAJZ,IADF,CAfF,CADF,EAyBE,6BAAC,gCAAD;AAAY,IAAA,EAAE,EAAEA,IAAhB;AAAsB,IAAA,OAAO,EAAEG;AAA/B,KACGqB,KAAK,IACJ,6BAAC,wBAAD;AACE,IAAA,GAAG,EAAEC,MAAM,IAAKd,GAAG,CAACM,OAAJ,GAAcQ,MADhC;AAEE,IAAA,KAAK,EAAE,EACL,GAAG,8BAAazB,IAAb,EAAmBG,UAAnB,EAA+BK,aAA/B,EAA8CE,KAA9C,CADE;AAEL,SAAG,mCAAkBF,aAAlB,EAAiCE,KAAjC,EAAwCc,KAAxC;AAFE;AAFT,KAOGpB,QAPH,CAFJ,CAzBF,CADF;AAyCD,CAvED;;eAyEeN,S","sourcesContent":["import React, { useRef } from 'react';\nimport { Icon, Text, ThemeProp } from '@tecsinapse/react-core';\nimport {\n  AccordionContainer,\n  IconContainer,\n  TitleContainer,\n  ContentContainer,\n} from './styled';\nimport { Transition } from 'react-transition-group';\nimport {\n  contentStyle,\n  contentTransition,\n  titleStyle,\n  titleTransition,\n} from './animations';\nimport { useTheme } from '@emotion/react';\n\nexport interface AccordionProps {\n  open?: boolean;\n  onChange?: () => void;\n  title: string;\n  /** Transition time for collapse effect in ms */\n  transition?: number;\n}\n\nconst Accordion: React.FC<AccordionProps> = ({\n  title,\n  open: _open = false,\n  onChange,\n  transition = 200,\n  children,\n}) => {\n  const [open, setOpen] = React.useState(_open);\n  const [contentHeight, setContentHeight] = React.useState(0);\n  const theme = useTheme() as ThemeProp;\n\n  const ref = useRef<HTMLDivElement | null>(null);\n\n  React.useEffect(() => setOpen(_open), [_open]);\n\n  React.useLayoutEffect(() => {\n    const size = Array.from(\n      (ref.current?.children || []) as HTMLCollection\n    ).reduce((prev, curr) => prev + curr.clientHeight, 0);\n    setContentHeight(size);\n  }, []);\n\n  const handleClick = React.useCallback(() => {\n    if (onChange) {\n      onChange();\n      return;\n    }\n    setOpen(state => !state);\n  }, [onChange]);\n\n  return (\n    <AccordionContainer>\n      <TitleContainer onClick={handleClick}>\n        <Transition in={open} timeout={transition}>\n          {state => (\n            <Text\n              typography=\"h4\"\n              fontWeight=\"bold\"\n              style={{\n                ...titleStyle(transition, theme),\n                ...titleTransition(theme)[state],\n              }}\n            >\n              {title}\n            </Text>\n          )}\n        </Transition>\n        <IconContainer>\n          <Icon\n            type=\"material-community\"\n            name={open ? 'chevron-up' : 'chevron-down'}\n            size=\"kilo\"\n            fontColor=\"medium\"\n          />\n        </IconContainer>\n      </TitleContainer>\n      <Transition in={open} timeout={transition}>\n        {state => (\n          <ContentContainer\n            ref={htmlEl => (ref.current = htmlEl)}\n            style={{\n              ...contentStyle(open, transition, contentHeight, theme),\n              ...contentTransition(contentHeight, theme)[state],\n            }}\n          >\n            {children}\n          </ContentContainer>\n        )}\n      </Transition>\n    </AccordionContainer>\n  );\n};\n\nexport default Accordion;\n"],"file":"Accordion.js"}

package/dist/components/atoms/Accordion/animations.d.ts

@@ -0,0 +1,41 @@
+export declare const contentStyle: (open: boolean, transition: number, value: number, theme: any) => {
+    transition: string;
+    paddingBottom: any;
+    height: number;
+};
+export declare const contentTransition: (value: number, theme: any) => {
+    entering: {
+        paddingBottom: any;
+        height: number;
+    };
+    entered: {
+        paddingBottom: any;
+        height: number;
+    };
+    exiting: {
+        paddingBottom: any;
+        height: number;
+    };
+    exited: {
+        paddingBottom: number;
+        height: number;
+    };
+};
+export declare const titleStyle: (transition: number, theme: any) => {
+    transition: string;
+    color: any;
+};
+export declare const titleTransition: (theme: any) => {
+    entering: {
+        color: any;
+    };
+    entered: {
+        color: any;
+    };
+    exiting: {
+        color: any;
+    };
+    exited: {
+        color: any;
+    };
+};

package/dist/components/atoms/Accordion/animations.js

@@ -0,0 +1,65 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.titleTransition = exports.titleStyle = exports.contentTransition = exports.contentStyle = void 0;
+
+var _reactCore = require("@tecsinapse/react-core");
+
+const contentStyle = (open, transition, value, theme) => ({
+  transition: `padding-bottom ${transition * 2}ms ease-in-out, height ${transition * 2}ms ease-in-out`,
+  paddingBottom: open ? (0, _reactCore.extractNumbersFromString)(theme.spacing.kilo) : 0,
+  height: open ? value : 0
+});
+
+exports.contentStyle = contentStyle;
+
+const contentTransition = (value, theme) => {
+  const paddingBottom = (0, _reactCore.extractNumbersFromString)(theme.spacing.kilo);
+  return {
+    entering: {
+      paddingBottom,
+      height: value
+    },
+    entered: {
+      paddingBottom,
+      height: value
+    },
+    exiting: {
+      paddingBottom,
+      height: value
+    },
+    exited: {
+      paddingBottom: 0,
+      height: 0
+    }
+  };
+};
+
+exports.contentTransition = contentTransition;
+
+const titleStyle = (transition, theme) => ({
+  transition: `color ${transition * 2}ms ease-in-out`,
+  color: theme.font.color.dark
+});
+
+exports.titleStyle = titleStyle;
+
+const titleTransition = theme => ({
+  entering: {
+    color: theme.font.color.orange
+  },
+  entered: {
+    color: theme.font.color.orange
+  },
+  exiting: {
+    color: theme.font.color.orange
+  },
+  exited: {
+    color: theme.font.color.dark
+  }
+});
+
+exports.titleTransition = titleTransition;
+//# sourceMappingURL=animations.js.map

package/dist/components/atoms/Accordion/animations.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/atoms/Accordion/animations.ts"],"names":["contentStyle","open","transition","value","theme","paddingBottom","spacing","kilo","height","contentTransition","entering","entered","exiting","exited","titleStyle","color","font","dark","titleTransition","orange"],"mappings":";;;;;;;AAAA;;AAEO,MAAMA,YAAY,GAAG,CAC1BC,IAD0B,EAE1BC,UAF0B,EAG1BC,KAH0B,EAI1BC,KAJ0B,MAKtB;AACJF,EAAAA,UAAU,EAAG,kBAAiBA,UAAU,GAAG,CAAE,0BAC3CA,UAAU,GAAG,CACd,gBAHG;AAIJG,EAAAA,aAAa,EAAEJ,IAAI,GAAG,yCAAyBG,KAAK,CAACE,OAAN,CAAcC,IAAvC,CAAH,GAAkD,CAJjE;AAKJC,EAAAA,MAAM,EAAEP,IAAI,GAAGE,KAAH,GAAW;AALnB,CALsB,CAArB;;;;AAaA,MAAMM,iBAAiB,GAAG,CAACN,KAAD,EAAgBC,KAAhB,KAAqC;AACpE,QAAMC,aAAa,GAAG,yCAAyBD,KAAK,CAACE,OAAN,CAAcC,IAAvC,CAAtB;AACA,SAAO;AACLG,IAAAA,QAAQ,EAAE;AACRL,MAAAA,aADQ;AAERG,MAAAA,MAAM,EAAEL;AAFA,KADL;AAKLQ,IAAAA,OAAO,EAAE;AACPN,MAAAA,aADO;AAEPG,MAAAA,MAAM,EAAEL;AAFD,KALJ;AASLS,IAAAA,OAAO,EAAE;AACPP,MAAAA,aADO;AAEPG,MAAAA,MAAM,EAAEL;AAFD,KATJ;AAaLU,IAAAA,MAAM,EAAE;AAAER,MAAAA,aAAa,EAAE,CAAjB;AAAoBG,MAAAA,MAAM,EAAE;AAA5B;AAbH,GAAP;AAeD,CAjBM;;;;AAmBA,MAAMM,UAAU,GAAG,CAACZ,UAAD,EAAqBE,KAArB,MAA2C;AACnEF,EAAAA,UAAU,EAAG,SAAQA,UAAU,GAAG,CAAE,gBAD+B;AAEnEa,EAAAA,KAAK,EAAEX,KAAK,CAACY,IAAN,CAAWD,KAAX,CAAiBE;AAF2C,CAA3C,CAAnB;;;;AAKA,MAAMC,eAAe,GAAId,KAAD,KAAuB;AACpDM,EAAAA,QAAQ,EAAE;AACRK,IAAAA,KAAK,EAAEX,KAAK,CAACY,IAAN,CAAWD,KAAX,CAAiBI;AADhB,GAD0C;AAIpDR,EAAAA,OAAO,EAAE;AACPI,IAAAA,KAAK,EAAEX,KAAK,CAACY,IAAN,CAAWD,KAAX,CAAiBI;AADjB,GAJ2C;AAOpDP,EAAAA,OAAO,EAAE;AACPG,IAAAA,KAAK,EAAEX,KAAK,CAACY,IAAN,CAAWD,KAAX,CAAiBI;AADjB,GAP2C;AAUpDN,EAAAA,MAAM,EAAE;AAAEE,IAAAA,KAAK,EAAEX,KAAK,CAACY,IAAN,CAAWD,KAAX,CAAiBE;AAA1B;AAV4C,CAAvB,CAAxB","sourcesContent":["import { ThemeProp, extractNumbersFromString } from '@tecsinapse/react-core';\n\nexport const contentStyle = (\n  open: boolean,\n  transition: number,\n  value: number,\n  theme: ThemeProp\n) => ({\n  transition: `padding-bottom ${transition * 2}ms ease-in-out, height ${\n    transition * 2\n  }ms ease-in-out`,\n  paddingBottom: open ? extractNumbersFromString(theme.spacing.kilo) : 0,\n  height: open ? value : 0,\n});\n\nexport const contentTransition = (value: number, theme: ThemeProp) => {\n  const paddingBottom = extractNumbersFromString(theme.spacing.kilo);\n  return {\n    entering: {\n      paddingBottom,\n      height: value,\n    },\n    entered: {\n      paddingBottom,\n      height: value,\n    },\n    exiting: {\n      paddingBottom,\n      height: value,\n    },\n    exited: { paddingBottom: 0, height: 0 },\n  };\n};\n\nexport const titleStyle = (transition: number, theme: ThemeProp) => ({\n  transition: `color ${transition * 2}ms ease-in-out`,\n  color: theme.font.color.dark,\n});\n\nexport const titleTransition = (theme: ThemeProp) => ({\n  entering: {\n    color: theme.font.color.orange,\n  },\n  entered: {\n    color: theme.font.color.orange,\n  },\n  exiting: {\n    color: theme.font.color.orange,\n  },\n  exited: { color: theme.font.color.dark },\n});\n"],"file":"animations.js"}

package/dist/components/atoms/Accordion/index.d.ts

@@ -0,0 +1 @@
+export { default as Accordion, AccordionProps } from './Accordion';

package/dist/components/atoms/Accordion/index.js

@@ -0,0 +1,24 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "Accordion", {
+  enumerable: true,
+  get: function () {
+    return _Accordion.default;
+  }
+});
+Object.defineProperty(exports, "AccordionProps", {
+  enumerable: true,
+  get: function () {
+    return _Accordion.AccordionProps;
+  }
+});
+
+var _Accordion = _interopRequireWildcard(require("./Accordion"));
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+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; }
+//# sourceMappingURL=index.js.map

package/dist/components/atoms/Accordion/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/atoms/Accordion/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAAA","sourcesContent":["export { default as Accordion, AccordionProps } from './Accordion';\n"],"file":"index.js"}

package/dist/components/atoms/Accordion/styled.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+export declare const IconContainer: import("@emotion/styled").StyledComponent<any, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const TitleContainer: import("@emotion/styled").StyledComponent<any, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const AccordionContainer: import("@emotion/styled").StyledComponent<any, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const ContentContainer: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/dist/components/atoms/Accordion/styled.js

@@ -0,0 +1,53 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ContentContainer = exports.AccordionContainer = exports.TitleContainer = exports.IconContainer = void 0;
+
+var _styled = _interopRequireDefault(require("@emotion/styled"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+const IconContainer = (0, _styled.default)('div')`
+  border-radius: ${({
+  theme
+}) => theme.borderRadius.mili};
+  border: ${({
+  theme
+}) => `${theme.borderWidth.pico} solid ${theme.color.secondary.light}`};
+  display: flex;
+  text-align: center;
+  justify-content: center;
+  align-items: center;
+`;
+exports.IconContainer = IconContainer;
+const TitleContainer = (0, _styled.default)('div')`
+  display: flex;
+  flex: 1;
+  flex-direction: row;
+  justify-content: space-between;
+  cursor: pointer;
+  padding: ${({
+  theme
+}) => theme.spacing.kilo} 0;
+`;
+exports.TitleContainer = TitleContainer;
+const AccordionContainer = (0, _styled.default)('div')`
+  display: flex;
+  flex-direction: column;
+  border-bottom: ${({
+  theme
+}) => `${theme.borderWidth.pico} solid ${theme.color.secondary.light}`};
+  background-color: ${({
+  theme
+}) => theme.miscellaneous.surfaceColor};
+`;
+exports.AccordionContainer = AccordionContainer;
+const ContentContainer = (0, _styled.default)('div')`
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+`;
+exports.ContentContainer = ContentContainer;
+//# sourceMappingURL=styled.js.map

package/dist/components/atoms/Accordion/styled.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/atoms/Accordion/styled.ts"],"names":["IconContainer","theme","borderRadius","mili","borderWidth","pico","color","secondary","light","TitleContainer","spacing","kilo","AccordionContainer","miscellaneous","surfaceColor","ContentContainer"],"mappings":";;;;;;;AAAA;;;;AAGO,MAAMA,aAAa,GAAG,qBAAO,KAAP,CAAmC;AAChE,mBAAmB,CAAC;AAAEC,EAAAA;AAAF,CAAD,KAAeA,KAAK,CAACC,YAAN,CAAmBC,IAAK;AAC1D,YAAY,CAAC;AAAEF,EAAAA;AAAF,CAAD,KACP,GAAEA,KAAK,CAACG,WAAN,CAAkBC,IAAK,UAASJ,KAAK,CAACK,KAAN,CAAYC,SAAZ,CAAsBC,KAAM,EAAE;AACrE;AACA;AACA;AACA;AACA,CARO;;AAUA,MAAMC,cAAc,GAAG,qBAAO,KAAP,CAAmC;AACjE;AACA;AACA;AACA;AACA;AACA,aAAa,CAAC;AAAER,EAAAA;AAAF,CAAD,KAAeA,KAAK,CAACS,OAAN,CAAcC,IAAK;AAC/C,CAPO;;AASA,MAAMC,kBAAkB,GAAG,qBAAO,KAAP,CAAmC;AACrE;AACA;AACA,mBAAmB,CAAC;AAAEX,EAAAA;AAAF,CAAD,KACd,GAAEA,KAAK,CAACG,WAAN,CAAkBC,IAAK,UAASJ,KAAK,CAACK,KAAN,CAAYC,SAAZ,CAAsBC,KAAM,EAAE;AACrE,sBAAsB,CAAC;AAAEP,EAAAA;AAAF,CAAD,KAAeA,KAAK,CAACY,aAAN,CAAoBC,YAAa;AACtE,CANO;;AAQA,MAAMC,gBAAgB,GAAG,qBAAO,KAAP,CAAc;AAC9C;AACA;AACA;AACA,CAJO","sourcesContent":["import styled from '@emotion/styled';\nimport { StyleProps } from '@tecsinapse/react-core';\n\nexport const IconContainer = styled('div')<Partial<StyleProps>>`\n  border-radius: ${({ theme }) => theme.borderRadius.mili};\n  border: ${({ theme }) =>\n    `${theme.borderWidth.pico} solid ${theme.color.secondary.light}`};\n  display: flex;\n  text-align: center;\n  justify-content: center;\n  align-items: center;\n`;\n\nexport const TitleContainer = styled('div')<Partial<StyleProps>>`\n  display: flex;\n  flex: 1;\n  flex-direction: row;\n  justify-content: space-between;\n  cursor: pointer;\n  padding: ${({ theme }) => theme.spacing.kilo} 0;\n`;\n\nexport const AccordionContainer = styled('div')<Partial<StyleProps>>`\n  display: flex;\n  flex-direction: column;\n  border-bottom: ${({ theme }) =>\n    `${theme.borderWidth.pico} solid ${theme.color.secondary.light}`};\n  background-color: ${({ theme }) => theme.miscellaneous.surfaceColor};\n`;\n\nexport const ContentContainer = styled('div')`\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n`;\n"],"file":"styled.js"}

package/dist/components/atoms/Badge/index.js

@@ -18,7 +18,7 @@ Object.defineProperty(exports, "BadgeWebProps", {
 
 var _Badge = _interopRequireWildcard(require("./Badge"));
 
-function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
-function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (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; }
+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; }
 //# sourceMappingURL=index.js.map

package/dist/components/atoms/Button/index.js

@@ -36,7 +36,7 @@ Object.keys(_useMouseHover).forEach(function (key) {
   });
 });
 
-function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
-function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (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; }
+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; }
 //# sourceMappingURL=index.js.map

package/dist/components/atoms/Button/styled.js

@@ -9,13 +9,15 @@ var _native = _interopRequireWildcard(require("@emotion/native"));
 
 var _reactCore = require("@tecsinapse/react-core");
 
-function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
-function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (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; }
+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; }
 
 const webStyles = () => {
   return (0, _native.css)`
-    user-select: none;
+    & * {
+      user-select: none;
+    }
   `;
 };
 

package/dist/components/atoms/Button/styled.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/atoms/Button/styled.ts"],"names":["webStyles","hoverStyles","mouseOver","theme","color","disabled","dark","StyledWebButton","Button"],"mappings":";;;;;;;AAAA;;AACA;;;;;;AAGA,MAAMA,SAAS,GAAG,MAAM;AACtB,SAAO,gBAAI;AACb;AACA,GAFE;AAGD,CAJD;;AAMA,MAAMC,WAAW,GAAG,CAAC;AACnBC,EAAAA,SADmB;AAEnBC,EAAAA,KAFmB;AAGnBC,EAAAA,KAAK,GAAG,SAHW;AAInBC,EAAAA;AAJmB,CAAD,KAKiD;AACnE,SACEH,SAAS,IACT,CAACG,QADD,IAEA,gBAAI;AACR,0BAA0BF,KADnB,aACmBA,KADnB,uBACmBA,KAAK,CAAEC,KAAP,CAAaA,KAAb,EAAoBE,IAAK;AACnD,sBAAsBH,KAFf,aAEeA,KAFf,uBAEeA,KAAK,CAAEC,KAAP,CAAaA,KAAb,EAAoBE,IAAK;AAC/C,KANE;AAQD,CAdD;;AAgBO,MAAMC,eAAe,GAAG,qBAAOC,iBAAP,EAE7BR,SAF6B,EAElBC,WAFkB,CAAxB","sourcesContent":["import styled, { css } from '@emotion/native';\nimport { Button, StyleProps } from '@tecsinapse/react-core';\nimport { WebButtonProps } from './Button';\n\nconst webStyles = () => {\n  return css`\n    user-select: none;\n  `;\n};\n\nconst hoverStyles = ({\n  mouseOver,\n  theme,\n  color = 'primary',\n  disabled,\n}: { mouseOver: boolean } & WebButtonProps & Partial<StyleProps>) => {\n  return (\n    mouseOver &&\n    !disabled &&\n    css`\n      background-color: ${theme?.color[color].dark};\n      border-color: ${theme?.color[color].dark};\n    `\n  );\n};\n\nexport const StyledWebButton = styled(Button)<\n  { mouseOver: boolean } & WebButtonProps & Partial<StyleProps>\n>(webStyles, hoverStyles);\n"],"file":"styled.js"}
+{"version":3,"sources":["../../../../src/components/atoms/Button/styled.ts"],"names":["webStyles","hoverStyles","mouseOver","theme","color","disabled","dark","StyledWebButton","Button"],"mappings":";;;;;;;AAAA;;AACA;;;;;;AAGA,MAAMA,SAAS,GAAG,MAAM;AACtB,SAAO,gBAAI;AACb;AACA;AACA;AACA,GAJE;AAKD,CAND;;AAQA,MAAMC,WAAW,GAAG,CAAC;AACnBC,EAAAA,SADmB;AAEnBC,EAAAA,KAFmB;AAGnBC,EAAAA,KAAK,GAAG,SAHW;AAInBC,EAAAA;AAJmB,CAAD,KAKiD;AACnE,SACEH,SAAS,IACT,CAACG,QADD,IAEA,gBAAI;AACR,0BAA0BF,KADnB,aACmBA,KADnB,uBACmBA,KAAK,CAAEC,KAAP,CAAaA,KAAb,EAAoBE,IAAK;AACnD,sBAAsBH,KAFf,aAEeA,KAFf,uBAEeA,KAAK,CAAEC,KAAP,CAAaA,KAAb,EAAoBE,IAAK;AAC/C,KANE;AAQD,CAdD;;AAgBO,MAAMC,eAAe,GAAG,qBAAOC,iBAAP,EAE7BR,SAF6B,EAElBC,WAFkB,CAAxB","sourcesContent":["import styled, { css } from '@emotion/native';\nimport { Button, StyleProps } from '@tecsinapse/react-core';\nimport { WebButtonProps } from './Button';\n\nconst webStyles = () => {\n  return css`\n    & * {\n      user-select: none;\n    }\n  `;\n};\n\nconst hoverStyles = ({\n  mouseOver,\n  theme,\n  color = 'primary',\n  disabled,\n}: { mouseOver: boolean } & WebButtonProps & Partial<StyleProps>) => {\n  return (\n    mouseOver &&\n    !disabled &&\n    css`\n      background-color: ${theme?.color[color].dark};\n      border-color: ${theme?.color[color].dark};\n    `\n  );\n};\n\nexport const StyledWebButton = styled(Button)<\n  { mouseOver: boolean } & WebButtonProps & Partial<StyleProps>\n>(webStyles, hoverStyles);\n"],"file":"styled.js"}

package/dist/components/atoms/Input/index.js

@@ -18,7 +18,7 @@ Object.defineProperty(exports, "InputWebProps", {
 
 var _Input = _interopRequireWildcard(require("./Input"));
 
-function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
-function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (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; }
+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; }
 //# sourceMappingURL=index.js.map

package/dist/components/atoms/Modal/Modal.d.ts

@@ -0,0 +1,8 @@
+import React, { CSSProperties } from 'react';
+export interface ModalProps {
+    open: boolean;
+    onClose: () => void;
+    style?: CSSProperties;
+}
+declare const Modal: React.FC<ModalProps>;
+export default Modal;

package/dist/components/atoms/Modal/Modal.js

@@ -0,0 +1,43 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _reactTransitionGroup = require("react-transition-group");
+
+var _Overlay = require("../Overlay");
+
+var _styled = require("./styled");
+
+var _animations = require("./animations");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+const Modal = ({
+  children,
+  open,
+  onClose,
+  style
+}) => {
+  return _react.default.createElement(_react.default.Fragment, null, _react.default.createElement(_Overlay.Overlay, {
+    open: open,
+    onClose: onClose,
+    zIndex: "modal"
+  }), _react.default.createElement(_reactTransitionGroup.Transition, {
+    in: open,
+    timeout: 400
+  }, state => _react.default.createElement(_styled.ModalContainer, {
+    style: { ...style,
+      ..._animations.defaultStyleOverlay,
+      ..._animations.transitionStylesOverlay[state]
+    }
+  }, children)));
+};
+
+var _default = Modal;
+exports.default = _default;
+//# sourceMappingURL=Modal.js.map