@tecsinapse/react-web-kit 1.19.0 → 1.20.2

package/esm/components/atoms/Tooltip/Tooltip.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+export declare type ComputedType = {
+    width?: number;
+    height?: number;
+};
+export declare type Position = 'top' | 'bottom' | 'right' | 'left';
+export interface ITooltip {
+    title: string;
+    position?: Position;
+    children?: React.ReactNode;
+}
+declare const Tooltip: React.FC<ITooltip>;
+export default Tooltip;

package/esm/components/atoms/Tooltip/Tooltip.js

@@ -0,0 +1,41 @@
+import React from 'react';
+import { Text } from '@tecsinapse/react-core';
+import { Container, TooltipSpan } from "./styled";
+
+var Tooltip = function Tooltip(_ref) {
+  var children = _ref.children,
+      title = _ref.title,
+      _ref$position = _ref.position,
+      position = _ref$position === void 0 ? 'bottom' : _ref$position;
+  var spanRef = React.useRef();
+
+  var _React$useState = React.useState(undefined),
+      computed = _React$useState[0],
+      setComputed = _React$useState[1];
+
+  React.useLayoutEffect(function () {
+    var _spanRef$current, _spanRef$current2;
+
+    setComputed({
+      width: (_spanRef$current = spanRef.current) == null ? void 0 : _spanRef$current.clientWidth,
+      height: (_spanRef$current2 = spanRef.current) == null ? void 0 : _spanRef$current2.clientHeight
+    });
+  }, []);
+  return React.createElement(Container, {
+    position: position
+  }, children, React.createElement(TooltipSpan, {
+    computed: computed,
+    position: position,
+    ref: function ref(_ref2) {
+      return spanRef.current = _ref2;
+    }
+  }, React.createElement(Text, {
+    fontWeight: "bold",
+    typography: "base",
+    colorVariant: "secondary",
+    colorTone: "xlight"
+  }, title)));
+};
+
+export default Tooltip;
+//# sourceMappingURL=Tooltip.js.map

package/esm/components/atoms/Tooltip/Tooltip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tooltip.js","names":["React","Text","Container","TooltipSpan","Tooltip","children","title","position","spanRef","useRef","useState","undefined","computed","setComputed","useLayoutEffect","width","current","clientWidth","height","clientHeight","ref"],"sources":["../../../../src/components/atoms/Tooltip/Tooltip.tsx"],"sourcesContent":["import React from 'react';\nimport { Text } from '@tecsinapse/react-core';\nimport { Container, TooltipSpan } from './styled';\n\nexport type ComputedType = { width?: number; height?: number };\nexport type Position = 'top' | 'bottom' | 'right' | 'left';\n\nexport interface ITooltip {\n  title: string;\n  position?: Position;\n  children?: React.ReactNode;\n}\n\nconst Tooltip: React.FC<ITooltip> = ({\n  children,\n  title,\n  position = 'bottom',\n}) => {\n  const spanRef = React.useRef<HTMLSpanElement | null>();\n  const [computed, setComputed] = React.useState<ComputedType | undefined>(\n    undefined\n  );\n\n  React.useLayoutEffect(() => {\n    setComputed({\n      width: spanRef.current?.clientWidth,\n      height: spanRef.current?.clientHeight,\n    });\n  }, []);\n\n  return (\n    <Container position={position}>\n      {children}\n      <TooltipSpan\n        computed={computed}\n        position={position}\n        ref={ref => (spanRef.current = ref)}\n      >\n        <Text\n          fontWeight=\"bold\"\n          typography=\"base\"\n          colorVariant=\"secondary\"\n          colorTone=\"xlight\"\n        >\n          {title}\n        </Text>\n      </TooltipSpan>\n    </Container>\n  );\n};\n\nexport default Tooltip;\n"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,IAAT,QAAqB,wBAArB;AACA,SAASC,SAAT,EAAoBC,WAApB;;AAWA,IAAMC,OAA2B,GAAG,SAA9BA,OAA8B,OAI9B;EAAA,IAHJC,QAGI,QAHJA,QAGI;EAAA,IAFJC,KAEI,QAFJA,KAEI;EAAA,yBADJC,QACI;EAAA,IADJA,QACI,8BADO,QACP;EACJ,IAAMC,OAAO,GAAGR,KAAK,CAACS,MAAN,EAAhB;;EACA,sBAAgCT,KAAK,CAACU,QAAN,CAC9BC,SAD8B,CAAhC;EAAA,IAAOC,QAAP;EAAA,IAAiBC,WAAjB;;EAIAb,KAAK,CAACc,eAAN,CAAsB,YAAM;IAAA;;IAC1BD,WAAW,CAAC;MACVE,KAAK,sBAAEP,OAAO,CAACQ,OAAV,qBAAE,iBAAiBC,WADd;MAEVC,MAAM,uBAAEV,OAAO,CAACQ,OAAV,qBAAE,kBAAiBG;IAFf,CAAD,CAAX;EAID,CALD,EAKG,EALH;EAOA,OACE,oBAAC,SAAD;IAAW,QAAQ,EAAEZ;EAArB,GACGF,QADH,EAEE,oBAAC,WAAD;IACE,QAAQ,EAAEO,QADZ;IAEE,QAAQ,EAAEL,QAFZ;IAGE,GAAG,EAAE,aAAAa,KAAG;MAAA,OAAKZ,OAAO,CAACQ,OAAR,GAAkBI,KAAvB;IAAA;EAHV,GAKE,oBAAC,IAAD;IACE,UAAU,EAAC,MADb;IAEE,UAAU,EAAC,MAFb;IAGE,YAAY,EAAC,WAHf;IAIE,SAAS,EAAC;EAJZ,GAMGd,KANH,CALF,CAFF,CADF;AAmBD,CApCD;;AAsCA,eAAeF,OAAf"}

package/esm/components/atoms/Tooltip/index.d.ts

@@ -0,0 +1,2 @@
+export { default as Tooltip } from './Tooltip';
+export type { ITooltip } from './Tooltip';

package/esm/components/atoms/Tooltip/index.js

@@ -0,0 +1,2 @@
+export { default as Tooltip } from "./Tooltip";
+//# sourceMappingURL=index.js.map

package/esm/components/atoms/Tooltip/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["default","Tooltip"],"sources":["../../../../src/components/atoms/Tooltip/index.ts"],"sourcesContent":["export { default as Tooltip } from './Tooltip';\nexport type { ITooltip } from './Tooltip';\n"],"mappings":"AAAA,SAASA,OAAO,IAAIC,OAApB"}

package/esm/components/atoms/Tooltip/styled.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import { Position } from './Tooltip';
+export declare const TooltipSpan: import("@emotion/styled").StyledComponent<any, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
+export declare const Container: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & {
+    position?: Position | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/esm/components/atoms/Tooltip/styled.js

@@ -0,0 +1,73 @@
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14;
+
+function _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.slice(0); } strings.raw = raw; return strings; }
+
+import { css } from '@emotion/react';
+import styled from '@emotion/styled';
+
+var bottomOrTopStylesCommon = function bottomOrTopStylesCommon(width, position) {
+  return ['top', 'bottom'].includes(position) && css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n    left: 50%;\n    margin-left: -", "px;\n  "])), width / 2);
+};
+
+var bottomOrTopArrowCommon = function bottomOrTopArrowCommon(position) {
+  return ['top', 'bottom'].includes(position) && css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n    left: 50%;\n    margin-left: -5px;\n  "])));
+};
+
+var topStyles = function topStyles(theme, position) {
+  return position === 'top' && css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n    bottom: 100%;\n    margin-bottom: ", ";\n    transform: translateY(10%);\n  "])), theme.spacing.centi);
+};
+
+var topArrow = function topArrow(theme, position) {
+  return position === 'top' && css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n    top: 100%;\n    border-color: ", " transparent transparent\n      transparent;\n  "])), theme.color.secondary.xdark);
+};
+
+var bottomStyles = function bottomStyles(theme, position) {
+  return position === 'bottom' && css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n    top: 100%;\n    margin-top: ", ";\n    transform: translateY(-10%);\n  "])), theme.spacing.centi);
+};
+
+var bottomArrow = function bottomArrow(theme, position) {
+  return position === 'bottom' && css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n    bottom: 100%;\n    border-color: transparent transparent ", "\n      transparent;\n  "])), theme.color.secondary.xdark);
+};
+
+var leftAndRightCommonStyles = function leftAndRightCommonStyles(height, position) {
+  return ['right', 'left'].includes(position) && css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteralLoose(["\n    top: 50%;\n    margin-top: -", "px;\n  "])), height / 2);
+};
+
+var leftOrRightArrowCommon = function leftOrRightArrowCommon(position) {
+  return ['right', 'left'].includes(position) && css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteralLoose(["\n    top: 50%;\n    margin-top: -5px;\n  "])));
+};
+
+var leftStyles = function leftStyles(theme, position) {
+  return position === 'left' && css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteralLoose(["\n    right: 100%;\n    margin-right: ", ";\n    transform: translateX(10%);\n  "])), theme.spacing.centi);
+};
+
+var leftArrow = function leftArrow(theme, position) {
+  return position === 'left' && css(_templateObject10 || (_templateObject10 = _taggedTemplateLiteralLoose(["\n    left: 100%;\n    border-color: transparent transparent transparent\n      ", ";\n  "])), theme.color.secondary.xdark);
+};
+
+var rightStyles = function rightStyles(theme, position) {
+  return position === 'right' && css(_templateObject11 || (_templateObject11 = _taggedTemplateLiteralLoose(["\n    left: 100%;\n    margin-left: ", ";\n    transform: translateX(-10%);\n  "])), theme.spacing.centi);
+};
+
+var rightArrow = function rightArrow(theme, position) {
+  return position === 'right' && css(_templateObject12 || (_templateObject12 = _taggedTemplateLiteralLoose(["\n    right: 100%;\n    border-color: transparent ", " transparent\n      transparent;\n  "])), theme.color.secondary.xdark);
+};
+
+export var TooltipSpan = styled('span')(function (_ref) {
+  var theme = _ref.theme,
+      computed = _ref.computed,
+      position = _ref.position;
+
+  var _ref2 = computed || {},
+      _ref2$width = _ref2.width,
+      width = _ref2$width === void 0 ? 0 : _ref2$width,
+      _ref2$height = _ref2.height,
+      height = _ref2$height === void 0 ? 0 : _ref2$height;
+
+  return css(_templateObject13 || (_templateObject13 = _taggedTemplateLiteralLoose(["\n      position: absolute;\n      width: max-content;\n      padding: ", " ", ";\n      border-radius: ", ";\n      opacity: 0;\n      visibility: hidden;\n      transition: opacity 0.3s, visibility 0.3s, transform 0.3s;\n      background-color: ", ";\n      z-index: ", ";\n\n      ", "\n      ", "\n      ", "\n      \n      ", "\n      ", "\n      ", "\n\n      &::after {\n        content: '';\n        position: absolute;\n        border-style: solid;\n        border-width: 5px;\n\n        ", "\n        ", "\n        ", "\n        \n        ", "\n        ", "\n        ", "\n      }\n    "])), theme.spacing.micro, theme.spacing.centi, theme.borderRadius.mili, theme.color.secondary.xdark, theme.zIndex.absolute, bottomOrTopStylesCommon(width, position), bottomStyles(theme, position), topStyles(theme, position), leftAndRightCommonStyles(height, position), leftStyles(theme, position), rightStyles(theme, position), bottomOrTopArrowCommon(position), bottomArrow(theme, position), topArrow(theme, position), leftOrRightArrowCommon(position), leftArrow(theme, position), rightArrow(theme, position));
+});
+export var Container = styled('div')(_templateObject14 || (_templateObject14 = _taggedTemplateLiteralLoose(["\n  position: relative;\n  &:hover {\n    & > span {\n      opacity: 1;\n      visibility: visible;\n      display: flex;\n      transform: ", ";\n    }\n  }\n"])), function (_ref3) {
+  var position = _ref3.position;
+  return position === 'left' || position === 'right' ? 'translateX(0%)' : 'translateY(0%)';
+});
+//# sourceMappingURL=styled.js.map

package/esm/components/atoms/Tooltip/styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styled.js","names":["css","styled","bottomOrTopStylesCommon","width","position","includes","bottomOrTopArrowCommon","topStyles","theme","spacing","centi","topArrow","color","secondary","xdark","bottomStyles","bottomArrow","leftAndRightCommonStyles","height","leftOrRightArrowCommon","leftStyles","leftArrow","rightStyles","rightArrow","TooltipSpan","computed","micro","borderRadius","mili","zIndex","absolute","Container"],"sources":["../../../../src/components/atoms/Tooltip/styled.ts"],"sourcesContent":["import { css } from '@emotion/react';\nimport { StyleProps, ThemeProp } from '@tecsinapse/react-core';\nimport styled from '@emotion/styled';\nimport { ComputedType, Position } from './Tooltip';\n\ntype InjectedProps = { computed?: ComputedType; position?: Position };\n\n/** Bottom/Top commons */\nconst bottomOrTopStylesCommon = (width: number, position) =>\n  ['top', 'bottom'].includes(position as Position) &&\n  css`\n    left: 50%;\n    margin-left: -${width / 2}px;\n  `;\n\nconst bottomOrTopArrowCommon = (position?: Position) =>\n  ['top', 'bottom'].includes(position as Position) &&\n  css`\n    left: 50%;\n    margin-left: -5px;\n  `;\n\n/** Top */\nconst topStyles = (theme: ThemeProp, position?: Position) =>\n  position === 'top' &&\n  css`\n    bottom: 100%;\n    margin-bottom: ${theme.spacing.centi};\n    transform: translateY(10%);\n  `;\n\nconst topArrow = (theme: ThemeProp, position?: Position) =>\n  position === 'top' &&\n  css`\n    top: 100%;\n    border-color: ${theme.color.secondary.xdark} transparent transparent\n      transparent;\n  `;\n\n/** Bottom */\nconst bottomStyles = (theme: ThemeProp, position?: Position) =>\n  position === 'bottom' &&\n  css`\n    top: 100%;\n    margin-top: ${theme.spacing.centi};\n    transform: translateY(-10%);\n  `;\n\nconst bottomArrow = (theme: ThemeProp, position?: Position) =>\n  position === 'bottom' &&\n  css`\n    bottom: 100%;\n    border-color: transparent transparent ${theme.color.secondary.xdark}\n      transparent;\n  `;\n\n/** Bottom/Top commons */\nconst leftAndRightCommonStyles = (height: number, position?: Position) =>\n  ['right', 'left'].includes(position as Position) &&\n  css`\n    top: 50%;\n    margin-top: -${height / 2}px;\n  `;\n\nconst leftOrRightArrowCommon = (position?: Position) =>\n  ['right', 'left'].includes(position as Position) &&\n  css`\n    top: 50%;\n    margin-top: -5px;\n  `;\n\n/** Left */\nconst leftStyles = (theme: ThemeProp, position?: Position) =>\n  position === 'left' &&\n  css`\n    right: 100%;\n    margin-right: ${theme.spacing.centi};\n    transform: translateX(10%);\n  `;\n\nconst leftArrow = (theme: ThemeProp, position?: Position) =>\n  position === 'left' &&\n  css`\n    left: 100%;\n    border-color: transparent transparent transparent\n      ${theme.color.secondary.xdark};\n  `;\n\n/** Right */\nconst rightStyles = (theme: ThemeProp, position?: Position) =>\n  position === 'right' &&\n  css`\n    left: 100%;\n    margin-left: ${theme.spacing.centi};\n    transform: translateX(-10%);\n  `;\n\nconst rightArrow = (theme: ThemeProp, position?: Position) =>\n  position === 'right' &&\n  css`\n    right: 100%;\n    border-color: transparent ${theme.color.secondary.xdark} transparent\n      transparent;\n  `;\n\nexport const TooltipSpan = styled('span')<Partial<StyleProps> & InjectedProps>(\n  ({ theme, computed, position }) => {\n    const { width = 0, height = 0 } = computed || {};\n    return css`\n      position: absolute;\n      width: max-content;\n      padding: ${theme.spacing.micro} ${theme.spacing.centi};\n      border-radius: ${theme.borderRadius.mili};\n      opacity: 0;\n      visibility: hidden;\n      transition: opacity 0.3s, visibility 0.3s, transform 0.3s;\n      background-color: ${theme.color.secondary.xdark};\n      z-index: ${theme.zIndex.absolute};\n\n      ${bottomOrTopStylesCommon(width, position)}\n      ${bottomStyles(theme, position)}\n      ${topStyles(theme, position)}\n      \n      ${leftAndRightCommonStyles(height, position)}\n      ${leftStyles(theme, position)}\n      ${rightStyles(theme, position)}\n\n      &::after {\n        content: '';\n        position: absolute;\n        border-style: solid;\n        border-width: 5px;\n\n        ${bottomOrTopArrowCommon(position)}\n        ${bottomArrow(theme, position)}\n        ${topArrow(theme, position)}\n        \n        ${leftOrRightArrowCommon(position)}\n        ${leftArrow(theme, position)}\n        ${rightArrow(theme, position)}\n      }\n    `;\n  }\n);\n\nexport const Container = styled('div')<{ position?: Position }>`\n  position: relative;\n  &:hover {\n    & > span {\n      opacity: 1;\n      visibility: visible;\n      display: flex;\n      transform: ${({ position }) =>\n        position === 'left' || position === 'right'\n          ? 'translateX(0%)'\n          : 'translateY(0%)'};\n    }\n  }\n`;\n"],"mappings":"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"}

package/esm/components/molecules/Breadcrumbs/BreadcrumbItem/BreadcrumbItem.d.ts

@@ -0,0 +1,9 @@
+import { ElementType, FC } from 'react';
+export interface BreadcrumbItemProps {
+    Component: ElementType;
+    props: any;
+    isLast: boolean;
+    title: string;
+}
+declare const BreadcrumbItem: FC<BreadcrumbItemProps>;
+export default BreadcrumbItem;

package/esm/components/molecules/Breadcrumbs/BreadcrumbItem/BreadcrumbItem.js

@@ -0,0 +1,29 @@
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+import React from 'react';
+import { Icon, Text } from '@tecsinapse/react-core';
+import { StyledContainerItem, StyledContainerIcon } from "./styled";
+
+var BreadcrumbItem = function BreadcrumbItem(_ref) {
+  var props = _ref.props,
+      Component = _ref.Component,
+      isLast = _ref.isLast,
+      title = _ref.title;
+  var noTextDecoration = {
+    textDecoration: 'none'
+  };
+  return React.createElement(StyledContainerItem, null, React.createElement(Component, _extends({}, props, {
+    style: noTextDecoration
+  }), React.createElement(Text, {
+    colorVariant: "secondary",
+    colorTone: isLast ? 'medium' : 'xdark'
+  }, title)), !isLast && React.createElement(StyledContainerIcon, null, React.createElement(Icon, {
+    name: "chevron-double-right",
+    type: "material-community",
+    size: "centi",
+    fontColor: "orange"
+  })));
+};
+
+export default BreadcrumbItem;
+//# sourceMappingURL=BreadcrumbItem.js.map

package/esm/components/molecules/Breadcrumbs/BreadcrumbItem/BreadcrumbItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BreadcrumbItem.js","names":["React","Icon","Text","StyledContainerItem","StyledContainerIcon","BreadcrumbItem","props","Component","isLast","title","noTextDecoration","textDecoration"],"sources":["../../../../../src/components/molecules/Breadcrumbs/BreadcrumbItem/BreadcrumbItem.tsx"],"sourcesContent":["import React, { ElementType, FC } from 'react';\nimport { Icon, Text } from '@tecsinapse/react-core';\nimport { StyledContainerItem, StyledContainerIcon } from './styled';\n\nexport interface BreadcrumbItemProps {\n  Component: ElementType;\n  props: any;\n  isLast: boolean;\n  title: string;\n}\n\nconst BreadcrumbItem: FC<BreadcrumbItemProps> = ({\n  props,\n  Component,\n  isLast,\n  title,\n}) => {\n  const noTextDecoration = { textDecoration: 'none' };\n  return (\n    <StyledContainerItem>\n      <Component {...props} style={noTextDecoration}>\n        <Text colorVariant=\"secondary\" colorTone={isLast ? 'medium' : 'xdark'}>\n          {title}\n        </Text>\n      </Component>\n      {!isLast && (\n        <StyledContainerIcon>\n          <Icon\n            name=\"chevron-double-right\"\n            type=\"material-community\"\n            size=\"centi\"\n            fontColor=\"orange\"\n          />\n        </StyledContainerIcon>\n      )}\n    </StyledContainerItem>\n  );\n};\n\nexport default BreadcrumbItem;\n"],"mappings":";;AAAA,OAAOA,KAAP,MAAuC,OAAvC;AACA,SAASC,IAAT,EAAeC,IAAf,QAA2B,wBAA3B;AACA,SAASC,mBAAT,EAA8BC,mBAA9B;;AASA,IAAMC,cAAuC,GAAG,SAA1CA,cAA0C,OAK1C;EAAA,IAJJC,KAII,QAJJA,KAII;EAAA,IAHJC,SAGI,QAHJA,SAGI;EAAA,IAFJC,MAEI,QAFJA,MAEI;EAAA,IADJC,KACI,QADJA,KACI;EACJ,IAAMC,gBAAgB,GAAG;IAAEC,cAAc,EAAE;EAAlB,CAAzB;EACA,OACE,oBAAC,mBAAD,QACE,oBAAC,SAAD,eAAeL,KAAf;IAAsB,KAAK,EAAEI;EAA7B,IACE,oBAAC,IAAD;IAAM,YAAY,EAAC,WAAnB;IAA+B,SAAS,EAAEF,MAAM,GAAG,QAAH,GAAc;EAA9D,GACGC,KADH,CADF,CADF,EAMG,CAACD,MAAD,IACC,oBAAC,mBAAD,QACE,oBAAC,IAAD;IACE,IAAI,EAAC,sBADP;IAEE,IAAI,EAAC,oBAFP;IAGE,IAAI,EAAC,OAHP;IAIE,SAAS,EAAC;EAJZ,EADF,CAPJ,CADF;AAmBD,CA1BD;;AA4BA,eAAeH,cAAf"}

package/esm/components/molecules/Breadcrumbs/BreadcrumbItem/index.d.ts

@@ -0,0 +1,2 @@
+export { default as BreadcrumbItem } from './BreadcrumbItem';
+export * from './BreadcrumbItem';

package/esm/components/molecules/Breadcrumbs/BreadcrumbItem/index.js

@@ -0,0 +1,3 @@
+export { default as BreadcrumbItem } from "./BreadcrumbItem";
+export * from "./BreadcrumbItem";
+//# sourceMappingURL=index.js.map

package/esm/components/molecules/Breadcrumbs/BreadcrumbItem/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["default","BreadcrumbItem"],"sources":["../../../../../src/components/molecules/Breadcrumbs/BreadcrumbItem/index.ts"],"sourcesContent":["export { default as BreadcrumbItem } from './BreadcrumbItem';\nexport * from './BreadcrumbItem';\n"],"mappings":"AAAA,SAASA,OAAO,IAAIC,cAApB;AACA"}

package/esm/components/molecules/Breadcrumbs/BreadcrumbItem/styled.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+export declare const StyledContainerItem: import("@emotion/styled").StyledComponent<any, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const StyledContainerIcon: import("@emotion/styled").StyledComponent<any, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/esm/components/molecules/Breadcrumbs/BreadcrumbItem/styled.js

@@ -0,0 +1,14 @@
+var _templateObject, _templateObject2;
+
+function _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.slice(0); } strings.raw = raw; return strings; }
+
+import styled from '@emotion/styled';
+export var StyledContainerItem = styled('div')(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  flex-direction: row;\n  margin-right: ", ";\n"])), function (_ref) {
+  var theme = _ref.theme;
+  return theme.spacing.mili;
+});
+export var StyledContainerIcon = styled('div')(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n  margin-left: ", ";\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  text-align: center;\n"])), function (_ref2) {
+  var theme = _ref2.theme;
+  return theme.spacing.mili;
+});
+//# sourceMappingURL=styled.js.map

package/esm/components/molecules/Breadcrumbs/BreadcrumbItem/styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styled.js","names":["styled","StyledContainerItem","theme","spacing","mili","StyledContainerIcon"],"sources":["../../../../../src/components/molecules/Breadcrumbs/BreadcrumbItem/styled.ts"],"sourcesContent":["import styled from '@emotion/styled';\nimport { StyleProps } from '@tecsinapse/react-core';\n\nexport const StyledContainerItem = styled('div')<Partial<StyleProps>>`\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  flex-direction: row;\n  margin-right: ${({ theme }) => theme.spacing.mili};\n`;\n\nexport const StyledContainerIcon = styled('div')<Partial<StyleProps>>`\n  margin-left: ${({ theme }) => theme.spacing.mili};\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  text-align: center;\n`;\n"],"mappings":";;;;AAAA,OAAOA,MAAP,MAAmB,iBAAnB;AAGA,OAAO,IAAMC,mBAAmB,GAAGD,MAAM,CAAC,KAAD,CAAT,kMAKd;EAAA,IAAGE,KAAH,QAAGA,KAAH;EAAA,OAAeA,KAAK,CAACC,OAAN,CAAcC,IAA7B;AAAA,CALc,CAAzB;AAQP,OAAO,IAAMC,mBAAmB,GAAGL,MAAM,CAAC,KAAD,CAAT,kMACf;EAAA,IAAGE,KAAH,SAAGA,KAAH;EAAA,OAAeA,KAAK,CAACC,OAAN,CAAcC,IAA7B;AAAA,CADe,CAAzB"}

package/esm/components/molecules/Breadcrumbs/Breadcrumbs.d.ts

@@ -0,0 +1,11 @@
+import React, { ElementType, FC } from 'react';
+export declare type BreadcrumbType = {
+    title: string;
+    Component: ElementType;
+    props?: any;
+};
+export interface BreadcrumbsProps extends React.HTMLAttributes<HTMLDivElement> {
+    breadcrumbs: BreadcrumbType[];
+}
+declare const Breadcrumbs: FC<BreadcrumbsProps>;
+export default Breadcrumbs;

package/esm/components/molecules/Breadcrumbs/Breadcrumbs.js

@@ -0,0 +1,29 @@
+var _excluded = ["breadcrumbs"];
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
+import React from 'react';
+import { StyledContainerBreadcrumbs } from "./styled";
+import { BreadcrumbItem } from "./BreadcrumbItem";
+
+var Breadcrumbs = function Breadcrumbs(_ref) {
+  var breadcrumbs = _ref.breadcrumbs,
+      rest = _objectWithoutPropertiesLoose(_ref, _excluded);
+
+  return React.createElement(StyledContainerBreadcrumbs, rest, breadcrumbs.map(function (item, index) {
+    var props = item.props,
+        _item$Component = item.Component,
+        Component = _item$Component === void 0 ? 'a' : _item$Component,
+        title = item.title;
+    return React.createElement(BreadcrumbItem, {
+      key: index,
+      Component: Component,
+      props: props,
+      isLast: breadcrumbs.length - 1 === index,
+      title: title
+    });
+  }));
+};
+
+export default Breadcrumbs;
+//# sourceMappingURL=Breadcrumbs.js.map

package/esm/components/molecules/Breadcrumbs/Breadcrumbs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Breadcrumbs.js","names":["React","StyledContainerBreadcrumbs","BreadcrumbItem","Breadcrumbs","breadcrumbs","rest","map","item","index","props","Component","title","length"],"sources":["../../../../src/components/molecules/Breadcrumbs/Breadcrumbs.tsx"],"sourcesContent":["import React, { ElementType, FC } from 'react';\nimport { StyledContainerBreadcrumbs } from './styled';\nimport { BreadcrumbItem } from './BreadcrumbItem';\n\nexport type BreadcrumbType = {\n  title: string;\n  Component: ElementType;\n  props?: any;\n};\n\nexport interface BreadcrumbsProps extends React.HTMLAttributes<HTMLDivElement> {\n  breadcrumbs: BreadcrumbType[];\n}\n\nconst Breadcrumbs: FC<BreadcrumbsProps> = ({ breadcrumbs, ...rest }) => {\n  return (\n    <StyledContainerBreadcrumbs {...rest}>\n      {breadcrumbs.map((item, index) => {\n        const { props, Component = 'a', title } = item;\n        return (\n          <BreadcrumbItem\n            key={index}\n            Component={Component}\n            props={props}\n            isLast={breadcrumbs.length - 1 === index}\n            title={title}\n          />\n        );\n      })}\n    </StyledContainerBreadcrumbs>\n  );\n};\n\nexport default Breadcrumbs;\n"],"mappings":";;;;AAAA,OAAOA,KAAP,MAAuC,OAAvC;AACA,SAASC,0BAAT;AACA,SAASC,cAAT;;AAYA,IAAMC,WAAiC,GAAG,SAApCA,WAAoC,OAA8B;EAAA,IAA3BC,WAA2B,QAA3BA,WAA2B;EAAA,IAAXC,IAAW;;EACtE,OACE,oBAAC,0BAAD,EAAgCA,IAAhC,EACGD,WAAW,CAACE,GAAZ,CAAgB,UAACC,IAAD,EAAOC,KAAP,EAAiB;IAChC,IAAQC,KAAR,GAA0CF,IAA1C,CAAQE,KAAR;IAAA,sBAA0CF,IAA1C,CAAeG,SAAf;IAAA,IAAeA,SAAf,gCAA2B,GAA3B;IAAA,IAAgCC,KAAhC,GAA0CJ,IAA1C,CAAgCI,KAAhC;IACA,OACE,oBAAC,cAAD;MACE,GAAG,EAAEH,KADP;MAEE,SAAS,EAAEE,SAFb;MAGE,KAAK,EAAED,KAHT;MAIE,MAAM,EAAEL,WAAW,CAACQ,MAAZ,GAAqB,CAArB,KAA2BJ,KAJrC;MAKE,KAAK,EAAEG;IALT,EADF;EASD,CAXA,CADH,CADF;AAgBD,CAjBD;;AAmBA,eAAeR,WAAf"}

package/esm/components/molecules/Breadcrumbs/index.d.ts

@@ -0,0 +1,2 @@
+export { default as Breadcrumbs } from './Breadcrumbs';
+export type { BreadcrumbsProps, BreadcrumbType } from './Breadcrumbs';

package/esm/components/molecules/Breadcrumbs/index.js

@@ -0,0 +1,2 @@
+export { default as Breadcrumbs } from "./Breadcrumbs";
+//# sourceMappingURL=index.js.map

package/esm/components/molecules/Breadcrumbs/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["default","Breadcrumbs"],"sources":["../../../../src/components/molecules/Breadcrumbs/index.ts"],"sourcesContent":["export { default as Breadcrumbs } from './Breadcrumbs';\nexport type { BreadcrumbsProps, BreadcrumbType } from './Breadcrumbs';\n"],"mappings":"AAAA,SAASA,OAAO,IAAIC,WAApB"}

package/esm/components/molecules/Breadcrumbs/styled.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const StyledContainerBreadcrumbs: import("@emotion/styled").StyledComponent<any, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/esm/components/molecules/Breadcrumbs/styled.js

@@ -0,0 +1,20 @@
+var _templateObject;
+
+function _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.slice(0); } strings.raw = raw; return strings; }
+
+import styled from '@emotion/styled';
+import { hex2rgba } from '@tecsinapse/react-core';
+export var StyledContainerBreadcrumbs = styled('div')(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n  background-color: ", ";\n  display: flex;\n  align-items: center;\n  justify-content: flex-start;\n  padding: ", ";\n  border-radius: ", ";\n  box-shadow: 0px 2px 8px\n    ", ";\n"])), function (_ref) {
+  var theme = _ref.theme;
+  return theme.miscellaneous.surfaceColor;
+}, function (_ref2) {
+  var theme = _ref2.theme;
+  return theme.spacing.mili + " " + theme.spacing.deca;
+}, function (_ref3) {
+  var theme = _ref3.theme;
+  return theme.borderRadius.mili;
+}, function (_ref4) {
+  var theme = _ref4.theme;
+  return hex2rgba(theme.miscellaneous.shadow, 0.05);
+});
+//# sourceMappingURL=styled.js.map

package/esm/components/molecules/Breadcrumbs/styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styled.js","names":["styled","hex2rgba","StyledContainerBreadcrumbs","theme","miscellaneous","surfaceColor","spacing","mili","deca","borderRadius","shadow"],"sources":["../../../../src/components/molecules/Breadcrumbs/styled.ts"],"sourcesContent":["import styled from '@emotion/styled';\nimport { hex2rgba, StyleProps } from '@tecsinapse/react-core';\n\nexport const StyledContainerBreadcrumbs = styled('div')<Partial<StyleProps>>`\n  background-color: ${({ theme }) => theme.miscellaneous.surfaceColor};\n  display: flex;\n  align-items: center;\n  justify-content: flex-start;\n  padding: ${({ theme }) => `${theme.spacing.mili} ${theme.spacing.deca}`};\n  border-radius: ${({ theme }: StyleProps) => theme.borderRadius.mili};\n  box-shadow: 0px 2px 8px\n    ${({ theme }) => hex2rgba(theme.miscellaneous.shadow, 0.05)};\n`;\n"],"mappings":";;;;AAAA,OAAOA,MAAP,MAAmB,iBAAnB;AACA,SAASC,QAAT,QAAqC,wBAArC;AAEA,OAAO,IAAMC,0BAA0B,GAAGF,MAAM,CAAC,KAAD,CAAT,kQACjB;EAAA,IAAGG,KAAH,QAAGA,KAAH;EAAA,OAAeA,KAAK,CAACC,aAAN,CAAoBC,YAAnC;AAAA,CADiB,EAK1B;EAAA,IAAGF,KAAH,SAAGA,KAAH;EAAA,OAAkBA,KAAK,CAACG,OAAN,CAAcC,IAAhC,SAAwCJ,KAAK,CAACG,OAAN,CAAcE,IAAtD;AAAA,CAL0B,EAMpB;EAAA,IAAGL,KAAH,SAAGA,KAAH;EAAA,OAA2BA,KAAK,CAACM,YAAN,CAAmBF,IAA9C;AAAA,CANoB,EAQjC;EAAA,IAAGJ,KAAH,SAAGA,KAAH;EAAA,OAAeF,QAAQ,CAACE,KAAK,CAACC,aAAN,CAAoBM,MAArB,EAA6B,IAA7B,CAAvB;AAAA,CARiC,CAAhC"}

package/esm/components/molecules/DatePicker/DatePicker.d.ts

@@ -0,0 +1,3 @@
+import { DatePickerProps, SelectionType } from '@tecsinapse/react-core';
+export declare type WebDatePickerProps<T extends SelectionType> = Omit<DatePickerProps<T>, 'CalendarComponent' | 'renderCalendar' | 'requestCloseCalendar' | 'requestShowCalendar'>;
+export declare const DatePicker: <T extends any>({ value, type, ...rest }: WebDatePickerProps<T>) => JSX.Element;

package/esm/components/molecules/DatePicker/DatePicker.js

@@ -0,0 +1,63 @@
+var _excluded = ["value", "type"];
+
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
+import { Calendar, DatePicker as DatePickerCore } from '@tecsinapse/react-core';
+import React, { useCallback, useMemo, useState } from 'react';
+import { Dropdown } from "../../atoms/Dropdown";
+export var DatePicker = function DatePicker(_ref) {
+  var value = _ref.value,
+      type = _ref.type,
+      rest = _objectWithoutPropertiesLoose(_ref, _excluded);
+
+  var _useState = useState(false),
+      visible = _useState[0],
+      setVisible = _useState[1];
+
+  var show = useCallback(function () {
+    return setVisible(true);
+  }, []);
+  var close = useCallback(function () {
+    return setVisible(false);
+  }, []);
+  var getYear = useMemo(function () {
+    if (value) {
+      if (type === 'range') {
+        if (value.lowest !== undefined) return new Date(value.lowest).getFullYear();
+      } else {
+        return new Date(value).getFullYear();
+      }
+    }
+
+    return undefined;
+  }, [value]);
+  var getMonth = useMemo(function () {
+    if (value) {
+      if (type === 'range') {
+        if (value.lowest !== undefined) return new Date(value.lowest).getMonth();
+      } else {
+        return new Date(value).getMonth();
+      }
+    }
+
+    return undefined;
+  }, [value]);
+  return React.createElement(DatePickerCore, _extends({}, rest, {
+    CalendarComponent: Calendar,
+    value: value,
+    type: type,
+    year: getYear,
+    month: getMonth,
+    requestShowCalendar: show,
+    requestCloseCalendar: close,
+    renderCalendar: function renderCalendar(calendar) {
+      return React.createElement(Dropdown, {
+        visible: visible,
+        setVisible: setVisible
+      }, calendar);
+    }
+  }));
+};
+//# sourceMappingURL=DatePicker.js.map

package/esm/components/molecules/DatePicker/DatePicker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DatePicker.js","names":["Calendar","DatePicker","DatePickerCore","React","useCallback","useMemo","useState","Dropdown","value","type","rest","visible","setVisible","show","close","getYear","lowest","undefined","Date","getFullYear","getMonth","calendar"],"sources":["../../../../src/components/molecules/DatePicker/DatePicker.tsx"],"sourcesContent":["import {\n  Calendar,\n  DatePicker as DatePickerCore,\n  DatePickerProps,\n  DateRange,\n  SelectionType,\n} from '@tecsinapse/react-core';\nimport React, { useCallback, useMemo, useState } from 'react';\nimport { Dropdown } from '../../atoms/Dropdown';\n\nexport type WebDatePickerProps<T extends SelectionType> = Omit<\n  DatePickerProps<T>,\n  | 'CalendarComponent'\n  | 'renderCalendar'\n  | 'requestCloseCalendar'\n  | 'requestShowCalendar'\n>;\n\nexport const DatePicker = <T extends SelectionType>({\n  value,\n  type,\n  ...rest\n}: WebDatePickerProps<T>): JSX.Element => {\n  const [visible, setVisible] = useState(false);\n  const show = useCallback(() => setVisible(true), []);\n  const close = useCallback(() => setVisible(false), []);\n\n  const getYear = useMemo(() => {\n    if (value) {\n      if (type === 'range') {\n        if ((value as DateRange).lowest !== undefined)\n          return new Date((value as DateRange).lowest).getFullYear();\n      } else {\n        return new Date(value as Date).getFullYear();\n      }\n    }\n    return undefined;\n  }, [value]);\n\n  const getMonth = useMemo(() => {\n    if (value) {\n      if (type === 'range') {\n        if ((value as DateRange).lowest !== undefined)\n          return new Date((value as DateRange).lowest).getMonth();\n      } else {\n        return new Date(value as Date).getMonth();\n      }\n    }\n    return undefined;\n  }, [value]);\n\n  return (\n    <DatePickerCore\n      {...rest}\n      CalendarComponent={Calendar}\n      value={value}\n      type={type}\n      year={getYear}\n      month={getMonth}\n      requestShowCalendar={show}\n      requestCloseCalendar={close}\n      renderCalendar={calendar => (\n        <Dropdown visible={visible} setVisible={setVisible}>\n          {calendar}\n        </Dropdown>\n      )}\n    />\n  );\n};\n"],"mappings":";;;;;;AAAA,SACEA,QADF,EAEEC,UAAU,IAAIC,cAFhB,QAMO,wBANP;AAOA,OAAOC,KAAP,IAAgBC,WAAhB,EAA6BC,OAA7B,EAAsCC,QAAtC,QAAsD,OAAtD;AACA,SAASC,QAAT;AAUA,OAAO,IAAMN,UAAU,GAAG,SAAbA,UAAa,OAIgB;EAAA,IAHxCO,KAGwC,QAHxCA,KAGwC;EAAA,IAFxCC,IAEwC,QAFxCA,IAEwC;EAAA,IADrCC,IACqC;;EACxC,gBAA8BJ,QAAQ,CAAC,KAAD,CAAtC;EAAA,IAAOK,OAAP;EAAA,IAAgBC,UAAhB;;EACA,IAAMC,IAAI,GAAGT,WAAW,CAAC;IAAA,OAAMQ,UAAU,CAAC,IAAD,CAAhB;EAAA,CAAD,EAAyB,EAAzB,CAAxB;EACA,IAAME,KAAK,GAAGV,WAAW,CAAC;IAAA,OAAMQ,UAAU,CAAC,KAAD,CAAhB;EAAA,CAAD,EAA0B,EAA1B,CAAzB;EAEA,IAAMG,OAAO,GAAGV,OAAO,CAAC,YAAM;IAC5B,IAAIG,KAAJ,EAAW;MACT,IAAIC,IAAI,KAAK,OAAb,EAAsB;QACpB,IAAKD,KAAD,CAAqBQ,MAArB,KAAgCC,SAApC,EACE,OAAO,IAAIC,IAAJ,CAAUV,KAAD,CAAqBQ,MAA9B,EAAsCG,WAAtC,EAAP;MACH,CAHD,MAGO;QACL,OAAO,IAAID,IAAJ,CAASV,KAAT,EAAwBW,WAAxB,EAAP;MACD;IACF;;IACD,OAAOF,SAAP;EACD,CAVsB,EAUpB,CAACT,KAAD,CAVoB,CAAvB;EAYA,IAAMY,QAAQ,GAAGf,OAAO,CAAC,YAAM;IAC7B,IAAIG,KAAJ,EAAW;MACT,IAAIC,IAAI,KAAK,OAAb,EAAsB;QACpB,IAAKD,KAAD,CAAqBQ,MAArB,KAAgCC,SAApC,EACE,OAAO,IAAIC,IAAJ,CAAUV,KAAD,CAAqBQ,MAA9B,EAAsCI,QAAtC,EAAP;MACH,CAHD,MAGO;QACL,OAAO,IAAIF,IAAJ,CAASV,KAAT,EAAwBY,QAAxB,EAAP;MACD;IACF;;IACD,OAAOH,SAAP;EACD,CAVuB,EAUrB,CAACT,KAAD,CAVqB,CAAxB;EAYA,OACE,oBAAC,cAAD,eACME,IADN;IAEE,iBAAiB,EAAEV,QAFrB;IAGE,KAAK,EAAEQ,KAHT;IAIE,IAAI,EAAEC,IAJR;IAKE,IAAI,EAAEM,OALR;IAME,KAAK,EAAEK,QANT;IAOE,mBAAmB,EAAEP,IAPvB;IAQE,oBAAoB,EAAEC,KARxB;IASE,cAAc,EAAE,wBAAAO,QAAQ;MAAA,OACtB,oBAAC,QAAD;QAAU,OAAO,EAAEV,OAAnB;QAA4B,UAAU,EAAEC;MAAxC,GACGS,QADH,CADsB;IAAA;EAT1B,GADF;AAiBD,CAlDM"}

package/esm/components/molecules/DatePicker/Modal.d.ts

@@ -0,0 +1,3 @@
+import { CalendarProps } from '@tecsinapse/react-core';
+import { ModalProps } from 'react-native';
+export declare const Modal: <T extends any>({ onRequestClose, children, ...modalProps }: any) => JSX.Element;

package/esm/components/molecules/DatePicker/Modal.js

@@ -0,0 +1,30 @@
+var _excluded = ["onRequestClose", "children"];
+
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
+import { PressableSurface } from '@tecsinapse/react-core';
+import * as React from 'react';
+import { Modal as RNModal } from "react-native-web";
+import { Backdrop, ModalContent } from "./styled";
+
+var Component = function Component(_ref) {
+  var onRequestClose = _ref.onRequestClose,
+      children = _ref.children,
+      modalProps = _objectWithoutPropertiesLoose(_ref, _excluded);
+
+  return React.createElement(RNModal, _extends({
+    transparent: true,
+    hardwareAccelerated: true,
+    statusBarTranslucent: true
+  }, modalProps, {
+    onRequestClose: onRequestClose
+  }), React.createElement(Backdrop, {
+    onPress: onRequestClose,
+    effect: "none"
+  }, React.createElement(PressableSurface, null, React.createElement(ModalContent, null, children))));
+};
+
+export var Modal = Component;
+//# sourceMappingURL=Modal.js.map

package/esm/components/molecules/DatePicker/Modal.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Modal.js","names":["PressableSurface","React","Modal","RNModal","Backdrop","ModalContent","Component","onRequestClose","children","modalProps"],"sources":["../../../../src/components/molecules/DatePicker/Modal.tsx"],"sourcesContent":["import {\n  CalendarProps,\n  PressableSurface,\n  SelectionType,\n} from '@tecsinapse/react-core';\nimport * as React from 'react';\nimport { Modal as RNModal, ModalProps } from 'react-native';\nimport { Backdrop, ModalContent } from './styled';\n\nconst Component = <T extends SelectionType>({\n  onRequestClose,\n  children,\n  ...modalProps\n}: CalendarProps<T> & ModalProps & { children: JSX.Element }): JSX.Element => {\n  return (\n    <RNModal\n      transparent\n      hardwareAccelerated\n      statusBarTranslucent\n      {...modalProps}\n      onRequestClose={onRequestClose}\n    >\n      <Backdrop onPress={onRequestClose} effect=\"none\">\n        <PressableSurface>\n          <ModalContent>{children}</ModalContent>\n        </PressableSurface>\n      </Backdrop>\n    </RNModal>\n  );\n};\n\nexport const Modal = Component;\n"],"mappings":";;;;;;AAAA,SAEEA,gBAFF,QAIO,wBAJP;AAKA,OAAO,KAAKC,KAAZ,MAAuB,OAAvB;AACA,SAASC,KAAK,IAAIC,OAAlB;AACA,SAASC,QAAT,EAAmBC,YAAnB;;AAEA,IAAMC,SAAS,GAAG,SAAZA,SAAY,OAI4D;EAAA,IAH5EC,cAG4E,QAH5EA,cAG4E;EAAA,IAF5EC,QAE4E,QAF5EA,QAE4E;EAAA,IADzEC,UACyE;;EAC5E,OACE,oBAAC,OAAD;IACE,WAAW,MADb;IAEE,mBAAmB,MAFrB;IAGE,oBAAoB;EAHtB,GAIMA,UAJN;IAKE,cAAc,EAAEF;EALlB,IAOE,oBAAC,QAAD;IAAU,OAAO,EAAEA,cAAnB;IAAmC,MAAM,EAAC;EAA1C,GACE,oBAAC,gBAAD,QACE,oBAAC,YAAD,QAAeC,QAAf,CADF,CADF,CAPF,CADF;AAeD,CApBD;;AAsBA,OAAO,IAAMN,KAAK,GAAGI,SAAd"}

package/esm/components/molecules/DatePicker/index.d.ts

@@ -0,0 +1,2 @@
+export { DatePicker } from './DatePicker';
+export type { WebDatePickerProps } from './DatePicker';

package/esm/components/molecules/DatePicker/index.js

@@ -0,0 +1,2 @@
+export { DatePicker } from "./DatePicker";
+//# sourceMappingURL=index.js.map

package/esm/components/molecules/DatePicker/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["DatePicker"],"sources":["../../../../src/components/molecules/DatePicker/index.ts"],"sourcesContent":["export { DatePicker } from './DatePicker';\nexport type { WebDatePickerProps } from './DatePicker';\n"],"mappings":"AAAA,SAASA,UAAT"}

package/esm/components/molecules/DatePicker/styled.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+export declare const Backdrop: import("@emotion/native").StyledComponent<any, {}, {
+    ref?: import("react").Ref<any> | undefined;
+}>;
+export declare const ModalContent: import("@emotion/native").StyledComponent<any, {}, {
+    ref?: import("react").Ref<import("react-native").View> | undefined;
+}>;

package/esm/components/molecules/DatePicker/styled.js

@@ -0,0 +1,17 @@
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
+
+function _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.slice(0); } strings.raw = raw; return strings; }
+
+import styled, { css } from '@emotion/native';
+import { hex2rgba, PressableSurface } from '@tecsinapse/react-core';
+import { Platform } from "react-native-web";
+var isWeb = Platform.OS === 'web';
+export var Backdrop = styled(PressableSurface)(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n  ", "\n"])), function (_ref) {
+  var theme = _ref.theme;
+  return isWeb ? css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n          justify-content: center;\n          align-items: center;\n          background-color: ", ";\n          height: 100vh;\n        "])), hex2rgba(theme.miscellaneous.overlay, 0.5)) : css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n          justify-content: flex-end;\n          background-color: ", ";\n          height: 100%;\n        "])), hex2rgba(theme.miscellaneous.overlay, 0.5));
+});
+export var ModalContent = styled.View(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n  background-color: transparent;\n  ", "\n  overflow: hidden;\n"])), function (_ref2) {
+  var borderRadius = _ref2.theme.borderRadius;
+  return css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n    ", "\n  "])), isWeb ? "\n      border-radius: " + borderRadius.micro + ";\n    " : "\n      border-top-left-radius: " + borderRadius.deca + ";\n      border-top-right-radius: " + borderRadius.deca + ";\n    ");
+});
+//# sourceMappingURL=styled.js.map

package/esm/components/molecules/DatePicker/styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styled.js","names":["styled","css","hex2rgba","PressableSurface","Platform","isWeb","OS","Backdrop","theme","miscellaneous","overlay","ModalContent","View","borderRadius","micro","deca"],"sources":["../../../../src/components/molecules/DatePicker/styled.ts"],"sourcesContent":["import styled, { css } from '@emotion/native';\nimport { hex2rgba, PressableSurface, StyleProps } from '@tecsinapse/react-core';\nimport { Platform } from 'react-native';\n\nconst isWeb = Platform.OS === 'web';\n\nexport const Backdrop = styled(PressableSurface)<Partial<StyleProps>>`\n  ${({ theme }) =>\n    isWeb\n      ? css`\n          justify-content: center;\n          align-items: center;\n          background-color: ${hex2rgba(theme.miscellaneous.overlay, 0.5)};\n          height: 100vh;\n        `\n      : css`\n          justify-content: flex-end;\n          background-color: ${hex2rgba(theme.miscellaneous.overlay, 0.5)};\n          height: 100%;\n        `}\n`;\n\nexport const ModalContent = styled.View<Partial<StyleProps>>`\n  background-color: transparent;\n  ${({ theme: { borderRadius } }) => css`\n    ${isWeb\n      ? `\n      border-radius: ${borderRadius.micro};\n    `\n      : `\n      border-top-left-radius: ${borderRadius.deca};\n      border-top-right-radius: ${borderRadius.deca};\n    `}\n  `}\n  overflow: hidden;\n`;\n"],"mappings":";;;;AAAA,OAAOA,MAAP,IAAiBC,GAAjB,QAA4B,iBAA5B;AACA,SAASC,QAAT,EAAmBC,gBAAnB,QAAuD,wBAAvD;AACA,SAASC,QAAT;AAEA,IAAMC,KAAK,GAAGD,QAAQ,CAACE,EAAT,KAAgB,KAA9B;AAEA,OAAO,IAAMC,QAAQ,GAAGP,MAAM,CAACG,gBAAD,CAAT,qFACjB;EAAA,IAAGK,KAAH,QAAGA,KAAH;EAAA,OACAH,KAAK,GACDJ,GADC,wNAIqBC,QAAQ,CAACM,KAAK,CAACC,aAAN,CAAoBC,OAArB,EAA8B,GAA9B,CAJ7B,IAODT,GAPC,yLASqBC,QAAQ,CAACM,KAAK,CAACC,aAAN,CAAoBC,OAArB,EAA8B,GAA9B,CAT7B,CADL;AAAA,CADiB,CAAd;AAgBP,OAAO,IAAMC,YAAY,GAAGX,MAAM,CAACY,IAAV,8IAErB;EAAA,IAAYC,YAAZ,SAAGL,KAAH,CAAYK,YAAZ;EAAA,OAAiCZ,GAAjC,2FACEI,KAAK,+BAEYQ,YAAY,CAACC,KAFzB,oDAKqBD,YAAY,CAACE,IALlC,0CAMsBF,YAAY,CAACE,IANnC,YADP;AAAA,CAFqB,CAAlB"}

package/esm/components/molecules/DateTimePicker/DateTimePicker.d.ts

@@ -0,0 +1,4 @@
+import { DateTimePickerProps } from '@tecsinapse/react-core';
+import { FC } from 'react';
+export declare type WebDateTimePickerProps = Omit<DateTimePickerProps, 'renderSelector' | 'requestShowSelector' | 'requestCloseSelector'>;
+export declare const DateTimePicker: FC<WebDateTimePickerProps>;

package/esm/components/molecules/DateTimePicker/DateTimePicker.js

@@ -0,0 +1,30 @@
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+import { DateTimePicker as DateTimePickerCore } from '@tecsinapse/react-core';
+import React, { useCallback, useState } from 'react';
+import { Dropdown } from "../../atoms/Dropdown";
+export var DateTimePicker = function DateTimePicker(_ref) {
+  var rest = _extends({}, _ref);
+
+  var _useState = useState(false),
+      visible = _useState[0],
+      setVisible = _useState[1];
+
+  var show = useCallback(function () {
+    return setVisible(true);
+  }, []);
+  var close = useCallback(function () {
+    return setVisible(false);
+  }, []);
+  return React.createElement(DateTimePickerCore, _extends({}, rest, {
+    requestShowSelector: show,
+    requestCloseSelector: close,
+    renderSelector: function renderSelector(selector) {
+      return React.createElement(Dropdown, {
+        visible: visible,
+        setVisible: setVisible
+      }, selector);
+    }
+  }));
+};
+//# sourceMappingURL=DateTimePicker.js.map

package/esm/components/molecules/DateTimePicker/DateTimePicker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DateTimePicker.js","names":["DateTimePicker","DateTimePickerCore","React","useCallback","useState","Dropdown","rest","visible","setVisible","show","close","selector"],"sources":["../../../../src/components/molecules/DateTimePicker/DateTimePicker.tsx"],"sourcesContent":["import {\n  DateTimePicker as DateTimePickerCore,\n  DateTimePickerProps,\n} from '@tecsinapse/react-core';\nimport React, { FC, useCallback, useState } from 'react';\nimport { Dropdown } from '../../atoms/Dropdown';\n\nexport type WebDateTimePickerProps = Omit<\n  DateTimePickerProps,\n  'renderSelector' | 'requestShowSelector' | 'requestCloseSelector'\n>;\n\nexport const DateTimePicker: FC<WebDateTimePickerProps> = ({ ...rest }) => {\n  const [visible, setVisible] = useState<boolean>(false);\n\n  const show = useCallback(() => setVisible(true), []);\n  const close = useCallback(() => setVisible(false), []);\n\n  return (\n    <DateTimePickerCore\n      {...rest}\n      requestShowSelector={show}\n      requestCloseSelector={close}\n      renderSelector={selector => (\n        <Dropdown visible={visible} setVisible={setVisible}>\n          {selector}\n        </Dropdown>\n      )}\n    />\n  );\n};\n"],"mappings":";;AAAA,SACEA,cAAc,IAAIC,kBADpB,QAGO,wBAHP;AAIA,OAAOC,KAAP,IAAoBC,WAApB,EAAiCC,QAAjC,QAAiD,OAAjD;AACA,SAASC,QAAT;AAOA,OAAO,IAAML,cAA0C,GAAG,SAA7CA,cAA6C,OAAiB;EAAA,IAAXM,IAAW;;EACzE,gBAA8BF,QAAQ,CAAU,KAAV,CAAtC;EAAA,IAAOG,OAAP;EAAA,IAAgBC,UAAhB;;EAEA,IAAMC,IAAI,GAAGN,WAAW,CAAC;IAAA,OAAMK,UAAU,CAAC,IAAD,CAAhB;EAAA,CAAD,EAAyB,EAAzB,CAAxB;EACA,IAAME,KAAK,GAAGP,WAAW,CAAC;IAAA,OAAMK,UAAU,CAAC,KAAD,CAAhB;EAAA,CAAD,EAA0B,EAA1B,CAAzB;EAEA,OACE,oBAAC,kBAAD,eACMF,IADN;IAEE,mBAAmB,EAAEG,IAFvB;IAGE,oBAAoB,EAAEC,KAHxB;IAIE,cAAc,EAAE,wBAAAC,QAAQ;MAAA,OACtB,oBAAC,QAAD;QAAU,OAAO,EAAEJ,OAAnB;QAA4B,UAAU,EAAEC;MAAxC,GACGG,QADH,CADsB;IAAA;EAJ1B,GADF;AAYD,CAlBM"}

package/esm/components/molecules/DateTimePicker/Modal.d.ts

@@ -0,0 +1,2 @@
+import * as React from 'react';
+export declare const Modal: React.FC<any>;